@manohub/ui 0.10.0 → 0.10.1

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

@@ -22,6 +22,11 @@ export interface TextareaAutoSize {
  * 附加位：`prefix` / `suffix` **插槽**里放什么由你决定（图标 / 单位 / 域名 / 你自己的可点元素），
  * 本件不内置标签件 —— 纯装饰形态无底色、不参与 Tab 序列，可点形态的热区与底色归消费方。
  *
+ * **属性落点**（用错位置就会「样式在壳上、属性在组件上被丢掉」）：
+ * `class` / `style` → 表壳 `.mh-input__wrap`（整件的宽度与显式锚）；**其余 attrs 一律透传到控件**
+ * （`id` / `name` / `aria-*` / `data-*` / `title` / 原生事件）—— 壳只是排版容器，属性落它上面等于丢掉
+ * —— 见 `forwardAttrs`；触发器形态另有 `controlClass` / `controlAttrs` 两个**专口子**（同名键以它为准）。
+ *
  * @example 受控 + 可清除
  * <Input modelValue={kw} placeholder="搜索" clearable prefix={<Icon name="search" />} onChange={setKw} />
  *
@@ -115,7 +120,7 @@ export declare const Input: import("vue").DefineComponent<import("vue").ExtractP
         type: NumberConstructor;
         default: undefined;
     };
-    /** 右侧字数统计（单行须给 `maxlength` 才有意义） */
+    /** 右侧字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
         type: BooleanConstructor;
         default: boolean;
@@ -145,7 +150,8 @@ export declare const Input: import("vue").DefineComponent<import("vue").ExtractP
         type: StringConstructor;
         default: undefined;
     };
-    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上） */
+    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上）;
+     *  与透传的 attrs 撞名时以本 prop 为准 */
     controlAttrs: {
         type: PropType<Record<string, unknown>>;
         default: undefined;
@@ -233,7 +239,7 @@ export declare const Input: import("vue").DefineComponent<import("vue").ExtractP
         type: NumberConstructor;
         default: undefined;
     };
-    /** 右侧字数统计（单行须给 `maxlength` 才有意义） */
+    /** 右侧字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
         type: BooleanConstructor;
         default: boolean;
@@ -263,7 +269,8 @@ export declare const Input: import("vue").DefineComponent<import("vue").ExtractP
         type: StringConstructor;
         default: undefined;
     };
-    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上） */
+    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上）;
+     *  与透传的 attrs 撞名时以本 prop 为准 */
     controlAttrs: {
         type: PropType<Record<string, unknown>>;
         default: undefined;
@@ -324,7 +331,7 @@ export interface TextareaProps {
     /** 是否带边框 */
     bordered?: boolean;
     maxlength?: number;
-    /** 右下角字数统计（须给 `maxlength` 才有意义） */
+    /** 右下角字数统计（须给 `maxlength` 才渲染） */
     showCount?: boolean;
     autofocus?: boolean;
     onChange?: (v: string) => void;
@@ -332,8 +339,9 @@ export interface TextareaProps {
 /**
  * 多行输入（同一份面；结构与单行不同，故单列一个件）。
  *
- * ⚠️ 本件**没有** `mono` 档（`Input` 有）。要等宽的输入框别拿 `Text mono` 去包 —— 那会丢掉输入能力；
- * 该写法目前只能保留一条带 `font-family: var(--ui-font-mono)` 的应用侧样式登记（缺口见包内 `docs/kit-gaps.md`）。
+ * ⚠️ **输入族没有 `mono` 档**（`Input` 与 `Textarea` 都没有）。要等宽的输入框别拿 `Text mono` 去包
+ * —— 那会丢掉输入能力；目前只能由应用侧保留一条带 `font-family: var(--ui-font-mono)` 的样式登记
+ * （缺件登记见下游仓 `aihub-frontend/docs/kit-gaps.md`，本仓不复制那份台账）。
  *
  * @example 备注框：自适应 2~6 行 + 限长计数
  * <Textarea modelValue={note} autoSize={{ minRows: 2, maxRows: 6 }} maxlength={500} showCount onChange={setNote} />
@@ -388,6 +396,7 @@ export declare const Textarea: import("vue").DefineComponent<import("vue").Extra
         type: NumberConstructor;
         default: undefined;
     };
+    /** 右下角字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
         type: BooleanConstructor;
         default: boolean;
@@ -452,6 +461,7 @@ export declare const Textarea: import("vue").DefineComponent<import("vue").Extra
         type: NumberConstructor;
         default: undefined;
     };
+    /** 右下角字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
         type: BooleanConstructor;
         default: boolean;
@@ -559,7 +569,7 @@ export declare const InputCompound: {
             type: NumberConstructor;
             default: undefined;
         };
-        /** 右侧字数统计（单行须给 `maxlength` 才有意义） */
+        /** 右侧字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
         showCount: {
             type: BooleanConstructor;
             default: boolean;
@@ -589,7 +599,8 @@ export declare const InputCompound: {
             type: StringConstructor;
             default: undefined;
         };
-        /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上） */
+        /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上）;
+         *  与透传的 attrs 撞名时以本 prop 为准 */
         controlAttrs: {
             type: PropType<Record<string, unknown>>;
             default: undefined;
@@ -711,7 +722,7 @@ export declare const InputCompound: {
             type: NumberConstructor;
             default: undefined;
         };
-        /** 右侧字数统计（单行须给 `maxlength` 才有意义） */
+        /** 右侧字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
         showCount: {
             type: BooleanConstructor;
             default: boolean;
@@ -741,7 +752,8 @@ export declare const InputCompound: {
             type: StringConstructor;
             default: undefined;
         };
-        /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上） */
+        /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上）;
+         *  与透传的 attrs 撞名时以本 prop 为准 */
         controlAttrs: {
             type: PropType<Record<string, unknown>>;
             default: undefined;
@@ -854,7 +866,7 @@ export declare const InputCompound: {
         type: NumberConstructor;
         default: undefined;
     };
-    /** 右侧字数统计（单行须给 `maxlength` 才有意义） */
+    /** 右侧字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
         type: BooleanConstructor;
         default: boolean;
@@ -884,7 +896,8 @@ export declare const InputCompound: {
         type: StringConstructor;
         default: undefined;
     };
-    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上） */
+    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上）;
+     *  与透传的 attrs 撞名时以本 prop 为准 */
     controlAttrs: {
         type: PropType<Record<string, unknown>>;
         default: undefined;
@@ -975,6 +988,7 @@ export declare const InputCompound: {
             type: NumberConstructor;
             default: undefined;
         };
+        /** 右下角字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
         showCount: {
             type: BooleanConstructor;
             default: boolean;
@@ -1039,6 +1053,7 @@ export declare const InputCompound: {
             type: NumberConstructor;
             default: undefined;
         };
+        /** 右下角字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
         showCount: {
             type: BooleanConstructor;
             default: boolean;

package/dist/components/input/index.js

@@ -78,7 +78,7 @@ const Input = /* @__PURE__ */ defineComponent({
       type: Number,
       default: void 0
     },
-    /** 右侧字数统计（单行须给 `maxlength` 才有意义） */
+    /** 右侧字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
       type: Boolean,
       default: false
@@ -104,6 +104,10 @@ const Input = /* @__PURE__ */ defineComponent({
      * 原生 `<button>` 才有的语义（如 `popovertarget` 触发 popover —— 该属性只认 button）。
      * 缺省 `as="input"` 的渲染路径除本组 prop 外零变化。
      *
+     * **单行契约（与输入框同源，面层承担）**：控件是单行盒，值再长也不换行（超出走省略号）
+     * —— 见 `styles/components/input.css` 的 `.mh-input--trigger`。故 `default` 插槽里给**裸文本**
+     * 也安全，不需要自己再包一层截断 span。
+     *
      * **无值时的占位**：`<button>` 没有 `::placeholder` 伪元素可用，故 `placeholder` 在这个形态下
      * 由本件渲染成一个 span（`.mh-input__placeholder`，色档与原生占位一致）；判据是
      * `hasValue === false && placeholder` **同时**成立 —— 两者缺一即沿用消费方给的 `default` 插槽。
@@ -119,7 +123,8 @@ const Input = /* @__PURE__ */ defineComponent({
       type: String,
       default: void 0
     },
-    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上） */
+    /** 展开到**控件元素**上的属性（触发器形态要 `popovertarget` / `aria-*` / `onKeydown` 落到控件上）;
+     *  与透传的 attrs 撞名时以本 prop 为准 */
     controlAttrs: {
       type: Object,
       default: void 0
@@ -143,6 +148,13 @@ const Input = /* @__PURE__ */ defineComponent({
     const inner = ref(props.defaultValue);
     const current = computed(() => props.modelValue ?? inner.value);
     const revealed = ref(false);
+    const forwardAttrs = computed(() => {
+      const rest = {};
+      for (const [key, value] of Object.entries(attrs)) {
+        if (key !== "class" && key !== "style") rest[key] = value;
+      }
+      return rest;
+    });
     const visualStatus = computed(() => props.status ?? (props.invalid ? "error" : void 0));
     const isInvalid = computed(() => visualStatus.value === "error");
     const commit = (value) => {
@@ -163,6 +175,7 @@ const Input = /* @__PURE__ */ defineComponent({
     const isTrigger = computed(() => props.as === "button");
     const controlClasses = computed(() => ["mh-input", isTrigger.value ? "mh-input--trigger" : "", props.size === "md" ? "" : `mh-input--${props.size}`, props.bordered ? "" : "mh-input--borderless", visualStatus.value ? `is-${visualStatus.value}` : "", props.disabled ? "is-disabled" : "", props.controlClass].filter(Boolean).join(" "));
     const showClear = computed(() => props.clearable && (props.hasValue ?? !!current.value));
+    const showCounter = computed(() => !isTrigger.value && props.showCount && props.maxlength !== void 0);
     const showPlaceholder = computed(() => isTrigger.value && props.hasValue === false && !!props.placeholder);
     return () => createVNode("div", {
       "class": ["mh-input__wrap", attrs.class].filter(Boolean).join(" "),
@@ -175,7 +188,7 @@ const Input = /* @__PURE__ */ defineComponent({
          本件的 Enter / Delete 是**输入框**语义，触发器有自己的一套（如 `↓` 开面板），不在此套用。 */
       createVNode("button", mergeProps({
         "type": "button"
-      }, props.controlAttrs, {
+      }, forwardAttrs.value, props.controlAttrs, {
         "class": controlClasses.value,
         "disabled": props.disabled,
         "aria-invalid": isInvalid.value ? "true" : void 0
@@ -185,7 +198,7 @@ const Input = /* @__PURE__ */ defineComponent({
           "class": "mh-input__placeholder"
         }, [props.placeholder])
       ) : slots.default ? slots.default() : null])
-    ) : createVNode("input", {
+    ) : createVNode("input", mergeProps(forwardAttrs.value, {
       "class": controlClasses.value,
       "type": inputType.value,
       "value": current.value,
@@ -197,7 +210,7 @@ const Input = /* @__PURE__ */ defineComponent({
       "aria-invalid": isInvalid.value ? "true" : void 0,
       "onInput": onInput,
       "onKeydown": onKeydown
-    }, null), showClear.value ? createVNode("button", {
+    }), null), showClear.value ? createVNode("button", {
       "type": "button",
       "class": "mh-input__clear",
       "aria-label": "清除",
@@ -219,9 +232,9 @@ const Input = /* @__PURE__ */ defineComponent({
       "class": "mh-input__eye-icon"
     }, null)]) : null, slots.suffix ? createVNode("span", {
       "class": "mh-input__suffix"
-    }, [slots.suffix()]) : null, !isTrigger.value && props.showCount ? createVNode("span", {
+    }, [slots.suffix()]) : null, showCounter.value ? createVNode("span", {
       "class": "mh-input__counter"
-    }, [current.value?.length ?? 0, createTextVNode("/"), props.maxlength ?? 0]) : null]);
+    }, [current.value?.length ?? 0, createTextVNode("/"), props.maxlength]) : null]);
   }
 });
 const Textarea = /* @__PURE__ */ defineComponent({
@@ -277,6 +290,7 @@ const Textarea = /* @__PURE__ */ defineComponent({
       type: Number,
       default: void 0
     },
+    /** 右下角字数统计（**须给 `maxlength` 才渲染**：没有分母的 `n/0` 是坏值） */
     showCount: {
       type: Boolean,
       default: false
@@ -299,6 +313,14 @@ const Textarea = /* @__PURE__ */ defineComponent({
   }) {
     const inner = ref(props.defaultValue);
     const current = computed(() => props.modelValue ?? inner.value);
+    const forwardAttrs = computed(() => {
+      const rest = {};
+      for (const [key, value] of Object.entries(attrs)) {
+        if (key !== "class" && key !== "style") rest[key] = value;
+      }
+      return rest;
+    });
+    const showCounter = computed(() => props.showCount && props.maxlength !== void 0);
     const visualStatus = computed(() => props.status ?? (props.invalid ? "error" : void 0));
     const isInvalid = computed(() => visualStatus.value === "error");
     const autoRows = computed(() => {
@@ -320,7 +342,7 @@ const Textarea = /* @__PURE__ */ defineComponent({
     return () => createVNode("div", {
       "class": ["mh-input__wrap", attrs.class].filter(Boolean).join(" "),
       "style": attrs.style
-    }, [createVNode("textarea", {
+    }, [createVNode("textarea", mergeProps(forwardAttrs.value, {
       "class": ["mh-input", "mh-input--textarea", props.size === "md" ? "" : `mh-input--${props.size}`, props.bordered ? "" : "mh-input--borderless", visualStatus.value ? `is-${visualStatus.value}` : "", props.disabled ? "is-disabled" : ""].filter(Boolean).join(" "),
       "rows": autoRows.value,
       "value": current.value,
@@ -331,9 +353,9 @@ const Textarea = /* @__PURE__ */ defineComponent({
       "autofocus": props.autofocus,
       "aria-invalid": isInvalid.value ? "true" : void 0,
       "onInput": onInput
-    }, null), props.showCount ? createVNode("span", {
+    }), null), showCounter.value ? createVNode("span", {
       "class": "mh-input__counter"
-    }, [current.value?.length ?? 0, createTextVNode("/"), props.maxlength ?? 0]) : null]);
+    }, [current.value?.length ?? 0, createTextVNode("/"), props.maxlength]) : null]);
   }
 });
 const InputDisplay = /* @__PURE__ */ defineComponent({
@@ -350,10 +372,17 @@ const InputDisplay = /* @__PURE__ */ defineComponent({
     slots,
     attrs
   }) {
-    return () => createVNode("span", {
+    const forwardAttrs = computed(() => {
+      const rest = {};
+      for (const [key, value] of Object.entries(attrs)) {
+        if (key !== "class" && key !== "style") rest[key] = value;
+      }
+      return rest;
+    });
+    return () => createVNode("span", mergeProps(forwardAttrs.value, {
       "class": ["mh-input--display", attrs.class].filter(Boolean).join(" "),
       "style": attrs.style
-    }, [slots.default ? slots.default() : props.value]);
+    }), [slots.default ? slots.default() : props.value]);
   }
 });
 Object.assign(Input, {

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

@@ -32,6 +32,9 @@
  * （不做 JS 定位、不做 resize 监听）。本件只补原生做不到的：选中值回填、多选数组的增删与收纳、
  * 搜索过滤与「创建」项、以及键盘的下拉导航（↑↓ 移动高亮行）。
  *
+ * **面板有高度上限**：`--ui-select-panel-max-height`（默认 320px，钉在 `select.css` 的面板根上）——
+ * 超出即面板内容区（`.mh-select__body`）滚动、搜索行常驻；列表与 `SelectTree` 两形态共用这一份。
+ *
  * ## 状态三源等价
  *
  * 选中行 = `[data-state='selected']`（组件下发）/ 原生 `input:checked`（静态页零 JS 路径）/
@@ -87,7 +90,7 @@ export declare const Select: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
-    /** 搜索：`true` 强制开；不给时选项多于 8 条自动开 */
+    /** 搜索行是否出现（**只认显式开启**；缺省不出 —— 不在面板里凭空多出一行） */
     searchable: {
         type: BooleanConstructor;
         default: boolean;
@@ -176,7 +179,7 @@ export declare const Select: import("vue").DefineComponent<import("vue").Extract
         type: StringConstructor;
         default: undefined;
     };
-    /** 搜索：`true` 强制开；不给时选项多于 8 条自动开 */
+    /** 搜索行是否出现（**只认显式开启**；缺省不出 —— 不在面板里凭空多出一行） */
     searchable: {
         type: BooleanConstructor;
         default: boolean;

package/dist/components/select/index.js

@@ -41,7 +41,7 @@ const Select = /* @__PURE__ */ defineComponent({
       type: String,
       default: void 0
     },
-    /** 搜索：`true` 强制开；不给时选项多于 8 条自动开 */
+    /** 搜索行是否出现（**只认显式开启**；缺省不出 —— 不在面板里凭空多出一行） */
     searchable: {
       type: Boolean,
       default: false
@@ -122,7 +122,6 @@ const Select = /* @__PURE__ */ defineComponent({
       return list;
     });
     const selectedOptions = computed(() => flatOptions.value.filter((option) => selectedValues.value.includes(option.value)));
-    const showSearch = computed(() => props.searchable || flatOptions.value.length > 8);
     const matched = (option, kw) => props.filterOption ? props.filterOption(option, kw) : option.label.includes(kw);
     const visibleOptions = computed(() => {
       const kw = keyword.value;
@@ -215,7 +214,7 @@ const Select = /* @__PURE__ */ defineComponent({
       }, null), createVNode(SelectPanel, {
         "id": panelId,
         "elementRef": panelRef,
-        "searchable": showSearch.value,
+        "searchable": props.searchable,
         "keyword": keyword.value,
         "onKeyword": (value) => {
           keyword.value = value;

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

@@ -4,6 +4,8 @@
  * 它拥有「面板里那一撮选项」的全部形态与状态行：平铺选项 / 分组（组标题不可点）/ 「创建」行 /
  * 空态行 / 加载行。**不含面板壳与搜索行**（那是 `SelectPanel` 的事），也不持有任何状态 ——
  * 过滤结果、选中值、是否可创建统统由消费方算好喂进来，本件只渲染。
+ * 行由面板壳装在**内容区**（`.mh-select__body`，面板里唯一的滚动容器）里，限高与滚动都归面层，
+ * 本件不写第二个滚动容器。
  *
  * 选项是真实 `<button role="option">`（不是 div + JS 高亮）：键盘可达、`:focus-visible` 可直接
  * 承载「高亮行」这层语义，于是不需要再维护一份 JS 高亮下标 —— **焦点即高亮**，

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

@@ -1,10 +1,15 @@
 /**
  * SelectPanel —— 选择器族的**面板壳内件**（`Select` 与 `SelectTree` 共用，不对外导出）。
  *
- * 它只拥有三样东西：**原生 popover 元素**（开合 / Esc / 点外部关闭 / 顶层渲染 / 定位全归浏览器）、
- * **搜索行**（面板顶部那一个输入框）、以及**内容槽**（列表体或树体）。
+ * 它只拥有四样东西：**原生 popover 元素**（开合 / Esc / 点外部关闭 / 顶层渲染 / 定位全归浏览器）、
+ * **搜索行**（面板顶部那一个输入框）、**内容区**（`.mh-select__body`，面板里唯一的滚动容器）
+ * 与**内容槽**（列表体或树体）。
  * 「面板里装什么」不在本件 —— 这正是让列表与树共用同一份面板皮肤的原因。
  *
+ * **限高在面层**：面板根上钉着 `--ui-select-panel-max-height`（`select.css`），超出即内容区滚动、
+ * 搜索行常驻不滚。内容区这一层因此是**结构性的**（不是可有可无的包裹）：少了它，长列表 / 长树
+ * 会把面板一路撑高（实测 60 条选项 2212px），搜索行也会跟着滚走。本件只负责把它渲染出来。
+ *
  * 组合类名与服务端三条属性都是**操作层的组合**，不是本件新造的浮层：
  * `class="mh-popup mh-select__panel mh-popup--anchored"`（状态根 + 本族皮肤 + 显式锚档）、
  * `data-side` / `data-align`（`popup.css` 的定位档）、`popover="auto"`（原生轻 dismiss）。
@@ -27,7 +32,7 @@ export declare const SelectPanel: import("vue").DefineComponent<import("vue").Ex
         type: PropType<ElementRef>;
         default: undefined;
     };
-    /** 是否渲染搜索行（列表形态：`searchable` 或选项多于 8 条；树形态同口径） */
+    /** 是否渲染搜索行（**只认消费方显式开启**：列表形态与树形态同口径，件不按数据量自动决断） */
     searchable: {
         type: BooleanConstructor;
         default: boolean;
@@ -66,7 +71,7 @@ export declare const SelectPanel: import("vue").DefineComponent<import("vue").Ex
         type: PropType<ElementRef>;
         default: undefined;
     };
-    /** 是否渲染搜索行（列表形态：`searchable` 或选项多于 8 条；树形态同口径） */
+    /** 是否渲染搜索行（**只认消费方显式开启**：列表形态与树形态同口径，件不按数据量自动决断） */
     searchable: {
         type: BooleanConstructor;
         default: boolean;

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

@@ -13,7 +13,7 @@ const SelectPanel = /* @__PURE__ */ defineComponent({
       type: Object,
       default: void 0
     },
-    /** 是否渲染搜索行（列表形态：`searchable` 或选项多于 8 条；树形态同口径） */
+    /** 是否渲染搜索行（**只认消费方显式开启**：列表形态与树形态同口径，件不按数据量自动决断） */
     searchable: {
       type: Boolean,
       default: false
@@ -64,7 +64,9 @@ const SelectPanel = /* @__PURE__ */ defineComponent({
       "value": props.keyword,
       "placeholder": props.searchPlaceholder,
       "onInput": (event) => props.onKeyword?.(event.target.value)
-    }, null)]) : null, slots.default?.()]);
+    }, null)]) : null, createVNode("div", {
+      "class": "mh-select__body"
+    }, [slots.default?.()])]);
   }
 });
 export {

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

@@ -10,7 +10,9 @@
  * 2. **本地过滤树**：搜索行在场时按关键词过滤，命中节点的**祖先链保留**、父节点自身命中则
  *    **整支保留**，并强制全展到命中层（算法与切分都是纯函数，见 `select-tree-filter.ts`）；
  *    命中文本按面层的 `.mh-select__hit` 高亮（靠 `Tree` 的可选 `renderLabel` 钩子落进标签槽）。
- * 3. **面板内限高滚动**：树体包在 `.mh-select__tree` 里（内距 + 限高 + 溢出滚动），长树不撑破面板。
+ * 3. **面板内限高滚动**：限高归面板（`.mh-select__panel` 的 `--ui-select-panel-max-height`）、
+ *    溢出由面板内容区（`.mh-select__body`）承担；本件只把树包在 `.mh-select__tree` 里给内距
+ *    —— 限高不由形态自持，列表形态共用同一份。
  *
  * ## 与 `Select` 的三处有意差异（都是「树不是列表」决定的）
  *
@@ -65,7 +67,7 @@ export declare const SelectTree: import("vue").DefineComponent<import("vue").Ext
         type: StringConstructor;
         default: string;
     };
-    /** 搜索：`true` 强制开；不给时节点总数多于 8 自动开（与 `Select` 同口径） */
+    /** 搜索行是否出现（**只认显式开启**；缺省不出 —— 不在面板里凭空多出一行） */
     searchable: {
         type: BooleanConstructor;
         default: boolean;
@@ -174,7 +176,7 @@ export declare const SelectTree: import("vue").DefineComponent<import("vue").Ext
         type: StringConstructor;
         default: string;
     };
-    /** 搜索：`true` 强制开；不给时节点总数多于 8 自动开（与 `Select` 同口径） */
+    /** 搜索行是否出现（**只认显式开启**；缺省不出 —— 不在面板里凭空多出一行） */
     searchable: {
         type: BooleanConstructor;
         default: boolean;

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

@@ -3,7 +3,7 @@ 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";
+import { filterTreeNodes, findTreeNode, treeLabel, splitHighlight, treeNodeKey, treeChildren } from "./select-tree-filter.js";
 const SelectTree = /* @__PURE__ */ defineComponent({
   name: "SelectTree",
   inheritAttrs: false,
@@ -42,7 +42,7 @@ const SelectTree = /* @__PURE__ */ defineComponent({
       type: String,
       default: "请选择"
     },
-    /** 搜索：`true` 强制开；不给时节点总数多于 8 自动开（与 `Select` 同口径） */
+    /** 搜索行是否出现（**只认显式开启**；缺省不出 —— 不在面板里凭空多出一行） */
     searchable: {
       type: Boolean,
       default: false
@@ -132,18 +132,6 @@ const SelectTree = /* @__PURE__ */ defineComponent({
     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) => {
@@ -221,7 +209,7 @@ const SelectTree = /* @__PURE__ */ defineComponent({
       }, null), createVNode(SelectPanel, {
         "id": panelId,
         "elementRef": panelRef,
-        "searchable": showSearch.value,
+        "searchable": props.searchable,
         "keyword": keyword.value,
         "onKeyword": (value) => {
           keyword.value = value;

package/dist/styles/components/badge.css

@@ -89,8 +89,10 @@
   border-color: transparent;
 }
 
+/* 中性软底取 `base-200`（中性面）—— 改前是 `base-50`：那档只比内容底低 1.7 L*，
+   软底淡到与背景不可分（同族 `--primary` 软底也走「弱底」档，此处与之等形）。 */
 .mh-badge--soft.mh-badge--default {
-  --mh-badge-bg: var(--ui-base-50);
+  --mh-badge-bg: var(--ui-base-200);
   --mh-badge-fg: var(--ui-base-content-muted);
 }
 

package/dist/styles/components/button.css

@@ -165,10 +165,13 @@
   color: var(--ui-button-accent);
 }
 
-/* ===== 虚线：区域内添加内容 ===== */
+/* ===== 虚线：区域内添加内容 =====
+ * 虚线也是「框」→ 取 `--ui-base-300`（全库唯一的「线 / 框」色，出处 `@manohub/theme` 的
+ * `default/colors.css` 头「三条口径」第 2 条；`base-400` 只服务勾选类小控件框体）。
+ * 改前取的是 `base-400`（"虚线要深一档才看得见"），2026-09-30 按库级口径收敛。 */
 .mh-button--dashed {
   background: var(--ui-base-100);
-  border: 1px dashed var(--ui-base-400);
+  border: 1px dashed var(--ui-base-300);
   color: var(--ui-button-accent);
 }
 .mh-button--dashed:hover,

package/dist/styles/components/input.css

@@ -109,15 +109,27 @@
  * 这里只补**作者源没覆盖、会被 `<button>` 的原生 UA 样式漏进来的四项**（实测 Chrome 的 html.css：
  * `button { align-items: flex-start; text-align: center; appearance: auto; font: 400 13.3333px Arial }`）：
  *
- * - `align-items: center` —— 控件是 flex 行，UA 的 `flex-start` 会把值 / 标签顶到上沿；
+ * - `align-items: center` —— 消费方把控件开成 flex 行时（如 `Select` 的 `.mh-select`）拦住 UA 的
+ *   `flex-start`（它会把值 / 标签顶到上沿）。本件缺省**不给 `display`**，控件是 inline-block，此时
+ *   垂直居中来自浏览器对 `<button>` 内容的默认居中 —— 这条声明在那个形态下用不到，留着是与复合件同一份规格；
  * - `text-align: inherit` —— UA 的 `center` 会**继承**给值文本；
  * - `font-weight` / `line-height: inherit` —— UA 的 `font` 简写会把这两项从继承链上摘下来，
  *   而作者源只写了 `font-family` 与 `font-size`（对比：`<input>` 的 UA 不设这两项，故输入框形态天然一致）；
  * - `appearance: none` —— 防仍画原生按钮皮肤的引擎（Safari 一类）。
  *
+ * 外加一条**单行契约**（`white-space: nowrap` + `overflow: hidden` + `text-overflow: ellipsis`）：
+ * 触发器与输入框同为**单行**控件，值再长也不换行。少了它，长值会在定高框里折成两行 ——
+ * 第二行溢出到框的下沿之外、右端图标也被挤走（实测：消费方把值当**裸文本**子节点渲染时必现，
+ * 如 `<Input as="button">{{ 部门名 }}</Input>` 放进窄表格单元格）。截断口径与
+ * `.mh-input__placeholder` / `.mh-select__value` 同源，这里补的是**控件本身**那一层
+ * —— 那两处只管各自的子节点，落在控件上的裸文本没有它们兜。
+ *
  * 禁写：本块不碰框 / 色 / 尺寸 / 内距 —— 那些归 `.mh-input` 与表壳，重复声明就是又开一份会漂的规格。 */
 .mh-input--trigger {
   appearance: none;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
   align-items: center;
   font-weight: inherit;
   line-height: inherit;

package/dist/styles/components/input.tokens.css

@@ -28,9 +28,11 @@
   --ui-input-font-size: var(--ui-font-body); /* 14：控件内容走正文档 */
   --ui-input-font-size-sm: var(--ui-font-caption); /* 13 */
   --ui-input-font-size-lg: var(--ui-font-heading); /* 16 */
-  /* 描边取 base-300（= 设计 `0:3946` 搜索框的 `#e6e6e6`），与卡片 / 表格 / 按钮 / 分页同一条线。
-     ⚠️ 改前是 base-400，而 `filter.css` 的既有裁决早已写明「控件框边 = --ui-base-300」——
-     本件与它是同一条规格，之前的 base-400 属自相矛盾。base-400 从此只服务勾选类小控件框体。 */
+  /* 描边取 base-300 —— 这**不是本件自选**，是库级口径：`base-300` 是全库唯一的「线 / 框」色
+     （输入框、按钮、表格、分页项、卡片、面板、分隔线一律取它），`base-400` 只服务勾选类小控件框体。
+     权威出处是 `@manohub/theme` 的 `default/colors.css` 头「三条口径」第 2 条（改值前先读那三条）。
+     括注的 `#e6e6e6` 是 **default** 套该槽位的值；**farris** 套同槽位取 Ne08（`#e8ebf2`）——
+     两套值不同、槽位语义相同，别按规范原文给输入框的 Ne04 来反推（那正是本件改前的 base-400）。 */
   --ui-input-line: var(--ui-base-300);
   --ui-input-line-hover: var(--ui-primary-hover); /* 滑过 / 聚焦转主色（规范 Th08） */
   --ui-input-textarea-min-height: 56px; /* 多行最小高（两行正文 + 上下内距） */

package/dist/styles/components/pagination.css

@@ -253,7 +253,13 @@
   --ui-pagination-font-size: var(--ui-font-body);
 }
 
-/* ===== 跳页（showQuickJumper） ===== */
+/* ===== 跳页（showQuickJumper） =====
+ *
+ * 跳页框是**输入框**，画线取 `--ui-base-300` —— 与 `Input` 同一条口径（`base-300` 是全库唯一的
+ * 「线 / 框」色，出处 `@manohub/theme` 的 `default/colors.css` 头「三条口径」第 2 条；
+ * `base-400` 只服务勾选类小控件框体）。**改前取的是 `base-400`**：同一个「输入框」在库里因此
+ * 有过两种线色，属跨件口径漏改（2026-09-30 收敛）。
+ * 禁用档与 `Input` 同构：底转 `base-200`、线仍 `base-300` —— 即**靠底色区分禁用**，不再靠线深。 */
 .mh-pagination__jump {
   display: inline-flex;
   align-items: center;
@@ -265,7 +271,7 @@
   width: 56px;
   height: var(--ui-pagination-item-size);
   padding: 0 var(--ui-space-2);
-  border: 1px solid var(--ui-base-400);
+  border: 1px solid var(--ui-base-300);
   border-radius: var(--ui-pagination-item-radius);
   background: var(--ui-base-100);
   font-family: inherit;

package/dist/styles/components/select.css

@@ -23,6 +23,9 @@
  * 表壳挂 `.mh-popup-anchor`（`anchor-name`）、面板挂 `.mh-popup--anchored`（`position-anchor`），
  * 锚点即整件；非锚定场景回落到 240px 兜底值。
  *
+ * **面板有高度上限**：`--ui-select-panel-max-height`（默认 320px）钉在面板根上，超出即内容区
+ * （`.mh-select__body`）滚动、搜索行常驻 —— 列表与树两形态共用这一份，形态里不许各写限高。
+ *
  * **一处有色差异**：规范的选中行是灰底（Ne10），本仓的「选中」统一走**主色浅底**
  * `--ui-primary-subtle`（与列表 / 树的选中态同一语义槽位），否则悬停（Ne11）与选中（Ne10）两档灰
  * 在本仓有限的灰阶里挤成同色、看不出选中。
@@ -106,10 +109,25 @@
   background: var(--ui-base-200);
   color: var(--ui-base-content-muted);
 }
-/* ===== 面板皮肤（与操作层并列组合：`class="mh-popup mh-select__panel mh-popup--anchored"`） ===== */
+/* ===== 面板皮肤（与操作层并列组合：`class="mh-popup mh-select__panel mh-popup--anchored"`） =====
+   **面板是列容器 + 限高**：搜索行常驻（不滚），下一条的 `.mh-select__body` 承担滚动 ——
+   列表与树两形态因此共用同一份「长内容不撑破面板」的规格。
+   （历史症状：限高原先只写在树体 `.mh-select__tree` 上，而列表形态的选项是面板的**直接子节点**，
+   面板会被一路撑高；实测 60 条选项的面板高 2212px、视口只有 925px。） */
 .mh-select__panel {
   /* 锚 = `.mh-popup-anchor`（挂在表壳上）→ 面板与**整件**同宽；非锚定场景回落 240 */
   width: anchor-size(width, 240px);
+  /* 列容器：搜索行 `flex: none` + 内容区 `flex: 1 / min-height: 0`。
+     ⚠️ 加 `display: flex` 会以作者源压过 UA 给**收起态**定的 `display: none`，收起态靠操作层
+     `operations/popup.css` 里那条 `:is()` 兜底（把收起的浮层重新钉成 `display: none`，
+     特异性 0-3-0、高于本行）—— **那条兜底不能删**（与 `dialog.css` 同一处坑）。 */
+  display: flex;
+  flex-direction: column;
+  /* 限高（**含搜索行**）：超出即内容区滚动。面板仍贴锚点，只是不再无限长 */
+  max-height: var(--ui-select-panel-max-height);
+  /* UA 给 `[popover]` 的是 `overflow: auto`，必须归零：内容区已是滚动容器，
+     留一层就会与它叠成两条滚动条（同一个面板上实测会同时出现）。 */
+  overflow: hidden;
   padding: var(--ui-space-1) 0;
   border-radius: var(--ui-select-radius);
   background: var(--ui-base-100);
@@ -119,6 +137,15 @@
   box-shadow: var(--ui-shadow-popover);
 }
 
+/* 内容区：**面板里唯一的滚动容器**（列表体的选项行 / 树体的树都装在它里面）。
+   `min-height: 0` 是这一档生效的前提：列容器里弹性项的可收缩下限默认取内容高，
+   不给它，内容就永远压不下去、上面的限高形同虚设（与 `panel.css` 的 `.mh-panel__body` 同款）。 */
+.mh-select__body {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+}
+
 /* 选项行：滑过 / 选中 / 禁用 / 提示 / 空态 */
 .mh-select__option {
   position: relative;
@@ -213,21 +240,24 @@
   cursor: default;
 }
 
-/* 搜索行（选项多于 8 条时由组件渲染） */
+/* 搜索行（**消费方显式 `searchable` 时才由组件渲染**，件不按选项条数自动决断）。
+   `flex: none`：它是面板的**常驻**行 —— 面板限高时收缩与滚动都归内容区，
+   少了它，搜索行会被一起压扁（列容器里它默认是可收缩的）。 */
 .mh-select__search {
+  flex: none;
   padding: var(--ui-space-2) var(--ui-space-2) var(--ui-space-1);
 }
 
 /* ===== 树体（树选择 `SelectTree` 的面板内容）=====
    边界要认清楚：**面板皮肤归本文件**（上一节），**树的行态归 tree 面**（`.mh-tree__*` 那一族，
    本文件一行都不碰 —— 跨族类名须先登记跨面豁免，这里不走那条路）。
-   故本件只做「把树安放进面板」这一件事：内距 + 限高 + 溢出滚动。
-   行高 / 缩进 / 滑过与选中底色全部沿用 tree 面，两处形态不会漂移。 */
+   故本件只做「把树安放进面板」这一件事：内距。
+   行高 / 缩进 / 滑过与选中底色全部沿用 tree 面，两处形态不会漂移；
+   **限高与滚动也不在这里** —— 那是面板（`.mh-select__panel`）与面板内容区（`.mh-select__body`）的事，
+   列表与树两形态共用同一份（形态里各写一条就会漂移，本件此前正是自己写了一条）。 */
 .mh-select__tree {
   /* 行底满宽、只有内容缩进（缩进公式在 tree 面），故左右各留一个最小呼吸位 */
   padding: 0 var(--ui-space-1) var(--ui-space-1);
-  max-height: var(--ui-select-tree-max-height);
-  overflow-y: auto;
 }
 
 /* 命中高亮（搜索命中的那段文字，由组件的 `renderLabel` 落进 `.mh-tree__label` 槽）。

package/dist/styles/components/select.tokens.css

@@ -30,7 +30,8 @@
   --ui-select-option-selected: var(--ui-primary-subtle); /* 见头部「有色差异」 */
   --ui-select-chip-height: 24px; /* 多选标签（规范复用标签族 24 档） */
   --ui-select-icon-size: var(--ui-font-icon); /* 下拉箭头：常规图标档 */
-  /* 树形态（SelectTree）：面板内树体的限高 —— 约等于 9 行（行高 34 + 行距 6 的节距 40 见 tree.css），
-     超过即滚动，长树不把面板撑成整屏 */
-  --ui-select-tree-max-height: 320px;
+  /* 面板限高（**列表与树两形态共用**）：面板整体（含搜索行）不超此高，超出即内容区滚动。
+     320px ≈ 8 行选项（选项行 36 + 面板上下内距 8）；树形态可见行数按 tree 面的节距 40 折算
+     （行高 34 + 行距 6），有无搜索行会差一行上下。要改高度改这枚令牌，不要在业务侧压 max-height。 */
+  --ui-select-panel-max-height: 320px;
 }

package/dist/styles/components/steps.tokens.css

@@ -27,9 +27,11 @@
   --ui-steps-connector-length: 58.383px; /* 规范实测最小段长（其余由 flex 撑开） */
   --ui-steps-connector-width: 2px;
   --ui-steps-connector-arrow: 6px;
-  /* 连接线沿用 base-400：设计稿里**只有三个向导页**画了连接线（`#cdd2de`），而向导页已判定为旧稿；
-     四个品牌页没有步骤条样张 → 按「未覆盖槽位沿用现值并注明」处理，不做推测性改动。 */
-  --ui-steps-connector-line: var(--ui-base-400);
+  /* 连接线取 base-300（全库唯一的「线 / 框」色，见 `@manohub/theme` 的 `default/colors.css`
+     头「三条口径」第 2 条）—— 改前取的是 base-400。设计稿里**只有三个向导页**画了连接线
+     （`#cdd2de`）而向导页已判定为旧稿，四个品牌页没有步骤条样张 → 按库级口径取线色，
+     不做推测性改动（这枚令牌的档位语义与连接线宽度 / 燕尾尺寸一样，只在「线」这一族内变）。 */
+  --ui-steps-connector-line: var(--ui-base-300);
   --ui-steps-connector-line-active: var(--ui-primary); /* 规范 #4999fe */
   --ui-steps-title-gap: var(--ui-space-3); /* 节点与标题间距 12 */
   --ui-steps-seg-width: 140px;

package/dist/styles/components/tag.css

@@ -132,8 +132,10 @@
   appearance: none;
   pointer-events: none;
 }
+/* 悬停底取 `base-200`（中性面）—— 改前是 `base-50`：那档只比内容底低 1.7 L*，
+   在多数屏幕上看不出悬停反馈（`base-50` 不再作为「更轻底」的默认去处，见 colors 口径第 1 条）。 */
 .mh-tag--select:hover {
-  background: var(--ui-base-50);
+  background: var(--ui-base-200);
   border: 1px solid var(--ui-base-300);
 }
 .mh-tag--select:has(input:focus-visible) {
@@ -160,11 +162,13 @@
   cursor: not-allowed;
 }
 
-/* ===== 新增档（虚线框 + 加号由 @manohub/icon 的 plus 渲染）===== */
+/* ===== 新增档（虚线框 + 加号由 @manohub/icon 的 plus 渲染）=====
+ * 虚线框取 `--ui-base-300`（全库唯一的「线 / 框」色，见 `@manohub/theme` 的 `default/colors.css`
+ * 头「三条口径」第 2 条）；改前取 `base-400`，2026-09-30 按口径收敛。 */
 .mh-tag--add {
   height: var(--ui-tag-height);
   padding: 0 var(--ui-space-2);
-  border: 1px dashed var(--ui-base-400);
+  border: 1px dashed var(--ui-base-300);
   border-radius: var(--ui-radius-full);
   background: transparent;
   color: var(--ui-base-content-muted);

package/dist/styles/components/upload.tokens.css

@@ -18,7 +18,7 @@
   --ui-upload-padding: 32px; /* 规范间距档 8（本仓间距刻度最大 24，故按实测值给） */
   --ui-upload-zone-max-width: 500px; /* 规范拖拽区帧宽 */
   --ui-upload-radius: var(--ui-radius-control);
-  --ui-upload-line: var(--ui-base-400); /* 虚线边 Ne05 邻档 */
+  --ui-upload-line: var(--ui-base-300); /* 虚线边：全库唯一的「线 / 框」色（`base-400` 只服务勾选类小控件） */
   --ui-upload-text: var(--ui-base-content-muted); /* 主提示 Te05 */
   --ui-upload-hint: var(--ui-base-content-subtle); /* 副提示 Te07 */
   --ui-upload-meta-size: var(--ui-font-caption); /* 大小/缩略图文字：规范 12，本仓字阶最小 13 */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@manohub/ui",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "private": false,
   "type": "module",
   "description": "AIHub 自绘组件层：不依赖 farris 的手写 Vue TSX 组件 + 自带令牌层（Farris 规范视觉 · daisyUI 式语义令牌 · shadcn 式 API 词汇）。",
@@ -46,7 +46,7 @@
     "vue": "^3.5.0"
   },
   "dependencies": {
-    "@manohub/icon": "^0.10.0"
+    "@manohub/icon": "^0.10.1"
   },
   "devDependencies": {
     "@types/node": "^24.0.0",