@tamagui/web 1.13.3 → 1.14.0

package/dist/esm/helpers/getSplitStyles.mjs

@@ -1,867 +1,4 @@
-import {
-  isClient,
-  isRSC,
-  isServer,
-  isWeb,
-  useIsomorphicLayoutEffect
-} from "@tamagui/constants";
-import {
-  stylePropsFont,
-  stylePropsText,
-  stylePropsTransform,
-  validPseudoKeys,
-  validStyles,
-  validStylesOnBaseProps
-} from "@tamagui/helpers";
-import { useInsertionEffect } from "react";
-import { getConfig, getFont } from "../config.js";
-import { isDevTools } from "../constants/isDevTools.js";
-import {
-  getMediaImportanceIfMoreImportant,
-  mediaState as globalMediaState,
-  mediaKeysWithAndWithout$,
-  mediaQueryConfig,
-  mergeMediaByImportance
-} from "../hooks/useMedia.js";
-import { createMediaStyle } from "./createMediaStyle.js";
-import { getPropMappedFontFamily } from "./createPropMapper.js";
-import { fixStyles } from "./expandStyles.js";
-import { getAtomicStyle, getStylesAtomic, styleToCSS } from "./getStylesAtomic";
-import {
-  insertStyleRules,
-  insertedTransforms,
-  scanAllSheets,
-  shouldInsertStyleRules,
-  updateRules
-} from "./insertStyleRule.js";
-import {
-  normalizeValueWithProperty,
-  reverseMapClassNameToValue
-} from "./normalizeValueWithProperty.js";
-import { pseudoDescriptors } from "./pseudoDescriptors.js";
-const skipProps = {
-  animation: true,
-  space: true,
-  animateOnly: true,
-  debug: true,
-  componentName: true,
-  tag: true
-};
-if (process.env.NODE_ENV === "test") {
-  skipProps["data-test-renders"] = true;
-}
-const IS_STATIC = process.env.IS_STATIC === "is_static";
-if (process.env.TAMAGUI_TARGET === "native") {
-  Object.assign(skipProps, {
-    whiteSpace: true,
-    wordWrap: true,
-    textOverflow: true,
-    textDecorationDistance: true,
-    cursor: true,
-    contain: true,
-    boxSizing: true,
-    boxShadow: true
-  });
-}
-const accessibilityDirectMap = {};
-if (process.env.TAMAGUI_TARGET === "web") {
-  const items = {
-    Hidden: true,
-    ActiveDescendant: true,
-    Atomic: true,
-    AutoComplete: true,
-    Busy: true,
-    Checked: true,
-    ColumnCount: "colcount",
-    ColumnIndex: "colindex",
-    ColumnSpan: "colspan",
-    Current: true,
-    Details: true,
-    ErrorMessage: true,
-    Expanded: true,
-    HasPopup: true,
-    Invalid: true,
-    Label: true,
-    Level: true,
-    Modal: true,
-    Multiline: true,
-    MultiSelectable: true,
-    Orientation: true,
-    Owns: true,
-    Placeholder: true,
-    PosInSet: true,
-    Pressed: true,
-    RoleDescription: true,
-    RowCount: true,
-    RowIndex: true,
-    RowSpan: true,
-    Selected: true,
-    SetSize: true,
-    Sort: true,
-    ValueMax: true,
-    ValueMin: true,
-    ValueNow: true,
-    ValueText: true
-  };
-  for (const key in items) {
-    let val = items[key];
-    if (val === true) {
-      val = key.toLowerCase();
-    }
-    accessibilityDirectMap[`accessibility${key}`] = `aria-${val}`;
-  }
-}
-let conf;
-const PROP_SPLIT = "-";
-const accessibilityRoleToWebRole = {
-  adjustable: "slider",
-  header: "heading",
-  image: "img",
-  link: "link",
-  none: "presentation",
-  summary: "region"
-};
-const isMediaKey = (key) => Boolean(key[0] === "$" && mediaKeysWithAndWithout$.has(key));
-const getSplitStyles = (props, staticConfig, theme, state, parentSplitStyles, languageContext, elementType, debug) => {
-  var _a, _b, _c;
-  if (cache.has(props)) {
-    return cache.get(props);
-  }
-  conf = conf || getConfig();
-  const { shorthands } = conf;
-  const { variants, propMapper, isReactNative, inlineProps, inlineWhenUnflattened } = staticConfig;
-  const validStyleProps = staticConfig.isText ? stylePropsText : validStyles;
-  const viewProps = {};
-  let pseudos = null;
-  let psuedosUsed = null;
-  const mediaState = state.mediaState || globalMediaState;
-  const usedKeys = {};
-  const propKeys = Object.keys(props);
-  let space = props.space;
-  let hasMedia = false;
-  const shouldDoClasses = staticConfig.acceptsClassName && (isWeb || IS_STATIC) && !state.noClassNames;
-  let style = {};
-  const flatTransforms = {};
-  const len = propKeys.length;
-  const rulesToInsert = [];
-  const classNames = {};
-  let className = "";
-  const transforms = {};
-  let fontFamily;
-  const styleState = {
-    classNames,
-    conf,
-    props,
-    state,
-    staticConfig,
-    style,
-    theme,
-    usedKeys,
-    viewProps,
-    languageContext
-  };
-  if (process.env.NODE_ENV === "development" && debug === "verbose") {
-    console.groupCollapsed("getSplitStyles (looping backwards)");
-    console.log({ props, staticConfig, shouldDoClasses, state, IS_STATIC, propKeys, styleState });
-    console.groupEnd();
-  }
-  if (props.className) {
-    for (const cn of props.className.split(" ")) {
-      if (cn[0] === "_") {
-        const [shorthand, mediaOrPseudo] = cn.slice(1).split("-");
-        const isMedia = mediaOrPseudo[0] === "_";
-        const isPseudo = mediaOrPseudo[0] === "0";
-        const isMediaOrPseudo = isMedia || isPseudo;
-        let fullKey = shorthands[shorthand];
-        if (isMedia) {
-          let mediaShortKey = mediaOrPseudo.slice(1);
-          mediaShortKey = mediaShortKey.slice(0, mediaShortKey.indexOf("_"));
-          fullKey += `${PROP_SPLIT}${mediaShortKey}`;
-        } else if (isPseudo) {
-          const pseudoShortKey = mediaOrPseudo.slice(1);
-          fullKey += `${PROP_SPLIT}${pseudoShortKey}`;
-        }
-        usedKeys[fullKey] = 1;
-        mergeClassName(transforms, classNames, fullKey, cn, isMediaOrPseudo);
-      } else if (cn) {
-        className += ` ${cn}`;
-      }
-    }
-  }
-  const specialProps = [];
-  function processProp(keyInit, valInit, special = false, fontFamilyOverride = null) {
-    var _a2;
-    if (keyInit === "className")
-      return;
-    if (keyInit in shorthands) {
-      keyInit = shorthands[keyInit];
-    }
-    if (process.env.TAMAGUI_TARGET === "native") {
-      if (keyInit === "userSelect") {
-        keyInit = "selectable";
-        valInit = valInit === "none" ? false : true;
-      } else if (keyInit.startsWith("data-") || keyInit.startsWith("aria-")) {
-        return;
-      }
-    }
-    if (!staticConfig.isHOC) {
-      if (keyInit in skipProps) {
-        return;
-      }
-    }
-    if (keyInit in usedKeys) {
-      return;
-    }
-    if (typeof valInit === "string" && valInit[0] === "_") {
-      if (keyInit in validStyleProps || keyInit.includes("-")) {
-        if (shouldDoClasses) {
-          classNames[keyInit] = valInit;
-        } else {
-          style[keyInit] = reverseMapClassNameToValue(keyInit, valInit);
-        }
-        usedKeys[keyInit] = 1;
-        return;
-      }
-    }
-    if (keyInit === "dataSet") {
-      for (const key in valInit) {
-        viewProps[`data-${hyphenate(key)}`] = valInit[key];
-      }
-      return;
-    }
-    const isMainStyle = keyInit === "style";
-    if (isMainStyle || keyInit.startsWith("_style")) {
-      if (!valInit)
-        return;
-      const styles = Array.isArray(valInit) ? valInit : [valInit];
-      const styleLen = styles.length;
-      for (let j = styleLen; j >= 0; j--) {
-        const cur = styles[j];
-        if (!cur)
-          continue;
-        for (const key in cur) {
-          if (!isMainStyle && usedKeys[key]) {
-            continue;
-          }
-          usedKeys[key] = 1;
-          style[key] = cur[key];
-        }
-      }
-      return;
-    }
-    if (process.env.TAMAGUI_TARGET === "web") {
-      if (keyInit === "disabled" && valInit === true) {
-        usedKeys[keyInit] = 1;
-        viewProps["aria-disabled"] = true;
-        if (elementType === "button" || elementType === "form" || elementType === "input" || elementType === "select" || elementType === "textarea") {
-          viewProps.disabled = true;
-        }
-        if (!(variants == null ? void 0 : variants.disabled)) {
-          return;
-        }
-      }
-      if (keyInit === "testID") {
-        usedKeys[keyInit] = 1;
-        viewProps[isReactNative ? "testId" : "data-testid"] = valInit;
-        return;
-      }
-      if (keyInit === "id" || keyInit === "nativeID") {
-        usedKeys[keyInit] = 1;
-        if (isReactNative) {
-          viewProps.nativeID = valInit;
-        } else {
-          viewProps.id = valInit;
-        }
-        return;
-      }
-      let didUseKeyInit = false;
-      if (isReactNative) {
-        if (accessibilityDirectMap[keyInit] || keyInit.startsWith("accessibility")) {
-          viewProps[keyInit] = valInit;
-          usedKeys[keyInit] = 1;
-          return;
-        }
-      } else {
-        didUseKeyInit = true;
-        if (accessibilityDirectMap[keyInit]) {
-          viewProps[accessibilityDirectMap[keyInit]] = valInit;
-        } else {
-          switch (keyInit) {
-            case "accessibilityRole": {
-              if (valInit === "none") {
-                viewProps.role = "presentation";
-              } else {
-                viewProps.role = accessibilityRoleToWebRole[valInit] || valInit;
-              }
-              return;
-            }
-            case "accessibilityLabelledBy":
-            case "accessibilityFlowTo":
-            case "accessibilityControls":
-            case "accessibilityDescribedBy": {
-              viewProps[`aria-${keyInit.replace("accessibility", "").toLowerCase()}`] = processIDRefList(valInit);
-              return;
-            }
-            case "accessibilityKeyShortcuts": {
-              if (Array.isArray(valInit)) {
-                viewProps["aria-keyshortcuts"] = valInit.join(" ");
-              }
-              return;
-            }
-            case "accessibilityLiveRegion": {
-              viewProps["aria-live"] = valInit === "none" ? "off" : valInit;
-              return;
-            }
-            case "accessibilityReadOnly": {
-              viewProps["aria-readonly"] = valInit;
-              if (elementType === "input" || elementType === "select" || elementType === "textarea") {
-                viewProps.readOnly = true;
-              }
-              return;
-            }
-            case "accessibilityRequired": {
-              viewProps["aria-required"] = valInit;
-              if (elementType === "input" || elementType === "select" || elementType === "textarea") {
-                viewProps.required = valInit;
-              }
-              return;
-            }
-            default: {
-              didUseKeyInit = false;
-            }
-          }
-        }
-      }
-      if (didUseKeyInit) {
-        usedKeys[keyInit] = 1;
-        return;
-      }
-      if (valInit && valInit[0] === "_") {
-        const isValidClassName = keyInit in validStyles;
-        const isMediaOrPseudo = !isValidClassName && keyInit.includes(PROP_SPLIT) && validStyles[keyInit.split(PROP_SPLIT)[0]];
-        if (isValidClassName || isMediaOrPseudo) {
-          usedKeys[keyInit] = 1;
-          if (process.env.NODE_ENV === "development" && debug) {
-            console.log("tamagui classname props", keyInit, valInit);
-          }
-          mergeClassName(transforms, classNames, keyInit, valInit, isMediaOrPseudo);
-          return;
-        }
-      }
-    }
-    let isMedia = isMediaKey(keyInit);
-    let isPseudo = keyInit in validPseudoKeys;
-    const isVariant = variants && keyInit in variants;
-    const shouldPassProp = !(isMedia || isPseudo || isVariant || keyInit in validStyleProps || keyInit in shorthands);
-    const parentHasVariant = ((_a2 = staticConfig.parentStaticConfig) == null ? void 0 : _a2.variants) && keyInit in staticConfig.parentStaticConfig;
-    const isHOCShouldPassThrough = staticConfig.isHOC && (isMedia || isPseudo);
-    const shouldPassThrough = shouldPassProp || isHOCShouldPassThrough || parentHasVariant;
-    if (process.env.NODE_ENV === "development" && debug === "verbose" && shouldPassThrough) {
-      console.log(`  \u{1F539} pass through ${keyInit}`);
-    }
-    if (shouldPassThrough) {
-      usedKeys[keyInit] = 1;
-      viewProps[keyInit] = valInit;
-      if (!isVariant) {
-        return;
-      }
-    }
-    if (process.env.NODE_ENV === "development" && debug === "verbose") {
-      console.groupCollapsed("  \u{1F539} styles", keyInit, valInit);
-    }
-    const expanded = isMedia || isPseudo ? [[keyInit, valInit]] : propMapper(
-      keyInit,
-      valInit,
-      theme,
-      special ? { ...props, fontFamily: fontFamilyOverride } : props,
-      state,
-      languageContext,
-      void 0,
-      debug
-    );
-    if (!fontFamily) {
-      fontFamily = getPropMappedFontFamily(expanded);
-    }
-    if (process.env.NODE_ENV === "development" && debug === "verbose") {
-      if (!isServer && isDevTools) {
-        console.log("expanded", expanded, "\nusedKeys", usedKeys, "\ncurrent", {
-          ...style
-        });
-      }
-      console.groupEnd();
-    }
-    if (!expanded)
-      return;
-    for (const [key, val] of expanded) {
-      if (val === void 0)
-        continue;
-      if (key in stylePropsFont && !special && key !== "fontFamily") {
-        specialProps.push([key, val]);
-        continue;
-      }
-      isMedia = isMediaKey(key);
-      isPseudo = key in validPseudoKeys;
-      const isMediaOrPseudo = isMedia || isPseudo;
-      if (!isMediaOrPseudo && usedKeys[key]) {
-        if (process.env.NODE_ENV === "developmnet" && debug === "verbose") {
-          console.log(`Used media/pseudo ${key}`);
-        }
-        continue;
-      }
-      if ((inlineProps == null ? void 0 : inlineProps.has(key)) || (inlineWhenUnflattened == null ? void 0 : inlineWhenUnflattened.has(key))) {
-        usedKeys[key] = 1;
-        viewProps[key] = props[key] ?? val;
-      }
-      if (isPseudo) {
-        if (!val)
-          continue;
-        const pseudoStyleObject = getSubStyle(
-          styleState,
-          key,
-          val,
-          true,
-          state.noClassNames
-        );
-        const descriptor = pseudoDescriptors[key];
-        const isEnter = descriptor.name === "enter";
-        const isExit = descriptor.name === "exit";
-        if (!descriptor || isExit && !state.isExiting) {
-          continue;
-        }
-        if (!shouldDoClasses || IS_STATIC) {
-          pseudos ||= {};
-          pseudos[key] ||= {};
-          Object.assign(pseudos[key], pseudoStyleObject);
-        }
-        if (shouldDoClasses && !isEnter && !isExit) {
-          const pseudoStyles = getAtomicStyle(pseudoStyleObject, descriptor);
-          for (const psuedoStyle of pseudoStyles) {
-            const fullKey = `${psuedoStyle.property}${PROP_SPLIT}${descriptor.name}`;
-            if (!usedKeys[fullKey]) {
-              usedKeys[fullKey] = 1;
-              addStyleToInsertRules(rulesToInsert, psuedoStyle);
-              mergeClassName(
-                transforms,
-                classNames,
-                fullKey,
-                psuedoStyle.identifier,
-                isMediaOrPseudo
-              );
-            }
-          }
-        } else {
-          if (usedKeys[key]) {
-            continue;
-          }
-          let isDisabled = !state[descriptor.stateKey || descriptor.name];
-          if (isWeb && !isClient && isEnter) {
-            isDisabled = false;
-          }
-          if (!isDisabled) {
-            if (valInit === staticConfig.defaultProps[keyInit]) {
-            } else {
-              usedKeys[key] ||= 1;
-              if (process.env.NODE_ENV === "development" && debug === "verbose") {
-                console.log(`Setting used ${key}`);
-              }
-            }
-          }
-          psuedosUsed ||= {};
-          const importance = descriptor.priority;
-          for (const pkey in pseudoStyleObject) {
-            const val2 = pseudoStyleObject[pkey];
-            if (isDisabled) {
-              if (!(pkey in usedKeys) && pkey in animatableDefaults) {
-                const defaultVal = animatableDefaults[pkey];
-                mergeStyle(styleState, flatTransforms, pkey, defaultVal, true);
-              }
-              continue;
-            }
-            const curImportance = psuedosUsed[importance] || 0;
-            const shouldMerge = importance >= curImportance;
-            if (shouldMerge) {
-              psuedosUsed[pkey] = importance;
-              pseudos ||= {};
-              pseudos[key] ||= {};
-              pseudos[key][pkey] = val2;
-              mergeStyle(styleState, flatTransforms, pkey, val2);
-            }
-            if (process.env.NODE_ENV === "development" && debug === "verbose") {
-              console.log("    merge pseudo?", keyInit, shouldMerge, { importance, curImportance, pkey, val: val2 });
-            }
-          }
-        }
-        continue;
-      }
-      if (isMedia) {
-        if (!val)
-          continue;
-        hasMedia ||= true;
-        const mediaStyle = getSubStyle(
-          styleState,
-          key,
-          val,
-          // TODO try true like pseudo
-          false
-        );
-        const mediaKeyShort = key.slice(1);
-        if (process.env.NODE_ENV === "development" && debug === "verbose") {
-          console.log(`  \u{1F4FA} ${key}`, { key, mediaStyle, props, shouldDoClasses });
-        }
-        if ("space" in mediaStyle) {
-          if (!Array.isArray(hasMedia)) {
-            hasMedia = [];
-          }
-          hasMedia.push(mediaKeyShort);
-        }
-        if (shouldDoClasses) {
-          if ("space" in mediaStyle) {
-            delete mediaStyle["space"];
-            if (mediaState[mediaKeyShort]) {
-              const val2 = valInit.space;
-              const importance = getMediaImportanceIfMoreImportant(
-                mediaKeyShort,
-                "space",
-                usedKeys
-              );
-              if (importance) {
-                space = val2;
-                usedKeys["space"] = importance;
-                if (process.env.NODE_ENV === "development" && debug === "verbose") {
-                  console.log(
-                    `Found more important space for current media ${mediaKeyShort}: ${val2} (importance: ${importance})`
-                  );
-                }
-              }
-            }
-          }
-          const mediaStyles = getStylesAtomic(mediaStyle);
-          for (const style2 of mediaStyles) {
-            const out = createMediaStyle(style2, mediaKeyShort, mediaQueryConfig);
-            const fullKey = `${style2.property}${PROP_SPLIT}${mediaKeyShort}`;
-            if (!usedKeys[fullKey]) {
-              usedKeys[fullKey] = 1;
-              addStyleToInsertRules(rulesToInsert, out);
-              mergeClassName(transforms, classNames, fullKey, out.identifier, true);
-            }
-          }
-        } else if (mediaState[mediaKeyShort]) {
-          for (const subKey in mediaStyle) {
-            const importance = getMediaImportanceIfMoreImportant(
-              mediaKeyShort,
-              subKey,
-              usedKeys
-            );
-            if (importance === null)
-              continue;
-            if (subKey === "space") {
-              space = valInit.space;
-              continue;
-            }
-            mergeMediaByImportance(
-              style,
-              mediaKeyShort,
-              subKey,
-              mediaStyle[subKey],
-              usedKeys
-            );
-            if (key === "fontFamily") {
-              fontFamily = mediaStyle.fontFamily;
-            }
-          }
-        }
-        continue;
-      }
-      if (process.env.TAMAGUI_TARGET === "native") {
-        if (key === "pointerEvents") {
-          usedKeys[key] = 1;
-          viewProps[key] = val;
-          continue;
-        }
-      }
-      if (key === "fontFamily" && !fontFamily && valInit && val) {
-        fontFamily = valInit[0] === "$" ? valInit : val;
-      }
-      if (key in validStyleProps) {
-        mergeStyle(styleState, flatTransforms, key, val);
-        continue;
-      }
-      if (!variants || !(key in variants)) {
-        if (!(key in skipProps)) {
-          viewProps[key] = val;
-          usedKeys[key] = 1;
-        }
-      }
-    }
-  }
-  for (let i = len - 1; i >= 0; i--) {
-    const keyInit = propKeys[i];
-    const valInit = props[keyInit];
-    processProp(keyInit, valInit);
-  }
-  for (let i = 0; i < specialProps.length; i++) {
-    const [key, value] = specialProps[i];
-    processProp(key, value, true, fontFamily);
-  }
-  fixStyles(style);
-  if (isWeb) {
-    styleToCSS(style);
-  }
-  if (process.env.TAMAGUI_TARGET === "native") {
-    if ("fontFamily" in style && style.fontFamily) {
-      const faceInfo = (_a = getFont(style.fontFamily)) == null ? void 0 : _a.face;
-      if (faceInfo) {
-        const overrideFace = (_c = (_b = faceInfo[style.fontWeight]) == null ? void 0 : _b[style.fontStyle || "normal"]) == null ? void 0 : _c.val;
-        if (overrideFace) {
-          style.fontFamily = overrideFace;
-          fontFamily = overrideFace;
-          delete style.fontWeight;
-          delete style.fontStyle;
-        }
-      }
-      if (process.env.NODE_ENV === "development") {
-        if (debug) {
-          console.log(`Found fontFamily native: ${style.fontFamily}`, faceInfo);
-        }
-      }
-    }
-  }
-  if (flatTransforms) {
-    if (process.env.NODE_ENV === "development" && debug) {
-      console.log(
-        "Merging flat transforms, transform before",
-        [...style.transform || []],
-        flatTransforms
-      );
-    }
-    mergeTransforms(style, flatTransforms, true);
-  }
-  if (parentSplitStyles) {
-    if (process.env.TAMAGUI_TARGET === "web") {
-      if (shouldDoClasses) {
-        for (const key in parentSplitStyles.classNames) {
-          const val = parentSplitStyles.classNames[key];
-          if (key in style || key in classNames)
-            continue;
-          classNames[key] = val;
-        }
-      }
-    }
-    if (!shouldDoClasses) {
-      for (const key in parentSplitStyles.style) {
-        if (key in classNames || key in style)
-          continue;
-        style[key] = parentSplitStyles.style[key];
-      }
-    }
-  }
-  if (process.env.TAMAGUI_TARGET === "web") {
-    if (shouldDoClasses) {
-      const retainedStyles = {};
-      if (style["$$css"]) {
-      } else {
-        const atomic = getStylesAtomic(style);
-        for (const atomicStyle of atomic) {
-          const key = atomicStyle.property;
-          if (props.animateOnly && props.animateOnly.includes(key)) {
-            retainedStyles[key] = atomicStyle.value;
-          } else {
-            addStyleToInsertRules(rulesToInsert, atomicStyle);
-            mergeClassName(transforms, classNames, key, atomicStyle.identifier);
-          }
-        }
-        if (!IS_STATIC) {
-          style = retainedStyles;
-        }
-      }
-    }
-    if (transforms) {
-      for (const namespace in transforms) {
-        if (!transforms[namespace]) {
-          if (process.env.NODE_ENV === "development") {
-            console.warn("Error no transform", transforms, namespace);
-          }
-          continue;
-        }
-        const [hash, val] = transforms[namespace];
-        const identifier = `_transform${hash}`;
-        if (isClient && !insertedTransforms[identifier]) {
-          const rule = `.${identifier} { transform: ${val}; }`;
-          addStyleToInsertRules(rulesToInsert, {
-            identifier,
-            rules: [rule],
-            property: namespace
-          });
-        }
-        classNames[namespace] = identifier;
-      }
-    }
-  }
-  const nextViewProps = {};
-  const ks = Object.keys(viewProps);
-  const l = ks.length;
-  for (let i = l - 1; i >= 0; i--) {
-    nextViewProps[ks[i]] = viewProps[ks[i]];
-  }
-  const result = {
-    space,
-    hasMedia,
-    fontFamily,
-    viewProps: nextViewProps,
-    style,
-    pseudos,
-    classNames,
-    rulesToInsert
-  };
-  if (className) {
-    classNames.className = className;
-  }
-  if (process.env.NODE_ENV === "development" && debug === "verbose") {
-    if (isDevTools) {
-      console.groupCollapsed("  \u{1F539} styles =>");
-      const logs = { ...result, state, etc: { transforms, viewProps, rulesToInsert, parentSplitStyles, flatTransforms } };
-      for (const key in logs) {
-        console.log(key, logs[key]);
-      }
-      console.groupEnd();
-    }
-  }
-  cache.set(props, result);
-  return result;
-};
-function mergeClassName(transforms, classNames, key, val, isMediaOrPseudo = false) {
-  if (process.env.TAMAGUI_TARGET === "web") {
-    if (!val)
-      return;
-    if (val[0] === "_" && val.startsWith("_transform-")) {
-      const ns = isMediaOrPseudo ? key : "transform";
-      let transform = insertedTransforms[val];
-      if (isClient && !transform) {
-        scanAllSheets();
-        transform = insertedTransforms[val];
-        if (!transform && isWeb && val[0] !== "_") {
-          transform = val;
-        }
-      }
-      transforms[ns] ||= ["", ""];
-      transforms[ns][0] += val.replace("_transform", "");
-      if (transform) {
-        transforms[ns][1] += transform;
-      }
-    } else {
-      classNames[key] = val;
-    }
-  }
-}
-const cache = /* @__PURE__ */ new WeakMap();
-function getSubStyleProps(defaultProps, baseProps, specificProps) {
-  const key = specificProps || baseProps;
-  if (!cache.has(key)) {
-    cache.set(key, {
-      ...defaultProps,
-      ...baseProps,
-      ...specificProps
-    });
-  }
-  return cache.get(key);
-}
-function mergeStyle({ usedKeys, classNames, viewProps, style }, flatTransforms, key, val, dontSetUsed = false) {
-  if (!dontSetUsed) {
-    usedKeys[key] ||= 1;
-  }
-  if (val && val[0] === "_") {
-    classNames[key] = val;
-  } else if (key in stylePropsTransform) {
-    flatTransforms ||= {};
-    flatTransforms[key] = val;
-  } else {
-    const out = normalizeValueWithProperty(val, key);
-    if (key in validStylesOnBaseProps) {
-      viewProps[key] = out;
-    } else {
-      style[key] = out;
-    }
-  }
-}
-const getSubStyle = (styleState, subKey, styleIn, avoidDefaultProps, avoidMergeTransform) => {
-  const { staticConfig, theme, props, state, conf: conf2, languageContext } = styleState;
-  const styleOut = {};
-  for (let key in styleIn) {
-    const val = styleIn[key];
-    key = conf2.shorthands[key] || key;
-    const expanded = staticConfig.propMapper(
-      key,
-      val,
-      theme,
-      getSubStyleProps(staticConfig.defaultProps, props, props[subKey]),
-      state,
-      languageContext,
-      avoidDefaultProps
-    );
-    if (!expanded)
-      continue;
-    for (const [skey, sval] of expanded) {
-      if (!avoidMergeTransform && skey in stylePropsTransform) {
-        mergeTransform(styleOut, skey, sval);
-      } else {
-        styleOut[skey] = normalizeValueWithProperty(sval, key);
-      }
-    }
-  }
-  fixStyles(styleOut);
-  return styleOut;
-};
-const useInsertEffectCompat = isWeb ? useInsertionEffect || useIsomorphicLayoutEffect : () => {
-};
-const useSplitStyles = (...args) => {
-  const res = getSplitStyles(...args);
-  if (!isRSC) {
-    useInsertEffectCompat(() => {
-      insertStyleRules(res.rulesToInsert);
-    }, [res.rulesToInsert]);
-  }
-  return res;
-};
-function addStyleToInsertRules(rulesToInsert, styleObject) {
-  if (process.env.TAMAGUI_TARGET === "web") {
-    if (!shouldInsertStyleRules(styleObject.identifier)) {
-      return;
-    }
-    updateRules(styleObject.identifier, styleObject.rules);
-    rulesToInsert.push(styleObject);
-  }
-}
-function processIDRefList(idRefList) {
-  return Array.isArray(idRefList) ? idRefList.join(" ") : idRefList;
-}
-const animatableDefaults = {
-  opacity: 1,
-  scale: 1,
-  rotate: "0deg",
-  rotateY: "0deg",
-  rotateX: "0deg"
-};
-const lowercaseHyphenate = (match) => `-${match.toLowerCase()}`;
-const hyphenate = (str) => str.replace(/[A-Z]/g, lowercaseHyphenate);
-const mergeTransform = (obj, key, val, backwards = false) => {
-  obj.transform ||= [];
-  obj.transform[backwards ? "unshift" : "push"]({
-    [mapTransformKeys[key] || key]: val
-  });
-};
-const mergeTransforms = (obj, flatTransforms, backwards = false) => {
-  Object.entries(flatTransforms).forEach(([key, val]) => {
-    mergeTransform(obj, key, val, backwards);
-  });
-};
-const mapTransformKeys = {
-  x: "translateX",
-  y: "translateY"
-};
-export {
-  PROP_SPLIT,
-  getSplitStyles,
-  getSubStyle,
-  useSplitStyles
-};
+import{isClient as le,isRSC as We,isServer as Le,isWeb as z,useIsomorphicLayoutEffect as Ue}from"@tamagui/constants";import{stylePropsFont as He,stylePropsText as Be,stylePropsTransform as Ne,validPseudoKeys as Ae,validStyles as fe,validStylesOnBaseProps as qe}from"@tamagui/helpers";import{useInsertionEffect as ze}from"react";import{getConfig as Qe,getFont as Xe}from"../config.js";import{isDevTools as Oe}from"../constants/isDevTools.js";import{getMediaImportanceIfMoreImportant as Re,mediaState as Ye,mediaKeysWithAndWithout$ as Ze,mediaQueryConfig as Je,mergeMediaByImportance as ke}from"../hooks/useMedia.js";import{createMediaStyle as Ie}from"./createMediaStyle.js";import{getPropMappedFontFamily as es}from"./createPropMapper.js";import{fixStyles as xe}from"./expandStyles.js";import{getAtomicStyle as ss,getStylesAtomic as Ce,styleToCSS as ts}from"./getStylesAtomic";import{insertStyleRules as os,insertedTransforms as ue,scanAllSheets as rs,shouldInsertStyleRules as ns,updateRules as is}from"./insertStyleRule.js";import{normalizeValueWithProperty as _e,reverseMapClassNameToValue as as}from"./normalizeValueWithProperty.js";import{pseudoDescriptors as cs}from"./pseudoDescriptors.js";const Y={animation:!0,space:!0,animateOnly:!0,debug:!0,componentName:!0,tag:!0};process.env.NODE_ENV==="test"&&(Y["data-test-renders"]=!0);const Z=process.env.IS_STATIC==="is_static";process.env.TAMAGUI_TARGET==="native"&&Object.assign(Y,{whiteSpace:!0,wordWrap:!0,textOverflow:!0,textDecorationDistance:!0,cursor:!0,contain:!0,boxSizing:!0,boxShadow:!0});const J={};if(process.env.TAMAGUI_TARGET==="web"){const t={Hidden:!0,ActiveDescendant:!0,Atomic:!0,AutoComplete:!0,Busy:!0,Checked:!0,ColumnCount:"colcount",ColumnIndex:"colindex",ColumnSpan:"colspan",Current:!0,Details:!0,ErrorMessage:!0,Expanded:!0,HasPopup:!0,Invalid:!0,Label:!0,Level:!0,Modal:!0,Multiline:!0,MultiSelectable:!0,Orientation:!0,Owns:!0,Placeholder:!0,PosInSet:!0,Pressed:!0,RoleDescription:!0,RowCount:!0,RowIndex:!0,RowSpan:!0,Selected:!0,SetSize:!0,Sort:!0,ValueMax:!0,ValueMin:!0,ValueNow:!0,ValueText:!0};for(const r in t){let u=t[r];u===!0&&(u=r.toLowerCase()),J[`accessibility${r}`]=`aria-${u}`}}let k;const U="-",ls={adjustable:"slider",header:"heading",image:"img",link:"link",none:"presentation",summary:"region"},Me=t=>Boolean(t[0]==="$"&&Ze.has(t)),fs=(t,r,u,n,S,p,c,d)=>{var ge,Se,Te;if(H.has(t))return H.get(t);k=k||Qe();const{shorthands:x}=k,{variants:C,propMapper:ee,isReactNative:$,inlineProps:O,inlineWhenUnflattened:B}=r,K=r.isText?Be:fe,i={};let R=null,se=null;const de=n.mediaState||Ye,a={},te=Object.keys(t);let oe=t.space,q=!1;const _=r.acceptsClassName&&(z||Z)&&!n.noClassNames;let l={};const j={},$e=te.length,W=[],T={};let re="";const N={};let G;const L={classNames:T,conf:k,props:t,state:n,staticConfig:r,style:l,theme:u,usedKeys:a,viewProps:i,languageContext:p};if(process.env.NODE_ENV==="development"&&d==="verbose"&&(console.groupCollapsed("getSplitStyles (looping backwards)"),console.log({props:t,staticConfig:r,shouldDoClasses:_,state:n,IS_STATIC:Z,propKeys:te,styleState:L}),console.groupEnd()),t.className)for(const e of t.className.split(" "))if(e[0]==="_"){const[s,m]=e.slice(1).split("-"),h=m[0]==="_",F=m[0]==="0",V=h||F;let A=x[s];if(h){let M=m.slice(1);M=M.slice(0,M.indexOf("_")),A+=`${U}${M}`}else if(F){const M=m.slice(1);A+=`${U}${M}`}a[A]=1,Q(N,T,A,e,V)}else e&&(re+=` ${e}`);const ne=[];function me(e,s,m=!1,h=null){var be;if(e==="className")return;if(e in x&&(e=x[e]),process.env.TAMAGUI_TARGET==="native"){if(e==="userSelect")e="selectable",s=s!=="none";else if(e.startsWith("data-")||e.startsWith("aria-"))return}if(!r.isHOC&&e in Y||e in a)return;if(typeof s=="string"&&s[0]==="_"&&(e in K||e.includes("-"))){_?T[e]=s:l[e]=as(e,s),a[e]=1;return}if(e==="dataSet"){for(const o in s)i[`data-${ys(o)}`]=s[o];return}const F=e==="style";if(F||e.startsWith("_style")){if(!s)return;const o=Array.isArray(s)?s:[s],y=o.length;for(let v=y;v>=0;v--){const g=o[v];if(g)for(const f in g)!F&&a[f]||(a[f]=1,l[f]=g[f])}return}if(process.env.TAMAGUI_TARGET==="web"){if(e==="disabled"&&s===!0&&(a[e]=1,i["aria-disabled"]=!0,(c==="button"||c==="form"||c==="input"||c==="select"||c==="textarea")&&(i.disabled=!0),!(C!=null&&C.disabled)))return;if(e==="testID"){a[e]=1,i[$?"testId":"data-testid"]=s;return}if(e==="id"||e==="nativeID"){a[e]=1,$?i.nativeID=s:i.id=s;return}let o=!1;if($){if(J[e]||e.startsWith("accessibility")){i[e]=s,a[e]=1;return}}else if(o=!0,J[e])i[J[e]]=s;else switch(e){case"accessibilityRole":{s==="none"?i.role="presentation":i.role=ls[s]||s;return}case"accessibilityLabelledBy":case"accessibilityFlowTo":case"accessibilityControls":case"accessibilityDescribedBy":{i[`aria-${e.replace("accessibility","").toLowerCase()}`]=ds(s);return}case"accessibilityKeyShortcuts":{Array.isArray(s)&&(i["aria-keyshortcuts"]=s.join(" "));return}case"accessibilityLiveRegion":{i["aria-live"]=s==="none"?"off":s;return}case"accessibilityReadOnly":{i["aria-readonly"]=s,(c==="input"||c==="select"||c==="textarea")&&(i.readOnly=!0);return}case"accessibilityRequired":{i["aria-required"]=s,(c==="input"||c==="select"||c==="textarea")&&(i.required=s);return}default:o=!1}if(o){a[e]=1;return}if(s&&s[0]==="_"){const y=e in fe,v=!y&&e.includes(U)&&fe[e.split(U)[0]];if(y||v){a[e]=1,process.env.NODE_ENV==="development"&&d&&console.log("tamagui classname props",e,s),Q(N,T,e,s,v);return}}}let V=Me(e),A=e in Ae;const M=C&&e in C,Ve=!(V||A||M||e in K||e in x),Fe=((be=r.parentStaticConfig)==null?void 0:be.variants)&&e in r.parentStaticConfig,Ke=r.isHOC&&(V||A),he=Ve||Ke||Fe;if(process.env.NODE_ENV==="development"&&d==="verbose"&&he&&console.log(`  \u{1F539} pass through ${e}`),he&&(a[e]=1,i[e]=s,!M))return;process.env.NODE_ENV==="development"&&d==="verbose"&&console.groupCollapsed("  \u{1F539} styles",e,s);const X=V||A?[[e,s]]:ee(e,s,u,m?{...t,fontFamily:h}:t,n,p,void 0,d);if(G||(G=es(X)),process.env.NODE_ENV==="development"&&d==="verbose"&&(!Le&&Oe&&console.log("expanded",X,`
+usedKeys`,a,`
+current`,{...l}),console.groupEnd()),!!X)for(const[o,y]of X){if(y===void 0)continue;if(o in He&&!m&&o!=="fontFamily"){ne.push([o,y]);continue}V=Me(o),A=o in Ae;const v=V||A;if(!v&&a[o]){process.env.NODE_ENV==="developmnet"&&d==="verbose"&&console.log(`Used media/pseudo ${o}`);continue}if((O!=null&&O.has(o)||B!=null&&B.has(o))&&(a[o]=1,i[o]=t[o]??y),A){if(!y)continue;const g=ve(L,o,y,!0,n.noClassNames),f=cs[o],D=f.name==="enter",w=f.name==="exit";if(!f||w&&!n.isExiting)continue;if((!_||Z)&&(R||={},R[o]||={},Object.assign(R[o],g)),_&&!D&&!w){const P=ss(g,f);for(const E of P){const b=`${E.property}${U}${f.name}`;a[b]||(a[b]=1,I(W,E),Q(N,T,b,E.identifier,v))}}else{if(a[o])continue;let P=!n[f.stateKey||f.name];z&&!le&&D&&(P=!1),P||s===r.defaultProps[e]||(a[o]||=1,process.env.NODE_ENV==="development"&&d==="verbose"&&console.log(`Setting used ${o}`)),se||={};const E=f.priority;for(const b in g){const ce=g[b];if(P){if(!(b in a)&&b in De){const je=De[b];pe(L,j,b,je,!0)}continue}const Pe=se[E]||0,Ee=E>=Pe;Ee&&(se[b]=E,R||={},R[o]||={},R[o][b]=ce,pe(L,j,b,ce)),process.env.NODE_ENV==="development"&&d==="verbose"&&console.log("    merge pseudo?",e,Ee,{importance:E,curImportance:Pe,pkey:b,val:ce})}}continue}if(V){if(!y)continue;q||=!0;const g=ve(L,o,y,!1),f=o.slice(1);if(process.env.NODE_ENV==="development"&&d==="verbose"&&console.log(`  \u{1F4FA} ${o}`,{key:o,mediaStyle:g,props:t,shouldDoClasses:_}),"space"in g&&(Array.isArray(q)||(q=[]),q.push(f)),_){if("space"in g&&(delete g.space,de[f])){const w=s.space,P=Re(f,"space",a);P&&(oe=w,a.space=P,process.env.NODE_ENV==="development"&&d==="verbose"&&console.log(`Found more important space for current media ${f}: ${w} (importance: ${P})`))}const D=Ce(g);for(const w of D){const P=Ie(w,f,Je),E=`${w.property}${U}${f}`;a[E]||(a[E]=1,I(W,P),Q(N,T,E,P.identifier,!0))}}else if(de[f]){for(const D in g)if(Re(f,D,a)!==null){if(D==="space"){oe=s.space;continue}ke(l,f,D,g[D],a),o==="fontFamily"&&(G=g.fontFamily)}}continue}if(process.env.TAMAGUI_TARGET==="native"&&o==="pointerEvents"){a[o]=1,i[o]=y;continue}if(o==="fontFamily"&&!G&&s&&y&&(G=s[0]==="$"?s:y),o in K){pe(L,j,o,y);continue}(!C||!(o in C))&&(o in Y||(i[o]=y,a[o]=1))}}for(let e=$e-1;e>=0;e--){const s=te[e],m=t[s];me(s,m)}for(let e=0;e<ne.length;e++){const[s,m]=ne[e];me(s,m,!0,G)}if(xe(l),z&&ts(l),process.env.TAMAGUI_TARGET==="native"&&"fontFamily"in l&&l.fontFamily){const e=(ge=Xe(l.fontFamily))==null?void 0:ge.face;if(e){const s=(Te=(Se=e[l.fontWeight])==null?void 0:Se[l.fontStyle||"normal"])==null?void 0:Te.val;s&&(l.fontFamily=s,G=s,delete l.fontWeight,delete l.fontStyle)}process.env.NODE_ENV==="development"&&d&&console.log(`Found fontFamily native: ${l.fontFamily}`,e)}if(j&&gs(l,j,!0),S){if(process.env.TAMAGUI_TARGET==="web"&&_)for(const e in S.classNames){const s=S.classNames[e];e in l||e in T||(T[e]=s)}if(!_)for(const e in S.style)e in T||e in l||(l[e]=S.style[e])}if(process.env.TAMAGUI_TARGET==="web"){if(_){const e={};if(!l.$$css){const s=Ce(l);for(const m of s){const h=m.property;t.animateOnly&&t.animateOnly.includes(h)?e[h]=m.value:(I(W,m),Q(N,T,h,m.identifier))}Z||(l=e)}}if(N)for(const e in N){if(!N[e]){process.env.NODE_ENV==="development"&&console.warn("Error no transform",N,e);continue}const[s,m]=N[e],h=`_transform${s}`;if(le&&!ue[h]){const F=`.${h} { transform: ${m}; }`;I(W,{identifier:h,rules:[F],property:e})}T[e]=h}}const ye={},ie=Object.keys(i),Ge=ie.length;for(let e=Ge-1;e>=0;e--)ye[ie[e]]=i[ie[e]];const ae={space:oe,hasMedia:q,fontFamily:G,viewProps:ye,style:l,pseudos:R,classNames:T,rulesToInsert:W};if(re&&(T.className=re),process.env.NODE_ENV==="development"&&d==="verbose"&&Oe){console.groupCollapsed("  \u{1F539} styles =>");const e={...ae,state:n,etc:{transforms:N,viewProps:i,rulesToInsert:W,parentSplitStyles:S,flatTransforms:j}};for(const s in e)console.log(s,e[s]);console.groupEnd()}return H.set(t,ae),ae};function Q(t,r,u,n,S=!1){if(process.env.TAMAGUI_TARGET==="web"){if(!n)return;if(n[0]==="_"&&n.startsWith("_transform-")){const p=S?u:"transform";let c=ue[n];le&&!c&&(rs(),c=ue[n],!c&&z&&n[0]!=="_"&&(c=n)),t[p]||=["",""],t[p][0]+=n.replace("_transform",""),c&&(t[p][1]+=c)}else r[u]=n}}const H=new WeakMap;function us(t,r,u){const n=u||r;return H.has(n)||H.set(n,{...t,...r,...u}),H.get(n)}function pe({usedKeys:t,classNames:r,viewProps:u,style:n},S,p,c,d=!1){if(d||(t[p]||=1),c&&c[0]==="_")r[p]=c;else if(p in Ne)S||={},S[p]=c;else{const x=_e(c,p);p in qe?u[p]=x:n[p]=x}}const ve=(t,r,u,n,S)=>{const{staticConfig:p,theme:c,props:d,state:x,conf:C,languageContext:ee}=t,$={};for(let O in u){const B=u[O];O=C.shorthands[O]||O;const K=p.propMapper(O,B,c,us(p.defaultProps,d,d[r]),x,ee,n);if(K)for(const[i,R]of K)!S&&i in Ne?we($,i,R):$[i]=_e(R,O)}return xe($),$},ps=z?ze||Ue:()=>{},vs=(...t)=>{const r=fs(...t);return We||ps(()=>{os(r.rulesToInsert)},[r.rulesToInsert]),r};function I(t,r){if(process.env.TAMAGUI_TARGET==="web"){if(!ns(r.identifier))return;is(r.identifier,r.rules),t.push(r)}}function ds(t){return Array.isArray(t)?t.join(" "):t}const De={opacity:1,scale:1,rotate:"0deg",rotateY:"0deg",rotateX:"0deg"},ms=t=>`-${t.toLowerCase()}`,ys=t=>t.replace(/[A-Z]/g,ms),we=(t,r,u,n=!1)=>{t.transform||=[],t.transform[n?"unshift":"push"]({[Ss[r]||r]:u})},gs=(t,r,u=!1)=>{Object.entries(r).forEach(([n,S])=>{we(t,n,S,u)})},Ss={x:"translateX",y:"translateY"};export{U as PROP_SPLIT,fs as getSplitStyles,ve as getSubStyle,vs as useSplitStyles};
 //# sourceMappingURL=getSplitStyles.mjs.map