@tamagui/demos 1.88.12 → 1.88.14

package/dist/esm/DialogDemo.mjs

@@ -0,0 +1,136 @@
+import { X } from "@tamagui/lucide-icons";
+import { useState } from "react";
+import { Adapt, Button, Dialog, Fieldset, Input, Label, Paragraph, Sheet, TooltipSimple, Unspaced, XStack } from "tamagui";
+import { SelectDemoItem } from "./SelectDemo.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DialogDemo() {
+  return /* @__PURE__ */jsx(DialogInstance, {});
+}
+function DialogInstance() {
+  const [open, setOpen] = useState(!1);
+  return /* @__PURE__ */jsxs(Dialog, {
+    modal: !0,
+    onOpenChange: open2 => {
+      setOpen(open2);
+    },
+    children: [/* @__PURE__ */jsx(Dialog.Trigger, {
+      asChild: !0,
+      children: /* @__PURE__ */jsx(Button, {
+        children: "Show Dialog"
+      })
+    }), /* @__PURE__ */jsx(Adapt, {
+      when: "sm",
+      platform: "touch",
+      children: /* @__PURE__ */jsxs(Sheet, {
+        animation: "medium",
+        zIndex: 2e5,
+        modal: !0,
+        dismissOnSnapToBottom: !0,
+        children: [/* @__PURE__ */jsx(Sheet.Frame, {
+          padding: "$4",
+          gap: "$4",
+          children: /* @__PURE__ */jsx(Adapt.Contents, {})
+        }), /* @__PURE__ */jsx(Sheet.Overlay, {
+          animation: "lazy",
+          enterStyle: {
+            opacity: 0
+          },
+          exitStyle: {
+            opacity: 0
+          }
+        })]
+      })
+    }), /* @__PURE__ */jsxs(Dialog.Portal, {
+      children: [/* @__PURE__ */jsx(Dialog.Overlay, {
+        animation: "quick",
+        opacity: 0.5,
+        enterStyle: {
+          opacity: 0
+        },
+        exitStyle: {
+          opacity: 0
+        }
+      }, "overlay"), /* @__PURE__ */jsxs(Dialog.Content, {
+        bordered: !0,
+        elevate: !0,
+        animateOnly: ["transform", "opacity"],
+        animation: ["quick", {
+          opacity: {
+            overshootClamping: !0
+          }
+        }],
+        enterStyle: {
+          x: 0,
+          y: -20,
+          opacity: 0,
+          scale: 0.9
+        },
+        exitStyle: {
+          x: 0,
+          y: 10,
+          opacity: 0,
+          scale: 0.95
+        },
+        gap: "$4",
+        children: [/* @__PURE__ */jsx(Dialog.Title, {
+          children: "Edit profile"
+        }), /* @__PURE__ */jsx(Dialog.Description, {
+          children: "Make changes to your profile here. Click save when you're done."
+        }), /* @__PURE__ */jsxs(Fieldset, {
+          gap: "$4",
+          horizontal: !0,
+          children: [/* @__PURE__ */jsx(Label, {
+            width: 160,
+            justifyContent: "flex-end",
+            htmlFor: "name",
+            children: "Name"
+          }), /* @__PURE__ */jsx(Input, {
+            flex: 1,
+            id: "name",
+            defaultValue: "Nate Wienert"
+          })]
+        }), /* @__PURE__ */jsxs(Fieldset, {
+          gap: "$4",
+          horizontal: !0,
+          children: [/* @__PURE__ */jsx(Label, {
+            width: 160,
+            justifyContent: "flex-end",
+            htmlFor: "username",
+            children: /* @__PURE__ */jsx(TooltipSimple, {
+              label: "Pick your favorite",
+              placement: "bottom-start",
+              children: /* @__PURE__ */jsx(Paragraph, {
+                children: "Food"
+              })
+            })
+          }), /* @__PURE__ */jsx(SelectDemoItem, {})]
+        }), /* @__PURE__ */jsxs(XStack, {
+          alignSelf: "flex-end",
+          gap: "$4",
+          children: [/* @__PURE__ */jsx(DialogInstance, {}), /* @__PURE__ */jsx(Dialog.Close, {
+            displayWhenAdapted: !0,
+            asChild: !0,
+            children: /* @__PURE__ */jsx(Button, {
+              theme: "active",
+              "aria-label": "Close",
+              children: "Save changes"
+            })
+          })]
+        }), /* @__PURE__ */jsx(Unspaced, {
+          children: /* @__PURE__ */jsx(Dialog.Close, {
+            asChild: !0,
+            children: /* @__PURE__ */jsx(Button, {
+              position: "absolute",
+              top: "$3",
+              right: "$3",
+              size: "$2",
+              circular: !0,
+              icon: X
+            })
+          })
+        })]
+      }, "content")]
+    })]
+  });
+}
+export { DialogDemo };

package/dist/esm/FormsDemo.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/FormsDemo.tsx"],
-  "mappings": "AAAA,SAAS,WAAW,gBAAgB;AACpC,SAAS,QAAQ,MAAM,IAAgB,eAAe;AAelD,SAWE,KAXF;AAbG,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6C,KAAK;AAE9E,mBAAU,MAAM;AACd,QAAI,WAAW,cAAc;AAC3B,YAAM,QAAQ,WAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AACrD,aAAO,MAAM;AACX,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,MAAM,CAAC,GAGT;AAAA,IAAC;AAAA;AAAA,MACC,YAAW;AAAA,MACX,UAAU;AAAA,MACV,KAAI;AAAA,MACJ,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,aAAa;AAAA,MACb,cAAa;AAAA,MACb,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,SAAQ;AAAA,MAER;AAAA,4BAAC,MAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,oBAAC,KAAK,SAAL,EAAa,SAAO,IAAC,UAAU,WAAW,OACzC,8BAAC,UAAO,MAAM,WAAW,eAAe,MAAM,oBAAC,WAAQ,IAAK,QAAW,oBAEvE,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "mappings": "AAAA,SAAS,WAAW,gBAAgB;AAEpC,SAAS,QAAQ,MAAM,IAAI,eAAe;AAetC,SAWE,KAXF;AAbG,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6C,KAAK;AAE9E,mBAAU,MAAM;AACd,QAAI,WAAW,cAAc;AAC3B,YAAM,QAAQ,WAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AACrD,aAAO,MAAM;AACX,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,MAAM,CAAC,GAGT;AAAA,IAAC;AAAA;AAAA,MACC,YAAW;AAAA,MACX,UAAU;AAAA,MACV,KAAI;AAAA,MACJ,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,aAAa;AAAA,MACb,cAAa;AAAA,MACb,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,SAAQ;AAAA,MAER;AAAA,4BAAC,MAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,oBAAC,KAAK,SAAL,EAAa,SAAO,IAAC,UAAU,WAAW,OACzC,8BAAC,UAAO,MAAM,WAAW,eAAe,MAAM,oBAAC,WAAQ,IAAK,QAAW,oBAEvE,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/esm/FormsDemo.mjs

@@ -0,0 +1,35 @@
+import { useEffect, useState } from "react";
+import { Button, Form, H4, Spinner } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function FormsDemo(props) {
+  const [status, setStatus] = useState("off");
+  return useEffect(() => {
+    if (status === "submitting") {
+      const timer = setTimeout(() => setStatus("off"), 2e3);
+      return () => {
+        clearTimeout(timer);
+      };
+    }
+  }, [status]), /* @__PURE__ */jsxs(Form, {
+    alignItems: "center",
+    minWidth: 300,
+    gap: "$2",
+    onSubmit: () => setStatus("submitting"),
+    borderWidth: 1,
+    borderRadius: "$4",
+    backgroundColor: "$background",
+    borderColor: "$borderColor",
+    padding: "$8",
+    children: [/* @__PURE__ */jsx(H4, {
+      children: status[0].toUpperCase() + status.slice(1)
+    }), /* @__PURE__ */jsx(Form.Trigger, {
+      asChild: !0,
+      disabled: status !== "off",
+      children: /* @__PURE__ */jsx(Button, {
+        icon: status === "submitting" ? () => /* @__PURE__ */jsx(Spinner, {}) : void 0,
+        children: "Submit"
+      })
+    })]
+  });
+}
+export { FormsDemo };

package/dist/esm/FormsDemo.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/FormsDemo.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAoC,kBACpC,iBAAsD,oBAelD;AAbG,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAA6C,KAAK;AAE9E,qCAAU,MAAM;AACd,QAAI,WAAW,cAAc;AAC3B,YAAM,QAAQ,WAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AACrD,aAAO,MAAM;AACX,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,MAAM,CAAC,GAGT;AAAA,IAAC;AAAA;AAAA,MACC,YAAW;AAAA,MACX,UAAU;AAAA,MACV,KAAI;AAAA,MACJ,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,aAAa;AAAA,MACb,cAAa;AAAA,MACb,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,SAAQ;AAAA,MAER;AAAA,oDAAC,qBAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,4CAAC,oBAAK,SAAL,EAAa,SAAO,IAAC,UAAU,WAAW,OACzC,sDAAC,yBAAO,MAAM,WAAW,eAAe,MAAM,4CAAC,0BAAQ,IAAK,QAAW,oBAEvE,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAoC,kBAEpC,iBAA0C,oBAetC;AAbG,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAA6C,KAAK;AAE9E,qCAAU,MAAM;AACd,QAAI,WAAW,cAAc;AAC3B,YAAM,QAAQ,WAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AACrD,aAAO,MAAM;AACX,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,MAAM,CAAC,GAGT;AAAA,IAAC;AAAA;AAAA,MACC,YAAW;AAAA,MACX,UAAU;AAAA,MACV,KAAI;AAAA,MACJ,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,aAAa;AAAA,MACb,cAAa;AAAA,MACb,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,SAAQ;AAAA,MAER;AAAA,oDAAC,qBAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,4CAAC,oBAAK,SAAL,EAAa,SAAO,IAAC,UAAU,WAAW,OACzC,sDAAC,yBAAO,MAAM,WAAW,eAAe,MAAM,4CAAC,0BAAQ,IAAK,QAAW,oBAEvE,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/esm/Grid.mjs

@@ -0,0 +1,37 @@
+import { isWeb } from "@tamagui/core";
+import { XStack } from "@tamagui/stacks";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+function Grid({
+  children,
+  columns,
+  itemMinWidth = 200,
+  gap
+}) {
+  if (isWeb) return /* @__PURE__ */jsx("div", {
+    style: {
+      gap,
+      display: "grid",
+      justifyContent: "stretch",
+      // gridTemplateRows: 'repeat(4, 1fr)',
+      gridTemplateColumns: `repeat( auto-fit, minmax(${itemMinWidth}px, 1fr) )`
+      // gridTemplateColumns: '1fr 1fr',
+    },
+
+    children
+  });
+  const childrenList = React.Children.toArray(children);
+  return /* @__PURE__ */jsx(XStack, {
+    alignItems: "center",
+    justifyContent: "center",
+    flexWrap: "wrap",
+    children: childrenList.map((child, i) => child ? /* @__PURE__ */jsx(XStack, {
+      flex: 1,
+      minWidth: itemMinWidth,
+      marginRight: gap,
+      marginBottom: gap,
+      children: child
+    }, i) : null)
+  });
+}
+export { Grid };

package/dist/esm/GroupDemo.mjs

@@ -0,0 +1,61 @@
+import { Activity, Airplay } from "@tamagui/lucide-icons";
+import { Button, Group, ListItem, Separator, XGroup, YGroup, YStack } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function GroupDemo() {
+  return /* @__PURE__ */jsxs(YStack, {
+    padding: "$3",
+    space: "$2",
+    alignItems: "center",
+    children: [/* @__PURE__ */jsxs(Group, {
+      orientation: "horizontal",
+      children: [/* @__PURE__ */jsx(Group.Item, {
+        children: /* @__PURE__ */jsx(Button, {
+          children: "First"
+        })
+      }), /* @__PURE__ */jsx(Group.Item, {
+        children: /* @__PURE__ */jsx(Button, {
+          children: "Second"
+        })
+      }), /* @__PURE__ */jsx(Group.Item, {
+        children: /* @__PURE__ */jsx(Button, {
+          children: "Third"
+        })
+      })]
+    }), /* @__PURE__ */jsxs(XGroup, {
+      size: "$3",
+      $gtSm: {
+        size: "$5"
+      },
+      children: [/* @__PURE__ */jsx(XGroup.Item, {
+        children: /* @__PURE__ */jsx(Button, {
+          size: "$3",
+          icon: Activity,
+          children: "First"
+        })
+      }), /* @__PURE__ */jsx(XGroup.Item, {
+        children: /* @__PURE__ */jsx(Button, {
+          size: "$3",
+          icon: Airplay,
+          children: "Second"
+        })
+      })]
+    }), /* @__PURE__ */jsxs(YGroup, {
+      separator: /* @__PURE__ */jsx(Separator, {}),
+      children: [/* @__PURE__ */jsx(YGroup.Item, {
+        children: /* @__PURE__ */jsx(ListItem, {
+          title: "First"
+        })
+      }), /* @__PURE__ */jsx(YGroup.Item, {
+        children: /* @__PURE__ */jsx(ListItem, {
+          title: "Second",
+          subTitle: "Second subtitle"
+        })
+      }), /* @__PURE__ */jsx(YGroup.Item, {
+        children: /* @__PURE__ */jsx(ListItem, {
+          children: "Third"
+        })
+      })]
+    })]
+  });
+}
+export { GroupDemo };

package/dist/esm/HeadingsDemo.mjs

@@ -0,0 +1,21 @@
+import { H1, H2, H3, H4, H5, H6, YStack } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function HeadingsDemo() {
+  return /* @__PURE__ */jsxs(YStack, {
+    alignSelf: "center",
+    children: [/* @__PURE__ */jsx(H1, {
+      children: "Heading 1"
+    }), /* @__PURE__ */jsx(H2, {
+      children: "Heading 2"
+    }), /* @__PURE__ */jsx(H3, {
+      children: "Heading 3"
+    }), /* @__PURE__ */jsx(H4, {
+      children: "Heading 4"
+    }), /* @__PURE__ */jsx(H5, {
+      children: "Heading 5"
+    }), /* @__PURE__ */jsx(H6, {
+      children: "Heading 6"
+    })]
+  });
+}
+export { HeadingsDemo };

package/dist/esm/ImageDemo.mjs

@@ -0,0 +1,12 @@
+import { Image } from "tamagui";
+import { jsx } from "react/jsx-runtime";
+function ImageDemo() {
+  return /* @__PURE__ */jsx(Image, {
+    source: {
+      uri: "https://placekitten.com/200/300",
+      width: 200,
+      height: 300
+    }
+  });
+}
+export { ImageDemo };

package/dist/esm/InputsDemo.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/InputsDemo.tsx"],
-  "mappings": "AAAA,SAAS,QAAQ,OAAmB,UAAU,QAAQ,cAAc;AAIhE,SAQE,KARF;AAFG,SAAS,aAAa;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,WAAW;AAAA,MACX,UAAS;AAAA,MACT,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MAER;AAAA,4BAAC,aAAU,MAAK,MAAK;AAAA,QACrB,oBAAC,aAAU,MAAK,MAAK;AAAA,QACrB,oBAAC,aAAU,MAAK,MAAK;AAAA,QACrB,oBAAC,YAAS,aAAY,yBAAwB;AAAA;AAAA;AAAA,EAChD;AAEJ;AAEA,SAAS,UAAU,OAA6B;AAC9C,SACE,qBAAC,UAAO,YAAW,UAAS,OAAM,MAChC;AAAA,wBAAC,SAAM,MAAM,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,IAAI,OAAO;AAAA,IACxE,oBAAC,UAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
+  "mappings": "AACA,SAAS,QAAQ,OAAO,UAAU,QAAQ,cAAc;AAIpD,SAQE,KARF;AAFG,SAAS,aAAa;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,WAAW;AAAA,MACX,UAAS;AAAA,MACT,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MAER;AAAA,4BAAC,aAAU,MAAK,MAAK;AAAA,QACrB,oBAAC,aAAU,MAAK,MAAK;AAAA,QACrB,oBAAC,aAAU,MAAK,MAAK;AAAA,QACrB,oBAAC,YAAS,aAAY,yBAAwB;AAAA;AAAA;AAAA,EAChD;AAEJ;AAEA,SAAS,UAAU,OAA6B;AAC9C,SACE,qBAAC,UAAO,YAAW,UAAS,OAAM,MAChC;AAAA,wBAAC,SAAM,MAAM,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,IAAI,OAAO;AAAA,IACxE,oBAAC,UAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
   "names": []
 }

package/dist/esm/InputsDemo.mjs

@@ -0,0 +1,36 @@
+import { Button, Input, TextArea, XStack, YStack } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function InputsDemo() {
+  return /* @__PURE__ */jsxs(YStack, {
+    width: 200,
+    minHeight: 250,
+    overflow: "hidden",
+    space: "$2",
+    margin: "$3",
+    padding: "$2",
+    children: [/* @__PURE__ */jsx(InputDemo, {
+      size: "$2"
+    }), /* @__PURE__ */jsx(InputDemo, {
+      size: "$3"
+    }), /* @__PURE__ */jsx(InputDemo, {
+      size: "$4"
+    }), /* @__PURE__ */jsx(TextArea, {
+      placeholder: "Enter your details..."
+    })]
+  });
+}
+function InputDemo(props) {
+  return /* @__PURE__ */jsxs(XStack, {
+    alignItems: "center",
+    space: "$2",
+    children: [/* @__PURE__ */jsx(Input, {
+      flex: 1,
+      size: props.size,
+      placeholder: `Size ${props.size}...`
+    }), /* @__PURE__ */jsx(Button, {
+      size: props.size,
+      children: "Go"
+    })]
+  });
+}
+export { InputsDemo };

package/dist/esm/InputsDemo.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/InputsDemo.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAAoE,oBAIhE;AAFG,SAAS,aAAa;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,WAAW;AAAA,MACX,UAAS;AAAA,MACT,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MAER;AAAA,oDAAC,aAAU,MAAK,MAAK;AAAA,QACrB,4CAAC,aAAU,MAAK,MAAK;AAAA,QACrB,4CAAC,aAAU,MAAK,MAAK;AAAA,QACrB,4CAAC,2BAAS,aAAY,yBAAwB;AAAA;AAAA;AAAA,EAChD;AAEJ;AAEA,SAAS,UAAU,OAA6B;AAC9C,SACE,6CAAC,yBAAO,YAAW,UAAS,OAAM,MAChC;AAAA,gDAAC,wBAAM,MAAM,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,IAAI,OAAO;AAAA,IACxE,4CAAC,yBAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
+  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAwD,oBAIpD;AAFG,SAAS,aAAa;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,WAAW;AAAA,MACX,UAAS;AAAA,MACT,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MAER;AAAA,oDAAC,aAAU,MAAK,MAAK;AAAA,QACrB,4CAAC,aAAU,MAAK,MAAK;AAAA,QACrB,4CAAC,aAAU,MAAK,MAAK;AAAA,QACrB,4CAAC,2BAAS,aAAY,yBAAwB;AAAA;AAAA;AAAA,EAChD;AAEJ;AAEA,SAAS,UAAU,OAA6B;AAC9C,SACE,6CAAC,yBAAO,YAAW,UAAS,OAAM,MAChC;AAAA,gDAAC,wBAAM,MAAM,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,IAAI,OAAO;AAAA,IACxE,4CAAC,yBAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
   "names": []
 }

package/dist/esm/LabelDemo.mjs

@@ -0,0 +1,36 @@
+import { Input, Label, Switch, XStack, YStack } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function LabelDemo() {
+  return /* @__PURE__ */jsxs(YStack, {
+    padding: "$3",
+    minWidth: 300,
+    space: "$4",
+    children: [/* @__PURE__ */jsxs(XStack, {
+      alignItems: "center",
+      space: "$4",
+      children: [/* @__PURE__ */jsx(Label, {
+        width: 90,
+        htmlFor: "name",
+        children: "Name"
+      }), /* @__PURE__ */jsx(Input, {
+        flex: 1,
+        id: "name",
+        defaultValue: "Nate Wienert"
+      })]
+    }), /* @__PURE__ */jsxs(XStack, {
+      alignItems: "center",
+      space: "$4",
+      children: [/* @__PURE__ */jsx(Label, {
+        width: 90,
+        htmlFor: "notify",
+        children: "Notifications"
+      }), /* @__PURE__ */jsx(Switch, {
+        id: "notify",
+        children: /* @__PURE__ */jsx(Switch.Thumb, {
+          animation: "quick"
+        })
+      })]
+    })]
+  });
+}
+export { LabelDemo };

package/dist/esm/LinearGradientDemo.mjs

@@ -0,0 +1,24 @@
+import { XStack } from "tamagui";
+import { LinearGradient } from "tamagui/linear-gradient";
+import { jsx, jsxs } from "react/jsx-runtime";
+function LinearGradientDemo() {
+  return /* @__PURE__ */jsxs(XStack, {
+    space: !0,
+    children: [/* @__PURE__ */jsx(LinearGradient, {
+      width: "$6",
+      height: "$6",
+      borderRadius: "$4",
+      colors: ["$red10", "$yellow10"],
+      start: [0, 1],
+      end: [0, 0]
+    }), /* @__PURE__ */jsx(LinearGradient, {
+      width: "$6",
+      height: "$6",
+      borderRadius: "$4",
+      colors: ["$background", "$color"],
+      start: [1, 1],
+      end: [0, 0]
+    })]
+  });
+}
+export { LinearGradientDemo };

package/dist/esm/ListItemDemo.mjs

@@ -0,0 +1,76 @@
+import { ChevronRight, Cloud, Moon, Star, Sun } from "@tamagui/lucide-icons";
+import { ListItem, Separator, XStack, YGroup } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function ListItemDemo() {
+  return /* @__PURE__ */jsxs(XStack, {
+    $sm: {
+      flexDirection: "column"
+    },
+    paddingHorizontal: "$4",
+    space: !0,
+    children: [/* @__PURE__ */jsx(ListItemDemo1, {}), /* @__PURE__ */jsx(ListItemDemo2, {})]
+  });
+}
+function ListItemDemo1() {
+  return /* @__PURE__ */jsxs(YGroup, {
+    alignSelf: "center",
+    bordered: !0,
+    width: 240,
+    size: "$4",
+    children: [/* @__PURE__ */jsx(YGroup.Item, {
+      children: /* @__PURE__ */jsx(ListItem, {
+        hoverTheme: !0,
+        icon: Star,
+        title: "Star",
+        subTitle: "Twinkles"
+      })
+    }), /* @__PURE__ */jsx(YGroup.Item, {
+      children: /* @__PURE__ */jsx(ListItem, {
+        hoverTheme: !0,
+        icon: Moon,
+        children: "Moon"
+      })
+    }), /* @__PURE__ */jsx(YGroup.Item, {
+      children: /* @__PURE__ */jsx(ListItem, {
+        hoverTheme: !0,
+        icon: Sun,
+        children: "Sun"
+      })
+    }), /* @__PURE__ */jsx(YGroup.Item, {
+      children: /* @__PURE__ */jsx(ListItem, {
+        hoverTheme: !0,
+        icon: Cloud,
+        children: "Cloud"
+      })
+    })]
+  });
+}
+function ListItemDemo2() {
+  return /* @__PURE__ */jsxs(YGroup, {
+    alignSelf: "center",
+    bordered: !0,
+    width: 240,
+    size: "$5",
+    separator: /* @__PURE__ */jsx(Separator, {}),
+    children: [/* @__PURE__ */jsx(YGroup.Item, {
+      children: /* @__PURE__ */jsx(ListItem, {
+        hoverTheme: !0,
+        pressTheme: !0,
+        title: "Star",
+        subTitle: "Subtitle",
+        icon: Star,
+        iconAfter: ChevronRight
+      })
+    }), /* @__PURE__ */jsx(YGroup.Item, {
+      children: /* @__PURE__ */jsx(ListItem, {
+        hoverTheme: !0,
+        pressTheme: !0,
+        title: "Moon",
+        subTitle: "Subtitle",
+        icon: Moon,
+        iconAfter: ChevronRight
+      })
+    })]
+  });
+}
+export { ListItemDemo };

package/dist/esm/LucideIconsDemo.mjs

@@ -0,0 +1,58 @@
+import * as LucideIcons from "@tamagui/lucide-icons";
+import { useMemo, useState } from "react";
+import { ScrollView } from "react-native-web";
+import { Input, Paragraph, Spacer, YStack, useDebounceValue } from "tamagui";
+import { Grid } from "./Grid.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+const lucideIcons = Object.keys(
+// vite tree shaking workaround
+typeof LucideIcons < "u" ? LucideIcons : {}).map(name => ({
+  key: name.toLowerCase(),
+  name,
+  Icon: LucideIcons[name]
+}));
+function LucideIconsDemo() {
+  const [searchRaw, setSearch] = useState(""),
+    search = useDebounceValue(searchRaw, 400),
+    size = 100,
+    iconsMemo = useMemo(() => lucideIcons.filter(x => x.key.includes(search.toLowerCase())).map(({
+      Icon,
+      name
+    }) => /* @__PURE__ */jsxs(YStack, {
+      height: size + 20,
+      alignItems: "center",
+      justifyContent: "center",
+      children: [/* @__PURE__ */jsx(Icon, {
+        size: size * 0.25
+      }), /* @__PURE__ */jsx(Spacer, {}), /* @__PURE__ */jsx(Paragraph, {
+        height: "$6",
+        wordWrap: "break-word",
+        maxWidth: "100%",
+        textAlign: "center",
+        paddingHorizontal: "$2",
+        size: "$1",
+        opacity: 0.5,
+        children: name
+      })]
+    }, name)), [search]);
+  return /* @__PURE__ */jsxs(YStack, {
+    minWidth: "100%",
+    padding: "$4",
+    paddingBottom: "$0",
+    space: !0,
+    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
+        })
+      })
+    })]
+  });
+}
+export { LucideIconsDemo };

package/dist/esm/PopoverDemo.js

@@ -1,13 +1,5 @@
 import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from "@tamagui/lucide-icons";
-import {
-  Adapt,
-  Button,
-  Input,
-  Label,
-  Popover,
-  XStack,
-  YStack
-} from "tamagui";
+import { Adapt, Button, Input, Label, Popover, XStack, YStack } from "tamagui";
 import { jsx, jsxs } from "react/jsx-runtime";
 function PopoverDemo() {
   return /* @__PURE__ */ jsxs(XStack, { space: "$2", flex: 1, justifyContent: "center", alignItems: "center", children: [

package/dist/esm/PopoverDemo.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/PopoverDemo.tsx"],
-  "mappings": "AAAA,SAAS,aAAa,aAAa,cAAc,iBAAiB;AAClE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AAIH,SACE,KADF;AAFG,SAAS,cAAc;AAC5B,SACE,qBAAC,UAAO,OAAM,MAAK,MAAM,GAAG,gBAAe,UAAS,YAAW,UAC7D;AAAA,wBAAC,QAAK,WAAU,QAAO,MAAM,aAAa,MAAK,gBAAe;AAAA,IAC9D,oBAAC,QAAK,WAAU,UAAS,MAAM,aAAa,MAAK,kBAAiB;AAAA,IAClE,oBAAC,QAAK,WAAU,OAAM,MAAM,WAAW,MAAK,eAAc;AAAA,IAC1D,oBAAC,QAAK,WAAU,SAAQ,MAAM,cAAc,MAAK,iBAAgB;AAAA,KACnE;AAEJ;AAEO,SAAS,KAAK;AAAA,EACnB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiD;AAC/C,SACE,qBAAC,WAAQ,MAAK,MAAK,WAAS,IAAE,GAAG,OAC/B;AAAA,wBAAC,QAAQ,SAAR,EAAgB,SAAO,IACtB,8BAAC,UAAO,MAAM,MAAM,GACtB;AAAA,IAEA,oBAAC,SAAM,MAAK,MAAK,UAAS,SACxB,+BAAC,QAAQ,OAAR,EAAc,OAAK,IAAC,uBAAqB,IACxC;AAAA,0BAAC,QAAQ,MAAM,OAAd,EAAoB,SAAQ,MAC3B,8BAAC,MAAM,UAAN,EAAe,GAClB;AAAA,MACA;AAAA,QAAC,QAAQ,MAAM;AAAA,QAAd;AAAA,UACC,WAAU;AAAA,UACV,YAAY,EAAE,SAAS,EAAE;AAAA,UACzB,WAAW,EAAE,SAAS,EAAE;AAAA;AAAA,MAC1B;AAAA,OACF,GACF;AAAA,IAEA;AAAA,MAAC,QAAQ;AAAA,MAAR;AAAA,QACC,aAAa;AAAA,QACb,aAAY;AAAA,QACZ,YAAY,EAAE,GAAG,KAAK,SAAS,EAAE;AAAA,QACjC,WAAW,EAAE,GAAG,KAAK,SAAS,EAAE;AAAA,QAChC,SAAO;AAAA,QACP,WAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE,SAAS;AAAA,cACP,mBAAmB;AAAA,YACrB;AAAA,UACF;AAAA,QACF;AAAA,QAEA;AAAA,8BAAC,QAAQ,OAAR,EAAc,aAAa,GAAG,aAAY,gBAAe;AAAA,UAE1D,qBAAC,UAAO,OAAM,MACZ;AAAA,iCAAC,UAAO,OAAM,MACZ;AAAA,kCAAC,SAAM,MAAK,MAAK,SAAS,MAAM,kBAEhC;AAAA,cACA,oBAAC,SAAM,MAAK,MAAK,IAAI,MAAM;AAAA,eAC7B;AAAA,YAEA,oBAAC,QAAQ,OAAR,EAAc,SAAO,IACpB;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS,MAAM;AAAA,gBAEf;AAAA,gBACD;AAAA;AAAA,YAED,GACF;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
+  "mappings": "AAAA,SAAS,aAAa,aAAa,cAAc,iBAAiB;AAElE,SAAS,OAAO,QAAQ,OAAO,OAAO,SAAS,QAAQ,cAAc;AAIjE,SACE,KADF;AAFG,SAAS,cAAc;AAC5B,SACE,qBAAC,UAAO,OAAM,MAAK,MAAM,GAAG,gBAAe,UAAS,YAAW,UAC7D;AAAA,wBAAC,QAAK,WAAU,QAAO,MAAM,aAAa,MAAK,gBAAe;AAAA,IAC9D,oBAAC,QAAK,WAAU,UAAS,MAAM,aAAa,MAAK,kBAAiB;AAAA,IAClE,oBAAC,QAAK,WAAU,OAAM,MAAM,WAAW,MAAK,eAAc;AAAA,IAC1D,oBAAC,QAAK,WAAU,SAAQ,MAAM,cAAc,MAAK,iBAAgB;AAAA,KACnE;AAEJ;AAEO,SAAS,KAAK;AAAA,EACnB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiD;AAC/C,SACE,qBAAC,WAAQ,MAAK,MAAK,WAAS,IAAE,GAAG,OAC/B;AAAA,wBAAC,QAAQ,SAAR,EAAgB,SAAO,IACtB,8BAAC,UAAO,MAAM,MAAM,GACtB;AAAA,IAEA,oBAAC,SAAM,MAAK,MAAK,UAAS,SACxB,+BAAC,QAAQ,OAAR,EAAc,OAAK,IAAC,uBAAqB,IACxC;AAAA,0BAAC,QAAQ,MAAM,OAAd,EAAoB,SAAQ,MAC3B,8BAAC,MAAM,UAAN,EAAe,GAClB;AAAA,MACA;AAAA,QAAC,QAAQ,MAAM;AAAA,QAAd;AAAA,UACC,WAAU;AAAA,UACV,YAAY,EAAE,SAAS,EAAE;AAAA,UACzB,WAAW,EAAE,SAAS,EAAE;AAAA;AAAA,MAC1B;AAAA,OACF,GACF;AAAA,IAEA;AAAA,MAAC,QAAQ;AAAA,MAAR;AAAA,QACC,aAAa;AAAA,QACb,aAAY;AAAA,QACZ,YAAY,EAAE,GAAG,KAAK,SAAS,EAAE;AAAA,QACjC,WAAW,EAAE,GAAG,KAAK,SAAS,EAAE;AAAA,QAChC,SAAO;AAAA,QACP,WAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE,SAAS;AAAA,cACP,mBAAmB;AAAA,YACrB;AAAA,UACF;AAAA,QACF;AAAA,QAEA;AAAA,8BAAC,QAAQ,OAAR,EAAc,aAAa,GAAG,aAAY,gBAAe;AAAA,UAE1D,qBAAC,UAAO,OAAM,MACZ;AAAA,iCAAC,UAAO,OAAM,MACZ;AAAA,kCAAC,SAAM,MAAK,MAAK,SAAS,MAAM,kBAEhC;AAAA,cACA,oBAAC,SAAM,MAAK,MAAK,IAAI,MAAM;AAAA,eAC7B;AAAA,YAEA,oBAAC,QAAQ,OAAR,EAAc,SAAO,IACpB;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS,MAAM;AAAA,gBAEf;AAAA,gBACD;AAAA;AAAA,YAED,GACF;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
   "names": []
 }