@hanzogui/demos 4.3.1 → 8.0.0

package/dist/cjs/ToastV1Demo.cjs

@@ -0,0 +1,155 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var ToastV1Demo_exports = {};
+__export(ToastV1Demo_exports, {
+  ToastV1Demo: () => ToastV1Demo
+});
+module.exports = __toCommonJS(ToastV1Demo_exports);
+var import_toast = require("@hanzogui/toast");
+var import_react = __toESM(require("react"), 1);
+var import_hanzogui = require("hanzogui");
+var import_jsx_runtime = require("react/jsx-runtime");
+const ToastV1Demo = () => {
+  const [native, setNative] = import_react.default.useState(false);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
+    gap: "$4",
+    items: "center",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToastControl, {
+      native
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(CurrentToast, {}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(NativeOptions, {
+      native,
+      setNative
+    })]
+  });
+};
+const CurrentToast = () => {
+  const currentToast = (0, import_toast.useToastState)();
+  if (!currentToast || currentToast.isHandledNatively) return null;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast, {
+    duration: currentToast.duration,
+    viewportName: currentToast.viewportName,
+    enterStyle: {
+      opacity: 0,
+      scale: 0.95,
+      y: -80
+    },
+    exitStyle: {
+      opacity: 0,
+      scale: 0.95,
+      y: -80
+    },
+    opacity: 1,
+    scale: 1,
+    y: -50,
+    transition: "quicker",
+    bg: "$color2",
+    boxShadow: "0px 2px 4px rgba(0,0,0,0.12), 0px 8px 24px rgba(0,0,0,0.08)",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
+      gap: "$5",
+      items: "center",
+      justify: "space-between",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
+        gap: "$0.5",
+        flex: 1,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Title, {
+          children: currentToast.title
+        }), !!currentToast.message && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Description, {
+          children: currentToast.message
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Action, {
+        asChild: true,
+        altText: "Dismiss toast",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
+          size: "$2",
+          children: "Dismiss"
+        })
+      })]
+    })
+  }, currentToast.id);
+};
+const ToastControl = ({
+  native
+}) => {
+  const toast = (0, import_toast.useToastController)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
+    gap: "$2",
+    justify: "center",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
+      onPress: () => {
+        toast.show("Successfully saved!", {
+          message: "Don't worry, we've got your data.",
+          native,
+          demo: true
+        });
+      },
+      children: "Show"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
+      onPress: () => {
+        toast.hide();
+      },
+      children: "Hide"
+    })]
+  });
+};
+const NativeOptions = ({
+  native,
+  setNative
+}) => {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
+    gap: "$3",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Label, {
+      size: "$1",
+      onPress: () => setNative(false),
+      children: "Custom"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Switch, {
+      theme: "surface2",
+      id: "native-toggle",
+      size: "$1",
+      checked: !!native,
+      onCheckedChange: val => setNative(val),
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Switch.Thumb, {
+        theme: "accent",
+        transition: ["quickest", {
+          transform: {
+            overshootClamping: true
+          }
+        }]
+      })
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Label, {
+      size: "$1",
+      onPress: () => setNative(true),
+      children: "Native"
+    })]
+  });
+};

package/dist/cjs/ToastV1Demo.native.js

@@ -0,0 +1,166 @@
+"use strict";
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var ToastV1Demo_exports = {};
+__export(ToastV1Demo_exports, {
+  ToastV1Demo: () => ToastV1Demo
+});
+module.exports = __toCommonJS(ToastV1Demo_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_toast = require("@hanzogui/toast");
+var import_react = __toESM(require("react"), 1);
+var import_hanzogui = require("hanzogui");
+var ToastV1Demo = function () {
+  var [native, setNative] = import_react.default.useState(false);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
+    gap: "$4",
+    items: "center",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToastControl, {
+      native
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(CurrentToast, {}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(NativeOptions, {
+      native,
+      setNative
+    })]
+  });
+};
+var CurrentToast = function () {
+  var currentToast = (0, import_toast.useToastState)();
+  if (!currentToast || currentToast.isHandledNatively) return null;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast, {
+    duration: currentToast.duration,
+    viewportName: currentToast.viewportName,
+    enterStyle: {
+      opacity: 0,
+      scale: 0.95,
+      y: -80
+    },
+    exitStyle: {
+      opacity: 0,
+      scale: 0.95,
+      y: -80
+    },
+    opacity: 1,
+    scale: 1,
+    y: -50,
+    transition: "quicker",
+    bg: "$color2",
+    boxShadow: "0px 2px 4px rgba(0,0,0,0.12), 0px 8px 24px rgba(0,0,0,0.08)",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
+      gap: "$5",
+      items: "center",
+      justify: "space-between",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
+        gap: "$0.5",
+        flex: 1,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Title, {
+          children: currentToast.title
+        }), !!currentToast.message && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Description, {
+          children: currentToast.message
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Action, {
+        asChild: true,
+        altText: "Dismiss toast",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
+          size: "$2",
+          children: "Dismiss"
+        })
+      })]
+    })
+  }, currentToast.id);
+};
+var ToastControl = function (param) {
+  var {
+    native
+  } = param;
+  var toast = (0, import_toast.useToastController)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
+    gap: "$2",
+    justify: "center",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
+      onPress: function () {
+        toast.show("Successfully saved!", {
+          message: "Don't worry, we've got your data.",
+          native,
+          demo: true
+        });
+      },
+      children: "Show"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
+      onPress: function () {
+        toast.hide();
+      },
+      children: "Hide"
+    })]
+  });
+};
+var NativeOptions = function (param) {
+  var {
+    native,
+    setNative
+  } = param;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
+    gap: "$3",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Label, {
+      size: "$1",
+      onPress: function () {
+        return setNative(false);
+      },
+      children: "Custom"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Switch, {
+      theme: "surface2",
+      id: "native-toggle",
+      size: "$1",
+      checked: !!native,
+      onCheckedChange: function (val) {
+        return setNative(val);
+      },
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Switch.Thumb, {
+        theme: "accent",
+        transition: ["quickest", {
+          transform: {
+            overshootClamping: true
+          }
+        }]
+      })
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Label, {
+      size: "$1",
+      onPress: function () {
+        return setNative(true);
+      },
+      children: "Native"
+    })]
+  });
+};
+//# sourceMappingURL=ToastV1Demo.native.js.map

package/dist/cjs/ToastV1Demo.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToastV1Demo_exports","__export","ToastV1Demo","module","exports","import_jsx_runtime","require","import_toast","import_react","__toESM","import_hanzogui","native","setNative","default","useState","jsxs","YStack","gap","items","children","jsx","ToastControl","CurrentToast","NativeOptions","currentToast","useToastState","isHandledNatively","Toast","duration","viewportName","enterStyle","opacity","scale","y","exitStyle","transition","bg","boxShadow","XStack","justify","flex","Title","title","message","Description","Action","asChild","altText","Button","size","id","param","toast","useToastController","onPress","show","demo","hide"],"sources":["../../src/ToastV1Demo.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/ToggleGroupDemo.cjs

@@ -26,15 +26,15 @@ __export(ToggleGroupDemo_exports, {
 });
 module.exports = __toCommonJS(ToggleGroupDemo_exports);
 var import_lucide_icons_2 = require("@hanzogui/lucide-icons-2");
-var import_gui = require("@hanzo/gui");
+var import_hanzogui = require("hanzogui");
 var import_jsx_runtime = require("react/jsx-runtime");
 function ToggleGroupDemo() {
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
     px: "$4",
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
       items: "center",
       gap: "$10",
-      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
         items: "center",
         gap: "$6",
         children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToggleGroupComponent, {
@@ -44,7 +44,7 @@ function ToggleGroupDemo() {
           type: "multiple",
           orientation: "horizontal"
         })]
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
         items: "center",
         gap: "$6",
         y: -28,
@@ -61,26 +61,26 @@ function ToggleGroupDemo() {
 }
 function ToggleGroupComponent(props) {
   const id = `switch-${props.type}`;
-  const Group = props.orientation === "horizontal" ? import_gui.XGroup : import_gui.YGroup;
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+  const Group = props.orientation === "horizontal" ? import_hanzogui.XGroup : import_hanzogui.YGroup;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
     flexDirection: props.orientation === "horizontal" ? "row" : "column",
     items: "center",
     justify: "center",
     gap: "$4",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Label, {
       pr: "$0",
       justify: "flex-end",
       size: "$4",
       htmlFor: id,
       children: props.type === "single" ? "Single" : "Multiple"
-    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup, {
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup, {
       orientation: props.orientation,
       id,
       type: props.type,
       disableDeactivation: props.type === "single" ? true : void 0,
       children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(Group, {
         children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup.Item, {
             value: "left",
             "aria-label": "Left aligned",
             borderRadius: "$4",
@@ -92,7 +92,7 @@ function ToggleGroupComponent(props) {
             })
           })
         }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup.Item, {
             value: "center",
             "aria-label": "Center aligned",
             borderRadius: "$4",
@@ -104,7 +104,7 @@ function ToggleGroupComponent(props) {
             })
           })
         }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup.Item, {
             value: "right",
             "aria-label": "Right aligned",
             borderRadius: "$4",

package/dist/cjs/ToggleGroupDemo.native.js

@@ -29,14 +29,14 @@ __export(ToggleGroupDemo_exports, {
 module.exports = __toCommonJS(ToggleGroupDemo_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_lucide_icons_2 = require("@hanzogui/lucide-icons-2");
-var import_gui = require("@hanzo/gui");
+var import_hanzogui = require("hanzogui");
 function ToggleGroupDemo() {
-  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
     px: "$4",
-    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
       items: "center",
       gap: "$10",
-      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
         items: "center",
         gap: "$6",
         children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToggleGroupComponent, {
@@ -46,7 +46,7 @@ function ToggleGroupDemo() {
           type: "multiple",
           orientation: "horizontal"
         })]
-      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
         items: "center",
         gap: "$6",
         y: -28,
@@ -63,26 +63,26 @@ function ToggleGroupDemo() {
 }
 function ToggleGroupComponent(props) {
   var id = `switch-${props.type}`;
-  var Group = props.orientation === "horizontal" ? import_gui.XGroup : import_gui.YGroup;
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+  var Group = props.orientation === "horizontal" ? import_hanzogui.XGroup : import_hanzogui.YGroup;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
     flexDirection: props.orientation === "horizontal" ? "row" : "column",
     items: "center",
     justify: "center",
     gap: "$4",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Label, {
       pr: "$0",
       justify: "flex-end",
       size: "$4",
       htmlFor: id,
       children: props.type === "single" ? "Single" : "Multiple"
-    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup, {
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup, {
       orientation: props.orientation,
       id,
       type: props.type,
       disableDeactivation: props.type === "single" ? true : void 0,
       children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(Group, {
         children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup.Item, {
             value: "left",
             "aria-label": "Left aligned",
             borderRadius: "$4",
@@ -94,7 +94,7 @@ function ToggleGroupComponent(props) {
             })
           })
         }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup.Item, {
             value: "center",
             "aria-label": "Center aligned",
             borderRadius: "$4",
@@ -106,7 +106,7 @@ function ToggleGroupComponent(props) {
             })
           })
         }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.ToggleGroup.Item, {
             value: "right",
             "aria-label": "Right aligned",
             borderRadius: "$4",

package/dist/cjs/ToggleGroupDemo.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToggleGroupDemo_exports","__export","ToggleGroupDemo","module","exports","import_jsx_runtime","require","import_lucide_icons_2","import_gui","jsx","YStack","px","children","jsxs","XStack","items","gap","ToggleGroupComponent","type","orientation","y","props","id","Group","XGroup","YGroup","flexDirection","justify","Label","pr","size","htmlFor","ToggleGroup","disableDeactivation","Item","borderRadius"],"sources":["../../src/ToggleGroupDemo.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,uBAAA;AAAAC,QAAA,CAAAD,uBAAA;EAAAE,eAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAmD,CAAAK,uBAAA;AACnD,IAAAK,kBAAmE,GAAAC,OAAA;AAM3D,IAAAC,qBAAA,GAAAD,OAAA;AAJD,IAAAE,UAAS,GAAAF,OAAA,aAAkB;AAChC,SACEJ,gBAAA;EAEI,0BAAAG,kBAAA,CAAAI,GAAC,EAAAD,UAAA,CAAAE,MAAO;IACNC,EAAA;IAA6DC,QAC7D,qBAAAP,kBAAC,CAAAQ,IAAA,EAAAL,UAAA,CAAAM,MAAqB;MAAyCC,KACjE;MACAC,GAAA;MACEJ,QAAA,GACA,mBAAAP,kBAAA,CAAAQ,IAAC,EAAAL,UAAA,CAAAE,MAAA;QACHK,KAAA;QAEJC,GAAA;QAEJJ,QAAA,GAES,iBAAqB,EAAAP,kBAG3B,CAAAI,GAAA,EAAAQ,oBAAA;UACUC,IAAA,UAAU;UACfC,WAAc;QAGlB,IAAC,mBAAAd,kBAAA,CAAAI,GAAA,EAAAQ,oBAAA;UAAAC,IAAA;UACCC,WAAe,EAAM;QACrB,CAAM;MAEN,IAEA,mBAAAd,kBAAA,CAAAQ,IAAA,EAAAL,UAAA,CAAAM,MAAA;QAAAC,KAAA;QAIAC,GAAA;QAACI,CAAA;QAAAR,QAAA,GACC,eAAa,IAAMP,kBAAA,CAAAI,GAAA,EAAAQ,oBAAA;UACnBC,IAAA;UACAC,WAAY;QACZ,IAEA,mBAAAd,kBAAA,CAAAI,GAAA,EAAAQ,oBACE;UAAAC,IAAA;UACEC,WAAC;QAAY;MACL;IAEO;EAC6B;AAErB;AAAA,SAAAF,oBAEzBA,CAAAI,KAAA;EAAA,IAAAC,EAAA,aAEAD,KAAA,CAAAH,IAAA;EACE,IAAAK,KAAA,GAAAF,KAAC,CAAAF,WAAA,iBAAY,GAAAX,UAAA,CAAAgB,MAAA,GAAAhB,UAAA,CAAAiB,MAAA;EAAA,sBAAZ,IAAApB,kBAAA,CAAAQ,IAAA,EAAAL,UAAA,CAAAM,MAAA;IAAAY,aAAA,EACCL,KAAA,CAAMF,WAAA;IAAAJ,KAAA,UACN;IAAWY,OAAA,UACX;IAAaX,GAAA;IAC6BJ,QAAA,GAEnB,mBAAAP,kBAAA,CAAAI,GAAA,EAAAD,UAAA,CAAAoB,KAAA;MAAAC,EAAA,MACzB;MACFF,OAEA;MACEG,IAAA,MAAC;MAAYC,OAAA,EAAZT,EAAA;MAAAV,QAAA,EACCS,KAAA,CAAAH,IAAM;IAAA,IACK,eACX,IAAAb,kBAAa,CAAAI,GAAA,EAAAD,UAAA,CAAAwB,WAAA;MAAAb,WACb,EAAAE,KAAA,CAAAF,WAAe;MAA2BG,EAAA;MAEpBJ,IAAA,EAAAG,KAAA,CAAAH,IAAA;MAAAe,mBAE1B,EAAAZ,KAAA,CAAAH,IAAA;MAAAN,QACF,qBAAAP,kBAAA,CAAAQ,IAAA,EAAAU,KAAA;QAAAX,QAAA,GACF,mBAAAP,kBAAA,CAAAI,GAAA,EAAAc,KAAA,CAAAW,IAAA;UAAAtB,QAAA,qBAAAP,kBAAA,CAAAI,GAAA,EAAAD,UAAA,CAAAwB,WAAA,CAAAE,IAAA;YAAAnC,KAAA;YACF;YAEJoC,YAAA","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToggleGroupDemo_exports","__export","ToggleGroupDemo","module","exports","import_jsx_runtime","require","import_lucide_icons_2","import_hanzogui","jsx","YStack","px","children","jsxs","XStack","items","gap","ToggleGroupComponent","type","orientation","y","props","id","Group","XGroup","YGroup","flexDirection","justify","Label","pr","size","htmlFor","ToggleGroup","disableDeactivation","Item","borderRadius"],"sources":["../../src/ToggleGroupDemo.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,uBAAA;AAAAC,QAAA,CAAAD,uBAAA;EAAAE,eAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAmD,CAAAK,uBAAA;AACnD,IAAAK,kBAAmE,GAAAC,OAAA;AAM3D,IAAAC,qBAAA,GAAAD,OAAA;AAJD,IAAAE,eAAS,GAAAF,OAAkB;AAChC,SACEJ,gBAAA;EAEI,0BAAAG,kBAAA,CAAAI,GAAC,EAAAD,eAAA,CAAAE,MAAO;IACNC,EAAA;IAA6DC,QAC7D,qBAAAP,kBAAC,CAAAQ,IAAA,EAAAL,eAAqB,CAAAM,MAAK;MAAoCC,KACjE;MACAC,GAAA;MACEJ,QAAA,GACA,mBAAAP,kBAAA,CAAAQ,IAAC,EAAAL,eAAA,CAAAE,MAAqB;QACxBK,KAAA;QAEJC,GAAA;QAEJJ,QAAA,GAES,iBAAqB,EAAAP,kBAG3B,CAAAI,GAAA,EAAAQ,oBAAA;UACUC,IAAA,UAAU;UACfC,WAAc;QAGlB,IAAC,mBAAAd,kBAAA,CAAAI,GAAA,EAAAQ,oBAAA;UAAAC,IAAA;UACCC,WAAe,EAAM;QACrB,CAAM;MAEN,IAEA,mBAAAd,kBAAA,CAAAQ,IAAA,EAAAL,eAAA,CAAAM,MAAA;QAAAC,KAAA;QAIAC,GAAA;QAACI,CAAA;QAAAR,QAAA,GACC,eAAa,IAAMP,kBAAA,CAAAI,GAAA,EAAAQ,oBAAA;UACnBC,IAAA;UACAC,WAAY;QACZ,IAEA,mBAAAd,kBAAA,CAAAI,GAAA,EAAAQ,oBACE;UAAAC,IAAA;UACEC,WAAC;QAAY;MACL;IAEO;EAC6B;AAErB;AAAA,SAAAF,oBAEzBA,CAAAI,KAAA;EAAA,IAAAC,EAAA,aAEAD,KAAA,CAAAH,IAAA;EACE,IAAAK,KAAA,GAAAF,KAAC,CAAAF,WAAA,iBAAY,GAAAX,eAAA,CAAAgB,MAAA,GAAAhB,eAAA,CAAAiB,MAAA;EAAA,sBAAZ,IAAApB,kBAAA,CAAAQ,IAAA,EAAAL,eAAA,CAAAM,MAAA;IAAAY,aAAA,EACCL,KAAA,CAAMF,WAAA;IAAAJ,KAAA,UACN;IAAWY,OAAA,UACX;IAAaX,GAAA;IAC6BJ,QAAA,GAEnB,mBAAAP,kBAAA,CAAAI,GAAA,EAAAD,eAAA,CAAAoB,KAAA;MAAAC,EAAA,MACzB;MACFF,OAEA;MACEG,IAAA,MAAC;MAAYC,OAAA,EAAZT,EAAA;MAAAV,QAAA,EACCS,KAAA,CAAAH,IAAM;IAAA,IACK,eACX,IAAAb,kBAAa,CAAAI,GAAA,EAAAD,eAAA,CAAAwB,WAAA;MAAAb,WACb,EAAAE,KAAA,CAAAF,WAAe;MAA2BG,EAAA;MAEpBJ,IAAA,EAAAG,KAAA,CAAAH,IAAA;MAAAe,mBAE1B,EAAAZ,KAAA,CAAAH,IAAA;MAAAN,QACF,qBAAAP,kBAAA,CAAAQ,IAAA,EAAAU,KAAA;QAAAX,QAAA,GACF,mBAAAP,kBAAA,CAAAI,GAAA,EAAAc,KAAA,CAAAW,IAAA;UAAAtB,QAAA,qBAAAP,kBAAA,CAAAI,GAAA,EAAAD,eAAA,CAAAwB,WAAA,CAAAE,IAAA;YAAAnC,KAAA;YACF;YAEJoC,YAAA","ignoreList":[]}

package/dist/cjs/TokensDemo.cjs

@@ -38,7 +38,7 @@ __export(TokensDemo_exports, {
 module.exports = __toCommonJS(TokensDemo_exports);
 var import_core = require("@hanzogui/core");
 var import_react = __toESM(require("react"), 1);
-var import_gui = require("@hanzo/gui");
+var import_hanzogui = require("hanzogui");
 var import_jsx_runtime = require("react/jsx-runtime");
 const sections = [{
   name: `Size`,
@@ -55,17 +55,17 @@ const sections = [{
 }];
 function TokensDemo() {
   const [section, setSection] = import_react.default.useState("size");
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
     gap: "$4",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.XGroup, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.XGroup, {
       items: "center",
       self: "center",
       children: sections.map(({
         name,
         key
       }) => {
-        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.XGroup.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.XGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
             size: "$3",
             theme: section === key ? "accent" : null,
             onPress: () => setSection(key),
@@ -86,31 +86,31 @@ function SizeSection({
   const st = Object.keys(tokens).sort((a, b) => Number.parseFloat(a) > Number.parseFloat(b) ? 1 : -1);
   const spaceTokens = st.filter(t => Number.parseFloat(t) >= 0);
   const spaceTokensNegative = st.filter(t => Number.parseFloat(t) < 0).sort((a, b) => Number.parseFloat(a) > Number.parseFloat(b) ? -1 : 1);
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
     flex: 1,
     gap: "$4",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.H2, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.H2, {
       children: "Sizes"
-    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
       width: "100%",
       gap: "$2",
       children: (section === "spaceNegative" ? spaceTokensNegative : spaceTokens).map(token => {
-        return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
           width: "100%",
           items: "center",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
             width: "25%",
-            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.H3, {
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.H3, {
               size: "$6",
               children: ["$", token]
             })
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
             width: "20%",
-            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.H4, {
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.H4, {
               size: "$5",
               children: [tokens[token]?.val, "px"]
             })
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Square, {
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Square, {
             size: tokens[token]?.val,
             backgroundColor: "$color5",
             ...(section === "spaceNegative" && {

package/dist/cjs/TokensDemo.native.js

@@ -41,7 +41,7 @@ module.exports = __toCommonJS(TokensDemo_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_core = require("@hanzogui/core");
 var import_react = __toESM(require("react"), 1);
-var import_gui = require("@hanzo/gui");
+var import_hanzogui = require("hanzogui");
 var sections = [{
   name: `Size`,
   key: `size`
@@ -57,9 +57,9 @@ var sections = [{
 }];
 function TokensDemo() {
   var [section, setSection] = import_react.default.useState("size");
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
     gap: "$4",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.XGroup, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.XGroup, {
       items: "center",
       self: "center",
       children: sections.map(function (param) {
@@ -67,8 +67,8 @@ function TokensDemo() {
           name,
           key
         } = param;
-        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.XGroup.Item, {
-          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.XGroup.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Button, {
             size: "$3",
             theme: section === key ? "accent" : null,
             onPress: function () {
@@ -100,33 +100,33 @@ function SizeSection(param) {
   }).sort(function (a, b) {
     return Number.parseFloat(a) > Number.parseFloat(b) ? -1 : 1;
   });
-  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.YStack, {
     flex: 1,
     gap: "$4",
-    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.H2, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.H2, {
       children: "Sizes"
-    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
       width: "100%",
       gap: "$2",
       children: (section === "spaceNegative" ? spaceTokensNegative : spaceTokens).map(function (token) {
         var _tokens_token, _tokens_token1, _tokens_, _allTokens_size_token, _tokens_token2;
         var _spaceTokensNegative_find;
-        return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.XStack, {
           width: "100%",
           items: "center",
-          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
             width: "25%",
-            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.H3, {
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.H3, {
               size: "$6",
               children: ["$", token]
             })
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.YStack, {
             width: "20%",
-            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.H4, {
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_hanzogui.H4, {
               size: "$5",
               children: [(_tokens_token = tokens[token]) === null || _tokens_token === void 0 ? void 0 : _tokens_token.val, "px"]
             })
-          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Square, {
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_hanzogui.Square, {
             size: (_tokens_token1 = tokens[token]) === null || _tokens_token1 === void 0 ? void 0 : _tokens_token1.val,
             backgroundColor: "$color5",
             ...(section === "spaceNegative" && {