tamagui 1.129.11-1751338700427 → 1.129.12-1751358691172

package/dist/test.native.js

@@ -2542,6 +2542,9 @@ var require_insertStyleRule_native = __commonJS({
       shouldInsertStyleRules: function() {
         return shouldInsertStyleRules;
       },
+      stopAccumulatingRules: function() {
+        return stopAccumulatingRules;
+      },
       updateRules: function() {
         return updateRules;
       }
@@ -2612,52 +2615,61 @@ var require_insertStyleRule_native = __commonJS({
         }
       }
     }
-    function track(id) {
+    function trackInsertedStyle(id) {
       var remove = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, next = (totalSelectorsInserted.get(id) || 0) + (remove ? -1 : 1);
       return totalSelectorsInserted.set(id, next), next;
     }
-    var bailAfterEnv = process.env.TAMAGUI_BAIL_AFTER_SCANNING_X_CSS_RULES, bailAfter = bailAfterEnv ? +bailAfterEnv : 700, sheet = null;
+    var bailAfterEnv = process.env.TAMAGUI_BAIL_AFTER_SCANNING_X_CSS_RULES, bailAfter = bailAfterEnv ? +bailAfterEnv : 700, sheet = null, trackAllRules = !0;
+    function stopAccumulatingRules() {
+      trackAllRules = !0;
+    }
     function updateRules(identifier, rules) {
-      return identifier in allRules ? !1 : (allRules[identifier] = rules.join(" "), identifier.startsWith("_transform-") ? addTransform(identifier, rules[0]) : !0);
+      return trackAllRules && (allRules[identifier] = rules.join(" ")), identifier.startsWith("_transform-") ? addTransform(identifier, rules[0]) : !0;
     }
     var nonce = "";
     function setNonce2(_) {
       nonce = _;
     }
     function insertStyleRules2(rulesToInsert) {
-      if (!sheet && import_constants4.isClient && document.head) {
-        var styleTag = document.createElement("style");
-        nonce && (styleTag.nonce = nonce), sheet = document.head.appendChild(styleTag).sheet;
-      }
-      if (sheet) for (var key in rulesToInsert) {
-        var styleObject = rulesToInsert[key], identifier = styleObject[import_helpers.StyleObjectIdentifier];
-        if (shouldInsertStyleRules(identifier)) {
-          var rules = styleObject[import_helpers.StyleObjectRules];
-          allSelectors[identifier] = rules.join(`
-`), track(identifier), updateRules(identifier, rules);
-          var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
-          try {
-            for (var _iterator = rules[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
-              var rule = _step.value;
-              sheet.insertRule(rule, sheet.cssRules.length);
-            }
-          } catch (err) {
-            _didIteratorError = !0, _iteratorError = err;
-          } finally {
+      if (import_constants4.isClient) {
+        if (!sheet && document.head) {
+          var styleTag = document.createElement("style");
+          nonce && (styleTag.nonce = nonce), sheet = document.head.appendChild(styleTag).sheet;
+        }
+        if (!sheet) {
+          console.warn("[tamagui] no sheet");
+          return;
+        }
+        for (var key in rulesToInsert) {
+          var styleObject = rulesToInsert[key], identifier = styleObject[import_helpers.StyleObjectIdentifier];
+          if (shouldInsertStyleRules(identifier)) {
+            var rules = styleObject[import_helpers.StyleObjectRules];
+            allSelectors[identifier] = rules.join(`
+`), updateRules(identifier, rules), trackInsertedStyle(identifier);
+            var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
             try {
-              !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+              for (var _iterator = rules[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
+                var rule = _step.value;
+                sheet.insertRule(rule, sheet.cssRules.length);
+              }
+            } catch (err) {
+              _didIteratorError = !0, _iteratorError = err;
             } finally {
-              if (_didIteratorError) throw _iteratorError;
+              try {
+                !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+              } finally {
+                if (_didIteratorError) throw _iteratorError;
+              }
             }
           }
         }
       }
     }
-    var minInsertAmt = process.env.TAMAGUI_INSERT_SELECTOR_TRIES ? +process.env.TAMAGUI_INSERT_SELECTOR_TRIES : 1;
+    var maxToInsert = process.env.TAMAGUI_INSERT_SELECTOR_TRIES ? +process.env.TAMAGUI_INSERT_SELECTOR_TRIES : 1;
     function shouldInsertStyleRules(identifier) {
       if (process.env.IS_STATIC === "is_static") return !0;
-      var total = totalSelectorsInserted.get(identifier);
-      return total === void 0 || total < minInsertAmt;
+      var total = totalSelectorsInserted.get(identifier) || 0;
+      return total < maxToInsert;
     }
   }
 });
@@ -6200,7 +6212,7 @@ var require_getSplitStyles_native = __commonJS({
                 try {
                   for (var _iterator2 = pseudoStyles[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = !0) {
                     var psuedoStyle = _step2.value, fullKey = `${psuedoStyle[import_helpers.StyleObjectProperty]}${PROP_SPLIT}${descriptor.name}`;
-                    fullKey in usedKeys || (addStyleToInsertRules(rulesToInsert, psuedoStyle, startedUnhydrated), classNames[fullKey] = psuedoStyle[import_helpers.StyleObjectIdentifier]);
+                    fullKey in usedKeys || (addStyleToInsertRules(rulesToInsert, psuedoStyle), classNames[fullKey] = psuedoStyle[import_helpers.StyleObjectIdentifier]);
                   }
                 } catch (err) {
                   _didIteratorError2 = !0, _iteratorError2 = err;
@@ -6255,7 +6267,7 @@ var require_getSplitStyles_native = __commonJS({
                     var style3 = _step12.value, property = style3[import_helpers.StyleObjectProperty], isSubStyle = property[0] === "$";
                     if (!(isSubStyle && !(0, import_isActivePlatform.isActivePlatform)(property))) {
                       var out = (0, import_createMediaStyle.createMediaStyle)(style3, mediaKeyShort, import_useMedia.mediaQueryConfig, isMedia, !1, priority), subKey = isSubStyle ? style3[2] : "", fullKey1 = `${style3[import_helpers.StyleObjectProperty]}${subKey}${PROP_SPLIT}${mediaKeyShort}${style3[import_helpers.StyleObjectPseudo] || ""}`;
-                      fullKey1 in usedKeys || (addStyleToInsertRules(rulesToInsert, out, startedUnhydrated), classNames[fullKey1] = out[import_helpers.StyleObjectIdentifier]);
+                      fullKey1 in usedKeys || (addStyleToInsertRules(rulesToInsert, out), classNames[fullKey1] = out[import_helpers.StyleObjectIdentifier]);
                     }
                   }
                 } catch (err) {
@@ -6505,7 +6517,6 @@ var require_getSplitStyles_native = __commonJS({
       return res;
     };
     function addStyleToInsertRules(rulesToInsert, styleObject) {
-      var startedUnhydrated = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
       if (0) var identifier;
     }
     var defaultColor = process.env.TAMAGUI_DEFAULT_COLOR || "rgba(0,0,0,0)", animatableDefaults = {
@@ -7792,14 +7803,14 @@ var require_useComponentState_native = __commonJS({
     var import_constants4 = require_index_native6(), import_is_equal_shallow = require_index_native13(), import_use_did_finish_ssr = require_index_native14(), import_react3 = require("react"), import_defaultComponentState = require_defaultComponentState_native(), import_isObj = require_isObj_native(), import_log = require_log_native(), useComponentState = function(props, param, staticConfig, config) {
       var { animationDriver } = param, _animationDriver_usePresence, isHydrated = (0, import_use_did_finish_ssr.useDidFinishSSR)(), needsHydration = !(0, import_use_did_finish_ssr.useIsClientOnly)(), [startedUnhydrated] = (0, import_react3.useState)(needsHydration && !isHydrated), useAnimations = animationDriver == null ? void 0 : animationDriver.useAnimations, stateRef = (0, import_react3.useRef)(void 0);
       stateRef.current || (stateRef.current = {});
-      var hasAnimationProp = !!("animation" in props || props.style && hasAnimatedStyleValue(props.style)), supportsCSSVars = animationDriver == null ? void 0 : animationDriver.supportsCSSVars, curStateRef = stateRef.current;
+      var hasAnimationProp = !!("animation" in props || props.style && hasAnimatedStyleValue(props.style)), supportsCSS = animationDriver == null ? void 0 : animationDriver.supportsCSS, curStateRef = stateRef.current;
       !needsHydration && hasAnimationProp && (curStateRef.hasAnimated = !0);
       var willBeAnimatedClient = function() {
         var next = !!(hasAnimationProp && !staticConfig.isHOC && useAnimations);
         return !!(next || curStateRef.hasAnimated);
       }(), willBeAnimated = !import_constants4.isServer && willBeAnimatedClient;
       willBeAnimated && !curStateRef.hasAnimated && (curStateRef.hasAnimated = !0);
-      var { disableClassName } = props, presence = willBeAnimated && props.animatePresence !== !1 && (animationDriver == null || (_animationDriver_usePresence = animationDriver.usePresence) === null || _animationDriver_usePresence === void 0 ? void 0 : _animationDriver_usePresence.call(animationDriver)) || null, presenceState = presence == null ? void 0 : presence[2], isExiting = (presenceState == null ? void 0 : presenceState.isPresent) === !1, isEntering = (presenceState == null ? void 0 : presenceState.isPresent) === !0 && presenceState.initial !== !1, hasEnterStyle = !!props.enterStyle, hasAnimationThatNeedsHydrate = hasAnimationProp && !isHydrated && ((animationDriver == null ? void 0 : animationDriver.isReactNative) || !supportsCSSVars), hasEnterState = hasEnterStyle || isEntering, shouldEnter = hasEnterState || hasAnimationThatNeedsHydrate || // disableClassName doesnt work server side, only client, so needs hydrate
+      var { disableClassName } = props, presence = willBeAnimated && props.animatePresence !== !1 && (animationDriver == null || (_animationDriver_usePresence = animationDriver.usePresence) === null || _animationDriver_usePresence === void 0 ? void 0 : _animationDriver_usePresence.call(animationDriver)) || null, presenceState = presence == null ? void 0 : presence[2], isExiting = (presenceState == null ? void 0 : presenceState.isPresent) === !1, isEntering = (presenceState == null ? void 0 : presenceState.isPresent) === !0 && presenceState.initial !== !1, hasEnterStyle = !!props.enterStyle, hasAnimationThatNeedsHydrate = hasAnimationProp && !isHydrated && ((animationDriver == null ? void 0 : animationDriver.isReactNative) || !supportsCSS), hasEnterState = hasEnterStyle || isEntering, shouldEnter = hasEnterState || hasAnimationThatNeedsHydrate || // disableClassName doesnt work server side, only client, so needs hydrate
       // this is just for a better ux, supports css variables for light/dark, media queries, etc
       disableClassName, initialState = shouldEnter ? (
         // on the very first render we switch all spring animation drivers to css rendering
@@ -7830,7 +7841,7 @@ var require_useComponentState_native = __commonJS({
       }
       var noClass = !import_constants4.isWeb || !!props.forceStyle || isAnimated && (animationDriver == null ? void 0 : animationDriver.needsWebStyles);
       if (import_constants4.isWeb && (!import_constants4.isServer || isHydrated)) {
-        var isAnimatedAndHydrated = isAnimated && !supportsCSSVars, isClassNameDisabled = !staticConfig.acceptsClassName && (config.disableSSR || !state.unmounted), isDisabledManually = disableClassName && !state.unmounted;
+        var isAnimatedAndHydrated = isAnimated && !supportsCSS, isClassNameDisabled = !staticConfig.acceptsClassName && (config.disableSSR || !state.unmounted), isDisabledManually = disableClassName && !state.unmounted;
         (isAnimatedAndHydrated || isDisabledManually || isClassNameDisabled) && (noClass = !0);
       }
       if (groupName && !curStateRef.group) {
@@ -7890,7 +7901,7 @@ var require_useComponentState_native = __commonJS({
         noClass,
         state,
         stateRef,
-        supportsCSSVars,
+        supportsCSS,
         willBeAnimated,
         willBeAnimatedClient
       };
@@ -8176,7 +8187,7 @@ var require_createComponent_native = __commonJS({
           ...styledContextProps
         } : defaultProps, props = propsIn;
         curDefaultProps && (props = (0, import_mergeProps.mergeProps)(curDefaultProps, propsIn));
-        var componentName2 = props.componentName || staticConfig.componentName, animationDriver = componentContext.animationDriver, useAnimations = animationDriver == null ? void 0 : animationDriver.useAnimations, componentState = (0, import_useComponentState.useComponentState)(props, componentContext, staticConfig, config), { curStateRef, disabled, groupName, hasAnimationProp, hasEnterStyle, isAnimated, isExiting, isHydrated, presence, presenceState, setState, noClass, state, stateRef, supportsCSSVars, willBeAnimated, willBeAnimatedClient, startedUnhydrated } = componentState, setStateShallow = componentState.setStateShallow, hasTextAncestor = !!(import_constants4.isWeb && isText && componentContext.inText), isTaggable = !Component || typeof Component == "string", tagProp = props.tag, element = import_constants4.isWeb && isTaggable && tagProp || Component, BaseTextComponent = BaseText || element || "span", BaseViewComponent = BaseView || element || (hasTextAncestor ? "span" : "div"), elementType = isText ? BaseTextComponent : BaseViewComponent;
+        var componentName2 = props.componentName || staticConfig.componentName, animationDriver = componentContext.animationDriver, useAnimations = animationDriver == null ? void 0 : animationDriver.useAnimations, componentState = (0, import_useComponentState.useComponentState)(props, componentContext, staticConfig, config), { curStateRef, disabled, groupName, hasAnimationProp, hasEnterStyle, isAnimated, isExiting, isHydrated, presence, presenceState, setState, noClass, state, stateRef, supportsCSS, willBeAnimated, willBeAnimatedClient, startedUnhydrated } = componentState, setStateShallow = componentState.setStateShallow, hasTextAncestor = !!(import_constants4.isWeb && isText && componentContext.inText), isTaggable = !Component || typeof Component == "string", tagProp = props.tag, element = import_constants4.isWeb && isTaggable && tagProp || Component, BaseTextComponent = BaseText || element || "span", BaseViewComponent = BaseView || element || (hasTextAncestor ? "span" : "div"), elementType = isText ? BaseTextComponent : BaseViewComponent;
         animationDriver && isAnimated && // this should really be behind another prop as it's not really related to
         // "needsWebStyles" basically with motion we just animate a plain div, but
         // we still have animated.View/Text for Sheet which wants to control
@@ -8202,7 +8213,7 @@ var require_createComponent_native = __commonJS({
         (0, import_createVariable.setDidGetVariableValue)(!1);
         var resolveValues = (
           // if HOC + mounted + has animation prop, resolve as value so it passes non-variable to child
-          isAnimated && !supportsCSSVars || isHOC && state.unmounted == !1 && hasAnimationProp ? "value" : "auto"
+          isAnimated && !supportsCSS || isHOC && state.unmounted == !1 && hasAnimationProp ? "value" : "auto"
         ), styleProps = {
           mediaState: mediaState3,
           noClass,
@@ -8269,7 +8280,7 @@ var require_createComponent_native = __commonJS({
         !isTaggable && props.forceStyle && (viewProps.forceStyle = props.forceStyle), isHOC && _themeProp && (viewProps.theme = _themeProp), tagProp && elementType.acceptTagProp && (viewProps.tag = tagProp);
         var animationStyles, shouldUseAnimation = (
           // if it supports css vars we run it on server too to get matching initial style
-          (supportsCSSVars ? willBeAnimatedClient : willBeAnimated) && useAnimations && !isHOC
+          (supportsCSS ? willBeAnimatedClient : willBeAnimated) && useAnimations && !isHOC
         ), animatedRef;
         if (shouldUseAnimation) {
           var useStyleEmitter = animationDriver != null && animationDriver.avoidReRenders ? function(listener) {
@@ -8318,8 +8329,7 @@ var require_createComponent_native = __commonJS({
           }
           var tm;
           if (state.unmounted) {
-            var _config_animations2, _animationDriver_supportsCSSVars;
-            if (((_animationDriver_supportsCSSVars = animationDriver == null ? void 0 : animationDriver.supportsCSSVars) !== null && _animationDriver_supportsCSSVars !== void 0 ? _animationDriver_supportsCSSVars : !(config == null || (_config_animations2 = config.animations) === null || _config_animations2 === void 0) && _config_animations2.supportsCSSVars) || import_constants4.isAndroid) return tm = setTimeout(function() {
+            if (animationDriver != null && animationDriver.supportsCSS || import_constants4.isAndroid) return tm = setTimeout(function() {
               setStateShallow({
                 unmounted: !1
               });
@@ -10841,7 +10851,7 @@ var require_TamaguiProvider_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(TamaguiProvider_exports);
-    var import_jsx_runtime6 = require("react/jsx-runtime"), import_constants4 = require_index_native6(), import_use_did_finish_ssr = require_index_native14(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_ComponentContext = require_ComponentContext_native(), import_useMedia = require_useMedia_native(), import_ThemeProvider = require_ThemeProvider_native();
+    var import_jsx_runtime6 = require("react/jsx-runtime"), import_constants4 = require_index_native6(), import_use_did_finish_ssr = require_index_native14(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_ComponentContext = require_ComponentContext_native(), import_useMedia = require_useMedia_native(), import_ThemeProvider = require_ThemeProvider_native(), import_insertStyleRule = require_insertStyleRule_native();
     function TamaguiProvider2(param) {
       var { children, disableInjectCSS, config, className, defaultTheme, disableRootThemeClass, reset, themeClassNameOnRoot } = param;
       import_constants4.IS_REACT_19 || import_constants4.isClient && (0, import_constants4.useIsomorphicLayoutEffect)(function() {
@@ -10855,7 +10865,7 @@ var require_TamaguiProvider_native = __commonJS({
         config,
         disableInjectCSS
       ]), (0, import_constants4.useIsomorphicLayoutEffect)(function() {
-        (0, import_useMedia.updateMediaListeners)();
+        (0, import_insertStyleRule.stopAccumulatingRules)(), (0, import_useMedia.updateMediaListeners)();
       }, []);
       var contents = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(UnmountedClassName, {
         children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_ComponentContext.ComponentContext.Provider, {
@@ -17857,7 +17867,7 @@ var require_SheetImplementationCustom_native = __commonJS({
       var parentSheet = import_react3.default.useContext(import_contexts.ParentSheetContext), { animation, animationConfig: animationConfigProp, modal = !1, zIndex = parentSheet.zIndex + 1, moveOnKeyboardChange = !1, unmountChildrenWhenHidden = !1, portalProps, containerComponent: ContainerComponent = import_react3.default.Fragment } = props, state = (0, import_useSheetOpenState.useSheetOpenState)(props), [overlayComponent, setOverlayComponent] = import_react3.default.useState(null), providerProps = (0, import_useSheetProviderProps.useSheetProviderProps)(props, state, {
         onOverlayComponent: setOverlayComponent
       }), { frameSize, setFrameSize, snapPoints, snapPointsMode, hasFit, position, setPosition, scrollBridge, screenSize, setMaxContentSize, maxSnapPoint } = providerProps, { open, controller, isHidden } = state, sheetRef = import_react3.default.useRef(void 0), ref = (0, import_compose_refs.useComposedRefs)(forwardedRef, sheetRef, providerProps.contentRef), { animationDriver } = (0, import_core12.useConfiguration)(), animationConfig = function() {
-        if (animationDriver.supportsCSSVars) return {};
+        if (animationDriver.supportsCSS) return {};
         var [animationProp, animationPropConfig] = animation ? Array.isArray(animation) ? animation : [
           animation
         ] : [];