Breaking Changes in 10.0.0
The Kendo UI for Vue 10.0.0 release redesigns the layout and flows of the Scheduler create and edit form. No public properties, events, or exports are removed or renamed, so the migration requires reviewing your code rather than updating API names.
Scheduler
-
MonthView—The more button of a slot with hidden events no longer switches the Scheduler to the Day view. It opens the newMoreEventsPopover(the.k-scheduler-popoverelement) with the events of the slot, and the click target ofShowMoreItemsButtonis now{ element, slot }.- Before: Clicking the
k-more-eventsbutton switched the Scheduler to the Day view. - After: Clicking the button opens the popover.
- To migrate, review the handlers of the
showmoreitemsevent (@showmoreitems,@show-more-items, oronShowmoreitems), the customShowMoreItemsButtonusage, and the tests that expect the Day view after the click. Style the new.k-scheduler-popoverelement if needed. For more information, see Month View.
- Before: Clicking the
-
SchedulerForm—The dialog title now comes from thescheduler.editorNewEventandscheduler.editorEditEventmessages. Thescheduler.editorTitlemessage is no longer used.- Before: The dialog title was provided by the
scheduler.editorTitlemessage. - After: The title of a new event comes from
scheduler.editorNewEvent, and the title of an existing event comes fromscheduler.editorEditEvent. - To migrate, replace
scheduler.editorTitlein your localization messages withscheduler.editorNewEventandscheduler.editorEditEvent. Thescheduler-editor-title-messagecodemod does this automatically and keeps your customized text. For more information, see Scheduler Globalization.
- Before: The dialog title was provided by the
-
SchedulerForm—The footer buttons have a new alignment and order, and the Delete button is now part of the form.- Before: The
k-form-buttonsin the footer were aligned to the start. - After: The
k-form-buttonsare aligned to the end, in the order Delete (rendered for existing events only), Cancel, Save. - To migrate, update the CSS selectors and the tests that depend on the old footer alignment and button order. For more information, see
SchedulerFormPropsandSchedulerActionButtonsProps.
- Before: The
-
SchedulerFormEditor—The defaultstartEditorandendEditorare nowZonedSplitDateTime, and custom editors receive extra props.- Before: Custom
startEditorandendEditorcomponents did not receive the new props. - After: Custom
startEditorandendEditorcomponents also receive theisAllDay,connector,fieldError,ariaLabel,timeAriaLabel, andtimezoneprops. - To migrate, make your custom
startEditorandendEditorcomponents compatible with the new props, or remove the custom components to use the new defaults. For more information, see Custom Edit Forms andSchedulerFormEditorProps.
- Before: Custom
-
SchedulerFormEditor—TherecurrenceEditornow renders inside the newSchedulerRecurrenceDialogcomponent.- Before: The
recurrenceEditorwas rendered directly in the form. - After: The
recurrenceEditoris rendered inSchedulerRecurrenceDialog.SchedulerFormEditoradds therecurrenceButtonTextTemplateandrecurrenceSummaryTemplateprops, and forwards therecurrenceSummaryTemplateto the dialog. - To migrate, make your custom
recurrenceEditorcomponents work inside the dialog, and set the new templates onSchedulerFormEditorto customize the recurrence button text and the recurrence summary. For more information, seeRecurrenceButtonTextTemplatePropsandRecurrenceSummaryTemplateProps.
- Before: The
-
SchedulerItem—The events no longer render the delete icon. This applies toSchedulerItem,SchedulerEditItem,SchedulerViewItem, andSchedulerProportionalViewItem.- Before: Each event rendered a
span.k-event-actions > a.k-link.k-event-deleteelement, and clicking it emittedremoveclick. - After: The element is not rendered. The
removeclickevent and theonRemoveClickprop still exist, but the item UI does not fire them. An event is deleted from the edit form through the Delete button ofSchedulerActionButtons, which triggers theonDeleteevent ofSchedulerForm. - To migrate, remove the CSS rules, test queries, and simulated clicks that target
.k-event-deleteand.k-event-actionson events, and move any custom delete flow that relies onremoveclickto theonDeleteevent of the form. For more information, see Scheduler Editing andSchedulerItemProps.
The task components (
SchedulerTask,SchedulerEditTask, andSchedulerViewTask) are not affected and still renderk-event-delete. - Before: Each event rendered a
-
The default
selectedDateFormatandselectedShortDateFormatof the Scheduler views have changed. Views that set the formats explicitly are not affected.View Property Before After DayView,TimelineViewselectedDateFormat'{0:D}''{0:M}'DayView,TimelineViewselectedShortDateFormat'{0:d}''{0:m}'AgendaView,WeekView,WorkWeekViewselectedDateFormat'{0:D} - {1:D}''{0:M} - {1:M}'AgendaView,WeekView,WorkWeekViewselectedShortDateFormat'{0:d} - {1:d}''{0:m} - {1:m}'MultiDayTimelineViewselectedDateFormat'{0:D} - {1:D}''{0:M}'MultiDayTimelineViewselectedShortDateFormat'{0:d} - {1:d}''{0:m}'MonthViewselectedShortDateFormat'{0:Y}''{0:y}'To keep the previous text, set
selectedDateFormatandselectedShortDateFormatexplicitly to the old values. Otherwise, update the tests, screenshots, and localized texts that assert the selected date label. For more information, see Scheduler Views.
For the changes in the generated markup and the CSS classes, see Rendering Changes in 10.0.0.