From ebb713597331efb90694ec8a1d8dfb859866dcb2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9E=97=E5=AE=892?= <610575769@qq.com>
Date: Thu, 4 Jun 2026 16:33:27 +0800
Subject: [PATCH] fix(ui): add table cell titles for truncated content

---
 .../components/scenes/ai/markdown-parse.ts    | 20 +++++++++++++++----
 .../scenes/ai/table/AiTableEditor.svelte      |  6 ++++--
 packages/ui/tests/markdown-parse.test.ts      | 12 +++++++++--
 3 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/packages/ui/src/lib/components/scenes/ai/markdown-parse.ts b/packages/ui/src/lib/components/scenes/ai/markdown-parse.ts
index 414a2d74..0ff13909 100644
--- a/packages/ui/src/lib/components/scenes/ai/markdown-parse.ts
+++ b/packages/ui/src/lib/components/scenes/ai/markdown-parse.ts
@@ -41,6 +41,20 @@ function escapeHtml(text: string): string {
     .replace(/'/g, '&#39;')
 }
 
+function createTableCellAttrs(cell: Tokens.TableCell): string {
+  const attrs = []
+
+  if (cell.align) {
+    attrs.push(`style="text-align:${cell.align}"`)
+  }
+
+  if (cell.text.trim()) {
+    attrs.push(`title="${escapeHtml(cell.text)}"`)
+  }
+
+  return attrs.length > 0 ? ` ${attrs.join(' ')}` : ''
+}
+
 /**
  * 创建自定义渲染器对象
  *
@@ -115,16 +129,14 @@ function createRendererObject(options: Required<MarkdownParseOptions>): Renderer
     table(token: Tokens.Table): string {
       let headerHtml = ''
       for (const cell of token.header) {
-        const align = cell.align ? ` style="text-align:${cell.align}"` : ''
-        headerHtml += `<th${align}>${this.parser.parseInline(cell.tokens)}</th>`
+        headerHtml += `<th${createTableCellAttrs(cell)}>${this.parser.parseInline(cell.tokens)}</th>`
       }
 
       let bodyHtml = ''
       for (const row of token.rows) {
         let rowHtml = ''
         for (const cell of row) {
-          const align = cell.align ? ` style="text-align:${cell.align}"` : ''
-          rowHtml += `<td${align}>${this.parser.parseInline(cell.tokens)}</td>`
+          rowHtml += `<td${createTableCellAttrs(cell)}>${this.parser.parseInline(cell.tokens)}</td>`
         }
         bodyHtml += `<tr>${rowHtml}</tr>`
       }
diff --git a/packages/ui/src/lib/components/scenes/ai/table/AiTableEditor.svelte b/packages/ui/src/lib/components/scenes/ai/table/AiTableEditor.svelte
index 83db4eaf..7db1dc91 100644
--- a/packages/ui/src/lib/components/scenes/ai/table/AiTableEditor.svelte
+++ b/packages/ui/src/lib/components/scenes/ai/table/AiTableEditor.svelte
@@ -1097,7 +1097,7 @@
       <thead>
         <tr>
           {#each tableColumns as column (column.key)}
-            <th>{column.label}</th>
+            <th title={column.label}>{column.label}</th>
           {/each}
           {#if editable}
             <th class='hai-ai-table-action-head'>{uiM('data_table_actions')}</th>
@@ -1122,11 +1122,13 @@
               ondrop={event => handleRowDrop(row.row_id, event)}
             >
               {#each tableColumns as column (column.key)}
+                {@const cellInputValue = getCellInputValue(row, column.key)}
                 <td>
                   <input
                     class={resolveCellInputClass(column.type)}
                     type={column.type === 'number' ? 'number' : 'text'}
-                    value={getCellInputValue(row, column.key)}
+                    value={cellInputValue}
+                    title={cellInputValue}
                     disabled={!editable}
                     oninput={event => handleCellInput(row.row_id, column, event)}
                   />
diff --git a/packages/ui/tests/markdown-parse.test.ts b/packages/ui/tests/markdown-parse.test.ts
index 955972ed..600bda50 100644
--- a/packages/ui/tests/markdown-parse.test.ts
+++ b/packages/ui/tests/markdown-parse.test.ts
@@ -225,8 +225,16 @@ describe('parseMarkdown - 表格', () => {
     const html = parseMarkdown(md)
     expect(html).toContain('hai-md-table-wrap')
     expect(html).toContain('<table>')
-    expect(html).toContain('<th>')
-    expect(html).toContain('<td>')
+    expect(html).toContain('<th title="A">')
+    expect(html).toContain('<td title="1">')
+  })
+
+  it('adds title attributes to table cells', () => {
+    const md = '| A | B |\n| --- | --- |\n| long cell | value "quoted" |'
+    const html = parseMarkdown(md)
+    expect(html).toContain('<th title="A">')
+    expect(html).toContain('<td title="long cell">')
+    expect(html).toContain('<td title="value &quot;quoted&quot;">')
   })
 })