iter(g130): 新增栅格容器 grid

.ua/backlog.json

@@ -1399,11 +1399,11 @@
     },
     {
       "id": "g130",
-      "title": "新增栅格布局 row / col",
+      "title": "新增栅格容器 grid",
       "motivation": "页面骨架只能靠 space 与手写 flex，24 栅格、列间距、响应式断点缺失，示例页布局各写一套",
-      "acceptance": "row 提供 gutter 列间距与 justify/align，col 提供 span/offset 与 sm/md 断点；窄屏自动堆叠；样式只消费 --ua-*；文档与演示同步；npm run check 全绿",
+      "acceptance": "grid 支持 columns 固定列数与 min 走 auto-fit 自适应列宽、gutter 统一列间距、align 交叉轴对齐、dense 紧凑填充；窄屏自动降为单列；样式只消费 --ua-*；manifest/docs/README/demo/llms-full 同步；npm run check 全绿",
       "status": "open",
-      "notes": "自补：组件补充方向"
+      "notes": "自补：组件补充方向（原设想 row/col 24 栅格，实施改为单容器 grid —— auto-fit 已覆盖响应式，跨列需求交给子项自身宽度，少一层抽象）"
     },
     {
       "id": "g131",

.ua/index.json

@@ -1,6 +1,6 @@
 {
   "$schema": "ui-arch-registry-index/0.1",
-  "generatedAt": "2026-10-26T07:17:51.824Z",
+  "generatedAt": "2026-10-26T07:19:51.268Z",
   "repoRoot": ".",
   "packages": [
     {
@@ -204,7 +204,8 @@
           "anchor(props)：锚点导航，竖排区块链接，滚动时按目标位置高亮当前区块（aria-current 同步），点击按 offset 偏移量平滑定位并回写 hash；container 可指定内滚容器",
           "popconfirm(props, trigger)：二次确认气泡，挂在任意触发器上，就地确认危险操作；确定后先收起再回调，取消 / 点外部 / Esc 走 onCancel，展开即聚焦「取消」",
           "calendar(props)：月历，整月网格内嵌页面（排期 / 值班 / 日程），每日可带 marker 标记文案，方向键漫游 + Enter 选中，翻月走 onMonthChange",
-          "typography(props)：排版文本，variant 决定语义（标题出 h1-h5 / 段落出 p / 行内出 span），支持语义色、装饰位、对齐、多行截断与复制按钮"
+          "typography(props)：排版文本，variant 决定语义（标题出 h1-h5 / 段落出 p / 行内出 span），支持语义色、装饰位、对齐、多行截断与复制按钮",
+          "grid(props, ...children)：栅格容器，columns 固定列数或 min 走 auto-fit 自适应列宽，gutter 统一列间距，窄屏自动降为单列"
         ],
         "keyTypes": [
           "ButtonProps",
@@ -3161,6 +3162,51 @@
               "content 传 DOM 时组件只负责语义标签与类名：截断与复制对 DOM 内容不生效（取不到稳定文本）",
               "段落连续排列时相邻 .ua-type-paragraph 自动留出间距，单个段落不额外撑高，嵌进卡片也不会有空隙"
             ]
+          },
+          {
+            "id": "grid",
+            "title": "栅格容器 Grid",
+            "demo": "sec-grid",
+            "props": [
+              {
+                "n": "columns",
+                "t": "number",
+                "df": "3",
+                "d": "固定列数（按等宽铺开）；窄屏（≤640px）由样式表统一降为单列"
+              },
+              {
+                "n": "min",
+                "t": "string",
+                "d": "自适应最小列宽（如 '220px'）：给了就按 auto-fit 铺列，列数随可用宽度自然增减，此时忽略 columns"
+              },
+              {
+                "n": "gutter",
+                "t": "SpaceSize",
+                "df": "md",
+                "d": "列间距：sm/md/lg 走令牌，数字按像素"
+              },
+              {
+                "n": "align",
+                "t": "'start' | 'center' | 'end' | 'stretch'",
+                "df": "stretch",
+                "d": "交叉轴对齐：同行子项高度不一时决定各自贴哪边或拉满"
+              },
+              {
+                "n": "dense",
+                "t": "boolean",
+                "df": "false",
+                "d": "紧凑填充：小项回填前面留下的空洞（瀑布式排布）"
+              }
+            ],
+            "example": "grid({ columns: 3, gutter: 'md' }, card({ title: '实例数' }, statistic({ value: total })), card({ title: '错误率' }, statistic({ value: errRate }))); grid({ min: '240px', align: 'start' }, ...items)",
+            "steps": [
+              "页面骨架用 grid({ columns: n }) 铺等宽卡片：子项宽度由列模板算，别在子项上写 width，窄屏会自动变成单列",
+              "卡片宽度要求「不窄于 X」时用 min（如 '240px'）：auto-fit 会按可用宽度决定列数，比手写断点稳，此时不要再传 columns",
+              "列间距统一走 gutter（sm/md/lg 令牌或像素），不要在子项上写 margin——相邻 margin 会叠加成双倍间距",
+              "同行卡片高度参差时：要等高（默认 stretch），要各自顶端对齐传 align: 'start'",
+              "子项必须是单个元素（card / div / 自定义块），grid 只负责排布且已对子项设 min-width: 0，长文本不会撑破列宽",
+              "只要横向一排展示且元素不等宽，用 space 更轻；grid 面向二维对齐"
+            ]
           }
         ]
       },