@progress/kendo-angular-scheduler 12.2.0-develop.7 → 13.0.0-develop.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/editing/date-time-picker.component.d.ts +6 -1
  2. package/editing/edit-dialog.component.d.ts +3 -0
  3. package/editing/recurrence/recurrence-end-rule-editor.component.d.ts +1 -0
  4. package/editing/recurrence/recurrence-interval-editor.component.d.ts +1 -0
  5. package/editing/timezone-editor.component.d.ts +4 -0
  6. package/esm2020/editing/date-time-picker.component.mjs +24 -13
  7. package/esm2020/editing/edit-dialog.component.mjs +351 -240
  8. package/esm2020/editing/recurrence/recurrence-editor.component.mjs +40 -36
  9. package/esm2020/editing/recurrence/recurrence-end-rule-editor.component.mjs +156 -130
  10. package/esm2020/editing/recurrence/recurrence-frequency-editor.component.mjs +26 -13
  11. package/esm2020/editing/recurrence/recurrence-interval-editor.component.mjs +26 -14
  12. package/esm2020/editing/recurrence/recurrence-monthly-yearly-editor.component.mjs +157 -149
  13. package/esm2020/editing/recurrence/recurrence-weekday-rule-editor.component.mjs +40 -23
  14. package/esm2020/editing/timezone-editor.component.mjs +6 -0
  15. package/esm2020/package-metadata.mjs +2 -2
  16. package/esm2020/pdf/pdf-command.directive.mjs +1 -1
  17. package/esm2020/scheduler.module.mjs +5 -3
  18. package/esm2020/toolbar/navigation.component.mjs +14 -8
  19. package/esm2020/views/agenda/agenda-task-item.component.mjs +1 -1
  20. package/esm2020/views/agenda/agenda-view-list.component.mjs +16 -10
  21. package/esm2020/views/day-time/day-time-view-item.component.mjs +9 -9
  22. package/esm2020/views/month/month-slot.component.mjs +1 -1
  23. package/esm2020/views/month/month-view-item.component.mjs +9 -9
  24. package/esm2020/views/view-items/base-view-item.mjs +9 -0
  25. package/fesm2015/progress-kendo-angular-scheduler.mjs +878 -650
  26. package/fesm2020/progress-kendo-angular-scheduler.mjs +877 -650
  27. package/package.json +12 -12
  28. package/scheduler.module.d.ts +1 -1
  29. package/schematics/ngAdd/index.js +2 -2
  30. package/toolbar/navigation.component.d.ts +2 -0
  31. package/views/agenda/agenda-view-list.component.d.ts +4 -2
  32. package/views/view-items/base-view-item.d.ts +5 -0
@@ -225,24 +225,26 @@ RecurrenceEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
225
225
  <kendo-recurrence-frequency-editor>
226
226
  </kendo-recurrence-frequency-editor>
227
227
 
228
- <kendo-recurrence-interval-editor
229
- *ngIf="currentFreq !== 'never'"
230
- [userNumericOptions]="repeatEveryOptions">
231
- </kendo-recurrence-interval-editor>
232
-
233
- <kendo-recurrence-weekday-rule-editor *ngIf="currentFreq === 'weekly'">
234
- </kendo-recurrence-weekday-rule-editor>
235
-
236
- <kendo-recurrence-monthly-yearly-editor
237
- *ngIf="currentFreq === 'monthly' || currentFreq === 'yearly'"
238
- [userNumericOptions]="repeatOnOptions">
239
- </kendo-recurrence-monthly-yearly-editor>
240
-
241
- <kendo-recurrence-end-rule-editor
242
- *ngIf="currentFreq !== 'never'"
243
- [userNumericOptions]="endAfterOptions"
244
- [userDatePickerOptions]="endOnOptions">
245
- </kendo-recurrence-end-rule-editor>
228
+ <div class="k-recur-view">
229
+ <kendo-recurrence-interval-editor
230
+ *ngIf="currentFreq !== 'never'"
231
+ [userNumericOptions]="repeatEveryOptions">
232
+ </kendo-recurrence-interval-editor>
233
+
234
+ <kendo-recurrence-weekday-rule-editor *ngIf="currentFreq === 'weekly'">
235
+ </kendo-recurrence-weekday-rule-editor>
236
+
237
+ <kendo-recurrence-monthly-yearly-editor
238
+ *ngIf="currentFreq === 'monthly' || currentFreq === 'yearly'"
239
+ [userNumericOptions]="repeatOnOptions">
240
+ </kendo-recurrence-monthly-yearly-editor>
241
+
242
+ <kendo-recurrence-end-rule-editor
243
+ *ngIf="currentFreq !== 'never'"
244
+ [userNumericOptions]="endAfterOptions"
245
+ [userDatePickerOptions]="endOnOptions">
246
+ </kendo-recurrence-end-rule-editor>
247
+ </div>
246
248
  `, isInline: true, components: [{ type: i3.RecurrenceFrequencyEditorComponent, selector: "kendo-recurrence-frequency-editor" }, { type: i4.RecurrenceIntervalEditorComponent, selector: "kendo-recurrence-interval-editor", inputs: ["userNumericOptions"] }, { type: i5.RecurrenceWeekdayRuleEditorComponent, selector: "kendo-recurrence-weekday-rule-editor" }, { type: i6.RecurrenceMonthlyYearlyEditorComponent, selector: "kendo-recurrence-monthly-yearly-editor", inputs: ["userNumericOptions"] }, { type: i7.RecurrenceEndRuleEditorComponent, selector: "kendo-recurrence-end-rule-editor", inputs: ["userNumericOptions", "userDatePickerOptions"] }], directives: [{ type: i8.RecurrenceEditorLocalizedMessagesDirective, selector: "[kendoRecurrenceEditorLocalizedMessages]" }, { type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
247
249
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceEditorComponent, decorators: [{
248
250
  type: Component,
@@ -365,24 +367,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
365
367
  <kendo-recurrence-frequency-editor>
366
368
  </kendo-recurrence-frequency-editor>
367
369
 
368
- <kendo-recurrence-interval-editor
369
- *ngIf="currentFreq !== 'never'"
370
- [userNumericOptions]="repeatEveryOptions">
371
- </kendo-recurrence-interval-editor>
372
-
373
- <kendo-recurrence-weekday-rule-editor *ngIf="currentFreq === 'weekly'">
374
- </kendo-recurrence-weekday-rule-editor>
375
-
376
- <kendo-recurrence-monthly-yearly-editor
377
- *ngIf="currentFreq === 'monthly' || currentFreq === 'yearly'"
378
- [userNumericOptions]="repeatOnOptions">
379
- </kendo-recurrence-monthly-yearly-editor>
380
-
381
- <kendo-recurrence-end-rule-editor
382
- *ngIf="currentFreq !== 'never'"
383
- [userNumericOptions]="endAfterOptions"
384
- [userDatePickerOptions]="endOnOptions">
385
- </kendo-recurrence-end-rule-editor>
370
+ <div class="k-recur-view">
371
+ <kendo-recurrence-interval-editor
372
+ *ngIf="currentFreq !== 'never'"
373
+ [userNumericOptions]="repeatEveryOptions">
374
+ </kendo-recurrence-interval-editor>
375
+
376
+ <kendo-recurrence-weekday-rule-editor *ngIf="currentFreq === 'weekly'">
377
+ </kendo-recurrence-weekday-rule-editor>
378
+
379
+ <kendo-recurrence-monthly-yearly-editor
380
+ *ngIf="currentFreq === 'monthly' || currentFreq === 'yearly'"
381
+ [userNumericOptions]="repeatOnOptions">
382
+ </kendo-recurrence-monthly-yearly-editor>
383
+
384
+ <kendo-recurrence-end-rule-editor
385
+ *ngIf="currentFreq !== 'never'"
386
+ [userNumericOptions]="endAfterOptions"
387
+ [userDatePickerOptions]="endOnOptions">
388
+ </kendo-recurrence-end-rule-editor>
389
+ </div>
386
390
  `
387
391
  }]
388
392
  }], ctorParameters: function () { return [{ type: i1.RecurrenceService }, { type: i2.IntlService }]; }, propDecorators: { cssClass: [{
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Component, ViewChildren, QueryList, Input } from '@angular/core';
5
+ import { Component, ViewChildren, QueryList, Input, HostBinding } from '@angular/core';
6
6
  import { RecurrenceService } from './recurrence.service';
7
7
  import { isPresent } from '../../common/util';
8
8
  import { LocalizationService } from '@progress/kendo-angular-l10n';
@@ -12,8 +12,8 @@ import { toUTCDate } from '../../views/utils';
12
12
  import * as i0 from "@angular/core";
13
13
  import * as i1 from "./recurrence.service";
14
14
  import * as i2 from "@progress/kendo-angular-l10n";
15
- import * as i3 from "@progress/kendo-angular-inputs";
16
- import * as i4 from "@progress/kendo-angular-label";
15
+ import * as i3 from "@progress/kendo-angular-label";
16
+ import * as i4 from "@progress/kendo-angular-inputs";
17
17
  import * as i5 from "@progress/kendo-angular-dateinputs";
18
18
  import * as i6 from "./end-rule-radio-button.directive";
19
19
  /**
@@ -23,6 +23,7 @@ export class RecurrenceEndRuleEditorComponent {
23
23
  constructor(recurrence, localization) {
24
24
  this.recurrence = recurrence;
25
25
  this.localization = localization;
26
+ this.cssClass = true;
26
27
  this.numericOptions = {
27
28
  min: 1,
28
29
  format: '#',
@@ -122,142 +123,167 @@ export class RecurrenceEndRuleEditorComponent {
122
123
  }
123
124
  }
124
125
  RecurrenceEndRuleEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceEndRuleEditorComponent, deps: [{ token: i1.RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
125
- RecurrenceEndRuleEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: RecurrenceEndRuleEditorComponent, selector: "kendo-recurrence-end-rule-editor", inputs: { userNumericOptions: "userNumericOptions", userDatePickerOptions: "userDatePickerOptions" }, viewQueries: [{ propertyName: "endRuleRadioButtons", predicate: EndRuleRadioButtonDirective, descendants: true }], ngImport: i0, template: `
126
- <div class='k-form-field'>
127
- <label class='k-form-label' (click)="onEndLabelClick()">{{ textFor('endLabel') }}</label>
128
-
129
- <ul class='k-form-field-wrap k-reset'>
130
- <li class='k-radio-item'>
131
- <input kendoRecurrenceEndRuleRadioButton='k-endrule-never-{{uniqueId}}' />
132
- <label class='k-radio-label' for='k-endrule-never-{{uniqueId}}'>{{ textFor('endNever') }}</label>
133
- </li>
134
- <li class='k-radio-item'>
135
- <input kendoRecurrenceEndRuleRadioButton='k-endrule-count-{{uniqueId}}' />
136
- <label class='k-radio-label' for='k-endrule-count-{{uniqueId}}'>{{ textFor('endAfter') }}</label>
137
-
138
- <kendo-numerictextbox
139
- #afterOccurances
140
- [style.width.px]='70'
141
- [autoCorrect]='numericOptions.autoCorrect'
142
- [decimals]='0'
143
- [disabled]='isCountDisabled'
144
- [format]="numericOptions.format"
145
- [min]='numericOptions.min'
146
- [max]="numericOptions.max"
147
- [readonly]="numericOptions.readonly"
148
- [selectOnFocus]="numericOptions.selectOnFocus"
149
- [spinners]="numericOptions.spinners"
150
- [step]="numericOptions.step"
151
- [title]="numericOptions.title"
152
- [(value)]='countValue'
153
- (blur)="onCountBlur()"
154
- (valueChange)='onCountChange($event)'>
155
- </kendo-numerictextbox>
156
- <kendo-label [for]="afterOccurances" [text]="textFor('endOccurrence')"></kendo-label>
157
- </li>
158
- <li class='k-radio-item'>
159
- <input kendoRecurrenceEndRuleRadioButton='k-endrule-until-{{uniqueId}}' />
160
- <label class='k-radio-label' for='k-endrule-until-{{uniqueId}}'>{{ textFor('endOn') }}</label>
161
-
162
- <kendo-datepicker
163
- [style.width.px]='150'
164
- [disabled]='isUntilDisabled'
165
- [activeView]="datePickerOptions.activeView"
166
- [bottomView]="datePickerOptions.bottomView"
167
- [disabledDatesValidation]="datePickerOptions.disabledDatesValidation"
168
- [focusedDate]="datePickerOptions.focusedDate"
169
- [format]="datePickerOptions.format"
170
- [formatPlaceholder]="datePickerOptions.formatPlaceHolder"
171
- [max]="datePickerOptions.max"
172
- [min]="datePickerOptions.min"
173
- [navigation]="datePickerOptions.navigation"
174
- [placeholder]="datePickerOptions.placeholder"
175
- [readOnlyInput]="datePickerOptions.readOnlyInput"
176
- [readonly]="datePickerOptions.readonly"
177
- [title]="datePickerOptions.title"
178
- [topView]="datePickerOptions.topView"
179
- [weekNumber]="datePickerOptions.weekNumber"
180
- [disabledDates]="datePickerOptions.disabledDates"
181
- [popupSettings]="datePickerOptions.popupSettings"
182
- [(value)]='untilValue'
183
- (blur)="onUntilBlur()"
184
- (valueChange)='onUntilChange($event)'>
185
- </kendo-datepicker>
186
- </li>
187
- </ul>
126
+ RecurrenceEndRuleEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: RecurrenceEndRuleEditorComponent, selector: "kendo-recurrence-end-rule-editor", inputs: { userNumericOptions: "userNumericOptions", userDatePickerOptions: "userDatePickerOptions" }, host: { properties: { "class.k-scheduler-recurrence-end-rule-editor": "this.cssClass" } }, viewQueries: [{ propertyName: "endRuleRadioButtons", predicate: EndRuleRadioButtonDirective, descendants: true }], ngImport: i0, template: `
127
+ <div class="k-form-field">
128
+ <kendo-label
129
+ [text]="textFor('endLabel')"
130
+ (click)="onEndLabelClick()"
131
+ labelCssClass="k-form-label"
132
+ ></kendo-label>
133
+ <div class="k-form-field-wrap">
134
+ <ul class='k-radio-list'>
135
+ <li class='k-radio-list-item'>
136
+ <span class="k-radio-wrap">
137
+ <input kendoRecurrenceEndRuleRadioButton='k-endrule-never-{{uniqueId}}' />
138
+ </span>
139
+ <label [labelClass]="false" class='k-radio-label' for='k-endrule-never-{{uniqueId}}'>{{ textFor('endNever') }}</label>
140
+ </li>
141
+ <li class='k-radio-list-item'>
142
+ <span class="k-radio-wrap">
143
+ <input kendoRecurrenceEndRuleRadioButton='k-endrule-count-{{uniqueId}}' />
144
+ </span>
145
+ <label [labelClass]="false" class='k-radio-label' for='k-endrule-count-{{uniqueId}}'>{{ textFor('endAfter') }}</label>
146
+ <kendo-numerictextbox
147
+ #afterOccurances
148
+ class="k-recur-count"
149
+ [style.width.px]='70'
150
+ [autoCorrect]='numericOptions.autoCorrect'
151
+ [decimals]='0'
152
+ [disabled]='isCountDisabled'
153
+ [format]="numericOptions.format"
154
+ [min]='numericOptions.min'
155
+ [max]="numericOptions.max"
156
+ [readonly]="numericOptions.readonly"
157
+ [selectOnFocus]="numericOptions.selectOnFocus"
158
+ [spinners]="numericOptions.spinners"
159
+ [step]="numericOptions.step"
160
+ [title]="numericOptions.title"
161
+ [(value)]='countValue'
162
+ (blur)="onCountBlur()"
163
+ (valueChange)='onCountChange($event)'>
164
+ </kendo-numerictextbox>
165
+ <span>{{ textFor('endOccurrence') }}</span>
166
+ </li>
167
+ <li class='k-radio-list-item'>
168
+ <span class="k-radio-wrap">
169
+ <input kendoRecurrenceEndRuleRadioButton='k-endrule-until-{{uniqueId}}' />
170
+ </span>
171
+ <label [labelClass]="false" class='k-radio-label' for='k-endrule-until-{{uniqueId}}'>{{ textFor('endOn') }}</label>
172
+ <kendo-datepicker
173
+ class="k-recur-until"
174
+ [style.width.px]='150'
175
+ [disabled]='isUntilDisabled'
176
+ [activeView]="datePickerOptions.activeView"
177
+ [bottomView]="datePickerOptions.bottomView"
178
+ [disabledDatesValidation]="datePickerOptions.disabledDatesValidation"
179
+ [focusedDate]="datePickerOptions.focusedDate"
180
+ [format]="datePickerOptions.format"
181
+ [formatPlaceholder]="datePickerOptions.formatPlaceHolder"
182
+ [max]="datePickerOptions.max"
183
+ [min]="datePickerOptions.min"
184
+ [navigation]="datePickerOptions.navigation"
185
+ [placeholder]="datePickerOptions.placeholder"
186
+ [readOnlyInput]="datePickerOptions.readOnlyInput"
187
+ [readonly]="datePickerOptions.readonly"
188
+ [title]="datePickerOptions.title"
189
+ [topView]="datePickerOptions.topView"
190
+ [weekNumber]="datePickerOptions.weekNumber"
191
+ [disabledDates]="datePickerOptions.disabledDates"
192
+ [popupSettings]="datePickerOptions.popupSettings"
193
+ [(value)]='untilValue'
194
+ (blur)="onUntilBlur()"
195
+ (valueChange)='onUntilChange($event)'>
196
+ </kendo-datepicker>
197
+ </li>
198
+ </ul>
199
+ </div>
188
200
  </div>
189
- `, isInline: true, components: [{ type: i3.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }, { type: i4.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i5.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-datepicker"] }], directives: [{ type: i6.EndRuleRadioButtonDirective, selector: "[kendoRecurrenceEndRuleRadioButton]", inputs: ["kendoRecurrenceEndRuleRadioButton"] }, { type: i4.LabelDirective, selector: "label[for]", inputs: ["for"] }] });
201
+ `, isInline: true, components: [{ type: i3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { type: i4.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }, { type: i5.DatePickerComponent, selector: "kendo-datepicker", inputs: ["focusableId", "cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate", "activeView", "bottomView", "topView", "calendarType", "animateCalendarNavigation", "disabled", "readonly", "readOnlyInput", "popupSettings", "navigation", "min", "max", "incompleteDateValidation", "focusedDate", "value", "format", "twoDigitYearMax", "formatPlaceholder", "placeholder", "tabindex", "tabIndex", "disabledDates", "title", "subtitle", "rangeValidation", "disabledDatesValidation", "weekNumber", "size", "rounded", "fillMode", "adaptiveMode"], outputs: ["valueChange", "focus", "blur", "open", "close"], exportAs: ["kendo-datepicker"] }], directives: [{ type: i6.EndRuleRadioButtonDirective, selector: "[kendoRecurrenceEndRuleRadioButton]", inputs: ["kendoRecurrenceEndRuleRadioButton"] }, { type: i3.LabelDirective, selector: "label[for]", inputs: ["for", "labelClass"] }] });
190
202
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceEndRuleEditorComponent, decorators: [{
191
203
  type: Component,
192
204
  args: [{
193
205
  selector: 'kendo-recurrence-end-rule-editor',
194
206
  template: `
195
- <div class='k-form-field'>
196
- <label class='k-form-label' (click)="onEndLabelClick()">{{ textFor('endLabel') }}</label>
197
-
198
- <ul class='k-form-field-wrap k-reset'>
199
- <li class='k-radio-item'>
200
- <input kendoRecurrenceEndRuleRadioButton='k-endrule-never-{{uniqueId}}' />
201
- <label class='k-radio-label' for='k-endrule-never-{{uniqueId}}'>{{ textFor('endNever') }}</label>
202
- </li>
203
- <li class='k-radio-item'>
204
- <input kendoRecurrenceEndRuleRadioButton='k-endrule-count-{{uniqueId}}' />
205
- <label class='k-radio-label' for='k-endrule-count-{{uniqueId}}'>{{ textFor('endAfter') }}</label>
206
-
207
- <kendo-numerictextbox
208
- #afterOccurances
209
- [style.width.px]='70'
210
- [autoCorrect]='numericOptions.autoCorrect'
211
- [decimals]='0'
212
- [disabled]='isCountDisabled'
213
- [format]="numericOptions.format"
214
- [min]='numericOptions.min'
215
- [max]="numericOptions.max"
216
- [readonly]="numericOptions.readonly"
217
- [selectOnFocus]="numericOptions.selectOnFocus"
218
- [spinners]="numericOptions.spinners"
219
- [step]="numericOptions.step"
220
- [title]="numericOptions.title"
221
- [(value)]='countValue'
222
- (blur)="onCountBlur()"
223
- (valueChange)='onCountChange($event)'>
224
- </kendo-numerictextbox>
225
- <kendo-label [for]="afterOccurances" [text]="textFor('endOccurrence')"></kendo-label>
226
- </li>
227
- <li class='k-radio-item'>
228
- <input kendoRecurrenceEndRuleRadioButton='k-endrule-until-{{uniqueId}}' />
229
- <label class='k-radio-label' for='k-endrule-until-{{uniqueId}}'>{{ textFor('endOn') }}</label>
230
-
231
- <kendo-datepicker
232
- [style.width.px]='150'
233
- [disabled]='isUntilDisabled'
234
- [activeView]="datePickerOptions.activeView"
235
- [bottomView]="datePickerOptions.bottomView"
236
- [disabledDatesValidation]="datePickerOptions.disabledDatesValidation"
237
- [focusedDate]="datePickerOptions.focusedDate"
238
- [format]="datePickerOptions.format"
239
- [formatPlaceholder]="datePickerOptions.formatPlaceHolder"
240
- [max]="datePickerOptions.max"
241
- [min]="datePickerOptions.min"
242
- [navigation]="datePickerOptions.navigation"
243
- [placeholder]="datePickerOptions.placeholder"
244
- [readOnlyInput]="datePickerOptions.readOnlyInput"
245
- [readonly]="datePickerOptions.readonly"
246
- [title]="datePickerOptions.title"
247
- [topView]="datePickerOptions.topView"
248
- [weekNumber]="datePickerOptions.weekNumber"
249
- [disabledDates]="datePickerOptions.disabledDates"
250
- [popupSettings]="datePickerOptions.popupSettings"
251
- [(value)]='untilValue'
252
- (blur)="onUntilBlur()"
253
- (valueChange)='onUntilChange($event)'>
254
- </kendo-datepicker>
255
- </li>
256
- </ul>
207
+ <div class="k-form-field">
208
+ <kendo-label
209
+ [text]="textFor('endLabel')"
210
+ (click)="onEndLabelClick()"
211
+ labelCssClass="k-form-label"
212
+ ></kendo-label>
213
+ <div class="k-form-field-wrap">
214
+ <ul class='k-radio-list'>
215
+ <li class='k-radio-list-item'>
216
+ <span class="k-radio-wrap">
217
+ <input kendoRecurrenceEndRuleRadioButton='k-endrule-never-{{uniqueId}}' />
218
+ </span>
219
+ <label [labelClass]="false" class='k-radio-label' for='k-endrule-never-{{uniqueId}}'>{{ textFor('endNever') }}</label>
220
+ </li>
221
+ <li class='k-radio-list-item'>
222
+ <span class="k-radio-wrap">
223
+ <input kendoRecurrenceEndRuleRadioButton='k-endrule-count-{{uniqueId}}' />
224
+ </span>
225
+ <label [labelClass]="false" class='k-radio-label' for='k-endrule-count-{{uniqueId}}'>{{ textFor('endAfter') }}</label>
226
+ <kendo-numerictextbox
227
+ #afterOccurances
228
+ class="k-recur-count"
229
+ [style.width.px]='70'
230
+ [autoCorrect]='numericOptions.autoCorrect'
231
+ [decimals]='0'
232
+ [disabled]='isCountDisabled'
233
+ [format]="numericOptions.format"
234
+ [min]='numericOptions.min'
235
+ [max]="numericOptions.max"
236
+ [readonly]="numericOptions.readonly"
237
+ [selectOnFocus]="numericOptions.selectOnFocus"
238
+ [spinners]="numericOptions.spinners"
239
+ [step]="numericOptions.step"
240
+ [title]="numericOptions.title"
241
+ [(value)]='countValue'
242
+ (blur)="onCountBlur()"
243
+ (valueChange)='onCountChange($event)'>
244
+ </kendo-numerictextbox>
245
+ <span>{{ textFor('endOccurrence') }}</span>
246
+ </li>
247
+ <li class='k-radio-list-item'>
248
+ <span class="k-radio-wrap">
249
+ <input kendoRecurrenceEndRuleRadioButton='k-endrule-until-{{uniqueId}}' />
250
+ </span>
251
+ <label [labelClass]="false" class='k-radio-label' for='k-endrule-until-{{uniqueId}}'>{{ textFor('endOn') }}</label>
252
+ <kendo-datepicker
253
+ class="k-recur-until"
254
+ [style.width.px]='150'
255
+ [disabled]='isUntilDisabled'
256
+ [activeView]="datePickerOptions.activeView"
257
+ [bottomView]="datePickerOptions.bottomView"
258
+ [disabledDatesValidation]="datePickerOptions.disabledDatesValidation"
259
+ [focusedDate]="datePickerOptions.focusedDate"
260
+ [format]="datePickerOptions.format"
261
+ [formatPlaceholder]="datePickerOptions.formatPlaceHolder"
262
+ [max]="datePickerOptions.max"
263
+ [min]="datePickerOptions.min"
264
+ [navigation]="datePickerOptions.navigation"
265
+ [placeholder]="datePickerOptions.placeholder"
266
+ [readOnlyInput]="datePickerOptions.readOnlyInput"
267
+ [readonly]="datePickerOptions.readonly"
268
+ [title]="datePickerOptions.title"
269
+ [topView]="datePickerOptions.topView"
270
+ [weekNumber]="datePickerOptions.weekNumber"
271
+ [disabledDates]="datePickerOptions.disabledDates"
272
+ [popupSettings]="datePickerOptions.popupSettings"
273
+ [(value)]='untilValue'
274
+ (blur)="onUntilBlur()"
275
+ (valueChange)='onUntilChange($event)'>
276
+ </kendo-datepicker>
277
+ </li>
278
+ </ul>
279
+ </div>
257
280
  </div>
258
281
  `
259
282
  }]
260
- }], ctorParameters: function () { return [{ type: i1.RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
283
+ }], ctorParameters: function () { return [{ type: i1.RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { cssClass: [{
284
+ type: HostBinding,
285
+ args: ['class.k-scheduler-recurrence-end-rule-editor']
286
+ }], userNumericOptions: [{
261
287
  type: Input
262
288
  }], userDatePickerOptions: [{
263
289
  type: Input
@@ -9,8 +9,9 @@ import { Button } from '@progress/kendo-angular-buttons';
9
9
  import * as i0 from "@angular/core";
10
10
  import * as i1 from "./recurrence.service";
11
11
  import * as i2 from "@progress/kendo-angular-l10n";
12
- import * as i3 from "@progress/kendo-angular-buttons";
13
- import * as i4 from "@angular/common";
12
+ import * as i3 from "@progress/kendo-angular-label";
13
+ import * as i4 from "@progress/kendo-angular-buttons";
14
+ import * as i5 from "@angular/common";
14
15
  /**
15
16
  * @hidden
16
17
  */
@@ -43,12 +44,18 @@ export class RecurrenceFrequencyEditorComponent {
43
44
  RecurrenceFrequencyEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceFrequencyEditorComponent, deps: [{ token: i1.RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
44
45
  RecurrenceFrequencyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: RecurrenceFrequencyEditorComponent, selector: "kendo-recurrence-frequency-editor", viewQueries: [{ propertyName: "weekDayButtons", predicate: Button, descendants: true }], ngImport: i0, template: `
45
46
  <div class='k-form-field'>
46
- <label class="k-form-label" (click)="onFrequencyClick()">{{ textFor('repeat') }}</label>
47
-
48
- <div class='k-form-field-wrap'>
49
- <kendo-buttongroup [selection]="'single'">
47
+ <kendo-label
48
+ [text]="textFor('repeat')"
49
+ (click)="onFrequencyClick()"
50
+ labelCssClass="k-form-label"
51
+ ></kendo-label>
52
+ <div class="k-form-field-wrap">
53
+ <kendo-buttongroup
54
+ class="k-scheduler-recurrence-repeat k-button-group-solid"
55
+ width="100%"
56
+ selection="single"
57
+ >
50
58
  <button *ngFor='let freq of frequencies' kendoButton
51
- [style.width.px]="100"
52
59
  [togglable]="true"
53
60
  [selected]="freq.value === selected"
54
61
  (click)="onClick(freq)"
@@ -56,19 +63,25 @@ RecurrenceFrequencyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersio
56
63
  </kendo-buttongroup>
57
64
  </div>
58
65
  </div>
59
- `, isInline: true, components: [{ type: i3.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { type: i3.Button, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], directives: [{ type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
66
+ `, isInline: true, components: [{ type: i3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { type: i4.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { type: i4.Button, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], directives: [{ type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
60
67
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceFrequencyEditorComponent, decorators: [{
61
68
  type: Component,
62
69
  args: [{
63
70
  selector: 'kendo-recurrence-frequency-editor',
64
71
  template: `
65
72
  <div class='k-form-field'>
66
- <label class="k-form-label" (click)="onFrequencyClick()">{{ textFor('repeat') }}</label>
67
-
68
- <div class='k-form-field-wrap'>
69
- <kendo-buttongroup [selection]="'single'">
73
+ <kendo-label
74
+ [text]="textFor('repeat')"
75
+ (click)="onFrequencyClick()"
76
+ labelCssClass="k-form-label"
77
+ ></kendo-label>
78
+ <div class="k-form-field-wrap">
79
+ <kendo-buttongroup
80
+ class="k-scheduler-recurrence-repeat k-button-group-solid"
81
+ width="100%"
82
+ selection="single"
83
+ >
70
84
  <button *ngFor='let freq of frequencies' kendoButton
71
- [style.width.px]="100"
72
85
  [togglable]="true"
73
86
  [selected]="freq.value === selected"
74
87
  (click)="onClick(freq)"
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2023 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { Component, Input } from '@angular/core';
5
+ import { Component, HostBinding, Input } from '@angular/core';
6
6
  import { RecurrenceService } from './recurrence.service';
7
7
  import { LocalizationService } from '@progress/kendo-angular-l10n';
8
8
  import { isPresent } from '../../common/util';
@@ -18,6 +18,7 @@ export class RecurrenceIntervalEditorComponent {
18
18
  constructor(recurrence, localization) {
19
19
  this.recurrence = recurrence;
20
20
  this.localization = localization;
21
+ this.cssClass = true;
21
22
  this.numericOptions = {
22
23
  min: 1,
23
24
  format: '#',
@@ -78,13 +79,18 @@ export class RecurrenceIntervalEditorComponent {
78
79
  }
79
80
  }
80
81
  RecurrenceIntervalEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceIntervalEditorComponent, deps: [{ token: i1.RecurrenceService }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
81
- RecurrenceIntervalEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: RecurrenceIntervalEditorComponent, selector: "kendo-recurrence-interval-editor", inputs: { userNumericOptions: "userNumericOptions" }, ngImport: i0, template: `
82
- <div class='k-form-field'>
83
- <kendo-label class="k-form-label" [for]="intervalNumeric" (click)="intervalNumeric.focus()" [text]="textForRepeatEvery()"></kendo-label>
82
+ RecurrenceIntervalEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: RecurrenceIntervalEditorComponent, selector: "kendo-recurrence-interval-editor", inputs: { userNumericOptions: "userNumericOptions" }, host: { properties: { "class.k-scheduler-recurrence-interval-editor": "this.cssClass" } }, ngImport: i0, template: `
83
+ <div class="k-form-field">
84
+ <kendo-label
85
+ [for]="intervalNumeric"
86
+ [text]="textForRepeatEvery()"
87
+ labelCssClass="k-form-label"
88
+ (click)="intervalNumeric.focus()"
89
+ ></kendo-label>
84
90
  <div class="k-form-field-wrap">
85
91
  <kendo-numerictextbox
86
92
  #intervalNumeric
87
- [style.width.px]="70"
93
+ class="k-recur-interval"
88
94
  [min]="numericOptions.min"
89
95
  [max]="numericOptions.max"
90
96
  [decimals]="0"
@@ -99,22 +105,26 @@ RecurrenceIntervalEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion
99
105
  (blur)="onIntervalBlur()"
100
106
  (valueChange)="onIntervalChange($event)">
101
107
  </kendo-numerictextbox>
102
-
103
- <span>{{ textForFrequency() }}</span>
108
+ <span>&nbsp;{{ textForFrequency() }}</span>
104
109
  </div>
105
110
  </div>
106
- `, isInline: true, components: [{ type: i3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i4.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }] });
111
+ `, isInline: true, components: [{ type: i3.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { type: i4.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }] });
107
112
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: RecurrenceIntervalEditorComponent, decorators: [{
108
113
  type: Component,
109
114
  args: [{
110
115
  selector: 'kendo-recurrence-interval-editor',
111
116
  template: `
112
- <div class='k-form-field'>
113
- <kendo-label class="k-form-label" [for]="intervalNumeric" (click)="intervalNumeric.focus()" [text]="textForRepeatEvery()"></kendo-label>
117
+ <div class="k-form-field">
118
+ <kendo-label
119
+ [for]="intervalNumeric"
120
+ [text]="textForRepeatEvery()"
121
+ labelCssClass="k-form-label"
122
+ (click)="intervalNumeric.focus()"
123
+ ></kendo-label>
114
124
  <div class="k-form-field-wrap">
115
125
  <kendo-numerictextbox
116
126
  #intervalNumeric
117
- [style.width.px]="70"
127
+ class="k-recur-interval"
118
128
  [min]="numericOptions.min"
119
129
  [max]="numericOptions.max"
120
130
  [decimals]="0"
@@ -129,12 +139,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
129
139
  (blur)="onIntervalBlur()"
130
140
  (valueChange)="onIntervalChange($event)">
131
141
  </kendo-numerictextbox>
132
-
133
- <span>{{ textForFrequency() }}</span>
142
+ <span>&nbsp;{{ textForFrequency() }}</span>
134
143
  </div>
135
144
  </div>
136
145
  `
137
146
  }]
138
- }], ctorParameters: function () { return [{ type: i1.RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { userNumericOptions: [{
147
+ }], ctorParameters: function () { return [{ type: i1.RecurrenceService }, { type: i2.LocalizationService }]; }, propDecorators: { cssClass: [{
148
+ type: HostBinding,
149
+ args: ['class.k-scheduler-recurrence-interval-editor']
150
+ }], userNumericOptions: [{
139
151
  type: Input
140
152
  }] } });