iter(g282): 代码块支持长行折行

.ua/index.json

@@ -1,6 +1,6 @@
 {
   "$schema": "ui-arch-registry-index/0.1",
-  "generatedAt": "2026-10-26T15:06:03.807Z",
+  "generatedAt": "2026-10-26T15:08:10.710Z",
   "repoRoot": ".",
   "packages": [
     {
@@ -4284,6 +4284,11 @@
                 "t": "boolean",
                 "d": "是否显示行号列；缺省 true（单行代码自动省略）"
               },
+              {
+                "n": "wrap",
+                "t": "boolean",
+                "d": "长行是否折行（窄屏 / 长日志场景）；缺省 false（横向滚动，行号保持对齐）"
+              },
               {
                 "n": "maxHeight",
                 "t": "number",
@@ -4311,7 +4316,8 @@
               "头部标题用 title（文件名）或 lang（语言名），两者都给时 title 优先",
               "长代码给 maxHeight，超出在框内滚动；滚动条已是统一细条，暗色下不会露原生亮条",
               "单行代码自动省掉行号列；想彻底不要行号传 lineNumbers: false",
-              "不需要复制按钮（例如代码本身是操作步骤）传 copyable: false；连标题都没有时头部整条省掉"
+              "不需要复制按钮（例如代码本身是操作步骤）传 copyable: false；连标题都没有时头部整条省掉",
+              "窄屏或长日志要折行就传 wrap: true：长行按容器宽度换行，行号仍只占首行左侧；对齐要求高的代码别开，折行会让缩进失去参照"
             ]
           },
           {

apps/demo/main.ts

@@ -1784,6 +1784,7 @@ const content = h(
       title: 'sum.ts',
       lang: 'ts',
       maxHeight: 200,
+      wrap: true, // 窄屏下长行折行，不横向滚
       code: [
         'export function sum(a: number, b: number): number {',
         '  if (typeof a !== \'number\') throw new TypeError(\'a 必须是数字\');',

llms-full.txt

@@ -1,6 +1,6 @@
 # @ui-arch 组件库 Agent 文档（无图形版）
 
-> 自动生成于 2026-10-26T15:06:03.807Z，数据源：各包 ua.manifest.json，勿手改。人类版文档站：apps/docs/index.html。
+> 自动生成于 2026-10-26T15:08:10.710Z，数据源：各包 ua.manifest.json，勿手改。人类版文档站：apps/docs/index.html。
 > 组件 = 普通函数，传 props 返回 DOM；状态用 signal 双向绑定：读 signal() 写 signal(v)。
 
 ## 快速上手
@@ -2270,6 +2270,7 @@ diffView({ before: oldText, after: newText })
 - lang：string —— 语言名（如 ts / css）；无 title 时作头部标题
 - title：string —— 头部标题（如文件名）；优先于 lang
 - lineNumbers：boolean —— 是否显示行号列；缺省 true（单行代码自动省略）
+- wrap：boolean —— 长行是否折行（窄屏 / 长日志场景）；缺省 false（横向滚动，行号保持对齐）
 - maxHeight：number —— 代码区最高高度（px），超出在框内滚动；缺省不限高
 - copyable：boolean —— 右上角是否出现复制按钮；缺省 true
 - onCopy：(text: string) => void —— 复制成功回调（参数为实际写入剪贴板的内容）
@@ -2288,6 +2289,7 @@ codeBlock({ code: source, title: 'main.ts', lang: 'ts', maxHeight: 320 })
 3. 长代码给 maxHeight，超出在框内滚动；滚动条已是统一细条，暗色下不会露原生亮条
 4. 单行代码自动省掉行号列；想彻底不要行号传 lineNumbers: false
 5. 不需要复制按钮（例如代码本身是操作步骤）传 copyable: false；连标题都没有时头部整条省掉
+6. 窄屏或长日志要折行就传 wrap: true：长行按容器宽度换行，行号仍只占首行左侧；对齐要求高的代码别开，折行会让缩进失去参照
 
 现场演示：apps/docs/demo.html#sec-code
 

packages/skin/ui/src/codeBlock.ts

@@ -26,5 +26,5 @@ export function codeBlock(props: CodeBlockProps): HTMLElement {
       title ? h('span', { class: 'ua-code-title' }, title) : h('span', null, ''),
       props.copyable === false ? null : copyButton({ text: props.code, label: '复制', size: 'sm', variant: 'ghost', onCopied: props.onCopy }),
     );
-  return h('div', { class: 'ua-code', role: 'group', 'aria-label': props.ariaLabel ?? '代码块' }, head, body);
+  return h('div', { class: `ua-code${props.wrap ? ' is-wrap' : ''}`, role: 'group', 'aria-label': props.ariaLabel ?? '代码块' }, head, body); // is-wrap 只改折行，行号与缩进不动
 }

packages/skin/ui/src/types.ts

@@ -1047,6 +1047,7 @@ export interface CodeBlockProps {
   lang?: string;                   // 语言名（如 ts / css）；无 title 时作头部标题
   title?: string;                  // 头部标题（如文件名）；优先于 lang
   lineNumbers?: boolean;           // 是否显示行号列；缺省 true（单行代码自动省略）
+  wrap?: boolean;                  // 长行是否折行（窄屏 / 长日志场景）；缺省 false（横向滚动，行号保持对齐）
   maxHeight?: number;              // 代码区最高高度（px），超出在框内滚动；缺省不限高
   copyable?: boolean;              // 右上角是否出现复制按钮；缺省 true
   onCopy?: (text: string) => void; // 复制成功回调（参数为实际写入剪贴板的内容）

packages/skin/ui/ua.manifest.json

@@ -4155,6 +4155,11 @@
             "t": "boolean",
             "d": "是否显示行号列；缺省 true（单行代码自动省略）"
           },
+          {
+            "n": "wrap",
+            "t": "boolean",
+            "d": "长行是否折行（窄屏 / 长日志场景）；缺省 false（横向滚动，行号保持对齐）"
+          },
           {
             "n": "maxHeight",
             "t": "number",
@@ -4182,7 +4187,8 @@
           "头部标题用 title（文件名）或 lang（语言名），两者都给时 title 优先",
           "长代码给 maxHeight，超出在框内滚动；滚动条已是统一细条，暗色下不会露原生亮条",
           "单行代码自动省掉行号列；想彻底不要行号传 lineNumbers: false",
-          "不需要复制按钮（例如代码本身是操作步骤）传 copyable: false；连标题都没有时头部整条省掉"
+          "不需要复制按钮（例如代码本身是操作步骤）传 copyable: false；连标题都没有时头部整条省掉",
+          "窄屏或长日志要折行就传 wrap: true：长行按容器宽度换行，行号仍只占首行左侧；对齐要求高的代码别开，折行会让缩进失去参照"
         ]
       },
       {

packages/skin/ui/ui.css

@@ -5865,3 +5865,9 @@ h5.ua-type-title { font-size: var(--ua-font-size-md); }
   margin-left: auto;
   color: var(--ua-color-text-faint);
 }
+
+/* 折行模式：长行按容器宽度换行，行号仍只占首行左侧——适合窄屏读日志，不适合对齐要求高的代码 */
+.ua-code.is-wrap .ua-code-line {
+  white-space: pre-wrap;
+  word-break: break-word;
+}