@tamagui/core 1.0.1-beta.48 → 1.0.1-beta.49

package/dist/jsx/createTheme.js

@@ -1,6 +1,8 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-const createTheme = /* @__PURE__ */ __name((theme) => theme, "createTheme");
+const createTheme = /* @__PURE__ */ __name((theme) => {
+  return theme;
+}, "createTheme");
 export {
   createTheme
 };

package/dist/jsx/createTokens.js

@@ -1,28 +1,14 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { createVariable } from "./createVariable";
+import { createVariables } from "./createVariables";
 import { validateTokens } from "./helpers/validate";
 function createTokens(tokens) {
   if (process.env.NODE_ENV === "development") {
     validateTokens(tokens);
   }
-  return mapTokensToVariables(tokens);
+  return createVariables(tokens);
 }
 __name(createTokens, "createTokens");
-const mapTokensToVariables = /* @__PURE__ */ __name((tokens, parentPath = "") => {
-  const res = {};
-  for (const key in tokens) {
-    let val = tokens[key];
-    const name = parentPath ? `${parentPath}-${key}` : key;
-    if (val && typeof val === "object") {
-      res[key] = mapTokensToVariables(tokens[key], name);
-    } else {
-      res[key] = createVariable({ val, name, key });
-    }
-  }
-  return res;
-}, "mapTokensToVariables");
 export {
-  createTokens,
-  mapTokensToVariables
+  createTokens
 };

package/dist/jsx/createVariable.js

@@ -4,12 +4,17 @@ var _a;
 import { isWeb } from "./constants/platform";
 const IS_VARIABLE_SYMBOL = "__isVariable__";
 class Variable {
-  constructor({ val, name, key }) {
+  constructor(props) {
     this[_a] = true;
+    this.isFloating = false;
+    const { val, name, key, isFloating } = props;
     this.val = isVariable(val) ? val.val : val;
     this.name = name;
     this.key = key;
-    this.variable = isWeb ? createCSSVariable(name) : this.val;
+    this.variable = isWeb ? createCSSVariable(name) : "";
+    if (isFloating) {
+      this.isFloating = true;
+    }
   }
   toString() {
     return `${isWeb ? this.variable : this.val}`;
@@ -17,9 +22,14 @@ class Variable {
 }
 __name(Variable, "Variable");
 _a = IS_VARIABLE_SYMBOL;
-const createVariable = /* @__PURE__ */ __name((props) => new Variable(props), "createVariable");
+const createVariable = /* @__PURE__ */ __name((props) => {
+  if (isVariable(props)) {
+    return props;
+  }
+  return new Variable(props);
+}, "createVariable");
 function isVariable(v) {
-  return v instanceof Variable || v && v[IS_VARIABLE_SYMBOL];
+  return !!(v instanceof Variable || v && v[IS_VARIABLE_SYMBOL]);
 }
 __name(isVariable, "isVariable");
 function getVariableValue(v) {
@@ -34,12 +44,17 @@ function getVariableName(v) {
   return v;
 }
 __name(getVariableName, "getVariableName");
-const createCSSVariable = /* @__PURE__ */ __name((val, includeVar = true) => {
-  const name = val.replace(/[^a-z0-9\_\-]+/i, "_");
+const createCSSVariable = /* @__PURE__ */ __name((nameProp, includeVar = true) => {
+  if (process.env.NODE_ENV === "development") {
+    if (!nameProp || typeof nameProp !== "string") {
+      console.warn("invalid name", nameProp);
+      return ``;
+    }
+  }
+  const name = nameProp.replace(/[^a-z0-9\_\-]+/i, "_");
   return includeVar ? `var(--${name})` : name;
 }, "createCSSVariable");
 export {
-  IS_VARIABLE_SYMBOL,
   Variable,
   createCSSVariable,
   createVariable,

package/dist/jsx/createVariables.js

@@ -0,0 +1,34 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import { createVariable, isVariable } from "./createVariable";
+const createVariables = /* @__PURE__ */ __name((tokens, parentPath = "") => {
+  const res = {};
+  for (const key in tokens) {
+    let val = tokens[key];
+    const name = parentPath ? `${parentPath}-${key}` : key;
+    if (isVariable(val)) {
+      res[key] = val;
+    } else if (val && typeof val === "object") {
+      if (Array.isArray(val)) {
+        res[key] = val.map((val2, i) => {
+          const skey = `${key}-${i}`;
+          const sname = parentPath ? `${name}-${skey}` : skey;
+          console.log("make it", val2, key, sname);
+          return isVariable(val2) ? val2 : createVariable({
+            val: val2,
+            key: skey,
+            name: sname
+          });
+        });
+      } else {
+        res[key] = createVariables(tokens[key], name);
+      }
+    } else {
+      res[key] = createVariable({ val, name, key });
+    }
+  }
+  return res;
+}, "createVariables");
+export {
+  createVariables
+};

package/dist/jsx/helpers/createPropMapper.js

@@ -6,30 +6,6 @@ import { isVariable } from "../createVariable";
 import { expandStyle, expandStyles } from "./generateAtomicStyles";
 import { getVariantExtras } from "./getVariantExtras";
 import { isObj } from "./isObj";
-function getVariantFunction(variant, key, value) {
-  if (typeof variant === "function") {
-    return variant;
-  }
-  for (const cat in tokenCategories) {
-    if (key in tokenCategories[cat]) {
-      const spreadVariant = variant[`...${cat}`];
-      if (spreadVariant) {
-        return spreadVariant;
-      }
-    }
-  }
-  let fn;
-  if (typeof value === "number") {
-    fn = variant[":number"];
-  } else if (typeof value === "string") {
-    fn = variant[":string"];
-  } else if (value === true || value === false) {
-    fn = variant[":boolean"];
-  }
-  fn = fn || variant[value];
-  return fn || variant["..."] || variant["...size"];
-}
-__name(getVariantFunction, "getVariantFunction");
 const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
   const variants = staticConfig.variants || {};
   const defaultProps = staticConfig.defaultProps || {};
@@ -40,26 +16,11 @@ const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
       return;
     }
     const props = state.fallbackProps || propsIn;
-    const returnVariablesAs = state.resolveVariablesAs || !!props.animation ? "value" : "auto";
+    const returnVariablesAs = state.resolveVariablesAs === "value" || !!props.animation ? "value" : "auto";
     const fontFamily = props.fontFamily || defaultProps.fontFamily || "$body";
-    const variant = variants && variants[key];
-    if (variant && value !== void 0) {
-      let variantValue = getVariantFunction(variant, key, value);
-      if (variantValue) {
-        if (typeof variantValue === "function") {
-          const fn = variantValue;
-          variantValue = fn(value, getVariantExtras(props, theme, defaultProps, avoidDefaultProps));
-        }
-        if (isObj(variantValue)) {
-          variantValue = resolveTokens(variantValue, conf, theme, fontFamily, returnVariablesAs);
-        }
-        return Object.entries(expandStyles(variantValue));
-      } else {
-        if (process.env.NODE_ENV === "development") {
-          console.warn(`No variant found: ${staticConfig.componentName || "[UnnamedComponent]"} has variant "${key}", but no matching value "${value}"`);
-        }
-        return null;
-      }
+    const variantValue = resolveVariants(key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, "", avoidDefaultProps);
+    if (variantValue) {
+      return variantValue;
     }
     let shouldReturn = value !== void 0 && value !== null;
     if (conf.shorthands[key]) {
@@ -79,22 +40,56 @@ const createPropMapper = /* @__PURE__ */ __name((staticConfig) => {
   }, "mapper");
   return mapper;
 }, "createPropMapper");
-const resolveTokens = /* @__PURE__ */ __name((input, conf, theme, fontFamily, resolveAs) => {
+const resolveVariants = /* @__PURE__ */ __name((key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps = false) => {
+  var _a;
+  const variant = variants && variants[key];
+  if (variant && value !== void 0) {
+    let variantValue = getVariantDefinition(variant, key, value);
+    if (variantValue) {
+      if (typeof variantValue === "function") {
+        const fn = variantValue;
+        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);
+      }
+      return Object.entries(expandStyles(variantValue));
+    } else {
+      if (process.env.NODE_ENV === "development") {
+        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}"`);
+      }
+      return null;
+    }
+  }
+}, "resolveVariants");
+const resolveTokensAndVariants = /* @__PURE__ */ __name((key, value, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, parentVariantKey, avoidDefaultProps) => {
   var _a;
   let res = {};
-  for (const rKey in input) {
+  for (const rKey in value) {
     const fKey = conf.shorthands[rKey] || rKey;
-    const val = input[rKey];
+    const val = value[rKey];
     if (isVariable(val)) {
-      res[fKey] = resolveAs === "variable" ? val : !isWeb || resolveAs === "value" ? val.val : val.variable;
+      res[fKey] = !isWeb || returnVariablesAs === "value" ? val.val : val.variable;
+    } else if (variants[fKey]) {
+      if (parentVariantKey === key) {
+        res[fKey] = val;
+      } else {
+        res = {
+          ...res,
+          ...Object.fromEntries(resolveVariants(fKey, val, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, key, avoidDefaultProps))
+        };
+      }
     } else if (typeof val === "string") {
-      const fVal = val[0] === "$" ? getToken(fKey, val, conf, theme, fontFamily, resolveAs) : val;
+      const fVal = val[0] === "$" ? getToken(fKey, val, conf, theme, fontFamily, returnVariablesAs) : val;
       res[fKey] = fVal;
     } else {
       if (isObj(val)) {
-        res[fKey] = resolveTokens(val, conf, theme, fontFamily, resolveAs);
+        res[fKey] = resolveTokensAndVariants(fKey, val, props, defaultProps, theme, variants, fontFamily, conf, returnVariablesAs, staticConfig, key, avoidDefaultProps);
       } else {
-        res[fKey] = input[fKey];
+        res[fKey] = value[fKey];
       }
     }
     if (process.env.NODE_ENV === "development") {
@@ -104,7 +99,31 @@ const resolveTokens = /* @__PURE__ */ __name((input, conf, theme, fontFamily, re
     }
   }
   return res;
-}, "resolveTokens");
+}, "resolveTokensAndVariants");
+function getVariantDefinition(variant, key, value) {
+  if (typeof variant === "function") {
+    return variant;
+  }
+  for (const cat in tokenCategories) {
+    if (key in tokenCategories[cat]) {
+      const spreadVariant = variant[`...${cat}`];
+      if (spreadVariant) {
+        return spreadVariant;
+      }
+    }
+  }
+  let fn;
+  if (typeof value === "number") {
+    fn = variant[":number"];
+  } else if (typeof value === "string") {
+    fn = variant[":string"];
+  } else if (value === true || value === false) {
+    fn = variant[":boolean"];
+  }
+  fn = fn || variant[value];
+  return fn || variant["..."] || variant["...size"];
+}
+__name(getVariantDefinition, "getVariantDefinition");
 const fontShorthand = {
   fontSize: "size",
   fontWeight: "weight"

package/dist/jsx/helpers/generateAtomicStyles.js

@@ -40,9 +40,16 @@ 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) {
@@ -95,41 +102,39 @@ function expandStyle(key, value) {
     }
     return;
   }
-  if (isWeb) {
-    switch (key) {
-      case "elevation":
-      case "overlayColor":
-      case "resizeMode":
-      case "tintColor": {
-        break;
-      }
-      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 "transform": {
-        if (Array.isArray(value)) {
-          return [[key, value.map(mapTransform).join(" ")]];
-        }
-        break;
+  switch (key) {
+    case "elevation":
+    case "overlayColor":
+    case "resizeMode":
+    case "tintColor": {
+      break;
+    }
+    case "aspectRatio": {
+      return [[key, value.toString()]];
+    }
+    case "backgroundClip": {
+      if (value === "text") {
+        return [
+          ["backgroundClip", value],
+          ["WebkitBackgroundClip", value]
+        ];
       }
-      case "writingDirection": {
-        return [["direction", value]];
+      break;
+    }
+    case "textAlignVertical": {
+      return [["verticalAlign", value === "center" ? "middle" : value]];
+    }
+    case "textDecorationLine": {
+      return [["textDecorationLine", value]];
+    }
+    case "transform": {
+      if (Array.isArray(value)) {
+        return [[key, value.map(mapTransform).join(" ")]];
       }
+      break;
+    }
+    case "writingDirection": {
+      return [["direction", value]];
     }
   }
   const longKey = STYLE_SHORT_FORM_EXPANSIONS[key];
@@ -288,8 +293,8 @@ const colorProps = {
   textShadowColor: true
 };
 function normalizeValueWithProperty(value, property) {
-  if (isWeb) {
-    if ((property == null || !unitlessNumbers[property]) && typeof value === "number") {
+  if (process.env.TAMAGUI_TARGET === "web") {
+    if ((property === void 0 || property === null || !unitlessNumbers[property]) && typeof value === "number") {
       return `${value}px`;
     }
   }
@@ -303,7 +308,7 @@ const normalizeColor = /* @__PURE__ */ __name((color, opacity = 1) => {
   if (color == null || color == void 0) {
     return;
   }
-  if (isWeb) {
+  if (process.env.TAMAGUI_TARGET === "web") {
     if (typeof color === "string" && isWebColor(color)) {
       return color;
     }

package/dist/jsx/helpers/getSplitStyles.js

@@ -7,7 +7,7 @@ import { isClient, isWeb, useIsomorphicLayoutEffect } from "../constants/platfor
 import { mediaQueryConfig, mediaState } from "../hooks/useMedia";
 import { createMediaStyle } from "./createMediaStyle";
 import { fixNativeShadow } from "./fixNativeShadow";
-import { getStylesAtomic } from "./getStylesAtomic";
+import { getStylesAtomic, psuedoCNInverse } from "./getStylesAtomic";
 import {
   insertStyleRule,
   insertedTransforms,
@@ -114,12 +114,43 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
       for (const key in valInit) {
         if (usedKeys.has(key))
           continue;
-        style[key] = valInit;
+        if (valInit && typeof valInit === "object") {
+          for (const skey in valInit) {
+            if (usedKeys.has(skey))
+              continue;
+            usedKeys.add(skey);
+            style[skey] = valInit[skey];
+          }
+        } else {
+          usedKeys.add(key);
+          style[key] = valInit;
+        }
       }
       continue;
     }
     if (keyInit === "className") {
-      mergeClassName(keyInit, valInit);
+      let nonTamaguis = "";
+      for (const cn of valInit.split(" ")) {
+        if (cn[0] === "_") {
+          const [shorthand, mediaOrPsuedo, rest] = cn.slice(1).split("-");
+          let fullKey = conf.shorthands[shorthand];
+          if (mediaOrPsuedo[0] === "_") {
+            let mediaShortKey = mediaOrPsuedo.slice(1);
+            mediaShortKey = mediaShortKey.slice(0, mediaShortKey.indexOf("_"));
+            fullKey += `-${mediaShortKey}`;
+          } else if (mediaOrPsuedo[0] === "0") {
+            const pseudoShortKey = mediaOrPsuedo.slice(1);
+            fullKey += `-${psuedoCNInverse[pseudoShortKey]}`;
+          }
+          usedKeys.add(fullKey);
+          mergeClassName(fullKey, cn);
+        } else {
+          nonTamaguis += " " + cn;
+        }
+      }
+      if (nonTamaguis) {
+        mergeClassName(keyInit, nonTamaguis);
+      }
       continue;
     }
     if (validStyleProps[keyInit] && valInit && valInit[0] === "_") {
@@ -196,7 +227,7 @@ const getSplitStyles = /* @__PURE__ */ __name((props, staticConfig, theme, state
           const mediaStyles = getStylesAtomic(mediaStyle);
           for (const style2 of mediaStyles) {
             const out = createMediaStyle(style2, mediaKeyShort, mediaQueryConfig);
-            const fullKey = `${out.identifier}-${mediaKey}`;
+            const fullKey = `${style2.property}-${mediaKeyShort}`;
             if (!usedKeys.has(fullKey)) {
               usedKeys.add(fullKey);
               addStyle(out.identifier, out.styleRule);
@@ -291,7 +322,7 @@ const insertSplitStyles = /* @__PURE__ */ __name((...args) => {
   }
   return res;
 }, "insertSplitStyles");
-const effect = useInsertionEffect || useIsomorphicLayoutEffect;
+const effect = isWeb ? useInsertionEffect || useIsomorphicLayoutEffect : useIsomorphicLayoutEffect;
 const useSplitStyles = /* @__PURE__ */ __name((...args) => {
   const res = getSplitStyles(...args);
   effect(() => {

package/dist/jsx/helpers/getStackSize.js

@@ -1,6 +1,6 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { getVariableValue, isVariable } from "@tamagui/core";
+import { getVariableValue, isVariable } from "../createVariable";
 const getSizeScaledToFont = /* @__PURE__ */ __name((val, { sizeX = 1, sizeY = 1 }, { tokens, props, fonts }) => {
   var _a, _b, _c, _d, _e, _f;
   const size = (_c = (_b = (_a = tokens.size[val]) != null ? _a : val) != null ? _b : tokens.size["$4"]) != null ? _c : 14;

package/dist/jsx/helpers/getStylesAtomic.js

@@ -20,6 +20,11 @@ const pseudos = {
   }
 };
 const pseudosOrdered = Object.values(pseudos);
+const psuedoCNInverse = {
+  hover: "hoverStyle",
+  focus: "focusStyle",
+  press: "pressStyle"
+};
 function getStylesAtomic(stylesIn, options = {}) {
   const { hoverStyle, pressStyle, focusStyle, ...base } = stylesIn;
   let res = [];
@@ -113,5 +118,6 @@ const borderDefaults = {
 };
 export {
   getStylesAtomic,
-  pseudos
+  pseudos,
+  psuedoCNInverse
 };

package/dist/jsx/helpers/insertStyleRule.js

@@ -28,6 +28,8 @@ __name(addTransform, "addTransform");
 const isClient = typeof document !== "undefined";
 let hasInsertedSinceUpdate = true;
 function updateInserted() {
+  if (process.env.NODE_ENV === "test")
+    return;
   if (!isClient)
     return;
   if (!hasInsertedSinceUpdate) {

package/dist/jsx/helpers/validate.js

@@ -43,7 +43,7 @@ if (process.env.NODE_ENV === "development") {
   const fontOpt = {
     style: ow.optional.object.valuesOfType(ow.string),
     transform: ow.optional.object.valuesOfType(ow.string),
-    color: ow.optional.object.valuesOfType(ow.string)
+    color: ow.optional.object.valuesOfType(ow.any(ow.string, ow.object))
   };
   Config = ow.object.exactShape({
     defaultTheme: ow.optional.string,
@@ -65,7 +65,7 @@ if (process.env.NODE_ENV === "development") {
     space: ow.object.nonEmpty.valuesOfType(ow.number),
     zIndex: ow.object.nonEmpty.valuesOfType(ow.number),
     radius: ow.object.nonEmpty.valuesOfType(ow.number),
-    color: ow.object.nonEmpty.valuesOfType(ow.string)
+    color: ow.object.nonEmpty.valuesOfType(ow.any(ow.string, ow.object))
   });
 }
 export {

package/dist/jsx/hooks/useIsMounted.js

@@ -1,7 +1,7 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-import { useIsomorphicLayoutEffect } from "@tamagui/core";
 import { useRef } from "react";
+import { useIsomorphicLayoutEffect } from "../constants/platform";
 function useIsMounted() {
   const isMounted = useRef(false);
   useIsomorphicLayoutEffect(() => {

package/dist/jsx/index.js

@@ -4,8 +4,9 @@ export * from "./createShorthands";
 export * from "./createTheme";
 export * from "./createTamagui";
 export * from "./createFont";
-import { createTokens } from "./createTokens";
+export * from "./createTokens";
 export * from "./createVariable";
+export * from "./createVariables";
 export * from "./styled";
 export * from "./types";
 import { RNWTextProps, RNWViewProps } from "./types-rnw";
@@ -48,7 +49,6 @@ export * from "@tamagui/helpers";
 export {
   RNWTextProps,
   RNWViewProps,
-  createTokens,
   getConfig,
   getHasConfigured,
   getThemes,

package/dist/jsx/styled.js

@@ -4,6 +4,11 @@ import { Image, Text, TextInput } from "react-native";
 import { createComponent } from "./createComponent";
 import { RNComponents } from "./helpers/RNComponents";
 function styled(Component, options, staticExtractionOptions) {
+  if (process.env.NODE_ENV === "development") {
+    if (Component["staticConfig"] && Component["staticConfig"].isExtractable) {
+      console.warn(`Warning: Wrapping styled() around an extractable HOC component isn't allowed yet. Support for this is on the roadmap, see: https://github.com/tamagui/tamagui/issues/88.`);
+    }
+  }
   const staticConfigProps = (() => {
     var _a;
     if (options) {

package/dist/jsx/views/Theme.js

@@ -8,13 +8,14 @@ React["createElement"];
 const Theme = memo(/* @__PURE__ */ __name(function Theme2(props) {
   var _a, _b;
   const { name, theme, themeManager, themes, className } = useChangeThemeEffect(props.name, props.componentName, props);
-  if (!themes || !name || !theme) {
+  const missingTheme = !themes || !name || !theme;
+  const contents = useMemo(() => missingTheme ? null : wrapThemeManagerContext(props.children, themeManager), [props.children, themeManager]);
+  if (missingTheme) {
     if (name && !theme && process.env.NODE_ENV === "development") {
       console.warn(`No theme found by name ${name}`);
     }
     return props.children;
   }
-  const contents = useMemo(() => wrapThemeManagerContext(props.children, themeManager), [props.children, themeManager]);
   if (isWeb) {
     return <span className={[
       `tui_Theme`,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/core",
-  "version": "1.0.1-beta.48",
+  "version": "1.0.1-beta.49",
   "source": "src/index.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -21,10 +21,10 @@
   ],
   "dependencies": {
     "@expo/match-media": "^0.3.0",
-    "@tamagui/helpers": "^1.0.1-beta.48",
+    "@tamagui/helpers": "^1.0.1-beta.49",
     "@tamagui/ow": "^0.28.1",
-    "@tamagui/use-debounce": "^1.0.1-beta.48",
-    "@tamagui/use-force-update": "^1.0.1-beta.48",
+    "@tamagui/use-debounce": "^1.0.1-beta.49",
+    "@tamagui/use-force-update": "^1.0.1-beta.49",
     "expo-screen-orientation": "^4.2.0",
     "hyphenate-style-name": "^1.0.4",
     "inline-style-prefixer": "^6.0.0",
@@ -36,7 +36,7 @@
     "react-native-web": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.48",
+    "@tamagui/build": "^1.0.1-beta.49",
     "@types/react": "^17.0.35",
     "csstype": "^3.0.10",
     "esbuild": "^0.14.36",

package/types/ThemeManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeManager.d.ts","sourceRoot":"","sources":["../src/ThemeManager.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAE7C,aAAK,aAAa,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,YAAY,EAAE,YAAY,KAAK,IAAI,CAAA;AAE9E,oBAAY,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IACnC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,KAAK,CAAC,EAAE,GAAG,CAAA;CACZ,CAAA;AAED,oBAAY,iBAAiB,GAAG;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,qBAAa,YAAY;;IAOd,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,WAAW,GAAG,IAAI;IACzB,aAAa,EAAE,YAAY,GAAG,IAAI;IAClC,KAAK,EAAE,OAAO;IATvB,IAAI,wBAA8B;IAClC,SAAS,qBAA2B;IACpC,cAAc,qBAA2B;IACzC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAO;gBAGtB,IAAI,GAAE,MAAW,EACjB,KAAK,GAAE,WAAW,GAAG,IAAW,EAChC,aAAa,GAAE,YAAY,GAAG,IAAW,EACzC,KAAK,GAAE,OAAe;IAqB/B,IAAI,UAAU,kBAEb;IAED,IAAI,QAAQ,IAAI,MAAM,CAMrB;IAGD,QAAQ,CAAC,GAAG,EAAE,MAAM;IAmBpB,MAAM,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAE,mBAAwB;IAa3D,YAAY,CAAC,KAAK,GAAE,iBAAsB,EAAE,KAAK,CAAC,EAAE,GAAG;;;;;;;;;;;;;IAsFvD,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC;IAKlC,eAAe;IAYf,aAAa,CAAC,EAAE,EAAE,aAAa;IAO/B,QAAQ,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,EAAE,QAAQ;CAOjC;AAED,eAAO,MAAM,mBAAmB,8CAA2C,CAAA;AAC3E,eAAO,MAAM,YAAY,cAAqB,CAAA"}
+{"version":3,"file":"ThemeManager.d.ts","sourceRoot":"","sources":["../src/ThemeManager.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAE7C,aAAK,aAAa,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,YAAY,EAAE,YAAY,KAAK,IAAI,CAAA;AAE9E,oBAAY,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,YAAY,GAAG,IAAI,CAAA;IACnC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,KAAK,CAAC,EAAE,GAAG,CAAA;CACZ,CAAA;AAED,oBAAY,iBAAiB,GAAG;IAC9B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,qBAAa,YAAY;;IAOd,IAAI,EAAE,MAAM;IACZ,KAAK,EAAE,WAAW,GAAG,IAAI;IACzB,aAAa,EAAE,YAAY,GAAG,IAAI;IAClC,KAAK,EAAE,OAAO;IATvB,IAAI,wBAA8B;IAClC,SAAS,qBAA2B;IACpC,cAAc,qBAA2B;IACzC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAO;gBAGtB,IAAI,GAAE,MAAW,EACjB,KAAK,GAAE,WAAW,GAAG,IAAW,EAChC,aAAa,GAAE,YAAY,GAAG,IAAW,EACzC,KAAK,GAAE,OAAe;IAqB/B,IAAI,UAAU,kBAEb;IAED,IAAI,QAAQ,IAAI,MAAM,CAMrB;IAGD,QAAQ,CAAC,GAAG,EAAE,MAAM;IAmBpB,MAAM,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAE,mBAAwB;IAa3D,YAAY,CAAC,KAAK,GAAE,iBAAsB,EAAE,KAAK,CAAC,EAAE,GAAG;;;;;;;;;;;;;IAwFvD,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,CAAC,MAAM,CAAC;IAKlC,eAAe;IAYf,aAAa,CAAC,EAAE,EAAE,aAAa;IAO/B,QAAQ,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,EAAE,QAAQ;CAOjC;AAED,eAAO,MAAM,mBAAmB,8CAA2C,CAAA;AAC3E,eAAO,MAAM,YAAY,cAAqB,CAAA"}

package/types/conf.d.ts

@@ -16,7 +16,7 @@ export declare const getConfig: () => TamaguiInternalConfig<import("./types").Cr
 }, {
     [key: string]: import("./types").GenericFont<string | number>;
 }>;
-export declare const getTokens: () => import("./types").CreateTokens<import("./createVariable").Variable>;
+export declare const getTokens: () => import("./types").CreateTokens<import("./createVariable").Variable<any>>;
 export declare const getThemes: () => {
     [key: string]: Partial<import("./types").TamaguiBaseTheme> & {
         [key: string]: import("./types").VariableVal;

package/types/conf.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"conf.d.ts","sourceRoot":"","sources":["../src/conf.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAI/D,eAAO,MAAM,SAAS,SAAU,qBAAqB,SAMpD,CAAA;AAED,eAAO,MAAM,gBAAgB,eAAe,CAAA;AAC5C,eAAO,MAAM,SAAS;;;;;;;;;;;;;;EAAc,CAAA;AACpC,eAAO,MAAM,SAAS,2EAA2B,CAAA;AACjD,eAAO,MAAM,SAAS;;;;CAAqB,CAAA;AAE3C,eAAO,MAAM,eAAe,qBAA4B,CAAA;AAExD,eAAO,MAAM,gBAAgB,OAAQ,cAAc,SAUlD,CAAA"}
+{"version":3,"file":"conf.d.ts","sourceRoot":"","sources":["../src/conf.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAI/D,eAAO,MAAM,SAAS,SAAU,qBAAqB,SAMpD,CAAA;AAED,eAAO,MAAM,gBAAgB,eAAe,CAAA;AAC5C,eAAO,MAAM,SAAS;;;;;;;;;;;;;;EAAc,CAAA;AACpC,eAAO,MAAM,SAAS,gFAA2B,CAAA;AACjD,eAAO,MAAM,SAAS;;;;CAAqB,CAAA;AAE3C,eAAO,MAAM,eAAe,qBAA4B,CAAA;AAExD,eAAO,MAAM,gBAAgB,OAAQ,cAAc,SAMlD,CAAA"}

package/types/createComponent.d.ts

@@ -25,5 +25,6 @@ export declare type SpacedChildrenProps = {
 };
 export declare function spacedChildren({ isZStack, children, space, direction, spaceFlex, separator, }: SpacedChildrenProps): any;
 export declare function AbsoluteFill(props: any): JSX.Element;
+export declare function assignNativePropsToWeb(elementType: string, viewProps: any, nativeProps: any): void;
 export {};
 //# sourceMappingURL=createComponent.d.ts.map