@manohub/ui 0.7.1 → 0.8.1

package/dist/components/select/select-tree.js

@@ -0,0 +1,263 @@
+import { defineComponent, ref, computed, watch, createVNode, createTextVNode, Fragment } from "vue";
+import { Tree } from "../tree/index.js";
+import { SelectPanel } from "./select-panel.js";
+import { SelectTrigger } from "./select-trigger.js";
+import { createSelectPanelId, createTriggerKeydown, showPanel, hidePanel } from "./select-shared.js";
+import { filterTreeNodes, findTreeNode, treeLabel, splitHighlight, treeChildren, treeNodeKey } from "./select-tree-filter.js";
+const SelectTree = /* @__PURE__ */ defineComponent({
+  name: "SelectTree",
+  inheritAttrs: false,
+  props: {
+    /** 树数据（与 `Tree` 同一个 `TreeNode` 类型，不另造节点形状） */
+    nodes: {
+      type: Array,
+      required: true
+    },
+    /** 节点主键：字段名或取值函数（与 `Tree` 同义） */
+    rowKey: {
+      type: [String, Function],
+      required: true
+    },
+    /** 标签字段名（默认 'label'） */
+    labelKey: {
+      type: String,
+      default: "label"
+    },
+    /** 子节点字段名（默认 'children'） */
+    childrenKey: {
+      type: String,
+      default: "children"
+    },
+    /** 受控值（选中叶子的主键；树选择只单选） */
+    modelValue: {
+      type: String,
+      default: void 0
+    },
+    /** 非受控初始值 */
+    defaultValue: {
+      type: String,
+      default: void 0
+    },
+    placeholder: {
+      type: String,
+      default: "请选择"
+    },
+    /** 搜索：`true` 强制开；不给时节点总数多于 8 自动开（与 `Select` 同口径） */
+    searchable: {
+      type: Boolean,
+      default: false
+    },
+    /** 自定义命中判定（缺省：标签区分大小写地包含关键词） */
+    filterNode: {
+      type: Function,
+      default: void 0
+    },
+    /** 命中文本是否高亮（默认开） */
+    highlight: {
+      type: Boolean,
+      default: true
+    },
+    /** 受控展开集（传了就完全受控；**过滤态下组件强制全展**，不受本 prop 约束） */
+    expandedKeys: {
+      type: Array,
+      default: void 0
+    },
+    /** 非受控展开初值 */
+    defaultExpandedKeys: {
+      type: Array,
+      default: () => []
+    },
+    /** 初始展开全部（与 `defaultExpandedKeys` 互斥，它优先） */
+    defaultExpandAll: {
+      type: Boolean,
+      default: false
+    },
+    /** 展开集变化回调 */
+    onExpandChange: {
+      type: Function,
+      default: void 0
+    },
+    clearable: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    /** 加载中（面板里出一行提示，不渲染树） */
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    emptyText: {
+      type: String,
+      default: "暂无数据"
+    },
+    /** 尺寸档（24 / 28 / 32） */
+    size: {
+      type: String,
+      default: "md"
+    },
+    /** 校验状态（红 / 黄；与 `Input` 同一词表） */
+    status: {
+      type: String,
+      default: void 0
+    },
+    /** 值变更回调（选中叶子的主键） */
+    onChange: {
+      type: Function,
+      default: void 0
+    },
+    /** 搜索词变更（远程换数据用；本地过滤不受它影响） */
+    onSearch: {
+      type: Function,
+      default: void 0
+    }
+  },
+  emits: {
+    "update:modelValue": (v) => true
+  },
+  slots: Object,
+  setup(props, {
+    emit,
+    slots,
+    attrs
+  }) {
+    const panelId = createSelectPanelId();
+    const panelRef = ref(null);
+    const inner = ref(props.defaultValue);
+    const keyword = ref("");
+    const keyOf = (node) => treeNodeKey(node, props.rowKey);
+    const childrenOf = (node) => treeChildren(node, props.childrenKey);
+    const current = computed(() => props.modelValue ?? inner.value);
+    const hasValue = computed(() => current.value !== void 0 && current.value !== "");
+    const nodeCount = computed(() => {
+      let count = 0;
+      const walk = (list) => {
+        for (const node of list) {
+          count += 1;
+          walk(childrenOf(node));
+        }
+      };
+      walk(props.nodes);
+      return count;
+    });
+    const showSearch = computed(() => props.searchable || nodeCount.value > 8);
+    const collectKeys = (list) => list.flatMap((node) => [keyOf(node), ...collectKeys(childrenOf(node))]);
+    const innerExpanded = ref(props.defaultExpandAll ? collectKeys(props.nodes) : [...props.defaultExpandedKeys]);
+    watch(() => props.defaultExpandedKeys, (next) => {
+      if (props.expandedKeys === void 0) innerExpanded.value = [...next];
+    });
+    const filtered = computed(() => keyword.value ? filterTreeNodes(props.nodes, {
+      rowKey: props.rowKey,
+      childrenKey: props.childrenKey,
+      labelKey: props.labelKey,
+      keyword: keyword.value,
+      match: props.filterNode
+    }) : void 0);
+    const visibleNodes = computed(() => filtered.value?.nodes ?? props.nodes);
+    const expandedKeys = computed(() => filtered.value ? filtered.value.keys : props.expandedKeys ?? innerExpanded.value);
+    const handleExpandChange = (keys) => {
+      if (props.expandedKeys === void 0) innerExpanded.value = keys;
+      props.onExpandChange?.(keys);
+    };
+    const displayLabel = computed(() => {
+      if (!hasValue.value) return void 0;
+      const found = findTreeNode(props.nodes, String(current.value), {
+        rowKey: props.rowKey,
+        childrenKey: props.childrenKey
+      });
+      return found ? treeLabel(found, props.labelKey) : String(current.value);
+    });
+    const commit = (value) => {
+      if (props.modelValue === void 0) inner.value = value;
+      emit("update:modelValue", value);
+      props.onChange?.(value);
+    };
+    const hide = () => hidePanel(panelRef.value);
+    const toggleExpand = (key) => {
+      const next = new Set(expandedKeys.value);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      handleExpandChange([...next]);
+    };
+    const pick = (node) => {
+      if (childrenOf(node).length > 0) {
+        toggleExpand(keyOf(node));
+        return;
+      }
+      commit(keyOf(node));
+      hide();
+    };
+    const clear = () => commit("");
+    const onTriggerKeydown = createTriggerKeydown({
+      clearable: props.clearable,
+      disabled: props.disabled,
+      clear,
+      openPanel: () => showPanel(panelRef.value)
+      /* 有意不给 `focusFirst`：树的行是 `div`、没有 tabindex，面板内不做 ↑↓ 行导航 */
+    });
+    const renderHitLabel = (node) => createVNode(Fragment, null, [splitHighlight(treeLabel(node, props.labelKey), keyword.value).map((segment, index) => segment.hit ? createVNode("span", {
+      "key": index,
+      "class": "mh-select__hit"
+    }, [segment.text]) : segment.text)]);
+    return () => {
+      const highlightLabel = props.highlight && !!keyword.value ? renderHitLabel : void 0;
+      return createVNode("div", {
+        "class": ["mh-popup-host", attrs.class].filter(Boolean).join(" "),
+        "style": attrs.style
+      }, [createVNode(SelectTrigger, {
+        "panelId": panelId,
+        "size": props.size,
+        "status": props.status,
+        "disabled": props.disabled,
+        "clearable": props.clearable,
+        "hasValue": hasValue.value,
+        "placeholder": props.placeholder,
+        "label": displayLabel.value,
+        "onKeydown": onTriggerKeydown,
+        "onClear": clear
+      }, null), createVNode(SelectPanel, {
+        "id": panelId,
+        "elementRef": panelRef,
+        "searchable": showSearch.value,
+        "keyword": keyword.value,
+        "onKeyword": (value) => {
+          keyword.value = value;
+          props.onSearch?.(value);
+        }
+      }, {
+        default: () => {
+          if (props.loading) {
+            return createVNode("span", {
+              "class": "mh-select__option mh-select__option--hint"
+            }, [createTextVNode("加载中…")]);
+          }
+          if (visibleNodes.value.length === 0) {
+            const custom = slots.empty?.();
+            return custom !== void 0 && custom !== null ? custom : createVNode("span", {
+              "class": "mh-select__option mh-select__option--empty"
+            }, [props.emptyText]);
+          }
+          return createVNode("div", {
+            "class": "mh-select__tree"
+          }, [createVNode(Tree, {
+            "nodes": visibleNodes.value,
+            "rowKey": props.rowKey,
+            "labelKey": props.labelKey,
+            "childrenKey": props.childrenKey,
+            "selected": current.value === "" ? void 0 : current.value,
+            "expandedKeys": expandedKeys.value,
+            "onExpandChange": handleExpandChange,
+            "onSelect": pick,
+            "renderLabel": highlightLabel
+          }, null)]);
+        }
+      })]);
+    };
+  }
+});
+export {
+  SelectTree
+};

package/dist/components/select/select-trigger.d.ts

@@ -0,0 +1,132 @@
+import { type PropType, type VNodeChild } from 'vue';
+import { type InputStatus } from '../input';
+import type { ControlSize } from '../control-size';
+export declare const SelectTrigger: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /** 面板 id（`popovertarget` 的目标，由 `createSelectPanelId()` 产出的全页唯一 id） */
+    panelId: {
+        type: StringConstructor;
+        required: true;
+    };
+    /** 尺寸档（24 / 28 / 32）：框高与字号归输入面，本件只透传 */
+    size: {
+        type: PropType<ControlSize>;
+        default: string;
+    };
+    /** 校验状态（红 / 黄；与输入框同一词表） */
+    status: {
+        type: PropType<InputStatus>;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 显式判定清除位显隐（多选的值是数组、单选显示的是 label，都没有「一个字符串模型」可喂） */
+    hasValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 多选形态（控件上多一个 `mh-select--multiple`，标签不换行） */
+    multiple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** 单选显示文本（无值时不渲染它，改渲染 `placeholder`） */
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** 触发器上的键盘契约（`createTriggerKeydown()` 产出，两件同源） */
+    onKeydown: {
+        type: PropType<(event: KeyboardEvent) => void>;
+        default: undefined;
+    };
+    /** 清除位被点击（输入面的内建清除位回调；本件只把它转给消费方） */
+    onClear: {
+        type: PropType<() => void>;
+        default: undefined;
+    };
+    /** 值区自定义渲染（多选标签收纳用；不给则走单选那一行） */
+    renderValue: {
+        type: PropType<() => VNodeChild>;
+        default: undefined;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** 面板 id（`popovertarget` 的目标，由 `createSelectPanelId()` 产出的全页唯一 id） */
+    panelId: {
+        type: StringConstructor;
+        required: true;
+    };
+    /** 尺寸档（24 / 28 / 32）：框高与字号归输入面，本件只透传 */
+    size: {
+        type: PropType<ControlSize>;
+        default: string;
+    };
+    /** 校验状态（红 / 黄；与输入框同一词表） */
+    status: {
+        type: PropType<InputStatus>;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 显式判定清除位显隐（多选的值是数组、单选显示的是 label，都没有「一个字符串模型」可喂） */
+    hasValue: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /** 多选形态（控件上多一个 `mh-select--multiple`，标签不换行） */
+    multiple: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    /** 单选显示文本（无值时不渲染它，改渲染 `placeholder`） */
+    label: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** 触发器上的键盘契约（`createTriggerKeydown()` 产出，两件同源） */
+    onKeydown: {
+        type: PropType<(event: KeyboardEvent) => void>;
+        default: undefined;
+    };
+    /** 清除位被点击（输入面的内建清除位回调；本件只把它转给消费方） */
+    onClear: {
+        type: PropType<() => void>;
+        default: undefined;
+    };
+    /** 值区自定义渲染（多选标签收纳用；不给则走单选那一行） */
+    renderValue: {
+        type: PropType<() => VNodeChild>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    size: ControlSize;
+    multiple: boolean;
+    disabled: boolean;
+    label: string;
+    onKeydown: (event: KeyboardEvent) => void;
+    placeholder: string;
+    status: InputStatus;
+    clearable: boolean;
+    hasValue: boolean;
+    onClear: () => void;
+    renderValue: () => VNodeChild;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/components/select/select-trigger.js

@@ -0,0 +1,101 @@
+import { defineComponent, createVNode } from "vue";
+import { Icon } from "@manohub/icon";
+import { Input } from "../input/index.js";
+const SelectTrigger = /* @__PURE__ */ defineComponent({
+  name: "SelectTrigger",
+  inheritAttrs: false,
+  props: {
+    /** 面板 id（`popovertarget` 的目标，由 `createSelectPanelId()` 产出的全页唯一 id） */
+    panelId: {
+      type: String,
+      required: true
+    },
+    /** 尺寸档（24 / 28 / 32）：框高与字号归输入面，本件只透传 */
+    size: {
+      type: String,
+      default: "md"
+    },
+    /** 校验状态（红 / 黄；与输入框同一词表） */
+    status: {
+      type: String,
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    clearable: {
+      type: Boolean,
+      default: false
+    },
+    /** 显式判定清除位显隐（多选的值是数组、单选显示的是 label，都没有「一个字符串模型」可喂） */
+    hasValue: {
+      type: Boolean,
+      default: false
+    },
+    /** 多选形态（控件上多一个 `mh-select--multiple`，标签不换行） */
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    placeholder: {
+      type: String,
+      default: "请选择"
+    },
+    /** 单选显示文本（无值时不渲染它，改渲染 `placeholder`） */
+    label: {
+      type: String,
+      default: void 0
+    },
+    /** 触发器上的键盘契约（`createTriggerKeydown()` 产出，两件同源） */
+    onKeydown: {
+      type: Function,
+      default: void 0
+    },
+    /** 清除位被点击（输入面的内建清除位回调；本件只把它转给消费方） */
+    onClear: {
+      type: Function,
+      default: void 0
+    },
+    /** 值区自定义渲染（多选标签收纳用；不给则走单选那一行） */
+    renderValue: {
+      type: Function,
+      default: void 0
+    }
+  },
+  setup(props) {
+    const controlClass = () => ["mh-select", props.multiple ? "mh-select--multiple" : "", props.size === "md" ? "" : `mh-select--${props.size}`].filter(Boolean).join(" ");
+    return () => createVNode(Input, {
+      "as": "button",
+      "size": props.size,
+      "status": props.status,
+      "disabled": props.disabled,
+      "clearable": props.clearable,
+      "hasValue": props.hasValue,
+      "class": "mh-popup-anchor mh-select-host",
+      "controlClass": controlClass(),
+      "controlAttrs": {
+        popovertarget: props.panelId,
+        "aria-haspopup": "listbox",
+        /* 开合态由原生 popover 与 popup.css 的箭头转向承担，本件不维护第二份；
+           恒定 'false' 是既有口径（输入面的触发器形态不跟踪 popover 的开关状态） */
+        "aria-expanded": "false",
+        onKeydown: props.onKeydown
+      },
+      "onChange": () => props.onClear?.()
+    }, {
+      default: () => props.renderValue ? props.renderValue() : createVNode("span", {
+        "class": ["mh-select__value", props.hasValue ? "" : "mh-select__value--placeholder"].filter(Boolean).join(" ")
+      }, [props.hasValue ? props.label : props.placeholder]),
+      /* 箭头沿用输入框的右侧图标位（槽内尺寸收敛见 `select.css` 的 `.mh-select-host` 一节）；
+         展开转向由 `popup.css` 的 `.mh-popup-caret` 承担（含触发器进表壳后的兄弟档） */
+      suffix: () => createVNode(Icon, {
+        "name": "chevron-down",
+        "class": "mh-select__caret mh-popup-caret"
+      }, null)
+    });
+  }
+});
+export {
+  SelectTrigger
+};

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

@@ -37,7 +37,7 @@ export type CanJump = (index: number, current: number) => boolean;
  *
  * ### 「哪几步能跳」由调用方给（`canJump`）
  *
- * 本件**不猜业务规则**：`canJump` 缺省 `true`（每一不都可跳），要限制就注入一条判定：
+ * 本件**不猜业务规则**：`canJump` 缺省 `true`（每一步都可跳），要限制就注入一条判定：
  *
  * ```tsx
  * <Steps clickable :can-jump="(index, current) => index <= current" … />

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

@@ -72,13 +72,34 @@ export interface TablePagination {
  *   组件自己切片会让「服务端分页」与「客户端分页」两套口径藏在同一个 prop 里；
  * - **错误态**：归 `QueryState`（表格只管列数据）。
  *
- * @example
+ * @example 基本列表（表默认满宽；列宽给权重 + `fixed` 才严格按比例，长文本列配 `ellipsis`）
  * <Table
- *   :columns="[{key:'name',title:'名称'},{key:'amount',title:'金额',align:'right'}]"
- *   :data="rows" row-key="id" striped selectable v-model="selected"
+ *   layout="fixed" striped row-key="id" :data="rows"
+ *   :columns="[
+ *     { key: 'name', title: '名称', width: 3 },
+ *     { key: 'amount', title: '金额', width: 1, align: 'right' },
+ *     { key: 'description', title: '描述', width: 4, ellipsis: true },
+ *   ]"
  *   :pagination="{ total: 120, current: page, onChange: (p) => (page = p) }"
- *   @sort="({ key, order }) => (sortKey = key, sortOrder = order)"
  * />
+ *
+ * @example 操作列（用 `actions` 插槽 + 一列 `align:'right'`；行内操作同族，`Button.Group` 收口）
+ * <Table :columns="columns" :data="rows" row-key="id">
+ *   {{
+ *     actions: ({ row }) => (
+ *       <Button.Group>
+ *         <Button variant="text" onClick={() => open(row)}>编辑</Button>
+ *         <Button variant="text" danger onClick={() => remove(row)}>删除</Button>
+ *       </Button.Group>
+ *     ),
+ *   }}
+ * </Table>
+ *
+ * @example 单元格自定义 + 按行判定可勾选
+ * <Table :columns="columns" :data="rows" row-key="id" v-model="selected"
+ *   :selectable="(row) => row.status === 'draft'">
+ *   {{ cell: ({ value, column }) => column.key === 'status' ? <Text tone="success">{value}</Text> : value }}
+ * </Table>
  */
 export declare const Table: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     columns: {

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

@@ -1,7 +1,12 @@
 import { type PropType, type SlotsType, type VNodeChild } from 'vue';
 /** 字号档（每档都有一枚配套的行高令牌，故**不开放**只有字号的 micro / display） */
 export type TextSize = 'caption' | 'body' | 'heading' | 'title';
-/** 语义色档（`success` / `warning` 取 `-strong`，与 `Notice` / `Dialog` 同一张表） */
+/**
+ * 语义色档（`success` / `warning` 取 `-strong`，与 `Notice` / `Dialog` 同一张表）。
+ *
+ * ⚠️ 自绘样式时要字色，一律落 `--ui-<tone>` / `--ui-<tone>-strong`（浅底深字）。
+ * `--ui-*-content` 那一族是**实心填充之上的白字**，配浅底（`-weak`）就是白字白底。
+ */
 export type TextTone = 'default' | 'muted' | 'subtle' | 'primary' | 'success' | 'warning' | 'error';
 /** 字重档（缺省**不设**，即继承上下文 —— 这样「在已加粗的区域里放一段普通文字」不必显式写 regular） */
 export type TextWeight = 'regular' | 'medium' | 'semibold';
@@ -30,7 +35,7 @@ export interface TextProps {
  * 但**没有件消费它们**：卡片描述、表单说明、只读值、列表次级信息这些「容器里的文字层级」
  * 于是无处可归 —— `Card` 只管卡片外壳，`Panel` 只管区域，两者都不管内容里的排版；
  * 而契约 L1-5 又禁应用侧写 `font-*` / `color`。**令牌有了、路径没有**，
- * 结果就是每个应用都要为「卡片里的文字」保留一条定版例外登记（本仓 repository 的 31 处里，
+ * 结果就是每个应用都要为「卡片里的文字」保留一条定版例外登记（首批迁移的登记项里，
  * 绝大多数属于这一类）。本件把这条路径补上。
  *
  * ## 与 `Title` / 平台默认的关系

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

@@ -23,8 +23,7 @@ export interface TreeNode {
  * ## 为什么自建（对照计划登记的退路）
  *
  * farris `FTreeView` 实测结论：① 是列模板式网格（节点内容可用 `columnTemplate` 承载）；
- * ② **只在挂载时填充一次可见行，data 变化不刷新**（仓内唯一的适配器
- * `apps/skill/src/features/skill/farris-file-tree.tsx` 正是用 `key` 强制重挂绕行）；
+ * ② **只在挂载时填充一次可见行，data 变化不刷新**（**唯一**的兜底是 `key` 强制重挂 —— 那会丢展开态）；
  * ③ 层级缩进不可控、节点图标走 farris 图标字体类。
  *
  * 而本组件的硬需求是「数据更新时**不丢**用户已展开的节点 / 滚动位置 / 焦点」——
@@ -80,6 +79,19 @@ export declare const Tree: import("vue").DefineComponent<import("vue").ExtractPr
         type: PropType<(node: TreeNode) => void>;
         default: undefined;
     };
+    /**
+     * 标签体的自定义渲染（**替掉** `labelKey` 的纯文本）。
+     *
+     * 与 `renderNode` 的分工：本 prop 渲染的是**标签本体**（占位、省略号、行内对齐都由 `.mh-tree__label`
+     * 承担，因此必须留在那个槽里）；`renderNode` 渲染的是标签**之后**的常驻附加内容（计数徽标一类）。
+     * 典型用途是搜索命中的文本高亮（把标签切成多个片段）。
+     *
+     * 缺省不传时仍渲染 `labelKey` 的纯文本 —— 这是绝大多数消费方的路径，行为零变化。
+     */
+    renderLabel: {
+        type: PropType<(node: TreeNode) => unknown>;
+        default: undefined;
+    };
     /** 节点附加内容（计数徽标等），渲染在标签之后 */
     renderNode: {
         type: PropType<(node: TreeNode) => unknown>;
@@ -200,6 +212,19 @@ export declare const Tree: import("vue").DefineComponent<import("vue").ExtractPr
         type: PropType<(node: TreeNode) => void>;
         default: undefined;
     };
+    /**
+     * 标签体的自定义渲染（**替掉** `labelKey` 的纯文本）。
+     *
+     * 与 `renderNode` 的分工：本 prop 渲染的是**标签本体**（占位、省略号、行内对齐都由 `.mh-tree__label`
+     * 承担，因此必须留在那个槽里）；`renderNode` 渲染的是标签**之后**的常驻附加内容（计数徽标一类）。
+     * 典型用途是搜索命中的文本高亮（把标签切成多个片段）。
+     *
+     * 缺省不传时仍渲染 `labelKey` 的纯文本 —— 这是绝大多数消费方的路径，行为零变化。
+     */
+    renderLabel: {
+        type: PropType<(node: TreeNode) => unknown>;
+        default: undefined;
+    };
     /** 节点附加内容（计数徽标等），渲染在标签之后 */
     renderNode: {
         type: PropType<(node: TreeNode) => unknown>;
@@ -305,6 +330,7 @@ export declare const Tree: import("vue").DefineComponent<import("vue").ExtractPr
     onErrorAction: () => void;
     labelKey: string;
     childrenKey: string;
+    renderLabel: (node: TreeNode) => unknown;
     renderNode: (node: TreeNode) => unknown;
     renderActions: (node: TreeNode) => unknown;
     expandedKeys: string[];

package/dist/components/tree/index.js

@@ -33,6 +33,19 @@ const Tree = /* @__PURE__ */ defineComponent({
       type: Function,
       default: void 0
     },
+    /**
+     * 标签体的自定义渲染（**替掉** `labelKey` 的纯文本）。
+     *
+     * 与 `renderNode` 的分工：本 prop 渲染的是**标签本体**（占位、省略号、行内对齐都由 `.mh-tree__label`
+     * 承担，因此必须留在那个槽里）；`renderNode` 渲染的是标签**之后**的常驻附加内容（计数徽标一类）。
+     * 典型用途是搜索命中的文本高亮（把标签切成多个片段）。
+     *
+     * 缺省不传时仍渲染 `labelKey` 的纯文本 —— 这是绝大多数消费方的路径，行为零变化。
+     */
+    renderLabel: {
+      type: Function,
+      default: void 0
+    },
     /** 节点附加内容（计数徽标等），渲染在标签之后 */
     renderNode: {
       type: Function,
@@ -231,7 +244,7 @@ const Tree = /* @__PURE__ */ defineComponent({
           "class": "mh-tree__caret mh-tree__caret--empty"
         }, null), createVNode("span", {
           "class": "mh-tree__label"
-        }, [String(node[props.labelKey] ?? "")]), props.renderNode ? createVNode("span", {
+        }, [props.renderLabel ? props.renderLabel(node) : String(node[props.labelKey] ?? "")]), props.renderNode ? createVNode("span", {
           "class": "mh-tree__extra"
         }, [props.renderNode(node)]) : null, props.renderActions ? createVNode("span", {
           "class": "mh-tree__actions",

package/dist/index.d.ts

@@ -34,7 +34,7 @@ export { Badge, type BadgeTone, type BadgeShape, type BadgeSize, type BadgeDot,
 export { Button, type ButtonVariant, type ButtonCompound, type ButtonCompoundType, } from './components/button';
 export { Input, Textarea, type TextareaProps, type InputCompound, type InputCompoundType, } from './components/input';
 export { Search, type SearchProps } from './components/search';
-export { Select, type SelectOption, type SelectValue } from './components/select';
+export { Select, SelectTree, type SelectOption, type SelectValue } from './components/select';
 export { Switch } from './components/switch';
 export { Capsule, type CapsuleOption, type CapsuleShape } from './components/capsule';
 export { Form, type FormProps, type FormHeaderProps, type FormItemProps, type FormValues, type FormItemSlotScope, type FormItemAlign, type FormLabelAlign, type FormColumns, type FormPadding, type FormCompound, } from './components/form';

package/dist/index.js

@@ -39,6 +39,7 @@ import { Upload, formatFileSize } from "./components/upload/index.js";
 import { QueryState } from "./components/query-state/index.js";
 import { Loading } from "./components/loading/index.js";
 import { mergePartStyle, partPaddingStyle } from "./components/part-padding.js";
+import { SelectTree } from "./components/select/select-tree.js";
 import { alert, closeAllDialogs, confirm } from "./services/dialog.js";
 import { clearToasts, toast } from "./services/toast.js";
 import { configureHost, getHostSelector, resolveHost } from "./services/base.js";
@@ -74,6 +75,7 @@ export {
   Radio,
   Search,
   Select,
+  SelectTree,
   Skeleton,
   Steps,
   Switch,