From 6cde29ab4948fcc9f2685f8f5bd2fdaaf61ff8f3 Mon Sep 17 00:00:00 2001
From: splincode <omaxphp@yandex.ru>
Date: Fri, 11 Oct 2024 12:36:11 +0300
Subject: [PATCH] refactor: improve a11y

---
 package.json                                  |  3 +-
 .../textfield/textfield.component.ts          |  4 ++-
 .../textfield/textfield.template.html         |  4 ++-
 projects/core/tokens/i18n.ts                  |  5 +++
 .../components/app-bar/examples/1/index.html  |  2 ++
 .../components/app-bar/examples/3/index.html  |  2 ++
 .../components/carousel/examples/4/index.html |  8 +++--
 .../data-list/examples/2/index.html           |  4 ++-
 .../data-list/examples/3/index.html           |  8 +++--
 .../input-slider/examples/2/index.html        |  8 +++--
 .../mobile-calendar/examples/4/index.html     |  4 ++-
 .../mobile-calendar/examples/5/index.html     |  4 ++-
 .../primitive-textfield/examples/1/index.html |  4 ++-
 .../components/slider/examples/6/index.html   |  8 +++--
 .../swipe-action/examples/1/index.html        | 32 ++++++++++++++-----
 .../swipe-action/examples/2/index.html        |  4 ++-
 .../swipe-action/examples/3/index.html        | 24 ++++++++++----
 .../swipe-action/examples/4/index.html        |  8 +++--
 .../swipe-action/examples/5/index.html        | 12 +++++--
 .../components/tag/examples/3/index.html      |  4 ++-
 .../components/tag/examples/6/index.html      |  8 +++--
 .../dropdown-hover/examples/2/index.html      |  1 +
 .../dropdown-open/examples/4/index.html       |  4 ++-
 projects/i18n/languages/belarusian/core.ts    |  1 +
 projects/i18n/languages/chinese/core.ts       |  1 +
 projects/i18n/languages/dutch/core.ts         |  1 +
 projects/i18n/languages/english/core.ts       |  1 +
 projects/i18n/languages/french/core.ts        |  1 +
 projects/i18n/languages/german/core.ts        |  1 +
 projects/i18n/languages/hebrew/core.ts        |  1 +
 projects/i18n/languages/italian/core.ts       |  1 +
 projects/i18n/languages/japan/core.ts         |  1 +
 projects/i18n/languages/kazakh/core.ts        |  1 +
 projects/i18n/languages/korean/core.ts        |  1 +
 projects/i18n/languages/lithuanian/core.ts    |  1 +
 projects/i18n/languages/malay/core.ts         |  1 +
 projects/i18n/languages/polish/core.ts        |  1 +
 projects/i18n/languages/portuguese/core.ts    |  1 +
 projects/i18n/languages/russian/core.ts       |  1 +
 projects/i18n/languages/spanish/core.ts       |  1 +
 projects/i18n/languages/turkish/core.ts       |  1 +
 projects/i18n/languages/ukrainian/core.ts     |  1 +
 projects/i18n/languages/vietnamese/core.ts    |  1 +
 projects/i18n/types/language.ts               |  1 +
 .../pagination/pagination.style.less          |  1 +
 .../pagination/pagination.template.html       |  4 ++-
 .../tree-item-content.component.ts            |  2 ++
 .../tree-item-content.template.html           |  4 ++-
 48 files changed, 155 insertions(+), 42 deletions(-)

diff --git a/package.json b/package.json
index 0f894356827fb..c2a7a4e6229de 100644
--- a/package.json
+++ b/package.json
@@ -87,8 +87,7 @@
             "i18n/no-russian-character": "off",
             "i18n/no-thai-character": "off",
             "jest/prefer-importing-jest-globals": "off",
-            "sonarjs/prefer-nullish-coalescing": "off",
-            "@angular-eslint/template/elements-content": "off"
+            "sonarjs/prefer-nullish-coalescing": "off"
         },
         "overrides": [
             {
diff --git a/projects/core/components/textfield/textfield.component.ts b/projects/core/components/textfield/textfield.component.ts
index 6c8bf06b0eede..d72428928aae9 100644
--- a/projects/core/components/textfield/textfield.component.ts
+++ b/projects/core/components/textfield/textfield.component.ts
@@ -13,6 +13,7 @@ import {
     ViewContainerRef,
     ViewEncapsulation,
 } from '@angular/core';
+import {toSignal} from '@angular/core/rxjs-interop';
 import {NgControl} from '@angular/forms';
 import {WaResizeObserver} from '@ng-web-apis/resize-observer';
 import {tuiInjectId} from '@taiga-ui/cdk/services';
@@ -31,7 +32,7 @@ import {
     TuiWithDropdownOpen,
 } from '@taiga-ui/core/directives/dropdown';
 import {TuiWithIcons} from '@taiga-ui/core/directives/icons';
-import {TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';
+import {TUI_CLEAR_WORD, TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';
 import type {TuiSizeL, TuiSizeS} from '@taiga-ui/core/types';
 import type {PolymorpheusContent} from '@taiga-ui/polymorpheus';
 import {PolymorpheusOutlet} from '@taiga-ui/polymorpheus';
@@ -81,6 +82,7 @@ export class TuiTextfieldComponent<T> implements TuiDataListHost<T> {
     protected readonly control?: NgControl;
 
     protected readonly icons = inject(TUI_COMMON_ICONS);
+    protected readonly clear = toSignal(inject(TUI_CLEAR_WORD));
 
     protected computedFiller = computed(() => {
         const value = this.directive?.nativeValue() || '';
diff --git a/projects/core/components/textfield/textfield.template.html b/projects/core/components/textfield/textfield.template.html
index aba2f6b964ca7..32ddda880a7a2 100644
--- a/projects/core/components/textfield/textfield.template.html
+++ b/projects/core/components/textfield/textfield.template.html
@@ -18,7 +18,9 @@
         [iconStart]="icons.close"
         (click)="directive?.setValue(null)"
         (pointerdown.silent.prevent)="input?.nativeElement?.focus()"
-    ></button>
+    >
+        {{ clear() }}
+    </button>
     <ng-container #vcr />
     <ng-content select="tui-icon" />
 </span>
diff --git a/projects/core/tokens/i18n.ts b/projects/core/tokens/i18n.ts
index df553ddf237f8..f5f61cf6789a4 100644
--- a/projects/core/tokens/i18n.ts
+++ b/projects/core/tokens/i18n.ts
@@ -11,6 +11,11 @@ export const TUI_MONTHS = tuiCreateTokenFromFactory(tuiExtractI18n('months'));
  */
 export const TUI_CLOSE_WORD = tuiCreateTokenFromFactory(tuiExtractI18n('close'));
 
+/**
+ * i18n 'clear' word
+ */
+export const TUI_CLEAR_WORD = tuiCreateTokenFromFactory(tuiExtractI18n('clear'));
+
 /**
  * i18n 'Nothing found' message
  */
diff --git a/projects/demo/src/modules/components/app-bar/examples/1/index.html b/projects/demo/src/modules/components/app-bar/examples/1/index.html
index 45a62a964c05a..8deb7091b4983 100644
--- a/projects/demo/src/modules/components/app-bar/examples/1/index.html
+++ b/projects/demo/src/modules/components/app-bar/examples/1/index.html
@@ -37,6 +37,7 @@ <h3>iOS</h3>
 
     <tui-app-bar>
         <button
+            title="Back"
             tuiAppBarBack
             tuiSlot="left"
             type="button"
@@ -128,6 +129,7 @@ <h3 class="tui-space_top-8">Android</h3>
 
     <tui-app-bar>
         <button
+            title="Back"
             tuiAppBarBack
             tuiSlot="left"
             type="button"
diff --git a/projects/demo/src/modules/components/app-bar/examples/3/index.html b/projects/demo/src/modules/components/app-bar/examples/3/index.html
index 7495903a1358e..0a483ac460c1f 100644
--- a/projects/demo/src/modules/components/app-bar/examples/3/index.html
+++ b/projects/demo/src/modules/components/app-bar/examples/3/index.html
@@ -44,6 +44,7 @@ <h3>Customization</h3>
     <button
         appearance=""
         iconStart="@tui.settings"
+        title="Settings"
         tuiIconButton
         tuiSlot="right"
         type="button"
@@ -111,6 +112,7 @@ <h3 class="tui-space_top-8">Centered Android</h3>
 
     <tui-app-bar>
         <button
+            title="Back"
             tuiAppBarBack
             tuiSlot="left"
             type="button"
diff --git a/projects/demo/src/modules/components/carousel/examples/4/index.html b/projects/demo/src/modules/components/carousel/examples/4/index.html
index e97637d721660..253c0bd85aac6 100644
--- a/projects/demo/src/modules/components/carousel/examples/4/index.html
+++ b/projects/demo/src/modules/components/carousel/examples/4/index.html
@@ -30,7 +30,9 @@
             type="button"
             class="tui-space_right-4"
             (click)="navigate(-1)"
-        ></button>
+        >
+            Previous
+        </button>
         <tui-carousel [(index)]="index">
             <div *tuiItem>
                 <h2>Carousel is awesome</h2>
@@ -66,7 +68,9 @@ <h2>Buttons</h2>
             type="button"
             class="tui-space_left-4"
             (click)="navigate(1)"
-        ></button>
+        >
+            Next
+        </button>
     </div>
     <tui-pagination
         size="s"
diff --git a/projects/demo/src/modules/components/data-list/examples/2/index.html b/projects/demo/src/modules/components/data-list/examples/2/index.html
index 6209ef689bc6b..e51b07143b145 100644
--- a/projects/demo/src/modules/components/data-list/examples/2/index.html
+++ b/projects/demo/src/modules/components/data-list/examples/2/index.html
@@ -6,7 +6,9 @@
     [tuiAppearanceState]="open ? 'hover' : null"
     [tuiDropdown]="content"
     [(tuiDropdownOpen)]="open"
-></button>
+>
+    Open
+</button>
 <ng-template #content>
     <tui-data-list
         tuiDataListDropdownManager
diff --git a/projects/demo/src/modules/components/data-list/examples/3/index.html b/projects/demo/src/modules/components/data-list/examples/3/index.html
index d4a31a5666be5..26d5b6d85a526 100644
--- a/projects/demo/src/modules/components/data-list/examples/3/index.html
+++ b/projects/demo/src/modules/components/data-list/examples/3/index.html
@@ -8,7 +8,9 @@ <h3>Multi select control</h3>
     [tuiDropdown]="content"
     [tuiDropdownMaxHeight]="500"
     [(tuiDropdownOpen)]="control"
-></button>
+>
+    Open
+</button>
 <ng-template #content>
     <tui-data-list [style.width.rem]="12">
         <tui-opt-group
@@ -49,7 +51,9 @@ <h3>Separate toggles</h3>
     [tuiDropdown]="separate"
     [tuiDropdownMaxHeight]="500"
     [(tuiDropdownOpen)]="label"
-></button>
+>
+    Open
+</button>
 <ng-template #separate>
     <tui-data-list [style.width.rem]="10">
         <label tuiOption>
diff --git a/projects/demo/src/modules/components/input-slider/examples/2/index.html b/projects/demo/src/modules/components/input-slider/examples/2/index.html
index 7a9cfa37e1a31..cf1916f17fbf1 100644
--- a/projects/demo/src/modules/components/input-slider/examples/2/index.html
+++ b/projects/demo/src/modules/components/input-slider/examples/2/index.html
@@ -16,7 +16,9 @@
             tuiIconButton
             type="button"
             (click)="decrease()"
-        ></button>
+        >
+            Decrease
+        </button>
     </span>
     <span>20%</span>
     <span>40%</span>
@@ -30,6 +32,8 @@
             tuiIconButton
             type="button"
             (click)="increase()"
-        ></button>
+        >
+            Increase
+        </button>
     </span>
 </div>
diff --git a/projects/demo/src/modules/components/mobile-calendar/examples/4/index.html b/projects/demo/src/modules/components/mobile-calendar/examples/4/index.html
index c6d44590c9dd7..a98bf385d99ea 100644
--- a/projects/demo/src/modules/components/mobile-calendar/examples/4/index.html
+++ b/projects/demo/src/modules/components/mobile-calendar/examples/4/index.html
@@ -6,7 +6,9 @@
         type="button"
         [style.border-radius.%]="100"
         (click)="onClick()"
-    ></button>
+    >
+        Calendar
+    </button>
     <span
         class="date"
         [class.date_empty]="empty"
diff --git a/projects/demo/src/modules/components/mobile-calendar/examples/5/index.html b/projects/demo/src/modules/components/mobile-calendar/examples/5/index.html
index c6d44590c9dd7..a98bf385d99ea 100644
--- a/projects/demo/src/modules/components/mobile-calendar/examples/5/index.html
+++ b/projects/demo/src/modules/components/mobile-calendar/examples/5/index.html
@@ -6,7 +6,9 @@
         type="button"
         [style.border-radius.%]="100"
         (click)="onClick()"
-    ></button>
+    >
+        Calendar
+    </button>
     <span
         class="date"
         [class.date_empty]="empty"
diff --git a/projects/demo/src/modules/components/primitive-textfield/examples/1/index.html b/projects/demo/src/modules/components/primitive-textfield/examples/1/index.html
index 1895c24bce1ee..ddc4241429fca 100644
--- a/projects/demo/src/modules/components/primitive-textfield/examples/1/index.html
+++ b/projects/demo/src/modules/components/primitive-textfield/examples/1/index.html
@@ -23,7 +23,9 @@
         [iconStart]="icon"
         [tuiHint]="hintContent"
         (click)="togglePasswordVisibility()"
-    ></button>
+    >
+        Toggle password visibility
+    </button>
 </ng-template>
 
 <ng-template #hintContent>{{ hint }}</ng-template>
diff --git a/projects/demo/src/modules/components/slider/examples/6/index.html b/projects/demo/src/modules/components/slider/examples/6/index.html
index dc815b9489991..9ca6ca1fd93d6 100644
--- a/projects/demo/src/modules/components/slider/examples/6/index.html
+++ b/projects/demo/src/modules/components/slider/examples/6/index.html
@@ -7,7 +7,9 @@
         type="button"
         class="minus"
         (click)="change(-0.25)"
-    ></button>
+    >
+        Minus
+    </button>
     <label
         tuiSliderThumbLabel
         class="slider-wrapper"
@@ -40,5 +42,7 @@
         type="button"
         class="plus"
         (click)="change(+0.25)"
-    ></button>
+    >
+        Plus
+    </button>
 </section>
diff --git a/projects/demo/src/modules/components/swipe-action/examples/1/index.html b/projects/demo/src/modules/components/swipe-action/examples/1/index.html
index 4a9ea660b6502..37e607e11f4b2 100644
--- a/projects/demo/src/modules/components/swipe-action/examples/1/index.html
+++ b/projects/demo/src/modules/components/swipe-action/examples/1/index.html
@@ -20,14 +20,18 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Show
+    </button>
     <button
         iconStart="@tui.pencil-line"
         size="m"
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Edit
+    </button>
     <button
         appearance="secondary"
         iconStart="@tui.share"
@@ -35,7 +39,9 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Share
+    </button>
 </tui-swipe-actions>
 
 <tui-swipe-actions>
@@ -60,7 +66,9 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Show
+    </button>
 </tui-swipe-actions>
 
 <tui-swipe-actions
@@ -88,14 +96,18 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Show
+    </button>
     <button
         iconStart="@tui.pencil-line"
         size="s"
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Edit
+    </button>
     <button
         appearance="secondary"
         iconStart="@tui.share"
@@ -103,7 +115,9 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Share
+    </button>
     <button
         appearance="destructive"
         iconStart="@tui.trash"
@@ -111,5 +125,7 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Delete
+    </button>
 </tui-swipe-actions>
diff --git a/projects/demo/src/modules/components/swipe-action/examples/2/index.html b/projects/demo/src/modules/components/swipe-action/examples/2/index.html
index 6fba5ddbfa01e..2c55df88391e8 100644
--- a/projects/demo/src/modules/components/swipe-action/examples/2/index.html
+++ b/projects/demo/src/modules/components/swipe-action/examples/2/index.html
@@ -31,5 +31,7 @@ <h3 tuiTitle="m">Alex Inkin</h3>
         tuiSwipeAction
         type="button"
         [style.borderRadius.%]="100"
-    ></button>
+    >
+        Trash
+    </button>
 </tui-swipe-actions>
diff --git a/projects/demo/src/modules/components/swipe-action/examples/3/index.html b/projects/demo/src/modules/components/swipe-action/examples/3/index.html
index 88ab893ecff07..2b64076ea8607 100644
--- a/projects/demo/src/modules/components/swipe-action/examples/3/index.html
+++ b/projects/demo/src/modules/components/swipe-action/examples/3/index.html
@@ -20,14 +20,18 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Show
+    </button>
     <button
         iconStart="@tui.pencil-line"
         size="m"
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Edit
+    </button>
     <button
         appearance="secondary"
         iconStart="@tui.share"
@@ -35,7 +39,9 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Share
+    </button>
 </tui-swipe-actions>
 
 <tui-swipe-actions [autoClose]="true">
@@ -60,14 +66,18 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Show
+    </button>
     <button
         iconStart="@tui.pencil-line"
         size="m"
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Edit
+    </button>
     <button
         appearance="secondary"
         iconStart="@tui.share"
@@ -75,5 +85,7 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Share
+    </button>
 </tui-swipe-actions>
diff --git a/projects/demo/src/modules/components/swipe-action/examples/4/index.html b/projects/demo/src/modules/components/swipe-action/examples/4/index.html
index 2e3698d9e01c2..87c2cc927beda 100644
--- a/projects/demo/src/modules/components/swipe-action/examples/4/index.html
+++ b/projects/demo/src/modules/components/swipe-action/examples/4/index.html
@@ -21,7 +21,9 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Edit
+    </button>
     <button
         *ngIf="shareButton"
         appearance="secondary"
@@ -30,7 +32,9 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Share
+    </button>
 </tui-swipe-actions>
 
 <label>
diff --git a/projects/demo/src/modules/components/swipe-action/examples/5/index.html b/projects/demo/src/modules/components/swipe-action/examples/5/index.html
index 8f39650b25e5f..994d10b6b8581 100644
--- a/projects/demo/src/modules/components/swipe-action/examples/5/index.html
+++ b/projects/demo/src/modules/components/swipe-action/examples/5/index.html
@@ -23,7 +23,9 @@
         type="button"
         class="fallback"
         [tuiDropdown]="content"
-    ></button>
+    >
+        Actions
+    </button>
 
     <ng-template #content>
         <tui-data-list>
@@ -48,12 +50,16 @@
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Show
+    </button>
     <button
         iconStart="@tui.pencil-line"
         size="m"
         tuiIconButton
         tuiSwipeAction
         type="button"
-    ></button>
+    >
+        Edit
+    </button>
 </tui-swipe-actions>
diff --git a/projects/demo/src/modules/components/tag/examples/3/index.html b/projects/demo/src/modules/components/tag/examples/3/index.html
index 7f1846d08db7f..11a71f633a2c4 100644
--- a/projects/demo/src/modules/components/tag/examples/3/index.html
+++ b/projects/demo/src/modules/components/tag/examples/3/index.html
@@ -6,4 +6,6 @@
     value="Hey there"
     class="tag"
     [hoverable]="true"
-></button>
+>
+    Custom tag
+</button>
diff --git a/projects/demo/src/modules/components/tag/examples/6/index.html b/projects/demo/src/modules/components/tag/examples/6/index.html
index d48ee011742d2..89f73d183b9d8 100644
--- a/projects/demo/src/modules/components/tag/examples/6/index.html
+++ b/projects/demo/src/modules/components/tag/examples/6/index.html
@@ -9,7 +9,9 @@
     value="Button"
     class="tui-space_left-2"
     [hoverable]="true"
-></button>
+>
+    Button tag
+</button>
 <a
     href="https://maskito.dev"
     rel="noreferrer noopener"
@@ -19,4 +21,6 @@
     value="Link"
     class="tui-space_left-2"
     [hoverable]="true"
-></a>
+>
+    Link tag
+</a>
diff --git a/projects/demo/src/modules/directives/dropdown-hover/examples/2/index.html b/projects/demo/src/modules/directives/dropdown-hover/examples/2/index.html
index a8489b628a795..a71e41169b1ed 100644
--- a/projects/demo/src/modules/directives/dropdown-hover/examples/2/index.html
+++ b/projects/demo/src/modules/directives/dropdown-hover/examples/2/index.html
@@ -49,6 +49,7 @@
     </button>
     <button
         iconStart="@tui.settings"
+        title="Open settings"
         tuiDropdownHover
         tuiTab
         type="button"
diff --git a/projects/demo/src/modules/directives/dropdown-open/examples/4/index.html b/projects/demo/src/modules/directives/dropdown-open/examples/4/index.html
index 02a868a3f6405..77033d5b6e60d 100644
--- a/projects/demo/src/modules/directives/dropdown-open/examples/4/index.html
+++ b/projects/demo/src/modules/directives/dropdown-open/examples/4/index.html
@@ -18,7 +18,9 @@
             type="reset"
             [iconStart]="length ? '@tui.x' : ''"
             (mousedown.silent.prevent)="(0)"
-        ></button>
+        >
+            Reset
+        </button>
     </button>
     <ng-template #dropdown>
         <tui-data-list-wrapper
diff --git a/projects/i18n/languages/belarusian/core.ts b/projects/i18n/languages/belarusian/core.ts
index 3c8583b5983f8..dd3d5ce9c9c4c 100644
--- a/projects/i18n/languages/belarusian/core.ts
+++ b/projects/i18n/languages/belarusian/core.ts
@@ -18,6 +18,7 @@ export const TUI_BELARUSIAN_LANGUAGE_CORE: TuiLanguageCore = {
         'Снежань',
     ],
     close: 'Закрыць',
+    clear: 'Ачысціць',
     nothingFoundMessage: 'Нічога не знойдзена',
     defaultErrorMessage: 'Недапушчальнае значэнне',
     spinTexts: ['Папярэдні', 'Наступны'],
diff --git a/projects/i18n/languages/chinese/core.ts b/projects/i18n/languages/chinese/core.ts
index e16c7edbb0703..ebc8098117116 100644
--- a/projects/i18n/languages/chinese/core.ts
+++ b/projects/i18n/languages/chinese/core.ts
@@ -18,6 +18,7 @@ export const TUI_CHINESE_LANGUAGE_CORE: TuiLanguageCore = {
         '十二月',
     ],
     close: '关闭',
+    clear: '清除',
     nothingFoundMessage: '什么都没找到',
     defaultErrorMessage: '无效值',
     spinTexts: ['前', '后'],
diff --git a/projects/i18n/languages/dutch/core.ts b/projects/i18n/languages/dutch/core.ts
index ca9bce5e18db7..20c550f64a0a9 100644
--- a/projects/i18n/languages/dutch/core.ts
+++ b/projects/i18n/languages/dutch/core.ts
@@ -18,6 +18,7 @@ export const TUI_DUTCH_LANGUAGE_CORE: TuiLanguageCore = {
         'December',
     ],
     close: 'Sluiten',
+    clear: 'Duidelijk veld',
     nothingFoundMessage: 'Niets gevonden',
     defaultErrorMessage: 'Ongeldige waarde',
     spinTexts: ['Vorige', 'Volgende'],
diff --git a/projects/i18n/languages/english/core.ts b/projects/i18n/languages/english/core.ts
index c4b2bbfa81c52..b60f8a1bd7f68 100644
--- a/projects/i18n/languages/english/core.ts
+++ b/projects/i18n/languages/english/core.ts
@@ -18,6 +18,7 @@ export const TUI_ENGLISH_LANGUAGE_CORE: TuiLanguageCore = {
         'December',
     ],
     close: 'Close',
+    clear: 'Clear',
     nothingFoundMessage: 'Nothing found',
     defaultErrorMessage: 'Value is invalid',
     spinTexts: ['Previous', 'Next'],
diff --git a/projects/i18n/languages/french/core.ts b/projects/i18n/languages/french/core.ts
index f925240b01aa8..e419e37f9a902 100644
--- a/projects/i18n/languages/french/core.ts
+++ b/projects/i18n/languages/french/core.ts
@@ -18,6 +18,7 @@ export const TUI_FRENCH_LANGUAGE_CORE: TuiLanguageCore = {
         'Décembre',
     ],
     close: 'Fermer',
+    clear: 'Effacer le champ',
     nothingFoundMessage: 'Aucun résultat',
     defaultErrorMessage: 'Valeur non valide',
     spinTexts: ['Précédent', 'Suivant'],
diff --git a/projects/i18n/languages/german/core.ts b/projects/i18n/languages/german/core.ts
index 617d191edbdfc..773fe405c007a 100644
--- a/projects/i18n/languages/german/core.ts
+++ b/projects/i18n/languages/german/core.ts
@@ -17,6 +17,7 @@ export const TUI_GERMAN_LANGUAGE_CORE: TuiLanguageCore = {
         'Dezember',
     ],
     close: 'Schließen',
+    clear: 'Leeres Feld',
     nothingFoundMessage: 'Keine Ergebnisse',
     defaultErrorMessage: 'Wert ist ungültig',
     spinTexts: ['Zurück', 'Weiter'],
diff --git a/projects/i18n/languages/hebrew/core.ts b/projects/i18n/languages/hebrew/core.ts
index 0842e35f0f0d4..d378d61c5ca1e 100644
--- a/projects/i18n/languages/hebrew/core.ts
+++ b/projects/i18n/languages/hebrew/core.ts
@@ -18,6 +18,7 @@ export const TUI_HEBREW_LANGUAGE_CORE: TuiLanguageCore = {
         'דֵצֶמבֶּר',
     ],
     close: 'סגור',
+    clear: 'נקה שדה',
     nothingFoundMessage: 'שום דבר לא נמצא',
     defaultErrorMessage: 'הערך לא חוקי',
     spinTexts: ['קודם', 'הַבָּא'],
diff --git a/projects/i18n/languages/italian/core.ts b/projects/i18n/languages/italian/core.ts
index c55b4f605400b..fedd1596ea160 100644
--- a/projects/i18n/languages/italian/core.ts
+++ b/projects/i18n/languages/italian/core.ts
@@ -18,6 +18,7 @@ export const TUI_ITALIAN_LANGUAGE_CORE: TuiLanguageCore = {
         'Dicembre',
     ],
     close: 'Chiudi',
+    clear: 'Campo libero',
     nothingFoundMessage: 'Non abbiamo trovato nulla',
     defaultErrorMessage: 'Il valore non è valido',
     spinTexts: ['Precedente', 'Prossimo'],
diff --git a/projects/i18n/languages/japan/core.ts b/projects/i18n/languages/japan/core.ts
index 1f814e67abda8..0a3022247e446 100644
--- a/projects/i18n/languages/japan/core.ts
+++ b/projects/i18n/languages/japan/core.ts
@@ -18,6 +18,7 @@ export const TUI_JAPAN_LANGUAGE_CORE: TuiLanguageCore = {
         '12月',
     ],
     close: '近い',
+    clear: 'フィールドをクリアする',
     nothingFoundMessage: '何も見つかりません',
     defaultErrorMessage: '値が無効です',
     spinTexts: ['前の', '次'],
diff --git a/projects/i18n/languages/kazakh/core.ts b/projects/i18n/languages/kazakh/core.ts
index 922b060c2b7ef..2c5986760223a 100644
--- a/projects/i18n/languages/kazakh/core.ts
+++ b/projects/i18n/languages/kazakh/core.ts
@@ -18,6 +18,7 @@ export const TUI_KAZAKH_LANGUAGE_CORE: TuiLanguageCore = {
         'Желтоқсан',
     ],
     close: 'Жабық',
+    clear: 'Өрісті тазалау',
     nothingFoundMessage: 'Ештеңе табылмады',
     defaultErrorMessage: 'Мән жарамсыз',
     spinTexts: ['Алдыңғы', 'Келесі'],
diff --git a/projects/i18n/languages/korean/core.ts b/projects/i18n/languages/korean/core.ts
index bffcba2f1186d..45c32d9e61329 100644
--- a/projects/i18n/languages/korean/core.ts
+++ b/projects/i18n/languages/korean/core.ts
@@ -18,6 +18,7 @@ export const TUI_KOREAN_LANGUAGE_CORE: TuiLanguageCore = {
         '12월',
     ],
     close: '닫다',
+    clear: '필드 지우기',
     nothingFoundMessage: '아무것도 발견되지 않았습니다',
     defaultErrorMessage: '값이 잘못되었습니다',
     spinTexts: ['이전의', '다음'],
diff --git a/projects/i18n/languages/lithuanian/core.ts b/projects/i18n/languages/lithuanian/core.ts
index b045901d821ce..a0054d85e2b3c 100644
--- a/projects/i18n/languages/lithuanian/core.ts
+++ b/projects/i18n/languages/lithuanian/core.ts
@@ -18,6 +18,7 @@ export const TUI_LITHUANIAN_LANGUAGE_CORE: TuiLanguageCore = {
         'Gruodis',
     ],
     close: 'Uždaryti',
+    clear: 'Notīrīt lauku',
     nothingFoundMessage: 'Nieko nerasta',
     defaultErrorMessage: 'Reikšmė neteisinga',
     spinTexts: ['Ankstesnis', 'Kitas'],
diff --git a/projects/i18n/languages/malay/core.ts b/projects/i18n/languages/malay/core.ts
index d2ee596286ac8..01f5c2849d5d5 100644
--- a/projects/i18n/languages/malay/core.ts
+++ b/projects/i18n/languages/malay/core.ts
@@ -18,6 +18,7 @@ export const TUI_MALAY_LANGUAGE_CORE: TuiLanguageCore = {
         'Disember',
     ],
     close: 'Tutup',
+    clear: 'Kosongkan medan',
     nothingFoundMessage: 'Tiada apa-apa Dijumpai',
     defaultErrorMessage: 'Nilai tidak sah',
     spinTexts: ['Sebelum', 'Selepas'],
diff --git a/projects/i18n/languages/polish/core.ts b/projects/i18n/languages/polish/core.ts
index 31e7acb3b8ee9..a6d27bfaea0a5 100644
--- a/projects/i18n/languages/polish/core.ts
+++ b/projects/i18n/languages/polish/core.ts
@@ -18,6 +18,7 @@ export const TUI_POLISH_LANGUAGE_CORE: TuiLanguageCore = {
         'grudzień',
     ],
     close: 'Zamknij',
+    clear: 'Wyczyść pole',
     nothingFoundMessage: 'Nic nie znaleziono',
     defaultErrorMessage: 'Nieprawidłowa wartość',
     spinTexts: ['Poprzedni', 'Następny'],
diff --git a/projects/i18n/languages/portuguese/core.ts b/projects/i18n/languages/portuguese/core.ts
index b6c09af7978b8..e105bb4842904 100644
--- a/projects/i18n/languages/portuguese/core.ts
+++ b/projects/i18n/languages/portuguese/core.ts
@@ -18,6 +18,7 @@ export const TUI_PORTUGUESE_LANGUAGE_CORE: TuiLanguageCore = {
         'Dezembro',
     ],
     close: 'Fechar',
+    clear: 'Limpar',
     nothingFoundMessage: 'Nada encontrado',
     defaultErrorMessage: 'Valor é inválido',
     spinTexts: ['Anterior', 'Próximo'],
diff --git a/projects/i18n/languages/russian/core.ts b/projects/i18n/languages/russian/core.ts
index 58497dc0349f9..438f15f53e163 100644
--- a/projects/i18n/languages/russian/core.ts
+++ b/projects/i18n/languages/russian/core.ts
@@ -18,6 +18,7 @@ export const TUI_RUSSIAN_LANGUAGE_CORE: TuiLanguageCore = {
         'Декабрь',
     ],
     close: 'Закрыть',
+    clear: 'Очистить',
     nothingFoundMessage: 'Ничего не найдено',
     defaultErrorMessage: 'Поле заполнено неверно',
     spinTexts: ['Предыдущий', 'Следующий'],
diff --git a/projects/i18n/languages/spanish/core.ts b/projects/i18n/languages/spanish/core.ts
index 573f9f7c3dd77..0433551c49674 100644
--- a/projects/i18n/languages/spanish/core.ts
+++ b/projects/i18n/languages/spanish/core.ts
@@ -18,6 +18,7 @@ export const TUI_SPANISH_LANGUAGE_CORE: TuiLanguageCore = {
         'Diciembre',
     ],
     close: 'Cerrar',
+    clear: 'Borrar campo',
     nothingFoundMessage: 'Nada encontrado',
     defaultErrorMessage: 'El valor es inválido',
     spinTexts: ['Previo', 'Siguiente'],
diff --git a/projects/i18n/languages/turkish/core.ts b/projects/i18n/languages/turkish/core.ts
index 11e548cde275d..93d6e6297b143 100644
--- a/projects/i18n/languages/turkish/core.ts
+++ b/projects/i18n/languages/turkish/core.ts
@@ -17,6 +17,7 @@ export const TUI_TURKISH_LANGUAGE_CORE: TuiLanguageCore = {
         'Aralık',
     ],
     close: 'Kapat',
+    clear: 'Alanı temizle',
     nothingFoundMessage: 'Kayıt Bulunamadı',
     defaultErrorMessage: 'Değer hatalı',
     spinTexts: ['Geri', 'İleri'],
diff --git a/projects/i18n/languages/ukrainian/core.ts b/projects/i18n/languages/ukrainian/core.ts
index de2ad93408f37..b2a14ec24d5a5 100644
--- a/projects/i18n/languages/ukrainian/core.ts
+++ b/projects/i18n/languages/ukrainian/core.ts
@@ -17,6 +17,7 @@ export const TUI_UKRAINIAN_LANGUAGE_CORE: TuiLanguageCore = {
         'Грудень',
     ],
     close: 'Закрити',
+    clear: 'Очистити',
     nothingFoundMessage: 'Нічого не знайдено',
     defaultErrorMessage: 'Поле заповнено невірно',
     spinTexts: ['Попередній', 'Наступний'],
diff --git a/projects/i18n/languages/vietnamese/core.ts b/projects/i18n/languages/vietnamese/core.ts
index cb5080ec6f82d..e05ad22408ab2 100644
--- a/projects/i18n/languages/vietnamese/core.ts
+++ b/projects/i18n/languages/vietnamese/core.ts
@@ -18,6 +18,7 @@ export const TUI_VIETNAMESE_LANGUAGE_CORE: TuiLanguageCore = {
         'Tháng 12',
     ],
     close: 'Đóng',
+    clear: 'Xóa trường',
     nothingFoundMessage: 'Không tìm thấy',
     defaultErrorMessage: 'Giá trị không hợp lệ',
     spinTexts: ['Trước', 'Sau'],
diff --git a/projects/i18n/types/language.ts b/projects/i18n/types/language.ts
index f227ae5328a6f..87565ebe28079 100644
--- a/projects/i18n/types/language.ts
+++ b/projects/i18n/types/language.ts
@@ -3,6 +3,7 @@ import type {TuiLanguageName} from './language-names';
 
 export interface TuiLanguageCore {
     close: string;
+    clear: string;
     countries: Record<TuiCountryIsoCode, string>;
     defaultErrorMessage: string;
     months: readonly [
diff --git a/projects/kit/components/pagination/pagination.style.less b/projects/kit/components/pagination/pagination.style.less
index 7b0fcea51003e..2adeb509cbcdd 100644
--- a/projects/kit/components/pagination/pagination.style.less
+++ b/projects/kit/components/pagination/pagination.style.less
@@ -33,6 +33,7 @@
         // @note: (&&&_) it's increasing css cascade priority
         inline-size: 0.5rem;
         block-size: 0.5rem;
+        font-size: 0;
         padding: 0;
         margin: 0;
 
diff --git a/projects/kit/components/pagination/pagination.template.html b/projects/kit/components/pagination/pagination.template.html
index 121a01322a50f..dfc0faf0f6323 100644
--- a/projects/kit/components/pagination/pagination.template.html
+++ b/projects/kit/components/pagination/pagination.template.html
@@ -67,7 +67,9 @@
             (click)="onElementClick(indexItem)"
             (keydown.arrowLeft.prevent)="onElementKeyDownArrowLeft(element)"
             (keydown.arrowRight.prevent)="onElementKeyDownArrowRight(element)"
-        ></button>
+        >
+            {{ indexItem + 1 }}
+        </button>
     </ng-template>
     <ng-template #dotsTemplate>
         <div
diff --git a/projects/kit/components/tree/components/tree-item-content/tree-item-content.component.ts b/projects/kit/components/tree/components/tree-item-content/tree-item-content.component.ts
index 82d4f9d074a21..674807343dedc 100644
--- a/projects/kit/components/tree/components/tree-item-content/tree-item-content.component.ts
+++ b/projects/kit/components/tree/components/tree-item-content/tree-item-content.component.ts
@@ -4,6 +4,7 @@ import {ChangeDetectionStrategy, Component, forwardRef, inject} from '@angular/c
 import {toSignal} from '@angular/core/rxjs-interop';
 import {TuiButton} from '@taiga-ui/core/components/button';
 import {TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';
+import {TUI_MORE_WORD} from '@taiga-ui/kit/tokens';
 import {injectContext} from '@taiga-ui/polymorpheus';
 import {distinctUntilChanged, map, startWith, Subject} from 'rxjs';
 
@@ -29,6 +30,7 @@ export class TuiTreeItemContent implements DoCheck {
     private readonly change$ = new Subject<void>();
 
     protected readonly icons = inject(TUI_COMMON_ICONS);
+    protected readonly more = toSignal(inject(TUI_MORE_WORD));
     protected readonly context = injectContext<TuiTreeItemContext>();
 
     protected readonly expanded = toSignal(
diff --git a/projects/kit/components/tree/components/tree-item-content/tree-item-content.template.html b/projects/kit/components/tree/components/tree-item-content/tree-item-content.template.html
index 9f4af3750e599..43e816930c2a4 100644
--- a/projects/kit/components/tree/components/tree-item-content/tree-item-content.template.html
+++ b/projects/kit/components/tree/components/tree-item-content/tree-item-content.template.html
@@ -9,5 +9,7 @@
     [iconStart]="icons.more"
     [style.border-radius.%]="100"
     (click)="onClick()"
-></button>
+>
+    {{ more() }}
+</button>
 <ng-container [ngTemplateOutlet]="context.template" />