@tamagui/core 1.0.1-beta.59 → 1.0.1-beta.62

package/dist/esm/helpers/createPropMapper.js

@@ -9,14 +9,14 @@ import { isObj } from "./isObj";
 const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
   const variants = staticConfig.variants || {};
   const defaultProps = staticConfig.defaultProps || {};
-  const mapper = /* @__PURE__ */ __name((key, value, theme, propsIn, state, avoidDefaultProps = false) => {
+  const mapper = /* @__PURE__ */ __name((key, value, theme, propsIn, state, avoidDefaultProps = false, debug) => {
     const conf = getConfig();
     if (!conf) {
       console.trace("no conf! err");
       return;
     }
     const props = state.fallbackProps || propsIn;
-    const returnVariablesAs = state.resolveVariablesAs === "value" || !!props.animation ? "value" : "auto";
+    const returnVariablesAs = state.resolveVariablesAs === "value" || !!props.animation ? "non-color-value" : "auto";
     const fontFamily = props.fontFamily || defaultProps.fontFamily || "$body";
     const variantValue = resolveVariants(key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, "", avoidDefaultProps);
     if (variantValue) {
@@ -29,9 +29,9 @@ const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
     }
     if (value) {
       if (value[0] === "$") {
-        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs);
+        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs, debug);
       } else if (isVariable(value)) {
-        value = getVariableValue(value, returnVariablesAs);
+        value = getVariableValue(key, value, returnVariablesAs);
       }
     }
     if (shouldReturn) {
@@ -40,7 +40,7 @@ const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
   }, "mapper");
   return mapper;
 }, "createPropMapper");
-const resolveVariants = /* @__PURE__ */ __name((key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps = false) => {
+const resolveVariants = /* @__PURE__ */ __name((key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps = false, debug) => {
   var _a;
   const variant = variants && variants[key];
   if (variant && value !== void 0) {
@@ -51,7 +51,7 @@ const resolveVariants = /* @__PURE__ */ __name((key, value, props, defaultProps,
         variantValue = fn(value, getVariantExtras(props, theme, defaultProps, avoidDefaultProps));
       }
       if (isObj(variantValue)) {
-        variantValue = resolveTokensAndVariants(key, variantValue, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps);
+        variantValue = resolveTokensAndVariants(key, variantValue, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps, debug);
       }
       return Object.entries(expandStyles(variantValue));
     } else {
@@ -59,13 +59,14 @@ const resolveVariants = /* @__PURE__ */ __name((key, value, props, defaultProps,
         if ((_a = staticConfig.validStyles) == null ? void 0 : _a[key]) {
           return null;
         }
-        console.warn(`No variant found: ${staticConfig.componentName || "[UnnamedComponent]"} has variant "${key}", but no matching value "${value}"`);
+        const name = staticConfig.componentName || "[UnnamedComponent]";
+        console.warn(`No variant found: ${name} has variant "${key}", but no matching value "${value}"`);
       }
       return null;
     }
   }
 }, "resolveVariants");
-const resolveTokensAndVariants = /* @__PURE__ */ __name((key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps) => {
+const resolveTokensAndVariants = /* @__PURE__ */ __name((key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps, debug) => {
   var _a;
   let res = {};
   for (const rKey in value) {
@@ -79,15 +80,15 @@ const resolveTokensAndVariants = /* @__PURE__ */ __name((key, value, props, defa
       } else {
         res = {
           ...res,
-          ...Object.fromEntries(resolveVariants(fKey, val, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, key, avoidDefaultProps))
+          ...Object.fromEntries(resolveVariants(fKey, val, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, key, avoidDefaultProps, debug))
         };
       }
     } else if (typeof val === "string") {
-      const fVal = val[0] === "$" ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs) : val;
+      const fVal = val[0] === "$" ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs, debug) : val;
       res[fKey] = fVal;
     } else {
       if (isObj(val)) {
-        res[fKey] = resolveTokensAndVariants(fKey, val, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, key, avoidDefaultProps);
+        res[fKey] = resolveTokensAndVariants(fKey, val, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, key, avoidDefaultProps, debug);
       } else {
         res[fKey] = value[fKey];
       }
@@ -128,7 +129,7 @@ const fontShorthand = {
   fontSize: "size",
   fontWeight: "weight"
 };
-const getToken = /* @__PURE__ */ __name((key, value, { tokensParsed, fontsParsed }, theme, fontFamily = "$body", resolveAs) => {
+const getToken = /* @__PURE__ */ __name((key, value, { tokensParsed, fontsParsed }, theme, fontFamily = "$body", resolveAs, debug) => {
   var _a, _b, _c;
   let valOrVar;
   let hasSet = false;
@@ -167,21 +168,39 @@ const getToken = /* @__PURE__ */ __name((key, value, { tokensParsed, fontsParsed
     }
   }
   if (hasSet) {
-    return getVariableValue(valOrVar, resolveAs);
+    return getVariableValue(key, valOrVar, resolveAs);
   }
   if (process.env.NODE_ENV === "development") {
     if (value && value[0] === "$") {
-      console.warn(`\u26A0\uFE0F Missing token:`, key, value, fontFamily, theme, fontsParsed);
+      console.warn(`\u26A0\uFE0F You've passed the value "${value}" to the style property "${key}", but there's no theme or token with the key "${value}". Using theme "${theme.name}".
+
+Set the debug prop to true to see more detailed debug information.`);
+      if (debug) {
+        if (typeof window !== "undefined") {
+          console.log("Looked in:");
+          console.log("Theme:", theme);
+          console.log("Tokens:", tokensParsed);
+          console.log("Fonts:", fontsParsed);
+        }
+      }
       return null;
     }
   }
   return value;
 }, "getToken");
-function getVariableValue(valOrVar, resolveAs = "auto") {
+function getVariableValue(key, valOrVar, resolveAs = "auto") {
   if (isVariable(valOrVar)) {
     if (resolveAs === "variable") {
       return valOrVar;
     }
+    if (resolveAs === "non-color-value") {
+      if (isWeb) {
+        if (key in tokenCategories.color) {
+          return valOrVar.variable;
+        }
+      }
+      return valOrVar.val;
+    }
     if (!isWeb || resolveAs === "value") {
       return valOrVar.val;
     }

package/dist/esm/helpers/createPropMapper.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/createPropMapper.ts"],
-  "sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport {\n  GenericVariantDefinitions,\n  PropMapper,\n  StaticConfig,\n  TamaguiInternalConfig,\n  VariantSpreadFunction,\n} from '../types'\nimport { expandStyle, expandStyles } from './generateAtomicStyles'\nimport { getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both'\n\nexport const createPropMapper = (staticConfig: Partial<StaticConfig>) => {\n  const variants = staticConfig.variants || {}\n  const defaultProps = staticConfig.defaultProps || {}\n\n  const mapper: PropMapper = (key, value, theme, propsIn, state, avoidDefaultProps = false) => {\n    const conf = getConfig()\n    if (!conf) {\n      console.trace('no conf! err')\n      return\n    }\n\n    const props = state.fallbackProps || propsIn\n    const returnVariablesAs =\n      state.resolveVariablesAs === 'value' || !!props.animation ? 'value' : 'auto'\n\n    // handled here because we need to resolve this off tokens, its the only one-off like this\n    const fontFamily = props.fontFamily || defaultProps.fontFamily || '$body'\n\n    const variantValue = resolveVariants(\n      key,\n      value,\n      props,\n      defaultProps,\n      theme,\n      variants,\n      fontFamily,\n      conf,\n      returnVariablesAs,\n      staticConfig,\n      '',\n      avoidDefaultProps\n    )\n    if (variantValue) {\n      return variantValue\n    }\n\n    let shouldReturn = value !== undefined && value !== null\n\n    // handle shorthands\n    if (conf.shorthands[key]) {\n      shouldReturn = true\n      key = conf.shorthands[key]\n    }\n\n    if (value) {\n      if (value[0] === '$') {\n        // prettier-ignore\n        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs)\n      } else if (isVariable(value)) {\n        value = getVariableValue(value, returnVariablesAs)\n      }\n    }\n\n    if (shouldReturn) {\n      return expandStyle(key, value) || [[key, value]]\n    }\n  }\n\n  return mapper\n}\n\ntype StyleResolver = (\n  key: string,\n  value: any,\n  props: Record<string, any>,\n  defaultProps: any,\n  theme: any,\n  variants: GenericVariantDefinitions,\n  fontFamily: string,\n  conf: TamaguiInternalConfig,\n  returnVariablesAs: 'auto' | 'value',\n  staticConfig: Partial<StaticConfig>,\n  parentVariantKey: string,\n  avoidDefaultProps?: boolean\n) => any\n\nconst resolveVariants: StyleResolver = (\n  key,\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  avoidDefaultProps = false\n) => {\n  const variant = variants && variants[key]\n  if (variant && value !== undefined) {\n    let variantValue = getVariantDefinition(variant, key, value)\n\n    if (variantValue) {\n      if (typeof variantValue === 'function') {\n        const fn = variantValue as VariantSpreadFunction<any>\n        variantValue = fn(value, getVariantExtras(props, theme, defaultProps, avoidDefaultProps))\n      }\n\n      if (isObj(variantValue)) {\n        variantValue = resolveTokensAndVariants(\n          key,\n          variantValue,\n          props,\n          defaultProps,\n          theme,\n          variants,\n          fontFamily,\n          conf,\n          returnVariablesAs,\n          staticConfig,\n          parentVariantKey,\n          avoidDefaultProps\n        )\n      }\n\n      return Object.entries(expandStyles(variantValue))\n    } else {\n      // variant at key exists, but no matching variant value, return nothing\n      if (process.env.NODE_ENV === 'development') {\n        if (staticConfig.validStyles?.[key]) {\n          return null\n        }\n        console.warn(\n          `No variant found: ${\n            staticConfig.componentName || '[UnnamedComponent]'\n          } has variant \"${key}\", but no matching value \"${value}\"`\n        )\n      }\n      return null\n    }\n  }\n}\n\nconst resolveTokensAndVariants: StyleResolver = (\n  key, // we dont use key assume value is object instead\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  avoidDefaultProps\n) => {\n  let res = {}\n  for (const rKey in value) {\n    const fKey = conf.shorthands[rKey] || rKey\n    const val = value[rKey]\n    if (isVariable(val)) {\n      res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n      // res[fKey] =\n      //   resolveAs === 'variable' ? val : !isWeb || resolveAs === 'value' ? val.val : val.variable\n    } else if (variants[fKey]) {\n      // avoids infinite loop if variant is matching a style prop\n      // eg: { variants: { flex: { true: { flex: 2 } } } }\n      if (parentVariantKey === key) {\n        res[fKey] = val\n      } else {\n        res = {\n          ...res,\n          ...Object.fromEntries(\n            resolveVariants(\n              fKey,\n              val,\n              props,\n              defaultProps,\n              theme,\n              variants,\n              fontFamily,\n              conf,\n              returnVariablesAs,\n              staticConfig,\n              key,\n              avoidDefaultProps\n            )\n          ),\n        }\n      }\n    } else if (typeof val === 'string') {\n      const fVal =\n        val[0] === '$' ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs) : val\n      res[fKey] = fVal\n    } else {\n      if (isObj(val)) {\n        // sub-objects: media queries, pseudos, shadowOffset\n        res[fKey] = resolveTokensAndVariants(\n          fKey,\n          val,\n          props,\n          defaultProps,\n          theme,\n          variants,\n          fontFamily,\n          conf,\n          returnVariablesAs,\n          staticConfig,\n          key,\n          avoidDefaultProps\n        )\n      } else {\n        // nullish values cant be tokens, need no extra parsing\n        res[fKey] = value[fKey]\n      }\n    }\n    if (process.env.NODE_ENV === 'development') {\n      if (res[fKey]?.[0] === '$') {\n        console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\n      }\n    }\n  }\n  return res\n}\n\n// goes through specificity finding best matching variant function\nfunction getVariantDefinition(variant: any, key: string, value: any) {\n  if (typeof variant === 'function') {\n    return variant\n  }\n  for (const cat in tokenCategories) {\n    if (key in tokenCategories[cat]) {\n      const spreadVariant = variant[`...${cat}`]\n      if (spreadVariant) {\n        return spreadVariant\n      }\n    }\n  }\n  let fn: any\n  if (typeof value === 'number') {\n    fn = variant[':number']\n  } else if (typeof value === 'string') {\n    fn = variant[':string']\n  } else if (value === true || value === false) {\n    fn = variant[':boolean']\n  }\n  fn = fn || variant[value]\n  // fallback to size ultimately - could do token level detection\n  return fn || variant['...'] || variant['...size']\n}\n\nconst fontShorthand = {\n  fontSize: 'size',\n  fontWeight: 'weight',\n}\n\nconst getToken = (\n  key: string,\n  value: string,\n  { tokensParsed, fontsParsed }: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: string | undefined = '$body',\n  resolveAs?: ResolveVariableTypes\n) => {\n  let valOrVar: any\n  let hasSet = false\n  if (theme[value]) {\n    valOrVar = theme[value]\n    hasSet = true\n  } else {\n    switch (key) {\n      case 'fontFamily':\n        valOrVar = fontsParsed[value]?.family || value\n        hasSet = true\n        break\n      case 'fontSize':\n      case 'lineHeight':\n      case 'letterSpacing':\n      case 'fontWeight':\n        valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n        hasSet = true\n        break\n    }\n    for (const cat in tokenCategories) {\n      if (key in tokenCategories[cat]) {\n        const res = tokensParsed[cat][value]\n        if (res) {\n          valOrVar = res\n          hasSet = true\n        }\n      }\n    }\n    if (!hasSet) {\n      const spaceVar = tokensParsed.space[value]\n      if (spaceVar) {\n        valOrVar = spaceVar\n        hasSet = true\n      }\n    }\n  }\n  if (hasSet) {\n    return getVariableValue(valOrVar, resolveAs)\n  }\n  if (process.env.NODE_ENV === 'development') {\n    if (value && value[0] === '$') {\n      console.warn(`\u26A0\uFE0F Missing token:`, key, value, fontFamily, theme, fontsParsed)\n      return null\n    }\n  }\n  return value\n}\n\nfunction getVariableValue(valOrVar: Variable | any, resolveAs: ResolveVariableTypes = 'auto') {\n  if (isVariable(valOrVar)) {\n    if (resolveAs === 'variable') {\n      return valOrVar\n    }\n    if (!isWeb || resolveAs === 'value') {\n      return valOrVar.val\n    }\n    return valOrVar.variable\n  }\n  return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n  radius: {\n    borderRadius: true,\n  },\n  size: {\n    width: true,\n    height: true,\n    minWidth: true,\n    minHeight: true,\n    maxWidth: true,\n    maxHeight: true,\n  },\n  color: {\n    color: true,\n    backgroundColor: true,\n    borderColor: true,\n    borderBottomColor: true,\n    borderTopColor: true,\n    borderLeftColor: true,\n    borderRightColor: true,\n  },\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { Variable, isVariable } from '../createVariable'\nimport {\n  DebugProp,\n  GenericVariantDefinitions,\n  PropMapper,\n  StaticConfig,\n  TamaguiInternalConfig,\n  VariantSpreadFunction,\n} from '../types'\nimport { expandStyle, expandStyles } from './generateAtomicStyles'\nimport { getVariantExtras } from './getVariantExtras'\nimport { isObj } from './isObj'\n\nexport type ResolveVariableTypes = 'auto' | 'value' | 'variable' | 'both' | 'non-color-value'\n\nexport const createPropMapper = (staticConfig: Partial<StaticConfig>) => {\n  const variants = staticConfig.variants || {}\n  const defaultProps = staticConfig.defaultProps || {}\n\n  const mapper: PropMapper = (\n    key,\n    value,\n    theme,\n    propsIn,\n    state,\n    avoidDefaultProps = false,\n    debug\n  ) => {\n    const conf = getConfig()\n    if (!conf) {\n      console.trace('no conf! err')\n      return\n    }\n\n    const props = state.fallbackProps || propsIn\n    const returnVariablesAs =\n      state.resolveVariablesAs === 'value' || !!props.animation ? 'non-color-value' : 'auto'\n\n    // handled here because we need to resolve this off tokens, its the only one-off like this\n    const fontFamily = props.fontFamily || defaultProps.fontFamily || '$body'\n\n    const variantValue = resolveVariants(\n      key,\n      value,\n      props,\n      defaultProps,\n      theme,\n      variants,\n      fontFamily,\n      conf,\n      returnVariablesAs,\n      staticConfig,\n      '',\n      avoidDefaultProps\n    )\n    if (variantValue) {\n      return variantValue\n    }\n\n    let shouldReturn = value !== undefined && value !== null\n\n    // handle shorthands\n    if (conf.shorthands[key]) {\n      shouldReturn = true\n      key = conf.shorthands[key]\n    }\n\n    if (value) {\n      if (value[0] === '$') {\n        // prettier-ignore\n        value = getToken(key, value, conf, theme, fontFamily, returnVariablesAs, debug)\n      } else if (isVariable(value)) {\n        value = getVariableValue(key, value, returnVariablesAs)\n      }\n    }\n\n    if (shouldReturn) {\n      return expandStyle(key, value) || [[key, value]]\n    }\n  }\n\n  return mapper\n}\n\ntype StyleResolver = (\n  key: string,\n  value: any,\n  props: Record<string, any>,\n  defaultProps: any,\n  theme: any,\n  variants: GenericVariantDefinitions,\n  fontFamily: string,\n  conf: TamaguiInternalConfig,\n  returnVariablesAs: 'auto' | 'value' | 'non-color-value',\n  staticConfig: Partial<StaticConfig>,\n  parentVariantKey: string,\n  avoidDefaultProps?: boolean,\n  debug?: DebugProp\n) => any\n\nconst resolveVariants: StyleResolver = (\n  key,\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  avoidDefaultProps = false,\n  debug\n) => {\n  const variant = variants && variants[key]\n  if (variant && value !== undefined) {\n    let variantValue = getVariantDefinition(variant, key, value)\n\n    if (variantValue) {\n      if (typeof variantValue === 'function') {\n        const fn = variantValue as VariantSpreadFunction<any>\n        variantValue = fn(value, getVariantExtras(props, theme, defaultProps, avoidDefaultProps))\n      }\n\n      if (isObj(variantValue)) {\n        variantValue = resolveTokensAndVariants(\n          key,\n          variantValue,\n          props,\n          defaultProps,\n          theme,\n          variants,\n          fontFamily,\n          conf,\n          returnVariablesAs,\n          staticConfig,\n          parentVariantKey,\n          avoidDefaultProps,\n          debug\n        )\n      }\n\n      return Object.entries(expandStyles(variantValue))\n    } else {\n      // variant at key exists, but no matching variant value, return nothing\n      if (process.env.NODE_ENV === 'development') {\n        if (staticConfig.validStyles?.[key]) {\n          return null\n        }\n        const name = staticConfig.componentName || '[UnnamedComponent]'\n        console.warn(\n          `No variant found: ${name} has variant \"${key}\", but no matching value \"${value}\"`\n        )\n      }\n      return null\n    }\n  }\n}\n\nconst resolveTokensAndVariants: StyleResolver = (\n  key, // we dont use key assume value is object instead\n  value,\n  props,\n  defaultProps,\n  theme,\n  variants,\n  fontFamily,\n  conf,\n  returnVariablesAs,\n  staticConfig,\n  parentVariantKey,\n  avoidDefaultProps,\n  debug\n) => {\n  let res = {}\n  for (const rKey in value) {\n    const fKey = conf.shorthands[rKey] || rKey\n    const val = value[rKey]\n    if (isVariable(val)) {\n      res[fKey] = !isWeb || returnVariablesAs === 'value' ? val.val : val.variable\n    } else if (variants[fKey]) {\n      // avoids infinite loop if variant is matching a style prop\n      // eg: { variants: { flex: { true: { flex: 2 } } } }\n      if (parentVariantKey === key) {\n        res[fKey] = val\n      } else {\n        res = {\n          ...res,\n          ...Object.fromEntries(\n            resolveVariants(\n              fKey,\n              val,\n              props,\n              defaultProps,\n              theme,\n              variants,\n              fontFamily,\n              conf,\n              returnVariablesAs,\n              staticConfig,\n              key,\n              avoidDefaultProps,\n              debug\n            )\n          ),\n        }\n      }\n    } else if (typeof val === 'string') {\n      const fVal =\n        val[0] === '$'\n          ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs, debug)\n          : val\n      res[fKey] = fVal\n    } else {\n      if (isObj(val)) {\n        // sub-objects: media queries, pseudos, shadowOffset\n        res[fKey] = resolveTokensAndVariants(\n          fKey,\n          val,\n          props,\n          defaultProps,\n          theme,\n          variants,\n          fontFamily,\n          conf,\n          returnVariablesAs,\n          staticConfig,\n          key,\n          avoidDefaultProps,\n          debug\n        )\n      } else {\n        // nullish values cant be tokens, need no extra parsing\n        res[fKey] = value[fKey]\n      }\n    }\n    if (process.env.NODE_ENV === 'development') {\n      if (res[fKey]?.[0] === '$') {\n        console.warn(`\u26A0\uFE0F Missing token in theme ${theme.name}:`, fKey, res[fKey])\n      }\n    }\n  }\n  return res\n}\n\n// goes through specificity finding best matching variant function\nfunction getVariantDefinition(variant: any, key: string, value: any) {\n  if (typeof variant === 'function') {\n    return variant\n  }\n  for (const cat in tokenCategories) {\n    if (key in tokenCategories[cat]) {\n      const spreadVariant = variant[`...${cat}`]\n      if (spreadVariant) {\n        return spreadVariant\n      }\n    }\n  }\n  let fn: any\n  if (typeof value === 'number') {\n    fn = variant[':number']\n  } else if (typeof value === 'string') {\n    fn = variant[':string']\n  } else if (value === true || value === false) {\n    fn = variant[':boolean']\n  }\n  fn = fn || variant[value]\n  // fallback to size ultimately - could do token level detection\n  return fn || variant['...'] || variant['...size']\n}\n\nconst fontShorthand = {\n  fontSize: 'size',\n  fontWeight: 'weight',\n}\n\nconst getToken = (\n  key: string,\n  value: string,\n  { tokensParsed, fontsParsed }: TamaguiInternalConfig,\n  theme: any,\n  fontFamily: string | undefined = '$body',\n  resolveAs?: ResolveVariableTypes,\n  debug?: DebugProp\n) => {\n  let valOrVar: any\n  let hasSet = false\n  if (theme[value]) {\n    valOrVar = theme[value]\n    hasSet = true\n  } else {\n    switch (key) {\n      case 'fontFamily':\n        valOrVar = fontsParsed[value]?.family || value\n        hasSet = true\n        break\n      case 'fontSize':\n      case 'lineHeight':\n      case 'letterSpacing':\n      case 'fontWeight':\n        valOrVar = fontsParsed[fontFamily]?.[fontShorthand[key] || key]?.[value] || value\n        hasSet = true\n        break\n    }\n    for (const cat in tokenCategories) {\n      if (key in tokenCategories[cat]) {\n        const res = tokensParsed[cat][value]\n        if (res) {\n          valOrVar = res\n          hasSet = true\n        }\n      }\n    }\n    if (!hasSet) {\n      const spaceVar = tokensParsed.space[value]\n      if (spaceVar) {\n        valOrVar = spaceVar\n        hasSet = true\n      }\n    }\n  }\n  if (hasSet) {\n    return getVariableValue(key, valOrVar, resolveAs)\n  }\n  if (process.env.NODE_ENV === 'development') {\n    if (value && value[0] === '$') {\n      console.warn(\n        `\u26A0\uFE0F You've passed the value \"${value}\" to the style property \"${key}\", but there's no theme or token with the key \"${value}\". Using theme \"${theme.name}\".\n\nSet the debug prop to true to see more detailed debug information.`\n      )\n      if (debug) {\n        if (typeof window !== 'undefined') {\n          console.log('Looked in:')\n          console.log('Theme:', theme)\n          console.log('Tokens:', tokensParsed)\n          console.log('Fonts:', fontsParsed)\n        }\n      }\n      return null\n    }\n  }\n  return value\n}\n\nfunction getVariableValue(\n  key: string,\n  valOrVar: Variable | any,\n  resolveAs: ResolveVariableTypes = 'auto'\n) {\n  if (isVariable(valOrVar)) {\n    if (resolveAs === 'variable') {\n      return valOrVar\n    }\n    if (resolveAs === 'non-color-value') {\n      if (isWeb) {\n        if (key in tokenCategories.color) {\n          return valOrVar.variable\n        }\n      }\n      return valOrVar.val\n    }\n    if (!isWeb || resolveAs === 'value') {\n      return valOrVar.val\n    }\n    return valOrVar.variable\n  }\n  return valOrVar\n}\n\n// just specificy the least costly, all else go to `space` (most keys - we can exclude)\nconst tokenCategories = {\n  radius: {\n    borderRadius: true,\n  },\n  size: {\n    width: true,\n    height: true,\n    minWidth: true,\n    minHeight: true,\n    maxWidth: true,\n    maxHeight: true,\n  },\n  color: {\n    color: true,\n    backgroundColor: true,\n    borderColor: true,\n    borderBottomColor: true,\n    borderTopColor: true,\n    borderLeftColor: true,\n    borderRightColor: true,\n  },\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/esm/helpers/createTamaguiProvider.js

@@ -9,13 +9,13 @@ function createTamaguiProvider({
   ...themeProps
 }) {
   return /* @__PURE__ */ __name(function TamaguiProvider({
-    injectCSS,
+    disableInjectCSS,
     children,
     ...themePropsProvider
   }) {
     if (typeof document !== "undefined") {
       React.useLayoutEffect(() => {
-        if (!injectCSS)
+        if (disableInjectCSS)
           return;
         const style = document.createElement("style");
         style.appendChild(document.createTextNode(getCSS()));

package/dist/esm/helpers/createTamaguiProvider.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/createTamaguiProvider.tsx"],
-  "sourcesContent": ["import * as React from 'react'\n\nimport { ButtonInsideButtonContext } from '../contexts/ButtonInsideButtonContext'\nimport { TamaguiProviderProps } from '../types'\nimport { TextAncestorProvider } from '../views/TextAncestorContext'\nimport { ThemeProvider, ThemeProviderProps } from '../views/ThemeProvider'\n\nexport function createTamaguiProvider({\n  getCSS,\n  ...themeProps\n}: ThemeProviderProps & {\n  getCSS: () => string\n}) {\n  return function TamaguiProvider({\n    injectCSS,\n    children,\n    ...themePropsProvider\n  }: TamaguiProviderProps) {\n    // inject CSS if asked to (not SSR compliant)\n    if (typeof document !== 'undefined') {\n      React.useLayoutEffect(() => {\n        if (!injectCSS) return\n        const style = document.createElement('style')\n        style.appendChild(document.createTextNode(getCSS()))\n        document.head.appendChild(style)\n        return () => {\n          document.head.removeChild(style)\n        }\n      }, [])\n    }\n\n    return (\n      <ButtonInsideButtonContext.Provider value={false}>\n        <TextAncestorProvider>\n          <ThemeProvider {...themeProps} {...themePropsProvider}>\n            {children}\n          </ThemeProvider>\n        </TextAncestorProvider>\n      </ButtonInsideButtonContext.Provider>\n    )\n  }\n}\n"],
-  "mappings": ";;AAAA;AAEA;AAEA;AACA;AAEO,+BAA+B;AAAA,EACpC;AAAA,KACG;AAAA,GAGF;AACD,SAAO,gDAAyB;AAAA,IAC9B;AAAA,IACA;AAAA,OACG;AAAA,KACoB;AAEvB,QAAI,OAAO,aAAa,aAAa;AACnC,YAAM,gBAAgB,MAAM;AAC1B,YAAI,CAAC;AAAW;AAChB,cAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,cAAM,YAAY,SAAS,eAAe,OAAO,CAAC,CAAC;AACnD,iBAAS,KAAK,YAAY,KAAK;AAC/B,eAAO,MAAM;AACX,mBAAS,KAAK,YAAY,KAAK;AAAA,QACjC;AAAA,MACF,GAAG,CAAC,CAAC;AAAA,IACP;AAEA,WACE,oCAAC,0BAA0B,UAA1B;AAAA,MAAmC,OAAO;AAAA,OACzC,oCAAC,4BACC,oCAAC;AAAA,MAAe,GAAG;AAAA,MAAa,GAAG;AAAA,OAChC,QACH,CACF,CACF;AAAA,EAEJ,GA3BO;AA4BT;AAlCgB;",
+  "sourcesContent": ["import * as React from 'react'\n\nimport { ButtonInsideButtonContext } from '../contexts/ButtonInsideButtonContext'\nimport { TamaguiProviderProps } from '../types'\nimport { TextAncestorProvider } from '../views/TextAncestorContext'\nimport { ThemeProvider, ThemeProviderProps } from '../views/ThemeProvider'\n\nexport function createTamaguiProvider({\n  getCSS,\n  ...themeProps\n}: ThemeProviderProps & {\n  getCSS: () => string\n}) {\n  return function TamaguiProvider({\n    disableInjectCSS,\n    children,\n    ...themePropsProvider\n  }: TamaguiProviderProps) {\n    // inject CSS if asked to (not SSR compliant)\n    if (typeof document !== 'undefined') {\n      React.useLayoutEffect(() => {\n        if (disableInjectCSS) return\n        const style = document.createElement('style')\n        style.appendChild(document.createTextNode(getCSS()))\n        document.head.appendChild(style)\n        return () => {\n          document.head.removeChild(style)\n        }\n      }, [])\n    }\n\n    return (\n      <ButtonInsideButtonContext.Provider value={false}>\n        <TextAncestorProvider>\n          <ThemeProvider {...themeProps} {...themePropsProvider}>\n            {children}\n          </ThemeProvider>\n        </TextAncestorProvider>\n      </ButtonInsideButtonContext.Provider>\n    )\n  }\n}\n"],
+  "mappings": ";;AAAA;AAEA;AAEA;AACA;AAEO,+BAA+B;AAAA,EACpC;AAAA,KACG;AAAA,GAGF;AACD,SAAO,gDAAyB;AAAA,IAC9B;AAAA,IACA;AAAA,OACG;AAAA,KACoB;AAEvB,QAAI,OAAO,aAAa,aAAa;AACnC,YAAM,gBAAgB,MAAM;AAC1B,YAAI;AAAkB;AACtB,cAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,cAAM,YAAY,SAAS,eAAe,OAAO,CAAC,CAAC;AACnD,iBAAS,KAAK,YAAY,KAAK;AAC/B,eAAO,MAAM;AACX,mBAAS,KAAK,YAAY,KAAK;AAAA,QACjC;AAAA,MACF,GAAG,CAAC,CAAC;AAAA,IACP;AAEA,WACE,oCAAC,0BAA0B,UAA1B;AAAA,MAAmC,OAAO;AAAA,OACzC,oCAAC,4BACC,oCAAC;AAAA,MAAe,GAAG;AAAA,MAAa,GAAG;AAAA,OAChC,QACH,CACF,CACF;AAAA,EAEJ,GA3BO;AA4BT;AAlCgB;",
   "names": []
 }

package/dist/esm/helpers/extendStaticConfig.js

@@ -2,6 +2,7 @@ var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 import { stylePropsView } from "@tamagui/helpers";
 import { createPropMapper } from "./createPropMapper";
+import { mergeProps } from "./mergeProps";
 function extendStaticConfig(config, parent) {
   var _a;
   if (!parent || !("staticConfig" in parent)) {
@@ -35,12 +36,13 @@ function extendStaticConfig(config, parent) {
       ...parent.staticConfig.validStyles,
       ...config.validStyles
     } : parent.staticConfig.validStyles || stylePropsView,
-    defaultProps: {
+    defaultProps: mergeProps({
       ...parent.staticConfig.defaultProps,
-      ...parent.staticConfig.defaultVariants,
+      ...parent.staticConfig.defaultVariants
+    }, {
       ...config.defaultProps,
       ...config.defaultVariants
-    }
+    })
   });
 }
 __name(extendStaticConfig, "extendStaticConfig");

package/dist/esm/helpers/extendStaticConfig.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/extendStaticConfig.ts"],
-  "sourcesContent": ["import { stylePropsView } from '@tamagui/helpers'\n\nimport { StaticConfig, StaticConfigParsed, StylableComponent } from '../types'\nimport { createPropMapper } from './createPropMapper'\n\nexport function extendStaticConfig(config: Partial<StaticConfig>, parent?: StylableComponent) {\n  if (!parent || !('staticConfig' in parent)) {\n    return parseStaticConfig(config)\n  }\n\n  const variants = {\n    ...parent.staticConfig.variants,\n  }\n\n  // merge variants... can we type this?\n  if (config.variants) {\n    for (const key in config.variants) {\n      if (variants[key]) {\n        variants[key] = {\n          ...variants[key],\n          ...config.variants[key],\n        }\n      } else {\n        variants[key] = config.variants[key]\n      }\n    }\n  }\n\n  return parseStaticConfig({\n    ...parent.staticConfig,\n    ...config,\n    variants,\n    isZStack: config.isZStack || parent.staticConfig.isZStack,\n    isText: config.isText || parent.staticConfig.isText || false,\n    isInput: config.isInput || parent.staticConfig.isInput || false,\n    neverFlatten: config.neverFlatten || parent.staticConfig.neverFlatten,\n    ensureOverriddenProp: config.ensureOverriddenProp ?? parent.staticConfig.ensureOverriddenProp,\n    validStyles: config.validStyles\n      ? {\n          ...parent.staticConfig.validStyles,\n          ...config.validStyles,\n        }\n      : parent.staticConfig.validStyles || stylePropsView,\n    defaultProps: {\n      ...parent.staticConfig.defaultProps,\n      ...parent.staticConfig.defaultVariants,\n      ...config.defaultProps,\n      ...config.defaultVariants,\n    },\n  })\n}\n\nexport const parseStaticConfig = (config: Partial<StaticConfig>): StaticConfigParsed => {\n  return {\n    ...config,\n    parsed: true,\n    propMapper: createPropMapper(config),\n  }\n}\n"],
-  "mappings": ";;AAAA;AAGA;AAEO,4BAA4B,QAA+B,QAA4B;AAL9F;AAME,MAAI,CAAC,UAAU,CAAE,mBAAkB,SAAS;AAC1C,WAAO,kBAAkB,MAAM;AAAA,EACjC;AAEA,QAAM,WAAW;AAAA,IACf,GAAG,OAAO,aAAa;AAAA,EACzB;AAGA,MAAI,OAAO,UAAU;AACnB,eAAW,OAAO,OAAO,UAAU;AACjC,UAAI,SAAS,MAAM;AACjB,iBAAS,OAAO;AAAA,UACd,GAAG,SAAS;AAAA,UACZ,GAAG,OAAO,SAAS;AAAA,QACrB;AAAA,MACF,OAAO;AACL,iBAAS,OAAO,OAAO,SAAS;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAEA,SAAO,kBAAkB;AAAA,IACvB,GAAG,OAAO;AAAA,IACV,GAAG;AAAA,IACH;AAAA,IACA,UAAU,OAAO,YAAY,OAAO,aAAa;AAAA,IACjD,QAAQ,OAAO,UAAU,OAAO,aAAa,UAAU;AAAA,IACvD,SAAS,OAAO,WAAW,OAAO,aAAa,WAAW;AAAA,IAC1D,cAAc,OAAO,gBAAgB,OAAO,aAAa;AAAA,IACzD,sBAAsB,aAAO,yBAAP,YAA+B,OAAO,aAAa;AAAA,IACzE,aAAa,OAAO,cAChB;AAAA,MACE,GAAG,OAAO,aAAa;AAAA,MACvB,GAAG,OAAO;AAAA,IACZ,IACA,OAAO,aAAa,eAAe;AAAA,IACvC,cAAc;AAAA,MACZ,GAAG,OAAO,aAAa;AAAA,MACvB,GAAG,OAAO,aAAa;AAAA,MACvB,GAAG,OAAO;AAAA,MACV,GAAG,OAAO;AAAA,IACZ;AAAA,EACF,CAAC;AACH;AA7CgB;AA+CT,MAAM,oBAAoB,wBAAC,WAAsD;AACtF,SAAO;AAAA,IACL,GAAG;AAAA,IACH,QAAQ;AAAA,IACR,YAAY,iBAAiB,MAAM;AAAA,EACrC;AACF,GANiC;",
+  "sourcesContent": ["import { stylePropsView } from '@tamagui/helpers'\n\nimport { StaticConfig, StaticConfigParsed, StylableComponent } from '../types'\nimport { createPropMapper } from './createPropMapper'\nimport { mergeProps } from './mergeProps'\n\nexport function extendStaticConfig(config: Partial<StaticConfig>, parent?: StylableComponent) {\n  if (!parent || !('staticConfig' in parent)) {\n    return parseStaticConfig(config)\n  }\n\n  const variants = {\n    ...parent.staticConfig.variants,\n  }\n\n  // merge variants... can we type this?\n  if (config.variants) {\n    for (const key in config.variants) {\n      if (variants[key]) {\n        variants[key] = {\n          ...variants[key],\n          ...config.variants[key],\n        }\n      } else {\n        variants[key] = config.variants[key]\n      }\n    }\n  }\n\n  return parseStaticConfig({\n    ...parent.staticConfig,\n    ...config,\n    variants,\n    isZStack: config.isZStack || parent.staticConfig.isZStack,\n    isText: config.isText || parent.staticConfig.isText || false,\n    isInput: config.isInput || parent.staticConfig.isInput || false,\n    neverFlatten: config.neverFlatten || parent.staticConfig.neverFlatten,\n    ensureOverriddenProp: config.ensureOverriddenProp ?? parent.staticConfig.ensureOverriddenProp,\n    validStyles: config.validStyles\n      ? {\n          ...parent.staticConfig.validStyles,\n          ...config.validStyles,\n        }\n      : parent.staticConfig.validStyles || stylePropsView,\n    defaultProps: mergeProps(\n      {\n        ...parent.staticConfig.defaultProps,\n        ...parent.staticConfig.defaultVariants,\n      },\n      {\n        ...config.defaultProps,\n        ...config.defaultVariants,\n      }\n    ),\n  })\n}\n\nexport const parseStaticConfig = (config: Partial<StaticConfig>): StaticConfigParsed => {\n  return {\n    ...config,\n    parsed: true,\n    propMapper: createPropMapper(config),\n  }\n}\n"],
+  "mappings": ";;AAAA;AAGA;AACA;AAEO,4BAA4B,QAA+B,QAA4B;AAN9F;AAOE,MAAI,CAAC,UAAU,CAAE,mBAAkB,SAAS;AAC1C,WAAO,kBAAkB,MAAM;AAAA,EACjC;AAEA,QAAM,WAAW;AAAA,IACf,GAAG,OAAO,aAAa;AAAA,EACzB;AAGA,MAAI,OAAO,UAAU;AACnB,eAAW,OAAO,OAAO,UAAU;AACjC,UAAI,SAAS,MAAM;AACjB,iBAAS,OAAO;AAAA,UACd,GAAG,SAAS;AAAA,UACZ,GAAG,OAAO,SAAS;AAAA,QACrB;AAAA,MACF,OAAO;AACL,iBAAS,OAAO,OAAO,SAAS;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAEA,SAAO,kBAAkB;AAAA,IACvB,GAAG,OAAO;AAAA,IACV,GAAG;AAAA,IACH;AAAA,IACA,UAAU,OAAO,YAAY,OAAO,aAAa;AAAA,IACjD,QAAQ,OAAO,UAAU,OAAO,aAAa,UAAU;AAAA,IACvD,SAAS,OAAO,WAAW,OAAO,aAAa,WAAW;AAAA,IAC1D,cAAc,OAAO,gBAAgB,OAAO,aAAa;AAAA,IACzD,sBAAsB,aAAO,yBAAP,YAA+B,OAAO,aAAa;AAAA,IACzE,aAAa,OAAO,cAChB;AAAA,MACE,GAAG,OAAO,aAAa;AAAA,MACvB,GAAG,OAAO;AAAA,IACZ,IACA,OAAO,aAAa,eAAe;AAAA,IACvC,cAAc,WACZ;AAAA,MACE,GAAG,OAAO,aAAa;AAAA,MACvB,GAAG,OAAO,aAAa;AAAA,IACzB,GACA;AAAA,MACE,GAAG,OAAO;AAAA,MACV,GAAG,OAAO;AAAA,IACZ,CACF;AAAA,EACF,CAAC;AACH;AAjDgB;AAmDT,MAAM,oBAAoB,wBAAC,WAAsD;AACtF,SAAO;AAAA,IACL,GAAG;AAAA,IACH,QAAQ;AAAA,IACR,YAAY,iBAAiB,MAAM;AAAA,EACrC;AACF,GANiC;",
   "names": []
 }

package/dist/esm/helpers/generateAtomicStyles.js

@@ -4,53 +4,44 @@ import { simpleHash } from "@tamagui/helpers";
 import hyphenateStyleName from "hyphenate-style-name";
 import normalizeCSSColor from "normalize-css-color";
 import { isWeb } from "../constants/platform";
-import { prefixInlineStyles, prefixStyles } from "./prefixStyles";
+import { pseudos } from "./pseudos";
+const reducedStyleKeys = {
+  shadowColor: true,
+  shadowOffset: true,
+  shadowOpacity: true,
+  shadowRadius: true,
+  textShadowColor: true,
+  textShadowOffset: true,
+  textShadowRadius: true
+};
 function expandStyles(style) {
   const res = {};
+  boxShadowReducer(res, style);
+  textShadowReducer(res, style);
   for (const key in style) {
-    updateReactDOMStyle(res, key, style[key]);
+    if (reducedStyleKeys[key])
+      continue;
+    if (key in pseudos) {
+      res[key] = expandStyles(style[key]);
+    } else {
+      updateReactDOMStyle(res, key, style[key]);
+    }
   }
   return res;
 }
 __name(expandStyles, "expandStyles");
-function inline(style) {
-  return prefixInlineStyles(expandStyles(style));
+function updateReactDOMStyle(style, key, value) {
+  value = normalizeValueWithProperty(value, key);
+  const out = expandStyle(key, value);
+  if (out) {
+    Object.assign(style, Object.fromEntries(out));
+  } else {
+    style[key] = value;
+  }
 }
-__name(inline, "inline");
-const STYLE_SHORT_FORM_EXPANSIONS = {
-  borderColor: ["borderTopColor", "borderRightColor", "borderBottomColor", "borderLeftColor"],
-  borderRadius: [
-    "borderTopLeftRadius",
-    "borderTopRightRadius",
-    "borderBottomRightRadius",
-    "borderBottomLeftRadius"
-  ],
-  borderStyle: ["borderTopStyle", "borderRightStyle", "borderBottomStyle", "borderLeftStyle"],
-  borderWidth: ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
-  margin: ["marginTop", "marginRight", "marginBottom", "marginLeft"],
-  marginHorizontal: ["marginRight", "marginLeft"],
-  marginVertical: ["marginTop", "marginBottom"],
-  overflow: ["overflowX", "overflowY"],
-  overscrollBehavior: ["overscrollBehaviorX", "overscrollBehaviorY"],
-  padding: ["paddingTop", "paddingRight", "paddingBottom", "paddingLeft"],
-  paddingHorizontal: ["paddingRight", "paddingLeft"],
-  paddingVertical: ["paddingTop", "paddingBottom"]
-};
+__name(updateReactDOMStyle, "updateReactDOMStyle");
 const generateAtomicStyles = /* @__PURE__ */ __name((style) => {
   const res = expandStyles(style);
-  if (style.shadowColor != null || style.shadowOffset != null || style.shadowOpacity != null || style.shadowRadius != null) {
-    boxShadowReducer(res, style);
-    delete res["shadowColor"];
-    delete res["shadowOffset"];
-    delete res["shadowOpacity"];
-    delete res["shadowRadius"];
-  }
-  if (style.textShadowColor != null || style.textShadowOffset != null || style.textShadowRadius != null) {
-    textShadowReducer(res, style);
-    delete res["textShadowColor"];
-    delete res["textShadowOffset"];
-    delete res["textShadowRadius"];
-  }
   const out = {};
   for (const key in res) {
     const value = res[key];
@@ -61,11 +52,11 @@ const generateAtomicStyles = /* @__PURE__ */ __name((style) => {
         const { identifier } = cachedResult;
         out[identifier] = cachedResult;
       } else {
-        const identifier = createIdentifier("r", key, value);
-        const rules = createAtomicRules(identifier, key, value);
+        const identifier = simpleHash(key + valueString);
+        const rules = createAtomicRules(identifier, key, valueString);
         const cachedResult2 = cache.set(key, valueString, {
           property: key,
-          value: stringifyValueWithProperty(value, key),
+          value: valueString,
           identifier,
           rules
         });
@@ -75,16 +66,6 @@ const generateAtomicStyles = /* @__PURE__ */ __name((style) => {
   }
   return out;
 }, "generateAtomicStyles");
-function updateReactDOMStyle(style, key, value) {
-  value = normalizeValueWithProperty(value, key);
-  const out = expandStyle(key, value);
-  if (out) {
-    Object.assign(style, Object.fromEntries(out));
-  } else {
-    style[key] = value;
-  }
-}
-__name(updateReactDOMStyle, "updateReactDOMStyle");
 function expandStyle(key, value) {
   if (key === "flex") {
     if (value <= -1) {
@@ -153,15 +134,9 @@ function createAtomicRules(identifier, property, value) {
   const rules = [];
   const selector = `.${identifier}`;
   switch (property) {
-    case "animationKeyframes": {
-      const { animationNames, rules: keyframesRules } = processKeyframesValue(value);
-      const block = createDeclarationBlock({ animationName: animationNames.join(",") });
-      rules.push(`${selector}${block}`, ...keyframesRules);
-      break;
-    }
     case "placeholderTextColor": {
       const block = createDeclarationBlock({ color: value, opacity: 1 });
-      rules.push(`${selector}::-webkit-input-placeholder${block}`, `${selector}::-moz-placeholder${block}`, `${selector}:-ms-input-placeholder${block}`, `${selector}::placeholder${block}`);
+      rules.push(`${selector}::placeholder${block}`);
       break;
     }
     case "pointerEvents": {
@@ -200,58 +175,16 @@ function createAtomicRules(identifier, property, value) {
   return rules;
 }
 __name(createAtomicRules, "createAtomicRules");
-function processKeyframesValue(keyframesValue) {
-  if (typeof keyframesValue === "number") {
-    throw new Error(`Invalid CSS keyframes type: ${typeof keyframesValue}`);
-  }
-  const animationNames = [];
-  const rules = [];
-  const value = Array.isArray(keyframesValue) ? keyframesValue : [keyframesValue];
-  for (const keyframes of value) {
-    if (typeof keyframes === "string") {
-      animationNames.push(keyframes);
-    } else {
-      const { identifier, rules: keyframesRules } = createKeyframes(keyframes);
-      animationNames.push(identifier);
-      rules.push(...keyframesRules);
-    }
-  }
-  return { animationNames, rules };
-}
-__name(processKeyframesValue, "processKeyframesValue");
-function createKeyframes(keyframes) {
-  const prefixes2 = ["-webkit-", ""];
-  const identifier = createIdentifier("r", "animation", keyframes);
-  const steps = "{" + Object.keys(keyframes).map((stepName) => {
-    const rule = keyframes[stepName];
-    const block = createDeclarationBlock(rule);
-    return `${stepName}${block}`;
-  }).join("") + "}";
-  const rules = prefixes2.map((prefix) => {
-    return `@${prefix}keyframes ${identifier}${steps}`;
-  });
-  return { identifier, rules };
-}
-__name(createKeyframes, "createKeyframes");
 function createDeclarationBlock(style) {
-  const domStyle = prefixStyles(expandStyles(style));
+  const domStyle = expandStyles(style);
   const declarationsString = Object.keys(domStyle).map((property) => {
     const value = domStyle[property];
     const prop = hyphenateStyleName(property);
-    if (Array.isArray(value)) {
-      return value.map((v) => `${prop}:${v}`).join(";");
-    } else {
-      return `${prop}:${value}`;
-    }
+    return `${prop}:${value}`;
   }).sort().join(";");
   return `{${declarationsString};}`;
 }
 __name(createDeclarationBlock, "createDeclarationBlock");
-function createIdentifier(prefix, name, value) {
-  const hashedString = simpleHash(name + stringifyValueWithProperty(value, name));
-  return `${prefix}-${hashedString}`;
-}
-__name(createIdentifier, "createIdentifier");
 const cache = {
   get(property, value) {
     if (cache[property] != null && cache[property].hasOwnProperty(value) && cache[property][value] != null) {
@@ -266,8 +199,7 @@ const cache = {
   }
 };
 function stringifyValueWithProperty(value, property) {
-  const normalizedValue = normalizeValueWithProperty(value, property);
-  return typeof normalizedValue !== "string" ? JSON.stringify(normalizedValue || "") : normalizedValue;
+  return normalizeValueWithProperty(value, property);
 }
 __name(stringifyValueWithProperty, "stringifyValueWithProperty");
 const mapTransform = /* @__PURE__ */ __name((transform) => {
@@ -294,7 +226,8 @@ const colorProps = {
 };
 function normalizeValueWithProperty(value, property) {
   if (process.env.TAMAGUI_TARGET === "web") {
-    if ((property === void 0 || property === null || !unitlessNumbers[property]) && typeof value === "number") {
+    const shouldCoerceToPx = typeof value === "number" && (property === void 0 || property === null || !unitlessNumbers[property]);
+    if (shouldCoerceToPx) {
       return `${value}px`;
     }
   }
@@ -322,6 +255,7 @@ const normalizeColor = /* @__PURE__ */ __name((color, opacity = 1) => {
     const alpha = (a * opacity).toFixed(2);
     return `rgba(${r},${g},${b},${alpha})`;
   }
+  return `${color}`;
 }, "normalizeColor");
 const isWebColor = /* @__PURE__ */ __name((color) => color === "currentcolor" || color === "currentColor" || color === "inherit" || color.indexOf("var(") === 0, "isWebColor");
 const processColor = /* @__PURE__ */ __name((color) => {
@@ -381,25 +315,17 @@ const unitlessNumbers = {
   scaleZ: true,
   shadowOpacity: true
 };
-const prefixes = ["ms", "Moz", "O", "Webkit"];
-const prefixKey = /* @__PURE__ */ __name((prefix, key) => {
-  return prefix + key.charAt(0).toUpperCase() + key.substring(1);
-}, "prefixKey");
-Object.keys(unitlessNumbers).forEach((prop) => {
-  prefixes.forEach((prefix) => {
-    unitlessNumbers[prefixKey(prefix, prop)] = unitlessNumbers[prop];
-  });
-});
 const resolveShadowValue = /* @__PURE__ */ __name((style) => {
   const { shadowColor, shadowOffset, shadowOpacity, shadowRadius } = style;
+  if (shadowRadius === void 0) {
+    return;
+  }
   const { height, width } = shadowOffset || defaultOffset;
   const offsetX = normalizeValueWithProperty(width);
   const offsetY = normalizeValueWithProperty(height);
   const blurRadius = normalizeValueWithProperty(shadowRadius || 0);
-  const color = normalizeColor(shadowColor || "black", shadowOpacity);
-  if (color != null && offsetX != null && offsetY != null && blurRadius != null) {
-    return `${offsetX} ${offsetY} ${blurRadius} ${color}`;
-  }
+  const color = normalizeColor(String(shadowColor || "black"), shadowOpacity);
+  return `${offsetX} ${offsetY} ${blurRadius} ${color}`;
 }, "resolveShadowValue");
 function boxShadowReducer(resolvedStyle, style) {
   const { boxShadow } = style;
@@ -423,10 +349,30 @@ function textShadowReducer(resolvedStyle, style) {
   }
 }
 __name(textShadowReducer, "textShadowReducer");
+const STYLE_SHORT_FORM_EXPANSIONS = {
+  borderColor: ["borderTopColor", "borderRightColor", "borderBottomColor", "borderLeftColor"],
+  borderRadius: [
+    "borderTopLeftRadius",
+    "borderTopRightRadius",
+    "borderBottomRightRadius",
+    "borderBottomLeftRadius"
+  ],
+  borderStyle: ["borderTopStyle", "borderRightStyle", "borderBottomStyle", "borderLeftStyle"],
+  borderWidth: ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
+  margin: ["marginTop", "marginRight", "marginBottom", "marginLeft"],
+  marginHorizontal: ["marginRight", "marginLeft"],
+  marginVertical: ["marginTop", "marginBottom"],
+  overscrollBehavior: ["overscrollBehaviorX", "overscrollBehaviorY"],
+  padding: ["paddingTop", "paddingRight", "paddingBottom", "paddingLeft"],
+  paddingHorizontal: ["paddingRight", "paddingLeft"],
+  paddingVertical: ["paddingTop", "paddingBottom"],
+  ...isWeb && {
+    overflow: ["overflowX", "overflowY"]
+  }
+};
 export {
   expandStyle,
   expandStyles,
-  generateAtomicStyles,
-  inline
+  generateAtomicStyles
 };
 //# sourceMappingURL=generateAtomicStyles.js.map