@tamagui/themes 1.121.10 → 1.121.12-1737177163952

package/dist/esm/v4-tamagui.native.js

@@ -0,0 +1,209 @@
+import { blue, blueDark, gray, grayDark, green, greenDark, orange, orangeDark, pink, pinkDark, purple, purpleDark, red, redDark, yellow, yellowDark } from "@tamagui/colors";
+import { createThemeSuite } from "./v4-createTheme";
+var colorTokens = {
+  light: {
+    blue,
+    gray,
+    green,
+    orange,
+    pink,
+    purple,
+    red,
+    yellow
+  },
+  dark: {
+    blue: blueDark,
+    gray: grayDark,
+    green: greenDark,
+    orange: orangeDark,
+    pink: pinkDark,
+    purple: purpleDark,
+    red: redDark,
+    yellow: yellowDark
+  }
+}, darkPalette = [
+  "#050505",
+  "#151515",
+  "#191919",
+  "#232323",
+  "#282828",
+  "#323232",
+  "#424242",
+  "#494949",
+  "#545454",
+  "#626262",
+  "#a5a5a5",
+  "#fff"
+], lightPalette = [
+  "#fff",
+  "#f8f8f8",
+  "hsl(0, 0%, 96.3%)",
+  "hsl(0, 0%, 94.1%)",
+  "hsl(0, 0%, 92.0%)",
+  "hsl(0, 0%, 90.0%)",
+  "hsl(0, 0%, 88.5%)",
+  "hsl(0, 0%, 81.0%)",
+  "hsl(0, 0%, 56.1%)",
+  "hsl(0, 0%, 50.3%)",
+  "hsl(0, 0%, 42.5%)",
+  "hsl(0, 0%, 9.0%)"
+], lightShadows = {
+  shadow1: "rgba(0,0,0,0.04)",
+  shadow2: "rgba(0,0,0,0.08)",
+  shadow3: "rgba(0,0,0,0.16)",
+  shadow4: "rgba(0,0,0,0.24)",
+  shadow5: "rgba(0,0,0,0.32)",
+  shadow6: "rgba(0,0,0,0.4)"
+}, darkShadows = {
+  shadow1: "rgba(0,0,0,0.2)",
+  shadow2: "rgba(0,0,0,0.3)",
+  shadow3: "rgba(0,0,0,0.4)",
+  shadow4: "rgba(0,0,0,0.5)",
+  shadow5: "rgba(0,0,0,0.6)",
+  shadow6: "rgba(0,0,0,0.7)"
+}, tamaguiThemes = createThemeSuite({
+  base: {
+    palette: {
+      dark: darkPalette,
+      light: lightPalette
+    },
+    // we set a bunch of colors like $red1 => $red1
+    // we only want to set it on the base light/dark theme
+    extra: {
+      light: {
+        ...colorTokens.light.blue,
+        ...colorTokens.light.gray,
+        ...colorTokens.light.green,
+        ...colorTokens.light.orange,
+        ...colorTokens.light.pink,
+        ...colorTokens.light.purple,
+        ...colorTokens.light.red,
+        ...colorTokens.light.yellow,
+        ...lightShadows,
+        shadowColor: lightShadows.shadow1
+      },
+      dark: {
+        ...colorTokens.dark.blue,
+        ...colorTokens.dark.gray,
+        ...colorTokens.dark.green,
+        ...colorTokens.dark.orange,
+        ...colorTokens.dark.pink,
+        ...colorTokens.dark.purple,
+        ...colorTokens.dark.red,
+        ...colorTokens.dark.yellow,
+        ...darkShadows,
+        shadowColor: darkShadows.shadow1
+      }
+    }
+  },
+  accent: {
+    palette: {
+      dark: lightPalette,
+      light: darkPalette
+    },
+    template: "inverse"
+  },
+  childrenThemes: {
+    gray: {
+      palette: {
+        dark: Object.values(colorTokens.dark.gray),
+        light: Object.values(colorTokens.light.gray)
+      }
+    },
+    blue: {
+      palette: {
+        dark: Object.values(colorTokens.dark.blue),
+        light: Object.values(colorTokens.light.blue)
+      }
+    },
+    orange: {
+      palette: {
+        dark: Object.values(colorTokens.dark.orange),
+        light: Object.values(colorTokens.light.orange)
+      }
+    },
+    red: {
+      palette: {
+        dark: Object.values(colorTokens.dark.red),
+        light: Object.values(colorTokens.light.red)
+      }
+    },
+    yellow: {
+      palette: {
+        dark: Object.values(colorTokens.dark.yellow),
+        light: Object.values(colorTokens.light.yellow)
+      }
+    },
+    green: {
+      palette: {
+        dark: Object.values(colorTokens.dark.green),
+        light: Object.values(colorTokens.light.green)
+      }
+    },
+    purple: {
+      palette: {
+        dark: Object.values(colorTokens.dark.purple),
+        light: Object.values(colorTokens.light.purple)
+      }
+    },
+    pink: {
+      palette: {
+        dark: Object.values(colorTokens.dark.pink),
+        light: Object.values(colorTokens.light.pink)
+      }
+    },
+    tan: {
+      palette: {
+        light: [
+          "hsla(40, 30%, 98%, 1)",
+          "hsla(40, 24%, 94%, 1)",
+          "hsla(38, 23%, 91%, 1)",
+          "hsla(36, 20%, 90%, 1)",
+          "hsla(36, 20%, 88%, 1)",
+          "hsla(35, 20%, 85%, 1)",
+          "hsla(35, 21%, 74%, 1)",
+          "hsla(34, 20%, 70%, 1)",
+          "hsla(35, 20%, 67%, 1)",
+          "hsla(34, 19%, 47%, 1)",
+          "hsla(35, 18%, 37%, 1)",
+          "hsla(35, 17%, 20%, 1)"
+        ],
+        dark: [
+          "hsla(30, 9%, 10%, 1)",
+          "hsla(30, 10%, 12%, 1)",
+          "hsla(31, 11%, 18%, 1)",
+          "hsla(30, 12%, 23%, 1)",
+          "hsla(30, 14%, 28%, 1)",
+          "hsla(30, 16%, 33%, 1)",
+          "hsla(30, 18%, 38%, 1)",
+          "hsla(30, 20%, 45%, 1)",
+          "hsla(30, 21%, 50%, 1)",
+          "hsla(29, 22%, 58%, 1)",
+          "hsla(34, 24%, 70%, 1)",
+          "hsla(11, 12%, 79%, 1)"
+        ]
+      }
+    }
+  },
+  grandChildrenThemes: {
+    alt1: {
+      template: "alt1"
+    },
+    alt2: {
+      template: "alt2"
+    },
+    surface1: {
+      template: "surface1"
+    },
+    surface2: {
+      template: "surface2"
+    },
+    surface3: {
+      template: "surface3"
+    }
+  }
+});
+export {
+  tamaguiThemes
+};
+//# sourceMappingURL=v4-tamagui.js.map

package/dist/esm/v4-tamagui.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/Users/n8/tamagui/code/core/themes/src/v4-tamagui.ts"],
+  "mappings": "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",
+  "names": ["blue", "blueDark", "gray", "grayDark", "green", "greenDark", "orange", "orangeDark", "pink", "pinkDark", "purple", "purpleDark", "red", "redDark", "yellow", "yellowDark", "createThemeSuite", "colorTokens", "light", "dark", "darkPalette", "lightPalette", "lightShadows", "shadow1", "shadow2", "shadow3", "shadow4", "shadow5", "shadow6", "darkShadows", "tamaguiThemes", "base", "palette", "extra", "shadowColor", "accent", "template", "childrenThemes", "Object", "values", "tan", "grandChildrenThemes", "alt1", "alt2", "surface1", "surface2", "surface3"]
+}

package/dist/esm/v4.js

@@ -0,0 +1,8 @@
+export * from "./v4-createTheme";
+import { tokens } from "./v3-themes";
+import * as tamaguiThemes from "./v4-tamagui-out";
+export {
+  tamaguiThemes,
+  tokens
+};
+//# sourceMappingURL=v4.js.map

package/dist/esm/v4.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/v4.tsx"],
+  "mappings": "AAAA,cAAc;AACd,SAAS,cAAc;AAEvB,YAAY,mBAAmB;",
+  "names": []
+}

package/dist/esm/v4.mjs

@@ -0,0 +1,5 @@
+export * from "./v4-createTheme.mjs";
+import { tokens } from "./v3-themes.mjs";
+import * as tamaguiThemes from "./v4-tamagui-out.mjs";
+export { tamaguiThemes, tokens };
+//# sourceMappingURL=v4.mjs.map

package/dist/esm/v4.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["tokens","tamaguiThemes"],"sources":["../../src/v4.tsx"],"sourcesContent":[null],"mappings":"AAAA,cAAc;AACd,SAASA,MAAA,QAAc;AAEvB,YAAYC,aAAA,MAAmB","ignoreList":[]}

package/dist/esm/v4.native.js

@@ -0,0 +1,8 @@
+export * from "./v4-createTheme";
+import { tokens } from "./v3-themes";
+import * as _tamaguiThemes from "./v4-tamagui-out";
+export {
+  _tamaguiThemes as tamaguiThemes,
+  tokens
+};
+//# sourceMappingURL=v4.js.map

package/dist/esm/v4.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/Users/n8/tamagui/code/core/themes/src/v4.tsx"],
+  "mappings": "AAAA,cAAc;AACd,SAASA,cAAc;AAEvB,YAAA,oBAA+B;",
+  "names": ["tokens"]
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/themes",
-  "version": "1.121.10",
+  "version": "1.121.12-1737177163952",
   "types": "./types/index.d.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -65,17 +65,27 @@
       "types": "./types/v3-themes.d.ts",
       "import": "./dist/esm/v3-themes.mjs",
       "require": "./dist/cjs/v3-themes.cjs"
+    },
+    "./v4": {
+      "react-native": {
+        "import": "./dist/esm/v4.native.js",
+        "require": "./dist/cjs/v4.native.js"
+      },
+      "types": "./types/v4.d.ts",
+      "import": "./dist/esm/v4.mjs",
+      "require": "./dist/cjs/v4.cjs"
     }
   },
   "dependencies": {
-    "@tamagui/colors": "1.121.10",
-    "@tamagui/create-theme": "1.121.10",
-    "@tamagui/theme-builder": "1.121.10",
-    "@tamagui/web": "1.121.10"
+    "@tamagui/colors": "1.121.12-1737177163952",
+    "@tamagui/create-theme": "1.121.12-1737177163952",
+    "@tamagui/theme-builder": "1.121.12-1737177163952",
+    "@tamagui/web": "1.121.12-1737177163952",
+    "color2k": "^2.0.2"
   },
   "devDependencies": {
-    "@tamagui/build": "1.121.10",
-    "@tamagui/cli": "1.121.10",
+    "@tamagui/build": "1.121.12-1737177163952",
+    "@tamagui/cli": "1.121.12-1737177163952",
     "vitest": "^2.1.8"
   },
   "publishConfig": {

package/src/getThemeSuitePalettes.ts

@@ -0,0 +1,94 @@
+import { hsla, parseToHsla } from 'color2k'
+import type { BuildPalette } from './types'
+
+/**
+ * palette generally is:
+ *
+ * [constrastBackground, backgroundTransparent, ...background, ...foreground, foregroundTransparent, accentForeground]
+ */
+
+const paletteSize = 12
+
+// how many things come before the actual bg color (transparencies etc)
+export const PALETTE_BACKGROUND_OFFSET = 4
+
+const generateColorPalette = ({
+  palette: buildPalette,
+  scheme,
+}: {
+  palette: BuildPalette
+  scheme: 'light' | 'dark'
+}) => {
+  if (!buildPalette) {
+    return [] as string[]
+  }
+
+  const { anchors } = buildPalette
+
+  let palette: string[] = []
+
+  const add = (h: number, s: number, l: number) => {
+    palette.push(hsla(h, s, l, 1))
+  }
+
+  const numAnchors = Object.keys(anchors).length
+
+  for (const [anchorIndex, anchor] of anchors.entries()) {
+    const [h, s, l] = [anchor.hue[scheme], anchor.sat[scheme], anchor.lum[scheme]]
+
+    if (anchorIndex !== 0) {
+      const lastAnchor = anchors[anchorIndex - 1]
+      const steps = anchor.index - lastAnchor.index
+
+      const lastHue = lastAnchor.hue[scheme]
+      const lastSat = lastAnchor.sat[scheme]
+      const lastLum = lastAnchor.lum[scheme]
+
+      const stepHue = (lastHue - h) / steps
+      const stepSat = (lastSat - s) / steps
+      const stepLum = (lastLum - l) / steps
+
+      // backfill:
+      for (let step = lastAnchor.index + 1; step < anchor.index; step++) {
+        const str = anchor.index - step
+        add(h + stepHue * str, s + stepSat * str, l + stepLum * str)
+      }
+    }
+
+    add(h, s, l)
+
+    const isLastAnchor = anchorIndex === numAnchors - 1
+    if (isLastAnchor && palette.length < paletteSize) {
+      // forwardfill:
+      for (let step = anchor.index + 1; step < paletteSize; step++) {
+        add(h, s, l)
+      }
+    }
+  }
+
+  // add transparent values
+  const [background] = palette
+  const foreground = palette[palette.length - 1]
+
+  const transparentValues = [background, foreground].map((color) => {
+    const [h, s, l] = parseToHsla(color)
+    // fully transparent to partially
+    return [
+      hsla(h, s, l, 0),
+      hsla(h, s, l, 0.25),
+      hsla(h, s, l, 0.5),
+      hsla(h, s, l, 0.75),
+    ] as const
+  })
+  const reverseForeground = [...transparentValues[1]].reverse()
+  palette = [...transparentValues[0], ...palette, ...reverseForeground]
+
+  return palette
+}
+
+export function getThemeSuitePalettes(palette: BuildPalette) {
+  return {
+    light: generateColorPalette({ palette, scheme: 'light' }),
+    dark: generateColorPalette({ palette, scheme: 'dark' }),
+  }
+}

package/src/types.ts

@@ -0,0 +1,94 @@
+import type { Template, ThemeDefinitions } from '@tamagui/create-theme'
+
+type ThemeSuiteItem = {
+  id: string
+  name: string
+  createdAt: number
+  updatedAt: number
+
+  schemes: { light: boolean; dark: boolean }
+  palettes: Record<string, BuildPalette>
+  templates: BuildTemplates
+
+  baseTheme: BuildTheme
+  subThemes: BuildSubTheme[]
+  componentThemes: ThemeDefinitions
+}
+
+export type ThemeSuiteItemData = Omit<ThemeSuiteItem, 'id' | 'createdAt' | 'updatedAt'>
+
+export type BuildTemplates = Record<string, Template>
+
+export type BuildSubTheme = BuildTheme
+
+export type BuildPalettes = Record<string, BuildPalette>
+
+export type BuildPalette = {
+  name: string
+  scale?: ScaleTypeName
+  anchors: BuildThemeAnchor[]
+}
+
+export type BuildThemeSuiteProps = Omit<ThemeSuiteItemData, 'name'>
+
+export type BuildThemeSuitePalettes = {
+  light: string[]
+  dark: string[]
+  lightAccent?: string[]
+  darkAccent?: string[]
+}
+
+export type ScaleTypeName =
+  | 'custom'
+  | 'radix'
+  | 'radix-b'
+  | 'radius-bold'
+  | 'radius-bright'
+  | 'linear'
+  | 'pastel'
+  | 'pastel-desaturating'
+  | 'neon'
+  | 'neon-bright'
+  | 'neon-c'
+
+export type BuildThemeBase = {
+  id: string
+  name: string
+  errors?: string[]
+}
+
+export type BuildThemeAnchor = {
+  index: number
+  hue: {
+    light: number
+    dark: number
+    sync?: boolean
+    syncLeft?: boolean
+  }
+  sat: {
+    light: number
+    dark: number
+    sync?: boolean
+    syncLeft?: boolean
+  }
+  lum: {
+    light: number
+    dark: number
+  }
+}
+
+export type BuildPaletteAnchors = BuildThemeAnchor[]
+
+export type BuildTheme = BuildThemeBase & {
+  type: 'theme'
+  template: string
+  palette: string
+  accent?: BuildTheme
+}
+
+export type ThemeStepProps = {
+  theme: BuildTheme
+  isAccent?: boolean
+  vertical?: boolean
+  onUpdate: (val: Partial<BuildTheme>) => void
+}

package/src/utils.ts

@@ -0,0 +1,51 @@
+export function postfixObjKeys<A extends { [key: string]: string }, B extends string>(
+  obj: A,
+  postfix: B
+): {
+  [Key in `${keyof A extends string ? keyof A : never}${B}`]: string
+} {
+  return Object.fromEntries(
+    Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v])
+  ) as any
+}
+
+// a bit odd but keeping backward compat for values >8 while fixing below
+export function sizeToSpace(v: number) {
+  if (v === 0) return 0
+  if (v === 2) return 0.5
+  if (v === 4) return 1
+  if (v === 8) return 1.5
+  if (v <= 16) return Math.round(v * 0.333)
+  return Math.floor(v * 0.7 - 12)
+}
+
+export function objectFromEntries<ARR_T extends EntriesType>(
+  arr: ARR_T
+): EntriesToObject<ARR_T> {
+  return Object.fromEntries(arr) as EntriesToObject<ARR_T>
+}
+
+export type EntriesType =
+  | [PropertyKey, unknown][]
+  | ReadonlyArray<readonly [PropertyKey, unknown]>
+
+export type DeepWritable<OBJ_T> = { -readonly [P in keyof OBJ_T]: DeepWritable<OBJ_T[P]> }
+export type UnionToIntersection<UNION_T> = // From https://stackoverflow.com/a/50375286
+  (UNION_T extends any ? (k: UNION_T) => void : never) extends (k: infer I) => void
+    ? I
+    : never
+
+export type UnionObjectFromArrayOfPairs<ARR_T extends EntriesType> =
+  DeepWritable<ARR_T> extends (infer R)[]
+    ? R extends [infer key, infer val]
+      ? { [prop in key & PropertyKey]: val }
+      : never
+    : never
+export type MergeIntersectingObjects<ObjT> = { [key in keyof ObjT]: ObjT[key] }
+export type EntriesToObject<ARR_T extends EntriesType> = MergeIntersectingObjects<
+  UnionToIntersection<UnionObjectFromArrayOfPairs<ARR_T>>
+>
+
+export function objectKeys<O extends Object>(obj: O) {
+  return Object.keys(obj) as Array<keyof O>
+}

package/src/v3-themes.ts

@@ -16,8 +16,9 @@ import {
   yellow,
   yellowDark,
 } from '@tamagui/colors'
-import { createThemeBuilder } from '@tamagui/theme-builder'
+import { createThemeBuilder, objectFromEntries } from '@tamagui/theme-builder'
 import { createTokens } from '@tamagui/web'
+import { objectKeys, postfixObjKeys, sizeToSpace } from './utils'
 
 const colorTokens = {
   light: {
@@ -744,55 +745,3 @@ export const tokens = createTokens({
 })
 
 // --- utils ---
-
-export function postfixObjKeys<A extends { [key: string]: string }, B extends string>(
-  obj: A,
-  postfix: B
-): {
-  [Key in `${keyof A extends string ? keyof A : never}${B}`]: string
-} {
-  return Object.fromEntries(
-    Object.entries(obj).map(([k, v]) => [`${k}${postfix}`, v])
-  ) as any
-}
-
-// a bit odd but keeping backward compat for values >8 while fixing below
-export function sizeToSpace(v: number) {
-  if (v === 0) return 0
-  if (v === 2) return 0.5
-  if (v === 4) return 1
-  if (v === 8) return 1.5
-  if (v <= 16) return Math.round(v * 0.333)
-  return Math.floor(v * 0.7 - 12)
-}
-
-export function objectFromEntries<ARR_T extends EntriesType>(
-  arr: ARR_T
-): EntriesToObject<ARR_T> {
-  return Object.fromEntries(arr) as EntriesToObject<ARR_T>
-}
-
-export type EntriesType =
-  | [PropertyKey, unknown][]
-  | ReadonlyArray<readonly [PropertyKey, unknown]>
-
-export type DeepWritable<OBJ_T> = { -readonly [P in keyof OBJ_T]: DeepWritable<OBJ_T[P]> }
-export type UnionToIntersection<UNION_T> = // From https://stackoverflow.com/a/50375286
-  (UNION_T extends any ? (k: UNION_T) => void : never) extends (k: infer I) => void
-    ? I
-    : never
-
-export type UnionObjectFromArrayOfPairs<ARR_T extends EntriesType> =
-  DeepWritable<ARR_T> extends (infer R)[]
-    ? R extends [infer key, infer val]
-      ? { [prop in key & PropertyKey]: val }
-      : never
-    : never
-export type MergeIntersectingObjects<ObjT> = { [key in keyof ObjT]: ObjT[key] }
-export type EntriesToObject<ARR_T extends EntriesType> = MergeIntersectingObjects<
-  UnionToIntersection<UnionObjectFromArrayOfPairs<ARR_T>>
->
-
-export function objectKeys<O extends Object>(obj: O) {
-  return Object.keys(obj) as Array<keyof O>
-}