From ac4d539211b1af53e117f7a07b80c87faf05b887 Mon Sep 17 00:00:00 2001
From: shiv9604 <shivkounsalye@gmail.com>
Date: Fri, 27 Dec 2024 17:24:35 +0530
Subject: [PATCH 1/4] chore(demo): migrate alert api-docs to new api

---
 .../src/modules/components/alert/index.html   | 95 +++++++++++--------
 .../src/modules/components/alert/index.ts     |  4 +-
 2 files changed, 56 insertions(+), 43 deletions(-)

diff --git a/projects/demo/src/modules/components/alert/index.html b/projects/demo/src/modules/components/alert/index.html
index 62d8a5273cfb4..68ff0e4ce34e3 100644
--- a/projects/demo/src/modules/components/alert/index.html
+++ b/projects/demo/src/modules/components/alert/index.html
@@ -48,62 +48,75 @@
                 Show
             </button>
         </tui-doc-demo>
-        <tui-doc-documentation>
-            <ng-template
-                documentationPropertyName="content"
-                documentationPropertyType="PolymorpheusContent"
-                [documentationPropertyValues]="contentVariants"
-                [(documentationPropertyValue)]="content"
+        <table tuiDocAPI>
+            <tr
+                name="[content]"
+                tuiDocAPIItem
+                type="PolymorpheusContent"
+                [items]="contentVariants"
+                [(value)]="content"
             >
                 Content
-            </ng-template>
-            <ng-template
-                documentationPropertyName="appearance"
-                documentationPropertyType="string"
-                [documentationPropertyValues]="appearanceVariants"
-                [(documentationPropertyValue)]="appearance"
+            </tr>
+
+            <tr
+                name="[appearance]"
+                tuiDocAPIItem
+                type="string"
+                [items]="appearanceVariants"
+                [(value)]="appearance"
             >
                 Appearance
-            </ng-template>
-            <ng-template
-                documentationPropertyName="label"
-                documentationPropertyType="string"
-                [(documentationPropertyValue)]="label"
+            </tr>
+
+            <tr
+                name="[label]"
+                tuiDocAPIItem
+                type="string"
+                [(value)]="label"
             >
                 Heading
-            </ng-template>
-            <ng-template
-                documentationPropertyName="data"
-                documentationPropertyType="number"
-                [(documentationPropertyValue)]="data"
+            </tr>
+
+            <tr
+                name="[data]"
+                tuiDocAPIItem
+                type="number"
+                [(value)]="data"
             >
                 Input data of notification, type:
                 <code [textContent]="'<I>'"></code>
-            </ng-template>
-            <ng-template
-                documentationPropertyName="autoClose"
-                documentationPropertyType="TuiHandler | number"
-                [documentationPropertyValues]="autoCloseVariants"
-                [(documentationPropertyValue)]="autoClose"
+            </tr>
+
+            <tr
+                name="[autoClose]"
+                tuiDocAPIItem
+                type="TuiHandler | number"
+                [items]="autoCloseVariants"
+                [(value)]="autoClose"
             >
                 Auto close timeout, 0 for no auto close
-            </ng-template>
-            <ng-template
-                documentationPropertyName="closeable"
-                documentationPropertyType="boolean"
-                [(documentationPropertyValue)]="closeable"
+            </tr>
+
+            <tr
+                name="[closeable]"
+                tuiDocAPIItem
+                type="boolean"
+                [(value)]="closeable"
             >
                 Has close button
-            </ng-template>
-            <ng-template
-                documentationPropertyName="icon"
-                documentationPropertyType="PolymorpheusContent"
-                [documentationPropertyValues]="iconVariants"
-                [(documentationPropertyValue)]="icon"
+            </tr>
+
+            <tr
+                name="[icon]"
+                tuiDocAPIItem
+                type="PolymorpheusContent"
+                [items]="iconVariants"
+                [(value)]="icon"
             >
                 Icon
-            </ng-template>
-        </tui-doc-documentation>
+            </tr>
+        </table>
     </ng-template>
     <ng-template pageTab>
         <ol class="tui-list tui-list_ordered">
diff --git a/projects/demo/src/modules/components/alert/index.ts b/projects/demo/src/modules/components/alert/index.ts
index 4dc7def3fac3e..2e59f97abe3ac 100644
--- a/projects/demo/src/modules/components/alert/index.ts
+++ b/projects/demo/src/modules/components/alert/index.ts
@@ -8,12 +8,12 @@ import {TUI_NOTIFICATION_OPTIONS, TuiAlertService, TuiButton} from '@taiga-ui/co
 import type {PolymorpheusContent} from '@taiga-ui/polymorpheus';
 import {PolymorpheusComponent} from '@taiga-ui/polymorpheus';
 import {switchMap} from 'rxjs';
-
+import {TuiDocAPI, TuiDocAPIItem} from '@taiga-ui/addon-doc';
 import {AlertExampleWithData} from './examples/4';
 
 @Component({
     standalone: true,
-    imports: [TuiButton, TuiDemo],
+    imports: [TuiButton, TuiDemo, TuiDocAPI, TuiDocAPIItem],
     templateUrl: './index.html',
     changeDetection,
 })

From 0fdc6cf3e8f307839de2c6c4756daaa004a01653 Mon Sep 17 00:00:00 2001
From: shiv9604 <shivkounsalye@gmail.com>
Date: Fri, 27 Dec 2024 17:24:35 +0530
Subject: [PATCH 2/4] chore(demo): migrate alert api-docs to new api

---
 .../src/modules/components/alert/index.html   | 95 +++++++++++--------
 .../src/modules/components/alert/index.ts     |  4 +-
 2 files changed, 56 insertions(+), 43 deletions(-)

diff --git a/projects/demo/src/modules/components/alert/index.html b/projects/demo/src/modules/components/alert/index.html
index 62d8a5273cfb4..68ff0e4ce34e3 100644
--- a/projects/demo/src/modules/components/alert/index.html
+++ b/projects/demo/src/modules/components/alert/index.html
@@ -48,62 +48,75 @@
                 Show
             </button>
         </tui-doc-demo>
-        <tui-doc-documentation>
-            <ng-template
-                documentationPropertyName="content"
-                documentationPropertyType="PolymorpheusContent"
-                [documentationPropertyValues]="contentVariants"
-                [(documentationPropertyValue)]="content"
+        <table tuiDocAPI>
+            <tr
+                name="[content]"
+                tuiDocAPIItem
+                type="PolymorpheusContent"
+                [items]="contentVariants"
+                [(value)]="content"
             >
                 Content
-            </ng-template>
-            <ng-template
-                documentationPropertyName="appearance"
-                documentationPropertyType="string"
-                [documentationPropertyValues]="appearanceVariants"
-                [(documentationPropertyValue)]="appearance"
+            </tr>
+
+            <tr
+                name="[appearance]"
+                tuiDocAPIItem
+                type="string"
+                [items]="appearanceVariants"
+                [(value)]="appearance"
             >
                 Appearance
-            </ng-template>
-            <ng-template
-                documentationPropertyName="label"
-                documentationPropertyType="string"
-                [(documentationPropertyValue)]="label"
+            </tr>
+
+            <tr
+                name="[label]"
+                tuiDocAPIItem
+                type="string"
+                [(value)]="label"
             >
                 Heading
-            </ng-template>
-            <ng-template
-                documentationPropertyName="data"
-                documentationPropertyType="number"
-                [(documentationPropertyValue)]="data"
+            </tr>
+
+            <tr
+                name="[data]"
+                tuiDocAPIItem
+                type="number"
+                [(value)]="data"
             >
                 Input data of notification, type:
                 <code [textContent]="'<I>'"></code>
-            </ng-template>
-            <ng-template
-                documentationPropertyName="autoClose"
-                documentationPropertyType="TuiHandler | number"
-                [documentationPropertyValues]="autoCloseVariants"
-                [(documentationPropertyValue)]="autoClose"
+            </tr>
+
+            <tr
+                name="[autoClose]"
+                tuiDocAPIItem
+                type="TuiHandler | number"
+                [items]="autoCloseVariants"
+                [(value)]="autoClose"
             >
                 Auto close timeout, 0 for no auto close
-            </ng-template>
-            <ng-template
-                documentationPropertyName="closeable"
-                documentationPropertyType="boolean"
-                [(documentationPropertyValue)]="closeable"
+            </tr>
+
+            <tr
+                name="[closeable]"
+                tuiDocAPIItem
+                type="boolean"
+                [(value)]="closeable"
             >
                 Has close button
-            </ng-template>
-            <ng-template
-                documentationPropertyName="icon"
-                documentationPropertyType="PolymorpheusContent"
-                [documentationPropertyValues]="iconVariants"
-                [(documentationPropertyValue)]="icon"
+            </tr>
+
+            <tr
+                name="[icon]"
+                tuiDocAPIItem
+                type="PolymorpheusContent"
+                [items]="iconVariants"
+                [(value)]="icon"
             >
                 Icon
-            </ng-template>
-        </tui-doc-documentation>
+            </tr>
+        </table>
     </ng-template>
     <ng-template pageTab>
         <ol class="tui-list tui-list_ordered">
diff --git a/projects/demo/src/modules/components/alert/index.ts b/projects/demo/src/modules/components/alert/index.ts
index 4dc7def3fac3e..2e59f97abe3ac 100644
--- a/projects/demo/src/modules/components/alert/index.ts
+++ b/projects/demo/src/modules/components/alert/index.ts
@@ -8,12 +8,12 @@ import {TUI_NOTIFICATION_OPTIONS, TuiAlertService, TuiButton} from '@taiga-ui/co
 import type {PolymorpheusContent} from '@taiga-ui/polymorpheus';
 import {PolymorpheusComponent} from '@taiga-ui/polymorpheus';
 import {switchMap} from 'rxjs';
-
+import {TuiDocAPI, TuiDocAPIItem} from '@taiga-ui/addon-doc';
 import {AlertExampleWithData} from './examples/4';
 
 @Component({
     standalone: true,
-    imports: [TuiButton, TuiDemo],
+    imports: [TuiButton, TuiDemo, TuiDocAPI, TuiDocAPIItem],
     templateUrl: './index.html',
     changeDetection,
 })

From 593311d3a41fdc9b613a4737ac9ac353a5f19b29 Mon Sep 17 00:00:00 2001
From: taiga-family-bot <taiga-family-bot@users.noreply.github.com>
Date: Fri, 27 Dec 2024 12:04:06 +0000
Subject: [PATCH 3/4] chore: apply changes after linting [bot]

---
 projects/demo/src/modules/components/alert/index.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/projects/demo/src/modules/components/alert/index.ts b/projects/demo/src/modules/components/alert/index.ts
index 2e59f97abe3ac..f26005c832284 100644
--- a/projects/demo/src/modules/components/alert/index.ts
+++ b/projects/demo/src/modules/components/alert/index.ts
@@ -2,13 +2,14 @@ import {Component, inject, INJECTOR} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {DemoRoute} from '@demo/routes';
 import {TuiDemo} from '@demo/utils';
+import {TuiDocAPI, TuiDocAPIItem} from '@taiga-ui/addon-doc';
 import type {TuiPopoverContext} from '@taiga-ui/cdk';
 import type {TuiAlertOptions} from '@taiga-ui/core';
 import {TUI_NOTIFICATION_OPTIONS, TuiAlertService, TuiButton} from '@taiga-ui/core';
 import type {PolymorpheusContent} from '@taiga-ui/polymorpheus';
 import {PolymorpheusComponent} from '@taiga-ui/polymorpheus';
 import {switchMap} from 'rxjs';
-import {TuiDocAPI, TuiDocAPIItem} from '@taiga-ui/addon-doc';
+
 import {AlertExampleWithData} from './examples/4';
 
 @Component({

From aea6cf091af1b1c30891ea9ec6291835b2f7c348 Mon Sep 17 00:00:00 2001
From: shiv9604 <shivkounsalye@gmail.com>
Date: Fri, 10 Jan 2025 01:18:16 +0530
Subject: [PATCH 4/4] chore(demo): resolve pr comments

---
 projects/demo/src/modules/components/alert/index.ts | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/projects/demo/src/modules/components/alert/index.ts b/projects/demo/src/modules/components/alert/index.ts
index 6d52c2eee688d..4dc7def3fac3e 100644
--- a/projects/demo/src/modules/components/alert/index.ts
+++ b/projects/demo/src/modules/components/alert/index.ts
@@ -2,19 +2,18 @@ import {Component, inject, INJECTOR} from '@angular/core';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {DemoRoute} from '@demo/routes';
 import {TuiDemo} from '@demo/utils';
-import {TuiDocAPI, TuiDocAPIItem} from '@taiga-ui/addon-doc';
 import type {TuiPopoverContext} from '@taiga-ui/cdk';
 import type {TuiAlertOptions} from '@taiga-ui/core';
 import {TUI_NOTIFICATION_OPTIONS, TuiAlertService, TuiButton} from '@taiga-ui/core';
 import type {PolymorpheusContent} from '@taiga-ui/polymorpheus';
 import {PolymorpheusComponent} from '@taiga-ui/polymorpheus';
 import {switchMap} from 'rxjs';
-import {TuiDocAPI, TuiDocAPIItem} from '@taiga-ui/addon-doc';
+
 import {AlertExampleWithData} from './examples/4';
 
 @Component({
     standalone: true,
-    imports: [TuiButton, TuiDemo, TuiDocAPI, TuiDocAPIItem],
+    imports: [TuiButton, TuiDemo],
     templateUrl: './index.html',
     changeDetection,
 })