@taiga-ui/legacy 4.7.0 → 4.8.0

package/fesm2022/taiga-ui-legacy-classes.mjs

@@ -17,8 +17,8 @@ const TUI = 'tui_interactive_';
  * @deprecated: drop in v5.0
  */
 class AbstractTuiInteractive {
-    static { this.autoId = 0; }
     constructor() {
+        this.autoIdString = `${TUI}${AbstractTuiInteractive.autoId++}${Date.now()}`;
         this.focusVisible = false;
         this.pseudoHover = null;
         this.pseudoActive = null;
@@ -33,8 +33,8 @@ class AbstractTuiInteractive {
          */
         this.focusedChange = new EventEmitter();
         this.focusVisibleChange = new EventEmitter();
-        this.autoIdString = `${TUI}${AbstractTuiInteractive.autoId++}${Date.now()}`;
     }
+    static { this.autoId = 0; }
     get computedDisabled() {
         return this.disabled;
     }
@@ -75,7 +75,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         '[class._focus-visible]': 'computedFocusVisible',
                     },
                 }]
-        }], ctorParameters: function () { return []; }, propDecorators: { pseudoHover: [{
+        }], propDecorators: { pseudoHover: [{
                 type: Input
             }], pseudoActive: [{
                 type: Input

package/fesm2022/taiga-ui-legacy-classes.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-legacy-classes.mjs","sources":["../../../projects/legacy/classes/interactive.ts","../../../projects/legacy/classes/control.ts","../../../projects/legacy/classes/abstract-native-select.ts","../../../projects/legacy/classes/abstract-textfield-host.ts","../../../projects/legacy/classes/controller.ts","../../../projects/legacy/classes/multiple-control.ts","../../../projects/legacy/classes/named-day.ts","../../../projects/legacy/classes/nullable-control.ts","../../../projects/legacy/classes/stringifiable-item.ts","../../../projects/legacy/classes/taiga-ui-legacy-classes.ts"],"sourcesContent":["import {Directive, EventEmitter, Input, Output} from '@angular/core';\n\nconst TUI = 'tui_interactive_';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive({\n    standalone: false,\n    host: {\n        '[attr.data-focused]': 'pseudoFocus',\n        '[class._disabled]': 'computedDisabled',\n        '[class._focused]': 'computedFocused',\n        '[class._focus-visible]': 'computedFocusVisible',\n    },\n})\nexport abstract class AbstractTuiInteractive {\n    private static autoId = 0;\n\n    public abstract disabled: boolean;\n\n    public abstract focused: boolean;\n\n    private readonly autoIdString: string;\n\n    protected focusVisible = false;\n\n    @Input()\n    public pseudoHover: boolean | null = null;\n\n    @Input()\n    public pseudoActive: boolean | null = null;\n\n    @Input()\n    public pseudoFocus: boolean | null = null;\n\n    /**\n     * Determines if component is focusable with keyboard.\n     */\n    @Input()\n    public focusable = true;\n\n    @Input()\n    public nativeId = '';\n\n    /**\n     * Emits 'true' on focus and 'false' on blur.\n     */\n    @Output()\n    public readonly focusedChange = new EventEmitter<boolean>();\n\n    @Output()\n    public readonly focusVisibleChange = new EventEmitter<boolean>();\n\n    constructor() {\n        this.autoIdString = `${TUI}${AbstractTuiInteractive.autoId++}${Date.now()}`;\n    }\n\n    public get computedDisabled(): boolean {\n        return this.disabled;\n    }\n\n    public get computedFocused(): boolean {\n        return !this.computedDisabled && (this.pseudoFocus ?? this.focused);\n    }\n\n    public get computedFocusVisible(): boolean {\n        return !this.computedDisabled && (this.pseudoFocus ?? this.focusVisible);\n    }\n\n    public get computedFocusable(): boolean {\n        return !this.computedDisabled && (this.focusable || this.focused);\n    }\n\n    // TODO: 3.0 Consider removing since native input is exposed\n    public get id(): string {\n        return this.nativeId || this.autoIdString;\n    }\n\n    protected updateFocused(focused: boolean): void {\n        this.focusedChange.emit(focused);\n    }\n\n    protected updateFocusVisible(focusVisible: boolean): void {\n        if (this.focusVisible === focusVisible) {\n            return;\n        }\n\n        this.focusVisible = focusVisible;\n        this.focusVisibleChange.emit(focusVisible);\n    }\n}\n","/// <reference types=\"@taiga-ui/tsconfig/ng-dev-mode\" />\nimport type {OnInit, Provider, Type} from '@angular/core';\nimport {ChangeDetectorRef, DestroyRef, Directive, inject, Input} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport type {AbstractControl, ControlValueAccessor} from '@angular/forms';\nimport {NgControl, NgModel} from '@angular/forms';\nimport {TuiValueTransformer} from '@taiga-ui/cdk/classes';\nimport {EMPTY_FUNCTION} from '@taiga-ui/cdk/constants';\nimport {tuiIsPresent, tuiProvide} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {\n    delay,\n    distinctUntilChanged,\n    filter,\n    map,\n    merge,\n    startWith,\n    Subject,\n    switchMap,\n} from 'rxjs';\n\nimport {AbstractTuiInteractive} from './interactive';\n\n/**\n * @deprecated: drop in v5.0\n * Basic ControlValueAccessor class to build form components upon\n */\n@Directive({\n    standalone: false,\n    host: {\n        '[class._readonly]': 'readOnly',\n        '[class._invalid]': 'computedInvalid',\n    },\n})\nexport abstract class AbstractTuiControl<T>\n    extends AbstractTuiInteractive\n    implements OnInit, ControlValueAccessor\n{\n    private readonly ngControl = inject(NgControl, {optional: true});\n    private previousInternalValue?: T | null;\n    private readonly refresh$ = new Subject<void>();\n\n    protected onTouched = EMPTY_FUNCTION;\n    protected onChange = EMPTY_FUNCTION;\n    protected readonly fallbackValue = this.getFallbackValue();\n    protected destroyRef = inject(DestroyRef);\n    protected readonly cdr = inject(ChangeDetectorRef);\n    protected readonly valueTransformer = inject<TuiValueTransformer<T>>(\n        TuiValueTransformer,\n        {optional: true},\n    );\n\n    @Input()\n    public readOnly = false;\n\n    @Input()\n    public pseudoInvalid: boolean | null = null;\n\n    constructor() {\n        super();\n\n        if (ngDevMode && this.ngControl === null) {\n            console.assert(\n                false,\n                `NgControl not injected in ${this.constructor.name}!\\n`,\n                'Use [(ngModel)] or [formControl] or formControlName for correct work.',\n            );\n        }\n\n        if (this.ngControl) {\n            this.ngControl.valueAccessor = this;\n        }\n    }\n\n    protected abstract getFallbackValue(): T;\n\n    public get computedInvalid(): boolean {\n        return (\n            this.interactive &&\n            (this.pseudoInvalid !== null\n                ? this.pseudoInvalid\n                : this.touched && this.invalid)\n        );\n    }\n\n    public get value(): T {\n        return this.previousInternalValue ?? this.fallbackValue;\n    }\n\n    public set value(value: T) {\n        this.updateValue(value);\n    }\n\n    public get safeCurrentValue(): T {\n        return this.rawValue ?? this.fallbackValue;\n    }\n\n    public get invalid(): boolean {\n        return this.safeNgControlData<boolean>(({invalid}) => invalid, false);\n    }\n\n    public get valid(): boolean {\n        return this.safeNgControlData<boolean>(({valid}) => valid, false);\n    }\n\n    public get touched(): boolean {\n        return this.safeNgControlData<boolean>(({touched}) => touched, false);\n    }\n\n    public get disabled(): boolean {\n        return this.safeNgControlData<boolean>(({disabled}) => disabled, false);\n    }\n\n    public get interactive(): boolean {\n        return !this.readOnly && !this.computedDisabled;\n    }\n\n    public get control(): AbstractControl | null {\n        return this.safeNgControlData<AbstractControl | null>(\n            ({control}) => control,\n            null,\n        );\n    }\n\n    public get computedName(): string | null {\n        return this.controlName?.toString() ?? null;\n    }\n\n    public get controlName(): string | null {\n        return this.ngControl?.name?.toString() ?? null;\n    }\n\n    public ngOnInit(): void {\n        this.refresh$\n            .pipe(\n                delay(0),\n                startWith(null),\n                map(() => this.ngControl?.control),\n                filter(tuiIsPresent),\n                distinctUntilChanged(),\n                switchMap((control) =>\n                    merge(control.valueChanges, control.statusChanges),\n                ),\n                takeUntilDestroyed(this.destroyRef),\n            )\n            .subscribe(() => {\n                this.refreshLocalValue(this.safeCurrentValue);\n            });\n    }\n\n    public checkControlUpdate(): void {\n        this.cdr.markForCheck();\n    }\n\n    public registerOnChange(onChange: (value: T | unknown) => void): void {\n        this.onChange = (componentValue: T) => {\n            onChange(this.toControlValue(componentValue));\n        };\n\n        this.refresh$.next();\n    }\n\n    public registerOnTouched(onTouched: () => void): void {\n        this.onTouched = onTouched;\n    }\n\n    public setDisabledState(): void {\n        this.checkControlUpdate();\n    }\n\n    public writeValue(value: T | null): void {\n        const controlValue =\n            this.ngControl instanceof NgModel && this.previousInternalValue === undefined\n                ? this.ngControl.model\n                : value;\n\n        this.refreshLocalValue(this.fromControlValue(controlValue));\n    }\n\n    protected override updateFocused(focused: boolean): void {\n        if (!focused) {\n            this.controlMarkAsTouched();\n        }\n\n        super.updateFocused(focused);\n    }\n\n    /**\n     * @deprecated use `value` setter\n     */\n    protected updateValue(value: T): void {\n        if (this.disabled || this.valueIdenticalComparator(this.value, value)) {\n            return;\n        }\n\n        this.previousInternalValue = value;\n        this.controlSetValue(value);\n    }\n\n    protected valueIdenticalComparator(oldValue: T, newValue: T): boolean {\n        return oldValue === newValue;\n    }\n\n    private get rawValue(): T | undefined {\n        const {ngControl} = this;\n\n        if (ngControl === null) {\n            return undefined;\n        }\n\n        const controlValue =\n            ngControl instanceof NgModel && this.previousInternalValue === undefined\n                ? ngControl.viewModel\n                : ngControl.value;\n\n        return this.fromControlValue(controlValue);\n    }\n\n    private safeNgControlData<T>(\n        extractor: (ngControl: NgControl) => T | null | undefined,\n        defaultFieldValue: T,\n    ): T {\n        return (this.ngControl && extractor(this.ngControl)) ?? defaultFieldValue;\n    }\n\n    private controlMarkAsTouched(): void {\n        this.onTouched();\n        this.checkControlUpdate();\n    }\n\n    private controlSetValue(value: T): void {\n        this.onChange(value);\n        this.checkControlUpdate();\n    }\n\n    private refreshLocalValue(value: T | null): void {\n        this.previousInternalValue = value;\n        this.checkControlUpdate();\n    }\n\n    private fromControlValue(controlValue: unknown): T {\n        return this.valueTransformer\n            ? this.valueTransformer.fromControlValue(controlValue)\n            : (controlValue as T);\n    }\n\n    private toControlValue(componentValue: T): unknown {\n        return this.valueTransformer\n            ? this.valueTransformer.toControlValue(componentValue)\n            : componentValue;\n    }\n}\n\nexport function tuiAsControl<T>(control: Type<AbstractTuiControl<T>>): Provider {\n    return tuiProvide(AbstractTuiControl, control);\n}\n","import {Directive, inject, Input, TemplateRef, ViewChild} from '@angular/core';\nimport {tuiInjectId} from '@taiga-ui/cdk/services';\nimport type {TuiBooleanHandler} from '@taiga-ui/cdk/types';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {TuiDataListDirective} from '@taiga-ui/core/components/data-list';\nimport {TUI_ITEMS_HANDLERS} from '@taiga-ui/kit/tokens';\nimport type {TuiTextfieldHost} from '@taiga-ui/legacy/tokens';\nimport {TUI_TEXTFIELD_HOST} from '@taiga-ui/legacy/tokens';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive({\n    standalone: false,\n    host: {\n        '[id]': 'id',\n    },\n})\nexport abstract class AbstractTuiNativeSelect<H = TuiTextfieldHost, T = string> {\n    @ViewChild(TuiDataListDirective, {read: TemplateRef, static: true})\n    protected readonly datalist: TemplateRef<any> | null = null;\n\n    protected readonly autoId = tuiInjectId();\n    protected readonly el = tuiInjectElement<HTMLSelectElement>();\n    protected readonly host = inject<H>(TUI_TEXTFIELD_HOST);\n    protected readonly control = inject(AbstractTuiControl);\n    protected readonly itemsHandlers = inject(TUI_ITEMS_HANDLERS);\n\n    @Input()\n    public disabledItemHandler: TuiBooleanHandler<T> | null = null;\n\n    @Input()\n    public placeholder = '';\n\n    protected get id(): string {\n        return this.el.id || this.autoId;\n    }\n\n    protected get emptyOption(): boolean {\n        return !!this.placeholder && !this.control.value;\n    }\n}\n","import {Directive, inject} from '@angular/core';\nimport type {TuiTextfieldHost} from '@taiga-ui/legacy/tokens';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive()\nexport abstract class AbstractTuiTextfieldHost<T extends AbstractTuiControl<any>>\n    implements TuiTextfieldHost\n{\n    protected readonly host: T = inject<any>(AbstractTuiControl, {optional: true});\n\n    public abstract onValueChange(value: string): void;\n\n    public get readOnly(): boolean {\n        return this.host.readOnly;\n    }\n\n    public get disabled(): boolean {\n        return this.host.computedDisabled;\n    }\n\n    public get invalid(): boolean {\n        return this.host.computedInvalid;\n    }\n\n    public get focusable(): boolean {\n        return this.host.computedFocusable;\n    }\n\n    public get inputMode(): TuiTextfieldHost['inputMode'] {\n        return 'text';\n    }\n\n    public get value(): string {\n        return this.host.value?.toString() || '';\n    }\n\n    public process(_input: HTMLInputElement): void {}\n}\n","import type {OnChanges} from '@angular/core';\nimport {Directive} from '@angular/core';\nimport {Subject} from 'rxjs';\n\n@Directive()\nexport abstract class AbstractTuiController implements OnChanges {\n    public readonly change$ = new Subject<void>();\n\n    public ngOnChanges(): void {\n        this.change$.next();\n    }\n}\n","import {Directive} from '@angular/core';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive()\nexport abstract class AbstractTuiMultipleControl<T> extends AbstractTuiControl<\n    readonly T[]\n> {\n    protected clear(): void {\n        this.value = [];\n    }\n\n    protected getFallbackValue(): readonly T[] {\n        return [];\n    }\n}\n","import type {TuiDay} from '@taiga-ui/cdk/date-time';\n\n/**\n * @deprecated: drop in v5.0\n */\nexport class TuiNamedDay {\n    constructor(\n        public readonly day: TuiDay,\n        private readonly name: string,\n        public readonly displayDay: TuiDay = day,\n    ) {}\n\n    protected toString(): string {\n        return this.name;\n    }\n}\n","import {Directive} from '@angular/core';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive()\nexport abstract class AbstractTuiNullableControl<T> extends AbstractTuiControl<T | null> {\n    protected getFallbackValue(): T | null {\n        return null;\n    }\n}\n","import type {TuiStringHandler} from '@taiga-ui/cdk/types';\n\n/**\n * @deprecated: drop in v5.0\n * Wrapper around an item to add `toString()` method\n */\nexport class TuiStringifiableItem<T> {\n    constructor(\n        public readonly item: T,\n        public readonly stringify: TuiStringHandler<T>,\n    ) {}\n\n    protected toString(): string {\n        return this.stringify(this.item);\n    }\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-legacy-classes.mjs","sources":["../../../projects/legacy/classes/interactive.ts","../../../projects/legacy/classes/control.ts","../../../projects/legacy/classes/abstract-native-select.ts","../../../projects/legacy/classes/abstract-textfield-host.ts","../../../projects/legacy/classes/controller.ts","../../../projects/legacy/classes/multiple-control.ts","../../../projects/legacy/classes/named-day.ts","../../../projects/legacy/classes/nullable-control.ts","../../../projects/legacy/classes/stringifiable-item.ts","../../../projects/legacy/classes/taiga-ui-legacy-classes.ts"],"sourcesContent":["import {Directive, EventEmitter, Input, Output} from '@angular/core';\n\nconst TUI = 'tui_interactive_';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive({\n    standalone: false,\n    host: {\n        '[attr.data-focused]': 'pseudoFocus',\n        '[class._disabled]': 'computedDisabled',\n        '[class._focused]': 'computedFocused',\n        '[class._focus-visible]': 'computedFocusVisible',\n    },\n})\nexport abstract class AbstractTuiInteractive {\n    private static autoId = 0;\n\n    public abstract disabled: boolean;\n\n    public abstract focused: boolean;\n\n    private readonly autoIdString: string = `${TUI}${AbstractTuiInteractive.autoId++}${Date.now()}`;\n\n    protected focusVisible = false;\n\n    @Input()\n    public pseudoHover: boolean | null = null;\n\n    @Input()\n    public pseudoActive: boolean | null = null;\n\n    @Input()\n    public pseudoFocus: boolean | null = null;\n\n    /**\n     * Determines if component is focusable with keyboard.\n     */\n    @Input()\n    public focusable = true;\n\n    @Input()\n    public nativeId = '';\n\n    /**\n     * Emits 'true' on focus and 'false' on blur.\n     */\n    @Output()\n    public readonly focusedChange = new EventEmitter<boolean>();\n\n    @Output()\n    public readonly focusVisibleChange = new EventEmitter<boolean>();\n\n    public get computedDisabled(): boolean {\n        return this.disabled;\n    }\n\n    public get computedFocused(): boolean {\n        return !this.computedDisabled && (this.pseudoFocus ?? this.focused);\n    }\n\n    public get computedFocusVisible(): boolean {\n        return !this.computedDisabled && (this.pseudoFocus ?? this.focusVisible);\n    }\n\n    public get computedFocusable(): boolean {\n        return !this.computedDisabled && (this.focusable || this.focused);\n    }\n\n    // TODO: 3.0 Consider removing since native input is exposed\n    public get id(): string {\n        return this.nativeId || this.autoIdString;\n    }\n\n    protected updateFocused(focused: boolean): void {\n        this.focusedChange.emit(focused);\n    }\n\n    protected updateFocusVisible(focusVisible: boolean): void {\n        if (this.focusVisible === focusVisible) {\n            return;\n        }\n\n        this.focusVisible = focusVisible;\n        this.focusVisibleChange.emit(focusVisible);\n    }\n}\n","/// <reference types=\"@taiga-ui/tsconfig/ng-dev-mode\" />\nimport type {OnInit, Provider, Type} from '@angular/core';\nimport {ChangeDetectorRef, DestroyRef, Directive, inject, Input} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport type {AbstractControl, ControlValueAccessor} from '@angular/forms';\nimport {NgControl, NgModel} from '@angular/forms';\nimport {TuiValueTransformer} from '@taiga-ui/cdk/classes';\nimport {EMPTY_FUNCTION} from '@taiga-ui/cdk/constants';\nimport {tuiIsPresent, tuiProvide} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {\n    delay,\n    distinctUntilChanged,\n    filter,\n    map,\n    merge,\n    startWith,\n    Subject,\n    switchMap,\n} from 'rxjs';\n\nimport {AbstractTuiInteractive} from './interactive';\n\n/**\n * @deprecated: drop in v5.0\n * Basic ControlValueAccessor class to build form components upon\n */\n@Directive({\n    standalone: false,\n    host: {\n        '[class._readonly]': 'readOnly',\n        '[class._invalid]': 'computedInvalid',\n    },\n})\nexport abstract class AbstractTuiControl<T>\n    extends AbstractTuiInteractive\n    implements OnInit, ControlValueAccessor\n{\n    private readonly ngControl = inject(NgControl, {optional: true});\n    private previousInternalValue?: T | null;\n    private readonly refresh$ = new Subject<void>();\n\n    protected onTouched = EMPTY_FUNCTION;\n    protected onChange = EMPTY_FUNCTION;\n    protected readonly fallbackValue = this.getFallbackValue();\n    protected destroyRef = inject(DestroyRef);\n    protected readonly cdr = inject(ChangeDetectorRef);\n    protected readonly valueTransformer = inject<TuiValueTransformer<T>>(\n        TuiValueTransformer,\n        {optional: true},\n    );\n\n    @Input()\n    public readOnly = false;\n\n    @Input()\n    public pseudoInvalid: boolean | null = null;\n\n    constructor() {\n        super();\n\n        if (ngDevMode && this.ngControl === null) {\n            console.assert(\n                false,\n                `NgControl not injected in ${this.constructor.name}!\\n`,\n                'Use [(ngModel)] or [formControl] or formControlName for correct work.',\n            );\n        }\n\n        if (this.ngControl) {\n            this.ngControl.valueAccessor = this;\n        }\n    }\n\n    protected abstract getFallbackValue(): T;\n\n    public get computedInvalid(): boolean {\n        return (\n            this.interactive &&\n            (this.pseudoInvalid !== null\n                ? this.pseudoInvalid\n                : this.touched && this.invalid)\n        );\n    }\n\n    public get value(): T {\n        return this.previousInternalValue ?? this.fallbackValue;\n    }\n\n    public set value(value: T) {\n        this.updateValue(value);\n    }\n\n    public get safeCurrentValue(): T {\n        return this.rawValue ?? this.fallbackValue;\n    }\n\n    public get invalid(): boolean {\n        return this.safeNgControlData<boolean>(({invalid}) => invalid, false);\n    }\n\n    public get valid(): boolean {\n        return this.safeNgControlData<boolean>(({valid}) => valid, false);\n    }\n\n    public get touched(): boolean {\n        return this.safeNgControlData<boolean>(({touched}) => touched, false);\n    }\n\n    public get disabled(): boolean {\n        return this.safeNgControlData<boolean>(({disabled}) => disabled, false);\n    }\n\n    public get interactive(): boolean {\n        return !this.readOnly && !this.computedDisabled;\n    }\n\n    public get control(): AbstractControl | null {\n        return this.safeNgControlData<AbstractControl | null>(\n            ({control}) => control,\n            null,\n        );\n    }\n\n    public get computedName(): string | null {\n        return this.controlName?.toString() ?? null;\n    }\n\n    public get controlName(): string | null {\n        return this.ngControl?.name?.toString() ?? null;\n    }\n\n    public ngOnInit(): void {\n        this.refresh$\n            .pipe(\n                delay(0),\n                startWith(null),\n                map(() => this.ngControl?.control),\n                filter(tuiIsPresent),\n                distinctUntilChanged(),\n                switchMap((control) =>\n                    merge(control.valueChanges, control.statusChanges),\n                ),\n                takeUntilDestroyed(this.destroyRef),\n            )\n            .subscribe(() => {\n                this.refreshLocalValue(this.safeCurrentValue);\n            });\n    }\n\n    public checkControlUpdate(): void {\n        this.cdr.markForCheck();\n    }\n\n    public registerOnChange(onChange: (value: unknown) => void): void {\n        this.onChange = (componentValue: T) => {\n            onChange(this.toControlValue(componentValue));\n        };\n\n        this.refresh$.next();\n    }\n\n    public registerOnTouched(onTouched: () => void): void {\n        this.onTouched = onTouched;\n    }\n\n    public setDisabledState(): void {\n        this.checkControlUpdate();\n    }\n\n    public writeValue(value: T | null): void {\n        const controlValue =\n            this.ngControl instanceof NgModel && this.previousInternalValue === undefined\n                ? this.ngControl.model\n                : value;\n\n        this.refreshLocalValue(this.fromControlValue(controlValue));\n    }\n\n    protected override updateFocused(focused: boolean): void {\n        if (!focused) {\n            this.controlMarkAsTouched();\n        }\n\n        super.updateFocused(focused);\n    }\n\n    /**\n     * @deprecated use `value` setter\n     */\n    protected updateValue(value: T): void {\n        if (this.disabled || this.valueIdenticalComparator(this.value, value)) {\n            return;\n        }\n\n        this.previousInternalValue = value;\n        this.controlSetValue(value);\n    }\n\n    protected valueIdenticalComparator(oldValue: T, newValue: T): boolean {\n        return oldValue === newValue;\n    }\n\n    private get rawValue(): T | undefined {\n        const {ngControl} = this;\n\n        if (ngControl === null) {\n            return undefined;\n        }\n\n        const controlValue =\n            ngControl instanceof NgModel && this.previousInternalValue === undefined\n                ? ngControl.viewModel\n                : ngControl.value;\n\n        return this.fromControlValue(controlValue);\n    }\n\n    private safeNgControlData<T>(\n        extractor: (ngControl: NgControl) => T | null | undefined,\n        defaultFieldValue: T,\n    ): T {\n        return (this.ngControl && extractor(this.ngControl)) ?? defaultFieldValue;\n    }\n\n    private controlMarkAsTouched(): void {\n        this.onTouched();\n        this.checkControlUpdate();\n    }\n\n    private controlSetValue(value: T): void {\n        this.onChange(value);\n        this.checkControlUpdate();\n    }\n\n    private refreshLocalValue(value: T | null): void {\n        this.previousInternalValue = value;\n        this.checkControlUpdate();\n    }\n\n    private fromControlValue(controlValue: unknown): T {\n        return this.valueTransformer\n            ? this.valueTransformer.fromControlValue(controlValue)\n            : (controlValue as T);\n    }\n\n    private toControlValue(componentValue: T): unknown {\n        return this.valueTransformer\n            ? this.valueTransformer.toControlValue(componentValue)\n            : componentValue;\n    }\n}\n\nexport function tuiAsControl<T>(control: Type<AbstractTuiControl<T>>): Provider {\n    return tuiProvide(AbstractTuiControl, control);\n}\n","import {Directive, inject, Input, TemplateRef, ViewChild} from '@angular/core';\nimport {tuiInjectId} from '@taiga-ui/cdk/services';\nimport type {TuiBooleanHandler} from '@taiga-ui/cdk/types';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {TuiDataListDirective} from '@taiga-ui/core/components/data-list';\nimport {TUI_ITEMS_HANDLERS} from '@taiga-ui/kit/tokens';\nimport type {TuiTextfieldHost} from '@taiga-ui/legacy/tokens';\nimport {TUI_TEXTFIELD_HOST} from '@taiga-ui/legacy/tokens';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive({\n    standalone: false,\n    host: {\n        '[id]': 'id',\n    },\n})\nexport abstract class AbstractTuiNativeSelect<H = TuiTextfieldHost, T = string> {\n    @ViewChild(TuiDataListDirective, {read: TemplateRef, static: true})\n    protected readonly datalist: TemplateRef<any> | null = null;\n\n    protected readonly autoId = tuiInjectId();\n    protected readonly el = tuiInjectElement<HTMLSelectElement>();\n    protected readonly host = inject<H>(TUI_TEXTFIELD_HOST);\n    protected readonly control = inject(AbstractTuiControl);\n    protected readonly itemsHandlers = inject(TUI_ITEMS_HANDLERS);\n\n    @Input()\n    public disabledItemHandler: TuiBooleanHandler<T> | null = null;\n\n    @Input()\n    public placeholder = '';\n\n    protected get id(): string {\n        return this.el.id || this.autoId;\n    }\n\n    protected get emptyOption(): boolean {\n        return !!this.placeholder && !this.control.value;\n    }\n}\n","import {Directive, inject} from '@angular/core';\nimport type {TuiTextfieldHost} from '@taiga-ui/legacy/tokens';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive()\nexport abstract class AbstractTuiTextfieldHost<T extends AbstractTuiControl<any>>\n    implements TuiTextfieldHost\n{\n    protected readonly host: T = inject<any>(AbstractTuiControl, {optional: true});\n\n    public abstract onValueChange(value: string): void;\n\n    public get readOnly(): boolean {\n        return this.host.readOnly;\n    }\n\n    public get disabled(): boolean {\n        return this.host.computedDisabled;\n    }\n\n    public get invalid(): boolean {\n        return this.host.computedInvalid;\n    }\n\n    public get focusable(): boolean {\n        return this.host.computedFocusable;\n    }\n\n    public get inputMode(): TuiTextfieldHost['inputMode'] {\n        return 'text';\n    }\n\n    public get value(): string {\n        return this.host.value?.toString() || '';\n    }\n\n    public process(_input: HTMLInputElement): void {}\n}\n","import type {OnChanges} from '@angular/core';\nimport {Directive} from '@angular/core';\nimport {Subject} from 'rxjs';\n\n@Directive()\nexport abstract class AbstractTuiController implements OnChanges {\n    public readonly change$ = new Subject<void>();\n\n    public ngOnChanges(): void {\n        this.change$.next();\n    }\n}\n","import {Directive} from '@angular/core';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive()\nexport abstract class AbstractTuiMultipleControl<T> extends AbstractTuiControl<\n    readonly T[]\n> {\n    protected clear(): void {\n        this.value = [];\n    }\n\n    protected getFallbackValue(): readonly T[] {\n        return [];\n    }\n}\n","import type {TuiDay} from '@taiga-ui/cdk/date-time';\n\n/**\n * @deprecated: drop in v5.0\n */\nexport class TuiNamedDay {\n    constructor(\n        public readonly day: TuiDay,\n        private readonly name: string,\n        public readonly displayDay: TuiDay = day,\n    ) {}\n\n    protected toString(): string {\n        return this.name;\n    }\n}\n","import {Directive} from '@angular/core';\n\nimport {AbstractTuiControl} from './control';\n\n/**\n * @deprecated: drop in v5.0\n */\n@Directive()\nexport abstract class AbstractTuiNullableControl<T> extends AbstractTuiControl<T | null> {\n    protected getFallbackValue(): T | null {\n        return null;\n    }\n}\n","import type {TuiStringHandler} from '@taiga-ui/cdk/types';\n\n/**\n * @deprecated: drop in v5.0\n * Wrapper around an item to add `toString()` method\n */\nexport class TuiStringifiableItem<T> {\n    constructor(\n        public readonly item: T,\n        public readonly stringify: TuiStringHandler<T>,\n    ) {}\n\n    protected toString(): string {\n        return this.stringify(this.item);\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/taiga-ui-legacy-components-arrow.mjs

@@ -45,11 +45,12 @@ class TuiArrowComponent {
         return !this.small ? this.options.iconLarge : this.options.iconSmall;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiArrowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiArrowComponent, isStandalone: true, selector: "tui-arrow", host: { properties: { "class._rotated": "rotated", "class._small": "small" } }, ngImport: i0, template: "<tui-icon\n    *polymorpheusOutlet=\"arrowIcon as src\"\n    [icon]=\"src\"\n/>\n<ng-container *ngIf=\"directive?.tuiDropdownOpenChange | async\" />\n", styles: [":host{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;cursor:pointer;pointer-events:none}:host._rotated{transform:rotate(180deg)}tui-icon{border:.25rem solid transparent}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiArrowComponent, isStandalone: true, selector: "tui-arrow", host: { attributes: { "ngSkipHydration": "true" }, properties: { "class._rotated": "rotated", "class._small": "small" } }, ngImport: i0, template: "<tui-icon\n    *polymorpheusOutlet=\"arrowIcon as src\"\n    [icon]=\"src\"\n/>\n<ng-container *ngIf=\"directive?.tuiDropdownOpenChange | async\" />\n", styles: [":host{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;cursor:pointer;pointer-events:none}:host._rotated{transform:rotate(180deg)}tui-icon{border:.25rem solid transparent}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiArrowComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, selector: 'tui-arrow', imports: [AsyncPipe, NgIf, PolymorpheusOutlet, PolymorpheusTemplate, TuiIcon], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        ngSkipHydration: 'true',
                         '[class._rotated]': 'rotated',
                         '[class._small]': 'small',
                     }, template: "<tui-icon\n    *polymorpheusOutlet=\"arrowIcon as src\"\n    [icon]=\"src\"\n/>\n<ng-container *ngIf=\"directive?.tuiDropdownOpenChange | async\" />\n", styles: [":host{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:block;cursor:pointer;pointer-events:none}:host._rotated{transform:rotate(180deg)}tui-icon{border:.25rem solid transparent}\n"] }]

package/fesm2022/taiga-ui-legacy-components-arrow.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"taiga-ui-legacy-components-arrow.mjs","sources":["../../../projects/legacy/components/arrow/arrow.options.ts","../../../projects/legacy/components/arrow/arrow.component.ts","../../../projects/legacy/components/arrow/arrow.template.html","../../../projects/legacy/components/arrow/arrow.providers.ts","../../../projects/legacy/components/arrow/taiga-ui-legacy-components-arrow.ts"],"sourcesContent":["import type {Provider} from '@angular/core';\nimport {tuiCreateToken, tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {PolymorpheusContent} from '@taiga-ui/polymorpheus';\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport interface TuiArrowOptions {\n    readonly iconLarge: PolymorpheusContent;\n    readonly iconSmall: PolymorpheusContent;\n}\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport const TUI_ARROW_DEFAULT_OPTIONS: TuiArrowOptions = {\n    iconSmall: '@tui.chevron-down',\n    iconLarge: '@tui.chevron-down',\n};\n\n/**\n * @deprecated: drop in v5.0\n * Default parameters for arrow component\n */\nexport const TUI_ARROW_OPTIONS = tuiCreateToken(TUI_ARROW_DEFAULT_OPTIONS);\n\nexport function tuiArrowOptionsProvider(options: Partial<TuiArrowOptions>): Provider {\n    return tuiProvideOptions(TUI_ARROW_OPTIONS, options, TUI_ARROW_DEFAULT_OPTIONS);\n}\n","import {AsyncPipe, NgIf} from '@angular/common';\nimport {ChangeDetectionStrategy, Component, inject} from '@angular/core';\nimport {TuiIcon} from '@taiga-ui/core/components/icon';\nimport {TuiDropdownOpen} from '@taiga-ui/core/directives/dropdown';\nimport {tuiSizeBigger} from '@taiga-ui/core/utils/miscellaneous';\nimport {AbstractTuiControl} from '@taiga-ui/legacy/classes';\nimport {TUI_TEXTFIELD_SIZE} from '@taiga-ui/legacy/directives';\nimport type {PolymorpheusContent} from '@taiga-ui/polymorpheus';\nimport {\n    PolymorpheusComponent,\n    PolymorpheusOutlet,\n    PolymorpheusTemplate,\n} from '@taiga-ui/polymorpheus';\n\nimport {TUI_ARROW_OPTIONS} from './arrow.options';\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\n@Component({\n    standalone: true,\n    selector: 'tui-arrow',\n    imports: [AsyncPipe, NgIf, PolymorpheusOutlet, PolymorpheusTemplate, TuiIcon],\n    templateUrl: './arrow.template.html',\n    styleUrls: ['./arrow.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        '[class._rotated]': 'rotated',\n        '[class._small]': 'small',\n    },\n})\nexport class TuiArrowComponent {\n    private readonly control: any = inject(AbstractTuiControl, {optional: true});\n    private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE);\n    private readonly options = inject(TUI_ARROW_OPTIONS);\n    protected readonly directive = inject(TuiDropdownOpen, {optional: true});\n\n    protected get rotated(): boolean {\n        return this.directive?.tuiDropdownOpen || !!this.control.pseudoOpen || false;\n    }\n\n    protected get small(): boolean {\n        return !tuiSizeBigger(this.textfieldSize.size);\n    }\n\n    protected get arrowIcon(): PolymorpheusContent {\n        return !this.small ? this.options.iconLarge : this.options.iconSmall;\n    }\n}\n\nexport const TUI_ARROW = new PolymorpheusComponent(TuiArrowComponent);\n","<tui-icon\n    *polymorpheusOutlet=\"arrowIcon as src\"\n    [icon]=\"src\"\n/>\n<ng-container *ngIf=\"directive?.tuiDropdownOpenChange | async\" />\n","import type {Provider} from '@angular/core';\nimport type {TuiContext} from '@taiga-ui/cdk/types';\nimport {tuiCreateToken, tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {TuiSizeL, TuiSizeM, TuiSizeS} from '@taiga-ui/core/types';\nimport type {PolymorpheusContent} from '@taiga-ui/polymorpheus';\n\nimport {TUI_ARROW} from './arrow.component';\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport interface TuiArrowMode {\n    readonly disabled: PolymorpheusContent<TuiContext<TuiSizeL | TuiSizeM | TuiSizeS>>;\n    readonly interactive: PolymorpheusContent<TuiContext<TuiSizeL | TuiSizeM | TuiSizeS>>;\n}\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport const TUI_ARROW_DEFAULT_MODE: TuiArrowMode = {\n    interactive: TUI_ARROW,\n    disabled: TUI_ARROW,\n};\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport const TUI_ARROW_MODE = tuiCreateToken(TUI_ARROW_DEFAULT_MODE);\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport function tuiArrowModeProvider(options: Partial<TuiArrowMode>): Provider {\n    return tuiProvideOptions(TUI_ARROW_MODE, options, TUI_ARROW_DEFAULT_MODE);\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-legacy-components-arrow.mjs","sources":["../../../projects/legacy/components/arrow/arrow.options.ts","../../../projects/legacy/components/arrow/arrow.component.ts","../../../projects/legacy/components/arrow/arrow.template.html","../../../projects/legacy/components/arrow/arrow.providers.ts","../../../projects/legacy/components/arrow/taiga-ui-legacy-components-arrow.ts"],"sourcesContent":["import type {Provider} from '@angular/core';\nimport {tuiCreateToken, tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {PolymorpheusContent} from '@taiga-ui/polymorpheus';\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport interface TuiArrowOptions {\n    readonly iconLarge: PolymorpheusContent;\n    readonly iconSmall: PolymorpheusContent;\n}\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport const TUI_ARROW_DEFAULT_OPTIONS: TuiArrowOptions = {\n    iconSmall: '@tui.chevron-down',\n    iconLarge: '@tui.chevron-down',\n};\n\n/**\n * @deprecated: drop in v5.0\n * Default parameters for arrow component\n */\nexport const TUI_ARROW_OPTIONS = tuiCreateToken(TUI_ARROW_DEFAULT_OPTIONS);\n\nexport function tuiArrowOptionsProvider(options: Partial<TuiArrowOptions>): Provider {\n    return tuiProvideOptions(TUI_ARROW_OPTIONS, options, TUI_ARROW_DEFAULT_OPTIONS);\n}\n","import {AsyncPipe, NgIf} from '@angular/common';\nimport {ChangeDetectionStrategy, Component, inject} from '@angular/core';\nimport {TuiIcon} from '@taiga-ui/core/components/icon';\nimport {TuiDropdownOpen} from '@taiga-ui/core/directives/dropdown';\nimport {tuiSizeBigger} from '@taiga-ui/core/utils/miscellaneous';\nimport {AbstractTuiControl} from '@taiga-ui/legacy/classes';\nimport {TUI_TEXTFIELD_SIZE} from '@taiga-ui/legacy/directives';\nimport type {PolymorpheusContent} from '@taiga-ui/polymorpheus';\nimport {\n    PolymorpheusComponent,\n    PolymorpheusOutlet,\n    PolymorpheusTemplate,\n} from '@taiga-ui/polymorpheus';\n\nimport {TUI_ARROW_OPTIONS} from './arrow.options';\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\n@Component({\n    standalone: true,\n    selector: 'tui-arrow',\n    imports: [AsyncPipe, NgIf, PolymorpheusOutlet, PolymorpheusTemplate, TuiIcon],\n    templateUrl: './arrow.template.html',\n    styleUrls: ['./arrow.style.less'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    host: {\n        ngSkipHydration: 'true',\n        '[class._rotated]': 'rotated',\n        '[class._small]': 'small',\n    },\n})\nexport class TuiArrowComponent {\n    private readonly control: any = inject(AbstractTuiControl, {optional: true});\n    private readonly textfieldSize = inject(TUI_TEXTFIELD_SIZE);\n    private readonly options = inject(TUI_ARROW_OPTIONS);\n    protected readonly directive = inject(TuiDropdownOpen, {optional: true});\n\n    protected get rotated(): boolean {\n        return this.directive?.tuiDropdownOpen || !!this.control.pseudoOpen || false;\n    }\n\n    protected get small(): boolean {\n        return !tuiSizeBigger(this.textfieldSize.size);\n    }\n\n    protected get arrowIcon(): PolymorpheusContent {\n        return !this.small ? this.options.iconLarge : this.options.iconSmall;\n    }\n}\n\nexport const TUI_ARROW = new PolymorpheusComponent(TuiArrowComponent);\n","<tui-icon\n    *polymorpheusOutlet=\"arrowIcon as src\"\n    [icon]=\"src\"\n/>\n<ng-container *ngIf=\"directive?.tuiDropdownOpenChange | async\" />\n","import type {Provider} from '@angular/core';\nimport type {TuiContext} from '@taiga-ui/cdk/types';\nimport {tuiCreateToken, tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {TuiSizeL, TuiSizeM, TuiSizeS} from '@taiga-ui/core/types';\nimport type {PolymorpheusContent} from '@taiga-ui/polymorpheus';\n\nimport {TUI_ARROW} from './arrow.component';\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport interface TuiArrowMode {\n    readonly disabled: PolymorpheusContent<TuiContext<TuiSizeL | TuiSizeM | TuiSizeS>>;\n    readonly interactive: PolymorpheusContent<TuiContext<TuiSizeL | TuiSizeM | TuiSizeS>>;\n}\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport const TUI_ARROW_DEFAULT_MODE: TuiArrowMode = {\n    interactive: TUI_ARROW,\n    disabled: TUI_ARROW,\n};\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport const TUI_ARROW_MODE = tuiCreateToken(TUI_ARROW_DEFAULT_MODE);\n\n/**\n * @deprecated: drop in v5.0 use {@link TuiChevron}\n */\nexport function tuiArrowModeProvider(options: Partial<TuiArrowMode>): Provider {\n    return tuiProvideOptions(TUI_ARROW_MODE, options, TUI_ARROW_DEFAULT_MODE);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/taiga-ui-legacy-components-color-selector.mjs

@@ -75,11 +75,13 @@ class TuiColorEditComponent {
         this.colorChange.emit(color);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiColorEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiColorEditComponent, selector: "tui-color-edit", inputs: { color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<tui-select\n    tuiDropdownAlign=\"left\"\n    tuiDropdownLimitWidth=\"min\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-select\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [(ngModel)]=\"mode\"\n>\n    <tui-data-list\n        *tuiDataList\n        size=\"s\"\n    >\n        <button\n            *ngFor=\"let item of modes\"\n            tuiOption\n            type=\"button\"\n            [value]=\"item\"\n        >\n            {{ item }}\n        </button>\n    </tui-data-list>\n</tui-select>\n<tui-primitive-textfield\n    *ngIf=\"isHex; else rgb\"\n    tuiTextfieldSize=\"m\"\n    [maskito]=\"hexMask\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [value]=\"hex\"\n    (valueChange)=\"onHexChange($event)\"\n/>\n<ng-template #rgb>\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[0]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange($event, color[1], color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[1]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], $event, color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[2]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], color[1], $event, color[3])\"\n    />\n</ng-template>\n<tui-input-number\n    tuiTextfieldPostfix=\"%\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-opacity\"\n    [max]=\"100\"\n    [min]=\"0\"\n    [ngModel]=\"opacity\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    (ngModelChange)=\"onRgbChange(color[0], color[1], color[2], $event / 100)\"\n/>\n", styles: [":host{display:flex}.t-select{inline-size:5.875rem}.t-opacity{inline-size:4.275rem}.t-rgb,.t-opacity{text-align:center}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: i4.TuiPrimitiveTextfieldComponent, selector: "tui-primitive-textfield", inputs: ["editable", "iconCleaner", "readOnly", "invalid", "disabled", "value"], outputs: ["valueChange"] }, { kind: "directive", type: i4.TuiPrimitiveTextfieldDirective, selector: "tui-primitive-textfield" }, { kind: "directive", type: i5.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { kind: "directive", type: i5.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { kind: "directive", type: i5.TuiTextfieldPostfixDirective, selector: "[tuiTextfieldPostfix]", inputs: ["tuiTextfieldPostfix"] }, { kind: "component", type: i6.TuiInputNumberComponent, selector: "tui-input-number", inputs: ["min", "max", "step"] }, { kind: "directive", type: i6.TuiInputNumberDirective, selector: "tui-input-number" }, { kind: "component", type: i7.TuiSelectComponent, selector: "tui-select", inputs: ["stringify", "identityMatcher", "valueContent"] }, { kind: "directive", type: i7.TuiSelectDirective, selector: "tui-select" }, { kind: "directive", type: i1$1.TuiDropdownOptionsDirective, selector: "[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]", inputs: ["tuiDropdownAlign", "tuiDropdownAppearance", "tuiDropdownDirection", "tuiDropdownLimitWidth", "tuiDropdownMinHeight", "tuiDropdownMaxHeight", "tuiDropdownOffset"] }, { kind: "component", type: i2$1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "directive", type: i2$1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { kind: "component", type: i2$1.TuiOption, selector: "button[tuiOption], a[tuiOption], label[tuiOption]", inputs: ["disabled", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiColorEditComponent, selector: "tui-color-edit", inputs: { color: "color" }, outputs: { colorChange: "colorChange" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<tui-select\n    tuiDropdownAlign=\"left\"\n    tuiDropdownLimitWidth=\"min\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-select\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [(ngModel)]=\"mode\"\n>\n    <tui-data-list\n        *tuiDataList\n        size=\"s\"\n    >\n        <button\n            *ngFor=\"let item of modes\"\n            tuiOption\n            type=\"button\"\n            [value]=\"item\"\n        >\n            {{ item }}\n        </button>\n    </tui-data-list>\n</tui-select>\n<tui-primitive-textfield\n    *ngIf=\"isHex; else rgb\"\n    tuiTextfieldSize=\"m\"\n    [maskito]=\"hexMask\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [value]=\"hex\"\n    (valueChange)=\"onHexChange($event)\"\n/>\n<ng-template #rgb>\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[0]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange($event, color[1], color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[1]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], $event, color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[2]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], color[1], $event, color[3])\"\n    />\n</ng-template>\n<tui-input-number\n    tuiTextfieldPostfix=\"%\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-opacity\"\n    [max]=\"100\"\n    [min]=\"0\"\n    [ngModel]=\"opacity\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    (ngModelChange)=\"onRgbChange(color[0], color[1], color[2], $event / 100)\"\n/>\n", styles: [":host{display:flex}.t-select{inline-size:5.875rem}.t-opacity{inline-size:4.275rem}.t-rgb,.t-opacity{text-align:center}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MaskitoDirective, selector: "[maskito]", inputs: ["maskito", "maskitoElement"] }, { kind: "component", type: i4.TuiPrimitiveTextfieldComponent, selector: "tui-primitive-textfield", inputs: ["editable", "iconCleaner", "readOnly", "invalid", "disabled", "value"], outputs: ["valueChange"] }, { kind: "directive", type: i4.TuiPrimitiveTextfieldDirective, selector: "tui-primitive-textfield" }, { kind: "directive", type: i5.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { kind: "directive", type: i5.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { kind: "directive", type: i5.TuiTextfieldPostfixDirective, selector: "[tuiTextfieldPostfix]", inputs: ["tuiTextfieldPostfix"] }, { kind: "component", type: i6.TuiInputNumberComponent, selector: "tui-input-number", inputs: ["min", "max", "step"] }, { kind: "directive", type: i6.TuiInputNumberDirective, selector: "tui-input-number" }, { kind: "component", type: i7.TuiSelectComponent, selector: "tui-select", inputs: ["stringify", "identityMatcher", "valueContent"] }, { kind: "directive", type: i7.TuiSelectDirective, selector: "tui-select" }, { kind: "directive", type: i1$1.TuiDropdownOptionsDirective, selector: "[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]", inputs: ["tuiDropdownAlign", "tuiDropdownAppearance", "tuiDropdownDirection", "tuiDropdownLimitWidth", "tuiDropdownMinHeight", "tuiDropdownMaxHeight", "tuiDropdownOffset"] }, { kind: "component", type: i2$1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "directive", type: i2$1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { kind: "component", type: i2$1.TuiOption, selector: "button[tuiOption], a[tuiOption], label[tuiOption]", inputs: ["disabled", "value"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiColorEditComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'tui-color-edit', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-select\n    tuiDropdownAlign=\"left\"\n    tuiDropdownLimitWidth=\"min\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-select\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [(ngModel)]=\"mode\"\n>\n    <tui-data-list\n        *tuiDataList\n        size=\"s\"\n    >\n        <button\n            *ngFor=\"let item of modes\"\n            tuiOption\n            type=\"button\"\n            [value]=\"item\"\n        >\n            {{ item }}\n        </button>\n    </tui-data-list>\n</tui-select>\n<tui-primitive-textfield\n    *ngIf=\"isHex; else rgb\"\n    tuiTextfieldSize=\"m\"\n    [maskito]=\"hexMask\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [value]=\"hex\"\n    (valueChange)=\"onHexChange($event)\"\n/>\n<ng-template #rgb>\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[0]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange($event, color[1], color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[1]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], $event, color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[2]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], color[1], $event, color[3])\"\n    />\n</ng-template>\n<tui-input-number\n    tuiTextfieldPostfix=\"%\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-opacity\"\n    [max]=\"100\"\n    [min]=\"0\"\n    [ngModel]=\"opacity\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    (ngModelChange)=\"onRgbChange(color[0], color[1], color[2], $event / 100)\"\n/>\n", styles: [":host{display:flex}.t-select{inline-size:5.875rem}.t-opacity{inline-size:4.275rem}.t-rgb,.t-opacity{text-align:center}\n"] }]
+            args: [{ standalone: false, selector: 'tui-color-edit', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        ngSkipHydration: 'true',
+                    }, template: "<tui-select\n    tuiDropdownAlign=\"left\"\n    tuiDropdownLimitWidth=\"min\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-select\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [(ngModel)]=\"mode\"\n>\n    <tui-data-list\n        *tuiDataList\n        size=\"s\"\n    >\n        <button\n            *ngFor=\"let item of modes\"\n            tuiOption\n            type=\"button\"\n            [value]=\"item\"\n        >\n            {{ item }}\n        </button>\n    </tui-data-list>\n</tui-select>\n<tui-primitive-textfield\n    *ngIf=\"isHex; else rgb\"\n    tuiTextfieldSize=\"m\"\n    [maskito]=\"hexMask\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    [value]=\"hex\"\n    (valueChange)=\"onHexChange($event)\"\n/>\n<ng-template #rgb>\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[0]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange($event, color[1], color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[1]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], $event, color[2], color[3])\"\n    />\n    <tui-input-number\n        tuiTextfieldSize=\"m\"\n        class=\"t-rgb\"\n        [max]=\"255\"\n        [min]=\"0\"\n        [ngModel]=\"color[2]\"\n        [ngModelOptions]=\"{standalone: true}\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        (ngModelChange)=\"onRgbChange(color[0], color[1], $event, color[3])\"\n    />\n</ng-template>\n<tui-input-number\n    tuiTextfieldPostfix=\"%\"\n    tuiTextfieldSize=\"m\"\n    class=\"t-opacity\"\n    [max]=\"100\"\n    [min]=\"0\"\n    [ngModel]=\"opacity\"\n    [ngModelOptions]=\"{standalone: true}\"\n    [style.flex]=\"'0 0 auto'\"\n    [tuiTextfieldLabelOutside]=\"true\"\n    (ngModelChange)=\"onRgbChange(color[0], color[1], color[2], $event / 100)\"\n/>\n", styles: [":host{display:flex}.t-select{inline-size:5.875rem}.t-opacity{inline-size:4.275rem}.t-rgb,.t-opacity{text-align:center}\n"] }]
         }], propDecorators: { color: [{
                 type: Input
             }], colorChange: [{
@@ -124,15 +126,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 class TuiPickerService extends Observable {
     constructor() {
-        const nativeElement = tuiInjectElement();
-        const doc = inject(DOCUMENT);
-        const point$ = tuiTypedFromEvent(nativeElement, 'mousedown').pipe(tuiPreventDefault(), switchMap((event) => {
-            const mouseMove$ = tuiTypedFromEvent(doc, 'mousemove').pipe(map(({ clientX, clientY }) => tuiGetElementPoint(clientX, clientY, nativeElement)), takeUntil(tuiTypedFromEvent(doc, 'mouseup')));
-            return event.target === nativeElement
-                ? mouseMove$.pipe(startWith(tuiGetElementPoint(event.clientX, event.clientY, nativeElement)))
+        super((subscriber) => this.point$.subscribe(subscriber));
+        this.el = tuiInjectElement();
+        this.doc = inject(DOCUMENT);
+        this.point$ = tuiTypedFromEvent(this.el, 'mousedown').pipe(tuiPreventDefault(), switchMap((event) => {
+            const mouseMove$ = tuiTypedFromEvent(this.doc, 'mousemove').pipe(map(({ clientX, clientY }) => tuiGetElementPoint(clientX, clientY, this.el)), takeUntil(tuiTypedFromEvent(this.doc, 'mouseup')));
+            return event.target === this.el
+                ? mouseMove$.pipe(startWith(tuiGetElementPoint(event.clientX, event.clientY, this.el)))
                 : mouseMove$;
         }), takeUntilDestroyed());
-        super((subscriber) => point$.subscribe(subscriber));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiPickerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiPickerService }); }
@@ -143,14 +145,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 class TuiFlatPickerComponent {
     constructor() {
-        this.value = [0, 0];
-        this.valueChange = new EventEmitter();
-        inject(TuiPickerService)
+        this.$ = inject(TuiPickerService)
             .pipe(takeUntilDestroyed())
             .subscribe((point) => {
             this.value = point;
             this.valueChange.emit([point[0], point[1]]);
         });
+        this.value = [0, 0];
+        this.valueChange = new EventEmitter();
     }
     get left() {
         return this.value[0] * 100;
@@ -159,12 +161,14 @@ class TuiFlatPickerComponent {
         return this.value[1] * 100;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiFlatPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiFlatPickerComponent, selector: "tui-flat-picker", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, providers: [TuiPickerService], ngImport: i0, template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n    [style.top.%]=\"top\"\n></div>\n", styles: [":host{position:relative;display:block}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:-.5rem 0 0 -.5rem;box-shadow:inset 0 0 0 1px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiFlatPickerComponent, selector: "tui-flat-picker", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [TuiPickerService], ngImport: i0, template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n    [style.top.%]=\"top\"\n></div>\n", styles: [":host{position:relative;display:block}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:-.5rem 0 0 -.5rem;box-shadow:inset 0 0 0 1px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiFlatPickerComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'tui-flat-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TuiPickerService], template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n    [style.top.%]=\"top\"\n></div>\n", styles: [":host{position:relative;display:block}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:-.5rem 0 0 -.5rem;box-shadow:inset 0 0 0 1px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { value: [{
+            args: [{ standalone: false, selector: 'tui-flat-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TuiPickerService], host: {
+                        ngSkipHydration: 'true',
+                    }, template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n    [style.top.%]=\"top\"\n></div>\n", styles: [":host{position:relative;display:block}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:-.5rem 0 0 -.5rem;box-shadow:inset 0 0 0 1px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"] }]
+        }], propDecorators: { value: [{
                 type: Input
             }], valueChange: [{
                 type: Output
@@ -172,25 +176,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 
 class TuiLinearPickerComponent {
     constructor() {
-        this.value = 0;
-        this.valueChange = new EventEmitter();
-        inject(TuiPickerService)
+        this.$ = inject(TuiPickerService)
             .pipe(takeUntilDestroyed())
             .subscribe(([x]) => {
             this.value = x;
             this.valueChange.emit(x);
         });
+        this.value = 0;
+        this.valueChange = new EventEmitter();
     }
     get left() {
         return this.value * 100;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiLinearPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiLinearPickerComponent, selector: "tui-linear-picker", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, providers: [TuiPickerService], ngImport: i0, template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiLinearPickerComponent, selector: "tui-linear-picker", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [TuiPickerService], ngImport: i0, template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiLinearPickerComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'tui-linear-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TuiPickerService], template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { value: [{
+            args: [{ standalone: false, selector: 'tui-linear-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TuiPickerService], host: {
+                        ngSkipHydration: 'true',
+                    }, template: "<div\n    class=\"t-circle\"\n    [style.left.%]=\"left\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"] }]
+        }], propDecorators: { value: [{
                 type: Input
             }], valueChange: [{
                 type: Output
@@ -242,14 +248,16 @@ class TuiColorPickerComponent {
         this.colorChange.emit([...this.currentColor, this.opacity]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiColorPickerComponent, selector: "tui-color-picker", inputs: { color: "color" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<tui-flat-picker\n    class=\"t-flat\"\n    [style.backgroundColor]=\"base\"\n    [value]=\"point\"\n    (valueChange)=\"onPointChange($event)\"\n/>\n<div class=\"t-wrapper t-wrapper_hue\">\n    <tui-linear-picker\n        class=\"t-hue\"\n        [value]=\"hue\"\n        (valueChange)=\"onHueChange($event)\"\n    />\n</div>\n<div\n    class=\"t-wrapper t-wrapper_opacity\"\n    [style.background]=\"gradient\"\n>\n    <tui-linear-picker\n        class=\"t-opacity\"\n        [value]=\"opacity\"\n        (valueChange)=\"onOpacityChange($event)\"\n    />\n</div>\n", styles: [":host{position:relative;display:block;isolation:isolate}.t-flat{block-size:14rem;background:linear-gradient(#0000,#000),linear-gradient(to right,#fff,#fff0);margin-bottom:.25rem;overflow:hidden}.t-wrapper{position:relative;margin:1rem 1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper_hue{background:red}.t-wrapper_opacity:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:inherit;margin:0 .5rem}.t-opacity{border-radius:inherit;margin:0 .5rem}\n"], dependencies: [{ kind: "component", type: TuiFlatPickerComponent, selector: "tui-flat-picker", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: TuiLinearPickerComponent, selector: "tui-linear-picker", inputs: ["value"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiColorPickerComponent, selector: "tui-color-picker", inputs: { color: "color" }, outputs: { colorChange: "colorChange" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<tui-flat-picker\n    class=\"t-flat\"\n    [style.backgroundColor]=\"base\"\n    [value]=\"point\"\n    (valueChange)=\"onPointChange($event)\"\n/>\n<div class=\"t-wrapper t-wrapper_hue\">\n    <tui-linear-picker\n        class=\"t-hue\"\n        [value]=\"hue\"\n        (valueChange)=\"onHueChange($event)\"\n    />\n</div>\n<div\n    class=\"t-wrapper t-wrapper_opacity\"\n    [style.background]=\"gradient\"\n>\n    <tui-linear-picker\n        class=\"t-opacity\"\n        [value]=\"opacity\"\n        (valueChange)=\"onOpacityChange($event)\"\n    />\n</div>\n", styles: [":host{position:relative;display:block;isolation:isolate}.t-flat{block-size:14rem;background:linear-gradient(#0000,#000),linear-gradient(to right,#fff,#fff0);margin-bottom:.25rem;overflow:hidden}.t-wrapper{position:relative;margin:1rem 1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper_hue{background:red}.t-wrapper_opacity:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:inherit;margin:0 .5rem}.t-opacity{border-radius:inherit;margin:0 .5rem}\n"], dependencies: [{ kind: "component", type: TuiFlatPickerComponent, selector: "tui-flat-picker", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: TuiLinearPickerComponent, selector: "tui-linear-picker", inputs: ["value"], outputs: ["valueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     tuiPure
 ], TuiColorPickerComponent.prototype, "getCurrentColor", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiColorPickerComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'tui-color-picker', changeDetection: ChangeDetectionStrategy.OnPush, template: "<tui-flat-picker\n    class=\"t-flat\"\n    [style.backgroundColor]=\"base\"\n    [value]=\"point\"\n    (valueChange)=\"onPointChange($event)\"\n/>\n<div class=\"t-wrapper t-wrapper_hue\">\n    <tui-linear-picker\n        class=\"t-hue\"\n        [value]=\"hue\"\n        (valueChange)=\"onHueChange($event)\"\n    />\n</div>\n<div\n    class=\"t-wrapper t-wrapper_opacity\"\n    [style.background]=\"gradient\"\n>\n    <tui-linear-picker\n        class=\"t-opacity\"\n        [value]=\"opacity\"\n        (valueChange)=\"onOpacityChange($event)\"\n    />\n</div>\n", styles: [":host{position:relative;display:block;isolation:isolate}.t-flat{block-size:14rem;background:linear-gradient(#0000,#000),linear-gradient(to right,#fff,#fff0);margin-bottom:.25rem;overflow:hidden}.t-wrapper{position:relative;margin:1rem 1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper_hue{background:red}.t-wrapper_opacity:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:inherit;margin:0 .5rem}.t-opacity{border-radius:inherit;margin:0 .5rem}\n"] }]
+            args: [{ standalone: false, selector: 'tui-color-picker', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        ngSkipHydration: 'true',
+                    }, template: "<tui-flat-picker\n    class=\"t-flat\"\n    [style.backgroundColor]=\"base\"\n    [value]=\"point\"\n    (valueChange)=\"onPointChange($event)\"\n/>\n<div class=\"t-wrapper t-wrapper_hue\">\n    <tui-linear-picker\n        class=\"t-hue\"\n        [value]=\"hue\"\n        (valueChange)=\"onHueChange($event)\"\n    />\n</div>\n<div\n    class=\"t-wrapper t-wrapper_opacity\"\n    [style.background]=\"gradient\"\n>\n    <tui-linear-picker\n        class=\"t-opacity\"\n        [value]=\"opacity\"\n        (valueChange)=\"onOpacityChange($event)\"\n    />\n</div>\n", styles: [":host{position:relative;display:block;isolation:isolate}.t-flat{block-size:14rem;background:linear-gradient(#0000,#000),linear-gradient(to right,#fff,#fff0);margin-bottom:.25rem;overflow:hidden}.t-wrapper{position:relative;margin:1rem 1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper_hue{background:red}.t-wrapper_opacity:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hue{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:inherit;margin:0 .5rem}.t-opacity{border-radius:inherit;margin:0 .5rem}\n"] }]
         }], propDecorators: { colorChange: [{
                 type: Output
             }], color: [{
@@ -374,13 +382,13 @@ function tuiColorSelectorOptionsProvider(options) {
 
 class TuiLinearMultiPickerComponent {
     constructor() {
+        this.$ = inject(TuiPickerService)
+            .pipe(takeUntilDestroyed())
+            .subscribe(([x]) => this.onPicker(x));
         this.value = [0, 1];
         this.valueChange = new EventEmitter();
         this.indexChange = new EventEmitter();
         this.index = NaN;
-        inject(TuiPickerService)
-            .pipe(takeUntilDestroyed())
-            .subscribe(([x]) => this.onPicker(x));
     }
     onMouseUp() {
         this.index = NaN;
@@ -412,14 +420,15 @@ class TuiLinearMultiPickerComponent {
         this.valueChange.emit(value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiLinearMultiPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiLinearMultiPickerComponent, selector: "tui-linear-multi-picker", inputs: { value: "value" }, outputs: { valueChange: "valueChange", indexChange: "indexChange" }, host: { listeners: { "document:mouseup": "onMouseUp()" } }, providers: [TuiPickerService], ngImport: i0, template: "<div\n    *ngFor=\"let item of value; let index = index\"\n    class=\"t-circle\"\n    [style.left.%]=\"item * 100\"\n    (dblclick)=\"onClick(index)\"\n    (mousedown)=\"onMouseDown(index)\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiLinearMultiPickerComponent, selector: "tui-linear-multi-picker", inputs: { value: "value" }, outputs: { valueChange: "valueChange", indexChange: "indexChange" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "document:mouseup": "onMouseUp()" } }, providers: [TuiPickerService], ngImport: i0, template: "<div\n    *ngFor=\"let item of value; let index = index\"\n    class=\"t-circle\"\n    [style.left.%]=\"item * 100\"\n    (dblclick)=\"onClick(index)\"\n    (mousedown)=\"onMouseDown(index)\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiLinearMultiPickerComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: 'tui-linear-multi-picker', changeDetection: ChangeDetectionStrategy.OnPush, providers: [TuiPickerService], host: {
+                        ngSkipHydration: 'true',
                         '(document:mouseup)': 'onMouseUp()',
                     }, template: "<div\n    *ngFor=\"let item of value; let index = index\"\n    class=\"t-circle\"\n    [style.left.%]=\"item * 100\"\n    (dblclick)=\"onClick(index)\"\n    (mousedown)=\"onMouseDown(index)\"\n></div>\n", styles: [":host{position:relative;display:block;block-size:1rem;box-sizing:border-box}.t-circle{position:absolute;inline-size:1rem;block-size:1rem;border-radius:100%;margin:0 -.5rem;box-shadow:inset 0 0 0 2px var(--tui-base-01),0 0 0 1px var(--tui-base-03)}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { value: [{
+        }], propDecorators: { value: [{
                 type: Input
             }], valueChange: [{
                 type: Output
@@ -434,11 +443,13 @@ class TuiPaletteComponent {
         this.originalOrder = (_a, _b) => 0;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiPaletteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiPaletteComponent, selector: "tui-palette", inputs: { colors: "colors" }, outputs: { selectedColor: "selectedColor" }, ngImport: i0, template: "<button\n    *ngFor=\"let color of colors | keyvalue: originalOrder\"\n    type=\"button\"\n    class=\"t-button\"\n    [id]=\"color.key\"\n    [style.background]=\"color.value\"\n    [tuiHint]=\"color.key\"\n    [tuiHintDescribe]=\"color.key\"\n    (click)=\"selectedColor.emit(color.value)\"\n></button>\n", styles: [":host{display:flex;flex-wrap:wrap;padding:.875rem}.t-button{-webkit-appearance:none;appearance:none;padding:0;background:none;font-size:inherit;line-height:inherit;inline-size:1.5625rem;block-size:1.5625rem;box-sizing:border-box;margin:.375rem;border-radius:var(--tui-radius-m);border:1px solid rgba(0,0,0,.08)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$2.TuiHintDescribe, selector: "[tuiHintDescribe]", inputs: ["tuiHintDescribe"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiPaletteComponent, selector: "tui-palette", inputs: { colors: "colors" }, outputs: { selectedColor: "selectedColor" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<button\n    *ngFor=\"let color of colors | keyvalue: originalOrder\"\n    type=\"button\"\n    class=\"t-button\"\n    [id]=\"color.key\"\n    [style.background]=\"color.value\"\n    [tuiHint]=\"color.key\"\n    [tuiHintDescribe]=\"color.key\"\n    (click)=\"selectedColor.emit(color.value)\"\n></button>\n", styles: [":host{display:flex;flex-wrap:wrap;padding:.875rem}.t-button{-webkit-appearance:none;appearance:none;padding:0;background:none;font-size:inherit;line-height:inherit;inline-size:1.5625rem;block-size:1.5625rem;box-sizing:border-box;margin:.375rem;border-radius:var(--tui-radius-m);border:1px solid rgba(0,0,0,.08)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$2.TuiHintDescribe, selector: "[tuiHintDescribe]", inputs: ["tuiHintDescribe"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiPaletteComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'tui-palette', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n    *ngFor=\"let color of colors | keyvalue: originalOrder\"\n    type=\"button\"\n    class=\"t-button\"\n    [id]=\"color.key\"\n    [style.background]=\"color.value\"\n    [tuiHint]=\"color.key\"\n    [tuiHintDescribe]=\"color.key\"\n    (click)=\"selectedColor.emit(color.value)\"\n></button>\n", styles: [":host{display:flex;flex-wrap:wrap;padding:.875rem}.t-button{-webkit-appearance:none;appearance:none;padding:0;background:none;font-size:inherit;line-height:inherit;inline-size:1.5625rem;block-size:1.5625rem;box-sizing:border-box;margin:.375rem;border-radius:var(--tui-radius-m);border:1px solid rgba(0,0,0,.08)}\n"] }]
+            args: [{ standalone: false, selector: 'tui-palette', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        ngSkipHydration: 'true',
+                    }, template: "<button\n    *ngFor=\"let color of colors | keyvalue: originalOrder\"\n    type=\"button\"\n    class=\"t-button\"\n    [id]=\"color.key\"\n    [style.background]=\"color.value\"\n    [tuiHint]=\"color.key\"\n    [tuiHintDescribe]=\"color.key\"\n    (click)=\"selectedColor.emit(color.value)\"\n></button>\n", styles: [":host{display:flex;flex-wrap:wrap;padding:.875rem}.t-button{-webkit-appearance:none;appearance:none;padding:0;background:none;font-size:inherit;line-height:inherit;inline-size:1.5625rem;block-size:1.5625rem;box-sizing:border-box;margin:.375rem;border-radius:var(--tui-radius-m);border:1px solid rgba(0,0,0,.08)}\n"] }]
         }], propDecorators: { colors: [{
                 type: Input
             }], selectedColor: [{
@@ -594,7 +605,7 @@ class TuiColorSelectorComponent {
         this.color = tuiParseColor(color);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiColorSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiColorSelectorComponent, selector: "tui-color-selector", inputs: { colors: "colors", colorSetter: ["color", "colorSetter"] }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<ng-container *ngIf=\"selectorMode\">\n    <div\n        class=\"t-select\"\n        [tuiDropdown]=\"menu\"\n        [(tuiDropdownOpen)]=\"open\"\n    >\n        <button\n            appearance=\"\"\n            size=\"s\"\n            tuiButton\n            tuiChevron\n            type=\"button\"\n        >\n            {{ currentMode }}\n        </button>\n\n        <ng-template #menu>\n            <tui-data-list\n                role=\"menu\"\n                size=\"s\"\n                class=\"t-menu\"\n            >\n                <button\n                    *ngFor=\"let mode of modes\"\n                    role=\"menuitemradio\"\n                    tuiOption\n                    type=\"button\"\n                    [attr.aria-checked]=\"isModeActive(mode)\"\n                    (click)=\"onModeSelect(mode)\"\n                    (keydown.enter.prevent)=\"onModeSelect(mode)\"\n                    (keydown.space.prevent)=\"onModeSelect(mode)\"\n                >\n                    {{ mode }}\n                    <tui-icon\n                        *ngIf=\"isModeActive(mode)\"\n                        icon=\"@tui.check\"\n                        class=\"t-checkmark\"\n                    />\n                </button>\n            </tui-data-list>\n        </ng-template>\n    </div>\n    <hr class=\"t-hr\" />\n</ng-container>\n\n<ng-container *ngIf=\"isGradient\">\n    <div\n        class=\"t-wrapper\"\n        [style.background]=\"gradient\"\n    >\n        <tui-linear-multi-picker\n            class=\"t-gradient\"\n            [value]=\"stopsKeys\"\n            (indexChange)=\"onIndexChange($event)\"\n            (valueChange)=\"onStopsChange($event)\"\n        />\n    </div>\n    <div class=\"t-buttons\">\n        <!-- TODO: Change to `tuiHintDescribe` when figure tuiDriver order issue -->\n        <button\n            *ngFor=\"let button of buttons\"\n            appearance=\"\"\n            size=\"xs\"\n            tuiHintDescribe\n            tuiIconButton\n            type=\"button\"\n            class=\"t-direction\"\n            [class.t-direction_active]=\"isDirectionActive(button)\"\n            [iconStart]=\"getIcon(button)\"\n            [tuiHint]=\"button\"\n            (click)=\"onDirectionChange(button)\"\n        ></button>\n    </div>\n</ng-container>\n<tui-color-picker\n    [color]=\"currentColor\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-color-edit\n    *ngIf=\"!isGradient\"\n    tuiGroup\n    class=\"t-edit\"\n    [color]=\"color\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-palette\n    *ngIf=\"palette.size\"\n    class=\"t-palette\"\n    [colors]=\"palette\"\n    (selectedColor)=\"onPalettePick($event)\"\n/>\n", styles: [":host{position:relative;display:block;isolation:isolate;inline-size:22.6rem}.t-wrapper{position:relative;margin:1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hr{block-size:1px;margin:0 0 0 -1px;border:none;background:var(--tui-base-03)}.t-gradient{margin:0 .5rem;border-radius:inherit}.t-select{margin:.75rem .5rem 0}.t-arrow{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}.t-arrow_rotated{transform:rotate(180deg)}.t-menu{inline-size:11.25rem}.t-checkmark{margin-left:auto;inline-size:1rem;block-size:1rem}.t-buttons{display:flex;padding:0 .75rem 1.25rem;justify-content:space-between}.t-direction{color:var(--tui-text-02);margin:0 .375rem}.t-direction:hover,.t-direction_active{color:var(--tui-text-01);background:var(--tui-secondary-hover)}.t-edit{margin:1.25rem}.t-palette{box-sizing:border-box;box-shadow:inset 0 1px var(--tui-base-03)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiColorPickerComponent, selector: "tui-color-picker", inputs: ["color"], outputs: ["colorChange"] }, { kind: "component", type: TuiLinearMultiPickerComponent, selector: "tui-linear-multi-picker", inputs: ["value"], outputs: ["valueChange", "indexChange"] }, { kind: "component", type: TuiColorEditComponent, selector: "tui-color-edit", inputs: ["color"], outputs: ["colorChange"] }, { kind: "directive", type: i1$1.TuiDropdownDirective, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: ["tuiDropdown"], exportAs: ["tuiDropdown"] }, { kind: "directive", type: i1$1.TuiDropdownOpen, selector: "[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: ["tuiDropdownEnabled", "tuiDropdownOpen"], outputs: ["tuiDropdownOpenChange"] }, { kind: "component", type: i2$1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "component", type: i2$1.TuiOption, selector: "button[tuiOption], a[tuiOption], label[tuiOption]", inputs: ["disabled", "value"] }, { kind: "directive", type: i8.TuiGroup, selector: "[tuiGroup]:not(ng-container)", inputs: ["orientation", "collapsed", "rounded", "size"] }, { kind: "component", type: TuiPaletteComponent, selector: "tui-palette", inputs: ["colors"], outputs: ["selectedColor"] }, { kind: "directive", type: i1$2.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$2.TuiHintDescribe, selector: "[tuiHintDescribe]", inputs: ["tuiHintDescribe"] }, { kind: "directive", type: i11.TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "component", type: i12.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiColorSelectorComponent, selector: "tui-color-selector", inputs: { colors: "colors", colorSetter: ["color", "colorSetter"] }, outputs: { colorChange: "colorChange" }, host: { attributes: { "ngSkipHydration": "true" } }, ngImport: i0, template: "<ng-container *ngIf=\"selectorMode\">\n    <div\n        class=\"t-select\"\n        [tuiDropdown]=\"menu\"\n        [(tuiDropdownOpen)]=\"open\"\n    >\n        <button\n            appearance=\"\"\n            size=\"s\"\n            tuiButton\n            tuiChevron\n            type=\"button\"\n        >\n            {{ currentMode }}\n        </button>\n\n        <ng-template #menu>\n            <tui-data-list\n                role=\"menu\"\n                size=\"s\"\n                class=\"t-menu\"\n            >\n                <button\n                    *ngFor=\"let mode of modes\"\n                    role=\"menuitemradio\"\n                    tuiOption\n                    type=\"button\"\n                    [attr.aria-checked]=\"isModeActive(mode)\"\n                    (click)=\"onModeSelect(mode)\"\n                    (keydown.enter.prevent)=\"onModeSelect(mode)\"\n                    (keydown.space.prevent)=\"onModeSelect(mode)\"\n                >\n                    {{ mode }}\n                    <tui-icon\n                        *ngIf=\"isModeActive(mode)\"\n                        icon=\"@tui.check\"\n                        class=\"t-checkmark\"\n                    />\n                </button>\n            </tui-data-list>\n        </ng-template>\n    </div>\n    <hr class=\"t-hr\" />\n</ng-container>\n\n<ng-container *ngIf=\"isGradient\">\n    <div\n        class=\"t-wrapper\"\n        [style.background]=\"gradient\"\n    >\n        <tui-linear-multi-picker\n            class=\"t-gradient\"\n            [value]=\"stopsKeys\"\n            (indexChange)=\"onIndexChange($event)\"\n            (valueChange)=\"onStopsChange($event)\"\n        />\n    </div>\n    <div class=\"t-buttons\">\n        <!-- TODO: Change to `tuiHintDescribe` when figure tuiDriver order issue -->\n        <button\n            *ngFor=\"let button of buttons\"\n            appearance=\"\"\n            size=\"xs\"\n            tuiHintDescribe\n            tuiIconButton\n            type=\"button\"\n            class=\"t-direction\"\n            [class.t-direction_active]=\"isDirectionActive(button)\"\n            [iconStart]=\"getIcon(button)\"\n            [tuiHint]=\"button\"\n            (click)=\"onDirectionChange(button)\"\n        ></button>\n    </div>\n</ng-container>\n<tui-color-picker\n    [color]=\"currentColor\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-color-edit\n    *ngIf=\"!isGradient\"\n    tuiGroup\n    class=\"t-edit\"\n    [color]=\"color\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-palette\n    *ngIf=\"palette.size\"\n    class=\"t-palette\"\n    [colors]=\"palette\"\n    (selectedColor)=\"onPalettePick($event)\"\n/>\n", styles: [":host{position:relative;display:block;isolation:isolate;inline-size:22.6rem}.t-wrapper{position:relative;margin:1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hr{block-size:1px;margin:0 0 0 -1px;border:none;background:var(--tui-base-03)}.t-gradient{margin:0 .5rem;border-radius:inherit}.t-select{margin:.75rem .5rem 0}.t-arrow{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}.t-arrow_rotated{transform:rotate(180deg)}.t-menu{inline-size:11.25rem}.t-checkmark{margin-left:auto;inline-size:1rem;block-size:1rem}.t-buttons{display:flex;padding:0 .75rem 1.25rem;justify-content:space-between}.t-direction{color:var(--tui-text-02);margin:0 .375rem}.t-direction:hover,.t-direction_active{color:var(--tui-text-01);background:var(--tui-secondary-hover)}.t-edit{margin:1.25rem}.t-palette{box-sizing:border-box;box-shadow:inset 0 1px var(--tui-base-03)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiColorPickerComponent, selector: "tui-color-picker", inputs: ["color"], outputs: ["colorChange"] }, { kind: "component", type: TuiLinearMultiPickerComponent, selector: "tui-linear-multi-picker", inputs: ["value"], outputs: ["valueChange", "indexChange"] }, { kind: "component", type: TuiColorEditComponent, selector: "tui-color-edit", inputs: ["color"], outputs: ["colorChange"] }, { kind: "directive", type: i1$1.TuiDropdownDirective, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: ["tuiDropdown"], exportAs: ["tuiDropdown"] }, { kind: "directive", type: i1$1.TuiDropdownOpen, selector: "[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: ["tuiDropdownEnabled", "tuiDropdownOpen"], outputs: ["tuiDropdownOpenChange"] }, { kind: "component", type: i2$1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "component", type: i2$1.TuiOption, selector: "button[tuiOption], a[tuiOption], label[tuiOption]", inputs: ["disabled", "value"] }, { kind: "directive", type: i8.TuiGroup, selector: "[tuiGroup]:not(ng-container)", inputs: ["orientation", "collapsed", "rounded", "size"] }, { kind: "component", type: TuiPaletteComponent, selector: "tui-palette", inputs: ["colors"], outputs: ["selectedColor"] }, { kind: "directive", type: i1$2.TuiHintDirective, selector: "[tuiHint]:not(ng-container):not(ng-template)", inputs: ["tuiHintContext", "tuiHintAppearance", "tuiHint"] }, { kind: "directive", type: i1$2.TuiHintDescribe, selector: "[tuiHintDescribe]", inputs: ["tuiHintDescribe"] }, { kind: "directive", type: i11.TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "component", type: i12.TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     tuiPure
@@ -604,7 +615,9 @@ __decorate([
 ], TuiColorSelectorComponent.prototype, "filterPalette", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiColorSelectorComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'tui-color-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"selectorMode\">\n    <div\n        class=\"t-select\"\n        [tuiDropdown]=\"menu\"\n        [(tuiDropdownOpen)]=\"open\"\n    >\n        <button\n            appearance=\"\"\n            size=\"s\"\n            tuiButton\n            tuiChevron\n            type=\"button\"\n        >\n            {{ currentMode }}\n        </button>\n\n        <ng-template #menu>\n            <tui-data-list\n                role=\"menu\"\n                size=\"s\"\n                class=\"t-menu\"\n            >\n                <button\n                    *ngFor=\"let mode of modes\"\n                    role=\"menuitemradio\"\n                    tuiOption\n                    type=\"button\"\n                    [attr.aria-checked]=\"isModeActive(mode)\"\n                    (click)=\"onModeSelect(mode)\"\n                    (keydown.enter.prevent)=\"onModeSelect(mode)\"\n                    (keydown.space.prevent)=\"onModeSelect(mode)\"\n                >\n                    {{ mode }}\n                    <tui-icon\n                        *ngIf=\"isModeActive(mode)\"\n                        icon=\"@tui.check\"\n                        class=\"t-checkmark\"\n                    />\n                </button>\n            </tui-data-list>\n        </ng-template>\n    </div>\n    <hr class=\"t-hr\" />\n</ng-container>\n\n<ng-container *ngIf=\"isGradient\">\n    <div\n        class=\"t-wrapper\"\n        [style.background]=\"gradient\"\n    >\n        <tui-linear-multi-picker\n            class=\"t-gradient\"\n            [value]=\"stopsKeys\"\n            (indexChange)=\"onIndexChange($event)\"\n            (valueChange)=\"onStopsChange($event)\"\n        />\n    </div>\n    <div class=\"t-buttons\">\n        <!-- TODO: Change to `tuiHintDescribe` when figure tuiDriver order issue -->\n        <button\n            *ngFor=\"let button of buttons\"\n            appearance=\"\"\n            size=\"xs\"\n            tuiHintDescribe\n            tuiIconButton\n            type=\"button\"\n            class=\"t-direction\"\n            [class.t-direction_active]=\"isDirectionActive(button)\"\n            [iconStart]=\"getIcon(button)\"\n            [tuiHint]=\"button\"\n            (click)=\"onDirectionChange(button)\"\n        ></button>\n    </div>\n</ng-container>\n<tui-color-picker\n    [color]=\"currentColor\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-color-edit\n    *ngIf=\"!isGradient\"\n    tuiGroup\n    class=\"t-edit\"\n    [color]=\"color\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-palette\n    *ngIf=\"palette.size\"\n    class=\"t-palette\"\n    [colors]=\"palette\"\n    (selectedColor)=\"onPalettePick($event)\"\n/>\n", styles: [":host{position:relative;display:block;isolation:isolate;inline-size:22.6rem}.t-wrapper{position:relative;margin:1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hr{block-size:1px;margin:0 0 0 -1px;border:none;background:var(--tui-base-03)}.t-gradient{margin:0 .5rem;border-radius:inherit}.t-select{margin:.75rem .5rem 0}.t-arrow{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}.t-arrow_rotated{transform:rotate(180deg)}.t-menu{inline-size:11.25rem}.t-checkmark{margin-left:auto;inline-size:1rem;block-size:1rem}.t-buttons{display:flex;padding:0 .75rem 1.25rem;justify-content:space-between}.t-direction{color:var(--tui-text-02);margin:0 .375rem}.t-direction:hover,.t-direction_active{color:var(--tui-text-01);background:var(--tui-secondary-hover)}.t-edit{margin:1.25rem}.t-palette{box-sizing:border-box;box-shadow:inset 0 1px var(--tui-base-03)}\n"] }]
+            args: [{ standalone: false, selector: 'tui-color-selector', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        ngSkipHydration: 'true',
+                    }, template: "<ng-container *ngIf=\"selectorMode\">\n    <div\n        class=\"t-select\"\n        [tuiDropdown]=\"menu\"\n        [(tuiDropdownOpen)]=\"open\"\n    >\n        <button\n            appearance=\"\"\n            size=\"s\"\n            tuiButton\n            tuiChevron\n            type=\"button\"\n        >\n            {{ currentMode }}\n        </button>\n\n        <ng-template #menu>\n            <tui-data-list\n                role=\"menu\"\n                size=\"s\"\n                class=\"t-menu\"\n            >\n                <button\n                    *ngFor=\"let mode of modes\"\n                    role=\"menuitemradio\"\n                    tuiOption\n                    type=\"button\"\n                    [attr.aria-checked]=\"isModeActive(mode)\"\n                    (click)=\"onModeSelect(mode)\"\n                    (keydown.enter.prevent)=\"onModeSelect(mode)\"\n                    (keydown.space.prevent)=\"onModeSelect(mode)\"\n                >\n                    {{ mode }}\n                    <tui-icon\n                        *ngIf=\"isModeActive(mode)\"\n                        icon=\"@tui.check\"\n                        class=\"t-checkmark\"\n                    />\n                </button>\n            </tui-data-list>\n        </ng-template>\n    </div>\n    <hr class=\"t-hr\" />\n</ng-container>\n\n<ng-container *ngIf=\"isGradient\">\n    <div\n        class=\"t-wrapper\"\n        [style.background]=\"gradient\"\n    >\n        <tui-linear-multi-picker\n            class=\"t-gradient\"\n            [value]=\"stopsKeys\"\n            (indexChange)=\"onIndexChange($event)\"\n            (valueChange)=\"onStopsChange($event)\"\n        />\n    </div>\n    <div class=\"t-buttons\">\n        <!-- TODO: Change to `tuiHintDescribe` when figure tuiDriver order issue -->\n        <button\n            *ngFor=\"let button of buttons\"\n            appearance=\"\"\n            size=\"xs\"\n            tuiHintDescribe\n            tuiIconButton\n            type=\"button\"\n            class=\"t-direction\"\n            [class.t-direction_active]=\"isDirectionActive(button)\"\n            [iconStart]=\"getIcon(button)\"\n            [tuiHint]=\"button\"\n            (click)=\"onDirectionChange(button)\"\n        ></button>\n    </div>\n</ng-container>\n<tui-color-picker\n    [color]=\"currentColor\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-color-edit\n    *ngIf=\"!isGradient\"\n    tuiGroup\n    class=\"t-edit\"\n    [color]=\"color\"\n    (colorChange)=\"onColorChange($event)\"\n/>\n<tui-palette\n    *ngIf=\"palette.size\"\n    class=\"t-palette\"\n    [colors]=\"palette\"\n    (selectedColor)=\"onPalettePick($event)\"\n/>\n", styles: [":host{position:relative;display:block;isolation:isolate;inline-size:22.6rem}.t-wrapper{position:relative;margin:1.25rem;border-radius:.5rem}.t-wrapper:after{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";box-shadow:inset 0 0 0 1px #00000014;pointer-events:none;border-radius:inherit}.t-wrapper:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";z-index:-1;background-image:linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03)),linear-gradient(45deg,var(--tui-base-03) 25%,transparent 25%,transparent 75%,var(--tui-base-03) 75%,var(--tui-base-03));background-size:.375rem .375rem;background-position:0 0,.1875rem .1875rem;border-radius:inherit}.t-hr{block-size:1px;margin:0 0 0 -1px;border:none;background:var(--tui-base-03)}.t-gradient{margin:0 .5rem;border-radius:inherit}.t-select{margin:.75rem .5rem 0}.t-arrow{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}.t-arrow_rotated{transform:rotate(180deg)}.t-menu{inline-size:11.25rem}.t-checkmark{margin-left:auto;inline-size:1rem;block-size:1rem}.t-buttons{display:flex;padding:0 .75rem 1.25rem;justify-content:space-between}.t-direction{color:var(--tui-text-02);margin:0 .375rem}.t-direction:hover,.t-direction_active{color:var(--tui-text-01);background:var(--tui-secondary-hover)}.t-edit{margin:1.25rem}.t-palette{box-sizing:border-box;box-shadow:inset 0 1px var(--tui-base-03)}\n"] }]
         }], propDecorators: { colors: [{
                 type: Input
             }], colorChange: [{