@vuetify/nightly 3.10.7-dev.2025-10-23 → 3.10.7-dev.2025-10-25

package/lib/components/VDatePicker/VDatePicker.d.ts

@@ -59,6 +59,8 @@ export declare const makeVDatePickerProps: <Defaults extends {
     showWeek?: unknown;
     transition?: unknown;
     reverseTransition?: unknown;
+    events?: unknown;
+    eventColor?: unknown;
     year?: unknown;
     allowedMonths?: unknown;
     min?: unknown;
@@ -358,6 +360,26 @@ export declare const makeVDatePickerProps: <Defaults extends {
         type: import("vue").PropType<unknown extends Defaults["reverseTransition"] ? string : string | Defaults["reverseTransition"]>;
         default: unknown extends Defaults["reverseTransition"] ? string : string | Defaults["reverseTransition"];
     };
+    events: unknown extends Defaults["events"] ? {
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEvents | null>;
+        default: () => null;
+    } : Omit<{
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEvents | null>;
+        default: () => null;
+    }, "default" | "type"> & {
+        type: import("vue").PropType<unknown extends Defaults["events"] ? import("./VDatePickerMonth.js").DatePickerEvents | null : Defaults["events"] | import("./VDatePickerMonth.js").DatePickerEvents | null>;
+        default: unknown extends Defaults["events"] ? import("./VDatePickerMonth.js").DatePickerEvents | null : Defaults["events"] | NonNullable<import("./VDatePickerMonth.js").DatePickerEvents | null>;
+    };
+    eventColor: unknown extends Defaults["eventColor"] ? {
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEventColors>;
+        default: () => null;
+    } : Omit<{
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEventColors>;
+        default: () => null;
+    }, "default" | "type"> & {
+        type: import("vue").PropType<unknown extends Defaults["eventColor"] ? import("./VDatePickerMonth.js").DatePickerEventColors : Defaults["eventColor"] | import("./VDatePickerMonth.js").DatePickerEventColors>;
+        default: unknown extends Defaults["eventColor"] ? import("./VDatePickerMonth.js").DatePickerEventColors : Defaults["eventColor"] | NonNullable<import("./VDatePickerMonth.js").DatePickerEventColors>;
+    };
     year: unknown extends Defaults["year"] ? NumberConstructor : {
         type: import("vue").PropType<unknown extends Defaults["year"] ? number : number | Defaults["year"]>;
         default: unknown extends Defaults["year"] ? number : number | Defaults["year"];
@@ -419,6 +441,8 @@ export declare const VDatePicker: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: import("./VDatePickerMonth.js").DatePickerEvents | null;
+        eventColor: import("./VDatePickerMonth.js").DatePickerEventColors;
         header: string;
     } & {
         theme?: string | undefined;
@@ -485,6 +509,8 @@ export declare const VDatePicker: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: import("./VDatePickerMonth.js").DatePickerEvents | null;
+        eventColor: import("./VDatePickerMonth.js").DatePickerEventColors;
         header: string;
     }, true, {}, import("vue").SlotsType<Partial<{
         actions: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
@@ -571,6 +597,8 @@ export declare const VDatePicker: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: import("./VDatePickerMonth.js").DatePickerEvents | null;
+        eventColor: import("./VDatePickerMonth.js").DatePickerEventColors;
         header: string;
     } & {
         theme?: string | undefined;
@@ -631,6 +659,8 @@ export declare const VDatePicker: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: import("./VDatePickerMonth.js").DatePickerEvents | null;
+        eventColor: import("./VDatePickerMonth.js").DatePickerEventColors;
         header: string;
     }>;
     __isFragment?: undefined;
@@ -657,6 +687,8 @@ export declare const VDatePicker: {
     showWeek: boolean;
     transition: string;
     reverseTransition: string;
+    events: import("./VDatePickerMonth.js").DatePickerEvents | null;
+    eventColor: import("./VDatePickerMonth.js").DatePickerEventColors;
     header: string;
 } & {
     theme?: string | undefined;
@@ -723,6 +755,8 @@ export declare const VDatePicker: {
     showWeek: boolean;
     transition: string;
     reverseTransition: string;
+    events: import("./VDatePickerMonth.js").DatePickerEvents | null;
+    eventColor: import("./VDatePickerMonth.js").DatePickerEventColors;
     header: string;
 }, {}, string, import("vue").SlotsType<Partial<{
     actions: () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
@@ -891,6 +925,14 @@ export declare const VDatePicker: {
         type: StringConstructor;
         default: string;
     };
+    events: {
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEvents | null>;
+        default: () => null;
+    };
+    eventColor: {
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEventColors>;
+        default: () => null;
+    };
     year: NumberConstructor;
     allowedMonths: import("vue").PropType<number[] | ((date: number) => boolean)>;
     min: import("vue").PropType<unknown>;
@@ -1004,6 +1046,14 @@ export declare const VDatePicker: {
         type: StringConstructor;
         default: string;
     };
+    events: {
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEvents | null>;
+        default: () => null;
+    };
+    eventColor: {
+        type: import("vue").PropType<import("./VDatePickerMonth.js").DatePickerEventColors>;
+        default: () => null;
+    };
     year: NumberConstructor;
     allowedMonths: import("vue").PropType<number[] | ((date: number) => boolean)>;
     min: import("vue").PropType<unknown>;

package/lib/components/VDatePicker/VDatePickerMonth.css

@@ -48,4 +48,29 @@
 
 .v-date-picker-month__day--hide-adjacent {
   opacity: 0;
+}
+
+.v-date-picker-month__events {
+  height: 8px;
+  left: 0;
+  text-indent: 0;
+  position: absolute;
+  text-align: center;
+  white-space: pre;
+  width: 100%;
+}
+.v-date-picker-month__events > div {
+  height: 8px;
+  margin: 0 1px;
+  width: 8px;
+  margin-bottom: -1px;
+}
+.v-date-picker-month__events .v-badge--dot .v-badge__badge {
+  border-radius: 4px;
+  height: 8px;
+  width: 8px;
+}
+
+.v-date-picker-month__day .v-date-picker-month__events {
+  bottom: 8px;
 }

package/lib/components/VDatePicker/VDatePickerMonth.d.ts

@@ -2,6 +2,9 @@
 
 // Types
 import type { PropType } from 'vue';
+export type DatePickerEventColorValue = boolean | string | string[];
+export type DatePickerEventColors = DatePickerEventColorValue | Record<string, DatePickerEventColorValue> | ((date: string) => DatePickerEventColorValue);
+export type DatePickerEvents = string[] | ((date: string) => DatePickerEventColorValue) | Record<string, DatePickerEventColorValue>;
 export type VDatePickerMonthSlots = {
     day: {
         props: {
@@ -31,6 +34,8 @@ export declare const makeVDatePickerMonthProps: <Defaults extends {
     showWeek?: unknown;
     transition?: unknown;
     reverseTransition?: unknown;
+    events?: unknown;
+    eventColor?: unknown;
 } = {}>(defaults?: Defaults | undefined) => {
     allowedDates: unknown extends Defaults["allowedDates"] ? PropType<unknown[] | ((date: unknown) => boolean)> : {
         type: PropType<unknown extends Defaults["allowedDates"] ? unknown[] | ((date: unknown) => boolean) : unknown[] | ((date: unknown) => boolean) | Defaults["allowedDates"]>;
@@ -150,6 +155,26 @@ export declare const makeVDatePickerMonthProps: <Defaults extends {
         type: PropType<unknown extends Defaults["reverseTransition"] ? string : string | Defaults["reverseTransition"]>;
         default: unknown extends Defaults["reverseTransition"] ? string : string | Defaults["reverseTransition"];
     };
+    events: unknown extends Defaults["events"] ? {
+        type: PropType<DatePickerEvents | null>;
+        default: () => null;
+    } : Omit<{
+        type: PropType<DatePickerEvents | null>;
+        default: () => null;
+    }, "default" | "type"> & {
+        type: PropType<unknown extends Defaults["events"] ? DatePickerEvents | null : Defaults["events"] | DatePickerEvents | null>;
+        default: unknown extends Defaults["events"] ? DatePickerEvents | null : Defaults["events"] | NonNullable<DatePickerEvents | null>;
+    };
+    eventColor: unknown extends Defaults["eventColor"] ? {
+        type: PropType<DatePickerEventColors>;
+        default: () => null;
+    } : Omit<{
+        type: PropType<DatePickerEventColors>;
+        default: () => null;
+    }, "default" | "type"> & {
+        type: PropType<unknown extends Defaults["eventColor"] ? DatePickerEventColors : Defaults["eventColor"] | DatePickerEventColors>;
+        default: unknown extends Defaults["eventColor"] ? DatePickerEventColors : Defaults["eventColor"] | NonNullable<DatePickerEventColors>;
+    };
 };
 export declare const VDatePickerMonth: {
     new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<{
@@ -161,6 +186,8 @@ export declare const VDatePickerMonth: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: DatePickerEvents | null;
+        eventColor: DatePickerEventColors;
     } & {
         allowedDates?: unknown[] | ((date: unknown) => boolean) | undefined;
         modelValue?: unknown[] | undefined;
@@ -221,6 +248,8 @@ export declare const VDatePickerMonth: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: DatePickerEvents | null;
+        eventColor: DatePickerEventColors;
     }, true, {}, import("vue").SlotsType<Partial<{
         day: (arg: {
             props: {
@@ -247,6 +276,8 @@ export declare const VDatePickerMonth: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: DatePickerEvents | null;
+        eventColor: DatePickerEventColors;
     } & {
         allowedDates?: unknown[] | ((date: unknown) => boolean) | undefined;
         modelValue?: unknown[] | undefined;
@@ -303,6 +334,8 @@ export declare const VDatePickerMonth: {
         showWeek: boolean;
         transition: string;
         reverseTransition: string;
+        events: DatePickerEvents | null;
+        eventColor: DatePickerEventColors;
     }>;
     __isFragment?: undefined;
     __isTeleport?: undefined;
@@ -316,6 +349,8 @@ export declare const VDatePickerMonth: {
     showWeek: boolean;
     transition: string;
     reverseTransition: string;
+    events: DatePickerEvents | null;
+    eventColor: DatePickerEventColors;
 } & {
     allowedDates?: unknown[] | ((date: unknown) => boolean) | undefined;
     modelValue?: unknown[] | undefined;
@@ -376,6 +411,8 @@ export declare const VDatePickerMonth: {
     showWeek: boolean;
     transition: string;
     reverseTransition: string;
+    events: DatePickerEvents | null;
+    eventColor: DatePickerEventColors;
 }, {}, string, import("vue").SlotsType<Partial<{
     day: (arg: {
         props: {
@@ -427,6 +464,14 @@ export declare const VDatePickerMonth: {
         type: StringConstructor;
         default: string;
     };
+    events: {
+        type: PropType<DatePickerEvents | null>;
+        default: () => null;
+    };
+    eventColor: {
+        type: PropType<DatePickerEventColors>;
+        default: () => null;
+    };
 }, import("vue").ExtractPropTypes<{
     allowedDates: PropType<unknown[] | ((date: unknown) => boolean)>;
     disabled: {
@@ -468,5 +513,13 @@ export declare const VDatePickerMonth: {
         type: StringConstructor;
         default: string;
     };
+    events: {
+        type: PropType<DatePickerEvents | null>;
+        default: () => null;
+    };
+    eventColor: {
+        type: PropType<DatePickerEventColors>;
+        default: () => null;
+    };
 }>>;
 export type VDatePickerMonth = InstanceType<typeof VDatePickerMonth>;

package/lib/components/VDatePicker/VDatePickerMonth.js

@@ -1,15 +1,16 @@
-import { createTextVNode as _createTextVNode, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, createVNode as _createVNode } from "vue";
+import { createVNode as _createVNode, createElementVNode as _createElementVNode, createTextVNode as _createTextVNode, normalizeClass as _normalizeClass } from "vue";
 // Styles
 import "./VDatePickerMonth.css";
 
 // Components
+import { VBadge } from "../VBadge/index.js";
 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
+import { genericComponent, omit, propsFactory, useRender, wrapInArray } from "../../util/index.js"; // Types
 export const makeVDatePickerMonthProps = propsFactory({
   color: String,
   hideWeekdays: Boolean,
@@ -23,6 +24,14 @@ export const makeVDatePickerMonthProps = propsFactory({
     type: String,
     default: 'picker-reverse-transition'
   },
+  events: {
+    type: [Array, Function, Object],
+    default: () => null
+  },
+  eventColor: {
+    type: [Array, Function, Object, String],
+    default: () => null
+  },
   ...omit(makeCalendarProps(), ['displayValue'])
 }, 'VDatePickerMonth');
 export const VDatePickerMonth = genericComponent()({
@@ -122,6 +131,49 @@ export const VDatePickerMonth = genericComponent()({
         model.value = [value];
       }
     }
+    function getEventColors(date) {
+      const {
+        events,
+        eventColor
+      } = props;
+      let eventData;
+      let eventColors = [];
+      if (Array.isArray(events)) {
+        eventData = events.includes(date);
+      } else if (events instanceof Function) {
+        eventData = events(date) || false;
+      } else if (events) {
+        eventData = events[date] || false;
+      } else {
+        eventData = false;
+      }
+      if (!eventData) {
+        return [];
+      } else if (eventData !== true) {
+        eventColors = wrapInArray(eventData);
+      } else if (typeof eventColor === 'string') {
+        eventColors = [eventColor];
+      } else if (typeof eventColor === 'function') {
+        eventColors = wrapInArray(eventColor(date));
+      } else if (Array.isArray(eventColor)) {
+        eventColors = eventColor;
+      } else if (typeof eventColor === 'object' && eventColor !== null) {
+        eventColors = wrapInArray(eventColor[date]);
+      }
+
+      // Fallback to default color if no color is found
+      return !eventColors.length ? ['surface-variant'] : eventColors.filter(Boolean).map(color => typeof color === 'string' ? color : 'surface-variant');
+    }
+    function genEvents(date) {
+      const eventColors = getEventColors(date);
+      if (!eventColors.length) return null;
+      return _createElementVNode("div", {
+        "class": "v-date-picker-month__events"
+      }, [eventColors.map(color => _createVNode(VBadge, {
+        "dot": true,
+        "color": color
+      }, null))]);
+    }
     useRender(() => _createElementVNode("div", {
       "class": "v-date-picker-month",
       "style": {
@@ -152,7 +204,6 @@ export const VDatePickerMonth = genericComponent()({
             disabled: item.isDisabled,
             icon: true,
             ripple: false,
-            text: item.localized,
             variant: item.isSelected ? 'flat' : item.isToday ? 'outlined' : 'text',
             'aria-label': getDateAriaLabel(item),
             'aria-current': item.isToday ? 'date' : undefined,
@@ -173,7 +224,9 @@ export const VDatePickerMonth = genericComponent()({
             'v-date-picker-month__day--week-start': item.isWeekStart
           }]),
           "data-v-date": !item.isDisabled ? item.isoDate : undefined
-        }, [(props.showAdjacentMonths || !item.isAdjacent) && (slots.day?.(slotProps) ?? _createVNode(VBtn, slotProps.props, null))]);
+        }, [(props.showAdjacentMonths || !item.isAdjacent) && (slots.day?.(slotProps) ?? _createVNode(VBtn, slotProps.props, {
+          default: () => [item.localized, genEvents(item.isoDate)]
+        }))]);
       })])]
     })]));
   }

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

@@ -1 +1 @@
-{"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":[]}
+{"version":3,"file":"VDatePickerMonth.js","names":["VBadge","VBtn","makeCalendarProps","useCalendar","createDateRange","useDate","useLocale","MaybeTransition","computed","ref","shallowRef","toRef","watch","genericComponent","omit","propsFactory","useRender","wrapInArray","makeVDatePickerMonthProps","color","String","hideWeekdays","Boolean","multiple","Number","showWeek","transition","type","default","reverseTransition","events","Array","Function","Object","eventColor","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","getEventColors","eventData","eventColors","isArray","filter","map","genEvents","_createElementVNode","_createVNode","weekdays","_createTextVNode","week","_normalizeClass","toString","weekDay","i","slotProps","class","isSelected","disabled","isDisabled","icon","ripple","variant","isAdjacent","isHidden","isWeekEnd","isWeekStart","isoDate","showAdjacentMonths","day","localized"],"sources":["../../../src/components/VDatePicker/VDatePickerMonth.tsx"],"sourcesContent":["// Styles\nimport './VDatePickerMonth.sass'\n\n// Components\nimport { VBadge } from '@/components/VBadge'\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, wrapInArray } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport type DatePickerEventColorValue = boolean | string | string[]\n\nexport type DatePickerEventColors = DatePickerEventColorValue |\nRecord<string, DatePickerEventColorValue> | ((date: string) => DatePickerEventColorValue)\n\nexport type DatePickerEvents = string[] |\n((date: string) => DatePickerEventColorValue) | Record<string, DatePickerEventColorValue>\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  events: {\n    type: [Array, Function, Object] as PropType<DatePickerEvents | null>,\n    default: () => null,\n  },\n  eventColor: {\n    type: [Array, Function, Object, String] as PropType<DatePickerEventColors>,\n    default: () => null,\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    function getEventColors (date: string): string[] {\n      const { events, eventColor } = props\n      let eventData: boolean | DatePickerEventColorValue\n      let eventColors: (boolean | string)[] = []\n\n      if (Array.isArray(events)) {\n        eventData = events.includes(date)\n      } else if (events instanceof Function) {\n        eventData = events(date) || false\n      } else if (events) {\n        eventData = events[date] || false\n      } else {\n        eventData = false\n      }\n\n      if (!eventData) {\n        return []\n      } else if (eventData !== true) {\n        eventColors = wrapInArray(eventData)\n      } else if (typeof eventColor === 'string') {\n        eventColors = [eventColor]\n      } else if (typeof eventColor === 'function') {\n        eventColors = wrapInArray(eventColor(date))\n      } else if (Array.isArray(eventColor)) {\n        eventColors = eventColor\n      } else if (typeof eventColor === 'object' && eventColor !== null) {\n        eventColors = wrapInArray(eventColor[date])\n      }\n\n      // Fallback to default color if no color is found\n      return !eventColors.length\n        ? ['surface-variant']\n        : eventColors\n          .filter(Boolean)\n          .map((color: string | boolean) => typeof color === 'string' ? color : 'surface-variant')\n    }\n\n    function genEvents (date: string): JSX.Element | null {\n      const eventColors = getEventColors(date)\n\n      if (!eventColors.length) return null\n\n      return (\n        <div class=\"v-date-picker-month__events\">\n          { eventColors.map((color: string) => <VBadge dot color={ color } />) }\n        </div>\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                  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) ?? (\n                      <VBtn { ...slotProps.props }>\n                        { item.localized }\n                        { genEvents(item.isoDate) }\n                      </VBtn>\n                    )\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/VDatePickerMonth.sass

@@ -48,3 +48,25 @@
 
   .v-date-picker-month__day--hide-adjacent
     opacity: 0
+  .v-date-picker-month__events
+    height: $date-picker-event-size
+    left: 0
+    text-indent: 0
+    position: absolute
+    text-align: center
+    white-space: pre
+    width: 100%
+
+    > div
+      height: $date-picker-event-size
+      margin: $date-picker-event-margin
+      width: $date-picker-event-size
+      margin-bottom: -1px
+
+    .v-badge--dot .v-badge__badge
+      border-radius: $date-picker-event-border-radius
+      height: $date-picker-event-size
+      width: $date-picker-event-size
+
+  .v-date-picker-month__day .v-date-picker-month__events
+    bottom: $date-picker-event-date-bottom

package/lib/components/VDatePicker/_variables.scss

@@ -16,3 +16,8 @@ $date-picker-months-height: 288px !default;
 
 $date-picker-years-height: 288px !default;
 $date-picker-years-padding-inline: 32px !default;
+
+$date-picker-event-size: 8px !default;
+$date-picker-event-border-radius: 4px !default;
+$date-picker-event-margin: 0 1px !default;
+$date-picker-event-date-bottom: 8px !default;

package/lib/components/VOverlay/locationStrategies.js

@@ -211,7 +211,8 @@ function connectedLocationStrategy(data, props, contentStyles) {
 
     const contentBox = getIntrinsicSize(data.contentEl.value, data.isRtl.value);
     const scrollParents = getScrollParents(data.contentEl.value);
-    const viewportMargin = 12;
+    const viewportMargin = props.stickToTarget ? 0 : 12; // TOOD: prop.viewportMargin
+
     if (!scrollParents.length) {
       scrollParents.push(document.documentElement);
       if (!(data.contentEl.value.style.top && data.contentEl.value.style.left)) {
@@ -231,10 +232,17 @@ function connectedLocationStrategy(data, props, contentStyles) {
       }
       return scrollBox;
     }, undefined);
-    viewport.x += viewportMargin;
-    viewport.y += viewportMargin;
-    viewport.width -= viewportMargin * 2;
-    viewport.height -= viewportMargin * 2;
+    if (props.stickToTarget) {
+      viewport.x += Math.min(0, targetBox.x);
+      viewport.y += Math.min(0, targetBox.y);
+      viewport.width = Math.max(viewport.width, targetBox.x + targetBox.width);
+      viewport.height = Math.max(viewport.height, targetBox.y + targetBox.height);
+    } else {
+      viewport.x += viewportMargin;
+      viewport.y += viewportMargin;
+      viewport.width -= viewportMargin * 2;
+      viewport.height -= viewportMargin * 2;
+    }
     let placement = {
       anchor: preferredAnchor.value,
       origin: preferredOrigin.value
@@ -345,19 +353,19 @@ function connectedLocationStrategy(data, props, contentStyles) {
 
       // shift
       if (overflows.x.before) {
-        if (!props.stickToTarget) x += overflows.x.before;
+        x += overflows.x.before;
         contentBox.x += overflows.x.before;
       }
       if (overflows.x.after) {
-        if (!props.stickToTarget) x -= overflows.x.after;
+        x -= overflows.x.after;
         contentBox.x -= overflows.x.after;
       }
       if (overflows.y.before) {
-        if (!props.stickToTarget) y += overflows.y.before;
+        y += overflows.y.before;
         contentBox.y += overflows.y.before;
       }
       if (overflows.y.after) {
-        if (!props.stickToTarget) y -= overflows.y.after;
+        y -= overflows.y.after;
         contentBox.y -= overflows.y.after;
       }
 
@@ -366,9 +374,9 @@ function connectedLocationStrategy(data, props, contentStyles) {
         const overflows = getOverflow(contentBox, viewport);
         available.x = viewport.width - overflows.x.before - overflows.x.after;
         available.y = viewport.height - overflows.y.before - overflows.y.after;
-        if (!props.stickToTarget) x += overflows.x.before;
+        x += overflows.x.before;
         contentBox.x += overflows.x.before;
-        if (!props.stickToTarget) y += overflows.y.before;
+        y += overflows.y.before;
         contentBox.y += overflows.y.before;
       }
       break;