import { Platform } from 'react-native';

import tokens from '../../design-tokens.json';

export const Layout = tokens.layout;

export const MaxContentWidth = tokens.layout.contentMaxWidth;
export const ScreenGutter = tokens.layout.screenGutter;

/** Mobile-first breakpoints (px). Use with useBreakpoint or useWindowDimensions. */
export const Breakpoints = tokens.layout.breakpoints as {
  sm: number;
  md: number;
  lg: number;
  xl: number;
  '2xl': number;
};

// App shell env/config, not design tokens.
export const BottomTabInset = Platform.select({ ios: 50, android: 80 }) ?? 0;