tamagui 1.85.5 → 1.85.7

package/dist/native.js

@@ -1329,7 +1329,7 @@ var require_insertStyleRule_native = __commonJS({
       }
       return scannedCache.set(sheet2, cacheKey), dedupedThemes;
     }
-    var colorVarToVal, rootComputedStyle = null;
+    var colorVarToVal, rootComputedStyle = null, schemes = { dark: !0, light: !0 };
     function addThemesFromCSS(cssStyleRule, tokens) {
       let selectors = cssStyleRule.selectorText.split(",");
       if (!selectors.length)
@@ -1361,17 +1361,20 @@ var require_insertStyleRule_native = __commonJS({
           !0
         );
       }
-      let dedupedEntry = {
-        names: [],
+      return {
+        names: [
+          ...new Set(
+            selectors.map((selector) => {
+              let parts = selector.replace(/(.t_|:root)/g, "").trim().split(" "), secondToLast = parts[parts.length - 2] || "", scheme = secondToLast.includes("dark") ? "dark" : secondToLast.includes("light") ? "light" : "", name = (() => {
+                let _ = parts[parts.length - 1];
+                return scheme && _.startsWith(scheme) && (_ = _.slice(scheme.length + 1)), _;
+              })();
+              return scheme === name || schemes[name] ? scheme : `${scheme}${scheme && name ? "_" : ""}${name}`;
+            })
+          )
+        ],
         theme: values
       };
-      for (let selector of selectors) {
-        let di = selector.indexOf("t_dark"), li = selector.indexOf("t_light"), scheme = di && li ? di < li ? "dark" : "light" : "", name = selector.slice(selector.lastIndexOf(".t_") + 3);
-        name.startsWith(scheme) && (name = name.slice(scheme.length + 1)), scheme === name && (scheme = "");
-        let themeName = `${scheme}${scheme && name ? "_" : ""}${name}`;
-        dedupedEntry.names.includes(themeName) || dedupedEntry.names.push(themeName);
-      }
-      return dedupedEntry;
     }
     function getTamaguiSelector(rule, collectThemes = !1) {
       if (rule instanceof CSSStyleRule) {
@@ -1703,65 +1706,11 @@ var require_useMedia_native = __commonJS({
   }
 });
 
-// ../web/dist/cjs/Tamagui.native.js
-var require_Tamagui_native = __commonJS({
-  "../web/dist/cjs/Tamagui.native.js"(exports2, module2) {
-    "use strict";
-    var __create2 = Object.create, __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __getProtoOf2 = Object.getPrototypeOf, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: !0 }) : target,
-      mod
-    )), __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), Tamagui_exports = {};
-    __export2(Tamagui_exports, {
-      Tamagui: () => Tamagui,
-      getValueFromIdentifier: () => getValueFromIdentifier,
-      setIdentifierValue: () => setIdentifierValue
-    });
-    module2.exports = __toCommonJS2(Tamagui_exports);
-    var Helpers = __toESM2(require_index_native7()), import_config = require_config_native(), import_insertStyleRule = require_insertStyleRule_native(), import_useMedia = require_useMedia_native(), TamaguiManager = class {
-      constructor() {
-        this.Helpers = Helpers;
-      }
-      get mediaState() {
-        return { ...import_useMedia.mediaState };
-      }
-      get config() {
-        return (0, import_config.getConfig)();
-      }
-      get insertedRules() {
-        return (0, import_insertStyleRule.getAllRules)();
-      }
-      get allSelectors() {
-        return (0, import_insertStyleRule.getAllSelectors)();
-      }
-      get allTransforms() {
-        return (0, import_insertStyleRule.getAllTransforms)();
-      }
-      get identifierToValue() {
-        return identifierToValue;
-      }
-    }, Tamagui = new TamaguiManager(), identifierToValue = /* @__PURE__ */ new Map(), getValueFromIdentifier = (identifier) => identifierToValue.get(identifier), setIdentifierValue = (identifier, value) => {
-      identifierToValue.set(identifier, value);
-    };
-  }
-});
-
-// ../compose-refs/dist/cjs/compose-refs.native.js
-var require_compose_refs_native = __commonJS({
-  "../compose-refs/dist/cjs/compose-refs.native.js"(exports2, module2) {
+// ../web/dist/cjs/helpers/createShallowSetState.native.js
+var require_createShallowSetState_native = __commonJS({
+  "../web/dist/cjs/helpers/createShallowSetState.native.js"(exports2, module2) {
     "use strict";
-    var __create2 = Object.create, __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __getProtoOf2 = Object.getPrototypeOf, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
       for (var name in all)
         __defProp2(target, name, { get: all[name], enumerable: !0 });
     }, __copyProps2 = (to, from, except, desc) => {
@@ -1769,47 +1718,28 @@ var require_compose_refs_native = __commonJS({
         for (let key of __getOwnPropNames2(from))
           !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
       return to;
-    }, __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: !0 }) : target,
-      mod
-    )), __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), compose_refs_exports = {};
-    __export2(compose_refs_exports, {
-      composeRefs: () => composeRefs,
-      useComposedRefs: () => useComposedRefs
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createShallowSetState_exports = {};
+    __export2(createShallowSetState_exports, {
+      createShallowSetState: () => createShallowSetState,
+      isEqualShallow: () => isEqualShallow,
+      mergeIfNotShallowEqual: () => mergeIfNotShallowEqual
     });
-    module2.exports = __toCommonJS2(compose_refs_exports);
-    var React2 = __toESM2(require("react"));
-    function setRef(ref, value) {
-      typeof ref == "function" ? ref(value) : ref && (ref.current = value);
+    module2.exports = __toCommonJS2(createShallowSetState_exports);
+    function createShallowSetState(setter, debug) {
+      return (next) => setter((prev) => mergeIfNotShallowEqual(prev, next, debug));
     }
-    function composeRefs(...refs) {
-      return (node) => refs.forEach((ref) => setRef(ref, node));
+    function mergeIfNotShallowEqual(prev, next, debug) {
+      return isEqualShallow(prev, next) ? prev : (process.env.NODE_ENV === "development" && debug && console.warn("setStateShallow CHANGE", { prev, next }), { ...prev, ...next });
     }
-    function useComposedRefs(...refs) {
-      return React2.useCallback(composeRefs(...refs), refs);
+    function isEqualShallow(prev, next) {
+      for (let key in next)
+        if (prev[key] !== next[key])
+          return !1;
+      return !0;
     }
   }
 });
 
-// ../compose-refs/dist/cjs/index.native.js
-var require_index_native10 = __commonJS({
-  "../compose-refs/dist/cjs/index.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __reExport2 = (target, mod, secondTarget) => (__copyProps2(target, mod, "default"), secondTarget && __copyProps2(secondTarget, mod, "default")), __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), src_exports2 = {};
-    module2.exports = __toCommonJS2(src_exports2);
-    __reExport2(src_exports2, require_compose_refs_native(), module2.exports);
-  }
-});
-
 // ../web/dist/cjs/constants/constants.native.js
 var require_constants_native2 = __commonJS({
   "../web/dist/cjs/constants/constants.native.js"(exports2, module2) {
@@ -1844,9 +1774,9 @@ var require_constants_native2 = __commonJS({
   }
 });
 
-// ../web/dist/cjs/helpers/objectIdentityKey.native.js
-var require_objectIdentityKey_native = __commonJS({
-  "../web/dist/cjs/helpers/objectIdentityKey.native.js"(exports2, module2) {
+// ../web/dist/cjs/helpers/ThemeManager.native.js
+var require_ThemeManager_native = __commonJS({
+  "../web/dist/cjs/helpers/ThemeManager.native.js"(exports2, module2) {
     "use strict";
     var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
       for (var name in all)
@@ -1856,177 +1786,149 @@ var require_objectIdentityKey_native = __commonJS({
         for (let key of __getOwnPropNames2(from))
           !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
       return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), objectIdentityKey_exports = {};
-    __export2(objectIdentityKey_exports, {
-      objectIdentityKey: () => objectIdentityKey
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), ThemeManager_exports = {};
+    __export2(ThemeManager_exports, {
+      ThemeManager: () => ThemeManager,
+      getHasThemeUpdatingProps: () => getHasThemeUpdatingProps,
+      getManagers: () => getManagers
     });
-    module2.exports = __toCommonJS2(objectIdentityKey_exports);
-    function objectIdentityKey(obj) {
-      let k = "";
-      for (let key in obj) {
-        k += key;
-        let arg = obj[key], type = typeof arg;
-        if (!arg || type !== "object" && type !== "function")
-          k += type + arg;
-        else if (cache.has(arg))
-          k += cache.get(arg);
-        else {
-          let v = Math.random();
-          cache.set(arg, v), k += v;
-        }
-      }
-      return k;
+    module2.exports = __toCommonJS2(ThemeManager_exports);
+    var import_constants4 = require_index_native(), import_config = require_config_native(), import_constants22 = require_constants_native2(), emptyState = { name: "" };
+    function getHasThemeUpdatingProps(props) {
+      return !!(props.name || props.componentName || props.inverse || props.reset);
     }
-    var cache = /* @__PURE__ */ new WeakMap();
-  }
-});
-
-// ../web/dist/cjs/helpers/createStyledContext.native.js
-var require_createStyledContext_native = __commonJS({
-  "../web/dist/cjs/helpers/createStyledContext.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createStyledContext_exports = {};
-    __export2(createStyledContext_exports, {
-      createStyledContext: () => createStyledContext2
-    });
-    module2.exports = __toCommonJS2(createStyledContext_exports);
-    var import_react2 = require("react"), import_objectIdentityKey = require_objectIdentityKey_native(), import_jsx_runtime6 = require("react/jsx-runtime");
-    function createStyledContext2(defaultValues) {
-      let OGContext = (0, import_react2.createContext)(defaultValues), OGProvider2 = OGContext.Provider, Context = OGContext, scopedContexts = /* @__PURE__ */ new Map(), Provider = ({
-        children,
-        scope,
-        ...values
-      }) => {
-        let next = (0, import_react2.useMemo)(() => ({
-          // this ! is a workaround for ts error
-          ...defaultValues,
-          ...values
-        }), [(0, import_objectIdentityKey.objectIdentityKey)(values)]), Provider2 = OGProvider2;
-        if (scope) {
-          let ScopedContext = scopedContexts.get(scope);
-          ScopedContext || (ScopedContext = (0, import_react2.createContext)(defaultValues), scopedContexts.set(scope, ScopedContext)), Provider2 = ScopedContext.Provider;
+    var uid = 0, ThemeManager = class {
+      constructor(props = {}, parentManager) {
+        if (this.props = props, this.id = 0, this.themeListeners = /* @__PURE__ */ new Set(), this.parentManager = null, this.state = emptyState, this._allKeys = null, uid = (uid + 1) % Number.MAX_VALUE, this.id = uid, parentManager === "root") {
+          this.updateStateFromProps(props, !1);
+          return;
         }
-        return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Provider2, { value: next, children });
-      }, useStyledContext = (scope) => {
-        let context = scope ? scopedContexts.get(scope) : OGContext;
-        return (0, import_react2.useContext)(context);
-      };
-      return Context.Provider = Provider, Context.props = defaultValues, Context.context = OGContext, Context.useStyledContext = useStyledContext, Context;
-    }
-  }
-});
-
-// ../web/dist/cjs/contexts/ComponentContext.native.js
-var require_ComponentContext_native = __commonJS({
-  "../web/dist/cjs/contexts/ComponentContext.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), ComponentContext_exports = {};
-    __export2(ComponentContext_exports, {
-      ComponentContext: () => ComponentContext2
-    });
-    module2.exports = __toCommonJS2(ComponentContext_exports);
-    var import_createStyledContext = require_createStyledContext_native(), ComponentContext2 = (0, import_createStyledContext.createStyledContext)({
-      disableSSR: void 0,
-      inText: !1,
-      language: null,
-      animationDriver: null,
-      groups: {
-        emit: null,
-        subscribe: null,
-        state: {}
+        if (!parentManager)
+          throw process.env.NODE_ENV !== "production" ? new Error(
+            "No parent manager given, this is likely due to duplicated Tamagui dependencies. Check your lockfile for mis-matched versions. It could also be from an error somewhere else in your stack causing Tamagui to recieve undefined context, you can try putting some ErrorBoundary components around other areas of your app, or a Suspense boundary."
+          ) : "\u274C 000";
+        if (this.parentManager = parentManager, !this.updateStateFromProps(props, !1))
+          return parentManager;
       }
-    });
-  }
-});
-
-// ../web/dist/cjs/defaultComponentState.native.js
-var require_defaultComponentState_native = __commonJS({
-  "../web/dist/cjs/defaultComponentState.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), defaultComponentState_exports = {};
-    __export2(defaultComponentState_exports, {
-      defaultComponentState: () => defaultComponentState,
-      defaultComponentStateMounted: () => defaultComponentStateMounted,
-      defaultComponentStateShouldEnter: () => defaultComponentStateShouldEnter
-    });
-    module2.exports = __toCommonJS2(defaultComponentState_exports);
-    var defaultComponentState = {
-      hover: !1,
-      press: !1,
-      pressIn: !1,
-      focus: !1,
-      unmounted: !0
-    }, defaultComponentStateMounted = {
-      ...defaultComponentState,
-      unmounted: !1
-    }, defaultComponentStateShouldEnter = {
-      ...defaultComponentState,
-      unmounted: "should-enter"
-    };
-  }
-});
-
-// ../web/dist/cjs/helpers/createShallowSetState.native.js
-var require_createShallowSetState_native = __commonJS({
-  "../web/dist/cjs/helpers/createShallowSetState.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createShallowSetState_exports = {};
-    __export2(createShallowSetState_exports, {
-      createShallowSetState: () => createShallowSetState,
-      isEqualShallow: () => isEqualShallow,
-      mergeIfNotShallowEqual: () => mergeIfNotShallowEqual
-    });
-    module2.exports = __toCommonJS2(createShallowSetState_exports);
-    function createShallowSetState(setter, debug) {
-      return (next) => setter((prev) => mergeIfNotShallowEqual(prev, next, debug));
-    }
-    function mergeIfNotShallowEqual(prev, next, debug) {
-      return isEqualShallow(prev, next) ? prev : (process.env.NODE_ENV === "development" && debug && console.warn("setStateShallow CHANGE", { prev, next }), { ...prev, ...next });
+      updateStateFromProps(props = this.props || {}, shouldNotify = !0) {
+        if (this.props = props, props.forceTheme)
+          return this.state.theme = props.forceTheme, this.state.name = props.name || "", this.updateState(this.state, !0), this.state;
+        let nextState = this.getStateIfChanged(props);
+        if (nextState)
+          return this.updateState(nextState, shouldNotify), nextState;
+      }
+      updateState(nextState, shouldNotify = !0) {
+        this.state = nextState, this._allKeys = null, process.env.NODE_ENV !== "production" && (this._numChangeEventsSent ??= 0, this._numChangeEventsSent++), shouldNotify && this.notify();
+      }
+      getStateIfChanged(props = this.props, state = this.state, parentManager = this.parentManager) {
+        let _ = this.getState(props, parentManager);
+        if (state && state !== emptyState && !_)
+          return parentManager == null ? void 0 : parentManager.state;
+        if (this.getStateShouldChange(_, state))
+          return _;
+      }
+      getStateShouldChange(nextState, state = this.state) {
+        return !(!(nextState != null && nextState.theme) || nextState.theme === (state == null ? void 0 : state.theme));
+      }
+      getState(props = this.props, parentManager = this.parentManager) {
+        return getState(props, parentManager) || (parentManager == null ? void 0 : parentManager.state) || null;
+      }
+      get allKeys() {
+        var _a;
+        return this._allKeys ||= /* @__PURE__ */ new Set([
+          ...((_a = this.parentManager) == null ? void 0 : _a.allKeys) || [],
+          ...Object.keys(this.state.theme || {})
+        ]), this._allKeys;
+      }
+      notify(forced = !1) {
+        this.themeListeners.forEach((cb) => cb(this.state.name, this, forced));
+      }
+      onChangeTheme(cb, debugId) {
+        return process.env.NODE_ENV !== "production" && debugId && (this._listeningIds ??= /* @__PURE__ */ new Set(), this._listeningIds.add(debugId)), this.themeListeners.add(cb), () => {
+          this.themeListeners.delete(cb);
+        };
+      }
+    };
+    function getState(props, manager) {
+      var _a;
+      if (props.name && props.reset)
+        throw new Error(
+          process.env.NODE_ENV === "production" ? "\u274C004" : "Cannot reset and set a new name at the same time."
+        );
+      if (!getHasThemeUpdatingProps(props))
+        return null;
+      let themes = (0, import_config.getThemes)(), [allManagers, componentManagers] = getManagers(manager), isDirectParentAComponentTheme = !!(manager != null && manager.state.isComponent), startIndex = props.reset && !isDirectParentAComponentTheme ? 1 : 0, baseManager = allManagers[startIndex], parentManager = allManagers[startIndex + 1];
+      if (!baseManager && props.reset)
+        return process.env.NODE_ENV !== "production" && console.warn("Cannot reset, no parent theme exists"), null;
+      let { componentName } = props, result = null, baseName = (baseManager == null ? void 0 : baseManager.state.name) || "";
+      baseManager != null && baseManager.state.isComponent && (baseName = baseName.replace(/_[A-Z][A-Za-z]+/, ""));
+      let nextName = props.reset ? baseName : props.name || "", allComponentThemes = componentManagers.map((x) => (x == null ? void 0 : x.state.name) || "");
+      isDirectParentAComponentTheme && allComponentThemes.shift();
+      let base = baseName.split(import_constants22.THEME_NAME_SEPARATOR), max2 = base.length, min2 = props.componentName && !nextName ? max2 : 0;
+      for (let i = max2; i >= min2; i--) {
+        let prefix = base.slice(0, i).join(import_constants22.THEME_NAME_SEPARATOR);
+        props.inverse && (prefix = inverseThemeName(prefix));
+        let potentials = [];
+        if (prefix && prefix !== baseName && potentials.push(prefix), nextName && potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName), i === 1) {
+          let lastSegment = potentials.findIndex((x) => !x.includes("_"));
+          lastSegment > 0 && potentials.splice(lastSegment, 0, nextName);
+        }
+        if (componentName && !props.reset) {
+          let baseLen = base.length, componentPotentials = [];
+          if (nextName && baseLen > 1) {
+            let beforeSeparator = base[0];
+            componentPotentials.push(`${beforeSeparator}_${nextName}_${componentName}`);
+          }
+          if (componentPotentials.push(`${prefix}_${componentName}`), nextName) {
+            if (i > baseLen) {
+              let prefixLessOne = base.slice(0, i - 1).join(import_constants22.THEME_NAME_SEPARATOR);
+              if (prefixLessOne) {
+                let lessSpecific = `${prefixLessOne}_${nextName}_${componentName}`;
+                componentPotentials.unshift(lessSpecific);
+              }
+            }
+            let moreSpecific = `${prefix}_${nextName}_${componentName}`;
+            componentPotentials.unshift(moreSpecific);
+          }
+          potentials = [...componentPotentials, ...potentials, ...allComponentThemes];
+        }
+        let found = potentials.find((t) => t in themes);
+        if (process.env.NODE_ENV !== "production" && typeof props.debug == "string" && console.info(" getState ", {
+          props,
+          found,
+          potentials,
+          baseManager,
+          nextName,
+          baseName,
+          prefix
+        }), found) {
+          let names = found.split("_"), [firstName, ...restNames] = names, lastName = names[names.length - 1], isComponent = lastName[0] === lastName[0].toUpperCase(), scheme = firstName === "light" ? "light" : firstName === "dark" ? "dark" : void 0, pre = import_constants22.THEME_CLASSNAME_PREFIX, className = import_constants4.isWeb ? `${pre}sub_theme ${pre}${!scheme || !restNames.length ? firstName : restNames.join("_")}` : "", parentState = (_a = baseManager || parentManager) == null ? void 0 : _a.state, parentName = parentState == null ? void 0 : parentState.name;
+          result = {
+            name: found,
+            parentName,
+            theme: themes[found],
+            className,
+            isComponent,
+            scheme
+          };
+          break;
+        }
+      }
+      return process.env.NODE_ENV !== "production" && props.debug === "verbose" && typeof window < "u" && (console.groupCollapsed("ThemeManager.getState()"), console.info({ props, baseName, base, min: min2, max: max2 }), console.warn("result", { result }), console.trace(), console.groupEnd()), result;
     }
-    function isEqualShallow(prev, next) {
-      for (let key in next)
-        if (prev[key] !== next[key])
-          return !1;
-      return !0;
+    var inverseThemeName = (themeName) => themeName.startsWith("light") ? themeName.replace(/^light/, "dark") : themeName.replace(/^dark/, "light");
+    function getManagers(themeManager) {
+      let comp = [], all = [], cur = themeManager;
+      for (; cur; )
+        all.push(cur), cur.state.isComponent && comp.push(cur), cur = cur.parentManager;
+      return [all, comp];
     }
   }
 });
 
-// ../web/dist/cjs/constants/accessibilityDirectMap.native.js
-var require_accessibilityDirectMap_native = __commonJS({
-  "../web/dist/cjs/constants/accessibilityDirectMap.native.js"(exports2, module2) {
+// ../web/dist/cjs/helpers/ThemeManagerContext.native.js
+var require_ThemeManagerContext_native = __commonJS({
+  "../web/dist/cjs/helpers/ThemeManagerContext.native.js"(exports2, module2) {
     "use strict";
     var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
       for (var name in all)
@@ -2036,72 +1938,18 @@ var require_accessibilityDirectMap_native = __commonJS({
         for (let key of __getOwnPropNames2(from))
           !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
       return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), accessibilityDirectMap_native_exports = {};
-    __export2(accessibilityDirectMap_native_exports, {
-      accessibilityDirectMap: () => accessibilityDirectMap,
-      accessibilityWebRoleToNativeRole: () => accessibilityWebRoleToNativeRole,
-      nativeAccessibilityState: () => nativeAccessibilityState,
-      nativeAccessibilityValue: () => nativeAccessibilityValue,
-      webToNativeAccessibilityDirectMap: () => webToNativeAccessibilityDirectMap
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), ThemeManagerContext_exports = {};
+    __export2(ThemeManagerContext_exports, {
+      ThemeManagerIDContext: () => ThemeManagerIDContext
     });
-    module2.exports = __toCommonJS2(accessibilityDirectMap_native_exports);
-    var accessibilityDirectMap = {}, webToNativeAccessibilityDirectMap = {
-      "aria-label": "accessibilityLabel",
-      "aria-labelledby": "accessibilityLabelledBy",
-      "aria-live": "accessibilityLiveRegion",
-      "aria-modal": "accessibilityViewIsModal",
-      "aria-hidden": "accessibilityElementsHidden"
-    }, nativeAccessibilityValue = {
-      "aria-valuemin": "min",
-      "aria-valuemax": "max",
-      "aria-valuenow": "now",
-      "aria-valuetext": "text"
-    }, nativeAccessibilityState = {
-      "aria-disabled": "disabled",
-      "aria-selected": "selected",
-      "aria-checked": "checked",
-      "aria-busy": "busy",
-      "aria-expanded": "expanded"
-    }, accessibilityWebRoleToNativeRole = {
-      alert: "alert",
-      button: "button",
-      checkbox: "checkbox",
-      combobox: "combobox",
-      grid: "grid",
-      group: "none",
-      heading: "header",
-      imagebutton: "imagebutton",
-      img: "image",
-      keyboardkey: "keyboardkey",
-      link: "link",
-      menu: "menu",
-      menubar: "menubar",
-      menuitem: "menuitem",
-      none: "none",
-      presentation: "none",
-      progressbar: "progressbar",
-      radio: "radio",
-      radiogroup: "radiogroup",
-      region: "summary",
-      scrollbar: "scrollbar",
-      searchbox: "search",
-      slider: "adjustable",
-      spinbutton: "spinbutton",
-      summary: "summary",
-      switch: "switch",
-      tab: "tab",
-      tablist: "tablist",
-      text: "text",
-      timer: "timer",
-      togglebutton: "togglebutton",
-      toolbar: "toolbar"
-    };
+    module2.exports = __toCommonJS2(ThemeManagerContext_exports);
+    var import_react2 = require("react"), ThemeManagerIDContext = (0, import_react2.createContext)(1);
   }
 });
 
-// ../web/dist/cjs/constants/isDevTools.native.js
-var require_isDevTools_native = __commonJS({
-  "../web/dist/cjs/constants/isDevTools.native.js"(exports2, module2) {
+// ../web/dist/cjs/hooks/useTheme.native.js
+var require_useTheme_native = __commonJS({
+  "../web/dist/cjs/hooks/useTheme.native.js"(exports2, module2) {
     "use strict";
     var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
       for (var name in all)
@@ -2111,27 +1959,260 @@ var require_isDevTools_native = __commonJS({
         for (let key of __getOwnPropNames2(from))
           !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
       return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), isDevTools_exports = {};
-    __export2(isDevTools_exports, {
-      isDevTools: () => isDevTools
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), useTheme_exports = {};
+    __export2(useTheme_exports, {
+      activeThemeManagers: () => activeThemeManagers,
+      getThemeManager: () => getThemeManager,
+      getThemeProxied: () => getThemeProxied,
+      useChangeThemeEffect: () => useChangeThemeEffect,
+      useTheme: () => useTheme4,
+      useThemeWithState: () => useThemeWithState
     });
-    module2.exports = __toCommonJS2(isDevTools_exports);
-    var isDevTools = (() => {
-      if (process.env.NODE_ENV === "development")
-        try {
-          return new Function("try {return this===window;}catch(e){ return false;}")();
-        } catch {
+    module2.exports = __toCommonJS2(useTheme_exports);
+    var import_constants4 = require_index_native(), import_react2 = require("react"), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_createShallowSetState = require_createShallowSetState_native(), import_ThemeManager = require_ThemeManager_native(), import_ThemeManagerContext = require_ThemeManagerContext_native(), emptyProps = { name: null }, cached;
+    function getDefaultThemeProxied() {
+      if (cached)
+        return cached;
+      let config = (0, import_config.getConfig)(), name = config.themes.light ? "light" : Object.keys(config.themes)[0], defaultTheme = config.themes[name];
+      return cached = getThemeProxied({ theme: defaultTheme, name }), cached;
+    }
+    var useTheme4 = (props = emptyProps) => {
+      let [_, theme] = useThemeWithState(props);
+      return theme || getDefaultThemeProxied();
+    }, useThemeWithState = (props) => {
+      let keys = (0, import_react2.useRef)([]), changedThemeState = useChangeThemeEffect(
+        props,
+        !1,
+        keys.current,
+        import_constants4.isServer ? void 0 : () => {
+          var _a, _b;
+          let next = ((_a = props.shouldUpdate) == null ? void 0 : _a.call(props)) ?? (keys.current.length > 0 ? !0 : void 0);
+          return process.env.NODE_ENV === "development" && typeof props.debug == "string" && props.debug !== "profile" && console.info("  \u{1F3A8} useTheme() shouldUpdate?", next, {
+            shouldUpdateProp: (_b = props.shouldUpdate) == null ? void 0 : _b.call(props),
+            keys: [...keys.current]
+          }), next;
         }
+      ), { themeManager, state } = changedThemeState;
+      process.env.NODE_ENV === "development" && (state != null && state.theme || process.env.TAMAGUI_DISABLE_NO_THEME_WARNING !== "1" && console.warn(
+        `[tamagui] No theme found, this could be due to an invalid theme name (given theme props ${JSON.stringify(
+          props
+        )}).
+
+If this is intended and you are using Tamagui without any themes, you can disable this warning by setting the environment variable TAMAGUI_DISABLE_NO_THEME_WARNING=1`
+      ));
+      let themeProxied = (0, import_react2.useMemo)(() => !themeManager || !(state != null && state.theme) ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state == null ? void 0 : state.theme, themeManager, props.deopt, props.debug]);
+      return process.env.NODE_ENV === "development" && props.debug === "verbose" && (console.groupCollapsed("  \u{1F539} useTheme =>", state == null ? void 0 : state.name), console.info("returning state", changedThemeState, "from props", props), console.groupEnd()), [changedThemeState, themeProxied];
+    };
+    function getThemeProxied({ theme, name, scheme }, deopt = !1, themeManager, keys, debug) {
+      if (!theme)
+        return {};
+      let config = (0, import_config.getConfig)();
+      function track(key) {
+        keys && !keys.includes(key) && (keys.push(key), process.env.NODE_ENV === "development" && debug && console.info(` \u{1F3A8} useTheme() tracking new key: ${key}`));
+      }
+      return new Proxy(theme, {
+        has(_, key) {
+          if (Reflect.has(theme, key))
+            return !0;
+          if (typeof key == "string")
+            return key[0] === "$" && (key = key.slice(1)), themeManager == null ? void 0 : themeManager.allKeys.has(key);
+        },
+        get(_, key) {
+          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
+            key !== "undefined" && typeof key == "string"
+          ) {
+            let keyString = key[0] === "$" ? key.slice(1) : key, val = theme[keyString];
+            if (val && typeof val == "object")
+              return new Proxy(val, {
+                // when they touch the actual value we only track it
+                // if its a variable (web), its ignored!
+                get(_2, subkey) {
+                  if (subkey === "val")
+                    track(keyString);
+                  else if (subkey === "get")
+                    return (platform) => {
+                      let outVal = (0, import_createVariable.getVariable)(val);
+                      if (platform !== "web" && import_constants4.isIos && !deopt && config.settings.fastSchemeChange && !someParentIsInversed(themeManager) && scheme) {
+                        let oppositeThemeName = name.replace(
+                          scheme === "dark" ? "dark" : "light",
+                          scheme === "dark" ? "light" : "dark"
+                        ), oppositeTheme = config.themes[oppositeThemeName], oppositeVal = (0, import_createVariable.getVariable)(oppositeTheme == null ? void 0 : oppositeTheme[keyString]);
+                        if (oppositeVal)
+                          return {
+                            dynamic: {
+                              dark: scheme === "dark" ? outVal : oppositeVal,
+                              light: scheme === "light" ? outVal : oppositeVal
+                            }
+                          };
+                      }
+                      return track(keyString), outVal;
+                    };
+                  return Reflect.get(val, subkey);
+                }
+              });
+            if (process.env.NODE_ENV === "development" && process.env.TAMAGUI_FEAT_THROW_ON_MISSING_THEME_VALUE === "1")
+              throw new Error(
+                `[tamagui] No theme key "${key}" found in theme ${name}. 
+  Keys in theme: ${Object.keys(
+                  theme
+                ).join(", ")}`
+              );
+          }
+          return Reflect.get(_, key);
+        }
+      });
+    }
+    function someParentIsInversed(manager) {
+      {
+        let cur = manager;
+        for (; cur; ) {
+          if (!cur.parentManager)
+            return !1;
+          if (cur.parentManager.state.scheme !== cur.state.scheme)
+            return !0;
+          cur = cur.parentManager;
+        }
+      }
       return !1;
-    })();
+    }
+    var activeThemeManagers = /* @__PURE__ */ new Set(), _uidToManager = /* @__PURE__ */ new WeakMap(), _idToUID = {}, getId = (id) => _idToUID[id], getThemeManager = (id) => _uidToManager.get(getId(id)), registerThemeManager = (t) => {
+      if (!_idToUID[t.id]) {
+        let id = _idToUID[t.id] = {};
+        _uidToManager.set(id, t);
+      }
+    }, useChangeThemeEffect = (props, isRoot = !1, keys, shouldUpdate) => {
+      let { disable } = props, parentManagerId = (0, import_react2.useContext)(import_ThemeManagerContext.ThemeManagerIDContext), parentManager = getThemeManager(parentManagerId);
+      if (!isRoot && !parentManager || disable)
+        return {
+          isNewTheme: !1,
+          state: parentManager == null ? void 0 : parentManager.state,
+          themeManager: parentManager
+        };
+      let [themeState, setThemeState] = (0, import_react2.useState)(createState), { state, mounted, isNewTheme, themeManager, inversed } = themeState, isInversingOnMount = !!(!themeState.mounted && props.inverse);
+      function getShouldUpdateTheme(manager = themeManager, nextState, prevState = state, forceShouldChange = !1) {
+        let forceUpdate = shouldUpdate == null ? void 0 : shouldUpdate();
+        if (!manager || !forceShouldChange && forceUpdate === !1)
+          return;
+        let next = nextState || manager.getState(props, parentManager);
+        if (forceShouldChange || next && !(forceUpdate !== !0 && !manager.getStateShouldChange(next, prevState)))
+          return next;
+      }
+      if (import_constants4.isServer || ((0, import_react2.useEffect)(() => {
+        if (!themeManager)
+          return;
+        if (props.inverse && !mounted) {
+          setThemeState((prev) => createState({
+            ...prev,
+            mounted: !0
+          }));
+          return;
+        }
+        (isNewTheme || getShouldUpdateTheme(themeManager)) && (activeThemeManagers.add(themeManager), setThemeState(createState));
+        let selfListenerDispose = themeManager.onChangeTheme((_a, _b, forced) => {
+          forced && setThemeState((prev) => createState(prev, !0));
+        }), disposeChangeListener = parentManager == null ? void 0 : parentManager.onChangeTheme(
+          (name, manager, forced) => {
+            let force = forced || (shouldUpdate == null ? void 0 : shouldUpdate()) || props.deopt || props["disable-child-theme"], shouldTryUpdate = force ?? !!(keys != null && keys.length || isNewTheme);
+            process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info(" \u{1F538} onChange", themeManager.id, {
+              force,
+              shouldTryUpdate,
+              props,
+              name,
+              manager,
+              keys
+            }), shouldTryUpdate && setThemeState((prev) => createState(prev, force));
+          },
+          themeManager.id
+        );
+        return () => {
+          selfListenerDispose(), disposeChangeListener == null || disposeChangeListener(), isNewTheme && activeThemeManagers.delete(themeManager);
+        };
+      }, [
+        themeManager,
+        parentManager,
+        isNewTheme,
+        props.componentName,
+        props.inverse,
+        props.name,
+        props.reset,
+        mounted
+      ]), process.env.NODE_ENV === "development" && props.debug !== "profile" && (0, import_react2.useEffect)(() => (globalThis.TamaguiThemeManagers ??= /* @__PURE__ */ new Set(), globalThis.TamaguiThemeManagers.add(themeManager), () => {
+        globalThis.TamaguiThemeManagers.delete(themeManager);
+      }), [themeManager])), isInversingOnMount)
+        return {
+          isNewTheme: !1,
+          inversed: !1,
+          themeManager: parentManager,
+          state: {
+            name: "",
+            ...parentManager == null ? void 0 : parentManager.state,
+            className: ""
+          }
+        };
+      return {
+        state,
+        isNewTheme,
+        inversed,
+        themeManager
+      };
+      function createState(prev, force = !1) {
+        if (prev && (shouldUpdate == null ? void 0 : shouldUpdate()) === !1 && !force)
+          return prev;
+        let themeManager2 = parentManager, state2;
+        if ((0, import_ThemeManager.getHasThemeUpdatingProps)(props)) {
+          let getNewThemeManager = () => new import_ThemeManager.ThemeManager(props, isRoot ? "root" : parentManager);
+          if (prev != null && prev.themeManager) {
+            themeManager2 = prev.themeManager;
+            let forceChange = force || !!(keys != null && keys.length), next = themeManager2.getState(props, parentManager), nextState = getShouldUpdateTheme(
+              themeManager2,
+              next,
+              prev.state,
+              forceChange
+            );
+            nextState ? (state2 = nextState, prev.isNewTheme ? themeManager2.updateState(nextState) : themeManager2 = getNewThemeManager()) : prev.isNewTheme && parentManager && !next && (themeManager2 = parentManager);
+          } else
+            themeManager2 = getNewThemeManager(), state2 = { ...themeManager2.state };
+        }
+        let isNewTheme2 = !!(themeManager2 !== parentManager || props.inverse);
+        isNewTheme2 && registerThemeManager(themeManager2);
+        let mounted2 = props.inverse ? isRoot || (prev == null ? void 0 : prev.mounted) : !0;
+        state2 || (isNewTheme2 ? state2 = themeManager2.state : (state2 = parentManager.state, themeManager2 = parentManager));
+        let wasInversed = prev == null ? void 0 : prev.inversed, inversed2 = isNewTheme2 && state2.scheme !== (parentManager == null ? void 0 : parentManager.state.scheme) ? !0 : wasInversed != null ? !1 : null, response = {
+          themeManager: themeManager2,
+          isNewTheme: isNewTheme2,
+          mounted: mounted2,
+          inversed: inversed2
+        }, shouldReturnPrev = prev && !force && // isEqualShallow uses the second arg as the keys so this should compare without state first...
+        (0, import_createShallowSetState.isEqualShallow)(prev, response) && // ... and then compare just the state, because we make a new state obj but is likely the same
+        (0, import_createShallowSetState.isEqualShallow)(prev.state, state2);
+        if (prev && shouldReturnPrev)
+          return prev;
+        if (response.state = state2, process.env.NODE_ENV === "development" && props.debug && import_constants4.isClient) {
+          console.groupCollapsed(` \u{1F537} ${themeManager2.id} useChangeThemeEffect createState`);
+          let parentState = { ...parentManager == null ? void 0 : parentManager.state }, parentId = parentManager == null ? void 0 : parentManager.id, themeManagerState = { ...themeManager2.state };
+          console.info({
+            props,
+            parentState,
+            parentId,
+            themeManager: themeManager2,
+            prev,
+            response,
+            themeManagerState
+          }), console.groupEnd();
+        }
+        return response;
+      }
+    };
   }
 });
 
-// ../web/dist/cjs/helpers/getGroupPropParts.native.js
-var require_getGroupPropParts_native = __commonJS({
-  "../web/dist/cjs/helpers/getGroupPropParts.native.js"(exports2, module2) {
+// ../web/dist/cjs/Tamagui.native.js
+var require_Tamagui_native = __commonJS({
+  "../web/dist/cjs/Tamagui.native.js"(exports2, module2) {
     "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+    var __create2 = Object.create, __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __getProtoOf2 = Object.getPrototypeOf, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
       for (var name in all)
         __defProp2(target, name, { get: all[name], enumerable: !0 });
     }, __copyProps2 = (to, from, except, desc) => {
@@ -2139,22 +2220,112 @@ var require_getGroupPropParts_native = __commonJS({
         for (let key of __getOwnPropNames2(from))
           !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
       return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), getGroupPropParts_exports = {};
-    __export2(getGroupPropParts_exports, {
-      getGroupPropParts: () => getGroupPropParts
+    }, __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
+      // If the importer is in node compatibility mode or this is not an ESM
+      // file that has been converted to a CommonJS file using a Babel-
+      // compatible transform (i.e. "__esModule" has not been set), then set
+      // "default" to the CommonJS "module.exports" for node compatibility.
+      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: !0 }) : target,
+      mod
+    )), __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), Tamagui_exports = {};
+    __export2(Tamagui_exports, {
+      Tamagui: () => Tamagui,
+      getValueFromIdentifier: () => getValueFromIdentifier,
+      setIdentifierValue: () => setIdentifierValue
     });
-    module2.exports = __toCommonJS2(getGroupPropParts_exports);
-    var import_useMedia = require_useMedia_native();
-    function getGroupPropParts(groupProp) {
-      let mediaQueries = (0, import_useMedia.getMedia)(), [_, name, part3, part4] = groupProp.split("-"), pseudo, media = part3 in mediaQueries ? part3 : void 0;
-      return media ? pseudo = part4 : pseudo = part3, { name, pseudo, media };
-    }
+    module2.exports = __toCommonJS2(Tamagui_exports);
+    var Helpers = __toESM2(require_index_native7()), import_config = require_config_native(), import_insertStyleRule = require_insertStyleRule_native(), import_useMedia = require_useMedia_native(), import_useTheme = require_useTheme_native(), Tamagui = (() => {
+      if (process.env.NODE_ENV === "development") {
+        class TamaguiManager {
+          constructor() {
+            this.Helpers = Helpers, this.getThemeManager = import_useTheme.getThemeManager;
+          }
+          get activeThemeManagers() {
+            return import_useTheme.activeThemeManagers;
+          }
+          get mediaState() {
+            return { ...import_useMedia.mediaState };
+          }
+          get config() {
+            return (0, import_config.getConfig)();
+          }
+          get insertedRules() {
+            return (0, import_insertStyleRule.getAllRules)();
+          }
+          get allSelectors() {
+            return (0, import_insertStyleRule.getAllSelectors)();
+          }
+          get allTransforms() {
+            return (0, import_insertStyleRule.getAllTransforms)();
+          }
+          get identifierToValue() {
+            return identifierToValue;
+          }
+        }
+        return new TamaguiManager();
+      }
+    })(), identifierToValue = /* @__PURE__ */ new Map(), getValueFromIdentifier = (identifier) => identifierToValue.get(identifier), setIdentifierValue = (identifier, value) => {
+      identifierToValue.set(identifier, value);
+    };
   }
 });
 
-// ../web/dist/cjs/helpers/createMediaStyle.native.js
-var require_createMediaStyle_native = __commonJS({
-  "../web/dist/cjs/helpers/createMediaStyle.native.js"(exports2, module2) {
+// ../compose-refs/dist/cjs/compose-refs.native.js
+var require_compose_refs_native = __commonJS({
+  "../compose-refs/dist/cjs/compose-refs.native.js"(exports2, module2) {
+    "use strict";
+    var __create2 = Object.create, __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __getProtoOf2 = Object.getPrototypeOf, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
+      // If the importer is in node compatibility mode or this is not an ESM
+      // file that has been converted to a CommonJS file using a Babel-
+      // compatible transform (i.e. "__esModule" has not been set), then set
+      // "default" to the CommonJS "module.exports" for node compatibility.
+      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: !0 }) : target,
+      mod
+    )), __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), compose_refs_exports = {};
+    __export2(compose_refs_exports, {
+      composeRefs: () => composeRefs,
+      useComposedRefs: () => useComposedRefs
+    });
+    module2.exports = __toCommonJS2(compose_refs_exports);
+    var React2 = __toESM2(require("react"));
+    function setRef(ref, value) {
+      typeof ref == "function" ? ref(value) : ref && (ref.current = value);
+    }
+    function composeRefs(...refs) {
+      return (node) => refs.forEach((ref) => setRef(ref, node));
+    }
+    function useComposedRefs(...refs) {
+      return React2.useCallback(composeRefs(...refs), refs);
+    }
+  }
+});
+
+// ../compose-refs/dist/cjs/index.native.js
+var require_index_native10 = __commonJS({
+  "../compose-refs/dist/cjs/index.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __reExport2 = (target, mod, secondTarget) => (__copyProps2(target, mod, "default"), secondTarget && __copyProps2(secondTarget, mod, "default")), __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), src_exports2 = {};
+    module2.exports = __toCommonJS2(src_exports2);
+    __reExport2(src_exports2, require_compose_refs_native(), module2.exports);
+  }
+});
+
+// ../web/dist/cjs/helpers/objectIdentityKey.native.js
+var require_objectIdentityKey_native = __commonJS({
+  "../web/dist/cjs/helpers/objectIdentityKey.native.js"(exports2, module2) {
     "use strict";
     var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
       for (var name in all)
@@ -2164,83 +2335,357 @@ var require_createMediaStyle_native = __commonJS({
         for (let key of __getOwnPropNames2(from))
           !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
       return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createMediaStyle_exports = {};
-    __export2(createMediaStyle_exports, {
-      MEDIA_SEP: () => MEDIA_SEP,
-      createMediaStyle: () => createMediaStyle
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), objectIdentityKey_exports = {};
+    __export2(objectIdentityKey_exports, {
+      objectIdentityKey: () => objectIdentityKey
     });
-    module2.exports = __toCommonJS2(createMediaStyle_exports);
-    var import_config = require_config_native(), import_useMedia = require_useMedia_native(), import_getGroupPropParts = require_getGroupPropParts_native(), MEDIA_SEP = "_", prefixes = null, selectors = null, groupPseudoToPseudoCSSMap = {
-      press: "active"
-    }, createMediaStyle = (styleObject, mediaKeyIn, mediaQueries, type, negate, priority) => {
-      let { property, identifier, rules } = styleObject, conf = (0, import_config.getConfig)(), enableMediaPropOrder = conf.settings.mediaPropOrder, isTheme = type === "theme", isPlatform = type === "platform", isGroup = type === "group", isNonWindowMedia = isTheme || isPlatform || isGroup, negKey = negate ? "0" : "", ogPrefix = identifier.slice(0, identifier.indexOf("-") + 1), id = `${ogPrefix}${MEDIA_SEP}${mediaKeyIn.replace("-", "")}${negKey}${MEDIA_SEP}`, styleRule = "", groupMediaKey, containerName, nextIdentifier = identifier.replace(ogPrefix, id), styleInner = rules.map((rule) => rule.replace(identifier, nextIdentifier)).join(";");
-      if (isNonWindowMedia) {
-        let precedenceImportancePrefix = new Array((priority || 0) + (isGroup ? 1 : 0)).fill(":root").join("");
-        if (isTheme || isGroup) {
-          let groupInfo = (0, import_getGroupPropParts.getGroupPropParts)(mediaKeyIn), mediaName = groupInfo == null ? void 0 : groupInfo.name;
-          groupMediaKey = groupInfo == null ? void 0 : groupInfo.media, isGroup && (containerName = mediaName);
-          let name = (isGroup ? "group_" : "") + mediaName, selectorStart = styleInner.indexOf(":root"), selectorEnd = styleInner.lastIndexOf("{"), selector = styleInner.slice(selectorStart, selectorEnd), precedenceSpace = conf.themeClassNameOnRoot && isTheme ? "" : " ", pseudoSelectorName = groupInfo.pseudo ? groupPseudoToPseudoCSSMap[groupInfo.pseudo] || groupInfo.pseudo : void 0, pseudoSelector = pseudoSelectorName ? `:${pseudoSelectorName}` : "", presedencePrefix = `:root${precedenceImportancePrefix}${precedenceSpace}`, mediaSelector = `.t_${name}${pseudoSelector}`, nextSelector = `${presedencePrefix}${mediaSelector} ${selector.replace(
-            ":root",
-            ""
-          )}`;
-          styleRule = styleInner.replace(selector, nextSelector);
-        } else
-          styleRule = `${precedenceImportancePrefix}${styleInner}`;
-      }
-      if (!isNonWindowMedia || groupMediaKey) {
-        if (!selectors) {
-          let mediaKeys = Object.keys(mediaQueries);
-          selectors = Object.fromEntries(
-            mediaKeys.map((key) => [key, (0, import_useMedia.mediaObjectToString)(mediaQueries[key])])
-          ), enableMediaPropOrder || (prefixes = Object.fromEntries(
-            mediaKeys.map((k, index) => [k, new Array(index + 1).fill(":root").join("")])
-          ));
+    module2.exports = __toCommonJS2(objectIdentityKey_exports);
+    function objectIdentityKey(obj) {
+      let k = "";
+      for (let key in obj) {
+        k += key;
+        let arg = obj[key], type = typeof arg;
+        if (!arg || type !== "object" && type !== "function")
+          k += type + arg;
+        else if (cache.has(arg))
+          k += cache.get(arg);
+        else {
+          let v = Math.random();
+          cache.set(arg, v), k += v;
         }
-        let mediaKey = groupMediaKey || mediaKeyIn, mediaSelector = selectors[mediaKey], mediaQuery = `${negate ? "not all and " : ""}${mediaSelector}`, precedenceImportancePrefix = groupMediaKey ? "" : enableMediaPropOrder ? (
-          // this new array should be cached
-          new Array(priority).fill(":root").join("")
-        ) : (
-          // @ts-ignore
-          prefixes[mediaKey]
-        ), prefix = groupMediaKey ? `@container ${containerName}` : "@media";
-        groupMediaKey && (styleInner = styleRule), styleInner.includes(prefix) ? styleRule = styleInner.replace("{", ` and ${mediaQuery} {`).replace("and screen and", "and") : styleRule = `${prefix} ${mediaQuery}{${precedenceImportancePrefix}${styleInner}}`, groupMediaKey && (styleRule = `@supports (contain: ${conf.settings.webContainerType || "inline-size"}) {${styleRule}}`);
       }
-      return {
-        property,
-        rules: [styleRule],
-        identifier: nextIdentifier
+      return k;
+    }
+    var cache = /* @__PURE__ */ new WeakMap();
+  }
+});
+
+// ../web/dist/cjs/helpers/createStyledContext.native.js
+var require_createStyledContext_native = __commonJS({
+  "../web/dist/cjs/helpers/createStyledContext.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createStyledContext_exports = {};
+    __export2(createStyledContext_exports, {
+      createStyledContext: () => createStyledContext2
+    });
+    module2.exports = __toCommonJS2(createStyledContext_exports);
+    var import_react2 = require("react"), import_objectIdentityKey = require_objectIdentityKey_native(), import_jsx_runtime6 = require("react/jsx-runtime");
+    function createStyledContext2(defaultValues) {
+      let OGContext = (0, import_react2.createContext)(defaultValues), OGProvider2 = OGContext.Provider, Context = OGContext, scopedContexts = /* @__PURE__ */ new Map(), Provider = ({
+        children,
+        scope,
+        ...values
+      }) => {
+        let next = (0, import_react2.useMemo)(() => ({
+          // this ! is a workaround for ts error
+          ...defaultValues,
+          ...values
+        }), [(0, import_objectIdentityKey.objectIdentityKey)(values)]), Provider2 = OGProvider2;
+        if (scope) {
+          let ScopedContext = scopedContexts.get(scope);
+          ScopedContext || (ScopedContext = (0, import_react2.createContext)(defaultValues), scopedContexts.set(scope, ScopedContext)), Provider2 = ScopedContext.Provider;
+        }
+        return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Provider2, { value: next, children });
+      }, useStyledContext = (scope) => {
+        let context = scope ? scopedContexts.get(scope) : OGContext;
+        return (0, import_react2.useContext)(context);
       };
+      return Context.Provider = Provider, Context.props = defaultValues, Context.context = OGContext, Context.useStyledContext = useStyledContext, Context;
+    }
+  }
+});
+
+// ../web/dist/cjs/contexts/ComponentContext.native.js
+var require_ComponentContext_native = __commonJS({
+  "../web/dist/cjs/contexts/ComponentContext.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), ComponentContext_exports = {};
+    __export2(ComponentContext_exports, {
+      ComponentContext: () => ComponentContext2
+    });
+    module2.exports = __toCommonJS2(ComponentContext_exports);
+    var import_createStyledContext = require_createStyledContext_native(), ComponentContext2 = (0, import_createStyledContext.createStyledContext)({
+      disableSSR: void 0,
+      inText: !1,
+      language: null,
+      animationDriver: null,
+      groups: {
+        emit: null,
+        subscribe: null,
+        state: {}
+      }
+    });
+  }
+});
+
+// ../web/dist/cjs/defaultComponentState.native.js
+var require_defaultComponentState_native = __commonJS({
+  "../web/dist/cjs/defaultComponentState.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), defaultComponentState_exports = {};
+    __export2(defaultComponentState_exports, {
+      defaultComponentState: () => defaultComponentState,
+      defaultComponentStateMounted: () => defaultComponentStateMounted,
+      defaultComponentStateShouldEnter: () => defaultComponentStateShouldEnter
+    });
+    module2.exports = __toCommonJS2(defaultComponentState_exports);
+    var defaultComponentState = {
+      hover: !1,
+      press: !1,
+      pressIn: !1,
+      focus: !1,
+      unmounted: !0
+    }, defaultComponentStateMounted = {
+      ...defaultComponentState,
+      unmounted: !1
+    }, defaultComponentStateShouldEnter = {
+      ...defaultComponentState,
+      unmounted: "should-enter"
     };
   }
 });
 
-// ../../node_modules/@react-native/normalize-color/index.js
-var require_normalize_color = __commonJS({
-  "../../node_modules/@react-native/normalize-color/index.js"(exports2, module2) {
+// ../web/dist/cjs/constants/accessibilityDirectMap.native.js
+var require_accessibilityDirectMap_native = __commonJS({
+  "../web/dist/cjs/constants/accessibilityDirectMap.native.js"(exports2, module2) {
     "use strict";
-    function normalizeColor(color) {
-      if (typeof color == "number")
-        return color >>> 0 === color && color >= 0 && color <= 4294967295 ? color : null;
-      if (typeof color != "string")
-        return null;
-      let matchers = getMatchers(), match;
-      if (match = matchers.hex6.exec(color))
-        return parseInt(match[1] + "ff", 16) >>> 0;
-      let colorFromKeyword = normalizeKeyword(color);
-      return colorFromKeyword ?? ((match = matchers.rgb.exec(color)) ? (parse255(match[1]) << 24 | // r
-      parse255(match[2]) << 16 | // g
-      parse255(match[3]) << 8 | // b
-      255) >>> // a
-      0 : (match = matchers.rgba.exec(color)) ? match[6] !== void 0 ? (parse255(match[6]) << 24 | // r
-      parse255(match[7]) << 16 | // g
-      parse255(match[8]) << 8 | // b
-      parse1(match[9])) >>> // a
-      0 : (parse255(match[2]) << 24 | // r
-      parse255(match[3]) << 16 | // g
-      parse255(match[4]) << 8 | // b
-      parse1(match[5])) >>> // a
-      0 : (match = matchers.hex3.exec(color)) ? parseInt(
-        match[1] + match[1] + // r
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), accessibilityDirectMap_native_exports = {};
+    __export2(accessibilityDirectMap_native_exports, {
+      accessibilityDirectMap: () => accessibilityDirectMap,
+      accessibilityWebRoleToNativeRole: () => accessibilityWebRoleToNativeRole,
+      nativeAccessibilityState: () => nativeAccessibilityState,
+      nativeAccessibilityValue: () => nativeAccessibilityValue,
+      webToNativeAccessibilityDirectMap: () => webToNativeAccessibilityDirectMap
+    });
+    module2.exports = __toCommonJS2(accessibilityDirectMap_native_exports);
+    var accessibilityDirectMap = {}, webToNativeAccessibilityDirectMap = {
+      "aria-label": "accessibilityLabel",
+      "aria-labelledby": "accessibilityLabelledBy",
+      "aria-live": "accessibilityLiveRegion",
+      "aria-modal": "accessibilityViewIsModal",
+      "aria-hidden": "accessibilityElementsHidden"
+    }, nativeAccessibilityValue = {
+      "aria-valuemin": "min",
+      "aria-valuemax": "max",
+      "aria-valuenow": "now",
+      "aria-valuetext": "text"
+    }, nativeAccessibilityState = {
+      "aria-disabled": "disabled",
+      "aria-selected": "selected",
+      "aria-checked": "checked",
+      "aria-busy": "busy",
+      "aria-expanded": "expanded"
+    }, accessibilityWebRoleToNativeRole = {
+      alert: "alert",
+      button: "button",
+      checkbox: "checkbox",
+      combobox: "combobox",
+      grid: "grid",
+      group: "none",
+      heading: "header",
+      imagebutton: "imagebutton",
+      img: "image",
+      keyboardkey: "keyboardkey",
+      link: "link",
+      menu: "menu",
+      menubar: "menubar",
+      menuitem: "menuitem",
+      none: "none",
+      presentation: "none",
+      progressbar: "progressbar",
+      radio: "radio",
+      radiogroup: "radiogroup",
+      region: "summary",
+      scrollbar: "scrollbar",
+      searchbox: "search",
+      slider: "adjustable",
+      spinbutton: "spinbutton",
+      summary: "summary",
+      switch: "switch",
+      tab: "tab",
+      tablist: "tablist",
+      text: "text",
+      timer: "timer",
+      togglebutton: "togglebutton",
+      toolbar: "toolbar"
+    };
+  }
+});
+
+// ../web/dist/cjs/constants/isDevTools.native.js
+var require_isDevTools_native = __commonJS({
+  "../web/dist/cjs/constants/isDevTools.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), isDevTools_exports = {};
+    __export2(isDevTools_exports, {
+      isDevTools: () => isDevTools
+    });
+    module2.exports = __toCommonJS2(isDevTools_exports);
+    var isDevTools = (() => {
+      if (process.env.NODE_ENV === "development")
+        try {
+          return new Function("try {return this===window;}catch(e){ return false;}")();
+        } catch {
+        }
+      return !1;
+    })();
+  }
+});
+
+// ../web/dist/cjs/helpers/getGroupPropParts.native.js
+var require_getGroupPropParts_native = __commonJS({
+  "../web/dist/cjs/helpers/getGroupPropParts.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), getGroupPropParts_exports = {};
+    __export2(getGroupPropParts_exports, {
+      getGroupPropParts: () => getGroupPropParts
+    });
+    module2.exports = __toCommonJS2(getGroupPropParts_exports);
+    var import_useMedia = require_useMedia_native();
+    function getGroupPropParts(groupProp) {
+      let mediaQueries = (0, import_useMedia.getMedia)(), [_, name, part3, part4] = groupProp.split("-"), pseudo, media = part3 in mediaQueries ? part3 : void 0;
+      return media ? pseudo = part4 : pseudo = part3, { name, pseudo, media };
+    }
+  }
+});
+
+// ../web/dist/cjs/helpers/createMediaStyle.native.js
+var require_createMediaStyle_native = __commonJS({
+  "../web/dist/cjs/helpers/createMediaStyle.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: !0 });
+    }, __copyProps2 = (to, from, except, desc) => {
+      if (from && typeof from == "object" || typeof from == "function")
+        for (let key of __getOwnPropNames2(from))
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
+      return to;
+    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), createMediaStyle_exports = {};
+    __export2(createMediaStyle_exports, {
+      MEDIA_SEP: () => MEDIA_SEP,
+      createMediaStyle: () => createMediaStyle
+    });
+    module2.exports = __toCommonJS2(createMediaStyle_exports);
+    var import_config = require_config_native(), import_useMedia = require_useMedia_native(), import_getGroupPropParts = require_getGroupPropParts_native(), MEDIA_SEP = "_", prefixes = null, selectors = null, groupPseudoToPseudoCSSMap = {
+      press: "active"
+    }, createMediaStyle = (styleObject, mediaKeyIn, mediaQueries, type, negate, priority) => {
+      let { property, identifier, rules } = styleObject, conf = (0, import_config.getConfig)(), enableMediaPropOrder = conf.settings.mediaPropOrder, isTheme = type === "theme", isPlatform = type === "platform", isGroup = type === "group", isNonWindowMedia = isTheme || isPlatform || isGroup, negKey = negate ? "0" : "", ogPrefix = identifier.slice(0, identifier.indexOf("-") + 1), id = `${ogPrefix}${MEDIA_SEP}${mediaKeyIn.replace("-", "")}${negKey}${MEDIA_SEP}`, styleRule = "", groupMediaKey, containerName, nextIdentifier = identifier.replace(ogPrefix, id), styleInner = rules.map((rule) => rule.replace(identifier, nextIdentifier)).join(";");
+      if (isNonWindowMedia) {
+        let precedenceImportancePrefix = new Array((priority || 0) + (isGroup ? 1 : 0)).fill(":root").join("");
+        if (isTheme || isGroup) {
+          let groupInfo = (0, import_getGroupPropParts.getGroupPropParts)(mediaKeyIn), mediaName = groupInfo == null ? void 0 : groupInfo.name;
+          groupMediaKey = groupInfo == null ? void 0 : groupInfo.media, isGroup && (containerName = mediaName);
+          let name = (isGroup ? "group_" : "") + mediaName, selectorStart = styleInner.indexOf(":root"), selectorEnd = styleInner.lastIndexOf("{"), selector = styleInner.slice(selectorStart, selectorEnd), precedenceSpace = conf.themeClassNameOnRoot && isTheme ? "" : " ", pseudoSelectorName = groupInfo.pseudo ? groupPseudoToPseudoCSSMap[groupInfo.pseudo] || groupInfo.pseudo : void 0, pseudoSelector = pseudoSelectorName ? `:${pseudoSelectorName}` : "", presedencePrefix = `:root${precedenceImportancePrefix}${precedenceSpace}`, mediaSelector = `.t_${name}${pseudoSelector}`, nextSelector = `${presedencePrefix}${mediaSelector} ${selector.replace(
+            ":root",
+            ""
+          )}`;
+          styleRule = styleInner.replace(selector, nextSelector);
+        } else
+          styleRule = `${precedenceImportancePrefix}${styleInner}`;
+      }
+      if (!isNonWindowMedia || groupMediaKey) {
+        if (!selectors) {
+          let mediaKeys = Object.keys(mediaQueries);
+          selectors = Object.fromEntries(
+            mediaKeys.map((key) => [key, (0, import_useMedia.mediaObjectToString)(mediaQueries[key])])
+          ), enableMediaPropOrder || (prefixes = Object.fromEntries(
+            mediaKeys.map((k, index) => [k, new Array(index + 1).fill(":root").join("")])
+          ));
+        }
+        let mediaKey = groupMediaKey || mediaKeyIn, mediaSelector = selectors[mediaKey], mediaQuery = `${negate ? "not all and " : ""}${mediaSelector}`, precedenceImportancePrefix = groupMediaKey ? "" : enableMediaPropOrder ? (
+          // this new array should be cached
+          new Array(priority).fill(":root").join("")
+        ) : (
+          // @ts-ignore
+          prefixes[mediaKey]
+        ), prefix = groupMediaKey ? `@container ${containerName}` : "@media";
+        groupMediaKey && (styleInner = styleRule), styleInner.includes(prefix) ? styleRule = styleInner.replace("{", ` and ${mediaQuery} {`).replace("and screen and", "and") : styleRule = `${prefix} ${mediaQuery}{${precedenceImportancePrefix}${styleInner}}`, groupMediaKey && (styleRule = `@supports (contain: ${conf.settings.webContainerType || "inline-size"}) {${styleRule}}`);
+      }
+      return {
+        property,
+        rules: [styleRule],
+        identifier: nextIdentifier
+      };
+    };
+  }
+});
+
+// ../../node_modules/@react-native/normalize-color/index.js
+var require_normalize_color = __commonJS({
+  "../../node_modules/@react-native/normalize-color/index.js"(exports2, module2) {
+    "use strict";
+    function normalizeColor(color) {
+      if (typeof color == "number")
+        return color >>> 0 === color && color >= 0 && color <= 4294967295 ? color : null;
+      if (typeof color != "string")
+        return null;
+      let matchers = getMatchers(), match;
+      if (match = matchers.hex6.exec(color))
+        return parseInt(match[1] + "ff", 16) >>> 0;
+      let colorFromKeyword = normalizeKeyword(color);
+      return colorFromKeyword ?? ((match = matchers.rgb.exec(color)) ? (parse255(match[1]) << 24 | // r
+      parse255(match[2]) << 16 | // g
+      parse255(match[3]) << 8 | // b
+      255) >>> // a
+      0 : (match = matchers.rgba.exec(color)) ? match[6] !== void 0 ? (parse255(match[6]) << 24 | // r
+      parse255(match[7]) << 16 | // g
+      parse255(match[8]) << 8 | // b
+      parse1(match[9])) >>> // a
+      0 : (parse255(match[2]) << 24 | // r
+      parse255(match[3]) << 16 | // g
+      parse255(match[4]) << 8 | // b
+      parse1(match[5])) >>> // a
+      0 : (match = matchers.hex3.exec(color)) ? parseInt(
+        match[1] + match[1] + // r
         match[2] + match[2] + // g
         match[3] + match[3] + // b
         "ff",
@@ -3877,440 +4322,6 @@ var require_mergeProps_native = __commonJS({
   }
 });
 
-// ../web/dist/cjs/helpers/ThemeManagerContext.native.js
-var require_ThemeManagerContext_native = __commonJS({
-  "../web/dist/cjs/helpers/ThemeManagerContext.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), ThemeManagerContext_exports = {};
-    __export2(ThemeManagerContext_exports, {
-      ThemeManagerIDContext: () => ThemeManagerIDContext
-    });
-    module2.exports = __toCommonJS2(ThemeManagerContext_exports);
-    var import_react2 = require("react"), ThemeManagerIDContext = (0, import_react2.createContext)(1);
-  }
-});
-
-// ../web/dist/cjs/helpers/ThemeManager.native.js
-var require_ThemeManager_native = __commonJS({
-  "../web/dist/cjs/helpers/ThemeManager.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), ThemeManager_exports = {};
-    __export2(ThemeManager_exports, {
-      ThemeManager: () => ThemeManager,
-      getHasThemeUpdatingProps: () => getHasThemeUpdatingProps,
-      getManagers: () => getManagers
-    });
-    module2.exports = __toCommonJS2(ThemeManager_exports);
-    var import_constants4 = require_index_native(), import_config = require_config_native(), import_constants22 = require_constants_native2(), emptyState = { name: "" };
-    function getHasThemeUpdatingProps(props) {
-      return !!(props.name || props.componentName || props.inverse || props.reset);
-    }
-    var uid = 0, ThemeManager = class {
-      constructor(props = {}, parentManager) {
-        if (this.props = props, this.id = 0, this.themeListeners = /* @__PURE__ */ new Set(), this.parentManager = null, this.state = emptyState, this._allKeys = null, uid = (uid + 1) % Number.MAX_VALUE, this.id = uid, parentManager === "root") {
-          this.updateStateFromProps(props, !1);
-          return;
-        }
-        if (!parentManager)
-          throw process.env.NODE_ENV !== "production" ? new Error(
-            "No parent manager given, this is likely due to duplicated Tamagui dependencies. Check your lockfile for mis-matched versions. It could also be from an error somewhere else in your stack causing Tamagui to recieve undefined context, you can try putting some ErrorBoundary components around other areas of your app, or a Suspense boundary."
-          ) : "\u274C 000";
-        if (this.parentManager = parentManager, !this.updateStateFromProps(props, !1))
-          return parentManager;
-      }
-      updateStateFromProps(props = this.props || {}, shouldNotify = !0) {
-        if (this.props = props, props.forceTheme)
-          return this.state.theme = props.forceTheme, this.state.name = props.name || "", this.updateState(this.state, !0), this.state;
-        let nextState = this.getStateIfChanged(props);
-        if (nextState)
-          return this.updateState(nextState, shouldNotify), nextState;
-      }
-      updateState(nextState, shouldNotify = !0) {
-        this.state = nextState, this._allKeys = null, process.env.NODE_ENV !== "production" && (this._numChangeEventsSent ??= 0, this._numChangeEventsSent++), shouldNotify && this.notify();
-      }
-      getStateIfChanged(props = this.props, state = this.state, parentManager = this.parentManager) {
-        let _ = this.getState(props, parentManager);
-        if (state && state !== emptyState && !_)
-          return parentManager == null ? void 0 : parentManager.state;
-        if (this.getStateShouldChange(_, state))
-          return _;
-      }
-      getStateShouldChange(nextState, state = this.state) {
-        return !(!(nextState != null && nextState.theme) || nextState.theme === (state == null ? void 0 : state.theme));
-      }
-      getState(props = this.props, parentManager = this.parentManager) {
-        return getState(props, parentManager) || (parentManager == null ? void 0 : parentManager.state) || null;
-      }
-      get allKeys() {
-        var _a;
-        return this._allKeys ||= /* @__PURE__ */ new Set([
-          ...((_a = this.parentManager) == null ? void 0 : _a.allKeys) || [],
-          ...Object.keys(this.state.theme || {})
-        ]), this._allKeys;
-      }
-      notify(forced = !1) {
-        this.themeListeners.forEach((cb) => cb(this.state.name, this, forced));
-      }
-      onChangeTheme(cb, debugId) {
-        return process.env.NODE_ENV !== "production" && debugId && (this._listeningIds ??= /* @__PURE__ */ new Set(), this._listeningIds.add(debugId)), this.themeListeners.add(cb), () => {
-          this.themeListeners.delete(cb);
-        };
-      }
-    };
-    function getState(props, manager) {
-      var _a;
-      if (props.name && props.reset)
-        throw new Error(
-          process.env.NODE_ENV === "production" ? "\u274C004" : "Cannot reset and set a new name at the same time."
-        );
-      if (!getHasThemeUpdatingProps(props))
-        return null;
-      let themes = (0, import_config.getThemes)(), [allManagers, componentManagers] = getManagers(manager), isDirectParentAComponentTheme = !!(manager != null && manager.state.isComponent), startIndex = props.reset && !isDirectParentAComponentTheme ? 1 : 0, baseManager = allManagers[startIndex], parentManager = allManagers[startIndex + 1];
-      if (!baseManager && props.reset)
-        return process.env.NODE_ENV !== "production" && console.warn("Cannot reset, no parent theme exists"), null;
-      let { componentName } = props, result = null, baseName = (baseManager == null ? void 0 : baseManager.state.name) || "";
-      baseManager != null && baseManager.state.isComponent && (baseName = baseName.replace(/_[A-Z][A-Za-z]+/, ""));
-      let nextName = props.reset ? baseName : props.name || "", allComponentThemes = componentManagers.map((x) => (x == null ? void 0 : x.state.name) || "");
-      isDirectParentAComponentTheme && allComponentThemes.shift();
-      let base = baseName.split(import_constants22.THEME_NAME_SEPARATOR), max2 = base.length, min2 = props.componentName && !nextName ? max2 : 0;
-      for (let i = max2; i >= min2; i--) {
-        let prefix = base.slice(0, i).join(import_constants22.THEME_NAME_SEPARATOR);
-        props.inverse && (prefix = inverseThemeName(prefix));
-        let potentials = [];
-        if (prefix && prefix !== baseName && potentials.push(prefix), nextName && potentials.unshift(prefix ? `${prefix}_${nextName}` : nextName), i === 1) {
-          let lastSegment = potentials.findIndex((x) => !x.includes("_"));
-          lastSegment > 0 && potentials.splice(lastSegment, 0, nextName);
-        }
-        if (componentName && !props.reset) {
-          let baseLen = base.length, componentPotentials = [];
-          if (nextName && baseLen > 1) {
-            let beforeSeparator = base[0];
-            componentPotentials.push(`${beforeSeparator}_${nextName}_${componentName}`);
-          }
-          if (componentPotentials.push(`${prefix}_${componentName}`), nextName) {
-            if (i > baseLen) {
-              let prefixLessOne = base.slice(0, i - 1).join(import_constants22.THEME_NAME_SEPARATOR);
-              if (prefixLessOne) {
-                let lessSpecific = `${prefixLessOne}_${nextName}_${componentName}`;
-                componentPotentials.unshift(lessSpecific);
-              }
-            }
-            let moreSpecific = `${prefix}_${nextName}_${componentName}`;
-            componentPotentials.unshift(moreSpecific);
-          }
-          potentials = [...componentPotentials, ...potentials, ...allComponentThemes];
-        }
-        let found = potentials.find((t) => t in themes);
-        if (process.env.NODE_ENV !== "production" && typeof props.debug == "string" && console.info(" getState ", {
-          props,
-          found,
-          potentials,
-          baseManager,
-          nextName,
-          baseName,
-          prefix
-        }), found) {
-          let names = found.split("_"), [firstName, ...restNames] = names, lastName = names[names.length - 1], isComponent = lastName[0] === lastName[0].toUpperCase(), scheme = firstName === "light" ? "light" : firstName === "dark" ? "dark" : void 0, pre = import_constants22.THEME_CLASSNAME_PREFIX, className = import_constants4.isWeb ? `${pre}sub_theme ${pre}${!scheme || !restNames.length ? firstName : restNames.join("_")}` : "", parentState = (_a = baseManager || parentManager) == null ? void 0 : _a.state, parentName = parentState == null ? void 0 : parentState.name;
-          result = {
-            name: found,
-            parentName,
-            theme: themes[found],
-            className,
-            isComponent,
-            scheme
-          };
-          break;
-        }
-      }
-      return process.env.NODE_ENV !== "production" && props.debug === "verbose" && typeof window < "u" && (console.groupCollapsed("ThemeManager.getState()"), console.info({ props, baseName, base, min: min2, max: max2 }), console.warn("result", { result }), console.trace(), console.groupEnd()), result;
-    }
-    var inverseThemeName = (themeName) => themeName.startsWith("light") ? themeName.replace(/^light/, "dark") : themeName.replace(/^dark/, "light");
-    function getManagers(themeManager) {
-      let comp = [], all = [], cur = themeManager;
-      for (; cur; )
-        all.push(cur), cur.state.isComponent && comp.push(cur), cur = cur.parentManager;
-      return [all, comp];
-    }
-  }
-});
-
-// ../web/dist/cjs/hooks/useTheme.native.js
-var require_useTheme_native = __commonJS({
-  "../web/dist/cjs/hooks/useTheme.native.js"(exports2, module2) {
-    "use strict";
-    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = (target, all) => {
-      for (var name in all)
-        __defProp2(target, name, { get: all[name], enumerable: !0 });
-    }, __copyProps2 = (to, from, except, desc) => {
-      if (from && typeof from == "object" || typeof from == "function")
-        for (let key of __getOwnPropNames2(from))
-          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable });
-      return to;
-    }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), useTheme_exports = {};
-    __export2(useTheme_exports, {
-      activeThemeManagers: () => activeThemeManagers,
-      getThemeManager: () => getThemeManager,
-      getThemeProxied: () => getThemeProxied,
-      useChangeThemeEffect: () => useChangeThemeEffect,
-      useTheme: () => useTheme4,
-      useThemeWithState: () => useThemeWithState
-    });
-    module2.exports = __toCommonJS2(useTheme_exports);
-    var import_constants4 = require_index_native(), import_react2 = require("react"), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_createShallowSetState = require_createShallowSetState_native(), import_ThemeManager = require_ThemeManager_native(), import_ThemeManagerContext = require_ThemeManagerContext_native(), emptyProps = { name: null }, cached;
-    function getDefaultThemeProxied() {
-      if (cached)
-        return cached;
-      let config = (0, import_config.getConfig)(), name = config.themes.light ? "light" : Object.keys(config.themes)[0], defaultTheme = config.themes[name];
-      return cached = getThemeProxied({ theme: defaultTheme, name }), cached;
-    }
-    var useTheme4 = (props = emptyProps) => {
-      let [_, theme] = useThemeWithState(props);
-      return theme || getDefaultThemeProxied();
-    }, useThemeWithState = (props) => {
-      let keys = (0, import_react2.useRef)([]), changedThemeState = useChangeThemeEffect(
-        props,
-        !1,
-        keys.current,
-        import_constants4.isServer ? void 0 : () => {
-          var _a, _b;
-          let next = ((_a = props.shouldUpdate) == null ? void 0 : _a.call(props)) ?? (keys.current.length > 0 ? !0 : void 0);
-          return process.env.NODE_ENV === "development" && typeof props.debug == "string" && props.debug !== "profile" && console.info("  \u{1F3A8} useTheme() shouldUpdate?", next, {
-            shouldUpdateProp: (_b = props.shouldUpdate) == null ? void 0 : _b.call(props),
-            keys: [...keys.current]
-          }), next;
-        }
-      ), { themeManager, state } = changedThemeState;
-      process.env.NODE_ENV === "development" && (state != null && state.theme || process.env.TAMAGUI_DISABLE_NO_THEME_WARNING !== "1" && console.warn(
-        `[tamagui] No theme found, this could be due to an invalid theme name (given theme props ${JSON.stringify(
-          props
-        )}).
-
-If this is intended and you are using Tamagui without any themes, you can disable this warning by setting the environment variable TAMAGUI_DISABLE_NO_THEME_WARNING=1`
-      ));
-      let themeProxied = (0, import_react2.useMemo)(() => !themeManager || !(state != null && state.theme) ? {} : getThemeProxied(state, props.deopt, themeManager, keys.current, props.debug), [state == null ? void 0 : state.theme, themeManager, props.deopt, props.debug]);
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && (console.groupCollapsed("  \u{1F539} useTheme =>", state == null ? void 0 : state.name), console.info("returning state", changedThemeState, "from props", props), console.groupEnd()), [changedThemeState, themeProxied];
-    };
-    function getThemeProxied({ theme, name, scheme }, deopt = !1, themeManager, keys, debug) {
-      if (!theme)
-        return {};
-      let config = (0, import_config.getConfig)();
-      function track(key) {
-        keys && !keys.includes(key) && (keys.push(key), process.env.NODE_ENV === "development" && debug && console.info(` \u{1F3A8} useTheme() tracking new key: ${key}`));
-      }
-      return new Proxy(theme, {
-        has(_, key) {
-          if (Reflect.has(theme, key))
-            return !0;
-          if (typeof key == "string")
-            return key[0] === "$" && (key = key.slice(1)), themeManager == null ? void 0 : themeManager.allKeys.has(key);
-        },
-        get(_, key) {
-          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
-            key !== "undefined" && typeof key == "string"
-          ) {
-            let keyString = key[0] === "$" ? key.slice(1) : key, val = theme[keyString];
-            if (val && typeof val == "object")
-              return new Proxy(val, {
-                // when they touch the actual value we only track it
-                // if its a variable (web), its ignored!
-                get(_2, subkey) {
-                  if (subkey === "val")
-                    track(keyString);
-                  else if (subkey === "get")
-                    return (platform) => {
-                      let outVal = (0, import_createVariable.getVariable)(val);
-                      if (platform !== "web" && import_constants4.isIos && !deopt && config.settings.fastSchemeChange && !someParentIsInversed(themeManager) && scheme) {
-                        let oppositeThemeName = name.replace(
-                          scheme === "dark" ? "dark" : "light",
-                          scheme === "dark" ? "light" : "dark"
-                        ), oppositeTheme = config.themes[oppositeThemeName], oppositeVal = (0, import_createVariable.getVariable)(oppositeTheme == null ? void 0 : oppositeTheme[keyString]);
-                        if (oppositeVal)
-                          return {
-                            dynamic: {
-                              dark: scheme === "dark" ? outVal : oppositeVal,
-                              light: scheme === "light" ? outVal : oppositeVal
-                            }
-                          };
-                      }
-                      return track(keyString), outVal;
-                    };
-                  return Reflect.get(val, subkey);
-                }
-              });
-            if (process.env.NODE_ENV === "development" && process.env.TAMAGUI_FEAT_THROW_ON_MISSING_THEME_VALUE === "1")
-              throw new Error(
-                `[tamagui] No theme key "${key}" found in theme ${name}. 
-  Keys in theme: ${Object.keys(
-                  theme
-                ).join(", ")}`
-              );
-          }
-          return Reflect.get(_, key);
-        }
-      });
-    }
-    function someParentIsInversed(manager) {
-      {
-        let cur = manager;
-        for (; cur; ) {
-          if (!cur.parentManager)
-            return !1;
-          if (cur.parentManager.state.scheme !== cur.state.scheme)
-            return !0;
-          cur = cur.parentManager;
-        }
-      }
-      return !1;
-    }
-    var activeThemeManagers = /* @__PURE__ */ new Set(), _uidToManager = /* @__PURE__ */ new WeakMap(), _idToUID = {}, getId = (id) => _idToUID[id], getThemeManager = (id) => _uidToManager.get(getId(id)), registerThemeManager = (t) => {
-      if (!_idToUID[t.id]) {
-        let id = _idToUID[t.id] = {};
-        _uidToManager.set(id, t);
-      }
-    }, useChangeThemeEffect = (props, isRoot = !1, keys, shouldUpdate) => {
-      let { disable } = props, parentManagerId = (0, import_react2.useContext)(import_ThemeManagerContext.ThemeManagerIDContext), parentManager = getThemeManager(parentManagerId);
-      if (!isRoot && !parentManager || disable)
-        return {
-          isNewTheme: !1,
-          state: parentManager == null ? void 0 : parentManager.state,
-          themeManager: parentManager
-        };
-      let [themeState, setThemeState] = (0, import_react2.useState)(createState), { state, mounted, isNewTheme, themeManager, inversed } = themeState, isInversingOnMount = !!(!themeState.mounted && props.inverse);
-      function getShouldUpdateTheme(manager = themeManager, nextState, prevState = state, forceShouldChange = !1) {
-        let forceUpdate = shouldUpdate == null ? void 0 : shouldUpdate();
-        if (!manager || !forceShouldChange && forceUpdate === !1)
-          return;
-        let next = nextState || manager.getState(props, parentManager);
-        if (forceShouldChange || next && !(forceUpdate !== !0 && !manager.getStateShouldChange(next, prevState)))
-          return next;
-      }
-      if (import_constants4.isServer || ((0, import_react2.useEffect)(() => {
-        if (!themeManager)
-          return;
-        if (props.inverse && !mounted) {
-          setThemeState((prev) => createState({
-            ...prev,
-            mounted: !0
-          }));
-          return;
-        }
-        (isNewTheme || getShouldUpdateTheme(themeManager)) && (activeThemeManagers.add(themeManager), setThemeState(createState));
-        let selfListenerDispose = themeManager.onChangeTheme((_a, _b, forced) => {
-          forced && setThemeState((prev) => createState(prev, !0));
-        }), disposeChangeListener = parentManager == null ? void 0 : parentManager.onChangeTheme(
-          (name, manager, forced) => {
-            let force = forced || (shouldUpdate == null ? void 0 : shouldUpdate()) || props.deopt || props["disable-child-theme"], shouldTryUpdate = force ?? !!(keys != null && keys.length || isNewTheme);
-            process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info(" \u{1F538} onChange", themeManager.id, {
-              force,
-              shouldTryUpdate,
-              props,
-              name,
-              manager,
-              keys
-            }), shouldTryUpdate && setThemeState((prev) => createState(prev, force));
-          },
-          themeManager.id
-        );
-        return () => {
-          selfListenerDispose(), disposeChangeListener == null || disposeChangeListener(), isNewTheme && activeThemeManagers.delete(themeManager);
-        };
-      }, [
-        themeManager,
-        parentManager,
-        isNewTheme,
-        props.componentName,
-        props.inverse,
-        props.name,
-        props.reset,
-        mounted
-      ]), process.env.NODE_ENV === "development" && props.debug !== "profile" && (0, import_react2.useEffect)(() => (globalThis.TamaguiThemeManagers ??= /* @__PURE__ */ new Set(), globalThis.TamaguiThemeManagers.add(themeManager), () => {
-        globalThis.TamaguiThemeManagers.delete(themeManager);
-      }), [themeManager])), isInversingOnMount)
-        return {
-          isNewTheme: !1,
-          inversed: !1,
-          themeManager: parentManager,
-          state: {
-            name: "",
-            ...parentManager == null ? void 0 : parentManager.state,
-            className: ""
-          }
-        };
-      return {
-        state,
-        isNewTheme,
-        inversed,
-        themeManager
-      };
-      function createState(prev, force = !1) {
-        if (prev && (shouldUpdate == null ? void 0 : shouldUpdate()) === !1 && !force)
-          return prev;
-        let themeManager2 = parentManager, state2;
-        if ((0, import_ThemeManager.getHasThemeUpdatingProps)(props)) {
-          let getNewThemeManager = () => new import_ThemeManager.ThemeManager(props, isRoot ? "root" : parentManager);
-          if (prev != null && prev.themeManager) {
-            themeManager2 = prev.themeManager;
-            let forceChange = force || !!(keys != null && keys.length), next = themeManager2.getState(props, parentManager), nextState = getShouldUpdateTheme(
-              themeManager2,
-              next,
-              prev.state,
-              forceChange
-            );
-            nextState ? (state2 = nextState, prev.isNewTheme ? themeManager2.updateState(nextState) : themeManager2 = getNewThemeManager()) : prev.isNewTheme && parentManager && !next && (themeManager2 = parentManager);
-          } else
-            themeManager2 = getNewThemeManager(), state2 = { ...themeManager2.state };
-        }
-        let isNewTheme2 = !!(themeManager2 !== parentManager || props.inverse);
-        isNewTheme2 && registerThemeManager(themeManager2);
-        let mounted2 = props.inverse ? isRoot || (prev == null ? void 0 : prev.mounted) : !0;
-        state2 || (isNewTheme2 ? state2 = themeManager2.state : (state2 = parentManager.state, themeManager2 = parentManager));
-        let wasInversed = prev == null ? void 0 : prev.inversed, inversed2 = isNewTheme2 && state2.scheme !== (parentManager == null ? void 0 : parentManager.state.scheme) ? !0 : wasInversed != null ? !1 : null, response = {
-          themeManager: themeManager2,
-          isNewTheme: isNewTheme2,
-          mounted: mounted2,
-          inversed: inversed2
-        }, shouldReturnPrev = prev && !force && // isEqualShallow uses the second arg as the keys so this should compare without state first...
-        (0, import_createShallowSetState.isEqualShallow)(prev, response) && // ... and then compare just the state, because we make a new state obj but is likely the same
-        (0, import_createShallowSetState.isEqualShallow)(prev.state, state2);
-        if (prev && shouldReturnPrev)
-          return prev;
-        if (response.state = state2, process.env.NODE_ENV === "development" && props.debug && import_constants4.isClient) {
-          console.groupCollapsed(` \u{1F537} ${themeManager2.id} useChangeThemeEffect createState`);
-          let parentState = { ...parentManager == null ? void 0 : parentManager.state }, parentId = parentManager == null ? void 0 : parentManager.id, themeManagerState = { ...themeManager2.state };
-          console.info({
-            props,
-            parentState,
-            parentId,
-            themeManager: themeManager2,
-            prev,
-            response,
-            themeManagerState
-          }), console.groupEnd();
-        }
-        return response;
-      }
-    };
-  }
-});
-
 // ../web/dist/cjs/views/ThemeDebug.native.js
 var require_ThemeDebug_native = __commonJS({
   "../web/dist/cjs/views/ThemeDebug.native.js"(exports2, module2) {