refactor: post comments (#8601)

taiga-family · Aug 20, 2024 · 237019b · 237019b
1 parent abfba9e
commit 237019b
Show file tree

Hide file tree

Showing 25 changed files with 52 additions and 56 deletions.
diff --git a/projects/addon-doc/directives/text-code/text-code.directive.ts b/projects/addon-doc/directives/text-code/text-code.directive.ts
@@ -1,5 +1,8 @@
 import {Directive, Input} from '@angular/core';
 
+/**
+ * @deprecated: use [textContent]="code"
+ */
 @Directive({
     standalone: true,
     selector: 'code[tuiDocText]',

diff --git a/projects/addon-mobile/directives/sidebar/sidebar.component.ts b/projects/addon-mobile/directives/sidebar/sidebar.component.ts
@@ -20,7 +20,7 @@ import {TuiSidebarDirective} from './sidebar.directive';
     changeDetection: ChangeDetectionStrategy.OnPush,
     animations: [tuiSlideIn],
     host: {
-        class: '"t-" + direction',
+        '[class]': '"t-" + direction',
         '[@tuiSlideIn]': 'animation',
     },
 })

diff --git a/projects/core/components/expand/expand.component.ts b/projects/core/components/expand/expand.component.ts
@@ -136,7 +136,6 @@ export class TuiExpandComponent {
         }
     }
 
-    // noinspection JSUnusedGlobalSymbols
     protected onExpandLoaded(event: Event): void {
         event.stopPropagation();
 

diff --git a/projects/core/components/scrollbar/scrollbar.component.ts b/projects/core/components/scrollbar/scrollbar.component.ts
@@ -57,12 +57,10 @@ export class TuiScrollbar {
         return this.browserScrollRef.nativeElement !== this.el;
     }
 
-    // noinspection JSUnusedGlobalSymbols
     protected onScrollable(element: HTMLElement): void {
         this.browserScrollRef.nativeElement = element;
     }
 
-    // noinspection JSUnusedGlobalSymbols
     protected scrollIntoView(detail: HTMLElement): void {
         if (this.delegated) {
             return;

diff --git a/projects/core/directives/dropdown/dropdown-context.directive.ts b/projects/core/directives/dropdown/dropdown-context.directive.ts
@@ -36,7 +36,7 @@ const MOVE_THRESHOLD = 15;
             'onTouchStart($event.touches[0].clientX, $event.touches[0].clientY)',
         '(document:pointerdown.silent)': 'closeDropdown($event.target)',
         '(document:contextmenu.capture.silent)': 'closeDropdown($event.target)',
-        '(document:keydown.esc)': 'closeDropdown($event.target)',
+        '(document:keydown.esc)': 'closeDropdown($event.currentTarget)',
         '(contextmenu.prevent.stop)': 'onContextMenu($event.clientX, $event.clientY)',
     },
 })

diff --git a/projects/demo/src/modules/components/alert/index.html b/projects/demo/src/modules/components/alert/index.html
@@ -78,7 +78,7 @@
                 [(documentationPropertyValue)]="data"
             >
                 Input data of notification, type:
-                <code tuiDocText="<I>"></code>
+                <code [textContent]="'<I>'"></code>
             </ng-template>
             <ng-template
                 documentationPropertyName="autoClose"
@@ -138,7 +138,7 @@
                     You can also customize notification logic with a component. Inject
                     <code>POLYMORPHEUS_CONTEXT</code>
                     into the component to get context input data and to output results. It has the following interface:
-                    <code tuiDocText="TuiPopover<TuiAlertOptions<I>, O>"></code>
+                    <code [textContent]="'TuiPopover<TuiAlertOptions<I>, O>'"></code>
                     , where
                     <code>O</code>
                     is output data type and

diff --git a/projects/demo/src/modules/components/combo-box/index.html b/projects/demo/src/modules/components/combo-box/index.html
@@ -221,7 +221,7 @@
                 [(documentationPropertyValue)]="strict"
             >
                 Value must only be an item of suggestions&nbsp;
-                <code tuiDocText="<T>"></code>
+                <code [textContent]="'<T>'"></code>
 
                 <p>
                     <strong>
@@ -232,7 +232,7 @@
                         can handle
                         <code>string</code>
                         value, as well as
-                        <code tuiDocText="<T>"></code>
+                        <code [textContent]="'<T>'"></code>
                     </strong>
                 </p>
             </ng-template>

diff --git a/projects/demo/src/modules/components/dialog/index.html b/projects/demo/src/modules/components/dialog/index.html
@@ -209,9 +209,9 @@ <h2 *ngIf="size === 'xl'">Template can be customized</h2>
 
                 <p>
                     Pass
-                    <code tuiDocText="Observable<boolean>"></code>
+                    <code [textContent]="'Observable<boolean>'"></code>
                     if you want prevent closing, for example, with a confirmation prompt. Be careful, passing
-                    <code tuiDocText="Observable<boolean>"></code>
+                    <code [textContent]="'Observable<boolean>'"></code>
                     will always display cross button even if it emits
                     <code>false</code>
                     value!
@@ -223,7 +223,7 @@ <h2 *ngIf="size === 'xl'">Template can be customized</h2>
                 [(documentationPropertyValue)]="dismissible"
             >
                 Dialog can be canceled with Escape key or with a click outside. Pass
-                <code tuiDocText="Observable<boolean>"></code>
+                <code [textContent]="'Observable<boolean>'"></code>
                 if you want prevent closing, for example, with a confirmation prompt.
             </ng-template>
             <ng-template
@@ -232,7 +232,7 @@ <h2 *ngIf="size === 'xl'">Template can be customized</h2>
                 [(documentationPropertyValue)]="data"
             >
                 Input data for dialog, type:
-                <code tuiDocText="<T>"></code>
+                <code [textContent]="'<T>'"></code>
             </ng-template>
             <ng-template
                 documentationPropertyName="header"
@@ -298,7 +298,7 @@ <h2 *ngIf="size === 'xl'">Template can be customized</h2>
                     in it. Dialog will provide this token with some useful options:
                     <code>$implicit</code>
                     with
-                    <code tuiDocText="Observer<O>"></code>
+                    <code [textContent]="'Observer<O>'"></code>
                     and
                     <code>completeWith</code>
                     hook to call

diff --git a/projects/demo/src/modules/components/input/index.html b/projects/demo/src/modules/components/input/index.html
@@ -291,7 +291,7 @@
                 [(documentationPropertyValue)]="placeholder"
             >
                 Placeholder (use external
-                <code tuiDocText="<input tuiTextfieldLegacy />"></code>
+                <code [textContent]="'<input tuiTextfieldLegacy />'"></code>
                 to set it)
             </ng-template>
         </tui-doc-documentation>

diff --git a/projects/demo/src/modules/components/progress-bar/examples/2/index.html b/projects/demo/src/modules/components/progress-bar/examples/2/index.html
@@ -1,7 +1,7 @@
 <h6 class="description">Single color</h6>
 <p>
     Use
-    <code tuiDocText="<progress />"></code>
+    <code [textContent]="'<progress />'"></code>
     's CSS-property
     <code>color</code>
     to set solid color of progress indicator.

diff --git a/projects/demo/src/modules/components/progress-bar/examples/2/index.ts b/projects/demo/src/modules/components/progress-bar/examples/2/index.ts
@@ -2,14 +2,13 @@ import {AsyncPipe, isPlatformServer} from '@angular/common';
 import {Component, inject, PLATFORM_ID} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
-import {TuiDocText} from '@taiga-ui/addon-doc';
 import {TUI_IS_E2E} from '@taiga-ui/cdk';
 import {TuiProgress} from '@taiga-ui/kit';
 import {of, timer} from 'rxjs';
 
 @Component({
     standalone: true,
-    imports: [TuiDocText, TuiProgress, AsyncPipe],
+    imports: [TuiProgress, AsyncPipe],
     templateUrl: './index.html',
     styleUrls: ['./index.less'],
     encapsulation,

diff --git a/projects/demo/src/modules/components/progress-bar/index.html b/projects/demo/src/modules/components/progress-bar/index.html
@@ -11,13 +11,13 @@
             </dt>
             <dd>
                 – attribute component for native html tag
-                <code tuiDocText="<progress />"></code>
+                <code [textContent]="'<progress />'"></code>
                 .
             </dd>
         </dl>
         <p>
             <strong>Usage:</strong>
-            <code tuiDocText='<progress tuiProgressBar value="40" max="100"></progress>'></code>
+            <code [textContent]="'<progress tuiProgressBar value=\'40\' max=\'100\'></progress>'"></code>
             .
         </p>
 
@@ -119,7 +119,7 @@
                     value
                 </a>
                 of
-                <code tuiDocText="<progress />"></code>
+                <code [textContent]="'<progress />'"></code>
             </ng-template>
 
             <ng-template
@@ -138,7 +138,7 @@
                     max
                 </a>
                 of
-                <code tuiDocText="<progress />"></code>
+                <code [textContent]="'<progress />'"></code>
             </ng-template>
 
             <ng-template
@@ -161,7 +161,7 @@
                 Color of the progress indicator
                 <p>
                     We recommend set solid color via
-                    <code tuiDocText="<progress />"></code>
+                    <code [textContent]="'<progress />'"></code>
                     's CSS-property
                     <code>color</code>
                     (especially, if you support old not-chromium based Edge)

diff --git a/projects/demo/src/modules/components/progress-circle/index.html b/projects/demo/src/modules/components/progress-circle/index.html
@@ -7,7 +7,7 @@
     <ng-template pageTab>
         <dl>
             <dt>
-                <code tuiDocText="<tui-progress-circle />"></code>
+                <code [textContent]="'<tui-progress-circle />'"></code>
             </dt>
             <dd>
                 is a component to visually represent the completion of a process or operation (as a partially filled

diff --git a/projects/demo/src/modules/components/services/scroll-service/index.html b/projects/demo/src/modules/components/services/scroll-service/index.html
@@ -19,7 +19,7 @@
         <p>
             Method
             <strong>
-                <code tuiDocText="scroll$: Observable<[number, number]>"></code>
+                <code [textContent]="'scroll$: Observable<[number, number]>'"></code>
             </strong>
             <em>
                 (emits a tuple tuple

diff --git a/projects/demo/src/modules/components/slider/index.html b/projects/demo/src/modules/components/slider/index.html
@@ -10,7 +10,7 @@
             </dt>
             <dd>
                 attribute component for native html tag
-                <code tuiDocText='<input type="range" />'></code>
+                <code [textContent]="'<input type=\'range\' />'"></code>
                 to choose a value from a limited range.
             </dd>
         </dl>
@@ -28,7 +28,7 @@
         </p>
         <p>
             <strong>Usage:</strong>
-            <code tuiDocText='<input tuiSlider type="range" min="0" max="100" step="1" />'></code>
+            <code [textContent]="'<input tuiSlider type=\'range\' min=\'0\' max=\'100\' step=\'1\' />'"></code>
             .
         </p>
 
@@ -147,7 +147,7 @@
                     max
                 </a>
                 of
-                <code tuiDocText='<input type="range" />'></code>
+                <code [textContent]="'<input type=\'range\' />'"></code>
             </ng-template>
             <ng-template
                 documentationPropertyMode="input"
@@ -165,7 +165,7 @@
                     min
                 </a>
                 of
-                <code tuiDocText='<input type="range" />'></code>
+                <code [textContent]="'<input type=\'range\' />'"></code>
             </ng-template>
             <ng-template
                 documentationPropertyMode="input"
@@ -183,7 +183,7 @@
                     step
                 </a>
                 of
-                <code tuiDocText='<input type="range" />'></code>
+                <code [textContent]="'<input type=\'range\' />'"></code>
             </ng-template>
             <ng-template
                 documentationPropertyMode="input"

diff --git a/projects/demo/src/modules/components/textarea/index.html b/projects/demo/src/modules/components/textarea/index.html
@@ -114,7 +114,7 @@
                 [(documentationPropertyValue)]="maxLength"
             >
                 Use maxLength for highlighting extra characters. If you want to limit the number of characters, add
-                <code tuiDocText="<textarea tuiTextfieldLegacy></textarea>"></code>
+                <code [textContent]="'<textarea tuiTextfieldLegacy />'"></code>
                 with native maxlength attribute.
             </ng-template>
             <ng-template

diff --git a/projects/demo/src/modules/directives/swipe/examples/1/index.ts b/projects/demo/src/modules/directives/swipe/examples/1/index.ts
@@ -12,7 +12,7 @@ import {TuiSwipe} from '@taiga-ui/cdk';
     encapsulation,
     changeDetection,
     host: {
-        class: 'swiped',
+        '[class]': 'swiped',
     },
 })
 export default class Example {

diff --git a/projects/demo/src/modules/markup/spaces/examples/1/index.html b/projects/demo/src/modules/markup/spaces/examples/1/index.html
@@ -1,6 +1,6 @@
 <h2 class="title">
     Margin top
-    <code tuiDocText="tui-space_top-<value>"></code>
+    <code [textContent]="'tui-space_top-<value>'"></code>
 </h2>
 <div class="row">
     <div class="example tui-space_top-1 tui-space_right-2">
@@ -21,7 +21,7 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Margin bottom
-    <code tuiDocText="tui-space_bottom-<value>"></code>
+    <code [textContent]="'tui-space_bottom-<value>'"></code>
 </h2>
 <div class="row row_align-items_bottom">
     <div class="example tui-space_bottom-1 tui-space_right-2">
@@ -42,7 +42,7 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Margin right
-    <code tuiDocText="tui-space_right-<value>"></code>
+    <code [textContent]="'tui-space_right-<value>'"></code>
 </h2>
 <div class="row">
     <div class="example tui-space_right-1">
@@ -64,7 +64,7 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Margin left
-    <code tuiDocText="tui-space_left-<value>"></code>
+    <code [textContent]="'tui-space_left-<value>'"></code>
 </h2>
 <div class="row">
     <div class="example"></div>
@@ -86,9 +86,9 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Vertical and horizontal margins
-    <code tuiDocText="tui-space_vertical-<value>"></code>
+    <code [textContent]="'tui-space_vertical-<value>'"></code>
     and
-    <code tuiDocText="tui-space_horizontal-<value>"></code>
+    <code [textContent]="'tui-space_horizontal-<value>'"></code>
 </h2>
 <div class="row">
     <div class="example tui-space_vertical-4">

diff --git a/projects/demo/src/modules/markup/spaces/examples/1/index.ts b/projects/demo/src/modules/markup/spaces/examples/1/index.ts
@@ -2,11 +2,11 @@ import {ClipboardModule} from '@angular/cdk/clipboard';
 import {Component} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
-import {TuiDocCopy, TuiDocText} from '@taiga-ui/addon-doc';
+import {TuiDocCopy} from '@taiga-ui/addon-doc';
 
 @Component({
     standalone: true,
-    imports: [TuiDocText, TuiDocCopy, ClipboardModule],
+    imports: [TuiDocCopy, ClipboardModule],
     templateUrl: './index.html',
     styleUrls: ['./index.less'],
     encapsulation,

diff --git a/projects/demo/src/modules/markup/spaces/examples/2/index.html b/projects/demo/src/modules/markup/spaces/examples/2/index.html
@@ -1,6 +1,6 @@
 <h2 class="title">
     Margin top
-    <code tuiDocText=".tui-space(top, <value>);"></code>
+    <code [textContent]="'.tui-space(top, <value>);'"></code>
 </h2>
 <div class="row">
     <div class="example example_top-1">
@@ -21,7 +21,7 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Margin bottom
-    <code tuiDocText=".tui-space(bottom, <value>);"></code>
+    <code [textContent]="'.tui-space(bottom, <value>);'"></code>
 </h2>
 <div class="row row_align-items_bottom">
     <div class="example example_bottom-1">
@@ -42,7 +42,7 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Margin right
-    <code tuiDocText=".tui-space(right, <value>);"></code>
+    <code [textContent]="'.tui-space(right, <value>);'"></code>
 </h2>
 <div class="row">
     <div class="example example_right-1">
@@ -64,7 +64,7 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Margin left
-    <code tuiDocText=".tui-space(left, <value>);"></code>
+    <code [textContent]="'.tui-space(left, <value>);'"></code>
 </h2>
 <div class="row">
     <div class="example"></div>
@@ -86,9 +86,9 @@ <h2 class="title">
 </div>
 <h2 class="title">
     Vertical and horizontal margins
-    <code tuiDocText=".tui-space(vertical, <value>);"></code>
+    <code [textContent]="'.tui-space(vertical, <value>);'"></code>
     and
-    <code tuiDocText=".tui-space(horizontal, <value>);"></code>
+    <code [textContent]="'.tui-space(horizontal, <value>);'"></code>
 </h2>
 <div class="row">
     <div class="example example_vertical">
-Original file line number
+Diff line change
@@ Expand Up / @@ -136,7 +136,6 @@ export class TuiExpandComponent { @@
             }
         }
-        // noinspection JSUnusedGlobalSymbols
         protected onExpandLoaded(event: Event): void {
             event.stopPropagation();
@@ Expand Down @@