@koobiq/components 17.0.0-rc.10 → 17.0.0-rc.11

package/fesm2022/koobiq-components-divider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koobiq-components-divider.mjs","sources":["../../../packages/components/divider/divider.component.ts","../../../packages/components/divider/divider.module.ts","../../../packages/components/divider/koobiq-components-divider.ts"],"sourcesContent":["import { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n\n@Component({\n    selector: 'kbq-divider',\n    host: {\n        class: 'kbq-divider',\n        '[class.kbq-divider_vertical]': 'vertical',\n        '[class.kbq-divider_horizontal]': '!vertical',\n        '[class.kbq-divider_inset]': 'inset',\n        '[class.kbq-divider_paddings]': 'paddings'\n    },\n    template: '',\n    styleUrls: ['divider.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class KbqDivider {\n    // Whether the divider is vertically aligned.\n    @Input()\n    get vertical(): boolean {\n        return this._vertical;\n    }\n\n    set vertical(value: boolean) {\n        this._vertical = coerceBooleanProperty(value);\n    }\n\n    private _vertical: boolean = false;\n\n    // Whether the divider is an inset divider.\n    @Input()\n    get inset(): boolean {\n        return this._inset;\n    }\n\n    set inset(value: boolean) {\n        this._inset = coerceBooleanProperty(value);\n    }\n\n    private _inset: boolean = false;\n\n    @Input()\n    get paddings(): boolean {\n        return this._paddings;\n    }\n\n    set paddings(value: boolean) {\n        this._paddings = coerceBooleanProperty(value);\n    }\n\n    private _paddings: boolean = true;\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { KbqDivider } from './divider.component';\n\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [KbqDivider],\n    declarations: [KbqDivider]\n})\nexport class KbqDividerModule {\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAkBa,UAAU,CAAA;AAdvB,IAAA,WAAA,GAAA;QAyBY,IAAS,CAAA,SAAA,GAAY,KAAK,CAAC;QAY3B,IAAM,CAAA,MAAA,GAAY,KAAK,CAAC;QAWxB,IAAS,CAAA,SAAA,GAAY,IAAI,CAAC;AACrC,KAAA;;AAjCG,IAAA,IACI,QAAQ,GAAA;QACR,OAAO,IAAI,CAAC,SAAS,CAAC;KACzB;IAED,IAAI,QAAQ,CAAC,KAAc,EAAA;AACvB,QAAA,IAAI,CAAC,SAAS,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;KACjD;;AAKD,IAAA,IACI,KAAK,GAAA;QACL,OAAO,IAAI,CAAC,MAAM,CAAC;KACtB;IAED,IAAI,KAAK,CAAC,KAAc,EAAA;AACpB,QAAA,IAAI,CAAC,MAAM,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;KAC9C;AAID,IAAA,IACI,QAAQ,GAAA;QACR,OAAO,IAAI,CAAC,SAAS,CAAC;KACzB;IAED,IAAI,QAAQ,CAAC,KAAc,EAAA;AACvB,QAAA,IAAI,CAAC,SAAS,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;KACjD;iIAhCQ,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAV,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAU,yVALT,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,mmBAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAKH,UAAU,EAAA,UAAA,EAAA,CAAA;kBAdtB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EACjB,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,aAAa;AACpB,wBAAA,8BAA8B,EAAE,UAAU;AAC1C,wBAAA,gCAAgC,EAAE,WAAW;AAC7C,wBAAA,2BAA2B,EAAE,OAAO;AACpC,wBAAA,8BAA8B,EAAE,UAAU;qBAC7C,EACS,QAAA,EAAA,EAAE,iBAEG,iBAAiB,CAAC,IAAI,EACpB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,mmBAAA,CAAA,EAAA,CAAA;8BAK3C,QAAQ,EAAA,CAAA;sBADX,KAAK;gBAaF,KAAK,EAAA,CAAA;sBADR,KAAK;gBAYF,QAAQ,EAAA,CAAA;sBADX,KAAK;;;MChCG,gBAAgB,CAAA;iIAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;AAAhB,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,EAFV,YAAA,EAAA,CAAA,UAAU,CAFf,EAAA,OAAA,EAAA,CAAA,YAAY,aACZ,UAAU,CAAA,EAAA,CAAA,CAAA,EAAA;AAGX,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,YAJf,YAAY,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAIb,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAL5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,UAAU,CAAC;oBACrB,YAAY,EAAE,CAAC,UAAU,CAAC;AAC7B,iBAAA,CAAA;;;ACVD;;AAEG;;;;"}
+{"version":3,"file":"koobiq-components-divider.mjs","sources":["../../../packages/components/divider/divider.component.ts","../../../packages/components/divider/divider.module.ts","../../../packages/components/divider/koobiq-components-divider.ts"],"sourcesContent":["import { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';\n\n@Component({\n    selector: 'kbq-divider',\n    host: {\n        class: 'kbq-divider',\n        '[class.kbq-divider_vertical]': 'vertical',\n        '[class.kbq-divider_horizontal]': '!vertical',\n        '[class.kbq-divider_inset]': 'inset',\n        '[class.kbq-divider_paddings]': 'paddings'\n    },\n    template: '',\n    styleUrls: ['divider.scss'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class KbqDivider {\n    // Whether the divider is vertically aligned.\n    @Input()\n    get vertical(): boolean {\n        return this._vertical;\n    }\n\n    set vertical(value: boolean) {\n        this._vertical = coerceBooleanProperty(value);\n    }\n\n    private _vertical: boolean = false;\n\n    // Whether the divider is an inset divider.\n    @Input()\n    get inset(): boolean {\n        return this._inset;\n    }\n\n    set inset(value: boolean) {\n        this._inset = coerceBooleanProperty(value);\n    }\n\n    private _inset: boolean = false;\n\n    @Input()\n    get paddings(): boolean {\n        return this._paddings;\n    }\n\n    set paddings(value: boolean) {\n        this._paddings = coerceBooleanProperty(value);\n    }\n\n    private _paddings: boolean = true;\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { KbqDivider } from './divider.component';\n\n@NgModule({\n    imports: [CommonModule],\n    exports: [KbqDivider],\n    declarations: [KbqDivider]\n})\nexport class KbqDividerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/koobiq-components-dl.mjs

@@ -1,10 +1,10 @@
-import { A11yModule } from '@angular/cdk/a11y';
-import { PlatformModule } from '@angular/cdk/platform';
-import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Component, ViewEncapsulation, Input, NgModule } from '@angular/core';
 import { Subject, Subscription } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
+import { A11yModule } from '@angular/cdk/a11y';
+import { PlatformModule } from '@angular/cdk/platform';
+import { CommonModule } from '@angular/common';
 
 class KbqDlComponent {
     constructor(elementRef) {

package/fesm2022/koobiq-components-dl.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"koobiq-components-dl.mjs","sources":["../../../packages/components/dl/dl.component.ts","../../../packages/components/dl/dl.module.ts","../../../packages/components/dl/koobiq-components-dl.ts"],"sourcesContent":["import {\n    AfterContentInit,\n    Component,\n    ElementRef,\n    Input,\n    OnDestroy,\n    ViewEncapsulation\n} from '@angular/core';\nimport { Subject, Subscription } from 'rxjs';\nimport { debounceTime } from 'rxjs/operators';\n\n\n@Component({\n    selector: 'kbq-dl',\n    template: '<ng-content></ng-content>',\n    styleUrls: ['dl.scss'],\n    host: {\n        class: 'kbq-dl',\n        '[class.kbq-dl_vertical]': 'vertical',\n        '[class.kbq-dl_wide]': 'wide',\n        '(window:resize)': 'resizeStream.next($event)'\n    },\n    encapsulation: ViewEncapsulation.None\n})\nexport class KbqDlComponent implements AfterContentInit, OnDestroy {\n    @Input() minWidth: number = 400;\n    @Input() wide = false;\n    @Input() vertical: boolean | null = null;\n\n    readonly resizeStream = new Subject<Event>();\n    private readonly resizeDebounceInterval: number = 100;\n\n    private resizeSubscription = Subscription.EMPTY;\n\n    constructor(protected elementRef: ElementRef) {}\n\n    ngAfterContentInit(): void {\n        if (this.vertical !== null) { return; }\n\n        this.resizeSubscription = this.resizeStream\n            .pipe(debounceTime(this.resizeDebounceInterval))\n            .subscribe(this.updateState);\n    }\n\n    ngOnDestroy() {\n        this.resizeSubscription.unsubscribe();\n    }\n\n    updateState = () => {\n        const { width } = this.elementRef.nativeElement.getClientRects()[0];\n\n        this.vertical = width <= this.minWidth;\n    }\n}\n\n@Component({\n    selector: 'kbq-dt',\n    template: '<ng-content></ng-content>',\n    host: {\n        class: 'kbq-dt'\n    },\n    encapsulation: ViewEncapsulation.None\n})\nexport class KbqDtComponent {}\n\n@Component({\n    selector: 'kbq-dd',\n    template: '<ng-content></ng-content>',\n    host: {\n        class: 'kbq-dd'\n    },\n    encapsulation: ViewEncapsulation.None\n})\nexport class KbqDdComponent {}\n","import { A11yModule } from '@angular/cdk/a11y';\nimport { PlatformModule } from '@angular/cdk/platform';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport {\n    KbqDlComponent,\n    KbqDtComponent,\n    KbqDdComponent\n} from './dl.component';\n\n\n@NgModule({\n    imports: [\n        CommonModule,\n        A11yModule,\n        PlatformModule\n    ],\n    exports: [\n        KbqDlComponent,\n        KbqDtComponent,\n        KbqDdComponent\n    ],\n    declarations: [\n        KbqDlComponent,\n        KbqDtComponent,\n        KbqDdComponent\n    ]\n})\nexport class KbqDlModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"koobiq-components-dl.mjs","sources":["../../../packages/components/dl/dl.component.ts","../../../packages/components/dl/dl.module.ts","../../../packages/components/dl/koobiq-components-dl.ts"],"sourcesContent":["import { AfterContentInit, Component, ElementRef, Input, OnDestroy, ViewEncapsulation } from '@angular/core';\nimport { Subject, Subscription } from 'rxjs';\nimport { debounceTime } from 'rxjs/operators';\n\n@Component({\n    selector: 'kbq-dl',\n    template: '<ng-content></ng-content>',\n    styleUrls: ['dl.scss'],\n    host: {\n        class: 'kbq-dl',\n        '[class.kbq-dl_vertical]': 'vertical',\n        '[class.kbq-dl_wide]': 'wide',\n        '(window:resize)': 'resizeStream.next($event)'\n    },\n    encapsulation: ViewEncapsulation.None\n})\nexport class KbqDlComponent implements AfterContentInit, OnDestroy {\n    @Input() minWidth: number = 400;\n    @Input() wide = false;\n    @Input() vertical: boolean | null = null;\n\n    readonly resizeStream = new Subject<Event>();\n    private readonly resizeDebounceInterval: number = 100;\n\n    private resizeSubscription = Subscription.EMPTY;\n\n    constructor(protected elementRef: ElementRef) {}\n\n    ngAfterContentInit(): void {\n        if (this.vertical !== null) {\n            return;\n        }\n\n        this.resizeSubscription = this.resizeStream\n            .pipe(debounceTime(this.resizeDebounceInterval))\n            .subscribe(this.updateState);\n    }\n\n    ngOnDestroy() {\n        this.resizeSubscription.unsubscribe();\n    }\n\n    updateState = () => {\n        const { width } = this.elementRef.nativeElement.getClientRects()[0];\n\n        this.vertical = width <= this.minWidth;\n    };\n}\n\n@Component({\n    selector: 'kbq-dt',\n    template: '<ng-content></ng-content>',\n    host: {\n        class: 'kbq-dt'\n    },\n    encapsulation: ViewEncapsulation.None\n})\nexport class KbqDtComponent {}\n\n@Component({\n    selector: 'kbq-dd',\n    template: '<ng-content></ng-content>',\n    host: {\n        class: 'kbq-dd'\n    },\n    encapsulation: ViewEncapsulation.None\n})\nexport class KbqDdComponent {}\n","import { A11yModule } from '@angular/cdk/a11y';\nimport { PlatformModule } from '@angular/cdk/platform';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { KbqDdComponent, KbqDlComponent, KbqDtComponent } from './dl.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        A11yModule,\n        PlatformModule\n    ],\n    exports: [\n        KbqDlComponent,\n        KbqDtComponent,\n        KbqDdComponent\n    ],\n    declarations: [\n        KbqDlComponent,\n        KbqDtComponent,\n        KbqDdComponent\n    ]\n})\nexport class KbqDlModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/koobiq-components-dropdown.mjs

@@ -1,46 +1,63 @@
-import * as i0 from '@angular/core';
-import { InjectionToken, Directive, Inject, Component, ChangeDetectionStrategy, ViewEncapsulation, Optional, ViewChild, ContentChild, HostListener, EventEmitter, QueryList, TemplateRef, Input, ContentChildren, Output, Self, NgModule } from '@angular/core';
-import * as i1$1 from '@angular/cdk/overlay';
-import { Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
+import { trigger, state, style, transition, group, query, animate } from '@angular/animations';
+import { TemplatePortal, DomPortalOutlet } from '@angular/cdk/portal';
 import * as i2 from '@angular/common';
 import { DOCUMENT, CommonModule } from '@angular/common';
-import * as i3 from '@koobiq/components/icon';
-import { KbqIcon, KbqIconModule } from '@koobiq/components/icon';
-import { TemplatePortal, DomPortalOutlet } from '@angular/cdk/portal';
+import * as i0 from '@angular/core';
+import { Directive, Inject, InjectionToken, Component, ChangeDetectionStrategy, ViewEncapsulation, Optional, ViewChild, ContentChild, HostListener, EventEmitter, QueryList, TemplateRef, Input, ContentChildren, Output, Self, NgModule } from '@angular/core';
 import { Subject, Subscription, merge, of, asapScheduler } from 'rxjs';
 import * as i1 from '@angular/cdk/a11y';
 import { mixinDisabled, KBQ_TITLE_TEXT_REF } from '@koobiq/components/core';
+import * as i3 from '@koobiq/components/icon';
+import { KbqIcon, KbqIconModule } from '@koobiq/components/icon';
 import * as i4 from '@angular/cdk/bidi';
+import * as i1$1 from '@angular/cdk/overlay';
+import { Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
 import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
 import { RIGHT_ARROW, LEFT_ARROW, ESCAPE, ENTER, SPACE, DOWN_ARROW as DOWN_ARROW$1 } from '@koobiq/cdk/keycodes';
 import { startWith, switchMap, take, filter, takeUntil, delay } from 'rxjs/operators';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import { UP_ARROW, DOWN_ARROW } from '@angular/cdk/keycodes';
 import { FocusKeyManager } from '@koobiq/cdk/a11y';
-import { trigger, state, style, transition, group, query, animate } from '@angular/animations';
 
 /**
- * Injection token used to provide the parent dropdown to dropdown-specific components.
+ * Animations used by the kbq-dropdown component.
  * @docs-private
  */
-const KBQ_DROPDOWN_PANEL = new InjectionToken('KBQ_DROPDOWN_PANEL');
-/** Injection token to be used to override the default options for `kbq-dropdown`. */
-const KBQ_DROPDOWN_DEFAULT_OPTIONS = new InjectionToken('kbq-dropdown-default-options', {
-    providedIn: 'root',
-    factory: KBQ_DROPDOWN_DEFAULT_OPTIONS_FACTORY
-});
-/** @docs-private */
-// tslint:disable-next-line:naming-convention
-function KBQ_DROPDOWN_DEFAULT_OPTIONS_FACTORY() {
-    return {
-        overlapTriggerX: true,
-        overlapTriggerY: false,
-        xPosition: 'after',
-        yPosition: 'below',
-        backdropClass: 'cdk-overlay-transparent-backdrop',
-        hasBackdrop: false
-    };
-}
+const kbqDropdownAnimations = {
+    /**
+     * This animation controls the dropdown panel's entry and exit from the page.
+     *
+     * When the dropdown panel is added to the DOM, it scales in and fades in its border.
+     *
+     * When the dropdown panel is removed from the DOM, it simply fades out after a brief
+     * delay to display the ripple.
+     */
+    transformDropdown: trigger('transformDropdown', [
+        state('void', style({
+            opacity: 0,
+            transform: 'scale(0.8)'
+        })),
+        transition('void => enter', group([
+            query('.kbq-dropdown__content', animate('0ms linear', style({ opacity: 1 }))),
+            animate('0ms cubic-bezier(0, 0, 0.2, 1)', style({ transform: 'scale(1)' }))
+        ])),
+        transition('* => void', animate('50ms 25ms linear', style({ opacity: 0 })))
+    ]),
+    /**
+     * This animation fades in the background color and content of the dropdown panel
+     * after its containing element is scaled in.
+     */
+    fadeInItems: trigger('fadeInItems', [
+        // now. Remove next time we do breaking changes.
+        state('showing', style({ opacity: 1 })),
+        transition('void => *', [
+            style({ opacity: 0 }),
+            animate('0ms 0ms cubic-bezier(0.55, 0, 0.55, 0.2)')
+        ])
+    ])
+};
+const fadeInItems = kbqDropdownAnimations.fadeInItems;
+const transformDropdown = kbqDropdownAnimations.transformDropdown;
 
 /**
  * Dropdown content that will be rendered lazily once the dropdown is opened.
@@ -101,6 +118,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
                     args: [DOCUMENT]
                 }] }] });
 
+/**
+ * Throws an exception for the case when dropdown trigger doesn't have a valid kbq-dropdown instance
+ * @docs-private
+ */
+function throwKbqDropdownMissingError() {
+    throw Error(`kbqDropdownTriggerFor: must pass in an kbq-dropdown instance.
+    Example:
+      <kbq-dropdown #dropdown="kbqDropdown"></kbq-dropdown>
+      <button [kbqDropdownTriggerFor]="dropdown"></button>`);
+}
+/**
+ * Throws an exception for the case when dropdown's x-position value isn't valid.
+ * In other words, it doesn't match 'before' or 'after'.
+ * @docs-private
+ */
+function throwKbqDropdownInvalidPositionX() {
+    throw Error(`xPosition value must be either 'before' or after'.
+      Example: <kbq-dropdown [xPosition]="'before'" #dropdown="kbqDropdown"></kbq-dropdown>`);
+}
+/**
+ * Throws an exception for the case when dropdown's y-position value isn't valid.
+ * In other words, it doesn't match 'above' or 'below'.
+ * @docs-private
+ */
+function throwKbqDropdownInvalidPositionY() {
+    throw Error(`yPosition value must be either 'above' or below'.
+      Example: <kbq-dropdown [yPosition]="'above'" #dropdown="kbqDropdown"></kbq-dropdown>`);
+}
+
+/**
+ * Injection token used to provide the parent dropdown to dropdown-specific components.
+ * @docs-private
+ */
+const KBQ_DROPDOWN_PANEL = new InjectionToken('KBQ_DROPDOWN_PANEL');
+/** Injection token to be used to override the default options for `kbq-dropdown`. */
+const KBQ_DROPDOWN_DEFAULT_OPTIONS = new InjectionToken('kbq-dropdown-default-options', {
+    providedIn: 'root',
+    factory: KBQ_DROPDOWN_DEFAULT_OPTIONS_FACTORY
+});
+/** @docs-private */
+// tslint:disable-next-line:naming-convention
+function KBQ_DROPDOWN_DEFAULT_OPTIONS_FACTORY() {
+    return {
+        overlapTriggerX: true,
+        overlapTriggerY: false,
+        xPosition: 'after',
+        yPosition: 'below',
+        backdropClass: 'cdk-overlay-transparent-backdrop',
+        hasBackdrop: false
+    };
+}
+
 // Boilerplate for applying mixins to KbqDropdownItem.
 /** @docs-private */
 class KbqDropdownItemBase {
@@ -205,7 +274,7 @@ class KbqDropdownItem extends KbqDropdownItemMixinBase {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownItem, deps: [{ token: i0.ElementRef }, { token: i1.FocusMonitor }, { token: KBQ_DROPDOWN_PANEL, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
     /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqDropdownItem, selector: "kbq-dropdown-item, [kbq-dropdown-item]", inputs: { disabled: "disabled" }, host: { listeners: { "click": "checkDisabled($event)", "mouseenter": "handleMouseEnter()" }, properties: { "class.kbq-dropdown-item_with-icon": "icon", "class.kbq-dropdown-item_highlighted": "highlighted", "class.kbq-disabled": "disabled", "attr.disabled": "disabled || null", "attr.tabindex": "getTabIndex()" }, classAttribute: "kbq-dropdown-item" }, providers: [
             { provide: KBQ_TITLE_TEXT_REF, useExisting: KbqDropdownItem }
-        ], queries: [{ propertyName: "icon", first: true, predicate: KbqIcon, descendants: true }], viewQueries: [{ propertyName: "textElement", first: true, predicate: ["kbqTitleText"], descendants: true, static: true }], exportAs: ["kbqDropdownItem"], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"[kbq-icon]\"></ng-content>\n\n<div class=\"kbq-dropdown-item__text\" #kbqTitleText>\n    <ng-content></ng-content>\n</div>\n\n<i *ngIf=\"isNested\"\n   class=\"kbq-dropdown-trigger__icon\"\n   kbq-icon=\"mc-angle-right-S_16\">\n</i>\n\n<div class=\"kbq-dropdown-item-overlay\" (click)=\"haltDisabledEvents($event)\"></div>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 10px,#ffffff0a 10px 20px,#0000000a 20px 30px,#ffffff0a 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-dropdown-item{width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-list-size-container-content-gap-horizontal, 8px);border-width:var(--kbq-list-size-container-focus-outline-width, 2px);border-style:solid;border-color:transparent;padding:calc(var(--kbq-list-size-container-padding-vertical, 6px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-list-size-container-padding-right, 12px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-list-size-container-padding-vertical, 6px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-list-size-container-padding-left, 12px) - var(--kbq-list-size-container-focus-outline-width, 2px));text-align:left}.kbq-dropdown-item .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown-item .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item .kbq-list-text:empty{display:none}.kbq-dropdown-item .kbq-list-option-caption{padding-top:var(--kbq-list-size-container-content-gap-vertical, 2px)}.kbq-dropdown-item:not(.kbq-disabled){cursor:pointer}.kbq-dropdown-item>.kbq-icon:first-child{align-self:flex-start;margin-top:var(--kbq-list-size-container-padding-vertical, 6px)}.kbq-dropdown-item .kbq-dropdown-item__caption{padding-top:var(--kbq-list-size-container-content-gap-vertical, 2px)}.kbq-dropdown-item__text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown-item__text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item__text:empty{display:none}.kbq-dropdown-item-overlay{position:absolute;inset:-1px;border-radius:inherit}.kbq-dropdown__group-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;padding:var(--kbq-list-size-header-padding-top, 8px) var(--kbq-list-size-header-padding-horizontal, 12px) var(--kbq-list-size-header-padding-bottom, 4px) var(--kbq-list-size-header-padding-horizontal, 12px)}.kbq-dropdown__group-header .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown__group-header .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header .kbq-list-text:empty{display:none}.kbq-dropdown__group-header.kbq-dropdown__group-header_small{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;padding:var(--kbq-list-size-subheading-padding-top, 12px) var(--kbq-list-size-subheading-padding-horizontal, 12px) var(--kbq-list-size-subheading-padding-bottom, 4px) var(--kbq-list-size-subheading-padding-horizontal, 12px)}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text:empty{display:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "icon", first: true, predicate: KbqIcon, descendants: true }], viewQueries: [{ propertyName: "textElement", first: true, predicate: ["kbqTitleText"], descendants: true, static: true }], exportAs: ["kbqDropdownItem"], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"[kbq-icon]\"></ng-content>\n\n<div\n    #kbqTitleText\n    class=\"kbq-dropdown-item__text\"\n>\n    <ng-content></ng-content>\n</div>\n\n<i\n    *ngIf=\"isNested\"\n    kbq-icon=\"mc-angle-right-S_16\"\n    class=\"kbq-dropdown-trigger__icon\"\n></i>\n\n<div\n    class=\"kbq-dropdown-item-overlay\"\n    (click)=\"haltDisabledEvents($event)\"\n></div>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 10px,#ffffff0a 10px 20px,#0000000a 20px 30px,#ffffff0a 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-dropdown-item{width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-size-s, 8px);border:var(--kbq-size-3xs, 2px) solid transparent;padding-top:var(--kbq-size-xxs, 4px);padding-left:var(--kbq-size-m, 12px);padding-right:var(--kbq-size-m, 12px);padding-bottom:var(--kbq-size-xxs, 4px);text-align:left;align-items:flex-start}.kbq-dropdown-item .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown-item .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item .kbq-list-text:empty{display:none}.kbq-dropdown-item .kbq-list-option-caption{padding-top:var(--kbq-size-3xs, 2px)}.kbq-dropdown-item:not(.kbq-disabled){cursor:pointer}.kbq-dropdown-item>.kbq-icon:first-child:before{align-self:center;display:flex;height:var(--kbq-size-xl, 20px);width:16px;align-items:center}.kbq-dropdown-item .kbq-dropdown-item__caption{padding-top:var(--kbq-size-3xs, 2px)}.kbq-dropdown-item__text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown-item__text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item__text:empty{display:none}.kbq-dropdown-item-overlay{position:absolute;inset:-1px;border-radius:inherit}.kbq-dropdown__group-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;border-left:var(--kbq-size-3xs, 2px) solid transparent;border-right:var(--kbq-size-3xs, 2px) solid transparent;padding-top:var(--kbq-size-xs, 6px);padding-left:var(--kbq-size-m, 12px);padding-right:var(--kbq-size-m, 12px);padding-bottom:var(--kbq-size-3xs, 2px)}.kbq-dropdown__group-header .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown__group-header .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header .kbq-list-text:empty{display:none}.kbq-dropdown__group-header.kbq-dropdown__group-header_small{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;border-left:var(--kbq-size-3xs, 2px) solid transparent;border-right:var(--kbq-size-3xs, 2px) solid transparent;padding-top:var(--kbq-size-m, 12px);padding-left:var(--kbq-size-m, 12px);padding-right:var(--kbq-size-m, 12px);padding-bottom:var(--kbq-size-xxs, 4px)}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text:empty{display:none}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownItem, decorators: [{
             type: Component,
@@ -218,7 +287,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
                         '[attr.tabindex]': 'getTabIndex()'
                     }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         { provide: KBQ_TITLE_TEXT_REF, useExisting: KbqDropdownItem }
-                    ], template: "<ng-content select=\"[kbq-icon]\"></ng-content>\n\n<div class=\"kbq-dropdown-item__text\" #kbqTitleText>\n    <ng-content></ng-content>\n</div>\n\n<i *ngIf=\"isNested\"\n   class=\"kbq-dropdown-trigger__icon\"\n   kbq-icon=\"mc-angle-right-S_16\">\n</i>\n\n<div class=\"kbq-dropdown-item-overlay\" (click)=\"haltDisabledEvents($event)\"></div>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 10px,#ffffff0a 10px 20px,#0000000a 20px 30px,#ffffff0a 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-dropdown-item{width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-list-size-container-content-gap-horizontal, 8px);border-width:var(--kbq-list-size-container-focus-outline-width, 2px);border-style:solid;border-color:transparent;padding:calc(var(--kbq-list-size-container-padding-vertical, 6px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-list-size-container-padding-right, 12px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-list-size-container-padding-vertical, 6px) - var(--kbq-list-size-container-focus-outline-width, 2px)) calc(var(--kbq-list-size-container-padding-left, 12px) - var(--kbq-list-size-container-focus-outline-width, 2px));text-align:left}.kbq-dropdown-item .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown-item .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item .kbq-list-text:empty{display:none}.kbq-dropdown-item .kbq-list-option-caption{padding-top:var(--kbq-list-size-container-content-gap-vertical, 2px)}.kbq-dropdown-item:not(.kbq-disabled){cursor:pointer}.kbq-dropdown-item>.kbq-icon:first-child{align-self:flex-start;margin-top:var(--kbq-list-size-container-padding-vertical, 6px)}.kbq-dropdown-item .kbq-dropdown-item__caption{padding-top:var(--kbq-list-size-container-content-gap-vertical, 2px)}.kbq-dropdown-item__text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown-item__text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item__text:empty{display:none}.kbq-dropdown-item-overlay{position:absolute;inset:-1px;border-radius:inherit}.kbq-dropdown__group-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;padding:var(--kbq-list-size-header-padding-top, 8px) var(--kbq-list-size-header-padding-horizontal, 12px) var(--kbq-list-size-header-padding-bottom, 4px) var(--kbq-list-size-header-padding-horizontal, 12px)}.kbq-dropdown__group-header .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown__group-header .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header .kbq-list-text:empty{display:none}.kbq-dropdown__group-header.kbq-dropdown__group-header_small{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;padding:var(--kbq-list-size-subheading-padding-top, 12px) var(--kbq-list-size-subheading-padding-horizontal, 12px) var(--kbq-list-size-subheading-padding-bottom, 4px) var(--kbq-list-size-subheading-padding-horizontal, 12px)}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:border-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-top:var(--kbq-list-size-text-padding-vertical, 0);padding-bottom:var(--kbq-list-size-text-padding-vertical, 0)}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text:empty{display:none}\n"] }]
+                    ], template: "<ng-content select=\"[kbq-icon]\"></ng-content>\n\n<div\n    #kbqTitleText\n    class=\"kbq-dropdown-item__text\"\n>\n    <ng-content></ng-content>\n</div>\n\n<i\n    *ngIf=\"isNested\"\n    kbq-icon=\"mc-angle-right-S_16\"\n    class=\"kbq-dropdown-trigger__icon\"\n></i>\n\n<div\n    class=\"kbq-dropdown-item-overlay\"\n    (click)=\"haltDisabledEvents($event)\"\n></div>\n", styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:29px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 10px,#ffffff0a 10px 20px,#0000000a 20px 30px,#ffffff0a 31px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}.kbq-group{display:flex;flex-direction:row}.kbq-group .kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child)>.kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-button-size-border-radius, 8px)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child)>.kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child)>.kbq-form-field__container{border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-button-size-border-width, 2px))}.kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-dropdown-item{width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-size-s, 8px);border:var(--kbq-size-3xs, 2px) solid transparent;padding-top:var(--kbq-size-xxs, 4px);padding-left:var(--kbq-size-m, 12px);padding-right:var(--kbq-size-m, 12px);padding-bottom:var(--kbq-size-xxs, 4px);text-align:left;align-items:flex-start}.kbq-dropdown-item .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown-item .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item .kbq-list-text:empty{display:none}.kbq-dropdown-item .kbq-list-option-caption{padding-top:var(--kbq-size-3xs, 2px)}.kbq-dropdown-item:not(.kbq-disabled){cursor:pointer}.kbq-dropdown-item>.kbq-icon:first-child:before{align-self:center;display:flex;height:var(--kbq-size-xl, 20px);width:16px;align-items:center}.kbq-dropdown-item .kbq-dropdown-item__caption{padding-top:var(--kbq-size-3xs, 2px)}.kbq-dropdown-item__text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown-item__text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown-item__text:empty{display:none}.kbq-dropdown-item-overlay{position:absolute;inset:-1px;border-radius:inherit}.kbq-dropdown__group-header{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;border-left:var(--kbq-size-3xs, 2px) solid transparent;border-right:var(--kbq-size-3xs, 2px) solid transparent;padding-top:var(--kbq-size-xs, 6px);padding-left:var(--kbq-size-m, 12px);padding-right:var(--kbq-size-m, 12px);padding-bottom:var(--kbq-size-3xs, 2px)}.kbq-dropdown__group-header .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown__group-header .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header .kbq-list-text:empty{display:none}.kbq-dropdown__group-header.kbq-dropdown__group-header_small{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:32px;border-left:var(--kbq-size-3xs, 2px) solid transparent;border-right:var(--kbq-size-3xs, 2px) solid transparent;padding-top:var(--kbq-size-m, 12px);padding-left:var(--kbq-size-m, 12px);padding-right:var(--kbq-size-m, 12px);padding-bottom:var(--kbq-size-xxs, 4px)}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-dropdown__group-header.kbq-dropdown__group-header_small .kbq-list-text:empty{display:none}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.FocusMonitor }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [KBQ_DROPDOWN_PANEL]
@@ -238,75 +307,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
                 args: ['mouseenter']
             }] } });
 
-/**
- * Throws an exception for the case when dropdown trigger doesn't have a valid kbq-dropdown instance
- * @docs-private
- */
-function throwKbqDropdownMissingError() {
-    throw Error(`kbqDropdownTriggerFor: must pass in an kbq-dropdown instance.
-    Example:
-      <kbq-dropdown #dropdown="kbqDropdown"></kbq-dropdown>
-      <button [kbqDropdownTriggerFor]="dropdown"></button>`);
-}
-/**
- * Throws an exception for the case when dropdown's x-position value isn't valid.
- * In other words, it doesn't match 'before' or 'after'.
- * @docs-private
- */
-function throwKbqDropdownInvalidPositionX() {
-    throw Error(`xPosition value must be either 'before' or after'.
-      Example: <kbq-dropdown [xPosition]="'before'" #dropdown="kbqDropdown"></kbq-dropdown>`);
-}
-/**
- * Throws an exception for the case when dropdown's y-position value isn't valid.
- * In other words, it doesn't match 'above' or 'below'.
- * @docs-private
- */
-function throwKbqDropdownInvalidPositionY() {
-    throw Error(`yPosition value must be either 'above' or below'.
-      Example: <kbq-dropdown [yPosition]="'above'" #dropdown="kbqDropdown"></kbq-dropdown>`);
-}
-
-/**
- * Animations used by the kbq-dropdown component.
- * @docs-private
- */
-const kbqDropdownAnimations = {
-    /**
-     * This animation controls the dropdown panel's entry and exit from the page.
-     *
-     * When the dropdown panel is added to the DOM, it scales in and fades in its border.
-     *
-     * When the dropdown panel is removed from the DOM, it simply fades out after a brief
-     * delay to display the ripple.
-     */
-    transformDropdown: trigger('transformDropdown', [
-        state('void', style({
-            opacity: 0,
-            transform: 'scale(0.8)'
-        })),
-        transition('void => enter', group([
-            query('.kbq-dropdown__content', animate('0ms linear', style({ opacity: 1 }))),
-            animate('0ms cubic-bezier(0, 0, 0.2, 1)', style({ transform: 'scale(1)' }))
-        ])),
-        transition('* => void', animate('50ms 25ms linear', style({ opacity: 0 })))
-    ]),
-    /**
-     * This animation fades in the background color and content of the dropdown panel
-     * after its containing element is scaled in.
-     */
-    fadeInItems: trigger('fadeInItems', [
-        // now. Remove next time we do breaking changes.
-        state('showing', style({ opacity: 1 })),
-        transition('void => *', [
-            style({ opacity: 0 }),
-            animate('0ms 0ms cubic-bezier(0.55, 0, 0.55, 0.2)')
-        ])
-    ])
-};
-const fadeInItems = kbqDropdownAnimations.fadeInItems;
-const transformDropdown = kbqDropdownAnimations.transformDropdown;
-
 class KbqDropdown {
     /** Position of the dropdown in the X axis. */
     get xPosition() {
@@ -360,15 +360,11 @@ class KbqDropdown {
     set panelClass(classes) {
         const previousPanelClass = this.previousPanelClass;
         if (previousPanelClass && previousPanelClass.length) {
-            previousPanelClass
-                .split(' ')
-                .forEach((className) => this.classList[className] = false);
+            previousPanelClass.split(' ').forEach((className) => (this.classList[className] = false));
         }
         this.previousPanelClass = classes;
         if (classes?.length) {
-            classes
-                .split(' ')
-                .forEach((className) => this.classList[className] = true);
+            classes.split(' ').forEach((className) => (this.classList[className] = true));
             this.elementRef.nativeElement.className = '';
         }
     }
@@ -403,13 +399,11 @@ class KbqDropdown {
     }
     ngAfterContentInit() {
         this.updateDirectDescendants();
-        this.keyManager = new FocusKeyManager(this.directDescendantItems)
-            .withTypeAhead();
+        this.keyManager = new FocusKeyManager(this.directDescendantItems).withTypeAhead();
         if (this.navigationWithWrap) {
             this.keyManager.withWrap();
         }
-        this.tabSubscription = this.keyManager.tabOut
-            .subscribe(() => this.closed.emit('tab'));
+        this.tabSubscription = this.keyManager.tabOut.subscribe(() => this.closed.emit('tab'));
         // If a user manually (programmatically) focuses a menu item, we need to reflect that focus
         // change back to the key manager. Note that we don't need to unsubscribe here because focused
         // is internal and we know that it gets completed on destroy.
@@ -529,9 +523,7 @@ class KbqDropdown {
      * when it comes to maintaining the item order.
      */
     updateDirectDescendants() {
-        this.items.changes
-            .pipe(startWith(this.items))
-            .subscribe((items) => {
+        this.items.changes.pipe(startWith(this.items)).subscribe((items) => {
             this.directDescendantItems.reset(items.filter((item) => item.parentDropdownPanel === this));
             this.directDescendantItems.notifyOnChanges();
         });
@@ -539,7 +531,7 @@ class KbqDropdown {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdown, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: KBQ_DROPDOWN_DEFAULT_OPTIONS }], target: i0.ɵɵFactoryTarget.Component }); }
     /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqDropdown, selector: "kbq-dropdown", inputs: { navigationWithWrap: "navigationWithWrap", xPosition: "xPosition", yPosition: "yPosition", overlapTriggerY: "overlapTriggerY", overlapTriggerX: "overlapTriggerX", hasBackdrop: "hasBackdrop", panelClass: ["class", "panelClass"], backdropClass: "backdropClass" }, outputs: { closed: "closed" }, providers: [
             { provide: KBQ_DROPDOWN_PANEL, useExisting: KbqDropdown }
-        ], queries: [{ propertyName: "lazyContent", first: true, predicate: KbqDropdownContent, descendants: true }, { propertyName: "items", predicate: KbqDropdownItem, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["kbqDropdown"], ngImport: i0, template: "<ng-template>\n    <div class=\"kbq-dropdown__panel\"\n         [ngClass]=\"classList\"\n         [class.kbq-dropdown__panel_nested]=\"parent\"\n         [style.min-width]=\"triggerWidth\"\n         (keydown)=\"handleKeydown($event)\"\n         (click)=\"close()\"\n         [@transformDropdown]=\"panelAnimationState\"\n         (@transformDropdown.start)=\"onAnimationStart($event)\"\n         (@transformDropdown.done)=\"onAnimationDone($event)\"\n         tabindex=\"-1\">\n\n        <div class=\"kbq-dropdown__content\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n", styles: [".kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_left{margin-right:2px}.kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_right{margin-left:2px}.kbq-dropdown-trigger__icon{margin-left:auto}.kbq-dropdown__panel{margin-top:2px;min-width:var(--kbq-dropdown-size-container-width-min, 64px);max-width:var(--kbq-dropdown-size-container-width-max, 640px);border-radius:var(--kbq-dropdown-size-container-border-radius, 8px);padding-top:var(--kbq-dropdown-size-container-padding-vertical, 4px);padding-bottom:var(--kbq-dropdown-size-container-padding-vertical, 4px)}.kbq-dropdown__panel.ng-animating{pointer-events:none}.kbq-dropdown__content{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
+        ], queries: [{ propertyName: "lazyContent", first: true, predicate: KbqDropdownContent, descendants: true }, { propertyName: "items", predicate: KbqDropdownItem, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["kbqDropdown"], ngImport: i0, template: "<ng-template>\n    <div\n        tabindex=\"-1\"\n        class=\"kbq-dropdown__panel\"\n        [class.kbq-dropdown__panel_nested]=\"parent\"\n        [ngClass]=\"classList\"\n        [style.min-width]=\"triggerWidth\"\n        (@transformDropdown.done)=\"onAnimationDone($event)\"\n        (@transformDropdown.start)=\"onAnimationStart($event)\"\n        (click)=\"close()\"\n        (keydown)=\"handleKeydown($event)\"\n        [@transformDropdown]=\"panelAnimationState\"\n    >\n        <div class=\"kbq-dropdown__content\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n", styles: [".kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_left{margin-right:2px}.kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_right{margin-left:2px}.kbq-dropdown-trigger__icon{margin-left:auto}.kbq-dropdown__panel{margin-top:2px;min-width:var(--kbq-dropdown-size-container-width-min, 64px);max-width:var(--kbq-dropdown-size-container-width-max, 640px);border-radius:var(--kbq-dropdown-size-container-border-radius, 8px);padding-top:var(--kbq-dropdown-size-container-padding-vertical, 4px);padding-bottom:var(--kbq-dropdown-size-container-padding-vertical, 4px)}.kbq-dropdown__panel.ng-animating{pointer-events:none}.kbq-dropdown__content{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
             kbqDropdownAnimations.transformDropdown,
             kbqDropdownAnimations.fadeInItems
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
@@ -551,7 +543,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
                         kbqDropdownAnimations.fadeInItems
                     ], providers: [
                         { provide: KBQ_DROPDOWN_PANEL, useExisting: KbqDropdown }
-                    ], template: "<ng-template>\n    <div class=\"kbq-dropdown__panel\"\n         [ngClass]=\"classList\"\n         [class.kbq-dropdown__panel_nested]=\"parent\"\n         [style.min-width]=\"triggerWidth\"\n         (keydown)=\"handleKeydown($event)\"\n         (click)=\"close()\"\n         [@transformDropdown]=\"panelAnimationState\"\n         (@transformDropdown.start)=\"onAnimationStart($event)\"\n         (@transformDropdown.done)=\"onAnimationDone($event)\"\n         tabindex=\"-1\">\n\n        <div class=\"kbq-dropdown__content\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n", styles: [".kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_left{margin-right:2px}.kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_right{margin-left:2px}.kbq-dropdown-trigger__icon{margin-left:auto}.kbq-dropdown__panel{margin-top:2px;min-width:var(--kbq-dropdown-size-container-width-min, 64px);max-width:var(--kbq-dropdown-size-container-width-max, 640px);border-radius:var(--kbq-dropdown-size-container-border-radius, 8px);padding-top:var(--kbq-dropdown-size-container-padding-vertical, 4px);padding-bottom:var(--kbq-dropdown-size-container-padding-vertical, 4px)}.kbq-dropdown__panel.ng-animating{pointer-events:none}.kbq-dropdown__content{display:flex;flex-direction:column}\n"] }]
+                    ], template: "<ng-template>\n    <div\n        tabindex=\"-1\"\n        class=\"kbq-dropdown__panel\"\n        [class.kbq-dropdown__panel_nested]=\"parent\"\n        [ngClass]=\"classList\"\n        [style.min-width]=\"triggerWidth\"\n        (@transformDropdown.done)=\"onAnimationDone($event)\"\n        (@transformDropdown.start)=\"onAnimationStart($event)\"\n        (click)=\"close()\"\n        (keydown)=\"handleKeydown($event)\"\n        [@transformDropdown]=\"panelAnimationState\"\n    >\n        <div class=\"kbq-dropdown__content\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n", styles: [".kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_left{margin-right:2px}.kbq-dropdown-trigger.kbq-button-icon_right.kbq-button-icon_left .kbq-icon_right{margin-left:2px}.kbq-dropdown-trigger__icon{margin-left:auto}.kbq-dropdown__panel{margin-top:2px;min-width:var(--kbq-dropdown-size-container-width-min, 64px);max-width:var(--kbq-dropdown-size-container-width-max, 640px);border-radius:var(--kbq-dropdown-size-container-border-radius, 8px);padding-top:var(--kbq-dropdown-size-container-padding-vertical, 4px);padding-bottom:var(--kbq-dropdown-size-container-padding-vertical, 4px)}.kbq-dropdown__panel.ng-animating{pointer-events:none}.kbq-dropdown__content{display:flex;flex-direction:column}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [KBQ_DROPDOWN_DEFAULT_OPTIONS]
@@ -619,9 +611,7 @@ class KbqDropdownTrigger {
         this._dropdown = dropdown;
         this.closeSubscription.unsubscribe();
         if (dropdown) {
-            this.closeSubscription = dropdown.closed
-                .asObservable()
-                .subscribe((reason) => {
+            this.closeSubscription = dropdown.closed.asObservable().subscribe((reason) => {
                 this.destroy(reason);
                 // If a click closed the dropdown, we should close the entire chain of nested dropdowns.
                 if (['click', 'tab'].includes(reason) && this.parent) {
@@ -667,7 +657,7 @@ class KbqDropdownTrigger {
          * Handles touch start events on the trigger.
          * Needs to be an arrow function so we can easily use addEventListener and removeEventListener.
          */
-        this.handleTouchStart = () => this.openedBy = 'touch';
+        this.handleTouchStart = () => (this.openedBy = 'touch');
         elementRef.nativeElement.addEventListener('touchstart', this.handleTouchStart, passiveEventListenerOptions);
         if (dropdownItemInstance) {
             dropdownItemInstance.isNested = this.isNested();
@@ -709,8 +699,7 @@ class KbqDropdownTrigger {
             this.dropdown.lazyContent.detach();
             this.dropdown.lazyContent.attach(this.data);
         }
-        this.closeSubscription = this.closingActions()
-            .subscribe(() => this.close());
+        this.closeSubscription = this.closingActions().subscribe(() => this.close());
         this.init();
         if (this.dropdown instanceof KbqDropdown) {
             this.dropdown.startAnimation();
@@ -761,7 +750,7 @@ class KbqDropdownTrigger {
         }
         if ((this.isNested() &&
             ((keyCode === RIGHT_ARROW && this.dir === 'ltr') || (keyCode === LEFT_ARROW && this.dir === 'rtl'))) ||
-            (!this.isNested() && (keyCode === DOWN_ARROW$1 && this.openByArrowDown))) {
+            (!this.isNested() && keyCode === DOWN_ARROW$1 && this.openByArrowDown)) {
             event.preventDefault();
             this.openedBy = 'keyboard';
             this.open();
@@ -793,8 +782,7 @@ class KbqDropdownTrigger {
         this.openedBy = undefined;
         if (this.dropdown instanceof KbqDropdown) {
             this.dropdown.resetAnimation();
-            const animationSubscription = this.dropdown.animationDone
-                .pipe(filter((event) => event.toState === 'void'), take(1));
+            const animationSubscription = this.dropdown.animationDone.pipe(filter((event) => event.toState === 'void'), take(1));
             if (this.dropdown.lazyContent) {
                 // Wait for the exit animation to finish before detaching the content.
                 animationSubscription
@@ -808,8 +796,7 @@ class KbqDropdownTrigger {
                 });
             }
             else {
-                animationSubscription
-                    .subscribe(() => this.setIsOpened(false));
+                animationSubscription.subscribe(() => this.setIsOpened(false));
             }
         }
         else {
@@ -866,8 +853,7 @@ class KbqDropdownTrigger {
             // Consume the `keydownEvents` in order to prevent them from going to another overlay.
             // Ideally we'd also have our keyboard event logic in here, however doing so will
             // break anybody that may have implemented the `KbqDropdownPanel` themselves.
-            this.overlayRef.keydownEvents()
-                .subscribe();
+            this.overlayRef.keydownEvents().subscribe();
         }
         return this.overlayRef;
     }
@@ -877,7 +863,8 @@ class KbqDropdownTrigger {
      */
     getOverlayConfig() {
         return new OverlayConfig({
-            positionStrategy: this.overlay.position()
+            positionStrategy: this.overlay
+                .position()
                 .flexibleConnectedTo(this.elementRef)
                 .withLockedPosition()
                 .withTransformOriginOn('.kbq-dropdown__panel'),
@@ -893,8 +880,7 @@ class KbqDropdownTrigger {
      */
     subscribeToPositions(position) {
         if (this.dropdown.setPositionClasses) {
-            position.positionChanges
-                .subscribe((change) => {
+            position.positionChanges.subscribe((change) => {
                 const posX = change.connectionPair.overlayX === 'start' ? 'after' : 'before';
                 const posY = change.connectionPair.overlayY === 'top' ? 'below' : 'above';
                 this.dropdown.setPositionClasses(posX, posY);
@@ -907,13 +893,11 @@ class KbqDropdownTrigger {
      * @param positionStrategy Strategy whose position to update.
      */
     setPosition(positionStrategy) {
-        let [originX, originFallbackX, overlayX, overlayFallbackX] = this.dropdown.xPosition === 'before' ?
-            ['end', 'start', 'end', 'start'] :
-            ['start', 'end', 'start', 'end'];
+        let [originX, originFallbackX, overlayX, overlayFallbackX] = this.dropdown.xPosition === 'before' ? ['end', 'start', 'end', 'start'] : ['start', 'end', 'start', 'end'];
         // tslint:disable-next-line:prefer-const
-        let [overlayY, overlayFallbackY, originY, originFallbackY] = this.dropdown.yPosition === 'above' ?
-            ['bottom', 'top', 'bottom', 'top'] :
-            ['top', 'bottom', 'top', 'bottom'];
+        let [overlayY, overlayFallbackY, originY, originFallbackY] = this.dropdown.yPosition === 'above'
+            ? ['bottom', 'top', 'bottom', 'top']
+            : ['top', 'bottom', 'top', 'bottom'];
         let offsetY = 0;
         let offsetX = 0;
         if (this.isNested()) {
@@ -966,8 +950,9 @@ class KbqDropdownTrigger {
         const outsidePointerEvents = this.overlayRef.outsidePointerEvents();
         const detachments = this.overlayRef.detachments();
         const parentClose = this.parent ? this.parent.closed : of();
-        const hover = this.parent ? this.parent.hovered()
-            .pipe(filter((active) => active !== this.dropdownItemInstance), filter(() => this._opened)) : of();
+        const hover = this.parent
+            ? this.parent.hovered().pipe(filter((active) => active !== this.dropdownItemInstance), filter(() => this._opened))
+            : of();
         return merge(backdrop, outsidePointerEvents, parentClose, hover, detachments);
     }
     /** Handles the cases where the user hovers over the trigger. */
@@ -976,7 +961,8 @@ class KbqDropdownTrigger {
         if (!this.isNested()) {
             return;
         }
-        this.hoverSubscription = this.parent.hovered()
+        this.hoverSubscription = this.parent
+            .hovered()
             // Since we might have multiple competing triggers for the same dropdown (e.g. a nested dropdown
             // with different data and triggers), we have to delay it by a tick to ensure that
             // it won't be closed immediately after it is opened.