@taiga-ui/cdk 2.44.0 → 2.47.0

package/fesm5/taiga-ui-cdk-directives-auto-focus.js

@@ -1,43 +1,17 @@
-import { __decorate, __param } from 'tslib';
-import { Optional, Self, Inject, NgZone, ElementRef, Renderer2, Input, Directive, NgModule } from '@angular/core';
+import { __decorate, __extends, __param } from 'tslib';
+import { ElementRef, Directive, Optional, Self, Inject, Renderer2, NgZone, InjectionToken, inject, Input, NgModule } from '@angular/core';
 import { ANIMATION_FRAME } from '@ng-web-apis/common';
+import { TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_APPLE } from '@taiga-ui/cdk/tokens';
 import { POLLING_TIME } from '@taiga-ui/cdk/constants';
-import { TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_IOS } from '@taiga-ui/cdk/tokens';
-import { setNativeFocused } from '@taiga-ui/cdk/utils/focus';
 import { race, timer, Observable } from 'rxjs';
 import { throttleTime, map, skipWhile, take } from 'rxjs/operators';
 
-var TIMEOUT = 1000;
-var NG_ANIMATION_SELECTOR = '.ng-animating';
-// TODO: in 3.0 change input name to tuiAutoFocus and handle empty string
-// TODO: refactor on this whole thing in 3.0
-var TuiAutoFocusDirective = /** @class */ (function () {
-    function TuiAutoFocusDirective(tuiFocusableComponent, isIos, animationFrame$, ngZone, elementRef, renderer) {
+var AbstractTuiAutofocusHandler = /** @class */ (function () {
+    function AbstractTuiAutofocusHandler(tuiFocusableComponent, elementRef) {
         this.tuiFocusableComponent = tuiFocusableComponent;
-        this.isIos = isIos;
-        this.animationFrame$ = animationFrame$;
-        this.ngZone = ngZone;
         this.elementRef = elementRef;
-        this.renderer = renderer;
-        this.autoFocus = true;
     }
-    TuiAutoFocusDirective.prototype.ngAfterViewInit = function () {
-        var _this = this;
-        if (!this.autoFocus) {
-            return;
-        }
-        if (this.isTextFieldElement) {
-            if (this.isIos) {
-                this.ngZone.runOutsideAngular(function () { return _this.iosWebkitAutofocus(); });
-            }
-            else {
-                race(timer(TIMEOUT), this.animationFrame$.pipe(throttleTime(POLLING_TIME), map(function () { return _this.element.closest(NG_ANIMATION_SELECTOR); }), skipWhile(Boolean), take(1))).subscribe(function () { return setNativeFocused(_this.element); });
-            }
-            return;
-        }
-        setNativeFocused(this.element);
-    };
-    Object.defineProperty(TuiAutoFocusDirective.prototype, "element", {
+    Object.defineProperty(AbstractTuiAutofocusHandler.prototype, "element", {
         get: function () {
             var _a;
             return (((_a = this.tuiFocusableComponent) === null || _a === void 0 ? void 0 : _a.nativeFocusableElement) ||
@@ -46,24 +20,85 @@ var TuiAutoFocusDirective = /** @class */ (function () {
         enumerable: true,
         configurable: true
     });
-    Object.defineProperty(TuiAutoFocusDirective.prototype, "isTextFieldElement", {
+    Object.defineProperty(AbstractTuiAutofocusHandler.prototype, "isTextFieldElement", {
         get: function () {
             return this.element.matches('input, textarea');
         },
         enumerable: true,
         configurable: true
     });
-    TuiAutoFocusDirective.prototype.iosWebkitAutofocus = function () {
+    AbstractTuiAutofocusHandler.ctorParameters = function () { return [
+        { type: undefined },
+        { type: ElementRef }
+    ]; };
+    AbstractTuiAutofocusHandler = __decorate([
+        Directive()
+    ], AbstractTuiAutofocusHandler);
+    return AbstractTuiAutofocusHandler;
+}());
+
+var TIMEOUT = 1000;
+var NG_ANIMATION_SELECTOR = '.ng-animating';
+var TuiDefaultAutofocusHandler = /** @class */ (function (_super) {
+    __extends(TuiDefaultAutofocusHandler, _super);
+    function TuiDefaultAutofocusHandler(tuiFocusableComponent, elementRef, animationFrame$) {
+        var _this = _super.call(this, tuiFocusableComponent, elementRef) || this;
+        _this.animationFrame$ = animationFrame$;
+        return _this;
+    }
+    TuiDefaultAutofocusHandler.prototype.setFocus = function () {
+        var _this = this;
+        if (this.isTextFieldElement) {
+            race(timer(TIMEOUT), this.animationFrame$.pipe(throttleTime(POLLING_TIME), map(function () { return _this.element.closest(NG_ANIMATION_SELECTOR); }), skipWhile(Boolean), take(1))).subscribe(function () { return _this.element.focus(); });
+        }
+        else {
+            this.element.focus();
+        }
+    };
+    TuiDefaultAutofocusHandler.ctorParameters = function () { return [
+        { type: undefined, decorators: [{ type: Optional }, { type: Self }, { type: Inject, args: [TUI_FOCUSABLE_ITEM_ACCESSOR,] }] },
+        { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
+        { type: Observable, decorators: [{ type: Inject, args: [ANIMATION_FRAME,] }] }
+    ]; };
+    TuiDefaultAutofocusHandler = __decorate([
+        Directive(),
+        __param(0, Optional()),
+        __param(0, Self()),
+        __param(0, Inject(TUI_FOCUSABLE_ITEM_ACCESSOR)),
+        __param(1, Inject(ElementRef)),
+        __param(2, Inject(ANIMATION_FRAME))
+    ], TuiDefaultAutofocusHandler);
+    return TuiDefaultAutofocusHandler;
+}(AbstractTuiAutofocusHandler));
+
+var TuiIosAutofocusHandler = /** @class */ (function (_super) {
+    __extends(TuiIosAutofocusHandler, _super);
+    function TuiIosAutofocusHandler(tuiFocusableComponent, elementRef, renderer, ngZone) {
+        var _this = _super.call(this, tuiFocusableComponent, elementRef) || this;
+        _this.renderer = renderer;
+        _this.ngZone = ngZone;
+        return _this;
+    }
+    TuiIosAutofocusHandler.prototype.setFocus = function () {
+        var _this = this;
+        if (this.isTextFieldElement) {
+            this.ngZone.runOutsideAngular(function () { return _this.iosWebkitAutofocus(); });
+        }
+        else {
+            this.element.focus();
+        }
+    };
+    TuiIosAutofocusHandler.prototype.iosWebkitAutofocus = function () {
         var _this = this;
         var _a;
         var fakeInput = this.renderer.createElement('input');
         fakeInput.style.position = 'absolute';
         fakeInput.style.opacity = '0';
         fakeInput.style.height = '0';
-        var blurHandler = function () { return setNativeFocused(fakeInput); };
+        var blurHandler = function () { return fakeInput.focus(); };
         var focusHandler = function () {
             setTimeout(function () {
-                setNativeFocused(_this.element);
+                _this.element.focus();
                 /**
                  * @note:
                  * We can't remove the element immediately, because it breaks flow
@@ -86,15 +121,61 @@ var TuiAutoFocusDirective = /** @class */ (function () {
         fakeInput.addEventListener('blur', blurHandler, { once: true });
         fakeInput.addEventListener('focus', focusHandler);
         (_a = this.element.parentElement) === null || _a === void 0 ? void 0 : _a.appendChild(fakeInput);
-        setNativeFocused(fakeInput);
+        fakeInput.focus();
     };
-    TuiAutoFocusDirective.ctorParameters = function () { return [
+    TuiIosAutofocusHandler.ctorParameters = function () { return [
         { type: undefined, decorators: [{ type: Optional }, { type: Self }, { type: Inject, args: [TUI_FOCUSABLE_ITEM_ACCESSOR,] }] },
-        { type: Boolean, decorators: [{ type: Inject, args: [TUI_IS_IOS,] }] },
-        { type: Observable, decorators: [{ type: Inject, args: [ANIMATION_FRAME,] }] },
-        { type: NgZone, decorators: [{ type: Inject, args: [NgZone,] }] },
         { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
-        { type: Renderer2, decorators: [{ type: Inject, args: [Renderer2,] }] }
+        { type: Renderer2, decorators: [{ type: Inject, args: [Renderer2,] }] },
+        { type: NgZone, decorators: [{ type: Inject, args: [NgZone,] }] }
+    ]; };
+    TuiIosAutofocusHandler = __decorate([
+        Directive(),
+        __param(0, Optional()),
+        __param(0, Self()),
+        __param(0, Inject(TUI_FOCUSABLE_ITEM_ACCESSOR)),
+        __param(1, Inject(ElementRef)),
+        __param(2, Inject(Renderer2)),
+        __param(3, Inject(NgZone))
+    ], TuiIosAutofocusHandler);
+    return TuiIosAutofocusHandler;
+}(AbstractTuiAutofocusHandler));
+
+var TUI_AUTOFOCUS_HANDLER = new InjectionToken('Autofocusing handler');
+// TODO: 3.0 remove in ivy compilation
+function tuiAutofocusHandlerFactory(tuiFocusableComponent, elementRef, animationFrame$, renderer, ngZone) {
+    return inject(TUI_IS_APPLE)
+        ? new TuiIosAutofocusHandler(tuiFocusableComponent, elementRef, renderer, ngZone)
+        : new TuiDefaultAutofocusHandler(tuiFocusableComponent, elementRef, animationFrame$);
+}
+var TUI_AUTOFOCUS_PROVIDERS = [
+    {
+        provide: TUI_AUTOFOCUS_HANDLER,
+        // TODO: replace to useClass in v3.0
+        useFactory: tuiAutofocusHandlerFactory,
+        deps: [
+            [new Optional(), new Self(), TUI_FOCUSABLE_ITEM_ACCESSOR],
+            ElementRef,
+            ANIMATION_FRAME,
+            Renderer2,
+            NgZone,
+        ],
+    },
+];
+
+// TODO: 3.0 change input name to tuiAutoFocus and handle empty string
+var TuiAutoFocusDirective = /** @class */ (function () {
+    function TuiAutoFocusDirective(handler) {
+        this.handler = handler;
+        this.autoFocus = true;
+    }
+    TuiAutoFocusDirective.prototype.ngAfterViewInit = function () {
+        if (this.autoFocus) {
+            this.handler.setFocus();
+        }
+    };
+    TuiAutoFocusDirective.ctorParameters = function () { return [
+        { type: undefined, decorators: [{ type: Inject, args: [TUI_AUTOFOCUS_HANDLER,] }] }
     ]; };
     __decorate([
         Input()
@@ -102,15 +183,9 @@ var TuiAutoFocusDirective = /** @class */ (function () {
     TuiAutoFocusDirective = __decorate([
         Directive({
             selector: '[tuiAutoFocus]',
+            providers: TUI_AUTOFOCUS_PROVIDERS,
         }),
-        __param(0, Optional()),
-        __param(0, Self()),
-        __param(0, Inject(TUI_FOCUSABLE_ITEM_ACCESSOR)),
-        __param(1, Inject(TUI_IS_IOS)),
-        __param(2, Inject(ANIMATION_FRAME)),
-        __param(3, Inject(NgZone)),
-        __param(4, Inject(ElementRef)),
-        __param(5, Inject(Renderer2))
+        __param(0, Inject(TUI_AUTOFOCUS_HANDLER))
     ], TuiAutoFocusDirective);
     return TuiAutoFocusDirective;
 }());
@@ -131,5 +206,5 @@ var TuiAutoFocusModule = /** @class */ (function () {
  * Generated bundle index. Do not edit.
  */
 
-export { TuiAutoFocusDirective, TuiAutoFocusModule };
+export { AbstractTuiAutofocusHandler, TUI_AUTOFOCUS_HANDLER, TUI_AUTOFOCUS_PROVIDERS, TuiAutoFocusDirective, TuiAutoFocusModule, TuiDefaultAutofocusHandler, TuiIosAutofocusHandler, tuiAutofocusHandlerFactory };
 //# sourceMappingURL=taiga-ui-cdk-directives-auto-focus.js.map

package/fesm5/taiga-ui-cdk-directives-auto-focus.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-cdk-directives-auto-focus.js","sources":["ng://@taiga-ui/cdk/directives/auto-focus/autofocus.directive.ts","ng://@taiga-ui/cdk/directives/auto-focus/autofocus.module.ts","ng://@taiga-ui/cdk/directives/auto-focus/taiga-ui-cdk-directives-auto-focus.ts"],"sourcesContent":["import {\n    AfterViewInit,\n    Directive,\n    ElementRef,\n    Inject,\n    Input,\n    NgZone,\n    Optional,\n    Renderer2,\n    Self,\n} from '@angular/core';\nimport {ANIMATION_FRAME} from '@ng-web-apis/common';\nimport {POLLING_TIME} from '@taiga-ui/cdk/constants';\nimport {\n    TuiFocusableElementAccessor,\n    TuiNativeFocusableElement,\n} from '@taiga-ui/cdk/interfaces';\nimport {TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_IOS} from '@taiga-ui/cdk/tokens';\nimport {setNativeFocused} from '@taiga-ui/cdk/utils/focus';\nimport {Observable, race, timer} from 'rxjs';\nimport {map, skipWhile, take, throttleTime} from 'rxjs/operators';\n\nconst TIMEOUT = 1000;\nconst NG_ANIMATION_SELECTOR = '.ng-animating';\n\n// TODO: in 3.0 change input name to tuiAutoFocus and handle empty string\n// TODO: refactor on this whole thing in 3.0\n@Directive({\n    selector: '[tuiAutoFocus]',\n})\nexport class TuiAutoFocusDirective implements AfterViewInit {\n    @Input()\n    autoFocus = true;\n\n    constructor(\n        @Optional()\n        @Self()\n        @Inject(TUI_FOCUSABLE_ITEM_ACCESSOR)\n        private readonly tuiFocusableComponent: TuiFocusableElementAccessor | null,\n        @Inject(TUI_IS_IOS) private readonly isIos: boolean,\n        @Inject(ANIMATION_FRAME) private readonly animationFrame$: Observable<number>,\n        @Inject(NgZone)\n        private readonly ngZone: NgZone,\n        @Inject(ElementRef)\n        private readonly elementRef: ElementRef<HTMLElement>,\n        @Inject(Renderer2)\n        private readonly renderer: Renderer2,\n    ) {}\n\n    ngAfterViewInit(): void {\n        if (!this.autoFocus) {\n            return;\n        }\n\n        if (this.isTextFieldElement) {\n            if (this.isIos) {\n                this.ngZone.runOutsideAngular(() => this.iosWebkitAutofocus());\n            } else {\n                race(\n                    timer(TIMEOUT),\n                    this.animationFrame$.pipe(\n                        throttleTime(POLLING_TIME),\n                        map(() => this.element.closest(NG_ANIMATION_SELECTOR)),\n                        skipWhile(Boolean),\n                        take(1),\n                    ),\n                ).subscribe(() => setNativeFocused(this.element));\n            }\n\n            return;\n        }\n\n        setNativeFocused(this.element);\n    }\n\n    private get element(): TuiNativeFocusableElement {\n        return (\n            this.tuiFocusableComponent?.nativeFocusableElement ||\n            this.elementRef.nativeElement\n        );\n    }\n\n    private get isTextFieldElement(): boolean {\n        return this.element.matches('input, textarea');\n    }\n\n    private iosWebkitAutofocus(): void {\n        const fakeInput: HTMLElement = this.renderer.createElement('input');\n\n        fakeInput.style.position = 'absolute';\n        fakeInput.style.opacity = '0';\n        fakeInput.style.height = '0';\n\n        const blurHandler = (): void => setNativeFocused(fakeInput);\n        const focusHandler = (): void => {\n            setTimeout(() => {\n                setNativeFocused(this.element);\n\n                /**\n                 * @note:\n                 * We can't remove the element immediately, because it breaks flow\n                 */\n                setTimeout(() => {\n                    fakeInput.removeEventListener('blur', blurHandler);\n                    fakeInput.removeEventListener('focus', focusHandler);\n                    fakeInput.remove();\n                });\n            });\n        };\n\n        /**\n         * @note: ping-pong eager strategy hack\n         * After creating an element and bringing it into DOM,\n         * the browser automatically focuses on the invisible element.\n         * And then, after focus is triggered, we try to focus on target element, and if we managed to refocus,\n         * then we try to focus again on an invisible element, so that the keyboard slowly appears.\n         * This ping pong allows the keyboard to not overlap the modal window.\n         */\n        fakeInput.addEventListener('blur', blurHandler, {once: true});\n        fakeInput.addEventListener('focus', focusHandler);\n\n        this.element.parentElement?.appendChild(fakeInput);\n\n        setNativeFocused(fakeInput);\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiAutoFocusDirective} from './autofocus.directive';\n\n@NgModule({\n    declarations: [TuiAutoFocusDirective],\n    exports: [TuiAutoFocusDirective],\n})\nexport class TuiAutoFocusModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"taiga-ui-cdk-directives-auto-focus.js","sources":["ng://@taiga-ui/cdk/directives/auto-focus/handlers/abstract.handler.ts","ng://@taiga-ui/cdk/directives/auto-focus/handlers/default.handler.ts","ng://@taiga-ui/cdk/directives/auto-focus/handlers/ios.handler.ts","ng://@taiga-ui/cdk/directives/auto-focus/autofocus.options.ts","ng://@taiga-ui/cdk/directives/auto-focus/autofocus.directive.ts","ng://@taiga-ui/cdk/directives/auto-focus/autofocus.module.ts","ng://@taiga-ui/cdk/directives/auto-focus/taiga-ui-cdk-directives-auto-focus.ts"],"sourcesContent":["import {Directive, ElementRef} from '@angular/core';\nimport {\n    TuiFocusableElementAccessor,\n    TuiNativeFocusableElement,\n} from '@taiga-ui/cdk/interfaces';\n\nimport {TuiAutofocusHandler} from '../autofocus.options';\n\n@Directive()\nexport abstract class AbstractTuiAutofocusHandler implements TuiAutofocusHandler {\n    protected constructor(\n        protected readonly tuiFocusableComponent: TuiFocusableElementAccessor | null,\n        protected readonly elementRef: ElementRef<HTMLElement>,\n    ) {}\n\n    protected get element(): TuiNativeFocusableElement {\n        return (\n            this.tuiFocusableComponent?.nativeFocusableElement ||\n            this.elementRef.nativeElement\n        );\n    }\n\n    protected get isTextFieldElement(): boolean {\n        return this.element.matches('input, textarea');\n    }\n\n    abstract setFocus(): void;\n}\n","import {Directive, ElementRef, Inject, Optional, Self} from '@angular/core';\nimport {ANIMATION_FRAME} from '@ng-web-apis/common';\nimport {POLLING_TIME} from '@taiga-ui/cdk/constants';\nimport {TuiFocusableElementAccessor} from '@taiga-ui/cdk/interfaces';\nimport {TUI_FOCUSABLE_ITEM_ACCESSOR} from '@taiga-ui/cdk/tokens';\nimport {Observable, race, timer} from 'rxjs';\nimport {map, skipWhile, take, throttleTime} from 'rxjs/operators';\n\nimport {AbstractTuiAutofocusHandler} from './abstract.handler';\n\nconst TIMEOUT = 1000;\nconst NG_ANIMATION_SELECTOR = '.ng-animating';\n\n@Directive()\nexport class TuiDefaultAutofocusHandler extends AbstractTuiAutofocusHandler {\n    constructor(\n        @Optional()\n        @Self()\n        @Inject(TUI_FOCUSABLE_ITEM_ACCESSOR)\n        tuiFocusableComponent: TuiFocusableElementAccessor | null,\n        @Inject(ElementRef) elementRef: ElementRef<HTMLElement>,\n        @Inject(ANIMATION_FRAME) private readonly animationFrame$: Observable<number>,\n    ) {\n        super(tuiFocusableComponent, elementRef);\n    }\n\n    setFocus(): void {\n        if (this.isTextFieldElement) {\n            race(\n                timer(TIMEOUT),\n                this.animationFrame$.pipe(\n                    throttleTime(POLLING_TIME),\n                    map(() => this.element.closest(NG_ANIMATION_SELECTOR)),\n                    skipWhile(Boolean),\n                    take(1),\n                ),\n            ).subscribe(() => this.element.focus());\n        } else {\n            this.element.focus();\n        }\n    }\n}\n","import {\n    Directive,\n    ElementRef,\n    Inject,\n    NgZone,\n    Optional,\n    Renderer2,\n    Self,\n} from '@angular/core';\nimport {TuiFocusableElementAccessor} from '@taiga-ui/cdk/interfaces';\nimport {TUI_FOCUSABLE_ITEM_ACCESSOR} from '@taiga-ui/cdk/tokens';\n\nimport {AbstractTuiAutofocusHandler} from './abstract.handler';\n\n@Directive()\nexport class TuiIosAutofocusHandler extends AbstractTuiAutofocusHandler {\n    constructor(\n        @Optional()\n        @Self()\n        @Inject(TUI_FOCUSABLE_ITEM_ACCESSOR)\n        tuiFocusableComponent: TuiFocusableElementAccessor | null,\n        @Inject(ElementRef) elementRef: ElementRef<HTMLElement>,\n        @Inject(Renderer2)\n        private readonly renderer: Renderer2,\n        @Inject(NgZone)\n        private readonly ngZone: NgZone,\n    ) {\n        super(tuiFocusableComponent, elementRef);\n    }\n\n    setFocus(): void {\n        if (this.isTextFieldElement) {\n            this.ngZone.runOutsideAngular(() => this.iosWebkitAutofocus());\n        } else {\n            this.element.focus();\n        }\n    }\n\n    private iosWebkitAutofocus(): void {\n        const fakeInput: HTMLElement = this.renderer.createElement('input');\n\n        fakeInput.style.position = 'absolute';\n        fakeInput.style.opacity = '0';\n        fakeInput.style.height = '0';\n\n        const blurHandler = (): void => fakeInput.focus();\n        const focusHandler = (): void => {\n            setTimeout(() => {\n                this.element.focus();\n\n                /**\n                 * @note:\n                 * We can't remove the element immediately, because it breaks flow\n                 */\n                setTimeout(() => {\n                    fakeInput.removeEventListener('blur', blurHandler);\n                    fakeInput.removeEventListener('focus', focusHandler);\n                    fakeInput.remove();\n                });\n            });\n        };\n\n        /**\n         * @note: ping-pong eager strategy hack\n         * After creating an element and bringing it into DOM,\n         * the browser automatically focuses on the invisible element.\n         * And then, after focus is triggered, we try to focus on target element, and if we managed to refocus,\n         * then we try to focus again on an invisible element, so that the keyboard slowly appears.\n         * This ping pong allows the keyboard to not overlap the modal window.\n         */\n        fakeInput.addEventListener('blur', blurHandler, {once: true});\n        fakeInput.addEventListener('focus', focusHandler);\n\n        this.element.parentElement?.appendChild(fakeInput);\n\n        fakeInput.focus();\n    }\n}\n","import {\n    ElementRef,\n    inject,\n    InjectionToken,\n    NgZone,\n    Optional,\n    Renderer2,\n    Self,\n} from '@angular/core';\nimport {ANIMATION_FRAME} from '@ng-web-apis/common';\nimport {TuiFocusableElementAccessor} from '@taiga-ui/cdk/interfaces';\nimport {TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_APPLE} from '@taiga-ui/cdk/tokens';\nimport {Observable} from 'rxjs';\n\nimport {TuiDefaultAutofocusHandler} from './handlers/default.handler';\nimport {TuiIosAutofocusHandler} from './handlers/ios.handler';\n\nexport interface TuiAutofocusHandler {\n    setFocus(): void;\n}\n\nexport const TUI_AUTOFOCUS_HANDLER = new InjectionToken<TuiAutofocusHandler>(\n    'Autofocusing handler',\n);\n\n// TODO: 3.0 remove in ivy compilation\nexport function tuiAutofocusHandlerFactory(\n    tuiFocusableComponent: TuiFocusableElementAccessor | null,\n    elementRef: ElementRef<HTMLElement>,\n    animationFrame$: Observable<number>,\n    renderer: Renderer2,\n    ngZone: NgZone,\n): TuiAutofocusHandler {\n    return inject(TUI_IS_APPLE)\n        ? new TuiIosAutofocusHandler(tuiFocusableComponent, elementRef, renderer, ngZone)\n        : new TuiDefaultAutofocusHandler(\n              tuiFocusableComponent,\n              elementRef,\n              animationFrame$,\n          );\n}\n\nexport const TUI_AUTOFOCUS_PROVIDERS = [\n    {\n        provide: TUI_AUTOFOCUS_HANDLER,\n        // TODO: replace to useClass in v3.0\n        useFactory: tuiAutofocusHandlerFactory,\n        deps: [\n            [new Optional(), new Self(), TUI_FOCUSABLE_ITEM_ACCESSOR],\n            ElementRef,\n            ANIMATION_FRAME,\n            Renderer2,\n            NgZone,\n        ],\n    },\n];\n","import {AfterViewInit, Directive, Inject, Input} from '@angular/core';\n\nimport {\n    TUI_AUTOFOCUS_HANDLER,\n    TUI_AUTOFOCUS_PROVIDERS,\n    TuiAutofocusHandler,\n} from './autofocus.options';\n\n// TODO: 3.0 change input name to tuiAutoFocus and handle empty string\n@Directive({\n    selector: '[tuiAutoFocus]',\n    providers: TUI_AUTOFOCUS_PROVIDERS,\n})\nexport class TuiAutoFocusDirective implements AfterViewInit {\n    @Input()\n    autoFocus = true;\n\n    constructor(\n        @Inject(TUI_AUTOFOCUS_HANDLER) private readonly handler: TuiAutofocusHandler,\n    ) {}\n\n    ngAfterViewInit(): void {\n        if (this.autoFocus) {\n            this.handler.setFocus();\n        }\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiAutoFocusDirective} from './autofocus.directive';\n\n@NgModule({\n    declarations: [TuiAutoFocusDirective],\n    exports: [TuiAutoFocusDirective],\n})\nexport class TuiAutoFocusModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm5/taiga-ui-cdk-directives-autofilled.js

@@ -1,38 +1,53 @@
 import { __decorate, __param } from 'tslib';
-import { ElementRef, Inject, Output, Directive, NgModule } from '@angular/core';
-import { typedFromEvent } from '@taiga-ui/cdk/observables';
+import { Component, ViewEncapsulation, EventEmitter, Inject, HostBinding, Output, HostListener, Directive, NgModule } from '@angular/core';
 import { TuiDirectiveStylesService } from '@taiga-ui/cdk/services';
-import { map, skip } from 'rxjs/operators';
 
-var ON = 'tuiAutofillOn';
-var OFF = 'tuiAutofillOff';
-var STYLE = "\n@keyframes " + ON + " {\n    from {\n        content: '1';\n    }\n\n    to {\n        content: '2';\n    }\n}\n\n@keyframes " + OFF + " {\n    from {\n        content: '2';\n    }\n\n    to {\n        content: '1';\n    }\n}";
-// @dynamic
+var TuiAutofilledStyleComponent = /** @class */ (function () {
+    function TuiAutofilledStyleComponent() {
+    }
+    TuiAutofilledStyleComponent = __decorate([
+        Component({
+            template: '',
+            encapsulation: ViewEncapsulation.None,
+            styles: [".tui-autofill,.tui-autofill input{transition:box-shadow 10ms}.tui-autofill input::-webkit-credit-card-auto-fill-button,.tui-autofill::-webkit-credit-card-auto-fill-button{pointer-events:none;background-color:transparent!important;-webkit-mask-image:none!important}"]
+        })
+    ], TuiAutofilledStyleComponent);
+    return TuiAutofilledStyleComponent;
+}());
+
 var TuiAutofilledDirective = /** @class */ (function () {
-    function TuiAutofilledDirective(elementRef, directiveStyles) {
-        this.elementRef = elementRef;
-        this.tuiAutofilledChange = typedFromEvent(this.elementRef.nativeElement, 'animationstart').pipe(map(function (_a) {
-            var animationName = _a.animationName;
-            return animationName === ON;
-        }), skip(1));
-        directiveStyles.addStyle(STYLE, 'TuiAutofilledDirective');
+    function TuiAutofilledDirective(directiveStyles) {
+        this.autofilled = false;
+        this.tuiAutofilledChange = new EventEmitter();
+        directiveStyles.addComponent(TuiAutofilledStyleComponent);
     }
+    TuiAutofilledDirective.prototype.transitionStartHandler = function (_a) {
+        var propertyName = _a.propertyName, target = _a.target;
+        var _b;
+        var matchedAutofill = propertyName.includes('box-shadow') && ((_b = target) === null || _b === void 0 ? void 0 : _b.matches('input'));
+        if (matchedAutofill) {
+            this.autofilled = !this.autofilled;
+            this.tuiAutofilledChange.emit(this.autofilled);
+        }
+    };
     TuiAutofilledDirective.ctorParameters = function () { return [
-        { type: ElementRef, decorators: [{ type: Inject, args: [ElementRef,] }] },
         { type: TuiDirectiveStylesService, decorators: [{ type: Inject, args: [TuiDirectiveStylesService,] }] }
     ]; };
+    __decorate([
+        HostBinding('class._autofilled')
+    ], TuiAutofilledDirective.prototype, "autofilled", void 0);
     __decorate([
         Output()
     ], TuiAutofilledDirective.prototype, "tuiAutofilledChange", void 0);
+    __decorate([
+        HostListener('transitionstart', ['$event'])
+    ], TuiAutofilledDirective.prototype, "transitionStartHandler", null);
     TuiAutofilledDirective = __decorate([
         Directive({
             selector: '[tuiAutofilledChange]',
-            host: {
-                class: 'tui-autofill',
-            },
+            host: { class: 'tui-autofill' },
         }),
-        __param(0, Inject(ElementRef)),
-        __param(1, Inject(TuiDirectiveStylesService))
+        __param(0, Inject(TuiDirectiveStylesService))
     ], TuiAutofilledDirective);
     return TuiAutofilledDirective;
 }());
@@ -42,8 +57,9 @@ var TuiAutofilledModule = /** @class */ (function () {
     }
     TuiAutofilledModule = __decorate([
         NgModule({
-            declarations: [TuiAutofilledDirective],
             exports: [TuiAutofilledDirective],
+            entryComponents: [TuiAutofilledStyleComponent],
+            declarations: [TuiAutofilledDirective, TuiAutofilledStyleComponent],
         })
     ], TuiAutofilledModule);
     return TuiAutofilledModule;
@@ -53,5 +69,5 @@ var TuiAutofilledModule = /** @class */ (function () {
  * Generated bundle index. Do not edit.
  */
 
-export { TuiAutofilledDirective, TuiAutofilledModule };
+export { TuiAutofilledDirective, TuiAutofilledModule, TuiAutofilledStyleComponent };
 //# sourceMappingURL=taiga-ui-cdk-directives-autofilled.js.map

package/fesm5/taiga-ui-cdk-directives-autofilled.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-cdk-directives-autofilled.js","sources":["ng://@taiga-ui/cdk/directives/autofilled/autofilled.directive.ts","ng://@taiga-ui/cdk/directives/autofilled/autofilled.module.ts","ng://@taiga-ui/cdk/directives/autofilled/taiga-ui-cdk-directives-autofilled.ts"],"sourcesContent":["import {Directive, ElementRef, Inject, Output} from '@angular/core';\nimport {typedFromEvent} from '@taiga-ui/cdk/observables';\nimport {TuiDirectiveStylesService} from '@taiga-ui/cdk/services';\nimport {map, skip} from 'rxjs/operators';\n\nconst ON = 'tuiAutofillOn';\nconst OFF = 'tuiAutofillOff';\nconst STYLE = `\n@keyframes ${ON} {\n    from {\n        content: '1';\n    }\n\n    to {\n        content: '2';\n    }\n}\n\n@keyframes ${OFF} {\n    from {\n        content: '2';\n    }\n\n    to {\n        content: '1';\n    }\n}`;\n\n// @dynamic\n@Directive({\n    selector: '[tuiAutofilledChange]',\n    host: {\n        class: 'tui-autofill',\n    },\n})\nexport class TuiAutofilledDirective {\n    @Output()\n    readonly tuiAutofilledChange = typedFromEvent(\n        this.elementRef.nativeElement,\n        'animationstart',\n    ).pipe(\n        map(({animationName}) => animationName === ON),\n        skip(1),\n    );\n\n    constructor(\n        @Inject(ElementRef) private readonly elementRef: ElementRef<HTMLInputElement>,\n        @Inject(TuiDirectiveStylesService)\n        directiveStyles: TuiDirectiveStylesService,\n    ) {\n        directiveStyles.addStyle(STYLE, 'TuiAutofilledDirective');\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiAutofilledDirective} from './autofilled.directive';\n\n@NgModule({\n    declarations: [TuiAutofilledDirective],\n    exports: [TuiAutofilledDirective],\n})\nexport class TuiAutofilledModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAKA,IAAM,EAAE,GAAG,eAAe,CAAC;AAC3B,IAAM,GAAG,GAAG,gBAAgB,CAAC;AAC7B,IAAM,KAAK,GAAG,kBACD,EAAE,gHAUF,GAAG,8FAQd,CAAC;AAEH;;IAiBI,gCACyC,UAAwC,EAE7E,eAA0C;QAFL,eAAU,GAAV,UAAU,CAA8B;QATxE,wBAAmB,GAAG,cAAc,CACzC,IAAI,CAAC,UAAU,CAAC,aAAa,EAC7B,gBAAgB,CACnB,CAAC,IAAI,CACF,GAAG,CAAC,UAAC,EAAe;gBAAd,gCAAa;YAAM,OAAA,aAAa,KAAK,EAAE;SAAA,CAAC,EAC9C,IAAI,CAAC,CAAC,CAAC,CACV,CAAC;QAOE,eAAe,CAAC,QAAQ,CAAC,KAAK,EAAE,wBAAwB,CAAC,CAAC;KAC7D;;gBALoD,UAAU,uBAA1D,MAAM,SAAC,UAAU;gBAED,yBAAyB,uBADzC,MAAM,SAAC,yBAAyB;;IAVrC;QADC,MAAM,EAAE;uEAOP;IARO,sBAAsB;QANlC,SAAS,CAAC;YACP,QAAQ,EAAE,uBAAuB;YACjC,IAAI,EAAE;gBACF,KAAK,EAAE,cAAc;aACxB;SACJ,CAAC;QAYO,WAAA,MAAM,CAAC,UAAU,CAAC,CAAA;QAClB,WAAA,MAAM,CAAC,yBAAyB,CAAC,CAAA;OAZ7B,sBAAsB,CAiBlC;IAAD,6BAAC;CAjBD;;;IC3BA;KAAmC;IAAtB,mBAAmB;QAJ/B,QAAQ,CAAC;YACN,YAAY,EAAE,CAAC,sBAAsB,CAAC;YACtC,OAAO,EAAE,CAAC,sBAAsB,CAAC;SACpC,CAAC;OACW,mBAAmB,CAAG;IAAD,0BAAC;CAAnC;;ACRA;;;;;;"}
+{"version":3,"file":"taiga-ui-cdk-directives-autofilled.js","sources":["ng://@taiga-ui/cdk/directives/autofilled/autofilled-style.component.ts","ng://@taiga-ui/cdk/directives/autofilled/autofilled.directive.ts","ng://@taiga-ui/cdk/directives/autofilled/autofilled.module.ts","ng://@taiga-ui/cdk/directives/autofilled/taiga-ui-cdk-directives-autofilled.ts"],"sourcesContent":["import {Component, ViewEncapsulation} from '@angular/core';\n\n@Component({\n    template: '',\n    styleUrls: ['./autofilled.style.less'],\n    encapsulation: ViewEncapsulation.None,\n})\nexport class TuiAutofilledStyleComponent {}\n","import {\n    Directive,\n    EventEmitter,\n    HostBinding,\n    HostListener,\n    Inject,\n    Output,\n} from '@angular/core';\nimport {TuiDirectiveStylesService} from '@taiga-ui/cdk/services';\n\nimport {TuiAutofilledStyleComponent} from './autofilled-style.component';\n\n@Directive({\n    selector: '[tuiAutofilledChange]',\n    host: {class: 'tui-autofill'},\n})\nexport class TuiAutofilledDirective {\n    @HostBinding('class._autofilled')\n    autofilled = false;\n\n    @Output()\n    readonly tuiAutofilledChange = new EventEmitter<boolean>();\n\n    constructor(\n        @Inject(TuiDirectiveStylesService) directiveStyles: TuiDirectiveStylesService,\n    ) {\n        directiveStyles.addComponent(TuiAutofilledStyleComponent);\n    }\n\n    @HostListener('transitionstart', ['$event'])\n    transitionStartHandler({propertyName, target}: TransitionEvent): void {\n        const matchedAutofill =\n            propertyName.includes('box-shadow') && (target as Element)?.matches('input');\n\n        if (matchedAutofill) {\n            this.autofilled = !this.autofilled;\n            this.tuiAutofilledChange.emit(this.autofilled);\n        }\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiAutofilledDirective} from './autofilled.directive';\nimport {TuiAutofilledStyleComponent} from './autofilled-style.component';\n\n@NgModule({\n    exports: [TuiAutofilledDirective],\n    entryComponents: [TuiAutofilledStyleComponent],\n    declarations: [TuiAutofilledDirective, TuiAutofilledStyleComponent],\n})\nexport class TuiAutofilledModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;IAOA;KAA2C;IAA9B,2BAA2B;QALvC,SAAS,CAAC;YACP,QAAQ,EAAE,EAAE;YAEZ,aAAa,EAAE,iBAAiB,CAAC,IAAI;;SACxC,CAAC;OACW,2BAA2B,CAAG;IAAD,kCAAC;CAA3C;;;ICgBI,gCACuC,eAA0C;QANjF,eAAU,GAAG,KAAK,CAAC;QAGV,wBAAmB,GAAG,IAAI,YAAY,EAAW,CAAC;QAKvD,eAAe,CAAC,YAAY,CAAC,2BAA2B,CAAC,CAAC;KAC7D;IAGD,uDAAsB,GAAtB,UAAuB,EAAuC;YAAtC,8BAAY,EAAE,kBAAM;;QACxC,IAAM,eAAe,GACjB,YAAY,CAAC,QAAQ,CAAC,YAAY,CAAC,WAAK,MAAkB,0CAAE,OAAO,CAAC,OAAO,EAAC,CAAC;QAEjF,IAAI,eAAe,EAAE;YACjB,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;YACnC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SAClD;KACJ;;gBAduD,yBAAyB,uBAA5E,MAAM,SAAC,yBAAyB;;IANrC;QADC,WAAW,CAAC,mBAAmB,CAAC;8DACd;IAGnB;QADC,MAAM,EAAE;uEACkD;IAS3D;QADC,YAAY,CAAC,iBAAiB,EAAE,CAAC,QAAQ,CAAC,CAAC;wEAS3C;IAtBQ,sBAAsB;QAJlC,SAAS,CAAC;YACP,QAAQ,EAAE,uBAAuB;YACjC,IAAI,EAAE,EAAC,KAAK,EAAE,cAAc,EAAC;SAChC,CAAC;QASO,WAAA,MAAM,CAAC,yBAAyB,CAAC,CAAA;OAR7B,sBAAsB,CAuBlC;IAAD,6BAAC;CAvBD;;;ICNA;KAAmC;IAAtB,mBAAmB;QAL/B,QAAQ,CAAC;YACN,OAAO,EAAE,CAAC,sBAAsB,CAAC;YACjC,eAAe,EAAE,CAAC,2BAA2B,CAAC;YAC9C,YAAY,EAAE,CAAC,sBAAsB,EAAE,2BAA2B,CAAC;SACtE,CAAC;OACW,mBAAmB,CAAG;IAAD,0BAAC;CAAnC;;ACVA;;;;;;"}

package/fesm5/taiga-ui-cdk-directives-focus-trap.js

@@ -13,10 +13,11 @@ var TuiFocusTrapDirective = /** @class */ (function () {
         this.renderer = renderer;
         this.activeElement = getNativeFocused(this.documentRef);
         /**
-         * This would cause currently focused element to lose focus
+         * This would cause currently focused element to lose focus,
          * but it might cause ExpressionChanged error due to potential HostBinding.
          * Microtask keeps it in the same frame but allows change detection to run
          */
+        // eslint-disable-next-line @typescript-eslint/no-floating-promises
         Promise.resolve().then(function () {
             setNativeFocused(_this.elementRef.nativeElement);
         });
@@ -42,6 +43,7 @@ var TuiFocusTrapDirective = /** @class */ (function () {
          * so we need to delay it but stay in the same sync cycle,
          * therefore using Promise instead of setTimeout
          */
+        // eslint-disable-next-line
         Promise.resolve().then(function () {
             // TODO: iframe warning
             if (_this.activeElement instanceof HTMLElement) {

package/fesm5/taiga-ui-cdk-directives-focus-trap.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-cdk-directives-focus-trap.js","sources":["ng://@taiga-ui/cdk/directives/focus-trap/focus-trap.directive.ts","ng://@taiga-ui/cdk/directives/focus-trap/focus-trap.module.ts","ng://@taiga-ui/cdk/directives/focus-trap/taiga-ui-cdk-directives-focus-trap.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {\n    Directive,\n    ElementRef,\n    HostListener,\n    Inject,\n    OnDestroy,\n    Renderer2,\n} from '@angular/core';\nimport {containsOrAfter} from '@taiga-ui/cdk/utils/dom';\nimport {\n    blurNativeFocused,\n    getClosestFocusable,\n    getNativeFocused,\n    setNativeFocused,\n} from '@taiga-ui/cdk/utils/focus';\n\n// @dynamic\n@Directive({\n    selector: '[tuiFocusTrap]',\n    host: {\n        tabIndex: '0',\n    },\n})\nexport class TuiFocusTrapDirective implements OnDestroy {\n    private readonly activeElement = getNativeFocused(this.documentRef);\n\n    constructor(\n        @Inject(DOCUMENT) private readonly documentRef: Document,\n        @Inject(ElementRef)\n        private readonly elementRef: ElementRef<HTMLElement>,\n        @Inject(Renderer2) private readonly renderer: Renderer2,\n    ) {\n        /**\n         * This would cause currently focused element to lose focus\n         * but it might cause ExpressionChanged error due to potential HostBinding.\n         * Microtask keeps it in the same frame but allows change detection to run\n         */\n        Promise.resolve().then(() => {\n            setNativeFocused(this.elementRef.nativeElement);\n        });\n    }\n\n    @HostListener('blur')\n    onBlur(): void {\n        this.renderer.removeAttribute(this.elementRef.nativeElement, 'tabIndex');\n    }\n\n    @HostListener('window:focusin.silent', ['$event.target'])\n    onFocusIn(node: Node): void {\n        if (containsOrAfter(this.elementRef.nativeElement, node)) {\n            return;\n        }\n\n        const focusable = getClosestFocusable(\n            this.elementRef.nativeElement,\n            false,\n            this.elementRef.nativeElement,\n        );\n\n        if (focusable) {\n            setNativeFocused(focusable);\n        }\n    }\n\n    ngOnDestroy(): void {\n        blurNativeFocused(this.documentRef);\n\n        /**\n         * HostListeners are triggered even after ngOnDestroy\n         * {@link https://github.com/angular/angular/issues/38100}\n         * so we need to delay it but stay in the same sync cycle,\n         * therefore using Promise instead of setTimeout\n         */\n        Promise.resolve().then(() => {\n            // TODO: iframe warning\n            if (this.activeElement instanceof HTMLElement) {\n                setNativeFocused(this.activeElement);\n            }\n        });\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiFocusTrapDirective} from './focus-trap.directive';\n\n@NgModule({\n    declarations: [TuiFocusTrapDirective],\n    exports: [TuiFocusTrapDirective],\n})\nexport class TuiFocusTrapModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAiBA;;IAUI,+BACuC,WAAqB,EAEvC,UAAmC,EAChB,QAAmB;QAJ3D,iBAcC;QAbsC,gBAAW,GAAX,WAAW,CAAU;QAEvC,eAAU,GAAV,UAAU,CAAyB;QAChB,aAAQ,GAAR,QAAQ,CAAW;QAN1C,kBAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;;;;;;QAahE,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC;YACnB,gBAAgB,CAAC,KAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;SACnD,CAAC,CAAC;KACN;IAGD,sCAAM,GAAN;QACI,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;KAC5E;IAGD,yCAAS,GAAT,UAAU,IAAU;QAChB,IAAI,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,IAAI,CAAC,EAAE;YACtD,OAAO;SACV;QAED,IAAM,SAAS,GAAG,mBAAmB,CACjC,IAAI,CAAC,UAAU,CAAC,aAAa,EAC7B,KAAK,EACL,IAAI,CAAC,UAAU,CAAC,aAAa,CAChC,CAAC;QAEF,IAAI,SAAS,EAAE;YACX,gBAAgB,CAAC,SAAS,CAAC,CAAC;SAC/B;KACJ;IAED,2CAAW,GAAX;QAAA,iBAeC;QAdG,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;;;;;;;QAQpC,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC;;YAEnB,IAAI,KAAI,CAAC,aAAa,YAAY,WAAW,EAAE;gBAC3C,gBAAgB,CAAC,KAAI,CAAC,aAAa,CAAC,CAAC;aACxC;SACJ,CAAC,CAAC;KACN;;gBApDmD,QAAQ,uBAAvD,MAAM,SAAC,QAAQ;gBAEa,UAAU,uBADtC,MAAM,SAAC,UAAU;gBAE4B,SAAS,uBAAtD,MAAM,SAAC,SAAS;;IAarB;QADC,YAAY,CAAC,MAAM,CAAC;uDAGpB;IAGD;QADC,YAAY,CAAC,uBAAuB,EAAE,CAAC,eAAe,CAAC,CAAC;0DAexD;IAvCQ,qBAAqB;QANjC,SAAS,CAAC;YACP,QAAQ,EAAE,gBAAgB;YAC1B,IAAI,EAAE;gBACF,QAAQ,EAAE,GAAG;aAChB;SACJ,CAAC;QAKO,WAAA,MAAM,CAAC,QAAQ,CAAC,CAAA;QAChB,WAAA,MAAM,CAAC,UAAU,CAAC,CAAA;QAElB,WAAA,MAAM,CAAC,SAAS,CAAC,CAAA;OAPb,qBAAqB,CAyDjC;IAAD,4BAAC;CAzDD;;;IChBA;KAAkC;IAArB,kBAAkB;QAJ9B,QAAQ,CAAC;YACN,YAAY,EAAE,CAAC,qBAAqB,CAAC;YACrC,OAAO,EAAE,CAAC,qBAAqB,CAAC;SACnC,CAAC;OACW,kBAAkB,CAAG;IAAD,yBAAC;CAAlC;;ACRA;;;;;;"}
+{"version":3,"file":"taiga-ui-cdk-directives-focus-trap.js","sources":["ng://@taiga-ui/cdk/directives/focus-trap/focus-trap.directive.ts","ng://@taiga-ui/cdk/directives/focus-trap/focus-trap.module.ts","ng://@taiga-ui/cdk/directives/focus-trap/taiga-ui-cdk-directives-focus-trap.ts"],"sourcesContent":["import {DOCUMENT} from '@angular/common';\nimport {\n    Directive,\n    ElementRef,\n    HostListener,\n    Inject,\n    OnDestroy,\n    Renderer2,\n} from '@angular/core';\nimport {containsOrAfter} from '@taiga-ui/cdk/utils/dom';\nimport {\n    blurNativeFocused,\n    getClosestFocusable,\n    getNativeFocused,\n    setNativeFocused,\n} from '@taiga-ui/cdk/utils/focus';\n\n// @dynamic\n@Directive({\n    selector: '[tuiFocusTrap]',\n    host: {\n        tabIndex: '0',\n    },\n})\nexport class TuiFocusTrapDirective implements OnDestroy {\n    private readonly activeElement = getNativeFocused(this.documentRef);\n\n    constructor(\n        @Inject(DOCUMENT) private readonly documentRef: Document,\n        @Inject(ElementRef)\n        private readonly elementRef: ElementRef<HTMLElement>,\n        @Inject(Renderer2) private readonly renderer: Renderer2,\n    ) {\n        /**\n         * This would cause currently focused element to lose focus,\n         * but it might cause ExpressionChanged error due to potential HostBinding.\n         * Microtask keeps it in the same frame but allows change detection to run\n         */\n        // eslint-disable-next-line @typescript-eslint/no-floating-promises\n        Promise.resolve().then(() => {\n            setNativeFocused(this.elementRef.nativeElement);\n        });\n    }\n\n    @HostListener('blur')\n    onBlur(): void {\n        this.renderer.removeAttribute(this.elementRef.nativeElement, 'tabIndex');\n    }\n\n    @HostListener('window:focusin.silent', ['$event.target'])\n    onFocusIn(node: Node): void {\n        if (containsOrAfter(this.elementRef.nativeElement, node)) {\n            return;\n        }\n\n        const focusable = getClosestFocusable(\n            this.elementRef.nativeElement,\n            false,\n            this.elementRef.nativeElement,\n        );\n\n        if (focusable) {\n            setNativeFocused(focusable);\n        }\n    }\n\n    ngOnDestroy(): void {\n        blurNativeFocused(this.documentRef);\n\n        /**\n         * HostListeners are triggered even after ngOnDestroy\n         * {@link https://github.com/angular/angular/issues/38100}\n         * so we need to delay it but stay in the same sync cycle,\n         * therefore using Promise instead of setTimeout\n         */\n        // eslint-disable-next-line\n        Promise.resolve().then(() => {\n            // TODO: iframe warning\n            if (this.activeElement instanceof HTMLElement) {\n                setNativeFocused(this.activeElement);\n            }\n        });\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiFocusTrapDirective} from './focus-trap.directive';\n\n@NgModule({\n    declarations: [TuiFocusTrapDirective],\n    exports: [TuiFocusTrapDirective],\n})\nexport class TuiFocusTrapModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAiBA;;IAUI,+BACuC,WAAqB,EAEvC,UAAmC,EAChB,QAAmB;QAJ3D,iBAeC;QAdsC,gBAAW,GAAX,WAAW,CAAU;QAEvC,eAAU,GAAV,UAAU,CAAyB;QAChB,aAAQ,GAAR,QAAQ,CAAW;QAN1C,kBAAa,GAAG,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;;;;;;;QAchE,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC;YACnB,gBAAgB,CAAC,KAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;SACnD,CAAC,CAAC;KACN;IAGD,sCAAM,GAAN;QACI,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC;KAC5E;IAGD,yCAAS,GAAT,UAAU,IAAU;QAChB,IAAI,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,IAAI,CAAC,EAAE;YACtD,OAAO;SACV;QAED,IAAM,SAAS,GAAG,mBAAmB,CACjC,IAAI,CAAC,UAAU,CAAC,aAAa,EAC7B,KAAK,EACL,IAAI,CAAC,UAAU,CAAC,aAAa,CAChC,CAAC;QAEF,IAAI,SAAS,EAAE;YACX,gBAAgB,CAAC,SAAS,CAAC,CAAC;SAC/B;KACJ;IAED,2CAAW,GAAX;QAAA,iBAgBC;QAfG,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;;;;;;;;QASpC,OAAO,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC;;YAEnB,IAAI,KAAI,CAAC,aAAa,YAAY,WAAW,EAAE;gBAC3C,gBAAgB,CAAC,KAAI,CAAC,aAAa,CAAC,CAAC;aACxC;SACJ,CAAC,CAAC;KACN;;gBAtDmD,QAAQ,uBAAvD,MAAM,SAAC,QAAQ;gBAEa,UAAU,uBADtC,MAAM,SAAC,UAAU;gBAE4B,SAAS,uBAAtD,MAAM,SAAC,SAAS;;IAcrB;QADC,YAAY,CAAC,MAAM,CAAC;uDAGpB;IAGD;QADC,YAAY,CAAC,uBAAuB,EAAE,CAAC,eAAe,CAAC,CAAC;0DAexD;IAxCQ,qBAAqB;QANjC,SAAS,CAAC;YACP,QAAQ,EAAE,gBAAgB;YAC1B,IAAI,EAAE;gBACF,QAAQ,EAAE,GAAG;aAChB;SACJ,CAAC;QAKO,WAAA,MAAM,CAAC,QAAQ,CAAC,CAAA;QAChB,WAAA,MAAM,CAAC,UAAU,CAAC,CAAA;QAElB,WAAA,MAAM,CAAC,SAAS,CAAC,CAAA;OAPb,qBAAqB,CA2DjC;IAAD,4BAAC;CA3DD;;;IChBA;KAAkC;IAArB,kBAAkB;QAJ9B,QAAQ,CAAC;YACN,YAAY,EAAE,CAAC,qBAAqB,CAAC;YACrC,OAAO,EAAE,CAAC,qBAAqB,CAAC;SACnC,CAAC;OACW,kBAAkB,CAAG;IAAD,yBAAC;CAAlC;;ACRA;;;;;;"}

package/fesm5/taiga-ui-cdk-directives-for-async.js

@@ -0,0 +1,73 @@
+import { __decorate, __param } from 'tslib';
+import { ViewContainerRef, Inject, TemplateRef, Input, Directive, NgModule } from '@angular/core';
+import { Subject, from, of } from 'rxjs';
+import { concatMap, delay, takeUntil } from 'rxjs/operators';
+
+var TuiForAsyncDirective = /** @class */ (function () {
+    function TuiForAsyncDirective(view, template) {
+        this.view = view;
+        this.template = template;
+        this.destroy$ = new Subject();
+        this.tuiForAsyncTimeout = 10;
+    }
+    TuiForAsyncDirective.prototype.ngOnChanges = function () {
+        this.clearViewForOldNodes();
+        this.createAsyncViewForNewNodes();
+    };
+    TuiForAsyncDirective.prototype.ngOnDestroy = function () {
+        this.clearViewForOldNodes();
+        this.destroy$.complete();
+    };
+    TuiForAsyncDirective.prototype.createAsyncViewForNewNodes = function () {
+        var _this = this;
+        from(this.tuiForAsyncOf || [])
+            .pipe(concatMap(function (item) { return of(item).pipe(delay(_this.tuiForAsyncTimeout)); }), takeUntil(this.destroy$))
+            .subscribe(function (item) {
+            return _this.view
+                .createEmbeddedView(_this.template, { $implicit: item })
+                .detectChanges();
+        });
+    };
+    TuiForAsyncDirective.prototype.clearViewForOldNodes = function () {
+        this.destroy$.next();
+        this.view.clear();
+    };
+    TuiForAsyncDirective.ctorParameters = function () { return [
+        { type: ViewContainerRef, decorators: [{ type: Inject, args: [ViewContainerRef,] }] },
+        { type: TemplateRef, decorators: [{ type: Inject, args: [TemplateRef,] }] }
+    ]; };
+    __decorate([
+        Input()
+    ], TuiForAsyncDirective.prototype, "tuiForAsyncOf", void 0);
+    __decorate([
+        Input()
+    ], TuiForAsyncDirective.prototype, "tuiForAsyncTimeout", void 0);
+    TuiForAsyncDirective = __decorate([
+        Directive({ selector: '[tuiForAsync][tuiForAsyncOf]' }),
+        __param(0, Inject(ViewContainerRef)),
+        __param(1, Inject(TemplateRef))
+    ], TuiForAsyncDirective);
+    return TuiForAsyncDirective;
+}());
+
+/**
+ * @experimental
+ */
+var TuiForAsyncModule = /** @class */ (function () {
+    function TuiForAsyncModule() {
+    }
+    TuiForAsyncModule = __decorate([
+        NgModule({
+            declarations: [TuiForAsyncDirective],
+            exports: [TuiForAsyncDirective],
+        })
+    ], TuiForAsyncModule);
+    return TuiForAsyncModule;
+}());
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TuiForAsyncDirective, TuiForAsyncModule };
+//# sourceMappingURL=taiga-ui-cdk-directives-for-async.js.map

package/fesm5/taiga-ui-cdk-directives-for-async.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"taiga-ui-cdk-directives-for-async.js","sources":["ng://@taiga-ui/cdk/directives/for-async/for-async.directive.ts","ng://@taiga-ui/cdk/directives/for-async/for-async.module.ts","ng://@taiga-ui/cdk/directives/for-async/taiga-ui-cdk-directives-for-async.ts"],"sourcesContent":["import {\n    Directive,\n    Inject,\n    Input,\n    OnChanges,\n    OnDestroy,\n    TemplateRef,\n    ViewContainerRef,\n} from '@angular/core';\nimport {from, of, Subject} from 'rxjs';\nimport {concatMap, delay, takeUntil} from 'rxjs/operators';\n\n@Directive({selector: '[tuiForAsync][tuiForAsyncOf]'})\nexport class TuiForAsyncDirective<T> implements OnChanges, OnDestroy {\n    private readonly destroy$ = new Subject<void>();\n\n    @Input()\n    tuiForAsyncOf: readonly T[] | undefined | null;\n\n    @Input()\n    tuiForAsyncTimeout = 10;\n\n    constructor(\n        @Inject(ViewContainerRef) private readonly view: ViewContainerRef,\n        @Inject(TemplateRef) private readonly template: TemplateRef<unknown>,\n    ) {}\n\n    ngOnChanges(): void {\n        this.clearViewForOldNodes();\n        this.createAsyncViewForNewNodes();\n    }\n\n    ngOnDestroy(): void {\n        this.clearViewForOldNodes();\n        this.destroy$.complete();\n    }\n\n    private createAsyncViewForNewNodes(): void {\n        from(this.tuiForAsyncOf || [])\n            .pipe(\n                concatMap(item => of(item).pipe(delay(this.tuiForAsyncTimeout))),\n                takeUntil(this.destroy$),\n            )\n            .subscribe(item =>\n                this.view\n                    .createEmbeddedView(this.template, {$implicit: item})\n                    .detectChanges(),\n            );\n    }\n\n    private clearViewForOldNodes(): void {\n        this.destroy$.next();\n        this.view.clear();\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiForAsyncDirective} from './for-async.directive';\n\n/**\n * @experimental\n */\n@NgModule({\n    declarations: [TuiForAsyncDirective],\n    exports: [TuiForAsyncDirective],\n})\nexport class TuiForAsyncModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;IAsBI,8BAC+C,IAAsB,EAC3B,QAA8B;QADzB,SAAI,GAAJ,IAAI,CAAkB;QAC3B,aAAQ,GAAR,QAAQ,CAAsB;QAVvD,aAAQ,GAAG,IAAI,OAAO,EAAQ,CAAC;QAMhD,uBAAkB,GAAG,EAAE,CAAC;KAKpB;IAEJ,0CAAW,GAAX;QACI,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,0BAA0B,EAAE,CAAC;KACrC;IAED,0CAAW,GAAX;QACI,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC;KAC5B;IAEO,yDAA0B,GAAlC;QAAA,iBAWC;QAVG,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC;aACzB,IAAI,CACD,SAAS,CAAC,UAAA,IAAI,IAAI,OAAA,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAI,CAAC,kBAAkB,CAAC,CAAC,GAAA,CAAC,EAChE,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAC3B;aACA,SAAS,CAAC,UAAA,IAAI;YACX,OAAA,KAAI,CAAC,IAAI;iBACJ,kBAAkB,CAAC,KAAI,CAAC,QAAQ,EAAE,EAAC,SAAS,EAAE,IAAI,EAAC,CAAC;iBACpD,aAAa,EAAE;SAAA,CACvB,CAAC;KACT;IAEO,mDAAoB,GAA5B;QACI,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;QACrB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;KACrB;;gBA9BoD,gBAAgB,uBAAhE,MAAM,SAAC,gBAAgB;gBACwB,WAAW,uBAA1D,MAAM,SAAC,WAAW;;IAPvB;QADC,KAAK,EAAE;+DACuC;IAG/C;QADC,KAAK,EAAE;oEACgB;IAPf,oBAAoB;QADhC,SAAS,CAAC,EAAC,QAAQ,EAAE,8BAA8B,EAAC,CAAC;QAW7C,WAAA,MAAM,CAAC,gBAAgB,CAAC,CAAA;QACxB,WAAA,MAAM,CAAC,WAAW,CAAC,CAAA;OAXf,oBAAoB,CAyChC;IAAD,2BAAC;CAzCD;;ACTA;;;;IAOA;KAAiC;IAApB,iBAAiB;QAJ7B,QAAQ,CAAC;YACN,YAAY,EAAE,CAAC,oBAAoB,CAAC;YACpC,OAAO,EAAE,CAAC,oBAAoB,CAAC;SAClC,CAAC;OACW,iBAAiB,CAAG;IAAD,wBAAC;CAAjC;;ACXA;;;;;;"}

package/fesm5/taiga-ui-cdk-directives-item.js

@@ -3,7 +3,7 @@ import { Directive, NgModule } from '@angular/core';
 
 /**
  * Blank directive to query for {@link TemplateRef}
- * TODO: Migrate everything to this directive
+ * TODO: 3.0 Migrate everything to this directive
  */
 var TuiItemDirective = /** @class */ (function () {
     function TuiItemDirective() {

package/fesm5/taiga-ui-cdk-directives-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-cdk-directives-item.js","sources":["ng://@taiga-ui/cdk/directives/item/item.directive.ts","ng://@taiga-ui/cdk/directives/item/item.module.ts","ng://@taiga-ui/cdk/directives/item/taiga-ui-cdk-directives-item.ts"],"sourcesContent":["import {Directive} from '@angular/core';\n\n/**\n * Blank directive to query for {@link TemplateRef}\n * TODO: Migrate everything to this directive\n */\n@Directive({\n    selector: 'ng-template[tuiItem]',\n})\nexport class TuiItemDirective {}\n","import {NgModule} from '@angular/core';\n\nimport {TuiItemDirective} from './item.directive';\n\n@NgModule({\n    declarations: [TuiItemDirective],\n    exports: [TuiItemDirective],\n})\nexport class TuiItemModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;;;;;IAOA;KAAgC;IAAnB,gBAAgB;QAH5B,SAAS,CAAC;YACP,QAAQ,EAAE,sBAAsB;SACnC,CAAC;OACW,gBAAgB,CAAG;IAAD,uBAAC;CAAhC;;;ICDA;KAA6B;IAAhB,aAAa;QAJzB,QAAQ,CAAC;YACN,YAAY,EAAE,CAAC,gBAAgB,CAAC;YAChC,OAAO,EAAE,CAAC,gBAAgB,CAAC;SAC9B,CAAC;OACW,aAAa,CAAG;IAAD,oBAAC;CAA7B;;ACRA;;;;;;"}
+{"version":3,"file":"taiga-ui-cdk-directives-item.js","sources":["ng://@taiga-ui/cdk/directives/item/item.directive.ts","ng://@taiga-ui/cdk/directives/item/item.module.ts","ng://@taiga-ui/cdk/directives/item/taiga-ui-cdk-directives-item.ts"],"sourcesContent":["import {Directive} from '@angular/core';\n\n/**\n * Blank directive to query for {@link TemplateRef}\n * TODO: 3.0 Migrate everything to this directive\n */\n@Directive({\n    selector: 'ng-template[tuiItem]',\n})\nexport class TuiItemDirective {}\n","import {NgModule} from '@angular/core';\n\nimport {TuiItemDirective} from './item.directive';\n\n@NgModule({\n    declarations: [TuiItemDirective],\n    exports: [TuiItemDirective],\n})\nexport class TuiItemModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;;;;;IAOA;KAAgC;IAAnB,gBAAgB;QAH5B,SAAS,CAAC;YACP,QAAQ,EAAE,sBAAsB;SACnC,CAAC;OACW,gBAAgB,CAAG;IAAD,uBAAC;CAAhC;;;ICDA;KAA6B;IAAhB,aAAa;QAJzB,QAAQ,CAAC;YACN,YAAY,EAAE,CAAC,gBAAgB,CAAC;YAChC,OAAO,EAAE,CAAC,gBAAgB,CAAC;SAC9B,CAAC;OACW,aAAa,CAAG;IAAD,oBAAC;CAA7B;;ACRA;;;;;;"}

package/fesm5/taiga-ui-cdk-directives-media.js

@@ -45,6 +45,7 @@ var TuiMediaDirective = /** @class */ (function () {
                 this.elementRef.nativeElement.pause();
             }
             else {
+                // eslint-disable-next-line @typescript-eslint/no-floating-promises
                 this.elementRef.nativeElement.play();
                 this.updatePlaybackRate(this.playbackRate);
             }

package/fesm5/taiga-ui-cdk-directives-media.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-cdk-directives-media.js","sources":["ng://@taiga-ui/cdk/directives/media/media.directive.ts","ng://@taiga-ui/cdk/directives/media/media.module.ts","ng://@taiga-ui/cdk/directives/media/taiga-ui-cdk-directives-media.ts"],"sourcesContent":["import {\n    Directive,\n    ElementRef,\n    EventEmitter,\n    HostBinding,\n    HostListener,\n    Inject,\n    Input,\n    Output,\n} from '@angular/core';\nimport {tuiDefaultProp, tuiRequiredSetter} from '@taiga-ui/cdk/decorators';\n\nexport function nonNegativeFiniteAssertion(value: number): boolean {\n    return isFinite(value) && value >= 0;\n}\n\nexport function volumeAssertion(volume: number): boolean {\n    return isFinite(volume) && volume >= 0 && volume <= 1;\n}\n\n@Directive({\n    selector: 'video[tuiMedia], audio[tuiMedia]',\n    exportAs: 'tuiMedia',\n})\nexport class TuiMediaDirective {\n    private playbackRate = 1;\n\n    @Input()\n    @HostBinding('volume')\n    @tuiDefaultProp(volumeAssertion)\n    volume = 1;\n\n    @Input('playbackRate')\n    @tuiRequiredSetter(nonNegativeFiniteAssertion)\n    set playbackRateSetter(playbackRate: number) {\n        this.updatePlaybackRate(playbackRate);\n    }\n\n    @Input()\n    @tuiRequiredSetter(nonNegativeFiniteAssertion)\n    set currentTime(currentTime: number) {\n        if (Math.abs(currentTime - this.currentTime) > 0.05) {\n            this.elementRef.nativeElement.currentTime = currentTime;\n        }\n    }\n\n    @Input()\n    set paused(paused: boolean) {\n        if (paused) {\n            this.elementRef.nativeElement.pause();\n        } else {\n            this.elementRef.nativeElement.play();\n            this.updatePlaybackRate(this.playbackRate);\n        }\n    }\n\n    @Output()\n    readonly currentTimeChange = new EventEmitter<number>();\n\n    @Output()\n    readonly pausedChange = new EventEmitter<boolean>();\n\n    @Output()\n    readonly volumeChange = new EventEmitter<number>();\n\n    constructor(\n        @Inject(ElementRef)\n        private readonly elementRef: ElementRef<HTMLMediaElement>,\n    ) {}\n\n    get paused(): boolean {\n        return this.elementRef.nativeElement.paused;\n    }\n\n    get currentTime(): number {\n        return this.elementRef.nativeElement.currentTime;\n    }\n\n    // @bad TODO: Make sure no other events can affect this like network issues etc.\n    @HostListener('ended', ['true'])\n    @HostListener('pause', ['true'])\n    @HostListener('play', ['false'])\n    onPausedChange(paused: boolean): void {\n        this.pausedChange.emit(paused);\n        this.updatePlaybackRate(this.playbackRate);\n    }\n\n    @HostListener('volumechange')\n    onVolumeChange(): void {\n        this.volume = this.elementRef.nativeElement.volume;\n        this.volumeChange.emit(this.volume);\n    }\n\n    @HostListener('timeupdate')\n    @HostListener('seeking')\n    @HostListener('seeked')\n    onCurrentTimeChange(): void {\n        this.currentTimeChange.emit(this.currentTime);\n    }\n\n    @HostListener('durationchange')\n    changeDetectionTrigger(): void {\n        // @bad TODO: consider if other events need to trigger CD\n    }\n\n    private updatePlaybackRate(playbackRate: number): void {\n        this.playbackRate = playbackRate;\n        this.elementRef.nativeElement.playbackRate = this.playbackRate;\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiMediaDirective} from './media.directive';\n\n@NgModule({\n    declarations: [TuiMediaDirective],\n    exports: [TuiMediaDirective],\n})\nexport class TuiMediaModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"taiga-ui-cdk-directives-media.js","sources":["ng://@taiga-ui/cdk/directives/media/media.directive.ts","ng://@taiga-ui/cdk/directives/media/media.module.ts","ng://@taiga-ui/cdk/directives/media/taiga-ui-cdk-directives-media.ts"],"sourcesContent":["import {\n    Directive,\n    ElementRef,\n    EventEmitter,\n    HostBinding,\n    HostListener,\n    Inject,\n    Input,\n    Output,\n} from '@angular/core';\nimport {tuiDefaultProp, tuiRequiredSetter} from '@taiga-ui/cdk/decorators';\n\nexport function nonNegativeFiniteAssertion(value: number): boolean {\n    return isFinite(value) && value >= 0;\n}\n\nexport function volumeAssertion(volume: number): boolean {\n    return isFinite(volume) && volume >= 0 && volume <= 1;\n}\n\n@Directive({\n    selector: 'video[tuiMedia], audio[tuiMedia]',\n    exportAs: 'tuiMedia',\n})\nexport class TuiMediaDirective {\n    private playbackRate = 1;\n\n    @Input()\n    @HostBinding('volume')\n    @tuiDefaultProp(volumeAssertion)\n    volume = 1;\n\n    @Input('playbackRate')\n    @tuiRequiredSetter(nonNegativeFiniteAssertion)\n    set playbackRateSetter(playbackRate: number) {\n        this.updatePlaybackRate(playbackRate);\n    }\n\n    @Input()\n    @tuiRequiredSetter(nonNegativeFiniteAssertion)\n    set currentTime(currentTime: number) {\n        if (Math.abs(currentTime - this.currentTime) > 0.05) {\n            this.elementRef.nativeElement.currentTime = currentTime;\n        }\n    }\n\n    @Input()\n    set paused(paused: boolean) {\n        if (paused) {\n            this.elementRef.nativeElement.pause();\n        } else {\n            // eslint-disable-next-line @typescript-eslint/no-floating-promises\n            this.elementRef.nativeElement.play();\n            this.updatePlaybackRate(this.playbackRate);\n        }\n    }\n\n    @Output()\n    readonly currentTimeChange = new EventEmitter<number>();\n\n    @Output()\n    readonly pausedChange = new EventEmitter<boolean>();\n\n    @Output()\n    readonly volumeChange = new EventEmitter<number>();\n\n    constructor(\n        @Inject(ElementRef)\n        private readonly elementRef: ElementRef<HTMLMediaElement>,\n    ) {}\n\n    get paused(): boolean {\n        return this.elementRef.nativeElement.paused;\n    }\n\n    get currentTime(): number {\n        return this.elementRef.nativeElement.currentTime;\n    }\n\n    // @bad TODO: Make sure no other events can affect this like network issues etc.\n    @HostListener('ended', ['true'])\n    @HostListener('pause', ['true'])\n    @HostListener('play', ['false'])\n    onPausedChange(paused: boolean): void {\n        this.pausedChange.emit(paused);\n        this.updatePlaybackRate(this.playbackRate);\n    }\n\n    @HostListener('volumechange')\n    onVolumeChange(): void {\n        this.volume = this.elementRef.nativeElement.volume;\n        this.volumeChange.emit(this.volume);\n    }\n\n    @HostListener('timeupdate')\n    @HostListener('seeking')\n    @HostListener('seeked')\n    onCurrentTimeChange(): void {\n        this.currentTimeChange.emit(this.currentTime);\n    }\n\n    @HostListener('durationchange')\n    changeDetectionTrigger(): void {\n        // @bad TODO: consider if other events need to trigger CD\n    }\n\n    private updatePlaybackRate(playbackRate: number): void {\n        this.playbackRate = playbackRate;\n        this.elementRef.nativeElement.playbackRate = this.playbackRate;\n    }\n}\n","import {NgModule} from '@angular/core';\n\nimport {TuiMediaDirective} from './media.directive';\n\n@NgModule({\n    declarations: [TuiMediaDirective],\n    exports: [TuiMediaDirective],\n})\nexport class TuiMediaModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm5/taiga-ui-cdk-directives.js

@@ -10,6 +10,7 @@ export * from '@taiga-ui/cdk/directives/focus-visible';
 export * from '@taiga-ui/cdk/directives/focusable';
 export * from '@taiga-ui/cdk/directives/focused';
 export * from '@taiga-ui/cdk/directives/for';
+export * from '@taiga-ui/cdk/directives/for-async';
 export * from '@taiga-ui/cdk/directives/high-dpi';
 export * from '@taiga-ui/cdk/directives/hovered';
 export * from '@taiga-ui/cdk/directives/input-mode';

package/fesm5/taiga-ui-cdk-directives.js.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-cdk-directives.js","sources":["ng://@taiga-ui/cdk/directives/taiga-ui-cdk-directives.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;"}
+{"version":3,"file":"taiga-ui-cdk-directives.js","sources":["ng://@taiga-ui/cdk/directives/taiga-ui-cdk-directives.ts"],"sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;"}

package/fesm5/taiga-ui-cdk-observables.js

@@ -105,7 +105,7 @@ function preventDefault() {
 
 /**
  * Turns AbstractControl/Abstract-control-directive valueChanges into ReplaySubject(1)
- * TODO: rename function in 3.0. The name should be shorter.
+ * TODO: 3.0 name should be shorter.
  */
 function tuiReplayedValueChangesFrom(control) {
     return new Observable(function (subscriber) {