@progress/kendo-angular-dialog 17.0.0-develop.9 → 17.0.0

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 (87) hide show
  1. package/README.md +38 -21
  2. package/common/actions-layout.d.ts +1 -1
  3. package/common/animation-types.d.ts +1 -1
  4. package/common/dialog-animation-direction.d.ts +1 -1
  5. package/dialog/dialog-actions.component.d.ts +1 -1
  6. package/dialog/dialog-titlebar.component.d.ts +1 -1
  7. package/dialog/dialog.component.d.ts +1 -1
  8. package/dialog/models/dialog-action-divider.d.ts +1 -1
  9. package/dialog/models/dialog-result.d.ts +1 -1
  10. package/dialog/models/theme-color.d.ts +1 -1
  11. package/dialog.module.d.ts +0 -4
  12. package/{esm2020 → esm2022}/common/preventable-event.mjs +2 -3
  13. package/{esm2020 → esm2022}/dialog/dialog-actions.component.mjs +26 -17
  14. package/{esm2020 → esm2022}/dialog/dialog-container.directive.mjs +3 -3
  15. package/{esm2020 → esm2022}/dialog/dialog-container.service.mjs +4 -4
  16. package/{esm2020 → esm2022}/dialog/dialog-content-base.mjs +12 -3
  17. package/{esm2020 → esm2022}/dialog/dialog-titlebar.component.mjs +36 -25
  18. package/{esm2020 → esm2022}/dialog/dialog.component.mjs +139 -71
  19. package/{esm2020 → esm2022}/dialog/dialog.service.mjs +7 -3
  20. package/esm2022/dialog/models/dialog-action.mjs +27 -0
  21. package/esm2022/dialog/models/dialog-ref.mjs +34 -0
  22. package/esm2022/dialog/models/dialog-settings.mjs +106 -0
  23. package/{esm2020 → esm2022}/dialog.module.mjs +4 -13
  24. package/{esm2020 → esm2022}/dialogs.module.mjs +4 -4
  25. package/{esm2020 → esm2022}/localization/custom-messages.component.mjs +9 -8
  26. package/{esm2020 → esm2022}/localization/localized-messages.directive.mjs +9 -8
  27. package/{esm2020 → esm2022}/localization/messages.mjs +19 -3
  28. package/{esm2020 → esm2022}/localization/titlebar-localization.service.mjs +4 -3
  29. package/{esm2020 → esm2022}/package-metadata.mjs +2 -2
  30. package/{esm2020 → esm2022}/window/actions/window-close-action.directive.mjs +20 -16
  31. package/{esm2020 → esm2022}/window/actions/window-maximize-action.directive.mjs +20 -16
  32. package/{esm2020 → esm2022}/window/actions/window-minimize-action.directive.mjs +20 -16
  33. package/{esm2020 → esm2022}/window/actions/window-restore-action.directive.mjs +20 -16
  34. package/{esm2020 → esm2022}/window/drag-resize.service.mjs +18 -15
  35. package/esm2022/window/models/window-ref.mjs +36 -0
  36. package/esm2022/window/models/window-settings.mjs +101 -0
  37. package/{esm2020 → esm2022}/window/navigation.service.mjs +5 -3
  38. package/{esm2020 → esm2022}/window/window-container.directive.mjs +3 -3
  39. package/{esm2020 → esm2022}/window/window-container.service.mjs +4 -4
  40. package/{esm2020 → esm2022}/window/window-resize-handle.directive.mjs +12 -7
  41. package/{esm2020 → esm2022}/window/window-titlebar.component.mjs +21 -4
  42. package/{esm2020 → esm2022}/window/window.component.mjs +128 -98
  43. package/{esm2020 → esm2022}/window/window.service.mjs +7 -3
  44. package/{esm2020 → esm2022}/window.module.mjs +4 -10
  45. package/{fesm2020 → fesm2022}/progress-kendo-angular-dialog.mjs +816 -379
  46. package/localization/messages.d.ts +1 -1
  47. package/package.json +14 -20
  48. package/schematics/ngAdd/index.js +2 -2
  49. package/window/actions/window-close-action.directive.d.ts +1 -1
  50. package/window/actions/window-maximize-action.directive.d.ts +1 -1
  51. package/window/actions/window-minimize-action.directive.d.ts +1 -1
  52. package/window/actions/window-restore-action.directive.d.ts +1 -1
  53. package/window/models/theme-color.d.ts +1 -1
  54. package/window/models/window-types.d.ts +4 -4
  55. package/window/window-resize-handle.directive.d.ts +1 -1
  56. package/window/window-titlebar.component.d.ts +1 -1
  57. package/window/window.component.d.ts +1 -1
  58. package/esm2020/dialog/models/dialog-action.mjs +0 -10
  59. package/esm2020/dialog/models/dialog-ref.mjs +0 -11
  60. package/esm2020/dialog/models/dialog-settings.mjs +0 -10
  61. package/esm2020/window/models/window-ref.mjs +0 -11
  62. package/esm2020/window/models/window-settings.mjs +0 -10
  63. package/fesm2015/progress-kendo-angular-dialog.mjs +0 -3807
  64. /package/{esm2020 → esm2022}/common/actions-layout.mjs +0 -0
  65. /package/{esm2020 → esm2022}/common/animation-types.mjs +0 -0
  66. /package/{esm2020 → esm2022}/common/dialog-animation-direction.mjs +0 -0
  67. /package/{esm2020 → esm2022}/common/util.mjs +0 -0
  68. /package/{esm2020 → esm2022}/dialog/dialog-animations/animate-content.mjs +0 -0
  69. /package/{esm2020 → esm2022}/dialog/dialog-animations/animations.mjs +0 -0
  70. /package/{esm2020 → esm2022}/dialog/dialog-animations/create-animation-player.mjs +0 -0
  71. /package/{esm2020 → esm2022}/dialog/models/dialog-action-divider.mjs +0 -0
  72. /package/{esm2020 → esm2022}/dialog/models/dialog-animation.mjs +0 -0
  73. /package/{esm2020 → esm2022}/dialog/models/dialog-close-result.mjs +0 -0
  74. /package/{esm2020 → esm2022}/dialog/models/dialog-result.mjs +0 -0
  75. /package/{esm2020 → esm2022}/dialog/models/index.mjs +0 -0
  76. /package/{esm2020 → esm2022}/dialog/models/theme-color.mjs +0 -0
  77. /package/{esm2020 → esm2022}/directives.mjs +0 -0
  78. /package/{esm2020 → esm2022}/index.mjs +0 -0
  79. /package/{esm2020 → esm2022}/localization/dialog-localization.service.mjs +0 -0
  80. /package/{esm2020 → esm2022}/progress-kendo-angular-dialog.mjs +0 -0
  81. /package/{esm2020 → esm2022}/window/models/index.mjs +0 -0
  82. /package/{esm2020 → esm2022}/window/models/theme-color.mjs +0 -0
  83. /package/{esm2020 → esm2022}/window/models/window-close-result.mjs +0 -0
  84. /package/{esm2020 → esm2022}/window/models/window-messages.mjs +0 -0
  85. /package/{esm2020 → esm2022}/window/models/window-options.mjs +0 -0
  86. /package/{esm2020 → esm2022}/window/models/window-types.mjs +0 -0
  87. /package/{esm2020 → esm2022}/window/window-events.mjs +0 -0
@@ -1,3807 +0,0 @@
1
- /**-----------------------------------------------------------------------------------------
2
- * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
- * Licensed under commercial license. See LICENSE.md in the project root for more information
4
- *-------------------------------------------------------------------------------------------*/
5
- import * as i0 from '@angular/core';
6
- import { EventEmitter, TemplateRef, Component, Input, Output, HostBinding, InjectionToken, Injectable, Inject, Optional, Directive, forwardRef, ContentChildren, ViewChildren, ViewChild, isDevMode, Renderer2, Host, HostListener, ContentChild, NgModule } from '@angular/core';
7
- import { NgIf, NgFor, NgClass, NgTemplateOutlet, NgStyle } from '@angular/common';
8
- import * as i2 from '@angular/animations';
9
- import { style, animate, keyframes, trigger, state, transition } from '@angular/animations';
10
- import { of, Subscription, Subject, merge } from 'rxjs';
11
- import { delay, takeUntil, take, filter, map, share, tap, switchMap } from 'rxjs/operators';
12
- import * as i1 from '@progress/kendo-angular-l10n';
13
- import { LocalizationService, L10N_PREFIX, RTL, ComponentMessages } from '@progress/kendo-angular-l10n';
14
- import { xIcon, windowRestoreIcon, windowIcon, windowMinimizeIcon } from '@progress/kendo-svg-icons';
15
- import { ButtonComponent, Button } from '@progress/kendo-angular-buttons';
16
- import { validatePackage } from '@progress/kendo-licensing';
17
- import * as i1$1 from '@progress/kendo-angular-common';
18
- import { shouldShowValidationUI, setHTMLAttributes, isDocumentAvailable, focusableSelector, WatermarkOverlayComponent, DraggableDirective, isChanged } from '@progress/kendo-angular-common';
19
- import { offset, scrollPosition, positionWithScroll, getDocumentElement, getWindowViewPort } from '@progress/kendo-popup-common';
20
- import { IconWrapperComponent, IconsService } from '@progress/kendo-angular-icons';
21
-
22
- /**
23
- * @hidden
24
- */
25
- const isPresent = (value) => value !== null && value !== undefined;
26
- /**
27
- * @hidden
28
- */
29
- const isTruthy = (value) => !!value;
30
- const toClassList = (classNames) => String(classNames).trim().split(' ');
31
- const focusableRegex = /^(?:a|input|select|textarea|button|object)$/i;
32
- /**
33
- * @hidden
34
- */
35
- var Keys;
36
- (function (Keys) {
37
- Keys[Keys["esc"] = 27] = "esc";
38
- Keys[Keys["tab"] = 9] = "tab";
39
- Keys[Keys["enter"] = 13] = "enter";
40
- Keys[Keys["space"] = 32] = "space";
41
- Keys[Keys["ctrl"] = 17] = "ctrl";
42
- Keys[Keys["shift"] = 16] = "shift";
43
- Keys[Keys["left"] = 37] = "left";
44
- Keys[Keys["up"] = 38] = "up";
45
- Keys[Keys["right"] = 39] = "right";
46
- Keys[Keys["down"] = 40] = "down";
47
- })(Keys || (Keys = {}));
48
- /**
49
- * @hidden
50
- */
51
- const DIALOG_ELEMENTS_HANDLING_ESC_KEY = 'k-dialog-wrapper k-actions k-dialog-titlebar-action';
52
- /**
53
- * @hidden
54
- */
55
- const DIALOG_ELEMENTS_HANDLING_ARROWS = 'k-actions';
56
- /**
57
- * @hidden
58
- */
59
- const WINDOW_CLASSES = 'k-window';
60
- /**
61
- * @hidden
62
- */
63
- const hasClasses = (element, classNames) => {
64
- const namesList = toClassList(classNames);
65
- return Boolean(toClassList(element.className).find((className) => namesList.indexOf(className) >= 0));
66
- };
67
- /**
68
- * @hidden
69
- */
70
- const isVisible = (element) => {
71
- const rect = element.getBoundingClientRect();
72
- return !!(rect.width && rect.height) && window.getComputedStyle(element).visibility !== 'hidden';
73
- };
74
- /**
75
- * @hidden
76
- */
77
- const isFocusable = (element, checkVisibility = true) => {
78
- if (element.tagName) {
79
- const tagName = element.tagName.toLowerCase();
80
- const tabIndex = element.getAttribute('tabIndex');
81
- const validTabIndex = tabIndex !== null && !isNaN(tabIndex) && tabIndex > -1;
82
- let focusable = false;
83
- if (focusableRegex.test(tagName)) {
84
- focusable = !element.disabled;
85
- }
86
- else {
87
- focusable = validTabIndex;
88
- }
89
- return focusable && (!checkVisibility || isVisible(element));
90
- }
91
- return false;
92
- };
93
- /**
94
- * Receives CSS class declarations either as an object, string or array and returns an array of the class names.
95
- *
96
- * @hidden
97
- */
98
- const parseCSSClassNames = (value) => {
99
- if (isObject(value)) {
100
- return parseObjectClassNames(value);
101
- }
102
- if (isString(value)) {
103
- return parseStringClassNames(value);
104
- }
105
- if (Array.isArray(value)) {
106
- return parseArrayClassNames(value);
107
- }
108
- };
109
- const parseObjectClassNames = (value) => {
110
- const classes = [];
111
- Object.keys(value).forEach(className => {
112
- const currentClassName = splitStringToArray(className);
113
- if (value[className] && currentClassName[0]) {
114
- classes.push(...currentClassName);
115
- }
116
- });
117
- return classes;
118
- };
119
- const parseStringClassNames = (value) => {
120
- const classes = [];
121
- const classesArray = splitStringToArray(value);
122
- classesArray.forEach(className => {
123
- classes.push(className);
124
- });
125
- return classes;
126
- };
127
- const parseArrayClassNames = (value) => {
128
- const classes = [];
129
- value.forEach((className) => {
130
- const current = splitStringToArray(className);
131
- if (current[0]) {
132
- classes.push(...current);
133
- }
134
- });
135
- return classes;
136
- };
137
- /**
138
- * @hidden
139
- */
140
- const preventDefault = ({ originalEvent: event }) => {
141
- event.stopPropagation();
142
- event.preventDefault();
143
- };
144
- /**
145
- * @hidden
146
- */
147
- const isWindowAvailable = () => {
148
- return typeof window !== 'undefined';
149
- };
150
- /**
151
- * @hidden
152
- */
153
- const preventOnDblClick = release => (mouseDown) => of(mouseDown).pipe(delay(150), takeUntil(release));
154
- /**
155
- * @hidden
156
- */
157
- const RESIZE_DIRECTIONS = ['n', 'e', 's', 'w', 'se', 'sw', 'ne', 'nw'];
158
- /**
159
- * @hidden
160
- */
161
- const OFFSET_STYLES = ['top', 'left', 'width', 'height'];
162
- /**
163
- * @hidden
164
- */
165
- const isString = (value) => value instanceof String || typeof value === 'string';
166
- /**
167
- * @hidden
168
- */
169
- const isObject = (value) => isPresent(value) && !Array.isArray(value) && typeof value === 'object';
170
- /**
171
- * @hidden
172
- */
173
- const isNumber = (value) => typeof value === 'number' && isFinite(value);
174
- /**
175
- * @hidden
176
- */
177
- const createValueWithUnit = (value) => value + (isNumber(value) ? 'px' : '');
178
- /**
179
- * @hidden
180
- */
181
- const splitStringToArray = (value) => value.trim().replace(/\s+/g, " ").split(' ');
182
- /**
183
- * @hidden
184
- */
185
- const findPrimaryButton = (buttons) => {
186
- for (let i = buttons.length - 1; i >= 0; i--) {
187
- const classList = buttons[i].classList;
188
- for (let j = 0; j < classList.length; j++) {
189
- if (classList[j].endsWith('-primary')) {
190
- return buttons[i];
191
- }
192
- }
193
- }
194
- };
195
-
196
- /**
197
- * Specifies the action buttons of the Dialog
198
- * ([see example]({% slug actionbuttons_dialog %})).
199
- */
200
- class DialogActionsComponent {
201
- constructor(el) {
202
- this.el = el;
203
- /**
204
- * Specifies the possible layout of the action buttons.
205
- * @default 'stretched'
206
- */
207
- this.layout = 'stretched';
208
- /**
209
- * Fires when the user clicks an action button.
210
- */
211
- this.action = new EventEmitter();
212
- this.hostClasses = true;
213
- }
214
- /**
215
- * Allows the declarative specification of the actions.
216
- */
217
- set actions(value) {
218
- if (value instanceof TemplateRef) {
219
- this.actionsTemplate = value;
220
- }
221
- else if (Array.isArray(value)) {
222
- this.actionsArray = value;
223
- }
224
- else {
225
- throw new Error('"actions" must be either TemplateRef or DialogAction[] instance.');
226
- }
227
- }
228
- get startClassName() {
229
- return this.layout === 'start';
230
- }
231
- get centerClassName() {
232
- return this.layout === 'center';
233
- }
234
- get endClassName() {
235
- return this.layout === 'end';
236
- }
237
- get stretchedClassName() {
238
- return this.layout === 'stretched';
239
- }
240
- /**
241
- * @hidden
242
- */
243
- onButtonClick(action, _e) {
244
- this.action.emit(action);
245
- }
246
- /**
247
- * @hidden
248
- */
249
- buttonClass(action) {
250
- let classes = ['k-button k-button-md k-rounded-md'];
251
- const fillMode = action.fillMode ? action.fillMode : 'solid';
252
- const themeColor = action.themeColor ? action.themeColor : 'base';
253
- const cssClasses = action.cssClass ? parseCSSClassNames(action.cssClass) : [];
254
- classes.push(`k-button-${fillMode} k-button-${fillMode}-${themeColor}`);
255
- if (cssClasses.length > 0) {
256
- classes = classes.concat(cssClasses);
257
- }
258
- return classes.join(' ');
259
- }
260
- /**
261
- * @hidden
262
- */
263
- isDivider(action) {
264
- return action === 'spacer';
265
- }
266
- }
267
- DialogActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogActionsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
268
- DialogActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DialogActionsComponent, isStandalone: true, selector: "kendo-dialog-actions", inputs: { actions: "actions", layout: "layout" }, outputs: { action: "action" }, host: { properties: { "class.k-actions": "this.hostClasses", "class.k-actions-horizontal": "this.hostClasses", "class.k-window-actions": "this.hostClasses", "class.k-dialog-actions": "this.hostClasses", "class.k-actions-start": "this.startClassName", "class.k-actions-center": "this.centerClassName", "class.k-actions-end": "this.endClassName", "class.k-actions-stretched": "this.stretchedClassName" } }, ngImport: i0, template: `
269
- <ng-content *ngIf="!actions"></ng-content>
270
- <ng-container *ngIf="actionsArray; else actionTemplate">
271
- <ng-container *ngFor="let action of actionsArray">
272
- <ng-container *ngIf="isDivider(action); else defaultAction">
273
- <span class="k-spacer"></span>
274
- </ng-container>
275
- <ng-template #defaultAction>
276
- <button
277
- type="button"
278
- [ngClass]="buttonClass(action)"
279
- (click)="onButtonClick(action, $event)"
280
- [attr.aria-label]="action.text"
281
- >
282
- {{ action.text }}
283
- </button>
284
- </ng-template>
285
- </ng-container>
286
- </ng-container>
287
- <ng-template #actionTemplate [ngTemplateOutlet]="actionsTemplate"></ng-template>
288
- `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
289
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogActionsComponent, decorators: [{
290
- type: Component,
291
- args: [{
292
- selector: 'kendo-dialog-actions',
293
- template: `
294
- <ng-content *ngIf="!actions"></ng-content>
295
- <ng-container *ngIf="actionsArray; else actionTemplate">
296
- <ng-container *ngFor="let action of actionsArray">
297
- <ng-container *ngIf="isDivider(action); else defaultAction">
298
- <span class="k-spacer"></span>
299
- </ng-container>
300
- <ng-template #defaultAction>
301
- <button
302
- type="button"
303
- [ngClass]="buttonClass(action)"
304
- (click)="onButtonClick(action, $event)"
305
- [attr.aria-label]="action.text"
306
- >
307
- {{ action.text }}
308
- </button>
309
- </ng-template>
310
- </ng-container>
311
- </ng-container>
312
- <ng-template #actionTemplate [ngTemplateOutlet]="actionsTemplate"></ng-template>
313
- `,
314
- standalone: true,
315
- imports: [NgIf, NgFor, NgClass, NgTemplateOutlet]
316
- }]
317
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { actions: [{
318
- type: Input
319
- }], layout: [{
320
- type: Input
321
- }], action: [{
322
- type: Output
323
- }], hostClasses: [{
324
- type: HostBinding,
325
- args: ['class.k-actions']
326
- }, {
327
- type: HostBinding,
328
- args: ['class.k-actions-horizontal']
329
- }, {
330
- type: HostBinding,
331
- args: ['class.k-window-actions']
332
- }, {
333
- type: HostBinding,
334
- args: ['class.k-dialog-actions']
335
- }], startClassName: [{
336
- type: HostBinding,
337
- args: ['class.k-actions-start']
338
- }], centerClassName: [{
339
- type: HostBinding,
340
- args: ['class.k-actions-center']
341
- }], endClassName: [{
342
- type: HostBinding,
343
- args: ['class.k-actions-end']
344
- }], stretchedClassName: [{
345
- type: HostBinding,
346
- args: ['class.k-actions-stretched']
347
- }] } });
348
-
349
- class PreventableEvent {
350
- /**
351
- * @hidden
352
- */
353
- constructor() {
354
- this.prevented = false;
355
- }
356
- /**
357
- * Prevents the default action for a specified event.
358
- * In this way, the source component suppresses the built-in behavior that follows the event.
359
- */
360
- preventDefault() {
361
- this.prevented = true;
362
- }
363
- /**
364
- * If the event is prevented by any of its subscribers, returns `true`.
365
- *
366
- * @returns `true` if the default action was prevented. Otherwise, returns `false`.
367
- */
368
- isDefaultPrevented() {
369
- return this.prevented;
370
- }
371
- }
372
-
373
- /**
374
- * @hidden
375
- */
376
- const DIALOG_LOCALIZATION_SERVICE = new InjectionToken('Dialog LocalizationService');
377
-
378
- /**
379
- * @hidden
380
- */
381
- class TitleBarLocalizationService extends LocalizationService {
382
- constructor(prefix, messageService, rtl, dialogLocalization) {
383
- super(prefix, messageService, rtl);
384
- this.dialogLocalization = dialogLocalization;
385
- }
386
- get(shortKey) {
387
- if (this.dialogLocalization) {
388
- return this.dialogLocalization.get(shortKey);
389
- }
390
- return super.get(shortKey);
391
- }
392
- }
393
- TitleBarLocalizationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TitleBarLocalizationService, deps: [{ token: L10N_PREFIX }, { token: i1.MessageService, optional: true }, { token: RTL, optional: true }, { token: DIALOG_LOCALIZATION_SERVICE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
394
- TitleBarLocalizationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TitleBarLocalizationService });
395
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: TitleBarLocalizationService, decorators: [{
396
- type: Injectable
397
- }], ctorParameters: function () {
398
- return [{ type: undefined, decorators: [{
399
- type: Inject,
400
- args: [L10N_PREFIX]
401
- }] }, { type: i1.MessageService, decorators: [{
402
- type: Optional
403
- }] }, { type: undefined, decorators: [{
404
- type: Optional
405
- }, {
406
- type: Inject,
407
- args: [RTL]
408
- }] }, { type: i1.LocalizationService, decorators: [{
409
- type: Optional
410
- }, {
411
- type: Inject,
412
- args: [DIALOG_LOCALIZATION_SERVICE]
413
- }] }];
414
- } });
415
-
416
- /**
417
- * @hidden
418
- */
419
- class Messages extends ComponentMessages {
420
- }
421
- Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
422
- Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: Messages, selector: "kendo-dialog-messages-base", inputs: { closeTitle: "closeTitle", restoreTitle: "restoreTitle", maximizeTitle: "maximizeTitle", minimizeTitle: "minimizeTitle" }, usesInheritance: true, ngImport: i0 });
423
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: Messages, decorators: [{
424
- type: Directive,
425
- args: [{
426
- // eslint-disable-next-line @angular-eslint/directive-selector
427
- selector: 'kendo-dialog-messages-base'
428
- }]
429
- }], propDecorators: { closeTitle: [{
430
- type: Input
431
- }], restoreTitle: [{
432
- type: Input
433
- }], maximizeTitle: [{
434
- type: Input
435
- }], minimizeTitle: [{
436
- type: Input
437
- }] } });
438
-
439
- /**
440
- * @hidden
441
- */
442
- class LocalizedMessagesDirective extends Messages {
443
- constructor(service) {
444
- super();
445
- this.service = service;
446
- }
447
- }
448
- LocalizedMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
449
- LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedMessagesDirective, isStandalone: true, selector: "\n [kendoDialogLocalizedMessages],\n [kendoWindowLocalizedMessages],\n [kendoDialogTitleBarLocalizedMessages]\n ", providers: [
450
- {
451
- provide: Messages,
452
- useExisting: forwardRef(() => LocalizedMessagesDirective)
453
- }
454
- ], usesInheritance: true, ngImport: i0 });
455
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
456
- type: Directive,
457
- args: [{
458
- providers: [
459
- {
460
- provide: Messages,
461
- useExisting: forwardRef(() => LocalizedMessagesDirective)
462
- }
463
- ],
464
- selector: `
465
- [kendoDialogLocalizedMessages],
466
- [kendoWindowLocalizedMessages],
467
- [kendoDialogTitleBarLocalizedMessages]
468
- `,
469
- standalone: true
470
- }]
471
- }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
472
-
473
- /**
474
- * Represents the [Kendo UI DialogTitleBar component for Angular]({% slug api_dialog_dialogtitlebarcomponent %}).
475
- *
476
- * It is used as part of the Dialog content when the component is created dynamically by using an [Angular service]({% slug service_dialog %}).
477
- */
478
- class DialogTitleBarComponent {
479
- constructor(zone, hostElement, localizationService) {
480
- this.zone = zone;
481
- this.hostElement = hostElement;
482
- this.localizationService = localizationService;
483
- /**
484
- * Fires when the close button of the title-bar is clicked.
485
- */
486
- this.close = new EventEmitter();
487
- /**
488
- * @hidden
489
- */
490
- this.xIcon = xIcon;
491
- }
492
- get className() {
493
- return true;
494
- }
495
- get closeButtonTitle() {
496
- return this.closeTitle || this.localizationService.get('closeTitle');
497
- }
498
- ngAfterViewInit() {
499
- this.zone.onStable.pipe(take(1)).subscribe(() => {
500
- const element = this.hostElement.nativeElement.querySelector('.k-dialog-title');
501
- element.setAttribute('id', this.id);
502
- });
503
- }
504
- /**
505
- * @hidden
506
- */
507
- onCloseClick(e) {
508
- e.preventDefault();
509
- const eventArgs = new PreventableEvent();
510
- this.close.emit(eventArgs);
511
- }
512
- }
513
- DialogTitleBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogTitleBarComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i1.LocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
514
- DialogTitleBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DialogTitleBarComponent, isStandalone: true, selector: "kendo-dialog-titlebar", inputs: { id: "id", closeTitle: "closeTitle" }, outputs: { close: "close" }, host: { properties: { "class.k-window-titlebar": "this.className", "class.k-dialog-titlebar": "this.className" } }, providers: [
515
- TitleBarLocalizationService,
516
- {
517
- provide: LocalizationService,
518
- useExisting: TitleBarLocalizationService
519
- },
520
- {
521
- provide: L10N_PREFIX,
522
- useValue: 'kendo.dialog'
523
- }
524
- ], ngImport: i0, template: `
525
- <ng-container
526
- kendoDialogTitleBarLocalizedMessages
527
- i18n-closeTitle="kendo.dialog.closeTitle|The title of the close button"
528
- closeTitle="Close"
529
- >
530
- <span class="k-window-title k-dialog-title">
531
- <ng-content></ng-content>
532
- </span>
533
-
534
- <div class="k-window-titlebar-actions k-dialog-titlebar-actions">
535
- <button
536
- kendoButton
537
- fillMode="flat"
538
- type="button"
539
- [attr.title]="closeButtonTitle"
540
- [attr.aria-label]="closeButtonTitle"
541
- icon="close"
542
- [svgIcon]="xIcon"
543
- class="k-window-titlebar-action k-dialog-titlebar-action"
544
- (click)="onCloseClick($event)"
545
- >
546
- </button>
547
- </div>
548
- </ng-container>
549
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDialogLocalizedMessages],\n [kendoWindowLocalizedMessages],\n [kendoDialogTitleBarLocalizedMessages]\n " }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
550
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogTitleBarComponent, decorators: [{
551
- type: Component,
552
- args: [{
553
- selector: 'kendo-dialog-titlebar',
554
- providers: [
555
- TitleBarLocalizationService,
556
- {
557
- provide: LocalizationService,
558
- useExisting: TitleBarLocalizationService
559
- },
560
- {
561
- provide: L10N_PREFIX,
562
- useValue: 'kendo.dialog'
563
- }
564
- ],
565
- template: `
566
- <ng-container
567
- kendoDialogTitleBarLocalizedMessages
568
- i18n-closeTitle="kendo.dialog.closeTitle|The title of the close button"
569
- closeTitle="Close"
570
- >
571
- <span class="k-window-title k-dialog-title">
572
- <ng-content></ng-content>
573
- </span>
574
-
575
- <div class="k-window-titlebar-actions k-dialog-titlebar-actions">
576
- <button
577
- kendoButton
578
- fillMode="flat"
579
- type="button"
580
- [attr.title]="closeButtonTitle"
581
- [attr.aria-label]="closeButtonTitle"
582
- icon="close"
583
- [svgIcon]="xIcon"
584
- class="k-window-titlebar-action k-dialog-titlebar-action"
585
- (click)="onCloseClick($event)"
586
- >
587
- </button>
588
- </div>
589
- </ng-container>
590
- `,
591
- standalone: true,
592
- imports: [LocalizedMessagesDirective, ButtonComponent]
593
- }]
594
- }], ctorParameters: function () {
595
- return [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: i1.LocalizationService, decorators: [{
596
- type: Optional
597
- }] }];
598
- }, propDecorators: { close: [{
599
- type: Output
600
- }], id: [{
601
- type: Input
602
- }], closeTitle: [{
603
- type: Input
604
- }], className: [{
605
- type: HostBinding,
606
- args: ['class.k-window-titlebar']
607
- }, {
608
- type: HostBinding,
609
- args: ['class.k-dialog-titlebar']
610
- }] } });
611
-
612
- /**
613
- * @hidden
614
- */
615
- const packageMetadata = {
616
- name: '@progress/kendo-angular-dialog',
617
- productName: 'Kendo UI for Angular',
618
- productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
619
- publishDate: 1729174341,
620
- version: '17.0.0-develop.9',
621
- licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
622
- };
623
-
624
- /**
625
- * Indicates that the **Close** button is clicked. Used when the results from
626
- * the Dialogs that are opened through `DialogService` are filtered
627
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
628
- */
629
- class DialogCloseResult {
630
- }
631
-
632
- /**
633
- * @hidden
634
- */
635
- function animations(duration, direction, animationType) {
636
- switch (animationType) {
637
- case 'slide': {
638
- const translate = direction === 'left' || direction === 'right' ? 'translateX' : 'translateY';
639
- const start = direction === 'right' || direction === 'down' ? -100 : 100;
640
- const end = 0;
641
- return [
642
- style({ transform: `${translate}(${start}%)` }),
643
- animate(`${duration}ms ease-in`, style({ transform: `${translate}(${end}%)` }))
644
- ];
645
- }
646
- case 'expand': {
647
- const scale = direction === 'up' || direction === 'down' ? 'scaleY' : 'scaleX';
648
- const startScale = 0;
649
- const endScale = 1;
650
- let origin;
651
- if (direction === 'down') {
652
- origin = 'top';
653
- }
654
- else if (direction === 'left') {
655
- origin = 'right';
656
- }
657
- else if (direction === 'right') {
658
- origin = 'left';
659
- }
660
- else {
661
- origin = 'bottom';
662
- }
663
- return [
664
- style({ transform: `${scale}(${startScale})`, transformOrigin: origin }),
665
- animate(`${duration}ms ease-in`, style({ transform: `${scale}(${endScale})` }))
666
- ];
667
- }
668
- case 'zoom': {
669
- const startZoom = 0;
670
- const endZoom = 1;
671
- return [
672
- animate(duration, keyframes([
673
- style({ transform: `scale(${startZoom})` }),
674
- style({ transform: `scale(${endZoom})` })
675
- ]))
676
- ];
677
- }
678
- case 'fade': {
679
- const startFade = 0;
680
- const endFade = 1;
681
- return [
682
- animate(duration, keyframes([
683
- style({ opacity: `${startFade}` }),
684
- style({ opacity: `${endFade}` })
685
- ]))
686
- ];
687
- }
688
- case 'translate':
689
- return [
690
- style({ transform: 'translate(0, -10%)' }),
691
- animate(`${duration}ms cubic-bezier(.2, 1, .2, 1)`)
692
- ];
693
- default:
694
- return [
695
- style({ transform: 'translate(0, -10%)' }),
696
- animate(`${duration}ms cubic-bezier(.2, 1, .2, 1)`)
697
- ];
698
- }
699
- }
700
-
701
- /**
702
- * @hidden
703
- */
704
- const createPlayer = (builder, animation, animatedElement) => {
705
- const factory = builder.build(animation);
706
- let player = factory.create(animatedElement);
707
- player.onDone(() => {
708
- if (player) {
709
- player.destroy();
710
- player = null;
711
- }
712
- });
713
- return player;
714
- };
715
-
716
- /**
717
- * @hidden
718
- */
719
- const animateContent = (animation, defAnimationConfig, animatedElement, builder) => {
720
- let animationConfig = defAnimationConfig;
721
- if (typeof animation !== 'boolean') {
722
- animationConfig = animation;
723
- animationConfig.duration = animationConfig.duration ? animationConfig.duration : defAnimationConfig.duration;
724
- }
725
- const animationSpecs = animations(animationConfig.duration, animationConfig.direction, animationConfig.type);
726
- const player = createPlayer(builder, animationSpecs, animatedElement);
727
- player.play();
728
- };
729
-
730
- const DEFAULT_ANIMATION_CONFIG = { duration: 300, type: 'translate' };
731
- /**
732
- * Represents the [Kendo UI Dialog component for Angular]({% slug overview_dialog_dialogs %}).
733
- */
734
- class DialogComponent {
735
- constructor(wrapper, renderer, localization, cdr, ngZone, builder) {
736
- this.wrapper = wrapper;
737
- this.renderer = renderer;
738
- this.cdr = cdr;
739
- this.ngZone = ngZone;
740
- this.builder = builder;
741
- /**
742
- * Specifies the layout of the action buttons in the Dialog.
743
- * This option is only applicable if the action buttons are specified through the `actions` options.
744
- *
745
- * @default 'stretched'
746
- */
747
- this.actionsLayout = 'stretched';
748
- /**
749
- * Configures the Dialog opening animation ([see example]({% slug animations_dialog %})).
750
- * By default the animation type is set to `translate` and its duration is `300ms`.
751
- *
752
- * @default true
753
- */
754
- this.animation = true;
755
- /**
756
- * @hidden
757
- */
758
- this.titleId = null;
759
- /**
760
- * @hidden
761
- */
762
- this.contentId = null;
763
- /**
764
- * @hidden
765
- */
766
- this.showLicenseWatermark = false;
767
- /**
768
- * Fires when the user clicks an action button of the Dialog.
769
- * The event is fired only when the action buttons are specified through the `actions` options.
770
- */
771
- this.action = new EventEmitter();
772
- /**
773
- * Fires when the user clicks the **Close** button of the Dialog or the **ESC** key.
774
- */
775
- this.close = new EventEmitter();
776
- this.tabIndex = 0;
777
- this._themeColor = null;
778
- this.subscriptions = [];
779
- this.domSubs = new Subscription();
780
- const isValid = validatePackage(packageMetadata);
781
- this.showLicenseWatermark = shouldShowValidationUI(isValid);
782
- this.direction = localization.rtl ? 'rtl' : 'ltr';
783
- this.subscriptions.push(localization.changes.subscribe(({ rtl }) => (this.direction = rtl ? 'rtl' : 'ltr')));
784
- this.titleId = this.generateTitleId();
785
- this.contentId = this.generateContentId();
786
- }
787
- /**
788
- * The Dialog allows you to specify predefined theme colors.
789
- * The theme color will be applied as a background and border color to the titlebar while also amending the text color accordingly.
790
- *
791
- * The possible values are:
792
- * * `primary`
793
- * * `dark`
794
- * * `light`
795
- */
796
- set themeColor(themeColor) {
797
- this.handleThemeColorClass(this.themeColor, themeColor);
798
- this._themeColor = themeColor;
799
- }
800
- get themeColor() {
801
- return this._themeColor;
802
- }
803
- /**
804
- * @hidden
805
- */
806
- set htmlAttributes(attributes) {
807
- setHTMLAttributes(attributes, this.renderer, this.wrapper.nativeElement);
808
- const el = this.wrapper.nativeElement;
809
- const dir = el.getAttribute('dir');
810
- const tIndex = el.getAttribute('tabindex');
811
- if (this.direction !== dir && dir) {
812
- this.direction = dir;
813
- }
814
- if (this.tabIndex !== tIndex && tIndex) {
815
- this.tabIndex = tIndex;
816
- }
817
- this._htmlAttributes = attributes;
818
- }
819
- get htmlAttributes() {
820
- return this._htmlAttributes;
821
- }
822
- /**
823
- * @hidden
824
- */
825
- set cssClass(classes) {
826
- this.setServiceClasses(this._cssClass, classes);
827
- this._cssClass = classes;
828
- }
829
- get cssClass() {
830
- return this._cssClass;
831
- }
832
- get dir() {
833
- return this.direction;
834
- }
835
- ngAfterContentInit() {
836
- this.bubble('close', this.titlebarContent.first);
837
- this.renderer.setAttribute(this.wrapper.nativeElement.querySelector('.k-dialog'), 'aria-describedby', this.contentId);
838
- if (this.titlebarContent.first) {
839
- this.titlebarContent.first.id = this.titleId;
840
- }
841
- else {
842
- this.subscriptions.push(this.titlebarContent.changes.subscribe(() => {
843
- if (isPresent(this.titlebarContent.first)) {
844
- this.titlebarContent.first.id = this.titleId;
845
- this.ngZone.onStable.pipe(take(1)).subscribe(() => {
846
- this.bubble('close', this.titlebarContent.first);
847
- this.renderer.setAttribute(this.wrapper.nativeElement.querySelector('.k-dialog'), 'aria-labelledby', this.titleId);
848
- });
849
- }
850
- }));
851
- }
852
- }
853
- ngAfterViewInit() {
854
- if (!isDocumentAvailable()) {
855
- return;
856
- }
857
- this.ngZone.onStable.pipe(take(1)).subscribe(() => {
858
- this.handleInitialFocus();
859
- });
860
- this.bubble('close', this.titlebarView.first);
861
- this.bubble('action', this.actionsView);
862
- if (this.titlebarView.first || this.titlebarContent.first) {
863
- //Needed for Dialogs created via service
864
- this.renderer.setAttribute(this.wrapper.nativeElement.querySelector('.k-dialog'), 'aria-labelledby', this.titleId);
865
- }
866
- else {
867
- this.subscriptions.push(this.titlebarView.changes.subscribe(() => {
868
- if (isPresent(this.titlebarView.first)) {
869
- this.titlebarView.first.id = this.titleId;
870
- this.ngZone.onStable.pipe(take(1)).subscribe(() => {
871
- this.bubble('close', this.titlebarView.first);
872
- this.renderer.setAttribute(this.wrapper.nativeElement.querySelector('.k-dialog'), 'aria-labelledby', this.titleId);
873
- });
874
- }
875
- }));
876
- }
877
- this.initDomEvents();
878
- this.handleThemeColorClass(null, this.themeColor);
879
- }
880
- ngOnInit() {
881
- if (this.animation) {
882
- animateContent(this.animation, DEFAULT_ANIMATION_CONFIG, this.dialog.nativeElement, this.builder);
883
- }
884
- this.renderer.removeAttribute(this.wrapper.nativeElement, 'title');
885
- this.cdr.detectChanges();
886
- }
887
- ngOnDestroy() {
888
- this.subscriptions.forEach(s => s.unsubscribe());
889
- this.subscriptions = [];
890
- if (this.domSubs) {
891
- this.domSubs.unsubscribe();
892
- }
893
- }
894
- /**
895
- * Focuses the wrapper of the Dialog component.
896
- */
897
- focus() {
898
- const wrapper = this.wrapper.nativeElement;
899
- if (isPresent(wrapper)) {
900
- wrapper.focus();
901
- }
902
- }
903
- initDomEvents() {
904
- if (!this.wrapper) {
905
- return;
906
- }
907
- this.ngZone.runOutsideAngular(() => {
908
- this.domSubs.add(this.renderer.listen(this.wrapper.nativeElement, 'keydown', (ev) => {
909
- this.onKeyDown(ev);
910
- }));
911
- });
912
- }
913
- onKeyDown(event) {
914
- const target = event.target;
915
- const parent = target.parentElement;
916
- if (hasClasses(target, DIALOG_ELEMENTS_HANDLING_ESC_KEY) || hasClasses(parent, DIALOG_ELEMENTS_HANDLING_ESC_KEY)) {
917
- if (event.keyCode === Keys.esc) {
918
- this.ngZone.run(() => {
919
- this.close.emit(new DialogCloseResult());
920
- });
921
- }
922
- }
923
- if (hasClasses(target, 'k-button') && hasClasses(parent, DIALOG_ELEMENTS_HANDLING_ARROWS) &&
924
- (event.keyCode === Keys.left || event.keyCode === Keys.right)) {
925
- this.ngZone.run(() => {
926
- this.handleActionButtonFocus(parent, event.keyCode);
927
- });
928
- }
929
- if (event.keyCode === Keys.tab) {
930
- this.ngZone.run(() => {
931
- this.keepFocusWithinComponent(target, event);
932
- });
933
- }
934
- }
935
- setServiceClasses(prevValue, value) {
936
- const el = this.wrapper.nativeElement;
937
- if (prevValue) {
938
- parseCSSClassNames(prevValue).forEach(className => {
939
- this.renderer.removeClass(el, className);
940
- });
941
- }
942
- if (value) {
943
- parseCSSClassNames(value).forEach(className => {
944
- this.renderer.addClass(el, className);
945
- });
946
- }
947
- }
948
- /**
949
- * @hidden
950
- */
951
- handleInitialFocus() {
952
- const wrapper = this.wrapper.nativeElement;
953
- const primaryButton = this.findPrimary(wrapper);
954
- if (this.autoFocusedElement) {
955
- const initiallyFocusedElement = wrapper.querySelector(this.autoFocusedElement);
956
- if (initiallyFocusedElement) {
957
- initiallyFocusedElement.focus();
958
- }
959
- }
960
- else if (this.shouldFocusPrimary(primaryButton)) {
961
- primaryButton.focus();
962
- }
963
- else {
964
- wrapper.focus();
965
- }
966
- }
967
- /**
968
- * @hidden
969
- */
970
- findPrimary(wrapper) {
971
- const actionBtns = wrapper.querySelectorAll('.k-actions .k-button');
972
- return findPrimaryButton(actionBtns);
973
- }
974
- /**
975
- * @hidden
976
- */
977
- handleActionButtonFocus(parent, key) {
978
- const focusableActionButtons = this.getAllFocusableChildren(parent);
979
- for (let i = 0; i < focusableActionButtons.length; i++) {
980
- const current = focusableActionButtons[i];
981
- if (current === document.activeElement) {
982
- if (key === Keys.left && i > 0) {
983
- focusableActionButtons[i - 1].focus();
984
- break;
985
- }
986
- if (key === Keys.right && i < focusableActionButtons.length - 1) {
987
- focusableActionButtons[i + 1].focus();
988
- break;
989
- }
990
- }
991
- }
992
- }
993
- /**
994
- * @hidden
995
- */
996
- keepFocusWithinComponent(target, event) {
997
- const wrapper = this.wrapper.nativeElement;
998
- const [firstFocusable, lastFocusable] = this.getFirstAndLastFocusable(wrapper);
999
- const tabAfterLastFocusable = !event.shiftKey && target === lastFocusable;
1000
- const shiftTabAfterFirstFocusable = event.shiftKey && target === firstFocusable;
1001
- if (tabAfterLastFocusable) {
1002
- event.preventDefault();
1003
- firstFocusable.focus();
1004
- }
1005
- if (shiftTabAfterFirstFocusable) {
1006
- event.preventDefault();
1007
- lastFocusable.focus();
1008
- }
1009
- }
1010
- /**
1011
- * @hidden
1012
- */
1013
- shouldFocusPrimary(el) {
1014
- return isPresent(el) && isFocusable(el);
1015
- }
1016
- /**
1017
- * @hidden
1018
- */
1019
- getAllFocusableChildren(parent) {
1020
- return parent.querySelectorAll(focusableSelector);
1021
- }
1022
- /**
1023
- * @hidden
1024
- */
1025
- getFirstAndLastFocusable(parent) {
1026
- const all = this.getAllFocusableChildren(parent);
1027
- const firstFocusable = all.length > 0 ? all[0] : parent;
1028
- const lastFocusable = all.length > 0 ? all[all.length - 1] : parent;
1029
- return [firstFocusable, lastFocusable];
1030
- }
1031
- /**
1032
- * @hidden
1033
- */
1034
- generateTitleId() {
1035
- return 'kendo-dialog-title-' + Math.ceil(Math.random() * 1000000).toString();
1036
- }
1037
- /**
1038
- * @hidden
1039
- */
1040
- generateContentId() {
1041
- return 'kendo-dialog-content-' + Math.ceil(Math.random() * 1000000).toString();
1042
- }
1043
- get wrapperClass() {
1044
- return true;
1045
- }
1046
- get styles() {
1047
- const styles = {};
1048
- if (this.width) {
1049
- styles.width = createValueWithUnit(this.width);
1050
- }
1051
- if (this.height) {
1052
- styles.height = createValueWithUnit(this.height);
1053
- }
1054
- if (this.minWidth) {
1055
- styles.minWidth = createValueWithUnit(this.minWidth);
1056
- }
1057
- if (this.maxWidth) {
1058
- styles.maxWidth = createValueWithUnit(this.maxWidth);
1059
- }
1060
- if (this.minHeight) {
1061
- styles.minHeight = createValueWithUnit(this.minHeight);
1062
- }
1063
- if (this.maxHeight) {
1064
- styles.maxHeight = createValueWithUnit(this.maxHeight);
1065
- }
1066
- return styles;
1067
- }
1068
- bubble(eventName, component) {
1069
- if (component) {
1070
- const emit = e => this[eventName].emit(e);
1071
- const s = component[eventName].subscribe(emit);
1072
- this.subscriptions.push(s);
1073
- }
1074
- }
1075
- handleThemeColorClass(previousValue, currentValue) {
1076
- const dialog = this.dialog.nativeElement;
1077
- if (previousValue) {
1078
- const classToRemove = `k-dialog-${previousValue}`;
1079
- this.renderer.removeClass(dialog, classToRemove);
1080
- }
1081
- if (currentValue) {
1082
- const classToAdd = `k-dialog-${currentValue}`;
1083
- this.renderer.addClass(dialog, classToAdd);
1084
- }
1085
- }
1086
- }
1087
- DialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.LocalizationService }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i2.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Component });
1088
- DialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DialogComponent, isStandalone: true, selector: "kendo-dialog", inputs: { actions: "actions", actionsLayout: "actionsLayout", autoFocusedElement: "autoFocusedElement", title: "title", width: "width", minWidth: "minWidth", maxWidth: "maxWidth", height: "height", minHeight: "minHeight", maxHeight: "maxHeight", animation: "animation", themeColor: "themeColor" }, outputs: { action: "action", close: "close" }, host: { properties: { "attr.dir": "this.dir", "attr.tabIndex": "this.tabIndex", "class.k-dialog-wrapper": "this.wrapperClass" } }, providers: [
1089
- LocalizationService,
1090
- {
1091
- provide: DIALOG_LOCALIZATION_SERVICE,
1092
- useExisting: LocalizationService
1093
- },
1094
- {
1095
- provide: L10N_PREFIX,
1096
- useValue: 'kendo.dialog'
1097
- }
1098
- ], queries: [{ propertyName: "titlebarContent", predicate: DialogTitleBarComponent }], viewQueries: [{ propertyName: "actionsView", first: true, predicate: DialogActionsComponent, descendants: true }, { propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true, static: true }, { propertyName: "titlebarView", predicate: DialogTitleBarComponent, descendants: true }], exportAs: ["kendoDialog"], ngImport: i0, template: `
1099
- <ng-container
1100
- kendoDialogLocalizedMessages
1101
- i18n-closeTitle="kendo.dialog.closeTitle|The title of the close button"
1102
- closeTitle="Close"
1103
- >
1104
- <div class="k-overlay" @overlayAppear></div>
1105
-
1106
- <div #dialog class="k-window k-dialog" role="dialog" aria-modal="true" [ngStyle]="styles">
1107
- <kendo-dialog-titlebar *ngIf="title" [closeTitle]="closeTitle" [id]="titleId">{{ title }}</kendo-dialog-titlebar>
1108
- <ng-content select="kendo-dialog-titlebar" *ngIf="!title"></ng-content>
1109
-
1110
- <div [id]="contentId" class="k-window-content k-dialog-content">
1111
- <ng-content *ngIf="!contentTemplate"></ng-content>
1112
- <ng-template [ngTemplateOutlet]="contentTemplate" *ngIf="contentTemplate"></ng-template>
1113
- </div>
1114
-
1115
- <ng-content select="kendo-dialog-actions" *ngIf="!actions"></ng-content>
1116
- <kendo-dialog-actions *ngIf="actions" [actions]="actions" [layout]="actionsLayout"> </kendo-dialog-actions>
1117
-
1118
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
1119
- </div>
1120
- </ng-container>
1121
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDialogLocalizedMessages],\n [kendoWindowLocalizedMessages],\n [kendoDialogTitleBarLocalizedMessages]\n " }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DialogTitleBarComponent, selector: "kendo-dialog-titlebar", inputs: ["id", "closeTitle"], outputs: ["close"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }], animations: [
1122
- trigger('overlayAppear', [
1123
- state('in', style({ opacity: 1 })),
1124
- transition('void => *', [style({ opacity: 0.1 }), animate('.3s cubic-bezier(.2, .6, .4, 1)')])
1125
- ])
1126
- ] });
1127
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogComponent, decorators: [{
1128
- type: Component,
1129
- args: [{
1130
- animations: [
1131
- trigger('overlayAppear', [
1132
- state('in', style({ opacity: 1 })),
1133
- transition('void => *', [style({ opacity: 0.1 }), animate('.3s cubic-bezier(.2, .6, .4, 1)')])
1134
- ])
1135
- ],
1136
- exportAs: 'kendoDialog',
1137
- providers: [
1138
- LocalizationService,
1139
- {
1140
- provide: DIALOG_LOCALIZATION_SERVICE,
1141
- useExisting: LocalizationService
1142
- },
1143
- {
1144
- provide: L10N_PREFIX,
1145
- useValue: 'kendo.dialog'
1146
- }
1147
- ],
1148
- selector: 'kendo-dialog',
1149
- template: `
1150
- <ng-container
1151
- kendoDialogLocalizedMessages
1152
- i18n-closeTitle="kendo.dialog.closeTitle|The title of the close button"
1153
- closeTitle="Close"
1154
- >
1155
- <div class="k-overlay" @overlayAppear></div>
1156
-
1157
- <div #dialog class="k-window k-dialog" role="dialog" aria-modal="true" [ngStyle]="styles">
1158
- <kendo-dialog-titlebar *ngIf="title" [closeTitle]="closeTitle" [id]="titleId">{{ title }}</kendo-dialog-titlebar>
1159
- <ng-content select="kendo-dialog-titlebar" *ngIf="!title"></ng-content>
1160
-
1161
- <div [id]="contentId" class="k-window-content k-dialog-content">
1162
- <ng-content *ngIf="!contentTemplate"></ng-content>
1163
- <ng-template [ngTemplateOutlet]="contentTemplate" *ngIf="contentTemplate"></ng-template>
1164
- </div>
1165
-
1166
- <ng-content select="kendo-dialog-actions" *ngIf="!actions"></ng-content>
1167
- <kendo-dialog-actions *ngIf="actions" [actions]="actions" [layout]="actionsLayout"> </kendo-dialog-actions>
1168
-
1169
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
1170
- </div>
1171
- </ng-container>
1172
- `,
1173
- standalone: true,
1174
- imports: [LocalizedMessagesDirective, NgStyle, NgIf, DialogTitleBarComponent, NgTemplateOutlet, DialogActionsComponent, WatermarkOverlayComponent]
1175
- }]
1176
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.LocalizationService }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i2.AnimationBuilder }]; }, propDecorators: { actions: [{
1177
- type: Input
1178
- }], actionsLayout: [{
1179
- type: Input
1180
- }], autoFocusedElement: [{
1181
- type: Input
1182
- }], title: [{
1183
- type: Input
1184
- }], width: [{
1185
- type: Input
1186
- }], minWidth: [{
1187
- type: Input
1188
- }], maxWidth: [{
1189
- type: Input
1190
- }], height: [{
1191
- type: Input
1192
- }], minHeight: [{
1193
- type: Input
1194
- }], maxHeight: [{
1195
- type: Input
1196
- }], animation: [{
1197
- type: Input
1198
- }], themeColor: [{
1199
- type: Input
1200
- }], action: [{
1201
- type: Output
1202
- }], close: [{
1203
- type: Output
1204
- }], dir: [{
1205
- type: HostBinding,
1206
- args: ['attr.dir']
1207
- }], tabIndex: [{
1208
- type: HostBinding,
1209
- args: ['attr.tabIndex']
1210
- }], titlebarContent: [{
1211
- type: ContentChildren,
1212
- args: [DialogTitleBarComponent, { descendants: false }]
1213
- }], titlebarView: [{
1214
- type: ViewChildren,
1215
- args: [DialogTitleBarComponent]
1216
- }], actionsView: [{
1217
- type: ViewChild,
1218
- args: [DialogActionsComponent, { static: false }]
1219
- }], dialog: [{
1220
- type: ViewChild,
1221
- args: ['dialog', { static: true }]
1222
- }], wrapperClass: [{
1223
- type: HostBinding,
1224
- args: ['class.k-dialog-wrapper']
1225
- }] } });
1226
-
1227
- /**
1228
- * Holds references to the object instance and published events of the Dialog.
1229
- * Controls the Dialogs that were opened through the `DialogService`
1230
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
1231
- */
1232
- class DialogRef {
1233
- }
1234
-
1235
- /**
1236
- * The base class which will be extended by a component that is provided as content through `content`
1237
- * ([see example](slug:service_dialog#toc-single-component-rendering)).
1238
- */
1239
- class DialogContentBase {
1240
- constructor(dialog) {
1241
- this.dialog = dialog;
1242
- }
1243
- /**
1244
- * @hidden
1245
- */
1246
- ngAfterViewInit() {
1247
- if (this.dialogTitleBar) {
1248
- // when opening component inside dialog with service AND the component has defined its own titlebar
1249
- this.dialogTitleBar.close.pipe(filter((e) => !e.isDefaultPrevented())).subscribe(() => {
1250
- this.dialog.close();
1251
- });
1252
- }
1253
- if (this.dialogActions) {
1254
- if (this.dialogActions.actions) {
1255
- this.dialogActions.action.subscribe(action => this.dialog.dialog.instance.action.emit(action));
1256
- }
1257
- }
1258
- }
1259
- }
1260
- DialogContentBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContentBase, deps: [{ token: DialogRef }], target: i0.ɵɵFactoryTarget.Directive });
1261
- DialogContentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DialogContentBase, viewQueries: [{ propertyName: "dialogTitleBar", first: true, predicate: DialogTitleBarComponent, descendants: true }, { propertyName: "dialogActions", first: true, predicate: DialogActionsComponent, descendants: true }], ngImport: i0 });
1262
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContentBase, decorators: [{
1263
- type: Directive
1264
- }], ctorParameters: function () { return [{ type: DialogRef }]; }, propDecorators: { dialogTitleBar: [{
1265
- type: ViewChild,
1266
- args: [DialogTitleBarComponent, { static: false }]
1267
- }], dialogActions: [{
1268
- type: ViewChild,
1269
- args: [DialogActionsComponent, { static: false }]
1270
- }] } });
1271
-
1272
- /**
1273
- * @hidden
1274
- */
1275
- class DialogContainerService {
1276
- set container(container) {
1277
- DialogContainerService.container = container;
1278
- }
1279
- get container() {
1280
- return DialogContainerService.container;
1281
- }
1282
- }
1283
- DialogContainerService.container = null;
1284
- DialogContainerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
1285
- DialogContainerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerService, providedIn: 'root' });
1286
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerService, decorators: [{
1287
- type: Injectable,
1288
- args: [{
1289
- providedIn: 'root'
1290
- }]
1291
- }] });
1292
-
1293
- /**
1294
- * The settings for the Dialog actions when the Dialog is opened through `DialogService`
1295
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
1296
- */
1297
- class DialogAction {
1298
- }
1299
-
1300
- /**
1301
- * The settings that can be used when the Dialog is opened through `DialogService`.
1302
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
1303
- */
1304
- class DialogSettings {
1305
- }
1306
-
1307
- // eslint-disable max-line-length
1308
- const isNotComponent$1 = (component) => isString(component) || component instanceof TemplateRef;
1309
- class DialogInjector {
1310
- constructor(getDialogRef, parentInjector) {
1311
- this.getDialogRef = getDialogRef;
1312
- this.parentInjector = parentInjector;
1313
- }
1314
- get(token, notFoundValue) {
1315
- if (token === DialogRef) {
1316
- return this.getDialogRef();
1317
- }
1318
- return this.parentInjector.get(token, notFoundValue);
1319
- }
1320
- }
1321
- /**
1322
- * A service for opening Dialog windows dynamically
1323
- * ([see example]({% slug service_dialog %})).
1324
- */
1325
- class DialogService {
1326
- constructor(
1327
- /**
1328
- * @hidden
1329
- */
1330
- resolver, containerService) {
1331
- this.resolver = resolver;
1332
- this.containerService = containerService;
1333
- }
1334
- /**
1335
- * Opens a Dialog window. Requires an element in the application that uses the
1336
- * [`kendoDialogContainer`]({% slug api_dialog_dialogcontainerdirective %}) directive.
1337
- * Created Dialogs will be mounted in the DOM directly after that element.
1338
- *
1339
- * @param {DialogAction} options - The options that define the Dialog.
1340
- * @returns {DialogRef} - A reference to the Dialog object and the convenience properties.
1341
- *
1342
- * @example
1343
- *
1344
- * ```ts-no-run
1345
- * _@Component({
1346
- * selector: 'my-app',
1347
- * template: `
1348
- * <button kendoButton (click)="open()">Harmless button</button>
1349
- * <div kendoDialogContainer></div>
1350
- * `
1351
- * })
1352
- * export class AppComponent {
1353
- * constructor( private dialogService: DialogService ) {}
1354
- *
1355
- * public open() {
1356
- * var dialog = this.dialogService.open({
1357
- * title: "Please confirm",
1358
- * content: "Are you sure?",
1359
- * actions: [
1360
- * { text: "No" },
1361
- * { text: "Yes", themeColor: 'primary' }
1362
- * ]
1363
- * });
1364
- *
1365
- * dialog.result.subscribe((result) => {
1366
- * if (result instanceof DialogCloseResult) {
1367
- * console.log("close");
1368
- * } else {
1369
- * console.log("action", result);
1370
- * }
1371
- * });
1372
- * }
1373
- * }
1374
- * ```
1375
- *
1376
- */
1377
- open(options) {
1378
- const factory = this.resolver.resolveComponentFactory(DialogComponent);
1379
- const container = options.appendTo || this.containerService.container;
1380
- if (!container) {
1381
- throw new Error(`
1382
- Cannot attach dialog to the page.
1383
- Add an element that uses the kendoDialogContainer directive, or set the 'appendTo' property.
1384
- See https://www.telerik.com/kendo-angular-ui/components/dialogs/dialog/service/.
1385
- `);
1386
- }
1387
- // create DialogRef to (1) pass as result, (2) provide through injector
1388
- const dialogRef = {
1389
- close: () => {
1390
- /* noop */
1391
- },
1392
- content: null,
1393
- dialog: null,
1394
- result: null
1395
- };
1396
- return this.initializeDialog(options.content, factory, container, dialogRef, options);
1397
- }
1398
- initializeDialog(component, factory, container, dialogRef, options) {
1399
- const content = this.contentFrom(component, container, dialogRef);
1400
- const dialog = container.createComponent(factory, undefined, undefined, content.nodes);
1401
- dialogRef.dialog = dialog;
1402
- dialog.changeDetectorRef.markForCheck();
1403
- // copy @Input options to dialog instance
1404
- this.applyOptions(dialog.instance, options);
1405
- // create close handler and result stream
1406
- const apiClose = new Subject();
1407
- const close = (e) => {
1408
- if (e instanceof PreventableEvent) {
1409
- e = new DialogCloseResult();
1410
- }
1411
- apiClose.next(e || new DialogCloseResult());
1412
- if (content.componentRef) {
1413
- content.componentRef.destroy();
1414
- }
1415
- dialog.destroy();
1416
- };
1417
- const result = merge(apiClose,
1418
- // triggered when the titlebar or actions are defined in DialogSettings
1419
- merge(dialog.instance.close, dialog.instance.action).pipe(map(e => (e instanceof PreventableEvent ? new DialogCloseResult() : e)), filter(e => {
1420
- if (options.preventAction) {
1421
- // add dialogRef only when using component
1422
- const dialogRefParameter = isNotComponent$1(component) ? undefined : dialogRef;
1423
- return !options.preventAction(e, dialogRefParameter);
1424
- }
1425
- return true;
1426
- }))).pipe(take(1),
1427
- // Takes care for multiple subscriptions:
1428
- // We subscribe internaly and the user may subscribe to get a close result - dialog.result.subscribe().
1429
- // This causes multiple subscriptions to the same source and thus multiple emissions. share() solves that.
1430
- share());
1431
- result.subscribe(close);
1432
- dialogRef.close = close;
1433
- dialogRef.result = result;
1434
- if (component && isDevMode()) {
1435
- const hasContentTitle = content.nodes[0] && content.nodes[0].length > 0;
1436
- const hasContentActions = content.nodes[2] && content.nodes[2].length > 0;
1437
- const multipleTitles = options.title && hasContentTitle;
1438
- const multipleActions = options.actions && hasContentActions;
1439
- if (component.prototype instanceof DialogContentBase) {
1440
- // content component extends DialogContentBase
1441
- if (multipleTitles || multipleActions) {
1442
- console.warn(`
1443
- Multiple Title and/or Actions configurations detected.
1444
- When using a component as content, provide the title and actions either in the component's markup
1445
- or via the title and actions properties of the DialogSettings object, but not both.
1446
- See https://www.telerik.com/kendo-angular-ui/components/dialogs/dialog/service/#toc-passing-title-content-and-actions-as-a-single-component'`);
1447
- }
1448
- }
1449
- else {
1450
- if (hasContentTitle || hasContentActions) {
1451
- console.warn(`
1452
- When Title and/or Actions markup is provided in content component's template,
1453
- the component needs to inherit the DialogContentBase class to ensure that close and result events are properly hooked.
1454
- See https://www.telerik.com/kendo-angular-ui/components/dialogs/dialog/service/#toc-passing-title-content-and-actions-as-a-single-component'`);
1455
- }
1456
- }
1457
- }
1458
- return dialogRef;
1459
- }
1460
- applyOptions(instance, options) {
1461
- instance.title = options.title;
1462
- instance.actions = options.actions;
1463
- instance.actionsLayout = options.actionsLayout || 'stretched';
1464
- instance.width = options.width;
1465
- instance.minWidth = options.minWidth;
1466
- instance.maxWidth = options.maxWidth;
1467
- instance.height = options.height;
1468
- instance.minHeight = options.minHeight;
1469
- instance.maxHeight = options.maxHeight;
1470
- instance.autoFocusedElement = options.autoFocusedElement;
1471
- instance.themeColor = options.themeColor != undefined ? options.themeColor : null;
1472
- instance.closeTitle = options.closeTitle;
1473
- instance.cssClass = options.cssClass;
1474
- instance.htmlAttributes = options.htmlAttributes;
1475
- instance.animation = options.animation !== undefined ? options.animation : true;
1476
- if (options.content instanceof TemplateRef) {
1477
- instance.contentTemplate = options.content;
1478
- }
1479
- }
1480
- contentFrom(content, container, dialogRef) {
1481
- const renderer = container.injector.get(Renderer2);
1482
- let nodes = [];
1483
- let titleNodes = [];
1484
- let actionNodes = [];
1485
- let componentRef = null;
1486
- if (typeof content === 'string') {
1487
- nodes = [renderer.createText(content)];
1488
- }
1489
- else if (content && !(content instanceof TemplateRef)) {
1490
- // Component
1491
- const injector = new DialogInjector(() => dialogRef, container.injector);
1492
- const factory = this.resolver.resolveComponentFactory(content);
1493
- componentRef = container.createComponent(factory, undefined, injector);
1494
- titleNodes = Array.from(componentRef.location.nativeElement.querySelectorAll('kendo-dialog-titlebar'));
1495
- nodes = [componentRef.location.nativeElement];
1496
- actionNodes = Array.from(componentRef.location.nativeElement.querySelectorAll('kendo-dialog-actions'));
1497
- dialogRef.content = componentRef;
1498
- }
1499
- return {
1500
- componentRef,
1501
- nodes: [
1502
- titleNodes,
1503
- nodes,
1504
- actionNodes // <ng-content select="kendo-dialog-actions">
1505
- ]
1506
- };
1507
- }
1508
- }
1509
- DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogService, deps: [{ token: i0.ComponentFactoryResolver }, { token: DialogContainerService }], target: i0.ɵɵFactoryTarget.Injectable });
1510
- DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogService, providedIn: 'root' });
1511
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogService, decorators: [{
1512
- type: Injectable,
1513
- args: [{
1514
- providedIn: 'root'
1515
- }]
1516
- }], ctorParameters: function () {
1517
- return [{ type: i0.ComponentFactoryResolver }, { type: DialogContainerService, decorators: [{
1518
- type: Inject,
1519
- args: [DialogContainerService]
1520
- }] }];
1521
- } });
1522
-
1523
- /**
1524
- * @hidden
1525
- */
1526
- let newZIndex = 10002;
1527
- /**
1528
- * @hidden
1529
- */
1530
- const DEFAULT_OPTIONS = {
1531
- draggable: true,
1532
- height: null,
1533
- left: null,
1534
- minHeight: 100,
1535
- minWidth: 120,
1536
- position: 'absolute',
1537
- resizable: true,
1538
- state: 'default',
1539
- top: null,
1540
- width: null
1541
- };
1542
- /**
1543
- * @hidden
1544
- */
1545
- const createMoveStream = (el, ev) => mouseDown => {
1546
- return el.kendoDrag
1547
- .pipe(takeUntil(el.kendoRelease.pipe(tap(() => { ev.emit(); }))), map(({ pageX, pageY }) => ({
1548
- originalX: mouseDown.pageX,
1549
- originalY: mouseDown.pageY,
1550
- pageX,
1551
- pageY
1552
- })));
1553
- };
1554
- /**
1555
- * @hidden
1556
- */
1557
- class DragResizeService {
1558
- constructor(ngZone) {
1559
- this.ngZone = ngZone;
1560
- this.close = new EventEmitter();
1561
- this.focus = new EventEmitter();
1562
- this.change = new EventEmitter();
1563
- this.stateChange = new EventEmitter();
1564
- this.dragStart = new EventEmitter();
1565
- this.dragEnd = new EventEmitter();
1566
- this.resizeStart = new EventEmitter();
1567
- this.resizeEnd = new EventEmitter();
1568
- this.options = Object.assign({}, DEFAULT_OPTIONS);
1569
- this.lastAction = null;
1570
- this.subscriptions = new Subscription();
1571
- this.dragSubscription = new Subscription();
1572
- }
1573
- ngOnDestroy() {
1574
- if (this.subscriptions) {
1575
- this.subscriptions.unsubscribe();
1576
- }
1577
- if (this.dragSubscription) {
1578
- this.dragSubscription.unsubscribe();
1579
- }
1580
- }
1581
- init(el) {
1582
- const state = this.options.state;
1583
- const options = this.options;
1584
- this.window = el;
1585
- if (state !== 'default') {
1586
- this.restoreOptions = Object.assign({}, options);
1587
- }
1588
- if (state === 'minimized') {
1589
- options.height = 0;
1590
- options.minHeight = 0;
1591
- }
1592
- if (state === 'maximized') {
1593
- options.position = 'fixed';
1594
- }
1595
- }
1596
- onDrag(el) {
1597
- this.subscriptions.add(this.ngZone.runOutsideAngular(() => {
1598
- let startPosition;
1599
- let dragStarted;
1600
- this.dragSubscription = el.kendoPress
1601
- .pipe(tap((ev) => {
1602
- if (!ev.isTouch) {
1603
- preventDefault(ev);
1604
- }
1605
- this.focus.emit();
1606
- startPosition = this.currentPosition();
1607
- dragStarted = false;
1608
- }), switchMap(createMoveStream(el, this.dragEnd)))
1609
- .subscribe(({ pageX, pageY, originalX, originalY }) => {
1610
- if (!dragStarted) {
1611
- this.ensureWidth();
1612
- this.dragStart.emit();
1613
- dragStarted = true;
1614
- }
1615
- this.handleDrag({
1616
- originalX, originalY,
1617
- pageX, pageY, startPosition
1618
- });
1619
- });
1620
- }));
1621
- }
1622
- handleDrag({ originalX, originalY, pageX, pageY, startPosition }) {
1623
- this.options.left = startPosition.x + pageX - originalX;
1624
- this.options.top = startPosition.y + pageY - originalY;
1625
- if (this.options.state === 'minimized' && isPresent(this.restoreOptions)) {
1626
- this.restoreOptions.left = this.options.left;
1627
- this.restoreOptions.top = this.options.top;
1628
- }
1629
- this.change.emit({
1630
- left: startPosition.x + pageX - originalX,
1631
- top: startPosition.y + pageY - originalY
1632
- });
1633
- }
1634
- onResize(handle, direction) {
1635
- this.subscriptions.add(this.ngZone.runOutsideAngular(() => {
1636
- let startOffsetAndPosition;
1637
- let resizeStarted = false;
1638
- handle.kendoPress.pipe(tap((ev) => {
1639
- preventDefault(ev);
1640
- this.focus.emit();
1641
- startOffsetAndPosition = this.currentOffsetAndPosition();
1642
- resizeStarted = false;
1643
- }), switchMap(createMoveStream(handle, this.resizeEnd)))
1644
- .subscribe(({ pageX, pageY, originalX, originalY }) => {
1645
- if (!resizeStarted) {
1646
- this.resizeStart.emit(direction);
1647
- resizeStarted = true;
1648
- }
1649
- const deltaX = pageX - originalX;
1650
- const deltaY = pageY - originalY;
1651
- this.handleResize(startOffsetAndPosition, direction, deltaX, deltaY);
1652
- });
1653
- }));
1654
- }
1655
- handleResize(initial, dir, deltaX, deltaY) {
1656
- const old = this.options;
1657
- const ev = {};
1658
- if (dir.indexOf('e') >= 0) {
1659
- const newWidth = initial.width + deltaX;
1660
- if (newWidth !== old.width && newWidth >= old.minWidth) {
1661
- ev.width = newWidth;
1662
- }
1663
- }
1664
- if (dir.indexOf('n') >= 0) {
1665
- const newHeight = initial.height - deltaY;
1666
- const newTop = initial.y + deltaY;
1667
- if (newHeight !== old.height && newHeight >= old.minHeight && newTop !== old.top) {
1668
- ev.height = newHeight;
1669
- ev.top = newTop;
1670
- }
1671
- }
1672
- if (dir.indexOf('s') >= 0) {
1673
- const newHeight = initial.height + deltaY;
1674
- if (newHeight !== old.height && newHeight >= old.minHeight) {
1675
- ev.height = newHeight;
1676
- }
1677
- }
1678
- if (dir.indexOf('w') >= 0) {
1679
- const newLeft = initial.x + deltaX;
1680
- const newWidth = initial.width - deltaX;
1681
- if (newWidth !== old.width && newWidth >= old.minWidth && newLeft !== old.left) {
1682
- ev.width = newWidth;
1683
- ev.left = newLeft;
1684
- }
1685
- }
1686
- if (isPresent(ev.width) || isPresent(ev.height)) {
1687
- OFFSET_STYLES.forEach((style) => {
1688
- if (isPresent(ev[style])) {
1689
- this.options[style] = ev[style];
1690
- }
1691
- });
1692
- this.change.emit(ev);
1693
- }
1694
- }
1695
- restoreAction() {
1696
- this.lastAction = 'restore';
1697
- this.defaultState();
1698
- }
1699
- defaultState() {
1700
- if (isPresent(this.restoreOptions)) {
1701
- this.options = Object.assign({}, this.restoreOptions);
1702
- }
1703
- this.options.state = 'default';
1704
- this.ngZone.onStable.pipe(take(1)).subscribe(() => {
1705
- if (!isPresent(this.options.left) || !isPresent(this.options.top)) {
1706
- this.center();
1707
- }
1708
- });
1709
- this.stateChange.emit('default');
1710
- }
1711
- storeOptions() {
1712
- this.restoreOptions = Object.assign({}, this.options);
1713
- }
1714
- maximizeAction() {
1715
- this.lastAction = 'maximize';
1716
- this.maximizeState();
1717
- }
1718
- maximizeState() {
1719
- this.storeOptions();
1720
- const wnd = this.windowViewPort;
1721
- this.options = Object.assign({}, this.options, {
1722
- height: wnd.height,
1723
- left: 0,
1724
- position: 'fixed',
1725
- state: 'maximized',
1726
- top: 0,
1727
- width: wnd.width
1728
- });
1729
- this.stateChange.emit('maximized');
1730
- }
1731
- minimizeAction() {
1732
- this.lastAction = 'minimize';
1733
- this.minimizeState();
1734
- }
1735
- minimizeState() {
1736
- this.storeOptions();
1737
- this.options = Object.assign({}, this.options, {
1738
- height: null,
1739
- minHeight: 0,
1740
- state: 'minimized'
1741
- });
1742
- this.stateChange.emit('minimized');
1743
- }
1744
- /**
1745
- * Handles manual changes of the 'state' property.
1746
- * Required to distinguish them from action clicks.
1747
- */
1748
- applyManualState() {
1749
- const state = this.options.state;
1750
- switch (state) {
1751
- case 'default':
1752
- this.clearHeight();
1753
- this.defaultState();
1754
- break;
1755
- case 'maximized':
1756
- this.clearHeight();
1757
- this.maximizeState();
1758
- break;
1759
- case 'minimized':
1760
- this.minimizeState();
1761
- break;
1762
- default:
1763
- break;
1764
- }
1765
- }
1766
- closeAction() {
1767
- this.close.emit();
1768
- }
1769
- ensureWidth() {
1770
- const windowOffset = offset(this.window.nativeElement);
1771
- if (!isPresent(this.options.width)) {
1772
- this.options.width = windowOffset.width;
1773
- this.change.emit({ width: windowOffset.width });
1774
- }
1775
- }
1776
- clearHeight() {
1777
- if (this.options.height === 0) {
1778
- delete this.options.height;
1779
- }
1780
- if (this.options.minHeight === 0) {
1781
- delete this.options.minHeight;
1782
- }
1783
- }
1784
- center() {
1785
- if (this.options.state === 'maximized') {
1786
- return;
1787
- }
1788
- const scroll = scrollPosition(this.window.nativeElement);
1789
- const wnd = this.windowViewPort;
1790
- const wrapper = offset(this.window.nativeElement);
1791
- const ev = {};
1792
- if (!isPresent(this.options.left)) {
1793
- this.options.left = scroll.x + Math.max(0, (wnd.width - wrapper.width) / 2);
1794
- ev.left = this.options.left;
1795
- }
1796
- if (!isPresent(this.options.top)) {
1797
- this.options.top = scroll.y + Math.max(0, (wnd.height - wrapper.height) / 2);
1798
- ev.top = this.options.top;
1799
- }
1800
- this.change.emit(ev);
1801
- }
1802
- currentOffsetAndPosition() {
1803
- const o = this.options;
1804
- const off = offset(this.window.nativeElement);
1805
- return Object.assign({}, this.currentPosition(), {
1806
- height: o.height ? o.height : off.height,
1807
- width: o.width ? o.width : off.width
1808
- });
1809
- }
1810
- currentPosition() {
1811
- const o = this.options;
1812
- if (!o.top || !o.left) {
1813
- this.setPosition();
1814
- }
1815
- return {
1816
- x: this.options.left,
1817
- y: this.options.top
1818
- };
1819
- }
1820
- setPosition() {
1821
- const wrapper = positionWithScroll(this.window.nativeElement, getDocumentElement(this.window.nativeElement));
1822
- this.options.left = wrapper.left;
1823
- this.options.top = wrapper.top;
1824
- }
1825
- setRestoreOption(style, value) {
1826
- if (isPresent(this.restoreOptions)) {
1827
- this.restoreOptions[style] = value;
1828
- }
1829
- }
1830
- get nextPossibleZIndex() {
1831
- return newZIndex;
1832
- }
1833
- get nextZIndex() {
1834
- return newZIndex++;
1835
- }
1836
- get windowViewPort() {
1837
- return getWindowViewPort(this.window.nativeElement);
1838
- }
1839
- }
1840
- DragResizeService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DragResizeService, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
1841
- DragResizeService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DragResizeService });
1842
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DragResizeService, decorators: [{
1843
- type: Injectable
1844
- }], ctorParameters: function () { return [{ type: i0.NgZone }]; } });
1845
-
1846
- /**
1847
- * @hidden
1848
- */
1849
- class ResizeHandleDirective {
1850
- constructor(draggable, el, renderer, service) {
1851
- this.draggable = draggable;
1852
- this.el = el;
1853
- this.renderer = renderer;
1854
- this.service = service;
1855
- this.subscriptions = new Subscription();
1856
- }
1857
- get hostClass() {
1858
- return true;
1859
- }
1860
- ngOnInit() {
1861
- this.setDisplay();
1862
- this.renderer.addClass(this.el.nativeElement, 'k-resize-' + this.direction);
1863
- this.subscriptions.add(of(this.draggable).subscribe(handle => {
1864
- this.service.onResize(handle, this.direction);
1865
- }));
1866
- this.subscriptions.add(this.service.resizeStart.subscribe((dir) => {
1867
- if (dir !== this.direction) {
1868
- this.setDisplay('none');
1869
- }
1870
- }));
1871
- this.subscriptions.add(this.service.dragStart.subscribe(() => {
1872
- this.setDisplay('none');
1873
- }));
1874
- this.subscriptions.add(merge(this.service.resizeEnd, this.service.dragEnd).subscribe(() => {
1875
- this.setDisplay('block');
1876
- }));
1877
- this.subscriptions.add(this.service.stateChange.subscribe((state) => {
1878
- this.setDisplay(state === 'default' ? 'block' : 'none');
1879
- }));
1880
- }
1881
- ngOnDestroy() {
1882
- this.subscriptions.unsubscribe();
1883
- }
1884
- setDisplay(value = 'block') {
1885
- this.renderer.setStyle(this.el.nativeElement, 'display', this.service.options.state === 'default' ? value : 'none');
1886
- }
1887
- }
1888
- ResizeHandleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeHandleDirective, deps: [{ token: i1$1.DraggableDirective, host: true }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DragResizeService }], target: i0.ɵɵFactoryTarget.Directive });
1889
- ResizeHandleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: ResizeHandleDirective, isStandalone: true, selector: "[kendoWindowResizeHandle]", inputs: { direction: "direction" }, host: { properties: { "class.k-resize-handle": "this.hostClass" } }, ngImport: i0 });
1890
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ResizeHandleDirective, decorators: [{
1891
- type: Directive,
1892
- args: [{
1893
- selector: '[kendoWindowResizeHandle]',
1894
- standalone: true
1895
- }]
1896
- }], ctorParameters: function () {
1897
- return [{ type: i1$1.DraggableDirective, decorators: [{
1898
- type: Host
1899
- }] }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DragResizeService }];
1900
- }, propDecorators: { direction: [{
1901
- type: Input
1902
- }], hostClass: [{
1903
- type: HostBinding,
1904
- args: ['class.k-resize-handle']
1905
- }] } });
1906
-
1907
- class WindowTitleBarComponent {
1908
- constructor(el, service, ngZone) {
1909
- this.el = el;
1910
- this.ngZone = ngZone;
1911
- this.service = service;
1912
- }
1913
- ngOnInit() {
1914
- this.dragDirective = new DraggableDirective(this.el, this.ngZone);
1915
- this.dragDirective.ngOnInit();
1916
- if (this.isDraggable) {
1917
- this.subscribeDrag();
1918
- }
1919
- this.subscribeStateChange();
1920
- }
1921
- ngAfterViewInit() {
1922
- const element = this.el.nativeElement.querySelector('.k-window-title');
1923
- if (isPresent(element)) {
1924
- element.setAttribute('id', this.id);
1925
- }
1926
- }
1927
- ngOnDestroy() {
1928
- this.dragDirective.ngOnDestroy();
1929
- this.unsubscribeDrag();
1930
- this.unsubscribeState();
1931
- }
1932
- /**
1933
- * @hidden
1934
- */
1935
- subscribeDrag() {
1936
- this.unsubscribeDrag();
1937
- this.dragSubscription = of(this.dragDirective).subscribe(titleBar => {
1938
- this.service.onDrag(titleBar);
1939
- });
1940
- }
1941
- /**
1942
- * @hidden
1943
- */
1944
- subscribeStateChange() {
1945
- this.stateSubscription = this.service.stateChange.subscribe((state) => {
1946
- if (this.service.options.draggable) {
1947
- if (state === 'maximized') {
1948
- this.unsubscribeDrag();
1949
- }
1950
- else {
1951
- this.subscribeDrag();
1952
- }
1953
- }
1954
- });
1955
- }
1956
- /**
1957
- * @hidden
1958
- */
1959
- unsubscribeDrag() {
1960
- if (this.dragSubscription) {
1961
- this.service.dragSubscription.unsubscribe();
1962
- this.dragSubscription.unsubscribe();
1963
- this.dragSubscription = null;
1964
- }
1965
- }
1966
- /**
1967
- * @hidden
1968
- */
1969
- unsubscribeState() {
1970
- if (this.stateSubscription) {
1971
- this.stateSubscription.unsubscribe();
1972
- this.stateSubscription = null;
1973
- }
1974
- }
1975
- get className() {
1976
- return true;
1977
- }
1978
- get touchAction() {
1979
- if (this.isDraggable) {
1980
- return 'none';
1981
- }
1982
- }
1983
- /**
1984
- * @hidden
1985
- */
1986
- handle(ev) {
1987
- const target = ev.target;
1988
- const state = this.service.options.state;
1989
- if (!hasClasses(target, 'k-icon') && !isFocusable(target, false) && this.service.options.resizable) {
1990
- if (state === 'default') {
1991
- this.service.maximizeAction();
1992
- }
1993
- else if (state === 'maximized') {
1994
- this.service.restoreAction();
1995
- }
1996
- }
1997
- }
1998
- get isDraggable() {
1999
- const options = this.service.options;
2000
- return options.draggable && options.state !== 'maximized';
2001
- }
2002
- }
2003
- WindowTitleBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowTitleBarComponent, deps: [{ token: i0.ElementRef }, { token: DragResizeService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
2004
- WindowTitleBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WindowTitleBarComponent, isStandalone: true, selector: "kendo-window-titlebar", inputs: { template: "template", id: "id" }, host: { listeners: { "dblclick": "handle($event)" }, properties: { "class.k-window-titlebar": "this.className", "style.touch-action": "this.touchAction" } }, ngImport: i0, template: `
2005
- <ng-content *ngIf="!template"></ng-content>
2006
- <ng-template
2007
- [ngTemplateOutlet]="template"
2008
- [ngTemplateOutletContext]="{'$implicit': service}" *ngIf="template">
2009
- </ng-template>
2010
- `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
2011
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowTitleBarComponent, decorators: [{
2012
- type: Component,
2013
- args: [{
2014
- selector: 'kendo-window-titlebar',
2015
- template: `
2016
- <ng-content *ngIf="!template"></ng-content>
2017
- <ng-template
2018
- [ngTemplateOutlet]="template"
2019
- [ngTemplateOutletContext]="{'$implicit': service}" *ngIf="template">
2020
- </ng-template>
2021
- `,
2022
- standalone: true,
2023
- imports: [NgIf, NgTemplateOutlet]
2024
- }]
2025
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: DragResizeService }, { type: i0.NgZone }]; }, propDecorators: { template: [{
2026
- type: Input
2027
- }], id: [{
2028
- type: Input
2029
- }], className: [{
2030
- type: HostBinding,
2031
- args: ['class.k-window-titlebar']
2032
- }], touchAction: [{
2033
- type: HostBinding,
2034
- args: ['style.touch-action']
2035
- }], handle: [{
2036
- type: HostListener,
2037
- args: ['dblclick', ['$event']]
2038
- }] } });
2039
-
2040
- /**
2041
- * @hidden
2042
- */
2043
- class NavigationService {
2044
- constructor(window, ngZone) {
2045
- this.window = window;
2046
- this.ngZone = ngZone;
2047
- }
2048
- process(ev) {
2049
- const key = ev.keyCode;
2050
- switch (key) {
2051
- case Keys.up:
2052
- case Keys.down:
2053
- case Keys.left:
2054
- case Keys.right: {
2055
- ev.preventDefault();
2056
- this.ngZone.run(() => {
2057
- this.handleArrow(key, ev);
2058
- });
2059
- break;
2060
- }
2061
- case Keys.esc:
2062
- this.ngZone.run(() => {
2063
- this.handleEscape();
2064
- });
2065
- break;
2066
- default:
2067
- break;
2068
- }
2069
- }
2070
- handleArrow(key, ev) {
2071
- const options = this.window.options;
2072
- if (ev.altKey) {
2073
- this.handleStateChange(key, options.state);
2074
- return;
2075
- }
2076
- if ((ev.ctrlKey || ev.metaKey) && options.state === 'default') {
2077
- this.handleResize(key);
2078
- }
2079
- else {
2080
- this.handleDrag(key);
2081
- }
2082
- }
2083
- handleEscape() {
2084
- this.window.closeAction();
2085
- }
2086
- handleDrag(key) {
2087
- const options = this.window.options;
2088
- if (!options.draggable) {
2089
- return;
2090
- }
2091
- const offset = this.window.currentOffsetAndPosition();
2092
- const restoreOptions = this.window.restoreOptions;
2093
- const ev = {};
2094
- let delta = 10;
2095
- if (key === Keys.left || key === Keys.up) {
2096
- delta *= -1;
2097
- }
2098
- switch (key) {
2099
- case Keys.left:
2100
- case Keys.right: {
2101
- ev.left = offset.x + delta;
2102
- options.left = ev.left;
2103
- break;
2104
- }
2105
- case Keys.up:
2106
- case Keys.down: {
2107
- ev.top = offset.y + delta;
2108
- options.top = ev.top;
2109
- break;
2110
- }
2111
- default:
2112
- break;
2113
- }
2114
- if (options.state === 'minimized' && isPresent(restoreOptions)) {
2115
- restoreOptions.left = options.left;
2116
- restoreOptions.top = options.top;
2117
- }
2118
- this.window.change.emit(ev);
2119
- }
2120
- handleResize(key) {
2121
- const options = this.window.options;
2122
- if (!options.resizable) {
2123
- return;
2124
- }
2125
- const offset = this.window.currentOffsetAndPosition();
2126
- let newWidth;
2127
- let newHeight;
2128
- const ev = {};
2129
- let delta = 10;
2130
- if (key === Keys.left || key === Keys.up) {
2131
- delta *= -1;
2132
- }
2133
- switch (key) {
2134
- case Keys.left:
2135
- case Keys.right: {
2136
- newWidth = offset.width + delta;
2137
- if (newWidth !== options.width && newWidth >= options.minWidth) {
2138
- ev.width = newWidth;
2139
- }
2140
- break;
2141
- }
2142
- case Keys.up:
2143
- case Keys.down: {
2144
- newHeight = offset.height + delta;
2145
- if (newHeight !== options.height && newHeight >= options.minHeight) {
2146
- ev.height = newHeight;
2147
- }
2148
- break;
2149
- }
2150
- default:
2151
- break;
2152
- }
2153
- if (isPresent(ev.width) || isPresent(ev.height)) {
2154
- OFFSET_STYLES.forEach((style) => {
2155
- if (isPresent(ev[style])) {
2156
- this.window.options[style] = ev[style];
2157
- }
2158
- });
2159
- this.window.change.emit(ev);
2160
- }
2161
- }
2162
- handleStateChange(key, state) {
2163
- if ((state === 'minimized' && key === Keys.up) ||
2164
- (state === 'maximized' && key === Keys.down)) {
2165
- this.window.restoreAction();
2166
- return;
2167
- }
2168
- if (state === 'default') {
2169
- if (key === Keys.up) {
2170
- this.window.maximizeAction();
2171
- }
2172
- else if (key === Keys.down) {
2173
- this.window.minimizeAction();
2174
- }
2175
- }
2176
- }
2177
- }
2178
- NavigationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NavigationService, deps: [{ token: DragResizeService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
2179
- NavigationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NavigationService });
2180
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NavigationService, decorators: [{
2181
- type: Injectable
2182
- }], ctorParameters: function () { return [{ type: DragResizeService }, { type: i0.NgZone }]; } });
2183
-
2184
- class WindowCloseActionDirective extends Button {
2185
- constructor(el, renderer, _service, localization, ngZone) {
2186
- super(el, renderer, null, localization, ngZone);
2187
- /**
2188
- * @hidden
2189
- */
2190
- this.xIcon = xIcon;
2191
- this.buttonType = 'button';
2192
- this.buttonClass = true;
2193
- this.window = _service;
2194
- this.fillMode = 'flat';
2195
- this.icon = 'x';
2196
- }
2197
- /**
2198
- * @hidden
2199
- */
2200
- onClick() {
2201
- if (!this.isDisabled) {
2202
- this.window.closeAction();
2203
- }
2204
- }
2205
- }
2206
- WindowCloseActionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowCloseActionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DragResizeService, optional: true }, { token: i1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
2207
- WindowCloseActionDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WindowCloseActionDirective, isStandalone: true, selector: "button[kendoWindowCloseAction]", inputs: { window: "window" }, host: { listeners: { "click": "onClick()" }, properties: { "attr.type": "this.buttonType", "class.k-window-titlebar-action": "this.buttonClass" } }, providers: [
2208
- LocalizationService,
2209
- {
2210
- provide: L10N_PREFIX,
2211
- useValue: 'kendo.button'
2212
- }
2213
- ], exportAs: ["kendoWindowCloseAction"], usesInheritance: true, ngImport: i0, template: `
2214
- <kendo-icon-wrapper
2215
- *ngIf="!imageUrl && !iconClass"
2216
- innerCssClass="k-button-icon"
2217
- name="close"
2218
- [svgIcon]="xIcon">
2219
- </kendo-icon-wrapper>
2220
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2221
- <img [src]="imageUrl" class="k-image" role="presentation" />
2222
- </span>
2223
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2224
- <span class="k-button-text"><ng-content></ng-content></span>
2225
- `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2226
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowCloseActionDirective, decorators: [{
2227
- type: Component,
2228
- args: [{
2229
- exportAs: 'kendoWindowCloseAction',
2230
- providers: [
2231
- LocalizationService,
2232
- {
2233
- provide: L10N_PREFIX,
2234
- useValue: 'kendo.button'
2235
- }
2236
- ],
2237
- selector: 'button[kendoWindowCloseAction]',
2238
- template: `
2239
- <kendo-icon-wrapper
2240
- *ngIf="!imageUrl && !iconClass"
2241
- innerCssClass="k-button-icon"
2242
- name="close"
2243
- [svgIcon]="xIcon">
2244
- </kendo-icon-wrapper>
2245
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2246
- <img [src]="imageUrl" class="k-image" role="presentation" />
2247
- </span>
2248
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2249
- <span class="k-button-text"><ng-content></ng-content></span>
2250
- `,
2251
- standalone: true,
2252
- imports: [NgIf, IconWrapperComponent, NgClass]
2253
- }]
2254
- }], ctorParameters: function () {
2255
- return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DragResizeService, decorators: [{
2256
- type: Optional
2257
- }] }, { type: i1.LocalizationService }, { type: i0.NgZone }];
2258
- }, propDecorators: { window: [{
2259
- type: Input
2260
- }], buttonType: [{
2261
- type: HostBinding,
2262
- args: ['attr.type']
2263
- }], buttonClass: [{
2264
- type: HostBinding,
2265
- args: ['class.k-window-titlebar-action']
2266
- }], onClick: [{
2267
- type: HostListener,
2268
- args: ['click']
2269
- }] } });
2270
-
2271
- class WindowRestoreActionDirective extends Button {
2272
- constructor(el, renderer, _service, localization, ngZone) {
2273
- super(el, renderer, null, localization, ngZone);
2274
- /**
2275
- * @hidden
2276
- */
2277
- this.windowRestoreIcon = windowRestoreIcon;
2278
- this.buttonType = 'button';
2279
- this.buttonClass = true;
2280
- this.window = _service;
2281
- this.fillMode = 'flat';
2282
- this.icon = 'window-restore';
2283
- }
2284
- /**
2285
- * @hidden
2286
- */
2287
- onClick() {
2288
- if (!this.isDisabled) {
2289
- this.window.restoreAction();
2290
- }
2291
- }
2292
- get visible() {
2293
- return this.window.options.state === 'default' ? 'none' : 'inline-flex';
2294
- }
2295
- }
2296
- WindowRestoreActionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowRestoreActionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DragResizeService, optional: true }, { token: i1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
2297
- WindowRestoreActionDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WindowRestoreActionDirective, isStandalone: true, selector: "button[kendoWindowRestoreAction]", inputs: { window: "window" }, host: { listeners: { "click": "onClick()" }, properties: { "attr.type": "this.buttonType", "class.k-window-titlebar-action": "this.buttonClass", "style.display": "this.visible" } }, providers: [
2298
- LocalizationService,
2299
- {
2300
- provide: L10N_PREFIX,
2301
- useValue: 'kendo.button'
2302
- }
2303
- ], exportAs: ["kendoWindowRestoreAction"], usesInheritance: true, ngImport: i0, template: `
2304
- <kendo-icon-wrapper
2305
- *ngIf="!imageUrl && !iconClass"
2306
- innerCssClass="k-button-icon"
2307
- name="window-restore"
2308
- [svgIcon]="windowRestoreIcon">
2309
- </kendo-icon-wrapper>
2310
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2311
- <img [src]="imageUrl" class="k-image" role="presentation" />
2312
- </span>
2313
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2314
- <span class="k-button-text"><ng-content></ng-content></span>
2315
- `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2316
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowRestoreActionDirective, decorators: [{
2317
- type: Component,
2318
- args: [{
2319
- exportAs: 'kendoWindowRestoreAction',
2320
- providers: [
2321
- LocalizationService,
2322
- {
2323
- provide: L10N_PREFIX,
2324
- useValue: 'kendo.button'
2325
- }
2326
- ],
2327
- selector: 'button[kendoWindowRestoreAction]',
2328
- template: `
2329
- <kendo-icon-wrapper
2330
- *ngIf="!imageUrl && !iconClass"
2331
- innerCssClass="k-button-icon"
2332
- name="window-restore"
2333
- [svgIcon]="windowRestoreIcon">
2334
- </kendo-icon-wrapper>
2335
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2336
- <img [src]="imageUrl" class="k-image" role="presentation" />
2337
- </span>
2338
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2339
- <span class="k-button-text"><ng-content></ng-content></span>
2340
- `,
2341
- standalone: true,
2342
- imports: [NgIf, IconWrapperComponent, NgClass]
2343
- }]
2344
- }], ctorParameters: function () {
2345
- return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DragResizeService, decorators: [{
2346
- type: Optional
2347
- }] }, { type: i1.LocalizationService }, { type: i0.NgZone }];
2348
- }, propDecorators: { window: [{
2349
- type: Input
2350
- }], buttonType: [{
2351
- type: HostBinding,
2352
- args: ['attr.type']
2353
- }], buttonClass: [{
2354
- type: HostBinding,
2355
- args: ['class.k-window-titlebar-action']
2356
- }], onClick: [{
2357
- type: HostListener,
2358
- args: ['click']
2359
- }], visible: [{
2360
- type: HostBinding,
2361
- args: ['style.display']
2362
- }] } });
2363
-
2364
- class WindowMaximizeActionDirective extends Button {
2365
- constructor(el, renderer, _service, localization, ngZone) {
2366
- super(el, renderer, null, localization, ngZone);
2367
- this.buttonType = 'button';
2368
- this.buttonClass = true;
2369
- /**
2370
- * @hidden
2371
- */
2372
- this.windowIcon = windowIcon;
2373
- this.window = _service;
2374
- this.fillMode = 'flat';
2375
- this.icon = 'window';
2376
- }
2377
- /**
2378
- * @hidden
2379
- */
2380
- onClick() {
2381
- if (!this.isDisabled) {
2382
- this.window.maximizeAction();
2383
- }
2384
- }
2385
- get visible() {
2386
- return this.window.options.state === 'default' ? 'inline-flex' : 'none';
2387
- }
2388
- }
2389
- WindowMaximizeActionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowMaximizeActionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DragResizeService, optional: true }, { token: i1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
2390
- WindowMaximizeActionDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WindowMaximizeActionDirective, isStandalone: true, selector: "button[kendoWindowMaximizeAction]", inputs: { window: "window" }, host: { listeners: { "click": "onClick()" }, properties: { "attr.type": "this.buttonType", "class.k-window-titlebar-action": "this.buttonClass", "style.display": "this.visible" } }, providers: [
2391
- LocalizationService,
2392
- {
2393
- provide: L10N_PREFIX,
2394
- useValue: 'kendo.button'
2395
- }
2396
- ], exportAs: ["kendoWindowMaximizeAction"], usesInheritance: true, ngImport: i0, template: `
2397
- <kendo-icon-wrapper
2398
- *ngIf="!imageUrl && !iconClass"
2399
- innerCssClass="k-button-icon"
2400
- name="window"
2401
- [svgIcon]="windowIcon">
2402
- </kendo-icon-wrapper>
2403
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2404
- <img [src]="imageUrl" class="k-image" role="presentation" />
2405
- </span>
2406
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2407
- <span class="k-button-text"><ng-content></ng-content></span>
2408
- `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2409
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowMaximizeActionDirective, decorators: [{
2410
- type: Component,
2411
- args: [{
2412
- exportAs: 'kendoWindowMaximizeAction',
2413
- providers: [
2414
- LocalizationService,
2415
- {
2416
- provide: L10N_PREFIX,
2417
- useValue: 'kendo.button'
2418
- }
2419
- ],
2420
- selector: 'button[kendoWindowMaximizeAction]',
2421
- template: `
2422
- <kendo-icon-wrapper
2423
- *ngIf="!imageUrl && !iconClass"
2424
- innerCssClass="k-button-icon"
2425
- name="window"
2426
- [svgIcon]="windowIcon">
2427
- </kendo-icon-wrapper>
2428
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2429
- <img [src]="imageUrl" class="k-image" role="presentation" />
2430
- </span>
2431
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2432
- <span class="k-button-text"><ng-content></ng-content></span>
2433
- `,
2434
- standalone: true,
2435
- imports: [NgIf, IconWrapperComponent, NgClass]
2436
- }]
2437
- }], ctorParameters: function () {
2438
- return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DragResizeService, decorators: [{
2439
- type: Optional
2440
- }] }, { type: i1.LocalizationService }, { type: i0.NgZone }];
2441
- }, propDecorators: { window: [{
2442
- type: Input
2443
- }], buttonType: [{
2444
- type: HostBinding,
2445
- args: ['attr.type']
2446
- }], buttonClass: [{
2447
- type: HostBinding,
2448
- args: ['class.k-window-titlebar-action']
2449
- }], onClick: [{
2450
- type: HostListener,
2451
- args: ['click']
2452
- }], visible: [{
2453
- type: HostBinding,
2454
- args: ['style.display']
2455
- }] } });
2456
-
2457
- class WindowMinimizeActionDirective extends Button {
2458
- constructor(el, renderer, _service, localization, ngZone) {
2459
- super(el, renderer, null, localization, ngZone);
2460
- this.buttonType = 'button';
2461
- this.buttonClass = true;
2462
- /**
2463
- * @hidden
2464
- */
2465
- this.windowMinimizeIcon = windowMinimizeIcon;
2466
- this.window = _service;
2467
- this.fillMode = 'flat';
2468
- this.icon = 'window-minimize';
2469
- }
2470
- /**
2471
- * @hidden
2472
- */
2473
- onClick() {
2474
- if (!this.isDisabled) {
2475
- this.window.minimizeAction();
2476
- }
2477
- }
2478
- get visible() {
2479
- return this.window.options.state === 'default' ? 'inline-flex' : 'none';
2480
- }
2481
- }
2482
- WindowMinimizeActionDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowMinimizeActionDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DragResizeService, optional: true }, { token: i1.LocalizationService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
2483
- WindowMinimizeActionDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WindowMinimizeActionDirective, isStandalone: true, selector: "button[kendoWindowMinimizeAction]", inputs: { window: "window" }, host: { listeners: { "click": "onClick()" }, properties: { "attr.type": "this.buttonType", "class.k-window-titlebar-action": "this.buttonClass", "style.display": "this.visible" } }, providers: [
2484
- LocalizationService,
2485
- {
2486
- provide: L10N_PREFIX,
2487
- useValue: 'kendo.button'
2488
- }
2489
- ], exportAs: ["kendoWindowMinimizeAction"], usesInheritance: true, ngImport: i0, template: `
2490
- <kendo-icon-wrapper
2491
- *ngIf="!imageUrl && !iconClass"
2492
- innerCssClass="k-button-icon"
2493
- name="window-minimize"
2494
- [svgIcon]="windowMinimizeIcon">
2495
- </kendo-icon-wrapper>
2496
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2497
- <img [src]="imageUrl" class="k-image" role="presentation" />
2498
- </span>
2499
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2500
- <span class="k-button-text"><ng-content></ng-content></span>
2501
- `, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
2502
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowMinimizeActionDirective, decorators: [{
2503
- type: Component,
2504
- args: [{
2505
- exportAs: 'kendoWindowMinimizeAction',
2506
- providers: [
2507
- LocalizationService,
2508
- {
2509
- provide: L10N_PREFIX,
2510
- useValue: 'kendo.button'
2511
- }
2512
- ],
2513
- selector: 'button[kendoWindowMinimizeAction]',
2514
- template: `
2515
- <kendo-icon-wrapper
2516
- *ngIf="!imageUrl && !iconClass"
2517
- innerCssClass="k-button-icon"
2518
- name="window-minimize"
2519
- [svgIcon]="windowMinimizeIcon">
2520
- </kendo-icon-wrapper>
2521
- <span *ngIf="imageUrl" class="k-button-icon k-icon">
2522
- <img [src]="imageUrl" class="k-image" role="presentation" />
2523
- </span>
2524
- <span *ngIf="iconClass" class="k-button-icon" [ngClass]="iconClass"></span>
2525
- <span class="k-button-text"><ng-content></ng-content></span>
2526
- `,
2527
- standalone: true,
2528
- imports: [NgIf, IconWrapperComponent, NgClass]
2529
- }]
2530
- }], ctorParameters: function () {
2531
- return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DragResizeService, decorators: [{
2532
- type: Optional
2533
- }] }, { type: i1.LocalizationService }, { type: i0.NgZone }];
2534
- }, propDecorators: { window: [{
2535
- type: Input
2536
- }], buttonType: [{
2537
- type: HostBinding,
2538
- args: ['attr.type']
2539
- }], buttonClass: [{
2540
- type: HostBinding,
2541
- args: ['class.k-window-titlebar-action']
2542
- }], onClick: [{
2543
- type: HostListener,
2544
- args: ['click']
2545
- }], visible: [{
2546
- type: HostBinding,
2547
- args: ['style.display']
2548
- }] } });
2549
-
2550
- /**
2551
- * Represents the [Kendo UI Window component for Angular]({% slug overview_window_dialogs %}).
2552
- */
2553
- class WindowComponent {
2554
- constructor(el, renderer, service, navigation, ngZone, localization) {
2555
- this.el = el;
2556
- this.renderer = renderer;
2557
- this.service = service;
2558
- this.navigation = navigation;
2559
- this.ngZone = ngZone;
2560
- this.localization = localization;
2561
- /**
2562
- * Specifies if the content of the component is persisted in the DOM when minimized.
2563
- * @default false
2564
- */
2565
- this.keepContent = false;
2566
- /**
2567
- * Fires when the user starts to move the Window.
2568
- */
2569
- this.dragStart = new EventEmitter();
2570
- /**
2571
- * Fires when the Window was moved by the user.
2572
- */
2573
- this.dragEnd = new EventEmitter();
2574
- /**
2575
- * Fires when the user starts to resize the Window.
2576
- */
2577
- this.resizeStart = new EventEmitter();
2578
- /**
2579
- * Fires when the Window was resized by the user.
2580
- */
2581
- this.resizeEnd = new EventEmitter();
2582
- /**
2583
- * Fires when the user closes the Window.
2584
- */
2585
- this.close = new EventEmitter();
2586
- /**
2587
- * Fires when the `width` property of the component was updated. The event is triggered only after the resizing
2588
- * has ended. The event data contains the new width. Allows a two-way binding of the `width` property.
2589
- */
2590
- this.widthChange = new EventEmitter();
2591
- /**
2592
- * Fires when the `height` property of the component was updated. The event is triggered only after the resizing
2593
- * has ended. The event data contains the new height. Allows a two-way binding of the `height` property.
2594
- */
2595
- this.heightChange = new EventEmitter();
2596
- /**
2597
- * Fires when the `top` property of the component was updated. The event is triggered only after the dragging
2598
- * and resizing have ended. The event data contains the new top offset. Allows a two-way binding of the `top` property.
2599
- */
2600
- this.topChange = new EventEmitter();
2601
- /**
2602
- * Fires when the `left` property of the component was updated. The event is triggered only after the dragging
2603
- * and resizing have ended. The event data contains the new left offset. Allows a two-way binding of the `left` property.
2604
- */
2605
- this.leftChange = new EventEmitter();
2606
- /**
2607
- * Fires when the `state` property of the component was updated. The event data contains the new state. Allows a
2608
- * two-way binding of the `state` property.
2609
- */
2610
- this.stateChange = new EventEmitter();
2611
- /**
2612
- * @hidden
2613
- */
2614
- this.messages = {};
2615
- /**
2616
- * @hidden
2617
- */
2618
- this.showLicenseWatermark = false;
2619
- this.tabIndex = 0;
2620
- this.role = 'dialog';
2621
- this.hostClass = true;
2622
- /**
2623
- * @hidden
2624
- */
2625
- this.titleId = null;
2626
- this._themeColor = null;
2627
- this.draged = false;
2628
- this.resized = false;
2629
- this.windowSubscription = new Subscription();
2630
- this.domSubs = new Subscription();
2631
- const isValid = validatePackage(packageMetadata);
2632
- this.showLicenseWatermark = shouldShowValidationUI(isValid);
2633
- this.direction = this.localization.rtl ? 'rtl' : 'ltr';
2634
- this.localizationChangeSubscription = this.localization.changes
2635
- .subscribe(({ rtl }) => this.direction = rtl ? 'rtl' : 'ltr');
2636
- this.resizeDirections = RESIZE_DIRECTIONS;
2637
- this.subscribeEvents();
2638
- this.titleId = this.generateTitleId();
2639
- }
2640
- /**
2641
- * Specifies whether the user will be able to drag the component.
2642
- * @default true
2643
- */
2644
- set draggable(value) {
2645
- this.options.draggable = value;
2646
- }
2647
- get draggable() {
2648
- return this.options.draggable;
2649
- }
2650
- /**
2651
- * Specifies whether the user will be able to resize the component.
2652
- * @default true
2653
- */
2654
- set resizable(value) {
2655
- this.options.resizable = value;
2656
- }
2657
- get resizable() {
2658
- return this.options.resizable;
2659
- }
2660
- /**
2661
- * The Window allows you to specify predefined theme colors.
2662
- * The theme color will be applied as a background and border color to the titlebar while also amending the text color accordingly.
2663
- *
2664
- * The possible values are:
2665
- * * `primary`
2666
- * * `dark`
2667
- * * `light`
2668
- */
2669
- set themeColor(themeColor) {
2670
- this.handleThemeColorClass(this.themeColor, themeColor);
2671
- this._themeColor = themeColor;
2672
- }
2673
- get themeColor() {
2674
- return this._themeColor;
2675
- }
2676
- /**
2677
- * @hidden
2678
- */
2679
- set cssClass(classes) {
2680
- this.setServiceClasses(this._cssClass, classes);
2681
- this._cssClass = classes;
2682
- }
2683
- get cssClass() {
2684
- return this._cssClass;
2685
- }
2686
- /**
2687
- * @hidden
2688
- */
2689
- set htmlAttributes(attributes) {
2690
- setHTMLAttributes(attributes, this.renderer, this.el.nativeElement);
2691
- const el = this.el.nativeElement;
2692
- const dir = el.getAttribute('dir');
2693
- const tIndex = el.getAttribute('tabindex');
2694
- if (this.direction !== dir) {
2695
- this.direction = dir;
2696
- }
2697
- if (this.tabIndex !== tIndex) {
2698
- this.tabIndex = tIndex;
2699
- }
2700
- this._htmlAttributes = attributes;
2701
- }
2702
- get htmlAttributes() {
2703
- return this._htmlAttributes;
2704
- }
2705
- /**
2706
- * Specifies the initial state of the component.
2707
- * If not specified, the value is set to `default`.
2708
- *
2709
- * The possible values are:
2710
- * * `minimized`
2711
- * * `maximized`
2712
- * * `default`
2713
- */
2714
- set state(value) {
2715
- this.options.state = value;
2716
- }
2717
- get state() {
2718
- return this.options.state;
2719
- }
2720
- /**
2721
- * Specifies the minimum width of the component.
2722
- * The `minWidth` property has to be set in pixels.
2723
- * @default 120
2724
- */
2725
- set minWidth(value) {
2726
- this.setOption('minWidth', value);
2727
- }
2728
- get minWidth() {
2729
- return this.options.minWidth;
2730
- }
2731
- /**
2732
- * Specifies the minimum height of the Window.
2733
- * The `minHeight` property has to be set in pixels.
2734
- * @default 100
2735
- */
2736
- set minHeight(value) {
2737
- this.setOption('minHeight', value);
2738
- }
2739
- get minHeight() {
2740
- return this.options.minHeight;
2741
- }
2742
- /**
2743
- * Specifies the width of the Window.
2744
- * The `width` property has to be set in pixels.
2745
- */
2746
- set width(value) {
2747
- this.setOption('width', value);
2748
- }
2749
- get width() {
2750
- return this.options.width;
2751
- }
2752
- /**
2753
- * Specifies the height of the Window.
2754
- * The `height` property has to be set in pixels.
2755
- */
2756
- set height(value) {
2757
- this.setOption('height', value);
2758
- }
2759
- get height() {
2760
- return this.options.height;
2761
- }
2762
- /**
2763
- * Specifies the initial top offset of the Window.
2764
- * The `top` property has to be set in pixels.
2765
- */
2766
- set top(value) {
2767
- this.setOption('top', value);
2768
- }
2769
- get top() {
2770
- return this.options.top;
2771
- }
2772
- /**
2773
- * Specifies the initial left offset of the Window.
2774
- * Numeric values are treated as pixels.
2775
- */
2776
- set left(value) {
2777
- this.setOption('left', value);
2778
- }
2779
- get left() {
2780
- return this.options.left;
2781
- }
2782
- get closeButtonTitle() {
2783
- if (this.messages && this.messages.closeTitle) {
2784
- return this.messages.closeTitle;
2785
- }
2786
- return this.localization.get('closeTitle');
2787
- }
2788
- get restoreButtonTitle() {
2789
- if (this.messages && this.messages.restoreTitle) {
2790
- return this.messages.restoreTitle;
2791
- }
2792
- return this.localization.get('restoreTitle');
2793
- }
2794
- get maximizeButtonTitle() {
2795
- if (this.messages && this.messages.maximizeTitle) {
2796
- return this.messages.maximizeTitle;
2797
- }
2798
- return this.localization.get('maximizeTitle');
2799
- }
2800
- get minimizeButtonTitle() {
2801
- if (this.messages && this.messages.minimizeTitle) {
2802
- return this.messages.minimizeTitle;
2803
- }
2804
- return this.localization.get('minimizeTitle');
2805
- }
2806
- get dir() {
2807
- return this.direction;
2808
- }
2809
- ngAfterViewInit() {
2810
- if (!isDocumentAvailable()) {
2811
- return;
2812
- }
2813
- this.setNextZIndex();
2814
- this.ngZone.onStable.pipe(take(1)).subscribe(() => {
2815
- this.handleInitialFocus();
2816
- });
2817
- this.ngZone.runOutsideAngular(() => Promise.resolve(null).then(() => this.setInitialOffset()));
2818
- this.initDomEvents();
2819
- if (this.titleBarView || this.titleBarContent) {
2820
- this.renderer.setAttribute(this.el.nativeElement, 'aria-labelledby', this.titleId);
2821
- }
2822
- this.handleThemeColorClass(null, this.themeColor);
2823
- }
2824
- ngOnInit() {
2825
- this.renderer.removeAttribute(this.el.nativeElement, 'title');
2826
- this.service.init(this.el);
2827
- }
2828
- ngOnChanges(changes) {
2829
- OFFSET_STYLES.forEach((style) => {
2830
- if (isChanged(style, changes)) {
2831
- this.setStyle(style, this.options[style]);
2832
- }
2833
- });
2834
- if (isChanged('draggable', changes)) {
2835
- const titleBar = isPresent(this.titleBarContent) ? this.titleBarContent : this.titleBarView;
2836
- if (isTruthy(changes['draggable'].currentValue)) {
2837
- titleBar.subscribeDrag();
2838
- }
2839
- else {
2840
- titleBar.unsubscribeDrag();
2841
- }
2842
- }
2843
- if (isChanged('state', changes)) {
2844
- if (isPresent(this.service.lastAction)) {
2845
- this.service.lastAction = null;
2846
- }
2847
- else {
2848
- this.service.applyManualState();
2849
- this.updateAllOffset();
2850
- }
2851
- }
2852
- }
2853
- ngOnDestroy() {
2854
- if (this.windowSubscription) {
2855
- this.windowSubscription.unsubscribe();
2856
- }
2857
- if (this.domSubs) {
2858
- this.domSubs.unsubscribe();
2859
- }
2860
- this.localizationChangeSubscription.unsubscribe();
2861
- }
2862
- /**
2863
- * Focuses the wrapper of the Window component.
2864
- */
2865
- focus() {
2866
- const wrapper = this.el.nativeElement;
2867
- if (isPresent(wrapper)) {
2868
- wrapper.focus();
2869
- }
2870
- }
2871
- /**
2872
- * Brings the current Window component on top of other Window components on the page.
2873
- */
2874
- bringToFront() {
2875
- this.setNextZIndex();
2876
- }
2877
- /**
2878
- * Manually updates the `width` or `height` option of the Window.
2879
- * The required style will be applied to the Window wrapper element and the
2880
- * corresponding property of the component instance will be updated.
2881
- * This method is intended to be used for sizing dynamically created components using the
2882
- * [`WindowService`]({% slug api_dialog_windowservice %})
2883
- * @param {WindowDimensionSetting} dimension - The option that will be updated
2884
- * @param {number} value - The value set in pixels
2885
- */
2886
- setDimension(dimension, value) {
2887
- this.setOption(dimension, value);
2888
- this.setStyle(dimension, value);
2889
- }
2890
- /**
2891
- * Manually updates the `top` or `left` offset of the Window.
2892
- * The required style will be applied to the Window wrapper element and the
2893
- * corresponding property of the component instance will be updated.
2894
- * This method is intended to be used for positioning dynamically created components using the
2895
- * [`WindowService`]({% slug api_dialog_windowservice %})
2896
- * @param {WindowOffsetSetting} offset - The option that will be updated
2897
- * @param {number} value - The value set in pixels
2898
- */
2899
- setOffset(offset, value) {
2900
- this.setOption(offset, value);
2901
- this.setStyle(offset, value);
2902
- }
2903
- get showDefaultTitleBar() {
2904
- return !isPresent(this.titleBarContent);
2905
- }
2906
- get styleMinWidth() {
2907
- return this.minWidth + 'px';
2908
- }
2909
- get styleMinHeight() {
2910
- return this.minHeight + 'px';
2911
- }
2912
- get stylePosition() {
2913
- return this.options.position;
2914
- }
2915
- get wrapperMaximizedClass() {
2916
- return this.state === 'maximized';
2917
- }
2918
- get wrapperMinimizedClass() {
2919
- return this.state === 'minimized';
2920
- }
2921
- /**
2922
- * @hidden
2923
- */
2924
- onComponentFocus() {
2925
- this.renderer.addClass(this.el.nativeElement, 'k-focus');
2926
- this.setNextZIndex();
2927
- }
2928
- /**
2929
- * @hidden
2930
- */
2931
- onComponentBlur() {
2932
- this.renderer.removeClass(this.el.nativeElement, 'k-focus');
2933
- }
2934
- subscribeEvents() {
2935
- if (!isDocumentAvailable()) {
2936
- return;
2937
- }
2938
- this.windowSubscription.add(this.service.focus.subscribe(() => {
2939
- this.el.nativeElement.focus();
2940
- }));
2941
- this.windowSubscription.add(this.service.dragStart.subscribe(() => {
2942
- this.draged = true;
2943
- this.ngZone.run(() => {
2944
- this.dragStart.emit();
2945
- });
2946
- }));
2947
- this.windowSubscription.add(this.service.dragEnd.subscribe(() => {
2948
- if (this.draged) {
2949
- this.draged = false;
2950
- this.ngZone.run(() => {
2951
- this.dragEnd.emit();
2952
- });
2953
- }
2954
- }));
2955
- this.windowSubscription.add(this.service.close.subscribe(() => {
2956
- this.close.emit();
2957
- }));
2958
- this.windowSubscription.add(this.service.resizeStart.subscribe(() => {
2959
- this.resized = true;
2960
- this.ngZone.run(() => {
2961
- this.resizeStart.emit();
2962
- });
2963
- }));
2964
- this.windowSubscription.add(this.service.resizeEnd.subscribe(() => {
2965
- if (this.resized) {
2966
- this.resized = false;
2967
- this.ngZone.run(() => {
2968
- this.resizeEnd.emit();
2969
- });
2970
- }
2971
- }));
2972
- this.windowSubscription.add(this.service.change.subscribe((ev) => {
2973
- OFFSET_STYLES.forEach((style) => {
2974
- if (isPresent(ev[style])) {
2975
- this.setStyle(style, ev[style]);
2976
- if (this.state !== 'maximized') {
2977
- const emitter = this[style + 'Change'];
2978
- if (emitter.observers.length) {
2979
- this.ngZone.run(() => {
2980
- emitter.emit(ev[style]);
2981
- });
2982
- }
2983
- }
2984
- }
2985
- });
2986
- }));
2987
- this.windowSubscription.add(this.service.stateChange.subscribe((state) => {
2988
- if (isPresent(this.service.lastAction)) {
2989
- this.updateAllOffset();
2990
- this.stateChange.emit(state);
2991
- }
2992
- }));
2993
- }
2994
- initDomEvents() {
2995
- if (!this.el) {
2996
- return;
2997
- }
2998
- this.ngZone.runOutsideAngular(() => {
2999
- this.domSubs.add(this.renderer.listen(this.el.nativeElement, 'keydown', (ev) => {
3000
- this.onKeyDown(ev);
3001
- }));
3002
- });
3003
- }
3004
- onKeyDown(event) {
3005
- if (hasClasses(event.target, WINDOW_CLASSES)) {
3006
- this.navigation.process(event);
3007
- }
3008
- }
3009
- setServiceClasses(prevValue, value) {
3010
- const el = this.el.nativeElement;
3011
- if (prevValue) {
3012
- parseCSSClassNames(prevValue).forEach(className => {
3013
- this.renderer.removeClass(el, className);
3014
- });
3015
- }
3016
- if (value) {
3017
- parseCSSClassNames(value).forEach(className => {
3018
- this.renderer.addClass(el, className);
3019
- });
3020
- }
3021
- }
3022
- setNextZIndex() {
3023
- const currentZIndex = this.el.nativeElement.style['z-index'];
3024
- const nextPossibleZIndex = this.service.nextPossibleZIndex;
3025
- if (!currentZIndex || (nextPossibleZIndex - currentZIndex > 1)) {
3026
- this.renderer.setStyle(this.el.nativeElement, "z-index", this.service.nextZIndex);
3027
- }
3028
- }
3029
- setInitialOffset() {
3030
- if (this.state !== 'maximized') {
3031
- this.updateAllOffset();
3032
- if (!isPresent(this.left) || !isPresent(this.top)) {
3033
- this.service.center();
3034
- }
3035
- }
3036
- else {
3037
- const viewPort = this.service.windowViewPort;
3038
- this.setStyle('width', viewPort.width);
3039
- this.setStyle('height', viewPort.height);
3040
- this.setStyle('top', 0);
3041
- this.setStyle('left', 0);
3042
- }
3043
- }
3044
- updateAllOffset() {
3045
- OFFSET_STYLES.forEach((style) => {
3046
- if (isPresent(this[style])) {
3047
- this.setStyle(style, this[style]);
3048
- }
3049
- else {
3050
- this.removeStyle(style);
3051
- }
3052
- });
3053
- }
3054
- setStyle(style, value) {
3055
- this.renderer.setStyle(this.el.nativeElement, style, value + 'px');
3056
- }
3057
- removeStyle(style) {
3058
- this.renderer.removeStyle(this.el.nativeElement, style);
3059
- }
3060
- get options() {
3061
- return this.service.options;
3062
- }
3063
- setOption(style, value) {
3064
- if (typeof value !== 'number' && typeof value !== 'string') {
3065
- return;
3066
- }
3067
- const parsedValue = (typeof value === 'number') ? value : parseInt(value, 10);
3068
- this.options[style] = parsedValue;
3069
- this.service.setRestoreOption(style, parsedValue);
3070
- }
3071
- handleInitialFocus() {
3072
- const wrapper = this.el.nativeElement;
3073
- if (this.autoFocusedElement) {
3074
- const initiallyFocusedElement = wrapper.querySelector(this.autoFocusedElement);
3075
- if (initiallyFocusedElement) {
3076
- initiallyFocusedElement.focus();
3077
- }
3078
- }
3079
- else {
3080
- this.focus();
3081
- }
3082
- }
3083
- /**
3084
- * @hidden
3085
- */
3086
- generateTitleId() {
3087
- return 'kendo-window-title-' + Math.ceil(Math.random() * 1000000).toString();
3088
- }
3089
- handleThemeColorClass(previousValue, currentValue) {
3090
- const wrapper = this.el.nativeElement;
3091
- if (previousValue) {
3092
- const classToRemove = `k-window-${previousValue}`;
3093
- this.renderer.removeClass(wrapper, classToRemove);
3094
- }
3095
- if (currentValue) {
3096
- const classToAdd = `k-window-${currentValue}`;
3097
- this.renderer.addClass(wrapper, classToAdd);
3098
- }
3099
- }
3100
- }
3101
- WindowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DragResizeService }, { token: NavigationService }, { token: i0.NgZone }, { token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
3102
- WindowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: WindowComponent, isStandalone: true, selector: "kendo-window", inputs: { autoFocusedElement: "autoFocusedElement", title: "title", draggable: "draggable", resizable: "resizable", themeColor: "themeColor", keepContent: "keepContent", state: "state", minWidth: "minWidth", minHeight: "minHeight", width: "width", height: "height", top: "top", left: "left" }, outputs: { dragStart: "dragStart", dragEnd: "dragEnd", resizeStart: "resizeStart", resizeEnd: "resizeEnd", close: "close", widthChange: "widthChange", heightChange: "heightChange", topChange: "topChange", leftChange: "leftChange", stateChange: "stateChange" }, host: { listeners: { "focus": "onComponentFocus()", "blur": "onComponentBlur()" }, properties: { "attr.tabIndex": "this.tabIndex", "attr.role": "this.role", "class.k-window": "this.hostClass", "attr.dir": "this.dir", "style.minWidth": "this.styleMinWidth", "style.minHeight": "this.styleMinHeight", "style.position": "this.stylePosition", "class.k-window-maximized": "this.wrapperMaximizedClass", "class.k-window-minimized": "this.wrapperMinimizedClass" } }, providers: [
3103
- DragResizeService,
3104
- NavigationService,
3105
- LocalizationService,
3106
- {
3107
- provide: L10N_PREFIX,
3108
- useValue: 'kendo.window'
3109
- }
3110
- ], queries: [{ propertyName: "titleBarContent", first: true, predicate: WindowTitleBarComponent, descendants: true }], viewQueries: [{ propertyName: "titleBarView", first: true, predicate: WindowTitleBarComponent, descendants: true }, { propertyName: "resizeHandles", predicate: ResizeHandleDirective, descendants: true }], exportAs: ["kendoWindow"], usesOnChanges: true, ngImport: i0, template: `
3111
- <ng-container kendoWindowLocalizedMessages
3112
- i18n-closeTitle="kendo.window.closeTitle|The title of the close button"
3113
- closeTitle="Close"
3114
-
3115
- i18n-restoreTitle="kendo.window.restoreTitle|The title of the restore button"
3116
- restoreTitle="Restore"
3117
-
3118
- i18n-maximizeTitle="kendo.window.maximizeTitle|The title of the maximize button"
3119
- maximizeTitle="Maximize"
3120
-
3121
- i18n-minimizeTitle="kendo.window.minimizeTitle|The title of the minimize button"
3122
- minimizeTitle="Minimize"
3123
- >
3124
- <ng-container>
3125
-
3126
- <kendo-window-titlebar *ngIf="showDefaultTitleBar" [template]="titleBarTemplate" [id]="titleId">
3127
- <span class="k-window-title">{{ title }}</span>
3128
- <div class="k-window-titlebar-actions">
3129
- <button kendoWindowMinimizeAction [attr.title]="minimizeButtonTitle" [attr.aria-label]="minimizeButtonTitle"></button>
3130
- <button kendoWindowMaximizeAction [attr.title]="maximizeButtonTitle" [attr.aria-label]="maximizeButtonTitle"></button>
3131
- <button kendoWindowRestoreAction [attr.title]="restoreButtonTitle" [attr.aria-label]="restoreButtonTitle"></button>
3132
- <button kendoWindowCloseAction [attr.title]="closeButtonTitle" [attr.aria-label]="closeButtonTitle"></button>
3133
- </div>
3134
- </kendo-window-titlebar>
3135
- <ng-content select="kendo-window-titlebar" *ngIf="!showDefaultTitleBar"></ng-content>
3136
-
3137
- <div *ngIf="state !== 'minimized' || keepContent"
3138
- [hidden]="state === 'minimized' && keepContent"
3139
- class="k-window-content"
3140
- >
3141
- <ng-content *ngIf="!contentTemplate"></ng-content>
3142
- <ng-template [ngTemplateOutlet]="contentTemplate" *ngIf="contentTemplate"></ng-template>
3143
- </div>
3144
-
3145
- <ng-template [ngIf]='resizable'>
3146
- <div *ngFor='let dir of resizeDirections'
3147
- [direction]="dir"
3148
- kendoWindowResizeHandle
3149
- kendoDraggable>
3150
- </div>
3151
- </ng-template>
3152
-
3153
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
3154
- `, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "\n [kendoDialogLocalizedMessages],\n [kendoWindowLocalizedMessages],\n [kendoDialogTitleBarLocalizedMessages]\n " }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WindowTitleBarComponent, selector: "kendo-window-titlebar", inputs: ["template", "id"] }, { kind: "component", type: WindowMinimizeActionDirective, selector: "button[kendoWindowMinimizeAction]", inputs: ["window"], exportAs: ["kendoWindowMinimizeAction"] }, { kind: "component", type: WindowMaximizeActionDirective, selector: "button[kendoWindowMaximizeAction]", inputs: ["window"], exportAs: ["kendoWindowMaximizeAction"] }, { kind: "component", type: WindowRestoreActionDirective, selector: "button[kendoWindowRestoreAction]", inputs: ["window"], exportAs: ["kendoWindowRestoreAction"] }, { kind: "component", type: WindowCloseActionDirective, selector: "button[kendoWindowCloseAction]", inputs: ["window"], exportAs: ["kendoWindowCloseAction"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: ResizeHandleDirective, selector: "[kendoWindowResizeHandle]", inputs: ["direction"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }] });
3155
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowComponent, decorators: [{
3156
- type: Component,
3157
- args: [{
3158
- exportAs: 'kendoWindow',
3159
- providers: [
3160
- DragResizeService,
3161
- NavigationService,
3162
- LocalizationService,
3163
- {
3164
- provide: L10N_PREFIX,
3165
- useValue: 'kendo.window'
3166
- }
3167
- ],
3168
- selector: 'kendo-window',
3169
- template: `
3170
- <ng-container kendoWindowLocalizedMessages
3171
- i18n-closeTitle="kendo.window.closeTitle|The title of the close button"
3172
- closeTitle="Close"
3173
-
3174
- i18n-restoreTitle="kendo.window.restoreTitle|The title of the restore button"
3175
- restoreTitle="Restore"
3176
-
3177
- i18n-maximizeTitle="kendo.window.maximizeTitle|The title of the maximize button"
3178
- maximizeTitle="Maximize"
3179
-
3180
- i18n-minimizeTitle="kendo.window.minimizeTitle|The title of the minimize button"
3181
- minimizeTitle="Minimize"
3182
- >
3183
- <ng-container>
3184
-
3185
- <kendo-window-titlebar *ngIf="showDefaultTitleBar" [template]="titleBarTemplate" [id]="titleId">
3186
- <span class="k-window-title">{{ title }}</span>
3187
- <div class="k-window-titlebar-actions">
3188
- <button kendoWindowMinimizeAction [attr.title]="minimizeButtonTitle" [attr.aria-label]="minimizeButtonTitle"></button>
3189
- <button kendoWindowMaximizeAction [attr.title]="maximizeButtonTitle" [attr.aria-label]="maximizeButtonTitle"></button>
3190
- <button kendoWindowRestoreAction [attr.title]="restoreButtonTitle" [attr.aria-label]="restoreButtonTitle"></button>
3191
- <button kendoWindowCloseAction [attr.title]="closeButtonTitle" [attr.aria-label]="closeButtonTitle"></button>
3192
- </div>
3193
- </kendo-window-titlebar>
3194
- <ng-content select="kendo-window-titlebar" *ngIf="!showDefaultTitleBar"></ng-content>
3195
-
3196
- <div *ngIf="state !== 'minimized' || keepContent"
3197
- [hidden]="state === 'minimized' && keepContent"
3198
- class="k-window-content"
3199
- >
3200
- <ng-content *ngIf="!contentTemplate"></ng-content>
3201
- <ng-template [ngTemplateOutlet]="contentTemplate" *ngIf="contentTemplate"></ng-template>
3202
- </div>
3203
-
3204
- <ng-template [ngIf]='resizable'>
3205
- <div *ngFor='let dir of resizeDirections'
3206
- [direction]="dir"
3207
- kendoWindowResizeHandle
3208
- kendoDraggable>
3209
- </div>
3210
- </ng-template>
3211
-
3212
- <div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
3213
- `,
3214
- standalone: true,
3215
- imports: [LocalizedMessagesDirective, NgIf, WindowTitleBarComponent, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowCloseActionDirective, NgTemplateOutlet, NgFor, ResizeHandleDirective, DraggableDirective, WatermarkOverlayComponent]
3216
- }]
3217
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: DragResizeService }, { type: NavigationService }, { type: i0.NgZone }, { type: i1.LocalizationService }]; }, propDecorators: { autoFocusedElement: [{
3218
- type: Input
3219
- }], title: [{
3220
- type: Input
3221
- }], draggable: [{
3222
- type: Input
3223
- }], resizable: [{
3224
- type: Input
3225
- }], themeColor: [{
3226
- type: Input
3227
- }], keepContent: [{
3228
- type: Input
3229
- }], state: [{
3230
- type: Input
3231
- }], minWidth: [{
3232
- type: Input
3233
- }], minHeight: [{
3234
- type: Input
3235
- }], width: [{
3236
- type: Input
3237
- }], height: [{
3238
- type: Input
3239
- }], top: [{
3240
- type: Input
3241
- }], left: [{
3242
- type: Input
3243
- }], dragStart: [{
3244
- type: Output
3245
- }], dragEnd: [{
3246
- type: Output
3247
- }], resizeStart: [{
3248
- type: Output
3249
- }], resizeEnd: [{
3250
- type: Output
3251
- }], close: [{
3252
- type: Output
3253
- }], widthChange: [{
3254
- type: Output
3255
- }], heightChange: [{
3256
- type: Output
3257
- }], topChange: [{
3258
- type: Output
3259
- }], leftChange: [{
3260
- type: Output
3261
- }], stateChange: [{
3262
- type: Output
3263
- }], tabIndex: [{
3264
- type: HostBinding,
3265
- args: ['attr.tabIndex']
3266
- }], role: [{
3267
- type: HostBinding,
3268
- args: ['attr.role']
3269
- }], hostClass: [{
3270
- type: HostBinding,
3271
- args: ['class.k-window']
3272
- }], dir: [{
3273
- type: HostBinding,
3274
- args: ['attr.dir']
3275
- }], titleBarView: [{
3276
- type: ViewChild,
3277
- args: [WindowTitleBarComponent, { static: false }]
3278
- }], titleBarContent: [{
3279
- type: ContentChild,
3280
- args: [WindowTitleBarComponent, { static: false }]
3281
- }], resizeHandles: [{
3282
- type: ViewChildren,
3283
- args: [ResizeHandleDirective]
3284
- }], styleMinWidth: [{
3285
- type: HostBinding,
3286
- args: ['style.minWidth']
3287
- }], styleMinHeight: [{
3288
- type: HostBinding,
3289
- args: ['style.minHeight']
3290
- }], stylePosition: [{
3291
- type: HostBinding,
3292
- args: ['style.position']
3293
- }], wrapperMaximizedClass: [{
3294
- type: HostBinding,
3295
- args: ['class.k-window-maximized']
3296
- }], wrapperMinimizedClass: [{
3297
- type: HostBinding,
3298
- args: ['class.k-window-minimized']
3299
- }], onComponentFocus: [{
3300
- type: HostListener,
3301
- args: ['focus']
3302
- }], onComponentBlur: [{
3303
- type: HostListener,
3304
- args: ['blur']
3305
- }] } });
3306
-
3307
- /**
3308
- * Indicates that the **Close** button of a Window that is opened through `WindowService` is clicked.
3309
- */
3310
- class WindowCloseResult {
3311
- }
3312
-
3313
- /**
3314
- * Holds references to the object instance of the Window.
3315
- * Controls the Windows that were opened through `WindowService`
3316
- * ([see example]({% slug api_dialog_windowservice %}#toc-open)).
3317
- */
3318
- class WindowRef {
3319
- }
3320
-
3321
- /**
3322
- * The settings for the Window actions when the Window is opened through `WindowService`
3323
- * ([see example]({% slug api_dialog_windowservice %}#toc-open)).
3324
- */
3325
- class WindowSettings {
3326
- }
3327
-
3328
- /**
3329
- * @hidden
3330
- */
3331
- class WindowContainerService {
3332
- set container(container) {
3333
- WindowContainerService.container = container;
3334
- }
3335
- get container() {
3336
- return WindowContainerService.container;
3337
- }
3338
- }
3339
- WindowContainerService.container = null;
3340
- WindowContainerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowContainerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
3341
- WindowContainerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowContainerService, providedIn: 'root' });
3342
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowContainerService, decorators: [{
3343
- type: Injectable,
3344
- args: [{
3345
- providedIn: 'root'
3346
- }]
3347
- }] });
3348
-
3349
- const isNotComponent = (component) => isString(component) || component instanceof TemplateRef;
3350
- class WindowInjector {
3351
- constructor(getWindowRef, parentInjector) {
3352
- this.getWindowRef = getWindowRef;
3353
- this.parentInjector = parentInjector;
3354
- }
3355
- get(token, notFoundValue) {
3356
- if (token === WindowRef) {
3357
- return this.getWindowRef();
3358
- }
3359
- return this.parentInjector.get(token, notFoundValue);
3360
- }
3361
- }
3362
- /**
3363
- * A service for opening Windows dynamically
3364
- * ([see example]({% slug service_window %})).
3365
- */
3366
- class WindowService {
3367
- constructor(
3368
- /**
3369
- * @hidden
3370
- */
3371
- resolver, containerService) {
3372
- this.resolver = resolver;
3373
- this.containerService = containerService;
3374
- }
3375
- /**
3376
- * Opens a Window component.
3377
- *
3378
- * @param {WindowSettings} settings - The settings that define the Window.
3379
- * @returns {WindowRef} - A reference to the Window object.
3380
- *
3381
- * @example
3382
- *
3383
- * ```ts-no-run
3384
- * _@Component({
3385
- * selector: 'my-app',
3386
- * template: `
3387
- * <button kendoButton (click)="open()">Open window</button>
3388
- * <div kendoWindowContainer></div>
3389
- * `
3390
- * })
3391
- * export class AppComponent {
3392
- * constructor( private windowService: WindowService ) {}
3393
- *
3394
- * public open() {
3395
- * var window = this.windowService.open({
3396
- * title: "My window",
3397
- * content: "My content!"
3398
- * });
3399
- *
3400
- * window.result.subscribe((result) => {
3401
- * if (result instanceof WindowCloseResult) {
3402
- * console.log("Window was closed");
3403
- * }
3404
- * });
3405
- * }
3406
- * }
3407
- * ```
3408
- *
3409
- */
3410
- open(settings) {
3411
- const factory = this.resolver.resolveComponentFactory(WindowComponent);
3412
- const container = settings.appendTo || this.containerService.container;
3413
- if (!container) {
3414
- throw new Error(`Cannot attach window to the page.
3415
- Add an element that uses the kendoWindowContainer directive, or set the 'appendTo' property.
3416
- See https://www.telerik.com/kendo-angular-ui/components/dialogs/window/service/
3417
- `);
3418
- }
3419
- const windowRef = {
3420
- close: () => { },
3421
- content: null,
3422
- result: null,
3423
- window: null
3424
- };
3425
- const content = this.contentFrom(settings.content, container, windowRef);
3426
- const window = container.createComponent(factory, undefined, undefined, content.nodes);
3427
- windowRef.window = window;
3428
- this.applyOptions(window.instance, settings);
3429
- const apiClose = new Subject();
3430
- const close = (e) => {
3431
- apiClose.next(e || new WindowCloseResult());
3432
- if (content.componentRef) {
3433
- content.componentRef.destroy();
3434
- }
3435
- window.destroy();
3436
- };
3437
- const result = merge(apiClose, window.instance.close.pipe(map(e => (e ? e : new WindowCloseResult())), filter((e) => {
3438
- if (settings.preventClose) {
3439
- // add windowRef only when using component
3440
- const windowRefParameter = isNotComponent(settings.content) ? undefined : windowRef;
3441
- return !settings.preventClose(e, windowRefParameter);
3442
- }
3443
- return true;
3444
- }))).pipe(take(1),
3445
- // Takes care for multiple subscriptions:
3446
- // We subscribe internally and the user may subscribe to get a close result - window.result.subscribe().
3447
- // This causes multiple subscriptions to the same source and thus multiple emissions. share() solves that.
3448
- share());
3449
- result.subscribe(close);
3450
- windowRef.close = close;
3451
- windowRef.result = result;
3452
- window.changeDetectorRef.markForCheck();
3453
- return windowRef;
3454
- }
3455
- applyOptions(instance, options) {
3456
- if (isPresent(options.htmlAttributes)) {
3457
- instance.htmlAttributes = options.htmlAttributes;
3458
- }
3459
- if (isPresent(options.cssClass)) {
3460
- instance.cssClass = options.cssClass;
3461
- }
3462
- if (isPresent(options.title)) {
3463
- instance.title = options.title;
3464
- }
3465
- if (isPresent(options.keepContent)) {
3466
- instance.keepContent = options.keepContent;
3467
- }
3468
- if (isPresent(options.width)) {
3469
- instance.width = options.width;
3470
- }
3471
- if (isPresent(options.minWidth)) {
3472
- instance.minWidth = options.minWidth;
3473
- }
3474
- if (isPresent(options.height)) {
3475
- instance.height = options.height;
3476
- }
3477
- if (isPresent(options.minHeight)) {
3478
- instance.minHeight = options.minHeight;
3479
- }
3480
- if (isPresent(options.left)) {
3481
- instance.left = options.left;
3482
- }
3483
- if (isPresent(options.top)) {
3484
- instance.top = options.top;
3485
- }
3486
- if (isPresent(options.draggable)) {
3487
- instance.draggable = options.draggable;
3488
- }
3489
- if (isPresent(options.resizable)) {
3490
- instance.resizable = options.resizable;
3491
- }
3492
- if (isPresent(options.messages && options.messages.closeTitle)) {
3493
- instance.messages.closeTitle = options.messages.closeTitle;
3494
- }
3495
- if (isPresent(options.messages && options.messages.restoreTitle)) {
3496
- instance.messages.restoreTitle = options.messages.restoreTitle;
3497
- }
3498
- if (isPresent(options.messages && options.messages.maximizeTitle)) {
3499
- instance.messages.maximizeTitle = options.messages.maximizeTitle;
3500
- }
3501
- if (isPresent(options.messages && options.messages.minimizeTitle)) {
3502
- instance.messages.minimizeTitle = options.messages.minimizeTitle;
3503
- }
3504
- if (isPresent(options.autoFocusedElement)) {
3505
- instance.autoFocusedElement = options.autoFocusedElement;
3506
- }
3507
- if (isPresent(options.state)) {
3508
- instance.state = options.state;
3509
- if (options.state === 'minimized') {
3510
- instance.keepContent = true;
3511
- }
3512
- }
3513
- if (isPresent(options.themeColor)) {
3514
- instance.themeColor = options.themeColor;
3515
- }
3516
- if (options.content instanceof TemplateRef) {
3517
- instance.contentTemplate = options.content;
3518
- }
3519
- if (options.titleBarContent instanceof TemplateRef) {
3520
- instance.titleBarTemplate = options.titleBarContent;
3521
- }
3522
- }
3523
- contentFrom(content, container, windowRef) {
3524
- const renderer = container.injector.get(Renderer2);
3525
- let nodes = [];
3526
- let componentRef = null;
3527
- if (typeof content === 'string') {
3528
- nodes = [renderer.createText(content)];
3529
- }
3530
- else if (content && !(content instanceof TemplateRef)) {
3531
- const injector = new WindowInjector(() => windowRef, container.injector);
3532
- const factory = this.resolver.resolveComponentFactory(content);
3533
- componentRef = container.createComponent(factory, undefined, injector);
3534
- nodes = [componentRef.location.nativeElement];
3535
- windowRef.content = componentRef;
3536
- }
3537
- return {
3538
- componentRef,
3539
- nodes: [
3540
- [],
3541
- nodes // Content
3542
- ]
3543
- };
3544
- }
3545
- }
3546
- WindowService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowService, deps: [{ token: i0.ComponentFactoryResolver }, { token: WindowContainerService }], target: i0.ɵɵFactoryTarget.Injectable });
3547
- WindowService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowService, providedIn: 'root' });
3548
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowService, decorators: [{
3549
- type: Injectable,
3550
- args: [{
3551
- providedIn: 'root'
3552
- }]
3553
- }], ctorParameters: function () {
3554
- return [{ type: i0.ComponentFactoryResolver }, { type: WindowContainerService, decorators: [{
3555
- type: Inject,
3556
- args: [WindowContainerService]
3557
- }] }];
3558
- } });
3559
-
3560
- /**
3561
- * Provides an insertion point for the Dialogs which are created through the
3562
- * Dialog service ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
3563
- * Created Dialogs will be mounted after that element.
3564
- *
3565
- * @example
3566
- * ```html-no-run
3567
- * <div kendoDialogContainer></div>
3568
- * ```
3569
- */
3570
- class DialogContainerDirective {
3571
- constructor(container, service) {
3572
- service.container = container;
3573
- }
3574
- }
3575
- DialogContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerDirective, deps: [{ token: i0.ViewContainerRef }, { token: DialogContainerService }], target: i0.ɵɵFactoryTarget.Directive });
3576
- DialogContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DialogContainerDirective, isStandalone: true, selector: "[kendoDialogContainer]", ngImport: i0 });
3577
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerDirective, decorators: [{
3578
- type: Directive,
3579
- args: [{
3580
- selector: '[kendoDialogContainer]',
3581
- standalone: true
3582
- }]
3583
- }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: DialogContainerService }]; } });
3584
-
3585
- /**
3586
- * Custom component messages override default component messages
3587
- * ([see example](slug:globalization_dialogs#toc-internationalization)).
3588
- */
3589
- class CustomMessagesComponent extends Messages {
3590
- constructor(service) {
3591
- super();
3592
- this.service = service;
3593
- }
3594
- get override() {
3595
- return true;
3596
- }
3597
- }
3598
- CustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
3599
- CustomMessagesComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: CustomMessagesComponent, isStandalone: true, selector: "kendo-dialog-messages, kendo-window-messages", providers: [
3600
- {
3601
- provide: Messages,
3602
- useExisting: forwardRef(() => CustomMessagesComponent)
3603
- }
3604
- ], usesInheritance: true, ngImport: i0 });
3605
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomMessagesComponent, decorators: [{
3606
- type: Directive,
3607
- args: [{
3608
- providers: [
3609
- {
3610
- provide: Messages,
3611
- useExisting: forwardRef(() => CustomMessagesComponent)
3612
- }
3613
- ],
3614
- // eslint-disable-next-line @angular-eslint/directive-selector
3615
- selector: 'kendo-dialog-messages, kendo-window-messages',
3616
- standalone: true
3617
- }]
3618
- }], ctorParameters: function () { return [{ type: i1.LocalizationService }]; } });
3619
-
3620
- /**
3621
- * Provides an insertion point for the Windows which are created through the
3622
- * Window service ([see example]({% slug api_dialog_windowservice %}#toc-open)).
3623
- * Created Windows will be mounted after that element.
3624
- *
3625
- * @example
3626
- * ```html-no-run
3627
- * <div kendoWindowContainer></div>
3628
- * ```
3629
- */
3630
- class WindowContainerDirective {
3631
- constructor(container, service) {
3632
- service.container = container;
3633
- }
3634
- }
3635
- WindowContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowContainerDirective, deps: [{ token: i0.ViewContainerRef }, { token: WindowContainerService }], target: i0.ɵɵFactoryTarget.Directive });
3636
- WindowContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: WindowContainerDirective, isStandalone: true, selector: "[kendoWindowContainer]", ngImport: i0 });
3637
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowContainerDirective, decorators: [{
3638
- type: Directive,
3639
- args: [{
3640
- selector: '[kendoWindowContainer]',
3641
- standalone: true
3642
- }]
3643
- }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: WindowContainerService }]; } });
3644
-
3645
- /**
3646
- * Utility array that contains all `Dialog` related components and directives.
3647
- */
3648
- const KENDO_DIALOG = [
3649
- DialogComponent,
3650
- DialogTitleBarComponent,
3651
- DialogContainerDirective,
3652
- DialogActionsComponent,
3653
- CustomMessagesComponent
3654
- ];
3655
- /**
3656
- * Utility array that contains all `Window` related components and directives.
3657
- */
3658
- const KENDO_WINDOW = [
3659
- WindowComponent,
3660
- WindowCloseActionDirective,
3661
- WindowMinimizeActionDirective,
3662
- WindowMaximizeActionDirective,
3663
- WindowRestoreActionDirective,
3664
- WindowTitleBarComponent,
3665
- WindowContainerDirective,
3666
- DialogActionsComponent,
3667
- CustomMessagesComponent
3668
- ];
3669
- /**
3670
- * Utility array that contains all `@progress/kendo-angular-dialog` related components and directives.
3671
- */
3672
- const KENDO_DIALOGS = [
3673
- ...KENDO_DIALOG,
3674
- ...KENDO_WINDOW
3675
- ];
3676
-
3677
- /**
3678
- * @hidden
3679
- */
3680
- const DIALOG_DIRECTIVES = [
3681
- DialogComponent,
3682
- DialogTitleBarComponent
3683
- ];
3684
- //IMPORTANT: NgModule export kept for backwards compatibility
3685
- /**
3686
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
3687
- * definition for the Dialog component that includes all Dialog components and directives.
3688
- * Imports `DialogModule` into the [root module](link:site.data.urls.angular['ngmodules']#angular-modularity)
3689
- * of your application or into any other sub-module that will use the Dialog component.
3690
- *
3691
- * @example
3692
- * ```ts-no-run
3693
- * import { NgModule } from '@angular/core';
3694
- * import { BrowserModule } from '@angular/platform-browser';
3695
- * import { DialogModule } from '@progress/kendo-angular-dialog';
3696
- * import { AppComponent } from './app.component';
3697
- *
3698
- * _@NgModule({
3699
- * bootstrap: [AppComponent],
3700
- * declarations: [AppComponent],
3701
- * imports: [BrowserModule, DialogModule]
3702
- * })
3703
- * export class AppModule {
3704
- * }
3705
- * ```
3706
- */
3707
- class DialogModule {
3708
- }
3709
- DialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3710
- DialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: DialogModule, imports: [DialogComponent, DialogTitleBarComponent, DialogContainerDirective, DialogActionsComponent, CustomMessagesComponent], exports: [DialogComponent, DialogTitleBarComponent, DialogContainerDirective, DialogActionsComponent, CustomMessagesComponent] });
3711
- DialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogModule, providers: [DialogContainerService, DialogService, IconsService], imports: [DialogComponent, DialogTitleBarComponent, DialogActionsComponent] });
3712
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogModule, decorators: [{
3713
- type: NgModule,
3714
- args: [{
3715
- exports: [...KENDO_DIALOG],
3716
- imports: [...KENDO_DIALOG],
3717
- providers: [DialogContainerService, DialogService, IconsService]
3718
- }]
3719
- }] });
3720
-
3721
- const ENTRY_COMPONENTS = [
3722
- WindowComponent,
3723
- WindowTitleBarComponent
3724
- ];
3725
- //IMPORTANT: NgModule export kept for backwards compatibility
3726
- /**
3727
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
3728
- * definition for the Window component. Imports `WindowModule` into the
3729
- * [root module](link:site.data.urls.angular['ngmodules']#angular-modularity)
3730
- * of your application or into any other sub-module that will use the Window component.
3731
- *
3732
- * @example
3733
- * ```ts-no-run
3734
- * import { NgModule } from '@angular/core';
3735
- * import { BrowserModule } from '@angular/platform-browser';
3736
- * import { WindowModule } from '@progress/kendo-angular-window';
3737
- * import { AppComponent } from './app.component';
3738
- *
3739
- * _@NgModule({
3740
- * bootstrap: [AppComponent],
3741
- * declarations: [AppComponent],
3742
- * imports: [BrowserModule, WindowModule]
3743
- * })
3744
- * export class AppModule {
3745
- * }
3746
- * ```
3747
- */
3748
- class WindowModule {
3749
- }
3750
- WindowModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3751
- WindowModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: WindowModule, imports: [WindowComponent, WindowCloseActionDirective, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowTitleBarComponent, WindowContainerDirective, DialogActionsComponent, CustomMessagesComponent], exports: [WindowComponent, WindowCloseActionDirective, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowTitleBarComponent, WindowContainerDirective, DialogActionsComponent, CustomMessagesComponent] });
3752
- WindowModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowModule, providers: [WindowContainerService, WindowService, IconsService], imports: [WindowComponent, WindowCloseActionDirective, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowTitleBarComponent, DialogActionsComponent] });
3753
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: WindowModule, decorators: [{
3754
- type: NgModule,
3755
- args: [{
3756
- imports: [...KENDO_WINDOW],
3757
- exports: [...KENDO_WINDOW],
3758
- providers: [WindowContainerService, WindowService, IconsService]
3759
- }]
3760
- }] });
3761
-
3762
- //IMPORTANT: NgModule export kept for backwards compatibility
3763
- /**
3764
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
3765
- * definition for the Dialogs components.
3766
- *
3767
- * @example
3768
- *
3769
- * ```ts
3770
- * import { DialogsModule } from '@progress/kendo-angular-dialog';
3771
- *
3772
- * import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3773
- * import { NgModule } from '@angular/core';
3774
- *
3775
- * import { AppComponent } from './app.component';
3776
- *
3777
- * _@NgModule({
3778
- * declarations: [AppComponent],
3779
- * imports: [BrowserModule, DialogsModule],
3780
- * bootstrap: [AppComponent]
3781
- * })
3782
- * export class AppModule {}
3783
- *
3784
- * platformBrowserDynamic().bootstrapModule(AppModule);
3785
- *
3786
- * ```
3787
- */
3788
- class DialogsModule {
3789
- }
3790
- DialogsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3791
- DialogsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: DialogsModule, imports: [DialogComponent, DialogTitleBarComponent, DialogContainerDirective, DialogActionsComponent, CustomMessagesComponent, WindowComponent, WindowCloseActionDirective, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowTitleBarComponent, WindowContainerDirective, DialogActionsComponent, CustomMessagesComponent], exports: [DialogComponent, DialogTitleBarComponent, DialogContainerDirective, DialogActionsComponent, CustomMessagesComponent, WindowComponent, WindowCloseActionDirective, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowTitleBarComponent, WindowContainerDirective, DialogActionsComponent, CustomMessagesComponent] });
3792
- DialogsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogsModule, providers: [IconsService, DialogService, DialogContainerService, WindowService, WindowContainerService], imports: [DialogComponent, DialogTitleBarComponent, DialogActionsComponent, WindowComponent, WindowCloseActionDirective, WindowMinimizeActionDirective, WindowMaximizeActionDirective, WindowRestoreActionDirective, WindowTitleBarComponent, DialogActionsComponent] });
3793
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogsModule, decorators: [{
3794
- type: NgModule,
3795
- args: [{
3796
- imports: [...KENDO_DIALOGS],
3797
- exports: [...KENDO_DIALOGS],
3798
- providers: [IconsService, DialogService, DialogContainerService, WindowService, WindowContainerService]
3799
- }]
3800
- }] });
3801
-
3802
- /**
3803
- * Generated bundle index. Do not edit.
3804
- */
3805
-
3806
- export { CustomMessagesComponent, DialogAction, DialogActionsComponent, DialogCloseResult, DialogComponent, DialogContainerDirective, DialogContainerService, DialogContentBase, DialogModule, DialogRef, DialogService, DialogSettings, DialogTitleBarComponent, DialogsModule, DragResizeService, KENDO_DIALOG, KENDO_DIALOGS, KENDO_WINDOW, LocalizedMessagesDirective, Messages, NavigationService, PreventableEvent, WindowCloseActionDirective, WindowCloseResult, WindowComponent, WindowContainerDirective, WindowContainerService, WindowMaximizeActionDirective, WindowMinimizeActionDirective, WindowModule, WindowRef, WindowRestoreActionDirective, WindowService, WindowSettings, WindowTitleBarComponent };
3807
-