Skip to content

Commit d743051

Browse files
jetze-meilinkjetze-meilink
authored
fix(VCalendar): Slot day-event not available (#21558)
fixes #21341
1 parent 2e55ed3 commit d743051

File tree

5 files changed

+25
-25
lines changed

5 files changed

+25
-25
lines changed

‎packages/vuetify/src/labs/VCalendar/VCalendar.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -206,7 +206,7 @@ export const VCalendar = genericComponent<VCalendarSlots>()({
206206
events={ props.events?.filter(e => adapter.isSameDay(e.start, day.date) || adapter.isSameDay(e.end, day.date)) }
207207
{ ...attrs }
208208
>
209-
{{ ...pick(slots, ['interval', 'intervalBody', 'intervalEvent', 'intervalTitle']) }}
209+
{{ ...pick(slots, ['interval', 'interval-body', 'interval-event', 'interval-title']) }}
210210
</VCalendarDay>
211211
)
212212
))

‎packages/vuetify/src/labs/VCalendar/VCalendarDay.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ export const VCalendarDay = genericComponent<VCalendarDaySlots>()({
7676
{ ...getPrefixedEventHandlers(attrs, ':interval', () => calendarIntervalProps) }
7777
>
7878
{{
79-
...pick(slots, ['intervalBody', 'intervalEvent', 'intervalTitle']),
79+
...pick(slots, ['interval-body', 'interval-event', 'interval-title']),
8080
}}
8181
</VCalendarInterval>
8282
)

‎packages/vuetify/src/labs/VCalendar/VCalendarInterval.tsx

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,15 @@ type Interval = {
1919
}
2020

2121
export type VCalendarIntervalSlots = {
22-
intervalBody: { interval: Interval }
23-
intervalEvent: {
22+
'interval-body': { interval: Interval }
23+
'interval-event': {
2424
height: string
2525
margin: string
2626
eventClass: string
2727
event: any
2828
interval: Interval
2929
}
30-
intervalTitle: { interval: Interval }
30+
'interval-title': { interval: Interval }
3131
}
3232

3333
export const makeVCalendarIntervalProps = propsFactory({
@@ -114,7 +114,7 @@ export const VCalendarInterval = genericComponent<VCalendarIntervalSlots>()({
114114
{ ...getPrefixedEventHandlers(attrs, ':time', () => props) }
115115
>
116116
{
117-
slots.intervalTitle?.({ interval: interval.value }) ?? (
117+
slots['interval-title']?.({ interval: interval.value }) ?? (
118118
props.index
119119
? props.intervalFormat
120120
? typeof props.intervalFormat === 'string'
@@ -133,7 +133,7 @@ export const VCalendarInterval = genericComponent<VCalendarIntervalSlots>()({
133133
{ ...getPrefixedEventHandlers(attrs, ':interval', () => interval.value) }
134134
>
135135
{
136-
slots.intervalBody?.({ interval: interval.value }) ?? (
136+
slots['interval-body']?.({ interval: interval.value }) ?? (
137137
<div>
138138
{
139139
interval.value.events?.map(event => (
@@ -146,9 +146,9 @@ export const VCalendarInterval = genericComponent<VCalendarIntervalSlots>()({
146146
{ ...attrs }
147147
>
148148
{{
149-
...(slots.intervalEvent ? {
150-
intervalEvent: ({ height, margin, eventClass, event, interval }) => (
151-
slots.intervalEvent?.({ height, margin, eventClass, event, interval })
149+
...(slots['interval-event'] ? {
150+
'interval-event': ({ height, margin, eventClass, event, interval }) => (
151+
slots['interval-event']?.({ height, margin, eventClass, event, interval })
152152
),
153153
} : {}),
154154
}}
@@ -171,7 +171,7 @@ export const VCalendarInterval = genericComponent<VCalendarIntervalSlots>()({
171171
{ ...getPrefixedEventHandlers(attrs, ':interval', () => interval.value) }
172172
>
173173
{
174-
slots.intervalBody?.({ interval: interval.value }) ?? (
174+
slots['interval-body']?.({ interval: interval.value }) ?? (
175175
interval.value.events?.map(event => (
176176
<VCalendarIntervalEvent
177177
event={ event }
@@ -182,9 +182,9 @@ export const VCalendarInterval = genericComponent<VCalendarIntervalSlots>()({
182182
{ ...attrs }
183183
>
184184
{{
185-
...(slots.intervalEvent ? {
186-
intervalEvent: ({ height, margin, eventClass, event, interval }) => (
187-
slots.intervalEvent?.({ height, margin, eventClass, event, interval })
185+
...(slots['interval-event'] ? {
186+
'interval-event': ({ height, margin, eventClass, event, interval }) => (
187+
slots['interval-event']?.({ height, margin, eventClass, event, interval })
188188
),
189189
} : {}),
190190
}}

‎packages/vuetify/src/labs/VCalendar/VCalendarIntervalEvent.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import { useDate } from '@/composables/date'
1111
import { convertToUnit, genericComponent, getPrefixedEventHandlers, propsFactory, useRender } from '@/util'
1212

1313
export type VCalendarIntervalEventSlots = {
14-
intervalEvent: { height: string, margin: string, eventClass: string, event: any, interval: any }
14+
'interval-event': { height: string, margin: string, eventClass: string, event: any, interval: any }
1515
}
1616

1717
export const makeVCalendarIntervalEventProps = propsFactory({
@@ -65,7 +65,7 @@ export const VCalendarIntervalEvent = genericComponent<VCalendarIntervalEventSlo
6565
return (
6666
<div>
6767
{
68-
slots.intervalEvent?.({
68+
slots['interval-event']?.({
6969
height: calcHeight().height,
7070
margin: calcHeight().margin,
7171
eventClass: 'v-calendar-internal-event',

‎packages/vuetify/src/labs/VCalendar/VCalendarMonthDay.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,9 @@ import type { PropType } from 'vue'
1313
import type { CalendarDay } from '@/composables/calendar'
1414

1515
export type VCalendarMonthDaySlots = {
16-
dayBody: { day?: CalendarDay, events?: Array<any> }
17-
dayEvent: { day?: CalendarDay, allDay: boolean, event: Record<string, unknown> }
18-
dayTitle: { title?: number | string }
16+
'day-body': { day?: CalendarDay, events?: Array<any> }
17+
'day-event': { day?: CalendarDay, allDay: boolean, event: Record<string, unknown> }
18+
'day-title': { title?: number | string }
1919
}
2020

2121
export const makeVCalendarMonthDayProps = propsFactory({
@@ -47,7 +47,7 @@ export const VCalendarMonthDay = genericComponent<VCalendarMonthDaySlots>()({
4747
>
4848
{ !props.day?.isHidden ? (
4949
<div key="title" class="v-calendar-weekly__day-label">
50-
{ slots.dayTitle?.({ title: props.title }) ?? (
50+
{ slots['day-title']?.({ title: props.title }) ?? (
5151
<VBtn
5252
class={ props.day?.isToday ? 'v-calendar-weekly__day-label__today' : undefined }
5353
color={ props.color }
@@ -65,19 +65,19 @@ export const VCalendarMonthDay = genericComponent<VCalendarMonthDaySlots>()({
6565

6666
{ !props.day?.isHidden ? (
6767
<div key="content" class="v-calendar-weekly__day-content" >
68-
{ slots.dayBody?.({ day: props.day, events: props.events }) ?? (
68+
{ slots['day-body']?.({ day: props.day, events: props.events }) ?? (
6969
<div>
7070
<div class="v-calendar-weekly__day-alldayevents-container">
71-
{ props.events?.filter(event => event.allDay).map(event => slots.dayEvent
72-
? slots.dayEvent({ day: props.day, allDay: true, event })
71+
{ props.events?.filter(event => event.allDay).map(event => slots['day-event']
72+
? slots['day-event']({ day: props.day, allDay: true, event })
7373
: (
7474
<VCalendarEvent day={ props.day } event={ event } allDay { ...attrs } />
7575
))}
7676
</div>
7777

7878
<div class="v-calendar-weekly__day-events-container">
79-
{ props.events?.filter(event => !event.allDay).map(event => slots.dayEvent
80-
? slots.dayEvent({ day: props.day, event, allDay: false })
79+
{ props.events?.filter(event => !event.allDay).map(event => slots['day-event']
80+
? slots['day-event']({ day: props.day, event, allDay: false })
8181
: (
8282
<VCalendarEvent day={ props.day } event={ event } { ...attrs } />
8383
))}

0 commit comments

Comments
 (0)