@tamagui/create-theme 1.4.0

package/src/index.tsx

@@ -0,0 +1,132 @@
+import type { Variable } from '@tamagui/web'
+
+export type ThemeMask = Record<string, string | number>
+export type Palette = string[]
+export type ShiftMaskProps = { by: number; max: number; min?: number }
+export type MaskOptions = { skip?: Partial<ThemeMask> }
+
+type GenericTheme = { [key: string]: string | Variable }
+type CreateMask = <A extends ThemeMask>(template: A, options: MaskOptions) => A
+
+const THEME_INFO = new WeakMap<
+  any,
+  { palette: Palette; definition: ThemeMask; cache: WeakMap<any, any> }
+>()
+
+export function createTheme<
+  Definition extends ThemeMask,
+  Extras extends Record<string, string> = {}
+>(
+  palette: Palette,
+  definition: Definition,
+  options?: {
+    nonInheritedValues?: Extras
+  }
+): {
+  [key in keyof Definition | keyof Extras]: string
+} {
+  const theme = {
+    ...(Object.fromEntries(
+      Object.entries(definition).map(([key, offset]) => {
+        return [key, getValue(palette, offset)]
+      })
+    ) as any),
+    ...options?.nonInheritedValues,
+  }
+  THEME_INFO.set(theme, { palette, definition, cache: new WeakMap() })
+  return theme
+}
+
+const getValue = (palette: Palette, value: string | number) => {
+  if (typeof value === 'string') return value
+  const max = palette.length - 1
+  const isPositive = value === 0 ? !isMinusZero(value) : value >= 0
+  const next = isPositive ? value : max + value
+  const index = Math.min(Math.max(0, next), max)
+  return palette[index]
+}
+
+type SubThemeKeys<ParentKeys, ChildKeys> = `${ParentKeys extends string
+  ? ParentKeys
+  : never}_${ChildKeys extends string ? ChildKeys : never}`
+
+export function addChildren<
+  Theme extends GenericTheme,
+  Themes extends { [key: string]: Theme },
+  GetChildren extends (name: keyof Themes, theme: Theme) => { [key: string]: Theme }
+>(
+  themes: Themes,
+  getChildren: GetChildren
+): Themes & {
+  [key in SubThemeKeys<keyof Themes, keyof ReturnType<GetChildren>>]: Theme
+} {
+  const out = { ...themes }
+  for (const key in themes) {
+    const subThemes = getChildren(key, themes[key])
+    for (const sKey in subThemes) {
+      out[`${key}_${sKey}`] = subThemes[sKey] as any
+    }
+  }
+  return out as any
+}
+
+export const createWeakenMask = ({
+  by = 1,
+  max,
+  min = 0,
+  inverseNegatives,
+}: ShiftMaskProps & { inverseNegatives?: boolean }) => {
+  return ((template, { skip }) => {
+    const values = Object.entries(template) // .filter(Number)
+    const out = {}
+    for (const [key, value] of values) {
+      if (typeof value === 'string') continue
+      if (skip && key in skip) {
+        out[key] = value
+        continue
+      }
+      const isPositive = value === 0 ? !isMinusZero(value) : value >= 0
+      const direction = isPositive ? 1 : -1
+      const invert = inverseNegatives && !isPositive ? -1 : 1
+      const next = value + by * direction * invert
+      const clamped = isPositive
+        ? Math.max(min, Math.min(max, next))
+        : Math.min(-min, Math.max(-max, next))
+
+      out[key] = clamped
+    }
+    return out as typeof template
+  }) as CreateMask
+}
+
+function isMinusZero(value) {
+  return 1 / value === -Infinity
+}
+
+export const createStrengthenMask = (props: ShiftMaskProps) =>
+  createWeakenMask({ ...props, inverseNegatives: true })
+
+export function applyMask<Theme extends GenericTheme>(
+  theme: Theme,
+  mask: CreateMask,
+  options: MaskOptions = {}
+): Theme {
+  const info = THEME_INFO.get(theme)
+  if (!info) {
+    throw new Error(
+      process.env.NODE_ENV !== 'production'
+        ? `No info found for theme, you must pass the theme created by createThemeFromPalette directly to extendTheme`
+        : `❌ Err2`
+    )
+  }
+  if (info.cache.has(mask)) {
+    return info.cache.get(mask)
+  }
+
+  const template = mask(info.definition, options)
+  const next = createTheme(info.palette, template) as Theme
+
+  info.cache.set(mask, next)
+
+  return next
+}

package/types/index.d.ts

@@ -0,0 +1,35 @@
+import type { Variable } from '@tamagui/web';
+export type ThemeMask = Record<string, string | number>;
+export type Palette = string[];
+export type ShiftMaskProps = {
+    by: number;
+    max: number;
+    min?: number;
+};
+export type MaskOptions = {
+    skip?: Partial<ThemeMask>;
+};
+type GenericTheme = {
+    [key: string]: string | Variable;
+};
+type CreateMask = <A extends ThemeMask>(template: A, options: MaskOptions) => A;
+export declare function createTheme<Definition extends ThemeMask, Extras extends Record<string, string> = {}>(palette: Palette, definition: Definition, options?: {
+    nonInheritedValues?: Extras;
+}): {
+    [key in keyof Definition | keyof Extras]: string;
+};
+type SubThemeKeys<ParentKeys, ChildKeys> = `${ParentKeys extends string ? ParentKeys : never}_${ChildKeys extends string ? ChildKeys : never}`;
+export declare function addChildren<Theme extends GenericTheme, Themes extends {
+    [key: string]: Theme;
+}, GetChildren extends (name: keyof Themes, theme: Theme) => {
+    [key: string]: Theme;
+}>(themes: Themes, getChildren: GetChildren): Themes & {
+    [key in SubThemeKeys<keyof Themes, keyof ReturnType<GetChildren>>]: Theme;
+};
+export declare const createWeakenMask: ({ by, max, min, inverseNegatives, }: ShiftMaskProps & {
+    inverseNegatives?: boolean | undefined;
+}) => CreateMask;
+export declare const createStrengthenMask: (props: ShiftMaskProps) => CreateMask;
+export declare function applyMask<Theme extends GenericTheme>(theme: Theme, mask: CreateMask, options?: MaskOptions): Theme;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAA;AAE5C,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAA;AACvD,MAAM,MAAM,OAAO,GAAG,MAAM,EAAE,CAAA;AAC9B,MAAM,MAAM,cAAc,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AACtE,MAAM,MAAM,WAAW,GAAG;IAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAA;CAAE,CAAA;AAEvD,KAAK,YAAY,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAA;CAAE,CAAA;AACxD,KAAK,UAAU,GAAG,CAAC,CAAC,SAAS,SAAS,EAAE,QAAQ,EAAE,CAAC,EAAE,OAAO,EAAE,WAAW,KAAK,CAAC,CAAA;AAO/E,wBAAgB,WAAW,CACzB,UAAU,SAAS,SAAS,EAC5B,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,EAAE,EAE1C,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,OAAO,CAAC,EAAE;IACR,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAC5B,GACA;KACA,GAAG,IAAI,MAAM,UAAU,GAAG,MAAM,MAAM,GAAG,MAAM;CACjD,CAWA;AAWD,KAAK,YAAY,CAAC,UAAU,EAAE,SAAS,IAAI,GAAG,UAAU,SAAS,MAAM,GACnE,UAAU,GACV,KAAK,IAAI,SAAS,SAAS,MAAM,GAAG,SAAS,GAAG,KAAK,EAAE,CAAA;AAE3D,wBAAgB,WAAW,CACzB,KAAK,SAAS,YAAY,EAC1B,MAAM,SAAS;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,CAAA;CAAE,EACvC,WAAW,SAAS,CAAC,IAAI,EAAE,MAAM,MAAM,EAAE,KAAK,EAAE,KAAK,KAAK;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,CAAA;CAAE,EAElF,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,GACvB,MAAM,GAAG;KACT,GAAG,IAAI,YAAY,CAAC,MAAM,MAAM,EAAE,MAAM,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,KAAK;CAC1E,CASA;AAED,eAAO,MAAM,gBAAgB;;gBA2B5B,CAAA;AAMD,eAAO,MAAM,oBAAoB,UAAW,cAAc,eACF,CAAA;AAExD,wBAAgB,SAAS,CAAC,KAAK,SAAS,YAAY,EAClD,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,UAAU,EAChB,OAAO,GAAE,WAAgB,GACxB,KAAK,CAmBP"}