From 4ee54cc0e3edddf4c430e8af9331e244a1e3f20d Mon Sep 17 00:00:00 2001
From: Aviv Keller <me@aviv.sh>
Date: Sun, 29 Jun 2025 20:50:44 -0400
Subject: [PATCH 1/3] fix(table): only apply border to immediate `td` children

Signed-off-by: Aviv Keller <me@aviv.sh>
---
 packages/ui-components/styles/markdown.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui-components/styles/markdown.css b/packages/ui-components/styles/markdown.css
index 862cd6450f05e..efdfa4c9a328b 100644
--- a/packages/ui-components/styles/markdown.css
+++ b/packages/ui-components/styles/markdown.css
@@ -157,7 +157,7 @@ main {
       @apply font-semibold;
     }
 
-    tr:last-child td {
+    tr:last-child > td {
       @apply sm:border-b-0;
 
       &:last-child {

From d6c28a894b940a379bdb7499b472901ca5737274 Mon Sep 17 00:00:00 2001
From: avivkeller <me@aviv.sh>
Date: Tue, 1 Jul 2025 08:13:59 -0400
Subject: [PATCH 2/3] story

---
 .../__design__/table.stories.tsx              | 42 ++++++++++---------
 1 file changed, 23 insertions(+), 19 deletions(-)

diff --git a/packages/ui-components/__design__/table.stories.tsx b/packages/ui-components/__design__/table.stories.tsx
index 1bdd818e2a32b..a2c64aec90cea 100644
--- a/packages/ui-components/__design__/table.stories.tsx
+++ b/packages/ui-components/__design__/table.stories.tsx
@@ -6,7 +6,7 @@ const tableData = [
   ['Data 1', 'Data 2', 'Data 3'],
 ];
 
-export const Table: StoryObj = {
+export const TableWithSubTableRow: StoryObj = {
   render: () => (
     <main>
       <table>
@@ -25,24 +25,28 @@ export const Table: StoryObj = {
               ))}
             </tr>
           ))}
-        </tbody>
-      </table>
-    </main>
-  ),
-};
-
-export const HeadlessTable: StoryObj = {
-  render: () => (
-    <main>
-      <table>
-        <tbody>
-          {tableData.map((row, rowIndex) => (
-            <tr key={rowIndex}>
-              {row.map((cell, cellIndex) => (
-                <td key={cellIndex}>{cell}</td>
-              ))}
-            </tr>
-          ))}
+          <tr>
+            <td colSpan={3}>
+              <table>
+                <thead>
+                  <tr>
+                    <th>Sub 1</th>
+                    <th>Sub 2</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td>Sub A</td>
+                    <td>Sub B</td>
+                  </tr>
+                  <tr>
+                    <td>Sub C</td>
+                    <td>Sub D</td>
+                  </tr>
+                </tbody>
+              </table>
+            </td>
+          </tr>
         </tbody>
       </table>
     </main>

From 9f6445d2e4a5be28d63fb282a6730c280321d684 Mon Sep 17 00:00:00 2001
From: avivkeller <me@aviv.sh>
Date: Tue, 1 Jul 2025 08:17:57 -0400
Subject: [PATCH 3/3] use old name

---
 packages/ui-components/__design__/table.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui-components/__design__/table.stories.tsx b/packages/ui-components/__design__/table.stories.tsx
index a2c64aec90cea..c19c8bd4832ab 100644
--- a/packages/ui-components/__design__/table.stories.tsx
+++ b/packages/ui-components/__design__/table.stories.tsx
@@ -6,7 +6,7 @@ const tableData = [
   ['Data 1', 'Data 2', 'Data 3'],
 ];
 
-export const TableWithSubTableRow: StoryObj = {
+export const Table: StoryObj = {
   render: () => (
     <main>
       <table>