@tamagui/helpers-tamagui 1.0.1-beta.92 → 1.0.1-beta.95

package/dist/cjs/index.js

@@ -16,6 +16,5 @@ var src_exports = {};
 module.exports = __toCommonJS(src_exports);
 __reExport(src_exports, require("./useCurrentColor"), module.exports);
 __reExport(src_exports, require("./useGetThemedIcon"), module.exports);
-__reExport(src_exports, require("./wrapStringChildrenInText"), module.exports);
 __reExport(src_exports, require("./types"), module.exports);
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts"],
-  "sourcesContent": ["export * from './useCurrentColor'\nexport * from './useGetThemedIcon'\nexport * from './wrapStringChildrenInText'\nexport * from './types'\n"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,8BAAd;AACA,wBAAc,+BADd;AAEA,wBAAc,uCAFd;AAGA,wBAAc,oBAHd;",
+  "sourcesContent": ["export * from './useCurrentColor'\nexport * from './useGetThemedIcon'\nexport * from './types'\n"],
+  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,8BAAd;AACA,wBAAc,+BADd;AAEA,wBAAc,oBAFd;",
   "names": []
 }

package/dist/cjs/useCurrentColor.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/useCurrentColor.tsx"],
-  "sourcesContent": ["import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'\nimport { TextStyle } from 'react-native'\n\nexport const useCurrentColor = (colorProp: ColorProp) => {\n  const theme = useTheme()\n  // get color from prop or theme\n  let color: any\n  // @ts-expect-error\n  if (theme && colorProp && colorProp in theme) {\n    // @ts-expect-error\n    color = theme[colorProp]\n  } else if (colorProp) {\n    color = colorProp\n  } else {\n    color = theme?.color\n  }\n  return color?.toString() || ('' as string)\n}\n\nexport type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined\n"],
+  "sourcesContent": ["import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'\nimport type { TextStyle } from 'react-native'\n\nexport const useCurrentColor = (colorProp: ColorProp) => {\n  const theme = useTheme()\n  // get color from prop or theme\n  let color: any\n  // @ts-expect-error\n  if (theme && colorProp && colorProp in theme) {\n    // @ts-expect-error\n    color = theme[colorProp]\n  } else if (colorProp) {\n    color = colorProp\n  } else {\n    color = theme?.color\n  }\n  return color?.toString() || ('' as string)\n}\n\nexport type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined\n"],
   "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA0D;AAGnD,MAAM,kBAAkB,CAAC,cAAyB;AACvD,QAAM,QAAQ,0BAAS;AAEvB,MAAI;AAEJ,MAAI,SAAS,aAAa,aAAa,OAAO;AAE5C,YAAQ,MAAM;AAAA,EAChB,WAAW,WAAW;AACpB,YAAQ;AAAA,EACV,OAAO;AACL,YAAQ,+BAAO;AAAA,EACjB;AACA,SAAO,gCAAO,eAAe;AAC/B;",
   "names": []
 }

package/dist/cjs/useGetThemedIcon.js

@@ -45,10 +45,12 @@ var import_useCurrentColor = require("./useCurrentColor");
 const useGetThemedIcon = (props) => {
   const color = (0, import_useCurrentColor.useCurrentColor)(props.color);
   return (el) => {
-    if ((0, import_react.isValidElement)(el)) {
-      return el;
-    }
     if (el) {
+      if ((0, import_react.isValidElement)(el)) {
+        return import_react.default.cloneElement(el, __spreadValues(__spreadProps(__spreadValues({}, props), {
+          color
+        }), el.props));
+      }
       return import_react.default.createElement(el, __spreadProps(__spreadValues({}, props), {
         color
       }));

package/dist/cjs/useGetThemedIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/useGetThemedIcon.tsx"],
-  "sourcesContent": ["import React, { isValidElement } from 'react'\n\nimport { ColorProp, useCurrentColor } from './useCurrentColor'\n\nexport const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {\n  const color = useCurrentColor(props.color)\n  return (el: any) => {\n    if (isValidElement(el)) {\n      return el\n    }\n    if (el) {\n      return React.createElement(el, {\n        ...props,\n        color,\n      })\n    }\n    return el\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsC;AAEtC,6BAA2C;AAEpC,MAAM,mBAAmB,CAAC,UAA8C;AAC7E,QAAM,QAAQ,4CAAgB,MAAM,KAAK;AACzC,SAAO,CAAC,OAAY;AAClB,QAAI,iCAAe,EAAE,GAAG;AACtB,aAAO;AAAA,IACT;AACA,QAAI,IAAI;AACN,aAAO,qBAAM,cAAc,IAAI,iCAC1B,QAD0B;AAAA,QAE7B;AAAA,MACF,EAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT;AACF;",
+  "sourcesContent": ["import React, { isValidElement } from 'react'\n\nimport { ColorProp, useCurrentColor } from './useCurrentColor'\n\nexport const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {\n  const color = useCurrentColor(props.color)\n  return (el: any) => {\n    if (el) {\n      if (isValidElement(el)) {\n        return React.cloneElement(el as any, {\n          ...props,\n          color,\n          // @ts-ignore\n          ...el.props,\n        })\n      }\n      return React.createElement(el, {\n        ...props,\n        color,\n      })\n    }\n    return el\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAsC;AAEtC,6BAA2C;AAEpC,MAAM,mBAAmB,CAAC,UAA8C;AAC7E,QAAM,QAAQ,4CAAgB,MAAM,KAAK;AACzC,SAAO,CAAC,OAAY;AAClB,QAAI,IAAI;AACN,UAAI,iCAAe,EAAE,GAAG;AACtB,eAAO,qBAAM,aAAa,IAAW,gDAChC,QADgC;AAAA,UAEnC;AAAA,YAEG,GAAG,MACP;AAAA,MACH;AACA,aAAO,qBAAM,cAAc,IAAI,iCAC1B,QAD0B;AAAA,QAE7B;AAAA,MACF,EAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT;AACF;",
   "names": []
 }

package/dist/cjs/wrapStringChildrenInText.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/wrapStringChildrenInText.tsx"],
-  "sourcesContent": ["import { SizeTokens } from '@tamagui/core'\nimport React from 'react'\n\nimport { TextParentStyles } from './types'\n\ntype Props = TextParentStyles & {\n  children?: React.ReactNode\n  size?: SizeTokens\n}\n\nexport function wrapStringChildrenInText(\n  TextComponent: any,\n  {\n    children,\n    textProps,\n    size,\n    noTextWrap,\n    color,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    letterSpacing,\n    textAlign,\n  }: Props\n) {\n  if (noTextWrap || !children) {\n    return children\n  }\n\n  // in the case of using variables, like so:\n  // <ListItem>Hello, {name}</ListItem>\n  // it gives us props.children as ['Hello, ', 'name']\n  // but we don't want to wrap multiple SizableText around each part\n  // so we group them\n  let allChildren = React.Children.toArray(children)\n  let nextChildren: any[] = []\n  let lastIsString = false\n  const directTextProps: any = {}\n  // to avoid setting undefined\n  if (color) directTextProps.color = color\n  if (fontFamily) directTextProps.fontFamily = fontFamily\n  if (fontSize) directTextProps.fontSize = fontSize\n  if (fontWeight) directTextProps.fontWeight = fontWeight\n  if (letterSpacing) directTextProps.letterSpacing = letterSpacing\n  if (textAlign) directTextProps.textAlign = textAlign\n\n  function concatStringChildren() {\n    if (!lastIsString) return\n    const index = nextChildren.length - 1\n    const childrenStrings = nextChildren[index]\n    nextChildren[index] = (\n      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>\n        {childrenStrings}\n      </TextComponent>\n    )\n  }\n\n  for (const child of allChildren) {\n    const last = nextChildren[nextChildren.length - 1]\n    const isString = typeof child === 'string'\n    if (isString) {\n      if (lastIsString) {\n        last.push(child)\n      } else {\n        nextChildren.push([child])\n      }\n    } else {\n      concatStringChildren()\n      nextChildren.push(child)\n    }\n    lastIsString = isString\n  }\n  concatStringChildren()\n\n  return nextChildren\n}\n"],
+  "sourcesContent": ["import type { SizeTokens } from '@tamagui/core'\nimport React from 'react'\n\nimport type { TextParentStyles } from './types'\n\ntype Props = TextParentStyles & {\n  children?: React.ReactNode\n  size?: SizeTokens\n}\n\nexport function wrapStringChildrenInText(\n  TextComponent: any,\n  {\n    children,\n    textProps,\n    size,\n    noTextWrap,\n    color,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    letterSpacing,\n    textAlign,\n  }: Props\n) {\n  if (noTextWrap || !children) {\n    return children\n  }\n\n  // in the case of using variables, like so:\n  // <ListItem>Hello, {name}</ListItem>\n  // it gives us props.children as ['Hello, ', 'name']\n  // but we don't want to wrap multiple SizableText around each part\n  // so we group them\n  let allChildren = React.Children.toArray(children)\n  let nextChildren: any[] = []\n  let lastIsString = false\n  const directTextProps: any = {}\n  // to avoid setting undefined\n  if (color) directTextProps.color = color\n  if (fontFamily) directTextProps.fontFamily = fontFamily\n  if (fontSize) directTextProps.fontSize = fontSize\n  if (fontWeight) directTextProps.fontWeight = fontWeight\n  if (letterSpacing) directTextProps.letterSpacing = letterSpacing\n  if (textAlign) directTextProps.textAlign = textAlign\n\n  function concatStringChildren() {\n    if (!lastIsString) return\n    const index = nextChildren.length - 1\n    const childrenStrings = nextChildren[index]\n    nextChildren[index] = (\n      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>\n        {childrenStrings}\n      </TextComponent>\n    )\n  }\n\n  for (const child of allChildren) {\n    const last = nextChildren[nextChildren.length - 1]\n    const isString = typeof child === 'string'\n    if (isString) {\n      if (lastIsString) {\n        last.push(child)\n      } else {\n        nextChildren.push([child])\n      }\n    } else {\n      concatStringChildren()\n      nextChildren.push(child)\n    }\n    lastIsString = isString\n  }\n  concatStringChildren()\n\n  return nextChildren\n}\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AASX,kCACL,eACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GAEF;AACA,MAAI,cAAc,CAAC,UAAU;AAC3B,WAAO;AAAA,EACT;AAOA,MAAI,cAAc,qBAAM,SAAS,QAAQ,QAAQ;AACjD,MAAI,eAAsB,CAAC;AAC3B,MAAI,eAAe;AACnB,QAAM,kBAAuB,CAAC;AAE9B,MAAI;AAAO,oBAAgB,QAAQ;AACnC,MAAI;AAAY,oBAAgB,aAAa;AAC7C,MAAI;AAAU,oBAAgB,WAAW;AACzC,MAAI;AAAY,oBAAgB,aAAa;AAC7C,MAAI;AAAe,oBAAgB,gBAAgB;AACnD,MAAI;AAAW,oBAAgB,YAAY;AAE3C,kCAAgC;AAC9B,QAAI,CAAC;AAAc;AACnB,UAAM,QAAQ,aAAa,SAAS;AACpC,UAAM,kBAAkB,aAAa;AACrC,iBAAa,SACX,mDAAC;AAAA,MAAc,KAAK;AAAA,OAAW,kBAA9B;AAAA,MAA+C;AAAA,QAAgB,YAC7D,eACH;AAAA,EAEJ;AAEA,aAAW,SAAS,aAAa;AAC/B,UAAM,OAAO,aAAa,aAAa,SAAS;AAChD,UAAM,WAAW,OAAO,UAAU;AAClC,QAAI,UAAU;AACZ,UAAI,cAAc;AAChB,aAAK,KAAK,KAAK;AAAA,MACjB,OAAO;AACL,qBAAa,KAAK,CAAC,KAAK,CAAC;AAAA,MAC3B;AAAA,IACF,OAAO;AACL,2BAAqB;AACrB,mBAAa,KAAK,KAAK;AAAA,IACzB;AACA,mBAAe;AAAA,EACjB;AACA,uBAAqB;AAErB,SAAO;AACT;",
   "names": []
 }

package/dist/cjs/wrapStringChildrenInText.test.js

@@ -0,0 +1,31 @@
+var import_vitest = require("vitest");
+var import_wrapStringChildrenInText = require("./wrapStringChildrenInText");
+const Comp = () => {
+};
+const re = /* @__PURE__ */ React.createElement("div", {
+  "data-id": Math.random()
+});
+const reID = re.props["data-id"];
+(0, import_vitest.test)("should wrap all string children, not wrap others", () => {
+  const out = (0, import_wrapStringChildrenInText.wrapStringChildrenInText)(Comp, {
+    children: [re, "a", "b", re, "c", re, "d"]
+  });
+  (0, import_vitest.expect)(out[0].props["data-id"]).toBe(reID);
+  (0, import_vitest.expect)(out[1].type).toBe(Comp);
+  (0, import_vitest.expect)(out[1].props.children).toStrictEqual(["a", "b"]);
+  (0, import_vitest.expect)(out[2].props["data-id"]).toBe(reID);
+  (0, import_vitest.expect)(out[3].type).toBe(Comp);
+  (0, import_vitest.expect)(out[3].props.children).toStrictEqual(["c"]);
+  (0, import_vitest.expect)(out[4].props["data-id"]).toBe(reID);
+  (0, import_vitest.expect)(out[5].type).toBe(Comp);
+  (0, import_vitest.expect)(out[5].props.children).toStrictEqual(["d"]);
+});
+(0, import_vitest.test)("should first child string", () => {
+  const out = (0, import_wrapStringChildrenInText.wrapStringChildrenInText)(Comp, {
+    children: ["a", re]
+  });
+  (0, import_vitest.expect)(out[0].type).toBe(Comp);
+  (0, import_vitest.expect)(out[0].props.children).toStrictEqual(["a"]);
+  (0, import_vitest.expect)(out[1].props["data-id"]).toBe(reID);
+});
+//# sourceMappingURL=wrapStringChildrenInText.test.js.map

package/dist/cjs/wrapStringChildrenInText.test.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/wrapStringChildrenInText.test.tsx"],
+  "sourcesContent": ["import { expect, test } from 'vitest'\n\nimport { wrapStringChildrenInText } from './wrapStringChildrenInText'\n\nconst Comp = () => {}\nconst re = <div data-id={Math.random()} />\nconst reID = re.props['data-id']\n\ntest('should wrap all string children, not wrap others', () => {\n  const out = wrapStringChildrenInText(Comp, {\n    children: [re, 'a', 'b', re, 'c', re, 'd'],\n  }) as any\n\n  expect(out[0].props['data-id']).toBe(reID)\n\n  expect(out[1].type).toBe(Comp)\n  expect(out[1].props.children).toStrictEqual(['a', 'b'])\n\n  expect(out[2].props['data-id']).toBe(reID)\n\n  expect(out[3].type).toBe(Comp)\n  expect(out[3].props.children).toStrictEqual(['c'])\n\n  expect(out[4].props['data-id']).toBe(reID)\n\n  expect(out[5].type).toBe(Comp)\n  expect(out[5].props.children).toStrictEqual(['d'])\n})\n\ntest('should first child string', () => {\n  const out = wrapStringChildrenInText(Comp, {\n    children: ['a', re],\n  }) as any\n\n  expect(out[0].type).toBe(Comp)\n  expect(out[0].props.children).toStrictEqual(['a'])\n\n  expect(out[1].props['data-id']).toBe(reID)\n})\n"],
+  "mappings": "AAAA,oBAA6B;AAE7B,sCAAyC;AAEzC,MAAM,OAAO,MAAM;AAAC;AACpB,MAAM,KAAK,oCAAC;AAAA,EAAI,WAAS,KAAK,OAAO;AAAA,CAAG;AACxC,MAAM,OAAO,GAAG,MAAM;AAEtB,wBAAK,oDAAoD,MAAM;AAC7D,QAAM,MAAM,8DAAyB,MAAM;AAAA,IACzC,UAAU,CAAC,IAAI,KAAK,KAAK,IAAI,KAAK,IAAI,GAAG;AAAA,EAC3C,CAAC;AAED,4BAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,4BAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,4BAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,KAAK,GAAG,CAAC;AAEtD,4BAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,4BAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,4BAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AAEjD,4BAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,4BAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,4BAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AACnD,CAAC;AAED,wBAAK,6BAA6B,MAAM;AACtC,QAAM,MAAM,8DAAyB,MAAM;AAAA,IACzC,UAAU,CAAC,KAAK,EAAE;AAAA,EACpB,CAAC;AAED,4BAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,4BAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AAEjD,4BAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAC3C,CAAC;",
+  "names": []
+}

package/dist/esm/index.js

@@ -1,5 +1,4 @@
 export * from "./useCurrentColor";
 export * from "./useGetThemedIcon";
-export * from "./wrapStringChildrenInText";
 export * from "./types";
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts"],
-  "sourcesContent": ["export * from './useCurrentColor'\nexport * from './useGetThemedIcon'\nexport * from './wrapStringChildrenInText'\nexport * from './types'\n"],
-  "mappings": "AAAA;AACA;AACA;AACA;",
+  "sourcesContent": ["export * from './useCurrentColor'\nexport * from './useGetThemedIcon'\nexport * from './types'\n"],
+  "mappings": "AAAA;AACA;AACA;",
   "names": []
 }

package/dist/esm/useCurrentColor.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/useCurrentColor.tsx"],
-  "sourcesContent": ["import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'\nimport { TextStyle } from 'react-native'\n\nexport const useCurrentColor = (colorProp: ColorProp) => {\n  const theme = useTheme()\n  // get color from prop or theme\n  let color: any\n  // @ts-expect-error\n  if (theme && colorProp && colorProp in theme) {\n    // @ts-expect-error\n    color = theme[colorProp]\n  } else if (colorProp) {\n    color = colorProp\n  } else {\n    color = theme?.color\n  }\n  return color?.toString() || ('' as string)\n}\n\nexport type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined\n"],
+  "sourcesContent": ["import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'\nimport type { TextStyle } from 'react-native'\n\nexport const useCurrentColor = (colorProp: ColorProp) => {\n  const theme = useTheme()\n  // get color from prop or theme\n  let color: any\n  // @ts-expect-error\n  if (theme && colorProp && colorProp in theme) {\n    // @ts-expect-error\n    color = theme[colorProp]\n  } else if (colorProp) {\n    color = colorProp\n  } else {\n    color = theme?.color\n  }\n  return color?.toString() || ('' as string)\n}\n\nexport type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined\n"],
   "mappings": "AAAA;AAGO,MAAM,kBAAkB,CAAC,cAAyB;AACvD,QAAM,QAAQ,SAAS;AAEvB,MAAI;AAEJ,MAAI,SAAS,aAAa,aAAa,OAAO;AAE5C,YAAQ,MAAM;AAAA,EAChB,WAAW,WAAW;AACpB,YAAQ;AAAA,EACV,OAAO;AACL,YAAQ,+BAAO;AAAA,EACjB;AACA,SAAO,gCAAO,eAAe;AAC/B;",
   "names": []
 }

package/dist/esm/useGetThemedIcon.js

@@ -22,10 +22,12 @@ import { useCurrentColor } from "./useCurrentColor";
 const useGetThemedIcon = (props) => {
   const color = useCurrentColor(props.color);
   return (el) => {
-    if (isValidElement(el)) {
-      return el;
-    }
     if (el) {
+      if (isValidElement(el)) {
+        return React.cloneElement(el, __spreadValues(__spreadProps(__spreadValues({}, props), {
+          color
+        }), el.props));
+      }
       return React.createElement(el, __spreadProps(__spreadValues({}, props), {
         color
       }));

package/dist/esm/useGetThemedIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/useGetThemedIcon.tsx"],
-  "sourcesContent": ["import React, { isValidElement } from 'react'\n\nimport { ColorProp, useCurrentColor } from './useCurrentColor'\n\nexport const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {\n  const color = useCurrentColor(props.color)\n  return (el: any) => {\n    if (isValidElement(el)) {\n      return el\n    }\n    if (el) {\n      return React.createElement(el, {\n        ...props,\n        color,\n      })\n    }\n    return el\n  }\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAEA;AAEO,MAAM,mBAAmB,CAAC,UAA8C;AAC7E,QAAM,QAAQ,gBAAgB,MAAM,KAAK;AACzC,SAAO,CAAC,OAAY;AAClB,QAAI,eAAe,EAAE,GAAG;AACtB,aAAO;AAAA,IACT;AACA,QAAI,IAAI;AACN,aAAO,MAAM,cAAc,IAAI,iCAC1B,QAD0B;AAAA,QAE7B;AAAA,MACF,EAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT;AACF;",
+  "sourcesContent": ["import React, { isValidElement } from 'react'\n\nimport { ColorProp, useCurrentColor } from './useCurrentColor'\n\nexport const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {\n  const color = useCurrentColor(props.color)\n  return (el: any) => {\n    if (el) {\n      if (isValidElement(el)) {\n        return React.cloneElement(el as any, {\n          ...props,\n          color,\n          // @ts-ignore\n          ...el.props,\n        })\n      }\n      return React.createElement(el, {\n        ...props,\n        color,\n      })\n    }\n    return el\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAEA;AAEO,MAAM,mBAAmB,CAAC,UAA8C;AAC7E,QAAM,QAAQ,gBAAgB,MAAM,KAAK;AACzC,SAAO,CAAC,OAAY;AAClB,QAAI,IAAI;AACN,UAAI,eAAe,EAAE,GAAG;AACtB,eAAO,MAAM,aAAa,IAAW,gDAChC,QADgC;AAAA,UAEnC;AAAA,YAEG,GAAG,MACP;AAAA,MACH;AACA,aAAO,MAAM,cAAc,IAAI,iCAC1B,QAD0B;AAAA,QAE7B;AAAA,MACF,EAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT;AACF;",
   "names": []
 }

package/dist/esm/wrapStringChildrenInText.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/wrapStringChildrenInText.tsx"],
-  "sourcesContent": ["import { SizeTokens } from '@tamagui/core'\nimport React from 'react'\n\nimport { TextParentStyles } from './types'\n\ntype Props = TextParentStyles & {\n  children?: React.ReactNode\n  size?: SizeTokens\n}\n\nexport function wrapStringChildrenInText(\n  TextComponent: any,\n  {\n    children,\n    textProps,\n    size,\n    noTextWrap,\n    color,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    letterSpacing,\n    textAlign,\n  }: Props\n) {\n  if (noTextWrap || !children) {\n    return children\n  }\n\n  // in the case of using variables, like so:\n  // <ListItem>Hello, {name}</ListItem>\n  // it gives us props.children as ['Hello, ', 'name']\n  // but we don't want to wrap multiple SizableText around each part\n  // so we group them\n  let allChildren = React.Children.toArray(children)\n  let nextChildren: any[] = []\n  let lastIsString = false\n  const directTextProps: any = {}\n  // to avoid setting undefined\n  if (color) directTextProps.color = color\n  if (fontFamily) directTextProps.fontFamily = fontFamily\n  if (fontSize) directTextProps.fontSize = fontSize\n  if (fontWeight) directTextProps.fontWeight = fontWeight\n  if (letterSpacing) directTextProps.letterSpacing = letterSpacing\n  if (textAlign) directTextProps.textAlign = textAlign\n\n  function concatStringChildren() {\n    if (!lastIsString) return\n    const index = nextChildren.length - 1\n    const childrenStrings = nextChildren[index]\n    nextChildren[index] = (\n      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>\n        {childrenStrings}\n      </TextComponent>\n    )\n  }\n\n  for (const child of allChildren) {\n    const last = nextChildren[nextChildren.length - 1]\n    const isString = typeof child === 'string'\n    if (isString) {\n      if (lastIsString) {\n        last.push(child)\n      } else {\n        nextChildren.push([child])\n      }\n    } else {\n      concatStringChildren()\n      nextChildren.push(child)\n    }\n    lastIsString = isString\n  }\n  concatStringChildren()\n\n  return nextChildren\n}\n"],
+  "sourcesContent": ["import type { SizeTokens } from '@tamagui/core'\nimport React from 'react'\n\nimport type { TextParentStyles } from './types'\n\ntype Props = TextParentStyles & {\n  children?: React.ReactNode\n  size?: SizeTokens\n}\n\nexport function wrapStringChildrenInText(\n  TextComponent: any,\n  {\n    children,\n    textProps,\n    size,\n    noTextWrap,\n    color,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    letterSpacing,\n    textAlign,\n  }: Props\n) {\n  if (noTextWrap || !children) {\n    return children\n  }\n\n  // in the case of using variables, like so:\n  // <ListItem>Hello, {name}</ListItem>\n  // it gives us props.children as ['Hello, ', 'name']\n  // but we don't want to wrap multiple SizableText around each part\n  // so we group them\n  let allChildren = React.Children.toArray(children)\n  let nextChildren: any[] = []\n  let lastIsString = false\n  const directTextProps: any = {}\n  // to avoid setting undefined\n  if (color) directTextProps.color = color\n  if (fontFamily) directTextProps.fontFamily = fontFamily\n  if (fontSize) directTextProps.fontSize = fontSize\n  if (fontWeight) directTextProps.fontWeight = fontWeight\n  if (letterSpacing) directTextProps.letterSpacing = letterSpacing\n  if (textAlign) directTextProps.textAlign = textAlign\n\n  function concatStringChildren() {\n    if (!lastIsString) return\n    const index = nextChildren.length - 1\n    const childrenStrings = nextChildren[index]\n    nextChildren[index] = (\n      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>\n        {childrenStrings}\n      </TextComponent>\n    )\n  }\n\n  for (const child of allChildren) {\n    const last = nextChildren[nextChildren.length - 1]\n    const isString = typeof child === 'string'\n    if (isString) {\n      if (lastIsString) {\n        last.push(child)\n      } else {\n        nextChildren.push([child])\n      }\n    } else {\n      concatStringChildren()\n      nextChildren.push(child)\n    }\n    lastIsString = isString\n  }\n  concatStringChildren()\n\n  return nextChildren\n}\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;AACA;AASO,kCACL,eACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GAEF;AACA,MAAI,cAAc,CAAC,UAAU;AAC3B,WAAO;AAAA,EACT;AAOA,MAAI,cAAc,MAAM,SAAS,QAAQ,QAAQ;AACjD,MAAI,eAAsB,CAAC;AAC3B,MAAI,eAAe;AACnB,QAAM,kBAAuB,CAAC;AAE9B,MAAI;AAAO,oBAAgB,QAAQ;AACnC,MAAI;AAAY,oBAAgB,aAAa;AAC7C,MAAI;AAAU,oBAAgB,WAAW;AACzC,MAAI;AAAY,oBAAgB,aAAa;AAC7C,MAAI;AAAe,oBAAgB,gBAAgB;AACnD,MAAI;AAAW,oBAAgB,YAAY;AAE3C,kCAAgC;AAC9B,QAAI,CAAC;AAAc;AACnB,UAAM,QAAQ,aAAa,SAAS;AACpC,UAAM,kBAAkB,aAAa;AACrC,iBAAa,SACX,oCAAC;AAAA,MAAc,KAAK;AAAA,OAAW,kBAA9B;AAAA,MAA+C;AAAA,QAAgB,YAC7D,eACH;AAAA,EAEJ;AAEA,aAAW,SAAS,aAAa;AAC/B,UAAM,OAAO,aAAa,aAAa,SAAS;AAChD,UAAM,WAAW,OAAO,UAAU;AAClC,QAAI,UAAU;AACZ,UAAI,cAAc;AAChB,aAAK,KAAK,KAAK;AAAA,MACjB,OAAO;AACL,qBAAa,KAAK,CAAC,KAAK,CAAC;AAAA,MAC3B;AAAA,IACF,OAAO;AACL,2BAAqB;AACrB,mBAAa,KAAK,KAAK;AAAA,IACzB;AACA,mBAAe;AAAA,EACjB;AACA,uBAAqB;AAErB,SAAO;AACT;",
   "names": []
 }

package/dist/esm/wrapStringChildrenInText.test.js

@@ -0,0 +1,31 @@
+import { expect, test } from "vitest";
+import { wrapStringChildrenInText } from "./wrapStringChildrenInText";
+const Comp = () => {
+};
+const re = /* @__PURE__ */ React.createElement("div", {
+  "data-id": Math.random()
+});
+const reID = re.props["data-id"];
+test("should wrap all string children, not wrap others", () => {
+  const out = wrapStringChildrenInText(Comp, {
+    children: [re, "a", "b", re, "c", re, "d"]
+  });
+  expect(out[0].props["data-id"]).toBe(reID);
+  expect(out[1].type).toBe(Comp);
+  expect(out[1].props.children).toStrictEqual(["a", "b"]);
+  expect(out[2].props["data-id"]).toBe(reID);
+  expect(out[3].type).toBe(Comp);
+  expect(out[3].props.children).toStrictEqual(["c"]);
+  expect(out[4].props["data-id"]).toBe(reID);
+  expect(out[5].type).toBe(Comp);
+  expect(out[5].props.children).toStrictEqual(["d"]);
+});
+test("should first child string", () => {
+  const out = wrapStringChildrenInText(Comp, {
+    children: ["a", re]
+  });
+  expect(out[0].type).toBe(Comp);
+  expect(out[0].props.children).toStrictEqual(["a"]);
+  expect(out[1].props["data-id"]).toBe(reID);
+});
+//# sourceMappingURL=wrapStringChildrenInText.test.js.map

package/dist/esm/wrapStringChildrenInText.test.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/wrapStringChildrenInText.test.tsx"],
+  "sourcesContent": ["import { expect, test } from 'vitest'\n\nimport { wrapStringChildrenInText } from './wrapStringChildrenInText'\n\nconst Comp = () => {}\nconst re = <div data-id={Math.random()} />\nconst reID = re.props['data-id']\n\ntest('should wrap all string children, not wrap others', () => {\n  const out = wrapStringChildrenInText(Comp, {\n    children: [re, 'a', 'b', re, 'c', re, 'd'],\n  }) as any\n\n  expect(out[0].props['data-id']).toBe(reID)\n\n  expect(out[1].type).toBe(Comp)\n  expect(out[1].props.children).toStrictEqual(['a', 'b'])\n\n  expect(out[2].props['data-id']).toBe(reID)\n\n  expect(out[3].type).toBe(Comp)\n  expect(out[3].props.children).toStrictEqual(['c'])\n\n  expect(out[4].props['data-id']).toBe(reID)\n\n  expect(out[5].type).toBe(Comp)\n  expect(out[5].props.children).toStrictEqual(['d'])\n})\n\ntest('should first child string', () => {\n  const out = wrapStringChildrenInText(Comp, {\n    children: ['a', re],\n  }) as any\n\n  expect(out[0].type).toBe(Comp)\n  expect(out[0].props.children).toStrictEqual(['a'])\n\n  expect(out[1].props['data-id']).toBe(reID)\n})\n"],
+  "mappings": "AAAA;AAEA;AAEA,MAAM,OAAO,MAAM;AAAC;AACpB,MAAM,KAAK,oCAAC;AAAA,EAAI,WAAS,KAAK,OAAO;AAAA,CAAG;AACxC,MAAM,OAAO,GAAG,MAAM;AAEtB,KAAK,oDAAoD,MAAM;AAC7D,QAAM,MAAM,yBAAyB,MAAM;AAAA,IACzC,UAAU,CAAC,IAAI,KAAK,KAAK,IAAI,KAAK,IAAI,GAAG;AAAA,EAC3C,CAAC;AAED,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,KAAK,GAAG,CAAC;AAEtD,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AAEjD,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AACnD,CAAC;AAED,KAAK,6BAA6B,MAAM;AACtC,QAAM,MAAM,yBAAyB,MAAM;AAAA,IACzC,UAAU,CAAC,KAAK,EAAE;AAAA,EACpB,CAAC;AAED,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AAEjD,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAC3C,CAAC;",
+  "names": []
+}

package/dist/jsx/index.js

@@ -1,5 +1,4 @@
 export * from "./useCurrentColor";
 export * from "./useGetThemedIcon";
-export * from "./wrapStringChildrenInText";
 export * from "./types";
 //# sourceMappingURL=index.js.map

package/dist/jsx/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.ts"],
-  "sourcesContent": ["export * from './useCurrentColor'\nexport * from './useGetThemedIcon'\nexport * from './wrapStringChildrenInText'\nexport * from './types'\n"],
-  "mappings": "AAAA;AACA;AACA;AACA;",
+  "sourcesContent": ["export * from './useCurrentColor'\nexport * from './useGetThemedIcon'\nexport * from './types'\n"],
+  "mappings": "AAAA;AACA;AACA;",
   "names": []
 }

package/dist/jsx/useCurrentColor.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/useCurrentColor.tsx"],
-  "sourcesContent": ["import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'\nimport { TextStyle } from 'react-native'\n\nexport const useCurrentColor = (colorProp: ColorProp) => {\n  const theme = useTheme()\n  // get color from prop or theme\n  let color: any\n  // @ts-expect-error\n  if (theme && colorProp && colorProp in theme) {\n    // @ts-expect-error\n    color = theme[colorProp]\n  } else if (colorProp) {\n    color = colorProp\n  } else {\n    color = theme?.color\n  }\n  return color?.toString() || ('' as string)\n}\n\nexport type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined\n"],
+  "sourcesContent": ["import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'\nimport type { TextStyle } from 'react-native'\n\nexport const useCurrentColor = (colorProp: ColorProp) => {\n  const theme = useTheme()\n  // get color from prop or theme\n  let color: any\n  // @ts-expect-error\n  if (theme && colorProp && colorProp in theme) {\n    // @ts-expect-error\n    color = theme[colorProp]\n  } else if (colorProp) {\n    color = colorProp\n  } else {\n    color = theme?.color\n  }\n  return color?.toString() || ('' as string)\n}\n\nexport type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined\n"],
   "mappings": "AAAA;AAGO,MAAM,kBAAkB,CAAC,cAAyB;AACvD,QAAM,QAAQ,SAAS;AAEvB,MAAI;AAEJ,MAAI,SAAS,aAAa,aAAa,OAAO;AAE5C,YAAQ,MAAM;AAAA,EAChB,WAAW,WAAW;AACpB,YAAQ;AAAA,EACV,OAAO;AACL,YAAQ,+BAAO;AAAA,EACjB;AACA,SAAO,gCAAO,eAAe;AAC/B;",
   "names": []
 }

package/dist/jsx/useGetThemedIcon.js

@@ -3,10 +3,14 @@ import { useCurrentColor } from "./useCurrentColor";
 const useGetThemedIcon = (props) => {
   const color = useCurrentColor(props.color);
   return (el) => {
-    if (isValidElement(el)) {
-      return el;
-    }
     if (el) {
+      if (isValidElement(el)) {
+        return React.cloneElement(el, {
+          ...props,
+          color,
+          ...el.props
+        });
+      }
       return React.createElement(el, {
         ...props,
         color

package/dist/jsx/useGetThemedIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/useGetThemedIcon.tsx"],
-  "sourcesContent": ["import React, { isValidElement } from 'react'\n\nimport { ColorProp, useCurrentColor } from './useCurrentColor'\n\nexport const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {\n  const color = useCurrentColor(props.color)\n  return (el: any) => {\n    if (isValidElement(el)) {\n      return el\n    }\n    if (el) {\n      return React.createElement(el, {\n        ...props,\n        color,\n      })\n    }\n    return el\n  }\n}\n"],
-  "mappings": "AAAA;AAEA;AAEO,MAAM,mBAAmB,CAAC,UAA8C;AAC7E,QAAM,QAAQ,gBAAgB,MAAM,KAAK;AACzC,SAAO,CAAC,OAAY;AAClB,QAAI,eAAe,EAAE,GAAG;AACtB,aAAO;AAAA,IACT;AACA,QAAI,IAAI;AACN,aAAO,MAAM,cAAc,IAAI;AAAA,QAC7B,GAAG;AAAA,QACH;AAAA,MACF,CAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT;AACF;",
+  "sourcesContent": ["import React, { isValidElement } from 'react'\n\nimport { ColorProp, useCurrentColor } from './useCurrentColor'\n\nexport const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {\n  const color = useCurrentColor(props.color)\n  return (el: any) => {\n    if (el) {\n      if (isValidElement(el)) {\n        return React.cloneElement(el as any, {\n          ...props,\n          color,\n          // @ts-ignore\n          ...el.props,\n        })\n      }\n      return React.createElement(el, {\n        ...props,\n        color,\n      })\n    }\n    return el\n  }\n}\n"],
+  "mappings": "AAAA;AAEA;AAEO,MAAM,mBAAmB,CAAC,UAA8C;AAC7E,QAAM,QAAQ,gBAAgB,MAAM,KAAK;AACzC,SAAO,CAAC,OAAY;AAClB,QAAI,IAAI;AACN,UAAI,eAAe,EAAE,GAAG;AACtB,eAAO,MAAM,aAAa,IAAW;AAAA,UACnC,GAAG;AAAA,UACH;AAAA,UAEA,GAAG,GAAG;AAAA,QACR,CAAC;AAAA,MACH;AACA,aAAO,MAAM,cAAc,IAAI;AAAA,QAC7B,GAAG;AAAA,QACH;AAAA,MACF,CAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT;AACF;",
   "names": []
 }

package/dist/jsx/wrapStringChildrenInText.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/wrapStringChildrenInText.tsx"],
-  "sourcesContent": ["import { SizeTokens } from '@tamagui/core'\nimport React from 'react'\n\nimport { TextParentStyles } from './types'\n\ntype Props = TextParentStyles & {\n  children?: React.ReactNode\n  size?: SizeTokens\n}\n\nexport function wrapStringChildrenInText(\n  TextComponent: any,\n  {\n    children,\n    textProps,\n    size,\n    noTextWrap,\n    color,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    letterSpacing,\n    textAlign,\n  }: Props\n) {\n  if (noTextWrap || !children) {\n    return children\n  }\n\n  // in the case of using variables, like so:\n  // <ListItem>Hello, {name}</ListItem>\n  // it gives us props.children as ['Hello, ', 'name']\n  // but we don't want to wrap multiple SizableText around each part\n  // so we group them\n  let allChildren = React.Children.toArray(children)\n  let nextChildren: any[] = []\n  let lastIsString = false\n  const directTextProps: any = {}\n  // to avoid setting undefined\n  if (color) directTextProps.color = color\n  if (fontFamily) directTextProps.fontFamily = fontFamily\n  if (fontSize) directTextProps.fontSize = fontSize\n  if (fontWeight) directTextProps.fontWeight = fontWeight\n  if (letterSpacing) directTextProps.letterSpacing = letterSpacing\n  if (textAlign) directTextProps.textAlign = textAlign\n\n  function concatStringChildren() {\n    if (!lastIsString) return\n    const index = nextChildren.length - 1\n    const childrenStrings = nextChildren[index]\n    nextChildren[index] = (\n      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>\n        {childrenStrings}\n      </TextComponent>\n    )\n  }\n\n  for (const child of allChildren) {\n    const last = nextChildren[nextChildren.length - 1]\n    const isString = typeof child === 'string'\n    if (isString) {\n      if (lastIsString) {\n        last.push(child)\n      } else {\n        nextChildren.push([child])\n      }\n    } else {\n      concatStringChildren()\n      nextChildren.push(child)\n    }\n    lastIsString = isString\n  }\n  concatStringChildren()\n\n  return nextChildren\n}\n"],
+  "sourcesContent": ["import type { SizeTokens } from '@tamagui/core'\nimport React from 'react'\n\nimport type { TextParentStyles } from './types'\n\ntype Props = TextParentStyles & {\n  children?: React.ReactNode\n  size?: SizeTokens\n}\n\nexport function wrapStringChildrenInText(\n  TextComponent: any,\n  {\n    children,\n    textProps,\n    size,\n    noTextWrap,\n    color,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    letterSpacing,\n    textAlign,\n  }: Props\n) {\n  if (noTextWrap || !children) {\n    return children\n  }\n\n  // in the case of using variables, like so:\n  // <ListItem>Hello, {name}</ListItem>\n  // it gives us props.children as ['Hello, ', 'name']\n  // but we don't want to wrap multiple SizableText around each part\n  // so we group them\n  let allChildren = React.Children.toArray(children)\n  let nextChildren: any[] = []\n  let lastIsString = false\n  const directTextProps: any = {}\n  // to avoid setting undefined\n  if (color) directTextProps.color = color\n  if (fontFamily) directTextProps.fontFamily = fontFamily\n  if (fontSize) directTextProps.fontSize = fontSize\n  if (fontWeight) directTextProps.fontWeight = fontWeight\n  if (letterSpacing) directTextProps.letterSpacing = letterSpacing\n  if (textAlign) directTextProps.textAlign = textAlign\n\n  function concatStringChildren() {\n    if (!lastIsString) return\n    const index = nextChildren.length - 1\n    const childrenStrings = nextChildren[index]\n    nextChildren[index] = (\n      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>\n        {childrenStrings}\n      </TextComponent>\n    )\n  }\n\n  for (const child of allChildren) {\n    const last = nextChildren[nextChildren.length - 1]\n    const isString = typeof child === 'string'\n    if (isString) {\n      if (lastIsString) {\n        last.push(child)\n      } else {\n        nextChildren.push([child])\n      }\n    } else {\n      concatStringChildren()\n      nextChildren.push(child)\n    }\n    lastIsString = isString\n  }\n  concatStringChildren()\n\n  return nextChildren\n}\n"],
   "mappings": "AACA;AASO,kCACL,eACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GAEF;AACA,MAAI,cAAc,CAAC,UAAU;AAC3B,WAAO;AAAA,EACT;AAOA,MAAI,cAAc,MAAM,SAAS,QAAQ,QAAQ;AACjD,MAAI,eAAsB,CAAC;AAC3B,MAAI,eAAe;AACnB,QAAM,kBAAuB,CAAC;AAE9B,MAAI;AAAO,oBAAgB,QAAQ;AACnC,MAAI;AAAY,oBAAgB,aAAa;AAC7C,MAAI;AAAU,oBAAgB,WAAW;AACzC,MAAI;AAAY,oBAAgB,aAAa;AAC7C,MAAI;AAAe,oBAAgB,gBAAgB;AACnD,MAAI;AAAW,oBAAgB,YAAY;AAE3C,kCAAgC;AAC9B,QAAI,CAAC;AAAc;AACnB,UAAM,QAAQ,aAAa,SAAS;AACpC,UAAM,kBAAkB,aAAa;AACrC,iBAAa,SACX,CAAC,cAAc,KAAK,WAAW,iBAAiB,MAAM,UAAU,YAC7D,gBACH,EAFC;AAAA,EAIL;AAEA,aAAW,SAAS,aAAa;AAC/B,UAAM,OAAO,aAAa,aAAa,SAAS;AAChD,UAAM,WAAW,OAAO,UAAU;AAClC,QAAI,UAAU;AACZ,UAAI,cAAc;AAChB,aAAK,KAAK,KAAK;AAAA,MACjB,OAAO;AACL,qBAAa,KAAK,CAAC,KAAK,CAAC;AAAA,MAC3B;AAAA,IACF,OAAO;AACL,2BAAqB;AACrB,mBAAa,KAAK,KAAK;AAAA,IACzB;AACA,mBAAe;AAAA,EACjB;AACA,uBAAqB;AAErB,SAAO;AACT;",
   "names": []
 }

package/dist/jsx/wrapStringChildrenInText.test.js

@@ -0,0 +1,29 @@
+import { expect, test } from "vitest";
+import { wrapStringChildrenInText } from "./wrapStringChildrenInText";
+const Comp = () => {
+};
+const re = <div data-id={Math.random()} />;
+const reID = re.props["data-id"];
+test("should wrap all string children, not wrap others", () => {
+  const out = wrapStringChildrenInText(Comp, {
+    children: [re, "a", "b", re, "c", re, "d"]
+  });
+  expect(out[0].props["data-id"]).toBe(reID);
+  expect(out[1].type).toBe(Comp);
+  expect(out[1].props.children).toStrictEqual(["a", "b"]);
+  expect(out[2].props["data-id"]).toBe(reID);
+  expect(out[3].type).toBe(Comp);
+  expect(out[3].props.children).toStrictEqual(["c"]);
+  expect(out[4].props["data-id"]).toBe(reID);
+  expect(out[5].type).toBe(Comp);
+  expect(out[5].props.children).toStrictEqual(["d"]);
+});
+test("should first child string", () => {
+  const out = wrapStringChildrenInText(Comp, {
+    children: ["a", re]
+  });
+  expect(out[0].type).toBe(Comp);
+  expect(out[0].props.children).toStrictEqual(["a"]);
+  expect(out[1].props["data-id"]).toBe(reID);
+});
+//# sourceMappingURL=wrapStringChildrenInText.test.js.map

package/dist/jsx/wrapStringChildrenInText.test.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/wrapStringChildrenInText.test.tsx"],
+  "sourcesContent": ["import { expect, test } from 'vitest'\n\nimport { wrapStringChildrenInText } from './wrapStringChildrenInText'\n\nconst Comp = () => {}\nconst re = <div data-id={Math.random()} />\nconst reID = re.props['data-id']\n\ntest('should wrap all string children, not wrap others', () => {\n  const out = wrapStringChildrenInText(Comp, {\n    children: [re, 'a', 'b', re, 'c', re, 'd'],\n  }) as any\n\n  expect(out[0].props['data-id']).toBe(reID)\n\n  expect(out[1].type).toBe(Comp)\n  expect(out[1].props.children).toStrictEqual(['a', 'b'])\n\n  expect(out[2].props['data-id']).toBe(reID)\n\n  expect(out[3].type).toBe(Comp)\n  expect(out[3].props.children).toStrictEqual(['c'])\n\n  expect(out[4].props['data-id']).toBe(reID)\n\n  expect(out[5].type).toBe(Comp)\n  expect(out[5].props.children).toStrictEqual(['d'])\n})\n\ntest('should first child string', () => {\n  const out = wrapStringChildrenInText(Comp, {\n    children: ['a', re],\n  }) as any\n\n  expect(out[0].type).toBe(Comp)\n  expect(out[0].props.children).toStrictEqual(['a'])\n\n  expect(out[1].props['data-id']).toBe(reID)\n})\n"],
+  "mappings": "AAAA;AAEA;AAEA,MAAM,OAAO,MAAM;AAAC;AACpB,MAAM,KAAK,CAAC,IAAI,SAAS,KAAK,OAAO,GAAG;AACxC,MAAM,OAAO,GAAG,MAAM;AAEtB,KAAK,oDAAoD,MAAM;AAC7D,QAAM,MAAM,yBAAyB,MAAM;AAAA,IACzC,UAAU,CAAC,IAAI,KAAK,KAAK,IAAI,KAAK,IAAI,GAAG;AAAA,EAC3C,CAAC;AAED,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,KAAK,GAAG,CAAC;AAEtD,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AAEjD,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAEzC,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AACnD,CAAC;AAED,KAAK,6BAA6B,MAAM;AACtC,QAAM,MAAM,yBAAyB,MAAM;AAAA,IACzC,UAAU,CAAC,KAAK,EAAE;AAAA,EACpB,CAAC;AAED,SAAO,IAAI,GAAG,IAAI,EAAE,KAAK,IAAI;AAC7B,SAAO,IAAI,GAAG,MAAM,QAAQ,EAAE,cAAc,CAAC,GAAG,CAAC;AAEjD,SAAO,IAAI,GAAG,MAAM,UAAU,EAAE,KAAK,IAAI;AAC3C,CAAC;",
+  "names": []
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/helpers-tamagui",
-  "version": "1.0.1-beta.92",
+  "version": "1.0.1-beta.95",
   "source": "src/index.ts",
   "types": "./types/index.d.ts",
   "main": "dist/cjs",
@@ -15,15 +15,18 @@
     "build": "tamagui-build",
     "watch": "tamagui-build --watch",
     "clean": "tamagui-build clean",
-    "clean:build": "tamagui-build clean:build"
+    "clean:build": "tamagui-build clean:build",
+    "test": "vitest --config ../vite-plugin-internal/vite.config.ts"
   },
   "dependencies": {
-    "@tamagui/text": "^1.0.1-beta.92"
+    "@tamagui/core": "^1.0.1-beta.95"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.92",
+    "@tamagui/build": "^1.0.1-beta.95",
+    "@tamagui/vite-plugin-internal": "^1.0.1-beta.95",
     "react": "*",
-    "react-native": "*"
+    "react-native": "*",
+    "vitest": "^0.16.0"
   },
   "peerDependencies": {
     "react": "*",

package/src/index.ts

@@ -1,4 +1,3 @@
 export * from './useCurrentColor'
 export * from './useGetThemedIcon'
-export * from './wrapStringChildrenInText'
 export * from './types'

package/src/useCurrentColor.tsx

@@ -1,5 +1,5 @@
 import { ColorTokens, ThemeValueFallback, useTheme } from '@tamagui/core'
-import { TextStyle } from 'react-native'
+import type { TextStyle } from 'react-native'
 
 export const useCurrentColor = (colorProp: ColorProp) => {
   const theme = useTheme()

package/src/useGetThemedIcon.tsx

@@ -5,10 +5,15 @@ import { ColorProp, useCurrentColor } from './useCurrentColor'
 export const useGetThemedIcon = (props: { color: ColorProp; size: number }) => {
   const color = useCurrentColor(props.color)
   return (el: any) => {
-    if (isValidElement(el)) {
-      return el
-    }
     if (el) {
+      if (isValidElement(el)) {
+        return React.cloneElement(el as any, {
+          ...props,
+          color,
+          // @ts-ignore
+          ...el.props,
+        })
+      }
       return React.createElement(el, {
         ...props,
         color,

package/types/index.d.ts

@@ -1,5 +1,4 @@
 export * from './useCurrentColor';
 export * from './useGetThemedIcon';
-export * from './wrapStringChildrenInText';
 export * from './types';
 //# sourceMappingURL=index.d.ts.map

package/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,oBAAoB,CAAA;AAClC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAA;AACjC,cAAc,oBAAoB,CAAA;AAClC,cAAc,SAAS,CAAA"}

package/types/useCurrentColor.d.ts

@@ -1,5 +1,5 @@
 import { ColorTokens, ThemeValueFallback } from '@tamagui/core';
-import { TextStyle } from 'react-native';
+import type { TextStyle } from 'react-native';
 export declare const useCurrentColor: (colorProp: ColorProp) => any;
 export declare type ColorProp = ThemeValueFallback | ColorTokens | TextStyle['color'] | undefined;
 //# sourceMappingURL=useCurrentColor.d.ts.map

package/types/useCurrentColor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCurrentColor.d.ts","sourceRoot":"","sources":["../src/useCurrentColor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAY,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,eAAO,MAAM,eAAe,cAAe,SAAS,QAcnD,CAAA;AAED,oBAAY,SAAS,GAAG,kBAAkB,GAAG,WAAW,GAAG,SAAS,CAAC,OAAO,CAAC,GAAG,SAAS,CAAA"}
+{"version":3,"file":"useCurrentColor.d.ts","sourceRoot":"","sources":["../src/useCurrentColor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAY,MAAM,eAAe,CAAA;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7C,eAAO,MAAM,eAAe,cAAe,SAAS,QAcnD,CAAA;AAED,oBAAY,SAAS,GAAG,kBAAkB,GAAG,WAAW,GAAG,SAAS,CAAC,OAAO,CAAC,GAAG,SAAS,CAAA"}

package/types/useGetThemedIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGetThemedIcon.d.ts","sourceRoot":"","sources":["../src/useGetThemedIcon.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAmB,MAAM,mBAAmB,CAAA;AAE9D,eAAO,MAAM,gBAAgB,UAAW;IAAE,KAAK,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,UAE5D,GAAG,QAYhB,CAAA"}
+{"version":3,"file":"useGetThemedIcon.d.ts","sourceRoot":"","sources":["../src/useGetThemedIcon.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAmB,MAAM,mBAAmB,CAAA;AAE9D,eAAO,MAAM,gBAAgB,UAAW;IAAE,KAAK,EAAE,SAAS,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,UAE5D,GAAG,QAiBhB,CAAA"}

package/types/wrapStringChildrenInText.d.ts

@@ -1,6 +1,6 @@
-import { SizeTokens } from '@tamagui/core';
+import type { SizeTokens } from '@tamagui/core';
 import React from 'react';
-import { TextParentStyles } from './types';
+import type { TextParentStyles } from './types';
 declare type Props = TextParentStyles & {
     children?: React.ReactNode;
     size?: SizeTokens;

package/types/wrapStringChildrenInText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wrapStringChildrenInText.d.ts","sourceRoot":"","sources":["../src/wrapStringChildrenInText.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE1C,aAAK,KAAK,GAAG,gBAAgB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB,CAAA;AAED,wBAAgB,wBAAwB,CACtC,aAAa,EAAE,GAAG,EAClB,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,UAAU,EACV,KAAK,EACL,UAAU,EACV,QAAQ,EACR,UAAU,EACV,aAAa,EACb,SAAS,GACV,EAAE,KAAK,mJAoDT"}
+{"version":3,"file":"wrapStringChildrenInText.d.ts","sourceRoot":"","sources":["../src/wrapStringChildrenInText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE/C,aAAK,KAAK,GAAG,gBAAgB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,UAAU,CAAA;CAClB,CAAA;AAED,wBAAgB,wBAAwB,CACtC,aAAa,EAAE,GAAG,EAClB,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,UAAU,EACV,KAAK,EACL,UAAU,EACV,QAAQ,EACR,UAAU,EACV,aAAa,EACb,SAAS,GACV,EAAE,KAAK,mJAoDT"}

package/types/wrapStringChildrenInText.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=wrapStringChildrenInText.test.d.ts.map

package/types/wrapStringChildrenInText.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wrapStringChildrenInText.test.d.ts","sourceRoot":"","sources":["../src/wrapStringChildrenInText.test.tsx"],"names":[],"mappings":""}

package/src/wrapStringChildrenInText.tsx

@@ -1,76 +0,0 @@
-import { SizeTokens } from '@tamagui/core'
-import React from 'react'
-
-import { TextParentStyles } from './types'
-
-type Props = TextParentStyles & {
-  children?: React.ReactNode
-  size?: SizeTokens
-}
-
-export function wrapStringChildrenInText(
-  TextComponent: any,
-  {
-    children,
-    textProps,
-    size,
-    noTextWrap,
-    color,
-    fontFamily,
-    fontSize,
-    fontWeight,
-    letterSpacing,
-    textAlign,
-  }: Props
-) {
-  if (noTextWrap || !children) {
-    return children
-  }
-
-  // in the case of using variables, like so:
-  // <ListItem>Hello, {name}</ListItem>
-  // it gives us props.children as ['Hello, ', 'name']
-  // but we don't want to wrap multiple SizableText around each part
-  // so we group them
-  let allChildren = React.Children.toArray(children)
-  let nextChildren: any[] = []
-  let lastIsString = false
-  const directTextProps: any = {}
-  // to avoid setting undefined
-  if (color) directTextProps.color = color
-  if (fontFamily) directTextProps.fontFamily = fontFamily
-  if (fontSize) directTextProps.fontSize = fontSize
-  if (fontWeight) directTextProps.fontWeight = fontWeight
-  if (letterSpacing) directTextProps.letterSpacing = letterSpacing
-  if (textAlign) directTextProps.textAlign = textAlign
-
-  function concatStringChildren() {
-    if (!lastIsString) return
-    const index = nextChildren.length - 1
-    const childrenStrings = nextChildren[index]
-    nextChildren[index] = (
-      <TextComponent key={index} {...directTextProps} size={size} {...textProps}>
-        {childrenStrings}
-      </TextComponent>
-    )
-  }
-
-  for (const child of allChildren) {
-    const last = nextChildren[nextChildren.length - 1]
-    const isString = typeof child === 'string'
-    if (isString) {
-      if (lastIsString) {
-        last.push(child)
-      } else {
-        nextChildren.push([child])
-      }
-    } else {
-      concatStringChildren()
-      nextChildren.push(child)
-    }
-    lastIsString = isString
-  }
-  concatStringChildren()
-
-  return nextChildren
-}