tamagui 1.123.16 → 1.123.17-1738819995860

package/dist/native.js

@@ -4767,6 +4767,57 @@ var require_defaultComponentState_native = __commonJS({
   }
 });
 
+// ../../core/web/dist/cjs/helpers/getShorthandValue.native.js
+var require_getShorthandValue_native = __commonJS({
+  "../../core/web/dist/cjs/helpers/getShorthandValue.native.js"(exports2, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty, __getOwnPropDesc2 = Object.getOwnPropertyDescriptor, __getOwnPropNames2 = Object.getOwnPropertyNames, __hasOwnProp2 = Object.prototype.hasOwnProperty, __export2 = function(target, all) {
+      for (var name in all) __defProp2(target, name, {
+        get: all[name],
+        enumerable: !0
+      });
+    }, __copyProps2 = function(to, from, except, desc) {
+      var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+      if (from && typeof from == "object" || typeof from == "function") try {
+        for (var _loop = function() {
+          var key = _step.value;
+          !__hasOwnProp2.call(to, key) && key !== except && __defProp2(to, key, {
+            get: function() {
+              return from[key];
+            },
+            enumerable: !(desc = __getOwnPropDesc2(from, key)) || desc.enumerable
+          });
+        }, _iterator = __getOwnPropNames2(from)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) _loop();
+      } catch (err) {
+        _didIteratorError = !0, _iteratorError = err;
+      } finally {
+        try {
+          !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+        } finally {
+          if (_didIteratorError)
+            throw _iteratorError;
+        }
+      }
+      return to;
+    }, __toCommonJS2 = function(mod) {
+      return __copyProps2(__defProp2({}, "__esModule", {
+        value: !0
+      }), mod);
+    }, getShorthandValue_exports = {};
+    __export2(getShorthandValue_exports, {
+      getShorthandValue: function() {
+        return getShorthandValue;
+      }
+    });
+    module2.exports = __toCommonJS2(getShorthandValue_exports);
+    var import_config = require_config_native(), inverseShorthands = null, getShorthandValue = function(props, key) {
+      inverseShorthands || (inverseShorthands = (0, import_config.getConfig)().inverseShorthands);
+      var _props_key;
+      return (_props_key = props[key]) !== null && _props_key !== void 0 ? _props_key : inverseShorthands ? props[inverseShorthands[key]] : void 0;
+    };
+  }
+});
+
 // ../../core/web/dist/cjs/constants/accessibilityDirectMap.native.js
 var require_accessibilityDirectMap_native = __commonJS({
   "../../core/web/dist/cjs/constants/accessibilityDirectMap.native.js"(exports2, module2) {
@@ -8623,7 +8674,7 @@ var require_createComponent_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(createComponent_exports);
-    var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native12(), import_constants4 = require_index_native6(), import_helpers = require_index_native7(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_constants22 = require_constants_native2(), import_isDevTools = require_isDevTools_native(), import_ComponentContext = require_ComponentContext_native(), import_createVariable = require_createVariable_native(), import_defaultComponentState = require_defaultComponentState_native(), import_getSplitStyles = require_getSplitStyles_native(), import_log = require_log_native(), import_mergeProps = require_mergeProps_native(), import_setElementProps = require_setElementProps_native(), import_subscribeToContextGroup = require_subscribeToContextGroup_native(), import_themeable = require_themeable_native(), import_wrapStyleTags = require_wrapStyleTags_native(), import_useComponentState = require_useComponentState_native(), import_useMedia = require_useMedia_native(), import_useTheme = require_useTheme_native(), import_setupHooks = require_setupHooks_native(), import_Slot = require_Slot_native(), import_Theme = require_Theme_native(), import_ThemeDebug = require_ThemeDebug_native(), time2, debugKeyListeners, startVisualizer, componentSetStates = /* @__PURE__ */ new Set();
+    var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native12(), import_constants4 = require_index_native6(), import_helpers = require_index_native7(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_constants22 = require_constants_native2(), import_isDevTools = require_isDevTools_native(), import_ComponentContext = require_ComponentContext_native(), import_createVariable = require_createVariable_native(), import_defaultComponentState = require_defaultComponentState_native(), import_getShorthandValue = require_getShorthandValue_native(), import_getSplitStyles = require_getSplitStyles_native(), import_log = require_log_native(), import_mergeProps = require_mergeProps_native(), import_setElementProps = require_setElementProps_native(), import_subscribeToContextGroup = require_subscribeToContextGroup_native(), import_themeable = require_themeable_native(), import_wrapStyleTags = require_wrapStyleTags_native(), import_useComponentState = require_useComponentState_native(), import_useMedia = require_useMedia_native(), import_useTheme = require_useTheme_native(), import_setupHooks = require_setupHooks_native(), import_Slot = require_Slot_native(), import_Theme = require_Theme_native(), import_ThemeDebug = require_ThemeDebug_native(), time2, debugKeyListeners, startVisualizer, componentSetStates = /* @__PURE__ */ new Set();
     typeof document < "u" && (cancelTouches = function() {
       componentSetStates.forEach(function(setState) {
         return setState(function(prev) {
@@ -8702,9 +8753,8 @@ var require_createComponent_native = __commonJS({
         var componentContext = import_react3.default.useContext(import_ComponentContext.ComponentContext), styledContextProps, overriddenContextProps, contextValue, { context, isReactNative } = staticConfig;
         if (context && (contextValue = import_react3.default.useContext(context), contextValue)) {
           process.env.NODE_ENV === "development" && (defaultProps == null ? void 0 : defaultProps.debug) === "verbose" && (0, import_log.log)(" \u{1F447} contextValue", contextValue);
-          var shorthands = config == null ? void 0 : config.shorthands;
           for (var key in context.props) {
-            var propVal = propsIn[key] || propsIn[shorthands == null ? void 0 : shorthands[propsIn]];
+            var propVal = (0, import_getShorthandValue.getShorthandValue)(propsIn, key);
             if (propVal === void 0) {
               var val = contextValue == null ? void 0 : contextValue[key];
               val !== void 0 && (styledContextProps || (styledContextProps = {}), styledContextProps[key] = val);
@@ -11067,9 +11117,12 @@ var require_useProps_native = __commonJS({
         componentName: staticConfig.componentName,
         name: "theme" in props ? props.theme : void 0,
         inverse: "themeInverse" in props ? props.themeInverse : void 0
-      }), componentContext = import_react3.default.useContext(import_ComponentContext.ComponentContext), { state, disabled, setStateShallow } = (0, import_useComponentState.useComponentState)(props, componentContext, staticConfig, (0, import_config.getConfig)()), mediaState3 = (0, import_useMedia.useMedia)(), splitStyles = (0, import_getSplitStyles.useSplitStyles)(props, staticConfig, theme, ((_themeState_state = themeState.state) === null || _themeState_state === void 0 ? void 0 : _themeState_state.name) || "", state, {
+      }), componentContext = import_react3.default.useContext(import_ComponentContext.ComponentContext), { state, disabled, setStateShallow } = (0, import_useComponentState.useComponentState)(props, componentContext, staticConfig, (0, import_config.getConfig)()), mediaStateNow = opts != null && opts.noMedia ? (
+        // not safe to use mediaState but really marginal to hit this
+        import_useMedia.mediaState
+      ) : (0, import_useMedia.useMedia)(), splitStyles = (0, import_getSplitStyles.useSplitStyles)(props, staticConfig, theme, ((_themeState_state = themeState.state) === null || _themeState_state === void 0 ? void 0 : _themeState_state.name) || "", state, {
         isAnimated: !1,
-        mediaState: mediaState3,
+        mediaState: mediaStateNow,
         noSkip: !0,
         noMergeStyle: !0,
         noClass: !0,
@@ -11105,7 +11158,7 @@ var require_useProps_native = __commonJS({
         splitStyles.viewProps,
         splitStyles.style || {},
         theme,
-        mediaState3
+        import_useMedia.mediaState
       ];
     }
   }
@@ -11672,6 +11725,7 @@ var require_index_native14 = __commonJS({
     __reExport2(index_exports2, require_ComponentContext_native(), module2.exports);
     __reExport2(index_exports2, require_withStableStyle_native(), module2.exports);
     __reExport2(index_exports2, require_createMediaStyle_native(), module2.exports);
+    __reExport2(index_exports2, require_getShorthandValue_native(), module2.exports);
     __reExport2(index_exports2, require_createShallowSetState_native(), module2.exports);
     __reExport2(index_exports2, require_createStyledContext_native(), module2.exports);
     __reExport2(index_exports2, require_expandStyles_native(), module2.exports);
@@ -29673,7 +29727,7 @@ var require_createSwitch_native = __commonJS({
       var { disableActiveTheme, Frame = import_Switch.SwitchFrame, Thumb = import_Switch.SwitchThumb } = createProps;
       process.env.NODE_ENV === "development" && (Frame !== import_Switch.SwitchFrame && Frame.staticConfig.context && Frame.staticConfig.context !== import_StyledContext.SwitchStyledContext || Thumb !== import_Switch.SwitchThumb && Thumb.staticConfig.context && Thumb.staticConfig.context !== import_StyledContext.SwitchStyledContext) && console.warn("Warning: createSwitch() needs to control context to pass checked state from Frame to Thumb, any custom context passed will be overridden."), Frame.staticConfig.context = import_StyledContext.SwitchStyledContext, Thumb.staticConfig.context = import_StyledContext.SwitchStyledContext;
       var SwitchThumbComponent = Thumb.styleable(function(props, forwardedRef) {
-        var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React4.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = import_StyledContext.SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size4 = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React4.useRef(checked).current, [thumbWidth, setThumbWidth] = React4.useState(0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
+        var { size: sizeProp, unstyled: unstyledProp, nativeID, ...thumbProps } = props, context = React4.useContext(SwitchContext), { checked, disabled, frameWidth } = context, styledContext = import_StyledContext.SwitchStyledContext.useStyledContext(), { unstyled: unstyledContext, size: sizeContext } = styledContext, _ref, unstyled = process.env.TAMAGUI_HEADLESS === "1" ? !0 : (_ref = unstyledProp ?? unstyledContext) !== null && _ref !== void 0 ? _ref : !1, _ref1, size4 = (_ref1 = sizeProp ?? sizeContext) !== null && _ref1 !== void 0 ? _ref1 : "$true", initialChecked = React4.useRef(checked).current, initialWidth = (0, import_core12.getVariableValue)(props.width, "size"), [thumbWidth, setThumbWidth] = React4.useState(typeof initialWidth == "number" ? initialWidth : 0), distance = frameWidth - thumbWidth, x = initialChecked ? checked ? 0 : -distance : checked ? distance : 0;
         return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Thumb, {
           ref: forwardedRef,
           unstyled,
@@ -29686,7 +29740,8 @@ var require_createSwitch_native = __commonJS({
           alignSelf: initialChecked ? "flex-end" : "flex-start",
           x,
           onLayout: (0, import_core12.composeEventHandlers)(props.onLayout, function(e) {
-            return setThumbWidth(e.nativeEvent.layout.width);
+            var next = e.nativeEvent.layout.width;
+            next !== thumbWidth && setThumbWidth(next);
           }),
           // expected variants
           checked,
@@ -29699,7 +29754,12 @@ var require_createSwitch_native = __commonJS({
           defaultProp: defaultChecked || !1,
           onChange: onCheckedChange,
           transition: !0
-        }), styledContext = React4.useContext(import_StyledContext.SwitchStyledContext.context), [frameWidth, setFrameWidth] = React4.useState(0), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
+        }), styledContext = React4.useContext(import_StyledContext.SwitchStyledContext.context), estimatedInitialWidth = 0, estWidth = (0, import_core12.getVariableValue)((0, import_core12.getShorthandValue)(props, "width"), "size");
+        if (estWidth) {
+          var _getShorthandValue, _ref, estPad = (_ref = (_getShorthandValue = (0, import_core12.getShorthandValue)(props, "paddingHorizontal")) !== null && _getShorthandValue !== void 0 ? _getShorthandValue : (0, import_core12.getShorthandValue)(props, "padding")) !== null && _ref !== void 0 ? _ref : 0, _getShorthandValue1, _ref1, estLeftPad = (_ref1 = (_getShorthandValue1 = (0, import_core12.getShorthandValue)(props, "paddingLeft")) !== null && _getShorthandValue1 !== void 0 ? _getShorthandValue1 : estPad) !== null && _ref1 !== void 0 ? _ref1 : 0, _getShorthandValue2, _ref2, estRightPad = (_ref2 = (_getShorthandValue2 = (0, import_core12.getShorthandValue)(props, "paddingRight")) !== null && _getShorthandValue2 !== void 0 ? _getShorthandValue2 : estPad) !== null && _ref2 !== void 0 ? _ref2 : 0;
+          estimatedInitialWidth = estWidth - (estLeftPad ? (0, import_core12.getVariableValue)(estLeftPad, "size") : 0) - (estRightPad ? (0, import_core12.getVariableValue)(estRightPad, "size") : 0);
+        }
+        var [frameWidth, setFrameInnerWidth] = React4.useState(estimatedInitialWidth), { switchProps, bubbleInput, switchRef } = (0, import_switch_headless.useSwitch)(
           // @ts-ignore
           props,
           [
@@ -29738,11 +29798,10 @@ var require_createSwitch_native = __commonJS({
           checked,
           disabled,
           frameWidth
-        ]), handleLayout = React4.useCallback(function(e) {
-          setFrameWidth(e.nativeEvent.layout.width);
-        }, [
-          setFrameWidth
-        ]), _styledContext_unstyled, _ref, unstyled = (_ref = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref !== void 0 ? _ref : !1, _styledContext_size, _ref1;
+        ]), handleLayout = function(e) {
+          var next = e.nativeEvent.layout.width;
+          next !== frameWidth && setFrameInnerWidth(next);
+        }, _styledContext_unstyled, _ref3, unstyled = (_ref3 = (_styledContext_unstyled = styledContext.unstyled) !== null && _styledContext_unstyled !== void 0 ? _styledContext_unstyled : props.unstyled) !== null && _ref3 !== void 0 ? _ref3 : !1, _styledContext_size, _ref4;
         return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(SwitchContext.Provider, {
           value,
           children: [
@@ -29753,7 +29812,7 @@ var require_createSwitch_native = __commonJS({
                 type: "button"
               },
               ...!unstyled && {
-                size: (_ref1 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref1 !== void 0 ? _ref1 : "$true"
+                size: (_ref4 = (_styledContext_size = styledContext.size) !== null && _styledContext_size !== void 0 ? _styledContext_size : props.size) !== null && _ref4 !== void 0 ? _ref4 : "$true"
               },
               unstyled,
               ...props,
@@ -29768,7 +29827,7 @@ var require_createSwitch_native = __commonJS({
               children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_native4.View, {
                 style: measureContainerStyle,
                 onLayout: handleLayout,
-                children: props.children
+                children: frameWidth ? props.children : null
               })
             }),
             bubbleInput