@fangxinyan/lumina 0.6.17 → 0.7.0

package/dist/chunk-5CZA33BK.cjs

@@ -0,0 +1,229 @@
+'use strict';
+
+var chunkRERMZNF3_cjs = require('./chunk-RERMZNF3.cjs');
+var chunkT4RR6NVU_cjs = require('./chunk-T4RR6NVU.cjs');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+require('./tokens-CEJVVA3G.css');
+require('./shared-NJHRNLRH.css');
+require('./Card-VPMTWAWZ.css');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var CARD_INTERACTIVE_SELECTOR = [
+  "a[href]",
+  "button",
+  "input",
+  "select",
+  "textarea",
+  "[role='button']",
+  "[role='link']",
+  "[contenteditable='true']"
+].join(",");
+function isNestedCardControl(target, currentTarget) {
+  if (!(target instanceof Element)) return false;
+  const control = target.closest(CARD_INTERACTIVE_SELECTOR);
+  return !!control && !control.classList.contains("card-interactive-control") && control !== currentTarget && currentTarget.contains(control);
+}
+function getCardText(node) {
+  return React__namespace.Children.toArray(node).map((child) => {
+    if (typeof child === "string" || typeof child === "number") return String(child);
+    if (React__namespace.isValidElement(child)) {
+      return getCardText(child.props.children);
+    }
+    return "";
+  }).filter(Boolean).join(" ").trim();
+}
+function hasCardControlNode(node) {
+  return React__namespace.Children.toArray(node).some((child) => {
+    if (!React__namespace.isValidElement(child)) return false;
+    const type = child.type;
+    const displayName = typeof type !== "string" && type != null ? type.displayName : void 0;
+    const interactiveType = typeof type === "string" && ["a", "button", "input", "select", "textarea"].includes(type);
+    if (interactiveType || displayName === "Button" || displayName === "IconButton") return true;
+    if (child.props.role === "button" || child.props.role === "link") return true;
+    return hasCardControlNode(child.props.children);
+  });
+}
+function handleCardControlKeyDown(event) {
+  if (event.key !== "Enter" && event.key !== " ") return;
+  event.preventDefault();
+  event.currentTarget.click();
+}
+var CardBase = React__namespace.forwardRef(
+  ({
+    variant = "raised",
+    padding = "md",
+    hoverable,
+    interactive,
+    disabled = false,
+    title,
+    description,
+    actions,
+    background,
+    fill = false,
+    bodyLayout,
+    bodyClassName = "",
+    bodyStyle,
+    bodyProps,
+    loading = false,
+    loadingOverlay,
+    className = "",
+    style,
+    children,
+    onClick,
+    onKeyDown,
+    onClickCapture,
+    onKeyDownCapture,
+    role,
+    tabIndex,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    ...rest
+  }, ref) => {
+    const contentRef = React__namespace.useRef(null);
+    const headRef = React__namespace.useRef(null);
+    const actionsRef = React__namespace.useRef(null);
+    const isInteractive = interactive ?? !!onClick;
+    React__namespace.useEffect(() => {
+      const isolated = disabled || loading;
+      if (contentRef.current) contentRef.current.inert = isolated;
+      if (headRef.current) headRef.current.inert = isolated;
+      if (actionsRef.current) actionsRef.current.inert = isolated;
+    }, [disabled, loading]);
+    const resolvedBodyLayout = bodyLayout ?? (fill ? "fill" : "block");
+    const cls = [
+      "card",
+      variant,
+      padding !== "md" && `pad-${padding}`,
+      fill && "fill",
+      hoverable && !disabled && !loading && "hoverable",
+      isInteractive && "interactive",
+      disabled && "disabled",
+      loading && "loading",
+      className
+    ].filter(Boolean).join(" ");
+    const bodyCls = [
+      "card-body",
+      resolvedBodyLayout !== "block" && `body-${resolvedBodyLayout}`,
+      loading && "loading",
+      bodyClassName
+    ].filter(Boolean).join(" ");
+    const cardStyle = background ? {
+      "--card-bg": background,
+      ...style
+    } : style;
+    const bodyLabel = hasCardControlNode(children) ? "" : getCardText(children);
+    const interactiveLabel = ariaLabel ?? (getCardText(title ?? description) || bodyLabel || "\u53EF\u64CD\u4F5C\u5361\u7247");
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref: (node) => {
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        className: cls,
+        style: cardStyle,
+        role,
+        tabIndex: isInteractive ? void 0 : tabIndex,
+        "aria-label": role ? ariaLabel : void 0,
+        "aria-labelledby": role ? ariaLabelledBy : void 0,
+        "aria-disabled": isInteractive && (disabled || loading) ? true : void 0,
+        "aria-busy": loading || void 0,
+        onClickCapture: (event) => {
+          if (disabled || loading) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+          }
+          onClickCapture?.(event);
+        },
+        onKeyDownCapture: (event) => {
+          if (disabled || loading) {
+            event.preventDefault();
+            event.stopPropagation();
+            return;
+          }
+          onKeyDownCapture?.(event);
+        },
+        onClick: (event) => {
+          if (disabled || loading) {
+            event.preventDefault();
+            return;
+          }
+          if (isNestedCardControl(event.target, event.currentTarget)) return;
+          onClick?.(event);
+        },
+        onKeyDown: (event) => {
+          onKeyDown?.(event);
+          if (isInteractive && !disabled && !loading && !event.defaultPrevented && event.target === event.currentTarget && (event.key === "Enter" || event.key === " ")) {
+            event.preventDefault();
+            event.currentTarget.click();
+          }
+        },
+        ...rest,
+        children: [
+          isInteractive && /* @__PURE__ */ jsxRuntime.jsx(chunkNRJXZPZR_cjs.InternalComponentThemePart, { components: "Button", children: /* @__PURE__ */ jsxRuntime.jsx(
+            chunkT4RR6NVU_cjs.Button,
+            {
+              type: "button",
+              variant: "ghost",
+              className: "card-interactive-control",
+              "aria-label": interactiveLabel,
+              "aria-labelledby": ariaLabelledBy,
+              tabIndex: disabled || loading ? -1 : tabIndex ?? 0,
+              disabled: disabled || loading,
+              onKeyDown: handleCardControlKeyDown
+            }
+          ) }),
+          (title || description || actions) && /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: headRef, className: "card-head", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "card-titles", children: [
+              title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "card-title", children: title }),
+              description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "card-desc", children: description })
+            ] }),
+            actions && /* @__PURE__ */ jsxRuntime.jsx("div", { ref: actionsRef, className: "card-actions", children: actions })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { ...bodyProps, className: bodyCls, style: bodyStyle, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                ref: contentRef,
+                className: "card-body-content",
+                "aria-hidden": loading || void 0,
+                children
+              }
+            ),
+            loading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "card-loading-overlay", "aria-live": "polite", children: loadingOverlay ?? /* @__PURE__ */ jsxRuntime.jsx(chunkNRJXZPZR_cjs.InternalComponentThemePart, { components: "Spin", children: /* @__PURE__ */ jsxRuntime.jsx(chunkRERMZNF3_cjs.Spin, { tip: "\u52A0\u8F7D\u4E2D..." }) }) })
+          ] })
+        ]
+      }
+    );
+  }
+);
+CardBase.displayName = "Card";
+var Card = chunkNRJXZPZR_cjs.withComponentTheme(
+  CardBase,
+  "Card",
+  ["card", "button", "spin"]
+);
+
+exports.Card = Card;

package/dist/{chunk-6K5YI4ZE.js → chunk-62VV5COT.js}

@@ -1,11 +1,12 @@
-import { renderIconSlot, Icon } from './chunk-FDZG27IG.js';
-import './tokens-RYJ3DFTU.css';
+import { renderIconSlot, Icon } from './chunk-LQMOYVQF.js';
+import { withComponentTheme } from './chunk-DRDDQCDD.js';
+import './tokens-CEJVVA3G.css';
 import './shared-NJHRNLRH.css';
-import './Tag-G2XWAL7A.css';
+import './Tag-5GIZLRAH.css';
 import * as React from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var Tag = React.forwardRef(({
+var TagBase = React.forwardRef(({
   tone = "neutral",
   solid,
   dot,
@@ -33,16 +34,25 @@ var Tag = React.forwardRef(({
       {
         className: "x",
         role: "button",
-        "aria-label": "Remove",
+        "aria-label": "\u79FB\u9664",
+        tabIndex: 0,
         onClick: (e) => {
           e.stopPropagation();
           onRemove?.();
         },
+        onKeyDown: (event) => {
+          if (event.key === "Enter" || event.key === " ") {
+            event.preventDefault();
+            event.stopPropagation();
+            onRemove?.();
+          }
+        },
         children: /* @__PURE__ */ jsx(Icon, { name: "x", size: 11 })
       }
     )
   ] });
 });
-Tag.displayName = "Tag";
+TagBase.displayName = "Tag";
+var Tag = withComponentTheme(TagBase, "Tag", "tag");
 
 export { Tag };

package/dist/chunk-6DKPJ5LV.cjs

@@ -0,0 +1,294 @@
+'use strict';
+
+var chunkHSDMJUB6_cjs = require('./chunk-HSDMJUB6.cjs');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+var chunkEE5KXDRK_cjs = require('./chunk-EE5KXDRK.cjs');
+require('./tokens-CEJVVA3G.css');
+require('./shared-NJHRNLRH.css');
+require('./ContextMenu-NG524Y2P.css');
+var React = require('react');
+var ReactDOM = require('react-dom');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
+
+var ESTIMATED_ITEM_H = 32;
+var MARGIN = 8;
+var KEYBOARD_TRIGGER_SELECTOR = [
+  "a[href]",
+  "button:not([disabled])",
+  "input:not([disabled])",
+  "select:not([disabled])",
+  "textarea:not([disabled])",
+  "[tabindex]:not([tabindex='-1'])",
+  "[contenteditable='true']"
+].join(",");
+var ContextMenuBase = React__namespace.forwardRef((props, ref) => {
+  const hasExplicitMinWidth = props.minWidth !== void 0;
+  const {
+    items,
+    children,
+    disabled,
+    minWidth = 180,
+    className = "",
+    style,
+    onContextMenu,
+    onKeyDown,
+    tabIndex,
+    ...rest
+  } = props;
+  const portalContainer = chunkEE5KXDRK_cjs.usePortalContainer();
+  const portalTheme = chunkNRJXZPZR_cjs.useComponentPortalTheme("ContextMenu");
+  const [open, setOpen] = React__namespace.useState(false);
+  const [pos, setPos] = React__namespace.useState({ top: 0, left: 0 });
+  const [active, setActive] = React__namespace.useState(-1);
+  const [useWrapperKeyboardFallback, setUseWrapperKeyboardFallback] = React__namespace.useState(false);
+  const menuRef = React__namespace.useRef(null);
+  const triggerRef = React__namespace.useRef(null);
+  const returnFocusRef = React__namespace.useRef(null);
+  const overlayZIndex = chunkHSDMJUB6_cjs.useOverlayZIndex(open);
+  const isSelectable = React__namespace.useCallback(
+    (i) => i.type !== "divider" && !i.disabled,
+    []
+  );
+  const close = React__namespace.useCallback(() => setOpen(false), []);
+  const closeAndRestoreFocus = React__namespace.useCallback(() => {
+    close();
+    window.requestAnimationFrame(() => {
+      if (returnFocusRef.current?.isConnected) returnFocusRef.current.focus();
+    });
+  }, [close]);
+  React__namespace.useEffect(() => {
+    if (disabled && open) closeAndRestoreFocus();
+  }, [closeAndRestoreFocus, disabled, open]);
+  chunkHSDMJUB6_cjs.useOverlayLayer({
+    open: open && portalContainer != null,
+    containerRef: menuRef,
+    ownerRef: triggerRef,
+    zIndex: overlayZIndex,
+    onEscape: closeAndRestoreFocus
+  });
+  React__namespace.useLayoutEffect(() => {
+    const wrapper = triggerRef.current;
+    if (!wrapper || disabled) {
+      setUseWrapperKeyboardFallback(false);
+      return;
+    }
+    if (wrapper.querySelector(KEYBOARD_TRIGGER_SELECTOR)) {
+      setUseWrapperKeyboardFallback(false);
+      return;
+    }
+    const HTMLElementConstructor = wrapper.ownerDocument.defaultView?.HTMLElement;
+    const candidate = Array.from(wrapper.children).find(
+      (child) => !!HTMLElementConstructor && child instanceof HTMLElementConstructor && !child.hasAttribute("tabindex") && !child.matches("button:disabled,input:disabled,select:disabled,textarea:disabled")
+    );
+    if (!candidate) {
+      setUseWrapperKeyboardFallback(true);
+      return;
+    }
+    setUseWrapperKeyboardFallback(false);
+    candidate.setAttribute("tabindex", "0");
+    return () => {
+      if (candidate.getAttribute("tabindex") === "0") candidate.removeAttribute("tabindex");
+    };
+  }, [children, disabled]);
+  const openAt = (clientX, clientY) => {
+    returnFocusRef.current = document.activeElement;
+    const vw = window.innerWidth;
+    const vh = window.innerHeight;
+    const estH = Math.min(items.length * ESTIMATED_ITEM_H + 16, vh - MARGIN * 2);
+    const estW = minWidth;
+    const left = Math.min(clientX, vw - estW - MARGIN);
+    const top = Math.min(clientY, vh - estH - MARGIN);
+    setPos({ top: Math.max(MARGIN, top), left: Math.max(MARGIN, left) });
+    const firstIdx = items.findIndex(isSelectable);
+    setActive(firstIdx);
+    setOpen(true);
+  };
+  React__namespace.useEffect(() => {
+    if (!open) return;
+    const onOutside = (e) => {
+      if (!menuRef.current?.contains(e.target)) close();
+    };
+    const onBlur = () => close();
+    window.addEventListener("mousedown", onOutside);
+    window.addEventListener("scroll", close, true);
+    window.addEventListener("resize", close);
+    window.addEventListener("blur", onBlur);
+    return () => {
+      window.removeEventListener("mousedown", onOutside);
+      window.removeEventListener("scroll", close, true);
+      window.removeEventListener("resize", close);
+      window.removeEventListener("blur", onBlur);
+    };
+  }, [open, close]);
+  React__namespace.useEffect(() => {
+    if (!open || active < 0) return;
+    const frame = window.requestAnimationFrame(() => {
+      menuRef.current?.querySelector(`[data-context-index="${active}"]`)?.focus();
+    });
+    return () => window.cancelAnimationFrame(frame);
+  }, [open, active]);
+  React__namespace.useLayoutEffect(() => {
+    if (!open || !menuRef.current) return;
+    const rect = menuRef.current.getBoundingClientRect();
+    const vw = window.innerWidth;
+    const vh = window.innerHeight;
+    setPos((p) => ({
+      top: Math.min(p.top, Math.max(MARGIN, vh - rect.height - MARGIN)),
+      left: Math.min(p.left, Math.max(MARGIN, vw - rect.width - MARGIN))
+    }));
+  }, [open]);
+  const handleTriggerContextMenu = (e) => {
+    if (disabled || e.defaultPrevented) return;
+    e.preventDefault();
+    openAt(e.clientX, e.clientY);
+  };
+  const handleMenuKeyDown = (e) => {
+    if (e.key === "Tab") {
+      close();
+      return;
+    }
+    if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+      e.preventDefault();
+      setActive((current) => {
+        const direction = e.key === "ArrowDown" ? 1 : -1;
+        let index = current;
+        for (let count = 0; count < items.length; count += 1) {
+          index = (index + direction + items.length) % items.length;
+          if (isSelectable(items[index])) return index;
+        }
+        return current;
+      });
+      return;
+    }
+    if (e.key === "Home" || e.key === "End") {
+      e.preventDefault();
+      const indexes = items.map((item, index) => ({ item, index })).filter(({ item }) => isSelectable(item));
+      const target = e.key === "Home" ? indexes[0] : indexes[indexes.length - 1];
+      if (target) setActive(target.index);
+      return;
+    }
+    if (e.key === "Enter") {
+      const item = items[active];
+      if (!disabled && item && isSelectable(item)) {
+        e.preventDefault();
+        item.onSelect?.();
+        closeAndRestoreFocus();
+      }
+    }
+  };
+  const trigger = /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      ref: (node) => {
+        triggerRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      className,
+      tabIndex: tabIndex ?? (useWrapperKeyboardFallback && !disabled ? 0 : void 0),
+      style: { display: useWrapperKeyboardFallback || tabIndex != null ? "inline-block" : "contents", ...style },
+      onContextMenu: (e) => {
+        onContextMenu?.(e);
+        handleTriggerContextMenu(e);
+      },
+      onKeyDown: (e) => {
+        onKeyDown?.(e);
+        if (e.defaultPrevented) return;
+        if (e.key === "ContextMenu" || e.shiftKey && e.key === "F10") {
+          e.preventDefault();
+          const target = e.target;
+          const rect = target.getBoundingClientRect();
+          openAt(rect.left + Math.min(12, rect.width / 2), rect.bottom);
+        }
+      },
+      ...rest,
+      children
+    }
+  );
+  const panel = open && portalContainer ? ReactDOM__default.default.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref: menuRef,
+        className: "context-menu",
+        role: "menu",
+        "aria-label": "\u4E0A\u4E0B\u6587\u83DC\u5355",
+        tabIndex: -1,
+        onKeyDown: handleMenuKeyDown,
+        ...portalTheme.dataAttributes,
+        style: {
+          position: "fixed",
+          top: pos.top,
+          left: pos.left,
+          ...portalTheme.style,
+          minWidth,
+          ...portalTheme.styles.popup,
+          ...hasExplicitMinWidth ? { minWidth } : null,
+          zIndex: overlayZIndex
+        },
+        onContextMenu: (e) => e.preventDefault(),
+        children: items.map(
+          (it, i) => it.type === "divider" ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "context-menu-divider", role: "separator" }, it.key) : /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              role: "menuitem",
+              "data-context-index": i,
+              tabIndex: active === i ? 0 : -1,
+              disabled: it.disabled,
+              className: `context-menu-item ${active === i ? "active" : ""} ${it.danger ? "danger" : ""}`,
+              onMouseEnter: () => isSelectable(it) && setActive(i),
+              onClick: () => {
+                if (disabled || !isSelectable(it)) return;
+                it.onSelect?.();
+                closeAndRestoreFocus();
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "context-menu-icon", children: it.icon }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "context-menu-label", children: it.label }),
+                it.shortcut && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "context-menu-shortcut", children: it.shortcut })
+              ]
+            },
+            it.key
+          )
+        )
+      }
+    ),
+    portalContainer
+  ) : null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    trigger,
+    panel
+  ] });
+});
+ContextMenuBase.displayName = "ContextMenu";
+var ContextMenu = chunkNRJXZPZR_cjs.withComponentTheme(
+  ContextMenuBase,
+  "ContextMenu",
+  "context-menu"
+);
+
+exports.ContextMenu = ContextMenu;

package/dist/{chunk-OTSDPQPV.js → chunk-6RQJXSWN.js}

@@ -1,11 +1,12 @@
-import { Spin } from './chunk-FYSXJXNW.js';
-import './tokens-RYJ3DFTU.css';
+import { Spin } from './chunk-PQOBBASY.js';
+import { withComponentTheme, InternalComponentThemePart } from './chunk-DRDDQCDD.js';
+import './tokens-CEJVVA3G.css';
 import './shared-NJHRNLRH.css';
-import './Timeline-CRFZ3I2W.css';
+import './Timeline-FUFO2UGY.css';
 import * as React from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var Timeline = React.forwardRef(
+var TimelineBase = React.forwardRef(
   ({
     items,
     pending = false,
@@ -27,7 +28,10 @@ var Timeline = React.forwardRef(
     style,
     ...rest
   }, ref) => {
-    const displayItems = [...items];
+    const displayItems = items.map((item, sourceIndex) => ({
+      item,
+      key: item.key ?? `timeline-item-${sourceIndex}`
+    }));
     if (reverse) displayItems.reverse();
     const hasPending = pending !== false;
     const timelineStyle = {
@@ -52,9 +56,11 @@ var Timeline = React.forwardRef(
         ref,
         className: `timeline timeline-${mode} timeline-dot-${dotAlign} ${className}`,
         style: timelineStyle,
+        role: "list",
+        "aria-busy": hasPending || void 0,
         ...rest,
         children: [
-          displayItems.map((item, i) => /* @__PURE__ */ jsx(
+          displayItems.map(({ item, key }, i) => /* @__PURE__ */ jsx(
             TimelineItem,
             {
               item,
@@ -62,7 +68,7 @@ var Timeline = React.forwardRef(
               position: getPosition(mode, i),
               ...sharedItemProps
             },
-            item.key ?? i
+            key
           )),
           hasPending && /* @__PURE__ */ jsx(
             TimelineItem,
@@ -83,7 +89,12 @@ var Timeline = React.forwardRef(
     );
   }
 );
-Timeline.displayName = "Timeline";
+TimelineBase.displayName = "Timeline";
+var Timeline = withComponentTheme(
+  TimelineBase,
+  "Timeline",
+  ["timeline", "spin"]
+);
 function getPosition(mode, index) {
   if (mode === "left") return "left";
   if (mode === "right") return "right";
@@ -121,28 +132,37 @@ var TimelineItem = ({
     item.dotClassName
   ].filter(Boolean).join(" ");
   const dotAlignStyle = dotAlign === "start" ? { alignSelf: "flex-start" } : dotAlign === "end" ? { alignSelf: "flex-end" } : {};
-  return /* @__PURE__ */ jsxs("div", { className: cls, style: { ...itemStyle, ...item.style }, children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: `timeline-item-label ${labelClassName ?? ""} ${item.labelClassName ?? ""}`,
-        style: { ...labelStyle, ...item.labelStyle },
-        children: item.label
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "timeline-item-head", children: [
-      /* @__PURE__ */ jsx("div", { className: dotCls, style: { ...dotAlignStyle, ...dotStyle, ...item.dotStyle }, children: item.dot ?? (isPending && /* @__PURE__ */ jsx(Spin, { size: 14 })) }),
-      !isLast && /* @__PURE__ */ jsx("div", { className: "timeline-item-tail" })
-    ] }),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: `timeline-item-content ${contentClassName ?? ""} ${item.contentClassName ?? ""}`,
-        style: { ...contentStyle, ...item.contentStyle },
-        children: item.children
-      }
-    )
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cls,
+      style: { ...itemStyle, ...item.style },
+      role: "listitem",
+      "aria-live": isPending ? "polite" : void 0,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `timeline-item-label ${labelClassName ?? ""} ${item.labelClassName ?? ""}`,
+            style: { ...labelStyle, ...item.labelStyle },
+            children: item.label
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "timeline-item-head", children: [
+          /* @__PURE__ */ jsx("div", { className: dotCls, style: { ...dotAlignStyle, ...dotStyle, ...item.dotStyle }, children: item.dot ?? (isPending && /* @__PURE__ */ jsx(InternalComponentThemePart, { components: "Spin", children: /* @__PURE__ */ jsx(Spin, { size: 14 }) })) }),
+          !isLast && /* @__PURE__ */ jsx("div", { className: "timeline-item-tail" })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `timeline-item-content ${contentClassName ?? ""} ${item.contentClassName ?? ""}`,
+            style: { ...contentStyle, ...item.contentStyle },
+            children: item.children
+          }
+        )
+      ]
+    }
+  );
 };
 function toCssSize(value) {
   return typeof value === "number" ? `${value}px` : String(value);