@tamagui/config 2.7.6 → 3.0.0-beta.637.1

package/src/v3.ts

@@ -1,119 +0,0 @@
-import { tokens, themes as themesIn } from '@tamagui/themes/v3-themes'
-import { animations } from './v3-animations'
-import type { CreateTamaguiProps } from '@tamagui/web'
-
-import { fonts } from './fonts'
-import { media, mediaQueryDefaultActive } from './media'
-
-// fix vite - react native uses global which it doesn't provide
-globalThis['global'] ||= globalThis
-
-// v3 shorthands (inlined from deprecated @tamagui/shorthands/v2)
-export const shorthands = {
-  ussel: 'userSelect',
-  cur: 'cursor',
-  pe: 'pointerEvents',
-  col: 'color',
-  ff: 'fontFamily',
-  fos: 'fontSize',
-  fost: 'fontStyle',
-  fow: 'fontWeight',
-  ls: 'letterSpacing',
-  lh: 'lineHeight',
-  ta: 'textAlign',
-  tt: 'textTransform',
-  ww: 'wordWrap',
-  ac: 'alignContent',
-  ai: 'alignItems',
-  als: 'alignSelf',
-  b: 'bottom',
-  bg: 'backgroundColor',
-  bbc: 'borderBottomColor',
-  bblr: 'borderBottomLeftRadius',
-  bbrr: 'borderBottomRightRadius',
-  bbw: 'borderBottomWidth',
-  blc: 'borderLeftColor',
-  blw: 'borderLeftWidth',
-  bc: 'borderColor',
-  br: 'borderRadius',
-  bs: 'borderStyle',
-  brw: 'borderRightWidth',
-  brc: 'borderRightColor',
-  btc: 'borderTopColor',
-  btlr: 'borderTopLeftRadius',
-  btrr: 'borderTopRightRadius',
-  btw: 'borderTopWidth',
-  bw: 'borderWidth',
-  dsp: 'display',
-  f: 'flex',
-  fb: 'flexBasis',
-  fd: 'flexDirection',
-  fg: 'flexGrow',
-  fs: 'flexShrink',
-  fw: 'flexWrap',
-  h: 'height',
-  jc: 'justifyContent',
-  l: 'left',
-  m: 'margin',
-  mah: 'maxHeight',
-  maw: 'maxWidth',
-  mb: 'marginBottom',
-  mih: 'minHeight',
-  miw: 'minWidth',
-  ml: 'marginLeft',
-  mr: 'marginRight',
-  mt: 'marginTop',
-  mx: 'marginHorizontal',
-  my: 'marginVertical',
-  o: 'opacity',
-  ov: 'overflow',
-  p: 'padding',
-  pb: 'paddingBottom',
-  pl: 'paddingLeft',
-  pos: 'position',
-  pr: 'paddingRight',
-  pt: 'paddingTop',
-  px: 'paddingHorizontal',
-  py: 'paddingVertical',
-  r: 'right',
-  shac: 'shadowColor',
-  shar: 'shadowRadius',
-  shof: 'shadowOffset',
-  shop: 'shadowOpacity',
-  t: 'top',
-  w: 'width',
-  zi: 'zIndex',
-} as const
-
-export { animations } from './v3-animations'
-export { tokens, themes } from '@tamagui/themes/v3-themes'
-export { fonts } from './fonts'
-export { media, mediaQueryDefaultActive } from './media'
-
-export const selectionStyles = (theme) =>
-  theme.color5
-    ? {
-        backgroundColor: theme.color5,
-        color: theme.color11,
-      }
-    : null
-
-// tree shake away themes in production
-const themes =
-  process.env.TAMAGUI_OPTIMIZE_THEMES === 'true' ? ({} as typeof themesIn) : themesIn
-
-export const config = {
-  animations,
-  themes,
-  media,
-  shorthands,
-  tokens,
-  fonts,
-  selectionStyles,
-  settings: {
-    mediaQueryDefaultActive,
-    defaultFont: 'body',
-    fastSchemeChange: true,
-    shouldAddPrefersColorThemes: true,
-  },
-} satisfies CreateTamaguiProps

package/src/v4-animations.native.ts

@@ -1 +0,0 @@
-export { animationsReactNative as animations } from './animationsReactNative'

package/src/v4-animations.ts

@@ -1 +0,0 @@
-export { animationsCSS as animations } from './animationsCSS'

package/src/v4-fonts.ts

@@ -1,61 +0,0 @@
-import type { FillInFont, GenericFont } from '@tamagui/core'
-import { createFont, getVariableValue, isWeb } from '@tamagui/core'
-
-export const createSystemFont = <A extends GenericFont>({
-  font = {},
-  sizeLineHeight = (size) => size + 10,
-  sizeSize = (size) => size * 1,
-}: {
-  font?: Partial<A>
-  sizeLineHeight?: (fontSize: number) => number
-  sizeSize?: (size: number) => number
-} = {}): FillInFont<A, keyof typeof defaultSizes> => {
-  // merge to allow individual overrides
-  const size = Object.fromEntries(
-    Object.entries({
-      ...defaultSizes,
-      ...font.size,
-    }).map(([k, v]) => [k, sizeSize(+v)])
-  )
-  return createFont({
-    family: isWeb
-      ? '-apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
-      : 'System',
-    lineHeight: Object.fromEntries(
-      Object.entries(size).map(([k, v]) => [k, sizeLineHeight(getVariableValue(v))])
-    ),
-    weight: {
-      4: '300',
-    },
-    letterSpacing: {
-      4: 0,
-    },
-    ...(font as any),
-    size,
-  })
-}
-
-const defaultSizes = {
-  1: 11,
-  2: 12,
-  3: 13,
-  4: 14,
-  true: 14,
-  5: 16,
-  6: 18,
-  7: 20,
-  8: 23,
-  9: 30,
-  10: 46,
-  11: 55,
-  12: 62,
-  13: 72,
-  14: 92,
-  15: 114,
-  16: 134,
-} as const
-
-export const fonts = {
-  body: createSystemFont(),
-  heading: createSystemFont({ sizeSize: (n) => n * 1.4 }),
-}

package/src/v4-media.ts

@@ -1,40 +0,0 @@
-// note order is important!
-// earlier defined = less important
-
-export const breakpoints = {
-  '2xl': 1536,
-  xl: 1280,
-  lg: 1024,
-  md: 768,
-  sm: 640,
-  xs: 460,
-  '2xs': 340,
-}
-
-export const media = {
-  maxXs: { maxWidth: breakpoints.xs },
-  max2xs: { maxWidth: breakpoints['2xs'] },
-  maxSm: { maxWidth: breakpoints.sm },
-  maxMd: { maxWidth: breakpoints.md },
-  maxLg: { maxWidth: breakpoints.lg },
-  maxXl: { maxWidth: breakpoints.xl },
-  max2Xl: { maxWidth: breakpoints['2xl'] },
-  // for site
-  '2xl': { minWidth: breakpoints['2xl'] },
-  xl: { minWidth: breakpoints.xl },
-  lg: { minWidth: breakpoints.lg },
-  md: { minWidth: breakpoints.md },
-  sm: { minWidth: breakpoints.sm },
-  xs: { minWidth: breakpoints.xs },
-  '2xs': { minWidth: breakpoints['2xs'] },
-} as const
-
-export const mediaQueryDefaultActive = {
-  '2xl': false,
-  xl: false,
-  lg: false,
-  md: false,
-  sm: false,
-  xs: true,
-  '2xs': true,
-}

package/src/v4.ts

@@ -1,47 +0,0 @@
-import { shorthands } from '@tamagui/shorthands/v4'
-import { tokens, defaultThemes } from '@tamagui/themes/v4'
-import type { CreateTamaguiProps } from '@tamagui/web'
-import { animations } from './v3-animations'
-import { fonts } from './v4-fonts'
-import { media, mediaQueryDefaultActive } from './v4-media'
-
-export { shorthands } from '@tamagui/shorthands/v4'
-export { createThemes } from '@tamagui/theme-builder'
-export { tamaguiThemes, tokens } from '@tamagui/themes/v4'
-export { animations } from './v4-animations'
-export { createSystemFont, fonts } from './v4-fonts'
-export { breakpoints, media, mediaQueryDefaultActive } from './v4-media'
-export { defaultThemes as themes } from '@tamagui/themes/v4'
-
-// Configuration:
-
-export const selectionStyles = (theme) =>
-  theme.color5
-    ? {
-        backgroundColor: theme.color5,
-        color: theme.color11,
-      }
-    : null
-
-export const settings = {
-  mediaQueryDefaultActive,
-  defaultFont: 'body',
-  fastSchemeChange: true,
-  shouldAddPrefersColorThemes: true,
-  allowedStyleValues: 'somewhat-strict-web',
-  addThemeClassName: 'html',
-  onlyAllowShorthands: true,
-  styleCompat: 'legacy',
-  defaultPosition: 'relative',
-} satisfies CreateTamaguiProps['settings']
-
-export const defaultConfig = {
-  animations,
-  media,
-  shorthands,
-  themes: defaultThemes,
-  tokens,
-  fonts,
-  selectionStyles,
-  settings,
-} satisfies CreateTamaguiProps

package/src/v5-media.ts

@@ -1,107 +0,0 @@
-// note order is important!
-// earlier defined = less important
-
-export const breakpoints = {
-  // for container queries its really helpful to have small sizes
-  100: 100,
-  200: 200,
-
-  xxxs: 260,
-  xxs: 340,
-  xs: 460,
-  sm: 640,
-  md: 768,
-  lg: 1024,
-  xl: 1280,
-  xxl: 1536,
-}
-
-const mediaQueryForceNonOverlap = process.env.TAMAGUI_TARGET === 'native' ? 1 : 0.02
-
-export const media = {
-  // always true on native
-  touchable:
-    process.env.TAMAGUI_TARGET === 'native'
-      ? ({ minWidth: 0 } as never)
-      : { pointer: 'coarse' },
-
-  // always false on native (can't hover on touch)
-  hoverable:
-    process.env.TAMAGUI_TARGET === 'native'
-      ? ({ maxWidth: 0 } as never)
-      : { hover: 'hover' },
-
-  // Max-width queries (desktop-first, ordered large-to-small so smaller wins)
-  'max-xxl': { maxWidth: breakpoints.xxl - mediaQueryForceNonOverlap },
-  'max-xl': { maxWidth: breakpoints.xl - mediaQueryForceNonOverlap },
-  'max-lg': { maxWidth: breakpoints.lg - mediaQueryForceNonOverlap },
-  'max-md': { maxWidth: breakpoints.md - mediaQueryForceNonOverlap },
-  'max-sm': { maxWidth: breakpoints.sm - mediaQueryForceNonOverlap },
-  'max-xs': { maxWidth: breakpoints.xs - mediaQueryForceNonOverlap },
-  'max-xxs': { maxWidth: breakpoints.xxs - mediaQueryForceNonOverlap },
-  'max-xxxs': { maxWidth: breakpoints.xxxs - mediaQueryForceNonOverlap },
-
-  // for container queries its really helpful to have small sizes
-  'max-200': { maxWidth: breakpoints['200'] - mediaQueryForceNonOverlap },
-  'max-100': { maxWidth: breakpoints['100'] - mediaQueryForceNonOverlap },
-
-  // Min-width queries (mobile-first)
-  // non-max wins over max though tbh it could go either way
-  xxxs: { minWidth: breakpoints.xxxs },
-  xxs: { minWidth: breakpoints.xxs },
-  xs: { minWidth: breakpoints.xs },
-  sm: { minWidth: breakpoints.sm },
-  md: { minWidth: breakpoints.md },
-  lg: { minWidth: breakpoints.lg },
-  xl: { minWidth: breakpoints.xl },
-  xxl: { minWidth: breakpoints.xxl },
-
-  // Height-based queries LAST so they override width queries when both match
-  // (later in object = higher CSS specificity)
-  // max-height ordered large-to-small so smaller wins (like max-width)
-  'max-height-lg': { maxHeight: breakpoints.lg - mediaQueryForceNonOverlap },
-  'max-height-md': { maxHeight: breakpoints.md - mediaQueryForceNonOverlap },
-  'max-height-sm': { maxHeight: breakpoints.sm - mediaQueryForceNonOverlap },
-  'max-height-xs': { maxHeight: breakpoints.xs - mediaQueryForceNonOverlap },
-  'max-height-xxs': { maxHeight: breakpoints.xxs - mediaQueryForceNonOverlap },
-  'max-height-xxxs': { maxHeight: breakpoints.xxxs - mediaQueryForceNonOverlap },
-
-  'max-height-200': { maxHeight: breakpoints['200'] - mediaQueryForceNonOverlap },
-  'max-height-100': { maxHeight: breakpoints['100'] - mediaQueryForceNonOverlap },
-
-  'height-sm': { minHeight: breakpoints.sm },
-  'height-md': { minHeight: breakpoints.md },
-  'height-lg': { minHeight: breakpoints.lg },
-} as const
-
-export type V5Media = typeof media
-
-export const mediaQueryDefaultActive = {
-  touchable: process.env.TAMAGUI_TARGET === 'native',
-  hoverable: process.env.TAMAGUI_TARGET !== 'native',
-  // Max queries
-  'max-xxl': true,
-  'max-xl': true,
-  'max-lg': true,
-  'max-md': true,
-  'max-sm': true,
-  'max-xs': true,
-  'max-xxs': false,
-  'max-xxxs': false,
-  // Min queries
-  xxxs: true,
-  xxs: true,
-  xs: true,
-  sm: false,
-  md: false,
-  lg: false,
-  xl: false,
-  xxl: false,
-  // Height queries (default: iPhone non-max ~844pt)
-  'max-height-sm': false,
-  'max-height-md': false,
-  'max-height-lg': true,
-  'height-sm': true,
-  'height-md': true,
-  'height-lg': false,
-}

package/tsconfig.json

@@ -1,65 +0,0 @@
-{
-  "extends": "../../../tsconfig.json",
-  "compilerOptions": {
-    "composite": true
-  },
-  "exclude": [
-    "types",
-    "v5.d.ts",
-    "v5.cjs",
-    "v5-css.d.ts",
-    "v5-css.cjs",
-    "v5-rn.d.ts",
-    "v5-rn.cjs",
-    "v5-reanimated.d.ts",
-    "v5-reanimated.cjs",
-    "v5-motion.d.ts",
-    "v5-motion.cjs",
-    "v5-subtle.d.ts",
-    "v5-subtle.cjs",
-    "v4.d.ts",
-    "v4.cjs",
-    "v3.cjs",
-    "v3.d.ts",
-    "v2.d.ts",
-    "v2.cjs",
-    "v2-reanimated.d.ts",
-    "v2-reanimated.js",
-    "v2-native.d.ts",
-    "v2-native.js",
-    "dist",
-    "**/__tests__"
-  ],
-  "references": [
-    {
-      "path": "../animations-css"
-    },
-    {
-      "path": "../animations-moti"
-    },
-    {
-      "path": "../animations-react-native"
-    },
-    {
-      "path": "../colors"
-    },
-    {
-      "path": "../font-inter"
-    },
-    {
-      "path": "../font-silkscreen"
-    },
-    {
-      "path": "../react-native-media-driver"
-    },
-    {
-      "path": "../shorthands"
-    },
-    {
-      "path": "../themes"
-    },
-    {
-      "path": "../web"
-    }
-  ]
-}

package/types/animations.css.d.ts

@@ -1,10 +0,0 @@
-export declare const animations: import("@tamagui/web").AnimationDriver<{
-    '100ms': string;
-    bouncy: string;
-    lazy: string;
-    slow: string;
-    medium: string;
-    quick: string;
-    tooltip: string;
-}>;
-//# sourceMappingURL=animations.css.d.ts.map

package/types/animations.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animations.css.d.ts","sourceRoot":"","sources":["../src/animations.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;;EAQrB,CAAA"}

package/types/animations.d.ts

@@ -1,67 +0,0 @@
-export declare const animations: import("@tamagui/web").AnimationDriver<{
-    '0ms': {
-        type: "timing";
-        duration: number;
-    };
-    '50ms': {
-        type: "timing";
-        duration: number;
-    };
-    '75ms': {
-        type: "timing";
-        duration: number;
-    };
-    '100ms': {
-        type: "timing";
-        duration: number;
-    };
-    '200ms': {
-        type: "timing";
-        duration: number;
-    };
-    '250ms': {
-        type: "timing";
-        duration: number;
-    };
-    '300ms': {
-        type: "timing";
-        duration: number;
-    };
-    '400ms': {
-        type: "timing";
-        duration: number;
-    };
-    '500ms': {
-        type: "timing";
-        duration: number;
-    };
-    bouncy: {
-        damping: number;
-        mass: number;
-        stiffness: number;
-    };
-    lazy: {
-        damping: number;
-        stiffness: number;
-    };
-    medium: {
-        damping: number;
-        stiffness: number;
-        mass: number;
-    };
-    slow: {
-        damping: number;
-        stiffness: number;
-    };
-    quick: {
-        damping: number;
-        mass: number;
-        stiffness: number;
-    };
-    tooltip: {
-        damping: number;
-        mass: number;
-        stiffness: number;
-    };
-}>;
-//# sourceMappingURL=animations.d.ts.map

package/types/animations.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../src/animations.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiErB,CAAA"}

package/types/animations.reanimated.d.ts

@@ -1,40 +0,0 @@
-export declare const animations: import("@tamagui/web").AnimationDriver<{
-    '100ms': {
-        type: string;
-        duration: number;
-    };
-    bouncy: {
-        type: string;
-        damping: number;
-        mass: number;
-        stiffness: number;
-    };
-    lazy: {
-        type: string;
-        damping: number;
-        stiffness: number;
-    };
-    medium: {
-        damping: number;
-        stiffness: number;
-        mass: number;
-    };
-    slow: {
-        type: string;
-        damping: number;
-        stiffness: number;
-    };
-    quick: {
-        type: string;
-        damping: number;
-        mass: number;
-        stiffness: number;
-    };
-    tooltip: {
-        type: string;
-        damping: number;
-        mass: number;
-        stiffness: number;
-    };
-}>;
-//# sourceMappingURL=animations.reanimated.d.ts.map

package/types/animations.reanimated.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animations.reanimated.d.ts","sourceRoot":"","sources":["../src/animations.reanimated.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsCrB,CAAA"}

package/types/animationsCSS.d.ts

@@ -1,28 +0,0 @@
-export declare const animationsCSS: import("@tamagui/web").AnimationDriver<{
-    '0ms': string;
-    '30ms': string;
-    '50ms': string;
-    '75ms': string;
-    '100ms': string;
-    '200ms': string;
-    '250ms': string;
-    '300ms': string;
-    '400ms': string;
-    '500ms': string;
-    superBouncy: string;
-    bouncy: string;
-    kindaBouncy: string;
-    superLazy: string;
-    lazy: string;
-    medium: string;
-    slowest: string;
-    slow: string;
-    quick: string;
-    quickLessBouncy: string;
-    tooltip: string;
-    quicker: string;
-    quickerLessBouncy: string;
-    quickest: string;
-    quickestLessBouncy: string;
-}>;
-//# sourceMappingURL=animationsCSS.d.ts.map

package/types/animationsCSS.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animationsCSS.d.ts","sourceRoot":"","sources":["../src/animationsCSS.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BxB,CAAA"}