@skyux/popovers 5.0.0 → 5.0.1

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/bundles/skyux-popovers-testing.umd.js +20 -32
  2. package/bundles/skyux-popovers-testing.umd.js.map +1 -1
  3. package/bundles/skyux-popovers.umd.js +137 -152
  4. package/bundles/skyux-popovers.umd.js.map +1 -1
  5. package/documentation.json +114 -109
  6. package/esm2015/modules/dropdown/dropdown-button.component.js +5 -5
  7. package/esm2015/modules/dropdown/dropdown-extensions.js +1 -1
  8. package/esm2015/modules/dropdown/dropdown-item.component.js +8 -8
  9. package/esm2015/modules/dropdown/dropdown-menu.component.js +14 -14
  10. package/esm2015/modules/dropdown/dropdown.component.js +14 -16
  11. package/esm2015/modules/dropdown/dropdown.module.js +10 -10
  12. package/esm2015/modules/dropdown/types/dropdown-horizontal-alignment.js +1 -1
  13. package/esm2015/modules/dropdown/types/dropdown-menu-change.js +1 -1
  14. package/esm2015/modules/dropdown/types/dropdown-message-type.js +1 -1
  15. package/esm2015/modules/dropdown/types/dropdown-message.js +1 -1
  16. package/esm2015/modules/popover/popover-adapter.service.js +6 -6
  17. package/esm2015/modules/popover/popover-animation.js +8 -14
  18. package/esm2015/modules/popover/popover-content.component.js +25 -30
  19. package/esm2015/modules/popover/popover-context.js +1 -1
  20. package/esm2015/modules/popover/popover-extensions.js +1 -1
  21. package/esm2015/modules/popover/popover.component.js +18 -22
  22. package/esm2015/modules/popover/popover.directive.js +6 -6
  23. package/esm2015/modules/popover/popover.module.js +10 -12
  24. package/esm2015/modules/popover/types/popover-adapter-elements.js +1 -1
  25. package/esm2015/modules/popover/types/popover-message-type.js +1 -1
  26. package/esm2015/modules/popover/types/popover-message.js +1 -1
  27. package/esm2015/modules/shared/sky-popovers-resources.module.js +18 -12
  28. package/esm2015/testing/dropdown/dropdown-fixture.js +4 -4
  29. package/esm2015/testing/dropdown/dropdown-testing.module.js +6 -8
  30. package/esm2015/testing/popover/popover-fixture.js +4 -8
  31. package/esm2015/testing/popover/popover-testing.module.js +7 -11
  32. package/fesm2015/skyux-popovers-testing.js +17 -27
  33. package/fesm2015/skyux-popovers-testing.js.map +1 -1
  34. package/fesm2015/skyux-popovers.js +120 -133
  35. package/fesm2015/skyux-popovers.js.map +1 -1
  36. package/package.json +8 -8
@@ -2,7 +2,7 @@
2
2
  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@skyux/core'), require('@skyux/indicators'), require('@skyux/theme'), require('@skyux/i18n'), require('rxjs'), require('rxjs/operators'), require('@angular/animations')) :
3
3
  typeof define === 'function' && define.amd ? define('@skyux/popovers', ['exports', '@angular/common', '@angular/core', '@skyux/core', '@skyux/indicators', '@skyux/theme', '@skyux/i18n', 'rxjs', 'rxjs/operators', '@angular/animations'], factory) :
4
4
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.skyux = global.skyux || {}, global.skyux.popovers = {}), global.ng.common, global.ng.core, global.i1, global.i3, global.i2, global.i5, global.rxjs, global.rxjs.operators, global.ng.animations));
5
- }(this, (function (exports, i4, i0, i1, i3, i2, i5, rxjs, operators, animations) { 'use strict';
5
+ })(this, (function (exports, i4, i0, i1, i3, i2, i5, rxjs, operators, animations) { 'use strict';
6
6
 
7
7
  function _interopNamespace(e) {
8
8
  if (e && e.__esModule) return e;
@@ -13,14 +13,12 @@
13
13
  var d = Object.getOwnPropertyDescriptor(e, k);
14
14
  Object.defineProperty(n, k, d.get ? d : {
15
15
  enumerable: true,
16
- get: function () {
17
- return e[k];
18
- }
16
+ get: function () { return e[k]; }
19
17
  });
20
18
  }
21
19
  });
22
20
  }
23
- n['default'] = e;
21
+ n["default"] = e;
24
22
  return Object.freeze(n);
25
23
  }
26
24
 
@@ -75,7 +73,9 @@
75
73
  * To update this file, simply rerun the command.
76
74
  */
77
75
  var RESOURCES = {
78
- 'EN-US': { "skyux_dropdown_context_menu_default_label": { "message": "Context menu" } },
76
+ 'EN-US': {
77
+ skyux_dropdown_context_menu_default_label: { message: 'Context menu' },
78
+ },
79
79
  };
80
80
  var SkyPopoversResourcesProvider = /** @class */ (function () {
81
81
  function SkyPopoversResourcesProvider() {
@@ -93,22 +93,26 @@
93
93
  }
94
94
  return SkyPopoversResourcesModule;
95
95
  }());
96
- SkyPopoversResourcesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoversResourcesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
97
- SkyPopoversResourcesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoversResourcesModule, exports: [i5.SkyI18nModule] });
98
- SkyPopoversResourcesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoversResourcesModule, providers: [{
96
+ SkyPopoversResourcesModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoversResourcesModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
97
+ SkyPopoversResourcesModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoversResourcesModule, exports: [i5.SkyI18nModule] });
98
+ SkyPopoversResourcesModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoversResourcesModule, providers: [
99
+ {
99
100
  provide: i5.SKY_LIB_RESOURCES_PROVIDERS,
100
101
  useClass: SkyPopoversResourcesProvider,
101
- multi: true
102
- }], imports: [i5.SkyI18nModule] });
103
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoversResourcesModule, decorators: [{
102
+ multi: true,
103
+ },
104
+ ], imports: [i5.SkyI18nModule] });
105
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoversResourcesModule, decorators: [{
104
106
  type: i0.NgModule,
105
107
  args: [{
106
108
  exports: [i5.SkyI18nModule],
107
- providers: [{
109
+ providers: [
110
+ {
108
111
  provide: i5.SKY_LIB_RESOURCES_PROVIDERS,
109
112
  useClass: SkyPopoversResourcesProvider,
110
- multi: true
111
- }]
113
+ multi: true,
114
+ },
115
+ ],
112
116
  }]
113
117
  }] });
114
118
 
@@ -117,13 +121,13 @@
117
121
  }
118
122
  return SkyDropdownButtonComponent;
119
123
  }());
120
- SkyDropdownButtonComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownButtonComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
121
- SkyDropdownButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: SkyDropdownButtonComponent, selector: "sky-dropdown-button", ngImport: i0__namespace, template: "<ng-content></ng-content>\n" });
122
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownButtonComponent, decorators: [{
124
+ SkyDropdownButtonComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownButtonComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
125
+ SkyDropdownButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyDropdownButtonComponent, selector: "sky-dropdown-button", ngImport: i0__namespace, template: "<ng-content></ng-content>\n" });
126
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownButtonComponent, decorators: [{
123
127
  type: i0.Component,
124
128
  args: [{
125
129
  selector: 'sky-dropdown-button',
126
- templateUrl: './dropdown-button.component.html'
130
+ template: "<ng-content></ng-content>\n",
127
131
  }]
128
132
  }] });
129
133
 
@@ -179,8 +183,8 @@
179
183
  };
180
184
  SkyDropdownItemComponent.prototype.isFocusable = function () {
181
185
  /*tslint:disable no-null-keyword */
182
- var isFocusable = (this.buttonElement &&
183
- this.buttonElement.getAttribute('disabled') === null);
186
+ var isFocusable = this.buttonElement &&
187
+ this.buttonElement.getAttribute('disabled') === null;
184
188
  /*tslint:enable */
185
189
  return isFocusable;
186
190
  };
@@ -190,16 +194,16 @@
190
194
  };
191
195
  return SkyDropdownItemComponent;
192
196
  }());
193
- SkyDropdownItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownItemComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.Renderer2 }], target: i0__namespace.ɵɵFactoryTarget.Component });
194
- SkyDropdownItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: SkyDropdownItemComponent, selector: "sky-dropdown-item", inputs: { ariaRole: "ariaRole" }, ngImport: i0__namespace, 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>\n </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:8px 20px;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,.sky-theme-modern .sky-dropdown-item>a:active,.sky-theme-modern .sky-dropdown-item>button:focus,.sky-theme-modern .sky-dropdown-item>button:active{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-dropdown-item>a:focus:not(:active),.sky-theme-modern .sky-dropdown-item>button:focus: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"], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
195
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownItemComponent, decorators: [{
197
+ SkyDropdownItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownItemComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.Renderer2 }], target: i0__namespace.ɵɵFactoryTarget.Component });
198
+ SkyDropdownItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyDropdownItemComponent, selector: "sky-dropdown-item", inputs: { ariaRole: "ariaRole" }, ngImport: i0__namespace, 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:8px 20px;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,.sky-theme-modern .sky-dropdown-item>a:active,.sky-theme-modern .sky-dropdown-item>button:focus,.sky-theme-modern .sky-dropdown-item>button:active{outline:solid 2px #1870B8;outline-offset:-2px}.sky-theme-modern .sky-dropdown-item>a:focus:not(:active),.sky-theme-modern .sky-dropdown-item>button:focus: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"], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
199
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownItemComponent, decorators: [{
196
200
  type: i0.Component,
197
201
  args: [{
198
202
  selector: 'sky-dropdown-item',
199
- templateUrl: './dropdown-item.component.html',
200
- styleUrls: ['./dropdown-item.component.scss'],
203
+ 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",
204
+ 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],
201
205
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
202
- encapsulation: i0.ViewEncapsulation.None
206
+ encapsulation: i0.ViewEncapsulation.None,
203
207
  }]
204
208
  }], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }, { type: i0__namespace.ChangeDetectorRef }, { type: i0__namespace.Renderer2 }]; }, propDecorators: { ariaRole: [{
205
209
  type: i0.Input
@@ -470,12 +474,10 @@
470
474
  }
471
475
  var overlay = this.overlayService.create({
472
476
  enableScroll: true,
473
- enablePointerEvents: true
477
+ enablePointerEvents: true,
474
478
  });
475
479
  overlay.attachTemplate(this.menuContainerTemplateRef);
476
- overlay.backdropClick
477
- .pipe(operators.takeUntil(this.ngUnsubscribe))
478
- .subscribe(function () {
480
+ overlay.backdropClick.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function () {
479
481
  if (_this.dismissOnBlur) {
480
482
  _this.sendMessage(exports.SkyDropdownMessageType.Close);
481
483
  }
@@ -502,7 +504,7 @@
502
504
  affixer.placementChange
503
505
  .pipe(operators.takeUntil(this.ngUnsubscribe))
504
506
  .subscribe(function (change) {
505
- _this.isVisible = (change.placement !== null);
507
+ _this.isVisible = change.placement !== null;
506
508
  _this.changeDetector.markForCheck();
507
509
  });
508
510
  this.affixer = affixer;
@@ -546,7 +548,7 @@
546
548
  enableAutoFit: true,
547
549
  horizontalAlignment: parseAffixHorizontalAlignment$1(_this.horizontalAlignment),
548
550
  isSticky: true,
549
- placement: 'below'
551
+ placement: 'below',
550
552
  });
551
553
  _this.isVisible = true;
552
554
  _this.changeDetector.markForCheck();
@@ -554,15 +556,15 @@
554
556
  };
555
557
  return SkyDropdownComponent;
556
558
  }());
557
- SkyDropdownComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i1__namespace.SkyAffixService }, { token: i1__namespace.SkyOverlayService }, { token: i2__namespace.SkyThemeService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
558
- SkyDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", 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: i0.ElementRef }, { propertyName: "menuContainerTemplateRef", first: true, predicate: ["menuContainerTemplateRef"], descendants: true, read: i0.TemplateRef, static: true }, { propertyName: "triggerButton", first: true, predicate: ["triggerButton"], descendants: true, read: i0.ElementRef, static: true }], ngImport: i0__namespace, template: "<div\n class=\"sky-dropdown\"\n>\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]=\"label || ('skyux_dropdown_context_menu_default_label' | skyLibResources)\"\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'\"\n icon=\"ellipsis-h\"\n ></sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\"\n icon=\"ellipsis\"\n iconType=\"skyux\"\n ></sky-icon>\n </ng-template>\n\n <ng-template ngSwitchDefault>\n <div *ngIf=\"buttonType === 'select' || buttonType === 'tab' || !buttonType\"\n class=\"sky-dropdown-button-container\"\n >\n <div\n class=\"sky-dropdown-button-content-container\"\n >\n <ng-content\n select=\"sky-dropdown-button\"\n >\n </ng-content>\n </div>\n <div\n class=\"sky-dropdown-button-icon-container\"\n >\n <sky-icon *skyThemeIf=\"'default'\"\n class=\"sky-dropdown-caret\"\n icon=\"caret-down\"\n >\n </sky-icon>\n <sky-icon *skyThemeIf=\"'modern'\"\n class=\"sky-dropdown-caret\"\n icon=\"chevron-down\"\n iconType=\"skyux\"\n >\n </sky-icon>\n </div>\n </div>\n <div *ngIf=\"buttonType !== 'select' && buttonType !== 'tab' && buttonType\">\n <sky-icon\n [icon]=\"buttonType\"\n size=\"lg\"\n ></sky-icon>\n </div>\n </ng-template>\n </ng-container>\n </button>\n</div>\n\n<ng-template\n #menuContainerTemplateRef\n>\n <div\n class=\"sky-dropdown-menu-container\"\n [class.hidden]=\"!isVisible\"\n #menuContainerElementRef\n >\n <ng-content\n select=\"sky-dropdown-menu\"\n ></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:#686c73;cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:#0974a1;color:#fff;max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:#eeeeef;color:#212327;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:#cdcfd2;cursor:default;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:#686c73;cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:#0974a1;color:#fff}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}.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;font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:#212327}: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){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus{background-color:transparent;outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}: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:#212327}: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:#686c73}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:#212327}.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){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus{background-color:transparent;outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}.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:#212327}.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:#686c73}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}: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{color:#fff}.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"], components: [{ type: i3__namespace.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i4__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2__namespace.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i4__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "skyLibResources": i5__namespace.SkyLibResourcesPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
559
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownComponent, decorators: [{
559
+ SkyDropdownComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i1__namespace.SkyAffixService }, { token: i1__namespace.SkyOverlayService }, { token: i2__namespace.SkyThemeService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
560
+ SkyDropdownComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", 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: i0.ElementRef }, { propertyName: "menuContainerTemplateRef", first: true, predicate: ["menuContainerTemplateRef"], descendants: true, read: i0.TemplateRef, static: true }, { propertyName: "triggerButton", first: true, predicate: ["triggerButton"], descendants: true, read: i0.ElementRef, static: true }], ngImport: i0__namespace, 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:#686c73;cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:#0974a1;color:#fff;max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:#eeeeef;color:#212327;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:#cdcfd2;cursor:default;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:#686c73;cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:#0974a1;color:#fff}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}.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;font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:#212327}: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){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus{background-color:transparent;outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}: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:#212327}: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:#686c73}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:#212327}.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){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus{background-color:transparent;outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}.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:#212327}.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:#686c73}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}: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{color:#fff}.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"], components: [{ type: i3__namespace.λ4, selector: "sky-icon", inputs: ["icon", "iconType", "size", "fixedWidth", "variant"] }], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i4__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2__namespace.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { type: i4__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "skyLibResources": i5__namespace.SkyLibResourcesPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
561
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownComponent, decorators: [{
560
562
  type: i0.Component,
561
563
  args: [{
562
564
  selector: 'sky-dropdown',
563
- templateUrl: './dropdown.component.html',
564
- styleUrls: ['./dropdown.component.scss'],
565
- changeDetection: i0.ChangeDetectionStrategy.OnPush
565
+ 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",
566
+ styles: [".sky-dropdown-button-type-tab{background-color:transparent;border:none;border-radius:4px 4px 0 0;color:#686c73;cursor:pointer;display:inline-block;font-weight:600;line-height:1.8;padding:8px 16px;background-color:#0974a1;color:#fff;max-width:100%;text-align:left}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:#eeeeef;color:#212327;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled{background-color:#cdcfd2;cursor:default;outline:none;text-decoration:none}.sky-dropdown-button-type-tab.sky-btn-tab-disabled:hover{color:#686c73;cursor:default;text-decoration:none}.sky-dropdown-button-type-tab:hover:not(.sky-btn-tab-disabled){background-color:#0974a1;color:#fff}.sky-dropdown-button-type-context-menu{border-radius:50%;padding:3px 8px}.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;font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:#212327}: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){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus{background-color:transparent;outline:none}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}:host-context(.sky-theme-modern) .sky-dropdown-button-type-tab:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}: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:#212327}: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:#686c73}:host-context(.sky-theme-modern) .sky-dropdown-caret{margin-left:10px}.sky-theme-modern .sky-dropdown-button-type-tab{border:none;border-radius:0;font-weight:400;padding:10px 15px;transition:box-shadow .15s;background-color:transparent;color:#212327}.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){background-color:transparent;border-bottom:solid 1px #00b4f1;padding-bottom:9px}.sky-theme-modern .sky-dropdown-button-type-tab:focus{background-color:transparent;outline:none}.sky-theme-modern .sky-dropdown-button-type-tab:focus:not(:active){outline:solid 2px #1870B8;outline-offset:-2px;box-shadow:0 1px 8px #0000004d}.sky-theme-modern .sky-dropdown-button-type-tab:active{border-bottom:solid 3px #00b4f1;padding-bottom:7px}.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:#212327}.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:#686c73}.sky-theme-modern .sky-dropdown-caret{margin-left:10px}: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{color:#fff}.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"],
567
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
566
568
  }]
567
569
  }], ctorParameters: function () {
568
570
  return [{ type: i0__namespace.ChangeDetectorRef }, { type: i1__namespace.SkyAffixService }, { type: i1__namespace.SkyOverlayService }, { type: i2__namespace.SkyThemeService, decorators: [{
@@ -589,19 +591,19 @@
589
591
  }], menuContainerElementRef: [{
590
592
  type: i0.ViewChild,
591
593
  args: ['menuContainerElementRef', {
592
- read: i0.ElementRef
594
+ read: i0.ElementRef,
593
595
  }]
594
596
  }], menuContainerTemplateRef: [{
595
597
  type: i0.ViewChild,
596
598
  args: ['menuContainerTemplateRef', {
597
599
  read: i0.TemplateRef,
598
- static: true
600
+ static: true,
599
601
  }]
600
602
  }], triggerButton: [{
601
603
  type: i0.ViewChild,
602
604
  args: ['triggerButton', {
603
605
  read: i0.ElementRef,
604
- static: true
606
+ static: true,
605
607
  }]
606
608
  }] } });
607
609
 
@@ -663,7 +665,7 @@
663
665
  Object.defineProperty(SkyDropdownMenuComponent.prototype, "hasFocusableItems", {
664
666
  get: function () {
665
667
  var found = this.menuItems.find(function (item) { return item.isFocusable(); });
666
- return (found !== undefined);
668
+ return found !== undefined;
667
669
  },
668
670
  enumerable: false,
669
671
  configurable: true
@@ -733,7 +735,7 @@
733
735
  .subscribe(function (items) {
734
736
  _this.reset();
735
737
  _this.menuChanges.emit({
736
- items: items.toArray()
738
+ items: items.toArray(),
737
739
  });
738
740
  });
739
741
  this.addEventListeners();
@@ -809,22 +811,22 @@
809
811
  this.resetItemsActiveState();
810
812
  item.focusElement(this.useNativeFocus);
811
813
  this.menuChanges.emit({
812
- activeIndex: this.menuIndex
814
+ activeIndex: this.menuIndex,
813
815
  });
814
816
  };
815
817
  SkyDropdownMenuComponent.prototype.getItemByIndex = function (index) {
816
818
  return this.menuItems.find(function (item, i) {
817
- return (i === index);
819
+ return i === index;
818
820
  });
819
821
  };
820
822
  SkyDropdownMenuComponent.prototype.selectItemByEventTarget = function (target) {
821
823
  var _this = this;
822
824
  var selectedItem = this.menuItems.find(function (item, i) {
823
- var found = (item.elementRef.nativeElement.contains(target));
825
+ var found = item.elementRef.nativeElement.contains(target);
824
826
  if (found) {
825
827
  _this.menuIndex = i;
826
828
  _this.menuChanges.next({
827
- activeIndex: _this.menuIndex
829
+ activeIndex: _this.menuIndex,
828
830
  });
829
831
  }
830
832
  return found;
@@ -832,7 +834,7 @@
832
834
  /* istanbul ignore else */
833
835
  if (selectedItem) {
834
836
  this.menuChanges.next({
835
- selectedItem: selectedItem
837
+ selectedItem: selectedItem,
836
838
  });
837
839
  }
838
840
  };
@@ -898,16 +900,16 @@
898
900
  };
899
901
  return SkyDropdownMenuComponent;
900
902
  }());
901
- SkyDropdownMenuComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownMenuComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.ElementRef }, { token: SkyDropdownComponent, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
902
- SkyDropdownMenuComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", 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__namespace, 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>\n </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-theme-mode-dark .sky-dropdown-menu{background-color:#252a2e;color:#fff}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
903
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownMenuComponent, decorators: [{
903
+ SkyDropdownMenuComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownMenuComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.ElementRef }, { token: SkyDropdownComponent, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
904
+ SkyDropdownMenuComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", 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__namespace, 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-theme-mode-dark .sky-dropdown-menu{background-color:#252a2e;color:#fff}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
905
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownMenuComponent, decorators: [{
904
906
  type: i0.Component,
905
907
  args: [{
906
908
  selector: 'sky-dropdown-menu',
907
- templateUrl: './dropdown-menu.component.html',
908
- styleUrls: ['./dropdown-menu.component.scss'],
909
+ 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",
910
+ 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-theme-mode-dark .sky-dropdown-menu{background-color:#252a2e;color:#fff}\n"],
909
911
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
910
- encapsulation: i0.ViewEncapsulation.None
912
+ encapsulation: i0.ViewEncapsulation.None,
911
913
  }]
912
914
  }], ctorParameters: function () {
913
915
  return [{ type: i0__namespace.ChangeDetectorRef }, { type: i0__namespace.ElementRef }, { type: SkyDropdownComponent, decorators: [{
@@ -931,8 +933,8 @@
931
933
  }
932
934
  return SkyDropdownModule;
933
935
  }());
934
- SkyDropdownModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
935
- SkyDropdownModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownModule, declarations: [SkyDropdownButtonComponent,
936
+ SkyDropdownModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
937
+ SkyDropdownModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownModule, declarations: [SkyDropdownButtonComponent,
936
938
  SkyDropdownComponent,
937
939
  SkyDropdownItemComponent,
938
940
  SkyDropdownMenuComponent], imports: [i4.CommonModule,
@@ -944,22 +946,22 @@
944
946
  SkyDropdownComponent,
945
947
  SkyDropdownItemComponent,
946
948
  SkyDropdownMenuComponent] });
947
- SkyDropdownModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownModule, imports: [[
949
+ SkyDropdownModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownModule, imports: [[
948
950
  i4.CommonModule,
949
951
  i1.SkyAffixModule,
950
952
  i3.SkyIconModule,
951
953
  i1.SkyOverlayModule,
952
954
  SkyPopoversResourcesModule,
953
- i2.SkyThemeModule
955
+ i2.SkyThemeModule,
954
956
  ]] });
955
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyDropdownModule, decorators: [{
957
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyDropdownModule, decorators: [{
956
958
  type: i0.NgModule,
957
959
  args: [{
958
960
  declarations: [
959
961
  SkyDropdownButtonComponent,
960
962
  SkyDropdownComponent,
961
963
  SkyDropdownItemComponent,
962
- SkyDropdownMenuComponent
964
+ SkyDropdownMenuComponent,
963
965
  ],
964
966
  imports: [
965
967
  i4.CommonModule,
@@ -967,14 +969,14 @@
967
969
  i3.SkyIconModule,
968
970
  i1.SkyOverlayModule,
969
971
  SkyPopoversResourcesModule,
970
- i2.SkyThemeModule
972
+ i2.SkyThemeModule,
971
973
  ],
972
974
  exports: [
973
975
  SkyDropdownButtonComponent,
974
976
  SkyDropdownComponent,
975
977
  SkyDropdownItemComponent,
976
- SkyDropdownMenuComponent
977
- ]
978
+ SkyDropdownMenuComponent,
979
+ ],
978
980
  }]
979
981
  }] });
980
982
 
@@ -992,7 +994,7 @@
992
994
  var top;
993
995
  var left;
994
996
  if (placement === 'above' || placement === 'below') {
995
- left = callerRect.left + (callerRect.width / 2);
997
+ left = callerRect.left + callerRect.width / 2;
996
998
  // Make sure the arrow never detaches from the popover.
997
999
  if (left - pixelTolerance < popoverRect.left) {
998
1000
  left = popoverRect.left + pixelTolerance;
@@ -1018,7 +1020,7 @@
1018
1020
  }
1019
1021
  }
1020
1022
  else {
1021
- top = callerRect.top + (callerRect.height / 2);
1023
+ top = callerRect.top + callerRect.height / 2;
1022
1024
  // Make sure the arrow never detaches from the popover.
1023
1025
  if (top - pixelTolerance < popoverRect.top) {
1024
1026
  top = popoverRect.top + pixelTolerance;
@@ -1047,9 +1049,9 @@
1047
1049
  };
1048
1050
  return SkyPopoverAdapterService;
1049
1051
  }());
1050
- SkyPopoverAdapterService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverAdapterService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
1051
- SkyPopoverAdapterService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverAdapterService });
1052
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverAdapterService, decorators: [{
1052
+ SkyPopoverAdapterService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverAdapterService, deps: [], target: i0__namespace.ɵɵFactoryTarget.Injectable });
1053
+ SkyPopoverAdapterService.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverAdapterService });
1054
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverAdapterService, decorators: [{
1053
1055
  type: i0.Injectable
1054
1056
  }] });
1055
1057
 
@@ -1058,23 +1060,17 @@
1058
1060
  */
1059
1061
  var skyPopoverAnimation = animations.trigger('skyPopoverAnimation', [
1060
1062
  animations.state('void', animations.style({
1061
- opacity: 0
1063
+ opacity: 0,
1062
1064
  })),
1063
1065
  animations.state('open', animations.style({
1064
- opacity: 1
1066
+ opacity: 1,
1065
1067
  })),
1066
1068
  animations.state('closed', animations.style({
1067
- opacity: 0
1069
+ opacity: 0,
1068
1070
  })),
1069
- animations.transition('void => *', [
1070
- animations.animate('250ms')
1071
- ]),
1072
- animations.transition('open => closed', [
1073
- animations.animate('150ms')
1074
- ]),
1075
- animations.transition('closed => open', [
1076
- animations.animate('150ms')
1077
- ])
1071
+ animations.transition('void => *', [animations.animate('250ms')]),
1072
+ animations.transition('open => closed', [animations.animate('150ms')]),
1073
+ animations.transition('closed => open', [animations.animate('150ms')]),
1078
1074
  ]);
1079
1075
 
1080
1076
  function parseAffixPlacement(placement) {
@@ -1197,7 +1193,8 @@
1197
1193
  this._isMouseEnter =
1198
1194
  this._opened =
1199
1195
  this.affixer =
1200
- this.ngUnsubscribe = undefined;
1196
+ this.ngUnsubscribe =
1197
+ undefined;
1201
1198
  };
1202
1199
  SkyPopoverContentComponent.prototype.onAnimationEvent = function (event) {
1203
1200
  var _a, _b;
@@ -1240,7 +1237,9 @@
1240
1237
  setTimeout(function () {
1241
1238
  var _a;
1242
1239
  /*istanbul ignore next*/
1243
- if (!((_a = _this.popoverRef) === null || _a === void 0 ? void 0 : _a.nativeElement) || !_this.ngUnsubscribe || _this.ngUnsubscribe.isStopped) {
1240
+ if (!((_a = _this.popoverRef) === null || _a === void 0 ? void 0 : _a.nativeElement) ||
1241
+ !_this.ngUnsubscribe ||
1242
+ _this.ngUnsubscribe.isStopped) {
1244
1243
  return;
1245
1244
  }
1246
1245
  if (!_this.affixer) {
@@ -1251,11 +1250,12 @@
1251
1250
  enableAutoFit: true,
1252
1251
  horizontalAlignment: parseAffixHorizontalAlignment(_this.horizontalAlignment),
1253
1252
  isSticky: true,
1254
- placement: parseAffixPlacement(_this.placement)
1253
+ placement: parseAffixPlacement(_this.placement),
1255
1254
  };
1256
1255
  // Ensure that we are positioning the vertical alginment correctly. These
1257
1256
  // are the default alignments for all popovers but ensure that we are future proof here.
1258
- if (affixOptions.placement === 'left' || affixOptions.placement === 'right') {
1257
+ if (affixOptions.placement === 'left' ||
1258
+ affixOptions.placement === 'right') {
1259
1259
  affixOptions.verticalAlignment = 'middle';
1260
1260
  }
1261
1261
  else if (affixOptions.placement === 'above') {
@@ -1282,15 +1282,11 @@
1282
1282
  SkyPopoverContentComponent.prototype.setupAffixer = function () {
1283
1283
  var _this = this;
1284
1284
  var affixer = this.affixService.createAffixer(this.popoverRef);
1285
- affixer.offsetChange
1286
- .pipe(operators.takeUntil(this.ngUnsubscribe))
1287
- .subscribe(function () {
1285
+ affixer.offsetChange.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function () {
1288
1286
  _this.updateArrowOffset();
1289
1287
  _this.changeDetector.markForCheck();
1290
1288
  });
1291
- affixer.overflowScroll
1292
- .pipe(operators.takeUntil(this.ngUnsubscribe))
1293
- .subscribe(function () {
1289
+ affixer.overflowScroll.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function () {
1294
1290
  _this.updateArrowOffset();
1295
1291
  _this.changeDetector.markForCheck();
1296
1292
  });
@@ -1306,7 +1302,7 @@
1306
1302
  var _c = this.adapterService.getArrowCoordinates({
1307
1303
  caller: this.caller,
1308
1304
  popover: this.popoverRef,
1309
- popoverArrow: this.arrowRef
1305
+ popoverArrow: this.arrowRef,
1310
1306
  }, this.placement, this.themeName), top = _c.top, left = _c.left;
1311
1307
  this.arrowTop = top;
1312
1308
  this.arrowLeft = left;
@@ -1340,10 +1336,9 @@
1340
1336
  return;
1341
1337
  }
1342
1338
  var focusableItems = _this.coreAdapterService.getFocusableChildren(hostElement);
1343
- var isFirstItem = (focusableItems[0] === event.target &&
1344
- event.shiftKey);
1345
- var isLastItem = (focusableItems[focusableItems.length - 1] === event.target &&
1346
- !event.shiftKey);
1339
+ var isFirstItem = focusableItems[0] === event.target && event.shiftKey;
1340
+ var isLastItem = focusableItems[focusableItems.length - 1] === event.target &&
1341
+ !event.shiftKey;
1347
1342
  /*istanbul ignore else*/
1348
1343
  if (focusableItems.length === 0 || isFirstItem || isLastItem) {
1349
1344
  _this.close();
@@ -1357,20 +1352,16 @@
1357
1352
  };
1358
1353
  return SkyPopoverContentComponent;
1359
1354
  }());
1360
- SkyPopoverContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverContentComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.ElementRef }, { token: i1__namespace.SkyAffixService }, { token: i1__namespace.SkyCoreAdapterService }, { token: SkyPopoverAdapterService }, { token: SkyPopoverContext, optional: true }, { token: i2__namespace.SkyThemeService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
1361
- SkyPopoverContentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: SkyPopoverContentComponent, selector: "sky-popover-content", providers: [
1362
- SkyPopoverAdapterService
1363
- ], viewQueries: [{ propertyName: "arrowRef", first: true, predicate: ["arrowRef"], descendants: true, read: i0.ElementRef, static: true }, { propertyName: "popoverRef", first: true, predicate: ["popoverRef"], descendants: true, read: i0.ElementRef, static: true }, { propertyName: "contentTarget", first: true, predicate: ["contentTarget"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, 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 *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 *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"], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [skyPopoverAnimation] });
1364
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverContentComponent, decorators: [{
1355
+ SkyPopoverContentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverContentComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.ElementRef }, { token: i1__namespace.SkyAffixService }, { token: i1__namespace.SkyCoreAdapterService }, { token: SkyPopoverAdapterService }, { token: SkyPopoverContext, optional: true }, { token: i2__namespace.SkyThemeService, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
1356
+ SkyPopoverContentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", type: SkyPopoverContentComponent, selector: "sky-popover-content", providers: [SkyPopoverAdapterService], viewQueries: [{ propertyName: "arrowRef", first: true, predicate: ["arrowRef"], descendants: true, read: i0.ElementRef, static: true }, { propertyName: "popoverRef", first: true, predicate: ["popoverRef"], descendants: true, read: i0.ElementRef, static: true }, { propertyName: "contentTarget", first: true, predicate: ["contentTarget"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, 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"], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2__namespace.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [skyPopoverAnimation] });
1357
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverContentComponent, decorators: [{
1365
1358
  type: i0.Component,
1366
1359
  args: [{
1367
1360
  selector: 'sky-popover-content',
1368
- templateUrl: './popover-content.component.html',
1369
- styleUrls: ['./popover-content.component.scss'],
1361
+ 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",
1362
+ 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"],
1370
1363
  animations: [skyPopoverAnimation],
1371
- providers: [
1372
- SkyPopoverAdapterService
1373
- ]
1364
+ providers: [SkyPopoverAdapterService],
1374
1365
  }]
1375
1366
  }], ctorParameters: function () {
1376
1367
  return [{ type: i0__namespace.ChangeDetectorRef }, { type: i0__namespace.ElementRef }, { type: i1__namespace.SkyAffixService }, { type: i1__namespace.SkyCoreAdapterService }, { type: SkyPopoverAdapterService }, { type: SkyPopoverContext, decorators: [{
@@ -1382,19 +1373,19 @@
1382
1373
  type: i0.ViewChild,
1383
1374
  args: ['arrowRef', {
1384
1375
  read: i0.ElementRef,
1385
- static: true
1376
+ static: true,
1386
1377
  }]
1387
1378
  }], popoverRef: [{
1388
1379
  type: i0.ViewChild,
1389
1380
  args: ['popoverRef', {
1390
1381
  read: i0.ElementRef,
1391
- static: true
1382
+ static: true,
1392
1383
  }]
1393
1384
  }], contentTarget: [{
1394
1385
  type: i0.ViewChild,
1395
1386
  args: ['contentTarget', {
1396
1387
  read: i0.ViewContainerRef,
1397
- static: true
1388
+ static: true,
1398
1389
  }]
1399
1390
  }] } });
1400
1391
 
@@ -1502,7 +1493,7 @@
1502
1493
  isStatic: false,
1503
1494
  placement: this.placement,
1504
1495
  popoverTitle: this.popoverTitle,
1505
- popoverType: this.popoverType
1496
+ popoverType: this.popoverType,
1506
1497
  });
1507
1498
  };
1508
1499
  /**
@@ -1534,29 +1525,25 @@
1534
1525
  var _this = this;
1535
1526
  var overlay = this.overlayService.create({
1536
1527
  enableScroll: true,
1537
- enablePointerEvents: true
1528
+ enablePointerEvents: true,
1538
1529
  });
1539
- overlay.backdropClick
1540
- .pipe(operators.takeUntil(this.ngUnsubscribe))
1541
- .subscribe(function () {
1530
+ overlay.backdropClick.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function () {
1542
1531
  if (_this.dismissOnBlur) {
1543
1532
  _this.close();
1544
1533
  }
1545
1534
  });
1546
- var contentRef = overlay.attachComponent(SkyPopoverContentComponent, [{
1535
+ var contentRef = overlay.attachComponent(SkyPopoverContentComponent, [
1536
+ {
1547
1537
  provide: SkyPopoverContext,
1548
1538
  useValue: new SkyPopoverContext({
1549
- contentTemplateRef: this.templateRef
1550
- })
1551
- }]);
1552
- contentRef.opened
1553
- .pipe(operators.takeUntil(this.ngUnsubscribe))
1554
- .subscribe(function () {
1539
+ contentTemplateRef: this.templateRef,
1540
+ }),
1541
+ },
1542
+ ]);
1543
+ contentRef.opened.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function () {
1555
1544
  _this.popoverOpened.emit(_this);
1556
1545
  });
1557
- contentRef.closed
1558
- .pipe(operators.takeUntil(this.ngUnsubscribe))
1559
- .subscribe(function () {
1546
+ contentRef.closed.pipe(operators.takeUntil(this.ngUnsubscribe)).subscribe(function () {
1560
1547
  /*istanbul ignore else*/
1561
1548
  if (_this.isActive) {
1562
1549
  _this.overlayService.close(_this.overlay);
@@ -1579,13 +1566,13 @@
1579
1566
  };
1580
1567
  return SkyPopoverComponent;
1581
1568
  }());
1582
- SkyPopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverComponent, deps: [{ token: i1__namespace.SkyOverlayService }], target: i0__namespace.ɵɵFactoryTarget.Component });
1583
- SkyPopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", 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: i0.TemplateRef, static: true }], ngImport: i0__namespace, template: "<ng-template\n #templateRef\n>\n <ng-content></ng-content>\n</ng-template>" });
1584
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverComponent, decorators: [{
1569
+ SkyPopoverComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverComponent, deps: [{ token: i1__namespace.SkyOverlayService }], target: i0__namespace.ɵɵFactoryTarget.Component });
1570
+ SkyPopoverComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.13", 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: i0.TemplateRef, static: true }], ngImport: i0__namespace, template: "<ng-template #templateRef>\n <ng-content></ng-content>\n</ng-template>\n" });
1571
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverComponent, decorators: [{
1585
1572
  type: i0.Component,
1586
1573
  args: [{
1587
1574
  selector: 'sky-popover',
1588
- templateUrl: './popover.component.html'
1575
+ template: "<ng-template #templateRef>\n <ng-content></ng-content>\n</ng-template>\n",
1589
1576
  }]
1590
1577
  }], ctorParameters: function () { return [{ type: i1__namespace.SkyOverlayService }]; }, propDecorators: { alignment: [{
1591
1578
  type: i0.Input
@@ -1605,7 +1592,7 @@
1605
1592
  type: i0.ViewChild,
1606
1593
  args: ['templateRef', {
1607
1594
  read: i0.TemplateRef,
1608
- static: true
1595
+ static: true,
1609
1596
  }]
1610
1597
  }] } });
1611
1598
 
@@ -1790,12 +1777,12 @@
1790
1777
  };
1791
1778
  return SkyPopoverDirective;
1792
1779
  }());
1793
- SkyPopoverDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverDirective, deps: [{ token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Directive });
1794
- SkyPopoverDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.7", type: SkyPopoverDirective, selector: "[skyPopover]", inputs: { skyPopover: "skyPopover", skyPopoverAlignment: "skyPopoverAlignment", skyPopoverMessageStream: "skyPopoverMessageStream", skyPopoverPlacement: "skyPopoverPlacement", skyPopoverTrigger: "skyPopoverTrigger" }, ngImport: i0__namespace });
1795
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverDirective, decorators: [{
1780
+ SkyPopoverDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverDirective, deps: [{ token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Directive });
1781
+ SkyPopoverDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.13", type: SkyPopoverDirective, selector: "[skyPopover]", inputs: { skyPopover: "skyPopover", skyPopoverAlignment: "skyPopoverAlignment", skyPopoverMessageStream: "skyPopoverMessageStream", skyPopoverPlacement: "skyPopoverPlacement", skyPopoverTrigger: "skyPopoverTrigger" }, ngImport: i0__namespace });
1782
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverDirective, decorators: [{
1796
1783
  type: i0.Directive,
1797
1784
  args: [{
1798
- selector: '[skyPopover]'
1785
+ selector: '[skyPopover]',
1799
1786
  }]
1800
1787
  }], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }]; }, propDecorators: { skyPopover: [{
1801
1788
  type: i0.Input
@@ -1814,8 +1801,8 @@
1814
1801
  }
1815
1802
  return SkyPopoverModule;
1816
1803
  }());
1817
- SkyPopoverModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1818
- SkyPopoverModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverModule, declarations: [SkyPopoverComponent,
1804
+ SkyPopoverModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
1805
+ SkyPopoverModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverModule, declarations: [SkyPopoverComponent,
1819
1806
  SkyPopoverContentComponent,
1820
1807
  SkyPopoverDirective], imports: [i4.CommonModule,
1821
1808
  i1.SkyAffixModule,
@@ -1825,21 +1812,21 @@
1825
1812
  i2.SkyThemeModule], exports: [SkyPopoverComponent,
1826
1813
  SkyPopoverContentComponent,
1827
1814
  SkyPopoverDirective] });
1828
- SkyPopoverModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverModule, imports: [[
1815
+ SkyPopoverModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverModule, imports: [[
1829
1816
  i4.CommonModule,
1830
1817
  i1.SkyAffixModule,
1831
1818
  i3.SkyIconModule,
1832
1819
  i1.SkyOverlayModule,
1833
1820
  SkyPopoversResourcesModule,
1834
- i2.SkyThemeModule
1821
+ i2.SkyThemeModule,
1835
1822
  ]] });
1836
- i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: SkyPopoverModule, decorators: [{
1823
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.13", ngImport: i0__namespace, type: SkyPopoverModule, decorators: [{
1837
1824
  type: i0.NgModule,
1838
1825
  args: [{
1839
1826
  declarations: [
1840
1827
  SkyPopoverComponent,
1841
1828
  SkyPopoverContentComponent,
1842
- SkyPopoverDirective
1829
+ SkyPopoverDirective,
1843
1830
  ],
1844
1831
  imports: [
1845
1832
  i4.CommonModule,
@@ -1847,16 +1834,14 @@
1847
1834
  i3.SkyIconModule,
1848
1835
  i1.SkyOverlayModule,
1849
1836
  SkyPopoversResourcesModule,
1850
- i2.SkyThemeModule
1837
+ i2.SkyThemeModule,
1851
1838
  ],
1852
1839
  exports: [
1853
1840
  SkyPopoverComponent,
1854
1841
  SkyPopoverContentComponent,
1855
- SkyPopoverDirective
1842
+ SkyPopoverDirective,
1856
1843
  ],
1857
- entryComponents: [
1858
- SkyPopoverContentComponent
1859
- ]
1844
+ entryComponents: [SkyPopoverContentComponent],
1860
1845
  }]
1861
1846
  }] });
1862
1847
 
@@ -1866,15 +1851,15 @@
1866
1851
 
1867
1852
  exports.SkyDropdownModule = SkyDropdownModule;
1868
1853
  exports.SkyPopoverModule = SkyPopoverModule;
1869
- exports1 = SkyDropdownItemComponent;
1870
- exports2 = SkyDropdownButtonComponent;
1871
- exports3 = SkyDropdownComponent;
1872
- exports4 = SkyDropdownMenuComponent;
1873
- exports5 = SkyPopoverContentComponent;
1874
- exports6 = SkyPopoverComponent;
1875
- exports7 = SkyPopoverDirective;
1854
+ exports["λ1"] = SkyDropdownItemComponent;
1855
+ exports["λ2"] = SkyDropdownButtonComponent;
1856
+ exports["λ3"] = SkyDropdownComponent;
1857
+ exports["λ4"] = SkyDropdownMenuComponent;
1858
+ exports["λ5"] = SkyPopoverContentComponent;
1859
+ exports["λ6"] = SkyPopoverComponent;
1860
+ exports["λ7"] = SkyPopoverDirective;
1876
1861
 
1877
1862
  Object.defineProperty(exports, '__esModule', { value: true });
1878
1863
 
1879
- })));
1864
+ }));
1880
1865
  //# sourceMappingURL=skyux-popovers.umd.js.map