tamagui 1.132.24 → 1.133.0

package/dist/native.js

@@ -2993,6 +2993,9 @@ var require_useMedia_native = __commonJS({
       getMediaImportanceIfMoreImportant: function() {
         return getMediaImportanceIfMoreImportant;
       },
+      getMediaKey: function() {
+        return getMediaKey;
+      },
       getMediaKeyImportance: function() {
         return getMediaKeyImportance;
       },
@@ -3046,12 +3049,12 @@ var require_useMedia_native = __commonJS({
     ), mediaQueryConfig3 = {}, getMedia3 = function() {
       return mediaState3;
     }, mediaKeys = /* @__PURE__ */ new Set(), mediaKeyRegex = /\$(platform|theme|group)-/, isMediaKey = function(key) {
+      return key[0] !== "$" ? !1 : !!(mediaKeys.has(key) || mediaKeyRegex.test(key));
+    }, getMediaKey = function(key) {
+      if (key[0] !== "$") return !1;
       if (mediaKeys.has(key)) return !0;
-      if (key[0] === "$") {
-        var match = key.match(mediaKeyRegex);
-        if (match) return match[1];
-      }
-      return !1;
+      var match = key.match(mediaKeyRegex);
+      return match ? match[1] : !1;
     }, initState, defaultMediaImportance = Object.keys(import_pseudoDescriptors.pseudoDescriptors).length, mediaKeysOrdered, getMediaKeyImportance = function(key) {
       if (process.env.NODE_ENV === "development" && key[0] === "$") throw new Error("use short key");
       var conf = (0, import_config.getConfig)();
@@ -3585,6 +3588,86 @@ var require_isDevTools_native = __commonJS({
   }
 });
 
+// ../../core/web/dist/cjs/helpers/mergeProps.native.js
+var require_mergeProps_native = __commonJS({
+  "../../core/web/dist/cjs/helpers/mergeProps.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);
+    }, mergeProps_exports = {};
+    __export2(mergeProps_exports, {
+      mergeComponentProps: function() {
+        return mergeComponentProps;
+      },
+      mergeProps: function() {
+        return mergeProps;
+      }
+    });
+    module2.exports = __toCommonJS2(mergeProps_exports);
+    var import_pseudoDescriptors = require_pseudoDescriptors_native(), mergeProps = function(defaultProps, props) {
+      var out = {};
+      for (var key in defaultProps) key in props || (out[key] = defaultProps[key]);
+      for (var key1 in props) mergeProp(out, defaultProps, props, key1);
+      return out;
+    }, mergeComponentProps = function(defaultProps, contextProps, props) {
+      var overriddenContext = null;
+      if (!defaultProps && !contextProps) return [
+        props,
+        overriddenContext
+      ];
+      if (defaultProps && !contextProps) return [
+        mergeProps(defaultProps, props),
+        overriddenContext
+      ];
+      var out = {};
+      for (var key in defaultProps) key in props || (out[key] = defaultProps[key]);
+      for (var key1 in contextProps) key1 in props || (out[key1] = contextProps[key1]);
+      for (var key2 in props) mergeProp(out, defaultProps, props, key2), contextProps && key2 in contextProps && (overriddenContext || (overriddenContext = {}), overriddenContext[key2] = props[key2]);
+      return [
+        out,
+        overriddenContext
+      ];
+    };
+    function mergeProp(out, defaultProps, props, key) {
+      var val = props[key];
+      defaultProps && key in defaultProps && (key in import_pseudoDescriptors.pseudoDescriptors || key[0] === "$") && (val = {
+        ...defaultProps[key],
+        ...val
+      }), out[key] = val;
+    }
+  }
+});
+
 // ../../core/web/dist/cjs/helpers/objectIdentityKey.native.js
 var require_objectIdentityKey_native = __commonJS({
   "../../core/web/dist/cjs/helpers/objectIdentityKey.native.js"(exports2, module2) {
@@ -3701,7 +3784,7 @@ var require_createStyledContext_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(createStyledContext_exports);
-    var import_jsx_runtime6 = require("react/jsx-runtime"), import_react3 = __toESM2(require("react")), import_objectIdentityKey = require_objectIdentityKey_native(), createReactContext = import_react3.default[Math.random(), "createContext"];
+    var import_jsx_runtime6 = require("react/jsx-runtime"), import_react3 = __toESM2(require("react")), import_mergeProps = require_mergeProps_native(), import_objectIdentityKey = require_objectIdentityKey_native(), createReactContext = import_react3.default[Math.random(), "createContext"];
     function createStyledContext2(defaultValues) {
       var namespace = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "", OGContext = createReactContext(defaultValues), OGProvider2 = OGContext.Provider, Context = OGContext, scopedContexts = /* @__PURE__ */ new Map(), LastScopeInNamespace = createReactContext(namespace);
       function getOrCreateScopedContext(scope) {
@@ -3711,18 +3794,20 @@ var require_createStyledContext_native = __commonJS({
       var getNamespacedScope = function(scope) {
         return namespace ? `${namespace}--${scope}` : scope;
       }, Provider = function(param) {
-        var { children, scope: scopeIn, ...values } = param, scope = getNamespacedScope(scopeIn), next = import_react3.default.useMemo(function() {
-          return {
-            // this ! is a workaround for ts error
-            ...defaultValues,
-            ...values
-          };
+        var {
+          children,
+          scope: scopeIn,
+          // performance: avoid creating objects
+          __disableMergeDefaultValues,
+          ...values
+        } = param, scope = getNamespacedScope(scopeIn), next = import_react3.default.useMemo(function() {
+          return __disableMergeDefaultValues ? values : (0, import_mergeProps.mergeProps)(defaultValues, values);
         }, [
           (0, import_objectIdentityKey.objectIdentityKey)(values)
-        ]), Provider22 = OGProvider2;
-        return scope && (Provider22 = getOrCreateScopedContext(scope).Provider), /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(LastScopeInNamespace.Provider, {
+        ]), ScopedProvider = OGProvider2;
+        return scope && (ScopedProvider = getOrCreateScopedContext(scope).Provider), /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(LastScopeInNamespace.Provider, {
           value: scope,
-          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Provider22, {
+          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ScopedProvider, {
             value: next,
             children
           })
@@ -3904,57 +3989,6 @@ 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/helpers/getDynamicVal.native.js
 var require_getDynamicVal_native = __commonJS({
   "../../core/web/dist/cjs/helpers/getDynamicVal.native.js"(exports2, module2) {
@@ -6233,8 +6267,8 @@ var require_propMapper_native = __commonJS({
             }
           }
           for (var cat in import_helpers.tokenCategories) if (key in import_helpers.tokenCategories[cat]) {
-            var res = tokensParsed[cat][value];
-            res != null && (valOrVar = res, hasSet = !0);
+            var _tokensParsed_cat, res = (_tokensParsed_cat = tokensParsed[cat]) === null || _tokensParsed_cat === void 0 ? void 0 : _tokensParsed_cat[value];
+            res != null ? (valOrVar = res, hasSet = !0) : process.env.NODE_ENV === "development" && console.warn(`[tamagui] \u26A0\uFE0F missing token ${key} in category ${cat} - ${value}`);
           }
         }
         if (!hasSet) {
@@ -6466,8 +6500,8 @@ var require_getSplitStyles_native = __commonJS({
           return "continue";
         }
         if (0) var didUseKeyInit;
-        var isVariant = !isValidStyleKeyInit && variants && keyInit in variants, isStyleLikeKey = isValidStyleKeyInit || isVariant, isPseudo = keyInit in import_helpers.validPseudoKeys, isMedia = !isStyleLikeKey && !isPseudo && (0, import_useMedia.isMediaKey)(keyInit), isMediaOrPseudo = !!(isMedia || isPseudo);
-        if (isMediaOrPseudo && keyInit.startsWith("$group-")) {
+        var isVariant = !isValidStyleKeyInit && variants && keyInit in variants, isStyleLikeKey = isValidStyleKeyInit || isVariant, isPseudo = keyInit in import_helpers.validPseudoKeys, isMedia = !isStyleLikeKey && !isPseudo ? (0, import_useMedia.getMediaKey)(keyInit) : !1, isMediaOrPseudo = !!(isMedia || isPseudo);
+        if (isMediaOrPseudo && isMedia === "group") {
           var parts = keyInit.split("-"), plen = parts.length;
           if (
             // check if its actually a simple group selector to avoid breaking selectors
@@ -6499,7 +6533,7 @@ var require_getSplitStyles_native = __commonJS({
         (isText || isInput) && valInit && (keyInit === "fontFamily" || keyInit === shorthands.fontFamily) && valInit in conf.fontsParsed && (styleState.fontFamily = valInit);
         var disablePropMap = isMediaOrPseudo || !isStyleLikeKey;
         if ((0, import_propMapper.propMapper)(keyInit, valInit, styleState, disablePropMap, function(key4, val2) {
-          var _parentStaticConfig_variants, isStyledContextProp = styleProps.styledContextProps && key4 in styleProps.styledContextProps;
+          var _parentStaticConfig_variants, isStyledContextProp = styleProps.styledContext && key4 in styleProps.styledContext;
           if (!isHOC && disablePropMap && !isStyledContextProp && !isMediaOrPseudo) {
             viewProps[key4] = val2;
             return;
@@ -6513,7 +6547,7 @@ var require_getSplitStyles_native = __commonJS({
               mergeStyle(styleState, key4, val2, 1);
               return;
             }
-            if (isPseudo = key4 in import_helpers.validPseudoKeys, isMedia = !isPseudo && (0, import_useMedia.isMediaKey)(key4), isMediaOrPseudo = !!(isMedia || isPseudo), isVariant = variants && key4 in variants, inlineProps != null && inlineProps.has(key4) || process.env.IS_STATIC === "is_static" && inlineWhenUnflattened != null && inlineWhenUnflattened.has(key4)) {
+            if (isPseudo = key4 in import_helpers.validPseudoKeys, isMedia = isPseudo ? !1 : (0, import_useMedia.getMediaKey)(key4), isMediaOrPseudo = !!(isMedia || isPseudo), isVariant = variants && key4 in variants, inlineProps != null && inlineProps.has(key4) || process.env.IS_STATIC === "is_static" && inlineWhenUnflattened != null && inlineWhenUnflattened.has(key4)) {
               var _props_key;
               viewProps[key4] = (_props_key = props[key4]) !== null && _props_key !== void 0 ? _props_key : val2;
             }
@@ -7000,80 +7034,6 @@ var require_getSplitStyles_native = __commonJS({
   }
 });
 
-// ../../core/web/dist/cjs/helpers/mergeProps.native.js
-var require_mergeProps_native = __commonJS({
-  "../../core/web/dist/cjs/helpers/mergeProps.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);
-    }, mergeProps_exports = {};
-    __export2(mergeProps_exports, {
-      mergeProps: function() {
-        return mergeProps;
-      }
-    });
-    module2.exports = __toCommonJS2(mergeProps_exports);
-    var import_useMedia = require_useMedia_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), mergeProps = function(a, b, inverseShorthands) {
-      var out = {};
-      for (var key in a) mergeProp(out, a, b, key, inverseShorthands);
-      if (b) for (var key1 in b) mergeProp(out, b, void 0, key1, inverseShorthands);
-      if (b && Object.keys(b).length > 0) {
-        var hasPropsNeedingReorder = Object.keys(b).some(function(key4) {
-          return (key4 in import_pseudoDescriptors.pseudoDescriptors || key4 === "variant") && a && key4 in a && key4 in out;
-        });
-        if (hasPropsNeedingReorder) {
-          var reordered = {};
-          for (var key2 in b) (key2 in import_pseudoDescriptors.pseudoDescriptors || key2 === "variant") && key2 in out && (reordered[key2] = out[key2]);
-          for (var key3 in out) key3 in reordered || (reordered[key3] = out[key3]);
-          return reordered;
-        }
-      }
-      return out;
-    };
-    function mergeProp(out, a, b, key, inverseShorthands) {
-      var longhand = (inverseShorthands == null ? void 0 : inverseShorthands[key]) || null, val = a[key];
-      if (key in import_pseudoDescriptors.pseudoDescriptors || import_useMedia.mediaKeys.has(key)) {
-        out[key] = {
-          ...out[key],
-          ...val
-        };
-        return;
-      }
-      b && (key in b || longhand && longhand in b) || (out[longhand || key] = val);
-    }
-  }
-});
-
 // ../../core/web/dist/cjs/helpers/setElementProps.native.js
 var require_setElementProps_native = __commonJS({
   "../../core/web/dist/cjs/helpers/setElementProps.native.js"(exports2, module2) {
@@ -8535,7 +8495,7 @@ var require_createComponent_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(createComponent_exports);
-    var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native11(), import_constants4 = require_index_native(), import_helpers = require_index_native7(), import_is_equal_shallow = require_index_native12(), 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_GroupContext = require_GroupContext_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_objectIdentityKey = require_objectIdentityKey_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(), time2, debugKeyListeners, startVisualizer, componentSetStates = /* @__PURE__ */ new Set(), avoidReRenderKeys = /* @__PURE__ */ new Set([
+    var import_jsx_runtime6 = require("react/jsx-runtime"), import_compose_refs = require_index_native11(), import_constants4 = require_index_native(), import_helpers = require_index_native7(), import_is_equal_shallow = require_index_native12(), 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_GroupContext = require_GroupContext_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_objectIdentityKey = require_objectIdentityKey_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(), time2, debugKeyListeners, startVisualizer, componentSetStates = /* @__PURE__ */ new Set(), avoidReRenderKeys = /* @__PURE__ */ new Set([
       "hover",
       "press",
       "pressIn",
@@ -8585,28 +8545,15 @@ var require_createComponent_native = __commonJS({
           var _propsIn_datatestrenders, _current, _;
           (_ = (_propsIn_datatestrenders = propsIn["data-test-renders"])[_current = "current"]) !== null && _ !== void 0 || (_propsIn_datatestrenders[_current] = 0), propsIn["data-test-renders"].current += 1;
         }
-        var styledContextProps, overriddenContextProps, contextValue, { context, isReactNative } = staticConfig;
-        if (context && (contextValue = import_react3.default.useContext(context), contextValue)) {
-          process.env.NODE_ENV === "development" && (propsIn == null ? void 0 : propsIn.debug) === "verbose" && (0, import_log.log)(" \u{1F447} contextValue", contextValue);
-          for (var key in context.props) {
-            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);
-            }
-            var finalVal = propVal ?? (defaultProps == null ? void 0 : defaultProps[key]);
-            finalVal !== void 0 && (overriddenContextProps || (overriddenContextProps = {}), overriddenContextProps[key] = finalVal);
-          }
-        }
-        var debugProp = propsIn.debug;
+        var { context, isReactNative } = staticConfig, styledContextValue = context ? import_react3.default.useContext(context) : void 0, overriddenContextProps = null, debugProp = propsIn.debug;
         if (0)
           var timer;
         process.env.NODE_ENV === "development" && time2 && time2`non-tamagui time (ignore)`;
-        var curDefaultProps = styledContextProps ? {
-          ...defaultProps,
-          ...styledContextProps
-        } : defaultProps, props = propsIn;
-        curDefaultProps && (props = (0, import_mergeProps.mergeProps)(curDefaultProps, propsIn));
+        var props = propsIn;
+        if (styledContextValue || defaultProps) {
+          var [nextProps, overrides] = (0, import_mergeProps.mergeComponentProps)(defaultProps, styledContextValue, propsIn);
+          nextProps && (props = nextProps), overriddenContextProps = overrides;
+        }
         var componentName2 = props.componentName || staticConfig.componentName;
         process.env.NODE_ENV === "development" && import_constants4.isClient && import_react3.default.useEffect(function() {
           var node, overlay = null, remove = function() {
@@ -8701,13 +8648,13 @@ var require_createComponent_native = __commonJS({
           else {
             console.groupEnd();
             var ch = propsIn.children, childLog = typeof ch == "string" ? ch.length > 4 ? ch.slice(0, 4) + "..." : ch : "";
-            childLog.length && (childLog = `(children: ${childLog})`), console.groupCollapsed(`${childLog} [inspect props, state, context \u{1F447}]`), (0, import_log.log)("props in:", propsIn), (0, import_log.log)("final props:", props), (0, import_log.log)({
+            childLog.length && (childLog = `(children: ${childLog})`), console.groupCollapsed(`${childLog} [inspect props, state, context \u{1F447}]`), (0, import_log.log)("props in:", propsIn), (0, import_log.log)("final props:", props, Object.keys(props)), (0, import_log.log)({
               state,
               staticConfig,
               elementType,
               themeStateProps
             }), (0, import_log.log)({
-              contextProps: styledContextProps,
+              context,
               overriddenContextProps,
               componentContext
             }), (0, import_log.log)({
@@ -8734,7 +8681,7 @@ var require_createComponent_native = __commonJS({
           isExiting,
           isAnimated,
           willBeAnimated,
-          styledContextProps
+          styledContext: context
         }, themeName = (themeState == null ? void 0 : themeState.name) || "";
         process.env.NODE_ENV === "development" && time2 && time2`split-styles-prepare`;
         var splitStyles = (0, import_getSplitStyles.useSplitStyles)(props, staticConfig, theme, themeName, state, styleProps, null, componentContext, allGroupContexts, elementType, startedUnhydrated, debugProp), isPassthrough = !splitStyles, groupContext = groupName && (allGroupContexts == null ? void 0 : allGroupContexts[groupName]) || null;
@@ -9049,17 +8996,18 @@ If you meant to do this, you can disable this warning - either change untilMeasu
           children: content
         })), process.env.NODE_ENV === "development" && time2 && time2`group-context`, content = disableTheme || !splitStyles ? content : (0, import_Theme.getThemedChildren)(themeState, content, themeStateProps, !1, stateRef), process.env.NODE_ENV === "development" && time2 && time2`themed-children`, staticConfig.context) {
           var contextProps = staticConfig.context.props;
-          for (var key1 in contextProps) if (viewProps.style && key1 in viewProps.style || key1 in viewProps) {
+          for (var key in contextProps) if (viewProps.style && key in viewProps.style || key in viewProps) {
             var _viewProps_style;
             overriddenContextProps || (overriddenContextProps = {});
             var _viewProps_style_key;
-            overriddenContextProps[key1] = (_viewProps_style_key = (_viewProps_style = viewProps.style) === null || _viewProps_style === void 0 ? void 0 : _viewProps_style[key1]) !== null && _viewProps_style_key !== void 0 ? _viewProps_style_key : viewProps[key1];
+            overriddenContextProps[key] = (_viewProps_style_key = (_viewProps_style = viewProps.style) === null || _viewProps_style === void 0 ? void 0 : _viewProps_style[key]) !== null && _viewProps_style_key !== void 0 ? _viewProps_style_key : viewProps[key];
           }
         }
         if (overriddenContextProps) {
           var Provider = staticConfig.context.Provider;
+          for (var key1 in styledContextValue) key1 in overriddenContextProps || (overriddenContextProps[key1] = styledContextValue[key1]);
           content = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Provider, {
-            ...contextValue,
+            __disableMergeDefaultValues: !0,
             ...overriddenContextProps,
             children: content
           });
@@ -10548,6 +10496,57 @@ var require_withStableStyle_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/helpers/getExpandedShorthands.native.js
 var require_getExpandedShorthands_native = __commonJS({
   "../../core/web/dist/cjs/helpers/getExpandedShorthands.native.js"(exports2, module2) {