@fundamental-ngx/core 0.43.9 → 0.43.11

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 (75) hide show
  1. package/date-picker/date-picker.component.d.ts +2 -0
  2. package/datetime-picker/datetime-picker.component.d.ts +2 -0
  3. package/dialog/base/dialog-base.service.d.ts +4 -3
  4. package/dialog/dialog-container/dialog-container.component.d.ts +12 -11
  5. package/dialog/index.d.ts +11 -10
  6. package/dialog/utils/dialog-container.model.d.ts +4 -0
  7. package/esm2020/busy-indicator/busy-indicator.component.mjs +3 -3
  8. package/esm2020/date-picker/date-picker.component.mjs +8 -8
  9. package/esm2020/datetime-picker/datetime-picker.component.mjs +8 -7
  10. package/esm2020/dialog/base/dialog-base.service.mjs +8 -3
  11. package/esm2020/dialog/dialog-container/dialog-container.component.mjs +23 -23
  12. package/esm2020/dialog/index.mjs +12 -11
  13. package/esm2020/dialog/utils/dialog-container.model.mjs +2 -0
  14. package/esm2020/form/form-message/popover-form-message.service.mjs +2 -12
  15. package/esm2020/message-box/message-box-container/message-box-container.component.mjs +23 -24
  16. package/esm2020/multi-input/multi-input.component.mjs +76 -56
  17. package/esm2020/multi-input/multi-input.module.mjs +17 -14
  18. package/esm2020/multi-input/pair-selection.model.mjs +38 -0
  19. package/esm2020/popover/popover-body/popover-body.component.mjs +3 -3
  20. package/esm2020/popover/popover-service/popover.service.mjs +9 -2
  21. package/esm2020/time-picker/time-picker.component.mjs +19 -20
  22. package/esm2020/token/token.component.mjs +4 -3
  23. package/esm2020/token/tokenizer.component.mjs +32 -13
  24. package/fesm2015/fundamental-ngx-core-busy-indicator.mjs +2 -2
  25. package/fesm2015/fundamental-ngx-core-busy-indicator.mjs.map +1 -1
  26. package/fesm2015/fundamental-ngx-core-date-picker.mjs +6 -6
  27. package/fesm2015/fundamental-ngx-core-date-picker.mjs.map +1 -1
  28. package/fesm2015/fundamental-ngx-core-datetime-picker.mjs +6 -6
  29. package/fesm2015/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
  30. package/fesm2015/fundamental-ngx-core-dialog.mjs +189 -184
  31. package/fesm2015/fundamental-ngx-core-dialog.mjs.map +1 -1
  32. package/fesm2015/fundamental-ngx-core-form.mjs +1 -10
  33. package/fesm2015/fundamental-ngx-core-form.mjs.map +1 -1
  34. package/fesm2015/fundamental-ngx-core-message-box.mjs +20 -20
  35. package/fesm2015/fundamental-ngx-core-message-box.mjs.map +1 -1
  36. package/fesm2015/fundamental-ngx-core-multi-input.mjs +158 -100
  37. package/fesm2015/fundamental-ngx-core-multi-input.mjs.map +1 -1
  38. package/fesm2015/fundamental-ngx-core-popover.mjs +10 -3
  39. package/fesm2015/fundamental-ngx-core-popover.mjs.map +1 -1
  40. package/fesm2015/fundamental-ngx-core-time-picker.mjs +14 -16
  41. package/fesm2015/fundamental-ngx-core-time-picker.mjs.map +1 -1
  42. package/fesm2015/fundamental-ngx-core-token.mjs +29 -9
  43. package/fesm2015/fundamental-ngx-core-token.mjs.map +1 -1
  44. package/fesm2020/fundamental-ngx-core-busy-indicator.mjs +2 -2
  45. package/fesm2020/fundamental-ngx-core-busy-indicator.mjs.map +1 -1
  46. package/fesm2020/fundamental-ngx-core-date-picker.mjs +6 -6
  47. package/fesm2020/fundamental-ngx-core-date-picker.mjs.map +1 -1
  48. package/fesm2020/fundamental-ngx-core-datetime-picker.mjs +6 -5
  49. package/fesm2020/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
  50. package/fesm2020/fundamental-ngx-core-dialog.mjs +188 -183
  51. package/fesm2020/fundamental-ngx-core-dialog.mjs.map +1 -1
  52. package/fesm2020/fundamental-ngx-core-form.mjs +1 -10
  53. package/fesm2020/fundamental-ngx-core-form.mjs.map +1 -1
  54. package/fesm2020/fundamental-ngx-core-message-box.mjs +20 -20
  55. package/fesm2020/fundamental-ngx-core-message-box.mjs.map +1 -1
  56. package/fesm2020/fundamental-ngx-core-multi-input.mjs +158 -98
  57. package/fesm2020/fundamental-ngx-core-multi-input.mjs.map +1 -1
  58. package/fesm2020/fundamental-ngx-core-popover.mjs +10 -3
  59. package/fesm2020/fundamental-ngx-core-popover.mjs.map +1 -1
  60. package/fesm2020/fundamental-ngx-core-time-picker.mjs +15 -16
  61. package/fesm2020/fundamental-ngx-core-time-picker.mjs.map +1 -1
  62. package/fesm2020/fundamental-ngx-core-token.mjs +29 -9
  63. package/fesm2020/fundamental-ngx-core-token.mjs.map +1 -1
  64. package/form/form-message/popover-form-message.service.d.ts +3 -7
  65. package/fundamental-ngx-core-v0.43.11.tgz +0 -0
  66. package/message-box/message-box-container/message-box-container.component.d.ts +12 -13
  67. package/multi-input/multi-input.component.d.ts +30 -21
  68. package/multi-input/multi-input.module.d.ts +2 -1
  69. package/multi-input/pair-selection.model.d.ts +19 -0
  70. package/package.json +3 -3
  71. package/popover/popover-service/popover.service.d.ts +1 -1
  72. package/schematics/add-dependencies/index.js +4 -4
  73. package/time-picker/time-picker.component.d.ts +17 -15
  74. package/token/tokenizer.component.d.ts +10 -2
  75. package/fundamental-ngx-core-v0.43.9.tgz +0 -0
@@ -1,79 +1,40 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Directive, ContentChild, ContentChildren, InjectionToken, Injectable, Component, Optional, Inject, inject, isDevMode, HostBinding, HostListener, Input, ChangeDetectionStrategy, ViewEncapsulation, ViewChild, ComponentRef, EmbeddedViewRef, Type, TemplateRef, PLATFORM_ID, Injector, NgModule } from '@angular/core';
2
+ import { InjectionToken, Injectable, Component, Optional, Inject, Input, Directive, ContentChildren, ContentChild, inject, isDevMode, HostBinding, HostListener, ChangeDetectionStrategy, ViewEncapsulation, ViewChild, ComponentRef, EmbeddedViewRef, Type, TemplateRef, PLATFORM_ID, Injector, NgModule } from '@angular/core';
3
+ import * as i3 from '@fundamental-ngx/core/scrollbar';
4
+ import { ScrollbarDirective, ScrollbarModule } from '@fundamental-ngx/core/scrollbar';
5
+ import { Subject, BehaviorSubject, Subscription, fromEvent, takeUntil } from 'rxjs';
3
6
  import * as i4 from '@angular/common';
4
7
  import { isPlatformBrowser, CommonModule } from '@angular/common';
5
- import * as i7 from '@angular/cdk/a11y';
6
- import { A11yModule } from '@angular/cdk/a11y';
7
- import * as i6 from '@angular/cdk/drag-drop';
8
- import { DragDropModule } from '@angular/cdk/drag-drop';
9
- import { ButtonModule } from '@fundamental-ngx/core/button';
10
- import * as i1$1 from '@fundamental-ngx/core/icon';
11
- import { IconModule } from '@fundamental-ngx/core/icon';
12
- import * as i3$2 from '@fundamental-ngx/core/title';
13
- import { TitleToken, TitleModule } from '@fundamental-ngx/core/title';
14
- import * as i2 from '@fundamental-ngx/core/bar';
15
- import { FD_BUTTON_BAR_COMPONENT, BarElementDirective, BarModule } from '@fundamental-ngx/core/bar';
16
8
  import * as i5 from '@fundamental-ngx/core/busy-indicator';
17
9
  import { BusyIndicatorModule } from '@fundamental-ngx/core/busy-indicator';
10
+ import * as i1 from '@fundamental-ngx/core/icon';
11
+ import { IconModule } from '@fundamental-ngx/core/icon';
12
+ import * as i2 from '@fundamental-ngx/core/bar';
13
+ import { BarElementDirective, FD_BUTTON_BAR_COMPONENT, BarModule } from '@fundamental-ngx/core/bar';
14
+ import { startWith, filter, debounceTime } from 'rxjs/operators';
18
15
  import * as i4$1 from '@fundamental-ngx/cdk/utils';
19
16
  import { TemplateDirective, KeyUtil, applyCssClass, DynamicComponentContainer, DestroyedService, RtlService, ResizeModule, TemplateModule, InitialFocusModule, DynamicComponentService } from '@fundamental-ngx/cdk/utils';
20
- import { __decorate, __metadata } from 'tslib';
21
- import * as i3 from '@fundamental-ngx/core/content-density';
17
+ import * as i3$1 from '@fundamental-ngx/core/content-density';
22
18
  import { contentDensityObserverProviders } from '@fundamental-ngx/core/content-density';
23
- import * as i3$1 from '@fundamental-ngx/core/scrollbar';
24
- import { ScrollbarDirective, ScrollbarModule } from '@fundamental-ngx/core/scrollbar';
25
- import { Subject, BehaviorSubject, Subscription, fromEvent, takeUntil } from 'rxjs';
26
- import { startWith, filter, debounceTime } from 'rxjs/operators';
27
- import * as i1 from '@angular/router';
19
+ import * as i3$2 from '@fundamental-ngx/core/title';
20
+ import { TitleToken, TitleModule } from '@fundamental-ngx/core/title';
21
+ import { __decorate, __metadata } from 'tslib';
22
+ import * as i4$2 from '@angular/cdk/portal';
23
+ import { CdkPortalOutlet, ComponentPortal, PortalModule } from '@angular/cdk/portal';
24
+ import * as i1$1 from '@angular/router';
28
25
  import { NavigationStart } from '@angular/router';
29
26
  import { ESCAPE } from '@angular/cdk/keycodes';
27
+ import * as i6 from '@angular/cdk/drag-drop';
28
+ import { DragDropModule } from '@angular/cdk/drag-drop';
29
+ import * as i7 from '@angular/cdk/a11y';
30
+ import { A11yModule } from '@angular/cdk/a11y';
30
31
  import { trigger, state, style, transition, animate } from '@angular/animations';
31
- import * as i4$2 from '@angular/cdk/portal';
32
- import { CdkPortalOutlet, ComponentPortal, PortalModule } from '@angular/cdk/portal';
33
32
  import * as i2$1 from '@angular/cdk/overlay';
34
33
  import { OverlayConfig, OverlayModule, OverlayContainer } from '@angular/cdk/overlay';
34
+ import { ButtonModule } from '@fundamental-ngx/core/button';
35
35
 
36
- class DialogHeaderBase {
37
- /** @hidden */
38
- set defaultTitleSize(title) {
39
- if (title && !title.headerSize) {
40
- title.headerSize = 5;
41
- this._changeDetectorRef.detectChanges();
42
- }
43
- }
44
- /** @hidden */
45
- constructor(_changeDetectorRef) {
46
- this._changeDetectorRef = _changeDetectorRef;
47
- }
48
- /** @hidden */
49
- ngAfterContentInit() {
50
- this._assignCustomTemplates();
51
- }
52
- /** @hidden Assign custom templates */
53
- _assignCustomTemplates() {
54
- this.customTemplates.forEach((template) => {
55
- switch (template.getName()) {
56
- case 'header':
57
- this.headerTemplate = template.templateRef;
58
- break;
59
- case 'subheader':
60
- this.subHeaderTemplate = template.templateRef;
61
- break;
62
- }
63
- });
64
- }
65
- }
66
- DialogHeaderBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderBase, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
67
- DialogHeaderBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: DialogHeaderBase, queries: [{ propertyName: "defaultTitleSize", first: true, predicate: TitleToken, descendants: true }, { propertyName: "customTemplates", predicate: TemplateDirective }], ngImport: i0 });
68
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderBase, decorators: [{
69
- type: Directive
70
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { defaultTitleSize: [{
71
- type: ContentChild,
72
- args: [TitleToken]
73
- }], customTemplates: [{
74
- type: ContentChildren,
75
- args: [TemplateDirective]
76
- }] } });
36
+ const FD_DIALOG_BODY_COMPONENT = new InjectionToken('FdDialogBodyComponent');
37
+ const FD_DIALOG_FOCUS_TRAP_ERROR = new InjectionToken('FdDialogFocusTrapError');
77
38
 
78
39
  /* eslint-disable @typescript-eslint/no-inferrable-types */
79
40
  class DialogConfigBase {
@@ -121,42 +82,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
121
82
  type: Injectable
122
83
  }] });
123
84
 
124
- /**
125
- * Applies fundamental layout and styling to the contents of a dialog header.
126
- *
127
- * ```html
128
- * <fd-dialog-header>
129
- * <h1 fd-title>Title</h1>
130
- * <button fd-dialog-close-button></button>
131
- * </fd-dialog-header>
132
- * ```
133
- */
134
- class DialogHeaderComponent extends DialogHeaderBase {
135
- /** @hidden */
136
- constructor(dialogConfig, changeDetectorRef) {
137
- super(changeDetectorRef);
138
- this.dialogConfig = dialogConfig;
139
- this.dialogConfig = this.dialogConfig || {};
140
- }
141
- /** @hidden */
142
- ngAfterContentInit() {
143
- super.ngAfterContentInit();
144
- }
145
- }
146
- DialogHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderComponent, deps: [{ token: DialogConfig, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
147
- DialogHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogHeaderComponent, selector: "fd-dialog-header", usesInheritance: true, ngImport: i0, template: "<div\n fd-bar\n class=\"fd-dialog__header\"\n [fdCozy]=\"dialogConfig.mobile\"\n [barDesign]=\"subHeaderTemplate ? 'header-with-subheader' : 'header'\"\n>\n <ng-container *ngTemplateOutlet=\"headerTemplate ? headerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-left>\n <fd-bar-element [fullWidth]=\"true\">\n <ng-content select=\"[fd-title]\"></ng-content>\n </fd-bar-element>\n </div>\n <div fd-bar-right>\n <fd-bar-element>\n <ng-content select=\"[fd-dialog-close-button]\"></ng-content>\n </fd-bar-element>\n </div>\n </ng-template>\n</div>\n\n<div fd-bar *ngIf=\"subHeaderTemplate\" class=\"fd-dialog__subheader\" barDesign=\"subheader\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"subHeaderTemplate\"></ng-container>\n</div>\n", dependencies: [{ kind: "component", type: i2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "directive", type: i3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
148
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderComponent, decorators: [{
149
- type: Component,
150
- args: [{ selector: 'fd-dialog-header', template: "<div\n fd-bar\n class=\"fd-dialog__header\"\n [fdCozy]=\"dialogConfig.mobile\"\n [barDesign]=\"subHeaderTemplate ? 'header-with-subheader' : 'header'\"\n>\n <ng-container *ngTemplateOutlet=\"headerTemplate ? headerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-left>\n <fd-bar-element [fullWidth]=\"true\">\n <ng-content select=\"[fd-title]\"></ng-content>\n </fd-bar-element>\n </div>\n <div fd-bar-right>\n <fd-bar-element>\n <ng-content select=\"[fd-dialog-close-button]\"></ng-content>\n </fd-bar-element>\n </div>\n </ng-template>\n</div>\n\n<div fd-bar *ngIf=\"subHeaderTemplate\" class=\"fd-dialog__subheader\" barDesign=\"subheader\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"subHeaderTemplate\"></ng-container>\n</div>\n" }]
151
- }], ctorParameters: function () {
152
- return [{ type: DialogConfig, decorators: [{
153
- type: Optional
154
- }] }, { type: i0.ChangeDetectorRef }];
155
- } });
156
-
157
- const FD_DIALOG_BODY_COMPONENT = new InjectionToken('FdDialogBodyComponent');
158
- const FD_DIALOG_FOCUS_TRAP_ERROR = new InjectionToken('FdDialogFocusTrapError');
159
-
160
85
  class DialogRefBase {
161
86
  constructor() {
162
87
  /** @hidden */
@@ -258,7 +183,7 @@ DialogBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
258
183
  provide: FD_DIALOG_BODY_COMPONENT,
259
184
  useExisting: DialogBodyComponent
260
185
  }
261
- ], hostDirectives: [{ directive: i3$1.ScrollbarDirective }], ngImport: i0, template: "<ng-content></ng-content>\n<div class=\"fd-dialog__loader\" *ngIf=\"dialogRef.onLoading | async\">\n <fd-busy-indicator [loading]=\"true\" size=\"l\"></fd-busy-indicator>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
186
+ ], hostDirectives: [{ directive: i3.ScrollbarDirective }], ngImport: i0, template: "<ng-content></ng-content>\n<div class=\"fd-dialog__loader\" *ngIf=\"dialogRef.onLoading | async\">\n <fd-busy-indicator [loading]=\"true\" size=\"l\"></fd-busy-indicator>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
262
187
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogBodyComponent, decorators: [{
263
188
  type: Component,
264
189
  args: [{ selector: 'fd-dialog-body', host: {
@@ -278,12 +203,63 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
278
203
  type: Optional
279
204
  }] }, { type: DialogRef, decorators: [{
280
205
  type: Optional
281
- }] }, { type: i3$1.ScrollbarDirective, decorators: [{
206
+ }] }, { type: i3.ScrollbarDirective, decorators: [{
282
207
  type: Inject,
283
208
  args: [ScrollbarDirective]
284
209
  }] }];
285
210
  } });
286
211
 
212
+ /**
213
+ * Directive that applies fundamental dialog styling to a dialog close button.
214
+ *
215
+ * ```html
216
+ * <button fd-dialog-close-button></button>
217
+ * ```
218
+ */
219
+ class DialogCloseButtonComponent {
220
+ constructor() {
221
+ /** Displays dialog close button in mobile mode */
222
+ this.mobile = false;
223
+ }
224
+ }
225
+ DialogCloseButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogCloseButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
226
+ DialogCloseButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: { mobile: "mobile", title: "title" }, host: { properties: { "attr.aria-label": "\"close\"", "class.fd-button": "true", "class.is-compact": "!mobile", "class.fd-button--transparent": "true", "attr.title": "title" } }, ngImport: i0, template: `<fd-icon glyph="decline"></fd-icon><ng-content></ng-content>`, isInline: true, dependencies: [{ kind: "component", type: i1.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }] });
227
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogCloseButtonComponent, decorators: [{
228
+ type: Component,
229
+ args: [{
230
+ // eslint-disable-next-line @angular-eslint/component-selector
231
+ selector: '[fd-dialog-close-button]',
232
+ host: {
233
+ '[attr.aria-label]': '"close"',
234
+ '[class.fd-button]': 'true',
235
+ '[class.is-compact]': '!mobile',
236
+ '[class.fd-button--transparent]': 'true',
237
+ '[attr.title]': 'title'
238
+ },
239
+ template: `<fd-icon glyph="decline"></fd-icon><ng-content></ng-content>`
240
+ }]
241
+ }], propDecorators: { mobile: [{
242
+ type: Input
243
+ }], title: [{
244
+ type: Input
245
+ }] } });
246
+
247
+ /**
248
+ * @deprecated
249
+ * Consider using `fd-button-bar`
250
+ */
251
+ class DialogFooterButtonComponent extends BarElementDirective {
252
+ }
253
+ DialogFooterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogFooterButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
254
+ DialogFooterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogFooterButtonComponent, selector: "fd-dialog-footer-button", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
255
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogFooterButtonComponent, decorators: [{
256
+ type: Component,
257
+ args: [{
258
+ selector: 'fd-dialog-footer-button',
259
+ template: '<ng-content></ng-content>'
260
+ }]
261
+ }] });
262
+
287
263
  class DialogFooterBase {
288
264
  /** @hidden */
289
265
  ngAfterContentInit() {
@@ -349,7 +325,7 @@ class DialogFooterComponent extends DialogFooterBase {
349
325
  }
350
326
  }
351
327
  DialogFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogFooterComponent, deps: [{ token: DialogConfig, optional: true }], target: i0.ɵɵFactoryTarget.Component });
352
- DialogFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogFooterComponent, selector: "fd-dialog-footer", usesInheritance: true, ngImport: i0, template: "<footer fd-bar class=\"fd-dialog__footer\" barDesign=\"footer\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"footerTemplate ? footerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-right>\n <ng-content></ng-content>\n </div>\n </ng-template>\n</footer>\n", dependencies: [{ kind: "component", type: i2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
328
+ DialogFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogFooterComponent, selector: "fd-dialog-footer", usesInheritance: true, ngImport: i0, template: "<footer fd-bar class=\"fd-dialog__footer\" barDesign=\"footer\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"footerTemplate ? footerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-right>\n <ng-content></ng-content>\n </div>\n </ng-template>\n</footer>\n", dependencies: [{ kind: "component", type: i2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
353
329
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogFooterComponent, decorators: [{
354
330
  type: Component,
355
331
  args: [{ selector: 'fd-dialog-footer', template: "<footer fd-bar class=\"fd-dialog__footer\" barDesign=\"footer\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"footerTemplate ? footerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-right>\n <ng-content></ng-content>\n </div>\n </ng-template>\n</footer>\n" }]
@@ -359,6 +335,81 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
359
335
  }] }];
360
336
  } });
361
337
 
338
+ class DialogHeaderBase {
339
+ /** @hidden */
340
+ set defaultTitleSize(title) {
341
+ if (title && !title.headerSize) {
342
+ title.headerSize = 5;
343
+ this._changeDetectorRef.detectChanges();
344
+ }
345
+ }
346
+ /** @hidden */
347
+ constructor(_changeDetectorRef) {
348
+ this._changeDetectorRef = _changeDetectorRef;
349
+ }
350
+ /** @hidden */
351
+ ngAfterContentInit() {
352
+ this._assignCustomTemplates();
353
+ }
354
+ /** @hidden Assign custom templates */
355
+ _assignCustomTemplates() {
356
+ this.customTemplates.forEach((template) => {
357
+ switch (template.getName()) {
358
+ case 'header':
359
+ this.headerTemplate = template.templateRef;
360
+ break;
361
+ case 'subheader':
362
+ this.subHeaderTemplate = template.templateRef;
363
+ break;
364
+ }
365
+ });
366
+ }
367
+ }
368
+ DialogHeaderBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderBase, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
369
+ DialogHeaderBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: DialogHeaderBase, queries: [{ propertyName: "defaultTitleSize", first: true, predicate: TitleToken, descendants: true }, { propertyName: "customTemplates", predicate: TemplateDirective }], ngImport: i0 });
370
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderBase, decorators: [{
371
+ type: Directive
372
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { defaultTitleSize: [{
373
+ type: ContentChild,
374
+ args: [TitleToken]
375
+ }], customTemplates: [{
376
+ type: ContentChildren,
377
+ args: [TemplateDirective]
378
+ }] } });
379
+
380
+ /**
381
+ * Applies fundamental layout and styling to the contents of a dialog header.
382
+ *
383
+ * ```html
384
+ * <fd-dialog-header>
385
+ * <h1 fd-title>Title</h1>
386
+ * <button fd-dialog-close-button></button>
387
+ * </fd-dialog-header>
388
+ * ```
389
+ */
390
+ class DialogHeaderComponent extends DialogHeaderBase {
391
+ /** @hidden */
392
+ constructor(dialogConfig, changeDetectorRef) {
393
+ super(changeDetectorRef);
394
+ this.dialogConfig = dialogConfig;
395
+ this.dialogConfig = this.dialogConfig || {};
396
+ }
397
+ /** @hidden */
398
+ ngAfterContentInit() {
399
+ super.ngAfterContentInit();
400
+ }
401
+ }
402
+ DialogHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderComponent, deps: [{ token: DialogConfig, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
403
+ DialogHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogHeaderComponent, selector: "fd-dialog-header", usesInheritance: true, ngImport: i0, template: "<div\n fd-bar\n class=\"fd-dialog__header\"\n [fdCozy]=\"dialogConfig.mobile\"\n [barDesign]=\"subHeaderTemplate ? 'header-with-subheader' : 'header'\"\n>\n <ng-container *ngTemplateOutlet=\"headerTemplate ? headerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-left>\n <fd-bar-element [fullWidth]=\"true\">\n <ng-content select=\"[fd-title]\"></ng-content>\n </fd-bar-element>\n </div>\n <div fd-bar-right>\n <fd-bar-element>\n <ng-content select=\"[fd-dialog-close-button]\"></ng-content>\n </fd-bar-element>\n </div>\n </ng-template>\n</div>\n\n<div fd-bar *ngIf=\"subHeaderTemplate\" class=\"fd-dialog__subheader\" barDesign=\"subheader\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"subHeaderTemplate\"></ng-container>\n</div>\n", dependencies: [{ kind: "component", type: i2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth", "isTitle"] }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
404
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogHeaderComponent, decorators: [{
405
+ type: Component,
406
+ args: [{ selector: 'fd-dialog-header', template: "<div\n fd-bar\n class=\"fd-dialog__header\"\n [fdCozy]=\"dialogConfig.mobile\"\n [barDesign]=\"subHeaderTemplate ? 'header-with-subheader' : 'header'\"\n>\n <ng-container *ngTemplateOutlet=\"headerTemplate ? headerTemplate : defaultTemplate\"></ng-container>\n\n <ng-template #defaultTemplate>\n <div fd-bar-left>\n <fd-bar-element [fullWidth]=\"true\">\n <ng-content select=\"[fd-title]\"></ng-content>\n </fd-bar-element>\n </div>\n <div fd-bar-right>\n <fd-bar-element>\n <ng-content select=\"[fd-dialog-close-button]\"></ng-content>\n </fd-bar-element>\n </div>\n </ng-template>\n</div>\n\n<div fd-bar *ngIf=\"subHeaderTemplate\" class=\"fd-dialog__subheader\" barDesign=\"subheader\" [fdCozy]=\"dialogConfig.mobile\">\n <ng-container *ngTemplateOutlet=\"subHeaderTemplate\"></ng-container>\n</div>\n" }]
407
+ }], ctorParameters: function () {
408
+ return [{ type: DialogConfig, decorators: [{
409
+ type: Optional
410
+ }] }, { type: i0.ChangeDetectorRef }];
411
+ } });
412
+
362
413
  /** @hidden Returns dialog size based on width
363
414
  * @param width - dialog window width
364
415
  **/
@@ -494,11 +545,11 @@ class DialogBase {
494
545
  }
495
546
  }
496
547
  }
497
- DialogBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogBase, deps: [{ token: i1.Router }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i4$1.RtlService }, { token: i4$1.FocusTrapService }], target: i0.ɵɵFactoryTarget.Directive });
548
+ DialogBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogBase, deps: [{ token: i1$1.Router }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i4$1.RtlService }, { token: i4$1.FocusTrapService }], target: i0.ɵɵFactoryTarget.Directive });
498
549
  DialogBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: DialogBase, host: { listeners: { "keydown": "closeDialogEsc($event)", "mousedown": "closeDialog($event.target)" }, properties: { "attr.dir": "this._dir" } }, ngImport: i0 });
499
550
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogBase, decorators: [{
500
551
  type: Directive
501
- }], ctorParameters: function () { return [{ type: i1.Router }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i4$1.RtlService }, { type: i4$1.FocusTrapService }]; }, propDecorators: { _dir: [{
552
+ }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i4$1.RtlService }, { type: i4$1.FocusTrapService }]; }, propDecorators: { _dir: [{
502
553
  type: HostBinding,
503
554
  args: ['attr.dir']
504
555
  }], closeDialogEsc: [{
@@ -664,8 +715,8 @@ class DialogComponent extends DialogBase {
664
715
  });
665
716
  }
666
717
  }
667
- DialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponent, deps: [{ token: DialogConfig, optional: true }, { token: DialogRef, optional: true }, { token: i1.Router, optional: true }, { token: i4$1.RtlService, optional: true }, { token: i4$1.FocusTrapService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
668
- DialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogComponent, selector: "fd-dialog", inputs: { class: "class", embeddedDialogRef: ["dialogRef", "embeddedDialogRef"], embeddedDialogConfig: ["dialogConfig", "embeddedDialogConfig"] }, host: { attributes: { "tabindex": "-1" } }, providers: [contentDensityObserverProviders({ alwaysAddModifiers: true })], queries: [{ propertyName: "dialogHeaderConfig", first: true, predicate: DialogHeaderComponent, descendants: true }, { propertyName: "dialogBodyConfig", first: true, predicate: DialogBodyComponent, descendants: true }, { propertyName: "dialogFooterConfig", first: true, predicate: DialogFooterComponent, descendants: true }, { propertyName: "dialogTitle", first: true, predicate: DialogTitleDirective, descendants: true }], viewQueries: [{ propertyName: "dialogWindow", first: true, predicate: ["dialogWindow"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n #dialogWindow\n role=\"dialog\"\n tabindex=\"-1\"\n aria-modal=\"true\"\n fdkResize\n cdkTrapFocus\n cdkDrag\n cdkDragBoundary=\".fd-dialog\"\n fd-scrollbar\n [fdkResizeBoundary]=\"elementRef.nativeElement\"\n class=\"fd-dialog__content\"\n [class]=\"dialogConfig.dialogPanelClass\"\n [class.cdk-drag]=\"dialogConfig.draggable\"\n [class.fd-dialog__content--s]=\"dialogPaddingSize === 'sm'\"\n [class.fd-dialog__content--m]=\"dialogPaddingSize === 'md'\"\n [class.fd-dialog__content--l]=\"dialogPaddingSize === 'lg'\"\n [class.fd-dialog__content--xl]=\"dialogPaddingSize === 'xl'\"\n [class.fd-dialog__content--mobile]=\"dialogConfig.mobile || dialogConfig.fullScreen\"\n [class.fd-dialog__content--no-mobile-stretch]=\"dialogConfig.mobileOuterSpacing\"\n [class.fd-dialog__content--draggable-grab]=\"dialogConfig.draggable && !isDragged\"\n [class.fd-dialog__content--draggable-grabbing]=\"dialogConfig.draggable && isDragged\"\n [cdkDragDisabled]=\"!dialogConfig.draggable\"\n [fdkResizeDisabled]=\"!dialogConfig.resizable\"\n [attr.id]=\"dialogConfig.id\"\n [attr.aria-label]=\"dialogConfig.ariaLabel\"\n [attr.aria-labelledby]=\"dialogConfig.ariaLabelledBy\"\n [attr.aria-describedby]=\"dialogConfig.ariaDescribedBy\"\n [attr.aria-modal]=\"dialogConfig.ariaModal\"\n (cdkDragStarted)=\"isDragged = true\"\n (cdkDragEnded)=\"isDragged = false\"\n (onResizeEnd)=\"adjustResponsivePadding()\"\n>\n <span fdkResizeHandle *ngIf=\"dialogConfig.resizable\" class=\"fd-dialog__resize-handle\"></span>\n\n <div cdkDragHandle [cdkDragHandleDisabled]=\"!dialogConfig.draggable\">\n <ng-content select=\"fd-dialog-header\"></ng-content>\n </div>\n\n <ng-content select=\"fd-dialog-body\"></ng-content>\n\n <ng-content select=\"fd-dialog-footer\"></ng-content>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-dialog{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;justify-content:center;position:fixed}.fd-dialog,.fd-dialog:before{height:100%;left:0;top:0;width:100%}.fd-dialog:before{background-color:var(--sapBlockLayer_Background);content:\"\";opacity:var(--fdDialog_Background_Opacity);position:absolute}.fd-dialog__content{-webkit-box-shadow:var(--sapContent_Shadow3);border-radius:var(--sapElement_BorderCornerRadius);box-shadow:var(--sapContent_Shadow3);display:flex;flex-direction:column;max-height:calc(100vh - 6%);max-width:calc(100vw - 10%);min-height:7.5rem;min-width:20rem;outline:none;overflow:hidden;position:absolute}.fd-dialog__body{-webkit-box-flex:1;-ms-flex-positive:1;background-color:var(--sapGroup_ContentBackground);flex-grow:1;overflow:auto}.fd-dialog__footer.fd-bar,.fd-dialog__header.fd-bar,.fd-dialog__subheader.fd-bar{flex-shrink:0;padding-left:1rem;padding-right:1rem}.fd-dialog__content--mobile{border-radius:0;height:100vh;max-height:100vh;max-width:100vw;width:100vw}/*!\n .fd-dialog+(--active)\n .fd-dialog__content+(--s, --m, --l, --xl, --draggable-grab, --draggable-grabbing, --mobile, --no-mobile-stretch)\n .fd-dialog__header\n .fd-dialog__title\n .fd-dialog__subheader\n .fd-dialog__body+(--no-vertical-padding, --no-horizontal-padding)\n .fd-dialog__loader\n .fd-dialog__footer\n .fd-dialog__decisive-button\n .fd-dialog__resize-handle\n*/.fd-dialog{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:none;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-dialog:after,.fd-dialog:before{box-sizing:inherit;font-size:inherit}.fd-dialog--active{display:flex}.fd-dialog__content{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-dialog__content:after,.fd-dialog__content:before{box-sizing:inherit;font-size:inherit}.fd-dialog__content--def .fd-dialog__body,.fd-dialog__content--def .fd-dialog__footer.fd-bar,.fd-dialog__content--def .fd-dialog__header.fd-bar,.fd-dialog__content--def .fd-dialog__subheader.fd-bar,.fd-dialog__content--s .fd-dialog__body,.fd-dialog__content--s .fd-dialog__footer.fd-bar,.fd-dialog__content--s .fd-dialog__header.fd-bar,.fd-dialog__content--s .fd-dialog__subheader.fd-bar{padding-left:1rem;padding-right:1rem}.fd-dialog__content--l .fd-dialog__body,.fd-dialog__content--l .fd-dialog__footer.fd-bar,.fd-dialog__content--l .fd-dialog__header.fd-bar,.fd-dialog__content--l .fd-dialog__subheader.fd-bar,.fd-dialog__content--m .fd-dialog__body,.fd-dialog__content--m .fd-dialog__footer.fd-bar,.fd-dialog__content--m .fd-dialog__header.fd-bar,.fd-dialog__content--m .fd-dialog__subheader.fd-bar{padding-left:2rem;padding-right:2rem}.fd-dialog__content--xl .fd-dialog__body,.fd-dialog__content--xl .fd-dialog__footer.fd-bar,.fd-dialog__content--xl .fd-dialog__header.fd-bar,.fd-dialog__content--xl .fd-dialog__subheader.fd-bar{padding-left:3rem;padding-right:3rem}.fd-dialog__content--mobile .fd-dialog__body,.fd-dialog__content--mobile .fd-dialog__footer,.fd-dialog__content--mobile .fd-dialog__header,.fd-dialog__content--mobile .fd-menu__item:first-child,.fd-dialog__content--mobile .fd-menu__item:first-child .fd-menu__link:after,.fd-dialog__content--mobile .fd-menu__item:last-child,.fd-dialog__content--mobile .fd-menu__item:last-child .fd-menu__link:after{border-radius:0}.fd-dialog__content--no-mobile-stretch{border-radius:var(--sapElement_BorderCornerRadius);max-height:calc(100vh - 6%);max-width:calc(100vw - 10%)}.fd-dialog__content--draggable-grab.is-hover .fd-dialog__header,.fd-dialog__content--draggable-grab:hover .fd-dialog__header{cursor:move;cursor:grab}.fd-dialog__content--draggable-grabbing.is-hover .fd-dialog__header,.fd-dialog__content--draggable-grabbing:hover .fd-dialog__header{cursor:move;cursor:grabbing}.fd-dialog__footer.fd-bar .fd-dialog__decisive-button,.fd-dialog__header.fd-bar .fd-dialog__decisive-button{justify-content:center;min-width:4rem}.fd-dialog__body{-webkit-box-sizing:border-box;border:0;border-radius:var(--sapElement_BorderCornerRadius);box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem 0;position:relative}.fd-dialog__body:after,.fd-dialog__body:before{box-sizing:inherit;font-size:inherit}.fd-dialog__body--no-vertical-padding{padding-bottom:0;padding-top:0}.fd-dialog__body--no-horizontal-padding{padding-left:0;padding-right:0}.fd-dialog__body:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.fd-dialog__body:not(:last-child){border-bottom-left-radius:0;border-bottom-right-radius:0}.fd-dialog__loader{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:1.5rem 0 .5rem;padding:0;text-align:center}.fd-dialog__loader:after,.fd-dialog__loader:before{box-sizing:inherit;font-size:inherit}.fd-dialog__resize-handle{-webkit-box-sizing:border-box;border:0;bottom:-.35rem;box-sizing:border-box;color:var(--sapTextColor);cursor:se-resize;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:1rem;font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;position:absolute;right:.05rem}.fd-dialog__resize-handle:after,.fd-dialog__resize-handle:before{box-sizing:inherit;font-size:inherit}.fd-dialog__resize-handle[dir=rtl],[dir=rtl] .fd-dialog__resize-handle{-webkit-transform:scaleX(-1);cursor:sw-resize;left:.05rem;right:auto;transform:scaleX(-1)}.fd-dialog__resize-handle:after{color:var(--sapButton_Lite_TextColor);content:\"\\e24f\";font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-dialog--no-backdrop:not(.fd-dialog--targeted){-webkit-transform:translate(-50%,-50%);left:50%;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:1000}.fd-dialog{z-index:999}.fd-dialog__resize-handle{z-index:1001;bottom:0;overflow:hidden}.fd-dialog__resize-handle:after{margin-bottom:-.125rem;display:block}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.ResizeDirective, selector: "[fdkResize], [fdResize], [fd-resize]", inputs: ["fdkResizeBoundary", "fdkResizeDisabled", "fdkResizeHandleLocation", "fdkResizeResizeHandleRef"], outputs: ["onResizeStart", "onResizeEnd"] }, { kind: "directive", type: i4$1.ResizeHandleDirective, selector: "[fdkResizeHandle], [fdResizeHandle], [fd-resize-handle]" }, { kind: "directive", type: i6.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i6.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i7.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i3$1.ScrollbarDirective, selector: "[fdScrollbar], [fd-scrollbar]", inputs: ["noHorizontalScroll", "noVerticalScroll", "alwaysVisible", "overrideTabindex"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
718
+ DialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponent, deps: [{ token: DialogConfig, optional: true }, { token: DialogRef, optional: true }, { token: i1$1.Router, optional: true }, { token: i4$1.RtlService, optional: true }, { token: i4$1.FocusTrapService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
719
+ DialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogComponent, selector: "fd-dialog", inputs: { class: "class", embeddedDialogRef: ["dialogRef", "embeddedDialogRef"], embeddedDialogConfig: ["dialogConfig", "embeddedDialogConfig"] }, host: { attributes: { "tabindex": "-1" } }, providers: [contentDensityObserverProviders({ alwaysAddModifiers: true })], queries: [{ propertyName: "dialogHeaderConfig", first: true, predicate: DialogHeaderComponent, descendants: true }, { propertyName: "dialogBodyConfig", first: true, predicate: DialogBodyComponent, descendants: true }, { propertyName: "dialogFooterConfig", first: true, predicate: DialogFooterComponent, descendants: true }, { propertyName: "dialogTitle", first: true, predicate: DialogTitleDirective, descendants: true }], viewQueries: [{ propertyName: "dialogWindow", first: true, predicate: ["dialogWindow"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n #dialogWindow\n role=\"dialog\"\n tabindex=\"-1\"\n aria-modal=\"true\"\n fdkResize\n cdkTrapFocus\n cdkDrag\n cdkDragBoundary=\".fd-dialog\"\n fd-scrollbar\n [fdkResizeBoundary]=\"elementRef.nativeElement\"\n class=\"fd-dialog__content\"\n [class]=\"dialogConfig.dialogPanelClass\"\n [class.cdk-drag]=\"dialogConfig.draggable\"\n [class.fd-dialog__content--s]=\"dialogPaddingSize === 'sm'\"\n [class.fd-dialog__content--m]=\"dialogPaddingSize === 'md'\"\n [class.fd-dialog__content--l]=\"dialogPaddingSize === 'lg'\"\n [class.fd-dialog__content--xl]=\"dialogPaddingSize === 'xl'\"\n [class.fd-dialog__content--mobile]=\"dialogConfig.mobile || dialogConfig.fullScreen\"\n [class.fd-dialog__content--no-mobile-stretch]=\"dialogConfig.mobileOuterSpacing\"\n [class.fd-dialog__content--draggable-grab]=\"dialogConfig.draggable && !isDragged\"\n [class.fd-dialog__content--draggable-grabbing]=\"dialogConfig.draggable && isDragged\"\n [cdkDragDisabled]=\"!dialogConfig.draggable\"\n [fdkResizeDisabled]=\"!dialogConfig.resizable\"\n [attr.id]=\"dialogConfig.id\"\n [attr.aria-label]=\"dialogConfig.ariaLabel\"\n [attr.aria-labelledby]=\"dialogConfig.ariaLabelledBy\"\n [attr.aria-describedby]=\"dialogConfig.ariaDescribedBy\"\n [attr.aria-modal]=\"dialogConfig.ariaModal\"\n (cdkDragStarted)=\"isDragged = true\"\n (cdkDragEnded)=\"isDragged = false\"\n (onResizeEnd)=\"adjustResponsivePadding()\"\n>\n <span fdkResizeHandle *ngIf=\"dialogConfig.resizable\" class=\"fd-dialog__resize-handle\"></span>\n\n <div cdkDragHandle [cdkDragHandleDisabled]=\"!dialogConfig.draggable\">\n <ng-content select=\"fd-dialog-header\"></ng-content>\n </div>\n\n <ng-content select=\"fd-dialog-body\"></ng-content>\n\n <ng-content select=\"fd-dialog-footer\"></ng-content>\n</div>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-dialog{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;justify-content:center;position:fixed}.fd-dialog,.fd-dialog:before{height:100%;left:0;top:0;width:100%}.fd-dialog:before{background-color:var(--sapBlockLayer_Background);content:\"\";opacity:var(--fdDialog_Background_Opacity);position:absolute}.fd-dialog__content{-webkit-box-shadow:var(--sapContent_Shadow3);border-radius:var(--sapElement_BorderCornerRadius);box-shadow:var(--sapContent_Shadow3);display:flex;flex-direction:column;max-height:calc(100vh - 6%);max-width:calc(100vw - 10%);min-height:7.5rem;min-width:20rem;outline:none;overflow:hidden;position:absolute}.fd-dialog__body{-webkit-box-flex:1;-ms-flex-positive:1;background-color:var(--sapGroup_ContentBackground);flex-grow:1;overflow:auto}.fd-dialog__footer.fd-bar,.fd-dialog__header.fd-bar,.fd-dialog__subheader.fd-bar{flex-shrink:0;padding-left:1rem;padding-right:1rem}.fd-dialog__content--mobile{border-radius:0;height:100vh;max-height:100vh;max-width:100vw;width:100vw}/*!\n .fd-dialog+(--active)\n .fd-dialog__content+(--s, --m, --l, --xl, --draggable-grab, --draggable-grabbing, --mobile, --no-mobile-stretch)\n .fd-dialog__header\n .fd-dialog__title\n .fd-dialog__subheader\n .fd-dialog__body+(--no-vertical-padding, --no-horizontal-padding)\n .fd-dialog__loader\n .fd-dialog__footer\n .fd-dialog__decisive-button\n .fd-dialog__resize-handle\n*/.fd-dialog{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:none;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-dialog:after,.fd-dialog:before{box-sizing:inherit;font-size:inherit}.fd-dialog--active{display:flex}.fd-dialog__content{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-dialog__content:after,.fd-dialog__content:before{box-sizing:inherit;font-size:inherit}.fd-dialog__content--def .fd-dialog__body,.fd-dialog__content--def .fd-dialog__footer.fd-bar,.fd-dialog__content--def .fd-dialog__header.fd-bar,.fd-dialog__content--def .fd-dialog__subheader.fd-bar,.fd-dialog__content--s .fd-dialog__body,.fd-dialog__content--s .fd-dialog__footer.fd-bar,.fd-dialog__content--s .fd-dialog__header.fd-bar,.fd-dialog__content--s .fd-dialog__subheader.fd-bar{padding-left:1rem;padding-right:1rem}.fd-dialog__content--l .fd-dialog__body,.fd-dialog__content--l .fd-dialog__footer.fd-bar,.fd-dialog__content--l .fd-dialog__header.fd-bar,.fd-dialog__content--l .fd-dialog__subheader.fd-bar,.fd-dialog__content--m .fd-dialog__body,.fd-dialog__content--m .fd-dialog__footer.fd-bar,.fd-dialog__content--m .fd-dialog__header.fd-bar,.fd-dialog__content--m .fd-dialog__subheader.fd-bar{padding-left:2rem;padding-right:2rem}.fd-dialog__content--xl .fd-dialog__body,.fd-dialog__content--xl .fd-dialog__footer.fd-bar,.fd-dialog__content--xl .fd-dialog__header.fd-bar,.fd-dialog__content--xl .fd-dialog__subheader.fd-bar{padding-left:3rem;padding-right:3rem}.fd-dialog__content--mobile .fd-dialog__body,.fd-dialog__content--mobile .fd-dialog__footer,.fd-dialog__content--mobile .fd-dialog__header,.fd-dialog__content--mobile .fd-menu__item:first-child,.fd-dialog__content--mobile .fd-menu__item:first-child .fd-menu__link:after,.fd-dialog__content--mobile .fd-menu__item:last-child,.fd-dialog__content--mobile .fd-menu__item:last-child .fd-menu__link:after{border-radius:0}.fd-dialog__content--no-mobile-stretch{border-radius:var(--sapElement_BorderCornerRadius);max-height:calc(100vh - 6%);max-width:calc(100vw - 10%)}.fd-dialog__content--draggable-grab.is-hover .fd-dialog__header,.fd-dialog__content--draggable-grab:hover .fd-dialog__header{cursor:move;cursor:grab}.fd-dialog__content--draggable-grabbing.is-hover .fd-dialog__header,.fd-dialog__content--draggable-grabbing:hover .fd-dialog__header{cursor:move;cursor:grabbing}.fd-dialog__footer.fd-bar .fd-dialog__decisive-button,.fd-dialog__header.fd-bar .fd-dialog__decisive-button{justify-content:center;min-width:4rem}.fd-dialog__body{-webkit-box-sizing:border-box;border:0;border-radius:var(--sapElement_BorderCornerRadius);box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:1rem 0;position:relative}.fd-dialog__body:after,.fd-dialog__body:before{box-sizing:inherit;font-size:inherit}.fd-dialog__body--no-vertical-padding{padding-bottom:0;padding-top:0}.fd-dialog__body--no-horizontal-padding{padding-left:0;padding-right:0}.fd-dialog__body:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.fd-dialog__body:not(:last-child){border-bottom-left-radius:0;border-bottom-right-radius:0}.fd-dialog__loader{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:1.5rem 0 .5rem;padding:0;text-align:center}.fd-dialog__loader:after,.fd-dialog__loader:before{box-sizing:inherit;font-size:inherit}.fd-dialog__resize-handle{-webkit-box-sizing:border-box;border:0;bottom:-.35rem;box-sizing:border-box;color:var(--sapTextColor);cursor:se-resize;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:1rem;font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;position:absolute;right:.05rem}.fd-dialog__resize-handle:after,.fd-dialog__resize-handle:before{box-sizing:inherit;font-size:inherit}.fd-dialog__resize-handle[dir=rtl],[dir=rtl] .fd-dialog__resize-handle{-webkit-transform:scaleX(-1);cursor:sw-resize;left:.05rem;right:auto;transform:scaleX(-1)}.fd-dialog__resize-handle:after{color:var(--sapButton_Lite_TextColor);content:\"\\e24f\";font-family:SAP-icons;text-align:center;text-decoration:inherit;text-rendering:optimizeLegibility;text-transform:none}.fd-dialog--no-backdrop:not(.fd-dialog--targeted){-webkit-transform:translate(-50%,-50%);left:50%;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:1000}.fd-dialog{z-index:999}.fd-dialog__resize-handle{z-index:1001;bottom:0;overflow:hidden}.fd-dialog__resize-handle:after{margin-bottom:-.125rem;display:block}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.ResizeDirective, selector: "[fdkResize], [fdResize], [fd-resize]", inputs: ["fdkResizeBoundary", "fdkResizeDisabled", "fdkResizeHandleLocation", "fdkResizeResizeHandleRef"], outputs: ["onResizeStart", "onResizeEnd"] }, { kind: "directive", type: i4$1.ResizeHandleDirective, selector: "[fdkResizeHandle], [fdResizeHandle], [fd-resize-handle]" }, { kind: "directive", type: i6.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i6.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i7.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i3.ScrollbarDirective, selector: "[fdScrollbar], [fd-scrollbar]", inputs: ["noHorizontalScroll", "noVerticalScroll", "alwaysVisible", "overrideTabindex"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
669
720
  __decorate([
670
721
  applyCssClass,
671
722
  __metadata("design:type", Function),
@@ -682,7 +733,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
682
733
  type: Optional
683
734
  }] }, { type: DialogRef, decorators: [{
684
735
  type: Optional
685
- }] }, { type: i1.Router, decorators: [{
736
+ }] }, { type: i1$1.Router, decorators: [{
686
737
  type: Optional
687
738
  }] }, { type: i4$1.RtlService, decorators: [{
688
739
  type: Optional
@@ -712,41 +763,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
712
763
  args: [DialogTitleDirective]
713
764
  }], buildComponentCssClass: [] } });
714
765
 
715
- /**
716
- * Directive that applies fundamental dialog styling to a dialog close button.
717
- *
718
- * ```html
719
- * <button fd-dialog-close-button></button>
720
- * ```
721
- */
722
- class DialogCloseButtonComponent {
723
- constructor() {
724
- /** Displays dialog close button in mobile mode */
725
- this.mobile = false;
726
- }
727
- }
728
- DialogCloseButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogCloseButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
729
- DialogCloseButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: { mobile: "mobile", title: "title" }, host: { properties: { "attr.aria-label": "\"close\"", "class.fd-button": "true", "class.is-compact": "!mobile", "class.fd-button--transparent": "true", "attr.title": "title" } }, ngImport: i0, template: `<fd-icon glyph="decline"></fd-icon><ng-content></ng-content>`, isInline: true, dependencies: [{ kind: "component", type: i1$1.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }] });
730
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogCloseButtonComponent, decorators: [{
731
- type: Component,
732
- args: [{
733
- // eslint-disable-next-line @angular-eslint/component-selector
734
- selector: '[fd-dialog-close-button]',
735
- host: {
736
- '[attr.aria-label]': '"close"',
737
- '[class.fd-button]': 'true',
738
- '[class.is-compact]': '!mobile',
739
- '[class.fd-button--transparent]': 'true',
740
- '[attr.title]': 'title'
741
- },
742
- template: `<fd-icon glyph="decline"></fd-icon><ng-content></ng-content>`
743
- }]
744
- }], propDecorators: { mobile: [{
745
- type: Input
746
- }], title: [{
747
- type: Input
748
- }] } });
749
-
750
766
  /** Dialog component used to create the dialog in object based approach */
751
767
  class DialogDefaultComponent {
752
768
  /** @hidden */
@@ -781,7 +797,7 @@ class DialogDefaultComponent {
781
797
  }
782
798
  }
783
799
  DialogDefaultComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogDefaultComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
784
- DialogDefaultComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogDefaultComponent, selector: "fd-dialog-default", ngImport: i0, template: "<fd-dialog>\n <fd-dialog-header>\n <h1 fd-title [id]=\"_defaultDialogContent?.titleId\">{{ _defaultDialogContent?.title }}</h1>\n <button\n fd-dialog-close-button\n *ngIf=\"_defaultDialogContent?.closeButtonCallback\"\n [title]=\"_defaultDialogContent?.closeButtonTitle || ''\"\n (click)=\"_closeButtonClicked()\"\n ></button>\n <ng-container *ngIf=\"_defaultDialogContent?.subHeader\">\n <ng-template fdkTemplate=\"subheader\">\n <ng-container *ngTemplateOutlet=\"_defaultDialogContent!.subHeader!\"></ng-container>\n </ng-template>\n </ng-container>\n </fd-dialog-header>\n\n <fd-dialog-body *ngIf=\"_defaultDialogContent?.content\">\n <ng-container *ngTemplateOutlet=\"_defaultDialogContent?.content!\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"_showFooter()\">\n <fd-button-bar\n *ngIf=\"_defaultDialogContent?.approveButton\"\n fdType=\"emphasized\"\n fdkInitialFocus\n [label]=\"_defaultDialogContent?.approveButton || ''\"\n [fdCozy]=\"_defaultDialogConfiguration.mobile\"\n (click)=\"_approveButtonClicked()\"\n [ariaLabel]=\"_defaultDialogContent?.approveButtonAriaLabel\"\n [id]=\"_defaultDialogContent?.approveButtonId\"\n >\n </fd-button-bar>\n <fd-button-bar\n *ngIf=\"_defaultDialogContent?.cancelButton\"\n [label]=\"_defaultDialogContent?.cancelButton || ''\"\n [fdCozy]=\"_defaultDialogConfiguration.mobile\"\n (click)=\"_cancelButtonClicked()\"\n [ariaLabel]=\"_defaultDialogContent?.closeButtonAriaLabel\"\n [id]=\"_defaultDialogContent?.cancelButtonId\"\n >\n </fd-button-bar>\n </fd-dialog-footer>\n</fd-dialog>\n", dependencies: [{ kind: "component", type: i2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "directive", type: i3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3$2.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4$1.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i4$1.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
800
+ DialogDefaultComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogDefaultComponent, selector: "fd-dialog-default", ngImport: i0, template: "<fd-dialog>\n <fd-dialog-header>\n <h1 fd-title [id]=\"_defaultDialogContent?.titleId\">{{ _defaultDialogContent?.title }}</h1>\n <button\n fd-dialog-close-button\n *ngIf=\"_defaultDialogContent?.closeButtonCallback\"\n [title]=\"_defaultDialogContent?.closeButtonTitle || ''\"\n (click)=\"_closeButtonClicked()\"\n ></button>\n <ng-container *ngIf=\"_defaultDialogContent?.subHeader\">\n <ng-template fdkTemplate=\"subheader\">\n <ng-container *ngTemplateOutlet=\"_defaultDialogContent!.subHeader!\"></ng-container>\n </ng-template>\n </ng-container>\n </fd-dialog-header>\n\n <fd-dialog-body *ngIf=\"_defaultDialogContent?.content\">\n <ng-container *ngTemplateOutlet=\"_defaultDialogContent?.content!\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"_showFooter()\">\n <fd-button-bar\n *ngIf=\"_defaultDialogContent?.approveButton\"\n fdType=\"emphasized\"\n fdkInitialFocus\n [label]=\"_defaultDialogContent?.approveButton || ''\"\n [fdCozy]=\"_defaultDialogConfiguration.mobile\"\n (click)=\"_approveButtonClicked()\"\n [ariaLabel]=\"_defaultDialogContent?.approveButtonAriaLabel\"\n [id]=\"_defaultDialogContent?.approveButtonId\"\n >\n </fd-button-bar>\n <fd-button-bar\n *ngIf=\"_defaultDialogContent?.cancelButton\"\n [label]=\"_defaultDialogContent?.cancelButton || ''\"\n [fdCozy]=\"_defaultDialogConfiguration.mobile\"\n (click)=\"_cancelButtonClicked()\"\n [ariaLabel]=\"_defaultDialogContent?.closeButtonAriaLabel\"\n [id]=\"_defaultDialogContent?.cancelButtonId\"\n >\n </fd-button-bar>\n </fd-dialog-footer>\n</fd-dialog>\n", dependencies: [{ kind: "component", type: i2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "directive", type: i3$1.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]), [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]), [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]), [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3$2.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4$1.TemplateDirective, selector: "[fdkTemplate], [fdTemplate]", inputs: ["fdkTemplate"] }, { kind: "directive", type: i4$1.InitialFocusDirective, selector: "[fdkInitialFocus], [fdInitialFocus], [fd-initial-focus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
785
801
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogDefaultComponent, decorators: [{
786
802
  type: Component,
787
803
  args: [{ selector: 'fd-dialog-default', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-dialog>\n <fd-dialog-header>\n <h1 fd-title [id]=\"_defaultDialogContent?.titleId\">{{ _defaultDialogContent?.title }}</h1>\n <button\n fd-dialog-close-button\n *ngIf=\"_defaultDialogContent?.closeButtonCallback\"\n [title]=\"_defaultDialogContent?.closeButtonTitle || ''\"\n (click)=\"_closeButtonClicked()\"\n ></button>\n <ng-container *ngIf=\"_defaultDialogContent?.subHeader\">\n <ng-template fdkTemplate=\"subheader\">\n <ng-container *ngTemplateOutlet=\"_defaultDialogContent!.subHeader!\"></ng-container>\n </ng-template>\n </ng-container>\n </fd-dialog-header>\n\n <fd-dialog-body *ngIf=\"_defaultDialogContent?.content\">\n <ng-container *ngTemplateOutlet=\"_defaultDialogContent?.content!\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"_showFooter()\">\n <fd-button-bar\n *ngIf=\"_defaultDialogContent?.approveButton\"\n fdType=\"emphasized\"\n fdkInitialFocus\n [label]=\"_defaultDialogContent?.approveButton || ''\"\n [fdCozy]=\"_defaultDialogConfiguration.mobile\"\n (click)=\"_approveButtonClicked()\"\n [ariaLabel]=\"_defaultDialogContent?.approveButtonAriaLabel\"\n [id]=\"_defaultDialogContent?.approveButtonId\"\n >\n </fd-button-bar>\n <fd-button-bar\n *ngIf=\"_defaultDialogContent?.cancelButton\"\n [label]=\"_defaultDialogContent?.cancelButton || ''\"\n [fdCozy]=\"_defaultDialogConfiguration.mobile\"\n (click)=\"_cancelButtonClicked()\"\n [ariaLabel]=\"_defaultDialogContent?.closeButtonAriaLabel\"\n [id]=\"_defaultDialogContent?.cancelButtonId\"\n >\n </fd-button-bar>\n </fd-dialog-footer>\n</fd-dialog>\n" }]
@@ -814,10 +830,10 @@ class DialogContainerComponent extends DynamicComponentContainer {
814
830
  this.buildComponentCssClass();
815
831
  }
816
832
  /** @hidden */
817
- constructor(dialogConfig, _dialogRef, _destroy$, elementRef, changeDetectorRef, injector) {
833
+ constructor(dialogConfig, ref, _destroy$, elementRef, changeDetectorRef, injector) {
818
834
  super(elementRef, injector, changeDetectorRef);
819
835
  this.dialogConfig = dialogConfig;
820
- this._dialogRef = _dialogRef;
836
+ this.ref = ref;
821
837
  this._destroy$ = _destroy$;
822
838
  /** The state of the Dialog animations. */
823
839
  this._animationState = 'void';
@@ -825,6 +841,18 @@ class DialogContainerComponent extends DynamicComponentContainer {
825
841
  this._class = '';
826
842
  }
827
843
  /** @hidden */
844
+ buildComponentCssClass() {
845
+ return [this.dialogConfig.containerClass ? this.dialogConfig.containerClass : '', this._class];
846
+ }
847
+ /** Handle end of animations, updating the state of the Message Toast. */
848
+ onAnimationEnd(event) {
849
+ const { toState } = event;
850
+ if (toState === 'hidden') {
851
+ this.ref._endClose$.next();
852
+ this.ref._endClose$.complete();
853
+ }
854
+ }
855
+ /** @hidden */
828
856
  ngAfterViewInit() {
829
857
  setTimeout(() => {
830
858
  this._loadContent();
@@ -838,15 +866,11 @@ class DialogContainerComponent extends DynamicComponentContainer {
838
866
  }
839
867
  }
840
868
  /** @hidden */
841
- buildComponentCssClass() {
842
- return [this.dialogConfig.containerClass ? this.dialogConfig.containerClass : '', this._class];
843
- }
844
- /** @hidden */
845
869
  _attached(event) {
846
- if (event instanceof (ComponentRef)) {
870
+ if (event instanceof ComponentRef) {
847
871
  event.changeDetectorRef.markForCheck();
848
872
  }
849
- else if (event instanceof (EmbeddedViewRef)) {
873
+ else if (event instanceof EmbeddedViewRef) {
850
874
  event.markForCheck();
851
875
  }
852
876
  }
@@ -866,7 +890,7 @@ class DialogContainerComponent extends DynamicComponentContainer {
866
890
  }
867
891
  /** @hidden Returns context for embedded template*/
868
892
  _templateContext() {
869
- return { $implicit: this._dialogRef, dialogConfig: this.dialogConfig };
893
+ return { $implicit: this.ref, dialogConfig: this.dialogConfig };
870
894
  }
871
895
  /** @hidden Load Dialog component from passed object */
872
896
  _createFromDefaultDialog(config) {
@@ -875,14 +899,6 @@ class DialogContainerComponent extends DynamicComponentContainer {
875
899
  instance._defaultDialogContent = config;
876
900
  instance._defaultDialogConfiguration = this.dialogConfig;
877
901
  }
878
- /** Handle end of animations, updating the state of the Message Toast. */
879
- onAnimationEnd(event) {
880
- const { toState } = event;
881
- if (toState === 'hidden') {
882
- this._dialogRef._endClose$.next();
883
- this._dialogRef._endClose$.complete();
884
- }
885
- }
886
902
  /**
887
903
  * @hidden
888
904
  * We need to wait until animation plays, and then send signal to the service to destroy the component.
@@ -892,7 +908,7 @@ class DialogContainerComponent extends DynamicComponentContainer {
892
908
  this._animationState = 'hidden';
893
909
  this._cdr.detectChanges();
894
910
  };
895
- this._dialogRef.afterClosed.pipe(takeUntil(this._destroy$)).subscribe({
911
+ this.ref.afterClosed.pipe(takeUntil(this._destroy$)).subscribe({
896
912
  next: () => callback(),
897
913
  error: () => callback()
898
914
  });
@@ -922,6 +938,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
922
938
  args: ['@state.done', ['$event']]
923
939
  }] } });
924
940
 
941
+ /* eslint-disable @typescript-eslint/member-ordering */
925
942
  /** Service used to dynamically generate a dialog. */
926
943
  class DialogBaseService {
927
944
  constructor() {
@@ -938,8 +955,12 @@ class DialogBaseService {
938
955
  return this._dialogs && this._dialogs.length > 0;
939
956
  }
940
957
  /** Dismisses all currently open dialogs. */
941
- dismissAll() {
942
- this._dialogs.forEach((item) => this._destroyDialog(item));
958
+ dismissAll(reason) {
959
+ this._dialogs.forEach((item) => {
960
+ item.instance.ref.dismiss(reason);
961
+ item.destroy();
962
+ });
963
+ this._dialogs = [];
943
964
  }
944
965
  /** @hidden */
945
966
  ngOnDestroy() {
@@ -1032,22 +1053,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1032
1053
  }] }, { type: i0.Injector }, { type: i2$1.Overlay }];
1033
1054
  } });
1034
1055
 
1035
- /**
1036
- * @deprecated
1037
- * Consider using `fd-button-bar`
1038
- */
1039
- class DialogFooterButtonComponent extends BarElementDirective {
1040
- }
1041
- DialogFooterButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogFooterButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
1042
- DialogFooterButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogFooterButtonComponent, selector: "fd-dialog-footer-button", usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
1043
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogFooterButtonComponent, decorators: [{
1044
- type: Component,
1045
- args: [{
1046
- selector: 'fd-dialog-footer-button',
1047
- template: '<ng-content></ng-content>'
1048
- }]
1049
- }] });
1050
-
1051
1056
  /**
1052
1057
  * @deprecated
1053
1058
  * Consider using `fd-button-bar`
@@ -1153,18 +1158,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1153
1158
  }]
1154
1159
  }] });
1155
1160
 
1156
- /**
1157
- * Represents the positioning of the dialog on the screen.
1158
- */
1159
- class DialogPosition {
1160
- }
1161
-
1162
1161
  class DialogContentBase {
1163
1162
  }
1164
1163
 
1165
1164
  class DialogDefaultContent extends DialogContentBase {
1166
1165
  }
1167
1166
 
1167
+ /**
1168
+ * Represents the positioning of the dialog on the screen.
1169
+ */
1170
+ class DialogPosition {
1171
+ }
1172
+
1168
1173
  class DialogOverlayContainer extends OverlayContainer {
1169
1174
  /**
1170
1175
  * This method returns the overlay container element. It will lazily