@fangxinyan/lumina 0.6.18 → 0.7.0

package/dist/{chunk-V5SQOZPF.js → chunk-BJDQVVCG.js}

@@ -1,13 +1,16 @@
-import { Select } from './chunk-E22OIVYP.js';
-import { Icon } from './chunk-FDZG27IG.js';
-import './tokens-RYJ3DFTU.css';
+import { Select } from './chunk-3EHJ5QI3.js';
+import { Input } from './chunk-UE4HFGJ6.js';
+import { Icon } from './chunk-LQMOYVQF.js';
+import { InternalComponentThemePart, withComponentTheme } from './chunk-DRDDQCDD.js';
+import './tokens-CEJVVA3G.css';
 import './shared-NJHRNLRH.css';
-import './Pagination-YSZSNFHG.css';
+import './Pagination-POJTWMYR.css';
 import * as React from 'react';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
 var DEFAULT_SIZE_OPTIONS = [10, 20, 50, 100];
-var Pagination = React.forwardRef(({
+var clampPage = (value, pages) => Number.isFinite(value) ? Math.min(pages, Math.max(1, Math.trunc(value))) : 1;
+var PaginationBase = React.forwardRef(({
   total,
   pageSize = 10,
   page,
@@ -21,11 +24,17 @@ var Pagination = React.forwardRef(({
   className = "",
   ...rest
 }, ref) => {
+  const normalizedTotal = Number.isFinite(total) ? Math.max(0, Math.trunc(total)) : 0;
+  const normalizedPageSize = Number.isFinite(pageSize) && pageSize > 0 ? Math.max(1, Math.trunc(pageSize)) : 10;
+  const normalizedSiblings = Number.isFinite(siblings) ? Math.max(0, Math.trunc(siblings)) : 1;
+  const pages = Math.max(1, Math.ceil(normalizedTotal / normalizedPageSize));
   const [inner, setInner] = React.useState(defaultPage);
   const isControlled = page !== void 0;
-  const cur = isControlled ? page : inner;
-  const pages = Math.max(1, Math.ceil(total / pageSize));
+  const cur = clampPage(isControlled ? page : inner, pages);
   const [jumpDraft, setJumpDraft] = React.useState("");
+  React.useEffect(() => {
+    if (!isControlled && inner !== cur) setInner(cur);
+  }, [cur, inner, isControlled]);
   const go = (p) => {
     const next = Math.min(pages, Math.max(1, p));
     if (!isControlled) setInner(next);
@@ -49,8 +58,8 @@ var Pagination = React.forwardRef(({
   const range = () => {
     const out = [];
     const add = (n) => out.push(n);
-    const s = Math.max(2, cur - siblings);
-    const e = Math.min(pages - 1, cur + siblings);
+    const s = Math.max(2, cur - normalizedSiblings);
+    const e = Math.min(pages - 1, cur + normalizedSiblings);
     add(1);
     if (s > 2) add("...");
     for (let i = s; i <= e; i++) add(i);
@@ -58,10 +67,10 @@ var Pagination = React.forwardRef(({
     if (pages > 1) add(pages);
     return out;
   };
-  return /* @__PURE__ */ jsxs("div", { ref, className: `pagination ${className}`, ...rest, children: [
+  return /* @__PURE__ */ jsx("div", { ref, className: `pagination ${className}`, role: "navigation", "aria-label": "\u5206\u9875", ...rest, children: /* @__PURE__ */ jsxs(InternalComponentThemePart, { components: ["Select", "Input"], children: [
     /* @__PURE__ */ jsxs("span", { className: "pg-info", children: [
       "\u5171 ",
-      total,
+      normalizedTotal,
       " \u6761 \xB7 \u7B2C ",
       cur,
       " / ",
@@ -75,7 +84,8 @@ var Pagination = React.forwardRef(({
           type: "button",
           className: `pg ${cur === 1 ? "disabled" : ""}`,
           onClick: () => cur > 1 && go(cur - 1),
-          "aria-label": "Previous",
+          "aria-label": "\u4E0A\u4E00\u9875",
+          disabled: cur === 1,
           children: /* @__PURE__ */ jsx(Icon, { name: "chevLeft", size: 12 })
         }
       ),
@@ -86,6 +96,8 @@ var Pagination = React.forwardRef(({
             type: "button",
             className: `pg ${p === cur ? "active" : ""}`,
             onClick: () => go(p),
+            "aria-label": `\u7B2C ${p} \u9875`,
+            "aria-current": p === cur ? "page" : void 0,
             children: p
           },
           p
@@ -97,14 +109,15 @@ var Pagination = React.forwardRef(({
           type: "button",
           className: `pg ${cur === pages ? "disabled" : ""}`,
           onClick: () => cur < pages && go(cur + 1),
-          "aria-label": "Next",
+          "aria-label": "\u4E0B\u4E00\u9875",
+          disabled: cur === pages,
           children: /* @__PURE__ */ jsx(Icon, { name: "chevRight", size: 12 })
         }
       ),
       showSizeChanger && /* @__PURE__ */ jsx("div", { className: "pg-size-changer", children: /* @__PURE__ */ jsx(
         Select,
         {
-          value: pageSize,
+          value: normalizedPageSize,
           size: "sm",
           options: pageSizeOptions.map((n) => ({ value: n, label: `${n} \u6761/\u9875` })),
           onChange: handleSizeChange
@@ -113,13 +126,13 @@ var Pagination = React.forwardRef(({
       showQuickJumper && /* @__PURE__ */ jsxs("label", { className: "pg-jumper", children: [
         /* @__PURE__ */ jsx("span", { className: "pg-jumper-label", children: "\u8DF3\u81F3" }),
         /* @__PURE__ */ jsx(
-          "input",
+          Input,
           {
-            type: "text",
+            size: "sm",
             inputMode: "numeric",
             className: "pg-jumper-input",
             value: jumpDraft,
-            onChange: (e) => setJumpDraft(e.target.value.replace(/[^\d]/g, "")),
+            onValueChange: (value) => setJumpDraft(value.replace(/[^\d]/g, "")),
             onKeyDown: handleJump,
             "aria-label": "\u8DF3\u8F6C\u5230\u6307\u5B9A\u9875"
           }
@@ -127,8 +140,13 @@ var Pagination = React.forwardRef(({
         /* @__PURE__ */ jsx("span", { className: "pg-jumper-label", children: "\u9875" })
       ] })
     ] })
-  ] });
+  ] }) });
 });
-Pagination.displayName = "Pagination";
+PaginationBase.displayName = "Pagination";
+var Pagination = withComponentTheme(
+  PaginationBase,
+  "Pagination",
+  ["pagination", "select", "input"]
+);
 
 export { Pagination };

package/dist/{chunk-BVQOJKRX.js → chunk-BKW5PXEO.js}

@@ -1,47 +1,59 @@
-import { Button } from './chunk-IPSNC5VZ.js';
-import { Icon } from './chunk-FDZG27IG.js';
-import './tokens-RYJ3DFTU.css';
+import { useOverlayZIndex, useOverlayLayer, OverlayZIndexProvider } from './chunk-2A4GYSN4.js';
+import { Button } from './chunk-JHM7MN3G.js';
+import { Icon } from './chunk-LQMOYVQF.js';
+import { useComponentPortalTheme, InternalComponentThemePart, withComponentTheme } from './chunk-DRDDQCDD.js';
+import { usePortalContainer } from './chunk-ULTDRMGN.js';
+import './tokens-CEJVVA3G.css';
 import './shared-NJHRNLRH.css';
-import './Modal-ZFWNFEA5.css';
+import './Modal-UI2FXNDR.css';
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { createRoot } from 'react-dom/client';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 var ANIM_MS = 280;
-var ModalBase = React.forwardRef(({
-  open,
-  onClose,
-  onCancel,
-  onOk,
-  title,
-  description,
-  footer,
-  children,
-  width = 440,
-  closable = true,
-  closeIcon,
-  maskClosable = true,
-  maskClassName = "",
-  maskStyle,
-  escClosable = true,
-  okText = "\u786E\u5B9A",
-  cancelText = "\u53D6\u6D88",
-  okButtonProps,
-  cancelButtonProps,
-  confirmLoading,
-  bodyClassName = "",
-  bodyStyle,
-  bodyProps,
-  bodyOverflow,
-  destroyOnClose = false,
-  afterOpenChange,
-  zIndex,
-  className = "",
-  style,
-  onClick,
-  ...rest
-}, ref) => {
+var ModalBase = React.forwardRef((props, ref) => {
+  const hasExplicitWidth = props.width !== void 0;
+  const {
+    open,
+    onClose,
+    onCancel,
+    onOk,
+    title,
+    description,
+    footer,
+    children,
+    width = 440,
+    closable = true,
+    closeIcon,
+    maskClosable = true,
+    maskClassName = "",
+    maskStyle,
+    escClosable = true,
+    okText = "\u786E\u5B9A",
+    cancelText = "\u53D6\u6D88",
+    okButtonProps,
+    cancelButtonProps,
+    confirmLoading,
+    bodyClassName = "",
+    bodyStyle,
+    bodyProps,
+    bodyOverflow,
+    bodyInset = "safe",
+    destroyOnClose = false,
+    afterOpenChange,
+    zIndex,
+    className = "",
+    style,
+    onClick,
+    ...rest
+  } = props;
+  const portalContainer = usePortalContainer();
+  const portalTheme = useComponentPortalTheme("Modal");
+  const panelRef = React.useRef(null);
+  const titleId = React.useId();
+  const descriptionId = React.useId();
+  const overlayZIndex = useOverlayZIndex(open, zIndex);
   const [hasOpenedOnce, setHasOpenedOnce] = React.useState(open);
   React.useEffect(() => {
     if (open) setHasOpenedOnce(true);
@@ -50,29 +62,49 @@ var ModalBase = React.forwardRef(({
     if (onCancel) onCancel();
     else onClose?.();
   }, [onCancel, onClose]);
-  React.useEffect(() => {
-    if (!open || !escClosable) return;
-    const h = (e) => {
-      if (e.key === "Escape") handleCancel();
-    };
-    window.addEventListener("keydown", h);
-    return () => window.removeEventListener("keydown", h);
-  }, [open, escClosable, handleCancel]);
+  useOverlayLayer({
+    open: open && portalContainer != null,
+    containerRef: panelRef,
+    zIndex: overlayZIndex,
+    onEscape: handleCancel,
+    escapeEnabled: escClosable,
+    trapFocus: true,
+    autoFocus: true,
+    restoreFocus: true,
+    lockScroll: true
+  });
+  const setPanelRef = React.useCallback((node) => {
+    panelRef.current = node;
+    if (typeof ref === "function") ref(node);
+    else if (ref) ref.current = node;
+  }, [ref]);
   const prevOpen = React.useRef(open);
+  const afterOpenChangeRef = React.useRef(afterOpenChange);
+  afterOpenChangeRef.current = afterOpenChange;
   React.useEffect(() => {
     if (prevOpen.current !== open) {
       prevOpen.current = open;
-      if (afterOpenChange) {
-        const id = window.setTimeout(() => afterOpenChange(open), ANIM_MS);
-        return () => window.clearTimeout(id);
-      }
+      const id = window.setTimeout(() => afterOpenChangeRef.current?.(open), ANIM_MS);
+      return () => window.clearTimeout(id);
     }
-  }, [open, afterOpenChange]);
-  if (typeof document === "undefined") return null;
+  }, [open]);
+  if (!portalContainer) return null;
   if (!hasOpenedOnce) return null;
   if (!open && destroyOnClose) return null;
-  const overlayStyle = zIndex != null || maskStyle ? { ...maskStyle, ...zIndex != null ? { zIndex } : {} } : void 0;
-  const defaultFooter = /* @__PURE__ */ jsxs(Fragment, { children: [
+  const overlayStyle = {
+    ...portalTheme.styles.overlay,
+    ...maskStyle,
+    zIndex: overlayZIndex
+  };
+  const panelStyle = {
+    ...portalTheme.style,
+    width,
+    maxWidth: "92vw",
+    ...portalTheme.styles.popup,
+    ...hasExplicitWidth ? { width } : null,
+    ...style
+  };
+  const defaultFooter = /* @__PURE__ */ jsxs(InternalComponentThemePart, { components: "Button", children: [
     /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: handleCancel, ...cancelButtonProps, children: cancelText }),
     /* @__PURE__ */ jsx(
       Button,
@@ -85,21 +117,21 @@ var ModalBase = React.forwardRef(({
       }
     )
   ] });
-  const modalBodyStyle = bodyOverflow == null ? bodyStyle : { overflow: bodyOverflow, ...bodyStyle };
+  const modalBodyStyle = bodyOverflow == null ? { ...portalTheme.styles.body, ...bodyStyle } : { ...portalTheme.styles.body, overflow: bodyOverflow, ...bodyStyle };
   return ReactDOM.createPortal(
-    /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(OverlayZIndexProvider, { zIndex: overlayZIndex, children: /* @__PURE__ */ jsx(
       "div",
       {
-        className: ["modal-overlay", open ? "" : "hidden", className, maskClassName].filter(Boolean).join(" "),
+        className: ["modal-overlay", open ? "" : "hidden", maskClassName].filter(Boolean).join(" "),
         style: overlayStyle,
         onClick: () => maskClosable && handleCancel(),
         role: "presentation",
         children: /* @__PURE__ */ jsxs(
           "div",
           {
-            ref,
-            className: "modal",
-            style: { width, ...style },
+            ref: setPanelRef,
+            className: ["modal", className].filter(Boolean).join(" "),
+            style: panelStyle,
             onClick: (e) => {
               onClick?.(e);
               e.stopPropagation();
@@ -107,12 +139,16 @@ var ModalBase = React.forwardRef(({
             role: "dialog",
             "aria-modal": true,
             "aria-hidden": !open,
+            "aria-labelledby": title ? titleId : void 0,
+            "aria-describedby": description ? descriptionId : void 0,
+            tabIndex: -1,
+            ...portalTheme.dataAttributes,
             ...rest,
             children: [
               (title || description || closable) && /* @__PURE__ */ jsxs("div", { className: "modal-head", children: [
                 /* @__PURE__ */ jsxs("div", { className: "modal-titles", children: [
-                  title && /* @__PURE__ */ jsx("div", { className: "modal-title", children: title }),
-                  description && /* @__PURE__ */ jsx("div", { className: "modal-desc", children: description })
+                  title && /* @__PURE__ */ jsx("div", { id: titleId, className: "modal-title", children: title }),
+                  description && /* @__PURE__ */ jsx("div", { id: descriptionId, className: "modal-desc", children: description })
                 ] }),
                 closable && /* @__PURE__ */ jsx(
                   "button",
@@ -129,7 +165,7 @@ var ModalBase = React.forwardRef(({
                 "div",
                 {
                   ...bodyProps,
-                  className: `modal-body ${bodyClassName}`.trim(),
+                  className: ["modal-body", `inset-${bodyInset}`, bodyClassName].filter(Boolean).join(" "),
                   style: modalBodyStyle,
                   children
                 }
@@ -139,11 +175,17 @@ var ModalBase = React.forwardRef(({
           }
         )
       }
-    ),
-    document.body
+    ) }),
+    portalContainer
   );
 });
 ModalBase.displayName = "Modal";
+var ThemedModalBase = withComponentTheme(
+  ModalBase,
+  "Modal",
+  ["modal", "button"],
+  { portalOnly: true }
+);
 var staticHandles = /* @__PURE__ */ new Set();
 var staticIconName = {
   confirm: "info",
@@ -189,13 +231,13 @@ var StaticModalHost = ({
       setLoading(true);
       result.then((next) => {
         if (next !== false) destroy();
-      }).finally(() => setLoading(false));
+      }, () => void 0).finally(() => setLoading(false));
       return;
     }
     destroy();
   }, [destroy, onOk]);
   const okVariant = kind === "error" ? "danger" : "primary";
-  const mergedFooter = footer !== void 0 ? footer : okCancel ? /* @__PURE__ */ jsxs(Fragment, { children: [
+  const mergedFooter = footer !== void 0 ? footer : okCancel ? /* @__PURE__ */ jsxs(InternalComponentThemePart, { components: "Button", children: [
     /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: close, ...cancelButtonProps, children: cancelText }),
     /* @__PURE__ */ jsx(
       Button,
@@ -207,7 +249,7 @@ var StaticModalHost = ({
         children: okText
       }
     )
-  ] }) : /* @__PURE__ */ jsx(
+  ] }) : /* @__PURE__ */ jsx(InternalComponentThemePart, { components: "Button", children: /* @__PURE__ */ jsx(
     Button,
     {
       variant: okVariant,
@@ -216,9 +258,9 @@ var StaticModalHost = ({
       ...okButtonProps,
       children: okText
     }
-  );
+  ) });
   return /* @__PURE__ */ jsx(
-    ModalBase,
+    ThemedModalBase,
     {
       ...modalProps,
       open,
@@ -227,7 +269,8 @@ var StaticModalHost = ({
       footer: mergedFooter,
       maskClosable: maskClosable ?? false,
       escClosable: escClosable ?? true,
-      className: `modal-static-overlay ${className}`,
+      className,
+      maskClassName: ["modal-static-overlay", config.maskClassName].filter(Boolean).join(" "),
       children: /* @__PURE__ */ jsxs("div", { className: "modal-static-body", children: [
         icon !== false && /* @__PURE__ */ jsx("span", { className: `modal-static-icon ${kind}`, children: icon ?? /* @__PURE__ */ jsx(Icon, { name: staticIconName[kind], size: 20 }) }),
         /* @__PURE__ */ jsx("div", { className: "modal-static-content", children: content ?? children })
@@ -284,7 +327,7 @@ var createStaticModal = (kind, config) => {
   render();
   return handle;
 };
-var Modal = ModalBase;
+var Modal = ThemedModalBase;
 Modal.confirm = (config) => createStaticModal("confirm", config);
 Modal.info = (config) => createStaticModal("info", config);
 Modal.success = (config) => createStaticModal("success", config);