@tamagui/web 1.73.2 → 1.74.1

package/src/hooks/useTheme.tsx

@@ -1,5 +1,4 @@
-/* eslint-disable no-console */
-import { isClient, isServer, isWeb } from '@tamagui/constants'
+import { isClient, isIos, isServer } from '@tamagui/constants'
 import { useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
 
 import { getConfig } from '../config'
@@ -15,6 +14,7 @@ import type {
   DebugProp,
   ThemeParsed,
   ThemeProps,
+  UseThemeWithStateProps,
   VariableVal,
   VariableValGeneric,
 } from '../types'
@@ -33,8 +33,9 @@ let cached: any
 function getDefaultThemeProxied() {
   if (cached) return cached
   const config = getConfig()
-  const defaultTheme = config.themes.light ?? config.themes[Object.keys(config.themes)[0]]
-  cached = getThemeProxied(defaultTheme)
+  const name = config.themes.light ? 'light' : Object.keys(config.themes)[0]
+  const defaultTheme = config.themes[name]
+  cached = getThemeProxied({ theme: defaultTheme, name })
   return cached
 }
 
@@ -61,7 +62,7 @@ export const useTheme = (props: ThemeProps = emptyProps) => {
 }
 
 export const useThemeWithState = (
-  props: ThemeProps
+  props: UseThemeWithStateProps
 ): [ChangedThemeResponse, ThemeParsed] => {
   const keys = useRef<string[]>([])
 
@@ -73,6 +74,7 @@ export const useThemeWithState = (
       ? () => {
           const next =
             props.shouldUpdate?.() ?? (keys.current.length > 0 ? true : undefined)
+
           if (
             process.env.NODE_ENV === 'development' &&
             props.debug &&
@@ -104,9 +106,11 @@ export const useThemeWithState = (
   }
 
   const themeProxied = useMemo(() => {
-    if (!themeManager || !state?.theme) return {}
-    return getThemeProxied(state.theme, themeManager, keys.current, props.debug)
-  }, [state, themeManager])
+    if (!themeManager || !state?.theme) {
+      return {}
+    }
+    return getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug)
+  }, [state, themeManager, props.deopt, props.debug])
 
   if (process.env.NODE_ENV === 'development' && props.debug === 'verbose') {
     console.groupCollapsed('  🔹 useTheme =>', state?.name)
@@ -119,11 +123,24 @@ export const useThemeWithState = (
 }
 
 export function getThemeProxied(
-  theme: ThemeParsed,
+  { theme, name }: ThemeManagerState,
+  deopt = false,
   themeManager?: ThemeManager,
   keys?: string[],
   debug?: DebugProp
 ): UseThemeResult {
+  if (!theme) return {}
+
+  function track(key: string) {
+    if (keys && !keys.includes(key)) {
+      keys.push(key)
+      if (process.env.NODE_ENV === 'development' && debug) {
+        // biome-ignore lint/suspicious/noConsoleLog: <explanation>
+        console.log(` 🎨 useTheme() tracking new key: ${key}`)
+      }
+    }
+  }
+
   return createProxy(theme, {
     has(_, key) {
       if (Reflect.has(theme, key)) {
@@ -138,6 +155,7 @@ export function getThemeProxied(
       if (key === GetThemeUnwrapped) {
         return theme
       }
+
       if (
         // dont ask me, idk why but on hermes you can see that useTheme()[undefined] passes in STRING undefined to proxy
         // if someone is crazy enough to use "undefined" as a theme key then this not working is on them
@@ -147,6 +165,7 @@ export function getThemeProxied(
         // auto convert variables to plain
         const keyString = key[0] === '$' ? key.slice(1) : key
         const val = theme[keyString]
+
         if (val && typeof val === 'object') {
           // TODO this could definitely be done better by at the very minimum
           // proxying it up front and just having a listener here
@@ -154,22 +173,46 @@ export function getThemeProxied(
             // when they touch the actual value we only track it
             // if its a variable (web), its ignored!
             get(_, subkey) {
-              // trigger read key that makes it track updates
-              if (keys) {
-                if (
-                  (subkey === 'val' || (subkey === 'get' && !isWeb)) &&
-                  !keys.includes(keyString)
-                ) {
-                  keys.push(keyString)
-                  if (process.env.NODE_ENV === 'development' && debug) {
-                    // biome-ignore lint/suspicious/noConsoleLog: <explanation>
-                    console.log(` 🎨 useTheme() tracking new key: ${keyString}`)
+              if (subkey === 'val') {
+                // always track .val
+                track(keyString)
+              } else if (subkey === 'get') {
+                return () => {
+                  const outVal = getVariable(val)
+
+                  if (process.env.TAMAGUI_TARGET === 'native') {
+                    // ios can avoid re-rendering in some cases when we are using a root light/dark
+                    // disabled in cases where we have animations
+                    if (isIos && !deopt) {
+                      const isDark = name.startsWith('dark')
+                      const isLight = !isDark && name.startsWith('light')
+                      if (isDark || isLight) {
+                        const oppositeThemeName = name.replace(
+                          isDark ? 'dark' : 'light',
+                          isDark ? 'light' : 'dark'
+                        )
+                        const oppositeTheme = getConfig().themes[oppositeThemeName]
+                        const oppositeVal = getVariable(oppositeTheme?.[keyString])
+                        if (oppositeVal) {
+                          const dynamicVal = {
+                            dynamic: {
+                              dark: isDark ? outVal : oppositeVal,
+                              light: isLight ? outVal : oppositeVal,
+                            },
+                          }
+                          return dynamicVal
+                        }
+                      }
+                    }
+
+                    // if we dont return early with a dynamic val on native, always track
+                    track(keyString)
                   }
+
+                  return outVal
                 }
               }
-              if (subkey === 'get') {
-                return () => getVariable(val)
-              }
+
               return Reflect.get(val as any, subkey)
             },
           })
@@ -184,15 +227,12 @@ export function getThemeProxied(
 export const activeThemeManagers = new Set<ThemeManager>()
 
 export const useChangeThemeEffect = (
-  props: ThemeProps,
+  props: UseThemeWithStateProps,
   isRoot = false,
   keys?: string[],
   shouldUpdate?: () => boolean | undefined
 ): ChangedThemeResponse => {
-  const {
-    // @ts-expect-error internal use only
-    disable,
-  } = props
+  const { disable } = props
 
   const parentManager = useContext(ThemeManagerContext)
 
@@ -267,7 +307,14 @@ export const useChangeThemeEffect = (
       })
 
       const disposeChangeListener = parentManager?.onChangeTheme((name, manager) => {
-        const force = shouldUpdate?.()
+        const force =
+          shouldUpdate?.() ||
+          props.deopt ||
+          // this fixes themeable() not updating with the new fastSchemeChange setting
+          (process.env.TAMAGUI_TARGET === 'native'
+            ? props['disable-child-theme']
+            : undefined)
+
         const doUpdate = force ?? Boolean(keys?.length || isNewTheme)
 
         if (process.env.NODE_ENV === 'development' && props.debug) {
@@ -281,6 +328,7 @@ export const useChangeThemeEffect = (
             keys,
           })
         }
+
         if (doUpdate) {
           setThemeState(createState)
         }
@@ -367,7 +415,7 @@ export const useChangeThemeEffect = (
         if (nextState) {
           state = nextState
 
-          if (!prev.isNewTheme || !isWeb) {
+          if (!prev.isNewTheme) {
             themeManager = getNewThemeManager()
           } else {
             themeManager.updateState(nextState)

package/src/setupReactNative.ts

@@ -3,20 +3,75 @@ import { StaticConfig } from './types'
 const ReactNativeStaticConfigs = new WeakMap<any, Partial<StaticConfig> | null>()
 
 export function getReactNativeConfig(Component: any) {
+  if (!Component) return
+
+  if (process.env.TAMAGUI_TARGET === 'native') {
+    if (Component.getSizeWithHeaders) {
+      return RNConfigs.Image
+    }
+    if (Component.propTypes?.textBreakStrategy) {
+      return RNConfigs.Text
+    }
+    if (Component.propTypes?.onTextInput) {
+      return
+    }
+    // can assume everything else is react native on native
+    return RNConfigs.default
+  } else {
+    if (Component.getSize && Component.prefetch) {
+      return RNConfigs.Image
+    }
+    if (Component.displayName === 'Text' && Component.render) {
+      return RNConfigs.Text
+    }
+    if (
+      Component.render &&
+      (Component.displayName === 'ScrollView' || Component.displayName === 'View')
+    ) {
+      return RNConfigs.default
+    }
+    if (Component.State?.blurTextInput) {
+      return RNConfigs.TextInput
+    }
+  }
+
   return ReactNativeStaticConfigs.get(Component)
 }
 
+const RNConfigs = {
+  Image: {
+    isReactNative: true,
+    inlineProps: new Set(['src', 'width', 'height']),
+  },
+  Text: {
+    isReactNative: true,
+    isText: true,
+  },
+  TextInput: {
+    isReactNative: true,
+    isInput: true,
+    isText: true,
+  },
+  default: {
+    isReactNative: true,
+  },
+} satisfies Record<string, Partial<StaticConfig>>
+
+/**
+ * @deprecated this is no longer necessary, tamagui auto-detects RN views
+ */
 export function setupReactNative(rnExports: Record<string, any>) {
-  for (const key in rnExports) {
-    if (key[0].toLowerCase() === key[0]) continue
-    const val = rnExports[key]
-    if (val && typeof val === 'object') {
-      ReactNativeStaticConfigs.set(val, {
-        isReactNative: true,
-        isText: key === 'Text' || key === 'TextInput',
-        isInput: key === 'TextInput' || key === 'TextArea',
-        inlineProps: key === 'Image' ? new Set(['src', 'width', 'height']) : undefined,
-      })
-    }
-  }
+  // no-op
+  // for (const key in rnExports) {
+  //   if (key[0].toLowerCase() === key[0]) continue
+  //   const val = rnExports[key]
+  //   if (val && typeof val === 'object') {
+  //     ReactNativeStaticConfigs.set(val, {
+  //       isReactNative: true,
+  //       isText: key === 'Text' || key === 'TextInput',
+  //       isInput: key === 'TextInput' || key === 'TextArea',
+  //       inlineProps: key === 'Image' ? new Set(['src', 'width', 'height']) : undefined,
+  //     })
+  //   }
+  // }
 }

package/src/styled.tsx

@@ -1,5 +1,3 @@
-import { stylePropsAll } from '@tamagui/helpers'
-
 import { createComponent } from './createComponent'
 import { StyledContext } from './helpers/createStyledContext'
 import { mergeVariants } from './helpers/mergeVariants'
@@ -77,12 +75,14 @@ export function styled<
       ? ComponentIn
       : parentStaticConfig?.Component || ComponentIn
 
-  const reactNativeConfig = getReactNativeConfig(Component)
+  const reactNativeConfig = !parentStaticConfig
+    ? getReactNativeConfig(Component)
+    : undefined
+
   const isReactNative = Boolean(
     reactNativeConfig ||
       staticExtractionOptions?.isReactNative ||
-      parentStaticConfig?.isReactNative ||
-      getReactNativeConfig(parentStaticConfig?.Component)
+      parentStaticConfig?.isReactNative
   )
 
   const staticConfigProps = (() => {

package/src/types.tsx

@@ -518,6 +518,12 @@ export interface ThemeProps {
   shallow?: boolean
 }
 
+// more low level
+export type UseThemeWithStateProps = ThemeProps & {
+  deopt?: boolean
+  disable?: boolean
+}
+
 type ArrayIntersection<A extends any[]> = A[keyof A]
 
 type GetAltThemeNames<S> =
@@ -603,6 +609,25 @@ type GenericTamaguiSettings = {
    * @default false
    */
   mediaPropOrder?: boolean
+
+  /**
+   * On iOS, this enables a mode where Tamagui returns color values using `DynamicColorIOS`
+   * This is a React Native built in feature, you can read the docs here:
+   *   https://reactnative.dev/docs/dynamiccolorios
+   *
+   * We're working to make this enabled by default without any setting, but Tamagui themes
+   * support inversing and/or changing to light/dark at any point in the tree. We haven't implemented
+   * support for either of these cases when combined with this feature.
+   *
+   * So - as long as you:
+   *
+   *   1. Only use light/dark changes of themes at the root of your app
+   *   2. Don't use <Theme inverse> or themeInverse
+   *   3. Always change light/dark alongside the Appearance.colorSheme
+   *
+   * Then this feature is safe to turn on and will significantly speed up dark/light re-renders.
+   */
+  fastSchemeChange?: boolean
 }
 
 export type TamaguiSettings = TamaguiConfig['settings']

package/src/views/Theme.tsx

@@ -4,6 +4,7 @@ import React, {
   cloneElement,
   forwardRef,
   isValidElement,
+  useEffect,
   useMemo,
   useRef,
 } from 'react'

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,KAaN,MAAM,OAAO,CAAA;AAsBd,OAAO,EAEL,SAAS,EAKT,cAAc,EACd,UAAU,EACV,WAAW,EACX,UAAU,EACV,YAAY,EACZ,gBAAgB,EAGhB,cAAc,EAEd,SAAS,EAIV,MAAM,SAAS,CAAA;AAoBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA6D3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,UAAU,GAAG,SAAS,GAAG,EAAE,EACtD,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,YAAY,EAAE,YAAY,4DAwqC3B;AAoBD,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,OAEjD;AAiBD,eAAO,MAAM,MAAM,0DAqCjB,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,mBAkGxD"}
+{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,KAaN,MAAM,OAAO,CAAA;AAsBd,OAAO,EAEL,SAAS,EAKT,cAAc,EACd,UAAU,EACV,WAAW,EACX,UAAU,EACV,YAAY,EACZ,gBAAgB,EAGhB,cAAc,EAEd,SAAS,EAMV,MAAM,SAAS,CAAA;AAoBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA6D3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,UAAU,GAAG,SAAS,GAAG,EAAE,EACtD,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,YAAY,EAAE,YAAY,4DAgrC3B;AAoBD,wBAAgB,QAAQ,CAAC,KAAK,EAAE;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,OAEjD;AAiBD,eAAO,MAAM,MAAM,0DAqCjB,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,mBAkGxD"}

package/types/helpers/getSplitStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EAEV,iBAAiB,EACjB,SAAS,EACT,cAAc,EACd,aAAa,EAMb,eAAe,EACf,YAAY,EAEZ,qBAAqB,EAErB,cAAc,EACd,WAAW,EAEZ,MAAM,UAAU,CAAA;AA6BjB,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAE3D,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAMhE,KAAK,aAAa,GAAG,CACnB,KAAK,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7B,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,MAAM,EACjB,cAAc,EAAE,qBAAqB,EACrC,UAAU,EAAE,eAAe,EAC3B,iBAAiB,CAAC,EAAE,cAAc,GAAG,IAAI,EACzC,OAAO,CAAC,EAAE,iBAAiB,EAE3B,WAAW,CAAC,EAAE,MAAM,EACpB,KAAK,CAAC,EAAE,SAAS,KACd,cAAc,CAAA;AAEnB,eAAO,MAAM,UAAU,MAAM,CAAA;AAuB7B,eAAO,MAAM,cAAc,EAAE,aAmrC5B,CAAA;AAsDD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,wBACO,OAAO,KAC5B,cA2BF,CAAA;AA0BD,eAAO,MAAM,cAAc,EAAE,aAQ5B,CAAA"}
+{"version":3,"file":"getSplitStyles.d.ts","sourceRoot":"","sources":["../../src/helpers/getSplitStyles.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EAEV,iBAAiB,EACjB,SAAS,EACT,cAAc,EACd,aAAa,EAMb,eAAe,EACf,YAAY,EAEZ,qBAAqB,EAErB,cAAc,EACd,WAAW,EAEZ,MAAM,UAAU,CAAA;AA6BjB,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAE3D,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAA;AAMhE,KAAK,aAAa,GAAG,CACnB,KAAK,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAC7B,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,MAAM,EACjB,cAAc,EAAE,qBAAqB,EACrC,UAAU,EAAE,eAAe,EAC3B,iBAAiB,CAAC,EAAE,cAAc,GAAG,IAAI,EACzC,OAAO,CAAC,EAAE,iBAAiB,EAE3B,WAAW,CAAC,EAAE,MAAM,EACpB,KAAK,CAAC,EAAE,SAAS,KACd,cAAc,CAAA;AAEnB,eAAO,MAAM,UAAU,MAAM,CAAA;AAuB7B,eAAO,MAAM,cAAc,EAAE,aAkrC5B,CAAA;AAsDD,eAAO,MAAM,WAAW,eACV,aAAa,UACjB,MAAM,WACL,MAAM,wBACO,OAAO,KAC5B,cA2BF,CAAA;AA0BD,eAAO,MAAM,cAAc,EAAE,aAQ5B,CAAA"}

package/types/helpers/propMapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"propMapper.d.ts","sourceRoot":"","sources":["../../src/helpers/propMapper.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,iBAAiB,EAGjB,qBAAqB,EAEtB,MAAM,UAAU,CAAA;AAOjB,eAAO,MAAM,UAAU,EAAE,UAqExB,CAAA;AAgGD,wBAAgB,+BAA+B,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,qBAAqB,sBAkBtF;AAMD,eAAO,MAAM,uBAAuB,cAAe,GAAG,QAErD,CAAA;AAuID,eAAO,MAAM,cAAc,QACpB,MAAM,SACJ,MAAM,wDAED,QAAQ,aAAa,CAAC,QAqFnC,CAAA"}
+{"version":3,"file":"propMapper.d.ts","sourceRoot":"","sources":["../../src/helpers/propMapper.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,iBAAiB,EAGjB,qBAAqB,EAEtB,MAAM,UAAU,CAAA;AAOjB,eAAO,MAAM,UAAU,EAAE,UAqExB,CAAA;AAgGD,wBAAgB,+BAA+B,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,qBAAqB,sBAkBtF;AAMD,eAAO,MAAM,uBAAuB,cAAe,GAAG,QAErD,CAAA;AAuID,eAAO,MAAM,cAAc,QACpB,MAAM,SACJ,MAAM,wDAED,QAAQ,aAAa,CAAC,QAyFnC,CAAA"}

package/types/hooks/useConfiguration.d.ts

@@ -66,6 +66,7 @@ export declare const useConfiguration: () => {
         }) | undefined;
         autocompleteSpecificTokens?: (boolean | "except-special") | undefined;
         mediaPropOrder?: boolean | undefined;
+        fastSchemeChange?: boolean | undefined;
     };
     tokens: Omit<{
         [x: string]: {

package/types/hooks/useConfiguration.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useConfiguration.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQ5B,CAAA"}
+{"version":3,"file":"useConfiguration.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQ5B,CAAA"}

package/types/hooks/useTheme.d.ts

@@ -1,6 +1,6 @@
 import { Variable } from '../createVariable';
 import { ThemeManager, ThemeManagerState } from '../helpers/ThemeManager';
-import type { DebugProp, ThemeParsed, ThemeProps, VariableVal, VariableValGeneric } from '../types';
+import type { DebugProp, ThemeParsed, ThemeProps, UseThemeWithStateProps, VariableVal, VariableValGeneric } from '../types';
 export type ChangedThemeResponse = {
     state?: ThemeManagerState;
     themeManager?: ThemeManager | null;
@@ -14,8 +14,8 @@ export type UseThemeResult = {
     [Key in keyof ThemeParsed]: ThemeGettable<ThemeParsed[Key]>;
 };
 export declare const useTheme: (props?: ThemeProps) => UseThemeResult;
-export declare const useThemeWithState: (props: ThemeProps) => [ChangedThemeResponse, ThemeParsed];
-export declare function getThemeProxied(theme: ThemeParsed, themeManager?: ThemeManager, keys?: string[], debug?: DebugProp): UseThemeResult;
+export declare const useThemeWithState: (props: UseThemeWithStateProps) => [ChangedThemeResponse, ThemeParsed];
+export declare function getThemeProxied({ theme, name }: ThemeManagerState, deopt?: boolean, themeManager?: ThemeManager, keys?: string[], debug?: DebugProp): UseThemeResult;
 export declare const activeThemeManagers: Set<ThemeManager>;
-export declare const useChangeThemeEffect: (props: ThemeProps, isRoot?: boolean, keys?: string[], shouldUpdate?: () => boolean | undefined) => ChangedThemeResponse;
+export declare const useChangeThemeEffect: (props: UseThemeWithStateProps, isRoot?: boolean, keys?: string[], shouldUpdate?: () => boolean | undefined) => ChangedThemeResponse;
 //# sourceMappingURL=useTheme.d.ts.map

package/types/hooks/useTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,QAAQ,EAAe,MAAM,mBAAmB,CAAA;AAEzD,OAAO,EACL,YAAY,EACZ,iBAAiB,EAElB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EACV,SAAS,EACT,WAAW,EACX,UAAU,EACV,WAAW,EACX,kBAAkB,EACnB,MAAM,UAAU,CAAA;AAGjB,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB,YAAY,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IAClC,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAaD,MAAM,MAAM,aAAa,CAAC,GAAG,IAAI,GAAG,GAAG;IACrC,GAAG,EAAE,MACD,MAAM,GACN,CAAC,GAAG,SAAS,QAAQ,CAAC,MAAM,CAAC,CAAC,GAC1B,CAAC,SAAS,kBAAkB,GAC1B,GAAG,GACH,OAAO,CAAC,CAAC,EAAE,QAAQ,CAAC,GACtB,GAAG,SAAS,WAAW,GACvB,MAAM,GAAG,MAAM,GACf,OAAO,CAAC,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;KAC1B,GAAG,IAAI,MAAM,WAAW,GAAG,aAAa,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC5D,CAAA;AAED,eAAO,MAAM,QAAQ,WAAW,UAAU,mBAIzC,CAAA;AAED,eAAO,MAAM,iBAAiB,UACrB,UAAU,KAChB,CAAC,oBAAoB,EAAE,WAAW,CAsDpC,CAAA;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,WAAW,EAClB,YAAY,CAAC,EAAE,YAAY,EAC3B,IAAI,CAAC,EAAE,MAAM,EAAE,EACf,KAAK,CAAC,EAAE,SAAS,GAChB,cAAc,CAwDhB;AAED,eAAO,MAAM,mBAAmB,mBAA0B,CAAA;AAE1D,eAAO,MAAM,oBAAoB,UACxB,UAAU,2BAEV,MAAM,EAAE,iBACA,MAAM,OAAO,GAAG,SAAS,KACvC,oBAmPF,CAAA"}
+{"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useTheme.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,QAAQ,EAAe,MAAM,mBAAmB,CAAA;AAEzD,OAAO,EACL,YAAY,EACZ,iBAAiB,EAElB,MAAM,yBAAyB,CAAA;AAEhC,OAAO,KAAK,EACV,SAAS,EACT,WAAW,EACX,UAAU,EACV,sBAAsB,EACtB,WAAW,EACX,kBAAkB,EACnB,MAAM,UAAU,CAAA;AAGjB,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,CAAC,EAAE,iBAAiB,CAAA;IACzB,YAAY,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IAClC,UAAU,EAAE,OAAO,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAA;AAcD,MAAM,MAAM,aAAa,CAAC,GAAG,IAAI,GAAG,GAAG;IACrC,GAAG,EAAE,MACD,MAAM,GACN,CAAC,GAAG,SAAS,QAAQ,CAAC,MAAM,CAAC,CAAC,GAC1B,CAAC,SAAS,kBAAkB,GAC1B,GAAG,GACH,OAAO,CAAC,CAAC,EAAE,QAAQ,CAAC,GACtB,GAAG,SAAS,WAAW,GACvB,MAAM,GAAG,MAAM,GACf,OAAO,CAAC,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;KAC1B,GAAG,IAAI,MAAM,WAAW,GAAG,aAAa,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC5D,CAAA;AAED,eAAO,MAAM,QAAQ,WAAW,UAAU,mBAIzC,CAAA;AAED,eAAO,MAAM,iBAAiB,UACrB,sBAAsB,KAC5B,CAAC,oBAAoB,EAAE,WAAW,CAyDpC,CAAA;AAED,wBAAgB,eAAe,CAC7B,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,iBAAiB,EAClC,KAAK,UAAQ,EACb,YAAY,CAAC,EAAE,YAAY,EAC3B,IAAI,CAAC,EAAE,MAAM,EAAE,EACf,KAAK,CAAC,EAAE,SAAS,GAChB,cAAc,CA8FhB;AAED,eAAO,MAAM,mBAAmB,mBAA0B,CAAA;AAE1D,eAAO,MAAM,oBAAoB,UACxB,sBAAsB,2BAEtB,MAAM,EAAE,iBACA,MAAM,OAAO,GAAG,SAAS,KACvC,oBAwPF,CAAA"}

package/types/setupReactNative.d.ts

@@ -1,4 +1,9 @@
 import { StaticConfig } from './types';
-export declare function getReactNativeConfig(Component: any): Partial<StaticConfig> | null | undefined;
+export declare function getReactNativeConfig(Component: any): Partial<StaticConfig> | {
+    isReactNative: true;
+} | null | undefined;
+/**
+ * @deprecated this is no longer necessary, tamagui auto-detects RN views
+ */
 export declare function setupReactNative(rnExports: Record<string, any>): void;
 //# sourceMappingURL=setupReactNative.d.ts.map

package/types/setupReactNative.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"setupReactNative.d.ts","sourceRoot":"","sources":["../src/setupReactNative.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAItC,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,GAAG,4CAElD;AAED,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAa9D"}
+{"version":3,"file":"setupReactNative.d.ts","sourceRoot":"","sources":["../src/setupReactNative.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAItC,wBAAgB,oBAAoB,CAAC,SAAS,EAAE,GAAG;;qBAkClD;AAqBD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAc9D"}

package/types/styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAE7D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAEjD,OAAO,KAAK,EACV,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAEhB,KAAK,YAAY,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CACzE,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,QAAQ,CAAC,CAAC,CAAC,CAAA;AAEf,KAAK,eAAe,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CAC5E,GAAG,EACH,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,EAAE,CAAA;AAEN,KAAK,wBAAwB,CAAC,CAAC,IAAI,CAAC,SAAS,MAAM,GAC/C;KACG,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,SAAS,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC,GACnE,GAAG,GACH,gBAAgB,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;CACnC,GACD,SAAS,CAAA;AAEb,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,GAAG,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,EAExG,WAAW,EAAE,eAAe,EAE5B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAC/B,eAAe,CAAC,EAAE,wBAAwB,CAAC,QAAQ,CAAC,CAAA;IACpD,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,gjCAyKhD"}
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAE7D,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAEjD,OAAO,KAAK,EACV,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAEhB,KAAK,YAAY,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CACzE,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,QAAQ,CAAC,CAAC,CAAC,CAAA;AAEf,KAAK,eAAe,CAAC,CAAC,SAAS,iBAAiB,IAAI,CAAC,SAAS,gBAAgB,CAC5E,GAAG,EACH,GAAG,EACH,GAAG,EACH,MAAM,CAAC,CACR,GACG,CAAC,GACD,EAAE,CAAA;AAEN,KAAK,wBAAwB,CAAC,CAAC,IAAI,CAAC,SAAS,MAAM,GAC/C;KACG,GAAG,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,SAAS,qBAAqB,CAAC,GAAG,EAAE,MAAM,GAAG,CAAC,GACnE,GAAG,GACH,gBAAgB,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;CACnC,GACD,SAAS,CAAA;AAEb,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,GAAG,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,EAExG,WAAW,EAAE,eAAe,EAE5B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAC/B,eAAe,CAAC,EAAE,wBAAwB,CAAC,QAAQ,CAAC,CAAA;IACpD,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAA;CAC3B,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,gjCA2KhD"}

package/types/types.d.ts

@@ -325,6 +325,10 @@ export interface ThemeProps {
     shouldUpdate?: () => boolean | undefined;
     shallow?: boolean;
 }
+export type UseThemeWithStateProps = ThemeProps & {
+    deopt?: boolean;
+    disable?: boolean;
+};
 type ArrayIntersection<A extends any[]> = A[keyof A];
 type GetAltThemeNames<S> = (S extends `${string}_${infer Alt}` ? GetAltThemeNames<Alt> : S) | S;
 type SpacerPropsBase = {
@@ -385,6 +389,24 @@ type GenericTamaguiSettings = {
      * @default false
      */
     mediaPropOrder?: boolean;
+    /**
+     * On iOS, this enables a mode where Tamagui returns color values using `DynamicColorIOS`
+     * This is a React Native built in feature, you can read the docs here:
+     *   https://reactnative.dev/docs/dynamiccolorios
+     *
+     * We're working to make this enabled by default without any setting, but Tamagui themes
+     * support inversing and/or changing to light/dark at any point in the tree. We haven't implemented
+     * support for either of these cases when combined with this feature.
+     *
+     * So - as long as you:
+     *
+     *   1. Only use light/dark changes of themes at the root of your app
+     *   2. Don't use <Theme inverse> or themeInverse
+     *   3. Always change light/dark alongside the Appearance.colorSheme
+     *
+     * Then this feature is safe to turn on and will significantly speed up dark/light re-renders.
+     */
+    fastSchemeChange?: boolean;
 };
 export type TamaguiSettings = TamaguiConfig['settings'];
 export type CreateTamaguiProps = {