@tamagui/web 1.14.0 → 1.14.2

package/dist/cjs/helpers/getSplitStyles.js

@@ -1,4 +1,859 @@
-"use strict";var ge=Object.defineProperty;var Be=Object.getOwnPropertyDescriptor;var qe=Object.getOwnPropertyNames;var ze=Object.prototype.hasOwnProperty;var Qe=(t,r)=>{for(var c in r)ge(t,c,{get:r[c],enumerable:!0})},Xe=(t,r,c,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let d of qe(r))!ze.call(t,d)&&d!==c&&ge(t,d,{get:()=>r[d],enumerable:!(n=Be(r,d))||n.enumerable});return t};var Ye=t=>Xe(ge({},"__esModule",{value:!0}),t);var nt={};Qe(nt,{PROP_SPLIT:()=>U,getSplitStyles:()=>Fe,getSubStyle:()=>he,useSplitStyles:()=>Ie});module.exports=Ye(nt);var T=require("@tamagui/constants"),h=require("@tamagui/helpers"),we=require("react"),ne=require("../config.js"),Se=require("../constants/isDevTools.js"),_=require("../hooks/useMedia.js"),$e=require("./createMediaStyle.js"),Ge=require("./createPropMapper.js"),Te=require("./expandStyles.js"),H=require("./getStylesAtomic"),R=require("./insertStyleRule.js"),k=require("./normalizeValueWithProperty.js"),Ve=require("./pseudoDescriptors.js");const ee={animation:!0,space:!0,animateOnly:!0,debug:!0,componentName:!0,tag:!0};process.env.NODE_ENV==="test"&&(ee["data-test-renders"]=!0);const te=process.env.IS_STATIC==="is_static";process.env.TAMAGUI_TARGET==="native"&&Object.assign(ee,{whiteSpace:!0,wordWrap:!0,textOverflow:!0,textDecorationDistance:!0,cursor:!0,contain:!0,boxSizing:!0,boxShadow:!0});const se={};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 c=t[r];c===!0&&(c=r.toLowerCase()),se[`accessibility${r}`]=`aria-${c}`}}let oe;const U="-",Ze={adjustable:"slider",header:"heading",image:"img",link:"link",none:"presentation",summary:"region"},Me=t=>Boolean(t[0]==="$"&&_.mediaKeysWithAndWithout$.has(t)),Fe=(t,r,c,n,d,p,l,m)=>{var Ne,Ae,Oe;if(X.has(t))return X.get(t);oe=oe||(0,ne.getConfig)();const{shorthands:v}=oe,{variants:D,propMapper:ie,isReactNative:K,inlineProps:M,inlineWhenUnflattened:Y}=r,B=r.isText?h.stylePropsText:h.validStyles,a={};let b=null,ae=null;const be=n.mediaState||_.mediaState,i={},ce=Object.keys(t);let le=t.space,Z=!1;const w=r.acceptsClassName&&(T.isWeb||te)&&!n.noClassNames;let f={};const q={},Ke=ce.length,z=[],P={};let fe="";const x={};let W;const Q={classNames:P,conf:oe,props:t,state:n,staticConfig:r,style:f,theme:c,usedKeys:i,viewProps:a,languageContext:p};if(process.env.NODE_ENV==="development"&&m==="verbose"&&(console.groupCollapsed("getSplitStyles (looping backwards)"),console.log({props:t,staticConfig:r,shouldDoClasses:w,state:n,IS_STATIC:te,propKeys:ce,styleState:Q}),console.groupEnd()),t.className)for(const e of t.className.split(" "))if(e[0]==="_"){const[s,g]=e.slice(1).split("-"),E=g[0]==="_",L=g[0]==="0",j=E||L;let C=v[s];if(E){let $=g.slice(1);$=$.slice(0,$.indexOf("_")),C+=`${U}${$}`}else if(L){const $=g.slice(1);C+=`${U}${$}`}i[C]=1,J(x,P,C,e,j)}else e&&(fe+=` ${e}`);const ue=[];function Pe(e,s,g=!1,E=null){var xe;if(e==="className")return;if(e in v&&(e=v[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 ee||e in i)return;if(typeof s=="string"&&s[0]==="_"&&(e in B||e.includes("-"))){w?P[e]=s:f[e]=(0,k.reverseMapClassNameToValue)(e,s),i[e]=1;return}if(e==="dataSet"){for(const o in s)a[`data-${st(o)}`]=s[o];return}const L=e==="style";if(L||e.startsWith("_style")){if(!s)return;const o=Array.isArray(s)?s:[s],y=o.length;for(let G=y;G>=0;G--){const S=o[G];if(S)for(const u in S)!L&&i[u]||(i[u]=1,f[u]=S[u])}return}if(process.env.TAMAGUI_TARGET==="web"){if(e==="disabled"&&s===!0&&(i[e]=1,a["aria-disabled"]=!0,(l==="button"||l==="form"||l==="input"||l==="select"||l==="textarea")&&(a.disabled=!0),!(D!=null&&D.disabled)))return;if(e==="testID"){i[e]=1,a[K?"testId":"data-testid"]=s;return}if(e==="id"||e==="nativeID"){i[e]=1,K?a.nativeID=s:a.id=s;return}let o=!1;if(K){if(se[e]||e.startsWith("accessibility")){a[e]=s,i[e]=1;return}}else if(o=!0,se[e])a[se[e]]=s;else switch(e){case"accessibilityRole":{s==="none"?a.role="presentation":a.role=Ze[s]||s;return}case"accessibilityLabelledBy":case"accessibilityFlowTo":case"accessibilityControls":case"accessibilityDescribedBy":{a[`aria-${e.replace("accessibility","").toLowerCase()}`]=et(s);return}case"accessibilityKeyShortcuts":{Array.isArray(s)&&(a["aria-keyshortcuts"]=s.join(" "));return}case"accessibilityLiveRegion":{a["aria-live"]=s==="none"?"off":s;return}case"accessibilityReadOnly":{a["aria-readonly"]=s,(l==="input"||l==="select"||l==="textarea")&&(a.readOnly=!0);return}case"accessibilityRequired":{a["aria-required"]=s,(l==="input"||l==="select"||l==="textarea")&&(a.required=s);return}default:o=!1}if(o){i[e]=1;return}if(s&&s[0]==="_"){const y=e in h.validStyles,G=!y&&e.includes(U)&&h.validStyles[e.split(U)[0]];if(y||G){i[e]=1,process.env.NODE_ENV==="development"&&m&&console.log("tamagui classname props",e,s),J(x,P,e,s,G);return}}}let j=Me(e),C=e in h.validPseudoKeys;const $=D&&e in D,je=!(j||C||$||e in B||e in v),Le=((xe=r.parentStaticConfig)==null?void 0:xe.variants)&&e in r.parentStaticConfig,Ue=r.isHOC&&(j||C),Re=je||Ue||Le;if(process.env.NODE_ENV==="development"&&m==="verbose"&&Re&&console.log(`  \u{1F539} pass through ${e}`),Re&&(i[e]=1,a[e]=s,!$))return;process.env.NODE_ENV==="development"&&m==="verbose"&&console.groupCollapsed("  \u{1F539} styles",e,s);const I=j||C?[[e,s]]:ie(e,s,c,g?{...t,fontFamily:E}:t,n,p,void 0,m);if(W||(W=(0,Ge.getPropMappedFontFamily)(I)),process.env.NODE_ENV==="development"&&m==="verbose"&&(!T.isServer&&Se.isDevTools&&console.log("expanded",I,`
-usedKeys`,i,`
-current`,{...f}),console.groupEnd()),!!I)for(const[o,y]of I){if(y===void 0)continue;if(o in h.stylePropsFont&&!g&&o!=="fontFamily"){ue.push([o,y]);continue}j=Me(o),C=o in h.validPseudoKeys;const G=j||C;if(!G&&i[o]){process.env.NODE_ENV==="developmnet"&&m==="verbose"&&console.log(`Used media/pseudo ${o}`);continue}if((M!=null&&M.has(o)||Y!=null&&Y.has(o))&&(i[o]=1,a[o]=t[o]??y),C){if(!y)continue;const S=he(Q,o,y,!0,n.noClassNames),u=Ve.pseudoDescriptors[o],V=u.name==="enter",F=u.name==="exit";if(!u||F&&!n.isExiting)continue;if((!w||te)&&(b||(b={}),b[o]||(b[o]={}),Object.assign(b[o],S)),w&&!V&&!F){const A=(0,H.getAtomicStyle)(S,u);for(const O of A){const N=`${O.property}${U}${u.name}`;i[N]||(i[N]=1,re(z,O),J(x,P,N,O.identifier,G))}}else{if(i[o])continue;let A=!n[u.stateKey||u.name];T.isWeb&&!T.isClient&&V&&(A=!1),A||s===r.defaultProps[e]||(i[o]||(i[o]=1),process.env.NODE_ENV==="development"&&m==="verbose"&&console.log(`Setting used ${o}`)),ae||(ae={});const O=u.priority;for(const N in S){const me=S[N];if(A){if(!(N in i)&&N in ve){const He=ve[N];ye(Q,q,N,He,!0)}continue}const Ce=ae[O]||0,_e=O>=Ce;_e&&(ae[N]=O,b||(b={}),b[o]||(b[o]={}),b[o][N]=me,ye(Q,q,N,me)),process.env.NODE_ENV==="development"&&m==="verbose"&&console.log("    merge pseudo?",e,_e,{importance:O,curImportance:Ce,pkey:N,val:me})}}continue}if(j){if(!y)continue;Z||(Z=!0);const S=he(Q,o,y,!1),u=o.slice(1);if(process.env.NODE_ENV==="development"&&m==="verbose"&&console.log(`  \u{1F4FA} ${o}`,{key:o,mediaStyle:S,props:t,shouldDoClasses:w}),"space"in S&&(Array.isArray(Z)||(Z=[]),Z.push(u)),w){if("space"in S&&(delete S.space,be[u])){const F=s.space,A=(0,_.getMediaImportanceIfMoreImportant)(u,"space",i);A&&(le=F,i.space=A,process.env.NODE_ENV==="development"&&m==="verbose"&&console.log(`Found more important space for current media ${u}: ${F} (importance: ${A})`))}const V=(0,H.getStylesAtomic)(S);for(const F of V){const A=(0,$e.createMediaStyle)(F,u,_.mediaQueryConfig),O=`${F.property}${U}${u}`;i[O]||(i[O]=1,re(z,A),J(x,P,O,A.identifier,!0))}}else if(be[u]){for(const V in S)if((0,_.getMediaImportanceIfMoreImportant)(u,V,i)!==null){if(V==="space"){le=s.space;continue}(0,_.mergeMediaByImportance)(f,u,V,S[V],i),o==="fontFamily"&&(W=S.fontFamily)}}continue}if(process.env.TAMAGUI_TARGET==="native"&&o==="pointerEvents"){i[o]=1,a[o]=y;continue}if(o==="fontFamily"&&!W&&s&&y&&(W=s[0]==="$"?s:y),o in B){ye(Q,q,o,y);continue}(!D||!(o in D))&&(o in ee||(a[o]=y,i[o]=1))}}for(let e=Ke-1;e>=0;e--){const s=ce[e],g=t[s];Pe(s,g)}for(let e=0;e<ue.length;e++){const[s,g]=ue[e];Pe(s,g,!0,W)}if((0,Te.fixStyles)(f),T.isWeb&&(0,H.styleToCSS)(f),process.env.TAMAGUI_TARGET==="native"&&"fontFamily"in f&&f.fontFamily){const e=(Ne=(0,ne.getFont)(f.fontFamily))==null?void 0:Ne.face;if(e){const s=(Oe=(Ae=e[f.fontWeight])==null?void 0:Ae[f.fontStyle||"normal"])==null?void 0:Oe.val;s&&(f.fontFamily=s,W=s,delete f.fontWeight,delete f.fontStyle)}process.env.NODE_ENV==="development"&&m&&console.log(`Found fontFamily native: ${f.fontFamily}`,e)}if(q&&ot(f,q,!0),d){if(process.env.TAMAGUI_TARGET==="web"&&w)for(const e in d.classNames){const s=d.classNames[e];e in f||e in P||(P[e]=s)}if(!w)for(const e in d.style)e in P||e in f||(f[e]=d.style[e])}if(process.env.TAMAGUI_TARGET==="web"){if(w){const e={};if(!f.$$css){const s=(0,H.getStylesAtomic)(f);for(const g of s){const E=g.property;t.animateOnly&&t.animateOnly.includes(E)?e[E]=g.value:(re(z,g),J(x,P,E,g.identifier))}te||(f=e)}}if(x)for(const e in x){if(!x[e]){process.env.NODE_ENV==="development"&&console.warn("Error no transform",x,e);continue}const[s,g]=x[e],E=`_transform${s}`;if(T.isClient&&!R.insertedTransforms[E]){const L=`.${E} { transform: ${g}; }`;re(z,{identifier:E,rules:[L],property:e})}P[e]=E}}const Ee={},pe=Object.keys(a),We=pe.length;for(let e=We-1;e>=0;e--)Ee[pe[e]]=a[pe[e]];const de={space:le,hasMedia:Z,fontFamily:W,viewProps:Ee,style:f,pseudos:b,classNames:P,rulesToInsert:z};if(fe&&(P.className=fe),process.env.NODE_ENV==="development"&&m==="verbose"&&Se.isDevTools){console.groupCollapsed("  \u{1F539} styles =>");const e={...de,state:n,etc:{transforms:x,viewProps:a,rulesToInsert:z,parentSplitStyles:d,flatTransforms:q}};for(const s in e)console.log(s,e[s]);console.groupEnd()}return X.set(t,de),de};function J(t,r,c,n,d=!1){if(process.env.TAMAGUI_TARGET==="web"){if(!n)return;if(n[0]==="_"&&n.startsWith("_transform-")){const p=d?c:"transform";let l=R.insertedTransforms[n];T.isClient&&!l&&((0,R.scanAllSheets)(),l=R.insertedTransforms[n],!l&&T.isWeb&&n[0]!=="_"&&(l=n)),t[p]||(t[p]=["",""]),t[p][0]+=n.replace("_transform",""),l&&(t[p][1]+=l)}else r[c]=n}}const X=new WeakMap;function Je(t,r,c){const n=c||r;return X.has(n)||X.set(n,{...t,...r,...c}),X.get(n)}function ye({usedKeys:t,classNames:r,viewProps:c,style:n},d,p,l,m=!1){if(m||t[p]||(t[p]=1),l&&l[0]==="_")r[p]=l;else if(p in h.stylePropsTransform)d||(d={}),d[p]=l;else{const v=(0,k.normalizeValueWithProperty)(l,p);p in h.validStylesOnBaseProps?c[p]=v:n[p]=v}}const he=(t,r,c,n,d)=>{const{staticConfig:p,theme:l,props:m,state:v,conf:D,languageContext:ie}=t,K={};for(let M in c){const Y=c[M];M=D.shorthands[M]||M;const B=p.propMapper(M,Y,l,Je(p.defaultProps,m,m[r]),v,ie,n);if(B)for(const[a,b]of B)!d&&a in h.stylePropsTransform?De(K,a,b):K[a]=(0,k.normalizeValueWithProperty)(b,M)}return(0,Te.fixStyles)(K),K},ke=T.isWeb?we.useInsertionEffect||T.useIsomorphicLayoutEffect:()=>{},Ie=(...t)=>{const r=Fe(...t);return T.isRSC||ke(()=>{(0,R.insertStyleRules)(r.rulesToInsert)},[r.rulesToInsert]),r};function re(t,r){if(process.env.TAMAGUI_TARGET==="web"){if(!(0,R.shouldInsertStyleRules)(r.identifier))return;(0,R.updateRules)(r.identifier,r.rules),t.push(r)}}function et(t){return Array.isArray(t)?t.join(" "):t}const ve={opacity:1,scale:1,rotate:"0deg",rotateY:"0deg",rotateX:"0deg"},tt=t=>`-${t.toLowerCase()}`,st=t=>t.replace(/[A-Z]/g,tt),De=(t,r,c,n=!1)=>{t.transform||(t.transform=[]),t.transform[n?"unshift":"push"]({[rt[r]||r]:c})},ot=(t,r,c=!1)=>{Object.entries(r).forEach(([n,d])=>{De(t,n,d,c)})},rt={x:"translateX",y:"translateY"};0&&(module.exports={PROP_SPLIT,getSplitStyles,getSubStyle,useSplitStyles});
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var getSplitStyles_exports = {};
+__export(getSplitStyles_exports, {
+  PROP_SPLIT: () => PROP_SPLIT,
+  getSplitStyles: () => getSplitStyles,
+  getSubStyle: () => getSubStyle,
+  useSplitStyles: () => useSplitStyles
+});
+module.exports = __toCommonJS(getSplitStyles_exports);
+var import_constants = require("@tamagui/constants");
+var import_helpers = require("@tamagui/helpers");
+var import_react = require("react");
+var import_config = require("../config.js");
+var import_isDevTools = require("../constants/isDevTools.js");
+var import_useMedia = require("../hooks/useMedia.js");
+var import_createMediaStyle = require("./createMediaStyle.js");
+var import_createPropMapper = require("./createPropMapper.js");
+var import_expandStyles = require("./expandStyles.js");
+var import_getStylesAtomic = require("./getStylesAtomic");
+var import_insertStyleRule = require("./insertStyleRule.js");
+var import_normalizeValueWithProperty = require("./normalizeValueWithProperty.js");
+var import_pseudoDescriptors = require("./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] === "$" && import_useMedia.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 || (0, import_config.getConfig)();
+  const { shorthands } = conf;
+  const { variants, propMapper, isReactNative, inlineProps, inlineWhenUnflattened } = staticConfig;
+  const validStyleProps = staticConfig.isText ? import_helpers.stylePropsText : import_helpers.validStyles;
+  const viewProps = {};
+  let pseudos = null;
+  let psuedosUsed = null;
+  const mediaState = state.mediaState || import_useMedia.mediaState;
+  const usedKeys = {};
+  const propKeys = Object.keys(props);
+  let space = props.space;
+  let hasMedia = false;
+  const shouldDoClasses = staticConfig.acceptsClassName && (import_constants.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] = (0, import_normalizeValueWithProperty.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 import_helpers.validStyles;
+        const isMediaOrPseudo = !isValidClassName && keyInit.includes(PROP_SPLIT) && import_helpers.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 import_helpers.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 = (0, import_createPropMapper.getPropMappedFontFamily)(expanded);
+    }
+    if (process.env.NODE_ENV === "development" && debug === "verbose") {
+      if (!import_constants.isServer && import_isDevTools.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 import_helpers.stylePropsFont && !special && key !== "fontFamily") {
+        specialProps.push([key, val]);
+        continue;
+      }
+      isMedia = isMediaKey(key);
+      isPseudo = key in import_helpers.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 = import_pseudoDescriptors.pseudoDescriptors[key];
+        const isEnter = descriptor.name === "enter";
+        const isExit = descriptor.name === "exit";
+        if (!descriptor || isExit && !state.isExiting) {
+          continue;
+        }
+        if (!shouldDoClasses || IS_STATIC) {
+          pseudos || (pseudos = {});
+          pseudos[key] || (pseudos[key] = {});
+          Object.assign(pseudos[key], pseudoStyleObject);
+        }
+        if (shouldDoClasses && !isEnter && !isExit) {
+          const pseudoStyles = (0, import_getStylesAtomic.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 (import_constants.isWeb && !import_constants.isClient && isEnter) {
+            isDisabled = false;
+          }
+          if (!isDisabled) {
+            if (valInit === staticConfig.defaultProps[keyInit]) {
+            } else {
+              usedKeys[key] || (usedKeys[key] = 1);
+              if (process.env.NODE_ENV === "development" && debug === "verbose") {
+                console.log(`Setting used ${key}`);
+              }
+            }
+          }
+          psuedosUsed || (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 = {});
+              pseudos[key] || (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 || (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 = (0, import_useMedia.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 = (0, import_getStylesAtomic.getStylesAtomic)(mediaStyle);
+          for (const style2 of mediaStyles) {
+            const out = (0, import_createMediaStyle.createMediaStyle)(style2, mediaKeyShort, import_useMedia.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 = (0, import_useMedia.getMediaImportanceIfMoreImportant)(
+              mediaKeyShort,
+              subKey,
+              usedKeys
+            );
+            if (importance === null)
+              continue;
+            if (subKey === "space") {
+              space = valInit.space;
+              continue;
+            }
+            (0, import_useMedia.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);
+  }
+  (0, import_expandStyles.fixStyles)(style);
+  if (import_constants.isWeb) {
+    (0, import_getStylesAtomic.styleToCSS)(style);
+  }
+  if (process.env.TAMAGUI_TARGET === "native") {
+    if ("fontFamily" in style && style.fontFamily) {
+      const faceInfo = (_a = (0, import_config.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) {
+    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 = (0, import_getStylesAtomic.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 (import_constants.isClient && !import_insertStyleRule.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 (import_isDevTools.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 = import_insertStyleRule.insertedTransforms[val];
+      if (import_constants.isClient && !transform) {
+        (0, import_insertStyleRule.scanAllSheets)();
+        transform = import_insertStyleRule.insertedTransforms[val];
+        if (!transform && import_constants.isWeb && val[0] !== "_") {
+          transform = val;
+        }
+      }
+      transforms[ns] || (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] || (usedKeys[key] = 1);
+  }
+  if (val && val[0] === "_") {
+    classNames[key] = val;
+  } else if (key in import_helpers.stylePropsTransform) {
+    flatTransforms || (flatTransforms = {});
+    flatTransforms[key] = val;
+  } else {
+    const out = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(val, key);
+    if (key in import_helpers.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 import_helpers.stylePropsTransform) {
+        mergeTransform(styleOut, skey, sval);
+      } else {
+        styleOut[skey] = (0, import_normalizeValueWithProperty.normalizeValueWithProperty)(sval, key);
+      }
+    }
+  }
+  (0, import_expandStyles.fixStyles)(styleOut);
+  return styleOut;
+};
+const useInsertEffectCompat = import_constants.isWeb ? import_react.useInsertionEffect || import_constants.useIsomorphicLayoutEffect : () => {
+};
+const useSplitStyles = (...args) => {
+  const res = getSplitStyles(...args);
+  if (!import_constants.isRSC) {
+    useInsertEffectCompat(() => {
+      (0, import_insertStyleRule.insertStyleRules)(res.rulesToInsert);
+    }, [res.rulesToInsert]);
+  }
+  return res;
+};
+function addStyleToInsertRules(rulesToInsert, styleObject) {
+  if (process.env.TAMAGUI_TARGET === "web") {
+    if (!(0, import_insertStyleRule.shouldInsertStyleRules)(styleObject.identifier)) {
+      return;
+    }
+    (0, import_insertStyleRule.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 = []);
+  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"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PROP_SPLIT,
+  getSplitStyles,
+  getSubStyle,
+  useSplitStyles
+});
 //# sourceMappingURL=getSplitStyles.js.map