@tamagui/theme 1.15.25 → 1.15.27

package/src/addTheme.ts

@@ -1,68 +1,11 @@
-import { isWeb } from '@tamagui/constants'
-import {
-  ensureThemeVariable,
-  getConfig,
-  getThemeCSSRules,
-  proxyThemeToParents,
-  updateConfig,
-} from '@tamagui/web'
 import type { ThemeDefinition, ThemeParsed } from '@tamagui/web'
 
+import { _mutateTheme } from './_mutateTheme'
+
 export function addTheme(props: {
   name: string
   theme: Partial<Record<keyof ThemeDefinition, any>>
   insertCSS?: boolean
-  update?: boolean
 }) {
-  const config = getConfig()
-
-  if (process.env.NODE_ENV === 'development') {
-    if (!config) {
-      throw new Error('No config')
-    }
-    const theme = config.themes[props.name]
-    if (!props.update && theme) {
-      return { theme }
-    }
-  }
-
-  const { name: themeName, theme: themeIn, insertCSS } = props
-  const theme = { ...themeIn } as ThemeParsed
-  for (const key in theme) {
-    ensureThemeVariable(theme, key)
-  }
-
-  const themeProxied = proxyThemeToParents(themeName, theme, config.themes)
-  config.themes[themeName] = themeProxied
-
-  let cssRules: string[] = []
-
-  if (isWeb) {
-    if (insertCSS) {
-      cssRules = getThemeCSSRules({
-        // @ts-ignore this works but should be fixed types
-        config,
-        themeName,
-        names: [themeName],
-        theme,
-      })
-      const id = `t_theme_style_${themeName}`
-      const existing = document.querySelector(`#${id}`)
-      const style = document.createElement('style')
-      style.id = id
-      style.appendChild(document.createTextNode(cssRules.join('\n')))
-      document.head.appendChild(style)
-      if (existing) {
-        existing.parentElement?.removeChild(existing)
-      }
-    }
-  }
-
-  updateConfig('themes', { ...config.themes, [themeName]: themeProxied })
-
-  // trigger updates in components
-  return {
-    theme: themeProxied,
-    cssRules,
-  }
+  return _mutateTheme({ ...props })
 }

package/src/index.ts

@@ -1,2 +1,3 @@
 export * from './addTheme'
 export * from './updateTheme'
+export * from './replaceTheme'

package/src/replaceTheme.ts

@@ -0,0 +1,27 @@
+import { activeThemeManagers } from '@tamagui/web'
+import type { ThemeDefinition } from '@tamagui/web'
+
+import { _mutateTheme } from './_mutateTheme.js'
+
+export function replaceTheme({
+  name,
+  theme,
+}: {
+  name: string
+  theme: Partial<Record<keyof ThemeDefinition, any>>
+}) {
+  const next = _mutateTheme({ name, theme, insertCSS: true, mutationType: 'replace' })
+
+  if (process.env.TAMAGUI_TARGET === 'native') {
+    activeThemeManagers.forEach((manager) => {
+      if (manager.state.name === name) {
+        manager.updateState({
+          name,
+          forceTheme: next?.theme,
+        })
+      }
+    })
+  }
+
+  return next
+}

package/src/updateTheme.ts

@@ -1,7 +1,7 @@
 import { activeThemeManagers } from '@tamagui/web'
 import type { ThemeDefinition } from '@tamagui/web'
 
-import { addTheme } from './addTheme.js'
+import { _mutateTheme } from './_mutateTheme.js'
 
 export function updateTheme({
   name,
@@ -10,14 +10,14 @@ export function updateTheme({
   name: string
   theme: Partial<Record<keyof ThemeDefinition, any>>
 }) {
-  const next = addTheme({ name, theme, insertCSS: true, update: true })
+  const next = _mutateTheme({ name, theme, insertCSS: true, mutationType: 'update' })
 
   if (process.env.TAMAGUI_TARGET === 'native') {
     activeThemeManagers.forEach((manager) => {
       if (manager.state.name === name) {
         manager.updateState({
           name,
-          forceTheme: next.theme,
+          forceTheme: next?.theme,
         })
       }
     })

package/types/_mutateTheme.d.ts

@@ -0,0 +1,32 @@
+import type { ThemeDefinition } from '@tamagui/web';
+export declare function _mutateTheme(props: {
+    name: string;
+    theme: Partial<Record<keyof ThemeDefinition, any>>;
+    insertCSS?: boolean;
+    mutationType?: 'replace' | 'update';
+}): {
+    theme: {
+        [x: string]: import("@tamagui/web").Variable<any>;
+        background?: import("@tamagui/web").Variable<any> | undefined;
+        backgroundHover?: import("@tamagui/web").Variable<any> | undefined;
+        backgroundPress?: import("@tamagui/web").Variable<any> | undefined;
+        backgroundFocus?: import("@tamagui/web").Variable<any> | undefined;
+        color?: import("@tamagui/web").Variable<any> | undefined;
+        colorHover?: import("@tamagui/web").Variable<any> | undefined;
+        colorPress?: import("@tamagui/web").Variable<any> | undefined;
+        colorFocus?: import("@tamagui/web").Variable<any> | undefined;
+        borderColor?: import("@tamagui/web").Variable<any> | undefined;
+        borderColorHover?: import("@tamagui/web").Variable<any> | undefined;
+        borderColorPress?: import("@tamagui/web").Variable<any> | undefined;
+        borderColorFocus?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColor?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColorHover?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColorPress?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColorFocus?: import("@tamagui/web").Variable<any> | undefined;
+    };
+    cssRules?: undefined;
+} | {
+    theme: any;
+    cssRules: string[];
+} | undefined;
+//# sourceMappingURL=_mutateTheme.d.ts.map

package/types/_mutateTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"_mutateTheme.d.ts","sourceRoot":"","sources":["../src/_mutateTheme.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,eAAe,EAAe,MAAM,cAAc,CAAA;AAEhE,wBAAgB,YAAY,CAAC,KAAK,EAAE;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;IAClD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;CACpC;;;;;;;;;;;;;;;;;;;;;;;;cAoEA"}

package/types/addTheme.d.ts

@@ -3,7 +3,6 @@ export declare function addTheme(props: {
     name: string;
     theme: Partial<Record<keyof ThemeDefinition, any>>;
     insertCSS?: boolean;
-    update?: boolean;
 }): {
     theme: {
         [x: string]: import("@tamagui/web").Variable<any>;
@@ -28,5 +27,5 @@ export declare function addTheme(props: {
 } | {
     theme: any;
     cssRules: string[];
-};
+} | undefined;
 //# sourceMappingURL=addTheme.d.ts.map

package/types/addTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"addTheme.d.ts","sourceRoot":"","sources":["../src/addTheme.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,eAAe,EAAe,MAAM,cAAc,CAAA;AAEhE,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;IAClD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB;;;;;;;;;;;;;;;;;;;;;;;;EAoDA"}
+{"version":3,"file":"addTheme.d.ts","sourceRoot":"","sources":["../src/addTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAe,MAAM,cAAc,CAAA;AAIhE,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;IAClD,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;;;;;;;;;;;;;;;;;;;;;;;;cAEA"}

package/types/index.d.ts

@@ -1,3 +1,4 @@
 export * from './addTheme';
 export * from './updateTheme';
+export * from './replaceTheme';
 //# sourceMappingURL=index.d.ts.map

package/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA;AAC1B,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA"}

package/types/replaceTheme.d.ts

@@ -0,0 +1,30 @@
+import type { ThemeDefinition } from '@tamagui/web';
+export declare function replaceTheme({ name, theme, }: {
+    name: string;
+    theme: Partial<Record<keyof ThemeDefinition, any>>;
+}): {
+    theme: {
+        [x: string]: import("@tamagui/web").Variable<any>;
+        background?: import("@tamagui/web").Variable<any> | undefined;
+        backgroundHover?: import("@tamagui/web").Variable<any> | undefined;
+        backgroundPress?: import("@tamagui/web").Variable<any> | undefined;
+        backgroundFocus?: import("@tamagui/web").Variable<any> | undefined;
+        color?: import("@tamagui/web").Variable<any> | undefined;
+        colorHover?: import("@tamagui/web").Variable<any> | undefined;
+        colorPress?: import("@tamagui/web").Variable<any> | undefined;
+        colorFocus?: import("@tamagui/web").Variable<any> | undefined;
+        borderColor?: import("@tamagui/web").Variable<any> | undefined;
+        borderColorHover?: import("@tamagui/web").Variable<any> | undefined;
+        borderColorPress?: import("@tamagui/web").Variable<any> | undefined;
+        borderColorFocus?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColor?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColorHover?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColorPress?: import("@tamagui/web").Variable<any> | undefined;
+        shadowColorFocus?: import("@tamagui/web").Variable<any> | undefined;
+    };
+    cssRules?: undefined;
+} | {
+    theme: any;
+    cssRules: string[];
+} | undefined;
+//# sourceMappingURL=replaceTheme.d.ts.map

package/types/replaceTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"replaceTheme.d.ts","sourceRoot":"","sources":["../src/replaceTheme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAInD,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,KAAK,GACN,EAAE;IACD,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;CACnD;;;;;;;;;;;;;;;;;;;;;;;;cAeA"}

package/types/updateTheme.d.ts

@@ -26,5 +26,5 @@ export declare function updateTheme({ name, theme, }: {
 } | {
     theme: any;
     cssRules: string[];
-};
+} | undefined;
 //# sourceMappingURL=updateTheme.d.ts.map

package/types/updateTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"updateTheme.d.ts","sourceRoot":"","sources":["../src/updateTheme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAInD,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,KAAK,GACN,EAAE;IACD,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;CACnD;;;;;;;;;;;;;;;;;;;;;;;;EAeA"}
+{"version":3,"file":"updateTheme.d.ts","sourceRoot":"","sources":["../src/updateTheme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAInD,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,KAAK,GACN,EAAE;IACD,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;CACnD;;;;;;;;;;;;;;;;;;;;;;;;cAeA"}