@tamagui/core 1.90.1 → 1.90.3

package/dist/native.js

@@ -3138,9 +3138,6 @@ var require_useMedia_native = __commonJS({
       mediaState: function() {
         return mediaState2;
       },
-      mergeMediaByImportance: function() {
-        return mergeMediaByImportance;
-      },
       setMediaShouldUpdate: function() {
         return setMediaShouldUpdate;
       },
@@ -3359,10 +3356,6 @@ var require_useMedia_native = __commonJS({
       var conf = (0, import_config.getConfig)(), importance = isSizeMedia && !conf.settings.mediaPropOrder ? getMediaKeyImportance(mediaKey) : defaultMediaImportance;
       return !importancesUsed[key] || importance > importancesUsed[key] ? importance : null;
     };
-    function mergeMediaByImportance(onto, mediaKey, key, value, importancesUsed, isSizeMedia, importanceBump) {
-      var importance = getMediaImportanceIfMoreImportant(mediaKey, key, importancesUsed, isSizeMedia);
-      return importanceBump && (importance = (importance || 0) + importanceBump), importance === null ? !1 : (importancesUsed[key] = importance, onto[key] = value, !0);
-    }
     function camelToHyphen(str) {
       return str.replace(/[A-Z]/g, function(m) {
         return "-".concat(m.toLowerCase());
@@ -7721,252 +7714,251 @@ var require_getSplitStyles_native = __commonJS({
               isHOCShouldPassThrough,
               curProps: _object_spread2({}, styleState.curProps),
               parentStaticConfig
-            })), !(shouldPassThrough && (passDownProp(viewProps, keyInit, valInit, isMediaOrPseudo1), !isVariant)) && !(!styleProps.noSkip && keyInit in import_skipProps.skipProps)) {
-              (isText || isInput) && valInit && (keyInit === "fontFamily" || keyInit === shorthands.fontFamily) && valInit in conf.fontsParsed && (styleState.fontFamily = valInit);
-              var avoidPropMap = isMediaOrPseudo1 || !isVariant && !isValidStyleKeyInit, expanded = avoidPropMap ? null : (0, import_propMapper.propMapper)(keyInit, valInit, styleState);
-              if (!avoidPropMap) {
-                if (!expanded)
-                  continue;
-                var next = (0, import_propMapper.getPropMappedFontFamily)(expanded);
-                next && (styleState.fontFamily = next);
-              }
-              if (process.env.NODE_ENV === "development" && debug === "verbose") {
-                console.groupCollapsed("  \u{1F4A0} expanded", keyInit, valInit);
-                try {
-                  !import_constants.isServer && import_isDevTools.isDevTools && ((0, import_log.log)({
-                    expanded,
-                    styleProps,
-                    componentState,
-                    isVariant,
-                    variant: variants == null ? void 0 : variants[keyInit],
-                    shouldPassProp,
-                    isHOCShouldPassThrough,
-                    theme,
-                    usedKeys: _object_spread2({}, usedKeys),
-                    curProps: _object_spread2({}, styleState.curProps)
-                  }), (0, import_log.log)("expanded", expanded, `
+            })), shouldPassThrough && (passDownProp(viewProps, keyInit, valInit, isMediaOrPseudo1), !isVariant)) {
+              process.env.NODE_ENV === "development" && debug === "verbose" && console.groupEnd();
+              continue;
+            }
+            if (!styleProps.noSkip && keyInit in import_skipProps.skipProps) {
+              process.env.NODE_ENV === "development" && debug === "verbose" && console.groupEnd();
+              continue;
+            }
+            (isText || isInput) && valInit && (keyInit === "fontFamily" || keyInit === shorthands.fontFamily) && valInit in conf.fontsParsed && (styleState.fontFamily = valInit);
+            var avoidPropMap = isMediaOrPseudo1 || !isVariant && !isValidStyleKeyInit, expanded = avoidPropMap ? null : (0, import_propMapper.propMapper)(keyInit, valInit, styleState);
+            if (!avoidPropMap) {
+              if (!expanded)
+                continue;
+              var next = (0, import_propMapper.getPropMappedFontFamily)(expanded);
+              next && (styleState.fontFamily = next);
+            }
+            if (process.env.NODE_ENV === "development" && debug === "verbose") {
+              console.groupCollapsed("  \u{1F4A0} expanded", keyInit, valInit);
+              try {
+                !import_constants.isServer && import_isDevTools.isDevTools && ((0, import_log.log)({
+                  expanded,
+                  styleProps,
+                  componentState,
+                  isVariant,
+                  variant: variants == null ? void 0 : variants[keyInit],
+                  shouldPassProp,
+                  isHOCShouldPassThrough,
+                  theme,
+                  usedKeys: _object_spread2({}, usedKeys),
+                  curProps: _object_spread2({}, styleState.curProps)
+                }), (0, import_log.log)("expanded", expanded, `
 usedKeys`, _object_spread2({}, usedKeys), `
 current`, _object_spread2({}, styleState.style)));
-                } catch {
-                }
-                console.groupEnd();
+              } catch {
+              }
+              console.groupEnd();
+            }
+            for (var key = keyInit, val = valInit, max = expanded ? expanded.length : 1, i = 0; i < max; i++) {
+              var _parentStaticConfig_variants1;
+              if (expanded) {
+                var _expanded_i = _sliced_to_array(expanded[i], 2), k = _expanded_i[0], v = _expanded_i[1];
+                key = k, val = v;
               }
-              for (var key = keyInit, val = valInit, max = expanded ? expanded.length : 1, i = 0; i < max; i++) {
-                var _parentStaticConfig_variants1;
-                if (expanded) {
-                  var _expanded_i = _sliced_to_array(expanded[i], 2), k = _expanded_i[0], v = _expanded_i[1];
-                  key = k, val = v;
+              if (val != null && !(key in usedKeys)) {
+                if (isPseudo = key in import_helpers.validPseudoKeys, isMedia = !isPseudo && !isValidStyleKeyInit && (0, import_useMedia.isMediaKey)(key), isMediaOrPseudo1 = !!(isMedia || isPseudo), isVariant = variants && key in variants, inlineProps != null && inlineProps.has(key) || IS_STATIC && inlineWhenUnflattened != null && inlineWhenUnflattened.has(key)) {
+                  var _props_key;
+                  viewProps[key] = (_props_key = props[key]) !== null && _props_key !== void 0 ? _props_key : val;
                 }
-                if (val != null && !(key in usedKeys)) {
-                  if (isPseudo = key in import_helpers.validPseudoKeys, isMedia = !isPseudo && !isValidStyleKeyInit && (0, import_useMedia.isMediaKey)(key), isMediaOrPseudo1 = !!(isMedia || isPseudo), isVariant = variants && key in variants, inlineProps != null && inlineProps.has(key) || IS_STATIC && inlineWhenUnflattened != null && inlineWhenUnflattened.has(key)) {
-                    var _props_key;
-                    viewProps[key] = (_props_key = props[key]) !== null && _props_key !== void 0 ? _props_key : val;
-                  }
-                  var shouldPassThrough1 = styleProps.noExpand && isPseudo || isHOC && (isMediaOrPseudo1 || (parentStaticConfig == null || (_parentStaticConfig_variants1 = parentStaticConfig.variants) === null || _parentStaticConfig_variants1 === void 0 ? void 0 : _parentStaticConfig_variants1[keyInit]));
-                  if (shouldPassThrough1) {
-                    passDownProp(viewProps, key, val, isMediaOrPseudo1), process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed(" - passing down prop ".concat(key)), (0, import_log.log)({
-                      val,
-                      after: _object_spread2({}, viewProps[key])
-                    }), console.groupEnd());
+                var shouldPassThrough1 = styleProps.noExpand && isPseudo || isHOC && (isMediaOrPseudo1 || (parentStaticConfig == null || (_parentStaticConfig_variants1 = parentStaticConfig.variants) === null || _parentStaticConfig_variants1 === void 0 ? void 0 : _parentStaticConfig_variants1[keyInit]));
+                if (shouldPassThrough1) {
+                  passDownProp(viewProps, key, val, isMediaOrPseudo1), process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed(" - passing down prop ".concat(key)), (0, import_log.log)({
+                    val,
+                    after: _object_spread2({}, viewProps[key])
+                  }), console.groupEnd());
+                  continue;
+                }
+                if (isPseudo) {
+                  if (!val)
                     continue;
-                  }
-                  if (isPseudo) {
-                    if (!val)
-                      continue;
-                    var pseudoStyleObject = getSubStyle(styleState, key, val, styleProps.noClassNames), descriptor = import_pseudoDescriptors.pseudoDescriptors[key], isEnter = key === "enterStyle", isExit = key === "exitStyle";
-                    if (!descriptor)
+                  var pseudoStyleObject = getSubStyle(styleState, key, val, styleProps.noClassNames), descriptor = import_pseudoDescriptors.pseudoDescriptors[key], isEnter = key === "enterStyle", isExit = key === "exitStyle";
+                  if (!descriptor)
+                    continue;
+                  if (!shouldDoClasses || IS_STATIC) {
+                    var _pseudos, _key;
+                    if (pseudos || (pseudos = {}), (_pseudos = pseudos)[_key = key] || (_pseudos[_key] = {}), IS_STATIC) {
+                      Object.assign(pseudos[key], pseudoStyleObject);
                       continue;
-                    if (!shouldDoClasses || IS_STATIC) {
-                      var _pseudos, _key;
-                      if (pseudos || (pseudos = {}), (_pseudos = pseudos)[_key = key] || (_pseudos[_key] = {}), IS_STATIC) {
-                        Object.assign(pseudos[key], pseudoStyleObject);
-                        continue;
-                      }
                     }
-                    if (shouldDoClasses && !isExit) {
-                      var pseudoStyles = (0, import_getStylesAtomic.getStyleAtomic)(pseudoStyleObject, descriptor);
-                      process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed("pseudo (classes)", key), (0, import_log.log)({
-                        pseudoStyleObject,
-                        pseudoStyles
-                      }), console.groupEnd());
-                      var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+                  }
+                  if (shouldDoClasses && !isExit) {
+                    var pseudoStyles = (0, import_getStylesAtomic.getStyleAtomic)(pseudoStyleObject, descriptor);
+                    process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed("pseudo (classes)", key), (0, import_log.log)({
+                      pseudoStyleObject,
+                      pseudoStyles
+                    }), console.groupEnd());
+                    var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
+                    try {
+                      for (var _iterator = pseudoStyles[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
+                        var psuedoStyle = _step.value, fullKey = "".concat(psuedoStyle.property).concat(PROP_SPLIT).concat(descriptor.name);
+                        fullKey in usedKeys || mergeClassName(transforms, classNames, fullKey, psuedoStyle.identifier, isMediaOrPseudo1, !0);
+                      }
+                    } catch (err) {
+                      _didIteratorError = !0, _iteratorError = err;
+                    } finally {
                       try {
-                        for (var _iterator = pseudoStyles[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
-                          var psuedoStyle = _step.value, fullKey = "".concat(psuedoStyle.property).concat(PROP_SPLIT).concat(descriptor.name);
-                          fullKey in usedKeys || mergeClassName(transforms, classNames, fullKey, psuedoStyle.identifier, isMediaOrPseudo1, !0);
-                        }
-                      } catch (err) {
-                        _didIteratorError = !0, _iteratorError = err;
+                        !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
                       } finally {
-                        try {
-                          !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
-                        } finally {
-                          if (_didIteratorError)
-                            throw _iteratorError;
-                        }
+                        if (_didIteratorError)
+                          throw _iteratorError;
                       }
                     }
-                    if (!shouldDoClasses || isExit || isEnter) {
-                      var descriptorKey = descriptor.stateKey || descriptor.name, isDisabled = componentState[descriptorKey] === !1;
-                      isExit && (isDisabled = !styleProps.isExiting), isEnter && (isDisabled = componentState.unmounted === "should-enter" ? !0 : !componentState.unmounted), process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed("pseudo", key, {
-                        isDisabled
-                      }), (0, import_log.log)({
-                        pseudoStyleObject,
-                        isDisabled,
-                        descriptor,
-                        componentState
-                      }), console.groupEnd());
-                      var importance = descriptor.priority;
-                      for (var pkey in pseudoStyleObject) {
-                        var val1 = pseudoStyleObject[pkey];
-                        if (isDisabled) {
-                          var defaultValues = animatableDefaults[pkey];
-                          defaultValues != null && !(pkey in usedKeys) && (!styleState.style || !(pkey in styleState.style)) && mergeStyle(styleState, pkey, defaultValues);
-                        } else {
-                          var curImportance = usedKeys[pkey] || 0, shouldMerge = importance >= curImportance;
-                          if (shouldMerge) {
-                            var _pseudos1, _key1;
-                            pseudos || (pseudos = {}), (_pseudos1 = pseudos)[_key1 = key] || (_pseudos1[_key1] = {}), pseudos[key][pkey] = val1, mergeStyle(styleState, pkey, val1);
-                          }
-                          process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("    subKey", pkey, shouldMerge, {
-                            importance,
-                            curImportance,
-                            pkey,
-                            val: val1,
-                            transforms: _object_spread2({}, styleState.transforms)
-                          });
+                  }
+                  if (!shouldDoClasses || isExit || isEnter) {
+                    var descriptorKey = descriptor.stateKey || descriptor.name, isDisabled = componentState[descriptorKey] === !1;
+                    isExit && (isDisabled = !styleProps.isExiting), isEnter && (isDisabled = componentState.unmounted === "should-enter" ? !0 : !componentState.unmounted), process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed("pseudo", key, {
+                      isDisabled
+                    }), (0, import_log.log)({
+                      pseudoStyleObject,
+                      isDisabled,
+                      descriptor,
+                      componentState
+                    }), console.groupEnd());
+                    var importance = descriptor.priority;
+                    for (var pkey in pseudoStyleObject) {
+                      var val1 = pseudoStyleObject[pkey];
+                      if (isDisabled) {
+                        var defaultValues = animatableDefaults[pkey];
+                        defaultValues != null && !(pkey in usedKeys) && (!styleState.style || !(pkey in styleState.style)) && mergeStyle(styleState, pkey, defaultValues);
+                      } else {
+                        var curImportance = usedKeys[pkey] || 0, shouldMerge = importance >= curImportance;
+                        if (shouldMerge) {
+                          var _pseudos1, _key1;
+                          pseudos || (pseudos = {}), (_pseudos1 = pseudos)[_key1 = key] || (_pseudos1[_key1] = {}), pseudos[key][pkey] = val1, mergeStyle(styleState, pkey, val1);
                         }
+                        process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("    subKey", pkey, shouldMerge, {
+                          importance,
+                          curImportance,
+                          pkey,
+                          val: val1
+                        });
                       }
-                      if (!isDisabled)
-                        for (var key1 in val) {
-                          var k1 = shorthands[key1] || key1;
-                          usedKeys[k1] = Math.max(importance, usedKeys[k1] || 0);
-                        }
                     }
-                    continue;
+                    if (!isDisabled)
+                      for (var key1 in val) {
+                        var k1 = shorthands[key1] || key1;
+                        usedKeys[k1] = Math.max(importance, usedKeys[k1] || 0);
+                      }
                   }
-                  if (isMedia) {
-                    if (!val)
+                  continue;
+                }
+                if (isMedia) {
+                  if (!val)
+                    continue;
+                  if (isMedia === "platform") {
+                    var platform = key.slice(10);
+                    if (
+                      // supports web, ios, android
+                      platform !== import_constants.currentPlatform && // supports web, native
+                      platform !== "native"
+                    )
                       continue;
-                    if (isMedia === "platform") {
-                      var platform = key.slice(10);
-                      if (
-                        // supports web, ios, android
-                        platform !== import_constants.currentPlatform && // supports web, native
-                        platform !== "native"
-                      )
-                        continue;
+                  }
+                  hasMedia || (hasMedia = !0);
+                  var mediaKeyShort = key.slice(1);
+                  process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("  \u{1F4FA} ".concat(key), {
+                    key,
+                    val,
+                    props,
+                    shouldDoClasses,
+                    acceptsClassName,
+                    componentState
+                  });
+                  var hasSpace = val.space;
+                  if ((hasSpace || !shouldDoClasses) && (Array.isArray(hasMedia) || (hasMedia = []), hasMedia.push(mediaKeyShort)), shouldDoClasses) {
+                    var mediaStyle = getSubStyle(styleState, key, val, !1);
+                    if (hasSpace && (delete mediaStyle.space, mediaState2[mediaKeyShort])) {
+                      var importance1 = (0, import_useMedia.getMediaImportanceIfMoreImportant)(mediaKeyShort, "space", usedKeys, !0);
+                      importance1 && (space = val.space, usedKeys.space = importance1, process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("Found more important space for current media ".concat(mediaKeyShort, ": ").concat(val, " (importance: ").concat(importance1, ")")));
                     }
-                    hasMedia || (hasMedia = !0);
-                    var mediaStyle = getSubStyle(
-                      styleState,
-                      key,
-                      val,
-                      // TODO try true like pseudo
-                      !1
-                    ), mediaKeyShort = key.slice(1);
-                    process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("  \u{1F4FA} ".concat(key), {
-                      key,
-                      val,
-                      mediaStyle,
-                      props,
-                      shouldDoClasses,
-                      acceptsClassName,
-                      componentState
-                    });
-                    var hasSpace = val.space;
-                    if ((hasSpace || !shouldDoClasses) && (Array.isArray(hasMedia) || (hasMedia = []), hasMedia.push(mediaKeyShort)), shouldDoClasses) {
-                      if (hasSpace && (delete mediaStyle.space, mediaState2[mediaKeyShort])) {
-                        var importance1 = (0, import_useMedia.getMediaImportanceIfMoreImportant)(mediaKeyShort, "space", usedKeys, !0);
-                        importance1 && (space = val.space, usedKeys.space = importance1, process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("Found more important space for current media ".concat(mediaKeyShort, ": ").concat(val, " (importance: ").concat(importance1, ")")));
+                    var mediaStyles = (0, import_getStylesAtomic.getStylesAtomic)(mediaStyle), priority = mediaStylesSeen;
+                    mediaStylesSeen += 1;
+                    var _iteratorNormalCompletion1 = !0, _didIteratorError1 = !1, _iteratorError1 = void 0;
+                    try {
+                      for (var _iterator1 = mediaStyles[Symbol.iterator](), _step1; !(_iteratorNormalCompletion1 = (_step1 = _iterator1.next()).done); _iteratorNormalCompletion1 = !0) {
+                        var style = _step1.value, out = (0, import_createMediaStyle.createMediaStyle)(style, mediaKeyShort, import_useMedia.mediaQueryConfig, isMedia, !1, priority);
+                        process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("\u{1F4FA} media style:", out);
+                        var fullKey1 = "".concat(style.property).concat(PROP_SPLIT).concat(mediaKeyShort).concat(style.pseudo || "");
+                        fullKey1 in usedKeys || mergeClassName(transforms, classNames, fullKey1, out.identifier, !0, !0);
                       }
-                      var mediaStyles = (0, import_getStylesAtomic.getStylesAtomic)(mediaStyle), priority = mediaStylesSeen;
-                      mediaStylesSeen += 1;
-                      var _iteratorNormalCompletion1 = !0, _didIteratorError1 = !1, _iteratorError1 = void 0;
+                    } catch (err) {
+                      _didIteratorError1 = !0, _iteratorError1 = err;
+                    } finally {
                       try {
-                        for (var _iterator1 = mediaStyles[Symbol.iterator](), _step1; !(_iteratorNormalCompletion1 = (_step1 = _iterator1.next()).done); _iteratorNormalCompletion1 = !0) {
-                          var style = _step1.value, out = (0, import_createMediaStyle.createMediaStyle)(style, mediaKeyShort, import_useMedia.mediaQueryConfig, isMedia, !1, priority);
-                          process.env.NODE_ENV === "development" && debug === "verbose" && (0, import_log.log)("\u{1F4FA} media style:", out);
-                          var fullKey1 = "".concat(style.property).concat(PROP_SPLIT).concat(mediaKeyShort).concat(style.pseudo || "");
-                          fullKey1 in usedKeys || mergeClassName(transforms, classNames, fullKey1, out.identifier, !0, !0);
-                        }
-                      } catch (err) {
-                        _didIteratorError1 = !0, _iteratorError1 = err;
+                        !_iteratorNormalCompletion1 && _iterator1.return != null && _iterator1.return();
                       } finally {
-                        try {
-                          !_iteratorNormalCompletion1 && _iterator1.return != null && _iterator1.return();
-                        } finally {
-                          if (_didIteratorError1)
-                            throw _iteratorError1;
-                        }
+                        if (_didIteratorError1)
+                          throw _iteratorError1;
                       }
-                    } else {
-                      var isThemeMedia = isMedia === "theme", isGroupMedia = isMedia === "group", isPlatformMedia = isMedia === "platform";
-                      if (!isThemeMedia && !isPlatformMedia && !isGroupMedia && !mediaState2[mediaKeyShort])
+                    }
+                  } else {
+                    var mediaStyle1 = getSubStyle(styleState, key, val, !0), isThemeMedia = isMedia === "theme", isGroupMedia = isMedia === "group", isPlatformMedia = isMedia === "platform";
+                    if (!isThemeMedia && !isPlatformMedia && !isGroupMedia && !mediaState2[mediaKeyShort])
+                      continue;
+                    var importanceBump = 0;
+                    if (isThemeMedia) {
+                      dynamicThemeAccess = !0;
+                      var mediaThemeName = mediaKeyShort.slice(6);
+                      if (!(themeName === mediaThemeName || themeName.startsWith(mediaThemeName)))
                         continue;
-                      var importanceBump = 0;
-                      if (isThemeMedia) {
-                        dynamicThemeAccess = !0;
-                        var mediaThemeName = mediaKeyShort.slice(6);
-                        if (!(themeName === mediaThemeName || themeName.startsWith(mediaThemeName)))
-                          continue;
-                      } else if (isGroupMedia) {
-                        var _componentState_group, groupInfo = (0, import_getGroupPropParts.getGroupPropParts)(mediaKeyShort), groupName = groupInfo.name, groupContext = context == null ? void 0 : context.groups.state[groupName];
-                        if (!groupContext) {
-                          process.env.NODE_ENV === "development" && debug && console.warn("No parent with group prop, skipping styles: ".concat(groupName));
+                    } else if (isGroupMedia) {
+                      var _componentState_group, groupInfo = (0, import_getGroupPropParts.getGroupPropParts)(mediaKeyShort), groupName = groupInfo.name, groupContext = context == null ? void 0 : context.groups.state[groupName];
+                      if (!groupContext) {
+                        process.env.NODE_ENV === "development" && debug && console.warn("No parent with group prop, skipping styles: ".concat(groupName));
+                        continue;
+                      }
+                      var groupPseudoKey = groupInfo.pseudo, groupMediaKey = groupInfo.media, componentGroupState = (_componentState_group = componentState.group) === null || _componentState_group === void 0 ? void 0 : _componentState_group[groupName];
+                      if (groupMediaKey) {
+                        mediaGroups || (mediaGroups = /* @__PURE__ */ new Set()), mediaGroups.add(groupMediaKey);
+                        var mediaState1 = componentGroupState == null ? void 0 : componentGroupState.media, isActive = mediaState1 == null ? void 0 : mediaState1[groupMediaKey];
+                        if (!mediaState1 && groupContext.layout && (isActive = (0, import_useMedia.mediaKeyMatch)(groupMediaKey, groupContext.layout)), !isActive)
                           continue;
-                        }
-                        var groupPseudoKey = groupInfo.pseudo, groupMediaKey = groupInfo.media, componentGroupState = (_componentState_group = componentState.group) === null || _componentState_group === void 0 ? void 0 : _componentState_group[groupName];
-                        if (groupMediaKey) {
-                          mediaGroups || (mediaGroups = /* @__PURE__ */ new Set()), mediaGroups.add(groupMediaKey);
-                          var mediaState1 = componentGroupState == null ? void 0 : componentGroupState.media, isActive = mediaState1 == null ? void 0 : mediaState1[groupMediaKey];
-                          if (!mediaState1 && groupContext.layout && (isActive = (0, import_useMedia.mediaKeyMatch)(groupMediaKey, groupContext.layout)), !isActive)
-                            continue;
-                          importanceBump = 2;
-                        }
-                        if (groupPseudoKey) {
-                          pseudoGroups || (pseudoGroups = /* @__PURE__ */ new Set()), pseudoGroups.add(groupName);
-                          var componentGroupPseudoState = (componentGroupState || // fallback to context initially
-                          context.groups.state[groupName]).pseudo, isActive1 = componentGroupPseudoState == null ? void 0 : componentGroupPseudoState[groupPseudoKey];
-                          if (!isActive1)
-                            continue;
-                          var priority1 = import_pseudoDescriptors.pseudoPriorities[groupPseudoKey];
-                          importanceBump = priority1;
-                        }
+                        importanceBump = 2;
                       }
-                      for (var subKey in mediaStyle) {
-                        var _styleState2;
-                        if (subKey === "space") {
-                          space = valInit.space;
+                      if (groupPseudoKey) {
+                        pseudoGroups || (pseudoGroups = /* @__PURE__ */ new Set()), pseudoGroups.add(groupName);
+                        var componentGroupPseudoState = (componentGroupState || // fallback to context initially
+                        context.groups.state[groupName]).pseudo, isActive1 = componentGroupPseudoState == null ? void 0 : componentGroupPseudoState[groupPseudoKey];
+                        if (!isActive1)
                           continue;
-                        }
-                        (_styleState2 = styleState).style || (_styleState2.style = {}), (0, import_useMedia.mergeMediaByImportance)(styleState.style, mediaKeyShort, subKey, mediaStyle[subKey], usedKeys, mediaState2[mediaKeyShort], importanceBump), key === "fontFamily" && (styleState.fontFamily = mediaStyle.fontFamily);
+                        var priority1 = import_pseudoDescriptors.pseudoPriorities[groupPseudoKey];
+                        importanceBump = priority1;
                       }
                     }
-                    continue;
-                  }
-                  if (key === "pointerEvents") {
-                    viewProps[key] = val;
-                    continue;
-                  }
-                  if (
-                    // is HOC we can just pass through the styles as props
-                    // this fixes issues where style prop got merged with wrong priority
-                    !isHOC && (isValidStyleKey(key, staticConfig) || import_constants.isAndroid && key === "elevation")
-                  ) {
-                    mergeStyle(styleState, key, val);
-                    continue;
+                    for (var subKey in mediaStyle1) {
+                      var _styleState2;
+                      if (subKey === "space") {
+                        space = valInit.space;
+                        continue;
+                      }
+                      (_styleState2 = styleState).style || (_styleState2.style = {}), mergeMediaByImportance(styleState, mediaKeyShort, subKey, mediaStyle1[subKey], usedKeys, mediaState2[mediaKeyShort], importanceBump), key === "fontFamily" && (styleState.fontFamily = mediaStyle1.fontFamily);
+                    }
                   }
-                  isVariant || (viewProps[key] = val);
+                  continue;
                 }
-              }
-              if (process.env.NODE_ENV === "development" && debug === "verbose") {
-                try {
-                  (0, import_log.log)(" \u2714\uFE0F expand complete", keyInit), (0, import_log.log)("style", _object_spread2({}, styleState.style)), (0, import_log.log)("transforms", _object_spread2({}, transforms)), (0, import_log.log)("viewProps", _object_spread2({}, viewProps));
-                } catch {
+                if (key === "pointerEvents") {
+                  viewProps[key] = val;
+                  continue;
                 }
-                console.groupEnd();
+                if (
+                  // is HOC we can just pass through the styles as props
+                  // this fixes issues where style prop got merged with wrong priority
+                  !isHOC && (isValidStyleKey(key, staticConfig) || import_constants.isAndroid && key === "elevation")
+                ) {
+                  mergeStyle(styleState, key, val);
+                  continue;
+                }
+                isVariant || (viewProps[key] = val);
+              }
+            }
+            if (process.env.NODE_ENV === "development" && debug === "verbose") {
+              try {
+                (0, import_log.log)(" \u2714\uFE0F expand complete", keyInit), (0, import_log.log)("style", _object_spread2({}, styleState.style)), (0, import_log.log)("transforms", _object_spread2({}, transforms)), (0, import_log.log)("viewProps", _object_spread2({}, viewProps));
+              } catch {
               }
+              console.groupEnd();
             }
           }
         }
@@ -8000,9 +7992,9 @@ current`, _object_spread2({}, styleState.style)));
         }
       var avoidNormalize = styleProps.noNormalize === !1;
       if (!avoidNormalize) {
-        if (styleState.style && ((0, import_expandStyles.fixStyles)(styleState.style), import_constants.isWeb && !staticConfig.isReactNative && (0, import_getStylesAtomic.styleToCSS)(styleState.style)), styleState.transforms) {
+        if (styleState.style && ((0, import_expandStyles.fixStyles)(styleState.style), import_constants.isWeb && !staticConfig.isReactNative && (0, import_getStylesAtomic.styleToCSS)(styleState.style)), styleState.flatTransforms) {
           var _styleState4;
-          (_styleState4 = styleState).style || (_styleState4.style = {}), Object.entries(styleState.transforms).sort(function(param, param1) {
+          (_styleState4 = styleState).style || (_styleState4.style = {}), Object.entries(styleState.flatTransforms).sort(function(param, param1) {
             var _param = _sliced_to_array(param, 1), a = _param[0], _param1 = _sliced_to_array(param1, 1), b = _param1[0];
             return a.localeCompare(b);
           }).forEach(function(param) {
@@ -8010,8 +8002,6 @@ current`, _object_spread2({}, styleState.style)));
             mergeTransform(styleState.style, key6, val4, !0);
           });
         }
-        if (0)
-          var _styleState_style;
         if (parentSplitStyles) {
           if (0)
             for (var key2 in parentSplitStyles.classNames)
@@ -8023,6 +8013,8 @@ current`, _object_spread2({}, styleState.style)));
             }
         }
       }
+      if (0)
+        var _styleState_style, shouldStringifyTransforms;
       if (0) {
         if (styleState.style && shouldDoClasses) {
           var retainedStyles, shouldRetain;
@@ -8120,7 +8112,7 @@ current`, _object_spread2({}, styleState.style)));
         classNames[key] = val, (_usedKeys = usedKeys)[_key = key] || (_usedKeys[_key] = 1);
       } else if (key in import_helpers.stylePropsTransform) {
         var _styleState;
-        (_styleState = styleState).transforms || (_styleState.transforms = {}), styleState.transforms[key] = val;
+        (_styleState = styleState).flatTransforms || (_styleState.flatTransforms = {}), styleState.flatTransforms[key] = val;
       } else {
         var shouldNormalize = import_constants.isWeb && !disableNormalize && !styleProps.noNormalize, out = shouldNormalize ? (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key) : val;
         if (
@@ -8191,6 +8183,10 @@ current`, _object_spread2({}, styleState.style)));
       } else
         viewProps[key] = val;
     }
+    function mergeMediaByImportance(styleState, mediaKey, key, value, importancesUsed, isSizeMedia, importanceBump) {
+      var importance = (0, import_useMedia.getMediaImportanceIfMoreImportant)(mediaKey, key, importancesUsed, isSizeMedia);
+      return importanceBump && (importance = (importance || 0) + importanceBump), importance === null ? !1 : (importancesUsed[key] = importance, mergeStyle(styleState, key, value), !0);
+    }
   }
 });
 
@@ -9360,7 +9356,7 @@ var require_createComponent_native = __commonJS({
         process.env.NODE_ENV === "development" && time && time(_templateObject4());
         var hasTextAncestor = !!(import_constants.isWeb && isText && componentContext.inText), _props_disabled, isDisabled = (_props_disabled = props.disabled) !== null && _props_disabled !== void 0 ? _props_disabled : (_props_accessibilityState = props.accessibilityState) === null || _props_accessibilityState === void 0 ? void 0 : _props_accessibilityState.disabled;
         process.env.NODE_ENV === "development" && time && time(_templateObject5());
-        var isTaggable = !Component || typeof Component == "string", element = import_constants.isWeb && isTaggable && props.tag || Component, BaseTextComponent = BaseText || element || "span", BaseViewComponent = BaseView || element || (hasTextAncestor ? "span" : "div"), elementType = isText ? BaseTextComponent : BaseViewComponent;
+        var isTaggable = !Component || typeof Component == "string", tagProp = props.tag, element = import_constants.isWeb && isTaggable && tagProp || Component, BaseTextComponent = BaseText || element || "span", BaseViewComponent = BaseView || element || (hasTextAncestor ? "span" : "div"), elementType = isText ? BaseTextComponent : BaseViewComponent;
         animationsConfig && isAnimated && (elementType = animationsConfig[isText ? "Text" : "View"] || elementType);
         var disableThemeProp = !1, disableTheme = disableThemeProp || isHOC;
         process.env.NODE_ENV === "development" && time && time(_templateObject6()), props.themeShallow && (curState.themeShallow = !0);
@@ -9455,7 +9451,7 @@ var require_createComponent_native = __commonJS({
           "theme",
           "defaultVariants"
         ]), viewProps = nonTamaguiProps;
-        isHOC && _themeProp && (viewProps.theme = _themeProp);
+        isHOC && _themeProp && (viewProps.theme = _themeProp), elementType.acceptTagProp && (viewProps.tag = tagProp);
         var animationStyles;
         if (
           // if it supports css vars we run it on server too to get matching initial style
@@ -9486,9 +9482,7 @@ If you meant to do this, you can disable this warning - either change untilMeasu
           }), !stateRef.current.hasMeasured && props.untilMeasured === "hide" && setState(function(prev) {
             return _object_spread2({}, prev);
           }), stateRef.current.hasMeasured = !0;
-        }));
-        var _hooks_usePropsTransform1;
-        viewProps = (_hooks_usePropsTransform1 = (_hooks_usePropsTransform = import_setupHooks.hooks.usePropsTransform) === null || _hooks_usePropsTransform === void 0 ? void 0 : _hooks_usePropsTransform.call(import_setupHooks.hooks, elementType, nonTamaguiProps, stateRef, curState.willHydrate)) !== null && _hooks_usePropsTransform1 !== void 0 ? _hooks_usePropsTransform1 : nonTamaguiProps, curState.composedRef || (curState.composedRef = (0, import_compose_refs.composeRefs)(function(x) {
+        })), viewProps = ((_hooks_usePropsTransform = import_setupHooks.hooks.usePropsTransform) === null || _hooks_usePropsTransform === void 0 ? void 0 : _hooks_usePropsTransform.call(import_setupHooks.hooks, elementType, nonTamaguiProps, stateRef, curState.willHydrate)) || nonTamaguiProps, curState.composedRef || (curState.composedRef = (0, import_compose_refs.composeRefs)(function(x) {
           return stateRef.current.host = x;
         }, forwardedRef)), viewProps.ref = curState.composedRef, process.env.NODE_ENV === "development" && !isReactNative && !isText && import_constants.isWeb && !isHOC && import_react3.Children.toArray(props.children).forEach(function(item) {
           typeof item == "string" && item !== `
@@ -9517,9 +9511,9 @@ If you meant to do this, you can disable this warning - either change untilMeasu
             };
             disposeGroupsListener = componentContext.groups.subscribe(function(name2, param) {
               var layout = param.layout, pseudo = param.pseudo, persist = function() {
+                var group = _object_spread_props(_object_spread2({}, state.group), _define_property2({}, name2, current));
                 setStateShallow({
-                  // force it to be referentially different so it always updates
-                  group: _object_spread_props(_object_spread2({}, state.group), _define_property2({}, name2, current))
+                  group
                 });
               };
               if (pseudo && pseudoGroups != null && pseudoGroups.has(name2))
@@ -9538,20 +9532,20 @@ If you meant to do this, you can disable this warning - either change untilMeasu
           pseudoGroups ? Object.keys(_to_consumable_array(pseudoGroups)).join("") : 0,
           mediaGroups ? Object.keys(_to_consumable_array(mediaGroups)).join("") : 0
         ]);
-        var runtimePressStyle = !disabled && noClassNames && (pseudos == null ? void 0 : pseudos.pressStyle), runtimeFocusStyle = !disabled && noClassNames && (pseudos == null ? void 0 : pseudos.focusStyle), attachFocus = !!(runtimePressStyle || runtimeFocusStyle || onFocus || onBlur), attachPress = !!(groupName || runtimePressStyle || onPress || onPressOut || onPressIn || onMouseDown || onMouseUp || onLongPress || onClick), runtimeHoverStyle = !disabled && noClassNames && (pseudos == null ? void 0 : pseudos.hoverStyle), needsHoverState = runtimeHoverStyle || onHoverIn || onHoverOut, isHoverable = import_constants.isWeb && !!(groupName || needsHoverState || onMouseEnter || onMouseLeave), shouldAttach = !!(attachFocus || attachPress || isHoverable || runtimePressStyle || runtimeHoverStyle || runtimeFocusStyle);
+        var runtimePressStyle = !disabled && noClassNames && (pseudos == null ? void 0 : pseudos.pressStyle), runtimeFocusStyle = !disabled && noClassNames && (pseudos == null ? void 0 : pseudos.focusStyle), attachFocus = !!(runtimePressStyle || runtimeFocusStyle || onFocus || onBlur), attachPress = !!(groupName || runtimePressStyle || onPress || onPressOut || onPressIn || onMouseDown || onMouseUp || onLongPress || onClick), runtimeHoverStyle = !disabled && noClassNames && (pseudos == null ? void 0 : pseudos.hoverStyle), needsHoverState = !!(groupName || runtimeHoverStyle || onHoverIn || onHoverOut), attachHover = import_constants.isWeb && !!(groupName || needsHoverState || onMouseEnter || onMouseLeave), shouldAttach = !!(attachFocus || attachPress || attachHover || runtimePressStyle || runtimeHoverStyle || runtimeFocusStyle), needsPressState = !!(groupName || runtimeHoverStyle);
         process.env.NODE_ENV === "development" && time && time(_templateObject14());
         var events = shouldAttach && !isDisabled && !props.asChild ? _object_spread2(_object_spread_props(_object_spread2({
           onPressOut: attachPress ? function(e) {
             unPress(), onPressOut == null || onPressOut(e), onMouseUp == null || onMouseUp(e);
           } : void 0
-        }, (isHoverable || attachPress) && {
+        }, (attachHover || attachPress) && {
           onMouseEnter: function(e) {
             var next = {};
-            needsHoverState && (next.hover = !0), runtimePressStyle && state.pressIn && (next.press = !0), setStateShallow(next), onHoverIn == null || onHoverIn(e), onMouseEnter == null || onMouseEnter(e);
+            needsHoverState && (next.hover = !0), needsPressState && state.pressIn && (next.press = !0), setStateShallow(next), onHoverIn == null || onHoverIn(e), onMouseEnter == null || onMouseEnter(e);
           },
           onMouseLeave: function(e) {
             var next = {};
-            mouseUps.add(unPress), needsHoverState && (next.hover = !1), runtimePressStyle && state.pressIn && (next.press = !1, next.pressIn = !1), setStateShallow(next), onHoverOut == null || onHoverOut(e), onMouseLeave == null || onMouseLeave(e);
+            mouseUps.add(unPress), needsHoverState && (next.hover = !1), needsPressState && state.pressIn && (next.press = !1, next.pressIn = !1), setStateShallow(next), onHoverOut == null || onHoverOut(e), onMouseLeave == null || onMouseLeave(e);
           }
         }), {
           onPressIn: attachPress ? function(e) {
@@ -9594,7 +9588,7 @@ If you meant to do this, you can disable this warning - either change untilMeasu
         }
         process.env.NODE_ENV === "development" && time && time(_templateObject15()), process.env.NODE_ENV === "development" && debugProp === "verbose" && (0, import_log.log)("events", {
           events,
-          isHoverable,
+          attachHover,
           attachPress
         }), (_hooks_useEvents = import_setupHooks.hooks.useEvents) === null || _hooks_useEvents === void 0 || _hooks_useEvents.call(import_setupHooks.hooks, viewProps, events, splitStyles, setStateShallow, staticConfig);
         var direction = props.spaceDirection || "both";