diff --git a/projects/addon-doc/components/documentation/documentation.module.ts b/projects/addon-doc/components/documentation/documentation.module.ts index 4e7e9a494cc3..c44f584b0f17 100644 --- a/projects/addon-doc/components/documentation/documentation.module.ts +++ b/projects/addon-doc/components/documentation/documentation.module.ts @@ -12,7 +12,6 @@ import { TuiNotificationModule, TuiPrimitiveTextfieldModule, TuiTextfieldControllerModule, - TuiTooltipModule, } from '@taiga-ui/core'; import { TuiBadgeModule, @@ -27,12 +26,12 @@ import {TuiDocDocumentationComponent} from './documentation.component'; import {TuiDocDocumentationPropertyConnectorDirective} from './documentation-property-connector.directive'; import {TuiShowCleanerPipe} from './pipes/cleaner.pipe'; import {TuiGetColorPipe} from './pipes/color.pipe'; -import {TuiShowContentTooltip} from './pipes/content-tooltip.pipe'; import {TuiInspectPipe} from './pipes/inspect.pipe'; import {TuiGetOpacityPipe} from './pipes/opacity.pipe'; import {TuiIsOptionalPipe} from './pipes/optional.pipe'; import {TuiIsPrimitivePolymorpheusContentPipe} from './pipes/primitive-polymorpheus-content.pipe'; import {TuiStripOptionalPipe} from './pipes/strip-optional.pipe'; +import {TuiDocTypeReferencePipe} from './pipes/type-reference.pipe'; @NgModule({ imports: [ @@ -42,7 +41,6 @@ import {TuiStripOptionalPipe} from './pipes/strip-optional.pipe'; TuiBadgeModule, TuiSelectModule, TuiToggleModule, - TuiTooltipModule, TuiLinkModule, TuiInputNumberModule, TuiModeModule, @@ -63,7 +61,7 @@ import {TuiStripOptionalPipe} from './pipes/strip-optional.pipe'; TuiIsOptionalPipe, TuiShowCleanerPipe, TuiStripOptionalPipe, - TuiShowContentTooltip, + TuiDocTypeReferencePipe, TuiDocDocumentationComponent, TuiIsPrimitivePolymorpheusContentPipe, TuiDocDocumentationPropertyConnectorDirective, diff --git a/projects/addon-doc/components/documentation/documentation.style.less b/projects/addon-doc/components/documentation/documentation.style.less index 1ed56c806a46..2a931f9441b4 100644 --- a/projects/addon-doc/components/documentation/documentation.style.less +++ b/projects/addon-doc/components/documentation/documentation.style.less @@ -110,3 +110,30 @@ .t-heading { font: var(--tui-font-heading-4); } + +.t-code-type { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: start; +} + +.t-code-reference { + display: inline-flex; + color: var(--tui-link); + text-decoration: none; + align-items: center; + justify-content: center; + gap: 3px; + + &:after { + content: ''; + font-size: 1rem; + width: 1rem; + height: 1rem; + background: currentColor; + // TODO: migrate to in v4.0 + mask: url('data:image/svg+xml,') + center/100%; + } +} diff --git a/projects/addon-doc/components/documentation/documentation.template.html b/projects/addon-doc/components/documentation/documentation.template.html index 2e535d5a4f33..341128501022 100644 --- a/projects/addon-doc/components/documentation/documentation.template.html +++ b/projects/addon-doc/components/documentation/documentation.template.html @@ -49,25 +49,27 @@ - {{ propertyConnector.documentationPropertyType }} - - - {{ texts[4] }} + + - ng-polymorpheus + {{ item.type }} - - + + {{ item.type }} + +  |  + + | null, + ) {} + + transform(type: string): Array<{type: string; reference: string | null}> { + return type + .split(`|`) + .map(type => type.trim()) + .map(type => ({type, reference: this.typeReferenceHandler?.(type) ?? null})) + .sort((a, b) => b.reference?.localeCompare(a.reference ?? ``) ?? -1); + } +} diff --git a/projects/addon-doc/components/index.ts b/projects/addon-doc/components/index.ts index 0804d364fc13..6dd67cae8878 100644 --- a/projects/addon-doc/components/index.ts +++ b/projects/addon-doc/components/index.ts @@ -9,12 +9,12 @@ export * from './documentation/documentation.module'; export * from './documentation/documentation-property-connector.directive'; export * from './documentation/pipes/cleaner.pipe'; export * from './documentation/pipes/color.pipe'; -export * from './documentation/pipes/content-tooltip.pipe'; export * from './documentation/pipes/inspect.pipe'; export * from './documentation/pipes/opacity.pipe'; export * from './documentation/pipes/optional.pipe'; export * from './documentation/pipes/primitive-polymorpheus-content.pipe'; export * from './documentation/pipes/strip-optional.pipe'; +export * from './documentation/pipes/type-reference.pipe'; export * from './example/example.component'; export * from './example/example.module'; export * from './example/example.options'; diff --git a/projects/addon-doc/components/main/main.style.less b/projects/addon-doc/components/main/main.style.less index dd3b7aeeb874..1e094dc891e2 100644 --- a/projects/addon-doc/components/main/main.style.less +++ b/projects/addon-doc/components/main/main.style.less @@ -59,7 +59,7 @@ code:not(pre code) { font-weight: 500; border: 1px solid var(--tui-base-04); font-size: 0.75rem; - padding: 0 0.125rem; + padding: 0 0.3125rem; //noinspection CssInvalidPropertyValue text-wrap: wrap; diff --git a/projects/addon-doc/tokens/index.ts b/projects/addon-doc/tokens/index.ts index e410fd95f758..06256437a3a4 100644 --- a/projects/addon-doc/tokens/index.ts +++ b/projects/addon-doc/tokens/index.ts @@ -12,4 +12,5 @@ export * from './scroll-behavior'; export * from './see-also'; export * from './source-code'; export * from './title'; +export * from './type-reference-handler'; export * from './url-state-handler'; diff --git a/projects/addon-doc/tokens/type-reference-handler.ts b/projects/addon-doc/tokens/type-reference-handler.ts new file mode 100644 index 000000000000..7a106fbd8992 --- /dev/null +++ b/projects/addon-doc/tokens/type-reference-handler.ts @@ -0,0 +1,5 @@ +import {tuiCreateToken, TuiStringHandler} from '@taiga-ui/cdk'; + +export const TUI_DOC_TYPE_REFERENCE_HANDLER = tuiCreateToken | null>(null); diff --git a/projects/demo/src/modules/app/app.providers.ts b/projects/demo/src/modules/app/app.providers.ts index 328d44305fe5..c5960a3e5b07 100644 --- a/projects/demo/src/modules/app/app.providers.ts +++ b/projects/demo/src/modules/app/app.providers.ts @@ -20,6 +20,7 @@ import { TUI_DOC_SEE_ALSO, TUI_DOC_SOURCE_CODE, TUI_DOC_TITLE, + TUI_DOC_TYPE_REFERENCE_HANDLER, TUI_DOC_URL_STATE_HANDLER, tuiDocExampleOptionsProvider, TuiDocSourceCodePathOptions, @@ -197,6 +198,26 @@ export const APP_PROVIDERS: Provider[] = [ useFactory: (baseHref: string) => (tree: UrlTree) => String(tree).replace(baseHref, ``), }, + { + provide: TUI_DOC_TYPE_REFERENCE_HANDLER, + useValue: (type: string) => { + switch (type) { + case `any`: + case `null`: + case `undefined`: + case `boolean`: + case `string`: + case `number`: + return null; + case `SafeResourceUrl`: + return `https://angular.dev/api/platform-browser/${type}`; + case `PolymorpheusContent`: + return `https://github.com/taiga-family/ng-polymorpheus`; + default: + return `https://github.com/search?q=org%3Ataiga-family+${type}+language%3ATypeScript&type=code&l=TypeScript`; + } + }, + }, tuiDocExampleOptionsProvider({fullsize: false}), tuiLanguageSwitcher( async (language: TuiLanguageName): Promise =>