@fundamental-ngx/core 0.43.6 → 0.43.8

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 (83) hide show
  1. package/esm2020/combobox/combobox.component.mjs +1 -1
  2. package/esm2020/list/list-navigation-item/list-navigation-item.component.mjs +16 -12
  3. package/esm2020/list/list.component.mjs +22 -13
  4. package/esm2020/multi-combobox/multi-combobox.component.mjs +1 -1
  5. package/esm2020/multi-input/multi-input.component.mjs +80 -49
  6. package/esm2020/popover/index.mjs +12 -12
  7. package/esm2020/popover/popover-body/popover-body-directives/popover-body-footer.directive.mjs +4 -3
  8. package/esm2020/popover/popover-body/popover-body-directives/popover-body-header.directive.mjs +4 -3
  9. package/esm2020/popover/popover-body/popover-body.component.mjs +8 -11
  10. package/esm2020/popover/popover-body.directive.mjs +20 -0
  11. package/esm2020/popover/popover-container/popover-container.directive.mjs +4 -3
  12. package/esm2020/popover/popover-control/popover-control.component.mjs +3 -3
  13. package/esm2020/popover/popover-mobile/popover-mobile.component.mjs +10 -7
  14. package/esm2020/popover/popover-mobile/popover-mobile.module.mjs +4 -5
  15. package/esm2020/popover/popover-service/popover.service.mjs +20 -14
  16. package/esm2020/popover/popover-trigger.directive.mjs +4 -3
  17. package/esm2020/popover/popover.component.mjs +29 -16
  18. package/esm2020/popover/popover.module.mjs +20 -18
  19. package/esm2020/select/select.component.mjs +1 -1
  20. package/esm2020/table/directives/table-row.directive.mjs +6 -3
  21. package/esm2020/token/tokenizer.component.mjs +1 -1
  22. package/esm2020/upload-collection/upload-collection.component.mjs +1 -1
  23. package/esm2020/vertical-navigation/vertical-navigation.component.mjs +1 -1
  24. package/fesm2015/fundamental-ngx-core-combobox.mjs +1 -1
  25. package/fesm2015/fundamental-ngx-core-combobox.mjs.map +1 -1
  26. package/fesm2015/fundamental-ngx-core-list.mjs +76 -63
  27. package/fesm2015/fundamental-ngx-core-list.mjs.map +1 -1
  28. package/fesm2015/fundamental-ngx-core-multi-combobox.mjs +1 -1
  29. package/fesm2015/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
  30. package/fesm2015/fundamental-ngx-core-multi-input.mjs +83 -53
  31. package/fesm2015/fundamental-ngx-core-multi-input.mjs.map +1 -1
  32. package/fesm2015/fundamental-ngx-core-popover.mjs +440 -399
  33. package/fesm2015/fundamental-ngx-core-popover.mjs.map +1 -1
  34. package/fesm2015/fundamental-ngx-core-select.mjs +1 -1
  35. package/fesm2015/fundamental-ngx-core-select.mjs.map +1 -1
  36. package/fesm2015/fundamental-ngx-core-table.mjs +5 -2
  37. package/fesm2015/fundamental-ngx-core-table.mjs.map +1 -1
  38. package/fesm2015/fundamental-ngx-core-token.mjs +1 -1
  39. package/fesm2015/fundamental-ngx-core-token.mjs.map +1 -1
  40. package/fesm2015/fundamental-ngx-core-upload-collection.mjs +1 -1
  41. package/fesm2015/fundamental-ngx-core-upload-collection.mjs.map +1 -1
  42. package/fesm2015/fundamental-ngx-core-vertical-navigation.mjs +1 -1
  43. package/fesm2015/fundamental-ngx-core-vertical-navigation.mjs.map +1 -1
  44. package/fesm2020/fundamental-ngx-core-combobox.mjs +1 -1
  45. package/fesm2020/fundamental-ngx-core-combobox.mjs.map +1 -1
  46. package/fesm2020/fundamental-ngx-core-list.mjs +76 -63
  47. package/fesm2020/fundamental-ngx-core-list.mjs.map +1 -1
  48. package/fesm2020/fundamental-ngx-core-multi-combobox.mjs +1 -1
  49. package/fesm2020/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
  50. package/fesm2020/fundamental-ngx-core-multi-input.mjs +82 -52
  51. package/fesm2020/fundamental-ngx-core-multi-input.mjs.map +1 -1
  52. package/fesm2020/fundamental-ngx-core-popover.mjs +449 -408
  53. package/fesm2020/fundamental-ngx-core-popover.mjs.map +1 -1
  54. package/fesm2020/fundamental-ngx-core-select.mjs +1 -1
  55. package/fesm2020/fundamental-ngx-core-select.mjs.map +1 -1
  56. package/fesm2020/fundamental-ngx-core-table.mjs +5 -2
  57. package/fesm2020/fundamental-ngx-core-table.mjs.map +1 -1
  58. package/fesm2020/fundamental-ngx-core-token.mjs +1 -1
  59. package/fesm2020/fundamental-ngx-core-token.mjs.map +1 -1
  60. package/fesm2020/fundamental-ngx-core-upload-collection.mjs +1 -1
  61. package/fesm2020/fundamental-ngx-core-upload-collection.mjs.map +1 -1
  62. package/fesm2020/fundamental-ngx-core-vertical-navigation.mjs +1 -1
  63. package/fesm2020/fundamental-ngx-core-vertical-navigation.mjs.map +1 -1
  64. package/fundamental-ngx-core-v0.43.8.tgz +0 -0
  65. package/list/list-navigation-item/list-navigation-item.component.d.ts +8 -6
  66. package/list/list.component.d.ts +15 -6
  67. package/multi-input/multi-input.component.d.ts +48 -39
  68. package/package.json +3 -3
  69. package/popover/index.d.ts +11 -11
  70. package/popover/popover-body/popover-body-directives/popover-body-footer.directive.d.ts +1 -1
  71. package/popover/popover-body/popover-body-directives/popover-body-header.directive.d.ts +1 -1
  72. package/popover/popover-body/popover-body.component.d.ts +1 -1
  73. package/popover/popover-body.directive.d.ts +10 -0
  74. package/popover/popover-container/popover-container.directive.d.ts +1 -1
  75. package/popover/popover-control/popover-control.component.d.ts +1 -1
  76. package/popover/popover-mobile/popover-mobile.component.d.ts +3 -3
  77. package/popover/popover-mobile/popover-mobile.module.d.ts +5 -5
  78. package/popover/popover-service/popover.service.d.ts +6 -4
  79. package/popover/popover-trigger.directive.d.ts +1 -1
  80. package/popover/popover.component.d.ts +9 -2
  81. package/popover/popover.module.d.ts +2 -5
  82. package/schematics/add-dependencies/index.js +4 -4
  83. package/fundamental-ngx-core-v0.43.6.tgz +0 -0
@@ -1,224 +1,28 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, HostListener, Directive, HostBinding, EventEmitter, Input, Output, ElementRef, Injectable, Optional, InjectionToken, Inject, NgModule, Injector, TemplateRef, ViewContainerRef, ContentChild } from '@angular/core';
3
- import * as i2 from '@angular/common';
4
- import { CommonModule } from '@angular/common';
2
+ import { EventEmitter, Directive, Input, HostBinding, Output, inject, TemplateRef, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, HostListener, InjectionToken, Inject, Optional, NgModule, ElementRef, Injectable, Injector, ViewContainerRef, ContentChild } from '@angular/core';
3
+ import * as i1$2 from '@angular/cdk/overlay';
4
+ import { CdkScrollable, OverlayConfig, CdkOverlayOrigin } from '@angular/cdk/overlay';
5
5
  import { ESCAPE, SPACE, ENTER, DOWN_ARROW } from '@angular/cdk/keycodes';
6
- import * as i3 from '@angular/cdk/a11y';
6
+ import * as i2 from '@angular/cdk/a11y';
7
7
  import { CdkTrapFocus, A11yModule } from '@angular/cdk/a11y';
8
- import { Subject, merge, Subscription } from 'rxjs';
9
- import * as i2$1 from '@fundamental-ngx/cdk/utils';
10
- import { KeyUtil, resizeObservable, isOdd, DynamicComponentService } from '@fundamental-ngx/cdk/utils';
8
+ import { Subject, Subscription, merge } from 'rxjs';
9
+ import * as i2$2 from '@fundamental-ngx/cdk/utils';
10
+ import { KeyUtil, resizeObservable, DynamicComponentService, isOdd } from '@fundamental-ngx/cdk/utils';
11
11
  import * as i1 from '@fundamental-ngx/core/content-density';
12
12
  import { contentDensityObserverProviders } from '@fundamental-ngx/core/content-density';
13
- import * as i4 from '@fundamental-ngx/core/scrollbar';
14
- import { ScrollbarDirective, ScrollbarModule } from '@fundamental-ngx/core/scrollbar';
15
- import * as i1$1 from '@angular/cdk/overlay';
16
- import { OverlayConfig, CdkOverlayOrigin, OverlayModule } from '@angular/cdk/overlay';
17
- import { __awaiter } from 'tslib';
18
- import equal from 'fast-deep-equal';
19
- import { TemplatePortal, ComponentPortal } from '@angular/cdk/portal';
13
+ import { ScrollbarDirective } from '@fundamental-ngx/core/scrollbar';
14
+ import { NgIf, NgTemplateOutlet, CommonModule } from '@angular/common';
20
15
  import { takeUntil, startWith, filter, distinctUntilChanged } from 'rxjs/operators';
21
- import { GetDefaultPosition, PopoverPosition } from '@fundamental-ngx/core/shared';
22
16
  import { MobileModeBase, MobileModeControl, MOBILE_MODE_CONFIG } from '@fundamental-ngx/core/mobile-mode';
23
- import * as i1$2 from '@fundamental-ngx/core/dialog';
17
+ import * as i1$1 from '@fundamental-ngx/core/dialog';
24
18
  import { DialogModule } from '@fundamental-ngx/core/dialog';
25
- import * as i3$1 from '@fundamental-ngx/core/title';
19
+ import * as i2$1 from '@fundamental-ngx/core/title';
20
+ import { TitleModule } from '@fundamental-ngx/core/title';
26
21
  import { ButtonModule } from '@fundamental-ngx/core/button';
27
-
28
- /**
29
- * A component used to enforce a certain layout for the popover.
30
- * ```html
31
- * <fd-popover>
32
- * <fd-popover-control>Control Element</fd-popover-control>
33
- * <fd-popover-body>Popover Body</fd-popover-body>
34
- * </fd-popover>
35
- * ```
36
- */
37
- class PopoverControlComponent {
38
- /** @hidden */
39
- constructor(elRef) {
40
- this.elRef = elRef;
41
- /** @hidden */
42
- this._tabbable = false;
43
- }
44
- /** @hidden */
45
- ngAfterContentChecked() {
46
- if (this._tabbable) {
47
- this.makeTabbable();
48
- }
49
- }
50
- /** @hidden */
51
- makeTabbable() {
52
- const elemChild = this.elRef.nativeElement.children[0];
53
- if (elemChild && elemChild.getAttribute('tabindex') !== '-1') {
54
- elemChild.tabIndex = '0';
55
- }
56
- }
57
- }
58
- PopoverControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverControlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
59
- PopoverControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverControlComponent, selector: "fd-popover-control", ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
60
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverControlComponent, decorators: [{
61
- type: Component,
62
- args: [{ selector: 'fd-popover-control', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
63
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
64
-
65
- /**
66
- * A component used to enforce a certain layout for the popover.
67
- * ```html
68
- * <fd-popover>
69
- * <fd-popover-control>Control Element</fd-popover-control>
70
- * <fd-popover-body>Popover Body</fd-popover-body>
71
- * </fd-popover>
72
- * ```
73
- */
74
- class PopoverBodyComponent {
75
- /** Handler escape keydown */
76
- bodyKeyupHandler(event) {
77
- if (KeyUtil.isKeyCode(event, ESCAPE) && this._closeOnEscapeKey) {
78
- // In case if popover belongs to the element inside dialog
79
- event.stopPropagation();
80
- this.onClose.next();
81
- }
82
- }
83
- /** @hidden */
84
- constructor(_elementRef, _changeDetectorRef, _contentDensityObserver) {
85
- this._elementRef = _elementRef;
86
- this._changeDetectorRef = _changeDetectorRef;
87
- this._contentDensityObserver = _contentDensityObserver;
88
- /** Whether to wrap content with fd-scrollbar directive. */
89
- this._disableScrollbar = false;
90
- /** Should fd-scrollbar have tabindex*/
91
- this._tabbableScrollbar = true;
92
- /** Whether the popover should have an arrow. */
93
- this._noArrow = true;
94
- /** Whether the popover should be focusTrapped. */
95
- this._focusTrapped = false;
96
- /**
97
- * Whether the popover should automatically move focus into the trapped region upon
98
- * initialization and return focus to the previous activeElement upon destruction.
99
- */
100
- this._focusAutoCapture = false;
101
- /** @hidden Property bind to popover's body */
102
- this._closeOnEscapeKey = false;
103
- /** @hidden Aria role for the popover body */
104
- this._bodyRole = null;
105
- /** @hidden Aria role for the popover body */
106
- this._bodyId = null;
107
- /** Classes added to arrow element */
108
- this._arrowClasses = '';
109
- /** Additional style to put margin into body component, to give a place for arrow */
110
- this._marginStyle = null;
111
- /** @hidden text rendered inside popover's body */
112
- this.text = null;
113
- /** Close event from popover body */
114
- this.onClose = new Subject();
115
- }
116
- /** @hidden */
117
- ngAfterViewInit() {
118
- if (this._scrollbar) {
119
- this._scrollbar._inPopover = true;
120
- }
121
- }
122
- /** @hidden */
123
- _setArrowStyles(position, rtl) {
124
- if (this._noArrow) {
125
- this._arrowClasses = '';
126
- return;
127
- }
128
- if (position.overlayY !== position.originY &&
129
- position.originY !== 'center' &&
130
- position.overlayY !== 'center' &&
131
- position.overlayX === position.originX) {
132
- this._arrowClasses =
133
- `fd-popover__body--${position.overlayY === 'top' ? 'below' : 'above'}` +
134
- ` fd-popover__body--arrow-${position.overlayY}` +
135
- ` fd-popover__body--arrow-x-${position.originX} `;
136
- }
137
- else if (position.overlayX !== position.originX &&
138
- position.overlayX !== 'center' &&
139
- position.originX !== 'center' &&
140
- position.originY === position.overlayY) {
141
- let overlayX = position.overlayX;
142
- if (rtl === 'rtl') {
143
- overlayX = position.overlayX === 'end' ? 'start' : 'end';
144
- }
145
- // TODO: Remove after new fundamental-styles version release.
146
- const originY = position.originY === 'bottom' ? 'end' : position.originY;
147
- // End TODO
148
- this._arrowClasses =
149
- `fd-popover__body--${overlayX === 'start' ? 'after' : 'before'}` +
150
- ` fd-popover__body--arrow-${overlayX === 'start' ? 'left' : 'right'}` +
151
- ` fd-popover__body--arrow-y-${originY} `;
152
- }
153
- else {
154
- this._arrowClasses = 'fd-popover__body--no-arrow';
155
- }
156
- this.detectChanges();
157
- }
158
- /** @hidden */
159
- detectChanges() {
160
- if (!this._changeDetectorRef['destroyed']) {
161
- this._changeDetectorRef.detectChanges();
162
- }
163
- }
164
- /** @hidden */
165
- _focusFirstTabbableElement() {
166
- if (this._focusAutoCapture) {
167
- this._cdkTrapFocus.focusTrap.focusFirstTabbableElement();
168
- }
169
- }
170
- }
171
- PopoverBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component });
172
- PopoverBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyComponent, selector: "fd-popover-body", host: { listeners: { "keyup": "bodyKeyupHandler($event)" } }, providers: [contentDensityObserverProviders({ alwaysAddModifiers: true })], viewQueries: [{ propertyName: "_cdkTrapFocus", first: true, predicate: CdkTrapFocus, descendants: true }, { propertyName: "_scrollbar", first: true, predicate: ScrollbarDirective, descendants: true }], ngImport: i0, template: "<div\n class=\"fd-popover__body fd-popover__body--static\"\n [class.fd-popover__body--no-arrow]=\"_noArrow\"\n [class]=\"_arrowClasses + (_additionalBodyClass || '')\"\n [cdkTrapFocus]=\"_focusTrapped\"\n [style]=\"_marginStyle\"\n [style.max-width.px]=\"_maxWidth\"\n [style.min-width.px]=\"_popoverBodyMinWidth\"\n [style.width.px]=\"_popoverBodyWidth\"\n [attr.role]=\"_bodyRole\"\n [attr.id]=\"_bodyId\"\n>\n <div\n fd-scrollbar\n class=\"fd-popover__wrapper\"\n [overrideTabindex]=\"_tabbableScrollbar\"\n *ngIf=\"!_disableScrollbar; else renderer\"\n >\n <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n </div>\n</div>\n\n<ng-template #renderer>\n <ng-content select=\"[fd-popover-body-header]\"></ng-content>\n\n <ng-content select=\"[fd-popover-body-subheader]\"></ng-content>\n\n <ng-content></ng-content>\n\n {{ text }}\n\n <ng-container *ngTemplateOutlet=\"_templateToDisplay\"></ng-container>\n\n <ng-content select=\"[fd-popover-body-footer]\"></ng-content>\n</ng-template>\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-popover{-webkit-box-sizing:border-box;--fdPopover_Offset:100%;--fdPopover_Center_Offset:50%;border:0;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;max-width:100%;padding:0;position:relative}.fd-popover:after,.fd-popover:before{box-sizing:inherit;font-size:inherit}.fd-popover__control{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-popover__control:after,.fd-popover__control:before{box-sizing:inherit;font-size:inherit}.fd-popover__control:focus-visible{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor)}.fd-popover__control.is-expanded>*,.fd-popover__control[aria-expanded=true]>*{margin-bottom:0}.fd-popover__control.is-expanded+.fd-popover__body--input-message-group,.fd-popover__control[aria-expanded=true]+.fd-popover__body--input-message-group{margin-top:0}.fd-popover__control.is-disabled,.fd-popover__control:disabled,.fd-popover__control[aria-disabled=true]{pointer-events:none}.fd-popover__wrapper{border-radius:var(--fdPopover_Border_Radius);overflow:auto;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color)}.fd-popover__wrapper.is-focus,.fd-popover__wrapper:focus{outline:none;z-index:5}.fd-popover__wrapper::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb:active,.fd-popover__wrapper::-webkit-scrollbar-thumb:hover{box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{border-radius:0 var(--fdScrollbar_Border_Radius) var(--fdScrollbar_Border_Radius) 0}.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-corner,.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-track,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-corner,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-track{border-radius:var(--fdScrollbar_Border_Radius) 0 0 var(--fdScrollbar_Border_Radius)}.fd-popover__wrapper--visible{overflow:visible!important}.fd-popover__body{--fdIcon_Button_Height:2.25rem;--fdIcon_Button_Width:2.25rem;-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapContent_Shadow2);-webkit-transition:all .125s;background:var(--sapGroup_ContentBackground);border:0;border-radius:var(--fdPopover_Border_Radius);box-shadow:var(--sapContent_Shadow2);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;opacity:1;padding:0;position:absolute;top:calc(var(--fdPopover_Offset) + .5rem);transition:all .125s;visibility:visible;white-space:nowrap;z-index:1000}.fd-popover__body:after,.fd-popover__body:before{box-sizing:inherit;content:\"\";font-size:inherit;position:absolute}.fd-popover__body:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(-.5rem + var(--fdPopover_Border_Width));z-index:1002}.fd-popover__body:after,.fd-popover__body:before{border-top:none;display:inline-block;height:0;width:0}.fd-popover__body:after{border-bottom:.5rem solid var(--fdPopover_Border_Color);border-left:.5rem solid transparent;border-right:.5rem solid transparent;top:-.5rem;z-index:1001}.fd-popover__body>:not(.fd-popover__wrapper){overflow:hidden}.fd-popover__body ol:first-child li:first-child a:before,.fd-popover__body ol:first-child li:first-child:before,.fd-popover__body ul:first-child li:first-child a:before,.fd-popover__body ul:first-child li:first-child:before,.fd-popover__body-header>:first-child,.fd-popover__body>:first-child{border-top-left-radius:var(--fdPopover_Border_Radius);border-top-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body ol:last-child li:last-child a:before,.fd-popover__body ol:last-child li:last-child:before,.fd-popover__body ul:last-child li:last-child a:before,.fd-popover__body ul:last-child li:last-child:before,.fd-popover__body-footer>:last-child,.fd-popover__body>:last-child{border-bottom-left-radius:var(--fdPopover_Border_Radius);border-bottom-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body[class*=-compact],.fd-popover__body[class*=-condensed],[class*=-compact] .fd-popover__body:not([class*=-cozy]),[class*=-condensed] .fd-popover__body:not([class*=-cozy]){--fdIcon_Button_Height:1.625rem;--fdIcon_Button_Width:2rem}.fd-popover__body--no-arrow{box-shadow:var(--sapContent_Shadow1);top:var(--fdPopover_Offset)}.fd-popover__body--no-arrow:after,.fd-popover__body--no-arrow:before{display:none}.fd-popover__body,.fd-popover__body--left{left:0}.fd-popover__body--left[dir=rtl],.fd-popover__body[dir=rtl],[dir=rtl] .fd-popover__body,[dir=rtl] .fd-popover__body--left{left:auto;right:0}.fd-popover__body--left:before,.fd-popover__body:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left:after,.fd-popover__body:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:before,.fd-popover__body[dir=rtl]:before,[dir=rtl] .fd-popover__body--left:before,[dir=rtl] .fd-popover__body:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:after,.fd-popover__body[dir=rtl]:after,[dir=rtl] .fd-popover__body--left:after,[dir=rtl] .fd-popover__body:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--center{-webkit-transform:translateX(calc(var(--fdPopover_Center_Offset) * -1));left:var(--fdPopover_Center_Offset);transform:translate(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--center[dir=rtl],[dir=rtl] .fd-popover__body--center{-webkit-transform:translateX(var(--fdPopover_Center_Offset));left:auto;right:var(--fdPopover_Center_Offset);transform:translate(var(--fdPopover_Center_Offset))}.fd-popover__body--right{left:auto;right:0}.fd-popover__body--right[dir=rtl],[dir=rtl] .fd-popover__body--right{left:0;right:auto}.fd-popover__body--right:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--right:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--right[dir=rtl]:before,[dir=rtl] .fd-popover__body--right:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--right[dir=rtl]:after,[dir=rtl] .fd-popover__body--right:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--before{left:auto!important;right:var(--fdPopover_Offset)!important;top:0}.fd-popover__body--after{left:var(--fdPopover_Offset)!important;right:auto!important;top:0}.fd-popover__body--middle{-webkit-transform:translateY(calc(var(--fdPopover_Center_Offset) * -1));top:var(--fdPopover_Center_Offset);transform:translateY(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--bottom{bottom:0;top:auto}.fd-popover__body--above{bottom:var(--fdPopover_Offset);top:auto}.fd-popover__body--arrow-bottom{bottom:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-bottom:before{border-bottom:none;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-bottom:after{border-bottom:none;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-top:.5rem solid var(--fdPopover_Border_Color);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-left{left:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-left:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-left:after,.fd-popover__body--arrow-left:before{border-left:none;display:inline-block;height:0;left:auto!important;right:100%!important;width:0}.fd-popover__body--arrow-left:after{border-bottom:.5rem solid transparent;border-right:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right{right:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-right:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right:after,.fd-popover__body--arrow-right:before{border-right:none;display:inline-block;height:0;left:100%!important;right:auto!important;width:0}.fd-popover__body--arrow-right:after{border-bottom:.5rem solid transparent;border-left:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-center:after,.fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(-50%);left:50%;transform:translate(-50%)}.fd-popover__body--arrow-x-center[dir=rtl]:after,.fd-popover__body--arrow-x-center[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-center:after,[dir=rtl] .fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(50%);left:auto;right:50%;transform:translate(50%)}.fd-popover__body--arrow-x-end:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-end:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-x-end[dir=rtl]:after,[dir=rtl] .fd-popover__body--arrow-x-end:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-y-center:after,.fd-popover__body--arrow-y-center:before{-webkit-transform:translateY(-50%);top:50%;transform:translateY(-50%)}.fd-popover__body--arrow-y-end:before{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));top:auto}.fd-popover__body--arrow-y-end:after{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width));top:auto}.fd-popover__body--dropdown{width:max-content}.fd-popover__body--dropdown-fill{display:block;max-width:40rem;width:calc(100% - var(--sapGroup_BorderWidth) * 2)}.fd-popover__body--static{--fdPopover_Offset:0%;--fdPopover_Center_Offset:0%;position:relative}.fd-popover__body.is-hidden,.fd-popover__body[aria-hidden=true]{opacity:0;visibility:hidden;z-index:-1}.fd-popover__body .fd-popover__body--hidden{display:none}.fd-popover__body--input-message-group{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover__body--inline-help{font-size:var(--sapFontSmallSize);padding:.75rem}.fd-popover__body--inline-help-icon{--fdIcon_Button_Height:1.375rem;--fdIcon_Button_Width:1.375rem}.fd-popover--input-message-group .fd-popover__body,.fd-popover--input-message-group .fd-popover__body--no-arrow{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover--full-width{width:100%}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}fd-popover-body{max-width:100%;max-height:100%}.fd-popover-custom{display:inline-block;max-width:100%}.fd-popover-custom--disabled .fd-popover__control{cursor:auto}.fd-popover__body{max-height:100%;max-width:100%;display:flex}.fd-popover__body--hidden{display:none!important}.fd-popover__body.fd-form-message:before{width:auto;height:auto;position:relative;inset:0;border:none}.fd-popover__body>.fd-scrollbar{max-height:100%;max-width:100%;width:100%;border-radius:inherit}.fd-popover__body .fd-list{border-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list{border-bottom:none}.fd-popover__body .fd-nested-list__item:first-child .fd-nested-list__content{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__item:last-child .fd-nested-list__link{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content.is-selected{border-bottom-right-radius:0;border-bottom-left-radius:0}.fd-popover__body .fd-side-nav,.fd-popover__body .fd-nested-list__item{border-right:none}.fd-popover__body .fd-side-nav:first-child,.fd-popover__body .fd-nested-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-side-nav:last-child,.fd-popover__body .fd-nested-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.cdk-overlay-container{z-index:1002}.cdk-overlay-pane{max-width:100%;max-height:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i4.ScrollbarDirective, selector: "[fdScrollbar], [fd-scrollbar]", inputs: ["noHorizontalScroll", "noVerticalScroll", "alwaysVisible", "overrideTabindex"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
173
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyComponent, decorators: [{
174
- type: Component,
175
- args: [{ selector: 'fd-popover-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders({ alwaysAddModifiers: true })], template: "<div\n class=\"fd-popover__body fd-popover__body--static\"\n [class.fd-popover__body--no-arrow]=\"_noArrow\"\n [class]=\"_arrowClasses + (_additionalBodyClass || '')\"\n [cdkTrapFocus]=\"_focusTrapped\"\n [style]=\"_marginStyle\"\n [style.max-width.px]=\"_maxWidth\"\n [style.min-width.px]=\"_popoverBodyMinWidth\"\n [style.width.px]=\"_popoverBodyWidth\"\n [attr.role]=\"_bodyRole\"\n [attr.id]=\"_bodyId\"\n>\n <div\n fd-scrollbar\n class=\"fd-popover__wrapper\"\n [overrideTabindex]=\"_tabbableScrollbar\"\n *ngIf=\"!_disableScrollbar; else renderer\"\n >\n <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n </div>\n</div>\n\n<ng-template #renderer>\n <ng-content select=\"[fd-popover-body-header]\"></ng-content>\n\n <ng-content select=\"[fd-popover-body-subheader]\"></ng-content>\n\n <ng-content></ng-content>\n\n {{ text }}\n\n <ng-container *ngTemplateOutlet=\"_templateToDisplay\"></ng-container>\n\n <ng-content select=\"[fd-popover-body-footer]\"></ng-content>\n</ng-template>\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-popover{-webkit-box-sizing:border-box;--fdPopover_Offset:100%;--fdPopover_Center_Offset:50%;border:0;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;max-width:100%;padding:0;position:relative}.fd-popover:after,.fd-popover:before{box-sizing:inherit;font-size:inherit}.fd-popover__control{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-popover__control:after,.fd-popover__control:before{box-sizing:inherit;font-size:inherit}.fd-popover__control:focus-visible{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor)}.fd-popover__control.is-expanded>*,.fd-popover__control[aria-expanded=true]>*{margin-bottom:0}.fd-popover__control.is-expanded+.fd-popover__body--input-message-group,.fd-popover__control[aria-expanded=true]+.fd-popover__body--input-message-group{margin-top:0}.fd-popover__control.is-disabled,.fd-popover__control:disabled,.fd-popover__control[aria-disabled=true]{pointer-events:none}.fd-popover__wrapper{border-radius:var(--fdPopover_Border_Radius);overflow:auto;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color)}.fd-popover__wrapper.is-focus,.fd-popover__wrapper:focus{outline:none;z-index:5}.fd-popover__wrapper::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb:active,.fd-popover__wrapper::-webkit-scrollbar-thumb:hover{box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{border-radius:0 var(--fdScrollbar_Border_Radius) var(--fdScrollbar_Border_Radius) 0}.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-corner,.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-track,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-corner,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-track{border-radius:var(--fdScrollbar_Border_Radius) 0 0 var(--fdScrollbar_Border_Radius)}.fd-popover__wrapper--visible{overflow:visible!important}.fd-popover__body{--fdIcon_Button_Height:2.25rem;--fdIcon_Button_Width:2.25rem;-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapContent_Shadow2);-webkit-transition:all .125s;background:var(--sapGroup_ContentBackground);border:0;border-radius:var(--fdPopover_Border_Radius);box-shadow:var(--sapContent_Shadow2);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;opacity:1;padding:0;position:absolute;top:calc(var(--fdPopover_Offset) + .5rem);transition:all .125s;visibility:visible;white-space:nowrap;z-index:1000}.fd-popover__body:after,.fd-popover__body:before{box-sizing:inherit;content:\"\";font-size:inherit;position:absolute}.fd-popover__body:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(-.5rem + var(--fdPopover_Border_Width));z-index:1002}.fd-popover__body:after,.fd-popover__body:before{border-top:none;display:inline-block;height:0;width:0}.fd-popover__body:after{border-bottom:.5rem solid var(--fdPopover_Border_Color);border-left:.5rem solid transparent;border-right:.5rem solid transparent;top:-.5rem;z-index:1001}.fd-popover__body>:not(.fd-popover__wrapper){overflow:hidden}.fd-popover__body ol:first-child li:first-child a:before,.fd-popover__body ol:first-child li:first-child:before,.fd-popover__body ul:first-child li:first-child a:before,.fd-popover__body ul:first-child li:first-child:before,.fd-popover__body-header>:first-child,.fd-popover__body>:first-child{border-top-left-radius:var(--fdPopover_Border_Radius);border-top-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body ol:last-child li:last-child a:before,.fd-popover__body ol:last-child li:last-child:before,.fd-popover__body ul:last-child li:last-child a:before,.fd-popover__body ul:last-child li:last-child:before,.fd-popover__body-footer>:last-child,.fd-popover__body>:last-child{border-bottom-left-radius:var(--fdPopover_Border_Radius);border-bottom-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body[class*=-compact],.fd-popover__body[class*=-condensed],[class*=-compact] .fd-popover__body:not([class*=-cozy]),[class*=-condensed] .fd-popover__body:not([class*=-cozy]){--fdIcon_Button_Height:1.625rem;--fdIcon_Button_Width:2rem}.fd-popover__body--no-arrow{box-shadow:var(--sapContent_Shadow1);top:var(--fdPopover_Offset)}.fd-popover__body--no-arrow:after,.fd-popover__body--no-arrow:before{display:none}.fd-popover__body,.fd-popover__body--left{left:0}.fd-popover__body--left[dir=rtl],.fd-popover__body[dir=rtl],[dir=rtl] .fd-popover__body,[dir=rtl] .fd-popover__body--left{left:auto;right:0}.fd-popover__body--left:before,.fd-popover__body:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left:after,.fd-popover__body:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:before,.fd-popover__body[dir=rtl]:before,[dir=rtl] .fd-popover__body--left:before,[dir=rtl] .fd-popover__body:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:after,.fd-popover__body[dir=rtl]:after,[dir=rtl] .fd-popover__body--left:after,[dir=rtl] .fd-popover__body:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--center{-webkit-transform:translateX(calc(var(--fdPopover_Center_Offset) * -1));left:var(--fdPopover_Center_Offset);transform:translate(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--center[dir=rtl],[dir=rtl] .fd-popover__body--center{-webkit-transform:translateX(var(--fdPopover_Center_Offset));left:auto;right:var(--fdPopover_Center_Offset);transform:translate(var(--fdPopover_Center_Offset))}.fd-popover__body--right{left:auto;right:0}.fd-popover__body--right[dir=rtl],[dir=rtl] .fd-popover__body--right{left:0;right:auto}.fd-popover__body--right:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--right:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--right[dir=rtl]:before,[dir=rtl] .fd-popover__body--right:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--right[dir=rtl]:after,[dir=rtl] .fd-popover__body--right:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--before{left:auto!important;right:var(--fdPopover_Offset)!important;top:0}.fd-popover__body--after{left:var(--fdPopover_Offset)!important;right:auto!important;top:0}.fd-popover__body--middle{-webkit-transform:translateY(calc(var(--fdPopover_Center_Offset) * -1));top:var(--fdPopover_Center_Offset);transform:translateY(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--bottom{bottom:0;top:auto}.fd-popover__body--above{bottom:var(--fdPopover_Offset);top:auto}.fd-popover__body--arrow-bottom{bottom:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-bottom:before{border-bottom:none;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-bottom:after{border-bottom:none;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-top:.5rem solid var(--fdPopover_Border_Color);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-left{left:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-left:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-left:after,.fd-popover__body--arrow-left:before{border-left:none;display:inline-block;height:0;left:auto!important;right:100%!important;width:0}.fd-popover__body--arrow-left:after{border-bottom:.5rem solid transparent;border-right:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right{right:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-right:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right:after,.fd-popover__body--arrow-right:before{border-right:none;display:inline-block;height:0;left:100%!important;right:auto!important;width:0}.fd-popover__body--arrow-right:after{border-bottom:.5rem solid transparent;border-left:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-center:after,.fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(-50%);left:50%;transform:translate(-50%)}.fd-popover__body--arrow-x-center[dir=rtl]:after,.fd-popover__body--arrow-x-center[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-center:after,[dir=rtl] .fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(50%);left:auto;right:50%;transform:translate(50%)}.fd-popover__body--arrow-x-end:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-end:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-x-end[dir=rtl]:after,[dir=rtl] .fd-popover__body--arrow-x-end:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-y-center:after,.fd-popover__body--arrow-y-center:before{-webkit-transform:translateY(-50%);top:50%;transform:translateY(-50%)}.fd-popover__body--arrow-y-end:before{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));top:auto}.fd-popover__body--arrow-y-end:after{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width));top:auto}.fd-popover__body--dropdown{width:max-content}.fd-popover__body--dropdown-fill{display:block;max-width:40rem;width:calc(100% - var(--sapGroup_BorderWidth) * 2)}.fd-popover__body--static{--fdPopover_Offset:0%;--fdPopover_Center_Offset:0%;position:relative}.fd-popover__body.is-hidden,.fd-popover__body[aria-hidden=true]{opacity:0;visibility:hidden;z-index:-1}.fd-popover__body .fd-popover__body--hidden{display:none}.fd-popover__body--input-message-group{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover__body--inline-help{font-size:var(--sapFontSmallSize);padding:.75rem}.fd-popover__body--inline-help-icon{--fdIcon_Button_Height:1.375rem;--fdIcon_Button_Width:1.375rem}.fd-popover--input-message-group .fd-popover__body,.fd-popover--input-message-group .fd-popover__body--no-arrow{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover--full-width{width:100%}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}fd-popover-body{max-width:100%;max-height:100%}.fd-popover-custom{display:inline-block;max-width:100%}.fd-popover-custom--disabled .fd-popover__control{cursor:auto}.fd-popover__body{max-height:100%;max-width:100%;display:flex}.fd-popover__body--hidden{display:none!important}.fd-popover__body.fd-form-message:before{width:auto;height:auto;position:relative;inset:0;border:none}.fd-popover__body>.fd-scrollbar{max-height:100%;max-width:100%;width:100%;border-radius:inherit}.fd-popover__body .fd-list{border-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list{border-bottom:none}.fd-popover__body .fd-nested-list__item:first-child .fd-nested-list__content{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__item:last-child .fd-nested-list__link{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content.is-selected{border-bottom-right-radius:0;border-bottom-left-radius:0}.fd-popover__body .fd-side-nav,.fd-popover__body .fd-nested-list__item{border-right:none}.fd-popover__body .fd-side-nav:first-child,.fd-popover__body .fd-nested-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-side-nav:last-child,.fd-popover__body .fd-nested-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.cdk-overlay-container{z-index:1002}.cdk-overlay-pane{max-width:100%;max-height:100%}\n"] }]
176
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.ContentDensityObserver }]; }, propDecorators: { _cdkTrapFocus: [{
177
- type: ViewChild,
178
- args: [CdkTrapFocus]
179
- }], _scrollbar: [{
180
- type: ViewChild,
181
- args: [ScrollbarDirective]
182
- }], bodyKeyupHandler: [{
183
- type: HostListener,
184
- args: ['keyup', ['$event']]
185
- }] } });
186
-
187
- class PopoverBodyHeaderDirective {
188
- constructor() {
189
- /** @hidden */
190
- this.fdPopoverBodyHeaderClass = true;
191
- }
192
- }
193
- PopoverBodyHeaderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
194
- PopoverBodyHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]", host: { properties: { "class.fd-popover__body-header": "this.fdPopoverBodyHeaderClass" } }, ngImport: i0 });
195
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyHeaderDirective, decorators: [{
196
- type: Directive,
197
- args: [{
198
- selector: '[fdPopoverBodyHeader], [fd-popover-body-header]'
199
- }]
200
- }], propDecorators: { fdPopoverBodyHeaderClass: [{
201
- type: HostBinding,
202
- args: ['class.fd-popover__body-header']
203
- }] } });
204
-
205
- class PopoverBodyFooterDirective {
206
- constructor() {
207
- /** @hidden */
208
- this.fdPopoverBodyFooterClass = true;
209
- }
210
- }
211
- PopoverBodyFooterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
212
- PopoverBodyFooterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]", host: { properties: { "class.fd-popover__body-footer": "this.fdPopoverBodyFooterClass" } }, ngImport: i0 });
213
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyFooterDirective, decorators: [{
214
- type: Directive,
215
- args: [{
216
- selector: '[fdPopoverBodyFooter], [fd-popover-body-footer]'
217
- }]
218
- }], propDecorators: { fdPopoverBodyFooterClass: [{
219
- type: HostBinding,
220
- args: ['class.fd-popover__body-footer']
221
- }] } });
22
+ import { TemplatePortal, ComponentPortal } from '@angular/cdk/portal';
23
+ import { GetDefaultPosition, PopoverPosition } from '@fundamental-ngx/core/shared';
24
+ import { __awaiter } from 'tslib';
25
+ import equal from 'fast-deep-equal';
222
26
 
223
27
  class BasePopoverClass {
224
28
  constructor() {
@@ -382,6 +186,181 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
382
186
  type: Output
383
187
  }] } });
384
188
 
189
+ class PopoverBodyDirective {
190
+ constructor() {
191
+ /**
192
+ * The template to be used as the popover's body.
193
+ **/
194
+ this.templateRef = inject(TemplateRef);
195
+ }
196
+ }
197
+ PopoverBodyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
198
+ PopoverBodyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyDirective, isStandalone: true, selector: "[fdPopoverBody]", ngImport: i0 });
199
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyDirective, decorators: [{
200
+ type: Directive,
201
+ args: [{
202
+ selector: '[fdPopoverBody]',
203
+ standalone: true
204
+ }]
205
+ }] });
206
+
207
+ class PopoverBodyFooterDirective {
208
+ constructor() {
209
+ /** @hidden */
210
+ this.fdPopoverBodyFooterClass = true;
211
+ }
212
+ }
213
+ PopoverBodyFooterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
214
+ PopoverBodyFooterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyFooterDirective, isStandalone: true, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]", host: { properties: { "class.fd-popover__body-footer": "this.fdPopoverBodyFooterClass" } }, ngImport: i0 });
215
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyFooterDirective, decorators: [{
216
+ type: Directive,
217
+ args: [{
218
+ selector: '[fdPopoverBodyFooter], [fd-popover-body-footer]',
219
+ standalone: true
220
+ }]
221
+ }], propDecorators: { fdPopoverBodyFooterClass: [{
222
+ type: HostBinding,
223
+ args: ['class.fd-popover__body-footer']
224
+ }] } });
225
+
226
+ class PopoverBodyHeaderDirective {
227
+ constructor() {
228
+ /** @hidden */
229
+ this.fdPopoverBodyHeaderClass = true;
230
+ }
231
+ }
232
+ PopoverBodyHeaderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
233
+ PopoverBodyHeaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyHeaderDirective, isStandalone: true, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]", host: { properties: { "class.fd-popover__body-header": "this.fdPopoverBodyHeaderClass" } }, ngImport: i0 });
234
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyHeaderDirective, decorators: [{
235
+ type: Directive,
236
+ args: [{
237
+ selector: '[fdPopoverBodyHeader], [fd-popover-body-header]',
238
+ standalone: true
239
+ }]
240
+ }], propDecorators: { fdPopoverBodyHeaderClass: [{
241
+ type: HostBinding,
242
+ args: ['class.fd-popover__body-header']
243
+ }] } });
244
+
245
+ /**
246
+ * A component used to enforce a certain layout for the popover.
247
+ * ```html
248
+ * <fd-popover>
249
+ * <fd-popover-control>Control Element</fd-popover-control>
250
+ * <fd-popover-body>Popover Body</fd-popover-body>
251
+ * </fd-popover>
252
+ * ```
253
+ */
254
+ class PopoverBodyComponent {
255
+ /** Handler escape keydown */
256
+ bodyKeyupHandler(event) {
257
+ if (KeyUtil.isKeyCode(event, ESCAPE) && this._closeOnEscapeKey) {
258
+ // In case if popover belongs to the element inside dialog
259
+ event.stopPropagation();
260
+ this.onClose.next();
261
+ }
262
+ }
263
+ /** @hidden */
264
+ constructor(_elementRef, _changeDetectorRef, _contentDensityObserver) {
265
+ this._elementRef = _elementRef;
266
+ this._changeDetectorRef = _changeDetectorRef;
267
+ this._contentDensityObserver = _contentDensityObserver;
268
+ /** Whether to wrap content with fd-scrollbar directive. */
269
+ this._disableScrollbar = false;
270
+ /** Should fd-scrollbar have tabindex*/
271
+ this._tabbableScrollbar = true;
272
+ /** Whether the popover should have an arrow. */
273
+ this._noArrow = true;
274
+ /** Whether the popover should be focusTrapped. */
275
+ this._focusTrapped = false;
276
+ /**
277
+ * Whether the popover should automatically move focus into the trapped region upon
278
+ * initialization and return focus to the previous activeElement upon destruction.
279
+ */
280
+ this._focusAutoCapture = false;
281
+ /** @hidden Property bind to popover's body */
282
+ this._closeOnEscapeKey = false;
283
+ /** @hidden Aria role for the popover body */
284
+ this._bodyRole = null;
285
+ /** @hidden Aria role for the popover body */
286
+ this._bodyId = null;
287
+ /** Classes added to arrow element */
288
+ this._arrowClasses = '';
289
+ /** Additional style to put margin into body component, to give a place for arrow */
290
+ this._marginStyle = null;
291
+ /** @hidden text rendered inside popover's body */
292
+ this.text = null;
293
+ /** Close event from popover body */
294
+ this.onClose = new Subject();
295
+ }
296
+ /** @hidden */
297
+ ngAfterViewInit() {
298
+ if (this._scrollbar) {
299
+ this._scrollbar._inPopover = true;
300
+ }
301
+ }
302
+ /** @hidden */
303
+ _setArrowStyles(position, rtl) {
304
+ if (this._noArrow) {
305
+ this._arrowClasses = '';
306
+ return;
307
+ }
308
+ if (position.overlayY !== position.originY &&
309
+ position.originY !== 'center' &&
310
+ position.overlayY !== 'center' &&
311
+ position.overlayX === position.originX) {
312
+ this._arrowClasses =
313
+ `fd-popover__body--${position.overlayY === 'top' ? 'below' : 'above'}` +
314
+ ` fd-popover__body--arrow-${position.overlayY}` +
315
+ ` fd-popover__body--arrow-x-${position.originX} `;
316
+ }
317
+ else if (position.overlayX !== position.originX &&
318
+ position.overlayX !== 'center' &&
319
+ position.originX !== 'center' &&
320
+ position.originY === position.overlayY) {
321
+ let overlayX = position.overlayX;
322
+ if (rtl === 'rtl') {
323
+ overlayX = position.overlayX === 'end' ? 'start' : 'end';
324
+ }
325
+ this._arrowClasses =
326
+ `fd-popover__body--${overlayX === 'start' ? 'after' : 'before'}` +
327
+ ` fd-popover__body--arrow-${overlayX === 'start' ? 'left' : 'right'}` +
328
+ ` fd-popover__body--arrow-y-${position.originY} `;
329
+ }
330
+ else {
331
+ this._arrowClasses = 'fd-popover__body--no-arrow';
332
+ }
333
+ this.detectChanges();
334
+ }
335
+ /** @hidden */
336
+ detectChanges() {
337
+ if (!this._changeDetectorRef['destroyed']) {
338
+ this._changeDetectorRef.detectChanges();
339
+ }
340
+ }
341
+ /** @hidden */
342
+ _focusFirstTabbableElement() {
343
+ if (this._focusAutoCapture) {
344
+ this._cdkTrapFocus.focusTrap.focusFirstTabbableElement();
345
+ }
346
+ }
347
+ }
348
+ PopoverBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component });
349
+ PopoverBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverBodyComponent, isStandalone: true, selector: "fd-popover-body", host: { listeners: { "keyup": "bodyKeyupHandler($event)" } }, providers: [contentDensityObserverProviders({ alwaysAddModifiers: true })], viewQueries: [{ propertyName: "_cdkTrapFocus", first: true, predicate: CdkTrapFocus, descendants: true }, { propertyName: "_scrollbar", first: true, predicate: ScrollbarDirective, descendants: true }], ngImport: i0, template: "<div\n class=\"fd-popover__body fd-popover__body--static\"\n [class.fd-popover__body--no-arrow]=\"_noArrow\"\n [class]=\"_arrowClasses + (_additionalBodyClass || '')\"\n [cdkTrapFocus]=\"_focusTrapped\"\n [style]=\"_marginStyle\"\n [style.max-width.px]=\"_maxWidth\"\n [style.min-width.px]=\"_popoverBodyMinWidth\"\n [style.width.px]=\"_popoverBodyWidth\"\n [attr.role]=\"_bodyRole\"\n [attr.id]=\"_bodyId\"\n>\n <div\n fd-scrollbar\n class=\"fd-popover__wrapper\"\n [overrideTabindex]=\"_tabbableScrollbar\"\n *ngIf=\"!_disableScrollbar; else renderer\"\n >\n <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n </div>\n</div>\n\n<ng-template #renderer>\n <ng-content select=\"[fd-popover-body-header]\"></ng-content>\n\n <ng-content select=\"[fd-popover-body-subheader]\"></ng-content>\n\n <ng-content></ng-content>\n\n {{ text }}\n\n <ng-container *ngTemplateOutlet=\"_templateToDisplay\"></ng-container>\n\n <ng-content select=\"[fd-popover-body-footer]\"></ng-content>\n</ng-template>\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-popover{-webkit-box-sizing:border-box;--fdPopover_Offset:100%;--fdPopover_Center_Offset:50%;border:0;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;max-width:100%;padding:0;position:relative}.fd-popover:after,.fd-popover:before{box-sizing:inherit;font-size:inherit}.fd-popover__control{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-popover__control:after,.fd-popover__control:before{box-sizing:inherit;font-size:inherit}.fd-popover__control:focus-visible{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor)}.fd-popover__control.is-expanded>*,.fd-popover__control[aria-expanded=true]>*{margin-bottom:0}.fd-popover__control.is-expanded+.fd-popover__body--input-message-group,.fd-popover__control[aria-expanded=true]+.fd-popover__body--input-message-group{margin-top:0}.fd-popover__control.is-disabled,.fd-popover__control:disabled,.fd-popover__control[aria-disabled=true]{pointer-events:none}.fd-popover__wrapper{border-radius:var(--fdPopover_Border_Radius);overflow:auto;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color)}.fd-popover__wrapper.is-focus,.fd-popover__wrapper:focus{outline:none;z-index:5}.fd-popover__wrapper::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb:active,.fd-popover__wrapper::-webkit-scrollbar-thumb:hover{box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{border-radius:0 var(--fdScrollbar_Border_Radius) var(--fdScrollbar_Border_Radius) 0}.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-corner,.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-track,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-corner,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-track{border-radius:var(--fdScrollbar_Border_Radius) 0 0 var(--fdScrollbar_Border_Radius)}.fd-popover__wrapper--visible{overflow:visible!important}.fd-popover__body{--fdIcon_Button_Height:2.25rem;--fdIcon_Button_Width:2.25rem;-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapContent_Shadow2);-webkit-transition:all .125s;background:var(--sapGroup_ContentBackground);border:0;border-radius:var(--fdPopover_Border_Radius);box-shadow:var(--sapContent_Shadow2);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;opacity:1;padding:0;position:absolute;top:calc(var(--fdPopover_Offset) + .5rem);transition:all .125s;visibility:visible;white-space:nowrap;z-index:1000}.fd-popover__body:after,.fd-popover__body:before{box-sizing:inherit;content:\"\";font-size:inherit;position:absolute}.fd-popover__body:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(-.5rem + var(--fdPopover_Border_Width));z-index:1002}.fd-popover__body:after,.fd-popover__body:before{border-top:none;display:inline-block;height:0;width:0}.fd-popover__body:after{border-bottom:.5rem solid var(--fdPopover_Border_Color);border-left:.5rem solid transparent;border-right:.5rem solid transparent;top:-.5rem;z-index:1001}.fd-popover__body>:not(.fd-popover__wrapper){overflow:hidden}.fd-popover__body ol:first-child li:first-child a:before,.fd-popover__body ol:first-child li:first-child:before,.fd-popover__body ul:first-child li:first-child a:before,.fd-popover__body ul:first-child li:first-child:before,.fd-popover__body-header>:first-child,.fd-popover__body>:first-child{border-top-left-radius:var(--fdPopover_Border_Radius);border-top-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body ol:last-child li:last-child a:before,.fd-popover__body ol:last-child li:last-child:before,.fd-popover__body ul:last-child li:last-child a:before,.fd-popover__body ul:last-child li:last-child:before,.fd-popover__body-footer>:last-child,.fd-popover__body>:last-child{border-bottom-left-radius:var(--fdPopover_Border_Radius);border-bottom-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body[class*=-compact],.fd-popover__body[class*=-condensed],[class*=-compact] .fd-popover__body:not([class*=-cozy]),[class*=-condensed] .fd-popover__body:not([class*=-cozy]){--fdIcon_Button_Height:1.625rem;--fdIcon_Button_Width:2rem}.fd-popover__body--no-arrow{box-shadow:var(--sapContent_Shadow1);top:var(--fdPopover_Offset)}.fd-popover__body--no-arrow:after,.fd-popover__body--no-arrow:before{display:none}.fd-popover__body,.fd-popover__body--left{left:0}.fd-popover__body--left[dir=rtl],.fd-popover__body[dir=rtl],[dir=rtl] .fd-popover__body,[dir=rtl] .fd-popover__body--left{left:auto;right:0}.fd-popover__body--left:before,.fd-popover__body:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left:after,.fd-popover__body:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:before,.fd-popover__body[dir=rtl]:before,[dir=rtl] .fd-popover__body--left:before,[dir=rtl] .fd-popover__body:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:after,.fd-popover__body[dir=rtl]:after,[dir=rtl] .fd-popover__body--left:after,[dir=rtl] .fd-popover__body:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--center{-webkit-transform:translateX(calc(var(--fdPopover_Center_Offset) * -1));left:var(--fdPopover_Center_Offset);transform:translate(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--center[dir=rtl],[dir=rtl] .fd-popover__body--center{-webkit-transform:translateX(var(--fdPopover_Center_Offset));left:auto;right:var(--fdPopover_Center_Offset);transform:translate(var(--fdPopover_Center_Offset))}.fd-popover__body--right{left:auto;right:0}.fd-popover__body--right[dir=rtl],[dir=rtl] .fd-popover__body--right{left:0;right:auto}.fd-popover__body--right:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--right:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--right[dir=rtl]:before,[dir=rtl] .fd-popover__body--right:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--right[dir=rtl]:after,[dir=rtl] .fd-popover__body--right:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--before{left:auto!important;right:var(--fdPopover_Offset)!important;top:0}.fd-popover__body--after{left:var(--fdPopover_Offset)!important;right:auto!important;top:0}.fd-popover__body--middle{-webkit-transform:translateY(calc(var(--fdPopover_Center_Offset) * -1));top:var(--fdPopover_Center_Offset);transform:translateY(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--bottom{bottom:0;top:auto}.fd-popover__body--above{bottom:var(--fdPopover_Offset);top:auto}.fd-popover__body--arrow-bottom{bottom:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-bottom:before{border-bottom:none;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-bottom:after{border-bottom:none;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-top:.5rem solid var(--fdPopover_Border_Color);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-left{left:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-left:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-left:after,.fd-popover__body--arrow-left:before{border-left:none;display:inline-block;height:0;left:auto!important;right:100%!important;width:0}.fd-popover__body--arrow-left:after{border-bottom:.5rem solid transparent;border-right:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right{right:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-right:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right:after,.fd-popover__body--arrow-right:before{border-right:none;display:inline-block;height:0;left:100%!important;right:auto!important;width:0}.fd-popover__body--arrow-right:after{border-bottom:.5rem solid transparent;border-left:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-center:after,.fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(-50%);left:50%;transform:translate(-50%)}.fd-popover__body--arrow-x-center[dir=rtl]:after,.fd-popover__body--arrow-x-center[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-center:after,[dir=rtl] .fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(50%);left:auto;right:50%;transform:translate(50%)}.fd-popover__body--arrow-x-end:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-end:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-x-end[dir=rtl]:after,[dir=rtl] .fd-popover__body--arrow-x-end:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-y-center:after,.fd-popover__body--arrow-y-center:before{-webkit-transform:translateY(-50%);top:50%;transform:translateY(-50%)}.fd-popover__body--arrow-y-end:before{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));top:auto}.fd-popover__body--arrow-y-end:after{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width));top:auto}.fd-popover__body--dropdown{width:max-content}.fd-popover__body--dropdown-fill{display:block;max-width:40rem;width:calc(100% - var(--sapGroup_BorderWidth) * 2)}.fd-popover__body--static{--fdPopover_Offset:0%;--fdPopover_Center_Offset:0%;position:relative}.fd-popover__body.is-hidden,.fd-popover__body[aria-hidden=true]{opacity:0;visibility:hidden;z-index:-1}.fd-popover__body .fd-popover__body--hidden{display:none}.fd-popover__body--input-message-group{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover__body--inline-help{font-size:var(--sapFontSmallSize);padding:.75rem}.fd-popover__body--inline-help-icon{--fdIcon_Button_Height:1.375rem;--fdIcon_Button_Width:1.375rem}.fd-popover--input-message-group .fd-popover__body,.fd-popover--input-message-group .fd-popover__body--no-arrow{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover--full-width{width:100%}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}fd-popover-body{max-width:100%;max-height:100%}.fd-popover-custom{display:inline-block;max-width:100%}.fd-popover-custom--disabled .fd-popover__control{cursor:auto}.fd-popover__body{max-height:100%;max-width:100%;display:flex}.fd-popover__body--hidden{display:none!important}.fd-popover__body.fd-form-message:before{width:auto;height:auto;position:relative;inset:0;border:none}.fd-popover__body>.fd-scrollbar{max-height:100%;max-width:100%;width:100%;border-radius:inherit}.fd-popover__body .fd-list{border-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list{border-bottom:none}.fd-popover__body .fd-nested-list__item:first-child .fd-nested-list__content{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__item:last-child .fd-nested-list__link{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content.is-selected{border-bottom-right-radius:0;border-bottom-left-radius:0}.fd-popover__body .fd-side-nav,.fd-popover__body .fd-nested-list__item{border-right:none}.fd-popover__body .fd-side-nav:first-child,.fd-popover__body .fd-nested-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-side-nav:last-child,.fd-popover__body .fd-nested-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.cdk-overlay-container{z-index:1002}.cdk-overlay-pane{max-width:100%;max-height:100%}\n"], dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ScrollbarDirective, selector: "[fdScrollbar], [fd-scrollbar]", inputs: ["noHorizontalScroll", "noVerticalScroll", "alwaysVisible", "overrideTabindex"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
350
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverBodyComponent, decorators: [{
351
+ type: Component,
352
+ args: [{ selector: 'fd-popover-body', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [contentDensityObserverProviders({ alwaysAddModifiers: true })], standalone: true, imports: [A11yModule, NgIf, CdkScrollable, ScrollbarDirective, NgTemplateOutlet], template: "<div\n class=\"fd-popover__body fd-popover__body--static\"\n [class.fd-popover__body--no-arrow]=\"_noArrow\"\n [class]=\"_arrowClasses + (_additionalBodyClass || '')\"\n [cdkTrapFocus]=\"_focusTrapped\"\n [style]=\"_marginStyle\"\n [style.max-width.px]=\"_maxWidth\"\n [style.min-width.px]=\"_popoverBodyMinWidth\"\n [style.width.px]=\"_popoverBodyWidth\"\n [attr.role]=\"_bodyRole\"\n [attr.id]=\"_bodyId\"\n>\n <div\n fd-scrollbar\n class=\"fd-popover__wrapper\"\n [overrideTabindex]=\"_tabbableScrollbar\"\n *ngIf=\"!_disableScrollbar; else renderer\"\n >\n <ng-container *ngTemplateOutlet=\"renderer\"></ng-container>\n </div>\n</div>\n\n<ng-template #renderer>\n <ng-content select=\"[fd-popover-body-header]\"></ng-content>\n\n <ng-content select=\"[fd-popover-body-subheader]\"></ng-content>\n\n <ng-content></ng-content>\n\n {{ text }}\n\n <ng-container *ngTemplateOutlet=\"_templateToDisplay\"></ng-container>\n\n <ng-content select=\"[fd-popover-body-footer]\"></ng-content>\n</ng-template>\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-popover{-webkit-box-sizing:border-box;--fdPopover_Offset:100%;--fdPopover_Center_Offset:50%;border:0;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;max-width:100%;padding:0;position:relative}.fd-popover:after,.fd-popover:before{box-sizing:inherit;font-size:inherit}.fd-popover__control{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-popover__control:after,.fd-popover__control:before{box-sizing:inherit;font-size:inherit}.fd-popover__control:focus-visible{outline:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor)}.fd-popover__control.is-expanded>*,.fd-popover__control[aria-expanded=true]>*{margin-bottom:0}.fd-popover__control.is-expanded+.fd-popover__body--input-message-group,.fd-popover__control[aria-expanded=true]+.fd-popover__body--input-message-group{margin-top:0}.fd-popover__control.is-disabled,.fd-popover__control:disabled,.fd-popover__control[aria-disabled=true]{pointer-events:none}.fd-popover__wrapper{border-radius:var(--fdPopover_Border_Radius);overflow:auto;scrollbar-color:var(--fdScrollbar_Thumb_Color) var(--fdScrollbar_Track_Color)}.fd-popover__wrapper.is-focus,.fd-popover__wrapper:focus{outline:none;z-index:5}.fd-popover__wrapper::-webkit-scrollbar{height:var(--fdScrollbar_Dimension);width:var(--fdScrollbar_Dimension)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{background-color:var(--fdScrollbar_Track_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color);background-color:transparent;border:var(--fdScrollbar_Thumb_Offset) solid transparent;border-radius:calc(var(--fdScrollbar_Thumb_Border_Radius) - var(--fdScrollbar_Thumb_Offset));box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Color)}.fd-popover__wrapper::-webkit-scrollbar-thumb:active,.fd-popover__wrapper::-webkit-scrollbar-thumb:hover{box-shadow:inset 0 0 0 var(--fdScrollbar_Dimension) var(--fdScrollbar_Thumb_Hover_Color)}.fd-popover__wrapper::-webkit-scrollbar-corner,.fd-popover__wrapper::-webkit-scrollbar-track{border-radius:0 var(--fdScrollbar_Border_Radius) var(--fdScrollbar_Border_Radius) 0}.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-corner,.fd-popover__wrapper[dir=rtl]::-webkit-scrollbar-track,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-corner,[dir=rtl] .fd-popover__wrapper::-webkit-scrollbar-track{border-radius:var(--fdScrollbar_Border_Radius) 0 0 var(--fdScrollbar_Border_Radius)}.fd-popover__wrapper--visible{overflow:visible!important}.fd-popover__body{--fdIcon_Button_Height:2.25rem;--fdIcon_Button_Width:2.25rem;-webkit-box-sizing:border-box;-webkit-box-shadow:var(--sapContent_Shadow2);-webkit-transition:all .125s;background:var(--sapGroup_ContentBackground);border:0;border-radius:var(--fdPopover_Border_Radius);box-shadow:var(--sapContent_Shadow2);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;opacity:1;padding:0;position:absolute;top:calc(var(--fdPopover_Offset) + .5rem);transition:all .125s;visibility:visible;white-space:nowrap;z-index:1000}.fd-popover__body:after,.fd-popover__body:before{box-sizing:inherit;content:\"\";font-size:inherit;position:absolute}.fd-popover__body:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(-.5rem + var(--fdPopover_Border_Width));z-index:1002}.fd-popover__body:after,.fd-popover__body:before{border-top:none;display:inline-block;height:0;width:0}.fd-popover__body:after{border-bottom:.5rem solid var(--fdPopover_Border_Color);border-left:.5rem solid transparent;border-right:.5rem solid transparent;top:-.5rem;z-index:1001}.fd-popover__body>:not(.fd-popover__wrapper){overflow:hidden}.fd-popover__body ol:first-child li:first-child a:before,.fd-popover__body ol:first-child li:first-child:before,.fd-popover__body ul:first-child li:first-child a:before,.fd-popover__body ul:first-child li:first-child:before,.fd-popover__body-header>:first-child,.fd-popover__body>:first-child{border-top-left-radius:var(--fdPopover_Border_Radius);border-top-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body ol:last-child li:last-child a:before,.fd-popover__body ol:last-child li:last-child:before,.fd-popover__body ul:last-child li:last-child a:before,.fd-popover__body ul:last-child li:last-child:before,.fd-popover__body-footer>:last-child,.fd-popover__body>:last-child{border-bottom-left-radius:var(--fdPopover_Border_Radius);border-bottom-right-radius:var(--fdPopover_Border_Radius)}.fd-popover__body[class*=-compact],.fd-popover__body[class*=-condensed],[class*=-compact] .fd-popover__body:not([class*=-cozy]),[class*=-condensed] .fd-popover__body:not([class*=-cozy]){--fdIcon_Button_Height:1.625rem;--fdIcon_Button_Width:2rem}.fd-popover__body--no-arrow{box-shadow:var(--sapContent_Shadow1);top:var(--fdPopover_Offset)}.fd-popover__body--no-arrow:after,.fd-popover__body--no-arrow:before{display:none}.fd-popover__body,.fd-popover__body--left{left:0}.fd-popover__body--left[dir=rtl],.fd-popover__body[dir=rtl],[dir=rtl] .fd-popover__body,[dir=rtl] .fd-popover__body--left{left:auto;right:0}.fd-popover__body--left:before,.fd-popover__body:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left:after,.fd-popover__body:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:before,.fd-popover__body[dir=rtl]:before,[dir=rtl] .fd-popover__body--left:before,[dir=rtl] .fd-popover__body:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--left[dir=rtl]:after,.fd-popover__body[dir=rtl]:after,[dir=rtl] .fd-popover__body--left:after,[dir=rtl] .fd-popover__body:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--center{-webkit-transform:translateX(calc(var(--fdPopover_Center_Offset) * -1));left:var(--fdPopover_Center_Offset);transform:translate(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--center[dir=rtl],[dir=rtl] .fd-popover__body--center{-webkit-transform:translateX(var(--fdPopover_Center_Offset));left:auto;right:var(--fdPopover_Center_Offset);transform:translate(var(--fdPopover_Center_Offset))}.fd-popover__body--right{left:auto;right:0}.fd-popover__body--right[dir=rtl],[dir=rtl] .fd-popover__body--right{left:0;right:auto}.fd-popover__body--right:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--right:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--right[dir=rtl]:before,[dir=rtl] .fd-popover__body--right:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--right[dir=rtl]:after,[dir=rtl] .fd-popover__body--right:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--before{left:auto!important;right:var(--fdPopover_Offset)!important;top:0}.fd-popover__body--after{left:var(--fdPopover_Offset)!important;right:auto!important;top:0}.fd-popover__body--middle{-webkit-transform:translateY(calc(var(--fdPopover_Center_Offset) * -1));top:var(--fdPopover_Center_Offset);transform:translateY(calc(var(--fdPopover_Center_Offset) * -1))}.fd-popover__body--bottom{bottom:0;top:auto}.fd-popover__body--above{bottom:var(--fdPopover_Offset);top:auto}.fd-popover__body--arrow-bottom{bottom:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-bottom:before{border-bottom:none;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-bottom:after{border-bottom:none;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-top:.5rem solid var(--fdPopover_Border_Color);display:inline-block;height:0;top:100%;width:0}.fd-popover__body--arrow-left{left:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-left:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-right:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-left:after,.fd-popover__body--arrow-left:before{border-left:none;display:inline-block;height:0;left:auto!important;right:100%!important;width:0}.fd-popover__body--arrow-left:after{border-bottom:.5rem solid transparent;border-right:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right{right:calc(var(--fdPopover_Offset) + .5rem)!important}.fd-popover__body--arrow-right:before{border-bottom:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;border-left:calc(.5rem - var(--fdPopover_Border_Width)) solid var(--sapGroup_ContentBackground);border-top:calc(.5rem - var(--fdPopover_Border_Width)) solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-right:after,.fd-popover__body--arrow-right:before{border-right:none;display:inline-block;height:0;left:100%!important;right:auto!important;width:0}.fd-popover__body--arrow-right:after{border-bottom:.5rem solid transparent;border-left:.5rem solid var(--fdPopover_Border_Color);border-top:.5rem solid transparent;top:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-center:after,.fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(-50%);left:50%;transform:translate(-50%)}.fd-popover__body--arrow-x-center[dir=rtl]:after,.fd-popover__body--arrow-x-center[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-center:after,[dir=rtl] .fd-popover__body--arrow-x-center:before{-webkit-transform:translateX(50%);left:auto;right:50%;transform:translate(50%)}.fd-popover__body--arrow-x-end:before{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end:after{left:auto;right:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width))}.fd-popover__body--arrow-x-end[dir=rtl]:before,[dir=rtl] .fd-popover__body--arrow-x-end:before{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-x-end[dir=rtl]:after,[dir=rtl] .fd-popover__body--arrow-x-end:after{left:calc(var(--fdIcon_Button_Width) * .5 - .5rem - var(--fdPopover_Border_Width));right:auto}.fd-popover__body--arrow-y-center:after,.fd-popover__body--arrow-y-center:before{-webkit-transform:translateY(-50%);top:50%;transform:translateY(-50%)}.fd-popover__body--arrow-y-end:before{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width) + var(--fdPopover_Border_Width));top:auto}.fd-popover__body--arrow-y-end:after{bottom:calc(var(--fdIcon_Button_Height) * .5 - .5rem - var(--fdPopover_Border_Width));top:auto}.fd-popover__body--dropdown{width:max-content}.fd-popover__body--dropdown-fill{display:block;max-width:40rem;width:calc(100% - var(--sapGroup_BorderWidth) * 2)}.fd-popover__body--static{--fdPopover_Offset:0%;--fdPopover_Center_Offset:0%;position:relative}.fd-popover__body.is-hidden,.fd-popover__body[aria-hidden=true]{opacity:0;visibility:hidden;z-index:-1}.fd-popover__body .fd-popover__body--hidden{display:none}.fd-popover__body--input-message-group{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover__body--inline-help{font-size:var(--sapFontSmallSize);padding:.75rem}.fd-popover__body--inline-help-icon{--fdIcon_Button_Height:1.375rem;--fdIcon_Button_Width:1.375rem}.fd-popover--input-message-group .fd-popover__body,.fd-popover--input-message-group .fd-popover__body--no-arrow{-webkit-box-shadow:none;border:none;box-shadow:none}.fd-popover--full-width{width:100%}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}fd-popover-body{max-width:100%;max-height:100%}.fd-popover-custom{display:inline-block;max-width:100%}.fd-popover-custom--disabled .fd-popover__control{cursor:auto}.fd-popover__body{max-height:100%;max-width:100%;display:flex}.fd-popover__body--hidden{display:none!important}.fd-popover__body.fd-form-message:before{width:auto;height:auto;position:relative;inset:0;border:none}.fd-popover__body>.fd-scrollbar{max-height:100%;max-width:100%;width:100%;border-radius:inherit}.fd-popover__body .fd-list{border-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list{border-bottom:none}.fd-popover__body .fd-nested-list__item:first-child .fd-nested-list__content{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__item:last-child .fd-nested-list__link{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-nested-list__item:last-child .fd-nested-list__content.is-selected{border-bottom-right-radius:0;border-bottom-left-radius:0}.fd-popover__body .fd-side-nav,.fd-popover__body .fd-nested-list__item{border-right:none}.fd-popover__body .fd-side-nav:first-child,.fd-popover__body .fd-nested-list__item:first-child{border-top-right-radius:var(--fdPopover_Border_Radius);border-top-left-radius:var(--fdPopover_Border_Radius)}.fd-popover__body .fd-side-nav:last-child,.fd-popover__body .fd-nested-list__item:last-child{border-bottom-right-radius:var(--fdPopover_Border_Radius);border-bottom-left-radius:var(--fdPopover_Border_Radius)}.cdk-overlay-container{z-index:1002}.cdk-overlay-pane{max-width:100%;max-height:100%}\n"] }]
353
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.ContentDensityObserver }]; }, propDecorators: { _cdkTrapFocus: [{
354
+ type: ViewChild,
355
+ args: [CdkTrapFocus]
356
+ }], _scrollbar: [{
357
+ type: ViewChild,
358
+ args: [ScrollbarDirective]
359
+ }], bodyKeyupHandler: [{
360
+ type: HostListener,
361
+ args: ['keyup', ['$event']]
362
+ }] } });
363
+
385
364
  class PopoverContainerDirective {
386
365
  /** @hidden */
387
366
  constructor(_elmRef) {
@@ -389,30 +368,161 @@ class PopoverContainerDirective {
389
368
  /** Subject which emits when popover position refresh is required. */
390
369
  this.refreshPosition$ = new Subject();
391
370
  /** @hidden */
392
- this._destroy$ = new Subject();
371
+ this._destroy$ = new Subject();
372
+ }
373
+ /** @hidden */
374
+ ngOnInit() {
375
+ resizeObservable(this._elmRef.nativeElement)
376
+ .pipe(takeUntil(this._destroy$))
377
+ .subscribe(() => {
378
+ this.refreshPosition$.next();
379
+ });
380
+ }
381
+ /** @hidden */
382
+ ngOnDestroy() {
383
+ this._destroy$.next();
384
+ this._destroy$.complete();
385
+ }
386
+ }
387
+ PopoverContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverContainerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
388
+ PopoverContainerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverContainerDirective, isStandalone: true, selector: "[fdPopoverContainer]", ngImport: i0 });
389
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverContainerDirective, decorators: [{
390
+ type: Directive,
391
+ args: [{
392
+ selector: '[fdPopoverContainer]',
393
+ standalone: true
394
+ }]
395
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
396
+
397
+ /**
398
+ * A component used to enforce a certain layout for the popover.
399
+ * ```html
400
+ * <fd-popover>
401
+ * <fd-popover-control>Control Element</fd-popover-control>
402
+ * <fd-popover-body>Popover Body</fd-popover-body>
403
+ * </fd-popover>
404
+ * ```
405
+ */
406
+ class PopoverControlComponent {
407
+ /** @hidden */
408
+ constructor(elRef) {
409
+ this.elRef = elRef;
410
+ /** @hidden */
411
+ this._tabbable = false;
412
+ }
413
+ /** @hidden */
414
+ ngAfterContentChecked() {
415
+ if (this._tabbable) {
416
+ this.makeTabbable();
417
+ }
418
+ }
419
+ /** @hidden */
420
+ makeTabbable() {
421
+ const elemChild = this.elRef.nativeElement.children[0];
422
+ if (elemChild && elemChild.getAttribute('tabindex') !== '-1') {
423
+ elemChild.tabIndex = '0';
424
+ }
425
+ }
426
+ }
427
+ PopoverControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverControlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
428
+ PopoverControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverControlComponent, isStandalone: true, selector: "fd-popover-control", ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
429
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverControlComponent, decorators: [{
430
+ type: Component,
431
+ args: [{ selector: 'fd-popover-control', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<ng-content></ng-content>\n" }]
432
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
433
+
434
+ const POPOVER_COMPONENT = new InjectionToken('PopoverInterface');
435
+
436
+ let mobilePopoverUniqueId = 0;
437
+ class PopoverMobileComponent extends MobileModeBase {
438
+ /** @hidden */
439
+ get titleId() {
440
+ return this.id + '-title';
441
+ }
442
+ /** @hidden */
443
+ constructor(elementRef, dialogService, _changeDetectorref, _popoverComponent, mobileModes) {
444
+ super(elementRef, dialogService, _popoverComponent, MobileModeControl.POPOVER, mobileModes);
445
+ this._changeDetectorref = _changeDetectorref;
446
+ /** @hidden
447
+ * from mobile class can not prefix _,
448
+ * to avoid build issues
449
+ */
450
+ this.childContent = undefined;
451
+ /** @hidden */
452
+ this.id = 'fd-popover-mobile-' + mobilePopoverUniqueId++;
453
+ /** @hidden */
454
+ this._subscriptions = new Subscription();
393
455
  }
394
456
  /** @hidden */
395
457
  ngOnInit() {
396
- resizeObservable(this._elmRef.nativeElement)
397
- .pipe(takeUntil(this._destroy$))
398
- .subscribe(() => {
399
- this.refreshPosition$.next();
400
- });
458
+ var _a, _b, _c, _d;
459
+ this._listenOnPopoverOpenChange();
460
+ this.title = this.mobileConfig.title || '';
461
+ this.viewBody = (_b = (_a = this.childContent) === null || _a === void 0 ? void 0 : _a.popoverBodyContentTemplate) !== null && _b !== void 0 ? _b : null;
462
+ this.viewFooter = (_d = (_c = this.childContent) === null || _c === void 0 ? void 0 : _c.popoverFooterContentTemplate) !== null && _d !== void 0 ? _d : null;
463
+ this._changeDetectorref.markForCheck();
401
464
  }
402
465
  /** @hidden */
403
466
  ngOnDestroy() {
404
- this._destroy$.next();
405
- this._destroy$.complete();
467
+ var _a;
468
+ (_a = this.dialogRef) === null || _a === void 0 ? void 0 : _a.close();
469
+ super.onDestroy();
470
+ this._subscriptions.unsubscribe();
471
+ }
472
+ /** Closes the Dialog and Popover component */
473
+ close() {
474
+ this.dialogRef.close();
475
+ this._component.close();
476
+ }
477
+ /** @hidden Opens/closes the Dialog based on Popover isOpenChange events */
478
+ _listenOnPopoverOpenChange() {
479
+ this._subscriptions.add(this._component.isOpenChange.pipe(takeUntil(this._onDestroy$)).subscribe((isOpen) => {
480
+ if (isOpen) {
481
+ this._openDialog();
482
+ }
483
+ else {
484
+ this.dialogRef.hide(true);
485
+ }
486
+ }));
487
+ }
488
+ /** @hidden Opens the Dialog */
489
+ _openDialog() {
490
+ this.dialogRef = this._dialogService.open(this._dialogTemplate, Object.assign(Object.assign({ verticalPadding: true, horizontalPadding: true }, this.dialogConfig), { mobile: true, focusTrapped: true, escKeyCloseable: false, backdropClickCloseable: false, container: this._elementRef.nativeElement, responsivePadding: true, ariaLabelledBy: this.titleId }));
406
491
  }
407
492
  }
408
- PopoverContainerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverContainerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
409
- PopoverContainerDirectivedir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverContainerDirective, selector: "[fdPopoverContainer]", ngImport: i0 });
410
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverContainerDirective, decorators: [{
411
- type: Directive,
493
+ PopoverMobileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.DialogService }, { token: i0.ChangeDetectorRef }, { token: POPOVER_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
494
+ PopoverMobileComponentcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverMobileComponent, isStandalone: true, selector: "fd-popover-mobile", viewQueries: [{ propertyName: "_dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" data-mobile-popover>\n <fd-dialog-header>\n <h1 fd-title [id]=\"titleId\">{{ title }}</h1>\n <button fd-dialog-close-button *ngIf=\"this.mobileConfig.hasCloseButton\" (click)=\"close()\"></button>\n </fd-dialog-header>\n\n <fd-dialog-body>\n <ng-container *ngTemplateOutlet=\"viewBody\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"viewFooter\">\n <ng-container *ngTemplateOutlet=\"viewFooter\"></ng-container>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$1.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "component", type: i2$1.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: "ngmodule", type: TitleModule }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
495
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileComponent, decorators: [{
496
+ type: Component,
497
+ args: [{ selector: 'fd-popover-mobile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [DialogModule, TitleModule, NgIf, CdkScrollable, ScrollbarDirective, NgTemplateOutlet], template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" data-mobile-popover>\n <fd-dialog-header>\n <h1 fd-title [id]=\"titleId\">{{ title }}</h1>\n <button fd-dialog-close-button *ngIf=\"this.mobileConfig.hasCloseButton\" (click)=\"close()\"></button>\n </fd-dialog-header>\n\n <fd-dialog-body>\n <ng-container *ngTemplateOutlet=\"viewBody\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"viewFooter\">\n <ng-container *ngTemplateOutlet=\"viewFooter\"></ng-container>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n" }]
498
+ }], ctorParameters: function () {
499
+ return [{ type: i0.ElementRef }, { type: i1$1.DialogService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
500
+ type: Inject,
501
+ args: [POPOVER_COMPONENT]
502
+ }] }, { type: undefined, decorators: [{
503
+ type: Optional
504
+ }, {
505
+ type: Inject,
506
+ args: [MOBILE_MODE_CONFIG]
507
+ }] }];
508
+ }, propDecorators: { _dialogTemplate: [{
509
+ type: ViewChild,
510
+ args: ['dialogTemplate']
511
+ }] } });
512
+
513
+ class PopoverMobileModule {
514
+ }
515
+ PopoverMobileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
516
+ PopoverMobileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, imports: [CommonModule, DialogModule, ButtonModule, PopoverMobileComponent], exports: [PopoverMobileComponent] });
517
+ PopoverMobileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, providers: [DynamicComponentService], imports: [CommonModule, DialogModule, ButtonModule, PopoverMobileComponent] });
518
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, decorators: [{
519
+ type: NgModule,
412
520
  args: [{
413
- selector: '[fdPopoverContainer]'
521
+ imports: [CommonModule, DialogModule, ButtonModule, PopoverMobileComponent],
522
+ exports: [PopoverMobileComponent],
523
+ providers: [DynamicComponentService]
414
524
  }]
415
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
525
+ }] });
416
526
 
417
527
  const MAX_BODY_SIZE = 99999999;
418
528
  class PopoverService extends BasePopoverClass {
@@ -432,6 +542,8 @@ class PopoverService extends BasePopoverClass {
432
542
  /** @hidden */
433
543
  this._eventRef = [];
434
544
  /** @hidden */
545
+ this._stopCloseListening$ = new Subject();
546
+ /** @hidden */
435
547
  this._placementRefresh$ = new Subject();
436
548
  /** An RxJS Subject that will kill the data stream upon component’s destruction (for unsubscribing) */
437
549
  this._onDestroy$ = new Subject();
@@ -449,7 +561,12 @@ class PopoverService extends BasePopoverClass {
449
561
  */
450
562
  initialise(triggerElement, config, templateData) {
451
563
  var _a;
452
- this._templateData = templateData;
564
+ if (templateData instanceof TemplateRef) {
565
+ this.templateContent = templateData;
566
+ }
567
+ else {
568
+ this._templateData = templateData;
569
+ }
453
570
  this._triggerElement = triggerElement;
454
571
  if (config) {
455
572
  this.refreshConfiguration(config);
@@ -465,7 +582,7 @@ class PopoverService extends BasePopoverClass {
465
582
  }
466
583
  /** Closes the popover. */
467
584
  close(focusActiveElement = true) {
468
- if (this._overlayRef) {
585
+ if (this._overlayRef && this._overlayRef.hasAttached()) {
469
586
  this._overlayRef.dispose();
470
587
  const prevState = this.isOpen;
471
588
  this.isOpen = false;
@@ -492,6 +609,7 @@ class PopoverService extends BasePopoverClass {
492
609
  else {
493
610
  this._attachBodyComponent();
494
611
  }
612
+ this._stopCloseListening$.next();
495
613
  this._listenForPositionChange(position.positionChanges);
496
614
  if (this.fillControlMode) {
497
615
  this._listenOnResize();
@@ -503,7 +621,6 @@ class PopoverService extends BasePopoverClass {
503
621
  }
504
622
  this._detectChanges();
505
623
  this._listenOnClose();
506
- this._listenOnOutClicks();
507
624
  this._focusFirstTabbableElement();
508
625
  this._onLoad.next(this._getPopoverBody()._elementRef);
509
626
  this._overlayRef.updatePosition();
@@ -548,6 +665,7 @@ class PopoverService extends BasePopoverClass {
548
665
  this._removeTriggerListeners();
549
666
  if (this._overlayRef) {
550
667
  this._overlayRef.detach();
668
+ this._overlayRef.dispose();
551
669
  }
552
670
  }
553
671
  /**
@@ -690,15 +808,13 @@ class PopoverService extends BasePopoverClass {
690
808
  }
691
809
  /** Subscribe to close events from CDK Overlay, to throw proper events, change values */
692
810
  _listenOnClose() {
693
- const closeEvents$ = merge(this._overlayRef.detachments(), this._getPopoverBody().onClose);
694
- closeEvents$.pipe(takeUntil(this._refresh$)).subscribe(() => this.close());
811
+ const closeEvents$ = merge(this._overlayRef.detachments(), this._getPopoverBody().onClose, this._outsideClicks$());
812
+ const finalizer$ = merge(this._stopCloseListening$, this._refresh$);
813
+ closeEvents$.pipe(takeUntil(finalizer$)).subscribe(() => this.close());
695
814
  }
696
815
  /** Listener for click events */
697
- _listenOnOutClicks() {
698
- const closeEvents$ = merge(this._overlayRef.backdropClick(), this._overlayRef._outsidePointerEvents);
699
- closeEvents$
700
- .pipe(filter((event) => this._shouldClose(event)), takeUntil(this._refresh$))
701
- .subscribe(() => this.close());
816
+ _outsideClicks$() {
817
+ return merge(this._overlayRef.backdropClick(), this._overlayRef._outsidePointerEvents).pipe(filter((event) => this._shouldClose(event)));
702
818
  }
703
819
  /** @hidden */
704
820
  _shouldClose(event) {
@@ -800,111 +916,77 @@ class PopoverService extends BasePopoverClass {
800
916
  }
801
917
  }
802
918
  }
803
- PopoverService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverService, deps: [{ token: i1$1.Overlay }, { token: i0.Renderer2 }, { token: i1$1.ViewportRuler }, { token: i0.Injector }, { token: i2$1.RtlService, optional: true }, { token: PopoverContainerDirective, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
919
+ PopoverService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverService, deps: [{ token: i1$2.Overlay }, { token: i0.Renderer2 }, { token: i1$2.ViewportRuler }, { token: i0.Injector }, { token: i2$2.RtlService, optional: true }, { token: PopoverContainerDirective, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
804
920
  PopoverService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverService });
805
921
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverService, decorators: [{
806
922
  type: Injectable
807
923
  }], ctorParameters: function () {
808
- return [{ type: i1$1.Overlay }, { type: i0.Renderer2 }, { type: i1$1.ViewportRuler }, { type: i0.Injector }, { type: i2$1.RtlService, decorators: [{
924
+ return [{ type: i1$2.Overlay }, { type: i0.Renderer2 }, { type: i1$2.ViewportRuler }, { type: i0.Injector }, { type: i2$2.RtlService, decorators: [{
809
925
  type: Optional
810
926
  }] }, { type: PopoverContainerDirective, decorators: [{
811
927
  type: Optional
812
928
  }] }];
813
929
  } });
814
930
 
815
- const POPOVER_COMPONENT = new InjectionToken('PopoverInterface');
816
-
817
- let mobilePopoverUniqueId = 0;
818
- class PopoverMobileComponent extends MobileModeBase {
819
- /** @hidden */
820
- get titleId() {
821
- return this.id + '-title';
822
- }
823
- /** @hidden */
824
- constructor(elementRef, dialogService, _changeDetectorref, _popoverComponent, mobileModes) {
825
- super(elementRef, dialogService, _popoverComponent, MobileModeControl.POPOVER, mobileModes);
826
- this._changeDetectorref = _changeDetectorref;
827
- /** @hidden
828
- * from mobile class can not prefix _,
829
- * to avoid build issues
830
- */
831
- this.childContent = undefined;
832
- /** @hidden */
833
- this.id = 'fd-popover-mobile-' + mobilePopoverUniqueId++;
834
- /** @hidden */
835
- this._subscriptions = new Subscription();
931
+ class PopoverTriggerDirective {
932
+ /** Set reference to Popover Component */
933
+ set popover(popover) {
934
+ if (popover) {
935
+ popover.trigger = this._elementRef;
936
+ this._listenOnExpanded(popover);
937
+ }
938
+ this._setAriaAttributes(popover);
836
939
  }
837
940
  /** @hidden */
838
- ngOnInit() {
839
- var _a, _b, _c, _d;
840
- this._listenOnPopoverOpenChange();
841
- this.title = this.mobileConfig.title || '';
842
- this.viewBody = (_b = (_a = this.childContent) === null || _a === void 0 ? void 0 : _a.popoverBodyContentTemplate) !== null && _b !== void 0 ? _b : null;
843
- this.viewFooter = (_d = (_c = this.childContent) === null || _c === void 0 ? void 0 : _c.popoverFooterContentTemplate) !== null && _d !== void 0 ? _d : null;
844
- this._changeDetectorref.markForCheck();
941
+ constructor(_elementRef) {
942
+ this._elementRef = _elementRef;
845
943
  }
846
944
  /** @hidden */
847
945
  ngOnDestroy() {
848
- var _a;
849
- (_a = this.dialogRef) === null || _a === void 0 ? void 0 : _a.close();
850
- super.onDestroy();
851
- this._subscriptions.unsubscribe();
946
+ this._unsubscribeExpandedListener();
852
947
  }
853
- /** Closes the Dialog and Popover component */
854
- close() {
855
- this.dialogRef.close();
856
- this._component.close();
948
+ /** @hidden */
949
+ _listenOnExpanded(popover) {
950
+ this._unsubscribeExpandedListener();
951
+ if (popover) {
952
+ this._isExpandedSubscription = popover.isOpenChange
953
+ .pipe(startWith(popover.isOpen))
954
+ .subscribe((isOpen) => (this.ariaExpanded = isOpen));
955
+ }
857
956
  }
858
- /** @hidden Opens/closes the Dialog based on Popover isOpenChange events */
859
- _listenOnPopoverOpenChange() {
860
- this._subscriptions.add(this._component.isOpenChange.pipe(takeUntil(this._onDestroy$)).subscribe((isOpen) => {
861
- if (isOpen) {
862
- this._openDialog();
863
- }
864
- else {
865
- this.dialogRef.hide(true);
866
- }
867
- }));
957
+ /** @hidden */
958
+ _setAriaAttributes(popover) {
959
+ this.ariaHasPopup = !!popover;
960
+ this.ariaControls = popover ? popover.id : null;
868
961
  }
869
- /** @hidden Opens the Dialog */
870
- _openDialog() {
871
- this.dialogRef = this._dialogService.open(this._dialogTemplate, Object.assign(Object.assign({ verticalPadding: true, horizontalPadding: true }, this.dialogConfig), { mobile: true, focusTrapped: true, escKeyCloseable: false, backdropClickCloseable: false, container: this._elementRef.nativeElement, responsivePadding: true, ariaLabelledBy: this.titleId }));
962
+ /** @hidden */
963
+ _unsubscribeExpandedListener() {
964
+ if (this._isExpandedSubscription) {
965
+ this._isExpandedSubscription.unsubscribe();
966
+ }
872
967
  }
873
968
  }
874
- PopoverMobileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DialogService }, { token: i0.ChangeDetectorRef }, { token: POPOVER_COMPONENT }, { token: MOBILE_MODE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
875
- PopoverMobileComponentcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverMobileComponent, selector: "fd-popover-mobile", viewQueries: [{ propertyName: "_dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" data-mobile-popover>\n <fd-dialog-header>\n <h1 fd-title [id]=\"titleId\">{{ title }}</h1>\n <button fd-dialog-close-button *ngIf=\"this.mobileConfig.hasCloseButton\" (click)=\"close()\"></button>\n </fd-dialog-header>\n\n <fd-dialog-body>\n <ng-container *ngTemplateOutlet=\"viewBody\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"viewFooter\">\n <ng-container *ngTemplateOutlet=\"viewFooter\"></ng-container>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i1$2.DialogBodyComponent, selector: "fd-dialog-body" }, { kind: "component", type: i1$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i1$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i1$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title"] }, { kind: "component", type: i3$1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
876
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileComponent, decorators: [{
877
- type: Component,
878
- args: [{ selector: 'fd-popover-mobile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" data-mobile-popover>\n <fd-dialog-header>\n <h1 fd-title [id]=\"titleId\">{{ title }}</h1>\n <button fd-dialog-close-button *ngIf=\"this.mobileConfig.hasCloseButton\" (click)=\"close()\"></button>\n </fd-dialog-header>\n\n <fd-dialog-body>\n <ng-container *ngTemplateOutlet=\"viewBody\"></ng-container>\n </fd-dialog-body>\n\n <fd-dialog-footer *ngIf=\"viewFooter\">\n <ng-container *ngTemplateOutlet=\"viewFooter\"></ng-container>\n </fd-dialog-footer>\n </fd-dialog>\n</ng-template>\n" }]
879
- }], ctorParameters: function () {
880
- return [{ type: i0.ElementRef }, { type: i1$2.DialogService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
881
- type: Inject,
882
- args: [POPOVER_COMPONENT]
883
- }] }, { type: undefined, decorators: [{
884
- type: Optional
885
- }, {
886
- type: Inject,
887
- args: [MOBILE_MODE_CONFIG]
888
- }] }];
889
- }, propDecorators: { _dialogTemplate: [{
890
- type: ViewChild,
891
- args: ['dialogTemplate']
892
- }] } });
893
-
894
- class PopoverMobileModule {
895
- }
896
- PopoverMobileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
897
- PopoverMobileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, declarations: [PopoverMobileComponent], imports: [CommonModule, DialogModule, ButtonModule], exports: [PopoverMobileComponent] });
898
- PopoverMobileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, providers: [DynamicComponentService], imports: [CommonModule, DialogModule, ButtonModule] });
899
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverMobileModule, decorators: [{
900
- type: NgModule,
969
+ PopoverTriggerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverTriggerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
970
+ PopoverTriggerDirectivedir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverTriggerDirective, isStandalone: true, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: { popover: ["fdPopoverTrigger", "popover"] }, host: { properties: { "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-controls": "this.ariaControls", "attr.aria-expanded": "this.ariaExpanded" } }, ngImport: i0 });
971
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverTriggerDirective, decorators: [{
972
+ type: Directive,
901
973
  args: [{
902
- declarations: [PopoverMobileComponent],
903
- imports: [CommonModule, DialogModule, ButtonModule],
904
- exports: [PopoverMobileComponent],
905
- providers: [DynamicComponentService]
974
+ selector: '[fdPopoverTrigger], [fd-popover-trigger]',
975
+ standalone: true
906
976
  }]
907
- }] });
977
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { popover: [{
978
+ type: Input,
979
+ args: ['fdPopoverTrigger']
980
+ }], ariaHasPopup: [{
981
+ type: HostBinding,
982
+ args: ['attr.aria-haspopup']
983
+ }], ariaControls: [{
984
+ type: HostBinding,
985
+ args: ['attr.aria-controls']
986
+ }], ariaExpanded: [{
987
+ type: HostBinding,
988
+ args: ['attr.aria-expanded']
989
+ }] } });
908
990
 
909
991
  const FD_POPOVER_COMPONENT = new InjectionToken('FdPopoverComponent');
910
992
 
@@ -1038,19 +1120,29 @@ class PopoverComponent extends BasePopoverClass {
1038
1120
  if (!this.popoverBody) {
1039
1121
  this._popoverService.templateContent = this.templateRef;
1040
1122
  }
1041
- this._popoverService.initialise(this.trigger || this.triggerOrigin.elementRef, this, this.popoverBody
1042
- ? {
1043
- template: this.templateRef,
1044
- container: this.container,
1045
- popoverBody: this.popoverBody
1046
- }
1047
- : null);
1123
+ this._popoverService.initialise(this.trigger || this.triggerOrigin.elementRef, this, this._getPopoverBodyContent());
1048
1124
  }
1049
1125
  else {
1050
1126
  this._setupMobileMode();
1051
1127
  }
1052
1128
  this._cdr.detectChanges();
1053
1129
  }
1130
+ /**
1131
+ * Depending on a used popover body type, returns a popover body content
1132
+ **/
1133
+ _getPopoverBodyContent() {
1134
+ if (this.popoverBody) {
1135
+ return {
1136
+ template: this.templateRef,
1137
+ container: this.container,
1138
+ popoverBody: this.popoverBody
1139
+ };
1140
+ }
1141
+ if (this.popoverBodyDirective) {
1142
+ return this.popoverBodyDirective.templateRef;
1143
+ }
1144
+ return null;
1145
+ }
1054
1146
  /** @hidden Open Popover in mobile mode */
1055
1147
  _setupMobileMode() {
1056
1148
  return __awaiter(this, void 0, void 0, function* () {
@@ -1090,15 +1182,15 @@ class PopoverComponent extends BasePopoverClass {
1090
1182
  }
1091
1183
  }
1092
1184
  }
1093
- PopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverComponent, deps: [{ token: PopoverService }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: i2$1.DynamicComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1094
- PopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverComponent, selector: "fd-popover", inputs: { title: "title", trigger: "trigger", fixedPosition: "fixedPosition", id: "id", mobile: "mobile", mobileConfig: "mobileConfig" }, host: { listeners: { "keydown": "onKeyDown($event)" }, properties: { "class.fd-popover-custom--mobile": "mobile", "attr.id": "id" }, classAttribute: "fd-popover-custom" }, providers: [
1185
+ PopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverComponent, deps: [{ token: PopoverService }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: i2$2.DynamicComponentService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1186
+ PopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PopoverComponent, isStandalone: true, selector: "fd-popover", inputs: { title: "title", trigger: "trigger", fixedPosition: "fixedPosition", id: "id", mobile: "mobile", mobileConfig: "mobileConfig" }, host: { listeners: { "keydown": "onKeyDown($event)" }, properties: { "class.fd-popover-custom--mobile": "mobile", "attr.id": "id" }, classAttribute: "fd-popover-custom" }, providers: [
1095
1187
  PopoverService,
1096
1188
  {
1097
1189
  provide: FD_POPOVER_COMPONENT,
1098
1190
  useExisting: PopoverComponent
1099
1191
  },
1100
1192
  contentDensityObserverProviders()
1101
- ], queries: [{ propertyName: "popoverBody", first: true, predicate: PopoverBodyComponent, descendants: true }, { propertyName: "popoverControl", first: true, predicate: PopoverControlComponent, descendants: true }, { propertyName: "popoverBodyContentTemplate", first: true, predicate: ["popoverBodyContent"], descendants: true }, { propertyName: "popoverFooterContentTemplate", first: true, predicate: ["popoverFooterContent"], descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true, read: TemplateRef }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }, { propertyName: "triggerOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"!trigger\"\n cdkOverlayOrigin\n class=\"fd-popover__control\"\n [class]=\"additionalTriggerClass\"\n (keydown)=\"triggerKeyDownHandler($event)\"\n>\n <ng-content select=\"fd-popover-control\"></ng-content>\n</div>\n\n<ng-template #templateRef>\n <ng-content select=\"fd-popover-body\"></ng-content>\n\n <ng-content></ng-content>\n</ng-template>\n\n<ng-container #container></ng-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1193
+ ], queries: [{ propertyName: "popoverBody", first: true, predicate: PopoverBodyComponent, descendants: true }, { propertyName: "popoverBodyDirective", first: true, predicate: PopoverBodyDirective, descendants: true }, { propertyName: "popoverControl", first: true, predicate: PopoverControlComponent, descendants: true }, { propertyName: "popoverBodyContentTemplate", first: true, predicate: ["popoverBodyContent"], descendants: true }, { propertyName: "popoverFooterContentTemplate", first: true, predicate: ["popoverFooterContent"], descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true, read: TemplateRef }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }, { propertyName: "triggerOrigin", first: true, predicate: CdkOverlayOrigin, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n *ngIf=\"!trigger\"\n cdkOverlayOrigin\n class=\"fd-popover__control\"\n [class]=\"additionalTriggerClass\"\n (keydown)=\"triggerKeyDownHandler($event)\"\n>\n <ng-content select=\"fd-popover-control\"></ng-content>\n</div>\n\n<ng-template #templateRef>\n <ng-content select=\"fd-popover-body\"></ng-content>\n\n <ng-content></ng-content>\n</ng-template>\n\n<ng-container #container></ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1102
1194
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverComponent, decorators: [{
1103
1195
  type: Component,
1104
1196
  args: [{ selector: 'fd-popover', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -1112,9 +1204,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1112
1204
  class: 'fd-popover-custom',
1113
1205
  '[class.fd-popover-custom--mobile]': 'mobile',
1114
1206
  '[attr.id]': 'id'
1115
- }, template: "<div\n *ngIf=\"!trigger\"\n cdkOverlayOrigin\n class=\"fd-popover__control\"\n [class]=\"additionalTriggerClass\"\n (keydown)=\"triggerKeyDownHandler($event)\"\n>\n <ng-content select=\"fd-popover-control\"></ng-content>\n</div>\n\n<ng-template #templateRef>\n <ng-content select=\"fd-popover-body\"></ng-content>\n\n <ng-content></ng-content>\n</ng-template>\n\n<ng-container #container></ng-container>\n" }]
1207
+ }, standalone: true, imports: [NgIf, CdkOverlayOrigin, NgTemplateOutlet], template: "<div\n *ngIf=\"!trigger\"\n cdkOverlayOrigin\n class=\"fd-popover__control\"\n [class]=\"additionalTriggerClass\"\n (keydown)=\"triggerKeyDownHandler($event)\"\n>\n <ng-content select=\"fd-popover-control\"></ng-content>\n</div>\n\n<ng-template #templateRef>\n <ng-content select=\"fd-popover-body\"></ng-content>\n\n <ng-content></ng-content>\n</ng-template>\n\n<ng-container #container></ng-container>\n" }]
1116
1208
  }], ctorParameters: function () {
1117
- return [{ type: PopoverService }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: i2$1.DynamicComponentService, decorators: [{
1209
+ return [{ type: PopoverService }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: i2$2.DynamicComponentService, decorators: [{
1118
1210
  type: Optional
1119
1211
  }] }];
1120
1212
  }, propDecorators: { title: [{
@@ -1141,6 +1233,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1141
1233
  }], popoverBody: [{
1142
1234
  type: ContentChild,
1143
1235
  args: [PopoverBodyComponent]
1236
+ }], popoverBodyDirective: [{
1237
+ type: ContentChild,
1238
+ args: [PopoverBodyDirective]
1144
1239
  }], popoverControl: [{
1145
1240
  type: ContentChild,
1146
1241
  args: [PopoverControlComponent]
@@ -1155,95 +1250,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1155
1250
  args: ['keydown', ['$event']]
1156
1251
  }] } });
1157
1252
 
1158
- class PopoverTriggerDirective {
1159
- /** Set reference to Popover Component */
1160
- set popover(popover) {
1161
- if (popover) {
1162
- popover.trigger = this._elementRef;
1163
- this._listenOnExpanded(popover);
1164
- }
1165
- this._setAriaAttributes(popover);
1166
- }
1167
- /** @hidden */
1168
- constructor(_elementRef) {
1169
- this._elementRef = _elementRef;
1170
- }
1171
- /** @hidden */
1172
- ngOnDestroy() {
1173
- this._unsubscribeExpandedListener();
1174
- }
1175
- /** @hidden */
1176
- _listenOnExpanded(popover) {
1177
- this._unsubscribeExpandedListener();
1178
- if (popover) {
1179
- this._isExpandedSubscription = popover.isOpenChange
1180
- .pipe(startWith(popover.isOpen))
1181
- .subscribe((isOpen) => (this.ariaExpanded = isOpen));
1182
- }
1183
- }
1184
- /** @hidden */
1185
- _setAriaAttributes(popover) {
1186
- this.ariaHasPopup = !!popover;
1187
- this.ariaControls = popover ? popover.id : null;
1188
- }
1189
- /** @hidden */
1190
- _unsubscribeExpandedListener() {
1191
- if (this._isExpandedSubscription) {
1192
- this._isExpandedSubscription.unsubscribe();
1193
- }
1194
- }
1195
- }
1196
- PopoverTriggerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverTriggerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
1197
- PopoverTriggerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: { popover: ["fdPopoverTrigger", "popover"] }, host: { properties: { "attr.aria-haspopup": "this.ariaHasPopup", "attr.aria-controls": "this.ariaControls", "attr.aria-expanded": "this.ariaExpanded" } }, ngImport: i0 });
1198
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverTriggerDirective, decorators: [{
1199
- type: Directive,
1200
- args: [{
1201
- selector: '[fdPopoverTrigger], [fd-popover-trigger]'
1202
- }]
1203
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { popover: [{
1204
- type: Input,
1205
- args: ['fdPopoverTrigger']
1206
- }], ariaHasPopup: [{
1207
- type: HostBinding,
1208
- args: ['attr.aria-haspopup']
1209
- }], ariaControls: [{
1210
- type: HostBinding,
1211
- args: ['attr.aria-controls']
1212
- }], ariaExpanded: [{
1213
- type: HostBinding,
1214
- args: ['attr.aria-expanded']
1215
- }] } });
1216
-
1217
1253
  class PopoverModule {
1218
1254
  }
1219
1255
  PopoverModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1220
- PopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: PopoverModule, declarations: [PopoverControlComponent,
1256
+ PopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: PopoverModule, imports: [PopoverControlComponent,
1221
1257
  PopoverBodyComponent,
1222
1258
  PopoverBodyHeaderDirective,
1223
1259
  PopoverBodyFooterDirective,
1224
1260
  PopoverComponent,
1225
1261
  PopoverTriggerDirective,
1226
- PopoverContainerDirective], imports: [CommonModule, OverlayModule, A11yModule, ScrollbarModule], exports: [PopoverControlComponent,
1262
+ PopoverContainerDirective,
1263
+ PopoverBodyDirective], exports: [PopoverControlComponent,
1227
1264
  PopoverBodyComponent,
1228
1265
  PopoverBodyHeaderDirective,
1229
1266
  PopoverBodyFooterDirective,
1230
1267
  PopoverComponent,
1231
1268
  PopoverTriggerDirective,
1232
- PopoverContainerDirective] });
1233
- PopoverModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverModule, imports: [CommonModule, OverlayModule, A11yModule, ScrollbarModule] });
1269
+ PopoverContainerDirective,
1270
+ PopoverBodyDirective] });
1271
+ PopoverModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverModule, imports: [PopoverControlComponent,
1272
+ PopoverBodyComponent,
1273
+ PopoverComponent] });
1234
1274
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PopoverModule, decorators: [{
1235
1275
  type: NgModule,
1236
1276
  args: [{
1237
- declarations: [
1277
+ imports: [
1238
1278
  PopoverControlComponent,
1239
1279
  PopoverBodyComponent,
1240
1280
  PopoverBodyHeaderDirective,
1241
1281
  PopoverBodyFooterDirective,
1242
1282
  PopoverComponent,
1243
1283
  PopoverTriggerDirective,
1244
- PopoverContainerDirective
1284
+ PopoverContainerDirective,
1285
+ PopoverBodyDirective
1245
1286
  ],
1246
- imports: [CommonModule, OverlayModule, A11yModule, ScrollbarModule],
1247
1287
  exports: [
1248
1288
  PopoverControlComponent,
1249
1289
  PopoverBodyComponent,
@@ -1251,7 +1291,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1251
1291
  PopoverBodyFooterDirective,
1252
1292
  PopoverComponent,
1253
1293
  PopoverTriggerDirective,
1254
- PopoverContainerDirective
1294
+ PopoverContainerDirective,
1295
+ PopoverBodyDirective
1255
1296
  ]
1256
1297
  }]
1257
1298
  }] });
@@ -1260,5 +1301,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
1260
1301
  * Generated bundle index. Do not edit.
1261
1302
  */
1262
1303
 
1263
- export { BasePopoverClass, FD_POPOVER_COMPONENT, POPOVER_COMPONENT, PopoverBodyComponent, PopoverBodyFooterDirective, PopoverBodyHeaderDirective, PopoverComponent, PopoverContainerDirective, PopoverControlComponent, PopoverMobileComponent, PopoverMobileModule, PopoverModule, PopoverService, PopoverTriggerDirective, SELECT_CLASS_NAMES };
1304
+ export { BasePopoverClass, FD_POPOVER_COMPONENT, POPOVER_COMPONENT, PopoverBodyComponent, PopoverBodyDirective, PopoverBodyFooterDirective, PopoverBodyHeaderDirective, PopoverComponent, PopoverContainerDirective, PopoverControlComponent, PopoverMobileComponent, PopoverMobileModule, PopoverModule, PopoverService, PopoverTriggerDirective, SELECT_CLASS_NAMES };
1264
1305
  //# sourceMappingURL=fundamental-ngx-core-popover.mjs.map