@koobiq/components 16.0.0-beta.9 → 17.0.0-beta.2

package/fesm2022/koobiq-components-divider.mjs

@@ -29,10 +29,10 @@ class KbqDivider {
     set paddings(value) {
         this._paddings = coerceBooleanProperty(value);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDivider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqDivider, selector: "kbq-divider", inputs: { vertical: "vertical", inset: "inset", paddings: "paddings" }, host: { properties: { "class.kbq-divider_vertical": "vertical", "class.kbq-divider_horizontal": "!vertical", "class.kbq-divider_inset": "inset", "class.kbq-divider_paddings": "paddings" }, classAttribute: "kbq-divider" }, ngImport: i0, template: '', isInline: true, styles: [".kbq-divider{display:block;margin:0}.kbq-divider.kbq-divider_horizontal{height:var(--kbq-divider-size-horizontal-width, 1px)}.kbq-divider.kbq-divider_horizontal.kbq-divider_paddings{margin-top:var(--kbq-divider-size-horizontal-margin-vertical, 4px);margin-bottom:var(--kbq-divider-size-horizontal-margin-vertical, 4px)}.kbq-divider.kbq-divider_vertical{width:var(--kbq-divider-size-vertical-width, 1px);height:100%}.kbq-divider.kbq-divider_vertical.kbq-divider_paddings{margin-left:var(--kbq-divider-size-vertical-margin-horizontal, 4px);margin-right:var(--kbq-divider-size-vertical-margin-horizontal, 4px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDivider, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqDivider, selector: "kbq-divider", inputs: { vertical: "vertical", inset: "inset", paddings: "paddings" }, host: { properties: { "class.kbq-divider_vertical": "vertical", "class.kbq-divider_horizontal": "!vertical", "class.kbq-divider_inset": "inset", "class.kbq-divider_paddings": "paddings" }, classAttribute: "kbq-divider" }, ngImport: i0, template: '', isInline: true, styles: [".kbq-divider{display:block;margin:0}.kbq-divider.kbq-divider_horizontal{height:var(--kbq-divider-size-horizontal-width, 1px)}.kbq-divider.kbq-divider_horizontal.kbq-divider_paddings{margin-top:var(--kbq-divider-size-horizontal-margin-vertical, 4px);margin-bottom:var(--kbq-divider-size-horizontal-margin-vertical, 4px)}.kbq-divider.kbq-divider_vertical{width:var(--kbq-divider-size-vertical-width, 1px);height:100%}.kbq-divider.kbq-divider_vertical.kbq-divider_paddings{margin-left:var(--kbq-divider-size-vertical-margin-horizontal, 4px);margin-right:var(--kbq-divider-size-vertical-margin-horizontal, 4px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDivider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDivider, decorators: [{
             type: Component,
             args: [{ selector: 'kbq-divider', host: {
                         class: 'kbq-divider',
@@ -50,11 +50,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
             }] } });
 
 class KbqDividerModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.5", ngImport: i0, type: KbqDividerModule, declarations: [KbqDivider], imports: [CommonModule], exports: [KbqDivider] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDividerModule, imports: [CommonModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.0", ngImport: i0, type: KbqDividerModule, declarations: [KbqDivider], imports: [CommonModule], exports: [KbqDivider] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDividerModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDividerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDividerModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],

package/fesm2022/koobiq-components-dl.mjs

@@ -31,10 +31,10 @@ class KbqDlComponent {
     ngOnDestroy() {
         this.resizeSubscription.unsubscribe();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqDlComponent, selector: "kbq-dl", inputs: { minWidth: "minWidth", wide: "wide", vertical: "vertical" }, host: { listeners: { "window:resize": "resizeStream.next($event)" }, properties: { "class.kbq-dl_vertical": "vertical", "class.kbq-dl_wide": "wide" }, classAttribute: "kbq-dl" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".kbq-dl{display:grid;column-gap:var(--kbq-description-list-size-horizontal-content-gap-horizontal, 16px);row-gap:var(--kbq-description-list-size-horizontal-gap-vertical, 16px);grid-template-columns:repeat(4,1fr)}.kbq-dl .kbq-dt{grid-column:1}.kbq-dl .kbq-dd{grid-column:2/span 3}.kbq-dl.kbq-dl_wide{grid-template-columns:repeat(2,1fr)}.kbq-dl.kbq-dl_wide .kbq-dt{grid-column:1}.kbq-dl.kbq-dl_wide .kbq-dd{grid-column:2}.kbq-dl.kbq-dl_vertical{grid-template-columns:repeat(1,1fr);row-gap:var(--kbq-description-list-size-vertical-content-gap-vertical, 2px)}.kbq-dl.kbq-dl_vertical .kbq-dt,.kbq-dl.kbq-dl_vertical .kbq-dd{grid-column:1}.kbq-dl.kbq-dl_vertical .kbq-dd{margin-bottom:var(--kbq-description-list-size-vertical-gap-vertical, 12px)}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqDlComponent, selector: "kbq-dl", inputs: { minWidth: "minWidth", wide: "wide", vertical: "vertical" }, host: { listeners: { "window:resize": "resizeStream.next($event)" }, properties: { "class.kbq-dl_vertical": "vertical", "class.kbq-dl_wide": "wide" }, classAttribute: "kbq-dl" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".kbq-dl{display:grid;column-gap:var(--kbq-description-list-size-horizontal-content-gap-horizontal, 16px);row-gap:var(--kbq-description-list-size-horizontal-gap-vertical, 16px);grid-template-columns:repeat(4,1fr)}.kbq-dl .kbq-dt{grid-column:1}.kbq-dl .kbq-dd{grid-column:2/span 3}.kbq-dl.kbq-dl_wide{grid-template-columns:repeat(2,1fr)}.kbq-dl.kbq-dl_wide .kbq-dt{grid-column:1}.kbq-dl.kbq-dl_wide .kbq-dd{grid-column:2}.kbq-dl.kbq-dl_vertical{grid-template-columns:repeat(1,1fr);row-gap:var(--kbq-description-list-size-vertical-content-gap-vertical, 2px)}.kbq-dl.kbq-dl_vertical .kbq-dt,.kbq-dl.kbq-dl_vertical .kbq-dd{grid-column:1}.kbq-dl.kbq-dl_vertical .kbq-dd{margin-bottom:var(--kbq-description-list-size-vertical-gap-vertical, 12px)}\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDlComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDlComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kbq-dl', template: '<ng-content></ng-content>', host: {
                         class: 'kbq-dl',
@@ -42,7 +42,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                         '[class.kbq-dl_wide]': 'wide',
                         '(window:resize)': 'resizeStream.next($event)'
                     }, encapsulation: ViewEncapsulation.None, styles: [".kbq-dl{display:grid;column-gap:var(--kbq-description-list-size-horizontal-content-gap-horizontal, 16px);row-gap:var(--kbq-description-list-size-horizontal-gap-vertical, 16px);grid-template-columns:repeat(4,1fr)}.kbq-dl .kbq-dt{grid-column:1}.kbq-dl .kbq-dd{grid-column:2/span 3}.kbq-dl.kbq-dl_wide{grid-template-columns:repeat(2,1fr)}.kbq-dl.kbq-dl_wide .kbq-dt{grid-column:1}.kbq-dl.kbq-dl_wide .kbq-dd{grid-column:2}.kbq-dl.kbq-dl_vertical{grid-template-columns:repeat(1,1fr);row-gap:var(--kbq-description-list-size-vertical-content-gap-vertical, 2px)}.kbq-dl.kbq-dl_vertical .kbq-dt,.kbq-dl.kbq-dl_vertical .kbq-dd{grid-column:1}.kbq-dl.kbq-dl_vertical .kbq-dd{margin-bottom:var(--kbq-description-list-size-vertical-gap-vertical, 12px)}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { minWidth: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { minWidth: [{
                 type: Input
             }], wide: [{
                 type: Input
@@ -50,10 +50,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                 type: Input
             }] } });
 class KbqDtComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDtComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqDtComponent, selector: "kbq-dt", host: { classAttribute: "kbq-dt" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDtComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqDtComponent, selector: "kbq-dt", host: { classAttribute: "kbq-dt" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDtComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDtComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kbq-dt',
@@ -65,10 +65,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                 }]
         }] });
 class KbqDdComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: KbqDdComponent, selector: "kbq-dd", host: { classAttribute: "kbq-dd" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDdComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqDdComponent, selector: "kbq-dd", host: { classAttribute: "kbq-dd" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDdComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDdComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'kbq-dd',
@@ -81,19 +81,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
         }] });
 
 class KbqDlModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.5", ngImport: i0, type: KbqDlModule, declarations: [KbqDlComponent,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDlModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.0", ngImport: i0, type: KbqDlModule, declarations: [KbqDlComponent,
             KbqDtComponent,
             KbqDdComponent], imports: [CommonModule,
             A11yModule,
             PlatformModule], exports: [KbqDlComponent,
             KbqDtComponent,
             KbqDdComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDlModule, imports: [CommonModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDlModule, imports: [CommonModule,
             A11yModule,
             PlatformModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDlModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDlModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

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 {\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":";;;;;;;;MAwBa,cAAc,CAAA;AAUvB,IAAA,WAAA,CAAsB,UAAsB,EAAA;QAAtB,IAAU,CAAA,UAAA,GAAV,UAAU,CAAY;QATnC,IAAQ,CAAA,QAAA,GAAW,GAAG,CAAC;QACvB,IAAI,CAAA,IAAA,GAAG,KAAK,CAAC;QACb,IAAQ,CAAA,QAAA,GAAmB,IAAI,CAAC;AAEhC,QAAA,IAAA,CAAA,YAAY,GAAG,IAAI,OAAO,EAAS,CAAC;QAC5B,IAAsB,CAAA,sBAAA,GAAW,GAAG,CAAC;AAE9C,QAAA,IAAA,CAAA,kBAAkB,GAAG,YAAY,CAAC,KAAK,CAAC;QAgBhD,IAAW,CAAA,WAAA,GAAG,MAAK;AACf,YAAA,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC;YAEpE,IAAI,CAAC,QAAQ,GAAG,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC;AAC3C,SAAC,CAAA;KAlB+C;IAEhD,kBAAkB,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;YAAE,OAAO;SAAE;AAEvC,QAAA,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,YAAY;AACtC,aAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;AAC/C,aAAA,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;KACpC;IAED,WAAW,GAAA;AACP,QAAA,IAAI,CAAC,kBAAkB,CAAC,WAAW,EAAE,CAAC;KACzC;iIAtBQ,cAAc,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,uSAVb,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,wuBAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAU5B,cAAc,EAAA,UAAA,EAAA,CAAA;kBAZ1B,SAAS;+BACI,QAAQ,EAAA,QAAA,EACR,2BAA2B,EAE/B,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,QAAQ;AACf,wBAAA,yBAAyB,EAAE,UAAU;AACrC,wBAAA,qBAAqB,EAAE,MAAM;AAC7B,wBAAA,iBAAiB,EAAE,2BAA2B;qBACjD,EACc,aAAA,EAAA,iBAAiB,CAAC,IAAI,EAAA,MAAA,EAAA,CAAA,wuBAAA,CAAA,EAAA,CAAA;+EAG5B,QAAQ,EAAA,CAAA;sBAAhB,KAAK;gBACG,IAAI,EAAA,CAAA;sBAAZ,KAAK;gBACG,QAAQ,EAAA,CAAA;sBAAhB,KAAK;;MAoCG,cAAc,CAAA;iIAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,kFANb,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAM5B,cAAc,EAAA,UAAA,EAAA,CAAA;kBAR1B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,QAAQ;AAClB,oBAAA,QAAQ,EAAE,2BAA2B;AACrC,oBAAA,IAAI,EAAE;AACF,wBAAA,KAAK,EAAE,QAAQ;AAClB,qBAAA;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACxC,iBAAA,CAAA;;MAWY,cAAc,CAAA;iIAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,kFANb,2BAA2B,EAAA,QAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAM5B,cAAc,EAAA,UAAA,EAAA,CAAA;kBAR1B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,QAAQ;AAClB,oBAAA,QAAQ,EAAE,2BAA2B;AACrC,oBAAA,IAAI,EAAE;AACF,wBAAA,KAAK,EAAE,QAAQ;AAClB,qBAAA;oBACD,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACxC,iBAAA,CAAA;;;MC3CY,WAAW,CAAA;iIAAX,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;AAAX,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,WAAW,iBALhB,cAAc;YACd,cAAc;AACd,YAAA,cAAc,aAZd,YAAY;YACZ,UAAU;AACV,YAAA,cAAc,aAGd,cAAc;YACd,cAAc;YACd,cAAc,CAAA,EAAA,CAAA,CAAA,EAAA;AAQT,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,WAAW,YAfhB,YAAY;YACZ,UAAU;YACV,cAAc,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAaT,WAAW,EAAA,UAAA,EAAA,CAAA;kBAjBvB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,UAAU;wBACV,cAAc;AACjB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACL,cAAc;wBACd,cAAc;wBACd,cAAc;AACjB,qBAAA;AACD,oBAAA,YAAY,EAAE;wBACV,cAAc;wBACd,cAAc;wBACd,cAAc;AACjB,qBAAA;AACJ,iBAAA,CAAA;;;AC5BD;;AAEG;;;;"}

package/fesm2022/koobiq-components-dropdown.mjs

@@ -88,18 +88,18 @@ class KbqDropdownContent {
     ngOnDestroy() {
         this.outlet?.dispose();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownContent, deps: [{ token: i0.TemplateRef }, { token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }, { token: i0.ViewContainerRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqDropdownContent, selector: "ng-template[kbqDropdownContent]", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownContent, deps: [{ token: i0.TemplateRef }, { token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }, { token: i0.ViewContainerRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqDropdownContent, selector: "ng-template[kbqDropdownContent]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownContent, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[kbqDropdownContent]'
                 }]
-        }], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ComponentFactoryResolver }, { type: i0.ApplicationRef }, { type: i0.Injector }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ComponentFactoryResolver }, { type: i0.ApplicationRef }, { type: i0.Injector }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
-                }] }]; } });
+                }] }] });
 
 // Boilerplate for applying mixins to KbqDropdownItem.
 /** @docs-private */
@@ -202,28 +202,29 @@ class KbqDropdownItem extends KbqDropdownItemMixinBase {
             event.stopPropagation();
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", 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: "16.1.5", 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", "attr.disabled": "disabled || null", "attr.tabindex": "getTabIndex()" }, classAttribute: "kbq-dropdown-item" }, providers: [
+    /** @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,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 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;user-select:none}.kbq-dropdown-item{-webkit-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, 4px) - 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, 4px) - 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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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;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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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 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{-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, 4px) - 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, 4px) - 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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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: "16.1.5", ngImport: i0, type: KbqDropdownItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownItem, decorators: [{
             type: Component,
             args: [{ selector: 'kbq-dropdown-item, [kbq-dropdown-item]', exportAs: 'kbqDropdownItem', inputs: ['disabled'], host: {
                         class: 'kbq-dropdown-item',
                         '[class.kbq-dropdown-item_with-icon]': 'icon',
                         '[class.kbq-dropdown-item_highlighted]': 'highlighted',
+                        '[class.kbq-disabled]': 'disabled',
                         '[attr.disabled]': 'disabled || null',
                         '[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,rgba(0,0,0,.04) 10px,rgba(255,255,255,.04) 10px,rgba(255,255,255,.04) 20px,rgba(0,0,0,.04) 20px,rgba(0,0,0,.04) 30px,rgba(255,255,255,.04) 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;user-select:none}.kbq-dropdown-item{-webkit-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, 4px) - 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, 4px) - 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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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;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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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: function () { return [{ type: i0.ElementRef }, { type: i1.FocusMonitor }, { type: undefined, decorators: [{
+                    ], 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{-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, 4px) - 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, 4px) - 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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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, 4px);padding-bottom:var(--kbq-list-size-text-padding-vertical, 4px)}.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]
                 }, {
                     type: Optional
-                }] }]; }, propDecorators: { textElement: [{
+                }] }], propDecorators: { textElement: [{
                 type: ViewChild,
                 args: ['kbqTitleText', { static: true }]
             }], icon: [{
@@ -535,15 +536,15 @@ class KbqDropdown {
             this.directDescendantItems.notifyOnChanges();
         });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", 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: "16.1.5", 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: [
+    /** @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: [
             kbqDropdownAnimations.transformDropdown,
             kbqDropdownAnimations.fadeInItems
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdown, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdown, decorators: [{
             type: Component,
             args: [{ selector: 'kbq-dropdown', exportAs: 'kbqDropdown', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, animations: [
                         kbqDropdownAnimations.transformDropdown,
@@ -551,10 +552,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                     ], 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"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [KBQ_DROPDOWN_DEFAULT_OPTIONS]
-                }] }]; }, propDecorators: { navigationWithWrap: [{
+                }] }], propDecorators: { navigationWithWrap: [{
                 type: Input
             }], xPosition: [{
                 type: Input
@@ -1012,10 +1013,10 @@ class KbqDropdownTrigger {
         const { width, borderRightWidth, borderLeftWidth } = window.getComputedStyle(nativeElement);
         return `${parseInt(width) - parseInt(borderRightWidth) - parseInt(borderLeftWidth)}px`;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownTrigger, deps: [{ token: i1$1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: KBQ_DROPDOWN_SCROLL_STRATEGY }, { token: KbqDropdown, optional: true }, { token: KbqDropdownItem, optional: true, self: true }, { token: i4.Directionality, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.1.5", type: KbqDropdownTrigger, selector: "[kbqDropdownTriggerFor]", inputs: { data: ["kbqDropdownTriggerData", "data"], openByArrowDown: "openByArrowDown", restoreFocus: ["kbqDropdownTriggerRestoreFocus", "restoreFocus"], dropdown: ["kbqDropdownTriggerFor", "dropdown"] }, outputs: { dropdownOpened: "dropdownOpened", dropdownClosed: "dropdownClosed" }, host: { listeners: { "mousedown": "handleMousedown($event)", "keydown": "handleKeydown($event)", "click": "handleClick($event)" }, properties: { "class.kbq-pressed": "opened" }, classAttribute: "kbq-dropdown-trigger" }, exportAs: ["kbqDropdownTrigger"], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownTrigger, deps: [{ token: i1$1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: KBQ_DROPDOWN_SCROLL_STRATEGY }, { token: KbqDropdown, optional: true }, { token: KbqDropdownItem, optional: true, self: true }, { token: i4.Directionality, optional: true }, { token: i0.ChangeDetectorRef }, { token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqDropdownTrigger, selector: "[kbqDropdownTriggerFor]", inputs: { data: ["kbqDropdownTriggerData", "data"], openByArrowDown: "openByArrowDown", restoreFocus: ["kbqDropdownTriggerRestoreFocus", "restoreFocus"], dropdown: ["kbqDropdownTriggerFor", "dropdown"] }, outputs: { dropdownOpened: "dropdownOpened", dropdownClosed: "dropdownClosed" }, host: { listeners: { "mousedown": "handleMousedown($event)", "keydown": "handleKeydown($event)", "click": "handleClick($event)" }, properties: { "class.kbq-pressed": "opened" }, classAttribute: "kbq-dropdown-trigger" }, exportAs: ["kbqDropdownTrigger"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: `[kbqDropdownTriggerFor]`,
@@ -1028,7 +1029,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                         '(click)': 'handleClick($event)'
                     }
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.Overlay }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [KBQ_DROPDOWN_SCROLL_STRATEGY]
                 }] }, { type: KbqDropdown, decorators: [{
@@ -1039,7 +1040,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
                     type: Self
                 }] }, { type: i4.Directionality, decorators: [{
                     type: Optional
-                }] }, { type: i0.ChangeDetectorRef }, { type: i1.FocusMonitor }]; }, propDecorators: { data: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: i1.FocusMonitor }], propDecorators: { data: [{
                 type: Input,
                 args: ['kbqDropdownTriggerData']
             }], openByArrowDown: [{
@@ -1057,8 +1058,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
             }] } });
 
 class KbqDropdownModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownModule, declarations: [KbqDropdown,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownModule, declarations: [KbqDropdown,
             KbqDropdownItem,
             KbqDropdownTrigger,
             KbqDropdownContent], imports: [CommonModule,
@@ -1067,11 +1068,11 @@ class KbqDropdownModule {
             KbqDropdownItem,
             KbqDropdownTrigger,
             KbqDropdownContent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownModule, providers: [KBQ_DROPDOWN_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [CommonModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownModule, providers: [KBQ_DROPDOWN_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [CommonModule,
             OverlayModule,
             KbqIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: KbqDropdownModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqDropdownModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [