@konstructio/ui 0.1.2-alpha.119 → 0.1.2-alpha.120

package/dist/DropdownButton-BWfWN4fg.js

@@ -0,0 +1,121 @@
+import { o as M } from "./rolldown-runtime-B28h4lGi.js";
+import { t as I } from "./prop-types-qsAjMBb1.js";
+import { t as d } from "./utils-DnIJruo0.js";
+import { LoaderIcon as R } from "./assets/icons/components/Loader.js";
+import { Button as P } from "./components/Button/Button.js";
+import { useMediaQuery as T } from "./hooks/useMediaQuery.js";
+import { a as W, i as B, n as L, r as A, t as F } from "./dist-CMqY_9n-.js";
+import { ActionSheet as Q } from "./components/DropdownButton/components/ActionSheet/ActionSheet.js";
+import k, { Fragment as U, forwardRef as $, useState as q } from "react";
+import { jsx as s, jsxs as l } from "react/jsx-runtime";
+var m = /* @__PURE__ */ M(I());
+function f() {
+  return f = Object.assign || function(e) {
+    for (var n = 1; n < arguments.length; n++) {
+      var t = arguments[n];
+      for (var r in t) Object.prototype.hasOwnProperty.call(t, r) && (e[r] = t[r]);
+    }
+    return e;
+  }, f.apply(this, arguments);
+}
+function H(e, n) {
+  if (e == null) return {};
+  var t = Y(e, n), r, a;
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    for (a = 0; a < o.length; a++)
+      r = o[a], !(n.indexOf(r) >= 0) && Object.prototype.propertyIsEnumerable.call(e, r) && (t[r] = e[r]);
+  }
+  return t;
+}
+function Y(e, n) {
+  if (e == null) return {};
+  for (var t = {}, r = Object.keys(e), a, o = 0; o < r.length; o++)
+    a = r[o], !(n.indexOf(a) >= 0) && (t[a] = e[a]);
+  return t;
+}
+var h = $(function(e, n) {
+  var t = e.color, r = t === void 0 ? "currentColor" : t, a = e.size, o = a === void 0 ? 24 : a, p = H(e, ["color", "size"]);
+  return /* @__PURE__ */ k.createElement("svg", f({
+    ref: n,
+    xmlns: "http://www.w3.org/2000/svg",
+    width: o,
+    height: o,
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: r,
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }, p), /* @__PURE__ */ k.createElement("polyline", { points: "6 9 12 15 18 9" }));
+});
+h.propTypes = {
+  color: m.default.string,
+  size: m.default.oneOfType([m.default.string, m.default.number])
+};
+h.displayName = "ChevronDown";
+var G = "(max-width: 767.98px), (pointer: coarse)", ne = ({ align: e = "start", appearance: n, buttonClassName: t, className: r, disabled: a = !1, isLoading: o = !1, itemClassName: p, label: O = "Download Invoice as", listClassName: j, options: b, sheetTitle: g, sheetQuery: D = G, sheetPosition: S = "bottom", theme: v, variant: _, version: E }) => {
+  const [c, w] = q(!1), N = T(D), u = g !== void 0 && N, y = a || o, x = /* @__PURE__ */ l(P, {
+    appearance: n,
+    variant: _,
+    version: E,
+    disabled: y,
+    "aria-busy": o || void 0,
+    className: d("group flex gap-2 items-center justify-between w-full", t),
+    ...u ? {
+      "aria-haspopup": "dialog",
+      "aria-expanded": c,
+      onClick: () => w(!0)
+    } : {},
+    children: [O, o ? /* @__PURE__ */ s(R, {
+      size: 16,
+      className: "animate-spin shrink-0"
+    }) : /* @__PURE__ */ s(h, { className: d("transition-transform duration-200 group-data-[state=open]:rotate-180", u && c && "rotate-180") })]
+  });
+  return u ? /* @__PURE__ */ l("div", {
+    className: d("relative w-full", r),
+    children: [x, /* @__PURE__ */ s(Q, {
+      isOpen: c,
+      onClose: () => w(!1),
+      title: g,
+      options: b,
+      itemClassName: p,
+      position: S,
+      theme: v
+    })]
+  }) : /* @__PURE__ */ s(F, {
+    modal: !1,
+    children: /* @__PURE__ */ l("div", {
+      className: d("relative w-full", r),
+      "data-theme": v,
+      children: [/* @__PURE__ */ s(W, {
+        asChild: !0,
+        disabled: y,
+        children: x
+      }), /* @__PURE__ */ s(L, {
+        align: e,
+        sideOffset: 4,
+        loop: !0,
+        className: d("z-10 bg-white border border-gray-200 rounded shadow-xs animate-in fade-in-0 py-2", "dark:bg-metal-800 dark:border-metal-700 dark:text-metal-50", j),
+        style: { minWidth: "var(--radix-dropdown-menu-trigger-width)" },
+        children: b.map((i, z) => {
+          const C = i.disabled || !!i.disabledReason;
+          return /* @__PURE__ */ l(U, { children: [i.separator && /* @__PURE__ */ s(B, { className: "my-2 border-t border-gray-200 dark:border-metal-700" }), /* @__PURE__ */ l(A, {
+            disabled: C,
+            className: d("flex items-center justify-between gap-4 whitespace-nowrap outline-none px-6 py-1.5", "hover:bg-gray-50 focus:bg-gray-50 hover:cursor-pointer", "dark:text-metal-50 dark:hover:bg-metal-700 dark:focus:bg-metal-700", "data-[disabled]:cursor-not-allowed data-[disabled]:text-gray-400 data-[disabled]:hover:bg-transparent", "dark:data-[disabled]:text-metal-400", i.destructive && "text-red-600 dark:text-red-400", p),
+            onSelect: () => {
+              i.onClick?.();
+            },
+            children: [/* @__PURE__ */ s("span", { children: i.label }), i.disabledReason && /* @__PURE__ */ s("span", {
+              className: "shrink-0 text-xs text-gray-400 dark:text-metal-400",
+              children: i.disabledReason
+            })]
+          })] }, z);
+        })
+      })]
+    })
+  });
+};
+export {
+  ne as t
+};

package/dist/{HamburgerTrigger-BgeS_nBA.js → HamburgerTrigger-CfrAnhmG.js}

@@ -1,19 +1,19 @@
-import { o as m } from "./rolldown-runtime-Dw9YIBcH.js";
-import { t as c } from "./prop-types-BCUW56rg.js";
+import { o as m } from "./rolldown-runtime-B28h4lGi.js";
+import { t as c } from "./prop-types-qsAjMBb1.js";
 import { t as g } from "./dist-C_jtUTU9.js";
 import { t as d } from "./utils-DnIJruo0.js";
 import { hamburgerTriggerVariants as y } from "./components/Sidebar/components/HamburgerTrigger/HamburgerTrigger.variants.js";
 import a, { forwardRef as v } from "react";
 import { jsx as u, jsxs as b } from "react/jsx-runtime";
-var s = /* @__PURE__ */ m(c());
-function l() {
-  return l = Object.assign || function(r) {
+var l = /* @__PURE__ */ m(c());
+function s() {
+  return s = Object.assign || function(r) {
     for (var n = 1; n < arguments.length; n++) {
       var t = arguments[n];
       for (var e in t) Object.prototype.hasOwnProperty.call(t, e) && (r[e] = t[e]);
     }
     return r;
-  }, l.apply(this, arguments);
+  }, s.apply(this, arguments);
 }
 function h(r, n) {
   if (r == null) return {};
@@ -33,7 +33,7 @@ function x(r, n) {
 }
 var p = v(function(r, n) {
   var t = r.color, e = t === void 0 ? "currentColor" : t, o = r.size, i = o === void 0 ? 24 : o, f = h(r, ["color", "size"]);
-  return /* @__PURE__ */ a.createElement("svg", l({
+  return /* @__PURE__ */ a.createElement("svg", s({
     ref: n,
     xmlns: "http://www.w3.org/2000/svg",
     width: i,
@@ -62,15 +62,15 @@ var p = v(function(r, n) {
   }));
 });
 p.propTypes = {
-  color: s.default.string,
-  size: s.default.oneOfType([s.default.string, s.default.number])
+  color: l.default.string,
+  size: l.default.oneOfType([l.default.string, l.default.number])
 };
 p.displayName = "Menu";
 var O = ({ isOpen: r, onClick: n, className: t, openNavigationLabel: e = "Open navigation" }) => /* @__PURE__ */ b("button", {
   type: "button",
   "aria-label": e,
   "aria-expanded": r,
-  "aria-haspopup": "menu",
+  "aria-haspopup": "dialog",
   className: d(y({ className: t })),
   onClick: n,
   children: [/* @__PURE__ */ u(p, {

package/dist/{Input-2M2I_H60.js → Input-O2bqyJKW.js}

@@ -1,5 +1,5 @@
-import { o as R } from "./rolldown-runtime-Dw9YIBcH.js";
-import { t as q } from "./prop-types-BCUW56rg.js";
+import { o as R } from "./rolldown-runtime-B28h4lGi.js";
+import { t as q } from "./prop-types-qsAjMBb1.js";
 import { n as D, t as l } from "./utils-DnIJruo0.js";
 import { SearchIcon as F } from "./assets/icons/components/Search.js";
 import { WarningIcon as K } from "./assets/icons/components/Warning.js";

package/dist/Modal-B-l4ii6w.js

@@ -0,0 +1,84 @@
+import { t as A } from "./x-BmNOD9Gr.js";
+import { t as H } from "./dist-C_jtUTU9.js";
+import { t as h } from "./utils-DnIJruo0.js";
+import { t as B } from "./Combination-CnMM05mt.js";
+import { Body as C } from "./components/Modal/components/Body/Body.js";
+import { Footer as E } from "./components/Modal/components/Footer/Footer.js";
+import { Header as R } from "./components/Modal/components/Header/Header.js";
+import { t as V } from "./es2015-BvX7Yq5Q.js";
+import { buttonCloseVariants as j, modalVariants as D } from "./components/Modal/components/Wrapper/Wrapper.variants.js";
+import { Children as m, isValidElement as l, useEffect as g, useRef as S, useState as z } from "react";
+import { createPortal as I } from "react-dom";
+import { Fragment as K, jsx as o, jsxs as c } from "react/jsx-runtime";
+import { motion as L } from "motion/react";
+var M = ({ animateResize: f = !1, ariaLabel: n, ariaLabelledBy: i, autoFocus: s = !0, closeOnOverlayClick: u = !0, buttonCloseClassName: d, children: a, className: p, containerClassName: r, showCloseButton: y = !0, theme: b, transition: F, onClose: v }) => {
+  const N = m.toArray(a).find((e) => l(e) && e.type === t.Header), k = m.toArray(a).find((e) => l(e) && e.type === t.Body), w = m.toArray(a).find((e) => l(e) && e.type === t.Footer), x = m.toArray(a).filter((e) => !l(e) || ![
+    t.Header,
+    t.Body,
+    t.Footer
+  ].includes(e.type));
+  return /* @__PURE__ */ o(B, { children: /* @__PURE__ */ c("div", {
+    className: h("fixed inset-0 grid grid-cols-[minmax(0,calc(100%-2rem))] place-content-center justify-items-center", r),
+    "data-theme": b,
+    children: [/* @__PURE__ */ o("div", {
+      className: "absolute inset-0 bg-black opacity-70 dark:opacity-85 animate-in fade-in-0",
+      onClick: u ? v : void 0,
+      role: "presentation"
+    }), /* @__PURE__ */ o(V, {
+      returnFocus: !0,
+      autoFocus: s,
+      className: "contents",
+      children: /* @__PURE__ */ c(L.div, {
+        className: h(D({ className: p })),
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": n,
+        "aria-labelledby": i,
+        layout: f ? "size" : void 0,
+        transition: F ?? {
+          duration: 0.25,
+          ease: "easeInOut"
+        },
+        children: [
+          N,
+          y && /* @__PURE__ */ c("button", {
+            className: h(j({ className: d })),
+            onClick: v,
+            children: [/* @__PURE__ */ o(A, {}), /* @__PURE__ */ o(H, { children: "Dismiss modal" })]
+          }),
+          k ?? x,
+          w
+        ]
+      })
+    })]
+  }) });
+}, t = ({ isOpen: f, onClose: n, container: i, theme: s, ...u }) => {
+  const d = S(null), [a, p] = z(null);
+  return g(() => {
+    if (!d.current || s || i) return;
+    const r = d.current.closest("[data-theme]");
+    r && p(r);
+  }, [s, i]), g(() => {
+    const r = new AbortController(), y = (b) => {
+      b.code === "Escape" && n?.();
+    };
+    return window.addEventListener("keydown", y, { signal: r.signal }), () => {
+      r.abort();
+    };
+  }, [n]), /* @__PURE__ */ c(K, { children: [/* @__PURE__ */ o("span", {
+    ref: d,
+    "data-testid": "modal-anchor",
+    hidden: !0
+  }), f && I(/* @__PURE__ */ o(M, {
+    ...u,
+    theme: s,
+    onClose: n
+  }), i || a || document.body)] });
+};
+t.Header = R;
+t.Body = C;
+t.Footer = E;
+export {
+  M as n,
+  t
+};

package/dist/{Wrapper-JmStmade.js → Wrapper-B5PmrW4J.js}

@@ -1,6 +1,6 @@
-import { o as k } from "./rolldown-runtime-Dw9YIBcH.js";
-import { t as _ } from "./prop-types-BCUW56rg.js";
-import { t as T } from "./x-Vur_9PXW.js";
+import { o as k } from "./rolldown-runtime-B28h4lGi.js";
+import { t as _ } from "./prop-types-qsAjMBb1.js";
+import { t as T } from "./x-BmNOD9Gr.js";
 import { t as l } from "./utils-DnIJruo0.js";
 import { Tag as S } from "./components/Tag/Tag.js";
 import { useTagSelect as C } from "./components/TagSelect/contexts/TagSelect.hook.js";

package/dist/{Wrapper-ThpRi_Gg.js → Wrapper-CZCSSCLm.js}

@@ -1,10 +1,10 @@
-import { o as Ne } from "./rolldown-runtime-Dw9YIBcH.js";
+import { o as Ne } from "./rolldown-runtime-B28h4lGi.js";
 import { n as Be, t as X } from "./utils-DnIJruo0.js";
 import { useClickOutside as Re } from "./hooks/useClickOutside.js";
 import { Typography as ee } from "./components/Typography/Typography.js";
 import { labelVariants as Ge, phoneNumberInputVariants as Le } from "./components/PhoneNumberInput/PhoneNumberInput.variants.js";
 import { getPhoneMask as xe } from "./components/PhoneNumberInput/utils/index.js";
-import { n as Ve } from "./phone-number.provider-DnuL-yYF.js";
+import { n as Ve } from "./phone-number.provider-CJeivoDY.js";
 import { usePhoneNumberContext as Ke } from "./components/PhoneNumberInput/contexts/phone-number.hook.js";
 import { FlagContent as De } from "./components/PhoneNumberInput/components/FlagContent/FlagContent.js";
 import { FlagSelectorWrapper as Fe } from "./components/PhoneNumberInput/components/FlagSelectorWrapper/FlagSelectorWrapper.js";

package/dist/components/Alert/Alert.js

@@ -1,5 +1,5 @@
 "use client";
-import { t as v } from "../../x-Vur_9PXW.js";
+import { t as v } from "../../x-BmNOD9Gr.js";
 import { t as I } from "../../dist-C_jtUTU9.js";
 import { t } from "../../utils-DnIJruo0.js";
 import { CheckCircleFilledIcon as N } from "../../assets/icons/components/CheckCircleFilled.js";

package/dist/components/Breadcrumb/Breadcrumb.js

@@ -1,4 +1,4 @@
-import { t as m } from "../../Breadcrumb-CpXRb08J.js";
+import { t as m } from "../../Breadcrumb-DDRmDlWK.js";
 export {
   m as Breadcrumb
 };

package/dist/components/Breadcrumb/components/CollapsedSteps/CollapsedSteps.js

@@ -1,4 +1,4 @@
-import { t as p } from "../../../../CollapsedSteps-CR7oCTRC.js";
+import { t as p } from "../../../../CollapsedSteps-DvBeYShi.js";
 export {
   p as CollapsedSteps
 };

package/dist/components/Breadcrumb/components/index.js

@@ -1,4 +1,4 @@
-import { t } from "../../../CollapsedSteps-CR7oCTRC.js";
+import { t } from "../../../CollapsedSteps-DvBeYShi.js";
 import { BackButton as r } from "./BackButton/BackButton.js";
 import { Item as e } from "./Item/Item.js";
 export {

package/dist/components/Button/Button.variants.js

@@ -17,6 +17,7 @@ var a = r([
   "transition-colors",
   "whitespace-nowrap",
   "h-10",
+  "pointer-coarse:min-h-11",
   "px-4",
   "py-2",
   "text-sm",

package/dist/components/Checkbox/Checkbox.js

@@ -1,4 +1,4 @@
-import { t as r } from "../../Checkbox-DRdyrKjk.js";
+import { t as r } from "../../Checkbox-DrounE52.js";
 export {
   r as Checkbox
 };

package/dist/components/CheckboxCard/CheckboxCard.js

@@ -1,4 +1,4 @@
-import { t as j } from "../../Checkbox-DRdyrKjk.js";
+import { t as j } from "../../Checkbox-DrounE52.js";
 import { t as e } from "../../utils-DnIJruo0.js";
 import { Typography as m } from "../Typography/Typography.js";
 import { Card as $ } from "../Card/Card.js";

package/dist/components/Command/components/CommandInput.js

@@ -1,4 +1,4 @@
-import { t as o } from "../../../CommandInput-Du2o616y.js";
+import { t as o } from "../../../CommandInput-_vujzQ6B.js";
 export {
   o as CommandInput
 };

package/dist/components/Command/components/DialogContent.js

@@ -1,4 +1,4 @@
-import { t as r } from "../../../x-Vur_9PXW.js";
+import { t as r } from "../../../x-BmNOD9Gr.js";
 import { t as d } from "../../../utils-DnIJruo0.js";
 import { n as l, o as m, r as o } from "../../../dist-BqDJX7m1.js";
 import { DialogOverlay as p } from "./DialogOverlay.js";

package/dist/components/Command/components/index.js

@@ -1,4 +1,4 @@
-import { t as o } from "../../../CommandInput-Du2o616y.js";
+import { t as o } from "../../../CommandInput-_vujzQ6B.js";
 import { CommandEmpty as t } from "./CommandEmpty.js";
 import { CommandGroup as a } from "./CommandGroup.js";
 import { CommandItem as n } from "./CommandItem.js";

package/dist/components/ConfirmDialog/ConfirmDialog.js

@@ -1,13 +1,13 @@
-import { t as K } from "../../Input-2M2I_H60.js";
+import { t as K } from "../../Input-O2bqyJKW.js";
 import { t as g } from "../../utils-DnIJruo0.js";
 import { WarningIcon as T } from "../../assets/icons/components/Warning.js";
 import { Button as C } from "../Button/Button.js";
 import { Typography as d } from "../Typography/Typography.js";
 import { CopyButton as V } from "../CopyButton/CopyButton.js";
-import { t as l } from "../../Modal-0Wp5szX4.js";
+import { t as l } from "../../Modal-B-l4ii6w.js";
 import { useEffect as W, useId as A, useState as G } from "react";
 import { Fragment as J, jsx as e, jsxs as r } from "react/jsx-runtime";
-var L = ({ autoFocus: N, cancelLabel: v = "Cancel", children: k, className: I, confirmationInputClassName: w, confirmationInputLabel: B, confirmationPrompt: j, confirmationText: a, confirmLabel: n = "Confirm", containerClassName: D, copyLabel: F = "Copy", description: i, icon: c, isOpen: o, isPending: t = !1, pendingLabel: S, theme: $, title: M, variant: f = "danger", onClose: q, onConfirm: z }) => {
+var L = ({ autoFocus: v, cancelLabel: N = "Cancel", children: k, className: I, confirmationInputClassName: w, confirmationInputLabel: B, confirmationPrompt: j, confirmationText: a, confirmLabel: n = "Confirm", containerClassName: D, copyLabel: F = "Copy", description: i, icon: c, isOpen: o, isPending: t = !1, pendingLabel: S, theme: $, title: M, variant: f = "danger", onClose: q, onConfirm: z }) => {
   const s = A(), p = `${s}-title`, [u, h] = G(""), x = !!a, y = !x || u === a;
   W(() => {
     o && h("");
@@ -24,8 +24,9 @@ var L = ({ autoFocus: N, cancelLabel: v = "Cancel", children: k, className: I, c
   return /* @__PURE__ */ e(l, {
     isOpen: o,
     theme: $,
-    autoFocus: N,
+    autoFocus: v,
     showCloseButton: !1,
+    closeOnOverlayClick: !1,
     ariaLabelledBy: p,
     containerClassName: D,
     className: g("max-w-125 min-h-0 min-w-0 gap-0 p-6", I),
@@ -91,8 +92,9 @@ var L = ({ autoFocus: N, cancelLabel: v = "Cancel", children: k, className: I, c
             type: "button",
             variant: "secondary",
             disabled: t,
+            "data-autofocus": !0,
             onClick: b,
-            children: v
+            children: N
           }), /* @__PURE__ */ e(C, {
             type: "submit",
             form: s,

package/dist/components/CopyButton/CopyButton.variants.js

@@ -11,7 +11,9 @@ var i = e([
   "focus-visible:ring-1",
   "focus-visible:ring-ring",
   "disabled:pointer-events-none",
-  "disabled:opacity-45"
+  "disabled:opacity-45",
+  "pointer-coarse:min-h-11",
+  "pointer-coarse:min-w-11"
 ], {
   variants: { iconOnly: {
     true: [

package/dist/components/Counter/Counter.js

@@ -1,5 +1,5 @@
 "use client";
-import { t as e } from "../../Counter-DMkXIsOO.js";
+import { t as e } from "../../Counter-LQ5_uh06.js";
 export {
   e as Counter
 };

package/dist/components/DateRangePicker/components/CalendarPanel/components/CalendarMonth/components/CalendarMonthContent/CalendarMonthContent.js

@@ -1,5 +1,5 @@
 import { s as n } from "../../../../../../../../constants-q2QnJrOb.js";
-import { t as d } from "../../../../../../../../DayPicker-BtpJg2q3.js";
+import { t as d } from "../../../../../../../../DayPicker-D7KFB2bI.js";
 import { useMemo as c } from "react";
 import { jsx as l } from "react/jsx-runtime";
 var f = ({ month: r, range: e, onRangeSelect: o, disabled: t, disabledMatcher: m, showOutsideDays: s, classNames: a }) => {

package/dist/components/DateRangePicker/components/DateTimeInputs/components/EndInputFields/EndInputFields.js

@@ -1,4 +1,4 @@
-import { t as F } from "../../../../../../Input-2M2I_H60.js";
+import { t as F } from "../../../../../../Input-O2bqyJKW.js";
 import { t as e } from "../../../../../../utils-DnIJruo0.js";
 import { Typography as p } from "../../../../../Typography/Typography.js";
 import { TimePicker as W } from "../../../../../TimePicker/TimePicker.js";

package/dist/components/DateRangePicker/components/DateTimeInputs/components/StartInputFields/StartInputFields.js

@@ -1,4 +1,4 @@
-import { t as F } from "../../../../../../Input-2M2I_H60.js";
+import { t as F } from "../../../../../../Input-O2bqyJKW.js";
 import { t } from "../../../../../../utils-DnIJruo0.js";
 import { Typography as p } from "../../../../../Typography/Typography.js";
 import { TimePicker as W } from "../../../../../TimePicker/TimePicker.js";

package/dist/components/Datepicker/components/DatePickerContent/DatePickerContent.js

@@ -3,7 +3,7 @@ import { t as h } from "../../../../chevron-left-B1zWfqll.js";
 import { t as f } from "../../../../chevron-right-D4OkgIIT.js";
 import { datePickerVariants as p } from "../../DatePicker.variants.js";
 import '../../../../style.css';/* empty css                         */
-import { t as k } from "../../../../DayPicker-BtpJg2q3.js";
+import { t as k } from "../../../../DayPicker-D7KFB2bI.js";
 import { useState as g } from "react";
 import { jsx as a } from "react/jsx-runtime";
 var w = ({ className: o, showOutsideDays: l = !0, animate: n = !0, arrowClassName: d, monthsClassName: s, defaultSelected: i, onSelect: m, ...u }) => {

package/dist/components/Drawer/Drawer.js

@@ -1,83 +1,103 @@
 "use client";
-import { t as g } from "../../x-Vur_9PXW.js";
-import { t as z } from "../../dist-C_jtUTU9.js";
-import { t } from "../../utils-DnIJruo0.js";
-import { t as B } from "../../Combination-CnMM05mt.js";
-import { t as I } from "../../es2015-B_07N-UL.js";
-import { DrawerContext as M } from "./contexts/Drawer.context.js";
-import { Header as j } from "./components/Header/Header.js";
-import { Body as k } from "./components/Body/Body.js";
-import { Footer as A } from "./components/Footer/Footer.js";
-import { buttonCloseVariants as K, drawerVariants as P, overlayVariants as T, resizeHandleVariants as _ } from "./Drawer.variants.js";
+import { t as Y } from "../../x-BmNOD9Gr.js";
+import { t as _ } from "../../dist-C_jtUTU9.js";
+import { t as o } from "../../utils-DnIJruo0.js";
+import { t as j } from "../../Combination-CnMM05mt.js";
+import { t as k } from "../../es2015-BvX7Yq5Q.js";
+import { DrawerContext as A } from "./contexts/Drawer.context.js";
+import { Header as K } from "./components/Header/Header.js";
+import { Body as L } from "./components/Body/Body.js";
+import { Footer as O } from "./components/Footer/Footer.js";
+import { buttonCloseVariants as U, drawerVariants as W, overlayVariants as q, resizeHandleVariants as G } from "./Drawer.variants.js";
 import "./constants/index.js";
-import { useDrawer as E } from "./hooks/useDrawer.js";
-import { useId as L, useMemo as R } from "react";
-import { createPortal as S } from "react-dom";
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-var d = ({ canResize: o = !1, children: u, className: c, classNames: r, container: f, defaultWidth: m = 500, isOpen: p, maxWidth: h, minWidth: w, position: a = "right", showCloseButton: y = !0, theme: v, onClose: i }) => {
-  const n = L(), { handleKeyDown: b, handleMouseDown: D, isAnimating: s, isVisible: x, translateClass: V, width: H } = E({
-    canResize: o,
-    defaultWidth: m,
-    isOpen: p,
-    maxWidth: h,
-    minWidth: w,
-    position: a,
-    onClose: i
-  }), C = R(() => ({
-    classNames: r,
-    headerId: n
-  }), [r, n]);
-  if (!x) return null;
-  const F = /* @__PURE__ */ e(M.Provider, {
-    value: C,
-    children: /* @__PURE__ */ e(B, { children: /* @__PURE__ */ l("div", {
-      className: t("fixed inset-0 z-40", r?.root),
-      "data-theme": v,
+import { useDrawer as J } from "./hooks/useDrawer.js";
+import { useId as N, useMemo as Q, useRef as Z } from "react";
+import { createPortal as $ } from "react-dom";
+import { jsx as e, jsxs as m } from "react/jsx-runtime";
+var f = ({ canResize: i = !1, children: y, className: w, classNames: t, container: b, defaultWidth: h = 500, isOpen: x, maxWidth: v, minWidth: D, position: n = "right", showCloseButton: H = !0, closeOnSwipe: T = !0, fullScreenOnMobile: V = !0, initialFocus: S = "first", theme: E, onClose: a }) => {
+  const l = N(), c = Z(null), I = (d) => {
+    const r = d.touches?.[0];
+    c.current = r ? {
+      x: r.clientX,
+      y: r.clientY
+    } : null;
+  }, M = (d) => {
+    const r = c.current, s = d.changedTouches?.[0];
+    if (c.current = null, !T || !r || !s) return;
+    const u = s.clientX - r.x, P = s.clientY - r.y;
+    (n === "left" ? u <= -60 : u >= 60) && Math.abs(u) > Math.abs(P) && a?.();
+  }, { handleKeyDown: g, handleMouseDown: F, isAnimating: p, isVisible: R, translateClass: X, width: z } = J({
+    canResize: i,
+    defaultWidth: h,
+    isOpen: x,
+    maxWidth: v,
+    minWidth: D,
+    position: n,
+    onClose: a
+  }), B = Q(() => ({
+    classNames: t,
+    headerId: l
+  }), [t, l]);
+  if (!R) return null;
+  const C = /* @__PURE__ */ e(A.Provider, {
+    value: B,
+    children: /* @__PURE__ */ e(j, { children: /* @__PURE__ */ m("div", {
+      className: o("fixed inset-0 z-40", t?.root),
+      "data-theme": E,
       children: [/* @__PURE__ */ e("div", {
-        className: t(T(), {
-          "opacity-50": s,
-          "opacity-0": !s
-        }, r?.overlay),
+        className: o(q(), {
+          "opacity-55": p,
+          "opacity-0": !p
+        }, t?.overlay),
         "aria-hidden": "true",
-        onClick: i,
+        onClick: a,
         role: "presentation"
-      }), /* @__PURE__ */ e(I, {
+      }), /* @__PURE__ */ e(k, {
         returnFocus: !0,
         className: "contents",
-        children: /* @__PURE__ */ l("div", {
-          className: t(P({ position: a }), V, r?.panel, c),
-          style: { width: o ? H : m },
+        children: /* @__PURE__ */ m("div", {
+          className: o(W({
+            position: n,
+            fullScreenOnMobile: V
+          }), X, t?.panel, w),
+          style: { width: i ? z : h },
+          onTouchStart: I,
+          onTouchEnd: M,
           role: "dialog",
           "aria-modal": "true",
-          "aria-labelledby": n,
+          "aria-labelledby": l,
+          ...S === "panel" ? {
+            tabIndex: -1,
+            "data-autofocus": !0
+          } : {},
           children: [
-            o && /* @__PURE__ */ e("button", {
+            i && /* @__PURE__ */ e("button", {
               type: "button",
               "aria-label": "Resize drawer",
-              className: t(_({ position: a }), r?.resizeHandle),
-              onMouseDown: D,
-              onKeyDown: b
+              className: o(G({ position: n }), t?.resizeHandle),
+              onMouseDown: F,
+              onKeyDown: g
             }),
-            y && /* @__PURE__ */ l("button", {
-              className: t(K(), r?.closeButton),
-              onClick: i,
+            H && /* @__PURE__ */ m("button", {
+              className: o(U(), t?.closeButton),
+              onClick: a,
               type: "button",
-              children: [/* @__PURE__ */ e(g, { size: 20 }), /* @__PURE__ */ e(z, { children: "Dismiss drawer" })]
+              children: [/* @__PURE__ */ e(Y, { size: 20 }), /* @__PURE__ */ e(_, { children: "Dismiss drawer" })]
             }),
             /* @__PURE__ */ e("div", {
-              className: t("flex flex-1 flex-col h-full overflow-hidden", r?.content),
-              children: u
+              className: o("flex flex-1 flex-col h-full overflow-hidden", t?.content),
+              children: y
             })
           ]
         })
       })]
     }) })
   });
-  return S(F, f || document.body);
+  return $(C, b || document.body);
 };
-d.Header = j;
-d.Body = k;
-d.Footer = A;
+f.Header = K;
+f.Body = L;
+f.Footer = O;
 export {
-  d as Drawer
+  f as Drawer
 };