chore: drop legacy buttons (#7126)

Co-authored-by: taiga-family-bot <taiga-family-bot@users.noreply.github.com>
taiga-family · Apr 2, 2024 · 034c667 · 034c667
1 parent d6b1cf5
commit 034c667
Show file tree

Hide file tree

Showing 380 changed files with 1,398 additions and 3,071 deletions.
diff --git a/projects/addon-charts/components/legend-item/legend-item.module.ts b/projects/addon-charts/components/legend-item/legend-item.module.ts
@@ -1,11 +1,11 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {TuiButtonModule} from '@taiga-ui/core';
+import {TuiButtonDirective} from '@taiga-ui/core';
 
 import {TuiLegendItemComponent} from './legend-item.component';
 
 @NgModule({
-    imports: [CommonModule, TuiButtonModule],
+    imports: [CommonModule, TuiButtonDirective],
     declarations: [TuiLegendItemComponent],
     exports: [TuiLegendItemComponent],
 })

diff --git a/projects/addon-charts/components/legend-item/legend-item.template.html b/projects/addon-charts/components/legend-item/legend-item.template.html
@@ -4,7 +4,7 @@
     tuiButton
     type="button"
     class="t-button"
-    [pseudoHover]="active || null"
+    [tuiAppearanceState]="active ? 'hover' : null"
 >
     <div class="t-wrapper">
         <ng-content select="[tuiCheckbox]" />

diff --git a/projects/addon-doc/components/code/code.module.ts b/projects/addon-doc/components/code/code.module.ts
@@ -1,7 +1,7 @@
 import {ClipboardModule} from '@angular/cdk/clipboard';
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {TuiButtonModule, TuiSvgModule} from '@taiga-ui/core';
+import {TuiButtonDirective, TuiSvgModule} from '@taiga-ui/core';
 import {HighlightModule} from 'ngx-highlightjs';
 
 import {TuiDocCodeComponent} from './code.component';
@@ -11,7 +11,7 @@ import {TuiDocCodeComponent} from './code.component';
         CommonModule,
         TuiSvgModule,
         HighlightModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         ClipboardModule,
     ],
     declarations: [TuiDocCodeComponent],

diff --git a/projects/addon-doc/components/code/code.template.html b/projects/addon-doc/components/code/code.template.html
@@ -15,7 +15,7 @@
             appearance="icon"
             size="xs"
             class="t-copy-button"
-            [icon]="(icon$ | async) || 'tuiIconCopyLarge'"
+            [iconLeft]="(icon$ | async) || 'tuiIconCopyLarge'"
             [cdkCopyToClipboard]="content"
             (click)="copy$.next()"
         >

diff --git a/projects/addon-doc/components/copy/copy.module.ts b/projects/addon-doc/components/copy/copy.module.ts
@@ -1,11 +1,11 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {TuiButtonModule} from '@taiga-ui/core';
+import {TuiButtonDirective} from '@taiga-ui/core';
 
 import {TuiDocCopyComponent} from './copy.component';
 
 @NgModule({
-    imports: [CommonModule, TuiButtonModule],
+    imports: [CommonModule, TuiButtonDirective],
     declarations: [TuiDocCopyComponent],
     exports: [TuiDocCopyComponent],
 })

diff --git a/projects/addon-doc/components/copy/copy.template.html b/projects/addon-doc/components/copy/copy.template.html
@@ -5,7 +5,6 @@
     tuiButton
     type="button"
     class="t-copy"
-    [title]="texts[0]"
     (click)="onClick()"
 >
     <span

diff --git a/projects/addon-doc/components/demo/demo.module.ts b/projects/addon-doc/components/demo/demo.module.ts
@@ -4,7 +4,7 @@ import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {RouterModule} from '@angular/router';
 import {TuiResizerModule} from '@taiga-ui/cdk';
 import {
-    TuiButtonModule,
+    TuiButtonDirective,
     TuiDataListModule,
     TuiExpandModule,
     TuiGroupDirective,
@@ -31,7 +31,7 @@ import {TuiDocDemoComponent} from './demo.component';
         FormsModule,
         RouterModule,
         TuiLinkModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiSelectModule,
         TuiExpandModule,
         TuiGroupDirective,

diff --git a/projects/addon-doc/components/demo/demo.template.html b/projects/addon-doc/components/demo/demo.template.html
@@ -108,6 +108,7 @@
         <div
             #content
             id="demo-content"
+            [attr.tuiTheme]="mode === 'onDark' ? 'night' : null"
         >
             <form
                 *ngIf="testForm"
@@ -123,18 +124,15 @@
                     tuiButton
                     type="button"
                     class="t-button"
-                    [iconRight]="icon"
                     (click)="toggleDetails()"
                 >
                     {{ texts[2] }}
-                </button>
-                <ng-template #icon>
                     <tui-svg
                         class="t-icon"
                         [class.t-icon_rotated]="expanded"
                         [src]="options.iconSmall"
                     />
-                </ng-template>
+                </button>
                 <tui-expand
                     class="t-expand"
                     [expanded]="expanded"

diff --git a/projects/addon-doc/components/example/example.module.ts b/projects/addon-doc/components/example/example.module.ts
@@ -3,7 +3,7 @@ import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {RouterModule} from '@angular/router';
 import {TuiMapperPipeModule} from '@taiga-ui/cdk';
-import {TuiButtonModule, TuiLoaderModule} from '@taiga-ui/core';
+import {TuiButtonDirective, TuiLoaderModule} from '@taiga-ui/core';
 import {TuiTabsModule} from '@taiga-ui/kit';
 import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';
 
@@ -17,7 +17,7 @@ import {TuiDocExampleGetTabsPipe} from './example-get-tabs.pipe';
         CommonModule,
         ClipboardModule,
         TuiTabsModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiDocCopyModule,
         TuiDocCodeModule,
         PolymorpheusModule,

diff --git a/projects/addon-doc/components/example/example.template.html b/projects/addon-doc/components/example/example.template.html
@@ -15,10 +15,11 @@
         type="button"
         class="t-link-icon"
         [fragment]="id"
-        [icon]="options.linkIcon"
-        [title]="copy$ | async"
+        [iconLeft]="options.linkIcon"
         (click)="copyExampleLink($any($event.currentTarget))"
-    ></a>
+    >
+        {{ copy$ | async }}
+    </a>
 </h3>
 <h4
     *ngIf="description"

diff --git a/projects/addon-doc/components/internal/header/header.module.ts b/projects/addon-doc/components/internal/header/header.module.ts
@@ -2,7 +2,7 @@ import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {TuiSidebarModule} from '@taiga-ui/addon-mobile';
 import {TuiActiveZoneDirective} from '@taiga-ui/cdk';
-import {TuiButtonModule} from '@taiga-ui/core';
+import {TuiButtonDirective} from '@taiga-ui/core';
 import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';
 
 import {TuiDocNavigationModule} from '../../navigation/navigation.module';
@@ -12,7 +12,7 @@ import {TuiDocHeaderComponent} from './header.component';
     imports: [
         CommonModule,
         PolymorpheusModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiSidebarModule,
         TuiActiveZoneDirective,
         TuiDocNavigationModule,

diff --git a/projects/addon-doc/components/internal/header/header.template.html b/projects/addon-doc/components/internal/header/header.template.html
@@ -3,7 +3,7 @@
     tuiIconButton
     type="button"
     class="t-menu"
-    [icon]="icons.menu"
+    [iconLeft]="icons.menu"
     [title]="menu"
     (click)="onClick()"
     (tuiActiveZoneChange)="onActiveZone($event)"

diff --git a/projects/addon-doc/components/internal/source-code/source-code.module.ts b/projects/addon-doc/components/internal/source-code/source-code.module.ts
@@ -1,12 +1,12 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {TuiButtonModule} from '@taiga-ui/core';
+import {TuiButtonDirective} from '@taiga-ui/core';
 import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';
 
 import {TuiDocSourceCodeComponent} from './source-code.component';
 
 @NgModule({
-    imports: [CommonModule, PolymorpheusModule, TuiButtonModule],
+    imports: [CommonModule, PolymorpheusModule, TuiButtonDirective],
     declarations: [TuiDocSourceCodeComponent],
     exports: [TuiDocSourceCodeComponent],
 })

diff --git a/projects/addon-doc/components/internal/source-code/source-code.template.html b/projects/addon-doc/components/internal/source-code/source-code.template.html
@@ -6,6 +6,8 @@
     tuiIconButton
     type="button"
     [href]="link"
-    [icon]="icons.code"
-    [title]="text"
-></a>
+    [iconLeft]="icons.code"
+    [style.height]="'var(--tui-height-l)'"
+>
+    {{ text }}
+</a>
diff --git a/projects/addon-doc/components/main/main.module.ts b/projects/addon-doc/components/main/main.module.ts
@@ -3,7 +3,7 @@ import {NgModule} from '@angular/core';
 import {RouterModule} from '@angular/router';
 import {
     TuiAlertModule,
-    TuiButtonModule,
+    TuiButtonDirective,
     TuiDialogModule,
     TuiModeModule,
     TuiRootModule,
@@ -23,7 +23,7 @@ import {TuiDocMainComponent} from './main.component';
         TuiRootModule,
         TuiDialogModule,
         TuiAlertModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiModeModule,
         TuiDocNavigationModule,
     ],

diff --git a/projects/addon-doc/components/main/main.template.html b/projects/addon-doc/components/main/main.template.html
@@ -12,13 +12,12 @@
         <ng-content select="tuiDocHeader" />
         <button
             appearance="secondary"
-            shape="rounded"
             size="s"
             tuiIconButton
-            tuiMode="onLight"
             type="button"
             class="tui-doc-night-mode-switch"
-            [icon]="icon"
+            [iconLeft]="icon"
+            [style.border-radius.%]="100"
             (click)="night.toggle()"
         ></button>
     </header>

diff --git a/projects/addon-doc/components/navigation/navigation.module.ts b/projects/addon-doc/components/navigation/navigation.module.ts
@@ -5,7 +5,7 @@ import {RouterModule} from '@angular/router';
 import {TuiScrollIntoViewLinkModule} from '@taiga-ui/addon-doc/directives';
 import {TuiActiveZoneDirective, TuiAutoFocusDirective, TuiLetModule} from '@taiga-ui/cdk';
 import {
-    TuiButtonModule,
+    TuiButtonDirective,
     TuiDataListModule,
     TuiDropdownModule,
     TuiExpandModule,
@@ -28,7 +28,7 @@ import {TuiDocNavigationComponent} from './navigation.component';
         RouterModule,
         PolymorpheusModule,
         TuiScrollIntoViewLinkModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiInputModule,
         TuiTextfieldControllerModule,
         TuiActiveZoneDirective,

diff --git a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.module.ts b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.module.ts
@@ -6,7 +6,7 @@ import {TuiTouchableModule} from '@taiga-ui/addon-mobile/directives/touchable';
 import {TuiPrimitiveCalendarMobileModule} from '@taiga-ui/addon-mobile/internal/primitive-calendar-mobile';
 import {TuiMapperPipeModule} from '@taiga-ui/cdk';
 import {
-    TuiButtonModule,
+    TuiButtonDirective,
     TuiLinkModule,
     TuiMonthPipeModule,
     TuiOrderWeekDaysPipeModule,
@@ -23,7 +23,7 @@ import {TuiMobileCalendarComponent} from './mobile-calendar.component';
         TuiMapperPipeModule,
         TuiLinkModule,
         TuiPrimitiveCalendarMobileModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiMonthPipeModule,
         TuiOrderWeekDaysPipeModule,
     ],

diff --git a/projects/addon-mobile/components/mobile-calendar/mobile-calendar.template.html b/projects/addon-mobile/components/mobile-calendar/mobile-calendar.template.html
@@ -2,15 +2,16 @@
     <button
         appearance=""
         automation-id="tui-mobile-calendar__cancel"
-        shape="rounded"
         tuiIconButton
         tuiRipple
         type="button"
         class="t-close"
-        [icon]="icons.close"
-        [title]="closeWord$ | async"
+        [iconLeft]="icons.close"
+        [style.border-radius.%]="100"
         (click)="onClose()"
-    ></button>
+    >
+        {{ closeWord$ | async }}
+    </button>
     <button
         tuiLink
         tuiTouchable="opacity"

diff --git a/projects/addon-mobile/components/mobile-dialog/mobile-dialog.module.ts b/projects/addon-mobile/components/mobile-dialog/mobile-dialog.module.ts
@@ -1,13 +1,13 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {TuiRippleModule} from '@taiga-ui/addon-mobile/directives/ripple';
-import {TuiButtonModule} from '@taiga-ui/core';
+import {TuiButtonDirective} from '@taiga-ui/core';
 import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';
 
 import {TuiMobileDialogComponent} from './mobile-dialog.component';
 
 @NgModule({
-    imports: [CommonModule, TuiButtonModule, TuiRippleModule, PolymorpheusModule],
+    imports: [CommonModule, TuiButtonDirective, TuiRippleModule, PolymorpheusModule],
     declarations: [TuiMobileDialogComponent],
     exports: [TuiMobileDialogComponent],
 })

diff --git a/projects/addon-mobile/components/sheet-dialog/sheet-dialog.module.ts b/projects/addon-mobile/components/sheet-dialog/sheet-dialog.module.ts
@@ -1,14 +1,19 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {TuiClickOutsideModule} from '@taiga-ui/cdk';
-import {TuiButtonModule} from '@taiga-ui/core';
+import {TuiButtonDirective} from '@taiga-ui/core';
 import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';
 
 import {TuiSheetDialogComponent} from './sheet-dialog.component';
 import {TuiSheetDialogDirective} from './sheet-dialog.directive';
 
 @NgModule({
-    imports: [CommonModule, PolymorpheusModule, TuiClickOutsideModule, TuiButtonModule],
+    imports: [
+        CommonModule,
+        PolymorpheusModule,
+        TuiClickOutsideModule,
+        TuiButtonDirective,
+    ],
     declarations: [TuiSheetDialogComponent, TuiSheetDialogDirective],
     exports: [TuiSheetDialogComponent, TuiSheetDialogDirective],
 })

diff --git a/projects/addon-mobile/components/sheet-dialog/sheet-dialog.template.html b/projects/addon-mobile/components/sheet-dialog/sheet-dialog.template.html
@@ -27,7 +27,7 @@
             size="xs"
             tuiIconButton
             class="t-close"
-            [icon]="icons.close"
+            [iconLeft]="icons.close"
             (click)="close()"
         >
             {{ closeWord$ | async }}

diff --git a/projects/addon-mobile/components/sheet/components/sheet-heading/sheet-heading.template.html b/projects/addon-mobile/components/sheet/components/sheet-heading/sheet-heading.template.html
@@ -4,10 +4,11 @@
     tuiIconButton
     type="button"
     class="t-close"
-    [icon]="icons.close"
-    [title]="closeWord$ | async"
+    [iconLeft]="icons.close"
     (click)="onClick()"
-></button>
+>
+    {{ closeWord$ | async }}
+</button>
 <span [id]="id">
     <ng-content />
 </span>
diff --git a/projects/addon-mobile/components/sheet/sheet.module.ts b/projects/addon-mobile/components/sheet/sheet.module.ts
@@ -1,7 +1,7 @@
 import {CommonModule} from '@angular/common';
 import {NgModule, NO_ERRORS_SCHEMA} from '@angular/core';
 import {TuiLetModule, TuiOverscrollModule} from '@taiga-ui/cdk';
-import {TuiButtonModule, TuiScrollbarComponent} from '@taiga-ui/core';
+import {TuiButtonDirective, TuiScrollbarComponent} from '@taiga-ui/core';
 import {PolymorpheusModule} from '@tinkoff/ng-polymorpheus';
 
 import {TuiSheetComponent} from './components/sheet/sheet.component';
@@ -23,7 +23,7 @@ import {TuiSheetDirective} from './sheet.directive';
         CommonModule,
         PolymorpheusModule,
         TuiLetModule,
-        TuiButtonModule,
+        TuiButtonDirective,
         TuiOverscrollModule,
         TuiScrollbarComponent,
     ],

diff --git a/projects/addon-mobile/styles/common/button.less b/projects/addon-mobile/styles/common/button.less
@@ -1,6 +1,9 @@
-[tuiButtonNew] {
+[tuiButton] {
     width: 100%;
+}
 
+[tuiButton],
+[tuiIconButton] {
     &[data-size='xs'],
     &[data-size='s'],
     &[data-size='l'] {