iter(g329): 新增 editable 行内编辑

apps/demo/main.ts

@@ -63,6 +63,7 @@ import {
   watermark,
   menu,
   masonry,
+  editable,
   modal,
   mentions,
   multiSelect,
@@ -246,6 +247,10 @@ const score2 = signal(3); // 演示 allowClear 可清除评分
 // —— 空状态：搜索无结果演示 ——
 const noResult = signal(true);
 
+// —— 行内编辑：标题与备注各一份信号，提交才落值（Esc 取消可肉眼验证没被改） ——
+const titleText = signal('季度增长看板');
+const remark = signal('点这里就地改；Esc 丢弃草稿，失焦自动保存。');
+
 // —— 受控选中：dataTable 内部勾选实时写回，外部可清空 ——
 const picked = signal<RowKey[]>([]);
 
@@ -1959,6 +1964,24 @@ content.append(
       ],
     }),
   ),
+  section(
+    'sec-editable',
+    '行内编辑',
+    'editable：静止态是文字、点一下就地变输入框；Enter 提交、Esc 取消（不落值）、失焦提交；validate 拦下时保持编辑态并标红，多行模式用 Ctrl+Enter 提交。',
+    h(
+      'div',
+      { class: 'row' },
+      editable({ value: titleText, label: '标题', placeholder: '未命名看板', onCommit: (v) => toast.success(`标题改成「${v}」`) }),
+      editable({
+        value: remark,
+        label: '备注',
+        multiline: true,
+        validate: (v) => (v.length > 40 ? `最多 40 字（当前 ${v.length}）` : null),
+        onCommit: () => toast.info('备注已保存'),
+      }),
+      editable({ value: signal('只读字段'), label: '只读', disabled: true }),
+    ),
+  ),
 );
 
 // 悬浮按钮：fixed 定位，挂 body 不参与页面布局