@taiga-ui/core 4.43.0 → 4.44.0-canary.0bcf1bf

package/styles/components/textfield.less

@@ -186,6 +186,7 @@ tui-textfield {
     &::before {
         z-index: 1;
         margin-inline-end: 0.5rem;
+        pointer-events: none;
     }
 
     &:has(:disabled:not(.t-filler, button, option, [tuiChip]))::before,
@@ -278,9 +279,10 @@ tui-textfield {
     select:defined,
     textarea:defined {
         pointer-events: auto;
-        background: transparent;
+        background: none;
 
-        &:read-only ~ .t-filler {
+        // TODO: Remove :not when we drop old select tuiTextfield in v5
+        &:not(select):read-only ~ .t-filler {
             display: none;
         }
 
@@ -411,7 +413,6 @@ tui-textfield {
 
     & > .t-filler:defined {
         pointer-events: none;
-        background: none;
         color: var(--tui-text-tertiary);
         opacity: 1;
     }
@@ -419,4 +420,12 @@ tui-textfield {
     [tuiFluidTypography] {
         font-weight: bold;
     }
+
+    [tuiSelectLike]:not(:read-only) {
+        cursor: pointer;
+    }
+
+    &:has(input[type='tel']) {
+        direction: ltr;
+    }
 }

package/styles/components/title.less

@@ -70,3 +70,11 @@
     font: var(--tui-font-text-ui-s);
     margin: 0;
 }
+
+[tuiButton] [tuiTitle] {
+    margin-inline-end: auto;
+
+    [tuiSubtitle] {
+        color: var(--tui-text-secondary);
+    }
+}

package/styles/mixins/mixins.less

@@ -162,7 +162,7 @@
 
 .tui-line-clamp(@count: 3) {
     display: -webkit-box;
-    -webkit-box-orient: vertical;
+    -webkit-box-orient: block-axis;
     -webkit-line-clamp: @count;
     line-clamp: @count;
     overflow: hidden;

package/styles/mixins/slider.less

@@ -30,15 +30,15 @@
 
     tui-textfield + &, /* TODO: add :has([tuiInputSlider]) */
     tui-input-slider + & {
-        margin-left: calc(var(--tui-radius-m) / 2 + @first-tick-center);
+        margin-inline-start: calc(var(--tui-radius-m) / 2 + @first-tick-center);
     }
 
     tui-input-range + &,
     tui-range + & {
         @thumb: @thumb-diameters[@@input-size];
 
-        margin-left: @thumb;
-        margin-right: @thumb;
+        margin-inline-start: @thumb;
+        margin-inline-end: @thumb;
 
         & > * {
             &:first-child {

package/styles/mixins/slider.scss

@@ -29,14 +29,14 @@ $thumb-diameters: (
     }
 
     tui-input-slider + & {
-        margin-left: calc(var(--tui-radius-m) / 2 + #{$first-tick-center});
+        margin-inline-start: calc(var(--tui-radius-m) / 2 + #{$first-tick-center});
     }
 
     tui-input-range + &,
     tui-range + & {
         $thumb: map-get($thumb-diameters, $input-size);
-        margin-left: $thumb;
-        margin-right: $thumb;
+        margin-inline-start: $thumb;
+        margin-inline-end: $thumb;
 
         & > * {
             &:first-child {

package/styles/theme/appearance/table.less

@@ -17,7 +17,7 @@ TODO: remove :not([tuiWrapper]) after legacy controls deletion
     background: transparent;
     border: none;
     outline: none;
-    border-bottom: calc(var(--t-row-height) - var(--t-height)) solid transparent;
+    border-block-end: calc(var(--t-row-height) - var(--t-height)) solid transparent;
 
     &:not(._empty) {
         color: var(--tui-text-primary);

package/tokens/animations-speed.d.ts

@@ -1,4 +1,5 @@
+import { InjectionToken } from '@angular/core';
 /**
  * Speed of all Taiga UI animations. 1 equals 300ms.
  */
-export declare const TUI_ANIMATIONS_SPEED: import("@angular/core").InjectionToken<number>;
+export declare const TUI_ANIMATIONS_SPEED: InjectionToken<number>;

package/tokens/assets-path.d.ts

@@ -1,3 +1,4 @@
 import type { ValueProvider } from '@angular/core';
-export declare const TUI_ASSETS_PATH: import("@angular/core").InjectionToken<string>;
+import { InjectionToken } from '@angular/core';
+export declare const TUI_ASSETS_PATH: InjectionToken<string>;
 export declare function tuiAssetsPathProvider(useValue: string): ValueProvider;

package/tokens/auxiliary.d.ts

@@ -1,3 +1,4 @@
 import type { Provider, Type } from '@angular/core';
-export declare const TUI_AUXILIARY: import("@angular/core").InjectionToken<null>;
+import { InjectionToken } from '@angular/core';
+export declare const TUI_AUXILIARY: InjectionToken<null>;
 export declare function tuiAsAuxiliary(x: Type<unknown>): Provider;

package/tokens/common-icons.d.ts

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

package/tokens/dark-mode.d.ts

@@ -1,6 +1,7 @@
 import type { WritableSignal } from '@angular/core';
+import { InjectionToken } from '@angular/core';
 export declare const TUI_DARK_MODE_DEFAULT_KEY = "tuiDark";
-export declare const TUI_DARK_MODE_KEY: import("@angular/core").InjectionToken<string>;
-export declare const TUI_DARK_MODE: import("@angular/core").InjectionToken<WritableSignal<boolean> & {
+export declare const TUI_DARK_MODE_KEY: InjectionToken<string>;
+export declare const TUI_DARK_MODE: InjectionToken<WritableSignal<boolean> & {
     reset(): void;
 }>;

package/tokens/date-format.d.ts

@@ -1,4 +1,5 @@
-import type { InjectionToken, Provider } from '@angular/core';
+import type { Provider } from '@angular/core';
+import { InjectionToken } from '@angular/core';
 import type { TuiDateMode } from '@taiga-ui/cdk/date-time';
 import type { Observable } from 'rxjs';
 /**

package/tokens/day-type-handler.d.ts

@@ -1,6 +1,7 @@
+import { InjectionToken } from '@angular/core';
 import type { TuiDay } from '@taiga-ui/cdk/date-time';
 import type { TuiHandler } from '@taiga-ui/cdk/types';
 /**
  * Token for adding data-type attribute to calendar cell
  */
-export declare const TUI_DAY_TYPE_HANDLER: import("@angular/core").InjectionToken<TuiHandler<TuiDay, string>>;
+export declare const TUI_DAY_TYPE_HANDLER: InjectionToken<TuiHandler<TuiDay, string>>;

package/tokens/first-day-of-week.d.ts

@@ -1,4 +1,5 @@
+import { InjectionToken } from '@angular/core';
 /**
  * The first day of the week index
  */
-export declare const TUI_FIRST_DAY_OF_WEEK: import("@angular/core").InjectionToken<0 | 1 | 2 | 3 | 4 | 5 | 6>;
+export declare const TUI_FIRST_DAY_OF_WEEK: InjectionToken<0 | 1 | 2 | 3 | 4 | 5 | 6>;

package/tokens/i18n.d.ts

@@ -1,28 +1,29 @@
+import { InjectionToken } from '@angular/core';
 /**
  * Localized months names
  */
-export declare const TUI_MONTHS: import("@angular/core").InjectionToken<import("rxjs").Observable<readonly [January: string, February: string, March: string, April: string, May: string, June: string, July: string, August: string, September: string, October: string, November: string, December: string]>>;
+export declare const TUI_MONTHS: InjectionToken<import("rxjs").Observable<readonly [January: string, February: string, March: string, April: string, May: string, June: string, July: string, August: string, September: string, October: string, November: string, December: string]>>;
 /**
  * i18n 'close' word
  */
-export declare const TUI_CLOSE_WORD: import("@angular/core").InjectionToken<import("rxjs").Observable<string>>;
+export declare const TUI_CLOSE_WORD: InjectionToken<import("rxjs").Observable<string>>;
 /**
  * i18n 'clear' word
  */
-export declare const TUI_CLEAR_WORD: import("@angular/core").InjectionToken<import("rxjs").Observable<string>>;
+export declare const TUI_CLEAR_WORD: InjectionToken<import("rxjs").Observable<string>>;
 /**
  * i18n 'Nothing found' message
  */
-export declare const TUI_NOTHING_FOUND_MESSAGE: import("@angular/core").InjectionToken<import("rxjs").Observable<string>>;
+export declare const TUI_NOTHING_FOUND_MESSAGE: InjectionToken<import("rxjs").Observable<string>>;
 /**
  * i18n of error message
  */
-export declare const TUI_DEFAULT_ERROR_MESSAGE: import("@angular/core").InjectionToken<import("rxjs").Observable<string>>;
+export declare const TUI_DEFAULT_ERROR_MESSAGE: InjectionToken<import("rxjs").Observable<string>>;
 /**
  * spin i18n texts
  */
-export declare const TUI_SPIN_TEXTS: import("@angular/core").InjectionToken<import("rxjs").Observable<readonly [previous: string, next: string]>>;
+export declare const TUI_SPIN_TEXTS: InjectionToken<import("rxjs").Observable<readonly [previous: string, next: string]>>;
 /**
  * calendars i18n texts
  */
-export declare const TUI_SHORT_WEEK_DAYS: import("@angular/core").InjectionToken<import("rxjs").Observable<readonly [Monday: string, Tuesday: string, Wednesday: string, Thursday: string, Friday: string, Saturday: string, Sunday: string]>>;
+export declare const TUI_SHORT_WEEK_DAYS: InjectionToken<import("rxjs").Observable<readonly [Monday: string, Tuesday: string, Wednesday: string, Thursday: string, Friday: string, Saturday: string, Sunday: string]>>;

package/tokens/icon-resolver.d.ts

@@ -1,9 +1,10 @@
 import type { Provider } from '@angular/core';
+import { InjectionToken } from '@angular/core';
 import type { TuiStringHandler } from '@taiga-ui/cdk/types';
-export declare const TUI_ICON_RESOLVER: import("@angular/core").InjectionToken<TuiStringHandler<string>>;
+export declare const TUI_ICON_RESOLVER: InjectionToken<TuiStringHandler<string>>;
 /**
  * @deprecated use {@link TUI_ICON_RESOLVER}
  */
-export declare const TUI_ICON_START_RESOLVER: import("@angular/core").InjectionToken<TuiStringHandler<string>>;
+export declare const TUI_ICON_START_RESOLVER: InjectionToken<TuiStringHandler<string>>;
 export declare function tuiInjectIconResolver(): TuiStringHandler<string>;
 export declare function tuiIconResolverProvider(useValue: TuiStringHandler<string>): Provider;

package/tokens/icon.d.ts

@@ -1,2 +1,3 @@
-export declare const TUI_ICON_START: import("@angular/core").InjectionToken<string>;
-export declare const TUI_ICON_END: import("@angular/core").InjectionToken<string>;
+import { InjectionToken } from '@angular/core';
+export declare const TUI_ICON_START: InjectionToken<string>;
+export declare const TUI_ICON_END: InjectionToken<string>;

package/tokens/icons.d.ts

@@ -1,7 +1,8 @@
 import type { FactoryProvider } from '@angular/core';
-export declare const TUI_ICON_REGISTRY: import("@angular/core").InjectionToken<Record<string, string>>;
+import { InjectionToken } from '@angular/core';
+export declare const TUI_ICON_REGISTRY: InjectionToken<Record<string, string>>;
 /**
  * @deprecated: use {@link TUI_ICON_REGISTRY}
  */
-export declare const TUI_ICON_STARTS: import("@angular/core").InjectionToken<Record<string, string>>;
+export declare const TUI_ICON_STARTS: InjectionToken<Record<string, string>>;
 export declare function tuiIconsProvider(icons: Record<string, string>): FactoryProvider;

package/tokens/media.d.ts

@@ -1,3 +1,4 @@
+import { InjectionToken } from '@angular/core';
 export interface TuiMedia {
     readonly desktopLarge: number;
     readonly desktopSmall: number;
@@ -7,4 +8,4 @@ export interface TuiMedia {
 /**
  * Token for media constant
  */
-export declare const TUI_MEDIA: import("@angular/core").InjectionToken<TuiMedia>;
+export declare const TUI_MEDIA: InjectionToken<TuiMedia>;

package/tokens/number-format.d.ts

@@ -1,4 +1,5 @@
-import type { InjectionToken, Provider } from '@angular/core';
+import type { Provider } from '@angular/core';
+import { InjectionToken } from '@angular/core';
 import type { TuiRounding } from '@taiga-ui/cdk/types';
 import type { Observable } from 'rxjs';
 export type TuiDecimalMode = 'always' | 'not-zero' | 'pad';

package/tokens/reduced-motion.d.ts

@@ -1 +1,2 @@
-export declare const TUI_REDUCED_MOTION: import("@angular/core").InjectionToken<boolean>;
+import { InjectionToken } from '@angular/core';
+export declare const TUI_REDUCED_MOTION: InjectionToken<boolean>;

package/tokens/scroll-ref.d.ts

@@ -1,2 +1,2 @@
-import { ElementRef } from '@angular/core';
-export declare const TUI_SCROLL_REF: import("@angular/core").InjectionToken<ElementRef<HTMLElement>>;
+import { ElementRef, InjectionToken } from '@angular/core';
+export declare const TUI_SCROLL_REF: InjectionToken<ElementRef<HTMLElement>>;

package/tokens/selection-stream.d.ts

@@ -1,5 +1,6 @@
+import { InjectionToken } from '@angular/core';
 import type { Observable } from 'rxjs';
 /**
  * A stream of possible selection changes
  */
-export declare const TUI_SELECTION_STREAM: import("@angular/core").InjectionToken<Observable<unknown>>;
+export declare const TUI_SELECTION_STREAM: InjectionToken<Observable<unknown>>;

package/tokens/spin-icons.d.ts

@@ -1,5 +1,6 @@
+import { InjectionToken } from '@angular/core';
 export interface TuiSpinIcons {
     readonly decrement: string;
     readonly increment: string;
 }
-export declare const TUI_SPIN_ICONS: import("@angular/core").InjectionToken<TuiSpinIcons>;
+export declare const TUI_SPIN_ICONS: InjectionToken<TuiSpinIcons>;

package/tokens/theme.d.ts

@@ -1 +1,2 @@
-export declare const TUI_THEME: import("@angular/core").InjectionToken<string>;
+import { InjectionToken } from '@angular/core';
+export declare const TUI_THEME: InjectionToken<string>;

package/tokens/viewport.d.ts

@@ -1,7 +1,8 @@
 import type { Provider, Type } from '@angular/core';
+import { InjectionToken } from '@angular/core';
 import type { TuiRectAccessor } from '@taiga-ui/core/classes';
 /**
  * Viewport accessor
  */
-export declare const TUI_VIEWPORT: import("@angular/core").InjectionToken<TuiRectAccessor>;
+export declare const TUI_VIEWPORT: InjectionToken<TuiRectAccessor>;
 export declare function tuiAsViewport(accessor: Type<TuiRectAccessor>): Provider;