asterui 0.12.3 → 0.12.5

package/dist/components/Button.d.ts

@@ -7,8 +7,14 @@ type BaseButtonProps = {
     soft?: boolean;
     active?: boolean;
     loading?: boolean;
-    shape?: 'square' | 'circle' | 'wide' | 'block';
+    shape?: 'square' | 'circle' | 'wide' | 'block' | 'round';
     noAnimation?: boolean;
+    /** Icon element to display */
+    icon?: React.ReactNode;
+    /** Position of the icon */
+    iconPosition?: 'start' | 'end';
+    /** Applies error/danger styling (shorthand for type="error") */
+    danger?: boolean;
 };
 type ButtonAsButton = BaseButtonProps & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> & {
     href?: undefined;

package/dist/components/Kbd.d.ts

@@ -1,7 +1,8 @@
 import { default as React } from 'react';
+export type KbdSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export interface KbdProps extends React.HTMLAttributes<HTMLElement> {
     /** Size of the kbd */
-    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    size?: KbdSize;
     /** Key content */
     children?: React.ReactNode;
 }

package/dist/components/Modal.d.ts

@@ -12,6 +12,12 @@ export interface ModalProps extends Omit<React.HTMLAttributes<HTMLDialogElement>
     closable?: boolean;
     position?: 'top' | 'middle' | 'bottom';
     align?: 'start' | 'end';
+    /** Width of the modal box */
+    width?: number | string;
+    /** Center the modal vertically */
+    centered?: boolean;
+    /** Callback when modal is closed */
+    onClose?: () => void;
 }
 export interface ModalFuncProps {
     title?: React.ReactNode;
@@ -22,7 +28,7 @@ export interface ModalFuncProps {
     cancelText?: string;
     type?: 'info' | 'success' | 'warning' | 'error';
 }
-export declare function Modal({ children, title, footer, open, onOk, onCancel, okText, cancelText, maskClosable, closable, position, align, className, ...rest }: ModalProps): import("react/jsx-runtime").JSX.Element;
+export declare function Modal({ children, title, footer, open, onOk, onCancel, okText, cancelText, maskClosable, closable, position, align, width, centered, onClose, className, ...rest }: ModalProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Modal {
     var confirm: (config: ModalFuncProps) => {
         destroy: () => void;

package/dist/index42.js

@@ -1,21 +1,20 @@
-import { jsx as d } from "react/jsx-runtime";
-const a = ({
+import { jsx as e } from "react/jsx-runtime";
+const k = {
+  xs: "kbd-xs",
+  sm: "kbd-sm",
+  md: "kbd-md",
+  lg: "kbd-lg",
+  xl: "kbd-xl"
+}, t = ({
   size: s,
-  children: r,
-  className: t = "",
+  children: d,
+  className: l = "",
   ...o
 }) => {
-  const b = s ? `kbd-${s}` : "";
-  return /* @__PURE__ */ d(
-    "kbd",
-    {
-      className: `kbd ${b} ${t}`.trim(),
-      ...o,
-      children: r
-    }
-  );
+  const b = ["kbd", s ? k[s] : "", l].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("kbd", { className: b, ...o, children: d });
 };
 export {
-  a as Kbd
+  t as Kbd
 };
 //# sourceMappingURL=index42.js.map

package/dist/index42.js.map

@@ -1 +1 @@
-{"version":3,"file":"index42.js","sources":["../src/components/Kbd.tsx"],"sourcesContent":["import React from 'react'\n\nexport interface KbdProps extends React.HTMLAttributes<HTMLElement> {\n  /** Size of the kbd */\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  /** Key content */\n  children?: React.ReactNode\n}\n\nexport const Kbd: React.FC<KbdProps> = ({\n  size,\n  children,\n  className = '',\n  ...rest\n}) => {\n  const sizeClass = size ? `kbd-${size}` : ''\n\n  return (\n    <kbd\n      className={`kbd ${sizeClass} ${className}`.trim()}\n      {...rest}\n    >\n      {children}\n    </kbd>\n  )\n}\n"],"names":["Kbd","size","children","className","rest","sizeClass","jsx"],"mappings":";AASO,MAAMA,IAA0B,CAAC;AAAA,EACtC,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAYJ,IAAO,OAAOA,CAAI,KAAK;AAEzC,SACE,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,OAAOD,CAAS,IAAIF,CAAS,GAAG,KAAA;AAAA,MAC1C,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"index42.js","sources":["../src/components/Kbd.tsx"],"sourcesContent":["import React from 'react'\n\nexport type KbdSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n\nexport interface KbdProps extends React.HTMLAttributes<HTMLElement> {\n  /** Size of the kbd */\n  size?: KbdSize\n  /** Key content */\n  children?: React.ReactNode\n}\n\nconst sizeClasses: Record<KbdSize, string> = {\n  xs: 'kbd-xs',\n  sm: 'kbd-sm',\n  md: 'kbd-md',\n  lg: 'kbd-lg',\n  xl: 'kbd-xl',\n}\n\nexport const Kbd: React.FC<KbdProps> = ({\n  size,\n  children,\n  className = '',\n  ...rest\n}) => {\n  const classes = ['kbd', size ? sizeClasses[size] : '', className]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <kbd className={classes} {...rest}>\n      {children}\n    </kbd>\n  )\n}\n"],"names":["sizeClasses","Kbd","size","children","className","rest","classes"],"mappings":";AAWA,MAAMA,IAAuC;AAAA,EAC3C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAA0B,CAAC;AAAA,EACtC,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAU,CAAC,OAAOJ,IAAOF,EAAYE,CAAI,IAAI,IAAIE,CAAS,EAC7D,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,2BACG,OAAA,EAAI,WAAWE,GAAU,GAAGD,GAC1B,UAAAF,GACH;AAEJ;"}

package/dist/index47.js

@@ -1,13 +1,37 @@
-import { jsx as c } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
-const f = i(
-  ({ shape: a, half: s, children: o, className: r = "", ...e }, m) => {
-    const t = `mask-${a}`, l = s ? `mask-${s}` : "", n = ["mask", t, l, r].filter(Boolean).join(" ");
-    return /* @__PURE__ */ c("div", { ref: m, className: n, ...e, children: o });
+import { jsx as l } from "react/jsx-runtime";
+import { forwardRef as o } from "react";
+const i = {
+  squircle: "mask-squircle",
+  heart: "mask-heart",
+  hexagon: "mask-hexagon",
+  "hexagon-2": "mask-hexagon-2",
+  decagon: "mask-decagon",
+  pentagon: "mask-pentagon",
+  diamond: "mask-diamond",
+  square: "mask-square",
+  circle: "mask-circle",
+  star: "mask-star",
+  "star-2": "mask-star-2",
+  triangle: "mask-triangle",
+  "triangle-2": "mask-triangle-2",
+  "triangle-3": "mask-triangle-3",
+  "triangle-4": "mask-triangle-4"
+}, k = {
+  "half-1": "mask-half-1",
+  "half-2": "mask-half-2"
+}, g = o(
+  ({ shape: s, half: a, children: e, className: r = "", ...n }, m) => {
+    const t = [
+      "mask",
+      i[s],
+      a ? k[a] : "",
+      r
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ l("div", { ref: m, className: t, ...n, children: e });
   }
 );
-f.displayName = "Mask";
+g.displayName = "Mask";
 export {
-  f as Mask
+  g as Mask
 };
 //# sourceMappingURL=index47.js.map

package/dist/index47.js.map

@@ -1 +1 @@
-{"version":3,"file":"index47.js","sources":["../src/components/Mask.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nexport type MaskShape =\n  | 'squircle'\n  | 'heart'\n  | 'hexagon'\n  | 'hexagon-2'\n  | 'decagon'\n  | 'pentagon'\n  | 'diamond'\n  | 'square'\n  | 'circle'\n  | 'star'\n  | 'star-2'\n  | 'triangle'\n  | 'triangle-2'\n  | 'triangle-3'\n  | 'triangle-4'\n\nexport type MaskHalf = 'half-1' | 'half-2'\n\nexport interface MaskProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Shape of the mask */\n  shape: MaskShape\n  /** Show only half of the mask */\n  half?: MaskHalf\n  /** Content to mask (typically an image) */\n  children: React.ReactNode\n  /** Additional CSS classes */\n  className?: string\n}\n\nexport const Mask = forwardRef<HTMLDivElement, MaskProps>(\n  ({ shape, half, children, className = '', ...props }, ref) => {\n    const shapeClass = `mask-${shape}`\n    const halfClass = half ? `mask-${half}` : ''\n\n    const classes = ['mask', shapeClass, halfClass, className].filter(Boolean).join(' ')\n\n    return (\n      <div ref={ref} className={classes} {...props}>\n        {children}\n      </div>\n    )\n  }\n)\n\nMask.displayName = 'Mask'\n"],"names":["Mask","forwardRef","shape","half","children","className","props","ref","shapeClass","halfClass","classes"],"mappings":";;AAgCO,MAAMA,IAAOC;AAAA,EAClB,CAAC,EAAE,OAAAC,GAAO,MAAAC,GAAM,UAAAC,GAAU,WAAAC,IAAY,IAAI,GAAGC,EAAA,GAASC,MAAQ;AAC5D,UAAMC,IAAa,QAAQN,CAAK,IAC1BO,IAAYN,IAAO,QAAQA,CAAI,KAAK,IAEpCO,IAAU,CAAC,QAAQF,GAAYC,GAAWJ,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEnF,6BACG,OAAA,EAAI,KAAAE,GAAU,WAAWG,GAAU,GAAGJ,GACpC,UAAAF,GACH;AAAA,EAEJ;AACF;AAEAJ,EAAK,cAAc;"}
+{"version":3,"file":"index47.js","sources":["../src/components/Mask.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nexport type MaskShape =\n  | 'squircle'\n  | 'heart'\n  | 'hexagon'\n  | 'hexagon-2'\n  | 'decagon'\n  | 'pentagon'\n  | 'diamond'\n  | 'square'\n  | 'circle'\n  | 'star'\n  | 'star-2'\n  | 'triangle'\n  | 'triangle-2'\n  | 'triangle-3'\n  | 'triangle-4'\n\nexport type MaskHalf = 'half-1' | 'half-2'\n\nexport interface MaskProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Shape of the mask */\n  shape: MaskShape\n  /** Show only half of the mask */\n  half?: MaskHalf\n  /** Content to mask (typically an image) */\n  children: React.ReactNode\n  /** Additional CSS classes */\n  className?: string\n}\n\nconst shapeClasses: Record<MaskShape, string> = {\n  squircle: 'mask-squircle',\n  heart: 'mask-heart',\n  hexagon: 'mask-hexagon',\n  'hexagon-2': 'mask-hexagon-2',\n  decagon: 'mask-decagon',\n  pentagon: 'mask-pentagon',\n  diamond: 'mask-diamond',\n  square: 'mask-square',\n  circle: 'mask-circle',\n  star: 'mask-star',\n  'star-2': 'mask-star-2',\n  triangle: 'mask-triangle',\n  'triangle-2': 'mask-triangle-2',\n  'triangle-3': 'mask-triangle-3',\n  'triangle-4': 'mask-triangle-4',\n}\n\nconst halfClasses: Record<MaskHalf, string> = {\n  'half-1': 'mask-half-1',\n  'half-2': 'mask-half-2',\n}\n\nexport const Mask = forwardRef<HTMLDivElement, MaskProps>(\n  ({ shape, half, children, className = '', ...props }, ref) => {\n    const classes = [\n      'mask',\n      shapeClasses[shape],\n      half ? halfClasses[half] : '',\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ')\n\n    return (\n      <div ref={ref} className={classes} {...props}>\n        {children}\n      </div>\n    )\n  }\n)\n\nMask.displayName = 'Mask'\n"],"names":["shapeClasses","halfClasses","Mask","forwardRef","shape","half","children","className","props","ref","classes"],"mappings":";;AAgCA,MAAMA,IAA0C;AAAA,EAC9C,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,aAAa;AAAA,EACb,SAAS;AAAA,EACT,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AAAA,EACV,cAAc;AAAA,EACd,cAAc;AAAA,EACd,cAAc;AAChB,GAEMC,IAAwC;AAAA,EAC5C,UAAU;AAAA,EACV,UAAU;AACZ,GAEaC,IAAOC;AAAA,EAClB,CAAC,EAAE,OAAAC,GAAO,MAAAC,GAAM,UAAAC,GAAU,WAAAC,IAAY,IAAI,GAAGC,EAAA,GAASC,MAAQ;AAC5D,UAAMC,IAAU;AAAA,MACd;AAAA,MACAV,EAAaI,CAAK;AAAA,MAClBC,IAAOJ,EAAYI,CAAI,IAAI;AAAA,MAC3BE;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,6BACG,OAAA,EAAI,KAAAE,GAAU,WAAWC,GAAU,GAAGF,GACpC,UAAAF,GACH;AAAA,EAEJ;AACF;AAEAJ,EAAK,cAAc;"}

package/dist/index55.js

@@ -1,113 +1,116 @@
-import { jsxs as i, jsx as t, Fragment as F } from "react/jsx-runtime";
-import x, { useRef as T, useId as j, useEffect as B } from "react";
-import { createRoot as K } from "react-dom/client";
+import { jsxs as i, jsx as t, Fragment as P } from "react/jsx-runtime";
+import C, { useRef as $, useId as E, useEffect as O } from "react";
+import { createRoot as q } from "react-dom/client";
 function u({
   children: e,
   title: r,
-  footer: o,
-  open: a = !1,
-  onOk: l,
-  onCancel: s,
-  okText: v = "OK",
+  footer: s,
+  open: o = !1,
+  onOk: a,
+  onCancel: l,
+  okText: k = "OK",
   cancelText: c = "Cancel",
-  maskClosable: h = !0,
-  closable: m = !0,
-  position: d,
-  align: p,
-  className: f = "",
-  ...b
+  maskClosable: m = !0,
+  closable: h = !0,
+  position: p,
+  align: w,
+  width: d,
+  centered: b,
+  onClose: N,
+  className: R = "",
+  ...W
 }) {
-  const k = T(null), C = T(null), [N, y] = x.useState(!1), L = j(), g = j();
-  B(() => {
-    const n = k.current;
-    n && (a ? n.open || (C.current = document.activeElement, n.showModal()) : n.open && (n.close(), C.current?.focus()));
-  }, [a]), B(() => {
-    const n = k.current;
+  const y = $(null), L = $(null), [g, x] = C.useState(!1), M = E(), T = E(), f = N || l;
+  O(() => {
+    const n = y.current;
+    n && (o ? n.open || (L.current = document.activeElement, n.showModal()) : n.open && (n.close(), L.current?.focus()));
+  }, [o]), O(() => {
+    const n = y.current;
     if (!n) return;
-    const M = () => {
-      s?.();
+    const B = () => {
+      f?.();
     };
-    return n.addEventListener("close", M), () => {
-      n.removeEventListener("close", M);
+    return n.addEventListener("close", B), () => {
+      n.removeEventListener("close", B);
     };
-  }, [s]);
-  const E = {
+  }, [f]);
+  const z = {
     top: "modal-top",
     middle: "modal-middle",
     bottom: "modal-bottom"
-  }, O = {
+  }, I = {
     start: "modal-start",
     end: "modal-end"
-  }, R = [
+  }, j = b ? "middle" : p, S = [
     "modal",
-    d && E[d],
-    p && O[p],
-    f
-  ].filter(Boolean).join(" "), $ = async () => {
-    if (l) {
-      y(!0);
+    j && z[j],
+    w && I[w],
+    R
+  ].filter(Boolean).join(" "), F = async () => {
+    if (a) {
+      x(!0);
       try {
-        await l(), y(!1);
+        await a(), x(!1);
       } catch (n) {
-        throw y(!1), n;
+        throw x(!1), n;
       }
     }
-  }, z = () => {
-    h && s && s();
-  }, I = !o && (l || s), W = o != null;
+  }, K = () => {
+    m && f && f();
+  }, A = d ? { width: typeof d == "number" ? `${d}px` : d, maxWidth: "90vw" } : {}, D = !s && (a || l), H = s != null;
   return /* @__PURE__ */ i(
     "dialog",
     {
-      ref: k,
-      className: R,
-      "data-state": a ? "open" : "closed",
-      "aria-labelledby": r ? L : void 0,
-      "aria-describedby": g,
-      ...b,
+      ref: y,
+      className: S,
+      "data-state": o ? "open" : "closed",
+      "aria-labelledby": r ? M : void 0,
+      "aria-describedby": T,
+      ...W,
       children: [
-        /* @__PURE__ */ i("div", { className: "modal-box", children: [
-          r && /* @__PURE__ */ t("h3", { id: L, className: "text-lg font-bold mb-4", children: r }),
-          /* @__PURE__ */ t("div", { id: g, className: "py-4", children: e }),
-          I && /* @__PURE__ */ i("div", { className: "modal-action", children: [
-            s && /* @__PURE__ */ t("button", { className: "btn", onClick: s, children: c }),
-            l && /* @__PURE__ */ t(
+        /* @__PURE__ */ i("div", { className: "modal-box", style: A, children: [
+          r && /* @__PURE__ */ t("h3", { id: M, className: "text-lg font-bold mb-4", children: r }),
+          /* @__PURE__ */ t("div", { id: T, className: "py-4", children: e }),
+          D && /* @__PURE__ */ i("div", { className: "modal-action", children: [
+            l && /* @__PURE__ */ t("button", { className: "btn", onClick: l, children: c }),
+            a && /* @__PURE__ */ t(
               "button",
               {
-                className: `btn btn-primary ${N ? "loading" : ""}`,
-                onClick: $,
-                disabled: N,
-                children: v
+                className: `btn btn-primary ${g ? "loading" : ""}`,
+                onClick: F,
+                disabled: g,
+                children: k
               }
             )
           ] }),
-          W && /* @__PURE__ */ t("div", { className: "modal-action", children: o })
+          H && /* @__PURE__ */ t("div", { className: "modal-action", children: s })
         ] }),
-        m && h && /* @__PURE__ */ t("form", { method: "dialog", className: "modal-backdrop", children: /* @__PURE__ */ t("button", { onClick: z, children: "close" }) })
+        h && m && /* @__PURE__ */ t("form", { method: "dialog", className: "modal-backdrop", children: /* @__PURE__ */ t("button", { onClick: K, children: "close" }) })
       ]
     }
   );
 }
-function w(e) {
+function v(e) {
   const r = document.createElement("div");
   document.body.appendChild(r);
-  const o = K(r), a = () => {
-    o.unmount(), r.parentNode && r.parentNode.removeChild(r);
-  }, l = () => {
-    const [s, v] = x.useState(!0), [c, h] = x.useState(!1), m = () => {
-      v(!1), setTimeout(a, 300);
-    }, d = async () => {
+  const s = q(r), o = () => {
+    s.unmount(), r.parentNode && r.parentNode.removeChild(r);
+  }, a = () => {
+    const [l, k] = C.useState(!0), [c, m] = C.useState(!1), h = () => {
+      k(!1), setTimeout(o, 300);
+    }, p = async () => {
       if (e.onOk) {
-        h(!0);
+        m(!0);
         try {
-          await e.onOk(), m();
+          await e.onOk(), h();
         } catch {
-          h(!1);
+          m(!1);
         }
       } else
-        m();
-    }, p = () => {
-      e.onCancel?.(), m();
-    }, f = () => {
+        h();
+    }, w = () => {
+      e.onCancel?.(), h();
+    }, d = () => {
       switch (e.type) {
         case "success":
           return "alert-success";
@@ -203,22 +206,22 @@ function w(e) {
     return /* @__PURE__ */ i(
       u,
       {
-        open: s,
-        onOk: e.showCancel ? void 0 : d,
-        onCancel: p,
-        title: e.type ? /* @__PURE__ */ i("div", { className: `alert ${f()}`, children: [
+        open: l,
+        onOk: e.showCancel ? void 0 : p,
+        onCancel: w,
+        title: e.type ? /* @__PURE__ */ i("div", { className: `alert ${d()}`, children: [
           b(),
           /* @__PURE__ */ t("div", { children: e.title && /* @__PURE__ */ t("h3", { className: "font-bold", children: e.title }) })
         ] }) : e.title,
         okText: e.okText,
         cancelText: e.cancelText,
-        footer: e.showCancel ? /* @__PURE__ */ i(F, { children: [
-          /* @__PURE__ */ t("button", { className: "btn", onClick: p, children: e.cancelText || "Cancel" }),
+        footer: e.showCancel ? /* @__PURE__ */ i(P, { children: [
+          /* @__PURE__ */ t("button", { className: "btn", onClick: w, children: e.cancelText || "Cancel" }),
           /* @__PURE__ */ t(
             "button",
             {
               className: `btn ${e.type === "error" ? "btn-error" : "btn-primary"} ${c ? "loading" : ""}`,
-              onClick: d,
+              onClick: p,
               disabled: c,
               children: e.okText || "OK"
             }
@@ -227,7 +230,7 @@ function w(e) {
           "button",
           {
             className: `btn ${e.type === "error" ? "btn-error" : "btn-primary"} ${c ? "loading" : ""}`,
-            onClick: d,
+            onClick: p,
             disabled: c,
             children: e.okText || "OK"
           }
@@ -239,30 +242,30 @@ function w(e) {
       }
     );
   };
-  return o.render(/* @__PURE__ */ t(l, {})), {
-    destroy: a
+  return s.render(/* @__PURE__ */ t(a, {})), {
+    destroy: o
   };
 }
-function S(e) {
-  return w({ ...e, showCancel: !0 });
+function G(e) {
+  return v({ ...e, showCancel: !0 });
 }
-function A(e) {
-  return w({ ...e, type: "info", showCancel: !1 });
+function J(e) {
+  return v({ ...e, type: "info", showCancel: !1 });
 }
-function D(e) {
-  return w({ ...e, type: "success", showCancel: !1 });
+function Q(e) {
+  return v({ ...e, type: "success", showCancel: !1 });
 }
-function q(e) {
-  return w({ ...e, type: "warning", showCancel: !1 });
+function U(e) {
+  return v({ ...e, type: "warning", showCancel: !1 });
 }
-function G(e) {
-  return w({ ...e, type: "error", showCancel: !1 });
+function V(e) {
+  return v({ ...e, type: "error", showCancel: !1 });
 }
-u.confirm = S;
-u.info = A;
-u.success = D;
-u.warning = q;
-u.error = G;
+u.confirm = G;
+u.info = J;
+u.success = Q;
+u.warning = U;
+u.error = V;
 export {
   u as Modal
 };

package/dist/index55.js.map

@@ -1 +1 @@
-{"version":3,"file":"index55.js","sources":["../src/components/Modal.tsx"],"sourcesContent":["import React, { useEffect, useRef, useId } from 'react'\nimport { createRoot } from 'react-dom/client'\n\nexport interface ModalProps extends Omit<React.HTMLAttributes<HTMLDialogElement>, 'title'> {\n  children: React.ReactNode\n  title?: React.ReactNode\n  footer?: React.ReactNode\n  open?: boolean\n  onOk?: () => void | Promise<void>\n  onCancel?: () => void\n  okText?: string\n  cancelText?: string\n  maskClosable?: boolean\n  closable?: boolean\n  position?: 'top' | 'middle' | 'bottom'\n  align?: 'start' | 'end'\n}\n\nexport interface ModalFuncProps {\n  title?: React.ReactNode\n  content?: React.ReactNode\n  onOk?: () => void | Promise<void>\n  onCancel?: () => void\n  okText?: string\n  cancelText?: string\n  type?: 'info' | 'success' | 'warning' | 'error'\n}\n\nexport function Modal({\n  children,\n  title,\n  footer,\n  open = false,\n  onOk,\n  onCancel,\n  okText = 'OK',\n  cancelText = 'Cancel',\n  maskClosable = true,\n  closable = true,\n  position,\n  align,\n  className = '',\n  ...rest\n}: ModalProps) {\n  const dialogRef = useRef<HTMLDialogElement>(null)\n  const previousActiveElement = useRef<HTMLElement | null>(null)\n  const [loading, setLoading] = React.useState(false)\n  const titleId = useId()\n  const contentId = useId()\n\n  useEffect(() => {\n    const dialog = dialogRef.current\n    if (!dialog) return\n\n    if (open) {\n      if (!dialog.open) {\n        // Save currently focused element for restoration\n        previousActiveElement.current = document.activeElement as HTMLElement\n        dialog.showModal()\n      }\n    } else {\n      if (dialog.open) {\n        dialog.close()\n        // Restore focus to previously focused element\n        previousActiveElement.current?.focus()\n      }\n    }\n  }, [open])\n\n  useEffect(() => {\n    const dialog = dialogRef.current\n    if (!dialog) return\n\n    const handleClose = () => {\n      onCancel?.()\n    }\n\n    dialog.addEventListener('close', handleClose)\n    return () => {\n      dialog.removeEventListener('close', handleClose)\n    }\n  }, [onCancel])\n\n  const positionClasses = {\n    top: 'modal-top',\n    middle: 'modal-middle',\n    bottom: 'modal-bottom',\n  }\n\n  const alignClasses = {\n    start: 'modal-start',\n    end: 'modal-end',\n  }\n\n  const classes = [\n    'modal',\n    position && positionClasses[position],\n    align && alignClasses[align],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const handleOk = async () => {\n    if (onOk) {\n      setLoading(true)\n      try {\n        await onOk()\n        setLoading(false)\n      } catch (error) {\n        setLoading(false)\n        throw error\n      }\n    }\n  }\n\n  const handleBackdropClick = () => {\n    if (maskClosable && onCancel) {\n      onCancel()\n    }\n  }\n\n  // Render default footer if no custom footer provided and either onOk or onCancel exists\n  const shouldRenderDefaultFooter = !footer && (onOk || onCancel)\n  const shouldRenderCustomFooter = footer !== null && footer !== undefined\n\n  return (\n    <dialog\n      ref={dialogRef}\n      className={classes}\n      data-state={open ? 'open' : 'closed'}\n      aria-labelledby={title ? titleId : undefined}\n      aria-describedby={contentId}\n      {...rest}\n    >\n      <div className=\"modal-box\">\n        {title && (\n          <h3 id={titleId} className=\"text-lg font-bold mb-4\">\n            {title}\n          </h3>\n        )}\n        <div id={contentId} className=\"py-4\">\n          {children}\n        </div>\n        {shouldRenderDefaultFooter && (\n          <div className=\"modal-action\">\n            {onCancel && (\n              <button className=\"btn\" onClick={onCancel}>\n                {cancelText}\n              </button>\n            )}\n            {onOk && (\n              <button\n                className={`btn btn-primary ${loading ? 'loading' : ''}`}\n                onClick={handleOk}\n                disabled={loading}\n              >\n                {okText}\n              </button>\n            )}\n          </div>\n        )}\n        {shouldRenderCustomFooter && <div className=\"modal-action\">{footer}</div>}\n      </div>\n      {closable && maskClosable && (\n        <form method=\"dialog\" className=\"modal-backdrop\">\n          <button onClick={handleBackdropClick}>close</button>\n        </form>\n      )}\n    </dialog>\n  )\n}\n\nfunction createModal(config: ModalFuncProps & { showCancel?: boolean }) {\n  const div = document.createElement('div')\n  document.body.appendChild(div)\n  const root = createRoot(div)\n\n  const destroy = () => {\n    root.unmount()\n    if (div.parentNode) {\n      div.parentNode.removeChild(div)\n    }\n  }\n\n  const ModalContent = () => {\n    const [open, setOpen] = React.useState(true)\n    const [loading, setLoading] = React.useState(false)\n\n    const handleClose = () => {\n      setOpen(false)\n      setTimeout(destroy, 300) // Wait for animation\n    }\n\n    const handleOk = async () => {\n      if (config.onOk) {\n        setLoading(true)\n        try {\n          await config.onOk()\n          handleClose()\n        } catch (error) {\n          setLoading(false)\n        }\n      } else {\n        handleClose()\n      }\n    }\n\n    const handleCancel = () => {\n      config.onCancel?.()\n      handleClose()\n    }\n\n    const getAlertClass = () => {\n      switch (config.type) {\n        case 'success':\n          return 'alert-success'\n        case 'warning':\n          return 'alert-warning'\n        case 'error':\n          return 'alert-error'\n        case 'info':\n        default:\n          return 'alert-info'\n      }\n    }\n\n    const getIcon = () => {\n      switch (config.type) {\n        case 'success':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className=\"stroke-current shrink-0 h-6 w-6\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\"\n              />\n            </svg>\n          )\n        case 'warning':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className=\"stroke-current shrink-0 h-6 w-6\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n              />\n            </svg>\n          )\n        case 'error':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className=\"stroke-current shrink-0 h-6 w-6\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z\"\n              />\n            </svg>\n          )\n        case 'info':\n        default:\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              className=\"stroke-current shrink-0 w-6 h-6\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\n              ></path>\n            </svg>\n          )\n      }\n    }\n\n    return (\n      <Modal\n        open={open}\n        onOk={config.showCancel ? undefined : handleOk}\n        onCancel={handleCancel}\n        title={\n          config.type ? (\n            <div className={`alert ${getAlertClass()}`}>\n              {getIcon()}\n              <div>\n                {config.title && <h3 className=\"font-bold\">{config.title}</h3>}\n              </div>\n            </div>\n          ) : (\n            config.title\n          )\n        }\n        okText={config.okText}\n        cancelText={config.cancelText}\n        footer={\n          config.showCancel ? (\n            <>\n              <button className=\"btn\" onClick={handleCancel}>\n                {config.cancelText || 'Cancel'}\n              </button>\n              <button\n                className={`btn ${config.type === 'error' ? 'btn-error' : 'btn-primary'} ${loading ? 'loading' : ''}`}\n                onClick={handleOk}\n                disabled={loading}\n              >\n                {config.okText || 'OK'}\n              </button>\n            </>\n          ) : (\n            <button\n              className={`btn ${config.type === 'error' ? 'btn-error' : 'btn-primary'} ${loading ? 'loading' : ''}`}\n              onClick={handleOk}\n              disabled={loading}\n            >\n              {config.okText || 'OK'}\n            </button>\n          )\n        }\n      >\n        {config.type && config.content && <div className=\"text-sm\">{config.content}</div>}\n        {!config.type && config.content}\n      </Modal>\n    )\n  }\n\n  root.render(<ModalContent />)\n\n  return {\n    destroy,\n  }\n}\n\nfunction confirm(config: ModalFuncProps) {\n  return createModal({ ...config, showCancel: true })\n}\n\nfunction info(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'info', showCancel: false })\n}\n\nfunction success(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'success', showCancel: false })\n}\n\nfunction warning(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'warning', showCancel: false })\n}\n\nfunction error(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'error', showCancel: false })\n}\n\nModal.confirm = confirm\nModal.info = info\nModal.success = success\nModal.warning = warning\nModal.error = error\n"],"names":["Modal","children","title","footer","open","onOk","onCancel","okText","cancelText","maskClosable","closable","position","align","className","rest","dialogRef","useRef","previousActiveElement","loading","setLoading","React","titleId","useId","contentId","useEffect","dialog","handleClose","positionClasses","alignClasses","classes","handleOk","error","handleBackdropClick","shouldRenderDefaultFooter","shouldRenderCustomFooter","jsxs","jsx","createModal","config","div","root","createRoot","destroy","ModalContent","setOpen","handleCancel","getAlertClass","getIcon","Fragment","confirm","info","success","warning"],"mappings":"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"}
+{"version":3,"file":"index55.js","sources":["../src/components/Modal.tsx"],"sourcesContent":["import React, { useEffect, useRef, useId } from 'react'\nimport { createRoot } from 'react-dom/client'\n\nexport interface ModalProps extends Omit<React.HTMLAttributes<HTMLDialogElement>, 'title'> {\n  children: React.ReactNode\n  title?: React.ReactNode\n  footer?: React.ReactNode\n  open?: boolean\n  onOk?: () => void | Promise<void>\n  onCancel?: () => void\n  okText?: string\n  cancelText?: string\n  maskClosable?: boolean\n  closable?: boolean\n  position?: 'top' | 'middle' | 'bottom'\n  align?: 'start' | 'end'\n  /** Width of the modal box */\n  width?: number | string\n  /** Center the modal vertically */\n  centered?: boolean\n  /** Callback when modal is closed */\n  onClose?: () => void\n}\n\nexport interface ModalFuncProps {\n  title?: React.ReactNode\n  content?: React.ReactNode\n  onOk?: () => void | Promise<void>\n  onCancel?: () => void\n  okText?: string\n  cancelText?: string\n  type?: 'info' | 'success' | 'warning' | 'error'\n}\n\nexport function Modal({\n  children,\n  title,\n  footer,\n  open = false,\n  onOk,\n  onCancel,\n  okText = 'OK',\n  cancelText = 'Cancel',\n  maskClosable = true,\n  closable = true,\n  position,\n  align,\n  width,\n  centered,\n  onClose,\n  className = '',\n  ...rest\n}: ModalProps) {\n  const dialogRef = useRef<HTMLDialogElement>(null)\n  const previousActiveElement = useRef<HTMLElement | null>(null)\n  const [loading, setLoading] = React.useState(false)\n  const titleId = useId()\n  const contentId = useId()\n\n  // Handle close - use onClose if provided, otherwise onCancel\n  const closeHandler = onClose || onCancel\n\n  useEffect(() => {\n    const dialog = dialogRef.current\n    if (!dialog) return\n\n    if (open) {\n      if (!dialog.open) {\n        // Save currently focused element for restoration\n        previousActiveElement.current = document.activeElement as HTMLElement\n        dialog.showModal()\n      }\n    } else {\n      if (dialog.open) {\n        dialog.close()\n        // Restore focus to previously focused element\n        previousActiveElement.current?.focus()\n      }\n    }\n  }, [open])\n\n  useEffect(() => {\n    const dialog = dialogRef.current\n    if (!dialog) return\n\n    const onDialogClose = () => {\n      closeHandler?.()\n    }\n\n    dialog.addEventListener('close', onDialogClose)\n    return () => {\n      dialog.removeEventListener('close', onDialogClose)\n    }\n  }, [closeHandler])\n\n  const positionClasses = {\n    top: 'modal-top',\n    middle: 'modal-middle',\n    bottom: 'modal-bottom',\n  }\n\n  const alignClasses = {\n    start: 'modal-start',\n    end: 'modal-end',\n  }\n\n  // centered is an alias for position=\"middle\"\n  const effectivePosition = centered ? 'middle' : position\n\n  const classes = [\n    'modal',\n    effectivePosition && positionClasses[effectivePosition],\n    align && alignClasses[align],\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const handleOk = async () => {\n    if (onOk) {\n      setLoading(true)\n      try {\n        await onOk()\n        setLoading(false)\n      } catch (error) {\n        setLoading(false)\n        throw error\n      }\n    }\n  }\n\n  const handleBackdropClick = () => {\n    if (maskClosable && closeHandler) {\n      closeHandler()\n    }\n  }\n\n  // Calculate modal-box style for custom width\n  const modalBoxStyle: React.CSSProperties = width\n    ? { width: typeof width === 'number' ? `${width}px` : width, maxWidth: '90vw' }\n    : {}\n\n  // Render default footer if no custom footer provided and either onOk or onCancel exists\n  const shouldRenderDefaultFooter = !footer && (onOk || onCancel)\n  const shouldRenderCustomFooter = footer !== null && footer !== undefined\n\n  return (\n    <dialog\n      ref={dialogRef}\n      className={classes}\n      data-state={open ? 'open' : 'closed'}\n      aria-labelledby={title ? titleId : undefined}\n      aria-describedby={contentId}\n      {...rest}\n    >\n      <div className=\"modal-box\" style={modalBoxStyle}>\n        {title && (\n          <h3 id={titleId} className=\"text-lg font-bold mb-4\">\n            {title}\n          </h3>\n        )}\n        <div id={contentId} className=\"py-4\">\n          {children}\n        </div>\n        {shouldRenderDefaultFooter && (\n          <div className=\"modal-action\">\n            {onCancel && (\n              <button className=\"btn\" onClick={onCancel}>\n                {cancelText}\n              </button>\n            )}\n            {onOk && (\n              <button\n                className={`btn btn-primary ${loading ? 'loading' : ''}`}\n                onClick={handleOk}\n                disabled={loading}\n              >\n                {okText}\n              </button>\n            )}\n          </div>\n        )}\n        {shouldRenderCustomFooter && <div className=\"modal-action\">{footer}</div>}\n      </div>\n      {closable && maskClosable && (\n        <form method=\"dialog\" className=\"modal-backdrop\">\n          <button onClick={handleBackdropClick}>close</button>\n        </form>\n      )}\n    </dialog>\n  )\n}\n\nfunction createModal(config: ModalFuncProps & { showCancel?: boolean }) {\n  const div = document.createElement('div')\n  document.body.appendChild(div)\n  const root = createRoot(div)\n\n  const destroy = () => {\n    root.unmount()\n    if (div.parentNode) {\n      div.parentNode.removeChild(div)\n    }\n  }\n\n  const ModalContent = () => {\n    const [open, setOpen] = React.useState(true)\n    const [loading, setLoading] = React.useState(false)\n\n    const handleClose = () => {\n      setOpen(false)\n      setTimeout(destroy, 300) // Wait for animation\n    }\n\n    const handleOk = async () => {\n      if (config.onOk) {\n        setLoading(true)\n        try {\n          await config.onOk()\n          handleClose()\n        } catch (error) {\n          setLoading(false)\n        }\n      } else {\n        handleClose()\n      }\n    }\n\n    const handleCancel = () => {\n      config.onCancel?.()\n      handleClose()\n    }\n\n    const getAlertClass = () => {\n      switch (config.type) {\n        case 'success':\n          return 'alert-success'\n        case 'warning':\n          return 'alert-warning'\n        case 'error':\n          return 'alert-error'\n        case 'info':\n        default:\n          return 'alert-info'\n      }\n    }\n\n    const getIcon = () => {\n      switch (config.type) {\n        case 'success':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className=\"stroke-current shrink-0 h-6 w-6\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z\"\n              />\n            </svg>\n          )\n        case 'warning':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className=\"stroke-current shrink-0 h-6 w-6\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n              />\n            </svg>\n          )\n        case 'error':\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              className=\"stroke-current shrink-0 h-6 w-6\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z\"\n              />\n            </svg>\n          )\n        case 'info':\n        default:\n          return (\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              className=\"stroke-current shrink-0 w-6 h-6\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth=\"2\"\n                d=\"M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z\"\n              ></path>\n            </svg>\n          )\n      }\n    }\n\n    return (\n      <Modal\n        open={open}\n        onOk={config.showCancel ? undefined : handleOk}\n        onCancel={handleCancel}\n        title={\n          config.type ? (\n            <div className={`alert ${getAlertClass()}`}>\n              {getIcon()}\n              <div>\n                {config.title && <h3 className=\"font-bold\">{config.title}</h3>}\n              </div>\n            </div>\n          ) : (\n            config.title\n          )\n        }\n        okText={config.okText}\n        cancelText={config.cancelText}\n        footer={\n          config.showCancel ? (\n            <>\n              <button className=\"btn\" onClick={handleCancel}>\n                {config.cancelText || 'Cancel'}\n              </button>\n              <button\n                className={`btn ${config.type === 'error' ? 'btn-error' : 'btn-primary'} ${loading ? 'loading' : ''}`}\n                onClick={handleOk}\n                disabled={loading}\n              >\n                {config.okText || 'OK'}\n              </button>\n            </>\n          ) : (\n            <button\n              className={`btn ${config.type === 'error' ? 'btn-error' : 'btn-primary'} ${loading ? 'loading' : ''}`}\n              onClick={handleOk}\n              disabled={loading}\n            >\n              {config.okText || 'OK'}\n            </button>\n          )\n        }\n      >\n        {config.type && config.content && <div className=\"text-sm\">{config.content}</div>}\n        {!config.type && config.content}\n      </Modal>\n    )\n  }\n\n  root.render(<ModalContent />)\n\n  return {\n    destroy,\n  }\n}\n\nfunction confirm(config: ModalFuncProps) {\n  return createModal({ ...config, showCancel: true })\n}\n\nfunction info(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'info', showCancel: false })\n}\n\nfunction success(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'success', showCancel: false })\n}\n\nfunction warning(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'warning', showCancel: false })\n}\n\nfunction error(config: ModalFuncProps) {\n  return createModal({ ...config, type: 'error', showCancel: false })\n}\n\nModal.confirm = confirm\nModal.info = info\nModal.success = success\nModal.warning = warning\nModal.error = error\n"],"names":["Modal","children","title","footer","open","onOk","onCancel","okText","cancelText","maskClosable","closable","position","align","width","centered","onClose","className","rest","dialogRef","useRef","previousActiveElement","loading","setLoading","React","titleId","useId","contentId","closeHandler","useEffect","dialog","onDialogClose","positionClasses","alignClasses","effectivePosition","classes","handleOk","error","handleBackdropClick","modalBoxStyle","shouldRenderDefaultFooter","shouldRenderCustomFooter","jsxs","jsx","createModal","config","div","root","createRoot","destroy","ModalContent","setOpen","handleClose","handleCancel","getAlertClass","getIcon","Fragment","confirm","info","success","warning"],"mappings":"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"}

package/dist/index9.js

@@ -1,19 +1,22 @@
-import { jsx as s, jsxs as j, Fragment as v } from "react/jsx-runtime";
-const T = ({
-  children: l,
-  type: e,
-  size: b = "md",
-  outline: i = !1,
-  dash: d = !1,
-  soft: u = !1,
-  active: f = !1,
-  loading: t = !1,
-  shape: a,
-  noAnimation: m = !1,
-  className: h = "",
-  ...n
+import { jsx as a, jsxs as B, Fragment as z } from "react/jsx-runtime";
+const $ = ({
+  children: t,
+  type: u,
+  size: f = "md",
+  outline: m = !1,
+  dash: h = !1,
+  soft: y = !1,
+  active: p = !1,
+  loading: n = !1,
+  shape: l,
+  noAnimation: x = !1,
+  icon: e,
+  iconPosition: r = "start",
+  danger: g = !1,
+  className: v = "",
+  ...s
 }) => {
-  const y = {
+  const c = g ? "error" : u, C = {
     primary: "btn-primary",
     secondary: "btn-secondary",
     accent: "btn-accent",
@@ -24,50 +27,53 @@ const T = ({
     neutral: "btn-neutral",
     ghost: "btn-ghost",
     link: "btn-link"
-  }, g = {
+  }, k = {
     xs: "btn-xs",
     sm: "btn-sm",
     md: "",
     lg: "btn-lg",
     xl: "btn-xl"
-  }, x = {
+  }, w = {
     square: "btn-square",
     circle: "btn-circle",
     wide: "btn-wide",
-    block: "btn-block"
-  }, r = [
+    block: "btn-block",
+    round: "rounded-full"
+  }, o = [
     "btn",
-    e && y[e],
-    g[b],
-    i && "btn-outline",
-    d && "btn-dash",
-    u && "btn-soft",
-    f && "btn-active",
-    a && x[a],
-    m && "no-animation",
-    h
-  ].filter(Boolean).join(" "), o = /* @__PURE__ */ j(v, { children: [
-    t && /* @__PURE__ */ s("span", { className: "loading loading-spinner", "aria-hidden": "true" }),
-    l
+    c && C[c],
+    k[f],
+    m && "btn-outline",
+    h && "btn-dash",
+    y && "btn-soft",
+    p && "btn-active",
+    l && w[l],
+    x && "no-animation",
+    v
+  ].filter(Boolean).join(" "), N = t != null && t !== "" ? r === "start" ? "mr-2" : "ml-2" : "", b = e && /* @__PURE__ */ a("span", { className: `inline-flex items-center ${N}`, "aria-hidden": "true", children: e }), i = /* @__PURE__ */ B(z, { children: [
+    n && /* @__PURE__ */ a("span", { className: "loading loading-spinner", "aria-hidden": "true" }),
+    !n && e && r === "start" && b,
+    t,
+    !n && e && r === "end" && b
   ] });
-  if ("href" in n && n.href !== void 0) {
-    const { href: k, ...w } = n;
-    return /* @__PURE__ */ s("a", { href: k, className: r, ...w, children: o });
+  if ("href" in s && s.href !== void 0) {
+    const { href: j, ...q } = s;
+    return /* @__PURE__ */ a("a", { href: j, className: o, ...q, children: i });
   }
-  const { htmlType: p, ...c } = n;
-  return /* @__PURE__ */ s(
+  const { htmlType: T, ...d } = s;
+  return /* @__PURE__ */ a(
     "button",
     {
-      type: p ?? "button",
-      className: r,
-      "aria-busy": t ? "true" : void 0,
-      disabled: t || c.disabled,
-      ...c,
-      children: o
+      type: T ?? "button",
+      className: o,
+      "aria-busy": n ? "true" : void 0,
+      disabled: n || d.disabled,
+      ...d,
+      children: i
     }
   );
 };
 export {
-  T as Button
+  $ as Button
 };
 //# sourceMappingURL=index9.js.map

package/dist/index9.js.map

@@ -1 +1 @@
-{"version":3,"file":"index9.js","sources":["../src/components/Button.tsx"],"sourcesContent":["import React from 'react'\n\ntype BaseButtonProps = {\n  type?: 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error' | 'neutral' | 'ghost' | 'link'\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  outline?: boolean\n  dash?: boolean\n  soft?: boolean\n  active?: boolean\n  loading?: boolean\n  shape?: 'square' | 'circle' | 'wide' | 'block'\n  noAnimation?: boolean\n}\n\ntype ButtonAsButton = BaseButtonProps &\n  Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> & {\n    href?: undefined\n    htmlType?: 'button' | 'submit' | 'reset'\n  }\n\ntype ButtonAsAnchor = BaseButtonProps &\n  Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'type'> & {\n    href: string\n    htmlType?: undefined\n  }\n\nexport type ButtonProps = ButtonAsButton | ButtonAsAnchor\n\nexport const Button: React.FC<ButtonProps> = ({\n  children,\n  type,\n  size = 'md',\n  outline = false,\n  dash = false,\n  soft = false,\n  active = false,\n  loading = false,\n  shape,\n  noAnimation = false,\n  className = '',\n  ...props\n}) => {\n  const typeClasses = {\n    primary: 'btn-primary',\n    secondary: 'btn-secondary',\n    accent: 'btn-accent',\n    info: 'btn-info',\n    success: 'btn-success',\n    warning: 'btn-warning',\n    error: 'btn-error',\n    neutral: 'btn-neutral',\n    ghost: 'btn-ghost',\n    link: 'btn-link',\n  }\n\n  const sizeClasses = {\n    xs: 'btn-xs',\n    sm: 'btn-sm',\n    md: '',\n    lg: 'btn-lg',\n    xl: 'btn-xl',\n  }\n\n  const shapeClasses = {\n    square: 'btn-square',\n    circle: 'btn-circle',\n    wide: 'btn-wide',\n    block: 'btn-block',\n  }\n\n  const classes = [\n    'btn',\n    type && typeClasses[type],\n    sizeClasses[size],\n    outline && 'btn-outline',\n    dash && 'btn-dash',\n    soft && 'btn-soft',\n    active && 'btn-active',\n    shape && shapeClasses[shape],\n    noAnimation && 'no-animation',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const content = (\n    <>\n      {loading && <span className=\"loading loading-spinner\" aria-hidden=\"true\"></span>}\n      {children}\n    </>\n  )\n\n  if ('href' in props && props.href !== undefined) {\n    const { href, ...anchorProps } = props as ButtonAsAnchor\n    return (\n      <a href={href} className={classes} {...anchorProps}>\n        {content}\n      </a>\n    )\n  }\n\n  const { htmlType, ...buttonProps } = props as Omit<ButtonAsButton, keyof BaseButtonProps>\n  const buttonType: 'button' | 'submit' | 'reset' = htmlType ?? 'button'\n  return (\n    <button\n      type={buttonType}\n      className={classes}\n      aria-busy={loading ? 'true' : undefined}\n      disabled={loading || buttonProps.disabled}\n      {...buttonProps}\n    >\n      {content}\n    </button>\n  )\n}\n"],"names":["Button","children","type","size","outline","dash","soft","active","loading","shape","noAnimation","className","props","typeClasses","sizeClasses","shapeClasses","classes","content","jsxs","Fragment","jsx","href","anchorProps","htmlType","buttonProps"],"mappings":";AA4BO,MAAMA,IAAgC,CAAC;AAAA,EAC5C,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAO;AAAA,EACP,QAAAC,IAAS;AAAA,EACT,SAAAC,IAAU;AAAA,EACV,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAc;AAAA,IAClB,SAAS;AAAA,IACT,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,IACP,SAAS;AAAA,IACT,OAAO;AAAA,IACP,MAAM;AAAA,EAAA,GAGFC,IAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAe;AAAA,IACnB,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,OAAO;AAAA,EAAA,GAGHC,IAAU;AAAA,IACd;AAAA,IACAd,KAAQW,EAAYX,CAAI;AAAA,IACxBY,EAAYX,CAAI;AAAA,IAChBC,KAAW;AAAA,IACXC,KAAQ;AAAA,IACRC,KAAQ;AAAA,IACRC,KAAU;AAAA,IACVE,KAASM,EAAaN,CAAK;AAAA,IAC3BC,KAAe;AAAA,IACfC;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GAELM,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAX,KAAW,gBAAAY,EAAC,QAAA,EAAK,WAAU,2BAA0B,eAAY,QAAO;AAAA,IACxEnB;AAAA,EAAA,GACH;AAGF,MAAI,UAAUW,KAASA,EAAM,SAAS,QAAW;AAC/C,UAAM,EAAE,MAAAS,GAAM,GAAGC,EAAA,IAAgBV;AACjC,6BACG,KAAA,EAAE,MAAAS,GAAY,WAAWL,GAAU,GAAGM,GACpC,UAAAL,GACH;AAAA,EAEJ;AAEA,QAAM,EAAE,UAAAM,GAAU,GAAGC,EAAA,IAAgBZ;AAErC,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAH8CG,KAAY;AAAA,MAI1D,WAAWP;AAAA,MACX,aAAWR,IAAU,SAAS;AAAA,MAC9B,UAAUA,KAAWgB,EAAY;AAAA,MAChC,GAAGA;AAAA,MAEH,UAAAP;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"index9.js","sources":["../src/components/Button.tsx"],"sourcesContent":["import React from 'react'\n\ntype BaseButtonProps = {\n  type?: 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error' | 'neutral' | 'ghost' | 'link'\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n  outline?: boolean\n  dash?: boolean\n  soft?: boolean\n  active?: boolean\n  loading?: boolean\n  shape?: 'square' | 'circle' | 'wide' | 'block' | 'round'\n  noAnimation?: boolean\n  /** Icon element to display */\n  icon?: React.ReactNode\n  /** Position of the icon */\n  iconPosition?: 'start' | 'end'\n  /** Applies error/danger styling (shorthand for type=\"error\") */\n  danger?: boolean\n}\n\ntype ButtonAsButton = BaseButtonProps &\n  Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> & {\n    href?: undefined\n    htmlType?: 'button' | 'submit' | 'reset'\n  }\n\ntype ButtonAsAnchor = BaseButtonProps &\n  Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'type'> & {\n    href: string\n    htmlType?: undefined\n  }\n\nexport type ButtonProps = ButtonAsButton | ButtonAsAnchor\n\nexport const Button: React.FC<ButtonProps> = ({\n  children,\n  type,\n  size = 'md',\n  outline = false,\n  dash = false,\n  soft = false,\n  active = false,\n  loading = false,\n  shape,\n  noAnimation = false,\n  icon,\n  iconPosition = 'start',\n  danger = false,\n  className = '',\n  ...props\n}) => {\n  // danger prop is a shorthand for type=\"error\"\n  const effectiveType = danger ? 'error' : type\n  const typeClasses = {\n    primary: 'btn-primary',\n    secondary: 'btn-secondary',\n    accent: 'btn-accent',\n    info: 'btn-info',\n    success: 'btn-success',\n    warning: 'btn-warning',\n    error: 'btn-error',\n    neutral: 'btn-neutral',\n    ghost: 'btn-ghost',\n    link: 'btn-link',\n  }\n\n  const sizeClasses = {\n    xs: 'btn-xs',\n    sm: 'btn-sm',\n    md: '',\n    lg: 'btn-lg',\n    xl: 'btn-xl',\n  }\n\n  const shapeClasses = {\n    square: 'btn-square',\n    circle: 'btn-circle',\n    wide: 'btn-wide',\n    block: 'btn-block',\n    round: 'rounded-full',\n  }\n\n  const classes = [\n    'btn',\n    effectiveType && typeClasses[effectiveType],\n    sizeClasses[size],\n    outline && 'btn-outline',\n    dash && 'btn-dash',\n    soft && 'btn-soft',\n    active && 'btn-active',\n    shape && shapeClasses[shape],\n    noAnimation && 'no-animation',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  // Determine icon spacing based on whether there's text content\n  const hasChildren = children !== undefined && children !== null && children !== ''\n  const iconSpacing = hasChildren ? (iconPosition === 'start' ? 'mr-2' : 'ml-2') : ''\n\n  const iconElement = icon && (\n    <span className={`inline-flex items-center ${iconSpacing}`} aria-hidden=\"true\">\n      {icon}\n    </span>\n  )\n\n  const content = (\n    <>\n      {loading && <span className=\"loading loading-spinner\" aria-hidden=\"true\"></span>}\n      {!loading && icon && iconPosition === 'start' && iconElement}\n      {children}\n      {!loading && icon && iconPosition === 'end' && iconElement}\n    </>\n  )\n\n  if ('href' in props && props.href !== undefined) {\n    const { href, ...anchorProps } = props as ButtonAsAnchor\n    return (\n      <a href={href} className={classes} {...anchorProps}>\n        {content}\n      </a>\n    )\n  }\n\n  const { htmlType, ...buttonProps } = props as Omit<ButtonAsButton, keyof BaseButtonProps>\n  const buttonType: 'button' | 'submit' | 'reset' = htmlType ?? 'button'\n  return (\n    <button\n      type={buttonType}\n      className={classes}\n      aria-busy={loading ? 'true' : undefined}\n      disabled={loading || buttonProps.disabled}\n      {...buttonProps}\n    >\n      {content}\n    </button>\n  )\n}\n"],"names":["Button","children","type","size","outline","dash","soft","active","loading","shape","noAnimation","icon","iconPosition","danger","className","props","effectiveType","typeClasses","sizeClasses","shapeClasses","classes","iconSpacing","iconElement","jsx","content","jsxs","Fragment","href","anchorProps","htmlType","buttonProps"],"mappings":";AAkCO,MAAMA,IAAgC,CAAC;AAAA,EAC5C,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAO;AAAA,EACP,QAAAC,IAAS;AAAA,EACT,SAAAC,IAAU;AAAA,EACV,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AAEJ,QAAMC,IAAgBH,IAAS,UAAUX,GACnCe,IAAc;AAAA,IAClB,SAAS;AAAA,IACT,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,IACP,SAAS;AAAA,IACT,OAAO;AAAA,IACP,MAAM;AAAA,EAAA,GAGFC,IAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAe;AAAA,IACnB,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,OAAO;AAAA,IACP,OAAO;AAAA,EAAA,GAGHC,IAAU;AAAA,IACd;AAAA,IACAJ,KAAiBC,EAAYD,CAAa;AAAA,IAC1CE,EAAYf,CAAI;AAAA,IAChBC,KAAW;AAAA,IACXC,KAAQ;AAAA,IACRC,KAAQ;AAAA,IACRC,KAAU;AAAA,IACVE,KAASU,EAAaV,CAAK;AAAA,IAC3BC,KAAe;AAAA,IACfI;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GAILO,IADwCpB,KAAa,QAAQA,MAAa,KAC7CW,MAAiB,UAAU,SAAS,SAAU,IAE3EU,IAAcX,KAClB,gBAAAY,EAAC,QAAA,EAAK,WAAW,4BAA4BF,CAAW,IAAI,eAAY,QACrE,UAAAV,EAAA,CACH,GAGIa,IACJ,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAlB,KAAW,gBAAAe,EAAC,QAAA,EAAK,WAAU,2BAA0B,eAAY,QAAO;AAAA,IACxE,CAACf,KAAWG,KAAQC,MAAiB,WAAWU;AAAA,IAChDrB;AAAA,IACA,CAACO,KAAWG,KAAQC,MAAiB,SAASU;AAAA,EAAA,GACjD;AAGF,MAAI,UAAUP,KAASA,EAAM,SAAS,QAAW;AAC/C,UAAM,EAAE,MAAAY,GAAM,GAAGC,EAAA,IAAgBb;AACjC,6BACG,KAAA,EAAE,MAAAY,GAAY,WAAWP,GAAU,GAAGQ,GACpC,UAAAJ,GACH;AAAA,EAEJ;AAEA,QAAM,EAAE,UAAAK,GAAU,GAAGC,EAAA,IAAgBf;AAErC,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAH8CM,KAAY;AAAA,MAI1D,WAAWT;AAAA,MACX,aAAWZ,IAAU,SAAS;AAAA,MAC9B,UAAUA,KAAWsB,EAAY;AAAA,MAChC,GAAGA;AAAA,MAEH,UAAAN;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asterui",
-  "version": "0.12.3",
+  "version": "0.12.5",
   "description": "React UI component library with DaisyUI",
   "homepage": "https://asterui.com",
   "repository": {