# 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 new `MoreEventsPopover` (the `.k-scheduler-popover` element) with the events of the slot, and the click target of `ShowMoreItemsButton` is now `{ element, slot }`.

  * Before: Clicking the `k-more-events` button switched the Scheduler to the Day view.
  * After: Clicking the button opens the popover.
  * To migrate, review the handlers of the `showmoreitems` event (`@showmoreitems`, `@show-more-items`, or `onShowmoreitems`), the custom `ShowMoreItemsButton` usage, and the tests that expect the Day view after the click. Style the new `.k-scheduler-popover` element if needed. For more information, see [Month View](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/views/month).

* `SchedulerForm`—The dialog title now comes from the `scheduler.editorNewEvent` and `scheduler.editorEditEvent` messages. The `scheduler.editorTitle` message is no longer used.

  * Before: The dialog title was provided by the `scheduler.editorTitle` message.
  * After: The title of a new event comes from `scheduler.editorNewEvent`, and the title of an existing event comes from `scheduler.editorEditEvent`.
  * To migrate, replace `scheduler.editorTitle` in your localization messages with `scheduler.editorNewEvent` and `scheduler.editorEditEvent`. The `scheduler-editor-title-message` codemod does this automatically and keeps your customized text. For more information, see [Scheduler Globalization](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/globalization).

* `SchedulerForm`—The footer buttons have a new alignment and order, and the **Delete** button is now part of the form.

  * Before: The `k-form-buttons` in the footer were aligned to the start.
  * After: The `k-form-buttons` are 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 [`SchedulerFormProps`](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/schedulerformprops) and [`SchedulerActionButtonsProps`](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/scheduleractionbuttonsprops).

* `SchedulerFormEditor`—The default `startEditor` and `endEditor` are now `ZonedSplitDateTime`, and custom editors receive extra props.

  * Before: Custom `startEditor` and `endEditor` components did not receive the new props.
  * After: Custom `startEditor` and `endEditor` components also receive the `isAllDay`, `connector`, `fieldError`, `ariaLabel`, `timeAriaLabel`, and `timezone` props.
  * To migrate, make your custom `startEditor` and `endEditor` components compatible with the new props, or remove the custom components to use the new defaults. For more information, see [Custom Edit Forms](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/editing/custom-form) and [`SchedulerFormEditorProps`](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/schedulerformeditorprops).

* `SchedulerFormEditor`—The `recurrenceEditor` now renders inside the new `SchedulerRecurrenceDialog` component.

  * Before: The `recurrenceEditor` was rendered directly in the form.
  * After: The `recurrenceEditor` is rendered in `SchedulerRecurrenceDialog`. `SchedulerFormEditor` adds the `recurrenceButtonTextTemplate` and `recurrenceSummaryTemplate` props, and forwards the `recurrenceSummaryTemplate` to the dialog.
  * To migrate, make your custom `recurrenceEditor` components work inside the dialog, and set the new templates on `SchedulerFormEditor` to customize the recurrence button text and the recurrence summary. For more information, see [`RecurrenceButtonTextTemplateProps`](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/recurrencebuttontexttemplateprops) and [`RecurrenceSummaryTemplateProps`](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/recurrencesummarytemplateprops).

* `SchedulerItem`—The events no longer render the delete icon. This applies to `SchedulerItem`, `SchedulerEditItem`, `SchedulerViewItem`, and `SchedulerProportionalViewItem`.

  * Before: Each event rendered a `span.k-event-actions > a.k-link.k-event-delete` element, and clicking it emitted `removeclick`.
  * After: The element is not rendered. The `removeclick` event and the `onRemoveClick` prop still exist, but the item UI does not fire them. An event is deleted from the edit form through the **Delete** button of `SchedulerActionButtons`, which triggers the `onDelete` event of `SchedulerForm`.
  * To migrate, remove the CSS rules, test queries, and simulated clicks that target `.k-event-delete` and `.k-event-actions` on events, and move any custom delete flow that relies on `removeclick` to the `onDelete` event of the form. For more information, see [Scheduler Editing](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/editing) and [`SchedulerItemProps`](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/api/scheduleritemprops).

  > The task components (`SchedulerTask`, `SchedulerEditTask`, and `SchedulerViewTask`) are not affected and still render `k-event-delete`.

* The default `selectedDateFormat` and `selectedShortDateFormat` of the Scheduler views have changed. Views that set the formats explicitly are not affected.

  | View                                     | Property                  | Before            | After             |
  | ---------------------------------------- | ------------------------- | ----------------- | ----------------- |
  | `DayView`, `TimelineView`                | `selectedDateFormat`      | `'{0:D}'`         | `'{0:M}'`         |
  | `DayView`, `TimelineView`                | `selectedShortDateFormat` | `'{0:d}'`         | `'{0:m}'`         |
  | `AgendaView`, `WeekView`, `WorkWeekView` | `selectedDateFormat`      | `'{0:D} - {1:D}'` | `'{0:M} - {1:M}'` |
  | `AgendaView`, `WeekView`, `WorkWeekView` | `selectedShortDateFormat` | `'{0:d} - {1:d}'` | `'{0:m} - {1:m}'` |
  | `MultiDayTimelineView`                   | `selectedDateFormat`      | `'{0:D} - {1:D}'` | `'{0:M}'`         |
  | `MultiDayTimelineView`                   | `selectedShortDateFormat` | `'{0:d} - {1:d}'` | `'{0:m}'`         |
  | `MonthView`                              | `selectedShortDateFormat` | `'{0:Y}'`         | `'{0:y}'`         |

  To keep the previous text, set `selectedDateFormat` and `selectedShortDateFormat` explicitly to the old values. Otherwise, update the tests, screenshots, and localized texts that assert the selected date label. For more information, see [Scheduler Views](https://www.telerik.com/kendo-vue-ui-develop/components/scheduler/views).

For the changes in the generated markup and the CSS classes, see [Rendering Changes in 10.0.0](https://www.telerik.com/kendo-vue-ui-develop/components/updates/rendering-changes/10-0-0).
