@progress/kendo-angular-dialog 5.2.2 → 6.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.
- package/LICENSE.md +1 -1
- package/NOTICE.txt +119 -79
- package/README.md +11 -9
- package/dist/cdn/js/kendo-angular-dialog.js +2 -2
- package/dist/cdn/main.js +1 -1
- package/dist/es/common/util.js +13 -0
- package/dist/es/dialog/dialog-actions.component.js +8 -3
- package/dist/es/dialog/dialog-titlebar.component.js +1 -1
- package/dist/es/dialog/dialog.component.js +9 -2
- package/dist/es/dialog/dialog.service.js +1 -1
- package/dist/es/package-metadata.js +1 -1
- package/dist/es/window/actions/window-close-action.directive.js +1 -1
- package/dist/es/window/actions/window-maximize-action.directive.js +1 -1
- package/dist/es/window/actions/window-minimize-action.directive.js +1 -1
- package/dist/es/window/actions/window-restore-action.directive.js +1 -1
- package/dist/es/window/window.component.js +6 -2
- package/dist/es2015/common/util.d.ts +4 -0
- package/dist/es2015/common/util.js +13 -0
- package/dist/es2015/dialog/dialog-actions.component.js +8 -3
- package/dist/es2015/dialog/dialog-settings.d.ts +12 -2
- package/dist/es2015/dialog/dialog-titlebar.component.js +4 -5
- package/dist/es2015/dialog/dialog.component.d.ts +4 -0
- package/dist/es2015/dialog/dialog.component.js +9 -2
- package/dist/es2015/dialog/dialog.service.d.ts +1 -1
- package/dist/es2015/dialog/dialog.service.js +1 -1
- package/dist/es2015/index.metadata.json +1 -1
- package/dist/es2015/package-metadata.js +1 -1
- package/dist/es2015/window/actions/window-close-action.directive.js +1 -1
- package/dist/es2015/window/actions/window-maximize-action.directive.js +1 -1
- package/dist/es2015/window/actions/window-minimize-action.directive.js +1 -1
- package/dist/es2015/window/actions/window-restore-action.directive.js +1 -1
- package/dist/es2015/window/window.component.js +6 -2
- package/dist/fesm2015/index.js +223 -196
- package/dist/fesm5/index.js +222 -194
- package/dist/npm/common/util.js +13 -0
- package/dist/npm/dialog/dialog-actions.component.js +8 -3
- package/dist/npm/dialog/dialog-titlebar.component.js +1 -1
- package/dist/npm/dialog/dialog.component.js +8 -1
- package/dist/npm/dialog/dialog.service.js +1 -1
- package/dist/npm/package-metadata.js +1 -1
- package/dist/npm/window/actions/window-close-action.directive.js +1 -1
- package/dist/npm/window/actions/window-maximize-action.directive.js +1 -1
- package/dist/npm/window/actions/window-minimize-action.directive.js +1 -1
- package/dist/npm/window/actions/window-restore-action.directive.js +1 -1
- package/dist/npm/window/window.component.js +6 -2
- package/dist/systemjs/kendo-angular-dialog.js +1 -1
- package/package.json +15 -10
package/dist/fesm5/index.js
CHANGED
|
@@ -5,15 +5,207 @@
|
|
|
5
5
|
import { __decorate, __metadata, __extends, __param } from 'tslib';
|
|
6
6
|
import { TemplateRef, Input, Output, EventEmitter, HostBinding, Component, ElementRef, InjectionToken, Inject, Optional, NgZone, ContentChildren, QueryList, ViewChildren, ViewChild, Renderer2, ChangeDetectorRef, Injectable, isDevMode, ComponentFactoryResolver, Directive, Host, HostListener, ContentChild, ViewContainerRef, forwardRef, NgModule } from '@angular/core';
|
|
7
7
|
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
8
|
-
import {
|
|
8
|
+
import { Subscription, Subject, merge, of } from 'rxjs';
|
|
9
9
|
import { take, filter, map, share, tap, switchMap, takeUntil } from 'rxjs/operators';
|
|
10
|
+
import { L10N_PREFIX, RTL, MessageService, LocalizationService, ComponentMessages } from '@progress/kendo-angular-l10n';
|
|
10
11
|
import { validatePackage } from '@progress/kendo-licensing';
|
|
11
|
-
import { Subscription, Subject, merge, of } from 'rxjs';
|
|
12
12
|
import { DraggableDirective, isChanged, isDocumentAvailable, DraggableModule } from '@progress/kendo-angular-common';
|
|
13
13
|
import { offset, scrollPosition, positionWithScroll, getDocumentElement, getWindowViewPort } from '@progress/kendo-popup-common';
|
|
14
14
|
import { Button } from '@progress/kendo-angular-buttons';
|
|
15
15
|
import { CommonModule } from '@angular/common';
|
|
16
16
|
|
|
17
|
+
/**
|
|
18
|
+
* @hidden
|
|
19
|
+
*/
|
|
20
|
+
var isPresent = function (value) { return value !== null && value !== undefined; };
|
|
21
|
+
/**
|
|
22
|
+
* @hidden
|
|
23
|
+
*/
|
|
24
|
+
var isTruthy = function (value) { return !!value; };
|
|
25
|
+
var toClassList = function (classNames) { return String(classNames).trim().split(' '); };
|
|
26
|
+
var focusableRegex = /^(?:a|input|select|textarea|button|object)$/i;
|
|
27
|
+
/**
|
|
28
|
+
* @hidden
|
|
29
|
+
*/
|
|
30
|
+
var Keys;
|
|
31
|
+
(function (Keys) {
|
|
32
|
+
Keys[Keys["esc"] = 27] = "esc";
|
|
33
|
+
Keys[Keys["tab"] = 9] = "tab";
|
|
34
|
+
Keys[Keys["enter"] = 13] = "enter";
|
|
35
|
+
Keys[Keys["space"] = 32] = "space";
|
|
36
|
+
Keys[Keys["ctrl"] = 17] = "ctrl";
|
|
37
|
+
Keys[Keys["shift"] = 16] = "shift";
|
|
38
|
+
Keys[Keys["left"] = 37] = "left";
|
|
39
|
+
Keys[Keys["up"] = 38] = "up";
|
|
40
|
+
Keys[Keys["right"] = 39] = "right";
|
|
41
|
+
Keys[Keys["down"] = 40] = "down";
|
|
42
|
+
})(Keys || (Keys = {}));
|
|
43
|
+
/**
|
|
44
|
+
* @hidden
|
|
45
|
+
*/
|
|
46
|
+
var DIALOG_ELEMENTS_HANDLING_ESC_KEY = 'k-dialog-wrapper k-dialog-buttongroup k-dialog-action';
|
|
47
|
+
/**
|
|
48
|
+
* @hidden
|
|
49
|
+
*/
|
|
50
|
+
var DIALOG_ELEMENTS_HANDLING_ARROWS = 'k-dialog-buttongroup';
|
|
51
|
+
/**
|
|
52
|
+
* @hidden
|
|
53
|
+
*/
|
|
54
|
+
var WINDOW_CLASSES = 'k-window';
|
|
55
|
+
/**
|
|
56
|
+
* @hidden
|
|
57
|
+
*/
|
|
58
|
+
var hasClasses = function (element, classNames) {
|
|
59
|
+
var namesList = toClassList(classNames);
|
|
60
|
+
return Boolean(toClassList(element.className).find(function (className) { return namesList.indexOf(className) >= 0; }));
|
|
61
|
+
};
|
|
62
|
+
/**
|
|
63
|
+
* @hidden
|
|
64
|
+
*/
|
|
65
|
+
var isVisible = function (element) {
|
|
66
|
+
var rect = element.getBoundingClientRect();
|
|
67
|
+
return !!(rect.width && rect.height) && window.getComputedStyle(element).visibility !== 'hidden';
|
|
68
|
+
};
|
|
69
|
+
/**
|
|
70
|
+
* @hidden
|
|
71
|
+
*/
|
|
72
|
+
var isFocusable = function (element, checkVisibility) {
|
|
73
|
+
if (checkVisibility === void 0) { checkVisibility = true; }
|
|
74
|
+
if (element.tagName) {
|
|
75
|
+
var tagName = element.tagName.toLowerCase();
|
|
76
|
+
var tabIndex = element.getAttribute('tabIndex');
|
|
77
|
+
var validTabIndex = tabIndex !== null && !isNaN(tabIndex) && tabIndex > -1;
|
|
78
|
+
var focusable = false;
|
|
79
|
+
if (focusableRegex.test(tagName)) {
|
|
80
|
+
focusable = !element.disabled;
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
focusable = validTabIndex;
|
|
84
|
+
}
|
|
85
|
+
return focusable && (!checkVisibility || isVisible(element));
|
|
86
|
+
}
|
|
87
|
+
return false;
|
|
88
|
+
};
|
|
89
|
+
/**
|
|
90
|
+
* @hidden
|
|
91
|
+
*/
|
|
92
|
+
var setHTMLAttributes = function (attributes, renderer, element) {
|
|
93
|
+
for (var attribute in attributes) {
|
|
94
|
+
if (attribute) {
|
|
95
|
+
renderer.setAttribute(element, attribute, attributes[attribute]);
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
};
|
|
99
|
+
/**
|
|
100
|
+
* Receives CSS class declarations either as an object, string or array and returns an array of the class names.
|
|
101
|
+
*
|
|
102
|
+
* @hidden
|
|
103
|
+
*/
|
|
104
|
+
var parseCSSClassNames = function (value) {
|
|
105
|
+
if (isObject(value)) {
|
|
106
|
+
return parseObjectClassNames(value);
|
|
107
|
+
}
|
|
108
|
+
if (isString(value)) {
|
|
109
|
+
return parseStringClassNames(value);
|
|
110
|
+
}
|
|
111
|
+
if (Array.isArray(value)) {
|
|
112
|
+
return parseArrayClassNames(value);
|
|
113
|
+
}
|
|
114
|
+
};
|
|
115
|
+
var parseObjectClassNames = function (value) {
|
|
116
|
+
var classes = [];
|
|
117
|
+
Object.keys(value).forEach(function (className) {
|
|
118
|
+
var currentClassName = splitStringToArray(className);
|
|
119
|
+
if (value[className] && currentClassName[0]) {
|
|
120
|
+
classes.push.apply(classes, currentClassName);
|
|
121
|
+
}
|
|
122
|
+
});
|
|
123
|
+
return classes;
|
|
124
|
+
};
|
|
125
|
+
var parseStringClassNames = function (value) {
|
|
126
|
+
var classes = [];
|
|
127
|
+
var classesArray = splitStringToArray(value);
|
|
128
|
+
classesArray.forEach(function (className) {
|
|
129
|
+
classes.push(className);
|
|
130
|
+
});
|
|
131
|
+
return classes;
|
|
132
|
+
};
|
|
133
|
+
var parseArrayClassNames = function (value) {
|
|
134
|
+
var classes = [];
|
|
135
|
+
value.forEach(function (className) {
|
|
136
|
+
var current = splitStringToArray(className);
|
|
137
|
+
if (current[0]) {
|
|
138
|
+
classes.push.apply(classes, current);
|
|
139
|
+
}
|
|
140
|
+
});
|
|
141
|
+
return classes;
|
|
142
|
+
};
|
|
143
|
+
/**
|
|
144
|
+
* @hidden
|
|
145
|
+
*/
|
|
146
|
+
var focusableSelector = [
|
|
147
|
+
'a[href]',
|
|
148
|
+
'area[href]',
|
|
149
|
+
'input:not([disabled])',
|
|
150
|
+
'select:not([disabled])',
|
|
151
|
+
'textarea:not([disabled])',
|
|
152
|
+
'button:not([disabled])',
|
|
153
|
+
'iframe',
|
|
154
|
+
'object',
|
|
155
|
+
'embed',
|
|
156
|
+
'*[tabindex]',
|
|
157
|
+
'*[contenteditable]'
|
|
158
|
+
].join(',');
|
|
159
|
+
/**
|
|
160
|
+
* @hidden
|
|
161
|
+
*/
|
|
162
|
+
var preventDefault = function (_a) {
|
|
163
|
+
var event = _a.originalEvent;
|
|
164
|
+
event.stopPropagation();
|
|
165
|
+
event.preventDefault();
|
|
166
|
+
};
|
|
167
|
+
/**
|
|
168
|
+
* @hidden
|
|
169
|
+
*/
|
|
170
|
+
var RESIZE_DIRECTIONS = ['n', 'e', 's', 'w', 'se', 'sw', 'ne', 'nw'];
|
|
171
|
+
/**
|
|
172
|
+
* @hidden
|
|
173
|
+
*/
|
|
174
|
+
var OFFSET_STYLES = ['top', 'left', 'width', 'height'];
|
|
175
|
+
/**
|
|
176
|
+
* @hidden
|
|
177
|
+
*/
|
|
178
|
+
var isString = function (value) { return value instanceof String || typeof value === 'string'; };
|
|
179
|
+
/**
|
|
180
|
+
* @hidden
|
|
181
|
+
*/
|
|
182
|
+
var isObject = function (value) { return isPresent(value) && !Array.isArray(value) && typeof value === 'object'; };
|
|
183
|
+
/**
|
|
184
|
+
* @hidden
|
|
185
|
+
*/
|
|
186
|
+
var isNumber = function (value) { return typeof value === 'number' && isFinite(value); };
|
|
187
|
+
/**
|
|
188
|
+
* @hidden
|
|
189
|
+
*/
|
|
190
|
+
var createValueWithUnit = function (value) { return value + (isNumber(value) ? 'px' : ''); };
|
|
191
|
+
/**
|
|
192
|
+
* @hidden
|
|
193
|
+
*/
|
|
194
|
+
var splitStringToArray = function (value) { return value.trim().replace(/\s+/g, " ").split(' '); };
|
|
195
|
+
/**
|
|
196
|
+
* @hidden
|
|
197
|
+
*/
|
|
198
|
+
var findPrimaryButton = function (buttons) {
|
|
199
|
+
for (var i = buttons.length - 1; i >= 0; i--) {
|
|
200
|
+
var classList = buttons[i].classList;
|
|
201
|
+
for (var j = 0; j < classList.length; j++) {
|
|
202
|
+
if (classList[j].endsWith('-primary')) {
|
|
203
|
+
return buttons[i];
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
}
|
|
207
|
+
};
|
|
208
|
+
|
|
17
209
|
/**
|
|
18
210
|
* Specifies the action buttons of the Dialog
|
|
19
211
|
* ([see example]({% slug actionbuttons_dialog %})).
|
|
@@ -54,9 +246,13 @@ var DialogActionsComponent = /** @class */ (function () {
|
|
|
54
246
|
* @hidden
|
|
55
247
|
*/
|
|
56
248
|
DialogActionsComponent.prototype.buttonClass = function (action) {
|
|
57
|
-
var classes = ['k-button'];
|
|
58
|
-
|
|
59
|
-
|
|
249
|
+
var classes = ['k-button k-button-md k-rounded-md'];
|
|
250
|
+
var fillMode = action.fillMode ? action.fillMode : 'solid';
|
|
251
|
+
var themeColor = action.themeColor ? action.themeColor : 'base';
|
|
252
|
+
var cssClasses = action.cssClass ? parseCSSClassNames(action.cssClass) : [];
|
|
253
|
+
classes.push("k-button-" + fillMode + " k-button-" + fillMode + "-" + themeColor);
|
|
254
|
+
if (cssClasses.length > 0) {
|
|
255
|
+
classes = classes.concat(cssClasses);
|
|
60
256
|
}
|
|
61
257
|
return classes.join(' ');
|
|
62
258
|
};
|
|
@@ -224,7 +420,7 @@ var DialogTitleBarComponent = /** @class */ (function () {
|
|
|
224
420
|
useValue: 'kendo.dialog'
|
|
225
421
|
}
|
|
226
422
|
],
|
|
227
|
-
template: "\n <ng-container\n kendoDialogTitleBarLocalizedMessages\n i18n-closeTitle=\"kendo.dialog.closeTitle|The title of the close button\"\n closeTitle=\"Close\"\n >\n <div class=\"k-window-title k-dialog-title\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"k-window-actions k-dialog-actions\">\n <
|
|
423
|
+
template: "\n <ng-container\n kendoDialogTitleBarLocalizedMessages\n i18n-closeTitle=\"kendo.dialog.closeTitle|The title of the close button\"\n closeTitle=\"Close\"\n >\n <div class=\"k-window-title k-dialog-title\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"k-window-actions k-dialog-actions\">\n <button\n role=\"button\"\n [attr.title]=\"closeButtonTitle\"\n [attr.aria-label]=\"closeButtonTitle\"\n class=\"k-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-icon-button k-window-action k-dialog-action k-dialog-close\"\n (click)=\"onCloseClick($event)\"\n >\n <span class=\"k-button-icon k-icon k-i-x\"></span>\n </button>\n </div>\n </ng-container>\n "
|
|
228
424
|
}),
|
|
229
425
|
__param(2, Optional()),
|
|
230
426
|
__metadata("design:paramtypes", [NgZone, ElementRef, LocalizationService])
|
|
@@ -239,190 +435,11 @@ var packageMetadata = {
|
|
|
239
435
|
name: '@progress/kendo-angular-dialog',
|
|
240
436
|
productName: 'Kendo UI for Angular',
|
|
241
437
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
242
|
-
publishDate:
|
|
438
|
+
publishDate: 1642584244,
|
|
243
439
|
version: '',
|
|
244
440
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
|
|
245
441
|
};
|
|
246
442
|
|
|
247
|
-
/**
|
|
248
|
-
* @hidden
|
|
249
|
-
*/
|
|
250
|
-
var isPresent = function (value) { return value !== null && value !== undefined; };
|
|
251
|
-
/**
|
|
252
|
-
* @hidden
|
|
253
|
-
*/
|
|
254
|
-
var isTruthy = function (value) { return !!value; };
|
|
255
|
-
var toClassList = function (classNames) { return String(classNames).trim().split(' '); };
|
|
256
|
-
var focusableRegex = /^(?:a|input|select|textarea|button|object)$/i;
|
|
257
|
-
/**
|
|
258
|
-
* @hidden
|
|
259
|
-
*/
|
|
260
|
-
var Keys;
|
|
261
|
-
(function (Keys) {
|
|
262
|
-
Keys[Keys["esc"] = 27] = "esc";
|
|
263
|
-
Keys[Keys["tab"] = 9] = "tab";
|
|
264
|
-
Keys[Keys["enter"] = 13] = "enter";
|
|
265
|
-
Keys[Keys["space"] = 32] = "space";
|
|
266
|
-
Keys[Keys["ctrl"] = 17] = "ctrl";
|
|
267
|
-
Keys[Keys["shift"] = 16] = "shift";
|
|
268
|
-
Keys[Keys["left"] = 37] = "left";
|
|
269
|
-
Keys[Keys["up"] = 38] = "up";
|
|
270
|
-
Keys[Keys["right"] = 39] = "right";
|
|
271
|
-
Keys[Keys["down"] = 40] = "down";
|
|
272
|
-
})(Keys || (Keys = {}));
|
|
273
|
-
/**
|
|
274
|
-
* @hidden
|
|
275
|
-
*/
|
|
276
|
-
var DIALOG_ELEMENTS_HANDLING_ESC_KEY = 'k-dialog-wrapper k-dialog-buttongroup k-dialog-action';
|
|
277
|
-
/**
|
|
278
|
-
* @hidden
|
|
279
|
-
*/
|
|
280
|
-
var DIALOG_ELEMENTS_HANDLING_ARROWS = 'k-dialog-buttongroup';
|
|
281
|
-
/**
|
|
282
|
-
* @hidden
|
|
283
|
-
*/
|
|
284
|
-
var WINDOW_CLASSES = 'k-window';
|
|
285
|
-
/**
|
|
286
|
-
* @hidden
|
|
287
|
-
*/
|
|
288
|
-
var hasClasses = function (element, classNames) {
|
|
289
|
-
var namesList = toClassList(classNames);
|
|
290
|
-
return Boolean(toClassList(element.className).find(function (className) { return namesList.indexOf(className) >= 0; }));
|
|
291
|
-
};
|
|
292
|
-
/**
|
|
293
|
-
* @hidden
|
|
294
|
-
*/
|
|
295
|
-
var isVisible = function (element) {
|
|
296
|
-
var rect = element.getBoundingClientRect();
|
|
297
|
-
return !!(rect.width && rect.height) && window.getComputedStyle(element).visibility !== 'hidden';
|
|
298
|
-
};
|
|
299
|
-
/**
|
|
300
|
-
* @hidden
|
|
301
|
-
*/
|
|
302
|
-
var isFocusable = function (element, checkVisibility) {
|
|
303
|
-
if (checkVisibility === void 0) { checkVisibility = true; }
|
|
304
|
-
if (element.tagName) {
|
|
305
|
-
var tagName = element.tagName.toLowerCase();
|
|
306
|
-
var tabIndex = element.getAttribute('tabIndex');
|
|
307
|
-
var validTabIndex = tabIndex !== null && !isNaN(tabIndex) && tabIndex > -1;
|
|
308
|
-
var focusable = false;
|
|
309
|
-
if (focusableRegex.test(tagName)) {
|
|
310
|
-
focusable = !element.disabled;
|
|
311
|
-
}
|
|
312
|
-
else {
|
|
313
|
-
focusable = validTabIndex;
|
|
314
|
-
}
|
|
315
|
-
return focusable && (!checkVisibility || isVisible(element));
|
|
316
|
-
}
|
|
317
|
-
return false;
|
|
318
|
-
};
|
|
319
|
-
/**
|
|
320
|
-
* @hidden
|
|
321
|
-
*/
|
|
322
|
-
var setHTMLAttributes = function (attributes, renderer, element) {
|
|
323
|
-
for (var attribute in attributes) {
|
|
324
|
-
if (attribute) {
|
|
325
|
-
renderer.setAttribute(element, attribute, attributes[attribute]);
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
|
-
};
|
|
329
|
-
/**
|
|
330
|
-
* Receives CSS class declarations either as an object, string or array and returns an array of the class names.
|
|
331
|
-
*
|
|
332
|
-
* @hidden
|
|
333
|
-
*/
|
|
334
|
-
var parseCSSClassNames = function (value) {
|
|
335
|
-
if (isObject(value)) {
|
|
336
|
-
return parseObjectClassNames(value);
|
|
337
|
-
}
|
|
338
|
-
if (isString(value)) {
|
|
339
|
-
return parseStringClassNames(value);
|
|
340
|
-
}
|
|
341
|
-
if (Array.isArray(value)) {
|
|
342
|
-
return parseArrayClassNames(value);
|
|
343
|
-
}
|
|
344
|
-
};
|
|
345
|
-
var parseObjectClassNames = function (value) {
|
|
346
|
-
var classes = [];
|
|
347
|
-
Object.keys(value).forEach(function (className) {
|
|
348
|
-
var currentClassName = splitStringToArray(className);
|
|
349
|
-
if (value[className] && currentClassName[0]) {
|
|
350
|
-
classes.push.apply(classes, currentClassName);
|
|
351
|
-
}
|
|
352
|
-
});
|
|
353
|
-
return classes;
|
|
354
|
-
};
|
|
355
|
-
var parseStringClassNames = function (value) {
|
|
356
|
-
var classes = [];
|
|
357
|
-
var classesArray = splitStringToArray(value);
|
|
358
|
-
classesArray.forEach(function (className) {
|
|
359
|
-
classes.push(className);
|
|
360
|
-
});
|
|
361
|
-
return classes;
|
|
362
|
-
};
|
|
363
|
-
var parseArrayClassNames = function (value) {
|
|
364
|
-
var classes = [];
|
|
365
|
-
value.forEach(function (className) {
|
|
366
|
-
var current = splitStringToArray(className);
|
|
367
|
-
if (current[0]) {
|
|
368
|
-
classes.push.apply(classes, current);
|
|
369
|
-
}
|
|
370
|
-
});
|
|
371
|
-
return classes;
|
|
372
|
-
};
|
|
373
|
-
/**
|
|
374
|
-
* @hidden
|
|
375
|
-
*/
|
|
376
|
-
var focusableSelector = [
|
|
377
|
-
'a[href]',
|
|
378
|
-
'area[href]',
|
|
379
|
-
'input:not([disabled])',
|
|
380
|
-
'select:not([disabled])',
|
|
381
|
-
'textarea:not([disabled])',
|
|
382
|
-
'button:not([disabled])',
|
|
383
|
-
'iframe',
|
|
384
|
-
'object',
|
|
385
|
-
'embed',
|
|
386
|
-
'*[tabindex]',
|
|
387
|
-
'*[contenteditable]'
|
|
388
|
-
].join(',');
|
|
389
|
-
/**
|
|
390
|
-
* @hidden
|
|
391
|
-
*/
|
|
392
|
-
var preventDefault = function (_a) {
|
|
393
|
-
var event = _a.originalEvent;
|
|
394
|
-
event.stopPropagation();
|
|
395
|
-
event.preventDefault();
|
|
396
|
-
};
|
|
397
|
-
/**
|
|
398
|
-
* @hidden
|
|
399
|
-
*/
|
|
400
|
-
var RESIZE_DIRECTIONS = ['n', 'e', 's', 'w', 'se', 'sw', 'ne', 'nw'];
|
|
401
|
-
/**
|
|
402
|
-
* @hidden
|
|
403
|
-
*/
|
|
404
|
-
var OFFSET_STYLES = ['top', 'left', 'width', 'height'];
|
|
405
|
-
/**
|
|
406
|
-
* @hidden
|
|
407
|
-
*/
|
|
408
|
-
var isString = function (value) { return value instanceof String || typeof value === 'string'; };
|
|
409
|
-
/**
|
|
410
|
-
* @hidden
|
|
411
|
-
*/
|
|
412
|
-
var isObject = function (value) { return isPresent(value) && !Array.isArray(value) && typeof value === 'object'; };
|
|
413
|
-
/**
|
|
414
|
-
* @hidden
|
|
415
|
-
*/
|
|
416
|
-
var isNumber = function (value) { return typeof value === 'number' && isFinite(value); };
|
|
417
|
-
/**
|
|
418
|
-
* @hidden
|
|
419
|
-
*/
|
|
420
|
-
var createValueWithUnit = function (value) { return value + (isNumber(value) ? 'px' : ''); };
|
|
421
|
-
/**
|
|
422
|
-
* @hidden
|
|
423
|
-
*/
|
|
424
|
-
var splitStringToArray = function (value) { return value.trim().replace(/\s+/g, " ").split(' '); };
|
|
425
|
-
|
|
426
443
|
/**
|
|
427
444
|
* The settings for the Dialog actions when the Dialog is opened through `DialogService`
|
|
428
445
|
* ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
|
|
@@ -666,7 +683,7 @@ var DialogComponent = /** @class */ (function () {
|
|
|
666
683
|
*/
|
|
667
684
|
DialogComponent.prototype.handleInitialFocus = function () {
|
|
668
685
|
var wrapper = this.wrapper.nativeElement;
|
|
669
|
-
var primaryButton =
|
|
686
|
+
var primaryButton = this.findPrimary(wrapper);
|
|
670
687
|
if (this.autoFocusedElement) {
|
|
671
688
|
var initiallyFocusedElement = wrapper.querySelector(this.autoFocusedElement);
|
|
672
689
|
if (initiallyFocusedElement) {
|
|
@@ -680,6 +697,13 @@ var DialogComponent = /** @class */ (function () {
|
|
|
680
697
|
wrapper.focus();
|
|
681
698
|
}
|
|
682
699
|
};
|
|
700
|
+
/**
|
|
701
|
+
* @hidden
|
|
702
|
+
*/
|
|
703
|
+
DialogComponent.prototype.findPrimary = function (wrapper) {
|
|
704
|
+
var actionBtns = wrapper.querySelectorAll('.k-actions .k-button');
|
|
705
|
+
return findPrimaryButton(actionBtns);
|
|
706
|
+
};
|
|
683
707
|
/**
|
|
684
708
|
* @hidden
|
|
685
709
|
*/
|
|
@@ -1015,7 +1039,7 @@ var DialogService = /** @class */ (function () {
|
|
|
1015
1039
|
* content: "Are you sure?",
|
|
1016
1040
|
* actions: [
|
|
1017
1041
|
* { text: "No" },
|
|
1018
|
-
* { text: "Yes",
|
|
1042
|
+
* { text: "Yes", themeColor: 'primary' }
|
|
1019
1043
|
* ]
|
|
1020
1044
|
* });
|
|
1021
1045
|
*
|
|
@@ -1909,6 +1933,10 @@ var WindowComponent = /** @class */ (function () {
|
|
|
1909
1933
|
* two-way binding of the `state` property.
|
|
1910
1934
|
*/
|
|
1911
1935
|
this.stateChange = new EventEmitter();
|
|
1936
|
+
/**
|
|
1937
|
+
* @hidden
|
|
1938
|
+
*/
|
|
1939
|
+
this.messages = {};
|
|
1912
1940
|
this.tabIndex = 0;
|
|
1913
1941
|
this.draged = false;
|
|
1914
1942
|
this.resized = false;
|
|
@@ -2283,14 +2311,14 @@ var WindowComponent = /** @class */ (function () {
|
|
|
2283
2311
|
* @hidden
|
|
2284
2312
|
*/
|
|
2285
2313
|
WindowComponent.prototype.onComponentFocus = function () {
|
|
2286
|
-
this.renderer.addClass(this.el.nativeElement, 'k-
|
|
2314
|
+
this.renderer.addClass(this.el.nativeElement, 'k-focus');
|
|
2287
2315
|
this.setNextZIndex();
|
|
2288
2316
|
};
|
|
2289
2317
|
/**
|
|
2290
2318
|
* @hidden
|
|
2291
2319
|
*/
|
|
2292
2320
|
WindowComponent.prototype.onComponentBlur = function () {
|
|
2293
|
-
this.renderer.removeClass(this.el.nativeElement, 'k-
|
|
2321
|
+
this.renderer.removeClass(this.el.nativeElement, 'k-focus');
|
|
2294
2322
|
};
|
|
2295
2323
|
WindowComponent.prototype.subscribeEvents = function () {
|
|
2296
2324
|
var _this = this;
|
|
@@ -2640,7 +2668,7 @@ var WindowMaximizeActionDirective = /** @class */ (function (_super) {
|
|
|
2640
2668
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
2641
2669
|
_this.buttonType = 'button';
|
|
2642
2670
|
_this.window = _service;
|
|
2643
|
-
_this.
|
|
2671
|
+
_this.fillMode = 'flat';
|
|
2644
2672
|
_this.icon = 'window-maximize';
|
|
2645
2673
|
return _this;
|
|
2646
2674
|
}
|
|
@@ -2706,7 +2734,7 @@ var WindowMinimizeActionDirective = /** @class */ (function (_super) {
|
|
|
2706
2734
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
2707
2735
|
_this.buttonType = 'button';
|
|
2708
2736
|
_this.window = _service;
|
|
2709
|
-
_this.
|
|
2737
|
+
_this.fillMode = 'flat';
|
|
2710
2738
|
_this.icon = 'window-minimize';
|
|
2711
2739
|
return _this;
|
|
2712
2740
|
}
|
|
@@ -2772,7 +2800,7 @@ var WindowCloseActionDirective = /** @class */ (function (_super) {
|
|
|
2772
2800
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
2773
2801
|
_this.buttonType = 'button';
|
|
2774
2802
|
_this.window = _service;
|
|
2775
|
-
_this.
|
|
2803
|
+
_this.fillMode = 'flat';
|
|
2776
2804
|
_this.icon = 'close';
|
|
2777
2805
|
return _this;
|
|
2778
2806
|
}
|
|
@@ -2826,7 +2854,7 @@ var WindowRestoreActionDirective = /** @class */ (function (_super) {
|
|
|
2826
2854
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
2827
2855
|
_this.buttonType = 'button';
|
|
2828
2856
|
_this.window = _service;
|
|
2829
|
-
_this.
|
|
2857
|
+
_this.fillMode = 'flat';
|
|
2830
2858
|
_this.icon = 'window-restore';
|
|
2831
2859
|
return _this;
|
|
2832
2860
|
}
|
package/dist/npm/common/util.js
CHANGED
|
@@ -204,3 +204,16 @@ exports.createValueWithUnit = function (value) { return value + (exports.isNumbe
|
|
|
204
204
|
* @hidden
|
|
205
205
|
*/
|
|
206
206
|
exports.splitStringToArray = function (value) { return value.trim().replace(/\s+/g, " ").split(' '); };
|
|
207
|
+
/**
|
|
208
|
+
* @hidden
|
|
209
|
+
*/
|
|
210
|
+
exports.findPrimaryButton = function (buttons) {
|
|
211
|
+
for (var i = buttons.length - 1; i >= 0; i--) {
|
|
212
|
+
var classList = buttons[i].classList;
|
|
213
|
+
for (var j = 0; j < classList.length; j++) {
|
|
214
|
+
if (classList[j].endsWith('-primary')) {
|
|
215
|
+
return buttons[i];
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
};
|
|
@@ -6,6 +6,7 @@
|
|
|
6
6
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
7
|
var tslib_1 = require("tslib");
|
|
8
8
|
var core_1 = require("@angular/core");
|
|
9
|
+
var util_1 = require("../common/util");
|
|
9
10
|
/**
|
|
10
11
|
* Specifies the action buttons of the Dialog
|
|
11
12
|
* ([see example]({% slug actionbuttons_dialog %})).
|
|
@@ -46,9 +47,13 @@ var DialogActionsComponent = /** @class */ (function () {
|
|
|
46
47
|
* @hidden
|
|
47
48
|
*/
|
|
48
49
|
DialogActionsComponent.prototype.buttonClass = function (action) {
|
|
49
|
-
var classes = ['k-button'];
|
|
50
|
-
|
|
51
|
-
|
|
50
|
+
var classes = ['k-button k-button-md k-rounded-md'];
|
|
51
|
+
var fillMode = action.fillMode ? action.fillMode : 'solid';
|
|
52
|
+
var themeColor = action.themeColor ? action.themeColor : 'base';
|
|
53
|
+
var cssClasses = action.cssClass ? util_1.parseCSSClassNames(action.cssClass) : [];
|
|
54
|
+
classes.push("k-button-" + fillMode + " k-button-" + fillMode + "-" + themeColor);
|
|
55
|
+
if (cssClasses.length > 0) {
|
|
56
|
+
classes = classes.concat(cssClasses);
|
|
52
57
|
}
|
|
53
58
|
return classes.join(' ');
|
|
54
59
|
};
|
|
@@ -86,7 +86,7 @@ var DialogTitleBarComponent = /** @class */ (function () {
|
|
|
86
86
|
useValue: 'kendo.dialog'
|
|
87
87
|
}
|
|
88
88
|
],
|
|
89
|
-
template: "\n <ng-container\n kendoDialogTitleBarLocalizedMessages\n i18n-closeTitle=\"kendo.dialog.closeTitle|The title of the close button\"\n closeTitle=\"Close\"\n >\n <div class=\"k-window-title k-dialog-title\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"k-window-actions k-dialog-actions\">\n <
|
|
89
|
+
template: "\n <ng-container\n kendoDialogTitleBarLocalizedMessages\n i18n-closeTitle=\"kendo.dialog.closeTitle|The title of the close button\"\n closeTitle=\"Close\"\n >\n <div class=\"k-window-title k-dialog-title\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"k-window-actions k-dialog-actions\">\n <button\n role=\"button\"\n [attr.title]=\"closeButtonTitle\"\n [attr.aria-label]=\"closeButtonTitle\"\n class=\"k-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-icon-button k-window-action k-dialog-action k-dialog-close\"\n (click)=\"onCloseClick($event)\"\n >\n <span class=\"k-button-icon k-icon k-i-x\"></span>\n </button>\n </div>\n </ng-container>\n "
|
|
90
90
|
}),
|
|
91
91
|
tslib_1.__param(2, core_1.Optional()),
|
|
92
92
|
tslib_1.__metadata("design:paramtypes", [core_1.NgZone, core_1.ElementRef, kendo_angular_l10n_1.LocalizationService])
|
|
@@ -221,7 +221,7 @@ var DialogComponent = /** @class */ (function () {
|
|
|
221
221
|
*/
|
|
222
222
|
DialogComponent.prototype.handleInitialFocus = function () {
|
|
223
223
|
var wrapper = this.wrapper.nativeElement;
|
|
224
|
-
var primaryButton =
|
|
224
|
+
var primaryButton = this.findPrimary(wrapper);
|
|
225
225
|
if (this.autoFocusedElement) {
|
|
226
226
|
var initiallyFocusedElement = wrapper.querySelector(this.autoFocusedElement);
|
|
227
227
|
if (initiallyFocusedElement) {
|
|
@@ -235,6 +235,13 @@ var DialogComponent = /** @class */ (function () {
|
|
|
235
235
|
wrapper.focus();
|
|
236
236
|
}
|
|
237
237
|
};
|
|
238
|
+
/**
|
|
239
|
+
* @hidden
|
|
240
|
+
*/
|
|
241
|
+
DialogComponent.prototype.findPrimary = function (wrapper) {
|
|
242
|
+
var actionBtns = wrapper.querySelectorAll('.k-actions .k-button');
|
|
243
|
+
return util_1.findPrimaryButton(actionBtns);
|
|
244
|
+
};
|
|
238
245
|
/**
|
|
239
246
|
* @hidden
|
|
240
247
|
*/
|
|
@@ -11,7 +11,7 @@ exports.packageMetadata = {
|
|
|
11
11
|
name: '@progress/kendo-angular-dialog',
|
|
12
12
|
productName: 'Kendo UI for Angular',
|
|
13
13
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
14
|
-
publishDate:
|
|
14
|
+
publishDate: 1642584244,
|
|
15
15
|
version: '',
|
|
16
16
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
|
|
17
17
|
};
|
|
@@ -15,7 +15,7 @@ var WindowCloseActionDirective = /** @class */ (function (_super) {
|
|
|
15
15
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
16
16
|
_this.buttonType = 'button';
|
|
17
17
|
_this.window = _service;
|
|
18
|
-
_this.
|
|
18
|
+
_this.fillMode = 'flat';
|
|
19
19
|
_this.icon = 'close';
|
|
20
20
|
return _this;
|
|
21
21
|
}
|
|
@@ -15,7 +15,7 @@ var WindowMaximizeActionDirective = /** @class */ (function (_super) {
|
|
|
15
15
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
16
16
|
_this.buttonType = 'button';
|
|
17
17
|
_this.window = _service;
|
|
18
|
-
_this.
|
|
18
|
+
_this.fillMode = 'flat';
|
|
19
19
|
_this.icon = 'window-maximize';
|
|
20
20
|
return _this;
|
|
21
21
|
}
|
|
@@ -15,7 +15,7 @@ var WindowMinimizeActionDirective = /** @class */ (function (_super) {
|
|
|
15
15
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
16
16
|
_this.buttonType = 'button';
|
|
17
17
|
_this.window = _service;
|
|
18
|
-
_this.
|
|
18
|
+
_this.fillMode = 'flat';
|
|
19
19
|
_this.icon = 'window-minimize';
|
|
20
20
|
return _this;
|
|
21
21
|
}
|
|
@@ -15,7 +15,7 @@ var WindowRestoreActionDirective = /** @class */ (function (_super) {
|
|
|
15
15
|
var _this = _super.call(this, el, renderer, null, localization, ngZone) || this;
|
|
16
16
|
_this.buttonType = 'button';
|
|
17
17
|
_this.window = _service;
|
|
18
|
-
_this.
|
|
18
|
+
_this.fillMode = 'flat';
|
|
19
19
|
_this.icon = 'window-restore';
|
|
20
20
|
return _this;
|
|
21
21
|
}
|