@ticatec/uniface-element 5.0.4 → 5.1.0

package/dist/overlay/dialog/README_CN.md

@@ -1,5 +1,7 @@
 # Dialog 对话框
 
+> **5.1.0 重命名**：本文使用 [API 命名规范](../../../docs/NAMING_CN.md) 中的名字；旧名 `DialogCloseConfirm`, `closeConfirm`, `confirmHandler`, `enableConfirm`, `onClose` 已在 5.1.0 移除（5.1.0 不保留兼容别名）。
+
 基于 Svelte 5 构建的灵活模态对话框系统，提供 stack 式管理、Promise API、可拖拽对话框、可配置操作按钮和关闭确认。包含三个导出：`Dialog`（基础可定制对话框组件）、`CommonDialog`（简化确认/取消模式）和 `dialogManager`（全局 stack 控制器，自动挂载，返回 `Promise<ModalResult>`）。
 
 ## 特性
@@ -13,7 +15,7 @@
 - **操作按钮**：可配置按钮动作，返回 `true` 自动关闭
 - **关闭确认**：关闭前可选确认（适合有未保存更改的场景）
 - **ESC 关闭**：按 ESC 关闭对话框（自动让 picker 内部的 ESC 优先处理）
-- **生命周期钩子**：`onClose` 回调 + Promise resolve，通过 `ModalResult` 处理关闭结果
+- **生命周期钩子**：`onclose` 回调 + Promise resolve，通过 `ModalResult` 处理关闭结果
 - **可定制样式**：通过内联样式灵活调整外观和尺寸
 
 ## 安装
@@ -182,7 +184,7 @@ const result = await window.Dialog.show(MyDialog, { foo: "bar" });
 {#if showDialog}
   <Dialog
     title="我的对话框"
-    onClose={handleClose}
+    onclose={handleClose}
     width="500px"
     height="300px"
   >
@@ -191,7 +193,7 @@ const result = await window.Dialog.show(MyDialog, { foo: "bar" });
 {/if}
 ```
 
-直接渲染模式下没有 `dialogId` context，`close()` 会自己调 `onClose`。
+直接渲染模式下没有 `dialogId` context，`close()` 会自己调 `onclose`。
 
 ## 组件概览
 
@@ -217,11 +219,11 @@ const result = await window.Dialog.show(MyDialog, { foo: "bar" });
 | `width` | `string` | `'unset'` | 对话框宽度（CSS 值） |
 | `height` | `string` | `'unset'` | 对话框高度（CSS 值） |
 | `actions` | `ButtonActions \| null` | `null` | 操作按钮数组，`null` 条目作为分隔符 |
-| `closeConfirm` | `DialogCloseConfirm \| null` | `null` | 关闭确认函数，当结果为 `MR_CANCEL` 或 `MR_CLOSE` 时调用，应返回 `Promise<boolean>` |
+| `beforeClose` | `BeforeClose \| null` | `null` | 关闭确认函数，当结果为 `MR_CANCEL` 或 `MR_CLOSE` 时调用，应返回 `Promise<boolean>` |
 | `content$style` | `string` | `''` | 内容区域自定义内联样式 |
 | `hideClose` | `boolean` | `false` | 为 `true` 时隐藏标题栏的关闭 X 图标 |
 | `closeAction` | `ButtonAction \| null` | `null` | 覆盖默认关闭按钮（label/type 等），handler 始终绑定到内部 close |
-| `onClose` | `OnClose \| null` | `null` | 关闭回调，接收 `ModalResult`（参见[模态结果](#模态结果)） |
+| `onclose` | `OnClose \| null` | `null` | 关闭回调，接收 `ModalResult`（参见[模态结果](#模态结果)） |
 | `dialog$style` | `string` | `''` | 对话框容器自定义内联样式 |
 
 ### 方法
@@ -234,7 +236,7 @@ const result = await window.Dialog.show(MyDialog, { foo: "bar" });
 
 | 事件 | 说明 |
 |------|------|
-| `onClose` | 关闭时触发。接收 `ModalResult.MR_OK` / `MR_CANCEL` / `MR_CLOSE` |
+| `onclose` | 关闭时触发。接收 `ModalResult.MR_OK` / `MR_CANCEL` / `MR_CLOSE` |
 
 ## CommonDialog 组件
 
@@ -262,8 +264,8 @@ const result = await window.Dialog.show(MyDialog, { foo: "bar" });
 {#if showDialog}
   <CommonDialog
     title="确认操作"
-    confirmHandler={handleConfirm}
-    onClose={handleClose}
+    onconfirm={handleConfirm}
+    onclose={handleClose}
     width="400px"
   >
     <p>确定要继续吗？</p>
@@ -278,12 +280,12 @@ const result = await window.Dialog.show(MyDialog, { foo: "bar" });
 | `title` | `string` | `''` | 对话框标题 |
 | `width` | `string` | `'unset'` | 对话框宽度 |
 | `height` | `string` | `'unset'` | 对话框高度 |
-| `closeConfirm` | `DialogCloseConfirm \| null` | `null` | 关闭确认函数 |
+| `beforeClose` | `BeforeClose \| null` | `null` | 关闭确认函数 |
 | `content$style` | `string` | `''` | 内容区域样式 |
-| `enableConfirm` | `boolean` | `true` | 启用/禁用确认按钮 |
-| `confirmHandler` | `(() => Promise<any>) \| null` | `null` | 确认按钮处理函数 |
+| `confirmable` | `boolean` | `true` | 启用/禁用确认按钮 |
+| `onconfirm` | `(() => Promise<any>) \| null` | `null` | 确认按钮处理函数 |
 | `confirmText` | `string \| null` | `null` | 自定义确认按钮文本（默认用 i18n "确认"） |
-| `onClose` | `OnClose \| null` | `null` | 关闭回调，接收 `ModalResult` |
+| `onclose` | `OnClose \| null` | `null` | 关闭回调，接收 `ModalResult` |
 
 ## 全局 API
 
@@ -296,7 +298,7 @@ import { dialogManager, ModalResult } from "@ticatec/uniface-element/Dialog";
 
 const result = await dialogManager.show(MyDialog, {
   title: "示例",
-  onClose: (r) => console.log("closed:", r)  // 也可在这里拿结果
+  onclose: (r) => console.log("closed:", r)  // 也可在这里拿结果
 });
 ```
 
@@ -367,7 +369,7 @@ type ButtonActions = (ButtonAction | null)[];
 
   let originalData = JSON.stringify(data);
 
-  const closeConfirm = async () => {
+  const beforeClose = async () => {
     const hasChanges = JSON.stringify(data) !== originalData;
     if (hasChanges) {
       return await messageBox.showConfirm("有未保存的更改，确定要关闭吗？", { title: "确认关闭" })
@@ -377,7 +379,7 @@ type ButtonActions = (ButtonAction | null)[];
   };
 </script>
 
-<Dialog {closeConfirm}>
+<Dialog {beforeClose}>
   <!-- 内容 -->
 </Dialog>
 ```
@@ -501,7 +503,7 @@ await dialogManager.show(Dialog, { title: "顶层" });
 1. **优先用命令式 API（`dialogManager.show`）**：返回 Promise，方便链式处理结果，也方便 service / store 调用。
 2. **无需手动挂载 `DialogBoard`**：控制器自动挂载。旧项目里已有的 `<DialogBoard/>` 可以保留也可以删。
 3. **action handler 返回 `false` 保持对话框打开**（比如验证失败时）。
-4. **有未保存更改时用 `closeConfirm`** —— 弹一个 MessageBox 确认是否离开。
+4. **有未保存更改时用 `beforeClose`** —— 弹一个 MessageBox 确认是否离开。
 5. **根据场景选择尺寸** —— 简单对话框 400–600px，表单对话框 700–900px，移动端用响应式。
 6. **stack 是支持的，但别滥用**：同时叠加多个对话框会让用户困惑，需要时再用。
 
@@ -526,7 +528,7 @@ declare global {
 | `<DialogBoard/>` 在 app 根 | 无需 | 控制器自动挂载，旧代码可保留 |
 | `window.Dialog.showModal(Component, params)` | `window.Dialog.show(Component, params)` 或 `dialogManager.show(...)` | `showModal` 仍可用（兼容别名），但丢弃 Promise |
 | `ModalResult.Ok` / `ModalResult.Cancel` | `ModalResult.MR_OK` / `ModalResult.MR_CANCEL` | 枚举值已与 MessageBox 统一 |
-| `onClose(result)` 回调 | `onClose(result)` + `await dialogManager.show(...)` | 两者都支持，Promise 是新方式 |
+| `onclose(result)` 回调 | `onclose(result)` + `await dialogManager.show(...)` | 两者都支持，Promise 是新方式 |
 
 ## 相关组件
 

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

@@ -2,7 +2,7 @@ import Dialog from "./Dialog.svelte";
 import dialogManager from "./DialogManager.svelte";
 import type IDialog from "./IDialog";
 import { ModalResult, type OnClose } from "./IDialog";
-import type { DialogCloseConfirm } from "./DialogCloseConfirm";
+import type { BeforeClose } from "./DialogCloseConfirm";
 import CommonDialog from "./CommonDialog.svelte";
 import DialogBoard from "./DialogBoard.svelte";
 declare global {
@@ -11,4 +11,4 @@ declare global {
     }
 }
 export default Dialog;
-export { dialogManager, ModalResult, type OnClose, type IDialog, type DialogCloseConfirm, CommonDialog, DialogBoard };
+export { dialogManager, ModalResult, type OnClose, type IDialog, type BeforeClose, CommonDialog, DialogBoard };

package/dist/overlay/message-box/IMessageBox.d.ts

@@ -1,14 +1,14 @@
-export type ShowInfoFun = (message: string, options?: {
+export type ShowInfo = (message: string, options?: {
     title?: string;
     type?: 'warning' | 'info';
 }) => Promise<void>;
-export type ShowConfirmFun = (message: string, options?: {
+export type ShowConfirm = (message: string, options?: {
     title?: string;
     type?: 'warning' | 'question';
 }) => Promise<any>;
 export default interface IMessageBox {
-    showInfo: ShowInfoFun;
-    showConfirm: ShowConfirmFun;
+    showInfo: ShowInfo;
+    showConfirm: ShowConfirm;
 }
 export declare enum ModalResult {
     MR_OK = 1,

package/dist/overlay/message-box/MessageBox.svelte.js

@@ -43,14 +43,14 @@ class MessageBoxController {
     }
     showInfo = (_message, options = { type: 'info' }) => {
         const infoButtons = [
-            { label: i18nRes.common.btnClose, type: 'primary', result: ModalResult.MR_OK }
+            { label: i18nRes.common.btnClose(), type: 'primary', result: ModalResult.MR_OK }
         ];
         return this.showMessageBox(_message, infoButtons, options);
     };
     showConfirm = (_message, options = { type: 'question' }) => {
         const confirmButtons = [
-            { label: i18nRes.common.btnConfirm, type: 'primary', result: ModalResult.MR_OK },
-            { label: i18nRes.common.btnCancel, type: 'secondary', result: ModalResult.MR_CANCEL }
+            { label: i18nRes.common.btnConfirm(), type: 'primary', result: ModalResult.MR_OK },
+            { label: i18nRes.common.btnCancel(), type: 'secondary', result: ModalResult.MR_CANCEL }
         ];
         return this.showMessageBox(_message, confirmButtons, options);
     };

package/dist/ticatec-uniface-web.css

@@ -175,6 +175,8 @@
   --uniface-card-footer-margin: 12px 24px;
   --uniface-card-footer-height: 40px;
   --uniface-card-color-surface: #ffffff;
+  /* PageStack Tokens */
+  --uniface-page-stack-color-surface: var(--uniface-color-surface);
   --uniface-card-color: #111827;
   /* Card.svelte (and the component's own README/README_CN) reference
      --uniface-card-text-muted; this used to be named --uniface-card-color-muted
@@ -615,6 +617,8 @@
      with no [data-theme="dark"] override, so cards stayed white/light
      regardless of dark mode. */
   --uniface-card-color-surface: #262626;
+  /* PageStack Tokens - Dark Theme */
+  --uniface-page-stack-color-surface: var(--uniface-color-surface);
   --uniface-card-color: #e5e7eb;
   --uniface-card-text-muted: #9ca3af;
   --uniface-card-color-inside-border: rgba(255, 255, 255, 0.08);
@@ -873,7 +877,7 @@
   padding: 0 var(--uniface-button-margin);
   border-radius: var(--radius-md, 4px);
 }
-.uniface-button.common-button.big {
+.uniface-button.common-button.large {
   height: var(--uniface-button-height-big);
   font-size: 1.1rem;
 }
@@ -887,7 +891,7 @@
 .uniface-button.common-button.round {
   border-radius: var(--uniface-button-radius-round);
 }
-.uniface-button.common-button.round.big {
+.uniface-button.common-button.round.large {
   border-radius: var(--uniface-button-radius-round-big);
 }
 .uniface-button.common-button.round.small {
@@ -910,11 +914,11 @@
 .uniface-button.icon-button i {
   font-size: 18px;
 }
-.uniface-button.icon-button.big {
+.uniface-button.icon-button.large {
   width: var(--uniface-button-height-big);
   height: var(--uniface-button-height-big);
 }
-.uniface-button.icon-button.big i {
+.uniface-button.icon-button.large i {
   font-size: 22px;
 }
 .uniface-button.icon-button.small {
@@ -924,6 +928,10 @@
 .uniface-button.icon-button.small i {
   font-size: 16px;
 }
+.uniface-button.icon-button.no-outer:focus, .uniface-button.icon-button.no-outer:focus-visible, .uniface-button.icon-button.no-outer:active {
+  outline: none !important;
+  box-shadow: none !important;
+}
 .uniface-button:hover {
   background-color: var(--uniface-button-plain-color-surface-hover);
 }
@@ -995,6 +1003,10 @@
 .uniface-button.forth:focus-visible, .uniface-button.forth:focus {
   box-shadow: 0 0 0 3px var(--uniface-button-color-gap), 0 0 0 4px var(--uniface-button-forth-color-surface);
 }
+.uniface-button.no-outer:focus, .uniface-button.no-outer:focus-visible, .uniface-button.no-outer:active {
+  outline: none !important;
+  box-shadow: none !important;
+}
 .uniface-button.disabled {
   background-color: var(--uniface-button-disabled-color-surface) !important;
   border-color: var(--uniface-button-disabled-border-color) !important;
@@ -1010,17 +1022,34 @@
   background-color: var(--uniface-button-disabled-color-surface) !important;
 }
 .uniface-button.text-button {
+  outline: none;
   border: none;
   background-color: transparent !important;
   color: var(--uniface-text-button-plain-color);
+  border-radius: var(--uniface-button-radius-round);
+  padding: 3px 6px;
 }
-.uniface-button.text-button.big {
+.uniface-button.text-button.large {
   font-size: 1.2em;
   padding: 4px 8px;
+  border-radius: var(--uniface-button-radius-round-big);
 }
 .uniface-button.text-button.small {
   font-size: 0.9em;
   padding: 2px 4px;
+  border-radius: var(--uniface-button-radius-round-small);
+}
+.uniface-button.text-button.plain {
+  border-radius: 0;
+}
+.uniface-button.text-button.round {
+  border-radius: var(--uniface-button-radius-round);
+}
+.uniface-button.text-button.round.large {
+  border-radius: var(--uniface-button-radius-round-big);
+}
+.uniface-button.text-button.round.small {
+  border-radius: var(--uniface-button-radius-round-small);
 }
 .uniface-button.text-button:hover {
   color: var(--uniface-text-button-plain-color-hover);
@@ -1066,6 +1095,10 @@
 .uniface-button.text-button.forth:active {
   color: var(--uniface-button-forth-color-surface-active);
 }
+.uniface-button.text-button.no-outer:focus, .uniface-button.text-button.no-outer:focus-visible, .uniface-button.text-button.no-outer:active {
+  outline: none !important;
+  box-shadow: none !important;
+}
 .uniface-button.text-button.disabled {
   background-color: transparent !important;
   cursor: not-allowed;
@@ -1236,12 +1269,8 @@
 .uniface-form-editor .uniface-common-picker {
   height: 38px;
 }
-.uniface-form-editor .uniface-common-picker .editor-dropdown {
-  visibility: hidden;
-}
 .uniface-form-editor .uniface-common-picker .action-icon {
   display: block;
-  visibility: hidden;
   box-sizing: border-box;
   color: var(--uniface-editor-text-color, #374151);
   align-self: center;
@@ -1252,9 +1281,6 @@
 .uniface-form-editor .uniface-common-picker .action-icon:active {
   color: var(--uniface-active-dropdown-color, #9d9d9d);
 }
-.uniface-form-editor .uniface-common-picker:hover .action-icon, .uniface-form-editor .uniface-common-picker:focus-within .action-icon, .uniface-form-editor .uniface-common-picker:focus .action-icon {
-  visibility: visible;
-}
 .uniface-form-editor .uniface-common-picker .options-item-render {
   width: 100%;
 }

package/dist/types.d.ts

@@ -5,19 +5,19 @@ export type RetrieveOptionText = (item: any) => string;
 /**
  * 通用变更处理器
  */
-export type OnChangeHandler<T> = (value: T) => void;
+export type OnChange<T> = (value: T) => void;
 /**
  * 通用选择处理器
  */
-export type OnSelectHandler<T> = (value: T) => void;
+export type OnSelect<T> = (value: T) => void;
 /**
- * 选中项处理器（用于单选）
+ * 鼠标点击处理器
  */
-export type OnSelectedHandler = (item: any) => void;
+export type OnClick = (event: MouseEvent) => void;
 /**
- * 鼠标点击处理器
+ * 动作对象（ButtonAction / RowAction / CardAction …）的处理函数（NAMING R10）
  */
-export type MouseClickHandler = (event: MouseEvent) => void;
+export type ActionHandler<T = any> = (data: T) => void | Promise<void>;
 /**
  * 页面操作处理器（用于返回、刷新等）
  */
@@ -29,7 +29,14 @@ export { DateContext, ModalResult };
  * 按钮类型枚举
  */
 export type ButtonType = 'default' | 'primary' | 'secondary' | 'third' | 'forth';
-export type FieldLayout = 'vertical' | 'horizontal';
+/**
+ * 纵横方向（NAMING R6）
+ */
+export type Direction = 'vertical' | 'horizontal';
+/**
+ * 离散尺寸档位（NAMING R6）
+ */
+export type Size = 'small' | 'medium' | 'large';
 /**
  * 按钮操作接口
  */
@@ -57,7 +64,7 @@ export interface ButtonAction {
     /**
      * click处理函数
      */
-    handler?: MouseClickHandler;
+    handler?: OnClick;
 }
 /**
  * 按钮操作数组类型（可包含null作为分隔符）
@@ -66,11 +73,15 @@ export type ButtonActions = Array<ButtonAction | null>;
 /**
  * 标签页操作处理器
  */
-export type TabActionHandler = (tab: any) => void;
+export type OnTabAction = (tab: any) => void;
 /**
- * 标签页关闭处理器：返回 false（含 Promise<false>）可阻止关闭
+ * 标签页关闭前的否决钩子（NAMING R2）：返回 false（含 Promise<false>）可阻止关闭
  */
-export type TabCloseHandler = (tab: any) => boolean | Promise<boolean>;
+export type BeforeTabClose = (tab: any) => boolean | void | Promise<boolean | void>;
+/**
+ * 判定某个标签是否可关闭（Tabs.closable 的函数形式）
+ */
+export type IsTabClosable = (tab: any) => boolean;
 /**
  * 标签页渲染器
  */
@@ -85,7 +96,7 @@ export interface LoadResult {
 /**
  * 列表过滤函数
  */
-export type FunFilter = (item: any, text: string) => boolean;
+export type FilterFn = (item: any, text: string) => boolean;
 /**
  * 分页加载列表数据
  * @param text 搜索文本
@@ -95,17 +106,21 @@ export type FunFilter = (item: any, text: string) => boolean;
 export type ListLazyLoader = (text: string, pageNo: number) => Promise<LoadResult>;
 import type { IHierarchyData } from "./lib";
 /**
- * 节点选择变更处理器
+ * 节点切换前的否决钩子（NAMING R2）：返回 false 可阻止切换；node 为 null 表示取消选中
+ */
+export type BeforeNodeChange = (node: IHierarchyData<any> | null) => boolean | void | Promise<boolean | void>;
+/**
+ * 节点切换后的通知
  */
-export type OnNodeSelectionChange = (node: IHierarchyData<any>) => Promise<boolean>;
+export type OnNodeChange = (node: IHierarchyData<any> | null) => void;
 /**
  * 节点是否可见
  */
-export type NodeVisibleFun = (node: IHierarchyData<any>) => boolean;
+export type IsNodeVisible = (node: IHierarchyData<any>) => boolean;
 /**
  * 加载子节点（返回纯数据对象）
  */
-export type LoadChildrenFun = (item: IHierarchyData<any>) => Promise<Array<any>>;
+export type LoadChildren = (item: IHierarchyData<any>) => Promise<Array<any>>;
 /**
  * 按需加载树节点的子节点
  */
@@ -117,41 +132,18 @@ export interface TreeLazyLoader {
     /**
      * 加载子节点数据
      */
-    load: LoadChildrenFun;
-}
-/**
- * 穿梭框数据处理器
- */
-export type TransferData = (list: Array<any>, direction: "left" | "right") => Promise<boolean>;
-/**
- * Action cell中的事件处理
- */
-export type HandleAction = (data: any) => Promise<void>;
-/**
- * 单元格操作接口
- */
-export interface CellAction {
-    /**
-     * action的文本
-     */
-    text: string;
-    /**
-     * action的类型
-     */
-    type?: ButtonType;
-    /**
-     * 点击处理
-     */
-    handle: HandleAction;
+    load: LoadChildren;
 }
 /**
- * 获取单元格操作
+ * 穿梭前的否决钩子（NAMING R2）：返回 false 可阻止移动
  */
-export type GetCellAction = (data: any) => CellAction | undefined;
+export type BeforeTransfer = (list: Array<any>, direction: "left" | "right") => boolean | void | Promise<boolean | void>;
 /**
- * 获取行操作
+ * 穿梭完成后的通知
  */
-export type GetRowActions = (data: any) => Array<CellAction>;
+export type OnTransfer = (list: Array<any>, direction: "left" | "right") => void;
+export type { CellAction, GetCellAction } from "./data_table/lib/CellAction";
+export type { GetRowActions } from "./data_table/lib/RowAction";
 /**
  * 行字体样式接口
  */

package/dist/unifaceContext.d.ts

@@ -1,6 +1,6 @@
 import type { EditorVariant } from './form/types';
-import type { FieldLayout } from './types';
-export declare function getLayoutMode(): FieldLayout;
+import type { Direction } from './types';
+export declare function getLayoutMode(): Direction;
 export declare function setLayoutMode(layoutMode: string): void;
 export declare function getEditorVariant(): EditorVariant;
 export declare function setEditorVariant(variant: EditorVariant): void;

package/dist/utils/prefixFilter.js

@@ -1,4 +1,3 @@
-import { keyboardAttrs } from "../form/common_editor/EditorEvents";
 const prefixFilter = (attrs, prefix, excludes = []) => {
     const obj = {};
     let len = prefix.length;