@sia.soul/sia-react-ui 0.1.23 → 0.1.24

package/dist/{chunk-NPB33IXJ.js → chunk-LIYCU2GU.js}

@@ -1,26 +1,96 @@
 import {
   TextArea
-} from "./chunk-YT6E3X2K.js";
+} from "./chunk-OH6YILJW.js";
 import {
   Popover,
   Tooltip,
   useOverlayLifecycle
-} from "./chunk-VX2JECOU.js";
+} from "./chunk-6R7JY7IY.js";
 import {
   Dropdown,
   Icon
-} from "./chunk-KLI65JVD.js";
+} from "./chunk-LRPQ5FGE.js";
 import {
   Button
-} from "./chunk-TZGUBGA4.js";
+} from "./chunk-6WBABNAX.js";
 import {
   useControlSize,
-  useControllableState
-} from "./chunk-3VJ4CZDQ.js";
+  useControllableState,
+  withTitleTooltip
+} from "./chunk-NSSPGXNM.js";
+
+// src/components/Toolbar.tsx
+import { useLayoutEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Toolbar({ items, onAction, disabled = false, size = "small", variant = "link", overflowLabel = "\u66F4\u591A\u64CD\u4F5C" }) {
+  const root = useRef(null);
+  const [visibleCount, setVisibleCount] = useState(Number.MAX_SAFE_INTEGER);
+  const visibleItems = items.filter((item) => !item.hidden);
+  useLayoutEffect(() => {
+    const element = root.current;
+    if (!element) return;
+    const buttons = Array.from(element.querySelectorAll("[data-sia-toolbar-item]"));
+    const more = element.querySelector("[data-sia-toolbar-more]");
+    const measure = () => {
+      const gap = parseFloat(getComputedStyle(element).columnGap) || 0;
+      const widths = buttons.map((button) => button.getBoundingClientRect().width);
+      const total = widths.reduce((sum, width) => sum + width, 0) + Math.max(0, widths.length - 1) * gap;
+      let count = widths.length;
+      if (total > element.clientWidth) {
+        const budget = element.clientWidth - (more?.getBoundingClientRect().width ?? 30);
+        let used = 0;
+        count = 0;
+        for (const width of widths) {
+          if (used + width + gap > budget) break;
+          used += width + gap;
+          count++;
+        }
+      }
+      setVisibleCount((previous) => previous === count ? previous : count);
+    };
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(element);
+    buttons.forEach((button) => observer.observe(button));
+    return () => observer.disconnect();
+  }, [items, size, variant]);
+  const blocked = (item) => disabled || Boolean(item.disabled || item.loading);
+  const invoke = (key) => {
+    const find = (entries) => {
+      for (const item of entries) {
+        if (item.hidden || blocked(item)) continue;
+        if (item.key === key) return item;
+        const child = item.children && find(item.children);
+        if (child) return child;
+      }
+    };
+    if (find(items)) void onAction?.(key);
+  };
+  const menuItems = (entries) => entries.filter((item) => !item.hidden).map((item) => ({
+    key: item.children?.length ? `toolbar-menu:${item.key}` : item.key,
+    label: item.label,
+    icon: item.icon,
+    disabled: blocked(item),
+    danger: item.danger,
+    children: item.children?.length ? [
+      ...item.split ? [{ key: item.key, label: item.label, icon: item.icon, disabled: blocked(item) }] : [],
+      ...menuItems(item.children)
+    ] : void 0
+  }));
+  const overflow = visibleItems.slice(visibleCount);
+  return /* @__PURE__ */ jsxs("div", { ref: root, className: "sia-toolbar", role: "toolbar", children: [
+    visibleItems.map((item, index) => {
+      const buttonProps = { size, variant, icon: item.icon, disabled: blocked(item), loading: item.loading, danger: item.danger };
+      const menu = { items: menuItems(item.children ?? []), onClick: ({ key }) => invoke(key) };
+      return /* @__PURE__ */ jsx("span", { "data-sia-toolbar-item": true, className: `sia-toolbar__item${index >= visibleCount ? " sia-toolbar__item--hidden" : ""}`, "aria-hidden": index >= visibleCount || void 0, children: item.children?.length ? item.split ? /* @__PURE__ */ jsx(Dropdown.Button, { trigger: ["hover"], menu, disabled: blocked(item), buttonProps, onClick: () => invoke(item.key), children: item.label }) : /* @__PURE__ */ jsx(Dropdown, { trigger: ["hover"], menu, children: /* @__PURE__ */ jsx(Button, { ...buttonProps, children: item.label }) }) : /* @__PURE__ */ jsx(Button, { ...buttonProps, onClick: () => invoke(item.key), children: item.label }) }, item.key);
+    }),
+    /* @__PURE__ */ jsx("span", { "data-sia-toolbar-more": true, className: `sia-toolbar__item${overflow.length ? "" : " sia-toolbar__item--hidden"}`, "aria-hidden": !overflow.length || void 0, children: /* @__PURE__ */ jsx(Dropdown, { trigger: ["hover"], menu: { items: menuItems(overflow), onClick: ({ key }) => invoke(key) }, children: /* @__PURE__ */ jsx(Button, { size, variant, disabled, "aria-label": overflowLabel, title: overflowLabel, icon: /* @__PURE__ */ jsx(Icon, { name: "more-horizontal", size: 16 }) }) }) })
+  ] });
+}
 
 // src/components/Card.tsx
-import { useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState as useState2 } from "react";
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function Card({
   title,
   description,
@@ -39,7 +109,7 @@ function Card({
   children,
   ...props
 }) {
-  const [internalCollapsed, setInternalCollapsed] = useState(defaultCollapsed);
+  const [internalCollapsed, setInternalCollapsed] = useState2(defaultCollapsed);
   const isCollapsed = collapsed ?? internalCollapsed;
   const hasHeader = title || extra || collapsible;
   const mergedStyle = accentColor ? { "--sia-card-accent": accentColor, ...style } : style;
@@ -49,27 +119,27 @@ function Card({
     if (collapsed === void 0) setInternalCollapsed(nextCollapsed);
     onCollapsedChange?.(nextCollapsed);
   }
-  const heading = /* @__PURE__ */ jsxs("span", { className: "sia-card__heading", children: [
-    accent || accentColor ? /* @__PURE__ */ jsx("span", { className: `sia-card__accent${accent ? ` sia-card__accent--${accent}` : ""}`, "aria-hidden": "true" }) : null,
-    title ? /* @__PURE__ */ jsx("h3", { className: "sia-card__title", children: title }) : null
+  const heading = /* @__PURE__ */ jsxs2("span", { className: "sia-card__heading", children: [
+    accent || accentColor ? /* @__PURE__ */ jsx2("span", { className: `sia-card__accent${accent ? ` sia-card__accent--${accent}` : ""}`, "aria-hidden": "true" }) : null,
+    title ? /* @__PURE__ */ jsx2("h3", { className: "sia-card__title", children: title }) : null
   ] });
-  return /* @__PURE__ */ jsxs("section", { className: `sia-card${isCollapsed ? " sia-card--collapsed" : ""} ${className}`.trim(), style: mergedStyle, ...props, children: [
-    hasHeader ? /* @__PURE__ */ jsxs("header", { className: "sia-card__header", children: [
-      collapsible ? /* @__PURE__ */ jsxs("button", { type: "button", className: "sia-card__collapse-trigger", "aria-expanded": !isCollapsed, onClick: toggleCollapsed, children: [
+  return /* @__PURE__ */ jsxs2("section", { className: `sia-card${isCollapsed ? " sia-card--collapsed" : ""} ${className}`.trim(), style: mergedStyle, ...withTitleTooltip(props), children: [
+    hasHeader ? /* @__PURE__ */ jsxs2("header", { className: "sia-card__header", children: [
+      collapsible ? /* @__PURE__ */ jsxs2("button", { type: "button", className: "sia-card__collapse-trigger", "aria-expanded": !isCollapsed, onClick: toggleCollapsed, children: [
         heading,
-        /* @__PURE__ */ jsx(Icon, { name: isCollapsed ? "chevron-down" : "chevron-up", size: 16 })
+        /* @__PURE__ */ jsx2(Icon, { name: isCollapsed ? "chevron-down" : "chevron-up", size: 16 })
       ] }) : heading,
-      extra ? /* @__PURE__ */ jsx("div", { className: "sia-card__extra", children: extra }) : null
+      extra ? /* @__PURE__ */ jsx2("div", { className: "sia-card__extra", children: extra }) : null
     ] }) : null,
-    !isCollapsed ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      description ? /* @__PURE__ */ jsx("p", { className: "sia-card__description", children: description }) : null,
-      /* @__PURE__ */ jsx("div", { className: `sia-card__body ${bodyClassName}`.trim(), style: mergedBodyStyle, children })
+    !isCollapsed ? /* @__PURE__ */ jsxs2(Fragment, { children: [
+      description ? /* @__PURE__ */ jsx2("p", { className: "sia-card__description", children: description }) : null,
+      /* @__PURE__ */ jsx2("div", { className: `sia-card__body ${bodyClassName}`.trim(), style: mergedBodyStyle, children })
     ] }) : null
   ] });
 }
 
 // src/components/Tag.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 function Tag({
   status = "default",
   compact = false,
@@ -83,16 +153,16 @@ function Tag({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs3(
     "span",
     {
       className: `sia-tag${closable && closeOnHover ? " sia-tag--close-on-hover" : ""} sia-tag--${status} sia-tag--${variant}${compact ? " sia-tag--compact" : ""}${disabled ? " sia-tag--disabled" : ""} ${className}`.trim(),
       "aria-disabled": disabled || void 0,
-      ...props,
+      ...withTitleTooltip(props),
       children: [
-        icon ? /* @__PURE__ */ jsx2("span", { className: "sia-tag__icon", children: icon }) : null,
-        /* @__PURE__ */ jsx2("span", { children }),
-        closable ? /* @__PURE__ */ jsx2(
+        icon ? /* @__PURE__ */ jsx3("span", { className: "sia-tag__icon", children: icon }) : null,
+        /* @__PURE__ */ jsx3("span", { children }),
+        closable ? /* @__PURE__ */ jsx3(
           "button",
           {
             type: "button",
@@ -103,7 +173,7 @@ function Tag({
               event.stopPropagation();
               onClose?.(event);
             },
-            children: /* @__PURE__ */ jsx2(Icon, { name: "close", size: 12 })
+            children: /* @__PURE__ */ jsx3(Icon, { name: "close", size: 12 })
           }
         ) : null
       ]
@@ -112,8 +182,8 @@ function Tag({
 }
 
 // src/components/Tabs.tsx
-import { useId, useLayoutEffect, useMemo, useRef, useState as useState2 } from "react";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { useId, useLayoutEffect as useLayoutEffect2, useMemo, useRef as useRef2, useState as useState3 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function Tabs({
   items,
   activeKey,
@@ -135,7 +205,7 @@ function Tabs({
   ...props
 }) {
   const firstEnabledKey = items.find((item) => !item.disabled)?.key ?? "";
-  const [internalActiveKey, setInternalActiveKey] = useState2(defaultActiveKey ?? firstEnabledKey);
+  const [internalActiveKey, setInternalActiveKey] = useState3(defaultActiveKey ?? firstEnabledKey);
   const currentKey = activeKey ?? internalActiveKey;
   const selectedKey = items.some((item) => item.key === currentKey && !item.disabled) ? currentKey : firstEnabledKey;
   const baseId = useId().replace(/:/g, "");
@@ -143,9 +213,9 @@ function Tabs({
   const resolvedPosition = tabPosition ?? (orientation === "vertical" ? "left" : "top");
   const resolvedOrientation = resolvedPosition === "left" || resolvedPosition === "right" ? "vertical" : "horizontal";
   const sliding = ["capsule", "line", "underline", "tech", "tech-line"].includes(type);
-  const listRef = useRef(null);
-  const indicatorRef = useRef(null);
-  useLayoutEffect(() => {
+  const listRef = useRef2(null);
+  const indicatorRef = useRef2(null);
+  useLayoutEffect2(() => {
     if (!sliding) return;
     const list = listRef.current;
     const indicator = indicatorRef.current;
@@ -196,25 +266,25 @@ function Tabs({
     focusAndSelect(enabledItems[nextIndex].key);
   }
   const hasPanels = items.some((item) => item.children !== void 0);
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4(
     "div",
     {
       className: `sia-tabs sia-tabs--${type}${type === "underline" ? " sia-tabs--line" : ""} sia-tabs--${size} sia-tabs--${resolvedOrientation} sia-tabs--${resolvedPosition}${centered ? " sia-tabs--centered" : ""} ${className}`.trim(),
-      ...props,
+      ...withTitleTooltip(props),
       children: [
-        /* @__PURE__ */ jsxs3("div", { className: "sia-tabs__header", children: [
-          tabBarTitle ? /* @__PURE__ */ jsxs3("div", { className: "sia-tabs__title", children: [
+        /* @__PURE__ */ jsxs4("div", { className: "sia-tabs__header", children: [
+          tabBarTitle ? /* @__PURE__ */ jsxs4("div", { className: "sia-tabs__title", children: [
             tabBarTitle,
-            type === "tech-line" ? /* @__PURE__ */ jsx3("svg", { className: "sia-tabs__title-connector", viewBox: "0 0 32 40", "aria-hidden": "true", children: /* @__PURE__ */ jsx3("path", { d: "M0 39 H5 Q8 39 10 35 L28 3 Q29 1 32 1", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }) }) : null
+            type === "tech-line" ? /* @__PURE__ */ jsx4("svg", { className: "sia-tabs__title-connector", viewBox: "0 0 32 40", "aria-hidden": "true", children: /* @__PURE__ */ jsx4("path", { d: "M0 39 H5 Q8 39 10 35 L28 3 Q29 1 32 1", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }) }) : null
           ] }) : null,
-          /* @__PURE__ */ jsxs3("div", { ref: listRef, className: `sia-tabs__list${sliding ? " sia-tabs__list--sliding" : ""}`, role: "tablist", "aria-orientation": resolvedOrientation, children: [
-            sliding ? /* @__PURE__ */ jsx3("span", { ref: indicatorRef, className: `sia-tabs__indicator${type === "capsule" ? " sia-tabs__capsule-indicator" : ""}`, "aria-hidden": "true", children: type === "tech-line" ? /* @__PURE__ */ jsxs3("svg", { className: "sia-tabs__indicator-shape", viewBox: "0 0 100 34", preserveAspectRatio: "none", "aria-hidden": "true", children: [
-              /* @__PURE__ */ jsx3("defs", { children: /* @__PURE__ */ jsxs3("linearGradient", { id: `${baseId}-tab-fill-indicator`, x1: "0", y1: "0", x2: "1", y2: "0", children: [
-                /* @__PURE__ */ jsx3("stop", { offset: "0", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" }),
-                /* @__PURE__ */ jsx3("stop", { offset: ".53", stopColor: "var(--sia-tabs-line-fill-center, var(--sia-tabs-line-fill))" }),
-                /* @__PURE__ */ jsx3("stop", { offset: "1", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" })
+          /* @__PURE__ */ jsxs4("div", { ref: listRef, className: `sia-tabs__list${sliding ? " sia-tabs__list--sliding" : ""}`, role: "tablist", "aria-orientation": resolvedOrientation, children: [
+            sliding ? /* @__PURE__ */ jsx4("span", { ref: indicatorRef, className: `sia-tabs__indicator${type === "capsule" ? " sia-tabs__capsule-indicator" : ""}`, "aria-hidden": "true", children: type === "tech-line" ? /* @__PURE__ */ jsxs4("svg", { className: "sia-tabs__indicator-shape", viewBox: "0 0 100 34", preserveAspectRatio: "none", "aria-hidden": "true", children: [
+              /* @__PURE__ */ jsx4("defs", { children: /* @__PURE__ */ jsxs4("linearGradient", { id: `${baseId}-tab-fill-indicator`, x1: "0", y1: "0", x2: "1", y2: "0", children: [
+                /* @__PURE__ */ jsx4("stop", { offset: "0", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" }),
+                /* @__PURE__ */ jsx4("stop", { offset: ".53", stopColor: "var(--sia-tabs-line-fill-center, var(--sia-tabs-line-fill))" }),
+                /* @__PURE__ */ jsx4("stop", { offset: "1", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" })
               ] }) }),
-              /* @__PURE__ */ jsx3(
+              /* @__PURE__ */ jsx4(
                 "path",
                 {
                   d: "M19 1 H96 Q99 1 97.5 4 L83.5 30 Q82 33 79 33 H4 Q1 33 2.5 30 L16.5 4 Q18 1 19 1 Z",
@@ -228,8 +298,8 @@ function Tabs({
             items.map((item) => {
               const selected = item.key === selectedKey;
               const canClose = item.closable ?? closable;
-              const tabNode = /* @__PURE__ */ jsxs3("span", { className: `sia-tabs__tab-wrap${canClose ? " is-closable" : ""}`, children: [
-                /* @__PURE__ */ jsxs3(
+              const tabNode = /* @__PURE__ */ jsxs4("span", { className: `sia-tabs__tab-wrap${canClose ? " is-closable" : ""}`, children: [
+                /* @__PURE__ */ jsxs4(
                   "button",
                   {
                     id: `${baseId}-tab-${item.key}`,
@@ -243,13 +313,13 @@ function Tabs({
                     onClick: () => selectTab(item.key),
                     onKeyDown: (event) => handleKeyDown(event, item.key),
                     children: [
-                      type === "tech-line" ? /* @__PURE__ */ jsxs3("svg", { className: "sia-tabs__tab-shape", viewBox: "0 0 100 34", preserveAspectRatio: "none", "aria-hidden": "true", children: [
-                        /* @__PURE__ */ jsx3("defs", { children: /* @__PURE__ */ jsxs3("linearGradient", { id: `${baseId}-tab-fill-${item.key}`, x1: "0", y1: "0", x2: "1", y2: "0", children: [
-                          /* @__PURE__ */ jsx3("stop", { offset: "0", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" }),
-                          /* @__PURE__ */ jsx3("stop", { offset: ".53", stopColor: "var(--sia-tabs-line-fill-center, var(--sia-tabs-line-fill))" }),
-                          /* @__PURE__ */ jsx3("stop", { offset: "1", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" })
+                      type === "tech-line" ? /* @__PURE__ */ jsxs4("svg", { className: "sia-tabs__tab-shape", viewBox: "0 0 100 34", preserveAspectRatio: "none", "aria-hidden": "true", children: [
+                        /* @__PURE__ */ jsx4("defs", { children: /* @__PURE__ */ jsxs4("linearGradient", { id: `${baseId}-tab-fill-${item.key}`, x1: "0", y1: "0", x2: "1", y2: "0", children: [
+                          /* @__PURE__ */ jsx4("stop", { offset: "0", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" }),
+                          /* @__PURE__ */ jsx4("stop", { offset: ".53", stopColor: "var(--sia-tabs-line-fill-center, var(--sia-tabs-line-fill))" }),
+                          /* @__PURE__ */ jsx4("stop", { offset: "1", stopColor: "var(--sia-tabs-line-fill-edge, var(--sia-tabs-line-fill))" })
                         ] }) }),
-                        /* @__PURE__ */ jsx3(
+                        /* @__PURE__ */ jsx4(
                           "path",
                           {
                             d: "M19 1 H96 Q99 1 97.5 4 L83.5 30 Q82 33 79 33 H4 Q1 33 2.5 30 L16.5 4 Q18 1 19 1 Z",
@@ -260,12 +330,12 @@ function Tabs({
                           }
                         )
                       ] }) : null,
-                      item.icon ? /* @__PURE__ */ jsx3("span", { className: "sia-tabs__icon", children: item.icon }) : null,
-                      /* @__PURE__ */ jsx3("span", { children: item.label })
+                      item.icon ? /* @__PURE__ */ jsx4("span", { className: "sia-tabs__icon", children: item.icon }) : null,
+                      /* @__PURE__ */ jsx4("span", { children: item.label })
                     ]
                   }
                 ),
-                canClose ? /* @__PURE__ */ jsx3(
+                canClose ? /* @__PURE__ */ jsx4(
                   "button",
                   {
                     type: "button",
@@ -273,13 +343,13 @@ function Tabs({
                     "aria-label": `\u5173\u95ED${typeof item.label === "string" ? item.label : "\u6807\u7B7E\u9875"}`,
                     disabled: item.disabled,
                     onClick: () => onEdit?.(item.key, "remove"),
-                    children: /* @__PURE__ */ jsx3(Icon, { name: "close", size: 12 })
+                    children: /* @__PURE__ */ jsx4(Icon, { name: "close", size: 12 })
                   }
                 ) : null
               ] }, item.key);
               const contextMenuItems = typeof tabContextMenu === "function" ? tabContextMenu(item) : tabContextMenu;
               if (!contextMenuItems?.length) return tabNode;
-              return /* @__PURE__ */ jsx3(
+              return /* @__PURE__ */ jsx4(
                 Dropdown,
                 {
                   className: "sia-tabs__tab-context-trigger",
@@ -297,12 +367,12 @@ function Tabs({
               );
             })
           ] }),
-          tabBarExtraContent ? /* @__PURE__ */ jsx3("div", { className: "sia-tabs__extra", children: tabBarExtraContent }) : null
+          tabBarExtraContent ? /* @__PURE__ */ jsx4("div", { className: "sia-tabs__extra", children: tabBarExtraContent }) : null
         ] }),
-        hasPanels ? /* @__PURE__ */ jsx3("div", { className: "sia-tabs__panels", children: items.map((item) => {
+        hasPanels ? /* @__PURE__ */ jsx4("div", { className: "sia-tabs__panels", children: items.map((item) => {
           const selected = item.key === selectedKey;
           if (destroyInactiveTabPane && !selected) return null;
-          return /* @__PURE__ */ jsx3(
+          return /* @__PURE__ */ jsx4(
             "div",
             {
               id: `${baseId}-panel-${item.key}`,
@@ -322,10 +392,10 @@ function Tabs({
 }
 
 // src/components/Feedback.tsx
-import { useEffect, useMemo as useMemo2, useState as useState3 } from "react";
+import { useEffect, useMemo as useMemo2, useState as useState4 } from "react";
 import { createPortal } from "react-dom";
 import { createRoot } from "react-dom/client";
-import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function Popconfirm({
   children,
   title,
@@ -340,28 +410,28 @@ function Popconfirm({
   defaultOpen = false,
   disabled = false,
   showCancel = true,
-  icon = /* @__PURE__ */ jsx4(Icon, { name: "question", variant: "filled" }),
+  icon = /* @__PURE__ */ jsx5(Icon, { name: "question", variant: "filled" }),
   onConfirm,
   onCancel,
   onOpenChange
 }) {
   const [visible, setVisible] = useControllableState({ value: open, defaultValue: defaultOpen, onChange: onOpenChange });
-  const [loading, setLoading] = useState3(false);
-  const content = /* @__PURE__ */ jsxs4("div", { className: "sia-popconfirm", children: [
-    /* @__PURE__ */ jsxs4("div", { className: "sia-popconfirm__message", children: [
-      /* @__PURE__ */ jsx4("span", { children: icon }),
-      /* @__PURE__ */ jsxs4("div", { children: [
-        /* @__PURE__ */ jsx4("strong", { children: title }),
-        description ? /* @__PURE__ */ jsx4("p", { children: description }) : null
+  const [loading, setLoading] = useState4(false);
+  const content = /* @__PURE__ */ jsxs5("div", { className: "sia-popconfirm", children: [
+    /* @__PURE__ */ jsxs5("div", { className: "sia-popconfirm__message", children: [
+      /* @__PURE__ */ jsx5("span", { children: icon }),
+      /* @__PURE__ */ jsxs5("div", { children: [
+        /* @__PURE__ */ jsx5("strong", { children: title }),
+        description ? /* @__PURE__ */ jsx5("p", { children: description }) : null
       ] })
     ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "sia-popconfirm__actions", children: [
-      showCancel ? /* @__PURE__ */ jsx4(Button, { size: "small", ...cancelButtonProps, onClick: (event) => {
+    /* @__PURE__ */ jsxs5("div", { className: "sia-popconfirm__actions", children: [
+      showCancel ? /* @__PURE__ */ jsx5(Button, { size: "small", ...cancelButtonProps, onClick: (event) => {
         cancelButtonProps?.onClick?.(event);
         onCancel?.(event);
         setVisible(false);
       }, children: cancelText }) : null,
-      /* @__PURE__ */ jsx4(Button, { size: "small", variant: "primary", ...okButtonProps, loading: loading || okButtonProps?.loading, onClick: async (event) => {
+      /* @__PURE__ */ jsx5(Button, { size: "small", variant: "primary", ...okButtonProps, loading: loading || okButtonProps?.loading, onClick: async (event) => {
         okButtonProps?.onClick?.(event);
         const result = onConfirm?.(event);
         if (result instanceof Promise) {
@@ -375,7 +445,7 @@ function Popconfirm({
       }, children: okText })
     ] })
   ] });
-  return /* @__PURE__ */ jsx4(Popover, { content, placement, trigger: disabled ? [] : trigger, open: visible, onOpenChange: setVisible, children });
+  return /* @__PURE__ */ jsx5(Popover, { content, placement, trigger: disabled ? [] : trigger, open: visible, onOpenChange: setVisible, children });
 }
 function Progress({
   percent = 0,
@@ -398,30 +468,30 @@ function Progress({
   const resolved = status ?? (safe >= 100 ? "success" : "normal");
   const color = typeof strokeColor === "string" ? strokeColor : void 0;
   const background = typeof strokeColor === "object" ? `linear-gradient(90deg, ${strokeColor.from}, ${strokeColor.to})` : color;
-  const label = format?.(safe, success?.percent) ?? (resolved === "exception" ? /* @__PURE__ */ jsx4(Icon, { name: "close" }) : resolved === "success" ? /* @__PURE__ */ jsx4(Icon, { name: "check" }) : `${safe}%`);
+  const label = format?.(safe, success?.percent) ?? (resolved === "exception" ? /* @__PURE__ */ jsx5(Icon, { name: "close" }) : resolved === "success" ? /* @__PURE__ */ jsx5(Icon, { name: "check" }) : `${safe}%`);
   if (type !== "line") {
     const radius = 46;
     const circumference = 2 * Math.PI * radius;
     const dash = circumference * (safe / 100);
-    return /* @__PURE__ */ jsxs4("div", { className: `sia-progress sia-progress--${type} sia-progress--${resolved} ${className}`.trim(), style: { width, height: width, ...style }, ...props, children: [
-      /* @__PURE__ */ jsxs4("svg", { viewBox: "0 0 100 100", role: "progressbar", "aria-valuenow": safe, children: [
-        /* @__PURE__ */ jsx4("circle", { className: "sia-progress__trail", cx: "50", cy: "50", r: radius, style: { stroke: trailColor } }),
-        /* @__PURE__ */ jsx4("circle", { className: "sia-progress__circle", cx: "50", cy: "50", r: radius, style: { stroke: color, strokeDasharray: type === "dashboard" ? `${circumference * 0.75} ${circumference * 0.25}` : circumference, strokeDashoffset: (type === "dashboard" ? circumference * 0.75 : circumference) - dash * (type === "dashboard" ? 0.75 : 1), strokeWidth } })
+    return /* @__PURE__ */ jsxs5("div", { className: `sia-progress sia-progress--${type} sia-progress--${resolved} ${className}`.trim(), style: { width, height: width, ...style }, ...withTitleTooltip(props), children: [
+      /* @__PURE__ */ jsxs5("svg", { viewBox: "0 0 100 100", role: "progressbar", "aria-valuenow": safe, children: [
+        /* @__PURE__ */ jsx5("circle", { className: "sia-progress__trail", cx: "50", cy: "50", r: radius, style: { stroke: trailColor } }),
+        /* @__PURE__ */ jsx5("circle", { className: "sia-progress__circle", cx: "50", cy: "50", r: radius, style: { stroke: color, strokeDasharray: type === "dashboard" ? `${circumference * 0.75} ${circumference * 0.25}` : circumference, strokeDashoffset: (type === "dashboard" ? circumference * 0.75 : circumference) - dash * (type === "dashboard" ? 0.75 : 1), strokeWidth } })
       ] }),
-      showInfo ? /* @__PURE__ */ jsx4("span", { className: "sia-progress__text", children: label }) : null
+      showInfo ? /* @__PURE__ */ jsx5("span", { className: "sia-progress__text", children: label }) : null
     ] });
   }
   const height = Array.isArray(size) ? size[1] : typeof size === "number" ? size : size === "small" ? 6 : strokeWidth;
-  return /* @__PURE__ */ jsxs4("div", { className: `sia-progress sia-progress--line sia-progress--${resolved} ${className}`.trim(), style, ...props, children: [
-    /* @__PURE__ */ jsx4("div", { className: "sia-progress__outer", style: { height, backgroundColor: trailColor }, children: steps ? /* @__PURE__ */ jsx4("div", { className: "sia-progress__steps", children: Array.from({ length: steps }, (_, index) => /* @__PURE__ */ jsx4("span", { className: index < Math.round(steps * safe / 100) ? "is-active" : "", style: { background: index < Math.round(steps * safe / 100) ? background : trailColor } }, index)) }) : /* @__PURE__ */ jsxs4(Fragment2, { children: [
-      /* @__PURE__ */ jsx4("span", { className: "sia-progress__bar", style: { width: `${safe}%`, background } }),
-      success?.percent ? /* @__PURE__ */ jsx4("span", { className: "sia-progress__success", style: { width: `${success.percent}%`, background: success.strokeColor } }) : null
+  return /* @__PURE__ */ jsxs5("div", { className: `sia-progress sia-progress--line sia-progress--${resolved} ${className}`.trim(), style, ...withTitleTooltip(props), children: [
+    /* @__PURE__ */ jsx5("div", { className: "sia-progress__outer", style: { height, backgroundColor: trailColor }, children: steps ? /* @__PURE__ */ jsx5("div", { className: "sia-progress__steps", children: Array.from({ length: steps }, (_, index) => /* @__PURE__ */ jsx5("span", { className: index < Math.round(steps * safe / 100) ? "is-active" : "", style: { background: index < Math.round(steps * safe / 100) ? background : trailColor } }, index)) }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
+      /* @__PURE__ */ jsx5("span", { className: "sia-progress__bar", style: { width: `${safe}%`, background } }),
+      success?.percent ? /* @__PURE__ */ jsx5("span", { className: "sia-progress__success", style: { width: `${success.percent}%`, background: success.strokeColor } }) : null
     ] }) }),
-    showInfo ? /* @__PURE__ */ jsx4("span", { className: "sia-progress__info", children: label }) : null
+    showInfo ? /* @__PURE__ */ jsx5("span", { className: "sia-progress__info", children: label }) : null
   ] });
 }
 function Spin({ spinning = true, size = "default", tip, indicator, delay = 0, fullscreen = false, className = "", children, ...props }) {
-  const [visible, setVisible] = useState3(delay === 0 && spinning);
+  const [visible, setVisible] = useState4(delay === 0 && spinning);
   useEffect(() => {
     if (!spinning) {
       setVisible(false);
@@ -430,20 +500,20 @@ function Spin({ spinning = true, size = "default", tip, indicator, delay = 0, fu
     const timer = window.setTimeout(() => setVisible(true), delay);
     return () => window.clearTimeout(timer);
   }, [delay, spinning]);
-  const spinner = visible ? /* @__PURE__ */ jsxs4("div", { className: `sia-spin sia-spin--${size}`, role: "status", "aria-live": "polite", children: [
-    indicator ?? /* @__PURE__ */ jsxs4("span", { className: "sia-spin__indicator", children: [
-      /* @__PURE__ */ jsx4("i", {}),
-      /* @__PURE__ */ jsx4("i", {}),
-      /* @__PURE__ */ jsx4("i", {}),
-      /* @__PURE__ */ jsx4("i", {})
+  const spinner = visible ? /* @__PURE__ */ jsxs5("div", { className: `sia-spin sia-spin--${size}`, role: "status", "aria-live": "polite", children: [
+    indicator ?? /* @__PURE__ */ jsxs5("span", { className: "sia-spin__indicator", children: [
+      /* @__PURE__ */ jsx5("i", {}),
+      /* @__PURE__ */ jsx5("i", {}),
+      /* @__PURE__ */ jsx5("i", {}),
+      /* @__PURE__ */ jsx5("i", {})
     ] }),
-    tip ? /* @__PURE__ */ jsx4("span", { className: "sia-spin__tip", children: tip }) : null
+    tip ? /* @__PURE__ */ jsx5("span", { className: "sia-spin__tip", children: tip }) : null
   ] }) : null;
-  if (fullscreen) return visible && typeof document !== "undefined" ? createPortal(/* @__PURE__ */ jsx4("div", { className: "sia-spin-fullscreen", children: spinner }), document.body) : null;
-  if (!children) return /* @__PURE__ */ jsx4("div", { className: `sia-spin-wrap ${className}`.trim(), ...props, children: spinner });
-  return /* @__PURE__ */ jsxs4("div", { className: `sia-spin-container${visible ? " is-spinning" : ""} ${className}`.trim(), ...props, children: [
+  if (fullscreen) return visible && typeof document !== "undefined" ? createPortal(/* @__PURE__ */ jsx5("div", { className: "sia-spin-fullscreen", children: spinner }), document.body) : null;
+  if (!children) return /* @__PURE__ */ jsx5("div", { className: `sia-spin-wrap ${className}`.trim(), ...withTitleTooltip(props), children: spinner });
+  return /* @__PURE__ */ jsxs5("div", { className: `sia-spin-container${visible ? " is-spinning" : ""} ${className}`.trim(), ...withTitleTooltip(props), children: [
     children,
-    visible ? /* @__PURE__ */ jsx4("div", { className: "sia-spin-mask", children: spinner }) : null
+    visible ? /* @__PURE__ */ jsx5("div", { className: "sia-spin-mask", children: spinner }) : null
   ] });
 }
 function escapeXml(value) {
@@ -458,9 +528,9 @@ function Watermark({ content = "Sia Web UI", image, width = 120, height = 64, ro
     const svg = `<svg xmlns="http://www.w3.org/2000/svg" width="${tileWidth}" height="${tileHeight}"><g transform="translate(${offset[0]} ${offset[1]}) rotate(${rotate} ${width / 2} ${height / 2})">${body}</g></svg>`;
     return `url("data:image/svg+xml,${encodeURIComponent(svg)}")`;
   }, [content, font?.color, font?.fontFamily, font?.fontSize, font?.fontWeight, gap[0], gap[1], height, image, offset[0], offset[1], rotate, width]);
-  return /* @__PURE__ */ jsxs4("div", { className: `sia-watermark ${className}`.trim(), ...props, children: [
+  return /* @__PURE__ */ jsxs5("div", { className: `sia-watermark ${className}`.trim(), ...withTitleTooltip(props), children: [
     children,
-    /* @__PURE__ */ jsx4("div", { className: "sia-watermark__layer", "aria-hidden": "true", style: { zIndex, backgroundImage: background } })
+    /* @__PURE__ */ jsx5("div", { className: "sia-watermark__layer", "aria-hidden": "true", style: { zIndex, backgroundImage: background } })
   ] });
 }
 var notificationListeners = /* @__PURE__ */ new Set();
@@ -480,7 +550,7 @@ function closeNotification(key) {
   entry?.onClose?.();
 }
 function NotificationHost() {
-  const [entries, setEntries] = useState3(notificationEntries);
+  const [entries, setEntries] = useState4(notificationEntries);
   useEffect(() => {
     notificationListeners.add(setEntries);
     return () => {
@@ -488,17 +558,17 @@ function NotificationHost() {
     };
   }, []);
   const placements = ["topLeft", "topRight", "bottomLeft", "bottomRight"];
-  return /* @__PURE__ */ jsx4(Fragment2, { children: placements.map((placement) => /* @__PURE__ */ jsx4("div", { className: `sia-notification sia-notification--${placement}`, children: entries.filter((item) => (item.placement ?? "topRight") === placement).map((item) => /* @__PURE__ */ jsxs4("div", { className: `sia-notification__notice sia-notification__notice--${item.type ?? "info"}`, role: item.role ?? "alert", onClick: item.onClick, children: [
-    /* @__PURE__ */ jsx4("span", { className: "sia-notification__icon", children: item.icon ?? /* @__PURE__ */ jsx4(Icon, { name: item.type === "success" ? "circle-check" : item.type === "warning" ? "warning" : item.type === "error" ? "circle-close" : "info", variant: "filled" }) }),
-    /* @__PURE__ */ jsxs4("div", { children: [
-      /* @__PURE__ */ jsx4("strong", { children: item.message }),
-      item.description ? /* @__PURE__ */ jsx4("p", { children: item.description }) : null,
+  return /* @__PURE__ */ jsx5(Fragment2, { children: placements.map((placement) => /* @__PURE__ */ jsx5("div", { className: `sia-notification sia-notification--${placement}`, children: entries.filter((item) => (item.placement ?? "topRight") === placement).map((item) => /* @__PURE__ */ jsxs5("div", { className: `sia-notification__notice sia-notification__notice--${item.type ?? "info"}`, role: item.role ?? "alert", onClick: item.onClick, children: [
+    /* @__PURE__ */ jsx5("span", { className: "sia-notification__icon", children: item.icon ?? /* @__PURE__ */ jsx5(Icon, { name: item.type === "success" ? "circle-check" : item.type === "warning" ? "warning" : item.type === "error" ? "circle-close" : "info", variant: "filled" }) }),
+    /* @__PURE__ */ jsxs5("div", { children: [
+      /* @__PURE__ */ jsx5("strong", { children: item.message }),
+      item.description ? /* @__PURE__ */ jsx5("p", { children: item.description }) : null,
       item.btn
     ] }),
-    /* @__PURE__ */ jsx4("button", { type: "button", "aria-label": "\u5173\u95ED\u901A\u77E5", onClick: (event) => {
+    /* @__PURE__ */ jsx5("button", { type: "button", "aria-label": "\u5173\u95ED\u901A\u77E5", onClick: (event) => {
       event.stopPropagation();
       closeNotification(item.key);
-    }, children: item.closeIcon ?? /* @__PURE__ */ jsx4(Icon, { name: "close", size: 14 }) })
+    }, children: item.closeIcon ?? /* @__PURE__ */ jsx5(Icon, { name: "close", size: 14 }) })
   ] }, item.key)) }, placement)) });
 }
 function ensureNotificationHost() {
@@ -506,7 +576,7 @@ function ensureNotificationHost() {
   notificationHost = document.createElement("div");
   notificationHost.dataset.siaNotificationHost = "";
   document.body.appendChild(notificationHost);
-  createRoot(notificationHost).render(/* @__PURE__ */ jsx4(NotificationHost, {}));
+  createRoot(notificationHost).render(/* @__PURE__ */ jsx5(NotificationHost, {}));
 }
 function openNotification(config) {
   if (typeof window === "undefined" || typeof document === "undefined") return { key: config.key ?? "ssr", close: () => void 0 };
@@ -541,7 +611,7 @@ var notification = {
 };
 function Tour({ open = false, steps, current, defaultCurrent = 0, mask = true, closable = true, disabledInteraction = false, onChange, onClose, onFinish }) {
   const [index, setIndex] = useControllableState({ value: current, defaultValue: defaultCurrent, onChange });
-  const [, force] = useState3(0);
+  const [, force] = useState4(0);
   useEffect(() => {
     if (!open) return;
     const update = () => force((value) => value + 1);
@@ -558,23 +628,23 @@ function Tour({ open = false, steps, current, defaultCurrent = 0, mask = true, c
   const rect = target?.getBoundingClientRect();
   const placement = step.placement ?? (rect ? "bottom" : "center");
   const panelStyle = placement === "center" || !rect ? { top: "50%", left: "50%", transform: "translate(-50%, -50%)" } : placement.startsWith("bottom") ? { top: rect.bottom + 14, left: rect.left + rect.width / 2, transform: "translateX(-50%)" } : placement.startsWith("top") ? { top: rect.top - 14, left: rect.left + rect.width / 2, transform: "translate(-50%, -100%)" } : placement === "left" ? { top: rect.top + rect.height / 2, left: rect.left - 14, transform: "translate(-100%, -50%)" } : { top: rect.top + rect.height / 2, left: rect.right + 14, transform: "translateY(-50%)" };
-  return createPortal(/* @__PURE__ */ jsxs4("div", { className: "sia-tour", role: "dialog", "aria-modal": "true", children: [
-    mask && !rect ? /* @__PURE__ */ jsx4("div", { className: "sia-tour__mask" }) : null,
-    rect ? /* @__PURE__ */ jsx4("div", { className: "sia-tour__target", style: { top: rect.top - 5, left: rect.left - 5, width: rect.width + 10, height: rect.height + 10, pointerEvents: disabledInteraction ? "auto" : "none", boxShadow: mask ? "0 0 0 5px var(--sia-color-surface), 0 0 0 9999px rgb(0 0 0 / 46%)" : "0 0 0 5px var(--sia-color-surface)" } }) : null,
-    /* @__PURE__ */ jsxs4("div", { className: "sia-tour__panel", style: panelStyle, children: [
-      closable ? /* @__PURE__ */ jsx4("button", { className: "sia-tour__close", "aria-label": "\u5173\u95ED\u5F15\u5BFC", onClick: () => onClose?.(index), children: /* @__PURE__ */ jsx4(Icon, { name: "close", size: 14 }) }) : null,
+  return createPortal(/* @__PURE__ */ jsxs5("div", { className: "sia-tour", role: "dialog", "aria-modal": "true", children: [
+    mask && !rect ? /* @__PURE__ */ jsx5("div", { className: "sia-tour__mask" }) : null,
+    rect ? /* @__PURE__ */ jsx5("div", { className: "sia-tour__target", style: { top: rect.top - 5, left: rect.left - 5, width: rect.width + 10, height: rect.height + 10, pointerEvents: disabledInteraction ? "auto" : "none", boxShadow: mask ? "0 0 0 5px var(--sia-color-surface), 0 0 0 9999px rgb(0 0 0 / 46%)" : "0 0 0 5px var(--sia-color-surface)" } }) : null,
+    /* @__PURE__ */ jsxs5("div", { className: "sia-tour__panel", style: panelStyle, children: [
+      closable ? /* @__PURE__ */ jsx5("button", { className: "sia-tour__close", "aria-label": "\u5173\u95ED\u5F15\u5BFC", onClick: () => onClose?.(index), children: /* @__PURE__ */ jsx5(Icon, { name: "close", size: 14 }) }) : null,
       step.cover,
-      /* @__PURE__ */ jsx4("strong", { children: step.title }),
-      step.description ? /* @__PURE__ */ jsx4("div", { className: "sia-tour__description", children: step.description }) : null,
-      /* @__PURE__ */ jsxs4("footer", { children: [
-        /* @__PURE__ */ jsxs4("span", { children: [
+      /* @__PURE__ */ jsx5("strong", { children: step.title }),
+      step.description ? /* @__PURE__ */ jsx5("div", { className: "sia-tour__description", children: step.description }) : null,
+      /* @__PURE__ */ jsxs5("footer", { children: [
+        /* @__PURE__ */ jsxs5("span", { children: [
           index + 1,
           " / ",
           steps.length
         ] }),
-        /* @__PURE__ */ jsxs4("div", { children: [
-          index > 0 ? /* @__PURE__ */ jsx4(Button, { size: "small", ...step.prevButtonProps, onClick: () => setIndex(index - 1), children: step.prevButtonProps?.children ?? "\u4E0A\u4E00\u6B65" }) : null,
-          /* @__PURE__ */ jsx4(Button, { size: "small", variant: "primary", ...step.nextButtonProps, onClick: () => {
+        /* @__PURE__ */ jsxs5("div", { children: [
+          index > 0 ? /* @__PURE__ */ jsx5(Button, { size: "small", ...step.prevButtonProps, onClick: () => setIndex(index - 1), children: step.prevButtonProps?.children ?? "\u4E0A\u4E00\u6B65" }) : null,
+          /* @__PURE__ */ jsx5(Button, { size: "small", variant: "primary", ...step.nextButtonProps, onClick: () => {
             if (index >= steps.length - 1) onFinish?.();
             else setIndex(index + 1);
           }, children: step.nextButtonProps?.children ?? (index >= steps.length - 1 ? "\u5B8C\u6210" : "\u4E0B\u4E00\u6B65") })
@@ -585,25 +655,25 @@ function Tour({ open = false, steps, current, defaultCurrent = 0, mask = true, c
 }
 
 // src/components/DataDisplay.tsx
-import { Children, useEffect as useEffect2, useMemo as useMemo3, useRef as useRef3, useState as useState4 } from "react";
+import { Children, useEffect as useEffect2, useMemo as useMemo3, useRef as useRef4, useState as useState5 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
-import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function Rate({ value, size: sizeProp, defaultValue = 0, count = 5, allowHalf = false, allowClear = true, disabled = false, character, tooltips, onChange, onHoverChange, className = "", ...props }) {
   const size = useControlSize(sizeProp);
   const [current, setCurrent] = useControllableState({ value, defaultValue, onChange });
-  const [hover, setHover] = useState4(0);
+  const [hover, setHover] = useState5(0);
   const shown = hover || current;
   function choose(next) {
     setCurrent(allowClear && next === current ? 0 : next);
   }
-  return /* @__PURE__ */ jsx5("div", { className: `sia-rate sia-rate--${size}${disabled ? " is-disabled" : ""} ${className}`.trim(), role: "radiogroup", "aria-label": "\u8BC4\u5206", onMouseLeave: () => {
+  return /* @__PURE__ */ jsx6("div", { className: `sia-rate sia-rate--${size}${disabled ? " is-disabled" : ""} ${className}`.trim(), role: "radiogroup", "aria-label": "\u8BC4\u5206", onMouseLeave: () => {
     setHover(0);
     onHoverChange?.(0);
-  }, ...props, children: Array.from({ length: count }, (_, index) => {
+  }, ...withTitleTooltip(props), children: Array.from({ length: count }, (_, index) => {
     const whole = index + 1;
     const fill = Math.max(0, Math.min(1, shown - index));
-    const content = typeof character === "function" ? character(index) : character ?? /* @__PURE__ */ jsx5(Icon, { name: "star", variant: "filled" });
-    return /* @__PURE__ */ jsx5("span", { className: "sia-rate__item", title: tooltips?.[index], children: /* @__PURE__ */ jsxs5("button", { type: "button", disabled, role: "radio", "aria-checked": current === whole, "aria-label": `${whole} \u661F`, onMouseMove: (event) => {
+    const content = typeof character === "function" ? character(index) : character ?? /* @__PURE__ */ jsx6(Icon, { name: "star", variant: "filled" });
+    return /* @__PURE__ */ jsx6("span", { className: "sia-rate__item", ...withTitleTooltip({ title: tooltips?.[index] }), children: /* @__PURE__ */ jsxs6("button", { type: "button", disabled, role: "radio", "aria-checked": current === whole, "aria-label": `${whole} \u661F`, onMouseMove: (event) => {
       const rect = event.currentTarget.getBoundingClientRect();
       const next = allowHalf && event.clientX - rect.left < rect.width / 2 ? whole - 0.5 : whole;
       setHover(next);
@@ -621,30 +691,30 @@ function Rate({ value, size: sizeProp, defaultValue = 0, count = 5, allowHalf =
         setCurrent(Math.max(0, current - (allowHalf ? 0.5 : 1)));
       }
     }, children: [
-      /* @__PURE__ */ jsx5("span", { className: "sia-rate__base", children: content }),
-      /* @__PURE__ */ jsx5("span", { className: "sia-rate__fill", style: { width: `${fill * 100}%` }, children: content })
+      /* @__PURE__ */ jsx6("span", { className: "sia-rate__base", children: content }),
+      /* @__PURE__ */ jsx6("span", { className: "sia-rate__fill", style: { width: `${fill * 100}%` }, children: content })
     ] }) }, whole);
   }) });
 }
 function BadgeRibbon({ text, color, placement = "end", className = "", children, ...props }) {
-  return /* @__PURE__ */ jsxs5("div", { className: `sia-ribbon-wrap ${className}`.trim(), ...props, children: [
+  return /* @__PURE__ */ jsxs6("div", { className: `sia-ribbon-wrap ${className}`.trim(), ...withTitleTooltip(props), children: [
     children,
-    /* @__PURE__ */ jsx5("span", { className: `sia-ribbon sia-ribbon--${placement}`, style: { backgroundColor: color }, children: text })
+    /* @__PURE__ */ jsx6("span", { className: `sia-ribbon sia-ribbon--${placement}`, style: { backgroundColor: color }, children: text })
   ] });
 }
 function Badge({ count, showZero = false, overflowCount = 99, dot = false, status, text, color, offset = [0, 0], size = "default", className = "", children, style, ...props }) {
   const numeric = typeof count === "number";
   const hidden = !dot && !status && (count === void 0 || count === null || count === 0 && !showZero);
   const display = numeric && count > overflowCount ? `${overflowCount}+` : count;
-  const badge = !hidden ? /* @__PURE__ */ jsx5("sup", { className: `sia-badge__count${dot || status ? " sia-badge__dot" : ""}${status ? ` sia-badge__dot--${status}` : ""} sia-badge__count--${size}`, style: { backgroundColor: color, transform: `translate(calc(50% + ${offset[0]}px), calc(-50% + ${offset[1]}px))` }, children: dot || status ? null : display }) : null;
-  if (status && !children) return /* @__PURE__ */ jsxs5("span", { className: `sia-badge sia-badge--status ${className}`.trim(), style, ...props, children: [
+  const badge = !hidden ? /* @__PURE__ */ jsx6("sup", { className: `sia-badge__count${dot || status ? " sia-badge__dot" : ""}${status ? ` sia-badge__dot--${status}` : ""} sia-badge__count--${size}`, style: { backgroundColor: color, transform: `translate(calc(50% + ${offset[0]}px), calc(-50% + ${offset[1]}px))` }, children: dot || status ? null : display }) : null;
+  if (status && !children) return /* @__PURE__ */ jsxs6("span", { className: `sia-badge sia-badge--status ${className}`.trim(), style, ...withTitleTooltip(props), children: [
     badge,
-    text ? /* @__PURE__ */ jsx5("span", { className: "sia-badge__text", children: text }) : null
+    text ? /* @__PURE__ */ jsx6("span", { className: "sia-badge__text", children: text }) : null
   ] });
-  return /* @__PURE__ */ jsxs5("span", { className: `sia-badge ${className}`.trim(), style, ...props, children: [
+  return /* @__PURE__ */ jsxs6("span", { className: `sia-badge ${className}`.trim(), style, ...withTitleTooltip(props), children: [
     children,
     badge,
-    text && !status ? /* @__PURE__ */ jsx5("span", { className: "sia-badge__text", children: text }) : null
+    text && !status ? /* @__PURE__ */ jsx6("span", { className: "sia-badge__text", children: text }) : null
   ] });
 }
 Badge.Ribbon = BadgeRibbon;
@@ -662,8 +732,8 @@ var WEEK = ["\u4E00", "\u4E8C", "\u4E09", "\u56DB", "\u4E94", "\u516D", "\u65E5"
 var MONTHS = ["\u4E00\u6708", "\u4E8C\u6708", "\u4E09\u6708", "\u56DB\u6708", "\u4E94\u6708", "\u516D\u6708", "\u4E03\u6708", "\u516B\u6708", "\u4E5D\u6708", "\u5341\u6708", "\u5341\u4E00\u6708", "\u5341\u4E8C\u6708"];
 function Calendar({ value, defaultValue, mode = "month", fullscreen = true, validRange, disabledDate, dateCellRender, fullCellRender, headerRender, onChange, onSelect, onPanelChange, className = "", ...props }) {
   const [selected, setSelected] = useControllableState({ value, defaultValue: defaultValue ?? formatDate(/* @__PURE__ */ new Date()), onChange });
-  const [panelMode, setPanelMode] = useState4(mode);
-  const [panel, setPanel] = useState4(() => {
+  const [panelMode, setPanelMode] = useState5(mode);
+  const [panel, setPanel] = useState5(() => {
     const date = parseDate(value ?? defaultValue);
     return new Date(date.getFullYear(), date.getMonth(), 1);
   });
@@ -687,34 +757,34 @@ function Calendar({ value, defaultValue, mode = "month", fullscreen = true, vali
     onPanelChange?.(formatDate(panel), next);
   }
   const headerConfig = { value: formatDate(panel), mode: panelMode, onChange: (next) => setPanelValue(parseDate(next)), onTypeChange: setMode };
-  return /* @__PURE__ */ jsxs5("div", { className: `sia-calendar${fullscreen ? " sia-calendar--fullscreen" : " sia-calendar--mini"} ${className}`.trim(), ...props, children: [
-    /* @__PURE__ */ jsx5("div", { className: "sia-calendar__header", children: headerRender ? headerRender(headerConfig) : /* @__PURE__ */ jsxs5(Fragment3, { children: [
-      /* @__PURE__ */ jsx5("button", { type: "button", "aria-label": "\u4E0A\u4E00\u9875", onClick: () => setPanelValue(new Date(panel.getFullYear() - (panelMode === "year" ? 1 : 0), panel.getMonth() - (panelMode === "month" ? 1 : 0), 1)), children: /* @__PURE__ */ jsx5(Icon, { name: "chevron-left" }) }),
-      /* @__PURE__ */ jsxs5("strong", { children: [
+  return /* @__PURE__ */ jsxs6("div", { className: `sia-calendar${fullscreen ? " sia-calendar--fullscreen" : " sia-calendar--mini"} ${className}`.trim(), ...withTitleTooltip(props), children: [
+    /* @__PURE__ */ jsx6("div", { className: "sia-calendar__header", children: headerRender ? headerRender(headerConfig) : /* @__PURE__ */ jsxs6(Fragment3, { children: [
+      /* @__PURE__ */ jsx6("button", { type: "button", "aria-label": "\u4E0A\u4E00\u9875", onClick: () => setPanelValue(new Date(panel.getFullYear() - (panelMode === "year" ? 1 : 0), panel.getMonth() - (panelMode === "month" ? 1 : 0), 1)), children: /* @__PURE__ */ jsx6(Icon, { name: "chevron-left" }) }),
+      /* @__PURE__ */ jsxs6("strong", { children: [
         panel.getFullYear(),
         " \u5E74",
         panelMode === "month" ? ` ${panel.getMonth() + 1} \u6708` : ""
       ] }),
-      /* @__PURE__ */ jsxs5("div", { className: "sia-calendar__modes", children: [
-        /* @__PURE__ */ jsx5("button", { className: panelMode === "month" ? "is-active" : "", onClick: () => setMode("month"), children: "\u6708" }),
-        /* @__PURE__ */ jsx5("button", { className: panelMode === "year" ? "is-active" : "", onClick: () => setMode("year"), children: "\u5E74" })
+      /* @__PURE__ */ jsxs6("div", { className: "sia-calendar__modes", children: [
+        /* @__PURE__ */ jsx6("button", { className: panelMode === "month" ? "is-active" : "", onClick: () => setMode("month"), children: "\u6708" }),
+        /* @__PURE__ */ jsx6("button", { className: panelMode === "year" ? "is-active" : "", onClick: () => setMode("year"), children: "\u5E74" })
       ] }),
-      /* @__PURE__ */ jsx5("button", { type: "button", "aria-label": "\u4E0B\u4E00\u9875", onClick: () => setPanelValue(new Date(panel.getFullYear() + (panelMode === "year" ? 1 : 0), panel.getMonth() + (panelMode === "month" ? 1 : 0), 1)), children: /* @__PURE__ */ jsx5(Icon, { name: "chevron-right" }) })
+      /* @__PURE__ */ jsx6("button", { type: "button", "aria-label": "\u4E0B\u4E00\u9875", onClick: () => setPanelValue(new Date(panel.getFullYear() + (panelMode === "year" ? 1 : 0), panel.getMonth() + (panelMode === "month" ? 1 : 0), 1)), children: /* @__PURE__ */ jsx6(Icon, { name: "chevron-right" }) })
     ] }) }),
-    panelMode === "year" ? /* @__PURE__ */ jsx5("div", { className: "sia-calendar__months", children: MONTHS.map((month, index) => /* @__PURE__ */ jsx5("button", { className: panel.getMonth() === index ? "is-selected" : "", onClick: () => {
+    panelMode === "year" ? /* @__PURE__ */ jsx6("div", { className: "sia-calendar__months", children: MONTHS.map((month, index) => /* @__PURE__ */ jsx6("button", { className: panel.getMonth() === index ? "is-selected" : "", onClick: () => {
       setPanelValue(new Date(panel.getFullYear(), index, 1));
       setMode("month");
-    }, children: month }, month)) }) : /* @__PURE__ */ jsxs5(Fragment3, { children: [
-      /* @__PURE__ */ jsx5("div", { className: "sia-calendar__week", children: WEEK.map((day) => /* @__PURE__ */ jsx5("span", { children: day }, day)) }),
-      /* @__PURE__ */ jsx5("div", { className: "sia-calendar__grid", children: grid.map((date) => {
+    }, children: month }, month)) }) : /* @__PURE__ */ jsxs6(Fragment3, { children: [
+      /* @__PURE__ */ jsx6("div", { className: "sia-calendar__week", children: WEEK.map((day) => /* @__PURE__ */ jsx6("span", { children: day }, day)) }),
+      /* @__PURE__ */ jsx6("div", { className: "sia-calendar__grid", children: grid.map((date) => {
         const key = formatDate(date);
         const outside = date.getMonth() !== panel.getMonth();
         const disabled = Boolean(disabledDate?.(key) || validRange && (key < validRange[0] || key > validRange[1]));
-        const origin = /* @__PURE__ */ jsxs5(Fragment3, { children: [
-          /* @__PURE__ */ jsx5("span", { children: date.getDate() }),
+        const origin = /* @__PURE__ */ jsxs6(Fragment3, { children: [
+          /* @__PURE__ */ jsx6("span", { children: date.getDate() }),
           dateCellRender?.(key)
         ] });
-        return /* @__PURE__ */ jsx5("button", { disabled, className: `${outside ? "is-outside" : ""}${selected === key ? " is-selected" : ""}${formatDate(/* @__PURE__ */ new Date()) === key ? " is-today" : ""}`, onClick: () => {
+        return /* @__PURE__ */ jsx6("button", { disabled, className: `${outside ? "is-outside" : ""}${selected === key ? " is-selected" : ""}${formatDate(/* @__PURE__ */ new Date()) === key ? " is-today" : ""}`, onClick: () => {
           setSelected(key);
           onSelect?.(key);
           if (outside) setPanelValue(new Date(date.getFullYear(), date.getMonth(), 1));
@@ -725,8 +795,8 @@ function Calendar({ value, defaultValue, mode = "month", fullscreen = true, vali
 }
 function Carousel({ autoplay = false, autoplaySpeed = 3e3, arrows = false, dots = true, effect = "scroll", infinite = true, initialSlide = 0, pauseOnHover = true, beforeChange, afterChange, className = "", children, ...props }) {
   const slides = Children.toArray(children);
-  const [current, setCurrent] = useState4(Math.min(initialSlide, Math.max(0, slides.length - 1)));
-  const [paused, setPaused] = useState4(false);
+  const [current, setCurrent] = useState5(Math.min(initialSlide, Math.max(0, slides.length - 1)));
+  const [paused, setPaused] = useState5(false);
   function go(next) {
     if (!slides.length) return;
     const resolved = infinite ? (next + slides.length) % slides.length : Math.max(0, Math.min(slides.length - 1, next));
@@ -740,13 +810,13 @@ function Carousel({ autoplay = false, autoplaySpeed = 3e3, arrows = false, dots
     const timer = window.setInterval(() => go(current + 1), autoplaySpeed);
     return () => window.clearInterval(timer);
   }, [autoplay, autoplaySpeed, current, paused, slides.length]);
-  return /* @__PURE__ */ jsxs5("div", { className: `sia-carousel sia-carousel--${effect} ${className}`.trim(), onMouseEnter: pauseOnHover ? () => setPaused(true) : void 0, onMouseLeave: pauseOnHover ? () => setPaused(false) : void 0, ...props, children: [
-    /* @__PURE__ */ jsx5("div", { className: "sia-carousel__viewport", children: /* @__PURE__ */ jsx5("div", { className: "sia-carousel__track", style: effect === "scroll" ? { transform: `translateX(-${current * 100}%)` } : void 0, children: slides.map((slide, index) => /* @__PURE__ */ jsx5("div", { className: `sia-carousel__slide${index === current ? " is-active" : ""}`, "aria-hidden": index !== current, children: slide }, index)) }) }),
-    arrows ? /* @__PURE__ */ jsxs5(Fragment3, { children: [
-      /* @__PURE__ */ jsx5("button", { className: "sia-carousel__arrow sia-carousel__arrow--prev", disabled: !infinite && current === 0, "aria-label": "\u4E0A\u4E00\u5F20", onClick: () => go(current - 1), children: /* @__PURE__ */ jsx5(Icon, { name: "chevron-left" }) }),
-      /* @__PURE__ */ jsx5("button", { className: "sia-carousel__arrow sia-carousel__arrow--next", disabled: !infinite && current === slides.length - 1, "aria-label": "\u4E0B\u4E00\u5F20", onClick: () => go(current + 1), children: /* @__PURE__ */ jsx5(Icon, { name: "chevron-right" }) })
+  return /* @__PURE__ */ jsxs6("div", { className: `sia-carousel sia-carousel--${effect} ${className}`.trim(), onMouseEnter: pauseOnHover ? () => setPaused(true) : void 0, onMouseLeave: pauseOnHover ? () => setPaused(false) : void 0, ...withTitleTooltip(props), children: [
+    /* @__PURE__ */ jsx6("div", { className: "sia-carousel__viewport", children: /* @__PURE__ */ jsx6("div", { className: "sia-carousel__track", style: effect === "scroll" ? { transform: `translateX(-${current * 100}%)` } : void 0, children: slides.map((slide, index) => /* @__PURE__ */ jsx6("div", { className: `sia-carousel__slide${index === current ? " is-active" : ""}`, "aria-hidden": index !== current, children: slide }, index)) }) }),
+    arrows ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
+      /* @__PURE__ */ jsx6("button", { className: "sia-carousel__arrow sia-carousel__arrow--prev", disabled: !infinite && current === 0, "aria-label": "\u4E0A\u4E00\u5F20", onClick: () => go(current - 1), children: /* @__PURE__ */ jsx6(Icon, { name: "chevron-left" }) }),
+      /* @__PURE__ */ jsx6("button", { className: "sia-carousel__arrow sia-carousel__arrow--next", disabled: !infinite && current === slides.length - 1, "aria-label": "\u4E0B\u4E00\u5F20", onClick: () => go(current + 1), children: /* @__PURE__ */ jsx6(Icon, { name: "chevron-right" }) })
     ] }) : null,
-    dots ? /* @__PURE__ */ jsx5("div", { className: `sia-carousel__dots${typeof dots === "object" && dots.className ? ` ${dots.className}` : ""}`, children: slides.map((_, index) => /* @__PURE__ */ jsx5("button", { "aria-label": `\u5207\u6362\u5230\u7B2C ${index + 1} \u5F20`, "aria-current": index === current, onClick: () => go(index), children: /* @__PURE__ */ jsx5("span", {}) }, index)) }) : null
+    dots ? /* @__PURE__ */ jsx6("div", { className: `sia-carousel__dots${typeof dots === "object" && dots.className ? ` ${dots.className}` : ""}`, children: slides.map((_, index) => /* @__PURE__ */ jsx6("button", { "aria-label": `\u5207\u6362\u5230\u7B2C ${index + 1} \u5F20`, "aria-current": index === current, onClick: () => go(index), children: /* @__PURE__ */ jsx6("span", {}) }, index)) }) : null
   ] });
 }
 function CollapsePanel({
@@ -755,7 +825,7 @@ function CollapsePanel({
   destroyInactivePanel = false,
   children
 }) {
-  const [keepChildren, setKeepChildren] = useState4(open || forceRender || !destroyInactivePanel);
+  const [keepChildren, setKeepChildren] = useState5(open || forceRender || !destroyInactivePanel);
   useEffect2(() => {
     if (open || forceRender || !destroyInactivePanel) {
       setKeepChildren(true);
@@ -765,12 +835,12 @@ function CollapsePanel({
     return () => window.clearTimeout(timer);
   }, [destroyInactivePanel, forceRender, open]);
   const renderChildren = open || forceRender || !destroyInactivePanel || keepChildren;
-  return /* @__PURE__ */ jsx5("div", { className: "sia-collapse__panel", "aria-hidden": !open, children: /* @__PURE__ */ jsx5("div", { className: "sia-collapse__panel-motion", children: /* @__PURE__ */ jsx5("div", { className: "sia-collapse__panel-body", children: renderChildren ? children : null }) }) });
+  return /* @__PURE__ */ jsx6("div", { className: "sia-collapse__panel", "aria-hidden": !open, children: /* @__PURE__ */ jsx6("div", { className: "sia-collapse__panel-motion", children: /* @__PURE__ */ jsx6("div", { className: "sia-collapse__panel-body", children: renderChildren ? children : null }) }) });
 }
 function Collapse({ items, activeKey, defaultActiveKey = [], accordion = false, bordered = true, ghost = false, destroyInactivePanel = false, expandIconPosition = "start", onChange, className = "", ...props }) {
   const normalize = (key) => Array.isArray(key) ? [...key] : key === void 0 ? [] : [key];
   const controlled = activeKey !== void 0;
-  const [internal, setInternal] = useState4(normalize(defaultActiveKey));
+  const [internal, setInternal] = useState5(normalize(defaultActiveKey));
   const openKeys = controlled ? normalize(activeKey) : internal;
   function toggle(item) {
     if (item.disabled || item.collapsible === "disabled") return;
@@ -780,41 +850,41 @@ function Collapse({ items, activeKey, defaultActiveKey = [], accordion = false,
     onChange?.(accordion ? next[0] ?? "" : next);
   }
   const borderClassName = !bordered || ghost ? "sia-collapse--borderless" : "sia-collapse--bordered";
-  return /* @__PURE__ */ jsx5("div", { className: `sia-collapse ${borderClassName}${ghost ? " sia-collapse--ghost" : ""} sia-collapse--icon-${expandIconPosition} ${className}`.trim(), ...props, children: items.map((item) => {
+  return /* @__PURE__ */ jsx6("div", { className: `sia-collapse ${borderClassName}${ghost ? " sia-collapse--ghost" : ""} sia-collapse--icon-${expandIconPosition} ${className}`.trim(), ...withTitleTooltip(props), children: items.map((item) => {
     const open = openKeys.includes(item.key);
-    const arrow = item.showArrow === false ? null : /* @__PURE__ */ jsx5("button", { type: "button", className: "sia-collapse__arrow", "aria-label": open ? "\u6536\u8D77" : "\u5C55\u5F00", onClick: item.collapsible === "icon" ? () => toggle(item) : void 0, children: /* @__PURE__ */ jsx5(Icon, { name: "chevron-right", size: 14 }) });
-    return /* @__PURE__ */ jsxs5("section", { className: `sia-collapse__item${open ? " is-open" : ""}${item.disabled ? " is-disabled" : ""} ${item.className ?? ""}`.trim(), children: [
-      /* @__PURE__ */ jsxs5("header", { className: "sia-collapse__header", role: "button", tabIndex: item.disabled ? -1 : 0, "aria-expanded": open, onClick: item.collapsible === "icon" ? void 0 : () => toggle(item), onKeyDown: (event) => {
+    const arrow = item.showArrow === false ? null : /* @__PURE__ */ jsx6("button", { type: "button", className: "sia-collapse__arrow", "aria-label": open ? "\u6536\u8D77" : "\u5C55\u5F00", onClick: item.collapsible === "icon" ? () => toggle(item) : void 0, children: /* @__PURE__ */ jsx6(Icon, { name: "chevron-right", size: 14 }) });
+    return /* @__PURE__ */ jsxs6("section", { className: `sia-collapse__item${open ? " is-open" : ""}${item.disabled ? " is-disabled" : ""} ${item.className ?? ""}`.trim(), children: [
+      /* @__PURE__ */ jsxs6("header", { className: "sia-collapse__header", role: "button", tabIndex: item.disabled ? -1 : 0, "aria-expanded": open, onClick: item.collapsible === "icon" ? void 0 : () => toggle(item), onKeyDown: (event) => {
         if (event.key === "Enter" || event.key === " ") {
           event.preventDefault();
           toggle(item);
         }
       }, children: [
         expandIconPosition === "start" ? arrow : null,
-        /* @__PURE__ */ jsx5("span", { className: "sia-collapse__label", children: item.label }),
-        item.extra ? /* @__PURE__ */ jsx5("span", { className: "sia-collapse__extra", onClick: (event) => event.stopPropagation(), children: item.extra }) : null,
+        /* @__PURE__ */ jsx6("span", { className: "sia-collapse__label", children: item.label }),
+        item.extra ? /* @__PURE__ */ jsx6("span", { className: "sia-collapse__extra", onClick: (event) => event.stopPropagation(), children: item.extra }) : null,
         expandIconPosition === "end" ? arrow : null
       ] }),
-      /* @__PURE__ */ jsx5(CollapsePanel, { open, forceRender: item.forceRender, destroyInactivePanel, children: item.children })
+      /* @__PURE__ */ jsx6(CollapsePanel, { open, forceRender: item.forceRender, destroyInactivePanel, children: item.children })
     ] }, item.key);
   }) });
 }
 function ImagePreview({ open, src, alt = "", onOpenChange }) {
-  const previewRef = useRef3(null);
+  const previewRef = useRef4(null);
   useOverlayLifecycle(open, previewRef, () => onOpenChange(false));
   if (!open || !src || typeof document === "undefined") return null;
-  return createPortal2(/* @__PURE__ */ jsxs5("div", { ref: previewRef, className: "sia-image-preview", role: "dialog", "aria-modal": "true", "aria-label": "\u56FE\u7247\u9884\u89C8", tabIndex: -1, onClick: () => onOpenChange(false), children: [
-    /* @__PURE__ */ jsx5("button", { type: "button", "aria-label": "\u5173\u95ED\u9884\u89C8", onClick: () => onOpenChange(false), children: /* @__PURE__ */ jsx5(Icon, { name: "close" }) }),
-    /* @__PURE__ */ jsx5("img", { src, alt, onClick: (event) => event.stopPropagation() })
+  return createPortal2(/* @__PURE__ */ jsxs6("div", { ref: previewRef, className: "sia-image-preview", role: "dialog", "aria-modal": "true", "aria-label": "\u56FE\u7247\u9884\u89C8", tabIndex: -1, onClick: () => onOpenChange(false), children: [
+    /* @__PURE__ */ jsx6("button", { type: "button", "aria-label": "\u5173\u95ED\u9884\u89C8", onClick: () => onOpenChange(false), children: /* @__PURE__ */ jsx6(Icon, { name: "close" }) }),
+    /* @__PURE__ */ jsx6("img", { src, alt, onClick: (event) => event.stopPropagation() })
   ] }), document.body);
 }
 function Image({ fallback, placeholder, preview = true, rootClassName = "", className = "", src, alt = "", onError, style, ...props }) {
   const config = typeof preview === "object" ? preview : {};
   const controlled = typeof preview === "object" && preview.open !== void 0;
-  const [internalOpen, setInternalOpen] = useState4(false);
+  const [internalOpen, setInternalOpen] = useState5(false);
   const open = controlled ? config.open : internalOpen;
-  const [loaded, setLoaded] = useState4(false);
-  const [failed, setFailed] = useState4(false);
+  const [loaded, setLoaded] = useState5(false);
+  const [failed, setFailed] = useState5(false);
   const displaySrc = failed && fallback ? fallback : src;
   const radius = typeof style?.borderRadius === "number" ? `${style.borderRadius}px` : style?.borderRadius;
   const rootStyle = {
@@ -825,23 +895,23 @@ function Image({ fallback, placeholder, preview = true, rootClassName = "", clas
     if (!controlled) setInternalOpen(next);
     config.onOpenChange?.(next);
   }
-  return /* @__PURE__ */ jsxs5("span", { className: `sia-image ${rootClassName}`.trim(), style: rootStyle, children: [
-    !loaded && placeholder ? /* @__PURE__ */ jsx5("span", { className: "sia-image__placeholder", children: placeholder }) : null,
-    /* @__PURE__ */ jsx5("img", { ...props, src: displaySrc, alt, className, onLoad: () => setLoaded(true), onError: (event) => {
+  return /* @__PURE__ */ jsxs6("span", { className: `sia-image ${rootClassName}`.trim(), style: rootStyle, children: [
+    !loaded && placeholder ? /* @__PURE__ */ jsx6("span", { className: "sia-image__placeholder", children: placeholder }) : null,
+    /* @__PURE__ */ jsx6("img", { ...withTitleTooltip(props), src: displaySrc, alt, className, onLoad: () => setLoaded(true), onError: (event) => {
       if (!failed && fallback) setFailed(true);
       onError?.(event);
     } }),
-    preview ? /* @__PURE__ */ jsx5("button", { type: "button", className: "sia-image__mask", "aria-label": "\u9884\u89C8\u56FE\u7247", onClick: () => setOpen(true), children: config.mask ?? /* @__PURE__ */ jsxs5(Fragment3, { children: [
-      /* @__PURE__ */ jsx5(Icon, { name: "eye" }),
+    preview ? /* @__PURE__ */ jsx6("button", { type: "button", className: "sia-image__mask", "aria-label": "\u9884\u89C8\u56FE\u7247", onClick: () => setOpen(true), children: config.mask ?? /* @__PURE__ */ jsxs6(Fragment3, { children: [
+      /* @__PURE__ */ jsx6(Icon, { name: "eye" }),
       "\u9884\u89C8"
     ] }) }) : null,
-    /* @__PURE__ */ jsx5(ImagePreview, { open, src: config.src ?? displaySrc, alt, onOpenChange: setOpen })
+    /* @__PURE__ */ jsx6(ImagePreview, { open, src: config.src ?? displaySrc, alt, onOpenChange: setOpen })
   ] });
 }
 
 // src/components/Upload.tsx
-import { useId as useId2, useRef as useRef4 } from "react";
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { useId as useId2, useRef as useRef5 } from "react";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 var LIST_IGNORE = /* @__PURE__ */ Symbol("SIA_UPLOAD_LIST_IGNORE");
 function UploadRoot({
   accept,
@@ -863,8 +933,8 @@ function UploadRoot({
   onDrop,
   ...props
 }) {
-  const inputRef = useRef4(null);
-  const filesRef = useRef4(fileList ?? defaultFileList);
+  const inputRef = useRef5(null);
+  const filesRef = useRef5(fileList ?? defaultFileList);
   const id = useId2();
   const [files, setFiles] = useControllableState({ value: fileList, defaultValue: defaultFileList });
   filesRef.current = files;
@@ -924,7 +994,7 @@ function UploadRoot({
     const next = files.filter((item) => item.uid !== file.uid);
     emit({ ...file, status: "ready" }, next);
   }
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       className: `sia-upload sia-upload--${listType} ${className}`.trim(),
@@ -933,9 +1003,9 @@ function UploadRoot({
         if (!event.defaultPrevented && !disabled) event.preventDefault();
       },
       onDrop: handleDrop,
-      ...props,
+      ...withTitleTooltip(props),
       children: [
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           "input",
           {
             ref: inputRef,
@@ -945,26 +1015,26 @@ function UploadRoot({
             accept,
             multiple,
             disabled,
-            ...directory ? { webkitdirectory: "", directory: "" } : {},
+            ...withTitleTooltip(directory ? { webkitdirectory: "", directory: "" } : {}),
             onChange: handleFiles
           }
         ),
-        /* @__PURE__ */ jsx6("div", { className: "sia-upload__trigger", onClick: () => !disabled && inputRef.current?.click(), children: children ?? /* @__PURE__ */ jsx6(Button, { icon: /* @__PURE__ */ jsx6(Icon, { name: "upload", size: 16 }), disabled, children: "\u9009\u62E9\u6587\u4EF6" }) }),
-        showUploadList && files.length ? /* @__PURE__ */ jsx6("div", { className: "sia-upload__list", children: files.map((file) => /* @__PURE__ */ jsxs6("div", { className: `sia-upload__item sia-upload__item--${file.status ?? "ready"}`, children: [
-          /* @__PURE__ */ jsx6(Icon, { name: file.status === "done" ? "circle-check" : "file", size: 16 }),
-          /* @__PURE__ */ jsx6("span", { className: "sia-upload__name", title: file.name, children: file.name }),
-          file.status === "uploading" ? /* @__PURE__ */ jsx6("span", { className: "sia-upload__progress", children: /* @__PURE__ */ jsx6("span", { style: { width: `${file.percent ?? 0}%` } }) }) : null,
-          /* @__PURE__ */ jsx6("button", { type: "button", "aria-label": `\u79FB\u9664 ${file.name}`, onClick: () => void remove(file), children: /* @__PURE__ */ jsx6(Icon, { name: "close", size: 14 }) })
+        /* @__PURE__ */ jsx7("div", { className: "sia-upload__trigger", onClick: () => !disabled && inputRef.current?.click(), children: children ?? /* @__PURE__ */ jsx7(Button, { icon: /* @__PURE__ */ jsx7(Icon, { name: "upload", size: 16 }), disabled, children: "\u9009\u62E9\u6587\u4EF6" }) }),
+        showUploadList && files.length ? /* @__PURE__ */ jsx7("div", { className: "sia-upload__list", children: files.map((file) => /* @__PURE__ */ jsxs7("div", { className: `sia-upload__item sia-upload__item--${file.status ?? "ready"}`, children: [
+          /* @__PURE__ */ jsx7(Icon, { name: file.status === "done" ? "circle-check" : "file", size: 16 }),
+          /* @__PURE__ */ jsx7("span", { className: "sia-upload__name", ...withTitleTooltip({ title: file.name }), children: file.name }),
+          file.status === "uploading" ? /* @__PURE__ */ jsx7("span", { className: "sia-upload__progress", children: /* @__PURE__ */ jsx7("span", { style: { width: `${file.percent ?? 0}%` } }) }) : null,
+          /* @__PURE__ */ jsx7("button", { type: "button", "aria-label": `\u79FB\u9664 ${file.name}`, onClick: () => void remove(file), children: /* @__PURE__ */ jsx7(Icon, { name: "close", size: 14 }) })
         ] }, file.uid)) }) : null
       ]
     }
   );
 }
 function UploadDragger({ hint = "\u652F\u6301\u5355\u4E2A\u6216\u6279\u91CF\u4E0A\u4F20", children, className = "", ...props }) {
-  return /* @__PURE__ */ jsx6(UploadRoot, { ...props, className: `sia-upload-dragger ${className}`.trim(), children: children ?? /* @__PURE__ */ jsxs6("div", { className: "sia-upload-dragger__content", children: [
-    /* @__PURE__ */ jsx6(Icon, { name: "upload", size: 28 }),
-    /* @__PURE__ */ jsx6("strong", { children: "\u70B9\u51FB\u6216\u62D6\u62FD\u6587\u4EF6\u5230\u6B64\u533A\u57DF\u4E0A\u4F20" }),
-    /* @__PURE__ */ jsx6("span", { children: hint })
+  return /* @__PURE__ */ jsx7(UploadRoot, { ...props, className: `sia-upload-dragger ${className}`.trim(), children: children ?? /* @__PURE__ */ jsxs7("div", { className: "sia-upload-dragger__content", children: [
+    /* @__PURE__ */ jsx7(Icon, { name: "upload", size: 28 }),
+    /* @__PURE__ */ jsx7("strong", { children: "\u70B9\u51FB\u6216\u62D6\u62FD\u6587\u4EF6\u5230\u6B64\u533A\u57DF\u4E0A\u4F20" }),
+    /* @__PURE__ */ jsx7("span", { children: hint })
   ] }) });
 }
 var Upload = Object.assign(UploadRoot, {
@@ -976,7 +1046,7 @@ var Upload = Object.assign(UploadRoot, {
 
 // src/components/Message.tsx
 import { createRoot as createRoot2 } from "react-dom/client";
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
 var messageSeed = 0;
 var messageRoot = null;
 var messageContainer = null;
@@ -985,11 +1055,11 @@ var defaultDuration = 3;
 var maxCount = 5;
 var messageTimers = /* @__PURE__ */ new Map();
 var messageIcons = {
-  info: /* @__PURE__ */ jsx7(Icon, { name: "info", size: 18 }),
-  success: /* @__PURE__ */ jsx7(Icon, { name: "circle-check", size: 18 }),
-  warning: /* @__PURE__ */ jsx7(Icon, { name: "warning", size: 18 }),
-  error: /* @__PURE__ */ jsx7(Icon, { name: "circle-close", size: 18 }),
-  loading: /* @__PURE__ */ jsx7(Icon, { name: "loader", size: 18, spin: true })
+  info: /* @__PURE__ */ jsx8(Icon, { name: "info", size: 18 }),
+  success: /* @__PURE__ */ jsx8(Icon, { name: "circle-check", size: 18 }),
+  warning: /* @__PURE__ */ jsx8(Icon, { name: "warning", size: 18 }),
+  error: /* @__PURE__ */ jsx8(Icon, { name: "circle-close", size: 18 }),
+  loading: /* @__PURE__ */ jsx8(Icon, { name: "loader", size: 18, spin: true })
 };
 function ensureMessageRoot() {
   if (typeof document === "undefined") return false;
@@ -1003,10 +1073,10 @@ function ensureMessageRoot() {
 }
 function renderMessages() {
   if (!ensureMessageRoot()) return;
-  messageRoot.render(/* @__PURE__ */ jsx7("div", { className: "sia-message-list", "aria-live": "polite", children: messageItems.map((item) => /* @__PURE__ */ jsxs7("div", { className: `sia-message sia-message--${item.type}`, role: item.type === "loading" ? "status" : "alert", children: [
-    /* @__PURE__ */ jsx7("span", { className: "sia-message__icon", "aria-hidden": "true", children: messageIcons[item.type] }),
-    /* @__PURE__ */ jsx7("span", { className: "sia-message__content", children: item.content }),
-    item.closable ? /* @__PURE__ */ jsx7("button", { type: "button", className: "sia-message__close", "aria-label": "\u5173\u95ED\u63D0\u793A", onClick: () => closeMessage(item.key), children: /* @__PURE__ */ jsx7(Icon, { name: "close", size: 14 }) }) : null
+  messageRoot.render(/* @__PURE__ */ jsx8("div", { className: "sia-message-list", "aria-live": "polite", children: messageItems.map((item) => /* @__PURE__ */ jsxs8("div", { className: `sia-message sia-message--${item.type}`, role: item.type === "loading" ? "status" : "alert", children: [
+    /* @__PURE__ */ jsx8("span", { className: "sia-message__icon", "aria-hidden": "true", children: messageIcons[item.type] }),
+    /* @__PURE__ */ jsx8("span", { className: "sia-message__content", children: item.content }),
+    item.closable ? /* @__PURE__ */ jsx8("button", { type: "button", className: "sia-message__close", "aria-label": "\u5173\u95ED\u63D0\u793A", onClick: () => closeMessage(item.key), children: /* @__PURE__ */ jsx8(Icon, { name: "close", size: 14 }) }) : null
   ] }, item.key)) }));
 }
 function closeMessage(key) {
@@ -1080,29 +1150,29 @@ var message = {
 };
 
 // src/components/Breadcrumb.tsx
-import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 function Breadcrumb({ items, separator = "/", itemRender, className = "", ...props }) {
-  return /* @__PURE__ */ jsx8("nav", { "aria-label": "\u9762\u5305\u5C51\u5BFC\u822A", ...props, className: `sia-breadcrumb ${className}`.trim(), children: /* @__PURE__ */ jsx8("ol", { className: "sia-breadcrumb__list", children: items.map((item, index) => {
+  return /* @__PURE__ */ jsx9("nav", { "aria-label": "\u9762\u5305\u5C51\u5BFC\u822A", ...withTitleTooltip(props), className: `sia-breadcrumb ${className}`.trim(), children: /* @__PURE__ */ jsx9("ol", { className: "sia-breadcrumb__list", children: items.map((item, index) => {
     const current = index === items.length - 1;
-    const content = /* @__PURE__ */ jsxs8(Fragment4, { children: [
-      item.icon ? /* @__PURE__ */ jsx8("span", { className: "sia-breadcrumb__icon", "aria-hidden": "true", children: item.icon }) : null,
-      /* @__PURE__ */ jsx8("span", { className: "sia-breadcrumb__title", children: item.title })
+    const content = /* @__PURE__ */ jsxs9(Fragment4, { children: [
+      item.icon ? /* @__PURE__ */ jsx9("span", { className: "sia-breadcrumb__icon", "aria-hidden": "true", children: item.icon }) : null,
+      /* @__PURE__ */ jsx9("span", { className: "sia-breadcrumb__title", children: item.title })
     ] });
     const custom = itemRender?.(item, index, items);
-    const label = item.disabled ? /* @__PURE__ */ jsx8("span", { className: "sia-breadcrumb__label", "aria-disabled": "true", children: content }) : custom !== void 0 ? /* @__PURE__ */ jsx8("span", { className: "sia-breadcrumb__label", children: custom }) : item.href ? /* @__PURE__ */ jsx8("a", { className: "sia-breadcrumb__label", href: item.href, target: item.target, rel: item.target === "_blank" ? "noopener noreferrer" : void 0, onClick: item.onClick, children: content }) : item.onClick ? /* @__PURE__ */ jsx8(Button, { className: "sia-breadcrumb__label", variant: "text", onClick: item.onClick, children: content }) : /* @__PURE__ */ jsx8("span", { className: "sia-breadcrumb__label", children: content });
-    return /* @__PURE__ */ jsxs8("li", { className: `sia-breadcrumb__item${current ? " is-current" : ""}${item.disabled ? " is-disabled" : ""}`, children: [
-      /* @__PURE__ */ jsxs8("span", { className: "sia-breadcrumb__entry", "aria-current": current ? "page" : void 0, children: [
+    const label = item.disabled ? /* @__PURE__ */ jsx9("span", { className: "sia-breadcrumb__label", "aria-disabled": "true", children: content }) : custom !== void 0 ? /* @__PURE__ */ jsx9("span", { className: "sia-breadcrumb__label", children: custom }) : item.href ? /* @__PURE__ */ jsx9("a", { className: "sia-breadcrumb__label", href: item.href, target: item.target, rel: item.target === "_blank" ? "noopener noreferrer" : void 0, onClick: item.onClick, children: content }) : item.onClick ? /* @__PURE__ */ jsx9(Button, { className: "sia-breadcrumb__label", variant: "text", onClick: item.onClick, children: content }) : /* @__PURE__ */ jsx9("span", { className: "sia-breadcrumb__label", children: content });
+    return /* @__PURE__ */ jsxs9("li", { className: `sia-breadcrumb__item${current ? " is-current" : ""}${item.disabled ? " is-disabled" : ""}`, children: [
+      /* @__PURE__ */ jsxs9("span", { className: "sia-breadcrumb__entry", "aria-current": current ? "page" : void 0, children: [
         label,
-        item.menu?.items.length ? /* @__PURE__ */ jsx8(Dropdown, { menu: item.menu, trigger: ["click"], disabled: item.disabled, children: /* @__PURE__ */ jsx8(Button, { className: "sia-breadcrumb__menu-trigger", variant: "text", size: "small", disabled: item.disabled, "aria-label": `\u5C55\u5F00${typeof item.title === "string" ? item.title : "\u5C42\u7EA7"}\u83DC\u5355`, icon: /* @__PURE__ */ jsx8(Icon, { name: "chevron-down", size: 12 }) }) }) : null
+        item.menu?.items.length ? /* @__PURE__ */ jsx9(Dropdown, { menu: item.menu, trigger: ["click"], disabled: item.disabled, children: /* @__PURE__ */ jsx9(Button, { className: "sia-breadcrumb__menu-trigger", variant: "text", size: "small", disabled: item.disabled, "aria-label": `\u5C55\u5F00${typeof item.title === "string" ? item.title : "\u5C42\u7EA7"}\u83DC\u5355`, icon: /* @__PURE__ */ jsx9(Icon, { name: "chevron-down", size: 12 }) }) }) : null
       ] }),
-      !current ? /* @__PURE__ */ jsx8("span", { className: "sia-breadcrumb__separator", "aria-hidden": "true", children: item.separator === void 0 ? separator : item.separator }) : null
+      !current ? /* @__PURE__ */ jsx9("span", { className: "sia-breadcrumb__separator", "aria-hidden": "true", children: item.separator === void 0 ? separator : item.separator }) : null
     ] }, item.key ?? index);
   }) }) });
 }
 
 // src/components/Typography.tsx
-import { useEffect as useEffect3, useLayoutEffect as useLayoutEffect2, useRef as useRef5, useState as useState5 } from "react";
-import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useEffect as useEffect3, useLayoutEffect as useLayoutEffect3, useRef as useRef6, useState as useState6 } from "react";
+import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 function TypographyContent({
   as: Tag2 = "span",
   type,
@@ -1121,16 +1191,16 @@ function TypographyContent({
   className = "",
   ...props
 }) {
-  const contentRef = useRef5(null);
-  const editRef = useRef5(null);
-  const timer = useRef5();
-  const [localText, setLocalText] = useState5();
-  const [draft, setDraft] = useState5("");
-  const [editing, setEditing] = useState5(false);
-  const [copied, setCopied] = useState5(false);
-  const [copyError, setCopyError] = useState5(false);
-  const [expanded, setExpanded] = useState5(false);
-  const [overflow, setOverflow] = useState5(false);
+  const contentRef = useRef6(null);
+  const editRef = useRef6(null);
+  const timer = useRef6();
+  const [localText, setLocalText] = useState6();
+  const [draft, setDraft] = useState6("");
+  const [editing, setEditing] = useState6(false);
+  const [copied, setCopied] = useState6(false);
+  const [copyError, setCopyError] = useState6(false);
+  const [expanded, setExpanded] = useState6(false);
+  const [overflow, setOverflow] = useState6(false);
   const editConfig = typeof editable === "object" ? editable : void 0;
   const content = editConfig?.text ?? localText ?? children;
   const requestedRows = typeof ellipsis === "object" ? ellipsis.rows ?? 1 : 1;
@@ -1140,7 +1210,7 @@ function TypographyContent({
     setLocalText(void 0);
   }, [children]);
   useEffect3(() => () => clearTimeout(timer.current), []);
-  useLayoutEffect2(() => {
+  useLayoutEffect3(() => {
     const element = contentRef.current;
     if (!element || !ellipsis || editing || expanded) return;
     const measure = () => setOverflow(element.scrollHeight > element.clientHeight + 1 || element.scrollWidth > element.clientWidth + 1);
@@ -1171,15 +1241,15 @@ function TypographyContent({
     requestAnimationFrame(() => editRef.current?.focus());
   }
   let formatted = content;
-  if (strong) formatted = /* @__PURE__ */ jsx9("strong", { children: formatted });
-  if (italic) formatted = /* @__PURE__ */ jsx9("em", { children: formatted });
-  if (underline) formatted = /* @__PURE__ */ jsx9("u", { children: formatted });
-  if (deleted) formatted = /* @__PURE__ */ jsx9("del", { children: formatted });
-  if (mark) formatted = /* @__PURE__ */ jsx9("mark", { children: formatted });
-  if (code) formatted = /* @__PURE__ */ jsx9("code", { children: formatted });
-  if (keyboard) formatted = /* @__PURE__ */ jsx9("kbd", { children: formatted });
-  return /* @__PURE__ */ jsx9(Tag2, { ...props, "aria-disabled": disabled || void 0, className: `sia-typography sia-typography--${Tag2}${type ? ` sia-typography--${type}` : ""}${disabled ? " is-disabled" : ""} ${className}`.trim(), children: editing ? /* @__PURE__ */ jsxs9("span", { className: "sia-typography__editor", children: [
-    /* @__PURE__ */ jsx9(
+  if (strong) formatted = /* @__PURE__ */ jsx10("strong", { children: formatted });
+  if (italic) formatted = /* @__PURE__ */ jsx10("em", { children: formatted });
+  if (underline) formatted = /* @__PURE__ */ jsx10("u", { children: formatted });
+  if (deleted) formatted = /* @__PURE__ */ jsx10("del", { children: formatted });
+  if (mark) formatted = /* @__PURE__ */ jsx10("mark", { children: formatted });
+  if (code) formatted = /* @__PURE__ */ jsx10("code", { children: formatted });
+  if (keyboard) formatted = /* @__PURE__ */ jsx10("kbd", { children: formatted });
+  return /* @__PURE__ */ jsx10(Tag2, { ...withTitleTooltip(props), "aria-disabled": disabled || void 0, className: `sia-typography sia-typography--${Tag2}${type ? ` sia-typography--${type}` : ""}${disabled ? " is-disabled" : ""} ${className}`.trim(), children: editing ? /* @__PURE__ */ jsxs10("span", { className: "sia-typography__editor", children: [
+    /* @__PURE__ */ jsx10(
       TextArea,
       {
         autoFocus: true,
@@ -1201,35 +1271,35 @@ function TypographyContent({
         }
       }
     ),
-    /* @__PURE__ */ jsxs9("span", { className: "sia-typography__edit-actions", children: [
-      /* @__PURE__ */ jsx9(Button, { size: "small", onClick: () => finish(false), children: "\u53D6\u6D88" }),
-      /* @__PURE__ */ jsx9(Button, { size: "small", variant: "primary", onClick: () => finish(true), children: "\u4FDD\u5B58" })
+    /* @__PURE__ */ jsxs10("span", { className: "sia-typography__edit-actions", children: [
+      /* @__PURE__ */ jsx10(Button, { size: "small", onClick: () => finish(false), children: "\u53D6\u6D88" }),
+      /* @__PURE__ */ jsx10(Button, { size: "small", variant: "primary", onClick: () => finish(true), children: "\u4FDD\u5B58" })
     ] })
-  ] }) : /* @__PURE__ */ jsxs9(Fragment5, { children: [
-    /* @__PURE__ */ jsx9("span", { ref: contentRef, className: ellipsis && !expanded ? "sia-typography__ellipsis" : void 0, style: ellipsis && !expanded ? { "--sia-typography-rows": rows } : void 0, children: formatted }),
-    expandable && (overflow || expanded) ? /* @__PURE__ */ jsx9(Button, { variant: "link", size: "small", className: "sia-typography__action", "aria-expanded": expanded, disabled, onClick: () => setExpanded(!expanded), children: expanded ? "\u6536\u8D77" : "\u5C55\u5F00" }) : null,
-    editable ? /* @__PURE__ */ jsx9(Button, { ref: editRef, variant: "text", size: "small", className: "sia-typography__action", "aria-label": "\u7F16\u8F91\u6587\u672C", title: "\u7F16\u8F91", disabled, icon: /* @__PURE__ */ jsx9(Icon, { name: "edit", size: 14 }), onClick: () => {
+  ] }) : /* @__PURE__ */ jsxs10(Fragment5, { children: [
+    /* @__PURE__ */ jsx10("span", { ref: contentRef, className: ellipsis && !expanded ? "sia-typography__ellipsis" : void 0, style: ellipsis && !expanded ? { "--sia-typography-rows": rows } : void 0, children: formatted }),
+    expandable && (overflow || expanded) ? /* @__PURE__ */ jsx10(Button, { variant: "link", size: "small", className: "sia-typography__action", "aria-expanded": expanded, disabled, onClick: () => setExpanded(!expanded), children: expanded ? "\u6536\u8D77" : "\u5C55\u5F00" }) : null,
+    editable ? /* @__PURE__ */ jsx10(Button, { ref: editRef, variant: "text", size: "small", className: "sia-typography__action", "aria-label": "\u7F16\u8F91\u6587\u672C", title: "\u7F16\u8F91", disabled, icon: /* @__PURE__ */ jsx10(Icon, { name: "edit", size: 14 }), onClick: () => {
       setDraft(contentRef.current?.textContent ?? "");
       setEditing(true);
     } }) : null,
-    copyable ? /* @__PURE__ */ jsx9(Button, { variant: "text", size: "small", className: "sia-typography__action", "aria-label": copied ? "\u5DF2\u590D\u5236" : "\u590D\u5236\u6587\u672C", title: copied ? "\u5DF2\u590D\u5236" : "\u590D\u5236", disabled, icon: /* @__PURE__ */ jsx9(Icon, { name: copied ? "check" : "copy", size: 14 }), onClick: () => void copy() }) : null,
-    copyError ? /* @__PURE__ */ jsx9("span", { role: "status", className: "sia-typography--danger", children: "\u590D\u5236\u5931\u8D25\uFF0C\u8BF7\u624B\u52A8\u9009\u62E9\u6587\u672C\u590D\u5236\u3002" }) : null
+    copyable ? /* @__PURE__ */ jsx10(Button, { variant: "text", size: "small", className: "sia-typography__action", "aria-label": copied ? "\u5DF2\u590D\u5236" : "\u590D\u5236\u6587\u672C", title: copied ? "\u5DF2\u590D\u5236" : "\u590D\u5236", disabled, icon: /* @__PURE__ */ jsx10(Icon, { name: copied ? "check" : "copy", size: 14 }), onClick: () => void copy() }) : null,
+    copyError ? /* @__PURE__ */ jsx10("span", { role: "status", className: "sia-typography--danger", children: "\u590D\u5236\u5931\u8D25\uFF0C\u8BF7\u624B\u52A8\u9009\u62E9\u6587\u672C\u590D\u5236\u3002" }) : null
   ] }) });
 }
 function Title({ level = 1, ...props }) {
-  return /* @__PURE__ */ jsx9(TypographyContent, { ...props, as: `h${level}` });
+  return /* @__PURE__ */ jsx10(TypographyContent, { ...props, as: `h${level}` });
 }
 function Text(props) {
-  return /* @__PURE__ */ jsx9(TypographyContent, { ...props });
+  return /* @__PURE__ */ jsx10(TypographyContent, { ...props });
 }
 function Paragraph(props) {
-  return /* @__PURE__ */ jsx9(TypographyContent, { ...props, as: "p" });
+  return /* @__PURE__ */ jsx10(TypographyContent, { ...props, as: "p" });
 }
 function Link({ disabled, className = "", onClick, href, target, rel, ...props }) {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "a",
     {
-      ...props,
+      ...withTitleTooltip(props),
       href: disabled ? void 0 : href,
       target,
       rel: rel ?? (target === "_blank" ? "noopener noreferrer" : void 0),
@@ -1244,7 +1314,7 @@ function Link({ disabled, className = "", onClick, href, target, rel, ...props }
   );
 }
 function TypographyRoot({ className = "", ...props }) {
-  return /* @__PURE__ */ jsx9("div", { ...props, className: `sia-typography ${className}`.trim() });
+  return /* @__PURE__ */ jsx10("div", { ...withTitleTooltip(props), className: `sia-typography ${className}`.trim() });
 }
 var Typography = Object.assign(TypographyRoot, {
   /** 语义化标题，支持标题级别、复制和编辑。 */
@@ -1258,8 +1328,8 @@ var Typography = Object.assign(TypographyRoot, {
 });
 
 // src/components/FloatButton.tsx
-import { createContext, forwardRef, useContext, useEffect as useEffect4, useId as useId3, useRef as useRef6, useState as useState6 } from "react";
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { createContext, forwardRef, useContext, useEffect as useEffect4, useId as useId3, useRef as useRef7, useState as useState7 } from "react";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 var GroupShape = createContext(void 0);
 var FloatButtonRoot = forwardRef(function FloatButton({
   icon,
@@ -1276,21 +1346,21 @@ var FloatButtonRoot = forwardRef(function FloatButton({
 }, ref) {
   const groupShape = useContext(GroupShape);
   const label = props["aria-label"] ?? (typeof tooltip === "string" ? tooltip : typeof description === "string" ? description : "\u60AC\u6D6E\u64CD\u4F5C");
-  const button = /* @__PURE__ */ jsx10(
+  const button = /* @__PURE__ */ jsx11(
     "button",
     {
-      ...props,
+      ...withTitleTooltip(props),
       ref,
       type: htmlType,
       "aria-label": label,
       className: `sia-float-button sia-float-button--${groupShape ?? shape} sia-float-button--${type} ${className}`.trim(),
-      children: /* @__PURE__ */ jsx10(Badge, { ...badge, className: "sia-float-button__badge", children: /* @__PURE__ */ jsxs10("span", { className: "sia-float-button__body", children: [
-        icon !== null ? /* @__PURE__ */ jsx10("span", { className: "sia-float-button__icon", children: icon ?? /* @__PURE__ */ jsx10(Icon, { name: "question", size: 20 }) }) : null,
-        description != null || children != null ? /* @__PURE__ */ jsx10("span", { className: "sia-float-button__description", children: description ?? children }) : null
+      children: /* @__PURE__ */ jsx11(Badge, { ...badge, className: "sia-float-button__badge", children: /* @__PURE__ */ jsxs11("span", { className: "sia-float-button__body", children: [
+        icon !== null ? /* @__PURE__ */ jsx11("span", { className: "sia-float-button__icon", children: icon ?? /* @__PURE__ */ jsx11(Icon, { name: "question", size: 20 }) }) : null,
+        description != null || children != null ? /* @__PURE__ */ jsx11("span", { className: "sia-float-button__description", children: description ?? children }) : null
       ] }) })
     }
   );
-  return /* @__PURE__ */ jsx10("span", { className: "sia-float-button-root", style, children: tooltip ? /* @__PURE__ */ jsx10(Tooltip, { title: tooltip, placement: "left", children: button }) : button });
+  return /* @__PURE__ */ jsx11("span", { className: "sia-float-button-root", style, children: tooltip ? /* @__PURE__ */ jsx11(Tooltip, { title: tooltip, placement: "left", children: button }) : button });
 });
 function FloatButtonGroup({
   shape = "circle",
@@ -1312,8 +1382,8 @@ function FloatButtonGroup({
   ...props
 }) {
   const [visible, setVisible] = useControllableState({ value: open, defaultValue: defaultOpen, onChange: onOpenChange });
-  const rootRef = useRef6(null);
-  const triggerRef = useRef6(null);
+  const rootRef = useRef7(null);
+  const triggerRef = useRef7(null);
   const id = useId3();
   useEffect4(() => {
     if (!trigger || !visible) return;
@@ -1323,10 +1393,10 @@ function FloatButtonGroup({
     document.addEventListener("pointerdown", close);
     return () => document.removeEventListener("pointerdown", close);
   }, [trigger, visible, setVisible]);
-  return /* @__PURE__ */ jsx10(GroupShape.Provider, { value: shape, children: /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsx11(GroupShape.Provider, { value: shape, children: /* @__PURE__ */ jsxs11(
     "div",
     {
-      ...props,
+      ...withTitleTooltip(props),
       ref: rootRef,
       role: "group",
       className: `sia-float-button-group sia-float-button-group--${shape} sia-float-button-group--${placement}${trigger ? " sia-float-button-group--menu" : ""} ${className}`.trim(),
@@ -1350,13 +1420,13 @@ function FloatButtonGroup({
         }
       },
       children: [
-        !trigger || visible ? /* @__PURE__ */ jsx10("div", { id, className: "sia-float-button-group__list", children }) : null,
-        trigger ? /* @__PURE__ */ jsx10(
+        !trigger || visible ? /* @__PURE__ */ jsx11("div", { id, className: "sia-float-button-group__list", children }) : null,
+        trigger ? /* @__PURE__ */ jsx11(
           FloatButtonRoot,
           {
             ref: triggerRef,
             type,
-            icon: visible ? closeIcon ?? /* @__PURE__ */ jsx10(Icon, { name: "close", size: 20 }) : icon ?? /* @__PURE__ */ jsx10(Icon, { name: "plus", size: 20 }),
+            icon: visible ? closeIcon ?? /* @__PURE__ */ jsx11(Icon, { name: "close", size: 20 }) : icon ?? /* @__PURE__ */ jsx11(Icon, { name: "plus", size: 20 }),
             tooltip,
             "aria-label": visible ? "\u6536\u8D77\u60AC\u6D6E\u83DC\u5355" : "\u5C55\u5F00\u60AC\u6D6E\u83DC\u5355",
             "aria-expanded": visible,
@@ -1369,7 +1439,7 @@ function FloatButtonGroup({
   ) });
 }
 function FloatButtonBackTop({ target, visibilityHeight = 400, behavior = "smooth", onClick, icon, tooltip = "\u8FD4\u56DE\u9876\u90E8", ...props }) {
-  const [visible, setVisible] = useState6(false);
+  const [visible, setVisible] = useState7(false);
   useEffect4(() => {
     const element = target ? target() : window;
     if (!element) return;
@@ -1379,7 +1449,7 @@ function FloatButtonBackTop({ target, visibilityHeight = 400, behavior = "smooth
     return () => element.removeEventListener("scroll", update);
   }, [target, visibilityHeight]);
   if (!visible) return null;
-  return /* @__PURE__ */ jsx10(FloatButtonRoot, { ...props, tooltip, icon: icon ?? /* @__PURE__ */ jsx10(Icon, { name: "arrow-up", size: 20 }), onClick: (event) => {
+  return /* @__PURE__ */ jsx11(FloatButtonRoot, { ...props, tooltip, icon: icon ?? /* @__PURE__ */ jsx11(Icon, { name: "arrow-up", size: 20 }), onClick: (event) => {
     onClick?.(event);
     if (event.defaultPrevented) return;
     const element = target ? target() : window;
@@ -1394,6 +1464,7 @@ var FloatButton2 = Object.assign(FloatButtonRoot, {
 });
 
 export {
+  Toolbar,
   Card,
   Tag,
   Tabs,