lerna.json

@@ -13,5 +13,5 @@
     }
   },
   "npmClient": "pnpm",
-  "version": "3.7.17"
+  "version": "3.7.18"
 }

packages/api-generator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vuetify/api-generator",
-  "version": "3.7.17",
+  "version": "3.7.18",
   "private": true,
   "description": "",
   "scripts": {

packages/docs/package.json

@@ -3,7 +3,7 @@
   "description": "A Vue.js project",
   "private": true,
   "author": "John Leider <john@vuetifyjs.com>",
-  "version": "3.7.17",
+  "version": "3.7.18",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/vuetifyjs/vuetify.git",

packages/vuetify/package.json

@@ -1,7 +1,7 @@
 {
   "name": "vuetify",
   "description": "Vue Material Component Framework",
-  "version": "3.7.17",
+  "version": "3.7.18",
   "author": {
     "name": "John Leider",
     "email": "john@vuetifyjs.com"

packages/vuetify/src/components/VDatePicker/VDatePickerMonth.tsx

@@ -3,6 +3,7 @@ import './VDatePickerMonth.sass'
 
 // Components
 import { VBtn } from '@/components/VBtn'
+import { VDefaultsProvider } from '@/components/VDefaultsProvider'
 
 // Composables
 import { makeCalendarProps, useCalendar } from '@/composables/calendar'
@@ -11,7 +12,7 @@ import { MaybeTransition } from '@/composables/transition'
 
 // Utilities
 import { computed, ref, shallowRef, watch } from 'vue'
-import { genericComponent, omit, propsFactory, useRender } from '@/util'
+import { genericComponent, omit, propsFactory } from '@/util'
 
 // Types
 import type { PropType } from 'vue'
@@ -151,7 +152,7 @@ export const VDatePickerMonth = genericComponent<VDatePickerMonthSlots>()({
       }
     }
 
-    useRender(() => (
+    return () => (
       <div class="v-date-picker-month">
         { props.showWeek && (
           <div key="weeks" class="v-date-picker-month__weeks">
@@ -187,17 +188,6 @@ export const VDatePickerMonth = genericComponent<VDatePickerMonthSlots>()({
             { daysInMonth.value.map((item, i) => {
               const slotProps = {
                 props: {
-                  class: 'v-date-picker-month__day-btn',
-                  color: (item.isSelected || item.isToday) && !item.isDisabled
-                    ? props.color
-                    : undefined,
-                  disabled: item.isDisabled,
-                  icon: true,
-                  ripple: false,
-                  text: item.localized,
-                  variant: item.isDisabled
-                    ? item.isToday ? 'outlined' : 'text'
-                    : item.isToday && !item.isSelected ? 'outlined' : 'flat',
                   onClick: () => onClick(item.date),
                 },
                 item,
@@ -222,16 +212,38 @@ export const VDatePickerMonth = genericComponent<VDatePickerMonthSlots>()({
                   ]}
                   data-v-date={ !item.isDisabled ? item.isoDate : undefined }
                 >
+
                   { (props.showAdjacentMonths || !item.isAdjacent) && (
-                    slots.day?.(slotProps) ?? (<VBtn { ...slotProps.props } />)
+                    <VDefaultsProvider
+                      defaults={{
+                        VBtn: {
+                          class: 'v-date-picker-month__day-btn',
+                          color: (item.isSelected || item.isToday) && !item.isDisabled
+                            ? props.color
+                            : undefined,
+                          disabled: item.isDisabled,
+                          icon: true,
+                          ripple: false,
+                          text: item.localized,
+                          variant: item.isDisabled
+                            ? item.isToday ? 'outlined' : 'text'
+                            : item.isToday && !item.isSelected ? 'outlined' : 'flat',
+                          onClick: () => onClick(item.date),
+                        },
+                      }}
+                    >
+                      { slots.day?.(slotProps) ?? (
+                        <VBtn { ...slotProps.props } />
+                      )}
+                    </VDefaultsProvider>
                   )}
                 </div>
               )
             })}
           </div>
         </MaybeTransition>
       </div>
-    ))
+    )
   },
 })