@tamagui/demos 1.2.17 → 1.3.0

package/dist/cjs/CheckboxDemo.js

@@ -0,0 +1,45 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var CheckboxDemo_exports = {};
+__export(CheckboxDemo_exports, {
+  CheckboxDemo: () => CheckboxDemo
+});
+module.exports = __toCommonJS(CheckboxDemo_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_lucide_icons = require("@tamagui/lucide-icons");
+var import_tamagui = require("tamagui");
+function CheckboxDemo() {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { w: 300, ai: "center", space: "$2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxWithLabel, { size: "$3" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxWithLabel, { size: "$4", defaultChecked: true }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxWithLabel, { size: "$5" })
+  ] });
+}
+function CheckboxWithLabel(props) {
+  const id = `checkbox-${props.size.toString().slice(1)}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { w: 300, ai: "center", space: "$4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Checkbox, { id, size: props.size, defaultChecked: props.defaultChecked, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Check, {}) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, { size: props.size, htmlFor: id, children: "Accept terms and conditions" })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CheckboxDemo
+});
+//# sourceMappingURL=CheckboxDemo.js.map

package/dist/cjs/CheckboxDemo.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/CheckboxDemo.tsx"],
+  "sourcesContent": ["import { Check as CheckIcon } from '@tamagui/lucide-icons'\nimport { Checkbox, Label, SizeTokens, XStack, YStack } from 'tamagui'\n\nexport function CheckboxDemo() {\n  return (\n    <YStack w={300} ai=\"center\" space=\"$2\">\n      <CheckboxWithLabel size=\"$3\" />\n      <CheckboxWithLabel size=\"$4\" defaultChecked />\n      <CheckboxWithLabel size=\"$5\" />\n    </YStack>\n  )\n}\n\nfunction CheckboxWithLabel(props: { size: SizeTokens; defaultChecked?: boolean }) {\n  const id = `checkbox-${props.size.toString().slice(1)}`\n  return (\n    <XStack w={300} ai=\"center\" space=\"$4\">\n      <Checkbox id={id} size={props.size} defaultChecked={props.defaultChecked}>\n        <Checkbox.Indicator>\n          <CheckIcon />\n        </Checkbox.Indicator>\n      </Checkbox>\n\n      <Label size={props.size} htmlFor={id}>\n        Accept terms and conditions\n      </Label>\n    </XStack>\n  )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKI;AALJ,0BAAmC;AACnC,qBAA4D;AAErD,SAAS,eAAe;AAC7B,SACE,6CAAC,yBAAO,GAAG,KAAK,IAAG,UAAS,OAAM,MAChC;AAAA,gDAAC,qBAAkB,MAAK,MAAK;AAAA,IAC7B,4CAAC,qBAAkB,MAAK,MAAK,gBAAc,MAAC;AAAA,IAC5C,4CAAC,qBAAkB,MAAK,MAAK;AAAA,KAC/B;AAEJ;AAEA,SAAS,kBAAkB,OAAuD;AAChF,QAAM,KAAK,YAAY,MAAM,KAAK,SAAS,EAAE,MAAM,CAAC;AACpD,SACE,6CAAC,yBAAO,GAAG,KAAK,IAAG,UAAS,OAAM,MAChC;AAAA,gDAAC,2BAAS,IAAQ,MAAM,MAAM,MAAM,gBAAgB,MAAM,gBACxD,sDAAC,wBAAS,WAAT,EACC,sDAAC,oBAAAA,OAAA,EAAU,GACb,GACF;AAAA,IAEA,4CAAC,wBAAM,MAAM,MAAM,MAAM,SAAS,IAAI,yCAEtC;AAAA,KACF;AAEJ;",
+  "names": ["CheckIcon"]
+}

package/dist/cjs/DialogDemo.js

@@ -67,11 +67,11 @@ function DialogDemo() {
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Input, { f: 1, id: "name", defaultValue: "Nate Wienert" })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Fieldset, { space: "$4", horizontal: true, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, { w: 160, justifyContent: "flex-end", htmlFor: "username", children: "Food" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, { w: 160, justifyContent: "flex-end", htmlFor: "username", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.TooltipSimple, { label: "Pick your favorite", placement: "bottom-start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, { children: "Food" }) }) }),
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_SelectDemo.SelectDemo, {})
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { ai: "flex-end", mt: "$2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Dialog.Close, { displayWhenAdapted: true, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "alt1", "aria-label": "Close", children: "Save changes" }) }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Unspaced, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { pos: "absolute", t: "$2", r: "$2", size: "$3", circular: true, icon: import_lucide_icons.X }) }) })
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Unspaced, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { pos: "absolute", t: "$3", r: "$3", size: "$2", circular: true, icon: import_lucide_icons.X }) }) })
           ]
         },
         "content"

package/dist/cjs/DialogDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DialogDemo.tsx"],
-  "sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n  Adapt,\n  Button,\n  Dialog,\n  Fieldset,\n  H2,\n  Input,\n  Label,\n  Sheet,\n  Unspaced,\n  YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n  return (\n    <Dialog modal>\n      <Dialog.Trigger asChild>\n        <Button>Edit Profile</Button>\n      </Dialog.Trigger>\n\n      <Adapt when=\"sm\" platform=\"touch\">\n        <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n          <Sheet.Frame padding=\"$4\" space>\n            <Adapt.Contents />\n          </Sheet.Frame>\n          <Sheet.Overlay />\n        </Sheet>\n      </Adapt>\n\n      <Dialog.Portal>\n        <Dialog.Overlay\n          key=\"overlay\"\n          animation=\"quick\"\n          o={0.5}\n          enterStyle={{ o: 0 }}\n          exitStyle={{ o: 0 }}\n        />\n\n        <Dialog.Content\n          bordered\n          elevate\n          key=\"content\"\n          animation={[\n            'quick',\n            {\n              opacity: {\n                overshootClamping: true,\n              },\n            },\n          ]}\n          enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n          exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n          space\n        >\n          <Dialog.Title>Edit profile</Dialog.Title>\n          <Dialog.Description>\n            Make changes to your profile here. Click save when you're done.\n          </Dialog.Description>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n              Name\n            </Label>\n            <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n          </Fieldset>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n              Food\n            </Label>\n            <SelectDemo />\n          </Fieldset>\n\n          <YStack ai=\"flex-end\" mt=\"$2\">\n            <Dialog.Close displayWhenAdapted asChild>\n              <Button theme=\"alt1\" aria-label=\"Close\">\n                Save changes\n              </Button>\n            </Dialog.Close>\n          </YStack>\n\n          <Unspaced>\n            <Dialog.Close asChild>\n              <Button pos=\"absolute\" t=\"$2\" r=\"$2\" size=\"$3\" circular icon={X} />\n            </Dialog.Close>\n          </Unspaced>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog>\n  )\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBQ;AApBR,0BAAkB;AAClB,qBAWO;AAEP,wBAA2B;AAEpB,SAAS,aAAa;AAC3B,SACE,6CAAC,yBAAO,OAAK,MACX;AAAA,gDAAC,sBAAO,SAAP,EAAe,SAAO,MACrB,sDAAC,yBAAO,0BAAY,GACtB;AAAA,IAEA,4CAAC,wBAAM,MAAK,MAAK,UAAS,SACxB,uDAAC,wBAAM,QAAQ,KAAQ,OAAK,MAAC,uBAAqB,MAChD;AAAA,kDAAC,qBAAM,OAAN,EAAY,SAAQ,MAAK,OAAK,MAC7B,sDAAC,qBAAM,UAAN,EAAe,GAClB;AAAA,MACA,4CAAC,qBAAM,SAAN,EAAc;AAAA,OACjB,GACF;AAAA,IAEA,6CAAC,sBAAO,QAAP,EACC;AAAA;AAAA,QAAC,sBAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,GAAG;AAAA,UACH,YAAY,EAAE,GAAG,EAAE;AAAA,UACnB,WAAW,EAAE,GAAG,EAAE;AAAA;AAAA,QAJd;AAAA,MAKN;AAAA,MAEA;AAAA,QAAC,sBAAO;AAAA,QAAP;AAAA,UACC,UAAQ;AAAA,UACR,SAAO;AAAA,UAEP,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,OAAK;AAAA,UAEL;AAAA,wDAAC,sBAAO,OAAP,EAAa,0BAAY;AAAA,YAC1B,4CAAC,sBAAO,aAAP,EAAmB,6EAEpB;AAAA,YACA,6CAAC,2BAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,0DAAC,wBAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,QAAO,kBAExD;AAAA,cACA,4CAAC,wBAAM,GAAG,GAAG,IAAG,QAAO,cAAa,gBAAe;AAAA,eACrD;AAAA,YACA,6CAAC,2BAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,0DAAC,wBAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,YAAW,kBAE5D;AAAA,cACA,4CAAC,gCAAW;AAAA,eACd;AAAA,YAEA,4CAAC,yBAAO,IAAG,YAAW,IAAG,MACvB,sDAAC,sBAAO,OAAP,EAAa,oBAAkB,MAAC,SAAO,MACtC,sDAAC,yBAAO,OAAM,QAAO,cAAW,SAAQ,0BAExC,GACF,GACF;AAAA,YAEA,4CAAC,2BACC,sDAAC,sBAAO,OAAP,EAAa,SAAO,MACnB,sDAAC,yBAAO,KAAI,YAAW,GAAE,MAAK,GAAE,MAAK,MAAK,MAAK,UAAQ,MAAC,MAAM,uBAAG,GACnE,GACF;AAAA;AAAA;AAAA,QA1CI;AAAA,MA2CN;AAAA,OACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n  Adapt,\n  Button,\n  Dialog,\n  Fieldset,\n  H2,\n  Input,\n  Label,\n  Paragraph,\n  Sheet,\n  TooltipSimple,\n  Unspaced,\n  YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n  return (\n    <Dialog modal>\n      <Dialog.Trigger asChild>\n        <Button>Edit Profile</Button>\n      </Dialog.Trigger>\n\n      <Adapt when=\"sm\" platform=\"touch\">\n        <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n          <Sheet.Frame padding=\"$4\" space>\n            <Adapt.Contents />\n          </Sheet.Frame>\n          <Sheet.Overlay />\n        </Sheet>\n      </Adapt>\n\n      <Dialog.Portal>\n        <Dialog.Overlay\n          key=\"overlay\"\n          animation=\"quick\"\n          o={0.5}\n          enterStyle={{ o: 0 }}\n          exitStyle={{ o: 0 }}\n        />\n\n        <Dialog.Content\n          bordered\n          elevate\n          key=\"content\"\n          animation={[\n            'quick',\n            {\n              opacity: {\n                overshootClamping: true,\n              },\n            },\n          ]}\n          enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n          exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n          space\n        >\n          <Dialog.Title>Edit profile</Dialog.Title>\n          <Dialog.Description>\n            Make changes to your profile here. Click save when you're done.\n          </Dialog.Description>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n              Name\n            </Label>\n            <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n          </Fieldset>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n              <TooltipSimple label=\"Pick your favorite\" placement=\"bottom-start\">\n                <Paragraph>Food</Paragraph>\n              </TooltipSimple>\n            </Label>\n            <SelectDemo />\n          </Fieldset>\n\n          <YStack ai=\"flex-end\" mt=\"$2\">\n            <Dialog.Close displayWhenAdapted asChild>\n              <Button theme=\"alt1\" aria-label=\"Close\">\n                Save changes\n              </Button>\n            </Dialog.Close>\n          </YStack>\n\n          <Unspaced>\n            <Dialog.Close asChild>\n              <Button pos=\"absolute\" t=\"$3\" r=\"$3\" size=\"$2\" circular icon={X} />\n            </Dialog.Close>\n          </Unspaced>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog>\n  )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBQ;AAtBR,0BAAkB;AAClB,qBAaO;AAEP,wBAA2B;AAEpB,SAAS,aAAa;AAC3B,SACE,6CAAC,yBAAO,OAAK,MACX;AAAA,gDAAC,sBAAO,SAAP,EAAe,SAAO,MACrB,sDAAC,yBAAO,0BAAY,GACtB;AAAA,IAEA,4CAAC,wBAAM,MAAK,MAAK,UAAS,SACxB,uDAAC,wBAAM,QAAQ,KAAQ,OAAK,MAAC,uBAAqB,MAChD;AAAA,kDAAC,qBAAM,OAAN,EAAY,SAAQ,MAAK,OAAK,MAC7B,sDAAC,qBAAM,UAAN,EAAe,GAClB;AAAA,MACA,4CAAC,qBAAM,SAAN,EAAc;AAAA,OACjB,GACF;AAAA,IAEA,6CAAC,sBAAO,QAAP,EACC;AAAA;AAAA,QAAC,sBAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,GAAG;AAAA,UACH,YAAY,EAAE,GAAG,EAAE;AAAA,UACnB,WAAW,EAAE,GAAG,EAAE;AAAA;AAAA,QAJd;AAAA,MAKN;AAAA,MAEA;AAAA,QAAC,sBAAO;AAAA,QAAP;AAAA,UACC,UAAQ;AAAA,UACR,SAAO;AAAA,UAEP,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,OAAK;AAAA,UAEL;AAAA,wDAAC,sBAAO,OAAP,EAAa,0BAAY;AAAA,YAC1B,4CAAC,sBAAO,aAAP,EAAmB,6EAEpB;AAAA,YACA,6CAAC,2BAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,0DAAC,wBAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,QAAO,kBAExD;AAAA,cACA,4CAAC,wBAAM,GAAG,GAAG,IAAG,QAAO,cAAa,gBAAe;AAAA,eACrD;AAAA,YACA,6CAAC,2BAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,0DAAC,wBAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,YAC/C,sDAAC,gCAAc,OAAM,sBAAqB,WAAU,gBAClD,sDAAC,4BAAU,kBAAI,GACjB,GACF;AAAA,cACA,4CAAC,gCAAW;AAAA,eACd;AAAA,YAEA,4CAAC,yBAAO,IAAG,YAAW,IAAG,MACvB,sDAAC,sBAAO,OAAP,EAAa,oBAAkB,MAAC,SAAO,MACtC,sDAAC,yBAAO,OAAM,QAAO,cAAW,SAAQ,0BAExC,GACF,GACF;AAAA,YAEA,4CAAC,2BACC,sDAAC,sBAAO,OAAP,EAAa,SAAO,MACnB,sDAAC,yBAAO,KAAI,YAAW,GAAE,MAAK,GAAE,MAAK,MAAK,MAAK,UAAQ,MAAC,MAAM,uBAAG,GACnE,GACF;AAAA;AAAA;AAAA,QA5CI;AAAA,MA6CN;AAAA,OACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/cjs/FormsDemo.js

@@ -22,20 +22,36 @@ __export(FormsDemo_exports, {
 });
 module.exports = __toCommonJS(FormsDemo_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_tamagui = require("tamagui");
-function FormsDemo() {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { w: 200, mih: 250, overflow: "hidden", space: "$2", m: "$3", p: "$2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormDemo, { size: "$2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormDemo, { size: "$3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormDemo, { size: "$4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.TextArea, { mih: 140, placeholder: "Enter your details...", numberOfLines: 4 })
-  ] });
-}
-function FormDemo(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { ai: "center", space: "$2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Input, { f: 1, size: props.size, placeholder: `Size ${props.size}...` }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { size: props.size, children: "Go" })
-  ] });
+function FormsDemo(props) {
+  const [status, setStatus] = (0, import_react.useState)("off");
+  (0, import_react.useEffect)(() => {
+    if (status === "submitting") {
+      const timer = setTimeout(() => setStatus("off"), 2e3);
+      return () => {
+        clearTimeout(timer);
+      };
+    }
+  }, [status]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_tamagui.Form,
+    {
+      ai: "center",
+      miw: 300,
+      space: true,
+      onSubmit: () => setStatus("submitting"),
+      bw: 1,
+      br: "$4",
+      bc: "$background",
+      boc: "$borderColor",
+      p: "$8",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.H4, { children: status[0].toUpperCase() + status.slice(1) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Form.Trigger, { asChild: true, disabled: status !== "off", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { icon: status === "submitting" ? () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Spinner, {}) : void 0, children: "Submit" }) })
+      ]
+    }
+  );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/cjs/FormsDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/FormsDemo.tsx"],
-  "sourcesContent": ["import { Button, Input, SizeTokens, TextArea, XStack, YStack } from 'tamagui'\n\nexport function FormsDemo() {\n  return (\n    <YStack w={200} mih={250} overflow=\"hidden\" space=\"$2\" m=\"$3\" p=\"$2\">\n      <FormDemo size=\"$2\" />\n      <FormDemo size=\"$3\" />\n      <FormDemo size=\"$4\" />\n      <TextArea mih={140} placeholder=\"Enter your details...\" numberOfLines={4} />\n    </YStack>\n  )\n}\n\nfunction FormDemo(props: { size: SizeTokens }) {\n  return (\n    <XStack ai=\"center\" space=\"$2\">\n      <Input f={1} size={props.size} placeholder={`Size ${props.size}...`} />\n      <Button size={props.size}>Go</Button>\n    </XStack>\n  )\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAII;AAJJ,qBAAoE;AAE7D,SAAS,YAAY;AAC1B,SACE,6CAAC,yBAAO,GAAG,KAAK,KAAK,KAAK,UAAS,UAAS,OAAM,MAAK,GAAE,MAAK,GAAE,MAC9D;AAAA,gDAAC,YAAS,MAAK,MAAK;AAAA,IACpB,4CAAC,YAAS,MAAK,MAAK;AAAA,IACpB,4CAAC,YAAS,MAAK,MAAK;AAAA,IACpB,4CAAC,2BAAS,KAAK,KAAK,aAAY,yBAAwB,eAAe,GAAG;AAAA,KAC5E;AAEJ;AAEA,SAAS,SAAS,OAA6B;AAC7C,SACE,6CAAC,yBAAO,IAAG,UAAS,OAAM,MACxB;AAAA,gDAAC,wBAAM,GAAG,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,WAAW;AAAA,IACrE,4CAAC,yBAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
+  "sourcesContent": ["import { stat } from 'fs'\n\nimport { useEffect, useState } from 'react'\nimport { Button, Form, H4, SizeTokens, Spinner, XStack, YStack } from 'tamagui'\n\nexport function FormsDemo(props: { size: SizeTokens }) {\n  const [status, setStatus] = useState<'off' | 'submitting' | 'submitted'>('off')\n\n  useEffect(() => {\n    if (status === 'submitting') {\n      const timer = setTimeout(() => setStatus('off'), 2000)\n      return () => {\n        clearTimeout(timer)\n      }\n    }\n  }, [status])\n\n  return (\n    <Form\n      ai=\"center\"\n      miw={300}\n      space\n      onSubmit={() => setStatus('submitting')}\n      bw={1}\n      br=\"$4\"\n      bc=\"$background\"\n      boc=\"$borderColor\"\n      p=\"$8\"\n    >\n      <H4>{status[0].toUpperCase() + status.slice(1)}</H4>\n\n      <Form.Trigger asChild disabled={status !== 'off'}>\n        <Button icon={status === 'submitting' ? () => <Spinner /> : undefined}>\n          Submit\n        </Button>\n      </Form.Trigger>\n    </Form>\n  )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkBI;AAhBJ,mBAAoC;AACpC,qBAAsE;AAE/D,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAA6C,KAAK;AAE9E,8BAAU,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;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,KAAK;AAAA,MACL,OAAK;AAAA,MACL,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,IAAI;AAAA,MACJ,IAAG;AAAA,MACH,IAAG;AAAA,MACH,KAAI;AAAA,MACJ,GAAE;AAAA,MAEF;AAAA,oDAAC,qBAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,4CAAC,oBAAK,SAAL,EAAa,SAAO,MAAC,UAAU,WAAW,OACzC,sDAAC,yBAAO,MAAM,WAAW,eAAe,MAAM,4CAAC,0BAAQ,IAAK,QAAW,oBAEvE,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/cjs/index.js

@@ -29,6 +29,7 @@ __export(src_exports, {
   AvatarDemo: () => import_AvatarDemo.AvatarDemo,
   ButtonDemo: () => import_ButtonDemo.ButtonDemo,
   CardDemo: () => import_CardDemo.CardDemo,
+  CheckboxDemo: () => import_CheckboxDemo.CheckboxDemo,
   ColorsDemo: () => import_ColorsDemo.ColorsDemo,
   DialogDemo: () => import_DialogDemo.DialogDemo,
   FeatherIconsDemo: () => import_FeatherIconsDemo.FeatherIconsDemo,
@@ -90,6 +91,7 @@ var import_SliderDemo = require("./SliderDemo");
 var import_SpinnerDemo = require("./SpinnerDemo");
 var import_StacksDemo = require("./StacksDemo");
 var import_SwitchDemo = require("./SwitchDemo");
+var import_CheckboxDemo = require("./CheckboxDemo");
 var import_TextDemo = require("./TextDemo");
 var import_ThemeInverseDemo = require("./ThemeInverseDemo");
 var import_TooltipDemo = require("./TooltipDemo");
@@ -108,6 +110,7 @@ __reExport(src_exports, require("./useOnIntersecting"), module.exports);
   AvatarDemo,
   ButtonDemo,
   CardDemo,
+  CheckboxDemo,
   ColorsDemo,
   DialogDemo,
   FeatherIconsDemo,

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx"],
-  "sourcesContent": ["export { AlertDialogDemo } from './AlertDialogDemo'\nexport { AnimationsDemo } from './AnimationsDemo'\nexport { AnimationsEnterDemo } from './AnimationsEnterDemo'\nexport { AnimationsHoverDemo } from './AnimationsHoverDemo'\nexport { AnimationsTimingDemo } from './AnimationsTimingDemo'\nexport { AnimationsPresenceDemo } from './AnimationsPresenceDemo'\nexport { AvatarDemo } from './AvatarDemo'\nexport { ButtonDemo } from './ButtonDemo'\nexport { CardDemo } from './CardDemo'\nexport { DialogDemo } from './DialogDemo'\nexport { AddThemeDemo } from './AddThemeDemo'\nexport { UpdateThemeDemo } from './UpdateThemeDemo'\nexport { FeatherIconsDemo } from './FeatherIconsDemo'\nexport { FormsDemo } from './FormsDemo'\nexport { GroupDemo } from './GroupDemo'\nexport { HeadingsDemo } from './HeadingsDemo'\nexport { ImageDemo } from './ImageDemo'\nexport { LabelDemo } from './LabelDemo'\nexport { LinearGradientDemo } from './LinearGradientDemo'\nexport { ListItemDemo } from './ListItemDemo'\nexport { LucideIconsDemo } from './LucideIconsDemo'\nexport { PopoverDemo } from './PopoverDemo'\nexport { ProgressDemo } from './ProgressDemo'\nexport { SelectDemo } from './SelectDemo'\nexport { SeparatorDemo } from './SeparatorDemo'\nexport { ShapesDemo } from './ShapesDemo'\nexport { ScrollViewDemo } from './ScrollViewDemo'\nexport { SheetDemo } from './SheetDemo'\nexport { SliderDemo } from './SliderDemo'\nexport { SpinnerDemo } from './SpinnerDemo'\nexport { StacksDemo } from './StacksDemo'\nexport { SwitchDemo } from './SwitchDemo'\nexport { TextDemo } from './TextDemo'\nexport { ThemeInverseDemo } from './ThemeInverseDemo'\nexport { TooltipDemo } from './TooltipDemo'\nexport { ColorsDemo } from './ColorsDemo'\nexport { TokensDemo } from './TokensDemo'\nexport * from './useOnIntersecting'\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAAgC;AAChC,4BAA+B;AAC/B,iCAAoC;AACpC,iCAAoC;AACpC,kCAAqC;AACrC,oCAAuC;AACvC,wBAA2B;AAC3B,wBAA2B;AAC3B,sBAAyB;AACzB,wBAA2B;AAC3B,0BAA6B;AAC7B,6BAAgC;AAChC,8BAAiC;AACjC,uBAA0B;AAC1B,uBAA0B;AAC1B,0BAA6B;AAC7B,uBAA0B;AAC1B,uBAA0B;AAC1B,gCAAmC;AACnC,0BAA6B;AAC7B,6BAAgC;AAChC,yBAA4B;AAC5B,0BAA6B;AAC7B,wBAA2B;AAC3B,2BAA8B;AAC9B,wBAA2B;AAC3B,4BAA+B;AAC/B,uBAA0B;AAC1B,wBAA2B;AAC3B,yBAA4B;AAC5B,wBAA2B;AAC3B,wBAA2B;AAC3B,sBAAyB;AACzB,8BAAiC;AACjC,yBAA4B;AAC5B,wBAA2B;AAC3B,wBAA2B;AAC3B,wBAAc,gCArCd;",
+  "sourcesContent": ["export { AlertDialogDemo } from './AlertDialogDemo'\nexport { AnimationsDemo } from './AnimationsDemo'\nexport { AnimationsEnterDemo } from './AnimationsEnterDemo'\nexport { AnimationsHoverDemo } from './AnimationsHoverDemo'\nexport { AnimationsTimingDemo } from './AnimationsTimingDemo'\nexport { AnimationsPresenceDemo } from './AnimationsPresenceDemo'\nexport { AvatarDemo } from './AvatarDemo'\nexport { ButtonDemo } from './ButtonDemo'\nexport { CardDemo } from './CardDemo'\nexport { DialogDemo } from './DialogDemo'\nexport { AddThemeDemo } from './AddThemeDemo'\nexport { UpdateThemeDemo } from './UpdateThemeDemo'\nexport { FeatherIconsDemo } from './FeatherIconsDemo'\nexport { FormsDemo } from './FormsDemo'\nexport { GroupDemo } from './GroupDemo'\nexport { HeadingsDemo } from './HeadingsDemo'\nexport { ImageDemo } from './ImageDemo'\nexport { LabelDemo } from './LabelDemo'\nexport { LinearGradientDemo } from './LinearGradientDemo'\nexport { ListItemDemo } from './ListItemDemo'\nexport { LucideIconsDemo } from './LucideIconsDemo'\nexport { PopoverDemo } from './PopoverDemo'\nexport { ProgressDemo } from './ProgressDemo'\nexport { SelectDemo } from './SelectDemo'\nexport { SeparatorDemo } from './SeparatorDemo'\nexport { ShapesDemo } from './ShapesDemo'\nexport { ScrollViewDemo } from './ScrollViewDemo'\nexport { SheetDemo } from './SheetDemo'\nexport { SliderDemo } from './SliderDemo'\nexport { SpinnerDemo } from './SpinnerDemo'\nexport { StacksDemo } from './StacksDemo'\nexport { SwitchDemo } from './SwitchDemo'\nexport { CheckboxDemo } from './CheckboxDemo'\nexport { TextDemo } from './TextDemo'\nexport { ThemeInverseDemo } from './ThemeInverseDemo'\nexport { TooltipDemo } from './TooltipDemo'\nexport { ColorsDemo } from './ColorsDemo'\nexport { TokensDemo } from './TokensDemo'\nexport * from './useOnIntersecting'\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,6BAAgC;AAChC,4BAA+B;AAC/B,iCAAoC;AACpC,iCAAoC;AACpC,kCAAqC;AACrC,oCAAuC;AACvC,wBAA2B;AAC3B,wBAA2B;AAC3B,sBAAyB;AACzB,wBAA2B;AAC3B,0BAA6B;AAC7B,6BAAgC;AAChC,8BAAiC;AACjC,uBAA0B;AAC1B,uBAA0B;AAC1B,0BAA6B;AAC7B,uBAA0B;AAC1B,uBAA0B;AAC1B,gCAAmC;AACnC,0BAA6B;AAC7B,6BAAgC;AAChC,yBAA4B;AAC5B,0BAA6B;AAC7B,wBAA2B;AAC3B,2BAA8B;AAC9B,wBAA2B;AAC3B,4BAA+B;AAC/B,uBAA0B;AAC1B,wBAA2B;AAC3B,yBAA4B;AAC5B,wBAA2B;AAC3B,wBAA2B;AAC3B,0BAA6B;AAC7B,sBAAyB;AACzB,8BAAiC;AACjC,yBAA4B;AAC5B,wBAA2B;AAC3B,wBAA2B;AAC3B,wBAAc,gCAtCd;",
   "names": []
 }

package/dist/esm/CheckboxDemo.js

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check as CheckIcon } from "@tamagui/lucide-icons";
+import { Checkbox, Label, XStack, YStack } from "tamagui";
+function CheckboxDemo() {
+  return /* @__PURE__ */ jsxs(YStack, { w: 300, ai: "center", space: "$2", children: [
+    /* @__PURE__ */ jsx(CheckboxWithLabel, { size: "$3" }),
+    /* @__PURE__ */ jsx(CheckboxWithLabel, { size: "$4", defaultChecked: true }),
+    /* @__PURE__ */ jsx(CheckboxWithLabel, { size: "$5" })
+  ] });
+}
+function CheckboxWithLabel(props) {
+  const id = `checkbox-${props.size.toString().slice(1)}`;
+  return /* @__PURE__ */ jsxs(XStack, { w: 300, ai: "center", space: "$4", children: [
+    /* @__PURE__ */ jsx(Checkbox, { id, size: props.size, defaultChecked: props.defaultChecked, children: /* @__PURE__ */ jsx(Checkbox.Indicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) }) }),
+    /* @__PURE__ */ jsx(Label, { size: props.size, htmlFor: id, children: "Accept terms and conditions" })
+  ] });
+}
+export {
+  CheckboxDemo
+};
+//# sourceMappingURL=CheckboxDemo.js.map

package/dist/esm/CheckboxDemo.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/CheckboxDemo.tsx"],
+  "sourcesContent": ["import { Check as CheckIcon } from '@tamagui/lucide-icons'\nimport { Checkbox, Label, SizeTokens, XStack, YStack } from 'tamagui'\n\nexport function CheckboxDemo() {\n  return (\n    <YStack w={300} ai=\"center\" space=\"$2\">\n      <CheckboxWithLabel size=\"$3\" />\n      <CheckboxWithLabel size=\"$4\" defaultChecked />\n      <CheckboxWithLabel size=\"$5\" />\n    </YStack>\n  )\n}\n\nfunction CheckboxWithLabel(props: { size: SizeTokens; defaultChecked?: boolean }) {\n  const id = `checkbox-${props.size.toString().slice(1)}`\n  return (\n    <XStack w={300} ai=\"center\" space=\"$4\">\n      <Checkbox id={id} size={props.size} defaultChecked={props.defaultChecked}>\n        <Checkbox.Indicator>\n          <CheckIcon />\n        </Checkbox.Indicator>\n      </Checkbox>\n\n      <Label size={props.size} htmlFor={id}>\n        Accept terms and conditions\n      </Label>\n    </XStack>\n  )\n}\n"],
+  "mappings": "AAKI,SACE,KADF;AALJ,SAAS,SAAS,iBAAiB;AACnC,SAAS,UAAU,OAAmB,QAAQ,cAAc;AAErD,SAAS,eAAe;AAC7B,SACE,qBAAC,UAAO,GAAG,KAAK,IAAG,UAAS,OAAM,MAChC;AAAA,wBAAC,qBAAkB,MAAK,MAAK;AAAA,IAC7B,oBAAC,qBAAkB,MAAK,MAAK,gBAAc,MAAC;AAAA,IAC5C,oBAAC,qBAAkB,MAAK,MAAK;AAAA,KAC/B;AAEJ;AAEA,SAAS,kBAAkB,OAAuD;AAChF,QAAM,KAAK,YAAY,MAAM,KAAK,SAAS,EAAE,MAAM,CAAC;AACpD,SACE,qBAAC,UAAO,GAAG,KAAK,IAAG,UAAS,OAAM,MAChC;AAAA,wBAAC,YAAS,IAAQ,MAAM,MAAM,MAAM,gBAAgB,MAAM,gBACxD,8BAAC,SAAS,WAAT,EACC,8BAAC,aAAU,GACb,GACF;AAAA,IAEA,oBAAC,SAAM,MAAM,MAAM,MAAM,SAAS,IAAI,yCAEtC;AAAA,KACF;AAEJ;",
+  "names": []
+}

package/dist/esm/CheckboxDemo.mjs

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check as CheckIcon } from "@tamagui/lucide-icons";
+import { Checkbox, Label, XStack, YStack } from "tamagui";
+function CheckboxDemo() {
+  return /* @__PURE__ */ jsxs(YStack, { w: 300, ai: "center", space: "$2", children: [
+    /* @__PURE__ */ jsx(CheckboxWithLabel, { size: "$3" }),
+    /* @__PURE__ */ jsx(CheckboxWithLabel, { size: "$4", defaultChecked: true }),
+    /* @__PURE__ */ jsx(CheckboxWithLabel, { size: "$5" })
+  ] });
+}
+function CheckboxWithLabel(props) {
+  const id = `checkbox-${props.size.toString().slice(1)}`;
+  return /* @__PURE__ */ jsxs(XStack, { w: 300, ai: "center", space: "$4", children: [
+    /* @__PURE__ */ jsx(Checkbox, { id, size: props.size, defaultChecked: props.defaultChecked, children: /* @__PURE__ */ jsx(Checkbox.Indicator, { children: /* @__PURE__ */ jsx(CheckIcon, {}) }) }),
+    /* @__PURE__ */ jsx(Label, { size: props.size, htmlFor: id, children: "Accept terms and conditions" })
+  ] });
+}
+export {
+  CheckboxDemo
+};
+//# sourceMappingURL=CheckboxDemo.mjs.map

package/dist/esm/CheckboxDemo.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/CheckboxDemo.tsx"],
+  "sourcesContent": ["import { Check as CheckIcon } from '@tamagui/lucide-icons'\nimport { Checkbox, Label, SizeTokens, XStack, YStack } from 'tamagui'\n\nexport function CheckboxDemo() {\n  return (\n    <YStack w={300} ai=\"center\" space=\"$2\">\n      <CheckboxWithLabel size=\"$3\" />\n      <CheckboxWithLabel size=\"$4\" defaultChecked />\n      <CheckboxWithLabel size=\"$5\" />\n    </YStack>\n  )\n}\n\nfunction CheckboxWithLabel(props: { size: SizeTokens; defaultChecked?: boolean }) {\n  const id = `checkbox-${props.size.toString().slice(1)}`\n  return (\n    <XStack w={300} ai=\"center\" space=\"$4\">\n      <Checkbox id={id} size={props.size} defaultChecked={props.defaultChecked}>\n        <Checkbox.Indicator>\n          <CheckIcon />\n        </Checkbox.Indicator>\n      </Checkbox>\n\n      <Label size={props.size} htmlFor={id}>\n        Accept terms and conditions\n      </Label>\n    </XStack>\n  )\n}\n"],
+  "mappings": "AAKI,SACE,KADF;AALJ,SAAS,SAAS,iBAAiB;AACnC,SAAS,UAAU,OAAmB,QAAQ,cAAc;AAErD,SAAS,eAAe;AAC7B,SACE,qBAAC,UAAO,GAAG,KAAK,IAAG,UAAS,OAAM,MAChC;AAAA,wBAAC,qBAAkB,MAAK,MAAK;AAAA,IAC7B,oBAAC,qBAAkB,MAAK,MAAK,gBAAc,MAAC;AAAA,IAC5C,oBAAC,qBAAkB,MAAK,MAAK;AAAA,KAC/B;AAEJ;AAEA,SAAS,kBAAkB,OAAuD;AAChF,QAAM,KAAK,YAAY,MAAM,KAAK,SAAS,EAAE,MAAM,CAAC;AACpD,SACE,qBAAC,UAAO,GAAG,KAAK,IAAG,UAAS,OAAM,MAChC;AAAA,wBAAC,YAAS,IAAQ,MAAM,MAAM,MAAM,gBAAgB,MAAM,gBACxD,8BAAC,SAAS,WAAT,EACC,8BAAC,aAAU,GACb,GACF;AAAA,IAEA,oBAAC,SAAM,MAAM,MAAM,MAAM,SAAS,IAAI,yCAEtC;AAAA,KACF;AAEJ;",
+  "names": []
+}

package/dist/esm/DialogDemo.js

@@ -7,7 +7,9 @@ import {
   Fieldset,
   Input,
   Label,
+  Paragraph,
   Sheet,
+  TooltipSimple,
   Unspaced,
   YStack
 } from "tamagui";
@@ -54,11 +56,11 @@ function DialogDemo() {
               /* @__PURE__ */ jsx(Input, { f: 1, id: "name", defaultValue: "Nate Wienert" })
             ] }),
             /* @__PURE__ */ jsxs(Fieldset, { space: "$4", horizontal: true, children: [
-              /* @__PURE__ */ jsx(Label, { w: 160, justifyContent: "flex-end", htmlFor: "username", children: "Food" }),
+              /* @__PURE__ */ jsx(Label, { w: 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(SelectDemo, {})
             ] }),
             /* @__PURE__ */ jsx(YStack, { ai: "flex-end", mt: "$2", children: /* @__PURE__ */ jsx(Dialog.Close, { displayWhenAdapted: true, asChild: true, children: /* @__PURE__ */ jsx(Button, { theme: "alt1", "aria-label": "Close", children: "Save changes" }) }) }),
-            /* @__PURE__ */ jsx(Unspaced, { children: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { pos: "absolute", t: "$2", r: "$2", size: "$3", circular: true, icon: X }) }) })
+            /* @__PURE__ */ jsx(Unspaced, { children: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { pos: "absolute", t: "$3", r: "$3", size: "$2", circular: true, icon: X }) }) })
           ]
         },
         "content"

package/dist/esm/DialogDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DialogDemo.tsx"],
-  "sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n  Adapt,\n  Button,\n  Dialog,\n  Fieldset,\n  H2,\n  Input,\n  Label,\n  Sheet,\n  Unspaced,\n  YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n  return (\n    <Dialog modal>\n      <Dialog.Trigger asChild>\n        <Button>Edit Profile</Button>\n      </Dialog.Trigger>\n\n      <Adapt when=\"sm\" platform=\"touch\">\n        <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n          <Sheet.Frame padding=\"$4\" space>\n            <Adapt.Contents />\n          </Sheet.Frame>\n          <Sheet.Overlay />\n        </Sheet>\n      </Adapt>\n\n      <Dialog.Portal>\n        <Dialog.Overlay\n          key=\"overlay\"\n          animation=\"quick\"\n          o={0.5}\n          enterStyle={{ o: 0 }}\n          exitStyle={{ o: 0 }}\n        />\n\n        <Dialog.Content\n          bordered\n          elevate\n          key=\"content\"\n          animation={[\n            'quick',\n            {\n              opacity: {\n                overshootClamping: true,\n              },\n            },\n          ]}\n          enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n          exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n          space\n        >\n          <Dialog.Title>Edit profile</Dialog.Title>\n          <Dialog.Description>\n            Make changes to your profile here. Click save when you're done.\n          </Dialog.Description>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n              Name\n            </Label>\n            <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n          </Fieldset>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n              Food\n            </Label>\n            <SelectDemo />\n          </Fieldset>\n\n          <YStack ai=\"flex-end\" mt=\"$2\">\n            <Dialog.Close displayWhenAdapted asChild>\n              <Button theme=\"alt1\" aria-label=\"Close\">\n                Save changes\n              </Button>\n            </Dialog.Close>\n          </YStack>\n\n          <Unspaced>\n            <Dialog.Close asChild>\n              <Button pos=\"absolute\" t=\"$2\" r=\"$2\" size=\"$3\" circular icon={X} />\n            </Dialog.Close>\n          </Unspaced>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog>\n  )\n}\n"],
-  "mappings": "AAoBQ,cAIA,YAJA;AApBR,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,qBAAC,UAAO,OAAK,MACX;AAAA,wBAAC,OAAO,SAAP,EAAe,SAAO,MACrB,8BAAC,UAAO,0BAAY,GACtB;AAAA,IAEA,oBAAC,SAAM,MAAK,MAAK,UAAS,SACxB,+BAAC,SAAM,QAAQ,KAAQ,OAAK,MAAC,uBAAqB,MAChD;AAAA,0BAAC,MAAM,OAAN,EAAY,SAAQ,MAAK,OAAK,MAC7B,8BAAC,MAAM,UAAN,EAAe,GAClB;AAAA,MACA,oBAAC,MAAM,SAAN,EAAc;AAAA,OACjB,GACF;AAAA,IAEA,qBAAC,OAAO,QAAP,EACC;AAAA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,GAAG;AAAA,UACH,YAAY,EAAE,GAAG,EAAE;AAAA,UACnB,WAAW,EAAE,GAAG,EAAE;AAAA;AAAA,QAJd;AAAA,MAKN;AAAA,MAEA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UACC,UAAQ;AAAA,UACR,SAAO;AAAA,UAEP,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,OAAK;AAAA,UAEL;AAAA,gCAAC,OAAO,OAAP,EAAa,0BAAY;AAAA,YAC1B,oBAAC,OAAO,aAAP,EAAmB,6EAEpB;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,QAAO,kBAExD;AAAA,cACA,oBAAC,SAAM,GAAG,GAAG,IAAG,QAAO,cAAa,gBAAe;AAAA,eACrD;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,YAAW,kBAE5D;AAAA,cACA,oBAAC,cAAW;AAAA,eACd;AAAA,YAEA,oBAAC,UAAO,IAAG,YAAW,IAAG,MACvB,8BAAC,OAAO,OAAP,EAAa,oBAAkB,MAAC,SAAO,MACtC,8BAAC,UAAO,OAAM,QAAO,cAAW,SAAQ,0BAExC,GACF,GACF;AAAA,YAEA,oBAAC,YACC,8BAAC,OAAO,OAAP,EAAa,SAAO,MACnB,8BAAC,UAAO,KAAI,YAAW,GAAE,MAAK,GAAE,MAAK,MAAK,MAAK,UAAQ,MAAC,MAAM,GAAG,GACnE,GACF;AAAA;AAAA;AAAA,QA1CI;AAAA,MA2CN;AAAA,OACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n  Adapt,\n  Button,\n  Dialog,\n  Fieldset,\n  H2,\n  Input,\n  Label,\n  Paragraph,\n  Sheet,\n  TooltipSimple,\n  Unspaced,\n  YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n  return (\n    <Dialog modal>\n      <Dialog.Trigger asChild>\n        <Button>Edit Profile</Button>\n      </Dialog.Trigger>\n\n      <Adapt when=\"sm\" platform=\"touch\">\n        <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n          <Sheet.Frame padding=\"$4\" space>\n            <Adapt.Contents />\n          </Sheet.Frame>\n          <Sheet.Overlay />\n        </Sheet>\n      </Adapt>\n\n      <Dialog.Portal>\n        <Dialog.Overlay\n          key=\"overlay\"\n          animation=\"quick\"\n          o={0.5}\n          enterStyle={{ o: 0 }}\n          exitStyle={{ o: 0 }}\n        />\n\n        <Dialog.Content\n          bordered\n          elevate\n          key=\"content\"\n          animation={[\n            'quick',\n            {\n              opacity: {\n                overshootClamping: true,\n              },\n            },\n          ]}\n          enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n          exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n          space\n        >\n          <Dialog.Title>Edit profile</Dialog.Title>\n          <Dialog.Description>\n            Make changes to your profile here. Click save when you're done.\n          </Dialog.Description>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n              Name\n            </Label>\n            <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n          </Fieldset>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n              <TooltipSimple label=\"Pick your favorite\" placement=\"bottom-start\">\n                <Paragraph>Food</Paragraph>\n              </TooltipSimple>\n            </Label>\n            <SelectDemo />\n          </Fieldset>\n\n          <YStack ai=\"flex-end\" mt=\"$2\">\n            <Dialog.Close displayWhenAdapted asChild>\n              <Button theme=\"alt1\" aria-label=\"Close\">\n                Save changes\n              </Button>\n            </Dialog.Close>\n          </YStack>\n\n          <Unspaced>\n            <Dialog.Close asChild>\n              <Button pos=\"absolute\" t=\"$3\" r=\"$3\" size=\"$2\" circular icon={X} />\n            </Dialog.Close>\n          </Unspaced>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog>\n  )\n}\n"],
+  "mappings": "AAsBQ,cAIA,YAJA;AAtBR,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,qBAAC,UAAO,OAAK,MACX;AAAA,wBAAC,OAAO,SAAP,EAAe,SAAO,MACrB,8BAAC,UAAO,0BAAY,GACtB;AAAA,IAEA,oBAAC,SAAM,MAAK,MAAK,UAAS,SACxB,+BAAC,SAAM,QAAQ,KAAQ,OAAK,MAAC,uBAAqB,MAChD;AAAA,0BAAC,MAAM,OAAN,EAAY,SAAQ,MAAK,OAAK,MAC7B,8BAAC,MAAM,UAAN,EAAe,GAClB;AAAA,MACA,oBAAC,MAAM,SAAN,EAAc;AAAA,OACjB,GACF;AAAA,IAEA,qBAAC,OAAO,QAAP,EACC;AAAA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,GAAG;AAAA,UACH,YAAY,EAAE,GAAG,EAAE;AAAA,UACnB,WAAW,EAAE,GAAG,EAAE;AAAA;AAAA,QAJd;AAAA,MAKN;AAAA,MAEA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UACC,UAAQ;AAAA,UACR,SAAO;AAAA,UAEP,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,OAAK;AAAA,UAEL;AAAA,gCAAC,OAAO,OAAP,EAAa,0BAAY;AAAA,YAC1B,oBAAC,OAAO,aAAP,EAAmB,6EAEpB;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,QAAO,kBAExD;AAAA,cACA,oBAAC,SAAM,GAAG,GAAG,IAAG,QAAO,cAAa,gBAAe;AAAA,eACrD;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,YAC/C,8BAAC,iBAAc,OAAM,sBAAqB,WAAU,gBAClD,8BAAC,aAAU,kBAAI,GACjB,GACF;AAAA,cACA,oBAAC,cAAW;AAAA,eACd;AAAA,YAEA,oBAAC,UAAO,IAAG,YAAW,IAAG,MACvB,8BAAC,OAAO,OAAP,EAAa,oBAAkB,MAAC,SAAO,MACtC,8BAAC,UAAO,OAAM,QAAO,cAAW,SAAQ,0BAExC,GACF,GACF;AAAA,YAEA,oBAAC,YACC,8BAAC,OAAO,OAAP,EAAa,SAAO,MACnB,8BAAC,UAAO,KAAI,YAAW,GAAE,MAAK,GAAE,MAAK,MAAK,MAAK,UAAQ,MAAC,MAAM,GAAG,GACnE,GACF;AAAA;AAAA;AAAA,QA5CI;AAAA,MA6CN;AAAA,OACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/DialogDemo.mjs

@@ -7,7 +7,9 @@ import {
   Fieldset,
   Input,
   Label,
+  Paragraph,
   Sheet,
+  TooltipSimple,
   Unspaced,
   YStack
 } from "tamagui";
@@ -54,11 +56,11 @@ function DialogDemo() {
               /* @__PURE__ */ jsx(Input, { f: 1, id: "name", defaultValue: "Nate Wienert" })
             ] }),
             /* @__PURE__ */ jsxs(Fieldset, { space: "$4", horizontal: true, children: [
-              /* @__PURE__ */ jsx(Label, { w: 160, justifyContent: "flex-end", htmlFor: "username", children: "Food" }),
+              /* @__PURE__ */ jsx(Label, { w: 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(SelectDemo, {})
             ] }),
             /* @__PURE__ */ jsx(YStack, { ai: "flex-end", mt: "$2", children: /* @__PURE__ */ jsx(Dialog.Close, { displayWhenAdapted: true, asChild: true, children: /* @__PURE__ */ jsx(Button, { theme: "alt1", "aria-label": "Close", children: "Save changes" }) }) }),
-            /* @__PURE__ */ jsx(Unspaced, { children: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { pos: "absolute", t: "$2", r: "$2", size: "$3", circular: true, icon: X }) }) })
+            /* @__PURE__ */ jsx(Unspaced, { children: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { pos: "absolute", t: "$3", r: "$3", size: "$2", circular: true, icon: X }) }) })
           ]
         },
         "content"

package/dist/esm/DialogDemo.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/DialogDemo.tsx"],
-  "sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n  Adapt,\n  Button,\n  Dialog,\n  Fieldset,\n  H2,\n  Input,\n  Label,\n  Sheet,\n  Unspaced,\n  YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n  return (\n    <Dialog modal>\n      <Dialog.Trigger asChild>\n        <Button>Edit Profile</Button>\n      </Dialog.Trigger>\n\n      <Adapt when=\"sm\" platform=\"touch\">\n        <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n          <Sheet.Frame padding=\"$4\" space>\n            <Adapt.Contents />\n          </Sheet.Frame>\n          <Sheet.Overlay />\n        </Sheet>\n      </Adapt>\n\n      <Dialog.Portal>\n        <Dialog.Overlay\n          key=\"overlay\"\n          animation=\"quick\"\n          o={0.5}\n          enterStyle={{ o: 0 }}\n          exitStyle={{ o: 0 }}\n        />\n\n        <Dialog.Content\n          bordered\n          elevate\n          key=\"content\"\n          animation={[\n            'quick',\n            {\n              opacity: {\n                overshootClamping: true,\n              },\n            },\n          ]}\n          enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n          exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n          space\n        >\n          <Dialog.Title>Edit profile</Dialog.Title>\n          <Dialog.Description>\n            Make changes to your profile here. Click save when you're done.\n          </Dialog.Description>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n              Name\n            </Label>\n            <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n          </Fieldset>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n              Food\n            </Label>\n            <SelectDemo />\n          </Fieldset>\n\n          <YStack ai=\"flex-end\" mt=\"$2\">\n            <Dialog.Close displayWhenAdapted asChild>\n              <Button theme=\"alt1\" aria-label=\"Close\">\n                Save changes\n              </Button>\n            </Dialog.Close>\n          </YStack>\n\n          <Unspaced>\n            <Dialog.Close asChild>\n              <Button pos=\"absolute\" t=\"$2\" r=\"$2\" size=\"$3\" circular icon={X} />\n            </Dialog.Close>\n          </Unspaced>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog>\n  )\n}\n"],
-  "mappings": "AAoBQ,cAIA,YAJA;AApBR,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,qBAAC,UAAO,OAAK,MACX;AAAA,wBAAC,OAAO,SAAP,EAAe,SAAO,MACrB,8BAAC,UAAO,0BAAY,GACtB;AAAA,IAEA,oBAAC,SAAM,MAAK,MAAK,UAAS,SACxB,+BAAC,SAAM,QAAQ,KAAQ,OAAK,MAAC,uBAAqB,MAChD;AAAA,0BAAC,MAAM,OAAN,EAAY,SAAQ,MAAK,OAAK,MAC7B,8BAAC,MAAM,UAAN,EAAe,GAClB;AAAA,MACA,oBAAC,MAAM,SAAN,EAAc;AAAA,OACjB,GACF;AAAA,IAEA,qBAAC,OAAO,QAAP,EACC;AAAA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,GAAG;AAAA,UACH,YAAY,EAAE,GAAG,EAAE;AAAA,UACnB,WAAW,EAAE,GAAG,EAAE;AAAA;AAAA,QAJd;AAAA,MAKN;AAAA,MAEA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UACC,UAAQ;AAAA,UACR,SAAO;AAAA,UAEP,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,OAAK;AAAA,UAEL;AAAA,gCAAC,OAAO,OAAP,EAAa,0BAAY;AAAA,YAC1B,oBAAC,OAAO,aAAP,EAAmB,6EAEpB;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,QAAO,kBAExD;AAAA,cACA,oBAAC,SAAM,GAAG,GAAG,IAAG,QAAO,cAAa,gBAAe;AAAA,eACrD;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,YAAW,kBAE5D;AAAA,cACA,oBAAC,cAAW;AAAA,eACd;AAAA,YAEA,oBAAC,UAAO,IAAG,YAAW,IAAG,MACvB,8BAAC,OAAO,OAAP,EAAa,oBAAkB,MAAC,SAAO,MACtC,8BAAC,UAAO,OAAM,QAAO,cAAW,SAAQ,0BAExC,GACF,GACF;AAAA,YAEA,oBAAC,YACC,8BAAC,OAAO,OAAP,EAAa,SAAO,MACnB,8BAAC,UAAO,KAAI,YAAW,GAAE,MAAK,GAAE,MAAK,MAAK,MAAK,UAAQ,MAAC,MAAM,GAAG,GACnE,GACF;AAAA;AAAA;AAAA,QA1CI;AAAA,MA2CN;AAAA,OACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n  Adapt,\n  Button,\n  Dialog,\n  Fieldset,\n  H2,\n  Input,\n  Label,\n  Paragraph,\n  Sheet,\n  TooltipSimple,\n  Unspaced,\n  YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n  return (\n    <Dialog modal>\n      <Dialog.Trigger asChild>\n        <Button>Edit Profile</Button>\n      </Dialog.Trigger>\n\n      <Adapt when=\"sm\" platform=\"touch\">\n        <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n          <Sheet.Frame padding=\"$4\" space>\n            <Adapt.Contents />\n          </Sheet.Frame>\n          <Sheet.Overlay />\n        </Sheet>\n      </Adapt>\n\n      <Dialog.Portal>\n        <Dialog.Overlay\n          key=\"overlay\"\n          animation=\"quick\"\n          o={0.5}\n          enterStyle={{ o: 0 }}\n          exitStyle={{ o: 0 }}\n        />\n\n        <Dialog.Content\n          bordered\n          elevate\n          key=\"content\"\n          animation={[\n            'quick',\n            {\n              opacity: {\n                overshootClamping: true,\n              },\n            },\n          ]}\n          enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n          exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n          space\n        >\n          <Dialog.Title>Edit profile</Dialog.Title>\n          <Dialog.Description>\n            Make changes to your profile here. Click save when you're done.\n          </Dialog.Description>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n              Name\n            </Label>\n            <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n          </Fieldset>\n          <Fieldset space=\"$4\" horizontal>\n            <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n              <TooltipSimple label=\"Pick your favorite\" placement=\"bottom-start\">\n                <Paragraph>Food</Paragraph>\n              </TooltipSimple>\n            </Label>\n            <SelectDemo />\n          </Fieldset>\n\n          <YStack ai=\"flex-end\" mt=\"$2\">\n            <Dialog.Close displayWhenAdapted asChild>\n              <Button theme=\"alt1\" aria-label=\"Close\">\n                Save changes\n              </Button>\n            </Dialog.Close>\n          </YStack>\n\n          <Unspaced>\n            <Dialog.Close asChild>\n              <Button pos=\"absolute\" t=\"$3\" r=\"$3\" size=\"$2\" circular icon={X} />\n            </Dialog.Close>\n          </Unspaced>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog>\n  )\n}\n"],
+  "mappings": "AAsBQ,cAIA,YAJA;AAtBR,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,qBAAC,UAAO,OAAK,MACX;AAAA,wBAAC,OAAO,SAAP,EAAe,SAAO,MACrB,8BAAC,UAAO,0BAAY,GACtB;AAAA,IAEA,oBAAC,SAAM,MAAK,MAAK,UAAS,SACxB,+BAAC,SAAM,QAAQ,KAAQ,OAAK,MAAC,uBAAqB,MAChD;AAAA,0BAAC,MAAM,OAAN,EAAY,SAAQ,MAAK,OAAK,MAC7B,8BAAC,MAAM,UAAN,EAAe,GAClB;AAAA,MACA,oBAAC,MAAM,SAAN,EAAc;AAAA,OACjB,GACF;AAAA,IAEA,qBAAC,OAAO,QAAP,EACC;AAAA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UAEC,WAAU;AAAA,UACV,GAAG;AAAA,UACH,YAAY,EAAE,GAAG,EAAE;AAAA,UACnB,WAAW,EAAE,GAAG,EAAE;AAAA;AAAA,QAJd;AAAA,MAKN;AAAA,MAEA;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UACC,UAAQ;AAAA,UACR,SAAO;AAAA,UAEP,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,OAAK;AAAA,UAEL;AAAA,gCAAC,OAAO,OAAP,EAAa,0BAAY;AAAA,YAC1B,oBAAC,OAAO,aAAP,EAAmB,6EAEpB;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,QAAO,kBAExD;AAAA,cACA,oBAAC,SAAM,GAAG,GAAG,IAAG,QAAO,cAAa,gBAAe;AAAA,eACrD;AAAA,YACA,qBAAC,YAAS,OAAM,MAAK,YAAU,MAC7B;AAAA,kCAAC,SAAM,GAAG,KAAK,gBAAe,YAAW,SAAQ,YAC/C,8BAAC,iBAAc,OAAM,sBAAqB,WAAU,gBAClD,8BAAC,aAAU,kBAAI,GACjB,GACF;AAAA,cACA,oBAAC,cAAW;AAAA,eACd;AAAA,YAEA,oBAAC,UAAO,IAAG,YAAW,IAAG,MACvB,8BAAC,OAAO,OAAP,EAAa,oBAAkB,MAAC,SAAO,MACtC,8BAAC,UAAO,OAAM,QAAO,cAAW,SAAQ,0BAExC,GACF,GACF;AAAA,YAEA,oBAAC,YACC,8BAAC,OAAO,OAAP,EAAa,SAAO,MACnB,8BAAC,UAAO,KAAI,YAAW,GAAE,MAAK,GAAE,MAAK,MAAK,MAAK,UAAQ,MAAC,MAAM,GAAG,GACnE,GACF;AAAA;AAAA;AAAA,QA5CI;AAAA,MA6CN;AAAA,OACF;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/FormsDemo.js

@@ -1,18 +1,34 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Button, Input, TextArea, XStack, YStack } from "tamagui";
-function FormsDemo() {
-  return /* @__PURE__ */ jsxs(YStack, { w: 200, mih: 250, overflow: "hidden", space: "$2", m: "$3", p: "$2", children: [
-    /* @__PURE__ */ jsx(FormDemo, { size: "$2" }),
-    /* @__PURE__ */ jsx(FormDemo, { size: "$3" }),
-    /* @__PURE__ */ jsx(FormDemo, { size: "$4" }),
-    /* @__PURE__ */ jsx(TextArea, { mih: 140, placeholder: "Enter your details...", numberOfLines: 4 })
-  ] });
-}
-function FormDemo(props) {
-  return /* @__PURE__ */ jsxs(XStack, { ai: "center", space: "$2", children: [
-    /* @__PURE__ */ jsx(Input, { f: 1, size: props.size, placeholder: `Size ${props.size}...` }),
-    /* @__PURE__ */ jsx(Button, { size: props.size, children: "Go" })
-  ] });
+import { useEffect, useState } from "react";
+import { Button, Form, H4, Spinner } from "tamagui";
+function FormsDemo(props) {
+  const [status, setStatus] = useState("off");
+  useEffect(() => {
+    if (status === "submitting") {
+      const timer = setTimeout(() => setStatus("off"), 2e3);
+      return () => {
+        clearTimeout(timer);
+      };
+    }
+  }, [status]);
+  return /* @__PURE__ */ jsxs(
+    Form,
+    {
+      ai: "center",
+      miw: 300,
+      space: true,
+      onSubmit: () => setStatus("submitting"),
+      bw: 1,
+      br: "$4",
+      bc: "$background",
+      boc: "$borderColor",
+      p: "$8",
+      children: [
+        /* @__PURE__ */ jsx(H4, { children: status[0].toUpperCase() + status.slice(1) }),
+        /* @__PURE__ */ jsx(Form.Trigger, { asChild: true, disabled: status !== "off", children: /* @__PURE__ */ jsx(Button, { icon: status === "submitting" ? () => /* @__PURE__ */ jsx(Spinner, {}) : void 0, children: "Submit" }) })
+      ]
+    }
+  );
 }
 export {
   FormsDemo

package/dist/esm/FormsDemo.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/FormsDemo.tsx"],
-  "sourcesContent": ["import { Button, Input, SizeTokens, TextArea, XStack, YStack } from 'tamagui'\n\nexport function FormsDemo() {\n  return (\n    <YStack w={200} mih={250} overflow=\"hidden\" space=\"$2\" m=\"$3\" p=\"$2\">\n      <FormDemo size=\"$2\" />\n      <FormDemo size=\"$3\" />\n      <FormDemo size=\"$4\" />\n      <TextArea mih={140} placeholder=\"Enter your details...\" numberOfLines={4} />\n    </YStack>\n  )\n}\n\nfunction FormDemo(props: { size: SizeTokens }) {\n  return (\n    <XStack ai=\"center\" space=\"$2\">\n      <Input f={1} size={props.size} placeholder={`Size ${props.size}...`} />\n      <Button size={props.size}>Go</Button>\n    </XStack>\n  )\n}\n"],
-  "mappings": "AAII,SACE,KADF;AAJJ,SAAS,QAAQ,OAAmB,UAAU,QAAQ,cAAc;AAE7D,SAAS,YAAY;AAC1B,SACE,qBAAC,UAAO,GAAG,KAAK,KAAK,KAAK,UAAS,UAAS,OAAM,MAAK,GAAE,MAAK,GAAE,MAC9D;AAAA,wBAAC,YAAS,MAAK,MAAK;AAAA,IACpB,oBAAC,YAAS,MAAK,MAAK;AAAA,IACpB,oBAAC,YAAS,MAAK,MAAK;AAAA,IACpB,oBAAC,YAAS,KAAK,KAAK,aAAY,yBAAwB,eAAe,GAAG;AAAA,KAC5E;AAEJ;AAEA,SAAS,SAAS,OAA6B;AAC7C,SACE,qBAAC,UAAO,IAAG,UAAS,OAAM,MACxB;AAAA,wBAAC,SAAM,GAAG,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,WAAW;AAAA,IACrE,oBAAC,UAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
+  "sourcesContent": ["import { stat } from 'fs'\n\nimport { useEffect, useState } from 'react'\nimport { Button, Form, H4, SizeTokens, Spinner, XStack, YStack } from 'tamagui'\n\nexport function FormsDemo(props: { size: SizeTokens }) {\n  const [status, setStatus] = useState<'off' | 'submitting' | 'submitted'>('off')\n\n  useEffect(() => {\n    if (status === 'submitting') {\n      const timer = setTimeout(() => setStatus('off'), 2000)\n      return () => {\n        clearTimeout(timer)\n      }\n    }\n  }, [status])\n\n  return (\n    <Form\n      ai=\"center\"\n      miw={300}\n      space\n      onSubmit={() => setStatus('submitting')}\n      bw={1}\n      br=\"$4\"\n      bc=\"$background\"\n      boc=\"$borderColor\"\n      p=\"$8\"\n    >\n      <H4>{status[0].toUpperCase() + status.slice(1)}</H4>\n\n      <Form.Trigger asChild disabled={status !== 'off'}>\n        <Button icon={status === 'submitting' ? () => <Spinner /> : undefined}>\n          Submit\n        </Button>\n      </Form.Trigger>\n    </Form>\n  )\n}\n"],
+  "mappings": "AAkBI,SAWE,KAXF;AAhBJ,SAAS,WAAW,gBAAgB;AACpC,SAAS,QAAQ,MAAM,IAAgB,eAA+B;AAE/D,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6C,KAAK;AAE9E,YAAU,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;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,KAAK;AAAA,MACL,OAAK;AAAA,MACL,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,IAAI;AAAA,MACJ,IAAG;AAAA,MACH,IAAG;AAAA,MACH,KAAI;AAAA,MACJ,GAAE;AAAA,MAEF;AAAA,4BAAC,MAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,oBAAC,KAAK,SAAL,EAAa,SAAO,MAAC,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

@@ -1,18 +1,34 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Button, Input, TextArea, XStack, YStack } from "tamagui";
-function FormsDemo() {
-  return /* @__PURE__ */ jsxs(YStack, { w: 200, mih: 250, overflow: "hidden", space: "$2", m: "$3", p: "$2", children: [
-    /* @__PURE__ */ jsx(FormDemo, { size: "$2" }),
-    /* @__PURE__ */ jsx(FormDemo, { size: "$3" }),
-    /* @__PURE__ */ jsx(FormDemo, { size: "$4" }),
-    /* @__PURE__ */ jsx(TextArea, { mih: 140, placeholder: "Enter your details...", numberOfLines: 4 })
-  ] });
-}
-function FormDemo(props) {
-  return /* @__PURE__ */ jsxs(XStack, { ai: "center", space: "$2", children: [
-    /* @__PURE__ */ jsx(Input, { f: 1, size: props.size, placeholder: `Size ${props.size}...` }),
-    /* @__PURE__ */ jsx(Button, { size: props.size, children: "Go" })
-  ] });
+import { useEffect, useState } from "react";
+import { Button, Form, H4, Spinner } from "tamagui";
+function FormsDemo(props) {
+  const [status, setStatus] = useState("off");
+  useEffect(() => {
+    if (status === "submitting") {
+      const timer = setTimeout(() => setStatus("off"), 2e3);
+      return () => {
+        clearTimeout(timer);
+      };
+    }
+  }, [status]);
+  return /* @__PURE__ */ jsxs(
+    Form,
+    {
+      ai: "center",
+      miw: 300,
+      space: true,
+      onSubmit: () => setStatus("submitting"),
+      bw: 1,
+      br: "$4",
+      bc: "$background",
+      boc: "$borderColor",
+      p: "$8",
+      children: [
+        /* @__PURE__ */ jsx(H4, { children: status[0].toUpperCase() + status.slice(1) }),
+        /* @__PURE__ */ jsx(Form.Trigger, { asChild: true, disabled: status !== "off", children: /* @__PURE__ */ jsx(Button, { icon: status === "submitting" ? () => /* @__PURE__ */ jsx(Spinner, {}) : void 0, children: "Submit" }) })
+      ]
+    }
+  );
 }
 export {
   FormsDemo

package/dist/esm/FormsDemo.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/FormsDemo.tsx"],
-  "sourcesContent": ["import { Button, Input, SizeTokens, TextArea, XStack, YStack } from 'tamagui'\n\nexport function FormsDemo() {\n  return (\n    <YStack w={200} mih={250} overflow=\"hidden\" space=\"$2\" m=\"$3\" p=\"$2\">\n      <FormDemo size=\"$2\" />\n      <FormDemo size=\"$3\" />\n      <FormDemo size=\"$4\" />\n      <TextArea mih={140} placeholder=\"Enter your details...\" numberOfLines={4} />\n    </YStack>\n  )\n}\n\nfunction FormDemo(props: { size: SizeTokens }) {\n  return (\n    <XStack ai=\"center\" space=\"$2\">\n      <Input f={1} size={props.size} placeholder={`Size ${props.size}...`} />\n      <Button size={props.size}>Go</Button>\n    </XStack>\n  )\n}\n"],
-  "mappings": "AAII,SACE,KADF;AAJJ,SAAS,QAAQ,OAAmB,UAAU,QAAQ,cAAc;AAE7D,SAAS,YAAY;AAC1B,SACE,qBAAC,UAAO,GAAG,KAAK,KAAK,KAAK,UAAS,UAAS,OAAM,MAAK,GAAE,MAAK,GAAE,MAC9D;AAAA,wBAAC,YAAS,MAAK,MAAK;AAAA,IACpB,oBAAC,YAAS,MAAK,MAAK;AAAA,IACpB,oBAAC,YAAS,MAAK,MAAK;AAAA,IACpB,oBAAC,YAAS,KAAK,KAAK,aAAY,yBAAwB,eAAe,GAAG;AAAA,KAC5E;AAEJ;AAEA,SAAS,SAAS,OAA6B;AAC7C,SACE,qBAAC,UAAO,IAAG,UAAS,OAAM,MACxB;AAAA,wBAAC,SAAM,GAAG,GAAG,MAAM,MAAM,MAAM,aAAa,QAAQ,MAAM,WAAW;AAAA,IACrE,oBAAC,UAAO,MAAM,MAAM,MAAM,gBAAE;AAAA,KAC9B;AAEJ;",
+  "sourcesContent": ["import { stat } from 'fs'\n\nimport { useEffect, useState } from 'react'\nimport { Button, Form, H4, SizeTokens, Spinner, XStack, YStack } from 'tamagui'\n\nexport function FormsDemo(props: { size: SizeTokens }) {\n  const [status, setStatus] = useState<'off' | 'submitting' | 'submitted'>('off')\n\n  useEffect(() => {\n    if (status === 'submitting') {\n      const timer = setTimeout(() => setStatus('off'), 2000)\n      return () => {\n        clearTimeout(timer)\n      }\n    }\n  }, [status])\n\n  return (\n    <Form\n      ai=\"center\"\n      miw={300}\n      space\n      onSubmit={() => setStatus('submitting')}\n      bw={1}\n      br=\"$4\"\n      bc=\"$background\"\n      boc=\"$borderColor\"\n      p=\"$8\"\n    >\n      <H4>{status[0].toUpperCase() + status.slice(1)}</H4>\n\n      <Form.Trigger asChild disabled={status !== 'off'}>\n        <Button icon={status === 'submitting' ? () => <Spinner /> : undefined}>\n          Submit\n        </Button>\n      </Form.Trigger>\n    </Form>\n  )\n}\n"],
+  "mappings": "AAkBI,SAWE,KAXF;AAhBJ,SAAS,WAAW,gBAAgB;AACpC,SAAS,QAAQ,MAAM,IAAgB,eAA+B;AAE/D,SAAS,UAAU,OAA6B;AACrD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA6C,KAAK;AAE9E,YAAU,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;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH,KAAK;AAAA,MACL,OAAK;AAAA,MACL,UAAU,MAAM,UAAU,YAAY;AAAA,MACtC,IAAI;AAAA,MACJ,IAAG;AAAA,MACH,IAAG;AAAA,MACH,KAAI;AAAA,MACJ,GAAE;AAAA,MAEF;AAAA,4BAAC,MAAI,iBAAO,CAAC,EAAE,YAAY,IAAI,OAAO,MAAM,CAAC,GAAE;AAAA,QAE/C,oBAAC,KAAK,SAAL,EAAa,SAAO,MAAC,UAAU,WAAW,OACzC,8BAAC,UAAO,MAAM,WAAW,eAAe,MAAM,oBAAC,WAAQ,IAAK,QAAW,oBAEvE,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/esm/index.js

@@ -30,6 +30,7 @@ import { SliderDemo } from "./SliderDemo";
 import { SpinnerDemo } from "./SpinnerDemo";
 import { StacksDemo } from "./StacksDemo";
 import { SwitchDemo } from "./SwitchDemo";
+import { CheckboxDemo } from "./CheckboxDemo";
 import { TextDemo } from "./TextDemo";
 import { ThemeInverseDemo } from "./ThemeInverseDemo";
 import { TooltipDemo } from "./TooltipDemo";
@@ -47,6 +48,7 @@ export {
   AvatarDemo,
   ButtonDemo,
   CardDemo,
+  CheckboxDemo,
   ColorsDemo,
   DialogDemo,
   FeatherIconsDemo,

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx"],
-  "sourcesContent": ["export { AlertDialogDemo } from './AlertDialogDemo'\nexport { AnimationsDemo } from './AnimationsDemo'\nexport { AnimationsEnterDemo } from './AnimationsEnterDemo'\nexport { AnimationsHoverDemo } from './AnimationsHoverDemo'\nexport { AnimationsTimingDemo } from './AnimationsTimingDemo'\nexport { AnimationsPresenceDemo } from './AnimationsPresenceDemo'\nexport { AvatarDemo } from './AvatarDemo'\nexport { ButtonDemo } from './ButtonDemo'\nexport { CardDemo } from './CardDemo'\nexport { DialogDemo } from './DialogDemo'\nexport { AddThemeDemo } from './AddThemeDemo'\nexport { UpdateThemeDemo } from './UpdateThemeDemo'\nexport { FeatherIconsDemo } from './FeatherIconsDemo'\nexport { FormsDemo } from './FormsDemo'\nexport { GroupDemo } from './GroupDemo'\nexport { HeadingsDemo } from './HeadingsDemo'\nexport { ImageDemo } from './ImageDemo'\nexport { LabelDemo } from './LabelDemo'\nexport { LinearGradientDemo } from './LinearGradientDemo'\nexport { ListItemDemo } from './ListItemDemo'\nexport { LucideIconsDemo } from './LucideIconsDemo'\nexport { PopoverDemo } from './PopoverDemo'\nexport { ProgressDemo } from './ProgressDemo'\nexport { SelectDemo } from './SelectDemo'\nexport { SeparatorDemo } from './SeparatorDemo'\nexport { ShapesDemo } from './ShapesDemo'\nexport { ScrollViewDemo } from './ScrollViewDemo'\nexport { SheetDemo } from './SheetDemo'\nexport { SliderDemo } from './SliderDemo'\nexport { SpinnerDemo } from './SpinnerDemo'\nexport { StacksDemo } from './StacksDemo'\nexport { SwitchDemo } from './SwitchDemo'\nexport { TextDemo } from './TextDemo'\nexport { ThemeInverseDemo } from './ThemeInverseDemo'\nexport { TooltipDemo } from './TooltipDemo'\nexport { ColorsDemo } from './ColorsDemo'\nexport { TokensDemo } from './TokensDemo'\nexport * from './useOnIntersecting'\n"],
-  "mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,2BAA2B;AACpC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAC1B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,cAAc;",
+  "sourcesContent": ["export { AlertDialogDemo } from './AlertDialogDemo'\nexport { AnimationsDemo } from './AnimationsDemo'\nexport { AnimationsEnterDemo } from './AnimationsEnterDemo'\nexport { AnimationsHoverDemo } from './AnimationsHoverDemo'\nexport { AnimationsTimingDemo } from './AnimationsTimingDemo'\nexport { AnimationsPresenceDemo } from './AnimationsPresenceDemo'\nexport { AvatarDemo } from './AvatarDemo'\nexport { ButtonDemo } from './ButtonDemo'\nexport { CardDemo } from './CardDemo'\nexport { DialogDemo } from './DialogDemo'\nexport { AddThemeDemo } from './AddThemeDemo'\nexport { UpdateThemeDemo } from './UpdateThemeDemo'\nexport { FeatherIconsDemo } from './FeatherIconsDemo'\nexport { FormsDemo } from './FormsDemo'\nexport { GroupDemo } from './GroupDemo'\nexport { HeadingsDemo } from './HeadingsDemo'\nexport { ImageDemo } from './ImageDemo'\nexport { LabelDemo } from './LabelDemo'\nexport { LinearGradientDemo } from './LinearGradientDemo'\nexport { ListItemDemo } from './ListItemDemo'\nexport { LucideIconsDemo } from './LucideIconsDemo'\nexport { PopoverDemo } from './PopoverDemo'\nexport { ProgressDemo } from './ProgressDemo'\nexport { SelectDemo } from './SelectDemo'\nexport { SeparatorDemo } from './SeparatorDemo'\nexport { ShapesDemo } from './ShapesDemo'\nexport { ScrollViewDemo } from './ScrollViewDemo'\nexport { SheetDemo } from './SheetDemo'\nexport { SliderDemo } from './SliderDemo'\nexport { SpinnerDemo } from './SpinnerDemo'\nexport { StacksDemo } from './StacksDemo'\nexport { SwitchDemo } from './SwitchDemo'\nexport { CheckboxDemo } from './CheckboxDemo'\nexport { TextDemo } from './TextDemo'\nexport { ThemeInverseDemo } from './ThemeInverseDemo'\nexport { TooltipDemo } from './TooltipDemo'\nexport { ColorsDemo } from './ColorsDemo'\nexport { TokensDemo } from './TokensDemo'\nexport * from './useOnIntersecting'\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,2BAA2B;AACpC,SAAS,2BAA2B;AACpC,SAAS,4BAA4B;AACrC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAC1B,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,iBAAiB;AAC1B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,cAAc;",
   "names": []
 }