@tamagui/core 1.0.0-beta.9 → 1.0.1-beta.101

package/dist/esm/helpers/expandStyle.js

@@ -0,0 +1,90 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { isWeb } from "../constants/platform";
+function expandStyle(key, value) {
+  if (process.env.TAMAGUI_TARGET === "web") {
+    if (key === "flex") {
+      if (value <= -1) {
+        return [
+          ["flexGrow", 0],
+          ["flexShrink", 1],
+          ["flexBasis", "auto"]
+        ];
+      }
+      if (value >= 0) {
+        return [
+          ["flexGrow", value],
+          ["flexShrink", 1]
+        ];
+      }
+      return;
+    }
+    switch (key) {
+      case "aspectRatio": {
+        return [[key, value.toString()]];
+      }
+      case "backgroundClip": {
+        if (value === "text") {
+          return [
+            ["backgroundClip", value],
+            ["WebkitBackgroundClip", value]
+          ];
+        }
+        break;
+      }
+      case "textAlignVertical": {
+        return [["verticalAlign", value === "center" ? "middle" : value]];
+      }
+      case "textDecorationLine": {
+        return [["textDecorationLine", value]];
+      }
+      case "writingDirection": {
+        return [["direction", value]];
+      }
+    }
+  }
+  const longKey = STYLE_SHORT_FORM_EXPANSIONS[key];
+  if (longKey) {
+    return longKey.map((key2) => {
+      return [key2, value];
+    });
+  }
+}
+const STYLE_SHORT_FORM_EXPANSIONS = __spreadValues({
+  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
+};
+//# sourceMappingURL=expandStyle.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/helpers/expandStyle.ts"],
+  "sourcesContent": ["/**\n * Some parts adapted from react-native-web\n * Copyright (c) Nicolas Gallagher licensed under the MIT license.\n */\n\nimport { isWeb } from '../constants/platform'\n\nexport function expandStyle(key: string, value: any) {\n  if (process.env.TAMAGUI_TARGET === 'web') {\n    if (key === 'flex') {\n      // The 'flex' property value in React Native must be a positive integer,\n      // 0, or -1.\n      if (value <= -1) {\n        return [\n          ['flexGrow', 0],\n          ['flexShrink', 1],\n          ['flexBasis', 'auto'],\n        ]\n      }\n      // normalizing to better align with native\n      // see spec for flex shorthand https://developer.mozilla.org/en-US/docs/Web/CSS/flex\n      if (value >= 0) {\n        return [\n          ['flexGrow', value],\n          ['flexShrink', 1],\n        ]\n      }\n      return\n    }\n\n    // web only\n    switch (key) {\n      case 'aspectRatio': {\n        return [[key, value.toString()]]\n      }\n\n      // TODO: remove once this issue is fixed\n      // https://github.com/rofrischmann/inline-style-prefixer/issues/159\n      case 'backgroundClip': {\n        if (value === 'text') {\n          return [\n            ['backgroundClip', value],\n            ['WebkitBackgroundClip', value],\n          ]\n        }\n        break\n      }\n\n      case 'textAlignVertical': {\n        return [['verticalAlign', value === 'center' ? 'middle' : value]]\n      }\n\n      case 'textDecorationLine': {\n        return [['textDecorationLine', value]]\n      }\n\n      case 'writingDirection': {\n        return [['direction', value]]\n      }\n    }\n  }\n\n  const longKey = STYLE_SHORT_FORM_EXPANSIONS[key]\n  if (longKey) {\n    return longKey.map((key) => {\n      return [key, value]\n    })\n  }\n}\n\nconst STYLE_SHORT_FORM_EXPANSIONS: Record<string, string[]> = {\n  borderColor: ['borderTopColor', 'borderRightColor', 'borderBottomColor', 'borderLeftColor'],\n  borderRadius: [\n    'borderTopLeftRadius',\n    'borderTopRightRadius',\n    'borderBottomRightRadius',\n    'borderBottomLeftRadius',\n  ],\n  borderStyle: ['borderTopStyle', 'borderRightStyle', 'borderBottomStyle', 'borderLeftStyle'],\n  borderWidth: ['borderTopWidth', 'borderRightWidth', 'borderBottomWidth', 'borderLeftWidth'],\n  margin: ['marginTop', 'marginRight', 'marginBottom', 'marginLeft'],\n  marginHorizontal: ['marginRight', 'marginLeft'],\n  marginVertical: ['marginTop', 'marginBottom'],\n  overscrollBehavior: ['overscrollBehaviorX', 'overscrollBehaviorY'],\n  padding: ['paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft'],\n  paddingHorizontal: ['paddingRight', 'paddingLeft'],\n  paddingVertical: ['paddingTop', 'paddingBottom'],\n  ...(isWeb && {\n    // react-native doesn't support X / Y\n    overflow: ['overflowX', 'overflowY'],\n  }),\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAKA;AAEO,qBAAqB,KAAa,OAAY;AACnD,MAAI,QAAQ,IAAI,mBAAmB,OAAO;AACxC,QAAI,QAAQ,QAAQ;AAGlB,UAAI,SAAS,IAAI;AACf,eAAO;AAAA,UACL,CAAC,YAAY,CAAC;AAAA,UACd,CAAC,cAAc,CAAC;AAAA,UAChB,CAAC,aAAa,MAAM;AAAA,QACtB;AAAA,MACF;AAGA,UAAI,SAAS,GAAG;AACd,eAAO;AAAA,UACL,CAAC,YAAY,KAAK;AAAA,UAClB,CAAC,cAAc,CAAC;AAAA,QAClB;AAAA,MACF;AACA;AAAA,IACF;AAGA,YAAQ;AAAA,WACD,eAAe;AAClB,eAAO,CAAC,CAAC,KAAK,MAAM,SAAS,CAAC,CAAC;AAAA,MACjC;AAAA,WAIK,kBAAkB;AACrB,YAAI,UAAU,QAAQ;AACpB,iBAAO;AAAA,YACL,CAAC,kBAAkB,KAAK;AAAA,YACxB,CAAC,wBAAwB,KAAK;AAAA,UAChC;AAAA,QACF;AACA;AAAA,MACF;AAAA,WAEK,qBAAqB;AACxB,eAAO,CAAC,CAAC,iBAAiB,UAAU,WAAW,WAAW,KAAK,CAAC;AAAA,MAClE;AAAA,WAEK,sBAAsB;AACzB,eAAO,CAAC,CAAC,sBAAsB,KAAK,CAAC;AAAA,MACvC;AAAA,WAEK,oBAAoB;AACvB,eAAO,CAAC,CAAC,aAAa,KAAK,CAAC;AAAA,MAC9B;AAAA;AAAA,EAEJ;AAEA,QAAM,UAAU,4BAA4B;AAC5C,MAAI,SAAS;AACX,WAAO,QAAQ,IAAI,CAAC,SAAQ;AAC1B,aAAO,CAAC,MAAK,KAAK;AAAA,IACpB,CAAC;AAAA,EACH;AACF;AAEA,MAAM,8BAAwD;AAAA,EAC5D,aAAa,CAAC,kBAAkB,oBAAoB,qBAAqB,iBAAiB;AAAA,EAC1F,cAAc;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,aAAa,CAAC,kBAAkB,oBAAoB,qBAAqB,iBAAiB;AAAA,EAC1F,aAAa,CAAC,kBAAkB,oBAAoB,qBAAqB,iBAAiB;AAAA,EAC1F,QAAQ,CAAC,aAAa,eAAe,gBAAgB,YAAY;AAAA,EACjE,kBAAkB,CAAC,eAAe,YAAY;AAAA,EAC9C,gBAAgB,CAAC,aAAa,cAAc;AAAA,EAC5C,oBAAoB,CAAC,uBAAuB,qBAAqB;AAAA,EACjE,SAAS,CAAC,cAAc,gBAAgB,iBAAiB,aAAa;AAAA,EACtE,mBAAmB,CAAC,gBAAgB,aAAa;AAAA,EACjD,iBAAiB,CAAC,cAAc,eAAe;AAAA,GAC3C,SAAS;AAAA,EAEX,UAAU,CAAC,aAAa,WAAW;AACrC;",
+  "names": []
+}

package/dist/esm/helpers/expandStyles.js

@@ -0,0 +1,103 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { getConfig } from "../conf";
+import { isWeb } from "../constants/platform";
+import { expandStyle } from "./expandStyle";
+import { colorToRGBA, normalizeColor } from "./normalizeColor";
+import { normalizeValueWithProperty } from "./normalizeValueWithProperty";
+import { pseudoDescriptors } from "./pseudoDescriptors";
+let shorthands = null;
+const defaultOffset = { height: 0, width: 0 };
+function expandStyles(style) {
+  const res = {};
+  for (let key in style) {
+    shorthands = shorthands || getConfig().shorthands;
+    if (shorthands) {
+      key = shorthands[key] || key;
+    }
+    if (key in pseudoDescriptors) {
+      res[key] = expandStyles(style[key]);
+      continue;
+    }
+    const val = normalizeValueWithProperty(style[key], key);
+    const out = expandStyle(key, val);
+    if (out) {
+      Object.assign(res, Object.fromEntries(out));
+    } else {
+      res[key] = val;
+    }
+  }
+  fixStyles(res);
+  return res;
+}
+function fixStyles(style) {
+  if (style.shadowRadius) {
+    Object.assign(style, normalizeShadow(style));
+  }
+  for (const key in borderDefaults) {
+    if (style[key] && !style[borderDefaults[key]]) {
+      style[borderDefaults[key]] = "solid";
+    }
+  }
+}
+const borderDefaults = {
+  borderWidth: "borderStyle",
+  borderBottomWidth: "borderBottomStyle",
+  borderTopWidth: "borderTopStyle",
+  borderLeftWidth: "borderLeftStyle",
+  borderRightWidth: "borderRightStyle"
+};
+function normalizeShadow({
+  shadowColor,
+  shadowOffset,
+  shadowOpacity,
+  shadowRadius
+}) {
+  const { height, width } = shadowOffset || defaultOffset;
+  const colorStr = String(shadowColor || "black");
+  return __spreadValues(__spreadValues({
+    shadowOffset: {
+      width: normalizeValueWithProperty(width || 0),
+      height: normalizeValueWithProperty(height || 0)
+    },
+    shadowRadius: normalizeValueWithProperty(shadowRadius || 0)
+  }, isWeb && {
+    shadowColor: normalizeColor(colorStr, shadowOpacity)
+  }), !isWeb && (() => {
+    const rgba = colorToRGBA(colorStr);
+    if (!rgba) {
+      if (process.env.NODE_ENV === "development") {
+        console.warn("No rgba form", colorStr);
+      }
+      return {
+        shadowColor,
+        shadowOpacity
+      };
+    }
+    const [r, g, b, a] = rgba;
+    return {
+      shadowColor: `rgb(${r},${g},${b})`,
+      shadowOpacity: shadowOpacity ?? a
+    };
+  })());
+}
+export {
+  defaultOffset,
+  expandStyles,
+  fixStyles
+};
+//# sourceMappingURL=expandStyles.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/helpers/expandStyles.ts"],
+  "sourcesContent": ["import { getConfig } from '../conf'\nimport { isWeb } from '../constants/platform'\nimport { expandStyle } from './expandStyle'\nimport { colorToRGBA, normalizeColor } from './normalizeColor'\nimport { normalizeValueWithProperty } from './normalizeValueWithProperty'\nimport { pseudoDescriptors } from './pseudoDescriptors'\n\nlet shorthands: Record<string, string> | null = null\nexport const defaultOffset = { height: 0, width: 0 }\n\n/**\n * This is what you want to run before Object.assign() a style onto another.\n * It does the following:\n *   1. Turns user shorthands into longhands, ie px = paddingHorizontal\n *   2. Normalizes various inconsistent styles to be more consistent\n *   3. Expands react-native shorthands, ie paddingHorizontal => paddingLeft, paddingRight\n */\n\nexport function expandStyles(style: Record<string, any>) {\n  const res: Record<string, any> = {}\n\n  for (let key in style) {\n    shorthands = shorthands || getConfig().shorthands\n    if (shorthands) {\n      key = shorthands[key] || key\n    }\n    if (key in pseudoDescriptors) {\n      res[key] = expandStyles(style[key])\n      continue\n    }\n    const val = normalizeValueWithProperty(style[key], key)\n    // expand react-native shorthands\n    const out = expandStyle(key, val)\n    if (out) {\n      Object.assign(res, Object.fromEntries(out))\n    } else {\n      res[key] = val\n    }\n  }\n\n  fixStyles(res)\n\n  return res\n}\n\nexport function fixStyles(style: Record<string, any>) {\n  if (style.shadowRadius) {\n    Object.assign(style, normalizeShadow(style))\n  }\n\n  // ensure border style set by default to solid\n  for (const key in borderDefaults) {\n    if (style[key] && !style[borderDefaults[key]]) {\n      style[borderDefaults[key]] = 'solid'\n    }\n  }\n}\n\nconst borderDefaults = {\n  borderWidth: 'borderStyle',\n  borderBottomWidth: 'borderBottomStyle',\n  borderTopWidth: 'borderTopStyle',\n  borderLeftWidth: 'borderLeftStyle',\n  borderRightWidth: 'borderRightStyle',\n}\n\nfunction normalizeShadow({\n  shadowColor,\n  shadowOffset,\n  shadowOpacity,\n  shadowRadius,\n}: Record<string, any>) {\n  const { height, width } = shadowOffset || defaultOffset\n  const colorStr = String(shadowColor || 'black')\n  return {\n    shadowOffset: {\n      width: normalizeValueWithProperty(width || 0),\n      height: normalizeValueWithProperty(height || 0),\n    },\n    shadowRadius: normalizeValueWithProperty(shadowRadius || 0),\n    ...(isWeb && {\n      shadowColor: normalizeColor(colorStr, shadowOpacity),\n    }),\n    ...(!isWeb &&\n      (() => {\n        // on native fix bug - shadows behave better if turned into non-alpha rgb() + shadowOpacity\n        const rgba = colorToRGBA(colorStr)\n        if (!rgba) {\n          if (process.env.NODE_ENV === 'development') {\n            console.warn('No rgba form', colorStr)\n          }\n          return {\n            shadowColor,\n            shadowOpacity,\n          }\n        }\n        const [r, g, b, a] = rgba\n        return {\n          shadowColor: `rgb(${r},${g},${b})`,\n          shadowOpacity: shadowOpacity ?? a,\n        }\n      })()),\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA,IAAI,aAA4C;AACzC,MAAM,gBAAgB,EAAE,QAAQ,GAAG,OAAO,EAAE;AAU5C,sBAAsB,OAA4B;AACvD,QAAM,MAA2B,CAAC;AAElC,WAAS,OAAO,OAAO;AACrB,iBAAa,cAAc,UAAU,EAAE;AACvC,QAAI,YAAY;AACd,YAAM,WAAW,QAAQ;AAAA,IAC3B;AACA,QAAI,OAAO,mBAAmB;AAC5B,UAAI,OAAO,aAAa,MAAM,IAAI;AAClC;AAAA,IACF;AACA,UAAM,MAAM,2BAA2B,MAAM,MAAM,GAAG;AAEtD,UAAM,MAAM,YAAY,KAAK,GAAG;AAChC,QAAI,KAAK;AACP,aAAO,OAAO,KAAK,OAAO,YAAY,GAAG,CAAC;AAAA,IAC5C,OAAO;AACL,UAAI,OAAO;AAAA,IACb;AAAA,EACF;AAEA,YAAU,GAAG;AAEb,SAAO;AACT;AAEO,mBAAmB,OAA4B;AACpD,MAAI,MAAM,cAAc;AACtB,WAAO,OAAO,OAAO,gBAAgB,KAAK,CAAC;AAAA,EAC7C;AAGA,aAAW,OAAO,gBAAgB;AAChC,QAAI,MAAM,QAAQ,CAAC,MAAM,eAAe,OAAO;AAC7C,YAAM,eAAe,QAAQ;AAAA,IAC/B;AAAA,EACF;AACF;AAEA,MAAM,iBAAiB;AAAA,EACrB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,kBAAkB;AACpB;AAEA,yBAAyB;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GACsB;AACtB,QAAM,EAAE,QAAQ,UAAU,gBAAgB;AAC1C,QAAM,WAAW,OAAO,eAAe,OAAO;AAC9C,SAAO;AAAA,IACL,cAAc;AAAA,MACZ,OAAO,2BAA2B,SAAS,CAAC;AAAA,MAC5C,QAAQ,2BAA2B,UAAU,CAAC;AAAA,IAChD;AAAA,IACA,cAAc,2BAA2B,gBAAgB,CAAC;AAAA,KACtD,SAAS;AAAA,IACX,aAAa,eAAe,UAAU,aAAa;AAAA,EACrD,IACI,CAAC,SACF,OAAM;AAEL,UAAM,OAAO,YAAY,QAAQ;AACjC,QAAI,CAAC,MAAM;AACT,UAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,gBAAQ,KAAK,gBAAgB,QAAQ;AAAA,MACvC;AACA,aAAO;AAAA,QACL;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,UAAM,CAAC,GAAG,GAAG,GAAG,KAAK;AACrB,WAAO;AAAA,MACL,aAAa,OAAO,KAAK,KAAK;AAAA,MAC9B,eAAe,iBAAiB;AAAA,IAClC;AAAA,EACF,GAAG;AAET;",
+  "names": []
+}

package/dist/esm/helpers/extendStaticConfig.js

@@ -1,60 +1,66 @@
 var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import { stylePropsView } from "@tamagui/helpers";
 import { createPropMapper } from "./createPropMapper";
+import { mergeProps } from "./mergeProps";
 function extendStaticConfig(config, parent) {
-  var _a;
   if (!parent || !("staticConfig" in parent)) {
     return parseStaticConfig(config);
   }
-  const variants = {
-    ...parent.staticConfig.variants
-  };
+  const parentStaticConf = parent.staticConfig;
+  const variants = __spreadValues({}, parentStaticConf.variants);
   if (config.variants) {
     for (const key in config.variants) {
       if (variants[key]) {
-        variants[key] = {
-          ...variants[key],
-          ...config.variants[key]
-        };
+        variants[key] = __spreadValues(__spreadValues({}, variants[key]), config.variants[key]);
       } else {
         variants[key] = config.variants[key];
       }
     }
   }
-  return parseStaticConfig({
-    ...parent.staticConfig,
-    ...config,
+  const parentNames = [...parentStaticConf.parentNames || []];
+  if (parentStaticConf.componentName) {
+    parentNames.push(parentStaticConf.componentName);
+  }
+  return parseStaticConfig(__spreadProps(__spreadValues(__spreadValues({}, parentStaticConf), config), {
     variants,
-    isZStack: config.isZStack || parent.staticConfig.isZStack,
-    isText: config.isText || parent.staticConfig.isText || false,
-    isInput: config.isInput || parent.staticConfig.isInput || false,
-    neverFlatten: config.neverFlatten || parent.staticConfig.neverFlatten,
-    ensureOverriddenProp: (_a = config.ensureOverriddenProp) != null ? _a : parent.staticConfig.ensureOverriddenProp,
-    validStyles: config.validStyles ? {
-      ...parent.staticConfig.validStyles,
-      ...config.validStyles
-    } : parent.staticConfig.validStyles || stylePropsView,
-    defaultVariants: {
-      ...parent.staticConfig.defaultVariants,
-      ...config.defaultVariants
-    },
-    defaultProps: {
-      ...parent.staticConfig.defaultProps,
-      ...parent.staticConfig.defaultVariants,
-      ...config.defaultProps,
-      ...config.defaultVariants
-    }
-  });
+    parentNames,
+    isZStack: config.isZStack || parentStaticConf.isZStack,
+    isText: config.isText || parentStaticConf.isText || false,
+    isInput: config.isInput || parentStaticConf.isInput || false,
+    neverFlatten: config.neverFlatten || parentStaticConf.neverFlatten,
+    ensureOverriddenProp: config.ensureOverriddenProp ?? parentStaticConf.ensureOverriddenProp,
+    validStyles: config.validStyles ? __spreadValues(__spreadValues({}, parentStaticConf.validStyles), config.validStyles) : parentStaticConf.validStyles || stylePropsView,
+    defaultProps: mergeProps(__spreadValues(__spreadValues({}, parentStaticConf.defaultProps), parentStaticConf.defaultVariants), __spreadValues(__spreadValues({}, config.defaultProps), config.defaultVariants))[0]
+  }));
 }
-__name(extendStaticConfig, "extendStaticConfig");
-const parseStaticConfig = /* @__PURE__ */ __name((config) => {
-  return {
-    ...config,
-    parsed: true,
-    propMapper: createPropMapper(config)
-  };
-}, "parseStaticConfig");
+const parseStaticConfig = (config) => {
+  const parsed = __spreadProps(__spreadValues({
+    defaultProps: {}
+  }, config), {
+    parsed: true
+  });
+  return __spreadProps(__spreadValues({}, parsed), {
+    propMapper: createPropMapper(parsed)
+  });
+};
 export {
   extendStaticConfig,
   parseStaticConfig

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    defaultVariants: {\n      ...parent.staticConfig.defaultVariants,\n      ...config.defaultVariants,\n    },\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,OACZ,OAAO,aAAa;AAAA,EACzB;AAGA,MAAI,OAAO,UAAU;AACnB,eAAW,OAAO,OAAO,UAAU;AACjC,UAAI,SAAS,MAAM;AACjB,iBAAS,OAAO;AAAA,aACX,SAAS;AAAA,aACT,OAAO,SAAS;AAAA,QACrB;AAAA,MACF,OAAO;AACL,iBAAS,OAAO,OAAO,SAAS;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAEA,SAAO,kBAAkB;AAAA,OACpB,OAAO;AAAA,OACP;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,SACK,OAAO,aAAa;AAAA,SACpB,OAAO;AAAA,IACZ,IACA,OAAO,aAAa,eAAe;AAAA,IACvC,iBAAiB;AAAA,SACZ,OAAO,aAAa;AAAA,SACpB,OAAO;AAAA,IACZ;AAAA,IACA,cAAc;AAAA,SACT,OAAO,aAAa;AAAA,SACpB,OAAO,aAAa;AAAA,SACpB,OAAO;AAAA,SACP,OAAO;AAAA,IACZ;AAAA,EACF,CAAC;AACH;AAjDgB;AAmDT,MAAM,oBAAoB,wBAAC,WAAsD;AACtF,SAAO;AAAA,OACF;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 parentStaticConf = parent.staticConfig as StaticConfig\n  const variants = {\n    ...parentStaticConf.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  // include our own\n  const parentNames = [...(parentStaticConf.parentNames || [])]\n  if (parentStaticConf.componentName) {\n    parentNames.push(parentStaticConf.componentName)\n  }\n\n  return parseStaticConfig({\n    ...parentStaticConf,\n    ...config,\n    variants,\n    parentNames,\n    isZStack: config.isZStack || parentStaticConf.isZStack,\n    isText: config.isText || parentStaticConf.isText || false,\n    isInput: config.isInput || parentStaticConf.isInput || false,\n    neverFlatten: config.neverFlatten || parentStaticConf.neverFlatten,\n    ensureOverriddenProp: config.ensureOverriddenProp ?? parentStaticConf.ensureOverriddenProp,\n    validStyles: config.validStyles\n      ? {\n          ...parentStaticConf.validStyles,\n          ...config.validStyles,\n        }\n      : parentStaticConf.validStyles || stylePropsView,\n    defaultProps: mergeProps(\n      {\n        ...parentStaticConf.defaultProps,\n        ...parentStaticConf.defaultVariants,\n      },\n      {\n        ...config.defaultProps,\n        ...config.defaultVariants,\n      }\n    )[0],\n  })\n}\n\nexport const parseStaticConfig = (config: Partial<StaticConfig>): StaticConfigParsed => {\n  const parsed = {\n    defaultProps: {},\n    ...config,\n    parsed: true,\n  } as const\n  return {\n    ...parsed,\n    propMapper: createPropMapper(parsed as StaticConfigParsed),\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAGA;AACA;AAEO,4BAA4B,QAA+B,QAA4B;AAC5F,MAAI,CAAC,UAAU,CAAE,mBAAkB,SAAS;AAC1C,WAAO,kBAAkB,MAAM;AAAA,EACjC;AAEA,QAAM,mBAAmB,OAAO;AAChC,QAAM,WAAW,mBACZ,iBAAiB;AAItB,MAAI,OAAO,UAAU;AACnB,eAAW,OAAO,OAAO,UAAU;AACjC,UAAI,SAAS,MAAM;AACjB,iBAAS,OAAO,kCACX,SAAS,OACT,OAAO,SAAS;AAAA,MAEvB,OAAO;AACL,iBAAS,OAAO,OAAO,SAAS;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AAGA,QAAM,cAAc,CAAC,GAAI,iBAAiB,eAAe,CAAC,CAAE;AAC5D,MAAI,iBAAiB,eAAe;AAClC,gBAAY,KAAK,iBAAiB,aAAa;AAAA,EACjD;AAEA,SAAO,kBAAkB,gDACpB,mBACA,SAFoB;AAAA,IAGvB;AAAA,IACA;AAAA,IACA,UAAU,OAAO,YAAY,iBAAiB;AAAA,IAC9C,QAAQ,OAAO,UAAU,iBAAiB,UAAU;AAAA,IACpD,SAAS,OAAO,WAAW,iBAAiB,WAAW;AAAA,IACvD,cAAc,OAAO,gBAAgB,iBAAiB;AAAA,IACtD,sBAAsB,OAAO,wBAAwB,iBAAiB;AAAA,IACtE,aAAa,OAAO,cAChB,kCACK,iBAAiB,cACjB,OAAO,eAEZ,iBAAiB,eAAe;AAAA,IACpC,cAAc,WACZ,kCACK,iBAAiB,eACjB,iBAAiB,kBAEtB,kCACK,OAAO,eACP,OAAO,gBAEd,EAAE;AAAA,EACJ,EAAC;AACH;AAEO,MAAM,oBAAoB,CAAC,WAAsD;AACtF,QAAM,SAAS;AAAA,IACb,cAAc,CAAC;AAAA,KACZ,SAFU;AAAA,IAGb,QAAQ;AAAA,EACV;AACA,SAAO,iCACF,SADE;AAAA,IAEL,YAAY,iBAAiB,MAA4B;AAAA,EAC3D;AACF;",
   "names": []
 }

package/dist/esm/helpers/fixNativeShadow.js

@@ -1,7 +1,5 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-const fixNativeShadow = /* @__PURE__ */ __name((a) => {
-}, "fixNativeShadow");
+const fixNativeShadow = (a) => {
+};
 export {
   fixNativeShadow
 };

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/helpers/fixNativeShadow.tsx"],
   "sourcesContent": ["// only native of course\nexport const fixNativeShadow = (a: any) => {}\n"],
-  "mappings": ";;AACO,MAAM,kBAAkB,wBAAC,MAAW;AAAC,GAAb;",
+  "mappings": "AACO,MAAM,kBAAkB,CAAC,MAAW;AAAC;",
   "names": []
 }

package/dist/esm/helpers/getExpandedShorthands.js

@@ -1,5 +1,3 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 import { getConfig } from "../conf";
 function getExpandedShorthands(props) {
   const shorthands = getConfig().shorthands;
@@ -12,7 +10,6 @@ function getExpandedShorthands(props) {
   }
   return res;
 }
-__name(getExpandedShorthands, "getExpandedShorthands");
 export {
   getExpandedShorthands
 };

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/helpers/getExpandedShorthands.ts"],
   "sourcesContent": ["import { getConfig } from '../conf'\nimport { Shorthands } from '../types'\n\nexport function getExpandedShorthands<A extends Object>(props: A): Omit<A, keyof Shorthands> {\n  const shorthands = getConfig().shorthands\n  if (!shorthands) {\n    return props\n  }\n  let res: A = {} as any\n  for (const key in props) {\n    // @ts-ignore\n    res[shorthands[key] || key] = props[key]\n  }\n  return res\n}\n"],
-  "mappings": ";;AAAA;AAGO,+BAAiD,OAAqC;AAC3F,QAAM,aAAa,UAAU,EAAE;AAC/B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AACA,MAAI,MAAS,CAAC;AACd,aAAW,OAAO,OAAO;AAEvB,QAAI,WAAW,QAAQ,OAAO,MAAM;AAAA,EACtC;AACA,SAAO;AACT;AAXgB;",
+  "mappings": "AAAA;AAGO,+BAAiD,OAAqC;AAC3F,QAAM,aAAa,UAAU,EAAE;AAC/B,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AACA,MAAI,MAAS,CAAC;AACd,aAAW,OAAO,OAAO;AAEvB,QAAI,WAAW,QAAQ,OAAO,MAAM;AAAA,EACtC;AACA,SAAO;AACT;",
   "names": []
 }

package/dist/{jsx/helpers/getTextSize.js → esm/helpers/getFont.js}

@@ -1,13 +1,11 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 import { getVariableValue } from "../createVariable";
-const getTextSize = /* @__PURE__ */ __name((val = "$4", { fonts, theme, props }) => {
+const getFont = (val = "$4", { fonts, theme, props }) => {
   var _a, _b, _c;
   const family = getVariableValue(props.fontFamily) || "$body";
   const font = fonts[family] || fonts["$body"];
   if (!font) {
     console.warn("\u26A0\uFE0F no font found", { family, fontTokens: Object.keys(fonts), val });
-    return;
+    return {};
   }
   const fontFamily = font.family;
   const fontSize = props.fontSize || font.size[val];
@@ -17,7 +15,7 @@ const getTextSize = /* @__PURE__ */ __name((val = "$4", { fonts, theme, props })
   const fontStyle = props.fontStyle || ((_a = font.style) == null ? void 0 : _a[val]);
   const textTransform = props.textTransform || ((_b = font.transform) == null ? void 0 : _b[val]);
   const color = props.color || ((_c = font.color) == null ? void 0 : _c[val]) || theme.color;
-  return {
+  const style = {
     color,
     fontStyle,
     textTransform,
@@ -27,7 +25,14 @@ const getTextSize = /* @__PURE__ */ __name((val = "$4", { fonts, theme, props })
     fontSize,
     lineHeight
   };
-}, "getTextSize");
+  if (process.env.NODE_ENV === "development") {
+    if (props["debug"]) {
+      console.log("getFont", val, style, "from props", props);
+    }
+  }
+  return style;
+};
 export {
-  getTextSize
+  getFont
 };
+//# sourceMappingURL=getFont.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/helpers/getFont.tsx"],
+  "sourcesContent": ["import { getVariableValue } from '../createVariable'\nimport { FontSizeTokens, TextProps, VariantSpreadFunction } from '../types'\n\nexport const getFont: VariantSpreadFunction<TextProps, FontSizeTokens> = (\n  val = '$4',\n  { fonts, theme, props }\n) => {\n  const family = getVariableValue(props.fontFamily) || '$body'\n  const font = fonts[family] || fonts['$body']\n  if (!font) {\n    console.warn('\u26A0\uFE0F no font found', { family, fontTokens: Object.keys(fonts), val })\n    return {} as any\n  }\n  const fontFamily = font.family\n  const fontSize = props.fontSize || font.size[val]\n  const lineHeight = props.lineHeight || font.lineHeight[val]\n  const fontWeight = props.fontWeight || font.weight[val]\n  const letterSpacing = props.letterSpacing || font.letterSpacing[val]\n  const fontStyle = props.fontStyle || font.style?.[val]\n  const textTransform = props.textTransform || font.transform?.[val]\n  const color = props.color || font.color?.[val] || theme.color\n  const style = {\n    color,\n    fontStyle,\n    textTransform,\n    fontFamily,\n    fontWeight,\n    letterSpacing,\n    fontSize,\n    lineHeight,\n  }\n  if (process.env.NODE_ENV === 'development') {\n    if (props['debug']) {\n      console.log('getFont', val, style, 'from props', props)\n    }\n  }\n  return style\n}\n"],
+  "mappings": "AAAA;AAGO,MAAM,UAA4D,CACvE,MAAM,MACN,EAAE,OAAO,OAAO,YACb;AANL;AAOE,QAAM,SAAS,iBAAiB,MAAM,UAAU,KAAK;AACrD,QAAM,OAAO,MAAM,WAAW,MAAM;AACpC,MAAI,CAAC,MAAM;AACT,YAAQ,KAAK,8BAAoB,EAAE,QAAQ,YAAY,OAAO,KAAK,KAAK,GAAG,IAAI,CAAC;AAChF,WAAO,CAAC;AAAA,EACV;AACA,QAAM,aAAa,KAAK;AACxB,QAAM,WAAW,MAAM,YAAY,KAAK,KAAK;AAC7C,QAAM,aAAa,MAAM,cAAc,KAAK,WAAW;AACvD,QAAM,aAAa,MAAM,cAAc,KAAK,OAAO;AACnD,QAAM,gBAAgB,MAAM,iBAAiB,KAAK,cAAc;AAChE,QAAM,YAAY,MAAM,aAAa,YAAK,UAAL,mBAAa;AAClD,QAAM,gBAAgB,MAAM,iBAAiB,YAAK,cAAL,mBAAiB;AAC9D,QAAM,QAAQ,MAAM,SAAS,YAAK,UAAL,mBAAa,SAAQ,MAAM;AACxD,QAAM,QAAQ;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACA,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,MAAM,UAAU;AAClB,cAAQ,IAAI,WAAW,KAAK,OAAO,cAAc,KAAK;AAAA,IACxD;AAAA,EACF;AACA,SAAO;AACT;",
+  "names": []
+}

package/dist/esm/helpers/getSize.js

@@ -1,13 +1,19 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 import { getTokens } from "../conf";
-const getSize = /* @__PURE__ */ __name((size, sizeUpOrDownBy = 0) => {
-  const sizes = getTokens().size;
-  const sizeNames = Object.keys(sizes);
-  const key = sizeNames[Math.max(0, sizeNames.indexOf(String(size || "$4")) + sizeUpOrDownBy)];
-  return sizes[key] || sizes["$4"];
-}, "getSize");
+const getSize = (size, shift = 0, bounds = [0]) => {
+  return stepTokenUpOrDown(getTokens().size, size, shift, bounds);
+};
+const stepTokenUpOrDown = (tokens, current, shift = 0, bounds = [0]) => {
+  const sizeNames = Object.keys(tokens);
+  const currentKeyNum = (typeof current === "string" ? current.replace("$", "") : current) || "4";
+  const nextKeyName = `$${+currentKeyNum + shift}`;
+  const min = bounds[0] ?? 0;
+  const max = bounds[1] ?? sizeNames.length - 1;
+  const index = Math.min(max, Math.max(min, sizeNames.indexOf(nextKeyName)));
+  const key = sizeNames[index];
+  return tokens[key] || tokens["$4"];
+};
 export {
-  getSize
+  getSize,
+  stepTokenUpOrDown
 };
 //# sourceMappingURL=getSize.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/helpers/getSize.ts"],
-  "sourcesContent": ["import { getTokens } from '../conf'\nimport { SizeTokens } from '../types'\n\nexport const getSize = (size?: SizeTokens | undefined, sizeUpOrDownBy = 0) => {\n  const sizes = getTokens().size as any as SizeTokens\n  const sizeNames = Object.keys(sizes)\n  const key = sizeNames[Math.max(0, sizeNames.indexOf(String(size || '$4')) + sizeUpOrDownBy)]\n  return (sizes[key] || sizes['$4']) as SizeTokens\n}\n"],
-  "mappings": ";;AAAA;AAGO,MAAM,UAAU,wBAAC,MAA+B,iBAAiB,MAAM;AAC5E,QAAM,QAAQ,UAAU,EAAE;AAC1B,QAAM,YAAY,OAAO,KAAK,KAAK;AACnC,QAAM,MAAM,UAAU,KAAK,IAAI,GAAG,UAAU,QAAQ,OAAO,QAAQ,IAAI,CAAC,IAAI,cAAc;AAC1F,SAAQ,MAAM,QAAQ,MAAM;AAC9B,GALuB;",
+  "sourcesContent": ["import { getTokens } from '../conf'\nimport { SizeTokens, SpaceTokens } from '../types'\n\nexport const getSize = (size?: SizeTokens | undefined, shift = 0, bounds = [0]) => {\n  return stepTokenUpOrDown(getTokens().size, size, shift, bounds)\n}\n\nexport const stepTokenUpOrDown = (\n  tokens: Object,\n  current?: SizeTokens | SpaceTokens | string,\n  shift = 0,\n  bounds = [0]\n) => {\n  const sizeNames = Object.keys(tokens)\n  const currentKeyNum = (typeof current === 'string' ? current.replace('$', '') : current) || '4'\n  const nextKeyName = `$${+currentKeyNum + shift}`\n  const min = bounds[0] ?? 0\n  const max = bounds[1] ?? sizeNames.length - 1\n  const index = Math.min(max, Math.max(min, sizeNames.indexOf(nextKeyName)))\n  const key = sizeNames[index]\n  return tokens[key] || tokens['$4']\n}\n"],
+  "mappings": "AAAA;AAGO,MAAM,UAAU,CAAC,MAA+B,QAAQ,GAAG,SAAS,CAAC,CAAC,MAAM;AACjF,SAAO,kBAAkB,UAAU,EAAE,MAAM,MAAM,OAAO,MAAM;AAChE;AAEO,MAAM,oBAAoB,CAC/B,QACA,SACA,QAAQ,GACR,SAAS,CAAC,CAAC,MACR;AACH,QAAM,YAAY,OAAO,KAAK,MAAM;AACpC,QAAM,gBAAiB,QAAO,YAAY,WAAW,QAAQ,QAAQ,KAAK,EAAE,IAAI,YAAY;AAC5F,QAAM,cAAc,IAAI,CAAC,gBAAgB;AACzC,QAAM,MAAM,OAAO,MAAM;AACzB,QAAM,MAAM,OAAO,MAAM,UAAU,SAAS;AAC5C,QAAM,QAAQ,KAAK,IAAI,KAAK,KAAK,IAAI,KAAK,UAAU,QAAQ,WAAW,CAAC,CAAC;AACzE,QAAM,MAAM,UAAU;AACtB,SAAO,OAAO,QAAQ,OAAO;AAC/B;",
   "names": []
 }