@taiga-ui/core 4.52.0-canary.a4e325d → 4.52.0-canary.a59c4d0

package/fesm2022/taiga-ui-core-components-error.mjs

@@ -1,40 +1,123 @@
-import { NgIf } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, Input, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, computed, input, ChangeDetectionStrategy, Component, isSignal, Directive, TemplateRef, untracked, Pipe } from '@angular/core';
 import { toSignal } from '@angular/core/rxjs-interop';
 import { TuiValidationError } from '@taiga-ui/cdk/classes';
 import { TuiAnimated } from '@taiga-ui/cdk/directives/animated';
-import { tuiIsString } from '@taiga-ui/cdk/utils/miscellaneous';
-import { TUI_ANIMATIONS_SPEED, TUI_DEFAULT_ERROR_MESSAGE } from '@taiga-ui/core/tokens';
-import { tuiToAnimationOptions } from '@taiga-ui/core/utils';
-import { PolymorpheusOutlet } from '@taiga-ui/polymorpheus';
+import { tuiIsString, tuiDirectiveBinding, tuiProvide, tuiSetSignal } from '@taiga-ui/cdk/utils/miscellaneous';
+import { TUI_DEFAULT_ERROR_MESSAGE, TUI_VALIDATION_ERRORS } from '@taiga-ui/core/tokens';
+import { PolymorpheusOutlet, PolymorpheusTemplate, PolymorpheusComponent } from '@taiga-ui/polymorpheus';
+import { NG_VALUE_ACCESSOR, NG_VALIDATORS, NgControl } from '@angular/forms';
+import { Subject, distinctUntilChanged, switchMap, startWith, map } from 'rxjs';
 
-class TuiError {
+class TuiErrorComponent {
     constructor() {
-        this.options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED));
-        this.error = null;
-        this.visible = true;
         this.default = toSignal(inject(TUI_DEFAULT_ERROR_MESSAGE));
+        this.content = computed((error = this.error()) => tuiIsString(error) ? new TuiValidationError(error) : error);
+        this.error = input(null);
     }
-    set errorSetter(error) {
-        this.error = tuiIsString(error) ? new TuiValidationError(error) : error;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiError, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.9", type: TuiError, isStandalone: true, selector: "tui-error", inputs: { errorSetter: ["error", "errorSetter"] }, host: { properties: { "class._error": "error" } }, ngImport: i0, template: "<div\n    *ngIf=\"error\"\n    automation-id=\"tui-error__text\"\n    tuiAnimated\n    class=\"t-message-text\"\n>\n    <ng-container *polymorpheusOutlet=\"error.message || default() as text; context: error.context || {}\">\n        {{ text }}\n    </ng-container>\n</div>\n", styles: [":host{transition-property:grid-template-rows;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:grid;font:var(--tui-font-text-s);color:var(--tui-text-negative);overflow-wrap:break-word;grid-template-rows:0fr}:host._error{grid-template-rows:1fr}.t-message-text{white-space:pre-line;grid-row:1 / span 2;overflow:hidden}.t-message-text.tui-enter,.t-message-text.tui-leave{animation-name:tuiFade}.t-message-text:before{content:\"\";line-height:1.5rem;vertical-align:bottom}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiAnimated, selector: "[tuiAnimated]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TuiErrorComponent, isStandalone: true, selector: "tui-error", inputs: { error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class._error": "content()" } }, ngImport: i0, template: "@if (content(); as error) {\n    <span\n        tuiAnimated\n        class=\"t-message-text\"\n    >\n        <span\n            *polymorpheusOutlet=\"error.message || default() as text; context: error.context || {}\"\n            [innerHTML]=\"text\"\n        ></span>\n    </span>\n}\n", styles: [":host{transition-property:grid-template-rows;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:grid;font:var(--tui-font-text-s);color:var(--tui-text-negative);overflow-wrap:break-word;grid-template-rows:0fr}:host._error{grid-template-rows:1fr}.t-message-text{white-space:pre-line;grid-area:1 / 1 / span 2;overflow:hidden}.t-message-text.tui-enter,.t-message-text.tui-leave{animation-name:tuiFade}.t-message-text:before{content:\"\";line-height:1.5rem;vertical-align:bottom}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiAnimated, selector: "[tuiAnimated]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiError, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tui-error', imports: [NgIf, PolymorpheusOutlet, TuiAnimated], changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        '[class._error]': 'error',
-                    }, template: "<div\n    *ngIf=\"error\"\n    automation-id=\"tui-error__text\"\n    tuiAnimated\n    class=\"t-message-text\"\n>\n    <ng-container *polymorpheusOutlet=\"error.message || default() as text; context: error.context || {}\">\n        {{ text }}\n    </ng-container>\n</div>\n", styles: [":host{transition-property:grid-template-rows;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:grid;font:var(--tui-font-text-s);color:var(--tui-text-negative);overflow-wrap:break-word;grid-template-rows:0fr}:host._error{grid-template-rows:1fr}.t-message-text{white-space:pre-line;grid-row:1 / span 2;overflow:hidden}.t-message-text.tui-enter,.t-message-text.tui-leave{animation-name:tuiFade}.t-message-text:before{content:\"\";line-height:1.5rem;vertical-align:bottom}\n"] }]
-        }], propDecorators: { errorSetter: [{
-                type: Input,
-                args: ['error']
-            }] } });
+            args: [{ selector: 'tui-error', imports: [PolymorpheusOutlet, TuiAnimated], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class._error]': 'content()',
+                    }, template: "@if (content(); as error) {\n    <span\n        tuiAnimated\n        class=\"t-message-text\"\n    >\n        <span\n            *polymorpheusOutlet=\"error.message || default() as text; context: error.context || {}\"\n            [innerHTML]=\"text\"\n        ></span>\n    </span>\n}\n", styles: [":host{transition-property:grid-template-rows;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:grid;font:var(--tui-font-text-s);color:var(--tui-text-negative);overflow-wrap:break-word;grid-template-rows:0fr}:host._error{grid-template-rows:1fr}.t-message-text{white-space:pre-line;grid-area:1 / 1 / span 2;overflow:hidden}.t-message-text.tui-enter,.t-message-text.tui-leave{animation-name:tuiFade}.t-message-text:before{content:\"\";line-height:1.5rem;vertical-align:bottom}\n"] }]
+        }] });
+
+class TuiErrorDirective {
+    constructor() {
+        this.content = inject(TUI_VALIDATION_ERRORS);
+        this.control = new Subject();
+        this.errors = toSignal(this.control.pipe(distinctUntilChanged(), switchMap((control) => control.events.pipe(startWith(null), map(() => control.invalid && control.touched && control.errors)))));
+        this.key = computed((errors = this.errors() || {}) => this.order().find((id) => errors[id]) || Object.keys(errors)[0] || '');
+        this.order = input([]);
+        this.error = tuiDirectiveBinding(TuiErrorComponent, 'error', computed((errors = this.errors() || null) => errors && this.getError(errors[this.key()], this.content[this.key()])), { self: true, optional: true });
+    }
+    registerOnChange() { }
+    registerOnTouched() { }
+    writeValue() { }
+    validate(control) {
+        this.control.next(control);
+        return null;
+    }
+    getError(context, content) {
+        context = isSignal(context) ? context() : context;
+        if (context instanceof TuiValidationError) {
+            return context;
+        }
+        if (content === undefined && isContent(context)) {
+            return getError(context);
+        }
+        if (isSignal(content)) {
+            return getError(content(), context);
+        }
+        if (content instanceof Function) {
+            const message = content(context);
+            return getError(isSignal(message) ? message() : message, context);
+        }
+        return getError(content, context);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: TuiErrorDirective, isStandalone: true, selector: "tui-error[ngModel], tui-error[formControlName], tui-error[formControl], tui-error[formGroup], tui-error[formGroupName], tui-error[formArrayName]", inputs: { order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            tuiProvide(NG_VALUE_ACCESSOR, TuiErrorDirective, true),
+            tuiProvide(NG_VALIDATORS, TuiErrorDirective, true),
+        ], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'tui-error[ngModel], tui-error[formControlName], tui-error[formControl], tui-error[formGroup], tui-error[formGroupName], tui-error[formArrayName]',
+                    providers: [
+                        tuiProvide(NG_VALUE_ACCESSOR, TuiErrorDirective, true),
+                        tuiProvide(NG_VALIDATORS, TuiErrorDirective, true),
+                    ],
+                }]
+        }] });
+function getError(content = '', context) {
+    return new TuiValidationError(content, context);
+}
+function isContent(value) {
+    return (tuiIsString(value) ||
+        value instanceof TemplateRef ||
+        value instanceof PolymorpheusTemplate ||
+        value instanceof PolymorpheusComponent);
+}
+
+class TuiErrorPipe {
+    constructor() {
+        this.control = inject(NgControl);
+        this.directive = new TuiErrorDirective();
+    }
+    transform(order) {
+        untracked(() => {
+            this.directive.validate(this.control.control);
+            tuiSetSignal(this.directive.order, order);
+        });
+        const error = this.directive.error();
+        if (!error) {
+            return '';
+        }
+        return typeof error.message === 'function'
+            ? error.message(error.context)
+            : error.message;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorPipe, isStandalone: true, name: "tuiError", pure: false }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiErrorPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'tuiError',
+                    pure: false,
+                }]
+        }] });
+
+const TuiError = [TuiErrorComponent, TuiErrorDirective, TuiErrorPipe];
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { TuiError };
+export { TuiError, TuiErrorComponent, TuiErrorDirective, TuiErrorPipe };
 //# sourceMappingURL=taiga-ui-core-components-error.mjs.map

package/fesm2022/taiga-ui-core-components-error.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-core-components-error.mjs","sources":["../../../projects/core/components/error/error.component.ts","../../../projects/core/components/error/error.template.html","../../../projects/core/components/error/taiga-ui-core-components-error.ts"],"sourcesContent":["import {NgIf} from '@angular/common';\nimport {ChangeDetectionStrategy, Component, inject, Input} from '@angular/core';\nimport {toSignal} from '@angular/core/rxjs-interop';\nimport {TuiValidationError} from '@taiga-ui/cdk/classes';\nimport {TuiAnimated} from '@taiga-ui/cdk/directives/animated';\nimport {tuiIsString} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_ANIMATIONS_SPEED, TUI_DEFAULT_ERROR_MESSAGE} from '@taiga-ui/core/tokens';\nimport {tuiToAnimationOptions} from '@taiga-ui/core/utils';\nimport {PolymorpheusOutlet} from '@taiga-ui/polymorpheus';\n\n@Component({\n    selector: 'tui-error',\n    imports: [NgIf, PolymorpheusOutlet, TuiAnimated],\n    templateUrl: './error.template.html',\n    styleUrls: ['./error.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[class._error]': 'error',\n    },\n})\nexport class TuiError {\n    protected readonly options = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED));\n    protected error: TuiValidationError | null = null;\n    protected visible = true;\n    protected readonly default = toSignal(inject(TUI_DEFAULT_ERROR_MESSAGE));\n\n    @Input('error')\n    public set errorSetter(error: TuiValidationError | string | null) {\n        this.error = tuiIsString(error) ? new TuiValidationError(error) : error;\n    }\n}\n","<div\n    *ngIf=\"error\"\n    automation-id=\"tui-error__text\"\n    tuiAnimated\n    class=\"t-message-text\"\n>\n    <ng-container *polymorpheusOutlet=\"error.message || default() as text; context: error.context || {}\">\n        {{ text }}\n    </ng-container>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;MAoBa,QAAQ,CAAA;AAVrB,IAAA,WAAA,GAAA;QAWuB,IAAA,CAAA,OAAO,GAAG,qBAAqB,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;QACtE,IAAA,CAAA,KAAK,GAA8B,IAAI;QACvC,IAAA,CAAA,OAAO,GAAG,IAAI;QACL,IAAA,CAAA,OAAO,GAAG,QAAQ,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC;AAM3E,IAAA;IAJG,IACW,WAAW,CAAC,KAAyC,EAAA;AAC5D,QAAA,IAAI,CAAC,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,IAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG,KAAK;IAC3E;8GATS,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAR,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,QAAQ,2KCpBrB,oRAUA,EAAA,MAAA,EAAA,CAAA,kgBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDEc,IAAI,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,kBAAkB,8HAAE,WAAW,EAAA,QAAA,EAAA,eAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAQtC,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAVpB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAAA,OAAA,EACZ,CAAC,IAAI,EAAE,kBAAkB,EAAE,WAAW,CAAC,EAAA,eAAA,EAG/B,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACF,wBAAA,gBAAgB,EAAE,OAAO;AAC5B,qBAAA,EAAA,QAAA,EAAA,oRAAA,EAAA,MAAA,EAAA,CAAA,kgBAAA,CAAA,EAAA;8BASU,WAAW,EAAA,CAAA;sBADrB,KAAK;uBAAC,OAAO;;;AE1BlB;;AAEG;;;;"}
+{"version":3,"file":"taiga-ui-core-components-error.mjs","sources":["../../../projects/core/components/error/error.component.ts","../../../projects/core/components/error/error.template.html","../../../projects/core/components/error/error.directive.ts","../../../projects/core/components/error/error.pipe.ts","../../../projects/core/components/error/error.ts","../../../projects/core/components/error/taiga-ui-core-components-error.ts"],"sourcesContent":["import {ChangeDetectionStrategy, Component, computed, inject, input} from '@angular/core';\nimport {toSignal} from '@angular/core/rxjs-interop';\nimport {TuiValidationError} from '@taiga-ui/cdk/classes';\nimport {TuiAnimated} from '@taiga-ui/cdk/directives/animated';\nimport {tuiIsString} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_DEFAULT_ERROR_MESSAGE} from '@taiga-ui/core/tokens';\nimport {PolymorpheusOutlet} from '@taiga-ui/polymorpheus';\n\n@Component({\n    selector: 'tui-error',\n    imports: [PolymorpheusOutlet, TuiAnimated],\n    templateUrl: './error.template.html',\n    styleUrl: './error.style.less',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[class._error]': 'content()',\n    },\n})\nexport class TuiErrorComponent {\n    protected readonly default = toSignal(inject(TUI_DEFAULT_ERROR_MESSAGE));\n    protected readonly content = computed((error = this.error()) =>\n        tuiIsString(error) ? new TuiValidationError(error) : error,\n    );\n\n    public readonly error = input<TuiValidationError | string | null>(null);\n}\n","@if (content(); as error) {\n    <span\n        tuiAnimated\n        class=\"t-message-text\"\n    >\n        <span\n            *polymorpheusOutlet=\"error.message || default() as text; context: error.context || {}\"\n            [innerHTML]=\"text\"\n        ></span>\n    </span>\n}\n","import {\n    computed,\n    Directive,\n    inject,\n    input,\n    isSignal,\n    type Signal,\n    TemplateRef,\n} from '@angular/core';\nimport {toSignal} from '@angular/core/rxjs-interop';\nimport {\n    type AbstractControl,\n    type ControlValueAccessor,\n    NG_VALIDATORS,\n    NG_VALUE_ACCESSOR,\n    type ValidationErrors,\n    type Validator,\n} from '@angular/forms';\nimport {TuiValidationError} from '@taiga-ui/cdk/classes';\nimport {\n    tuiDirectiveBinding,\n    tuiIsString,\n    tuiProvide,\n} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_VALIDATION_ERRORS} from '@taiga-ui/core/tokens';\nimport {\n    PolymorpheusComponent,\n    type PolymorpheusContent,\n    PolymorpheusTemplate,\n} from '@taiga-ui/polymorpheus';\nimport {distinctUntilChanged, map, startWith, Subject, switchMap} from 'rxjs';\n\nimport {TuiErrorComponent} from './error.component';\n\n@Directive({\n    selector:\n        'tui-error[ngModel], tui-error[formControlName], tui-error[formControl], tui-error[formGroup], tui-error[formGroupName], tui-error[formArrayName]',\n    providers: [\n        tuiProvide(NG_VALUE_ACCESSOR, TuiErrorDirective, true),\n        tuiProvide(NG_VALIDATORS, TuiErrorDirective, true),\n    ],\n})\nexport class TuiErrorDirective implements ControlValueAccessor, Validator {\n    private readonly content = inject(TUI_VALIDATION_ERRORS);\n    private readonly control = new Subject<AbstractControl>();\n\n    private readonly errors = toSignal(\n        this.control.pipe(\n            distinctUntilChanged(),\n            switchMap((control) =>\n                control.events.pipe(\n                    startWith(null),\n                    map(() => control.invalid && control.touched && control.errors),\n                ),\n            ),\n        ),\n    );\n\n    private readonly key = computed(\n        (errors = this.errors() || {}) =>\n            this.order().find((id) => errors[id]) || Object.keys(errors)[0] || '',\n    );\n\n    public readonly order = input<readonly string[]>([]);\n    public readonly error = tuiDirectiveBinding(\n        TuiErrorComponent,\n        'error',\n        computed(\n            (errors = this.errors() || null) =>\n                errors && this.getError(errors[this.key()], this.content[this.key()]),\n        ),\n        {self: true, optional: true},\n    );\n\n    public registerOnChange(): void {}\n    public registerOnTouched(): void {}\n    public writeValue(): void {}\n    public validate(control: AbstractControl): ValidationErrors | null {\n        this.control.next(control);\n\n        return null;\n    }\n\n    private getError(\n        context: unknown,\n        content?: PolymorpheusContent | Signal<PolymorpheusContent>,\n    ): TuiValidationError {\n        context = isSignal(context) ? context() : context;\n\n        if (context instanceof TuiValidationError) {\n            return context;\n        }\n\n        if (content === undefined && isContent(context)) {\n            return getError(context);\n        }\n\n        if (isSignal(content)) {\n            return getError(content(), context);\n        }\n\n        if (content instanceof Function) {\n            const message = content(context);\n\n            return getError(isSignal(message) ? message() : message, context);\n        }\n\n        return getError(content, context);\n    }\n}\n\nfunction getError(content: unknown = '', context?: any): TuiValidationError {\n    return new TuiValidationError(content as PolymorpheusContent, context);\n}\n\nfunction isContent(value: unknown): value is PolymorpheusContent {\n    return (\n        tuiIsString(value) ||\n        value instanceof TemplateRef ||\n        value instanceof PolymorpheusTemplate ||\n        value instanceof PolymorpheusComponent\n    );\n}\n","import {inject, Pipe, type PipeTransform, untracked} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {tuiSetSignal} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {type PolymorpheusContent} from '@taiga-ui/polymorpheus';\n\nimport {TuiErrorDirective} from './error.directive';\n\n@Pipe({\n    name: 'tuiError',\n    pure: false,\n})\nexport class TuiErrorPipe implements PipeTransform {\n    private readonly control = inject(NgControl);\n    private readonly directive = new TuiErrorDirective();\n\n    public transform(order: readonly string[]): PolymorpheusContent {\n        untracked(() => {\n            this.directive.validate(this.control.control!);\n            tuiSetSignal(this.directive.order, order);\n        });\n\n        const error = this.directive.error();\n\n        if (!error) {\n            return '';\n        }\n\n        return typeof error.message === 'function'\n            ? error.message(error.context)\n            : error.message;\n    }\n}\n","import {TuiErrorComponent} from './error.component';\nimport {TuiErrorDirective} from './error.directive';\nimport {TuiErrorPipe} from './error.pipe';\n\nexport const TuiError = [TuiErrorComponent, TuiErrorDirective, TuiErrorPipe] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/taiga-ui-core-components-expand.mjs

@@ -1,149 +1,51 @@
-import { NgIf, NgTemplateOutlet } from '@angular/common';
+import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Directive, inject, ChangeDetectorRef, DestroyRef, TemplateRef, Input, ContentChild, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import { tuiParentAnimation } from '@taiga-ui/core/animations';
-import { TuiLoader } from '@taiga-ui/core/components/loader';
-import { timer } from 'rxjs';
+import { contentChild, TemplateRef, signal, input, ChangeDetectionStrategy, Component } from '@angular/core';
+import { TuiItem } from '@taiga-ui/cdk/directives/item';
 
-/**
- * @deprecated use {@link TuiExpand} from @taiga-ui/experimental
- */
-class TuiExpandContent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiExpandContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.9", type: TuiExpandContent, isStandalone: true, selector: "[tuiExpandContent]", ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiExpandContent, decorators: [{
-            type: Directive,
-            args: [{
-                    standalone: true,
-                    selector: '[tuiExpandContent]',
-                }]
-        }] });
-
-const State = {
-    Idle: 0,
-    Loading: 1,
-    Prepared: 2,
-    Animated: 3,
-};
-const LOADER_HEIGHT = 48;
-/**
- * An event indicating that async data for expand has finished loading.
- * Dispatch to finish loading states for {@link TuiExpandComponent}.
- */
-const TUI_EXPAND_LOADED = 'tui-expand-loaded';
-/**
- * @deprecated use {@link TuiExpand} from @taiga-ui/experimental
- */
-class TuiExpandComponent {
+class TuiExpand {
     constructor() {
-        this.cdr = inject(ChangeDetectorRef);
-        this.destroyRef = inject(DestroyRef);
-        this.state = State.Idle;
-        this.content = null;
-        this.expanded = null;
-        this.async = false;
-    }
-    set expandedSetter(expanded) {
-        if (this.expanded === null) {
-            this.expanded = expanded;
-            return;
-        }
-        if (this.state !== State.Idle) {
-            this.expanded = expanded;
-            this.state = State.Animated;
-            return;
-        }
-        this.expanded = expanded;
-        this.retrigger(this.async && expanded ? State.Loading : State.Animated);
-    }
-    get contentVisible() {
-        return this.expanded || this.state !== State.Idle;
+        this.content = contentChild(TuiItem, { read: TemplateRef });
+        this.open = signal(false);
+        this.expanded = input(false);
     }
-    get overflow() {
-        return this.state !== State.Idle;
+    ngOnInit() {
+        this.open.set(this.expanded());
     }
-    get loading() {
-        return !!this.expanded && this.async && this.state === State.Loading;
-    }
-    get height() {
-        const { expanded, state, contentWrapper } = this;
-        if ((expanded && state === State.Prepared) ||
-            (!expanded && state === State.Animated)) {
-            return 0;
-        }
-        if (contentWrapper &&
-            ((!expanded && state === State.Prepared) ||
-                (expanded && state === State.Animated))) {
-            return contentWrapper.nativeElement.offsetHeight;
-        }
-        if (contentWrapper && expanded && state === State.Loading) {
-            return Math.max(contentWrapper.nativeElement.offsetHeight, LOADER_HEIGHT);
-        }
-        return null;
-    }
-    onTransitionEnd({ propertyName, pseudoElement }) {
-        if (propertyName === 'opacity' &&
-            !pseudoElement &&
-            this.state === State.Animated) {
-            this.state = State.Idle;
-        }
-    }
-    onExpandLoaded(event) {
-        event.stopPropagation();
-        if (this.state === State.Loading) {
-            this.retrigger(State.Animated);
+    onTransitionEnd({ propertyName }) {
+        if (propertyName === 'grid-template-rows') {
+            this.open.set(this.expanded());
         }
     }
-    retrigger(state) {
-        this.state = State.Prepared;
-        timer(0)
-            .pipe(takeUntilDestroyed(this.destroyRef))
-            .subscribe(() => {
-            // We need delay to re-trigger CSS height transition from the correct number
-            if (this.state !== State.Prepared) {
-                return;
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiExpand, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TuiExpand, isStandalone: true, selector: "tui-expand", inputs: { expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "transitionend.self": "onTransitionEnd($event)" }, properties: { "class._expanded": "expanded()", "class._open": "open()" } }, queries: [{ propertyName: "content", first: true, predicate: TuiItem, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: `
+        <div class="t-wrapper">
+            @if (expanded() || open()) {
+                <ng-container [ngTemplateOutlet]="content() || null" />
             }
-            this.state = state;
-            this.cdr.markForCheck();
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiExpandComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.9", type: TuiExpandComponent, isStandalone: true, selector: "tui-expand", inputs: { async: "async", expandedSetter: ["expanded", "expandedSetter"] }, host: { listeners: { "transitionend.self": "onTransitionEnd($event)", "tui-expand-loaded": "onExpandLoaded($event)" }, properties: { "style.height.px": "height", "class._loading": "loading", "class._overflow": "overflow", "class._expanded": "expanded", "attr.aria-expanded": "expanded" } }, queries: [{ propertyName: "content", first: true, predicate: TuiExpandContent, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "contentWrapper", first: true, predicate: ["wrapper"], descendants: true }], ngImport: i0, template: "<div\n    #wrapper\n    class=\"t-wrapper\"\n    @tuiParentAnimation\n    [@.disabled]=\"overflow\"\n>\n    <ng-container *ngIf=\"contentVisible\">\n        <ng-content />\n        <tui-loader\n            *ngIf=\"async; else content\"\n            size=\"l\"\n            [overlay]=\"true\"\n            [showLoader]=\"loading\"\n        >\n            <ng-container [ngTemplateOutlet]=\"content\" />\n        </tui-loader>\n    </ng-container>\n</div>\n", styles: [":host{transition-property:opacity,height,visibility;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;opacity:0;transition-delay:1ms}:host._overflow{overflow:hidden}:host._expanded{opacity:1}:host._loading{opacity:.99}.t-wrapper:before,.t-wrapper:after{content:\"\";display:table}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }], animations: [tuiParentAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+            <ng-content />
+        </div>
+    `, isInline: true, styles: [":host{transition-property:grid-template-rows,padding;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;display:grid;grid-template-rows:0fr;transition-delay:1ms}:host:not(._expanded){padding-block:0}:host._expanded{grid-template-rows:1fr}:host._expanded>.t-wrapper{opacity:1;visibility:visible}:host._expanded._open>.t-wrapper{overflow:visible}.t-wrapper{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;grid-row:1 / span 2;overflow:hidden;opacity:0;visibility:hidden}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiExpandComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiExpand, decorators: [{
             type: Component,
-            args: [{ selector: 'tui-expand', imports: [NgIf, NgTemplateOutlet, TuiLoader], changeDetection: ChangeDetectionStrategy.OnPush, animations: [tuiParentAnimation], host: {
-                        '[style.height.px]': 'height',
-                        '[class._loading]': 'loading',
-                        '[class._overflow]': 'overflow',
-                        '[class._expanded]': 'expanded',
-                        '[attr.aria-expanded]': 'expanded',
+            args: [{ selector: 'tui-expand', imports: [NgTemplateOutlet], template: `
+        <div class="t-wrapper">
+            @if (expanded() || open()) {
+                <ng-container [ngTemplateOutlet]="content() || null" />
+            }
+            <ng-content />
+        </div>
+    `, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class._expanded]': 'expanded()',
+                        '[class._open]': 'open()',
                         '(transitionend.self)': 'onTransitionEnd($event)',
-                        [`(${TUI_EXPAND_LOADED})`]: 'onExpandLoaded($event)',
-                    }, template: "<div\n    #wrapper\n    class=\"t-wrapper\"\n    @tuiParentAnimation\n    [@.disabled]=\"overflow\"\n>\n    <ng-container *ngIf=\"contentVisible\">\n        <ng-content />\n        <tui-loader\n            *ngIf=\"async; else content\"\n            size=\"l\"\n            [overlay]=\"true\"\n            [showLoader]=\"loading\"\n        >\n            <ng-container [ngTemplateOutlet]=\"content\" />\n        </tui-loader>\n    </ng-container>\n</div>\n", styles: [":host{transition-property:opacity,height,visibility;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;opacity:0;transition-delay:1ms}:host._overflow{overflow:hidden}:host._expanded{opacity:1}:host._loading{opacity:.99}.t-wrapper:before,.t-wrapper:after{content:\"\";display:table}\n"] }]
-        }], propDecorators: { contentWrapper: [{
-                type: ViewChild,
-                args: ['wrapper']
-            }], content: [{
-                type: ContentChild,
-                args: [TuiExpandContent, { read: TemplateRef }]
-            }], async: [{
-                type: Input
-            }], expandedSetter: [{
-                type: Input,
-                args: ['expanded']
-            }] } });
-
-/**
- * @deprecated use {@link TuiExpand} from @taiga-ui/experimental
- */
-const TuiExpand = [TuiExpandComponent, TuiExpandContent];
+                    }, styles: [":host{transition-property:grid-template-rows,padding;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;display:grid;grid-template-rows:0fr;transition-delay:1ms}:host:not(._expanded){padding-block:0}:host._expanded{grid-template-rows:1fr}:host._expanded>.t-wrapper{opacity:1;visibility:visible}:host._expanded._open>.t-wrapper{overflow:visible}.t-wrapper{transition-property:all;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;grid-row:1 / span 2;overflow:hidden;opacity:0;visibility:hidden}\n"] }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { TUI_EXPAND_LOADED, TuiExpand, TuiExpandComponent, TuiExpandContent };
+export { TuiExpand };
 //# sourceMappingURL=taiga-ui-core-components-expand.mjs.map

package/fesm2022/taiga-ui-core-components-expand.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-core-components-expand.mjs","sources":["../../../projects/core/components/expand/expand-content.directive.ts","../../../projects/core/components/expand/expand.component.ts","../../../projects/core/components/expand/expand.template.html","../../../projects/core/components/expand/expand.ts","../../../projects/core/components/expand/taiga-ui-core-components-expand.ts"],"sourcesContent":["import {Directive} from '@angular/core';\n\n/**\n * @deprecated use {@link TuiExpand} from @taiga-ui/experimental\n */\n@Directive({\n    standalone: true,\n    selector: '[tuiExpandContent]',\n})\nexport class TuiExpandContent {}\n","import {NgIf, type NgIfContext, NgTemplateOutlet} from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChild,\n    DestroyRef,\n    type ElementRef,\n    inject,\n    Input,\n    TemplateRef,\n    ViewChild,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {type TuiValuesOf} from '@taiga-ui/cdk/types';\nimport {tuiParentAnimation} from '@taiga-ui/core/animations';\nimport {TuiLoader} from '@taiga-ui/core/components/loader';\nimport {timer} from 'rxjs';\n\nimport {TuiExpandContent} from './expand-content.directive';\n\nconst State = {\n    Idle: 0,\n    Loading: 1,\n    Prepared: 2,\n    Animated: 3,\n} as const;\n\nconst LOADER_HEIGHT = 48;\n\n/**\n * An event indicating that async data for expand has finished loading.\n * Dispatch to finish loading states for {@link TuiExpandComponent}.\n */\nexport const TUI_EXPAND_LOADED = 'tui-expand-loaded';\n\n/**\n * @deprecated use {@link TuiExpand} from @taiga-ui/experimental\n */\n@Component({\n    selector: 'tui-expand',\n    imports: [NgIf, NgTemplateOutlet, TuiLoader],\n    templateUrl: './expand.template.html',\n    styleUrls: ['./expand.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    animations: [tuiParentAnimation],\n    host: {\n        '[style.height.px]': 'height',\n        '[class._loading]': 'loading',\n        '[class._overflow]': 'overflow',\n        '[class._expanded]': 'expanded',\n        '[attr.aria-expanded]': 'expanded',\n        '(transitionend.self)': 'onTransitionEnd($event)',\n        [`(${TUI_EXPAND_LOADED})`]: 'onExpandLoaded($event)',\n    },\n})\nexport class TuiExpandComponent {\n    @ViewChild('wrapper')\n    private readonly contentWrapper?: ElementRef<HTMLDivElement>;\n\n    private readonly cdr = inject(ChangeDetectorRef);\n    private readonly destroyRef = inject(DestroyRef);\n    private state: TuiValuesOf<typeof State> = State.Idle;\n\n    @ContentChild(TuiExpandContent, {read: TemplateRef})\n    protected content: TemplateRef<NgIfContext<boolean>> | null = null;\n\n    protected expanded: boolean | null = null;\n\n    @Input()\n    public async = false;\n\n    @Input('expanded')\n    public set expandedSetter(expanded: boolean | null) {\n        if (this.expanded === null) {\n            this.expanded = expanded;\n\n            return;\n        }\n\n        if (this.state !== State.Idle) {\n            this.expanded = expanded;\n            this.state = State.Animated;\n\n            return;\n        }\n\n        this.expanded = expanded;\n        this.retrigger(this.async && expanded ? State.Loading : State.Animated);\n    }\n\n    public get contentVisible(): boolean {\n        return this.expanded || this.state !== State.Idle;\n    }\n\n    protected get overflow(): boolean {\n        return this.state !== State.Idle;\n    }\n\n    protected get loading(): boolean {\n        return !!this.expanded && this.async && this.state === State.Loading;\n    }\n\n    protected get height(): number | null {\n        const {expanded, state, contentWrapper} = this;\n\n        if (\n            (expanded && state === State.Prepared) ||\n            (!expanded && state === State.Animated)\n        ) {\n            return 0;\n        }\n\n        if (\n            contentWrapper &&\n            ((!expanded && state === State.Prepared) ||\n                (expanded && state === State.Animated))\n        ) {\n            return contentWrapper.nativeElement.offsetHeight;\n        }\n\n        if (contentWrapper && expanded && state === State.Loading) {\n            return Math.max(contentWrapper.nativeElement.offsetHeight, LOADER_HEIGHT);\n        }\n\n        return null;\n    }\n\n    protected onTransitionEnd({propertyName, pseudoElement}: TransitionEvent): void {\n        if (\n            propertyName === 'opacity' &&\n            !pseudoElement &&\n            this.state === State.Animated\n        ) {\n            this.state = State.Idle;\n        }\n    }\n\n    protected onExpandLoaded(event: Event): void {\n        event.stopPropagation();\n\n        if (this.state === State.Loading) {\n            this.retrigger(State.Animated);\n        }\n    }\n\n    private retrigger(state: TuiValuesOf<typeof State>): void {\n        this.state = State.Prepared;\n\n        timer(0)\n            .pipe(takeUntilDestroyed(this.destroyRef))\n            .subscribe(() => {\n                // We need delay to re-trigger CSS height transition from the correct number\n                if (this.state !== State.Prepared) {\n                    return;\n                }\n\n                this.state = state;\n                this.cdr.markForCheck();\n            });\n    }\n}\n","<div\n    #wrapper\n    class=\"t-wrapper\"\n    @tuiParentAnimation\n    [@.disabled]=\"overflow\"\n>\n    <ng-container *ngIf=\"contentVisible\">\n        <ng-content />\n        <tui-loader\n            *ngIf=\"async; else content\"\n            size=\"l\"\n            [overlay]=\"true\"\n            [showLoader]=\"loading\"\n        >\n            <ng-container [ngTemplateOutlet]=\"content\" />\n        </tui-loader>\n    </ng-container>\n</div>\n","import {TuiExpandComponent} from './expand.component';\nimport {TuiExpandContent} from './expand-content.directive';\n\n/**\n * @deprecated use {@link TuiExpand} from @taiga-ui/experimental\n */\nexport const TuiExpand = [TuiExpandComponent, TuiExpandContent] as const;\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-core-components-expand.mjs","sources":["../../../projects/core/components/expand/expand.component.ts","../../../projects/core/components/expand/taiga-ui-core-components-expand.ts"],"sourcesContent":["import {NgTemplateOutlet} from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    contentChild,\n    input,\n    type OnInit,\n    signal,\n    TemplateRef,\n} from '@angular/core';\nimport {TuiItem} from '@taiga-ui/cdk/directives/item';\n\n@Component({\n    selector: 'tui-expand',\n    imports: [NgTemplateOutlet],\n    template: `\n        <div class=\"t-wrapper\">\n            @if (expanded() || open()) {\n                <ng-container [ngTemplateOutlet]=\"content() || null\" />\n            }\n            <ng-content />\n        </div>\n    `,\n    styleUrl: './expand.style.less',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[class._expanded]': 'expanded()',\n        '[class._open]': 'open()',\n        '(transitionend.self)': 'onTransitionEnd($event)',\n    },\n})\nexport class TuiExpand implements OnInit {\n    protected readonly content = contentChild(TuiItem, {read: TemplateRef});\n    protected readonly open = signal(false);\n\n    public readonly expanded = input(false);\n\n    public ngOnInit(): void {\n        this.open.set(this.expanded());\n    }\n\n    protected onTransitionEnd({propertyName}: TransitionEvent): void {\n        if (propertyName === 'grid-template-rows') {\n            this.open.set(this.expanded());\n        }\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MA+Ba,SAAS,CAAA;AAnBtB,IAAA,WAAA,GAAA;QAoBuB,IAAO,CAAA,OAAA,GAAG,YAAY,CAAC,OAAO,EAAE,EAAC,IAAI,EAAE,WAAW,EAAC,CAAC;AACpD,QAAA,IAAA,CAAA,IAAI,GAAG,MAAM,CAAC,KAAK,CAAC;AAEvB,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC;AAW1C;IATU,QAAQ,GAAA;QACX,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;;IAGxB,eAAe,CAAC,EAAC,YAAY,EAAkB,EAAA;AACrD,QAAA,IAAI,YAAY,KAAK,oBAAoB,EAAE;YACvC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;;;+GAZ7B,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAT,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,SAAS,EACwB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,oBAAA,EAAA,yBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,aAAA,EAAA,QAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,SAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,OAAO,EAAS,WAAA,EAAA,IAAA,EAAA,IAAA,EAAA,WAAW,EAjB3D,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA;;;;;;;AAOT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,skBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EARS,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;4FAiBjB,SAAS,EAAA,UAAA,EAAA,CAAA;kBAnBrB,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,EACb,OAAA,EAAA,CAAC,gBAAgB,CAAC,EACjB,QAAA,EAAA;;;;;;;KAOT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACzC,IAAA,EAAA;AACF,wBAAA,mBAAmB,EAAE,YAAY;AACjC,wBAAA,eAAe,EAAE,QAAQ;AACzB,wBAAA,sBAAsB,EAAE,yBAAyB;AACpD,qBAAA,EAAA,MAAA,EAAA,CAAA,skBAAA,CAAA,EAAA;;;AC7BL;;AAEG;;;;"}

package/fesm2022/taiga-ui-core-components-header.mjs

@@ -0,0 +1,42 @@
+import * as i0 from '@angular/core';
+import { ChangeDetectionStrategy, ViewEncapsulation, Component, inject, input, Directive } from '@angular/core';
+import { tuiCreateOptions } from '@taiga-ui/cdk/utils/di';
+import { tuiWithStyles } from '@taiga-ui/cdk/utils/miscellaneous';
+import { tuiButtonOptionsProvider } from '@taiga-ui/core/components/button';
+
+const [TUI_HEADER_OPTIONS, tuiHeaderOptionsProvider] = tuiCreateOptions({ size: 'h5' });
+class Styles {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: Styles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: Styles, isStandalone: true, selector: "ng-component", host: { classAttribute: "tui-header" }, ngImport: i0, template: '', isInline: true, styles: ["[tuiHeader]{position:relative;display:flex;align-items:flex-start;box-sizing:content-box;color:var(--tui-text-primary);margin:0;text-align:start;overflow-wrap:break-word}[tuiHeader] p{margin:.25rem 0 0;font:var(--tui-font-text-m)}[tuiHeader] p:empty{display:none}[tuiHeader] [tuiTitle]{flex-grow:2;margin:0}[tuiHeader] [tuiTitle]:empty{display:none}[tuiHeader] [tuiAccessories]{display:flex;align-items:center;gap:.75rem;white-space:nowrap}[tuiHeader] [tuiAccessories]:has([tuiLink]){align-items:baseline}[tuiHeader] [tuiAccessories]:before{content:\"\\200b\";visibility:hidden}[tuiHeader] [tuiSubtitle]{font:var(--tui-font-text-m);color:var(--tui-text-secondary);margin:0}[tuiHeader] [tuiLink]{font:var(--tui-font-text-m)}[tuiHeader] [tuiCaption]{font:var(--tui-font-text-s);color:var(--tui-text-secondary);font-weight:500;text-transform:uppercase;margin:0}[tuiHeader][data-size=h1] [tuiTitle],[tuiHeader][data-size=h1] [tuiAccessories]{font:var(--tui-font-heading-1)}[tuiHeader][data-size=h2] [tuiTitle],[tuiHeader][data-size=h2] [tuiAccessories]{font:var(--tui-font-heading-2)}[tuiHeader][data-size=h3] [tuiTitle],[tuiHeader][data-size=h3] [tuiAccessories]{font:var(--tui-font-heading-3)}[tuiHeader][data-size=h4] [tuiTitle],[tuiHeader][data-size=h4] [tuiAccessories]{font:var(--tui-font-heading-4)}[tuiHeader][data-size=h5] [tuiTitle],[tuiHeader][data-size=h5] [tuiAccessories]{font:var(--tui-font-heading-5)}[tuiHeader][data-size=h6] [tuiTitle],[tuiHeader][data-size=h6] [tuiAccessories]{font:var(--tui-font-heading-6)}[tuiHeader][data-size=body-xl] [tuiTitle],[tuiHeader][data-size=body-xl] [tuiAccessories]{font:var(--tui-font-text-xl)}[tuiHeader][data-size=body-xl] [tuiTitle]{font-weight:700}[tuiHeader][data-size=body-l] [tuiTitle],[tuiHeader][data-size=body-l] [tuiAccessories]{font:var(--tui-font-text-l)}[tuiHeader][data-size=body-l] [tuiTitle]{font-weight:700}[tuiHeader][data-size=body-m] [tuiTitle],[tuiHeader][data-size=body-m] [tuiAccessories]{font:var(--tui-font-text-m)}[tuiHeader][data-size=body-m] [tuiTitle]{gap:.125rem;font-weight:700}[tuiHeader][data-size=body-m] [tuiSubtitle],[tuiHeader][data-size=body-l] [tuiSubtitle],[tuiHeader][data-size=body-m] [tuiLink],[tuiHeader][data-size=body-l] [tuiLink]{font:var(--tui-font-text-s)}[tuiHeader][data-size=h1] [tuiSubtitle],[tuiHeader][data-size=h2] [tuiSubtitle],[tuiHeader][data-size=h3] [tuiSubtitle],[tuiHeader][data-size=h1] [tuiLink],[tuiHeader][data-size=h2] [tuiLink],[tuiHeader][data-size=h3] [tuiLink]{font:var(--tui-font-text-l)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: Styles, decorators: [{
+            type: Component,
+            args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'tui-header' }, styles: ["[tuiHeader]{position:relative;display:flex;align-items:flex-start;box-sizing:content-box;color:var(--tui-text-primary);margin:0;text-align:start;overflow-wrap:break-word}[tuiHeader] p{margin:.25rem 0 0;font:var(--tui-font-text-m)}[tuiHeader] p:empty{display:none}[tuiHeader] [tuiTitle]{flex-grow:2;margin:0}[tuiHeader] [tuiTitle]:empty{display:none}[tuiHeader] [tuiAccessories]{display:flex;align-items:center;gap:.75rem;white-space:nowrap}[tuiHeader] [tuiAccessories]:has([tuiLink]){align-items:baseline}[tuiHeader] [tuiAccessories]:before{content:\"\\200b\";visibility:hidden}[tuiHeader] [tuiSubtitle]{font:var(--tui-font-text-m);color:var(--tui-text-secondary);margin:0}[tuiHeader] [tuiLink]{font:var(--tui-font-text-m)}[tuiHeader] [tuiCaption]{font:var(--tui-font-text-s);color:var(--tui-text-secondary);font-weight:500;text-transform:uppercase;margin:0}[tuiHeader][data-size=h1] [tuiTitle],[tuiHeader][data-size=h1] [tuiAccessories]{font:var(--tui-font-heading-1)}[tuiHeader][data-size=h2] [tuiTitle],[tuiHeader][data-size=h2] [tuiAccessories]{font:var(--tui-font-heading-2)}[tuiHeader][data-size=h3] [tuiTitle],[tuiHeader][data-size=h3] [tuiAccessories]{font:var(--tui-font-heading-3)}[tuiHeader][data-size=h4] [tuiTitle],[tuiHeader][data-size=h4] [tuiAccessories]{font:var(--tui-font-heading-4)}[tuiHeader][data-size=h5] [tuiTitle],[tuiHeader][data-size=h5] [tuiAccessories]{font:var(--tui-font-heading-5)}[tuiHeader][data-size=h6] [tuiTitle],[tuiHeader][data-size=h6] [tuiAccessories]{font:var(--tui-font-heading-6)}[tuiHeader][data-size=body-xl] [tuiTitle],[tuiHeader][data-size=body-xl] [tuiAccessories]{font:var(--tui-font-text-xl)}[tuiHeader][data-size=body-xl] [tuiTitle]{font-weight:700}[tuiHeader][data-size=body-l] [tuiTitle],[tuiHeader][data-size=body-l] [tuiAccessories]{font:var(--tui-font-text-l)}[tuiHeader][data-size=body-l] [tuiTitle]{font-weight:700}[tuiHeader][data-size=body-m] [tuiTitle],[tuiHeader][data-size=body-m] [tuiAccessories]{font:var(--tui-font-text-m)}[tuiHeader][data-size=body-m] [tuiTitle]{gap:.125rem;font-weight:700}[tuiHeader][data-size=body-m] [tuiSubtitle],[tuiHeader][data-size=body-l] [tuiSubtitle],[tuiHeader][data-size=body-m] [tuiLink],[tuiHeader][data-size=body-l] [tuiLink]{font:var(--tui-font-text-s)}[tuiHeader][data-size=h1] [tuiSubtitle],[tuiHeader][data-size=h2] [tuiSubtitle],[tuiHeader][data-size=h3] [tuiSubtitle],[tuiHeader][data-size=h1] [tuiLink],[tuiHeader][data-size=h2] [tuiLink],[tuiHeader][data-size=h3] [tuiLink]{font:var(--tui-font-text-l)}\n"] }]
+        }] });
+class TuiHeader {
+    constructor() {
+        this.nothing = tuiWithStyles(Styles);
+        this.options = inject(TUI_HEADER_OPTIONS);
+        this.tuiHeader = input(this.options.size);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: TuiHeader, isStandalone: true, selector: "[tuiHeader]", inputs: { tuiHeader: { classPropertyName: "tuiHeader", publicName: "tuiHeader", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "tuiHeader": "" }, properties: { "attr.data-size": "tuiHeader() || options.size || \"h5\"" } }, providers: [tuiButtonOptionsProvider({ size: 's' })], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiHeader, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[tuiHeader]',
+                    providers: [tuiButtonOptionsProvider({ size: 's' })],
+                    host: {
+                        tuiHeader: '',
+                        '[attr.data-size]': 'tuiHeader() || options.size || "h5"',
+                    },
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TUI_HEADER_OPTIONS, TuiHeader, tuiHeaderOptionsProvider };
+//# sourceMappingURL=taiga-ui-core-components-header.mjs.map

package/fesm2022/taiga-ui-core-components-header.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"taiga-ui-core-components-header.mjs","sources":["../../../projects/core/components/header/header.directive.ts","../../../projects/core/components/header/taiga-ui-core-components-header.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    Directive,\n    inject,\n    input,\n    ViewEncapsulation,\n} from '@angular/core';\nimport {tuiCreateOptions} from '@taiga-ui/cdk/utils/di';\nimport {tuiWithStyles} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {tuiButtonOptionsProvider} from '@taiga-ui/core/components/button';\n\nexport const [TUI_HEADER_OPTIONS, tuiHeaderOptionsProvider] = tuiCreateOptions<{\n    size: '' | 'body-l' | 'body-m' | 'body-xl' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n}>({size: 'h5'});\n\n@Component({\n    template: '',\n    styleUrl: './header.styles.less',\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {class: 'tui-header'},\n})\nclass Styles {}\n\n@Directive({\n    selector: '[tuiHeader]',\n    providers: [tuiButtonOptionsProvider({size: 's'})],\n    host: {\n        tuiHeader: '',\n        '[attr.data-size]': 'tuiHeader() || options.size || \"h5\"',\n    },\n})\nexport class TuiHeader {\n    protected readonly nothing = tuiWithStyles(Styles);\n    protected readonly options = inject(TUI_HEADER_OPTIONS);\n\n    public readonly tuiHeader = input(this.options.size);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;AAYa,MAAA,CAAC,kBAAkB,EAAE,wBAAwB,CAAC,GAAG,gBAAgB,CAE3E,EAAC,IAAI,EAAE,IAAI,EAAC;AAEf,MAOM,MAAM,CAAA;+GAAN,MAAM,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAN,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,MAAM,gHANE,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,m9EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAMV,MAAM,EAAA,UAAA,EAAA,CAAA;kBAPX,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAE,EAEG,aAAA,EAAA,iBAAiB,CAAC,IAAI,EACpB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACzC,IAAA,EAAA,EAAC,KAAK,EAAE,YAAY,EAAC,EAAA,MAAA,EAAA,CAAA,m9EAAA,CAAA,EAAA;;MAYlB,SAAS,CAAA;AARtB,IAAA,WAAA,GAAA;AASuB,QAAA,IAAA,CAAA,OAAO,GAAG,aAAa,CAAC,MAAM,CAAC;AAC/B,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAC,kBAAkB,CAAC;QAEvC,IAAS,CAAA,SAAA,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;AACvD;+GALY,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,EAAA,EAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,uCAAA,EAAA,EAAA,EAAA,SAAA,EANP,CAAC,wBAAwB,CAAC,EAAC,IAAI,EAAE,GAAG,EAAC,CAAC,CAAC,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAMzC,SAAS,EAAA,UAAA,EAAA,CAAA;kBARrB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,aAAa;oBACvB,SAAS,EAAE,CAAC,wBAAwB,CAAC,EAAC,IAAI,EAAE,GAAG,EAAC,CAAC,CAAC;AAClD,oBAAA,IAAI,EAAE;AACF,wBAAA,SAAS,EAAE,EAAE;AACb,wBAAA,kBAAkB,EAAE,qCAAqC;AAC5D,qBAAA;AACJ,iBAAA;;;AChCD;;AAEG;;;;"}

package/fesm2022/taiga-ui-core-components-icon.mjs

@@ -1,55 +1,38 @@
 import * as i0 from '@angular/core';
-import { signal, inject, computed, Input, ChangeDetectionStrategy, ViewEncapsulation, Component, Pipe } from '@angular/core';
-import { tuiInjectIconResolver, TUI_ICON_START, TUI_ICON_END, tuiGetIconMode } from '@taiga-ui/core/tokens';
+import { inject, computed, input, ChangeDetectionStrategy, ViewEncapsulation, Component, Pipe } from '@angular/core';
+import * as i1 from '@taiga-ui/core/directives';
+import { TuiIcons } from '@taiga-ui/core/directives';
+import { tuiInjectIconResolver } from '@taiga-ui/core/tokens';
 
 class TuiIcon {
     constructor() {
-        this.resolver = tuiInjectIconResolver();
-        this.src = signal(inject(TUI_ICON_START, { self: true, optional: true }) ||
-            inject(TUI_ICON_END, { self: true, optional: true }));
-        this.bg = signal(null);
-        this.resource = computed(() => this.resolve(this.src()));
-        this.mode = computed(() => tuiGetIconMode(this.src()));
-        this.bgResource = computed(() => this.resolve(this.bg()));
+        this.icons = inject(TuiIcons);
+        this.mask = computed(() => this.icons.resolve(this.background()));
+        this.background = input('');
     }
-    set icon(icon) {
-        this.src.set(icon);
-    }
-    set background(background) {
-        this.bg.set(background);
-    }
-    resolve(value) {
-        if (!value) {
-            return null;
-        }
-        return tuiGetIconMode(value) === 'font'
-            ? `'${this.resolver(value)}'`
-            : `url(${this.resolver(value)})`;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.9", type: TuiIcon, isStandalone: true, selector: "tui-icon", inputs: { icon: "icon", background: "background" }, host: { properties: { "style.--t-icon": "resource() || \"url()\"", "style.--t-icon-bg": "bgResource()", "attr.data-icon": "mode()" } }, ngImport: i0, template: '', isInline: true, styles: ["tui-icon{position:relative;display:inline-block;inline-size:1em;block-size:1em;font-size:1.5rem;flex-shrink:0;border:0 solid transparent;vertical-align:middle;box-sizing:border-box;mask:var(--t-icon-bg) no-repeat center / calc(min(1em,100%) + 10 * var(--tui-stroke-width, .125rem)) min(1em,100%) padding-box}@media (hover: hover) and (pointer: fine){tui-icon[data-appearance=icon]:hover{color:var(--tui-text-secondary)}}tui-icon:before,tui-icon[tuiIcons]:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";display:block;mask:var(--t-icon) no-repeat center / calc(min(1em,100%) + 10 * var(--tui-stroke-width, .125rem)) min(1em,100%),100% padding-box;background:currentColor}tui-icon[data-icon=image]:before{mask:none;background:var(--t-icon) no-repeat center / contain}tui-icon[data-icon=font]:before{content:var(--t-icon);mask:none;background:none;font:1em/1 var(--tui-font-icon, inherit);text-align:center;text-transform:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiIcon, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.15", type: TuiIcon, isStandalone: true, selector: "tui-icon:not([tuiBadge])", inputs: { background: { classPropertyName: "background", publicName: "background", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.--t-icon-bg": "mask()" } }, hostDirectives: [{ directive: i1.TuiIcons, inputs: ["iconStart", "icon", "iconEnd", "badge"] }], ngImport: i0, template: '', isInline: true, styles: ["tui-icon{--tui-icon-size: 1em;position:relative;display:inline-flex;inline-size:1em;block-size:1em;font-size:1.5rem;flex-shrink:0;border:0 solid transparent;vertical-align:middle;box-sizing:border-box;mask:var(--t-icon-bg) no-repeat center / calc(100% + 10 * var(--tui-stroke-width, .125rem)) 100%}@media (hover: hover) and (pointer: fine){tui-icon[data-appearance=icon]:hover{color:var(--tui-text-secondary)}}tui-icon[data-icon-end]:before{-webkit-mask-image:var(--t-icon-start),radial-gradient(circle at bottom .1em right .1em,transparent calc(.4em - .5px),#000 .4em);mask-image:var(--t-icon-start),radial-gradient(circle at bottom .1em right .1em,transparent calc(.4em - .5px),#000 .4em);-webkit-mask-composite:source-in;mask-composite:intersect}tui-icon[data-icon-end][data-icon-start=img]:before,tui-icon[data-icon-end][data-icon-start=font]:before{mask:radial-gradient(circle at bottom .1em right .1em,transparent calc(.4em - .5px),#000 .4em)}tui-icon[data-icon-end]:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}tui-icon[data-icon-start]:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}tui-icon[data-icon-start]:after{transform:translate(36%,36%);--tui-icon-size: .5715em}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiIcon, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'tui-icon', template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        '[style.--t-icon]': 'resource() || "url()"',
-                        '[style.--t-icon-bg]': 'bgResource()',
-                        '[attr.data-icon]': 'mode()',
-                    }, styles: ["tui-icon{position:relative;display:inline-block;inline-size:1em;block-size:1em;font-size:1.5rem;flex-shrink:0;border:0 solid transparent;vertical-align:middle;box-sizing:border-box;mask:var(--t-icon-bg) no-repeat center / calc(min(1em,100%) + 10 * var(--tui-stroke-width, .125rem)) min(1em,100%) padding-box}@media (hover: hover) and (pointer: fine){tui-icon[data-appearance=icon]:hover{color:var(--tui-text-secondary)}}tui-icon:before,tui-icon[tuiIcons]:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";display:block;mask:var(--t-icon) no-repeat center / calc(min(1em,100%) + 10 * var(--tui-stroke-width, .125rem)) min(1em,100%),100% padding-box;background:currentColor}tui-icon[data-icon=image]:before{mask:none;background:var(--t-icon) no-repeat center / contain}tui-icon[data-icon=font]:before{content:var(--t-icon);mask:none;background:none;font:1em/1 var(--tui-font-icon, inherit);text-align:center;text-transform:none}\n"] }]
-        }], propDecorators: { icon: [{
-                type: Input
-            }], background: [{
-                type: Input
-            }] } });
+            args: [{ standalone: true, selector: 'tui-icon:not([tuiBadge])', template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
+                        {
+                            directive: TuiIcons,
+                            inputs: ['iconStart: icon', 'iconEnd: badge'],
+                        },
+                    ], host: {
+                        '[style.--t-icon-bg]': 'mask()',
+                    }, styles: ["tui-icon{--tui-icon-size: 1em;position:relative;display:inline-flex;inline-size:1em;block-size:1em;font-size:1.5rem;flex-shrink:0;border:0 solid transparent;vertical-align:middle;box-sizing:border-box;mask:var(--t-icon-bg) no-repeat center / calc(100% + 10 * var(--tui-stroke-width, .125rem)) 100%}@media (hover: hover) and (pointer: fine){tui-icon[data-appearance=icon]:hover{color:var(--tui-text-secondary)}}tui-icon[data-icon-end]:before{-webkit-mask-image:var(--t-icon-start),radial-gradient(circle at bottom .1em right .1em,transparent calc(.4em - .5px),#000 .4em);mask-image:var(--t-icon-start),radial-gradient(circle at bottom .1em right .1em,transparent calc(.4em - .5px),#000 .4em);-webkit-mask-composite:source-in;mask-composite:intersect}tui-icon[data-icon-end][data-icon-start=img]:before,tui-icon[data-icon-end][data-icon-start=font]:before{mask:radial-gradient(circle at bottom .1em right .1em,transparent calc(.4em - .5px),#000 .4em)}tui-icon[data-icon-end]:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}tui-icon[data-icon-start]:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}tui-icon[data-icon-start]:after{transform:translate(36%,36%);--tui-icon-size: .5715em}\n"] }]
+        }] });
 
 class TuiIconPipe {
     constructor() {
         this.transform = tuiInjectIconResolver();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiIconPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.9", ngImport: i0, type: TuiIconPipe, isStandalone: true, name: "tuiIcon" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiIconPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.15", ngImport: i0, type: TuiIconPipe, isStandalone: true, name: "tuiIcon" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: TuiIconPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiIconPipe, decorators: [{
             type: Pipe,
             args: [{
                     standalone: true,

package/fesm2022/taiga-ui-core-components-icon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-core-components-icon.mjs","sources":["../../../projects/core/components/icon/icon.component.ts","../../../projects/core/components/icon/icon.pipe.ts","../../../projects/core/components/icon/taiga-ui-core-components-icon.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    inject,\n    Input,\n    signal,\n    ViewEncapsulation,\n} from '@angular/core';\nimport {type TuiStringHandler} from '@taiga-ui/cdk/types';\nimport {\n    TUI_ICON_END,\n    TUI_ICON_START,\n    tuiGetIconMode,\n    tuiInjectIconResolver,\n} from '@taiga-ui/core/tokens';\n\n@Component({\n    standalone: true,\n    selector: 'tui-icon',\n    template: '',\n    styles: ['@import \"@taiga-ui/core/styles/components/icon.less\";'],\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[style.--t-icon]': 'resource() || \"url()\"',\n        '[style.--t-icon-bg]': 'bgResource()',\n        '[attr.data-icon]': 'mode()',\n    },\n})\nexport class TuiIcon {\n    protected readonly resolver: TuiStringHandler<string> = tuiInjectIconResolver();\n    protected readonly src = signal(\n        inject(TUI_ICON_START, {self: true, optional: true}) ||\n            inject(TUI_ICON_END, {self: true, optional: true}),\n    );\n\n    protected readonly bg = signal<string | null>(null);\n    protected readonly resource = computed(() => this.resolve(this.src()));\n    protected readonly mode = computed(() => tuiGetIconMode(this.src()));\n    protected readonly bgResource = computed(() => this.resolve(this.bg()));\n\n    @Input()\n    public set icon(icon: string) {\n        this.src.set(icon);\n    }\n\n    @Input()\n    public set background(background: string) {\n        this.bg.set(background);\n    }\n\n    public resolve(value?: string | null): string | null {\n        if (!value) {\n            return null;\n        }\n\n        return tuiGetIconMode(value) === 'font'\n            ? `'${this.resolver(value)}'`\n            : `url(${this.resolver(value)})`;\n    }\n}\n","import {Pipe, type PipeTransform} from '@angular/core';\nimport {type TuiStringHandler} from '@taiga-ui/cdk/types';\nimport {tuiInjectIconResolver} from '@taiga-ui/core/tokens';\n\n@Pipe({\n    standalone: true,\n    name: 'tuiIcon',\n})\nexport class TuiIconPipe implements PipeTransform {\n    public readonly transform: TuiStringHandler<string> = tuiInjectIconResolver();\n}\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-core-components-icon.mjs","sources":["../../../projects/core/components/icon/icon.component.ts","../../../projects/core/components/icon/icon.pipe.ts","../../../projects/core/components/icon/taiga-ui-core-components-icon.ts"],"sourcesContent":["import {\n    ChangeDetectionStrategy,\n    Component,\n    computed,\n    inject,\n    input,\n    ViewEncapsulation,\n} from '@angular/core';\nimport {TuiIcons} from '@taiga-ui/core/directives';\n\n@Component({\n    standalone: true,\n    // :not([tuiBadge]) is required to avoid double matching of TuiIcons\n    selector: 'tui-icon:not([tuiBadge])',\n    template: '',\n    styles: '@import \"@taiga-ui/core/styles/components/icon.less\";',\n    encapsulation: ViewEncapsulation.None,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    hostDirectives: [\n        {\n            directive: TuiIcons,\n            inputs: ['iconStart: icon', 'iconEnd: badge'],\n        },\n    ],\n    host: {\n        '[style.--t-icon-bg]': 'mask()',\n    },\n})\nexport class TuiIcon {\n    protected readonly icons = inject(TuiIcons);\n    protected readonly mask = computed(() => this.icons.resolve(this.background()));\n\n    public readonly background = input('');\n}\n","import {Pipe, type PipeTransform} from '@angular/core';\nimport {type TuiStringHandler} from '@taiga-ui/cdk/types';\nimport {tuiInjectIconResolver} from '@taiga-ui/core/tokens';\n\n@Pipe({\n    standalone: true,\n    name: 'tuiIcon',\n})\nexport class TuiIconPipe implements PipeTransform {\n    public readonly transform: TuiStringHandler<string> = tuiInjectIconResolver();\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;MA4Ba,OAAO,CAAA;AAlBpB,IAAA,WAAA,GAAA;AAmBuB,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC;AACxB,QAAA,IAAA,CAAA,IAAI,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;AAE/D,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAC,EAAE,CAAC;AACzC;+GALY,OAAO,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAP,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,OAAO,iYAdN,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,8sCAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAcH,OAAO,EAAA,UAAA,EAAA,CAAA;kBAlBnB,SAAS;AACM,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EAEN,QAAA,EAAA,0BAA0B,EAC1B,QAAA,EAAA,EAAE,EAEG,aAAA,EAAA,iBAAiB,CAAC,IAAI,EACpB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAC/B,cAAA,EAAA;AACZ,wBAAA;AACI,4BAAA,SAAS,EAAE,QAAQ;AACnB,4BAAA,MAAM,EAAE,CAAC,iBAAiB,EAAE,gBAAgB,CAAC;AAChD,yBAAA;qBACJ,EACK,IAAA,EAAA;AACF,wBAAA,qBAAqB,EAAE,QAAQ;AAClC,qBAAA,EAAA,MAAA,EAAA,CAAA,8sCAAA,CAAA,EAAA;;;MClBQ,WAAW,CAAA;AAJxB,IAAA,WAAA,GAAA;QAKoB,IAAS,CAAA,SAAA,GAA6B,qBAAqB,EAAE;AAChF;+GAFY,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA,CAAA;6GAAX,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,CAAA;;4FAAX,WAAW,EAAA,UAAA,EAAA,CAAA;kBAJvB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACF,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE,SAAS;AAClB,iBAAA;;;ACPD;;AAEG;;;;"}