@tamagui/core 1.0.1-beta.151 → 1.0.1-beta.154

package/dist/esm/views/TamaguiProvider.js

@@ -1,3 +1,4 @@
+import { jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { isClient, isRSC, isSSR } from "../constants/platform";
 import { ButtonInsideButtonContext } from "../contexts/ButtonInsideButtonContext";
@@ -11,10 +12,11 @@ function TamaguiProvider({
   ...themePropsProvider
 }) {
   if (isRSC) {
-    return /* @__PURE__ */ React.createElement("span", {
+    return /* @__PURE__ */ jsx("span", {
       style: { display: "contents" },
-      className: `t_${config.defaultTheme || "light"}`
-    }, children);
+      className: `t_${config.defaultTheme || "light"}`,
+      children
+    });
   }
   if (!isSSR) {
     useMediaQueryListeners();
@@ -31,14 +33,18 @@ function TamaguiProvider({
       };
     }, [config, disableInjectCSS]);
   }
-  return /* @__PURE__ */ React.createElement(ButtonInsideButtonContext.Provider, {
-    value: false
-  }, /* @__PURE__ */ React.createElement(TextAncestorProvider, null, /* @__PURE__ */ React.createElement(ThemeProvider, {
-    defaultTheme: config.defaultTheme || "light",
-    themeClassNameOnRoot: config.themeClassNameOnRoot,
-    disableRootThemeClass: config.disableRootThemeClass,
-    ...themePropsProvider
-  }, children)));
+  return /* @__PURE__ */ jsx(ButtonInsideButtonContext.Provider, {
+    value: false,
+    children: /* @__PURE__ */ jsx(TextAncestorProvider, {
+      children: /* @__PURE__ */ jsx(ThemeProvider, {
+        defaultTheme: config.defaultTheme || "light",
+        themeClassNameOnRoot: config.themeClassNameOnRoot,
+        disableRootThemeClass: config.disableRootThemeClass,
+        ...themePropsProvider,
+        children
+      })
+    })
+  });
 }
 export {
   TamaguiProvider

package/dist/esm/views/TamaguiProvider.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/views/TamaguiProvider.tsx"],
   "sourcesContent": ["import { useForceUpdate } from '@tamagui/use-force-update'\nimport * as React from 'react'\n\nimport { isClient, isRSC, isSSR } from '../constants/platform'\nimport { ButtonInsideButtonContext } from '../contexts/ButtonInsideButtonContext'\nimport { TextAncestorProvider } from '../contexts/TextAncestorContext'\nimport { useMediaQueryListeners } from '../hooks/useMedia'\nimport type { TamaguiProviderProps } from '../types'\nimport { ThemeProvider } from './ThemeProvider'\n\nexport function TamaguiProvider({\n  children,\n  disableInjectCSS,\n  config,\n  ...themePropsProvider\n}: TamaguiProviderProps) {\n  if (isRSC) {\n    return (\n      <span style={{ display: 'contents' }} className={`t_${config.defaultTheme || 'light'}`}>\n        {children}\n      </span>\n    )\n  }\n\n  if (!isSSR) {\n    useMediaQueryListeners()\n  }\n\n  if (isClient) {\n    // inject CSS if asked to (not SSR compliant)\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useLayoutEffect(() => {\n      if (disableInjectCSS) return\n      const style = document.createElement('style')\n      style.appendChild(document.createTextNode(config.getCSS()))\n      document.head.appendChild(style)\n      return () => {\n        document.head.removeChild(style)\n      }\n    }, [config, disableInjectCSS])\n  }\n\n  return (\n    <ButtonInsideButtonContext.Provider value={false}>\n      <TextAncestorProvider>\n        <ThemeProvider\n          defaultTheme={config.defaultTheme || 'light'}\n          themeClassNameOnRoot={config.themeClassNameOnRoot}\n          disableRootThemeClass={config.disableRootThemeClass}\n          {...themePropsProvider}\n        >\n          {children}\n        </ThemeProvider>\n      </TextAncestorProvider>\n    </ButtonInsideButtonContext.Provider>\n  )\n}\n"],
-  "mappings": "AACA;AAEA;AACA;AACA;AACA;AAEA;AAEO,yBAAyB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,GACoB;AACvB,MAAI,OAAO;AACT,WACE,oCAAC;AAAA,MAAK,OAAO,EAAE,SAAS,WAAW;AAAA,MAAG,WAAW,KAAK,OAAO,gBAAgB;AAAA,OAC1E,QACH;AAAA,EAEJ;AAEA,MAAI,CAAC,OAAO;AACV,2BAAuB;AAAA,EACzB;AAEA,MAAI,UAAU;AAGZ,UAAM,gBAAgB,MAAM;AAC1B,UAAI;AAAkB;AACtB,YAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,YAAM,YAAY,SAAS,eAAe,OAAO,OAAO,CAAC,CAAC;AAC1D,eAAS,KAAK,YAAY,KAAK;AAC/B,aAAO,MAAM;AACX,iBAAS,KAAK,YAAY,KAAK;AAAA,MACjC;AAAA,IACF,GAAG,CAAC,QAAQ,gBAAgB,CAAC;AAAA,EAC/B;AAEA,SACE,oCAAC,0BAA0B,UAA1B;AAAA,IAAmC,OAAO;AAAA,KACzC,oCAAC,4BACC,oCAAC;AAAA,IACC,cAAc,OAAO,gBAAgB;AAAA,IACrC,sBAAsB,OAAO;AAAA,IAC7B,uBAAuB,OAAO;AAAA,IAC7B,GAAG;AAAA,KAEH,QACH,CACF,CACF;AAEJ;",
+  "mappings": "AAkBM;AAjBN,YAAY,WAAW;AAEvB,SAAS,UAAU,OAAO,aAAa;AACvC,SAAS,iCAAiC;AAC1C,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AAEvC,SAAS,qBAAqB;AAEvB,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,KACG;AACL,GAAyB;AACvB,MAAI,OAAO;AACT,WACE,oBAAC;AAAA,MAAK,OAAO,EAAE,SAAS,WAAW;AAAA,MAAG,WAAW,KAAK,OAAO,gBAAgB;AAAA,MAC1E;AAAA,KACH;AAAA,EAEJ;AAEA,MAAI,CAAC,OAAO;AACV,2BAAuB;AAAA,EACzB;AAEA,MAAI,UAAU;AAGZ,UAAM,gBAAgB,MAAM;AAC1B,UAAI;AAAkB;AACtB,YAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,YAAM,YAAY,SAAS,eAAe,OAAO,OAAO,CAAC,CAAC;AAC1D,eAAS,KAAK,YAAY,KAAK;AAC/B,aAAO,MAAM;AACX,iBAAS,KAAK,YAAY,KAAK;AAAA,MACjC;AAAA,IACF,GAAG,CAAC,QAAQ,gBAAgB,CAAC;AAAA,EAC/B;AAEA,SACE,oBAAC,0BAA0B,UAA1B;AAAA,IAAmC,OAAO;AAAA,IACzC,8BAAC;AAAA,MACC,8BAAC;AAAA,QACC,cAAc,OAAO,gBAAgB;AAAA,QACrC,sBAAsB,OAAO;AAAA,QAC7B,uBAAuB,OAAO;AAAA,QAC7B,GAAG;AAAA,QAEH;AAAA,OACH;AAAA,KACF;AAAA,GACF;AAEJ;",
   "names": []
 }

package/dist/esm/views/Text.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/views/Text.tsx"],
   "sourcesContent": ["import { stylePropsTextOnly, validStyles } from '@tamagui/helpers'\nimport { Text as TextView } from 'react-native'\n\nimport { isWeb } from '../constants/platform'\nimport { createComponent } from '../createComponent'\nimport { TextProps, TextPropsBase } from '../types'\n\nconst ellipseStyle = {\n  maxWidth: '100%',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n}\n\nexport const Text = createComponent<TextProps, TextView, TextPropsBase>({\n  componentName: 'Text',\n  isText: true,\n\n  defaultProps: {\n    display: 'flex',\n    fontFamily: 'System',\n    ...(isWeb && {\n      display: 'inline',\n      boxSizing: 'border-box',\n      wordWrap: 'break-word',\n    }),\n  },\n\n  variants: {\n    ...(isWeb && {\n      numberOfLines: {\n        1: ellipseStyle,\n\n        ':number': (numberOfLines) =>\n          numberOfLines >= 1\n            ? {\n                WebkitLineClamp: numberOfLines,\n                WebkitBoxOrient: 'vertical',\n                display: '-webkit-box',\n                overflow: 'hidden',\n              }\n            : null,\n      },\n    }),\n\n    selectable: {\n      true: {\n        userSelect: 'text',\n        cursor: 'text',\n      },\n      false: {\n        userSelect: 'none',\n        cursor: 'inherit',\n      },\n    },\n\n    pressable: {\n      true: {\n        cursor: 'pointer',\n      },\n    },\n\n    ellipse: {\n      true: isWeb\n        ? ellipseStyle\n        : {\n            numberOfLines: 1,\n            lineBreakMode: 'clip',\n          },\n    },\n  },\n\n  deoptProps: new Set(isWeb ? [] : ['ellipse']),\n\n  validStyles: {\n    ...validStyles,\n    ...stylePropsTextOnly,\n  },\n})\n"],
-  "mappings": "AAAA;AAGA;AACA;AAGA,MAAM,eAAe;AAAA,EACnB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AACd;AAEO,MAAM,OAAO,gBAAoD;AAAA,EACtE,eAAe;AAAA,EACf,QAAQ;AAAA,EAER,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAI,SAAS;AAAA,MACX,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,GAAI,SAAS;AAAA,MACX,eAAe;AAAA,QACb,GAAG;AAAA,QAEH,WAAW,CAAC,kBACV,iBAAiB,IACb;AAAA,UACE,iBAAiB;AAAA,UACjB,iBAAiB;AAAA,UACjB,SAAS;AAAA,UACT,UAAU;AAAA,QACZ,IACA;AAAA,MACR;AAAA,IACF;AAAA,IAEA,YAAY;AAAA,MACV,MAAM;AAAA,QACJ,YAAY;AAAA,QACZ,QAAQ;AAAA,MACV;AAAA,MACA,OAAO;AAAA,QACL,YAAY;AAAA,QACZ,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IAEA,WAAW;AAAA,MACT,MAAM;AAAA,QACJ,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IAEA,SAAS;AAAA,MACP,MAAM,QACF,eACA;AAAA,QACE,eAAe;AAAA,QACf,eAAe;AAAA,MACjB;AAAA,IACN;AAAA,EACF;AAAA,EAEA,YAAY,IAAI,IAAI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC;AAAA,EAE5C,aAAa;AAAA,IACX,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AACF,CAAC;",
+  "mappings": "AAAA,SAAS,oBAAoB,mBAAmB;AAGhD,SAAS,aAAa;AACtB,SAAS,uBAAuB;AAGhC,MAAM,eAAe;AAAA,EACnB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AACd;AAEO,MAAM,OAAO,gBAAoD;AAAA,EACtE,eAAe;AAAA,EACf,QAAQ;AAAA,EAER,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAI,SAAS;AAAA,MACX,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA,IACZ;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,GAAI,SAAS;AAAA,MACX,eAAe;AAAA,QACb,GAAG;AAAA,QAEH,WAAW,CAAC,kBACV,iBAAiB,IACb;AAAA,UACE,iBAAiB;AAAA,UACjB,iBAAiB;AAAA,UACjB,SAAS;AAAA,UACT,UAAU;AAAA,QACZ,IACA;AAAA,MACR;AAAA,IACF;AAAA,IAEA,YAAY;AAAA,MACV,MAAM;AAAA,QACJ,YAAY;AAAA,QACZ,QAAQ;AAAA,MACV;AAAA,MACA,OAAO;AAAA,QACL,YAAY;AAAA,QACZ,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IAEA,WAAW;AAAA,MACT,MAAM;AAAA,QACJ,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IAEA,SAAS;AAAA,MACP,MAAM,QACF,eACA;AAAA,QACE,eAAe;AAAA,QACf,eAAe;AAAA,MACjB;AAAA,IACN;AAAA,EACF;AAAA,EAEA,YAAY,IAAI,IAAI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC;AAAA,EAE5C,aAAa;AAAA,IACX,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AACF,CAAC;",
   "names": []
 }

package/dist/esm/views/Theme.js

@@ -1,3 +1,4 @@
+import { jsx } from "react/jsx-runtime";
 import React, { memo, useMemo } from "react";
 import { isWeb } from "../constants/platform";
 import { variableToString } from "../createVariable";
@@ -6,9 +7,16 @@ import { useChangeThemeEffect } from "../hooks/useTheme";
 React["createElement"];
 const Theme = memo(function Theme2(props) {
   var _a;
-  const { name, theme, themeManager, themes, className } = useChangeThemeEffect(props.name, props.componentName, props);
+  const { name, theme, themeManager, themes, className } = useChangeThemeEffect(
+    props.name,
+    props.componentName,
+    props
+  );
   const missingTheme = !themes || !name || !theme;
-  const contents = useMemo(() => missingTheme ? null : wrapThemeManagerContext(props.children, themeManager), [missingTheme, props.children, themeManager]);
+  const contents = useMemo(
+    () => missingTheme ? null : wrapThemeManagerContext(props.children, themeManager),
+    [missingTheme, props.children, themeManager]
+  );
   if (missingTheme) {
     if (name && !theme && process.env.NODE_ENV === "development") {
       console.warn(`No theme found by name ${name}`);
@@ -16,22 +24,25 @@ const Theme = memo(function Theme2(props) {
     return props.children;
   }
   if (isWeb) {
-    return /* @__PURE__ */ React.createElement("span", {
+    return /* @__PURE__ */ jsx("span", {
       className: (!props.disableThemeClass ? [props.className, className].filter(Boolean) : []).join(" "),
       style: {
         display: "contents",
         color: variableToString((_a = themes[name]) == null ? void 0 : _a.color)
-      }
-    }, contents);
+      },
+      children: contents
+    });
   }
   return contents;
 });
 function wrapThemeManagerContext(children, themeManager, shouldSetChildrenThemeToParent) {
-  return themeManager ? /* @__PURE__ */ React.createElement(ThemeManagerContext.Provider, {
-    value: themeManager
-  }, shouldSetChildrenThemeToParent ? /* @__PURE__ */ React.createElement(Theme, {
-    name: themeManager.parentName
-  }, children) : children) : children;
+  return themeManager ? /* @__PURE__ */ jsx(ThemeManagerContext.Provider, {
+    value: themeManager,
+    children: shouldSetChildrenThemeToParent ? /* @__PURE__ */ jsx(Theme, {
+      name: themeManager.parentName,
+      children
+    }) : children
+  }) : children;
 }
 export {
   Theme,

package/dist/esm/views/Theme.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/views/Theme.tsx"],
   "sourcesContent": ["import React, { memo, useMemo } from 'react'\n\nimport { isWeb } from '../constants/platform'\nimport { variableToString } from '../createVariable'\nimport { ThemeManager, ThemeManagerContext } from '../helpers/ThemeManager'\nimport { ThemeProps, useChangeThemeEffect } from '../hooks/useTheme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\nexport const Theme = memo(function Theme(props: ThemeProps) {\n  const { name, theme, themeManager, themes, className } = useChangeThemeEffect(\n    props.name,\n    props.componentName,\n    props\n  )\n\n  const missingTheme = !themes || !name || !theme\n\n  // memo here, changing theme without re-rendering all children is a critical optimization\n  // may require some effort of end user to memoize but without this memo they'd have no option\n  const contents = useMemo(\n    () => (missingTheme ? null : wrapThemeManagerContext(props.children, themeManager)),\n    [missingTheme, props.children, themeManager]\n  )\n\n  if (missingTheme) {\n    if (name && !theme && process.env.NODE_ENV === 'development') {\n      // eslint-disable-next-line no-console\n      console.warn(`No theme found by name ${name}`)\n    }\n    return props.children\n  }\n\n  if (isWeb) {\n    return (\n      <span\n        className={(!props.disableThemeClass\n          ? [props.className, className].filter(Boolean)\n          : []\n        ).join(' ')}\n        style={{\n          display: 'contents',\n          // in order to provide currentColor, set color by default\n          color: variableToString(themes[name]?.color),\n        }}\n      >\n        {contents}\n      </span>\n    )\n  }\n\n  return contents\n})\n\nexport function wrapThemeManagerContext(\n  children: any,\n  themeManager?: ThemeManager | null,\n  shouldSetChildrenThemeToParent?: boolean\n) {\n  return themeManager ? (\n    <ThemeManagerContext.Provider value={themeManager}>\n      {shouldSetChildrenThemeToParent ? (\n        <Theme name={themeManager.parentName}>{children}</Theme>\n      ) : (\n        children\n      )}\n    </ThemeManagerContext.Provider>\n  ) : (\n    children\n  )\n}\n"],
-  "mappings": "AAAA;AAEA;AACA;AACA;AACA;AAGA,MAAM;AAEC,MAAM,QAAQ,KAAK,gBAAe,OAAmB;AAV5D;AAWE,QAAM,EAAE,MAAM,OAAO,cAAc,QAAQ,cAAc,qBACvD,MAAM,MACN,MAAM,eACN,KACF;AAEA,QAAM,eAAe,CAAC,UAAU,CAAC,QAAQ,CAAC;AAI1C,QAAM,WAAW,QACf,MAAO,eAAe,OAAO,wBAAwB,MAAM,UAAU,YAAY,GACjF,CAAC,cAAc,MAAM,UAAU,YAAY,CAC7C;AAEA,MAAI,cAAc;AAChB,QAAI,QAAQ,CAAC,SAAS,QAAQ,IAAI,aAAa,eAAe;AAE5D,cAAQ,KAAK,0BAA0B,MAAM;AAAA,IAC/C;AACA,WAAO,MAAM;AAAA,EACf;AAEA,MAAI,OAAO;AACT,WACE,oCAAC;AAAA,MACC,WAAY,EAAC,MAAM,oBACf,CAAC,MAAM,WAAW,SAAS,EAAE,OAAO,OAAO,IAC3C,CAAC,GACH,KAAK,GAAG;AAAA,MACV,OAAO;AAAA,QACL,SAAS;AAAA,QAET,OAAO,iBAAiB,aAAO,UAAP,mBAAc,KAAK;AAAA,MAC7C;AAAA,OAEC,QACH;AAAA,EAEJ;AAEA,SAAO;AACT,CAAC;AAEM,iCACL,UACA,cACA,gCACA;AACA,SAAO,eACL,oCAAC,oBAAoB,UAApB;AAAA,IAA6B,OAAO;AAAA,KAClC,iCACC,oCAAC;AAAA,IAAM,MAAM,aAAa;AAAA,KAAa,QAAS,IAEhD,QAEJ,IAEA;AAEJ;",
-  "names": []
+  "mappings": "AAoCM;AApCN,OAAO,SAAS,MAAM,eAAe;AAErC,SAAS,aAAa;AACtB,SAAS,wBAAwB;AACjC,SAAuB,2BAA2B;AAClD,SAAqB,4BAA4B;AAGjD,MAAM;AAEC,MAAM,QAAQ,KAAK,SAASA,OAAM,OAAmB;AAV5D;AAWE,QAAM,EAAE,MAAM,OAAO,cAAc,QAAQ,UAAU,IAAI;AAAA,IACvD,MAAM;AAAA,IACN,MAAM;AAAA,IACN;AAAA,EACF;AAEA,QAAM,eAAe,CAAC,UAAU,CAAC,QAAQ,CAAC;AAI1C,QAAM,WAAW;AAAA,IACf,MAAO,eAAe,OAAO,wBAAwB,MAAM,UAAU,YAAY;AAAA,IACjF,CAAC,cAAc,MAAM,UAAU,YAAY;AAAA,EAC7C;AAEA,MAAI,cAAc;AAChB,QAAI,QAAQ,CAAC,SAAS,QAAQ,IAAI,aAAa,eAAe;AAE5D,cAAQ,KAAK,0BAA0B,MAAM;AAAA,IAC/C;AACA,WAAO,MAAM;AAAA,EACf;AAEA,MAAI,OAAO;AACT,WACE,oBAAC;AAAA,MACC,YAAY,CAAC,MAAM,oBACf,CAAC,MAAM,WAAW,SAAS,EAAE,OAAO,OAAO,IAC3C,CAAC,GACH,KAAK,GAAG;AAAA,MACV,OAAO;AAAA,QACL,SAAS;AAAA,QAET,OAAO,kBAAiB,YAAO,UAAP,mBAAc,KAAK;AAAA,MAC7C;AAAA,MAEC;AAAA,KACH;AAAA,EAEJ;AAEA,SAAO;AACT,CAAC;AAEM,SAAS,wBACd,UACA,cACA,gCACA;AACA,SAAO,eACL,oBAAC,oBAAoB,UAApB;AAAA,IAA6B,OAAO;AAAA,IAClC,2CACC,oBAAC;AAAA,MAAM,MAAM,aAAa;AAAA,MAAa;AAAA,KAAS,IAEhD;AAAA,GAEJ,IAEA;AAEJ;",
+  "names": ["Theme"]
 }

package/dist/esm/views/ThemeInverse.js

@@ -1,4 +1,5 @@
-import React, { useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
 import { useIsomorphicLayoutEffect } from "../constants/platform";
 import { useDefaultThemeName, useThemeName } from "../hooks/useTheme";
 import { Theme } from "./Theme";
@@ -20,9 +21,10 @@ const ThemeInverse = ({
   if (disable) {
     return children;
   }
-  return /* @__PURE__ */ React.createElement(Theme, {
-    name
-  }, children);
+  return /* @__PURE__ */ jsx(Theme, {
+    name,
+    children
+  });
 };
 export {
   ThemeInverse

package/dist/esm/views/ThemeInverse.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/views/ThemeInverse.tsx"],
   "sourcesContent": ["import React, { useState } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport const ThemeInverse = ({\n  children,\n  disable,\n}: {\n  children: React.ReactNode\n  disable?: boolean\n}) => {\n  const themeName = useThemeName()\n  const defaultTheme = useDefaultThemeName()\n  const [name, setName] = useState<null | string>(null)\n\n  // ssr\n  useIsomorphicLayoutEffect(() => {\n    if (themeName.startsWith('dark')) {\n      setName('light')\n    }\n    if (themeName.startsWith('light')) {\n      setName('dark')\n    }\n  }, [defaultTheme, themeName])\n\n  if (disable) {\n    return children as JSX.Element\n  }\n\n  return <Theme name={name}>{children}</Theme>\n}\n"],
-  "mappings": "AAAA;AAEA;AACA;AACA;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,MAII;AACJ,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,oBAAoB;AACzC,QAAM,CAAC,MAAM,WAAW,SAAwB,IAAI;AAGpD,4BAA0B,MAAM;AAC9B,QAAI,UAAU,WAAW,MAAM,GAAG;AAChC,cAAQ,OAAO;AAAA,IACjB;AACA,QAAI,UAAU,WAAW,OAAO,GAAG;AACjC,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,MAAI,SAAS;AACX,WAAO;AAAA,EACT;AAEA,SAAO,oCAAC;AAAA,IAAM;AAAA,KAAa,QAAS;AACtC;",
+  "mappings": "AA+BS;AA/BT,SAAgB,gBAAgB;AAEhC,SAAS,iCAAiC;AAC1C,SAAS,qBAAqB,oBAAoB;AAClD,SAAS,aAAa;AAEf,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AACF,MAGM;AACJ,QAAM,YAAY,aAAa;AAC/B,QAAM,eAAe,oBAAoB;AACzC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAwB,IAAI;AAGpD,4BAA0B,MAAM;AAC9B,QAAI,UAAU,WAAW,MAAM,GAAG;AAChC,cAAQ,OAAO;AAAA,IACjB;AACA,QAAI,UAAU,WAAW,OAAO,GAAG;AACjC,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,MAAI,SAAS;AACX,WAAO;AAAA,EACT;AAEA,SAAO,oBAAC;AAAA,IAAM;AAAA,IAAa;AAAA,GAAS;AACtC;",
   "names": []
 }

package/dist/esm/views/ThemeProvider.js

@@ -1,3 +1,4 @@
+import { jsx } from "react/jsx-runtime";
 import React, { useLayoutEffect, useMemo } from "react";
 import { getConfig, getHasConfigured } from "../config";
 import { THEME_CLASSNAME_PREFIX } from "../constants/constants";
@@ -31,13 +32,15 @@ const ThemeProvider = (props) => {
       defaultTheme: props.defaultTheme
     };
   }, [props.defaultTheme]);
-  return /* @__PURE__ */ React.createElement(ThemeContext.Provider, {
-    value: themeContext
-  }, /* @__PURE__ */ React.createElement(Theme, {
-    className: props.className,
-    name: props.defaultTheme,
-    disableThemeClass: props.disableRootThemeClass
-  }, props.children));
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, {
+    value: themeContext,
+    children: /* @__PURE__ */ jsx(Theme, {
+      className: props.className,
+      name: props.defaultTheme,
+      disableThemeClass: props.disableRootThemeClass,
+      children: props.children
+    })
+  });
 };
 export {
   ThemeProvider

package/dist/esm/views/ThemeProvider.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/views/ThemeProvider.tsx"],
   "sourcesContent": ["import React, { useLayoutEffect, useMemo } from 'react'\n\nimport { getConfig, getHasConfigured } from '../config'\nimport { THEME_CLASSNAME_PREFIX } from '../constants/constants'\nimport { ThemeContext } from '../contexts/ThemeContext'\nimport { Theme } from './Theme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\nexport type ThemeProviderProps = {\n  className?: string\n  defaultTheme: string\n  disableRootThemeClass?: boolean\n  themeClassNameOnRoot?: boolean\n  children?: any\n  reset?: boolean\n}\n\nexport const ThemeProvider = (props: ThemeProviderProps) => {\n  if (process.env.NODE_ENV === 'development') {\n    if (!getHasConfigured()) {\n      throw new Error(`Missing configureThemes() call, add to your root file`)\n    }\n  }\n\n  // ensure theme is attached to root body node as well to work with modals by default\n  if (typeof document !== 'undefined') {\n    useLayoutEffect(() => {\n      if (props.disableRootThemeClass) {\n        return\n      }\n      const cn = `${THEME_CLASSNAME_PREFIX}${props.defaultTheme}`\n      const target = props.themeClassNameOnRoot ? document.documentElement : document.body\n      target.classList.add(cn)\n      return () => {\n        target.classList.remove(cn)\n      }\n    }, [props.defaultTheme, props.disableRootThemeClass, props.themeClassNameOnRoot])\n  }\n\n  const themeContext = useMemo(() => {\n    return {\n      get themes() {\n        return getConfig().themes\n      },\n      defaultTheme: props.defaultTheme,\n    }\n  }, [props.defaultTheme])\n\n  return (\n    <ThemeContext.Provider value={themeContext}>\n      <Theme\n        className={props.className}\n        name={props.defaultTheme}\n        disableThemeClass={props.disableRootThemeClass}\n      >\n        {props.children}\n      </Theme>\n    </ThemeContext.Provider>\n  )\n}\n"],
-  "mappings": "AAAA;AAEA;AACA;AACA;AACA;AAGA,MAAM;AAWC,MAAM,gBAAgB,CAAC,UAA8B;AAC1D,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,iBAAiB,GAAG;AACvB,YAAM,IAAI,MAAM,uDAAuD;AAAA,IACzE;AAAA,EACF;AAGA,MAAI,OAAO,aAAa,aAAa;AACnC,oBAAgB,MAAM;AACpB,UAAI,MAAM,uBAAuB;AAC/B;AAAA,MACF;AACA,YAAM,KAAK,GAAG,yBAAyB,MAAM;AAC7C,YAAM,SAAS,MAAM,uBAAuB,SAAS,kBAAkB,SAAS;AAChF,aAAO,UAAU,IAAI,EAAE;AACvB,aAAO,MAAM;AACX,eAAO,UAAU,OAAO,EAAE;AAAA,MAC5B;AAAA,IACF,GAAG,CAAC,MAAM,cAAc,MAAM,uBAAuB,MAAM,oBAAoB,CAAC;AAAA,EAClF;AAEA,QAAM,eAAe,QAAQ,MAAM;AACjC,WAAO;AAAA,MACL,IAAI,SAAS;AACX,eAAO,UAAU,EAAE;AAAA,MACrB;AAAA,MACA,cAAc,MAAM;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,MAAM,YAAY,CAAC;AAEvB,SACE,oCAAC,aAAa,UAAb;AAAA,IAAsB,OAAO;AAAA,KAC5B,oCAAC;AAAA,IACC,WAAW,MAAM;AAAA,IACjB,MAAM,MAAM;AAAA,IACZ,mBAAmB,MAAM;AAAA,KAExB,MAAM,QACT,CACF;AAEJ;",
+  "mappings": "AAoDM;AApDN,OAAO,SAAS,iBAAiB,eAAe;AAEhD,SAAS,WAAW,wBAAwB;AAC5C,SAAS,8BAA8B;AACvC,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AAGtB,MAAM;AAWC,MAAM,gBAAgB,CAAC,UAA8B;AAC1D,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC,iBAAiB,GAAG;AACvB,YAAM,IAAI,MAAM,uDAAuD;AAAA,IACzE;AAAA,EACF;AAGA,MAAI,OAAO,aAAa,aAAa;AACnC,oBAAgB,MAAM;AACpB,UAAI,MAAM,uBAAuB;AAC/B;AAAA,MACF;AACA,YAAM,KAAK,GAAG,yBAAyB,MAAM;AAC7C,YAAM,SAAS,MAAM,uBAAuB,SAAS,kBAAkB,SAAS;AAChF,aAAO,UAAU,IAAI,EAAE;AACvB,aAAO,MAAM;AACX,eAAO,UAAU,OAAO,EAAE;AAAA,MAC5B;AAAA,IACF,GAAG,CAAC,MAAM,cAAc,MAAM,uBAAuB,MAAM,oBAAoB,CAAC;AAAA,EAClF;AAEA,QAAM,eAAe,QAAQ,MAAM;AACjC,WAAO;AAAA,MACL,IAAI,SAAS;AACX,eAAO,UAAU,EAAE;AAAA,MACrB;AAAA,MACA,cAAc,MAAM;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,MAAM,YAAY,CAAC;AAEvB,SACE,oBAAC,aAAa,UAAb;AAAA,IAAsB,OAAO;AAAA,IAC5B,8BAAC;AAAA,MACC,WAAW,MAAM;AAAA,MACjB,MAAM,MAAM;AAAA,MACZ,mBAAmB,MAAM;AAAA,MAExB,gBAAM;AAAA,KACT;AAAA,GACF;AAEJ;",
   "names": []
 }

package/dist/esm/views/ThemeReset.js

@@ -1,3 +1,4 @@
+import { jsx } from "react/jsx-runtime";
 import React, { useContext, useLayoutEffect, useState } from "react";
 import { isWeb } from "../constants/platform";
 import { ThemeManagerContext } from "../helpers/ThemeManager";
@@ -25,11 +26,12 @@ const ThemeReset = (props) => {
   if (!themeManager || !props.children) {
     return props.children || null;
   }
-  return /* @__PURE__ */ React.createElement(Theme, {
+  return /* @__PURE__ */ jsx(Theme, {
     className: "tui-theme-reset",
     reset: true,
-    name
-  }, props.children);
+    name,
+    children: props.children
+  });
 };
 export {
   ThemeReset

package/dist/esm/views/ThemeReset.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/views/ThemeReset.tsx"],
   "sourcesContent": ["import React, { useContext, useLayoutEffect, useState } from 'react'\n\nimport { isWeb } from '../constants/platform'\nimport { ThemeManagerContext } from '../helpers/ThemeManager'\nimport { Theme } from './Theme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\n// resets the theme to the parent theme\nexport const ThemeReset = (props: { children?: any }) => {\n  const themeManager = useContext(ThemeManagerContext)\n  const [name, setName] = useState<string | null>(null)\n\n  // this component doesn't work with SSR, so must run only client side\n  // we could at least prevent more flickering by having the ssr head script\n  // that changes to dark initially also go through and change all of these\n  if (!isWeb || typeof document !== 'undefined') {\n    useLayoutEffect(() => {\n      if (!themeManager) return\n      if (name !== themeManager.parentName) {\n        setName(themeManager.parentName)\n      }\n    }, [themeManager?.parentName])\n\n    useLayoutEffect(() => {\n      if (!themeManager) return\n      return themeManager.onChangeTheme(() => {\n        setName(themeManager.parentName)\n      })\n    }, [])\n  }\n\n  if (!themeManager || !props.children) {\n    return props.children || null\n  }\n\n  return (\n    <Theme className=\"tui-theme-reset\" reset name={name}>\n      {props.children}\n    </Theme>\n  )\n}\n"],
-  "mappings": "AAAA;AAEA;AACA;AACA;AAGA,MAAM;AAGC,MAAM,aAAa,CAAC,UAA8B;AACvD,QAAM,eAAe,WAAW,mBAAmB;AACnD,QAAM,CAAC,MAAM,WAAW,SAAwB,IAAI;AAKpD,MAAI,CAAC,SAAS,OAAO,aAAa,aAAa;AAC7C,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,UAAI,SAAS,aAAa,YAAY;AACpC,gBAAQ,aAAa,UAAU;AAAA,MACjC;AAAA,IACF,GAAG,CAAC,6CAAc,UAAU,CAAC;AAE7B,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,aAAO,aAAa,cAAc,MAAM;AACtC,gBAAQ,aAAa,UAAU;AAAA,MACjC,CAAC;AAAA,IACH,GAAG,CAAC,CAAC;AAAA,EACP;AAEA,MAAI,CAAC,gBAAgB,CAAC,MAAM,UAAU;AACpC,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,SACE,oCAAC;AAAA,IAAM,WAAU;AAAA,IAAkB,OAAK;AAAA,IAAC;AAAA,KACtC,MAAM,QACT;AAEJ;",
+  "mappings": "AAsCI;AAtCJ,OAAO,SAAS,YAAY,iBAAiB,gBAAgB;AAE7D,SAAS,aAAa;AACtB,SAAS,2BAA2B;AACpC,SAAS,aAAa;AAGtB,MAAM;AAGC,MAAM,aAAa,CAAC,UAA8B;AACvD,QAAM,eAAe,WAAW,mBAAmB;AACnD,QAAM,CAAC,MAAM,OAAO,IAAI,SAAwB,IAAI;AAKpD,MAAI,CAAC,SAAS,OAAO,aAAa,aAAa;AAC7C,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,UAAI,SAAS,aAAa,YAAY;AACpC,gBAAQ,aAAa,UAAU;AAAA,MACjC;AAAA,IACF,GAAG,CAAC,6CAAc,UAAU,CAAC;AAE7B,oBAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,aAAO,aAAa,cAAc,MAAM;AACtC,gBAAQ,aAAa,UAAU;AAAA,MACjC,CAAC;AAAA,IACH,GAAG,CAAC,CAAC;AAAA,EACP;AAEA,MAAI,CAAC,gBAAgB,CAAC,MAAM,UAAU;AACpC,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,SACE,oBAAC;AAAA,IAAM,WAAU;AAAA,IAAkB,OAAK;AAAA,IAAC;AAAA,IACtC,gBAAM;AAAA,GACT;AAEJ;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/core",
-  "version": "1.0.1-beta.151",
+  "version": "1.0.1-beta.154",
   "source": "src/index.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -17,7 +17,7 @@
     "watch": "tamagui-build --watch",
     "clean": "tamagui-build clean",
     "clean:build": "tamagui-build clean:build",
-    "test": "vitest --run --config ../vite-plugin-internal/vite.config.ts"
+    "test": "vitest --run --config ../vite-plugin-internal/src/vite.config.ts"
   },
   "files": [
     "types",
@@ -27,14 +27,14 @@
   ],
   "dependencies": {
     "@expo/match-media": "^0.3.0",
-    "@tamagui/compose-refs": "^1.0.1-beta.151",
-    "@tamagui/helpers": "^1.0.1-beta.151",
-    "@tamagui/normalize-css-color-lite": "^1.0.1-beta.151",
-    "@tamagui/rnw": "^1.0.1-beta.151",
-    "@tamagui/rnw-lite": "^1.0.1-beta.151",
-    "@tamagui/use-debounce": "^1.0.1-beta.151",
-    "@tamagui/use-event": "^1.0.1-beta.151",
-    "@tamagui/use-force-update": "^1.0.1-beta.151",
+    "@tamagui/compose-refs": "^1.0.1-beta.154",
+    "@tamagui/helpers": "^1.0.1-beta.154",
+    "@tamagui/normalize-css-color-lite": "^1.0.1-beta.154",
+    "@tamagui/rnw": "^1.0.1-beta.154",
+    "@tamagui/rnw-lite": "^1.0.1-beta.154",
+    "@tamagui/use-debounce": "^1.0.1-beta.154",
+    "@tamagui/use-event": "^1.0.1-beta.154",
+    "@tamagui/use-force-update": "^1.0.1-beta.154",
     "expo-screen-orientation": "^4.3.0",
     "hyphenate-style-name": "^1.0.4"
   },
@@ -43,7 +43,7 @@
     "react-dom": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.151",
+    "@tamagui/build": "^1.0.1-beta.154",
     "@types/react": "^18.0.15",
     "csstype": "^3.0.10",
     "esbuild": "^0.14.49",

package/src/createComponent.tsx

@@ -22,7 +22,7 @@ import React, {
   useContext,
   useEffect,
 } from 'react'
-import { StyleSheet, Text, View, ViewStyle } from 'react-native'
+import { Text, View, ViewStyle } from 'react-native'
 
 import { getConfig, onConfiguredOnce } from './config'
 import { stackDefaultStyles } from './constants/constants'
@@ -98,7 +98,7 @@ function mergeShorthands({ defaultProps }: StaticConfigParsed, { shorthands }: T
 
 let initialTheme: any
 let config: TamaguiInternalConfig
-let mediaPropNames: string[] = []
+const mediaPropNames: string[] = []
 
 export function createComponent<
   ComponentPropTypes extends Object = {},
@@ -120,7 +120,6 @@ export function createComponent<
   let AnimatedView: any
   let avoidClasses = true
   let defaultNativeStyle: any
-  let defaultNativeStyleSheet: StyleSheet.NamedStyles<{ base: {} }>
   let tamaguiDefaultProps: any
   let initialSplitStyles: SplitStyleResult
 
@@ -180,7 +179,7 @@ export function createComponent<
       props['debug']
     )
 
-    const hostRef = useServerRef<HTMLElement | View>(null)
+    const hostRef = useServerRef<TamaguiElement>(null)
     const setState = states[1]
     const setStateShallow = createShallowUpdate(setState)
 
@@ -638,11 +637,7 @@ export function createComponent<
         ...medias,
       }
     } else {
-      styles = [
-        isWeb ? null : defaultNativeStyleSheet ? (defaultNativeStyleSheet.base as ViewStyle) : null,
-        animationStyles ?? style,
-        medias,
-      ]
+      styles = [isWeb ? null : defaultNativeStyle, animationStyles ?? style, medias]
       if (!animationStyles && initialSplitStyles) {
         const initPseudos = initialSplitStyles.pseudos
         !state.mounted && addPseudoToStyles(styles, initPseudos, pseudos, 'enterStyle')
@@ -674,6 +669,10 @@ export function createComponent<
         fontFamily = fontFamily.slice(1)
       }
 
+      if (props['debug']) {
+        console.log('???', fontFamily, isText)
+      }
+
       const classList = [
         componentName ? componentClassName : '',
         fontFamily ? `font_${fontFamily}` : '',
@@ -1142,10 +1141,6 @@ export function createComponent<
       }
     }
 
-    defaultNativeStyleSheet = StyleSheet.create({
-      base: defaultNativeStyle,
-    })
-
     if (Object.keys(defaults).length) {
       tamaguiDefaultProps = defaults
     }
@@ -1372,12 +1367,20 @@ function isUnspaced(child: React.ReactNode) {
 
 function AbsoluteFill(props: { children?: any }) {
   return (
-    <View pointerEvents="box-none" style={StyleSheet.absoluteFill}>
+    <View pointerEvents="box-none" style={absoluteFill}>
       {props.children}
     </View>
   )
 }
 
+const absoluteFill = {
+  position: 'absolute',
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+} as const
+
 // this can be done with CSS entirely right?
 // const shouldWrapTextAncestor = isWeb && isText && !hasTextAncestor
 // if (shouldWrapTextAncestor) {

package/src/createVariable.ts

@@ -36,9 +36,10 @@ export const createVariable = <A extends string | number = any>(props: VariableI
 }
 
 // on the client maybe we can change the prototype of variable object toString to keep backwards compat
-export function variableToString(vrble?: any) {
+export function variableToString(vrble?: any, getValue = false) {
   if (!vrble) return ''
   if (isVariable(vrble)) {
+    if (getValue) return `${vrble.val}`
     return `${isWeb ? vrble.variable : vrble.val}`
   }
   return `${vrble}`

package/src/helpers/createMediaStyle.ts

@@ -27,9 +27,9 @@ export const createMediaStyle = (
     ogPrefix,
     `${ogPrefix}${MEDIA_SEP}${mediaKey}${negKey}${MEDIA_SEP}`
   )}`
-  const screenStr = negate ? 'not all' : 'screen'
+  const screenStr = negate ? 'not all and' : ''
   const mediaSelector = mediaObjectToString(mediaQueries[mediaKey])
-  const mediaQuery = `${screenStr} and ${mediaSelector}`
+  const mediaQuery = `${screenStr} ${mediaSelector}`
   const styleInner = rules.map((rule) => rule.replace(identifier, nextIdentifier)).join(';')
   // combines media queries if they already exist
   let styleRule = ''

package/src/helpers/getSplitStyles.tsx

@@ -1,6 +1,6 @@
 import { stylePropsText, stylePropsTransform, validPseudoKeys, validStyles } from '@tamagui/helpers'
 import { useInsertionEffect } from 'react'
-import { ViewStyle } from 'react-native'
+import type { ViewStyle } from 'react-native'
 
 import { getConfig } from '../config'
 import { isClient, isRSC, isWeb, useIsomorphicLayoutEffect } from '../constants/platform'

package/src/helpers/getStylesAtomic.ts

@@ -5,7 +5,7 @@
 
 import { StyleObject, simpleHash } from '@tamagui/helpers'
 import hyphenateStyleName from 'hyphenate-style-name'
-import { TextStyle, ViewStyle } from 'react-native'
+import type { TextStyle, ViewStyle } from 'react-native'
 
 import { getConfig } from '../config'
 import { TamaguiInternalConfig } from '../types'

package/src/helpers/getThemeCSSRules.ts

@@ -1,5 +1,5 @@
 import { THEME_CLASSNAME_PREFIX } from '../constants/constants'
-import { Variable } from '../createVariable'
+import { Variable, variableToString } from '../createVariable'
 import { CreateTamaguiProps, ThemeObject } from '../types'
 import { tokensValueToVariable } from './registerCSSVariable'
 
@@ -95,7 +95,7 @@ export function getThemeCSSRules({
     const isDark = themeName.startsWith('dark')
     cssRuleSets.push(
       `@media(prefers-color-scheme: ${isDark ? 'dark' : 'light'}) {
-body { background:${theme.background}; color: ${theme.color} }
+body { background:${variableToString(theme.background)}; color: ${variableToString(theme.color)} }
 :root {${vars} } 
 }`
     )

package/src/helpers/mergeTransform.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from 'react-native'
+import type { ViewStyle } from 'react-native'
 
 export const mergeTransform = (obj: ViewStyle, key: string, val: any, backwards = false) => {
   obj.transform ||= []

package/src/insertFont.ts

@@ -48,6 +48,7 @@ export function registerFontVariables(parsedFont: any) {
   const response: string[] = []
 
   for (const fkey in parsedFont) {
+    if (fkey === 'face') continue
     if (fkey === 'family') {
       const val = parsedFont[fkey] as Variable
       registerCSSVariable(val)

package/src/styled.tsx

@@ -1,5 +1,3 @@
-import { Image, Text, TextInput } from 'react-native'
-
 import { createComponent } from './createComponent'
 import { RNComponents } from './helpers/RNComponents'
 import {
@@ -63,9 +61,11 @@ export function styled<
         : null
       const isTamagui = !isReactNativeWeb && !!parentStaticConfig
       const Comp = reactNativeWebComponent || (Component as any)
-      const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))
-      const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))
-      const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))
+      const isImage = Boolean(staticExtractionOptions?.isImage ?? parentStaticConfig?.isImage)
+      const isInput = Boolean(staticExtractionOptions?.isInput ?? parentStaticConfig?.isInput)
+      const isText = Boolean(
+        isInput || (staticExtractionOptions?.isText ?? parentStaticConfig?.isText)
+      )
 
       const conf: Partial<StaticConfig> = {
         ...staticExtractionOptions,

package/types/createVariable.d.ts

@@ -18,7 +18,7 @@ export declare const createVariable: <A extends string | number = any>(props: Va
     isFloating?: boolean | undefined;
     __isVar__: boolean;
 };
-export declare function variableToString(vrble?: any): string;
+export declare function variableToString(vrble?: any, getValue?: boolean): string;
 export declare function isVariable(v: Variable | any): v is Variable;
 export declare function getVariableValue(v: Variable | any): any;
 export declare function getVariableName(v: Variable | any): any;

package/types/helpers/getSplitStyles.d.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from 'react-native';
+import type { ViewStyle } from 'react-native';
 import type { DebugProp, MediaQueryKey, PseudoStyles, SplitStyleState, StackProps, StaticConfigParsed, TamaguiInternalConfig, ThemeObject } from '../types';
 import { FontLanguageProps, LanguageContextType } from '../views/FontLanguage.types';
 import { RulesToInsert } from './insertStyleRule';

package/types/helpers/getStylesAtomic.d.ts

@@ -1,5 +1,5 @@
 import { StyleObject } from '@tamagui/helpers';
-import { TextStyle, ViewStyle } from 'react-native';
+import type { TextStyle, ViewStyle } from 'react-native';
 import { PseudoDescriptor } from './pseudoDescriptors';
 declare type ViewOrTextStyle = ViewStyle | TextStyle;
 export declare type ViewStyleWithPseudos = ViewOrTextStyle & {

package/types/helpers/mergeTransform.d.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from 'react-native';
+import type { ViewStyle } from 'react-native';
 export declare const mergeTransform: (obj: ViewStyle, key: string, val: any, backwards?: boolean) => void;
 export declare const invertMapTransformKeys: {
     translateX: string;

package/dist/cjs/conf.js

@@ -1,70 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var conf_exports = {};
-__export(conf_exports, {
-  configListeners: () => configListeners,
-  getConfig: () => getConfig,
-  getHasConfigured: () => getHasConfigured,
-  getThemes: () => getThemes,
-  getTokens: () => getTokens,
-  onConfiguredOnce: () => onConfiguredOnce,
-  setConfig: () => setConfig,
-  setConfigFont: () => setConfigFont
-});
-module.exports = __toCommonJS(conf_exports);
-let conf;
-const setConfig = (next) => {
-  conf = next;
-  if (configListeners.size) {
-    configListeners.forEach((cb) => cb(conf));
-    configListeners.clear();
-  }
-};
-const setConfigFont = (name, font, fontParsed) => {
-  if (process.env.NODE_ENV === "development") {
-    if (!conf)
-      throw new Error(`Haven't called createTamagui yet`);
-  }
-  Object.assign(conf.fonts, { [name]: font });
-  Object.assign(conf.fontsParsed, { [`$${name}`]: fontParsed });
-};
-const getHasConfigured = () => !!conf;
-const getConfig = () => conf;
-const getTokens = () => conf.tokensParsed;
-const getThemes = () => conf.themes;
-const configListeners = /* @__PURE__ */ new Set();
-const onConfiguredOnce = (cb) => {
-  if (conf) {
-    cb(conf);
-  } else {
-    configListeners.add(cb);
-  }
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  configListeners,
-  getConfig,
-  getHasConfigured,
-  getThemes,
-  getTokens,
-  onConfiguredOnce,
-  setConfig,
-  setConfigFont
-});
-//# sourceMappingURL=conf.js.map

package/dist/cjs/conf.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/conf.ts"],
-  "sourcesContent": ["import { ConfigListener, TamaguiInternalConfig } from './types'\n\nlet conf: TamaguiInternalConfig | null\n\nexport const setConfig = (next: TamaguiInternalConfig) => {\n  conf = next\n  if (configListeners.size) {\n    configListeners.forEach((cb) => cb(conf!))\n    configListeners.clear()\n  }\n}\n\nexport const setConfigFont = (name: string, font: any, fontParsed: any) => {\n  if (process.env.NODE_ENV === 'development') {\n    if (!conf) throw new Error(`Haven't called createTamagui yet`)\n  }\n  Object.assign(conf!.fonts, { [name]: font })\n  Object.assign(conf!.fontsParsed, { [`$${name}`]: fontParsed })\n}\n\nexport const getHasConfigured = () => !!conf\nexport const getConfig = () => conf!\nexport const getTokens = () => conf!.tokensParsed\nexport const getThemes = () => conf!.themes\n\nexport const configListeners = new Set<ConfigListener>()\n\nexport const onConfiguredOnce = (cb: ConfigListener) => {\n  if (conf) {\n    cb(conf!)\n  } else {\n    configListeners.add(cb)\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAI;AAEG,MAAM,YAAY,CAAC,SAAgC;AACxD,SAAO;AACP,MAAI,gBAAgB,MAAM;AACxB,oBAAgB,QAAQ,CAAC,OAAO,GAAG,IAAK,CAAC;AACzC,oBAAgB,MAAM;AAAA,EACxB;AACF;AAEO,MAAM,gBAAgB,CAAC,MAAc,MAAW,eAAoB;AACzE,MAAI,QAAQ,IAAI,aAAa,eAAe;AAC1C,QAAI,CAAC;AAAM,YAAM,IAAI,MAAM,kCAAkC;AAAA,EAC/D;AACA,SAAO,OAAO,KAAM,OAAO,EAAE,CAAC,OAAO,KAAK,CAAC;AAC3C,SAAO,OAAO,KAAM,aAAa,EAAE,CAAC,IAAI,SAAS,WAAW,CAAC;AAC/D;AAEO,MAAM,mBAAmB,MAAM,CAAC,CAAC;AACjC,MAAM,YAAY,MAAM;AACxB,MAAM,YAAY,MAAM,KAAM;AAC9B,MAAM,YAAY,MAAM,KAAM;AAE9B,MAAM,kBAAkB,oBAAI,IAAoB;AAEhD,MAAM,mBAAmB,CAAC,OAAuB;AACtD,MAAI,MAAM;AACR,OAAG,IAAK;AAAA,EACV,OAAO;AACL,oBAAgB,IAAI,EAAE;AAAA,EACxB;AACF;",
-  "names": []
-}