@progress/kendo-angular-dialog 17.0.0-develop.20 → 17.0.0-develop.22
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/common/actions-layout.d.ts +1 -1
- package/common/animation-types.d.ts +1 -1
- package/common/dialog-animation-direction.d.ts +1 -1
- package/dialog/dialog-actions.component.d.ts +1 -1
- package/dialog/dialog-titlebar.component.d.ts +1 -1
- package/dialog/dialog.component.d.ts +1 -1
- package/dialog/models/dialog-action-divider.d.ts +1 -1
- package/dialog/models/dialog-result.d.ts +1 -1
- package/dialog/models/theme-color.d.ts +1 -1
- package/{esm2020 → esm2022}/common/preventable-event.mjs +2 -3
- package/{esm2020 → esm2022}/dialog/dialog-actions.component.mjs +26 -17
- package/{esm2020 → esm2022}/dialog/dialog-container.directive.mjs +3 -3
- package/{esm2020 → esm2022}/dialog/dialog-container.service.mjs +4 -4
- package/{esm2020 → esm2022}/dialog/dialog-content-base.mjs +12 -3
- package/{esm2020 → esm2022}/dialog/dialog-titlebar.component.mjs +36 -25
- package/{esm2020 → esm2022}/dialog/dialog.component.mjs +139 -71
- package/{esm2020 → esm2022}/dialog/dialog.service.mjs +7 -3
- package/esm2022/dialog/models/dialog-action.mjs +27 -0
- package/esm2022/dialog/models/dialog-ref.mjs +34 -0
- package/esm2022/dialog/models/dialog-settings.mjs +106 -0
- package/{esm2020 → esm2022}/dialog.module.mjs +4 -4
- package/{esm2020 → esm2022}/dialogs.module.mjs +4 -4
- package/{esm2020 → esm2022}/localization/custom-messages.component.mjs +9 -8
- package/{esm2020 → esm2022}/localization/localized-messages.directive.mjs +9 -8
- package/{esm2020 → esm2022}/localization/messages.mjs +19 -3
- package/{esm2020 → esm2022}/localization/titlebar-localization.service.mjs +4 -3
- package/{esm2020 → esm2022}/package-metadata.mjs +2 -2
- package/{esm2020 → esm2022}/window/actions/window-close-action.directive.mjs +20 -16
- package/{esm2020 → esm2022}/window/actions/window-maximize-action.directive.mjs +20 -16
- package/{esm2020 → esm2022}/window/actions/window-minimize-action.directive.mjs +20 -16
- package/{esm2020 → esm2022}/window/actions/window-restore-action.directive.mjs +20 -16
- package/{esm2020 → esm2022}/window/drag-resize.service.mjs +18 -15
- package/esm2022/window/models/window-ref.mjs +36 -0
- package/esm2022/window/models/window-settings.mjs +101 -0
- package/{esm2020 → esm2022}/window/navigation.service.mjs +5 -3
- package/{esm2020 → esm2022}/window/window-container.directive.mjs +3 -3
- package/{esm2020 → esm2022}/window/window-container.service.mjs +4 -4
- package/{esm2020 → esm2022}/window/window-resize-handle.directive.mjs +12 -7
- package/{esm2020 → esm2022}/window/window-titlebar.component.mjs +21 -4
- package/{esm2020 → esm2022}/window/window.component.mjs +128 -98
- package/{esm2020 → esm2022}/window/window.service.mjs +7 -3
- package/{esm2020 → esm2022}/window.module.mjs +4 -4
- package/{fesm2020 → fesm2022}/progress-kendo-angular-dialog.mjs +816 -368
- package/localization/messages.d.ts +1 -1
- package/package.json +14 -20
- package/schematics/ngAdd/index.js +1 -1
- package/window/actions/window-close-action.directive.d.ts +1 -1
- package/window/actions/window-maximize-action.directive.d.ts +1 -1
- package/window/actions/window-minimize-action.directive.d.ts +1 -1
- package/window/actions/window-restore-action.directive.d.ts +1 -1
- package/window/models/theme-color.d.ts +1 -1
- package/window/models/window-types.d.ts +4 -4
- package/window/window-resize-handle.directive.d.ts +1 -1
- package/window/window-titlebar.component.d.ts +1 -1
- package/window/window.component.d.ts +1 -1
- package/esm2020/dialog/models/dialog-action.mjs +0 -10
- package/esm2020/dialog/models/dialog-ref.mjs +0 -11
- package/esm2020/dialog/models/dialog-settings.mjs +0 -10
- package/esm2020/window/models/window-ref.mjs +0 -11
- package/esm2020/window/models/window-settings.mjs +0 -10
- package/fesm2015/progress-kendo-angular-dialog.mjs +0 -3807
- /package/{esm2020 → esm2022}/common/actions-layout.mjs +0 -0
- /package/{esm2020 → esm2022}/common/animation-types.mjs +0 -0
- /package/{esm2020 → esm2022}/common/dialog-animation-direction.mjs +0 -0
- /package/{esm2020 → esm2022}/common/util.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/dialog-animations/animate-content.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/dialog-animations/animations.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/dialog-animations/create-animation-player.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/models/dialog-action-divider.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/models/dialog-animation.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/models/dialog-close-result.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/models/dialog-result.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/models/index.mjs +0 -0
- /package/{esm2020 → esm2022}/dialog/models/theme-color.mjs +0 -0
- /package/{esm2020 → esm2022}/directives.mjs +0 -0
- /package/{esm2020 → esm2022}/index.mjs +0 -0
- /package/{esm2020 → esm2022}/localization/dialog-localization.service.mjs +0 -0
- /package/{esm2020 → esm2022}/progress-kendo-angular-dialog.mjs +0 -0
- /package/{esm2020 → esm2022}/window/models/index.mjs +0 -0
- /package/{esm2020 → esm2022}/window/models/theme-color.mjs +0 -0
- /package/{esm2020 → esm2022}/window/models/window-close-result.mjs +0 -0
- /package/{esm2020 → esm2022}/window/models/window-messages.mjs +0 -0
- /package/{esm2020 → esm2022}/window/models/window-options.mjs +0 -0
- /package/{esm2020 → esm2022}/window/models/window-types.mjs +0 -0
- /package/{esm2020 → esm2022}/window/window-events.mjs +0 -0
|
@@ -53,5 +53,5 @@ export declare class DialogActionsComponent {
|
|
|
53
53
|
*/
|
|
54
54
|
isDivider(action: DialogAction | DialogActionDivider): boolean;
|
|
55
55
|
static ɵfac: i0.ɵɵFactoryDeclaration<DialogActionsComponent, never>;
|
|
56
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DialogActionsComponent, "kendo-dialog-actions", never, { "actions": "actions"; "layout": "layout"; }, { "action": "action"; }, never, ["*"], true, never>;
|
|
56
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DialogActionsComponent, "kendo-dialog-actions", never, { "actions": { "alias": "actions"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; }, { "action": "action"; }, never, ["*"], true, never>;
|
|
57
57
|
}
|
|
@@ -41,5 +41,5 @@ export declare class DialogTitleBarComponent implements AfterViewInit {
|
|
|
41
41
|
*/
|
|
42
42
|
onCloseClick(e: Event): void;
|
|
43
43
|
static ɵfac: i0.ɵɵFactoryDeclaration<DialogTitleBarComponent, [null, null, { optional: true; }]>;
|
|
44
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DialogTitleBarComponent, "kendo-dialog-titlebar", never, { "id": "id"; "closeTitle": "closeTitle"; }, { "close": "close"; }, never, ["*"], true, never>;
|
|
44
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DialogTitleBarComponent, "kendo-dialog-titlebar", never, { "id": { "alias": "id"; "required": false; }; "closeTitle": { "alias": "closeTitle"; "required": false; }; }, { "close": "close"; }, never, ["*"], true, never>;
|
|
45
45
|
}
|
|
@@ -202,5 +202,5 @@ export declare class DialogComponent implements AfterContentInit, AfterViewInit,
|
|
|
202
202
|
private bubble;
|
|
203
203
|
private handleThemeColorClass;
|
|
204
204
|
static ɵfac: i0.ɵɵFactoryDeclaration<DialogComponent, never>;
|
|
205
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<DialogComponent, "kendo-dialog", ["kendoDialog"], { "actions": "actions"; "actionsLayout": "actionsLayout"; "autoFocusedElement": "autoFocusedElement"; "title": "title"; "width": "width"; "minWidth": "minWidth"; "maxWidth": "maxWidth"; "height": "height"; "minHeight": "minHeight"; "maxHeight": "maxHeight"; "animation": "animation"; "themeColor": "themeColor"; }, { "action": "action"; "close": "close"; }, ["titlebarContent"], ["kendo-dialog-titlebar", "*", "kendo-dialog-actions"], true, never>;
|
|
205
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<DialogComponent, "kendo-dialog", ["kendoDialog"], { "actions": { "alias": "actions"; "required": false; }; "actionsLayout": { "alias": "actionsLayout"; "required": false; }; "autoFocusedElement": { "alias": "autoFocusedElement"; "required": false; }; "title": { "alias": "title"; "required": false; }; "width": { "alias": "width"; "required": false; }; "minWidth": { "alias": "minWidth"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; "height": { "alias": "height"; "required": false; }; "minHeight": { "alias": "minHeight"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "animation": { "alias": "animation"; "required": false; }; "themeColor": { "alias": "themeColor"; "required": false; }; }, { "action": "action"; "close": "close"; }, ["titlebarContent"], ["kendo-dialog-titlebar", "*", "kendo-dialog-actions"], true, never>;
|
|
206
206
|
}
|
|
@@ -11,4 +11,4 @@ import { DialogCloseResult } from "./dialog-close-result";
|
|
|
11
11
|
* ([see example]({% slug api_dialog_dialogservice %}#toc-open).
|
|
12
12
|
* Otherwise, the value is the configuration of the action button that was clicked.
|
|
13
13
|
*/
|
|
14
|
-
export
|
|
14
|
+
export type DialogResult = DialogCloseResult | DialogAction;
|
|
@@ -10,4 +10,4 @@
|
|
|
10
10
|
* * `light`— Applies coloring based on the `light` theme color.
|
|
11
11
|
* * `dark`— Applies coloring based on the `dark` theme color.
|
|
12
12
|
*/
|
|
13
|
-
export
|
|
13
|
+
export type DialogThemeColor = 'primary' | 'light' | 'dark';
|
|
@@ -3,12 +3,11 @@
|
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
5
|
export class PreventableEvent {
|
|
6
|
+
prevented = false;
|
|
6
7
|
/**
|
|
7
8
|
* @hidden
|
|
8
9
|
*/
|
|
9
|
-
constructor() {
|
|
10
|
-
this.prevented = false;
|
|
11
|
-
}
|
|
10
|
+
constructor() { }
|
|
12
11
|
/**
|
|
13
12
|
* Prevents the default action for a specified event.
|
|
14
13
|
* In this way, the source component suppresses the built-in behavior that follows the event.
|
|
@@ -11,19 +11,7 @@ import * as i0 from "@angular/core";
|
|
|
11
11
|
* ([see example]({% slug actionbuttons_dialog %})).
|
|
12
12
|
*/
|
|
13
13
|
export class DialogActionsComponent {
|
|
14
|
-
|
|
15
|
-
this.el = el;
|
|
16
|
-
/**
|
|
17
|
-
* Specifies the possible layout of the action buttons.
|
|
18
|
-
* @default 'stretched'
|
|
19
|
-
*/
|
|
20
|
-
this.layout = 'stretched';
|
|
21
|
-
/**
|
|
22
|
-
* Fires when the user clicks an action button.
|
|
23
|
-
*/
|
|
24
|
-
this.action = new EventEmitter();
|
|
25
|
-
this.hostClasses = true;
|
|
26
|
-
}
|
|
14
|
+
el;
|
|
27
15
|
/**
|
|
28
16
|
* Allows the declarative specification of the actions.
|
|
29
17
|
*/
|
|
@@ -38,6 +26,24 @@ export class DialogActionsComponent {
|
|
|
38
26
|
throw new Error('"actions" must be either TemplateRef or DialogAction[] instance.');
|
|
39
27
|
}
|
|
40
28
|
}
|
|
29
|
+
/**
|
|
30
|
+
* @hidden
|
|
31
|
+
*/
|
|
32
|
+
actionsArray;
|
|
33
|
+
/**
|
|
34
|
+
* @hidden
|
|
35
|
+
*/
|
|
36
|
+
actionsTemplate;
|
|
37
|
+
/**
|
|
38
|
+
* Specifies the possible layout of the action buttons.
|
|
39
|
+
* @default 'stretched'
|
|
40
|
+
*/
|
|
41
|
+
layout = 'stretched';
|
|
42
|
+
/**
|
|
43
|
+
* Fires when the user clicks an action button.
|
|
44
|
+
*/
|
|
45
|
+
action = new EventEmitter();
|
|
46
|
+
hostClasses = true;
|
|
41
47
|
get startClassName() {
|
|
42
48
|
return this.layout === 'start';
|
|
43
49
|
}
|
|
@@ -50,6 +56,9 @@ export class DialogActionsComponent {
|
|
|
50
56
|
get stretchedClassName() {
|
|
51
57
|
return this.layout === 'stretched';
|
|
52
58
|
}
|
|
59
|
+
constructor(el) {
|
|
60
|
+
this.el = el;
|
|
61
|
+
}
|
|
53
62
|
/**
|
|
54
63
|
* @hidden
|
|
55
64
|
*/
|
|
@@ -76,9 +85,8 @@ export class DialogActionsComponent {
|
|
|
76
85
|
isDivider(action) {
|
|
77
86
|
return action === 'spacer';
|
|
78
87
|
}
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
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: `
|
|
88
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogActionsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
89
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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: `
|
|
82
90
|
<ng-content *ngIf="!actions"></ng-content>
|
|
83
91
|
<ng-container *ngIf="actionsArray; else actionTemplate">
|
|
84
92
|
<ng-container *ngFor="let action of actionsArray">
|
|
@@ -99,7 +107,8 @@ DialogActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
99
107
|
</ng-container>
|
|
100
108
|
<ng-template #actionTemplate [ngTemplateOutlet]="actionsTemplate"></ng-template>
|
|
101
109
|
`, 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"] }] });
|
|
102
|
-
|
|
110
|
+
}
|
|
111
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogActionsComponent, decorators: [{
|
|
103
112
|
type: Component,
|
|
104
113
|
args: [{
|
|
105
114
|
selector: 'kendo-dialog-actions',
|
|
@@ -20,10 +20,10 @@ export class DialogContainerDirective {
|
|
|
20
20
|
constructor(container, service) {
|
|
21
21
|
service.container = container;
|
|
22
22
|
}
|
|
23
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContainerDirective, deps: [{ token: i0.ViewContainerRef }, { token: i1.DialogContainerService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
24
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DialogContainerDirective, isStandalone: true, selector: "[kendoDialogContainer]", ngImport: i0 });
|
|
23
25
|
}
|
|
24
|
-
|
|
25
|
-
DialogContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DialogContainerDirective, isStandalone: true, selector: "[kendoDialogContainer]", ngImport: i0 });
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerDirective, decorators: [{
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContainerDirective, decorators: [{
|
|
27
27
|
type: Directive,
|
|
28
28
|
args: [{
|
|
29
29
|
selector: '[kendoDialogContainer]',
|
|
@@ -8,17 +8,17 @@ import * as i0 from "@angular/core";
|
|
|
8
8
|
* @hidden
|
|
9
9
|
*/
|
|
10
10
|
export class DialogContainerService {
|
|
11
|
+
static container = null;
|
|
11
12
|
set container(container) {
|
|
12
13
|
DialogContainerService.container = container;
|
|
13
14
|
}
|
|
14
15
|
get container() {
|
|
15
16
|
return DialogContainerService.container;
|
|
16
17
|
}
|
|
18
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContainerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
19
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContainerService, providedIn: 'root' });
|
|
17
20
|
}
|
|
18
|
-
|
|
19
|
-
DialogContainerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
20
|
-
DialogContainerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerService, providedIn: 'root' });
|
|
21
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContainerService, decorators: [{
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContainerService, decorators: [{
|
|
22
22
|
type: Injectable,
|
|
23
23
|
args: [{
|
|
24
24
|
providedIn: 'root'
|
|
@@ -14,6 +14,15 @@ import * as i1 from "./models/dialog-ref";
|
|
|
14
14
|
* ([see example](slug:service_dialog#toc-single-component-rendering)).
|
|
15
15
|
*/
|
|
16
16
|
export class DialogContentBase {
|
|
17
|
+
dialog;
|
|
18
|
+
/**
|
|
19
|
+
* @hidden
|
|
20
|
+
*/
|
|
21
|
+
dialogTitleBar;
|
|
22
|
+
/**
|
|
23
|
+
* @hidden
|
|
24
|
+
*/
|
|
25
|
+
dialogActions;
|
|
17
26
|
constructor(dialog) {
|
|
18
27
|
this.dialog = dialog;
|
|
19
28
|
}
|
|
@@ -33,10 +42,10 @@ export class DialogContentBase {
|
|
|
33
42
|
}
|
|
34
43
|
}
|
|
35
44
|
}
|
|
45
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContentBase, deps: [{ token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
46
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DialogContentBase, viewQueries: [{ propertyName: "dialogTitleBar", first: true, predicate: DialogTitleBarComponent, descendants: true }, { propertyName: "dialogActions", first: true, predicate: DialogActionsComponent, descendants: true }], ngImport: i0 });
|
|
36
47
|
}
|
|
37
|
-
|
|
38
|
-
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 });
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogContentBase, decorators: [{
|
|
48
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogContentBase, decorators: [{
|
|
40
49
|
type: Directive
|
|
41
50
|
}], ctorParameters: function () { return [{ type: i1.DialogRef }]; }, propDecorators: { dialogTitleBar: [{
|
|
42
51
|
type: ViewChild,
|
|
@@ -18,21 +18,32 @@ import * as i1 from "@progress/kendo-angular-l10n";
|
|
|
18
18
|
* It is used as part of the Dialog content when the component is created dynamically by using an [Angular service]({% slug service_dialog %}).
|
|
19
19
|
*/
|
|
20
20
|
export class DialogTitleBarComponent {
|
|
21
|
+
zone;
|
|
22
|
+
hostElement;
|
|
23
|
+
localizationService;
|
|
24
|
+
/**
|
|
25
|
+
* Fires when the close button of the title-bar is clicked.
|
|
26
|
+
*/
|
|
27
|
+
close = new EventEmitter();
|
|
28
|
+
/**
|
|
29
|
+
* @hidden
|
|
30
|
+
*/
|
|
31
|
+
id;
|
|
32
|
+
/**
|
|
33
|
+
* @hidden
|
|
34
|
+
*/
|
|
35
|
+
closeTitle;
|
|
36
|
+
get className() {
|
|
37
|
+
return true;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* @hidden
|
|
41
|
+
*/
|
|
42
|
+
xIcon = xIcon;
|
|
21
43
|
constructor(zone, hostElement, localizationService) {
|
|
22
44
|
this.zone = zone;
|
|
23
45
|
this.hostElement = hostElement;
|
|
24
46
|
this.localizationService = localizationService;
|
|
25
|
-
/**
|
|
26
|
-
* Fires when the close button of the title-bar is clicked.
|
|
27
|
-
*/
|
|
28
|
-
this.close = new EventEmitter();
|
|
29
|
-
/**
|
|
30
|
-
* @hidden
|
|
31
|
-
*/
|
|
32
|
-
this.xIcon = xIcon;
|
|
33
|
-
}
|
|
34
|
-
get className() {
|
|
35
|
-
return true;
|
|
36
47
|
}
|
|
37
48
|
get closeButtonTitle() {
|
|
38
49
|
return this.closeTitle || this.localizationService.get('closeTitle');
|
|
@@ -51,19 +62,18 @@ export class DialogTitleBarComponent {
|
|
|
51
62
|
const eventArgs = new PreventableEvent();
|
|
52
63
|
this.close.emit(eventArgs);
|
|
53
64
|
}
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
], ngImport: i0, template: `
|
|
65
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogTitleBarComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: i1.LocalizationService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
66
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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: [
|
|
67
|
+
TitleBarLocalizationService,
|
|
68
|
+
{
|
|
69
|
+
provide: LocalizationService,
|
|
70
|
+
useExisting: TitleBarLocalizationService
|
|
71
|
+
},
|
|
72
|
+
{
|
|
73
|
+
provide: L10N_PREFIX,
|
|
74
|
+
useValue: 'kendo.dialog'
|
|
75
|
+
}
|
|
76
|
+
], ngImport: i0, template: `
|
|
67
77
|
<ng-container
|
|
68
78
|
kendoDialogTitleBarLocalizedMessages
|
|
69
79
|
i18n-closeTitle="kendo.dialog.closeTitle|The title of the close button"
|
|
@@ -89,7 +99,8 @@ DialogTitleBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0"
|
|
|
89
99
|
</div>
|
|
90
100
|
</ng-container>
|
|
91
101
|
`, 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"] }] });
|
|
92
|
-
|
|
102
|
+
}
|
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogTitleBarComponent, decorators: [{
|
|
93
104
|
type: Component,
|
|
94
105
|
args: [{
|
|
95
106
|
selector: 'kendo-dialog-titlebar',
|
|
@@ -27,58 +27,73 @@ const DEFAULT_ANIMATION_CONFIG = { duration: 300, type: 'translate' };
|
|
|
27
27
|
* Represents the [Kendo UI Dialog component for Angular]({% slug overview_dialog_dialogs %}).
|
|
28
28
|
*/
|
|
29
29
|
export class DialogComponent {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
30
|
+
wrapper;
|
|
31
|
+
renderer;
|
|
32
|
+
cdr;
|
|
33
|
+
ngZone;
|
|
34
|
+
builder;
|
|
35
|
+
/**
|
|
36
|
+
* Specifies the action buttons that will be rendered.
|
|
37
|
+
*/
|
|
38
|
+
actions;
|
|
39
|
+
/**
|
|
40
|
+
* Specifies the layout of the action buttons in the Dialog.
|
|
41
|
+
* This option is only applicable if the action buttons are specified through the `actions` options.
|
|
42
|
+
*
|
|
43
|
+
* @default 'stretched'
|
|
44
|
+
*/
|
|
45
|
+
actionsLayout = 'stretched';
|
|
46
|
+
/**
|
|
47
|
+
* Specifies the query selector used to set the initial focus ([see examples]({% slug initial_focus_dialog %})).
|
|
48
|
+
*/
|
|
49
|
+
autoFocusedElement;
|
|
50
|
+
/**
|
|
51
|
+
* Specifies the text that is rendered in the title bar.
|
|
52
|
+
*/
|
|
53
|
+
title;
|
|
54
|
+
/**
|
|
55
|
+
* Specifies the width of the Dialog.
|
|
56
|
+
* A numeric value sets the width in pixels.
|
|
57
|
+
* A string value sets the width in arbitrary units—for example, `50%`.
|
|
58
|
+
*/
|
|
59
|
+
width;
|
|
60
|
+
/**
|
|
61
|
+
* Specifies the minimum width of the Dialog.
|
|
62
|
+
* A numeric value sets the minimum width in pixels.
|
|
63
|
+
* A string value sets the minimum width in arbitrary units—for example, `50%`.
|
|
64
|
+
*/
|
|
65
|
+
minWidth;
|
|
66
|
+
/**
|
|
67
|
+
* Specifies the maximum width of the Dialog.
|
|
68
|
+
* A numeric value sets the maximum width in pixels.
|
|
69
|
+
* A string value sets the maximum width in arbitrary units—for example, `50%`.
|
|
70
|
+
*/
|
|
71
|
+
maxWidth;
|
|
72
|
+
/**
|
|
73
|
+
* Specifies the height of the Dialog.
|
|
74
|
+
* A numeric value sets the height in pixels.
|
|
75
|
+
* A string value sets the height in arbitrary units—for example, `50%`.
|
|
76
|
+
*/
|
|
77
|
+
height;
|
|
78
|
+
/**
|
|
79
|
+
* Specifies the minimum height of the Dialog.
|
|
80
|
+
* A numeric value sets the minimum height in pixels.
|
|
81
|
+
* A string value sets the minimum height in arbitrary units—for example, `50%`.
|
|
82
|
+
*/
|
|
83
|
+
minHeight;
|
|
84
|
+
/**
|
|
85
|
+
* Specifies the maximum height of the Dialog.
|
|
86
|
+
* A numeric value sets the maximum height in pixels.
|
|
87
|
+
* A string value sets the maximum height in arbitrary units—for example, `50%`.
|
|
88
|
+
*/
|
|
89
|
+
maxHeight;
|
|
90
|
+
/**
|
|
91
|
+
* Configures the Dialog opening animation ([see example]({% slug animations_dialog %})).
|
|
92
|
+
* By default the animation type is set to `translate` and its duration is `300ms`.
|
|
93
|
+
*
|
|
94
|
+
* @default true
|
|
95
|
+
*/
|
|
96
|
+
animation = true;
|
|
82
97
|
/**
|
|
83
98
|
* The Dialog allows you to specify predefined theme colors.
|
|
84
99
|
* The theme color will be applied as a background and border color to the titlebar while also amending the text color accordingly.
|
|
@@ -124,9 +139,62 @@ export class DialogComponent {
|
|
|
124
139
|
get cssClass() {
|
|
125
140
|
return this._cssClass;
|
|
126
141
|
}
|
|
142
|
+
/**
|
|
143
|
+
* @hidden
|
|
144
|
+
*/
|
|
145
|
+
contentTemplate;
|
|
146
|
+
/**
|
|
147
|
+
* @hidden
|
|
148
|
+
*/
|
|
149
|
+
titleId = null;
|
|
150
|
+
/**
|
|
151
|
+
* @hidden
|
|
152
|
+
*/
|
|
153
|
+
contentId = null;
|
|
154
|
+
/**
|
|
155
|
+
* @hidden
|
|
156
|
+
*/
|
|
157
|
+
closeTitle;
|
|
158
|
+
/**
|
|
159
|
+
* @hidden
|
|
160
|
+
*/
|
|
161
|
+
showLicenseWatermark = false;
|
|
162
|
+
/**
|
|
163
|
+
* Fires when the user clicks an action button of the Dialog.
|
|
164
|
+
* The event is fired only when the action buttons are specified through the `actions` options.
|
|
165
|
+
*/
|
|
166
|
+
action = new EventEmitter();
|
|
167
|
+
/**
|
|
168
|
+
* Fires when the user clicks the **Close** button of the Dialog or the **ESC** key.
|
|
169
|
+
*/
|
|
170
|
+
close = new EventEmitter();
|
|
127
171
|
get dir() {
|
|
128
172
|
return this.direction;
|
|
129
173
|
}
|
|
174
|
+
tabIndex = 0;
|
|
175
|
+
titlebarContent;
|
|
176
|
+
titlebarView;
|
|
177
|
+
actionsView;
|
|
178
|
+
dialog;
|
|
179
|
+
_htmlAttributes;
|
|
180
|
+
_cssClass;
|
|
181
|
+
_themeColor = null;
|
|
182
|
+
direction;
|
|
183
|
+
subscriptions = [];
|
|
184
|
+
domSubs = new Subscription();
|
|
185
|
+
constructor(wrapper, renderer, localization, cdr, ngZone, builder) {
|
|
186
|
+
this.wrapper = wrapper;
|
|
187
|
+
this.renderer = renderer;
|
|
188
|
+
this.cdr = cdr;
|
|
189
|
+
this.ngZone = ngZone;
|
|
190
|
+
this.builder = builder;
|
|
191
|
+
const isValid = validatePackage(packageMetadata);
|
|
192
|
+
this.showLicenseWatermark = shouldShowValidationUI(isValid);
|
|
193
|
+
this.direction = localization.rtl ? 'rtl' : 'ltr';
|
|
194
|
+
this.subscriptions.push(localization.changes.subscribe(({ rtl }) => (this.direction = rtl ? 'rtl' : 'ltr')));
|
|
195
|
+
this.titleId = this.generateTitleId();
|
|
196
|
+
this.contentId = this.generateContentId();
|
|
197
|
+
}
|
|
130
198
|
ngAfterContentInit() {
|
|
131
199
|
this.bubble('close', this.titlebarContent.first);
|
|
132
200
|
this.renderer.setAttribute(this.wrapper.nativeElement.querySelector('.k-dialog'), 'aria-describedby', this.contentId);
|
|
@@ -378,19 +446,18 @@ export class DialogComponent {
|
|
|
378
446
|
this.renderer.addClass(dialog, classToAdd);
|
|
379
447
|
}
|
|
380
448
|
}
|
|
381
|
-
}
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
}
|
|
393
|
-
], 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: `
|
|
449
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", 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 });
|
|
450
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", 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: [
|
|
451
|
+
LocalizationService,
|
|
452
|
+
{
|
|
453
|
+
provide: DIALOG_LOCALIZATION_SERVICE,
|
|
454
|
+
useExisting: LocalizationService
|
|
455
|
+
},
|
|
456
|
+
{
|
|
457
|
+
provide: L10N_PREFIX,
|
|
458
|
+
useValue: 'kendo.dialog'
|
|
459
|
+
}
|
|
460
|
+
], 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: `
|
|
394
461
|
<ng-container
|
|
395
462
|
kendoDialogLocalizedMessages
|
|
396
463
|
i18n-closeTitle="kendo.dialog.closeTitle|The title of the close button"
|
|
@@ -414,12 +481,13 @@ DialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
|
|
|
414
481
|
</div>
|
|
415
482
|
</ng-container>
|
|
416
483
|
`, 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: [
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
484
|
+
trigger('overlayAppear', [
|
|
485
|
+
state('in', style({ opacity: 1 })),
|
|
486
|
+
transition('void => *', [style({ opacity: 0.1 }), animate('.3s cubic-bezier(.2, .6, .4, 1)')])
|
|
487
|
+
])
|
|
488
|
+
] });
|
|
489
|
+
}
|
|
490
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogComponent, decorators: [{
|
|
423
491
|
type: Component,
|
|
424
492
|
args: [{
|
|
425
493
|
animations: [
|
|
@@ -17,6 +17,8 @@ import * as i0 from "@angular/core";
|
|
|
17
17
|
import * as i1 from "./dialog-container.service";
|
|
18
18
|
const isNotComponent = (component) => isString(component) || component instanceof TemplateRef;
|
|
19
19
|
class DialogInjector {
|
|
20
|
+
getDialogRef;
|
|
21
|
+
parentInjector;
|
|
20
22
|
constructor(getDialogRef, parentInjector) {
|
|
21
23
|
this.getDialogRef = getDialogRef;
|
|
22
24
|
this.parentInjector = parentInjector;
|
|
@@ -33,6 +35,8 @@ class DialogInjector {
|
|
|
33
35
|
* ([see example]({% slug service_dialog %})).
|
|
34
36
|
*/
|
|
35
37
|
export class DialogService {
|
|
38
|
+
resolver;
|
|
39
|
+
containerService;
|
|
36
40
|
constructor(
|
|
37
41
|
/**
|
|
38
42
|
* @hidden
|
|
@@ -215,10 +219,10 @@ See https://www.telerik.com/kendo-angular-ui/components/dialogs/dialog/service/.
|
|
|
215
219
|
]
|
|
216
220
|
};
|
|
217
221
|
}
|
|
222
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogService, deps: [{ token: i0.ComponentFactoryResolver }, { token: DialogContainerService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
223
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogService, providedIn: 'root' });
|
|
218
224
|
}
|
|
219
|
-
|
|
220
|
-
DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogService, providedIn: 'root' });
|
|
221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DialogService, decorators: [{
|
|
225
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogService, decorators: [{
|
|
222
226
|
type: Injectable,
|
|
223
227
|
args: [{
|
|
224
228
|
providedIn: 'root'
|
|
@@ -0,0 +1,27 @@
|
|
|
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
|
+
/**
|
|
6
|
+
* The settings for the Dialog actions when the Dialog is opened through `DialogService`
|
|
7
|
+
* ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
|
|
8
|
+
*/
|
|
9
|
+
export class DialogAction {
|
|
10
|
+
/**
|
|
11
|
+
* The text of the action button.
|
|
12
|
+
*/
|
|
13
|
+
text;
|
|
14
|
+
/**
|
|
15
|
+
* Determines the theme color of the action button. The theme color will be applied as a background and border color while also amending the text color accordingly.
|
|
16
|
+
*/
|
|
17
|
+
themeColor;
|
|
18
|
+
/**
|
|
19
|
+
* Specifies the background and border styles of the action button.
|
|
20
|
+
*/
|
|
21
|
+
fillMode;
|
|
22
|
+
/**
|
|
23
|
+
* Sets the CSS classes that will be rendered on the action button.
|
|
24
|
+
* Supports the union type of values that NgClass accepts [ngClass](link:site.data.urls.angular['ngclassapi']).
|
|
25
|
+
*/
|
|
26
|
+
cssClass;
|
|
27
|
+
}
|