@hanzogui/demos 2.0.0

package/dist/cjs/SwitchDemo.cjs

@@ -0,0 +1,101 @@
+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 SwitchDemo_exports = {};
+__export(SwitchDemo_exports, {
+  SwitchDemo: () => SwitchDemo,
+  SwitchWithLabel: () => SwitchWithLabel
+});
+module.exports = __toCommonJS(SwitchDemo_exports);
+var import_gui = require("@hanzo/gui"),
+  import_jsx_runtime = require("react/jsx-runtime");
+function SwitchDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+      width: 200,
+      items: "center",
+      gap: "$3",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$3",
+        $xs: {
+          flexDirection: "column"
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$2"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$2",
+          defaultChecked: !0
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$3",
+        $xs: {
+          flexDirection: "column"
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$3"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$3",
+          defaultChecked: !0
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$3",
+        $xs: {
+          flexDirection: "column"
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$4"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$4",
+          defaultChecked: !0
+        })]
+      })]
+    })
+  });
+}
+function SwitchWithLabel(props) {
+  const id = `switch-${props.size.toString().slice(1)}-${props.defaultChecked ?? ""}}`;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+    width: 200,
+    items: "center",
+    gap: "$4",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+      pr: "$0",
+      minW: 90,
+      justify: "flex-end",
+      size: props.size,
+      htmlFor: id,
+      children: "Accept"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Separator, {
+      minH: 20,
+      vertical: !0
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch, {
+      id,
+      transition: "300ms",
+      size: props.size,
+      defaultChecked: props.defaultChecked,
+      activeStyle: {
+        backgroundColor: "$color6"
+      },
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch.Thumb, {
+        transition: "quickest"
+      })
+    })]
+  });
+}

package/dist/cjs/SwitchDemo.native.js

@@ -0,0 +1,107 @@
+"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: !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 SwitchDemo_exports = {};
+__export(SwitchDemo_exports, {
+  SwitchDemo: () => SwitchDemo,
+  SwitchWithLabel: () => SwitchWithLabel
+});
+module.exports = __toCommonJS(SwitchDemo_exports);
+var import_jsx_runtime = require("react/jsx-runtime"),
+  import_gui = require("@hanzo/gui");
+function SwitchDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.YStack, {
+      width: 200,
+      items: "center",
+      gap: "$3",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$3",
+        $xs: {
+          flexDirection: "column"
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$2"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$2",
+          defaultChecked: !0
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$3",
+        $xs: {
+          flexDirection: "column"
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$3"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$3",
+          defaultChecked: !0
+        })]
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+        gap: "$3",
+        $xs: {
+          flexDirection: "column"
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$4"
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(SwitchWithLabel, {
+          size: "$4",
+          defaultChecked: !0
+        })]
+      })]
+    })
+  });
+}
+function SwitchWithLabel(props) {
+  var _props_defaultChecked,
+    id = `switch-${props.size.toString().slice(1)}-${(_props_defaultChecked = props.defaultChecked) !== null && _props_defaultChecked !== void 0 ? _props_defaultChecked : ""}}`;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+    width: 200,
+    items: "center",
+    gap: "$4",
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+      pr: "$0",
+      minW: 90,
+      justify: "flex-end",
+      size: props.size,
+      htmlFor: id,
+      children: "Accept"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Separator, {
+      minH: 20,
+      vertical: !0
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch, {
+      id,
+      transition: "300ms",
+      size: props.size,
+      defaultChecked: props.defaultChecked,
+      // use activeStyle to choose youra active color
+      // default to $backgroundActive unless "unstyled" boolean prop is on
+      activeStyle: {
+        backgroundColor: "$color6"
+      },
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Switch.Thumb, {
+        transition: "quickest"
+      })
+    })]
+  });
+}
+//# sourceMappingURL=SwitchDemo.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","SwitchDemo_exports","__export","SwitchDemo","SwitchWithLabel","module","exports","import_jsx_runtime","require","import_gui","jsx","Fragment","children","jsxs","YStack","width","items","gap","XStack","$xs","flexDirection","size","defaultChecked"],"sources":["../../src/SwitchDemo.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,kBAAA;AAAAC,QAAA,CAAAD,kBAAA;EAAAE,UAAA,EAAAA,CAAA,KAAAA,UAAA;EAAAC,eAAA,EAAAA,CAAA,KAAAA;AAAA;AACAC,MAAA,CAAAC,OAAA,GAAgEV,YAAA,CAAAK,kBAI5D;AAFG,IAAAM,kBAAsB,GAAAC,OAAA;EAAAC,UAAA,GAAAD,OAAA;AAC3B,SACEL,WAAA;EAEI,0BAAAI,kBAAA,CAAAG,GAAC,EAAAH,kBAAO,CAAAI,QAAI,EAAK;IACfC,QAAA,qBAAAL,kBAAC,CAAAM,IAAA,EAAAJ,UAAgB,CAAAK,MAAK;MACtBC,KAAA;MAA0CC,KAC5C;MACAC,GAAA;MACEL,QAAA,GACA,mBAAAL,kBAAA,CAAAM,IAAC,EAAAJ,UAAA,CAAAS,MAAgB;QACnBD,GAAA;QACAE,GAAA;UACEC,aAAA;QACA;QACFR,QAAA,GAEJ,mBAAAL,kBAAA,CAAAG,GAAA,EAAAN,eAAA;UAEJiB,IAAA;QAEgB,IAKR,eAAe,CAAM,GAAAd,kBAAgB,CAAMG,GAAE,EAAAN,eAAU;UAE3DiB,IAAA;UACEC,cAAA;QAGA;MACC,uBAAAf,kBAAA,CAAAM,IAAA,EAAAJ,UAAA,CAAAS,MAAA;QACCD,GAAA;QACAE,GAAA;UACAC,aAAY;QACZ;QAGAR,QAAA,GACE,eAAiB,IAAAL,kBAAA,CAAAG,GAAA,EAAAN,eAAA;UACnBiB,IAAA;QAEA,IAAoC,mBAAAd,kBAAA,CAAAG,GAAA,EAAAN,eAAA;UACtCiB,IAAA;UACFC,cAAA;QAEJ","ignoreList":[]}

package/dist/cjs/SwitchHeadlessDemo.cjs

@@ -0,0 +1,103 @@
+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 SwitchHeadlessDemo_exports = {};
+__export(SwitchHeadlessDemo_exports, {
+  SwitchHeadlessDemo: () => SwitchHeadlessDemo
+});
+module.exports = __toCommonJS(SwitchHeadlessDemo_exports);
+var import_react = __toESM(require("react"), 1),
+  import_switch_headless = require("@hanzogui/switch-headless"),
+  import_react_native = require("react-native-web"),
+  import_gui = require("@hanzo/gui"),
+  import_jsx_runtime = require("react/jsx-runtime");
+function SwitchHeadlessDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    width: 200,
+    items: "center",
+    gap: "$3",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$3",
+      items: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+        htmlFor: "headless",
+        children: "Headless"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(HeadlessSwitch, {
+        defaultChecked: !0,
+        id: "headless"
+      })]
+    })
+  });
+}
+const HeadlessSwitch = import_react.default.forwardRef((props, ref) => {
+  const [checked, setChecked] = import_react.default.useState(props.defaultChecked || !1),
+    {
+      switchProps,
+      switchRef,
+      bubbleInput
+    } = (0, import_switch_headless.useSwitch)(props, [checked, setChecked], ref),
+    [animation] = import_react.default.useState(() => new import_react_native.Animated.Value(0));
+  import_react.default.useEffect(() => {
+    import_react_native.Animated.timing(animation, {
+      toValue: checked ? 1 : 0,
+      duration: 100,
+      useNativeDriver: !0
+    }).start();
+  }, [checked, animation]);
+  const translateX = import_react.default.useMemo(() => animation.interpolate({
+    inputRange: [0, 1],
+    outputRange: [0, 20]
+  }), [animation]);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
+      style: {
+        width: 40,
+        height: 20,
+        borderRadius: 100,
+        backgroundColor: checked ? "lightblue" : "silver"
+      },
+      ref: switchRef,
+      ...switchProps,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Animated.View, {
+        style: [{
+          backgroundColor: "black",
+          borderRadius: 100,
+          width: 20,
+          height: 20
+        }, {
+          transform: [{
+            translateX
+          }]
+        }]
+      })
+    }), bubbleInput]
+  });
+});

package/dist/cjs/SwitchHeadlessDemo.native.js

@@ -0,0 +1,110 @@
+"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 SwitchHeadlessDemo_exports = {};
+__export(SwitchHeadlessDemo_exports, {
+  SwitchHeadlessDemo: () => SwitchHeadlessDemo
+});
+module.exports = __toCommonJS(SwitchHeadlessDemo_exports);
+var import_jsx_runtime = require("react/jsx-runtime"),
+  import_react = __toESM(require("react"), 1),
+  import_switch_headless = require("@hanzogui/switch-headless"),
+  import_react_native = require("react-native"),
+  import_gui = require("@hanzo/gui");
+function SwitchHeadlessDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    width: 200,
+    items: "center",
+    gap: "$3",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$3",
+      items: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+        htmlFor: "headless",
+        children: "Headless"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(HeadlessSwitch, {
+        defaultChecked: !0,
+        id: "headless"
+      })]
+    })
+  });
+}
+var HeadlessSwitch = /* @__PURE__ */import_react.default.forwardRef(function (props, ref) {
+  var [checked, setChecked] = import_react.default.useState(props.defaultChecked || !1),
+    {
+      switchProps,
+      switchRef,
+      bubbleInput
+    } = (0, import_switch_headless.useSwitch)(props, [checked, setChecked], ref),
+    [animation] = import_react.default.useState(function () {
+      return new import_react_native.Animated.Value(0);
+    });
+  import_react.default.useEffect(function () {
+    import_react_native.Animated.timing(animation, {
+      toValue: checked ? 1 : 0,
+      duration: 100,
+      useNativeDriver: !0
+    }).start();
+  }, [checked, animation]);
+  var translateX = import_react.default.useMemo(function () {
+    return animation.interpolate({
+      inputRange: [0, 1],
+      outputRange: [0, 20]
+    });
+  }, [animation]);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
+      style: {
+        width: 40,
+        height: 20,
+        borderRadius: 100,
+        backgroundColor: checked ? "lightblue" : "silver"
+      },
+      ref: switchRef,
+      ...switchProps,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Animated.View, {
+        style: [{
+          backgroundColor: "black",
+          borderRadius: 100,
+          width: 20,
+          height: 20
+        }, {
+          transform: [{
+            translateX
+          }]
+        }]
+      })
+    }), bubbleInput]
+  });
+});
+//# sourceMappingURL=SwitchHeadlessDemo.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","SwitchHeadlessDemo_exports","__export","SwitchHeadlessDemo","module","exports","import_jsx_runtime","require","import_react","__toESM","import_switch_headless","import_react_native","import_gui","jsx","YStack","width","items","gap","children","jsxs","XStack","Label","htmlFor","HeadlessSwitch","defaultChecked","id","default","forwardRef","props","ref","checked","setChecked","useState","switchProps","switchRef","bubbleInput","useSwitch","animation","Animated","Value","useEffect","timing","toValue","duration","useNativeDriver","start","translateX","useMemo","interpolate","inputRange","outputRange","Fragment","Pressable","style","height"],"sources":["../../src/SwitchHeadlessDemo.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,YAAkB,CAAAK,0BAElB;AAMO,IAAAK,kBAAS,GAAAC,OAAqB;EAAAC,YAAA,GAAAC,OAAA,CAAAF,OAAA;EAAAG,sBAAA,GAAAH,OAAA;EAAAI,mBAAA,GAAAJ,OAAA;EAAAK,UAAA,GAAAL,OAAA;AACnC,SACEJ,mBAAA;EAEI,0BAAAG,kBAAA,CAACO,GAAA,EAAAD,UAAA,CAAAE,MAAM;IACPC,KAAA;IAA6CC,KAEjD;IAEJC,GAAA;IAEAC,QAAM,iBAAiB,IAAAZ,kBAAM,CAAAa,IAAuC,EAAAP,UAAO,CAAAQ,MAAQ;MACjFH,GAAO;MAELD,KAAA;MACCE,QAAS,GACV,mBAAAZ,kBAAA,CAAAO,GAAA,EAAAD,UAAA,CAAAS,KAAA;QAGKC,OAAS,EAAI;QAEpBJ,QAAA;MACE,IACE,eAAS,CAAU,GAAAZ,kBAAI,CAAAO,GAAA,EAAAU,cAAA;QACvBC,cAAU;QACVC,EAAA;MACC;IAGL;EAAyB,EACvB;AACwB;AACH,IAAAF,cACjB,GAAc,eAAKf,YAAA,CAAAkB,OAAA,CAAAC,UAAA,WAAAC,KAAA,EAAAC,GAAA;EAAA,IACpB,CAAAC,OAAA,EAAAC,UAAA,IAAAvB,YAAA,CAAAkB,OAAA,CAAAM,QAAA,CAAAJ,KAAA,CAAAJ,cAAA;IAAA;MAAAS,WAAA;MAAAC,SAAA;MAAAC;IAAA,QAAAzB,sBAAA,CAAA0B,SAAA,EAAAR,KAAA,GACHE,OAAC,EACHC,UAAA,CAEA,EAAAF,GAAA,CACE;IAAA,CAAAQ,SAAA,IAAA7B,YAAA,CAAAkB,OAAA,CAAAM,QAAA;MACE,WAAArB,mBAAA,CAAA2B,QAAA,CAAAC,KAAA;IAAA;EAAC/B,YAAA,CAAAkB,OAAA,CAAAc,SAAA;IAAA7B,mBACQ,CAAA2B,QAAA,CAAAG,MAAA,CAAAJ,SAAA;MAAAK,OACL,EAAAZ,OAAO;MAAAa,QACP,KAAQ;MAAAC,eACR,GAAc;IAAA,GAAAC,KACd;EAAyC,IAC3Cf,OACA,EAAKO,SACD;EAEJ,IAAAS,UAAC,GAAAtC,YAAA,CAAAkB,OAAS,CAAAqB,OAAA;IAAA,OAATV,SAAA,CAAAW,WAAA;MAAAC,UACC,GAAO,GACL,EACmB;MACHC,WACd,GAAO,GACC;IAEV;EAC4B,IAC5Bb,SACF;EAAA,OACF,mBAAA/B,kBAAA,CAAAa,IAAA,EAAAb,kBAAA,CAAA6C,QAAA;IAAAjC,QAAA,GACF,mBAAAZ,kBAAA,CAAAO,GAAA,EAAAF,mBAAA,CAAAyC,SAAA;MACCC,KAAA;QACHtC,KAAA;QAEHuC,MAAA","ignoreList":[]}

package/dist/cjs/SwitchUnstyledDemo.cjs

@@ -0,0 +1,89 @@
+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 SwitchUnstyledDemo_exports = {};
+__export(SwitchUnstyledDemo_exports, {
+  Switch: () => Switch,
+  SwitchUnstyledDemo: () => SwitchUnstyledDemo
+});
+module.exports = __toCommonJS(SwitchUnstyledDemo_exports);
+var import_core = require("@hanzogui/core"),
+  import_switch = require("@hanzogui/switch"),
+  import_gui = require("@hanzo/gui"),
+  import_jsx_runtime = require("react/jsx-runtime");
+const Frame = (0, import_core.styled)(import_core.View, {
+    width: 40,
+    height: 20,
+    rounded: 20,
+    variants: {
+      checked: {
+        true: {
+          backgroundColor: "lightblue"
+        },
+        false: {
+          backgroundColor: "silver"
+        }
+      }
+    },
+    defaultVariants: {
+      checked: !1
+    }
+  }),
+  Thumb = (0, import_core.styled)(import_core.View, {
+    width: 20,
+    height: 20,
+    bg: "black",
+    rounded: 20,
+    variants: {
+      checked: {
+        true: {
+          opacity: 0.8
+        },
+        false: {
+          opacity: 0.5
+        }
+      }
+    }
+  }),
+  Switch = (0, import_switch.createSwitch)({
+    Frame,
+    Thumb
+  });
+function SwitchUnstyledDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    width: 200,
+    items: "center",
+    gap: "$3",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$3",
+      items: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+        htmlFor: "unstyled-switch",
+        children: "Unstyled"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Switch, {
+        defaultChecked: !0,
+        id: "unstyled-switch",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(Switch.Thumb, {
+          transition: "quickest"
+        })
+      })]
+    })
+  });
+}

package/dist/cjs/SwitchUnstyledDemo.native.js

@@ -0,0 +1,92 @@
+"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: !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 SwitchUnstyledDemo_exports = {};
+__export(SwitchUnstyledDemo_exports, {
+  Switch: () => Switch,
+  SwitchUnstyledDemo: () => SwitchUnstyledDemo
+});
+module.exports = __toCommonJS(SwitchUnstyledDemo_exports);
+var import_jsx_runtime = require("react/jsx-runtime"),
+  import_core = require("@hanzogui/core"),
+  import_switch = require("@hanzogui/switch"),
+  import_gui = require("@hanzo/gui"),
+  Frame = (0, import_core.styled)(import_core.View, {
+    width: 40,
+    height: 20,
+    rounded: 20,
+    variants: {
+      checked: {
+        true: {
+          backgroundColor: "lightblue"
+        },
+        false: {
+          backgroundColor: "silver"
+        }
+      }
+    },
+    defaultVariants: {
+      checked: !1
+    }
+  }),
+  Thumb = (0, import_core.styled)(import_core.View, {
+    width: 20,
+    height: 20,
+    bg: "black",
+    rounded: 20,
+    variants: {
+      checked: {
+        true: {
+          opacity: 0.8
+        },
+        false: {
+          opacity: 0.5
+        }
+      }
+    }
+  }),
+  Switch = (0, import_switch.createSwitch)({
+    Frame,
+    Thumb
+  });
+function SwitchUnstyledDemo() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.YStack, {
+    width: 200,
+    items: "center",
+    gap: "$3",
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_gui.XStack, {
+      gap: "$3",
+      items: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_gui.Label, {
+        htmlFor: "unstyled-switch",
+        children: "Unstyled"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(Switch, {
+        defaultChecked: !0,
+        id: "unstyled-switch",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(Switch.Thumb, {
+          transition: "quickest"
+        })
+      })]
+    })
+  });
+}
+//# sourceMappingURL=SwitchUnstyledDemo.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","SwitchUnstyledDemo_exports","__export","Switch","SwitchUnstyledDemo","module","exports","import_jsx_runtime","require","import_core","import_switch","import_gui","Frame","styled","View","width","height","rounded","variants","checked","true","backgroundColor","false","defaultVariants","Thumb","bg","opacity","createSwitch","jsx","YStack","items","gap","children","jsxs","XStack"],"sources":["../../src/SwitchUnstyledDemo.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,0BAAA;AAAAC,QAAA,CAAAD,0BAAA;EAAAE,MAAA,EAAAA,CAAA,KAAAA,MAAA;EAAAC,kBAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAV,YAA6B,CAAAK,0BAC7B;AAGA,IAAAM,kBAAc,GAAAC,OAAA,oBAAO;EAAAC,WAAM,GAAAD,OAAA;EAAAE,aAAA,GAAAF,OAAA;EAAAG,UAAA,GAAAH,OAAA;EAAAI,KAAA,OAAAH,WAAA,CAAAI,MAAA,EAAAJ,WAAA,CAAAK,IAAA;IACzBC,KAAA,EAAO;IACPC,MAAA,EAAQ;IACRC,OAAA,EAAS;IACTC,QAAA,EAAU;MACRC,OAAA,EAAS;QACPC,IAAA,EAAM;UACJC,eAAA,EAAiB;QACnB;QACAC,KAAA,EAAO;UACLD,eAAA,EAAiB;QACnB;MACF;IACF;IACAE,eAAA,EAAiB;MACfJ,OAAA,EAAS;IACX;EACF,CAAC;EAEKK,KAAA,OAAQf,WAAA,CAAAI,MAAA,EAAOJ,WAAA,CAAAK,IAAA,EAAM;IACzBC,KAAA,EAAO;IACPC,MAAA,EAAQ;IACRS,EAAA,EAAI;IACJR,OAAA,EAAS;IAETC,QAAA,EAAU;MACRC,OAAA,EAAS;QACPC,IAAA,EAAM;UACJM,OAAA,EAAS;QACX;QACAJ,KAAA,EAAO;UACLI,OAAA,EAAS;QACX;MACF;IACF;EACF,CAAC;EAEYvB,MAAA,OAASO,aAAA,CAAAiB,YAAA,EAAa;IACjCf,KAAA;IACAY;EACF,CAAC;AAEM,SAASpB,mBAAA,EAAqB;EACnC,OACE,mBAAAG,kBAAA,CAAAqB,GAAA,EAACjB,UAAA,CAAAkB,MAAA;IAEGd,KAAA;IACAe,KAAA;IAEAC,GACF,EACF;IAEJC,QAAA,qBAAAzB,kBAAA,CAAA0B,IAAA,EAAAtB,UAAA,CAAAuB,MAAA","ignoreList":[]}