@taiga-ui/core 4.52.0-canary.24b31eb → 4.52.0-canary.2d877cf

package/{directives → portals}/dropdown/index.d.ts

@@ -4,18 +4,15 @@ export * from './dropdown.component';
 export * from './dropdown.directive';
 export * from './dropdown.driver';
 export * from './dropdown.providers';
-export * from './dropdown.service';
+export * from './dropdown-content.directive';
 export * from './dropdown-context.directive';
 export * from './dropdown-hover.directive';
 export * from './dropdown-hover.options';
 export * from './dropdown-limit-width';
 export * from './dropdown-manual.directive';
 export * from './dropdown-open.directive';
-export * from './dropdown-open-legacy.directive';
 export * from './dropdown-options.directive';
-export * from './dropdown-portal.directive';
 export * from './dropdown-position.directive';
 export * from './dropdown-position-sided.directive';
 export * from './dropdown-selection.directive';
-export * from './dropdowns.component';
 export * from './with-dropdown-open.directive';

package/{directives → portals}/hint/hint-describe.directive.d.ts

@@ -3,14 +3,12 @@ import * as i0 from "@angular/core";
 export declare class TuiHintDescribe extends TuiDriver {
     private readonly doc;
     private readonly el;
-    private readonly zone;
-    private readonly id$;
-    private readonly stream$;
+    protected readonly element: import("@angular/core").Signal<Element>;
+    readonly id: import("@angular/core").InputSignal<string | null | undefined>;
     readonly type = "hint";
+    protected readonly stream$: import("rxjs").Observable<boolean>;
     constructor();
-    set tuiHintDescribe(id: string | null | undefined);
-    private get element();
     private get focused();
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintDescribe, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintDescribe, "[tuiHintDescribe]", never, { "tuiHintDescribe": { "alias": "tuiHintDescribe"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintDescribe, "[tuiHintDescribe]", never, { "id": { "alias": "tuiHintDescribe"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/{directives → portals}/hint/hint-host.directive.d.ts

@@ -1,9 +1,9 @@
 import { TuiRectAccessor } from '@taiga-ui/core/classes';
 import * as i0 from "@angular/core";
 export declare class TuiHintHost extends TuiRectAccessor {
-    tuiHintHost?: HTMLElement;
+    readonly tuiHintHost: import("@angular/core").InputSignal<HTMLElement | undefined>;
     readonly type = "hint";
     getClientRect(): DOMRect;
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintHost, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintHost, "[tuiHint][tuiHintHost]", never, { "tuiHintHost": { "alias": "tuiHintHost"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintHost, "[tuiHint][tuiHintHost]", never, { "tuiHintHost": { "alias": "tuiHintHost"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/{directives → portals}/hint/hint-hover.directive.d.ts

@@ -1,5 +1,4 @@
 import { TuiDriver } from '@taiga-ui/core/classes';
-import { type TuiHintOptions } from './hint-options.directive';
 import * as i0 from "@angular/core";
 export declare class TuiHintHover extends TuiDriver {
     private readonly isMobile;
@@ -10,13 +9,13 @@ export declare class TuiHintHover extends TuiDriver {
     private readonly toggle$;
     private readonly stream$;
     private readonly parent;
-    tuiHintShowDelay: TuiHintOptions['showDelay'];
-    tuiHintHideDelay: TuiHintOptions['hideDelay'];
+    readonly showDelay: import("@angular/core").InputSignal<number>;
+    readonly hideDelay: import("@angular/core").InputSignal<number>;
     readonly type = "hint";
     enabled: boolean;
     constructor();
     toggle(visible?: boolean): void;
     close(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintHover, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintHover, never, ["tuiHintHover"], { "tuiHintShowDelay": { "alias": "tuiHintShowDelay"; "required": false; }; "tuiHintHideDelay": { "alias": "tuiHintHideDelay"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintHover, never, ["tuiHintHover"], { "showDelay": { "alias": "tuiHintShowDelay"; "required": false; "isSignal": true; }; "hideDelay": { "alias": "tuiHintHideDelay"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/{directives → portals}/hint/hint-manual.directive.d.ts

@@ -4,10 +4,10 @@ import * as i0 from "@angular/core";
 export declare class TuiHintManual extends TuiDriver implements OnChanges {
     private readonly hover;
     private readonly stream$;
-    tuiHintManual: boolean | null;
+    readonly visible: import("@angular/core").InputSignal<boolean | null>;
     readonly type = "hint";
     constructor();
     ngOnChanges(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintManual, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintManual, "[tuiHint][tuiHintManual]", never, { "tuiHintManual": { "alias": "tuiHintManual"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintManual, "[tuiHint][tuiHintManual]", never, { "visible": { "alias": "tuiHintManual"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/{directives → portals}/hint/hint-options.directive.d.ts

@@ -25,7 +25,7 @@ export declare class TuiHintOptionsDirective implements TuiHintOptions, OnChange
     private readonly options;
     content: PolymorpheusContent;
     direction: TuiHintDirection | TuiHintDirection[];
-    appearance: "accent" | "action-destructive" | "action-grayscale" | "action" | "flat-destructive" | "flat-grayscale" | "flat" | "floating" | "glass" | "icon" | "info" | "negative" | "neutral" | "outline-destructive" | "outline-grayscale" | "outline" | "positive" | "primary-destructive" | "primary-grayscale" | "primary" | "secondary-destructive" | "secondary-grayscale" | "secondary" | "textfield" | "warning" | (Record<never, never> & string);
+    appearance: "" | ("accent" | "action-destructive" | "action-grayscale" | "action" | "flat-destructive" | "flat-grayscale" | "flat" | "floating" | "glass" | "icon" | "info" | "negative" | "neutral" | "outline-destructive" | "outline-grayscale" | "outline" | "positive" | "primary-destructive" | "primary-grayscale" | "primary" | "secondary-destructive" | "secondary-grayscale" | "secondary" | "textfield" | "warning" | (Record<never, never> & string));
     showDelay: number;
     hideDelay: number;
     icon: string;

package/{directives → portals}/hint/hint-overflow.directive.d.ts

@@ -2,8 +2,8 @@ import * as i0 from "@angular/core";
 import * as i1 from "./hint.directive";
 export declare class TuiHintOverflow {
     private readonly hint;
-    tuiHintOverflow: string | null;
+    readonly content: import("@angular/core").InputSignal<string | null>;
     protected onMouseEnter({ scrollWidth, clientWidth, textContent }: Element): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintOverflow, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintOverflow, "[tuiHintOverflow]", never, { "tuiHintOverflow": { "alias": "tuiHintOverflow"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.TuiHintDirective; inputs: { "tuiHintAppearance": "tuiHintAppearance"; }; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintOverflow, "[tuiHintOverflow]", never, { "content": { "alias": "tuiHintOverflow"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.TuiHintDirective; inputs: { "tuiHintAppearance": "tuiHintAppearance"; }; outputs: {}; }]>;
 }

package/{directives → portals}/hint/hint-position.directive.d.ts

@@ -1,7 +1,6 @@
-import { EventEmitter } from '@angular/core';
 import { TuiPositionAccessor } from '@taiga-ui/core/classes';
 import { type TuiPoint } from '@taiga-ui/core/types';
-import { type TuiHintDirection, type TuiHintOptions } from './hint-options.directive';
+import { type TuiHintDirection } from './hint-options.directive';
 import * as i0 from "@angular/core";
 export declare class TuiHintPosition extends TuiPositionAccessor {
     private readonly el;
@@ -9,13 +8,13 @@ export declare class TuiHintPosition extends TuiPositionAccessor {
     private readonly viewport;
     private readonly accessor;
     private readonly points;
-    direction: TuiHintOptions['direction'];
-    readonly directionChange: EventEmitter<TuiHintDirection>;
+    readonly direction: import("@angular/core").InputSignal<TuiHintDirection | TuiHintDirection[]>;
+    readonly directionChange: import("@angular/core").OutputEmitterRef<TuiHintDirection>;
     readonly type = "hint";
     emitDirection(direction: TuiHintDirection): void;
-    getPosition(rect: DOMRect, el?: HTMLElement): TuiPoint;
+    getPosition({ width, height }: DOMRect): TuiPoint;
     private get fallback();
     private checkPosition;
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintPosition, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintPosition, never, never, { "direction": { "alias": "tuiHintDirection"; "required": false; }; }, { "directionChange": "tuiHintDirectionChange"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintPosition, never, never, { "direction": { "alias": "tuiHintDirection"; "required": false; "isSignal": true; }; }, { "directionChange": "tuiHintDirectionChange"; }, never, never, true, never>;
 }

package/{directives → portals}/hint/hint-unstyled.component.d.ts

@@ -1,12 +1,7 @@
-import { type WritableSignal } from '@angular/core';
-import { type TuiContext } from '@taiga-ui/cdk/types';
-import { type TuiPortalItem } from '@taiga-ui/core/types';
-import { type PolymorpheusContent } from '@taiga-ui/polymorpheus';
+import { TuiHintDirective } from './hint.directive';
 import * as i0 from "@angular/core";
 export declare class TuiHintUnstyledComponent {
-    protected readonly context: TuiContext<TuiPortalItem<any> & {
-        content: WritableSignal<PolymorpheusContent>;
-    }>;
+    protected readonly hint: TuiHintDirective<any>;
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintUnstyledComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<TuiHintUnstyledComponent, "ng-component", never, {}, {}, never, never, true, never>;
 }

package/{directives → portals}/hint/hint.component.d.ts

@@ -6,23 +6,24 @@ import { TuiHintPointer } from './hint-pointer.directive';
 import * as i0 from "@angular/core";
 import * as i1 from "@taiga-ui/core/directives/appearance";
 import * as i2 from "@taiga-ui/cdk/directives/animated";
+import * as i3 from "@taiga-ui/cdk/directives/active-zone";
 export declare const TUI_HINT_PROVIDERS: (import("@angular/core").FactoryProvider | typeof TuiHoveredService | typeof TuiPositionService)[];
-export declare class TuiHintComponent<C = any> {
+export declare class TuiHintComponent {
     private readonly el;
     private readonly hover;
     private readonly vvs;
     private readonly viewport;
     protected readonly pointer: TuiHintPointer | null;
     protected readonly accessor: TuiRectAccessor;
-    protected readonly hint: TuiHintDirective<C>;
+    protected readonly hint: TuiHintDirective<any>;
     protected readonly isMobile: boolean;
-    protected readonly content: import("@angular/core").WritableSignal<import("@taiga-ui/polymorpheus").PolymorpheusContent<C>>;
+    protected readonly content: import("@angular/core").InputSignal<import("@taiga-ui/polymorpheus").PolymorpheusContent<any>> | import("@angular/core").WritableSignal<string>;
     protected readonly theme: string | null | undefined;
-    protected readonly appearance: import("@angular/core").WritableSignal<string>;
+    protected readonly appearance: import("@angular/core").Signal<string>;
     constructor();
     protected onClick(target: HTMLElement): void;
     private apply;
     private update;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TuiHintComponent<any>, "tui-hint", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.TuiAppearance; inputs: {}; outputs: {}; }, { directive: typeof i2.TuiAnimated; inputs: {}; outputs: {}; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TuiHintComponent, "tui-hint", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.TuiAppearance; inputs: {}; outputs: {}; }, { directive: typeof i2.TuiAnimated; inputs: {}; outputs: {}; }, { directive: typeof i3.TuiActiveZone; inputs: {}; outputs: {}; }]>;
 }

package/portals/hint/hint.directive.d.ts

@@ -0,0 +1,24 @@
+import { type OnChanges, type OnDestroy } from '@angular/core';
+import { type TuiRectAccessor, type TuiVehicle } from '@taiga-ui/core/classes';
+import { PolymorpheusComponent, type PolymorpheusContent } from '@taiga-ui/polymorpheus';
+import * as i0 from "@angular/core";
+import * as i1 from "./hint-driver.directive";
+import * as i2 from "./hint-hover.directive";
+import * as i3 from "./hint-position.directive";
+export declare class TuiHintDirective<C> implements OnDestroy, OnChanges, TuiRectAccessor, TuiVehicle {
+    private readonly service;
+    private ref?;
+    readonly content: import("@angular/core").InputSignal<PolymorpheusContent<C>>;
+    readonly context: import("@angular/core").InputSignal<C | undefined>;
+    readonly appearance: import("@angular/core").InputSignal<"" | ("accent" | "action-destructive" | "action-grayscale" | "action" | "flat-destructive" | "flat-grayscale" | "flat" | "floating" | "glass" | "icon" | "info" | "negative" | "neutral" | "outline-destructive" | "outline-grayscale" | "outline" | "positive" | "primary-destructive" | "primary-grayscale" | "primary" | "secondary-destructive" | "secondary-grayscale" | "secondary" | "textfield" | "warning" | (Record<never, never> & string))>;
+    readonly visible: import("@angular/core").OutputEmitterRef<boolean>;
+    component: PolymorpheusComponent<any>;
+    readonly el: HTMLElement;
+    readonly type = "hint";
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    getClientRect(): DOMRect;
+    toggle(show: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TuiHintDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiHintDirective<any>, "[tuiHint]:not(ng-container):not(ng-template)", never, { "content": { "alias": "tuiHint"; "required": false; "isSignal": true; }; "context": { "alias": "tuiHintContext"; "required": false; "isSignal": true; }; "appearance": { "alias": "tuiHintAppearance"; "required": false; "isSignal": true; }; }, { "visible": "tuiHintVisible"; }, never, never, true, [{ directive: typeof i1.TuiHintDriver; inputs: {}; outputs: {}; }, { directive: typeof i2.TuiHintHover; inputs: { "tuiHintHideDelay": "tuiHintHideDelay"; "tuiHintShowDelay": "tuiHintShowDelay"; }; outputs: {}; }, { directive: typeof i3.TuiHintPosition; inputs: { "tuiHintDirection": "tuiHintDirection"; }; outputs: { "tuiHintDirectionChange": "tuiHintDirectionChange"; }; }]>;
+}

package/{directives → portals}/hint/index.d.ts

@@ -2,7 +2,6 @@ export * from './hint';
 export * from './hint.component';
 export * from './hint.directive';
 export * from './hint.providers';
-export * from './hint.service';
 export * from './hint-describe.directive';
 export * from './hint-driver.directive';
 export * from './hint-host.directive';
@@ -13,4 +12,3 @@ export * from './hint-overflow.directive';
 export * from './hint-pointer.directive';
 export * from './hint-position.directive';
 export * from './hint-unstyled.component';
-export * from './hints.component';

package/portals/index.d.ts

@@ -0,0 +1,6 @@
+export * from '@taiga-ui/core/portals/alert';
+export * from '@taiga-ui/core/portals/dialog';
+export * from '@taiga-ui/core/portals/dropdown';
+export * from '@taiga-ui/core/portals/hint';
+export * from '@taiga-ui/core/portals/modal';
+export * from '@taiga-ui/core/portals/popup';

package/portals/modal/index.d.ts

@@ -0,0 +1,2 @@
+export * from './modal.component';
+export * from './modal.service';

package/portals/modal/modal.component.d.ts

@@ -0,0 +1,17 @@
+import { type OnDestroy, type OnInit } from '@angular/core';
+import { type TuiPortalContext } from '@taiga-ui/cdk/portals';
+import { type PolymorpheusContent } from '@taiga-ui/polymorpheus';
+import * as i0 from "@angular/core";
+import * as i1 from "@taiga-ui/cdk/directives/active-zone";
+import * as i2 from "@taiga-ui/cdk/directives/focus-trap";
+import * as i3 from "@taiga-ui/core/components/scrollbar";
+export declare class TuiModalComponent<T> implements OnDestroy, OnInit {
+    private readonly current;
+    private readonly parent;
+    readonly context: TuiPortalContext<T>;
+    readonly component: import("@angular/core").WritableSignal<PolymorpheusContent<TuiPortalContext<T>>>;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TuiModalComponent<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TuiModalComponent<any>, "tui-modal", never, {}, {}, never, never, true, [{ directive: typeof i1.TuiActiveZone; inputs: {}; outputs: {}; }, { directive: typeof i2.TuiFocusTrap; inputs: {}; outputs: {}; }, { directive: typeof i3.TuiScrollRef; inputs: {}; outputs: {}; }]>;
+}

package/portals/modal/modal.service.d.ts

@@ -0,0 +1,13 @@
+import { type Type } from '@angular/core';
+import { TuiPortal } from '@taiga-ui/cdk/portals';
+import { PolymorpheusComponent } from '@taiga-ui/polymorpheus';
+import { TuiModalComponent } from './modal.component';
+import * as i0 from "@angular/core";
+export declare abstract class TuiModalService<T, K = void> extends TuiPortal<T, K> {
+    protected abstract readonly content: Type<unknown>;
+    protected readonly component: typeof TuiModalComponent;
+    constructor();
+    protected add(component: PolymorpheusComponent<TuiModalComponent<T>>): () => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TuiModalService<any, any>, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<TuiModalService<any, any>>;
+}

package/portals/popup/popup.directive.d.ts

@@ -0,0 +1,12 @@
+import { type OnChanges, type OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class TuiPopup implements OnChanges, OnDestroy {
+    private readonly template;
+    private readonly service;
+    private ref?;
+    readonly show: import("@angular/core").InputSignal<boolean>;
+    ngOnChanges(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TuiPopup, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TuiPopup, "ng-template[tuiPopup]", never, { "show": { "alias": "tuiPopup"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/{directives → portals}/popup/popup.service.d.ts

@@ -1,4 +1,4 @@
-import { TuiPortalService } from '@taiga-ui/cdk/classes';
+import { TuiPortalService } from '@taiga-ui/cdk/portals';
 import * as i0 from "@angular/core";
 export declare class TuiPopupService extends TuiPortalService {
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiPopupService, never>;

package/{directives → portals}/popup/popups.component.d.ts

@@ -1,6 +1,6 @@
-import { TuiPortals } from '@taiga-ui/cdk/classes';
+import { TuiPortals } from '@taiga-ui/cdk/portals';
 import * as i0 from "@angular/core";
 export declare class TuiPopups extends TuiPortals {
     static ɵfac: i0.ɵɵFactoryDeclaration<TuiPopups, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TuiPopups, "tui-popups", never, {}, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TuiPopups, "tui-popups", never, {}, {}, never, ["*"], true, never>;
 }

package/services/index.d.ts

@@ -1,5 +1,3 @@
 export * from './breakpoint.service';
-export * from './dark-theme.service';
-export * from './format-date.service';
 export * from './position.service';
 export * from './visual-viewport.service';

package/styles/components/link.less

@@ -21,19 +21,15 @@
     border: none;
     cursor: pointer;
     font: inherit;
-    color: var(--tui-text-primary);
+    color: inherit;
+    border-radius: 0.125rem;
+    outline-width: 1px;
+    outline-offset: -1px;
     text-decoration: none dashed currentColor;
     text-underline-offset: 0.2em;
-    text-decoration-thickness: 0.7px;
+    text-decoration-thickness: 1px;
     text-decoration-color: color-mix(in lch, currentColor, transparent);
 
-    // TODO: Remove in v5
-    @media @tui-mouse {
-        &:hover {
-            --tui-text-secondary: var(--tui-text-primary);
-        }
-    }
-
     &::before {
         margin-inline-end: 0.25rem;
     }
@@ -51,18 +47,13 @@
         line-height: 0;
         box-sizing: border-box;
         mask-size: calc(100% + 10 * var(--tui-stroke-width, 0.125rem)) 100%;
+        transition: none;
     }
 
     &[tuiChevron]::after {
         display: inline-block;
     }
 
-    .appearance-focus({
-        outline: none;
-        background: var(--tui-service-selection-background);
-        background: color-mix(in lch, currentColor 12%, transparent);
-    });
-
     .appearance-hover({
         text-decoration-color: currentColor;
     });
@@ -71,13 +62,8 @@
         text-decoration-color: currentColor;
     });
 
-    @media @tui-mouse {
-        &[data-appearance='']:hover {
-            opacity: 0.7;
-        }
-    }
-
-    &[data-appearance='']:active {
-        opacity: 0.7;
+    &[data-appearance=''] {
+        text-decoration-line: underline;
+        text-decoration-style: solid;
     }
 }

package/styles/components/textfield.less

@@ -6,8 +6,8 @@ tui-textfield {
 
     --t-height: var(--tui-height-l);
     --t-padding: var(--tui-padding-l);
-    --t-label: -0.7em;
-    --t-label-size: 0.83em;
+    --t-label-y: -0.75rem;
+    --t-label-font: var(--tui-font-text-s);
     --t-end: ~'0rem';
     --t-start: ~'0rem';
 
@@ -133,6 +133,8 @@ tui-textfield {
     &[data-size='m'] {
         --t-height: var(--tui-height-m);
         --t-padding: var(--tui-padding-m);
+        --t-label-font: var(--tui-font-text-xs);
+        --t-label-y: -0.5625rem;
 
         border-radius: var(--tui-radius-m);
         font: var(--tui-font-text-ui-s);
@@ -288,7 +290,6 @@ tui-textfield {
         pointer-events: auto;
         background: none;
 
-        // TODO: Remove :not when we drop old select tuiTextfield in v5
         &:not(select):read-only ~ .t-filler {
             display: none;
         }
@@ -307,8 +308,9 @@ tui-textfield {
         &:-webkit-autofill,
         &:not(._empty):not(:placeholder-shown) {
             & ~ label {
-                font-size: var(--t-label-size);
-                transform: translateY(var(--t-label));
+                font: var(--t-label-font);
+                line-height: var(--t-height);
+                transform: translateY(var(--t-label-y));
             }
 
             &:not(:disabled)[data-mode~='invalid'] ~ label,
@@ -330,8 +332,9 @@ tui-textfield {
 
                 & ~ label {
                     color: var(--tui-text-primary) !important;
-                    font-size: var(--t-label-size);
-                    transform: translateY(var(--t-label));
+                    font: var(--t-label-font);
+                    line-height: var(--t-height);
+                    transform: translateY(var(--t-label-y));
                 }
             });
         }

package/styles/mixins/appearance.less

@@ -3,7 +3,7 @@
 .appearance-hover(@content) {
     .interactive({
         @media @tui-mouse {
-            &:hover:not(:disabled):not([data-state]) {
+            &:hover:not([data-state]) {
                 @content();
             }
         }
@@ -24,7 +24,7 @@
 
 .appearance-active(@content) {
     .interactive({
-        &:active:not(:disabled):not([data-state]) {
+        &:active:not([data-state]) {
             @content();
         }
     });

package/styles/mixins/mixins.less

@@ -1,11 +1,6 @@
 @import 'browsers.less';
 
 .interactive(@ruleset) {
-    // TODO remove after dropping Safari 13 support
-    &:matches(a, button, select, textarea, input, label, .tui-interactive):not(:disabled) {
-        @ruleset();
-    }
-
     &:is(a, button, select, textarea, input, label, .tui-interactive):not(:disabled) {
         @ruleset();
     }

package/styles/mixins/mixins.scss

@@ -1,11 +1,6 @@
 @import 'browsers.scss';
 
 @mixin interactive {
-    // TODO remove after dropping Safari 13 support
-    &:matches(a, button, select, textarea, input, label, .tui-interactive):not(:disabled) {
-        @content;
-    }
-
     &:is(a, button, select, textarea, input, label, .tui-interactive):not(:disabled) {
         @content;
     }

package/styles/mixins/slider.less

@@ -1,7 +1,6 @@
 @thumb-diameters: {
     @s: 0.5rem;
     @m: 0.75rem;
-    @l: 0.75rem;
 };
 
 @track-inset: {
@@ -10,9 +9,8 @@
     @l: 1rem;
 };
 
-// TODO(v5): use `l` by default (default size for new textfields)
-.tui-slider-ticks-labels(@input-size: m) {
-    @thumb: @thumb-diameters[@@input-size];
+.tui-slider-ticks-labels(@thumb-size: m) {
+    @thumb: @thumb-diameters[@@thumb-size];
 
     --t-offset: calc(@thumb / 2);
 
@@ -45,22 +43,34 @@
         }
     }
 
-    /* TODO(v5): delete */
-    tui-input-slider + & {
-        margin-inline-start: calc(var(--tui-radius-m) / 2 + var(--t-offset));
-    }
-
-    tui-input-range:not([new]) + &, /* TODO(v5): delete */
     tui-range + & {
         --t-offset: @thumb;
     }
 
     /* TODO: add :has([tuiInputSlider]) */
-    tui-textfield + & {
-        --t-offset: calc(@track-inset[@@input-size] + @thumb / 2);
+    tui-textfield[data-size='l'] + & {
+        --t-offset: calc(@track-inset[@l] + @thumb / 2);
+    }
+
+    /* TODO: add :has([tuiInputSlider]) */
+    tui-textfield[data-size='m'] + & {
+        --t-offset: calc(@track-inset[@m] + @thumb / 2);
+    }
+
+    /* TODO: add :has([tuiInputSlider]) */
+    tui-textfield[data-size='s'] + & {
+        --t-offset: calc(@track-inset[@s] + @thumb / 2);
+    }
+
+    tui-input-range[data-size='l'] + & {
+        --t-offset: calc(@track-inset[@l] + @thumb);
+    }
+
+    tui-input-range[data-size='m'] + & {
+        --t-offset: calc(@track-inset[@m] + @thumb);
     }
 
-    tui-input-range[new] + & {
-        --t-offset: calc(@track-inset[@@input-size] + @thumb);
+    tui-input-range[data-size='s'] + & {
+        --t-offset: calc(@track-inset[@s] + @thumb);
     }
 }

package/styles/mixins/slider.scss

@@ -60,12 +60,11 @@ $track-inset: (
         --t-offset: calc(var(--tui-radius-l) / 2 + $thumb / 2);
     }
 
-    tui-input-range:not([new]) + &, /* TODO(v5): delete */
     tui-range + & {
         --t-offset: $thumb;
     }
 
-    tui-input-range[new] + & {
+    tui-input-range + & {
         --t-offset: calc(map-get($track-inset, $input-size) + $thumb);
     }
 }

package/styles/theme/variables.less

@@ -1,10 +1,8 @@
-@font-fallback: -apple-system, 'BlinkMacSystemFont', system-ui, 'Roboto', 'Segoe UI', 'Helvetica Neue', sans-serif;
-
 &:root,
 &:host {
     // Fonts
-    --tui-font-heading: 'Manrope', @font-fallback;
-    --tui-font-text: 'Manrope', @font-fallback;
+    --tui-font-heading: 'Manrope', system-ui, sans-serif;
+    --tui-font-text: 'Manrope', system-ui, sans-serif;
     --tui-font-offset: ~'0rem';
     // Heading
     --tui-font-heading-1: bold calc(var(--tui-font-offset) + 3.125rem) / 3.5rem var(--tui-font-heading);

package/tokens/common-icons.d.ts

@@ -1,4 +1,3 @@
-import { InjectionToken, type Provider } from '@angular/core';
 export interface TuiCommonIcons {
     readonly check: string;
     readonly close: string;
@@ -6,6 +5,7 @@ export interface TuiCommonIcons {
     readonly more: string;
     readonly search: string;
     readonly ellipsis: string;
+    readonly decrement: string;
+    readonly increment: string;
 }
-export declare const TUI_COMMON_ICONS: InjectionToken<TuiCommonIcons>;
-export declare function tuiCommonIconsProvider(icons: Partial<TuiCommonIcons>): Provider;
+export declare const TUI_COMMON_ICONS: import("@angular/core").InjectionToken<TuiCommonIcons>, tuiCommonIconsProvider: (item: Partial<TuiCommonIcons> | (() => Partial<TuiCommonIcons>)) => import("@angular/core").FactoryProvider;

package/tokens/date-format.d.ts

@@ -1,6 +1,5 @@
-import { InjectionToken, type Provider } from '@angular/core';
+import { InjectionToken, type Provider, type Signal } from '@angular/core';
 import { type TuiDateMode } from '@taiga-ui/cdk/date-time';
-import { type Observable } from 'rxjs';
 /**
  * Formatting configuration for displayed dates
  */
@@ -19,5 +18,5 @@ export declare const TUI_DEFAULT_DATE_FORMAT: TuiDateFormatSettings;
 /**
  * Formatting configuration for displayed dates
  */
-export declare const TUI_DATE_FORMAT: InjectionToken<Observable<TuiDateFormatSettings>>;
+export declare const TUI_DATE_FORMAT: InjectionToken<Signal<TuiDateFormatSettings>>;
 export declare function tuiDateFormatProvider(options: Partial<TuiDateFormatSettings>): Provider;