From e385683be2cb433f586450f646556820ae5f0037 Mon Sep 17 00:00:00 2001
From: Scott Cazan <scottcazan@gmail.com>
Date: Fri, 23 Jan 2026 11:12:22 +0100
Subject: [PATCH 1/4] Update sort style on datatable

---
 packages/ui/src/components/ui/table.tsx | 26 ++++++++-----------------
 1 file changed, 8 insertions(+), 18 deletions(-)

diff --git a/packages/ui/src/components/ui/table.tsx b/packages/ui/src/components/ui/table.tsx
index a1f194cd7..cb6d411cf 100644
--- a/packages/ui/src/components/ui/table.tsx
+++ b/packages/ui/src/components/ui/table.tsx
@@ -24,7 +24,7 @@ import {
   composeRenderProps,
   useTableOptions,
 } from 'react-aria-components';
-import { LuChevronDown, LuMinus } from 'react-icons/lu';
+import { LuArrowDown } from 'react-icons/lu';
 import { twJoin, twMerge } from 'tailwind-merge';
 
 import { cx } from '@/lib/primitive';
@@ -145,25 +145,15 @@ const TableColumn = ({
           {typeof props.children === 'function'
             ? props.children(values)
             : props.children}
-          {values.allowsSorting && (
-            <span
+          {values.allowsSorting && values.sortDirection !== undefined && (
+            <LuArrowDown
+              data-slot="icon"
+              aria-hidden
               className={twJoin(
-                'grid size-[1.15rem] flex-none shrink-0 place-content-center rounded bg-secondary text-fg *:data-[slot=icon]:size-3.5 *:data-[slot=icon]:shrink-0 *:data-[slot=icon]:transition-transform *:data-[slot=icon]:duration-200',
-                values.isHovered ? 'bg-secondary-fg/10' : '',
-              )}
-            >
-              {values.sortDirection === undefined ? (
-                <LuMinus data-slot="icon" aria-hidden />
-              ) : (
-                <LuChevronDown
-                  data-slot="icon"
-                  aria-hidden
-                  className={
-                    values.sortDirection === 'ascending' ? 'rotate-180' : ''
-                  }
-                />
+                'size-3 shrink-0 text-muted-fg transition-transform duration-200',
+                values.sortDirection === 'ascending' ? 'rotate-180' : '',
               )}
-            </span>
+            />
           )}
           {isResizable && <ColumnResizer />}
         </div>

From 8c749ed1a3edb0d4f702b8d611c70d169a9b300d Mon Sep 17 00:00:00 2001
From: Scott Cazan <scottcazan@gmail.com>
Date: Fri, 23 Jan 2026 11:14:23 +0100
Subject: [PATCH 2/4] Update spacing on sortable icon

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

diff --git a/packages/ui/src/components/ui/table.tsx b/packages/ui/src/components/ui/table.tsx
index cb6d411cf..fa3733b2d 100644
--- a/packages/ui/src/components/ui/table.tsx
+++ b/packages/ui/src/components/ui/table.tsx
@@ -139,7 +139,7 @@ const TableColumn = ({
       {(values) => (
         <div
           className={twJoin([
-            'inline-flex items-center gap-2 **:data-[slot=icon]:shrink-0',
+            'inline-flex items-center gap-0.5 **:data-[slot=icon]:shrink-0',
           ])}
         >
           {typeof props.children === 'function'

From 888928499355b85bd433af288d717e526b45036c Mon Sep 17 00:00:00 2001
From: Scott Cazan <scottcazan@gmail.com>
Date: Sat, 24 Jan 2026 17:55:04 +0100
Subject: [PATCH 3/4] Update hover style

---
 packages/ui/src/components/ui/table.tsx | 26 ++++++++++++++-----------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/packages/ui/src/components/ui/table.tsx b/packages/ui/src/components/ui/table.tsx
index fa3733b2d..9af02427e 100644
--- a/packages/ui/src/components/ui/table.tsx
+++ b/packages/ui/src/components/ui/table.tsx
@@ -123,17 +123,21 @@ const TableColumn = ({
     <Column
       data-slot="table-column"
       {...props}
-      className={cx(
-        [
-          'text-left font-medium text-muted-fg',
-          'relative outline-hidden allows-sorting:cursor-default dragging:cursor-grabbing',
-          'px-4 py-(--gutter-y)',
-          'first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2))',
-          !bleed && 'sm:first:pl-1 sm:last:pr-1',
-          grid && 'border-l first:border-l-0',
-          isResizable && 'truncate overflow-hidden',
-        ],
+      className={composeRenderProps(
         className,
+        (className, { isHovered, allowsSorting }) =>
+          twMerge(
+            'text-left font-medium',
+            allowsSorting && isHovered ? 'text-neutral-gray3' : 'text-muted-fg',
+            'allows-sorting:active:text-neutral-charcoal',
+            'relative outline-hidden allows-sorting:cursor-default dragging:cursor-grabbing',
+            'px-4 py-(--gutter-y)',
+            'first:pl-(--gutter,--spacing(2)) last:pr-(--gutter,--spacing(2))',
+            !bleed && 'sm:first:pl-1 sm:last:pr-1',
+            grid && 'border-l first:border-l-0',
+            isResizable && 'truncate overflow-hidden',
+            className,
+          ),
       )}
     >
       {(values) => (
@@ -150,7 +154,7 @@ const TableColumn = ({
               data-slot="icon"
               aria-hidden
               className={twJoin(
-                'size-3 shrink-0 text-muted-fg transition-transform duration-200',
+                'size-3 shrink-0 transition-transform duration-200',
                 values.sortDirection === 'ascending' ? 'rotate-180' : '',
               )}
             />

From c7e280d8643dfa85a0bbe441887c3917300ec3f1 Mon Sep 17 00:00:00 2001
From: Scott Cazan <scottcazan@gmail.com>
Date: Sat, 24 Jan 2026 18:00:40 +0100
Subject: [PATCH 4/4] Align with new styles

---
 packages/ui/src/components/ui/table.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/ui/src/components/ui/table.tsx b/packages/ui/src/components/ui/table.tsx
index 9af02427e..5084666e0 100644
--- a/packages/ui/src/components/ui/table.tsx
+++ b/packages/ui/src/components/ui/table.tsx
@@ -127,7 +127,7 @@ const TableColumn = ({
         className,
         (className, { isHovered, allowsSorting }) =>
           twMerge(
-            'text-left font-medium',
+            'h-8 text-left text-sm font-normal',
             allowsSorting && isHovered ? 'text-neutral-gray3' : 'text-muted-fg',
             'allows-sorting:active:text-neutral-charcoal',
             'relative outline-hidden allows-sorting:cursor-default dragging:cursor-grabbing',
@@ -248,7 +248,7 @@ const TableRow = <T extends object>({
           },
         ) =>
           twMerge(
-            'group relative cursor-default text-muted-fg outline outline-transparent',
+            'group relative min-h-12 cursor-default text-black outline outline-transparent',
             isFocusVisible &&
               'bg-primary/5 ring-3 ring-ring/20 outline-primary hover:bg-primary/10',
             isDragging &&