asterui 0.12.44 → 0.12.45

package/dist/components/Message.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+export interface MessageConfig {
+    duration?: number;
+    key?: string;
+    icon?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+    onClick?: () => void;
+    onClose?: () => void;
+}
+export declare class MessageManager {
+    success(content: React.ReactNode, config?: MessageConfig): string;
+    error(content: React.ReactNode, config?: MessageConfig): string;
+    info(content: React.ReactNode, config?: MessageConfig): string;
+    warning(content: React.ReactNode, config?: MessageConfig): string;
+    loading(content: React.ReactNode, config?: MessageConfig): string;
+    destroy(id?: string): void;
+}
+export declare const message: MessageManager;

package/dist/components/Message.js

@@ -0,0 +1,56 @@
+import { jsx as s } from "react/jsx-runtime";
+import { notification as a } from "./Notification.js";
+class r {
+  success(e, n) {
+    return a.open({
+      message: e,
+      type: "success",
+      variant: "compact",
+      ...n
+    });
+  }
+  error(e, n) {
+    return a.open({
+      message: e,
+      type: "error",
+      variant: "compact",
+      ...n
+    });
+  }
+  info(e, n) {
+    return a.open({
+      message: e,
+      type: "info",
+      variant: "compact",
+      ...n
+    });
+  }
+  warning(e, n) {
+    return a.open({
+      message: e,
+      type: "warning",
+      variant: "compact",
+      ...n
+    });
+  }
+  loading(e, n) {
+    const o = /* @__PURE__ */ s("span", { className: "loading loading-spinner loading-sm" });
+    return a.open({
+      message: e,
+      type: "info",
+      variant: "compact",
+      duration: 0,
+      icon: o,
+      ...n
+    });
+  }
+  destroy(e) {
+    e ? a.close(e) : a.destroy();
+  }
+}
+const p = new r();
+export {
+  r as MessageManager,
+  p as message
+};
+//# sourceMappingURL=Message.js.map

package/dist/components/Message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.js","sources":["../../src/components/Message.tsx"],"sourcesContent":["import React from 'react'\nimport { notification } from './Notification'\n\nexport interface MessageConfig {\n  duration?: number\n  key?: string\n  icon?: React.ReactNode\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n  onClick?: () => void\n  onClose?: () => void\n}\n\nexport class MessageManager {\n  success(content: React.ReactNode, config?: MessageConfig) {\n    return notification.open({\n      message: content,\n      type: 'success',\n      variant: 'compact',\n      ...config,\n    })\n  }\n\n  error(content: React.ReactNode, config?: MessageConfig) {\n    return notification.open({\n      message: content,\n      type: 'error',\n      variant: 'compact',\n      ...config,\n    })\n  }\n\n  info(content: React.ReactNode, config?: MessageConfig) {\n    return notification.open({\n      message: content,\n      type: 'info',\n      variant: 'compact',\n      ...config,\n    })\n  }\n\n  warning(content: React.ReactNode, config?: MessageConfig) {\n    return notification.open({\n      message: content,\n      type: 'warning',\n      variant: 'compact',\n      ...config,\n    })\n  }\n\n  loading(content: React.ReactNode, config?: MessageConfig) {\n    const loadingIcon = (\n      <span className=\"loading loading-spinner loading-sm\" />\n    )\n    return notification.open({\n      message: content,\n      type: 'info',\n      variant: 'compact',\n      duration: 0,\n      icon: loadingIcon,\n      ...config,\n    })\n  }\n\n  destroy(id?: string) {\n    if (id) {\n      notification.close(id)\n    } else {\n      notification.destroy()\n    }\n  }\n}\n\nexport const message = new MessageManager()\n"],"names":["MessageManager","content","config","notification","loadingIcon","jsx","id","message"],"mappings":";;AAcO,MAAMA,EAAe;AAAA,EAC1B,QAAQC,GAA0BC,GAAwB;AACxD,WAAOC,EAAa,KAAK;AAAA,MACvB,SAASF;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,GAAGC;AAAA,IAAA,CACJ;AAAA,EACH;AAAA,EAEA,MAAMD,GAA0BC,GAAwB;AACtD,WAAOC,EAAa,KAAK;AAAA,MACvB,SAASF;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,GAAGC;AAAA,IAAA,CACJ;AAAA,EACH;AAAA,EAEA,KAAKD,GAA0BC,GAAwB;AACrD,WAAOC,EAAa,KAAK;AAAA,MACvB,SAASF;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,GAAGC;AAAA,IAAA,CACJ;AAAA,EACH;AAAA,EAEA,QAAQD,GAA0BC,GAAwB;AACxD,WAAOC,EAAa,KAAK;AAAA,MACvB,SAASF;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,GAAGC;AAAA,IAAA,CACJ;AAAA,EACH;AAAA,EAEA,QAAQD,GAA0BC,GAAwB;AACxD,UAAME,IACJ,gBAAAC,EAAC,QAAA,EAAK,WAAU,qCAAA,CAAqC;AAEvD,WAAOF,EAAa,KAAK;AAAA,MACvB,SAASF;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,MAAMG;AAAA,MACN,GAAGF;AAAA,IAAA,CACJ;AAAA,EACH;AAAA,EAEA,QAAQI,GAAa;AACnB,IAAIA,IACFH,EAAa,MAAMG,CAAE,IAErBH,EAAa,QAAA;AAAA,EAEjB;AACF;AAEO,MAAMI,IAAU,IAAIP,EAAA;"}

package/dist/components/Notification.d.ts

@@ -1,13 +1,20 @@
 import { default as React } from 'react';
 export type NotificationType = 'success' | 'info' | 'warning' | 'error';
-export type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+export type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'topCenter' | 'bottomCenter';
+export type NotificationVariant = 'default' | 'compact';
 export interface NotificationConfig {
     message: React.ReactNode;
     description?: React.ReactNode;
     type?: NotificationType;
     duration?: number;
     placement?: NotificationPlacement;
+    variant?: NotificationVariant;
     closable?: boolean;
+    icon?: React.ReactNode;
+    key?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
     onClick?: () => void;
     onClose?: () => void;
 }

package/dist/components/Notification.js

@@ -1,115 +1,139 @@
-import { jsx as i, Fragment as h, jsxs as l } from "react/jsx-runtime";
-import { useState as u, useEffect as p } from "react";
-import d from "react-dom/client";
+import { jsx as s, Fragment as d, jsxs as c } from "react/jsx-runtime";
+import { useState as h, useEffect as p } from "react";
+import u from "react-dom/client";
 class m {
   notifications = [];
   listeners = [];
   container = null;
   root = null;
   idCounter = 0;
-  subscribe(t) {
-    return this.listeners.push(t), () => {
-      this.listeners = this.listeners.filter((o) => o !== t);
+  subscribe(e) {
+    return this.listeners.push(e), () => {
+      this.listeners = this.listeners.filter((o) => o !== e);
     };
   }
   getNotifications() {
     return this.notifications;
   }
   emit() {
-    this.listeners.forEach((t) => t());
+    this.listeners.forEach((e) => e());
   }
   ensureContainer() {
-    this.container || (this.container = document.createElement("div"), document.body.appendChild(this.container), this.root = d.createRoot(this.container), this.root.render(/* @__PURE__ */ i(f, { manager: this })));
+    this.container || (this.container = document.createElement("div"), document.body.appendChild(this.container), this.root = u.createRoot(this.container), this.root.render(/* @__PURE__ */ s(v, { manager: this })));
   }
-  open(t) {
+  open(e) {
     this.ensureContainer();
-    const o = `notification-${++this.idCounter}`, s = {
-      ...t,
+    const o = e.key ?? `notification-${++this.idCounter}`, r = e.variant === "compact", a = {
+      ...e,
       id: o,
       createdAt: Date.now(),
-      duration: t.duration ?? 4.5,
-      placement: t.placement ?? "topRight",
-      closable: t.closable ?? !0,
-      type: t.type ?? "info"
-    };
-    return this.notifications.push(s), this.emit(), s.duration && s.duration > 0 && setTimeout(() => {
+      duration: e.duration ?? (r ? 3 : 4.5),
+      placement: e.placement ?? (r ? "topCenter" : "topRight"),
+      variant: e.variant ?? "default",
+      closable: e.closable ?? !r,
+      type: e.type ?? "info"
+    }, n = this.notifications.findIndex((i) => i.id === o);
+    return n !== -1 ? this.notifications[n] = a : this.notifications.push(a), this.emit(), a.duration && a.duration > 0 && setTimeout(() => {
       this.close(o);
-    }, s.duration * 1e3), o;
+    }, a.duration * 1e3), o;
   }
-  close(t) {
-    const o = this.notifications.find((s) => s.id === t);
-    this.notifications = this.notifications.filter((s) => s.id !== t), this.emit(), o?.onClose && o.onClose();
+  close(e) {
+    const o = this.notifications.find((r) => r.id === e);
+    this.notifications = this.notifications.filter((r) => r.id !== e), this.emit(), o?.onClose && o.onClose();
   }
-  success(t) {
-    return this.open({ ...t, type: "success" });
+  success(e) {
+    return this.open({ ...e, type: "success" });
   }
-  error(t) {
-    return this.open({ ...t, type: "error" });
+  error(e) {
+    return this.open({ ...e, type: "error" });
   }
-  info(t) {
-    return this.open({ ...t, type: "info" });
+  info(e) {
+    return this.open({ ...e, type: "info" });
   }
-  warning(t) {
-    return this.open({ ...t, type: "warning" });
+  warning(e) {
+    return this.open({ ...e, type: "warning" });
   }
   destroy() {
     this.notifications = [], this.emit();
   }
 }
-function f({ manager: e }) {
-  const [, t] = u({});
-  p(() => e.subscribe(() => {
-    t({});
-  }), [e]);
-  const o = e.getNotifications(), s = {
+function v({ manager: t }) {
+  const [, e] = h({});
+  p(() => t.subscribe(() => {
+    e({});
+  }), [t]);
+  const o = t.getNotifications(), r = {
     topLeft: [],
     topRight: [],
+    topCenter: [],
     bottomLeft: [],
-    bottomRight: []
+    bottomRight: [],
+    bottomCenter: []
   };
   o.forEach((n) => {
-    s[n.placement].push(n);
+    r[n.placement].push(n);
   });
-  const r = {
+  const a = {
     topRight: "toast toast-top toast-end",
     topLeft: "toast toast-top toast-start",
+    topCenter: "toast toast-top toast-center",
     bottomRight: "toast toast-bottom toast-end",
-    bottomLeft: "toast toast-bottom toast-start"
+    bottomLeft: "toast toast-bottom toast-start",
+    bottomCenter: "toast toast-bottom toast-center"
   };
-  return /* @__PURE__ */ i(h, { children: Object.entries(s).map(([n, c]) => c.length === 0 ? null : /* @__PURE__ */ i("div", { className: r[n], children: c.map((a) => /* @__PURE__ */ i(
-    b,
+  return /* @__PURE__ */ s(d, { children: Object.entries(r).map(([n, i]) => i.length === 0 ? null : /* @__PURE__ */ s("div", { className: a[n], children: i.map((l) => /* @__PURE__ */ s(
+    w,
     {
-      notification: a,
-      onClose: () => e.close(a.id)
+      notification: l,
+      onClose: () => t.close(l.id)
     },
-    a.id
+    l.id
   )) }, n)) });
 }
-function b({ notification: e, onClose: t }) {
-  const o = {
+function w({ notification: t, onClose: e }) {
+  const o = t.variant === "compact", r = {
     success: "alert-success",
     error: "alert-error",
     info: "alert-info",
     warning: "alert-warning"
-  }, s = () => {
-    e.onClick && e.onClick();
-  };
-  return /* @__PURE__ */ l(
+  }, a = {
+    success: /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ s("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }) }),
+    error: /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ s("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }) }),
+    info: /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ s("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }),
+    warning: /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ s("path", { fillRule: "evenodd", d: "M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z", clipRule: "evenodd" }) })
+  }, n = () => {
+    t.onClick && t.onClick();
+  }, i = t.icon ?? a[t.type];
+  return o ? /* @__PURE__ */ s(
+    "div",
+    {
+      className: `alert ${r[t.type]} shadow-md py-2 px-4 cursor-pointer${t.className ? ` ${t.className}` : ""}`,
+      style: t.style,
+      "data-testid": t["data-testid"],
+      onClick: n,
+      children: /* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
+        i,
+        /* @__PURE__ */ s("span", { children: t.message })
+      ] })
+    }
+  ) : /* @__PURE__ */ c(
     "div",
     {
-      className: `alert ${o[e.type]} shadow-lg cursor-pointer min-w-[300px] max-w-[400px] relative`,
-      onClick: s,
+      className: `alert ${r[t.type]} shadow-lg cursor-pointer min-w-[300px] max-w-[400px] relative${t.className ? ` ${t.className}` : ""}`,
+      style: t.style,
+      "data-testid": t["data-testid"],
+      onClick: n,
       children: [
-        /* @__PURE__ */ l("div", { className: e.closable ? "pr-8" : "", children: [
-          e.message && /* @__PURE__ */ i("div", { className: "font-bold", children: e.message }),
-          e.description && /* @__PURE__ */ i("div", { className: "text-sm", children: e.description })
+        /* @__PURE__ */ c("div", { className: t.closable ? "pr-8" : "", children: [
+          t.message && /* @__PURE__ */ s("div", { className: "font-bold", children: t.message }),
+          t.description && /* @__PURE__ */ s("div", { className: "text-sm", children: t.description })
         ] }),
-        e.closable && /* @__PURE__ */ i(
+        t.closable && /* @__PURE__ */ s(
           "button",
           {
             className: "btn btn-xs btn-ghost btn-circle absolute top-2 right-2",
-            onClick: (r) => {
-              r.stopPropagation(), t();
+            onClick: (l) => {
+              l.stopPropagation(), e();
             },
             children: "✕"
           }
@@ -118,8 +142,8 @@ function b({ notification: e, onClose: t }) {
     }
   );
 }
-const y = new m();
+const C = new m();
 export {
-  y as notification
+  C as notification
 };
 //# sourceMappingURL=Notification.js.map

package/dist/components/Notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"Notification.js","sources":["../../src/components/Notification.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom/client'\n\nexport type NotificationType = 'success' | 'info' | 'warning' | 'error'\nexport type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight'\n\nexport interface NotificationConfig {\n  message: React.ReactNode\n  description?: React.ReactNode\n  type?: NotificationType\n  duration?: number // in seconds, 0 = no auto close\n  placement?: NotificationPlacement\n  closable?: boolean\n  onClick?: () => void\n  onClose?: () => void\n}\n\ninterface NotificationItem extends NotificationConfig {\n  id: string\n  createdAt: number\n}\n\ntype Listener = () => void\n\nclass NotificationManager {\n  private notifications: NotificationItem[] = []\n  private listeners: Listener[] = []\n  private container: HTMLDivElement | null = null\n  private root: ReactDOM.Root | null = null\n  private idCounter = 0\n\n  subscribe(listener: Listener) {\n    this.listeners.push(listener)\n    return () => {\n      this.listeners = this.listeners.filter((l) => l !== listener)\n    }\n  }\n\n  getNotifications() {\n    return this.notifications\n  }\n\n  private emit() {\n    this.listeners.forEach((listener) => listener())\n  }\n\n  private ensureContainer() {\n    if (!this.container) {\n      this.container = document.createElement('div')\n      document.body.appendChild(this.container)\n      this.root = ReactDOM.createRoot(this.container)\n      this.root.render(<NotificationContainer manager={this} />)\n    }\n  }\n\n  open(config: NotificationConfig) {\n    this.ensureContainer()\n\n    const id = `notification-${++this.idCounter}`\n    const notification: NotificationItem = {\n      ...config,\n      id,\n      createdAt: Date.now(),\n      duration: config.duration ?? 4.5,\n      placement: config.placement ?? 'topRight',\n      closable: config.closable ?? true,\n      type: config.type ?? 'info',\n    }\n\n    this.notifications.push(notification)\n    this.emit()\n\n    // Auto-dismiss\n    if (notification.duration && notification.duration > 0) {\n      setTimeout(() => {\n        this.close(id)\n      }, notification.duration * 1000)\n    }\n\n    return id\n  }\n\n  close(id: string) {\n    const notification = this.notifications.find((n) => n.id === id)\n    this.notifications = this.notifications.filter((n) => n.id !== id)\n    this.emit()\n\n    if (notification?.onClose) {\n      notification.onClose()\n    }\n  }\n\n  success(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'success' })\n  }\n\n  error(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'error' })\n  }\n\n  info(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'info' })\n  }\n\n  warning(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'warning' })\n  }\n\n  destroy() {\n    this.notifications = []\n    this.emit()\n  }\n}\n\ninterface NotificationContainerProps {\n  manager: NotificationManager\n}\n\nfunction NotificationContainer({ manager }: NotificationContainerProps) {\n  const [, forceUpdate] = useState({})\n\n  useEffect(() => {\n    const unsubscribe = manager.subscribe(() => {\n      forceUpdate({})\n    })\n    return unsubscribe\n  }, [manager])\n\n  const notifications = manager.getNotifications()\n\n  // Group by placement\n  const grouped: Record<NotificationPlacement, NotificationItem[]> = {\n    topLeft: [],\n    topRight: [],\n    bottomLeft: [],\n    bottomRight: [],\n  }\n\n  notifications.forEach((notification) => {\n    grouped[notification.placement!].push(notification)\n  })\n\n  const placementClasses: Record<NotificationPlacement, string> = {\n    topRight: 'toast toast-top toast-end',\n    topLeft: 'toast toast-top toast-start',\n    bottomRight: 'toast toast-bottom toast-end',\n    bottomLeft: 'toast toast-bottom toast-start',\n  }\n\n  return (\n    <>\n      {Object.entries(grouped).map(([placement, items]) => {\n        if (items.length === 0) return null\n\n        return (\n          <div key={placement} className={placementClasses[placement as NotificationPlacement]}>\n            {items.map((notification) => (\n              <NotificationItem\n                key={notification.id}\n                notification={notification}\n                onClose={() => manager.close(notification.id)}\n              />\n            ))}\n          </div>\n        )\n      })}\n    </>\n  )\n}\n\ninterface NotificationItemProps {\n  notification: NotificationItem\n  onClose: () => void\n}\n\nfunction NotificationItem({ notification, onClose }: NotificationItemProps) {\n  const alertTypeClasses: Record<NotificationType, string> = {\n    success: 'alert-success',\n    error: 'alert-error',\n    info: 'alert-info',\n    warning: 'alert-warning',\n  }\n\n  const handleClick = () => {\n    if (notification.onClick) {\n      notification.onClick()\n    }\n  }\n\n  return (\n    <div\n      className={`alert ${alertTypeClasses[notification.type!]} shadow-lg cursor-pointer min-w-[300px] max-w-[400px] relative`}\n      onClick={handleClick}\n    >\n      <div className={notification.closable ? 'pr-8' : ''}>\n        {notification.message && <div className=\"font-bold\">{notification.message}</div>}\n        {notification.description && <div className=\"text-sm\">{notification.description}</div>}\n      </div>\n      {notification.closable && (\n        <button\n          className=\"btn btn-xs btn-ghost btn-circle absolute top-2 right-2\"\n          onClick={(e) => {\n            e.stopPropagation()\n            onClose()\n          }}\n        >\n          ✕\n        </button>\n      )}\n    </div>\n  )\n}\n\nexport const notification = new NotificationManager()\n"],"names":["NotificationManager","listener","l","ReactDOM","jsx","NotificationContainer","config","id","notification","n","manager","forceUpdate","useState","useEffect","notifications","grouped","placementClasses","Fragment","placement","items","NotificationItem","onClose","alertTypeClasses","handleClick","jsxs","e"],"mappings":"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"}
+{"version":3,"file":"Notification.js","sources":["../../src/components/Notification.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom/client'\n\nexport type NotificationType = 'success' | 'info' | 'warning' | 'error'\nexport type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'topCenter' | 'bottomCenter'\nexport type NotificationVariant = 'default' | 'compact'\n\nexport interface NotificationConfig {\n  message: React.ReactNode\n  description?: React.ReactNode\n  type?: NotificationType\n  duration?: number // in seconds, 0 = no auto close\n  placement?: NotificationPlacement\n  variant?: NotificationVariant\n  closable?: boolean\n  icon?: React.ReactNode\n  key?: string\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n  onClick?: () => void\n  onClose?: () => void\n}\n\ninterface NotificationItem extends NotificationConfig {\n  id: string\n  createdAt: number\n}\n\ntype Listener = () => void\n\nclass NotificationManager {\n  private notifications: NotificationItem[] = []\n  private listeners: Listener[] = []\n  private container: HTMLDivElement | null = null\n  private root: ReactDOM.Root | null = null\n  private idCounter = 0\n\n  subscribe(listener: Listener) {\n    this.listeners.push(listener)\n    return () => {\n      this.listeners = this.listeners.filter((l) => l !== listener)\n    }\n  }\n\n  getNotifications() {\n    return this.notifications\n  }\n\n  private emit() {\n    this.listeners.forEach((listener) => listener())\n  }\n\n  private ensureContainer() {\n    if (!this.container) {\n      this.container = document.createElement('div')\n      document.body.appendChild(this.container)\n      this.root = ReactDOM.createRoot(this.container)\n      this.root.render(<NotificationContainer manager={this} />)\n    }\n  }\n\n  open(config: NotificationConfig) {\n    this.ensureContainer()\n\n    const id = config.key ?? `notification-${++this.idCounter}`\n    const isCompact = config.variant === 'compact'\n    const notificationItem: NotificationItem = {\n      ...config,\n      id,\n      createdAt: Date.now(),\n      duration: config.duration ?? (isCompact ? 3 : 4.5),\n      placement: config.placement ?? (isCompact ? 'topCenter' : 'topRight'),\n      variant: config.variant ?? 'default',\n      closable: config.closable ?? !isCompact,\n      type: config.type ?? 'info',\n    }\n\n    // If key exists, update the existing notification\n    const existingIndex = this.notifications.findIndex((n) => n.id === id)\n    if (existingIndex !== -1) {\n      this.notifications[existingIndex] = notificationItem\n    } else {\n      this.notifications.push(notificationItem)\n    }\n    this.emit()\n\n    // Auto-dismiss\n    if (notificationItem.duration && notificationItem.duration > 0) {\n      setTimeout(() => {\n        this.close(id)\n      }, notificationItem.duration * 1000)\n    }\n\n    return id\n  }\n\n  close(id: string) {\n    const notification = this.notifications.find((n) => n.id === id)\n    this.notifications = this.notifications.filter((n) => n.id !== id)\n    this.emit()\n\n    if (notification?.onClose) {\n      notification.onClose()\n    }\n  }\n\n  success(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'success' })\n  }\n\n  error(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'error' })\n  }\n\n  info(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'info' })\n  }\n\n  warning(config: Omit<NotificationConfig, 'type'>) {\n    return this.open({ ...config, type: 'warning' })\n  }\n\n  destroy() {\n    this.notifications = []\n    this.emit()\n  }\n}\n\ninterface NotificationContainerProps {\n  manager: NotificationManager\n}\n\nfunction NotificationContainer({ manager }: NotificationContainerProps) {\n  const [, forceUpdate] = useState({})\n\n  useEffect(() => {\n    const unsubscribe = manager.subscribe(() => {\n      forceUpdate({})\n    })\n    return unsubscribe\n  }, [manager])\n\n  const notifications = manager.getNotifications()\n\n  // Group by placement\n  const grouped: Record<NotificationPlacement, NotificationItem[]> = {\n    topLeft: [],\n    topRight: [],\n    topCenter: [],\n    bottomLeft: [],\n    bottomRight: [],\n    bottomCenter: [],\n  }\n\n  notifications.forEach((notification) => {\n    grouped[notification.placement!].push(notification)\n  })\n\n  const placementClasses: Record<NotificationPlacement, string> = {\n    topRight: 'toast toast-top toast-end',\n    topLeft: 'toast toast-top toast-start',\n    topCenter: 'toast toast-top toast-center',\n    bottomRight: 'toast toast-bottom toast-end',\n    bottomLeft: 'toast toast-bottom toast-start',\n    bottomCenter: 'toast toast-bottom toast-center',\n  }\n\n  return (\n    <>\n      {Object.entries(grouped).map(([placement, items]) => {\n        if (items.length === 0) return null\n\n        return (\n          <div key={placement} className={placementClasses[placement as NotificationPlacement]}>\n            {items.map((notification) => (\n              <NotificationItem\n                key={notification.id}\n                notification={notification}\n                onClose={() => manager.close(notification.id)}\n              />\n            ))}\n          </div>\n        )\n      })}\n    </>\n  )\n}\n\ninterface NotificationItemProps {\n  notification: NotificationItem\n  onClose: () => void\n}\n\nfunction NotificationItem({ notification, onClose }: NotificationItemProps) {\n  const isCompact = notification.variant === 'compact'\n\n  const alertTypeClasses: Record<NotificationType, string> = {\n    success: 'alert-success',\n    error: 'alert-error',\n    info: 'alert-info',\n    warning: 'alert-warning',\n  }\n\n  const typeIcons: Record<NotificationType, React.ReactNode> = {\n    success: <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fillRule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clipRule=\"evenodd\" /></svg>,\n    error: <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fillRule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z\" clipRule=\"evenodd\" /></svg>,\n    info: <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fillRule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z\" clipRule=\"evenodd\" /></svg>,\n    warning: <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fillRule=\"evenodd\" d=\"M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z\" clipRule=\"evenodd\" /></svg>,\n  }\n\n  const handleClick = () => {\n    if (notification.onClick) {\n      notification.onClick()\n    }\n  }\n\n  const icon = notification.icon ?? typeIcons[notification.type!]\n\n  if (isCompact) {\n    return (\n      <div\n        className={`alert ${alertTypeClasses[notification.type!]} shadow-md py-2 px-4 cursor-pointer${notification.className ? ` ${notification.className}` : ''}`}\n        style={notification.style}\n        data-testid={notification['data-testid']}\n        onClick={handleClick}\n      >\n        <div className=\"flex items-center gap-2\">\n          {icon}\n          <span>{notification.message}</span>\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div\n      className={`alert ${alertTypeClasses[notification.type!]} shadow-lg cursor-pointer min-w-[300px] max-w-[400px] relative${notification.className ? ` ${notification.className}` : ''}`}\n      style={notification.style}\n      data-testid={notification['data-testid']}\n      onClick={handleClick}\n    >\n      <div className={notification.closable ? 'pr-8' : ''}>\n        {notification.message && <div className=\"font-bold\">{notification.message}</div>}\n        {notification.description && <div className=\"text-sm\">{notification.description}</div>}\n      </div>\n      {notification.closable && (\n        <button\n          className=\"btn btn-xs btn-ghost btn-circle absolute top-2 right-2\"\n          onClick={(e) => {\n            e.stopPropagation()\n            onClose()\n          }}\n        >\n          ✕\n        </button>\n      )}\n    </div>\n  )\n}\n\nexport const notification = new NotificationManager()\n"],"names":["NotificationManager","listener","l","ReactDOM","jsx","NotificationContainer","config","id","isCompact","notificationItem","existingIndex","n","notification","manager","forceUpdate","useState","useEffect","notifications","grouped","placementClasses","Fragment","placement","items","NotificationItem","onClose","alertTypeClasses","typeIcons","handleClick","icon","jsxs","e"],"mappings":"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"}

package/dist/components/Tour.d.ts

@@ -1,5 +1,17 @@
 import { default as React } from 'react';
 export type TourPlacement = 'top' | 'topLeft' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom' | 'center';
+export type TourType = 'default' | 'primary';
+export interface TourArrowConfig {
+    pointAtCenter?: boolean;
+}
+export interface TourMaskConfig {
+    style?: React.CSSProperties;
+    color?: string;
+}
+export interface TourButtonProps {
+    children?: React.ReactNode;
+    onClick?: () => void;
+}
 export interface TourStepProps {
     /** Target element ref or function returning element */
     target?: React.RefObject<HTMLElement | null> | (() => HTMLElement | null) | null;
@@ -11,14 +23,43 @@ export interface TourStepProps {
     cover?: React.ReactNode;
     /** Placement of popover relative to target */
     placement?: TourPlacement;
+    /** Whether to show arrow (overrides Tour setting) */
+    arrow?: boolean | TourArrowConfig;
+    /** Custom close icon for this step */
+    closeIcon?: React.ReactNode;
+    /** Show mask overlay (overrides Tour setting) */
+    mask?: boolean | TourMaskConfig;
+    /** Type affects styling (overrides Tour setting) */
+    type?: TourType;
+    /** Scroll into view options (overrides Tour setting) */
+    scrollIntoViewOptions?: boolean | ScrollIntoViewOptions;
+    /** Next button props */
+    nextButtonProps?: TourButtonProps;
+    /** Previous button props */
+    prevButtonProps?: TourButtonProps;
     /** Custom class for this step's popover */
     className?: string;
+    /** Custom style for this step's popover */
+    style?: React.CSSProperties;
     /** Called when this step becomes active */
-    onOpen?: () => void;
-    /** Called when leaving this step */
     onClose?: () => void;
 }
-export interface TourProps {
+export type TourSemanticName = 'root' | 'mask' | 'popover' | 'header' | 'content' | 'footer' | 'indicator' | 'close';
+export interface TourActionInfo {
+    current: number;
+    total: number;
+}
+export interface TourRef {
+    /** Go to a specific step */
+    goTo: (step: number) => void;
+    /** Go to the next step */
+    next: () => void;
+    /** Go to the previous step */
+    prev: () => void;
+    /** Close the tour */
+    close: () => void;
+}
+export interface TourProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /** Whether tour is visible */
     open?: boolean;
     /** Callback when tour closes */
@@ -31,12 +72,21 @@ export interface TourProps {
     current?: number;
     /** Callback when step changes */
     onChange?: (current: number) => void;
+    /** Whether to show arrow on popover */
+    arrow?: boolean | TourArrowConfig;
+    /** Custom close icon */
+    closeIcon?: React.ReactNode;
     /** Show mask overlay */
-    mask?: boolean;
+    mask?: boolean | TourMaskConfig;
+    /** Disable interaction on highlighted area */
+    disabledInteraction?: boolean;
     /** Type affects styling */
-    type?: 'default' | 'primary';
-    /** Gap between highlight and target [radius, offset] or single number */
-    gap?: number | [number, number];
+    type?: TourType;
+    /** Gap between highlight and target */
+    gap?: {
+        offset?: number | [number, number];
+        radius?: number;
+    };
     /** Text for prev button */
     prevButtonText?: React.ReactNode;
     /** Text for next button */
@@ -54,8 +104,20 @@ export interface TourProps {
     /** Close on escape key */
     closeOnEscape?: boolean;
     /** Scroll target into view */
-    scrollIntoView?: boolean;
+    scrollIntoViewOptions?: boolean | ScrollIntoViewOptions;
     /** Z-index for tour overlay */
     zIndex?: number;
+    /** Custom indicator renderer */
+    indicatorsRender?: (current: number, total: number) => React.ReactNode;
+    /** Custom action buttons renderer */
+    actionsRender?: (originNode: React.ReactNode, info: TourActionInfo) => React.ReactNode;
+    /** Rendering container for tour */
+    getPopupContainer?: (node: HTMLElement) => HTMLElement;
+    /** Semantic class names */
+    classNames?: Partial<Record<TourSemanticName, string>>;
+    /** Semantic styles */
+    styles?: Partial<Record<TourSemanticName, React.CSSProperties>>;
+    /** Test ID for testing */
+    'data-testid'?: string;
 }
-export declare const Tour: React.FC<TourProps>;
+export declare const Tour: React.ForwardRefExoticComponent<TourProps & React.RefAttributes<TourRef>>;