@morya-ui/mcp 0.4.5 → 0.5.1

package/data/catalog.json

@@ -1,12 +1,12 @@
 {
-  "generatedAt": "2026-10-12T07:47:04.752Z",
+  "generatedAt": "2026-10-14T09:30:48.391Z",
   "library": {
     "name": "morya-ui",
-    "version": "0.4.5"
+    "version": "0.5.1"
   },
   "mcp": {
     "name": "@morya-ui/mcp",
-    "version": "0.4.5"
+    "version": "0.5.1"
   },
   "components": [
     {
@@ -4414,6 +4414,419 @@
         }
       }
     },
+    {
+      "id": "ColorPicker",
+      "name": "ColorPicker",
+      "exportName": "MColorPicker",
+      "category": "02 / FORM",
+      "description": "颜色选择器，支持面板取色、透明度与预设色板。",
+      "descriptionEn": "Color picker with panel, alpha, and preset swatches.",
+      "import": "import { MColorPicker } from 'morya-ui'",
+      "props": [
+        {
+          "name": "modelValue",
+          "type": "string",
+          "default": "'#1677ff'",
+          "description": "当前颜色值（hex）或 CSS 渐变字符串。"
+        },
+        {
+          "name": "gradient",
+          "type": "boolean",
+          "default": "false",
+          "description": "启用渐变色模式。"
+        },
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "default": "false",
+          "description": "禁用。"
+        },
+        {
+          "name": "disabledAlpha",
+          "type": "boolean",
+          "default": "false",
+          "description": "禁用透明度调节。"
+        },
+        {
+          "name": "clearable",
+          "type": "boolean",
+          "default": "false",
+          "description": "显示清空按钮。"
+        },
+        {
+          "name": "format",
+          "type": "'hex' | 'rgb' | 'hsb'",
+          "default": "'hex'",
+          "description": "显示格式。"
+        },
+        {
+          "name": "presets",
+          "type": "ColorPickerPreset[]",
+          "default": "—",
+          "description": "预设色板。"
+        },
+        {
+          "name": "showText",
+          "type": "boolean",
+          "default": "false",
+          "description": "在触发器中显示颜色文本。"
+        },
+        {
+          "name": "size",
+          "type": "MSizeInput",
+          "default": "—",
+          "description": "尺寸。"
+        },
+        {
+          "name": "placement",
+          "type": "ColorPickerPlacement",
+          "default": "'bottom-start'",
+          "description": "弹层位置。"
+        },
+        {
+          "name": "teleport",
+          "type": "boolean",
+          "default": "true",
+          "description": "是否 teleport 到 body。"
+        },
+        {
+          "name": "appendTo",
+          "type": "MAppendTo",
+          "default": "'body'",
+          "description": "挂载目标。"
+        },
+        {
+          "name": "transition",
+          "type": "MotionPresetId | false",
+          "default": "—",
+          "description": "过渡动画。"
+        },
+        {
+          "name": "pt",
+          "type": "FieldPassThrough",
+          "default": "—",
+          "description": "DOM 透传。"
+        },
+        {
+          "name": "label",
+          "type": "string",
+          "description": "分组标签。"
+        },
+        {
+          "name": "colors",
+          "type": "string[]",
+          "description": "颜色数组。"
+        },
+        {
+          "name": "defaultOpen",
+          "type": "boolean",
+          "description": "默认展开。"
+        }
+      ],
+      "events": [
+        {
+          "name": "update:modelValue",
+          "payload": "string",
+          "description": "颜色变化。"
+        },
+        {
+          "name": "change",
+          "payload": "string",
+          "description": "颜色变化（同 `update:modelValue`）。"
+        },
+        {
+          "name": "clear",
+          "payload": "—",
+          "description": "点击清空。"
+        },
+        {
+          "name": "show",
+          "payload": "—",
+          "description": "面板打开。"
+        },
+        {
+          "name": "hide",
+          "payload": "—",
+          "description": "面板关闭。"
+        }
+      ],
+      "slots": [
+        {
+          "name": "—",
+          "description": "暂无自定义插槽。"
+        }
+      ],
+      "methods": [
+        {
+          "name": "open",
+          "description": "打开颜色选择面板。"
+        },
+        {
+          "name": "close",
+          "description": "关闭颜色选择面板。"
+        },
+        {
+          "name": "toggle",
+          "description": "切换颜色选择面板的显示状态。"
+        }
+      ],
+      "examples": [
+        {
+          "id": "引入-1",
+          "section": "引入",
+          "sectionId": "引入",
+          "lang": "ts",
+          "preview": false,
+          "code": "import { MColorPicker } from \"morya-ui\";",
+          "locale": "zh-CN"
+        },
+        {
+          "id": "基础用法-1",
+          "section": "基础用法",
+          "sectionId": "基础用法",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" />\n</template>",
+          "locale": "zh-CN"
+        },
+        {
+          "id": "预设色板-1",
+          "section": "预设色板",
+          "sectionId": "预设色板",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker\n    v-model=\"color\"\n    :presets=\"[\n      { label: 'Recommended', colors: ['#1677ff', '#52c41a', '#faad14', '#f5222d', '#722ed1'] },\n    ]\"\n  />\n</template>",
+          "locale": "zh-CN"
+        },
+        {
+          "id": "显示文本与清空-1",
+          "section": "显示文本与清空",
+          "sectionId": "显示文本与清空",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" show-text clearable />\n</template>",
+          "locale": "zh-CN"
+        },
+        {
+          "id": "渐变色-1",
+          "section": "渐变色",
+          "sectionId": "渐变色",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" gradient />\n</template>",
+          "locale": "zh-CN"
+        },
+        {
+          "id": "渐变值绑定-1",
+          "section": "渐变值绑定",
+          "sectionId": "渐变值绑定",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('linear-gradient(90deg, #1677ff 0%, #ff4d4f 100%)')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" gradient show-text />\n</template>",
+          "locale": "zh-CN"
+        },
+        {
+          "id": "import-1",
+          "section": "Import",
+          "sectionId": "import",
+          "lang": "ts",
+          "preview": false,
+          "code": "import { MColorPicker } from \"morya-ui\";",
+          "locale": "en-US"
+        },
+        {
+          "id": "basic-1",
+          "section": "Basic",
+          "sectionId": "basic",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" />\n</template>",
+          "locale": "en-US"
+        },
+        {
+          "id": "presets-1",
+          "section": "Presets",
+          "sectionId": "presets",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker\n    v-model=\"color\"\n    :presets=\"[\n      { label: 'Recommended', colors: ['#1677ff', '#52c41a', '#faad14', '#f5222d', '#722ed1'] },\n    ]\"\n  />\n</template>",
+          "locale": "en-US"
+        },
+        {
+          "id": "show-text-and-clear-1",
+          "section": "Show text and clear",
+          "sectionId": "show-text-and-clear",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" show-text clearable />\n</template>",
+          "locale": "en-US"
+        },
+        {
+          "id": "gradient-1",
+          "section": "Gradient",
+          "sectionId": "gradient",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#1677ff')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" gradient />\n</template>",
+          "locale": "en-US"
+        },
+        {
+          "id": "gradient-value-binding-1",
+          "section": "Gradient Value Binding",
+          "sectionId": "gradient-value-binding",
+          "lang": "vue",
+          "preview": true,
+          "code": "<script setup lang=\"ts\">\nimport { MColorPicker } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('linear-gradient(90deg, #1677ff 0%, #ff4d4f 100%)')\n</script>\n\n<template>\n  <MColorPicker v-model=\"color\" gradient show-text />\n</template>",
+          "locale": "en-US"
+        }
+      ],
+      "locales": {
+        "zh-CN": {
+          "title": "ColorPicker",
+          "description": "颜色选择器，支持面板取色、透明度与预设色板。",
+          "sections": [
+            {
+              "id": "overview",
+              "title": "",
+              "body": "# ColorPicker\n\n颜色选择器，支持 HSB 面板取色、透明度调节、预设色板与多种格式显示。"
+            },
+            {
+              "id": "何时使用",
+              "title": "何时使用",
+              "body": "- 需要完整的颜色选择体验，而非仅输入 hex。\n- 需要调节透明度（alpha）时。\n- 需要提供预设色板供用户快速选择时。"
+            },
+            {
+              "id": "引入",
+              "title": "引入",
+              "body": "```ts\nimport { MColorPicker } from \"morya-ui\";\n```"
+            },
+            {
+              "id": "基础用法",
+              "title": "基础用法",
+              "body": "```vue preview src=\"./demos/Basic.vue\"\n```"
+            },
+            {
+              "id": "预设色板",
+              "title": "预设色板",
+              "body": "```vue preview src=\"./demos/Presets.vue\"\n```"
+            },
+            {
+              "id": "显示文本与清空",
+              "title": "显示文本与清空",
+              "body": "```vue preview src=\"./demos/ShowText.vue\"\n```"
+            },
+            {
+              "id": "渐变色",
+              "title": "渐变色",
+              "body": "启用 `gradient` 后支持线性/径向渐变编辑，可添加/删除/拖拽色标。\n\n```vue preview src=\"./demos/Gradient.vue\"\n```"
+            },
+            {
+              "id": "渐变值绑定",
+              "title": "渐变值绑定",
+              "body": "```vue preview src=\"./demos/GradientValue.vue\"\n```"
+            },
+            {
+              "id": "props",
+              "title": "Props",
+              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `'#1677ff'` | 当前颜色值（hex）或 CSS 渐变字符串。 |\n| `gradient` | `boolean` | `false` | 启用渐变色模式。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `disabledAlpha` | `boolean` | `false` | 禁用透明度调节。 |\n| `clearable` | `boolean` | `false` | 显示清空按钮。 |\n| `format` | `'hex' \\| 'rgb' \\| 'hsb'` | `'hex'` | 显示格式。 |\n| `presets` | `ColorPickerPreset[]` | — | 预设色板。 |\n| `showText` | `boolean` | `false` | 在触发器中显示颜色文本。 |\n| `size` | `MSizeInput` | — | 尺寸。 |\n| `placement` | `ColorPickerPlacement` | `'bottom-start'` | 弹层位置。 |\n| `teleport` | `boolean` | `true` | 是否 teleport 到 body。 |\n| `appendTo` | `MAppendTo` | `'body'` | 挂载目标。 |\n| `transition` | `MotionPresetId \\| false` | — | 过渡动画。 |\n| `pt` | `FieldPassThrough` | — | DOM 透传。 |"
+            },
+            {
+              "id": "events",
+              "title": "Events",
+              "body": "| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 颜色变化。 |\n| `change` | `string` | 颜色变化（同 `update:modelValue`）。 |\n| `clear` | — | 点击清空。 |\n| `show` | — | 面板打开。 |\n| `hide` | — | 面板关闭。 |"
+            },
+            {
+              "id": "colorpickerpreset",
+              "title": "ColorPickerPreset",
+              "body": "| 参数 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 分组标签。 |\n| `colors` | `string[]` | 颜色数组。 |\n| `defaultOpen` | `boolean` | 默认展开。 |"
+            },
+            {
+              "id": "slots",
+              "title": "Slots",
+              "body": "| 插槽名 | 说明 |\n| --- | --- |\n| — | 暂无自定义插槽。 |"
+            },
+            {
+              "id": "methods",
+              "title": "Methods",
+              "body": "| 方法名 | 说明 |\n| --- | --- |\n| `open` | 打开颜色选择面板。 |\n| `close` | 关闭颜色选择面板。 |\n| `toggle` | 切换颜色选择面板的显示状态。 |"
+            }
+          ],
+          "markdown": "---\ntitle: ColorPicker\ncategory: 02 / FORM\ndescription: 颜色选择器，支持面板取色、透明度与预设色板。\n---\n\n# ColorPicker\n\n颜色选择器，支持 HSB 面板取色、透明度调节、预设色板与多种格式显示。\n\n## 何时使用\n\n- 需要完整的颜色选择体验，而非仅输入 hex。\n- 需要调节透明度（alpha）时。\n- 需要提供预设色板供用户快速选择时。\n\n## 引入\n\n```ts\nimport { MColorPicker } from \"morya-ui\";\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## 预设色板\n\n```vue preview src=\"./demos/Presets.vue\"\n```\n\n## 显示文本与清空\n\n```vue preview src=\"./demos/ShowText.vue\"\n```\n\n## 渐变色\n\n启用 `gradient` 后支持线性/径向渐变编辑，可添加/删除/拖拽色标。\n\n```vue preview src=\"./demos/Gradient.vue\"\n```\n\n## 渐变值绑定\n\n```vue preview src=\"./demos/GradientValue.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `'#1677ff'` | 当前颜色值（hex）或 CSS 渐变字符串。 |\n| `gradient` | `boolean` | `false` | 启用渐变色模式。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `disabledAlpha` | `boolean` | `false` | 禁用透明度调节。 |\n| `clearable` | `boolean` | `false` | 显示清空按钮。 |\n| `format` | `'hex' \\| 'rgb' \\| 'hsb'` | `'hex'` | 显示格式。 |\n| `presets` | `ColorPickerPreset[]` | — | 预设色板。 |\n| `showText` | `boolean` | `false` | 在触发器中显示颜色文本。 |\n| `size` | `MSizeInput` | — | 尺寸。 |\n| `placement` | `ColorPickerPlacement` | `'bottom-start'` | 弹层位置。 |\n| `teleport` | `boolean` | `true` | 是否 teleport 到 body。 |\n| `appendTo` | `MAppendTo` | `'body'` | 挂载目标。 |\n| `transition` | `MotionPresetId \\| false` | — | 过渡动画。 |\n| `pt` | `FieldPassThrough` | — | DOM 透传。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 颜色变化。 |\n| `change` | `string` | 颜色变化（同 `update:modelValue`）。 |\n| `clear` | — | 点击清空。 |\n| `show` | — | 面板打开。 |\n| `hide` | — | 面板关闭。 |\n\n## ColorPickerPreset\n\n| 参数 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 分组标签。 |\n| `colors` | `string[]` | 颜色数组。 |\n| `defaultOpen` | `boolean` | 默认展开。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| — | 暂无自定义插槽。 |\n\n## Methods\n\n| 方法名 | 说明 |\n| --- | --- |\n| `open` | 打开颜色选择面板。 |\n| `close` | 关闭颜色选择面板。 |\n| `toggle` | 切换颜色选择面板的显示状态。 |\n"
+        },
+        "en-US": {
+          "title": "ColorPicker",
+          "description": "Color picker with panel, alpha, and preset swatches.",
+          "sections": [
+            {
+              "id": "overview",
+              "title": "",
+              "body": "# ColorPicker\n\nColor picker with HSB panel, alpha slider, preset swatches, and multiple display formats."
+            },
+            {
+              "id": "when-to-use",
+              "title": "When to use",
+              "body": "- When you need a full color picking experience, not just hex input.\n- When you need alpha channel support.\n- When you want to provide preset color palettes."
+            },
+            {
+              "id": "import",
+              "title": "Import",
+              "body": "```ts\nimport { MColorPicker } from \"morya-ui\";\n```"
+            },
+            {
+              "id": "basic",
+              "title": "Basic",
+              "body": "```vue preview src=\"./demos/Basic.vue\"\n```"
+            },
+            {
+              "id": "presets",
+              "title": "Presets",
+              "body": "```vue preview src=\"./demos/Presets.vue\"\n```"
+            },
+            {
+              "id": "show-text-and-clear",
+              "title": "Show text and clear",
+              "body": "```vue preview src=\"./demos/ShowText.vue\"\n```"
+            },
+            {
+              "id": "gradient",
+              "title": "Gradient",
+              "body": "Enable `gradient` for linear/radial gradient editing with draggable color stops.\n\n```vue preview src=\"./demos/Gradient.vue\"\n```"
+            },
+            {
+              "id": "gradient-value-binding",
+              "title": "Gradient Value Binding",
+              "body": "```vue preview src=\"./demos/GradientValue.vue\"\n```"
+            },
+            {
+              "id": "props",
+              "title": "Props",
+              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `'#1677ff'` | Current color value (hex) or CSS gradient string. |\n| `gradient` | `boolean` | `false` | Enable gradient mode. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `disabledAlpha` | `boolean` | `false` | Disable alpha channel. |\n| `clearable` | `boolean` | `false` | Show clear button. |\n| `format` | `'hex' \\| 'rgb' \\| 'hsb'` | `'hex'` | Display format. |\n| `presets` | `ColorPickerPreset[]` | — | Preset color palettes. |\n| `showText` | `boolean` | `false` | Show color text in trigger. |\n| `size` | `MSizeInput` | — | Size. |\n| `placement` | `ColorPickerPlacement` | `'bottom-start'` | Popup placement. |\n| `teleport` | `boolean` | `true` | Teleport to body. |\n| `appendTo` | `MAppendTo` | `'body'` | Mount target. |\n| `transition` | `MotionPresetId \\| false` | — | Transition. |\n| `pt` | `FieldPassThrough` | — | DOM pass-through. |"
+            },
+            {
+              "id": "events",
+              "title": "Events",
+              "body": "| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Color changed. |\n| `change` | `string` | Color changed. |\n| `clear` | — | Clear clicked. |\n| `show` | — | Panel opened. |\n| `hide` | — | Panel closed. |"
+            },
+            {
+              "id": "colorpickerpreset",
+              "title": "ColorPickerPreset",
+              "body": "| Prop | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Group label. |\n| `colors` | `string[]` | Color array. |\n| `defaultOpen` | `boolean` | Default expanded. |"
+            },
+            {
+              "id": "slots",
+              "title": "Slots",
+              "body": "| Name | Description |\n| --- | --- |\n| — | No custom slots yet. |"
+            },
+            {
+              "id": "methods",
+              "title": "Methods",
+              "body": "| Method | Description |\n| --- | --- |\n| `open` | Open the color picker panel. |\n| `close` | Close the color picker panel. |\n| `toggle` | Toggle the color picker panel visibility. |"
+            }
+          ],
+          "markdown": "---\ntitle: ColorPicker\ncategory: 02 / FORM\ndescription: Color picker with panel, alpha, and preset swatches.\n---\n\n# ColorPicker\n\nColor picker with HSB panel, alpha slider, preset swatches, and multiple display formats.\n\n## When to use\n\n- When you need a full color picking experience, not just hex input.\n- When you need alpha channel support.\n- When you want to provide preset color palettes.\n\n## Import\n\n```ts\nimport { MColorPicker } from \"morya-ui\";\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Presets\n\n```vue preview src=\"./demos/Presets.vue\"\n```\n\n## Show text and clear\n\n```vue preview src=\"./demos/ShowText.vue\"\n```\n\n## Gradient\n\nEnable `gradient` for linear/radial gradient editing with draggable color stops.\n\n```vue preview src=\"./demos/Gradient.vue\"\n```\n\n## Gradient Value Binding\n\n```vue preview src=\"./demos/GradientValue.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `'#1677ff'` | Current color value (hex) or CSS gradient string. |\n| `gradient` | `boolean` | `false` | Enable gradient mode. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `disabledAlpha` | `boolean` | `false` | Disable alpha channel. |\n| `clearable` | `boolean` | `false` | Show clear button. |\n| `format` | `'hex' \\| 'rgb' \\| 'hsb'` | `'hex'` | Display format. |\n| `presets` | `ColorPickerPreset[]` | — | Preset color palettes. |\n| `showText` | `boolean` | `false` | Show color text in trigger. |\n| `size` | `MSizeInput` | — | Size. |\n| `placement` | `ColorPickerPlacement` | `'bottom-start'` | Popup placement. |\n| `teleport` | `boolean` | `true` | Teleport to body. |\n| `appendTo` | `MAppendTo` | `'body'` | Mount target. |\n| `transition` | `MotionPresetId \\| false` | — | Transition. |\n| `pt` | `FieldPassThrough` | — | DOM pass-through. |\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Color changed. |\n| `change` | `string` | Color changed. |\n| `clear` | — | Clear clicked. |\n| `show` | — | Panel opened. |\n| `hide` | — | Panel closed. |\n\n## ColorPickerPreset\n\n| Prop | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Group label. |\n| `colors` | `string[]` | Color array. |\n| `defaultOpen` | `boolean` | Default expanded. |\n\n## Slots\n\n| Name | Description |\n| --- | --- |\n| — | No custom slots yet. |\n\n## Methods\n\n| Method | Description |\n| --- | --- |\n| `open` | Open the color picker panel. |\n| `close` | Close the color picker panel. |\n| `toggle` | Toggle the color picker panel visibility. |\n"
+        }
+      }
+    },
     {
       "id": "CommandMenu",
       "name": "CommandMenu",
@@ -4554,7 +4967,7 @@
             {
               "id": "命令项结构",
               "title": "命令项结构",
-              "body": "`CommandMenuItem` 字段：\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案，参与本地过滤。 |\n| `icon` | `string` | 可选前缀字符（非 MIcon 名）。 |\n| `shortcut` | `string` | 可选快捷键展示。 |\n| `command` | `() => void` | 选中后执行；执行完自动关闭面板。 |\n| `disabled` | `boolean` | 禁用项不可激活。 |"
+              "body": "`CommandMenuItem` 字段：\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案，参与本地过滤。 |\n| `icon` | `string \\| Component` | 内置图标名、别名，或自定义 Vue 图标组件。 |\n| `shortcut` | `string` | 可选快捷键展示。 |\n| `command` | `() => void` | 选中后执行；执行完自动关闭面板。 |\n| `disabled` | `boolean` | 禁用项不可激活。 |"
             },
             {
               "id": "键盘",
@@ -4587,7 +5000,7 @@
               "body": "<h4 id=\"CommandMenuItem\">CommandMenuItem</h4>\n\n完整定义见源码 `types.ts`。\n\n```ts\ninterface CommandMenuItem extends Omit<MenuNodeBase, 'label'> {\n  label: string\n}\n```"
             }
           ],
-          "markdown": "---\ntitle: CommandMenu\ncategory: 04 / NAVIGATION\ndescription: 可搜索的命令面板对话框。\n---\n\n# CommandMenu\n\n命令面板：搜索并执行 `model` 中的命令。适合全局快捷键（如 Cmd/Ctrl+K）场景。\n\n## 引入\n\n```ts\nimport type {CommandMenuItem} from 'morya-ui';\nimport {  MCommandMenu } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/BasicUsage.zh.vue\"\n```\n\n## 命令项结构\n\n`CommandMenuItem` 字段：\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案，参与本地过滤。 |\n| `icon` | `string` | 可选前缀字符（非 MIcon 名）。 |\n| `shortcut` | `string` | 可选快捷键展示。 |\n| `command` | `() => void` | 选中后执行；执行完自动关闭面板。 |\n| `disabled` | `boolean` | 禁用项不可激活。 |\n\n## 键盘\n\n面板打开时：\n\n| 按键 | 行为 |\n| --- | --- |\n| `↑` / `↓` | 移动高亮项 |\n| `Enter` | 激活当前项 |\n| `Escape` | 关闭面板 |\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `model` | `CommandMenuItem[]` | `[]` | 命令列表。 |\n| `modelValue` | `boolean` | `false` | 是否可见（`v-model`）。 |\n| `placeholder` | `string` | 语言包 `searchCommands` | 搜索框占位。 |\n| `teleport` | `boolean` | `true` | 浮层 Teleport；默认挂到 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | 挂载目标；`'self'` / `false` 就地渲染。 |\n| `transition` | `string \\| false` | `'fade'` | 进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | 可见性变化。 |\n\n## 无障碍\n\n- 面板为 `role=\"dialog\"`、`aria-modal=\"true\"`。\n- 打开后焦点落在搜索框；请为触发按钮提供可访问名称。\n\n## Slots\n\n无插槽。\n\n## 类型\n\n<h4 id=\"CommandMenuItem\">CommandMenuItem</h4>\n\n完整定义见源码 `types.ts`。\n\n```ts\ninterface CommandMenuItem extends Omit<MenuNodeBase, 'label'> {\n  label: string\n}\n```\n"
+          "markdown": "---\ntitle: CommandMenu\ncategory: 04 / NAVIGATION\ndescription: 可搜索的命令面板对话框。\n---\n\n# CommandMenu\n\n命令面板：搜索并执行 `model` 中的命令。适合全局快捷键（如 Cmd/Ctrl+K）场景。\n\n## 引入\n\n```ts\nimport type {CommandMenuItem} from 'morya-ui';\nimport {  MCommandMenu } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/BasicUsage.zh.vue\"\n```\n\n## 命令项结构\n\n`CommandMenuItem` 字段：\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案，参与本地过滤。 |\n| `icon` | `string \\| Component` | 内置图标名、别名，或自定义 Vue 图标组件。 |\n| `shortcut` | `string` | 可选快捷键展示。 |\n| `command` | `() => void` | 选中后执行；执行完自动关闭面板。 |\n| `disabled` | `boolean` | 禁用项不可激活。 |\n\n## 键盘\n\n面板打开时：\n\n| 按键 | 行为 |\n| --- | --- |\n| `↑` / `↓` | 移动高亮项 |\n| `Enter` | 激活当前项 |\n| `Escape` | 关闭面板 |\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `model` | `CommandMenuItem[]` | `[]` | 命令列表。 |\n| `modelValue` | `boolean` | `false` | 是否可见（`v-model`）。 |\n| `placeholder` | `string` | 语言包 `searchCommands` | 搜索框占位。 |\n| `teleport` | `boolean` | `true` | 浮层 Teleport；默认挂到 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | 挂载目标；`'self'` / `false` 就地渲染。 |\n| `transition` | `string \\| false` | `'fade'` | 进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | 可见性变化。 |\n\n## 无障碍\n\n- 面板为 `role=\"dialog\"`、`aria-modal=\"true\"`。\n- 打开后焦点落在搜索框；请为触发按钮提供可访问名称。\n\n## Slots\n\n无插槽。\n\n## 类型\n\n<h4 id=\"CommandMenuItem\">CommandMenuItem</h4>\n\n完整定义见源码 `types.ts`。\n\n```ts\ninterface CommandMenuItem extends Omit<MenuNodeBase, 'label'> {\n  label: string\n}\n```\n"
         },
         "en-US": {
           "title": "CommandMenu",
@@ -4611,7 +5024,7 @@
             {
               "id": "command-item-shape",
               "title": "Command item shape",
-              "body": "`CommandMenuItem` fields:\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text; included in local filtering. |\n| `icon` | `string` | Optional leading character (not a MIcon name). |\n| `shortcut` | `string` | Optional shortcut hint. |\n| `command` | `() => void` | Runs on activate; closes the palette afterward. |\n| `disabled` | `boolean` | Disabled items cannot be activated. |"
+              "body": "`CommandMenuItem` fields:\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text; included in local filtering. |\n| `icon` | `string \\| Component` | Built-in icon name, alias, or custom Vue icon component. |\n| `shortcut` | `string` | Optional shortcut hint. |\n| `command` | `() => void` | Runs on activate; closes the palette afterward. |\n| `disabled` | `boolean` | Disabled items cannot be activated. |"
             },
             {
               "id": "keyboard",
@@ -4644,7 +5057,7 @@
               "body": "<h4 id=\"CommandMenuItem\">CommandMenuItem</h4>\n\nSee source `types.ts` for the full definition.\n\n```ts\ninterface CommandMenuItem extends Omit<MenuNodeBase, 'label'> {\n  label: string\n}\n```"
             }
           ],
-          "markdown": "---\ntitle: CommandMenu\ncategory: 04 / NAVIGATION\ndescription: Searchable command palette dialog.\n---\n\n# CommandMenu\n\nSearchable command palette for running actions from `model`. Fits global shortcuts such as Cmd/Ctrl+K.\n\n## Import\n\n```ts\nimport type {CommandMenuItem} from 'morya-ui';\nimport {  MCommandMenu } from 'morya-ui'\n```\n\n## Basic usage\n\n```vue preview src=\"./demos/BasicUsage.en.vue\"\n```\n\n## Command item shape\n\n`CommandMenuItem` fields:\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text; included in local filtering. |\n| `icon` | `string` | Optional leading character (not a MIcon name). |\n| `shortcut` | `string` | Optional shortcut hint. |\n| `command` | `() => void` | Runs on activate; closes the palette afterward. |\n| `disabled` | `boolean` | Disabled items cannot be activated. |\n\n## Keyboard\n\nWhen open:\n\n| Key | Action |\n| --- | --- |\n| `↑` / `↓` | Move highlight |\n| `Enter` | Activate highlighted item |\n| `Escape` | Close palette |\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `model` | `CommandMenuItem[]` | `[]` | Command list. |\n| `modelValue` | `boolean` | `false` | Visibility (`v-model`). |\n| `placeholder` | `string` | locale `searchCommands` | Search input placeholder. |\n| `teleport` | `boolean` | `true` | Overlay Teleport; defaults to `body`. |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Mount target; `'self'` / `false` renders in place. |\n| `transition` | `string \\| false` | `'fade'` | Enter/exit motion preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | Visibility change. |\n\n## Accessibility\n\n- Panel uses `role=\"dialog\"` and `aria-modal=\"true\"`.\n- Focus moves to the search field on open; label the trigger control.\n\n## Slots\n\nNo slots.\n\n## Types\n\n<h4 id=\"CommandMenuItem\">CommandMenuItem</h4>\n\nSee source `types.ts` for the full definition.\n\n```ts\ninterface CommandMenuItem extends Omit<MenuNodeBase, 'label'> {\n  label: string\n}\n```\n"
+          "markdown": "---\ntitle: CommandMenu\ncategory: 04 / NAVIGATION\ndescription: Searchable command palette dialog.\n---\n\n# CommandMenu\n\nSearchable command palette for running actions from `model`. Fits global shortcuts such as Cmd/Ctrl+K.\n\n## Import\n\n```ts\nimport type {CommandMenuItem} from 'morya-ui';\nimport {  MCommandMenu } from 'morya-ui'\n```\n\n## Basic usage\n\n```vue preview src=\"./demos/BasicUsage.en.vue\"\n```\n\n## Command item shape\n\n`CommandMenuItem` fields:\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text; included in local filtering. |\n| `icon` | `string \\| Component` | Built-in icon name, alias, or custom Vue icon component. |\n| `shortcut` | `string` | Optional shortcut hint. |\n| `command` | `() => void` | Runs on activate; closes the palette afterward. |\n| `disabled` | `boolean` | Disabled items cannot be activated. |\n\n## Keyboard\n\nWhen open:\n\n| Key | Action |\n| --- | --- |\n| `↑` / `↓` | Move highlight |\n| `Enter` | Activate highlighted item |\n| `Escape` | Close palette |\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `model` | `CommandMenuItem[]` | `[]` | Command list. |\n| `modelValue` | `boolean` | `false` | Visibility (`v-model`). |\n| `placeholder` | `string` | locale `searchCommands` | Search input placeholder. |\n| `teleport` | `boolean` | `true` | Overlay Teleport; defaults to `body`. |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Mount target; `'self'` / `false` renders in place. |\n| `transition` | `string \\| false` | `'fade'` | Enter/exit motion preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | Visibility change. |\n\n## Accessibility\n\n- Panel uses `role=\"dialog\"` and `aria-modal=\"true\"`.\n- Focus moves to the search field on open; label the trigger control.\n\n## Slots\n\nNo slots.\n\n## Types\n\n<h4 id=\"CommandMenuItem\">CommandMenuItem</h4>\n\nSee source `types.ts` for the full definition.\n\n```ts\ninterface CommandMenuItem extends Omit<MenuNodeBase, 'label'> {\n  label: string\n}\n```\n"
         }
       }
     },
@@ -12548,12 +12961,6 @@
           "default": "false",
           "description": "显示清除按钮。"
         },
-        {
-          "name": "allowClear",
-          "type": "boolean",
-          "default": "—",
-          "description": "`clearable` 的别名。"
-        },
         {
           "name": "maxlength",
           "type": "number",
@@ -12986,7 +13393,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。与 `invalid` 并存时以错误优先。 |\n| `id` | `string` | — | 原生 id；未传时自动生成。 |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | 原生 type。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；默认中等。可继承外层 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `allowClear` | `boolean` | — | `clearable` 的别名。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | DOM 分段透传，见上文 `pt`。 |"
+              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。与 `invalid` 并存时以错误优先。 |\n| `id` | `string` | — | 原生 id；未传时自动生成。 |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | 原生 type。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；默认中等。可继承外层 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | DOM 分段透传，见上文 `pt`。 |"
             },
             {
               "id": "slots",
@@ -13009,7 +13416,7 @@
               "body": "<h4 id=\"InputPassThrough\">InputPassThrough</h4>\n\n`pt` 的类型。在 [FieldPassThrough](/docs/types#FieldPassThrough) 基础上多了前后缀等键：\n\n```ts\ntype InputPassThrough = FieldPassThrough & {\n  prefix?: PassThroughPart\n  suffix?: PassThroughPart\n  help?: PassThroughPart\n  count?: PassThroughPart\n}\n```\n\n`PassThroughPart` 见 [API 类型 · PassThroughPart](/docs/types#PassThroughPart)。"
             }
           ],
-          "markdown": "---\ntitle: Input\ncategory: 02 / FORM\ndescription: 文本输入框。\n---\n\n# Input\n\n单行文本输入。\n\n## 引入\n\n```ts\nimport { MInput } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Invalid\n\n`invalid` 表示校验失败；也可只传 `error-message`。\n\n```vue preview src=\"./demos/Invalid.vue\"\n```\n\n## Clearable\n\n```vue preview src=\"./demos/Clearable.vue\"\n```\n\n## Prefix / Suffix\n\n```vue preview src=\"./demos/PrefixSuffix.zh.vue\"\n```\n\n## Password-like type\n\n```vue preview src=\"./demos/PasswordLikeType.vue\"\n```\n\n## Sizes\n\n支持 `small` / `large`，并兼容 `sm` / `md` / `lg`。\n\n```vue preview src=\"./demos/Sizes.vue\"\n```\n\n## Count\n\n`showCount` 显示字数；配合 `maxlength` 展示上限。\n\n```vue preview src=\"./demos/Count.vue\"\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n```\n\n## 外层 attrs 与布局\n\n除 `@keydown`、`@focus` 等**控件事件**外，其余 fallthrough attrs（`class`、`style`、`data-*`、`title`、`tabindex` 等）均落在 field 外层（`.m-input-field`），不会直接写到 `<input>`。栅格、间距、测试 id 这样写即可：\n\n```vue preview src=\"./demos/OuterAttrsAndLayout.zh.vue\"\n```\n\n更多约定见 [样式与 attrs](/docs/attrs)。\n\n## 键盘与焦点事件\n\n`@keydown`、`@focus`、`@blur` 等绑在底层 input 上，用法与原生 input 相同：\n\n```vue preview src=\"./demos/KeyboardAndFocusEvents.zh.vue\"\n```\n\n## pt\n\n按 DOM 分段透传。常用键：`root`、`input`、`label`、`prefix`、`suffix`、`help`、`count`。\n\n```vue preview src=\"./demos/Pt.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。与 `invalid` 并存时以错误优先。 |\n| `id` | `string` | — | 原生 id；未传时自动生成。 |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | 原生 type。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；默认中等。可继承外层 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `allowClear` | `boolean` | — | `clearable` 的别名。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | DOM 分段透传，见上文 `pt`。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| `prefix` | 输入框左侧装饰（如单位、图标）。 |\n| `suffix` | 输入框右侧装饰；与清除按钮可并存。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 值变化。 |\n| `clear` | — | 点击清除时触发。 |\n| `blur` | — | — |\n| `change` | — | — |\n| `focus` | — | — |\n\n## Instance\n\n| 方法 | 说明 |\n| --- | --- |\n| `focus()` | 聚焦底层 input。 |\n| `blur()` | 使底层 input 失焦。 |\n| `select()` | 选中底层 input 的全部文本。 |\n\n## 类型\n\n<h4 id=\"InputPassThrough\">InputPassThrough</h4>\n\n`pt` 的类型。在 [FieldPassThrough](/docs/types#FieldPassThrough) 基础上多了前后缀等键：\n\n```ts\ntype InputPassThrough = FieldPassThrough & {\n  prefix?: PassThroughPart\n  suffix?: PassThroughPart\n  help?: PassThroughPart\n  count?: PassThroughPart\n}\n```\n\n`PassThroughPart` 见 [API 类型 · PassThroughPart](/docs/types#PassThroughPart)。\n"
+          "markdown": "---\ntitle: Input\ncategory: 02 / FORM\ndescription: 文本输入框。\n---\n\n# Input\n\n单行文本输入。\n\n## 引入\n\n```ts\nimport { MInput } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Invalid\n\n`invalid` 表示校验失败；也可只传 `error-message`。\n\n```vue preview src=\"./demos/Invalid.vue\"\n```\n\n## Clearable\n\n```vue preview src=\"./demos/Clearable.vue\"\n```\n\n## Prefix / Suffix\n\n```vue preview src=\"./demos/PrefixSuffix.zh.vue\"\n```\n\n## Password-like type\n\n```vue preview src=\"./demos/PasswordLikeType.vue\"\n```\n\n## Sizes\n\n支持 `small` / `large`，并兼容 `sm` / `md` / `lg`。\n\n```vue preview src=\"./demos/Sizes.vue\"\n```\n\n## Count\n\n`showCount` 显示字数；配合 `maxlength` 展示上限。\n\n```vue preview src=\"./demos/Count.vue\"\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n```\n\n## 外层 attrs 与布局\n\n除 `@keydown`、`@focus` 等**控件事件**外，其余 fallthrough attrs（`class`、`style`、`data-*`、`title`、`tabindex` 等）均落在 field 外层（`.m-input-field`），不会直接写到 `<input>`。栅格、间距、测试 id 这样写即可：\n\n```vue preview src=\"./demos/OuterAttrsAndLayout.zh.vue\"\n```\n\n更多约定见 [样式与 attrs](/docs/attrs)。\n\n## 键盘与焦点事件\n\n`@keydown`、`@focus`、`@blur` 等绑在底层 input 上，用法与原生 input 相同：\n\n```vue preview src=\"./demos/KeyboardAndFocusEvents.zh.vue\"\n```\n\n## pt\n\n按 DOM 分段透传。常用键：`root`、`input`、`label`、`prefix`、`suffix`、`help`、`count`。\n\n```vue preview src=\"./demos/Pt.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。与 `invalid` 并存时以错误优先。 |\n| `id` | `string` | — | 原生 id；未传时自动生成。 |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | 原生 type。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；默认中等。可继承外层 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | DOM 分段透传，见上文 `pt`。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| `prefix` | 输入框左侧装饰（如单位、图标）。 |\n| `suffix` | 输入框右侧装饰；与清除按钮可并存。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 值变化。 |\n| `clear` | — | 点击清除时触发。 |\n| `blur` | — | — |\n| `change` | — | — |\n| `focus` | — | — |\n\n## Instance\n\n| 方法 | 说明 |\n| --- | --- |\n| `focus()` | 聚焦底层 input。 |\n| `blur()` | 使底层 input 失焦。 |\n| `select()` | 选中底层 input 的全部文本。 |\n\n## 类型\n\n<h4 id=\"InputPassThrough\">InputPassThrough</h4>\n\n`pt` 的类型。在 [FieldPassThrough](/docs/types#FieldPassThrough) 基础上多了前后缀等键：\n\n```ts\ntype InputPassThrough = FieldPassThrough & {\n  prefix?: PassThroughPart\n  suffix?: PassThroughPart\n  help?: PassThroughPart\n  count?: PassThroughPart\n}\n```\n\n`PassThroughPart` 见 [API 类型 · PassThroughPart](/docs/types#PassThroughPart)。\n"
         },
         "en-US": {
           "title": "Input",
@@ -13088,7 +13495,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. Error wins over warning. |\n| `id` | `string` | — | Native id; auto-generated when omitted. |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | Native type. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; medium by default. Inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Style variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show clear button. |\n| `allowClear` | `boolean` | — | Alias of `clearable` . |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | Pass-through per DOM part; see **pt** above. |"
+              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. Error wins over warning. |\n| `id` | `string` | — | Native id; auto-generated when omitted. |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | Native type. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; medium by default. Inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Style variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show clear button. |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | Pass-through per DOM part; see **pt** above. |"
             },
             {
               "id": "slots",
@@ -13111,242 +13518,7 @@
               "body": "<h4 id=\"InputPassThrough\">InputPassThrough</h4>\n\nType of `pt`. Extends [FieldPassThrough](/docs/types#FieldPassThrough) with affix parts:\n\n```ts\ntype InputPassThrough = FieldPassThrough & {\n  prefix?: PassThroughPart\n  suffix?: PassThroughPart\n  help?: PassThroughPart\n  count?: PassThroughPart\n}\n```\n\nSee [PassThroughPart](/docs/types#PassThroughPart) in API types."
             }
           ],
-          "markdown": "---\ntitle: Input\ncategory: 02 / FORM\ndescription: Text input field.\n---\n\n# Input\n\nSingle-line text input.\n\n## Import\n\n```ts\nimport { MInput } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Invalid\n\nUse `invalid` for validation failure, or rely on `error-message` alone.\n\n```vue preview src=\"./demos/Invalid.vue\"\n```\n\n## Clearable\n\n```vue preview src=\"./demos/Clearable.vue\"\n```\n\n## Prefix / Suffix\n\n```vue preview src=\"./demos/PrefixSuffix.en.vue\"\n```\n\n## Password-like type\n\n```vue preview src=\"./demos/PasswordLikeType.vue\"\n```\n\n## Sizes\n\nSupports `small` / `large`, and also `sm` / `md` / `lg`.\n\n```vue preview src=\"./demos/Sizes.vue\"\n```\n\n## Count\n\n`showCount` shows the character count; pair with `maxlength` for an upper bound.\n\n```vue preview src=\"./demos/Count.vue\"\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n```\n\n## Outer attrs & layout\n\nAll fallthrough attrs except **control events** (`@keydown`, `@focus`, …) bind to the field wrapper (`.m-input-field`), not the raw `<input>`—including `class`, `style`, `data-*`, `title`, `tabindex`, and undeclared attrs:\n\n```vue preview src=\"./demos/OuterAttrsAndLayout.en.vue\"\n```\n\nSee [Styling & attrs](/docs/attrs) for library-wide rules.\n\n## Keyboard & focus events\n\n`@keydown`, `@focus`, `@blur`, and similar listeners attach to the underlying input:\n\n```vue preview src=\"./demos/KeyboardAndFocusEvents.en.vue\"\n```\n\n## pt\n\nPass-through per DOM part. Common keys: `root`, `input`, `label`, `prefix`, `suffix`, `help`, `count`.\n\n```vue preview src=\"./demos/Pt.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. Error wins over warning. |\n| `id` | `string` | — | Native id; auto-generated when omitted. |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | Native type. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; medium by default. Inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Style variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show clear button. |\n| `allowClear` | `boolean` | — | Alias of `clearable` . |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | Pass-through per DOM part; see **pt** above. |\n\n## Slots\n\n| Slot | Description |\n| --- | --- |\n| `prefix` | Left adornment (unit, icon, and so on). |\n| `suffix` | Right adornment; can coexist with the clear button. |\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Value changed. |\n| `clear` | — | Fired when clear is clicked. |\n\n## Instance\n\n| Method | Description |\n| --- | --- |\n| `focus()` | Focus the underlying input. |\n| `blur()` | Blur the underlying input. |\n| `select()` | Select all text in the input. |\n\n## Types\n\n<h4 id=\"InputPassThrough\">InputPassThrough</h4>\n\nType of `pt`. Extends [FieldPassThrough](/docs/types#FieldPassThrough) with affix parts:\n\n```ts\ntype InputPassThrough = FieldPassThrough & {\n  prefix?: PassThroughPart\n  suffix?: PassThroughPart\n  help?: PassThroughPart\n  count?: PassThroughPart\n}\n```\n\nSee [PassThroughPart](/docs/types#PassThroughPart) in API types.\n"
-        }
-      }
-    },
-    {
-      "id": "InputColor",
-      "name": "InputColor",
-      "exportName": "MInputColor",
-      "category": "02 / FORM",
-      "description": "颜色选择，支持色板与十六进制文本。",
-      "descriptionEn": "Color picker with a palette and hexadecimal text input.",
-      "import": "import { MInputColor } from 'morya-ui'",
-      "props": [
-        {
-          "name": "modelValue",
-          "type": "string",
-          "default": "'#000000'",
-          "description": "十六进制颜色。"
-        },
-        {
-          "name": "swatches",
-          "type": "string[]",
-          "default": "—",
-          "description": "快捷色板。"
-        },
-        {
-          "name": "disabled",
-          "type": "boolean",
-          "default": "false",
-          "description": "禁用。"
-        },
-        {
-          "name": "id",
-          "type": "string",
-          "default": "—",
-          "description": "色板 input id。"
-        },
-        {
-          "name": "invalid",
-          "type": "boolean",
-          "default": "—",
-          "description": "—"
-        },
-        {
-          "name": "label",
-          "type": "string",
-          "default": "—",
-          "description": "—"
-        },
-        {
-          "name": "size",
-          "type": "[MSizeInput](/docs/types#MSizeInput)",
-          "default": "—",
-          "description": "—"
-        },
-        {
-          "name": "pt",
-          "type": "[FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }",
-          "default": "—",
-          "description": "DOM 透传，见 [样式与 attrs](/docs/attrs)."
-        }
-      ],
-      "events": [
-        {
-          "name": "update:modelValue",
-          "payload": "string",
-          "description": "颜色变化。"
-        }
-      ],
-      "slots": [
-        {
-          "name": "trigger",
-          "description": "自定义颜色触发器。"
-        }
-      ],
-      "methods": [],
-      "examples": [
-        {
-          "id": "引入-1",
-          "section": "引入",
-          "sectionId": "引入",
-          "lang": "ts",
-          "preview": false,
-          "code": "import { MInputColor } from \"morya-ui\";",
-          "locale": "zh-CN"
-        },
-        {
-          "id": "基础用法-1",
-          "section": "基础用法",
-          "sectionId": "基础用法",
-          "lang": "vue",
-          "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MInputColor } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#2563eb')\n</script>\n\n<template>\n  <MInputColor v-model=\"color\" />\n</template>",
-          "locale": "zh-CN"
-        },
-        {
-          "id": "swatches-1",
-          "section": "Swatches",
-          "sectionId": "swatches",
-          "lang": "vue",
-          "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MInputColor } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#2563eb')\n</script>\n\n<template>\n  <MInputColor v-model=\"color\" :swatches=\"['#2563eb', '#16a34a', '#dc2626']\" />\n</template>",
-          "locale": "zh-CN"
-        },
-        {
-          "id": "import-1",
-          "section": "Import",
-          "sectionId": "import",
-          "lang": "ts",
-          "preview": false,
-          "code": "import { MInputColor } from \"morya-ui\";",
-          "locale": "en-US"
-        },
-        {
-          "id": "basic-1",
-          "section": "Basic",
-          "sectionId": "basic",
-          "lang": "vue",
-          "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MInputColor } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#2563eb')\n</script>\n\n<template>\n  <MInputColor v-model=\"color\" />\n</template>",
-          "locale": "en-US"
-        },
-        {
-          "id": "swatches-1",
-          "section": "Swatches",
-          "sectionId": "swatches",
-          "lang": "vue",
-          "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MInputColor } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst color = ref('#2563eb')\n</script>\n\n<template>\n  <MInputColor v-model=\"color\" :swatches=\"['#2563eb', '#16a34a', '#dc2626']\" />\n</template>",
-          "locale": "en-US"
-        }
-      ],
-      "locales": {
-        "zh-CN": {
-          "title": "InputColor",
-          "description": "颜色选择，支持色板与十六进制文本。",
-          "sections": [
-            {
-              "id": "overview",
-              "title": "",
-              "body": "# InputColor\n\n通过原生色板与文本框编辑 hex 颜色。"
-            },
-            {
-              "id": "何时使用",
-              "title": "何时使用",
-              "body": "- 表单需要选择或输入十六进制颜色时。\n- 需要预设色块（`swatches`）即可，不需要完整独立取色面板。"
-            },
-            {
-              "id": "引入",
-              "title": "引入",
-              "body": "```ts\nimport { MInputColor } from \"morya-ui\";\n```"
-            },
-            {
-              "id": "基础用法",
-              "title": "基础用法",
-              "body": "```vue preview src=\"./demos/Basic.vue\"\n```"
-            },
-            {
-              "id": "swatches",
-              "title": "Swatches",
-              "body": "`swatches` 提供快捷色板。\n\n```vue preview src=\"./demos/Swatches.vue\"\n```"
-            },
-            {
-              "id": "props",
-              "title": "Props",
-              "body": "| 参数         | 类型                                                                                   | 默认值      | 说明                                      |\n| ------------ | -------------------------------------------------------------------------------------- | ----------- | ----------------------------------------- |\n| `modelValue` | `string`                                                                               | `'#000000'` | 十六进制颜色。                            |\n| `swatches`   | `string[]`                                                                             | —           | 快捷色板。                                |\n| `disabled`   | `boolean`                                                                              | `false`     | 禁用。                                    |\n| `id`         | `string`                                                                               | —           | 色板 input id。                           |\n| `invalid`    | `boolean`                                                                              | —           | —                                         |\n| `label`      | `string`                                                                               | —           | —                                         |\n| `size`       | [MSizeInput](/docs/types#MSizeInput)                                                   | —           | —                                         |\n| `pt`         | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | —           | DOM 透传，见 [样式与 attrs](/docs/attrs). |"
-            },
-            {
-              "id": "events",
-              "title": "Events",
-              "body": "| 事件名              | 参数     | 说明       |\n| ------------------- | -------- | ---------- |\n| `update:modelValue` | `string` | 颜色变化。 |"
-            },
-            {
-              "id": "功能边界",
-              "title": "功能边界",
-              "body": "选色实现是**原生色板 + hex 文本 + 可选 swatches**，不是完整的面板级取色体验。"
-            },
-            {
-              "id": "slots",
-              "title": "Slots",
-              "body": "| 插槽名    | 说明               |\n| --------- | ------------------ |\n| `trigger` | 自定义颜色触发器。 |"
-            }
-          ],
-          "markdown": "---\ntitle: InputColor\ncategory: 02 / FORM\ndescription: 颜色选择，支持色板与十六进制文本。\n---\n\n# InputColor\n\n通过原生色板与文本框编辑 hex 颜色。\n\n## 何时使用\n\n- 表单需要选择或输入十六进制颜色时。\n- 需要预设色块（`swatches`）即可，不需要完整独立取色面板。\n\n## 引入\n\n```ts\nimport { MInputColor } from \"morya-ui\";\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Swatches\n\n`swatches` 提供快捷色板。\n\n```vue preview src=\"./demos/Swatches.vue\"\n```\n\n## Props\n\n| 参数         | 类型                                                                                   | 默认值      | 说明                                      |\n| ------------ | -------------------------------------------------------------------------------------- | ----------- | ----------------------------------------- |\n| `modelValue` | `string`                                                                               | `'#000000'` | 十六进制颜色。                            |\n| `swatches`   | `string[]`                                                                             | —           | 快捷色板。                                |\n| `disabled`   | `boolean`                                                                              | `false`     | 禁用。                                    |\n| `id`         | `string`                                                                               | —           | 色板 input id。                           |\n| `invalid`    | `boolean`                                                                              | —           | —                                         |\n| `label`      | `string`                                                                               | —           | —                                         |\n| `size`       | [MSizeInput](/docs/types#MSizeInput)                                                   | —           | —                                         |\n| `pt`         | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | —           | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n## Events\n\n| 事件名              | 参数     | 说明       |\n| ------------------- | -------- | ---------- |\n| `update:modelValue` | `string` | 颜色变化。 |\n\n## 功能边界\n\n选色实现是**原生色板 + hex 文本 + 可选 swatches**，不是完整的面板级取色体验。\n\n## Slots\n\n| 插槽名    | 说明               |\n| --------- | ------------------ |\n| `trigger` | 自定义颜色触发器。 |\n"
-        },
-        "en-US": {
-          "title": "InputColor",
-          "description": "Color picker with a palette and hexadecimal text input.",
-          "sections": [
-            {
-              "id": "overview",
-              "title": "",
-              "body": "# InputColor\n\nEdit hex colors with the native color picker and a text field."
-            },
-            {
-              "id": "when-to-use",
-              "title": "When to use",
-              "body": "- Use when a form needs a hex color value.\n- Prefer this when native picker + optional `swatches` is enough; not a full standalone color panel."
-            },
-            {
-              "id": "import",
-              "title": "Import",
-              "body": "```ts\nimport { MInputColor } from \"morya-ui\";\n```"
-            },
-            {
-              "id": "basic",
-              "title": "Basic",
-              "body": "```vue preview src=\"./demos/Basic.vue\"\n```"
-            },
-            {
-              "id": "swatches",
-              "title": "Swatches",
-              "body": "`swatches` provides a row of preset colors.\n\n```vue preview src=\"./demos/Swatches.vue\"\n```"
-            },
-            {
-              "id": "props",
-              "title": "Props",
-              "body": "| Prop         | Type                                                                                   | Default     | Description                                       |\n| ------------ | -------------------------------------------------------------------------------------- | ----------- | ------------------------------------------------- |\n| `modelValue` | `string`                                                                               | `'#000000'` | Hexadecimal color.                                |\n| `swatches`   | `string[]`                                                                             | —           | Preset color chips.                               |\n| `disabled`   | `boolean`                                                                              | `false`     | Disabled.                                         |\n| `id`         | `string`                                                                               | —           | Color input id.                                   |\n| `pt`         | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | —           | Pass-through; see [Styling & attrs](/docs/attrs). |"
-            },
-            {
-              "id": "events",
-              "title": "Events",
-              "body": "| Event               | Prop     | Description    |\n| ------------------- | -------- | -------------- |\n| `update:modelValue` | `string` | Color changed. |"
-            },
-            {
-              "id": "boundaries",
-              "title": "Boundaries",
-              "body": "A **native picker + hex text + optional swatches**, not a full panel-level color experience."
-            },
-            {
-              "id": "slots",
-              "title": "Slots",
-              "body": "| Slot      | Description           |\n| --------- | --------------------- |\n| `trigger` | Custom color trigger. |"
-            }
-          ],
-          "markdown": "---\ntitle: InputColor\ncategory: 02 / FORM\ndescription: Color picker with a palette and hexadecimal text input.\n---\n\n# InputColor\n\nEdit hex colors with the native color picker and a text field.\n\n## When to use\n\n- Use when a form needs a hex color value.\n- Prefer this when native picker + optional `swatches` is enough; not a full standalone color panel.\n\n## Import\n\n```ts\nimport { MInputColor } from \"morya-ui\";\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Swatches\n\n`swatches` provides a row of preset colors.\n\n```vue preview src=\"./demos/Swatches.vue\"\n```\n\n## Props\n\n| Prop         | Type                                                                                   | Default     | Description                                       |\n| ------------ | -------------------------------------------------------------------------------------- | ----------- | ------------------------------------------------- |\n| `modelValue` | `string`                                                                               | `'#000000'` | Hexadecimal color.                                |\n| `swatches`   | `string[]`                                                                             | —           | Preset color chips.                               |\n| `disabled`   | `boolean`                                                                              | `false`     | Disabled.                                         |\n| `id`         | `string`                                                                               | —           | Color input id.                                   |\n| `pt`         | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | —           | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n## Events\n\n| Event               | Prop     | Description    |\n| ------------------- | -------- | -------------- |\n| `update:modelValue` | `string` | Color changed. |\n\n## Boundaries\n\nA **native picker + hex text + optional swatches**, not a full panel-level color experience.\n\n## Slots\n\n| Slot      | Description           |\n| --------- | --------------------- |\n| `trigger` | Custom color trigger. |\n"
+          "markdown": "---\ntitle: Input\ncategory: 02 / FORM\ndescription: Text input field.\n---\n\n# Input\n\nSingle-line text input.\n\n## Import\n\n```ts\nimport { MInput } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Invalid\n\nUse `invalid` for validation failure, or rely on `error-message` alone.\n\n```vue preview src=\"./demos/Invalid.vue\"\n```\n\n## Clearable\n\n```vue preview src=\"./demos/Clearable.vue\"\n```\n\n## Prefix / Suffix\n\n```vue preview src=\"./demos/PrefixSuffix.en.vue\"\n```\n\n## Password-like type\n\n```vue preview src=\"./demos/PasswordLikeType.vue\"\n```\n\n## Sizes\n\nSupports `small` / `large`, and also `sm` / `md` / `lg`.\n\n```vue preview src=\"./demos/Sizes.vue\"\n```\n\n## Count\n\n`showCount` shows the character count; pair with `maxlength` for an upper bound.\n\n```vue preview src=\"./demos/Count.vue\"\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n```\n\n## Outer attrs & layout\n\nAll fallthrough attrs except **control events** (`@keydown`, `@focus`, …) bind to the field wrapper (`.m-input-field`), not the raw `<input>`—including `class`, `style`, `data-*`, `title`, `tabindex`, and undeclared attrs:\n\n```vue preview src=\"./demos/OuterAttrsAndLayout.en.vue\"\n```\n\nSee [Styling & attrs](/docs/attrs) for library-wide rules.\n\n## Keyboard & focus events\n\n`@keydown`, `@focus`, `@blur`, and similar listeners attach to the underlying input:\n\n```vue preview src=\"./demos/KeyboardAndFocusEvents.en.vue\"\n```\n\n## pt\n\nPass-through per DOM part. Common keys: `root`, `input`, `label`, `prefix`, `suffix`, `help`, `count`.\n\n```vue preview src=\"./demos/Pt.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. Error wins over warning. |\n| `id` | `string` | — | Native id; auto-generated when omitted. |\n| `type` | `'text' \\| 'email' \\| 'password' \\| 'search' \\| 'url' \\| 'tel'` | `'text'` | Native type. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; medium by default. Inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Style variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show clear button. |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [InputPassThrough](/docs/types#InputPassThrough) | — | Pass-through per DOM part; see **pt** above. |\n\n## Slots\n\n| Slot | Description |\n| --- | --- |\n| `prefix` | Left adornment (unit, icon, and so on). |\n| `suffix` | Right adornment; can coexist with the clear button. |\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Value changed. |\n| `clear` | — | Fired when clear is clicked. |\n\n## Instance\n\n| Method | Description |\n| --- | --- |\n| `focus()` | Focus the underlying input. |\n| `blur()` | Blur the underlying input. |\n| `select()` | Select all text in the input. |\n\n## Types\n\n<h4 id=\"InputPassThrough\">InputPassThrough</h4>\n\nType of `pt`. Extends [FieldPassThrough](/docs/types#FieldPassThrough) with affix parts:\n\n```ts\ntype InputPassThrough = FieldPassThrough & {\n  prefix?: PassThroughPart\n  suffix?: PassThroughPart\n  help?: PassThroughPart\n  count?: PassThroughPart\n}\n```\n\nSee [PassThroughPart](/docs/types#PassThroughPart) in API types.\n"
         }
       }
     },
@@ -14155,12 +14327,6 @@
           "default": "false",
           "description": "显示清除按钮。"
         },
-        {
-          "name": "allowClear",
-          "type": "boolean",
-          "default": "—",
-          "description": "`clearable` 的别名。"
-        },
         {
           "name": "maxlength",
           "type": "number",
@@ -14390,7 +14556,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `feedback` | `boolean` | `false` | 显示强度提示。 |\n| `toggleMask` | `boolean` | `true` | 显示切换明文按钮。 |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | 显示明文的方式；`mousedown` 为按住预览。 |\n| `showIcon` | `IconName \\| Component` | `'eye'` | 密文态图标（点击显示）。 |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | 明文态图标（点击隐藏）。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `allowClear` | `boolean` | — | `clearable` 的别名。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `id` | `string` | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |"
+              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `feedback` | `boolean` | `false` | 显示强度提示。 |\n| `toggleMask` | `boolean` | `true` | 显示切换明文按钮。 |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | 显示明文的方式；`mousedown` 为按住预览。 |\n| `showIcon` | `IconName \\| Component` | `'eye'` | 密文态图标（点击显示）。 |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | 明文态图标（点击隐藏）。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `id` | `string` | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |"
             },
             {
               "id": "events",
@@ -14408,7 +14574,7 @@
               "body": "| 插槽名 | 参数 | 说明 |\n| --- | --- | --- |\n| `showIcon` | `{ unmasked }` | 替换显示密码图标。 |\n| `hideIcon` | `{ unmasked }` | 替换隐藏密码图标。 |"
             }
           ],
-          "markdown": "---\ntitle: InputPassword\ncategory: 02 / FORM\ndescription: 密码输入框，支持显示/隐藏与强度提示。\n---\n\n# InputPassword\n\n密码输入。默认提供显示/隐藏切换；可选密码强度反馈。\n\n## 引入\n\n```ts\nimport { MInputPassword } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Feedback\n\n```vue preview src=\"./demos/Feedback.vue\"\n```\n\n## Custom icons\n\n默认用 `eye` / `eye-off`。可用属性换成其它系统图标，或用插槽完全自定义。\n\n```vue preview src=\"./demos/CustomIcons.zh.vue\"\n```\n\n## Hold to peek\n\n`showPasswordOn=\"mousedown\"` 按住显示、松开隐藏（键盘 Space / Enter 同样按住预览）。\n\n```vue preview src=\"./demos/HoldToPeek.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `feedback` | `boolean` | `false` | 显示强度提示。 |\n| `toggleMask` | `boolean` | `true` | 显示切换明文按钮。 |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | 显示明文的方式；`mousedown` 为按住预览。 |\n| `showIcon` | `IconName \\| Component` | `'eye'` | 密文态图标（点击显示）。 |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | 明文态图标（点击隐藏）。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `allowClear` | `boolean` | — | `clearable` 的别名。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `id` | `string` | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 值变化。 |\n| `clear` | — | 点击清除时触发。 |\n| `blur` | — | — |\n| `change` | — | — |\n| `focus` | — | — |\n\n## Methods\n\n| 方法 | 说明 |\n| --- | --- |\n| `focus()` | 聚焦底层输入框。 |\n| `blur()` | 使底层输入框失焦。 |\n| `select()` | 选中输入框的全部文本。 |\n\n## Slots\n\n| 插槽名 | 参数 | 说明 |\n| --- | --- | --- |\n| `showIcon` | `{ unmasked }` | 替换显示密码图标。 |\n| `hideIcon` | `{ unmasked }` | 替换隐藏密码图标。 |\n"
+          "markdown": "---\ntitle: InputPassword\ncategory: 02 / FORM\ndescription: 密码输入框，支持显示/隐藏与强度提示。\n---\n\n# InputPassword\n\n密码输入。默认提供显示/隐藏切换；可选密码强度反馈。\n\n## 引入\n\n```ts\nimport { MInputPassword } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Feedback\n\n```vue preview src=\"./demos/Feedback.vue\"\n```\n\n## Custom icons\n\n默认用 `eye` / `eye-off`。可用属性换成其它系统图标，或用插槽完全自定义。\n\n```vue preview src=\"./demos/CustomIcons.zh.vue\"\n```\n\n## Hold to peek\n\n`showPasswordOn=\"mousedown\"` 按住显示、松开隐藏（键盘 Space / Enter 同样按住预览）。\n\n```vue preview src=\"./demos/HoldToPeek.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `feedback` | `boolean` | `false` | 显示强度提示。 |\n| `toggleMask` | `boolean` | `true` | 显示切换明文按钮。 |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | 显示明文的方式；`mousedown` 为按住预览。 |\n| `showIcon` | `IconName \\| Component` | `'eye'` | 密文态图标（点击显示）。 |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | 明文态图标（点击隐藏）。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `id` | `string` | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 值变化。 |\n| `clear` | — | 点击清除时触发。 |\n| `blur` | — | — |\n| `change` | — | — |\n| `focus` | — | — |\n\n## Methods\n\n| 方法 | 说明 |\n| --- | --- |\n| `focus()` | 聚焦底层输入框。 |\n| `blur()` | 使底层输入框失焦。 |\n| `select()` | 选中输入框的全部文本。 |\n\n## Slots\n\n| 插槽名 | 参数 | 说明 |\n| --- | --- | --- |\n| `showIcon` | `{ unmasked }` | 替换显示密码图标。 |\n| `hideIcon` | `{ unmasked }` | 替换隐藏密码图标。 |\n"
         },
         "en-US": {
           "title": "InputPassword",
@@ -14452,7 +14618,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `feedback` | `boolean` | `false` | Show strength feedback. |\n| `toggleMask` | `boolean` | `true` | Show toggle for revealing the password. |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | How to reveal; `mousedown` is hold-to-peek. |\n| `showIcon` | `IconName \\| Component` | `'eye'` | Icon while masked (click to reveal). |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | Icon while visible (click to hide). |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `allowClear` | `boolean` | — | Alias of `clearable` . |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |"
+              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `feedback` | `boolean` | `false` | Show strength feedback. |\n| `toggleMask` | `boolean` | `true` | Show toggle for revealing the password. |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | How to reveal; `mousedown` is hold-to-peek. |\n| `showIcon` | `IconName \\| Component` | `'eye'` | Icon while masked (click to reveal). |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | Icon while visible (click to hide). |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |"
             },
             {
               "id": "events",
@@ -14470,7 +14636,7 @@
               "body": "| Slot | Props | Description |\n| --- | --- | --- |\n| `showIcon` | `{ unmasked }` | Replace the show-password icon. |\n| `hideIcon` | `{ unmasked }` | Replace the hide-password icon. |"
             }
           ],
-          "markdown": "---\ntitle: InputPassword\ncategory: 02 / FORM\ndescription: Password input with show/hide toggle and optional strength feedback.\n---\n\n# InputPassword\n\nPassword input. Includes a show/hide toggle by default; optional password strength feedback.\n\n## Import\n\n```ts\nimport { MInputPassword } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Feedback\n\n```vue preview src=\"./demos/Feedback.vue\"\n```\n\n## Custom icons\n\nDefaults are `eye` / `eye-off`. Swap them with other system icons via props, or replace them entirely with slots.\n\n```vue preview src=\"./demos/CustomIcons.en.vue\"\n```\n\n## Hold to peek\n\n`showPasswordOn=\"mousedown\"` reveals while pressed and hides on release (Space / Enter do the same).\n\n```vue preview src=\"./demos/HoldToPeek.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `feedback` | `boolean` | `false` | Show strength feedback. |\n| `toggleMask` | `boolean` | `true` | Show toggle for revealing the password. |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | How to reveal; `mousedown` is hold-to-peek. |\n| `showIcon` | `IconName \\| Component` | `'eye'` | Icon while masked (click to reveal). |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | Icon while visible (click to hide). |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `allowClear` | `boolean` | — | Alias of `clearable` . |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Value changed. |\n| `clear` | — | Emitted when the value is cleared. |\n\n## Methods\n\n| Method | Description |\n| --- | --- |\n| `focus()` | Focus the underlying input. |\n| `blur()` | Blur the underlying input. |\n| `select()` | Select all text in the input. |\n\n## Slots\n\n| Slot | Props | Description |\n| --- | --- | --- |\n| `showIcon` | `{ unmasked }` | Replace the show-password icon. |\n| `hideIcon` | `{ unmasked }` | Replace the hide-password icon. |\n"
+          "markdown": "---\ntitle: InputPassword\ncategory: 02 / FORM\ndescription: Password input with show/hide toggle and optional strength feedback.\n---\n\n# InputPassword\n\nPassword input. Includes a show/hide toggle by default; optional password strength feedback.\n\n## Import\n\n```ts\nimport { MInputPassword } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Feedback\n\n```vue preview src=\"./demos/Feedback.vue\"\n```\n\n## Custom icons\n\nDefaults are `eye` / `eye-off`. Swap them with other system icons via props, or replace them entirely with slots.\n\n```vue preview src=\"./demos/CustomIcons.en.vue\"\n```\n\n## Hold to peek\n\n`showPasswordOn=\"mousedown\"` reveals while pressed and hides on release (Space / Enter do the same).\n\n```vue preview src=\"./demos/HoldToPeek.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `feedback` | `boolean` | `false` | Show strength feedback. |\n| `toggleMask` | `boolean` | `true` | Show toggle for revealing the password. |\n| `showPasswordOn` | `'click' \\| 'mousedown'` | `'click'` | How to reveal; `mousedown` is hold-to-peek. |\n| `showIcon` | `IconName \\| Component` | `'eye'` | Icon while masked (click to reveal). |\n| `hideIcon` | `IconName \\| Component` | `'eye-off'` | Icon while visible (click to hide). |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `invalid` | `boolean` | `false` | Validation failed state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Value changed. |\n| `clear` | — | Emitted when the value is cleared. |\n\n## Methods\n\n| Method | Description |\n| --- | --- |\n| `focus()` | Focus the underlying input. |\n| `blur()` | Blur the underlying input. |\n| `select()` | Select all text in the input. |\n\n## Slots\n\n| Slot | Props | Description |\n| --- | --- | --- |\n| `showIcon` | `{ unmasked }` | Replace the show-password icon. |\n| `hideIcon` | `{ unmasked }` | Replace the hide-password icon. |\n"
         }
       }
     },
@@ -16615,7 +16781,7 @@
             {
               "id": "菜单项字段",
               "title": "菜单项字段",
-              "body": "| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案。 |\n| `icon` | `string` | 可选前缀字符。 |\n| `command` | `() => void` | 点击时执行。 |\n| `disabled` | `boolean` | 禁用项。 |\n| `items` | `MegaMenuItem[][]` | 分栏子面板。 |"
+              "body": "| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案。 |\n| `icon` | `string \\| Component` | 内置图标名、别名，或自定义 Vue 图标组件。 |\n| `command` | `() => void` | 点击时执行。 |\n| `disabled` | `boolean` | 禁用项。 |\n| `items` | `MegaMenuItem[][]` | 分栏子面板。 |"
             },
             {
               "id": "props",
@@ -16643,7 +16809,7 @@
               "body": "<h4 id=\"MegaMenuItem\">MegaMenuItem</h4>\n\n完整定义见源码 `types.ts`。\n\n```ts\ninterface MegaMenuItem extends Omit<MenuNodeBase, 'label' | 'items'> {\n  label: string\n  /** Column groups for mega panel; each entry is a column of items. */\n  items?: MegaMenuItem[][]\n}\n```"
             }
           ],
-          "markdown": "---\ntitle: MegaMenu\ncategory: 04 / NAVIGATION\ndescription: 水平菜单，子项按多列面板展示。\n---\n\n# MegaMenu\n\n顶层水平导航；展开后以**分栏面板**展示子链接，适合站点级导航。\n\n## 引入\n\n```ts\nimport type {MegaMenuItem} from 'morya-ui';\nimport {  MMegaMenu } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/BasicUsage.zh.vue\"\n```\n\n## 面板结构\n\n`items` 为**列数组**：外层每一项是一列，列内为同级链接。\n\n```ts\n{\n  label: '产品',\n  items: [\n    [ { label: '列 A · 项 1' }, { label: '列 A · 项 2' } ],\n    [ { label: '列 B · 项 1' } ],\n  ],\n}\n```\n\n无 `items` 的顶层项为普通链接，点击执行 `command`。\n\n## 菜单项字段\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案。 |\n| `icon` | `string` | 可选前缀字符。 |\n| `command` | `() => void` | 点击时执行。 |\n| `disabled` | `boolean` | 禁用项。 |\n| `items` | `MegaMenuItem[][]` | 分栏子面板。 |\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `model` | `MegaMenuItem[]` | `[]` | 顶层菜单项。 |\n| `teleport` | `boolean` | `true` | 面板 Teleport；默认 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | 挂载目标。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `selectedKey` | `string \\| null` | — | — |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## 无障碍\n\n- 顶层项使用按钮/链接语义；展开面板请确保键盘可到达子项。\n- 复杂站点导航建议配合 Skip link 与当前页 `aria-current`。\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `select` | — | — |\n| `update:selectedKey` | — | — |\n\n## Slots\n\n无插槽。\n\n## 类型\n\n<h4 id=\"MegaMenuItem\">MegaMenuItem</h4>\n\n完整定义见源码 `types.ts`。\n\n```ts\ninterface MegaMenuItem extends Omit<MenuNodeBase, 'label' | 'items'> {\n  label: string\n  /** Column groups for mega panel; each entry is a column of items. */\n  items?: MegaMenuItem[][]\n}\n```\n"
+          "markdown": "---\ntitle: MegaMenu\ncategory: 04 / NAVIGATION\ndescription: 水平菜单，子项按多列面板展示。\n---\n\n# MegaMenu\n\n顶层水平导航；展开后以**分栏面板**展示子链接，适合站点级导航。\n\n## 引入\n\n```ts\nimport type {MegaMenuItem} from 'morya-ui';\nimport {  MMegaMenu } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/BasicUsage.zh.vue\"\n```\n\n## 面板结构\n\n`items` 为**列数组**：外层每一项是一列，列内为同级链接。\n\n```ts\n{\n  label: '产品',\n  items: [\n    [ { label: '列 A · 项 1' }, { label: '列 A · 项 2' } ],\n    [ { label: '列 B · 项 1' } ],\n  ],\n}\n```\n\n无 `items` 的顶层项为普通链接，点击执行 `command`。\n\n## 菜单项字段\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `label` | `string` | 展示文案。 |\n| `icon` | `string \\| Component` | 内置图标名、别名，或自定义 Vue 图标组件。 |\n| `command` | `() => void` | 点击时执行。 |\n| `disabled` | `boolean` | 禁用项。 |\n| `items` | `MegaMenuItem[][]` | 分栏子面板。 |\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `model` | `MegaMenuItem[]` | `[]` | 顶层菜单项。 |\n| `teleport` | `boolean` | `true` | 面板 Teleport；默认 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | 挂载目标。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `selectedKey` | `string \\| null` | — | — |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## 无障碍\n\n- 顶层项使用按钮/链接语义；展开面板请确保键盘可到达子项。\n- 复杂站点导航建议配合 Skip link 与当前页 `aria-current`。\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `select` | — | — |\n| `update:selectedKey` | — | — |\n\n## Slots\n\n无插槽。\n\n## 类型\n\n<h4 id=\"MegaMenuItem\">MegaMenuItem</h4>\n\n完整定义见源码 `types.ts`。\n\n```ts\ninterface MegaMenuItem extends Omit<MenuNodeBase, 'label' | 'items'> {\n  label: string\n  /** Column groups for mega panel; each entry is a column of items. */\n  items?: MegaMenuItem[][]\n}\n```\n"
         },
         "en-US": {
           "title": "MegaMenu",
@@ -16672,7 +16838,7 @@
             {
               "id": "item-fields",
               "title": "Item fields",
-              "body": "| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text. |\n| `icon` | `string` | Optional leading character. |\n| `command` | `() => void` | Runs on activate. |\n| `disabled` | `boolean` | Disabled item. |\n| `items` | `MegaMenuItem[][]` | Column groups for the mega panel. |"
+              "body": "| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text. |\n| `icon` | `string \\| Component` | Built-in icon name, alias, or custom Vue icon component. |\n| `command` | `() => void` | Runs on activate. |\n| `disabled` | `boolean` | Disabled item. |\n| `items` | `MegaMenuItem[][]` | Column groups for the mega panel. |"
             },
             {
               "id": "props",
@@ -16700,7 +16866,7 @@
               "body": "<h4 id=\"MegaMenuItem\">MegaMenuItem</h4>\n\nSee source `types.ts` for the full definition.\n\n```ts\ninterface MegaMenuItem extends Omit<MenuNodeBase, 'label' | 'items'> {\n  label: string\n  /** Column groups for mega panel; each entry is a column of items. */\n  items?: MegaMenuItem[][]\n}\n```"
             }
           ],
-          "markdown": "---\ntitle: MegaMenu\ncategory: 04 / NAVIGATION\ndescription: Horizontal menu with multi-column mega panels.\n---\n\n# MegaMenu\n\nHorizontal top navigation. Sub-links render in a **multi-column panel**—suited to site-wide nav.\n\n## Import\n\n```ts\nimport type {MegaMenuItem} from 'morya-ui';\nimport {  MMegaMenu } from 'morya-ui'\n```\n\n## Basic usage\n\n```vue preview src=\"./demos/BasicUsage.en.vue\"\n```\n\n## Panel shape\n\n`items` is an array of **columns**. Each column is a list of links at the same level.\n\n```ts\n{\n  label: 'Products',\n  items: [\n    [ { label: 'Col A · item 1' }, { label: 'Col A · item 2' } ],\n    [ { label: 'Col B · item 1' } ],\n  ],\n}\n```\n\nTop-level entries without `items` behave as plain links via `command`.\n\n## Item fields\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text. |\n| `icon` | `string` | Optional leading character. |\n| `command` | `() => void` | Runs on activate. |\n| `disabled` | `boolean` | Disabled item. |\n| `items` | `MegaMenuItem[][]` | Column groups for the mega panel. |\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `model` | `MegaMenuItem[]` | `[]` | Top-level items. |\n| `teleport` | `boolean` | `true` | Panel Teleport; defaults to `body`. |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Mount target. |\n| `transition` | `string \\| false` | `'scale-fade'` | Enter/exit motion preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Accessibility\n\n- Top items expose button/link semantics; ensure submenu links are keyboard reachable.\n- Pair with skip links and `aria-current` on the active page when used as primary nav.\n\n## Events\n\nNo custom events.\n\n## Slots\n\nNo slots.\n\n## Types\n\n<h4 id=\"MegaMenuItem\">MegaMenuItem</h4>\n\nSee source `types.ts` for the full definition.\n\n```ts\ninterface MegaMenuItem extends Omit<MenuNodeBase, 'label' | 'items'> {\n  label: string\n  /** Column groups for mega panel; each entry is a column of items. */\n  items?: MegaMenuItem[][]\n}\n```\n"
+          "markdown": "---\ntitle: MegaMenu\ncategory: 04 / NAVIGATION\ndescription: Horizontal menu with multi-column mega panels.\n---\n\n# MegaMenu\n\nHorizontal top navigation. Sub-links render in a **multi-column panel**—suited to site-wide nav.\n\n## Import\n\n```ts\nimport type {MegaMenuItem} from 'morya-ui';\nimport {  MMegaMenu } from 'morya-ui'\n```\n\n## Basic usage\n\n```vue preview src=\"./demos/BasicUsage.en.vue\"\n```\n\n## Panel shape\n\n`items` is an array of **columns**. Each column is a list of links at the same level.\n\n```ts\n{\n  label: 'Products',\n  items: [\n    [ { label: 'Col A · item 1' }, { label: 'Col A · item 2' } ],\n    [ { label: 'Col B · item 1' } ],\n  ],\n}\n```\n\nTop-level entries without `items` behave as plain links via `command`.\n\n## Item fields\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `label` | `string` | Display text. |\n| `icon` | `string \\| Component` | Built-in icon name, alias, or custom Vue icon component. |\n| `command` | `() => void` | Runs on activate. |\n| `disabled` | `boolean` | Disabled item. |\n| `items` | `MegaMenuItem[][]` | Column groups for the mega panel. |\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `model` | `MegaMenuItem[]` | `[]` | Top-level items. |\n| `teleport` | `boolean` | `true` | Panel Teleport; defaults to `body`. |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Mount target. |\n| `transition` | `string \\| false` | `'scale-fade'` | Enter/exit motion preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Accessibility\n\n- Top items expose button/link semantics; ensure submenu links are keyboard reachable.\n- Pair with skip links and `aria-current` on the active page when used as primary nav.\n\n## Events\n\nNo custom events.\n\n## Slots\n\nNo slots.\n\n## Types\n\n<h4 id=\"MegaMenuItem\">MegaMenuItem</h4>\n\nSee source `types.ts` for the full definition.\n\n```ts\ninterface MegaMenuItem extends Omit<MenuNodeBase, 'label' | 'items'> {\n  label: string\n  /** Column groups for mega panel; each entry is a column of items. */\n  items?: MegaMenuItem[][]\n}\n```\n"
         }
       }
     },
@@ -16798,11 +16964,6 @@
           "type": "boolean",
           "description": "显示清除按钮"
         },
-        {
-          "name": "allowClear",
-          "type": "boolean",
-          "description": "`clearable` 的别名"
-        },
         {
           "name": "loading",
           "type": "boolean",
@@ -16932,7 +17093,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| 参数 | 类型 | 默认 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 文本 |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | 建议项 |\n| `prefix` | `string \\| string[]` | `'@'` | 触发字符 |\n| `split` | `string` | `' '` | 选中后追加的分隔符 |\n| `rows` | `number` | `3` | 行数 |\n| `placeholder` | `string` | — | 占位 |\n| `disabled` / `readonly` | `boolean` | `false` | 禁用 / 只读 |\n| `status` | `'error' \\| 'warning'` | — | 校验态（同 Input） |\n| `invalid` / `errorMessage` / `helpText` | — | — | 字段反馈 |\n| `size` / `variant` / `fluid` | — | — | 与 Textarea 一致 |\n| `emptyMessage` | `string` | locale 空态 | 无匹配文案 |\n| `clearable` | `boolean` | `false` | 显示清除按钮 |\n| `allowClear` | `boolean` | — | `clearable` 的别名 |\n| `loading` | `boolean` | `false` | 建议面板内显示加载中 |\n| `id` | `string` | — | 控件 id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | 字段透传 |"
+              "body": "| 参数 | 类型 | 默认 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 文本 |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | 建议项 |\n| `prefix` | `string \\| string[]` | `'@'` | 触发字符 |\n| `split` | `string` | `' '` | 选中后追加的分隔符 |\n| `rows` | `number` | `3` | 行数 |\n| `placeholder` | `string` | — | 占位 |\n| `disabled` / `readonly` | `boolean` | `false` | 禁用 / 只读 |\n| `status` | `'error' \\| 'warning'` | — | 校验态（同 Input） |\n| `invalid` / `errorMessage` / `helpText` | — | — | 字段反馈 |\n| `size` / `variant` / `fluid` | — | — | 与 Textarea 一致 |\n| `emptyMessage` | `string` | locale 空态 | 无匹配文案 |\n| `clearable` | `boolean` | `false` | 显示清除按钮 |\n| `loading` | `boolean` | `false` | 建议面板内显示加载中 |\n| `id` | `string` | — | 控件 id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | 字段透传 |"
             },
             {
               "id": "异步建议",
@@ -16945,7 +17106,7 @@
               "body": "| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 文本变化 |\n| `select` | `MentionsOption` | 选中建议 |\n| `focus` / `blur` / `change` | — | 原生语义 |"
             }
           ],
-          "markdown": "---\ntitle: Mentions\ncategory: 02 / FORM\ndescription: 输入 @ 等前缀时弹出建议并插入提及文本。\n---\n\n# Mentions\n\n多行输入中通过 **前缀**（默认 `@`）触发建议列表，选中后在光标处插入 `prefix + value + split` 纯文本 token。适合评论、协作输入等场景。\n\n## 引入\n\n```ts\nimport { MMentions } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## 多前缀\n\n`prefix` 可为字符串或数组；`split` 默认为空格，表示 mention 结束符。\n\n```vue preview src=\"./demos/Prefix.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 文本 |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | 建议项 |\n| `prefix` | `string \\| string[]` | `'@'` | 触发字符 |\n| `split` | `string` | `' '` | 选中后追加的分隔符 |\n| `rows` | `number` | `3` | 行数 |\n| `placeholder` | `string` | — | 占位 |\n| `disabled` / `readonly` | `boolean` | `false` | 禁用 / 只读 |\n| `status` | `'error' \\| 'warning'` | — | 校验态（同 Input） |\n| `invalid` / `errorMessage` / `helpText` | — | — | 字段反馈 |\n| `size` / `variant` / `fluid` | — | — | 与 Textarea 一致 |\n| `emptyMessage` | `string` | locale 空态 | 无匹配文案 |\n| `clearable` | `boolean` | `false` | 显示清除按钮 |\n| `allowClear` | `boolean` | — | `clearable` 的别名 |\n| `loading` | `boolean` | `false` | 建议面板内显示加载中 |\n| `id` | `string` | — | 控件 id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | 字段透传 |\n\n## 异步建议\n\n无内置请求 API：在 `@input` / 自定义 debounce 后更新 `options`，并设 `loading` 为 `true` 直至数据返回。面板会在有活跃 mention 时保持打开。\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 文本变化 |\n| `select` | `MentionsOption` | 选中建议 |\n| `focus` / `blur` / `change` | — | 原生语义 |\n"
+          "markdown": "---\ntitle: Mentions\ncategory: 02 / FORM\ndescription: 输入 @ 等前缀时弹出建议并插入提及文本。\n---\n\n# Mentions\n\n多行输入中通过 **前缀**（默认 `@`）触发建议列表，选中后在光标处插入 `prefix + value + split` 纯文本 token。适合评论、协作输入等场景。\n\n## 引入\n\n```ts\nimport { MMentions } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## 多前缀\n\n`prefix` 可为字符串或数组；`split` 默认为空格，表示 mention 结束符。\n\n```vue preview src=\"./demos/Prefix.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 文本 |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | 建议项 |\n| `prefix` | `string \\| string[]` | `'@'` | 触发字符 |\n| `split` | `string` | `' '` | 选中后追加的分隔符 |\n| `rows` | `number` | `3` | 行数 |\n| `placeholder` | `string` | — | 占位 |\n| `disabled` / `readonly` | `boolean` | `false` | 禁用 / 只读 |\n| `status` | `'error' \\| 'warning'` | — | 校验态（同 Input） |\n| `invalid` / `errorMessage` / `helpText` | — | — | 字段反馈 |\n| `size` / `variant` / `fluid` | — | — | 与 Textarea 一致 |\n| `emptyMessage` | `string` | locale 空态 | 无匹配文案 |\n| `clearable` | `boolean` | `false` | 显示清除按钮 |\n| `loading` | `boolean` | `false` | 建议面板内显示加载中 |\n| `id` | `string` | — | 控件 id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | 字段透传 |\n\n## 异步建议\n\n无内置请求 API：在 `@input` / 自定义 debounce 后更新 `options`，并设 `loading` 为 `true` 直至数据返回。面板会在有活跃 mention 时保持打开。\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 文本变化 |\n| `select` | `MentionsOption` | 选中建议 |\n| `focus` / `blur` / `change` | — | 原生语义 |\n"
         },
         "en-US": {
           "title": "Mentions",
@@ -16974,7 +17135,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Text |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | Suggestions |\n| `prefix` | `string \\| string[]` | `'@'` | Trigger character(s) |\n| `split` | `string` | `' '` | Separator appended after selection |\n| `rows` | `number` | `3` | Row count |\n| `placeholder` | `string` | — | Placeholder |\n| `disabled` / `readonly` | `boolean` | `false` | Disabled / read-only |\n| `status` | `'error' \\| 'warning'` | — | Validate status (like Input) |\n| `invalid` / `errorMessage` / `helpText` | — | — | Field feedback |\n| `size` / `variant` / `fluid` | — | — | Same ideas as Textarea |\n| `emptyMessage` | `string` | locale empty | Copy when nothing matches |\n| `clearable` | `boolean` | `false` | Show clear control |\n| `allowClear` | `boolean` | — | Alias of `clearable`  |\n| `loading` | `boolean` | `false` | Spinner in suggestion panel |\n| `id` | `string` | — | Control id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | Field pass-through |"
+              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Text |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | Suggestions |\n| `prefix` | `string \\| string[]` | `'@'` | Trigger character(s) |\n| `split` | `string` | `' '` | Separator appended after selection |\n| `rows` | `number` | `3` | Row count |\n| `placeholder` | `string` | — | Placeholder |\n| `disabled` / `readonly` | `boolean` | `false` | Disabled / read-only |\n| `status` | `'error' \\| 'warning'` | — | Validate status (like Input) |\n| `invalid` / `errorMessage` / `helpText` | — | — | Field feedback |\n| `size` / `variant` / `fluid` | — | — | Same ideas as Textarea |\n| `emptyMessage` | `string` | locale empty | Copy when nothing matches |\n| `clearable` | `boolean` | `false` | Show clear control |\n| `loading` | `boolean` | `false` | Spinner in suggestion panel |\n| `id` | `string` | — | Control id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | Field pass-through |"
             },
             {
               "id": "async-suggestions",
@@ -16987,7 +17148,7 @@
               "body": "| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Text changed |\n| `select` | `MentionsOption` | Suggestion picked |\n| `focus` / `blur` / `change` | — | Native semantics |"
             }
           ],
-          "markdown": "---\ntitle: Mentions\ncategory: 02 / FORM\ndescription: Suggest and insert mention tokens when typing a prefix.\n---\n\n# Mentions\n\nMulti-line field that opens a suggestion list after a **prefix** (default `@`). Choosing an item inserts plain text `prefix + value + split`. Good for comments and collaborative inputs.\n\n## Import\n\n```ts\nimport { MMentions } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Multiple prefixes\n\n`prefix` may be a string or array; `split` defaults to a space and closes an active mention.\n\n```vue preview src=\"./demos/Prefix.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Text |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | Suggestions |\n| `prefix` | `string \\| string[]` | `'@'` | Trigger character(s) |\n| `split` | `string` | `' '` | Separator appended after selection |\n| `rows` | `number` | `3` | Row count |\n| `placeholder` | `string` | — | Placeholder |\n| `disabled` / `readonly` | `boolean` | `false` | Disabled / read-only |\n| `status` | `'error' \\| 'warning'` | — | Validate status (like Input) |\n| `invalid` / `errorMessage` / `helpText` | — | — | Field feedback |\n| `size` / `variant` / `fluid` | — | — | Same ideas as Textarea |\n| `emptyMessage` | `string` | locale empty | Copy when nothing matches |\n| `clearable` | `boolean` | `false` | Show clear control |\n| `allowClear` | `boolean` | — | Alias of `clearable`  |\n| `loading` | `boolean` | `false` | Spinner in suggestion panel |\n| `id` | `string` | — | Control id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | Field pass-through |\n\n## Async suggestions\n\nNo built-in fetch: debounce in your handler, set `loading` while fetching, then replace `options`. The panel stays open while a mention is active.\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Text changed |\n| `select` | `MentionsOption` | Suggestion picked |\n| `focus` / `blur` / `change` | — | Native semantics |\n"
+          "markdown": "---\ntitle: Mentions\ncategory: 02 / FORM\ndescription: Suggest and insert mention tokens when typing a prefix.\n---\n\n# Mentions\n\nMulti-line field that opens a suggestion list after a **prefix** (default `@`). Choosing an item inserts plain text `prefix + value + split`. Good for comments and collaborative inputs.\n\n## Import\n\n```ts\nimport { MMentions } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Multiple prefixes\n\n`prefix` may be a string or array; `split` defaults to a space and closes an active mention.\n\n```vue preview src=\"./demos/Prefix.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Text |\n| `options` | `string[] \\| { value, label? }[]` | `[]` | Suggestions |\n| `prefix` | `string \\| string[]` | `'@'` | Trigger character(s) |\n| `split` | `string` | `' '` | Separator appended after selection |\n| `rows` | `number` | `3` | Row count |\n| `placeholder` | `string` | — | Placeholder |\n| `disabled` / `readonly` | `boolean` | `false` | Disabled / read-only |\n| `status` | `'error' \\| 'warning'` | — | Validate status (like Input) |\n| `invalid` / `errorMessage` / `helpText` | — | — | Field feedback |\n| `size` / `variant` / `fluid` | — | — | Same ideas as Textarea |\n| `emptyMessage` | `string` | locale empty | Copy when nothing matches |\n| `clearable` | `boolean` | `false` | Show clear control |\n| `loading` | `boolean` | `false` | Spinner in suggestion panel |\n| `id` | `string` | — | Control id |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) | — | Field pass-through |\n\n## Async suggestions\n\nNo built-in fetch: debounce in your handler, set `loading` while fetching, then replace `options`. The panel stays open while a mention is active.\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Text changed |\n| `select` | `MentionsOption` | Suggestion picked |\n| `focus` / `blur` / `change` | — | Native semantics |\n"
         }
       }
     },
@@ -17238,7 +17399,7 @@
           "sectionId": "类型",
           "lang": "ts",
           "preview": false,
-          "code": "interface MenuItem {\n  key?: string\n  label?: string\n  icon?: string\n  to?: string | RouteLocationRaw   // 有 vue-router 时用 RouterLink\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}",
+          "code": "interface MenuItem {\n  key?: string\n  label?: string\n  icon?: string | Component        // 内置图标名、别名，或自定义 Vue 组件\n  to?: string | RouteLocationRaw   // 有 vue-router 时用 RouterLink\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}",
           "locale": "zh-CN"
         },
         {
@@ -17328,7 +17489,7 @@
           "sectionId": "types",
           "lang": "ts",
           "preview": false,
-          "code": "interface MenuItem {\n  key?: string\n  label?: string\n  icon?: string\n  to?: string | RouteLocationRaw   // RouterLink when vue-router is installed\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}",
+          "code": "interface MenuItem {\n  key?: string\n  label?: string\n  icon?: string | Component        // Built-in icon name, alias, or custom Vue component\n  to?: string | RouteLocationRaw   // RouterLink when vue-router is installed\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}",
           "locale": "en-US"
         }
       ],
@@ -17375,7 +17536,7 @@
             {
               "id": "水平菜单",
               "title": "水平菜单",
-              "body": "`mode=\"horizontal\"` 用于顶栏一级导航；子菜单经 `MPopover` 以下拉飞出层展示（Teleport + 主题滚动条），选中后自动关闭。`popup` 模式的主菜单列表同样内置 `MScrollbar`。\n\n```vue preview src=\"./demos/HorizontalMode.zh.vue\"\n```"
+              "body": "`mode=\"horizontal\"` 用于顶栏一级导航；选中/含选中子项的一级项以**底部指示条**高亮，子菜单经 `MPopover` 以下拉飞出层展示（Teleport + 主题滚动条），选中后自动关闭。`popup` 模式的主菜单列表同样内置 `MScrollbar`。\n\n```vue preview src=\"./demos/HorizontalMode.zh.vue\"\n```"
             },
             {
               "id": "反色-深色侧栏",
@@ -17385,7 +17546,7 @@
             {
               "id": "弹出模式",
               "title": "弹出模式",
-              "body": "`popup` + `v-model` 将菜单作为浮层，默认 Teleport 到 `body` 并相对**默认插槽触发器**定位（无插槽时回退到最后一次指针位置）。点击外部或选中叶子项后关闭。\n\n```vue preview src=\"./demos/PopupMode.zh.vue\"\n```"
+              "body": "`popup` + `v-model` 将菜单作为浮层，默认 Teleport 到 `body` 并相对**默认插槽触发器**定位（无插槽时回退到最后一次指针位置）。面板最小宽度跟随触发器（下限 `10rem`），下方空间不足时向上翻转；打开期间触发器容器带 `m-menu-popup--open` / `data-open` 与 `aria-expanded`，便于自定义高亮。点击外部或选中叶子项后关闭。\n\n```vue preview src=\"./demos/PopupMode.zh.vue\"\n```"
             },
             {
               "id": "props",
@@ -17405,15 +17566,15 @@
             {
               "id": "menuitem",
               "title": "MenuItem",
-              "body": "| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `key` | `string` | 唯一标识；未传时使用 `label`。 |\n| `label` | `string` | 展示文本。 |\n| `icon` | `string` | [Tabler 图标名](/components/Icon) 或字符。 |\n| `command` | `() => void` | 点击回调（与 `select` 事件同时触发）。 |\n| `disabled` | `boolean` | 禁用。 |\n| `separator` | `boolean` | 分隔线（忽略其他字段）。 |\n| `items` | `MenuItem[]` | 子菜单。 |"
+              "body": "| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `key` | `string` | 唯一标识；未传时使用 `label`。 |\n| `label` | `string` | 展示文本。 |\n| `icon` | `string \\| Component` | [Tabler 图标名](/components/Icon)、别名，或自定义 Vue 图标组件。 |\n| `command` | `() => void` | 点击回调（与 `select` 事件同时触发）。 |\n| `disabled` | `boolean` | 禁用。 |\n| `separator` | `boolean` | 分隔线（忽略其他字段）。 |\n| `items` | `MenuItem[]` | 子菜单。 |"
             },
             {
               "id": "类型",
               "title": "类型",
-              "body": "<h4 id=\"MenuItem\">MenuItem</h4>\n\n`model` 数组项，支持嵌套：\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string\n  to?: string | RouteLocationRaw   // 有 vue-router 时用 RouterLink\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\n`key` 未传时用 `label` 作为标识。`separator: true` 时渲染分隔线。更多见 [API 类型](/docs/types)。"
+              "body": "<h4 id=\"MenuItem\">MenuItem</h4>\n\n`model` 数组项，支持嵌套：\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string | Component        // 内置图标名、别名，或自定义 Vue 组件\n  to?: string | RouteLocationRaw   // 有 vue-router 时用 RouterLink\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\n`key` 未传时用 `label` 作为标识。`separator: true` 时渲染分隔线。更多见 [API 类型](/docs/types)。"
             }
           ],
-          "markdown": "---\ntitle: Menu\ncategory: 04 / NAVIGATION\ndescription: 垂直/水平导航菜单，支持多级嵌套、受控选中、手风琴展开与折叠侧栏飞出层。\n---\n\n# Menu\n\n基于 `model` 渲染的**导航菜单**，适合后台侧栏、顶栏导航等场景。支持：\n\n- 多级嵌套 `items` 与受控 `selectedKey`\n- 展开路径自动跟随选中项；`accordion` 手风琴\n- `collapsed` 图标模式 + 右侧飞出子菜单（Popover）\n- 非 popup 时默认 `embedded`，无边框铺满 `MLayoutSider`\n\n> 单层悬停子菜单见 [TieredMenu](/components/TieredMenu)；顶栏菜单见 [Menubar](/components/Menubar)；操作列表见 [Dropdown](/components/Dropdown)。\n\n## 引入\n\n```ts\nimport type {MenuItem} from 'morya-ui';\nimport {  MMenu } from 'morya-ui'\n```\n\n## 导航选中\n\n为叶子项设置稳定的 `key`，用 `v-model:selected-key` 与路由同步；点击时触发 `select`。\n\n```vue preview src=\"./demos/Selection.zh.vue\"\n```\n\n未提供 `key` 时会回退到 `label`；生产环境建议始终显式设置 `key`。\n\n## 嵌套子菜单\n\n点击带子项的节点可展开/收起；选中子项时父级会显示 `child-active` 高亮。\n\n```vue preview src=\"./demos/NestedSubmenus.zh.vue\"\n```\n\n## 手风琴与展开控制\n\n`accordion` 同时只保留一个一级子菜单展开。`defaultExpandedKeys` / `v-model:expanded-keys` 可受控展开项；变更 `selectedKey` 时会自动展开其祖先路径。\n\n```vue preview src=\"./demos/AccordionAndExpandedKeys.zh.vue\"\n```\n\n## 折叠与飞出层\n\n`collapsed` 隐藏文案，仅保留图标；**每个可折叠展示的菜单项必须提供 `icon`**（否则折叠后几乎空白）。悬停时在右侧显示 `MTooltip` 标签，带子项的节点还会弹出飞出层（`.m-menu--flyout`）。飞出层经 `MPopover` Teleport 到 `body`，不会被侧栏裁剪。`collapsed-width` 应与侧栏折叠宽度一致，用于居中图标。\n\n使用 `item.to` 时菜单项会渲染为 `RouterLink` / `<a>`；组件已重置链接的默认蓝色下划线，视觉与普通菜单项一致。\n\n```vue preview src=\"./demos/CollapsedAndFlyout.zh.vue\"\n```\n\n## 嵌入 Layout 侧栏\n\n推荐结构：**全局 Header + 下方 `has-sider` Layout**。菜单放在 `MLayoutSider` 内，与 `v-model:collapsed` 联动。\n\n```vue preview src=\"./demos/EmbedInLayoutSider.zh.vue\"\n```\n\n## 水平菜单\n\n`mode=\"horizontal\"` 用于顶栏一级导航；子菜单经 `MPopover` 以下拉飞出层展示（Teleport + 主题滚动条），选中后自动关闭。`popup` 模式的主菜单列表同样内置 `MScrollbar`。\n\n```vue preview src=\"./demos/HorizontalMode.zh.vue\"\n```\n\n## 反色（深色侧栏）\n\n`inverted` 配合 `MLayoutSider` 的 `inverted`，用于深色背景侧栏。\n\n```vue preview src=\"./demos/InvertedDarkSider.zh.vue\"\n```\n\n## 弹出模式\n\n`popup` + `v-model` 将菜单作为浮层，默认 Teleport 到 `body` 并相对**默认插槽触发器**定位（无插槽时回退到最后一次指针位置）。点击外部或选中叶子项后关闭。\n\n```vue preview src=\"./demos/PopupMode.zh.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `model` | `MenuItem[]` | — | 菜单项，可嵌套 `items`。 |\n| `popup` | `boolean` | `false` | 浮层模式；配合 `v-model` 控制显隐。 |\n| `modelValue` | `boolean` | `false` | popup 可见性（`v-model`）。 |\n| `placement` | `'bottom-start' \\| 'bottom-end' \\| 'top-start' \\| 'top-end'` | `'bottom-start'` | popup 相对触发器的位置。 |\n| `selectedKey` | `string \\| null` | `null` | 当前选中项 key（`v-model:selected-key`）。 |\n| `collapsed` | `boolean` | `false` | 图标模式；子菜单以右侧飞出层展示。 |\n| `collapsedWidth` | `number` | `80` | 折叠宽度（px），用于居中图标。 |\n| `indent` | `number` | `12` | 每层额外左内边距（px）。 |\n| `rootIndent` | `number` | `16` | 根级左内边距（px）。 |\n| `accordion` | `boolean` | `false` | 手风琴：同时只展开一个一级子菜单。 |\n| `defaultExpandedKeys` | `string[]` | `[]` | 默认展开的 submenu keys。 |\n| `expandedKeys` | `string[]` | — | 受控展开 keys（`v-model:expanded-keys`）。 |\n| `defaultExpandAll` | `boolean` | `false` | 初始展开全部子菜单。 |\n| `mode` | `'vertical' \\| 'horizontal'` | `'vertical'` | 布局方向。 |\n| `inverted` | `boolean` | `false` | 反色样式，适合深色侧栏。 |\n| `embedded` | `boolean` | `!popup` | 嵌入布局：去边框与最小宽度。 |\n| `teleport` | `boolean` | `true` | popup 时 Teleport 到 `appendTo`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Teleport 目标；未传时使用 ConfigProvider。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | popup 可见性变化。 |\n| `update:selectedKey` | `string \\| null` | 选中项变化。 |\n| `update:expandedKeys` | `string[]` | 展开项变化。 |\n| `select` | `MenuItem` | 点击叶子项（非 disabled / separator）。 |\n\n## Slots\n\n| 插槽 | 说明 |\n| --- | --- |\n| `default` | popup 模式的触发器锚点（如按钮）；菜单相对其定位。 |\n\n## MenuItem\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `key` | `string` | 唯一标识；未传时使用 `label`。 |\n| `label` | `string` | 展示文本。 |\n| `icon` | `string` | [Tabler 图标名](/components/Icon) 或字符。 |\n| `command` | `() => void` | 点击回调（与 `select` 事件同时触发）。 |\n| `disabled` | `boolean` | 禁用。 |\n| `separator` | `boolean` | 分隔线（忽略其他字段）。 |\n| `items` | `MenuItem[]` | 子菜单。 |\n\n## 类型\n\n<h4 id=\"MenuItem\">MenuItem</h4>\n\n`model` 数组项，支持嵌套：\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string\n  to?: string | RouteLocationRaw   // 有 vue-router 时用 RouterLink\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\n`key` 未传时用 `label` 作为标识。`separator: true` 时渲染分隔线。更多见 [API 类型](/docs/types)。\n"
+          "markdown": "---\ntitle: Menu\ncategory: 04 / NAVIGATION\ndescription: 垂直/水平导航菜单，支持多级嵌套、受控选中、手风琴展开与折叠侧栏飞出层。\n---\n\n# Menu\n\n基于 `model` 渲染的**导航菜单**，适合后台侧栏、顶栏导航等场景。支持：\n\n- 多级嵌套 `items` 与受控 `selectedKey`\n- 展开路径自动跟随选中项；`accordion` 手风琴\n- `collapsed` 图标模式 + 右侧飞出子菜单（Popover）\n- 非 popup 时默认 `embedded`，无边框铺满 `MLayoutSider`\n\n> 单层悬停子菜单见 [TieredMenu](/components/TieredMenu)；顶栏菜单见 [Menubar](/components/Menubar)；操作列表见 [Dropdown](/components/Dropdown)。\n\n## 引入\n\n```ts\nimport type {MenuItem} from 'morya-ui';\nimport {  MMenu } from 'morya-ui'\n```\n\n## 导航选中\n\n为叶子项设置稳定的 `key`，用 `v-model:selected-key` 与路由同步；点击时触发 `select`。\n\n```vue preview src=\"./demos/Selection.zh.vue\"\n```\n\n未提供 `key` 时会回退到 `label`；生产环境建议始终显式设置 `key`。\n\n## 嵌套子菜单\n\n点击带子项的节点可展开/收起；选中子项时父级会显示 `child-active` 高亮。\n\n```vue preview src=\"./demos/NestedSubmenus.zh.vue\"\n```\n\n## 手风琴与展开控制\n\n`accordion` 同时只保留一个一级子菜单展开。`defaultExpandedKeys` / `v-model:expanded-keys` 可受控展开项；变更 `selectedKey` 时会自动展开其祖先路径。\n\n```vue preview src=\"./demos/AccordionAndExpandedKeys.zh.vue\"\n```\n\n## 折叠与飞出层\n\n`collapsed` 隐藏文案，仅保留图标；**每个可折叠展示的菜单项必须提供 `icon`**（否则折叠后几乎空白）。悬停时在右侧显示 `MTooltip` 标签，带子项的节点还会弹出飞出层（`.m-menu--flyout`）。飞出层经 `MPopover` Teleport 到 `body`，不会被侧栏裁剪。`collapsed-width` 应与侧栏折叠宽度一致，用于居中图标。\n\n使用 `item.to` 时菜单项会渲染为 `RouterLink` / `<a>`；组件已重置链接的默认蓝色下划线，视觉与普通菜单项一致。\n\n```vue preview src=\"./demos/CollapsedAndFlyout.zh.vue\"\n```\n\n## 嵌入 Layout 侧栏\n\n推荐结构：**全局 Header + 下方 `has-sider` Layout**。菜单放在 `MLayoutSider` 内，与 `v-model:collapsed` 联动。\n\n```vue preview src=\"./demos/EmbedInLayoutSider.zh.vue\"\n```\n\n## 水平菜单\n\n`mode=\"horizontal\"` 用于顶栏一级导航；选中/含选中子项的一级项以**底部指示条**高亮，子菜单经 `MPopover` 以下拉飞出层展示（Teleport + 主题滚动条），选中后自动关闭。`popup` 模式的主菜单列表同样内置 `MScrollbar`。\n\n```vue preview src=\"./demos/HorizontalMode.zh.vue\"\n```\n\n## 反色（深色侧栏）\n\n`inverted` 配合 `MLayoutSider` 的 `inverted`，用于深色背景侧栏。\n\n```vue preview src=\"./demos/InvertedDarkSider.zh.vue\"\n```\n\n## 弹出模式\n\n`popup` + `v-model` 将菜单作为浮层，默认 Teleport 到 `body` 并相对**默认插槽触发器**定位（无插槽时回退到最后一次指针位置）。面板最小宽度跟随触发器（下限 `10rem`），下方空间不足时向上翻转；打开期间触发器容器带 `m-menu-popup--open` / `data-open` 与 `aria-expanded`，便于自定义高亮。点击外部或选中叶子项后关闭。\n\n```vue preview src=\"./demos/PopupMode.zh.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `model` | `MenuItem[]` | — | 菜单项，可嵌套 `items`。 |\n| `popup` | `boolean` | `false` | 浮层模式；配合 `v-model` 控制显隐。 |\n| `modelValue` | `boolean` | `false` | popup 可见性（`v-model`）。 |\n| `placement` | `'bottom-start' \\| 'bottom-end' \\| 'top-start' \\| 'top-end'` | `'bottom-start'` | popup 相对触发器的位置。 |\n| `selectedKey` | `string \\| null` | `null` | 当前选中项 key（`v-model:selected-key`）。 |\n| `collapsed` | `boolean` | `false` | 图标模式；子菜单以右侧飞出层展示。 |\n| `collapsedWidth` | `number` | `80` | 折叠宽度（px），用于居中图标。 |\n| `indent` | `number` | `12` | 每层额外左内边距（px）。 |\n| `rootIndent` | `number` | `16` | 根级左内边距（px）。 |\n| `accordion` | `boolean` | `false` | 手风琴：同时只展开一个一级子菜单。 |\n| `defaultExpandedKeys` | `string[]` | `[]` | 默认展开的 submenu keys。 |\n| `expandedKeys` | `string[]` | — | 受控展开 keys（`v-model:expanded-keys`）。 |\n| `defaultExpandAll` | `boolean` | `false` | 初始展开全部子菜单。 |\n| `mode` | `'vertical' \\| 'horizontal'` | `'vertical'` | 布局方向。 |\n| `inverted` | `boolean` | `false` | 反色样式，适合深色侧栏。 |\n| `embedded` | `boolean` | `!popup` | 嵌入布局：去边框与最小宽度。 |\n| `teleport` | `boolean` | `true` | popup 时 Teleport 到 `appendTo`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Teleport 目标；未传时使用 ConfigProvider。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | popup 可见性变化。 |\n| `update:selectedKey` | `string \\| null` | 选中项变化。 |\n| `update:expandedKeys` | `string[]` | 展开项变化。 |\n| `select` | `MenuItem` | 点击叶子项（非 disabled / separator）。 |\n\n## Slots\n\n| 插槽 | 说明 |\n| --- | --- |\n| `default` | popup 模式的触发器锚点（如按钮）；菜单相对其定位。 |\n\n## MenuItem\n\n| 字段 | 类型 | 说明 |\n| --- | --- | --- |\n| `key` | `string` | 唯一标识；未传时使用 `label`。 |\n| `label` | `string` | 展示文本。 |\n| `icon` | `string \\| Component` | [Tabler 图标名](/components/Icon)、别名，或自定义 Vue 图标组件。 |\n| `command` | `() => void` | 点击回调（与 `select` 事件同时触发）。 |\n| `disabled` | `boolean` | 禁用。 |\n| `separator` | `boolean` | 分隔线（忽略其他字段）。 |\n| `items` | `MenuItem[]` | 子菜单。 |\n\n## 类型\n\n<h4 id=\"MenuItem\">MenuItem</h4>\n\n`model` 数组项，支持嵌套：\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string | Component        // 内置图标名、别名，或自定义 Vue 组件\n  to?: string | RouteLocationRaw   // 有 vue-router 时用 RouterLink\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\n`key` 未传时用 `label` 作为标识。`separator: true` 时渲染分隔线。更多见 [API 类型](/docs/types)。\n"
         },
         "en-US": {
           "title": "Menu",
@@ -17457,7 +17618,7 @@
             {
               "id": "horizontal-mode",
               "title": "Horizontal mode",
-              "body": "`mode=\"horizontal\"` for top nav bars. Submenus open in a `MPopover` dropdown flyout (teleported, themed scrollbar) and close after selection. Popup mode root menus also use built-in `MScrollbar`.\n\n```vue preview src=\"./demos/HorizontalMode.en.vue\"\n```"
+              "body": "`mode=\"horizontal\"` for top nav bars. The selected top-level item (or one containing the selection) is highlighted with a **bottom indicator bar**. Submenus open in a `MPopover` dropdown flyout (teleported, themed scrollbar) and close after selection. Popup mode root menus also use built-in `MScrollbar`.\n\n```vue preview src=\"./demos/HorizontalMode.en.vue\"\n```"
             },
             {
               "id": "inverted-dark-sider",
@@ -17467,7 +17628,7 @@
             {
               "id": "popup-mode",
               "title": "Popup mode",
-              "body": "`popup` + `v-model` renders a floating menu, teleported to `body` by default and positioned against the **default-slot trigger** (falls back to the last pointer position when no slot). Closes on outside click or leaf selection.\n\n```vue preview src=\"./demos/PopupMode.en.vue\"\n```"
+              "body": "`popup` + `v-model` renders a floating menu, teleported to `body` by default and positioned against the **default-slot trigger** (falls back to the last pointer position when no slot). The panel's minimum width follows the trigger (floor `10rem`) and flips upward when space below runs out. While open, the trigger wrapper carries `m-menu-popup--open` / `data-open` and `aria-expanded` for custom highlight. Closes on outside click or leaf selection.\n\n```vue preview src=\"./demos/PopupMode.en.vue\"\n```"
             },
             {
               "id": "props",
@@ -17487,15 +17648,15 @@
             {
               "id": "menuitem",
               "title": "MenuItem",
-              "body": "| Field | Type | Description |\n| --- | --- | --- |\n| `key` | `string` | Unique id; falls back to `label`. |\n| `label` | `string` | Display text. |\n| `icon` | `string` | [Tabler icon name](/components/Icon) or character. |\n| `command` | `() => void` | Click handler (also emits `select`). |\n| `disabled` | `boolean` | Disabled state. |\n| `separator` | `boolean` | Separator line (ignores other fields). |\n| `items` | `MenuItem[]` | Child menu items. |"
+              "body": "| Field | Type | Description |\n| --- | --- | --- |\n| `key` | `string` | Unique id; falls back to `label`. |\n| `label` | `string` | Display text. |\n| `icon` | `string \\| Component` | [Tabler icon name](/components/Icon), alias, or custom Vue icon component. |\n| `command` | `() => void` | Click handler (also emits `select`). |\n| `disabled` | `boolean` | Disabled state. |\n| `separator` | `boolean` | Separator line (ignores other fields). |\n| `items` | `MenuItem[]` | Child menu items. |"
             },
             {
               "id": "types",
               "title": "Types",
-              "body": "<h4 id=\"MenuItem\">MenuItem</h4>\n\nEach entry in `model`; supports nesting:\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string\n  to?: string | RouteLocationRaw   // RouterLink when vue-router is installed\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\nWhen `key` is omitted, `label` is used as the identifier. `separator: true` renders a divider. See also [API types](/docs/types)."
+              "body": "<h4 id=\"MenuItem\">MenuItem</h4>\n\nEach entry in `model`; supports nesting:\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string | Component        // Built-in icon name, alias, or custom Vue component\n  to?: string | RouteLocationRaw   // RouterLink when vue-router is installed\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\nWhen `key` is omitted, `label` is used as the identifier. `separator: true` renders a divider. See also [API types](/docs/types)."
             }
           ],
-          "markdown": "---\ntitle: Menu\ncategory: 04 / NAVIGATION\ndescription: Vertical/horizontal navigation menu with nested items, controlled selection, accordion, and collapsed flyout submenus.\n---\n\n# Menu\n\nNavigation menu rendered from a `model`. Typical uses: admin sidebar, top navigation.\n\n- Nested `items` with controlled `selectedKey`\n- Auto-expand ancestor path when selection changes; optional `accordion`\n- `collapsed` icon rail with right-side flyout submenus (Popover)\n- Non-popup menus default to `embedded` (borderless, full-width in `MLayoutSider`)\n\n> One-level hover submenus: [TieredMenu](/components/TieredMenu). Top bar: [Menubar](/components/Menubar). Action lists: [Dropdown](/components/Dropdown).\n\n## Import\n\n```ts\nimport type {MenuItem} from 'morya-ui';\nimport {  MMenu } from 'morya-ui'\n```\n\n## Selection\n\nGive leaf items stable `key` values; sync with routing via `v-model:selected-key`. Emits `select` on click.\n\n```vue preview src=\"./demos/Selection.en.vue\"\n```\n\nIf `key` is omitted, `label` is used as fallback. Prefer explicit keys in production.\n\n## Nested submenus\n\nClick a group to expand/collapse. When a child is selected, the parent shows `child-active` styling.\n\n```vue preview src=\"./demos/NestedSubmenus.en.vue\"\n```\n\n## Accordion & expanded keys\n\n`accordion` keeps at most one top-level group open. Use `defaultExpandedKeys` or `v-model:expanded-keys` for controlled expansion. Changing `selectedKey` auto-expands its ancestor path.\n\n```vue preview src=\"./demos/AccordionAndExpandedKeys.en.vue\"\n```\n\n## Collapsed & flyout\n\n`collapsed` hides labels and keeps icons. Hover shows an `MTooltip` with the label; groups also open a right flyout (`.m-menu--flyout`) via `MPopover` teleported to `body`, so it is not clipped by the sider. Set `collapsed-width` to match the sider width for centered icons.\n\n```vue preview src=\"./demos/CollapsedAndFlyout.en.vue\"\n```\n\n## Embed in Layout sider\n\nRecommended shell: **global Header + inner `has-sider` Layout**. Bind menu `collapsed` to `MLayoutSider`.\n\n```vue preview src=\"./demos/EmbedInLayoutSider.en.vue\"\n```\n\n## Horizontal mode\n\n`mode=\"horizontal\"` for top nav bars. Submenus open in a `MPopover` dropdown flyout (teleported, themed scrollbar) and close after selection. Popup mode root menus also use built-in `MScrollbar`.\n\n```vue preview src=\"./demos/HorizontalMode.en.vue\"\n```\n\n## Inverted (dark sider)\n\nUse `inverted` with `MLayoutSider`'s `inverted` on dark backgrounds.\n\n```vue preview src=\"./demos/InvertedDarkSider.en.vue\"\n```\n\n## Popup mode\n\n`popup` + `v-model` renders a floating menu, teleported to `body` by default and positioned against the **default-slot trigger** (falls back to the last pointer position when no slot). Closes on outside click or leaf selection.\n\n```vue preview src=\"./demos/PopupMode.en.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `model` | `MenuItem[]` | — | Menu items; may nest `items`. |\n| `popup` | `boolean` | `false` | Overlay mode; use with `v-model`. |\n| `modelValue` | `boolean` | `false` | Popup visibility (`v-model`). |\n| `placement` | `'bottom-start' \\| 'bottom-end' \\| 'top-start' \\| 'top-end'` | `'bottom-start'` | Popup position relative to the trigger. |\n| `selectedKey` | `string \\| null` | `null` | Selected item key (`v-model:selected-key`). |\n| `collapsed` | `boolean` | `false` | Icon-only; submenus in right flyout. |\n| `collapsedWidth` | `number` | `80` | Collapsed width (px) for icon centering. |\n| `indent` | `number` | `12` | Extra padding-left per level (px). |\n| `rootIndent` | `number` | `16` | Root item padding-left (px). |\n| `accordion` | `boolean` | `false` | Only one top-level submenu open at a time. |\n| `defaultExpandedKeys` | `string[]` | `[]` | Initially expanded submenu keys. |\n| `expandedKeys` | `string[]` | — | Controlled expanded keys (`v-model:expanded-keys`). |\n| `defaultExpandAll` | `boolean` | `false` | Expand all submenus initially. |\n| `mode` | `'vertical' \\| 'horizontal'` | `'vertical'` | Layout direction. |\n| `inverted` | `boolean` | `false` | Inverted colors for dark sider. |\n| `embedded` | `boolean` | `!popup` | Embed in layout (no border/min-width). |\n| `teleport` | `boolean` | `true` | Teleport popup to `appendTo`. |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Teleport target; falls back to ConfigProvider. |\n| `transition` | `string \\| false` | `'scale-fade'` | Enter/exit motion preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | Popup visibility changed. |\n| `update:selectedKey` | `string \\| null` | Selected item changed. |\n| `update:expandedKeys` | `string[]` | Expanded keys changed. |\n| `select` | `MenuItem` | Leaf clicked (not disabled / separator). |\n\n## Slots\n\n| Slot | Description |\n| --- | --- |\n| `default` | Popup trigger anchor (e.g. a button); menu positions against it. |\n\n## MenuItem\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `key` | `string` | Unique id; falls back to `label`. |\n| `label` | `string` | Display text. |\n| `icon` | `string` | [Tabler icon name](/components/Icon) or character. |\n| `command` | `() => void` | Click handler (also emits `select`). |\n| `disabled` | `boolean` | Disabled state. |\n| `separator` | `boolean` | Separator line (ignores other fields). |\n| `items` | `MenuItem[]` | Child menu items. |\n\n## Types\n\n<h4 id=\"MenuItem\">MenuItem</h4>\n\nEach entry in `model`; supports nesting:\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string\n  to?: string | RouteLocationRaw   // RouterLink when vue-router is installed\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\nWhen `key` is omitted, `label` is used as the identifier. `separator: true` renders a divider. See also [API types](/docs/types).\n"
+          "markdown": "---\ntitle: Menu\ncategory: 04 / NAVIGATION\ndescription: Vertical/horizontal navigation menu with nested items, controlled selection, accordion, and collapsed flyout submenus.\n---\n\n# Menu\n\nNavigation menu rendered from a `model`. Typical uses: admin sidebar, top navigation.\n\n- Nested `items` with controlled `selectedKey`\n- Auto-expand ancestor path when selection changes; optional `accordion`\n- `collapsed` icon rail with right-side flyout submenus (Popover)\n- Non-popup menus default to `embedded` (borderless, full-width in `MLayoutSider`)\n\n> One-level hover submenus: [TieredMenu](/components/TieredMenu). Top bar: [Menubar](/components/Menubar). Action lists: [Dropdown](/components/Dropdown).\n\n## Import\n\n```ts\nimport type {MenuItem} from 'morya-ui';\nimport {  MMenu } from 'morya-ui'\n```\n\n## Selection\n\nGive leaf items stable `key` values; sync with routing via `v-model:selected-key`. Emits `select` on click.\n\n```vue preview src=\"./demos/Selection.en.vue\"\n```\n\nIf `key` is omitted, `label` is used as fallback. Prefer explicit keys in production.\n\n## Nested submenus\n\nClick a group to expand/collapse. When a child is selected, the parent shows `child-active` styling.\n\n```vue preview src=\"./demos/NestedSubmenus.en.vue\"\n```\n\n## Accordion & expanded keys\n\n`accordion` keeps at most one top-level group open. Use `defaultExpandedKeys` or `v-model:expanded-keys` for controlled expansion. Changing `selectedKey` auto-expands its ancestor path.\n\n```vue preview src=\"./demos/AccordionAndExpandedKeys.en.vue\"\n```\n\n## Collapsed & flyout\n\n`collapsed` hides labels and keeps icons. Hover shows an `MTooltip` with the label; groups also open a right flyout (`.m-menu--flyout`) via `MPopover` teleported to `body`, so it is not clipped by the sider. Set `collapsed-width` to match the sider width for centered icons.\n\n```vue preview src=\"./demos/CollapsedAndFlyout.en.vue\"\n```\n\n## Embed in Layout sider\n\nRecommended shell: **global Header + inner `has-sider` Layout**. Bind menu `collapsed` to `MLayoutSider`.\n\n```vue preview src=\"./demos/EmbedInLayoutSider.en.vue\"\n```\n\n## Horizontal mode\n\n`mode=\"horizontal\"` for top nav bars. The selected top-level item (or one containing the selection) is highlighted with a **bottom indicator bar**. Submenus open in a `MPopover` dropdown flyout (teleported, themed scrollbar) and close after selection. Popup mode root menus also use built-in `MScrollbar`.\n\n```vue preview src=\"./demos/HorizontalMode.en.vue\"\n```\n\n## Inverted (dark sider)\n\nUse `inverted` with `MLayoutSider`'s `inverted` on dark backgrounds.\n\n```vue preview src=\"./demos/InvertedDarkSider.en.vue\"\n```\n\n## Popup mode\n\n`popup` + `v-model` renders a floating menu, teleported to `body` by default and positioned against the **default-slot trigger** (falls back to the last pointer position when no slot). The panel's minimum width follows the trigger (floor `10rem`) and flips upward when space below runs out. While open, the trigger wrapper carries `m-menu-popup--open` / `data-open` and `aria-expanded` for custom highlight. Closes on outside click or leaf selection.\n\n```vue preview src=\"./demos/PopupMode.en.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `model` | `MenuItem[]` | — | Menu items; may nest `items`. |\n| `popup` | `boolean` | `false` | Overlay mode; use with `v-model`. |\n| `modelValue` | `boolean` | `false` | Popup visibility (`v-model`). |\n| `placement` | `'bottom-start' \\| 'bottom-end' \\| 'top-start' \\| 'top-end'` | `'bottom-start'` | Popup position relative to the trigger. |\n| `selectedKey` | `string \\| null` | `null` | Selected item key (`v-model:selected-key`). |\n| `collapsed` | `boolean` | `false` | Icon-only; submenus in right flyout. |\n| `collapsedWidth` | `number` | `80` | Collapsed width (px) for icon centering. |\n| `indent` | `number` | `12` | Extra padding-left per level (px). |\n| `rootIndent` | `number` | `16` | Root item padding-left (px). |\n| `accordion` | `boolean` | `false` | Only one top-level submenu open at a time. |\n| `defaultExpandedKeys` | `string[]` | `[]` | Initially expanded submenu keys. |\n| `expandedKeys` | `string[]` | — | Controlled expanded keys (`v-model:expanded-keys`). |\n| `defaultExpandAll` | `boolean` | `false` | Expand all submenus initially. |\n| `mode` | `'vertical' \\| 'horizontal'` | `'vertical'` | Layout direction. |\n| `inverted` | `boolean` | `false` | Inverted colors for dark sider. |\n| `embedded` | `boolean` | `!popup` | Embed in layout (no border/min-width). |\n| `teleport` | `boolean` | `true` | Teleport popup to `appendTo`. |\n| `appendTo` | `string \\| HTMLElement \\| 'self' \\| false` | `'body'` | Teleport target; falls back to ConfigProvider. |\n| `transition` | `string \\| false` | `'scale-fade'` | Enter/exit motion preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `pt` | [RootPassThrough](/docs/types#RootPassThrough) `{ root? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Payload | Description |\n| --- | --- | --- |\n| `update:modelValue` | `boolean` | Popup visibility changed. |\n| `update:selectedKey` | `string \\| null` | Selected item changed. |\n| `update:expandedKeys` | `string[]` | Expanded keys changed. |\n| `select` | `MenuItem` | Leaf clicked (not disabled / separator). |\n\n## Slots\n\n| Slot | Description |\n| --- | --- |\n| `default` | Popup trigger anchor (e.g. a button); menu positions against it. |\n\n## MenuItem\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `key` | `string` | Unique id; falls back to `label`. |\n| `label` | `string` | Display text. |\n| `icon` | `string \\| Component` | [Tabler icon name](/components/Icon), alias, or custom Vue icon component. |\n| `command` | `() => void` | Click handler (also emits `select`). |\n| `disabled` | `boolean` | Disabled state. |\n| `separator` | `boolean` | Separator line (ignores other fields). |\n| `items` | `MenuItem[]` | Child menu items. |\n\n## Types\n\n<h4 id=\"MenuItem\">MenuItem</h4>\n\nEach entry in `model`; supports nesting:\n\n```ts\ninterface MenuItem {\n  key?: string\n  label?: string\n  icon?: string | Component        // Built-in icon name, alias, or custom Vue component\n  to?: string | RouteLocationRaw   // RouterLink when vue-router is installed\n  command?: () => void\n  disabled?: boolean\n  separator?: boolean\n  items?: MenuItem[]\n}\n```\n\nWhen `key` is omitted, `label` is used as the identifier. `separator: true` renders a divider. See also [API types](/docs/types).\n"
         }
       }
     },
@@ -20784,7 +20945,7 @@
           "description": "显示清除按钮。"
         },
         {
-          "name": "allowClear",
+          "name": "clearable",
           "type": "boolean | null",
           "default": "null",
           "description": "`cancel` 的别名；传入时优先。"
@@ -20966,12 +21127,12 @@
             {
               "id": "half",
               "title": "Half",
-              "body": "`allowHalf` 支持 0.5 步进。`allowClear` 是 `cancel` 的别名，传入时优先。\n\n```vue preview src=\"./demos/Half.vue\"\n```"
+              "body": "`allowHalf` 支持 0.5 步进。`clearable` 是 `cancel` 的别名，传入时优先。\n\n```vue preview src=\"./demos/Half.vue\"\n```"
             },
             {
               "id": "props",
               "title": "Props",
-              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | 当前评分。 |\n| `stars` | `number` | `5` | 星星数量。 |\n| `cancel` | `boolean` | `true` | 显示清除按钮。 |\n| `allowClear` | `boolean \\| null` | `null` | `cancel` 的别名；传入时优先。 |\n| `allowHalf` | `boolean` | `false` | 允许半星。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `ariaLabel` | `string` | — | — |\n| `errorMessage` | `string` | — | — |\n| `helpText` | `string` | — | — |\n| `invalid` | `boolean` | — | — |\n| `label` | `string` | — | — |\n| `size` | [MSizeInput](/docs/types#MSizeInput) | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |"
+              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | 当前评分。 |\n| `stars` | `number` | `5` | 星星数量。 |\n| `cancel` | `boolean` | `true` | 显示清除按钮。 |\n| `clearable` | `boolean \\| null` | `null` | `cancel` 的别名；传入时优先。 |\n| `allowHalf` | `boolean` | `false` | 允许半星。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `ariaLabel` | `string` | — | — |\n| `errorMessage` | `string` | — | — |\n| `helpText` | `string` | — | — |\n| `invalid` | `boolean` | — | — |\n| `label` | `string` | — | — |\n| `size` | [MSizeInput](/docs/types#MSizeInput) | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |"
             },
             {
               "id": "events",
@@ -20984,7 +21145,7 @@
               "body": "| 插槽名 | 说明 |\n| --- | --- |\n| `icon` | 自定义星级 `{ active }`。 |"
             }
           ],
-          "markdown": "---\ntitle: Rating\ncategory: 02 / FORM\ndescription: 星级评分控件，支持清除与只读。\n---\n\n# Rating\n\n点击星星进行评分。默认提供清除按钮。\n\n## 引入\n\n```ts\nimport { MRating } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Readonly\n\n```vue preview src=\"./demos/Readonly.vue\"\n```\n\n## Half\n\n`allowHalf` 支持 0.5 步进。`allowClear` 是 `cancel` 的别名，传入时优先。\n\n```vue preview src=\"./demos/Half.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | 当前评分。 |\n| `stars` | `number` | `5` | 星星数量。 |\n| `cancel` | `boolean` | `true` | 显示清除按钮。 |\n| `allowClear` | `boolean \\| null` | `null` | `cancel` 的别名；传入时优先。 |\n| `allowHalf` | `boolean` | `false` | 允许半星。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `ariaLabel` | `string` | — | — |\n| `errorMessage` | `string` | — | — |\n| `helpText` | `string` | — | — |\n| `invalid` | `boolean` | — | — |\n| `label` | `string` | — | — |\n| `size` | [MSizeInput](/docs/types#MSizeInput) | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `number` | 评分变化。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| `icon` | 自定义星级 `{ active }`。 |\n"
+          "markdown": "---\ntitle: Rating\ncategory: 02 / FORM\ndescription: 星级评分控件，支持清除与只读。\n---\n\n# Rating\n\n点击星星进行评分。默认提供清除按钮。\n\n## 引入\n\n```ts\nimport { MRating } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Readonly\n\n```vue preview src=\"./demos/Readonly.vue\"\n```\n\n## Half\n\n`allowHalf` 支持 0.5 步进。`clearable` 是 `cancel` 的别名，传入时优先。\n\n```vue preview src=\"./demos/Half.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | 当前评分。 |\n| `stars` | `number` | `5` | 星星数量。 |\n| `cancel` | `boolean` | `true` | 显示清除按钮。 |\n| `clearable` | `boolean \\| null` | `null` | `cancel` 的别名；传入时优先。 |\n| `allowHalf` | `boolean` | `false` | 允许半星。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `ariaLabel` | `string` | — | — |\n| `errorMessage` | `string` | — | — |\n| `helpText` | `string` | — | — |\n| `invalid` | `boolean` | — | — |\n| `label` | `string` | — | — |\n| `size` | [MSizeInput](/docs/types#MSizeInput) | — | — |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 透传，见 [样式与 attrs](/docs/attrs). |\n\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `number` | 评分变化。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| `icon` | 自定义星级 `{ active }`。 |\n"
         },
         "en-US": {
           "title": "Rating",
@@ -21013,12 +21174,12 @@
             {
               "id": "half",
               "title": "Half",
-              "body": "`allowHalf` enables 0.5 increments. `allowClear` is an alias of `cancel` and takes precedence when set.\n\n```vue preview src=\"./demos/Half.vue\"\n```"
+              "body": "`allowHalf` enables 0.5 increments. `clearable` is an alias of `cancel` and takes precedence when set.\n\n```vue preview src=\"./demos/Half.vue\"\n```"
             },
             {
               "id": "props",
               "title": "Props",
-              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | Current rating. |\n| `stars` | `number` | `5` | Number of stars. |\n| `cancel` | `boolean` | `true` | Show the clear button. |\n| `allowClear` | `boolean \\| null` | `null` | Alias of `cancel`; takes precedence when set. |\n| `allowHalf` | `boolean` | `false` | Allow half-star values. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |"
+              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | Current rating. |\n| `stars` | `number` | `5` | Number of stars. |\n| `cancel` | `boolean` | `true` | Show the clear button. |\n| `clearable` | `boolean \\| null` | `null` | Alias of `cancel`; takes precedence when set. |\n| `allowHalf` | `boolean` | `false` | Allow half-star values. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |"
             },
             {
               "id": "events",
@@ -21031,7 +21192,7 @@
               "body": "| Slot | Description |\n| --- | --- |\n| `icon` | Custom star `{ active }`. |"
             }
           ],
-          "markdown": "---\ntitle: Rating\ncategory: 02 / FORM\ndescription: Star rating control with clear and readonly support.\n---\n\n# Rating\n\nClick stars to rate. A clear button is shown by default.\n\n## Import\n\n```ts\nimport { MRating } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Readonly\n\n```vue preview src=\"./demos/Readonly.vue\"\n```\n\n## Half\n\n`allowHalf` enables 0.5 increments. `allowClear` is an alias of `cancel` and takes precedence when set.\n\n```vue preview src=\"./demos/Half.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | Current rating. |\n| `stars` | `number` | `5` | Number of stars. |\n| `cancel` | `boolean` | `true` | Show the clear button. |\n| `allowClear` | `boolean \\| null` | `null` | Alias of `cancel`; takes precedence when set. |\n| `allowHalf` | `boolean` | `false` | Allow half-star values. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `number` | Emitted when the rating changes. |\n\n## Slots\n\n| Slot | Description |\n| --- | --- |\n| `icon` | Custom star `{ active }`. |\n"
+          "markdown": "---\ntitle: Rating\ncategory: 02 / FORM\ndescription: Star rating control with clear and readonly support.\n---\n\n# Rating\n\nClick stars to rate. A clear button is shown by default.\n\n## Import\n\n```ts\nimport { MRating } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Readonly\n\n```vue preview src=\"./demos/Readonly.vue\"\n```\n\n## Half\n\n`allowHalf` enables 0.5 increments. `clearable` is an alias of `cancel` and takes precedence when set.\n\n```vue preview src=\"./demos/Half.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `number` | `0` | Current rating. |\n| `stars` | `number` | `5` | Number of stars. |\n| `cancel` | `boolean` | `true` | Show the clear button. |\n| `clearable` | `boolean \\| null` | `null` | Alias of `cancel`; takes precedence when set. |\n| `allowHalf` | `boolean` | `false` | Allow half-star values. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through; see [Styling & attrs](/docs/attrs). |\n\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `number` | Emitted when the rating changes. |\n\n## Slots\n\n| Slot | Description |\n| --- | --- |\n| `icon` | Custom star `{ active }`. |\n"
         }
       }
     },
@@ -22217,8 +22378,8 @@
       "name": "Select",
       "exportName": "MSelect",
       "category": "02 / FORM",
-      "description": "表单选择器：mode=\"multiple\" | \"tags\"、labelInValue、fieldNames、showSearch、allowClear、optionRender、popupRender。",
-      "descriptionEn": "Form select: mode=multiple|tags, labelInValue, fieldNames, showSearch, allowClear, optionRender, popupRender.",
+      "description": "表单选择器：mode=\"multiple\" | \"tags\"、labelInValue、fieldNames、showSearch、clearable、optionRender、popupRender。",
+      "descriptionEn": "Form select: mode=multiple|tags, labelInValue, fieldNames, showSearch, clearable, optionRender, popupRender.",
       "import": "import { MSelect } from 'morya-ui'",
       "props": [
         {
@@ -22336,7 +22497,7 @@
           "description": "折叠标签摘要。"
         },
         {
-          "name": "allowClear",
+          "name": "clearable",
           "type": "boolean",
           "default": "false",
           "description": "有值时显示清除按钮。"
@@ -22529,7 +22690,7 @@
           "sectionId": "clearable",
           "lang": "vue",
           "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<string | number | undefined>('design')\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n]\n</script>\n\n<template>\n  <MSelect v-model=\"value\" label=\"Team\" :options=\"options\" allow-clear />\n</template>",
+          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<string | number | undefined>('design')\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n]\n</script>\n\n<template>\n  <MSelect v-model=\"value\" label=\"Team\" :options=\"options\" clearable />\n</template>",
           "locale": "zh-CN"
         },
         {
@@ -22574,7 +22735,7 @@
           "sectionId": "多选与标签创建",
           "lang": "vue",
           "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<Array<string | number>>(['design'])\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n  { label: 'Research', value: 'research' },\n]\n</script>\n\n<template>\n  <div style=\"display:grid;gap:1rem;width:min(24rem,100%)\">\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" allow-clear placeholder=\"Teams\" />\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" :max-tag-count=\"1\" placeholder=\"Collapsed tags\" />\n  </div>\n</template>",
+          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<Array<string | number>>(['design'])\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n  { label: 'Research', value: 'research' },\n]\n</script>\n\n<template>\n  <div style=\"display:grid;gap:1rem;width:min(24rem,100%)\">\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" clearable placeholder=\"Teams\" />\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" :max-tag-count=\"1\" placeholder=\"Collapsed tags\" />\n  </div>\n</template>",
           "locale": "zh-CN"
         },
         {
@@ -22691,7 +22852,7 @@
           "sectionId": "clearable",
           "lang": "vue",
           "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<string | number | undefined>('design')\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n]\n</script>\n\n<template>\n  <MSelect v-model=\"value\" label=\"Team\" :options=\"options\" allow-clear />\n</template>",
+          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<string | number | undefined>('design')\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n]\n</script>\n\n<template>\n  <MSelect v-model=\"value\" label=\"Team\" :options=\"options\" clearable />\n</template>",
           "locale": "en-US"
         },
         {
@@ -22736,7 +22897,7 @@
           "sectionId": "multiple-and-tag-creation",
           "lang": "vue",
           "preview": true,
-          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<Array<string | number>>(['design'])\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n  { label: 'Research', value: 'research' },\n]\n</script>\n\n<template>\n  <div style=\"display:grid;gap:1rem;width:min(24rem,100%)\">\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" allow-clear placeholder=\"Teams\" />\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" :max-tag-count=\"1\" placeholder=\"Collapsed tags\" />\n  </div>\n</template>",
+          "code": "<script setup lang=\"ts\">\nimport { MSelect } from 'morya-ui'\nimport { ref } from 'vue'\n\nconst value = ref<Array<string | number>>(['design'])\nconst options = [\n  { label: 'Design', value: 'design' },\n  { label: 'Development', value: 'dev' },\n  { label: 'Research', value: 'research' },\n]\n</script>\n\n<template>\n  <div style=\"display:grid;gap:1rem;width:min(24rem,100%)\">\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" clearable placeholder=\"Teams\" />\n    <MSelect v-model=\"value\" :options=\"options\" mode=\"multiple\" :max-tag-count=\"1\" placeholder=\"Collapsed tags\" />\n  </div>\n</template>",
           "locale": "en-US"
         },
         {
@@ -22833,7 +22994,7 @@
       "locales": {
         "zh-CN": {
           "title": "Select",
-          "description": "表单选择器：mode=\"multiple\" | \"tags\"、labelInValue、fieldNames、showSearch、allowClear、optionRender、popupRender。",
+          "description": "表单选择器：mode=\"multiple\" | \"tags\"、labelInValue、fieldNames、showSearch、clearable、optionRender、popupRender。",
           "sections": [
             {
               "id": "overview",
@@ -22853,7 +23014,7 @@
             {
               "id": "clearable",
               "title": "Clearable",
-              "body": "`allowClear` 在已选值时显示清除按钮。\n\n```vue preview src=\"./demos/Clearable.vue\"\n```"
+              "body": "`clearable` 在已选值时显示清除按钮。\n\n```vue preview src=\"./demos/Clearable.vue\"\n```"
             },
             {
               "id": "invalid",
@@ -22923,7 +23084,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue` | — | 选中值；`mode` 时数组，`labelInValue` 时为 `{ value, label }`。 |\n| `options` | `Array<`[SelectOption](/docs/types#SelectOption)` \\| `[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | — | 选项列表；可混入 `{ label, options }` 分组。 |\n| `fieldNames` | `{ label?, value?, disabled?, options? }` | — | 重映射原始选项字段名。 |\n| `labelInValue` | `boolean` | `false` | `v-model` / 事件返回 `{ value, label }`。 |\n| `label` | `string` | — | 字段标签。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `placeholder` | `string` | — | 占位文案。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `required` | `boolean` | `false` | 表单必填辅助。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | — | 输入面样式。 |\n| `fluid` | `boolean` | `false` | 宽度撑满容器。 |\n| `mode` | `'multiple' \\| 'tags'` | — | 多选；`tags` 额外允许创建选项。 |\n| `remote` | `boolean` | `false` | 关闭本地筛选，输入时发出 `search`。 |\n| `loading` | `boolean` | `false` | 异步加载中。 |\n| `maxTagCount` | `number` | — | 多选时最多展示的标签数，其余折叠。 |\n| `maxTagPlaceholder` | `(omitted) => MRenderable` | locale `moreTags` | 折叠标签摘要。 |\n| `allowClear` | `boolean` | `false` | 有值时显示清除按钮。 |\n| `notFoundContent` | `MRenderable` | locale `emptyOptions` | 空选项 / 无匹配文案。 |\n| `showSearch` | `boolean` | `false` | 浮层中显示搜索输入。 |\n| `optionFilterProp` | `string` | `'label'` | 本地匹配读取的选项字段。 |\n| `filterOption` | `boolean \\| (input, option) => boolean` | 按 `optionFilterProp` 匹配 | 本地过滤规则；`false` 关闭。 |\n| `optionRender` | `(option) => MRenderable` | — | 自定义选项行（优先于 `option` 插槽）。 |\n| `popupRender` | `(menu) => VNodeChild` | — | 包裹浮层菜单。 |\n| `suffixIcon` | `IconName` | `'chevron-down'` | 右侧图标。 |\n| `teleport` | `boolean` | `true` | 菜单 Teleport；默认挂到 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self'` | `'body'` | 挂载目标；`'self'` 就地渲染。 |\n| `placement` | `'bottom-start' \\| 'bottom-end'` | `'bottom-start'` | 菜单对齐。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 菜单进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `id` | `string` | — | 控件 id。 |\n| `errorMessage` | `string` | — | 校验错误文案；与 `invalid` 同时生效时优先展示。 |\n| `name` | `string` | — | 辅助原生 name（存在隐藏 input 时）。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传。 |\n| `virtual` | `boolean` | 自动 | `true` 强制虚拟列表；`false` 关闭；默认选项 ≥80 时开启。 |"
+              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue` | — | 选中值；`mode` 时数组，`labelInValue` 时为 `{ value, label }`。 |\n| `options` | `Array<`[SelectOption](/docs/types#SelectOption)` \\| `[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | — | 选项列表；可混入 `{ label, options }` 分组。 |\n| `fieldNames` | `{ label?, value?, disabled?, options? }` | — | 重映射原始选项字段名。 |\n| `labelInValue` | `boolean` | `false` | `v-model` / 事件返回 `{ value, label }`。 |\n| `label` | `string` | — | 字段标签。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `placeholder` | `string` | — | 占位文案。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `required` | `boolean` | `false` | 表单必填辅助。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | — | 输入面样式。 |\n| `fluid` | `boolean` | `false` | 宽度撑满容器。 |\n| `mode` | `'multiple' \\| 'tags'` | — | 多选；`tags` 额外允许创建选项。 |\n| `remote` | `boolean` | `false` | 关闭本地筛选，输入时发出 `search`。 |\n| `loading` | `boolean` | `false` | 异步加载中。 |\n| `maxTagCount` | `number` | — | 多选时最多展示的标签数，其余折叠。 |\n| `maxTagPlaceholder` | `(omitted) => MRenderable` | locale `moreTags` | 折叠标签摘要。 |\n| `clearable` | `boolean` | `false` | 有值时显示清除按钮。 |\n| `notFoundContent` | `MRenderable` | locale `emptyOptions` | 空选项 / 无匹配文案。 |\n| `showSearch` | `boolean` | `false` | 浮层中显示搜索输入。 |\n| `optionFilterProp` | `string` | `'label'` | 本地匹配读取的选项字段。 |\n| `filterOption` | `boolean \\| (input, option) => boolean` | 按 `optionFilterProp` 匹配 | 本地过滤规则；`false` 关闭。 |\n| `optionRender` | `(option) => MRenderable` | — | 自定义选项行（优先于 `option` 插槽）。 |\n| `popupRender` | `(menu) => VNodeChild` | — | 包裹浮层菜单。 |\n| `suffixIcon` | `IconName` | `'chevron-down'` | 右侧图标。 |\n| `teleport` | `boolean` | `true` | 菜单 Teleport；默认挂到 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self'` | `'body'` | 挂载目标；`'self'` 就地渲染。 |\n| `placement` | `'bottom-start' \\| 'bottom-end'` | `'bottom-start'` | 菜单对齐。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 菜单进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `id` | `string` | — | 控件 id。 |\n| `errorMessage` | `string` | — | 校验错误文案；与 `invalid` 同时生效时优先展示。 |\n| `name` | `string` | — | 辅助原生 name（存在隐藏 input 时）。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传。 |\n| `virtual` | `boolean` | 自动 | `true` 强制虚拟列表；`false` 关闭；默认选项 ≥80 时开启。 |"
             },
             {
               "id": "events",
@@ -22941,11 +23102,11 @@
               "body": "<h4 id=\"SelectOption\">SelectOption</h4>\n\n```ts\ninterface SelectOption {\n  label: string\n  value: string | number\n  disabled?: boolean\n}\n```\n\n<h4 id=\"SelectOptionGroup\">SelectOptionGroup</h4>\n\n```ts\ninterface SelectOptionGroup {\n  label: string\n  items: SelectOption[]\n}\n```\n\n<h4 id=\"SelectModelValue\">SelectModelValue</h4>\n\n单选为 `string | number`；`multiple` 时为 `(string | number)[]`。详见 [API 类型](/docs/types#SelectModelValue)。"
             }
           ],
-          "markdown": "---\ntitle: Select\ncategory: 02 / FORM\ndescription: 表单选择器：mode=\"multiple\" | \"tags\"、labelInValue、fieldNames、showSearch、allowClear、optionRender、popupRender。\n---\n\n# Select\n\n表单选择器，用于从选项列表中选择一个或多个值。\n\n**与 Dropdown 的区别：** `MSelect` 是表单控件；动作菜单请使用 `MDropdown`。\n\n## 引入\n\n```ts\nimport { MSelect } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Clearable\n\n`allowClear` 在已选值时显示清除按钮。\n\n```vue preview src=\"./demos/Clearable.vue\"\n```\n\n## Invalid\n\n```vue preview src=\"./demos/Invalid.vue\"\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n```\n\n## Sizes\n\n```vue preview src=\"./demos/Sizes.vue\"\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n```\n\n## 多选与标签创建\n\n`mode=\"multiple\"` 时 `v-model` 为数组，已选项以可移除标签展示，菜单在选择后保持打开。\n`mode=\"tags\"` 在此基础上允许用当前搜索词创建选项（回车或点击「创建」行）。\n\n```vue preview src=\"./demos/Multiple.vue\"\n```\n\n```vue preview src=\"./demos/Tag.vue\"\n```\n\n`maxTagCount` 折叠多余标签；折叠摘要由 `maxTagPlaceholder` 自定义，默认取 locale `moreTags`。\n\n## labelInValue\n\n打开后 `v-model` 与事件载荷为 `{ value, label }`：\n\n```vue\n<MSelect v-model=\"picked\" label-in-value :options=\"options\" />\n```\n\n## fieldNames\n\n选项字段名不叫 `label` / `value` 时，用 `fieldNames` 重映射（支持分组子项）：\n\n```vue\n<MSelect :options=\"[{ title: 'Apple', id: 'apple' }]\" :field-names=\"{ label: 'title', value: 'id' }\" />\n```\n\n多余字段会被保留，因此 `optionFilterProp` 可以指向自定义键。\n\n## Group\n\n`options` 可混入 `{ label, options }` 分组（[SelectOptionGroup](/docs/types#SelectOptionGroup)），菜单显示分组标题行；分组本身不可选，搜索会按组内选项过滤并隐藏空组。\n\n```vue preview src=\"./demos/Group.vue\"\n```\n\n## 搜索与过滤\n\n`showSearch` 在浮层中显示搜索输入。本地过滤规则：\n\n- `filterOption` 省略 / `true`：按 `optionFilterProp`（默认 `label`）模糊匹配；\n- `filterOption: false`：关闭本地过滤；\n- `filterOption: (input, option) => boolean`：自定义谓词。\n\n`remote` 跳过本地过滤并随输入发出 `search`（需配合 `showSearch`），用 `loading` 表示请求进行中。\n\n```vue preview src=\"./demos/Remote.vue\"\n```\n\n## 自定义选项渲染\n\n- `optionRender(option)`：自定义每行内容（优先于 `option` 插槽）；\n- `popupRender(menu)`：在浮层外层包一层自定义结构；\n- `suffixIcon`：替换右侧箭头图标。\n\n```vue preview src=\"./demos/HeaderFooter.vue\"\n```\n\n## Empty\n\n无选项或筛选无结果时展示空态文案；可用 `notFoundContent` 覆盖，否则读取 ConfigProvider `locale.emptyOptions`。\n\n```vue preview src=\"./demos/Empty.zh.vue\"\n```\n\n## Teleport\n\n菜单默认 Teleport 到 `body`（`teleport` + `appendTo`）。设 `append-to=\"self\"` 或 `teleport={false}` 可就地渲染。\n\n```vue preview src=\"./demos/Teleport.vue\"\n```\n\n## 样式与 attrs\n\n除控件 **事件** 外，fallthrough attrs 落在外层 field 根；`@keydown` 等由内部 combobox 接收。`placeholder`、`name` 优先用 props。下拉位置用 `placement` / `appendTo`；改面板 DOM 用 `pt`（键名见 Props）。详见 [样式与 attrs](/docs/attrs)。\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue` | — | 选中值；`mode` 时数组，`labelInValue` 时为 `{ value, label }`。 |\n| `options` | `Array<`[SelectOption](/docs/types#SelectOption)` \\| `[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | — | 选项列表；可混入 `{ label, options }` 分组。 |\n| `fieldNames` | `{ label?, value?, disabled?, options? }` | — | 重映射原始选项字段名。 |\n| `labelInValue` | `boolean` | `false` | `v-model` / 事件返回 `{ value, label }`。 |\n| `label` | `string` | — | 字段标签。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `placeholder` | `string` | — | 占位文案。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `required` | `boolean` | `false` | 表单必填辅助。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | — | 输入面样式。 |\n| `fluid` | `boolean` | `false` | 宽度撑满容器。 |\n| `mode` | `'multiple' \\| 'tags'` | — | 多选；`tags` 额外允许创建选项。 |\n| `remote` | `boolean` | `false` | 关闭本地筛选，输入时发出 `search`。 |\n| `loading` | `boolean` | `false` | 异步加载中。 |\n| `maxTagCount` | `number` | — | 多选时最多展示的标签数，其余折叠。 |\n| `maxTagPlaceholder` | `(omitted) => MRenderable` | locale `moreTags` | 折叠标签摘要。 |\n| `allowClear` | `boolean` | `false` | 有值时显示清除按钮。 |\n| `notFoundContent` | `MRenderable` | locale `emptyOptions` | 空选项 / 无匹配文案。 |\n| `showSearch` | `boolean` | `false` | 浮层中显示搜索输入。 |\n| `optionFilterProp` | `string` | `'label'` | 本地匹配读取的选项字段。 |\n| `filterOption` | `boolean \\| (input, option) => boolean` | 按 `optionFilterProp` 匹配 | 本地过滤规则；`false` 关闭。 |\n| `optionRender` | `(option) => MRenderable` | — | 自定义选项行（优先于 `option` 插槽）。 |\n| `popupRender` | `(menu) => VNodeChild` | — | 包裹浮层菜单。 |\n| `suffixIcon` | `IconName` | `'chevron-down'` | 右侧图标。 |\n| `teleport` | `boolean` | `true` | 菜单 Teleport；默认挂到 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self'` | `'body'` | 挂载目标；`'self'` 就地渲染。 |\n| `placement` | `'bottom-start' \\| 'bottom-end'` | `'bottom-start'` | 菜单对齐。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 菜单进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `id` | `string` | — | 控件 id。 |\n| `errorMessage` | `string` | — | 校验错误文案；与 `invalid` 同时生效时优先展示。 |\n| `name` | `string` | — | 辅助原生 name（存在隐藏 input 时）。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传。 |\n| `virtual` | `boolean` | 自动 | `true` 强制虚拟列表；`false` 关闭；默认选项 ≥80 时开启。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | [SelectModelValue](/docs/types#SelectModelValue) | 值变化。 |\n| `change` | [SelectModelValue](/docs/types#SelectModelValue) | 选择完成或清除。 |\n| `clear` | — | 点击清除时触发。 |\n| `show` | — | 菜单打开。 |\n| `hide` | — | 菜单关闭。 |\n| `search` | `string` | 筛选词变化（`filter` / `remote`）。 |\n| `select` | `value, option` | 选中某一项。 |\n| `deselect` | `value, option` | 多选模式下取消某一项。 |\n| `create` | [SelectOption](/docs/types#SelectOption) `{ label, value, disabled? }` | `tag` 模式下创建了新选项。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| `value` | 自定义触发器展示（单选）。 |\n| `option` | 选项 `{ option }`。 |\n| `header` | 浮窗列表上方的自定义内容。 |\n| `footer` | 浮窗列表下方的自定义内容。 |\n\n## 类型\n\n<h4 id=\"SelectOption\">SelectOption</h4>\n\n```ts\ninterface SelectOption {\n  label: string\n  value: string | number\n  disabled?: boolean\n}\n```\n\n<h4 id=\"SelectOptionGroup\">SelectOptionGroup</h4>\n\n```ts\ninterface SelectOptionGroup {\n  label: string\n  items: SelectOption[]\n}\n```\n\n<h4 id=\"SelectModelValue\">SelectModelValue</h4>\n\n单选为 `string | number`；`multiple` 时为 `(string | number)[]`。详见 [API 类型](/docs/types#SelectModelValue)。\n"
+          "markdown": "---\ntitle: Select\ncategory: 02 / FORM\ndescription: 表单选择器：mode=\"multiple\" | \"tags\"、labelInValue、fieldNames、showSearch、clearable、optionRender、popupRender。\n---\n\n# Select\n\n表单选择器，用于从选项列表中选择一个或多个值。\n\n**与 Dropdown 的区别：** `MSelect` 是表单控件；动作菜单请使用 `MDropdown`。\n\n## 引入\n\n```ts\nimport { MSelect } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Clearable\n\n`clearable` 在已选值时显示清除按钮。\n\n```vue preview src=\"./demos/Clearable.vue\"\n```\n\n## Invalid\n\n```vue preview src=\"./demos/Invalid.vue\"\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n```\n\n## Sizes\n\n```vue preview src=\"./demos/Sizes.vue\"\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n```\n\n## 多选与标签创建\n\n`mode=\"multiple\"` 时 `v-model` 为数组，已选项以可移除标签展示，菜单在选择后保持打开。\n`mode=\"tags\"` 在此基础上允许用当前搜索词创建选项（回车或点击「创建」行）。\n\n```vue preview src=\"./demos/Multiple.vue\"\n```\n\n```vue preview src=\"./demos/Tag.vue\"\n```\n\n`maxTagCount` 折叠多余标签；折叠摘要由 `maxTagPlaceholder` 自定义，默认取 locale `moreTags`。\n\n## labelInValue\n\n打开后 `v-model` 与事件载荷为 `{ value, label }`：\n\n```vue\n<MSelect v-model=\"picked\" label-in-value :options=\"options\" />\n```\n\n## fieldNames\n\n选项字段名不叫 `label` / `value` 时，用 `fieldNames` 重映射（支持分组子项）：\n\n```vue\n<MSelect :options=\"[{ title: 'Apple', id: 'apple' }]\" :field-names=\"{ label: 'title', value: 'id' }\" />\n```\n\n多余字段会被保留，因此 `optionFilterProp` 可以指向自定义键。\n\n## Group\n\n`options` 可混入 `{ label, options }` 分组（[SelectOptionGroup](/docs/types#SelectOptionGroup)），菜单显示分组标题行；分组本身不可选，搜索会按组内选项过滤并隐藏空组。\n\n```vue preview src=\"./demos/Group.vue\"\n```\n\n## 搜索与过滤\n\n`showSearch` 在浮层中显示搜索输入。本地过滤规则：\n\n- `filterOption` 省略 / `true`：按 `optionFilterProp`（默认 `label`）模糊匹配；\n- `filterOption: false`：关闭本地过滤；\n- `filterOption: (input, option) => boolean`：自定义谓词。\n\n`remote` 跳过本地过滤并随输入发出 `search`（需配合 `showSearch`），用 `loading` 表示请求进行中。\n\n```vue preview src=\"./demos/Remote.vue\"\n```\n\n## 自定义选项渲染\n\n- `optionRender(option)`：自定义每行内容（优先于 `option` 插槽）；\n- `popupRender(menu)`：在浮层外层包一层自定义结构；\n- `suffixIcon`：替换右侧箭头图标。\n\n```vue preview src=\"./demos/HeaderFooter.vue\"\n```\n\n## Empty\n\n无选项或筛选无结果时展示空态文案；可用 `notFoundContent` 覆盖，否则读取 ConfigProvider `locale.emptyOptions`。\n\n```vue preview src=\"./demos/Empty.zh.vue\"\n```\n\n## Teleport\n\n菜单默认 Teleport 到 `body`（`teleport` + `appendTo`）。设 `append-to=\"self\"` 或 `teleport={false}` 可就地渲染。\n\n```vue preview src=\"./demos/Teleport.vue\"\n```\n\n## 样式与 attrs\n\n除控件 **事件** 外，fallthrough attrs 落在外层 field 根；`@keydown` 等由内部 combobox 接收。`placeholder`、`name` 优先用 props。下拉位置用 `placement` / `appendTo`；改面板 DOM 用 `pt`（键名见 Props）。详见 [样式与 attrs](/docs/attrs)。\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue` | — | 选中值；`mode` 时数组，`labelInValue` 时为 `{ value, label }`。 |\n| `options` | `Array<`[SelectOption](/docs/types#SelectOption)` \\| `[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | — | 选项列表；可混入 `{ label, options }` 分组。 |\n| `fieldNames` | `{ label?, value?, disabled?, options? }` | — | 重映射原始选项字段名。 |\n| `labelInValue` | `boolean` | `false` | `v-model` / 事件返回 `{ value, label }`。 |\n| `label` | `string` | — | 字段标签。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `placeholder` | `string` | — | 占位文案。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `required` | `boolean` | `false` | 表单必填辅助。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | — | 输入面样式。 |\n| `fluid` | `boolean` | `false` | 宽度撑满容器。 |\n| `mode` | `'multiple' \\| 'tags'` | — | 多选；`tags` 额外允许创建选项。 |\n| `remote` | `boolean` | `false` | 关闭本地筛选，输入时发出 `search`。 |\n| `loading` | `boolean` | `false` | 异步加载中。 |\n| `maxTagCount` | `number` | — | 多选时最多展示的标签数，其余折叠。 |\n| `maxTagPlaceholder` | `(omitted) => MRenderable` | locale `moreTags` | 折叠标签摘要。 |\n| `clearable` | `boolean` | `false` | 有值时显示清除按钮。 |\n| `notFoundContent` | `MRenderable` | locale `emptyOptions` | 空选项 / 无匹配文案。 |\n| `showSearch` | `boolean` | `false` | 浮层中显示搜索输入。 |\n| `optionFilterProp` | `string` | `'label'` | 本地匹配读取的选项字段。 |\n| `filterOption` | `boolean \\| (input, option) => boolean` | 按 `optionFilterProp` 匹配 | 本地过滤规则；`false` 关闭。 |\n| `optionRender` | `(option) => MRenderable` | — | 自定义选项行（优先于 `option` 插槽）。 |\n| `popupRender` | `(menu) => VNodeChild` | — | 包裹浮层菜单。 |\n| `suffixIcon` | `IconName` | `'chevron-down'` | 右侧图标。 |\n| `teleport` | `boolean` | `true` | 菜单 Teleport；默认挂到 `body`。 |\n| `appendTo` | `string \\| HTMLElement \\| 'self'` | `'body'` | 挂载目标；`'self'` 就地渲染。 |\n| `placement` | `'bottom-start' \\| 'bottom-end'` | `'bottom-start'` | 菜单对齐。 |\n| `transition` | `string \\| false` | `'scale-fade'` | 菜单进出场动效预设；`false` / `'none'` 关闭。见[动效](/docs/motion)。 |\n| `id` | `string` | — | 控件 id。 |\n| `errorMessage` | `string` | — | 校验错误文案；与 `invalid` 同时生效时优先展示。 |\n| `name` | `string` | — | 辅助原生 name（存在隐藏 input 时）。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传。 |\n| `virtual` | `boolean` | 自动 | `true` 强制虚拟列表；`false` 关闭；默认选项 ≥80 时开启。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | [SelectModelValue](/docs/types#SelectModelValue) | 值变化。 |\n| `change` | [SelectModelValue](/docs/types#SelectModelValue) | 选择完成或清除。 |\n| `clear` | — | 点击清除时触发。 |\n| `show` | — | 菜单打开。 |\n| `hide` | — | 菜单关闭。 |\n| `search` | `string` | 筛选词变化（`filter` / `remote`）。 |\n| `select` | `value, option` | 选中某一项。 |\n| `deselect` | `value, option` | 多选模式下取消某一项。 |\n| `create` | [SelectOption](/docs/types#SelectOption) `{ label, value, disabled? }` | `tag` 模式下创建了新选项。 |\n\n## Slots\n\n| 插槽名 | 说明 |\n| --- | --- |\n| `value` | 自定义触发器展示（单选）。 |\n| `option` | 选项 `{ option }`。 |\n| `header` | 浮窗列表上方的自定义内容。 |\n| `footer` | 浮窗列表下方的自定义内容。 |\n\n## 类型\n\n<h4 id=\"SelectOption\">SelectOption</h4>\n\n```ts\ninterface SelectOption {\n  label: string\n  value: string | number\n  disabled?: boolean\n}\n```\n\n<h4 id=\"SelectOptionGroup\">SelectOptionGroup</h4>\n\n```ts\ninterface SelectOptionGroup {\n  label: string\n  items: SelectOption[]\n}\n```\n\n<h4 id=\"SelectModelValue\">SelectModelValue</h4>\n\n单选为 `string | number`；`multiple` 时为 `(string | number)[]`。详见 [API 类型](/docs/types#SelectModelValue)。\n"
         },
         "en-US": {
           "title": "Select",
-          "description": "Form select: mode=multiple|tags, labelInValue, fieldNames, showSearch, allowClear, optionRender, popupRender.",
+          "description": "Form select: mode=multiple|tags, labelInValue, fieldNames, showSearch, clearable, optionRender, popupRender.",
           "sections": [
             {
               "id": "overview",
@@ -22965,7 +23126,7 @@
             {
               "id": "clearable",
               "title": "Clearable",
-              "body": "`allowClear` shows a clear button when a value is selected.\n\n```vue preview src=\"./demos/Clearable.vue\"\n\n```"
+              "body": "`clearable` shows a clear button when a value is selected.\n\n```vue preview src=\"./demos/Clearable.vue\"\n\n```"
             },
             {
               "id": "invalid",
@@ -23035,12 +23196,12 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| Prop                | Type                                                                                                      | Default                     | Description                                                                      |\n| ------------------- | --------------------------------------------------------------------------------------------------------- | --------------------------- | -------------------------------------------------------------------------------- |\n| `modelValue`        | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue`                                       | —                           | Selected value; an array in `mode`, or `{ value, label }` with `labelInValue`.   |\n| `options`           | `Array<`[SelectOption](/docs/types#SelectOption)`\\|`[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | —                           | Options list; may mix in `{ label, options }` groups.                            |\n| `fieldNames`        | `{ label?, value?, disabled?, options? }`                                                                 | —                           | Remap raw option keys.                                                           |\n| `labelInValue`      | `boolean`                                                                                                 | `false`                     | `v-model` / events return `{ value, label }`.                                    |\n| `label`             | `string`                                                                                                  | —                           | Field label.                                                                     |\n| `helpText`          | `string`                                                                                                  | —                           | Help text.                                                                       |\n| `invalid`           | `boolean`                                                                                                 | `false`                     | Invalid state.                                                                   |\n| `status`            | `'error' \\| 'warning'`                                                                                    | —                           | Visual status; `error` matches invalid, `warning` is caution chrome.             |\n| `placeholder`       | `string`                                                                                                  | —                           | Placeholder text.                                                                |\n| `disabled`          | `boolean`                                                                                                 | `false`                     | Disabled.                                                                        |\n| `required`          | `boolean`                                                                                                 | `false`                     | Form required hint.                                                              |\n| `size`              | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'`                                                              | —                           | Size; inherits Form `size` when omitted.                                         |\n| `variant`           | `'outlined' \\| 'filled'`                                                                                  | —                           | Input surface style.                                                             |\n| `fluid`             | `boolean`                                                                                                 | `false`                     | Stretch to the container width.                                                  |\n| `mode`              | `'multiple' \\| 'tags'`                                                                                    | —                           | Multi-value; `tags` also allows creating options.                                |\n| `remote`            | `boolean`                                                                                                 | `false`                     | Skip local filtering and emit `search`.                                          |\n| `loading`           | `boolean`                                                                                                 | `false`                     | Async loading state.                                                             |\n| `maxTagCount`       | `number`                                                                                                  | —                           | Max visible tags; extras collapse.                                               |\n| `maxTagPlaceholder` | `(omitted) => MRenderable`                                                                                | `moreTags` locale           | Collapsed-tag summary.                                                           |\n| `allowClear`        | `boolean`                                                                                                 | `false`                     | Show a clear button when a value is selected.                                    |\n| `notFoundContent`   | `MRenderable`                                                                                             | `emptyOptions` locale       | Empty / no-match copy.                                                           |\n| `showSearch`        | `boolean`                                                                                                 | `false`                     | Render a search input in the popup.                                              |\n| `optionFilterProp`  | `string`                                                                                                  | `'label'`                   | Option key used for local matching.                                              |\n| `filterOption`      | `boolean \\| (input, option) => boolean`                                                                   | match on `optionFilterProp` | Local filter rule; `false` disables.                                             |\n| `optionRender`      | `(option) => MRenderable`                                                                                 | —                           | Custom option row (wins over the `option` slot).                                 |\n| `popupRender`       | `(menu) => VNodeChild`                                                                                    | —                           | Wrap the popup menu.                                                             |\n| `suffixIcon`        | `IconName`                                                                                                | `'chevron-down'`            | Trigger icon.                                                                    |\n| `teleport`          | `boolean`                                                                                                 | `true`                      | Menu Teleport. Mounts to `body` by default.                                      |\n| `appendTo`          | `string \\| HTMLElement \\| 'self'`                                                                         | `'body'`                    | Mount target. `'self'` renders in place.                                         |\n| `placement`         | `'bottom-start' \\| 'bottom-end'`                                                                          | `'bottom-start'`            | Menu alignment.                                                                  |\n| `transition`        | `string \\| false`                                                                                         | `'scale-fade'`              | Menu enter/exit preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `id`                | `string`                                                                                                  | —                           | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | —                           | Validation copy; shown when combined with `invalid`.                             |\n| `name`              | `string`                                                                                                  | —                           | Native name helper (hidden input).                                               |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | —                           | Per-part DOM pass-through.                                                       |\n| `virtual`           | `boolean`                                                                                                 | auto                        | `true` forces virtualization; `false` disables; auto-on at 80+ options.          |\n| `id`                | `string`                                                                                                  | —                           | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | —                           | Validation error copy.                                                           |\n| `name`              | `string`                                                                                                  | —                           | Native name when a hidden input is present.                                      |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | —                           | Pass-through (`root`, `control`, …).                                             |"
+              "body": "| Prop                | Type                                                                                                      | Default                     | Description                                                                      |\n| ------------------- | --------------------------------------------------------------------------------------------------------- | --------------------------- | -------------------------------------------------------------------------------- |\n| `modelValue`        | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue`                                       | 鈥?                          | Selected value; an array in `mode`, or `{ value, label }` with `labelInValue`.   |\n| `options`           | `Array<`[SelectOption](/docs/types#SelectOption)`\\|`[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | 鈥?                          | Options list; may mix in `{ label, options }` groups.                            |\n| `fieldNames`        | `{ label?, value?, disabled?, options? }`                                                                 | 鈥?                          | Remap raw option keys.                                                           |\n| `labelInValue`      | `boolean`                                                                                                 | `false`                     | `v-model` / events return `{ value, label }`.                                    |\n| `label`             | `string`                                                                                                  | 鈥?                          | Field label.                                                                     |\n| `helpText`          | `string`                                                                                                  | 鈥?                          | Help text.                                                                       |\n| `invalid`           | `boolean`                                                                                                 | `false`                     | Invalid state.                                                                   |\n| `status`            | `'error' \\| 'warning'`                                                                                    | 鈥?                          | Visual status; `error` matches invalid, `warning` is caution chrome.             |\n| `placeholder`       | `string`                                                                                                  | 鈥?                          | Placeholder text.                                                                |\n| `disabled`          | `boolean`                                                                                                 | `false`                     | Disabled.                                                                        |\n| `required`          | `boolean`                                                                                                 | `false`                     | Form required hint.                                                              |\n| `size`              | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'`                                                              | 鈥?                          | Size; inherits Form `size` when omitted.                                         |\n| `variant`           | `'outlined' \\| 'filled'`                                                                                  | 鈥?                          | Input surface style.                                                             |\n| `fluid`             | `boolean`                                                                                                 | `false`                     | Stretch to the container width.                                                  |\n| `mode`              | `'multiple' \\| 'tags'`                                                                                    | 鈥?                          | Multi-value; `tags` also allows creating options.                                |\n| `remote`            | `boolean`                                                                                                 | `false`                     | Skip local filtering and emit `search`.                                          |\n| `loading`           | `boolean`                                                                                                 | `false`                     | Async loading state.                                                             |\n| `maxTagCount`       | `number`                                                                                                  | 鈥?                          | Max visible tags; extras collapse.                                               |\n| `maxTagPlaceholder` | `(omitted) => MRenderable`                                                                                | `moreTags` locale           | Collapsed-tag summary.                                                           |\n| `clearable`        | `boolean`                                                                                                 | `false`                     | Show a clear button when a value is selected.                                    |\n| `notFoundContent`   | `MRenderable`                                                                                             | `emptyOptions` locale       | Empty / no-match copy.                                                           |\n| `showSearch`        | `boolean`                                                                                                 | `false`                     | Render a search input in the popup.                                              |\n| `optionFilterProp`  | `string`                                                                                                  | `'label'`                   | Option key used for local matching.                                              |\n| `filterOption`      | `boolean \\| (input, option) => boolean`                                                                   | match on `optionFilterProp` | Local filter rule; `false` disables.                                             |\n| `optionRender`      | `(option) => MRenderable`                                                                                 | 鈥?                          | Custom option row (wins over the `option` slot).                                 |\n| `popupRender`       | `(menu) => VNodeChild`                                                                                    | 鈥?                          | Wrap the popup menu.                                                             |\n| `suffixIcon`        | `IconName`                                                                                                | `'chevron-down'`            | Trigger icon.                                                                    |\n| `teleport`          | `boolean`                                                                                                 | `true`                      | Menu Teleport. Mounts to `body` by default.                                      |\n| `appendTo`          | `string \\| HTMLElement \\| 'self'`                                                                         | `'body'`                    | Mount target. `'self'` renders in place.                                         |\n| `placement`         | `'bottom-start' \\| 'bottom-end'`                                                                          | `'bottom-start'`            | Menu alignment.                                                                  |\n| `transition`        | `string \\| false`                                                                                         | `'scale-fade'`              | Menu enter/exit preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `id`                | `string`                                                                                                  | 鈥?                          | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | 鈥?                          | Validation copy; shown when combined with `invalid`.                             |\n| `name`              | `string`                                                                                                  | 鈥?                          | Native name helper (hidden input).                                               |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | 鈥?                          | Per-part DOM pass-through.                                                       |\n| `virtual`           | `boolean`                                                                                                 | auto                        | `true` forces virtualization; `false` disables; auto-on at 80+ options.          |\n| `id`                | `string`                                                                                                  | 鈥?                          | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | 鈥?                          | Validation error copy.                                                           |\n| `name`              | `string`                                                                                                  | 鈥?                          | Native name when a hidden input is present.                                      |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | 鈥?                          | Pass-through (`root`, `control`, 鈥?.                                             |"
             },
             {
               "id": "events",
               "title": "Events",
-              "body": "| Event               | Prop                                                                   | Description                                                |\n| ------------------- | ---------------------------------------------------------------------- | ---------------------------------------------------------- |\n| `update:modelValue` | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted when the value changes.                            |\n| `change`            | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted after a selection or clear.                        |\n| `clear`             | —                                                                      | Emitted when clear is clicked.                             |\n| `show`              | —                                                                      | Emitted when the menu opens.                               |\n| `hide`              | —                                                                      | Emitted when the menu closes.                              |\n| `search`            | `string`                                                               | Emitted as the filter query changes (`filter` / `remote`). |\n| `select`            | `value, option`                                                        | Emitted when an option is selected.                        |\n| `deselect`          | `value, option`                                                        | Emitted when an option is deselected (multiple mode).      |\n| `create`            | [SelectOption](/docs/types#SelectOption) `{ label, value, disabled? }` | Emitted when `tag` creates a new option.                   |"
+              "body": "| Event               | Prop                                                                   | Description                                                |\n| ------------------- | ---------------------------------------------------------------------- | ---------------------------------------------------------- |\n| `update:modelValue` | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted when the value changes.                            |\n| `change`            | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted after a selection or clear.                        |\n| `clear`             | 鈥?                                                                     | Emitted when clear is clicked.                             |\n| `show`              | 鈥?                                                                     | Emitted when the menu opens.                               |\n| `hide`              | 鈥?                                                                     | Emitted when the menu closes.                              |\n| `search`            | `string`                                                               | Emitted as the filter query changes (`filter` / `remote`). |\n| `select`            | `value, option`                                                        | Emitted when an option is selected.                        |\n| `deselect`          | `value, option`                                                        | Emitted when an option is deselected (multiple mode).      |\n| `create`            | [SelectOption](/docs/types#SelectOption) `{ label, value, disabled? }` | Emitted when `tag` creates a new option.                   |"
             },
             {
               "id": "slots",
@@ -23053,7 +23214,7 @@
               "body": "<h4 id=\"SelectOption\">SelectOption</h4>\n\n```ts\ninterface SelectOption {\n  label: string;\n  value: string | number;\n  disabled?: boolean;\n}\n```\n\n<h4 id=\"SelectOptionGroup\">SelectOptionGroup</h4>\n\n```ts\ninterface SelectOptionGroup {\n  label: string;\n  items: SelectOption[];\n}\n```\n\n<h4 id=\"SelectModelValue\">SelectModelValue</h4>\n\nScalar when single-select; array when `multiple`. See [API types](/docs/types#SelectModelValue)."
             }
           ],
-          "markdown": "---\ntitle: Select\ncategory: 02 / FORM\ndescription: \"Form select: mode=multiple|tags, labelInValue, fieldNames, showSearch, allowClear, optionRender, popupRender.\"\n---\n\n# Select\n\nForm select for choosing one or more values from a list of options.\n\n**Unlike Dropdown:** `MSelect` is a form control. Use `MDropdown` for action menus.\n\n## Import\n\n```ts\nimport { MSelect } from \"morya-ui\";\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n\n```\n\n## Clearable\n\n`allowClear` shows a clear button when a value is selected.\n\n```vue preview src=\"./demos/Clearable.vue\"\n\n```\n\n## Invalid\n\n```vue preview src=\"./demos/Invalid.vue\"\n\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n\n```\n\n## Sizes\n\n```vue preview src=\"./demos/Sizes.vue\"\n\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n\n```\n\n## Multiple and tag creation\n\nWith `mode=\"multiple\"`, `v-model` is an array, selected values render as removable tags, and the menu stays open after a pick.\n`mode=\"tags\"` additionally lets the user create an option from the current query (Enter or the create row).\n\n```vue preview src=\"./demos/Multiple.vue\"\n\n```\n\n```vue preview src=\"./demos/Tag.vue\"\n\n```\n\n`maxTagCount` collapses extra tags; the summary is customizable via `maxTagPlaceholder` and defaults to the `moreTags` locale copy.\n\n## labelInValue\n\nWhen enabled, `v-model` and event payloads become `{ value, label }`:\n\n```vue\n<MSelect v-model=\"picked\" label-in-value :options=\"options\" />\n```\n\n## fieldNames\n\nRemap option keys when they are not `label` / `value` (works for group children too):\n\n```vue\n<MSelect\n  :options=\"[{ title: 'Apple', id: 'apple' }]\"\n  :field-names=\"{ label: 'title', value: 'id' }\"\n/>\n```\n\nExtra keys are preserved, so `optionFilterProp` can target a custom field.\n\n## Group\n\n`options` can mix in `{ label, options }` groups ([SelectOptionGroup](/docs/types#SelectOptionGroup)) to render group header rows. Groups are not selectable; searching narrows options within each group and hides empty groups.\n\n```vue preview src=\"./demos/Group.vue\"\n\n```\n\n## Search and filtering\n\n`showSearch` renders a search input in the popup. Local filtering rules:\n\n- `filterOption` omitted / `true`: fuzzy match on `optionFilterProp` (default `label`);\n- `filterOption: false`: disable local filtering;\n- `filterOption: (input, option) => boolean`: custom predicate.\n\n`remote` skips local filtering and emits `search` as the query changes (pair it with `showSearch`); use `loading` for in-flight requests.\n\n```vue preview src=\"./demos/Remote.vue\"\n\n```\n\n## Custom option rendering\n\n- `optionRender(option)`: custom row content (wins over the `option` slot);\n- `popupRender(menu)`: wrap the popup menu;\n- `suffixIcon`: replace the trigger chevron.\n\n```vue preview src=\"./demos/HeaderFooter.vue\"\n\n```\n\n## Empty\n\nShows empty-state text when there are no options or no matches. Override with `notFoundContent`, otherwise it reads ConfigProvider `locale.emptyOptions`.\n\n```vue preview src=\"./demos/Empty.en.vue\"\n\n```\n\n## Teleport\n\nThe menu Teleports to `body` by default (`teleport` + `appendTo`). Set `append-to=\"self\"` or `teleport={false}` to render in place.\n\n```vue preview src=\"./demos/Teleport.vue\"\n\n```\n\n## Styling & attrs\n\nFallthrough attrs except control **events** bind to the field wrapper; `@keydown` and similar listeners attach to the combobox. Prefer `placeholder` / `name` as props. Use `placement` / `appendTo` for the panel, or `pt` for inner DOM. See [Styling & attrs](/docs/attrs).\n\n## Props\n\n| Prop                | Type                                                                                                      | Default                     | Description                                                                      |\n| ------------------- | --------------------------------------------------------------------------------------------------------- | --------------------------- | -------------------------------------------------------------------------------- |\n| `modelValue`        | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue`                                       | —                           | Selected value; an array in `mode`, or `{ value, label }` with `labelInValue`.   |\n| `options`           | `Array<`[SelectOption](/docs/types#SelectOption)`\\|`[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | —                           | Options list; may mix in `{ label, options }` groups.                            |\n| `fieldNames`        | `{ label?, value?, disabled?, options? }`                                                                 | —                           | Remap raw option keys.                                                           |\n| `labelInValue`      | `boolean`                                                                                                 | `false`                     | `v-model` / events return `{ value, label }`.                                    |\n| `label`             | `string`                                                                                                  | —                           | Field label.                                                                     |\n| `helpText`          | `string`                                                                                                  | —                           | Help text.                                                                       |\n| `invalid`           | `boolean`                                                                                                 | `false`                     | Invalid state.                                                                   |\n| `status`            | `'error' \\| 'warning'`                                                                                    | —                           | Visual status; `error` matches invalid, `warning` is caution chrome.             |\n| `placeholder`       | `string`                                                                                                  | —                           | Placeholder text.                                                                |\n| `disabled`          | `boolean`                                                                                                 | `false`                     | Disabled.                                                                        |\n| `required`          | `boolean`                                                                                                 | `false`                     | Form required hint.                                                              |\n| `size`              | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'`                                                              | —                           | Size; inherits Form `size` when omitted.                                         |\n| `variant`           | `'outlined' \\| 'filled'`                                                                                  | —                           | Input surface style.                                                             |\n| `fluid`             | `boolean`                                                                                                 | `false`                     | Stretch to the container width.                                                  |\n| `mode`              | `'multiple' \\| 'tags'`                                                                                    | —                           | Multi-value; `tags` also allows creating options.                                |\n| `remote`            | `boolean`                                                                                                 | `false`                     | Skip local filtering and emit `search`.                                          |\n| `loading`           | `boolean`                                                                                                 | `false`                     | Async loading state.                                                             |\n| `maxTagCount`       | `number`                                                                                                  | —                           | Max visible tags; extras collapse.                                               |\n| `maxTagPlaceholder` | `(omitted) => MRenderable`                                                                                | `moreTags` locale           | Collapsed-tag summary.                                                           |\n| `allowClear`        | `boolean`                                                                                                 | `false`                     | Show a clear button when a value is selected.                                    |\n| `notFoundContent`   | `MRenderable`                                                                                             | `emptyOptions` locale       | Empty / no-match copy.                                                           |\n| `showSearch`        | `boolean`                                                                                                 | `false`                     | Render a search input in the popup.                                              |\n| `optionFilterProp`  | `string`                                                                                                  | `'label'`                   | Option key used for local matching.                                              |\n| `filterOption`      | `boolean \\| (input, option) => boolean`                                                                   | match on `optionFilterProp` | Local filter rule; `false` disables.                                             |\n| `optionRender`      | `(option) => MRenderable`                                                                                 | —                           | Custom option row (wins over the `option` slot).                                 |\n| `popupRender`       | `(menu) => VNodeChild`                                                                                    | —                           | Wrap the popup menu.                                                             |\n| `suffixIcon`        | `IconName`                                                                                                | `'chevron-down'`            | Trigger icon.                                                                    |\n| `teleport`          | `boolean`                                                                                                 | `true`                      | Menu Teleport. Mounts to `body` by default.                                      |\n| `appendTo`          | `string \\| HTMLElement \\| 'self'`                                                                         | `'body'`                    | Mount target. `'self'` renders in place.                                         |\n| `placement`         | `'bottom-start' \\| 'bottom-end'`                                                                          | `'bottom-start'`            | Menu alignment.                                                                  |\n| `transition`        | `string \\| false`                                                                                         | `'scale-fade'`              | Menu enter/exit preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `id`                | `string`                                                                                                  | —                           | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | —                           | Validation copy; shown when combined with `invalid`.                             |\n| `name`              | `string`                                                                                                  | —                           | Native name helper (hidden input).                                               |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | —                           | Per-part DOM pass-through.                                                       |\n| `virtual`           | `boolean`                                                                                                 | auto                        | `true` forces virtualization; `false` disables; auto-on at 80+ options.          |\n| `id`                | `string`                                                                                                  | —                           | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | —                           | Validation error copy.                                                           |\n| `name`              | `string`                                                                                                  | —                           | Native name when a hidden input is present.                                      |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | —                           | Pass-through (`root`, `control`, …).                                             |\n\n## Events\n\n| Event               | Prop                                                                   | Description                                                |\n| ------------------- | ---------------------------------------------------------------------- | ---------------------------------------------------------- |\n| `update:modelValue` | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted when the value changes.                            |\n| `change`            | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted after a selection or clear.                        |\n| `clear`             | —                                                                      | Emitted when clear is clicked.                             |\n| `show`              | —                                                                      | Emitted when the menu opens.                               |\n| `hide`              | —                                                                      | Emitted when the menu closes.                              |\n| `search`            | `string`                                                               | Emitted as the filter query changes (`filter` / `remote`). |\n| `select`            | `value, option`                                                        | Emitted when an option is selected.                        |\n| `deselect`          | `value, option`                                                        | Emitted when an option is deselected (multiple mode).      |\n| `create`            | [SelectOption](/docs/types#SelectOption) `{ label, value, disabled? }` | Emitted when `tag` creates a new option.                   |\n\n## Slots\n\n| Slot     | Description                                        |\n| -------- | -------------------------------------------------- |\n| `value`  | Custom single-select trigger display.              |\n| `option` | Option `{ option }`.                               |\n| `header` | Custom content above the option list in the popup. |\n| `footer` | Custom content below the option list in the popup. |\n\n## Types\n\n<h4 id=\"SelectOption\">SelectOption</h4>\n\n```ts\ninterface SelectOption {\n  label: string;\n  value: string | number;\n  disabled?: boolean;\n}\n```\n\n<h4 id=\"SelectOptionGroup\">SelectOptionGroup</h4>\n\n```ts\ninterface SelectOptionGroup {\n  label: string;\n  items: SelectOption[];\n}\n```\n\n<h4 id=\"SelectModelValue\">SelectModelValue</h4>\n\nScalar when single-select; array when `multiple`. See [API types](/docs/types#SelectModelValue).\n"
+          "markdown": "---\ntitle: Select\ncategory: 02 / FORM\ndescription: \"Form select: mode=multiple|tags, labelInValue, fieldNames, showSearch, clearable, optionRender, popupRender.\"\n---\n\n# Select\n\nForm select for choosing one or more values from a list of options.\n\n**Unlike Dropdown:** `MSelect` is a form control. Use `MDropdown` for action menus.\n\n## Import\n\n```ts\nimport { MSelect } from \"morya-ui\";\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n\n```\n\n## Clearable\n\n`clearable` shows a clear button when a value is selected.\n\n```vue preview src=\"./demos/Clearable.vue\"\n\n```\n\n## Invalid\n\n```vue preview src=\"./demos/Invalid.vue\"\n\n```\n\n## Disabled\n\n```vue preview src=\"./demos/Disabled.vue\"\n\n```\n\n## Sizes\n\n```vue preview src=\"./demos/Sizes.vue\"\n\n```\n\n## Fluid\n\n```vue preview src=\"./demos/Fluid.vue\"\n\n```\n\n## Multiple and tag creation\n\nWith `mode=\"multiple\"`, `v-model` is an array, selected values render as removable tags, and the menu stays open after a pick.\n`mode=\"tags\"` additionally lets the user create an option from the current query (Enter or the create row).\n\n```vue preview src=\"./demos/Multiple.vue\"\n\n```\n\n```vue preview src=\"./demos/Tag.vue\"\n\n```\n\n`maxTagCount` collapses extra tags; the summary is customizable via `maxTagPlaceholder` and defaults to the `moreTags` locale copy.\n\n## labelInValue\n\nWhen enabled, `v-model` and event payloads become `{ value, label }`:\n\n```vue\n<MSelect v-model=\"picked\" label-in-value :options=\"options\" />\n```\n\n## fieldNames\n\nRemap option keys when they are not `label` / `value` (works for group children too):\n\n```vue\n<MSelect\n  :options=\"[{ title: 'Apple', id: 'apple' }]\"\n  :field-names=\"{ label: 'title', value: 'id' }\"\n/>\n```\n\nExtra keys are preserved, so `optionFilterProp` can target a custom field.\n\n## Group\n\n`options` can mix in `{ label, options }` groups ([SelectOptionGroup](/docs/types#SelectOptionGroup)) to render group header rows. Groups are not selectable; searching narrows options within each group and hides empty groups.\n\n```vue preview src=\"./demos/Group.vue\"\n\n```\n\n## Search and filtering\n\n`showSearch` renders a search input in the popup. Local filtering rules:\n\n- `filterOption` omitted / `true`: fuzzy match on `optionFilterProp` (default `label`);\n- `filterOption: false`: disable local filtering;\n- `filterOption: (input, option) => boolean`: custom predicate.\n\n`remote` skips local filtering and emits `search` as the query changes (pair it with `showSearch`); use `loading` for in-flight requests.\n\n```vue preview src=\"./demos/Remote.vue\"\n\n```\n\n## Custom option rendering\n\n- `optionRender(option)`: custom row content (wins over the `option` slot);\n- `popupRender(menu)`: wrap the popup menu;\n- `suffixIcon`: replace the trigger chevron.\n\n```vue preview src=\"./demos/HeaderFooter.vue\"\n\n```\n\n## Empty\n\nShows empty-state text when there are no options or no matches. Override with `notFoundContent`, otherwise it reads ConfigProvider `locale.emptyOptions`.\n\n```vue preview src=\"./demos/Empty.en.vue\"\n\n```\n\n## Teleport\n\nThe menu Teleports to `body` by default (`teleport` + `appendTo`). Set `append-to=\"self\"` or `teleport={false}` to render in place.\n\n```vue preview src=\"./demos/Teleport.vue\"\n\n```\n\n## Styling & attrs\n\nFallthrough attrs except control **events** bind to the field wrapper; `@keydown` and similar listeners attach to the combobox. Prefer `placeholder` / `name` as props. Use `placement` / `appendTo` for the panel, or `pt` for inner DOM. See [Styling & attrs](/docs/attrs).\n\n## Props\n\n| Prop                | Type                                                                                                      | Default                     | Description                                                                      |\n| ------------------- | --------------------------------------------------------------------------------------------------------- | --------------------------- | -------------------------------------------------------------------------------- |\n| `modelValue`        | `string \\| number \\| Array<string \\| number> \\| SelectLabeledValue`                                       | 鈥?                          | Selected value; an array in `mode`, or `{ value, label }` with `labelInValue`.   |\n| `options`           | `Array<`[SelectOption](/docs/types#SelectOption)`\\|`[SelectOptionGroup](/docs/types#SelectOptionGroup)`>` | 鈥?                          | Options list; may mix in `{ label, options }` groups.                            |\n| `fieldNames`        | `{ label?, value?, disabled?, options? }`                                                                 | 鈥?                          | Remap raw option keys.                                                           |\n| `labelInValue`      | `boolean`                                                                                                 | `false`                     | `v-model` / events return `{ value, label }`.                                    |\n| `label`             | `string`                                                                                                  | 鈥?                          | Field label.                                                                     |\n| `helpText`          | `string`                                                                                                  | 鈥?                          | Help text.                                                                       |\n| `invalid`           | `boolean`                                                                                                 | `false`                     | Invalid state.                                                                   |\n| `status`            | `'error' \\| 'warning'`                                                                                    | 鈥?                          | Visual status; `error` matches invalid, `warning` is caution chrome.             |\n| `placeholder`       | `string`                                                                                                  | 鈥?                          | Placeholder text.                                                                |\n| `disabled`          | `boolean`                                                                                                 | `false`                     | Disabled.                                                                        |\n| `required`          | `boolean`                                                                                                 | `false`                     | Form required hint.                                                              |\n| `size`              | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'`                                                              | 鈥?                          | Size; inherits Form `size` when omitted.                                         |\n| `variant`           | `'outlined' \\| 'filled'`                                                                                  | 鈥?                          | Input surface style.                                                             |\n| `fluid`             | `boolean`                                                                                                 | `false`                     | Stretch to the container width.                                                  |\n| `mode`              | `'multiple' \\| 'tags'`                                                                                    | 鈥?                          | Multi-value; `tags` also allows creating options.                                |\n| `remote`            | `boolean`                                                                                                 | `false`                     | Skip local filtering and emit `search`.                                          |\n| `loading`           | `boolean`                                                                                                 | `false`                     | Async loading state.                                                             |\n| `maxTagCount`       | `number`                                                                                                  | 鈥?                          | Max visible tags; extras collapse.                                               |\n| `maxTagPlaceholder` | `(omitted) => MRenderable`                                                                                | `moreTags` locale           | Collapsed-tag summary.                                                           |\n| `clearable`        | `boolean`                                                                                                 | `false`                     | Show a clear button when a value is selected.                                    |\n| `notFoundContent`   | `MRenderable`                                                                                             | `emptyOptions` locale       | Empty / no-match copy.                                                           |\n| `showSearch`        | `boolean`                                                                                                 | `false`                     | Render a search input in the popup.                                              |\n| `optionFilterProp`  | `string`                                                                                                  | `'label'`                   | Option key used for local matching.                                              |\n| `filterOption`      | `boolean \\| (input, option) => boolean`                                                                   | match on `optionFilterProp` | Local filter rule; `false` disables.                                             |\n| `optionRender`      | `(option) => MRenderable`                                                                                 | 鈥?                          | Custom option row (wins over the `option` slot).                                 |\n| `popupRender`       | `(menu) => VNodeChild`                                                                                    | 鈥?                          | Wrap the popup menu.                                                             |\n| `suffixIcon`        | `IconName`                                                                                                | `'chevron-down'`            | Trigger icon.                                                                    |\n| `teleport`          | `boolean`                                                                                                 | `true`                      | Menu Teleport. Mounts to `body` by default.                                      |\n| `appendTo`          | `string \\| HTMLElement \\| 'self'`                                                                         | `'body'`                    | Mount target. `'self'` renders in place.                                         |\n| `placement`         | `'bottom-start' \\| 'bottom-end'`                                                                          | `'bottom-start'`            | Menu alignment.                                                                  |\n| `transition`        | `string \\| false`                                                                                         | `'scale-fade'`              | Menu enter/exit preset; `false` / `'none'` disables. See [Motion](/docs/motion). |\n| `id`                | `string`                                                                                                  | 鈥?                          | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | 鈥?                          | Validation copy; shown when combined with `invalid`.                             |\n| `name`              | `string`                                                                                                  | 鈥?                          | Native name helper (hidden input).                                               |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | 鈥?                          | Per-part DOM pass-through.                                                       |\n| `virtual`           | `boolean`                                                                                                 | auto                        | `true` forces virtualization; `false` disables; auto-on at 80+ options.          |\n| `id`                | `string`                                                                                                  | 鈥?                          | Control id.                                                                      |\n| `errorMessage`      | `string`                                                                                                  | 鈥?                          | Validation error copy.                                                           |\n| `name`              | `string`                                                                                                  | 鈥?                          | Native name when a hidden input is present.                                      |\n| `pt`                | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }`                    | 鈥?                          | Pass-through (`root`, `control`, 鈥?.                                             |\n\n## Events\n\n| Event               | Prop                                                                   | Description                                                |\n| ------------------- | ---------------------------------------------------------------------- | ---------------------------------------------------------- |\n| `update:modelValue` | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted when the value changes.                            |\n| `change`            | [SelectModelValue](/docs/types#SelectModelValue)                       | Emitted after a selection or clear.                        |\n| `clear`             | 鈥?                                                                     | Emitted when clear is clicked.                             |\n| `show`              | 鈥?                                                                     | Emitted when the menu opens.                               |\n| `hide`              | 鈥?                                                                     | Emitted when the menu closes.                              |\n| `search`            | `string`                                                               | Emitted as the filter query changes (`filter` / `remote`). |\n| `select`            | `value, option`                                                        | Emitted when an option is selected.                        |\n| `deselect`          | `value, option`                                                        | Emitted when an option is deselected (multiple mode).      |\n| `create`            | [SelectOption](/docs/types#SelectOption) `{ label, value, disabled? }` | Emitted when `tag` creates a new option.                   |\n\n## Slots\n\n| Slot     | Description                                        |\n| -------- | -------------------------------------------------- |\n| `value`  | Custom single-select trigger display.              |\n| `option` | Option `{ option }`.                               |\n| `header` | Custom content above the option list in the popup. |\n| `footer` | Custom content below the option list in the popup. |\n\n## Types\n\n<h4 id=\"SelectOption\">SelectOption</h4>\n\n```ts\ninterface SelectOption {\n  label: string;\n  value: string | number;\n  disabled?: boolean;\n}\n```\n\n<h4 id=\"SelectOptionGroup\">SelectOptionGroup</h4>\n\n```ts\ninterface SelectOptionGroup {\n  label: string;\n  items: SelectOption[];\n}\n```\n\n<h4 id=\"SelectModelValue\">SelectModelValue</h4>\n\nScalar when single-select; array when `multiple`. See [API types](/docs/types#SelectModelValue).\n"
         }
       }
     },
@@ -28735,12 +28896,6 @@
           "default": "false",
           "description": "显示清除按钮。"
         },
-        {
-          "name": "allowClear",
-          "type": "boolean",
-          "default": "—",
-          "description": "`clearable` 的别名。"
-        },
         {
           "name": "maxlength",
           "type": "number",
@@ -28956,7 +29111,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `id` | `string` | — | 原生 id。 |\n| `rows` | `number` | `4` | 可见行数。 |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize；autosize 时强制 `none`。 |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | 按内容自动增高，可限制行数。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `allowClear` | `boolean` | — | `clearable` 的别名。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传（`root`、`input`、`label` 等）。 |"
+              "body": "| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `id` | `string` | — | 原生 id。 |\n| `rows` | `number` | `4` | 可见行数。 |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize；autosize 时强制 `none`。 |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | 按内容自动增高，可限制行数。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传（`root`、`input`、`label` 等）。 |"
             },
             {
               "id": "events",
@@ -28974,7 +29129,7 @@
               "body": "无插槽。"
             }
           ],
-          "markdown": "---\ntitle: Textarea\ncategory: 02 / FORM\ndescription: 多行文本输入。\n---\n\n# Textarea\n\n多行文本输入。\n\n## 引入\n\n```ts\nimport { MTextarea } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Size & Variant\n\n```vue preview src=\"./demos/SizeAndVariant.vue\"\n```\n\n## AutoResize & Invalid\n\n`autosize` 会随内容增高；可传 `{ minRows, maxRows }` 限制范围。`invalid` 表示校验失败。\n\n```vue preview src=\"./demos/AutoresizeAndInvalid.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `id` | `string` | — | 原生 id。 |\n| `rows` | `number` | `4` | 可见行数。 |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize；autosize 时强制 `none`。 |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | 按内容自动增高，可限制行数。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `allowClear` | `boolean` | — | `clearable` 的别名。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传（`root`、`input`、`label` 等）。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 值变化。 |\n| `clear` | — | 点击清除时触发。 |\n| `blur` | — | — |\n| `change` | — | — |\n| `focus` | — | — |\n\n## Methods\n\n| 方法 | 说明 |\n| --- | --- |\n| `focus()` | 聚焦底层文本域。 |\n| `blur()` | 使底层文本域失焦。 |\n| `select()` | 选中文本域的全部文本。 |\n\n## Slots\n\n无插槽。\n"
+          "markdown": "---\ntitle: Textarea\ncategory: 02 / FORM\ndescription: 多行文本输入。\n---\n\n# Textarea\n\n多行文本输入。\n\n## 引入\n\n```ts\nimport { MTextarea } from 'morya-ui'\n```\n\n## 基础用法\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Size & Variant\n\n```vue preview src=\"./demos/SizeAndVariant.vue\"\n```\n\n## AutoResize & Invalid\n\n`autosize` 会随内容增高；可传 `{ minRows, maxRows }` 限制范围。`invalid` 表示校验失败。\n\n```vue preview src=\"./demos/AutoresizeAndInvalid.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| 参数 | 类型 | 默认值 | 说明 |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | 绑定值。 |\n| `label` | `string` | — | 标签文案。 |\n| `helpText` | `string` | — | 辅助说明。 |\n| `invalid` | `boolean` | `false` | 校验失败态。 |\n| `status` | `'error' \\| 'warning'` | — | 视觉校验态；`error` 等同 invalid，`warning` 为警告描边。 |\n| `errorMessage` | `string` | — | 错误文案；有值时视为 invalid。 |\n| `id` | `string` | — | 原生 id。 |\n| `rows` | `number` | `4` | 可见行数。 |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize；autosize 时强制 `none`。 |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | 按内容自动增高，可限制行数。 |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | 尺寸；可继承 Form `size`。 |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | 样式变体。 |\n| `fluid` | `boolean` | `false` | 宽度撑满。 |\n| `disabled` | `boolean` | `false` | 禁用。 |\n| `readonly` | `boolean` | `false` | 只读。 |\n| `clearable` | `boolean` | `false` | 显示清除按钮。 |\n| `maxlength` | `number` | — | 原生 maxlength。 |\n| `showCount` | `boolean` | `false` | 显示字数统计。 |\n| `placeholder` | `string` | — | 占位符。 |\n| `name` | `string` | — | 原生 name。 |\n| `autocomplete` | `string` | — | 原生 autocomplete。 |\n| `autofocus` | `boolean` | `false` | 挂载后聚焦。 |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | DOM 分段透传（`root`、`input`、`label` 等）。 |\n\n## Events\n\n| 事件名 | 参数 | 说明 |\n| --- | --- | --- |\n| `update:modelValue` | `string` | 值变化。 |\n| `clear` | — | 点击清除时触发。 |\n| `blur` | — | — |\n| `change` | — | — |\n| `focus` | — | — |\n\n## Methods\n\n| 方法 | 说明 |\n| --- | --- |\n| `focus()` | 聚焦底层文本域。 |\n| `blur()` | 使底层文本域失焦。 |\n| `select()` | 选中文本域的全部文本。 |\n\n## Slots\n\n无插槽。\n"
         },
         "en-US": {
           "title": "Textarea",
@@ -29013,7 +29168,7 @@
             {
               "id": "props",
               "title": "Props",
-              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Invalid (validation failed) state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `id` | `string` | — | Native id. |\n| `rows` | `number` | `4` | Visible rows. |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize; forced to `none` when autosize is on. |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | Auto-grow with content; optional row clamp. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `allowClear` | `boolean` | — | Alias of `clearable` . |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through per DOM part (`root`, `input`, `label`, …). |"
+              "body": "| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Invalid (validation failed) state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `id` | `string` | — | Native id. |\n| `rows` | `number` | `4` | Visible rows. |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize; forced to `none` when autosize is on. |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | Auto-grow with content; optional row clamp. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through per DOM part (`root`, `input`, `label`, …). |"
             },
             {
               "id": "events",
@@ -29031,7 +29186,7 @@
               "body": "No slots."
             }
           ],
-          "markdown": "---\ntitle: Textarea\ncategory: 02 / FORM\ndescription: Multi-line text input.\n---\n\n# Textarea\n\nMulti-line text input.\n\n## Import\n\n```ts\nimport { MTextarea } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Size & Variant\n\n```vue preview src=\"./demos/SizeAndVariant.vue\"\n```\n\n## AutoResize & Invalid\n\n`autosize` grows with content. Pass `{ minRows, maxRows }` to clamp. `invalid` marks a validation failure.\n\n```vue preview src=\"./demos/AutoresizeAndInvalid.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Invalid (validation failed) state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `id` | `string` | — | Native id. |\n| `rows` | `number` | `4` | Visible rows. |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize; forced to `none` when autosize is on. |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | Auto-grow with content; optional row clamp. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `allowClear` | `boolean` | — | Alias of `clearable` . |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through per DOM part (`root`, `input`, `label`, …). |\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Emitted when the value changes. |\n| `clear` | — | Emitted when the value is cleared. |\n\n## Methods\n\n| Method | Description |\n| --- | --- |\n| `focus()` | Focus the underlying textarea. |\n| `blur()` | Blur the underlying textarea. |\n| `select()` | Select all text in the textarea. |\n\n## Slots\n\nNo slots.\n"
+          "markdown": "---\ntitle: Textarea\ncategory: 02 / FORM\ndescription: Multi-line text input.\n---\n\n# Textarea\n\nMulti-line text input.\n\n## Import\n\n```ts\nimport { MTextarea } from 'morya-ui'\n```\n\n## Basic\n\n```vue preview src=\"./demos/Basic.vue\"\n```\n\n## Size & Variant\n\n```vue preview src=\"./demos/SizeAndVariant.vue\"\n```\n\n## AutoResize & Invalid\n\n`autosize` grows with content. Pass `{ minRows, maxRows }` to clamp. `invalid` marks a validation failure.\n\n```vue preview src=\"./demos/AutoresizeAndInvalid.vue\"\n```\n\n## Clearable & count\n\n```vue preview src=\"./demos/ClearableAndCount.vue\"\n```\n\n## Props\n\n| Prop | Type | Default | Description |\n| --- | --- | --- | --- |\n| `modelValue` | `string` | `''` | Bound value. |\n| `label` | `string` | — | Label text. |\n| `helpText` | `string` | — | Helper text. |\n| `invalid` | `boolean` | `false` | Invalid (validation failed) state. |\n| `status` | `'error' \\| 'warning'` | — | Visual status; `error` matches invalid, `warning` is caution chrome. |\n| `id` | `string` | — | Native id. |\n| `rows` | `number` | `4` | Visible rows. |\n| `resize` | `'none' \\| 'vertical' \\| 'horizontal' \\| 'both'` | `'vertical'` | CSS resize; forced to `none` when autosize is on. |\n| `autosize` | `boolean \\| { minRows?: number; maxRows?: number }` | `false` | Auto-grow with content; optional row clamp. |\n| `size` | `'small' \\| 'large' \\| 'sm' \\| 'md' \\| 'lg'` | — | Size; inherits Form `size` when omitted. |\n| `variant` | `'outlined' \\| 'filled'` | `'outlined'` | Visual variant. |\n| `fluid` | `boolean` | `false` | Full width. |\n| `disabled` | `boolean` | `false` | Disabled. |\n| `readonly` | `boolean` | `false` | Read-only. |\n| `clearable` | `boolean` | `false` | Show a clear button. |\n| `maxlength` | `number` | — | Native maxlength. |\n| `showCount` | `boolean` | `false` | Show character count. |\n| `errorMessage` | `string` | — | Error copy; implies invalid when set. |\n| `placeholder` | `string` | — | Placeholder. |\n| `name` | `string` | — | Native name. |\n| `autocomplete` | `string` | — | Native autocomplete. |\n| `autofocus` | `boolean` | `false` | Focus on mount. |\n| `pt` | [FieldPassThrough](/docs/types#FieldPassThrough) `{ root?, label?, control?, input? }` | — | Pass-through per DOM part (`root`, `input`, `label`, …). |\n\n## Events\n\n| Event | Prop | Description |\n| --- | --- | --- |\n| `update:modelValue` | `string` | Emitted when the value changes. |\n| `clear` | — | Emitted when the value is cleared. |\n\n## Methods\n\n| Method | Description |\n| --- | --- |\n| `focus()` | Focus the underlying textarea. |\n| `blur()` | Blur the underlying textarea. |\n| `select()` | Select all text in the textarea. |\n\n## Slots\n\nNo slots.\n"
         }
       }
     },
@@ -33378,7 +33533,7 @@
         "zh-CN": {
           "title": "主题",
           "description": "亮暗主题、设计令牌与内容密度。",
-          "markdown": "---\ntitle: 主题\norder: 5\ndescription: 亮暗主题、设计令牌与内容密度。\n---\n\n# 主题\n\n主题能力内置于 `morya-ui`。组件只消费语义化 CSS 变量（`--m-*`），不自行维护第二套色板。\n\n引入 `morya-ui/styles.css` 时已包含这些变量；主题 JS API（`useTheme` 等）从同一包导入。\n\n## 亮 / 暗色\n\n```ts\nimport { useTheme } from \"morya-ui\";\n\nconst { isDark, setTheme, toggleTheme } = useTheme();\n\nsetTheme(\"light\"); // 或 'dark'\ntoggleTheme();\n```\n\n文档站右上角的按钮调用的就是同一套 API。主题偏好会写到 `document.documentElement` 的 `data-theme`。\n\n## 设计令牌\n\n常用变量示例见 [设计令牌](/docs/design-tokens) 完整列表（支持搜索与分类）。\n\n| Token                                                             | 用途                                          |\n| ----------------------------------------------------------------- | --------------------------------------------- |\n| `--m-color-primary`                                               | 品牌主色                                      |\n| `--m-color-surface`                                               | 页面底色                                      |\n| `--m-color-text`                                                  | 正文                                          |\n| `--m-color-border`                                                | 分割线 / 描边                                 |\n| `--m-radius-sm/md/lg`                                             | 圆角阶梯                                      |\n| `--m-space-*`                                                     | 间距阶梯                                      |\n| `--m-font-size-xs/sm/md/lg`                                       | 组件正文字号阶梯                              |\n| `--m-opacity-disabled`                                            | 禁用态透明度                                  |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | 浮层层叠（Config `zIndex` 会写 `--m-z-base`） |\n| `--m-menu-min-width` / `--m-control-affix-*`                      | 菜单最小宽、输入清除区尺寸                    |\n\n动效相关 token（`--m-motion-*`）见 [动效](/docs/motion)。\n\n## 内容密度\n\n```ts\nimport { useDensity } from \"morya-ui\";\n\nconst { preference, setDensity } = useDensity();\nsetDensity(\"compact\"); // 'compact' | 'comfortable' | 'spacious'\n```\n\n也会写到 `document.documentElement` 的 `data-m-density`，并缩放 `--m-space-*` 与 `--m-control-height-*`。  \n应用级可用 `createMoryaUI({ density: 'compact' })` 或 `<MConfigProvider density=\"compact\">`。\n\n在组件页侧栏「主题」可临时改主色、圆角与密度，用于本地预览。完整交互页见 [主题编辑器](/theme-editor)（可导出 `createTheme` / CSS）。\n\n## 控件尺寸与聚焦\n\n默认控件高度采用 compact 节奏：\n\n| Size            | 高度                                 | 字号   |\n| --------------- | ------------------------------------ | ------ |\n| `small`         | `28px`（`--m-control-height-small`） | `14px` |\n| 默认 / `medium` | `34px`                               | `14px` |\n| `large`         | `40px`                               | `15px` |\n\n聚焦样式为 **主色描边 + 2px 淡色光晕**（非外扩 outline ring）：\n\n```css\nborder-color: var(--m-color-primary-hover);\nbox-shadow: var(--m-focus-shadow); /* 0 0 0 2px primary@20% */\n```\n\n相关 token：`--m-radius-control`、`--m-control-padding-x-*`、`--m-button-padding-x-*`、`--m-focus-shadow` / `--m-focus-shadow-danger`。\n\n## createTheme\n\n从 seed 推导完整 `--m-*` 并应用到文档或作用域元素：\n\n```ts\nimport { createTheme } from \"morya-ui\";\n\nconst theme = createTheme({\n  seed: { colorPrimary: \"#0b6e4f\", borderRadius: 8 },\n  // algorithm: 'dark' | 'compact' | ['dark', 'compact']\n});\n\ntheme.apply(); // 写到 :root（或传入元素做局部主题）\n// const dispose = theme.inject()  // 写入 <style data-m-theme>（组件级覆盖需要）\n```\n\n在线调色与导出片段：[主题编辑器](/theme-editor)。\n\n## 与 ConfigProvider\n\n主题切换是「视觉层」；`MConfigProvider` / `createMoryaUI` 负责尺寸、文案、浮层挂载等「行为默认值」。二者可同时使用，详见 [全局配置](/docs/config)。\n\n进出场与 `useMotion` 见 [动效](/docs/motion)。\n",
+          "markdown": "---\ntitle: 主题\norder: 5\ndescription: 亮暗主题、设计令牌与内容密度。\n---\n\n# 主题\n\n主题能力内置于 `morya-ui`。组件只消费语义化 CSS 变量（`--m-*`），不自行维护第二套色板。\n\n引入 `morya-ui/styles.css` 时已包含这些变量；主题 JS API（`useTheme` 等）从同一包导入。\n\n## 亮 / 暗色\n\n```ts\nimport { useTheme } from \"morya-ui\";\n\nconst { isDark, setTheme, toggleTheme } = useTheme();\n\nsetTheme(\"light\"); // 或 'dark'\ntoggleTheme();\n```\n\n文档站右上角的按钮调用的就是同一套 API。主题偏好会写到 `document.documentElement` 的 `data-theme`。\n\n## 设计令牌\n\n常用变量示例见 [设计令牌](/docs/design-tokens) 完整列表（支持搜索与分类）。\n\n| Token                                                             | 用途                                          |\n| ----------------------------------------------------------------- | --------------------------------------------- |\n| `--m-color-primary`                                               | 品牌主色                                      |\n| `--m-color-surface`                                               | 页面底色                                      |\n| `--m-color-text`                                                  | 正文                                          |\n| `--m-color-border`                                                | 分割线 / 描边                                 |\n| `--m-radius-sm/md/lg`                                             | 圆角阶梯                                      |\n| `--m-space-*`                                                     | 间距阶梯                                      |\n| `--m-font-size-xs/sm/md/lg`                                       | 组件正文字号阶梯                              |\n| `--m-opacity-disabled`                                            | 禁用态透明度                                  |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | 浮层层叠（Config `zIndex` 会写 `--m-z-base`） |\n| `--m-overlay-menu-min-width` / `--m-control-affix-*`                      | 菜单最小宽、输入清除区尺寸                    |\n\n动效相关 token（`--m-motion-*`）见 [动效](/docs/motion)。\n\n## 内容密度\n\n```ts\nimport { useDensity } from \"morya-ui\";\n\nconst { preference, setDensity } = useDensity();\nsetDensity(\"compact\"); // 'compact' | 'comfortable' | 'spacious'\n```\n\n也会写到 `document.documentElement` 的 `data-m-density`，并缩放 `--m-space-*` 与 `--m-control-height-*`。  \n应用级可用 `createMoryaUI({ density: 'compact' })` 或 `<MConfigProvider density=\"compact\">`。\n\n在组件页侧栏「主题」可临时改主色、圆角与密度，用于本地预览。完整交互页见 [主题编辑器](/theme-editor)（可导出 `createTheme` / CSS）。\n\n## 控件尺寸与聚焦\n\n默认控件高度采用 compact 节奏：\n\n| Size            | 高度                                 | 字号   |\n| --------------- | ------------------------------------ | ------ |\n| `small`         | `28px`（`--m-control-height-small`） | `14px` |\n| 默认 / `medium` | `34px`                               | `14px` |\n| `large`         | `40px`                               | `15px` |\n\n聚焦样式为 **主色描边 + 2px 淡色光晕**（非外扩 outline ring）：\n\n```css\nborder-color: var(--m-color-primary-hover);\nbox-shadow: var(--m-focus-shadow); /* 0 0 0 2px primary@20% */\n```\n\n相关 token：`--m-radius-control`、`--m-control-padding-x-*`、`--m-button-padding-x-*`、`--m-focus-shadow` / `--m-focus-shadow-danger`。\n\n## createTheme\n\n从 seed 推导完整 `--m-*` 并应用到文档或作用域元素：\n\n```ts\nimport { createTheme } from \"morya-ui\";\n\nconst theme = createTheme({\n  seed: { colorPrimary: \"#0b6e4f\", borderRadius: 8 },\n  // algorithm: 'dark' | 'compact' | ['dark', 'compact']\n});\n\ntheme.apply(); // 写到 :root（或传入元素做局部主题）\n// const dispose = theme.inject()  // 写入 <style data-m-theme>（组件级覆盖需要）\n```\n\n在线调色与导出片段：[主题编辑器](/theme-editor)。\n\n## 与 ConfigProvider\n\n主题切换是「视觉层」；`MConfigProvider` / `createMoryaUI` 负责尺寸、文案、浮层挂载等「行为默认值」。二者可同时使用，详见 [全局配置](/docs/config)。\n\n进出场与 `useMotion` 见 [动效](/docs/motion)。\n",
           "sections": [
             {
               "title": "",
@@ -33393,7 +33548,7 @@
             {
               "title": "设计令牌",
               "id": "设计令牌",
-              "body": "常用变量示例见 [设计令牌](/docs/design-tokens) 完整列表（支持搜索与分类）。\n\n| Token                                                             | 用途                                          |\n| ----------------------------------------------------------------- | --------------------------------------------- |\n| `--m-color-primary`                                               | 品牌主色                                      |\n| `--m-color-surface`                                               | 页面底色                                      |\n| `--m-color-text`                                                  | 正文                                          |\n| `--m-color-border`                                                | 分割线 / 描边                                 |\n| `--m-radius-sm/md/lg`                                             | 圆角阶梯                                      |\n| `--m-space-*`                                                     | 间距阶梯                                      |\n| `--m-font-size-xs/sm/md/lg`                                       | 组件正文字号阶梯                              |\n| `--m-opacity-disabled`                                            | 禁用态透明度                                  |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | 浮层层叠（Config `zIndex` 会写 `--m-z-base`） |\n| `--m-menu-min-width` / `--m-control-affix-*`                      | 菜单最小宽、输入清除区尺寸                    |\n\n动效相关 token（`--m-motion-*`）见 [动效](/docs/motion)。"
+              "body": "常用变量示例见 [设计令牌](/docs/design-tokens) 完整列表（支持搜索与分类）。\n\n| Token                                                             | 用途                                          |\n| ----------------------------------------------------------------- | --------------------------------------------- |\n| `--m-color-primary`                                               | 品牌主色                                      |\n| `--m-color-surface`                                               | 页面底色                                      |\n| `--m-color-text`                                                  | 正文                                          |\n| `--m-color-border`                                                | 分割线 / 描边                                 |\n| `--m-radius-sm/md/lg`                                             | 圆角阶梯                                      |\n| `--m-space-*`                                                     | 间距阶梯                                      |\n| `--m-font-size-xs/sm/md/lg`                                       | 组件正文字号阶梯                              |\n| `--m-opacity-disabled`                                            | 禁用态透明度                                  |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | 浮层层叠（Config `zIndex` 会写 `--m-z-base`） |\n| `--m-overlay-menu-min-width` / `--m-control-affix-*`                      | 菜单最小宽、输入清除区尺寸                    |\n\n动效相关 token（`--m-motion-*`）见 [动效](/docs/motion)。"
             },
             {
               "title": "内容密度",
@@ -33420,7 +33575,7 @@
         "en-US": {
           "title": "Theme",
           "description": "Light and dark themes, design tokens, and density.",
-          "markdown": "---\ntitle: Theme\norder: 5\ndescription: Light and dark themes, design tokens, and density.\n---\n\n# Theme\n\nTheme support is built into `morya-ui`. Components consume semantic CSS variables (`--m-*`) and do not keep a second palette.\n\nImporting `morya-ui/styles.css` already includes these variables. Theme JS APIs (`useTheme` and friends) come from the same package.\n\n## Light / dark\n\n```ts\nimport { useTheme } from \"morya-ui\";\n\nconst { isDark, setTheme, toggleTheme } = useTheme();\n\nsetTheme(\"light\"); // or 'dark'\ntoggleTheme();\n```\n\nThe button at the top-right of the docs site uses the same API. The preference is written to `data-theme` on `document.documentElement`.\n\n## Design tokens\n\nSee the full [Design tokens](/docs/design-tokens) catalog (searchable, grouped by category).\n\n| Token                                                             | Use                                             |\n| ----------------------------------------------------------------- | ----------------------------------------------- |\n| `--m-color-primary`                                               | Brand color                                     |\n| `--m-color-surface`                                               | Page background                                 |\n| `--m-color-text`                                                  | Body text                                       |\n| `--m-color-border`                                                | Dividers / strokes                              |\n| `--m-radius-sm/md/lg`                                             | Radius scale                                    |\n| `--m-space-*`                                                     | Spacing scale                                   |\n| `--m-font-size-xs/sm/md/lg`                                       | Component type scale                            |\n| `--m-opacity-disabled`                                            | Disabled opacity                                |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | Overlay stacking (`zIndex` writes `--m-z-base`) |\n| `--m-menu-min-width` / `--m-control-affix-*`                      | Menu min width, input clear-button size         |\n\nMotion tokens (`--m-motion-*`) are covered in [Motion](/docs/motion).\n\n## Density\n\n```ts\nimport { useDensity } from \"morya-ui\";\n\nconst { preference, setDensity } = useDensity();\nsetDensity(\"compact\"); // 'compact' | 'comfortable' | 'spacious'\n```\n\nThis writes `data-m-density` on `document.documentElement` and scales `--m-space-*` plus `--m-control-height-*`.  \nAt the app level use `createMoryaUI({ density: 'compact' })` or `<MConfigProvider density=\"compact\">`.\n\nThe Components page sidebar Theme panel can temporarily change accent, radius, and density for local preview. Full interactive page: [Theme editor](/theme-editor) (exports `createTheme` / CSS).\n\n## Control size and focus\n\nDefault control heights follow a compact rhythm:\n\n| Size               | Height                              | Font size |\n| ------------------ | ----------------------------------- | --------- |\n| `small`            | `28px` (`--m-control-height-small`) | `14px`    |\n| Default / `medium` | `34px`                              | `14px`    |\n| `large`            | `40px`                              | `15px`    |\n\nFocus uses a **brand border + 2px tinted glow** (not an outset outline ring):\n\n```css\nborder-color: var(--m-color-primary-hover);\nbox-shadow: var(--m-focus-shadow); /* 0 0 0 2px primary@20% */\n```\n\nRelated tokens: `--m-radius-control`, `--m-control-padding-x-*`, `--m-button-padding-x-*`, `--m-focus-shadow` / `--m-focus-shadow-danger`.\n\n## createTheme\n\nDerive the full `--m-*` set from a seed and apply it to the document or a scoped element:\n\n```ts\nimport { createTheme } from \"morya-ui\";\n\nconst theme = createTheme({\n  seed: { colorPrimary: \"#0b6e4f\", borderRadius: 8 },\n  // algorithm: 'dark' | 'compact' | ['dark', 'compact']\n});\n\ntheme.apply(); // write onto :root (or pass an element for scoped theming)\n// const dispose = theme.inject()  // <style data-m-theme> (needed for component overrides)\n```\n\nLive tuning and export snippets: [Theme editor](/theme-editor).\n\n## With ConfigProvider\n\nTheme switching is the visual layer. `MConfigProvider` / `createMoryaUI` own size, copy, overlay mount, and other behavioral defaults. Use both together; see [Configuration](/docs/config).\n\nEnter/exit presets and `useMotion` live under [Motion](/docs/motion).\n",
+          "markdown": "---\ntitle: Theme\norder: 5\ndescription: Light and dark themes, design tokens, and density.\n---\n\n# Theme\n\nTheme support is built into `morya-ui`. Components consume semantic CSS variables (`--m-*`) and do not keep a second palette.\n\nImporting `morya-ui/styles.css` already includes these variables. Theme JS APIs (`useTheme` and friends) come from the same package.\n\n## Light / dark\n\n```ts\nimport { useTheme } from \"morya-ui\";\n\nconst { isDark, setTheme, toggleTheme } = useTheme();\n\nsetTheme(\"light\"); // or 'dark'\ntoggleTheme();\n```\n\nThe button at the top-right of the docs site uses the same API. The preference is written to `data-theme` on `document.documentElement`.\n\n## Design tokens\n\nSee the full [Design tokens](/docs/design-tokens) catalog (searchable, grouped by category).\n\n| Token                                                             | Use                                             |\n| ----------------------------------------------------------------- | ----------------------------------------------- |\n| `--m-color-primary`                                               | Brand color                                     |\n| `--m-color-surface`                                               | Page background                                 |\n| `--m-color-text`                                                  | Body text                                       |\n| `--m-color-border`                                                | Dividers / strokes                              |\n| `--m-radius-sm/md/lg`                                             | Radius scale                                    |\n| `--m-space-*`                                                     | Spacing scale                                   |\n| `--m-font-size-xs/sm/md/lg`                                       | Component type scale                            |\n| `--m-opacity-disabled`                                            | Disabled opacity                                |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | Overlay stacking (`zIndex` writes `--m-z-base`) |\n| `--m-overlay-menu-min-width` / `--m-control-affix-*`                      | Menu min width, input clear-button size         |\n\nMotion tokens (`--m-motion-*`) are covered in [Motion](/docs/motion).\n\n## Density\n\n```ts\nimport { useDensity } from \"morya-ui\";\n\nconst { preference, setDensity } = useDensity();\nsetDensity(\"compact\"); // 'compact' | 'comfortable' | 'spacious'\n```\n\nThis writes `data-m-density` on `document.documentElement` and scales `--m-space-*` plus `--m-control-height-*`.  \nAt the app level use `createMoryaUI({ density: 'compact' })` or `<MConfigProvider density=\"compact\">`.\n\nThe Components page sidebar Theme panel can temporarily change accent, radius, and density for local preview. Full interactive page: [Theme editor](/theme-editor) (exports `createTheme` / CSS).\n\n## Control size and focus\n\nDefault control heights follow a compact rhythm:\n\n| Size               | Height                              | Font size |\n| ------------------ | ----------------------------------- | --------- |\n| `small`            | `28px` (`--m-control-height-small`) | `14px`    |\n| Default / `medium` | `34px`                              | `14px`    |\n| `large`            | `40px`                              | `15px`    |\n\nFocus uses a **brand border + 2px tinted glow** (not an outset outline ring):\n\n```css\nborder-color: var(--m-color-primary-hover);\nbox-shadow: var(--m-focus-shadow); /* 0 0 0 2px primary@20% */\n```\n\nRelated tokens: `--m-radius-control`, `--m-control-padding-x-*`, `--m-button-padding-x-*`, `--m-focus-shadow` / `--m-focus-shadow-danger`.\n\n## createTheme\n\nDerive the full `--m-*` set from a seed and apply it to the document or a scoped element:\n\n```ts\nimport { createTheme } from \"morya-ui\";\n\nconst theme = createTheme({\n  seed: { colorPrimary: \"#0b6e4f\", borderRadius: 8 },\n  // algorithm: 'dark' | 'compact' | ['dark', 'compact']\n});\n\ntheme.apply(); // write onto :root (or pass an element for scoped theming)\n// const dispose = theme.inject()  // <style data-m-theme> (needed for component overrides)\n```\n\nLive tuning and export snippets: [Theme editor](/theme-editor).\n\n## With ConfigProvider\n\nTheme switching is the visual layer. `MConfigProvider` / `createMoryaUI` own size, copy, overlay mount, and other behavioral defaults. Use both together; see [Configuration](/docs/config).\n\nEnter/exit presets and `useMotion` live under [Motion](/docs/motion).\n",
           "sections": [
             {
               "title": "",
@@ -33435,7 +33590,7 @@
             {
               "title": "Design tokens",
               "id": "design-tokens",
-              "body": "See the full [Design tokens](/docs/design-tokens) catalog (searchable, grouped by category).\n\n| Token                                                             | Use                                             |\n| ----------------------------------------------------------------- | ----------------------------------------------- |\n| `--m-color-primary`                                               | Brand color                                     |\n| `--m-color-surface`                                               | Page background                                 |\n| `--m-color-text`                                                  | Body text                                       |\n| `--m-color-border`                                                | Dividers / strokes                              |\n| `--m-radius-sm/md/lg`                                             | Radius scale                                    |\n| `--m-space-*`                                                     | Spacing scale                                   |\n| `--m-font-size-xs/sm/md/lg`                                       | Component type scale                            |\n| `--m-opacity-disabled`                                            | Disabled opacity                                |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | Overlay stacking (`zIndex` writes `--m-z-base`) |\n| `--m-menu-min-width` / `--m-control-affix-*`                      | Menu min width, input clear-button size         |\n\nMotion tokens (`--m-motion-*`) are covered in [Motion](/docs/motion)."
+              "body": "See the full [Design tokens](/docs/design-tokens) catalog (searchable, grouped by category).\n\n| Token                                                             | Use                                             |\n| ----------------------------------------------------------------- | ----------------------------------------------- |\n| `--m-color-primary`                                               | Brand color                                     |\n| `--m-color-surface`                                               | Page background                                 |\n| `--m-color-text`                                                  | Body text                                       |\n| `--m-color-border`                                                | Dividers / strokes                              |\n| `--m-radius-sm/md/lg`                                             | Radius scale                                    |\n| `--m-space-*`                                                     | Spacing scale                                   |\n| `--m-font-size-xs/sm/md/lg`                                       | Component type scale                            |\n| `--m-opacity-disabled`                                            | Disabled opacity                                |\n| `--m-z-base` / `--m-z-overlay` / `--m-z-dropdown` / `--m-z-toast` | Overlay stacking (`zIndex` writes `--m-z-base`) |\n| `--m-overlay-menu-min-width` / `--m-control-affix-*`                      | Menu min width, input clear-button size         |\n\nMotion tokens (`--m-motion-*`) are covered in [Motion](/docs/motion)."
             },
             {
               "title": "Density",
@@ -33902,7 +34057,7 @@
         "zh-CN": {
           "title": "SSR 与服务端框架",
           "description": "在 Nuxt、Astro、Vite SSR 等环境中使用 Morya UI。",
-          "markdown": "---\ntitle: SSR 与服务端框架\norder: 10\ndescription: 在 Nuxt、Astro、Vite SSR 等环境中使用 Morya UI。\n---\n\n# SSR 与服务端框架\n\nMorya UI 面向 **Vue 3** 的 SSR 场景做了兼容（推荐 3.5 及以上）：服务端不会访问 `document` / `window`，组件实例 id 在服务端与客户端保持一致，命令式 API（`toast` / `message` / `confirm`）在服务端自动跳过。\n\n以下框架均可接入；按场景选择 **全量 SSR** 或 **客户端 Islands**。\n\n## 通用约定\n\n| 项 | 建议 |\n| --- | --- |\n| 样式 | 在应用入口或框架配置中引入 `morya-ui/styles.css` |\n| 主题 | 优先用根级 **`MConfigProvider`** 设置 `theme` / `density`，避免在 SSR 阶段单独调用 `useTheme()` 写 `document` |\n| 命令式反馈 | `toast()`、`message()`、`confirm()` 仅在浏览器执行；SSR 期间调用不会报错，但不会渲染 |\n| 按需导入 | 配合 `morya-ui/resolver` 与 `unplugin-vue-components` 减小体积 |\n| 浮层 | Dialog / Select / Tooltip 等使用 Vue `Teleport`；SSR 可输出占位，交互在客户端水合后生效 |\n\n## Nuxt 3\n\n推荐使用官方模块 **`@morya-ui/nuxt`**（同仓库 `packages/nuxt`）。\n\n### 安装\n\n```bash\npnpm add morya-ui @morya-ui/nuxt\npnpm add -D unplugin-vue-components\n```\n\n### 配置\n\n```ts\nimport { MoryaUIResolver } from 'morya-ui/resolver'\n// nuxt.config.ts\nimport Components from 'unplugin-vue-components/vite'\n\nexport default defineNuxtConfig({\n  modules: ['@morya-ui/nuxt'],\n  vite: {\n    plugins: [\n      Components({\n        resolvers: [MoryaUIResolver()],\n      }),\n    ],\n  },\n})\n```\n\n模块默认会：\n\n- 引入 `morya-ui/styles.css`\n- 将 `morya-ui` 加入 `build.transpile`\n- 在客户端注册 overlay 上下文（供 `toast` / `message` 使用）\n\n### 根布局\n\n```vue\n<!-- app.vue -->\n<script setup lang=\"ts\">\nconst theme = ref<'light' | 'dark'>('light')\n</script>\n\n<template>\n  <MConfigProvider :theme=\"theme\" density=\"comfortable\">\n    <NuxtPage />\n  </MConfigProvider>\n</template>\n```\n\n按需导入时无需 `app.use(MoryaUI)`；若需全量注册，可在 `plugins/morya-ui.client.ts` 中 `nuxtApp.vueApp.use(MoryaUI)`。\n\n### 仅客户端组件\n\n极少数依赖浏览器专有 API 的场景（如自定义 `appendTo` 到尚未存在的节点），可用 Nuxt 的 `<ClientOnly>` 包裹。\n\n## Astro + Vue\n\n适合 **静态页 + Vue 岛**（管理后台、控制台嵌入营销站）。\n\n### 安装\n\n```bash\npnpm add morya-ui\nnpx astro add vue\n```\n\n### 在 Vue 岛中使用\n\n```astro\n---\n// src/pages/admin.astro\nimport AdminShell from '../components/AdminShell.vue'\n---\n<AdminShell client:load />\n```\n\n```vue\n<!-- src/components/AdminShell.vue -->\n<script setup lang=\"ts\">\nimport { MButton, MConfigProvider } from 'morya-ui'\nimport 'morya-ui/styles.css'\n</script>\n\n<template>\n  <MConfigProvider theme=\"light\">\n    <MButton label=\"Hello\" />\n  </MConfigProvider>\n</template>\n```\n\n- 交互型后台推荐 `client:load` 或 `client:only`\n- 纯展示块可用 `client:visible` 延迟水合\n- Astro 本身不做 Vue SSR 时，无需处理 hydration id 问题\n\n## Vite SSR（含自定义服务端）\n\n```ts\nimport { MConfigProvider } from 'morya-ui/config-provider'\n// main.server.ts / entry-server.ts\nimport { createSSRApp } from 'vue'\nimport App from './App.vue'\nimport 'morya-ui/styles.css'\n\nexport function createApp() {\n  const app = createSSRApp(App)\n  return { app }\n}\n```\n\n客户端入口可注册 overlay 插件：\n\n```ts\n// entry-client.ts\nimport { createMoryaUI } from 'morya-ui'\n\ncreateApp(/* ... */)\n  .use(createMoryaUI({ components: false }))\n  .mount('#app')\n```\n\n构建时确保 `morya-ui` 进入 `ssr.noExternal`（或 `ssr: { noExternal: ['morya-ui'] }`），以便正确处理 `.vue` 与 CSS 副作用。\n\n## 其他 Vue SSR 方案\n\n| 方案 | 说明 |\n| --- | --- |\n| **Quasar (SSR mode)** | 在 `quasar.config` 的 `build.transpileDependencies` 中加入 `morya-ui`，入口引入样式 |\n| **vite-plugin-ssr / vike** | 与 Vite SSR 相同：服务端渲染 + 客户端 `createMoryaUI({ components: false })` |\n| **Inertia + Vue SSR** | 根组件包 `MConfigProvider`；命令式 API 仅在 `onMounted` 后调用 |\n\n## 已知限制\n\n- **不支持 Vue 2**；SSR 仅适用于 Vue 3。\n- **IE** 不在支持范围内（与 Vue 3 一致）。\n- 主题 `localStorage` 持久化仅在浏览器生效；SSR 首屏使用 `MConfigProvider` 或 cookie 同步主题可避免闪动。\n- 全量 E2E SSR 回归仍在完善；若遇到 hydration 警告，请提供最小复现并 [提 Issue](https://github.com/morya-space/morya-ui/issues)。\n\n## 下一步\n\n- [快速上手](/docs/quick-start)：安装与导入方式\n- [全局配置](/docs/config)：`MConfigProvider`\n- [主题](/docs/theme)：亮暗色与 token\n",
+          "markdown": "---\ntitle: SSR 与服务端框架\norder: 10\ndescription: 在 Nuxt、Astro、Vite SSR 等环境中使用 Morya UI。\n---\n\n# SSR 与服务端框架\n\nMorya UI 面向 **Vue 3** 的 SSR 场景做了兼容（推荐 3.5 及以上）：服务端不会访问 `document` / `window`，组件实例 id 在服务端与客户端保持一致，命令式 API（`toast` / `message` / `confirm`）在服务端自动跳过。\n\n以下框架均可接入；按场景选择 **全量 SSR** 或 **客户端 Islands**。\n\n## 通用约定\n\n| 项 | 建议 |\n| --- | --- |\n| 样式 | 在应用入口或框架配置中引入 `morya-ui/styles.css` |\n| 主题 | 优先用根级 **`MConfigProvider`** 设置 `theme` / `density`，避免在 SSR 阶段单独调用 `useTheme()` 写 `document` |\n| 命令式反馈 | `toast()`、`message()`、`confirm()` 仅在浏览器执行；SSR 期间调用不会报错，但不会渲染 |\n| 按需导入 | 配合 `morya-ui/resolver` 与 `unplugin-vue-components` 减小体积 |\n| 浮层 | Dialog / Select / Tooltip 等使用 Vue `Teleport`；SSR 可输出占位，交互在客户端水合后生效 |\n\n## Nuxt 3\n\n推荐使用官方模块 **`@morya-ui/nuxt`**（同仓库 `packages/nuxt`）。\n\n### 安装\n\n```bash\npnpm add morya-ui @morya-ui/nuxt\npnpm add -D unplugin-vue-components\n```\n\n### 配置\n\n```ts\nimport { MoryaUIResolver } from 'morya-ui/resolver'\n// nuxt.config.ts\nimport Components from 'unplugin-vue-components/vite'\n\nexport default defineNuxtConfig({\n  modules: ['@morya-ui/nuxt'],\n  vite: {\n    plugins: [\n      Components({\n        resolvers: [MoryaUIResolver()],\n      }),\n    ],\n  },\n})\n```\n\n模块默认会：\n\n- 引入 `morya-ui/styles.css`\n- 将 `morya-ui` 加入 `build.transpile`\n- 在客户端注册 overlay 上下文（供 `toast` / `message` 使用）\n\n### 根布局\n\n```vue\n<!-- app.vue -->\n<script setup lang=\"ts\">\nconst theme = ref<'light' | 'dark'>('light')\n</script>\n\n<template>\n  <MConfigProvider :theme=\"theme\" density=\"comfortable\">\n    <NuxtPage />\n  </MConfigProvider>\n</template>\n```\n\n按需导入时无需 `app.use(MoryaUI)`；若需全量注册，可在 `plugins/morya-ui.client.ts` 中 `nuxtApp.vueApp.use(MoryaUI)`。\n\n### 仅客户端组件\n\n极少数依赖浏览器专有 API 的场景（如自定义 `appendTo` 到尚未存在的节点），可用 Nuxt 的 `<ClientOnly>` 包裹。\n\n## Astro + Vue\n\n适合 **静态页 + Vue 岛**（管理后台、控制台嵌入营销站）。\n\n### 安装\n\n```bash\npnpm add morya-ui\nnpx astro add vue\n```\n\n### 在 Vue 岛中使用\n\n```astro\n---\n// src/pages/admin.astro\nimport AdminShell from '../components/AdminShell.vue'\n---\n<AdminShell client:load />\n```\n\n```vue\n<!-- src/components/AdminShell.vue -->\n<script setup lang=\"ts\">\nimport { MButton, MConfigProvider } from 'morya-ui'\nimport 'morya-ui/styles.css'\n</script>\n\n<template>\n  <MConfigProvider theme=\"light\">\n    <MButton label=\"Hello\" />\n  </MConfigProvider>\n</template>\n```\n\n- 交互型后台推荐 `client:load` 或 `client:only`\n- 纯展示块可用 `client:visible` 延迟水合\n- Astro 本身不做 Vue SSR 时，无需处理 hydration id 问题\n\n## Vite SSR（含自定义服务端）\n\n```ts\nimport { MConfigProvider } from 'morya-ui/config-provider'\n// main.server.ts / entry-server.ts\nimport { createSSRApp } from 'vue'\nimport App from './App.vue'\nimport 'morya-ui/styles.css'\n\nexport function createApp() {\n  const app = createSSRApp(App)\n  return { app }\n}\n```\n\n客户端入口可注册 overlay 插件：\n\n```ts\n// entry-client.ts\nimport { createMoryaUI } from 'morya-ui'\n\ncreateApp(/* ... */)\n  .use(createMoryaUI({ components: false }))\n  .mount('#app')\n```\n\n构建时确保 `morya-ui` 进入 `ssr.noExternal`（或 `ssr: { noExternal: ['morya-ui'] }`），以便正确处理 `.vue` 与 CSS 副作用。\n\n## 其他 Vue SSR 方案\n\n| 方案 | 说明 |\n| --- | --- |\n| **vite-plugin-ssr / vike** | 与 Vite SSR 相同：服务端渲染 + 客户端 `createMoryaUI({ components: false })` |\n| **Inertia + Vue SSR** | 根组件包 `MConfigProvider`；命令式 API 仅在 `onMounted` 后调用 |\n\n## 已知限制\n\n- **不支持 Vue 2**；SSR 仅适用于 Vue 3。\n- **IE** 不在支持范围内（与 Vue 3 一致）。\n- 主题 `localStorage` 持久化仅在浏览器生效；SSR 首屏使用 `MConfigProvider` 或 cookie 同步主题可避免闪动。\n- 全量 E2E SSR 回归仍在完善；若遇到 hydration 警告，请提供最小复现并 [提 Issue](https://github.com/morya-space/morya-ui/issues)。\n\n## 下一步\n\n- [快速上手](/docs/quick-start)：安装与导入方式\n- [全局配置](/docs/config)：`MConfigProvider`\n- [主题](/docs/theme)：亮暗色与 token\n",
           "sections": [
             {
               "title": "",
@@ -33932,7 +34087,7 @@
             {
               "title": "其他 Vue SSR 方案",
               "id": "其他-vue-ssr-方案",
-              "body": "| 方案 | 说明 |\n| --- | --- |\n| **Quasar (SSR mode)** | 在 `quasar.config` 的 `build.transpileDependencies` 中加入 `morya-ui`，入口引入样式 |\n| **vite-plugin-ssr / vike** | 与 Vite SSR 相同：服务端渲染 + 客户端 `createMoryaUI({ components: false })` |\n| **Inertia + Vue SSR** | 根组件包 `MConfigProvider`；命令式 API 仅在 `onMounted` 后调用 |"
+              "body": "| 方案 | 说明 |\n| --- | --- |\n| **vite-plugin-ssr / vike** | 与 Vite SSR 相同：服务端渲染 + 客户端 `createMoryaUI({ components: false })` |\n| **Inertia + Vue SSR** | 根组件包 `MConfigProvider`；命令式 API 仅在 `onMounted` 后调用 |"
             },
             {
               "title": "已知限制",