@taiga-ui/addon-doc 4.47.0 → 4.48.0-canary.8006d33

package/esm2022/components/page/page.component.mjs

@@ -37,7 +37,7 @@ class TuiDocPage {
         return !!this.seeAlso.length && this.activeItemIndex === 0;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocPage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocPage, isStandalone: true, selector: "tui-doc-page", inputs: { header: "header", package: "package", type: "type", tags: "tags", path: "path", deprecated: "deprecated" }, providers: PAGE_PROVIDERS, queries: [{ propertyName: "tabConnectors", predicate: TuiDocPageTabConnector }], ngImport: i0, template: "<header class=\"t-header\">\n    <h1 class=\"t-title\">\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;min-block-size:7.25rem;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);padding:3.75rem 0 0;box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:1.25rem 1.25rem 0;margin:0}}.t-title{min-inline-size:100%;font-size:inherit;margin:0}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"], dependencies: [{ kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: TuiAutoColorPipe, name: "tuiAutoColor" }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "component", type: TuiDocLanguageSwitcher, selector: "tui-doc-language-switcher" }, { kind: "component", type: TuiDocSeeAlso, selector: "tui-doc-see-also", inputs: ["seeAlso"] }, { kind: "component", type: TuiDocSourceCode, selector: "tui-doc-source-code", inputs: ["header", "package", "type", "path"] }, { kind: "pipe", type: TuiReplacePipe, name: "tuiReplace" }, { kind: "directive", type: i1.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: i2.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "component", type: i2.TuiTabsWithMore, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["size", "moreContent", "dropdownContent", "underline", "itemsLimit", "activeItemIndex"], outputs: ["activeItemIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocPage, isStandalone: true, selector: "tui-doc-page", inputs: { header: "header", package: "package", type: "type", tags: "tags", path: "path", deprecated: "deprecated" }, providers: PAGE_PROVIDERS, queries: [{ propertyName: "tabConnectors", predicate: TuiDocPageTabConnector }], ngImport: i0, template: "<header class=\"t-header\">\n    <h1\n        *ngIf=\"header\"\n        class=\"t-title\"\n    >\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:0 1.25rem;margin:0}}.t-title{min-inline-size:100%;padding:3.75rem 0 0;font-size:inherit;margin:0}@media screen and (max-width: 47.9625em){.t-title{padding:1.25rem 0 0}}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"], dependencies: [{ kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: TuiAutoColorPipe, name: "tuiAutoColor" }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "component", type: TuiDocLanguageSwitcher, selector: "tui-doc-language-switcher" }, { kind: "component", type: TuiDocSeeAlso, selector: "tui-doc-see-also", inputs: ["seeAlso"] }, { kind: "component", type: TuiDocSourceCode, selector: "tui-doc-source-code", inputs: ["header", "package", "type", "path"] }, { kind: "pipe", type: TuiReplacePipe, name: "tuiReplace" }, { kind: "directive", type: i1.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: i2.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "component", type: i2.TuiTabsWithMore, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["size", "moreContent", "dropdownContent", "underline", "itemsLimit", "activeItemIndex"], outputs: ["activeItemIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 export { TuiDocPage };
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocPage, decorators: [{
@@ -57,7 +57,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         TuiDocSourceCode,
                         TuiReplacePipe,
                         TuiTabs,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: PAGE_PROVIDERS, template: "<header class=\"t-header\">\n    <h1 class=\"t-title\">\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;min-block-size:7.25rem;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);padding:3.75rem 0 0;box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:1.25rem 1.25rem 0;margin:0}}.t-title{min-inline-size:100%;font-size:inherit;margin:0}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: PAGE_PROVIDERS, template: "<header class=\"t-header\">\n    <h1\n        *ngIf=\"header\"\n        class=\"t-title\"\n    >\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:0 1.25rem;margin:0}}.t-title{min-inline-size:100%;padding:3.75rem 0 0;font-size:inherit;margin:0}@media screen and (max-width: 47.9625em){.t-title{padding:1.25rem 0 0}}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"] }]
         }], propDecorators: { header: [{
                 type: Input
             }], package: [{
@@ -74,4 +74,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: ContentChildren,
                 args: [TuiDocPageTabConnector]
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hZGRvbi1kb2MvY29tcG9uZW50cy9wYWdlL3BhZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYWRkb24tZG9jL2NvbXBvbmVudHMvcGFnZS9wYWdlLnRlbXBsYXRlLmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFlBQVksRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFDLE1BQU0saUJBQWlCLENBQUM7QUFFOUUsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsZUFBZSxFQUNmLE1BQU0sRUFDTixLQUFLLEdBQ1IsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLGNBQWMsRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUMsTUFBTSxpQkFBaUIsQ0FBQztBQUM3RSxPQUFPLEVBQUMsb0JBQW9CLEVBQUUsd0JBQXdCLEVBQUMsTUFBTSw0QkFBNEIsQ0FBQztBQUMxRixPQUFPLEVBQUMsV0FBVyxFQUFDLE1BQU0seUJBQXlCLENBQUM7QUFDcEQsT0FBTyxFQUFDLGNBQWMsRUFBQyxNQUFNLDZCQUE2QixDQUFDO0FBQzNELE9BQU8sRUFBQyxnQkFBZ0IsRUFBQyxNQUFNLGlDQUFpQyxDQUFDO0FBQ2pFLE9BQU8sRUFBQyxPQUFPLEVBQUMsTUFBTSwrQkFBK0IsQ0FBQztBQUN0RCxPQUFPLEVBQUMsT0FBTyxFQUFDLE1BQU0sK0JBQStCLENBQUM7QUFDdEQsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sd0JBQXdCLENBQUM7QUFFMUQsT0FBTyxFQUFDLGFBQWEsRUFBQyxNQUFNLHNCQUFzQixDQUFDO0FBQ25ELE9BQU8sRUFBQyxnQkFBZ0IsRUFBQyxNQUFNLCtDQUErQyxDQUFDO0FBQy9FLE9BQU8sRUFBQyxzQkFBc0IsRUFBQyxNQUFNLHNCQUFzQixDQUFDO0FBQzVELE9BQU8sRUFBQyxjQUFjLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBQyxNQUFNLGtCQUFrQixDQUFDO0FBQzdFLE9BQU8sRUFBQyxzQkFBc0IsRUFBQyxNQUFNLHNCQUFzQixDQUFDOzs7O0FBRTVELE1Bd0JhLFVBQVU7SUF4QnZCO1FBeUJ1QixTQUFJLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUM3RCxvQkFBZSxHQUFHLE1BQU0sQ0FBQyx3QkFBd0IsQ0FBQyxDQUFDO1FBQ25ELGdCQUFXLEdBQUcsTUFBTSxDQUFDLG9CQUFvQixDQUFDLENBQUM7UUFDM0MsU0FBSSxHQUFHLElBQUksQ0FBQztRQUNaLE9BQUUsR0FBRyxHQUFHLENBQUM7UUFHckIsV0FBTSxHQUFHLEVBQUUsQ0FBQztRQUdaLFlBQU8sR0FBRyxFQUFFLENBQUM7UUFHYixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBR1YsU0FBSSxHQUFhLEVBQUUsQ0FBQztRQUdwQixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBR1YsZUFBVSxHQUFpQixLQUFLLENBQUM7UUFHeEIsa0JBQWEsR0FBc0MsV0FBVyxDQUFDO1FBRXhFLG9CQUFlLEdBQUcsQ0FBQyxDQUFDO1FBQ1gsWUFBTyxHQUFHLE1BQU0sQ0FBQyxhQUFhLENBQUMsQ0FBQztLQUtuRDtJQUhHLElBQVcsV0FBVztRQUNsQixPQUFPLENBQUMsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsZUFBZSxLQUFLLENBQUMsQ0FBQztJQUMvRCxDQUFDOytHQWpDUSxVQUFVO21HQUFWLFVBQVUsaUxBRlIsY0FBYyx3REEyQlIsc0JBQXNCLDZCQ3pFM0MseThGQThGQSw4NENEbEVRLFlBQVksaURBQ1osT0FBTyxtSEFDUCxJQUFJLDZGQUNKLGdCQUFnQixvSkFDaEIsa0JBQWtCLDhIQUNsQixVQUFVLDROQUNWLGdCQUFnQix5TUFDaEIsZ0JBQWdCLHFEQUNoQixPQUFPLGlGQUNQLHNCQUFzQixzRUFDdEIsYUFBYSxrRkFDYixnQkFBZ0IsMEdBQ2hCLGNBQWM7O1NBUVQsVUFBVTs0RkFBVixVQUFVO2tCQXhCdEIsU0FBUztpQ0FDTSxJQUFJLFlBQ04sY0FBYyxXQUNmO3dCQUNMLFlBQVk7d0JBQ1osT0FBTzt3QkFDUCxJQUFJO3dCQUNKLGdCQUFnQjt3QkFDaEIsa0JBQWtCO3dCQUNsQixVQUFVO3dCQUNWLGdCQUFnQjt3QkFDaEIsZ0JBQWdCO3dCQUNoQixPQUFPO3dCQUNQLHNCQUFzQjt3QkFDdEIsYUFBYTt3QkFDYixnQkFBZ0I7d0JBQ2hCLGNBQWM7d0JBQ2QsT0FBTztxQkFDVixtQkFHZ0IsdUJBQXVCLENBQUMsTUFBTSxhQUNwQyxjQUFjOzhCQVVsQixNQUFNO3NCQURaLEtBQUs7Z0JBSUMsT0FBTztzQkFEYixLQUFLO2dCQUlDLElBQUk7c0JBRFYsS0FBSztnQkFJQyxJQUFJO3NCQURWLEtBQUs7Z0JBSUMsSUFBSTtzQkFEVixLQUFLO2dCQUlDLFVBQVU7c0JBRGhCLEtBQUs7Z0JBSVUsYUFBYTtzQkFENUIsZUFBZTt1QkFBQyxzQkFBc0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0tleVZhbHVlUGlwZSwgTmdGb3JPZiwgTmdJZiwgTmdUZW1wbGF0ZU91dGxldH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB0eXBlIHtRdWVyeUxpc3R9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtcbiAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgICBDb21wb25lbnQsXG4gICAgQ29udGVudENoaWxkcmVuLFxuICAgIGluamVjdCxcbiAgICBJbnB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0FjdGl2YXRlZFJvdXRlLCBSb3V0ZXJMaW5rLCBSb3V0ZXJMaW5rQWN0aXZlfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuaW1wb3J0IHtUVUlfRE9DX0RFRkFVTFRfVEFCUywgVFVJX0RPQ19TVVBQT1JUX0xBTkdVQUdFfSBmcm9tICdAdGFpZ2EtdWkvYWRkb24tZG9jL3Rva2Vucyc7XG5pbXBvcnQge0VNUFRZX1FVRVJZfSBmcm9tICdAdGFpZ2EtdWkvY2RrL2NvbnN0YW50cyc7XG5pbXBvcnQge1R1aVJlcGxhY2VQaXBlfSBmcm9tICdAdGFpZ2EtdWkvY2RrL3BpcGVzL3JlcGxhY2UnO1xuaW1wb3J0IHtUdWlBdXRvQ29sb3JQaXBlfSBmcm9tICdAdGFpZ2EtdWkvY29yZS9waXBlcy9hdXRvLWNvbG9yJztcbmltcG9ydCB7VHVpQ2hpcH0gZnJvbSAnQHRhaWdhLXVpL2tpdC9jb21wb25lbnRzL2NoaXAnO1xuaW1wb3J0IHtUdWlUYWJzfSBmcm9tICdAdGFpZ2EtdWkva2l0L2NvbXBvbmVudHMvdGFicyc7XG5pbXBvcnQge1BvbHltb3JwaGV1c091dGxldH0gZnJvbSAnQHRhaWdhLXVpL3BvbHltb3JwaGV1cyc7XG5cbmltcG9ydCB7VHVpRG9jU2VlQWxzb30gZnJvbSAnLi4vaW50ZXJuYWwvc2VlLWFsc28nO1xuaW1wb3J0IHtUdWlEb2NTb3VyY2VDb2RlfSBmcm9tICcuLi9pbnRlcm5hbC9zb3VyY2UtY29kZS9zb3VyY2UtY29kZS5jb21wb25lbnQnO1xuaW1wb3J0IHtUdWlEb2NMYW5ndWFnZVN3aXRjaGVyfSBmcm9tICcuLi9sYW5ndWFnZS1zd2l0Y2hlcic7XG5pbXBvcnQge1BBR0VfUFJPVklERVJTLCBQQUdFX1NFRV9BTFNPLCBUVUlfRE9DX1RBQlN9IGZyb20gJy4vcGFnZS5wcm92aWRlcnMnO1xuaW1wb3J0IHtUdWlEb2NQYWdlVGFiQ29ubmVjdG9yfSBmcm9tICcuL3BhZ2UtdGFiLmRpcmVjdGl2ZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgc2VsZWN0b3I6ICd0dWktZG9jLXBhZ2UnLFxuICAgIGltcG9ydHM6IFtcbiAgICAgICAgS2V5VmFsdWVQaXBlLFxuICAgICAgICBOZ0Zvck9mLFxuICAgICAgICBOZ0lmLFxuICAgICAgICBOZ1RlbXBsYXRlT3V0bGV0LFxuICAgICAgICBQb2x5bW9ycGhldXNPdXRsZXQsXG4gICAgICAgIFJvdXRlckxpbmssXG4gICAgICAgIFJvdXRlckxpbmtBY3RpdmUsXG4gICAgICAgIFR1aUF1dG9Db2xvclBpcGUsXG4gICAgICAgIFR1aUNoaXAsXG4gICAgICAgIFR1aURvY0xhbmd1YWdlU3dpdGNoZXIsXG4gICAgICAgIFR1aURvY1NlZUFsc28sXG4gICAgICAgIFR1aURvY1NvdXJjZUNvZGUsXG4gICAgICAgIFR1aVJlcGxhY2VQaXBlLFxuICAgICAgICBUdWlUYWJzLFxuICAgIF0sXG4gICAgdGVtcGxhdGVVcmw6ICcuL3BhZ2UudGVtcGxhdGUuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vcGFnZS5zdHlsZS5sZXNzJ10sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgcHJvdmlkZXJzOiBQQUdFX1BST1ZJREVSUyxcbn0pXG5leHBvcnQgY2xhc3MgVHVpRG9jUGFnZSB7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IHRhYnMgPSBpbmplY3QoVFVJX0RPQ19UQUJTKShpbmplY3QoQWN0aXZhdGVkUm91dGUpLnNuYXBzaG90KTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgc3VwcG9ydExhbmd1YWdlID0gaW5qZWN0KFRVSV9ET0NfU1VQUE9SVF9MQU5HVUFHRSk7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IGRlZmF1bHRUYWJzID0gaW5qZWN0KFRVSV9ET0NfREVGQVVMVF9UQUJTKTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgZnJvbSA9IC8gL2c7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IHRvID0gJ18nO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgaGVhZGVyID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBwYWNrYWdlID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyB0eXBlID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyB0YWdzOiBzdHJpbmdbXSA9IFtdO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgcGF0aCA9ICcnO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgZGVwcmVjYXRlZDogYm9vbGVhbiB8ICcnID0gZmFsc2U7XG5cbiAgICBAQ29udGVudENoaWxkcmVuKFR1aURvY1BhZ2VUYWJDb25uZWN0b3IpXG4gICAgcHVibGljIHJlYWRvbmx5IHRhYkNvbm5lY3RvcnM6IFF1ZXJ5TGlzdDxUdWlEb2NQYWdlVGFiQ29ubmVjdG9yPiA9IEVNUFRZX1FVRVJZO1xuXG4gICAgcHVibGljIGFjdGl2ZUl0ZW1JbmRleCA9IDA7XG4gICAgcHVibGljIHJlYWRvbmx5IHNlZUFsc28gPSBpbmplY3QoUEFHRV9TRUVfQUxTTyk7XG5cbiAgICBwdWJsaWMgZ2V0IHNob3dTZWVBbHNvKCk6IGJvb2xlYW4ge1xuICAgICAgICByZXR1cm4gISF0aGlzLnNlZUFsc28ubGVuZ3RoICYmIHRoaXMuYWN0aXZlSXRlbUluZGV4ID09PSAwO1xuICAgIH1cbn1cbiIsIjxoZWFkZXIgY2xhc3M9XCJ0LWhlYWRlclwiPlxuICAgIDxoMSBjbGFzcz1cInQtdGl0bGVcIj5cbiAgICAgICAge3sgaGVhZGVyIH19XG4gICAgICAgIDx0dWktY2hpcFxuICAgICAgICAgICAgKm5nSWY9XCIhIWRlcHJlY2F0ZWQgfHwgZGVwcmVjYXRlZCA9PT0gJydcIlxuICAgICAgICAgICAgYXBwZWFyYW5jZT1cImN1c3RvbVwiXG4gICAgICAgICAgICBzaXplPVwieHNcIlxuICAgICAgICAgICAgY2xhc3M9XCJ0LXRhZyB0LXRhZ19kZXByZWNhdGVkXCJcbiAgICAgICAgPlxuICAgICAgICAgICAgZGVwcmVjYXRlZFxuICAgICAgICA8L3R1aS1jaGlwPlxuICAgICAgICA8dHVpLWNoaXBcbiAgICAgICAgICAgICpuZ0lmPVwicGFja2FnZVwiXG4gICAgICAgICAgICBhcHBlYXJhbmNlPVwiY3VzdG9tXCJcbiAgICAgICAgICAgIHNpemU9XCJ4c1wiXG4gICAgICAgICAgICBjbGFzcz1cInQtdGFnIHQtdGFnX3BhY2thZ2VcIlxuICAgICAgICAgICAgW3N0eWxlLmJhY2tncm91bmRdPVwicGFja2FnZSB8IHR1aUF1dG9Db2xvclwiXG4gICAgICAgID5cbiAgICAgICAgICAgIHt7IHBhY2thZ2UgfX1cbiAgICAgICAgPC90dWktY2hpcD5cbiAgICAgICAgPHR1aS1jaGlwXG4gICAgICAgICAgICAqbmdGb3I9XCJsZXQgdGFnIG9mIHRhZ3NcIlxuICAgICAgICAgICAgYXBwZWFyYW5jZT1cImN1c3RvbVwiXG4gICAgICAgICAgICBzaXplPVwieHNcIlxuICAgICAgICAgICAgY2xhc3M9XCJ0LXRhZyB0LXRhZ19wYWNrYWdlXCJcbiAgICAgICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kXT1cInRhZyB8IHR1aUF1dG9Db2xvclwiXG4gICAgICAgID5cbiAgICAgICAgICAgIHt7IHRhZyB9fVxuICAgICAgICA8L3R1aS1jaGlwPlxuICAgIDwvaDE+XG4gICAgPHR1aS10YWJzLXdpdGgtbW9yZVxuICAgICAgICAqbmdJZj1cInRhYkNvbm5lY3RvcnMubGVuZ3RoXCJcbiAgICAgICAgY2xhc3M9XCJ0LXRhYnNcIlxuICAgICAgICBbKGFjdGl2ZUl0ZW1JbmRleCldPVwiYWN0aXZlSXRlbUluZGV4XCJcbiAgICA+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHRhYiBvZiB0YWJDb25uZWN0b3JzOyBmaXJzdCBhcyBmaXJzdDsgaW5kZXggYXMgaW5kZXhcIj5cbiAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJ0YWIucGFnZVRhYiB8fCBkZWZhdWx0VGFic1tpbmRleF0gYXMgdGFiTmFtZVwiPlxuICAgICAgICAgICAgICAgIDxhXG4gICAgICAgICAgICAgICAgICAgICp0dWlJdGVtXG4gICAgICAgICAgICAgICAgICAgIHJvdXRlckxpbmtBY3RpdmVcbiAgICAgICAgICAgICAgICAgICAgdHVpVGFiXG4gICAgICAgICAgICAgICAgICAgIFtyb3V0ZXJMaW5rXT1cImZpcnN0ID8gJy4vJyA6ICh0YWJOYW1lIHwgdHVpUmVwbGFjZTogZnJvbSA6IHRvKVwiXG4gICAgICAgICAgICAgICAgICAgIFtyb3V0ZXJMaW5rQWN0aXZlT3B0aW9uc109XCJ7ZXhhY3Q6IGZpcnN0fVwiXG4gICAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgICAgICB7eyB0YWJOYW1lIH19XG4gICAgICAgICAgICAgICAgPC9hPlxuICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCB0YWIgb2YgdGFicyB8IGtleXZhbHVlXCI+XG4gICAgICAgICAgICA8YVxuICAgICAgICAgICAgICAgICp0dWlJdGVtXG4gICAgICAgICAgICAgICAgcm91dGVyTGlua0FjdGl2ZVxuICAgICAgICAgICAgICAgIHR1aVRhYlxuICAgICAgICAgICAgICAgIFtyb3V0ZXJMaW5rXT1cInRhYi5rZXlcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHt7IHRhYi5rZXkgfX1cbiAgICAgICAgICAgIDwvYT5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgPC90dWktdGFicy13aXRoLW1vcmU+XG5cbiAgICA8ZGl2XG4gICAgICAgICpuZ0lmPVwicGFja2FnZSB8fCBwYXRoIHx8IHR5cGVcIlxuICAgICAgICBjbGFzcz1cInQtcmlnaHQtc2lkZVwiXG4gICAgPlxuICAgICAgICA8dHVpLWRvYy1zb3VyY2UtY29kZVxuICAgICAgICAgICAgY2xhc3M9XCJ0LXNvdXJjZS1jb2RlXCJcbiAgICAgICAgICAgIFtoZWFkZXJdPVwiaGVhZGVyXCJcbiAgICAgICAgICAgIFtwYWNrYWdlXT1cInBhY2thZ2VcIlxuICAgICAgICAgICAgW3BhdGhdPVwicGF0aFwiXG4gICAgICAgICAgICBbdHlwZV09XCJ0eXBlXCJcbiAgICAgICAgLz5cblxuICAgICAgICA8dHVpLWRvYy1sYW5ndWFnZS1zd2l0Y2hlciAqbmdJZj1cInN1cHBvcnRMYW5ndWFnZS5oYXMoaGVhZGVyKVwiIC8+XG4gICAgPC9kaXY+XG48L2hlYWRlcj5cbjxkaXYgY2xhc3M9XCJ0LWNvbnRlbnRcIj5cbiAgICA8bmctY29udGVudCAvPlxuICAgIDx0dWktZG9jLXNlZS1hbHNvXG4gICAgICAgICpuZ0lmPVwic2hvd1NlZUFsc29cIlxuICAgICAgICBjbGFzcz1cInQtc2VlLWFsc29cIlxuICAgICAgICBbc2VlQWxzb109XCJzZWVBbHNvXCJcbiAgICAvPlxuICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHRhYiBvZiB0YWJDb25uZWN0b3JzOyBpbmRleCBhcyBpbmRleFwiPlxuICAgICAgICA8bmctY29udGFpbmVyXG4gICAgICAgICAgICAqbmdJZj1cImluZGV4ID09PSBhY3RpdmVJdGVtSW5kZXhcIlxuICAgICAgICAgICAgW25nVGVtcGxhdGVPdXRsZXRdPVwidGFiLnRlbXBsYXRlXCJcbiAgICAgICAgLz5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8bmctY29udGFpbmVyICpuZ0Zvcj1cImxldCB0YWIgb2YgdGFicyB8IGtleXZhbHVlOyBpbmRleCBhcyBpbmRleFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiaW5kZXggKyB0YWJDb25uZWN0b3JzLmxlbmd0aCA9PT0gYWN0aXZlSXRlbUluZGV4XCI+XG4gICAgICAgICAgICA8bmctY29udGFpbmVyICpwb2x5bW9ycGhldXNPdXRsZXQ9XCJ0YWIudmFsdWUgYXMgdGV4dFwiPnt7IHRleHQgfX08L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgPC9uZy1jb250YWluZXI+XG48L2Rpdj5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hZGRvbi1kb2MvY29tcG9uZW50cy9wYWdlL3BhZ2UuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYWRkb24tZG9jL2NvbXBvbmVudHMvcGFnZS9wYWdlLnRlbXBsYXRlLmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFlBQVksRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFDLE1BQU0saUJBQWlCLENBQUM7QUFFOUUsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsZUFBZSxFQUNmLE1BQU0sRUFDTixLQUFLLEdBQ1IsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLGNBQWMsRUFBRSxVQUFVLEVBQUUsZ0JBQWdCLEVBQUMsTUFBTSxpQkFBaUIsQ0FBQztBQUM3RSxPQUFPLEVBQUMsb0JBQW9CLEVBQUUsd0JBQXdCLEVBQUMsTUFBTSw0QkFBNEIsQ0FBQztBQUMxRixPQUFPLEVBQUMsV0FBVyxFQUFDLE1BQU0seUJBQXlCLENBQUM7QUFDcEQsT0FBTyxFQUFDLGNBQWMsRUFBQyxNQUFNLDZCQUE2QixDQUFDO0FBQzNELE9BQU8sRUFBQyxnQkFBZ0IsRUFBQyxNQUFNLGlDQUFpQyxDQUFDO0FBQ2pFLE9BQU8sRUFBQyxPQUFPLEVBQUMsTUFBTSwrQkFBK0IsQ0FBQztBQUN0RCxPQUFPLEVBQUMsT0FBTyxFQUFDLE1BQU0sK0JBQStCLENBQUM7QUFDdEQsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sd0JBQXdCLENBQUM7QUFFMUQsT0FBTyxFQUFDLGFBQWEsRUFBQyxNQUFNLHNCQUFzQixDQUFDO0FBQ25ELE9BQU8sRUFBQyxnQkFBZ0IsRUFBQyxNQUFNLCtDQUErQyxDQUFDO0FBQy9FLE9BQU8sRUFBQyxzQkFBc0IsRUFBQyxNQUFNLHNCQUFzQixDQUFDO0FBQzVELE9BQU8sRUFBQyxjQUFjLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBQyxNQUFNLGtCQUFrQixDQUFDO0FBQzdFLE9BQU8sRUFBQyxzQkFBc0IsRUFBQyxNQUFNLHNCQUFzQixDQUFDOzs7O0FBRTVELE1Bd0JhLFVBQVU7SUF4QnZCO1FBeUJ1QixTQUFJLEdBQUcsTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUM3RCxvQkFBZSxHQUFHLE1BQU0sQ0FBQyx3QkFBd0IsQ0FBQyxDQUFDO1FBQ25ELGdCQUFXLEdBQUcsTUFBTSxDQUFDLG9CQUFvQixDQUFDLENBQUM7UUFDM0MsU0FBSSxHQUFHLElBQUksQ0FBQztRQUNaLE9BQUUsR0FBRyxHQUFHLENBQUM7UUFHckIsV0FBTSxHQUFHLEVBQUUsQ0FBQztRQUdaLFlBQU8sR0FBRyxFQUFFLENBQUM7UUFHYixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBR1YsU0FBSSxHQUFhLEVBQUUsQ0FBQztRQUdwQixTQUFJLEdBQUcsRUFBRSxDQUFDO1FBR1YsZUFBVSxHQUFpQixLQUFLLENBQUM7UUFHeEIsa0JBQWEsR0FBc0MsV0FBVyxDQUFDO1FBRXhFLG9CQUFlLEdBQUcsQ0FBQyxDQUFDO1FBQ1gsWUFBTyxHQUFHLE1BQU0sQ0FBQyxhQUFhLENBQUMsQ0FBQztLQUtuRDtJQUhHLElBQVcsV0FBVztRQUNsQixPQUFPLENBQUMsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsZUFBZSxLQUFLLENBQUMsQ0FBQztJQUMvRCxDQUFDOytHQWpDUSxVQUFVO21HQUFWLFVBQVUsaUxBRlIsY0FBYyx3REEyQlIsc0JBQXNCLDZCQ3pFM0Msay9GQWlHQSxzN0NEckVRLFlBQVksaURBQ1osT0FBTyxtSEFDUCxJQUFJLDZGQUNKLGdCQUFnQixvSkFDaEIsa0JBQWtCLDhIQUNsQixVQUFVLDROQUNWLGdCQUFnQix5TUFDaEIsZ0JBQWdCLHFEQUNoQixPQUFPLGlGQUNQLHNCQUFzQixzRUFDdEIsYUFBYSxrRkFDYixnQkFBZ0IsMEdBQ2hCLGNBQWM7O1NBUVQsVUFBVTs0RkFBVixVQUFVO2tCQXhCdEIsU0FBUztpQ0FDTSxJQUFJLFlBQ04sY0FBYyxXQUNmO3dCQUNMLFlBQVk7d0JBQ1osT0FBTzt3QkFDUCxJQUFJO3dCQUNKLGdCQUFnQjt3QkFDaEIsa0JBQWtCO3dCQUNsQixVQUFVO3dCQUNWLGdCQUFnQjt3QkFDaEIsZ0JBQWdCO3dCQUNoQixPQUFPO3dCQUNQLHNCQUFzQjt3QkFDdEIsYUFBYTt3QkFDYixnQkFBZ0I7d0JBQ2hCLGNBQWM7d0JBQ2QsT0FBTztxQkFDVixtQkFHZ0IsdUJBQXVCLENBQUMsTUFBTSxhQUNwQyxjQUFjOzhCQVVsQixNQUFNO3NCQURaLEtBQUs7Z0JBSUMsT0FBTztzQkFEYixLQUFLO2dCQUlDLElBQUk7c0JBRFYsS0FBSztnQkFJQyxJQUFJO3NCQURWLEtBQUs7Z0JBSUMsSUFBSTtzQkFEVixLQUFLO2dCQUlDLFVBQVU7c0JBRGhCLEtBQUs7Z0JBSVUsYUFBYTtzQkFENUIsZUFBZTt1QkFBQyxzQkFBc0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0tleVZhbHVlUGlwZSwgTmdGb3JPZiwgTmdJZiwgTmdUZW1wbGF0ZU91dGxldH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB0eXBlIHtRdWVyeUxpc3R9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtcbiAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgICBDb21wb25lbnQsXG4gICAgQ29udGVudENoaWxkcmVuLFxuICAgIGluamVjdCxcbiAgICBJbnB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0FjdGl2YXRlZFJvdXRlLCBSb3V0ZXJMaW5rLCBSb3V0ZXJMaW5rQWN0aXZlfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuaW1wb3J0IHtUVUlfRE9DX0RFRkFVTFRfVEFCUywgVFVJX0RPQ19TVVBQT1JUX0xBTkdVQUdFfSBmcm9tICdAdGFpZ2EtdWkvYWRkb24tZG9jL3Rva2Vucyc7XG5pbXBvcnQge0VNUFRZX1FVRVJZfSBmcm9tICdAdGFpZ2EtdWkvY2RrL2NvbnN0YW50cyc7XG5pbXBvcnQge1R1aVJlcGxhY2VQaXBlfSBmcm9tICdAdGFpZ2EtdWkvY2RrL3BpcGVzL3JlcGxhY2UnO1xuaW1wb3J0IHtUdWlBdXRvQ29sb3JQaXBlfSBmcm9tICdAdGFpZ2EtdWkvY29yZS9waXBlcy9hdXRvLWNvbG9yJztcbmltcG9ydCB7VHVpQ2hpcH0gZnJvbSAnQHRhaWdhLXVpL2tpdC9jb21wb25lbnRzL2NoaXAnO1xuaW1wb3J0IHtUdWlUYWJzfSBmcm9tICdAdGFpZ2EtdWkva2l0L2NvbXBvbmVudHMvdGFicyc7XG5pbXBvcnQge1BvbHltb3JwaGV1c091dGxldH0gZnJvbSAnQHRhaWdhLXVpL3BvbHltb3JwaGV1cyc7XG5cbmltcG9ydCB7VHVpRG9jU2VlQWxzb30gZnJvbSAnLi4vaW50ZXJuYWwvc2VlLWFsc28nO1xuaW1wb3J0IHtUdWlEb2NTb3VyY2VDb2RlfSBmcm9tICcuLi9pbnRlcm5hbC9zb3VyY2UtY29kZS9zb3VyY2UtY29kZS5jb21wb25lbnQnO1xuaW1wb3J0IHtUdWlEb2NMYW5ndWFnZVN3aXRjaGVyfSBmcm9tICcuLi9sYW5ndWFnZS1zd2l0Y2hlcic7XG5pbXBvcnQge1BBR0VfUFJPVklERVJTLCBQQUdFX1NFRV9BTFNPLCBUVUlfRE9DX1RBQlN9IGZyb20gJy4vcGFnZS5wcm92aWRlcnMnO1xuaW1wb3J0IHtUdWlEb2NQYWdlVGFiQ29ubmVjdG9yfSBmcm9tICcuL3BhZ2UtdGFiLmRpcmVjdGl2ZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgc2VsZWN0b3I6ICd0dWktZG9jLXBhZ2UnLFxuICAgIGltcG9ydHM6IFtcbiAgICAgICAgS2V5VmFsdWVQaXBlLFxuICAgICAgICBOZ0Zvck9mLFxuICAgICAgICBOZ0lmLFxuICAgICAgICBOZ1RlbXBsYXRlT3V0bGV0LFxuICAgICAgICBQb2x5bW9ycGhldXNPdXRsZXQsXG4gICAgICAgIFJvdXRlckxpbmssXG4gICAgICAgIFJvdXRlckxpbmtBY3RpdmUsXG4gICAgICAgIFR1aUF1dG9Db2xvclBpcGUsXG4gICAgICAgIFR1aUNoaXAsXG4gICAgICAgIFR1aURvY0xhbmd1YWdlU3dpdGNoZXIsXG4gICAgICAgIFR1aURvY1NlZUFsc28sXG4gICAgICAgIFR1aURvY1NvdXJjZUNvZGUsXG4gICAgICAgIFR1aVJlcGxhY2VQaXBlLFxuICAgICAgICBUdWlUYWJzLFxuICAgIF0sXG4gICAgdGVtcGxhdGVVcmw6ICcuL3BhZ2UudGVtcGxhdGUuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vcGFnZS5zdHlsZS5sZXNzJ10sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgcHJvdmlkZXJzOiBQQUdFX1BST1ZJREVSUyxcbn0pXG5leHBvcnQgY2xhc3MgVHVpRG9jUGFnZSB7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IHRhYnMgPSBpbmplY3QoVFVJX0RPQ19UQUJTKShpbmplY3QoQWN0aXZhdGVkUm91dGUpLnNuYXBzaG90KTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgc3VwcG9ydExhbmd1YWdlID0gaW5qZWN0KFRVSV9ET0NfU1VQUE9SVF9MQU5HVUFHRSk7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IGRlZmF1bHRUYWJzID0gaW5qZWN0KFRVSV9ET0NfREVGQVVMVF9UQUJTKTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgZnJvbSA9IC8gL2c7XG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IHRvID0gJ18nO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgaGVhZGVyID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBwYWNrYWdlID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyB0eXBlID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyB0YWdzOiBzdHJpbmdbXSA9IFtdO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgcGF0aCA9ICcnO1xuXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgZGVwcmVjYXRlZDogYm9vbGVhbiB8ICcnID0gZmFsc2U7XG5cbiAgICBAQ29udGVudENoaWxkcmVuKFR1aURvY1BhZ2VUYWJDb25uZWN0b3IpXG4gICAgcHVibGljIHJlYWRvbmx5IHRhYkNvbm5lY3RvcnM6IFF1ZXJ5TGlzdDxUdWlEb2NQYWdlVGFiQ29ubmVjdG9yPiA9IEVNUFRZX1FVRVJZO1xuXG4gICAgcHVibGljIGFjdGl2ZUl0ZW1JbmRleCA9IDA7XG4gICAgcHVibGljIHJlYWRvbmx5IHNlZUFsc28gPSBpbmplY3QoUEFHRV9TRUVfQUxTTyk7XG5cbiAgICBwdWJsaWMgZ2V0IHNob3dTZWVBbHNvKCk6IGJvb2xlYW4ge1xuICAgICAgICByZXR1cm4gISF0aGlzLnNlZUFsc28ubGVuZ3RoICYmIHRoaXMuYWN0aXZlSXRlbUluZGV4ID09PSAwO1xuICAgIH1cbn1cbiIsIjxoZWFkZXIgY2xhc3M9XCJ0LWhlYWRlclwiPlxuICAgIDxoMVxuICAgICAgICAqbmdJZj1cImhlYWRlclwiXG4gICAgICAgIGNsYXNzPVwidC10aXRsZVwiXG4gICAgPlxuICAgICAgICB7eyBoZWFkZXIgfX1cbiAgICAgICAgPHR1aS1jaGlwXG4gICAgICAgICAgICAqbmdJZj1cIiEhZGVwcmVjYXRlZCB8fCBkZXByZWNhdGVkID09PSAnJ1wiXG4gICAgICAgICAgICBhcHBlYXJhbmNlPVwiY3VzdG9tXCJcbiAgICAgICAgICAgIHNpemU9XCJ4c1wiXG4gICAgICAgICAgICBjbGFzcz1cInQtdGFnIHQtdGFnX2RlcHJlY2F0ZWRcIlxuICAgICAgICA+XG4gICAgICAgICAgICBkZXByZWNhdGVkXG4gICAgICAgIDwvdHVpLWNoaXA+XG4gICAgICAgIDx0dWktY2hpcFxuICAgICAgICAgICAgKm5nSWY9XCJwYWNrYWdlXCJcbiAgICAgICAgICAgIGFwcGVhcmFuY2U9XCJjdXN0b21cIlxuICAgICAgICAgICAgc2l6ZT1cInhzXCJcbiAgICAgICAgICAgIGNsYXNzPVwidC10YWcgdC10YWdfcGFja2FnZVwiXG4gICAgICAgICAgICBbc3R5bGUuYmFja2dyb3VuZF09XCJwYWNrYWdlIHwgdHVpQXV0b0NvbG9yXCJcbiAgICAgICAgPlxuICAgICAgICAgICAge3sgcGFja2FnZSB9fVxuICAgICAgICA8L3R1aS1jaGlwPlxuICAgICAgICA8dHVpLWNoaXBcbiAgICAgICAgICAgICpuZ0Zvcj1cImxldCB0YWcgb2YgdGFnc1wiXG4gICAgICAgICAgICBhcHBlYXJhbmNlPVwiY3VzdG9tXCJcbiAgICAgICAgICAgIHNpemU9XCJ4c1wiXG4gICAgICAgICAgICBjbGFzcz1cInQtdGFnIHQtdGFnX3BhY2thZ2VcIlxuICAgICAgICAgICAgW3N0eWxlLmJhY2tncm91bmRdPVwidGFnIHwgdHVpQXV0b0NvbG9yXCJcbiAgICAgICAgPlxuICAgICAgICAgICAge3sgdGFnIH19XG4gICAgICAgIDwvdHVpLWNoaXA+XG4gICAgPC9oMT5cbiAgICA8dHVpLXRhYnMtd2l0aC1tb3JlXG4gICAgICAgICpuZ0lmPVwidGFiQ29ubmVjdG9ycy5sZW5ndGhcIlxuICAgICAgICBjbGFzcz1cInQtdGFic1wiXG4gICAgICAgIFsoYWN0aXZlSXRlbUluZGV4KV09XCJhY3RpdmVJdGVtSW5kZXhcIlxuICAgID5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgdGFiIG9mIHRhYkNvbm5lY3RvcnM7IGZpcnN0IGFzIGZpcnN0OyBpbmRleCBhcyBpbmRleFwiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cInRhYi5wYWdlVGFiIHx8IGRlZmF1bHRUYWJzW2luZGV4XSBhcyB0YWJOYW1lXCI+XG4gICAgICAgICAgICAgICAgPGFcbiAgICAgICAgICAgICAgICAgICAgKnR1aUl0ZW1cbiAgICAgICAgICAgICAgICAgICAgcm91dGVyTGlua0FjdGl2ZVxuICAgICAgICAgICAgICAgICAgICB0dWlUYWJcbiAgICAgICAgICAgICAgICAgICAgW3JvdXRlckxpbmtdPVwiZmlyc3QgPyAnLi8nIDogKHRhYk5hbWUgfCB0dWlSZXBsYWNlOiBmcm9tIDogdG8pXCJcbiAgICAgICAgICAgICAgICAgICAgW3JvdXRlckxpbmtBY3RpdmVPcHRpb25zXT1cIntleGFjdDogZmlyc3R9XCJcbiAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgIHt7IHRhYk5hbWUgfX1cbiAgICAgICAgICAgICAgICA8L2E+XG4gICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHRhYiBvZiB0YWJzIHwga2V5dmFsdWVcIj5cbiAgICAgICAgICAgIDxhXG4gICAgICAgICAgICAgICAgKnR1aUl0ZW1cbiAgICAgICAgICAgICAgICByb3V0ZXJMaW5rQWN0aXZlXG4gICAgICAgICAgICAgICAgdHVpVGFiXG4gICAgICAgICAgICAgICAgW3JvdXRlckxpbmtdPVwidGFiLmtleVwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3sgdGFiLmtleSB9fVxuICAgICAgICAgICAgPC9hPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L3R1aS10YWJzLXdpdGgtbW9yZT5cblxuICAgIDxkaXZcbiAgICAgICAgKm5nSWY9XCJwYWNrYWdlIHx8IHBhdGggfHwgdHlwZVwiXG4gICAgICAgIGNsYXNzPVwidC1yaWdodC1zaWRlXCJcbiAgICA+XG4gICAgICAgIDx0dWktZG9jLXNvdXJjZS1jb2RlXG4gICAgICAgICAgICBjbGFzcz1cInQtc291cmNlLWNvZGVcIlxuICAgICAgICAgICAgW2hlYWRlcl09XCJoZWFkZXJcIlxuICAgICAgICAgICAgW3BhY2thZ2VdPVwicGFja2FnZVwiXG4gICAgICAgICAgICBbcGF0aF09XCJwYXRoXCJcbiAgICAgICAgICAgIFt0eXBlXT1cInR5cGVcIlxuICAgICAgICAvPlxuXG4gICAgICAgIDx0dWktZG9jLWxhbmd1YWdlLXN3aXRjaGVyICpuZ0lmPVwic3VwcG9ydExhbmd1YWdlLmhhcyhoZWFkZXIpXCIgLz5cbiAgICA8L2Rpdj5cbjwvaGVhZGVyPlxuPGRpdiBjbGFzcz1cInQtY29udGVudFwiPlxuICAgIDxuZy1jb250ZW50IC8+XG4gICAgPHR1aS1kb2Mtc2VlLWFsc29cbiAgICAgICAgKm5nSWY9XCJzaG93U2VlQWxzb1wiXG4gICAgICAgIGNsYXNzPVwidC1zZWUtYWxzb1wiXG4gICAgICAgIFtzZWVBbHNvXT1cInNlZUFsc29cIlxuICAgIC8+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgdGFiIG9mIHRhYkNvbm5lY3RvcnM7IGluZGV4IGFzIGluZGV4XCI+XG4gICAgICAgIDxuZy1jb250YWluZXJcbiAgICAgICAgICAgICpuZ0lmPVwiaW5kZXggPT09IGFjdGl2ZUl0ZW1JbmRleFwiXG4gICAgICAgICAgICBbbmdUZW1wbGF0ZU91dGxldF09XCJ0YWIudGVtcGxhdGVcIlxuICAgICAgICAvPlxuICAgIDwvbmctY29udGFpbmVyPlxuICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHRhYiBvZiB0YWJzIHwga2V5dmFsdWU7IGluZGV4IGFzIGluZGV4XCI+XG4gICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJpbmRleCArIHRhYkNvbm5lY3RvcnMubGVuZ3RoID09PSBhY3RpdmVJdGVtSW5kZXhcIj5cbiAgICAgICAgICAgIDxuZy1jb250YWluZXIgKnBvbHltb3JwaGV1c091dGxldD1cInRhYi52YWx1ZSBhcyB0ZXh0XCI+e3sgdGV4dCB9fTwvbmctY29udGFpbmVyPlxuICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbjwvZGl2PlxuIl19

package/esm2022/tokens/doc-icons.mjs

@@ -10,9 +10,14 @@ export const TUI_DOC_DEFAULT_ICONS = {
     copy: '@tui.copy',
     check: '@tui.check',
     link: '@tui.link',
+    externalLink: '@tui.external-link',
     languages: '@tui.languages',
     shrink: '@tui.shrink',
     expand: '@tui.expand',
+    ltr: {
+        preview: '@tui.a-large-small',
+        direction: '@tui.arrow-right-left',
+    },
 };
 export const TUI_DOC_ICONS = new InjectionToken(ngDevMode ? 'TUI_DOC_ICONS' : '', {
     factory: () => TUI_DOC_DEFAULT_ICONS,
@@ -21,4 +26,4 @@ export function tuiDocIconsProvider(icons) {
     return tuiProvideOptions(TUI_DOC_ICONS, icons, TUI_DOC_DEFAULT_ICONS);
 }
 export const TUI_DOC_DIRECTION_ENABLED = new InjectionToken(ngDevMode ? 'TUI_DOC_DIRECTION_ENABLED' : '', { factory: TUI_FALSE_HANDLER });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZG9jLWljb25zLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvYWRkb24tZG9jL3Rva2Vucy9kb2MtaWNvbnMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFDLGNBQWMsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUM3QyxPQUFPLEVBQUMsaUJBQWlCLEVBQUMsTUFBTSx5QkFBeUIsQ0FBQztBQUMxRCxPQUFPLEVBQUMsaUJBQWlCLEVBQUMsTUFBTSxtQ0FBbUMsQ0FBQztBQW1CcEUsTUFBTSxDQUFDLE1BQU0scUJBQXFCLEdBQWdCO0lBQzlDLE1BQU0sRUFBRSxhQUFhO0lBQ3JCLEtBQUssRUFBRSxVQUFVO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLEtBQUssRUFBRSxZQUFZO0lBQ25CLElBQUksRUFBRSxXQUFXO0lBQ2pCLFNBQVMsRUFBRSxnQkFBZ0I7SUFDM0IsTUFBTSxFQUFFLGFBQWE7SUFDckIsTUFBTSxFQUFFLGFBQWE7Q0FDeEIsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGFBQWEsR0FBRyxJQUFJLGNBQWMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFO0lBQzlFLE9BQU8sRUFBRSxHQUFHLEVBQUUsQ0FBQyxxQkFBcUI7Q0FDdkMsQ0FBQyxDQUFDO0FBRUgsTUFBTSxVQUFVLG1CQUFtQixDQUFDLEtBQTJCO0lBQzNELE9BQU8saUJBQWlCLENBQUMsYUFBYSxFQUFFLEtBQUssRUFBRSxxQkFBcUIsQ0FBQyxDQUFDO0FBQzFFLENBQUM7QUFFRCxNQUFNLENBQUMsTUFBTSx5QkFBeUIsR0FBRyxJQUFJLGNBQWMsQ0FDdkQsU0FBUyxDQUFDLENBQUMsQ0FBQywyQkFBMkIsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUM1QyxFQUFDLE9BQU8sRUFBRSxpQkFBaUIsRUFBQyxDQUMvQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHR5cGUge1Byb3ZpZGVyfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7SW5qZWN0aW9uVG9rZW59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtUVUlfRkFMU0VfSEFORExFUn0gZnJvbSAnQHRhaWdhLXVpL2Nkay9jb25zdGFudHMnO1xuaW1wb3J0IHt0dWlQcm92aWRlT3B0aW9uc30gZnJvbSAnQHRhaWdhLXVpL2Nkay91dGlscy9taXNjZWxsYW5lb3VzJztcblxuZXhwb3J0IGludGVyZmFjZSBUdWlEb2NJY29ucyB7XG4gICAgcmVhZG9ubHkgY29kZTogc3RyaW5nO1xuICAgIHJlYWRvbmx5IGxpZ2h0OiBzdHJpbmc7XG4gICAgcmVhZG9ubHkgbWVudTogc3RyaW5nO1xuICAgIHJlYWRvbmx5IGRhcms6IHN0cmluZztcbiAgICByZWFkb25seSBzZWFyY2g6IHN0cmluZztcbiAgICByZWFkb25seSBjb3B5OiBzdHJpbmc7XG4gICAgcmVhZG9ubHkgY2hlY2s6IHN0cmluZztcbiAgICByZWFkb25seSBsaW5rOiBzdHJpbmc7XG4gICAgcmVhZG9ubHkgbGFuZ3VhZ2VzOiBzdHJpbmc7XG4gICAgLyoqXG4gICAgICogVE9ETzogZHJvcCBvcHRpb25hbCBpbiB2NVxuICAgICAqL1xuICAgIHJlYWRvbmx5IHNocmluaz86IHN0cmluZztcbiAgICByZWFkb25seSBleHBhbmQ/OiBzdHJpbmc7XG59XG5cbmV4cG9ydCBjb25zdCBUVUlfRE9DX0RFRkFVTFRfSUNPTlM6IFR1aURvY0ljb25zID0ge1xuICAgIHNlYXJjaDogJ0B0dWkuc2VhcmNoJyxcbiAgICBsaWdodDogJ0B0dWkuc3VuJyxcbiAgICBkYXJrOiAnQHR1aS5tb29uJyxcbiAgICBjb2RlOiAnQHR1aS5jb2RlJyxcbiAgICBtZW51OiAnQHR1aS5tZW51JyxcbiAgICBjb3B5OiAnQHR1aS5jb3B5JyxcbiAgICBjaGVjazogJ0B0dWkuY2hlY2snLFxuICAgIGxpbms6ICdAdHVpLmxpbmsnLFxuICAgIGxhbmd1YWdlczogJ0B0dWkubGFuZ3VhZ2VzJyxcbiAgICBzaHJpbms6ICdAdHVpLnNocmluaycsXG4gICAgZXhwYW5kOiAnQHR1aS5leHBhbmQnLFxufTtcblxuZXhwb3J0IGNvbnN0IFRVSV9ET0NfSUNPTlMgPSBuZXcgSW5qZWN0aW9uVG9rZW4obmdEZXZNb2RlID8gJ1RVSV9ET0NfSUNPTlMnIDogJycsIHtcbiAgICBmYWN0b3J5OiAoKSA9PiBUVUlfRE9DX0RFRkFVTFRfSUNPTlMsXG59KTtcblxuZXhwb3J0IGZ1bmN0aW9uIHR1aURvY0ljb25zUHJvdmlkZXIoaWNvbnM6IFBhcnRpYWw8VHVpRG9jSWNvbnM+KTogUHJvdmlkZXIge1xuICAgIHJldHVybiB0dWlQcm92aWRlT3B0aW9ucyhUVUlfRE9DX0lDT05TLCBpY29ucywgVFVJX0RPQ19ERUZBVUxUX0lDT05TKTtcbn1cblxuZXhwb3J0IGNvbnN0IFRVSV9ET0NfRElSRUNUSU9OX0VOQUJMRUQgPSBuZXcgSW5qZWN0aW9uVG9rZW4oXG4gICAgbmdEZXZNb2RlID8gJ1RVSV9ET0NfRElSRUNUSU9OX0VOQUJMRUQnIDogJycsXG4gICAge2ZhY3Rvcnk6IFRVSV9GQUxTRV9IQU5ETEVSfSxcbik7XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZG9jLWljb25zLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvYWRkb24tZG9jL3Rva2Vucy9kb2MtaWNvbnMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFDLGNBQWMsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUM3QyxPQUFPLEVBQUMsaUJBQWlCLEVBQUMsTUFBTSx5QkFBeUIsQ0FBQztBQUMxRCxPQUFPLEVBQUMsaUJBQWlCLEVBQUMsTUFBTSxtQ0FBbUMsQ0FBQztBQThCcEUsTUFBTSxDQUFDLE1BQU0scUJBQXFCLEdBQWdCO0lBQzlDLE1BQU0sRUFBRSxhQUFhO0lBQ3JCLEtBQUssRUFBRSxVQUFVO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLElBQUksRUFBRSxXQUFXO0lBQ2pCLEtBQUssRUFBRSxZQUFZO0lBQ25CLElBQUksRUFBRSxXQUFXO0lBQ2pCLFlBQVksRUFBRSxvQkFBb0I7SUFDbEMsU0FBUyxFQUFFLGdCQUFnQjtJQUMzQixNQUFNLEVBQUUsYUFBYTtJQUNyQixNQUFNLEVBQUUsYUFBYTtJQUNyQixHQUFHLEVBQUU7UUFDRCxPQUFPLEVBQUUsb0JBQW9CO1FBQzdCLFNBQVMsRUFBRSx1QkFBdUI7S0FDckM7Q0FDSixDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sYUFBYSxHQUFHLElBQUksY0FBYyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsZUFBZSxDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUU7SUFDOUUsT0FBTyxFQUFFLEdBQUcsRUFBRSxDQUFDLHFCQUFxQjtDQUN2QyxDQUFDLENBQUM7QUFFSCxNQUFNLFVBQVUsbUJBQW1CLENBQUMsS0FBMkI7SUFDM0QsT0FBTyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsS0FBSyxFQUFFLHFCQUFxQixDQUFDLENBQUM7QUFDMUUsQ0FBQztBQUVELE1BQU0sQ0FBQyxNQUFNLHlCQUF5QixHQUFHLElBQUksY0FBYyxDQUN2RCxTQUFTLENBQUMsQ0FBQyxDQUFDLDJCQUEyQixDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQzVDLEVBQUMsT0FBTyxFQUFFLGlCQUFpQixFQUFDLENBQy9CLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7UHJvdmlkZXJ9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtJbmplY3Rpb25Ub2tlbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1RVSV9GQUxTRV9IQU5ETEVSfSBmcm9tICdAdGFpZ2EtdWkvY2RrL2NvbnN0YW50cyc7XG5pbXBvcnQge3R1aVByb3ZpZGVPcHRpb25zfSBmcm9tICdAdGFpZ2EtdWkvY2RrL3V0aWxzL21pc2NlbGxhbmVvdXMnO1xuXG5leHBvcnQgaW50ZXJmYWNlIFR1aURvY0ljb25zIHtcbiAgICByZWFkb25seSBjb2RlOiBzdHJpbmc7XG4gICAgcmVhZG9ubHkgbGlnaHQ6IHN0cmluZztcbiAgICByZWFkb25seSBtZW51OiBzdHJpbmc7XG4gICAgcmVhZG9ubHkgZGFyazogc3RyaW5nO1xuICAgIHJlYWRvbmx5IHNlYXJjaDogc3RyaW5nO1xuICAgIHJlYWRvbmx5IGNvcHk6IHN0cmluZztcbiAgICByZWFkb25seSBjaGVjazogc3RyaW5nO1xuICAgIHJlYWRvbmx5IGxpbms6IHN0cmluZztcbiAgICByZWFkb25seSBsYW5ndWFnZXM6IHN0cmluZztcbiAgICAvKipcbiAgICAgKiBUT0RPOiBkcm9wIG9wdGlvbmFsIGluIHY1XG4gICAgICovXG4gICAgcmVhZG9ubHkgZXh0ZXJuYWxMaW5rPzogc3RyaW5nO1xuICAgIC8qKlxuICAgICAqIFRPRE86IGRyb3Agb3B0aW9uYWwgaW4gdjVcbiAgICAgKi9cbiAgICByZWFkb25seSBzaHJpbms/OiBzdHJpbmc7XG4gICAgcmVhZG9ubHkgZXhwYW5kPzogc3RyaW5nO1xuICAgIC8qKlxuICAgICAqIFRPRE86IGRyb3Agb3B0aW9uYWwgaW4gdjVcbiAgICAgKi9cbiAgICByZWFkb25seSBsdHI/OiB7XG4gICAgICAgIHJlYWRvbmx5IHByZXZpZXc6IHN0cmluZztcbiAgICAgICAgcmVhZG9ubHkgZGlyZWN0aW9uOiBzdHJpbmc7XG4gICAgfTtcbn1cblxuZXhwb3J0IGNvbnN0IFRVSV9ET0NfREVGQVVMVF9JQ09OUzogVHVpRG9jSWNvbnMgPSB7XG4gICAgc2VhcmNoOiAnQHR1aS5zZWFyY2gnLFxuICAgIGxpZ2h0OiAnQHR1aS5zdW4nLFxuICAgIGRhcms6ICdAdHVpLm1vb24nLFxuICAgIGNvZGU6ICdAdHVpLmNvZGUnLFxuICAgIG1lbnU6ICdAdHVpLm1lbnUnLFxuICAgIGNvcHk6ICdAdHVpLmNvcHknLFxuICAgIGNoZWNrOiAnQHR1aS5jaGVjaycsXG4gICAgbGluazogJ0B0dWkubGluaycsXG4gICAgZXh0ZXJuYWxMaW5rOiAnQHR1aS5leHRlcm5hbC1saW5rJyxcbiAgICBsYW5ndWFnZXM6ICdAdHVpLmxhbmd1YWdlcycsXG4gICAgc2hyaW5rOiAnQHR1aS5zaHJpbmsnLFxuICAgIGV4cGFuZDogJ0B0dWkuZXhwYW5kJyxcbiAgICBsdHI6IHtcbiAgICAgICAgcHJldmlldzogJ0B0dWkuYS1sYXJnZS1zbWFsbCcsXG4gICAgICAgIGRpcmVjdGlvbjogJ0B0dWkuYXJyb3ctcmlnaHQtbGVmdCcsXG4gICAgfSxcbn07XG5cbmV4cG9ydCBjb25zdCBUVUlfRE9DX0lDT05TID0gbmV3IEluamVjdGlvblRva2VuKG5nRGV2TW9kZSA/ICdUVUlfRE9DX0lDT05TJyA6ICcnLCB7XG4gICAgZmFjdG9yeTogKCkgPT4gVFVJX0RPQ19ERUZBVUxUX0lDT05TLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiB0dWlEb2NJY29uc1Byb3ZpZGVyKGljb25zOiBQYXJ0aWFsPFR1aURvY0ljb25zPik6IFByb3ZpZGVyIHtcbiAgICByZXR1cm4gdHVpUHJvdmlkZU9wdGlvbnMoVFVJX0RPQ19JQ09OUywgaWNvbnMsIFRVSV9ET0NfREVGQVVMVF9JQ09OUyk7XG59XG5cbmV4cG9ydCBjb25zdCBUVUlfRE9DX0RJUkVDVElPTl9FTkFCTEVEID0gbmV3IEluamVjdGlvblRva2VuKFxuICAgIG5nRGV2TW9kZSA/ICdUVUlfRE9DX0RJUkVDVElPTl9FTkFCTEVEJyA6ICcnLFxuICAgIHtmYWN0b3J5OiBUVUlfRkFMU0VfSEFORExFUn0sXG4pO1xuIl19

package/fesm2022/taiga-ui-addon-doc-components.mjs

@@ -172,6 +172,7 @@ class TuiDocAPIItem {
         this.urlSerializer = inject(UrlSerializer);
         this.urlStateHandler = inject(TUI_DOC_URL_STATE_HANDLER);
         this.alerts = inject(TuiAlertService);
+        this.icons = inject(TUI_DOC_ICONS);
         this.numberItem = inject(TuiDocAPINumberItem, {
             self: true,
             optional: true,
@@ -227,7 +228,7 @@ class TuiDocAPIItem {
         this.locationRef.go(this.urlStateHandler(tree));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocAPIItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocAPIItem, isStandalone: true, selector: "tr[tuiDocAPIItem]", inputs: { name: "name", type: "type", value: "value", items: "items" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<td class=\"t-td\">\n    <code\n        class=\"t-name\"\n        [class.t-name_banana]=\"name.startsWith('[(')\"\n        [class.t-name_input]=\"name.startsWith('[')\"\n        [class.t-name_output]=\"name.startsWith('(')\"\n    >\n        {{ name }}\n    </code>\n    <ng-content />\n</td>\n<td class=\"t-td\">\n    <code class=\"t-type\">\n        <ng-container *ngFor=\"let item of type | tuiDocTypeReference; let last = last\">\n            <a\n                *ngIf=\"item.reference; else default\"\n                target=\"_blank\"\n                class=\"t-reference\"\n                [attr.href]=\"item.reference\"\n            >\n                {{ item.type }}\n                <tui-icon\n                    icon=\"@tui.external-link\"\n                    [style.font-size.rem]=\"1\"\n                />\n            </a>\n            <ng-template #default>\n                {{ item.type }}\n            </ng-template>\n            <span *ngIf=\"!last\">&nbsp;|&nbsp;</span>\n        </ng-container>\n    </code>\n</td>\n<td class=\"t-td\">\n    <tui-textfield\n        *ngIf=\"items.length; else noItems\"\n        tuiChevron\n        tuiTextfieldSize=\"m\"\n        class=\"t-input\"\n        [content]=\"content\"\n        [tuiTextfieldCleaner]=\"type.includes('null') || type.includes('PolymorpheusContent')\"\n    >\n        <select\n            placeholder=\"null\"\n            tuiTextfield\n            [ngModel]=\"value ?? null\"\n            (ngModelChange)=\"onValueChange($event)\"\n        ></select>\n        <tui-data-list-wrapper\n            *tuiTextfieldDropdown\n            [itemContent]=\"content\"\n            [items]=\"items\"\n        />\n    </tui-textfield>\n    <ng-template\n        #content\n        let-data\n    >\n        <code [style.margin]=\"0\">{{ data | tuiInspectAny }}</code>\n    </ng-template>\n    <ng-template #noItems>\n        <ng-container\n            *ngIf=\"value !== undefined\"\n            [ngSwitch]=\"type\"\n        >\n            <input\n                *ngSwitchCase=\"'boolean'\"\n                tuiSwitch\n                type=\"checkbox\"\n                [id]=\"name\"\n                [ngModel]=\"value\"\n                (ngModelChange)=\"onValueChange($event)\"\n            />\n\n            <tui-textfield\n                *ngSwitchCase=\"'string'\"\n                tuiTextfieldSize=\"m\"\n                class=\"t-input\"\n            >\n                <input\n                    tuiTextfield\n                    [id]=\"name\"\n                    [ngModel]=\"value || ''\"\n                    (ngModelChange)=\"onValueChange($event)\"\n                />\n            </tui-textfield>\n\n            <tui-textfield\n                *ngSwitchCase=\"'number'\"\n                tuiTextfieldSize=\"m\"\n            >\n                <input\n                    tuiInputNumber\n                    [id]=\"name\"\n                    [max]=\"numberItem?.max ?? null\"\n                    [min]=\"numberItem?.min ?? null\"\n                    [ngModel]=\"value\"\n                    [step]=\"1\"\n                    (ngModelChange)=\"onValueChange($event || 0)\"\n                />\n            </tui-textfield>\n        </ng-container>\n    </ng-template>\n</td>\n", styles: [":host{box-shadow:inset 0 -1px var(--tui-border-normal)}.t-td{padding:1.5rem 2rem 1.5rem 0;vertical-align:top}.t-td:last-child{padding-inline-end:0;text-align:end;min-inline-size:10rem}.t-name{display:flex!important;min-block-size:1.5rem;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;margin:0 0 .5rem!important;-webkit-text-fill-color:var(--tui-background-accent-2-pressed)}.t-name_input{-webkit-text-fill-color:var(--tui-text-negative)}.t-name_banana{-webkit-text-fill-color:var(--tui-text-action)}.t-name_output{-webkit-text-fill-color:var(--tui-status-info)}.t-type{flex-wrap:wrap;align-items:center;justify-content:flex-start;min-block-size:1.5rem;margin:0!important}.t-reference{display:inline-flex;color:var(--tui-text-action);text-decoration:none;align-items:center;justify-content:center;gap:3px}.t-input{min-inline-size:10rem;margin-block-start:-.625rem}.t-input code{overflow:hidden;white-space:nowrap}@media screen and (max-width: 47.9625em){:host{gap:1rem;padding:1rem 0}.t-td{padding:0}.t-td:last-child{text-align:start}.t-input{margin:0}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "component", type: i2.TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels]), tui-data-list-wrapper:not([labels])[new]", inputs: ["items", "disabledItemHandler", "emptyContent", "size", "itemContent"], outputs: ["itemClick"] }, { kind: "pipe", type: TuiDocTypeReferencePipe, name: "tuiDocTypeReference" }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i3.TuiInputNumberDirective, selector: "input[tuiInputNumber]", inputs: ["min", "max", "prefix", "postfix"] }, { kind: "component", type: i3.TuiInputNumberStep, selector: "input[tuiInputNumber][step]", inputs: ["step"] }, { kind: "pipe", type: TuiInspectPipe, name: "tuiInspectAny" }, { kind: "component", type: TuiSwitch, selector: "input[type=\"checkbox\"][tuiSwitch]", inputs: ["size", "showIcons"] }, { kind: "component", type: i4.TuiSelect, selector: "select[tuiTextfield]", inputs: ["placeholder"] }, { kind: "component", type: i4.TuiTextfieldComponent, selector: "tui-textfield:not([multi])" }, { kind: "directive", type: i4.TuiTextfieldDirective, selector: "input[tuiTextfield]:not([tuiInputCard]):not([tuiInputExpire]):not([tuiInputCVC])" }, { kind: "directive", type: i4.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i4.TuiTextfieldDropdownDirective, selector: "ng-template[tuiTextfieldDropdown]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocAPIItem, isStandalone: true, selector: "tr[tuiDocAPIItem]", inputs: { name: "name", type: "type", value: "value", items: "items" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<td class=\"t-td\">\n    <code\n        class=\"t-name\"\n        [class.t-name_banana]=\"name.startsWith('[(')\"\n        [class.t-name_input]=\"name.startsWith('[')\"\n        [class.t-name_output]=\"name.startsWith('(')\"\n    >\n        {{ name }}\n    </code>\n    <ng-content />\n</td>\n<td class=\"t-td\">\n    <code class=\"t-type\">\n        <ng-container *ngFor=\"let item of type | tuiDocTypeReference; let last = last\">\n            <a\n                *ngIf=\"item.reference; else default\"\n                target=\"_blank\"\n                class=\"t-reference\"\n                [attr.href]=\"item.reference\"\n            >\n                {{ item.type }}\n                <tui-icon\n                    *ngIf=\"icons.externalLink\"\n                    [icon]=\"icons.externalLink\"\n                    [style.font-size.rem]=\"1\"\n                />\n            </a>\n            <ng-template #default>\n                {{ item.type }}\n            </ng-template>\n            <span *ngIf=\"!last\">&nbsp;|&nbsp;</span>\n        </ng-container>\n    </code>\n</td>\n<td class=\"t-td\">\n    <tui-textfield\n        *ngIf=\"items.length; else noItems\"\n        tuiChevron\n        tuiTextfieldSize=\"m\"\n        class=\"t-input\"\n        [content]=\"content\"\n        [tuiTextfieldCleaner]=\"type.includes('null') || type.includes('PolymorpheusContent')\"\n    >\n        <select\n            placeholder=\"null\"\n            tuiTextfield\n            [ngModel]=\"value ?? null\"\n            (ngModelChange)=\"onValueChange($event)\"\n        ></select>\n        <tui-data-list-wrapper\n            *tuiTextfieldDropdown\n            [itemContent]=\"content\"\n            [items]=\"items\"\n        />\n    </tui-textfield>\n    <ng-template\n        #content\n        let-data\n    >\n        <code [style.margin]=\"0\">{{ data | tuiInspectAny }}</code>\n    </ng-template>\n    <ng-template #noItems>\n        <ng-container\n            *ngIf=\"value !== undefined\"\n            [ngSwitch]=\"type\"\n        >\n            <input\n                *ngSwitchCase=\"'boolean'\"\n                tuiSwitch\n                type=\"checkbox\"\n                [id]=\"name\"\n                [ngModel]=\"value\"\n                (ngModelChange)=\"onValueChange($event)\"\n            />\n\n            <tui-textfield\n                *ngSwitchCase=\"'string'\"\n                tuiTextfieldSize=\"m\"\n                class=\"t-input\"\n            >\n                <input\n                    tuiTextfield\n                    [id]=\"name\"\n                    [ngModel]=\"value || ''\"\n                    (ngModelChange)=\"onValueChange($event)\"\n                />\n            </tui-textfield>\n\n            <tui-textfield\n                *ngSwitchCase=\"'number'\"\n                tuiTextfieldSize=\"m\"\n            >\n                <input\n                    tuiInputNumber\n                    [id]=\"name\"\n                    [max]=\"numberItem?.max ?? null\"\n                    [min]=\"numberItem?.min ?? null\"\n                    [ngModel]=\"value\"\n                    [step]=\"1\"\n                    (ngModelChange)=\"onValueChange($event || 0)\"\n                />\n            </tui-textfield>\n        </ng-container>\n    </ng-template>\n</td>\n", styles: [":host{box-shadow:inset 0 -1px var(--tui-border-normal)}.t-td{padding:1.5rem 2rem 1.5rem 0;vertical-align:top}.t-td:last-child{padding-inline-end:0;text-align:end;min-inline-size:10rem}.t-name{display:flex!important;min-block-size:1.5rem;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;margin:0 0 .5rem!important;-webkit-text-fill-color:var(--tui-background-accent-2-pressed)}.t-name_input{-webkit-text-fill-color:var(--tui-text-negative)}.t-name_banana{-webkit-text-fill-color:var(--tui-text-action)}.t-name_output{-webkit-text-fill-color:var(--tui-status-info)}.t-type{flex-wrap:wrap;align-items:center;justify-content:flex-start;min-block-size:1.5rem;margin:0!important}.t-reference{display:inline-flex;color:var(--tui-text-action);text-decoration:none;align-items:center;justify-content:center;gap:3px}.t-input{min-inline-size:10rem;margin-block-start:-.625rem}.t-input code{overflow:hidden;white-space:nowrap}@media screen and (max-width: 47.9625em){:host{gap:1rem;padding:1rem 0}.t-td{padding:0}.t-td:last-child{text-align:start}.t-input{margin:0}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "component", type: i2.TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels]), tui-data-list-wrapper:not([labels])[new]", inputs: ["items", "disabledItemHandler", "emptyContent", "size", "itemContent"], outputs: ["itemClick"] }, { kind: "pipe", type: TuiDocTypeReferencePipe, name: "tuiDocTypeReference" }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: i3.TuiInputNumberDirective, selector: "input[tuiInputNumber]", inputs: ["min", "max", "prefix", "postfix"] }, { kind: "component", type: i3.TuiInputNumberStep, selector: "input[tuiInputNumber][step]", inputs: ["step"] }, { kind: "pipe", type: TuiInspectPipe, name: "tuiInspectAny" }, { kind: "component", type: TuiSwitch, selector: "input[type=\"checkbox\"][tuiSwitch]", inputs: ["size", "showIcons"] }, { kind: "component", type: i4.TuiSelect, selector: "select[tuiTextfield]", inputs: ["placeholder"] }, { kind: "component", type: i4.TuiTextfieldComponent, selector: "tui-textfield:not([multi])" }, { kind: "directive", type: i4.TuiTextfieldDirective, selector: "input[tuiTextfield]:not([tuiInputCard]):not([tuiInputExpire]):not([tuiInputCVC])" }, { kind: "directive", type: i4.TuiTextfieldOptionsDirective, selector: "[tuiTextfieldAppearance],[tuiTextfieldSize],[tuiTextfieldCleaner]", inputs: ["tuiTextfieldAppearance", "tuiTextfieldSize", "tuiTextfieldCleaner"] }, { kind: "directive", type: i4.TuiTextfieldDropdownDirective, selector: "ng-template[tuiTextfieldDropdown]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocAPIItem, decorators: [{
             type: Component,
@@ -245,7 +246,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         TuiInspectPipe,
                         TuiSwitch,
                         TuiTextfield,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<td class=\"t-td\">\n    <code\n        class=\"t-name\"\n        [class.t-name_banana]=\"name.startsWith('[(')\"\n        [class.t-name_input]=\"name.startsWith('[')\"\n        [class.t-name_output]=\"name.startsWith('(')\"\n    >\n        {{ name }}\n    </code>\n    <ng-content />\n</td>\n<td class=\"t-td\">\n    <code class=\"t-type\">\n        <ng-container *ngFor=\"let item of type | tuiDocTypeReference; let last = last\">\n            <a\n                *ngIf=\"item.reference; else default\"\n                target=\"_blank\"\n                class=\"t-reference\"\n                [attr.href]=\"item.reference\"\n            >\n                {{ item.type }}\n                <tui-icon\n                    icon=\"@tui.external-link\"\n                    [style.font-size.rem]=\"1\"\n                />\n            </a>\n            <ng-template #default>\n                {{ item.type }}\n            </ng-template>\n            <span *ngIf=\"!last\">&nbsp;|&nbsp;</span>\n        </ng-container>\n    </code>\n</td>\n<td class=\"t-td\">\n    <tui-textfield\n        *ngIf=\"items.length; else noItems\"\n        tuiChevron\n        tuiTextfieldSize=\"m\"\n        class=\"t-input\"\n        [content]=\"content\"\n        [tuiTextfieldCleaner]=\"type.includes('null') || type.includes('PolymorpheusContent')\"\n    >\n        <select\n            placeholder=\"null\"\n            tuiTextfield\n            [ngModel]=\"value ?? null\"\n            (ngModelChange)=\"onValueChange($event)\"\n        ></select>\n        <tui-data-list-wrapper\n            *tuiTextfieldDropdown\n            [itemContent]=\"content\"\n            [items]=\"items\"\n        />\n    </tui-textfield>\n    <ng-template\n        #content\n        let-data\n    >\n        <code [style.margin]=\"0\">{{ data | tuiInspectAny }}</code>\n    </ng-template>\n    <ng-template #noItems>\n        <ng-container\n            *ngIf=\"value !== undefined\"\n            [ngSwitch]=\"type\"\n        >\n            <input\n                *ngSwitchCase=\"'boolean'\"\n                tuiSwitch\n                type=\"checkbox\"\n                [id]=\"name\"\n                [ngModel]=\"value\"\n                (ngModelChange)=\"onValueChange($event)\"\n            />\n\n            <tui-textfield\n                *ngSwitchCase=\"'string'\"\n                tuiTextfieldSize=\"m\"\n                class=\"t-input\"\n            >\n                <input\n                    tuiTextfield\n                    [id]=\"name\"\n                    [ngModel]=\"value || ''\"\n                    (ngModelChange)=\"onValueChange($event)\"\n                />\n            </tui-textfield>\n\n            <tui-textfield\n                *ngSwitchCase=\"'number'\"\n                tuiTextfieldSize=\"m\"\n            >\n                <input\n                    tuiInputNumber\n                    [id]=\"name\"\n                    [max]=\"numberItem?.max ?? null\"\n                    [min]=\"numberItem?.min ?? null\"\n                    [ngModel]=\"value\"\n                    [step]=\"1\"\n                    (ngModelChange)=\"onValueChange($event || 0)\"\n                />\n            </tui-textfield>\n        </ng-container>\n    </ng-template>\n</td>\n", styles: [":host{box-shadow:inset 0 -1px var(--tui-border-normal)}.t-td{padding:1.5rem 2rem 1.5rem 0;vertical-align:top}.t-td:last-child{padding-inline-end:0;text-align:end;min-inline-size:10rem}.t-name{display:flex!important;min-block-size:1.5rem;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;margin:0 0 .5rem!important;-webkit-text-fill-color:var(--tui-background-accent-2-pressed)}.t-name_input{-webkit-text-fill-color:var(--tui-text-negative)}.t-name_banana{-webkit-text-fill-color:var(--tui-text-action)}.t-name_output{-webkit-text-fill-color:var(--tui-status-info)}.t-type{flex-wrap:wrap;align-items:center;justify-content:flex-start;min-block-size:1.5rem;margin:0!important}.t-reference{display:inline-flex;color:var(--tui-text-action);text-decoration:none;align-items:center;justify-content:center;gap:3px}.t-input{min-inline-size:10rem;margin-block-start:-.625rem}.t-input code{overflow:hidden;white-space:nowrap}@media screen and (max-width: 47.9625em){:host{gap:1rem;padding:1rem 0}.t-td{padding:0}.t-td:last-child{text-align:start}.t-input{margin:0}}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<td class=\"t-td\">\n    <code\n        class=\"t-name\"\n        [class.t-name_banana]=\"name.startsWith('[(')\"\n        [class.t-name_input]=\"name.startsWith('[')\"\n        [class.t-name_output]=\"name.startsWith('(')\"\n    >\n        {{ name }}\n    </code>\n    <ng-content />\n</td>\n<td class=\"t-td\">\n    <code class=\"t-type\">\n        <ng-container *ngFor=\"let item of type | tuiDocTypeReference; let last = last\">\n            <a\n                *ngIf=\"item.reference; else default\"\n                target=\"_blank\"\n                class=\"t-reference\"\n                [attr.href]=\"item.reference\"\n            >\n                {{ item.type }}\n                <tui-icon\n                    *ngIf=\"icons.externalLink\"\n                    [icon]=\"icons.externalLink\"\n                    [style.font-size.rem]=\"1\"\n                />\n            </a>\n            <ng-template #default>\n                {{ item.type }}\n            </ng-template>\n            <span *ngIf=\"!last\">&nbsp;|&nbsp;</span>\n        </ng-container>\n    </code>\n</td>\n<td class=\"t-td\">\n    <tui-textfield\n        *ngIf=\"items.length; else noItems\"\n        tuiChevron\n        tuiTextfieldSize=\"m\"\n        class=\"t-input\"\n        [content]=\"content\"\n        [tuiTextfieldCleaner]=\"type.includes('null') || type.includes('PolymorpheusContent')\"\n    >\n        <select\n            placeholder=\"null\"\n            tuiTextfield\n            [ngModel]=\"value ?? null\"\n            (ngModelChange)=\"onValueChange($event)\"\n        ></select>\n        <tui-data-list-wrapper\n            *tuiTextfieldDropdown\n            [itemContent]=\"content\"\n            [items]=\"items\"\n        />\n    </tui-textfield>\n    <ng-template\n        #content\n        let-data\n    >\n        <code [style.margin]=\"0\">{{ data | tuiInspectAny }}</code>\n    </ng-template>\n    <ng-template #noItems>\n        <ng-container\n            *ngIf=\"value !== undefined\"\n            [ngSwitch]=\"type\"\n        >\n            <input\n                *ngSwitchCase=\"'boolean'\"\n                tuiSwitch\n                type=\"checkbox\"\n                [id]=\"name\"\n                [ngModel]=\"value\"\n                (ngModelChange)=\"onValueChange($event)\"\n            />\n\n            <tui-textfield\n                *ngSwitchCase=\"'string'\"\n                tuiTextfieldSize=\"m\"\n                class=\"t-input\"\n            >\n                <input\n                    tuiTextfield\n                    [id]=\"name\"\n                    [ngModel]=\"value || ''\"\n                    (ngModelChange)=\"onValueChange($event)\"\n                />\n            </tui-textfield>\n\n            <tui-textfield\n                *ngSwitchCase=\"'number'\"\n                tuiTextfieldSize=\"m\"\n            >\n                <input\n                    tuiInputNumber\n                    [id]=\"name\"\n                    [max]=\"numberItem?.max ?? null\"\n                    [min]=\"numberItem?.min ?? null\"\n                    [ngModel]=\"value\"\n                    [step]=\"1\"\n                    (ngModelChange)=\"onValueChange($event || 0)\"\n                />\n            </tui-textfield>\n        </ng-container>\n    </ng-template>\n</td>\n", styles: [":host{box-shadow:inset 0 -1px var(--tui-border-normal)}.t-td{padding:1.5rem 2rem 1.5rem 0;vertical-align:top}.t-td:last-child{padding-inline-end:0;text-align:end;min-inline-size:10rem}.t-name{display:flex!important;min-block-size:1.5rem;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;margin:0 0 .5rem!important;-webkit-text-fill-color:var(--tui-background-accent-2-pressed)}.t-name_input{-webkit-text-fill-color:var(--tui-text-negative)}.t-name_banana{-webkit-text-fill-color:var(--tui-text-action)}.t-name_output{-webkit-text-fill-color:var(--tui-status-info)}.t-type{flex-wrap:wrap;align-items:center;justify-content:flex-start;min-block-size:1.5rem;margin:0!important}.t-reference{display:inline-flex;color:var(--tui-text-action);text-decoration:none;align-items:center;justify-content:center;gap:3px}.t-input{min-inline-size:10rem;margin-block-start:-.625rem}.t-input code{overflow:hidden;white-space:nowrap}@media screen and (max-width: 47.9625em){:host{gap:1rem;padding:1rem 0}.t-td{padding:0}.t-td:last-child{text-align:start}.t-input{margin:0}}\n"] }]
         }], propDecorators: { name: [{
                 type: Input
             }], type: [{
@@ -866,7 +867,7 @@ class TuiDocExample {
             .finally(() => this.loading.set(false));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocExample, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocExample, isStandalone: true, selector: "tui-doc-example", inputs: { id: "id", heading: "heading", description: "description", fullsize: "fullsize", componentName: "componentName", content: "content", component: "component" }, host: { properties: { "attr.id": "id", "class._fullsize": "fullsize" } }, ngImport: i0, template: "<div class=\"t-title-block\">\n    <h2\n        *ngIf=\"heading\"\n        class=\"t-title\"\n    >\n        <span\n            *polymorpheusOutlet=\"heading as text\"\n            [textContent]=\"text\"\n        ></span>\n    </h2>\n    <a\n        *ngIf=\"id\"\n        routerLink=\".\"\n        routerLinkActive=\"t-link-active\"\n        tuiLink\n        type=\"button\"\n        class=\"t-link\"\n        [attr.title]=\"copy()\"\n        [fragment]=\"id\"\n        [relativeTo]=\"route.firstChild ?? route\"\n        [routerLinkActiveOptions]=\"{matrixParams: 'exact', queryParams: 'exact', paths: 'exact', fragment: 'exact'}\"\n        (click)=\"copyExampleLink($event.currentTarget)\"\n    >\n        #\n    </a>\n</div>\n<h3\n    *ngIf=\"description\"\n    class=\"t-description\"\n>\n    <ng-container *polymorpheusOutlet=\"description as text\">\n        {{ text }}\n    </ng-container>\n</h3>\n\n<div\n    class=\"t-example\"\n    [(tuiFullscreen)]=\"fullscreen\"\n>\n    <ng-container *ngIf=\"processor() | 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                        type=\"button\"\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=\"processor() | tuiMapper: visible\"\n                size=\"xs\"\n                class=\"t-code-editor\"\n                [overlay]=\"true\"\n                [showLoader]=\"loading()\"\n                (click)=\"edit(processor())\"\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\n            <button\n                *ngIf=\"fullscreenEnabled\"\n                appearance=\"flat\"\n                size=\"xs\"\n                tuiIconButton\n                type=\"button\"\n                [iconStart]=\"fullscreen ? icons.shrink : icons.expand\"\n                (click)=\"fullscreen = !fullscreen\"\n            >\n                Fullscreen\n            </button>\n        </div>\n\n        <div\n            *ngFor=\"let tab of tabs; let index = index\"\n            class=\"t-content\"\n        >\n            <section\n                *ngIf=\"index === defaultTabIndex\"\n                automation-id=\"tui-doc-example\"\n                class=\"t-demo\"\n                [style.display]=\"activeItemIndex === index && index === defaultTabIndex ? 'block' : 'none'\"\n            >\n                <ng-content />\n                <ng-container *polymorpheusOutlet=\"lazyComponent() as text\">\n                    {{ text }}\n                </ng-container>\n            </section>\n\n            <tui-doc-code\n                *tuiLet=\"processor()[tabs[index] || 0] || '' as code\"\n                [code]=\"code\"\n                [style.display]=\"activeItemIndex === index && index !== defaultTabIndex ? 'block' : 'none'\"\n            >\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        </div>\n    </ng-container>\n</div>\n", styles: [":host{position:relative;display:block;padding-block-start:3.5rem;clear:inline-end}:host:target{animation:1s tuiShaking}@media screen and (max-width: 47.9625em){:host{padding-block-start:2rem}}.t-title-block{display:flex;flex-direction:row-reverse}.t-title{font:var(--tui-font-heading-5);margin:0 auto .5rem 0}@media screen and (max-width: 47.9625em){.t-title{font:var(--tui-font-heading-6)}}.t-title:hover+.t-link{opacity:1}.t-link{font:var(--tui-font-heading-6);padding-inline-end:.1rem}@media not screen and (max-width: 47.9625em){.t-link{font:var(--tui-font-heading-5);margin-inline-start:-1.6rem}.t-link:not(:hover):not(.t-link-active){opacity:0}}.t-description{font:var(--tui-font-text-m);font-weight:400;margin:0}.t-title:first-letter,.t-description:first-letter{text-transform:capitalize}.t-example{position:relative;margin-block-start:1.5rem;border:1px solid var(--tui-border-normal);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem #0000001a;overflow:hidden}@media screen and (max-width: 47.9625em){.t-example{margin-block-start:.75rem}}.t-tabs-wrapper{display:flex;padding:0 .875rem 0 2rem;box-shadow:inset 0 -1px var(--tui-border-normal);justify-content:space-between;align-items:center;gap:.5rem}@media screen and (max-width: 47.9625em){.t-tabs-wrapper{padding:0 .875rem 0 1rem}}.t-tabs{flex-grow:1;box-shadow:none}.t-code-editor{flex-shrink:0;block-size:auto}@media screen and (max-width: 47.9625em){.t-code-editor{font-size:0;inline-size:1.5rem}}.t-demo{position:relative;padding:2rem;max-inline-size:100%;box-sizing:border-box;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (-webkit-min-device-pixel-ratio: 0),all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{inline-size:1rem;block-size: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-background-neutral-1-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-background-neutral-1-pressed)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-tertiary)}}@media screen and (max-width: 47.9625em){.t-demo{padding:1rem}}:host:not(._fullsize) .t-demo{inline-size:-webkit-min-content;inline-size:min-content;min-inline-size:21rem}tui-doc-code{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiDocCode, selector: "tui-doc-code", inputs: ["filename", "code"] }, { kind: "pipe", type: TuiDocExampleGetTabsPipe, name: "tuiDocExampleGetTabs" }, { kind: "component", type: TuiFullscreen, selector: "[tuiFullscreen]", inputs: ["tuiFullscreenOptions", "tuiFullscreen"], outputs: ["tuiFullscreenChange"] }, { kind: "directive", type: TuiLet, selector: "[tuiLet]", inputs: ["tuiLet"] }, { kind: "directive", type: TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "pipe", type: TuiMapperPipe, name: "tuiMapper" }, { kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: i2$1.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "component", type: i2$1.TuiTabsWithMore, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["size", "moreContent", "dropdownContent", "underline", "itemsLimit", "activeItemIndex"], outputs: ["activeItemIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocExample, isStandalone: true, selector: "tui-doc-example", inputs: { id: "id", heading: "heading", description: "description", fullsize: "fullsize", componentName: "componentName", content: "content", component: "component" }, host: { properties: { "attr.id": "id", "class._fullsize": "fullsize" } }, ngImport: i0, template: "<div class=\"t-title-block\">\n    <h2\n        *ngIf=\"heading\"\n        class=\"t-title\"\n    >\n        <span\n            *polymorpheusOutlet=\"heading as text\"\n            [textContent]=\"text\"\n        ></span>\n    </h2>\n    <a\n        *ngIf=\"id\"\n        routerLink=\".\"\n        routerLinkActive=\"t-link-active\"\n        tuiLink\n        type=\"button\"\n        class=\"t-link\"\n        [attr.title]=\"copy()\"\n        [fragment]=\"id\"\n        [relativeTo]=\"route.firstChild ?? route\"\n        [routerLinkActiveOptions]=\"{matrixParams: 'exact', queryParams: 'exact', paths: 'exact', fragment: 'exact'}\"\n        (click)=\"copyExampleLink($event.currentTarget)\"\n    >\n        #\n    </a>\n</div>\n<h3\n    *ngIf=\"description\"\n    class=\"t-description\"\n>\n    <ng-container *polymorpheusOutlet=\"description as text\">\n        {{ text }}\n    </ng-container>\n</h3>\n\n<div\n    class=\"t-example\"\n    [(tuiFullscreen)]=\"fullscreen\"\n>\n    <ng-container *ngIf=\"processor() | 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                        type=\"button\"\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=\"processor() | tuiMapper: visible\"\n                size=\"xs\"\n                class=\"t-code-editor\"\n                [overlay]=\"true\"\n                [showLoader]=\"loading()\"\n                (click)=\"edit(processor())\"\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\n            <button\n                *ngIf=\"fullscreenEnabled\"\n                appearance=\"flat\"\n                size=\"xs\"\n                tuiIconButton\n                type=\"button\"\n                [iconStart]=\"fullscreen ? icons.shrink : icons.expand\"\n                (click)=\"fullscreen = !fullscreen\"\n            >\n                Fullscreen\n            </button>\n        </div>\n\n        <div\n            *ngFor=\"let tab of tabs; let index = index\"\n            class=\"t-content\"\n        >\n            <section\n                *ngIf=\"index === defaultTabIndex\"\n                automation-id=\"tui-doc-example\"\n                class=\"t-demo\"\n                [style.display]=\"activeItemIndex === index && index === defaultTabIndex ? 'block' : 'none'\"\n            >\n                <ng-content />\n                <ng-container *polymorpheusOutlet=\"lazyComponent() as text\">\n                    {{ text }}\n                </ng-container>\n            </section>\n\n            <tui-doc-code\n                *tuiLet=\"processor()[tabs[index] || 0] || '' as code\"\n                [code]=\"code\"\n                [style.display]=\"activeItemIndex === index && index !== defaultTabIndex ? 'block' : 'none'\"\n            >\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        </div>\n    </ng-container>\n</div>\n", styles: [":host{position:relative;display:block;padding-block-start:3.5rem;clear:inline-end}:host:target{animation:1s tuiShaking}@media screen and (max-width: 47.9625em){:host{padding-block-start:2rem}}.t-title-block{display:flex;flex-direction:row-reverse}.t-title{font:var(--tui-font-heading-5);margin:0 auto .5rem 0}@media screen and (max-width: 47.9625em){.t-title{font:var(--tui-font-heading-6)}}.t-title:hover+.t-link{opacity:1}.t-link{font:var(--tui-font-heading-6);padding-inline-end:.1rem}@media not screen and (max-width: 47.9625em){.t-link{font:var(--tui-font-heading-5);margin-inline-start:-1.6rem}.t-link:not(:hover,:focus-visible):not(.t-link-active){opacity:0}}.t-description{font:var(--tui-font-text-m);font-weight:400;margin:0}.t-title:first-letter,.t-description:first-letter{text-transform:capitalize}.t-example{position:relative;margin-block-start:1.5rem;border:1px solid var(--tui-border-normal);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem #0000001a;overflow:hidden}@media screen and (max-width: 47.9625em){.t-example{margin-block-start:.75rem}}.t-tabs-wrapper{display:flex;padding:0 .875rem 0 2rem;box-shadow:inset 0 -1px var(--tui-border-normal);justify-content:space-between;align-items:center;gap:.5rem}@media screen and (max-width: 47.9625em){.t-tabs-wrapper{padding:0 .875rem 0 1rem}}.t-tabs{flex-grow:1;box-shadow:none}.t-code-editor{flex-shrink:0;block-size:auto}@media screen and (max-width: 47.9625em){.t-code-editor{font-size:0;inline-size:1.5rem}}.t-demo{position:relative;padding:2rem;max-inline-size:100%;box-sizing:border-box;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (-webkit-min-device-pixel-ratio: 0),all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{inline-size:1rem;block-size: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-background-neutral-1-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-background-neutral-1-pressed)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-tertiary)}}@media screen and (max-width: 47.9625em){.t-demo{padding:1rem}}:host:not(._fullsize) .t-demo{inline-size:-webkit-min-content;inline-size:min-content;min-inline-size:21rem}tui-doc-code{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiDocCode, selector: "tui-doc-code", inputs: ["filename", "code"] }, { kind: "pipe", type: TuiDocExampleGetTabsPipe, name: "tuiDocExampleGetTabs" }, { kind: "component", type: TuiFullscreen, selector: "[tuiFullscreen]", inputs: ["tuiFullscreenOptions", "tuiFullscreen"], outputs: ["tuiFullscreenChange"] }, { kind: "directive", type: TuiLet, selector: "[tuiLet]", inputs: ["tuiLet"] }, { kind: "directive", type: TuiLink, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo"] }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }, { kind: "pipe", type: TuiMapperPipe, name: "tuiMapper" }, { kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: i2$1.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "component", type: i2$1.TuiTabsWithMore, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["size", "moreContent", "dropdownContent", "underline", "itemsLimit", "activeItemIndex"], outputs: ["activeItemIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocExample, decorators: [{
             type: Component,
@@ -888,7 +889,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[attr.id]': 'id',
                         '[class._fullsize]': 'fullsize',
-                    }, template: "<div class=\"t-title-block\">\n    <h2\n        *ngIf=\"heading\"\n        class=\"t-title\"\n    >\n        <span\n            *polymorpheusOutlet=\"heading as text\"\n            [textContent]=\"text\"\n        ></span>\n    </h2>\n    <a\n        *ngIf=\"id\"\n        routerLink=\".\"\n        routerLinkActive=\"t-link-active\"\n        tuiLink\n        type=\"button\"\n        class=\"t-link\"\n        [attr.title]=\"copy()\"\n        [fragment]=\"id\"\n        [relativeTo]=\"route.firstChild ?? route\"\n        [routerLinkActiveOptions]=\"{matrixParams: 'exact', queryParams: 'exact', paths: 'exact', fragment: 'exact'}\"\n        (click)=\"copyExampleLink($event.currentTarget)\"\n    >\n        #\n    </a>\n</div>\n<h3\n    *ngIf=\"description\"\n    class=\"t-description\"\n>\n    <ng-container *polymorpheusOutlet=\"description as text\">\n        {{ text }}\n    </ng-container>\n</h3>\n\n<div\n    class=\"t-example\"\n    [(tuiFullscreen)]=\"fullscreen\"\n>\n    <ng-container *ngIf=\"processor() | 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                        type=\"button\"\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=\"processor() | tuiMapper: visible\"\n                size=\"xs\"\n                class=\"t-code-editor\"\n                [overlay]=\"true\"\n                [showLoader]=\"loading()\"\n                (click)=\"edit(processor())\"\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\n            <button\n                *ngIf=\"fullscreenEnabled\"\n                appearance=\"flat\"\n                size=\"xs\"\n                tuiIconButton\n                type=\"button\"\n                [iconStart]=\"fullscreen ? icons.shrink : icons.expand\"\n                (click)=\"fullscreen = !fullscreen\"\n            >\n                Fullscreen\n            </button>\n        </div>\n\n        <div\n            *ngFor=\"let tab of tabs; let index = index\"\n            class=\"t-content\"\n        >\n            <section\n                *ngIf=\"index === defaultTabIndex\"\n                automation-id=\"tui-doc-example\"\n                class=\"t-demo\"\n                [style.display]=\"activeItemIndex === index && index === defaultTabIndex ? 'block' : 'none'\"\n            >\n                <ng-content />\n                <ng-container *polymorpheusOutlet=\"lazyComponent() as text\">\n                    {{ text }}\n                </ng-container>\n            </section>\n\n            <tui-doc-code\n                *tuiLet=\"processor()[tabs[index] || 0] || '' as code\"\n                [code]=\"code\"\n                [style.display]=\"activeItemIndex === index && index !== defaultTabIndex ? 'block' : 'none'\"\n            >\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        </div>\n    </ng-container>\n</div>\n", styles: [":host{position:relative;display:block;padding-block-start:3.5rem;clear:inline-end}:host:target{animation:1s tuiShaking}@media screen and (max-width: 47.9625em){:host{padding-block-start:2rem}}.t-title-block{display:flex;flex-direction:row-reverse}.t-title{font:var(--tui-font-heading-5);margin:0 auto .5rem 0}@media screen and (max-width: 47.9625em){.t-title{font:var(--tui-font-heading-6)}}.t-title:hover+.t-link{opacity:1}.t-link{font:var(--tui-font-heading-6);padding-inline-end:.1rem}@media not screen and (max-width: 47.9625em){.t-link{font:var(--tui-font-heading-5);margin-inline-start:-1.6rem}.t-link:not(:hover):not(.t-link-active){opacity:0}}.t-description{font:var(--tui-font-text-m);font-weight:400;margin:0}.t-title:first-letter,.t-description:first-letter{text-transform:capitalize}.t-example{position:relative;margin-block-start:1.5rem;border:1px solid var(--tui-border-normal);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem #0000001a;overflow:hidden}@media screen and (max-width: 47.9625em){.t-example{margin-block-start:.75rem}}.t-tabs-wrapper{display:flex;padding:0 .875rem 0 2rem;box-shadow:inset 0 -1px var(--tui-border-normal);justify-content:space-between;align-items:center;gap:.5rem}@media screen and (max-width: 47.9625em){.t-tabs-wrapper{padding:0 .875rem 0 1rem}}.t-tabs{flex-grow:1;box-shadow:none}.t-code-editor{flex-shrink:0;block-size:auto}@media screen and (max-width: 47.9625em){.t-code-editor{font-size:0;inline-size:1.5rem}}.t-demo{position:relative;padding:2rem;max-inline-size:100%;box-sizing:border-box;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (-webkit-min-device-pixel-ratio: 0),all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{inline-size:1rem;block-size: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-background-neutral-1-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-background-neutral-1-pressed)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-tertiary)}}@media screen and (max-width: 47.9625em){.t-demo{padding:1rem}}:host:not(._fullsize) .t-demo{inline-size:-webkit-min-content;inline-size:min-content;min-inline-size:21rem}tui-doc-code{overflow:hidden}\n"] }]
+                    }, template: "<div class=\"t-title-block\">\n    <h2\n        *ngIf=\"heading\"\n        class=\"t-title\"\n    >\n        <span\n            *polymorpheusOutlet=\"heading as text\"\n            [textContent]=\"text\"\n        ></span>\n    </h2>\n    <a\n        *ngIf=\"id\"\n        routerLink=\".\"\n        routerLinkActive=\"t-link-active\"\n        tuiLink\n        type=\"button\"\n        class=\"t-link\"\n        [attr.title]=\"copy()\"\n        [fragment]=\"id\"\n        [relativeTo]=\"route.firstChild ?? route\"\n        [routerLinkActiveOptions]=\"{matrixParams: 'exact', queryParams: 'exact', paths: 'exact', fragment: 'exact'}\"\n        (click)=\"copyExampleLink($event.currentTarget)\"\n    >\n        #\n    </a>\n</div>\n<h3\n    *ngIf=\"description\"\n    class=\"t-description\"\n>\n    <ng-container *polymorpheusOutlet=\"description as text\">\n        {{ text }}\n    </ng-container>\n</h3>\n\n<div\n    class=\"t-example\"\n    [(tuiFullscreen)]=\"fullscreen\"\n>\n    <ng-container *ngIf=\"processor() | 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                        type=\"button\"\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=\"processor() | tuiMapper: visible\"\n                size=\"xs\"\n                class=\"t-code-editor\"\n                [overlay]=\"true\"\n                [showLoader]=\"loading()\"\n                (click)=\"edit(processor())\"\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\n            <button\n                *ngIf=\"fullscreenEnabled\"\n                appearance=\"flat\"\n                size=\"xs\"\n                tuiIconButton\n                type=\"button\"\n                [iconStart]=\"fullscreen ? icons.shrink : icons.expand\"\n                (click)=\"fullscreen = !fullscreen\"\n            >\n                Fullscreen\n            </button>\n        </div>\n\n        <div\n            *ngFor=\"let tab of tabs; let index = index\"\n            class=\"t-content\"\n        >\n            <section\n                *ngIf=\"index === defaultTabIndex\"\n                automation-id=\"tui-doc-example\"\n                class=\"t-demo\"\n                [style.display]=\"activeItemIndex === index && index === defaultTabIndex ? 'block' : 'none'\"\n            >\n                <ng-content />\n                <ng-container *polymorpheusOutlet=\"lazyComponent() as text\">\n                    {{ text }}\n                </ng-container>\n            </section>\n\n            <tui-doc-code\n                *tuiLet=\"processor()[tabs[index] || 0] || '' as code\"\n                [code]=\"code\"\n                [style.display]=\"activeItemIndex === index && index !== defaultTabIndex ? 'block' : 'none'\"\n            >\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        </div>\n    </ng-container>\n</div>\n", styles: [":host{position:relative;display:block;padding-block-start:3.5rem;clear:inline-end}:host:target{animation:1s tuiShaking}@media screen and (max-width: 47.9625em){:host{padding-block-start:2rem}}.t-title-block{display:flex;flex-direction:row-reverse}.t-title{font:var(--tui-font-heading-5);margin:0 auto .5rem 0}@media screen and (max-width: 47.9625em){.t-title{font:var(--tui-font-heading-6)}}.t-title:hover+.t-link{opacity:1}.t-link{font:var(--tui-font-heading-6);padding-inline-end:.1rem}@media not screen and (max-width: 47.9625em){.t-link{font:var(--tui-font-heading-5);margin-inline-start:-1.6rem}.t-link:not(:hover,:focus-visible):not(.t-link-active){opacity:0}}.t-description{font:var(--tui-font-text-m);font-weight:400;margin:0}.t-title:first-letter,.t-description:first-letter{text-transform:capitalize}.t-example{position:relative;margin-block-start:1.5rem;border:1px solid var(--tui-border-normal);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem #0000001a;overflow:hidden}@media screen and (max-width: 47.9625em){.t-example{margin-block-start:.75rem}}.t-tabs-wrapper{display:flex;padding:0 .875rem 0 2rem;box-shadow:inset 0 -1px var(--tui-border-normal);justify-content:space-between;align-items:center;gap:.5rem}@media screen and (max-width: 47.9625em){.t-tabs-wrapper{padding:0 .875rem 0 1rem}}.t-tabs{flex-grow:1;box-shadow:none}.t-code-editor{flex-shrink:0;block-size:auto}@media screen and (max-width: 47.9625em){.t-code-editor{font-size:0;inline-size:1.5rem}}.t-demo{position:relative;padding:2rem;max-inline-size:100%;box-sizing:border-box;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (-webkit-min-device-pixel-ratio: 0),all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{inline-size:1rem;block-size: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-background-neutral-1-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-background-neutral-1-pressed)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-tertiary)}}@media screen and (max-width: 47.9625em){.t-demo{padding:1rem}}:host:not(._fullsize) .t-demo{inline-size:-webkit-min-content;inline-size:min-content;min-inline-size:21rem}tui-doc-code{overflow:hidden}\n"] }]
         }], propDecorators: { id: [{
                 type: Input
             }], heading: [{
@@ -1320,7 +1321,7 @@ class TuiDocMain {
         this.doc.documentElement.setAttribute('dir', dir === 'ltr' ? 'rtl' : 'ltr');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocMain, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocMain, isStandalone: true, selector: "tui-doc-main", ngImport: i0, template: "<tui-root [attr.tuiTheme]=\"theme()\">\n    <div class=\"tui-doc-page\">\n        <tui-doc-navigation class=\"tui-doc-navigation\">\n            <ng-content select=\"tuiDocNavigation\" />\n        </tui-doc-navigation>\n        <div class=\"tui-doc-content\">\n            <router-outlet class=\"tui-doc-outlet\" />\n        </div>\n    </div>\n    <header tuiDocHeader>\n        <ng-content select=\"tuiDocHeader\" />\n\n        <button\n            *ngIf=\"dir\"\n            appearance=\"outline\"\n            aria-label=\"Switch directionality of the element's text\"\n            iconEnd=\"@tui.a-large-small\"\n            size=\"s\"\n            tuiButton\n            type=\"button\"\n            class=\"tui-doc-switch-direction\"\n            (click)=\"changeTextDirection()\"\n        >\n            <tui-icon icon=\"@tui.arrow-right-left\" />\n        </button>\n\n        <button\n            appearance=\"secondary\"\n            aria-label=\"Switch between dark and light mode\"\n            size=\"s\"\n            tuiIconButton\n            type=\"button\"\n            class=\"tui-doc-dark-mode-switch\"\n            [iconStart]=\"icon()\"\n            [style.border-radius.%]=\"100\"\n            (click)=\"darkMode.set(!darkMode())\"\n        ></button>\n    </header>\n    <ng-container ngProjectAs=\"tuiOverContent\">\n        <ng-content select=\"tuiOverContent\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDialogs\">\n        <ng-content select=\"tuiOverDialogs\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverAlerts\">\n        <ng-content select=\"tuiOverAlerts\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDropdowns\">\n        <ng-content select=\"tuiOverDropdowns\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverHints\">\n        <ng-content select=\"tuiOverHints\" />\n    </ng-container>\n</tui-root>\n", styles: ["@keyframes tuiShaking{0%,to{transform:translateZ(0)}10%,30%,50%,70%,90%{transform:translate3d(-.3125rem,0,0)}20%,40%,60%,80%{transform:translate3d(.3125rem,0,0)}}html,body{scroll-padding-top:4rem;background:var(--tui-background-base)}tui-root>tui-scroll-controls>.t-bar_vertical{top:4rem!important}tui-doc-main{display:block}code:not(pre code):not(.hljs):not([class*=language-]){transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:inline-flex;background:var(--tui-background-neutral-1);color:var(--tui-text-secondary);vertical-align:middle;align-items:center;border-radius:.25rem;font-weight:500;outline:1px solid var(--tui-border-hover);font-size:.75rem;padding:0 .3125rem;margin:.125rem .1875rem;text-wrap:wrap}a code:not(pre code):not(.hljs):not([class*=language-]){color:var(--tui-text-action)}button:focus code,a:focus code{background:var(--tui-background-base)}.tui-doc-page{isolation:isolate;padding-block-start:4rem}tui-doc-navigation.tui-doc-navigation{position:fixed;top:4rem;bottom:0;inline-size:16.25rem;border-inline-end:1px solid var(--tui-border-normal)}@media screen and (max-width: 47.9625em){tui-doc-navigation.tui-doc-navigation{display:none}}.tui-doc-content{margin-inline-start:16.25rem}@media screen and (max-width: 47.9625em){.tui-doc-content{margin-inline-start:0}}.tui-doc-outlet+*{display:block}.tui-doc-switch-direction,.tui-doc-dark-mode-switch{margin-inline-start:1rem}tui-doc-code .hljs-tag{background:none}tui-doc-code .hljs{display:block;overflow-x:auto;padding:.5em;color:var(--tui-text-primary);background-color:var(--tui-background-neutral-1)}tui-doc-code .hljs.hljs-line-numbers{background:transparent}tui-doc-code .hljs-subst,tui-doc-code .hljs-title{font-weight:400;color:var(--tui-text-primary)}tui-doc-code .hljs-property{color:#bd65a4}tui-doc-code .hljs-comment,tui-doc-code .hljs-quote{color:var(--tui-text-secondary);font-style:italic}tui-doc-code .hljs-meta{color:#e38162}tui-doc-code .hljs-section,tui-doc-code .hljs-name,tui-doc-code .hljs-literal,tui-doc-code .hljs-keyword,tui-doc-code .hljs-selector-tag,tui-doc-code .hljs-type,tui-doc-code .hljs-selector-id,tui-doc-code .hljs-selector-class{font-weight:700;color:var(--tui-text-action)}tui-doc-code .hljs-attr{color:var(--tui-text-action)}tui-doc-code .hljs-attribute,tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link,tui-doc-code .hljs-built_in{font-weight:700;color:#b8474e}tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link{font-weight:400}tui-doc-code .hljs-string{color:var(--tui-status-positive);font-weight:700}tui-doc-code .hljs-symbol,tui-doc-code .hljs-bullet,tui-doc-code .hljs-formula{color:var(--tui-text-primary);background:var(--tui-background-base-alt);font-style:italic}tui-doc-code .hljs-doctag{text-decoration:underline}tui-doc-code .hljs-variable,tui-doc-code .hljs-template-variable{color:var(--tui-text-action-hover)}tui-doc-code .hljs-addition{background:var(--tui-status-positive-pale)}tui-doc-code .hljs-deletion{background:var(--tui-status-negative-pale)}tui-doc-code .hljs-emphasis{font-style:italic}tui-doc-code .hljs-strong{font-weight:700}tui-doc-code .hljs .hljs-line-numbers{padding:0}tui-doc-code .hljs-ln-numbers{vertical-align:top;opacity:.3;text-align:end;padding-inline-end:1em!important}[tuiTheme=dark] tui-doc-code .hljs-variable,tui-doc-code[tuiTheme=dark] .hljs-variable,[tuiTheme=dark] tui-doc-code .hljs-template-variable,tui-doc-code[tuiTheme=dark] .hljs-template-variable{color:var(--tui-status-warning)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiDocHeader, selector: "header[tuiDocHeader]" }, { kind: "component", type: TuiDocNavigation, selector: "tui-doc-navigation" }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: TuiRoot, selector: "tui-root" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocMain, isStandalone: true, selector: "tui-doc-main", ngImport: i0, template: "<tui-root [attr.tuiTheme]=\"theme()\">\n    <div class=\"tui-doc-page\">\n        <tui-doc-navigation class=\"tui-doc-navigation\">\n            <ng-content select=\"tuiDocNavigation\" />\n        </tui-doc-navigation>\n        <div class=\"tui-doc-content\">\n            <router-outlet class=\"tui-doc-outlet\" />\n        </div>\n    </div>\n    <header tuiDocHeader>\n        <ng-content select=\"tuiDocHeader\" />\n\n        <button\n            *ngIf=\"dir && icons.ltr\"\n            appearance=\"outline\"\n            aria-label=\"Switch directionality of the element's text\"\n            size=\"s\"\n            tuiButton\n            type=\"button\"\n            class=\"tui-doc-switch-direction\"\n            [iconEnd]=\"icons.ltr.preview\"\n            (click)=\"changeTextDirection()\"\n        >\n            <tui-icon [icon]=\"icons.ltr.direction\" />\n        </button>\n\n        <button\n            appearance=\"secondary\"\n            aria-label=\"Switch between dark and light mode\"\n            size=\"s\"\n            tuiIconButton\n            type=\"button\"\n            class=\"tui-doc-dark-mode-switch\"\n            [iconStart]=\"icon()\"\n            [style.border-radius.%]=\"100\"\n            (click)=\"darkMode.set(!darkMode())\"\n        ></button>\n    </header>\n    <ng-container ngProjectAs=\"tuiOverContent\">\n        <ng-content select=\"tuiOverContent\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDialogs\">\n        <ng-content select=\"tuiOverDialogs\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverAlerts\">\n        <ng-content select=\"tuiOverAlerts\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDropdowns\">\n        <ng-content select=\"tuiOverDropdowns\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverHints\">\n        <ng-content select=\"tuiOverHints\" />\n    </ng-container>\n</tui-root>\n", styles: ["@keyframes tuiShaking{0%,to{transform:translateZ(0)}10%,30%,50%,70%,90%{transform:translate3d(-.3125rem,0,0)}20%,40%,60%,80%{transform:translate3d(.3125rem,0,0)}}html,body{scroll-padding-top:4rem;background:var(--tui-background-base)}tui-root>tui-scroll-controls>.t-bar_vertical{top:4rem!important}tui-doc-main{display:block}code:not(pre code):not(.hljs):not([class*=language-]){transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:inline-flex;background:var(--tui-background-neutral-1);color:var(--tui-text-secondary);vertical-align:middle;align-items:center;border-radius:.25rem;font-weight:500;outline:1px solid var(--tui-border-hover);font-size:.75rem;padding:0 .3125rem;margin:.125rem .1875rem;text-wrap:wrap}a code:not(pre code):not(.hljs):not([class*=language-]){color:var(--tui-text-action)}button:focus code,a:focus code{background:var(--tui-background-base)}.tui-doc-page{isolation:isolate;padding-block-start:4rem}tui-doc-navigation.tui-doc-navigation{position:fixed;top:4rem;bottom:0;inline-size:16.25rem;border-inline-end:1px solid var(--tui-border-normal)}@media screen and (max-width: 47.9625em){tui-doc-navigation.tui-doc-navigation{display:none}}.tui-doc-content{margin-inline-start:16.25rem}@media screen and (max-width: 47.9625em){.tui-doc-content{margin-inline-start:0}}.tui-doc-outlet+*{display:block}.tui-doc-switch-direction,.tui-doc-dark-mode-switch{margin-inline-start:1rem}tui-doc-code .hljs-tag{background:none}tui-doc-code .hljs{display:block;overflow-x:auto;padding:.5em;color:var(--tui-text-primary);background-color:var(--tui-background-neutral-1)}tui-doc-code .hljs.hljs-line-numbers{background:transparent}tui-doc-code .hljs-subst,tui-doc-code .hljs-title{font-weight:400;color:var(--tui-text-primary)}tui-doc-code .hljs-property{color:#bd65a4}tui-doc-code .hljs-comment,tui-doc-code .hljs-quote{color:var(--tui-text-secondary);font-style:italic}tui-doc-code .hljs-meta{color:#e38162}tui-doc-code .hljs-section,tui-doc-code .hljs-name,tui-doc-code .hljs-literal,tui-doc-code .hljs-keyword,tui-doc-code .hljs-selector-tag,tui-doc-code .hljs-type,tui-doc-code .hljs-selector-id,tui-doc-code .hljs-selector-class{font-weight:700;color:var(--tui-text-action)}tui-doc-code .hljs-attr{color:var(--tui-text-action)}tui-doc-code .hljs-attribute,tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link,tui-doc-code .hljs-built_in{font-weight:700;color:#b8474e}tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link{font-weight:400}tui-doc-code .hljs-string{color:var(--tui-status-positive);font-weight:700}tui-doc-code .hljs-symbol,tui-doc-code .hljs-bullet,tui-doc-code .hljs-formula{color:var(--tui-text-primary);background:var(--tui-background-base-alt);font-style:italic}tui-doc-code .hljs-doctag{text-decoration:underline}tui-doc-code .hljs-variable,tui-doc-code .hljs-template-variable{color:var(--tui-text-action-hover)}tui-doc-code .hljs-addition{background:var(--tui-status-positive-pale)}tui-doc-code .hljs-deletion{background:var(--tui-status-negative-pale)}tui-doc-code .hljs-emphasis{font-style:italic}tui-doc-code .hljs-strong{font-weight:700}tui-doc-code .hljs .hljs-line-numbers{padding:0}tui-doc-code .hljs-ln-numbers{vertical-align:top;opacity:.3;text-align:end;padding-inline-end:1em!important}[tuiTheme=dark] tui-doc-code .hljs-variable,tui-doc-code[tuiTheme=dark] .hljs-variable,[tuiTheme=dark] tui-doc-code .hljs-template-variable,tui-doc-code[tuiTheme=dark] .hljs-template-variable{color:var(--tui-status-warning)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: TuiDocHeader, selector: "header[tuiDocHeader]" }, { kind: "component", type: TuiDocNavigation, selector: "tui-doc-navigation" }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: TuiRoot, selector: "tui-root" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocMain, decorators: [{
             type: Component,
@@ -1332,7 +1333,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         TuiDocNavigation,
                         TuiIcon,
                         TuiRoot,
-                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, template: "<tui-root [attr.tuiTheme]=\"theme()\">\n    <div class=\"tui-doc-page\">\n        <tui-doc-navigation class=\"tui-doc-navigation\">\n            <ng-content select=\"tuiDocNavigation\" />\n        </tui-doc-navigation>\n        <div class=\"tui-doc-content\">\n            <router-outlet class=\"tui-doc-outlet\" />\n        </div>\n    </div>\n    <header tuiDocHeader>\n        <ng-content select=\"tuiDocHeader\" />\n\n        <button\n            *ngIf=\"dir\"\n            appearance=\"outline\"\n            aria-label=\"Switch directionality of the element's text\"\n            iconEnd=\"@tui.a-large-small\"\n            size=\"s\"\n            tuiButton\n            type=\"button\"\n            class=\"tui-doc-switch-direction\"\n            (click)=\"changeTextDirection()\"\n        >\n            <tui-icon icon=\"@tui.arrow-right-left\" />\n        </button>\n\n        <button\n            appearance=\"secondary\"\n            aria-label=\"Switch between dark and light mode\"\n            size=\"s\"\n            tuiIconButton\n            type=\"button\"\n            class=\"tui-doc-dark-mode-switch\"\n            [iconStart]=\"icon()\"\n            [style.border-radius.%]=\"100\"\n            (click)=\"darkMode.set(!darkMode())\"\n        ></button>\n    </header>\n    <ng-container ngProjectAs=\"tuiOverContent\">\n        <ng-content select=\"tuiOverContent\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDialogs\">\n        <ng-content select=\"tuiOverDialogs\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverAlerts\">\n        <ng-content select=\"tuiOverAlerts\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDropdowns\">\n        <ng-content select=\"tuiOverDropdowns\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverHints\">\n        <ng-content select=\"tuiOverHints\" />\n    </ng-container>\n</tui-root>\n", styles: ["@keyframes tuiShaking{0%,to{transform:translateZ(0)}10%,30%,50%,70%,90%{transform:translate3d(-.3125rem,0,0)}20%,40%,60%,80%{transform:translate3d(.3125rem,0,0)}}html,body{scroll-padding-top:4rem;background:var(--tui-background-base)}tui-root>tui-scroll-controls>.t-bar_vertical{top:4rem!important}tui-doc-main{display:block}code:not(pre code):not(.hljs):not([class*=language-]){transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:inline-flex;background:var(--tui-background-neutral-1);color:var(--tui-text-secondary);vertical-align:middle;align-items:center;border-radius:.25rem;font-weight:500;outline:1px solid var(--tui-border-hover);font-size:.75rem;padding:0 .3125rem;margin:.125rem .1875rem;text-wrap:wrap}a code:not(pre code):not(.hljs):not([class*=language-]){color:var(--tui-text-action)}button:focus code,a:focus code{background:var(--tui-background-base)}.tui-doc-page{isolation:isolate;padding-block-start:4rem}tui-doc-navigation.tui-doc-navigation{position:fixed;top:4rem;bottom:0;inline-size:16.25rem;border-inline-end:1px solid var(--tui-border-normal)}@media screen and (max-width: 47.9625em){tui-doc-navigation.tui-doc-navigation{display:none}}.tui-doc-content{margin-inline-start:16.25rem}@media screen and (max-width: 47.9625em){.tui-doc-content{margin-inline-start:0}}.tui-doc-outlet+*{display:block}.tui-doc-switch-direction,.tui-doc-dark-mode-switch{margin-inline-start:1rem}tui-doc-code .hljs-tag{background:none}tui-doc-code .hljs{display:block;overflow-x:auto;padding:.5em;color:var(--tui-text-primary);background-color:var(--tui-background-neutral-1)}tui-doc-code .hljs.hljs-line-numbers{background:transparent}tui-doc-code .hljs-subst,tui-doc-code .hljs-title{font-weight:400;color:var(--tui-text-primary)}tui-doc-code .hljs-property{color:#bd65a4}tui-doc-code .hljs-comment,tui-doc-code .hljs-quote{color:var(--tui-text-secondary);font-style:italic}tui-doc-code .hljs-meta{color:#e38162}tui-doc-code .hljs-section,tui-doc-code .hljs-name,tui-doc-code .hljs-literal,tui-doc-code .hljs-keyword,tui-doc-code .hljs-selector-tag,tui-doc-code .hljs-type,tui-doc-code .hljs-selector-id,tui-doc-code .hljs-selector-class{font-weight:700;color:var(--tui-text-action)}tui-doc-code .hljs-attr{color:var(--tui-text-action)}tui-doc-code .hljs-attribute,tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link,tui-doc-code .hljs-built_in{font-weight:700;color:#b8474e}tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link{font-weight:400}tui-doc-code .hljs-string{color:var(--tui-status-positive);font-weight:700}tui-doc-code .hljs-symbol,tui-doc-code .hljs-bullet,tui-doc-code .hljs-formula{color:var(--tui-text-primary);background:var(--tui-background-base-alt);font-style:italic}tui-doc-code .hljs-doctag{text-decoration:underline}tui-doc-code .hljs-variable,tui-doc-code .hljs-template-variable{color:var(--tui-text-action-hover)}tui-doc-code .hljs-addition{background:var(--tui-status-positive-pale)}tui-doc-code .hljs-deletion{background:var(--tui-status-negative-pale)}tui-doc-code .hljs-emphasis{font-style:italic}tui-doc-code .hljs-strong{font-weight:700}tui-doc-code .hljs .hljs-line-numbers{padding:0}tui-doc-code .hljs-ln-numbers{vertical-align:top;opacity:.3;text-align:end;padding-inline-end:1em!important}[tuiTheme=dark] tui-doc-code .hljs-variable,tui-doc-code[tuiTheme=dark] .hljs-variable,[tuiTheme=dark] tui-doc-code .hljs-template-variable,tui-doc-code[tuiTheme=dark] .hljs-template-variable{color:var(--tui-status-warning)}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, template: "<tui-root [attr.tuiTheme]=\"theme()\">\n    <div class=\"tui-doc-page\">\n        <tui-doc-navigation class=\"tui-doc-navigation\">\n            <ng-content select=\"tuiDocNavigation\" />\n        </tui-doc-navigation>\n        <div class=\"tui-doc-content\">\n            <router-outlet class=\"tui-doc-outlet\" />\n        </div>\n    </div>\n    <header tuiDocHeader>\n        <ng-content select=\"tuiDocHeader\" />\n\n        <button\n            *ngIf=\"dir && icons.ltr\"\n            appearance=\"outline\"\n            aria-label=\"Switch directionality of the element's text\"\n            size=\"s\"\n            tuiButton\n            type=\"button\"\n            class=\"tui-doc-switch-direction\"\n            [iconEnd]=\"icons.ltr.preview\"\n            (click)=\"changeTextDirection()\"\n        >\n            <tui-icon [icon]=\"icons.ltr.direction\" />\n        </button>\n\n        <button\n            appearance=\"secondary\"\n            aria-label=\"Switch between dark and light mode\"\n            size=\"s\"\n            tuiIconButton\n            type=\"button\"\n            class=\"tui-doc-dark-mode-switch\"\n            [iconStart]=\"icon()\"\n            [style.border-radius.%]=\"100\"\n            (click)=\"darkMode.set(!darkMode())\"\n        ></button>\n    </header>\n    <ng-container ngProjectAs=\"tuiOverContent\">\n        <ng-content select=\"tuiOverContent\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDialogs\">\n        <ng-content select=\"tuiOverDialogs\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverAlerts\">\n        <ng-content select=\"tuiOverAlerts\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDropdowns\">\n        <ng-content select=\"tuiOverDropdowns\" />\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverHints\">\n        <ng-content select=\"tuiOverHints\" />\n    </ng-container>\n</tui-root>\n", styles: ["@keyframes tuiShaking{0%,to{transform:translateZ(0)}10%,30%,50%,70%,90%{transform:translate3d(-.3125rem,0,0)}20%,40%,60%,80%{transform:translate3d(.3125rem,0,0)}}html,body{scroll-padding-top:4rem;background:var(--tui-background-base)}tui-root>tui-scroll-controls>.t-bar_vertical{top:4rem!important}tui-doc-main{display:block}code:not(pre code):not(.hljs):not([class*=language-]){transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:inline-flex;background:var(--tui-background-neutral-1);color:var(--tui-text-secondary);vertical-align:middle;align-items:center;border-radius:.25rem;font-weight:500;outline:1px solid var(--tui-border-hover);font-size:.75rem;padding:0 .3125rem;margin:.125rem .1875rem;text-wrap:wrap}a code:not(pre code):not(.hljs):not([class*=language-]){color:var(--tui-text-action)}button:focus code,a:focus code{background:var(--tui-background-base)}.tui-doc-page{isolation:isolate;padding-block-start:4rem}tui-doc-navigation.tui-doc-navigation{position:fixed;top:4rem;bottom:0;inline-size:16.25rem;border-inline-end:1px solid var(--tui-border-normal)}@media screen and (max-width: 47.9625em){tui-doc-navigation.tui-doc-navigation{display:none}}.tui-doc-content{margin-inline-start:16.25rem}@media screen and (max-width: 47.9625em){.tui-doc-content{margin-inline-start:0}}.tui-doc-outlet+*{display:block}.tui-doc-switch-direction,.tui-doc-dark-mode-switch{margin-inline-start:1rem}tui-doc-code .hljs-tag{background:none}tui-doc-code .hljs{display:block;overflow-x:auto;padding:.5em;color:var(--tui-text-primary);background-color:var(--tui-background-neutral-1)}tui-doc-code .hljs.hljs-line-numbers{background:transparent}tui-doc-code .hljs-subst,tui-doc-code .hljs-title{font-weight:400;color:var(--tui-text-primary)}tui-doc-code .hljs-property{color:#bd65a4}tui-doc-code .hljs-comment,tui-doc-code .hljs-quote{color:var(--tui-text-secondary);font-style:italic}tui-doc-code .hljs-meta{color:#e38162}tui-doc-code .hljs-section,tui-doc-code .hljs-name,tui-doc-code .hljs-literal,tui-doc-code .hljs-keyword,tui-doc-code .hljs-selector-tag,tui-doc-code .hljs-type,tui-doc-code .hljs-selector-id,tui-doc-code .hljs-selector-class{font-weight:700;color:var(--tui-text-action)}tui-doc-code .hljs-attr{color:var(--tui-text-action)}tui-doc-code .hljs-attribute,tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link,tui-doc-code .hljs-built_in{font-weight:700;color:#b8474e}tui-doc-code .hljs-number,tui-doc-code .hljs-regexp,tui-doc-code .hljs-link{font-weight:400}tui-doc-code .hljs-string{color:var(--tui-status-positive);font-weight:700}tui-doc-code .hljs-symbol,tui-doc-code .hljs-bullet,tui-doc-code .hljs-formula{color:var(--tui-text-primary);background:var(--tui-background-base-alt);font-style:italic}tui-doc-code .hljs-doctag{text-decoration:underline}tui-doc-code .hljs-variable,tui-doc-code .hljs-template-variable{color:var(--tui-text-action-hover)}tui-doc-code .hljs-addition{background:var(--tui-status-positive-pale)}tui-doc-code .hljs-deletion{background:var(--tui-status-negative-pale)}tui-doc-code .hljs-emphasis{font-style:italic}tui-doc-code .hljs-strong{font-weight:700}tui-doc-code .hljs .hljs-line-numbers{padding:0}tui-doc-code .hljs-ln-numbers{vertical-align:top;opacity:.3;text-align:end;padding-inline-end:1em!important}[tuiTheme=dark] tui-doc-code .hljs-variable,tui-doc-code[tuiTheme=dark] .hljs-variable,[tuiTheme=dark] tui-doc-code .hljs-template-variable,tui-doc-code[tuiTheme=dark] .hljs-template-variable{color:var(--tui-status-warning)}\n"] }]
         }] });
 
 const TUI_DOC_TABS = new InjectionToken(ngDevMode ? 'TUI_DOC_TABS' : '', {
@@ -1396,7 +1397,7 @@ class TuiDocPage {
         return !!this.seeAlso.length && this.activeItemIndex === 0;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocPage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocPage, isStandalone: true, selector: "tui-doc-page", inputs: { header: "header", package: "package", type: "type", tags: "tags", path: "path", deprecated: "deprecated" }, providers: PAGE_PROVIDERS, queries: [{ propertyName: "tabConnectors", predicate: TuiDocPageTabConnector }], ngImport: i0, template: "<header class=\"t-header\">\n    <h1 class=\"t-title\">\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;min-block-size:7.25rem;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);padding:3.75rem 0 0;box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:1.25rem 1.25rem 0;margin:0}}.t-title{min-inline-size:100%;font-size:inherit;margin:0}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"], dependencies: [{ kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: TuiAutoColorPipe, name: "tuiAutoColor" }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "component", type: TuiDocLanguageSwitcher, selector: "tui-doc-language-switcher" }, { kind: "component", type: TuiDocSeeAlso, selector: "tui-doc-see-also", inputs: ["seeAlso"] }, { kind: "component", type: TuiDocSourceCode, selector: "tui-doc-source-code", inputs: ["header", "package", "type", "path"] }, { kind: "pipe", type: TuiReplacePipe, name: "tuiReplace" }, { kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: i2$1.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "component", type: i2$1.TuiTabsWithMore, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["size", "moreContent", "dropdownContent", "underline", "itemsLimit", "activeItemIndex"], outputs: ["activeItemIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiDocPage, isStandalone: true, selector: "tui-doc-page", inputs: { header: "header", package: "package", type: "type", tags: "tags", path: "path", deprecated: "deprecated" }, providers: PAGE_PROVIDERS, queries: [{ propertyName: "tabConnectors", predicate: TuiDocPageTabConnector }], ngImport: i0, template: "<header class=\"t-header\">\n    <h1\n        *ngIf=\"header\"\n        class=\"t-title\"\n    >\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:0 1.25rem;margin:0}}.t-title{min-inline-size:100%;padding:3.75rem 0 0;font-size:inherit;margin:0}@media screen and (max-width: 47.9625em){.t-title{padding:1.25rem 0 0}}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"], dependencies: [{ kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: TuiAutoColorPipe, name: "tuiAutoColor" }, { kind: "directive", type: TuiChip, selector: "tui-chip,[tuiChip]", inputs: ["size"] }, { kind: "component", type: TuiDocLanguageSwitcher, selector: "tui-doc-language-switcher" }, { kind: "component", type: TuiDocSeeAlso, selector: "tui-doc-see-also", inputs: ["seeAlso"] }, { kind: "component", type: TuiDocSourceCode, selector: "tui-doc-source-code", inputs: ["header", "package", "type", "path"] }, { kind: "pipe", type: TuiReplacePipe, name: "tuiReplace" }, { kind: "directive", type: i1$2.TuiItem, selector: "[tuiItem]" }, { kind: "directive", type: i2$1.TuiTab, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { kind: "component", type: i2$1.TuiTabsWithMore, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["size", "moreContent", "dropdownContent", "underline", "itemsLimit", "activeItemIndex"], outputs: ["activeItemIndexChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiDocPage, decorators: [{
             type: Component,
@@ -1415,7 +1416,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         TuiDocSourceCode,
                         TuiReplacePipe,
                         TuiTabs,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: PAGE_PROVIDERS, template: "<header class=\"t-header\">\n    <h1 class=\"t-title\">\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;min-block-size:7.25rem;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);padding:3.75rem 0 0;box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:1.25rem 1.25rem 0;margin:0}}.t-title{min-inline-size:100%;font-size:inherit;margin:0}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: PAGE_PROVIDERS, template: "<header class=\"t-header\">\n    <h1\n        *ngIf=\"header\"\n        class=\"t-title\"\n    >\n        {{ header }}\n        <tui-chip\n            *ngIf=\"!!deprecated || deprecated === ''\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_deprecated\"\n        >\n            deprecated\n        </tui-chip>\n        <tui-chip\n            *ngIf=\"package\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"package | tuiAutoColor\"\n        >\n            {{ package }}\n        </tui-chip>\n        <tui-chip\n            *ngFor=\"let tag of tags\"\n            appearance=\"custom\"\n            size=\"xs\"\n            class=\"t-tag t-tag_package\"\n            [style.background]=\"tag | tuiAutoColor\"\n        >\n            {{ tag }}\n        </tui-chip>\n    </h1>\n    <tui-tabs-with-more\n        *ngIf=\"tabConnectors.length\"\n        class=\"t-tabs\"\n        [(activeItemIndex)]=\"activeItemIndex\"\n    >\n        <ng-container *ngFor=\"let tab of tabConnectors; first as first; index as index\">\n            <ng-container *ngIf=\"tab.pageTab || defaultTabs[index] as tabName\">\n                <a\n                    *tuiItem\n                    routerLinkActive\n                    tuiTab\n                    [routerLink]=\"first ? './' : (tabName | tuiReplace: from : to)\"\n                    [routerLinkActiveOptions]=\"{exact: first}\"\n                >\n                    {{ tabName }}\n                </a>\n            </ng-container>\n        </ng-container>\n        <ng-container *ngFor=\"let tab of tabs | keyvalue\">\n            <a\n                *tuiItem\n                routerLinkActive\n                tuiTab\n                [routerLink]=\"tab.key\"\n            >\n                {{ tab.key }}\n            </a>\n        </ng-container>\n    </tui-tabs-with-more>\n\n    <div\n        *ngIf=\"package || path || type\"\n        class=\"t-right-side\"\n    >\n        <tui-doc-source-code\n            class=\"t-source-code\"\n            [header]=\"header\"\n            [package]=\"package\"\n            [path]=\"path\"\n            [type]=\"type\"\n        />\n\n        <tui-doc-language-switcher *ngIf=\"supportLanguage.has(header)\" />\n    </div>\n</header>\n<div class=\"t-content\">\n    <ng-content />\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    />\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        />\n    </ng-container>\n    <ng-container *ngFor=\"let tab of tabs | keyvalue; index as index\">\n        <ng-container *ngIf=\"index + tabConnectors.length === activeItemIndex\">\n            <ng-container *polymorpheusOutlet=\"tab.value as text\">{{ text }}</ng-container>\n        </ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-block-size:0;flex-basis:0;flex-grow:1;font:var(--tui-font-text-m)}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;color:var(--tui-text-primary);box-shadow:inset 0 -1px 0 0 var(--tui-border-normal);box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-header{font:var(--tui-font-heading-4);min-block-size:4.5rem;padding:0 1.25rem;margin:0}}.t-title{min-inline-size:100%;padding:3.75rem 0 0;font-size:inherit;margin:0}@media screen and (max-width: 47.9625em){.t-title{padding:1.25rem 0 0}}.t-tag{vertical-align:middle;text-transform:uppercase;margin-inline-end:.5rem}.t-tag_deprecated{background-color:var(--tui-status-negative);color:#fff}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0;box-shadow:none}@media screen and (max-width: 47.9625em){.t-tabs{margin-block-start:.25rem}}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}@media screen and (max-width: 47.9625em){.t-content{padding:2rem 1.25rem;margin:0}}.t-see-also{min-inline-size:18.75rem;inline-size:30%;float:inline-end;margin:0 0 1rem;margin-inline-start:1.5rem}@media screen and (max-width: 47.9625em){.t-see-also{float:none;inline-size:100%;margin:0 0 1.5rem}}.t-right-side{display:flex;gap:1rem;align-items:center;align-self:center;margin-inline-start:auto}.t-source-code{block-size:3.125rem}\n"] }]
         }], propDecorators: { header: [{
                 type: Input
             }], package: [{