@tamagui/web 1.5.21 → 1.5.23

package/dist/esm/views/Theme.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { isWeb } from "@tamagui/constants";
-import { Children, cloneElement } from "react";
+import { Children, cloneElement, isValidElement } from "react";
 import { variableToString } from "../createVariable.js";
 import { ThemeManagerContext } from "../helpers/ThemeManagerContext.js";
 import { useServerRef } from "../hooks/useServerHooks.js";
@@ -14,47 +14,40 @@ function Theme(props) {
     props.children,
     (child) => cloneElement(child, { ["data-themeable"]: true })
   ) : props.children;
-  return useThemedChildren(themeState, children, props);
+  return useThemedChildren(themeState, children, props, isRoot);
 }
-function useThemedChildren(themeState, children, options) {
+function useThemedChildren(themeState, children, options, isRoot = false) {
   const { themeManager, isNewTheme, className, theme } = themeState;
   const { shallow, forceClassName } = options;
   const hasEverThemed = useServerRef(false);
   if (isNewTheme) {
     hasEverThemed.current = true;
   }
-  if (!isNewTheme && !hasEverThemed.current && !forceClassName && !shallow) {
-    return children;
+  if (isNewTheme || hasEverThemed.current || forceClassName || isRoot) {
+    let next = Children.toArray(children);
+    if (shallow && themeManager) {
+      next = next.map((child) => {
+        return isValidElement(child) ? cloneElement(
+          child,
+          void 0,
+          /* @__PURE__ */ jsx(Theme, { name: themeManager.state.parentName, children: child.props.children })
+        ) : child;
+      });
+    }
+    const wrapped = /* @__PURE__ */ jsx(ThemeManagerContext.Provider, { value: themeManager, children: next });
+    if (forceClassName === false) {
+      return wrapped;
+    }
+    if (isWeb && !options.passPropsToChildren) {
+      const themeColor = theme && isNewTheme ? variableToString(theme.color) : "";
+      const colorStyle = {
+        color: themeColor
+      };
+      return /* @__PURE__ */ jsx("span", { className: `${className || ""} _dsp_contents`, style: colorStyle, children: wrapped });
+    }
+    return wrapped;
   }
-  let next = children;
-  if (shallow && themeManager) {
-    next = Children.map(next, (child) => {
-      return cloneElement(
-        child,
-        void 0,
-        /* @__PURE__ */ jsx(Theme, { name: themeManager.state.parentName, children: child.props.children })
-      );
-    });
-  }
-  next = /* @__PURE__ */ jsx(ThemeManagerContext.Provider, { value: themeManager, children: next });
-  if (isWeb) {
-    const enableClassName = forceClassName ?? (forceClassName !== false && isNewTheme);
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: "_dsp_contents",
-        ...theme && enableClassName && {
-          className: `${className} _dsp_contents`,
-          style: {
-            // in order to provide currentColor, set color by default
-            color: variableToString(theme.color)
-          }
-        },
-        children: next
-      }
-    );
-  }
-  return next;
+  return children;
 }
 export {
   Theme,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/Theme.tsx"],
-  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\nimport { Children, cloneElement } from 'react'\n\nimport { variableToString } from '../createVariable.js'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext.js'\nimport { useServerRef } from '../hooks/useServerHooks.js'\nimport { ChangedThemeResponse, useChangeThemeEffect } from '../hooks/useTheme.js'\nimport type { ThemeProps } from '../types.js'\n\nexport function Theme(props: ThemeProps) {\n  // @ts-expect-error only for internal views\n  if (props.disable) return props.children\n  const isRoot = !!props['_isRoot']\n  const themeState = useChangeThemeEffect(props, isRoot)\n  const children = props['data-themeable']\n    ? Children.map(props.children, (child) =>\n        cloneElement(child, { ['data-themeable']: true })\n      )\n    : props.children\n\n  return useThemedChildren(themeState, children, props)\n}\n\nexport function useThemedChildren(\n  themeState: ChangedThemeResponse,\n  children: any,\n  options: { forceClassName?: boolean; shallow?: boolean }\n) {\n  const { themeManager, isNewTheme, className, theme } = themeState\n  const { shallow, forceClassName } = options\n\n  const hasEverThemed = useServerRef(false)\n  if (isNewTheme) {\n    hasEverThemed.current = true\n  }\n\n  // once a theme is set it always passes the context to avoid reparenting\n  // until then no context to avoid lots of context\n  if (!isNewTheme && !hasEverThemed.current && !forceClassName && !shallow) {\n    return children\n  }\n\n  // be sure to memoize shouldReset to avoid reparenting\n  let next = children\n\n  if (shallow && themeManager) {\n    next = Children.map(next, (child) => {\n      return cloneElement(\n        child,\n        undefined,\n        <Theme name={themeManager.state.parentName}>{child.props.children}</Theme>\n      )\n    })\n  }\n\n  next = (\n    <ThemeManagerContext.Provider value={themeManager}>\n      {next}\n    </ThemeManagerContext.Provider>\n  )\n\n  if (isWeb) {\n    const enableClassName = forceClassName ?? (forceClassName !== false && isNewTheme)\n    return (\n      <span\n        className=\"_dsp_contents\"\n        {...(theme &&\n          enableClassName && {\n            className: `${className} _dsp_contents`,\n            style: {\n              // in order to provide currentColor, set color by default\n              color: variableToString(theme.color),\n            },\n          })}\n      >\n        {next}\n      </span>\n    )\n  }\n\n  return next\n}\n"],
-  "mappings": "AAkDQ;AAlDR,SAAS,aAAa;AACtB,SAAS,UAAU,oBAAoB;AAEvC,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,oBAAoB;AAC7B,SAA+B,4BAA4B;AAGpD,SAAS,MAAM,OAAmB;AAEvC,MAAI,MAAM;AAAS,WAAO,MAAM;AAChC,QAAM,SAAS,CAAC,CAAC,MAAM,SAAS;AAChC,QAAM,aAAa,qBAAqB,OAAO,MAAM;AACrD,QAAM,WAAW,MAAM,gBAAgB,IACnC,SAAS;AAAA,IAAI,MAAM;AAAA,IAAU,CAAC,UAC5B,aAAa,OAAO,EAAE,CAAC,gBAAgB,GAAG,KAAK,CAAC;AAAA,EAClD,IACA,MAAM;AAEV,SAAO,kBAAkB,YAAY,UAAU,KAAK;AACtD;AAEO,SAAS,kBACd,YACA,UACA,SACA;AACA,QAAM,EAAE,cAAc,YAAY,WAAW,MAAM,IAAI;AACvD,QAAM,EAAE,SAAS,eAAe,IAAI;AAEpC,QAAM,gBAAgB,aAAa,KAAK;AACxC,MAAI,YAAY;AACd,kBAAc,UAAU;AAAA,EAC1B;AAIA,MAAI,CAAC,cAAc,CAAC,cAAc,WAAW,CAAC,kBAAkB,CAAC,SAAS;AACxE,WAAO;AAAA,EACT;AAGA,MAAI,OAAO;AAEX,MAAI,WAAW,cAAc;AAC3B,WAAO,SAAS,IAAI,MAAM,CAAC,UAAU;AACnC,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,oBAAC,SAAM,MAAM,aAAa,MAAM,YAAa,gBAAM,MAAM,UAAS;AAAA,MACpE;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SACE,oBAAC,oBAAoB,UAApB,EAA6B,OAAO,cAClC,gBACH;AAGF,MAAI,OAAO;AACT,UAAM,kBAAkB,mBAAmB,mBAAmB,SAAS;AACvE,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACT,GAAI,SACH,mBAAmB;AAAA,UACjB,WAAW,GAAG;AAAA,UACd,OAAO;AAAA;AAAA,YAEL,OAAO,iBAAiB,MAAM,KAAK;AAAA,UACrC;AAAA,QACF;AAAA,QAED;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SAAO;AACT;",
+  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\nimport { Children, cloneElement, isValidElement } from 'react'\n\nimport { variableToString } from '../createVariable.js'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext.js'\nimport { useServerRef } from '../hooks/useServerHooks.js'\nimport { ChangedThemeResponse, useChangeThemeEffect } from '../hooks/useTheme.js'\nimport type { ThemeProps } from '../types.js'\n\nexport function Theme(props: ThemeProps) {\n  // @ts-expect-error only for internal views\n  if (props.disable) return props.children\n  const isRoot = !!props['_isRoot']\n  const themeState = useChangeThemeEffect(props, isRoot)\n  const children = props['data-themeable']\n    ? Children.map(props.children, (child) =>\n        cloneElement(child, { ['data-themeable']: true })\n      )\n    : props.children\n\n  return useThemedChildren(themeState, children, props, isRoot)\n}\n\nexport function useThemedChildren(\n  themeState: ChangedThemeResponse,\n  children: any,\n  options: {\n    forceClassName?: boolean\n    shallow?: boolean\n    passPropsToChildren?: boolean\n  },\n  isRoot = false\n) {\n  const { themeManager, isNewTheme, className, theme } = themeState\n  const { shallow, forceClassName } = options\n  const hasEverThemed = useServerRef(false)\n  if (isNewTheme) {\n    hasEverThemed.current = true\n  }\n\n  if (isNewTheme || hasEverThemed.current || forceClassName || isRoot) {\n    // be sure to memoize shouldReset to avoid reparenting\n    let next = Children.toArray(children)\n\n    // each children of these children wont get the theme\n    if (shallow && themeManager) {\n      next = next.map((child) => {\n        return isValidElement(child)\n          ? cloneElement(\n              child,\n              undefined,\n              <Theme name={themeManager.state.parentName}>\n                {(child as any).props.children}\n              </Theme>\n            )\n          : child\n      })\n    }\n\n    // tried this but themes css doesn't fully like it\n    // if (shouldAttachClassName && options.passPropsToChildren) {\n    //   next = next.map((child: any) => {\n    //     const childStyle = child.props?.style\n    //     console.log('pass it down', className, child.props.className || '')\n    //     const newProps = {\n    //       className: (child.props.className || '') + ' ' + className,\n    //       style: Array.isArray(childStyle)\n    //         ? [colorStyle, ...childStyle]\n    //         : {\n    //             ...colorStyle,\n    //             ...childStyle,\n    //           },\n    //     }\n    //     return isValidElement(child) ? cloneElement(child as any, newProps) : child\n    //   })\n    // }\n\n    const wrapped = (\n      <ThemeManagerContext.Provider value={themeManager}>\n        {next}\n      </ThemeManagerContext.Provider>\n    )\n\n    if (forceClassName === false) {\n      return wrapped\n    }\n\n    if (isWeb && !options.passPropsToChildren) {\n      // in order to provide currentColor, set color by default\n      const themeColor = theme && isNewTheme ? variableToString(theme.color) : ''\n      const colorStyle = {\n        color: themeColor,\n      }\n\n      return (\n        <span className={`${className || ''} _dsp_contents`} style={colorStyle}>\n          {wrapped}\n        </span>\n      )\n    }\n\n    return wrapped\n  }\n\n  return children\n}\n"],
+  "mappings": "AAmDc;AAnDd,SAAS,aAAa;AACtB,SAAS,UAAU,cAAc,sBAAsB;AAEvD,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,oBAAoB;AAC7B,SAA+B,4BAA4B;AAGpD,SAAS,MAAM,OAAmB;AAEvC,MAAI,MAAM;AAAS,WAAO,MAAM;AAChC,QAAM,SAAS,CAAC,CAAC,MAAM,SAAS;AAChC,QAAM,aAAa,qBAAqB,OAAO,MAAM;AACrD,QAAM,WAAW,MAAM,gBAAgB,IACnC,SAAS;AAAA,IAAI,MAAM;AAAA,IAAU,CAAC,UAC5B,aAAa,OAAO,EAAE,CAAC,gBAAgB,GAAG,KAAK,CAAC;AAAA,EAClD,IACA,MAAM;AAEV,SAAO,kBAAkB,YAAY,UAAU,OAAO,MAAM;AAC9D;AAEO,SAAS,kBACd,YACA,UACA,SAKA,SAAS,OACT;AACA,QAAM,EAAE,cAAc,YAAY,WAAW,MAAM,IAAI;AACvD,QAAM,EAAE,SAAS,eAAe,IAAI;AACpC,QAAM,gBAAgB,aAAa,KAAK;AACxC,MAAI,YAAY;AACd,kBAAc,UAAU;AAAA,EAC1B;AAEA,MAAI,cAAc,cAAc,WAAW,kBAAkB,QAAQ;AAEnE,QAAI,OAAO,SAAS,QAAQ,QAAQ;AAGpC,QAAI,WAAW,cAAc;AAC3B,aAAO,KAAK,IAAI,CAAC,UAAU;AACzB,eAAO,eAAe,KAAK,IACvB;AAAA,UACE;AAAA,UACA;AAAA,UACA,oBAAC,SAAM,MAAM,aAAa,MAAM,YAC5B,gBAAc,MAAM,UACxB;AAAA,QACF,IACA;AAAA,MACN,CAAC;AAAA,IACH;AAoBA,UAAM,UACJ,oBAAC,oBAAoB,UAApB,EAA6B,OAAO,cAClC,gBACH;AAGF,QAAI,mBAAmB,OAAO;AAC5B,aAAO;AAAA,IACT;AAEA,QAAI,SAAS,CAAC,QAAQ,qBAAqB;AAEzC,YAAM,aAAa,SAAS,aAAa,iBAAiB,MAAM,KAAK,IAAI;AACzE,YAAM,aAAa;AAAA,QACjB,OAAO;AAAA,MACT;AAEA,aACE,oBAAC,UAAK,WAAW,GAAG,aAAa,oBAAoB,OAAO,YACzD,mBACH;AAAA,IAEJ;AAEA,WAAO;AAAA,EACT;AAEA,SAAO;AACT;",
   "names": []
 }

package/dist/esm/views/Theme.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { isWeb } from "@tamagui/constants";
-import { Children, cloneElement } from "react";
+import { Children, cloneElement, isValidElement } from "react";
 import { variableToString } from "../createVariable.js";
 import { ThemeManagerContext } from "../helpers/ThemeManagerContext.js";
 import { useServerRef } from "../hooks/useServerHooks.js";
@@ -14,47 +14,40 @@ function Theme(props) {
     props.children,
     (child) => cloneElement(child, { ["data-themeable"]: true })
   ) : props.children;
-  return useThemedChildren(themeState, children, props);
+  return useThemedChildren(themeState, children, props, isRoot);
 }
-function useThemedChildren(themeState, children, options) {
+function useThemedChildren(themeState, children, options, isRoot = false) {
   const { themeManager, isNewTheme, className, theme } = themeState;
   const { shallow, forceClassName } = options;
   const hasEverThemed = useServerRef(false);
   if (isNewTheme) {
     hasEverThemed.current = true;
   }
-  if (!isNewTheme && !hasEverThemed.current && !forceClassName && !shallow) {
-    return children;
+  if (isNewTheme || hasEverThemed.current || forceClassName || isRoot) {
+    let next = Children.toArray(children);
+    if (shallow && themeManager) {
+      next = next.map((child) => {
+        return isValidElement(child) ? cloneElement(
+          child,
+          void 0,
+          /* @__PURE__ */ jsx(Theme, { name: themeManager.state.parentName, children: child.props.children })
+        ) : child;
+      });
+    }
+    const wrapped = /* @__PURE__ */ jsx(ThemeManagerContext.Provider, { value: themeManager, children: next });
+    if (forceClassName === false) {
+      return wrapped;
+    }
+    if (isWeb && !options.passPropsToChildren) {
+      const themeColor = theme && isNewTheme ? variableToString(theme.color) : "";
+      const colorStyle = {
+        color: themeColor
+      };
+      return /* @__PURE__ */ jsx("span", { className: `${className || ""} _dsp_contents`, style: colorStyle, children: wrapped });
+    }
+    return wrapped;
   }
-  let next = children;
-  if (shallow && themeManager) {
-    next = Children.map(next, (child) => {
-      return cloneElement(
-        child,
-        void 0,
-        /* @__PURE__ */ jsx(Theme, { name: themeManager.state.parentName, children: child.props.children })
-      );
-    });
-  }
-  next = /* @__PURE__ */ jsx(ThemeManagerContext.Provider, { value: themeManager, children: next });
-  if (isWeb) {
-    const enableClassName = forceClassName ?? (forceClassName !== false && isNewTheme);
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: "_dsp_contents",
-        ...theme && enableClassName && {
-          className: `${className} _dsp_contents`,
-          style: {
-            // in order to provide currentColor, set color by default
-            color: variableToString(theme.color)
-          }
-        },
-        children: next
-      }
-    );
-  }
-  return next;
+  return children;
 }
 export {
   Theme,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/Theme.tsx"],
-  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\nimport { Children, cloneElement } from 'react'\n\nimport { variableToString } from '../createVariable.js'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext.js'\nimport { useServerRef } from '../hooks/useServerHooks.js'\nimport { ChangedThemeResponse, useChangeThemeEffect } from '../hooks/useTheme.js'\nimport type { ThemeProps } from '../types.js'\n\nexport function Theme(props: ThemeProps) {\n  // @ts-expect-error only for internal views\n  if (props.disable) return props.children\n  const isRoot = !!props['_isRoot']\n  const themeState = useChangeThemeEffect(props, isRoot)\n  const children = props['data-themeable']\n    ? Children.map(props.children, (child) =>\n        cloneElement(child, { ['data-themeable']: true })\n      )\n    : props.children\n\n  return useThemedChildren(themeState, children, props)\n}\n\nexport function useThemedChildren(\n  themeState: ChangedThemeResponse,\n  children: any,\n  options: { forceClassName?: boolean; shallow?: boolean }\n) {\n  const { themeManager, isNewTheme, className, theme } = themeState\n  const { shallow, forceClassName } = options\n\n  const hasEverThemed = useServerRef(false)\n  if (isNewTheme) {\n    hasEverThemed.current = true\n  }\n\n  // once a theme is set it always passes the context to avoid reparenting\n  // until then no context to avoid lots of context\n  if (!isNewTheme && !hasEverThemed.current && !forceClassName && !shallow) {\n    return children\n  }\n\n  // be sure to memoize shouldReset to avoid reparenting\n  let next = children\n\n  if (shallow && themeManager) {\n    next = Children.map(next, (child) => {\n      return cloneElement(\n        child,\n        undefined,\n        <Theme name={themeManager.state.parentName}>{child.props.children}</Theme>\n      )\n    })\n  }\n\n  next = (\n    <ThemeManagerContext.Provider value={themeManager}>\n      {next}\n    </ThemeManagerContext.Provider>\n  )\n\n  if (isWeb) {\n    const enableClassName = forceClassName ?? (forceClassName !== false && isNewTheme)\n    return (\n      <span\n        className=\"_dsp_contents\"\n        {...(theme &&\n          enableClassName && {\n            className: `${className} _dsp_contents`,\n            style: {\n              // in order to provide currentColor, set color by default\n              color: variableToString(theme.color),\n            },\n          })}\n      >\n        {next}\n      </span>\n    )\n  }\n\n  return next\n}\n"],
-  "mappings": "AAkDQ;AAlDR,SAAS,aAAa;AACtB,SAAS,UAAU,oBAAoB;AAEvC,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,oBAAoB;AAC7B,SAA+B,4BAA4B;AAGpD,SAAS,MAAM,OAAmB;AAEvC,MAAI,MAAM;AAAS,WAAO,MAAM;AAChC,QAAM,SAAS,CAAC,CAAC,MAAM,SAAS;AAChC,QAAM,aAAa,qBAAqB,OAAO,MAAM;AACrD,QAAM,WAAW,MAAM,gBAAgB,IACnC,SAAS;AAAA,IAAI,MAAM;AAAA,IAAU,CAAC,UAC5B,aAAa,OAAO,EAAE,CAAC,gBAAgB,GAAG,KAAK,CAAC;AAAA,EAClD,IACA,MAAM;AAEV,SAAO,kBAAkB,YAAY,UAAU,KAAK;AACtD;AAEO,SAAS,kBACd,YACA,UACA,SACA;AACA,QAAM,EAAE,cAAc,YAAY,WAAW,MAAM,IAAI;AACvD,QAAM,EAAE,SAAS,eAAe,IAAI;AAEpC,QAAM,gBAAgB,aAAa,KAAK;AACxC,MAAI,YAAY;AACd,kBAAc,UAAU;AAAA,EAC1B;AAIA,MAAI,CAAC,cAAc,CAAC,cAAc,WAAW,CAAC,kBAAkB,CAAC,SAAS;AACxE,WAAO;AAAA,EACT;AAGA,MAAI,OAAO;AAEX,MAAI,WAAW,cAAc;AAC3B,WAAO,SAAS,IAAI,MAAM,CAAC,UAAU;AACnC,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,oBAAC,SAAM,MAAM,aAAa,MAAM,YAAa,gBAAM,MAAM,UAAS;AAAA,MACpE;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SACE,oBAAC,oBAAoB,UAApB,EAA6B,OAAO,cAClC,gBACH;AAGF,MAAI,OAAO;AACT,UAAM,kBAAkB,mBAAmB,mBAAmB,SAAS;AACvE,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACT,GAAI,SACH,mBAAmB;AAAA,UACjB,WAAW,GAAG;AAAA,UACd,OAAO;AAAA;AAAA,YAEL,OAAO,iBAAiB,MAAM,KAAK;AAAA,UACrC;AAAA,QACF;AAAA,QAED;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SAAO;AACT;",
+  "sourcesContent": ["import { isWeb } from '@tamagui/constants'\nimport { Children, cloneElement, isValidElement } from 'react'\n\nimport { variableToString } from '../createVariable.js'\nimport { ThemeManagerContext } from '../helpers/ThemeManagerContext.js'\nimport { useServerRef } from '../hooks/useServerHooks.js'\nimport { ChangedThemeResponse, useChangeThemeEffect } from '../hooks/useTheme.js'\nimport type { ThemeProps } from '../types.js'\n\nexport function Theme(props: ThemeProps) {\n  // @ts-expect-error only for internal views\n  if (props.disable) return props.children\n  const isRoot = !!props['_isRoot']\n  const themeState = useChangeThemeEffect(props, isRoot)\n  const children = props['data-themeable']\n    ? Children.map(props.children, (child) =>\n        cloneElement(child, { ['data-themeable']: true })\n      )\n    : props.children\n\n  return useThemedChildren(themeState, children, props, isRoot)\n}\n\nexport function useThemedChildren(\n  themeState: ChangedThemeResponse,\n  children: any,\n  options: {\n    forceClassName?: boolean\n    shallow?: boolean\n    passPropsToChildren?: boolean\n  },\n  isRoot = false\n) {\n  const { themeManager, isNewTheme, className, theme } = themeState\n  const { shallow, forceClassName } = options\n  const hasEverThemed = useServerRef(false)\n  if (isNewTheme) {\n    hasEverThemed.current = true\n  }\n\n  if (isNewTheme || hasEverThemed.current || forceClassName || isRoot) {\n    // be sure to memoize shouldReset to avoid reparenting\n    let next = Children.toArray(children)\n\n    // each children of these children wont get the theme\n    if (shallow && themeManager) {\n      next = next.map((child) => {\n        return isValidElement(child)\n          ? cloneElement(\n              child,\n              undefined,\n              <Theme name={themeManager.state.parentName}>\n                {(child as any).props.children}\n              </Theme>\n            )\n          : child\n      })\n    }\n\n    // tried this but themes css doesn't fully like it\n    // if (shouldAttachClassName && options.passPropsToChildren) {\n    //   next = next.map((child: any) => {\n    //     const childStyle = child.props?.style\n    //     console.log('pass it down', className, child.props.className || '')\n    //     const newProps = {\n    //       className: (child.props.className || '') + ' ' + className,\n    //       style: Array.isArray(childStyle)\n    //         ? [colorStyle, ...childStyle]\n    //         : {\n    //             ...colorStyle,\n    //             ...childStyle,\n    //           },\n    //     }\n    //     return isValidElement(child) ? cloneElement(child as any, newProps) : child\n    //   })\n    // }\n\n    const wrapped = (\n      <ThemeManagerContext.Provider value={themeManager}>\n        {next}\n      </ThemeManagerContext.Provider>\n    )\n\n    if (forceClassName === false) {\n      return wrapped\n    }\n\n    if (isWeb && !options.passPropsToChildren) {\n      // in order to provide currentColor, set color by default\n      const themeColor = theme && isNewTheme ? variableToString(theme.color) : ''\n      const colorStyle = {\n        color: themeColor,\n      }\n\n      return (\n        <span className={`${className || ''} _dsp_contents`} style={colorStyle}>\n          {wrapped}\n        </span>\n      )\n    }\n\n    return wrapped\n  }\n\n  return children\n}\n"],
+  "mappings": "AAmDc;AAnDd,SAAS,aAAa;AACtB,SAAS,UAAU,cAAc,sBAAsB;AAEvD,SAAS,wBAAwB;AACjC,SAAS,2BAA2B;AACpC,SAAS,oBAAoB;AAC7B,SAA+B,4BAA4B;AAGpD,SAAS,MAAM,OAAmB;AAEvC,MAAI,MAAM;AAAS,WAAO,MAAM;AAChC,QAAM,SAAS,CAAC,CAAC,MAAM,SAAS;AAChC,QAAM,aAAa,qBAAqB,OAAO,MAAM;AACrD,QAAM,WAAW,MAAM,gBAAgB,IACnC,SAAS;AAAA,IAAI,MAAM;AAAA,IAAU,CAAC,UAC5B,aAAa,OAAO,EAAE,CAAC,gBAAgB,GAAG,KAAK,CAAC;AAAA,EAClD,IACA,MAAM;AAEV,SAAO,kBAAkB,YAAY,UAAU,OAAO,MAAM;AAC9D;AAEO,SAAS,kBACd,YACA,UACA,SAKA,SAAS,OACT;AACA,QAAM,EAAE,cAAc,YAAY,WAAW,MAAM,IAAI;AACvD,QAAM,EAAE,SAAS,eAAe,IAAI;AACpC,QAAM,gBAAgB,aAAa,KAAK;AACxC,MAAI,YAAY;AACd,kBAAc,UAAU;AAAA,EAC1B;AAEA,MAAI,cAAc,cAAc,WAAW,kBAAkB,QAAQ;AAEnE,QAAI,OAAO,SAAS,QAAQ,QAAQ;AAGpC,QAAI,WAAW,cAAc;AAC3B,aAAO,KAAK,IAAI,CAAC,UAAU;AACzB,eAAO,eAAe,KAAK,IACvB;AAAA,UACE;AAAA,UACA;AAAA,UACA,oBAAC,SAAM,MAAM,aAAa,MAAM,YAC5B,gBAAc,MAAM,UACxB;AAAA,QACF,IACA;AAAA,MACN,CAAC;AAAA,IACH;AAoBA,UAAM,UACJ,oBAAC,oBAAoB,UAApB,EAA6B,OAAO,cAClC,gBACH;AAGF,QAAI,mBAAmB,OAAO;AAC5B,aAAO;AAAA,IACT;AAEA,QAAI,SAAS,CAAC,QAAQ,qBAAqB;AAEzC,YAAM,aAAa,SAAS,aAAa,iBAAiB,MAAM,KAAK,IAAI;AACzE,YAAM,aAAa;AAAA,QACjB,OAAO;AAAA,MACT;AAEA,aACE,oBAAC,UAAK,WAAW,GAAG,aAAa,oBAAoB,OAAO,YACzD,mBACH;AAAA,IAEJ;AAEA,WAAO;AAAA,EACT;AAEA,SAAO;AACT;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/web",
-  "version": "1.5.21",
+  "version": "1.5.23",
   "source": "src/index.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -27,19 +27,19 @@
     "reset.css"
   ],
   "dependencies": {
-    "@tamagui/compose-refs": "^1.5.21",
-    "@tamagui/constants": "^1.5.21",
-    "@tamagui/helpers": "^1.5.21",
-    "@tamagui/normalize-css-color": "^1.5.21",
-    "@tamagui/use-did-finish-ssr": "^1.5.21",
-    "@tamagui/use-event": "^1.5.21",
-    "@tamagui/use-force-update": "^1.5.21"
+    "@tamagui/compose-refs": "^1.5.23",
+    "@tamagui/constants": "^1.5.23",
+    "@tamagui/helpers": "^1.5.23",
+    "@tamagui/normalize-css-color": "^1.5.23",
+    "@tamagui/use-did-finish-ssr": "^1.5.23",
+    "@tamagui/use-event": "^1.5.23",
+    "@tamagui/use-force-update": "^1.5.23"
   },
   "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.5.21",
+    "@tamagui/build": "^1.5.23",
     "@testing-library/react": "^13.4.0",
     "csstype": "^3.0.10",
     "react": "^18.2.0",

package/src/createComponent.tsx

@@ -720,6 +720,7 @@ export function createComponent<
 
     content = useThemedChildren(themeState, content, {
       shallow: stateRef.current.themeShallow,
+      // passPropsToChildren: true,
     })
 
     if (process.env.TAMAGUI_TARGET === 'web') {
@@ -1066,7 +1067,6 @@ type CreateSpacerProps = SpacedChildrenProps & { key: string }
 
 function createSpacer({ key, direction, space, spaceFlex }: CreateSpacerProps) {
   return (
-    // @ts-ignore this one blew up but the types seem better
     <Spacer
       key={key}
       size={space}
@@ -1079,8 +1079,8 @@ function createSpacer({ key, direction, space, spaceFlex }: CreateSpacerProps) {
 }
 
 function isUnspaced(child: React.ReactNode) {
-  // console.log('unspaced?', child, getMedia())
-  return child?.['type']?.['isVisuallyHidden'] || child?.['type']?.['isUnspaced']
+  const t = child?.['type']
+  return t?.['isVisuallyHidden'] || t?.['isUnspaced']
 }
 
 const DefaultProps = new Map()
@@ -1122,7 +1122,6 @@ function mergeConfigDefaultProps(
 }
 
 const AbsoluteFill: any = createComponent({
-  componentName: 'AbsoluteFill',
   defaultProps: {
     ...stackDefaultStyles,
     flexDirection: 'column',

package/src/views/Theme.tsx

@@ -1,5 +1,5 @@
 import { isWeb } from '@tamagui/constants'
-import { Children, cloneElement } from 'react'
+import { Children, cloneElement, isValidElement } from 'react'
 
 import { variableToString } from '../createVariable.js'
 import { ThemeManagerContext } from '../helpers/ThemeManagerContext.js'
@@ -18,65 +18,89 @@ export function Theme(props: ThemeProps) {
       )
     : props.children
 
-  return useThemedChildren(themeState, children, props)
+  return useThemedChildren(themeState, children, props, isRoot)
 }
 
 export function useThemedChildren(
   themeState: ChangedThemeResponse,
   children: any,
-  options: { forceClassName?: boolean; shallow?: boolean }
+  options: {
+    forceClassName?: boolean
+    shallow?: boolean
+    passPropsToChildren?: boolean
+  },
+  isRoot = false
 ) {
   const { themeManager, isNewTheme, className, theme } = themeState
   const { shallow, forceClassName } = options
-
   const hasEverThemed = useServerRef(false)
   if (isNewTheme) {
     hasEverThemed.current = true
   }
 
-  // once a theme is set it always passes the context to avoid reparenting
-  // until then no context to avoid lots of context
-  if (!isNewTheme && !hasEverThemed.current && !forceClassName && !shallow) {
-    return children
-  }
-
-  // be sure to memoize shouldReset to avoid reparenting
-  let next = children
+  if (isNewTheme || hasEverThemed.current || forceClassName || isRoot) {
+    // be sure to memoize shouldReset to avoid reparenting
+    let next = Children.toArray(children)
 
-  if (shallow && themeManager) {
-    next = Children.map(next, (child) => {
-      return cloneElement(
-        child,
-        undefined,
-        <Theme name={themeManager.state.parentName}>{child.props.children}</Theme>
-      )
-    })
-  }
+    // each children of these children wont get the theme
+    if (shallow && themeManager) {
+      next = next.map((child) => {
+        return isValidElement(child)
+          ? cloneElement(
+              child,
+              undefined,
+              <Theme name={themeManager.state.parentName}>
+                {(child as any).props.children}
+              </Theme>
+            )
+          : child
+      })
+    }
 
-  next = (
-    <ThemeManagerContext.Provider value={themeManager}>
-      {next}
-    </ThemeManagerContext.Provider>
-  )
+    // tried this but themes css doesn't fully like it
+    // if (shouldAttachClassName && options.passPropsToChildren) {
+    //   next = next.map((child: any) => {
+    //     const childStyle = child.props?.style
+    //     console.log('pass it down', className, child.props.className || '')
+    //     const newProps = {
+    //       className: (child.props.className || '') + ' ' + className,
+    //       style: Array.isArray(childStyle)
+    //         ? [colorStyle, ...childStyle]
+    //         : {
+    //             ...colorStyle,
+    //             ...childStyle,
+    //           },
+    //     }
+    //     return isValidElement(child) ? cloneElement(child as any, newProps) : child
+    //   })
+    // }
 
-  if (isWeb) {
-    const enableClassName = forceClassName ?? (forceClassName !== false && isNewTheme)
-    return (
-      <span
-        className="_dsp_contents"
-        {...(theme &&
-          enableClassName && {
-            className: `${className} _dsp_contents`,
-            style: {
-              // in order to provide currentColor, set color by default
-              color: variableToString(theme.color),
-            },
-          })}
-      >
+    const wrapped = (
+      <ThemeManagerContext.Provider value={themeManager}>
         {next}
-      </span>
+      </ThemeManagerContext.Provider>
     )
+
+    if (forceClassName === false) {
+      return wrapped
+    }
+
+    if (isWeb && !options.passPropsToChildren) {
+      // in order to provide currentColor, set color by default
+      const themeColor = theme && isNewTheme ? variableToString(theme.color) : ''
+      const colorStyle = {
+        color: themeColor,
+      }
+
+      return (
+        <span className={`${className || ''} _dsp_contents`} style={colorStyle}>
+          {wrapped}
+        </span>
+      )
+    }
+
+    return wrapped
   }
 
-  return next
+  return children
 }

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAUN,MAAM,OAAO,CAAA;AAiBd,OAAO,EACL,SAAS,EACT,cAAc,EACd,WAAW,EACX,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAEhB,qBAAqB,EAErB,cAAc,EAIf,MAAM,SAAS,CAAA;AAmBhB,eAAO,MAAM,qBAAqB,EAAE,qBAMnC,CAAA;AAeD,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA8B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EAEjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EACpD,eAAe,CAAC,EAAE,iBAAiB,4DAswBpC;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAEjD,CAAA;AAMD,eAAO,MAAM,MAAM,0DA8CjB,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,IAAI,CAAA;IACnC,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,mBAiGxD"}
+{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAUN,MAAM,OAAO,CAAA;AAiBd,OAAO,EACL,SAAS,EACT,cAAc,EACd,WAAW,EACX,WAAW,EACX,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAEhB,qBAAqB,EAErB,cAAc,EAIf,MAAM,SAAS,CAAA;AAmBhB,eAAO,MAAM,qBAAqB,EAAE,qBAMnC,CAAA;AAeD,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA8B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EAEjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EACpD,eAAe,CAAC,EAAE,iBAAiB,4DAuwBpC;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAEjD,CAAA;AAMD,eAAO,MAAM,MAAM,0DA8CjB,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,KAAK,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,IAAI,CAAA;IACnC,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB,CAAA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,mBAiGxD"}

package/types/views/Theme.d.ts

@@ -4,5 +4,6 @@ export declare function Theme(props: ThemeProps): any;
 export declare function useThemedChildren(themeState: ChangedThemeResponse, children: any, options: {
     forceClassName?: boolean;
     shallow?: boolean;
-}): any;
+    passPropsToChildren?: boolean;
+}, isRoot?: boolean): any;
 //# sourceMappingURL=Theme.d.ts.map

package/types/views/Theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/views/Theme.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAwB,MAAM,sBAAsB,CAAA;AACjF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAE7C,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,OAYtC;AAED,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,oBAAoB,EAChC,QAAQ,EAAE,GAAG,EACb,OAAO,EAAE;IAAE,cAAc,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,OAuDzD"}
+{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../src/views/Theme.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,oBAAoB,EAAwB,MAAM,sBAAsB,CAAA;AACjF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAE7C,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,OAYtC;AAED,wBAAgB,iBAAiB,CAC/B,UAAU,EAAE,oBAAoB,EAChC,QAAQ,EAAE,GAAG,EACb,OAAO,EAAE;IACP,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,EACD,MAAM,UAAQ,OA0Ef"}

package/dist/cjs/helpers/mergeTransform.js

@@ -1,47 +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 mergeTransform_exports = {};
-__export(mergeTransform_exports, {
-  mapTransformKeys: () => mapTransformKeys,
-  mergeTransform: () => mergeTransform,
-  mergeTransforms: () => mergeTransforms
-});
-module.exports = __toCommonJS(mergeTransform_exports);
-const mergeTransform = (obj, key, val, backwards = false) => {
-  obj.transform || (obj.transform = []);
-  obj.transform[backwards ? "unshift" : "push"]({
-    [mapTransformKeys[key] || key]: val
-  });
-};
-const mergeTransforms = (obj, flatTransforms, backwards = false) => {
-  Object.entries(flatTransforms).forEach(([key, val]) => {
-    mergeTransform(obj, key, val, backwards);
-  });
-};
-const mapTransformKeys = {
-  x: "translateX",
-  y: "translateY"
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  mapTransformKeys,
-  mergeTransform,
-  mergeTransforms
-});
-//# sourceMappingURL=mergeTransform.js.map

package/dist/cjs/helpers/mergeTransform.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/helpers/mergeTransform.ts"],
-  "sourcesContent": ["import type { ViewStyle } from 'react-native'\n\nexport type FlatTransforms = Record<string, any>\n\nexport const mergeTransform = (\n  obj: ViewStyle,\n  key: string,\n  val: any,\n  backwards = false\n) => {\n  obj.transform ||= []\n  obj.transform[backwards ? 'unshift' : 'push']({\n    [mapTransformKeys[key] || key]: val,\n  } as any)\n}\n\nexport const mergeTransforms = (\n  obj: ViewStyle,\n  flatTransforms: FlatTransforms,\n  backwards = false\n) => {\n  Object.entries(flatTransforms).forEach(([key, val]) => {\n    mergeTransform(obj, key, val, backwards)\n  })\n}\n\nexport const mapTransformKeys = {\n  x: 'translateX',\n  y: 'translateY',\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAIO,MAAM,iBAAiB,CAC5B,KACA,KACA,KACA,YAAY,UACT;AACH,MAAI,cAAJ,IAAI,YAAc,CAAC;AACnB,MAAI,UAAU,YAAY,YAAY,MAAM,EAAE;AAAA,IAC5C,CAAC,iBAAiB,GAAG,KAAK,GAAG,GAAG;AAAA,EAClC,CAAQ;AACV;AAEO,MAAM,kBAAkB,CAC7B,KACA,gBACA,YAAY,UACT;AACH,SAAO,QAAQ,cAAc,EAAE,QAAQ,CAAC,CAAC,KAAK,GAAG,MAAM;AACrD,mBAAe,KAAK,KAAK,KAAK,SAAS;AAAA,EACzC,CAAC;AACH;AAEO,MAAM,mBAAmB;AAAA,EAC9B,GAAG;AAAA,EACH,GAAG;AACL;",
-  "names": []
-}

package/dist/esm/helpers/mergeTransform.js

@@ -1,21 +0,0 @@
-const mergeTransform = (obj, key, val, backwards = false) => {
-  obj.transform ||= [];
-  obj.transform[backwards ? "unshift" : "push"]({
-    [mapTransformKeys[key] || key]: val
-  });
-};
-const mergeTransforms = (obj, flatTransforms, backwards = false) => {
-  Object.entries(flatTransforms).forEach(([key, val]) => {
-    mergeTransform(obj, key, val, backwards);
-  });
-};
-const mapTransformKeys = {
-  x: "translateX",
-  y: "translateY"
-};
-export {
-  mapTransformKeys,
-  mergeTransform,
-  mergeTransforms
-};
-//# sourceMappingURL=mergeTransform.js.map

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

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/helpers/mergeTransform.ts"],
-  "sourcesContent": ["import type { ViewStyle } from 'react-native'\n\nexport type FlatTransforms = Record<string, any>\n\nexport const mergeTransform = (\n  obj: ViewStyle,\n  key: string,\n  val: any,\n  backwards = false\n) => {\n  obj.transform ||= []\n  obj.transform[backwards ? 'unshift' : 'push']({\n    [mapTransformKeys[key] || key]: val,\n  } as any)\n}\n\nexport const mergeTransforms = (\n  obj: ViewStyle,\n  flatTransforms: FlatTransforms,\n  backwards = false\n) => {\n  Object.entries(flatTransforms).forEach(([key, val]) => {\n    mergeTransform(obj, key, val, backwards)\n  })\n}\n\nexport const mapTransformKeys = {\n  x: 'translateX',\n  y: 'translateY',\n}\n"],
-  "mappings": "AAIO,MAAM,iBAAiB,CAC5B,KACA,KACA,KACA,YAAY,UACT;AACH,MAAI,cAAc,CAAC;AACnB,MAAI,UAAU,YAAY,YAAY,MAAM,EAAE;AAAA,IAC5C,CAAC,iBAAiB,GAAG,KAAK,GAAG,GAAG;AAAA,EAClC,CAAQ;AACV;AAEO,MAAM,kBAAkB,CAC7B,KACA,gBACA,YAAY,UACT;AACH,SAAO,QAAQ,cAAc,EAAE,QAAQ,CAAC,CAAC,KAAK,GAAG,MAAM;AACrD,mBAAe,KAAK,KAAK,KAAK,SAAS;AAAA,EACzC,CAAC;AACH;AAEO,MAAM,mBAAmB;AAAA,EAC9B,GAAG;AAAA,EACH,GAAG;AACL;",
-  "names": []
-}

package/dist/esm/helpers/mergeTransform.mjs

@@ -1,21 +0,0 @@
-const mergeTransform = (obj, key, val, backwards = false) => {
-  obj.transform ||= [];
-  obj.transform[backwards ? "unshift" : "push"]({
-    [mapTransformKeys[key] || key]: val
-  });
-};
-const mergeTransforms = (obj, flatTransforms, backwards = false) => {
-  Object.entries(flatTransforms).forEach(([key, val]) => {
-    mergeTransform(obj, key, val, backwards);
-  });
-};
-const mapTransformKeys = {
-  x: "translateX",
-  y: "translateY"
-};
-export {
-  mapTransformKeys,
-  mergeTransform,
-  mergeTransforms
-};
-//# sourceMappingURL=mergeTransform.mjs.map

package/dist/esm/helpers/mergeTransform.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/helpers/mergeTransform.ts"],
-  "sourcesContent": ["import type { ViewStyle } from 'react-native'\n\nexport type FlatTransforms = Record<string, any>\n\nexport const mergeTransform = (\n  obj: ViewStyle,\n  key: string,\n  val: any,\n  backwards = false\n) => {\n  obj.transform ||= []\n  obj.transform[backwards ? 'unshift' : 'push']({\n    [mapTransformKeys[key] || key]: val,\n  } as any)\n}\n\nexport const mergeTransforms = (\n  obj: ViewStyle,\n  flatTransforms: FlatTransforms,\n  backwards = false\n) => {\n  Object.entries(flatTransforms).forEach(([key, val]) => {\n    mergeTransform(obj, key, val, backwards)\n  })\n}\n\nexport const mapTransformKeys = {\n  x: 'translateX',\n  y: 'translateY',\n}\n"],
-  "mappings": "AAIO,MAAM,iBAAiB,CAC5B,KACA,KACA,KACA,YAAY,UACT;AACH,MAAI,cAAc,CAAC;AACnB,MAAI,UAAU,YAAY,YAAY,MAAM,EAAE;AAAA,IAC5C,CAAC,iBAAiB,GAAG,KAAK,GAAG,GAAG;AAAA,EAClC,CAAQ;AACV;AAEO,MAAM,kBAAkB,CAC7B,KACA,gBACA,YAAY,UACT;AACH,SAAO,QAAQ,cAAc,EAAE,QAAQ,CAAC,CAAC,KAAK,GAAG,MAAM;AACrD,mBAAe,KAAK,KAAK,KAAK,SAAS;AAAA,EACzC,CAAC;AACH;AAEO,MAAM,mBAAmB;AAAA,EAC9B,GAAG;AAAA,EACH,GAAG;AACL;",
-  "names": []
-}

package/types/helpers/mergeTransform.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"mergeTransform.d.ts","sourceRoot":"","sources":["../../src/helpers/mergeTransform.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7C,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;AAEhD,eAAO,MAAM,cAAc,QACpB,SAAS,OACT,MAAM,OACN,GAAG,8BAOT,CAAA;AAED,eAAO,MAAM,eAAe,QACrB,SAAS,kBACE,cAAc,8BAM/B,CAAA;AAED,eAAO,MAAM,gBAAgB;;;CAG5B,CAAA"}