refactor!: remove tui-wrapper, tui-group, table-mode, field-error com…

…ponent, tui-breadcrumb items (#2121) * refactor!: remove tui-wrapper, tui-group, table-mode, field-error component, tui-breadcrumb items
taiga-family · Aug 5, 2022 · bd1999b · bd1999b
1 parent ec3f30a
commit bd1999b
Show file tree

Hide file tree

Showing 279 changed files with 669 additions and 2,366 deletions.
diff --git a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.template.html b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.template.html
@@ -1,11 +1,12 @@
-<tui-wrapper
+<div
     *ngIf="cardGroupedTexts$ | async as texts"
+    tuiWrapper
     class="t-common-wrapper"
     [appearance]="appearance"
     [readOnly]="readOnly"
     [disabled]="computedDisabled"
     [focused]="computedFocused"
-    [hovered]="computedHovered"
+    [hover]="computedHovered"
     [invalid]="computedInvalid"
     [tuiDropdown]="open"
     [tuiDropdownContent]="dropdown || ''"
@@ -154,4 +155,4 @@
             (click)="toggle()"
         ></tui-svg>
     </div>
-</tui-wrapper>
+</div>
diff --git a/...n-doc/schematics/doc-page/files/component/__name@dasherize__/__name@dasherize__.module.ts b/...n-doc/schematics/doc-page/files/component/__name@dasherize__/__name@dasherize__.module.ts
@@ -2,7 +2,7 @@ import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {RouterModule} from '@angular/router';
 
-import {generateRoutes, TuiAddonDocModule,
+import {tuiGenerateRoutes, TuiAddonDocModule,
     TuiDocExampleModule,
     TuiDocPageModule,
     TuiDocDocumentationModule,
@@ -22,7 +22,7 @@ import {<%= classify(name) %>Example<%=i%>} from './examples/<%=i%>'; <%}%>
         TuiDocDocumentationModule,
         TuiDocCodeModule,
         TuiDocDemoModule,
-        RouterModule.forChild(generateRoutes(Example<%= classify(name) %>Component)),
+        RouterModule.forChild(tuiGenerateRoutes(Example<%= classify(name) %>Component)),
     ],
     declarations: [Example<%= classify(name) %>Component, <% for(let i=1; i<=samples; i++) {%>
                    <%= classify(name) %>Example<%=i%>,<%}%>

diff --git a/projects/addon-doc/src/utils/generate-routes.ts b/projects/addon-doc/src/utils/generate-routes.ts
@@ -1,12 +1,7 @@
 import {Type} from '@angular/core';
 import {Routes} from '@angular/router';
 
-/**
- * @deprecated: use {@link tuiGenerateRoutes} instead
- * Generates typical page routing structure
- */
-// eslint-disable-next-line @typescript-eslint/naming-convention
-export function generateRoutes(type: Type<unknown>): Routes {
+export function tuiGenerateRoutes(type: Type<unknown>): Routes {
     return [
         {
             path: ``,
@@ -20,5 +15,3 @@ export function generateRoutes(type: Type<unknown>): Routes {
         },
     ];
 }
-
-export const tuiGenerateRoutes = generateRoutes;
diff --git a/projects/addon-editor/components/editor-new/editor-new.component.html b/projects/addon-editor/components/editor-new/editor-new.component.html
@@ -1,67 +1,74 @@
-<tui-wrapper
-    *tuiLet="editorLoaded$ | async as editorLoaded"
+<div
+    tuiWrapper
     appearance="textfield"
-    class="t-wrapper"
+    class="t-outline"
     [readOnly]="readOnly"
     [disabled]="disabled"
     [focused]="computedFocused"
-    [hovered]="computedHovered"
+    [hover]="computedHovered"
     [invalid]="computedInvalid"
-    (tuiHoveredChange)="onHovered($event)"
-    (tuiActiveZoneChange)="onActiveZone($event)"
 >
-    <div class="t-toolbar-wrapper">
-        <tui-toolbar
-            *ngIf="editorLoaded"
-            new
-            [tools]="tools"
-            [disabled]="!interactive"
-        >
-            <ng-content select="tools"></ng-content>
-        </tui-toolbar>
-        <div
-            class="t-placeholder"
-            [class.t-placeholder_raised]="placeholderRaised"
-        >
-            <ng-content></ng-content>
-        </div>
-        <div
-            *ngIf="hasExampleText"
-            class="t-example-text"
-        >
-            {{ exampleText }}
+    <div
+        *tuiLet="editorLoaded$ | async as editorLoaded"
+        class="t-wrapper"
+        [class.t-wrapper_disabled]="disabled"
+        (tuiHoveredChange)="onHovered($event)"
+        (tuiActiveZoneChange)="onActiveZone($event)"
+    >
+        <div class="t-toolbar-wrapper">
+            <tui-toolbar
+                *ngIf="editorLoaded"
+                new
+                [tools]="tools"
+                [disabled]="!interactive"
+            >
+                <ng-content select="tools"></ng-content>
+            </tui-toolbar>
+            <div
+                class="t-placeholder"
+                [class.t-placeholder_raised]="placeholderRaised"
+            >
+                <ng-content></ng-content>
+            </div>
+            <div
+                *ngIf="hasExampleText"
+                class="t-example-text"
+            >
+                {{ exampleText }}
+            </div>
         </div>
-    </div>
 
-    <tui-scrollbar
-        tuiEditorPortal
-        class="t-scrollbar"
-    >
-        <div
-            *ngIf="editorLoaded"
-            tuiDropdownLimitWidth="auto"
-            tuiDropdownSelectionPosition="tag"
-            [tuiDropdownSelection]="dropdownSelectionHandler"
-            [tuiDropdownContent]="dropdown"
+        <tui-scrollbar
+            tuiEditorPortal
+            class="t-scrollbar"
         >
             <div
-                tuiTiptapEditor
-                spellcheck="false"
-                class="tui-editor-socket"
-                [value]="value"
-                [editable]="interactive"
-                (valueChange)="onModelChange($event)"
-                (stateChange)="(0)"
-            ></div>
-        </div>
+                *ngIf="editorLoaded"
+                tuiDropdownLimitWidth="auto"
+                tuiDropdownSelectionPosition="tag"
+                [tuiDropdownSelection]="dropdownSelectionHandler"
+                [tuiDropdownContent]="dropdown"
+            >
+                <div
+                    tuiTiptapEditor
+                    spellcheck="false"
+                    class="tui-editor-socket"
+                    [value]="value"
+                    [editable]="interactive"
+                    (valueChange)="onModelChange($event)"
+                    (stateChange)="(0)"
+                    (click)="selectLinkIfClosest()"
+                ></div>
+            </div>
 
-        <ng-template #dropdown>
-            <tui-edit-link
-                (addLink)="addLink($event)"
-                (removeLink)="removeLink()"
-            ></tui-edit-link>
-        </ng-template>
+            <ng-template #dropdown>
+                <tui-edit-link
+                    (addLink)="addLink($event)"
+                    (removeLink)="removeLink()"
+                ></tui-edit-link>
+            </ng-template>
 
-        <tui-editor-portal-host></tui-editor-portal-host>
-    </tui-scrollbar>
-</tui-wrapper>
+            <tui-editor-portal-host></tui-editor-portal-host>
+        </tui-scrollbar>
+    </div>
+</div>
diff --git a/projects/addon-editor/components/editor/editor.template.html b/projects/addon-editor/components/editor/editor.template.html
@@ -1,12 +1,13 @@
-<tui-wrapper
+<div
+    tuiWrapper
     appearance="textfield"
     class="t-outline"
     [readOnly]="readOnly"
     [disabled]="disabled"
     [focused]="computedFocused"
-    [hovered]="computedHovered"
+    [hover]="computedHovered"
     [invalid]="computedInvalid"
-></tui-wrapper>
+></div>
 <div
     class="t-wrapper"
     (tuiHoveredChange)="onHovered($event)"

diff --git a/projects/addon-preview/components/preview-dialog/preview-dialog.style.less b/projects/addon-preview/components/preview-dialog/preview-dialog.style.less
@@ -4,7 +4,7 @@
     height: 100%;
 }
 
-tui-wrapper[data-appearance='preview-action'] {
+[tuiWrapper][data-appearance='preview-action'] {
     background: rgba(104, 104, 104, 0.96);
     color: var(--tui-text-01-night);
 

diff --git a/projects/cdk/schematics/ng-update/tests/schematic-replace-html.spec.ts b/projects/cdk/schematics/ng-update/tests/schematic-replace-html.spec.ts
@@ -68,7 +68,7 @@ const TEMPLATE_BEFORE = `
 </tui-primitive-textfield>
 
 <div tuiWrapper
-    [hovered]="computedHovered"
+    [hover]="computedHovered"
 >any</div>
 
 <tui-select (hoveredChange)="onHoverChange(event$)"></tui-select>

diff --git a/projects/cdk/utils/miscellaneous/nullable-same.ts b/projects/cdk/utils/miscellaneous/nullable-same.ts
@@ -1,16 +1,14 @@
 import {TuiIdentityMatcher} from '@taiga-ui/cdk/types';
 
 /**
- * @deprecated: use {@link tuiNullableSame} instead
  * Checks identity for nullable elements.
  *
  * @param a element a
  * @param b element b
  * @param handler called if both elements are not null
  * @return true if either both are null or they pass identity handler
  */
-// eslint-disable-next-line @typescript-eslint/naming-convention
-export function nullableSame<T>(
+export function tuiNullableSame<T>(
     a: T | null,
     b: T | null,
     handler: TuiIdentityMatcher<T>,
@@ -25,5 +23,3 @@ export function nullableSame<T>(
 
     return handler(a, b);
 }
-
-export const tuiNullableSame = nullableSame;
diff --git a/projects/cdk/utils/miscellaneous/test/nullable-same.spec.ts b/projects/cdk/utils/miscellaneous/test/nullable-same.spec.ts
@@ -1,6 +1,6 @@
-import {nullableSame} from '../nullable-same';
+import {tuiNullableSame} from '../nullable-same';
 
-describe(`nullableSame`, () => {
+describe('nullableSame', () => {
     interface Test {
         readonly id: number;
     }
@@ -12,27 +12,27 @@ describe(`nullableSame`, () => {
     const value1: Test = {id: 1};
     const value2: Test = {id: 2};
 
-    describe(`returns true if`, () => {
-        it(`a = null, b = null`, () => {
-            expect(nullableSame(null, null, testMather)).toBe(true);
+    describe('returns true if', () => {
+        it('a = null, b = null', () => {
+            expect(tuiNullableSame(null, null, testMather)).toBe(true);
         });
 
-        it(`a = {id: 1}, b = {id: 1}`, () => {
-            expect(nullableSame(value1, value1, testMather)).toBe(true);
+        it('a = {id: 1}, b = {id: 1}', () => {
+            expect(tuiNullableSame(value1, value1, testMather)).toBe(true);
         });
     });
 
-    describe(`returns false if`, () => {
-        it(`a = {id: 1}, b = null`, () => {
-            expect(nullableSame(value1, null, testMather)).toBe(false);
+    describe('returns false if', () => {
+        it('a = {id: 1}, b = null', () => {
+            expect(tuiNullableSame(value1, null, testMather)).toBe(false);
         });
 
-        it(`a = null, b = {id: 1}`, () => {
-            expect(nullableSame(null, value1, testMather)).toBe(false);
+        it('a = null, b = {id: 1}', () => {
+            expect(tuiNullableSame(null, value1, testMather)).toBe(false);
         });
 
-        it(`a = {id: 1}, b = {id: 2}`, () => {
-            expect(nullableSame(value1, value2, testMather)).toBe(false);
+        it('a = {id: 1}, b = {id: 2}', () => {
+            expect(tuiNullableSame(value1, value2, testMather)).toBe(false);
         });
     });
 });
diff --git a/projects/core/components/button/button.template.html b/projects/core/components/button/button.template.html
@@ -1,8 +1,9 @@
-<tui-wrapper
+<div
+    tuiWrapper
     class="t-wrapper"
     [appearance]="appearance"
-    [hovered]="computedHovered"
-    [pressed]="computedPressed"
+    [hover]="computedHovered"
+    [active]="computedPressed"
     [disabled]="computedDisabled"
     [focused]="computedFocusVisible"
 >
@@ -41,4 +42,4 @@
         [size]="loaderSize"
         [inheritColor]="true"
     ></tui-loader>
-</tui-wrapper>
+</div>
diff --git a/projects/core/components/calendar/calendar.component.ts b/projects/core/components/calendar/calendar.component.ts
@@ -7,7 +7,6 @@ import {
 } from '@angular/core';
 import {
     ALWAYS_FALSE_HANDLER,
-    nullableSame,
     TUI_FIRST_DAY,
     TUI_LAST_DAY,
     TuiBooleanHandler,
@@ -16,6 +15,7 @@ import {
     tuiDefaultProp,
     TuiMapper,
     TuiMonth,
+    tuiNullableSame,
     TuiYear,
 } from '@taiga-ui/cdk';
 import {TUI_DEFAULT_MARKER_HANDLER} from '@taiga-ui/core/constants';
@@ -130,7 +130,7 @@ export class TuiCalendarComponent implements TuiWithOptionalMinMax<TuiDay> {
     }
 
     private updateHoveredDay(day: TuiDay | null): void {
-        if (nullableSame(this.hoveredItem, day, (a, b) => a.daySame(b))) {
+        if (tuiNullableSame(this.hoveredItem, day, (a, b) => a.daySame(b))) {
             return;
         }
 

diff --git a/projects/core/components/group/group.component.ts b/projects/core/components/group/group.component.ts
diff --git a/projects/core/components/group/group.module.ts b/projects/core/components/group/group.module.ts
@@ -1,14 +1,13 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 
-import {TuiGroupComponent} from './group.component';
 import {TuiGroupDirective} from './group.directive';
 import {TuiGroupStylesComponent} from './group-styles.component';
 
 @NgModule({
     imports: [CommonModule],
     entryComponents: [TuiGroupStylesComponent],
-    declarations: [TuiGroupComponent, TuiGroupDirective, TuiGroupStylesComponent],
-    exports: [TuiGroupComponent, TuiGroupDirective, TuiGroupStylesComponent],
+    declarations: [TuiGroupDirective, TuiGroupStylesComponent],
+    exports: [TuiGroupDirective, TuiGroupStylesComponent],
 })
 export class TuiGroupModule {}
diff --git a/projects/core/components/group/index.ts b/projects/core/components/group/index.ts
@@ -1,4 +1,3 @@
-export * from './group.component';
 export * from './group.directive';
 export * from './group.module';
 export * from './group-styles.component';