@taiga-ui/core 2.54.0 → 3.0.0-rc.0

package/fesm2015/taiga-ui-core-components-data-list.js

@@ -1,21 +1,27 @@
-import { __decorate, __param } from 'tslib';
-import { Optional, Inject, forwardRef, ElementRef, Self, Input, HostBinding, HostListener, Component, ChangeDetectionStrategy, ContentChildren, ViewEncapsulation, Directive, NgModule } from '@angular/core';
-import { isNativeFocused, setNativeFocused, tuiDefaultProp, EMPTY_QUERY, itemsQueryListObservable, moveFocus, isNativeFocusedIn, setNativeMouseFocused, isPresent, tuiAssertIsHTMLElement, tuiPure, typedFromEvent, preventDefault, getClosestKeyboardFocusable } from '@taiga-ui/cdk';
+import { __decorate } from 'tslib';
+import * as i0 from '@angular/core';
+import { forwardRef, ElementRef, Component, ChangeDetectionStrategy, Optional, Inject, Self, Input, HostBinding, HostListener, ViewEncapsulation, ContentChildren, Directive, NgModule } from '@angular/core';
+import { tuiIsNativeFocused, setNativeFocused, tuiDefaultProp, EMPTY_QUERY, itemsQueryListObservable, tuiMoveFocus, tuiIsNativeFocusedIn, setNativeMouseFocused, isPresent, tuiAssertIsElement, tuiPure, typedFromEvent, preventDefault, tuiGetClosestFocusable } from '@taiga-ui/cdk';
 import { TUI_OPTION_CONTENT, TUI_DATA_LIST_HOST, TUI_NOTHING_FOUND_MESSAGE, TUI_DATA_LIST_ACCESSOR } from '@taiga-ui/core/tokens';
-import { Observable, merge, EMPTY } from 'rxjs';
 import { map, switchMap, take, filter, tap, shareReplay, mapTo, debounceTime } from 'rxjs/operators';
+import * as i5 from '@taiga-ui/core/directives/dropdown';
 import { TuiDropdownDirective } from '@taiga-ui/core/directives/dropdown';
 import { shouldCall } from '@tinkoff/ng-event-plugins';
-import { CommonModule } from '@angular/common';
+import * as i1 from '@taiga-ui/core/components/svg';
 import { TuiSvgModule } from '@taiga-ui/core/components/svg';
+import * as i2 from '@tinkoff/ng-polymorpheus';
 import { PolymorpheusModule } from '@tinkoff/ng-polymorpheus';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i3 from 'rxjs';
+import { merge, EMPTY } from 'rxjs';
 
 // eslint-disable-next-line @typescript-eslint/naming-convention
 function shouldFocus({ currentTarget, }) {
-    return !isNativeFocused(currentTarget);
+    return !tuiIsNativeFocused(currentTarget);
 }
 // TODO: Consider all use cases for aria roles
-let TuiOptionComponent = class TuiOptionComponent {
+class TuiOptionComponent {
     // TODO: 3.0 Fix dataList type when updated to Ivy and compilation drops metadata
     constructor(content, dataList, elementRef, host, dropdown) {
         this.content = content;
@@ -23,8 +29,8 @@ let TuiOptionComponent = class TuiOptionComponent {
         this.elementRef = elementRef;
         this.host = host;
         this.dropdown = dropdown;
-        this.size = 'm';
-        this.role = 'option';
+        this.size = `m`;
+        this.role = `option`;
         this.disabled = false;
     }
     get active() {
@@ -43,75 +49,94 @@ let TuiOptionComponent = class TuiOptionComponent {
     ngOnDestroy() {
         this.dataList.handleFocusLossIfNecessary(this.elementRef.nativeElement);
     }
-};
-TuiOptionComponent.ctorParameters = () => [
-    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TUI_OPTION_CONTENT,] }] },
-    { type: TuiDataListComponent, decorators: [{ type: Inject, args: [forwardRef(() => TuiDataListComponent),] }] },
-    { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
-    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [TUI_DATA_LIST_HOST,] }] },
-    { type: TuiDropdownDirective, decorators: [{ type: Optional }, { type: Self }, { type: Inject, args: [TuiDropdownDirective,] }] }
-];
+}
+TuiOptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiOptionComponent, deps: [{ token: TUI_OPTION_CONTENT, optional: true }, { token: forwardRef(() => TuiDataListComponent) }, { token: ElementRef }, { token: TUI_DATA_LIST_HOST, optional: true }, { token: TuiDropdownDirective, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+TuiOptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiOptionComponent, selector: "button[tuiOption], a[tuiOption]", inputs: { size: "size", role: "role", disabled: "disabled", value: "value" }, host: { attributes: { "tabIndex": "-1", "type": "button" }, listeners: { "click": "onClick()", "mousemove.init": "onMouseMove($event)", "mousemove.silent": "onMouseMove($event)" }, properties: { "attr.disabled": "disabled || null", "attr.data-size": "this.size", "attr.role": "this.role", "class._with-dropdown": "this.active" } }, ngImport: i0, template: "<ng-container *polymorpheusOutlet=\"content || base as text; context: {$implicit: base}\">\n    {{ text }}\n</ng-container>\n<ng-template #base>\n    <ng-content></ng-content>\n    <tui-svg\n        *ngIf=\"dropdown\"\n        src=\"tuiIconChevronRight\"\n        class=\"t-arrow\"\n    ></tui-svg>\n</ng-template>\n", styles: [":host{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;transition-property:background;transition-duration:.3s;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:flex;font:var(--tui-font-text-m);width:100%;align-items:center;justify-content:space-between;text-align:left;box-sizing:border-box;color:var(--tui-text-01);outline:none;text-decoration:none;cursor:pointer;background-clip:padding-box}:host:disabled{opacity:var(--tui-disabled-opacity);cursor:default}:host:focus,:host._with-dropdown{background-color:var(--tui-base-02)}:host[data-size=xs]{font:var(--tui-font-text-s);min-height:2rem;padding:.3125rem .75rem}:host[data-size=s]{min-height:2rem;padding:.3125rem .75rem}:host[data-size=m]{min-height:2.75rem;padding:.375rem 1rem}:host[data-size=l]{min-height:3.5rem;padding:.75rem 1rem}.t-arrow{margin:0 -.5rem 0 .75rem}\n"], components: [{ type: i1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }], directives: [{ type: i2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
-    Input(),
-    HostBinding('attr.data-size'),
     tuiDefaultProp()
 ], TuiOptionComponent.prototype, "size", void 0);
 __decorate([
-    Input(),
-    HostBinding('attr.role'),
     tuiDefaultProp()
 ], TuiOptionComponent.prototype, "role", void 0);
 __decorate([
-    Input(),
     tuiDefaultProp()
 ], TuiOptionComponent.prototype, "disabled", void 0);
 __decorate([
-    Input()
-], TuiOptionComponent.prototype, "value", void 0);
-__decorate([
-    HostBinding('class._with-dropdown')
-], TuiOptionComponent.prototype, "active", null);
-__decorate([
-    HostListener('click')
-], TuiOptionComponent.prototype, "onClick", null);
-__decorate([
-    shouldCall(shouldFocus),
-    HostListener('mousemove.init', ['$event']),
-    HostListener('mousemove.silent', ['$event'])
+    shouldCall(shouldFocus)
 ], TuiOptionComponent.prototype, "onMouseMove", null);
-TuiOptionComponent = __decorate([
-    Component({
-        selector: `button[tuiOption], a[tuiOption]`,
-        template: "<span\n    *ngIf=\"content; else base\"\n    polymorpheus-outlet\n    class=\"t-content\"\n    [content]=\"content\"\n    [context]=\"{$implicit: base}\"\n></span>\n<ng-template #base>\n    <ng-content></ng-content>\n    <tui-svg\n        *ngIf=\"dropdown\"\n        src=\"tuiIconChevronRight\"\n        class=\"t-arrow\"\n    ></tui-svg>\n</ng-template>\n",
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        host: {
-            tabIndex: '-1',
-            type: 'button',
-            '[attr.disabled]': 'disabled || null',
-        },
-        styles: [":host{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:padding-box;font-size:inherit;line-height:inherit;transition-property:background;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;display:flex;font:var(--tui-font-text-m);width:100%;align-items:center;justify-content:space-between;text-align:left;box-sizing:border-box;color:var(--tui-text-01);outline:0;text-decoration:none;cursor:pointer}:host:disabled{opacity:var(--tui-disabled-opacity);cursor:default}:host._with-dropdown,:host:focus{background-color:var(--tui-base-02)}:host[data-size=xs]{font:var(--tui-font-text-s);min-height:2rem;padding:.3125rem .75rem}:host[data-size='s']{min-height:2rem;padding:.3125rem .75rem}:host[data-size='m']{min-height:2.75rem;padding:.375rem 1rem}:host[data-size='l']{min-height:3.5rem;padding:.75rem 1rem}.t-content{display:flex;flex:1;max-width:100%}.t-arrow{margin:0 -.5rem 0 .75rem}"]
-    }),
-    __param(0, Optional()),
-    __param(0, Inject(TUI_OPTION_CONTENT)),
-    __param(1, Inject(forwardRef(() => TuiDataListComponent))),
-    __param(2, Inject(ElementRef)),
-    __param(3, Optional()),
-    __param(3, Inject(TUI_DATA_LIST_HOST)),
-    __param(4, Optional()),
-    __param(4, Self()),
-    __param(4, Inject(TuiDropdownDirective))
-], TuiOptionComponent);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiOptionComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: `button[tuiOption], a[tuiOption]`,
+                    templateUrl: `./option.template.html`,
+                    styleUrls: [`./option.style.less`],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        tabIndex: `-1`,
+                        type: `button`,
+                        '[attr.disabled]': `disabled || null`,
+                    },
+                }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [TUI_OPTION_CONTENT]
+                }] }, { type: TuiDataListComponent, decorators: [{
+                    type: Inject,
+                    args: [forwardRef(() => TuiDataListComponent)]
+                }] }, { type: i0.ElementRef, decorators: [{
+                    type: Inject,
+                    args: [ElementRef]
+                }] }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [TUI_DATA_LIST_HOST]
+                }] }, { type: i5.TuiDropdownDirective, decorators: [{
+                    type: Optional
+                }, {
+                    type: Self
+                }, {
+                    type: Inject,
+                    args: [TuiDropdownDirective]
+                }] }]; }, propDecorators: { size: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: [`attr.data-size`]
+            }], role: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: [`attr.role`]
+            }], disabled: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], active: [{
+                type: HostBinding,
+                args: [`class._with-dropdown`]
+            }], onClick: [{
+                type: HostListener,
+                args: [`click`]
+            }], onMouseMove: [{
+                type: HostListener,
+                args: [`mousemove.init`, [`$event`]]
+            }, {
+                type: HostListener,
+                args: [`mousemove.silent`, [`$event`]]
+            }] } });
 
-var TuiDataListComponent_1;
 // TODO: Consider aria-activedescendant for proper accessibility implementation
 // @dynamic
-let TuiDataListComponent = TuiDataListComponent_1 = class TuiDataListComponent {
+class TuiDataListComponent {
     constructor(elementRef, defaultEmptyContent$) {
         this.elementRef = elementRef;
         this.defaultEmptyContent$ = defaultEmptyContent$;
         this.options = EMPTY_QUERY;
-        this.role = 'listbox';
-        this.emptyContent = '';
+        this.role = `listbox`;
+        this.emptyContent = ``;
     }
     get empty$() {
         return itemsQueryListObservable(this.options).pipe(map(({ length }) => !length));
@@ -124,11 +149,11 @@ let TuiDataListComponent = TuiDataListComponent_1 = class TuiDataListComponent {
     noop() { }
     onKeyDownArrow(current, step) {
         const { elements } = this;
-        moveFocus(elements.indexOf(current), elements, step);
+        tuiMoveFocus(elements.indexOf(current), elements, step);
     }
     // TODO: Consider aria-activedescendant for proper accessibility implementation
     handleFocusLossIfNecessary(element = this.elementRef.nativeElement) {
-        if (this.origin && isNativeFocusedIn(element)) {
+        if (this.origin && tuiIsNativeFocusedIn(element)) {
             setNativeMouseFocused(this.origin, true, true);
         }
     }
@@ -140,76 +165,95 @@ let TuiDataListComponent = TuiDataListComponent_1 = class TuiDataListComponent {
             .filter(isPresent);
     }
     onFocus({ target }, top) {
-        tuiAssertIsHTMLElement(target);
+        tuiAssertIsElement(target);
         const { elements } = this;
-        moveFocus(top ? -1 : elements.length, elements, top ? 1 : -1);
+        tuiMoveFocus(top ? -1 : elements.length, elements, top ? 1 : -1);
         this.handleFocusLossIfNecessary(target);
     }
     get elements() {
-        return Array.from(this.elementRef.nativeElement.querySelectorAll('[tuiOption]'));
+        return Array.from(this.elementRef.nativeElement.querySelectorAll(`[tuiOption]`));
     }
-};
-TuiDataListComponent.ctorParameters = () => [
-    { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
-    { type: Observable, decorators: [{ type: Inject, args: [TUI_NOTHING_FOUND_MESSAGE,] }] }
-];
-__decorate([
-    ContentChildren(forwardRef(() => TuiOptionComponent), { descendants: true })
-], TuiDataListComponent.prototype, "options", void 0);
+}
+TuiDataListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListComponent, deps: [{ token: ElementRef }, { token: TUI_NOTHING_FOUND_MESSAGE }], target: i0.ɵɵFactoryTarget.Component });
+TuiDataListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDataListComponent, selector: "tui-data-list", inputs: { role: "role", emptyContent: "emptyContent" }, host: { listeners: { "focusin": "onFocusIn($event.relatedTarget,$event.currentTarget)", "mousedown.prevent": "noop()", "keydown.arrowDown.prevent": "onKeyDownArrow($event.target,1)", "keydown.arrowUp.prevent": "onKeyDownArrow($event.target,-1)", "wheel.silent.passive": "handleFocusLossIfNecessary()", "mouseleave": "handleFocusLossIfNecessary($event.target)" }, properties: { "attr.role": "this.role" } }, providers: [
+        {
+            provide: TUI_DATA_LIST_ACCESSOR,
+            useExisting: forwardRef(() => TuiDataListComponent),
+        },
+    ], queries: [{ propertyName: "options", predicate: i0.forwardRef(function () { return TuiOptionComponent; }), descendants: true }], ngImport: i0, template: "<div\n    tabindex=\"0\"\n    class=\"t-trap\"\n    (focusin)=\"onFocus($event, true)\"\n></div>\n<ng-content></ng-content>\n<div\n    *ngIf=\"empty$ | async\"\n    class=\"t-empty\"\n>\n    <ng-container *polymorpheusOutlet=\"emptyContent || (defaultEmptyContent$ | async) as text\">\n        {{ text }}\n    </ng-container>\n</div>\n<div\n    tabindex=\"0\"\n    class=\"t-trap\"\n    (focusin)=\"onFocus($event, false)\"\n></div>\n", styles: ["tui-data-list{display:flex;font:var(--tui-font-text-m);flex-direction:column;padding:.5rem 0;color:var(--tui-text-03)}tui-data-list:focus-within .t-trap{display:none}tui-data-list:focus-within [tuiOption]._with-dropdown:not(:focus){background-color:transparent}tui-data-list>.t-empty{margin:.75rem 1rem}tui-opt-group{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:flex;font:var(--tui-font-text-xs);flex-direction:column;line-height:2rem}tui-opt-group:empty:before,tui-opt-group:empty:after{display:none}tui-opt-group:before{content:attr(data-label);padding:0 1rem;color:var(--tui-text-02)}tui-opt-group:not(:empty)~tui-opt-group:before{padding-top:1rem}tui-opt-group:not(:empty)~tui-opt-group:after{content:\"\";position:absolute;left:0;right:0;top:.5rem;height:1px;background:var(--tui-base-03)}\n"], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], pipes: { "async": i1$1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 __decorate([
-    Input(),
-    HostBinding('attr.role'),
     tuiDefaultProp()
 ], TuiDataListComponent.prototype, "role", void 0);
 __decorate([
-    Input(),
     tuiDefaultProp()
 ], TuiDataListComponent.prototype, "emptyContent", void 0);
 __decorate([
     tuiPure
 ], TuiDataListComponent.prototype, "empty$", null);
-__decorate([
-    HostListener('focusin', ['$event.relatedTarget', '$event.currentTarget'])
-], TuiDataListComponent.prototype, "onFocusIn", null);
-__decorate([
-    HostListener('mousedown.prevent')
-], TuiDataListComponent.prototype, "noop", null);
-__decorate([
-    HostListener('keydown.arrowDown.prevent', ['$event.target', '1']),
-    HostListener('keydown.arrowUp.prevent', ['$event.target', '-1'])
-], TuiDataListComponent.prototype, "onKeyDownArrow", null);
-__decorate([
-    HostListener('wheel.silent.passive'),
-    HostListener('mouseleave', ['$event.target'])
-], TuiDataListComponent.prototype, "handleFocusLossIfNecessary", null);
-TuiDataListComponent = TuiDataListComponent_1 = __decorate([
-    Component({
-        selector: 'tui-data-list',
-        template: "<div\n    tabindex=\"0\"\n    class=\"t-trap\"\n    (focusin)=\"onFocus($event, true)\"\n></div>\n<ng-content></ng-content>\n<div\n    *ngIf=\"empty$ | async\"\n    polymorpheus-outlet\n    class=\"t-empty\"\n    [content]=\"emptyContent || (defaultEmptyContent$ | async)\"\n></div>\n<div\n    tabindex=\"0\"\n    class=\"t-trap\"\n    (focusin)=\"onFocus($event, false)\"\n></div>\n",
-        changeDetection: ChangeDetectionStrategy.OnPush,
-        encapsulation: ViewEncapsulation.None,
-        providers: [
-            {
-                provide: TUI_DATA_LIST_ACCESSOR,
-                useExisting: forwardRef(() => TuiDataListComponent_1),
-            },
-        ],
-        styles: ["tui-data-list{display:flex;font:var(--tui-font-text-m);flex-direction:column;padding:.5rem 0;color:var(--tui-text-03)}tui-data-list:focus-within .t-trap{display:none}tui-data-list:focus-within [tuiOption]._with-dropdown:not(:focus){background-color:transparent}tui-data-list>.t-empty{margin:.75rem 1rem}tui-opt-group{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;display:flex;font:var(--tui-font-text-xs);flex-direction:column;line-height:2rem}tui-opt-group:empty:after,tui-opt-group:empty:before{display:none}tui-opt-group:before{content:attr(data-label);padding:0 1rem;color:var(--tui-text-02)}tui-opt-group:not(:empty)~tui-opt-group:before{padding-top:1rem}tui-opt-group:not(:empty)~tui-opt-group:after{content:'';position:absolute;left:0;right:0;top:.5rem;height:1px;background:var(--tui-base-03)}"]
-    }),
-    __param(0, Inject(ElementRef)),
-    __param(1, Inject(TUI_NOTHING_FOUND_MESSAGE))
-], TuiDataListComponent);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: `tui-data-list`,
+                    templateUrl: `./data-list.template.html`,
+                    styleUrls: [`./data-list.style.less`],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [
+                        {
+                            provide: TUI_DATA_LIST_ACCESSOR,
+                            useExisting: forwardRef(() => TuiDataListComponent),
+                        },
+                    ],
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef, decorators: [{
+                    type: Inject,
+                    args: [ElementRef]
+                }] }, { type: i3.Observable, decorators: [{
+                    type: Inject,
+                    args: [TUI_NOTHING_FOUND_MESSAGE]
+                }] }]; }, propDecorators: { options: [{
+                type: ContentChildren,
+                args: [forwardRef(() => TuiOptionComponent), { descendants: true }]
+            }], role: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: [`attr.role`]
+            }], emptyContent: [{
+                type: Input
+            }], empty$: [], onFocusIn: [{
+                type: HostListener,
+                args: [`focusin`, [`$event.relatedTarget`, `$event.currentTarget`]]
+            }], noop: [{
+                type: HostListener,
+                args: [`mousedown.prevent`]
+            }], onKeyDownArrow: [{
+                type: HostListener,
+                args: [`keydown.arrowDown.prevent`, [`$event.target`, `1`]]
+            }, {
+                type: HostListener,
+                args: [`keydown.arrowUp.prevent`, [`$event.target`, `-1`]]
+            }], handleFocusLossIfNecessary: [{
+                type: HostListener,
+                args: [`wheel.silent.passive`]
+            }, {
+                type: HostListener,
+                args: [`mouseleave`, [`$event.target`]]
+            }] } });
 
-let TuiDataListDirective = class TuiDataListDirective {
-};
-TuiDataListDirective = __decorate([
-    Directive({
-        selector: 'ng-template[tuiDataList]',
-    })
-], TuiDataListDirective);
+class TuiDataListDirective {
+}
+TuiDataListDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+TuiDataListDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiDataListDirective, selector: "ng-template[tuiDataList]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `ng-template[tuiDataList]`,
+                }]
+        }] });
 
 // TODO: 3.0 Move into separate module
-let TuiDataListDropdownManagerDirective = class TuiDataListDropdownManagerDirective {
+class TuiDataListDropdownManagerDirective {
     constructor() {
         this.dropdowns = EMPTY_QUERY;
         this.elements = EMPTY_QUERY;
@@ -229,8 +273,8 @@ let TuiDataListDropdownManagerDirective = class TuiDataListDropdownManagerDirect
                 return EMPTY;
             }
             const { nativeElement } = dropdown.dropdownBoxRef.location;
-            const mouseEnter$ = typedFromEvent(nativeElement, 'mouseenter').pipe(take(1));
-            const esc$ = merge(typedFromEvent(element.nativeElement, 'keydown'), typedFromEvent(nativeElement, 'keydown')).pipe(filter(({ keyCode }) => keyCode === 27));
+            const mouseEnter$ = typedFromEvent(nativeElement, `mouseenter`).pipe(take(1));
+            const esc$ = merge(typedFromEvent(element.nativeElement, `keydown`), typedFromEvent(nativeElement, `keydown`)).pipe(filter(({ keyCode }) => keyCode === 27));
             return merge(mouseEnter$, esc$).pipe(tap(event => {
                 if (dropdown.dropdownBoxRef) {
                     event.stopPropagation();
@@ -246,13 +290,13 @@ let TuiDataListDropdownManagerDirective = class TuiDataListDropdownManagerDirect
         return itemsQueryListObservable(this.elements).pipe(map(array => array.map(({ nativeElement }) => nativeElement)), shareReplay({ bufferSize: 1, refCount: true }));
     }
     get right$() {
-        return this.elements$.pipe(switchMap(elements => merge(...elements.map((element, index) => typedFromEvent(element, 'keydown').pipe(filter(({ keyCode }) => keyCode === 39), preventDefault(), mapTo(index))))));
+        return this.elements$.pipe(switchMap(elements => merge(...elements.map((element, index) => typedFromEvent(element, `keydown`).pipe(filter(({ keyCode }) => keyCode === 39), preventDefault(), mapTo(index))))));
     }
     get immediate$() {
-        return this.elements$.pipe(switchMap(elements => merge(...elements.map((element, index) => typedFromEvent(element, 'click').pipe(mapTo(index))))));
+        return this.elements$.pipe(switchMap(elements => merge(...elements.map((element, index) => typedFromEvent(element, `click`).pipe(mapTo(index))))));
     }
     get debounce$() {
-        return this.elements$.pipe(switchMap(elements => merge(...elements.map((element, index) => merge(typedFromEvent(element, 'focus'), typedFromEvent(element, 'blur')).pipe(filter(({ relatedTarget }) => this.notInDropdown(relatedTarget, index)), map(({ type }) => (type === 'focus' ? index : NaN)))))), debounceTime(300));
+        return this.elements$.pipe(switchMap(elements => merge(...elements.map((element, index) => merge(typedFromEvent(element, `focus`), typedFromEvent(element, `blur`)).pipe(filter(({ relatedTarget }) => this.notInDropdown(relatedTarget, index)), map(({ type }) => (type === `focus` ? index : NaN)))))), debounceTime(300));
     }
     notInDropdown(element, index) {
         const dropdown = this.dropdowns.toArray()[index];
@@ -267,18 +311,14 @@ let TuiDataListDropdownManagerDirective = class TuiDataListDropdownManagerDirect
         if (!content) {
             return;
         }
-        const item = getClosestKeyboardFocusable(content.nativeElement, false, content.nativeElement);
+        const item = tuiGetClosestFocusable(content.nativeElement, false, content.nativeElement);
         if (item) {
             setNativeFocused(item);
         }
     }
-};
-__decorate([
-    ContentChildren(TuiDropdownDirective, { descendants: true })
-], TuiDataListDropdownManagerDirective.prototype, "dropdowns", void 0);
-__decorate([
-    ContentChildren(TuiDropdownDirective, { read: ElementRef, descendants: true })
-], TuiDataListDropdownManagerDirective.prototype, "elements", void 0);
+}
+TuiDataListDropdownManagerDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListDropdownManagerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+TuiDataListDropdownManagerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiDataListDropdownManagerDirective, selector: "tui-data-list[tuiDataListDropdownManager]", queries: [{ propertyName: "dropdowns", predicate: TuiDropdownDirective, descendants: true }, { propertyName: "elements", predicate: TuiDropdownDirective, descendants: true, read: ElementRef }], ngImport: i0 });
 __decorate([
     tuiPure
 ], TuiDataListDropdownManagerDirective.prototype, "elements$", null);
@@ -291,52 +331,77 @@ __decorate([
 __decorate([
     tuiPure
 ], TuiDataListDropdownManagerDirective.prototype, "debounce$", null);
-TuiDataListDropdownManagerDirective = __decorate([
-    Directive({
-        selector: 'tui-data-list[tuiDataListDropdownManager]',
-    })
-], TuiDataListDropdownManagerDirective);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListDropdownManagerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `tui-data-list[tuiDataListDropdownManager]`,
+                }]
+        }], propDecorators: { dropdowns: [{
+                type: ContentChildren,
+                args: [TuiDropdownDirective, { descendants: true }]
+            }], elements: [{
+                type: ContentChildren,
+                args: [TuiDropdownDirective, { read: ElementRef, descendants: true }]
+            }], elements$: [], right$: [], immediate$: [], debounce$: [] } });
 
-let TuiOptGroupDirective = class TuiOptGroupDirective {
+class TuiOptGroupDirective {
     constructor() {
-        this.label = '';
+        this.label = ``;
     }
-};
+}
+TuiOptGroupDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiOptGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+TuiOptGroupDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiOptGroupDirective, selector: "tui-opt-group", inputs: { label: "label" }, host: { attributes: { "role": "group" }, properties: { "attr.data-label": "this.label" } }, ngImport: i0 });
 __decorate([
-    Input(),
-    HostBinding('attr.data-label'),
     tuiDefaultProp()
 ], TuiOptGroupDirective.prototype, "label", void 0);
-TuiOptGroupDirective = __decorate([
-    Directive({
-        selector: 'tui-opt-group',
-        host: {
-            role: 'group',
-        },
-    })
-], TuiOptGroupDirective);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiOptGroupDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: `tui-opt-group`,
+                    host: {
+                        role: `group`,
+                    },
+                }]
+        }], propDecorators: { label: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: [`attr.data-label`]
+            }] } });
 
-let TuiDataListModule = class TuiDataListModule {
-};
-TuiDataListModule = __decorate([
-    NgModule({
-        imports: [CommonModule, TuiSvgModule, PolymorpheusModule],
-        declarations: [
-            TuiDataListComponent,
-            TuiOptionComponent,
-            TuiOptGroupDirective,
-            TuiDataListDirective,
-            TuiDataListDropdownManagerDirective,
-        ],
-        exports: [
-            TuiDataListComponent,
-            TuiOptionComponent,
-            TuiOptGroupDirective,
-            TuiDataListDirective,
-            TuiDataListDropdownManagerDirective,
-        ],
-    })
-], TuiDataListModule);
+class TuiDataListModule {
+}
+TuiDataListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TuiDataListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListModule, declarations: [TuiDataListComponent,
+        TuiOptionComponent,
+        TuiOptGroupDirective,
+        TuiDataListDirective,
+        TuiDataListDropdownManagerDirective], imports: [CommonModule, TuiSvgModule, PolymorpheusModule], exports: [TuiDataListComponent,
+        TuiOptionComponent,
+        TuiOptGroupDirective,
+        TuiDataListDirective,
+        TuiDataListDropdownManagerDirective] });
+TuiDataListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListModule, imports: [[CommonModule, TuiSvgModule, PolymorpheusModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: TuiDataListModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, TuiSvgModule, PolymorpheusModule],
+                    declarations: [
+                        TuiDataListComponent,
+                        TuiOptionComponent,
+                        TuiOptGroupDirective,
+                        TuiDataListDirective,
+                        TuiDataListDropdownManagerDirective,
+                    ],
+                    exports: [
+                        TuiDataListComponent,
+                        TuiOptionComponent,
+                        TuiOptGroupDirective,
+                        TuiDataListDirective,
+                        TuiDataListDropdownManagerDirective,
+                    ],
+                }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.