@taiga-ui/addon-doc 3.53.0 → 3.54.0-canary.76a76c5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,21 +3,21 @@ import { Component, ChangeDetectionStrategy, Inject, Input, HostBinding, NgModul
3
3
  import { TUI_DOC_EXAMPLE_MARKDOWN_CODE_PROCESSOR, TUI_DOC_DEMO_TEXTS, TUI_DOC_URL_STATE_HANDLER, TUI_DOC_DOCUMENTATION_TEXTS, TUI_DOC_EXCLUDED_PROPERTIES, TUI_DOC_EXAMPLE_TEXTS, TUI_DOC_CODE_EDITOR, TUI_DOC_EXAMPLE_CONTENT_PROCESSOR, TUI_DOC_CODE_ACTIONS, TUI_DOC_TITLE, TUI_DOC_PAGES, TUI_DOC_SEARCH_TEXT, TUI_DOC_PAGE_LOADED, TUI_DOC_SCROLL_BEHAVIOR, TUI_DOC_ICONS, TUI_DOC_LOGO, TUI_DOC_MENU_TEXT, TUI_DOC_SEE_ALSO_TEXT, TUI_DOC_MAP_PAGES, TUI_DOC_SOURCE_CODE, TUI_DOC_SOURCE_CODE_TEXT, TUI_DOC_SEE_ALSO, TUI_DOC_DEFAULT_TABS } from '@taiga-ui/addon-doc/tokens';
4
4
  import { tuiRawLoad, tuiCoerceValueIsTrue, tuiCoerceValue, tuiInspectAny, tuiRawLoadRecord, tuiTransliterateKeyboardLayout } from '@taiga-ui/addon-doc/utils';
5
5
  import * as i10 from 'rxjs';
6
- import { Subject, timer, BehaviorSubject, merge } from 'rxjs';
6
+ import { BehaviorSubject, Subject, timer, merge } from 'rxjs';
7
7
  import { switchMap, map, startWith, takeUntil, filter, mergeMap, take, distinctUntilChanged, share } from 'rxjs/operators';
8
- import { __decorate } from 'tslib';
9
- import * as i6$1 from '@taiga-ui/cdk';
10
- import { ALWAYS_FALSE_HANDLER, TuiDestroyService, tuiPure, tuiToInteger, tuiClamp, tuiPx, tuiCleanObject, TUI_IS_MOBILE, TuiResizeableDirective, TuiResizerModule, tuiIsNumber, tuiRgbToHex, TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_E2E, tuiIsString, EMPTY_QUERY, tuiQueryListChanges, tuiWatch, tuiHexToRgb, TuiFilterPipeModule, tuiCreateToken, tuiProvideOptions, TuiMapperPipeModule, tuiIsPresent, tuiControlValue, tuiUniqBy, TuiSwipeService, TuiActiveZoneModule, TuiLetModule, TuiAutoFocusModule, TuiReplacePipeModule } from '@taiga-ui/cdk';
11
- import * as i1 from '@taiga-ui/kit';
12
- import { TUI_COPY_TEXTS, TUI_ARROW_OPTIONS, TuiSelectModule, TuiRadioBlockModule, TuiCheckboxLabeledModule, TuiDataListWrapperModule, TuiBadgeModule, TuiToggleModule, TuiInputNumberModule, TuiTabsModule, TuiInputModule, TuiAccordionModule, TuiTagModule } from '@taiga-ui/kit';
13
8
  import * as i2 from '@taiga-ui/core';
14
- import { TuiButtonModule, TuiModeDirective, TuiLinkModule, TuiExpandModule, TuiGroupModule, TuiTooltipModule, TuiModeModule, TuiSvgModule, TuiDataListModule, TuiTextfieldControllerModule, TuiHintModule, TuiPrimitiveTextfieldModule, TuiDropdownModule, TuiNotificationModule, tuiCapitalizeFirstLetter, TuiAlertService, TuiLoaderModule, TUI_COMMON_ICONS, TuiHostedDropdownModule, TuiScrollbarModule, TuiFlagPipe, TuiFlagPipeModule, TuiThemeNightModule, TuiRootModule, TuiDialogModule, TuiAlertModule } from '@taiga-ui/core';
9
+ import { TuiSvgModule, TuiButtonModule, TuiModeDirective, TuiLinkModule, TuiExpandModule, TuiGroupModule, TuiTooltipModule, TuiModeModule, TuiDataListModule, TuiTextfieldControllerModule, TuiHintModule, TuiPrimitiveTextfieldModule, TuiDropdownModule, TuiNotificationModule, tuiCapitalizeFirstLetter, TuiAlertService, TuiLoaderModule, TUI_COMMON_ICONS, TuiHostedDropdownModule, TuiScrollbarModule, TuiFlagPipe, TuiFlagPipeModule, TuiThemeNightModule, TuiRootModule, TuiDialogModule, TuiAlertModule } from '@taiga-ui/core';
15
10
  import * as i4 from '@angular/common';
16
11
  import { CommonModule, Location as Location$1, DOCUMENT } from '@angular/common';
17
12
  import * as i3 from 'ngx-highlightjs';
18
13
  import { HighlightModule } from 'ngx-highlightjs';
19
14
  import * as i4$1 from '@angular/cdk/clipboard';
20
15
  import { ClipboardModule, Clipboard } from '@angular/cdk/clipboard';
16
+ import { __decorate } from 'tslib';
17
+ import * as i6$1 from '@taiga-ui/cdk';
18
+ import { ALWAYS_FALSE_HANDLER, TuiDestroyService, tuiPure, tuiToInteger, tuiClamp, tuiPx, tuiCleanObject, TUI_IS_MOBILE, TuiResizeableDirective, TuiResizerModule, tuiIsNumber, tuiRgbToHex, TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_E2E, tuiIsString, EMPTY_QUERY, tuiQueryListChanges, tuiWatch, tuiHexToRgb, TuiFilterPipeModule, tuiCreateToken, tuiProvideOptions, TuiMapperPipeModule, tuiIsPresent, tuiControlValue, tuiUniqBy, TuiSwipeService, TuiActiveZoneModule, TuiLetModule, TuiAutoFocusModule, TuiReplacePipeModule } from '@taiga-ui/cdk';
19
+ import * as i1 from '@taiga-ui/kit';
20
+ import { TUI_COPY_TEXTS, TUI_ARROW_OPTIONS, TuiSelectModule, TuiRadioBlockModule, TuiCheckboxLabeledModule, TuiDataListWrapperModule, TuiBadgeModule, TuiToggleModule, TuiInputNumberModule, TuiTabsModule, TuiInputModule, TuiAccordionModule, TuiTagModule } from '@taiga-ui/kit';
21
21
  import * as i5 from '@angular/forms';
22
22
  import { FormGroup, ReactiveFormsModule, FormsModule, FormControl } from '@angular/forms';
23
23
  import * as i6 from '@angular/router';
@@ -38,43 +38,13 @@ import { TuiCountryIsoCode, TuiLanguageSwitcher } from '@taiga-ui/i18n';
38
38
  import * as i6$2 from '@taiga-ui/addon-doc/services';
39
39
  import { TuiThemeService, TuiThemeNightService } from '@taiga-ui/addon-doc/services';
40
40
 
41
- const COPIED_TIMEOUT = 1500;
42
- class TuiDocCopyComponent {
43
- constructor(texts$) {
44
- this.texts$ = texts$;
45
- this.copy$ = new Subject();
46
- }
47
- get copied$() {
48
- return this.copy$.pipe(switchMap(() => timer(COPIED_TIMEOUT).pipe(map(ALWAYS_FALSE_HANDLER), startWith(true))));
49
- }
50
- onClick() {
51
- this.copy$.next();
52
- }
53
- }
54
- TuiDocCopyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCopyComponent, deps: [{ token: TUI_COPY_TEXTS }], target: i0.ɵɵFactoryTarget.Component });
55
- TuiDocCopyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocCopyComponent, selector: "tui-doc-copy", providers: [TuiDestroyService], ngImport: i0, template: "<button\n *ngIf=\"texts$ | async as texts\"\n appearance=\"\"\n size=\"s\"\n tuiButton\n type=\"button\"\n class=\"t-copy\"\n [title]=\"texts[0]\"\n (click)=\"onClick()\"\n>\n <span\n class=\"t-content\"\n [class.t-content_moved]=\"copied$ | async\"\n >\n <span\n class=\"t-initial\"\n [attr.data-text]=\"texts[0]\"\n >\n <ng-content></ng-content>\n </span>\n {{ texts[1] }}\n </span>\n</button>\n", styles: [":host{position:relative;display:inline-block;vertical-align:middle}.t-copy{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:100%;color:var(--tui-text-01);background:var(--tui-base-01);overflow:hidden}.t-copy:hover{background:var(--tui-base-02)}.t-initial{white-space:nowrap}.t-initial:empty:before{content:attr(data-text)}.t-content{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:flex;flex-direction:column;transform:translateY(1rem);text-align:center;line-height:2rem}.t-content_moved{transform:translateY(-1rem)}\n"], components: [{ type: i2.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
56
- __decorate([
57
- tuiPure
58
- ], TuiDocCopyComponent.prototype, "copied$", null);
59
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCopyComponent, decorators: [{
60
- type: Component,
61
- args: [{
62
- selector: 'tui-doc-copy',
63
- templateUrl: './copy.template.html',
64
- styleUrls: ['./copy.style.less'],
65
- changeDetection: ChangeDetectionStrategy.OnPush,
66
- providers: [TuiDestroyService],
67
- }]
68
- }], ctorParameters: function () { return [{ type: i10.Observable, decorators: [{
69
- type: Inject,
70
- args: [TUI_COPY_TEXTS]
71
- }] }]; }, propDecorators: { copied$: [] } });
72
-
73
41
  class TuiDocCodeComponent {
74
42
  constructor(markdownCodeProcessor) {
75
43
  this.markdownCodeProcessor = markdownCodeProcessor;
76
44
  this.rawLoader$$ = new BehaviorSubject('');
77
45
  this.filename = '';
46
+ this.copy$ = new Subject();
47
+ this.icon$ = this.copy$.pipe(switchMap(() => timer(2000).pipe(map(() => 'tuiIconCopyLarge'), startWith('tuiIconCheckLarge'))));
78
48
  this.processor$ = this.rawLoader$$.pipe(switchMap(tuiRawLoad), map((value) => this.markdownCodeProcessor(value)));
79
49
  }
80
50
  set code(code) {
@@ -85,7 +55,7 @@ class TuiDocCodeComponent {
85
55
  }
86
56
  }
87
57
  TuiDocCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeComponent, deps: [{ token: TUI_DOC_EXAMPLE_MARKDOWN_CODE_PROCESSOR }], target: i0.ɵɵFactoryTarget.Component });
88
- TuiDocCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocCodeComponent, selector: "tui-doc-code", inputs: { filename: "filename", code: "code" }, host: { properties: { "class._has-filename": "this.hasFilename" } }, ngImport: i0, template: "<p\n *ngIf=\"filename\"\n class=\"t-header\"\n>\n {{ filename }}\n</p>\n<pre\n *ngFor=\"let content of processor$ | async\"\n class=\"t-code\"\n>\n <code [lineNumbers]=\"true\" [highlight]=\"content\"></code>\n <div class=\"t-code-actions\">\n <tui-doc-copy class=\"t-copy\" [cdkCopyToClipboard]=\"content\"></tui-doc-copy>\n <ng-content></ng-content>\n </div>\n</pre>\n", styles: [":host{display:block}.t-header{font:var(--tui-font-text-s);font-weight:bold}.t-code{position:relative;margin:0;white-space:normal}.t-code:hover .t-code-actions,.t-code:focus-visible .t-code-actions{opacity:1}.t-code+.t-code{margin-top:1rem}.t-code-actions{position:absolute;top:.875rem;right:2rem;display:flex;opacity:0;grid-gap:.5rem;gap:.5rem;flex-direction:row-reverse}.hljs:not(:empty){font:var(--tui-font-text-m);padding:1.5rem 2rem;font-family:monospace;background:var(--tui-clear);word-wrap:break-word;white-space:pre-wrap}@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.hljs:not(:empty)::-webkit-scrollbar,.hljs:not(:empty)::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:.375rem solid transparent}.hljs:not(:empty)::-webkit-scrollbar{background-color:transparent}.hljs:not(:empty)::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.hljs:not(:empty)::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.hljs:not(:empty)::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host._has-filename .hljs:not(:empty){border-radius:.75rem}:host-context(tui-root._mobile) .hljs:not(:empty){padding:1rem}\n"], components: [{ type: TuiDocCopyComponent, selector: "tui-doc-copy" }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.Highlight, selector: "[highlight]", inputs: ["highlight", "languages", "lineNumbers"], outputs: ["highlighted"] }, { type: i4$1.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
58
+ TuiDocCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocCodeComponent, selector: "tui-doc-code", inputs: { filename: "filename", code: "code" }, host: { properties: { "class._has-filename": "this.hasFilename" } }, ngImport: i0, template: "<p\n *ngIf=\"filename\"\n class=\"t-header\"\n>\n {{ filename }}\n</p>\n<pre\n *ngFor=\"let content of processor$ | async\"\n class=\"t-code\"\n>\n <code [lineNumbers]=\"true\" [highlight]=\"content\"></code>\n <div class=\"t-code-actions\">\n <ng-content></ng-content>\n <button\n tuiIconButton\n appearance=\"icon\"\n size=\"xs\"\n [icon]=\"(icon$ | async) || 'tuiIconCopyLarge'\"\n [cdkCopyToClipboard]=\"content\"\n (click)=\"copy$.next()\"\n >\n </button>\n </div>\n</pre>\n", styles: [":host{display:block}.t-header{font:var(--tui-font-text-s);font-weight:bold}.t-code{position:relative;margin:0;white-space:normal}.t-code+.t-code{margin-top:1rem}.t-code-actions{position:absolute;top:.75rem;right:.75rem;display:flex;grid-gap:.375rem;gap:.375rem;justify-content:center;align-items:center}.hljs:not(:empty){font:var(--tui-font-text-m);padding:1.5rem 2rem;font-family:monospace;background:var(--tui-clear);word-wrap:break-word;white-space:pre-wrap}@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.hljs:not(:empty)::-webkit-scrollbar,.hljs:not(:empty)::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:.375rem solid transparent}.hljs:not(:empty)::-webkit-scrollbar{background-color:transparent}.hljs:not(:empty)::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.hljs:not(:empty)::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.hljs:not(:empty)::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host._has-filename .hljs:not(:empty){border-radius:.75rem}:host-context(tui-root._mobile) .hljs:not(:empty){padding:1rem}\n"], components: [{ type: i2.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.Highlight, selector: "[highlight]", inputs: ["highlight", "languages", "lineNumbers"], outputs: ["highlighted"] }, { type: i4$1.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
89
59
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeComponent, decorators: [{
90
60
  type: Component,
91
61
  args: [{
@@ -106,6 +76,68 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
106
76
  args: ['class._has-filename']
107
77
  }] } });
108
78
 
79
+ class TuiDocCodeModule {
80
+ }
81
+ TuiDocCodeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
82
+ TuiDocCodeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, declarations: [TuiDocCodeComponent], imports: [CommonModule,
83
+ TuiSvgModule,
84
+ HighlightModule,
85
+ TuiButtonModule,
86
+ ClipboardModule], exports: [TuiDocCodeComponent] });
87
+ TuiDocCodeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, imports: [[
88
+ CommonModule,
89
+ TuiSvgModule,
90
+ HighlightModule,
91
+ TuiButtonModule,
92
+ ClipboardModule,
93
+ ]] });
94
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, decorators: [{
95
+ type: NgModule,
96
+ args: [{
97
+ imports: [
98
+ CommonModule,
99
+ TuiSvgModule,
100
+ HighlightModule,
101
+ TuiButtonModule,
102
+ ClipboardModule,
103
+ ],
104
+ declarations: [TuiDocCodeComponent],
105
+ exports: [TuiDocCodeComponent],
106
+ }]
107
+ }] });
108
+
109
+ const COPIED_TIMEOUT = 1500;
110
+ class TuiDocCopyComponent {
111
+ constructor(texts$) {
112
+ this.texts$ = texts$;
113
+ this.copy$ = new Subject();
114
+ }
115
+ get copied$() {
116
+ return this.copy$.pipe(switchMap(() => timer(COPIED_TIMEOUT).pipe(map(ALWAYS_FALSE_HANDLER), startWith(true))));
117
+ }
118
+ onClick() {
119
+ this.copy$.next();
120
+ }
121
+ }
122
+ TuiDocCopyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCopyComponent, deps: [{ token: TUI_COPY_TEXTS }], target: i0.ɵɵFactoryTarget.Component });
123
+ TuiDocCopyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocCopyComponent, selector: "tui-doc-copy", providers: [TuiDestroyService], ngImport: i0, template: "<button\n *ngIf=\"texts$ | async as texts\"\n appearance=\"\"\n size=\"s\"\n tuiButton\n type=\"button\"\n class=\"t-copy\"\n [title]=\"texts[0]\"\n (click)=\"onClick()\"\n>\n <span\n class=\"t-content\"\n [class.t-content_moved]=\"copied$ | async\"\n >\n <span\n class=\"t-initial\"\n [attr.data-text]=\"texts[0]\"\n >\n <ng-content></ng-content>\n </span>\n {{ texts[1] }}\n </span>\n</button>\n", styles: [":host{position:relative;display:inline-block;vertical-align:middle}.t-copy{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:100%;color:var(--tui-text-01);background:var(--tui-base-01);overflow:hidden}.t-copy:hover{background:var(--tui-base-02)}.t-initial{white-space:nowrap}.t-initial:empty:before{content:attr(data-text)}.t-content{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:flex;flex-direction:column;transform:translateY(1rem);text-align:center;line-height:2rem}.t-content_moved{transform:translateY(-1rem)}\n"], components: [{ type: i2.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
124
+ __decorate([
125
+ tuiPure
126
+ ], TuiDocCopyComponent.prototype, "copied$", null);
127
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCopyComponent, decorators: [{
128
+ type: Component,
129
+ args: [{
130
+ selector: 'tui-doc-copy',
131
+ templateUrl: './copy.template.html',
132
+ styleUrls: ['./copy.style.less'],
133
+ changeDetection: ChangeDetectionStrategy.OnPush,
134
+ providers: [TuiDestroyService],
135
+ }]
136
+ }], ctorParameters: function () { return [{ type: i10.Observable, decorators: [{
137
+ type: Inject,
138
+ args: [TUI_COPY_TEXTS]
139
+ }] }]; }, propDecorators: { copied$: [] } });
140
+
109
141
  class TuiDocCopyModule {
110
142
  }
111
143
  TuiDocCopyModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCopyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -120,20 +152,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
120
152
  }]
121
153
  }] });
122
154
 
123
- class TuiDocCodeModule {
124
- }
125
- TuiDocCodeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
126
- TuiDocCodeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, declarations: [TuiDocCodeComponent], imports: [CommonModule, HighlightModule, TuiDocCopyModule, ClipboardModule], exports: [TuiDocCodeComponent] });
127
- TuiDocCodeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, imports: [[CommonModule, HighlightModule, TuiDocCopyModule, ClipboardModule]] });
128
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocCodeModule, decorators: [{
129
- type: NgModule,
130
- args: [{
131
- imports: [CommonModule, HighlightModule, TuiDocCopyModule, ClipboardModule],
132
- declarations: [TuiDocCodeComponent],
133
- exports: [TuiDocCodeComponent],
134
- }]
135
- }] });
136
-
137
155
  const MIN_WIDTH = 160;
138
156
  class TuiDocDemoComponent {
139
157
  constructor(options, isMobile, el, locationRef, urlSerializer, texts, urlStateHandler) {
@@ -716,12 +734,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
716
734
  templateUrl: './documentation.template.html',
717
735
  styleUrls: ['./documentation.style.less'],
718
736
  changeDetection: ChangeDetectionStrategy.OnPush,
737
+ providers: [TuiGetColorPipe, TuiGetOpacityPipe, TuiDestroyService],
719
738
  animations: [
720
739
  trigger('emitEvent', [
721
740
  transition(':increment', [style({ opacity: 1 }), animate('500ms ease-in')]),
722
741
  ]),
723
742
  ],
724
- providers: [TuiGetColorPipe, TuiGetOpacityPipe, TuiDestroyService],
725
743
  }]
726
744
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef, decorators: [{
727
745
  type: Inject,
@@ -963,7 +981,7 @@ class TuiDocExampleComponent {
963
981
  }
964
982
  }
965
983
  TuiDocExampleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocExampleComponent, deps: [{ token: Clipboard }, { token: TuiAlertService }, { token: LOCATION }, { token: TUI_COPY_TEXTS }, { token: TUI_DOC_EXAMPLE_TEXTS }, { token: TUI_DOC_CODE_EDITOR, optional: true }, { token: TUI_DOC_EXAMPLE_CONTENT_PROCESSOR }, { token: TUI_IS_E2E }, { token: TUI_DOC_CODE_ACTIONS }, { token: Router }, { token: ActivatedRoute }, { token: Location$1 }, { token: TUI_DOC_EXAMPLE_OPTIONS }], target: i0.ɵɵFactoryTarget.Component });
966
- TuiDocExampleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocExampleComponent, selector: "tui-doc-example", inputs: { id: "id", heading: "heading", description: "description", content: "content", fullsize: "fullsize", componentName: "componentName" }, host: { properties: { "class._fullsize": "this.fullsize" } }, ngImport: i0, template: "<h3\n *ngIf=\"heading\"\n class=\"t-title\"\n>\n <span\n *polymorpheusOutlet=\"heading | tuiDocExampleCapitalize as text\"\n [textContent]=\"text\"\n ></span>\n <button\n *ngIf=\"id\"\n appearance=\"icon\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-link-icon\"\n [icon]=\"options.linkIcon\"\n [title]=\"copy$ | async\"\n (click)=\"copyExampleLink()\"\n ></button>\n</h3>\n<h4\n *ngIf=\"description\"\n class=\"t-description\"\n>\n <ng-container *polymorpheusOutlet=\"description | tuiDocExampleCapitalize as text\">\n {{ text }}\n </ng-container>\n</h4>\n\n<div\n *ngIf=\"processor$ | async as files\"\n class=\"t-example\"\n>\n <ng-container *ngIf=\"files | tuiDocExampleGetTabs: defaultTab as tabs\">\n <div\n *ngIf=\"tabs.length > 1\"\n class=\"t-tabs-wrapper\"\n >\n <tui-tabs-with-more\n class=\"t-tabs\"\n [(activeItemIndex)]=\"activeItemIndex\"\n >\n <ng-container *ngFor=\"let tab of tabs\">\n <button\n *tuiItem\n tuiTab\n >\n <ng-container *polymorpheusOutlet=\"getTabTitle(tab) as text\">\n {{ text }}\n </ng-container>\n </button>\n </ng-container>\n </tui-tabs-with-more>\n\n <tui-loader\n *ngIf=\"files | tuiMapper: visible\"\n size=\"xs\"\n [overlay]=\"true\"\n [showLoader]=\"!!(loading$ | async)\"\n (click)=\"edit(files)\"\n >\n <ng-container *ngIf=\"codeEditor?.content as content; else defaultEditContent\">\n <ng-container *polymorpheusOutlet=\"content as editContent\">\n {{ editContent }}\n </ng-container>\n </ng-container>\n\n <ng-template #defaultEditContent>\n <button\n appearance=\"flat\"\n size=\"s\"\n tuiButton\n type=\"button\"\n >\n Edit on {{ codeEditor!.name }}\n </button>\n </ng-template>\n </tui-loader>\n </div>\n\n <div\n *ngFor=\"let tab of tabs; let index = index\"\n class=\"t-content\"\n [class.t-content_animated]=\"!isE2E\"\n [class.t-content_visible]=\"activeItemIndex === index\"\n >\n <ng-container\n *ngIf=\"index === defaultTabIndex; else anotherTab\"\n [ngTemplateOutlet]=\"preview\"\n ></ng-container>\n <ng-template #anotherTab>\n <ng-container\n [ngTemplateOutlet]=\"codeSection\"\n [ngTemplateOutletContext]=\"{$implicit: files?.[tabs[activeItemIndex]] || ''}\"\n ></ng-container>\n </ng-template>\n </div>\n </ng-container>\n</div>\n\n<ng-template #preview>\n <div\n automation-id=\"tui-doc-example\"\n class=\"t-demo\"\n >\n <ng-content></ng-content>\n </div>\n</ng-template>\n\n<ng-template\n #codeSection\n let-code\n>\n <tui-doc-code [code]=\"code\">\n <ng-container *ngFor=\"let action of codeActions\">\n <ng-container *polymorpheusOutlet=\"action as text; context: {$implicit: code}\">\n {{ text }}\n </ng-container>\n </ng-container>\n </tui-doc-code>\n</ng-template>\n", styles: [":host{position:relative;display:block;padding-top:3.5rem;clear:right}:host :host-context(tui-root._mobile){padding-top:2rem}.t-title{font:var(--tui-font-heading-5);margin:0 0 .5rem}:host-context(tui-root._mobile) .t-title{font:var(--tui-font-heading-6)}.t-description{font:var(--tui-font-text-m);font-weight:normal;margin:0}.t-example{position:relative;margin-top:1.5rem;border:1px solid var(--tui-base-03);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem #0000001a;overflow:hidden}:host-context(tui-root._mobile) .t-example{margin-top:.75rem}.t-tabs-wrapper{display:flex;padding:0 2rem;box-shadow:inset 0 -1px var(--tui-base-03);justify-content:space-between;align-items:center}:host-context(tui-root._mobile) .t-tabs-wrapper{padding:0 1rem}.t-tabs{flex-grow:1}.t-demo{padding:2rem;max-width:100%;box-sizing:border-box;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:.375rem solid transparent}.t-demo::-webkit-scrollbar{background-color:transparent}.t-demo::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host-context(tui-root._mobile) .t-demo{padding:1rem}:host:not(._fullsize) .t-demo{width:-webkit-min-content;width:min-content;min-width:20rem}.t-link-icon{margin-left:.3rem;vertical-align:baseline}.t-content{will-change:opacity;height:0;visibility:hidden;opacity:0}.t-content_animated{transition:opacity .3s ease-in-out}.t-content_visible{height:auto;visibility:visible;opacity:1}\n"], components: [{ type: i2.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { type: i1.TuiTabsWithMoreComponent, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["moreContent", "dropdownContent", "underline", "activeItemIndex", "itemsLimit"], outputs: ["activeItemIndexChange"] }, { type: i1.TuiTabComponent, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { type: i2.TuiLoaderComponent, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { type: TuiDocCodeComponent, selector: "tui-doc-code", inputs: ["filename", "code"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$1.TuiItemDirective, selector: "[tuiItem]" }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "tuiDocExampleCapitalize": TuiDocExampleCapitalizePipe, "async": i4.AsyncPipe, "tuiDocExampleGetTabs": TuiDocExampleGetTabsPipe, "tuiMapper": i6$1.TuiMapperPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
984
+ TuiDocExampleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocExampleComponent, selector: "tui-doc-example", inputs: { id: "id", heading: "heading", description: "description", content: "content", fullsize: "fullsize", componentName: "componentName" }, host: { properties: { "class._fullsize": "this.fullsize" } }, ngImport: i0, template: "<h3\n *ngIf=\"heading\"\n class=\"t-title\"\n>\n <span\n *polymorpheusOutlet=\"heading | tuiDocExampleCapitalize as text\"\n [textContent]=\"text\"\n ></span>\n <button\n *ngIf=\"id\"\n appearance=\"icon\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-link-icon\"\n [icon]=\"options.linkIcon\"\n [title]=\"copy$ | async\"\n (click)=\"copyExampleLink()\"\n ></button>\n</h3>\n<h4\n *ngIf=\"description\"\n class=\"t-description\"\n>\n <ng-container *polymorpheusOutlet=\"description | tuiDocExampleCapitalize as text\">\n {{ text }}\n </ng-container>\n</h4>\n\n<div\n *ngIf=\"processor$ | async as files\"\n class=\"t-example\"\n>\n <ng-container *ngIf=\"files | tuiDocExampleGetTabs: defaultTab as tabs\">\n <div\n *ngIf=\"tabs.length > 1\"\n class=\"t-tabs-wrapper\"\n >\n <tui-tabs-with-more\n class=\"t-tabs\"\n [(activeItemIndex)]=\"activeItemIndex\"\n >\n <ng-container *ngFor=\"let tab of tabs\">\n <button\n *tuiItem\n tuiTab\n >\n <ng-container *polymorpheusOutlet=\"getTabTitle(tab) as text\">\n {{ text }}\n </ng-container>\n </button>\n </ng-container>\n </tui-tabs-with-more>\n\n <tui-loader\n *ngIf=\"files | tuiMapper: visible\"\n size=\"xs\"\n [overlay]=\"true\"\n [showLoader]=\"!!(loading$ | async)\"\n (click)=\"edit(files)\"\n >\n <ng-container *ngIf=\"codeEditor?.content as content; else defaultEditContent\">\n <ng-container *polymorpheusOutlet=\"content as editContent\">\n {{ editContent }}\n </ng-container>\n </ng-container>\n\n <ng-template #defaultEditContent>\n <button\n appearance=\"flat\"\n size=\"s\"\n tuiButton\n type=\"button\"\n >\n Edit on {{ codeEditor!.name }}\n </button>\n </ng-template>\n </tui-loader>\n </div>\n\n <div\n *ngFor=\"let tab of tabs; let index = index\"\n class=\"t-content\"\n [class.t-content_animated]=\"!isE2E\"\n [class.t-content_visible]=\"activeItemIndex === index\"\n >\n <ng-container\n *ngIf=\"index === defaultTabIndex; else anotherTab\"\n [ngTemplateOutlet]=\"preview\"\n ></ng-container>\n <ng-template #anotherTab>\n <ng-container\n [ngTemplateOutlet]=\"codeSection\"\n [ngTemplateOutletContext]=\"{$implicit: files?.[tabs[activeItemIndex]] || ''}\"\n ></ng-container>\n </ng-template>\n </div>\n </ng-container>\n</div>\n\n<ng-template #preview>\n <div\n automation-id=\"tui-doc-example\"\n class=\"t-demo\"\n >\n <ng-content></ng-content>\n </div>\n</ng-template>\n\n<ng-template\n #codeSection\n let-code\n>\n <tui-doc-code [code]=\"code\">\n <ng-container *ngFor=\"let action of codeActions\">\n <ng-container *polymorpheusOutlet=\"action as text; context: {$implicit: code}\">\n {{ text }}\n </ng-container>\n </ng-container>\n </tui-doc-code>\n</ng-template>\n", styles: [":host{position:relative;display:block;padding-top:3.5rem;clear:right}:host :host-context(tui-root._mobile){padding-top:2rem}.t-title{font:var(--tui-font-heading-5);margin:0 0 .5rem}:host-context(tui-root._mobile) .t-title{font:var(--tui-font-heading-6)}.t-description{font:var(--tui-font-text-m);font-weight:normal;margin:0}.t-example{position:relative;margin-top:1.5rem;border:1px solid var(--tui-base-03);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem #0000001a;overflow:hidden}:host-context(tui-root._mobile) .t-example{margin-top:.75rem}.t-tabs-wrapper{display:flex;padding:0 .125rem 0 2rem;box-shadow:inset 0 -1px var(--tui-base-03);justify-content:space-between;align-items:center}:host-context(tui-root._mobile) .t-tabs-wrapper{padding:0 1rem}.t-tabs{flex-grow:1}.t-demo{padding:2rem;max-width:100%;box-sizing:border-box;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:.375rem solid transparent}.t-demo::-webkit-scrollbar{background-color:transparent}.t-demo::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host-context(tui-root._mobile) .t-demo{padding:1rem}:host:not(._fullsize) .t-demo{width:-webkit-min-content;width:min-content;min-width:20rem}.t-link-icon{margin-left:.3rem;vertical-align:baseline}.t-content{will-change:opacity;height:0;visibility:hidden;opacity:0}.t-content_animated{transition:opacity .3s ease-in-out}.t-content_visible{height:auto;visibility:visible;opacity:1}\n"], components: [{ type: i2.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { type: i1.TuiTabsWithMoreComponent, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["moreContent", "dropdownContent", "underline", "activeItemIndex", "itemsLimit"], outputs: ["activeItemIndexChange"] }, { type: i1.TuiTabComponent, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { type: i2.TuiLoaderComponent, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { type: TuiDocCodeComponent, selector: "tui-doc-code", inputs: ["filename", "code"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$1.TuiItemDirective, selector: "[tuiItem]" }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "tuiDocExampleCapitalize": TuiDocExampleCapitalizePipe, "async": i4.AsyncPipe, "tuiDocExampleGetTabs": TuiDocExampleGetTabsPipe, "tuiMapper": i6$1.TuiMapperPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
967
985
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocExampleComponent, decorators: [{
968
986
  type: Component,
969
987
  args: [{
@@ -1253,7 +1271,7 @@ class TuiDocNavigationComponent {
1253
1271
  }
1254
1272
  }
1255
1273
  TuiDocNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocNavigationComponent, deps: [{ token: ChangeDetectorRef }, { token: Title }, { token: NAVIGATION_TITLE }, { token: DOCUMENT }, { token: TuiModeDirective }, { token: TuiSidebarDirective, optional: true }, { token: NAVIGATION_LABELS }, { token: NAVIGATION_ITEMS }, { token: TUI_DOC_SEARCH_TEXT }, { token: Router }, { token: ActivatedRoute }, { token: TuiDestroyService, self: true }, { token: TUI_DOC_PAGE_LOADED }, { token: TUI_DOC_SCROLL_BEHAVIOR }, { token: TUI_DOC_ICONS }, { token: TUI_COMMON_ICONS }], target: i0.ɵɵFactoryTarget.Component });
1256
- TuiDocNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocNavigationComponent, selector: "tui-doc-navigation", host: { properties: { "class._open": "this.menuOpen" } }, providers: NAVIGATION_PROVIDERS, ngImport: i0, template: "<tui-input\n #input\n tuiTextfieldSize=\"m\"\n class=\"t-input\"\n [formControl]=\"search\"\n [tuiAutoFocus]=\"!!sidebar\"\n [tuiTextfieldCleaner]=\"true\"\n [tuiTextfieldIconLeft]=\"docIcons.search\"\n [tuiTextfieldLabelOutside]=\"true\"\n>\n {{ searchText }}\n <ng-container *ngIf=\"canOpen\">\n <tui-data-list *tuiDataList>\n <tui-opt-group\n *ngFor=\"let group of filtered$ | async; let index = index\"\n [label]=\"labels[index] || ''\"\n >\n <a\n *ngFor=\"let item of group\"\n tuiOption\n [fragment]=\"item.fragment\"\n [routerLink]=\"item.route\"\n (click)=\"onClick(input)\"\n >\n {{ item.title }}\n <tui-svg\n *polymorpheusOutlet=\"item.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </a>\n </tui-opt-group>\n </tui-data-list>\n </ng-container>\n</tui-input>\n\n<nav class=\"t-navigation\">\n <tui-scrollbar\n class=\"t-scrollbar\"\n [tuiMode]=\"mode$ | async\"\n >\n <tui-accordion\n [closeOthers]=\"false\"\n [rounded]=\"false\"\n >\n <tui-accordion-item\n *ngFor=\"let label of labels; index as index\"\n size=\"s\"\n [borders]=\"null\"\n [(open)]=\"!!openPagesArr[index]\"\n >\n <span class=\"t-label\">\n <strong>{{ label }}</strong>\n </span>\n <ng-template tuiAccordionItemContent>\n <div class=\"t-section\">\n <ng-container\n *ngFor=\"let item of items[index]; index as subIndex\"\n [ngTemplateOutlet]=\"pages\"\n [ngTemplateOutletContext]=\"{item: item, index: index * 100 + subIndex}\"\n ></ng-container>\n </div>\n </ng-template>\n </tui-accordion-item>\n </tui-accordion>\n <div class=\"t-items-container\">\n <ng-container\n *ngFor=\"let item of itemsWithoutSections; let index = index\"\n [ngTemplateOutlet]=\"pages\"\n [ngTemplateOutletContext]=\"{item: item, index: items.length - 1 + index}\"\n ></ng-container>\n </div>\n\n <ng-template\n #pages\n let-index=\"index\"\n let-item=\"item\"\n >\n <a\n *ngIf=\"!item.subPages; else subPagesTemplate\"\n routerLinkActive=\"t-sublink_active\"\n tuiLink\n class=\"t-sublink\"\n [routerLink]=\"item.route\"\n [tuiScrollIntoViewLink]=\"isActive(item.route)\"\n (click)=\"closeMenu()\"\n >\n {{ item.title }}\n <tui-svg\n *polymorpheusOutlet=\"item.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </a>\n\n <ng-template #subPagesTemplate>\n <div\n routerLinkActive\n class=\"t-subsection\"\n [routerLinkActiveOptions]=\"{exact: false}\"\n >\n <button\n *ngIf=\"item.subPages\"\n tuiLink\n type=\"button\"\n class=\"t-sublink t-sublink_subsection\"\n (click)=\"onGroupClick(index)\"\n >\n <tui-svg\n class=\"t-chevron\"\n [class.t-chevron_active]=\"!!openPagesGroupsArr[index]\"\n [src]=\"icons.more\"\n ></tui-svg>\n {{ item.title }}\n <tui-svg\n *polymorpheusOutlet=\"item.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </button>\n <tui-expand\n class=\"t-expand\"\n [expanded]=\"!!openPagesGroupsArr[index]\"\n >\n <div class=\"t-section t-section_bordered\">\n <a\n *ngFor=\"let subPage of $pages(item.subPages)\"\n routerLinkActive=\"t-sublink_active\"\n tuiLink\n class=\"t-sublink t-sublink_small\"\n [fragment]=\"subPage.fragment\"\n [routerLink]=\"subPage.route\"\n [tuiScrollIntoViewLink]=\"isActive(subPage.route)\"\n (click)=\"closeMenu()\"\n >\n {{ subPage.title }}\n <tui-svg\n *polymorpheusOutlet=\"subPage.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </a>\n </div>\n </tui-expand>\n </div>\n </ng-template>\n </ng-template>\n </tui-scrollbar>\n</nav>\n\n<ng-content></ng-content>\n", styles: [":host{z-index:1;display:flex;flex-direction:column;text-align:center;background:var(--tui-base-01)}.t-input{margin:1.25rem}.t-navigation{display:flex;max-height:100%;min-height:0;flex:1 1 0;text-align:left}.t-scrollbar{scroll-behavior:smooth;width:100%}@media screen and (prefers-reduced-motion: reduce){.t-scrollbar{scroll-behavior:auto}}.t-items-container{display:flex;flex-direction:column;padding:0 1rem}.t-label{margin-left:.5rem}.t-expand{margin-left:.25rem}.t-section{display:flex;flex-direction:column;align-items:flex-start;margin:-1rem 0 -.5rem}.t-section_bordered{margin:.5rem 0;border-left:1px solid var(--tui-base-03)}.t-subsection{margin-left:.5rem}.t-sublink{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:1rem 0 0;border:0;background:none;font-size:inherit;line-height:inherit;font:var(--tui-font-text-m);margin-left:.5rem}.t-sublink_small{margin-left:1rem;line-height:1.5rem;padding-top:.5rem}.t-sublink_subsection{margin-left:0;line-height:1.6rem}.t-sublink.t-sublink.t-sublink_active{color:var(--tui-text-01)}.t-icon{margin-left:.5rem}.t-chevron{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:1rem;height:1rem;margin:-.25rem .25rem 0 -.1875rem}.t-chevron_active{transform:rotate(90deg)}\n"], components: [{ type: i1.TuiInputComponent, selector: "tui-input" }, { type: i2.TuiDataListComponent, selector: "tui-data-list", inputs: ["role", "emptyContent", "size"] }, { type: i2.TuiOptionComponent, selector: "button[tuiOption], a[tuiOption]", inputs: ["size", "role", "disabled", "value"] }, { type: i2.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i2.TuiScrollbarComponent, selector: "tui-scrollbar", inputs: ["hidden"] }, { type: i1.TuiAccordionComponent, selector: "tui-accordion", inputs: ["closeOthers", "rounded"] }, { type: i1.TuiAccordionItemComponent, selector: "tui-accordion-item", inputs: ["noPadding", "showArrow", "borders", "size", "disabled", "disableHover", "open", "async"], outputs: ["openChange"] }, { type: i2.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { type: i2.TuiExpandComponent, selector: "tui-expand", inputs: ["async", "expanded"] }], directives: [{ type: i1.TuiInputDirective, selector: "tui-input" }, { type: i2.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6$1.TuiAutoFocusDirective, selector: "[tuiAutoFocus]", inputs: ["tuiAutoFocus"] }, { type: i2.TuiTextfieldCleanerDirective, selector: "[tuiTextfieldCleaner]", inputs: ["tuiTextfieldCleaner"] }, { type: i2.TuiTextfieldIconLeftDirective, selector: "[tuiTextfieldIconLeft]", inputs: ["tuiTextfieldIconLeft"] }, { type: i2.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.TuiOptGroupDirective, selector: "tui-opt-group", inputs: ["label"] }, { type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i5$1.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i2.TuiModeDirective, selector: "[tuiMode]", inputs: ["tuiMode"] }, { type: i1.TuiAccordionItemContentDirective, selector: "ng-template[tuiAccordionItemContent]" }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: i8.TuiScrollIntoViewLinkDirective, selector: "[tuiScrollIntoViewLink]", inputs: ["tuiScrollIntoViewLink"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1274
+ TuiDocNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiDocNavigationComponent, selector: "tui-doc-navigation", host: { properties: { "class._open": "this.menuOpen" } }, providers: NAVIGATION_PROVIDERS, ngImport: i0, template: "<tui-input\n #input\n tuiTextfieldSize=\"m\"\n class=\"t-input\"\n [formControl]=\"search\"\n [tuiAutoFocus]=\"!!sidebar\"\n [tuiTextfieldCleaner]=\"true\"\n [tuiTextfieldIconLeft]=\"docIcons.search\"\n [tuiTextfieldLabelOutside]=\"true\"\n>\n {{ searchText }}\n <ng-container *ngIf=\"canOpen\">\n <tui-data-list *tuiDataList>\n <tui-opt-group\n *ngFor=\"let group of filtered$ | async; let index = index\"\n [label]=\"labels[index] || ''\"\n >\n <a\n *ngFor=\"let item of group\"\n tuiOption\n [fragment]=\"item.fragment\"\n [routerLink]=\"item.route\"\n (click)=\"onClick(input)\"\n >\n {{ item.title }}\n <tui-svg\n *polymorpheusOutlet=\"item.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </a>\n </tui-opt-group>\n </tui-data-list>\n </ng-container>\n</tui-input>\n\n<nav class=\"t-navigation\">\n <tui-scrollbar\n class=\"t-scrollbar\"\n [tuiMode]=\"mode$ | async\"\n >\n <tui-accordion\n [closeOthers]=\"false\"\n [rounded]=\"false\"\n >\n <tui-accordion-item\n *ngFor=\"let label of labels; index as index\"\n size=\"s\"\n [borders]=\"null\"\n [(open)]=\"!!openPagesArr[index]\"\n >\n <span class=\"t-label\">\n <strong>{{ label }}</strong>\n </span>\n <ng-template tuiAccordionItemContent>\n <div class=\"t-section\">\n <ng-container\n *ngFor=\"let item of items[index]; index as subIndex\"\n [ngTemplateOutlet]=\"pages\"\n [ngTemplateOutletContext]=\"{item: item, index: index * 100 + subIndex}\"\n ></ng-container>\n </div>\n </ng-template>\n </tui-accordion-item>\n </tui-accordion>\n <div class=\"t-items-container\">\n <ng-container\n *ngFor=\"let item of itemsWithoutSections; let index = index\"\n [ngTemplateOutlet]=\"pages\"\n [ngTemplateOutletContext]=\"{item: item, index: items.length - 1 + index}\"\n ></ng-container>\n </div>\n\n <ng-template\n #pages\n let-index=\"index\"\n let-item=\"item\"\n >\n <a\n *ngIf=\"!item.subPages; else subPagesTemplate\"\n routerLinkActive=\"t-sublink_active\"\n tuiLink\n class=\"t-sublink\"\n [routerLink]=\"item.route\"\n [tuiScrollIntoViewLink]=\"isActive(item.route)\"\n (click)=\"closeMenu()\"\n >\n {{ item.title }}\n <tui-svg\n *polymorpheusOutlet=\"item.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </a>\n\n <ng-template #subPagesTemplate>\n <div\n routerLinkActive\n class=\"t-subsection\"\n [routerLinkActiveOptions]=\"{exact: false}\"\n >\n <button\n *ngIf=\"item.subPages\"\n tuiLink\n type=\"button\"\n class=\"t-sublink t-sublink_subsection\"\n (click)=\"onGroupClick(index)\"\n >\n <tui-svg\n class=\"t-chevron\"\n [class.t-chevron_active]=\"!!openPagesGroupsArr[index]\"\n [src]=\"icons.more\"\n ></tui-svg>\n {{ item.title }}\n <tui-svg\n *polymorpheusOutlet=\"item.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </button>\n <tui-expand\n class=\"t-expand\"\n [expanded]=\"!!openPagesGroupsArr[index]\"\n >\n <div class=\"t-section t-section_bordered\">\n <a\n *ngFor=\"let subPage of $pages(item.subPages)\"\n routerLinkActive=\"t-sublink_active\"\n tuiLink\n class=\"t-sublink t-sublink_small\"\n [fragment]=\"subPage.fragment\"\n [routerLink]=\"subPage.route\"\n [tuiScrollIntoViewLink]=\"isActive(subPage.route)\"\n (click)=\"closeMenu()\"\n >\n {{ subPage.title }}\n <tui-svg\n *polymorpheusOutlet=\"subPage.icon as icon\"\n class=\"t-icon\"\n [src]=\"icon\"\n ></tui-svg>\n </a>\n </div>\n </tui-expand>\n </div>\n </ng-template>\n </ng-template>\n </tui-scrollbar>\n</nav>\n\n<ng-content></ng-content>\n", styles: [":host{z-index:1;display:flex;flex-direction:column;text-align:center;background:var(--tui-base-01)}.t-input{margin:1.25rem}.t-navigation{display:flex;max-height:100%;min-height:0;flex:1 1 0;text-align:left}.t-scrollbar{scroll-behavior:smooth;width:100%}@media screen and (prefers-reduced-motion: reduce){.t-scrollbar{scroll-behavior:auto}}.t-items-container{display:flex;flex-direction:column;padding:0 1rem}.t-label{margin-left:.5rem}.t-expand{margin-left:.25rem}.t-section{display:flex;flex-direction:column;align-items:flex-start;margin:-1rem 0 -.5rem}.t-section_bordered{margin:.5rem 0;border-left:1px solid var(--tui-base-03)}.t-subsection{margin-left:.5rem}.t-sublink{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:1rem 0 0;border:0;background:none;font-size:inherit;line-height:inherit;text-decoration:none;font:var(--tui-font-text-m);margin-left:.5rem}.t-sublink_small{margin-left:1rem;line-height:1.5rem;padding-top:.5rem}.t-sublink_subsection{margin-left:0;line-height:1.6rem}.t-sublink.t-sublink.t-sublink_active{color:var(--tui-text-01)}.t-icon{margin-left:.5rem}.t-chevron{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:1rem;height:1rem;margin:-.25rem .25rem 0 -.1875rem}.t-chevron_active{transform:rotate(90deg)}\n"], components: [{ type: i1.TuiInputComponent, selector: "tui-input" }, { type: i2.TuiDataListComponent, selector: "tui-data-list", inputs: ["role", "emptyContent", "size"] }, { type: i2.TuiOptionComponent, selector: "button[tuiOption], a[tuiOption]", inputs: ["size", "role", "disabled", "value"] }, { type: i2.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i2.TuiScrollbarComponent, selector: "tui-scrollbar", inputs: ["hidden"] }, { type: i1.TuiAccordionComponent, selector: "tui-accordion", inputs: ["closeOthers", "rounded"] }, { type: i1.TuiAccordionItemComponent, selector: "tui-accordion-item", inputs: ["noPadding", "showArrow", "borders", "size", "disabled", "disableHover", "open", "async"], outputs: ["openChange"] }, { type: i2.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { type: i2.TuiExpandComponent, selector: "tui-expand", inputs: ["async", "expanded"] }], directives: [{ type: i1.TuiInputDirective, selector: "tui-input" }, { type: i2.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6$1.TuiAutoFocusDirective, selector: "[tuiAutoFocus]", inputs: ["tuiAutoFocus"] }, { type: i2.TuiTextfieldCleanerDirective, selector: "[tuiTextfieldCleaner]", inputs: ["tuiTextfieldCleaner"] }, { type: i2.TuiTextfieldIconLeftDirective, selector: "[tuiTextfieldIconLeft]", inputs: ["tuiTextfieldIconLeft"] }, { type: i2.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.TuiOptGroupDirective, selector: "tui-opt-group", inputs: ["label"] }, { type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i5$1.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i2.TuiModeDirective, selector: "[tuiMode]", inputs: ["tuiMode"] }, { type: i1.TuiAccordionItemContentDirective, selector: "ng-template[tuiAccordionItemContent]" }, { type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: i8.TuiScrollIntoViewLinkDirective, selector: "[tuiScrollIntoViewLink]", inputs: ["tuiScrollIntoViewLink"] }], pipes: { "async": i4.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
1257
1275
  __decorate([
1258
1276
  tuiPure
1259
1277
  ], TuiDocNavigationComponent.prototype, "filterItems", null);
@@ -1266,8 +1284,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
1266
1284
  selector: 'tui-doc-navigation',
1267
1285
  templateUrl: './navigation.template.html',
1268
1286
  styleUrls: ['./navigation.style.less'],
1269
- providers: NAVIGATION_PROVIDERS,
1270
1287
  changeDetection: ChangeDetectionStrategy.OnPush,
1288
+ providers: NAVIGATION_PROVIDERS,
1271
1289
  }]
1272
1290
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef, decorators: [{
1273
1291
  type: Inject,
@@ -1592,8 +1610,8 @@ TuiDocSourceCodeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
1592
1610
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiDocSourceCodeModule, decorators: [{
1593
1611
  type: NgModule,
1594
1612
  args: [{
1595
- declarations: [TuiDocSourceCodeComponent],
1596
1613
  imports: [CommonModule, PolymorpheusModule, TuiButtonModule],
1614
+ declarations: [TuiDocSourceCodeComponent],
1597
1615
  exports: [TuiDocSourceCodeComponent],
1598
1616
  }]
1599
1617
  }] });
@@ -1640,11 +1658,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
1640
1658
  selector: 'tui-language-switcher',
1641
1659
  templateUrl: './language-switcher.component.html',
1642
1660
  styleUrls: ['./language-switcher.component.less'],
1661
+ changeDetection: ChangeDetectionStrategy.OnPush,
1643
1662
  providers: [
1644
1663
  // TODO: for backward compatibility only. Drop in v4.0
1645
1664
  TuiFlagPipe,
1646
1665
  ],
1647
- changeDetection: ChangeDetectionStrategy.OnPush,
1648
1666
  }]
1649
1667
  }], ctorParameters: function () { return [{ type: i5$2.TuiLanguageSwitcher, decorators: [{
1650
1668
  type: Inject,
@@ -1672,8 +1690,6 @@ TuiLanguageSwitcherModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0
1672
1690
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TuiLanguageSwitcherModule, decorators: [{
1673
1691
  type: NgModule,
1674
1692
  args: [{
1675
- exports: [TuiLanguageSwitcherComponent],
1676
- declarations: [TuiLanguageSwitcherComponent],
1677
1693
  imports: [
1678
1694
  CommonModule,
1679
1695
  TuiFlagPipeModule,
@@ -1681,6 +1697,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
1681
1697
  TuiDataListModule,
1682
1698
  ReactiveFormsModule,
1683
1699
  ],
1700
+ declarations: [TuiLanguageSwitcherComponent],
1701
+ exports: [TuiLanguageSwitcherComponent],
1684
1702
  }]
1685
1703
  }] });
1686
1704