@vuetify/nightly 3.9.2-master.2025-07-28 → 3.9.2-master.2025-07-29

package/lib/components/VDatePicker/VDatePickerControls.js

@@ -5,7 +5,8 @@ import "./VDatePickerControls.css";
 // Components
 import { VBtn } from "../VBtn/index.js";
 import { VSpacer } from "../VGrid/index.js"; // Composables
-import { IconValue } from "../../composables/icons.js"; // Utilities
+import { IconValue } from "../../composables/icons.js";
+import { useLocale } from "../../composables/locale.js"; // Utilities
 import { computed } from 'vue';
 import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.js"; // Types
 export const makeVDatePickerControlsProps = propsFactory({
@@ -50,6 +51,9 @@ export const VDatePickerControls = genericComponent()({
     let {
       emit
     } = _ref;
+    const {
+      t
+    } = useLocale();
     const disableMonth = computed(() => {
       return Array.isArray(props.disabled) ? props.disabled.includes('text') : !!props.disabled;
     });
@@ -96,6 +100,7 @@ export const VDatePickerControls = genericComponent()({
         "density": "comfortable",
         "icon": props.modeIcon,
         "variant": "text",
+        "aria-label": t('$vuetify.datePicker.ariaLabel.selectYear'),
         "onClick": onClickYear
       }, null), _createVNode(VSpacer, null, null), _createElementVNode("div", {
         "class": "v-date-picker-controls__month"
@@ -105,6 +110,7 @@ export const VDatePickerControls = genericComponent()({
         "density": "comfortable",
         "icon": props.prevIcon,
         "variant": "text",
+        "aria-label": t('$vuetify.datePicker.ariaLabel.previousMonth'),
         "onClick": onClickPrev
       }, null), _createVNode(VBtn, {
         "data-testid": "next-month",
@@ -112,6 +118,7 @@ export const VDatePickerControls = genericComponent()({
         "icon": props.nextIcon,
         "density": "comfortable",
         "variant": "text",
+        "aria-label": t('$vuetify.datePicker.ariaLabel.nextMonth'),
         "onClick": onClickNext
       }, null)])]);
     });

package/lib/components/VDatePicker/VDatePickerControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"VDatePickerControls.js","names":["VBtn","VSpacer","IconValue","computed","convertToUnit","genericComponent","propsFactory","useRender","makeVDatePickerControlsProps","active","type","String","Array","default","undefined","controlHeight","Number","disabled","Boolean","nextIcon","prevIcon","modeIcon","text","viewMode","VDatePickerControls","name","props","emits","click:year","click:month","click:prev","click:next","click:text","setup","_ref","emit","disableMonth","isArray","includes","disableYear","disablePrev","disableNext","onClickPrev","onClickNext","onClickYear","onClickMonth","_createElementVNode","_normalizeClass","_createVNode","value"],"sources":["../../../src/components/VDatePicker/VDatePickerControls.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerControls.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\nimport { VSpacer } from '@/components/VGrid'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\n\n// Utilities\nimport { computed } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const makeVDatePickerControlsProps = propsFactory({\n  active: {\n    type: [String, Array] as PropType<string | string[]>,\n    default: undefined,\n  },\n  controlHeight: [Number, String],\n  disabled: {\n    type: [Boolean, String, Array] as PropType<boolean | string | string[] | null>,\n    default: null,\n  },\n  nextIcon: {\n    type: IconValue,\n    default: '$next',\n  },\n  prevIcon: {\n    type: IconValue,\n    default: '$prev',\n  },\n  modeIcon: {\n    type: IconValue,\n    default: '$subgroup',\n  },\n  text: String,\n  viewMode: {\n    type: String as PropType<'month' | 'months' | 'year'>,\n    default: 'month',\n  },\n}, 'VDatePickerControls')\n\nexport const VDatePickerControls = genericComponent()({\n  name: 'VDatePickerControls',\n\n  props: makeVDatePickerControlsProps(),\n\n  emits: {\n    'click:year': () => true,\n    'click:month': () => true,\n    'click:prev': () => true,\n    'click:next': () => true,\n    'click:text': () => true,\n  },\n\n  setup (props, { emit }) {\n    const disableMonth = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('text')\n        : !!props.disabled\n    })\n    const disableYear = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('mode')\n        : !!props.disabled\n    })\n    const disablePrev = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('prev')\n        : !!props.disabled\n    })\n    const disableNext = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('next')\n        : !!props.disabled\n    })\n\n    function onClickPrev () {\n      emit('click:prev')\n    }\n\n    function onClickNext () {\n      emit('click:next')\n    }\n\n    function onClickYear () {\n      emit('click:year')\n    }\n\n    function onClickMonth () {\n      emit('click:month')\n    }\n\n    useRender(() => {\n      // TODO: add slot support and scope defaults\n      return (\n        <div\n          class={[\n            'v-date-picker-controls',\n          ]}\n          style={{\n            '--v-date-picker-controls-height': convertToUnit(props.controlHeight),\n          }}\n        >\n          <VBtn\n            class=\"v-date-picker-controls__month-btn\"\n            data-testid=\"month-btn\"\n            disabled={ disableMonth.value }\n            text={ props.text }\n            variant=\"text\"\n            rounded\n            onClick={ onClickMonth }\n          />\n\n          <VBtn\n            class=\"v-date-picker-controls__mode-btn\"\n            data-testid=\"year-btn\"\n            disabled={ disableYear.value }\n            density=\"comfortable\"\n            icon={ props.modeIcon }\n            variant=\"text\"\n            onClick={ onClickYear }\n          />\n\n          <VSpacer />\n\n          <div class=\"v-date-picker-controls__month\">\n            <VBtn\n              data-testid=\"prev-month\"\n              disabled={ disablePrev.value }\n              density=\"comfortable\"\n              icon={ props.prevIcon }\n              variant=\"text\"\n              onClick={ onClickPrev }\n            />\n\n            <VBtn\n              data-testid=\"next-month\"\n              disabled={ disableNext.value }\n              icon={ props.nextIcon }\n              density=\"comfortable\"\n              variant=\"text\"\n              onClick={ onClickNext }\n            />\n          </div>\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VDatePickerControls = InstanceType<typeof VDatePickerControls>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VDatePickerControls.js","names":["VBtn","VSpacer","IconValue","useLocale","computed","convertToUnit","genericComponent","propsFactory","useRender","makeVDatePickerControlsProps","active","type","String","Array","default","undefined","controlHeight","Number","disabled","Boolean","nextIcon","prevIcon","modeIcon","text","viewMode","VDatePickerControls","name","props","emits","click:year","click:month","click:prev","click:next","click:text","setup","_ref","emit","t","disableMonth","isArray","includes","disableYear","disablePrev","disableNext","onClickPrev","onClickNext","onClickYear","onClickMonth","_createElementVNode","_normalizeClass","_createVNode","value"],"sources":["../../../src/components/VDatePicker/VDatePickerControls.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerControls.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\nimport { VSpacer } from '@/components/VGrid'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { useLocale } from '@/composables/locale'\n\n// Utilities\nimport { computed } from 'vue'\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const makeVDatePickerControlsProps = propsFactory({\n  active: {\n    type: [String, Array] as PropType<string | string[]>,\n    default: undefined,\n  },\n  controlHeight: [Number, String],\n  disabled: {\n    type: [Boolean, String, Array] as PropType<boolean | string | string[] | null>,\n    default: null,\n  },\n  nextIcon: {\n    type: IconValue,\n    default: '$next',\n  },\n  prevIcon: {\n    type: IconValue,\n    default: '$prev',\n  },\n  modeIcon: {\n    type: IconValue,\n    default: '$subgroup',\n  },\n  text: String,\n  viewMode: {\n    type: String as PropType<'month' | 'months' | 'year'>,\n    default: 'month',\n  },\n}, 'VDatePickerControls')\n\nexport const VDatePickerControls = genericComponent()({\n  name: 'VDatePickerControls',\n\n  props: makeVDatePickerControlsProps(),\n\n  emits: {\n    'click:year': () => true,\n    'click:month': () => true,\n    'click:prev': () => true,\n    'click:next': () => true,\n    'click:text': () => true,\n  },\n\n  setup (props, { emit }) {\n    const { t } = useLocale()\n\n    const disableMonth = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('text')\n        : !!props.disabled\n    })\n    const disableYear = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('mode')\n        : !!props.disabled\n    })\n    const disablePrev = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('prev')\n        : !!props.disabled\n    })\n    const disableNext = computed(() => {\n      return Array.isArray(props.disabled)\n        ? props.disabled.includes('next')\n        : !!props.disabled\n    })\n\n    function onClickPrev () {\n      emit('click:prev')\n    }\n\n    function onClickNext () {\n      emit('click:next')\n    }\n\n    function onClickYear () {\n      emit('click:year')\n    }\n\n    function onClickMonth () {\n      emit('click:month')\n    }\n\n    useRender(() => {\n      // TODO: add slot support and scope defaults\n      return (\n        <div\n          class={[\n            'v-date-picker-controls',\n          ]}\n          style={{\n            '--v-date-picker-controls-height': convertToUnit(props.controlHeight),\n          }}\n        >\n          <VBtn\n            class=\"v-date-picker-controls__month-btn\"\n            data-testid=\"month-btn\"\n            disabled={ disableMonth.value }\n            text={ props.text }\n            variant=\"text\"\n            rounded\n            onClick={ onClickMonth }\n          />\n\n          <VBtn\n            class=\"v-date-picker-controls__mode-btn\"\n            data-testid=\"year-btn\"\n            disabled={ disableYear.value }\n            density=\"comfortable\"\n            icon={ props.modeIcon }\n            variant=\"text\"\n            aria-label={ t('$vuetify.datePicker.ariaLabel.selectYear') }\n            onClick={ onClickYear }\n          />\n\n          <VSpacer />\n\n          <div class=\"v-date-picker-controls__month\">\n            <VBtn\n              data-testid=\"prev-month\"\n              disabled={ disablePrev.value }\n              density=\"comfortable\"\n              icon={ props.prevIcon }\n              variant=\"text\"\n              aria-label={ t('$vuetify.datePicker.ariaLabel.previousMonth') }\n              onClick={ onClickPrev }\n            />\n\n            <VBtn\n              data-testid=\"next-month\"\n              disabled={ disableNext.value }\n              icon={ props.nextIcon }\n              density=\"comfortable\"\n              variant=\"text\"\n              aria-label={ t('$vuetify.datePicker.ariaLabel.nextMonth') }\n              onClick={ onClickNext }\n            />\n          </div>\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VDatePickerControls = InstanceType<typeof VDatePickerControls>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VDatePicker/VDatePickerMonth.js

@@ -6,6 +6,7 @@ import "./VDatePickerMonth.css";
 import { VBtn } from "../VBtn/index.js"; // Composables
 import { makeCalendarProps, useCalendar } from "../../composables/calendar.js";
 import { createDateRange, useDate } from "../../composables/date/date.js";
+import { useLocale } from "../../composables/locale.js";
 import { MaybeTransition } from "../../composables/transition.js"; // Utilities
 import { computed, ref, shallowRef, toRef, watch } from 'vue';
 import { genericComponent, omit, propsFactory, useRender } from "../../util/index.js"; // Types
@@ -38,6 +39,9 @@ export const VDatePickerMonth = genericComponent()({
       slots
     } = _ref;
     const daysRef = ref();
+    const {
+      t
+    } = useLocale();
     const {
       daysInMonth,
       model,
@@ -94,6 +98,11 @@ export const VDatePickerMonth = genericComponent()({
         model.value = [rangeStart.value];
       }
     }
+    function getDateAriaLabel(item) {
+      const fullDate = adapter.format(item.date, 'fullDateWithWeekday');
+      const localeKey = item.isToday ? 'currentDate' : 'selectDate';
+      return t(`$vuetify.datePicker.ariaLabel.${localeKey}`, fullDate);
+    }
     function onMultipleClick(value) {
       const index = model.value.findIndex(selection => adapter.isSameDay(selection, value));
       if (index === -1) {
@@ -145,6 +154,8 @@ export const VDatePickerMonth = genericComponent()({
             ripple: false,
             text: item.localized,
             variant: item.isSelected ? 'flat' : item.isToday ? 'outlined' : 'text',
+            'aria-label': getDateAriaLabel(item),
+            'aria-current': item.isToday ? 'date' : undefined,
             onClick: () => onClick(item.date)
           },
           item,

package/lib/components/VDatePicker/VDatePickerMonth.js.map

@@ -1 +1 @@
-{"version":3,"file":"VDatePickerMonth.js","names":["VBtn","makeCalendarProps","useCalendar","createDateRange","useDate","MaybeTransition","computed","ref","shallowRef","toRef","watch","genericComponent","omit","propsFactory","useRender","makeVDatePickerMonthProps","color","String","hideWeekdays","Boolean","multiple","Number","showWeek","transition","type","default","reverseTransition","VDatePickerMonth","name","props","emits","date","setup","_ref","emit","slots","daysRef","daysInMonth","model","weekNumbers","weekdayLabels","adapter","rangeStart","rangeStop","isReverse","value","length","atMax","max","includes","Infinity","val","oldVal","isBefore","onRangeClick","_value","startOfDay","undefined","isSameDay","endOfDay","onMultipleClick","index","findIndex","selection","splice","onClick","_createElementVNode","weekdays","_createTextVNode","map","week","_normalizeClass","_createVNode","toString","weekDay","item","i","slotProps","class","isSelected","isToday","disabled","isDisabled","icon","ripple","text","localized","variant","isAdjacent","isHidden","isWeekEnd","isWeekStart","isoDate","showAdjacentMonths","day"],"sources":["../../../src/components/VDatePicker/VDatePickerMonth.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerMonth.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { makeCalendarProps, useCalendar } from '@/composables/calendar'\nimport { createDateRange, useDate } from '@/composables/date/date'\nimport { MaybeTransition } from '@/composables/transition'\n\n// Utilities\nimport { computed, ref, shallowRef, toRef, watch } from 'vue'\nimport { genericComponent, omit, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VDatePickerMonthSlots = {\n  day: {\n    props: {\n      onClick: () => void\n    }\n    item: any\n    i: number\n  }\n}\n\nexport const makeVDatePickerMonthProps = propsFactory({\n  color: String,\n  hideWeekdays: Boolean,\n  multiple: [Boolean, Number, String] as PropType<boolean | 'range' | number | (string & {})>,\n  showWeek: Boolean,\n  transition: {\n    type: String,\n    default: 'picker-transition',\n  },\n  reverseTransition: {\n    type: String,\n    default: 'picker-reverse-transition',\n  },\n\n  ...omit(makeCalendarProps(), ['displayValue']),\n}, 'VDatePickerMonth')\n\nexport const VDatePickerMonth = genericComponent<VDatePickerMonthSlots>()({\n  name: 'VDatePickerMonth',\n\n  props: makeVDatePickerMonthProps(),\n\n  emits: {\n    'update:modelValue': (date: unknown) => true,\n    'update:month': (date: number) => true,\n    'update:year': (date: number) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const daysRef = ref()\n\n    const { daysInMonth, model, weekNumbers, weekdayLabels } = useCalendar(props)\n    const adapter = useDate()\n\n    const rangeStart = shallowRef()\n    const rangeStop = shallowRef()\n    const isReverse = shallowRef(false)\n\n    const transition = toRef(() => {\n      return !isReverse.value ? props.transition : props.reverseTransition\n    })\n\n    if (props.multiple === 'range' && model.value.length > 0) {\n      rangeStart.value = model.value[0]\n      if (model.value.length > 1) {\n        rangeStop.value = model.value[model.value.length - 1]\n      }\n    }\n\n    const atMax = computed(() => {\n      const max = ['number', 'string'].includes(typeof props.multiple) ? Number(props.multiple) : Infinity\n\n      return model.value.length >= max\n    })\n\n    watch(daysInMonth, (val, oldVal) => {\n      if (!oldVal) return\n\n      isReverse.value = adapter.isBefore(val[0].date, oldVal[0].date)\n    })\n\n    function onRangeClick (value: unknown) {\n      const _value = adapter.startOfDay(value)\n\n      if (model.value.length === 0) {\n        rangeStart.value = undefined\n      } else if (model.value.length === 1) {\n        rangeStart.value = model.value[0]\n        rangeStop.value = undefined\n      }\n      if (!rangeStart.value) {\n        rangeStart.value = _value\n        model.value = [rangeStart.value]\n      } else if (!rangeStop.value) {\n        if (adapter.isSameDay(_value, rangeStart.value)) {\n          rangeStart.value = undefined\n          model.value = []\n          return\n        } else if (adapter.isBefore(_value, rangeStart.value)) {\n          rangeStop.value = adapter.endOfDay(rangeStart.value)\n          rangeStart.value = _value\n        } else {\n          rangeStop.value = adapter.endOfDay(_value)\n        }\n\n        model.value = createDateRange(adapter, rangeStart.value, rangeStop.value)\n      } else {\n        rangeStart.value = value\n        rangeStop.value = undefined\n        model.value = [rangeStart.value]\n      }\n    }\n\n    function onMultipleClick (value: unknown) {\n      const index = model.value.findIndex(selection => adapter.isSameDay(selection, value))\n\n      if (index === -1) {\n        model.value = [...model.value, value]\n      } else {\n        const value = [...model.value]\n        value.splice(index, 1)\n        model.value = value\n      }\n    }\n\n    function onClick (value: unknown) {\n      if (props.multiple === 'range') {\n        onRangeClick(value)\n      } else if (props.multiple) {\n        onMultipleClick(value)\n      } else {\n        model.value = [value]\n      }\n    }\n\n    useRender(() => (\n      <div\n        class=\"v-date-picker-month\"\n        style={{ '--v-date-picker-days-in-week': props.weekdays.length }}\n      >\n        { props.showWeek && (\n          <div key=\"weeks\" class=\"v-date-picker-month__weeks\">\n            { !props.hideWeekdays && (\n              <div key=\"hide-week-days\" class=\"v-date-picker-month__day\">&nbsp;</div>\n            )}\n            { weekNumbers.value.map(week => (\n              <div\n                class={[\n                  'v-date-picker-month__day',\n                  'v-date-picker-month__day--adjacent',\n                ]}\n              >{ week }</div>\n            ))}\n          </div>\n        )}\n\n        <MaybeTransition name={ transition.value }>\n          <div\n            ref={ daysRef }\n            key={ daysInMonth.value[0].date?.toString() }\n            class=\"v-date-picker-month__days\"\n          >\n            { !props.hideWeekdays && weekdayLabels.value.map(weekDay => (\n              <div\n                class={[\n                  'v-date-picker-month__day',\n                  'v-date-picker-month__weekday',\n                ]}\n              >{ weekDay }</div>\n            ))}\n\n            { daysInMonth.value.map((item, i) => {\n              const slotProps = {\n                props: {\n                  class: 'v-date-picker-month__day-btn',\n                  color: item.isSelected || item.isToday ? props.color : undefined,\n                  disabled: item.isDisabled,\n                  icon: true,\n                  ripple: false,\n                  text: item.localized,\n                  variant: item.isSelected ? 'flat' : item.isToday ? 'outlined' : 'text',\n                  onClick: () => onClick(item.date),\n                },\n                item,\n                i,\n              } as const\n\n              if (atMax.value && !item.isSelected) {\n                item.isDisabled = true\n              }\n\n              return (\n                <div\n                  class={[\n                    'v-date-picker-month__day',\n                    {\n                      'v-date-picker-month__day--adjacent': item.isAdjacent,\n                      'v-date-picker-month__day--hide-adjacent': item.isHidden,\n                      'v-date-picker-month__day--selected': item.isSelected,\n                      'v-date-picker-month__day--week-end': item.isWeekEnd,\n                      'v-date-picker-month__day--week-start': item.isWeekStart,\n                    },\n                  ]}\n                  data-v-date={ !item.isDisabled ? item.isoDate : undefined }\n                >\n                  { (props.showAdjacentMonths || !item.isAdjacent) && (\n                    slots.day?.(slotProps) ?? (<VBtn { ...slotProps.props } />)\n                  )}\n                </div>\n              )\n            })}\n          </div>\n        </MaybeTransition>\n      </div>\n    ))\n  },\n})\n\nexport type VDatePickerMonth = InstanceType<typeof VDatePickerMonth>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VDatePickerMonth.js","names":["VBtn","makeCalendarProps","useCalendar","createDateRange","useDate","useLocale","MaybeTransition","computed","ref","shallowRef","toRef","watch","genericComponent","omit","propsFactory","useRender","makeVDatePickerMonthProps","color","String","hideWeekdays","Boolean","multiple","Number","showWeek","transition","type","default","reverseTransition","VDatePickerMonth","name","props","emits","date","setup","_ref","emit","slots","daysRef","t","daysInMonth","model","weekNumbers","weekdayLabels","adapter","rangeStart","rangeStop","isReverse","value","length","atMax","max","includes","Infinity","val","oldVal","isBefore","onRangeClick","_value","startOfDay","undefined","isSameDay","endOfDay","getDateAriaLabel","item","fullDate","format","localeKey","isToday","onMultipleClick","index","findIndex","selection","splice","onClick","_createElementVNode","weekdays","_createTextVNode","map","week","_normalizeClass","_createVNode","toString","weekDay","i","slotProps","class","isSelected","disabled","isDisabled","icon","ripple","text","localized","variant","isAdjacent","isHidden","isWeekEnd","isWeekStart","isoDate","showAdjacentMonths","day"],"sources":["../../../src/components/VDatePicker/VDatePickerMonth.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerMonth.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { makeCalendarProps, useCalendar } from '@/composables/calendar'\nimport { createDateRange, useDate } from '@/composables/date/date'\nimport { useLocale } from '@/composables/locale'\nimport { MaybeTransition } from '@/composables/transition'\n\n// Utilities\nimport { computed, ref, shallowRef, toRef, watch } from 'vue'\nimport { genericComponent, omit, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VDatePickerMonthSlots = {\n  day: {\n    props: {\n      onClick: () => void\n    }\n    item: any\n    i: number\n  }\n}\n\nexport const makeVDatePickerMonthProps = propsFactory({\n  color: String,\n  hideWeekdays: Boolean,\n  multiple: [Boolean, Number, String] as PropType<boolean | 'range' | number | (string & {})>,\n  showWeek: Boolean,\n  transition: {\n    type: String,\n    default: 'picker-transition',\n  },\n  reverseTransition: {\n    type: String,\n    default: 'picker-reverse-transition',\n  },\n\n  ...omit(makeCalendarProps(), ['displayValue']),\n}, 'VDatePickerMonth')\n\nexport const VDatePickerMonth = genericComponent<VDatePickerMonthSlots>()({\n  name: 'VDatePickerMonth',\n\n  props: makeVDatePickerMonthProps(),\n\n  emits: {\n    'update:modelValue': (date: unknown) => true,\n    'update:month': (date: number) => true,\n    'update:year': (date: number) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const daysRef = ref()\n    const { t } = useLocale()\n\n    const { daysInMonth, model, weekNumbers, weekdayLabels } = useCalendar(props)\n    const adapter = useDate()\n\n    const rangeStart = shallowRef()\n    const rangeStop = shallowRef()\n    const isReverse = shallowRef(false)\n\n    const transition = toRef(() => {\n      return !isReverse.value ? props.transition : props.reverseTransition\n    })\n\n    if (props.multiple === 'range' && model.value.length > 0) {\n      rangeStart.value = model.value[0]\n      if (model.value.length > 1) {\n        rangeStop.value = model.value[model.value.length - 1]\n      }\n    }\n\n    const atMax = computed(() => {\n      const max = ['number', 'string'].includes(typeof props.multiple) ? Number(props.multiple) : Infinity\n\n      return model.value.length >= max\n    })\n\n    watch(daysInMonth, (val, oldVal) => {\n      if (!oldVal) return\n\n      isReverse.value = adapter.isBefore(val[0].date, oldVal[0].date)\n    })\n\n    function onRangeClick (value: unknown) {\n      const _value = adapter.startOfDay(value)\n\n      if (model.value.length === 0) {\n        rangeStart.value = undefined\n      } else if (model.value.length === 1) {\n        rangeStart.value = model.value[0]\n        rangeStop.value = undefined\n      }\n      if (!rangeStart.value) {\n        rangeStart.value = _value\n        model.value = [rangeStart.value]\n      } else if (!rangeStop.value) {\n        if (adapter.isSameDay(_value, rangeStart.value)) {\n          rangeStart.value = undefined\n          model.value = []\n          return\n        } else if (adapter.isBefore(_value, rangeStart.value)) {\n          rangeStop.value = adapter.endOfDay(rangeStart.value)\n          rangeStart.value = _value\n        } else {\n          rangeStop.value = adapter.endOfDay(_value)\n        }\n\n        model.value = createDateRange(adapter, rangeStart.value, rangeStop.value)\n      } else {\n        rangeStart.value = value\n        rangeStop.value = undefined\n        model.value = [rangeStart.value]\n      }\n    }\n\n    function getDateAriaLabel (item: any) {\n      const fullDate = adapter.format(item.date, 'fullDateWithWeekday')\n      const localeKey = item.isToday ? 'currentDate' : 'selectDate'\n      return t(`$vuetify.datePicker.ariaLabel.${localeKey}`, fullDate)\n    }\n\n    function onMultipleClick (value: unknown) {\n      const index = model.value.findIndex(selection => adapter.isSameDay(selection, value))\n\n      if (index === -1) {\n        model.value = [...model.value, value]\n      } else {\n        const value = [...model.value]\n        value.splice(index, 1)\n        model.value = value\n      }\n    }\n\n    function onClick (value: unknown) {\n      if (props.multiple === 'range') {\n        onRangeClick(value)\n      } else if (props.multiple) {\n        onMultipleClick(value)\n      } else {\n        model.value = [value]\n      }\n    }\n\n    useRender(() => (\n      <div\n        class=\"v-date-picker-month\"\n        style={{ '--v-date-picker-days-in-week': props.weekdays.length }}\n      >\n        { props.showWeek && (\n          <div key=\"weeks\" class=\"v-date-picker-month__weeks\">\n            { !props.hideWeekdays && (\n              <div key=\"hide-week-days\" class=\"v-date-picker-month__day\">&nbsp;</div>\n            )}\n            { weekNumbers.value.map(week => (\n              <div\n                class={[\n                  'v-date-picker-month__day',\n                  'v-date-picker-month__day--adjacent',\n                ]}\n              >{ week }</div>\n            ))}\n          </div>\n        )}\n\n        <MaybeTransition name={ transition.value }>\n          <div\n            ref={ daysRef }\n            key={ daysInMonth.value[0].date?.toString() }\n            class=\"v-date-picker-month__days\"\n          >\n            { !props.hideWeekdays && weekdayLabels.value.map(weekDay => (\n              <div\n                class={[\n                  'v-date-picker-month__day',\n                  'v-date-picker-month__weekday',\n                ]}\n              >{ weekDay }</div>\n            ))}\n\n            { daysInMonth.value.map((item, i) => {\n              const slotProps = {\n                props: {\n                  class: 'v-date-picker-month__day-btn',\n                  color: item.isSelected || item.isToday ? props.color : undefined,\n                  disabled: item.isDisabled,\n                  icon: true,\n                  ripple: false,\n                  text: item.localized,\n                  variant: item.isSelected ? 'flat' : item.isToday ? 'outlined' : 'text',\n                  'aria-label': getDateAriaLabel(item),\n                  'aria-current': item.isToday ? 'date' : undefined,\n                  onClick: () => onClick(item.date),\n                },\n                item,\n                i,\n              } as const\n\n              if (atMax.value && !item.isSelected) {\n                item.isDisabled = true\n              }\n\n              return (\n                <div\n                  class={[\n                    'v-date-picker-month__day',\n                    {\n                      'v-date-picker-month__day--adjacent': item.isAdjacent,\n                      'v-date-picker-month__day--hide-adjacent': item.isHidden,\n                      'v-date-picker-month__day--selected': item.isSelected,\n                      'v-date-picker-month__day--week-end': item.isWeekEnd,\n                      'v-date-picker-month__day--week-start': item.isWeekStart,\n                    },\n                  ]}\n                  data-v-date={ !item.isDisabled ? item.isoDate : undefined }\n                >\n                  { (props.showAdjacentMonths || !item.isAdjacent) && (\n                    slots.day?.(slotProps) ?? (<VBtn { ...slotProps.props } />)\n                  )}\n                </div>\n              )\n            })}\n          </div>\n        </MaybeTransition>\n      </div>\n    ))\n  },\n})\n\nexport type VDatePickerMonth = InstanceType<typeof VDatePickerMonth>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VDatePicker/VDatePickerMonths.js

@@ -37,11 +37,13 @@ export const VDatePickerMonths = genericComponent()({
       }
       return createRange(12).map(i => {
         const text = adapter.format(date, 'monthShort');
+        const label = adapter.format(date, 'month');
         const isDisabled = !!(!isMonthAllowed(i) || props.min && adapter.isAfter(adapter.startOfMonth(adapter.date(props.min)), date) || props.max && adapter.isAfter(date, adapter.startOfMonth(adapter.date(props.max))));
         date = adapter.getNextMonth(date);
         return {
           isDisabled,
           text,
+          label,
           value: i
         };
       });
@@ -68,6 +70,7 @@ export const VDatePickerMonths = genericComponent()({
     }, [months.value.map((month, i) => {
       const btnProps = {
         active: model.value === i,
+        ariaLabel: month.label,
         color: model.value === i ? props.color : undefined,
         disabled: month.isDisabled,
         rounded: true,

package/lib/components/VDatePicker/VDatePickerMonths.js.map

@@ -1 +1 @@
-{"version":3,"file":"VDatePickerMonths.js","names":["VBtn","useDate","useProxiedModel","computed","watchEffect","convertToUnit","createRange","genericComponent","propsFactory","useRender","makeVDatePickerMonthsProps","color","String","height","Number","min","max","modelValue","year","allowedMonths","Array","Function","VDatePickerMonths","name","props","emits","date","setup","_ref","emit","slots","adapter","model","months","startOfYear","setYear","map","i","text","format","isDisabled","isMonthAllowed","isAfter","startOfMonth","getNextMonth","value","getMonth","month","isArray","length","includes","_createElementVNode","btnProps","active","undefined","disabled","rounded","variant","onClick","_createVNode","_mergeProps"],"sources":["../../../src/components/VDatePicker/VDatePickerMonths.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerMonths.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, watchEffect } from 'vue'\nimport { convertToUnit, createRange, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VDatePickerMonthsSlots = {\n  month: {\n    month: {\n      text: string\n      value: number\n    }\n    i: number\n    props: {\n      onClick: () => void\n    }\n  }\n}\n\nexport const makeVDatePickerMonthsProps = propsFactory({\n  color: String,\n  height: [String, Number],\n  min: null as any as PropType<unknown>,\n  max: null as any as PropType<unknown>,\n  modelValue: Number,\n  year: Number,\n  allowedMonths: [Array, Function] as PropType<number[] | ((date: number) => boolean)>,\n}, 'VDatePickerMonths')\n\nexport const VDatePickerMonths = genericComponent<VDatePickerMonthsSlots>()({\n  name: 'VDatePickerMonths',\n\n  props: makeVDatePickerMonthsProps(),\n\n  emits: {\n    'update:modelValue': (date: any) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const adapter = useDate()\n    const model = useProxiedModel(props, 'modelValue')\n\n    const months = computed(() => {\n      let date = adapter.startOfYear(adapter.date())\n      if (props.year) {\n        date = adapter.setYear(date, props.year)\n      }\n      return createRange(12).map(i => {\n        const text = adapter.format(date, 'monthShort')\n        const isDisabled =\n          !!(\n            !isMonthAllowed(i) ||\n            (props.min && adapter.isAfter(adapter.startOfMonth(adapter.date(props.min)), date)) ||\n            (props.max && adapter.isAfter(date, adapter.startOfMonth(adapter.date(props.max))))\n          )\n        date = adapter.getNextMonth(date)\n\n        return {\n          isDisabled,\n          text,\n          value: i,\n        }\n      })\n    })\n\n    watchEffect(() => {\n      model.value = model.value ?? adapter.getMonth(adapter.date())\n    })\n\n    function isMonthAllowed (month: number) {\n      if (Array.isArray(props.allowedMonths) && props.allowedMonths.length) {\n        return props.allowedMonths.includes(month)\n      }\n\n      if (typeof props.allowedMonths === 'function') {\n        return props.allowedMonths(month)\n      }\n\n      return true\n    }\n\n    useRender(() => (\n      <div\n        class=\"v-date-picker-months\"\n        style={{\n          height: convertToUnit(props.height),\n        }}\n      >\n        <div class=\"v-date-picker-months__content\">\n          { months.value.map((month, i) => {\n            const btnProps = {\n              active: model.value === i,\n              color: model.value === i ? props.color : undefined,\n              disabled: month.isDisabled,\n              rounded: true,\n              text: month.text,\n              variant: model.value === month.value ? 'flat' : 'text',\n              onClick: () => onClick(i),\n            } as const\n\n            function onClick (i: number) {\n              if (model.value === i) {\n                emit('update:modelValue', model.value)\n                return\n              }\n              model.value = i\n            }\n\n            return slots.month?.({\n              month,\n              i,\n              props: btnProps,\n            }) ?? (\n              <VBtn\n                key=\"month\"\n                { ...btnProps }\n              />\n            )\n          })}\n        </div>\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VDatePickerMonths = InstanceType<typeof VDatePickerMonths>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VDatePickerMonths.js","names":["VBtn","useDate","useProxiedModel","computed","watchEffect","convertToUnit","createRange","genericComponent","propsFactory","useRender","makeVDatePickerMonthsProps","color","String","height","Number","min","max","modelValue","year","allowedMonths","Array","Function","VDatePickerMonths","name","props","emits","date","setup","_ref","emit","slots","adapter","model","months","startOfYear","setYear","map","i","text","format","label","isDisabled","isMonthAllowed","isAfter","startOfMonth","getNextMonth","value","getMonth","month","isArray","length","includes","_createElementVNode","btnProps","active","ariaLabel","undefined","disabled","rounded","variant","onClick","_createVNode","_mergeProps"],"sources":["../../../src/components/VDatePicker/VDatePickerMonths.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerMonths.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { useDate } from '@/composables/date'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, watchEffect } from 'vue'\nimport { convertToUnit, createRange, genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type VDatePickerMonthsSlots = {\n  month: {\n    month: {\n      text: string\n      value: number\n    }\n    i: number\n    props: {\n      onClick: () => void\n    }\n  }\n}\n\nexport const makeVDatePickerMonthsProps = propsFactory({\n  color: String,\n  height: [String, Number],\n  min: null as any as PropType<unknown>,\n  max: null as any as PropType<unknown>,\n  modelValue: Number,\n  year: Number,\n  allowedMonths: [Array, Function] as PropType<number[] | ((date: number) => boolean)>,\n}, 'VDatePickerMonths')\n\nexport const VDatePickerMonths = genericComponent<VDatePickerMonthsSlots>()({\n  name: 'VDatePickerMonths',\n\n  props: makeVDatePickerMonthsProps(),\n\n  emits: {\n    'update:modelValue': (date: any) => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const adapter = useDate()\n    const model = useProxiedModel(props, 'modelValue')\n\n    const months = computed(() => {\n      let date = adapter.startOfYear(adapter.date())\n      if (props.year) {\n        date = adapter.setYear(date, props.year)\n      }\n      return createRange(12).map(i => {\n        const text = adapter.format(date, 'monthShort')\n        const label = adapter.format(date, 'month')\n        const isDisabled =\n          !!(\n            !isMonthAllowed(i) ||\n            (props.min && adapter.isAfter(adapter.startOfMonth(adapter.date(props.min)), date)) ||\n            (props.max && adapter.isAfter(date, adapter.startOfMonth(adapter.date(props.max))))\n          )\n        date = adapter.getNextMonth(date)\n\n        return {\n          isDisabled,\n          text,\n          label,\n          value: i,\n        }\n      })\n    })\n\n    watchEffect(() => {\n      model.value = model.value ?? adapter.getMonth(adapter.date())\n    })\n\n    function isMonthAllowed (month: number) {\n      if (Array.isArray(props.allowedMonths) && props.allowedMonths.length) {\n        return props.allowedMonths.includes(month)\n      }\n\n      if (typeof props.allowedMonths === 'function') {\n        return props.allowedMonths(month)\n      }\n\n      return true\n    }\n\n    useRender(() => (\n      <div\n        class=\"v-date-picker-months\"\n        style={{\n          height: convertToUnit(props.height),\n        }}\n      >\n        <div class=\"v-date-picker-months__content\">\n          { months.value.map((month, i) => {\n            const btnProps = {\n              active: model.value === i,\n              ariaLabel: month.label,\n              color: model.value === i ? props.color : undefined,\n              disabled: month.isDisabled,\n              rounded: true,\n              text: month.text,\n              variant: model.value === month.value ? 'flat' : 'text',\n              onClick: () => onClick(i),\n            } as const\n\n            function onClick (i: number) {\n              if (model.value === i) {\n                emit('update:modelValue', model.value)\n                return\n              }\n              model.value = i\n            }\n\n            return slots.month?.({\n              month,\n              i,\n              props: btnProps,\n            }) ?? (\n              <VBtn\n                key=\"month\"\n                { ...btnProps }\n              />\n            )\n          })}\n        </div>\n      </div>\n    ))\n\n    return {}\n  },\n})\n\nexport type VDatePickerMonths = InstanceType<typeof VDatePickerMonths>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VList/VListChildren.js

@@ -4,6 +4,7 @@ import { VListGroup } from "./VListGroup.js";
 import { VListItem } from "./VListItem.js";
 import { VListSubheader } from "./VListSubheader.js";
 import { VDivider } from "../VDivider/index.js"; // Utilities
+import { mergeProps } from 'vue';
 import { createList } from "./list.js";
 import { genericComponent, propsFactory } from "../../util/index.js"; // Types
 export const makeVListChildrenProps = propsFactory({
@@ -62,11 +63,9 @@ export const VListChildren = genericComponent()({
           let {
             props: activatorProps
           } = _ref3;
-          const listItemProps = {
-            ...itemProps,
-            ...activatorProps,
+          const listItemProps = mergeProps(itemProps, activatorProps, {
             value: props.returnObject ? item : itemProps.value
-          };
+          });
           return slots.header ? slots.header({
             props: listItemProps
           }) : _createVNode(VListItem, listItemProps, slotsWithItem);

package/lib/components/VList/VListChildren.js.map

@@ -1 +1 @@
-{"version":3,"file":"VListChildren.js","names":["VListGroup","VListItem","VListSubheader","VDivider","createList","genericComponent","propsFactory","makeVListChildrenProps","items","Array","returnObject","Boolean","VListChildren","name","props","setup","_ref","slots","default","map","_ref2","children","itemProps","type","raw","item","divider","_createVNode","subheader","slotsWithItem","subtitle","slotProps","undefined","prepend","append","title","listGroupProps","filterProps","_mergeProps","value","activator","_ref3","activatorProps","listItemProps","header"],"sources":["../../../src/components/VList/VListChildren.tsx"],"sourcesContent":["// Components\nimport { VListGroup } from './VListGroup'\nimport { VListItem } from './VListItem'\nimport { VListSubheader } from './VListSubheader'\nimport { VDivider } from '@/components/VDivider'\n\n// Utilities\nimport { createList } from './list'\nimport { genericComponent, propsFactory } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { InternalListItem } from './VList'\nimport type { VListItemSlots } from './VListItem'\nimport type { GenericProps } from '@/util'\n\nexport type VListChildrenSlots<T> = {\n  [K in keyof Omit<VListItemSlots, 'default'>]: VListItemSlots[K] & { item: T }\n} & {\n  default: never\n  item: { props: InternalListItem['props'] }\n  divider: { props: InternalListItem['props'] }\n  subheader: { props: InternalListItem['props'] }\n  header: { props: InternalListItem['props'] }\n}\n\nexport const makeVListChildrenProps = propsFactory({\n  items: Array as PropType<readonly InternalListItem[]>,\n  returnObject: Boolean,\n}, 'VListChildren')\n\nexport const VListChildren = genericComponent<new <T extends InternalListItem>(\n  props: {\n    items?: readonly T[]\n    returnObject?: boolean\n  },\n  slots: VListChildrenSlots<T>\n) => GenericProps<typeof props, typeof slots>>()({\n  name: 'VListChildren',\n\n  props: makeVListChildrenProps(),\n\n  setup (props, { slots }) {\n    createList()\n\n    return () => slots.default?.() ?? props.items?.map(({ children, props: itemProps, type, raw: item }) => {\n      if (type === 'divider') {\n        return slots.divider?.({ props: itemProps }) ?? (\n          <VDivider { ...itemProps } />\n        )\n      }\n\n      if (type === 'subheader') {\n        return slots.subheader?.({ props: itemProps }) ?? (\n          <VListSubheader { ...itemProps } />\n        )\n      }\n\n      const slotsWithItem = {\n        subtitle: slots.subtitle ? (slotProps: any) => slots.subtitle?.({ ...slotProps, item }) : undefined,\n        prepend: slots.prepend ? (slotProps: any) => slots.prepend?.({ ...slotProps, item }) : undefined,\n        append: slots.append ? (slotProps: any) => slots.append?.({ ...slotProps, item }) : undefined,\n        title: slots.title ? (slotProps: any) => slots.title?.({ ...slotProps, item }) : undefined,\n      }\n\n      const listGroupProps = VListGroup.filterProps(itemProps)\n\n      return children ? (\n        <VListGroup\n          { ...listGroupProps }\n          value={ props.returnObject ? item : itemProps?.value }\n          rawId={ itemProps?.value }\n        >\n          {{\n            activator: ({ props: activatorProps }) => {\n              const listItemProps = {\n                ...itemProps,\n                ...activatorProps,\n                value: props.returnObject ? item : itemProps.value,\n              }\n\n              return slots.header\n                ? slots.header({ props: listItemProps })\n                : (\n                  <VListItem { ...listItemProps } v-slots={ slotsWithItem } />\n                )\n            },\n            default: () => (\n              <VListChildren\n                items={ children }\n                returnObject={ props.returnObject }\n                v-slots={ slots }\n              />\n            ),\n          }}\n        </VListGroup>\n      ) : (\n        slots.item ? slots.item({ props: itemProps }) : (\n          <VListItem\n            { ...itemProps }\n            value={ props.returnObject ? item : itemProps.value }\n            v-slots={ slotsWithItem }\n          />\n        )\n      )\n    })\n  },\n})\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VListChildren.js","names":["VListGroup","VListItem","VListSubheader","VDivider","mergeProps","createList","genericComponent","propsFactory","makeVListChildrenProps","items","Array","returnObject","Boolean","VListChildren","name","props","setup","_ref","slots","default","map","_ref2","children","itemProps","type","raw","item","divider","_createVNode","subheader","slotsWithItem","subtitle","slotProps","undefined","prepend","append","title","listGroupProps","filterProps","_mergeProps","value","activator","_ref3","activatorProps","listItemProps","header"],"sources":["../../../src/components/VList/VListChildren.tsx"],"sourcesContent":["// Components\nimport { VListGroup } from './VListGroup'\nimport { VListItem } from './VListItem'\nimport { VListSubheader } from './VListSubheader'\nimport { VDivider } from '@/components/VDivider'\n\n// Utilities\nimport { mergeProps } from 'vue'\nimport { createList } from './list'\nimport { genericComponent, propsFactory } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { InternalListItem } from './VList'\nimport type { VListItemSlots } from './VListItem'\nimport type { GenericProps } from '@/util'\n\nexport type VListChildrenSlots<T> = {\n  [K in keyof Omit<VListItemSlots, 'default'>]: VListItemSlots[K] & { item: T }\n} & {\n  default: never\n  item: { props: InternalListItem['props'] }\n  divider: { props: InternalListItem['props'] }\n  subheader: { props: InternalListItem['props'] }\n  header: { props: InternalListItem['props'] }\n}\n\nexport const makeVListChildrenProps = propsFactory({\n  items: Array as PropType<readonly InternalListItem[]>,\n  returnObject: Boolean,\n}, 'VListChildren')\n\nexport const VListChildren = genericComponent<new <T extends InternalListItem>(\n  props: {\n    items?: readonly T[]\n    returnObject?: boolean\n  },\n  slots: VListChildrenSlots<T>\n) => GenericProps<typeof props, typeof slots>>()({\n  name: 'VListChildren',\n\n  props: makeVListChildrenProps(),\n\n  setup (props, { slots }) {\n    createList()\n\n    return () => slots.default?.() ?? props.items?.map(({ children, props: itemProps, type, raw: item }) => {\n      if (type === 'divider') {\n        return slots.divider?.({ props: itemProps }) ?? (\n          <VDivider { ...itemProps } />\n        )\n      }\n\n      if (type === 'subheader') {\n        return slots.subheader?.({ props: itemProps }) ?? (\n          <VListSubheader { ...itemProps } />\n        )\n      }\n\n      const slotsWithItem = {\n        subtitle: slots.subtitle ? (slotProps: any) => slots.subtitle?.({ ...slotProps, item }) : undefined,\n        prepend: slots.prepend ? (slotProps: any) => slots.prepend?.({ ...slotProps, item }) : undefined,\n        append: slots.append ? (slotProps: any) => slots.append?.({ ...slotProps, item }) : undefined,\n        title: slots.title ? (slotProps: any) => slots.title?.({ ...slotProps, item }) : undefined,\n      }\n\n      const listGroupProps = VListGroup.filterProps(itemProps)\n\n      return children ? (\n        <VListGroup\n          { ...listGroupProps }\n          value={ props.returnObject ? item : itemProps?.value }\n          rawId={ itemProps?.value }\n        >\n          {{\n            activator: ({ props: activatorProps }) => {\n              const listItemProps = mergeProps(\n                itemProps,\n                activatorProps,\n                { value: props.returnObject ? item : itemProps.value }\n              ) as typeof itemProps\n\n              return slots.header\n                ? slots.header({ props: listItemProps })\n                : (\n                  <VListItem { ...listItemProps } v-slots={ slotsWithItem } />\n                )\n            },\n            default: () => (\n              <VListChildren\n                items={ children }\n                returnObject={ props.returnObject }\n                v-slots={ slots }\n              />\n            ),\n          }}\n        </VListGroup>\n      ) : (\n        slots.item ? slots.item({ props: itemProps }) : (\n          <VListItem\n            { ...itemProps }\n            value={ props.returnObject ? item : itemProps.value }\n            v-slots={ slotsWithItem }\n          />\n        )\n      )\n    })\n  },\n})\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VSlider/VSliderThumb.css

@@ -10,8 +10,8 @@
   background: rgba(var(--v-theme-surface-variant), 0.7);
   color: rgb(var(--v-theme-on-surface-variant));
 }
-.v-slider-thumb__label::before {
-  color: rgba(var(--v-theme-surface-variant), 0.7);
+.v-slider-thumb__label > .v-slider-thumb__label-wedge {
+  background: inherit;
 }
 
 .v-slider-thumb {
@@ -75,10 +75,9 @@
   user-select: none;
   transition: 0.2s cubic-bezier(0.4, 0, 1, 1);
 }
-.v-slider-thumb__label::before {
-  content: "";
-  width: 0;
-  height: 0;
+.v-slider-thumb__label > .v-slider-thumb__label-wedge {
+  width: 12px;
+  height: 12px;
   position: absolute;
 }
 
@@ -111,10 +110,8 @@
   transform: translateX(50%);
 }
 
-.v-slider.v-input--horizontal .v-slider-thumb__label::before {
-  border-left: 6px solid transparent;
-  border-right: 6px solid transparent;
-  border-top: 6px solid currentColor;
+.v-slider.v-input--horizontal .v-slider-thumb__label > .v-slider-thumb__label-wedge {
+  clip-path: polygon(50% 100%, 0 50%, 100% 50%);
   bottom: -6px;
 }
 
@@ -129,10 +126,8 @@
   top: -12.5px;
   left: calc(var(--v-slider-thumb-size) / 2);
 }
-.v-slider.v-input--vertical .v-slider-thumb__label::before {
-  border-right: 6px solid currentColor;
-  border-top: 6px solid transparent;
-  border-bottom: 6px solid transparent;
+.v-slider.v-input--vertical .v-slider-thumb__label > .v-slider-thumb__label-wedge {
+  clip-path: polygon(0 50%, 50% 0, 50% 100%);
   left: -6px;
 }
 

package/lib/components/VSlider/VSliderThumb.js

@@ -1,11 +1,11 @@
-import { normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, normalizeStyle as _normalizeStyle, withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode } from "vue";
+import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode } from "vue";
 // Styles
 import "./VSliderThumb.css";
 
 // Components
 import { VSliderSymbol } from "./slider.js";
 import { VScaleTransition } from "../transitions/index.js"; // Composables
-import { useTextColor } from "../../composables/color.js";
+import { useBackgroundColor, useTextColor } from "../../composables/color.js";
 import { makeComponentProps } from "../../composables/component.js";
 import { useElevation } from "../../composables/elevation.js";
 import { useRtl } from "../../composables/locale.js"; // Directives
@@ -62,6 +62,7 @@ export const VSliderThumb = genericComponent()({
       min,
       max,
       thumbColor,
+      thumbLabelColor,
       step,
       disabled,
       thumbSize,
@@ -83,6 +84,10 @@ export const VSliderThumb = genericComponent()({
       textColorClasses,
       textColorStyles
     } = useTextColor(thumbColor);
+    const {
+      backgroundColorClasses,
+      backgroundColorStyles
+    } = useBackgroundColor(thumbLabelColor);
     const {
       pageup,
       pagedown,
@@ -148,9 +153,7 @@ export const VSliderThumb = genericComponent()({
         "onKeydown": !readonly.value ? onKeydown : undefined
       }, [_createElementVNode("div", {
         "class": _normalizeClass(['v-slider-thumb__surface', textColorClasses.value, elevationClasses.value]),
-        "style": {
-          ...textColorStyles.value
-        }
+        "style": _normalizeStyle(textColorStyles.value)
       }, null), _withDirectives(_createElementVNode("div", {
         "class": _normalizeClass(['v-slider-thumb__ripple', textColorClasses.value]),
         "style": _normalizeStyle(textColorStyles.value)
@@ -163,10 +166,13 @@ export const VSliderThumb = genericComponent()({
         default: () => [_withDirectives(_createElementVNode("div", {
           "class": "v-slider-thumb__label-container"
         }, [_createElementVNode("div", {
-          "class": _normalizeClass(['v-slider-thumb__label', textColorClasses.value])
+          "class": _normalizeClass(['v-slider-thumb__label', backgroundColorClasses.value]),
+          "style": _normalizeStyle(backgroundColorStyles.value)
         }, [_createElementVNode("div", null, [slots['thumb-label']?.({
           modelValue: props.modelValue
-        }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1)])])]), [[_vShow, thumbLabel.value && props.focused || thumbLabel.value === 'always']])]
+        }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1)]), _createElementVNode("div", {
+          "class": "v-slider-thumb__label-wedge"
+        }, null)])]), [[_vShow, thumbLabel.value && props.focused || thumbLabel.value === 'always']])]
       })]);
     });
     return {};

package/lib/components/VSlider/VSliderThumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"VSliderThumb.js","names":["VSliderSymbol","VScaleTransition","useTextColor","makeComponentProps","useElevation","useRtl","vRipple","computed","inject","convertToUnit","genericComponent","keyValues","propsFactory","useRender","makeVSliderThumbProps","focused","Boolean","max","type","Number","required","min","modelValue","position","ripple","Object","default","name","String","noKeyboard","VSliderThumb","directives","props","emits","v","setup","_ref","slots","emit","slider","isRtl","rtlClasses","Error","thumbColor","step","disabled","thumbSize","thumbLabel","direction","isReversed","vertical","readonly","elevation","mousePressed","decimals","indexFromEnd","elevationProps","value","undefined","elevationClasses","textColorClasses","textColorStyles","pageup","pagedown","end","home","left","right","down","up","relevantKeys","multipliers","parseKeydown","e","includes","key","preventDefault","_step","steps","increase","multiplier","shiftKey","ctrlKey","isInteger","Math","onKeydown","newValue","positionPercentage","_createElementVNode","_normalizeClass","class","_normalizeStyle","style","_withDirectives","circle","center","_createVNode","toFixed","_vShow"],"sources":["../../../src/components/VSlider/VSliderThumb.tsx"],"sourcesContent":["// Styles\nimport './VSliderThumb.sass'\n\n// Components\nimport { VSliderSymbol } from './slider'\nimport { VScaleTransition } from '../transitions'\n\n// Composables\nimport { useTextColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { useElevation } from '@/composables/elevation'\nimport { useRtl } from '@/composables/locale'\n\n// Directives\nimport vRipple from '@/directives/ripple'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, genericComponent, keyValues, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\nexport type VSliderThumbSlots = {\n  'thumb-label': { modelValue: number }\n}\n\nexport const makeVSliderThumbProps = propsFactory({\n  focused: Boolean,\n  max: {\n    type: Number,\n    required: true,\n  },\n  min: {\n    type: Number,\n    required: true,\n  },\n  modelValue: {\n    type: Number,\n    required: true,\n  },\n  position: {\n    type: Number,\n    required: true,\n  },\n  ripple: {\n    type: [Boolean, Object] as PropType<RippleDirectiveBinding['value']>,\n    default: true,\n  },\n  name: String,\n  noKeyboard: Boolean,\n\n  ...makeComponentProps(),\n}, 'VSliderThumb')\n\nexport const VSliderThumb = genericComponent<VSliderThumbSlots>()({\n  name: 'VSliderThumb',\n\n  directives: { vRipple },\n\n  props: makeVSliderThumbProps(),\n\n  emits: {\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const slider = inject(VSliderSymbol)\n    const { isRtl, rtlClasses } = useRtl()\n    if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider')\n\n    const {\n      min,\n      max,\n      thumbColor,\n      step,\n      disabled,\n      thumbSize,\n      thumbLabel,\n      direction,\n      isReversed,\n      vertical,\n      readonly,\n      elevation,\n      mousePressed,\n      decimals,\n      indexFromEnd,\n    } = slider\n\n    const elevationProps = computed(() => !disabled.value ? elevation.value : undefined)\n    const { elevationClasses } = useElevation(elevationProps)\n    const { textColorClasses, textColorStyles } = useTextColor(thumbColor)\n\n    const { pageup, pagedown, end, home, left, right, down, up } = keyValues\n    const relevantKeys = [pageup, pagedown, end, home, left, right, down, up]\n\n    const multipliers = computed(() => {\n      if (step.value) return [1, 2, 3]\n      else return [1, 5, 10]\n    })\n\n    function parseKeydown (e: KeyboardEvent, value: number) {\n      if (props.noKeyboard) return\n      if (!relevantKeys.includes(e.key)) return\n\n      e.preventDefault()\n\n      const _step = step.value || 0.1\n      const steps = (max.value - min.value) / _step\n      if ([left, right, down, up].includes(e.key)) {\n        const increase = vertical.value\n          ? [isRtl.value ? left : right, isReversed.value ? down : up]\n          : indexFromEnd.value !== isRtl.value ? [left, up] : [right, up]\n        const direction = increase.includes(e.key) ? 1 : -1\n        const multiplier = e.shiftKey ? 2 : (e.ctrlKey ? 1 : 0)\n\n        if (direction === -1 && value === max.value && !multiplier && !Number.isInteger(steps)) {\n          value = value - (steps % 1) * _step\n        } else {\n          value = value + (direction * _step * multipliers.value[multiplier])\n        }\n      } else if (e.key === home) {\n        value = min.value\n      } else if (e.key === end) {\n        value = max.value\n      } else {\n        const direction = e.key === pagedown ? 1 : -1\n        value = value - (direction * _step * (steps > 100 ? steps / 10 : 10))\n      }\n\n      return Math.max(props.min, Math.min(props.max, value))\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const newValue = parseKeydown(e, props.modelValue)\n\n      newValue != null && emit('update:modelValue', newValue)\n    }\n\n    useRender(() => {\n      const positionPercentage = convertToUnit(indexFromEnd.value ? 100 - props.position : props.position, '%')\n\n      return (\n        <div\n          class={[\n            'v-slider-thumb',\n            {\n              'v-slider-thumb--focused': props.focused,\n              'v-slider-thumb--pressed': props.focused && mousePressed.value,\n            },\n            props.class,\n            rtlClasses.value,\n          ]}\n          style={[\n            {\n              '--v-slider-thumb-position': positionPercentage,\n              '--v-slider-thumb-size': convertToUnit(thumbSize.value),\n            },\n            props.style,\n          ]}\n          role=\"slider\"\n          tabindex={ disabled.value ? -1 : 0 }\n          aria-label={ props.name }\n          aria-valuemin={ min.value }\n          aria-valuemax={ max.value }\n          aria-valuenow={ props.modelValue }\n          aria-readonly={ !!readonly.value }\n          aria-orientation={ direction.value }\n          onKeydown={ !readonly.value ? onKeydown : undefined }\n        >\n          <div\n            class={[\n              'v-slider-thumb__surface',\n              textColorClasses.value,\n              elevationClasses.value,\n            ]}\n            style={{\n              ...textColorStyles.value,\n            }}\n          />\n          <div\n            class={[\n              'v-slider-thumb__ripple',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n            v-ripple={[props.ripple, null, ['circle', 'center']]}\n          />\n          <VScaleTransition origin=\"bottom center\">\n            <div\n              class=\"v-slider-thumb__label-container\"\n              v-show={ (thumbLabel.value && props.focused) || thumbLabel.value === 'always' }\n            >\n              <div\n                class={[\n                  'v-slider-thumb__label',\n                  textColorClasses.value,\n                ]}\n              >\n                <div>\n                  { slots['thumb-label']?.({ modelValue: props.modelValue }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1) }\n                </div>\n              </div>\n            </div>\n          </VScaleTransition>\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSliderThumb = InstanceType<typeof VSliderThumb>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VSliderThumb.js","names":["VSliderSymbol","VScaleTransition","useBackgroundColor","useTextColor","makeComponentProps","useElevation","useRtl","vRipple","computed","inject","convertToUnit","genericComponent","keyValues","propsFactory","useRender","makeVSliderThumbProps","focused","Boolean","max","type","Number","required","min","modelValue","position","ripple","Object","default","name","String","noKeyboard","VSliderThumb","directives","props","emits","v","setup","_ref","slots","emit","slider","isRtl","rtlClasses","Error","thumbColor","thumbLabelColor","step","disabled","thumbSize","thumbLabel","direction","isReversed","vertical","readonly","elevation","mousePressed","decimals","indexFromEnd","elevationProps","value","undefined","elevationClasses","textColorClasses","textColorStyles","backgroundColorClasses","backgroundColorStyles","pageup","pagedown","end","home","left","right","down","up","relevantKeys","multipliers","parseKeydown","e","includes","key","preventDefault","_step","steps","increase","multiplier","shiftKey","ctrlKey","isInteger","Math","onKeydown","newValue","positionPercentage","_createElementVNode","_normalizeClass","class","_normalizeStyle","style","_withDirectives","circle","center","_createVNode","toFixed","_vShow"],"sources":["../../../src/components/VSlider/VSliderThumb.tsx"],"sourcesContent":["// Styles\nimport './VSliderThumb.sass'\n\n// Components\nimport { VSliderSymbol } from './slider'\nimport { VScaleTransition } from '../transitions'\n\n// Composables\nimport { useBackgroundColor, useTextColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { useElevation } from '@/composables/elevation'\nimport { useRtl } from '@/composables/locale'\n\n// Directives\nimport vRipple from '@/directives/ripple'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { convertToUnit, genericComponent, keyValues, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\nexport type VSliderThumbSlots = {\n  'thumb-label': { modelValue: number }\n}\n\nexport const makeVSliderThumbProps = propsFactory({\n  focused: Boolean,\n  max: {\n    type: Number,\n    required: true,\n  },\n  min: {\n    type: Number,\n    required: true,\n  },\n  modelValue: {\n    type: Number,\n    required: true,\n  },\n  position: {\n    type: Number,\n    required: true,\n  },\n  ripple: {\n    type: [Boolean, Object] as PropType<RippleDirectiveBinding['value']>,\n    default: true,\n  },\n  name: String,\n  noKeyboard: Boolean,\n\n  ...makeComponentProps(),\n}, 'VSliderThumb')\n\nexport const VSliderThumb = genericComponent<VSliderThumbSlots>()({\n  name: 'VSliderThumb',\n\n  directives: { vRipple },\n\n  props: makeVSliderThumbProps(),\n\n  emits: {\n    'update:modelValue': (v: number) => true,\n  },\n\n  setup (props, { slots, emit }) {\n    const slider = inject(VSliderSymbol)\n    const { isRtl, rtlClasses } = useRtl()\n    if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider')\n\n    const {\n      min,\n      max,\n      thumbColor,\n      thumbLabelColor,\n      step,\n      disabled,\n      thumbSize,\n      thumbLabel,\n      direction,\n      isReversed,\n      vertical,\n      readonly,\n      elevation,\n      mousePressed,\n      decimals,\n      indexFromEnd,\n    } = slider\n\n    const elevationProps = computed(() => !disabled.value ? elevation.value : undefined)\n    const { elevationClasses } = useElevation(elevationProps)\n    const { textColorClasses, textColorStyles } = useTextColor(thumbColor)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(thumbLabelColor)\n\n    const { pageup, pagedown, end, home, left, right, down, up } = keyValues\n    const relevantKeys = [pageup, pagedown, end, home, left, right, down, up]\n\n    const multipliers = computed(() => {\n      if (step.value) return [1, 2, 3]\n      else return [1, 5, 10]\n    })\n\n    function parseKeydown (e: KeyboardEvent, value: number) {\n      if (props.noKeyboard) return\n      if (!relevantKeys.includes(e.key)) return\n\n      e.preventDefault()\n\n      const _step = step.value || 0.1\n      const steps = (max.value - min.value) / _step\n      if ([left, right, down, up].includes(e.key)) {\n        const increase = vertical.value\n          ? [isRtl.value ? left : right, isReversed.value ? down : up]\n          : indexFromEnd.value !== isRtl.value ? [left, up] : [right, up]\n        const direction = increase.includes(e.key) ? 1 : -1\n        const multiplier = e.shiftKey ? 2 : (e.ctrlKey ? 1 : 0)\n\n        if (direction === -1 && value === max.value && !multiplier && !Number.isInteger(steps)) {\n          value = value - (steps % 1) * _step\n        } else {\n          value = value + (direction * _step * multipliers.value[multiplier])\n        }\n      } else if (e.key === home) {\n        value = min.value\n      } else if (e.key === end) {\n        value = max.value\n      } else {\n        const direction = e.key === pagedown ? 1 : -1\n        value = value - (direction * _step * (steps > 100 ? steps / 10 : 10))\n      }\n\n      return Math.max(props.min, Math.min(props.max, value))\n    }\n\n    function onKeydown (e: KeyboardEvent) {\n      const newValue = parseKeydown(e, props.modelValue)\n\n      newValue != null && emit('update:modelValue', newValue)\n    }\n\n    useRender(() => {\n      const positionPercentage = convertToUnit(indexFromEnd.value ? 100 - props.position : props.position, '%')\n\n      return (\n        <div\n          class={[\n            'v-slider-thumb',\n            {\n              'v-slider-thumb--focused': props.focused,\n              'v-slider-thumb--pressed': props.focused && mousePressed.value,\n            },\n            props.class,\n            rtlClasses.value,\n          ]}\n          style={[\n            {\n              '--v-slider-thumb-position': positionPercentage,\n              '--v-slider-thumb-size': convertToUnit(thumbSize.value),\n            },\n            props.style,\n          ]}\n          role=\"slider\"\n          tabindex={ disabled.value ? -1 : 0 }\n          aria-label={ props.name }\n          aria-valuemin={ min.value }\n          aria-valuemax={ max.value }\n          aria-valuenow={ props.modelValue }\n          aria-readonly={ !!readonly.value }\n          aria-orientation={ direction.value }\n          onKeydown={ !readonly.value ? onKeydown : undefined }\n        >\n          <div\n            class={[\n              'v-slider-thumb__surface',\n              textColorClasses.value,\n              elevationClasses.value,\n            ]}\n            style={ textColorStyles.value }\n          />\n          <div\n            class={[\n              'v-slider-thumb__ripple',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n            v-ripple={[props.ripple, null, ['circle', 'center']]}\n          />\n          <VScaleTransition origin=\"bottom center\">\n            <div\n              class=\"v-slider-thumb__label-container\"\n              v-show={ (thumbLabel.value && props.focused) || thumbLabel.value === 'always' }\n            >\n              <div\n                class={[\n                  'v-slider-thumb__label',\n                  backgroundColorClasses.value,\n                ]}\n                style={ backgroundColorStyles.value }\n              >\n                <div>\n                  { slots['thumb-label']?.({ modelValue: props.modelValue }) ?? props.modelValue.toFixed(step.value ? decimals.value : 1) }\n                </div>\n                <div class=\"v-slider-thumb__label-wedge\" />\n              </div>\n            </div>\n          </VScaleTransition>\n        </div>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSliderThumb = InstanceType<typeof VSliderThumb>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VSlider/VSliderThumb.sass

@@ -18,8 +18,8 @@
     background: rgba(var(--v-theme-surface-variant), .7)
     color: rgb(var(--v-theme-on-surface-variant))
 
-    &::before
-      color: rgba(var(--v-theme-surface-variant), .7)
+    > .v-slider-thumb__label-wedge
+      background: inherit
 
   // Block
   .v-slider-thumb
@@ -78,10 +78,9 @@
     user-select: none
     transition: $slider-thumb-label-transition
 
-    &::before
-      content: ''
-      width: 0
-      height: 0
+    > .v-slider-thumb__label-wedge
+      width: $slider-thumb-label-wedge-size * 2
+      height: $slider-thumb-label-wedge-size * 2
       position: absolute
 
   .v-slider-thumb__ripple
@@ -111,10 +110,8 @@
       @include tools.rtl()
         transform: translateX(50%)
 
-      &::before
-        border-left: $slider-thumb-label-wedge-size solid transparent
-        border-right: $slider-thumb-label-wedge-size solid transparent
-        border-top: $slider-thumb-label-wedge-size solid currentColor
+      > .v-slider-thumb__label-wedge
+        clip-path: polygon(50% 100%, 0 50%, 100% 50%)
         bottom: -$slider-thumb-label-wedge-size
 
   // Vertical
@@ -130,10 +127,8 @@
       top: math.div($slider-thumb-label-height, -2)
       left: $slider-thumb-label-offset
 
-      &::before
-        border-right: $slider-thumb-label-wedge-size solid currentColor
-        border-top: $slider-thumb-label-wedge-size solid transparent
-        border-bottom: $slider-thumb-label-wedge-size solid transparent
+      > .v-slider-thumb__label-wedge
+        clip-path: polygon(0 50%, 50% 0, 50% 100%)
         left: -$slider-thumb-label-wedge-size
 
   // Modifiers

package/lib/components/VSlider/slider.d.ts

@@ -30,6 +30,7 @@ type SliderProvide = {
     step: Ref<number>;
     thumbSize: Ref<number>;
     thumbColor: Ref<string | undefined>;
+    thumbLabelColor: Ref<string | undefined>;
     trackColor: Ref<string | undefined>;
     trackFillColor: Ref<string | undefined>;
     trackSize: Ref<number>;

package/lib/components/VSlider/slider.js

@@ -134,6 +134,7 @@ export const useSlider = _ref => {
   const numTicks = computed(() => (max.value - min.value) / step.value);
   const disabled = toRef(() => props.disabled);
   const thumbColor = computed(() => props.error || props.disabled ? undefined : props.thumbColor ?? props.color);
+  const thumbLabelColor = computed(() => props.error || props.disabled ? undefined : props.thumbColor);
   const trackColor = computed(() => props.error || props.disabled ? undefined : props.trackColor ?? props.color);
   const trackFillColor = computed(() => props.error || props.disabled ? undefined : props.trackFillColor ?? props.color);
   const mousePressed = shallowRef(false);
@@ -291,6 +292,7 @@ export const useSlider = _ref => {
     step,
     thumbSize,
     thumbColor,
+    thumbLabelColor,
     thumbLabel: toRef(() => props.thumbLabel),
     ticks: toRef(() => props.ticks),
     tickSize,