@windrun-huaiin/third-ui 29.2.1 → 30.0.0

package/dist/fuma/server/features/widgets.mjs

@@ -9,6 +9,7 @@ import '@windrun-huaiin/base-ui/lib';
 import '@windrun-huaiin/lib/utils';
 import { ZiaFolder, ZiaFile } from '../../mdx/zia-file.mjs';
 import { SunoEmbed } from '../../mdx/suno-embed.mjs';
+import { CheetTable } from '../../mdx/cheet-table.mjs';
 
 const ImageGrid = lazy(() => import('../../heavy/image-grid.mjs').then((mod) => ({ default: mod.ImageGrid })));
 const ImageZoom = lazy(() => import('../../heavy/image-zoom.mjs').then((mod) => ({ default: mod.ImageZoom })));
@@ -20,6 +21,7 @@ function createWidgetMdxComponents(cdnBaseUrl, imageFallbackSrc) {
         ZiaFile,
         ZiaFolder,
         SunoEmbed,
+        CheetTable,
         ImageGrid: (props) => (jsx(ImageGrid, Object.assign({}, props, { cdnBaseUrl: cdnBaseUrl }))),
         ImageZoom: (props) => (jsx(ImageZoom, Object.assign({}, props, { fallbackSrc: imageFallbackSrc }))),
     };

package/dist/lib/fuma-schema-check-util.d.ts

@@ -1,5 +1,5 @@
 import { z, ZodObject } from 'zod';
-export declare const createDateSchema: () => z.ZodPipe<z.ZodTransform<any, any>, z.ZodString>;
+export declare const createDateSchema: () => z.ZodPreprocess<z.ZodString>;
 export declare const createCommonDocsSchema: () => ZodObject<any>;
 export declare const createCommonMetaSchema: () => ZodObject<any>;
 export declare const remarkInstallOptions: {

package/dist/main/alert-dialog/confirm-dialog.js

@@ -37,7 +37,7 @@ function ConfirmDialog({ open, onOpenChange, type = 'normal', title, description
     const handleClose = () => {
         onOpenChange(false);
     };
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn(dialogStyles.dialogContentClass, typeClass.content), overlayClassName: dialogStyles.dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: dialogStyles.dialogTitleClass, children: [jsxRuntime.jsx("span", { className: utils.cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsxRuntime.jsx(Icon, { className: utils.cn('size-5', typeClass.icon) }) }), jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: title })] }) }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx(ui.AlertDialogDescription, { className: dialogStyles.dialogDescriptionClass, children: description }), jsxRuntime.jsxs("div", { className: dialogStyles.dialogFooterClass, children: [jsxRuntime.jsx(ui.AlertDialogCancel, { className: cancelButtonClass, onClick: handleCancel, children: cancelText }), jsxRuntime.jsx(ui.AlertDialogAction, { className: confirmButtonClass, onClick: () => {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn(dialogStyles.dialogContentClass, typeClass.content), overlayClassName: dialogStyles.dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: dialogStyles.dialogTitleClass, children: [jsxRuntime.jsx("span", { className: utils.cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsxRuntime.jsx(Icon, { className: utils.cn('size-5', typeClass.icon) }) }), jsxRuntime.jsx("span", { className: dialogStyles.dialogTitleTextClass, children: title })] }) }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx(ui.AlertDialogDescription, { className: dialogStyles.dialogDescriptionClass, children: description }), jsxRuntime.jsxs("div", { className: dialogStyles.dialogFooterClass, children: [jsxRuntime.jsx(ui.AlertDialogCancel, { className: cancelButtonClass, onClick: handleCancel, children: cancelText }), jsxRuntime.jsx(ui.AlertDialogAction, { className: confirmButtonClass, onClick: () => {
                                         void runDialogAction('confirm', onConfirm);
                                     }, children: confirmText })] })] }) }), dialogLoading] }));
 }

package/dist/main/alert-dialog/confirm-dialog.mjs

@@ -4,7 +4,7 @@ import { CircleAlertIcon, CircleQuestionMarkIcon, XIcon } from '@windrun-huaiin/
 import { themeBgColor, themeIconColor } from '@windrun-huaiin/base-ui/lib';
 import { AlertDialog, AlertDialogContent, AlertDialogTitle, AlertDialogDescription, AlertDialogCancel, AlertDialogAction } from '@windrun-huaiin/base-ui/ui';
 import { cn } from '@windrun-huaiin/lib/utils';
-import { dangerButtonClass, primaryButtonClass, secondaryButtonClass, dialogThemedOverlayClass, dialogHeaderClass, dialogTitleClass, closeButtonClass, dialogDescriptionClass, dialogFooterClass, dialogContentClass } from './dialog-styles.mjs';
+import { dangerButtonClass, primaryButtonClass, secondaryButtonClass, dialogThemedOverlayClass, dialogHeaderClass, dialogTitleClass, dialogTitleTextClass, closeButtonClass, dialogDescriptionClass, dialogFooterClass, dialogContentClass } from './dialog-styles.mjs';
 import { useDialogLoadingAction } from './dialog-loading-action.mjs';
 
 const confirmTypeClassMap = {
@@ -35,7 +35,7 @@ function ConfirmDialog({ open, onOpenChange, type = 'normal', title, description
     const handleClose = () => {
         onOpenChange(false);
     };
-    return (jsxs(Fragment, { children: [jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxs(AlertDialogContent, { className: cn(dialogContentClass, typeClass.content), overlayClassName: dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxs("div", { className: dialogHeaderClass, children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: dialogTitleClass, children: [jsx("span", { className: cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsx(Icon, { className: cn('size-5', typeClass.icon) }) }), jsx("span", { className: "min-w-0 truncate", children: title })] }) }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsx(XIcon, { className: "size-4" }) })] }), jsx(AlertDialogDescription, { className: dialogDescriptionClass, children: description }), jsxs("div", { className: dialogFooterClass, children: [jsx(AlertDialogCancel, { className: cancelButtonClass, onClick: handleCancel, children: cancelText }), jsx(AlertDialogAction, { className: confirmButtonClass, onClick: () => {
+    return (jsxs(Fragment, { children: [jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxs(AlertDialogContent, { className: cn(dialogContentClass, typeClass.content), overlayClassName: dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxs("div", { className: dialogHeaderClass, children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: dialogTitleClass, children: [jsx("span", { className: cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsx(Icon, { className: cn('size-5', typeClass.icon) }) }), jsx("span", { className: dialogTitleTextClass, children: title })] }) }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsx(XIcon, { className: "size-4" }) })] }), jsx(AlertDialogDescription, { className: dialogDescriptionClass, children: description }), jsxs("div", { className: dialogFooterClass, children: [jsx(AlertDialogCancel, { className: cancelButtonClass, onClick: handleCancel, children: cancelText }), jsx(AlertDialogAction, { className: confirmButtonClass, onClick: () => {
                                         void runDialogAction('confirm', onConfirm);
                                     }, children: confirmText })] })] }) }), dialogLoading] }));
 }

package/dist/main/alert-dialog/dialog-loading-action.js

@@ -6,6 +6,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactDom = require('react-dom');
 var loading = require('../loading.js');
+var dialogStyles = require('./dialog-styles.js');
 
 function useDialogLoadingAction({ loadingActions, loadingFullPage = false, onOpenChange, }) {
     const [mounted, setMounted] = React.useState(false);
@@ -14,15 +15,17 @@ function useDialogLoadingAction({ loadingActions, loadingFullPage = false, onOpe
         setMounted(true);
     }, []);
     const runDialogAction = React.useCallback((action, handler) => tslib.__awaiter(this, void 0, void 0, function* () {
-        onOpenChange(false);
         if (!handler) {
+            onOpenChange(false);
             return;
         }
         if (!(loadingActions === null || loadingActions === void 0 ? void 0 : loadingActions.includes(action))) {
+            onOpenChange(false);
             yield handler();
             return;
         }
         setLoading(true);
+        onOpenChange(false);
         try {
             yield handler();
         }
@@ -31,7 +34,7 @@ function useDialogLoadingAction({ loadingActions, loadingFullPage = false, onOpe
         }
     }), [loadingActions, onOpenChange]);
     const dialogLoading = mounted && loading$1
-        ? reactDom.createPortal(loadingFullPage ? (jsxRuntime.jsx("div", { className: "fixed inset-0 z-10000", children: jsxRuntime.jsx(loading.Loading, { className: "h-full w-full" }) })) : (jsxRuntime.jsx("div", { className: "pointer-events-none fixed inset-0 z-10000 flex items-center justify-center p-4", children: jsxRuntime.jsx("div", { className: "pointer-events-auto overflow-hidden rounded-[28px] bg-neutral-50/58 shadow-[0_18px_56px_rgba(15,23,42,0.14)] backdrop-blur-md dark:bg-neutral-900/58 dark:shadow-[0_18px_56px_rgba(0,0,0,0.34)]", children: jsxRuntime.jsx(loading.Loading, { compact: true, label: "Loading", className: "min-h-[250px] w-[min(22rem,calc(100vw-2rem))] bg-transparent", labelClassName: "text-foreground" }) }) })), document.body)
+        ? reactDom.createPortal(loadingFullPage ? (jsxRuntime.jsx("div", { className: "fixed inset-0 z-10000", children: jsxRuntime.jsx(loading.Loading, { className: "h-full w-full" }) })) : (jsxRuntime.jsx("div", { className: "fixed inset-0 z-10000", children: jsxRuntime.jsx("div", { className: dialogStyles.dialogLoadingContentClass, children: jsxRuntime.jsx(loading.Loading, { compact: true, label: "Loading", className: "min-h-[220px] w-fit max-w-full rounded-none bg-transparent px-0 py-0 dark:bg-transparent", labelClassName: "text-foreground" }) }) })), document.body)
         : null;
     return {
         dialogLoading,

package/dist/main/alert-dialog/dialog-loading-action.mjs

@@ -4,6 +4,7 @@ import { jsx } from 'react/jsx-runtime';
 import React__default from 'react';
 import { createPortal } from 'react-dom';
 import { Loading } from '../loading.mjs';
+import { dialogLoadingContentClass } from './dialog-styles.mjs';
 
 function useDialogLoadingAction({ loadingActions, loadingFullPage = false, onOpenChange, }) {
     const [mounted, setMounted] = React__default.useState(false);
@@ -12,15 +13,17 @@ function useDialogLoadingAction({ loadingActions, loadingFullPage = false, onOpe
         setMounted(true);
     }, []);
     const runDialogAction = React__default.useCallback((action, handler) => __awaiter(this, void 0, void 0, function* () {
-        onOpenChange(false);
         if (!handler) {
+            onOpenChange(false);
             return;
         }
         if (!(loadingActions === null || loadingActions === void 0 ? void 0 : loadingActions.includes(action))) {
+            onOpenChange(false);
             yield handler();
             return;
         }
         setLoading(true);
+        onOpenChange(false);
         try {
             yield handler();
         }
@@ -29,7 +32,7 @@ function useDialogLoadingAction({ loadingActions, loadingFullPage = false, onOpe
         }
     }), [loadingActions, onOpenChange]);
     const dialogLoading = mounted && loading
-        ? createPortal(loadingFullPage ? (jsx("div", { className: "fixed inset-0 z-10000", children: jsx(Loading, { className: "h-full w-full" }) })) : (jsx("div", { className: "pointer-events-none fixed inset-0 z-10000 flex items-center justify-center p-4", children: jsx("div", { className: "pointer-events-auto overflow-hidden rounded-[28px] bg-neutral-50/58 shadow-[0_18px_56px_rgba(15,23,42,0.14)] backdrop-blur-md dark:bg-neutral-900/58 dark:shadow-[0_18px_56px_rgba(0,0,0,0.34)]", children: jsx(Loading, { compact: true, label: "Loading", className: "min-h-[250px] w-[min(22rem,calc(100vw-2rem))] bg-transparent", labelClassName: "text-foreground" }) }) })), document.body)
+        ? createPortal(loadingFullPage ? (jsx("div", { className: "fixed inset-0 z-10000", children: jsx(Loading, { className: "h-full w-full" }) })) : (jsx("div", { className: "fixed inset-0 z-10000", children: jsx("div", { className: dialogLoadingContentClass, children: jsx(Loading, { compact: true, label: "Loading", className: "min-h-[220px] w-fit max-w-full rounded-none bg-transparent px-0 py-0 dark:bg-transparent", labelClassName: "text-foreground" }) }) })), document.body)
         : null;
     return {
         dialogLoading,

package/dist/main/alert-dialog/dialog-styles.d.ts

@@ -1,9 +1,11 @@
 export declare const dialogSurfaceClass: string;
 export declare const dialogThemedOverlayClass: string;
 export declare const dialogContentClass: string;
+export declare const dialogLoadingContentClass: string;
 export declare const dialogHeaderClass = "flex items-start justify-between gap-4";
-export declare const dialogTitleClass = "flex min-w-0 items-center gap-2 text-lg font-bold leading-tight text-neutral-950 dark:text-neutral-50";
-export declare const dialogDescriptionClass = "mt-3 text-sm font-medium leading-relaxed text-neutral-600 dark:text-neutral-300";
+export declare const dialogTitleClass = "flex min-w-0 flex-1 items-center gap-2 text-lg font-bold leading-tight text-neutral-950 dark:text-neutral-50";
+export declare const dialogTitleTextClass = "min-w-0 flex-1 line-clamp-2 break-words";
+export declare const dialogDescriptionClass = "mt-3 break-words text-sm font-medium leading-relaxed text-neutral-600 dark:text-neutral-300";
 export declare const dialogFooterClass = "mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end";
 export declare const closeButtonClass = "inline-flex size-8 shrink-0 items-center justify-center rounded-full text-neutral-400 transition hover:bg-neutral-100 hover:text-neutral-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-400 dark:hover:bg-neutral-800 dark:hover:text-neutral-200";
 export declare const secondaryButtonClass = "inline-flex min-h-10 items-center justify-center rounded-full border border-neutral-300 bg-white px-5 py-2 text-sm font-semibold text-neutral-700 transition hover:bg-neutral-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-400 disabled:pointer-events-none disabled:opacity-60 dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-200 dark:hover:bg-neutral-800";

package/dist/main/alert-dialog/dialog-styles.js

@@ -4,12 +4,14 @@
 var lib = require('@windrun-huaiin/base-ui/lib');
 var utils = require('@windrun-huaiin/lib/utils');
 
-const dialogSurfaceClass = utils.cn('w-[calc(100vw-2rem)] max-w-md rounded-2xl border bg-white p-5 text-neutral-950 shadow-2xl outline-none dark:bg-neutral-950 dark:text-neutral-50', 'border-neutral-200 dark:border-neutral-800');
+const dialogSurfaceClass = utils.cn('min-h-[240px] w-[calc(100vw-2rem)] max-w-md rounded-2xl border bg-white p-5 text-neutral-950 shadow-2xl outline-none dark:bg-neutral-950 dark:text-neutral-50', 'border-neutral-200 dark:border-neutral-800');
 const dialogThemedOverlayClass = utils.cn(lib.themeMainBgColor, 'opacity-90 backdrop-blur-[2px] dark:opacity-85');
 const dialogContentClass = utils.cn('fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2', dialogSurfaceClass);
+const dialogLoadingContentClass = utils.cn('fixed left-1/2 top-1/2 z-10000 -translate-x-1/2 -translate-y-1/2', dialogSurfaceClass, 'flex items-center justify-center overflow-hidden animate-in fade-in-0 zoom-in-95 duration-150');
 const dialogHeaderClass = 'flex items-start justify-between gap-4';
-const dialogTitleClass = 'flex min-w-0 items-center gap-2 text-lg font-bold leading-tight text-neutral-950 dark:text-neutral-50';
-const dialogDescriptionClass = 'mt-3 text-sm font-medium leading-relaxed text-neutral-600 dark:text-neutral-300';
+const dialogTitleClass = 'flex min-w-0 flex-1 items-center gap-2 text-lg font-bold leading-tight text-neutral-950 dark:text-neutral-50';
+const dialogTitleTextClass = 'min-w-0 flex-1 line-clamp-2 break-words';
+const dialogDescriptionClass = 'mt-3 break-words text-sm font-medium leading-relaxed text-neutral-600 dark:text-neutral-300';
 const dialogFooterClass = 'mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end';
 const closeButtonClass = 'inline-flex size-8 shrink-0 items-center justify-center rounded-full text-neutral-400 transition hover:bg-neutral-100 hover:text-neutral-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-400 dark:hover:bg-neutral-800 dark:hover:text-neutral-200';
 const secondaryButtonClass = 'inline-flex min-h-10 items-center justify-center rounded-full border border-neutral-300 bg-white px-5 py-2 text-sm font-semibold text-neutral-700 transition hover:bg-neutral-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-400 disabled:pointer-events-none disabled:opacity-60 dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-200 dark:hover:bg-neutral-800';
@@ -17,7 +19,7 @@ const primaryButtonClass = utils.cn('inline-flex min-h-10 items-center justify-c
 const subtlePrimaryButtonClass = utils.cn('inline-flex min-h-10 items-center justify-center rounded-full border px-5 py-2 text-sm font-bold transition hover:brightness-95 focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-60', lib.themeBgColor, lib.themeBorderColor, lib.themeIconColor, lib.themeRingColor);
 const dangerButtonClass = 'inline-flex min-h-10 items-center justify-center rounded-full bg-red-600 px-5 py-2 text-sm font-bold text-white shadow-sm transition hover:bg-red-700 hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500 disabled:pointer-events-none disabled:opacity-60 dark:bg-red-600 dark:hover:bg-red-500';
 const highPriorityTitleClass = utils.cn('flex min-w-0 items-center gap-2 text-lg font-bold leading-tight', lib.themeIconColor);
-const highPrioritySurfaceClass = utils.cn(dialogSurfaceClass, 'backdrop-blur-md ring-4 animate-in zoom-in-95 duration-300', lib.themeBorderColor, lib.themeRingColor);
+const highPrioritySurfaceClass = utils.cn(dialogSurfaceClass, 'flex flex-col', 'backdrop-blur-md ring-4 animate-in zoom-in-95 duration-300', lib.themeBorderColor, lib.themeRingColor);
 
 exports.closeButtonClass = closeButtonClass;
 exports.dangerButtonClass = dangerButtonClass;
@@ -25,9 +27,11 @@ exports.dialogContentClass = dialogContentClass;
 exports.dialogDescriptionClass = dialogDescriptionClass;
 exports.dialogFooterClass = dialogFooterClass;
 exports.dialogHeaderClass = dialogHeaderClass;
+exports.dialogLoadingContentClass = dialogLoadingContentClass;
 exports.dialogSurfaceClass = dialogSurfaceClass;
 exports.dialogThemedOverlayClass = dialogThemedOverlayClass;
 exports.dialogTitleClass = dialogTitleClass;
+exports.dialogTitleTextClass = dialogTitleTextClass;
 exports.highPrioritySurfaceClass = highPrioritySurfaceClass;
 exports.highPriorityTitleClass = highPriorityTitleClass;
 exports.primaryButtonClass = primaryButtonClass;

package/dist/main/alert-dialog/dialog-styles.mjs

@@ -2,12 +2,14 @@
 import { themeMainBgColor, themeButtonGradientClass, themeButtonGradientHoverClass, themeRingColor, themeBgColor, themeBorderColor, themeIconColor } from '@windrun-huaiin/base-ui/lib';
 import { cn } from '@windrun-huaiin/lib/utils';
 
-const dialogSurfaceClass = cn('w-[calc(100vw-2rem)] max-w-md rounded-2xl border bg-white p-5 text-neutral-950 shadow-2xl outline-none dark:bg-neutral-950 dark:text-neutral-50', 'border-neutral-200 dark:border-neutral-800');
+const dialogSurfaceClass = cn('min-h-[240px] w-[calc(100vw-2rem)] max-w-md rounded-2xl border bg-white p-5 text-neutral-950 shadow-2xl outline-none dark:bg-neutral-950 dark:text-neutral-50', 'border-neutral-200 dark:border-neutral-800');
 const dialogThemedOverlayClass = cn(themeMainBgColor, 'opacity-90 backdrop-blur-[2px] dark:opacity-85');
 const dialogContentClass = cn('fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2', dialogSurfaceClass);
+const dialogLoadingContentClass = cn('fixed left-1/2 top-1/2 z-10000 -translate-x-1/2 -translate-y-1/2', dialogSurfaceClass, 'flex items-center justify-center overflow-hidden animate-in fade-in-0 zoom-in-95 duration-150');
 const dialogHeaderClass = 'flex items-start justify-between gap-4';
-const dialogTitleClass = 'flex min-w-0 items-center gap-2 text-lg font-bold leading-tight text-neutral-950 dark:text-neutral-50';
-const dialogDescriptionClass = 'mt-3 text-sm font-medium leading-relaxed text-neutral-600 dark:text-neutral-300';
+const dialogTitleClass = 'flex min-w-0 flex-1 items-center gap-2 text-lg font-bold leading-tight text-neutral-950 dark:text-neutral-50';
+const dialogTitleTextClass = 'min-w-0 flex-1 line-clamp-2 break-words';
+const dialogDescriptionClass = 'mt-3 break-words text-sm font-medium leading-relaxed text-neutral-600 dark:text-neutral-300';
 const dialogFooterClass = 'mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end';
 const closeButtonClass = 'inline-flex size-8 shrink-0 items-center justify-center rounded-full text-neutral-400 transition hover:bg-neutral-100 hover:text-neutral-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-400 dark:hover:bg-neutral-800 dark:hover:text-neutral-200';
 const secondaryButtonClass = 'inline-flex min-h-10 items-center justify-center rounded-full border border-neutral-300 bg-white px-5 py-2 text-sm font-semibold text-neutral-700 transition hover:bg-neutral-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-400 disabled:pointer-events-none disabled:opacity-60 dark:border-neutral-700 dark:bg-neutral-900 dark:text-neutral-200 dark:hover:bg-neutral-800';
@@ -15,6 +17,6 @@ const primaryButtonClass = cn('inline-flex min-h-10 items-center justify-center
 const subtlePrimaryButtonClass = cn('inline-flex min-h-10 items-center justify-center rounded-full border px-5 py-2 text-sm font-bold transition hover:brightness-95 focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-60', themeBgColor, themeBorderColor, themeIconColor, themeRingColor);
 const dangerButtonClass = 'inline-flex min-h-10 items-center justify-center rounded-full bg-red-600 px-5 py-2 text-sm font-bold text-white shadow-sm transition hover:bg-red-700 hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500 disabled:pointer-events-none disabled:opacity-60 dark:bg-red-600 dark:hover:bg-red-500';
 const highPriorityTitleClass = cn('flex min-w-0 items-center gap-2 text-lg font-bold leading-tight', themeIconColor);
-const highPrioritySurfaceClass = cn(dialogSurfaceClass, 'backdrop-blur-md ring-4 animate-in zoom-in-95 duration-300', themeBorderColor, themeRingColor);
+const highPrioritySurfaceClass = cn(dialogSurfaceClass, 'flex flex-col', 'backdrop-blur-md ring-4 animate-in zoom-in-95 duration-300', themeBorderColor, themeRingColor);
 
-export { closeButtonClass, dangerButtonClass, dialogContentClass, dialogDescriptionClass, dialogFooterClass, dialogHeaderClass, dialogSurfaceClass, dialogThemedOverlayClass, dialogTitleClass, highPrioritySurfaceClass, highPriorityTitleClass, primaryButtonClass, secondaryButtonClass, subtlePrimaryButtonClass };
+export { closeButtonClass, dangerButtonClass, dialogContentClass, dialogDescriptionClass, dialogFooterClass, dialogHeaderClass, dialogLoadingContentClass, dialogSurfaceClass, dialogThemedOverlayClass, dialogTitleClass, dialogTitleTextClass, highPrioritySurfaceClass, highPriorityTitleClass, primaryButtonClass, secondaryButtonClass, subtlePrimaryButtonClass };

package/dist/main/alert-dialog/high-priority-confirm-dialog.js

@@ -22,11 +22,11 @@ function HighPriorityConfirmDialog({ open, onOpenChange, onCancel, onConfirm, ti
     const handleClose = () => {
         onOpenChange(false);
     };
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [open && reactDom.createPortal(jsxRuntime.jsx("div", { className: "fixed inset-0 z-10000 flex items-center justify-center bg-black/60 backdrop-blur-sm animate-in fade-in duration-300", children: jsxRuntime.jsxs("div", { className: utils.cn(dialogStyles.highPrioritySurfaceClass, "scale-100"), role: "dialog", "aria-modal": "true", onClick: (e) => e.stopPropagation(), children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsxs("h3", { className: dialogStyles.highPriorityTitleClass, children: [jsxRuntime.jsx("span", { className: utils.cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', lib.themeBgColor, lib.themeBorderColor), children: jsxRuntime.jsx(icons.FAQSIcon, { className: utils.cn('size-5', lib.themeIconColor) }) }), jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: title })] }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx("div", { className: dialogStyles.dialogDescriptionClass, children: description }), jsxRuntime.jsxs("div", { className: dialogStyles.dialogFooterClass, children: [jsxRuntime.jsx("button", { type: "button", onClick: () => {
-                                        void runDialogAction('cancel', onCancel);
-                                    }, className: dialogStyles.secondaryButtonClass, children: cancelText }), jsxRuntime.jsx("button", { type: "button", onClick: () => {
-                                        void runDialogAction('confirm', onConfirm);
-                                    }, className: utils.cn(dialogStyles.primaryButtonClass, "hover:scale-105 active:scale-95"), children: confirmText })] })] }) }), document.body), dialogLoading] }));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [open && reactDom.createPortal(jsxRuntime.jsx("div", { className: "fixed inset-0 z-10000 flex items-center justify-center bg-black/60 backdrop-blur-sm animate-in fade-in duration-300", children: jsxRuntime.jsxs("div", { className: utils.cn(dialogStyles.highPrioritySurfaceClass, "scale-100"), role: "dialog", "aria-modal": "true", onClick: (e) => e.stopPropagation(), children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsxs("h3", { className: dialogStyles.highPriorityTitleClass, children: [jsxRuntime.jsx("span", { className: utils.cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', lib.themeBgColor, lib.themeBorderColor), children: jsxRuntime.jsx(icons.FAQSIcon, { className: utils.cn('size-5', lib.themeIconColor) }) }), jsxRuntime.jsx("span", { className: dialogStyles.dialogTitleTextClass, children: title })] }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [jsxRuntime.jsx("div", { className: dialogStyles.dialogDescriptionClass, children: description }), jsxRuntime.jsxs("div", { className: utils.cn(dialogStyles.dialogFooterClass, 'mt-auto'), children: [jsxRuntime.jsx("button", { type: "button", onClick: () => {
+                                                void runDialogAction('cancel', onCancel);
+                                            }, className: dialogStyles.secondaryButtonClass, children: cancelText }), jsxRuntime.jsx("button", { type: "button", onClick: () => {
+                                                void runDialogAction('confirm', onConfirm);
+                                            }, className: utils.cn(dialogStyles.primaryButtonClass, "hover:scale-105 active:scale-95"), children: confirmText })] })] })] }) }), document.body), dialogLoading] }));
 }
 
 exports.HighPriorityConfirmDialog = HighPriorityConfirmDialog;

package/dist/main/alert-dialog/high-priority-confirm-dialog.mjs

@@ -4,7 +4,7 @@ import { useState, useEffect } from 'react';
 import { createPortal } from 'react-dom';
 import { FAQSIcon, XIcon } from '@windrun-huaiin/base-ui/icons';
 import { cn } from '@windrun-huaiin/lib/utils';
-import { dialogHeaderClass, highPriorityTitleClass, closeButtonClass, dialogDescriptionClass, dialogFooterClass, secondaryButtonClass, primaryButtonClass, highPrioritySurfaceClass } from './dialog-styles.mjs';
+import { dialogHeaderClass, highPriorityTitleClass, dialogTitleTextClass, closeButtonClass, dialogDescriptionClass, secondaryButtonClass, primaryButtonClass, dialogFooterClass, highPrioritySurfaceClass } from './dialog-styles.mjs';
 import { themeIconColor, themeBgColor, themeBorderColor } from '@windrun-huaiin/base-ui/lib';
 import { useDialogLoadingAction } from './dialog-loading-action.mjs';
 
@@ -20,11 +20,11 @@ function HighPriorityConfirmDialog({ open, onOpenChange, onCancel, onConfirm, ti
     const handleClose = () => {
         onOpenChange(false);
     };
-    return (jsxs(Fragment, { children: [open && createPortal(jsx("div", { className: "fixed inset-0 z-10000 flex items-center justify-center bg-black/60 backdrop-blur-sm animate-in fade-in duration-300", children: jsxs("div", { className: cn(highPrioritySurfaceClass, "scale-100"), role: "dialog", "aria-modal": "true", onClick: (e) => e.stopPropagation(), children: [jsxs("div", { className: dialogHeaderClass, children: [jsxs("h3", { className: highPriorityTitleClass, children: [jsx("span", { className: cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', themeBgColor, themeBorderColor), children: jsx(FAQSIcon, { className: cn('size-5', themeIconColor) }) }), jsx("span", { className: "min-w-0 truncate", children: title })] }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsx(XIcon, { className: "size-4" }) })] }), jsx("div", { className: dialogDescriptionClass, children: description }), jsxs("div", { className: dialogFooterClass, children: [jsx("button", { type: "button", onClick: () => {
-                                        void runDialogAction('cancel', onCancel);
-                                    }, className: secondaryButtonClass, children: cancelText }), jsx("button", { type: "button", onClick: () => {
-                                        void runDialogAction('confirm', onConfirm);
-                                    }, className: cn(primaryButtonClass, "hover:scale-105 active:scale-95"), children: confirmText })] })] }) }), document.body), dialogLoading] }));
+    return (jsxs(Fragment, { children: [open && createPortal(jsx("div", { className: "fixed inset-0 z-10000 flex items-center justify-center bg-black/60 backdrop-blur-sm animate-in fade-in duration-300", children: jsxs("div", { className: cn(highPrioritySurfaceClass, "scale-100"), role: "dialog", "aria-modal": "true", onClick: (e) => e.stopPropagation(), children: [jsxs("div", { className: dialogHeaderClass, children: [jsxs("h3", { className: highPriorityTitleClass, children: [jsx("span", { className: cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', themeBgColor, themeBorderColor), children: jsx(FAQSIcon, { className: cn('size-5', themeIconColor) }) }), jsx("span", { className: dialogTitleTextClass, children: title })] }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsx(XIcon, { className: "size-4" }) })] }), jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [jsx("div", { className: dialogDescriptionClass, children: description }), jsxs("div", { className: cn(dialogFooterClass, 'mt-auto'), children: [jsx("button", { type: "button", onClick: () => {
+                                                void runDialogAction('cancel', onCancel);
+                                            }, className: secondaryButtonClass, children: cancelText }), jsx("button", { type: "button", onClick: () => {
+                                                void runDialogAction('confirm', onConfirm);
+                                            }, className: cn(primaryButtonClass, "hover:scale-105 active:scale-95"), children: confirmText })] })] })] }) }), document.body), dialogLoading] }));
 }
 
 export { HighPriorityConfirmDialog };

package/dist/main/alert-dialog/info-dialog.js

@@ -43,7 +43,7 @@ function InfoDialog({ open, onOpenChange, type = 'info', title, description, con
     const Icon = typeClass.Icon;
     const handleClose = () => onOpenChange(false);
     const { dialogLoading, runDialogAction } = dialogLoadingAction.useDialogLoadingAction({ loadingActions, loadingFullPage, onOpenChange });
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn(dialogStyles.dialogContentClass, typeClass.content), overlayClassName: dialogStyles.dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: dialogStyles.dialogTitleClass, children: [jsxRuntime.jsx("span", { className: utils.cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsxRuntime.jsx(Icon, { className: utils.cn('size-5', typeClass.icon) }) }), jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: title })] }) }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx(ui.AlertDialogDescription, { className: dialogStyles.dialogDescriptionClass, children: description }), jsxRuntime.jsx("div", { className: dialogStyles.dialogFooterClass, children: jsxRuntime.jsx(ui.AlertDialogAction, { className: utils.cn('inline-flex min-h-10 items-center justify-center rounded-full px-5 py-2 text-sm font-bold transition focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-60', typeClass.action), onClick: () => {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ui.AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn(dialogStyles.dialogContentClass, typeClass.content), overlayClassName: dialogStyles.dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: dialogStyles.dialogTitleClass, children: [jsxRuntime.jsx("span", { className: utils.cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsxRuntime.jsx(Icon, { className: utils.cn('size-5', typeClass.icon) }) }), jsxRuntime.jsx("span", { className: dialogStyles.dialogTitleTextClass, children: title })] }) }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx(ui.AlertDialogDescription, { className: dialogStyles.dialogDescriptionClass, children: description }), jsxRuntime.jsx("div", { className: dialogStyles.dialogFooterClass, children: jsxRuntime.jsx(ui.AlertDialogAction, { className: utils.cn('inline-flex min-h-10 items-center justify-center rounded-full px-5 py-2 text-sm font-bold transition focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-60', typeClass.action), onClick: () => {
                                     void runDialogAction('confirm', onConfirm);
                                 }, children: confirmText }) })] }) }), dialogLoading] }));
 }

package/dist/main/alert-dialog/info-dialog.mjs

@@ -3,7 +3,7 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { BadgeXIcon, BadgeCheckIcon, BadgeAlertIcon, BadgeInfoIcon, XIcon } from '@windrun-huaiin/base-ui/icons';
 import { AlertDialog, AlertDialogContent, AlertDialogTitle, AlertDialogDescription, AlertDialogAction } from '@windrun-huaiin/base-ui/ui';
 import { cn } from '@windrun-huaiin/lib/utils';
-import { dialogThemedOverlayClass, dialogHeaderClass, dialogTitleClass, closeButtonClass, dialogDescriptionClass, dialogFooterClass, dialogContentClass } from './dialog-styles.mjs';
+import { dialogThemedOverlayClass, dialogHeaderClass, dialogTitleClass, dialogTitleTextClass, closeButtonClass, dialogDescriptionClass, dialogFooterClass, dialogContentClass } from './dialog-styles.mjs';
 import { useDialogLoadingAction } from './dialog-loading-action.mjs';
 
 const infoTypeClassMap = {
@@ -41,7 +41,7 @@ function InfoDialog({ open, onOpenChange, type = 'info', title, description, con
     const Icon = typeClass.Icon;
     const handleClose = () => onOpenChange(false);
     const { dialogLoading, runDialogAction } = useDialogLoadingAction({ loadingActions, loadingFullPage, onOpenChange });
-    return (jsxs(Fragment, { children: [jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxs(AlertDialogContent, { className: cn(dialogContentClass, typeClass.content), overlayClassName: dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxs("div", { className: dialogHeaderClass, children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: dialogTitleClass, children: [jsx("span", { className: cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsx(Icon, { className: cn('size-5', typeClass.icon) }) }), jsx("span", { className: "min-w-0 truncate", children: title })] }) }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsx(XIcon, { className: "size-4" }) })] }), jsx(AlertDialogDescription, { className: dialogDescriptionClass, children: description }), jsx("div", { className: dialogFooterClass, children: jsx(AlertDialogAction, { className: cn('inline-flex min-h-10 items-center justify-center rounded-full px-5 py-2 text-sm font-bold transition focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-60', typeClass.action), onClick: () => {
+    return (jsxs(Fragment, { children: [jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: jsxs(AlertDialogContent, { className: cn(dialogContentClass, typeClass.content), overlayClassName: dialogThemedOverlayClass, onOverlayClick: handleClose, children: [jsxs("div", { className: dialogHeaderClass, children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: dialogTitleClass, children: [jsx("span", { className: cn('inline-flex size-9 shrink-0 items-center justify-center rounded-full ring-1', typeClass.iconWrap), children: jsx(Icon, { className: cn('size-5', typeClass.icon) }) }), jsx("span", { className: dialogTitleTextClass, children: title })] }) }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", children: jsx(XIcon, { className: "size-4" }) })] }), jsx(AlertDialogDescription, { className: dialogDescriptionClass, children: description }), jsx("div", { className: dialogFooterClass, children: jsx(AlertDialogAction, { className: cn('inline-flex min-h-10 items-center justify-center rounded-full px-5 py-2 text-sm font-bold transition focus-visible:outline-none focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-60', typeClass.action), onClick: () => {
                                     void runDialogAction('confirm', onConfirm);
                                 }, children: confirmText }) })] }) }), dialogLoading] }));
 }

package/dist/main/alert-dialog/undoable-confirm-dialog.js

@@ -86,9 +86,9 @@ function UndoableConfirmDialog({ open, onOpenChange, title, description, pending
                         return;
                     }
                     onOpenChange(nextOpen);
-                }, children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn(dialogStyles.dialogContentClass, 'border-red-300 dark:border-red-700'), overlayClassName: dialogStyles.dialogThemedOverlayClass, onOverlayClick: pending ? undefined : handleClose, children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: dialogStyles.dialogTitleClass, children: [jsxRuntime.jsx("span", { className: "inline-flex size-9 shrink-0 items-center justify-center rounded-full bg-red-100 text-red-600 ring-1 ring-red-200 dark:bg-red-950 dark:text-red-300 dark:ring-red-900", children: pending ? jsxRuntime.jsx(icons.Trash2Icon, { className: "size-5" }) : jsxRuntime.jsx(icons.CircleAlertIcon, { className: "size-5" }) }), jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: displayTitle })] }) }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", disabled: confirming, children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx(ui.AlertDialogDescription, { className: utils.cn(dialogStyles.dialogDescriptionClass, 'min-h-[44px]'), children: jsxRuntime.jsx("span", { children: displayDescription }) }), jsxRuntime.jsx("div", { className: "flex h-12 items-center justify-center py-1", children: jsxRuntime.jsxs("div", { className: "flex items-baseline justify-center gap-2", children: [jsxRuntime.jsx("span", { className: utils.cn('text-4xl font-black leading-none tabular-nums', pending && 'animate-bounce', lib.themeIconColor), children: pending ? remainingSeconds : safeCountdownSeconds }), jsxRuntime.jsx("span", { className: utils.cn('text-sm font-bold', lib.themeIconColor), children: "s" })] }) }), jsxRuntime.jsx("div", { className: utils.cn(dialogStyles.dialogFooterClass, 'min-h-[88px] sm:min-h-10 sm:items-center'), children: pending ? (jsxRuntime.jsxs("button", { type: "button", onClick: () => {
+                }, children: jsxRuntime.jsxs(ui.AlertDialogContent, { className: utils.cn(dialogStyles.dialogContentClass, 'border-red-300 dark:border-red-700'), overlayClassName: dialogStyles.dialogThemedOverlayClass, onOverlayClick: pending ? undefined : handleClose, children: [jsxRuntime.jsxs("div", { className: dialogStyles.dialogHeaderClass, children: [jsxRuntime.jsx(ui.AlertDialogTitle, { asChild: true, children: jsxRuntime.jsxs("div", { className: dialogStyles.dialogTitleClass, children: [jsxRuntime.jsx("span", { className: "inline-flex size-9 shrink-0 items-center justify-center rounded-full bg-red-100 text-red-600 ring-1 ring-red-200 dark:bg-red-950 dark:text-red-300 dark:ring-red-900", children: pending ? jsxRuntime.jsx(icons.Trash2Icon, { className: "size-5" }) : jsxRuntime.jsx(icons.CircleAlertIcon, { className: "size-5" }) }), jsxRuntime.jsx("span", { className: dialogStyles.dialogTitleTextClass, children: displayTitle })] }) }), jsxRuntime.jsx("button", { type: "button", className: dialogStyles.closeButtonClass, onClick: handleClose, "aria-label": "Close", disabled: confirming, children: jsxRuntime.jsx(icons.XIcon, { className: "size-4" }) })] }), jsxRuntime.jsx(ui.AlertDialogDescription, { className: utils.cn(dialogStyles.dialogDescriptionClass, 'min-h-[44px]'), children: jsxRuntime.jsx("span", { children: displayDescription }) }), jsxRuntime.jsx("div", { className: "flex h-12 items-center justify-center py-1", children: jsxRuntime.jsxs("div", { className: "flex items-baseline justify-center gap-2", children: [jsxRuntime.jsx("span", { className: utils.cn('text-4xl font-black leading-none tabular-nums', pending && 'animate-bounce', lib.themeIconColor), children: pending ? remainingSeconds : safeCountdownSeconds }), jsxRuntime.jsx("span", { className: utils.cn('text-sm font-bold', lib.themeIconColor), children: "s" })] }) }), jsxRuntime.jsx("div", { className: utils.cn(dialogStyles.dialogFooterClass, 'min-h-[88px] sm:min-h-10 sm:items-center'), children: pending ? (jsxRuntime.jsxs("button", { type: "button", onClick: () => {
                                     void handleUndo();
-                                }, className: dialogStyles.secondaryButtonClass, disabled: confirming, children: [jsxRuntime.jsx(icons.Undo2Icon, { className: "mr-1.5 size-4" }), undoText] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("button", { type: "button", onClick: handleCancel, className: cancelButtonClass, children: cancelText }), jsxRuntime.jsx("button", { type: "button", onClick: startCountdown, className: confirmButtonClass, children: confirmText })] })) })] }) }), dialogLoading] }));
+                                }, className: utils.cn(dialogStyles.secondaryButtonClass, 'w-full sm:w-auto'), disabled: confirming, children: [jsxRuntime.jsx(icons.Undo2Icon, { className: "mr-1.5 size-4" }), undoText] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("button", { type: "button", onClick: handleCancel, className: utils.cn(cancelButtonClass, 'w-full sm:w-auto'), children: cancelText }), jsxRuntime.jsx("button", { type: "button", onClick: startCountdown, className: utils.cn(confirmButtonClass, 'w-full sm:w-auto'), children: confirmText })] })) })] }) }), dialogLoading] }));
 }
 
 exports.UndoableConfirmDialog = UndoableConfirmDialog;

package/dist/main/alert-dialog/undoable-confirm-dialog.mjs

@@ -6,7 +6,7 @@ import { Trash2Icon, CircleAlertIcon, XIcon, Undo2Icon } from '@windrun-huaiin/b
 import { themeIconColor } from '@windrun-huaiin/base-ui/lib';
 import { AlertDialog, AlertDialogContent, AlertDialogTitle, AlertDialogDescription } from '@windrun-huaiin/base-ui/ui';
 import { cn } from '@windrun-huaiin/lib/utils';
-import { dialogThemedOverlayClass, dialogHeaderClass, dialogTitleClass, closeButtonClass, dialogDescriptionClass, secondaryButtonClass, dangerButtonClass, dialogFooterClass, dialogContentClass } from './dialog-styles.mjs';
+import { dialogThemedOverlayClass, dialogHeaderClass, dialogTitleClass, dialogTitleTextClass, closeButtonClass, dialogDescriptionClass, secondaryButtonClass, dangerButtonClass, dialogFooterClass, dialogContentClass } from './dialog-styles.mjs';
 import { useDialogLoadingAction } from './dialog-loading-action.mjs';
 
 function UndoableConfirmDialog({ open, onOpenChange, title, description, pendingTitle, pendingDescription, cancelText = 'Cancel', confirmText = 'Delete', undoText = 'Undo', emphasis = 'confirm', countdownSeconds = 5, loadingActions, loadingFullPage, onCancel, onConfirm, onUndo, }) {
@@ -84,9 +84,9 @@ function UndoableConfirmDialog({ open, onOpenChange, title, description, pending
                         return;
                     }
                     onOpenChange(nextOpen);
-                }, children: jsxs(AlertDialogContent, { className: cn(dialogContentClass, 'border-red-300 dark:border-red-700'), overlayClassName: dialogThemedOverlayClass, onOverlayClick: pending ? undefined : handleClose, children: [jsxs("div", { className: dialogHeaderClass, children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: dialogTitleClass, children: [jsx("span", { className: "inline-flex size-9 shrink-0 items-center justify-center rounded-full bg-red-100 text-red-600 ring-1 ring-red-200 dark:bg-red-950 dark:text-red-300 dark:ring-red-900", children: pending ? jsx(Trash2Icon, { className: "size-5" }) : jsx(CircleAlertIcon, { className: "size-5" }) }), jsx("span", { className: "min-w-0 truncate", children: displayTitle })] }) }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", disabled: confirming, children: jsx(XIcon, { className: "size-4" }) })] }), jsx(AlertDialogDescription, { className: cn(dialogDescriptionClass, 'min-h-[44px]'), children: jsx("span", { children: displayDescription }) }), jsx("div", { className: "flex h-12 items-center justify-center py-1", children: jsxs("div", { className: "flex items-baseline justify-center gap-2", children: [jsx("span", { className: cn('text-4xl font-black leading-none tabular-nums', pending && 'animate-bounce', themeIconColor), children: pending ? remainingSeconds : safeCountdownSeconds }), jsx("span", { className: cn('text-sm font-bold', themeIconColor), children: "s" })] }) }), jsx("div", { className: cn(dialogFooterClass, 'min-h-[88px] sm:min-h-10 sm:items-center'), children: pending ? (jsxs("button", { type: "button", onClick: () => {
+                }, children: jsxs(AlertDialogContent, { className: cn(dialogContentClass, 'border-red-300 dark:border-red-700'), overlayClassName: dialogThemedOverlayClass, onOverlayClick: pending ? undefined : handleClose, children: [jsxs("div", { className: dialogHeaderClass, children: [jsx(AlertDialogTitle, { asChild: true, children: jsxs("div", { className: dialogTitleClass, children: [jsx("span", { className: "inline-flex size-9 shrink-0 items-center justify-center rounded-full bg-red-100 text-red-600 ring-1 ring-red-200 dark:bg-red-950 dark:text-red-300 dark:ring-red-900", children: pending ? jsx(Trash2Icon, { className: "size-5" }) : jsx(CircleAlertIcon, { className: "size-5" }) }), jsx("span", { className: dialogTitleTextClass, children: displayTitle })] }) }), jsx("button", { type: "button", className: closeButtonClass, onClick: handleClose, "aria-label": "Close", disabled: confirming, children: jsx(XIcon, { className: "size-4" }) })] }), jsx(AlertDialogDescription, { className: cn(dialogDescriptionClass, 'min-h-[44px]'), children: jsx("span", { children: displayDescription }) }), jsx("div", { className: "flex h-12 items-center justify-center py-1", children: jsxs("div", { className: "flex items-baseline justify-center gap-2", children: [jsx("span", { className: cn('text-4xl font-black leading-none tabular-nums', pending && 'animate-bounce', themeIconColor), children: pending ? remainingSeconds : safeCountdownSeconds }), jsx("span", { className: cn('text-sm font-bold', themeIconColor), children: "s" })] }) }), jsx("div", { className: cn(dialogFooterClass, 'min-h-[88px] sm:min-h-10 sm:items-center'), children: pending ? (jsxs("button", { type: "button", onClick: () => {
                                     void handleUndo();
-                                }, className: secondaryButtonClass, disabled: confirming, children: [jsx(Undo2Icon, { className: "mr-1.5 size-4" }), undoText] })) : (jsxs(Fragment, { children: [jsx("button", { type: "button", onClick: handleCancel, className: cancelButtonClass, children: cancelText }), jsx("button", { type: "button", onClick: startCountdown, className: confirmButtonClass, children: confirmText })] })) })] }) }), dialogLoading] }));
+                                }, className: cn(secondaryButtonClass, 'w-full sm:w-auto'), disabled: confirming, children: [jsx(Undo2Icon, { className: "mr-1.5 size-4" }), undoText] })) : (jsxs(Fragment, { children: [jsx("button", { type: "button", onClick: handleCancel, className: cn(cancelButtonClass, 'w-full sm:w-auto'), children: cancelText }), jsx("button", { type: "button", onClick: startCountdown, className: cn(confirmButtonClass, 'w-full sm:w-auto'), children: confirmText })] })) })] }) }), dialogLoading] }));
 }
 
 export { UndoableConfirmDialog };

package/dist/main/anime/anime-beam-frame.d.ts

@@ -0,0 +1,3 @@
+import { type BeamFrameProps } from '../beam-frame-config';
+export type { BeamFrameProps, BeamFrameTone } from '../beam-frame-config';
+export declare function AnimeBeamFrame(props: BeamFrameProps): import("react/jsx-runtime").JSX.Element;

package/dist/main/anime/anime-beam-frame.js

@@ -0,0 +1,63 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var animejs = require('animejs');
+var react = require('motion/react');
+var beamFrameConfig = require('../beam-frame-config.js');
+
+function AnimeBeamLayer({ isRunning, duration, radius, size, }) {
+    const aroundBeamRef = React.useRef(null);
+    const animationRef = React.useRef(null);
+    const hasStartedRef = React.useRef(false);
+    const auraGradientId = React.useId().replace(/:/g, '');
+    const softGlowFilterId = React.useId().replace(/:/g, '');
+    React.useEffect(() => {
+        var _a;
+        const node = aroundBeamRef.current;
+        if (!node) {
+            return undefined;
+        }
+        if (isRunning) {
+            hasStartedRef.current = true;
+        }
+        node.style.opacity = isRunning || hasStartedRef.current ? 'var(--beam-frame-beam-opacity)' : '0';
+        if (!isRunning) {
+            (_a = animationRef.current) === null || _a === void 0 ? void 0 : _a.pause();
+            return undefined;
+        }
+        if (animationRef.current) {
+            animationRef.current.speed = beamFrameConfig.BASE_DURATION_SECONDS / duration;
+            animationRef.current.play();
+            return undefined;
+        }
+        animationRef.current = animejs.waapi.animate(node, {
+            strokeDashoffset: [0, -1],
+            loop: true,
+            duration: beamFrameConfig.BASE_DURATION_SECONDS * 1000,
+            ease: 'linear',
+        });
+        animationRef.current.speed = beamFrameConfig.BASE_DURATION_SECONDS / duration;
+        return undefined;
+    }, [duration, isRunning]);
+    React.useEffect(() => {
+        return () => {
+            var _a;
+            (_a = animationRef.current) === null || _a === void 0 ? void 0 : _a.revert();
+            animationRef.current = null;
+        };
+    }, []);
+    return (jsxRuntime.jsx(beamFrameConfig.BeamSvgLayer, { beamRef: aroundBeamRef, auraGradientId: auraGradientId, softGlowFilterId: softGlowFilterId, radius: radius, size: size }));
+}
+function AnimeBeamFrame(props) {
+    const { children, active = false, interactive = true, tone = 'theme', duration = beamFrameConfig.BASE_DURATION_SECONDS, radius, className, } = props;
+    const prefersReducedMotion = react.useReducedMotion();
+    const { isRunning, interactionProps } = beamFrameConfig.useInteractiveRunning(active, interactive);
+    const shouldRun = isRunning && !prefersReducedMotion;
+    const normalizedDuration = beamFrameConfig.normalizeDuration(duration);
+    const { ref, size } = beamFrameConfig.useMeasuredFrameSize();
+    return (jsxRuntime.jsx(beamFrameConfig.BeamFrameShell, { active: active, interactive: interactive, tone: tone, duration: normalizedDuration, radius: radius, className: className, isRunning: shouldRun, interactionProps: interactionProps, rootRef: ref, renderBeam: () => (jsxRuntime.jsx(AnimeBeamLayer, { isRunning: shouldRun, duration: normalizedDuration, radius: radius, size: size })), children: children }));
+}
+
+exports.AnimeBeamFrame = AnimeBeamFrame;

package/dist/main/anime/anime-beam-frame.mjs

@@ -0,0 +1,61 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useRef, useId, useEffect } from 'react';
+import { waapi } from 'animejs';
+import { useReducedMotion } from 'motion/react';
+import { BASE_DURATION_SECONDS, useInteractiveRunning, useMeasuredFrameSize, BeamFrameShell, normalizeDuration, BeamSvgLayer } from '../beam-frame-config.mjs';
+
+function AnimeBeamLayer({ isRunning, duration, radius, size, }) {
+    const aroundBeamRef = useRef(null);
+    const animationRef = useRef(null);
+    const hasStartedRef = useRef(false);
+    const auraGradientId = useId().replace(/:/g, '');
+    const softGlowFilterId = useId().replace(/:/g, '');
+    useEffect(() => {
+        var _a;
+        const node = aroundBeamRef.current;
+        if (!node) {
+            return undefined;
+        }
+        if (isRunning) {
+            hasStartedRef.current = true;
+        }
+        node.style.opacity = isRunning || hasStartedRef.current ? 'var(--beam-frame-beam-opacity)' : '0';
+        if (!isRunning) {
+            (_a = animationRef.current) === null || _a === void 0 ? void 0 : _a.pause();
+            return undefined;
+        }
+        if (animationRef.current) {
+            animationRef.current.speed = BASE_DURATION_SECONDS / duration;
+            animationRef.current.play();
+            return undefined;
+        }
+        animationRef.current = waapi.animate(node, {
+            strokeDashoffset: [0, -1],
+            loop: true,
+            duration: BASE_DURATION_SECONDS * 1000,
+            ease: 'linear',
+        });
+        animationRef.current.speed = BASE_DURATION_SECONDS / duration;
+        return undefined;
+    }, [duration, isRunning]);
+    useEffect(() => {
+        return () => {
+            var _a;
+            (_a = animationRef.current) === null || _a === void 0 ? void 0 : _a.revert();
+            animationRef.current = null;
+        };
+    }, []);
+    return (jsx(BeamSvgLayer, { beamRef: aroundBeamRef, auraGradientId: auraGradientId, softGlowFilterId: softGlowFilterId, radius: radius, size: size }));
+}
+function AnimeBeamFrame(props) {
+    const { children, active = false, interactive = true, tone = 'theme', duration = BASE_DURATION_SECONDS, radius, className, } = props;
+    const prefersReducedMotion = useReducedMotion();
+    const { isRunning, interactionProps } = useInteractiveRunning(active, interactive);
+    const shouldRun = isRunning && !prefersReducedMotion;
+    const normalizedDuration = normalizeDuration(duration);
+    const { ref, size } = useMeasuredFrameSize();
+    return (jsx(BeamFrameShell, { active: active, interactive: interactive, tone: tone, duration: normalizedDuration, radius: radius, className: className, isRunning: shouldRun, interactionProps: interactionProps, rootRef: ref, renderBeam: () => (jsx(AnimeBeamLayer, { isRunning: shouldRun, duration: normalizedDuration, radius: radius, size: size })), children: children }));
+}
+
+export { AnimeBeamFrame };

package/dist/main/anime/anime-spiral-loading.d.ts

@@ -0,0 +1,10 @@
+export interface AnimeSpiralLoadingProps {
+    className?: string;
+    dotCount?: number;
+    duration?: number;
+    distanceRem?: number;
+    dotSizeEm?: number;
+    fontSize?: number;
+    paused?: boolean;
+}
+export declare function AnimeSpiralLoading({ className, dotCount, duration, distanceRem, dotSizeEm, fontSize, paused, }: AnimeSpiralLoadingProps): import("react/jsx-runtime").JSX.Element;

package/dist/main/anime/anime-spiral-loading.js

@@ -0,0 +1,77 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var animejs = require('animejs');
+var utils = require('@windrun-huaiin/lib/utils');
+
+const DEFAULT_DOT_COUNT = 2024;
+const DEFAULT_DURATION = 10000;
+const DEFAULT_DISTANCE_REM = 20;
+const DEFAULT_DOT_SIZE_EM = 1;
+const DEFAULT_FONT_SIZE = 20;
+function AnimeSpiralLoading({ className, dotCount = DEFAULT_DOT_COUNT, duration = DEFAULT_DURATION, distanceRem = DEFAULT_DISTANCE_REM, dotSizeEm = DEFAULT_DOT_SIZE_EM, fontSize = DEFAULT_FONT_SIZE, paused = false, }) {
+    const rootRef = React.useRef(null);
+    const timelineRef = React.useRef(null);
+    const pausedRef = React.useRef(paused);
+    const safeDotCount = Math.max(1, Math.floor(dotCount));
+    const safeDuration = Math.max(1, duration);
+    const angle = React.useMemo(() => (index) => animejs.utils.mapRange(index, 0, safeDotCount, 0, Math.PI * 100), [safeDotCount]);
+    const dots = React.useMemo(() => Array.from({ length: safeDotCount }, (_, index) => {
+        const hue = animejs.utils.round((360 / safeDotCount) * index, 0);
+        return {
+            id: index,
+            background: `hsl(${hue}, 60%, 60%)`,
+        };
+    }), [safeDotCount]);
+    pausedRef.current = paused;
+    React.useEffect(() => {
+        var _a;
+        const root = rootRef.current;
+        if (!root) {
+            return undefined;
+        }
+        const dotNodes = Array.from(root.querySelectorAll('[data-anime-spiral-dot]'));
+        (_a = timelineRef.current) === null || _a === void 0 ? void 0 : _a.revert();
+        timelineRef.current = animejs.createTimeline()
+            .add(dotNodes, {
+            x: (_target, i) => `${Math.sin(angle(i)) * distanceRem}rem`,
+            y: (_target, i) => `${Math.cos(angle(i)) * distanceRem}rem`,
+            scale: [0, 0.4, 0.2, 0.9, 0],
+            playbackEase: 'inOutSine',
+            loop: true,
+            duration: safeDuration,
+        }, animejs.stagger([0, safeDuration]))
+            .init()
+            .seek(safeDuration);
+        if (pausedRef.current) {
+            timelineRef.current.pause();
+        }
+        return () => {
+            var _a;
+            (_a = timelineRef.current) === null || _a === void 0 ? void 0 : _a.revert();
+            timelineRef.current = null;
+        };
+    }, [angle, distanceRem, safeDuration, dots]);
+    React.useEffect(() => {
+        const timeline = timelineRef.current;
+        if (!timeline) {
+            return;
+        }
+        if (paused) {
+            timeline.pause();
+        }
+        else {
+            timeline.play();
+        }
+    }, [paused]);
+    return (jsxRuntime.jsx("div", { ref: rootRef, className: utils.cn('relative h-dvh w-full overflow-hidden', className), style: { fontSize }, "aria-hidden": "true", children: dots.map(dot => (jsxRuntime.jsx("div", { "data-anime-spiral-dot": "", className: "absolute left-1/2 top-1/2 rounded-full", style: {
+                width: `${dotSizeEm}em`,
+                height: `${dotSizeEm}em`,
+                margin: `${dotSizeEm / -2}em 0 0 ${dotSizeEm / -2}em`,
+                backgroundColor: dot.background,
+            } }, dot.id))) }));
+}
+
+exports.AnimeSpiralLoading = AnimeSpiralLoading;