@axtec/components 0.1.8 → 0.1.10

package/dist/index23.js

@@ -1,82 +1,49 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { Fragment as i } from "react";
-import { Transition as v, Dialog as N, TransitionChild as o, DialogPanel as y, DialogTitle as b } from "@headlessui/react";
-import { ExclamationTriangleIcon as g } from "@heroicons/react/24/outline";
-import { cn as s } from "./index3.js";
-import { Button as c } from "./index17.js";
-function D({
-  open: d,
-  onClose: l,
-  onConfirm: m,
-  title: f,
-  message: r,
-  confirmText: h = "Confirm",
-  cancelText: p = "Cancel",
-  showIcon: t = !1,
-  destructive: x = !1,
-  isLoading: n = !1,
-  className: u
-}) {
-  return /* @__PURE__ */ e(v, { show: d, as: i, children: /* @__PURE__ */ a(N, { onClose: l, className: "relative z-50", children: [
-    /* @__PURE__ */ e(
-      o,
+import { jsx as l, jsxs as s } from "react/jsx-runtime";
+import { cn as n } from "./index3.js";
+const o = ({
+  items: c,
+  className: t
+}) => /* @__PURE__ */ l("div", { className: n("flex justify-center gap-8 p-5", t), children: c.map((e, r) => /* @__PURE__ */ s("div", { className: "flex flex-col flex-1", children: [
+  /* @__PURE__ */ s("div", { className: "flex items-center gap-2 mb-3", children: [
+    /* @__PURE__ */ l(
+      "div",
       {
-        as: i,
-        enter: "ease-out duration-300",
-        enterFrom: "opacity-0",
-        enterTo: "opacity-100",
-        leave: "ease-in duration-200",
-        leaveFrom: "opacity-100",
-        leaveTo: "opacity-0",
-        children: /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50", "aria-hidden": "true" })
+        className: "w-5 h-2.5 rounded-full",
+        style: { backgroundColor: e.color }
       }
     ),
-    /* @__PURE__ */ e("div", { className: "fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ e(
-      o,
+    /* @__PURE__ */ l(
+      "span",
       {
-        as: i,
-        enter: "ease-out duration-300",
-        enterFrom: "opacity-0 scale-95",
-        enterTo: "opacity-100 scale-100",
-        leave: "ease-in duration-200",
-        leaveFrom: "opacity-100 scale-100",
-        leaveTo: "opacity-0 scale-95",
-        children: /* @__PURE__ */ a(
-          y,
-          {
-            className: s(
-              "w-full max-w-md bg-white rounded-2xl shadow-xl p-6",
-              "transform transition-all",
-              u
-            ),
-            children: [
-              /* @__PURE__ */ a("div", { className: s(t && "flex gap-4"), children: [
-                t && /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e("div", { className: "rounded-full bg-amber-100 p-2", children: /* @__PURE__ */ e(g, { className: "h-6 w-6 text-amber-600" }) }) }),
-                /* @__PURE__ */ a("div", { className: "flex-1", children: [
-                  /* @__PURE__ */ e(b, { className: "text-lg font-semibold text-slate-900 mb-2", children: f }),
-                  r && /* @__PURE__ */ e("div", { className: "text-sm text-slate-600 mb-6", children: r })
-                ] })
-              ] }),
-              /* @__PURE__ */ a("div", { className: "flex justify-end gap-3 mt-6", children: [
-                /* @__PURE__ */ e(c, { variant: "outline", onClick: l, disabled: n, children: p }),
-                /* @__PURE__ */ e(
-                  c,
-                  {
-                    variant: x ? "danger" : "primary",
-                    onClick: m,
-                    isLoading: n,
-                    children: h
-                  }
-                )
-              ] })
-            ]
-          }
-        )
+        className: "text-sm font-medium",
+        style: { color: e.color },
+        children: e.label
       }
-    ) })
-  ] }) });
-}
+    )
+  ] }),
+  e.data.map((a, d) => /* @__PURE__ */ s("div", { className: "mb-2", children: [
+    /* @__PURE__ */ l("div", { className: "text-sm font-semibold text-slate-900 mb-1", children: a.title }),
+    /* @__PURE__ */ s("div", { className: "text-sm text-slate-500", children: [
+      a.value,
+      a.percentage && /* @__PURE__ */ s("span", { className: "ml-1 text-slate-400", children: [
+        "(",
+        a.percentage,
+        ")"
+      ] })
+    ] })
+  ] }, d))
+] }, r)) }), x = ({ items: c, className: t }) => /* @__PURE__ */ l("div", { className: n("flex items-center justify-center gap-6", t), children: c.map((e, r) => /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
+  /* @__PURE__ */ l(
+    "div",
+    {
+      className: "w-3 h-3 rounded-full",
+      style: { backgroundColor: e.color }
+    }
+  ),
+  /* @__PURE__ */ l("span", { className: "text-sm text-slate-600", children: e.label })
+] }, r)) });
 export {
-  D as ConfirmModal
+  x as ChartLegend,
+  o as StatisticsLegend
 };
 //# sourceMappingURL=index23.js.map

package/dist/index23.js.map

@@ -1 +1 @@
-{"version":3,"file":"index23.js","sources":["../src/components/ConfirmModal/ConfirmModal.tsx"],"sourcesContent":["import { Fragment, type ReactNode } from 'react'\nimport {\n  Dialog,\n  DialogPanel,\n  DialogTitle,\n  Transition,\n  TransitionChild,\n} from '@headlessui/react'\nimport { ExclamationTriangleIcon } from '@heroicons/react/24/outline'\nimport { cn } from '@/lib/utils'\nimport { Button } from '../Button/Button'\n\nexport interface ConfirmModalProps {\n  open: boolean\n  onClose: () => void\n  onConfirm: () => void\n  title: string\n  message?: string | ReactNode\n  confirmText?: string\n  cancelText?: string\n  /** Show warning icon */\n  showIcon?: boolean\n  /** Destructive action styling (red confirm button) */\n  destructive?: boolean\n  /** Loading state for confirm button */\n  isLoading?: boolean\n  className?: string\n}\n\nexport function ConfirmModal({\n  open,\n  onClose,\n  onConfirm,\n  title,\n  message,\n  confirmText = 'Confirm',\n  cancelText = 'Cancel',\n  showIcon = false,\n  destructive = false,\n  isLoading = false,\n  className,\n}: ConfirmModalProps) {\n  return (\n    <Transition show={open} as={Fragment}>\n      <Dialog onClose={onClose} className=\"relative z-50\">\n        {/* Backdrop */}\n        <TransitionChild\n          as={Fragment}\n          enter=\"ease-out duration-300\"\n          enterFrom=\"opacity-0\"\n          enterTo=\"opacity-100\"\n          leave=\"ease-in duration-200\"\n          leaveFrom=\"opacity-100\"\n          leaveTo=\"opacity-0\"\n        >\n          <div className=\"fixed inset-0 bg-black/50\" aria-hidden=\"true\" />\n        </TransitionChild>\n\n        {/* Modal */}\n        <div className=\"fixed inset-0 flex items-center justify-center p-4\">\n          <TransitionChild\n            as={Fragment}\n            enter=\"ease-out duration-300\"\n            enterFrom=\"opacity-0 scale-95\"\n            enterTo=\"opacity-100 scale-100\"\n            leave=\"ease-in duration-200\"\n            leaveFrom=\"opacity-100 scale-100\"\n            leaveTo=\"opacity-0 scale-95\"\n          >\n            <DialogPanel\n              className={cn(\n                'w-full max-w-md bg-white rounded-2xl shadow-xl p-6',\n                'transform transition-all',\n                className\n              )}\n            >\n              <div className={cn(showIcon && 'flex gap-4')}>\n                {/* Icon */}\n                {showIcon && (\n                  <div className=\"flex-shrink-0\">\n                    <div className=\"rounded-full bg-amber-100 p-2\">\n                      <ExclamationTriangleIcon className=\"h-6 w-6 text-amber-600\" />\n                    </div>\n                  </div>\n                )}\n\n                <div className=\"flex-1\">\n                  {/* Title */}\n                  <DialogTitle className=\"text-lg font-semibold text-slate-900 mb-2\">\n                    {title}\n                  </DialogTitle>\n\n                  {/* Message */}\n                  {message && (\n                    <div className=\"text-sm text-slate-600 mb-6\">{message}</div>\n                  )}\n                </div>\n              </div>\n\n              {/* Buttons */}\n              <div className=\"flex justify-end gap-3 mt-6\">\n                <Button variant=\"outline\" onClick={onClose} disabled={isLoading}>\n                  {cancelText}\n                </Button>\n                <Button\n                  variant={destructive ? 'danger' : 'primary'}\n                  onClick={onConfirm}\n                  isLoading={isLoading}\n                >\n                  {confirmText}\n                </Button>\n              </div>\n            </DialogPanel>\n          </TransitionChild>\n        </div>\n      </Dialog>\n    </Transition>\n  )\n}\n"],"names":["ConfirmModal","open","onClose","onConfirm","title","message","confirmText","cancelText","showIcon","destructive","isLoading","className","jsx","Transition","Fragment","jsxs","Dialog","TransitionChild","DialogPanel","cn","ExclamationTriangleIcon","DialogTitle","Button"],"mappings":";;;;;;AA6BO,SAASA,EAAa;AAAA,EAC3B,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,YAAAC,IAAa;AAAA,EACb,UAAAC,IAAW;AAAA,EACX,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,WAAAC;AACF,GAAsB;AACpB,SACE,gBAAAC,EAACC,GAAA,EAAW,MAAMZ,GAAM,IAAIa,GAC1B,UAAA,gBAAAC,EAACC,GAAA,EAAO,SAAAd,GAAkB,WAAU,iBAElC,UAAA;AAAA,IAAA,gBAAAU;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,IAAIH;AAAA,QACJ,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QAER,UAAA,gBAAAF,EAAC,OAAA,EAAI,WAAU,6BAA4B,eAAY,OAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,IAIhE,gBAAAA,EAAC,OAAA,EAAI,WAAU,sDACb,UAAA,gBAAAA;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,IAAIH;AAAA,QACJ,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QAER,UAAA,gBAAAC;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,WAAWC;AAAA,cACT;AAAA,cACA;AAAA,cACAR;AAAA,YAAA;AAAA,YAGF,UAAA;AAAA,cAAA,gBAAAI,EAAC,OAAA,EAAI,WAAWI,EAAGX,KAAY,YAAY,GAExC,UAAA;AAAA,gBAAAA,KACC,gBAAAI,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,iCACb,UAAA,gBAAAA,EAACQ,GAAA,EAAwB,WAAU,yBAAA,CAAyB,GAC9D,GACF;AAAA,gBAGF,gBAAAL,EAAC,OAAA,EAAI,WAAU,UAEb,UAAA;AAAA,kBAAA,gBAAAH,EAACS,GAAA,EAAY,WAAU,6CACpB,UAAAjB,GACH;AAAA,kBAGCC,KACC,gBAAAO,EAAC,OAAA,EAAI,WAAU,+BAA+B,UAAAP,EAAA,CAAQ;AAAA,gBAAA,EAAA,CAE1D;AAAA,cAAA,GACF;AAAA,cAGA,gBAAAU,EAAC,OAAA,EAAI,WAAU,+BACb,UAAA;AAAA,gBAAA,gBAAAH,EAACU,KAAO,SAAQ,WAAU,SAASpB,GAAS,UAAUQ,GACnD,UAAAH,EAAA,CACH;AAAA,gBACA,gBAAAK;AAAA,kBAACU;AAAA,kBAAA;AAAA,oBACC,SAASb,IAAc,WAAW;AAAA,oBAClC,SAASN;AAAA,oBACT,WAAAO;AAAA,oBAEC,UAAAJ;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACH,EAAA,CACF;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA,EACF,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}
+{"version":3,"file":"index23.js","sources":["../src/components/StatisticsLegend/StatisticsLegend.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\n\nexport interface StatisticsLegendItem {\n  label: string\n  color: string\n  data: {\n    title: string\n    value: string | number\n    percentage?: string\n  }[]\n}\n\nexport interface StatisticsLegendProps {\n  items: StatisticsLegendItem[]\n  className?: string\n}\n\nexport const StatisticsLegend = ({\n  items,\n  className,\n}: StatisticsLegendProps) => {\n  return (\n    <div className={cn('flex justify-center gap-8 p-5', className)}>\n      {items.map((item, index) => (\n        <div key={index} className=\"flex flex-col flex-1\">\n          {/* Legend label */}\n          <div className=\"flex items-center gap-2 mb-3\">\n            <div\n              className=\"w-5 h-2.5 rounded-full\"\n              style={{ backgroundColor: item.color }}\n            />\n            <span\n              className=\"text-sm font-medium\"\n              style={{ color: item.color }}\n            >\n              {item.label}\n            </span>\n          </div>\n\n          {/* Data items */}\n          {item.data.map((dataItem, dataIndex) => (\n            <div key={dataIndex} className=\"mb-2\">\n              <div className=\"text-sm font-semibold text-slate-900 mb-1\">\n                {dataItem.title}\n              </div>\n              <div className=\"text-sm text-slate-500\">\n                {dataItem.value}\n                {dataItem.percentage && (\n                  <span className=\"ml-1 text-slate-400\">\n                    ({dataItem.percentage})\n                  </span>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      ))}\n    </div>\n  )\n}\n\n// Simple color dot legend for charts\nexport interface ChartLegendProps {\n  items: {\n    label: string\n    color: string\n  }[]\n  className?: string\n}\n\nexport const ChartLegend = ({ items, className }: ChartLegendProps) => {\n  return (\n    <div className={cn('flex items-center justify-center gap-6', className)}>\n      {items.map((item, index) => (\n        <div key={index} className=\"flex items-center gap-2\">\n          <div\n            className=\"w-3 h-3 rounded-full\"\n            style={{ backgroundColor: item.color }}\n          />\n          <span className=\"text-sm text-slate-600\">{item.label}</span>\n        </div>\n      ))}\n    </div>\n  )\n}\n"],"names":["StatisticsLegend","items","className","jsx","cn","item","index","jsxs","dataItem","dataIndex","ChartLegend"],"mappings":";;AAiBO,MAAMA,IAAmB,CAAC;AAAA,EAC/B,OAAAC;AAAA,EACA,WAAAC;AACF,MAEI,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,iCAAiCF,CAAS,GAC1D,UAAAD,EAAM,IAAI,CAACI,GAAMC,MAChB,gBAAAC,EAAC,OAAA,EAAgB,WAAU,wBAEzB,UAAA;AAAA,EAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,gCACb,UAAA;AAAA,IAAA,gBAAAJ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,iBAAiBE,EAAK,MAAA;AAAA,MAAM;AAAA,IAAA;AAAA,IAEvC,gBAAAF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,OAAOE,EAAK,MAAA;AAAA,QAEpB,UAAAA,EAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EACR,GACF;AAAA,EAGCA,EAAK,KAAK,IAAI,CAACG,GAAUC,MACxB,gBAAAF,EAAC,OAAA,EAAoB,WAAU,QAC7B,UAAA;AAAA,IAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,6CACZ,UAAAK,EAAS,OACZ;AAAA,IACA,gBAAAD,EAAC,OAAA,EAAI,WAAU,0BACZ,UAAA;AAAA,MAAAC,EAAS;AAAA,MACTA,EAAS,cACR,gBAAAD,EAAC,QAAA,EAAK,WAAU,uBAAsB,UAAA;AAAA,QAAA;AAAA,QAClCC,EAAS;AAAA,QAAW;AAAA,MAAA,EAAA,CACxB;AAAA,IAAA,EAAA,CAEJ;AAAA,EAAA,EAAA,GAXQC,CAYV,CACD;AAAA,KA9BOH,CA+BV,CACD,GACH,GAaSI,IAAc,CAAC,EAAE,OAAAT,GAAO,WAAAC,QAEjC,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,0CAA0CF,CAAS,GACnE,UAAAD,EAAM,IAAI,CAACI,GAAMC,MAChB,gBAAAC,EAAC,OAAA,EAAgB,WAAU,2BACzB,UAAA;AAAA,EAAA,gBAAAJ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,EAAE,iBAAiBE,EAAK,MAAA;AAAA,IAAM;AAAA,EAAA;AAAA,EAEvC,gBAAAF,EAAC,QAAA,EAAK,WAAU,0BAA0B,YAAK,MAAA,CAAM;AAAA,KAL7CG,CAMV,CACD,GACH;"}

package/dist/index24.js

@@ -1,223 +1,53 @@
-import { jsxs as f, jsx as n, Fragment as q } from "react/jsx-runtime";
-import { useState as D, useRef as B, useEffect as G } from "react";
-import { cn as w } from "./index3.js";
-import { CalendarIcon as Q, ChevronLeftIcon as U, ChevronRightIcon as V } from "@heroicons/react/24/outline";
-const F = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December"
-], X = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], Z = (s, l) => new Date(s, l + 1, 0).getDate(), _ = (s, l) => new Date(s, l, 1).getDay(), ee = (s, l) => {
-  const i = String(s.getDate()).padStart(2, "0"), r = String(s.getMonth() + 1).padStart(2, "0"), g = s.getFullYear();
-  switch (l) {
-    case "MM/DD/YYYY":
-      return `${r}/${i}/${g}`;
-    case "YYYY-MM-DD":
-      return `${g}-${r}-${i}`;
-    default:
-      return `${i}/${r}/${g}`;
-  }
-}, te = (s) => {
-  if (!s) return null;
-  const l = [
-    /^(\d{2})\/(\d{2})\/(\d{4})$/,
-    // DD/MM/YYYY
-    /^(\d{4})-(\d{2})-(\d{2})$/
-    // YYYY-MM-DD
-  ];
-  for (const i of l) {
-    const r = s.match(i);
-    if (r)
-      return i.source.includes("^(\\d{4})") ? new Date(parseInt(r[1]), parseInt(r[2]) - 1, parseInt(r[3])) : new Date(parseInt(r[3]), parseInt(r[2]) - 1, parseInt(r[1]));
-  }
-  return null;
-}, ae = ({
-  value: s,
-  onChange: l,
-  label: i,
-  placeholder: r = "DD/MM/YYYY",
-  disabled: g = !1,
-  error: Y,
-  disableFutureDates: I = !1,
-  disablePastDates: $ = !1,
-  format: k = "DD/MM/YYYY",
-  className: j
-}) => {
-  const u = /* @__PURE__ */ new Date(), h = s ? te(s) : null, [S, M] = D(!1), [m, p] = D("days"), [o, y] = D((h == null ? void 0 : h.getFullYear()) ?? u.getFullYear()), [a, b] = D((h == null ? void 0 : h.getMonth()) ?? u.getMonth()), [x, O] = D(h), v = B(null);
-  G(() => {
-    const t = (e) => {
-      v.current && !v.current.contains(e.target) && (M(!1), p("days"));
-    };
-    return document.addEventListener("mousedown", t), () => document.removeEventListener("mousedown", t);
-  }, []);
-  const E = (t) => {
-    const e = new Date(o, a, t);
-    O(e), l(ee(e, k)), M(!1);
-  }, T = (t) => {
-    b(t), p("days");
-  }, A = (t) => {
-    y(t), p("months");
-  }, J = () => {
-    m === "days" ? a === 0 ? (b(11), y(o - 1)) : b(a - 1) : m === "years" && y(o - 12);
-  }, L = () => {
-    m === "days" ? a === 11 ? (b(0), y(o + 1)) : b(a + 1) : m === "years" && y(o + 12);
-  }, R = (t) => {
-    const e = new Date(u.getFullYear(), u.getMonth(), u.getDate());
-    return !!(I && t > e || $ && t < e);
-  }, P = Z(o, a), W = _(o, a), z = () => {
-    const t = [];
-    for (let e = 0; e < W; e++)
-      t.push(/* @__PURE__ */ n("div", { className: "w-8 h-8" }, `empty-${e}`));
-    for (let e = 1; e <= P; e++) {
-      const c = new Date(o, a, e), d = x && c.getDate() === x.getDate() && c.getMonth() === x.getMonth() && c.getFullYear() === x.getFullYear(), C = c.getDate() === u.getDate() && c.getMonth() === u.getMonth() && c.getFullYear() === u.getFullYear(), N = R(c);
-      t.push(
-        /* @__PURE__ */ n(
-          "button",
-          {
-            type: "button",
-            disabled: N,
-            onClick: () => E(e),
-            className: w(
-              "w-8 h-8 rounded-full text-sm flex items-center justify-center",
-              "transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500",
-              d && "bg-primary-500 text-white",
-              !d && C && "border border-primary-500 text-primary-500",
-              !d && !C && !N && "hover:bg-slate-100",
-              N && "text-slate-300 cursor-not-allowed"
-            ),
-            children: e
-          },
-          e
-        )
-      );
-    }
-    return t;
-  }, H = () => F.map((t, e) => /* @__PURE__ */ n(
-    "button",
-    {
-      type: "button",
-      onClick: () => T(e),
-      className: w(
-        "px-3 py-2 rounded text-sm",
-        "transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500",
-        a === e && "bg-primary-500 text-white",
-        a !== e && "hover:bg-slate-100"
-      ),
-      children: t.slice(0, 3)
-    },
-    t
-  )), K = () => {
-    const t = o - 6, e = [];
-    for (let c = 0; c < 12; c++) {
-      const d = t + c;
-      e.push(
-        /* @__PURE__ */ n(
-          "button",
-          {
-            type: "button",
-            onClick: () => A(d),
-            className: w(
-              "px-3 py-2 rounded text-sm",
-              "transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500",
-              o === d && "bg-primary-500 text-white",
-              o !== d && "hover:bg-slate-100"
-            ),
-            children: d
-          },
-          d
-        )
-      );
-    }
-    return e;
-  };
-  return /* @__PURE__ */ f("div", { ref: v, className: w("relative", j), children: [
-    i && /* @__PURE__ */ n("label", { className: "block text-sm font-semibold text-slate-700 mb-1.5", children: i }),
-    /* @__PURE__ */ f(
-      "button",
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import { forwardRef as d } from "react";
+import { cn as i } from "./index3.js";
+import { CheckIcon as l } from "@heroicons/react/20/solid";
+const f = d(
+  ({ className: c, label: e, description: s, id: m, checked: o, ...n }, p) => {
+    const a = m || (e == null ? void 0 : e.toLowerCase().replace(/\s+/g, "-"));
+    return /* @__PURE__ */ t(
+      "label",
       {
-        type: "button",
-        disabled: g,
-        onClick: () => M(!S),
-        className: w(
-          "w-full flex items-center justify-between px-4 py-2.5",
-          "bg-white border rounded-lg text-left",
-          "transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500",
-          Y ? "border-red-500" : "border-slate-300",
-          g && "bg-slate-100 cursor-not-allowed opacity-60"
-        ),
+        htmlFor: a,
+        className: i("flex items-start gap-3 cursor-pointer group", c),
         children: [
-          /* @__PURE__ */ n("span", { className: s ? "text-slate-900" : "text-slate-400", children: s || r }),
-          /* @__PURE__ */ n(Q, { className: "w-5 h-5 text-slate-400" })
+          /* @__PURE__ */ t("div", { className: "relative flex-shrink-0 mt-0.5", children: [
+            /* @__PURE__ */ r(
+              "input",
+              {
+                ref: p,
+                type: "checkbox",
+                id: a,
+                checked: o,
+                className: "peer sr-only",
+                ...n
+              }
+            ),
+            /* @__PURE__ */ r(
+              "div",
+              {
+                className: i(
+                  "h-5 w-5 rounded border-2 transition-colors duration-200",
+                  "flex items-center justify-center",
+                  "peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2",
+                  "peer-disabled:opacity-50 peer-disabled:cursor-not-allowed",
+                  o ? "bg-primary-500 border-primary-500" : "bg-white border-slate-300 group-hover:border-slate-400"
+                ),
+                children: o && /* @__PURE__ */ r(l, { className: "h-3.5 w-3.5 text-white" })
+              }
+            )
+          ] }),
+          (e || s) && /* @__PURE__ */ t("div", { className: "flex flex-col", children: [
+            e && /* @__PURE__ */ r("span", { className: "text-sm font-medium text-slate-900", children: e }),
+            s && /* @__PURE__ */ r("span", { className: "text-sm text-slate-500", children: s })
+          ] })
         ]
       }
-    ),
-    Y && /* @__PURE__ */ n("p", { className: "text-sm text-red-500 mt-1", children: Y }),
-    S && /* @__PURE__ */ f("div", { className: "absolute z-50 mt-2 p-4 bg-white border border-slate-200 rounded-lg shadow-lg", children: [
-      /* @__PURE__ */ f("div", { className: "flex items-center justify-between mb-4", children: [
-        /* @__PURE__ */ n(
-          "button",
-          {
-            type: "button",
-            onClick: J,
-            className: "p-1 rounded hover:bg-slate-100",
-            children: /* @__PURE__ */ n(U, { className: "w-5 h-5" })
-          }
-        ),
-        /* @__PURE__ */ f("div", { className: "flex gap-1", children: [
-          m !== "months" && /* @__PURE__ */ n(
-            "button",
-            {
-              type: "button",
-              onClick: () => p("months"),
-              className: "px-2 py-1 text-sm font-medium hover:bg-slate-100 rounded",
-              children: F[a]
-            }
-          ),
-          /* @__PURE__ */ n(
-            "button",
-            {
-              type: "button",
-              onClick: () => p("years"),
-              className: "px-2 py-1 text-sm font-medium hover:bg-slate-100 rounded",
-              children: o
-            }
-          )
-        ] }),
-        /* @__PURE__ */ n(
-          "button",
-          {
-            type: "button",
-            onClick: L,
-            className: "p-1 rounded hover:bg-slate-100",
-            children: /* @__PURE__ */ n(V, { className: "w-5 h-5" })
-          }
-        )
-      ] }),
-      m === "days" && /* @__PURE__ */ f(q, { children: [
-        /* @__PURE__ */ n("div", { className: "grid grid-cols-7 gap-1 mb-2", children: X.map((t) => /* @__PURE__ */ n(
-          "div",
-          {
-            className: "w-8 h-8 flex items-center justify-center text-xs font-medium text-slate-500",
-            children: t
-          },
-          t
-        )) }),
-        /* @__PURE__ */ n("div", { className: "grid grid-cols-7 gap-1", children: z() })
-      ] }),
-      m === "months" && /* @__PURE__ */ n("div", { className: "grid grid-cols-3 gap-2", children: H() }),
-      m === "years" && /* @__PURE__ */ n("div", { className: "grid grid-cols-3 gap-2", children: K() })
-    ] })
-  ] });
-};
+    );
+  }
+);
+f.displayName = "Checkbox";
 export {
-  ae as DatePicker
+  f as Checkbox
 };
 //# sourceMappingURL=index24.js.map

package/dist/index24.js.map

@@ -1 +1 @@
-{"version":3,"file":"index24.js","sources":["../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from 'react'\nimport { cn } from '@/lib/utils'\nimport { CalendarIcon, ChevronLeftIcon, ChevronRightIcon } from '@heroicons/react/24/outline'\n\nexport interface DatePickerProps {\n  value?: string\n  onChange: (date: string) => void\n  label?: string\n  placeholder?: string\n  disabled?: boolean\n  error?: string\n  disableFutureDates?: boolean\n  disablePastDates?: boolean\n  format?: 'DD/MM/YYYY' | 'MM/DD/YYYY' | 'YYYY-MM-DD'\n  className?: string\n}\n\nconst MONTHS = [\n  'January', 'February', 'March', 'April', 'May', 'June',\n  'July', 'August', 'September', 'October', 'November', 'December'\n]\n\nconst WEEKDAYS = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa']\n\nconst getDaysInMonth = (year: number, month: number) => {\n  return new Date(year, month + 1, 0).getDate()\n}\n\nconst getFirstDayOfMonth = (year: number, month: number) => {\n  return new Date(year, month, 1).getDay()\n}\n\nconst formatDate = (date: Date, format: string) => {\n  const day = String(date.getDate()).padStart(2, '0')\n  const month = String(date.getMonth() + 1).padStart(2, '0')\n  const year = date.getFullYear()\n\n  switch (format) {\n    case 'MM/DD/YYYY':\n      return `${month}/${day}/${year}`\n    case 'YYYY-MM-DD':\n      return `${year}-${month}-${day}`\n    default:\n      return `${day}/${month}/${year}`\n  }\n}\n\nconst parseDate = (dateString: string): Date | null => {\n  if (!dateString) return null\n\n  // Try different formats\n  const formats = [\n    /^(\\d{2})\\/(\\d{2})\\/(\\d{4})$/, // DD/MM/YYYY\n    /^(\\d{4})-(\\d{2})-(\\d{2})$/,   // YYYY-MM-DD\n  ]\n\n  for (const regex of formats) {\n    const match = dateString.match(regex)\n    if (match) {\n      if (regex.source.includes('^(\\\\d{4})')) {\n        // YYYY-MM-DD\n        return new Date(parseInt(match[1]), parseInt(match[2]) - 1, parseInt(match[3]))\n      } else {\n        // DD/MM/YYYY\n        return new Date(parseInt(match[3]), parseInt(match[2]) - 1, parseInt(match[1]))\n      }\n    }\n  }\n  return null\n}\n\nexport const DatePicker = ({\n  value,\n  onChange,\n  label,\n  placeholder = 'DD/MM/YYYY',\n  disabled = false,\n  error,\n  disableFutureDates = false,\n  disablePastDates = false,\n  format = 'DD/MM/YYYY',\n  className,\n}: DatePickerProps) => {\n  const today = new Date()\n  const parsedValue = value ? parseDate(value) : null\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [viewMode, setViewMode] = useState<'days' | 'months' | 'years'>('days')\n  const [viewYear, setViewYear] = useState(parsedValue?.getFullYear() ?? today.getFullYear())\n  const [viewMonth, setViewMonth] = useState(parsedValue?.getMonth() ?? today.getMonth())\n  const [selectedDate, setSelectedDate] = useState<Date | null>(parsedValue)\n  const containerRef = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {\n        setIsOpen(false)\n        setViewMode('days')\n      }\n    }\n\n    document.addEventListener('mousedown', handleClickOutside)\n    return () => document.removeEventListener('mousedown', handleClickOutside)\n  }, [])\n\n  const handleDateSelect = (day: number) => {\n    const newDate = new Date(viewYear, viewMonth, day)\n    setSelectedDate(newDate)\n    onChange(formatDate(newDate, format))\n    setIsOpen(false)\n  }\n\n  const handleMonthSelect = (monthIndex: number) => {\n    setViewMonth(monthIndex)\n    setViewMode('days')\n  }\n\n  const handleYearSelect = (year: number) => {\n    setViewYear(year)\n    setViewMode('months')\n  }\n\n  const navigatePrevious = () => {\n    if (viewMode === 'days') {\n      if (viewMonth === 0) {\n        setViewMonth(11)\n        setViewYear(viewYear - 1)\n      } else {\n        setViewMonth(viewMonth - 1)\n      }\n    } else if (viewMode === 'years') {\n      setViewYear(viewYear - 12)\n    }\n  }\n\n  const navigateNext = () => {\n    if (viewMode === 'days') {\n      if (viewMonth === 11) {\n        setViewMonth(0)\n        setViewYear(viewYear + 1)\n      } else {\n        setViewMonth(viewMonth + 1)\n      }\n    } else if (viewMode === 'years') {\n      setViewYear(viewYear + 12)\n    }\n  }\n\n  const isDateDisabled = (date: Date) => {\n    const todayStart = new Date(today.getFullYear(), today.getMonth(), today.getDate())\n    if (disableFutureDates && date > todayStart) return true\n    if (disablePastDates && date < todayStart) return true\n    return false\n  }\n\n  const daysInMonth = getDaysInMonth(viewYear, viewMonth)\n  const firstDay = getFirstDayOfMonth(viewYear, viewMonth)\n\n  const renderDays = () => {\n    const days = []\n\n    // Empty cells before first day\n    for (let i = 0; i < firstDay; i++) {\n      days.push(<div key={`empty-${i}`} className=\"w-8 h-8\" />)\n    }\n\n    // Days of month\n    for (let day = 1; day <= daysInMonth; day++) {\n      const date = new Date(viewYear, viewMonth, day)\n      const isSelected = selectedDate &&\n        date.getDate() === selectedDate.getDate() &&\n        date.getMonth() === selectedDate.getMonth() &&\n        date.getFullYear() === selectedDate.getFullYear()\n      const isToday =\n        date.getDate() === today.getDate() &&\n        date.getMonth() === today.getMonth() &&\n        date.getFullYear() === today.getFullYear()\n      const isDisabled = isDateDisabled(date)\n\n      days.push(\n        <button\n          key={day}\n          type=\"button\"\n          disabled={isDisabled}\n          onClick={() => handleDateSelect(day)}\n          className={cn(\n            'w-8 h-8 rounded-full text-sm flex items-center justify-center',\n            'transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500',\n            isSelected && 'bg-primary-500 text-white',\n            !isSelected && isToday && 'border border-primary-500 text-primary-500',\n            !isSelected && !isToday && !isDisabled && 'hover:bg-slate-100',\n            isDisabled && 'text-slate-300 cursor-not-allowed'\n          )}\n        >\n          {day}\n        </button>\n      )\n    }\n\n    return days\n  }\n\n  const renderMonths = () => {\n    return MONTHS.map((month, index) => (\n      <button\n        key={month}\n        type=\"button\"\n        onClick={() => handleMonthSelect(index)}\n        className={cn(\n          'px-3 py-2 rounded text-sm',\n          'transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500',\n          viewMonth === index && 'bg-primary-500 text-white',\n          viewMonth !== index && 'hover:bg-slate-100'\n        )}\n      >\n        {month.slice(0, 3)}\n      </button>\n    ))\n  }\n\n  const renderYears = () => {\n    const startYear = viewYear - 6\n    const years = []\n    for (let i = 0; i < 12; i++) {\n      const year = startYear + i\n      years.push(\n        <button\n          key={year}\n          type=\"button\"\n          onClick={() => handleYearSelect(year)}\n          className={cn(\n            'px-3 py-2 rounded text-sm',\n            'transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500',\n            viewYear === year && 'bg-primary-500 text-white',\n            viewYear !== year && 'hover:bg-slate-100'\n          )}\n        >\n          {year}\n        </button>\n      )\n    }\n    return years\n  }\n\n  return (\n    <div ref={containerRef} className={cn('relative', className)}>\n      {label && (\n        <label className=\"block text-sm font-semibold text-slate-700 mb-1.5\">\n          {label}\n        </label>\n      )}\n\n      <button\n        type=\"button\"\n        disabled={disabled}\n        onClick={() => setIsOpen(!isOpen)}\n        className={cn(\n          'w-full flex items-center justify-between px-4 py-2.5',\n          'bg-white border rounded-lg text-left',\n          'transition-colors focus:outline-none focus:ring-2 focus:ring-primary-500',\n          error ? 'border-red-500' : 'border-slate-300',\n          disabled && 'bg-slate-100 cursor-not-allowed opacity-60'\n        )}\n      >\n        <span className={value ? 'text-slate-900' : 'text-slate-400'}>\n          {value || placeholder}\n        </span>\n        <CalendarIcon className=\"w-5 h-5 text-slate-400\" />\n      </button>\n\n      {error && (\n        <p className=\"text-sm text-red-500 mt-1\">{error}</p>\n      )}\n\n      {isOpen && (\n        <div className=\"absolute z-50 mt-2 p-4 bg-white border border-slate-200 rounded-lg shadow-lg\">\n          {/* Header */}\n          <div className=\"flex items-center justify-between mb-4\">\n            <button\n              type=\"button\"\n              onClick={navigatePrevious}\n              className=\"p-1 rounded hover:bg-slate-100\"\n            >\n              <ChevronLeftIcon className=\"w-5 h-5\" />\n            </button>\n\n            <div className=\"flex gap-1\">\n              {viewMode !== 'months' && (\n                <button\n                  type=\"button\"\n                  onClick={() => setViewMode('months')}\n                  className=\"px-2 py-1 text-sm font-medium hover:bg-slate-100 rounded\"\n                >\n                  {MONTHS[viewMonth]}\n                </button>\n              )}\n              <button\n                type=\"button\"\n                onClick={() => setViewMode('years')}\n                className=\"px-2 py-1 text-sm font-medium hover:bg-slate-100 rounded\"\n              >\n                {viewYear}\n              </button>\n            </div>\n\n            <button\n              type=\"button\"\n              onClick={navigateNext}\n              className=\"p-1 rounded hover:bg-slate-100\"\n            >\n              <ChevronRightIcon className=\"w-5 h-5\" />\n            </button>\n          </div>\n\n          {/* Calendar content */}\n          {viewMode === 'days' && (\n            <>\n              <div className=\"grid grid-cols-7 gap-1 mb-2\">\n                {WEEKDAYS.map((day) => (\n                  <div\n                    key={day}\n                    className=\"w-8 h-8 flex items-center justify-center text-xs font-medium text-slate-500\"\n                  >\n                    {day}\n                  </div>\n                ))}\n              </div>\n              <div className=\"grid grid-cols-7 gap-1\">\n                {renderDays()}\n              </div>\n            </>\n          )}\n\n          {viewMode === 'months' && (\n            <div className=\"grid grid-cols-3 gap-2\">\n              {renderMonths()}\n            </div>\n          )}\n\n          {viewMode === 'years' && (\n            <div className=\"grid grid-cols-3 gap-2\">\n              {renderYears()}\n            </div>\n          )}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["MONTHS","WEEKDAYS","getDaysInMonth","year","month","getFirstDayOfMonth","formatDate","date","format","day","parseDate","dateString","formats","regex","match","DatePicker","value","onChange","label","placeholder","disabled","error","disableFutureDates","disablePastDates","className","today","parsedValue","isOpen","setIsOpen","useState","viewMode","setViewMode","viewYear","setViewYear","viewMonth","setViewMonth","selectedDate","setSelectedDate","containerRef","useRef","useEffect","handleClickOutside","event","handleDateSelect","newDate","handleMonthSelect","monthIndex","handleYearSelect","navigatePrevious","navigateNext","isDateDisabled","todayStart","daysInMonth","firstDay","renderDays","days","i","isSelected","isToday","isDisabled","jsx","cn","renderMonths","index","renderYears","startYear","years","jsxs","CalendarIcon","ChevronLeftIcon","ChevronRightIcon","Fragment"],"mappings":"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"}
+{"version":3,"file":"index24.js","sources":["../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import { forwardRef, type InputHTMLAttributes } from 'react'\nimport { cn } from '@/lib/utils'\nimport { CheckIcon } from '@heroicons/react/20/solid'\n\nexport interface CheckboxProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n  label?: string\n  description?: string\n}\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  ({ className, label, description, id, checked, ...props }, ref) => {\n    const checkboxId = id || label?.toLowerCase().replace(/\\s+/g, '-')\n\n    return (\n      <label\n        htmlFor={checkboxId}\n        className={cn('flex items-start gap-3 cursor-pointer group', className)}\n      >\n        <div className=\"relative flex-shrink-0 mt-0.5\">\n          <input\n            ref={ref}\n            type=\"checkbox\"\n            id={checkboxId}\n            checked={checked}\n            className=\"peer sr-only\"\n            {...props}\n          />\n          <div\n            className={cn(\n              'h-5 w-5 rounded border-2 transition-colors duration-200',\n              'flex items-center justify-center',\n              'peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2',\n              'peer-disabled:opacity-50 peer-disabled:cursor-not-allowed',\n              checked\n                ? 'bg-primary-500 border-primary-500'\n                : 'bg-white border-slate-300 group-hover:border-slate-400'\n            )}\n          >\n            {checked && <CheckIcon className=\"h-3.5 w-3.5 text-white\" />}\n          </div>\n        </div>\n        {(label || description) && (\n          <div className=\"flex flex-col\">\n            {label && (\n              <span className=\"text-sm font-medium text-slate-900\">{label}</span>\n            )}\n            {description && (\n              <span className=\"text-sm text-slate-500\">{description}</span>\n            )}\n          </div>\n        )}\n      </label>\n    )\n  }\n)\n\nCheckbox.displayName = 'Checkbox'\n"],"names":["Checkbox","forwardRef","className","label","description","id","checked","props","ref","checkboxId","jsxs","cn","jsx","CheckIcon"],"mappings":";;;;AAUO,MAAMA,IAAWC;AAAA,EACtB,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,aAAAC,GAAa,IAAAC,GAAI,SAAAC,GAAS,GAAGC,EAAA,GAASC,MAAQ;AACjE,UAAMC,IAAaJ,MAAMF,KAAA,gBAAAA,EAAO,cAAc,QAAQ,QAAQ;AAE9D,WACE,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASD;AAAA,QACT,WAAWE,EAAG,+CAA+CT,CAAS;AAAA,QAEtE,UAAA;AAAA,UAAA,gBAAAQ,EAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,YAAA,gBAAAE;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,KAAAJ;AAAA,gBACA,MAAK;AAAA,gBACL,IAAIC;AAAA,gBACJ,SAAAH;AAAA,gBACA,WAAU;AAAA,gBACT,GAAGC;AAAA,cAAA;AAAA,YAAA;AAAA,YAEN,gBAAAK;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWD;AAAA,kBACT;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACAL,IACI,sCACA;AAAA,gBAAA;AAAA,gBAGL,UAAAA,KAAW,gBAAAM,EAACC,GAAA,EAAU,WAAU,yBAAA,CAAyB;AAAA,cAAA;AAAA,YAAA;AAAA,UAC5D,GACF;AAAA,WACEV,KAASC,MACT,gBAAAM,EAAC,OAAA,EAAI,WAAU,iBACZ,UAAA;AAAA,YAAAP,KACC,gBAAAS,EAAC,QAAA,EAAK,WAAU,sCAAsC,UAAAT,GAAM;AAAA,YAE7DC,KACC,gBAAAQ,EAAC,QAAA,EAAK,WAAU,0BAA0B,UAAAR,EAAA,CAAY;AAAA,UAAA,EAAA,CAE1D;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEAJ,EAAS,cAAc;"}

package/dist/index25.js

@@ -1,55 +1,82 @@
-import { jsxs as s, Fragment as h, jsx as t } from "react/jsx-runtime";
-import { cn as i } from "./index3.js";
-import { XMarkIcon as f } from "@heroicons/react/24/outline";
-const u = ({
-  isOpen: a,
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { Fragment as i } from "react";
+import { Transition as v, Dialog as N, TransitionChild as o, DialogPanel as y, DialogTitle as b } from "@headlessui/react";
+import { ExclamationTriangleIcon as g } from "@heroicons/react/24/outline";
+import { cn as s } from "./index3.js";
+import { Button as c } from "./index19.js";
+function D({
+  open: d,
   onClose: l,
-  children: n,
-  width: e = 680,
-  position: r = "right",
-  className: o
-}) => {
-  const c = typeof e == "number" ? `${e}px` : e;
-  return /* @__PURE__ */ s(h, { children: [
-    a && /* @__PURE__ */ t(
-      "div",
+  onConfirm: m,
+  title: f,
+  message: r,
+  confirmText: h = "Confirm",
+  cancelText: p = "Cancel",
+  showIcon: t = !1,
+  destructive: x = !1,
+  isLoading: n = !1,
+  className: u
+}) {
+  return /* @__PURE__ */ e(v, { show: d, as: i, children: /* @__PURE__ */ a(N, { onClose: l, className: "relative z-50", children: [
+    /* @__PURE__ */ e(
+      o,
       {
-        className: "fixed inset-0 z-40 bg-black/55 transition-opacity",
-        onClick: l
+        as: i,
+        enter: "ease-out duration-300",
+        enterFrom: "opacity-0",
+        enterTo: "opacity-100",
+        leave: "ease-in duration-200",
+        leaveFrom: "opacity-100",
+        leaveTo: "opacity-0",
+        children: /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50", "aria-hidden": "true" })
       }
     ),
-    /* @__PURE__ */ s(
-      "div",
+    /* @__PURE__ */ e("div", { className: "fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ e(
+      o,
       {
-        className: i(
-          "fixed top-0 z-50 h-screen bg-white shadow-2xl",
-          "transition-transform duration-300 ease-in-out",
-          r === "right" ? "right-0" : "left-0",
-          a ? "translate-x-0" : r === "right" ? "translate-x-full" : "-translate-x-full",
-          o
-        ),
-        style: { width: c },
-        children: [
-          /* @__PURE__ */ t(
-            "button",
-            {
-              onClick: l,
-              className: i(
-                "absolute top-8 z-50 border-0 bg-transparent cursor-pointer",
-                "flex items-center justify-center",
-                r === "right" ? "right-9" : "left-9"
-              ),
-              "aria-label": "Close drawer",
-              children: /* @__PURE__ */ t(f, { className: "w-6 h-6 text-slate-500 hover:text-slate-700" })
-            }
-          ),
-          /* @__PURE__ */ t("div", { className: "h-screen overflow-y-auto overflow-x-hidden", children: n })
-        ]
+        as: i,
+        enter: "ease-out duration-300",
+        enterFrom: "opacity-0 scale-95",
+        enterTo: "opacity-100 scale-100",
+        leave: "ease-in duration-200",
+        leaveFrom: "opacity-100 scale-100",
+        leaveTo: "opacity-0 scale-95",
+        children: /* @__PURE__ */ a(
+          y,
+          {
+            className: s(
+              "w-full max-w-md bg-white rounded-2xl shadow-xl p-6",
+              "transform transition-all",
+              u
+            ),
+            children: [
+              /* @__PURE__ */ a("div", { className: s(t && "flex gap-4"), children: [
+                t && /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: /* @__PURE__ */ e("div", { className: "rounded-full bg-amber-100 p-2", children: /* @__PURE__ */ e(g, { className: "h-6 w-6 text-amber-600" }) }) }),
+                /* @__PURE__ */ a("div", { className: "flex-1", children: [
+                  /* @__PURE__ */ e(b, { className: "text-lg font-semibold text-slate-900 mb-2", children: f }),
+                  r && /* @__PURE__ */ e("div", { className: "text-sm text-slate-600 mb-6", children: r })
+                ] })
+              ] }),
+              /* @__PURE__ */ a("div", { className: "flex justify-end gap-3 mt-6", children: [
+                /* @__PURE__ */ e(c, { variant: "outline", onClick: l, disabled: n, children: p }),
+                /* @__PURE__ */ e(
+                  c,
+                  {
+                    variant: x ? "danger" : "primary",
+                    onClick: m,
+                    isLoading: n,
+                    children: h
+                  }
+                )
+              ] })
+            ]
+          }
+        )
       }
-    )
-  ] });
-};
+    ) })
+  ] }) });
+}
 export {
-  u as Drawer
+  D as ConfirmModal
 };
 //# sourceMappingURL=index25.js.map