From 1df6c824e7374595f9b219fb6354ad3b061278b5 Mon Sep 17 00:00:00 2001 From: waterplea Date: Tue, 8 Oct 2024 11:10:04 +0400 Subject: [PATCH 1/3] feat(addon-doc): allow adding extra tabs with DI --- .../addon-doc/components/page/page.component.ts | 10 +++++++--- .../addon-doc/components/page/page.providers.ts | 7 +++++++ .../addon-doc/components/page/page.template.html | 15 +++++++++++++++ 3 files changed, 29 insertions(+), 3 deletions(-) diff --git a/projects/addon-doc/components/page/page.component.ts b/projects/addon-doc/components/page/page.component.ts index 0a97c7a148fb..8bb4a2b62946 100644 --- a/projects/addon-doc/components/page/page.component.ts +++ b/projects/addon-doc/components/page/page.component.ts @@ -1,4 +1,4 @@ -import {NgForOf, NgIf, NgTemplateOutlet} from '@angular/common'; +import {KeyValuePipe, NgForOf, NgIf, NgTemplateOutlet} from '@angular/common'; import type {QueryList} from '@angular/core'; import { ChangeDetectionStrategy, @@ -7,18 +7,19 @@ import { inject, Input, } from '@angular/core'; -import {RouterLink, RouterLinkActive} from '@angular/router'; +import {ActivatedRoute, RouterLink, RouterLinkActive} from '@angular/router'; import {TUI_DOC_DEFAULT_TABS, TUI_DOC_SUPPORT_LANGUAGE} from '@taiga-ui/addon-doc/tokens'; import {EMPTY_QUERY} from '@taiga-ui/cdk/constants'; import {TuiReplacePipe} from '@taiga-ui/cdk/pipes/replace'; import {TuiAutoColorPipe} from '@taiga-ui/core/pipes/auto-color'; import {TuiChip} from '@taiga-ui/kit/components/chip'; import {TuiTabs} from '@taiga-ui/kit/components/tabs'; +import {PolymorpheusOutlet} from '@taiga-ui/polymorpheus'; import {TuiDocSeeAlso} from '../internal/see-also'; import {TuiDocSourceCode} from '../internal/source-code/source-code.component'; import {TuiDocLanguageSwitcher} from '../language-switcher'; -import {PAGE_PROVIDERS, PAGE_SEE_ALSO} from './page.providers'; +import {PAGE_PROVIDERS, PAGE_SEE_ALSO, TUI_DOC_TABS} from './page.providers'; import {TuiDocPageTabConnector} from './page-tab.directive'; @Component({ @@ -37,6 +38,8 @@ import {TuiDocPageTabConnector} from './page-tab.directive'; TuiDocSourceCode, TuiReplacePipe, TuiTabs, + KeyValuePipe, + PolymorpheusOutlet, ], templateUrl: './page.template.html', styleUrls: ['./page.style.less'], @@ -44,6 +47,7 @@ import {TuiDocPageTabConnector} from './page-tab.directive'; providers: PAGE_PROVIDERS, }) export class TuiDocPage { + protected readonly tabs = inject(TUI_DOC_TABS)(inject(ActivatedRoute).snapshot); protected readonly supportLanguage = inject(TUI_DOC_SUPPORT_LANGUAGE); protected readonly defaultTabs = inject(TUI_DOC_DEFAULT_TABS); protected readonly from = / /g; diff --git a/projects/addon-doc/components/page/page.providers.ts b/projects/addon-doc/components/page/page.providers.ts index 7bfcdbecc72a..771164a44072 100644 --- a/projects/addon-doc/components/page/page.providers.ts +++ b/projects/addon-doc/components/page/page.providers.ts @@ -1,7 +1,14 @@ import type {Provider} from '@angular/core'; import {ElementRef} from '@angular/core'; +import type {ActivatedRouteSnapshot} from '@angular/router'; import {TUI_DOC_SEE_ALSO} from '@taiga-ui/addon-doc/tokens'; +import type {TuiHandler} from '@taiga-ui/cdk'; import {tuiCreateToken} from '@taiga-ui/cdk/utils/miscellaneous'; +import type {PolymorpheusContent} from '@taiga-ui/polymorpheus'; + +export const TUI_DOC_TABS = tuiCreateToken< + TuiHandler> +>(() => ({})); /** * Array if related page titles diff --git a/projects/addon-doc/components/page/page.template.html b/projects/addon-doc/components/page/page.template.html index f95c94cd9506..d928ca51e764 100644 --- a/projects/addon-doc/components/page/page.template.html +++ b/projects/addon-doc/components/page/page.template.html @@ -46,6 +46,16 @@

+ + + {{ tab.key }} + +
[ngTemplateOutlet]="tab.template" /> + + + {{ text }} + +
From 6220d1c354d38634e6707b34264c0e0a7f4e2c0f Mon Sep 17 00:00:00 2001 From: taiga-family-bot Date: Tue, 8 Oct 2024 07:18:39 +0000 Subject: [PATCH 2/3] chore: apply changes after linting [bot] --- projects/addon-doc/components/page/page.component.ts | 4 ++-- projects/addon-doc/components/page/page.providers.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/projects/addon-doc/components/page/page.component.ts b/projects/addon-doc/components/page/page.component.ts index 8bb4a2b62946..2f9e3bd9f970 100644 --- a/projects/addon-doc/components/page/page.component.ts +++ b/projects/addon-doc/components/page/page.component.ts @@ -26,9 +26,11 @@ import {TuiDocPageTabConnector} from './page-tab.directive'; standalone: true, selector: 'tui-doc-page', imports: [ + KeyValuePipe, NgForOf, NgIf, NgTemplateOutlet, + PolymorpheusOutlet, RouterLink, RouterLinkActive, TuiAutoColorPipe, @@ -38,8 +40,6 @@ import {TuiDocPageTabConnector} from './page-tab.directive'; TuiDocSourceCode, TuiReplacePipe, TuiTabs, - KeyValuePipe, - PolymorpheusOutlet, ], templateUrl: './page.template.html', styleUrls: ['./page.style.less'], diff --git a/projects/addon-doc/components/page/page.providers.ts b/projects/addon-doc/components/page/page.providers.ts index 771164a44072..1f12c9de6c06 100644 --- a/projects/addon-doc/components/page/page.providers.ts +++ b/projects/addon-doc/components/page/page.providers.ts @@ -2,7 +2,7 @@ import type {Provider} from '@angular/core'; import {ElementRef} from '@angular/core'; import type {ActivatedRouteSnapshot} from '@angular/router'; import {TUI_DOC_SEE_ALSO} from '@taiga-ui/addon-doc/tokens'; -import type {TuiHandler} from '@taiga-ui/cdk'; +import type {TuiHandler} from '@taiga-ui/cdk/types'; import {tuiCreateToken} from '@taiga-ui/cdk/utils/miscellaneous'; import type {PolymorpheusContent} from '@taiga-ui/polymorpheus'; From 51ea4ffb72dda765e7fcaa7aa0cb7d21fab8038f Mon Sep 17 00:00:00 2001 From: waterplea Date: Tue, 8 Oct 2024 11:55:05 +0400 Subject: [PATCH 3/3] chore: fix test --- .../addon-doc/components/page/tests/page.component.spec.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/projects/addon-doc/components/page/tests/page.component.spec.ts b/projects/addon-doc/components/page/tests/page.component.spec.ts index cf34cbf4c088..86cb80d20204 100644 --- a/projects/addon-doc/components/page/tests/page.component.spec.ts +++ b/projects/addon-doc/components/page/tests/page.component.spec.ts @@ -1,5 +1,6 @@ import type {ComponentFixture} from '@angular/core/testing'; import {TestBed} from '@angular/core/testing'; +import {ActivatedRoute} from '@angular/router'; import {PAGE_SEE_ALSO, TuiDocPage} from '@taiga-ui/addon-doc'; import {TUI_DOC_DEFAULT_TABS} from '@taiga-ui/addon-doc/tokens'; import {EMPTY_QUERY} from '@taiga-ui/cdk'; @@ -12,6 +13,10 @@ describe('TuiDocPageComponent', () => { await TestBed.configureTestingModule({ imports: [TuiDocPage], providers: [ + { + provide: ActivatedRoute, + useValue: {}, + }, { provide: TUI_DOC_DEFAULT_TABS, useValue: ['tab1', 'tab2'],