@progress/kendo-angular-scheduler 2.2.0-dev.202112171600 → 3.0.1

package/dist/fesm5/index.js

@@ -21,7 +21,7 @@ import { PopupService, PopupModule } from '@progress/kendo-angular-popup';
 import { orderBy, groupBy } from '@progress/kendo-data-query';
 import Draggable from '@telerik/kendo-draggable';
 import { MultiSelectComponent, DropDownListComponent, ComboBoxComponent, DropDownsModule } from '@progress/kendo-angular-dropdowns';
-import { NumericTextBoxModule, TextBoxModule } from '@progress/kendo-angular-inputs';
+import { CheckBoxModule, TextAreaModule, NumericTextBoxModule, TextBoxModule } from '@progress/kendo-angular-inputs';
 import { drawDOM, exportPDF } from '@progress/kendo-drawing';
 import { saveAs } from '@progress/kendo-file-saver';
 
@@ -32,7 +32,7 @@ var packageMetadata = {
     name: '@progress/kendo-angular-scheduler',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1639756470,
+    publishDate: 1644230710,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };
@@ -2125,17 +2125,17 @@ function assignTasksResources(tasks, options) {
 /**
  * @hidden
  */
-function areValidResources(resources) {
-    return Array.isArray(resources) && resources.length > 0 && resources[0] !== undefined;
+function isEmptyResource(resources) {
+    return Array.isArray(resources) && resources.length === 1 && resources[0] === undefined;
 }
 /**
  * @hidden
  */
-function resourcesMatch(res1, res2, strict) {
+function resourcesMatch(res1, res2) {
     if (res1.length !== res2.length) {
         return false;
     }
-    if (!strict && !areValidResources(res1) || !areValidResources(res2)) {
+    if (isEmptyResource(res1) && isEmptyResource(res2)) {
         return true;
     }
     return res1.every(function (r1) { return res2.some(function (r2) { return r2.value === r1.value; }); });
@@ -2147,7 +2147,7 @@ function isSameRange(range1, range2) {
     return (range1.start.getTime() === range2.start.getTime() &&
         range1.end.getTime() === range2.end.getTime() &&
         range1.isAllDay === range2.isAllDay &&
-        resourcesMatch(range1.resources, range2.resources, true));
+        resourcesMatch(range1.resources, range2.resources));
 }
 /** @hidden */
 function findRowIndex(events, data) {
@@ -4353,7 +4353,7 @@ var ToolbarViewSelectorComponent = /** @class */ (function () {
         Component({
             // tslint:disable-next-line:component-selector
             selector: '[kendoSchedulerToolbarViewSelector]',
-            template: "\n        <select *ngIf=\"ctx.views?.length > 1\"\n                (change)=\"onChange($event)\"\n                class=\"k-views-dropdown k-dropdown\">\n            <option *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view) == true\"\n                [value]=\"view.name\"\n            >\n                {{ view.title }}\n            </option>\n        </select>\n        <span class=\"k-scheduler-views k-button-group\">\n            <button kendoButton\n                type=\"button\"\n                *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view)\"\n                [attr.aria-pressed]=\"isSelected(view)\"\n                (click)=\"select(view)\"\n            >\n                <span class=\"k-button-text\">\n                    {{ view.title }}\n                </span>\n            </button>\n        </span>\n    "
+            template: "\n        <select *ngIf=\"ctx.views?.length > 1\"\n                (change)=\"onChange($event)\"\n                class=\"k-views-dropdown k-picker-md k-rounded-md k-picker-solid k-dropdownlist k-picker\">\n            <option *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view) == true\"\n                [value]=\"view.name\"\n            >\n                {{ view.title }}\n            </option>\n        </select>\n        <span class=\"k-scheduler-views k-button-group\">\n            <button kendoButton\n                type=\"button\"\n                *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view)\"\n                [attr.aria-pressed]=\"isSelected(view)\"\n                (click)=\"select(view)\"\n            >\n                <span class=\"k-button-text\">\n                    {{ view.title }}\n                </span>\n            </button>\n        </span>\n    "
         }),
         __metadata("design:paramtypes", [ToolbarService])
     ], ToolbarViewSelectorComponent);
@@ -6690,7 +6690,8 @@ var BaseView = /** @class */ (function () {
                 this.pressTarget = task;
             }
         }
-        if (this.selectable) {
+        var notDraggingEvent = !this.pressTarget;
+        if (notDraggingEvent && this.selectable) {
             this.initDragSelect(args);
         }
         this.dragArgs = args;
@@ -7864,7 +7865,7 @@ var ViewFooterComponent = /** @class */ (function () {
         Component({
             // tslint:disable-next-line:component-selector
             selector: '[viewFooter]',
-            template: "\n        <button type=\"button\" class=\"k-button\" *ngFor=\"let item of items\" [ngClass]=\"item.cssClass\" (click)=\"onItemClick($event, item)\">\n            <span class=\"k-button-icon k-icon\" [ngClass]=\"item.iconClass\"></span>\n            <span class=\"k-button-text\">{{ item.text }}</span>\n        </button>\n    "
+            template: "\n        <button type=\"button\" kendoButton *ngFor=\"let item of items\" [ngClass]=\"item.cssClass\" (click)=\"onItemClick($event, item)\">\n            <span class=\"k-button-icon k-icon\" [ngClass]=\"item.iconClass\"></span>\n            <span class=\"k-button-text\">{{ item.text }}</span>\n        </button>\n    "
         })
     ], ViewFooterComponent);
     return ViewFooterComponent;
@@ -8116,7 +8117,7 @@ var ViewsSharedModule = /** @class */ (function () {
     }
     ViewsSharedModule = __decorate([
         NgModule({
-            imports: [CommonModule, IntlModule, SharedModule],
+            imports: [CommonModule, IntlModule, SharedModule, ButtonsModule],
             exports: [
                 DECLARATIONS,
                 IntlModule,
@@ -11882,7 +11883,7 @@ var EditDialogComponent = /** @class */ (function () {
     EditDialogComponent = __decorate([
         Component({
             selector: 'kendo-scheduler-edit-dialog',
-            template: "\n        <kendo-dialog (close)='onClose()' [minWidth]='700' *ngIf='isActive' title='{{ textFor(\"editorTitle\") }}' class='k-scheduler-edit-dialog' [autoFocusedElement]=\"autoFocusedElement\">\n            <ng-container *ngIf='!editTemplate'>\n                <div class='k-scheduler-edit-form'>\n                    <div class='k-edit-form-container'>\n                        <form novalidate [formGroup]='formGroup'>\n                            <div class='k-edit-label'>\n                                <label for='k-event-title'>{{ textFor('editorEventTitle') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <input #title id='k-event-title' class='k-textbox' placeholder='Title' [formControl]='formGroup.get(fields.title)' />\n                            </div>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"startDateTimePicker.focus()\">{{ textFor('editorEventStart') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #startDateTimePicker [formControl]='formGroup.get(fields.start)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isStartTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"startTzPicker.focus()\">{{ textFor('editorEventStartTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #startTzPicker [formControl]='formGroup.get(fields.startTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"endDateTimePicker.focus()\">{{ textFor('editorEventEnd') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #endDateTimePicker [formControl]='formGroup.get(fields.end)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isEndTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"endTzPicker.focus()\">{{ textFor('editorEventEndTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #endTzPicker [formControl]='formGroup.get(fields.endTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-field' *ngIf=\"hasAllDay\">\n                                <input type='checkbox' id='k-is-allday-chkbox' class='k-checkbox' [formControl]='formGroup.get(fields.isAllDay)' />\n                                <label class='k-checkbox-label' for='k-is-allday-chkbox'>{{ textFor('editorEventAllDay') }}</label>\n                            </div>\n\n                            <div class='k-edit-field' *ngIf=\"hasStartTimeZone\">\n                                <input type='checkbox' id='k-set-timezone' class='k-checkbox'\n                                formControlName='startTimezoneCheckbox' />\n                                <label class='k-checkbox-label' for='k-set-timezone'>{{ textFor('editorEventTimeZone') }}</label>\n\n                                <ng-container *ngIf=\"isStartTimeZoneVisible && hasEndTimeZone\">\n                                    <input type='checkbox' id='k-use-separate' class='k-checkbox' formControlName='endTimezoneCheckbox' />\n                                    <label class='k-checkbox-label' for='k-use-separate'>{{ textFor('editorEventSeparateTimeZones') }}</label>\n                                </ng-container>\n                            </div>\n\n                            <ng-container *ngIf=\"isEditingSeries\">\n                                <kendo-recurrence-editor\n                                    [formControl]='formGroup.get(fields.recurrenceRule)'\n                                    [start]='recurrenceStart'\n                                    [timezone]='eventTimezone'\n                                    [weekStart]='weekStart'\n                                ></kendo-recurrence-editor>\n                            </ng-container>\n\n                            <ng-container *ngIf='getFormValue(fields.description)'>\n                                <div class='k-edit-label'>\n                                    <label for='k-event-description'>{{ textFor('editorEventDescription') }}</label>\n                                </div>\n                                <div class='k-edit-field'>\n                                    <textarea id='k-event-description' class='k-textbox' [formControl]='formGroup.get(fields.description)'></textarea>\n                                </div>\n                            </ng-container>\n\n                            <ng-container *ngFor='let resource of resources'>\n                                <ng-container *ngIf='getFormValue(resource.field)'>\n                                    <div class='k-edit-label'>\n                                        <label (click)=\"onResourceClick(resource)\">\n                                            {{ resource.name ? resource.name : resource.field }}\n                                        </label>\n                                    </div>\n                                    <div class='k-edit-field'>\n                                        <kendo-multiple-resource-editor\n                                            *ngIf='resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-multiple-resource-editor>\n                                        <kendo-single-resource-editor\n                                            *ngIf='!resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-single-resource-editor>\n                                    </div>\n                                </ng-container>\n                            </ng-container>\n                        </form>\n                    </div>\n                </div>\n            </ng-container>\n\n            <ng-container *ngIf='editTemplate'>\n                <form novalidate [formGroup]='formGroup'>\n                    <ng-container [ngTemplateOutlet]='editTemplate.templateRef'\n                        [ngTemplateOutletContext]=\"{\n                            $implicit: formGroup,\n                            formGroup: formGroup,\n                            dataItem: editedEvent,\n                            editMode: editMode,\n                            isNew: isNew\n                        }\">\n                    </ng-container>\n                </form>\n            </ng-container>\n\n            <kendo-dialog-actions>\n                <button class=\"k-button\" (click)=\"onCancel($event)\">{{ textFor('cancel') }}</button>\n                <button class=\"k-button k-primary\" (click)=\"onSave($event)\" [disabled]=\"!formGroup.valid\">{{ textFor('save') }}</button>\n            </kendo-dialog-actions>\n        </kendo-dialog>\n    "
+            template: "\n        <kendo-dialog (close)='onClose()' [minWidth]='700' *ngIf='isActive' title='{{ textFor(\"editorTitle\") }}' class='k-scheduler-edit-dialog' [autoFocusedElement]=\"autoFocusedElement\">\n            <ng-container *ngIf='!editTemplate'>\n                <div class='k-scheduler-edit-form'>\n                    <div class='k-edit-form-container'>\n                        <form novalidate [formGroup]='formGroup'>\n                            <div class='k-edit-label'>\n                                <label for='k-event-title'>{{ textFor('editorEventTitle') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <input #title id='k-event-title' kendoTextBox placeholder='Title' [formControl]='formGroup.get(fields.title)' />\n                            </div>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"startDateTimePicker.focus()\">{{ textFor('editorEventStart') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #startDateTimePicker [formControl]='formGroup.get(fields.start)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isStartTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"startTzPicker.focus()\">{{ textFor('editorEventStartTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #startTzPicker [formControl]='formGroup.get(fields.startTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"endDateTimePicker.focus()\">{{ textFor('editorEventEnd') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #endDateTimePicker [formControl]='formGroup.get(fields.end)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isEndTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"endTzPicker.focus()\">{{ textFor('editorEventEndTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #endTzPicker [formControl]='formGroup.get(fields.endTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-field' *ngIf=\"hasAllDay\">\n                                <input type='checkbox' id='k-is-allday-chkbox' kendoCheckBox [formControl]='formGroup.get(fields.isAllDay)' />\n                                <label class='k-checkbox-label' for='k-is-allday-chkbox'>{{ textFor('editorEventAllDay') }}</label>\n                            </div>\n\n                            <div class='k-edit-field' *ngIf=\"hasStartTimeZone\">\n                                <input type='checkbox' id='k-set-timezone' kendoCheckBox\n                                formControlName='startTimezoneCheckbox' />\n                                <label class='k-checkbox-label' for='k-set-timezone'>{{ textFor('editorEventTimeZone') }}</label>\n\n                                <ng-container *ngIf=\"isStartTimeZoneVisible && hasEndTimeZone\">\n                                    <input type='checkbox' id='k-use-separate' kendoCheckBox formControlName='endTimezoneCheckbox' />\n                                    <label class='k-checkbox-label' for='k-use-separate'>{{ textFor('editorEventSeparateTimeZones') }}</label>\n                                </ng-container>\n                            </div>\n\n                            <ng-container *ngIf=\"isEditingSeries\">\n                                <kendo-recurrence-editor\n                                    [formControl]='formGroup.get(fields.recurrenceRule)'\n                                    [start]='recurrenceStart'\n                                    [timezone]='eventTimezone'\n                                    [weekStart]='weekStart'\n                                ></kendo-recurrence-editor>\n                            </ng-container>\n\n                            <ng-container *ngIf='getFormValue(fields.description)'>\n                                <div class='k-edit-label'>\n                                    <label for='k-event-description'>{{ textFor('editorEventDescription') }}</label>\n                                </div>\n                                <div class='k-edit-field'>\n                                    <textarea id='k-event-description' kendoTextArea [formControl]='formGroup.get(fields.description)'></textarea>\n                                </div>\n                            </ng-container>\n\n                            <ng-container *ngFor='let resource of resources'>\n                                <ng-container *ngIf='getFormValue(resource.field)'>\n                                    <div class='k-edit-label'>\n                                        <label (click)=\"onResourceClick(resource)\">\n                                            {{ resource.name ? resource.name : resource.field }}\n                                        </label>\n                                    </div>\n                                    <div class='k-edit-field'>\n                                        <kendo-multiple-resource-editor\n                                            *ngIf='resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-multiple-resource-editor>\n                                        <kendo-single-resource-editor\n                                            *ngIf='!resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-single-resource-editor>\n                                    </div>\n                                </ng-container>\n                            </ng-container>\n                        </form>\n                    </div>\n                </div>\n            </ng-container>\n\n            <ng-container *ngIf='editTemplate'>\n                <form novalidate [formGroup]='formGroup'>\n                    <ng-container [ngTemplateOutlet]='editTemplate.templateRef'\n                        [ngTemplateOutletContext]=\"{\n                            $implicit: formGroup,\n                            formGroup: formGroup,\n                            dataItem: editedEvent,\n                            editMode: editMode,\n                            isNew: isNew\n                        }\">\n                    </ng-container>\n                </form>\n            </ng-container>\n\n            <kendo-dialog-actions>\n                <button kendoButton (click)=\"onCancel($event)\">{{ textFor('cancel') }}</button>\n                <button kendoButton themeColor=\"primary\" (click)=\"onSave($event)\" [disabled]=\"!formGroup.valid\">{{ textFor('save') }}</button>\n            </kendo-dialog-actions>\n        </kendo-dialog>\n    "
         }),
         __metadata("design:paramtypes", [NgZone,
             EditService,
@@ -11958,7 +11959,8 @@ var SchedulerDateTimePickerComponent = /** @class */ (function () {
                 SCHEDULER_DATETIMEPICKER_VALUE_ACCESSOR
             ],
             selector: 'kendo-scheduler-datetime-picker',
-            template: "\n    <kendo-datepicker\n        #datepicker\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-datepicker>\n    <kendo-timepicker *ngIf='!isAllDay'\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-timepicker>\n    "
+            template: "\n    <kendo-datepicker\n        #datepicker\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-datepicker>\n    <kendo-timepicker *ngIf='!isAllDay'\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-timepicker>\n    ",
+            styles: ["\n        kendo-datepicker,\n        kendo-timepicker {\n            width: 170px;\n        }\n    "]
         })
     ], SchedulerDateTimePickerComponent);
     return SchedulerDateTimePickerComponent;
@@ -12499,6 +12501,7 @@ var EndRuleRadioButtonDirective = /** @class */ (function () {
         this.changeDetector = changeDetector;
         this.type = 'radio';
         this.radioClass = true;
+        this.radioSizeClass = true;
         this.destroyChange = this.renderer.listen(this.elem, 'change', this.onChange.bind(this));
     }
     EndRuleRadioButtonDirective.prototype.ngOnInit = function () {
@@ -12539,6 +12542,10 @@ var EndRuleRadioButtonDirective = /** @class */ (function () {
         HostBinding('class.k-radio'),
         __metadata("design:type", Boolean)
     ], EndRuleRadioButtonDirective.prototype, "radioClass", void 0);
+    __decorate([
+        HostBinding('class.k-radio-md'),
+        __metadata("design:type", Boolean)
+    ], EndRuleRadioButtonDirective.prototype, "radioSizeClass", void 0);
     __decorate([
         Input("kendoRecurrenceEndRuleRadioButton"),
         __metadata("design:type", String)
@@ -12805,6 +12812,7 @@ var RepeatOnRadioButtonDirective = /** @class */ (function () {
         this.changeDetector = changeDetector;
         this.type = 'radio';
         this.radioClass = true;
+        this.radioSizeClass = true;
         this.destroyChange = this.renderer.listen(this.elem, 'change', this.onChange.bind(this));
     }
     Object.defineProperty(RepeatOnRadioButtonDirective.prototype, "repeatOnRule", {
@@ -12854,6 +12862,10 @@ var RepeatOnRadioButtonDirective = /** @class */ (function () {
         HostBinding('class.k-radio'),
         __metadata("design:type", Boolean)
     ], RepeatOnRadioButtonDirective.prototype, "radioClass", void 0);
+    __decorate([
+        HostBinding('class.k-radio-md'),
+        __metadata("design:type", Boolean)
+    ], RepeatOnRadioButtonDirective.prototype, "radioSizeClass", void 0);
     __decorate([
         Input("kendoRecurrenceRepeatOnRadioButton"),
         __metadata("design:type", String),
@@ -13129,7 +13141,7 @@ var RecurrenceMonthlyYearlyEditorComponent = /** @class */ (function () {
     RecurrenceMonthlyYearlyEditorComponent = __decorate([
         Component({
             selector: 'kendo-recurrence-monthly-yearly-editor',
-            template: "\n        <div class='k-edit-label'>\n            <label (click)=\"onRepeatOnLabelClick()\">{{ textForRepeatOn() }}</label>\n        </div>\n        <div class='k-edit-field'>\n            <ul class='k-reset' [style.width.px]='650'>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='monthday-{{uniqueId}}' />\n\n                    <label class='k-radio-label' for='k-repeaton-monthday-{{uniqueId}}'>\n                        <ng-template [ngIf]=\"currentFreq === 'monthly'\">\n                            {{ textFor('monthlyDay') }}\n                        </ng-template>\n                    </label>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthMonthDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'monthday')\"\n                            [disabled]=\"isDisabled('monthday')\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n\n                    <kendo-numerictextbox\n                        [style.width.px]='70'\n                        [min]=\"numericOptions.min\"\n                        [max]=\"numericOptions.max\"\n                        [decimals]=\"0\"\n                        [format]=\"numericOptions.format\"\n                        [autoCorrect]=\"numericOptions.autoCorrect\"\n                        [readonly]=\"numericOptions.readonly\"\n                        [selectOnFocus]=\"numericOptions.selectOnFocus\"\n                        [spinners]=\"numericOptions.spinners\"\n                        [step]=\"numericOptions.step\"\n                        [title]=\"numericOptions.title\"\n                        [value]='monthDay'\n                        (valueChange)='onMonthDayChange($event)'\n                        [disabled]=\"isDisabled('monthday')\">\n                    </kendo-numerictextbox>\n                </li>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='weekday-{{uniqueId}}' />\n                    <label class='k-radio-label' for='k-repeaton-weekday-{{uniqueId}}'></label>\n\n                    <kendo-dropdownlist\n                        [data]='offsetPositions'\n                        textField='text'\n                        valueField='value'\n                        [value]='offset'\n                        [valuePrimitive]='true'\n                        (valueChange)='onOffsetPositionChange($event)'\n                        [disabled]=\"isDisabled('weekday')\">\n                    </kendo-dropdownlist>\n\n                    <kendo-dropdownlist\n                        [data]=\"extendedWeekDays\"\n                        textField='text'\n                        valueField='value'\n                        [value]='weekDay'\n                        [valuePrimitive]='true'\n                        (valueChange)='onWeekDayChange($event)'\n                        [disabled]=\"isDisabled('weekday')\">\n                    </kendo-dropdownlist>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <span>{{ textFor('yearlyOf') }}</span>\n\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthWeekDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'weekday')\"\n                            [disabled]=\"isDisabled('weekday')\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n                </li>\n            </ul>\n        </div>\n    "
+            template: "\n        <div class='k-edit-label'>\n            <label (click)=\"onRepeatOnLabelClick()\">{{ textForRepeatOn() }}</label>\n        </div>\n        <div class='k-edit-field'>\n            <ul class='k-reset' [style.width.px]='650'>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='monthday-{{uniqueId}}' />\n\n                    <label class='k-radio-label' for='k-repeaton-monthday-{{uniqueId}}'>\n                        <ng-template [ngIf]=\"currentFreq === 'monthly'\">\n                            {{ textFor('monthlyDay') }}\n                        </ng-template>\n                    </label>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthMonthDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'monthday')\"\n                            [disabled]=\"isDisabled('monthday')\"\n                            [style.width.px]=\"170\"\n                            [style.margin]=\"'0 .4ex 0 1ex'\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n\n                    <kendo-numerictextbox\n                        [style.width.px]='70'\n                        [min]=\"numericOptions.min\"\n                        [max]=\"numericOptions.max\"\n                        [decimals]=\"0\"\n                        [format]=\"numericOptions.format\"\n                        [autoCorrect]=\"numericOptions.autoCorrect\"\n                        [readonly]=\"numericOptions.readonly\"\n                        [selectOnFocus]=\"numericOptions.selectOnFocus\"\n                        [spinners]=\"numericOptions.spinners\"\n                        [step]=\"numericOptions.step\"\n                        [title]=\"numericOptions.title\"\n                        [value]='monthDay'\n                        (valueChange)='onMonthDayChange($event)'\n                        [disabled]=\"isDisabled('monthday')\"\n                        [style.margin]=\"'0 .4ex 0 1ex'\">\n                    </kendo-numerictextbox>\n                </li>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='weekday-{{uniqueId}}' />\n                    <label class='k-radio-label' for='k-repeaton-weekday-{{uniqueId}}'></label>\n\n                    <kendo-dropdownlist\n                        [data]='offsetPositions'\n                        textField='text'\n                        valueField='value'\n                        [value]='offset'\n                        [valuePrimitive]='true'\n                        (valueChange)='onOffsetPositionChange($event)'\n                        [disabled]=\"isDisabled('weekday')\"\n                        [style.width.px]=\"170\"\n                        [style.margin]=\"'0 .4ex 0 1ex'\">\n                    </kendo-dropdownlist>\n\n                    <kendo-dropdownlist\n                        [data]=\"extendedWeekDays\"\n                        textField='text'\n                        valueField='value'\n                        [value]='weekDay'\n                        [valuePrimitive]='true'\n                        (valueChange)='onWeekDayChange($event)'\n                        [disabled]=\"isDisabled('weekday')\"\n                        [style.width.px]=\"170\"\n                        [style.margin]=\"'0 .4ex 0 1ex'\">\n                    </kendo-dropdownlist>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <span>{{ textFor('yearlyOf') }}</span>\n\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthWeekDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'weekday')\"\n                            [disabled]=\"isDisabled('weekday')\"\n                            [style.width.px]=\"170\"\n                            [style.margin]=\"'0 .4ex 0 1ex'\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n                </li>\n            </ul>\n        </div>\n    "
         }),
         __metadata("design:paramtypes", [RecurrenceService,
             LocalizationService])
@@ -13706,21 +13718,21 @@ var SlotSelectableDirective = /** @class */ (function () {
         if (!start || !end || !this.selectedRange) {
             return false;
         }
-        var match = resourcesMatch(this.selectedRange.resources, resources, true);
+        var match = resourcesMatch(this.selectedRange.resources, resources);
         if (!match) {
             return false; // Limit selection to the grouped resource where the drag started.
         }
         return this.selectedRange && isAllDay === this.selectedRange.isAllDay && this.isInRange(start, end);
     };
     SlotSelectableDirective.prototype.initDragSelect = function (_a) {
-        var start = _a.start, end = _a.end, isAllDay = _a.isAllDay, resources = _a.resources, originalEvent = _a.originalEvent;
+        var start = _a.start, end = _a.end, isAllDay = _a.isAllDay, resources = _a.resources;
         this.selectionOriginResources = resources.slice();
-        this.selectedRange = { start: start, end: end, isAllDay: isAllDay, resources: resources.slice(), originalEvent: originalEvent };
+        this.selectedRange = { start: start, end: end, isAllDay: isAllDay, resources: resources.slice() };
         this.cdr.markForCheck();
     };
     SlotSelectableDirective.prototype.onDrag = function (_a) {
         var start = _a.start, end = _a.end, resources = _a.resources;
-        var match = resourcesMatch(this.selectionOriginResources, resources, false); // Not strict - allow matching [ undefined ] and [ undefined ]
+        var match = resourcesMatch(this.selectionOriginResources, resources);
         if (!match) {
             return; // Don't change selection when dragging over a different grouped resource's cells.
         }
@@ -13812,6 +13824,8 @@ var publicDirectives$1 = [
 ].concat(declarations);
 var importedKendoModules = [
     ButtonsModule,
+    CheckBoxModule,
+    TextAreaModule,
     DateInputsModule,
     DialogModule,
     NumericTextBoxModule,

package/dist/npm/editing/date-time-picker.component.js

@@ -73,7 +73,8 @@ var SchedulerDateTimePickerComponent = /** @class */ (function () {
                 exports.SCHEDULER_DATETIMEPICKER_VALUE_ACCESSOR
             ],
             selector: 'kendo-scheduler-datetime-picker',
-            template: "\n    <kendo-datepicker\n        #datepicker\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-datepicker>\n    <kendo-timepicker *ngIf='!isAllDay'\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-timepicker>\n    "
+            template: "\n    <kendo-datepicker\n        #datepicker\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-datepicker>\n    <kendo-timepicker *ngIf='!isAllDay'\n        [(value)]='date'\n        (valueChange)='onValueChange($event)'\n    ></kendo-timepicker>\n    ",
+            styles: ["\n        kendo-datepicker,\n        kendo-timepicker {\n            width: 170px;\n        }\n    "]
         })
     ], SchedulerDateTimePickerComponent);
     return SchedulerDateTimePickerComponent;

package/dist/npm/editing/edit-dialog.component.js

@@ -286,7 +286,7 @@ var EditDialogComponent = /** @class */ (function () {
     EditDialogComponent = tslib_1.__decorate([
         core_1.Component({
             selector: 'kendo-scheduler-edit-dialog',
-            template: "\n        <kendo-dialog (close)='onClose()' [minWidth]='700' *ngIf='isActive' title='{{ textFor(\"editorTitle\") }}' class='k-scheduler-edit-dialog' [autoFocusedElement]=\"autoFocusedElement\">\n            <ng-container *ngIf='!editTemplate'>\n                <div class='k-scheduler-edit-form'>\n                    <div class='k-edit-form-container'>\n                        <form novalidate [formGroup]='formGroup'>\n                            <div class='k-edit-label'>\n                                <label for='k-event-title'>{{ textFor('editorEventTitle') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <input #title id='k-event-title' class='k-textbox' placeholder='Title' [formControl]='formGroup.get(fields.title)' />\n                            </div>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"startDateTimePicker.focus()\">{{ textFor('editorEventStart') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #startDateTimePicker [formControl]='formGroup.get(fields.start)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isStartTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"startTzPicker.focus()\">{{ textFor('editorEventStartTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #startTzPicker [formControl]='formGroup.get(fields.startTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"endDateTimePicker.focus()\">{{ textFor('editorEventEnd') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #endDateTimePicker [formControl]='formGroup.get(fields.end)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isEndTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"endTzPicker.focus()\">{{ textFor('editorEventEndTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #endTzPicker [formControl]='formGroup.get(fields.endTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-field' *ngIf=\"hasAllDay\">\n                                <input type='checkbox' id='k-is-allday-chkbox' class='k-checkbox' [formControl]='formGroup.get(fields.isAllDay)' />\n                                <label class='k-checkbox-label' for='k-is-allday-chkbox'>{{ textFor('editorEventAllDay') }}</label>\n                            </div>\n\n                            <div class='k-edit-field' *ngIf=\"hasStartTimeZone\">\n                                <input type='checkbox' id='k-set-timezone' class='k-checkbox'\n                                formControlName='startTimezoneCheckbox' />\n                                <label class='k-checkbox-label' for='k-set-timezone'>{{ textFor('editorEventTimeZone') }}</label>\n\n                                <ng-container *ngIf=\"isStartTimeZoneVisible && hasEndTimeZone\">\n                                    <input type='checkbox' id='k-use-separate' class='k-checkbox' formControlName='endTimezoneCheckbox' />\n                                    <label class='k-checkbox-label' for='k-use-separate'>{{ textFor('editorEventSeparateTimeZones') }}</label>\n                                </ng-container>\n                            </div>\n\n                            <ng-container *ngIf=\"isEditingSeries\">\n                                <kendo-recurrence-editor\n                                    [formControl]='formGroup.get(fields.recurrenceRule)'\n                                    [start]='recurrenceStart'\n                                    [timezone]='eventTimezone'\n                                    [weekStart]='weekStart'\n                                ></kendo-recurrence-editor>\n                            </ng-container>\n\n                            <ng-container *ngIf='getFormValue(fields.description)'>\n                                <div class='k-edit-label'>\n                                    <label for='k-event-description'>{{ textFor('editorEventDescription') }}</label>\n                                </div>\n                                <div class='k-edit-field'>\n                                    <textarea id='k-event-description' class='k-textbox' [formControl]='formGroup.get(fields.description)'></textarea>\n                                </div>\n                            </ng-container>\n\n                            <ng-container *ngFor='let resource of resources'>\n                                <ng-container *ngIf='getFormValue(resource.field)'>\n                                    <div class='k-edit-label'>\n                                        <label (click)=\"onResourceClick(resource)\">\n                                            {{ resource.name ? resource.name : resource.field }}\n                                        </label>\n                                    </div>\n                                    <div class='k-edit-field'>\n                                        <kendo-multiple-resource-editor\n                                            *ngIf='resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-multiple-resource-editor>\n                                        <kendo-single-resource-editor\n                                            *ngIf='!resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-single-resource-editor>\n                                    </div>\n                                </ng-container>\n                            </ng-container>\n                        </form>\n                    </div>\n                </div>\n            </ng-container>\n\n            <ng-container *ngIf='editTemplate'>\n                <form novalidate [formGroup]='formGroup'>\n                    <ng-container [ngTemplateOutlet]='editTemplate.templateRef'\n                        [ngTemplateOutletContext]=\"{\n                            $implicit: formGroup,\n                            formGroup: formGroup,\n                            dataItem: editedEvent,\n                            editMode: editMode,\n                            isNew: isNew\n                        }\">\n                    </ng-container>\n                </form>\n            </ng-container>\n\n            <kendo-dialog-actions>\n                <button class=\"k-button\" (click)=\"onCancel($event)\">{{ textFor('cancel') }}</button>\n                <button class=\"k-button k-primary\" (click)=\"onSave($event)\" [disabled]=\"!formGroup.valid\">{{ textFor('save') }}</button>\n            </kendo-dialog-actions>\n        </kendo-dialog>\n    "
+            template: "\n        <kendo-dialog (close)='onClose()' [minWidth]='700' *ngIf='isActive' title='{{ textFor(\"editorTitle\") }}' class='k-scheduler-edit-dialog' [autoFocusedElement]=\"autoFocusedElement\">\n            <ng-container *ngIf='!editTemplate'>\n                <div class='k-scheduler-edit-form'>\n                    <div class='k-edit-form-container'>\n                        <form novalidate [formGroup]='formGroup'>\n                            <div class='k-edit-label'>\n                                <label for='k-event-title'>{{ textFor('editorEventTitle') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <input #title id='k-event-title' kendoTextBox placeholder='Title' [formControl]='formGroup.get(fields.title)' />\n                            </div>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"startDateTimePicker.focus()\">{{ textFor('editorEventStart') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #startDateTimePicker [formControl]='formGroup.get(fields.start)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isStartTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"startTzPicker.focus()\">{{ textFor('editorEventStartTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #startTzPicker [formControl]='formGroup.get(fields.startTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-label'>\n                                <label (click)=\"endDateTimePicker.focus()\">{{ textFor('editorEventEnd') }}</label>\n                            </div>\n                            <div class='k-edit-field'>\n                                <kendo-scheduler-datetime-picker #endDateTimePicker [formControl]='formGroup.get(fields.end)'\n                                    [isAllDay]='getFormValue(fields.isAllDay)?.value'>\n                                </kendo-scheduler-datetime-picker>\n                            </div>\n\n                            <ng-container *ngIf=\"isEndTimeZoneVisible\">\n                                <div class='k-edit-label'>\n                                    <label (click)=\"endTzPicker.focus()\">{{ textFor('editorEventEndTimeZone') }}</label>\n                                </div>\n\n                                <div class='k-edit-field'>\n                                    <kendo-timezone-editor #endTzPicker [formControl]='formGroup.get(fields.endTimezone)'></kendo-timezone-editor>\n                                </div>\n                            </ng-container>\n\n                            <div class='k-edit-field' *ngIf=\"hasAllDay\">\n                                <input type='checkbox' id='k-is-allday-chkbox' kendoCheckBox [formControl]='formGroup.get(fields.isAllDay)' />\n                                <label class='k-checkbox-label' for='k-is-allday-chkbox'>{{ textFor('editorEventAllDay') }}</label>\n                            </div>\n\n                            <div class='k-edit-field' *ngIf=\"hasStartTimeZone\">\n                                <input type='checkbox' id='k-set-timezone' kendoCheckBox\n                                formControlName='startTimezoneCheckbox' />\n                                <label class='k-checkbox-label' for='k-set-timezone'>{{ textFor('editorEventTimeZone') }}</label>\n\n                                <ng-container *ngIf=\"isStartTimeZoneVisible && hasEndTimeZone\">\n                                    <input type='checkbox' id='k-use-separate' kendoCheckBox formControlName='endTimezoneCheckbox' />\n                                    <label class='k-checkbox-label' for='k-use-separate'>{{ textFor('editorEventSeparateTimeZones') }}</label>\n                                </ng-container>\n                            </div>\n\n                            <ng-container *ngIf=\"isEditingSeries\">\n                                <kendo-recurrence-editor\n                                    [formControl]='formGroup.get(fields.recurrenceRule)'\n                                    [start]='recurrenceStart'\n                                    [timezone]='eventTimezone'\n                                    [weekStart]='weekStart'\n                                ></kendo-recurrence-editor>\n                            </ng-container>\n\n                            <ng-container *ngIf='getFormValue(fields.description)'>\n                                <div class='k-edit-label'>\n                                    <label for='k-event-description'>{{ textFor('editorEventDescription') }}</label>\n                                </div>\n                                <div class='k-edit-field'>\n                                    <textarea id='k-event-description' kendoTextArea [formControl]='formGroup.get(fields.description)'></textarea>\n                                </div>\n                            </ng-container>\n\n                            <ng-container *ngFor='let resource of resources'>\n                                <ng-container *ngIf='getFormValue(resource.field)'>\n                                    <div class='k-edit-label'>\n                                        <label (click)=\"onResourceClick(resource)\">\n                                            {{ resource.name ? resource.name : resource.field }}\n                                        </label>\n                                    </div>\n                                    <div class='k-edit-field'>\n                                        <kendo-multiple-resource-editor\n                                            *ngIf='resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-multiple-resource-editor>\n                                        <kendo-single-resource-editor\n                                            *ngIf='!resource.multiple'\n                                            [formControl]='formGroup.get(resource.field)'\n                                            [resource]='resource'>\n                                        </kendo-single-resource-editor>\n                                    </div>\n                                </ng-container>\n                            </ng-container>\n                        </form>\n                    </div>\n                </div>\n            </ng-container>\n\n            <ng-container *ngIf='editTemplate'>\n                <form novalidate [formGroup]='formGroup'>\n                    <ng-container [ngTemplateOutlet]='editTemplate.templateRef'\n                        [ngTemplateOutletContext]=\"{\n                            $implicit: formGroup,\n                            formGroup: formGroup,\n                            dataItem: editedEvent,\n                            editMode: editMode,\n                            isNew: isNew\n                        }\">\n                    </ng-container>\n                </form>\n            </ng-container>\n\n            <kendo-dialog-actions>\n                <button kendoButton (click)=\"onCancel($event)\">{{ textFor('cancel') }}</button>\n                <button kendoButton themeColor=\"primary\" (click)=\"onSave($event)\" [disabled]=\"!formGroup.valid\">{{ textFor('save') }}</button>\n            </kendo-dialog-actions>\n        </kendo-dialog>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [core_1.NgZone,
             edit_service_1.EditService,

package/dist/npm/editing/recurrence/end-rule-radio-button.directive.js

@@ -18,6 +18,7 @@ var EndRuleRadioButtonDirective = /** @class */ (function () {
         this.changeDetector = changeDetector;
         this.type = 'radio';
         this.radioClass = true;
+        this.radioSizeClass = true;
         this.destroyChange = this.renderer.listen(this.elem, 'change', this.onChange.bind(this));
     }
     EndRuleRadioButtonDirective.prototype.ngOnInit = function () {
@@ -58,6 +59,10 @@ var EndRuleRadioButtonDirective = /** @class */ (function () {
         core_1.HostBinding('class.k-radio'),
         tslib_1.__metadata("design:type", Boolean)
     ], EndRuleRadioButtonDirective.prototype, "radioClass", void 0);
+    tslib_1.__decorate([
+        core_1.HostBinding('class.k-radio-md'),
+        tslib_1.__metadata("design:type", Boolean)
+    ], EndRuleRadioButtonDirective.prototype, "radioSizeClass", void 0);
     tslib_1.__decorate([
         core_1.Input("kendoRecurrenceEndRuleRadioButton"),
         tslib_1.__metadata("design:type", String)

package/dist/npm/editing/recurrence/recurrence-monthly-yearly-editor.component.js

@@ -269,7 +269,7 @@ var RecurrenceMonthlyYearlyEditorComponent = /** @class */ (function () {
     RecurrenceMonthlyYearlyEditorComponent = tslib_1.__decorate([
         core_1.Component({
             selector: 'kendo-recurrence-monthly-yearly-editor',
-            template: "\n        <div class='k-edit-label'>\n            <label (click)=\"onRepeatOnLabelClick()\">{{ textForRepeatOn() }}</label>\n        </div>\n        <div class='k-edit-field'>\n            <ul class='k-reset' [style.width.px]='650'>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='monthday-{{uniqueId}}' />\n\n                    <label class='k-radio-label' for='k-repeaton-monthday-{{uniqueId}}'>\n                        <ng-template [ngIf]=\"currentFreq === 'monthly'\">\n                            {{ textFor('monthlyDay') }}\n                        </ng-template>\n                    </label>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthMonthDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'monthday')\"\n                            [disabled]=\"isDisabled('monthday')\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n\n                    <kendo-numerictextbox\n                        [style.width.px]='70'\n                        [min]=\"numericOptions.min\"\n                        [max]=\"numericOptions.max\"\n                        [decimals]=\"0\"\n                        [format]=\"numericOptions.format\"\n                        [autoCorrect]=\"numericOptions.autoCorrect\"\n                        [readonly]=\"numericOptions.readonly\"\n                        [selectOnFocus]=\"numericOptions.selectOnFocus\"\n                        [spinners]=\"numericOptions.spinners\"\n                        [step]=\"numericOptions.step\"\n                        [title]=\"numericOptions.title\"\n                        [value]='monthDay'\n                        (valueChange)='onMonthDayChange($event)'\n                        [disabled]=\"isDisabled('monthday')\">\n                    </kendo-numerictextbox>\n                </li>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='weekday-{{uniqueId}}' />\n                    <label class='k-radio-label' for='k-repeaton-weekday-{{uniqueId}}'></label>\n\n                    <kendo-dropdownlist\n                        [data]='offsetPositions'\n                        textField='text'\n                        valueField='value'\n                        [value]='offset'\n                        [valuePrimitive]='true'\n                        (valueChange)='onOffsetPositionChange($event)'\n                        [disabled]=\"isDisabled('weekday')\">\n                    </kendo-dropdownlist>\n\n                    <kendo-dropdownlist\n                        [data]=\"extendedWeekDays\"\n                        textField='text'\n                        valueField='value'\n                        [value]='weekDay'\n                        [valuePrimitive]='true'\n                        (valueChange)='onWeekDayChange($event)'\n                        [disabled]=\"isDisabled('weekday')\">\n                    </kendo-dropdownlist>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <span>{{ textFor('yearlyOf') }}</span>\n\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthWeekDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'weekday')\"\n                            [disabled]=\"isDisabled('weekday')\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n                </li>\n            </ul>\n        </div>\n    "
+            template: "\n        <div class='k-edit-label'>\n            <label (click)=\"onRepeatOnLabelClick()\">{{ textForRepeatOn() }}</label>\n        </div>\n        <div class='k-edit-field'>\n            <ul class='k-reset' [style.width.px]='650'>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='monthday-{{uniqueId}}' />\n\n                    <label class='k-radio-label' for='k-repeaton-monthday-{{uniqueId}}'>\n                        <ng-template [ngIf]=\"currentFreq === 'monthly'\">\n                            {{ textFor('monthlyDay') }}\n                        </ng-template>\n                    </label>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthMonthDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'monthday')\"\n                            [disabled]=\"isDisabled('monthday')\"\n                            [style.width.px]=\"170\"\n                            [style.margin]=\"'0 .4ex 0 1ex'\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n\n                    <kendo-numerictextbox\n                        [style.width.px]='70'\n                        [min]=\"numericOptions.min\"\n                        [max]=\"numericOptions.max\"\n                        [decimals]=\"0\"\n                        [format]=\"numericOptions.format\"\n                        [autoCorrect]=\"numericOptions.autoCorrect\"\n                        [readonly]=\"numericOptions.readonly\"\n                        [selectOnFocus]=\"numericOptions.selectOnFocus\"\n                        [spinners]=\"numericOptions.spinners\"\n                        [step]=\"numericOptions.step\"\n                        [title]=\"numericOptions.title\"\n                        [value]='monthDay'\n                        (valueChange)='onMonthDayChange($event)'\n                        [disabled]=\"isDisabled('monthday')\"\n                        [style.margin]=\"'0 .4ex 0 1ex'\">\n                    </kendo-numerictextbox>\n                </li>\n                <li>\n                    <input kendoRecurrenceRepeatOnRadioButton='weekday-{{uniqueId}}' />\n                    <label class='k-radio-label' for='k-repeaton-weekday-{{uniqueId}}'></label>\n\n                    <kendo-dropdownlist\n                        [data]='offsetPositions'\n                        textField='text'\n                        valueField='value'\n                        [value]='offset'\n                        [valuePrimitive]='true'\n                        (valueChange)='onOffsetPositionChange($event)'\n                        [disabled]=\"isDisabled('weekday')\"\n                        [style.width.px]=\"170\"\n                        [style.margin]=\"'0 .4ex 0 1ex'\">\n                    </kendo-dropdownlist>\n\n                    <kendo-dropdownlist\n                        [data]=\"extendedWeekDays\"\n                        textField='text'\n                        valueField='value'\n                        [value]='weekDay'\n                        [valuePrimitive]='true'\n                        (valueChange)='onWeekDayChange($event)'\n                        [disabled]=\"isDisabled('weekday')\"\n                        [style.width.px]=\"170\"\n                        [style.margin]=\"'0 .4ex 0 1ex'\">\n                    </kendo-dropdownlist>\n\n                    <ng-template [ngIf]=\"currentFreq === 'yearly'\">\n                        <span>{{ textFor('yearlyOf') }}</span>\n\n                        <kendo-dropdownlist\n                            [data]='months'\n                            textField='text'\n                            valueField='value'\n                            [value]='currentMonthWeekDay'\n                            [valuePrimitive]='true'\n                            (valueChange)=\"onMonthChange($event, 'weekday')\"\n                            [disabled]=\"isDisabled('weekday')\"\n                            [style.width.px]=\"170\"\n                            [style.margin]=\"'0 .4ex 0 1ex'\">\n                        </kendo-dropdownlist>\n                    </ng-template>\n                </li>\n            </ul>\n        </div>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [recurrence_service_1.RecurrenceService,
             kendo_angular_l10n_1.LocalizationService])

package/dist/npm/editing/recurrence/repeat-on-radio-button.directive.js

@@ -18,6 +18,7 @@ var RepeatOnRadioButtonDirective = /** @class */ (function () {
         this.changeDetector = changeDetector;
         this.type = 'radio';
         this.radioClass = true;
+        this.radioSizeClass = true;
         this.destroyChange = this.renderer.listen(this.elem, 'change', this.onChange.bind(this));
     }
     Object.defineProperty(RepeatOnRadioButtonDirective.prototype, "repeatOnRule", {
@@ -67,6 +68,10 @@ var RepeatOnRadioButtonDirective = /** @class */ (function () {
         core_1.HostBinding('class.k-radio'),
         tslib_1.__metadata("design:type", Boolean)
     ], RepeatOnRadioButtonDirective.prototype, "radioClass", void 0);
+    tslib_1.__decorate([
+        core_1.HostBinding('class.k-radio-md'),
+        tslib_1.__metadata("design:type", Boolean)
+    ], RepeatOnRadioButtonDirective.prototype, "radioSizeClass", void 0);
     tslib_1.__decorate([
         core_1.Input("kendoRecurrenceRepeatOnRadioButton"),
         tslib_1.__metadata("design:type", String),

package/dist/npm/package-metadata.js

@@ -11,7 +11,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-angular-scheduler',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1639756470,
+    publishDate: 1644230710,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
 };

package/dist/npm/scheduler.module.js

@@ -108,6 +108,8 @@ var publicDirectives = [
 ].concat(declarations);
 var importedKendoModules = [
     kendo_angular_buttons_1.ButtonsModule,
+    kendo_angular_inputs_1.CheckBoxModule,
+    kendo_angular_inputs_1.TextAreaModule,
     kendo_angular_dateinputs_1.DateInputsModule,
     kendo_angular_dialog_1.DialogModule,
     kendo_angular_inputs_1.NumericTextBoxModule,

package/dist/npm/toolbar/view-selector.component.js

@@ -79,7 +79,7 @@ var ToolbarViewSelectorComponent = /** @class */ (function () {
         core_1.Component({
             // tslint:disable-next-line:component-selector
             selector: '[kendoSchedulerToolbarViewSelector]',
-            template: "\n        <select *ngIf=\"ctx.views?.length > 1\"\n                (change)=\"onChange($event)\"\n                class=\"k-views-dropdown k-dropdown\">\n            <option *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view) == true\"\n                [value]=\"view.name\"\n            >\n                {{ view.title }}\n            </option>\n        </select>\n        <span class=\"k-scheduler-views k-button-group\">\n            <button kendoButton\n                type=\"button\"\n                *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view)\"\n                [attr.aria-pressed]=\"isSelected(view)\"\n                (click)=\"select(view)\"\n            >\n                <span class=\"k-button-text\">\n                    {{ view.title }}\n                </span>\n            </button>\n        </span>\n    "
+            template: "\n        <select *ngIf=\"ctx.views?.length > 1\"\n                (change)=\"onChange($event)\"\n                class=\"k-views-dropdown k-picker-md k-rounded-md k-picker-solid k-dropdownlist k-picker\">\n            <option *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view) == true\"\n                [value]=\"view.name\"\n            >\n                {{ view.title }}\n            </option>\n        </select>\n        <span class=\"k-scheduler-views k-button-group\">\n            <button kendoButton\n                type=\"button\"\n                *ngFor=\"let view of ctx.views\"\n                [selected]=\"isSelected(view)\"\n                [attr.aria-pressed]=\"isSelected(view)\"\n                (click)=\"select(view)\"\n            >\n                <span class=\"k-button-text\">\n                    {{ view.title }}\n                </span>\n            </button>\n        </span>\n    "
         }),
         tslib_1.__metadata("design:paramtypes", [toolbar_service_1.ToolbarService])
     ], ToolbarViewSelectorComponent);

package/dist/npm/views/common/base-view.js

@@ -299,7 +299,8 @@ var BaseView = /** @class */ (function () {
                 this.pressTarget = task;
             }
         }
-        if (this.selectable) {
+        var notDraggingEvent = !this.pressTarget;
+        if (notDraggingEvent && this.selectable) {
             this.initDragSelect(args);
         }
         this.dragArgs = args;

package/dist/npm/views/common/slot-selectable.directive.js

@@ -61,21 +61,21 @@ var SlotSelectableDirective = /** @class */ (function () {
         if (!start || !end || !this.selectedRange) {
             return false;
         }
-        var match = utils_1.resourcesMatch(this.selectedRange.resources, resources, true);
+        var match = utils_1.resourcesMatch(this.selectedRange.resources, resources);
         if (!match) {
             return false; // Limit selection to the grouped resource where the drag started.
         }
         return this.selectedRange && isAllDay === this.selectedRange.isAllDay && this.isInRange(start, end);
     };
     SlotSelectableDirective.prototype.initDragSelect = function (_a) {
-        var start = _a.start, end = _a.end, isAllDay = _a.isAllDay, resources = _a.resources, originalEvent = _a.originalEvent;
+        var start = _a.start, end = _a.end, isAllDay = _a.isAllDay, resources = _a.resources;
         this.selectionOriginResources = resources.slice();
-        this.selectedRange = { start: start, end: end, isAllDay: isAllDay, resources: resources.slice(), originalEvent: originalEvent };
+        this.selectedRange = { start: start, end: end, isAllDay: isAllDay, resources: resources.slice() };
         this.cdr.markForCheck();
     };
     SlotSelectableDirective.prototype.onDrag = function (_a) {
         var start = _a.start, end = _a.end, resources = _a.resources;
-        var match = utils_1.resourcesMatch(this.selectionOriginResources, resources, false); // Not strict - allow matching [ undefined ] and [ undefined ]
+        var match = utils_1.resourcesMatch(this.selectionOriginResources, resources);
         if (!match) {
             return; // Don't change selection when dragging over a different grouped resource's cells.
         }

package/dist/npm/views/common/view-footer.component.js

@@ -44,7 +44,7 @@ var ViewFooterComponent = /** @class */ (function () {
         core_1.Component({
             // tslint:disable-next-line:component-selector
             selector: '[viewFooter]',
-            template: "\n        <button type=\"button\" class=\"k-button\" *ngFor=\"let item of items\" [ngClass]=\"item.cssClass\" (click)=\"onItemClick($event, item)\">\n            <span class=\"k-button-icon k-icon\" [ngClass]=\"item.iconClass\"></span>\n            <span class=\"k-button-text\">{{ item.text }}</span>\n        </button>\n    "
+            template: "\n        <button type=\"button\" kendoButton *ngFor=\"let item of items\" [ngClass]=\"item.cssClass\" (click)=\"onItemClick($event, item)\">\n            <span class=\"k-button-icon k-icon\" [ngClass]=\"item.iconClass\"></span>\n            <span class=\"k-button-text\">{{ item.text }}</span>\n        </button>\n    "
         })
     ], ViewFooterComponent);
     return ViewFooterComponent;

package/dist/npm/views/common/views-shared.module.js

@@ -15,6 +15,7 @@ var resource_iterator_pipe_1 = require("./resource-iterator.pipe");
 var hint_container_component_1 = require("./hint-container.component");
 var resize_hint_component_1 = require("./resize-hint.component");
 var shared_module_1 = require("../../shared.module");
+var kendo_angular_buttons_1 = require("@progress/kendo-angular-buttons");
 var DECLARATIONS = [
     view_footer_component_1.ViewFooterComponent,
     work_hours_footer_directive_1.WorkHoursFooterDirective,
@@ -31,7 +32,7 @@ var ViewsSharedModule = /** @class */ (function () {
     }
     ViewsSharedModule = tslib_1.__decorate([
         core_1.NgModule({
-            imports: [common_1.CommonModule, kendo_angular_intl_1.IntlModule, shared_module_1.SharedModule],
+            imports: [common_1.CommonModule, kendo_angular_intl_1.IntlModule, shared_module_1.SharedModule, kendo_angular_buttons_1.ButtonsModule],
             exports: [
                 DECLARATIONS,
                 kendo_angular_intl_1.IntlModule,

package/dist/npm/views/utils.js

@@ -214,18 +214,18 @@ exports.assignTasksResources = assignTasksResources;
 /**
  * @hidden
  */
-function areValidResources(resources) {
-    return Array.isArray(resources) && resources.length > 0 && resources[0] !== undefined;
+function isEmptyResource(resources) {
+    return Array.isArray(resources) && resources.length === 1 && resources[0] === undefined;
 }
-exports.areValidResources = areValidResources;
+exports.isEmptyResource = isEmptyResource;
 /**
  * @hidden
  */
-function resourcesMatch(res1, res2, strict) {
+function resourcesMatch(res1, res2) {
     if (res1.length !== res2.length) {
         return false;
     }
-    if (!strict && !areValidResources(res1) || !areValidResources(res2)) {
+    if (isEmptyResource(res1) && isEmptyResource(res2)) {
         return true;
     }
     return res1.every(function (r1) { return res2.some(function (r2) { return r2.value === r1.value; }); });
@@ -238,7 +238,7 @@ function isSameRange(range1, range2) {
     return (range1.start.getTime() === range2.start.getTime() &&
         range1.end.getTime() === range2.end.getTime() &&
         range1.isAllDay === range2.isAllDay &&
-        resourcesMatch(range1.resources, range2.resources, true));
+        resourcesMatch(range1.resources, range2.resources));
 }
 exports.isSameRange = isSameRange;
 /** @hidden */