@tamagui/core 1.0.1-beta.226 → 1.0.1-beta.228

package/dist/esm/hooks/useConstant.js

@@ -0,0 +1,15 @@
+import { useMemo, useRef } from "react";
+function useConstant(fn) {
+  if (typeof document === "undefined") {
+    return useMemo(() => fn(), []);
+  }
+  const ref = useRef();
+  if (!ref.current) {
+    ref.current = { v: fn() };
+  }
+  return ref.current.v;
+}
+export {
+  useConstant
+};
+//# sourceMappingURL=useConstant.js.map

package/dist/esm/hooks/useConstant.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useConstant.tsx"],
+  "sourcesContent": ["import { useMemo, useRef } from 'react'\n\ntype ResultBox<T> = { v: T }\n\nexport function useConstant<T>(fn: () => T): T {\n  // RSC compat\n  if (typeof document === 'undefined') {\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    return useMemo(() => fn(), [])\n  }\n\n  const ref = useRef<ResultBox<T>>()\n\n  if (!ref.current) {\n    ref.current = { v: fn() }\n  }\n\n  return ref.current.v\n}\n"],
+  "mappings": "AAAA,SAAS,SAAS,cAAc;AAIzB,SAAS,YAAe,IAAgB;AAE7C,MAAI,OAAO,aAAa,aAAa;AAEnC,WAAO,QAAQ,MAAM,GAAG,GAAG,CAAC,CAAC;AAAA,EAC/B;AAEA,QAAM,MAAM,OAAqB;AAEjC,MAAI,CAAC,IAAI,SAAS;AAChB,QAAI,UAAU,EAAE,GAAG,GAAG,EAAE;AAAA,EAC1B;AAEA,SAAO,IAAI,QAAQ;AACrB;",
+  "names": []
+}

package/dist/esm/hooks/useIsMounted.js

@@ -0,0 +1,16 @@
+import { useRef } from "react";
+import { useIsomorphicLayoutEffect } from "../constants/platform";
+function useIsMounted() {
+  const isMounted = useRef(false);
+  useIsomorphicLayoutEffect(() => {
+    isMounted.current = true;
+    return () => {
+      isMounted.current = false;
+    };
+  }, []);
+  return isMounted;
+}
+export {
+  useIsMounted
+};
+//# sourceMappingURL=useIsMounted.js.map

package/dist/esm/hooks/useIsMounted.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useIsMounted.ts"],
+  "sourcesContent": ["import { useRef } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\n\nexport function useIsMounted() {\n  const isMounted = useRef(false)\n\n  useIsomorphicLayoutEffect(() => {\n    isMounted.current = true\n\n    return () => {\n      isMounted.current = false\n    }\n  }, [])\n\n  return isMounted\n}\n"],
+  "mappings": "AAAA,SAAS,cAAc;AAEvB,SAAS,iCAAiC;AAEnC,SAAS,eAAe;AAC7B,QAAM,YAAY,OAAO,KAAK;AAE9B,4BAA0B,MAAM;AAC9B,cAAU,UAAU;AAEpB,WAAO,MAAM;AACX,gBAAU,UAAU;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;",
+  "names": []
+}

package/dist/esm/hooks/useIsSSR.js

@@ -0,0 +1,22 @@
+import { useState } from "react";
+import { isServer, isWeb, useIsomorphicLayoutEffect } from "../constants/platform";
+import { startTransition } from "../helpers/startTransition";
+const useIsSSR = (props) => {
+  const [val, setVal] = useState(true);
+  useIsomorphicLayoutEffect(() => {
+    if (isWeb && !isServer) {
+      if (props == null ? void 0 : props.immediate) {
+        setVal(false);
+      } else {
+        startTransition(() => {
+          setVal(false);
+        });
+      }
+    }
+  }, []);
+  return val;
+};
+export {
+  useIsSSR
+};
+//# sourceMappingURL=useIsSSR.js.map

package/dist/esm/hooks/useIsSSR.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useIsSSR.tsx"],
+  "sourcesContent": ["import { useState } from 'react'\n\nimport { isServer, isWeb, useIsomorphicLayoutEffect } from '../constants/platform'\nimport { startTransition } from '../helpers/startTransition'\n\n// because any change before first useEffect causes hydration / mismatch issues\n\nexport const useIsSSR = (props?: { immediate?: boolean }) => {\n  const [val, setVal] = useState(true)\n\n  useIsomorphicLayoutEffect(() => {\n    if (isWeb && !isServer) {\n      // could also have a global tamagui `config.immediateSSRTransition`\n      if (props?.immediate) {\n        setVal(false)\n      } else {\n        startTransition(() => {\n          setVal(false)\n        })\n      }\n    }\n  }, [])\n\n  return val\n}\n"],
+  "mappings": "AAAA,SAAS,gBAAgB;AAEzB,SAAS,UAAU,OAAO,iCAAiC;AAC3D,SAAS,uBAAuB;AAIzB,MAAM,WAAW,CAAC,UAAoC;AAC3D,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,IAAI;AAEnC,4BAA0B,MAAM;AAC9B,QAAI,SAAS,CAAC,UAAU;AAEtB,UAAI,+BAAO,WAAW;AACpB,eAAO,KAAK;AAAA,MACd,OAAO;AACL,wBAAgB,MAAM;AACpB,iBAAO,KAAK;AAAA,QACd,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;",
+  "names": []
+}

package/dist/esm/hooks/usePressable.js

@@ -0,0 +1,12 @@
+var _a, _b;
+import { Pressable } from "react-native";
+const getPressable = (_b = (_a = Pressable) == null ? void 0 : _a["type"]) == null ? void 0 : _b["render"];
+const usePressable = (props) => {
+  const out = getPressable(props);
+  const { children, style, ...pressableProps } = out.props;
+  return [pressableProps, style];
+};
+export {
+  usePressable
+};
+//# sourceMappingURL=usePressable.js.map

package/dist/esm/hooks/usePressable.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/usePressable.tsx"],
+  "sourcesContent": ["import { Pressable, PressableProps } from 'react-native'\n\nconst getPressable = Pressable?.['type']?.['render']\n\nexport const usePressable = (props: PressableProps) => {\n  const out = getPressable(props)\n  const { children, style, ...pressableProps } = out.props\n  return [pressableProps, style] as const\n}\n"],
+  "mappings": "AAAA;AAAA,SAAS,iBAAiC;AAE1C,MAAM,gBAAe,4CAAY,YAAZ,mBAAsB;AAEpC,MAAM,eAAe,CAAC,UAA0B;AACrD,QAAM,MAAM,aAAa,KAAK;AAC9B,QAAM,EAAE,UAAU,UAAU,eAAe,IAAI,IAAI;AACnD,SAAO,CAAC,gBAAgB,KAAK;AAC/B;",
+  "names": []
+}

package/dist/esm/hooks/useTheme.js

@@ -7,17 +7,20 @@ import { ThemeManager, hasNoThemeUpdatingProps } from "../helpers/ThemeManager";
 import { ThemeManagerContext } from "../helpers/ThemeManagerContext";
 import { GetThemeUnwrapped } from "./getThemeUnwrapped";
 const emptyProps = { name: null };
+function getDefaultThemeProxied() {
+  const config = getConfig();
+  const name = Object.keys(config.themes)[0];
+  return getThemeProxied({
+    theme: config.themes[name],
+    name
+  });
+}
 const useTheme = (props = emptyProps) => {
   var _a;
   if (isRSC) {
-    const config = getConfig();
-    const name2 = Object.keys(config.themes)[0];
-    return getThemeProxied({
-      theme: config.themes[name2],
-      name: name2
-    });
+    return getDefaultThemeProxied();
   }
-  const { name, theme, themes, themeManager, className, isNewTheme } = useChangeThemeEffect(props);
+  const { name, theme, themeManager, className, isNewTheme } = useChangeThemeEffect(props);
   if (process.env.NODE_ENV === "development") {
     if (isWeb && isNewTheme && className === ((_a = themeManager == null ? void 0 : themeManager.parentManager) == null ? void 0 : _a.state.className)) {
       console.error(`Should always change, duplicating ThemeMananger bug`, themeManager);
@@ -36,7 +39,7 @@ const useTheme = (props = emptyProps) => {
     if (process.env.NODE_ENV === "development") {
       console.warn("No theme found", name, props, themeManager);
     }
-    return themes[Object.keys(themes)[0]];
+    return getDefaultThemeProxied();
   }
   return useMemo(() => {
     return getThemeProxied({
@@ -93,25 +96,23 @@ const getThemeManager = (theme) => theme == null ? void 0 : theme[GetThemeManage
 const getThemeIsNewTheme = (theme) => theme == null ? void 0 : theme[GetIsNewTheme];
 const activeThemeManagers = /* @__PURE__ */ new Set();
 const useChangeThemeEffect = (props, root = false) => {
-  const parentManager = useContext(ThemeManagerContext);
-  const config = getConfig();
-  const { debug } = props;
-  const disable = props.disable;
-  const { themes } = config;
   if (isRSC) {
     return {
       ...createState().state,
-      themes,
       themeManager: null
     };
   }
+  const parentManager = useContext(ThemeManagerContext);
+  const {
+    debug,
+    disable
+  } = props;
   if (disable) {
     if (!parentManager)
       throw new Error(`Disable topmost`);
     return {
       ...parentManager.state,
       isNewTheme: false,
-      themes,
       themeManager: parentManager
     };
   }
@@ -147,22 +148,22 @@ const useChangeThemeEffect = (props, root = false) => {
     console.log("useTheme.render isNewTheme", isNewTheme, props, themeManager.state.name, parentManager == null ? void 0 : parentManager.state.name);
   if (hasNoThemeUpdatingProps(props)) {
     if (!parentManager)
-      throw new Error(`Nada`);
+      throw `impossible`;
+    if (process.env.NODE_ENV === "development" && props.debug === "verbose")
+      console.log("useTheme no updating props", parentManager.state);
     return {
       ...parentManager.state,
-      themes,
       themeManager: parentManager,
       isNewTheme: false
     };
   }
   updateState();
   if (!mounted && !parentManager) {
-    throw new Error(`Impossible`);
+    throw `impossible`;
   }
   return {
     ...state,
     isNewTheme,
-    themes,
     themeManager,
     ...!mounted && parentManager && {
       ...parentManager.state,
@@ -184,8 +185,11 @@ const useChangeThemeEffect = (props, root = false) => {
     };
   }
   function updateState() {
-    if (themeManager.getStateIfChanged(props, state, parentManager)) {
+    if (themeManager.getStateIfChanged(props, isNewTheme ? state : null, parentManager)) {
       setThemeState(createState);
+    } else {
+      if (process.env.NODE_ENV === "development" && props.debug === "verbose")
+        console.log(`useTheme updateState didn't change`);
     }
   }
 };

package/dist/esm/hooks/useTheme.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/useTheme.tsx"],
-  "sourcesContent": ["/* eslint-disable no-console */\nimport { isClient, isRSC, isServer, isWeb } from '@tamagui/constants'\nimport { useContext, useLayoutEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { createProxy } from '../helpers/createProxy'\nimport { ThemeManager, ThemeManagerState, hasNoThemeUpdatingProps } from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { ThemeParsed, ThemeProps } from '../types'\nimport { GetThemeUnwrapped } from './getThemeUnwrapped'\n\nexport type ChangedThemeResponse = {\n  themes: Record<string, ThemeParsed>\n  themeManager: ThemeManager | null\n  name: string\n  isNewTheme?: boolean\n  theme?: ThemeParsed | null\n  className?: string\n}\n\nconst emptyProps = { name: null }\nexport const useTheme = (props: ThemeProps = emptyProps): ThemeParsed => {\n  if (isRSC) {\n    const config = getConfig()\n    const name = Object.keys(config.themes)[0]\n    return getThemeProxied({\n      theme: config.themes[name],\n      name,\n    })\n  }\n\n  const { name, theme, themes, themeManager, className, isNewTheme } = useChangeThemeEffect(props)\n\n  if (process.env.NODE_ENV === 'development') {\n    // ensure we aren't creating too many ThemeManagers\n    if (isWeb && isNewTheme && className === themeManager?.parentManager?.state.className) {\n      console.error(`Should always change, duplicating ThemeMananger bug`, themeManager)\n      // eslint-disable-next-line no-debugger\n      debugger\n    }\n    if (props.debug === 'verbose') {\n      console.groupCollapsed('  \uD83D\uDD39 useTheme =>', name)\n      const logs = { ...props, name, className, ...(isDevTools && { theme }) }\n      for (const key in logs) {\n        console.log('  ', key, logs[key])\n      }\n      console.groupEnd()\n    }\n  }\n\n  if (!theme) {\n    if (process.env.NODE_ENV === 'development') {\n      console.warn('No theme found', name, props, themeManager)\n    }\n    return themes[Object.keys(themes)[0]]\n  }\n\n  return useMemo(() => {\n    return getThemeProxied({\n      isNewTheme,\n      theme,\n      name,\n      className,\n      themeManager,\n    })\n  }, [theme, isNewTheme, name, className, themeManager])\n}\n\nfunction getThemeProxied({\n  theme,\n  name,\n  className,\n  themeManager,\n  isNewTheme,\n}: {\n  theme: any\n  name: string\n  className?: string\n  themeManager?: ThemeManager | null\n  isNewTheme?: boolean\n}) {\n  return createProxy(theme, {\n    has(_, key) {\n      if (typeof key === 'string') {\n        if (key[0] === '$') key = key.slice(1)\n        return themeManager?.allKeys.has(key)\n      }\n      return Reflect.has(theme, key)\n    },\n    get(_, key) {\n      if (key === GetThemeUnwrapped) {\n        return theme\n      } else if (key === GetThemeManager) {\n        return themeManager\n      } else if (key === GetIsNewTheme) {\n        return isNewTheme\n      } else if (key === 'name') {\n        return name\n      } else if (key === 'className') {\n        return className\n      } else if (!name || key === '__proto__' || typeof key === 'symbol' || key === '$typeof') {\n        return Reflect.get(_, key)\n      }\n      // auto convert variables to plain\n      if (key[0] === '$') key = key.slice(1)\n      if (!themeManager) {\n        return theme[key]\n      }\n      return themeManager.getValue(key)\n    },\n  })\n}\n\nconst GetThemeManager = Symbol()\nconst GetIsNewTheme = Symbol()\n\nexport const getThemeManager = (theme: any): ThemeManager | undefined => theme?.[GetThemeManager]\nexport const getThemeIsNewTheme = (theme: any): ThemeManager | undefined => theme?.[GetIsNewTheme]\n\nexport const activeThemeManagers = new Set<ThemeManager>()\n\nexport const useChangeThemeEffect = (props: ThemeProps, root = false): ChangedThemeResponse => {\n  const parentManager = useContext(ThemeManagerContext)\n  const config = getConfig()\n  const { debug } = props\n  // @ts-expect-error internal use only\n  const disable = props.disable\n  const { themes } = config\n  if (isRSC) {\n    // we need context working for this to work well\n    return {\n      ...createState().state,\n      themes,\n      themeManager: null,\n    }\n  }\n  if (disable) {\n    if (!parentManager) throw new Error(`Disable topmost`)\n    return {\n      ...parentManager.state,\n      isNewTheme: false,\n      themes,\n      themeManager: parentManager,\n    }\n  }\n\n  type State = {\n    isNewTheme: boolean\n    state: ThemeManagerState\n    themeManager: ThemeManager\n    mounted?: boolean\n  }\n\n  const [themeState, setThemeState] = useState<State>(createState)\n  const { isNewTheme, state, themeManager, mounted } = themeState\n\n  if (!isServer) {\n    useLayoutEffect(() => {\n      if (disable) return\n      // SSR safe inverse (because server can't know prefers scheme)\n      // could be done through fancy selectors like how we do prefers-media\n      // but may be a bit of explosion of selectors\n      if (props.inverse && !mounted) {\n        setThemeState({ ...themeState, mounted: true })\n        return\n      }\n      activeThemeManagers.add(themeManager)\n      const disposeChangeListener = parentManager?.onChangeTheme(() => {\n        if (!isNewTheme && !isWeb) {\n          setThemeState({\n            ...themeState,\n            state: { ...themeManager.state },\n            isNewTheme: false,\n          })\n        } else {\n          updateState()\n        }\n      })\n      return () => {\n        activeThemeManagers.delete(themeManager)\n        disposeChangeListener?.()\n      }\n    }, [disable, state, isNewTheme, debug])\n  }\n\n  // prettier-ignore\n  if (process.env.NODE_ENV === 'development' && debug) console.log('useTheme.render isNewTheme', isNewTheme, props, themeManager.state.name, parentManager?.state.name)\n\n  // this seems unnecessary\n  if (hasNoThemeUpdatingProps(props)) {\n    if (!parentManager) throw new Error(`Nada`)\n    return {\n      ...parentManager.state,\n      themes,\n      themeManager: parentManager,\n      isNewTheme: false,\n    }\n  }\n\n  // run inline in render\n  updateState()\n\n  if (!mounted && !parentManager) {\n    throw new Error(`Impossible`)\n  }\n\n  return {\n    ...state,\n    isNewTheme,\n    themes,\n    themeManager,\n    ...(!mounted &&\n      parentManager && {\n        ...parentManager.state,\n        isNewTheme: false,\n        themeManager: parentManager,\n      }),\n  }\n\n  function createState(prev?: State) {\n    const _ = new ThemeManager(props, root ? 'root' : parentManager)\n    const isNewTheme = _ !== parentManager\n    // prettier-ignore\n    if (process.env.NODE_ENV === 'development' && debug) [console.groupCollapsed('useTheme create() isNewTheme', isNewTheme), console.log('parent.state.name', parentManager?.state.name, '\\n', 'props', props, '\\n', isClient ? parentManager : '', 'getState', isNewTheme && isClient ? _.getState(props) : '', '\\n', 'state', isClient ? { ..._.state } : ''), console.groupEnd()]\n    // only inverse relies on this for ssr\n    const mounted = !props.inverse ? true : root || prev?.mounted || false\n    return {\n      // ThemeManager returns parentManager if no change\n      isNewTheme,\n      state: { ..._.state },\n      themeManager: _,\n      mounted,\n    }\n  }\n\n  function updateState() {\n    if (themeManager.getStateIfChanged(props, state, parentManager)) {\n      setThemeState(createState)\n    }\n  }\n}\n"],
-  "mappings": "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",
-  "names": ["name", "isNewTheme", "mounted"]
+  "sourcesContent": ["/* eslint-disable no-console */\nimport { isClient, isRSC, isServer, isWeb } from '@tamagui/constants'\nimport { useContext, useLayoutEffect, useMemo, useState } from 'react'\n\nimport { getConfig } from '../config'\nimport { isDevTools } from '../constants/isDevTools'\nimport { createProxy } from '../helpers/createProxy'\nimport { ThemeManager, ThemeManagerState, hasNoThemeUpdatingProps } from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { ThemeParsed, ThemeProps } from '../types'\nimport { GetThemeUnwrapped } from './getThemeUnwrapped'\n\nexport type ChangedThemeResponse = {\n  themeManager: ThemeManager | null\n  name: string\n  isNewTheme?: boolean\n  theme?: ThemeParsed | null\n  className?: string\n}\n\nconst emptyProps = { name: null }\n\nfunction getDefaultThemeProxied() {\n  const config = getConfig()\n  const name = Object.keys(config.themes)[0]\n  return getThemeProxied({\n    theme: config.themes[name],\n    name,\n  })\n}\n\nexport const useTheme = (props: ThemeProps = emptyProps): ThemeParsed => {\n  if (isRSC) {\n    return getDefaultThemeProxied()\n  }\n\n  const { name, theme, themeManager, className, isNewTheme } = useChangeThemeEffect(props)\n\n  if (process.env.NODE_ENV === 'development') {\n    // ensure we aren't creating too many ThemeManagers\n    if (isWeb && isNewTheme && className === themeManager?.parentManager?.state.className) {\n      console.error(`Should always change, duplicating ThemeMananger bug`, themeManager)\n      // eslint-disable-next-line no-debugger\n      debugger\n    }\n    if (props.debug === 'verbose') {\n      console.groupCollapsed('  \uD83D\uDD39 useTheme =>', name)\n      const logs = { ...props, name, className, ...(isDevTools && { theme }) }\n      for (const key in logs) {\n        console.log('  ', key, logs[key])\n      }\n      console.groupEnd()\n    }\n  }\n\n  if (!theme) {\n    if (process.env.NODE_ENV === 'development') {\n      console.warn('No theme found', name, props, themeManager)\n    }\n    return getDefaultThemeProxied()\n  }\n\n  return useMemo(() => {\n    return getThemeProxied({\n      isNewTheme,\n      theme,\n      name,\n      className,\n      themeManager,\n    })\n  }, [theme, isNewTheme, name, className, themeManager])\n}\n\nfunction getThemeProxied({\n  theme,\n  name,\n  className,\n  themeManager,\n  isNewTheme,\n}: {\n  theme: any\n  name: string\n  className?: string\n  themeManager?: ThemeManager | null\n  isNewTheme?: boolean\n}) {\n  return createProxy(theme, {\n    has(_, key) {\n      if (typeof key === 'string') {\n        if (key[0] === '$') key = key.slice(1)\n        return themeManager?.allKeys.has(key)\n      }\n      return Reflect.has(theme, key)\n    },\n    get(_, key) {\n      if (key === GetThemeUnwrapped) {\n        return theme\n      } else if (key === GetThemeManager) {\n        return themeManager\n      } else if (key === GetIsNewTheme) {\n        return isNewTheme\n      } else if (key === 'name') {\n        return name\n      } else if (key === 'className') {\n        return className\n      } else if (!name || key === '__proto__' || typeof key === 'symbol' || key === '$typeof') {\n        return Reflect.get(_, key)\n      }\n      // auto convert variables to plain\n      if (key[0] === '$') key = key.slice(1)\n      if (!themeManager) {\n        return theme[key]\n      }\n      return themeManager.getValue(key)\n    },\n  })\n}\n\nconst GetThemeManager = Symbol()\nconst GetIsNewTheme = Symbol()\n\nexport const getThemeManager = (theme: any): ThemeManager | undefined => theme?.[GetThemeManager]\nexport const getThemeIsNewTheme = (theme: any): ThemeManager | undefined => theme?.[GetIsNewTheme]\n\nexport const activeThemeManagers = new Set<ThemeManager>()\n\nexport const useChangeThemeEffect = (props: ThemeProps, root = false): ChangedThemeResponse => {\n  if (isRSC) {\n    // we need context working for this to work well\n    return {\n      ...createState().state,\n      themeManager: null,\n    }\n  }\n  const parentManager = useContext(ThemeManagerContext)\n\n  const {\n    debug,\n    // @ts-expect-error internal use only\n    disable,\n  } = props\n\n  if (disable) {\n    if (!parentManager) throw new Error(`Disable topmost`)\n    return {\n      ...parentManager.state,\n      isNewTheme: false,\n      themeManager: parentManager,\n    }\n  }\n\n  type State = {\n    isNewTheme: boolean\n    state: ThemeManagerState\n    themeManager: ThemeManager\n    mounted?: boolean\n  }\n\n  const [themeState, setThemeState] = useState<State>(createState)\n  const { isNewTheme, state, themeManager, mounted } = themeState\n\n  if (!isServer) {\n    useLayoutEffect(() => {\n      if (disable) return\n      // SSR safe inverse (because server can't know prefers scheme)\n      // could be done through fancy selectors like how we do prefers-media\n      // but may be a bit of explosion of selectors\n      if (props.inverse && !mounted) {\n        setThemeState({ ...themeState, mounted: true })\n        return\n      }\n      activeThemeManagers.add(themeManager)\n      const disposeChangeListener = parentManager?.onChangeTheme(() => {\n        if (!isNewTheme && !isWeb) {\n          setThemeState({\n            ...themeState,\n            state: { ...themeManager.state },\n            isNewTheme: false,\n          })\n        } else {\n          updateState()\n        }\n      })\n      return () => {\n        activeThemeManagers.delete(themeManager)\n        disposeChangeListener?.()\n      }\n    }, [disable, state, isNewTheme, debug])\n  }\n\n  // prettier-ignore\n  if (process.env.NODE_ENV === 'development' && debug) console.log('useTheme.render isNewTheme', isNewTheme, props, themeManager.state.name, parentManager?.state.name)\n\n  // this seems unnecessary\n  if (hasNoThemeUpdatingProps(props)) {\n    if (!parentManager) throw `impossible`\n    // prettier-ignore\n    if (process.env.NODE_ENV === 'development' && props.debug === 'verbose') console.log('useTheme no updating props', parentManager.state)\n    return {\n      ...parentManager.state,\n      themeManager: parentManager,\n      isNewTheme: false,\n    }\n  }\n\n  // run inline in render\n  updateState()\n\n  if (!mounted && !parentManager) {\n    throw `impossible`\n  }\n\n  return {\n    ...state,\n    isNewTheme,\n    themeManager,\n    ...(!mounted &&\n      parentManager && {\n        ...parentManager.state,\n        isNewTheme: false,\n        themeManager: parentManager,\n      }),\n  }\n\n  function createState(prev?: State) {\n    const _ = new ThemeManager(props, root ? 'root' : parentManager)\n    const isNewTheme = _ !== parentManager\n    // prettier-ignore\n    if (process.env.NODE_ENV === 'development' && debug) [console.groupCollapsed('useTheme create() isNewTheme', isNewTheme), console.log('parent.state.name', parentManager?.state.name, '\\n', 'props', props, '\\n', isClient ? parentManager : '', 'getState', isNewTheme && isClient ? _.getState(props) : '', '\\n', 'state', isClient ? { ..._.state } : ''), console.groupEnd()]\n    // only inverse relies on this for ssr\n    const mounted = !props.inverse ? true : root || prev?.mounted || false\n    return {\n      // ThemeManager returns parentManager if no change\n      isNewTheme,\n      state: { ..._.state },\n      themeManager: _,\n      mounted,\n    }\n  }\n\n  function updateState() {\n    if (themeManager.getStateIfChanged(props, isNewTheme ? state : null, parentManager)) {\n      setThemeState(createState)\n    } else {\n      // prettier-ignore\n      if (process.env.NODE_ENV === 'development' && props.debug === 'verbose') console.log(`useTheme updateState didn't change`)\n    }\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["isNewTheme", "mounted"]
 }

package/dist/esm/hooks/useUnmountEffect.js

@@ -0,0 +1,8 @@
+import { useEffect } from "react";
+function useUnmountEffect(callback) {
+  return useEffect(() => () => callback(), []);
+}
+export {
+  useUnmountEffect
+};
+//# sourceMappingURL=useUnmountEffect.js.map

package/dist/esm/hooks/useUnmountEffect.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useUnmountEffect.ts"],
+  "sourcesContent": ["import { useEffect } from 'react'\n\nexport function useUnmountEffect(callback: () => void) {\n  return useEffect(() => () => callback(), [])\n}\n"],
+  "mappings": "AAAA,SAAS,iBAAiB;AAEnB,SAAS,iBAAiB,UAAsB;AACrD,SAAO,UAAU,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC;AAC7C;",
+  "names": []
+}

package/dist/esm/injectStyles.js

@@ -0,0 +1,16 @@
+const stylesheets = {};
+const injectStyles = ({ filePath, css }) => {
+  let stylesheet = stylesheets[filePath];
+  if (!stylesheet) {
+    const styleEl = document.createElement("style");
+    styleEl.setAttribute("data-file", filePath);
+    styleEl.setAttribute("type", "text/css");
+    stylesheet = stylesheets[filePath] = styleEl;
+    document.head.appendChild(styleEl);
+  }
+  stylesheet.innerHTML = css;
+};
+export {
+  injectStyles
+};
+//# sourceMappingURL=injectStyles.js.map

package/dist/esm/injectStyles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/injectStyles.ts"],
+  "sourcesContent": ["// for vite dev mode\n\nconst stylesheets: Record<string, HTMLElement> = {}\n\ninterface InjectStylesOptions {\n  filePath: string\n  css: string\n}\n\nexport const injectStyles = ({ filePath, css }: InjectStylesOptions) => {\n  let stylesheet = stylesheets[filePath]\n  if (!stylesheet) {\n    const styleEl = document.createElement('style')\n    styleEl.setAttribute('data-file', filePath)\n    styleEl.setAttribute('type', 'text/css')\n    stylesheet = stylesheets[filePath] = styleEl\n    document.head.appendChild(styleEl)\n  }\n  stylesheet.innerHTML = css\n}\n"],
+  "mappings": "AAEA,MAAM,cAA2C,CAAC;AAO3C,MAAM,eAAe,CAAC,EAAE,UAAU,IAAI,MAA2B;AACtE,MAAI,aAAa,YAAY;AAC7B,MAAI,CAAC,YAAY;AACf,UAAM,UAAU,SAAS,cAAc,OAAO;AAC9C,YAAQ,aAAa,aAAa,QAAQ;AAC1C,YAAQ,aAAa,QAAQ,UAAU;AACvC,iBAAa,YAAY,YAAY;AACrC,aAAS,KAAK,YAAY,OAAO;AAAA,EACnC;AACA,aAAW,YAAY;AACzB;",
+  "names": []
+}

package/dist/esm/styled.js

@@ -3,16 +3,6 @@ import { ReactNativeStaticConfigs } from "./setupReactNative";
 function styled(Component, options, staticExtractionOptions) {
   const staticConfigProps = (() => {
     const parentStaticConfig = "staticConfig" in Component ? Component.staticConfig : null;
-    if (process.env.NODE_ENV === "development") {
-      if (parentStaticConfig == null ? void 0 : parentStaticConfig.isHOC) {
-        console.warn(
-          `Warning: Parent component is a functional component, not a Tamagui styled() component. Extending with styled() will break and lead to incorrect styles.`,
-          `Given options:`,
-          options,
-          new Error().stack
-        );
-      }
-    }
     if (options) {
       const {
         variants,

package/dist/esm/styled.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/styled.tsx"],
-  "sourcesContent": ["import { createComponent } from './createComponent'\nimport { ReactNativeStaticConfigs } from './setupReactNative'\nimport {\n  GetProps,\n  GetVariantValues,\n  MediaProps,\n  PseudoProps,\n  StaticConfig,\n  StylableComponent,\n  TamaguiComponent,\n  TamaguiElement,\n  VariantDefinitions,\n  VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {\n  name?: string\n  variants?: VariantDefinitions<ParentComponent> | undefined\n  defaultVariants?: { [key: string]: any }\n}\n\n// can't infer from styled(<YStack />) which would be nice\n// * excessively deep type instantiation\n\ntype GetBaseProps<A extends StylableComponent> =\n  // A extends TamaguiReactElement\n  //   ? GetBaseProps<A['type']> :\n  A extends TamaguiComponent<any, any, infer P> ? P : GetProps<A>\n\ntype GetVariantProps<A extends StylableComponent> =\n  // A extends TamaguiReactElement\n  //   ? GetVariantProps<A['type']>\n  //   :\n  A extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\nexport function styled<\n  ParentComponent extends StylableComponent,\n  Variants extends VariantDefinitions<ParentComponent> | void = VariantDefinitions<ParentComponent> | void\n>(\n  Component: ParentComponent,\n  // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n  options?: GetProps<ParentComponent> & {\n    name?: string\n    variants?: Variants | undefined\n    // thought i had this typed, but can't get it linked\n    defaultVariants?: { [key: string]: any }\n    acceptsClassName?: boolean\n  },\n  staticExtractionOptions?: Partial<StaticConfig>\n) {\n  // allows passing styled(<H1 bc=\"red\" />)\n  // but to get types right would be tricky\n  // if (isValidElement(Component) && isTamaguiComponent(Component.type)) {\n  //   const props = Component.props\n  //   if (props && typeof props === 'object') {\n  //     Component = Component.type as any\n  //     options = options ? ({ ...props, ...options } as any) : props\n  //   }\n  // }\n\n  const staticConfigProps = (() => {\n    const parentStaticConfig =\n      'staticConfig' in Component ? (Component.staticConfig as StaticConfig) : null\n\n    if (process.env.NODE_ENV === 'development') {\n      if (parentStaticConfig?.isHOC) {\n        // eslint-disable-next-line no-console\n        console.warn(\n          `Warning: Parent component is a functional component, not a Tamagui styled() component. Extending with styled() will break and lead to incorrect styles.`,\n          `Given options:`,\n          options,\n          new Error().stack\n        )\n      }\n    }\n\n    if (options) {\n      const {\n        variants,\n        name,\n        defaultVariants,\n        acceptsClassName: acceptsClassNameProp,\n        ...defaultProps\n      } = options\n      if (defaultVariants) {\n        Object.assign(defaultProps, defaultVariants)\n      }\n      const isReactNative = Boolean(\n        ReactNativeStaticConfigs.has(Component) ||\n          ReactNativeStaticConfigs.has(parentStaticConfig?.Component) ||\n          parentStaticConfig?.isReactNative ||\n          staticExtractionOptions?.isReactNative\n      )\n      const isTamagui = !isReactNative && !!parentStaticConfig\n\n      const Comp = isReactNative ? parentStaticConfig?.Component || Component : (Component as any)\n      const nativeConf = (isReactNative && ReactNativeStaticConfigs.get(Comp)) || null\n\n      const isText = Boolean(staticExtractionOptions?.isText || parentStaticConfig?.isText)\n      const acceptsClassName = acceptsClassNameProp ?? (isTamagui || isReactNative)\n\n      const conf: Partial<StaticConfig> = {\n        ...staticExtractionOptions,\n        ...(!isTamagui && {\n          Component: Comp,\n        }),\n        // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n        // take away the Partial<> and it's fine\n        variants,\n        defaultProps,\n        defaultVariants,\n        componentName: name,\n        isReactNative,\n        isText,\n        acceptsClassName,\n        ...nativeConf,\n      }\n\n      // bail on non className views as well\n      if (defaultProps.children || !acceptsClassName) {\n        conf.neverFlatten = true\n      }\n\n      return conf\n    }\n    return {}\n  })()\n\n  const component = createComponent(staticConfigProps, Component)\n\n  // get parent props without pseudos and medias so we can rebuild both with new variants\n  // get parent props without pseudos and medias so we can rebuild both with new variants\n  type ParentPropsBase = GetBaseProps<ParentComponent>\n  type ParentVariants = GetVariantProps<ParentComponent>\n\n  type OurVariants = Variants extends void\n    ? {}\n    : {\n        [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<any, infer Val>\n          ? Val\n          : GetVariantValues<keyof Variants[Key]>\n      }\n\n  type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n  type OurPropsBase = ParentPropsBase & VariantProps\n\n  type Props = Variants extends void\n    ? GetProps<ParentComponent>\n    : // start with base props\n      OurPropsBase &\n        // add in media (+ pseudos nested)\n        MediaProps<Partial<OurPropsBase>> &\n        // add in pseudos\n        PseudoProps<Partial<OurPropsBase>>\n\n  type StyledComponent = TamaguiComponent<\n    Props,\n    TamaguiElement,\n    ParentPropsBase,\n    ParentVariants & OurVariants\n  >\n\n  return component as StyledComponent\n}\n\n// import { Stack } from './views/Stack'\n// const X = styled(Stack, {\n//   variants: {\n//     size: {\n//       '...size': (val) => {\n//         return {}\n//       }\n//     },\n//     disabled: {\n//       true: {\n//         opacity: 0.5,\n//         pointerEvents: 'none',\n//       },\n//     },\n//   } as const\n// })\n// type variants = GetStyledVariants<typeof X>\n// const y = <X disabled size=\"$10\" />\n"],
-  "mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,gCAAgC;AAmClC,SAAS,OAId,WAEA,SAOA,yBACA;AAWA,QAAM,qBAAqB,MAAM;AAC/B,UAAM,qBACJ,kBAAkB,YAAa,UAAU,eAAgC;AAE3E,QAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,UAAI,yDAAoB,OAAO;AAE7B,gBAAQ;AAAA,UACN;AAAA,UACA;AAAA,UACA;AAAA,UACA,IAAI,MAAM,EAAE;AAAA,QACd;AAAA,MACF;AAAA,IACF;AAEA,QAAI,SAAS;AACX,YAAM;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA,kBAAkB;AAAA,WACf;AAAA,MACL,IAAI;AACJ,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,gBAAgB;AAAA,QACpB,yBAAyB,IAAI,SAAS,KACpC,yBAAyB,IAAI,yDAAoB,SAAS,MAC1D,yDAAoB,mBACpB,mEAAyB;AAAA,MAC7B;AACA,YAAM,YAAY,CAAC,iBAAiB,CAAC,CAAC;AAEtC,YAAM,OAAO,iBAAgB,yDAAoB,cAAa,YAAa;AAC3E,YAAM,aAAc,iBAAiB,yBAAyB,IAAI,IAAI,KAAM;AAE5E,YAAM,SAAS,SAAQ,mEAAyB,YAAU,yDAAoB,OAAM;AACpF,YAAM,mBAAmB,yBAAyB,aAAa;AAE/D,YAAM,OAA8B;AAAA,QAClC,GAAG;AAAA,QACH,GAAI,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAGA,UAAI,aAAa,YAAY,CAAC,kBAAkB;AAC9C,aAAK,eAAe;AAAA,MACtB;AAEA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AAkC9D,SAAO;AACT;",
+  "sourcesContent": ["import { createComponent } from './createComponent'\nimport { ReactNativeStaticConfigs } from './setupReactNative'\nimport {\n  GetProps,\n  GetVariantValues,\n  MediaProps,\n  PseudoProps,\n  StaticConfig,\n  StylableComponent,\n  TamaguiComponent,\n  TamaguiElement,\n  VariantDefinitions,\n  VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {\n  name?: string\n  variants?: VariantDefinitions<ParentComponent> | undefined\n  defaultVariants?: { [key: string]: any }\n}\n\n// can't infer from styled(<YStack />) which would be nice\n// * excessively deep type instantiation\n\ntype GetBaseProps<A extends StylableComponent> =\n  // A extends TamaguiReactElement\n  //   ? GetBaseProps<A['type']> :\n  A extends TamaguiComponent<any, any, infer P> ? P : GetProps<A>\n\ntype GetVariantProps<A extends StylableComponent> =\n  // A extends TamaguiReactElement\n  //   ? GetVariantProps<A['type']>\n  //   :\n  A extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\nexport function styled<\n  ParentComponent extends StylableComponent,\n  Variants extends VariantDefinitions<ParentComponent> | void = VariantDefinitions<ParentComponent> | void\n>(\n  Component: ParentComponent,\n  // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n  options?: GetProps<ParentComponent> & {\n    name?: string\n    variants?: Variants | undefined\n    // thought i had this typed, but can't get it linked\n    defaultVariants?: { [key: string]: any }\n    acceptsClassName?: boolean\n  },\n  staticExtractionOptions?: Partial<StaticConfig>\n) {\n  // allows passing styled(<H1 bc=\"red\" />)\n  // but to get types right would be tricky\n  // if (isValidElement(Component) && isTamaguiComponent(Component.type)) {\n  //   const props = Component.props\n  //   if (props && typeof props === 'object') {\n  //     Component = Component.type as any\n  //     options = options ? ({ ...props, ...options } as any) : props\n  //   }\n  // }\n\n  const staticConfigProps = (() => {\n    const parentStaticConfig =\n      'staticConfig' in Component ? (Component.staticConfig as StaticConfig) : null\n\n    if (options) {\n      const {\n        variants,\n        name,\n        defaultVariants,\n        acceptsClassName: acceptsClassNameProp,\n        ...defaultProps\n      } = options\n      if (defaultVariants) {\n        Object.assign(defaultProps, defaultVariants)\n      }\n      const isReactNative = Boolean(\n        ReactNativeStaticConfigs.has(Component) ||\n          ReactNativeStaticConfigs.has(parentStaticConfig?.Component) ||\n          parentStaticConfig?.isReactNative ||\n          staticExtractionOptions?.isReactNative\n      )\n      const isTamagui = !isReactNative && !!parentStaticConfig\n\n      const Comp = isReactNative ? parentStaticConfig?.Component || Component : (Component as any)\n      const nativeConf = (isReactNative && ReactNativeStaticConfigs.get(Comp)) || null\n\n      const isText = Boolean(staticExtractionOptions?.isText || parentStaticConfig?.isText)\n      const acceptsClassName = acceptsClassNameProp ?? (isTamagui || isReactNative)\n\n      const conf: Partial<StaticConfig> = {\n        ...staticExtractionOptions,\n        ...(!isTamagui && {\n          Component: Comp,\n        }),\n        // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n        // take away the Partial<> and it's fine\n        variants,\n        defaultProps,\n        defaultVariants,\n        componentName: name,\n        isReactNative,\n        isText,\n        acceptsClassName,\n        ...nativeConf,\n      }\n\n      // bail on non className views as well\n      if (defaultProps.children || !acceptsClassName) {\n        conf.neverFlatten = true\n      }\n\n      return conf\n    }\n    return {}\n  })()\n\n  const component = createComponent(staticConfigProps, Component)\n\n  // get parent props without pseudos and medias so we can rebuild both with new variants\n  // get parent props without pseudos and medias so we can rebuild both with new variants\n  type ParentPropsBase = GetBaseProps<ParentComponent>\n  type ParentVariants = GetVariantProps<ParentComponent>\n\n  type OurVariants = Variants extends void\n    ? {}\n    : {\n        [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<any, infer Val>\n          ? Val\n          : GetVariantValues<keyof Variants[Key]>\n      }\n\n  type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n  type OurPropsBase = ParentPropsBase & VariantProps\n\n  type Props = Variants extends void\n    ? GetProps<ParentComponent>\n    : // start with base props\n      OurPropsBase &\n        // add in media (+ pseudos nested)\n        MediaProps<Partial<OurPropsBase>> &\n        // add in pseudos\n        PseudoProps<Partial<OurPropsBase>>\n\n  type StyledComponent = TamaguiComponent<\n    Props,\n    TamaguiElement,\n    ParentPropsBase,\n    ParentVariants & OurVariants\n  >\n\n  return component as StyledComponent\n}\n\n// import { Stack } from './views/Stack'\n// const X = styled(Stack, {\n//   variants: {\n//     size: {\n//       '...size': (val) => {\n//         return {}\n//       }\n//     },\n//     disabled: {\n//       true: {\n//         opacity: 0.5,\n//         pointerEvents: 'none',\n//       },\n//     },\n//   } as const\n// })\n// type variants = GetStyledVariants<typeof X>\n// const y = <X disabled size=\"$10\" />\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,gCAAgC;AAmClC,SAAS,OAId,WAEA,SAOA,yBACA;AAWA,QAAM,qBAAqB,MAAM;AAC/B,UAAM,qBACJ,kBAAkB,YAAa,UAAU,eAAgC;AAE3E,QAAI,SAAS;AACX,YAAM;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA,kBAAkB;AAAA,WACf;AAAA,MACL,IAAI;AACJ,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,gBAAgB;AAAA,QACpB,yBAAyB,IAAI,SAAS,KACpC,yBAAyB,IAAI,yDAAoB,SAAS,MAC1D,yDAAoB,mBACpB,mEAAyB;AAAA,MAC7B;AACA,YAAM,YAAY,CAAC,iBAAiB,CAAC,CAAC;AAEtC,YAAM,OAAO,iBAAgB,yDAAoB,cAAa,YAAa;AAC3E,YAAM,aAAc,iBAAiB,yBAAyB,IAAI,IAAI,KAAM;AAE5E,YAAM,SAAS,SAAQ,mEAAyB,YAAU,yDAAoB,OAAM;AACpF,YAAM,mBAAmB,yBAAyB,aAAa;AAE/D,YAAM,OAA8B;AAAA,QAClC,GAAG;AAAA,QACH,GAAI,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL;AAGA,UAAI,aAAa,YAAY,CAAC,kBAAkB;AAC9C,aAAK,eAAe;AAAA,MACtB;AAEA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AAkC9D,SAAO;AACT;",
   "names": []
 }

package/dist/esm/views/Theme.js

@@ -9,22 +9,18 @@ function Theme(props) {
     return props.children;
   }
   const isRoot = !!props["_isRoot"];
-  const { name, theme, themeManager, themes, isNewTheme, className } = useChangeThemeEffect(
-    props,
-    isRoot
-  );
+  const { name, theme, themeManager, isNewTheme, className } = useChangeThemeEffect(props, isRoot);
   const disableThemeClass = props.disableThemeClass;
-  const missingTheme = !themes || !name || !theme;
-  const disablePassingTheme = missingTheme || !isNewTheme;
+  const missingTheme = !name || !theme;
   let contents = useMemo(() => {
     const next = props["data-themeable"] ? React.cloneElement(props.children, { ["data-themeable"]: true }) : props.children;
-    return disablePassingTheme ? next : wrapThemeManagerContext(next, themeManager);
-  }, [disablePassingTheme, props.children, themeManager]);
+    return missingTheme ? next : wrapThemeManagerContext(next, themeManager);
+  }, [missingTheme, props.children, themeManager]);
   if (process.env.NODE_ENV === "development" && missingTheme) {
     name && !theme && console.warn(`No theme found by name ${name}`);
     return props.children;
   }
-  if (disableThemeClass || disablePassingTheme) {
+  if (disableThemeClass || missingTheme) {
     return contents;
   }
   if (isWeb) {

package/dist/esm/views/Theme.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/Theme.tsx"],
-  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\nimport React, { useMemo } from 'react'\n\nimport { variableToString } from '../createVariable'\nimport { ThemeManager } from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { useChangeThemeEffect } from '../hooks/useTheme'\nimport { ThemeProps } from '../types'\n\nexport function Theme(props: ThemeProps) {\n  // @ts-expect-error its a permanent prop meant for internal views\n  if (props.disable) {\n    return props.children\n  }\n\n  const isRoot = !!props['_isRoot']\n  const { name, theme, themeManager, themes, isNewTheme, className } = useChangeThemeEffect(\n    props,\n    isRoot\n  )\n\n  const disableThemeClass = props.disableThemeClass\n  const missingTheme = !themes || !name || !theme\n  const disablePassingTheme = missingTheme || !isNewTheme\n\n  // memo here, changing theme without re-rendering all children is a critical optimization\n  // may require some effort of end user to memoize but without this memo they'd have no option\n  let contents = useMemo(() => {\n    const next = props['data-themeable']\n      ? React.cloneElement(props.children, { ['data-themeable']: true })\n      : props.children\n\n    return disablePassingTheme ? next : wrapThemeManagerContext(next, themeManager)\n  }, [disablePassingTheme, props.children, themeManager])\n\n  if (process.env.NODE_ENV === 'development' && missingTheme) {\n    // eslint-disable-next-line no-console\n    name && !theme && console.warn(`No theme found by name ${name}`)\n    return props.children\n  }\n\n  if (disableThemeClass || disablePassingTheme) {\n    return contents\n  }\n\n  if (isWeb) {\n    const cn = [props.className, className, '_dsp_contents'].filter(Boolean).join(' ')\n    contents = (\n      <span\n        className={cn}\n        style={{\n          // in order to provide currentColor, set color by default\n          color: variableToString(theme?.color),\n        }}\n      >\n        {contents}\n      </span>\n    )\n  }\n\n  return contents\n}\n\nexport function wrapThemeManagerContext(\n  children: any,\n  themeManager?: ThemeManager | null,\n  shouldReset?: boolean\n) {\n  // be sure to memoize themeManager to avoid reparenting\n  if (!themeManager) {\n    return children\n  }\n  // be sure to memoize shouldReset to avoid reparenting\n  let next = children\n  // TODO likely not necessary if we do reset logic now in useTheme?\n  // reset to parent theme\n  if (shouldReset && themeManager) {\n    next = <Theme name={themeManager.state.parentName}>{next}</Theme>\n  }\n  return <ThemeManagerContext.Provider value={themeManager}>{next}</ThemeManagerContext.Provider>\n}\n"],
-  "mappings": "AAgDM;AAhDN,SAAS,aAAa;AACtB,OAAO,SAAS,eAAe;AAE/B,SAAS,wBAAwB;AAEjC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AAG9B,SAAS,MAAM,OAAmB;AAEvC,MAAI,MAAM,SAAS;AACjB,WAAO,MAAM;AAAA,EACf;AAEA,QAAM,SAAS,CAAC,CAAC,MAAM;AACvB,QAAM,EAAE,MAAM,OAAO,cAAc,QAAQ,YAAY,UAAU,IAAI;AAAA,IACnE;AAAA,IACA;AAAA,EACF;AAEA,QAAM,oBAAoB,MAAM;AAChC,QAAM,eAAe,CAAC,UAAU,CAAC,QAAQ,CAAC;AAC1C,QAAM,sBAAsB,gBAAgB,CAAC;AAI7C,MAAI,WAAW,QAAQ,MAAM;AAC3B,UAAM,OAAO,MAAM,oBACf,MAAM,aAAa,MAAM,UAAU,EAAE,CAAC,mBAAmB,KAAK,CAAC,IAC/D,MAAM;AAEV,WAAO,sBAAsB,OAAO,wBAAwB,MAAM,YAAY;AAAA,EAChF,GAAG,CAAC,qBAAqB,MAAM,UAAU,YAAY,CAAC;AAEtD,MAAI,QAAQ,IAAI,aAAa,iBAAiB,cAAc;AAE1D,YAAQ,CAAC,SAAS,QAAQ,KAAK,0BAA0B,MAAM;AAC/D,WAAO,MAAM;AAAA,EACf;AAEA,MAAI,qBAAqB,qBAAqB;AAC5C,WAAO;AAAA,EACT;AAEA,MAAI,OAAO;AACT,UAAM,KAAK,CAAC,MAAM,WAAW,WAAW,eAAe,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACjF,eACE,oBAAC;AAAA,MACC,WAAW;AAAA,MACX,OAAO;AAAA,QAEL,OAAO,iBAAiB,+BAAO,KAAK;AAAA,MACtC;AAAA,MAEC;AAAA,KACH;AAAA,EAEJ;AAEA,SAAO;AACT;AAEO,SAAS,wBACd,UACA,cACA,aACA;AAEA,MAAI,CAAC,cAAc;AACjB,WAAO;AAAA,EACT;AAEA,MAAI,OAAO;AAGX,MAAI,eAAe,cAAc;AAC/B,WAAO,oBAAC;AAAA,MAAM,MAAM,aAAa,MAAM;AAAA,MAAa;AAAA,KAAK;AAAA,EAC3D;AACA,SAAO,oBAAC,oBAAoB,UAApB;AAAA,IAA6B,OAAO;AAAA,IAAe;AAAA,GAAK;AAClE;",
+  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\nimport React, { useMemo } from 'react'\n\nimport { variableToString } from '../createVariable'\nimport { ThemeManager } from '../helpers/ThemeManager'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext'\nimport { useChangeThemeEffect } from '../hooks/useTheme'\nimport { ThemeProps } from '../types'\n\nexport function Theme(props: ThemeProps) {\n  // @ts-expect-error its a permanent prop meant for internal views\n  if (props.disable) {\n    return props.children\n  }\n\n  const isRoot = !!props['_isRoot']\n  const { name, theme, themeManager, isNewTheme, className } = useChangeThemeEffect(props, isRoot)\n\n  const disableThemeClass = props.disableThemeClass\n  const missingTheme = !name || !theme\n\n  // memo here, changing theme without re-rendering all children is a critical optimization\n  // may require some effort of end user to memoize but without this memo they'd have no option\n  let contents = useMemo(() => {\n    const next = props['data-themeable']\n      ? React.cloneElement(props.children, { ['data-themeable']: true })\n      : props.children\n\n    return missingTheme ? next : wrapThemeManagerContext(next, themeManager)\n  }, [missingTheme, props.children, themeManager])\n\n  if (process.env.NODE_ENV === 'development' && missingTheme) {\n    // eslint-disable-next-line no-console\n    name && !theme && console.warn(`No theme found by name ${name}`)\n    return props.children\n  }\n\n  if (disableThemeClass || missingTheme) {\n    return contents\n  }\n\n  if (isWeb) {\n    const cn = [props.className, className, '_dsp_contents'].filter(Boolean).join(' ')\n    contents = (\n      <span\n        className={cn}\n        style={{\n          // in order to provide currentColor, set color by default\n          color: variableToString(theme?.color),\n        }}\n      >\n        {contents}\n      </span>\n    )\n  }\n\n  return contents\n}\n\nexport function wrapThemeManagerContext(\n  children: any,\n  themeManager?: ThemeManager | null,\n  shouldReset?: boolean\n) {\n  // be sure to memoize themeManager to avoid reparenting\n  if (!themeManager) {\n    return children\n  }\n  // be sure to memoize shouldReset to avoid reparenting\n  let next = children\n  // TODO likely not necessary if we do reset logic now in useTheme?\n  // reset to parent theme\n  if (shouldReset && themeManager) {\n    next = <Theme name={themeManager.state.parentName}>{next}</Theme>\n  }\n  return <ThemeManagerContext.Provider value={themeManager}>{next}</ThemeManagerContext.Provider>\n}\n"],
+  "mappings": "AA4CM;AA5CN,SAAS,aAAa;AACtB,OAAO,SAAS,eAAe;AAE/B,SAAS,wBAAwB;AAEjC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AAG9B,SAAS,MAAM,OAAmB;AAEvC,MAAI,MAAM,SAAS;AACjB,WAAO,MAAM;AAAA,EACf;AAEA,QAAM,SAAS,CAAC,CAAC,MAAM;AACvB,QAAM,EAAE,MAAM,OAAO,cAAc,YAAY,UAAU,IAAI,qBAAqB,OAAO,MAAM;AAE/F,QAAM,oBAAoB,MAAM;AAChC,QAAM,eAAe,CAAC,QAAQ,CAAC;AAI/B,MAAI,WAAW,QAAQ,MAAM;AAC3B,UAAM,OAAO,MAAM,oBACf,MAAM,aAAa,MAAM,UAAU,EAAE,CAAC,mBAAmB,KAAK,CAAC,IAC/D,MAAM;AAEV,WAAO,eAAe,OAAO,wBAAwB,MAAM,YAAY;AAAA,EACzE,GAAG,CAAC,cAAc,MAAM,UAAU,YAAY,CAAC;AAE/C,MAAI,QAAQ,IAAI,aAAa,iBAAiB,cAAc;AAE1D,YAAQ,CAAC,SAAS,QAAQ,KAAK,0BAA0B,MAAM;AAC/D,WAAO,MAAM;AAAA,EACf;AAEA,MAAI,qBAAqB,cAAc;AACrC,WAAO;AAAA,EACT;AAEA,MAAI,OAAO;AACT,UAAM,KAAK,CAAC,MAAM,WAAW,WAAW,eAAe,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACjF,eACE,oBAAC;AAAA,MACC,WAAW;AAAA,MACX,OAAO;AAAA,QAEL,OAAO,iBAAiB,+BAAO,KAAK;AAAA,MACtC;AAAA,MAEC;AAAA,KACH;AAAA,EAEJ;AAEA,SAAO;AACT;AAEO,SAAS,wBACd,UACA,cACA,aACA;AAEA,MAAI,CAAC,cAAc;AACjB,WAAO;AAAA,EACT;AAEA,MAAI,OAAO;AAGX,MAAI,eAAe,cAAc;AAC/B,WAAO,oBAAC;AAAA,MAAM,MAAM,aAAa,MAAM;AAAA,MAAa;AAAA,KAAK;AAAA,EAC3D;AACA,SAAO,oBAAC,oBAAoB,UAApB;AAAA,IAA6B,OAAO;AAAA,IAAe;AAAA,GAAK;AAClE;",
   "names": []
 }

package/dist/esm/views/ThemeInverse.js

@@ -1,38 +1,32 @@
 import { jsx } from "react/jsx-runtime";
-import { isWeb, useIsomorphicLayoutEffect } from "@tamagui/constants";
 import { useState } from "react";
+import { useIsomorphicLayoutEffect } from "../constants/platform";
 import { useDefaultThemeName, useThemeName } from "../hooks/useTheme";
 import { Theme } from "./Theme";
-const toggleTheme = (themeName) => {
-  return themeName.startsWith("light") ? "dark" : "light";
-};
-const useThemeInverse = (props = {}) => {
-  const themeName = useThemeName();
-  const defaultTheme = useDefaultThemeName();
-  const [name, setName] = useState(null);
-  const curName = themeName || defaultTheme || "";
-  if (isWeb) {
-    useIsomorphicLayoutEffect(() => {
-      setName(toggleTheme(curName));
-    }, [defaultTheme, themeName]);
-    return props.disable ? null : name;
-  }
-  return props.disable ? null : toggleTheme(curName);
-};
 const ThemeInverse = ({
   children,
   disable
 }) => {
-  const inverseTheme = useThemeInverse({
-    disable
-  });
+  const themeName = useThemeName();
+  const defaultTheme = useDefaultThemeName();
+  const [name, setName] = useState(null);
+  useIsomorphicLayoutEffect(() => {
+    if (themeName.startsWith("dark")) {
+      setName("light");
+    }
+    if (themeName.startsWith("light")) {
+      setName("dark");
+    }
+  }, [defaultTheme, themeName]);
+  if (disable) {
+    return children;
+  }
   return /* @__PURE__ */ jsx(Theme, {
-    name: inverseTheme,
+    name,
     children
   });
 };
 export {
-  ThemeInverse,
-  useThemeInverse
+  ThemeInverse
 };
 //# sourceMappingURL=ThemeInverse.js.map

package/dist/esm/views/ThemeInverse.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/ThemeInverse.tsx"],
-  "sourcesContent": ["import { isWeb, useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport React, { useState } from 'react'\n\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport type ThemeInverseProps = {\n  disable?: boolean\n}\n\nconst toggleTheme = (themeName: string) => {\n  return themeName.startsWith('light') ? 'dark' : 'light'\n}\n\nexport const useThemeInverse = (props: ThemeInverseProps = {}) => {\n  const themeName = useThemeName()\n  const defaultTheme = useDefaultThemeName()\n  const [name, setName] = useState<null | string>(null)\n  const curName = themeName || defaultTheme || ''\n\n  if (isWeb) {\n    // for SSR must be in effect\n    useIsomorphicLayoutEffect(() => {\n      setName(toggleTheme(curName))\n    }, [defaultTheme, themeName])\n\n    return props.disable ? null : name\n  }\n\n  return props.disable ? null : toggleTheme(curName)\n}\n\nexport const ThemeInverse = ({\n  children,\n  disable,\n}: ThemeInverseProps & {\n  children: React.ReactNode\n}) => {\n  const inverseTheme = useThemeInverse({\n    disable,\n  })\n  return <Theme name={inverseTheme}>{children}</Theme>\n}\n"],
-  "mappings": "AAyCS;AAzCT,SAAS,OAAO,iCAAiC;AACjD,SAAgB,gBAAgB;AAEhC,SAAS,qBAAqB,oBAAoB;AAClD,SAAS,aAAa;AAMtB,MAAM,cAAc,CAAC,cAAsB;AACzC,SAAO,UAAU,WAAW,OAAO,IAAI,SAAS;AAClD;AAEO,MAAM,kBAAkB,CAAC,QAA2B,CAAC,MAAM;AAChE,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,oBAAoB;AACzC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAwB,IAAI;AACpD,QAAM,UAAU,aAAa,gBAAgB;AAE7C,MAAI,OAAO;AAET,8BAA0B,MAAM;AAC9B,cAAQ,YAAY,OAAO,CAAC;AAAA,IAC9B,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,WAAO,MAAM,UAAU,OAAO;AAAA,EAChC;AAEA,SAAO,MAAM,UAAU,OAAO,YAAY,OAAO;AACnD;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AACF,MAEM;AACJ,QAAM,eAAe,gBAAgB;AAAA,IACnC;AAAA,EACF,CAAC;AACD,SAAO,oBAAC;AAAA,IAAM,MAAM;AAAA,IAAe;AAAA,GAAS;AAC9C;",
+  "sourcesContent": ["import React, { useState } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport const ThemeInverse = ({\n  children,\n  disable,\n}: {\n  children: React.ReactNode\n  disable?: boolean\n}) => {\n  const themeName = useThemeName()\n  const defaultTheme = useDefaultThemeName()\n  const [name, setName] = useState<null | string>(null)\n\n  // ssr\n  useIsomorphicLayoutEffect(() => {\n    if (themeName.startsWith('dark')) {\n      setName('light')\n    }\n    if (themeName.startsWith('light')) {\n      setName('dark')\n    }\n  }, [defaultTheme, themeName])\n\n  if (disable) {\n    return children as JSX.Element\n  }\n\n  return <Theme name={name}>{children}</Theme>\n}\n"],
+  "mappings": "AA+BS;AA/BT,SAAgB,gBAAgB;AAEhC,SAAS,iCAAiC;AAC1C,SAAS,qBAAqB,oBAAoB;AAClD,SAAS,aAAa;AAEf,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AACF,MAGM;AACJ,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,oBAAoB;AACzC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAwB,IAAI;AAGpD,4BAA0B,MAAM;AAC9B,QAAI,UAAU,WAAW,MAAM,GAAG;AAChC,cAAQ,OAAO;AAAA,IACjB;AACA,QAAI,UAAU,WAAW,OAAO,GAAG;AACjC,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,MAAI,SAAS;AACX,WAAO;AAAA,EACT;AAEA,SAAO,oBAAC;AAAA,IAAM;AAAA,IAAa;AAAA,GAAS;AACtC;",
   "names": []
 }

package/dist/esm/views/ThemeReset.js

@@ -1,29 +1,29 @@
 import { jsx } from "react/jsx-runtime";
-import { isClient } from "@tamagui/constants";
 import React, { useContext, useLayoutEffect, useState } from "react";
+import { isWeb } from "../constants/platform";
 import { ThemeManagerContext } from "../helpers/ThemeManager";
 import { Theme } from "./Theme";
 React["createElement"];
 const ThemeReset = (props) => {
-  const manager = useContext(ThemeManagerContext);
+  const themeManager = useContext(ThemeManagerContext);
   const [name, setName] = useState(null);
-  if (isClient) {
+  if (!isWeb || typeof document !== "undefined") {
     useLayoutEffect(() => {
-      if (!manager)
+      if (!themeManager)
         return;
-      if (name !== manager.parentName) {
-        setName(manager.parentName);
+      if (name !== themeManager.parentName) {
+        setName(themeManager.parentName);
       }
-    }, [name, manager, manager == null ? void 0 : manager.parentName]);
+    }, [themeManager == null ? void 0 : themeManager.parentName]);
     useLayoutEffect(() => {
-      if (!manager)
+      if (!themeManager)
         return;
-      return manager.onChangeTheme(() => {
-        setName(manager.parentName);
+      return themeManager.onChangeTheme(() => {
+        setName(themeManager.parentName);
       });
-    }, [manager]);
+    }, []);
   }
-  if (!manager || !props.children) {
+  if (!themeManager || !props.children) {
     return props.children || null;
   }
   return /* @__PURE__ */ jsx(Theme, {

package/dist/esm/views/ThemeReset.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/ThemeReset.tsx"],
-  "sourcesContent": ["import { isClient } from '@tamagui/constants'\nimport React, { useContext, useLayoutEffect, useState } from 'react'\n\nimport { ThemeManagerContext } from '../helpers/ThemeManager'\nimport { Theme } from './Theme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\n// resets the theme to the parent theme\nexport const ThemeReset = (props: { children?: any }) => {\n  const manager = useContext(ThemeManagerContext)\n  const [name, setName] = useState<string | null>(null)\n\n  // this component doesn't work with SSR, so must run only client side\n  // we could at least prevent more flickering by having the ssr head script\n  // that changes to dark initially also go through and change all of these\n  if (isClient) {\n    useLayoutEffect(() => {\n      if (!manager) return\n      if (name !== manager.parentName) {\n        setName(manager.parentName)\n      }\n    }, [name, manager, manager?.parentName])\n\n    useLayoutEffect(() => {\n      if (!manager) return\n      return manager.onChangeTheme(() => {\n        setName(manager.parentName)\n      })\n    }, [manager])\n  }\n\n  if (!manager || !props.children) {\n    return props.children || null\n  }\n\n  return (\n    <Theme className=\"tui-theme-reset\" reset name={name}>\n      {props.children}\n    </Theme>\n  )\n}\n"],
-  "mappings": "AAsCI;AAtCJ,SAAS,gBAAgB;AACzB,OAAO,SAAS,YAAY,iBAAiB,gBAAgB;AAE7D,SAAS,2BAA2B;AACpC,SAAS,aAAa;AAGtB,MAAM;AAGC,MAAM,aAAa,CAAC,UAA8B;AACvD,QAAM,UAAU,WAAW,mBAAmB;AAC9C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAwB,IAAI;AAKpD,MAAI,UAAU;AACZ,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAS;AACd,UAAI,SAAS,QAAQ,YAAY;AAC/B,gBAAQ,QAAQ,UAAU;AAAA,MAC5B;AAAA,IACF,GAAG,CAAC,MAAM,SAAS,mCAAS,UAAU,CAAC;AAEvC,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAS;AACd,aAAO,QAAQ,cAAc,MAAM;AACjC,gBAAQ,QAAQ,UAAU;AAAA,MAC5B,CAAC;AAAA,IACH,GAAG,CAAC,OAAO,CAAC;AAAA,EACd;AAEA,MAAI,CAAC,WAAW,CAAC,MAAM,UAAU;AAC/B,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,SACE,oBAAC;AAAA,IAAM,WAAU;AAAA,IAAkB,OAAK;AAAA,IAAC;AAAA,IACtC,gBAAM;AAAA,GACT;AAEJ;",
+  "sourcesContent": ["import React, { useContext, useLayoutEffect, useState } from 'react'\n\nimport { isWeb } from '../constants/platform'\nimport { ThemeManagerContext } from '../helpers/ThemeManager'\nimport { Theme } from './Theme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\n// resets the theme to the parent theme\nexport const ThemeReset = (props: { children?: any }) => {\n  const themeManager = useContext(ThemeManagerContext)\n  const [name, setName] = useState<string | null>(null)\n\n  // this component doesn't work with SSR, so must run only client side\n  // we could at least prevent more flickering by having the ssr head script\n  // that changes to dark initially also go through and change all of these\n  if (!isWeb || typeof document !== 'undefined') {\n    useLayoutEffect(() => {\n      if (!themeManager) return\n      if (name !== themeManager.parentName) {\n        setName(themeManager.parentName)\n      }\n    }, [themeManager?.parentName])\n\n    useLayoutEffect(() => {\n      if (!themeManager) return\n      return themeManager.onChangeTheme(() => {\n        setName(themeManager.parentName)\n      })\n    }, [])\n  }\n\n  if (!themeManager || !props.children) {\n    return props.children || null\n  }\n\n  return (\n    <Theme className=\"tui-theme-reset\" reset name={name}>\n      {props.children}\n    </Theme>\n  )\n}\n"],
+  "mappings": "AAsCI;AAtCJ,OAAO,SAAS,YAAY,iBAAiB,gBAAgB;AAE7D,SAAS,aAAa;AACtB,SAAS,2BAA2B;AACpC,SAAS,aAAa;AAGtB,MAAM;AAGC,MAAM,aAAa,CAAC,UAA8B;AACvD,QAAM,eAAe,WAAW,mBAAmB;AACnD,QAAM,CAAC,MAAM,OAAO,IAAI,SAAwB,IAAI;AAKpD,MAAI,CAAC,SAAS,OAAO,aAAa,aAAa;AAC7C,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,UAAI,SAAS,aAAa,YAAY;AACpC,gBAAQ,aAAa,UAAU;AAAA,MACjC;AAAA,IACF,GAAG,CAAC,6CAAc,UAAU,CAAC;AAE7B,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,aAAO,aAAa,cAAc,MAAM;AACtC,gBAAQ,aAAa,UAAU;AAAA,MACjC,CAAC;AAAA,IACH,GAAG,CAAC,CAAC;AAAA,EACP;AAEA,MAAI,CAAC,gBAAgB,CAAC,MAAM,UAAU;AACpC,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,SACE,oBAAC;AAAA,IAAM,WAAU;AAAA,IAAkB,OAAK;AAAA,IAAC;AAAA,IACtC,gBAAM;AAAA,GACT;AAEJ;",
   "names": []
 }