@skyux/popovers 8.0.0-alpha.2 → 8.0.0-alpha.21

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 (36) hide show
  1. package/documentation.json +390 -460
  2. package/esm2020/index.mjs +2 -1
  3. package/esm2020/lib/modules/dropdown/dropdown-button.component.mjs +3 -3
  4. package/esm2020/lib/modules/dropdown/dropdown-item.component.mjs +15 -15
  5. package/esm2020/lib/modules/dropdown/dropdown-menu.component.mjs +25 -25
  6. package/esm2020/lib/modules/dropdown/dropdown.component.mjs +32 -49
  7. package/esm2020/lib/modules/dropdown/dropdown.module.mjs +4 -4
  8. package/esm2020/lib/modules/popover/popover-adapter.service.mjs +3 -3
  9. package/esm2020/lib/modules/popover/popover-content.component.mjs +26 -26
  10. package/esm2020/lib/modules/popover/popover.component.mjs +39 -39
  11. package/esm2020/lib/modules/popover/popover.directive.mjs +14 -14
  12. package/esm2020/lib/modules/popover/popover.module.mjs +4 -4
  13. package/esm2020/lib/modules/shared/sky-popovers-resources.module.mjs +4 -4
  14. package/esm2020/testing/dropdown/dropdown-fixture.mjs +8 -8
  15. package/esm2020/testing/dropdown/dropdown-testing.module.mjs +4 -4
  16. package/esm2020/testing/popover/popover-fixture.mjs +6 -6
  17. package/esm2020/testing/popover/popover-testing.module.mjs +4 -4
  18. package/fesm2015/skyux-popovers-testing.mjs +21 -21
  19. package/fesm2015/skyux-popovers-testing.mjs.map +1 -1
  20. package/fesm2015/skyux-popovers.mjs +167 -185
  21. package/fesm2015/skyux-popovers.mjs.map +1 -1
  22. package/fesm2020/skyux-popovers-testing.mjs +21 -21
  23. package/fesm2020/skyux-popovers-testing.mjs.map +1 -1
  24. package/fesm2020/skyux-popovers.mjs +166 -183
  25. package/fesm2020/skyux-popovers.mjs.map +1 -1
  26. package/index.d.ts +1 -0
  27. package/lib/modules/dropdown/dropdown.component.d.ts +4 -7
  28. package/lib/modules/dropdown/types/dropdown-button-type.d.ts +1 -1
  29. package/lib/modules/dropdown/types/dropdown-horizontal-alignment.d.ts +1 -1
  30. package/lib/modules/dropdown/types/dropdown-trigger-type.d.ts +1 -1
  31. package/lib/modules/popover/popover-animation-state.d.ts +1 -1
  32. package/lib/modules/popover/types/popover-alignment.d.ts +1 -1
  33. package/lib/modules/popover/types/popover-placement.d.ts +1 -1
  34. package/lib/modules/popover/types/popover-trigger.d.ts +1 -1
  35. package/lib/modules/popover/types/popover-type.d.ts +1 -1
  36. package/package.json +11 -11
@@ -1,14 +1,14 @@
1
- import * as i3 from '@angular/common';
1
+ import * as i1 from '@angular/common';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import * as i0 from '@angular/core';
4
- import { NgModule, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, ElementRef, TemplateRef, Optional, Inject, ViewChild, EventEmitter, Output, ContentChildren, Injectable, ViewContainerRef, Directive } from '@angular/core';
5
- import * as i1 from '@skyux/core';
6
- import { SkyAffixAutoFitContext, SKY_STACKING_CONTEXT, SkyAffixModule, SkyOverlayModule } from '@skyux/core';
7
- import * as i4 from '@skyux/indicators';
4
+ import { NgModule, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, inject, ChangeDetectorRef, ElementRef, TemplateRef, ViewChild, EventEmitter, Optional, Output, ContentChildren, Injectable, ViewContainerRef, Inject, Directive } from '@angular/core';
5
+ import * as i1$1 from '@skyux/core';
6
+ import { SkyAffixService, SkyOverlayService, SKY_STACKING_CONTEXT, SkyAffixAutoFitContext, SkyAffixModule, SkyOverlayModule } from '@skyux/core';
7
+ import * as i2 from '@skyux/indicators';
8
8
  import { SkyIconModule } from '@skyux/indicators';
9
- import * as i2 from '@skyux/theme';
10
- import { SkyThemeModule } from '@skyux/theme';
11
- import * as i5 from '@skyux/i18n';
9
+ import * as i4 from '@skyux/theme';
10
+ import { SkyThemeService, SkyThemeModule } from '@skyux/theme';
11
+ import * as i4$1 from '@skyux/i18n';
12
12
  import { getLibStringForLocale, SkyI18nModule, SKY_LIB_RESOURCES_PROVIDERS } from '@skyux/i18n';
13
13
  import { __classPrivateFieldSet, __classPrivateFieldGet } from 'tslib';
14
14
  import { Subject, fromEvent } from 'rxjs';
@@ -77,16 +77,16 @@ class SkyPopoversResourcesProvider {
77
77
  */
78
78
  class SkyPopoversResourcesModule {
79
79
  }
80
- SkyPopoversResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoversResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
81
- SkyPopoversResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoversResourcesModule, exports: [SkyI18nModule] });
82
- SkyPopoversResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoversResourcesModule, providers: [
80
+ SkyPopoversResourcesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoversResourcesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
81
+ SkyPopoversResourcesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoversResourcesModule, exports: [SkyI18nModule] });
82
+ SkyPopoversResourcesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoversResourcesModule, providers: [
83
83
  {
84
84
  provide: SKY_LIB_RESOURCES_PROVIDERS,
85
85
  useClass: SkyPopoversResourcesProvider,
86
86
  multi: true,
87
87
  },
88
88
  ], imports: [SkyI18nModule] });
89
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoversResourcesModule, decorators: [{
89
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoversResourcesModule, decorators: [{
90
90
  type: NgModule,
91
91
  args: [{
92
92
  exports: [SkyI18nModule],
@@ -105,9 +105,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
105
105
  */
106
106
  class SkyDropdownButtonComponent {
107
107
  }
108
- SkyDropdownButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
109
- SkyDropdownButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SkyDropdownButtonComponent, selector: "sky-dropdown-button", ngImport: i0, template: "<ng-content></ng-content>\n" });
110
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownButtonComponent, decorators: [{
108
+ SkyDropdownButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
109
+ SkyDropdownButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: SkyDropdownButtonComponent, selector: "sky-dropdown-button", ngImport: i0, template: "<ng-content></ng-content>\n" });
110
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownButtonComponent, decorators: [{
111
111
  type: Component,
112
112
  args: [{ selector: 'sky-dropdown-button', template: "<ng-content></ng-content>\n" }]
113
113
  }] });
@@ -117,17 +117,6 @@ var _SkyDropdownItemComponent_instances, _SkyDropdownItemComponent__ariaRole, _S
117
117
  * Specifies the items to display on the dropdown menu.
118
118
  */
119
119
  class SkyDropdownItemComponent {
120
- constructor(elementRef, changeDetector, renderer) {
121
- this.elementRef = elementRef;
122
- _SkyDropdownItemComponent_instances.add(this);
123
- this.isActive = false;
124
- this.isDisabled = false;
125
- _SkyDropdownItemComponent__ariaRole.set(this, 'menuitem');
126
- _SkyDropdownItemComponent_changeDetector.set(this, void 0);
127
- _SkyDropdownItemComponent_renderer.set(this, void 0);
128
- __classPrivateFieldSet(this, _SkyDropdownItemComponent_changeDetector, changeDetector, "f");
129
- __classPrivateFieldSet(this, _SkyDropdownItemComponent_renderer, renderer, "f");
130
- }
131
120
  /**
132
121
  * The ARIA role for the dropdown menu item
133
122
  * [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility)
@@ -142,6 +131,17 @@ class SkyDropdownItemComponent {
142
131
  get ariaRole() {
143
132
  return __classPrivateFieldGet(this, _SkyDropdownItemComponent__ariaRole, "f");
144
133
  }
134
+ constructor(elementRef, changeDetector, renderer) {
135
+ this.elementRef = elementRef;
136
+ _SkyDropdownItemComponent_instances.add(this);
137
+ this.isActive = false;
138
+ this.isDisabled = false;
139
+ _SkyDropdownItemComponent__ariaRole.set(this, 'menuitem');
140
+ _SkyDropdownItemComponent_changeDetector.set(this, void 0);
141
+ _SkyDropdownItemComponent_renderer.set(this, void 0);
142
+ __classPrivateFieldSet(this, _SkyDropdownItemComponent_changeDetector, changeDetector, "f");
143
+ __classPrivateFieldSet(this, _SkyDropdownItemComponent_renderer, renderer, "f");
144
+ }
145
145
  ngAfterViewInit() {
146
146
  this.isDisabled = !this.isFocusable();
147
147
  // Make sure anchor elements are tab-able.
@@ -171,9 +171,9 @@ class SkyDropdownItemComponent {
171
171
  _SkyDropdownItemComponent__ariaRole = new WeakMap(), _SkyDropdownItemComponent_changeDetector = new WeakMap(), _SkyDropdownItemComponent_renderer = new WeakMap(), _SkyDropdownItemComponent_instances = new WeakSet(), _SkyDropdownItemComponent_getButtonElement = function _SkyDropdownItemComponent_getButtonElement() {
172
172
  return this.elementRef.nativeElement.querySelector('button,a');
173
173
  };
174
- SkyDropdownItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
175
- SkyDropdownItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SkyDropdownItemComponent, selector: "sky-dropdown-item", inputs: { ariaRole: "ariaRole" }, ngImport: i0, template: "<div\n class=\"sky-dropdown-item\"\n [attr.role]=\"ariaRole\"\n [ngClass]=\"{\n 'sky-dropdown-item-active': isActive,\n 'sky-dropdown-item-disabled': isDisabled\n }\"\n>\n <ng-content> </ng-content>\n</div>\n", styles: [".sky-dropdown-item{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;text-align:left}.sky-dropdown-item.sky-dropdown-item-active,.sky-dropdown-item:hover{background-color:#eeeeef}.sky-dropdown-item.sky-dropdown-item-disabled{cursor:default}.sky-dropdown-item.sky-dropdown-item-disabled:hover{background-color:transparent}.sky-dropdown-item>a,.sky-dropdown-item>button{background-color:transparent;border:none;color:#212327;cursor:pointer;display:block;padding:3px 20px;text-align:left;width:100%}.sky-dropdown-item>a:hover,.sky-dropdown-item>button:hover{text-decoration:none}.sky-dropdown-item>a[disabled],.sky-dropdown-item>button[disabled]{color:#686c73}.sky-dropdown-item>a[disabled]:hover,.sky-dropdown-item>button[disabled]:hover{cursor:default}.sky-theme-modern .sky-dropdown-item{margin:0}.sky-theme-modern .sky-dropdown-item.sky-dropdown-item-active,.sky-theme-modern .sky-dropdown-item:hover{background-color:transparent}.sky-theme-modern .sky-dropdown-item>a,.sky-theme-modern .sky-dropdown-item>button{padding:10px 20px;border-radius:6px;transition:box-shadow .15s}.sky-theme-modern .sky-dropdown-item>a:hover,.sky-theme-modern .sky-dropdown-item>button:hover{outline:solid 1px #1870B8;outline-offset:-1px}.sky-theme-modern .sky-dropdown-item>a:focus-visible,.sky-theme-modern .sky-dropdown-item>a:active,.sky-theme-modern .sky-dropdown-item>button:focus-visible,.sky-theme-modern .sky-dropdown-item>button:active{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-dropdown-item>a:focus-visible:not(:active),.sky-theme-modern .sky-dropdown-item>button:focus-visible:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-item>a,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-item>button{color:#fbfcfe}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
176
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownItemComponent, decorators: [{
174
+ SkyDropdownItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
175
+ SkyDropdownItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: SkyDropdownItemComponent, selector: "sky-dropdown-item", inputs: { ariaRole: "ariaRole" }, ngImport: i0, template: "<div\n class=\"sky-dropdown-item\"\n [attr.role]=\"ariaRole\"\n [ngClass]=\"{\n 'sky-dropdown-item-active': isActive,\n 'sky-dropdown-item-disabled': isDisabled\n }\"\n>\n <ng-content> </ng-content>\n</div>\n", styles: [".sky-dropdown-item{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;text-align:left}.sky-dropdown-item.sky-dropdown-item-active,.sky-dropdown-item:hover{background-color:#eeeeef}.sky-dropdown-item.sky-dropdown-item-disabled{cursor:default}.sky-dropdown-item.sky-dropdown-item-disabled:hover{background-color:transparent}.sky-dropdown-item>a,.sky-dropdown-item>button{background-color:transparent;border:none;color:#212327;cursor:pointer;display:block;padding:3px 20px;text-align:left;width:100%}.sky-dropdown-item>a:hover,.sky-dropdown-item>button:hover{text-decoration:none}.sky-dropdown-item>a[disabled],.sky-dropdown-item>button[disabled]{color:#686c73}.sky-dropdown-item>a[disabled]:hover,.sky-dropdown-item>button[disabled]:hover{cursor:default}.sky-theme-modern .sky-dropdown-item{margin:0}.sky-theme-modern .sky-dropdown-item.sky-dropdown-item-active,.sky-theme-modern .sky-dropdown-item:hover{background-color:transparent}.sky-theme-modern .sky-dropdown-item>a,.sky-theme-modern .sky-dropdown-item>button{padding:10px 20px;border-radius:6px;transition:box-shadow .15s}.sky-theme-modern .sky-dropdown-item>a:hover,.sky-theme-modern .sky-dropdown-item>button:hover{outline:solid 1px #1870B8;outline-offset:-1px}.sky-theme-modern .sky-dropdown-item>a:focus-visible,.sky-theme-modern .sky-dropdown-item>a:active,.sky-theme-modern .sky-dropdown-item>button:focus-visible,.sky-theme-modern .sky-dropdown-item>button:active{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-dropdown-item>a:focus-visible:not(:active),.sky-theme-modern .sky-dropdown-item>button:focus-visible:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-item>a,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-item>button{color:#fbfcfe}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
176
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownItemComponent, decorators: [{
177
177
  type: Component,
178
178
  args: [{ selector: 'sky-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-dropdown-item\"\n [attr.role]=\"ariaRole\"\n [ngClass]=\"{\n 'sky-dropdown-item-active': isActive,\n 'sky-dropdown-item-disabled': isDisabled\n }\"\n>\n <ng-content> </ng-content>\n</div>\n", styles: [".sky-dropdown-item{background-color:transparent;border:none;display:block;margin:4px;min-width:160px;text-align:left}.sky-dropdown-item.sky-dropdown-item-active,.sky-dropdown-item:hover{background-color:#eeeeef}.sky-dropdown-item.sky-dropdown-item-disabled{cursor:default}.sky-dropdown-item.sky-dropdown-item-disabled:hover{background-color:transparent}.sky-dropdown-item>a,.sky-dropdown-item>button{background-color:transparent;border:none;color:#212327;cursor:pointer;display:block;padding:3px 20px;text-align:left;width:100%}.sky-dropdown-item>a:hover,.sky-dropdown-item>button:hover{text-decoration:none}.sky-dropdown-item>a[disabled],.sky-dropdown-item>button[disabled]{color:#686c73}.sky-dropdown-item>a[disabled]:hover,.sky-dropdown-item>button[disabled]:hover{cursor:default}.sky-theme-modern .sky-dropdown-item{margin:0}.sky-theme-modern .sky-dropdown-item.sky-dropdown-item-active,.sky-theme-modern .sky-dropdown-item:hover{background-color:transparent}.sky-theme-modern .sky-dropdown-item>a,.sky-theme-modern .sky-dropdown-item>button{padding:10px 20px;border-radius:6px;transition:box-shadow .15s}.sky-theme-modern .sky-dropdown-item>a:hover,.sky-theme-modern .sky-dropdown-item>button:hover{outline:solid 1px #1870B8;outline-offset:-1px}.sky-theme-modern .sky-dropdown-item>a:focus-visible,.sky-theme-modern .sky-dropdown-item>a:active,.sky-theme-modern .sky-dropdown-item>button:focus-visible,.sky-theme-modern .sky-dropdown-item>button:active{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-dropdown-item>a:focus-visible:not(:active),.sky-theme-modern .sky-dropdown-item>button:focus-visible:not(:active){box-shadow:0 1px 8px #0000004d}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-item>a,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-item>button{color:#fbfcfe}\n"] }]
179
179
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }]; }, propDecorators: { ariaRole: [{
@@ -194,13 +194,16 @@ function parseAffixHorizontalAlignment$1(alignment) {
194
194
  }
195
195
  }
196
196
 
197
- var _SkyDropdownComponent_instances, _SkyDropdownComponent_affixer, _SkyDropdownComponent_ngUnsubscribe, _SkyDropdownComponent_overlay, _SkyDropdownComponent__buttonStyle, _SkyDropdownComponent__buttonType, _SkyDropdownComponent__dismissOnBlur, _SkyDropdownComponent__horizontalAlignment, _SkyDropdownComponent__isOpen, _SkyDropdownComponent__trigger, _SkyDropdownComponent__triggerButton, _SkyDropdownComponent_positionTimeout, _SkyDropdownComponent_changeDetector, _SkyDropdownComponent_affixService, _SkyDropdownComponent_overlayService, _SkyDropdownComponent_logService, _SkyDropdownComponent_themeSvc, _SkyDropdownComponent_zIndex, _SkyDropdownComponent_addEventListeners, _SkyDropdownComponent_createOverlay, _SkyDropdownComponent_destroyAffixer, _SkyDropdownComponent_destroyOverlay, _SkyDropdownComponent_createAffixer, _SkyDropdownComponent_handleIncomingMessages, _SkyDropdownComponent_sendMessage, _SkyDropdownComponent_positionDropdownMenu;
197
+ var _SkyDropdownComponent_instances, _SkyDropdownComponent_affixer, _SkyDropdownComponent_overlay, _SkyDropdownComponent_ngUnsubscribe, _SkyDropdownComponent_positionTimeout, _SkyDropdownComponent_affixService, _SkyDropdownComponent_changeDetector, _SkyDropdownComponent_overlayService, _SkyDropdownComponent_themeSvc, _SkyDropdownComponent_zIndex, _SkyDropdownComponent__buttonStyle, _SkyDropdownComponent__buttonType, _SkyDropdownComponent__dismissOnBlur, _SkyDropdownComponent__horizontalAlignment, _SkyDropdownComponent__isOpen, _SkyDropdownComponent__trigger, _SkyDropdownComponent__triggerButton, _SkyDropdownComponent_addEventListeners, _SkyDropdownComponent_createOverlay, _SkyDropdownComponent_destroyAffixer, _SkyDropdownComponent_destroyOverlay, _SkyDropdownComponent_createAffixer, _SkyDropdownComponent_handleIncomingMessages, _SkyDropdownComponent_sendMessage, _SkyDropdownComponent_positionDropdownMenu;
198
+ const DEFAULT_BUTTON_STYLE = 'default';
198
199
  const DEFAULT_BUTTON_TYPE = 'select';
200
+ const DEFAULT_HORIZONTAL_ALIGNMENT = 'left';
201
+ const DEFAULT_TRIGGER_TYPE = 'click';
199
202
  /**
200
203
  * Creates a dropdown menu that displays menu items that users may select.
201
204
  */
202
205
  class SkyDropdownComponent {
203
- constructor(changeDetector, affixService, overlayService, logService, themeSvc, stackingContext) {
206
+ constructor() {
204
207
  _SkyDropdownComponent_instances.add(this);
205
208
  /**
206
209
  * Whether to disable the dropdown button.
@@ -216,28 +219,21 @@ class SkyDropdownComponent {
216
219
  this.isMouseEnter = false;
217
220
  this.isVisible = false;
218
221
  _SkyDropdownComponent_affixer.set(this, void 0);
219
- _SkyDropdownComponent_ngUnsubscribe.set(this, new Subject());
220
222
  _SkyDropdownComponent_overlay.set(this, void 0);
221
- _SkyDropdownComponent__buttonStyle.set(this, 'default');
223
+ _SkyDropdownComponent_ngUnsubscribe.set(this, new Subject());
224
+ _SkyDropdownComponent_positionTimeout.set(this, void 0);
225
+ _SkyDropdownComponent_affixService.set(this, inject(SkyAffixService));
226
+ _SkyDropdownComponent_changeDetector.set(this, inject(ChangeDetectorRef));
227
+ _SkyDropdownComponent_overlayService.set(this, inject(SkyOverlayService));
228
+ _SkyDropdownComponent_themeSvc.set(this, inject(SkyThemeService, { optional: true }));
229
+ _SkyDropdownComponent_zIndex.set(this, inject(SKY_STACKING_CONTEXT, { optional: true })?.zIndex);
230
+ _SkyDropdownComponent__buttonStyle.set(this, DEFAULT_BUTTON_STYLE);
222
231
  _SkyDropdownComponent__buttonType.set(this, DEFAULT_BUTTON_TYPE);
223
232
  _SkyDropdownComponent__dismissOnBlur.set(this, true);
224
- _SkyDropdownComponent__horizontalAlignment.set(this, 'left');
233
+ _SkyDropdownComponent__horizontalAlignment.set(this, DEFAULT_HORIZONTAL_ALIGNMENT);
225
234
  _SkyDropdownComponent__isOpen.set(this, false);
226
- _SkyDropdownComponent__trigger.set(this, 'click');
235
+ _SkyDropdownComponent__trigger.set(this, DEFAULT_TRIGGER_TYPE);
227
236
  _SkyDropdownComponent__triggerButton.set(this, void 0);
228
- _SkyDropdownComponent_positionTimeout.set(this, void 0);
229
- _SkyDropdownComponent_changeDetector.set(this, void 0);
230
- _SkyDropdownComponent_affixService.set(this, void 0);
231
- _SkyDropdownComponent_overlayService.set(this, void 0);
232
- _SkyDropdownComponent_logService.set(this, void 0);
233
- _SkyDropdownComponent_themeSvc.set(this, void 0);
234
- _SkyDropdownComponent_zIndex.set(this, void 0);
235
- __classPrivateFieldSet(this, _SkyDropdownComponent_changeDetector, changeDetector, "f");
236
- __classPrivateFieldSet(this, _SkyDropdownComponent_affixService, affixService, "f");
237
- __classPrivateFieldSet(this, _SkyDropdownComponent_overlayService, overlayService, "f");
238
- __classPrivateFieldSet(this, _SkyDropdownComponent_logService, logService, "f");
239
- __classPrivateFieldSet(this, _SkyDropdownComponent_themeSvc, themeSvc, "f");
240
- __classPrivateFieldSet(this, _SkyDropdownComponent_zIndex, stackingContext?.zIndex, "f");
241
237
  }
242
238
  /**
243
239
  * The background color for the dropdown button. Available values are `default`,
@@ -246,7 +242,7 @@ class SkyDropdownComponent {
246
242
  * @default "default"
247
243
  */
248
244
  set buttonStyle(value) {
249
- __classPrivateFieldSet(this, _SkyDropdownComponent__buttonStyle, value ?? 'default', "f");
245
+ __classPrivateFieldSet(this, _SkyDropdownComponent__buttonStyle, value ?? DEFAULT_BUTTON_STYLE, "f");
250
246
  }
251
247
  get buttonStyle() {
252
248
  return __classPrivateFieldGet(this, _SkyDropdownComponent__buttonStyle, "f");
@@ -260,12 +256,6 @@ class SkyDropdownComponent {
260
256
  */
261
257
  set buttonType(value) {
262
258
  __classPrivateFieldSet(this, _SkyDropdownComponent__buttonType, value ?? DEFAULT_BUTTON_TYPE, "f");
263
- if (value && !['select', 'context-menu', 'tab'].includes(value)) {
264
- __classPrivateFieldGet(this, _SkyDropdownComponent_logService, "f").deprecated('SkyDropdownComponent.buttonType Font Awesome icon class option', {
265
- deprecationMajorVersion: 7,
266
- replacementRecommendation: 'Set `buttonType` to `select` and render a `<sky-icon>` element within the `<sky-dropdown-button>` element.',
267
- });
268
- }
269
259
  }
270
260
  get buttonType() {
271
261
  return __classPrivateFieldGet(this, _SkyDropdownComponent__buttonType, "f");
@@ -285,7 +275,7 @@ class SkyDropdownComponent {
285
275
  * @default "left"
286
276
  */
287
277
  set horizontalAlignment(value) {
288
- __classPrivateFieldSet(this, _SkyDropdownComponent__horizontalAlignment, value ?? 'left', "f");
278
+ __classPrivateFieldSet(this, _SkyDropdownComponent__horizontalAlignment, value ?? DEFAULT_HORIZONTAL_ALIGNMENT, "f");
289
279
  }
290
280
  get horizontalAlignment() {
291
281
  return __classPrivateFieldGet(this, _SkyDropdownComponent__horizontalAlignment, "f");
@@ -301,7 +291,7 @@ class SkyDropdownComponent {
301
291
  * @default "click"
302
292
  */
303
293
  set trigger(value) {
304
- __classPrivateFieldSet(this, _SkyDropdownComponent__trigger, value ?? 'click', "f");
294
+ __classPrivateFieldSet(this, _SkyDropdownComponent__trigger, value ?? DEFAULT_TRIGGER_TYPE, "f");
305
295
  }
306
296
  get trigger() {
307
297
  return __classPrivateFieldGet(this, _SkyDropdownComponent__trigger, "f");
@@ -348,7 +338,7 @@ class SkyDropdownComponent {
348
338
  __classPrivateFieldGet(this, _SkyDropdownComponent_ngUnsubscribe, "f").complete();
349
339
  }
350
340
  }
351
- _SkyDropdownComponent_affixer = new WeakMap(), _SkyDropdownComponent_ngUnsubscribe = new WeakMap(), _SkyDropdownComponent_overlay = new WeakMap(), _SkyDropdownComponent__buttonStyle = new WeakMap(), _SkyDropdownComponent__buttonType = new WeakMap(), _SkyDropdownComponent__dismissOnBlur = new WeakMap(), _SkyDropdownComponent__horizontalAlignment = new WeakMap(), _SkyDropdownComponent__isOpen = new WeakMap(), _SkyDropdownComponent__trigger = new WeakMap(), _SkyDropdownComponent__triggerButton = new WeakMap(), _SkyDropdownComponent_positionTimeout = new WeakMap(), _SkyDropdownComponent_changeDetector = new WeakMap(), _SkyDropdownComponent_affixService = new WeakMap(), _SkyDropdownComponent_overlayService = new WeakMap(), _SkyDropdownComponent_logService = new WeakMap(), _SkyDropdownComponent_themeSvc = new WeakMap(), _SkyDropdownComponent_zIndex = new WeakMap(), _SkyDropdownComponent_instances = new WeakSet(), _SkyDropdownComponent_addEventListeners = function _SkyDropdownComponent_addEventListeners() {
341
+ _SkyDropdownComponent_affixer = new WeakMap(), _SkyDropdownComponent_overlay = new WeakMap(), _SkyDropdownComponent_ngUnsubscribe = new WeakMap(), _SkyDropdownComponent_positionTimeout = new WeakMap(), _SkyDropdownComponent_affixService = new WeakMap(), _SkyDropdownComponent_changeDetector = new WeakMap(), _SkyDropdownComponent_overlayService = new WeakMap(), _SkyDropdownComponent_themeSvc = new WeakMap(), _SkyDropdownComponent_zIndex = new WeakMap(), _SkyDropdownComponent__buttonStyle = new WeakMap(), _SkyDropdownComponent__buttonType = new WeakMap(), _SkyDropdownComponent__dismissOnBlur = new WeakMap(), _SkyDropdownComponent__horizontalAlignment = new WeakMap(), _SkyDropdownComponent__isOpen = new WeakMap(), _SkyDropdownComponent__trigger = new WeakMap(), _SkyDropdownComponent__triggerButton = new WeakMap(), _SkyDropdownComponent_instances = new WeakSet(), _SkyDropdownComponent_addEventListeners = function _SkyDropdownComponent_addEventListeners() {
352
342
  __classPrivateFieldGet(this, _SkyDropdownComponent_ngUnsubscribe, "f").next();
353
343
  __classPrivateFieldGet(this, _SkyDropdownComponent_ngUnsubscribe, "f").complete();
354
344
  __classPrivateFieldSet(this, _SkyDropdownComponent_ngUnsubscribe, new Subject(), "f");
@@ -524,19 +514,12 @@ _SkyDropdownComponent_affixer = new WeakMap(), _SkyDropdownComponent_ngUnsubscri
524
514
  }
525
515
  }), "f");
526
516
  };
527
- SkyDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SkyAffixService }, { token: i1.SkyOverlayService }, { token: i1.SkyLogService }, { token: i2.SkyThemeService, optional: true }, { token: SKY_STACKING_CONTEXT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
528
- SkyDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SkyDropdownComponent, selector: "sky-dropdown", inputs: { buttonStyle: "buttonStyle", buttonType: "buttonType", disabled: "disabled", dismissOnBlur: "dismissOnBlur", label: "label", horizontalAlignment: "horizontalAlignment", messageStream: "messageStream", title: "title", trigger: "trigger" }, viewQueries: [{ propertyName: "menuContainerElementRef", first: true, predicate: ["menuContainerElementRef"], descendants: true, read: ElementRef }, { propertyName: "menuContainerTemplateRef", first: true, predicate: ["menuContainerTemplateRef"], descendants: true, read: TemplateRef, static: true }, { propertyName: "triggerButton", first: true, predicate: ["triggerButton"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"sky-dropdown\">\n <button\n class=\"sky-btn sky-dropdown-button\"\n type=\"button\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? menuId : null\"\n [attr.aria-haspopup]=\"menuAriaRole\"\n [attr.aria-label]=\"\n label || ('skyux_dropdown_context_menu_default_label' | skyLibResources)\n \"\n [attr.title]=\"title\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'sky-dropdown-button-type-' + buttonType,\n 'sky-btn-' + buttonStyle\n ]\"\n #triggerButton\n >\n <ng-container [ngSwitch]=\"buttonType\">\n <ng-template ngSwitchCase=\"context-menu\">\n <sky-icon *skyThemeIf=\"'default'\" icon=\"ellipsis-h\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n </ng-template>\n\n <ng-template ngSwitchDefault>\n <div\n *ngIf=\"buttonType === 'select' || buttonType === 'tab' || !buttonType\"\n class=\"sky-dropdown-button-container\"\n >\n <div class=\"sky-dropdown-button-content-container\">\n <ng-content select=\"sky-dropdown-button\"> </ng-content>\n </div>\n <div class=\"sky-dropdown-button-icon-container\">\n <sky-icon\n *skyThemeIf=\"'default'\"\n class=\"sky-dropdown-caret\"\n icon=\"caret-down\"\n >\n </sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n class=\"sky-dropdown-caret\"\n icon=\"chevron-down\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </div>\n </div>\n <div\n *ngIf=\"buttonType !== 'select' && buttonType !== 'tab' && buttonType\"\n >\n <sky-icon [icon]=\"buttonType\" size=\"lg\"></sky-icon>\n </div>\n </ng-template>\n </ng-container>\n </button>\n</div>\n\n<ng-template #menuContainerTemplateRef>\n <div\n class=\"sky-dropdown-menu-container\"\n [class.hidden]=\"!isVisible\"\n #menuContainerElementRef\n >\n <ng-content select=\"sky-dropdown-menu\"></ng-content>\n </div>\n</ng-template>\n", styles: [".sky-dropdown-button-type-tab{background-color:transparent;border:none;border-radius:4px 4px 0 0;color:var(--sky-text-color-deemphasized);cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark);max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-neutral-light);color:var(--sky-text-color-default);text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:var(--sky-background-color-disabled);cursor:not-allowed;pointer-events:none;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:var(--sky-text-color-deemphasized);cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark)}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}:host-context(.sky-toolbar-container) .sky-dropdown-button.sky-btn-link{color:#212327}.sky-dropdown-caret{margin-left:10px}.sky-dropdown-button-container{display:flex}.sky-dropdown-button-content-container{flex-shrink:1;overflow:hidden;text-overflow:ellipsis}.sky-dropdown-button-icon-container{flex-grow:1}.sky-dropdown-menu-container{position:fixed}.hidden{visibility:hidden}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}.sky-theme-modern .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}.sky-theme-modern .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}.sky-theme-modern .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab:hover{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab:hover{color:#fff}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i2.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i5.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
529
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownComponent, decorators: [{
517
+ SkyDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
518
+ SkyDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: SkyDropdownComponent, selector: "sky-dropdown", inputs: { buttonStyle: "buttonStyle", buttonType: "buttonType", disabled: "disabled", dismissOnBlur: "dismissOnBlur", label: "label", horizontalAlignment: "horizontalAlignment", messageStream: "messageStream", title: "title", trigger: "trigger" }, viewQueries: [{ propertyName: "menuContainerElementRef", first: true, predicate: ["menuContainerElementRef"], descendants: true, read: ElementRef }, { propertyName: "menuContainerTemplateRef", first: true, predicate: ["menuContainerTemplateRef"], descendants: true, read: TemplateRef, static: true }, { propertyName: "triggerButton", first: true, predicate: ["triggerButton"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"sky-dropdown\">\n <button\n class=\"sky-btn sky-dropdown-button\"\n type=\"button\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? menuId : null\"\n [attr.aria-haspopup]=\"menuAriaRole\"\n [attr.aria-label]=\"\n label || ('skyux_dropdown_context_menu_default_label' | skyLibResources)\n \"\n [attr.title]=\"title\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'sky-dropdown-button-type-' + buttonType,\n 'sky-btn-' + buttonStyle\n ]\"\n #triggerButton\n >\n <ng-container [ngSwitch]=\"buttonType\">\n <ng-template ngSwitchCase=\"context-menu\">\n <sky-icon *skyThemeIf=\"'default'\" icon=\"ellipsis-h\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n </ng-template>\n\n <ng-template ngSwitchDefault>\n <div class=\"sky-dropdown-button-container\">\n <div class=\"sky-dropdown-button-content-container\">\n <ng-content select=\"sky-dropdown-button\"> </ng-content>\n </div>\n <div class=\"sky-dropdown-button-icon-container\">\n <sky-icon\n *skyThemeIf=\"'default'\"\n class=\"sky-dropdown-caret\"\n icon=\"caret-down\"\n >\n </sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n class=\"sky-dropdown-caret\"\n icon=\"chevron-down\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </div>\n </div>\n </ng-template>\n </ng-container>\n </button>\n</div>\n\n<ng-template #menuContainerTemplateRef>\n <div\n class=\"sky-dropdown-menu-container\"\n [class.hidden]=\"!isVisible\"\n #menuContainerElementRef\n >\n <ng-content select=\"sky-dropdown-menu\"></ng-content>\n </div>\n</ng-template>\n", styles: [".sky-dropdown-button-type-tab{background-color:transparent;border:none;border-radius:4px 4px 0 0;color:var(--sky-text-color-deemphasized);cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark);max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-neutral-light);color:var(--sky-text-color-default);text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:var(--sky-background-color-disabled);cursor:not-allowed;pointer-events:none;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:var(--sky-text-color-deemphasized);cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark)}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}:host-context(.sky-toolbar-container) .sky-dropdown-button.sky-btn-link{color:#212327}.sky-dropdown-caret{margin-left:10px}.sky-dropdown-button-container{display:flex}.sky-dropdown-button-content-container{flex-shrink:1;overflow:hidden;text-overflow:ellipsis}.sky-dropdown-button-icon-container{flex-grow:1}.sky-dropdown-menu-container{position:fixed}.hidden{visibility:hidden}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}.sky-theme-modern .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}.sky-theme-modern .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}.sky-theme-modern .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab:hover{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab:hover{color:#fff}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i4.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i4$1.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
519
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownComponent, decorators: [{
530
520
  type: Component,
531
- args: [{ selector: 'sky-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-dropdown\">\n <button\n class=\"sky-btn sky-dropdown-button\"\n type=\"button\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? menuId : null\"\n [attr.aria-haspopup]=\"menuAriaRole\"\n [attr.aria-label]=\"\n label || ('skyux_dropdown_context_menu_default_label' | skyLibResources)\n \"\n [attr.title]=\"title\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'sky-dropdown-button-type-' + buttonType,\n 'sky-btn-' + buttonStyle\n ]\"\n #triggerButton\n >\n <ng-container [ngSwitch]=\"buttonType\">\n <ng-template ngSwitchCase=\"context-menu\">\n <sky-icon *skyThemeIf=\"'default'\" icon=\"ellipsis-h\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n </ng-template>\n\n <ng-template ngSwitchDefault>\n <div\n *ngIf=\"buttonType === 'select' || buttonType === 'tab' || !buttonType\"\n class=\"sky-dropdown-button-container\"\n >\n <div class=\"sky-dropdown-button-content-container\">\n <ng-content select=\"sky-dropdown-button\"> </ng-content>\n </div>\n <div class=\"sky-dropdown-button-icon-container\">\n <sky-icon\n *skyThemeIf=\"'default'\"\n class=\"sky-dropdown-caret\"\n icon=\"caret-down\"\n >\n </sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n class=\"sky-dropdown-caret\"\n icon=\"chevron-down\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </div>\n </div>\n <div\n *ngIf=\"buttonType !== 'select' && buttonType !== 'tab' && buttonType\"\n >\n <sky-icon [icon]=\"buttonType\" size=\"lg\"></sky-icon>\n </div>\n </ng-template>\n </ng-container>\n </button>\n</div>\n\n<ng-template #menuContainerTemplateRef>\n <div\n class=\"sky-dropdown-menu-container\"\n [class.hidden]=\"!isVisible\"\n #menuContainerElementRef\n >\n <ng-content select=\"sky-dropdown-menu\"></ng-content>\n </div>\n</ng-template>\n", styles: [".sky-dropdown-button-type-tab{background-color:transparent;border:none;border-radius:4px 4px 0 0;color:var(--sky-text-color-deemphasized);cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark);max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-neutral-light);color:var(--sky-text-color-default);text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:var(--sky-background-color-disabled);cursor:not-allowed;pointer-events:none;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:var(--sky-text-color-deemphasized);cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark)}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}:host-context(.sky-toolbar-container) .sky-dropdown-button.sky-btn-link{color:#212327}.sky-dropdown-caret{margin-left:10px}.sky-dropdown-button-container{display:flex}.sky-dropdown-button-content-container{flex-shrink:1;overflow:hidden;text-overflow:ellipsis}.sky-dropdown-button-icon-container{flex-grow:1}.sky-dropdown-menu-container{position:fixed}.hidden{visibility:hidden}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}.sky-theme-modern .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}.sky-theme-modern .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}.sky-theme-modern .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab:hover{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab:hover{color:#fff}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}\n"] }]
532
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.SkyAffixService }, { type: i1.SkyOverlayService }, { type: i1.SkyLogService }, { type: i2.SkyThemeService, decorators: [{
533
- type: Optional
534
- }] }, { type: undefined, decorators: [{
535
- type: Optional
536
- }, {
537
- type: Inject,
538
- args: [SKY_STACKING_CONTEXT]
539
- }] }]; }, propDecorators: { buttonStyle: [{
521
+ args: [{ selector: 'sky-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sky-dropdown\">\n <button\n class=\"sky-btn sky-dropdown-button\"\n type=\"button\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"isOpen ? menuId : null\"\n [attr.aria-haspopup]=\"menuAriaRole\"\n [attr.aria-label]=\"\n label || ('skyux_dropdown_context_menu_default_label' | skyLibResources)\n \"\n [attr.title]=\"title\"\n [disabled]=\"disabled\"\n [ngClass]=\"[\n 'sky-dropdown-button-type-' + buttonType,\n 'sky-btn-' + buttonStyle\n ]\"\n #triggerButton\n >\n <ng-container [ngSwitch]=\"buttonType\">\n <ng-template ngSwitchCase=\"context-menu\">\n <sky-icon *skyThemeIf=\"'default'\" icon=\"ellipsis-h\"></sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n </ng-template>\n\n <ng-template ngSwitchDefault>\n <div class=\"sky-dropdown-button-container\">\n <div class=\"sky-dropdown-button-content-container\">\n <ng-content select=\"sky-dropdown-button\"> </ng-content>\n </div>\n <div class=\"sky-dropdown-button-icon-container\">\n <sky-icon\n *skyThemeIf=\"'default'\"\n class=\"sky-dropdown-caret\"\n icon=\"caret-down\"\n >\n </sky-icon>\n <sky-icon\n *skyThemeIf=\"'modern'\"\n class=\"sky-dropdown-caret\"\n icon=\"chevron-down\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </div>\n </div>\n </ng-template>\n </ng-container>\n </button>\n</div>\n\n<ng-template #menuContainerTemplateRef>\n <div\n class=\"sky-dropdown-menu-container\"\n [class.hidden]=\"!isVisible\"\n #menuContainerElementRef\n >\n <ng-content select=\"sky-dropdown-menu\"></ng-content>\n </div>\n</ng-template>\n", styles: [".sky-dropdown-button-type-tab{background-color:transparent;border:none;border-radius:4px 4px 0 0;color:var(--sky-text-color-deemphasized);cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark);max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-neutral-light);color:var(--sky-text-color-default);text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:var(--sky-background-color-disabled);cursor:not-allowed;pointer-events:none;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:var(--sky-text-color-deemphasized);cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:var(--sky-background-color-primary-dark);color:var(--sky-text-color-on-dark)}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}:host-context(.sky-toolbar-container) .sky-dropdown-button.sky-btn-link{color:#212327}.sky-dropdown-caret{margin-left:10px}.sky-dropdown-button-container{display:flex}.sky-dropdown-button-content-container{flex-shrink:1;overflow:hidden;text-overflow:ellipsis}.sky-dropdown-button-icon-container{flex-grow:1}.sky-dropdown-menu-container{position:fixed}.hidden{visibility:hidden}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}:host-context(.sky-theme-modern) .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;color:var(--sky-text-color-deemphasized);font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:var(--sky-text-color-default);box-shadow:none}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible){background-color:transparent;border-bottom:solid 1px var(--sky-highlight-color-info);color:var(--sky-text-color-default);padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible{background-color:transparent;color:var(--sky-text-color-default);outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus-visible:not(:active){color:var(--sky-text-color-default);outline:solid 2px var(--sky-background-color-primary-dark);outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{color:var(--sky-text-color-default);padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:transparent;font-family:BLKB Sans,Helvetica Neue,Arial,sans-serif;color:var(--sky-text-color-deemphasized);font-weight:400;font-size:15px;font-style:italic}.sky-theme-modern .sky-dropdown-button-type-tab.sky-btn-tab-disabled .sky-btn-tab-close{font-size:16px}.sky-theme-modern .sky-dropdown-button-type-tab:not(:active){border-bottom:solid 3px #1870B8;padding-bottom:7px}.sky-theme-modern .sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:transparent;color:var(--sky-text-color-default)}.sky-theme-modern .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern .sky-dropdown-button-type-tab .sky-tab-header-count{color:var(--sky-text-color-deemphasized)}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-context-menu{border-radius:6px;padding:3px 8px;background-color:transparent}.sky-theme-modern .sky-dropdown-button-type-context-menu:not(:hover):not(:focus-visible){box-shadow:none}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab:hover{color:#fff}:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-btn-tab-close,:host-context(.sky-theme-modern.sky-theme-mode-dark) .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab:hover{color:#fff}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-btn-tab-close,.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-button-type-tab .sky-tab-header-count{color:#efefef}\n"] }]
522
+ }], propDecorators: { buttonStyle: [{
540
523
  type: Input
541
524
  }], buttonType: [{
542
525
  type: Input
@@ -580,27 +563,6 @@ let nextId = 0;
580
563
  *
581
564
  */
582
565
  class SkyDropdownMenuComponent {
583
- constructor(changeDetector, elementRef, dropdownComponent) {
584
- _SkyDropdownMenuComponent_instances.add(this);
585
- /**
586
- * Fires when the dropdown menu's active index or selected item changes. This event provides an
587
- * observable to emit changes, and the response is of
588
- * the SkyDropdownMenuChange type.
589
- * @internal
590
- */
591
- this.menuChanges = new EventEmitter();
592
- this.dropdownMenuId = `sky-dropdown-menu-${++nextId}`;
593
- _SkyDropdownMenuComponent_ngUnsubscribe.set(this, new Subject());
594
- _SkyDropdownMenuComponent__ariaRole.set(this, 'menu');
595
- _SkyDropdownMenuComponent__menuIndex.set(this, 0);
596
- _SkyDropdownMenuComponent__useNativeFocus.set(this, true);
597
- _SkyDropdownMenuComponent_changeDetector.set(this, void 0);
598
- _SkyDropdownMenuComponent_elementRef.set(this, void 0);
599
- _SkyDropdownMenuComponent_dropdownComponent.set(this, void 0);
600
- __classPrivateFieldSet(this, _SkyDropdownMenuComponent_changeDetector, changeDetector, "f");
601
- __classPrivateFieldSet(this, _SkyDropdownMenuComponent_elementRef, elementRef, "f");
602
- __classPrivateFieldSet(this, _SkyDropdownMenuComponent_dropdownComponent, dropdownComponent, "f");
603
- }
604
566
  /**
605
567
  * The ARIA role for the dropdown menu
606
568
  * [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility)
@@ -642,6 +604,27 @@ class SkyDropdownMenuComponent {
642
604
  get menuIndex() {
643
605
  return __classPrivateFieldGet(this, _SkyDropdownMenuComponent__menuIndex, "f");
644
606
  }
607
+ constructor(changeDetector, elementRef, dropdownComponent) {
608
+ _SkyDropdownMenuComponent_instances.add(this);
609
+ /**
610
+ * Fires when the dropdown menu's active index or selected item changes. This event provides an
611
+ * observable to emit changes, and the response is of
612
+ * the SkyDropdownMenuChange type.
613
+ * @internal
614
+ */
615
+ this.menuChanges = new EventEmitter();
616
+ this.dropdownMenuId = `sky-dropdown-menu-${++nextId}`;
617
+ _SkyDropdownMenuComponent_ngUnsubscribe.set(this, new Subject());
618
+ _SkyDropdownMenuComponent__ariaRole.set(this, 'menu');
619
+ _SkyDropdownMenuComponent__menuIndex.set(this, 0);
620
+ _SkyDropdownMenuComponent__useNativeFocus.set(this, true);
621
+ _SkyDropdownMenuComponent_changeDetector.set(this, void 0);
622
+ _SkyDropdownMenuComponent_elementRef.set(this, void 0);
623
+ _SkyDropdownMenuComponent_dropdownComponent.set(this, void 0);
624
+ __classPrivateFieldSet(this, _SkyDropdownMenuComponent_changeDetector, changeDetector, "f");
625
+ __classPrivateFieldSet(this, _SkyDropdownMenuComponent_elementRef, elementRef, "f");
626
+ __classPrivateFieldSet(this, _SkyDropdownMenuComponent_dropdownComponent, dropdownComponent, "f");
627
+ }
645
628
  ngAfterContentInit() {
646
629
  /* istanbul ignore else */
647
630
  if (__classPrivateFieldGet(this, _SkyDropdownMenuComponent_dropdownComponent, "f")) {
@@ -852,9 +835,9 @@ _SkyDropdownMenuComponent_ngUnsubscribe = new WeakMap(), _SkyDropdownMenuCompone
852
835
  const found = this.menuItems.find((item) => item.isFocusable());
853
836
  return found !== undefined;
854
837
  };
855
- SkyDropdownMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownMenuComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: SkyDropdownComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
856
- SkyDropdownMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SkyDropdownMenuComponent, selector: "sky-dropdown-menu", inputs: { ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole", useNativeFocus: "useNativeFocus" }, outputs: { menuChanges: "menuChanges" }, queries: [{ propertyName: "menuItems", predicate: SkyDropdownItemComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"sky-dropdown-menu sky-shadow sky-elevation-4\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.role]=\"ariaRole\"\n [id]=\"dropdownMenuId\"\n>\n <ng-content> </ng-content>\n</div>\n", styles: [".sky-dropdown-menu{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px);display:flex;flex-direction:column;background-color:#fff}.sky-dropdown-menu button{overflow:hidden;text-overflow:ellipsis}.sky-theme-modern .sky-dropdown-menu{border-radius:6px;padding:10px 0}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-menu{background-color:#252a2e;color:#fff}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
857
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownMenuComponent, decorators: [{
838
+ SkyDropdownMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownMenuComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: SkyDropdownComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
839
+ SkyDropdownMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: SkyDropdownMenuComponent, selector: "sky-dropdown-menu", inputs: { ariaLabelledBy: "ariaLabelledBy", ariaRole: "ariaRole", useNativeFocus: "useNativeFocus" }, outputs: { menuChanges: "menuChanges" }, queries: [{ propertyName: "menuItems", predicate: SkyDropdownItemComponent, descendants: true }], ngImport: i0, template: "<div\n class=\"sky-dropdown-menu sky-shadow sky-elevation-4\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.role]=\"ariaRole\"\n [id]=\"dropdownMenuId\"\n>\n <ng-content> </ng-content>\n</div>\n", styles: [".sky-dropdown-menu{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px);display:flex;flex-direction:column;background-color:#fff}.sky-dropdown-menu button{overflow:hidden;text-overflow:ellipsis}.sky-theme-modern .sky-dropdown-menu{border-radius:6px;padding:10px 0}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-menu{background-color:#252a2e;color:#fff}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
840
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownMenuComponent, decorators: [{
858
841
  type: Component,
859
842
  args: [{ selector: 'sky-dropdown-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n class=\"sky-dropdown-menu sky-shadow sky-elevation-4\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n [attr.role]=\"ariaRole\"\n [id]=\"dropdownMenuId\"\n>\n <ng-content> </ng-content>\n</div>\n", styles: [".sky-dropdown-menu{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px);display:flex;flex-direction:column;background-color:#fff}.sky-dropdown-menu button{overflow:hidden;text-overflow:ellipsis}.sky-theme-modern .sky-dropdown-menu{border-radius:6px;padding:10px 0}.sky-theme-modern.sky-theme-mode-dark .sky-dropdown-menu{background-color:#252a2e;color:#fff}\n"] }]
860
843
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: SkyDropdownComponent, decorators: [{
@@ -874,8 +857,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
874
857
 
875
858
  class SkyDropdownModule {
876
859
  }
877
- SkyDropdownModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
878
- SkyDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownModule, declarations: [SkyDropdownButtonComponent,
860
+ SkyDropdownModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
861
+ SkyDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownModule, declarations: [SkyDropdownButtonComponent,
879
862
  SkyDropdownComponent,
880
863
  SkyDropdownItemComponent,
881
864
  SkyDropdownMenuComponent], imports: [CommonModule,
@@ -887,13 +870,13 @@ SkyDropdownModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versi
887
870
  SkyDropdownComponent,
888
871
  SkyDropdownItemComponent,
889
872
  SkyDropdownMenuComponent] });
890
- SkyDropdownModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownModule, imports: [CommonModule,
873
+ SkyDropdownModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownModule, imports: [CommonModule,
891
874
  SkyAffixModule,
892
875
  SkyIconModule,
893
876
  SkyOverlayModule,
894
877
  SkyPopoversResourcesModule,
895
878
  SkyThemeModule] });
896
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyDropdownModule, decorators: [{
879
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyDropdownModule, decorators: [{
897
880
  type: NgModule,
898
881
  args: [{
899
882
  declarations: [
@@ -985,9 +968,9 @@ class SkyPopoverAdapterService {
985
968
  return { top, left };
986
969
  }
987
970
  }
988
- SkyPopoverAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
989
- SkyPopoverAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverAdapterService });
990
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverAdapterService, decorators: [{
971
+ SkyPopoverAdapterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverAdapterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
972
+ SkyPopoverAdapterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverAdapterService });
973
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverAdapterService, decorators: [{
991
974
  type: Injectable
992
975
  }] });
993
976
 
@@ -1053,6 +1036,27 @@ var _SkyPopoverContentComponent_instances, _SkyPopoverContentComponent_caller, _
1053
1036
  * @internal
1054
1037
  */
1055
1038
  class SkyPopoverContentComponent {
1039
+ get closed() {
1040
+ return __classPrivateFieldGet(this, _SkyPopoverContentComponent__closed, "f").asObservable();
1041
+ }
1042
+ get opened() {
1043
+ return __classPrivateFieldGet(this, _SkyPopoverContentComponent__opened, "f").asObservable();
1044
+ }
1045
+ get isMouseEnter() {
1046
+ return __classPrivateFieldGet(this, _SkyPopoverContentComponent__isMouseEnter, "f").asObservable();
1047
+ }
1048
+ set isOpen(value) {
1049
+ __classPrivateFieldSet(this, _SkyPopoverContentComponent__isOpen, value, "f");
1050
+ this.animationState = value ? 'open' : 'closed';
1051
+ }
1052
+ get isOpen() {
1053
+ return __classPrivateFieldGet(this, _SkyPopoverContentComponent__isOpen, "f");
1054
+ }
1055
+ set contentTarget(value) {
1056
+ if (value) {
1057
+ value.createEmbeddedView(__classPrivateFieldGet(this, _SkyPopoverContentComponent_context, "f").contentTemplateRef);
1058
+ }
1059
+ }
1056
1060
  constructor(changeDetector, elementRef, affixService, coreAdapterService, adapterService, context, themeSvc) {
1057
1061
  _SkyPopoverContentComponent_instances.add(this);
1058
1062
  this.animationState = 'closed';
@@ -1082,27 +1086,6 @@ class SkyPopoverContentComponent {
1082
1086
  __classPrivateFieldSet(this, _SkyPopoverContentComponent_context, context, "f");
1083
1087
  __classPrivateFieldSet(this, _SkyPopoverContentComponent_themeSvc, themeSvc, "f");
1084
1088
  }
1085
- get closed() {
1086
- return __classPrivateFieldGet(this, _SkyPopoverContentComponent__closed, "f").asObservable();
1087
- }
1088
- get opened() {
1089
- return __classPrivateFieldGet(this, _SkyPopoverContentComponent__opened, "f").asObservable();
1090
- }
1091
- get isMouseEnter() {
1092
- return __classPrivateFieldGet(this, _SkyPopoverContentComponent__isMouseEnter, "f").asObservable();
1093
- }
1094
- set isOpen(value) {
1095
- __classPrivateFieldSet(this, _SkyPopoverContentComponent__isOpen, value, "f");
1096
- this.animationState = value ? 'open' : 'closed';
1097
- }
1098
- get isOpen() {
1099
- return __classPrivateFieldGet(this, _SkyPopoverContentComponent__isOpen, "f");
1100
- }
1101
- set contentTarget(value) {
1102
- if (value) {
1103
- value.createEmbeddedView(__classPrivateFieldGet(this, _SkyPopoverContentComponent_context, "f").contentTemplateRef);
1104
- }
1105
- }
1106
1089
  ngOnInit() {
1107
1090
  __classPrivateFieldGet(this, _SkyPopoverContentComponent_instances, "m", _SkyPopoverContentComponent_addEventListeners).call(this);
1108
1091
  /*istanbul ignore else*/
@@ -1271,12 +1254,12 @@ _SkyPopoverContentComponent_caller = new WeakMap(), _SkyPopoverContentComponent_
1271
1254
  }
1272
1255
  });
1273
1256
  };
1274
- SkyPopoverContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverContentComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.SkyAffixService }, { token: i1.SkyCoreAdapterService }, { token: SkyPopoverAdapterService }, { token: SkyPopoverContext }, { token: i2.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1275
- SkyPopoverContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SkyPopoverContentComponent, selector: "sky-popover-content", providers: [SkyPopoverAdapterService], viewQueries: [{ propertyName: "arrowRef", first: true, predicate: ["arrowRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "popoverRef", first: true, predicate: ["popoverRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "contentTarget", first: true, predicate: ["contentTarget"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div\n class=\"sky-popover-container sky-popover-max-height\"\n [@.disabled]=\"!enableAnimations\"\n [@skyPopoverAnimation]=\"animationState\"\n [class.sky-popover-hidden]=\"!placement\"\n [ngClass]=\"[\n 'sky-popover-alignment-' + horizontalAlignment,\n 'sky-popover-placement-' + placement,\n 'sky-popover-' + popoverType\n ]\"\n (@skyPopoverAnimation.done)=\"onAnimationEvent($event)\"\n (@skyPopoverAnimation.start)=\"onAnimationEvent($event)\"\n #popoverRef\n>\n <div\n class=\"sky-popover\"\n tabindex=\"-1\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners sky-shadow': 'default',\n 'sky-elevation-4': 'modern'\n }\"\n >\n <header\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-header\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg sky-margin-stacked-lg': 'modern'\n }\"\n >\n <h1\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-title\"\n [skyThemeClass]=\"{\n 'sky-emphasized': 'default',\n 'sky-font-emphasized': 'modern'\n }\"\n >\n {{ popoverTitle }}\n </h1>\n </header>\n <div\n class=\"sky-popover-body\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg': 'modern'\n }\"\n >\n <ng-container #contentTarget></ng-container>\n </div>\n <span\n aria-hidden=\"true\"\n class=\"sky-popover-arrow\"\n [style.left.px]=\"arrowLeft\"\n [style.top.px]=\"arrowTop\"\n #arrowRef\n ></span>\n </div>\n</div>\n", styles: [".sky-popover-container{position:fixed;min-width:276px;max-width:276px}.sky-popover-container.sky-popover-hidden{visibility:hidden;opacity:0;pointer-events:none!important}.sky-popover-container.sky-popover-hidden *{pointer-events:none!important}.sky-popover-container.sky-popover-static .sky-popover-arrow{position:absolute}.sky-popover-container:focus{outline:none}@media (max-width: 276px){.sky-popover-container{max-width:100%;min-width:auto}}.sky-popover{background-color:#fff}.sky-popover-header{padding-bottom:0}.sky-popover-header+.sky-popover-body{padding-top:2px}.sky-popover-title{margin:0}.sky-popover-arrow{width:0;height:0;position:fixed;border:10px solid transparent}.sky-popover-placement-above{padding-bottom:10px}.sky-popover-placement-above .sky-popover{border-bottom:10px solid #00b4f1}.sky-popover-placement-above .sky-popover-arrow{border-bottom:0;border-top-color:#00b4f1;bottom:0;left:50%;margin-left:-10px}.sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044}.sky-popover-placement-below{padding-top:10px}.sky-popover-placement-below .sky-popover{border-top:10px solid #00b4f1}.sky-popover-placement-below .sky-popover-arrow{border-top:0;border-bottom-color:#00b4f1;top:0;left:50%;margin-left:-10px}.sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044}.sky-popover-placement-right{padding-left:10px}.sky-popover-placement-right .sky-popover{border-left:10px solid #00b4f1}.sky-popover-placement-right .sky-popover-arrow{border-left:0;border-right-color:#00b4f1;left:0;top:50%;margin-top:-10px}.sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-right-color:#ef4044}.sky-popover-placement-left{padding-right:10px}.sky-popover-placement-left .sky-popover{border-right:10px solid #00b4f1}.sky-popover-placement-left .sky-popover-arrow{border-right:0;border-left-color:#00b4f1;right:0;top:50%;margin-top:-10px}.sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-left-color:#ef4044}.sky-popover-placement-above.sky-popover-alignment-left .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-left .sky-popover-arrow{left:40px;right:auto}.sky-popover-placement-above.sky-popover-alignment-right .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-right .sky-popover-arrow{left:auto;right:40px}.sky-popover-max-height .sky-popover{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px)}:host-context(.sky-theme-modern) .sky-popover{border-radius:6px}:host-context(.sky-theme-modern) .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-above{padding-bottom:10px}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-below{padding-top:10px}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-right{padding-left:10px}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-left{padding-right:10px}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover{border-radius:6px}.sky-theme-modern .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}.sky-theme-modern .sky-popover-placement-above{padding-bottom:10px}.sky-theme-modern .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover-placement-below{padding-top:10px}.sky-theme-modern .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-right{padding-left:10px}.sky-theme-modern .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-left{padding-right:10px}.sky-theme-modern .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], animations: [skyPopoverAnimation] });
1276
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverContentComponent, decorators: [{
1257
+ SkyPopoverContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverContentComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1$1.SkyAffixService }, { token: i1$1.SkyCoreAdapterService }, { token: SkyPopoverAdapterService }, { token: SkyPopoverContext }, { token: i4.SkyThemeService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1258
+ SkyPopoverContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: SkyPopoverContentComponent, selector: "sky-popover-content", providers: [SkyPopoverAdapterService], viewQueries: [{ propertyName: "arrowRef", first: true, predicate: ["arrowRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "popoverRef", first: true, predicate: ["popoverRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "contentTarget", first: true, predicate: ["contentTarget"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div\n class=\"sky-popover-container sky-popover-max-height\"\n [@.disabled]=\"!enableAnimations\"\n [@skyPopoverAnimation]=\"animationState\"\n [class.sky-popover-hidden]=\"!placement\"\n [ngClass]=\"[\n 'sky-popover-alignment-' + horizontalAlignment,\n 'sky-popover-placement-' + placement,\n 'sky-popover-' + popoverType\n ]\"\n (@skyPopoverAnimation.done)=\"onAnimationEvent($event)\"\n (@skyPopoverAnimation.start)=\"onAnimationEvent($event)\"\n #popoverRef\n>\n <div\n class=\"sky-popover\"\n tabindex=\"-1\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners sky-shadow': 'default',\n 'sky-elevation-4': 'modern'\n }\"\n >\n <header\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-header\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg sky-margin-stacked-lg': 'modern'\n }\"\n >\n <h1\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-title\"\n [skyThemeClass]=\"{\n 'sky-font-heading-4': 'default',\n 'sky-font-emphasized': 'modern'\n }\"\n >\n {{ popoverTitle }}\n </h1>\n </header>\n <div\n class=\"sky-popover-body\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg': 'modern'\n }\"\n >\n <ng-container #contentTarget></ng-container>\n </div>\n <span\n aria-hidden=\"true\"\n class=\"sky-popover-arrow\"\n [style.left.px]=\"arrowLeft\"\n [style.top.px]=\"arrowTop\"\n #arrowRef\n ></span>\n </div>\n</div>\n", styles: [".sky-popover-container{position:fixed;min-width:276px;max-width:276px}.sky-popover-container.sky-popover-hidden{visibility:hidden;opacity:0;pointer-events:none!important}.sky-popover-container.sky-popover-hidden *{pointer-events:none!important}.sky-popover-container.sky-popover-static .sky-popover-arrow{position:absolute}.sky-popover-container:focus{outline:none}@media (max-width: 276px){.sky-popover-container{max-width:100%;min-width:auto}}.sky-popover{background-color:#fff}.sky-popover-header{padding-bottom:0}.sky-popover-header+.sky-popover-body{padding-top:2px}.sky-popover-title{margin:0}.sky-popover-arrow{width:0;height:0;position:fixed;border:10px solid transparent}.sky-popover-placement-above{padding-bottom:10px}.sky-popover-placement-above .sky-popover{border-bottom:10px solid #00b4f1}.sky-popover-placement-above .sky-popover-arrow{border-bottom:0;border-top-color:#00b4f1;bottom:0;left:50%;margin-left:-10px}.sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044}.sky-popover-placement-below{padding-top:10px}.sky-popover-placement-below .sky-popover{border-top:10px solid #00b4f1}.sky-popover-placement-below .sky-popover-arrow{border-top:0;border-bottom-color:#00b4f1;top:0;left:50%;margin-left:-10px}.sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044}.sky-popover-placement-right{padding-left:10px}.sky-popover-placement-right .sky-popover{border-left:10px solid #00b4f1}.sky-popover-placement-right .sky-popover-arrow{border-left:0;border-right-color:#00b4f1;left:0;top:50%;margin-top:-10px}.sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-right-color:#ef4044}.sky-popover-placement-left{padding-right:10px}.sky-popover-placement-left .sky-popover{border-right:10px solid #00b4f1}.sky-popover-placement-left .sky-popover-arrow{border-right:0;border-left-color:#00b4f1;right:0;top:50%;margin-top:-10px}.sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-left-color:#ef4044}.sky-popover-placement-above.sky-popover-alignment-left .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-left .sky-popover-arrow{left:40px;right:auto}.sky-popover-placement-above.sky-popover-alignment-right .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-right .sky-popover-arrow{left:auto;right:40px}.sky-popover-max-height .sky-popover{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px)}:host-context(.sky-theme-modern) .sky-popover{border-radius:6px}:host-context(.sky-theme-modern) .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-above{padding-bottom:10px}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-below{padding-top:10px}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-right{padding-left:10px}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-left{padding-right:10px}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover{border-radius:6px}.sky-theme-modern .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}.sky-theme-modern .sky-popover-placement-above{padding-bottom:10px}.sky-theme-modern .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover-placement-below{padding-top:10px}.sky-theme-modern .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-right{padding-left:10px}.sky-theme-modern .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-left{padding-right:10px}.sky-theme-modern .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }], animations: [skyPopoverAnimation] });
1259
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverContentComponent, decorators: [{
1277
1260
  type: Component,
1278
- args: [{ selector: 'sky-popover-content', animations: [skyPopoverAnimation], providers: [SkyPopoverAdapterService], template: "<div\n class=\"sky-popover-container sky-popover-max-height\"\n [@.disabled]=\"!enableAnimations\"\n [@skyPopoverAnimation]=\"animationState\"\n [class.sky-popover-hidden]=\"!placement\"\n [ngClass]=\"[\n 'sky-popover-alignment-' + horizontalAlignment,\n 'sky-popover-placement-' + placement,\n 'sky-popover-' + popoverType\n ]\"\n (@skyPopoverAnimation.done)=\"onAnimationEvent($event)\"\n (@skyPopoverAnimation.start)=\"onAnimationEvent($event)\"\n #popoverRef\n>\n <div\n class=\"sky-popover\"\n tabindex=\"-1\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners sky-shadow': 'default',\n 'sky-elevation-4': 'modern'\n }\"\n >\n <header\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-header\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg sky-margin-stacked-lg': 'modern'\n }\"\n >\n <h1\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-title\"\n [skyThemeClass]=\"{\n 'sky-emphasized': 'default',\n 'sky-font-emphasized': 'modern'\n }\"\n >\n {{ popoverTitle }}\n </h1>\n </header>\n <div\n class=\"sky-popover-body\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg': 'modern'\n }\"\n >\n <ng-container #contentTarget></ng-container>\n </div>\n <span\n aria-hidden=\"true\"\n class=\"sky-popover-arrow\"\n [style.left.px]=\"arrowLeft\"\n [style.top.px]=\"arrowTop\"\n #arrowRef\n ></span>\n </div>\n</div>\n", styles: [".sky-popover-container{position:fixed;min-width:276px;max-width:276px}.sky-popover-container.sky-popover-hidden{visibility:hidden;opacity:0;pointer-events:none!important}.sky-popover-container.sky-popover-hidden *{pointer-events:none!important}.sky-popover-container.sky-popover-static .sky-popover-arrow{position:absolute}.sky-popover-container:focus{outline:none}@media (max-width: 276px){.sky-popover-container{max-width:100%;min-width:auto}}.sky-popover{background-color:#fff}.sky-popover-header{padding-bottom:0}.sky-popover-header+.sky-popover-body{padding-top:2px}.sky-popover-title{margin:0}.sky-popover-arrow{width:0;height:0;position:fixed;border:10px solid transparent}.sky-popover-placement-above{padding-bottom:10px}.sky-popover-placement-above .sky-popover{border-bottom:10px solid #00b4f1}.sky-popover-placement-above .sky-popover-arrow{border-bottom:0;border-top-color:#00b4f1;bottom:0;left:50%;margin-left:-10px}.sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044}.sky-popover-placement-below{padding-top:10px}.sky-popover-placement-below .sky-popover{border-top:10px solid #00b4f1}.sky-popover-placement-below .sky-popover-arrow{border-top:0;border-bottom-color:#00b4f1;top:0;left:50%;margin-left:-10px}.sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044}.sky-popover-placement-right{padding-left:10px}.sky-popover-placement-right .sky-popover{border-left:10px solid #00b4f1}.sky-popover-placement-right .sky-popover-arrow{border-left:0;border-right-color:#00b4f1;left:0;top:50%;margin-top:-10px}.sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-right-color:#ef4044}.sky-popover-placement-left{padding-right:10px}.sky-popover-placement-left .sky-popover{border-right:10px solid #00b4f1}.sky-popover-placement-left .sky-popover-arrow{border-right:0;border-left-color:#00b4f1;right:0;top:50%;margin-top:-10px}.sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-left-color:#ef4044}.sky-popover-placement-above.sky-popover-alignment-left .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-left .sky-popover-arrow{left:40px;right:auto}.sky-popover-placement-above.sky-popover-alignment-right .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-right .sky-popover-arrow{left:auto;right:40px}.sky-popover-max-height .sky-popover{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px)}:host-context(.sky-theme-modern) .sky-popover{border-radius:6px}:host-context(.sky-theme-modern) .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-above{padding-bottom:10px}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-below{padding-top:10px}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-right{padding-left:10px}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-left{padding-right:10px}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover{border-radius:6px}.sky-theme-modern .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}.sky-theme-modern .sky-popover-placement-above{padding-bottom:10px}.sky-theme-modern .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover-placement-below{padding-top:10px}.sky-theme-modern .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-right{padding-left:10px}.sky-theme-modern .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-left{padding-right:10px}.sky-theme-modern .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}\n"] }]
1279
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1.SkyAffixService }, { type: i1.SkyCoreAdapterService }, { type: SkyPopoverAdapterService }, { type: SkyPopoverContext }, { type: i2.SkyThemeService, decorators: [{
1261
+ args: [{ selector: 'sky-popover-content', animations: [skyPopoverAnimation], providers: [SkyPopoverAdapterService], template: "<div\n class=\"sky-popover-container sky-popover-max-height\"\n [@.disabled]=\"!enableAnimations\"\n [@skyPopoverAnimation]=\"animationState\"\n [class.sky-popover-hidden]=\"!placement\"\n [ngClass]=\"[\n 'sky-popover-alignment-' + horizontalAlignment,\n 'sky-popover-placement-' + placement,\n 'sky-popover-' + popoverType\n ]\"\n (@skyPopoverAnimation.done)=\"onAnimationEvent($event)\"\n (@skyPopoverAnimation.start)=\"onAnimationEvent($event)\"\n #popoverRef\n>\n <div\n class=\"sky-popover\"\n tabindex=\"-1\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners sky-shadow': 'default',\n 'sky-elevation-4': 'modern'\n }\"\n >\n <header\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-header\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg sky-margin-stacked-lg': 'modern'\n }\"\n >\n <h1\n *ngIf=\"popoverTitle\"\n class=\"sky-popover-title\"\n [skyThemeClass]=\"{\n 'sky-font-heading-4': 'default',\n 'sky-font-emphasized': 'modern'\n }\"\n >\n {{ popoverTitle }}\n </h1>\n </header>\n <div\n class=\"sky-popover-body\"\n [skyThemeClass]=\"{\n 'sky-padding-even-default': 'default',\n 'sky-padding-even-lg': 'modern'\n }\"\n >\n <ng-container #contentTarget></ng-container>\n </div>\n <span\n aria-hidden=\"true\"\n class=\"sky-popover-arrow\"\n [style.left.px]=\"arrowLeft\"\n [style.top.px]=\"arrowTop\"\n #arrowRef\n ></span>\n </div>\n</div>\n", styles: [".sky-popover-container{position:fixed;min-width:276px;max-width:276px}.sky-popover-container.sky-popover-hidden{visibility:hidden;opacity:0;pointer-events:none!important}.sky-popover-container.sky-popover-hidden *{pointer-events:none!important}.sky-popover-container.sky-popover-static .sky-popover-arrow{position:absolute}.sky-popover-container:focus{outline:none}@media (max-width: 276px){.sky-popover-container{max-width:100%;min-width:auto}}.sky-popover{background-color:#fff}.sky-popover-header{padding-bottom:0}.sky-popover-header+.sky-popover-body{padding-top:2px}.sky-popover-title{margin:0}.sky-popover-arrow{width:0;height:0;position:fixed;border:10px solid transparent}.sky-popover-placement-above{padding-bottom:10px}.sky-popover-placement-above .sky-popover{border-bottom:10px solid #00b4f1}.sky-popover-placement-above .sky-popover-arrow{border-bottom:0;border-top-color:#00b4f1;bottom:0;left:50%;margin-left:-10px}.sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044}.sky-popover-placement-below{padding-top:10px}.sky-popover-placement-below .sky-popover{border-top:10px solid #00b4f1}.sky-popover-placement-below .sky-popover-arrow{border-top:0;border-bottom-color:#00b4f1;top:0;left:50%;margin-left:-10px}.sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044}.sky-popover-placement-right{padding-left:10px}.sky-popover-placement-right .sky-popover{border-left:10px solid #00b4f1}.sky-popover-placement-right .sky-popover-arrow{border-left:0;border-right-color:#00b4f1;left:0;top:50%;margin-top:-10px}.sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-right-color:#ef4044}.sky-popover-placement-left{padding-right:10px}.sky-popover-placement-left .sky-popover{border-right:10px solid #00b4f1}.sky-popover-placement-left .sky-popover-arrow{border-right:0;border-left-color:#00b4f1;right:0;top:50%;margin-top:-10px}.sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-left-color:#ef4044}.sky-popover-placement-above.sky-popover-alignment-left .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-left .sky-popover-arrow{left:40px;right:auto}.sky-popover-placement-above.sky-popover-alignment-right .sky-popover-arrow,.sky-popover-placement-below.sky-popover-alignment-right .sky-popover-arrow{left:auto;right:40px}.sky-popover-max-height .sky-popover{overflow-y:auto;overflow-x:hidden;min-height:35px;max-height:calc(50vh - 50px)}:host-context(.sky-theme-modern) .sky-popover{border-radius:6px}:host-context(.sky-theme-modern) .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-above{padding-bottom:10px}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-below{padding-top:10px}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-right{padding-left:10px}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}:host-context(.sky-theme-modern) .sky-popover-placement-left{padding-right:10px}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}:host-context(.sky-theme-modern) .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover{border-radius:6px}.sky-theme-modern .sky-popover-arrow{transform:rotate(45deg);border-color:transparent}.sky-theme-modern .sky-popover-placement-above{padding-bottom:10px}.sky-theme-modern .sky-popover-placement-above .sky-popover{border-bottom:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-above .sky-popover-arrow{bottom:1px;border-radius:0 0 3px;border-bottom:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover{border-bottom-color:#ef4044}.sky-theme-modern .sky-popover-placement-above.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-right-color:#ef4044;border-top-color:transparent;border-left-color:transparent}.sky-theme-modern .sky-popover-placement-below{padding-top:10px}.sky-theme-modern .sky-popover-placement-below .sky-popover{border-top:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-below .sky-popover-arrow{top:1px;border-radius:3px 0 0;border-top:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover{border-top-color:#ef4044}.sky-theme-modern .sky-popover-placement-below.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-left-color:#ef4044;border-bottom-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-right{padding-left:10px}.sky-theme-modern .sky-popover-placement-right .sky-popover{border-left:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-right .sky-popover-arrow{left:1px;border-radius:0 0 0 3px;border-bottom:solid 10px #00b4f1;border-left:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover{border-left-color:#ef4044}.sky-theme-modern .sky-popover-placement-right.sky-popover-danger .sky-popover-arrow{border-bottom-color:#ef4044;border-left-color:#ef4044;border-top-color:transparent;border-right-color:transparent}.sky-theme-modern .sky-popover-placement-left{padding-right:10px}.sky-theme-modern .sky-popover-placement-left .sky-popover{border-right:6px solid #00b4f1}.sky-theme-modern .sky-popover-placement-left .sky-popover-arrow{right:1px;border-radius:0 3px 0 0;border-top:solid 10px #00b4f1;border-right:solid 10px #00b4f1}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover{border-right-color:#ef4044}.sky-theme-modern .sky-popover-placement-left.sky-popover-danger .sky-popover-arrow{border-top-color:#ef4044;border-right-color:#ef4044;border-bottom-color:transparent;border-left-color:transparent}\n"] }]
1262
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1$1.SkyAffixService }, { type: i1$1.SkyCoreAdapterService }, { type: SkyPopoverAdapterService }, { type: SkyPopoverContext }, { type: i4.SkyThemeService, decorators: [{
1280
1263
  type: Optional
1281
1264
  }] }]; }, propDecorators: { arrowRef: [{
1282
1265
  type: ViewChild,
@@ -1300,41 +1283,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
1300
1283
 
1301
1284
  var _SkyPopoverComponent_instances, _SkyPopoverComponent_contentRef, _SkyPopoverComponent_isMarkedForCloseOnMouseLeave, _SkyPopoverComponent_ngUnsubscribe, _SkyPopoverComponent_overlay, _SkyPopoverComponent__alignment, _SkyPopoverComponent__dismissOnBlur, _SkyPopoverComponent__placement, _SkyPopoverComponent__popoverType, _SkyPopoverComponent_overlayService, _SkyPopoverComponent_zIndex, _SkyPopoverComponent_setupOverlay;
1302
1285
  class SkyPopoverComponent {
1303
- constructor(overlayService, stackingContext) {
1304
- _SkyPopoverComponent_instances.add(this);
1305
- /**
1306
- * Fires when users close the popover.
1307
- */
1308
- this.popoverClosed = new EventEmitter();
1309
- /**
1310
- * Fires when users open the popover.
1311
- */
1312
- this.popoverOpened = new EventEmitter();
1313
- /**
1314
- * Whether the popover is in the process of being opened or closed.
1315
- * @internal
1316
- */
1317
- this.isActive = false;
1318
- /**
1319
- * Used by unit tests to disable animations since the component is injected at the bottom of the
1320
- * document body.
1321
- * @internal
1322
- */
1323
- this.enableAnimations = true;
1324
- this.isMouseEnter = false;
1325
- _SkyPopoverComponent_contentRef.set(this, void 0);
1326
- _SkyPopoverComponent_isMarkedForCloseOnMouseLeave.set(this, false);
1327
- _SkyPopoverComponent_ngUnsubscribe.set(this, new Subject());
1328
- _SkyPopoverComponent_overlay.set(this, void 0);
1329
- _SkyPopoverComponent__alignment.set(this, 'center');
1330
- _SkyPopoverComponent__dismissOnBlur.set(this, true);
1331
- _SkyPopoverComponent__placement.set(this, 'above');
1332
- _SkyPopoverComponent__popoverType.set(this, 'info');
1333
- _SkyPopoverComponent_overlayService.set(this, void 0);
1334
- _SkyPopoverComponent_zIndex.set(this, void 0);
1335
- __classPrivateFieldSet(this, _SkyPopoverComponent_overlayService, overlayService, "f");
1336
- __classPrivateFieldSet(this, _SkyPopoverComponent_zIndex, stackingContext?.zIndex, "f");
1337
- }
1338
1286
  /**
1339
1287
  * The horizontal alignment of the popover in relation to the trigger element.
1340
1288
  * The `skyPopoverAlignment` property on the popover directive takes precedence over this property when specified.
@@ -1378,6 +1326,41 @@ class SkyPopoverComponent {
1378
1326
  get popoverType() {
1379
1327
  return __classPrivateFieldGet(this, _SkyPopoverComponent__popoverType, "f");
1380
1328
  }
1329
+ constructor(overlayService, stackingContext) {
1330
+ _SkyPopoverComponent_instances.add(this);
1331
+ /**
1332
+ * Fires when users close the popover.
1333
+ */
1334
+ this.popoverClosed = new EventEmitter();
1335
+ /**
1336
+ * Fires when users open the popover.
1337
+ */
1338
+ this.popoverOpened = new EventEmitter();
1339
+ /**
1340
+ * Whether the popover is in the process of being opened or closed.
1341
+ * @internal
1342
+ */
1343
+ this.isActive = false;
1344
+ /**
1345
+ * Used by unit tests to disable animations since the component is injected at the bottom of the
1346
+ * document body.
1347
+ * @internal
1348
+ */
1349
+ this.enableAnimations = true;
1350
+ this.isMouseEnter = false;
1351
+ _SkyPopoverComponent_contentRef.set(this, void 0);
1352
+ _SkyPopoverComponent_isMarkedForCloseOnMouseLeave.set(this, false);
1353
+ _SkyPopoverComponent_ngUnsubscribe.set(this, new Subject());
1354
+ _SkyPopoverComponent_overlay.set(this, void 0);
1355
+ _SkyPopoverComponent__alignment.set(this, 'center');
1356
+ _SkyPopoverComponent__dismissOnBlur.set(this, true);
1357
+ _SkyPopoverComponent__placement.set(this, 'above');
1358
+ _SkyPopoverComponent__popoverType.set(this, 'info');
1359
+ _SkyPopoverComponent_overlayService.set(this, void 0);
1360
+ _SkyPopoverComponent_zIndex.set(this, void 0);
1361
+ __classPrivateFieldSet(this, _SkyPopoverComponent_overlayService, overlayService, "f");
1362
+ __classPrivateFieldSet(this, _SkyPopoverComponent_zIndex, stackingContext?.zIndex, "f");
1363
+ }
1381
1364
  ngOnDestroy() {
1382
1365
  __classPrivateFieldGet(this, _SkyPopoverComponent_ngUnsubscribe, "f").next();
1383
1366
  __classPrivateFieldGet(this, _SkyPopoverComponent_ngUnsubscribe, "f").complete();
@@ -1487,12 +1470,12 @@ _SkyPopoverComponent_contentRef = new WeakMap(), _SkyPopoverComponent_isMarkedFo
1487
1470
  __classPrivateFieldSet(this, _SkyPopoverComponent_contentRef, contentRef, "f");
1488
1471
  }
1489
1472
  };
1490
- SkyPopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverComponent, deps: [{ token: i1.SkyOverlayService }, { token: SKY_STACKING_CONTEXT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1491
- SkyPopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: SkyPopoverComponent, selector: "sky-popover", inputs: { alignment: "alignment", dismissOnBlur: "dismissOnBlur", placement: "placement", popoverTitle: "popoverTitle", popoverType: "popoverType" }, outputs: { popoverClosed: "popoverClosed", popoverOpened: "popoverOpened" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<ng-template #templateRef>\n <ng-content></ng-content>\n</ng-template>\n" });
1492
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverComponent, decorators: [{
1473
+ SkyPopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverComponent, deps: [{ token: i1$1.SkyOverlayService }, { token: SKY_STACKING_CONTEXT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1474
+ SkyPopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: SkyPopoverComponent, selector: "sky-popover", inputs: { alignment: "alignment", dismissOnBlur: "dismissOnBlur", placement: "placement", popoverTitle: "popoverTitle", popoverType: "popoverType" }, outputs: { popoverClosed: "popoverClosed", popoverOpened: "popoverOpened" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["templateRef"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<ng-template #templateRef>\n <ng-content></ng-content>\n</ng-template>\n" });
1475
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverComponent, decorators: [{
1493
1476
  type: Component,
1494
1477
  args: [{ selector: 'sky-popover', template: "<ng-template #templateRef>\n <ng-content></ng-content>\n</ng-template>\n" }]
1495
- }], ctorParameters: function () { return [{ type: i1.SkyOverlayService }, { type: undefined, decorators: [{
1478
+ }], ctorParameters: function () { return [{ type: i1$1.SkyOverlayService }, { type: undefined, decorators: [{
1496
1479
  type: Optional
1497
1480
  }, {
1498
1481
  type: Inject,
@@ -1545,16 +1528,6 @@ var SkyPopoverMessageType;
1545
1528
 
1546
1529
  var _SkyPopoverDirective_instances, _SkyPopoverDirective__skyPopoverMessageStream, _SkyPopoverDirective_messageStreamSub, _SkyPopoverDirective_ngUnsubscribe, _SkyPopoverDirective__trigger, _SkyPopoverDirective_elementRef, _SkyPopoverDirective_positionPopover, _SkyPopoverDirective_closePopover, _SkyPopoverDirective_closePopoverOrMarkForClose, _SkyPopoverDirective_addEventListeners, _SkyPopoverDirective_removeEventListeners, _SkyPopoverDirective_handleIncomingMessages, _SkyPopoverDirective_sendMessage, _SkyPopoverDirective_subscribeMessageStream, _SkyPopoverDirective_unsubscribeMessageStream;
1547
1530
  class SkyPopoverDirective {
1548
- constructor(elementRef) {
1549
- _SkyPopoverDirective_instances.add(this);
1550
- _SkyPopoverDirective__skyPopoverMessageStream.set(this, new Subject());
1551
- _SkyPopoverDirective_messageStreamSub.set(this, void 0);
1552
- _SkyPopoverDirective_ngUnsubscribe.set(this, new Subject());
1553
- _SkyPopoverDirective__trigger.set(this, 'click');
1554
- _SkyPopoverDirective_elementRef.set(this, void 0);
1555
- __classPrivateFieldSet(this, _SkyPopoverDirective_elementRef, elementRef, "f");
1556
- __classPrivateFieldGet(this, _SkyPopoverDirective_instances, "m", _SkyPopoverDirective_subscribeMessageStream).call(this);
1557
- }
1558
1531
  /**
1559
1532
  * The RxJS `Subject` to send commands to the popover that respect the `SkyPopoverMessage` type.
1560
1533
  */
@@ -1574,6 +1547,16 @@ class SkyPopoverDirective {
1574
1547
  get skyPopoverTrigger() {
1575
1548
  return __classPrivateFieldGet(this, _SkyPopoverDirective__trigger, "f");
1576
1549
  }
1550
+ constructor(elementRef) {
1551
+ _SkyPopoverDirective_instances.add(this);
1552
+ _SkyPopoverDirective__skyPopoverMessageStream.set(this, new Subject());
1553
+ _SkyPopoverDirective_messageStreamSub.set(this, void 0);
1554
+ _SkyPopoverDirective_ngUnsubscribe.set(this, new Subject());
1555
+ _SkyPopoverDirective__trigger.set(this, 'click');
1556
+ _SkyPopoverDirective_elementRef.set(this, void 0);
1557
+ __classPrivateFieldSet(this, _SkyPopoverDirective_elementRef, elementRef, "f");
1558
+ __classPrivateFieldGet(this, _SkyPopoverDirective_instances, "m", _SkyPopoverDirective_subscribeMessageStream).call(this);
1559
+ }
1577
1560
  ngOnInit() {
1578
1561
  __classPrivateFieldGet(this, _SkyPopoverDirective_instances, "m", _SkyPopoverDirective_addEventListeners).call(this);
1579
1562
  }
@@ -1704,9 +1687,9 @@ _SkyPopoverDirective__skyPopoverMessageStream = new WeakMap(), _SkyPopoverDirect
1704
1687
  __classPrivateFieldSet(this, _SkyPopoverDirective_messageStreamSub, undefined, "f");
1705
1688
  }
1706
1689
  };
1707
- SkyPopoverDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
1708
- SkyPopoverDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.4", type: SkyPopoverDirective, selector: "[skyPopover]", inputs: { skyPopover: "skyPopover", skyPopoverAlignment: "skyPopoverAlignment", skyPopoverMessageStream: "skyPopoverMessageStream", skyPopoverPlacement: "skyPopoverPlacement", skyPopoverTrigger: "skyPopoverTrigger" }, ngImport: i0 });
1709
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverDirective, decorators: [{
1690
+ SkyPopoverDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
1691
+ SkyPopoverDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: SkyPopoverDirective, selector: "[skyPopover]", inputs: { skyPopover: "skyPopover", skyPopoverAlignment: "skyPopoverAlignment", skyPopoverMessageStream: "skyPopoverMessageStream", skyPopoverPlacement: "skyPopoverPlacement", skyPopoverTrigger: "skyPopoverTrigger" }, ngImport: i0 });
1692
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverDirective, decorators: [{
1710
1693
  type: Directive,
1711
1694
  args: [{
1712
1695
  selector: '[skyPopover]',
@@ -1725,8 +1708,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImpor
1725
1708
 
1726
1709
  class SkyPopoverModule {
1727
1710
  }
1728
- SkyPopoverModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1729
- SkyPopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverModule, declarations: [SkyPopoverComponent,
1711
+ SkyPopoverModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
1712
+ SkyPopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverModule, declarations: [SkyPopoverComponent,
1730
1713
  SkyPopoverContentComponent,
1731
1714
  SkyPopoverDirective], imports: [CommonModule,
1732
1715
  SkyAffixModule,
@@ -1736,13 +1719,13 @@ SkyPopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
1736
1719
  SkyThemeModule], exports: [SkyPopoverComponent,
1737
1720
  SkyPopoverContentComponent,
1738
1721
  SkyPopoverDirective] });
1739
- SkyPopoverModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverModule, imports: [CommonModule,
1722
+ SkyPopoverModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverModule, imports: [CommonModule,
1740
1723
  SkyAffixModule,
1741
1724
  SkyIconModule,
1742
1725
  SkyOverlayModule,
1743
1726
  SkyPopoversResourcesModule,
1744
1727
  SkyThemeModule] });
1745
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: SkyPopoverModule, decorators: [{
1728
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: SkyPopoverModule, decorators: [{
1746
1729
  type: NgModule,
1747
1730
  args: [{
1748
1731
  declarations: [