@tamagui/core 1.122.8 → 1.123.0

package/dist/test.native.js

@@ -359,7 +359,7 @@ var require_types_native = __commonJS({
 var require_constants_native = __commonJS({
   "../constants/dist/cjs/constants.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 = function(target, all) {
+    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
@@ -387,18 +387,6 @@ var require_constants_native = __commonJS({
         }
       }
       return to;
-    }, __toESM2 = function(mod, isNodeMode, target) {
-      return 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 = function(mod) {
       return __copyProps2(__defProp2({}, "__esModule", {
         value: !0
@@ -440,7 +428,7 @@ var require_constants_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(constants_native_exports);
-    var import_react3 = __toESM2(require("react")), isWeb = !1, isWindowDefined = !1, isServer = !1, isClient = !1, useIsomorphicLayoutEffect2 = import_react3.default.useLayoutEffect, isChrome = !1, isWebTouchable = !1, isTouchable = !0, isAndroid = !1, isIos = process.env.TEST_NATIVE_PLATFORM === "ios", currentPlatform = "native";
+    var import_react3 = require("react"), isWeb = !1, isWindowDefined = !1, isServer = !1, isClient = !1, useIsomorphicLayoutEffect2 = import_react3.useLayoutEffect, isChrome = !1, isWebTouchable = !1, isTouchable = !0, isAndroid = !1, isIos = process.env.TEST_NATIVE_PLATFORM === "ios", currentPlatform = "native";
   }
 });
 
@@ -604,10 +592,7 @@ var require_validStyleProps_native = __commonJS({
     }, validStyleProps_exports = {};
     __export2(validStyleProps_exports, {
       stylePropsAll: function() {
-        return stylePropsAll;
-      },
-      stylePropsFont: function() {
-        return stylePropsFont;
+        return stylePropsAll2;
       },
       stylePropsText: function() {
         return stylePropsText;
@@ -631,7 +616,7 @@ var require_validStyleProps_native = __commonJS({
         return validPseudoKeys;
       },
       validStyles: function() {
-        return validStyles;
+        return validStyles2;
       }
     });
     module2.exports = __toCommonJS2(validStyleProps_exports);
@@ -859,7 +844,7 @@ var require_validStyleProps_native = __commonJS({
     }, stylePropsText = {
       ...stylePropsView,
       ...stylePropsTextOnly
-    }, stylePropsAll = stylePropsText, validPseudoKeys = {
+    }, stylePropsAll2 = stylePropsText, validPseudoKeys = {
       enterStyle: !0,
       exitStyle: !0,
       hoverStyle: !0,
@@ -867,7 +852,7 @@ var require_validStyleProps_native = __commonJS({
       focusStyle: !0,
       disabledStyle: !0,
       focusWithinStyle: !0
-    }, validStyles = stylePropsView;
+    }, validStyles2 = stylePropsView;
   }
 });
 
@@ -1214,7 +1199,7 @@ var require_createVariable_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(createVariable_exports);
-    var import_constants2 = require_index_native2(), import_helpers = require_index_native3(), import_config = require_config_native();
+    var import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), import_config = require_config_native();
     function constructCSSVariableName(name) {
       return `var(--${process.env.TAMAGUI_CSS_VARIABLE_PREFIX || ""}${name})`;
     }
@@ -1225,7 +1210,7 @@ var require_createVariable_native = __commonJS({
       return {
         isVar: !0,
         key,
-        name: skipHash ? name : (0, import_helpers.simpleHash)(name, 40),
+        name: skipHash ? name : (0, import_helpers2.simpleHash)(name, 40),
         val,
         variable: import_constants2.isWeb ? skipHash ? constructCSSVariableName(name) : createCSSVariable(name) : ""
       };
@@ -1264,7 +1249,7 @@ var require_createVariable_native = __commonJS({
       return isVariable(v) ? v.variable : v;
     }
     var createCSSVariable = function(nameProp) {
-      var includeVar = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0, name = (0, import_helpers.simpleHash)(nameProp, 60);
+      var includeVar = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !0, name = (0, import_helpers2.simpleHash)(nameProp, 60);
       return includeVar ? constructCSSVariableName(name) : name;
     };
   }
@@ -1340,7 +1325,7 @@ var require_insertStyleRule_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(insertStyleRule_exports);
-    var import_constants2 = require_index_native2(), import_helpers = require_index_native3(), import_createVariable = require_createVariable_native(), totalSelectorsInserted = /* @__PURE__ */ new Map(), allSelectors = {}, allRules = {}, insertedTransforms2 = {}, getAllSelectors = function() {
+    var import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), import_createVariable = require_createVariable_native(), totalSelectorsInserted = /* @__PURE__ */ new Map(), allSelectors = {}, allRules = {}, insertedTransforms2 = {}, getAllSelectors = function() {
       return allSelectors;
     }, getAllRules = function() {
       return Object.values(allRules);
@@ -1425,9 +1410,9 @@ var require_insertStyleRule_native = __commonJS({
         }
         if (!sheet) return;
         for (var key in rulesToInsert) {
-          var styleObject = rulesToInsert[key], identifier = styleObject[import_helpers.StyleObjectIdentifier];
+          var styleObject = rulesToInsert[key], identifier = styleObject[import_helpers2.StyleObjectIdentifier];
           if (shouldInsertStyleRules(identifier)) {
-            var rules = styleObject[import_helpers.StyleObjectRules];
+            var rules = styleObject[import_helpers2.StyleObjectRules];
             allSelectors[identifier] = rules.join(`
 `), track(identifier), updateRules(identifier, rules);
             var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
@@ -2643,65 +2628,55 @@ var require_useTheme_native = __commonJS({
       var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : emptyProps, [_, theme] = useThemeWithState(props), res = theme;
       return res;
     }, useThemeWithState = function(props) {
-      var keys = (0, import_react3.useRef)(null), changedThemeState = useChangeThemeEffect(props, !1, keys), { themeManager, state } = changedThemeState, themeProxied = (0, import_react3.useMemo)(function() {
-        return keys.current && (keys.current = null), !themeManager || !(state != null && state.theme) ? {} : getThemeProxied(state, props.deopt, keys, themeManager, props.debug);
-      }, [
-        state == null ? void 0 : state.theme,
-        themeManager,
-        props.deopt,
-        props.debug
-      ]);
+      var keys = (0, import_react3.useRef)(null), changedThemeState = useChangeThemeEffect(props, !1, keys), { themeManager, state } = changedThemeState, themeProxied = getThemeProxied(props, state, keys, themeManager);
       return [
         changedThemeState,
         themeProxied
       ];
-    };
-    function getThemeProxied(param) {
-      var { theme, name, scheme } = param, deopt = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, keys = arguments.length > 2 ? arguments[2] : void 0, themeManager = arguments.length > 3 ? arguments[3] : void 0, debug = arguments.length > 4 ? arguments[4] : void 0;
-      if (!theme) return {};
-      var config = (0, import_config.getConfig)();
+    }, emptyObject = {}, ProxiedThemes = /* @__PURE__ */ new Map(), curKeys, curProps, curThemeManger;
+    function getThemeProxied(_props, state, _keys, _themeManager) {
+      var theme = state == null ? void 0 : state.theme;
+      if (!theme || !_themeManager) return emptyObject;
+      if (curKeys = _keys, curProps = _props, curThemeManger = _themeManager, ProxiedThemes.has(theme)) {
+        var proxied = ProxiedThemes.get(theme);
+        return proxied;
+      }
+      var { name, scheme } = state, config = (0, import_config.getConfig)();
       function track(key) {
-        keys.current || (keys.current = [], setTimeout(function() {
-          themeManager == null || themeManager.selfUpdate();
-        })), keys.current.push(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"
-          ) {
-            var 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") globalThis.tamaguiAvoidTracking || track(keyString);
-                else if (subkey === "get") return function(platform) {
-                  var outVal = (0, import_createVariable.getVariable)(val);
-                  if (platform !== "web" && import_constants2.isIos && !deopt && (0, import_config.getSetting)("fastSchemeChange") && !(0, import_shouldDeoptDueToParentScheme.shouldDeoptDueToParentScheme)(themeManager) && scheme) {
-                    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[keyString]), oppositeColor = (0, import_createVariable.getVariable)((_config_themes_oppositeName = config.themes[oppositeName]) === null || _config_themes_oppositeName === void 0 ? void 0 : _config_themes_oppositeName[keyString]), dynamicVal = {
-                      dynamic: {
-                        [scheme]: color,
-                        [oppositeScheme]: oppositeColor
-                      }
-                    };
-                    return dynamicVal;
-                  }
-                  return track(keyString), outVal;
-                };
-                return Reflect.get(val, subkey);
-              }
-            });
+        curKeys && (curKeys.current || (curKeys.current = []), curKeys.current.push(key));
+      }
+      var proxied1 = Object.fromEntries(Object.entries(theme).flatMap(function(param) {
+        var [key, value] = param, proxied2 = {
+          ...value,
+          get val() {
+            return globalThis.tamaguiAvoidTracking || track(key), value.val;
+          },
+          get(platform) {
+            var outVal = (0, import_createVariable.getVariable)(value);
+            if (platform !== "web" && import_constants2.isIos && !curProps.deopt && (0, import_config.getSetting)("fastSchemeChange") && !(0, import_shouldDeoptDueToParentScheme.shouldDeoptDueToParentScheme)(curThemeManger) && scheme) {
+              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 track(key), outVal;
           }
-          return Reflect.get(_, key);
-        }
-      });
+        };
+        return [
+          [
+            key,
+            proxied2
+          ],
+          [
+            `$${key}`,
+            proxied2
+          ]
+        ];
+      }));
+      return ProxiedThemes.set(theme, proxied1), proxied1;
     }
     var activeThemeManagers = /* @__PURE__ */ new Set(), _uidToManager = /* @__PURE__ */ new WeakMap(), _idToUID = {}, getId = function(id) {
       return _idToUID[id];
@@ -4597,14 +4572,14 @@ var require_normalizeValueWithProperty_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(normalizeValueWithProperty_exports);
-    var import_constants2 = require_index_native2(), import_helpers = require_index_native3(), import_insertStyleRule = require_insertStyleRule_native(), stylePropsAllPlusTransforms = {
-      ...import_helpers.stylePropsAll,
+    var import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), import_insertStyleRule = require_insertStyleRule_native(), stylePropsAllPlusTransforms = {
+      ...import_helpers2.stylePropsAll,
       translateX: !0,
       translateY: !0
     };
     function normalizeValueWithProperty(value) {
       var property = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "";
-      if (!import_constants2.isWeb || import_helpers.stylePropsUnitless[property] || property && !stylePropsAllPlusTransforms[property] || typeof value == "boolean") return value;
+      if (!import_constants2.isWeb || import_helpers2.stylePropsUnitless[property] || property && !stylePropsAllPlusTransforms[property] || typeof value == "boolean") return value;
       var res = value;
       return value && typeof value == "object" ? value : (typeof value == "number" ? res = `${value}px` : property && (res = `${res}`), res);
     }
@@ -4614,7 +4589,7 @@ var require_normalizeValueWithProperty_native = __commonJS({
       if (rcache[cssRule]) return rcache[cssRule];
       if (cssRule) {
         var cssVal = cssRule.replace(/.*:/, "").replace(/;.*/, "").trim(), res;
-        return cssVal.startsWith("var(") ? res = cssVal : import_helpers.stylePropsUnitless[key] ? res = +cssVal : cssVal.endsWith("px") ? res = +cssVal.replace("px", "") : res = cssVal, rcache[cssRule] = res, res;
+        return cssVal.startsWith("var(") ? res = cssVal : import_helpers2.stylePropsUnitless[key] ? res = +cssVal : cssVal.endsWith("px") ? res = +cssVal.replace("px", "") : res = cssVal, rcache[cssRule] = res, res;
       }
     }
   }
@@ -5365,7 +5340,7 @@ var require_propMapper_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(propMapper_exports);
-    var import_constants2 = require_index_native2(), import_helpers = require_index_native3(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_expandStyle = require_expandStyle_native(), import_getVariantExtras = require_getVariantExtras_native(), import_isObj = require_isObj_native(), import_normalizeStyle = require_normalizeStyle_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), import_skipProps = require_skipProps_native(), propMapper = function(key, value, styleState, disabled, map) {
+    var import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), import_config = require_config_native(), import_createVariable = require_createVariable_native(), import_expandStyle = require_expandStyle_native(), import_getVariantExtras = require_getVariantExtras_native(), import_isObj = require_isObj_native(), import_normalizeStyle = require_normalizeStyle_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), import_skipProps = require_skipProps_native(), propMapper = function(key, value, styleState, disabled, map) {
       if (disabled) return map(key, value);
       if (lastFontFamilyToken = null, !(!import_constants2.isAndroid && key === "elevationAndroid")) {
         var { conf, styleProps, staticConfig } = styleState;
@@ -5556,7 +5531,7 @@ var require_propMapper_native = __commonJS({
               break;
             }
           }
-          for (var cat in import_helpers.tokenCategories) if (key in import_helpers.tokenCategories[cat]) {
+          for (var cat in import_helpers2.tokenCategories) if (key in import_helpers2.tokenCategories[cat]) {
             var res = tokensParsed[cat][value];
             res != null && (valOrVar = res, hasSet = !0);
           }
@@ -5758,9 +5733,9 @@ var require_getSplitStyles_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(getSplitStyles_exports);
-    var import_constants2 = require_index_native2(), import_helpers = require_index_native3(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_accessibilityDirectMap = require_accessibilityDirectMap_native(), import_constants22 = require_constants_native2(), import_isDevTools = require_isDevTools_native(), import_useMedia = require_useMedia_native(), import_createMediaStyle = require_createMediaStyle_native(), import_expandStyles = require_expandStyles_native(), import_getGroupPropParts = require_getGroupPropParts_native(), import_getStylesAtomic = require_getStylesAtomic_native(), import_insertStyleRule = require_insertStyleRule_native(), import_isActivePlatform = require_isActivePlatform_native(), import_isActiveTheme = require_isActiveTheme_native(), import_log = require_log_native(), import_normalizeValueWithProperty = require_normalizeValueWithProperty_native(), import_propMapper = require_propMapper_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), import_skipProps = require_skipProps_native(), import_sortString = require_sortString_native(), import_transformsToString = require_transformsToString_native(), consoleGroupCollapsed = import_constants2.isWeb ? console.groupCollapsed : console.info, conf, PROP_SPLIT = "-";
-    function isValidStyleKey(key, validStyles, accept) {
-      return key in validStyles ? !0 : accept && key in accept;
+    var import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), import_react3 = __toESM2(require("react")), import_config = require_config_native(), import_accessibilityDirectMap = require_accessibilityDirectMap_native(), import_constants22 = require_constants_native2(), import_isDevTools = require_isDevTools_native(), import_useMedia = require_useMedia_native(), import_createMediaStyle = require_createMediaStyle_native(), import_expandStyles = require_expandStyles_native(), import_getGroupPropParts = require_getGroupPropParts_native(), import_getStylesAtomic = require_getStylesAtomic_native(), import_insertStyleRule = require_insertStyleRule_native(), import_isActivePlatform = require_isActivePlatform_native(), import_isActiveTheme = require_isActiveTheme_native(), import_log = require_log_native(), import_normalizeValueWithProperty = require_normalizeValueWithProperty_native(), import_propMapper = require_propMapper_native(), import_pseudoDescriptors = require_pseudoDescriptors_native(), import_skipProps = require_skipProps_native(), import_sortString = require_sortString_native(), import_transformsToString = require_transformsToString_native(), consoleGroupCollapsed = import_constants2.isWeb ? console.groupCollapsed : console.info, conf, PROP_SPLIT = "-";
+    function isValidStyleKey(key, validStyles2, accept) {
+      return key in validStyles2 ? !0 : accept && key in accept;
     }
     var getSplitStyles = function(props, staticConfig, theme, themeName, componentState, styleProps, parentSplitStyles, context, elementType, debug) {
       var _loop = function(keyOg2) {
@@ -5776,7 +5751,7 @@ var require_getSplitStyles_native = __commonJS({
           if (keyInit === "group" && !1) var identifier2, containerType, containerCSS;
           return "continue";
         }
-        var valInitType = typeof valInit, isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles, accept);
+        var valInitType = typeof valInit, isValidStyleKeyInit = isValidStyleKey(keyInit, validStyles2, accept);
         if (0) {
           if (staticConfig.isReactNative && keyInit.startsWith("data-")) var _viewProps2, _dataSet;
           if (isValidStyleKeyInit && valInitType === "string" && valInit[0] === "_") {
@@ -5794,7 +5769,7 @@ 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), isMediaOrPseudo1 = !!(isMedia || isPseudo);
+        var isVariant = !isValidStyleKeyInit && variants && keyInit in variants, isStyleLikeKey = isValidStyleKeyInit || isVariant, isPseudo = keyInit in import_helpers2.validPseudoKeys, isMedia = !isStyleLikeKey && !isPseudo && (0, import_useMedia.isMediaKey)(keyInit), isMediaOrPseudo1 = !!(isMedia || isPseudo);
         if (isMediaOrPseudo1 && keyInit.startsWith("$group-")) {
           var parts = keyInit.split("-");
           if (
@@ -5823,11 +5798,11 @@ var require_getSplitStyles_native = __commonJS({
               viewProps[key4] = val2;
               return;
             }
-            if (!isHOC && isValidStyleKey(key4, validStyles, accept) || import_constants2.isAndroid && key4 === "elevation") {
+            if (!isHOC && isValidStyleKey(key4, validStyles2, accept) || import_constants2.isAndroid && key4 === "elevation") {
               mergeStyle(styleState, key4, val2);
               return;
             }
-            if (isPseudo = key4 in import_helpers.validPseudoKeys, isMedia = !isPseudo && (0, import_useMedia.isMediaKey)(key4), isMediaOrPseudo1 = !!(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_helpers2.validPseudoKeys, isMedia = !isPseudo && (0, import_useMedia.isMediaKey)(key4), isMediaOrPseudo1 = !!(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;
             }
@@ -5852,8 +5827,8 @@ var require_getSplitStyles_native = __commonJS({
                 var pseudoStyles = (0, import_getStylesAtomic.getStyleAtomic)(pseudoStyleObject, descriptor), _iteratorNormalCompletion2 = !0, _didIteratorError2 = !1, _iteratorError2 = void 0;
                 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), mergeClassName(transforms, classNames, fullKey, psuedoStyle[import_helpers.StyleObjectIdentifier], isMediaOrPseudo1, !0));
+                    var psuedoStyle = _step2.value, fullKey = `${psuedoStyle[import_helpers2.StyleObjectProperty]}${PROP_SPLIT}${descriptor.name}`;
+                    fullKey in usedKeys || (addStyleToInsertRules(rulesToInsert, psuedoStyle), mergeClassName(transforms, classNames, fullKey, psuedoStyle[import_helpers2.StyleObjectIdentifier], isMediaOrPseudo1, !0));
                   }
                 } catch (err) {
                   _didIteratorError2 = !0, _iteratorError2 = err;
@@ -5905,10 +5880,10 @@ var require_getSplitStyles_native = __commonJS({
                 var _iteratorNormalCompletion12 = !0, _didIteratorError12 = !1, _iteratorError12 = void 0;
                 try {
                   for (var _iterator12 = mediaStyles[Symbol.iterator](), _step12; !(_iteratorNormalCompletion12 = (_step12 = _iterator12.next()).done); _iteratorNormalCompletion12 = !0) {
-                    var style3 = _step12.value, property = style3[import_helpers.StyleObjectProperty], isSubStyle = property[0] === "$";
+                    var style3 = _step12.value, property = style3[import_helpers2.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), mergeClassName(transforms, classNames, fullKey1, out[import_helpers.StyleObjectIdentifier], !0, !0));
+                      var out = (0, import_createMediaStyle.createMediaStyle)(style3, mediaKeyShort, import_useMedia.mediaQueryConfig, isMedia, !1, priority), subKey = isSubStyle ? style3[2] : "", fullKey1 = `${style3[import_helpers2.StyleObjectProperty]}${subKey}${PROP_SPLIT}${mediaKeyShort}${style3[import_helpers2.StyleObjectPseudo] || ""}`;
+                      fullKey1 in usedKeys || (addStyleToInsertRules(rulesToInsert, out), mergeClassName(transforms, classNames, fullKey1, out[import_helpers2.StyleObjectIdentifier], !0, !0));
                     }
                   }
                 } catch (err) {
@@ -5978,7 +5953,7 @@ var require_getSplitStyles_native = __commonJS({
         });
       };
       props.reddish && (debug = "verbose"), conf = conf || (0, import_config.getConfig)(), import_constants2.isWeb && styleProps.isAnimated && conf.animations.isReactNative && !styleProps.noNormalize && (styleProps.noNormalize = "values");
-      var { shorthands } = conf, { isHOC, isText, isInput, variants, isReactNative, inlineProps, inlineWhenUnflattened, parentStaticConfig, acceptsClassName } = staticConfig, viewProps = {}, mediaState2 = styleProps.mediaState || import_useMedia.mediaState, usedKeys = {}, shouldDoClasses = acceptsClassName && import_constants2.isWeb && !styleProps.noClass, rulesToInsert = void 0, classNames = {}, transforms = {}, pseudos = null, space = props.space, hasMedia = !1, dynamicThemeAccess, pseudoGroups, mediaGroups, className = props.className || "", mediaStylesSeen = 0, validStyles = staticConfig.validStyles || (staticConfig.isText || staticConfig.isInput ? import_helpers.stylePropsText : import_helpers.validStyles), styleState = {
+      var { shorthands } = conf, { isHOC, isText, isInput, variants, isReactNative, inlineProps, inlineWhenUnflattened, parentStaticConfig, acceptsClassName } = staticConfig, viewProps = {}, mediaState2 = styleProps.mediaState || import_useMedia.mediaState, usedKeys = {}, shouldDoClasses = acceptsClassName && import_constants2.isWeb && !styleProps.noClass, rulesToInsert = void 0, classNames = {}, transforms = {}, pseudos = null, space = props.space, hasMedia = !1, dynamicThemeAccess, pseudoGroups, mediaGroups, className = props.className || "", mediaStylesSeen = 0, validStyles2 = staticConfig.validStyles || (staticConfig.isText || staticConfig.isInput ? import_helpers2.stylePropsText : import_helpers2.validStyles), styleState = {
         classNames,
         conf,
         props,
@@ -6105,7 +6080,7 @@ var require_getSplitStyles_native = __commonJS({
       if (import_constants2.isWeb && (val == null ? void 0 : val[0]) === "_") {
         var _usedKeys, _key;
         classNames[key] = val, (_usedKeys = usedKeys)[_key = key] || (_usedKeys[_key] = 1);
-      } else if (key in import_helpers.stylePropsTransform) {
+      } else if (key in import_helpers2.stylePropsTransform) {
         var _styleState;
         (_styleState = styleState).flatTransforms || (_styleState.flatTransforms = {}), styleState.flatTransforms[key] = val;
       } else {
@@ -6127,7 +6102,7 @@ var require_getSplitStyles_native = __commonJS({
         var shouldSkip = !staticConfig.isHOC && key1 in import_skipProps.skipProps && !styleProps.noSkip;
         if (shouldSkip) return key = key1, "continue";
         (0, import_propMapper.propMapper)(key1, val, styleState, !1, function(skey, sval) {
-          skey in import_helpers.validPseudoKeys && (sval = getSubStyle(styleState, skey, sval, avoidMergeTransform)), !avoidMergeTransform && skey in import_helpers.stylePropsTransform ? mergeTransform(styleOut, skey, sval) : styleOut[skey] = styleProps.noNormalize ? sval : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(sval, key1);
+          skey in import_helpers2.validPseudoKeys && (sval = getSubStyle(styleState, skey, sval, avoidMergeTransform)), !avoidMergeTransform && skey in import_helpers2.stylePropsTransform ? mergeTransform(styleOut, skey, sval) : styleOut[skey] = styleProps.noNormalize ? sval : (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(sval, key1);
         }), key = key1;
       }, { staticConfig, conf: conf2, styleProps } = styleState, styleOut = {};
       for (var key in styleIn) _loop(key);
@@ -6142,7 +6117,7 @@ var require_getSplitStyles_native = __commonJS({
       if (0) var identifier;
     }
     var defaultColor = process.env.TAMAGUI_DEFAULT_COLOR || "rgba(0,0,0,0)", animatableDefaults = {
-      ...Object.fromEntries(Object.entries(import_helpers.tokenCategories.color).map(function(param) {
+      ...Object.fromEntries(Object.entries(import_helpers2.tokenCategories.color).map(function(param) {
         var [k, v] = param;
         return [
           k,
@@ -6194,7 +6169,7 @@ var require_getSplitStyles_native = __commonJS({
       var out = {};
       for (var key in style) {
         var val = style[key];
-        key in import_helpers.stylePropsTransform ? mergeTransform(out, key, val) : out[key] = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key);
+        key in import_helpers2.stylePropsTransform ? mergeTransform(out, key, val) : out[key] = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key);
       }
       return import_constants2.isWeb && Array.isArray(out.transform) && (out.transform = (0, import_transformsToString.transformsToString)(out.transform)), (0, import_expandStyles.fixStyles)(out), out;
     }
@@ -6715,7 +6690,7 @@ var require_wrapStyleTags_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(wrapStyleTags_exports);
-    var import_jsx_runtime = require("react/jsx-runtime"), import_helpers = require_index_native3();
+    var import_jsx_runtime = require("react/jsx-runtime"), import_helpers2 = require_index_native3();
     function wrapStyleTags(styles, content) {
       return process.env.TAMAGUI_REACT_19, content;
     }
@@ -6966,7 +6941,7 @@ var require_Slot_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(Slot_exports);
-    var import_jsx_runtime = require("react/jsx-runtime"), import_compose_refs = require_index_native5(), import_constants2 = require_index_native2(), import_helpers = require_index_native3(), import_react3 = require("react"), is19 = import_react3.version.startsWith("19."), Slot = /* @__PURE__ */ (0, import_react3.memo)(/* @__PURE__ */ (0, import_react3.forwardRef)(function(props, forwardedRef) {
+    var import_jsx_runtime = require("react/jsx-runtime"), import_compose_refs = require_index_native5(), import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), import_react3 = require("react"), is19 = import_react3.version.startsWith("19."), Slot = /* @__PURE__ */ (0, import_react3.memo)(/* @__PURE__ */ (0, import_react3.forwardRef)(function(props, forwardedRef) {
       var { children, ...slotProps } = props;
       if (/* @__PURE__ */ (0, import_react3.isValidElement)(children)) {
         var mergedProps = mergeSlotProps(children, slotProps);
@@ -6997,7 +6972,7 @@ var require_Slot_native = __commonJS({
         var slotPropValue = slotProps[propName], childPropValue = childProps[propName];
         isHTMLChild && propName in pressMap && (propName = pressMap[propName], delete overrideProps[propName]);
         var isHandler = handleRegex.test(propName);
-        isHandler ? overrideProps[propName] = (0, import_helpers.composeEventHandlers)(childPropValue, slotPropValue) : propName === "style" ? overrideProps[propName] = {
+        isHandler ? overrideProps[propName] = (0, import_helpers2.composeEventHandlers)(childPropValue, slotPropValue) : propName === "style" ? overrideProps[propName] = {
           ...slotPropValue,
           ...childPropValue
         } : propName === "className" && (overrideProps[propName] = [
@@ -7081,7 +7056,7 @@ var require_createComponent_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(createComponent_exports);
-    var import_jsx_runtime = require("react/jsx-runtime"), import_compose_refs = require_index_native5(), import_constants2 = require_index_native2(), import_helpers = require_index_native3(), 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(), componentSetStates = /* @__PURE__ */ new Set();
+    var import_jsx_runtime = require("react/jsx-runtime"), import_compose_refs = require_index_native5(), import_constants2 = require_index_native2(), import_helpers2 = require_index_native3(), 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(), componentSetStates = /* @__PURE__ */ new Set();
     typeof document < "u" && (cancelTouches = function() {
       componentSetStates.forEach(function(setState) {
         return setState(function(prev) {
@@ -7231,7 +7206,7 @@ var require_createComponent_native = __commonJS({
           });
           (isAnimated || supportsCSSVars) && animations && (animationStyles = animations.style, viewProps.style = animationStyles, animations.className && (viewProps.className = `${state.unmounted === "should-enter" ? "t_unmounted " : ""}${viewProps.className || ""} ${animations.className}`));
         }
-        groupName && (nonTamaguiProps.onLayout = (0, import_helpers.composeEventHandlers)(nonTamaguiProps.onLayout, function(e) {
+        groupName && (nonTamaguiProps.onLayout = (0, import_helpers2.composeEventHandlers)(nonTamaguiProps.onLayout, function(e) {
           stateRef.current.group.emit(groupName, {
             layout: e.nativeEvent.layout
           }), !stateRef.current.hasMeasured && props.untilMeasured === "hide" && setState(function(prev) {
@@ -7463,7 +7438,7 @@ var require_createComponent_native = __commonJS({
       acceptsClassName: !0,
       memo: !0,
       componentName: "Spacer",
-      validStyles: import_helpers.validStyles,
+      validStyles: import_helpers2.validStyles,
       defaultProps: {
         ...import_constants22.stackDefaultStyles,
         // avoid nesting issues
@@ -7716,7 +7691,7 @@ var require_createVariables_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(createVariables_exports);
-    var import_helpers = require_index_native3(), import_createVariable = require_createVariable_native(), cache2 = /* @__PURE__ */ new WeakMap(), createVariables = function(tokens) {
+    var import_helpers2 = require_index_native3(), import_createVariable = require_createVariable_native(), cache2 = /* @__PURE__ */ new WeakMap(), createVariables = function(tokens) {
       var parentPath = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "", isFont = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : !1;
       if (cache2.has(tokens)) return tokens;
       var res = {}, i = 0;
@@ -7727,7 +7702,7 @@ var require_createVariables_native = __commonJS({
           res[key] = val;
           continue;
         }
-        var niceKey = (0, import_helpers.simpleHash)(key, 1e3), name = parentPath && parentPath !== "t-color" ? `${parentPath}-${niceKey}` : `c-${niceKey}`;
+        var niceKey = (0, import_helpers2.simpleHash)(key, 1e3), name = parentPath && parentPath !== "t-color" ? `${parentPath}-${niceKey}` : `c-${niceKey}`;
         if (val && typeof val == "object") {
           res[key] = createVariables(tokens[key], name, !1);
           continue;
@@ -7839,7 +7814,7 @@ var require_proxyThemeToParents_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(proxyThemeToParents_exports);
-    var import_config = require_config_native(), themesRaw = {};
+    var themesRaw = {};
     function proxyThemesToParents(dedupedThemes) {
       var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
       try {
@@ -7900,21 +7875,24 @@ var require_proxyThemeToParents_native = __commonJS({
       return themes;
     }
     function proxyThemeToParents(themeName, theme) {
-      var cur = [], parents = themeName.split("_").slice(0, -1).map(function(part) {
+      var out = {}, cur = [], parents = themeName.split("_").slice(0, -1).map(function(part) {
         return cur.push(part), cur.join("_");
-      }), numParents = parents.length;
-      return new Proxy(theme, {
-        get(target, key) {
-          if (!key || // 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" || Reflect.has(target, key)) return Reflect.get(target, key);
-          for (var i = numParents - 1; i >= 0; i--) {
-            var parent = themesRaw[parents[i]];
-            if (parent && Reflect.has(parent, key)) return Reflect.get(parent, key);
-          }
-          return (0, import_config.getTokenObject)(key);
+      }), _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+      try {
+        for (var _iterator = parents[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
+          var parent = _step.value;
+          Object.assign(out, themesRaw[parent]);
         }
-      });
+      } catch (err) {
+        _didIteratorError = !0, _iteratorError = err;
+      } finally {
+        try {
+          !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
+        } finally {
+          if (_didIteratorError) throw _iteratorError;
+        }
+      }
+      return Object.assign(out, theme), out;
     }
   }
 });
@@ -9272,10 +9250,10 @@ var require_Stack_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(Stack_exports);
-    var import_helpers = require_index_native3(), import_constants2 = require_constants_native2(), import_createComponent = require_createComponent_native(), Stack2 = (0, import_createComponent.createComponent)({
+    var import_helpers2 = require_index_native3(), import_constants2 = require_constants_native2(), import_createComponent = require_createComponent_native(), Stack2 = (0, import_createComponent.createComponent)({
       acceptsClassName: !0,
       defaultProps: import_constants2.stackDefaultStyles,
-      validStyles: import_helpers.validStyles
+      validStyles: import_helpers2.validStyles
     });
     Stack2.displayName = "Stack";
   }
@@ -9450,10 +9428,10 @@ var require_View_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(View_exports);
-    var import_helpers = require_index_native3(), import_constants2 = require_constants_native2(), import_createComponent = require_createComponent_native(), View2 = (0, import_createComponent.createComponent)({
+    var import_helpers2 = require_index_native3(), import_constants2 = require_constants_native2(), import_createComponent = require_createComponent_native(), View2 = (0, import_createComponent.createComponent)({
       acceptsClassName: !0,
       defaultProps: import_constants2.stackDefaultStyles,
-      validStyles: import_helpers.validStyles
+      validStyles: import_helpers2.validStyles
     });
   }
 });
@@ -9501,7 +9479,7 @@ var require_Text_native = __commonJS({
       }
     });
     module2.exports = __toCommonJS2(Text_exports);
-    var import_helpers = require_index_native3(), import_createComponent = require_createComponent_native(), ellipsisStyle = {
+    var import_helpers2 = require_index_native3(), import_createComponent = require_createComponent_native(), ellipsisStyle = {
       numberOfLines: 1,
       lineBreakMode: "clip"
     }, Text2 = (0, import_createComponent.createComponent)({
@@ -9526,8 +9504,8 @@ var require_Text_native = __commonJS({
         }
       },
       validStyles: {
-        ...import_helpers.validStyles,
-        ...import_helpers.stylePropsTextOnly
+        ...import_helpers2.validStyles,
+        ...import_helpers2.stylePropsTextOnly
       }
     });
     Text2.displayName = "Text";
@@ -11930,8 +11908,28 @@ var tm, measureElement = async function(target) {
 // src/vendor/Pressability.native.tsx
 var Pressability = require_fake_react_native().default, usePressability = (init_idFn(), __toCommonJS(idFn_exports)).default;
 
+// src/addNativeValidStyles.native.ts
+var import_helpers = __toESM(require_index_native3()), import_ReactNativeVersion = __toESM(require("react-native/Libraries/Core/ReactNativeVersion"));
+function addNativeValidStyles() {
+  if (import_ReactNativeVersion.default) {
+    var { version: { major, minor } } = import_ReactNativeVersion.default;
+    if (major === 0 && minor >= 77) {
+      var additional = {
+        boxSizing: !0,
+        mixBlendMode: !0,
+        outlineWidth: !0,
+        outlineStyle: !0,
+        outlineSpread: !0,
+        outlineColor: !0
+      };
+      Object.assign(import_helpers.validStyles, additional), Object.assign(import_helpers.stylePropsAll, additional);
+    }
+  }
+}
+
 // src/index.tsx
 __reExport(index_exports, __toESM(require_index_native8()), module.exports);
+addNativeValidStyles();
 var createTamagui = function(conf) {
   return conf.media && (conf.media = (0, import_react_native_media_driver.createMedia)(conf.media)), (0, import_web.createTamagui)(conf);
 }, baseViews = getBaseViews();