@tamagui/themes 1.15.14 → 1.15.16

package/dist/esm/index.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx"],
-  "sourcesContent": ["// import generatedThemes from './generated'\n// import { themes as runtimeThemes } from './themes'\n\n// export const themes =\n//   process.env.NODE_ENV === 'development'\n//     ? runtimeThemes\n//     : (generatedThemes as typeof runtimeThemes)\n\nexport * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
   "mappings": "AAQA,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/dist/esm/index.mjs.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx"],
-  "sourcesContent": ["// import generatedThemes from './generated'\n// import { themes as runtimeThemes } from './themes'\n\n// export const themes =\n//   process.env.NODE_ENV === 'development'\n//     ? runtimeThemes\n//     : (generatedThemes as typeof runtimeThemes)\n\nexport * from './themes'\nexport * from './tokens'\nexport * from '@tamagui/colors'\n"],
   "mappings": "AAQA,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/dist/esm/themes.js

@@ -120,8 +120,8 @@ const darkShadows = {
 const lightTemplate = {
   ...template,
   background: 2,
-  backgroundHover: 2,
-  backgroundPress: 3,
+  backgroundHover: 3,
+  backgroundPress: 4,
   // our light color palette is... a bit unique
   borderColor: 6,
   borderColorHover: 7,

package/dist/esm/themes.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/themes.tsx"],
-  "sourcesContent": ["import {\n  MaskOptions,\n  addChildren,\n  applyMask,\n  createStrengthenMask,\n  createTheme,\n  createWeakenMask,\n  skipMask,\n} from '@tamagui/create-theme'\n\nimport { colorTokens, darkColors, lightColors, tokens } from './tokens'\n\ntype ColorName = keyof typeof colorTokens.dark\n\nconst lightTransparent = 'rgba(255,255,255,0)'\nconst darkTransparent = 'rgba(10,10,10,0)'\n\n// background => foreground\nconst palettes = {\n  dark: [\n    darkTransparent,\n    '#050505',\n    '#151515',\n    '#191919',\n    '#232323',\n    '#282828',\n    '#323232',\n    '#424242',\n    '#494949',\n    '#545454',\n    '#626262',\n    '#a5a5a5',\n    '#fff',\n    lightTransparent,\n  ],\n  light: [\n    lightTransparent,\n    '#fff',\n    '#f9f9f9',\n    'hsl(0, 0%, 97.3%)',\n    'hsl(0, 0%, 95.1%)',\n    'hsl(0, 0%, 94.0%)',\n    'hsl(0, 0%, 92.0%)',\n    'hsl(0, 0%, 89.5%)',\n    'hsl(0, 0%, 81.0%)',\n    'hsl(0, 0%, 56.1%)',\n    'hsl(0, 0%, 50.3%)',\n    'hsl(0, 0%, 42.5%)',\n    'hsl(0, 0%, 9.0%)',\n    darkTransparent,\n  ],\n}\n\nconst templateColors = {\n  color1: 1,\n  color2: 2,\n  color3: 3,\n  color4: 4,\n  color5: 5,\n  color6: 6,\n  color7: 7,\n  color8: 8,\n  color9: 9,\n  color10: 10,\n  color11: 11,\n  color12: 12,\n}\n\nconst templateShadows = {\n  shadowColor: 1,\n  shadowColorHover: 1,\n  shadowColorPress: 2,\n  shadowColorFocus: 2,\n}\n\n// we can use subset of our template as a \"override\" so it doesn't get adjusted with masks\n// we want to skip over templateColor + templateShadows\nconst toSkip = {\n  ...templateColors,\n  ...templateShadows,\n}\n\nconst override = Object.fromEntries(Object.entries(toSkip).map(([k]) => [k, 0]))\nconst overrideShadows = Object.fromEntries(\n  Object.entries(templateShadows).map(([k]) => [k, 0])\n)\nconst overrideWithColors = {\n  ...override,\n  color: 0,\n  colorHover: 0,\n  colorFocus: 0,\n  colorPress: 0,\n}\n\n// templates use the palette and specify index\n// negative goes backwards from end so -1 is the last item\nconst template = {\n  ...toSkip,\n  // the background, color, etc keys here work like generics - they make it so you\n  // can publish components for others to use without mandating a specific color scale\n  // the @tamagui/button Button component looks for `$background`, so you set the\n  // dark_red_Button theme to have a stronger background than the dark_red theme.\n  background: 2,\n  backgroundHover: 3,\n  backgroundPress: 4,\n  backgroundFocus: 2,\n  backgroundStrong: 1,\n  backgroundTransparent: 0,\n  color: -1,\n  colorHover: -2,\n  colorPress: -1,\n  colorFocus: -2,\n  colorTransparent: -0,\n  borderColor: 4,\n  borderColorHover: 5,\n  borderColorPress: 3,\n  borderColorFocus: 4,\n  placeholderColor: -4,\n}\n\nconst lightShadowColor = 'rgba(0,0,0,0.02)'\nconst lightShadowColorStrong = 'rgba(0,0,0,0.066)'\nconst darkShadowColor = 'rgba(0,0,0,0.2)'\nconst darkShadowColorStrong = 'rgba(0,0,0,0.3)'\n\nconst lightShadows = {\n  shadowColor: lightShadowColorStrong,\n  shadowColorHover: lightShadowColorStrong,\n  shadowColorPress: lightShadowColor,\n  shadowColorFocus: lightShadowColor,\n}\n\nconst darkShadows = {\n  shadowColor: darkShadowColorStrong,\n  shadowColorHover: darkShadowColorStrong,\n  shadowColorPress: darkShadowColor,\n  shadowColorFocus: darkShadowColor,\n}\n\nconst lightTemplate = {\n  ...template,\n\n  background: 2,\n  backgroundHover: 2,\n  backgroundPress: 3,\n\n  // our light color palette is... a bit unique\n  borderColor: 6,\n  borderColorHover: 7,\n  borderColorFocus: 5,\n  borderColorPress: 6,\n  ...lightShadows,\n}\n\nconst darkTemplate = { ...template, ...darkShadows }\n\nconst light = createTheme(palettes.light, lightTemplate)\nconst dark = createTheme(palettes.dark, darkTemplate)\n\ntype SubTheme = typeof light\n\nconst baseThemes: {\n  light: SubTheme\n  dark: SubTheme\n} = {\n  light,\n  dark,\n}\n\nconst masks = {\n  skip: skipMask,\n  weaker: createWeakenMask(),\n  stronger: createStrengthenMask(),\n}\n\n// default mask options for most uses\nconst maskOptions: MaskOptions = {\n  override,\n  skip: toSkip,\n  // avoids the transparent ends\n  max: palettes.light.length - 2,\n  min: 1,\n}\n\nconst transparent = (hsl: string, opacity = 0) =>\n  hsl.replace(`%)`, `%, ${opacity})`).replace(`hsl(`, `hsla(`)\n\n// setup colorThemes and their inverses\nconst [lightColorThemes, darkColorThemes] = [colorTokens.light, colorTokens.dark].map(\n  (colorSet, i) => {\n    const isLight = i === 0\n    const theme = baseThemes[isLight ? 'light' : 'dark']\n\n    return Object.fromEntries(\n      Object.keys(colorSet).map((color) => {\n        const colorPalette = Object.values(colorSet[color]) as string[]\n        // were re-ordering these\n        const [head, tail] = [\n          colorPalette.slice(0, 6),\n          colorPalette.slice(colorPalette.length - 5),\n        ]\n        // add our transparent colors first/last\n        // and make sure the last (foreground) color is white/black rather than colorful\n        // this is mostly for consistency with the older theme-base\n        const palette = [\n          transparent(colorPalette[0]),\n          ...head,\n          ...tail,\n          theme.color,\n          transparent(colorPalette[colorPalette.length - 1]),\n        ]\n\n        const colorTheme = createTheme(\n          palette,\n          isLight\n            ? {\n                ...lightTemplate,\n                // light color themes are a bit less sensitive\n                borderColor: 4,\n                borderColorHover: 5,\n                borderColorFocus: 4,\n                borderColorPress: 4,\n              }\n            : darkTemplate\n        )\n\n        return [color, colorTheme]\n      })\n    ) as Record<ColorName, SubTheme>\n  }\n)\n\nconst allThemes = addChildren(baseThemes, (name, theme) => {\n  const isLight = name === 'light'\n  const inverseName = isLight ? 'dark' : 'light'\n  const inverseTheme = baseThemes[inverseName]\n  const colorThemes = isLight ? lightColorThemes : darkColorThemes\n  const inverseColorThemes = isLight ? darkColorThemes : lightColorThemes\n\n  const allColorThemes = addChildren(colorThemes, (colorName, colorTheme) => {\n    const inverse = inverseColorThemes[colorName]\n    return {\n      ...getAltThemes({\n        theme: colorTheme,\n        inverse,\n        isLight,\n      }),\n      ...getComponentThemes(colorTheme, inverse, isLight),\n    }\n  })\n\n  const baseSubThemes = {\n    ...getAltThemes({ theme, inverse: inverseTheme, isLight }),\n    ...getComponentThemes(theme, inverseTheme, isLight),\n  }\n\n  return {\n    ...baseSubThemes,\n    ...allColorThemes,\n  }\n})\n\nfunction getAltThemes({\n  theme,\n  inverse,\n  isLight,\n  activeTheme,\n}: {\n  theme: SubTheme\n  inverse: SubTheme\n  isLight: boolean\n  activeTheme?: SubTheme\n}) {\n  const maskOptionsAlt = {\n    ...maskOptions,\n    override: overrideShadows,\n  }\n  const alt1 = applyMask(theme, masks.weaker, maskOptionsAlt)\n  const alt2 = applyMask(alt1, masks.weaker, maskOptionsAlt)\n\n  const active =\n    activeTheme ??\n    (process.env.ACTIVE_THEME_INVERSE\n      ? inverse\n      : (() => {\n          return applyMask(theme, masks.weaker, {\n            ...maskOptions,\n            strength: 3,\n            skip: {\n              ...maskOptions.skip,\n              color: 1,\n            },\n          })\n        })())\n\n  return addChildren({ alt1, alt2, active }, (_, subTheme) => {\n    return getComponentThemes(subTheme, subTheme === inverse ? theme : inverse, isLight)\n  })\n}\n\nfunction getComponentThemes(theme: SubTheme, inverse: SubTheme, isLight: boolean) {\n  const weaker1 = applyMask(theme, masks.weaker, maskOptions)\n  const weaker2 = applyMask(weaker1, masks.weaker, {\n    ...maskOptions,\n    override: overrideWithColors,\n  })\n  const stronger1 = applyMask(theme, masks.stronger, maskOptions)\n  const inverse1 = applyMask(inverse, masks.weaker, maskOptions)\n  const inverse2 = applyMask(inverse1, masks.weaker, maskOptions)\n  const strongerBorderLighterBackground: SubTheme = isLight\n    ? {\n        ...stronger1,\n        borderColor: weaker1.borderColor,\n        borderColorHover: weaker1.borderColorHover,\n        borderColorPress: weaker1.borderColorPress,\n        borderColorFocus: weaker1.borderColorFocus,\n      }\n    : {\n        ...applyMask(theme, masks.skip, maskOptions),\n        borderColor: weaker1.borderColor,\n        borderColorHover: weaker1.borderColorHover,\n        borderColorPress: weaker1.borderColorPress,\n        borderColorFocus: weaker1.borderColorFocus,\n      }\n\n  return {\n    ListItem: stronger1,\n    Card: weaker1,\n    Button: weaker2,\n    Checkbox: weaker2,\n    DrawerFrame: weaker1,\n    SliderTrack: stronger1,\n    SliderTrackActive: weaker2,\n    SliderThumb: inverse1,\n    Progress: weaker1,\n    ProgressIndicator: inverse,\n    Switch: weaker2,\n    SwitchThumb: inverse2,\n    TooltipArrow: weaker1,\n    TooltipContent: weaker2,\n    Input: strongerBorderLighterBackground,\n    TextArea: strongerBorderLighterBackground,\n    Tooltip: inverse1,\n  }\n}\n\nexport const themes = {\n  ...allThemes,\n  // bring back the full type, the rest use a subset to avoid clogging up ts,\n  // tamagui will be smart and use the top level themes as the type for useTheme() etc\n  light: createTheme(palettes.light, lightTemplate, { nonInheritedValues: lightColors }),\n  dark: createTheme(palettes.dark, darkTemplate, { nonInheritedValues: darkColors }),\n}\n\n// if (process.env.NODE_ENV === 'development') {\n//   console.log(JSON.stringify(themes).length)\n// }\n"],
   "mappings": "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",
   "names": []
 }

package/dist/esm/themes.mjs

@@ -120,8 +120,8 @@ const darkShadows = {
 const lightTemplate = {
   ...template,
   background: 2,
-  backgroundHover: 2,
-  backgroundPress: 3,
+  backgroundHover: 3,
+  backgroundPress: 4,
   // our light color palette is... a bit unique
   borderColor: 6,
   borderColorHover: 7,

package/dist/esm/themes.mjs.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/themes.tsx"],
-  "sourcesContent": ["import {\n  MaskOptions,\n  addChildren,\n  applyMask,\n  createStrengthenMask,\n  createTheme,\n  createWeakenMask,\n  skipMask,\n} from '@tamagui/create-theme'\n\nimport { colorTokens, darkColors, lightColors, tokens } from './tokens'\n\ntype ColorName = keyof typeof colorTokens.dark\n\nconst lightTransparent = 'rgba(255,255,255,0)'\nconst darkTransparent = 'rgba(10,10,10,0)'\n\n// background => foreground\nconst palettes = {\n  dark: [\n    darkTransparent,\n    '#050505',\n    '#151515',\n    '#191919',\n    '#232323',\n    '#282828',\n    '#323232',\n    '#424242',\n    '#494949',\n    '#545454',\n    '#626262',\n    '#a5a5a5',\n    '#fff',\n    lightTransparent,\n  ],\n  light: [\n    lightTransparent,\n    '#fff',\n    '#f9f9f9',\n    'hsl(0, 0%, 97.3%)',\n    'hsl(0, 0%, 95.1%)',\n    'hsl(0, 0%, 94.0%)',\n    'hsl(0, 0%, 92.0%)',\n    'hsl(0, 0%, 89.5%)',\n    'hsl(0, 0%, 81.0%)',\n    'hsl(0, 0%, 56.1%)',\n    'hsl(0, 0%, 50.3%)',\n    'hsl(0, 0%, 42.5%)',\n    'hsl(0, 0%, 9.0%)',\n    darkTransparent,\n  ],\n}\n\nconst templateColors = {\n  color1: 1,\n  color2: 2,\n  color3: 3,\n  color4: 4,\n  color5: 5,\n  color6: 6,\n  color7: 7,\n  color8: 8,\n  color9: 9,\n  color10: 10,\n  color11: 11,\n  color12: 12,\n}\n\nconst templateShadows = {\n  shadowColor: 1,\n  shadowColorHover: 1,\n  shadowColorPress: 2,\n  shadowColorFocus: 2,\n}\n\n// we can use subset of our template as a \"override\" so it doesn't get adjusted with masks\n// we want to skip over templateColor + templateShadows\nconst toSkip = {\n  ...templateColors,\n  ...templateShadows,\n}\n\nconst override = Object.fromEntries(Object.entries(toSkip).map(([k]) => [k, 0]))\nconst overrideShadows = Object.fromEntries(\n  Object.entries(templateShadows).map(([k]) => [k, 0])\n)\nconst overrideWithColors = {\n  ...override,\n  color: 0,\n  colorHover: 0,\n  colorFocus: 0,\n  colorPress: 0,\n}\n\n// templates use the palette and specify index\n// negative goes backwards from end so -1 is the last item\nconst template = {\n  ...toSkip,\n  // the background, color, etc keys here work like generics - they make it so you\n  // can publish components for others to use without mandating a specific color scale\n  // the @tamagui/button Button component looks for `$background`, so you set the\n  // dark_red_Button theme to have a stronger background than the dark_red theme.\n  background: 2,\n  backgroundHover: 3,\n  backgroundPress: 4,\n  backgroundFocus: 2,\n  backgroundStrong: 1,\n  backgroundTransparent: 0,\n  color: -1,\n  colorHover: -2,\n  colorPress: -1,\n  colorFocus: -2,\n  colorTransparent: -0,\n  borderColor: 4,\n  borderColorHover: 5,\n  borderColorPress: 3,\n  borderColorFocus: 4,\n  placeholderColor: -4,\n}\n\nconst lightShadowColor = 'rgba(0,0,0,0.02)'\nconst lightShadowColorStrong = 'rgba(0,0,0,0.066)'\nconst darkShadowColor = 'rgba(0,0,0,0.2)'\nconst darkShadowColorStrong = 'rgba(0,0,0,0.3)'\n\nconst lightShadows = {\n  shadowColor: lightShadowColorStrong,\n  shadowColorHover: lightShadowColorStrong,\n  shadowColorPress: lightShadowColor,\n  shadowColorFocus: lightShadowColor,\n}\n\nconst darkShadows = {\n  shadowColor: darkShadowColorStrong,\n  shadowColorHover: darkShadowColorStrong,\n  shadowColorPress: darkShadowColor,\n  shadowColorFocus: darkShadowColor,\n}\n\nconst lightTemplate = {\n  ...template,\n\n  background: 2,\n  backgroundHover: 2,\n  backgroundPress: 3,\n\n  // our light color palette is... a bit unique\n  borderColor: 6,\n  borderColorHover: 7,\n  borderColorFocus: 5,\n  borderColorPress: 6,\n  ...lightShadows,\n}\n\nconst darkTemplate = { ...template, ...darkShadows }\n\nconst light = createTheme(palettes.light, lightTemplate)\nconst dark = createTheme(palettes.dark, darkTemplate)\n\ntype SubTheme = typeof light\n\nconst baseThemes: {\n  light: SubTheme\n  dark: SubTheme\n} = {\n  light,\n  dark,\n}\n\nconst masks = {\n  skip: skipMask,\n  weaker: createWeakenMask(),\n  stronger: createStrengthenMask(),\n}\n\n// default mask options for most uses\nconst maskOptions: MaskOptions = {\n  override,\n  skip: toSkip,\n  // avoids the transparent ends\n  max: palettes.light.length - 2,\n  min: 1,\n}\n\nconst transparent = (hsl: string, opacity = 0) =>\n  hsl.replace(`%)`, `%, ${opacity})`).replace(`hsl(`, `hsla(`)\n\n// setup colorThemes and their inverses\nconst [lightColorThemes, darkColorThemes] = [colorTokens.light, colorTokens.dark].map(\n  (colorSet, i) => {\n    const isLight = i === 0\n    const theme = baseThemes[isLight ? 'light' : 'dark']\n\n    return Object.fromEntries(\n      Object.keys(colorSet).map((color) => {\n        const colorPalette = Object.values(colorSet[color]) as string[]\n        // were re-ordering these\n        const [head, tail] = [\n          colorPalette.slice(0, 6),\n          colorPalette.slice(colorPalette.length - 5),\n        ]\n        // add our transparent colors first/last\n        // and make sure the last (foreground) color is white/black rather than colorful\n        // this is mostly for consistency with the older theme-base\n        const palette = [\n          transparent(colorPalette[0]),\n          ...head,\n          ...tail,\n          theme.color,\n          transparent(colorPalette[colorPalette.length - 1]),\n        ]\n\n        const colorTheme = createTheme(\n          palette,\n          isLight\n            ? {\n                ...lightTemplate,\n                // light color themes are a bit less sensitive\n                borderColor: 4,\n                borderColorHover: 5,\n                borderColorFocus: 4,\n                borderColorPress: 4,\n              }\n            : darkTemplate\n        )\n\n        return [color, colorTheme]\n      })\n    ) as Record<ColorName, SubTheme>\n  }\n)\n\nconst allThemes = addChildren(baseThemes, (name, theme) => {\n  const isLight = name === 'light'\n  const inverseName = isLight ? 'dark' : 'light'\n  const inverseTheme = baseThemes[inverseName]\n  const colorThemes = isLight ? lightColorThemes : darkColorThemes\n  const inverseColorThemes = isLight ? darkColorThemes : lightColorThemes\n\n  const allColorThemes = addChildren(colorThemes, (colorName, colorTheme) => {\n    const inverse = inverseColorThemes[colorName]\n    return {\n      ...getAltThemes({\n        theme: colorTheme,\n        inverse,\n        isLight,\n      }),\n      ...getComponentThemes(colorTheme, inverse, isLight),\n    }\n  })\n\n  const baseSubThemes = {\n    ...getAltThemes({ theme, inverse: inverseTheme, isLight }),\n    ...getComponentThemes(theme, inverseTheme, isLight),\n  }\n\n  return {\n    ...baseSubThemes,\n    ...allColorThemes,\n  }\n})\n\nfunction getAltThemes({\n  theme,\n  inverse,\n  isLight,\n  activeTheme,\n}: {\n  theme: SubTheme\n  inverse: SubTheme\n  isLight: boolean\n  activeTheme?: SubTheme\n}) {\n  const maskOptionsAlt = {\n    ...maskOptions,\n    override: overrideShadows,\n  }\n  const alt1 = applyMask(theme, masks.weaker, maskOptionsAlt)\n  const alt2 = applyMask(alt1, masks.weaker, maskOptionsAlt)\n\n  const active =\n    activeTheme ??\n    (process.env.ACTIVE_THEME_INVERSE\n      ? inverse\n      : (() => {\n          return applyMask(theme, masks.weaker, {\n            ...maskOptions,\n            strength: 3,\n            skip: {\n              ...maskOptions.skip,\n              color: 1,\n            },\n          })\n        })())\n\n  return addChildren({ alt1, alt2, active }, (_, subTheme) => {\n    return getComponentThemes(subTheme, subTheme === inverse ? theme : inverse, isLight)\n  })\n}\n\nfunction getComponentThemes(theme: SubTheme, inverse: SubTheme, isLight: boolean) {\n  const weaker1 = applyMask(theme, masks.weaker, maskOptions)\n  const weaker2 = applyMask(weaker1, masks.weaker, {\n    ...maskOptions,\n    override: overrideWithColors,\n  })\n  const stronger1 = applyMask(theme, masks.stronger, maskOptions)\n  const inverse1 = applyMask(inverse, masks.weaker, maskOptions)\n  const inverse2 = applyMask(inverse1, masks.weaker, maskOptions)\n  const strongerBorderLighterBackground: SubTheme = isLight\n    ? {\n        ...stronger1,\n        borderColor: weaker1.borderColor,\n        borderColorHover: weaker1.borderColorHover,\n        borderColorPress: weaker1.borderColorPress,\n        borderColorFocus: weaker1.borderColorFocus,\n      }\n    : {\n        ...applyMask(theme, masks.skip, maskOptions),\n        borderColor: weaker1.borderColor,\n        borderColorHover: weaker1.borderColorHover,\n        borderColorPress: weaker1.borderColorPress,\n        borderColorFocus: weaker1.borderColorFocus,\n      }\n\n  return {\n    ListItem: stronger1,\n    Card: weaker1,\n    Button: weaker2,\n    Checkbox: weaker2,\n    DrawerFrame: weaker1,\n    SliderTrack: stronger1,\n    SliderTrackActive: weaker2,\n    SliderThumb: inverse1,\n    Progress: weaker1,\n    ProgressIndicator: inverse,\n    Switch: weaker2,\n    SwitchThumb: inverse2,\n    TooltipArrow: weaker1,\n    TooltipContent: weaker2,\n    Input: strongerBorderLighterBackground,\n    TextArea: strongerBorderLighterBackground,\n    Tooltip: inverse1,\n  }\n}\n\nexport const themes = {\n  ...allThemes,\n  // bring back the full type, the rest use a subset to avoid clogging up ts,\n  // tamagui will be smart and use the top level themes as the type for useTheme() etc\n  light: createTheme(palettes.light, lightTemplate, { nonInheritedValues: lightColors }),\n  dark: createTheme(palettes.dark, darkTemplate, { nonInheritedValues: darkColors }),\n}\n\n// if (process.env.NODE_ENV === 'development') {\n//   console.log(JSON.stringify(themes).length)\n// }\n"],
   "mappings": "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",
   "names": []
 }

package/dist/esm/tokens.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/tokens.tsx"],
-  "sourcesContent": ["import {\n  blue,\n  blueDark,\n  gray,\n  grayDark,\n  green,\n  greenDark,\n  orange,\n  orangeDark,\n  pink,\n  pinkDark,\n  purple,\n  purpleDark,\n  red,\n  redDark,\n  yellow,\n  yellowDark,\n} from '@tamagui/colors'\nimport { Variable, createTokens } from '@tamagui/web'\n\n// should roughly map to button/input etc height at each level\n// fonts should match that height/lineHeight at each stop\n// so these are really non-linear on purpose\n// why?\n//   - at sizes <1, used for fine grained things (borders, smallest paddingY)\n//     - so smallest padY should be roughly 1-4px so it can join with lineHeight\n//   - at sizes >=1, have to consider \"pressability\" (jumps up)\n//   - after that it should go upwards somewhat naturally\n//   - H1 / headings top out at 10 naturally, so after 10 we can go upwards faster\n//  but also one more wrinkle...\n//  space is used in conjunction with size\n//  i'm setting space to generally just a fixed fraction of size (~1/3-2/3 still fine tuning)\nexport const size = {\n  $0: 0,\n  '$0.25': 2,\n  '$0.5': 4,\n  '$0.75': 8,\n  $1: 20,\n  '$1.5': 24,\n  $2: 28,\n  '$2.5': 32,\n  $3: 36,\n  '$3.5': 40,\n  $4: 44,\n  $true: 44,\n  '$4.5': 48,\n  $5: 52,\n  $6: 64,\n  $7: 74,\n  $8: 84,\n  $9: 94,\n  $10: 104,\n  $11: 124,\n  $12: 144,\n  $13: 164,\n  $14: 184,\n  $15: 204,\n  $16: 224,\n  $17: 224,\n  $18: 244,\n  $19: 264,\n  $20: 284,\n}\n\ntype SizeKeysIn = keyof typeof size\ntype Sizes = {\n  [Key in SizeKeysIn extends `$${infer Key}` ? Key : SizeKeysIn]: number\n}\ntype SizeKeys = `${keyof Sizes extends `${infer K}` ? K : never}`\n\nconst spaces = Object.entries(size).map(([k, v]) => {\n  return [k, sizeToSpace(v)] as const\n})\n\n// a bit odd but keeping backward compat for values >8 while fixing below\nfunction sizeToSpace(v: number) {\n  if (v === 0) return 0\n  if (v === 2) return 0.5\n  if (v === 4) return 1\n  if (v === 8) return 1.5\n  if (v <= 16) return Math.round(v * 0.333)\n  return Math.floor(v * 0.7 - 12)\n}\n\nconst spacesNegative = spaces.slice(1).map(([k, v]) => [`-${k.slice(1)}`, -v])\n\ntype SizeKeysWithNegatives =\n  | Exclude<`-${SizeKeys extends `$${infer Key}` ? Key : SizeKeys}`, '-0'>\n  | SizeKeys\n\nexport const space: {\n  [Key in SizeKeysWithNegatives]: Key extends keyof Sizes ? Sizes[Key] : number\n} = {\n  ...Object.fromEntries(spaces),\n  ...Object.fromEntries(spacesNegative),\n} as any\n\nexport const zIndex = {\n  0: 0,\n  1: 100,\n  2: 200,\n  3: 300,\n  4: 400,\n  5: 500,\n}\n\nexport const colorTokens = {\n  light: {\n    blue: blue,\n    gray: gray,\n    green: green,\n    orange: orange,\n    pink: pink,\n    purple: purple,\n    red: red,\n    yellow: yellow,\n  },\n  dark: {\n    blue: blueDark,\n    gray: grayDark,\n    green: greenDark,\n    orange: orangeDark,\n    pink: pinkDark,\n    purple: purpleDark,\n    red: redDark,\n    yellow: yellowDark,\n  },\n}\n\nexport const darkColors = {\n  ...colorTokens.dark.blue,\n  ...colorTokens.dark.gray,\n  ...colorTokens.dark.green,\n  ...colorTokens.dark.orange,\n  ...colorTokens.dark.pink,\n  ...colorTokens.dark.purple,\n  ...colorTokens.dark.red,\n  ...colorTokens.dark.yellow,\n}\n\nexport const lightColors = {\n  ...colorTokens.light.blue,\n  ...colorTokens.light.gray,\n  ...colorTokens.light.green,\n  ...colorTokens.light.orange,\n  ...colorTokens.light.pink,\n  ...colorTokens.light.purple,\n  ...colorTokens.light.red,\n  ...colorTokens.light.yellow,\n}\n\nexport const color = {\n  ...postfixObjKeys(lightColors, 'Light'),\n  ...postfixObjKeys(darkColors, 'Dark'),\n}\n\nfunction postfixObjKeys<\n  A extends { [key: string]: Variable<string> | string },\n  B extends string\n>(\n  obj: A,\n  postfix: B\n): {\n  [Key in `${keyof A extends string ? keyof A : never}${B}`]: Variable<string> | string\n} {\n  return Object.fromEntries(\n    Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v])\n  ) as any\n}\n\nexport const radius = {\n  0: 0,\n  1: 3,\n  2: 5,\n  3: 7,\n  4: 9,\n  true: 9,\n  5: 10,\n  6: 16,\n  7: 19,\n  8: 22,\n  9: 26,\n  10: 34,\n  11: 42,\n  12: 50,\n}\n\nexport const tokens = createTokens({\n  color,\n  radius,\n  zIndex,\n  space,\n  size,\n})\n"],
   "mappings": "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",
   "names": []
 }

package/dist/esm/tokens.mjs.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/tokens.tsx"],
-  "sourcesContent": ["import {\n  blue,\n  blueDark,\n  gray,\n  grayDark,\n  green,\n  greenDark,\n  orange,\n  orangeDark,\n  pink,\n  pinkDark,\n  purple,\n  purpleDark,\n  red,\n  redDark,\n  yellow,\n  yellowDark,\n} from '@tamagui/colors'\nimport { Variable, createTokens } from '@tamagui/web'\n\n// should roughly map to button/input etc height at each level\n// fonts should match that height/lineHeight at each stop\n// so these are really non-linear on purpose\n// why?\n//   - at sizes <1, used for fine grained things (borders, smallest paddingY)\n//     - so smallest padY should be roughly 1-4px so it can join with lineHeight\n//   - at sizes >=1, have to consider \"pressability\" (jumps up)\n//   - after that it should go upwards somewhat naturally\n//   - H1 / headings top out at 10 naturally, so after 10 we can go upwards faster\n//  but also one more wrinkle...\n//  space is used in conjunction with size\n//  i'm setting space to generally just a fixed fraction of size (~1/3-2/3 still fine tuning)\nexport const size = {\n  $0: 0,\n  '$0.25': 2,\n  '$0.5': 4,\n  '$0.75': 8,\n  $1: 20,\n  '$1.5': 24,\n  $2: 28,\n  '$2.5': 32,\n  $3: 36,\n  '$3.5': 40,\n  $4: 44,\n  $true: 44,\n  '$4.5': 48,\n  $5: 52,\n  $6: 64,\n  $7: 74,\n  $8: 84,\n  $9: 94,\n  $10: 104,\n  $11: 124,\n  $12: 144,\n  $13: 164,\n  $14: 184,\n  $15: 204,\n  $16: 224,\n  $17: 224,\n  $18: 244,\n  $19: 264,\n  $20: 284,\n}\n\ntype SizeKeysIn = keyof typeof size\ntype Sizes = {\n  [Key in SizeKeysIn extends `$${infer Key}` ? Key : SizeKeysIn]: number\n}\ntype SizeKeys = `${keyof Sizes extends `${infer K}` ? K : never}`\n\nconst spaces = Object.entries(size).map(([k, v]) => {\n  return [k, sizeToSpace(v)] as const\n})\n\n// a bit odd but keeping backward compat for values >8 while fixing below\nfunction sizeToSpace(v: number) {\n  if (v === 0) return 0\n  if (v === 2) return 0.5\n  if (v === 4) return 1\n  if (v === 8) return 1.5\n  if (v <= 16) return Math.round(v * 0.333)\n  return Math.floor(v * 0.7 - 12)\n}\n\nconst spacesNegative = spaces.slice(1).map(([k, v]) => [`-${k.slice(1)}`, -v])\n\ntype SizeKeysWithNegatives =\n  | Exclude<`-${SizeKeys extends `$${infer Key}` ? Key : SizeKeys}`, '-0'>\n  | SizeKeys\n\nexport const space: {\n  [Key in SizeKeysWithNegatives]: Key extends keyof Sizes ? Sizes[Key] : number\n} = {\n  ...Object.fromEntries(spaces),\n  ...Object.fromEntries(spacesNegative),\n} as any\n\nexport const zIndex = {\n  0: 0,\n  1: 100,\n  2: 200,\n  3: 300,\n  4: 400,\n  5: 500,\n}\n\nexport const colorTokens = {\n  light: {\n    blue: blue,\n    gray: gray,\n    green: green,\n    orange: orange,\n    pink: pink,\n    purple: purple,\n    red: red,\n    yellow: yellow,\n  },\n  dark: {\n    blue: blueDark,\n    gray: grayDark,\n    green: greenDark,\n    orange: orangeDark,\n    pink: pinkDark,\n    purple: purpleDark,\n    red: redDark,\n    yellow: yellowDark,\n  },\n}\n\nexport const darkColors = {\n  ...colorTokens.dark.blue,\n  ...colorTokens.dark.gray,\n  ...colorTokens.dark.green,\n  ...colorTokens.dark.orange,\n  ...colorTokens.dark.pink,\n  ...colorTokens.dark.purple,\n  ...colorTokens.dark.red,\n  ...colorTokens.dark.yellow,\n}\n\nexport const lightColors = {\n  ...colorTokens.light.blue,\n  ...colorTokens.light.gray,\n  ...colorTokens.light.green,\n  ...colorTokens.light.orange,\n  ...colorTokens.light.pink,\n  ...colorTokens.light.purple,\n  ...colorTokens.light.red,\n  ...colorTokens.light.yellow,\n}\n\nexport const color = {\n  ...postfixObjKeys(lightColors, 'Light'),\n  ...postfixObjKeys(darkColors, 'Dark'),\n}\n\nfunction postfixObjKeys<\n  A extends { [key: string]: Variable<string> | string },\n  B extends string\n>(\n  obj: A,\n  postfix: B\n): {\n  [Key in `${keyof A extends string ? keyof A : never}${B}`]: Variable<string> | string\n} {\n  return Object.fromEntries(\n    Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v])\n  ) as any\n}\n\nexport const radius = {\n  0: 0,\n  1: 3,\n  2: 5,\n  3: 7,\n  4: 9,\n  true: 9,\n  5: 10,\n  6: 16,\n  7: 19,\n  8: 22,\n  9: 26,\n  10: 34,\n  11: 42,\n  12: 50,\n}\n\nexport const tokens = createTokens({\n  color,\n  radius,\n  zIndex,\n  space,\n  size,\n})\n"],
   "mappings": "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",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/themes",
-  "version": "1.15.14",
+  "version": "1.15.16",
   "types": "./types/index.d.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -33,12 +33,12 @@
     }
   },
   "dependencies": {
-    "@tamagui/colors": "1.15.14",
-    "@tamagui/create-theme": "1.15.14",
-    "@tamagui/web": "1.15.14"
+    "@tamagui/colors": "1.15.16",
+    "@tamagui/create-theme": "1.15.16",
+    "@tamagui/web": "1.15.16"
   },
   "devDependencies": {
-    "@tamagui/build": "1.15.14"
+    "@tamagui/build": "1.15.16"
   },
   "publishConfig": {
     "access": "public"

package/src/themes.tsx

@@ -141,8 +141,8 @@ const lightTemplate = {
   ...template,
 
   background: 2,
-  backgroundHover: 2,
-  backgroundPress: 3,
+  backgroundHover: 3,
+  backgroundPress: 4,
 
   // our light color palette is... a bit unique
   borderColor: 6,