tamagui 1.124.4 → 1.124.6

package/dist/native.js

@@ -2012,13 +2012,11 @@ var require_useControllableState_native = __commonJS({
     };
     function useControllableState(param) {
       var { prop, defaultProp, onChange, strategy = "prop-wins", preventUpdate, transition } = param, [state, setState] = React4.useState(prop ?? defaultProp), previous = React4.useRef(state), propWins = strategy === "prop-wins" && prop !== void 0, value = propWins ? prop : state, onChangeCb = (0, import_use_event.useEvent)(onChange || idFn), transitionFn = transition ? import_start_transition.startTransition : emptyCallbackFn;
-      React4.useEffect(function() {
-        prop !== void 0 && (previous.current = prop, transitionFn(function() {
-          setState(prop);
-        }));
-      }, [
-        prop
-      ]), React4.useEffect(function() {
+      prop !== state && transitionFn(function() {
+        setState(function(prev) {
+          if (prev !== prop) return previous.current = prop, prop;
+        });
+      }), React4.useEffect(function() {
         propWins || state !== previous.current && (previous.current = state, onChangeCb(state));
       }, [
         onChangeCb,
@@ -7308,20 +7306,23 @@ var require_useThemeState_native = __commonJS({
       hasThemeUpdatingProps: function() {
         return hasThemeUpdatingProps;
       },
+      keysToId: function() {
+        return keysToId;
+      },
       useThemeState: function() {
         return useThemeState;
       }
     });
     module2.exports = __toCommonJS2(useThemeState_exports);
-    var import_constants4 = require_index_native6(), import_react3 = require("react"), import_config = require_config_native(), ThemeStateContext = (0, import_react3.createContext)(""), allListeners = /* @__PURE__ */ new Map(), listenersByParent = {}, states = /* @__PURE__ */ new Map(), forceUpdateThemes2 = function() {
-      allListeners.forEach(function(cb) {
+    var import_constants4 = require_index_native6(), import_react3 = require("react"), import_config = require_config_native(), ThemeStateContext = (0, import_react3.createContext)(""), keysToId = /* @__PURE__ */ new WeakMap(), allListeners = /* @__PURE__ */ new Map(), listenersByParent = {}, hasRenderedOnce = /* @__PURE__ */ new WeakMap(), pendingUpdate = /* @__PURE__ */ new Map(), states = /* @__PURE__ */ new Map(), shouldForce = !1, forceUpdateThemes2 = function() {
+      cacheVersion++, shouldForce = !0, allListeners.forEach(function(cb) {
         return cb();
       });
     }, getThemeState = function(id) {
       return states.get(id);
-    }, rootThemeState = null, getRootThemeState = function() {
+    }, cache = /* @__PURE__ */ new Map(), cacheVersion = 0, themes = null, rootThemeState = null, getRootThemeState = function() {
       return rootThemeState;
-    }, HasRenderedOnce = /* @__PURE__ */ new WeakMap(), useThemeState = function(props) {
+    }, useThemeState = function(props) {
       var isRoot = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, keys = arguments.length > 2 ? arguments[2] : void 0, { disable } = props, parentId = (0, import_react3.useContext)(ThemeStateContext);
       if (disable) return states.get(parentId) || {
         id: "",
@@ -7331,24 +7332,28 @@ var require_useThemeState_native = __commonJS({
       };
       var id = (0, import_react3.useId)(), subscribe = (0, import_react3.useCallback)(function(cb) {
         var _listenersByParent, _parentId;
-        return (_listenersByParent = listenersByParent)[_parentId = parentId] || (_listenersByParent[_parentId] = /* @__PURE__ */ new Set()), listenersByParent[parentId].add(id), allListeners.set(id, cb), function() {
+        return (_listenersByParent = listenersByParent)[_parentId = parentId] || (_listenersByParent[_parentId] = /* @__PURE__ */ new Set()), listenersByParent[parentId].add(id), allListeners.set(id, function() {
+          pendingUpdate.set(id, shouldForce ? "force" : !0), cb();
+        }), function() {
           allListeners.delete(id), listenersByParent[parentId].delete(id);
         };
       }, [
         id,
-        parentId,
-        keys
+        parentId
       ]), propsKey = getPropsKey(props), getSnapshot = function() {
-        return getSnapshotFrom(props, propsKey, isRoot, id, parentId, keys);
+        var _keys_current, _props_needsUpdate, last = states.get(id), needsUpdate = props.name === "light" || props.name === "dark" ? !0 : hasRenderedOnce.get(keys) ? !(keys == null || (_keys_current = keys.current) === null || _keys_current === void 0) && _keys_current.size ? !0 : (_props_needsUpdate = props.needsUpdate) === null || _props_needsUpdate === void 0 ? void 0 : _props_needsUpdate.call(props) : !0, parentState = states.get(parentId), cacheKey = `${cacheVersion}${id}${propsKey}${(parentState == null ? void 0 : parentState.name) || ""}${isRoot}`;
+        if (!needsUpdate && cache.has(cacheKey)) return cache.get(cacheKey);
+        var next = getSnapshotFrom(last, props, propsKey, isRoot, id, parentId, needsUpdate, pendingUpdate.get(id));
+        return last !== next && (pendingUpdate.delete(id), states.set(id, next), cache.set(id, next), process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && console.warn(` \xB7 useTheme(${id}) UPDATE from`, last, "to", next)), next;
       };
       process.env.NODE_ENV === "development" && globalThis.time && globalThis.time`theme-prep-uses`;
       var state = (0, import_react3.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
       return (0, import_constants4.useIsomorphicLayoutEffect)(function() {
+        if (!hasRenderedOnce.get(keys)) {
+          hasRenderedOnce.set(keys, !0);
+          return;
+        }
         if (propsKey) {
-          if (!HasRenderedOnce.has(keys)) {
-            HasRenderedOnce.set(keys, !0);
-            return;
-          }
           if (process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile") {
             var _states_get;
             console.warn(` \xB7 useTheme(${id}) scheduleUpdate`, propsKey, (_states_get = states.get(id)) === null || _states_get === void 0 ? void 0 : _states_get.name);
@@ -7358,29 +7363,30 @@ var require_useThemeState_native = __commonJS({
       }, [
         keys,
         propsKey
-      ]), process.env.NODE_ENV === "development" && props.debug && (console.groupCollapsed(` \xB7 useTheme(${id}) =>`, state.name, id === state.id ? "\u{1F389}" : "\u23ED\uFE0F"), console.info({
-        state,
-        parentId,
-        props,
-        propsKey,
-        id,
-        parentState: states.get(parentId)
-      }), console.groupEnd()), state.id === id ? {
+      ]), state.id === id ? {
         ...state,
         isNew: !0
       } : state;
-    }, themes = null, getSnapshotFrom = function(props, propsKey) {
-      var isRoot = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1, id = arguments.length > 3 ? arguments[3] : void 0, parentId = arguments.length > 4 ? arguments[4] : void 0, keys = arguments.length > 5 ? arguments[5] : void 0, _keys_current, _props_needsUpdate, needsUpdate = (keys == null || (_keys_current = keys.current) === null || _keys_current === void 0 ? void 0 : _keys_current.size) || ((_props_needsUpdate = props.needsUpdate) === null || _props_needsUpdate === void 0 ? void 0 : _props_needsUpdate.call(props)), parentState = states.get(parentId);
+    }, getSnapshotFrom = function(lastState, props, propsKey) {
+      var isRoot = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : !1, id = arguments.length > 4 ? arguments[4] : void 0, parentId = arguments.length > 5 ? arguments[5] : void 0, needsUpdate = arguments.length > 6 ? arguments[6] : void 0, pendingUpdate2 = arguments.length > 7 ? arguments[7] : void 0, parentState = states.get(parentId);
       themes || (themes = (0, import_config.getConfig)().themes);
-      var lastState = states.get(id), name = propsKey ? getNewThemeName(parentState == null ? void 0 : parentState.name, props, !!needsUpdate) : null;
+      var name = !propsKey && pendingUpdate2 !== "force" ? null : getNewThemeName(parentState == null ? void 0 : parentState.name, props, pendingUpdate2 === "force" ? !0 : !!needsUpdate), isSameAsParent = !!(!name && propsKey);
       if (process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile") {
         var message = ` \xB7 useTheme(${id}) snapshot ${name}, parent ${parentState == null ? void 0 : parentState.id} needsUpdate ${needsUpdate}`;
         console.info(message);
       }
-      var isSameAsParent = !name && propsKey;
       if (parentState && isSameAsParent) return parentState;
-      if (!name) return lastState && !needsUpdate ? lastState : (states.set(id, parentState), parentState);
-      if (lastState && lastState.name === name) return lastState;
+      if (!name) {
+        var next = lastState ?? parentState;
+        if (needsUpdate && pendingUpdate2) {
+          var updated = {
+            ...parentState || lastState
+          };
+          return updated;
+        }
+        return next;
+      }
+      if (pendingUpdate2 !== "force" && lastState && lastState.name === name) return lastState;
       var scheme = getScheme(name), _parentState_inverses, parentInverses = (_parentState_inverses = parentState == null ? void 0 : parentState.inverses) !== null && _parentState_inverses !== void 0 ? _parentState_inverses : 0, isInverse = parentState && scheme !== parentState.scheme, inverses = parentInverses + (isInverse ? 1 : 0), nextState = {
         id,
         name,
@@ -7391,7 +7397,7 @@ var require_useThemeState_native = __commonJS({
         inverses,
         isInverse
       };
-      return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && (console.groupCollapsed(` \xB7 useTheme(${id}) \u23ED\uFE0F ${name}`), console.info("state", nextState), console.groupEnd()), states.set(id, nextState), isRoot && (rootThemeState = nextState), nextState;
+      return process.env.NODE_ENV === "development" && props.debug && props.debug !== "profile" && (console.groupCollapsed(` \xB7 useTheme(${id}) \u23ED\uFE0F2 ${name}`), console.info("state", nextState), console.groupEnd()), isRoot && (rootThemeState = nextState), pendingUpdate2 !== "force" && lastState && !needsUpdate ? (Object.assign(lastState, nextState), lastState) : nextState;
     };
     function scheduleUpdate(id) {
       for (var queue = [
@@ -7429,7 +7435,7 @@ var require_useThemeState_native = __commonJS({
       return validSchemes[name.split("_")[0]];
     }
     function getNewThemeName() {
-      var parentName = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", { name, reset, componentName, inverse } = arguments.length > 1 ? arguments[1] : void 0, forceUpdate = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
+      var parentName = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "", { name, reset, componentName, inverse, debug } = arguments.length > 1 ? arguments[1] : void 0, forceUpdate = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
       if (name && reset) throw new Error(process.env.NODE_ENV === "production" ? "\u274C004" : "Cannot reset and set a new name at the same time.");
       if (reset) {
         if (!parentName) throw new Error("\u203C\uFE0F");
@@ -7463,7 +7469,8 @@ var require_useThemeState_native = __commonJS({
         }
         if (found) break;
       }
-      if (found && inverse) {
+      if (inverse) {
+        found || (found = parentName);
         var scheme = found.split("_")[0];
         found = found.replace(new RegExp(`^${scheme}`), scheme === "light" ? "dark" : "light");
       }
@@ -7574,41 +7581,45 @@ var require_getThemeProxied_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(getThemeProxied_exports);
-    var import_constants4 = require_index_native6(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_doesRootSchemeMatchSystem = require_doesRootSchemeMatchSystem_native(), cache = /* @__PURE__ */ new Map(), curKeys, curProps, emptyObject = {};
-    function getThemeProxied(_props, state, _keys) {
-      var theme = state == null ? void 0 : state.theme;
-      if (!theme) return emptyObject;
-      if (curKeys = _keys, curProps = _props, cache.has(theme)) {
-        var proxied = cache.get(theme);
+    var import_constants4 = require_index_native6(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_doesRootSchemeMatchSystem = require_doesRootSchemeMatchSystem_native(), import_useThemeState = require_useThemeState_native(), cache = /* @__PURE__ */ new Map(), curKeys, curProps, curState, emptyObject = {};
+    function getThemeProxied(_props, _state, _keys) {
+      if (!(_state != null && _state.theme)) return emptyObject;
+      if (curKeys = _keys, curProps = _props, curState = _state, cache.has(curState.theme)) {
+        var proxied = cache.get(curState.theme);
         return proxied;
       }
-      var { name, scheme } = state, config = (0, import_config.getConfig)();
+      var config = (0, import_config.getConfig)();
       function track(key) {
-        curKeys && (curKeys.current || (curKeys.current = /* @__PURE__ */ new Set()), curKeys.current.add(key), process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key: ${key}`));
+        if (curKeys && (curKeys.current || (curKeys.current = /* @__PURE__ */ new Set()), curKeys.current.add(key), process.env.NODE_ENV === "development" && curProps.debug)) {
+          var _globalThis_states, realId = import_useThemeState.keysToId.get(curKeys);
+          console.info(` \u{1F3A8} useTheme(${realId}) tracking new key: ${key}`, curKeys, (_globalThis_states = globalThis.states) === null || _globalThis_states === void 0 ? void 0 : _globalThis_states.get(realId + 1));
+        }
       }
-      var proxied1 = Object.fromEntries(Object.entries(theme).flatMap(function(param) {
+      var proxied1 = Object.fromEntries(Object.entries(_state.theme).flatMap(function(param) {
         var [key, value] = param, proxied2 = {
           ...value,
           get val() {
             return globalThis.tamaguiAvoidTracking || track(key), value.val;
           },
           get(platform2) {
-            var outVal = (0, import_createVariable.getVariable)(value), shouldOptimize = scheme && platform2 !== "web" && import_constants4.isIos && !curProps.deopt && (0, import_config.getSetting)("fastSchemeChange") && state.inverses === 0 && (0, import_doesRootSchemeMatchSystem.doesRootSchemeMatchSystem)();
-            if (shouldOptimize) {
-              var _config_themes_name, _config_themes_oppositeName, oppositeScheme = scheme === "dark" ? "light" : "dark", oppositeName = name.replace(scheme, oppositeScheme), color = (0, import_createVariable.getVariable)((_config_themes_name = config.themes[name]) === null || _config_themes_name === void 0 ? void 0 : _config_themes_name[key]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[key]), dynamicVal = {
-                dynamic: {
-                  [scheme]: color,
-                  [oppositeScheme]: oppositeColor
-                }
-              };
-              return dynamicVal;
-            }
-            return process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key because of: 
+            if (curState) {
+              var outVal = (0, import_createVariable.getVariable)(value), { name, scheme, inverses } = curState, shouldOptimize = scheme && platform2 !== "web" && import_constants4.isIos && !curProps.deopt && (0, import_config.getSetting)("fastSchemeChange") && inverses === 0 && (0, import_doesRootSchemeMatchSystem.doesRootSchemeMatchSystem)();
+              if (shouldOptimize) {
+                var _config_themes_name, _config_themes_oppositeName, oppositeScheme = scheme === "dark" ? "light" : "dark", oppositeName = name.replace(scheme, oppositeScheme), color = (0, import_createVariable.getVariable)((_config_themes_name = config.themes[name]) === null || _config_themes_name === void 0 ? void 0 : _config_themes_name[key]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[key]), dynamicVal = {
+                  dynamic: {
+                    [scheme]: color,
+                    [oppositeScheme]: oppositeColor
+                  }
+                };
+                return dynamicVal;
+              }
+              return process.env.NODE_ENV === "development" && curProps.debug && console.info(` \u{1F3A8} useTheme() tracking new key because of: 
                 not web: ${platform2 !== "web"}
                 isIOS: ${import_constants4.isIos}
                 deopt: ${curProps.deopt}
                 fastScheme: ${(0, import_config.getSetting)("fastSchemeChange")}
               `), track(key), outVal;
+            }
           }
         };
         return [
@@ -7622,7 +7633,7 @@ var require_getThemeProxied_native = __commonJS({
           ]
         ];
       }));
-      return cache.set(theme, proxied1), proxied1;
+      return cache.set(_state.theme, proxied1), proxied1;
     }
   }
 });
@@ -30002,8 +30013,9 @@ var require_mutateTheme_native = __commonJS({
       return (0, import_start_transition.startTransition)(function() {
         for (var themeName in allThemesProxied) {
           var theme2 = allThemesProxied[themeName];
-          updateThemeConfig(themeName, theme2), updateThemeStates(themeName, theme2);
+          updateThemeConfig(themeName, theme2);
         }
+        updateThemeStates();
       }), {
         themes: allThemesProxied,
         themesRaw: allThemesRaw,
@@ -30033,13 +30045,13 @@ var require_mutateTheme_native = __commonJS({
       };
       return props.avoidUpdate || (insertCSS && (response.cssRules = insertThemeCSS({
         [themeName]: theme1
-      })), updateThemeConfig(themeName, themeProxied), updateThemeStates(themeName, themeProxied)), response;
+      })), updateThemeConfig(themeName, themeProxied), updateThemeStates()), response;
     }
     function updateThemeConfig(themeName, theme) {
       var config = (0, import_web.getConfig)();
       config.themes[themeName] = theme, (0, import_web.updateConfig)("themes", config.themes);
     }
-    function updateThemeStates(themeName, theme) {
+    function updateThemeStates() {
       (0, import_web.forceUpdateThemes)();
     }
     function insertThemeCSS(themes) {