@morya-ui/mcp 0.3.1 → 0.3.2

package/data/example-coverage.json

@@ -1,6 +1,6 @@
 {
-  "generatedAt": "2026-09-23T09:00:43.642Z",
-  "catalogGeneratedAt": "2026-09-23T09:00:38.573Z",
+  "generatedAt": "2026-09-24T03:18:19.583Z",
+  "catalogGeneratedAt": "2026-09-24T03:18:15.247Z",
   "components": [
     {
       "id": "Accordion",
@@ -198,12 +198,14 @@
       "exportName": "MButton",
       "examples": 20,
       "props": {
-        "total": 24,
+        "total": 26,
         "covered": 21,
         "missing": [
           "variant",
-          "autofocus",
-          "nativeType"
+          "ripple",
+          "press",
+          "nativeType",
+          "autofocus"
         ]
       },
       "events": {
@@ -231,7 +233,7 @@
     {
       "id": "Card",
       "exportName": "MCard",
-      "examples": 8,
+      "examples": 10,
       "props": {
         "total": 8,
         "covered": 4,
@@ -1920,13 +1922,15 @@
     {
       "id": "Page",
       "exportName": "MPageContent",
-      "examples": 6,
+      "examples": 10,
       "props": {
-        "total": 13,
-        "covered": 10,
+        "total": 24,
+        "covered": 19,
         "missing": [
+          "bands",
+          "expandLabel",
+          "collapseLabel",
           "headingLevel",
-          "trendSeverity",
           "minHeight"
         ]
       },
@@ -1936,9 +1940,15 @@
         "missing": []
       },
       "slots": {
-        "total": 2,
-        "covered": 2,
-        "missing": []
+        "total": 8,
+        "covered": 3,
+        "missing": [
+          "active",
+          "breadcrumb",
+          "tags",
+          "icon",
+          "extra"
+        ]
       },
       "methods": {
         "total": 0,
@@ -3377,6 +3387,6 @@
   "summary": {
     "components": 93,
     "componentsWithMissingCoverage": 93,
-    "totalExamples": 811
+    "totalExamples": 817
   }
 }

package/data/golden-pages/dashboard-page.vue

@@ -13,8 +13,8 @@ import {
   MLayoutContent,
   MLayoutHeader,
   MPageContent,
+  MEmpty,
   MPageHeader,
-  MPagePlaceholder,
   MPageStat,
   MStatus,
   MTable,
@@ -23,9 +23,9 @@ import {
 } from 'morya-ui'
 
 const stats = [
-  { label: '总用户', value: '12,480', trend: '+8.2%', icon: 'users' },
-  { label: '今日活跃', value: '1,926', trend: '+3.1%', icon: 'activity' },
-  { label: '待处理工单', value: '47', trend: '-12%', trendSeverity: 'warn' as const, icon: 'clipboard' },
+  { label: '总用户', value: '12,480', trend: '+8.2%', trendDirection: 'up' as const, trendLabel: '较上月', icon: 'users' },
+  { label: '今日活跃', value: '1,926', trend: '+3.1%', trendDirection: 'up' as const, trendLabel: '较昨日', icon: 'activity' },
+  { label: '待处理工单', value: '47', trend: '-12%', trendDirection: 'down' as const, trendLabel: '较上周', trendSeverity: 'warn' as const, icon: 'clipboard' },
   { label: '系统健康', value: '99.9%', trend: '稳定', trendSeverity: 'secondary' as const, icon: 'heart' },
 ]
 
@@ -88,6 +88,8 @@ function statusSeverity(s: string) {
                 :value="item.value"
                 :trend="item.trend"
                 :trend-severity="item.trendSeverity ?? 'primary'"
+                :trend-direction="item.trendDirection"
+                :trend-label="item.trendLabel"
                 :icon="item.icon"
               />
             </MGridItem>
@@ -95,15 +97,15 @@ function statusSeverity(s: string) {
 
           <MGrid :cols="2" :x-gap="16" :y-gap="16" responsive="screen">
             <MGridItem :span="1">
-              <MCard title="趋势概览">
-                <MPagePlaceholder
-                  aria-label="图表占位"
+              <MCard title="趋势概览" shadow="always">
+                <MEmpty
                   description="接入图表组件后展示近 7 日活跃与转化。"
+                  icon="chart-bar"
                 />
               </MCard>
             </MGridItem>
             <MGridItem :span="1">
-              <MCard title="最近工单">
+              <MCard title="最近工单" shadow="always">
                 <MTable
                   :columns="recentColumns"
                   :rows="recentRows"

package/data/golden-pages/empty-state.vue

@@ -13,7 +13,7 @@ import {
   MLayoutContent,
   MLayoutHeader,
   MPageContent,
-  MPageToolbar,
+  MPageHeader,
   zhCN,
 } from 'morya-ui'
 </script>
@@ -27,61 +27,30 @@ import {
 
       <MLayoutContent>
         <MPageContent>
-          <MPageToolbar title="课程">
+          <MPageHeader title="课程" description="管理目录与可见性。">
             <template #actions>
-              <MButton label="新建课程" />
+              <MButton severity="primary">
+                新建课程
+              </MButton>
             </template>
-          </MPageToolbar>
+          </MPageHeader>
 
-          <div class="empty-state-shell">
-            <MEmpty
-              title="还没有课程"
-              description="创建第一门课程后，学员就能在目录里看到它。也可以稍后从模板导入。"
-              icon="book"
-            >
-              <template #extra>
-                <MButton label="创建第一门课程" />
-                <MButton label="从模板导入" severity="secondary" text />
-              </template>
-            </MEmpty>
-          </div>
+          <MEmpty
+            title="还没有课程"
+            description="创建第一门课程后，学员就能在目录里看到它。也可以稍后从模板导入。"
+            icon="book"
+          >
+            <template #extra>
+              <MButton severity="primary">
+                创建第一门课程
+              </MButton>
+              <MButton severity="secondary" text>
+                从模板导入
+              </MButton>
+            </template>
+          </MEmpty>
         </MPageContent>
       </MLayoutContent>
     </MLayout>
   </MConfigProvider>
 </template>
-
-<style scoped>
-.empty-state-shell {
-  display: grid;
-  place-items: center;
-  min-height: 18rem;
-  padding: var(--m-space-8) var(--m-space-6);
-  border: 1px dashed color-mix(in srgb, var(--m-color-border) 80%, var(--m-color-primary));
-  border-radius: var(--m-radius-md);
-  background:
-    radial-gradient(
-      120% 80% at 50% 0%,
-      color-mix(in srgb, var(--m-color-primary) 10%, transparent),
-      transparent 55%
-    ),
-    var(--m-color-surface);
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .empty-state-shell {
-    animation: empty-in 400ms ease both;
-  }
-}
-
-@keyframes empty-in {
-  from {
-    opacity: 0;
-    transform: translateY(0.35rem);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-</style>

package/data/golden-pages/form-in-dialog.vue

@@ -16,7 +16,7 @@ import {
   MLayoutContent,
   MLayoutHeader,
   MPageContent,
-  MPageToolbar,
+  MPageHeader,
   MSelect,
   MSpace,
   MStatus,
@@ -101,13 +101,13 @@ async function onSave() {
 
       <MLayoutContent>
         <MPageContent>
-          <MPageToolbar title="用户管理">
+          <MPageHeader title="用户管理" description="短表单留在列表内弹窗；字段多时再走独立表单页。">
             <template #actions>
               <MButton severity="primary" @click="openCreate">
                 新建用户
               </MButton>
             </template>
-          </MPageToolbar>
+          </MPageHeader>
 
           <MTable
             :columns="columns"

package/data/golden-pages/list-page.vue

@@ -15,18 +15,22 @@ import {
   MLayoutSider,
   MMenu,
   MPageContent,
+  MPageFilterChips,
   MPageFilters,
-  MPageToolbar,
+  MPageHeader,
   MSelect,
   MSpace,
   MStatus,
   MTable,
+  MTag,
   zhCN,
 } from 'morya-ui'
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 
 const keyword = ref('')
 const status = ref<string | undefined>()
+const department = ref<string | null>(null)
+const filtersExpanded = ref(false)
 const siderCollapsed = ref(false)
 
 const menuModel = [
@@ -41,6 +45,39 @@ const statusOptions = [
   { label: '停用', value: 'inactive' },
 ]
 
+const departmentOptions = [
+  { label: '研发', value: '研发' },
+  { label: '运营', value: '运营' },
+  { label: '市场', value: '市场' },
+]
+
+const activeFilters = computed(() => {
+  const items: Array<{ key: string; label: string }> = []
+  if (keyword.value.trim()) {
+    items.push({ key: 'keyword', label: `关键词：${keyword.value.trim()}` })
+  }
+  if (status.value) {
+    const label = statusOptions.find((o) => o.value === status.value)?.label ?? status.value
+    items.push({ key: 'status', label: `状态：${label}` })
+  }
+  if (department.value) {
+    items.push({ key: 'department', label: `部门：${department.value}` })
+  }
+  return items
+})
+
+function clearFilter(key: string) {
+  if (key === 'keyword') keyword.value = ''
+  if (key === 'status') status.value = undefined
+  if (key === 'department') department.value = null
+}
+
+function resetFilters() {
+  keyword.value = ''
+  status.value = undefined
+  department.value = null
+}
+
 const columns = [
   { key: 'name', label: '名称' },
   { key: 'status', label: '状态', width: 120 },
@@ -76,7 +113,20 @@ const rows = [
 
         <MLayoutContent>
           <MPageContent>
-            <MPageFilters aria-label="筛选">
+            <MPageHeader title="用户管理" description="维护账号、角色与权限。">
+              <template #actions>
+                <MButton severity="primary">
+                  新建用户
+                </MButton>
+              </template>
+            </MPageHeader>
+
+            <MPageFilters
+              v-model:expanded="filtersExpanded"
+              aria-label="筛选"
+              variant="filled"
+              collapsible
+            >
               <MSpace wrap>
                 <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
                 <MSelect
@@ -86,22 +136,37 @@ const rows = [
                   clearable
                   style="width: 10rem"
                 />
-                <MButton severity="primary">
+                <MButton severity="secondary">
                   查询
                 </MButton>
-                <MButton severity="secondary">
+                <MButton severity="secondary" text @click="resetFilters">
                   重置
                 </MButton>
               </MSpace>
+              <template #advanced>
+                <MSpace wrap>
+                  <MSelect
+                    v-model="department"
+                    :options="departmentOptions"
+                    placeholder="部门"
+                    clearable
+                    style="width: 10rem"
+                  />
+                </MSpace>
+              </template>
             </MPageFilters>
 
-            <MPageToolbar title="用户管理">
-              <template #actions>
-                <MButton severity="primary">
-                  新建用户
-                </MButton>
-              </template>
-            </MPageToolbar>
+            <MPageFilterChips v-if="activeFilters.length" label="已选" aria-label="已选筛选">
+              <MTag
+                v-for="item in activeFilters"
+                :key="item.key"
+                :value="item.label"
+                size="small"
+                bordered
+                closable
+                @close="clearFilter(item.key)"
+              />
+            </MPageFilterChips>
 
             <MTable
               :columns="columns"

package/dist/__tests__/tools.test.js

@@ -149,7 +149,7 @@ describe('@morya-ui/mcp handlers', () => {
     });
     it('searches page snippets scope', () => {
         const result = read(handlers.search({ query: 'toolbar', scope: 'snippets', limit: 5 }));
-        expect(result.items.some((item) => item.type === 'snippet' && item.id === 'list-toolbar')).toBe(true);
+        expect(result.items.some((item) => item.type === 'snippet' && item.id === 'list-batch-toolbar')).toBe(true);
     });
     it('suggests double-border page composition as advisory standard', () => {
         const result = read(handlers.validatePage({

package/dist/page-snippets.js

@@ -6,7 +6,7 @@ export const pageSnippets = [
         description: '在 MPageContent 内追加或替换筛选区，使用 MPageFilters + MSpace 包裹控件。',
         descriptionEn: 'Add or replace a filter region inside MPageContent using MPageFilters and MSpace.',
         pageTypes: ['list'],
-        keywords: ['筛选', '搜索', '查询', 'filter', 'search', 'keyword', 'reset'],
+        keywords: ['筛选', '搜索', '查询', 'filters', 'filter', 'search', 'keyword', 'reset'],
         imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
         scriptSetup: `const keyword = ref('')
 const status = ref<string | undefined>()
@@ -15,7 +15,7 @@ const statusOptions = [
   { label: '启用', value: 'active' },
   { label: '停用', value: 'inactive' },
 ]`,
-        template: `<MPageFilters aria-label="筛选">
+        template: `<MPageFilters aria-label="筛选" variant="filled">
   <MSpace wrap>
     <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
     <MSelect
@@ -25,33 +25,119 @@ const statusOptions = [
       clearable
       style="width: 10rem"
     />
-    <MButton severity="primary">查询</MButton>
-    <MButton severity="secondary">重置</MButton>
+    <MButton severity="secondary">查询</MButton>
+    <MButton severity="secondary" text>重置</MButton>
   </MSpace>
 </MPageFilters>`,
-        rules: ['放在 MPageContent 内、MPageToolbar 之前', '不要外包 MCard', '筛选项宽度用 inline style，区块样式交给 MPageFilters'],
-        rulesEn: ['Place inside MPageContent before MPageToolbar', 'Do not wrap with MCard', 'Use inline width on controls; let MPageFilters own the surface'],
+        rules: ['放在 MPageHeader 之后、表格之前', 'viewport 内仅一个 primary（通常在 Header）', '不要外包 MCard'],
+        rulesEn: ['Place after MPageHeader and before the table', 'Keep one primary in the viewport (usually in Header)', 'Do not wrap with MCard'],
         avoid: ['不要手写 .page-filters 类', '不要用 MCard 包筛选区'],
         avoidEn: ['Do not hand-write .page-filters classes', 'Do not wrap filters in MCard'],
     },
+    {
+        id: 'list-filters-collapsible',
+        title: '列表页折叠筛选',
+        titleEn: 'Collapsible list filters',
+        description: 'MPageFilters collapsible + #advanced 隐藏次要字段。',
+        descriptionEn: 'Hide secondary fields with collapsible MPageFilters and an #advanced slot.',
+        pageTypes: ['list'],
+        keywords: ['折叠', '高级筛选', 'collapse', 'advanced', 'expand', 'filter'],
+        imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
+        scriptSetup: `const filtersExpanded = ref(false)
+const keyword = ref('')
+const department = ref<string | null>(null)`,
+        template: `<MPageFilters
+  v-model:expanded="filtersExpanded"
+  aria-label="筛选"
+  variant="filled"
+  collapsible
+>
+  <MSpace wrap>
+    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
+    <MButton severity="secondary">查询</MButton>
+    <MButton severity="secondary" text>重置</MButton>
+  </MSpace>
+  <template #advanced>
+    <MSpace wrap>
+      <MSelect
+        v-model="department"
+        :options="[{ label: '研发', value: '研发' }, { label: '运营', value: '运营' }]"
+        placeholder="部门"
+        clearable
+        style="width: 10rem"
+      />
+    </MSpace>
+  </template>
+</MPageFilters>`,
+        rules: ['常用条件放 default，次要条件放 #advanced', '查询/重置保持 secondary'],
+        rulesEn: ['Keep primary filters in default; secondary filters in #advanced', 'Query/reset stay secondary'],
+        avoid: ['不要用 MCard 包整个筛选区'],
+        avoidEn: ['Do not wrap the whole filter bar in MCard'],
+    },
+    {
+        id: 'list-filter-chips',
+        title: '列表页已选筛选',
+        titleEn: 'Active filter chips',
+        description: 'MPageFilterChips + MTag closable 展示并清除已选条件。',
+        descriptionEn: 'Show and clear active filters with MPageFilterChips and closable MTag.',
+        pageTypes: ['list'],
+        keywords: ['已选', 'chip', 'tag', 'active', 'clear', '筛选'],
+        imports: ['MPageFilterChips', 'MTag'],
+        template: `<MPageFilterChips label="已选" aria-label="已选筛选">
+  <MTag
+    v-for="item in activeFilters"
+    :key="item.key"
+    :value="item.label"
+    size="small"
+    bordered
+    closable
+    @close="clearFilter(item.key)"
+  />
+</MPageFilterChips>`,
+        rules: ['放在 MPageFilters 之后、表格之前', '用业务 computed 生成 activeFilters'],
+        rulesEn: ['Place after MPageFilters and before the table', 'Derive activeFilters from filter state'],
+        avoid: ['不要手写 pill 样式或 dashed 壳'],
+        avoidEn: ['Do not hand-write pill or dashed shells'],
+    },
     {
         id: 'list-toolbar',
-        title: '列表页工具栏',
-        titleEn: 'List page toolbar',
-        description: '标题 + 主操作按钮，放在筛选区之后、表格之前。',
-        descriptionEn: 'Page title and primary action between filters and the table.',
+        title: '列表页页头',
+        titleEn: 'List page header',
+        description: '页面身份 + 唯一 primary（新建），放在 MPageContent 顶部。',
+        descriptionEn: 'Page identity and the single primary action at the top of MPageContent.',
         pageTypes: ['list'],
-        keywords: ['工具栏', '标题', '新建', 'toolbar', 'title', 'create', 'actions'],
-        imports: ['MPageToolbar', 'MButton'],
-        template: `<MPageToolbar title="用户管理">
+        keywords: ['页头', '标题', '新建', 'header', 'title', 'create', 'actions'],
+        imports: ['MPageHeader', 'MButton'],
+        template: `<MPageHeader title="用户管理" description="维护账号、角色与权限。">
   <template #actions>
     <MButton severity="primary">新建用户</MButton>
   </template>
+</MPageHeader>`,
+        rules: ['页级标题用 MPageHeader，不要用 MPageToolbar 当第二页头', '主操作放 #actions'],
+        rulesEn: ['Use MPageHeader for page identity; do not use MPageToolbar as a second page title', 'Put primary actions in #actions'],
+        avoid: ['不要在 Toolbar 上写页面 H1 标题'],
+        avoidEn: ['Do not put the page H1 on MPageToolbar'],
+    },
+    {
+        id: 'list-batch-toolbar',
+        title: '列表页批量操作条',
+        titleEn: 'List batch action row',
+        description: '表格多选时的批量操作，放在筛选区之后（可选）。',
+        descriptionEn: 'Optional batch actions after filters when rows are selectable.',
+        pageTypes: ['list'],
+        keywords: ['批量', '已选', 'toolbar', 'batch', 'export', 'delete'],
+        imports: ['MPageToolbar', 'MButton'],
+        template: `<MPageToolbar>
+  <span style="color:var(--m-color-text-muted);font-size:var(--m-font-size-sm)">已选 0 项</span>
+  <template #actions>
+    <MButton severity="secondary" text>导出</MButton>
+    <MButton severity="danger" text>删除</MButton>
+  </template>
 </MPageToolbar>`,
-        rules: ['主操作放 #actions', '标题优先用 title prop，不用裸 h1 + flex'],
-        rulesEn: ['Put primary actions in #actions', 'Prefer the title prop over raw h1 + flex'],
-        avoid: ['不要再用自定义 toolbar CSS'],
-        avoidEn: ['Do not add custom toolbar CSS'],
+        rules: ['左侧用 default 插槽展示已选数量', '批量操作用 text/outlined，danger 仅 destructive'],
+        rulesEn: ['Use the default slot for selection count', 'Batch actions use text/outlined; danger only for destructive ops'],
+        avoid: ['不要用 Toolbar title 充当页面标题'],
+        avoidEn: ['Do not use Toolbar title as the page heading'],
     },
     {
         id: 'list-table',
@@ -271,8 +357,8 @@ const submitting = ref(false)`,
         keywords: ['kpi', '指标', 'stat', 'grid', 'metrics'],
         imports: ['MGrid', 'MGridItem', 'MPageStat'],
         scriptSetup: `const metrics = ref([
-  { label: '总用户', value: '12,480', trend: '+8.2%', icon: 'users' },
-  { label: '今日活跃', value: '1,926', trend: '+3.1%', icon: 'activity' },
+  { label: '总用户', value: '12,480', trend: '+8.2%', trendDirection: 'up' as const, trendLabel: '较上月', icon: 'users' },
+  { label: '今日活跃', value: '1,926', trend: '+3.1%', trendDirection: 'up' as const, trendLabel: '较昨日', icon: 'activity' },
 ])`,
         template: `<MGrid :cols="4" :x-gap="16" :y-gap="16" responsive="screen">
   <MGridItem v-for="metric in metrics" :key="metric.label" :span="1">
@@ -280,7 +366,9 @@ const submitting = ref(false)`,
       :label="metric.label"
       :value="metric.value"
       :trend="metric.trend"
-      icon="activity"
+      :trend-direction="metric.trendDirection"
+      :trend-label="metric.trendLabel"
+      :icon="metric.icon"
     />
   </MGridItem>
 </MGrid>`,
@@ -293,16 +381,17 @@ const submitting = ref(false)`,
         id: 'dashboard-chart-card',
         title: '仪表盘图表卡片',
         titleEn: 'Dashboard chart card',
-        description: 'MCard 标题 + MPagePlaceholder 作为图表占位。',
-        descriptionEn: 'MCard title with MPagePlaceholder for chart area.',
+        description: 'MCard shadow="always" + MEmpty 作为图表占位。',
+        descriptionEn: 'MCard with shadow="always" and MEmpty for chart pending state.',
         pageTypes: ['dashboard'],
         keywords: ['chart', '图表', 'placeholder', 'card', 'trend'],
-        imports: ['MCard', 'MPagePlaceholder', 'MSkeleton'],
-        template: `<MCard title="趋势概览">
+        imports: ['MCard', 'MEmpty', 'MSkeleton'],
+        template: `<MCard title="趋势概览" shadow="always">
   <MSkeleton v-if="loading" height="8rem" />
-  <MPagePlaceholder
+  <MEmpty
     v-else
     aria-label="图表占位"
+    title="暂无图表数据"
     description="图表区域（接入 ECharts / 业务组件）"
   />
 </MCard>`,
@@ -380,19 +469,22 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         id: 'detail-toolbar',
         title: '详情页顶栏',
         titleEn: 'Detail page header actions',
-        description: '详情页标题与编辑操作。',
-        descriptionEn: 'Detail page title and edit action.',
+        description: '详情页标题、状态与编辑操作。',
+        descriptionEn: 'Detail page title, status, and edit actions.',
         pageTypes: ['detail'],
-        keywords: ['detail', '详情', 'edit', 'toolbar'],
-        imports: ['MPageToolbar', 'MButton', 'MTag'],
-        template: `<MPageToolbar title="示例资源">
+        keywords: ['detail', '详情', 'edit', 'header'],
+        imports: ['MPageHeader', 'MButton', 'MStatus', 'MSpace'],
+        template: `<MPageHeader title="示例资源" description="查看摘要与属性。">
   <template #actions>
-    <MButton severity="primary" outlined>编辑</MButton>
+    <MSpace>
+      <MStatus label="正常" severity="success" />
+      <MButton severity="primary">编辑</MButton>
+      <MButton severity="danger" text>删除</MButton>
+    </MSpace>
   </template>
-</MPageToolbar>
-<MTag value="正常" severity="success" />`,
-        rules: ['状态 Tag 放在标题区附近', '编辑为主操作，删除放低强调区域'],
-        rulesEn: ['Keep status Tag near the header area', 'Edit is primary; delete stays low emphasis'],
+</MPageHeader>`,
+        rules: ['状态用 MStatus 放在 actions 区', '编辑为 primary，删除用 danger text'],
+        rulesEn: ['Use MStatus in the actions area', 'Edit is primary; delete uses danger text'],
         avoid: ['不要把操作散落到多个无关区域'],
         avoidEn: ['Do not scatter actions across unrelated areas'],
     },