@progress/kendo-angular-scheduler 19.1.2-develop.4 → 19.1.2-develop.5
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.
- package/data-binding.directive.d.ts +12 -3
- package/directives.d.ts +42 -2
- package/editing/edit-dialog-template.directive.d.ts +15 -2
- package/editing/recurrence/recurrence-editor.component.d.ts +29 -10
- package/editing/timezone-editor.component.d.ts +13 -3
- package/editing-directives/base-edit.service.d.ts +8 -11
- package/editing-directives/edit-service.interface.d.ts +22 -24
- package/editing-directives/reactive-editing.directive.d.ts +15 -2
- package/esm2022/data-binding.directive.mjs +12 -3
- package/esm2022/directives.mjs +42 -2
- package/esm2022/editing/edit-dialog-template.directive.mjs +15 -2
- package/esm2022/editing/recurrence/recurrence-editor.component.mjs +29 -10
- package/esm2022/editing/timezone-editor.component.mjs +13 -3
- package/esm2022/editing-directives/base-edit.service.mjs +8 -11
- package/esm2022/editing-directives/reactive-editing.directive.mjs +15 -2
- package/esm2022/events/add-event.mjs +3 -3
- package/esm2022/events/cancel-event.mjs +2 -2
- package/esm2022/events/create-event.mjs +6 -6
- package/esm2022/events/date-change-event.mjs +4 -4
- package/esm2022/events/drag-end-event.mjs +8 -8
- package/esm2022/events/drag-event.mjs +8 -8
- package/esm2022/events/drag-start-event.mjs +4 -4
- package/esm2022/events/edit-event.mjs +4 -4
- package/esm2022/events/event-click-event.mjs +5 -5
- package/esm2022/events/event-keydown-event.mjs +4 -4
- package/esm2022/events/navigate-event.mjs +3 -3
- package/esm2022/events/remove-event.mjs +4 -4
- package/esm2022/events/resize-end-event.mjs +6 -6
- package/esm2022/events/resize-event.mjs +8 -8
- package/esm2022/events/resize-start-event.mjs +4 -4
- package/esm2022/events/save-event.mjs +3 -3
- package/esm2022/events/slot-click-event.mjs +7 -7
- package/esm2022/events/slot-drag-end-event.mjs +1 -1
- package/esm2022/events/slot-drag-event.mjs +7 -7
- package/esm2022/events/slot-drag-start-event.mjs +8 -7
- package/esm2022/localization/custom-messages.component.mjs +14 -1
- package/esm2022/localization/messages.mjs +98 -98
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/pdf/pdf-command.directive.mjs +11 -11
- package/esm2022/pdf/pdf-export-event.mjs +1 -1
- package/esm2022/pdf/pdf.component.mjs +19 -8
- package/esm2022/pdf/pdf.module.mjs +7 -8
- package/esm2022/scheduler.component.mjs +62 -62
- package/esm2022/scheduler.module.mjs +6 -7
- package/esm2022/toolbar/navigation.component.mjs +16 -7
- package/esm2022/toolbar/toolbar-template.directive.mjs +18 -10
- package/esm2022/toolbar/toolbar.service.mjs +3 -4
- package/esm2022/toolbar/view-selector.component.mjs +14 -8
- package/esm2022/types/crud-operation.enum.mjs +3 -3
- package/esm2022/types/edit-mode.enum.mjs +2 -2
- package/esm2022/types/scheduler-view.mjs +1 -1
- package/esm2022/views/agenda/agenda-view.component.mjs +15 -11
- package/esm2022/views/common/slot-selectable.directive.mjs +16 -4
- package/esm2022/views/month/month-view.component.mjs +17 -16
- package/esm2022/views/month/multi-week-view.component.mjs +20 -18
- package/esm2022/views/multi-day/day-view.component.mjs +12 -7
- package/esm2022/views/multi-day/multi-day-view.component.mjs +16 -11
- package/esm2022/views/multi-day/week-view.component.mjs +14 -11
- package/esm2022/views/multi-day/work-week-view.component.mjs +8 -1
- package/esm2022/views/scheduler-view.directive.mjs +13 -3
- package/esm2022/views/templates/agenda-date-template.directive.mjs +13 -3
- package/esm2022/views/templates/agenda-time-template.directive.mjs +13 -3
- package/esm2022/views/templates/all-day-event-template.directive.mjs +13 -3
- package/esm2022/views/templates/all-day-slot-template.directive.mjs +13 -3
- package/esm2022/views/templates/date-header-template.directive.mjs +14 -4
- package/esm2022/views/templates/event-template.directive.mjs +13 -3
- package/esm2022/views/templates/group-header-template.directive.mjs +14 -4
- package/esm2022/views/templates/major-time-header-template.directive.mjs +13 -3
- package/esm2022/views/templates/minor-time-header-template.directive.mjs +13 -3
- package/esm2022/views/templates/month-day-slot-template.directive.mjs +13 -3
- package/esm2022/views/templates/multi-week-day-slot-template.directive.mjs +12 -3
- package/esm2022/views/templates/time-slot-template.directive.mjs +14 -4
- package/esm2022/views/timeline/timeline-month-view.component.mjs +16 -11
- package/esm2022/views/timeline/timeline-view.component.mjs +16 -11
- package/esm2022/views/timeline/timeline-week-view.component.mjs +18 -14
- package/esm2022/views/view-context.service.mjs +6 -6
- package/esm2022/views/view-state.service.mjs +9 -9
- package/esm2022/views/year/year-view.component.mjs +12 -7
- package/events/add-event.d.ts +3 -3
- package/events/cancel-event.d.ts +2 -2
- package/events/create-event.d.ts +6 -6
- package/events/date-change-event.d.ts +4 -4
- package/events/drag-end-event.d.ts +8 -8
- package/events/drag-event.d.ts +8 -8
- package/events/drag-start-event.d.ts +4 -4
- package/events/edit-event.d.ts +4 -4
- package/events/event-click-event.d.ts +5 -5
- package/events/event-keydown-event.d.ts +4 -4
- package/events/navigate-event.d.ts +3 -3
- package/events/remove-event.d.ts +4 -4
- package/events/resize-end-event.d.ts +6 -6
- package/events/resize-event.d.ts +8 -8
- package/events/resize-start-event.d.ts +4 -4
- package/events/save-event.d.ts +3 -3
- package/events/slot-click-event.d.ts +7 -7
- package/events/slot-drag-end-event.d.ts +1 -1
- package/events/slot-drag-event.d.ts +7 -7
- package/events/slot-drag-start-event.d.ts +8 -7
- package/fesm2022/progress-kendo-angular-scheduler.mjs +876 -543
- package/localization/custom-messages.component.d.ts +14 -1
- package/localization/messages.d.ts +98 -98
- package/navigation/focus-position.interface.d.ts +2 -3
- package/package.json +15 -15
- package/pdf/pdf-command.directive.d.ts +11 -11
- package/pdf/pdf-export-event.d.ts +1 -1
- package/pdf/pdf.component.d.ts +19 -8
- package/pdf/pdf.module.d.ts +7 -8
- package/scheduler.component.d.ts +62 -62
- package/scheduler.module.d.ts +6 -7
- package/schematics/ngAdd/index.js +3 -3
- package/toolbar/navigation.component.d.ts +16 -7
- package/toolbar/toolbar-template.directive.d.ts +18 -10
- package/toolbar/toolbar.service.d.ts +3 -4
- package/toolbar/view-selector.component.d.ts +14 -8
- package/types/actions.d.ts +51 -45
- package/types/create-form-group-args.interface.d.ts +1 -1
- package/types/crud-operation.enum.d.ts +3 -3
- package/types/current-time-settings.interface.d.ts +10 -8
- package/types/date-range.interface.d.ts +7 -11
- package/types/datepicker-options.interface.d.ts +33 -38
- package/types/edit-event-args.interface.d.ts +3 -4
- package/types/edit-mode.enum.d.ts +2 -2
- package/types/editable-settings.interface.d.ts +6 -6
- package/types/event-style-args.interface.d.ts +4 -4
- package/types/group.interface.d.ts +2 -2
- package/types/numeric-options.interface.d.ts +20 -16
- package/types/ongoing-events-settings.interface.d.ts +8 -6
- package/types/resource.interface.d.ts +8 -8
- package/types/scheduler-event.d.ts +13 -15
- package/types/scheduler-model-fields.interface.d.ts +34 -23
- package/types/scheduler-slot.interface.d.ts +7 -7
- package/types/scheduler-view.d.ts +3 -5
- package/types/slot-class-args.interface.d.ts +6 -6
- package/types/view-item.interface.d.ts +1 -1
- package/views/agenda/agenda-view.component.d.ts +15 -11
- package/views/common/slot-selectable.directive.d.ts +16 -4
- package/views/month/month-view.component.d.ts +17 -16
- package/views/month/multi-week-view.component.d.ts +20 -18
- package/views/multi-day/day-view.component.d.ts +12 -7
- package/views/multi-day/multi-day-view.component.d.ts +16 -11
- package/views/multi-day/week-view.component.d.ts +14 -11
- package/views/multi-day/work-week-view.component.d.ts +8 -1
- package/views/scheduler-view.directive.d.ts +13 -3
- package/views/templates/agenda-date-template.directive.d.ts +13 -3
- package/views/templates/agenda-time-template.directive.d.ts +13 -3
- package/views/templates/all-day-event-template.directive.d.ts +13 -3
- package/views/templates/all-day-slot-template.directive.d.ts +13 -3
- package/views/templates/date-header-template.directive.d.ts +14 -4
- package/views/templates/event-template.directive.d.ts +13 -3
- package/views/templates/group-header-template.directive.d.ts +14 -4
- package/views/templates/major-time-header-template.directive.d.ts +13 -3
- package/views/templates/minor-time-header-template.directive.d.ts +13 -3
- package/views/templates/month-day-slot-template.directive.d.ts +13 -3
- package/views/templates/multi-week-day-slot-template.directive.d.ts +12 -3
- package/views/templates/time-slot-template.directive.d.ts +14 -4
- package/views/timeline/timeline-month-view.component.d.ts +16 -11
- package/views/timeline/timeline-view.component.d.ts +16 -11
- package/views/timeline/timeline-week-view.component.d.ts +18 -14
- package/views/view-context.service.d.ts +6 -6
- package/views/view-state.service.d.ts +9 -9
- package/views/year/year-view.component.d.ts +12 -7
|
@@ -9,10 +9,19 @@ import { LocalDataChangesService } from './editing/local-data-changes.service';
|
|
|
9
9
|
import { IntlService } from '@progress/kendo-angular-intl';
|
|
10
10
|
import * as i0 from "@angular/core";
|
|
11
11
|
/**
|
|
12
|
-
* A directive that processes Scheduler events in
|
|
12
|
+
* A directive that processes Scheduler events in memory ([see example](slug:databinding_scheduler#toc-using-the-built-in-directive)).
|
|
13
13
|
*
|
|
14
|
-
* Processing includes
|
|
14
|
+
* Processing includes expanding of recurring events and filtering data for
|
|
15
15
|
* the currently active period.
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* ```html
|
|
19
|
+
* <kendo-scheduler [kendoSchedulerBinding]="data">
|
|
20
|
+
* </kendo-scheduler>
|
|
21
|
+
* ```
|
|
22
|
+
*
|
|
23
|
+
* @remarks
|
|
24
|
+
* Applied to: {@link SchedulerComponent}
|
|
16
25
|
*/
|
|
17
26
|
export declare class DataBindingDirective implements OnInit, OnDestroy {
|
|
18
27
|
protected scheduler: SchedulerComponent;
|
|
@@ -20,7 +29,7 @@ export declare class DataBindingDirective implements OnInit, OnDestroy {
|
|
|
20
29
|
protected intl: IntlService;
|
|
21
30
|
protected localDataChangesService?: LocalDataChangesService;
|
|
22
31
|
/**
|
|
23
|
-
*
|
|
32
|
+
* Sets the data array for the Scheduler.
|
|
24
33
|
*/
|
|
25
34
|
set data(value: any[]);
|
|
26
35
|
protected dateRange: DateRange;
|
package/directives.d.ts
CHANGED
|
@@ -41,10 +41,50 @@ import { MultiWeekDaySlotTemplateDirective } from './views/templates/multi-week-
|
|
|
41
41
|
import { TimeSlotTemplateDirective } from './views/templates/time-slot-template.directive';
|
|
42
42
|
import { ShortcutsDirective } from './navigation/shortcuts.directive';
|
|
43
43
|
/**
|
|
44
|
-
* Utility array that contains all
|
|
44
|
+
* Utility array that contains all `@progress/kendo-angular-scheduler` PDF-related components and directives.
|
|
45
|
+
*
|
|
46
|
+
* Use the `KENDO_SCHEDULERPDF` array to import all PDF export features for the Scheduler.
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* ```ts
|
|
50
|
+
* import { KENDO_SCHEDULER, KENDO_SCHEDULERPDF } from '@progress/kendo-angular-scheduler';
|
|
51
|
+
*
|
|
52
|
+
* @Component({
|
|
53
|
+
* standalone: true,
|
|
54
|
+
* imports: [KENDO_SCHEDULER, KENDO_SCHEDULERPDF],
|
|
55
|
+
* template: `
|
|
56
|
+
* <kendo-scheduler [kendoSchedulerBinding]="events">
|
|
57
|
+
* <ng-template kendoSchedulerToolbarTemplate>
|
|
58
|
+
* <button kendoSchedulerPDFCommand>Export PDF</button>
|
|
59
|
+
* </ng-template>
|
|
60
|
+
* <kendo-scheduler-day-view></kendo-scheduler-day-view>
|
|
61
|
+
* <kendo-scheduler-pdf fileName="scheduler.pdf"></kendo-scheduler-pdf>
|
|
62
|
+
* </kendo-scheduler>
|
|
63
|
+
* `
|
|
64
|
+
* })
|
|
65
|
+
* export class AppComponent {}
|
|
66
|
+
* ```
|
|
45
67
|
*/
|
|
46
68
|
export declare const KENDO_SCHEDULERPDF: readonly [typeof PDFComponent, typeof PDFCommandDirective];
|
|
47
69
|
/**
|
|
48
|
-
* Utility array that contains all `@progress/kendo-angular-scheduler
|
|
70
|
+
* Utility array that contains all `@progress/kendo-angular-scheduler`-related components and directives.
|
|
71
|
+
*
|
|
72
|
+
* Use the `KENDO_SCHEDULER` array to import all Scheduler features in your Angular application.
|
|
73
|
+
*
|
|
74
|
+
* @example
|
|
75
|
+
* ```ts
|
|
76
|
+
* import { KENDO_SCHEDULER } from '@progress/kendo-angular-scheduler';
|
|
77
|
+
*
|
|
78
|
+
* @Component({
|
|
79
|
+
* standalone: true,
|
|
80
|
+
* imports: [KENDO_SCHEDULER],
|
|
81
|
+
* template: `
|
|
82
|
+
* <kendo-scheduler [kendoSchedulerBinding]="events">
|
|
83
|
+
* <kendo-scheduler-day-view></kendo-scheduler-day-view>
|
|
84
|
+
* </kendo-scheduler>
|
|
85
|
+
* `
|
|
86
|
+
* })
|
|
87
|
+
* export class AppComponent {}
|
|
88
|
+
* ```
|
|
49
89
|
*/
|
|
50
90
|
export declare const KENDO_SCHEDULER: readonly [typeof SchedulerComponent, typeof SchedulerCustomMessagesComponent, typeof SchedulerViewDirective, typeof DataBindingDirective, typeof SlotSelectableDirective, typeof PDFComponent, typeof PDFCommandDirective, typeof ShortcutsDirective, typeof AgendaViewComponent, typeof DayViewComponent, typeof MonthViewComponent, typeof MultiDayViewComponent, typeof MultiWeekViewComponent, typeof TimelineMonthViewComponent, typeof TimelineViewComponent, typeof TimelineWeekViewComponent, typeof WeekViewComponent, typeof WorkWeekViewComponent, typeof YearViewComponent, typeof ReactiveEditingDirective, typeof RecurrenceEditorComponent, typeof TimeZoneEditorComponent, typeof ToolbarNavigationComponent, typeof ToolbarTemplateDirective, typeof ToolbarViewSelectorComponent, typeof AgendaDateTemplateDirective, typeof AgendaTimeTemplateDirective, typeof AllDayEventTemplateDirective, typeof AllDaySlotTemplateDirective, typeof DateHeaderTemplateDirective, typeof EventTemplateDirective, typeof EditDialogTemplateDirective, typeof GroupHeaderTemplateDirective, typeof MajorTimeHeaderTemplateDirective, typeof MinorTimeHeaderTemplateDirective, typeof MonthDaySlotTemplateDirective, typeof MultiWeekDaySlotTemplateDirective, typeof TimeSlotTemplateDirective];
|
|
@@ -5,15 +5,28 @@
|
|
|
5
5
|
import { TemplateRef } from '@angular/core';
|
|
6
6
|
import * as i0 from "@angular/core";
|
|
7
7
|
/**
|
|
8
|
-
* Represents the template for the edit dialog
|
|
8
|
+
* Represents the template directive for customizing the Scheduler edit dialog.
|
|
9
9
|
* To define the template, nest an `<ng-template>` tag
|
|
10
10
|
* with the `kendoSchedulerEditDialogTemplate` directive inside the `<kendo-scheduler>` tag ([see example](slug:custom_reactive_editing_scheduler)).
|
|
11
11
|
*
|
|
12
|
-
* The template context is set to the current event and
|
|
12
|
+
* The template context is set to the current event and the following additional fields are passed:
|
|
13
13
|
* - `event`—The currently edited event. Represents the default context that will be assigned to any template variable which utilizes the `let-x` syntax—for example, `let-event`.
|
|
14
14
|
* - `formGroup`—The current [`FormGroup`](https://angular.io/docs/ts/latest/api/forms/index/FormGroup-class.html).
|
|
15
15
|
* - `editMode`—The current edit mode.
|
|
16
16
|
* - `isNew`—The state of the current event.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ```html
|
|
20
|
+
* <kendo-scheduler>
|
|
21
|
+
* <ng-template kendoSchedulerEditDialogTemplate let-formGroup="formGroup" let-isNew="isNew"
|
|
22
|
+
* autoFocusedElement=".title-input" let-editMode="editMode" let-event>
|
|
23
|
+
* <div>
|
|
24
|
+
* <label>Title:</label>
|
|
25
|
+
* <kendo-textbox placeholder="Title" [formControl]="formGroup.get('title') />
|
|
26
|
+
* </div>
|
|
27
|
+
* </ng-template>
|
|
28
|
+
* </kendo-scheduler>
|
|
29
|
+
* ```
|
|
17
30
|
*/
|
|
18
31
|
export declare class EditDialogTemplateDirective {
|
|
19
32
|
templateRef: TemplateRef<any>;
|
|
@@ -15,45 +15,64 @@ import * as i0 from "@angular/core";
|
|
|
15
15
|
*/
|
|
16
16
|
export declare const RECURRENCE_VALUE_ACCESSOR: any;
|
|
17
17
|
/**
|
|
18
|
-
* Represents the Kendo UI Recurrence Editor component for Angular.
|
|
18
|
+
* Represents the Kendo UI Recurrence Editor component for Angular. Use this component to let users set recurrence rules for Scheduler events.
|
|
19
|
+
*
|
|
20
|
+
* [This example](slug:custom_reactive_editing_scheduler) demonstrates the Recurrence Editor, among other components.
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```html
|
|
24
|
+
* <kendo-scheduler
|
|
25
|
+
* [kendoSchedulerBinding]="events"
|
|
26
|
+
* [kendoSchedulerReactiveEditing]="createFormGroup"
|
|
27
|
+
* >
|
|
28
|
+
* <ng-template kendoSchedulerEditDialogTemplate let-formGroup="formGroup" let-event>
|
|
29
|
+
* <kendo-formfield>
|
|
30
|
+
* <kendo-recurrence-editor
|
|
31
|
+
* [start]="event.value.start"
|
|
32
|
+
* [formControl]="formGroup.get('recurrenceRule')"
|
|
33
|
+
* ></kendo-recurrence-editor>
|
|
34
|
+
* </kendo-formfield>
|
|
35
|
+
* </ng-template>
|
|
36
|
+
* </kendo-scheduler>
|
|
37
|
+
* ```
|
|
19
38
|
*/
|
|
20
39
|
export declare class RecurrenceEditorComponent implements ControlValueAccessor, OnInit, OnDestroy {
|
|
21
40
|
private recurrenceService;
|
|
22
41
|
private intl;
|
|
23
42
|
cssClass: boolean;
|
|
24
43
|
/**
|
|
25
|
-
*
|
|
44
|
+
* Sets the start date for the event.
|
|
26
45
|
*/
|
|
27
46
|
set start(value: Date);
|
|
28
47
|
get start(): Date;
|
|
29
48
|
/**
|
|
30
|
-
*
|
|
49
|
+
* Sets the id of the timezone to use.
|
|
50
|
+
*
|
|
31
51
|
* @default 'Etc/UTC'
|
|
32
52
|
*/
|
|
33
53
|
timezone: string;
|
|
34
54
|
/**
|
|
35
|
-
*
|
|
55
|
+
* Sets the first day of the week. Uses the locale settings by default.
|
|
36
56
|
*/
|
|
37
57
|
weekStart: Day;
|
|
38
58
|
/**
|
|
39
|
-
*
|
|
59
|
+
* Sets the options for the **Repeat Every** NumericTextBox in the recurrence `interval` editor.
|
|
40
60
|
*/
|
|
41
61
|
repeatEveryOptions: NumericTextBoxOptions;
|
|
42
62
|
/**
|
|
43
|
-
*
|
|
63
|
+
* Sets the options for the **End After** NumericTextBox in the recurrence `count` rule editor.
|
|
44
64
|
*/
|
|
45
65
|
endAfterOptions: NumericTextBoxOptions;
|
|
46
66
|
/**
|
|
47
|
-
*
|
|
48
|
-
* an event will occur on within the monthly and yearly sections of the recurrence editor.
|
|
67
|
+
* Sets the options for the **Repeat On** NumericTextBox for choosing the day an event occurs in the monthly and yearly sections.
|
|
49
68
|
*/
|
|
50
69
|
repeatOnOptions: NumericTextBoxOptions;
|
|
51
70
|
/**
|
|
52
|
-
*
|
|
71
|
+
* Sets the options for the **End On** DatePicker in the recurrence `until` rule editor.
|
|
53
72
|
*/
|
|
54
73
|
endOnOptions: DatePickerOptions;
|
|
55
74
|
/**
|
|
56
|
-
* Fires when the value of the component
|
|
75
|
+
* Fires when the value of the component changes.
|
|
57
76
|
*/
|
|
58
77
|
valueChange: EventEmitter<string>;
|
|
59
78
|
private _start;
|
|
@@ -13,15 +13,25 @@ import * as i0 from "@angular/core";
|
|
|
13
13
|
export declare const TIME_ZONE_VALUE_ACCESSOR: any;
|
|
14
14
|
/**
|
|
15
15
|
* Represents the Kendo UI TimeZone Editor component for Angular.
|
|
16
|
-
*
|
|
17
|
-
*
|
|
16
|
+
*
|
|
17
|
+
* Displays a ComboBox for selecting time zone names, used for editing the `start` and `end` time zones of Scheduler events.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* ```html
|
|
21
|
+
* <kendo-scheduler>
|
|
22
|
+
* <ng-template kendoSchedulerEditDialogTemplate>
|
|
23
|
+
* <div> Select Time Zone:
|
|
24
|
+
* <kendo-timezone-editor></kendo-timezone-editor>
|
|
25
|
+
* </div>
|
|
26
|
+
* </ng-template>
|
|
27
|
+
* </kendo-scheduler>
|
|
18
28
|
*/
|
|
19
29
|
export declare class TimeZoneEditorComponent implements ControlValueAccessor {
|
|
20
30
|
private injector;
|
|
21
31
|
tzComboBox: ComboBoxComponent;
|
|
22
32
|
tzComboBoxControl: ComboBoxComponent;
|
|
23
33
|
/**
|
|
24
|
-
* Specifies the width of the ComboBox
|
|
34
|
+
* Specifies the width of the ComboBox that contains the names of the timezones.
|
|
25
35
|
* @default 260
|
|
26
36
|
*/
|
|
27
37
|
width: number;
|
|
@@ -6,27 +6,24 @@ import { EditService } from './edit-service.interface';
|
|
|
6
6
|
import { SchedulerModelFields } from '../types';
|
|
7
7
|
import { BehaviorSubject, Observable } from 'rxjs';
|
|
8
8
|
/**
|
|
9
|
-
*
|
|
9
|
+
* Represents a base implementation of the [edit service](slug:api_scheduler_editservice) that persists data to CRUD services such as OData.
|
|
10
10
|
*
|
|
11
|
-
* To
|
|
12
|
-
* implement the `read` operation, which is not called directly by the base class, and the `save` method which persists the created,
|
|
13
|
-
* updated, and deleted entities.
|
|
11
|
+
* To use custom models, pass a [field map](slug:api_scheduler_schedulermodelfields) as a constructor parameter in the `BaseEditService` implementation. Subclasses must implement the `read` operation (that is not called directly by the base class) and the `save` method to persist created, updated, and deleted entities.
|
|
14
12
|
*
|
|
15
|
-
* The [`events`](#toc-events) observable
|
|
16
|
-
* ([more information]({% slug editing_directives_scheduler %}#toc-custom-service)).
|
|
13
|
+
* The [`events`](#toc-events) observable publishes the current data when you subscribe, for example, by using an [async pipe](https://angular.io/api/common/AsyncPipe) ([more information](slug:editing_directives_scheduler#toc-custom-service)).
|
|
17
14
|
*
|
|
18
|
-
* Implementations
|
|
19
|
-
* [`EditService`](
|
|
15
|
+
* Implementations that utilize dedicated services, such as Google Calendar and Microsoft Exchange, typically implement the
|
|
16
|
+
* [`EditService`](slug:api_scheduler_editservice) of the Scheduler directly.
|
|
20
17
|
*
|
|
21
|
-
* See example in [this article](
|
|
18
|
+
* See example in [this article](slug:custom_reactive_editing_scheduler).
|
|
22
19
|
*/
|
|
23
20
|
export declare abstract class BaseEditService<TEvent> implements EditService<TEvent> {
|
|
24
21
|
/**
|
|
25
|
-
*
|
|
22
|
+
* Holds the model field map used for reading and updating data items.
|
|
26
23
|
*/
|
|
27
24
|
readonly fields: SchedulerModelFields;
|
|
28
25
|
/**
|
|
29
|
-
*
|
|
26
|
+
* Emits the current events as an observable stream.
|
|
30
27
|
*/
|
|
31
28
|
readonly events: Observable<TEvent[]>;
|
|
32
29
|
/**
|
|
@@ -3,71 +3,69 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
/**
|
|
6
|
-
*
|
|
6
|
+
* Defines the interface for a service that the reactive and template editing directives of the Scheduler use to persist changes made during editing.
|
|
7
7
|
*
|
|
8
|
-
* * [Custom Service](
|
|
9
|
-
* * [`BaseEditService`](
|
|
8
|
+
* * [Custom Service](slug:editing_directives_scheduler#custom-service)
|
|
9
|
+
* * [`BaseEditService`](slug:api_scheduler_baseeditservice)
|
|
10
10
|
*/
|
|
11
11
|
export interface EditService<TEvent> {
|
|
12
12
|
/**
|
|
13
13
|
* Creates a new event.
|
|
14
14
|
*
|
|
15
|
-
* @param event
|
|
15
|
+
* @param event The event to create.
|
|
16
16
|
*/
|
|
17
17
|
create(event: TEvent): void;
|
|
18
18
|
/**
|
|
19
|
-
* Creates an exception
|
|
20
|
-
* or the custom field that is set by the model map will point to the master recurring event.
|
|
19
|
+
* Creates an exception for an existing recurring event. The `recurrenceId` field of the exception or the custom field set by the model map points to the master event.
|
|
21
20
|
*
|
|
22
|
-
* @param event
|
|
23
|
-
* @param value
|
|
21
|
+
* @param event The occurrence to remove from the series.
|
|
22
|
+
* @param value An object with the updated field values, for example, a form group value.
|
|
24
23
|
*/
|
|
25
24
|
createException(event: TEvent, value: any): void;
|
|
26
25
|
/**
|
|
27
|
-
* Updates the
|
|
26
|
+
* Updates the event by copying changed fields from the `value` object.
|
|
28
27
|
*
|
|
29
|
-
* @param event
|
|
30
|
-
* @param value
|
|
28
|
+
* @param event The event to update.
|
|
29
|
+
* @param value An object with the new field values, for example, a form group value.
|
|
31
30
|
*/
|
|
32
31
|
update(event: TEvent, value: any): void;
|
|
33
32
|
/**
|
|
34
33
|
* Removes a non-recurring event.
|
|
35
34
|
*
|
|
36
|
-
* @param event
|
|
35
|
+
* @param event The event to remove.
|
|
37
36
|
*/
|
|
38
37
|
remove(event: TEvent): void;
|
|
39
38
|
/**
|
|
40
|
-
* Removes the recurrence series and exceptions
|
|
39
|
+
* Removes the recurrence series and any exceptions.
|
|
41
40
|
*
|
|
42
|
-
* @param event
|
|
41
|
+
* @param event Any event from the recurrence series.
|
|
43
42
|
*/
|
|
44
43
|
removeSeries(event: TEvent): void;
|
|
45
44
|
/**
|
|
46
|
-
* Removes a single occurrence from a
|
|
47
|
-
* or the custom field which is set by a model map will point to the master recurring event.
|
|
45
|
+
* Removes a single occurrence from a recurring series. The `recurrenceId` field of the occurrence or the custom field set by a model map points to the master event.
|
|
48
46
|
*
|
|
49
|
-
* @param event
|
|
47
|
+
* @param event The occurrence to remove.
|
|
50
48
|
*/
|
|
51
49
|
removeOccurrence(event: TEvent): void;
|
|
52
50
|
/**
|
|
53
51
|
* Returns the master recurring event for a specified recurring event.
|
|
54
52
|
*
|
|
55
|
-
* @param event
|
|
56
|
-
* @returns
|
|
53
|
+
* @param event An event from the recurrence series.
|
|
54
|
+
* @returns The master recurring event for the series.
|
|
57
55
|
*/
|
|
58
56
|
findRecurrenceMaster(event: TEvent): TEvent;
|
|
59
57
|
/**
|
|
60
|
-
* Checks if the event is part of
|
|
58
|
+
* Checks if the event is part of a recurrence series.
|
|
61
59
|
*
|
|
62
|
-
* @param event
|
|
63
|
-
* @returns `true` if the event is an occurrence,
|
|
60
|
+
* @param event The event to check.
|
|
61
|
+
* @returns `true` if the event is an occurrence, exception, or master event. Otherwise, returns `false`.
|
|
64
62
|
*/
|
|
65
63
|
isRecurring(event: TEvent): boolean;
|
|
66
64
|
/**
|
|
67
65
|
* Checks if the event is a recurrence exception.
|
|
68
66
|
*
|
|
69
|
-
* @param event
|
|
70
|
-
* @returns `true` if the event is a unique event
|
|
67
|
+
* @param event The event to check.
|
|
68
|
+
* @returns `true` if the event is a unique event that belongs to a recurrence series. Otherwise, returns `false`.
|
|
71
69
|
*/
|
|
72
70
|
isException(event: TEvent): boolean;
|
|
73
71
|
}
|
|
@@ -11,8 +11,21 @@ import { DialogsService } from '../editing/dialogs.service';
|
|
|
11
11
|
import { FocusService } from "../navigation";
|
|
12
12
|
import * as i0 from "@angular/core";
|
|
13
13
|
/**
|
|
14
|
-
* A directive
|
|
15
|
-
*
|
|
14
|
+
* A directive that encapsulates editing operations for the Scheduler using [Angular Reactive Forms](link:site.data.urls.angular['reactiveforms']) ([see example](slug:editing_directives_scheduler)).
|
|
15
|
+
*
|
|
16
|
+
* Handles event editing, saving, and form validation logic for the Scheduler component.
|
|
17
|
+
* Provides integration with custom form group creation and supports recurring event editing scenarios.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* ```html
|
|
21
|
+
* <kendo-scheduler
|
|
22
|
+
* [kendoSchedulerBinding]="events"
|
|
23
|
+
* [kendoSchedulerReactiveEditing]="createFormGroup">
|
|
24
|
+
* </kendo-scheduler>
|
|
25
|
+
* ```
|
|
26
|
+
*
|
|
27
|
+
* @remarks
|
|
28
|
+
* Applied to: {@link SchedulerComponent}
|
|
16
29
|
*/
|
|
17
30
|
export declare class ReactiveEditingDirective extends EditingDirectiveBase {
|
|
18
31
|
protected scheduler: SchedulerComponent;
|
|
@@ -56,10 +56,19 @@ const occurrences = (item, fields, range, timezone, weekStart) => {
|
|
|
56
56
|
return [item, ...expanded];
|
|
57
57
|
};
|
|
58
58
|
/**
|
|
59
|
-
* A directive that processes Scheduler events in
|
|
59
|
+
* A directive that processes Scheduler events in memory ([see example](slug:databinding_scheduler#toc-using-the-built-in-directive)).
|
|
60
60
|
*
|
|
61
|
-
* Processing includes
|
|
61
|
+
* Processing includes expanding of recurring events and filtering data for
|
|
62
62
|
* the currently active period.
|
|
63
|
+
*
|
|
64
|
+
* @example
|
|
65
|
+
* ```html
|
|
66
|
+
* <kendo-scheduler [kendoSchedulerBinding]="data">
|
|
67
|
+
* </kendo-scheduler>
|
|
68
|
+
* ```
|
|
69
|
+
*
|
|
70
|
+
* @remarks
|
|
71
|
+
* Applied to: {@link SchedulerComponent}
|
|
63
72
|
*/
|
|
64
73
|
export class DataBindingDirective {
|
|
65
74
|
scheduler;
|
|
@@ -67,7 +76,7 @@ export class DataBindingDirective {
|
|
|
67
76
|
intl;
|
|
68
77
|
localDataChangesService;
|
|
69
78
|
/**
|
|
70
|
-
*
|
|
79
|
+
* Sets the data array for the Scheduler.
|
|
71
80
|
*/
|
|
72
81
|
set data(value) {
|
|
73
82
|
this.originalData = value || [];
|
package/esm2022/directives.mjs
CHANGED
|
@@ -41,14 +41,54 @@ import { MultiWeekDaySlotTemplateDirective } from './views/templates/multi-week-
|
|
|
41
41
|
import { TimeSlotTemplateDirective } from './views/templates/time-slot-template.directive';
|
|
42
42
|
import { ShortcutsDirective } from './navigation/shortcuts.directive';
|
|
43
43
|
/**
|
|
44
|
-
* Utility array that contains all
|
|
44
|
+
* Utility array that contains all `@progress/kendo-angular-scheduler` PDF-related components and directives.
|
|
45
|
+
*
|
|
46
|
+
* Use the `KENDO_SCHEDULERPDF` array to import all PDF export features for the Scheduler.
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* ```ts
|
|
50
|
+
* import { KENDO_SCHEDULER, KENDO_SCHEDULERPDF } from '@progress/kendo-angular-scheduler';
|
|
51
|
+
*
|
|
52
|
+
* @Component({
|
|
53
|
+
* standalone: true,
|
|
54
|
+
* imports: [KENDO_SCHEDULER, KENDO_SCHEDULERPDF],
|
|
55
|
+
* template: `
|
|
56
|
+
* <kendo-scheduler [kendoSchedulerBinding]="events">
|
|
57
|
+
* <ng-template kendoSchedulerToolbarTemplate>
|
|
58
|
+
* <button kendoSchedulerPDFCommand>Export PDF</button>
|
|
59
|
+
* </ng-template>
|
|
60
|
+
* <kendo-scheduler-day-view></kendo-scheduler-day-view>
|
|
61
|
+
* <kendo-scheduler-pdf fileName="scheduler.pdf"></kendo-scheduler-pdf>
|
|
62
|
+
* </kendo-scheduler>
|
|
63
|
+
* `
|
|
64
|
+
* })
|
|
65
|
+
* export class AppComponent {}
|
|
66
|
+
* ```
|
|
45
67
|
*/
|
|
46
68
|
export const KENDO_SCHEDULERPDF = [
|
|
47
69
|
PDFComponent,
|
|
48
70
|
PDFCommandDirective
|
|
49
71
|
];
|
|
50
72
|
/**
|
|
51
|
-
* Utility array that contains all `@progress/kendo-angular-scheduler
|
|
73
|
+
* Utility array that contains all `@progress/kendo-angular-scheduler`-related components and directives.
|
|
74
|
+
*
|
|
75
|
+
* Use the `KENDO_SCHEDULER` array to import all Scheduler features in your Angular application.
|
|
76
|
+
*
|
|
77
|
+
* @example
|
|
78
|
+
* ```ts
|
|
79
|
+
* import { KENDO_SCHEDULER } from '@progress/kendo-angular-scheduler';
|
|
80
|
+
*
|
|
81
|
+
* @Component({
|
|
82
|
+
* standalone: true,
|
|
83
|
+
* imports: [KENDO_SCHEDULER],
|
|
84
|
+
* template: `
|
|
85
|
+
* <kendo-scheduler [kendoSchedulerBinding]="events">
|
|
86
|
+
* <kendo-scheduler-day-view></kendo-scheduler-day-view>
|
|
87
|
+
* </kendo-scheduler>
|
|
88
|
+
* `
|
|
89
|
+
* })
|
|
90
|
+
* export class AppComponent {}
|
|
91
|
+
* ```
|
|
52
92
|
*/
|
|
53
93
|
export const KENDO_SCHEDULER = [
|
|
54
94
|
SchedulerComponent,
|
|
@@ -5,15 +5,28 @@
|
|
|
5
5
|
import { Directive, TemplateRef, Optional, Input } from '@angular/core';
|
|
6
6
|
import * as i0 from "@angular/core";
|
|
7
7
|
/**
|
|
8
|
-
* Represents the template for the edit dialog
|
|
8
|
+
* Represents the template directive for customizing the Scheduler edit dialog.
|
|
9
9
|
* To define the template, nest an `<ng-template>` tag
|
|
10
10
|
* with the `kendoSchedulerEditDialogTemplate` directive inside the `<kendo-scheduler>` tag ([see example](slug:custom_reactive_editing_scheduler)).
|
|
11
11
|
*
|
|
12
|
-
* The template context is set to the current event and
|
|
12
|
+
* The template context is set to the current event and the following additional fields are passed:
|
|
13
13
|
* - `event`—The currently edited event. Represents the default context that will be assigned to any template variable which utilizes the `let-x` syntax—for example, `let-event`.
|
|
14
14
|
* - `formGroup`—The current [`FormGroup`](https://angular.io/docs/ts/latest/api/forms/index/FormGroup-class.html).
|
|
15
15
|
* - `editMode`—The current edit mode.
|
|
16
16
|
* - `isNew`—The state of the current event.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ```html
|
|
20
|
+
* <kendo-scheduler>
|
|
21
|
+
* <ng-template kendoSchedulerEditDialogTemplate let-formGroup="formGroup" let-isNew="isNew"
|
|
22
|
+
* autoFocusedElement=".title-input" let-editMode="editMode" let-event>
|
|
23
|
+
* <div>
|
|
24
|
+
* <label>Title:</label>
|
|
25
|
+
* <kendo-textbox placeholder="Title" [formControl]="formGroup.get('title') />
|
|
26
|
+
* </div>
|
|
27
|
+
* </ng-template>
|
|
28
|
+
* </kendo-scheduler>
|
|
29
|
+
* ```
|
|
17
30
|
*/
|
|
18
31
|
export class EditDialogTemplateDirective {
|
|
19
32
|
templateRef;
|
|
@@ -30,14 +30,33 @@ export const RECURRENCE_VALUE_ACCESSOR = {
|
|
|
30
30
|
useExisting: forwardRef(() => RecurrenceEditorComponent)
|
|
31
31
|
};
|
|
32
32
|
/**
|
|
33
|
-
* Represents the Kendo UI Recurrence Editor component for Angular.
|
|
33
|
+
* Represents the Kendo UI Recurrence Editor component for Angular. Use this component to let users set recurrence rules for Scheduler events.
|
|
34
|
+
*
|
|
35
|
+
* [This example](slug:custom_reactive_editing_scheduler) demonstrates the Recurrence Editor, among other components.
|
|
36
|
+
*
|
|
37
|
+
* @example
|
|
38
|
+
* ```html
|
|
39
|
+
* <kendo-scheduler
|
|
40
|
+
* [kendoSchedulerBinding]="events"
|
|
41
|
+
* [kendoSchedulerReactiveEditing]="createFormGroup"
|
|
42
|
+
* >
|
|
43
|
+
* <ng-template kendoSchedulerEditDialogTemplate let-formGroup="formGroup" let-event>
|
|
44
|
+
* <kendo-formfield>
|
|
45
|
+
* <kendo-recurrence-editor
|
|
46
|
+
* [start]="event.value.start"
|
|
47
|
+
* [formControl]="formGroup.get('recurrenceRule')"
|
|
48
|
+
* ></kendo-recurrence-editor>
|
|
49
|
+
* </kendo-formfield>
|
|
50
|
+
* </ng-template>
|
|
51
|
+
* </kendo-scheduler>
|
|
52
|
+
* ```
|
|
34
53
|
*/
|
|
35
54
|
export class RecurrenceEditorComponent {
|
|
36
55
|
recurrenceService;
|
|
37
56
|
intl;
|
|
38
57
|
cssClass = true;
|
|
39
58
|
/**
|
|
40
|
-
*
|
|
59
|
+
* Sets the start date for the event.
|
|
41
60
|
*/
|
|
42
61
|
set start(value) {
|
|
43
62
|
this._start = value;
|
|
@@ -46,33 +65,33 @@ export class RecurrenceEditorComponent {
|
|
|
46
65
|
return isPresent(this._start) ? this._start : getDate(new Date());
|
|
47
66
|
}
|
|
48
67
|
/**
|
|
49
|
-
*
|
|
68
|
+
* Sets the id of the timezone to use.
|
|
69
|
+
*
|
|
50
70
|
* @default 'Etc/UTC'
|
|
51
71
|
*/
|
|
52
72
|
timezone = 'Etc/UTC';
|
|
53
73
|
/**
|
|
54
|
-
*
|
|
74
|
+
* Sets the first day of the week. Uses the locale settings by default.
|
|
55
75
|
*/
|
|
56
76
|
weekStart;
|
|
57
77
|
/**
|
|
58
|
-
*
|
|
78
|
+
* Sets the options for the **Repeat Every** NumericTextBox in the recurrence `interval` editor.
|
|
59
79
|
*/
|
|
60
80
|
repeatEveryOptions;
|
|
61
81
|
/**
|
|
62
|
-
*
|
|
82
|
+
* Sets the options for the **End After** NumericTextBox in the recurrence `count` rule editor.
|
|
63
83
|
*/
|
|
64
84
|
endAfterOptions;
|
|
65
85
|
/**
|
|
66
|
-
*
|
|
67
|
-
* an event will occur on within the monthly and yearly sections of the recurrence editor.
|
|
86
|
+
* Sets the options for the **Repeat On** NumericTextBox for choosing the day an event occurs in the monthly and yearly sections.
|
|
68
87
|
*/
|
|
69
88
|
repeatOnOptions;
|
|
70
89
|
/**
|
|
71
|
-
*
|
|
90
|
+
* Sets the options for the **End On** DatePicker in the recurrence `until` rule editor.
|
|
72
91
|
*/
|
|
73
92
|
endOnOptions;
|
|
74
93
|
/**
|
|
75
|
-
* Fires when the value of the component
|
|
94
|
+
* Fires when the value of the component changes.
|
|
76
95
|
*/
|
|
77
96
|
valueChange = new EventEmitter();
|
|
78
97
|
_start;
|
|
@@ -20,15 +20,25 @@ export const TIME_ZONE_VALUE_ACCESSOR = {
|
|
|
20
20
|
};
|
|
21
21
|
/**
|
|
22
22
|
* Represents the Kendo UI TimeZone Editor component for Angular.
|
|
23
|
-
*
|
|
24
|
-
*
|
|
23
|
+
*
|
|
24
|
+
* Displays a ComboBox for selecting time zone names, used for editing the `start` and `end` time zones of Scheduler events.
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```html
|
|
28
|
+
* <kendo-scheduler>
|
|
29
|
+
* <ng-template kendoSchedulerEditDialogTemplate>
|
|
30
|
+
* <div> Select Time Zone:
|
|
31
|
+
* <kendo-timezone-editor></kendo-timezone-editor>
|
|
32
|
+
* </div>
|
|
33
|
+
* </ng-template>
|
|
34
|
+
* </kendo-scheduler>
|
|
25
35
|
*/
|
|
26
36
|
export class TimeZoneEditorComponent {
|
|
27
37
|
injector;
|
|
28
38
|
tzComboBox;
|
|
29
39
|
tzComboBoxControl;
|
|
30
40
|
/**
|
|
31
|
-
* Specifies the width of the ComboBox
|
|
41
|
+
* Specifies the width of the ComboBox that contains the names of the timezones.
|
|
32
42
|
* @default 260
|
|
33
43
|
*/
|
|
34
44
|
width = 260;
|
|
@@ -18,27 +18,24 @@ const DATE_FORMATS = [
|
|
|
18
18
|
"yyyyMMdd"
|
|
19
19
|
];
|
|
20
20
|
/**
|
|
21
|
-
*
|
|
21
|
+
* Represents a base implementation of the [edit service](slug:api_scheduler_editservice) that persists data to CRUD services such as OData.
|
|
22
22
|
*
|
|
23
|
-
* To
|
|
24
|
-
* implement the `read` operation, which is not called directly by the base class, and the `save` method which persists the created,
|
|
25
|
-
* updated, and deleted entities.
|
|
23
|
+
* To use custom models, pass a [field map](slug:api_scheduler_schedulermodelfields) as a constructor parameter in the `BaseEditService` implementation. Subclasses must implement the `read` operation (that is not called directly by the base class) and the `save` method to persist created, updated, and deleted entities.
|
|
26
24
|
*
|
|
27
|
-
* The [`events`](#toc-events) observable
|
|
28
|
-
* ([more information]({% slug editing_directives_scheduler %}#toc-custom-service)).
|
|
25
|
+
* The [`events`](#toc-events) observable publishes the current data when you subscribe, for example, by using an [async pipe](https://angular.io/api/common/AsyncPipe) ([more information](slug:editing_directives_scheduler#toc-custom-service)).
|
|
29
26
|
*
|
|
30
|
-
* Implementations
|
|
31
|
-
* [`EditService`](
|
|
27
|
+
* Implementations that utilize dedicated services, such as Google Calendar and Microsoft Exchange, typically implement the
|
|
28
|
+
* [`EditService`](slug:api_scheduler_editservice) of the Scheduler directly.
|
|
32
29
|
*
|
|
33
|
-
* See example in [this article](
|
|
30
|
+
* See example in [this article](slug:custom_reactive_editing_scheduler).
|
|
34
31
|
*/
|
|
35
32
|
export class BaseEditService {
|
|
36
33
|
/**
|
|
37
|
-
*
|
|
34
|
+
* Holds the model field map used for reading and updating data items.
|
|
38
35
|
*/
|
|
39
36
|
fields;
|
|
40
37
|
/**
|
|
41
|
-
*
|
|
38
|
+
* Emits the current events as an observable stream.
|
|
42
39
|
*/
|
|
43
40
|
events;
|
|
44
41
|
/**
|