@taiga-ui/kit 3.22.0 → 3.23.0

package/fesm2015/taiga-ui-kit-components-line-clamp.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-kit-components-line-clamp.js","sources":["../../../projects/kit/components/line-clamp/line-clamp-box.component.ts","../../../projects/kit/components/line-clamp/line-clamp-options.ts","../../../projects/kit/components/line-clamp/line-clamp-position.directive.ts","../../../projects/kit/components/line-clamp/line-clamp.component.ts","../../../projects/kit/components/line-clamp/line-clamp.template.html","../../../projects/kit/components/line-clamp/line-clamp.module.ts","../../../projects/kit/components/line-clamp/taiga-ui-kit-components-line-clamp.ts"],"sourcesContent":["import {ChangeDetectionStrategy, Component, HostBinding} from '@angular/core';\nimport {TuiDestroyService, TuiHoveredService} from '@taiga-ui/cdk';\nimport {\n    tuiFadeIn,\n    TuiHintComponent,\n    TuiHintDirective,\n    tuiPositionAccessorFor,\n    TuiPositionService,\n    tuiRectAccessorFor,\n} from '@taiga-ui/core';\n\n@Component({\n    selector: 'tui-line-clamp-box',\n    template: `\n        <ng-container *polymorpheusOutlet=\"content as text\">{{ text }}</ng-container>\n    `,\n    styleUrls: ['./line-clamp-box.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    providers: [\n        TuiDestroyService,\n        TuiPositionService,\n        TuiHoveredService,\n        tuiPositionAccessorFor('hint'),\n        tuiRectAccessorFor('hint', TuiHintDirective),\n    ],\n    animations: [tuiFadeIn],\n})\nexport class TuiLineClampBoxComponent extends TuiHintComponent {\n    @HostBinding('style.minWidth.px')\n    get width(): number {\n        return this.accessor.getClientRect().width;\n    }\n}\n","import {InjectionToken, ValueProvider} from '@angular/core';\n\nexport interface TuiLineClampOptions {\n    readonly showHint: boolean;\n}\n\nexport const TUI_LINE_CLAMP_DEFAULT_OPTIONS: TuiLineClampOptions = {\n    showHint: true,\n};\n\n/**\n * Default parameters for LineClamp component\n */\nexport const TUI_LINE_CLAMP_OPTIONS = new InjectionToken<TuiLineClampOptions>(\n    `[TUI_LINE_CLAMP_OPTIONS]`,\n    {\n        factory: () => TUI_LINE_CLAMP_DEFAULT_OPTIONS,\n    },\n);\n\nexport const tuiLineClampOptionsProvider: (\n    options: Partial<TuiLineClampOptions>,\n) => ValueProvider = (options: Partial<TuiLineClampOptions>) => ({\n    provide: TUI_LINE_CLAMP_OPTIONS,\n    useValue: {...TUI_LINE_CLAMP_DEFAULT_OPTIONS, ...options},\n});\n","import {Directive, Inject} from '@angular/core';\nimport {\n    tuiAsPositionAccessor,\n    TuiHintDirective,\n    TuiPoint,\n    TuiPositionAccessor,\n    TuiRectAccessor,\n} from '@taiga-ui/core';\n\n@Directive({\n    selector: '[tuiHintCustomPosition]',\n    providers: [tuiAsPositionAccessor(TuiLineClampPositionDirective)],\n})\nexport class TuiLineClampPositionDirective extends TuiPositionAccessor {\n    readonly type = 'hint';\n\n    constructor(@Inject(TuiHintDirective) private readonly accessor: TuiRectAccessor) {\n        super();\n    }\n\n    getPosition(): TuiPoint {\n        const {top, left} = this.accessor.getClientRect();\n\n        return [top, left];\n    }\n}\n","import {\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    DoCheck,\n    ElementRef,\n    HostBinding,\n    HostListener,\n    Inject,\n    Input,\n    NgZone,\n    Output,\n    Renderer2,\n    ViewChild,\n} from '@angular/core';\nimport {\n    tuiDefaultProp,\n    tuiIsCurrentTarget,\n    tuiTypedFromEvent,\n    tuiZonefree,\n} from '@taiga-ui/cdk';\nimport {TUI_HINT_COMPONENT, TuiHintDirective} from '@taiga-ui/core';\nimport {PolymorpheusContent} from '@tinkoff/ng-polymorpheus';\nimport {BehaviorSubject, Observable, of, Subject, timer} from 'rxjs';\nimport {\n    distinctUntilChanged,\n    filter,\n    map,\n    pairwise,\n    startWith,\n    switchMap,\n} from 'rxjs/operators';\n\nimport {TuiLineClampBoxComponent} from './line-clamp-box.component';\nimport {TUI_LINE_CLAMP_OPTIONS, TuiLineClampOptions} from './line-clamp-options';\n\n@Component({\n    selector: 'tui-line-clamp',\n    templateUrl: './line-clamp.template.html',\n    styleUrls: ['./line-clamp.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    providers: [\n        {\n            provide: TUI_HINT_COMPONENT,\n            useValue: TuiLineClampBoxComponent,\n        },\n    ],\n})\nexport class TuiLineClampComponent implements DoCheck, AfterViewInit {\n    @ViewChild(TuiHintDirective, {read: ElementRef})\n    private readonly outlet?: ElementRef<HTMLElement>;\n\n    private readonly linesLimit$ = new BehaviorSubject(1);\n    private readonly isOverflown$ = new Subject<boolean>();\n    private initialized = false;\n\n    @HostBinding('style.maxHeight.px')\n    maxHeight: number | null = null;\n\n    @HostBinding('style.height.px')\n    height = 0;\n\n    @Input()\n    @tuiDefaultProp()\n    set linesLimit(linesLimit: number) {\n        this.linesLimit$.next(linesLimit);\n    }\n\n    @Input()\n    @tuiDefaultProp()\n    lineHeight = 24;\n\n    @Input()\n    @tuiDefaultProp()\n    content: PolymorpheusContent = '';\n\n    @Output()\n    readonly overflownChange: Observable<boolean> = this.isOverflown$.pipe(\n        distinctUntilChanged(),\n    );\n\n    lineClamp$ = this.linesLimit$.pipe(\n        startWith(1),\n        pairwise(),\n        switchMap(([prev, next]) =>\n            next >= prev\n                ? of(next)\n                : tuiTypedFromEvent(this.elementRef.nativeElement, 'transitionend').pipe(\n                      filter(tuiIsCurrentTarget),\n                      map(() => next),\n                  ),\n        ),\n    );\n\n    constructor(\n        @Inject(ElementRef) private readonly elementRef: ElementRef<HTMLElement>,\n        @Inject(Renderer2) private readonly renderer: Renderer2,\n        @Inject(ChangeDetectorRef) private readonly cd: ChangeDetectorRef,\n        @Inject(NgZone) private readonly ngZone: NgZone,\n        @Inject(TUI_LINE_CLAMP_OPTIONS) private readonly options: TuiLineClampOptions,\n    ) {\n        this.skipInitialTransition();\n    }\n\n    get overflown(): boolean {\n        if (!this.outlet) {\n            return false;\n        }\n\n        const {scrollHeight, scrollWidth} = this.outlet.nativeElement;\n        const {clientHeight, clientWidth} = this.elementRef.nativeElement;\n\n        // 4px buffer for IE/Edge incorrectly rounding scrollHeight\n        return scrollHeight - clientHeight > 4 || scrollWidth - clientWidth > 0;\n    }\n\n    get computedContent(): PolymorpheusContent {\n        return this.options.showHint && this.overflown ? this.content : '';\n    }\n\n    @HostListener('transitionend')\n    updateView(): void {\n        this.cd.detectChanges();\n    }\n\n    ngAfterViewInit(): void {\n        this.initialized = true;\n    }\n\n    ngDoCheck(): void {\n        this.updateStaticallyHostBinding();\n        this.isOverflown$.next(this.overflown);\n    }\n\n    private skipInitialTransition(): void {\n        timer(0)\n            .pipe(tuiZonefree(this.ngZone))\n            .subscribe(() => {\n                this.renderer.addClass(this.elementRef.nativeElement, '_initialized');\n                this.cd.detectChanges();\n            });\n    }\n\n    private updateStaticallyHostBinding(): void {\n        if (this.outlet) {\n            this.height = this.outlet.nativeElement.scrollHeight + 4;\n        }\n\n        if (this.initialized) {\n            this.maxHeight = this.lineHeight * this.linesLimit$.value;\n        }\n    }\n}\n","<div\n    *tuiLet=\"lineClamp$ | async as lineClamp\"\n    tuiHintCustomPosition\n    class=\"t-wrapper\"\n    [tuiHint]=\"computedContent\"\n    [style.-webkit-line-clamp]=\"lineClamp\"\n    [style.word-break]=\"(lineClamp || 0) > 1 ? 'break-word' : 'break-all'\"\n    (tuiResize)=\"updateView()\"\n>\n    <ng-container *polymorpheusOutlet=\"content as text\">\n        {{ text }}\n    </ng-container>\n</div>\n","import {CommonModule} from '@angular/common';\nimport {NgModule} from '@angular/core';\nimport {TuiLetModule, TuiResizeModule} from '@taiga-ui/cdk';\nimport {TuiHintModule} from '@taiga-ui/core';\nimport {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';\n\nimport {TuiLineClampComponent} from './line-clamp.component';\nimport {TuiLineClampBoxComponent} from './line-clamp-box.component';\nimport {TuiLineClampPositionDirective} from './line-clamp-position.directive';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        PolymorpheusModule,\n        TuiHintModule,\n        TuiResizeModule,\n        TuiLetModule,\n    ],\n    declarations: [\n        TuiLineClampComponent,\n        TuiLineClampBoxComponent,\n        TuiLineClampPositionDirective,\n    ],\n    exports: [TuiLineClampComponent],\n})\nexport class TuiLineClampModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1","i2.TuiLineClampPositionDirective","i4"],"mappings":"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"}
+{"version":3,"file":"taiga-ui-kit-components-line-clamp.js","sources":["../../../projects/kit/components/line-clamp/line-clamp-box.component.ts","../../../projects/kit/components/line-clamp/line-clamp-options.ts","../../../projects/kit/components/line-clamp/line-clamp-position.directive.ts","../../../projects/kit/components/line-clamp/line-clamp.component.ts","../../../projects/kit/components/line-clamp/line-clamp.template.html","../../../projects/kit/components/line-clamp/line-clamp.module.ts","../../../projects/kit/components/line-clamp/taiga-ui-kit-components-line-clamp.ts"],"sourcesContent":["import {ChangeDetectionStrategy, Component, HostBinding} from '@angular/core';\nimport {TuiDestroyService, TuiHoveredService} from '@taiga-ui/cdk';\nimport {\n    tuiFadeIn,\n    TuiHintComponent,\n    TuiHintDirective,\n    tuiPositionAccessorFor,\n    TuiPositionService,\n    tuiRectAccessorFor,\n} from '@taiga-ui/core';\n\n@Component({\n    selector: 'tui-line-clamp-box',\n    template: `\n        <ng-container *polymorpheusOutlet=\"content as text\">{{ text }}</ng-container>\n    `,\n    styleUrls: ['./line-clamp-box.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    providers: [\n        TuiDestroyService,\n        TuiPositionService,\n        TuiHoveredService,\n        tuiPositionAccessorFor('hint'),\n        tuiRectAccessorFor('hint', TuiHintDirective),\n    ],\n    animations: [tuiFadeIn],\n})\nexport class TuiLineClampBoxComponent extends TuiHintComponent {\n    @HostBinding('style.minWidth.px')\n    get width(): number {\n        return this.accessor.getClientRect().width;\n    }\n}\n","import {InjectionToken, ValueProvider} from '@angular/core';\n\nexport interface TuiLineClampOptions {\n    readonly showHint: boolean;\n}\n\nexport const TUI_LINE_CLAMP_DEFAULT_OPTIONS: TuiLineClampOptions = {\n    showHint: true,\n};\n\n/**\n * Default parameters for LineClamp component\n */\nexport const TUI_LINE_CLAMP_OPTIONS = new InjectionToken<TuiLineClampOptions>(\n    `[TUI_LINE_CLAMP_OPTIONS]`,\n    {\n        factory: () => TUI_LINE_CLAMP_DEFAULT_OPTIONS,\n    },\n);\n\nexport const tuiLineClampOptionsProvider: (\n    options: Partial<TuiLineClampOptions>,\n) => ValueProvider = (options: Partial<TuiLineClampOptions>) => ({\n    provide: TUI_LINE_CLAMP_OPTIONS,\n    useValue: {...TUI_LINE_CLAMP_DEFAULT_OPTIONS, ...options},\n});\n","import {Directive, Inject} from '@angular/core';\nimport {\n    tuiAsPositionAccessor,\n    TuiHintDirective,\n    TuiPoint,\n    TuiPositionAccessor,\n    TuiRectAccessor,\n} from '@taiga-ui/core';\n\n@Directive({\n    selector: '[tuiHintCustomPosition]',\n    providers: [tuiAsPositionAccessor(TuiLineClampPositionDirective)],\n})\nexport class TuiLineClampPositionDirective extends TuiPositionAccessor {\n    readonly type = 'hint';\n\n    constructor(@Inject(TuiHintDirective) private readonly accessor: TuiRectAccessor) {\n        super();\n    }\n\n    getPosition(): TuiPoint {\n        const {top, left} = this.accessor.getClientRect();\n\n        return [top, left];\n    }\n}\n","import {\n    AfterViewInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    DoCheck,\n    ElementRef,\n    HostBinding,\n    HostListener,\n    Inject,\n    Input,\n    NgZone,\n    Output,\n    Renderer2,\n    ViewChild,\n} from '@angular/core';\nimport {\n    tuiDefaultProp,\n    tuiIsCurrentTarget,\n    tuiTypedFromEvent,\n    tuiZonefree,\n} from '@taiga-ui/cdk';\nimport {TUI_HINT_COMPONENT, TuiHintDirective} from '@taiga-ui/core';\nimport {PolymorpheusContent} from '@tinkoff/ng-polymorpheus';\nimport {BehaviorSubject, Observable, of, Subject, timer} from 'rxjs';\nimport {\n    distinctUntilChanged,\n    filter,\n    map,\n    pairwise,\n    startWith,\n    switchMap,\n} from 'rxjs/operators';\n\nimport {TuiLineClampBoxComponent} from './line-clamp-box.component';\nimport {TUI_LINE_CLAMP_OPTIONS, TuiLineClampOptions} from './line-clamp-options';\n\n@Component({\n    selector: 'tui-line-clamp',\n    templateUrl: './line-clamp.template.html',\n    styleUrls: ['./line-clamp.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    providers: [\n        {\n            provide: TUI_HINT_COMPONENT,\n            useValue: TuiLineClampBoxComponent,\n        },\n    ],\n})\nexport class TuiLineClampComponent implements DoCheck, AfterViewInit {\n    @ViewChild(TuiHintDirective, {read: ElementRef})\n    private readonly outlet?: ElementRef<HTMLElement>;\n\n    private readonly linesLimit$ = new BehaviorSubject(1);\n    private readonly isOverflown$ = new Subject<boolean>();\n    private initialized = false;\n\n    @HostBinding('style.maxHeight.px')\n    maxHeight: number | null = null;\n\n    @HostBinding('style.height.px')\n    height = 0;\n\n    @Input()\n    @tuiDefaultProp()\n    set linesLimit(linesLimit: number) {\n        this.linesLimit$.next(linesLimit);\n    }\n\n    @Input()\n    @tuiDefaultProp()\n    lineHeight = 24;\n\n    @Input()\n    @tuiDefaultProp()\n    content: PolymorpheusContent = '';\n\n    @Output()\n    readonly overflownChange: Observable<boolean> = this.isOverflown$.pipe(\n        distinctUntilChanged(),\n    );\n\n    lineClamp$ = this.linesLimit$.pipe(\n        startWith(1),\n        pairwise(),\n        switchMap(([prev, next]) =>\n            next >= prev\n                ? of(next)\n                : tuiTypedFromEvent(this.elementRef.nativeElement, 'transitionend').pipe(\n                      filter(tuiIsCurrentTarget),\n                      map(() => next),\n                  ),\n        ),\n    );\n\n    constructor(\n        @Inject(ElementRef) private readonly elementRef: ElementRef<HTMLElement>,\n        @Inject(Renderer2) private readonly renderer: Renderer2,\n        @Inject(ChangeDetectorRef) private readonly cd: ChangeDetectorRef,\n        @Inject(NgZone) private readonly ngZone: NgZone,\n        @Inject(TUI_LINE_CLAMP_OPTIONS) private readonly options: TuiLineClampOptions,\n    ) {\n        this.skipInitialTransition();\n    }\n\n    get overflown(): boolean {\n        if (!this.outlet) {\n            return false;\n        }\n\n        const {scrollHeight, scrollWidth} = this.outlet.nativeElement;\n        const {clientHeight, clientWidth} = this.elementRef.nativeElement;\n\n        // 4px buffer for IE/Edge incorrectly rounding scrollHeight\n        return scrollHeight - clientHeight > 4 || scrollWidth - clientWidth > 0;\n    }\n\n    get computedContent(): PolymorpheusContent {\n        return this.options.showHint && this.overflown ? this.content : '';\n    }\n\n    @HostListener('transitionend')\n    updateView(): void {\n        this.cd.detectChanges();\n    }\n\n    ngAfterViewInit(): void {\n        this.initialized = true;\n    }\n\n    ngDoCheck(): void {\n        this.updateStaticallyHostBinding();\n        this.isOverflown$.next(this.overflown);\n    }\n\n    private skipInitialTransition(): void {\n        timer(0)\n            .pipe(tuiZonefree(this.ngZone))\n            .subscribe(() => {\n                this.renderer.addClass(this.elementRef.nativeElement, '_initialized');\n                this.cd.detectChanges();\n            });\n    }\n\n    private updateStaticallyHostBinding(): void {\n        if (this.outlet) {\n            this.height = this.outlet.nativeElement.scrollHeight + 4;\n        }\n\n        if (this.initialized) {\n            this.maxHeight = this.lineHeight * this.linesLimit$.value;\n        }\n    }\n}\n","<div\n    *tuiLet=\"lineClamp$ | async as lineClamp\"\n    tuiHintCustomPosition\n    class=\"t-wrapper\"\n    [tuiHint]=\"computedContent\"\n    [style.-webkit-line-clamp]=\"lineClamp\"\n    [style.word-break]=\"(lineClamp || 0) > 1 ? 'break-word' : 'break-all'\"\n    (tuiResize)=\"updateView()\"\n>\n    <ng-container *polymorpheusOutlet=\"content as text\">\n        {{ text }}\n    </ng-container>\n</div>\n","import {CommonModule} from '@angular/common';\nimport {NgModule} from '@angular/core';\nimport {TuiLetModule, TuiResizeModule} from '@taiga-ui/cdk';\nimport {TuiHintModule} from '@taiga-ui/core';\nimport {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';\n\nimport {TuiLineClampComponent} from './line-clamp.component';\nimport {TuiLineClampBoxComponent} from './line-clamp-box.component';\nimport {TuiLineClampPositionDirective} from './line-clamp-position.directive';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        PolymorpheusModule,\n        TuiHintModule,\n        TuiResizeModule,\n        TuiLetModule,\n    ],\n    declarations: [\n        TuiLineClampComponent,\n        TuiLineClampBoxComponent,\n        TuiLineClampPositionDirective,\n    ],\n    exports: [TuiLineClampComponent],\n})\nexport class TuiLineClampModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1","i2.TuiLineClampPositionDirective","i4"],"mappings":";;;;;;;;;;;;;;AA2BM,MAAO,wBAAyB,SAAQ,gBAAgB,CAAA;AAC1D,IAAA,IACI,KAAK,GAAA;QACL,OAAO,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,CAAC,KAAK,CAAC;KAC9C;;sHAJQ,wBAAwB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAxB,wBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,wBAAwB,EATtB,QAAA,EAAA,oBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mBAAA,EAAA,YAAA,EAAA,EAAA,EAAA,SAAA,EAAA;QACP,iBAAiB;QACjB,kBAAkB;QAClB,iBAAiB;QACjB,sBAAsB,CAAC,MAAM,CAAC;AAC9B,QAAA,kBAAkB,CAAC,MAAM,EAAE,gBAAgB,CAAC;KAC/C,EAXS,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;KAET,EAUW,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,0ZAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,2BAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,2BAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAC,SAAS,CAAC,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;4FAEd,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAhBpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,QAAQ,EAAE,CAAA;;AAET,IAAA,CAAA;oBACD,SAAS,EAAE,CAAC,6BAA6B,CAAC;oBAC1C,eAAe,EAAE,uBAAuB,CAAC,MAAM;AAC/C,oBAAA,SAAS,EAAE;wBACP,iBAAiB;wBACjB,kBAAkB;wBAClB,iBAAiB;wBACjB,sBAAsB,CAAC,MAAM,CAAC;AAC9B,wBAAA,kBAAkB,CAAC,MAAM,EAAE,gBAAgB,CAAC;AAC/C,qBAAA;oBACD,UAAU,EAAE,CAAC,SAAS,CAAC;AAC1B,iBAAA,CAAA;8BAGO,KAAK,EAAA,CAAA;sBADR,WAAW;uBAAC,mBAAmB,CAAA;;;ACtBvB,MAAA,8BAA8B,GAAwB;AAC/D,IAAA,QAAQ,EAAE,IAAI;EAChB;AAEF;;AAEG;MACU,sBAAsB,GAAG,IAAI,cAAc,CACpD,0BAA0B,EAC1B;AACI,IAAA,OAAO,EAAE,MAAM,8BAA8B;AAChD,CAAA,EACH;MAEW,2BAA2B,GAEnB,CAAC,OAAqC,MAAM;AAC7D,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,QAAQ,EAAM,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,8BAA8B,CAAK,EAAA,OAAO,CAAC;AAC5D,CAAA;;ACZK,MAAO,6BAA8B,SAAQ,mBAAmB,CAAA;AAGlE,IAAA,WAAA,CAAuD,QAAyB,EAAA;AAC5E,QAAA,KAAK,EAAE,CAAC;QAD2C,IAAQ,CAAA,QAAA,GAAR,QAAQ,CAAiB;QAFvE,IAAI,CAAA,IAAA,GAAG,MAAM,CAAC;KAItB;IAED,WAAW,GAAA;AACP,QAAA,MAAM,EAAC,GAAG,EAAE,IAAI,EAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,CAAC;AAElD,QAAA,OAAO,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;KACtB;;AAXQ,6BAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,6BAA6B,kBAGlB,gBAAgB,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAH3B,6BAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,6BAA6B,kDAF3B,CAAC,qBAAqB,CAAC,6BAA6B,CAAC,CAAC,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;4FAExD,6BAA6B,EAAA,UAAA,EAAA,CAAA;kBAJzC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,yBAAyB;AACnC,oBAAA,SAAS,EAAE,CAAC,qBAAqB,CAAA,6BAAA,CAA+B,CAAC;AACpE,iBAAA,CAAA;;0BAIgB,MAAM;2BAAC,gBAAgB,CAAA;;;MCiC3B,qBAAqB,CAAA;IA8C9B,WACyC,CAAA,UAAmC,EACpC,QAAmB,EACX,EAAqB,EAChC,MAAc,EACE,OAA4B,EAAA;QAJxC,IAAU,CAAA,UAAA,GAAV,UAAU,CAAyB;QACpC,IAAQ,CAAA,QAAA,GAAR,QAAQ,CAAW;QACX,IAAE,CAAA,EAAA,GAAF,EAAE,CAAmB;QAChC,IAAM,CAAA,MAAA,GAAN,MAAM,CAAQ;QACE,IAAO,CAAA,OAAA,GAAP,OAAO,CAAqB;AA/ChE,QAAA,IAAA,CAAA,WAAW,GAAG,IAAI,eAAe,CAAC,CAAC,CAAC,CAAC;AACrC,QAAA,IAAA,CAAA,YAAY,GAAG,IAAI,OAAO,EAAW,CAAC;QAC/C,IAAW,CAAA,WAAA,GAAG,KAAK,CAAC;QAG5B,IAAS,CAAA,SAAA,GAAkB,IAAI,CAAC;QAGhC,IAAM,CAAA,MAAA,GAAG,CAAC,CAAC;QAUX,IAAU,CAAA,UAAA,GAAG,EAAE,CAAC;QAIhB,IAAO,CAAA,OAAA,GAAwB,EAAE,CAAC;QAGzB,IAAe,CAAA,eAAA,GAAwB,IAAI,CAAC,YAAY,CAAC,IAAI,CAClE,oBAAoB,EAAE,CACzB,CAAC;AAEF,QAAA,IAAA,CAAA,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAC9B,SAAS,CAAC,CAAC,CAAC,EACZ,QAAQ,EAAE,EACV,SAAS,CAAC,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,KACnB,IAAI,IAAI,IAAI;AACR,cAAE,EAAE,CAAC,IAAI,CAAC;AACV,cAAE,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC,IAAI,CAClE,MAAM,CAAC,kBAAkB,CAAC,EAC1B,GAAG,CAAC,MAAM,IAAI,CAAC,CAClB,CACV,CACJ,CAAC;QASE,IAAI,CAAC,qBAAqB,EAAE,CAAC;KAChC;IAtCD,IAAI,UAAU,CAAC,UAAkB,EAAA;AAC7B,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;KACrC;AAsCD,IAAA,IAAI,SAAS,GAAA;AACT,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;AACd,YAAA,OAAO,KAAK,CAAC;AAChB,SAAA;QAED,MAAM,EAAC,YAAY,EAAE,WAAW,EAAC,GAAG,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;QAC9D,MAAM,EAAC,YAAY,EAAE,WAAW,EAAC,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC;;QAGlE,OAAO,YAAY,GAAG,YAAY,GAAG,CAAC,IAAI,WAAW,GAAG,WAAW,GAAG,CAAC,CAAC;KAC3E;AAED,IAAA,IAAI,eAAe,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,OAAO,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;KACtE;IAGD,UAAU,GAAA;AACN,QAAA,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,CAAC;KAC3B;IAED,eAAe,GAAA;AACX,QAAA,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;KAC3B;IAED,SAAS,GAAA;QACL,IAAI,CAAC,2BAA2B,EAAE,CAAC;QACnC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;KAC1C;IAEO,qBAAqB,GAAA;QACzB,KAAK,CAAC,CAAC,CAAC;AACH,aAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;aAC9B,SAAS,CAAC,MAAK;AACZ,YAAA,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC;AACtE,YAAA,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,CAAC;AAC5B,SAAC,CAAC,CAAC;KACV;IAEO,2BAA2B,GAAA;QAC/B,IAAI,IAAI,CAAC,MAAM,EAAE;AACb,YAAA,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,YAAY,GAAG,CAAC,CAAC;AAC5D,SAAA;QAED,IAAI,IAAI,CAAC,WAAW,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AAC7D,SAAA;KACJ;;mHAvGQ,qBAAqB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EA+ClB,UAAU,EACV,EAAA,EAAA,KAAA,EAAA,SAAS,aACT,iBAAiB,EAAA,EAAA,EAAA,KAAA,EACjB,MAAM,EAAA,EAAA,EAAA,KAAA,EACN,sBAAsB,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAnDzB,qBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qBAAqB,EAPnB,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,UAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,eAAA,EAAA,cAAA,EAAA,EAAA,UAAA,EAAA,EAAA,oBAAA,EAAA,gBAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,EAAA,EAAA,SAAA,EAAA;AACP,QAAA;AACI,YAAA,OAAO,EAAE,kBAAkB;AAC3B,YAAA,QAAQ,EAAE,wBAAwB;AACrC,SAAA;AACJ,KAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAGU,gBAAgB,EAAA,WAAA,EAAA,IAAA,EAAA,IAAA,EAAS,UAAU,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EClDlD,8ZAaA,EAAA,MAAA,EAAA,CAAA,6UAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAAA,IAAA,CAAA,eAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAAC,6BAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,sBAAA,EAAA,QAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,CAAA,qBAAA,EAAA,QAAA,EAAA,6BAAA,EAAA,MAAA,EAAA,CAAA,kBAAA,EAAA,kBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAAD,IAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,aAAA,EAAA,OAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAAE,EAAA,CAAA,2BAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,2BAAA,CAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,OAAA,EAAA,EAAA,CAAA,SAAA,EAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;ADoDI,UAAA,CAAA;AADC,IAAA,cAAc,EAAE;AAGhB,CAAA,EAAA,qBAAA,CAAA,SAAA,EAAA,YAAA,EAAA,IAAA,CAAA,CAAA;AAID,UAAA,CAAA;AADC,IAAA,cAAc,EAAE;AACD,CAAA,EAAA,qBAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIhB,UAAA,CAAA;AADC,IAAA,cAAc,EAAE;AACiB,CAAA,EAAA,qBAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;4FA1BzB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAZjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,WAAW,EAAE,4BAA4B;oBACzC,SAAS,EAAE,CAAC,yBAAyB,CAAC;oBACtC,eAAe,EAAE,uBAAuB,CAAC,MAAM;AAC/C,oBAAA,SAAS,EAAE;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,kBAAkB;AAC3B,4BAAA,QAAQ,EAAE,wBAAwB;AACrC,yBAAA;AACJ,qBAAA;AACJ,iBAAA,CAAA;;0BAgDQ,MAAM;2BAAC,UAAU,CAAA;;0BACjB,MAAM;2BAAC,SAAS,CAAA;;0BAChB,MAAM;2BAAC,iBAAiB,CAAA;;0BACxB,MAAM;2BAAC,MAAM,CAAA;;0BACb,MAAM;2BAAC,sBAAsB,CAAA;4CAjDjB,MAAM,EAAA,CAAA;sBADtB,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,gBAAgB,EAAE,EAAC,IAAI,EAAE,UAAU,EAAC,CAAA;gBAQ/C,SAAS,EAAA,CAAA;sBADR,WAAW;uBAAC,oBAAoB,CAAA;gBAIjC,MAAM,EAAA,CAAA;sBADL,WAAW;uBAAC,iBAAiB,CAAA;gBAK1B,UAAU,EAAA,CAAA;sBAFb,KAAK;gBAQN,UAAU,EAAA,CAAA;sBAFT,KAAK;gBAMN,OAAO,EAAA,CAAA;sBAFN,KAAK;gBAKG,eAAe,EAAA,CAAA;sBADvB,MAAM;gBA6CP,UAAU,EAAA,CAAA;sBADT,YAAY;uBAAC,eAAe,CAAA;;;MEhGpB,kBAAkB,CAAA;;gHAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAlB,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,iBANvB,qBAAqB;QACrB,wBAAwB;AACxB,QAAA,6BAA6B,aAT7B,YAAY;QACZ,kBAAkB;QAClB,aAAa;QACb,eAAe;AACf,QAAA,YAAY,aAON,qBAAqB,CAAA,EAAA,CAAA,CAAA;AAEtB,kBAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,EAdlB,OAAA,EAAA,CAAA;YACL,YAAY;YACZ,kBAAkB;YAClB,aAAa;YACb,eAAe;YACf,YAAY;AACf,SAAA,CAAA,EAAA,CAAA,CAAA;4FAQQ,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAf9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE;wBACL,YAAY;wBACZ,kBAAkB;wBAClB,aAAa;wBACb,eAAe;wBACf,YAAY;AACf,qBAAA;AACD,oBAAA,YAAY,EAAE;wBACV,qBAAqB;wBACrB,wBAAwB;wBACxB,6BAA6B;AAChC,qBAAA;oBACD,OAAO,EAAE,CAAC,qBAAqB,CAAC;AACnC,iBAAA,CAAA;;;ACxBD;;AAEG;;;;"}

package/fesm2015/taiga-ui-kit-components-multi-select.js

@@ -1,19 +1,20 @@
 import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
-import { InjectionToken, Directive, ElementRef, ChangeDetectorRef, TemplateRef, Inject, ViewChild, HostBinding, EventEmitter, Component, ChangeDetectionStrategy, Optional, Self, ContentChild, Input, Output, Pipe, ContentChildren, forwardRef, NgModule } from '@angular/core';
+import { InjectionToken, Directive, EventEmitter, ChangeDetectorRef, TemplateRef, Component, ChangeDetectionStrategy, Optional, Self, Inject, ContentChild, ViewChild, Input, HostBinding, Output, Pipe, ContentChildren, forwardRef, NgModule } from '@angular/core';
 import * as i3 from '@taiga-ui/cdk';
-import { AbstractTuiControl, TuiIdService, AbstractTuiMultipleControl, EMPTY_ARRAY, tuiIsString, tuiArrayToggle, tuiIsNativeFocused, TUI_IS_MOBILE, tuiAsFocusableItemAccessor, tuiAsControl, tuiDefaultProp, tuiPure, EMPTY_QUERY, tuiQueryListChanges, tuiGetOriginalArrayFromQueryList, TUI_DEFAULT_IDENTITY_MATCHER, tuiIsPresent, tuiControlValue, EMPTY_FUNCTION, TuiPreventDefaultModule, TuiActiveZoneModule, TuiLetModule, TuiMapperPipeModule } from '@taiga-ui/cdk';
+import { AbstractTuiMultipleControl, ALWAYS_TRUE_HANDLER, EMPTY_ARRAY, tuiIsString, tuiArrayToggle, tuiIsNativeFocused, TUI_IS_MOBILE, tuiAsFocusableItemAccessor, tuiAsControl, tuiDefaultProp, tuiPure, EMPTY_QUERY, tuiQueryListChanges, tuiGetOriginalArrayFromQueryList, TUI_DEFAULT_IDENTITY_MATCHER, tuiIsPresent, tuiControlValue, EMPTY_FUNCTION, TuiPreventDefaultModule, TuiActiveZoneModule, TuiLetModule, TuiMapperPipeModule } from '@taiga-ui/cdk';
 import { tuiIsFlat } from '@taiga-ui/kit/utils';
 import * as i4 from '@angular/forms';
 import { NgControl, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
 import * as i1 from '@taiga-ui/core';
-import { AbstractTuiTextfieldHost, tuiAsTextfieldHost, TUI_TEXTFIELD_HOST, TuiDataListDirective, TUI_TEXTFIELD_WATCHED_CONTROLLER, tuiAsDataListHost, TEXTFIELD_CONTROLLER_PROVIDER, TUI_DATA_LIST_ACCESSOR, TuiHostedDropdownComponent, TUI_DATA_LIST_HOST, TuiOptionComponent, tuiAsOptionContent, tuiAsDataList, TuiWrapperModule, TuiSvgModule, TuiHostedDropdownModule, TuiLinkModule, TuiDataListModule, TuiTextfieldControllerModule } from '@taiga-ui/core';
+import { TUI_TEXTFIELD_WATCHED_CONTROLLER, tuiAsDataListHost, TEXTFIELD_CONTROLLER_PROVIDER, TUI_DATA_LIST_ACCESSOR, TuiDataListDirective, TuiHostedDropdownComponent, AbstractTuiTextfieldHost, tuiAsTextfieldHost, TUI_DATA_LIST_HOST, TuiOptionComponent, tuiAsOptionContent, tuiAsDataList, TuiWrapperModule, TuiSvgModule, TuiHostedDropdownModule, TuiLinkModule, TuiDataListModule, TuiTextfieldControllerModule } from '@taiga-ui/core';
 import { TuiStringifiableItem } from '@taiga-ui/kit/classes';
 import { TUI_ARROW_MODE, TuiArrowModule } from '@taiga-ui/kit/components/arrow';
 import * as i2 from '@taiga-ui/kit/components/input-tag';
 import { TuiInputTagComponent, TuiInputTagModule } from '@taiga-ui/kit/components/input-tag';
 import { FIXED_DROPDOWN_CONTROLLER_PROVIDER } from '@taiga-ui/kit/providers';
 import { TUI_ITEMS_HANDLERS, TUI_MULTI_SELECT_TEXTS } from '@taiga-ui/kit/tokens';
+import { AbstractTuiNativeSelect } from '@taiga-ui/kit/abstract';
 import * as i2$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i6 from '@tinkoff/ng-polymorpheus';
@@ -39,75 +40,21 @@ const tuiMultiSelectOptionsProvider = (options) => ({
     useValue: Object.assign(Object.assign({}, TUI_MULTI_SELECT_DEFAULT_OPTIONS), options),
 });
 
-class TuiMultiSelectDirective extends AbstractTuiTextfieldHost {
+class AbstractTuiNativeMultiSelect extends AbstractTuiNativeSelect {
     constructor() {
         super(...arguments);
-        this.disableItemHandler = item => this.host.disabledItemHandler(item);
-    }
-    get readOnly() {
-        return true;
-    }
-    onValueChange(_) {
-        //
-    }
-    onSelectionChange(value) {
-        this.host.onValueChange(value);
-    }
-}
-TuiMultiSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiMultiSelectDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-TuiMultiSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: TuiMultiSelectDirective, selector: "tui-multi-select", providers: [tuiAsTextfieldHost(TuiMultiSelectDirective)], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiMultiSelectDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'tui-multi-select',
-                    providers: [tuiAsTextfieldHost(TuiMultiSelectDirective)],
-                }]
-        }] });
-
-class AbstractTuiNativeMultiSelect {
-    constructor(host, control, elementRef, idService, cdr) {
-        this.host = host;
-        this.control = control;
-        this.elementRef = elementRef;
-        this.idService = idService;
-        this.cdr = cdr;
-        this.datalist = null;
         this.selectedMapper = (option, value) => value.includes(option);
     }
-    get id() {
-        return this.elementRef.nativeElement.id || this.idService.generate();
-    }
     onValueChange() {
         const { selectedOptions } = this.elementRef.nativeElement;
         this.host.onSelectionChange(Array.from(selectedOptions).map(option => option.value));
     }
 }
-AbstractTuiNativeMultiSelect.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: AbstractTuiNativeMultiSelect, deps: [{ token: TUI_TEXTFIELD_HOST }, { token: AbstractTuiControl }, { token: ElementRef }, { token: TuiIdService }, { token: ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
-AbstractTuiNativeMultiSelect.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: AbstractTuiNativeMultiSelect, host: { properties: { "id": "this.id" } }, viewQueries: [{ propertyName: "datalist", first: true, predicate: TuiDataListDirective, descendants: true, read: TemplateRef, static: true }], ngImport: i0 });
+AbstractTuiNativeMultiSelect.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: AbstractTuiNativeMultiSelect, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+AbstractTuiNativeMultiSelect.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: AbstractTuiNativeMultiSelect, usesInheritance: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: AbstractTuiNativeMultiSelect, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: TuiMultiSelectDirective, decorators: [{
-                    type: Inject,
-                    args: [TUI_TEXTFIELD_HOST]
-                }] }, { type: i3.AbstractTuiControl, decorators: [{
-                    type: Inject,
-                    args: [AbstractTuiControl]
-                }] }, { type: i0.ElementRef, decorators: [{
-                    type: Inject,
-                    args: [ElementRef]
-                }] }, { type: i3.TuiIdService, decorators: [{
-                    type: Inject,
-                    args: [TuiIdService]
-                }] }, { type: i0.ChangeDetectorRef, decorators: [{
-                    type: Inject,
-                    args: [ChangeDetectorRef]
-                }] }]; }, propDecorators: { datalist: [{
-                type: ViewChild,
-                args: [TuiDataListDirective, { read: TemplateRef, static: true }]
-            }], id: [{
-                type: HostBinding,
-                args: [`id`]
-            }] } });
+        }] });
 
 class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
     constructor(control, changeDetectorRef, arrowMode, itemsHandlers, options, controller, isMobile) {
@@ -125,6 +72,7 @@ class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
         this.editable = true;
         this.disabledItemHandler = this.itemsHandlers.disabledItemHandler;
         this.valueContent = this.options.valueContent;
+        this.tagValidator = ALWAYS_TRUE_HANDLER;
         this.rows = Infinity;
         this.searchChange = new EventEmitter();
         this.datalist = '';
@@ -138,7 +86,7 @@ class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
         return this.controller.size;
     }
     get arrow() {
-        return !this.interactive ? this.arrowMode.disabled : this.arrowMode.interactive;
+        return this.interactive ? this.arrowMode.interactive : this.arrowMode.disabled;
     }
     get nativeFocusableElement() {
         var _a, _b;
@@ -180,7 +128,8 @@ class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
     handleOption(option) {
         const { value, identityMatcher } = this;
         const index = value.findIndex(item => identityMatcher(item, option));
-        this.updateValue(index === -1 ? [...value, option] : value.filter((_, i) => i !== index));
+        this.value =
+            index === -1 ? [...value, option] : value.filter((_, i) => i !== index);
         this.updateSearch(null);
     }
     onEnter(event) {
@@ -190,7 +139,7 @@ class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
             return;
         }
         event.preventDefault();
-        this.updateValue(tuiArrayToggle(value, options[0]));
+        this.value = tuiArrayToggle(value, options[0]);
         this.updateSearch(null);
     }
     onClick({ nativeFocusableElement }) {
@@ -202,10 +151,10 @@ class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
         }
     }
     onInput(value) {
-        this.updateValue(value.map(({ item }) => item));
+        this.value = value.map(({ item }) => item);
     }
     onValueChange(value) {
-        this.updateValue(value);
+        this.value = value;
     }
     onSearch(search) {
         this.updateSearch(search);
@@ -226,12 +175,12 @@ class TuiMultiSelectComponent extends AbstractTuiMultipleControl {
     }
 }
 TuiMultiSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiMultiSelectComponent, deps: [{ token: NgControl, optional: true, self: true }, { token: ChangeDetectorRef }, { token: TUI_ARROW_MODE }, { token: TUI_ITEMS_HANDLERS }, { token: TUI_MULTI_SELECT_OPTIONS }, { token: TUI_TEXTFIELD_WATCHED_CONTROLLER }, { token: TUI_IS_MOBILE }], target: i0.ɵɵFactoryTarget.Component });
-TuiMultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiMultiSelectComponent, selector: "tui-multi-select", inputs: { stringify: "stringify", identityMatcher: "identityMatcher", expandable: "expandable", search: "search", placeholder: "placeholder", editable: "editable", disabledItemHandler: "disabledItemHandler", valueContent: "valueContent", rows: "rows" }, outputs: { searchChange: "searchChange" }, host: { properties: { "class._editable": "this.editable", "attr.data-size": "this.size" } }, providers: [
+TuiMultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiMultiSelectComponent, selector: "tui-multi-select", inputs: { stringify: "stringify", identityMatcher: "identityMatcher", expandable: "expandable", search: "search", placeholder: "placeholder", editable: "editable", disabledItemHandler: "disabledItemHandler", valueContent: "valueContent", tagValidator: "tagValidator", rows: "rows" }, outputs: { searchChange: "searchChange" }, host: { properties: { "class._editable": "this.editable", "attr.data-size": "this.size" } }, providers: [
         tuiAsFocusableItemAccessor(TuiMultiSelectComponent),
         tuiAsControl(TuiMultiSelectComponent),
         tuiAsDataListHost(TuiMultiSelectComponent),
         TEXTFIELD_CONTROLLER_PROVIDER,
-    ], queries: [{ propertyName: "accessor", first: true, predicate: TUI_DATA_LIST_ACCESSOR, descendants: true }, { propertyName: "nativeSelect", first: true, predicate: AbstractTuiNativeMultiSelect, descendants: true, static: true }, { propertyName: "datalist", first: true, predicate: TuiDataListDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "hostedDropdown", first: true, predicate: TuiHostedDropdownComponent, descendants: true }, { propertyName: "input", first: true, predicate: TuiInputTagComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<tui-hosted-dropdown\n    class=\"t-hosted\"\n    [canOpen]=\"interactive && !nativeDropdownMode\"\n    [content]=\"datalist || ''\"\n    [(open)]=\"open\"\n    (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n    <tui-input-tag\n        #inputTag\n        automation-id=\"tui-multi-select__input\"\n        class=\"t-input\"\n        [nativeId]=\"nativeId\"\n        [tuiTextfieldIcon]=\"icon\"\n        [disabled]=\"disabled\"\n        [disabledItemHandler]=\"disabledItemHandler | tuiMapper : disabledItemHandlerWrapper\"\n        [readOnly]=\"readOnly\"\n        [inputHidden]=\"!editable\"\n        [pseudoHover]=\"pseudoHover\"\n        [placeholder]=\"placeholder\"\n        [pseudoFocus]=\"computedFocused\"\n        [pseudoInvalid]=\"computedInvalid\"\n        [editable]=\"false\"\n        [expandable]=\"expandable\"\n        [removable]=\"!nativeDropdownMode\"\n        [search]=\"searchOrSpace\"\n        [rows]=\"rows\"\n        [ngModel]=\"computedValue | tuiMapper : valueMapper : stringify\"\n        (ngModelChange)=\"onInput($event)\"\n        (searchChange)=\"onSearch($event)\"\n        (keydown.space)=\"onSpace($event)\"\n        (keydown.enter)=\"onEnter($event)\"\n        (click.prevent)=\"onClick(inputTag)\"\n    >\n        <ng-content></ng-content>\n        <ng-template #select>\n            <ng-content\n                *ngIf=\"isMobile\"\n                select=\"select\"\n            ></ng-content>\n        </ng-template>\n\n        <ng-container\n            *ngTemplateOutlet=\"select\"\n            ngProjectAs=\"select\"\n        ></ng-container>\n    </tui-input-tag>\n\n    <div\n        class=\"t-wrapper\"\n        [class.t-wrapper_disabled]=\"disabled\"\n    >\n        <div\n            *ngIf=\"computedGroup\"\n            class=\"t-group\"\n            [class.t-group_fullsize]=\"inputTag.labelOutside\"\n        >\n            <ng-container *polymorpheusOutlet=\"valueContent as text; context: {$implicit: value}\">\n                {{ text }}\n            </ng-container>\n        </div>\n\n        <ng-template #icon>\n            <div\n                *ngIf=\"arrow\"\n                tuiWrapper\n                appearance=\"icon\"\n                automation-id=\"tui-multi-select__arrow\"\n                tuiPreventDefault=\"mousedown\"\n                class=\"t-arrow\"\n                [class.t-arrow_native-dropdown]=\"nativeDropdownMode\"\n            >\n                <ng-container *polymorpheusOutlet=\"arrow as text\">\n                    {{ text }}\n                </ng-container>\n            </div>\n        </ng-template>\n    </div>\n</tui-hosted-dropdown>\n", styles: [":host{position:relative;display:block;border-radius:var(--tui-radius-m)}:host._disabled{pointer-events:none}.t-hosted{display:block;border-radius:inherit}.t-input{border-radius:inherit}:host:not(._editable):not(._readonly) .t-input{cursor:pointer}.t-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;pointer-events:none;justify-content:flex-end}.t-wrapper_disabled{opacity:var(--tui-disabled-opacity)}:host[data-size=s] .t-wrapper{height:var(--tui-height-s)}:host[data-size=m] .t-wrapper{height:var(--tui-height-m)}:host[data-size=l] .t-wrapper{height:var(--tui-height-l)}.t-group{display:flex;flex:1;align-items:center;padding:1.6875rem 0 .5625rem 1rem;overflow:hidden}.t-group_fullsize{padding-top:.0625rem;padding-bottom:0}:host[data-size=m] .t-group_fullsize.t-group_fullsize{padding-top:0}:host[data-size=m] .t-group{padding:1.1875rem 0 0 .75rem;font-size:.8125rem}.t-arrow{pointer-events:auto;cursor:pointer}.t-arrow_native-dropdown{pointer-events:none}\n"], components: [{ type: i1.TuiHostedDropdownComponent, selector: "tui-hosted-dropdown", inputs: ["content", "sided", "canOpen", "open"], outputs: ["openChange", "focusedChange"] }, { type: i2.TuiInputTagComponent, selector: "tui-input-tag", inputs: ["separator", "search", "editable", "tagValidator", "expandable", "rows", "inputHidden", "uniqueTags", "maxLength", "placeholder", "removable", "disabledItemHandler", "pseudoFocused"], outputs: ["searchChange"] }], directives: [{ type: i3.TuiActiveZoneDirective, selector: "[tuiActiveZone]:not(ng-container), [tuiActiveZoneChange]:not(ng-container), [tuiActiveZoneParent]:not(ng-container)", inputs: ["tuiActiveZoneParent"], outputs: ["tuiActiveZoneChange"], exportAs: ["tuiActiveZone"] }, { type: i1.TuiTextfieldIconDirective, selector: "[tuiTextfieldIcon]", inputs: ["tuiTextfieldIcon"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i1.TuiWrapperDirective, selector: "[tuiWrapper]", inputs: ["disabled", "readOnly", "hover", "active", "focus", "invalid", "appearance"] }, { type: i3.TuiPreventDefaultDirective, selector: "[tuiPreventDefault]", inputs: ["tuiPreventDefault"] }], pipes: { "tuiMapper": i3.TuiMapperPipe }, viewProviders: [FIXED_DROPDOWN_CONTROLLER_PROVIDER], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], queries: [{ propertyName: "accessor", first: true, predicate: TUI_DATA_LIST_ACCESSOR, descendants: true }, { propertyName: "nativeSelect", first: true, predicate: AbstractTuiNativeMultiSelect, descendants: true, static: true }, { propertyName: "datalist", first: true, predicate: TuiDataListDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "hostedDropdown", first: true, predicate: TuiHostedDropdownComponent, descendants: true }, { propertyName: "input", first: true, predicate: TuiInputTagComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<tui-hosted-dropdown\n    class=\"t-hosted\"\n    [canOpen]=\"interactive && !nativeDropdownMode\"\n    [content]=\"datalist || ''\"\n    [(open)]=\"open\"\n    (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n    <tui-input-tag\n        #inputTag\n        automation-id=\"tui-multi-select__input\"\n        class=\"t-input\"\n        [nativeId]=\"nativeId\"\n        [tuiTextfieldIcon]=\"arrow ? icon : ''\"\n        [disabled]=\"disabled\"\n        [disabledItemHandler]=\"disabledItemHandler | tuiMapper : disabledItemHandlerWrapper\"\n        [readOnly]=\"readOnly\"\n        [inputHidden]=\"!editable\"\n        [pseudoHover]=\"pseudoHover\"\n        [placeholder]=\"placeholder\"\n        [pseudoFocus]=\"computedFocused\"\n        [pseudoInvalid]=\"computedInvalid\"\n        [editable]=\"false\"\n        [expandable]=\"expandable\"\n        [removable]=\"!nativeDropdownMode\"\n        [search]=\"searchOrSpace\"\n        [tagValidator]=\"tagValidator | tuiMapper : disabledItemHandlerWrapper\"\n        [rows]=\"rows\"\n        [ngModel]=\"computedValue | tuiMapper : valueMapper : stringify\"\n        (ngModelChange)=\"onInput($event)\"\n        (searchChange)=\"onSearch($event)\"\n        (keydown.space)=\"onSpace($event)\"\n        (keydown.enter)=\"onEnter($event)\"\n        (click.prevent)=\"onClick(inputTag)\"\n    >\n        <ng-content></ng-content>\n        <ng-template #select>\n            <ng-content\n                *ngIf=\"isMobile\"\n                select=\"select\"\n            ></ng-content>\n        </ng-template>\n\n        <ng-container\n            *ngTemplateOutlet=\"select\"\n            ngProjectAs=\"select\"\n        ></ng-container>\n    </tui-input-tag>\n\n    <div\n        class=\"t-wrapper\"\n        [class.t-wrapper_disabled]=\"disabled\"\n    >\n        <div\n            *ngIf=\"computedGroup\"\n            class=\"t-group\"\n            [class.t-group_fullsize]=\"inputTag.labelOutside\"\n        >\n            <ng-container *polymorpheusOutlet=\"valueContent as text; context: {$implicit: value}\">\n                {{ text }}\n            </ng-container>\n        </div>\n\n        <ng-template #icon>\n            <div\n                tuiWrapper\n                appearance=\"icon\"\n                automation-id=\"tui-multi-select__arrow\"\n                tuiPreventDefault=\"mousedown\"\n                class=\"t-arrow\"\n                [class.t-arrow_native-dropdown]=\"nativeDropdownMode\"\n            >\n                <ng-container *polymorpheusOutlet=\"arrow as text\">\n                    {{ text }}\n                </ng-container>\n            </div>\n        </ng-template>\n    </div>\n</tui-hosted-dropdown>\n", styles: [":host{position:relative;display:block;border-radius:var(--tui-radius-m)}:host._disabled{pointer-events:none}.t-hosted{display:block;border-radius:inherit}.t-input{border-radius:inherit}:host:not(._editable):not(._readonly) .t-input{cursor:pointer}.t-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;pointer-events:none;justify-content:flex-end}.t-wrapper_disabled{opacity:var(--tui-disabled-opacity)}:host[data-size=s] .t-wrapper{height:var(--tui-height-s)}:host[data-size=m] .t-wrapper{height:var(--tui-height-m)}:host[data-size=l] .t-wrapper{height:var(--tui-height-l)}.t-group{display:flex;flex:1;align-items:center;padding:1.6875rem 0 .5625rem 1rem;overflow:hidden}.t-group_fullsize{padding-top:.0625rem;padding-bottom:0}:host[data-size=m] .t-group_fullsize.t-group_fullsize{padding-top:0}:host[data-size=m] .t-group{padding:1.1875rem 0 0 .75rem;font-size:.8125rem}.t-arrow{pointer-events:auto;cursor:pointer}.t-arrow_native-dropdown{pointer-events:none}\n"], components: [{ type: i1.TuiHostedDropdownComponent, selector: "tui-hosted-dropdown", inputs: ["content", "sided", "canOpen", "open"], outputs: ["openChange", "focusedChange"] }, { type: i2.TuiInputTagComponent, selector: "tui-input-tag", inputs: ["separator", "search", "editable", "tagValidator", "expandable", "rows", "inputHidden", "uniqueTags", "maxLength", "placeholder", "removable", "disabledItemHandler", "pseudoFocused"], outputs: ["searchChange"] }], directives: [{ type: i3.TuiActiveZoneDirective, selector: "[tuiActiveZone]:not(ng-container), [tuiActiveZoneChange]:not(ng-container), [tuiActiveZoneParent]:not(ng-container)", inputs: ["tuiActiveZoneParent"], outputs: ["tuiActiveZoneChange"], exportAs: ["tuiActiveZone"] }, { type: i1.TuiTextfieldIconDirective, selector: "[tuiTextfieldIcon]", inputs: ["tuiTextfieldIcon"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i1.TuiWrapperDirective, selector: "[tuiWrapper]", inputs: ["disabled", "readOnly", "hover", "active", "focus", "invalid", "appearance"] }, { type: i3.TuiPreventDefaultDirective, selector: "[tuiPreventDefault]", inputs: ["tuiPreventDefault"] }], pipes: { "tuiMapper": i3.TuiMapperPipe }, viewProviders: [FIXED_DROPDOWN_CONTROLLER_PROVIDER], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
     tuiDefaultProp()
 ], TuiMultiSelectComponent.prototype, "stringify", void 0);
@@ -256,6 +205,9 @@ __decorate([
 __decorate([
     tuiDefaultProp()
 ], TuiMultiSelectComponent.prototype, "valueContent", void 0);
+__decorate([
+    tuiDefaultProp()
+], TuiMultiSelectComponent.prototype, "tagValidator", void 0);
 __decorate([
     tuiPure
 ], TuiMultiSelectComponent.prototype, "getStringifier", null);
@@ -330,6 +282,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }], valueContent: [{
                 type: Input
+            }], tagValidator: [{
+                type: Input
             }], rows: [{
                 type: Input
             }], searchChange: [{
@@ -381,6 +335,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     args: [TuiMultiSelectComponent]
                 }] }]; }, propDecorators: { filter2d: [], filter: [] } });
 
+class TuiMultiSelectDirective extends AbstractTuiTextfieldHost {
+    constructor() {
+        super(...arguments);
+        this.disableItemHandler = item => this.host.disabledItemHandler(item);
+    }
+    get readOnly() {
+        return true;
+    }
+    onValueChange() { }
+    onSelectionChange(value) {
+        this.host.onValueChange(value);
+    }
+}
+TuiMultiSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiMultiSelectDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+TuiMultiSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: TuiMultiSelectDirective, selector: "tui-multi-select", providers: [tuiAsTextfieldHost(TuiMultiSelectDirective)], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiMultiSelectDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'tui-multi-select',
+                    providers: [tuiAsTextfieldHost(TuiMultiSelectDirective)],
+                }]
+        }] });
+
 class TuiMultiSelectGroupComponent {
     constructor(multiSelectTexts$, host, control) {
         this.multiSelectTexts$ = multiSelectTexts$;
@@ -563,7 +540,7 @@ TuiNativeMultiSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
             provide: AbstractTuiNativeMultiSelect,
             useExisting: TuiNativeMultiSelectComponent,
         },
-    ], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control.control?.valueChanges | async\"></ng-container>\n\n<tui-data-list-wrapper\n    *tuiDataList\n    [items]=\"items\"\n    [disabledItemHandler]=\"host.disableItemHandler\"\n></tui-data-list-wrapper>\n<option\n    *ngFor=\"let option of items\"\n    [selected]=\"option | tuiMapper : selectedMapper : host.value\"\n    [value]=\"option\"\n    [disabled]=\"host.disableItemHandler(option)\"\n>\n    {{ option }}\n</option>\n", styles: [":host{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}\n"], components: [{ type: i1$1.TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels])", inputs: ["items"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "async": i2$1.AsyncPipe, "tuiMapper": i3.TuiMapperPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control.control?.valueChanges | async\"></ng-container>\n\n<tui-data-list-wrapper\n    *tuiDataList\n    tuiMultiSelectGroup\n    [items]=\"items\"\n    [disabledItemHandler]=\"disabledItemHandler || host.disableItemHandler\"\n></tui-data-list-wrapper>\n<option\n    *ngFor=\"let option of items\"\n    [selected]=\"option | tuiMapper : selectedMapper : host.value\"\n    [value]=\"option\"\n    [disabled]=\"disabledItemHandler ? disabledItemHandler(option) : host.disableItemHandler(option)\"\n>\n    {{ option }}\n</option>\n", styles: [":host{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}\n"], components: [{ type: i1$1.TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels])", inputs: ["items"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: TuiMultiSelectGroupDirective, selector: "[tuiMultiSelectGroup]" }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "async": i2$1.AsyncPipe, "tuiMapper": i3.TuiMapperPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiNativeMultiSelectComponent, decorators: [{
             type: Component,
             args: [{
@@ -615,7 +592,7 @@ TuiNativeMultiSelectGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersio
             provide: AbstractTuiNativeMultiSelect,
             useExisting: TuiNativeMultiSelectGroupComponent,
         },
-    ], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control.control?.valueChanges | async\"></ng-container>\n\n<tui-data-list-wrapper\n    *tuiDataList\n    [items]=\"items\"\n    [labels]=\"labels\"\n    [disabledItemHandler]=\"host.disableItemHandler\"\n></tui-data-list-wrapper>\n<optgroup\n    *ngFor=\"let group of items; let index = index\"\n    [label]=\"labels[index]\"\n>\n    <option\n        *ngFor=\"let option of group\"\n        [selected]=\"option | tuiMapper : selectedMapper : host.value\"\n        [value]=\"option\"\n        [disabled]=\"host.disableItemHandler(option)\"\n    >\n        {{ option }}\n    </option>\n</optgroup>\n", styles: [":host{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}\n"], components: [{ type: i1$1.TuiDataListGroupWrapperComponent, selector: "tui-data-list-wrapper[labels]", inputs: ["items", "labels"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "async": i2$1.AsyncPipe, "tuiMapper": i3.TuiMapperPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control.control?.valueChanges | async\"></ng-container>\n\n<tui-data-list-wrapper\n    *tuiDataList\n    tuiMultiSelectGroup\n    [items]=\"items\"\n    [labels]=\"labels\"\n    [disabledItemHandler]=\"disabledItemHandler || host.disableItemHandler\"\n></tui-data-list-wrapper>\n<optgroup\n    *ngFor=\"let group of items; let index = index\"\n    [label]=\"labels[index]\"\n>\n    <option\n        *ngFor=\"let option of group\"\n        [selected]=\"option | tuiMapper : selectedMapper : host.value\"\n        [value]=\"option\"\n        [disabled]=\"disabledItemHandler ? disabledItemHandler(option) : host.disableItemHandler(option)\"\n    >\n        {{ option }}\n    </option>\n</optgroup>\n", styles: [":host{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}\n"], components: [{ type: i1$1.TuiDataListGroupWrapperComponent, selector: "tui-data-list-wrapper[labels]", inputs: ["items", "labels"] }], directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: TuiMultiSelectGroupDirective, selector: "[tuiMultiSelectGroup]" }, { type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }], pipes: { "async": i2$1.AsyncPipe, "tuiMapper": i3.TuiMapperPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiNativeMultiSelectGroupComponent, decorators: [{
             type: Component,
             args: [{