@morya-ui/mcp 0.3.3 → 0.3.4

package/dist/page-snippets.js

@@ -8,26 +8,26 @@ export const pageSnippets = [
         pageTypes: ['list'],
         keywords: ['筛选', '搜索', '查询', 'filters', 'filter', 'search', 'keyword', 'reset'],
         imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
-        scriptSetup: `const keyword = ref('')
-const status = ref<string | undefined>()
-const statusOptions = [
-  { label: '全部', value: '' },
-  { label: '启用', value: 'active' },
-  { label: '停用', value: 'inactive' },
+        scriptSetup: `const keyword = ref('')
+const status = ref<string | undefined>()
+const statusOptions = [
+  { label: '全部', value: '' },
+  { label: '启用', value: 'active' },
+  { label: '停用', value: 'inactive' },
 ]`,
-        template: `<MPageFilters aria-label="筛选" variant="filled">
-  <MSpace wrap>
-    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
-    <MSelect
-      v-model="status"
-      :options="statusOptions"
-      placeholder="状态"
-      clearable
-      style="width: 10rem"
-    />
-    <MButton severity="secondary">查询</MButton>
-    <MButton severity="secondary" text>重置</MButton>
-  </MSpace>
+        template: `<MPageFilters aria-label="筛选" variant="filled">
+  <MSpace wrap>
+    <MInput v-model="keyword" placeholder="搜索名称" clearable style="width: 14rem" />
+    <MSelect
+      v-model="status"
+      :options="statusOptions"
+      placeholder="状态"
+      clearable
+      style="width: 10rem"
+    />
+    <MButton severity="secondary">查询</MButton>
+    <MButton severity="secondary" text>重置</MButton>
+  </MSpace>
 </MPageFilters>`,
         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'],
@@ -43,31 +43,31 @@ const statusOptions = [
         pageTypes: ['list'],
         keywords: ['折叠', '高级筛选', 'collapse', 'advanced', 'expand', 'filter'],
         imports: ['MPageFilters', 'MSpace', 'MInput', 'MSelect', 'MButton'],
-        scriptSetup: `const filtersExpanded = ref(false)
-const keyword = ref('')
+        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>
+        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'],
@@ -83,16 +83,16 @@ const department = ref<string | null>(null)`,
         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)"
-  />
+        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'],
@@ -108,10 +108,10 @@ const department = ref<string | null>(null)`,
         pageTypes: ['list'],
         keywords: ['页头', '标题', '新建', 'header', 'title', 'create', 'actions'],
         imports: ['MPageHeader', 'MButton'],
-        template: `<MPageHeader title="用户管理" description="维护账号、角色与权限。">
-  <template #actions>
-    <MButton severity="primary">新建用户</MButton>
-  </template>
+        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'],
@@ -127,12 +127,12 @@ const department = ref<string | null>(null)`,
         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>
+        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: ['左侧用 default 插槽展示已选数量', '批量操作用 text/outlined，danger 仅 destructive'],
         rulesEn: ['Use the default slot for selection count', 'Batch actions use text/outlined; danger only for destructive ops'],
@@ -143,46 +143,75 @@ const department = ref<string | null>(null)`,
         id: 'list-table',
         title: '列表页表格',
         titleEn: 'List page table',
-        description: '标准 MTable，直接放在 MPageContent 内，不额外包 Card。',
-        descriptionEn: 'Standard MTable placed directly in MPageContent without an extra Card wrapper.',
+        description: '标准 MTable，直接放在 MPageContent 内。全视口主列表可再加 fill（表体滚、分页贴底）；嵌入/短页不要 fill。',
+        descriptionEn: 'Standard MTable in MPageContent. Add fill only for full-viewport main lists; skip fill for embedded/short pages.',
         pageTypes: ['list'],
-        keywords: ['表格', 'table', 'pagination', 'paginator', 'empty', 'columns', 'rows'],
+        keywords: [
+            '表格',
+            'table',
+            'pagination',
+            'paginator',
+            'empty',
+            'columns',
+            'rows',
+            'fill',
+            '撑满',
+            '分页',
+        ],
         imports: ['MTable', 'MEmpty', 'MButton'],
-        scriptSetup: `const columns = [
-  { key: 'name', label: '名称' },
-  { key: 'status', label: '状态' },
-  { key: 'updatedAt', label: '更新时间' },
-  { key: 'actions', label: '操作', width: 128 },
-]
-const rows = ref<Record<string, unknown>[]>([])
+        scriptSetup: `const columns = [
+  { key: 'name', label: '名称' },
+  { key: 'status', label: '状态' },
+  { key: 'updatedAt', label: '更新时间' },
+  { key: 'actions', label: '操作', width: 128 },
+]
+const rows = ref<Record<string, unknown>[]>([])
 const loading = ref(false)`,
-        template: `<MTable
-  :columns="columns"
-  :rows="rows"
-  :loading="loading"
-  paginator
-  :rows-per-page="10"
-  striped
-  bordered
-  row-key="id"
-  aria-label="数据列表"
->
-  <template #empty>
-    <MEmpty
-      title="还没有数据"
-      description="创建第一条记录后，这里会列出结果。"
-      icon="inbox"
-    >
-      <template #extra>
-        <MButton severity="primary">新建</MButton>
-      </template>
-    </MEmpty>
-  </template>
+        template: `<!-- 全视口主列表再加 fill；嵌入/短页去掉 fill -->
+<MTable
+  :columns="columns"
+  :rows="rows"
+  :loading="loading"
+  fill
+  paginator
+  :rows-per-page="10"
+  striped
+  bordered
+  row-key="id"
+  aria-label="数据列表"
+>
+  <template #empty>
+    <MEmpty
+      title="还没有数据"
+      description="创建第一条记录后，这里会列出结果。"
+      icon="inbox"
+    >
+      <template #extra>
+        <MButton severity="primary">新建</MButton>
+      </template>
+    </MEmpty>
+  </template>
 </MTable>`,
-        rules: ['表格直接放在 MPageContent 内', '空态用 MEmpty，不要留空白或单行灰字'],
-        rulesEn: ['Place the table directly in MPageContent', 'Use MEmpty for zero-data states, not a blank or muted sentence'],
-        avoid: ['不要用 MCard 包裹 bordered MTable'],
-        avoidEn: ['Do not wrap a bordered MTable with MCard'],
+        rules: [
+            '先判断是否适合 fill：全视口后台主列表 + 表格是主任务 → MPageContent fill + MTable fill',
+            '嵌入表、短页、整页文档滚动 → 不要 fill，内容高度即可',
+            '表格直接放在 MPageContent 内；空态用 MEmpty',
+        ],
+        rulesEn: [
+            'Decide fill first: full-viewport admin main list → MPageContent fill + MTable fill',
+            'Embedded / short / document-scroll pages → skip fill',
+            'Place the table directly in MPageContent; use MEmpty for zero-data states',
+        ],
+        avoid: [
+            '不要用 MCard 包裹 bordered MTable',
+            '不要对嵌入/短页硬套 fill',
+            '适合 fill 时不要手写 min-height / calc',
+        ],
+        avoidEn: [
+            'Do not wrap a bordered MTable with MCard',
+            'Do not force fill on embedded or short pages',
+            'Do not hand-write min-height / calc when fill is appropriate',
+        ],
     },
     {
         id: 'list-row-actions',
@@ -193,11 +222,11 @@ const loading = ref(false)`,
         pageTypes: ['list'],
         keywords: ['行操作', '编辑', '删除', 'actions', 'row', 'cell'],
         imports: ['MSpace', 'MButton'],
-        template: `<template #cell-actions>
-  <MSpace>
-    <MButton severity="secondary" size="small" text>编辑</MButton>
-    <MButton severity="danger" size="small" text>删除</MButton>
-  </MSpace>
+        template: `<template #cell-actions>
+  <MSpace>
+    <MButton severity="secondary" size="small" text>编辑</MButton>
+    <MButton severity="danger" size="small" text>删除</MButton>
+  </MSpace>
 </template>`,
         rules: ['行内操作用 size="small" + text/outlined，避免一排实心按钮', '危险操作使用 severity="danger" 并配合确认弹窗'],
         rulesEn: ['Use size="small" with text/outlined row actions', 'Use severity="danger" with confirmation for destructive actions'],
@@ -213,11 +242,11 @@ const loading = ref(false)`,
         pageTypes: ['list'],
         keywords: ['分类', '标签', '可关闭', 'chip', 'category', 'tag-only'],
         imports: ['MTag'],
-        template: `<template #cell-category="{ value }">
-  <MTag
-    :value="String(value ?? '')"
-    severity="info"
-  />
+        template: `<template #cell-category="{ value }">
+  <MTag
+    :value="String(value ?? '')"
+    severity="info"
+  />
 </template>`,
         rules: ['分类/强调态用 MTag；行内业务状态用 MStatus（list-status-dot）', '不要用 Button 颜色表达状态'],
         rulesEn: ['Use MTag for categories; use MStatus for business status (list-status-dot)', 'Do not use Button colors for status'],
@@ -233,11 +262,11 @@ const loading = ref(false)`,
         pageTypes: ['list'],
         keywords: ['状态', 'status', 'dot', 'cell-status', '在线', '启用', '停用', '业务状态'],
         imports: ['MStatus'],
-        template: `<template #cell-status="{ value }">
-  <MStatus
-    :label="value === 'active' || value === 'online' ? '启用' : '停用'"
-    :severity="value === 'active' || value === 'online' ? 'success' : 'secondary'"
-  />
+        template: `<template #cell-status="{ value }">
+  <MStatus
+    :label="value === 'active' || value === 'online' ? '启用' : '停用'"
+    :severity="value === 'active' || value === 'online' ? 'success' : 'secondary'"
+  />
 </template>`,
         rules: ['行内轻量业务状态优先 MStatus', '不要用 Button 颜色表达状态'],
         rulesEn: ['Prefer MStatus for lightweight inline business status', 'Do not use Button colors for status'],
@@ -253,15 +282,15 @@ const loading = ref(false)`,
         pageTypes: ['list', 'common'],
         keywords: ['空状态', '无数据', 'empty', 'zero state', 'no data'],
         imports: ['MEmpty', 'MButton'],
-        template: `<MEmpty
-  title="还没有数据"
-  description="创建第一条记录后即可在此查看。"
-  icon="database"
->
-  <template #extra>
-    <MButton label="新建" />
-    <MButton label="导入" severity="secondary" text />
-  </template>
+        template: `<MEmpty
+  title="还没有数据"
+  description="创建第一条记录后即可在此查看。"
+  icon="database"
+>
+  <template #extra>
+    <MButton label="新建" />
+    <MButton label="导入" severity="secondary" text />
+  </template>
 </MEmpty>`,
         rules: ['正常无数据用 MEmpty，不要用错误色', '主 CTA 用 primary，次动作用 text/secondary'],
         rulesEn: ['Use MEmpty for normal emptiness, not error colors', 'Primary CTA + secondary/text for lesser actions'],
@@ -277,11 +306,11 @@ const loading = ref(false)`,
         pageTypes: ['common'],
         keywords: ['结果', '成功', '失败', '404', '403', 'result', 'success', 'error'],
         imports: ['MResult', 'MButton'],
-        template: `<MResult status="success" description="订单已创建，可在列表中查看详情。">
-  <template #extra>
-    <MButton label="查看订单" />
-    <MButton label="返回列表" severity="secondary" text />
-  </template>
+        template: `<MResult status="success" description="订单已创建，可在列表中查看详情。">
+  <template #extra>
+    <MButton label="查看订单" />
+    <MButton label="返回列表" severity="secondary" text />
+  </template>
 </MResult>`,
         rules: ['流程终点用 MResult', '提供明确下一步操作'],
         rulesEn: ['Use MResult for terminal outcomes', 'Provide clear next-step actions'],
@@ -312,15 +341,15 @@ const loading = ref(false)`,
         pageTypes: ['form'],
         keywords: ['表单', 'form', 'fields', 'formitem'],
         imports: ['MPageSection', 'MForm', 'MFormItem', 'MInput'],
-        scriptSetup: `const model = reactive({ name: '' })
+        scriptSetup: `const model = reactive({ name: '' })
 const submitting = ref(false)`,
-        template: `<MPageSection variant="form">
-  <MForm @submit.prevent="onSubmit">
-    <MFormItem label="姓名" name="name" required>
-      <MInput v-model="model.name" placeholder="请输入姓名" fluid />
-    </MFormItem>
-    <!-- 更多字段 -->
-  </MForm>
+        template: `<MPageSection variant="form">
+  <MForm @submit.prevent="onSubmit">
+    <MFormItem label="姓名" name="name" required>
+      <MInput v-model="model.name" placeholder="请输入姓名" fluid />
+    </MFormItem>
+    <!-- 更多字段 -->
+  </MForm>
 </MPageSection>`,
         rules: ['字段用 MFormItem + fluid 控件', '表单表面由 MPageSection 提供，不要重复 MCard'],
         rulesEn: ['Use MFormItem with fluid controls', 'Let MPageSection provide the surface; do not duplicate MCard'],
@@ -336,11 +365,11 @@ const submitting = ref(false)`,
         pageTypes: ['form'],
         keywords: ['保存', '取消', 'submit', 'actions', 'footer'],
         imports: ['MPageSection', 'MSpace', 'MButton'],
-        template: `<MPageSection variant="actions">
-  <MSpace>
-    <MButton native-type="submit" severity="primary" :loading="submitting">保存</MButton>
-    <MButton severity="secondary">取消</MButton>
-  </MSpace>
+        template: `<MPageSection variant="actions">
+  <MSpace>
+    <MButton native-type="submit" severity="primary" :loading="submitting">保存</MButton>
+    <MButton severity="secondary">取消</MButton>
+  </MSpace>
 </MPageSection>`,
         rules: ['提交按钮在前，取消 secondary', '保存中传 loading 防重复提交'],
         rulesEn: ['Submit first, cancel secondary', 'Pass loading while saving to prevent duplicate submits'],
@@ -356,21 +385,21 @@ const submitting = ref(false)`,
         pageTypes: ['dashboard'],
         keywords: ['kpi', '指标', 'stat', 'grid', 'metrics'],
         imports: ['MGrid', 'MGridItem', 'MPageStat'],
-        scriptSetup: `const metrics = ref([
-  { 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' },
+        scriptSetup: `const metrics = ref([
+  { 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">
-    <MPageStat
-      :label="metric.label"
-      :value="metric.value"
-      :trend="metric.trend"
-      :trend-direction="metric.trendDirection"
-      :trend-label="metric.trendLabel"
-      :icon="metric.icon"
-    />
-  </MGridItem>
+        template: `<MGrid :cols="4" :x-gap="16" :y-gap="16" responsive="screen">
+  <MGridItem v-for="metric in metrics" :key="metric.label" :span="1">
+    <MPageStat
+      :label="metric.label"
+      :value="metric.value"
+      :trend="metric.trend"
+      :trend-direction="metric.trendDirection"
+      :trend-label="metric.trendLabel"
+      :icon="metric.icon"
+    />
+  </MGridItem>
 </MGrid>`,
         rules: ['KPI 用 MPageStat，不要每页自定义 stat CSS', 'responsive="screen" 便于窄屏降列'],
         rulesEn: ['Use MPageStat for KPIs', 'Use responsive="screen" for narrow layouts'],
@@ -386,14 +415,14 @@ const submitting = ref(false)`,
         pageTypes: ['dashboard'],
         keywords: ['chart', '图表', 'placeholder', 'card', 'trend'],
         imports: ['MCard', 'MEmpty', 'MSkeleton'],
-        template: `<MCard title="趋势概览" shadow="always">
-  <MSkeleton v-if="loading" height="8rem" />
-  <MEmpty
-    v-else
-    aria-label="图表占位"
-    title="暂无图表数据"
-    description="图表区域（接入 ECharts / 业务组件）"
-  />
+        template: `<MCard title="趋势概览" shadow="always">
+  <MSkeleton v-if="loading" height="8rem" />
+  <MEmpty
+    v-else
+    aria-label="图表占位"
+    title="暂无图表数据"
+    description="图表区域（接入 ECharts / 业务组件）"
+  />
 </MCard>`,
         rules: ['图表区适合 MCard，因为需要 card 标题', '加载中用 MSkeleton'],
         rulesEn: ['Charts belong in MCard when a card title is needed', 'Use MSkeleton while loading'],
@@ -409,18 +438,18 @@ const submitting = ref(false)`,
         pageTypes: ['dashboard'],
         keywords: ['recent', '最近', 'table', 'card', 'list'],
         imports: ['MCard', 'MTable', 'MStatus'],
-        scriptSetup: `const recentColumns = [
-  { key: 'id', label: '工单号', width: 96 },
-  { key: 'title', label: '标题' },
-  { key: 'status', label: '状态', width: 110 },
-]
+        scriptSetup: `const recentColumns = [
+  { key: 'id', label: '工单号', width: 96 },
+  { key: 'title', label: '标题' },
+  { key: 'status', label: '状态', width: 110 },
+]
 const recentRows = ref<Record<string, unknown>[]>([])`,
-        template: `<MCard title="最近工单">
-  <MTable :columns="recentColumns" :rows="recentRows" size="small" :paginator="false" bordered row-key="id">
-    <template #cell-status="{ value }">
-      <MStatus :label="String(value ?? '')" severity="secondary" />
-    </template>
-  </MTable>
+        template: `<MCard title="最近工单">
+  <MTable :columns="recentColumns" :rows="recentRows" size="small" :paginator="false" bordered row-key="id">
+    <template #cell-status="{ value }">
+      <MStatus :label="String(value ?? '')" severity="secondary" />
+    </template>
+  </MTable>
 </MCard>`,
         rules: ['明细列表放 MCard 内合理', 'size="small" 适合卡片内表格', '行内业务状态用 MStatus'],
         rulesEn: ['Detail lists inside MCard are appropriate', 'Use size="small" for in-card tables', 'Use MStatus for row business status'],
@@ -436,10 +465,10 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['list', 'common'],
         keywords: ['page content', 'stack', 'layout content', '容器'],
         imports: ['MPageContent'],
-        template: `<MLayoutContent>
-  <MPageContent>
-    <!-- MPageFilters → MPageToolbar → MTable -->
-  </MPageContent>
+        template: `<MLayoutContent>
+  <MPageContent>
+    <!-- MPageFilters → MPageToolbar → MTable -->
+  </MPageContent>
 </MLayoutContent>`,
         rules: ['所有列表区块放在 MPageContent 内', '区块顺序：筛选 → 工具栏 → 表格'],
         rulesEn: ['Keep all list sections inside MPageContent', 'Order: filters → toolbar → table'],
@@ -455,10 +484,10 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['form', 'common'],
         keywords: ['narrow', 'form content', 'max-width'],
         imports: ['MPageContent'],
-        template: `<MLayoutContent>
-  <MPageContent width="narrow">
-    <!-- MPageHeader → MPageSection form → actions -->
-  </MPageContent>
+        template: `<MLayoutContent>
+  <MPageContent width="narrow">
+    <!-- MPageHeader → MPageSection form → actions -->
+  </MPageContent>
 </MLayoutContent>`,
         rules: ['表单页使用 width="narrow"', '不要手写 max-width CSS'],
         rulesEn: ['Use width="narrow" on form pages', 'Do not hand-write max-width CSS'],
@@ -474,14 +503,14 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
         pageTypes: ['detail'],
         keywords: ['detail', '详情', 'edit', 'header'],
         imports: ['MPageHeader', 'MButton', 'MStatus', 'MSpace'],
-        template: `<MPageHeader title="示例资源" description="查看摘要与属性。">
-  <template #actions>
-    <MSpace>
-      <MStatus label="正常" severity="success" />
-      <MButton severity="primary">编辑</MButton>
-      <MButton severity="danger" text>删除</MButton>
-    </MSpace>
-  </template>
+        template: `<MPageHeader title="示例资源" description="查看摘要与属性。">
+  <template #actions>
+    <MSpace>
+      <MStatus label="正常" severity="success" />
+      <MButton severity="primary">编辑</MButton>
+      <MButton severity="danger" text>删除</MButton>
+    </MSpace>
+  </template>
 </MPageHeader>`,
         rules: ['状态用 MStatus 放在 actions 区', '编辑为 primary，删除用 danger text'],
         rulesEn: ['Use MStatus in the actions area', 'Edit is primary; delete uses danger text'],
@@ -507,29 +536,29 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
             'MConfigProvider',
             'zhCN',
         ],
-        template: `<MConfigProvider :locale="zhCN">
-  <MLayout fill-viewport has-sider>
-    <MLayoutSider v-model:collapsed="siderCollapsed" bordered :collapsed-width="72">
-      <MMenu
-        :model="[
-          { key: 'users', label: '用户管理', icon: 'user', to: '/users' },
-          { key: 'roles', label: '角色管理', icon: 'shield', to: '/roles' },
-        ]"
-        :collapsed="siderCollapsed"
-        :collapsed-width="72"
-      />
-    </MLayoutSider>
-    <MLayout>
-      <MLayoutHeader :padding="'var(--m-space-4) var(--m-space-6)'">
-        <MBreadcrumb :model="[{ label: '首页', to: '/' }, { label: '当前页' }]" />
-      </MLayoutHeader>
-      <MLayoutContent>
-        <MPageContent>
-          <!-- page sections -->
-        </MPageContent>
-      </MLayoutContent>
-    </MLayout>
-  </MLayout>
+        template: `<MConfigProvider :locale="zhCN">
+  <MLayout fill-viewport has-sider>
+    <MLayoutSider v-model:collapsed="siderCollapsed" bordered :collapsed-width="72">
+      <MMenu
+        :model="[
+          { key: 'users', label: '用户管理', icon: 'user', to: '/users' },
+          { key: 'roles', label: '角色管理', icon: 'shield', to: '/roles' },
+        ]"
+        :collapsed="siderCollapsed"
+        :collapsed-width="72"
+      />
+    </MLayoutSider>
+    <MLayout>
+      <MLayoutHeader :padding="'var(--m-space-4) var(--m-space-6)'">
+        <MBreadcrumb :model="[{ label: '首页', to: '/' }, { label: '当前页' }]" />
+      </MLayoutHeader>
+      <MLayoutContent>
+        <MPageContent>
+          <!-- page sections -->
+        </MPageContent>
+      </MLayoutContent>
+    </MLayout>
+  </MLayout>
 </MConfigProvider>`,
         rules: [
             '根布局用 fillViewport',
@@ -562,19 +591,19 @@ const recentRows = ref<Record<string, unknown>[]>([])`,
             'log',
         ],
         imports: ['MScrollbar', 'MCard'],
-        template: `<MCard title="活动日志">
-  <MScrollbar max-height="16rem">
-    <ul style="margin:0;padding:0;list-style:none">
-      <li v-for="item in logLines" :key="item.id" style="padding:var(--m-space-2) 0;border-bottom:1px solid var(--m-color-border)">
-        {{ item.text }}
-      </li>
-    </ul>
-  </MScrollbar>
+        template: `<MCard title="活动日志">
+  <MScrollbar max-height="16rem">
+    <ul style="margin:0;padding:0;list-style:none">
+      <li v-for="item in logLines" :key="item.id" style="padding:var(--m-space-2) 0;border-bottom:1px solid var(--m-color-border)">
+        {{ item.text }}
+      </li>
+    </ul>
+  </MScrollbar>
 </MCard>`,
-        scriptSetup: `const logLines = [
-  { id: '1', text: '用户 admin 登录成功' },
-  { id: '2', text: '导出任务已完成' },
-  { id: '3', text: '配置已保存' },
+        scriptSetup: `const logLines = [
+  { id: '1', text: '用户 admin 登录成功' },
+  { id: '2', text: '导出任务已完成' },
+  { id: '3', text: '配置已保存' },
 ]`,
         rules: [
             '整页主滚动推荐 MLayout fillViewport',