@hanzogui/demos 2.0.0

package/dist/cjs/ToastDemo.cjs

@@ -0,0 +1,150 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
+var ToastDemo_exports = {};
+__export(ToastDemo_exports, {
+  ToastDemo: () => ToastDemo
+});
+module.exports = __toCommonJS(ToastDemo_exports);
+var import_toast = require("@hanzogui/toast"),
+  import_react = __toESM(require("react"), 1),
+  import_gui = require("@hanzo/gui"),
+  import_jsx_runtime = require("react/jsx-runtime");
+const ToastDemo = () => {
+    const [native, setNative] = import_react.default.useState(!1);
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.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
+      })]
+    });
+  },
+  CurrentToast = () => {
+    const currentToast = (0, import_toast.useToastState)();
+    return !currentToast || currentToast.isHandledNatively ? null : /* @__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_gui.XStack, {
+        gap: "$5",
+        items: "center",
+        justify: "space-between",
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.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: !0,
+          altText: "Dismiss toast",
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+            size: "$2",
+            children: "Dismiss"
+          })
+        })]
+      })
+    }, currentToast.id);
+  },
+  ToastControl = ({
+    native
+  }) => {
+    const toast = (0, import_toast.useToastController)();
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$2",
+      justify: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        onPress: () => {
+          toast.show("Successfully saved!", {
+            message: "Don't worry, we've got your data.",
+            native,
+            demo: !0
+          });
+        },
+        children: "Show"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        onPress: () => {
+          toast.hide();
+        },
+        children: "Hide"
+      })]
+    });
+  },
+  NativeOptions = ({
+    native,
+    setNative
+  }) => /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+    gap: "$3",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+      size: "$1",
+      onPress: () => setNative(!1),
+      children: "Custom"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch, {
+      theme: "surface2",
+      id: "native-toggle",
+      size: "$1",
+      checked: !!native,
+      onCheckedChange: val => setNative(val),
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch.Thumb, {
+        theme: "accent",
+        transition: ["quickest", {
+          transform: {
+            overshootClamping: !0
+          }
+        }]
+      })
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+      size: "$1",
+      onPress: () => setNative(!0),
+      children: "Native"
+    })]
+  });

package/dist/cjs/ToastDemo.native.js

@@ -0,0 +1,163 @@
+"use strict";
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
+var ToastDemo_exports = {};
+__export(ToastDemo_exports, {
+  ToastDemo: () => ToastDemo
+});
+module.exports = __toCommonJS(ToastDemo_exports);
+var import_jsx_runtime = require("react/jsx-runtime"),
+  import_toast = require("@hanzogui/toast"),
+  import_react = __toESM(require("react"), 1),
+  import_gui = require("@hanzo/gui"),
+  ToastDemo = function () {
+    var [native, setNative] = import_react.default.useState(!1);
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.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
+      })]
+    });
+  },
+  CurrentToast = function () {
+    var currentToast = (0, import_toast.useToastState)();
+    return !currentToast || currentToast.isHandledNatively ? null : /* @__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_gui.XStack, {
+        gap: "$5",
+        items: "center",
+        justify: "space-between",
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.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: !0,
+          altText: "Dismiss toast",
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+            size: "$2",
+            children: "Dismiss"
+          })
+        })]
+      })
+    }, currentToast.id);
+  },
+  ToastControl = function (param) {
+    var {
+        native
+      } = param,
+      toast = (0, import_toast.useToastController)();
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$2",
+      justify: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        onPress: function () {
+          toast.show("Successfully saved!", {
+            message: "Don't worry, we've got your data.",
+            native,
+            demo: !0
+          });
+        },
+        children: "Show"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        onPress: function () {
+          toast.hide();
+        },
+        children: "Hide"
+      })]
+    });
+  },
+  NativeOptions = function (param) {
+    var {
+      native,
+      setNative
+    } = param;
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$3",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+        size: "$1",
+        onPress: function () {
+          return setNative(!1);
+        },
+        children: "Custom"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch, {
+        theme: "surface2",
+        id: "native-toggle",
+        size: "$1",
+        checked: !!native,
+        onCheckedChange: function (val) {
+          return setNative(val);
+        },
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch.Thumb, {
+          theme: "accent",
+          transition: ["quickest", {
+            transform: {
+              overshootClamping: !0
+            }
+          }]
+        })
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+        size: "$1",
+        onPress: function () {
+          return setNative(!0);
+        },
+        children: "Native"
+      })]
+    });
+  };
+//# sourceMappingURL=ToastDemo.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToastDemo_exports","__export","ToastDemo","module","exports","import_jsx_runtime","require","import_toast","import_react","__toESM","import_gui","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/ToastDemo.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/ToastDuplicateDemo.cjs

@@ -0,0 +1,83 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
+var ToastDuplicateDemo_exports = {};
+__export(ToastDuplicateDemo_exports, {
+  ToastDuplicateDemo: () => ToastDuplicateDemo
+});
+module.exports = __toCommonJS(ToastDuplicateDemo_exports);
+var import_lucide_icons_2 = require("@hanzogui/lucide-icons-2"),
+  import_toast = require("@hanzogui/toast"),
+  import_react = __toESM(require("react"), 1),
+  import_gui = require("@hanzo/gui"),
+  import_jsx_runtime = require("react/jsx-runtime");
+const ToastDuplicateDemo = () => {
+  const [savedCount, setSavedCount] = import_react.default.useState(0);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+    items: "center",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+      onPress: () => {
+        setSavedCount(old => old + 1);
+      },
+      children: "Show toast"
+    }), [...Array(savedCount)].map((_, index) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast, {
+      viewportName: "viewport-multiple",
+      duration: 4e3,
+      enterStyle: {
+        opacity: 0,
+        scale: 0.5,
+        y: -25
+      },
+      exitStyle: {
+        opacity: 0,
+        scale: 1,
+        y: -20
+      },
+      y: 0,
+      opacity: 1,
+      scale: 1,
+      transition: "100ms",
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$4",
+        items: "center",
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons_2.CheckCircle2, {})
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Title, {
+            children: "Successfully saved!"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Description, {
+            children: "Don't worry... We've got your data."
+          })]
+        })]
+      })
+    }, index))]
+  });
+};

package/dist/cjs/ToastDuplicateDemo.native.js

@@ -0,0 +1,92 @@
+"use strict";
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf,
+  __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+    for (var name in all) __defProp(target, name, {
+      get: all[name],
+      enumerable: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+  }) : target, mod)),
+  __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+    value: !0
+  }), mod);
+var ToastDuplicateDemo_exports = {};
+__export(ToastDuplicateDemo_exports, {
+  ToastDuplicateDemo: () => ToastDuplicateDemo
+});
+module.exports = __toCommonJS(ToastDuplicateDemo_exports);
+var import_jsx_runtime = require("react/jsx-runtime"),
+  import_lucide_icons_2 = require("@hanzogui/lucide-icons-2"),
+  import_toast = require("@hanzogui/toast"),
+  import_react = __toESM(require("react"), 1),
+  import_gui = require("@hanzo/gui"),
+  ToastDuplicateDemo = function () {
+    var [savedCount, setSavedCount] = import_react.default.useState(0);
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+      items: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Button, {
+        onPress: function () {
+          setSavedCount(function (old) {
+            return old + 1;
+          });
+        },
+        children: "Show toast"
+      }), [...Array(savedCount)].map(function (_, index) {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast, {
+          viewportName:
+          // Sends to a viewport that supports multiple toasts with the `multipleToasts` prop
+          "viewport-multiple",
+          duration: 4e3,
+          enterStyle: {
+            opacity: 0,
+            scale: 0.5,
+            y: -25
+          },
+          exitStyle: {
+            opacity: 0,
+            scale: 1,
+            y: -20
+          },
+          y: 0,
+          opacity: 1,
+          scale: 1,
+          transition: "100ms",
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+            gap: "$4",
+            items: "center",
+            children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+              children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons_2.CheckCircle2, {})
+            }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+              children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Title, {
+                children: "Successfully saved!"
+              }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_toast.Toast.Description, {
+                children: "Don't worry... We've got your data."
+              })]
+            })]
+          })
+        }, index);
+      })]
+    });
+  };
+//# sourceMappingURL=ToastDuplicateDemo.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","ToastDuplicateDemo_exports","__export","ToastDuplicateDemo","module","exports","import_jsx_runtime","require","import_lucide_icons_2","import_toast","import_react","__toESM","import_gui","savedCount","setSavedCount","default","useState","jsxs","YStack","items","children","jsx","Button","onPress","old","Array","map","_","index","Toast","viewportName","duration","enterStyle","opacity","scale","y","exitStyle"],"sources":["../../src/ToastDuplicateDemo.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAAA;EAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;IAAAC,KAAA;EAAA,IAAAH,GAAA;AAAA,IAAAI,0BAAA;AAAAC,QAAA,CAAAD,0BAAA;EAAAE,kBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAA6B,CAAAK,0BAAA;AAQtB,IAAAK,kBAAM,GAAAC,OAAqB,CAAM;EAAAC,qBAAA,GAAAD,OAAA;EAAAE,YAAA,GAAAF,OAAA;EAAAG,YAAA,GAAAC,OAAA,CAAAJ,OAAA;EAAAK,UAAA,GAAAL,OAAA;EAAAJ,kBAAA,YAAAA,CAAA;IACtC,KAAAU,UAAO,EAAAC,aAAY,IAAaJ,YAAI,CAAAK,OAAA,CAAAC,QAAM,GAAS;IAEnD,OACE,mBAAAV,kBAAA,CAAAW,IAAA,EAACL,UAAA,CAAAM,MAAA;MACCC,KAAA;MAAAC,QAAC,sBAAAd,kBAAA,CAAAe,GAAA,EAAAT,UAAA,CAAAU,MAAA;QACCC,OAAA,EAAS,SAAAA,CAAA,EAAM;UACbT,aAAA,CAAc,UAASU,GAAA;YACzB,OAAAA,GAAA;UACD;QAAA;QAEDJ,QAAA;MACE,EAAG,EACF,IAAAK,KAAA,CAAAZ,UAAA,GACCa,GAAA,WAAAC,CAAa,EAAAC,KAAA;QAEb,sBAAU,IAAAtB,kBAAA,CAAAe,GAAA,EAAAZ,YAAA,CAAAoB,KAAA;UACVC,YAAc;UACd;UACG,mBACH;UACAC,QAAO;UACPC,UAAW;YAEXC,OAAA;YACEC,KAAA;YAIAC,CAAA;UACE;UAAgCC,SAChC;YAAsDH,OACxD;YACFC,KAAA;YAAAC,CAAA;UAlBK;UAoBRA,CAAA;UACHF,OAAA;UAEJC,KAAA","ignoreList":[]}

package/dist/cjs/ToggleGroupDemo.cjs

@@ -0,0 +1,120 @@
+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: !0
+    });
+  },
+  __copyProps = (to, from, except, desc) => {
+    if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__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: !0
+}), mod);
+var ToggleGroupDemo_exports = {};
+__export(ToggleGroupDemo_exports, {
+  ToggleGroupDemo: () => ToggleGroupDemo
+});
+module.exports = __toCommonJS(ToggleGroupDemo_exports);
+var import_lucide_icons_2 = require("@hanzogui/lucide-icons-2"),
+  import_gui = require("@hanzo/gui"),
+  import_jsx_runtime = require("react/jsx-runtime");
+function ToggleGroupDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    px: "$4",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      items: "center",
+      gap: "$10",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+        items: "center",
+        gap: "$6",
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToggleGroupComponent, {
+          type: "single",
+          orientation: "horizontal"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(ToggleGroupComponent, {
+          type: "multiple",
+          orientation: "horizontal"
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        items: "center",
+        gap: "$6",
+        y: -28,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToggleGroupComponent, {
+          type: "single",
+          orientation: "vertical"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(ToggleGroupComponent, {
+          type: "multiple",
+          orientation: "vertical"
+        })]
+      })]
+    })
+  });
+}
+function ToggleGroupComponent(props) {
+  const id = `switch-${props.type}`,
+    Group = props.orientation === "horizontal" ? import_gui.XGroup : import_gui.YGroup;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+    flexDirection: props.orientation === "horizontal" ? "row" : "column",
+    items: "center",
+    justify: "center",
+    gap: "$4",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.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, {
+      orientation: props.orientation,
+      id,
+      type: props.type,
+      disableDeactivation: props.type === "single" ? !0 : 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, {
+            value: "left",
+            "aria-label": "Left aligned",
+            borderRadius: "$4",
+            activeStyle: {
+              backgroundColor: "$color5"
+            },
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons_2.AlignLeft, {
+              size: 16
+            })
+          })
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+            value: "center",
+            "aria-label": "Center aligned",
+            borderRadius: "$4",
+            activeStyle: {
+              backgroundColor: "$color5"
+            },
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons_2.AlignCenter, {
+              size: 16
+            })
+          })
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Group.Item, {
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.ToggleGroup.Item, {
+            value: "right",
+            "aria-label": "Right aligned",
+            borderRadius: "$4",
+            activeStyle: {
+              backgroundColor: "$color5"
+            },
+            children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_lucide_icons_2.AlignRight, {
+              size: 16
+            })
+          })
+        })]
+      })
+    })]
+  });
+}