@tamagui/demos 1.15.7 → 1.15.8

package/dist/cjs/LucideIconsDemo.js

@@ -45,28 +45,26 @@ function LucideIconsDemo() {
   const [searchRaw, setSearch] = (0, import_react.useState)("");
   const search = (0, import_tamagui.useDebounceValue)(searchRaw, 400);
   const size = 100;
-  const iconsMemo = (0, import_react.useMemo)(() => {
-    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
-    return icons.slice(0, 835).map(({ Icon, name }) => {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { h: size + 20, ai: "center", jc: "center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { size: size * 0.25 }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Spacer, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          import_tamagui.Paragraph,
-          {
-            h: "$6",
-            ww: "break-word",
-            maw: "100%",
-            ta: "center",
-            px: "$2",
-            size: "$1",
-            o: 0.5,
-            children: name
-          }
-        )
-      ] }, name);
-    });
-  }, [search]);
+  const iconsMemo = (0, import_react.useMemo)(
+    () => lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase())).map(({ Icon, name }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { h: size + 20, ai: "center", jc: "center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { size: size * 0.25 }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Spacer, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_tamagui.Paragraph,
+        {
+          h: "$6",
+          ww: "break-word",
+          maw: "100%",
+          ta: "center",
+          px: "$2",
+          size: "$1",
+          o: 0.5,
+          children: name
+        }
+      )
+    ] }, name)),
+    [search]
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { miw: "100%", padding: "$4", paddingBottom: "$0", space: true, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Input, { value: searchRaw, onChangeText: setSearch, placeholder: "Search..." }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { height: 420, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ScrollView, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Grid, { itemMinWidth: size, children: iconsMemo }) }) })

package/dist/cjs/LucideIconsDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/LucideIconsDemo.tsx"],
-  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(() => {\n    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n    return icons.slice(0, 835).map(({ Icon, name }) => {\n      return (\n        <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n          <Icon size={size * 0.25} />\n          <Spacer />\n          <Paragraph\n            h=\"$6\"\n            ww=\"break-word\"\n            maw=\"100%\"\n            ta=\"center\"\n            px=\"$2\"\n            size=\"$1\"\n            o={0.5}\n          >\n            {name}\n          </Paragraph>\n        </YStack>\n      )\n    })\n  }, [search])\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBQ;AArBR,kBAA6B;AAC7B,mBAAkC;AAClC,0BAA2B;AAC3B,qBAAyE;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,QAAI,uBAAS,EAAE;AAC1C,QAAM,aAAS,iCAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,UAAM,QAAQ,YAAY,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC;AAC9E,WAAO,MAAM,MAAM,GAAG,GAAG,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,MAAM;AACjD,aACE,6CAAC,yBAAO,GAAG,OAAO,IAAI,IAAG,UAAS,IAAG,UACnC;AAAA,oDAAC,QAAK,MAAM,OAAO,MAAM;AAAA,QACzB,4CAAC,yBAAO;AAAA,QACR;AAAA,UAAC;AAAA;AAAA,YACC,GAAE;AAAA,YACF,IAAG;AAAA,YACH,KAAI;AAAA,YACJ,IAAG;AAAA,YACH,IAAG;AAAA,YACH,MAAK;AAAA,YACL,GAAG;AAAA,YAEF;AAAA;AAAA,QACH;AAAA,WAbiD,IAcnD;AAAA,IAEJ,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,SACE,6CAAC,yBAAO,KAAI,QAAO,SAAQ,MAAK,eAAc,MAAK,OAAK,MACtD;AAAA,gDAAC,wBAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,4CAAC,yBAAO,QAAQ,KACd,sDAAC,kCACC,sDAAC,uBAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(\n    () =>\n      lucideIcons\n        .filter((x) => x.key.startsWith(search.toLowerCase()))\n        .map(({ Icon, name }) => (\n          <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n            <Icon size={size * 0.25} />\n            <Spacer />\n            <Paragraph\n              h=\"$6\"\n              ww=\"break-word\"\n              maw=\"100%\"\n              ta=\"center\"\n              px=\"$2\"\n              size=\"$1\"\n              o={0.5}\n            >\n              {name}\n            </Paragraph>\n          </YStack>\n        )),\n    [search]\n  )\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBU;AAtBV,kBAA6B;AAC7B,mBAAkC;AAClC,0BAA2B;AAC3B,qBAAyE;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,QAAI,uBAAS,EAAE;AAC1C,QAAM,aAAS,iCAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,gBAAY;AAAA,IAChB,MACE,YACG,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC,EACpD,IAAI,CAAC,EAAE,MAAM,KAAK,MACjB,6CAAC,yBAAO,GAAG,OAAO,IAAI,IAAG,UAAS,IAAG,UACnC;AAAA,kDAAC,QAAK,MAAM,OAAO,MAAM;AAAA,MACzB,4CAAC,yBAAO;AAAA,MACR;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,IAAG;AAAA,UACH,KAAI;AAAA,UACJ,IAAG;AAAA,UACH,IAAG;AAAA,UACH,MAAK;AAAA,UACL,GAAG;AAAA,UAEF;AAAA;AAAA,MACH;AAAA,SAbiD,IAcnD,CACD;AAAA,IACL,CAAC,MAAM;AAAA,EACT;AAEA,SACE,6CAAC,yBAAO,KAAI,QAAO,SAAQ,MAAK,eAAc,MAAK,OAAK,MACtD;AAAA,gDAAC,wBAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,4CAAC,yBAAO,QAAQ,KACd,sDAAC,kCACC,sDAAC,uBAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/LucideIconsDemo.js

@@ -12,28 +12,26 @@ function LucideIconsDemo() {
   const [searchRaw, setSearch] = useState("");
   const search = useDebounceValue(searchRaw, 400);
   const size = 100;
-  const iconsMemo = useMemo(() => {
-    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
-    return icons.slice(0, 835).map(({ Icon, name }) => {
-      return /* @__PURE__ */ jsxs(YStack, { h: size + 20, ai: "center", jc: "center", children: [
-        /* @__PURE__ */ jsx(Icon, { size: size * 0.25 }),
-        /* @__PURE__ */ jsx(Spacer, {}),
-        /* @__PURE__ */ jsx(
-          Paragraph,
-          {
-            h: "$6",
-            ww: "break-word",
-            maw: "100%",
-            ta: "center",
-            px: "$2",
-            size: "$1",
-            o: 0.5,
-            children: name
-          }
-        )
-      ] }, name);
-    });
-  }, [search]);
+  const iconsMemo = useMemo(
+    () => lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase())).map(({ Icon, name }) => /* @__PURE__ */ jsxs(YStack, { h: size + 20, ai: "center", jc: "center", children: [
+      /* @__PURE__ */ jsx(Icon, { size: size * 0.25 }),
+      /* @__PURE__ */ jsx(Spacer, {}),
+      /* @__PURE__ */ jsx(
+        Paragraph,
+        {
+          h: "$6",
+          ww: "break-word",
+          maw: "100%",
+          ta: "center",
+          px: "$2",
+          size: "$1",
+          o: 0.5,
+          children: name
+        }
+      )
+    ] }, name)),
+    [search]
+  );
   return /* @__PURE__ */ jsxs(YStack, { miw: "100%", padding: "$4", paddingBottom: "$0", space: true, children: [
     /* @__PURE__ */ jsx(Input, { value: searchRaw, onChangeText: setSearch, placeholder: "Search..." }),
     /* @__PURE__ */ jsx(YStack, { height: 420, children: /* @__PURE__ */ jsx(ScrollView, { children: /* @__PURE__ */ jsx(Grid, { itemMinWidth: size, children: iconsMemo }) }) })

package/dist/esm/LucideIconsDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/LucideIconsDemo.tsx"],
-  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(() => {\n    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n    return icons.slice(0, 835).map(({ Icon, name }) => {\n      return (\n        <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n          <Icon size={size * 0.25} />\n          <Spacer />\n          <Paragraph\n            h=\"$6\"\n            ww=\"break-word\"\n            maw=\"100%\"\n            ta=\"center\"\n            px=\"$2\"\n            size=\"$1\"\n            o={0.5}\n          >\n            {name}\n          </Paragraph>\n        </YStack>\n      )\n    })\n  }, [search])\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
-  "mappings": "AAqBQ,SACE,KADF;AArBR,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,QAAQ,YAAY,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC;AAC9E,WAAO,MAAM,MAAM,GAAG,GAAG,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,MAAM;AACjD,aACE,qBAAC,UAAO,GAAG,OAAO,IAAI,IAAG,UAAS,IAAG,UACnC;AAAA,4BAAC,QAAK,MAAM,OAAO,MAAM;AAAA,QACzB,oBAAC,UAAO;AAAA,QACR;AAAA,UAAC;AAAA;AAAA,YACC,GAAE;AAAA,YACF,IAAG;AAAA,YACH,KAAI;AAAA,YACJ,IAAG;AAAA,YACH,IAAG;AAAA,YACH,MAAK;AAAA,YACL,GAAG;AAAA,YAEF;AAAA;AAAA,QACH;AAAA,WAbiD,IAcnD;AAAA,IAEJ,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,SACE,qBAAC,UAAO,KAAI,QAAO,SAAQ,MAAK,eAAc,MAAK,OAAK,MACtD;AAAA,wBAAC,SAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,oBAAC,UAAO,QAAQ,KACd,8BAAC,cACC,8BAAC,QAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(\n    () =>\n      lucideIcons\n        .filter((x) => x.key.startsWith(search.toLowerCase()))\n        .map(({ Icon, name }) => (\n          <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n            <Icon size={size * 0.25} />\n            <Spacer />\n            <Paragraph\n              h=\"$6\"\n              ww=\"break-word\"\n              maw=\"100%\"\n              ta=\"center\"\n              px=\"$2\"\n              size=\"$1\"\n              o={0.5}\n            >\n              {name}\n            </Paragraph>\n          </YStack>\n        )),\n    [search]\n  )\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
+  "mappings": "AAsBU,SACE,KADF;AAtBV,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY;AAAA,IAChB,MACE,YACG,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC,EACpD,IAAI,CAAC,EAAE,MAAM,KAAK,MACjB,qBAAC,UAAO,GAAG,OAAO,IAAI,IAAG,UAAS,IAAG,UACnC;AAAA,0BAAC,QAAK,MAAM,OAAO,MAAM;AAAA,MACzB,oBAAC,UAAO;AAAA,MACR;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,IAAG;AAAA,UACH,KAAI;AAAA,UACJ,IAAG;AAAA,UACH,IAAG;AAAA,UACH,MAAK;AAAA,UACL,GAAG;AAAA,UAEF;AAAA;AAAA,MACH;AAAA,SAbiD,IAcnD,CACD;AAAA,IACL,CAAC,MAAM;AAAA,EACT;AAEA,SACE,qBAAC,UAAO,KAAI,QAAO,SAAQ,MAAK,eAAc,MAAK,OAAK,MACtD;AAAA,wBAAC,SAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,oBAAC,UAAO,QAAQ,KACd,8BAAC,cACC,8BAAC,QAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/LucideIconsDemo.mjs

@@ -12,28 +12,26 @@ function LucideIconsDemo() {
   const [searchRaw, setSearch] = useState("");
   const search = useDebounceValue(searchRaw, 400);
   const size = 100;
-  const iconsMemo = useMemo(() => {
-    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
-    return icons.slice(0, 835).map(({ Icon, name }) => {
-      return /* @__PURE__ */ jsxs(YStack, { h: size + 20, ai: "center", jc: "center", children: [
-        /* @__PURE__ */ jsx(Icon, { size: size * 0.25 }),
-        /* @__PURE__ */ jsx(Spacer, {}),
-        /* @__PURE__ */ jsx(
-          Paragraph,
-          {
-            h: "$6",
-            ww: "break-word",
-            maw: "100%",
-            ta: "center",
-            px: "$2",
-            size: "$1",
-            o: 0.5,
-            children: name
-          }
-        )
-      ] }, name);
-    });
-  }, [search]);
+  const iconsMemo = useMemo(
+    () => lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase())).map(({ Icon, name }) => /* @__PURE__ */ jsxs(YStack, { h: size + 20, ai: "center", jc: "center", children: [
+      /* @__PURE__ */ jsx(Icon, { size: size * 0.25 }),
+      /* @__PURE__ */ jsx(Spacer, {}),
+      /* @__PURE__ */ jsx(
+        Paragraph,
+        {
+          h: "$6",
+          ww: "break-word",
+          maw: "100%",
+          ta: "center",
+          px: "$2",
+          size: "$1",
+          o: 0.5,
+          children: name
+        }
+      )
+    ] }, name)),
+    [search]
+  );
   return /* @__PURE__ */ jsxs(YStack, { miw: "100%", padding: "$4", paddingBottom: "$0", space: true, children: [
     /* @__PURE__ */ jsx(Input, { value: searchRaw, onChangeText: setSearch, placeholder: "Search..." }),
     /* @__PURE__ */ jsx(YStack, { height: 420, children: /* @__PURE__ */ jsx(ScrollView, { children: /* @__PURE__ */ jsx(Grid, { itemMinWidth: size, children: iconsMemo }) }) })

package/dist/esm/LucideIconsDemo.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/LucideIconsDemo.tsx"],
-  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(() => {\n    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n    return icons.slice(0, 835).map(({ Icon, name }) => {\n      return (\n        <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n          <Icon size={size * 0.25} />\n          <Spacer />\n          <Paragraph\n            h=\"$6\"\n            ww=\"break-word\"\n            maw=\"100%\"\n            ta=\"center\"\n            px=\"$2\"\n            size=\"$1\"\n            o={0.5}\n          >\n            {name}\n          </Paragraph>\n        </YStack>\n      )\n    })\n  }, [search])\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
-  "mappings": "AAqBQ,SACE,KADF;AArBR,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,QAAQ,YAAY,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC;AAC9E,WAAO,MAAM,MAAM,GAAG,GAAG,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,MAAM;AACjD,aACE,qBAAC,UAAO,GAAG,OAAO,IAAI,IAAG,UAAS,IAAG,UACnC;AAAA,4BAAC,QAAK,MAAM,OAAO,MAAM;AAAA,QACzB,oBAAC,UAAO;AAAA,QACR;AAAA,UAAC;AAAA;AAAA,YACC,GAAE;AAAA,YACF,IAAG;AAAA,YACH,KAAI;AAAA,YACJ,IAAG;AAAA,YACH,IAAG;AAAA,YACH,MAAK;AAAA,YACL,GAAG;AAAA,YAEF;AAAA;AAAA,QACH;AAAA,WAbiD,IAcnD;AAAA,IAEJ,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,SACE,qBAAC,UAAO,KAAI,QAAO,SAAQ,MAAK,eAAc,MAAK,OAAK,MACtD;AAAA,wBAAC,SAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,oBAAC,UAAO,QAAQ,KACd,8BAAC,cACC,8BAAC,QAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(\n    () =>\n      lucideIcons\n        .filter((x) => x.key.startsWith(search.toLowerCase()))\n        .map(({ Icon, name }) => (\n          <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n            <Icon size={size * 0.25} />\n            <Spacer />\n            <Paragraph\n              h=\"$6\"\n              ww=\"break-word\"\n              maw=\"100%\"\n              ta=\"center\"\n              px=\"$2\"\n              size=\"$1\"\n              o={0.5}\n            >\n              {name}\n            </Paragraph>\n          </YStack>\n        )),\n    [search]\n  )\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
+  "mappings": "AAsBU,SACE,KADF;AAtBV,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY;AAAA,IAChB,MACE,YACG,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC,EACpD,IAAI,CAAC,EAAE,MAAM,KAAK,MACjB,qBAAC,UAAO,GAAG,OAAO,IAAI,IAAG,UAAS,IAAG,UACnC;AAAA,0BAAC,QAAK,MAAM,OAAO,MAAM;AAAA,MACzB,oBAAC,UAAO;AAAA,MACR;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,IAAG;AAAA,UACH,KAAI;AAAA,UACJ,IAAG;AAAA,UACH,IAAG;AAAA,UACH,MAAK;AAAA,UACL,GAAG;AAAA,UAEF;AAAA;AAAA,MACH;AAAA,SAbiD,IAcnD,CACD;AAAA,IACL,CAAC,MAAM;AAAA,EACT;AAEA,SACE,qBAAC,UAAO,KAAI,QAAO,SAAQ,MAAK,eAAc,MAAK,OAAK,MACtD;AAAA,wBAAC,SAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,oBAAC,UAAO,QAAQ,KACd,8BAAC,cACC,8BAAC,QAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/jsx/LucideIconsDemo.js

@@ -11,24 +11,22 @@ function LucideIconsDemo() {
   const [searchRaw, setSearch] = useState("");
   const search = useDebounceValue(searchRaw, 400);
   const size = 100;
-  const iconsMemo = useMemo(() => {
-    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
-    return icons.slice(0, 835).map(({ Icon, name }) => {
-      return <YStack h={size + 20} ai="center" jc="center" key={name}>
-        <Icon size={size * 0.25} />
-        <Spacer />
-        <Paragraph
-          h="$6"
-          ww="break-word"
-          maw="100%"
-          ta="center"
-          px="$2"
-          size="$1"
-          o={0.5}
-        >{name}</Paragraph>
-      </YStack>;
-    });
-  }, [search]);
+  const iconsMemo = useMemo(
+    () => lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase())).map(({ Icon, name }) => <YStack h={size + 20} ai="center" jc="center" key={name}>
+      <Icon size={size * 0.25} />
+      <Spacer />
+      <Paragraph
+        h="$6"
+        ww="break-word"
+        maw="100%"
+        ta="center"
+        px="$2"
+        size="$1"
+        o={0.5}
+      >{name}</Paragraph>
+    </YStack>),
+    [search]
+  );
   return <YStack miw="100%" padding="$4" paddingBottom="$0" space>
     <Input value={searchRaw} onChangeText={setSearch} placeholder="Search..." />
     <YStack height={420}><ScrollView><Grid itemMinWidth={size}>{iconsMemo}</Grid></ScrollView></YStack>

package/dist/jsx/LucideIconsDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/LucideIconsDemo.tsx"],
-  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(() => {\n    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n    return icons.slice(0, 835).map(({ Icon, name }) => {\n      return (\n        <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n          <Icon size={size * 0.25} />\n          <Spacer />\n          <Paragraph\n            h=\"$6\"\n            ww=\"break-word\"\n            maw=\"100%\"\n            ta=\"center\"\n            px=\"$2\"\n            size=\"$1\"\n            o={0.5}\n          >\n            {name}\n          </Paragraph>\n        </YStack>\n      )\n    })\n  }, [search])\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
-  "mappings": "AAAA,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,QAAQ,YAAY,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC;AAC9E,WAAO,MAAM,MAAM,GAAG,GAAG,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,MAAM;AACjD,aACE,CAAC,OAAO,GAAG,OAAO,IAAI,GAAG,SAAS,GAAG,SAAS,KAAK;AAAA,QACjD,CAAC,KAAK,MAAM,OAAO,MAAM;AAAA,QACzB,CAAC,OAAO;AAAA,QACR,CAAC;AAAA,UACC,EAAE;AAAA,UACF,GAAG;AAAA,UACH,IAAI;AAAA,UACJ,GAAG;AAAA,UACH,GAAG;AAAA,UACH,KAAK;AAAA,UACL,GAAG;AAAA,UAEF,KACH,EAVC;AAAA,MAWH,EAdC;AAAA,IAgBL,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,SACE,CAAC,OAAO,IAAI,OAAO,QAAQ,KAAK,cAAc,KAAK;AAAA,IACjD,CAAC,MAAM,OAAO,WAAW,cAAc,WAAW,YAAY,YAAY;AAAA,IAE1E,CAAC,OAAO,QAAQ,KACd,CAAC,WACC,CAAC,KAAK,cAAc,OAAO,UAAU,EAApC,KACH,EAFC,WAGH,EAJC;AAAA,EAKH,EARC;AAUL;",
+  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(\n    () =>\n      lucideIcons\n        .filter((x) => x.key.startsWith(search.toLowerCase()))\n        .map(({ Icon, name }) => (\n          <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n            <Icon size={size * 0.25} />\n            <Spacer />\n            <Paragraph\n              h=\"$6\"\n              ww=\"break-word\"\n              maw=\"100%\"\n              ta=\"center\"\n              px=\"$2\"\n              size=\"$1\"\n              o={0.5}\n            >\n              {name}\n            </Paragraph>\n          </YStack>\n        )),\n    [search]\n  )\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
+  "mappings": "AAAA,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY;AAAA,IAChB,MACE,YACG,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC,EACpD,IAAI,CAAC,EAAE,MAAM,KAAK,MACjB,CAAC,OAAO,GAAG,OAAO,IAAI,GAAG,SAAS,GAAG,SAAS,KAAK;AAAA,MACjD,CAAC,KAAK,MAAM,OAAO,MAAM;AAAA,MACzB,CAAC,OAAO;AAAA,MACR,CAAC;AAAA,QACC,EAAE;AAAA,QACF,GAAG;AAAA,QACH,IAAI;AAAA,QACJ,GAAG;AAAA,QACH,GAAG;AAAA,QACH,KAAK;AAAA,QACL,GAAG;AAAA,QAEF,KACH,EAVC;AAAA,IAWH,EAdC,OAeF;AAAA,IACL,CAAC,MAAM;AAAA,EACT;AAEA,SACE,CAAC,OAAO,IAAI,OAAO,QAAQ,KAAK,cAAc,KAAK;AAAA,IACjD,CAAC,MAAM,OAAO,WAAW,cAAc,WAAW,YAAY,YAAY;AAAA,IAE1E,CAAC,OAAO,QAAQ,KACd,CAAC,WACC,CAAC,KAAK,cAAc,OAAO,UAAU,EAApC,KACH,EAFC,WAGH,EAJC;AAAA,EAKH,EARC;AAUL;",
   "names": []
 }

package/dist/jsx/LucideIconsDemo.mjs

@@ -11,24 +11,22 @@ function LucideIconsDemo() {
   const [searchRaw, setSearch] = useState("");
   const search = useDebounceValue(searchRaw, 400);
   const size = 100;
-  const iconsMemo = useMemo(() => {
-    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
-    return icons.slice(0, 835).map(({ Icon, name }) => {
-      return <YStack h={size + 20} ai="center" jc="center" key={name}>
-        <Icon size={size * 0.25} />
-        <Spacer />
-        <Paragraph
-          h="$6"
-          ww="break-word"
-          maw="100%"
-          ta="center"
-          px="$2"
-          size="$1"
-          o={0.5}
-        >{name}</Paragraph>
-      </YStack>;
-    });
-  }, [search]);
+  const iconsMemo = useMemo(
+    () => lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase())).map(({ Icon, name }) => <YStack h={size + 20} ai="center" jc="center" key={name}>
+      <Icon size={size * 0.25} />
+      <Spacer />
+      <Paragraph
+        h="$6"
+        ww="break-word"
+        maw="100%"
+        ta="center"
+        px="$2"
+        size="$1"
+        o={0.5}
+      >{name}</Paragraph>
+    </YStack>),
+    [search]
+  );
   return <YStack miw="100%" padding="$4" paddingBottom="$0" space>
     <Input value={searchRaw} onChangeText={setSearch} placeholder="Search..." />
     <YStack height={420}><ScrollView><Grid itemMinWidth={size}>{iconsMemo}</Grid></ScrollView></YStack>

package/dist/jsx/LucideIconsDemo.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/LucideIconsDemo.tsx"],
-  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(() => {\n    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n    return icons.slice(0, 835).map(({ Icon, name }) => {\n      return (\n        <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n          <Icon size={size * 0.25} />\n          <Spacer />\n          <Paragraph\n            h=\"$6\"\n            ww=\"break-word\"\n            maw=\"100%\"\n            ta=\"center\"\n            px=\"$2\"\n            size=\"$1\"\n            o={0.5}\n          >\n            {name}\n          </Paragraph>\n        </YStack>\n      )\n    })\n  }, [search])\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
-  "mappings": "AAAA,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,QAAQ,YAAY,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC;AAC9E,WAAO,MAAM,MAAM,GAAG,GAAG,EAAE,IAAI,CAAC,EAAE,MAAM,KAAK,MAAM;AACjD,aACE,CAAC,OAAO,GAAG,OAAO,IAAI,GAAG,SAAS,GAAG,SAAS,KAAK;AAAA,QACjD,CAAC,KAAK,MAAM,OAAO,MAAM;AAAA,QACzB,CAAC,OAAO;AAAA,QACR,CAAC;AAAA,UACC,EAAE;AAAA,UACF,GAAG;AAAA,UACH,IAAI;AAAA,UACJ,GAAG;AAAA,UACH,GAAG;AAAA,UACH,KAAK;AAAA,UACL,GAAG;AAAA,UAEF,KACH,EAVC;AAAA,MAWH,EAdC;AAAA,IAgBL,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,SACE,CAAC,OAAO,IAAI,OAAO,QAAQ,KAAK,cAAc,KAAK;AAAA,IACjD,CAAC,MAAM,OAAO,WAAW,cAAc,WAAW,YAAY,YAAY;AAAA,IAE1E,CAAC,OAAO,QAAQ,KACd,CAAC,WACC,CAAC,KAAK,cAAc,OAAO,UAAU,EAApC,KACH,EAFC,WAGH,EAJC;AAAA,EAKH,EARC;AAUL;",
+  "sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n  key: name.toLowerCase(),\n  name,\n  Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n  const [searchRaw, setSearch] = useState('')\n  const search = useDebounceValue(searchRaw, 400)\n\n  const size = 100\n\n  const iconsMemo = useMemo(\n    () =>\n      lucideIcons\n        .filter((x) => x.key.startsWith(search.toLowerCase()))\n        .map(({ Icon, name }) => (\n          <YStack h={size + 20} ai=\"center\" jc=\"center\" key={name}>\n            <Icon size={size * 0.25} />\n            <Spacer />\n            <Paragraph\n              h=\"$6\"\n              ww=\"break-word\"\n              maw=\"100%\"\n              ta=\"center\"\n              px=\"$2\"\n              size=\"$1\"\n              o={0.5}\n            >\n              {name}\n            </Paragraph>\n          </YStack>\n        )),\n    [search]\n  )\n\n  return (\n    <YStack miw=\"100%\" padding=\"$4\" paddingBottom=\"$0\" space>\n      <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n      <YStack height={420}>\n        <ScrollView>\n          <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n        </ScrollView>\n      </YStack>\n    </YStack>\n  )\n}\n"],
+  "mappings": "AAAA,YAAY,iBAAiB;AAC7B,SAAS,SAAS,gBAAgB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,MAAM,OAAO,WAAW,QAAQ,QAAQ,wBAAwB;AAEzE,MAAM,cAAc,OAAO,KAAK,WAAW,EAAE,IAAI,CAAC,UAAU;AAAA,EAC1D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,YAAY,IAAI;AACxB,EAAE;AAEK,SAAS,kBAAkB;AAChC,QAAM,CAAC,WAAW,SAAS,IAAI,SAAS,EAAE;AAC1C,QAAM,SAAS,iBAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,YAAY;AAAA,IAChB,MACE,YACG,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC,EACpD,IAAI,CAAC,EAAE,MAAM,KAAK,MACjB,CAAC,OAAO,GAAG,OAAO,IAAI,GAAG,SAAS,GAAG,SAAS,KAAK;AAAA,MACjD,CAAC,KAAK,MAAM,OAAO,MAAM;AAAA,MACzB,CAAC,OAAO;AAAA,MACR,CAAC;AAAA,QACC,EAAE;AAAA,QACF,GAAG;AAAA,QACH,IAAI;AAAA,QACJ,GAAG;AAAA,QACH,GAAG;AAAA,QACH,KAAK;AAAA,QACL,GAAG;AAAA,QAEF,KACH,EAVC;AAAA,IAWH,EAdC,OAeF;AAAA,IACL,CAAC,MAAM;AAAA,EACT;AAEA,SACE,CAAC,OAAO,IAAI,OAAO,QAAQ,KAAK,cAAc,KAAK;AAAA,IACjD,CAAC,MAAM,OAAO,WAAW,cAAc,WAAW,YAAY,YAAY;AAAA,IAE1E,CAAC,OAAO,QAAQ,KACd,CAAC,WACC,CAAC,KAAK,cAAc,OAAO,UAAU,EAApC,KACH,EAFC,WAGH,EAJC;AAAA,EAKH,EARC;AAUL;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/demos",
-  "version": "1.15.7",
+  "version": "1.15.8",
   "sideEffects": [
     "*.css"
   ],
@@ -28,29 +28,29 @@
     }
   },
   "dependencies": {
-    "@tamagui/avatar": "1.15.7",
-    "@tamagui/button": "1.15.7",
-    "@tamagui/config": "1.15.7",
-    "@tamagui/core": "1.15.7",
-    "@tamagui/list-item": "1.15.7",
-    "@tamagui/logo": "1.15.7",
-    "@tamagui/menu": "1.15.7",
-    "@tamagui/popover": "1.15.7",
-    "@tamagui/progress": "1.15.7",
-    "@tamagui/radio-group": "1.15.7",
-    "@tamagui/select": "1.15.7",
-    "@tamagui/sheet": "1.15.7",
-    "@tamagui/slider": "1.15.7",
-    "@tamagui/stacks": "1.15.7",
-    "@tamagui/toast": "1.15.7",
-    "tamagui": "1.15.7"
+    "@tamagui/avatar": "1.15.8",
+    "@tamagui/button": "1.15.8",
+    "@tamagui/config": "1.15.8",
+    "@tamagui/core": "1.15.8",
+    "@tamagui/list-item": "1.15.8",
+    "@tamagui/logo": "1.15.8",
+    "@tamagui/menu": "1.15.8",
+    "@tamagui/popover": "1.15.8",
+    "@tamagui/progress": "1.15.8",
+    "@tamagui/radio-group": "1.15.8",
+    "@tamagui/select": "1.15.8",
+    "@tamagui/sheet": "1.15.8",
+    "@tamagui/slider": "1.15.8",
+    "@tamagui/stacks": "1.15.8",
+    "@tamagui/toast": "1.15.8",
+    "tamagui": "1.15.8"
   },
   "peerDependencies": {
     "react": "*",
     "react-dom": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.15.7",
+    "@tamagui/build": "1.15.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

package/src/LucideIconsDemo.tsx

@@ -15,28 +15,29 @@ export function LucideIconsDemo() {
 
   const size = 100
 
-  const iconsMemo = useMemo(() => {
-    const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))
-    return icons.slice(0, 835).map(({ Icon, name }) => {
-      return (
-        <YStack h={size + 20} ai="center" jc="center" key={name}>
-          <Icon size={size * 0.25} />
-          <Spacer />
-          <Paragraph
-            h="$6"
-            ww="break-word"
-            maw="100%"
-            ta="center"
-            px="$2"
-            size="$1"
-            o={0.5}
-          >
-            {name}
-          </Paragraph>
-        </YStack>
-      )
-    })
-  }, [search])
+  const iconsMemo = useMemo(
+    () =>
+      lucideIcons
+        .filter((x) => x.key.startsWith(search.toLowerCase()))
+        .map(({ Icon, name }) => (
+          <YStack h={size + 20} ai="center" jc="center" key={name}>
+            <Icon size={size * 0.25} />
+            <Spacer />
+            <Paragraph
+              h="$6"
+              ww="break-word"
+              maw="100%"
+              ta="center"
+              px="$2"
+              size="$1"
+              o={0.5}
+            >
+              {name}
+            </Paragraph>
+          </YStack>
+        )),
+    [search]
+  )
 
   return (
     <YStack miw="100%" padding="$4" paddingBottom="$0" space>

package/types/LucideIconsDemo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LucideIconsDemo.d.ts","sourceRoot":"","sources":["../src/LucideIconsDemo.tsx"],"names":[],"mappings":";AAWA,wBAAgB,eAAe,gBAwC9B"}
+{"version":3,"file":"LucideIconsDemo.d.ts","sourceRoot":"","sources":["../src/LucideIconsDemo.tsx"],"names":[],"mappings":";AAWA,wBAAgB,eAAe,gBAyC9B"}