@manohub/ui 0.6.0 → 0.7.0

package/README.md

@@ -7,7 +7,7 @@ AIHub **自绘组件层**：不依赖 farris 的手写 Vue TSX 组件 + 自带
 | 层 | 入口 | 内容 |
 |---|---|---|
 | ① 主题 | `@manohub/theme/default.css`（兜底）/ `@manohub/theme/farris.css`（Farris 规范） | **全局**令牌（值）—— 随主题包独立发布，换主题只换这一行 |
-| ② 组件面 | `@manohub/ui/styles.css` | 类与状态协议 + 组件令牌基础值，**无需 JS** 即可使用 |
+| ② 组件面 | `@manohub/ui/styles.css` | **元素级 reset**（盒模型 / 按钮外观 / 列表序号 / 链接下划线 / 标题字阶归零）+ 类与状态协议 + 组件令牌基础值，**无需 JS** 即可使用 |
 | ③ Vue 层 | `@manohub/ui` | Vue 组件：渲染 ② 的类 + 行为增强 |
 | ④ 服务层 | `@manohub/ui` | 命令式反馈：`toast()` / `confirm()` / `alert()` / `showLoading()`（宿主 + 队列 + 生命周期，共用 ③ 的组件） |
 
@@ -37,6 +37,14 @@ pnpm add @manohub/ui @manohub/theme
 
 只写静态页（不装 Vue）时引这两行即可 —— 类名与 `data-*` 状态协议直接可用。
 
+**② 的第一条 import 就是元素级 reset**（随包内置，不需要第三行）：盒模型、按钮外观、
+`ul` / `ol` 的序号与缩进、`a` 的下划线、标题的默认字阶一并归零。作用域锚 `[data-manohub-ui]`
+且特异性为 0 —— 应用侧写任何元素选择器都能盖过它，所以**不必再自己写一份全局 reset**。
+
+唯一需要留意的是**富文本**：reset 之后 `ul` / `li` 没有圆点、`a` 没有下划线也没有链接色，
+需要富文本排版的页面请给自己的富文本容器类补回 `list-style` 与链接样式
+（富文本排版暂无合规归属，见 `@manohub/kit/CONTRACT.md` §10）。
+
 本包**可独立发布**：组件与类型一律从 `@manohub/ui` 直接引；下游（如 `@manohub/kit`）若转出口，是下游自己的选择。
 
 ```tsx

package/dist/components/button/index.d.ts

@@ -212,7 +212,7 @@ export declare const Button: import("vue").DefineComponent<import("vue").Extract
 }>> & Readonly<{}>, {
     block: boolean;
     size: ControlSize;
-    icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+    icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
     menu: boolean;
     caret: boolean;
     disabled: boolean;
@@ -223,7 +223,7 @@ export declare const Button: import("vue").DefineComponent<import("vue").Extract
     variant: ButtonVariant;
     danger: boolean;
     shape: ButtonShape;
-    trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+    trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
     href: string;
     target: string;
     popoverTarget: string;
@@ -319,7 +319,7 @@ export declare const ButtonCompound: {
     }>> & Readonly<{}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
         block: boolean;
         size: ControlSize;
-        icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+        icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
         menu: boolean;
         caret: boolean;
         disabled: boolean;
@@ -330,7 +330,7 @@ export declare const ButtonCompound: {
         variant: ButtonVariant;
         danger: boolean;
         shape: ButtonShape;
-        trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+        trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
         href: string;
         target: string;
         popoverTarget: string;
@@ -431,7 +431,7 @@ export declare const ButtonCompound: {
     }>> & Readonly<{}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, {
         block: boolean;
         size: ControlSize;
-        icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+        icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
         menu: boolean;
         caret: boolean;
         disabled: boolean;
@@ -442,7 +442,7 @@ export declare const ButtonCompound: {
         variant: ButtonVariant;
         danger: boolean;
         shape: ButtonShape;
-        trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+        trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
         href: string;
         target: string;
         popoverTarget: string;
@@ -537,7 +537,7 @@ export declare const ButtonCompound: {
 }>> & Readonly<{}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
     block: boolean;
     size: ControlSize;
-    icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+    icon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
     menu: boolean;
     caret: boolean;
     disabled: boolean;
@@ -548,7 +548,7 @@ export declare const ButtonCompound: {
     variant: ButtonVariant;
     danger: boolean;
     shape: ButtonShape;
-    trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "wrench" | "plus" | "bell" | "settings" | "logout" | "home" | "workbench" | "grid-dots" | "heart" | "heart-filled" | "edit" | "refresh" | "upload" | "save" | "more" | "eye" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "sparkles" | "shield-check" | "shield-alert" | "history";
+    trailingIcon: "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
     href: string;
     target: string;
     popoverTarget: string;

package/dist/components/dialog/index.d.ts

@@ -1,5 +1,7 @@
 import { type PropType, type SlotsType, type VNodeChild } from 'vue';
 export type DialogWidth = 'md' | 'lg';
+/** 语义档：决定标题左侧裸符号的图形与颜色（缺省不渲染图标） */
+export type DialogTone = 'info' | 'success' | 'warning' | 'error';
 /**
  * 对话框（**自绘**；模态语义与遮罩全由原生 `<dialog>` 给）。
  *
@@ -45,6 +47,15 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
+    /**
+     * 语义档（缺省不渲染图标）：`warning` / `error` 用于「这一步有风险」的确认 ——
+     * 服务层的 `confirm()` / `alert()` 就是靠它把「删除确认」与「保存成功」区分开的。
+     * 它**只加一个裸符号与配色**，不改标题文案、不动底栏按钮的语义（危险色仍由 `okDanger` 定）。
+     */
+    tone: {
+        type: PropType<DialogTone>;
+        default: undefined;
+    };
     /** 宽度：尺寸档 `md` 520 / `lg` 760，或直接给像素数 */
     width: {
         type: PropType<DialogWidth | number>;
@@ -55,17 +66,24 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
         type: BooleanConstructor;
         default: boolean;
     };
-    /** 点遮罩是否关闭（模态确认类弹窗通常**不**给，防误关） */
+    /**
+     * 点遮罩是否关闭（**默认开**，与主流组件形态一致）。
+     *
+     * 组件是「受控弹窗」，用户点遮罩想退出是最常见的心智；「防误关」只对**命令式确认框**成立
+     * （那里一条误点就丢一次决策），故服务层的 `confirm()` / `alert()` 会**显式**传 `false` 把它关掉 ——
+     * 与 Ant Design 的分工相同（`<Modal maskClosable>` 默认 `true`，`Modal.confirm` 默认 `false`）。
+     * 表单类弹窗若怕手滑丢内容，自己显式传 `:close-on-backdrop="false"`。
+     */
     closeOnBackdrop: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或） */
+    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或；默认同 `true`） */
     maskClosable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** Esc 是否关闭（缺省关；表单类弹窗常关掉它，防手滑丢内容） */
+    /** Esc 是否关闭（缺省开，与 `closeOnBackdrop` 一致 —— 两者面对同一个「误关」风险，口径不得相反） */
     keyboard: {
         type: BooleanConstructor;
         default: boolean;
@@ -75,6 +93,14 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
+    /**
+     * 固定高度（如 `480px` / `min(560px, 80vh)`）—— 与 `panelWidth` 对称。
+     * 给了之后内容区吃满剩余高度并自行滚动，页头与底栏始终可见（`styles/components/dialog.css` 的三段布局）。
+     */
+    panelHeight: {
+        type: StringConstructor;
+        default: undefined;
+    };
     /** 内建底栏：确定按钮文案 */
     okText: {
         type: StringConstructor;
@@ -128,6 +154,15 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
+    /**
+     * 语义档（缺省不渲染图标）：`warning` / `error` 用于「这一步有风险」的确认 ——
+     * 服务层的 `confirm()` / `alert()` 就是靠它把「删除确认」与「保存成功」区分开的。
+     * 它**只加一个裸符号与配色**，不改标题文案、不动底栏按钮的语义（危险色仍由 `okDanger` 定）。
+     */
+    tone: {
+        type: PropType<DialogTone>;
+        default: undefined;
+    };
     /** 宽度：尺寸档 `md` 520 / `lg` 760，或直接给像素数 */
     width: {
         type: PropType<DialogWidth | number>;
@@ -138,17 +173,24 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
         type: BooleanConstructor;
         default: boolean;
     };
-    /** 点遮罩是否关闭（模态确认类弹窗通常**不**给，防误关） */
+    /**
+     * 点遮罩是否关闭（**默认开**，与主流组件形态一致）。
+     *
+     * 组件是「受控弹窗」，用户点遮罩想退出是最常见的心智；「防误关」只对**命令式确认框**成立
+     * （那里一条误点就丢一次决策），故服务层的 `confirm()` / `alert()` 会**显式**传 `false` 把它关掉 ——
+     * 与 Ant Design 的分工相同（`<Modal maskClosable>` 默认 `true`，`Modal.confirm` 默认 `false`）。
+     * 表单类弹窗若怕手滑丢内容，自己显式传 `:close-on-backdrop="false"`。
+     */
     closeOnBackdrop: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或） */
+    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或；默认同 `true`） */
     maskClosable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** Esc 是否关闭（缺省关；表单类弹窗常关掉它，防手滑丢内容） */
+    /** Esc 是否关闭（缺省开，与 `closeOnBackdrop` 一致 —— 两者面对同一个「误关」风险，口径不得相反） */
     keyboard: {
         type: BooleanConstructor;
         default: boolean;
@@ -158,6 +200,14 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
+    /**
+     * 固定高度（如 `480px` / `min(560px, 80vh)`）—— 与 `panelWidth` 对称。
+     * 给了之后内容区吃满剩余高度并自行滚动，页头与底栏始终可见（`styles/components/dialog.css` 的三段布局）。
+     */
+    panelHeight: {
+        type: StringConstructor;
+        default: undefined;
+    };
     /** 内建底栏：确定按钮文案 */
     okText: {
         type: StringConstructor;
@@ -206,11 +256,13 @@ export declare const Dialog: import("vue").DefineComponent<import("vue").Extract
     onCancel: () => void;
     onClose: () => void;
     width: number | DialogWidth;
+    tone: DialogTone;
     closable: boolean;
     closeOnBackdrop: boolean;
     maskClosable: boolean;
     keyboard: boolean;
     panelWidth: string;
+    panelHeight: string;
     okText: string;
     cancelText: string;
     okDanger: boolean;

package/dist/components/dialog/index.js

@@ -1,6 +1,12 @@
 import { defineComponent, ref, watch, onMounted, onBeforeUnmount, computed, createVNode } from "vue";
 import { Icon } from "@manohub/icon";
 import { Button } from "../button/index.js";
+const TONE_ICON = {
+  info: "info",
+  success: "check",
+  warning: "alert",
+  error: "close"
+};
 const Dialog = /* @__PURE__ */ defineComponent({
   name: "Dialog",
   inheritAttrs: false,
@@ -15,6 +21,15 @@ const Dialog = /* @__PURE__ */ defineComponent({
       type: String,
       default: void 0
     },
+    /**
+     * 语义档（缺省不渲染图标）：`warning` / `error` 用于「这一步有风险」的确认 ——
+     * 服务层的 `confirm()` / `alert()` 就是靠它把「删除确认」与「保存成功」区分开的。
+     * 它**只加一个裸符号与配色**，不改标题文案、不动底栏按钮的语义（危险色仍由 `okDanger` 定）。
+     */
+    tone: {
+      type: String,
+      default: void 0
+    },
     /** 宽度：尺寸档 `md` 520 / `lg` 760，或直接给像素数 */
     width: {
       type: [String, Number],
@@ -25,17 +40,24 @@ const Dialog = /* @__PURE__ */ defineComponent({
       type: Boolean,
       default: true
     },
-    /** 点遮罩是否关闭（模态确认类弹窗通常**不**给，防误关） */
+    /**
+     * 点遮罩是否关闭（**默认开**，与主流组件形态一致）。
+     *
+     * 组件是「受控弹窗」，用户点遮罩想退出是最常见的心智；「防误关」只对**命令式确认框**成立
+     * （那里一条误点就丢一次决策），故服务层的 `confirm()` / `alert()` 会**显式**传 `false` 把它关掉 ——
+     * 与 Ant Design 的分工相同（`<Modal maskClosable>` 默认 `true`，`Modal.confirm` 默认 `false`）。
+     * 表单类弹窗若怕手滑丢内容，自己显式传 `:close-on-backdrop="false"`。
+     */
     closeOnBackdrop: {
       type: Boolean,
-      default: false
+      default: true
     },
-    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或） */
+    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或；默认同 `true`） */
     maskClosable: {
       type: Boolean,
-      default: false
+      default: true
     },
-    /** Esc 是否关闭（缺省关；表单类弹窗常关掉它，防手滑丢内容） */
+    /** Esc 是否关闭（缺省开，与 `closeOnBackdrop` 一致 —— 两者面对同一个「误关」风险，口径不得相反） */
     keyboard: {
       type: Boolean,
       default: true
@@ -45,6 +67,14 @@ const Dialog = /* @__PURE__ */ defineComponent({
       type: String,
       default: void 0
     },
+    /**
+     * 固定高度（如 `480px` / `min(560px, 80vh)`）—— 与 `panelWidth` 对称。
+     * 给了之后内容区吃满剩余高度并自行滚动，页头与底栏始终可见（`styles/components/dialog.css` 的三段布局）。
+     */
+    panelHeight: {
+      type: String,
+      default: void 0
+    },
     /** 内建底栏：确定按钮文案 */
     okText: {
       type: String,
@@ -139,11 +169,15 @@ const Dialog = /* @__PURE__ */ defineComponent({
       };
       return void 0;
     });
+    const heightStyle = computed(() => props.panelHeight ? {
+      height: props.panelHeight
+    } : void 0);
     return () => createVNode("dialog", {
       "ref": dialogRef,
-      "class": ["mh-popup", "mh-dialog", props.width === "lg" ? "mh-dialog--lg" : "", attrs.class].filter(Boolean).join(" "),
+      "class": ["mh-popup", "mh-dialog", props.width === "lg" ? "mh-dialog--lg" : "", props.tone ? `mh-dialog--${props.tone}` : "", attrs.class].filter(Boolean).join(" "),
       "style": {
         ...widthStyle.value,
+        ...heightStyle.value,
         ...attrs.style
       },
       "onCancel": (event) => {
@@ -156,9 +190,12 @@ const Dialog = /* @__PURE__ */ defineComponent({
           requestClose("close");
         }
       }
-    }, [props.title || slots.title || props.closable ? createVNode("div", {
+    }, [props.title || slots.title || props.closable || props.tone ? createVNode("div", {
       "class": "mh-dialog__header"
-    }, [createVNode("span", {
+    }, [props.tone ? createVNode(Icon, {
+      "name": TONE_ICON[props.tone],
+      "class": "mh-dialog__tone-icon"
+    }, null) : null, createVNode("span", {
       "class": "mh-dialog__title"
     }, [slots.title ? slots.title() : props.title]), props.closable ? createVNode("button", {
       "type": "button",

package/dist/components/drawer/index.d.ts

@@ -62,17 +62,23 @@ export declare const Drawer: import("vue").DefineComponent<import("vue").Extract
         type: BooleanConstructor;
         default: boolean;
     };
-    /** 点遮罩是否关闭（表单类抽屉通常**不**给，防误关） */
+    /**
+     * 点遮罩是否关闭（**默认开**，与主流组件形态一致）。
+     *
+     * 与 `Dialog` 同一口径：组件形态默认开，「防误关」只对**命令式**形态成立
+     * （服务层的 `confirm()` / `alert()` 显式传 `false`）。
+     * 表单类抽屉若怕手滑丢内容，自己显式传 `:close-on-backdrop="false"`。
+     */
     closeOnBackdrop: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或） */
+    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或；默认同 `true`） */
     maskClosable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** Esc 是否关闭（缺省开；表单类抽屉常关掉它，防手滑丢内容） */
+    /** Esc 是否关闭（缺省开，与 `closeOnBackdrop` 一致） */
     keyboard: {
         type: BooleanConstructor;
         default: boolean;
@@ -145,17 +151,23 @@ export declare const Drawer: import("vue").DefineComponent<import("vue").Extract
         type: BooleanConstructor;
         default: boolean;
     };
-    /** 点遮罩是否关闭（表单类抽屉通常**不**给，防误关） */
+    /**
+     * 点遮罩是否关闭（**默认开**，与主流组件形态一致）。
+     *
+     * 与 `Dialog` 同一口径：组件形态默认开，「防误关」只对**命令式**形态成立
+     * （服务层的 `confirm()` / `alert()` 显式传 `false`）。
+     * 表单类抽屉若怕手滑丢内容，自己显式传 `:close-on-backdrop="false"`。
+     */
     closeOnBackdrop: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或） */
+    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或；默认同 `true`） */
     maskClosable: {
         type: BooleanConstructor;
         default: boolean;
     };
-    /** Esc 是否关闭（缺省开；表单类抽屉常关掉它，防手滑丢内容） */
+    /** Esc 是否关闭（缺省开，与 `closeOnBackdrop` 一致） */
     keyboard: {
         type: BooleanConstructor;
         default: boolean;

package/dist/components/drawer/index.js

@@ -30,17 +30,23 @@ const Drawer = /* @__PURE__ */ defineComponent({
       type: Boolean,
       default: true
     },
-    /** 点遮罩是否关闭（表单类抽屉通常**不**给，防误关） */
+    /**
+     * 点遮罩是否关闭（**默认开**，与主流组件形态一致）。
+     *
+     * 与 `Dialog` 同一口径：组件形态默认开，「防误关」只对**命令式**形态成立
+     * （服务层的 `confirm()` / `alert()` 显式传 `false`）。
+     * 表单类抽屉若怕手滑丢内容，自己显式传 `:close-on-backdrop="false"`。
+     */
     closeOnBackdrop: {
       type: Boolean,
-      default: false
+      default: true
     },
-    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或） */
+    /** `closeOnBackdrop` 的别名（主流库的通行叫法，两者取或；默认同 `true`） */
     maskClosable: {
       type: Boolean,
-      default: false
+      default: true
     },
-    /** Esc 是否关闭（缺省开；表单类抽屉常关掉它，防手滑丢内容） */
+    /** Esc 是否关闭（缺省开，与 `closeOnBackdrop` 一致） */
     keyboard: {
       type: Boolean,
       default: true

package/dist/components/input/index.d.ts

@@ -249,12 +249,12 @@ export declare const Input: import("vue").DefineComponent<import("vue").ExtractP
     autofocus: boolean;
     modelValue: string;
     status: InputStatus;
+    as: "button" | "input";
     readonly: boolean;
     clearable: boolean;
     maxlength: number;
     showCount: boolean;
     onEnter: (v: string) => void;
-    as: "button" | "input";
     controlClass: string;
     controlAttrs: Record<string, unknown>;
     hasValue: boolean;
@@ -547,12 +547,12 @@ export declare const InputCompound: {
         autofocus: boolean;
         modelValue: string;
         status: InputStatus;
+        as: "button" | "input";
         readonly: boolean;
         clearable: boolean;
         maxlength: number;
         showCount: boolean;
         onEnter: (v: string) => void;
-        as: "button" | "input";
         controlClass: string;
         controlAttrs: Record<string, unknown>;
         hasValue: boolean;
@@ -678,12 +678,12 @@ export declare const InputCompound: {
         autofocus: boolean;
         modelValue: string;
         status: InputStatus;
+        as: "button" | "input";
         readonly: boolean;
         clearable: boolean;
         maxlength: number;
         showCount: boolean;
         onEnter: (v: string) => void;
-        as: "button" | "input";
         controlClass: string;
         controlAttrs: Record<string, unknown>;
         hasValue: boolean;
@@ -804,12 +804,12 @@ export declare const InputCompound: {
     autofocus: boolean;
     modelValue: string;
     status: InputStatus;
+    as: "button" | "input";
     readonly: boolean;
     clearable: boolean;
     maxlength: number;
     showCount: boolean;
     onEnter: (v: string) => void;
-    as: "button" | "input";
     controlClass: string;
     controlAttrs: Record<string, unknown>;
     hasValue: boolean;

package/dist/components/input/index.js

@@ -184,7 +184,7 @@ const Input = /* @__PURE__ */ defineComponent({
       "tabindex": -1,
       "onClick": () => revealed.value = !revealed.value
     }, [createVNode(Icon, {
-      "name": "eye",
+      "name": "preview",
       "class": "mh-input__eye-icon"
     }, null)]) : null, slots.suffix ? createVNode("span", {
       "class": "mh-input__suffix"

package/dist/components/notice/index.d.ts

@@ -1,3 +1,4 @@
+import { type IconName } from '@manohub/icon';
 import { type PropType, type SlotsType, type VNodeChild } from 'vue';
 export type NoticeTone = 'info' | 'success' | 'warning' | 'error';
 /**
@@ -24,10 +25,10 @@ export type NoticeTone = 'info' | 'success' | 'warning' | 'error';
  * | 有标题 | `message` + `description`（或插槽） | **标题行 + 描述行**两行 |
  *
  * @example 可关闭的说明条（列表页顶部）
- * <Notice closable onClose={() => (visible = false)} show-icon>值映射用于将来源向量转换为目标值。</Notice>
+ * <Notice closable onClose={() => (visible = false)} icon>值映射用于将来源向量转换为目标值。</Notice>
  *
  * @example 带标题与操作
- * <Notice tone="warning" show-icon message="尚未完成实名认证" description="使用该服务前须完成认证"
+ * <Notice tone="warning" icon message="尚未完成实名认证" description="使用该服务前须完成认证"
  *   action="立即认证" :on-action="goAuth" />
  */
 export declare const Notice: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -46,9 +47,15 @@ export declare const Notice: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
-    /** 是否显示语义图标 */
-    showIcon: {
-        type: BooleanConstructor;
+    /**
+     * 前置图标：缺省 `false` 不出图标；`true` 按 `tone` 映射；也可直接给字形名。
+     *
+     * 与 `Toast.icon` / `Notification.icon` **同名同型**（0.6.x 本件叫 `showIcon` 且只收布尔，
+     * 三件三个名字三种默认 —— 已统一）。默认值仍与 `Toast` 不同：`Toast` 是「浮出即走」的
+     * 消息条，图标是它的主要语义承载；本件是嵌在页面里的说明条，页面里别处往往已经有图标，故缺省不出。
+     */
+    icon: {
+        type: PropType<boolean | IconName>;
         default: boolean;
     };
     /** 是否渲染右上关闭按钮（规范：仅通知类信息可关闭） */
@@ -92,9 +99,15 @@ export declare const Notice: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
-    /** 是否显示语义图标 */
-    showIcon: {
-        type: BooleanConstructor;
+    /**
+     * 前置图标：缺省 `false` 不出图标；`true` 按 `tone` 映射；也可直接给字形名。
+     *
+     * 与 `Toast.icon` / `Notification.icon` **同名同型**（0.6.x 本件叫 `showIcon` 且只收布尔，
+     * 三件三个名字三种默认 —— 已统一）。默认值仍与 `Toast` 不同：`Toast` 是「浮出即走」的
+     * 消息条，图标是它的主要语义承载；本件是嵌在页面里的说明条，页面里别处往往已经有图标，故缺省不出。
+     */
+    icon: {
+        type: PropType<boolean | IconName>;
         default: boolean;
     };
     /** 是否渲染右上关闭按钮（规范：仅通知类信息可关闭） */
@@ -123,14 +136,14 @@ export declare const Notice: import("vue").DefineComponent<import("vue").Extract
         default: undefined;
     };
 }>> & Readonly<{}>, {
+    icon: boolean | "filter" | "copy" | "help" | "table" | "menu" | "search" | "link" | "delete" | "image" | "close" | "key" | "page-title" | "loading" | "info" | "alert" | "chevron-left" | "chevron-right" | "chevron-down" | "chevron-up" | "check" | "user" | "download" | "back" | "folder" | "folder-open" | "file" | "file-code" | "file-json" | "file-text" | "terminal" | "shield" | "tool" | "plus" | "notification" | "settings" | "logout" | "home" | "workbench" | "apps" | "favorite" | "favorite-filled" | "drag-handle" | "edit" | "refresh" | "upload" | "save" | "more" | "preview" | "external-link" | "minus" | "plus-circle" | "close-circle" | "list" | "calendar" | "clock" | "lock" | "unlock" | "users" | "archive" | "package" | "plug" | "branch" | "tag" | "ai" | "shield-check" | "shield-alert" | "history";
     onClose: () => void;
     message: string;
     tone: NoticeTone;
     closable: boolean;
     description: string;
-    showIcon: boolean;
-    closeText: string;
     action: string;
+    closeText: string;
     onAction: () => void;
 }, SlotsType<{
     default?: () => VNodeChild;

package/dist/components/notice/index.js

@@ -25,9 +25,15 @@ const Notice = /* @__PURE__ */ defineComponent({
       type: String,
       default: void 0
     },
-    /** 是否显示语义图标 */
-    showIcon: {
-      type: Boolean,
+    /**
+     * 前置图标：缺省 `false` 不出图标；`true` 按 `tone` 映射；也可直接给字形名。
+     *
+     * 与 `Toast.icon` / `Notification.icon` **同名同型**（0.6.x 本件叫 `showIcon` 且只收布尔，
+     * 三件三个名字三种默认 —— 已统一）。默认值仍与 `Toast` 不同：`Toast` 是「浮出即走」的
+     * 消息条，图标是它的主要语义承载；本件是嵌在页面里的说明条，页面里别处往往已经有图标，故缺省不出。
+     */
+    icon: {
+      type: [Boolean, String],
       default: false
     },
     /** 是否渲染右上关闭按钮（规范：仅通知类信息可关闭） */
@@ -73,8 +79,8 @@ const Notice = /* @__PURE__ */ defineComponent({
     return () => createVNode("div", {
       "class": [attrs.class, "mh-notice", `mh-notice--${props.tone}`, props.message ? "mh-notice--titled" : ""].filter(Boolean).join(" "),
       "role": "alert"
-    }, [props.showIcon ? createVNode(Icon, {
-      "name": TONE_ICON[props.tone],
+    }, [props.icon ? createVNode(Icon, {
+      "name": typeof props.icon === "string" ? props.icon : TONE_ICON[props.tone],
       "class": "mh-notice__icon"
     }, null) : null, createVNode("div", {
       "class": "mh-notice__body"