From 3ccca29d360e51579fbec299a250ce39db22ab3a Mon Sep 17 00:00:00 2001
From: Junhao Liao <junhao@junhao.ca>
Date: Sat, 13 Jun 2026 19:21:33 -0400
Subject: [PATCH 1/2] fix: align base data table dropdown trigger usage with
 Base UI API

---
 .../docs/components/base/data-table.mdx       | 26 +++++++++++--------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/apps/v4/content/docs/components/base/data-table.mdx b/apps/v4/content/docs/components/base/data-table.mdx
index 4a02b4a496a..421198a82aa 100644
--- a/apps/v4/content/docs/components/base/data-table.mdx
+++ b/apps/v4/content/docs/components/base/data-table.mdx
@@ -349,12 +349,14 @@ export const columns: ColumnDef<Payment>[] = [
 
       return (
         <DropdownMenu>
-          <DropdownMenuTrigger asChild>
-            <Button variant="ghost" className="h-8 w-8 p-0">
-              <span className="sr-only">Open menu</span>
-              <MoreHorizontal className="h-4 w-4" />
-            </Button>
-          </DropdownMenuTrigger>
+          <DropdownMenuTrigger
+            render={
+              <Button variant="ghost" className="h-8 w-8 p-0">
+                <span className="sr-only">Open menu</span>
+                <MoreHorizontal className="h-4 w-4" />
+              </Button>
+            }
+          />
           <DropdownMenuContent align="end">
             <DropdownMenuLabel>Actions</DropdownMenuLabel>
             <DropdownMenuItem
@@ -694,11 +696,13 @@ export function DataTable<TData, TValue>({
           className="max-w-sm"
         />
         <DropdownMenu>
-          <DropdownMenuTrigger asChild>
-            <Button variant="outline" className="ml-auto">
-              Columns
-            </Button>
-          </DropdownMenuTrigger>
+          <DropdownMenuTrigger
+            render={
+              <Button variant="outline" className="ml-auto">
+                Columns
+              </Button>
+            }
+          />
           <DropdownMenuContent align="end">
             {table
               .getAllColumns()

From 2374186a71949cda760e109e9b459e094d76ac35 Mon Sep 17 00:00:00 2001
From: Junhao Liao <junhao@junhao.ca>
Date: Tue, 21 Jul 2026 21:19:55 -0400
Subject: [PATCH 2/2] fix(docs): align base data-table dropdown triggers with
 Base UI

---
 .../docs/components/base/data-table.mdx       | 22 ++++++++-----------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/apps/v4/content/docs/components/base/data-table.mdx b/apps/v4/content/docs/components/base/data-table.mdx
index 421198a82aa..16a8b9450b7 100644
--- a/apps/v4/content/docs/components/base/data-table.mdx
+++ b/apps/v4/content/docs/components/base/data-table.mdx
@@ -350,13 +350,11 @@ export const columns: ColumnDef<Payment>[] = [
       return (
         <DropdownMenu>
           <DropdownMenuTrigger
-            render={
-              <Button variant="ghost" className="h-8 w-8 p-0">
-                <span className="sr-only">Open menu</span>
-                <MoreHorizontal className="h-4 w-4" />
-              </Button>
-            }
-          />
+            render={<Button variant="ghost" className="h-8 w-8 p-0" />}
+          >
+            <span className="sr-only">Open menu</span>
+            <MoreHorizontal className="h-4 w-4" />
+          </DropdownMenuTrigger>
           <DropdownMenuContent align="end">
             <DropdownMenuLabel>Actions</DropdownMenuLabel>
             <DropdownMenuItem
@@ -697,12 +695,10 @@ export function DataTable<TData, TValue>({
         />
         <DropdownMenu>
           <DropdownMenuTrigger
-            render={
-              <Button variant="outline" className="ml-auto">
-                Columns
-              </Button>
-            }
-          />
+            render={<Button variant="outline" className="ml-auto" />}
+          >
+            Columns
+          </DropdownMenuTrigger>
           <DropdownMenuContent align="end">
             {table
               .getAllColumns()