From b8c7a9c597ce04c77893dd43ba0980f5dd717096 Mon Sep 17 00:00:00 2001
From: John Leider <john@vuetifyjs.com>
Date: Wed, 5 Mar 2025 19:49:23 -0600
Subject: [PATCH 1/4] fix(VDataTableRow): provide correct defaults for special
 slots

---
 .../components/VDataTable/VDataTableRow.tsx   | 51 ++++++++++++++++---
 1 file changed, 45 insertions(+), 6 deletions(-)

diff --git a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
index 37a53c2d573..44e50ead11c 100644
--- a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
+++ b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
@@ -2,6 +2,7 @@
 import { VDataTableColumn } from './VDataTableColumn'
 import { VBtn } from '@/components/VBtn'
 import { VCheckboxBtn } from '@/components/VCheckbox'
+import { VDefaultsProvider } from '@/components/VDefaultsProvider'
 
 // Composables
 import { useExpanded } from './composables/expand'
@@ -20,9 +21,13 @@ import type { CellProps, DataTableItem, ItemKeySlot } from './types'
 import type { VDataTableHeaderCellColumnSlotProps } from './VDataTableHeaders'
 import type { GenericProps } from '@/util'
 
+export type VDataTableItemCellColumnSlotProps<T> = Omit<ItemKeySlot<T>, 'value'> & {
+  props: { onClick: (e: MouseEvent) => void }
+}
+
 export type VDataTableRowSlots<T> = {
-  'item.data-table-select': Omit<ItemKeySlot<T>, 'value'>
-  'item.data-table-expand': Omit<ItemKeySlot<T>, 'value'>
+  'item.data-table-select': VDataTableItemCellColumnSlotProps<T>
+  'item.data-table-expand': VDataTableItemCellColumnSlotProps<T>
   'header.data-table-select': VDataTableHeaderCellColumnSlotProps
   'header.data-table-expand': VDataTableHeaderCellColumnSlotProps
 } & {
@@ -136,10 +141,25 @@ export const VDataTableRow = genericComponent<new <T>(
             >
               {{
                 default: () => {
-                  if (slots[slotName] && !mobile.value) return slots[slotName]?.(slotProps)
-
                   if (column.key === 'data-table-select') {
-                    return slots['item.data-table-select']?.(slotProps) ?? (
+                    return slots['item.data-table-select'] ? (
+                      <VDefaultsProvider
+                        defaults={{
+                          VCheckboxBtn: {
+                            disabled: !item.selectable,
+                            modelValue: isSelected([item]),
+                            onClick: withModifiers(() => toggleSelect(item), ['stop']),
+                          },
+                        }}
+                      >
+                        { slots['item.data-table-select']?.({
+                          ...slotProps,
+                          props: {
+                            onClick: withModifiers(() => toggleSelect(item), ['stop']),
+                          },
+                        })}
+                      </VDefaultsProvider>
+                    ) : (
                       <VCheckboxBtn
                         disabled={ !item.selectable }
                         modelValue={ isSelected([item]) }
@@ -149,7 +169,24 @@ export const VDataTableRow = genericComponent<new <T>(
                   }
 
                   if (column.key === 'data-table-expand') {
-                    return slots['item.data-table-expand']?.(slotProps) ?? (
+                    return slots['item.data-table-expand'] ? (
+                      <VDefaultsProvider
+                        defaults={{
+                          VBtn: {
+                            icon: isExpanded(item) ? '$collapse' : '$expand',
+                            size: 'small',
+                            variant: 'text',
+                          },
+                        }}
+                      >
+                        { slots['item.data-table-expand']?.({
+                          ...slotProps,
+                          props: {
+                            onClick: withModifiers(() => toggleExpand(item), ['stop']),
+                          },
+                        })}
+                      </VDefaultsProvider>
+                    ) : (
                       <VBtn
                         icon={ isExpanded(item) ? '$collapse' : '$expand' }
                         size="small"
@@ -159,6 +196,8 @@ export const VDataTableRow = genericComponent<new <T>(
                     )
                   }
 
+                  if (slots[slotName] && !mobile.value) return slots[slotName](slotProps)
+
                   const displayValue = toDisplayString(slotProps.value)
 
                   return !mobile.value ? displayValue : (

From 020a3c803bba638f35f7954c252868bfc6c78b3f Mon Sep 17 00:00:00 2001
From: Kael <kaelwd@gmail.com>
Date: Thu, 6 Mar 2025 16:17:12 +1100
Subject: [PATCH 2/4] can't provide events

---
 packages/vuetify/src/components/VDataTable/VDataTableRow.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
index 44e50ead11c..4a27665b2c0 100644
--- a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
+++ b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
@@ -148,7 +148,6 @@ export const VDataTableRow = genericComponent<new <T>(
                           VCheckboxBtn: {
                             disabled: !item.selectable,
                             modelValue: isSelected([item]),
-                            onClick: withModifiers(() => toggleSelect(item), ['stop']),
                           },
                         }}
                       >

From 20b8b13be60c5500445ab8b0d90a6a942b1532dc Mon Sep 17 00:00:00 2001
From: Kael <kaelwd@gmail.com>
Date: Thu, 6 Mar 2025 16:18:14 +1100
Subject: [PATCH 3/4] props types should be unknown

we don't want people relying on anything but v-bind="props"
---
 packages/vuetify/src/components/VDataTable/VDataTableRow.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
index 4a27665b2c0..eefa64152b1 100644
--- a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
+++ b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
@@ -22,7 +22,7 @@ import type { VDataTableHeaderCellColumnSlotProps } from './VDataTableHeaders'
 import type { GenericProps } from '@/util'
 
 export type VDataTableItemCellColumnSlotProps<T> = Omit<ItemKeySlot<T>, 'value'> & {
-  props: { onClick: (e: MouseEvent) => void }
+  props: Record<string, unknown>
 }
 
 export type VDataTableRowSlots<T> = {

From e43ccc6c6ca0fb59b6a8f6d0bc984832aabb99b3 Mon Sep 17 00:00:00 2001
From: John Leider <john@vuetifyjs.com>
Date: Thu, 6 Mar 2025 07:56:27 -0600
Subject: [PATCH 4/4] refactor(VDataTableRow): changes from feedback

---
 .../components/VDataTable/VDataTableRow.tsx   | 53 ++++++-------------
 1 file changed, 17 insertions(+), 36 deletions(-)

diff --git a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
index eefa64152b1..1a1358f3f81 100644
--- a/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
+++ b/packages/vuetify/src/components/VDataTable/VDataTableRow.tsx
@@ -2,7 +2,6 @@
 import { VDataTableColumn } from './VDataTableColumn'
 import { VBtn } from '@/components/VBtn'
 import { VCheckboxBtn } from '@/components/VCheckbox'
-import { VDefaultsProvider } from '@/components/VDefaultsProvider'
 
 // Composables
 import { useExpanded } from './composables/expand'
@@ -142,23 +141,14 @@ export const VDataTableRow = genericComponent<new <T>(
               {{
                 default: () => {
                   if (column.key === 'data-table-select') {
-                    return slots['item.data-table-select'] ? (
-                      <VDefaultsProvider
-                        defaults={{
-                          VCheckboxBtn: {
-                            disabled: !item.selectable,
-                            modelValue: isSelected([item]),
-                          },
-                        }}
-                      >
-                        { slots['item.data-table-select']?.({
-                          ...slotProps,
-                          props: {
-                            onClick: withModifiers(() => toggleSelect(item), ['stop']),
-                          },
-                        })}
-                      </VDefaultsProvider>
-                    ) : (
+                    return slots['item.data-table-select']?.({
+                      ...slotProps,
+                      props: {
+                        disabled: !item.selectable,
+                        modelValue: isSelected([item]),
+                        onClick: withModifiers(() => toggleSelect(item), ['stop']),
+                      },
+                    }) ?? (
                       <VCheckboxBtn
                         disabled={ !item.selectable }
                         modelValue={ isSelected([item]) }
@@ -168,24 +158,15 @@ export const VDataTableRow = genericComponent<new <T>(
                   }
 
                   if (column.key === 'data-table-expand') {
-                    return slots['item.data-table-expand'] ? (
-                      <VDefaultsProvider
-                        defaults={{
-                          VBtn: {
-                            icon: isExpanded(item) ? '$collapse' : '$expand',
-                            size: 'small',
-                            variant: 'text',
-                          },
-                        }}
-                      >
-                        { slots['item.data-table-expand']?.({
-                          ...slotProps,
-                          props: {
-                            onClick: withModifiers(() => toggleExpand(item), ['stop']),
-                          },
-                        })}
-                      </VDefaultsProvider>
-                    ) : (
+                    return slots['item.data-table-expand']?.({
+                      ...slotProps,
+                      props: {
+                        icon: isExpanded(item) ? '$collapse' : '$expand',
+                        size: 'small',
+                        variant: 'text',
+                        onClick: withModifiers(() => toggleExpand(item), ['stop']),
+                      },
+                    }) ?? (
                       <VBtn
                         icon={ isExpanded(item) ? '$collapse' : '$expand' }
                         size="small"