@taiga-ui/addon-doc 2.61.0 → 3.0.0-rc.2

package/bundles/taiga-ui-addon-doc.umd.js

@@ -1,267 +1,385 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('rxjs/operators'), require('markdown-it'), require('@angular/common'), require('ngx-highlightjs'), require('@taiga-ui/cdk'), require('@taiga-ui/kit'), require('@taiga-ui/core'), require('@angular/forms'), require('@angular/router'), require('@angular/animations'), require('@angular/cdk/clipboard'), require('@ng-web-apis/common'), require('@tinkoff/ng-polymorpheus'), require('@taiga-ui/i18n'), require('@taiga-ui/addon-mobile'), require('@angular/platform-browser')) :
-    typeof define === 'function' && define.amd ? define('@taiga-ui/addon-doc', ['exports', '@angular/core', 'rxjs', 'rxjs/operators', 'markdown-it', '@angular/common', 'ngx-highlightjs', '@taiga-ui/cdk', '@taiga-ui/kit', '@taiga-ui/core', '@angular/forms', '@angular/router', '@angular/animations', '@angular/cdk/clipboard', '@ng-web-apis/common', '@tinkoff/ng-polymorpheus', '@taiga-ui/i18n', '@taiga-ui/addon-mobile', '@angular/platform-browser'], factory) :
-    (global = global || self, factory((global['taiga-ui'] = global['taiga-ui'] || {}, global['taiga-ui']['addon-doc'] = {}), global.ng.core, global.rxjs, global.rxjs.operators, global.MarkdownIt, global.ng.common, global.ngxHighlightjs, global.cdk, global.kit, global.core$1, global.ng.forms, global.ng.router, global.ng.animations, global.ng.cdk.clipboard, global.common$1, global.ngPolymorpheus, global.i18n, global.addonMobile, global.ng.platformBrowser));
-}(this, (function (exports, core, rxjs, operators, MarkdownIt, common, ngxHighlightjs, cdk, kit, core$1, forms, router, animations, clipboard, common$1, ngPolymorpheus, i18n, addonMobile, platformBrowser) { 'use strict';
-
-    MarkdownIt = MarkdownIt && Object.prototype.hasOwnProperty.call(MarkdownIt, 'default') ? MarkdownIt['default'] : MarkdownIt;
-
-    /******************************************************************************
-    Copyright (c) Microsoft Corporation.
-
-    Permission to use, copy, modify, and/or distribute this software for any
-    purpose with or without fee is hereby granted.
-
-    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-    PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */
-    /* global Reflect, Promise */
-
-    var extendStatics = function(d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-
-    function __extends(d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    }
-
-    var __assign = function() {
-        __assign = Object.assign || function __assign(t) {
-            for (var s, i = 1, n = arguments.length; i < n; i++) {
-                s = arguments[i];
-                for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-            }
-            return t;
-        };
-        return __assign.apply(this, arguments);
-    };
-
-    function __rest(s, e) {
-        var t = {};
-        for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-            t[p] = s[p];
-        if (s != null && typeof Object.getOwnPropertySymbols === "function")
-            for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-                if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                    t[p[i]] = s[p[i]];
-            }
-        return t;
-    }
-
-    function __decorate(decorators, target, key, desc) {
-        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-        if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-        else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-        return c > 3 && r && Object.defineProperty(target, key, r), r;
-    }
-
-    function __param(paramIndex, decorator) {
-        return function (target, key) { decorator(target, key, paramIndex); }
-    }
-
-    function __metadata(metadataKey, metadataValue) {
-        if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
-    }
-
-    function __awaiter(thisArg, _arguments, P, generator) {
-        function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-        return new (P || (P = Promise))(function (resolve, reject) {
-            function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-            function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-            function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-            step((generator = generator.apply(thisArg, _arguments || [])).next());
-        });
-    }
-
-    function __generator(thisArg, body) {
-        var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-        return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-        function verb(n) { return function (v) { return step([n, v]); }; }
-        function step(op) {
-            if (f) throw new TypeError("Generator is already executing.");
-            while (_) try {
-                if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-                if (y = 0, t) op = [op[0] & 2, t.value];
-                switch (op[0]) {
-                    case 0: case 1: t = op; break;
-                    case 4: _.label++; return { value: op[1], done: false };
-                    case 5: _.label++; y = op[1]; op = [0]; continue;
-                    case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                    default:
-                        if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                        if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                        if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                        if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                        if (t[2]) _.ops.pop();
-                        _.trys.pop(); continue;
-                }
-                op = body.call(thisArg, _);
-            } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-            if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-        }
-    }
-
-    var __createBinding = Object.create ? (function(o, m, k, k2) {
-        if (k2 === undefined) k2 = k;
-        var desc = Object.getOwnPropertyDescriptor(m, k);
-        if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-            desc = { enumerable: true, get: function() { return m[k]; } };
-        }
-        Object.defineProperty(o, k2, desc);
-    }) : (function(o, m, k, k2) {
-        if (k2 === undefined) k2 = k;
-        o[k2] = m[k];
-    });
-
-    function __exportStar(m, o) {
-        for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);
-    }
-
-    function __values(o) {
-        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-        if (m) return m.call(o);
-        if (o && typeof o.length === "number") return {
-            next: function () {
-                if (o && i >= o.length) o = void 0;
-                return { value: o && o[i++], done: !o };
-            }
-        };
-        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-    }
-
-    function __read(o, n) {
-        var m = typeof Symbol === "function" && o[Symbol.iterator];
-        if (!m) return o;
-        var i = m.call(o), r, ar = [], e;
-        try {
-            while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-        }
-        catch (error) { e = { error: error }; }
-        finally {
-            try {
-                if (r && !r.done && (m = i["return"])) m.call(i);
-            }
-            finally { if (e) throw e.error; }
-        }
-        return ar;
-    }
-
-    /** @deprecated */
-    function __spread() {
-        for (var ar = [], i = 0; i < arguments.length; i++)
-            ar = ar.concat(__read(arguments[i]));
-        return ar;
-    }
-
-    /** @deprecated */
-    function __spreadArrays() {
-        for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
-        for (var r = Array(s), k = 0, i = 0; i < il; i++)
-            for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
-                r[k] = a[j];
-        return r;
-    }
-
-    function __spreadArray(to, from, pack) {
-        if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-            if (ar || !(i in from)) {
-                if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-                ar[i] = from[i];
-            }
-        }
-        return to.concat(ar || Array.prototype.slice.call(from));
-    }
-
-    function __await(v) {
-        return this instanceof __await ? (this.v = v, this) : new __await(v);
-    }
-
-    function __asyncGenerator(thisArg, _arguments, generator) {
-        if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
-        var g = generator.apply(thisArg, _arguments || []), i, q = [];
-        return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
-        function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
-        function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
-        function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
-        function fulfill(value) { resume("next", value); }
-        function reject(value) { resume("throw", value); }
-        function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
-    }
-
-    function __asyncDelegator(o) {
-        var i, p;
-        return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
-        function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
-    }
-
-    function __asyncValues(o) {
-        if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
-        var m = o[Symbol.asyncIterator], i;
-        return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
-        function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
-        function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
-    }
-
-    function __makeTemplateObject(cooked, raw) {
-        if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-        return cooked;
-    };
-
-    var __setModuleDefault = Object.create ? (function(o, v) {
-        Object.defineProperty(o, "default", { enumerable: true, value: v });
-    }) : function(o, v) {
-        o["default"] = v;
-    };
-
-    function __importStar(mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-        __setModuleDefault(result, mod);
-        return result;
-    }
-
-    function __importDefault(mod) {
-        return (mod && mod.__esModule) ? mod : { default: mod };
-    }
-
-    function __classPrivateFieldGet(receiver, state, kind, f) {
-        if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-        if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-        return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-    }
-
-    function __classPrivateFieldSet(receiver, state, value, kind, f) {
-        if (kind === "m") throw new TypeError("Private method is not writable");
-        if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
-        if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-        return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
-    }
-
-    function __classPrivateFieldIn(state, receiver) {
-        if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object");
-        return typeof state === "function" ? receiver === state : state.has(receiver);
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('rxjs/operators'), require('markdown-it'), require('@angular/common'), require('ngx-highlightjs'), require('@taiga-ui/cdk'), require('@taiga-ui/kit'), require('@taiga-ui/core'), require('@angular/forms'), require('@angular/router'), require('@angular/animations'), require('@angular/cdk/clipboard'), require('@ng-web-apis/common'), require('@tinkoff/ng-polymorpheus'), require('@taiga-ui/i18n'), require('@angular/platform-browser'), require('@taiga-ui/addon-mobile')) :
+    typeof define === 'function' && define.amd ? define('@taiga-ui/addon-doc', ['exports', '@angular/core', 'rxjs', 'rxjs/operators', 'markdown-it', '@angular/common', 'ngx-highlightjs', '@taiga-ui/cdk', '@taiga-ui/kit', '@taiga-ui/core', '@angular/forms', '@angular/router', '@angular/animations', '@angular/cdk/clipboard', '@ng-web-apis/common', '@tinkoff/ng-polymorpheus', '@taiga-ui/i18n', '@angular/platform-browser', '@taiga-ui/addon-mobile'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["taiga-ui"] = global["taiga-ui"] || {}, global["taiga-ui"]["addon-doc"] = {}), global.ng.core, global.rxjs, global.rxjs.operators, global.MarkdownIt, global.ng.common, global.i2, global.i6, global.i1, global.i2$1, global.ng.forms, global.ng.router, global.ng.animations, global.ng.cdk.clipboard, global.common, global.i6$2, global.i5$2, global.ng.platformBrowser, global.i4));
+})(this, (function (exports, i0, i9, operators, MarkdownIt, i5, i2, i6, i1, i2$1, i5$1, i6$1, animations, i8, common, i6$2, i5$2, i8$1, i4) { 'use strict';
+
+    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+    function _interopNamespace(e) {
+        if (e && e.__esModule) return e;
+        var n = Object.create(null);
+        if (e) {
+            Object.keys(e).forEach(function (k) {
+                if (k !== 'default') {
+                    var d = Object.getOwnPropertyDescriptor(e, k);
+                    Object.defineProperty(n, k, d.get ? d : {
+                        enumerable: true,
+                        get: function () { return e[k]; }
+                    });
+                }
+            });
+        }
+        n["default"] = e;
+        return Object.freeze(n);
     }
 
-    /**
-     * @deprecated: use {@link tuiRawLoad} instead
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function rawLoad(content) {
+    var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
+    var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
+    var MarkdownIt__default = /*#__PURE__*/_interopDefaultLegacy(MarkdownIt);
+    var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
+    var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
+    var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6);
+    var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
+    var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
+    var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
+    var i6__namespace = /*#__PURE__*/_interopNamespace(i6$1);
+    var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
+    var i6__namespace$2 = /*#__PURE__*/_interopNamespace(i6$2);
+    var i5__namespace$2 = /*#__PURE__*/_interopNamespace(i5$2);
+    var i8__namespace$1 = /*#__PURE__*/_interopNamespace(i8$1);
+    var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
+
+    /******************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */
+    /* global Reflect, Promise */
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b)
+                if (Object.prototype.hasOwnProperty.call(b, p))
+                    d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    function __extends(d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    }
+    var __assign = function () {
+        __assign = Object.assign || function __assign(t) {
+            for (var s, i = 1, n = arguments.length; i < n; i++) {
+                s = arguments[i];
+                for (var p in s)
+                    if (Object.prototype.hasOwnProperty.call(s, p))
+                        t[p] = s[p];
+            }
+            return t;
+        };
+        return __assign.apply(this, arguments);
+    };
+    function __rest(s, e) {
+        var t = {};
+        for (var p in s)
+            if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+                t[p] = s[p];
+        if (s != null && typeof Object.getOwnPropertySymbols === "function")
+            for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+                if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                    t[p[i]] = s[p[i]];
+            }
+        return t;
+    }
+    function __decorate(decorators, target, key, desc) {
+        var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+        if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+            r = Reflect.decorate(decorators, target, key, desc);
+        else
+            for (var i = decorators.length - 1; i >= 0; i--)
+                if (d = decorators[i])
+                    r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+        return c > 3 && r && Object.defineProperty(target, key, r), r;
+    }
+    function __param(paramIndex, decorator) {
+        return function (target, key) { decorator(target, key, paramIndex); };
+    }
+    function __metadata(metadataKey, metadataValue) {
+        if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
+            return Reflect.metadata(metadataKey, metadataValue);
+    }
+    function __awaiter(thisArg, _arguments, P, generator) {
+        function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+        return new (P || (P = Promise))(function (resolve, reject) {
+            function fulfilled(value) { try {
+                step(generator.next(value));
+            }
+            catch (e) {
+                reject(e);
+            } }
+            function rejected(value) { try {
+                step(generator["throw"](value));
+            }
+            catch (e) {
+                reject(e);
+            } }
+            function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+            step((generator = generator.apply(thisArg, _arguments || [])).next());
+        });
+    }
+    function __generator(thisArg, body) {
+        var _ = { label: 0, sent: function () { if (t[0] & 1)
+                throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+        return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
+        function verb(n) { return function (v) { return step([n, v]); }; }
+        function step(op) {
+            if (f)
+                throw new TypeError("Generator is already executing.");
+            while (_)
+                try {
+                    if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done)
+                        return t;
+                    if (y = 0, t)
+                        op = [op[0] & 2, t.value];
+                    switch (op[0]) {
+                        case 0:
+                        case 1:
+                            t = op;
+                            break;
+                        case 4:
+                            _.label++;
+                            return { value: op[1], done: false };
+                        case 5:
+                            _.label++;
+                            y = op[1];
+                            op = [0];
+                            continue;
+                        case 7:
+                            op = _.ops.pop();
+                            _.trys.pop();
+                            continue;
+                        default:
+                            if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+                                _ = 0;
+                                continue;
+                            }
+                            if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
+                                _.label = op[1];
+                                break;
+                            }
+                            if (op[0] === 6 && _.label < t[1]) {
+                                _.label = t[1];
+                                t = op;
+                                break;
+                            }
+                            if (t && _.label < t[2]) {
+                                _.label = t[2];
+                                _.ops.push(op);
+                                break;
+                            }
+                            if (t[2])
+                                _.ops.pop();
+                            _.trys.pop();
+                            continue;
+                    }
+                    op = body.call(thisArg, _);
+                }
+                catch (e) {
+                    op = [6, e];
+                    y = 0;
+                }
+                finally {
+                    f = t = 0;
+                }
+            if (op[0] & 5)
+                throw op[1];
+            return { value: op[0] ? op[1] : void 0, done: true };
+        }
+    }
+    var __createBinding = Object.create ? (function (o, m, k, k2) {
+        if (k2 === undefined)
+            k2 = k;
+        var desc = Object.getOwnPropertyDescriptor(m, k);
+        if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+            desc = { enumerable: true, get: function () { return m[k]; } };
+        }
+        Object.defineProperty(o, k2, desc);
+    }) : (function (o, m, k, k2) {
+        if (k2 === undefined)
+            k2 = k;
+        o[k2] = m[k];
+    });
+    function __exportStar(m, o) {
+        for (var p in m)
+            if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p))
+                __createBinding(o, m, p);
+    }
+    function __values(o) {
+        var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+        if (m)
+            return m.call(o);
+        if (o && typeof o.length === "number")
+            return {
+                next: function () {
+                    if (o && i >= o.length)
+                        o = void 0;
+                    return { value: o && o[i++], done: !o };
+                }
+            };
+        throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+    }
+    function __read(o, n) {
+        var m = typeof Symbol === "function" && o[Symbol.iterator];
+        if (!m)
+            return o;
+        var i = m.call(o), r, ar = [], e;
+        try {
+            while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
+                ar.push(r.value);
+        }
+        catch (error) {
+            e = { error: error };
+        }
+        finally {
+            try {
+                if (r && !r.done && (m = i["return"]))
+                    m.call(i);
+            }
+            finally {
+                if (e)
+                    throw e.error;
+            }
+        }
+        return ar;
+    }
+    /** @deprecated */
+    function __spread() {
+        for (var ar = [], i = 0; i < arguments.length; i++)
+            ar = ar.concat(__read(arguments[i]));
+        return ar;
+    }
+    /** @deprecated */
+    function __spreadArrays() {
+        for (var s = 0, i = 0, il = arguments.length; i < il; i++)
+            s += arguments[i].length;
+        for (var r = Array(s), k = 0, i = 0; i < il; i++)
+            for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
+                r[k] = a[j];
+        return r;
+    }
+    function __spreadArray(to, from, pack) {
+        if (pack || arguments.length === 2)
+            for (var i = 0, l = from.length, ar; i < l; i++) {
+                if (ar || !(i in from)) {
+                    if (!ar)
+                        ar = Array.prototype.slice.call(from, 0, i);
+                    ar[i] = from[i];
+                }
+            }
+        return to.concat(ar || Array.prototype.slice.call(from));
+    }
+    function __await(v) {
+        return this instanceof __await ? (this.v = v, this) : new __await(v);
+    }
+    function __asyncGenerator(thisArg, _arguments, generator) {
+        if (!Symbol.asyncIterator)
+            throw new TypeError("Symbol.asyncIterator is not defined.");
+        var g = generator.apply(thisArg, _arguments || []), i, q = [];
+        return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
+        function verb(n) { if (g[n])
+            i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
+        function resume(n, v) { try {
+            step(g[n](v));
+        }
+        catch (e) {
+            settle(q[0][3], e);
+        } }
+        function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
+        function fulfill(value) { resume("next", value); }
+        function reject(value) { resume("throw", value); }
+        function settle(f, v) { if (f(v), q.shift(), q.length)
+            resume(q[0][0], q[0][1]); }
+    }
+    function __asyncDelegator(o) {
+        var i, p;
+        return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
+        function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
+    }
+    function __asyncValues(o) {
+        if (!Symbol.asyncIterator)
+            throw new TypeError("Symbol.asyncIterator is not defined.");
+        var m = o[Symbol.asyncIterator], i;
+        return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
+        function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
+        function settle(resolve, reject, d, v) { Promise.resolve(v).then(function (v) { resolve({ value: v, done: d }); }, reject); }
+    }
+    function __makeTemplateObject(cooked, raw) {
+        if (Object.defineProperty) {
+            Object.defineProperty(cooked, "raw", { value: raw });
+        }
+        else {
+            cooked.raw = raw;
+        }
+        return cooked;
+    }
+    ;
+    var __setModuleDefault = Object.create ? (function (o, v) {
+        Object.defineProperty(o, "default", { enumerable: true, value: v });
+    }) : function (o, v) {
+        o["default"] = v;
+    };
+    function __importStar(mod) {
+        if (mod && mod.__esModule)
+            return mod;
+        var result = {};
+        if (mod != null)
+            for (var k in mod)
+                if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k))
+                    __createBinding(result, mod, k);
+        __setModuleDefault(result, mod);
+        return result;
+    }
+    function __importDefault(mod) {
+        return (mod && mod.__esModule) ? mod : { default: mod };
+    }
+    function __classPrivateFieldGet(receiver, state, kind, f) {
+        if (kind === "a" && !f)
+            throw new TypeError("Private accessor was defined without a getter");
+        if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+            throw new TypeError("Cannot read private member from an object whose class did not declare it");
+        return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+    }
+    function __classPrivateFieldSet(receiver, state, value, kind, f) {
+        if (kind === "m")
+            throw new TypeError("Private method is not writable");
+        if (kind === "a" && !f)
+            throw new TypeError("Private accessor was defined without a setter");
+        if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+            throw new TypeError("Cannot write private member to an object whose class did not declare it");
+        return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+    }
+    function __classPrivateFieldIn(state, receiver) {
+        if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function"))
+            throw new TypeError("Cannot use 'in' operator on non-object");
+        return typeof state === "function" ? receiver === state : state.has(receiver);
+    }
+
+    // TODO: delete it when all `!!raw-loader!` will be replaced by webpack `asset/source`.
+    function trimExportDefault(fileContent) {
+        return fileContent.startsWith("export default \"")
+            ? fileContent
+                .replace(/^export\sdefault\s["']/gi, "")
+                .replace(/['"];$/gi, "")
+                .replaceAll("\\n", "\n")
+                .replaceAll("\\\"", "\"")
+            : fileContent;
+    }
+    function tuiRawLoad(content) {
         return __awaiter(this, void 0, void 0, function () {
-            var _a;
+            var unpacked, _a;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
@@ -273,20 +391,17 @@
                     case 2:
                         _a = content;
                         _b.label = 3;
-                    case 3: return [2 /*return*/, _a];
+                    case 3:
+                        unpacked = _a;
+                        return [2 /*return*/, trimExportDefault(unpacked)];
                 }
             });
         });
     }
-    var tuiRawLoad = rawLoad;
 
-    /**
-     * @deprecated: use {@link tuiTryParseMarkdownCodeBlock} instead
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function tryParseMarkdownCodeBlock(text) {
+    function tuiTryParseMarkdownCodeBlock(text) {
         if (text === void 0) { text = ""; }
-        var tokens = new MarkdownIt().parse(text, {});
+        var tokens = new MarkdownIt__default["default"]().parse(text, {});
         var result = tokens
             .filter(function (_a) {
             var tag = _a.tag, type = _a.type;
@@ -298,108 +413,119 @@
         });
         return result.length ? result : [text];
     }
-    var tuiTryParseMarkdownCodeBlock = tryParseMarkdownCodeBlock;
 
     var TuiDocCodeComponent = /** @class */ (function () {
         function TuiDocCodeComponent() {
-            this.rawLoader$$ = new rxjs.BehaviorSubject("");
+            this.rawLoader$$ = new i9.BehaviorSubject("");
             this.filename = "";
-            this.processor$ = this.rawLoader$$.pipe(operators.switchMap(rawLoad), operators.map(tryParseMarkdownCodeBlock));
+            this.processor$ = this.rawLoader$$.pipe(operators.switchMap(tuiRawLoad), operators.map(tuiTryParseMarkdownCodeBlock));
         }
         Object.defineProperty(TuiDocCodeComponent.prototype, "code", {
             set: function (code) {
                 this.rawLoader$$.next(code);
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         Object.defineProperty(TuiDocCodeComponent.prototype, "hasFilename", {
             get: function () {
                 return !!this.filename;
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
-        __decorate([
-            core.Input()
-        ], TuiDocCodeComponent.prototype, "filename", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocCodeComponent.prototype, "code", null);
-        __decorate([
-            core.HostBinding("class._has-filename")
-        ], TuiDocCodeComponent.prototype, "hasFilename", null);
-        TuiDocCodeComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-code",
-                template: "<p\n    *ngIf=\"filename\"\n    class=\"t-header\"\n>\n    {{ filename }}\n</p>\n<pre\n    *ngFor=\"let content of processor$ | async\"\n    class=\"t-code\"\n><code [lineNumbers]=\"true\" [highlight]=\"content\"></code></pre>\n",
-                styles: [":host{display:block}.t-header{font:var(--tui-font-text-s);font-weight:700}.t-code{margin:0}.t-code+.t-code{margin-top:1rem}.hljs:not(:empty){font:var(--tui-font-text-m);padding:1.5rem 2rem;font-family:monospace;background:var(--tui-clear-disabled);word-wrap:break-word;white-space:pre-wrap}@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution:0.001dpcm){.hljs:not(:empty)::-webkit-scrollbar,.hljs:not(:empty)::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:2.667rem solid transparent}.hljs:not(:empty)::-webkit-scrollbar{background-color:transparent}.hljs:not(:empty)::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.hljs:not(:empty)::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.hljs:not(:empty)::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host._has-filename .hljs:not(:empty){border-radius:.75rem}:host-context(tui-root._mobile) .hljs:not(:empty){padding:1rem}"]
-            })
-        ], TuiDocCodeComponent);
         return TuiDocCodeComponent;
     }());
+    TuiDocCodeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCodeComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocCodeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocCodeComponent, selector: "tui-doc-code", inputs: { filename: "filename", code: "code" }, host: { properties: { "class._has-filename": "this.hasFilename" } }, ngImport: i0__namespace, template: "<p\n    *ngIf=\"filename\"\n    class=\"t-header\"\n>\n    {{ filename }}\n</p>\n<pre\n    *ngFor=\"let content of processor$ | async\"\n    class=\"t-code\"\n><code [lineNumbers]=\"true\" [highlight]=\"content\"></code></pre>\n", styles: [":host{display:block}.t-header{font:var(--tui-font-text-s);font-weight:bold}.t-code{margin:0}.t-code+.t-code{margin-top:1rem}.hljs:not(:empty){font:var(--tui-font-text-m);padding:1.5rem 2rem;font-family:monospace;background:var(--tui-clear-disabled);word-wrap:break-word;white-space:pre-wrap}@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.hljs:not(:empty)::-webkit-scrollbar,.hljs:not(:empty)::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:2.667rem solid transparent}.hljs:not(:empty)::-webkit-scrollbar{background-color:transparent}.hljs:not(:empty)::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.hljs:not(:empty)::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.hljs:not(:empty)::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host._has-filename .hljs:not(:empty){border-radius:.75rem}:host-context(tui-root._mobile) .hljs:not(:empty){padding:1rem}\n"], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.Highlight, selector: "[highlight]", inputs: ["highlight", "languages", "lineNumbers"], outputs: ["highlighted"] }], pipes: { "async": i5__namespace.AsyncPipe } });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCodeComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-code",
+                        templateUrl: "./code.template.html",
+                        styleUrls: ["./code.style.less"],
+                    }]
+            }], propDecorators: { filename: [{
+                    type: i0.Input
+                }], code: [{
+                    type: i0.Input
+                }], hasFilename: [{
+                    type: i0.HostBinding,
+                    args: ["class._has-filename"]
+                }] } });
 
     var TuiDocCodeModule = /** @class */ (function () {
         function TuiDocCodeModule() {
         }
-        TuiDocCodeModule = __decorate([
-            core.NgModule({
-                imports: [common.CommonModule, ngxHighlightjs.HighlightModule],
-                declarations: [TuiDocCodeComponent],
-                exports: [TuiDocCodeComponent],
-            })
-        ], TuiDocCodeModule);
         return TuiDocCodeModule;
     }());
+    TuiDocCodeModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCodeModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocCodeModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCodeModule, declarations: [TuiDocCodeComponent], imports: [i5.CommonModule, i2.HighlightModule], exports: [TuiDocCodeComponent] });
+    TuiDocCodeModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCodeModule, imports: [[i5.CommonModule, i2.HighlightModule]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCodeModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [i5.CommonModule, i2.HighlightModule],
+                        declarations: [TuiDocCodeComponent],
+                        exports: [TuiDocCodeComponent],
+                    }]
+            }] });
 
     var COPIED_TIMEOUT = 1500;
-    // @dynamic
     var TuiDocCopyComponent = /** @class */ (function () {
         function TuiDocCopyComponent(texts$) {
             this.texts$ = texts$;
-            this.copy$ = new rxjs.Subject();
+            this.copy$ = new i9.Subject();
         }
         Object.defineProperty(TuiDocCopyComponent.prototype, "copied$", {
             get: function () {
-                return this.copy$.pipe(operators.switchMapTo(rxjs.timer(COPIED_TIMEOUT).pipe(operators.mapTo(false), operators.startWith(true))));
+                return this.copy$.pipe(operators.switchMapTo(i9.timer(COPIED_TIMEOUT).pipe(operators.mapTo(false), operators.startWith(true))));
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         TuiDocCopyComponent.prototype.onClick = function () {
             this.copy$.next();
         };
-        TuiDocCopyComponent.ctorParameters = function () { return [
-            { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [kit.TUI_COPY_TEXTS,] }] }
-        ]; };
-        __decorate([
-            cdk.tuiPure
-        ], TuiDocCopyComponent.prototype, "copied$", null);
-        TuiDocCopyComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-copy",
-                template: "<button\n    *ngIf=\"texts$ | async as texts\"\n    tuiButton\n    type=\"button\"\n    appearance=\"\"\n    size=\"s\"\n    class=\"t-copy\"\n    [title]=\"texts[0]\"\n    (click)=\"onClick()\"\n>\n    <span\n        class=\"t-content\"\n        [class.t-content_moved]=\"copied$ | async\"\n    >\n        <span\n            class=\"t-initial\"\n            [attr.data-text]=\"texts[0]\"\n        >\n            <ng-content></ng-content>\n        </span>\n        {{ texts[1] }}\n    </span>\n</button>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                providers: [cdk.TuiDestroyService],
-                styles: [":host{position:relative;display:inline-block;vertical-align:middle}.t-copy{transition-property:background;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;width:100%;color:var(--tui-text-01);background:var(--tui-base-01);overflow:hidden}.t-copy:hover{background:var(--tui-base-02)}.t-initial{white-space:nowrap}.t-initial:empty:before{content:attr(data-text)}.t-content{transition-property:transform;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;display:flex;flex-direction:column;transform:translateY(1rem);text-align:center;line-height:2rem}.t-content_moved{transform:translateY(-1rem)}"]
-            }),
-            __param(0, core.Inject(kit.TUI_COPY_TEXTS))
-        ], TuiDocCopyComponent);
         return TuiDocCopyComponent;
     }());
+    TuiDocCopyComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCopyComponent, deps: [{ token: i1.TUI_COPY_TEXTS }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocCopyComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocCopyComponent, selector: "tui-doc-copy", providers: [i6.TuiDestroyService], ngImport: i0__namespace, template: "<button\n    *ngIf=\"texts$ | async as texts\"\n    tuiButton\n    type=\"button\"\n    appearance=\"\"\n    size=\"s\"\n    class=\"t-copy\"\n    [title]=\"texts[0]\"\n    (click)=\"onClick()\"\n>\n    <span\n        class=\"t-content\"\n        [class.t-content_moved]=\"copied$ | async\"\n    >\n        <span\n            class=\"t-initial\"\n            [attr.data-text]=\"texts[0]\"\n        >\n            <ng-content></ng-content>\n        </span>\n        {{ texts[1] }}\n    </span>\n</button>\n", styles: [":host{position:relative;display:inline-block;vertical-align:middle}.t-copy{transition-property:background;transition-duration:.3s;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:100%;color:var(--tui-text-01);background:var(--tui-base-01);overflow:hidden}.t-copy:hover{background:var(--tui-base-02)}.t-initial{white-space:nowrap}.t-initial:empty:before{content:attr(data-text)}.t-content{transition-property:transform;transition-duration:.3s;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;display:flex;flex-direction:column;transform:translateY(1rem);text-align:center;line-height:2rem}.t-content_moved{transform:translateY(-1rem)}\n"], components: [{ type: i2__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i5__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    __decorate([
+        i6.tuiPure
+    ], TuiDocCopyComponent.prototype, "copied$", null);
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCopyComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-copy",
+                        templateUrl: "./copy.template.html",
+                        styleUrls: ["./copy.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                        providers: [i6.TuiDestroyService],
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i9__namespace.Observable, decorators: [{
+                            type: i0.Inject,
+                            args: [i1.TUI_COPY_TEXTS]
+                        }] }];
+        }, propDecorators: { copied$: [] } });
 
     var TuiDocCopyModule = /** @class */ (function () {
         function TuiDocCopyModule() {
         }
-        TuiDocCopyModule = __decorate([
-            core.NgModule({
-                imports: [common.CommonModule, core$1.TuiButtonModule],
-                declarations: [TuiDocCopyComponent],
-                exports: [TuiDocCopyComponent],
-            })
-        ], TuiDocCopyModule);
         return TuiDocCopyModule;
     }());
+    TuiDocCopyModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCopyModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocCopyModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCopyModule, declarations: [TuiDocCopyComponent], imports: [i5.CommonModule, i2$1.TuiButtonModule], exports: [TuiDocCopyComponent] });
+    TuiDocCopyModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCopyModule, imports: [[i5.CommonModule, i2$1.TuiButtonModule]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocCopyModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [i5.CommonModule, i2$1.TuiButtonModule],
+                        declarations: [TuiDocCopyComponent],
+                        exports: [TuiDocCopyComponent],
+                    }]
+            }] });
 
     /**
      * TODO: think about reorganization in @taiga-ui/i18n way
@@ -408,7 +534,7 @@
      * Works with a tuple
      * [@string tuiMode tooltip content, @string word 'background', @string 'form value']
      */
-    var TUI_DOC_DEMO_TEXTS = new core.InjectionToken("tui-doc-demo i18n texts", {
+    var TUI_DOC_DEMO_TEXTS = new i0.InjectionToken("tui-doc-demo i18n texts", {
         factory: function () { return ["Read more more about modes: ", "Background", "Form value"]; },
     });
     /**
@@ -421,7 +547,7 @@
      * @string message for tooltip about ng-polymorpheus
      * ]
      */
-    var TUI_DOC_DOCUMENTATION_TEXTS = new core.InjectionToken("tui-doc-documentation i18n texts", {
+    var TUI_DOC_DOCUMENTATION_TEXTS = new i0.InjectionToken("tui-doc-documentation i18n texts", {
         factory: function () { return [
             "Argument",
             "Type",
@@ -438,24 +564,23 @@
      * @string link to a sample copied message label
      * ]
      */
-    var TUI_DOC_EXAMPLE_TEXTS = new core.InjectionToken("tui-doc-example i18n texts", {
+    var TUI_DOC_EXAMPLE_TEXTS = new i0.InjectionToken("tui-doc-example i18n texts", {
         factory: function () { return ["Preview", "Link to a sample was successfully copied", "Done"]; },
     });
-    var TUI_DOC_MENU_TEXT = new core.InjectionToken("menu i18n text", {
+    var TUI_DOC_MENU_TEXT = new i0.InjectionToken("menu i18n text", {
         factory: function () { return "Menu"; },
     });
-    var TUI_DOC_SEARCH_TEXT = new core.InjectionToken("search i18n text", {
+    var TUI_DOC_SEARCH_TEXT = new i0.InjectionToken("search i18n text", {
         factory: function () { return "Search"; },
     });
-    var TUI_DOC_SEE_ALSO_TEXT = new core.InjectionToken("tui-doc-see-also i18n text", {
+    var TUI_DOC_SEE_ALSO_TEXT = new i0.InjectionToken("tui-doc-see-also i18n text", {
         factory: function () { return "See also"; },
     });
-    var TUI_DOC_SOURCE_CODE_TEXT = new core.InjectionToken("tui-doc-source-code i18n text", {
+    var TUI_DOC_SOURCE_CODE_TEXT = new i0.InjectionToken("tui-doc-source-code i18n text", {
         factory: function () { return "Source code"; },
     });
 
     var MIN_COMPONENT_WIDTH = 104;
-    // @dynamic
     var TuiDocDemoComponent = /** @class */ (function () {
         function TuiDocDemoComponent(isMobile, destroy$, renderer, platformId, locationRef, urlSerializer, texts) {
             var _this = this;
@@ -471,11 +596,11 @@
             this.updateOn = "change";
             this.expanded = false;
             this.opaque = true;
-            this.modeControl = new forms.FormControl();
+            this.modeControl = new i5$1.FormControl();
             this.mode = null;
-            this.change$ = new rxjs.Subject();
+            this.change$ = new i9.Subject();
             this.items = ["onLight", "onDark"];
-            this.isBrowser = common.isPlatformBrowser(platformId);
+            this.isBrowser = i5.isPlatformBrowser(platformId);
             var parsedMode = locationRef.path().match(/tuiMode=(onDark|onLight)/);
             if (parsedMode !== null && parsedMode.length > 0) {
                 this.modeControl.setValue(parsedMode[1]);
@@ -484,13 +609,12 @@
                 .pipe(operators.startWith(this.modeControl.value), operators.takeUntil(this.destroy$))
                 .subscribe(function (mode) {
                 var urlTree = urlSerializer.parse(locationRef.path());
-                urlTree.queryParams = __assign(__assign({}, urlTree.queryParams), { tuiMode: mode });
+                urlTree.queryParams = Object.assign(Object.assign({}, urlTree.queryParams), { tuiMode: mode });
                 locationRef.go(String(urlTree));
                 _this.mode = mode;
                 _this.change$.next();
             });
         }
-        TuiDocDemoComponent_1 = TuiDocDemoComponent;
         TuiDocDemoComponent.prototype.onResize = function () {
             this.setResizerTextContent();
         };
@@ -535,126 +659,155 @@
             if (!control) {
                 return;
             }
-            this.testForm = new forms.FormGroup({ testValue: control }, { updateOn: updateOn });
+            this.testForm = new i5$1.FormGroup({ testValue: control }, { updateOn: updateOn });
         };
         TuiDocDemoComponent.prototype.resizeContent = function (delta) {
             if (!this.wrapper) {
                 return;
             }
-            this.renderer.setStyle(this.wrapper.nativeElement, "width", cdk.px(Math.max(this.wrapperWidth - delta, MIN_COMPONENT_WIDTH)));
+            this.renderer.setStyle(this.wrapper.nativeElement, "width", i6.tuiPx(Math.max(this.wrapperWidth - delta, MIN_COMPONENT_WIDTH)));
         };
-        var TuiDocDemoComponent_1;
-        TuiDocDemoComponent.ctorParameters = function () { return [
-            { type: Boolean, decorators: [{ type: core.Inject, args: [cdk.TUI_IS_MOBILE,] }] },
-            { type: cdk.TuiDestroyService, decorators: [{ type: core.Inject, args: [cdk.TuiDestroyService,] }] },
-            { type: core.Renderer2, decorators: [{ type: core.Inject, args: [core.Renderer2,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [core.PLATFORM_ID,] }] },
-            { type: common.Location, decorators: [{ type: core.Inject, args: [common.Location,] }] },
-            { type: router.UrlSerializer, decorators: [{ type: core.Inject, args: [router.UrlSerializer,] }] },
-            { type: Array, decorators: [{ type: core.Inject, args: [TUI_DOC_DEMO_TEXTS,] }] }
-        ]; };
-        __decorate([
-            core.ViewChild("content")
-        ], TuiDocDemoComponent.prototype, "content", void 0);
-        __decorate([
-            core.ViewChild("wrapper")
-        ], TuiDocDemoComponent.prototype, "wrapper", void 0);
-        __decorate([
-            core.ViewChild("resizerText")
-        ], TuiDocDemoComponent.prototype, "resizerText", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDemoComponent.prototype, "control", void 0);
-        __decorate([
-            core.ContentChild(core.TemplateRef)
-        ], TuiDocDemoComponent.prototype, "template", void 0);
-        __decorate([
-            core.HostListener("window:resize")
-        ], TuiDocDemoComponent.prototype, "onResize", null);
-        TuiDocDemoComponent = TuiDocDemoComponent_1 = __decorate([
-            core.Component({
-                selector: "tui-doc-demo",
-                template: "<div\n    class=\"t-bg-toggle\"\n    [tuiMode]=\"null\"\n>\n    <ng-template #tooltip>\n        {{ texts[0] }}\n        <a\n            tuiLink\n            tuiMode=\"onDark\"\n            routerLink=\"/directives/mode\"\n        >\n            <code>tuiMode</code>\n        </a>\n    </ng-template>\n    <ng-container *ngIf=\"isMobile; else desktop\">\n        <tui-select\n            tuiTextfieldSize=\"s\"\n            class=\"t-mode\"\n            [tuiTextfieldCleaner]=\"true\"\n            [tuiHintContent]=\"tooltip\"\n            [formControl]=\"modeControl\"\n        >\n            tuiMode\n            <tui-data-list-wrapper\n                *tuiDataList\n                [items]=\"items\"\n            ></tui-data-list-wrapper>\n        </tui-select>\n    </ng-container>\n    <ng-template #desktop>\n        tuiMode:\n        <tui-tooltip\n            describeId=\"form\"\n            [content]=\"tooltip\"\n        ></tui-tooltip>\n        <div\n            tuiGroup\n            class=\"t-group\"\n            [collapsed]=\"true\"\n        >\n            <tui-radio-block\n                size=\"s\"\n                nativeId=\"form\"\n                class=\"tui-group__auto-width-item\"\n                [item]=\"null\"\n                [hideRadio]=\"true\"\n                [formControl]=\"modeControl\"\n            >\n                null\n            </tui-radio-block>\n            <tui-radio-block\n                item=\"onDark\"\n                size=\"s\"\n                nativeId=\"form\"\n                class=\"tui-group__auto-width-item\"\n                [hideRadio]=\"true\"\n                [formControl]=\"modeControl\"\n            >\n                onDark\n            </tui-radio-block>\n            <tui-radio-block\n                item=\"onLight\"\n                size=\"s\"\n                nativeId=\"form\"\n                class=\"tui-group__auto-width-item\"\n                [hideRadio]=\"true\"\n                [formControl]=\"modeControl\"\n            >\n                onLight\n            </tui-radio-block>\n        </div>\n    </ng-template>\n    <tui-checkbox-labeled\n        size=\"m\"\n        class=\"t-checkbox\"\n        [(ngModel)]=\"opaque\"\n    >\n        {{ texts[1] }}\n    </tui-checkbox-labeled>\n</div>\n<div\n    #wrapper\n    class=\"t-wrapper\"\n    [class.t-wrapper_dark]=\"modeControl.value === 'onDark'\"\n    [class.t-wrapper_gray]=\"modeControl.value === 'onLight'\"\n    [class.t-wrapper_transparent]=\"!opaque\"\n>\n    <div\n        #content\n        id=\"demoContent\"\n        class=\"t-content\"\n    >\n        <form\n            *ngIf=\"testForm\"\n            class=\"t-form\"\n            [formGroup]=\"testForm\"\n        >\n            <div class=\"t-input-wrapper\">\n                <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\n            </div>\n            <button\n                tuiButton\n                type=\"button\"\n                size=\"s\"\n                class=\"t-button\"\n                [iconRight]=\"icon\"\n                (click)=\"toggleDetails()\"\n            >\n                {{ texts[2] }}\n            </button>\n            <ng-template #icon>\n                <tui-svg\n                    src=\"tuiIconChevronDown\"\n                    class=\"t-icon\"\n                    [class.t-icon_rotated]=\"expanded\"\n                ></tui-svg>\n            </ng-template>\n            <tui-expand\n                class=\"t-expand\"\n                [expanded]=\"expanded\"\n            >\n                <ng-template tuiExpandContent>\n                    <pre class=\"t-value\">Form data: {{ testForm.value | json }}</pre>\n                    <div\n                        tuiGroup\n                        class=\"t-form-controls\"\n                    >\n                        <tui-select\n                            tuiTextfieldSize=\"s\"\n                            class=\"t-select\"\n                            [ngModel]=\"updateOn\"\n                            [ngModelOptions]=\"{standalone: true}\"\n                            (ngModelChange)=\"updateOnChange($event)\"\n                        >\n                            updateOn\n                            <tui-data-list-wrapper\n                                *tuiDataList\n                                [items]=\"updateOnVariants\"\n                            ></tui-data-list-wrapper>\n                        </tui-select>\n                        <button\n                            tuiButton\n                            type=\"reset\"\n                            size=\"s\"\n                            class=\"tui-group__auto-width-item\"\n                        >\n                            Reset\n                        </button>\n                        <button\n                            tuiButton\n                            type=\"submit\"\n                            size=\"s\"\n                            class=\"tui-group__auto-width-item\"\n                        >\n                            Submit\n                        </button>\n                    </div>\n                </ng-template>\n            </tui-expand>\n        </form>\n        <ng-content></ng-content>\n    </div>\n    <button\n        tabindex=\"-1\"\n        class=\"t-resizer\"\n        (tuiDragStart)=\"onDragStart($event)\"\n        (tuiDragContinues)=\"onDragContinues($event)\"\n        (tuiDragEnd)=\"onDragEnd()\"\n    >\n        <span\n            #resizerText\n            class=\"t-resizer-text\"\n        ></span>\n    </button>\n</div>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                providers: [
-                    cdk.TuiDestroyService,
-                    {
-                        provide: core$1.TuiModeDirective,
-                        useExisting: core.forwardRef(function () { return TuiDocDemoComponent_1; }),
-                    },
-                ],
-                styles: [":host{position:relative;display:block;min-width:100%;margin:1.5rem 0}.t-bg-toggle{position:absolute;bottom:calc(100% + .75rem);display:flex;align-items:center;justify-content:flex-end;pointer-events:none;width:100%}.t-bg-toggle>*{pointer-events:auto}.t-wrapper{box-shadow:0 .5rem 1rem rgba(0,0,0,.16);display:flex;border:1px solid var(--tui-base-03);border-radius:var(--tui-radius-m);max-width:100%;min-height:6rem;width:100%;background-color:var(--tui-base-01);overflow:hidden}.t-wrapper.t-wrapper_transparent{background-image:linear-gradient(45deg,var(--tui-base-02) 25%,transparent 25%),linear-gradient(-45deg,var(--tui-base-02) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tui-base-02) 75%),linear-gradient(-45deg,transparent 75%,var(--tui-base-02) 75%);background-size:1.25rem 1.25rem;background-position:0 0,0 .625rem,.625rem -.625rem,-.625rem 0}.t-wrapper.t-wrapper_dark{background-color:#454e58;color:var(--tui-base-01)}.t-wrapper.t-wrapper_gray{background-color:#e5e7ea}.t-wrapper.t-wrapper_dark.t-wrapper_transparent{background-image:linear-gradient(45deg,var(--tui-focus) 25%,transparent 25%),linear-gradient(-45deg,var(--tui-focus) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tui-focus) 75%),linear-gradient(-45deg,transparent 75%,var(--tui-focus) 75%)}.t-wrapper.t-wrapper_gray.t-wrapper_transparent{background-image:linear-gradient(45deg,var(--tui-base-05) 25%,transparent 25%),linear-gradient(-45deg,var(--tui-base-05) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tui-base-05) 75%),linear-gradient(-45deg,transparent 75%,var(--tui-base-05) 75%)}:host-context(tui-root._mobile) .t-wrapper{min-height:auto}.t-content{flex:1 1 0;min-width:0;padding:1.5rem;box-sizing:border-box;overflow:hidden}:host-context(tui-root._mobile) .t-content{padding:1rem}.t-form{display:flex;flex-wrap:wrap;align-items:flex-start}.t-input-wrapper{width:100%;margin-bottom:.5rem}.t-expand{width:100%}.t-icon{transition-property:transform;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out}.t-icon_rotated{transform:rotate(180deg)}.t-value{flex:1;background:var(--tui-clear-inverse);padding:.75rem;border-radius:.25rem}.t-mode{width:12.5rem}.t-select{max-width:15rem}.t-resizer{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:0 0;font-size:inherit;line-height:inherit;box-shadow:0 .5rem 1rem rgba(0,0,0,.16);position:relative;width:3.5rem;min-height:inherit;flex-shrink:0;border-left:1px solid var(--tui-base-03);cursor:col-resize;outline:0;background:var(--tui-base-01);color:var(--tui-text-01)}.t-resizer:after,.t-resizer:before{content:'';position:absolute;top:.75rem;left:50%;bottom:.75rem;width:1px;background:var(--tui-base-05)}.t-resizer:before{transform:translateX(.125rem)}.t-resizer:after{transform:translateX(-.1875rem)}:host-context(tui-root._mobile) .t-resizer{display:none}.t-resizer-text{font:var(--tui-font-text-s);position:relative;z-index:1;padding:.75rem;background:var(--tui-base-01)}.wrapper_light .t-resizer-text{background:#3e464e}.t-checkbox,.t-group{margin-left:.75rem}.t-button,.t-form-controls{margin-top:.75rem}@supports ((position:-webkit-sticky) or (position:sticky)){@media screen and (min-height:37.5rem){:host{position:-webkit-sticky;position:sticky;top:4.625rem;z-index:2}}}"]
-            }),
-            __param(0, core.Inject(cdk.TUI_IS_MOBILE)),
-            __param(1, core.Inject(cdk.TuiDestroyService)),
-            __param(2, core.Inject(core.Renderer2)),
-            __param(3, core.Inject(core.PLATFORM_ID)),
-            __param(4, core.Inject(common.Location)),
-            __param(5, core.Inject(router.UrlSerializer)),
-            __param(6, core.Inject(TUI_DOC_DEMO_TEXTS))
-        ], TuiDocDemoComponent);
         return TuiDocDemoComponent;
     }());
+    TuiDocDemoComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDemoComponent, deps: [{ token: i6.TUI_IS_MOBILE }, { token: i6.TuiDestroyService }, { token: i0.Renderer2 }, { token: i0.PLATFORM_ID }, { token: i5.Location }, { token: i6$1.UrlSerializer }, { token: TUI_DOC_DEMO_TEXTS }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocDemoComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocDemoComponent, selector: "tui-doc-demo", inputs: { control: "control" }, host: { listeners: { "window:resize": "onResize()" } }, providers: [
+            i6.TuiDestroyService,
+            {
+                provide: i2$1.TuiModeDirective,
+                useExisting: i0.forwardRef(function () { return TuiDocDemoComponent; }),
+            },
+        ], queries: [{ propertyName: "template", first: true, predicate: i0.TemplateRef, descendants: true }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true }, { propertyName: "wrapper", first: true, predicate: ["wrapper"], descendants: true }, { propertyName: "resizerText", first: true, predicate: ["resizerText"], descendants: true }], ngImport: i0__namespace, template: "<div\n    class=\"t-bg-toggle\"\n    [tuiMode]=\"null\"\n>\n    <ng-template #tooltip>\n        {{ texts[0] }}\n        <a\n            tuiLink\n            tuiMode=\"onDark\"\n            routerLink=\"/directives/mode\"\n        >\n            <code>tuiMode</code>\n        </a>\n    </ng-template>\n    <ng-container *ngIf=\"isMobile; else desktop\">\n        <tui-select\n            tuiTextfieldSize=\"s\"\n            class=\"t-mode\"\n            [tuiTextfieldCleaner]=\"true\"\n            [tuiHintContent]=\"tooltip\"\n            [formControl]=\"modeControl\"\n        >\n            tuiMode\n            <tui-data-list-wrapper\n                *tuiDataList\n                [items]=\"items\"\n            ></tui-data-list-wrapper>\n        </tui-select>\n    </ng-container>\n    <ng-template #desktop>\n        tuiMode:\n        <tui-tooltip\n            describeId=\"form\"\n            [content]=\"tooltip\"\n        ></tui-tooltip>\n        <div\n            tuiGroup\n            class=\"t-group\"\n            [collapsed]=\"true\"\n        >\n            <tui-radio-block\n                size=\"s\"\n                nativeId=\"form\"\n                class=\"tui-group__auto-width-item\"\n                [item]=\"null\"\n                [hideRadio]=\"true\"\n                [formControl]=\"modeControl\"\n            >\n                null\n            </tui-radio-block>\n            <tui-radio-block\n                item=\"onDark\"\n                size=\"s\"\n                nativeId=\"form\"\n                class=\"tui-group__auto-width-item\"\n                [hideRadio]=\"true\"\n                [formControl]=\"modeControl\"\n            >\n                onDark\n            </tui-radio-block>\n            <tui-radio-block\n                item=\"onLight\"\n                size=\"s\"\n                nativeId=\"form\"\n                class=\"tui-group__auto-width-item\"\n                [hideRadio]=\"true\"\n                [formControl]=\"modeControl\"\n            >\n                onLight\n            </tui-radio-block>\n        </div>\n    </ng-template>\n    <tui-checkbox-labeled\n        size=\"m\"\n        class=\"t-checkbox\"\n        [(ngModel)]=\"opaque\"\n    >\n        {{ texts[1] }}\n    </tui-checkbox-labeled>\n</div>\n<div\n    #wrapper\n    class=\"t-wrapper\"\n    [class.t-wrapper_dark]=\"modeControl.value === 'onDark'\"\n    [class.t-wrapper_gray]=\"modeControl.value === 'onLight'\"\n    [class.t-wrapper_transparent]=\"!opaque\"\n>\n    <div\n        #content\n        id=\"demoContent\"\n        class=\"t-content\"\n    >\n        <form\n            *ngIf=\"testForm\"\n            class=\"t-form\"\n            [formGroup]=\"testForm\"\n        >\n            <div class=\"t-input-wrapper\">\n                <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\n            </div>\n            <button\n                tuiButton\n                type=\"button\"\n                size=\"s\"\n                class=\"t-button\"\n                [iconRight]=\"icon\"\n                (click)=\"toggleDetails()\"\n            >\n                {{ texts[2] }}\n            </button>\n            <ng-template #icon>\n                <tui-svg\n                    src=\"tuiIconChevronDown\"\n                    class=\"t-icon\"\n                    [class.t-icon_rotated]=\"expanded\"\n                ></tui-svg>\n            </ng-template>\n            <tui-expand\n                class=\"t-expand\"\n                [expanded]=\"expanded\"\n            >\n                <ng-template tuiExpandContent>\n                    <pre class=\"t-value\">Form data: {{ testForm.value | json }}</pre>\n                    <div\n                        tuiGroup\n                        class=\"t-form-controls\"\n                    >\n                        <tui-select\n                            tuiTextfieldSize=\"s\"\n                            class=\"t-select\"\n                            [ngModel]=\"updateOn\"\n                            [ngModelOptions]=\"{standalone: true}\"\n                            (ngModelChange)=\"updateOnChange($event)\"\n                        >\n                            updateOn\n                            <tui-data-list-wrapper\n                                *tuiDataList\n                                [items]=\"updateOnVariants\"\n                            ></tui-data-list-wrapper>\n                        </tui-select>\n                        <button\n                            tuiButton\n                            type=\"reset\"\n                            size=\"s\"\n                            class=\"tui-group__auto-width-item\"\n                        >\n                            Reset\n                        </button>\n                        <button\n                            tuiButton\n                            type=\"submit\"\n                            size=\"s\"\n                            class=\"tui-group__auto-width-item\"\n                        >\n                            Submit\n                        </button>\n                    </div>\n                </ng-template>\n            </tui-expand>\n        </form>\n        <ng-content></ng-content>\n    </div>\n    <button\n        tabindex=\"-1\"\n        class=\"t-resizer\"\n        (tuiDragStart)=\"onDragStart($event)\"\n        (tuiDragContinues)=\"onDragContinues($event)\"\n        (tuiDragEnd)=\"onDragEnd()\"\n    >\n        <span\n            #resizerText\n            class=\"t-resizer-text\"\n        ></span>\n    </button>\n</div>\n", styles: [":host{position:relative;display:block;min-width:100%;margin:1.5rem 0}.t-bg-toggle{position:absolute;bottom:calc(100% + .75rem);display:flex;align-items:center;justify-content:flex-end;pointer-events:none;width:100%}.t-bg-toggle>*{pointer-events:auto}.t-wrapper{box-shadow:0 .5rem 1rem rgba(0,0,0,.16);display:flex;border:1px solid var(--tui-base-03);border-radius:var(--tui-radius-m);max-width:100%;min-height:6rem;width:100%;background-color:var(--tui-base-01);overflow:hidden}.t-wrapper.t-wrapper_transparent{background-image:linear-gradient(45deg,var(--tui-base-02) 25%,transparent 25%),linear-gradient(-45deg,var(--tui-base-02) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tui-base-02) 75%),linear-gradient(-45deg,transparent 75%,var(--tui-base-02) 75%);background-size:1.25rem 1.25rem;background-position:0 0,0 .625rem,.625rem -.625rem,-.625rem 0}.t-wrapper.t-wrapper_dark{background-color:#454e58;color:var(--tui-base-01)}.t-wrapper.t-wrapper_gray{background-color:#e5e7ea}.t-wrapper.t-wrapper_dark.t-wrapper_transparent{background-image:linear-gradient(45deg,var(--tui-focus) 25%,transparent 25%),linear-gradient(-45deg,var(--tui-focus) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tui-focus) 75%),linear-gradient(-45deg,transparent 75%,var(--tui-focus) 75%)}.t-wrapper.t-wrapper_gray.t-wrapper_transparent{background-image:linear-gradient(45deg,var(--tui-base-05) 25%,transparent 25%),linear-gradient(-45deg,var(--tui-base-05) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--tui-base-05) 75%),linear-gradient(-45deg,transparent 75%,var(--tui-base-05) 75%)}:host-context(tui-root._mobile) .t-wrapper{min-height:auto}.t-content{flex:1 1 0;min-width:0;padding:1.5rem;box-sizing:border-box;overflow:hidden}:host-context(tui-root._mobile) .t-content{padding:1rem}.t-form{display:flex;flex-wrap:wrap;align-items:flex-start}.t-input-wrapper{width:100%;margin-bottom:.5rem}.t-expand{width:100%}.t-icon{transition-property:transform;transition-duration:.3s;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out}.t-icon_rotated{transform:rotate(180deg)}.t-value{flex:1;background:var(--tui-clear-inverse);padding:.75rem;border-radius:.25rem}.t-mode{width:12.5rem}.t-select{max-width:15rem}.t-resizer{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;box-shadow:0 .5rem 1rem rgba(0,0,0,.16);position:relative;width:3.5rem;min-height:inherit;flex-shrink:0;border-left:1px solid var(--tui-base-03);cursor:col-resize;outline:none;background:var(--tui-base-01);color:var(--tui-text-01)}.t-resizer:before,.t-resizer:after{content:\"\";position:absolute;top:.75rem;left:50%;bottom:.75rem;width:1px;background:var(--tui-base-05)}.t-resizer:before{transform:translate(.125rem)}.t-resizer:after{transform:translate(-.1875rem)}:host-context(tui-root._mobile) .t-resizer{display:none}.t-resizer-text{font:var(--tui-font-text-s);position:relative;z-index:1;padding:.75rem;background:var(--tui-base-01)}.wrapper_light .t-resizer-text{background:#3e464e}.t-group,.t-checkbox{margin-left:.75rem}.t-button,.t-form-controls{margin-top:.75rem}@supports ((position: -webkit-sticky) or (position: sticky)){@media screen and (min-height: 37.5rem){:host{position:-webkit-sticky;position:sticky;top:4.625rem;z-index:2}}}\n"], components: [{ type: i2__namespace$1.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { type: i1__namespace.TuiSelectComponent, selector: "tui-select", inputs: ["stringify", "identityMatcher", "valueContent"] }, { type: i1__namespace.TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels])", inputs: ["items"] }, { type: i2__namespace$1.TuiTooltipComponent, selector: "tui-tooltip", inputs: ["content", "direction", "appearance", "showDelay", "hideDelay", "describeId"] }, { type: i1__namespace.TuiRadioBlockComponent, selector: "tui-radio-block", inputs: ["item", "identityMatcher", "contentAlign", "size", "hideRadio", "pseudoDisabled"] }, { type: i1__namespace.TuiCheckboxLabeledComponent, selector: "tui-checkbox-labeled", inputs: ["size"] }, { type: i2__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { type: i2__namespace$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i2__namespace$1.TuiExpandComponent, selector: "tui-expand", inputs: ["async", "expanded"] }], directives: [{ type: i2__namespace$1.TuiModeDirective, selector: "[tuiMode]", inputs: ["tuiMode"] }, { type: i6__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.TuiSelectDirective, selector: "tui-select" }, { type: i2__namespace$1.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { type: i2__namespace$1.TuiTextfieldCleanerDirective, selector: "[tuiTextfieldCleaner]", inputs: ["tuiTextfieldCleaner"] }, { type: i2__namespace$1.TuiHintControllerDirective, selector: "[tuiHintContent]", inputs: ["tuiHintContent", "tuiHintDirection", "tuiHintAppearance", "tuiHintShowDelay", "tuiHintHideDelay"] }, { type: i5__namespace$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5__namespace$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace$1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i2__namespace$1.TuiGroupDirective, selector: "[tuiGroup]:not(ng-container)", inputs: ["orientation", "adaptive", "collapsed", "rounded", "size"] }, { type: i5__namespace$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5__namespace$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5__namespace$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5__namespace$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2__namespace$1.TuiExpandContentDirective, selector: "[tuiExpandContent]" }, { type: i6__namespace$1.TuiDragDirective, selector: "[tuiDragStart], [tuiDragContinues], [tuiDragEnd]", outputs: ["tuiDragStart", "tuiDragContinues", "tuiDragEnd"] }], pipes: { "json": i5__namespace.JsonPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDemoComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-demo",
+                        templateUrl: "./demo.template.html",
+                        styleUrls: ["./demo.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                        providers: [
+                            i6.TuiDestroyService,
+                            {
+                                provide: i2$1.TuiModeDirective,
+                                useExisting: i0.forwardRef(function () { return TuiDocDemoComponent; }),
+                            },
+                        ],
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TUI_IS_MOBILE]
+                        }] }, { type: i6__namespace$1.TuiDestroyService, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TuiDestroyService]
+                        }] }, { type: i0__namespace.Renderer2, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.Renderer2]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.PLATFORM_ID]
+                        }] }, { type: i5__namespace.Location, decorators: [{
+                            type: i0.Inject,
+                            args: [i5.Location]
+                        }] }, { type: i6__namespace.UrlSerializer, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.UrlSerializer]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_DEMO_TEXTS]
+                        }] }];
+        }, propDecorators: { content: [{
+                    type: i0.ViewChild,
+                    args: ["content"]
+                }], wrapper: [{
+                    type: i0.ViewChild,
+                    args: ["wrapper"]
+                }], resizerText: [{
+                    type: i0.ViewChild,
+                    args: ["resizerText"]
+                }], control: [{
+                    type: i0.Input
+                }], template: [{
+                    type: i0.ContentChild,
+                    args: [i0.TemplateRef]
+                }], onResize: [{
+                    type: i0.HostListener,
+                    args: ["window:resize"]
+                }] } });
 
     var TuiDocDemoModule = /** @class */ (function () {
         function TuiDocDemoModule() {
         }
-        TuiDocDemoModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    forms.ReactiveFormsModule,
-                    forms.FormsModule,
-                    router.RouterModule,
-                    core$1.TuiLinkModule,
-                    cdk.TuiDragModule,
-                    core$1.TuiButtonModule,
-                    kit.TuiSelectModule,
-                    core$1.TuiExpandModule,
-                    core$1.TuiGroupModule,
-                    core$1.TuiTooltipModule,
-                    core$1.TuiModeModule,
-                    kit.TuiRadioBlockModule,
-                    kit.TuiCheckboxLabeledModule,
-                    core$1.TuiSvgModule,
-                    kit.TuiDataListWrapperModule,
-                    core$1.TuiDataListModule,
-                    core$1.TuiTextfieldControllerModule,
-                    core$1.TuiHintControllerModule,
-                ],
-                declarations: [TuiDocDemoComponent],
-                exports: [TuiDocDemoComponent],
-            })
-        ], TuiDocDemoModule);
         return TuiDocDemoModule;
     }());
-
-    /**
-     * TODO: duplicate, need fix it before v3
-     * TODO: move another package for reuse between addon-editor and addon-doc
-     * @deprecated: use {@link tuiRgbToHex} instead
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function rgbToHex(r, g, b) {
-        return "#" + [r, g, b].map(function (x) { return x.toString(16).padStart(2, "0"); }).join("");
-    }
-    var tuiRgbToHex = rgbToHex;
-    /**
-     * @deprecated: use {@link tuiHexToRgb} instead
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function hexToRgb(hex) {
-        var matches = hex
-            .replace("#", "")
-            .split("")
-            .map(function (char, _, array) { return (array.length === 3 ? char + char : char); })
-            .join("")
-            .match(/.{2}/g);
-        return matches
-            ? matches.map(function (x) { return Number.parseInt(x, 16); })
-            : [0, 0, 0];
-    }
-    var tuiHexToRgb = hexToRgb;
+    TuiDocDemoModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDemoModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocDemoModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDemoModule, declarations: [TuiDocDemoComponent], imports: [i5.CommonModule,
+            i5$1.ReactiveFormsModule,
+            i5$1.FormsModule,
+            i6$1.RouterModule,
+            i2$1.TuiLinkModule,
+            i6.TuiDragModule,
+            i2$1.TuiButtonModule,
+            i1.TuiSelectModule,
+            i2$1.TuiExpandModule,
+            i2$1.TuiGroupModule,
+            i2$1.TuiTooltipModule,
+            i2$1.TuiModeModule,
+            i1.TuiRadioBlockModule,
+            i1.TuiCheckboxLabeledModule,
+            i2$1.TuiSvgModule,
+            i1.TuiDataListWrapperModule,
+            i2$1.TuiDataListModule,
+            i2$1.TuiTextfieldControllerModule,
+            i2$1.TuiHintControllerModule], exports: [TuiDocDemoComponent] });
+    TuiDocDemoModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDemoModule, imports: [[
+                i5.CommonModule,
+                i5$1.ReactiveFormsModule,
+                i5$1.FormsModule,
+                i6$1.RouterModule,
+                i2$1.TuiLinkModule,
+                i6.TuiDragModule,
+                i2$1.TuiButtonModule,
+                i1.TuiSelectModule,
+                i2$1.TuiExpandModule,
+                i2$1.TuiGroupModule,
+                i2$1.TuiTooltipModule,
+                i2$1.TuiModeModule,
+                i1.TuiRadioBlockModule,
+                i1.TuiCheckboxLabeledModule,
+                i2$1.TuiSvgModule,
+                i1.TuiDataListWrapperModule,
+                i2$1.TuiDataListModule,
+                i2$1.TuiTextfieldControllerModule,
+                i2$1.TuiHintControllerModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDemoModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i5$1.ReactiveFormsModule,
+                            i5$1.FormsModule,
+                            i6$1.RouterModule,
+                            i2$1.TuiLinkModule,
+                            i6.TuiDragModule,
+                            i2$1.TuiButtonModule,
+                            i1.TuiSelectModule,
+                            i2$1.TuiExpandModule,
+                            i2$1.TuiGroupModule,
+                            i2$1.TuiTooltipModule,
+                            i2$1.TuiModeModule,
+                            i1.TuiRadioBlockModule,
+                            i1.TuiCheckboxLabeledModule,
+                            i2$1.TuiSvgModule,
+                            i1.TuiDataListWrapperModule,
+                            i2$1.TuiDataListModule,
+                            i2$1.TuiTextfieldControllerModule,
+                            i2$1.TuiHintControllerModule,
+                        ],
+                        declarations: [TuiDocDemoComponent],
+                        exports: [TuiDocDemoComponent],
+                    }]
+            }] });
 
     function inspectArray(array, depth) {
         if (depth === 0) {
@@ -669,7 +822,7 @@
             else {
                 result += ", ";
             }
-            result += index in array ? inspectAny(array[index], depth - 1) : "empty";
+            result += index in array ? tuiInspectAny(array[index], depth - 1) : "empty";
         }
         return "[" + result + "]";
     }
@@ -689,19 +842,17 @@
             else {
                 result += ", ";
             }
-            result += key + ": " + inspectAny(object[key], depth - 1);
+            result += key + ": " + tuiInspectAny(object[key], depth - 1);
         }
         return "{" + result + "}";
     }
     /**
-     * @deprecated: use {@link tuiInspectAny} instead
      * Returns readable JS entity
      * @param data
      * @param depth
      * @return readable JS entity
      */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function inspectAny(data, depth) {
+    function tuiInspectAny(data, depth) {
         if (data === null) {
             return "null";
         }
@@ -722,13 +873,8 @@
         }
         return inspectObject(data, depth);
     }
-    var tuiInspectAny = inspectAny;
 
-    /**
-     * @deprecated: use {@link tuiCoerceValue} instead
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function coerceValue(value) {
+    function tuiCoerceValue(value) {
         var prepared = String(value).trim();
         if (isEmptyParamValue(prepared)) {
             return null;
@@ -749,7 +895,6 @@
             return decodedValue;
         }
     }
-    var tuiCoerceValue = coerceValue;
     function isEmptyParamValue(value) {
         return ["undefined", "null", "NaN", "Infinity"].includes(value);
     }
@@ -781,9 +926,9 @@
             this.documentationPropertyType = "";
             this.documentationPropertyDeprecated = false;
             this.documentationPropertyValues = null;
-            this.documentationPropertyValueChange = new core.EventEmitter();
-            this.changed$ = new rxjs.Subject();
-            this.emits$ = new rxjs.BehaviorSubject(1);
+            this.documentationPropertyValueChange = new i0.EventEmitter();
+            this.changed$ = new i9.Subject();
+            this.emits$ = new i9.BehaviorSubject(1);
         }
         TuiDocDocumentationPropertyConnectorDirective.prototype.ngOnInit = function () {
             this.parseParams(this.activatedRoute.snapshot.queryParams);
@@ -801,21 +946,21 @@
                         return this.documentationPropertyName;
                 }
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         Object.defineProperty(TuiDocDocumentationPropertyConnectorDirective.prototype, "hasItems", {
             get: function () {
                 return !!this.documentationPropertyValues;
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         Object.defineProperty(TuiDocDocumentationPropertyConnectorDirective.prototype, "shouldShowValues", {
             get: function () {
                 return this.documentationPropertyMode !== "output";
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         TuiDocDocumentationPropertyConnectorDirective.prototype.ngOnChanges = function () {
@@ -839,7 +984,7 @@
             }
             var value = !!propertyValueWithSuffix && this.documentationPropertyValues
                 ? this.documentationPropertyValues[propertyValueWithSuffix]
-                : coerceValue(propertyValue);
+                : tuiCoerceValue(propertyValue);
             this.onValueChange(value);
         };
         TuiDocDocumentationPropertyConnectorDirective.prototype.setQueryParam = function (value) {
@@ -851,52 +996,87 @@
                 : value;
             var suffix = isValueAvailableByKey ? SERIALIZED_SUFFIX : "";
             var propName = this.documentationPropertyName + suffix;
-            tree.queryParams = __assign(__assign({}, tree.queryParams), (_a = {}, _a[propName] = computedValue, _a));
+            tree.queryParams = Object.assign(Object.assign({}, tree.queryParams), (_a = {}, _a[propName] = computedValue, _a));
             this.locationRef.go(String(tree));
         };
-        TuiDocDocumentationPropertyConnectorDirective.ctorParameters = function () { return [
-            { type: core.TemplateRef, decorators: [{ type: core.Inject, args: [core.TemplateRef,] }] },
-            { type: common.Location, decorators: [{ type: core.Inject, args: [common.Location,] }] },
-            { type: router.ActivatedRoute, decorators: [{ type: core.Inject, args: [router.ActivatedRoute,] }] },
-            { type: router.UrlSerializer, decorators: [{ type: core.Inject, args: [router.UrlSerializer,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyName", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyMode", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyType", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyValue", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyDeprecated", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyValues", void 0);
-        __decorate([
-            core.Output()
-        ], TuiDocDocumentationPropertyConnectorDirective.prototype, "documentationPropertyValueChange", void 0);
-        TuiDocDocumentationPropertyConnectorDirective = __decorate([
-            core.Directive({
-                selector: "ng-template[documentationPropertyName]",
-                exportAs: "documentationProperty",
-            }),
-            __param(0, core.Inject(core.TemplateRef)),
-            __param(1, core.Inject(common.Location)),
-            __param(2, core.Inject(router.ActivatedRoute)),
-            __param(3, core.Inject(router.UrlSerializer))
-        ], TuiDocDocumentationPropertyConnectorDirective);
         return TuiDocDocumentationPropertyConnectorDirective;
     }());
+    TuiDocDocumentationPropertyConnectorDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationPropertyConnectorDirective, deps: [{ token: i0.TemplateRef }, { token: i5.Location }, { token: i6$1.ActivatedRoute }, { token: i6$1.UrlSerializer }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    TuiDocDocumentationPropertyConnectorDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocDocumentationPropertyConnectorDirective, selector: "ng-template[documentationPropertyName]", inputs: { documentationPropertyName: "documentationPropertyName", documentationPropertyMode: "documentationPropertyMode", documentationPropertyType: "documentationPropertyType", documentationPropertyValue: "documentationPropertyValue", documentationPropertyDeprecated: "documentationPropertyDeprecated", documentationPropertyValues: "documentationPropertyValues" }, outputs: { documentationPropertyValueChange: "documentationPropertyValueChange" }, exportAs: ["documentationProperty"], usesOnChanges: true, ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationPropertyConnectorDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: "ng-template[documentationPropertyName]",
+                        exportAs: "documentationProperty",
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i0__namespace.TemplateRef, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.TemplateRef]
+                        }] }, { type: i5__namespace.Location, decorators: [{
+                            type: i0.Inject,
+                            args: [i5.Location]
+                        }] }, { type: i6__namespace.ActivatedRoute, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.ActivatedRoute]
+                        }] }, { type: i6__namespace.UrlSerializer, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.UrlSerializer]
+                        }] }];
+        }, propDecorators: { documentationPropertyName: [{
+                    type: i0.Input
+                }], documentationPropertyMode: [{
+                    type: i0.Input
+                }], documentationPropertyType: [{
+                    type: i0.Input
+                }], documentationPropertyValue: [{
+                    type: i0.Input
+                }], documentationPropertyDeprecated: [{
+                    type: i0.Input
+                }], documentationPropertyValues: [{
+                    type: i0.Input
+                }], documentationPropertyValueChange: [{
+                    type: i0.Output
+                }] } });
+
+    var TuiInputOpacityDirective = /** @class */ (function () {
+        function TuiInputOpacityDirective(renderer, tuiFocusableComponent) {
+            this.renderer = renderer;
+            this.tuiFocusableComponent = tuiFocusableComponent;
+        }
+        Object.defineProperty(TuiInputOpacityDirective.prototype, "tuiInputOpacity", {
+            set: function (opacity) {
+                var nativeFocusableElement = this.tuiFocusableComponent.nativeFocusableElement;
+                if (nativeFocusableElement) {
+                    this.renderer.setStyle(nativeFocusableElement, "opacity", opacity / 100);
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return TuiInputOpacityDirective;
+    }());
+    TuiInputOpacityDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiInputOpacityDirective, deps: [{ token: i0.Renderer2 }, { token: i6.TUI_FOCUSABLE_ITEM_ACCESSOR }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    TuiInputOpacityDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiInputOpacityDirective, selector: "[tuiInputOpacity]", inputs: { tuiInputOpacity: "tuiInputOpacity" }, ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiInputOpacityDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: "[tuiInputOpacity]",
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i0__namespace.Renderer2, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.Renderer2]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TUI_FOCUSABLE_ITEM_ACCESSOR]
+                        }] }];
+        }, propDecorators: { tuiInputOpacity: [{
+                    type: i0.Input
+                }] } });
 
     // @bad TODO subscribe propertiesConnectors changes
     // @bad TODO refactor to make more flexible
-    // @dynamic
     var TuiDocDocumentationComponent = /** @class */ (function () {
         function TuiDocDocumentationComponent(changeDetectorRef, texts) {
             this.changeDetectorRef = changeDetectorRef;
@@ -904,29 +1084,29 @@
             this.heading = "";
             this.showValues = true;
             this.isAPI = false;
-            this.propertiesConnectors = cdk.EMPTY_QUERY;
+            this.propertiesConnectors = i6.EMPTY_QUERY;
             this.activeItemIndex = 0;
         }
         TuiDocDocumentationComponent.prototype.ngAfterContentInit = function () {
-            cdk.itemsQueryListObservable(this.propertiesConnectors)
-                .pipe(operators.switchMap(function (items) { return rxjs.merge.apply(void 0, __spread(items.map(function (_a) {
+            i6.tuiItemsQueryListObservable(this.propertiesConnectors)
+                .pipe(operators.switchMap(function (items) { return i9.merge.apply(void 0, __spreadArray([], __read(items.map(function (_a) {
                 var changed$ = _a.changed$;
                 return changed$;
-            }))); }), cdk.watch(this.changeDetectorRef))
+            })))); }), i6.tuiWatch(this.changeDetectorRef))
                 .subscribe();
         };
         Object.defineProperty(TuiDocDocumentationComponent.prototype, "type", {
             get: function () {
                 return this.isAPI ? this.texts[0] : this.texts[1];
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         TuiDocDocumentationComponent.prototype.getColor = function (color) {
             if (color.length === 4) {
                 return color
                     .split("")
-                    .reduce(function (result, current) { return __spread(result, [current, current]); }, [])
+                    .reduce(function (result, current) { return __spreadArray(__spreadArray([], __read(result)), [current, current]); }, [])
                     .join("")
                     .replace("#", "");
             }
@@ -943,7 +1123,7 @@
                 .replace(" ", "")
                 .split(",")
                 .map(function (v) { return Number.parseInt(v, 10); });
-            return rgbToHex.apply(void 0, __spread(parsed));
+            return i6.tuiRgbToHex.apply(void 0, __spreadArray([], __read(parsed)));
         };
         TuiDocDocumentationComponent.prototype.getOpacity = function (color) {
             if (color.startsWith("#") || color.startsWith("rgb(")) {
@@ -966,13 +1146,13 @@
                 connector.onValueChange(color);
                 return;
             }
-            var rgb = hexToRgb(color).join(", ");
+            var rgb = i6.tuiHexToRgb(color).join(", ");
             var result = "rgba(" + rgb + ", " + opacity / 100 + ")";
             connector.onValueChange(result);
         };
         TuiDocDocumentationComponent.prototype.onOpacityChange = function (connector, opacity) {
             var hex = this.getColor(connector.documentationPropertyValue || "");
-            var rgb = hexToRgb(hex);
+            var rgb = i6.tuiHexToRgb(hex);
             var result = "rgba(" + rgb + ", " + opacity / 100 + ")";
             connector.onValueChange(result);
         };
@@ -983,7 +1163,7 @@
             return name.includes("?");
         };
         TuiDocDocumentationComponent.prototype.isPrimitivePolymorpheusContent = function (value) {
-            return typeof value === "string" || typeof value === "number";
+            return i6.tuiIsString(value) || i6.tuiIsNumber(value);
         };
         TuiDocDocumentationComponent.prototype.showCleaner = function (type) {
             return type.includes("null");
@@ -992,138 +1172,156 @@
             return type.includes("PolymorpheusContent");
         };
         TuiDocDocumentationComponent.prototype.inspectAny = function (data) {
-            return inspectAny(data, 2);
+            return tuiInspectAny(data, 2);
         };
-        TuiDocDocumentationComponent.ctorParameters = function () { return [
-            { type: core.ChangeDetectorRef, decorators: [{ type: core.Inject, args: [core.ChangeDetectorRef,] }] },
-            { type: Array, decorators: [{ type: core.Inject, args: [TUI_DOC_DOCUMENTATION_TEXTS,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationComponent.prototype, "heading", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationComponent.prototype, "showValues", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocDocumentationComponent.prototype, "isAPI", void 0);
-        __decorate([
-            core.ContentChildren(TuiDocDocumentationPropertyConnectorDirective)
-        ], TuiDocDocumentationComponent.prototype, "propertiesConnectors", void 0);
-        TuiDocDocumentationComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-documentation",
-                template: "<h1\n    *ngIf=\"heading\"\n    class=\"t-heading\"\n>\n    {{ heading }}\n</h1>\n<ng-content></ng-content>\n<table class=\"t-table\">\n    <tr class=\"t-row t-row_header\">\n        <th class=\"t-th t-cell t-cell_prop\">{{ texts[2] }}</th>\n        <th class=\"t-th\">{{ type }}</th>\n        <th\n            *ngIf=\"showValues && !isAPI\"\n            class=\"t-th t-cell t-cell_value\"\n        >\n            {{ texts[3] }}\n        </th>\n    </tr>\n    <tr\n        *ngFor=\"let propertyConnector of propertiesConnectors\"\n        class=\"t-row\"\n        [class.t-deprecated]=\"propertyConnector.documentationPropertyDeprecated\"\n    >\n        <td class=\"t-cell\">\n            <div\n                automation-id=\"tui-documentation__property-name\"\n                class=\"t-property\"\n            >\n                {{ stripOptional(propertyConnector.attrName) }}\n                <tui-badge\n                    *ngIf=\"isOptional(propertyConnector.attrName)\"\n                    size=\"s\"\n                    value=\"Optional\"\n                ></tui-badge>\n            </div>\n            <span\n                *ngIf=\"propertyConnector.documentationPropertyDeprecated\"\n                class=\"t-deprecated-label\"\n            >\n                deprecated\n            </span>\n            <ng-container [ngTemplateOutlet]=\"propertyConnector.template\"></ng-container>\n        </td>\n        <td class=\"t-cell\">\n            <span class=\"type\">\n                {{ propertyConnector.documentationPropertyType }}\n                <tui-tooltip\n                    *ngIf=\"showContentTooltip(propertyConnector.documentationPropertyType)\"\n                    [describeId]=\"propertyConnector.attrName\"\n                    [content]=\"content\"\n                >\n                    <ng-template #content>\n                        {{ texts[4] }}\n                        <a\n                            tuiLink\n                            tuiMode=\"onDark\"\n                            target=\"_blank\"\n                            href=\"https://github.com/tinkoff/ng-polymorpheus\"\n                        >\n                            <code>ng-polymorpheus</code>\n                        </a>\n                    </ng-template>\n                </tui-tooltip>\n            </span>\n        </td>\n        <td\n            *ngIf=\"showValues\"\n            class=\"t-cell\"\n        >\n            <ng-container *ngIf=\"propertyConnector.shouldShowValues; else elseEmitter\">\n                <tui-select\n                    *ngIf=\"propertyConnector.hasItems; else noItems\"\n                    tuiTextfieldSize=\"m\"\n                    tuiDropdownLimitWidth=\"min\"\n                    [tuiTextfieldCleaner]=\"showCleaner(propertyConnector.documentationPropertyType)\"\n                    [tuiTextfieldLabelOutside]=\"true\"\n                    [nativeId]=\"propertyConnector.attrName\"\n                    [valueContent]=\"selectContent\"\n                    [ngModel]=\"propertyConnector.documentationPropertyValue\"\n                    (ngModelChange)=\"propertyConnector.onValueChange($event)\"\n                >\n                    <code class=\"t-exception\">null</code>\n                    <tui-data-list-wrapper\n                        *tuiDataList\n                        [items]=\"propertyConnector.documentationPropertyValues\"\n                        [itemContent]=\"selectContent\"\n                    ></tui-data-list-wrapper>\n                </tui-select>\n                <ng-template\n                    #selectContent\n                    let-data\n                >\n                    <code>{{ inspectAny(data) }}</code>\n                </ng-template>\n\n                <ng-template #noItems>\n                    <ng-container [ngSwitch]=\"propertyConnector.documentationPropertyType\">\n                        <tui-toggle\n                            *ngSwitchCase=\"'boolean'\"\n                            size=\"l\"\n                            [nativeId]=\"propertyConnector.attrName\"\n                            [showIcons]=\"true\"\n                            [ngModel]=\"propertyConnector.documentationPropertyValue\"\n                            (ngModelChange)=\"propertyConnector.onValueChange($event)\"\n                        ></tui-toggle>\n\n                        <tui-primitive-textfield\n                            *ngSwitchCase=\"'string'\"\n                            tuiTextfieldSize=\"m\"\n                            [nativeId]=\"propertyConnector.attrName\"\n                            [tuiTextfieldLabelOutside]=\"true\"\n                            [tuiTextfieldCleaner]=\"true\"\n                            [value]=\"propertyConnector.documentationPropertyValue || ''\"\n                            (valueChange)=\"propertyConnector.onValueChange($event)\"\n                        ></tui-primitive-textfield>\n\n                        <div\n                            *ngSwitchCase=\"'color'\"\n                            tuiGroup\n                        >\n                            <tui-primitive-textfield\n                                tuiTextfieldType=\"text\"\n                                tuiTextfieldSize=\"m\"\n                                [attr.id]=\"propertyConnector.attrName\"\n                                [tuiTextfieldLabelOutside]=\"true\"\n                                [tuiInputOpacity]=\"getOpacity(propertyConnector.documentationPropertyValue)\"\n                                [value]=\"getColor(propertyConnector.documentationPropertyValue)\"\n                                (valueChange)=\"onColorChange(propertyConnector, $event)\"\n                            ></tui-primitive-textfield>\n                            <tui-input-count\n                                tuiTextfieldSize=\"m\"\n                                [max]=\"100\"\n                                [ngModel]=\"getOpacity(propertyConnector.documentationPropertyValue)\"\n                                (ngModelChange)=\"onOpacityChange(propertyConnector, $event)\"\n                            >\n                                Opacity\n                            </tui-input-count>\n                        </div>\n\n                        <tui-input-count\n                            *ngSwitchCase=\"'number'\"\n                            tuiTextfieldSize=\"m\"\n                            [nativeId]=\"propertyConnector.attrName\"\n                            [tuiTextfieldLabelOutside]=\"true\"\n                            [ngModel]=\"propertyConnector.documentationPropertyValue\"\n                            (ngModelChange)=\"propertyConnector.onValueChange($event)\"\n                        ></tui-input-count>\n\n                        <ng-container *ngSwitchCase=\"'PolymorpheusContent'\">\n                            <tui-primitive-textfield\n                                *ngIf=\"isPrimitivePolymorpheusContent(propertyConnector.documentationPropertyValue)\"\n                                tuiTextfieldSize=\"m\"\n                                [nativeId]=\"propertyConnector.attrName\"\n                                [tuiTextfieldLabelOutside]=\"true\"\n                                [tuiTextfieldCleaner]=\"true\"\n                                [value]=\"propertyConnector.documentationPropertyValue.toString()\"\n                                (valueChange)=\"propertyConnector.onValueChange($event)\"\n                            >\n                                Default content\n                            </tui-primitive-textfield>\n                        </ng-container>\n                    </ng-container>\n                </ng-template>\n            </ng-container>\n\n            <ng-template #elseEmitter>\n                <tui-notification\n                    class=\"t-output\"\n                    [@emitEvent]=\"propertyConnector.emits$ | async\"\n                >\n                    Emit!\n                </tui-notification>\n            </ng-template>\n        </td>\n    </tr>\n</table>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                animations: [
-                    animations.trigger("emitEvent", [
-                        animations.transition(":increment", [animations.style({ opacity: 1 }), animations.animate("500ms ease-in")]),
-                    ]),
-                ],
-                styles: [":host{display:block;min-width:100%}.t-table{width:100%;table-layout:fixed}.t-row:not(:last-child){border-bottom:1px solid var(--tui-base-03)}:host-context(tui-root._mobile) .t-row{display:flex;flex-wrap:wrap}:host-context(tui-root._mobile) .t-row_header{display:none}.t-cell{padding:1rem 1rem .875rem}.t-cell:first-child{padding-left:0}.t-cell:last-child{padding-right:0;text-align:right}.t-cell_prop{width:40%}.t-cell_value{max-width:20rem}:host-context(tui-root._mobile) .t-cell_value{width:9.375rem}:host-context(tui-root._mobile) .t-cell{width:100%;height:auto;padding:.5rem 0;text-align:left}.t-th{padding:.5rem 1rem;color:var(--tui-text-02);font-weight:400;text-align:left}.t-property{font:var(--tui-font-text-m);margin-bottom:.25rem;font-family:monospace;color:#8f75d1}:host-context(tui-root._mobile) .t-property{padding:.5rem 0}.t-type{font-family:monospace}.t-deprecated{background-color:var(--tui-error-bg);box-shadow:-1rem 0 var(--tui-error-bg),1rem 0 var(--tui-error-bg)}.t-deprecated-label{margin-right:.125rem;color:var(--tui-error-fill)}.t-exception{display:block;width:-webkit-max-content;width:-moz-max-content;width:max-content}.t-output{text-align:left;opacity:0}.t-heading{font:var(--tui-font-heading-4)}"]
-            }),
-            __param(0, core.Inject(core.ChangeDetectorRef)),
-            __param(1, core.Inject(TUI_DOC_DOCUMENTATION_TEXTS))
-        ], TuiDocDocumentationComponent);
         return TuiDocDocumentationComponent;
     }());
-
-    var TuiInputOpacityDirective = /** @class */ (function () {
-        function TuiInputOpacityDirective(renderer, tuiFocusableComponent) {
-            this.renderer = renderer;
-            this.tuiFocusableComponent = tuiFocusableComponent;
-        }
-        Object.defineProperty(TuiInputOpacityDirective.prototype, "tuiInputOpacity", {
-            set: function (opacity) {
-                var nativeFocusableElement = this.tuiFocusableComponent.nativeFocusableElement;
-                if (nativeFocusableElement) {
-                    this.renderer.setStyle(nativeFocusableElement, "opacity", opacity / 100);
-                }
-            },
-            enumerable: true,
-            configurable: true
-        });
-        TuiInputOpacityDirective.ctorParameters = function () { return [
-            { type: core.Renderer2, decorators: [{ type: core.Inject, args: [core.Renderer2,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [cdk.TUI_FOCUSABLE_ITEM_ACCESSOR,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiInputOpacityDirective.prototype, "tuiInputOpacity", null);
-        TuiInputOpacityDirective = __decorate([
-            core.Directive({
-                selector: "[tuiInputOpacity]",
-            }),
-            __param(0, core.Inject(core.Renderer2)),
-            __param(1, core.Inject(cdk.TUI_FOCUSABLE_ITEM_ACCESSOR))
-        ], TuiInputOpacityDirective);
-        return TuiInputOpacityDirective;
-    }());
+    TuiDocDocumentationComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TUI_DOC_DOCUMENTATION_TEXTS }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocDocumentationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocDocumentationComponent, selector: "tui-doc-documentation", inputs: { heading: "heading", showValues: "showValues", isAPI: "isAPI" }, queries: [{ propertyName: "propertiesConnectors", predicate: TuiDocDocumentationPropertyConnectorDirective }], ngImport: i0__namespace, template: "<h1\n    *ngIf=\"heading\"\n    class=\"t-heading\"\n>\n    {{ heading }}\n</h1>\n<ng-content></ng-content>\n<table class=\"t-table\">\n    <tr class=\"t-row t-row_header\">\n        <th class=\"t-th t-cell t-cell_prop\">{{ texts[2] }}</th>\n        <th class=\"t-th\">{{ type }}</th>\n        <th\n            *ngIf=\"showValues && !isAPI\"\n            class=\"t-th t-cell t-cell_value\"\n        >\n            {{ texts[3] }}\n        </th>\n    </tr>\n    <tr\n        *ngFor=\"let propertyConnector of propertiesConnectors\"\n        class=\"t-row\"\n        [class.t-deprecated]=\"propertyConnector.documentationPropertyDeprecated\"\n    >\n        <td class=\"t-cell\">\n            <div\n                automation-id=\"tui-documentation__property-name\"\n                class=\"t-property\"\n            >\n                {{ stripOptional(propertyConnector.attrName) }}\n                <tui-badge\n                    *ngIf=\"isOptional(propertyConnector.attrName)\"\n                    size=\"s\"\n                    value=\"Optional\"\n                ></tui-badge>\n            </div>\n            <span\n                *ngIf=\"propertyConnector.documentationPropertyDeprecated\"\n                class=\"t-deprecated-label\"\n            >\n                deprecated\n            </span>\n            <ng-container [ngTemplateOutlet]=\"propertyConnector.template\"></ng-container>\n        </td>\n        <td class=\"t-cell\">\n            <span class=\"type\">\n                {{ propertyConnector.documentationPropertyType }}\n                <tui-tooltip\n                    *ngIf=\"showContentTooltip(propertyConnector.documentationPropertyType)\"\n                    [describeId]=\"propertyConnector.attrName\"\n                    [content]=\"content\"\n                >\n                    <ng-template #content>\n                        {{ texts[4] }}\n                        <a\n                            tuiLink\n                            tuiMode=\"onDark\"\n                            target=\"_blank\"\n                            href=\"https://github.com/tinkoff/ng-polymorpheus\"\n                        >\n                            <code>ng-polymorpheus</code>\n                        </a>\n                    </ng-template>\n                </tui-tooltip>\n            </span>\n        </td>\n        <td\n            *ngIf=\"showValues\"\n            class=\"t-cell\"\n        >\n            <ng-container *ngIf=\"propertyConnector.shouldShowValues; else elseEmitter\">\n                <tui-select\n                    *ngIf=\"propertyConnector.hasItems; else noItems\"\n                    tuiTextfieldSize=\"m\"\n                    tuiDropdownLimitWidth=\"min\"\n                    [tuiTextfieldCleaner]=\"showCleaner(propertyConnector.documentationPropertyType)\"\n                    [tuiTextfieldLabelOutside]=\"true\"\n                    [nativeId]=\"propertyConnector.attrName\"\n                    [valueContent]=\"selectContent\"\n                    [ngModel]=\"propertyConnector.documentationPropertyValue\"\n                    (ngModelChange)=\"propertyConnector.onValueChange($event)\"\n                >\n                    <code class=\"t-exception\">null</code>\n                    <tui-data-list-wrapper\n                        *tuiDataList\n                        [items]=\"propertyConnector.documentationPropertyValues\"\n                        [itemContent]=\"selectContent\"\n                    ></tui-data-list-wrapper>\n                </tui-select>\n                <ng-template\n                    #selectContent\n                    let-data\n                >\n                    <code>{{ inspectAny(data) }}</code>\n                </ng-template>\n\n                <ng-template #noItems>\n                    <ng-container [ngSwitch]=\"propertyConnector.documentationPropertyType\">\n                        <tui-toggle\n                            *ngSwitchCase=\"'boolean'\"\n                            size=\"l\"\n                            [nativeId]=\"propertyConnector.attrName\"\n                            [showIcons]=\"true\"\n                            [ngModel]=\"propertyConnector.documentationPropertyValue\"\n                            (ngModelChange)=\"propertyConnector.onValueChange($event)\"\n                        ></tui-toggle>\n\n                        <tui-primitive-textfield\n                            *ngSwitchCase=\"'string'\"\n                            tuiTextfieldSize=\"m\"\n                            [nativeId]=\"propertyConnector.attrName\"\n                            [tuiTextfieldLabelOutside]=\"true\"\n                            [tuiTextfieldCleaner]=\"true\"\n                            [value]=\"propertyConnector.documentationPropertyValue || ''\"\n                            (valueChange)=\"propertyConnector.onValueChange($event)\"\n                        ></tui-primitive-textfield>\n\n                        <div\n                            *ngSwitchCase=\"'color'\"\n                            tuiGroup\n                        >\n                            <tui-primitive-textfield\n                                tuiTextfieldType=\"text\"\n                                tuiTextfieldSize=\"m\"\n                                [attr.id]=\"propertyConnector.attrName\"\n                                [tuiTextfieldLabelOutside]=\"true\"\n                                [tuiInputOpacity]=\"getOpacity(propertyConnector.documentationPropertyValue)\"\n                                [value]=\"getColor(propertyConnector.documentationPropertyValue)\"\n                                (valueChange)=\"onColorChange(propertyConnector, $event)\"\n                            ></tui-primitive-textfield>\n                            <tui-input-count\n                                tuiTextfieldSize=\"m\"\n                                [max]=\"100\"\n                                [ngModel]=\"getOpacity(propertyConnector.documentationPropertyValue)\"\n                                (ngModelChange)=\"onOpacityChange(propertyConnector, $event)\"\n                            >\n                                Opacity\n                            </tui-input-count>\n                        </div>\n\n                        <tui-input-count\n                            *ngSwitchCase=\"'number'\"\n                            tuiTextfieldSize=\"m\"\n                            [nativeId]=\"propertyConnector.attrName\"\n                            [tuiTextfieldLabelOutside]=\"true\"\n                            [ngModel]=\"propertyConnector.documentationPropertyValue\"\n                            (ngModelChange)=\"propertyConnector.onValueChange($event)\"\n                        ></tui-input-count>\n\n                        <ng-container *ngSwitchCase=\"'PolymorpheusContent'\">\n                            <tui-primitive-textfield\n                                *ngIf=\"isPrimitivePolymorpheusContent(propertyConnector.documentationPropertyValue)\"\n                                tuiTextfieldSize=\"m\"\n                                [nativeId]=\"propertyConnector.attrName\"\n                                [tuiTextfieldLabelOutside]=\"true\"\n                                [tuiTextfieldCleaner]=\"true\"\n                                [value]=\"propertyConnector.documentationPropertyValue.toString()\"\n                                (valueChange)=\"propertyConnector.onValueChange($event)\"\n                            >\n                                Default content\n                            </tui-primitive-textfield>\n                        </ng-container>\n                    </ng-container>\n                </ng-template>\n            </ng-container>\n\n            <ng-template #elseEmitter>\n                <tui-notification\n                    class=\"t-output\"\n                    [@emitEvent]=\"propertyConnector.emits$ | async\"\n                >\n                    Emit!\n                </tui-notification>\n            </ng-template>\n        </td>\n    </tr>\n</table>\n", styles: [":host{display:block;min-width:100%}.t-table{width:100%;table-layout:fixed}.t-row:not(:last-child){border-bottom:1px solid var(--tui-base-03)}:host-context(tui-root._mobile) .t-row{display:flex;flex-wrap:wrap}:host-context(tui-root._mobile) .t-row_header{display:none}.t-cell{padding:1rem 1rem .875rem}.t-cell:first-child{padding-left:0}.t-cell:last-child{padding-right:0;text-align:right}.t-cell_prop{width:40%}.t-cell_value{max-width:20rem}:host-context(tui-root._mobile) .t-cell_value{width:9.375rem}:host-context(tui-root._mobile) .t-cell{width:100%;height:auto;padding:.5rem 0;text-align:left}.t-th{padding:.5rem 1rem;color:var(--tui-text-02);font-weight:normal;text-align:left}.t-property{font:var(--tui-font-text-m);margin-bottom:.25rem;font-family:monospace;color:#8f75d1}:host-context(tui-root._mobile) .t-property{padding:.5rem 0}.t-type{font-family:monospace}.t-deprecated{background-color:var(--tui-error-bg);box-shadow:-1rem 0 var(--tui-error-bg),1rem 0 var(--tui-error-bg)}.t-deprecated-label{margin-right:.125rem;color:var(--tui-error-fill)}.t-exception{display:block;width:-webkit-max-content;width:-moz-max-content;width:max-content}.t-output{text-align:left;opacity:0}.t-heading{font:var(--tui-font-heading-4)}\n"], components: [{ type: i1__namespace.TuiBadgeComponent, selector: "tui-badge", inputs: ["value", "size", "status", "hoverable"] }, { type: i2__namespace$1.TuiTooltipComponent, selector: "tui-tooltip", inputs: ["content", "direction", "appearance", "showDelay", "hideDelay", "describeId"] }, { type: i2__namespace$1.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { type: i1__namespace.TuiSelectComponent, selector: "tui-select", inputs: ["stringify", "identityMatcher", "valueContent"] }, { type: i1__namespace.TuiDataListWrapperComponent, selector: "tui-data-list-wrapper:not([labels])", inputs: ["items"] }, { type: i1__namespace.TuiToggleComponent, selector: "tui-toggle", inputs: ["singleColor", "showIcons", "showLoader", "size"] }, { type: i2__namespace$1.TuiPrimitiveTextfieldComponent, selector: "tui-primitive-textfield", inputs: ["editable", "filler", "iconCleaner", "readOnly", "invalid", "disabled", "prefix", "postfix", "value"], outputs: ["valueChange"] }, { type: i1__namespace.TuiInputCountComponent, selector: "tui-input-count", inputs: ["step", "min", "max", "hideButtons", "prefix", "postfix"] }, { type: i2__namespace$1.TuiNotificationComponent, selector: "tui-notification", inputs: ["hasIcon", "status"], outputs: ["close"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2__namespace$1.TuiModeDirective, selector: "[tuiMode]", inputs: ["tuiMode"] }, { type: i1__namespace.TuiSelectDirective, selector: "tui-select" }, { type: i2__namespace$1.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { type: i2__namespace$1.TuiDropdownOptionsDirective, selector: "[tuiDropdownAlign], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight]", inputs: ["tuiDropdownAlign", "tuiDropdownDirection", "tuiDropdownLimitWidth", "tuiDropdownMinHeight", "tuiDropdownMaxHeight"] }, { type: i2__namespace$1.TuiTextfieldCleanerDirective, selector: "[tuiTextfieldCleaner]", inputs: ["tuiTextfieldCleaner"] }, { type: i2__namespace$1.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { type: i5__namespace$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5__namespace$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2__namespace$1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2__namespace$1.TuiPrimitiveTextfieldDirective, selector: "tui-primitive-textfield" }, { type: i2__namespace$1.TuiGroupDirective, selector: "[tuiGroup]:not(ng-container)", inputs: ["orientation", "adaptive", "collapsed", "rounded", "size"] }, { type: i2__namespace$1.TuiTextfieldTypeDirective, selector: "[tuiTextfieldType]", inputs: ["tuiTextfieldType"] }, { type: TuiInputOpacityDirective, selector: "[tuiInputOpacity]", inputs: ["tuiInputOpacity"] }, { type: i1__namespace.TuiInputCountDirective, selector: "tui-input-count" }], pipes: { "async": i5__namespace.AsyncPipe }, animations: [
+            animations.trigger("emitEvent", [
+                animations.transition(":increment", [animations.style({ opacity: 1 }), animations.animate("500ms ease-in")]),
+            ]),
+        ], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-documentation",
+                        templateUrl: "./documentation.template.html",
+                        styleUrls: ["./documentation.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                        animations: [
+                            animations.trigger("emitEvent", [
+                                animations.transition(":increment", [animations.style({ opacity: 1 }), animations.animate("500ms ease-in")]),
+                            ]),
+                        ],
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i0__namespace.ChangeDetectorRef, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.ChangeDetectorRef]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_DOCUMENTATION_TEXTS]
+                        }] }];
+        }, propDecorators: { heading: [{
+                    type: i0.Input
+                }], showValues: [{
+                    type: i0.Input
+                }], isAPI: [{
+                    type: i0.Input
+                }], propertiesConnectors: [{
+                    type: i0.ContentChildren,
+                    args: [TuiDocDocumentationPropertyConnectorDirective]
+                }] } });
 
     var TuiInputOpacityModule = /** @class */ (function () {
         function TuiInputOpacityModule() {
         }
-        TuiInputOpacityModule = __decorate([
-            core.NgModule({
-                declarations: [TuiInputOpacityDirective],
-                exports: [TuiInputOpacityDirective],
-            })
-        ], TuiInputOpacityModule);
         return TuiInputOpacityModule;
     }());
+    TuiInputOpacityModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiInputOpacityModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiInputOpacityModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiInputOpacityModule, declarations: [TuiInputOpacityDirective], exports: [TuiInputOpacityDirective] });
+    TuiInputOpacityModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiInputOpacityModule });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiInputOpacityModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [TuiInputOpacityDirective],
+                        exports: [TuiInputOpacityDirective],
+                    }]
+            }] });
 
     var TuiDocDocumentationModule = /** @class */ (function () {
         function TuiDocDocumentationModule() {
         }
-        TuiDocDocumentationModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    forms.FormsModule,
-                    router.RouterModule,
-                    kit.TuiBadgeModule,
-                    kit.TuiSelectModule,
-                    kit.TuiToggleModule,
-                    core$1.TuiTooltipModule,
-                    core$1.TuiLinkModule,
-                    kit.TuiInputCountModule,
-                    core$1.TuiModeModule,
-                    core$1.TuiGroupModule,
-                    TuiInputOpacityModule,
-                    core$1.TuiPrimitiveTextfieldModule,
-                    core$1.TuiTextfieldControllerModule,
-                    core$1.TuiHintControllerModule,
-                    core$1.TuiDropdownControllerModule,
-                    core$1.TuiDataListModule,
-                    kit.TuiDataListWrapperModule,
-                    core$1.TuiNotificationModule,
-                ],
-                declarations: [
-                    TuiDocDocumentationComponent,
-                    TuiDocDocumentationPropertyConnectorDirective,
-                ],
-                exports: [
-                    TuiDocDocumentationComponent,
-                    TuiDocDocumentationPropertyConnectorDirective,
-                ],
-            })
-        ], TuiDocDocumentationModule);
         return TuiDocDocumentationModule;
     }());
+    TuiDocDocumentationModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocDocumentationModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationModule, declarations: [TuiDocDocumentationComponent,
+            TuiDocDocumentationPropertyConnectorDirective], imports: [i5.CommonModule,
+            i5$1.FormsModule,
+            i6$1.RouterModule,
+            i1.TuiBadgeModule,
+            i1.TuiSelectModule,
+            i1.TuiToggleModule,
+            i2$1.TuiTooltipModule,
+            i2$1.TuiLinkModule,
+            i1.TuiInputCountModule,
+            i2$1.TuiModeModule,
+            i2$1.TuiGroupModule,
+            TuiInputOpacityModule,
+            i2$1.TuiPrimitiveTextfieldModule,
+            i2$1.TuiTextfieldControllerModule,
+            i2$1.TuiHintControllerModule,
+            i2$1.TuiDropdownModule,
+            i2$1.TuiDataListModule,
+            i1.TuiDataListWrapperModule,
+            i2$1.TuiNotificationModule], exports: [TuiDocDocumentationComponent,
+            TuiDocDocumentationPropertyConnectorDirective] });
+    TuiDocDocumentationModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationModule, imports: [[
+                i5.CommonModule,
+                i5$1.FormsModule,
+                i6$1.RouterModule,
+                i1.TuiBadgeModule,
+                i1.TuiSelectModule,
+                i1.TuiToggleModule,
+                i2$1.TuiTooltipModule,
+                i2$1.TuiLinkModule,
+                i1.TuiInputCountModule,
+                i2$1.TuiModeModule,
+                i2$1.TuiGroupModule,
+                TuiInputOpacityModule,
+                i2$1.TuiPrimitiveTextfieldModule,
+                i2$1.TuiTextfieldControllerModule,
+                i2$1.TuiHintControllerModule,
+                i2$1.TuiDropdownModule,
+                i2$1.TuiDataListModule,
+                i1.TuiDataListWrapperModule,
+                i2$1.TuiNotificationModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocDocumentationModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i5$1.FormsModule,
+                            i6$1.RouterModule,
+                            i1.TuiBadgeModule,
+                            i1.TuiSelectModule,
+                            i1.TuiToggleModule,
+                            i2$1.TuiTooltipModule,
+                            i2$1.TuiLinkModule,
+                            i1.TuiInputCountModule,
+                            i2$1.TuiModeModule,
+                            i2$1.TuiGroupModule,
+                            TuiInputOpacityModule,
+                            i2$1.TuiPrimitiveTextfieldModule,
+                            i2$1.TuiTextfieldControllerModule,
+                            i2$1.TuiHintControllerModule,
+                            i2$1.TuiDropdownModule,
+                            i2$1.TuiDataListModule,
+                            i1.TuiDataListWrapperModule,
+                            i2$1.TuiNotificationModule,
+                        ],
+                        declarations: [
+                            TuiDocDocumentationComponent,
+                            TuiDocDocumentationPropertyConnectorDirective,
+                        ],
+                        exports: [
+                            TuiDocDocumentationComponent,
+                            TuiDocDocumentationPropertyConnectorDirective,
+                        ],
+                    }]
+            }] });
 
-    var TUI_DOC_CODE_ACTIONS = new core.InjectionToken("Code actions for the opened tab with code example", {
+    var TUI_DOC_CODE_ACTIONS = new i0.InjectionToken("Code actions for the opened tab with code example", {
         factory: function () { return ""; },
     });
 
-    var TUI_DOC_CODE_EDITOR = new core.InjectionToken("Contains service for opening online IDE e.g. Stackblitz");
+    var TUI_DOC_CODE_EDITOR = new i0.InjectionToken("Contains service for opening online IDE e.g. Stackblitz");
 
-    var TUI_DOC_EXAMPLE_CONTENT_PROCESSOR = new core.InjectionToken("Processes content in example", { factory: function () { return rxjs.identity; } });
+    var TUI_DOC_EXAMPLE_CONTENT_PROCESSOR = new i0.InjectionToken("Processes content in example", { factory: function () { return i9.identity; } });
 
-    /**
-     * @deprecated: use {@link tuiRawLoadRecord} instead
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function rawLoadRecord(example) {
+    function tuiRawLoadRecord(example) {
         return __awaiter(this, void 0, void 0, function () {
             var processedContent, _a, _b, _c, key, content, _d, _e, e_1_1;
             var e_1, _f;
@@ -1142,7 +1340,7 @@
                         if (!content) return [3 /*break*/, 4];
                         _d = processedContent;
                         _e = key;
-                        return [4 /*yield*/, rawLoad(content)];
+                        return [4 /*yield*/, tuiRawLoad(content)];
                     case 3:
                         _d[_e] = _g.sent();
                         _g.label = 4;
@@ -1165,16 +1363,43 @@
             });
         });
     }
-    var tuiRawLoadRecord = rawLoadRecord;
 
-    // Ambient type cannot be used without dynamic https://github.com/angular/angular/issues/23395
-    // @dynamic
+    var TuiDocExampleCapitalizePipe = /** @class */ (function () {
+        function TuiDocExampleCapitalizePipe() {
+        }
+        TuiDocExampleCapitalizePipe.prototype.transform = function (content) {
+            return i6.tuiIsString(content) ? i2$1.tuiCapitalizeFirstLetter(content) : content;
+        };
+        return TuiDocExampleCapitalizePipe;
+    }());
+    TuiDocExampleCapitalizePipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleCapitalizePipe, deps: [], target: i0__namespace.ɵɵFactoryTarget.Pipe });
+    TuiDocExampleCapitalizePipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleCapitalizePipe, name: "tuiDocExampleCapitalize" });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleCapitalizePipe, decorators: [{
+                type: i0.Pipe,
+                args: [{ name: "tuiDocExampleCapitalize" }]
+            }] });
+
+    var TuiDocExampleGetTabsPipe = /** @class */ (function () {
+        function TuiDocExampleGetTabsPipe() {
+        }
+        TuiDocExampleGetTabsPipe.prototype.transform = function (content, defaultTab) {
+            return __spreadArray([defaultTab], __read(Object.keys(content)));
+        };
+        return TuiDocExampleGetTabsPipe;
+    }());
+    TuiDocExampleGetTabsPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleGetTabsPipe, deps: [], target: i0__namespace.ɵɵFactoryTarget.Pipe });
+    TuiDocExampleGetTabsPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleGetTabsPipe, name: "tuiDocExampleGetTabs" });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleGetTabsPipe, decorators: [{
+                type: i0.Pipe,
+                args: [{ name: "tuiDocExampleGetTabs" }]
+            }] });
+
     var TuiDocExampleComponent = /** @class */ (function () {
-        function TuiDocExampleComponent(id, clipboard, notifications, location, copyTexts$, texts, codeEditor, processContent, isCypress, codeActions, router, route, ngLocation) {
+        function TuiDocExampleComponent(id, clipboard, alertService, location, copyTexts$, texts, codeEditor, processContent, isCypress, codeActions, router, route, ngLocation) {
             var _this = this;
             this.id = id;
             this.clipboard = clipboard;
-            this.notifications = notifications;
+            this.alertService = alertService;
             this.location = location;
             this.copyTexts$ = copyTexts$;
             this.texts = texts;
@@ -1185,25 +1410,25 @@
             this.router = router;
             this.route = route;
             this.ngLocation = ngLocation;
-            this.rawLoader$$ = new rxjs.BehaviorSubject({});
+            this.rawLoader$$ = new i9.BehaviorSubject({});
             this.heading = "";
             this.description = "";
             this.componentName = this.location.pathname.slice(1);
             this.defaultTabIndex = 0;
             this.defaultTab = this.texts[this.defaultTabIndex];
             this.activeItemIndex = this.defaultTabIndex;
-            this.copy$ = this.copyTexts$.pipe(operators.map(function (_a) {
-                var _b = __read(_a, 1), copy = _b[0];
+            this.copy$ = this.copyTexts$.pipe(operators.map(function (_b) {
+                var _c = __read(_b, 1), copy = _c[0];
                 return copy;
             }));
-            this.processor$ = this.rawLoader$$.pipe(operators.switchMap(rawLoadRecord), operators.map(function (value) { return _this.processContent(value); }));
-            this.loading$ = new rxjs.Subject();
+            this.processor$ = this.rawLoader$$.pipe(operators.switchMap(tuiRawLoadRecord), operators.map(function (value) { return _this.processContent(value); }));
+            this.loading$ = new i9.Subject();
         }
         Object.defineProperty(TuiDocExampleComponent.prototype, "content", {
             set: function (content) {
                 this.rawLoader$$.next(content);
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         TuiDocExampleComponent.prototype.copyExampleLink = function () {
@@ -1214,8 +1439,8 @@
             var url = currentUrl + "#" + this.id;
             this.setFragmentWithoutRedirect(this.id);
             this.clipboard.copy(url);
-            this.notifications
-                .show(this.texts[1], {
+            this.alertService
+                .open(this.texts[1], {
                 label: this.texts[2],
                 status: "success" /* Success */,
             })
@@ -1223,9 +1448,9 @@
         };
         TuiDocExampleComponent.prototype.edit = function (files) {
             var _this = this;
-            var _a, _b;
+            var _a;
             this.loading$.next(true);
-            (_a = this.codeEditor) === null || _a === void 0 ? void 0 : _a.edit(this.componentName, (_b = this.id) !== null && _b !== void 0 ? _b : "", files).finally(function () { return _this.loading$.next(false); });
+            (_a = this.codeEditor) === null || _a === void 0 ? void 0 : _a.edit(this.componentName, this.id || "", files).finally(function () { return _this.loading$.next(false); });
         };
         TuiDocExampleComponent.prototype.setFragmentWithoutRedirect = function (id) {
             var url = this.router
@@ -1233,307 +1458,190 @@
                 .toString();
             this.ngLocation.go(url);
         };
-        TuiDocExampleComponent.ctorParameters = function () { return [
-            { type: String, decorators: [{ type: core.Attribute, args: ["id",] }] },
-            { type: clipboard.Clipboard, decorators: [{ type: core.Inject, args: [clipboard.Clipboard,] }] },
-            { type: core$1.TuiNotificationsService, decorators: [{ type: core.Inject, args: [core$1.TuiNotificationsService,] }] },
-            { type: Location, decorators: [{ type: core.Inject, args: [common$1.LOCATION,] }] },
-            { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [kit.TUI_COPY_TEXTS,] }] },
-            { type: Array, decorators: [{ type: core.Inject, args: [TUI_DOC_EXAMPLE_TEXTS,] }] },
-            { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [TUI_DOC_CODE_EDITOR,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_EXAMPLE_CONTENT_PROCESSOR,] }] },
-            { type: Boolean, decorators: [{ type: core.Inject, args: [cdk.TUI_IS_CYPRESS,] }] },
-            { type: Array, decorators: [{ type: core.Inject, args: [TUI_DOC_CODE_ACTIONS,] }] },
-            { type: router.Router, decorators: [{ type: core.Inject, args: [router.Router,] }] },
-            { type: router.ActivatedRoute, decorators: [{ type: core.Inject, args: [router.ActivatedRoute,] }] },
-            { type: common.Location, decorators: [{ type: core.Inject, args: [common.Location,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiDocExampleComponent.prototype, "heading", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocExampleComponent.prototype, "description", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocExampleComponent.prototype, "content", null);
-        __decorate([
-            core.Input()
-        ], TuiDocExampleComponent.prototype, "componentName", void 0);
-        TuiDocExampleComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-example",
-                template: "<h3\n    *ngIf=\"heading\"\n    class=\"t-title\"\n>\n    <span\n        polymorpheus-outlet\n        [content]=\"heading | tuiDocExampleCapitalize\"\n    ></span>\n    <button\n        *ngIf=\"id\"\n        tuiIconButton\n        type=\"button\"\n        size=\"xs\"\n        icon=\"tuiIconLinkLarge\"\n        appearance=\"icon\"\n        class=\"t-link-icon\"\n        [title]=\"copy$ | async\"\n        (click)=\"copyExampleLink()\"\n    ></button>\n</h3>\n<h4\n    *ngIf=\"description\"\n    polymorpheus-outlet\n    class=\"t-description\"\n    [content]=\"description | tuiDocExampleCapitalize\"\n></h4>\n\n<div\n    *ngIf=\"processor$ | async as files\"\n    class=\"t-example\"\n>\n    <ng-container *ngIf=\"files | tuiDocExampleGetTabs: defaultTab as tabs\">\n        <div class=\"t-tabs-wrapper\">\n            <tui-tabs-with-more\n                class=\"t-tabs\"\n                [(activeItemIndex)]=\"activeItemIndex\"\n            >\n                <ng-container *ngFor=\"let tab of tabs\">\n                    <button\n                        *tuiTab\n                        tuiTab\n                    >\n                        {{ tab }}\n                    </button>\n                </ng-container>\n            </tui-tabs-with-more>\n\n            <button\n                *ngIf=\"codeEditor\"\n                tuiButton\n                appearance=\"flat\"\n                size=\"s\"\n                [showLoader]=\"!!(loading$ | async)\"\n                (click)=\"edit(files)\"\n            >\n                Edit on {{ codeEditor.name }}\n            </button>\n        </div>\n\n        <div\n            *ngFor=\"let tab of tabs; let index = index\"\n            class=\"t-content\"\n            [class.t-content_animated]=\"!isCypress\"\n            [class.t-content_visible]=\"activeItemIndex === index\"\n        >\n            <ng-container\n                *ngIf=\"index === defaultTabIndex; else anotherTab\"\n                [ngTemplateOutlet]=\"preview\"\n            ></ng-container>\n            <ng-template #anotherTab>\n                <ng-container\n                    [ngTemplateOutlet]=\"codeSection\"\n                    [ngTemplateOutletContext]=\"{$implicit: files[tabs[activeItemIndex]] || ''}\"\n                ></ng-container>\n            </ng-template>\n        </div>\n    </ng-container>\n</div>\n\n<ng-template #preview>\n    <div\n        automation-id=\"tui-doc-example\"\n        class=\"t-demo\"\n    >\n        <ng-content></ng-content>\n    </div>\n</ng-template>\n\n<ng-template\n    #codeSection\n    let-code\n>\n    <section class=\"t-code-actions\">\n        <ng-container *ngFor=\"let action of codeActions\">\n            <div\n                polymorpheus-outlet\n                [content]=\"action\"\n                [context]=\"{$implicit: code}\"\n            ></div>\n        </ng-container>\n        <tui-doc-copy [cdkCopyToClipboard]=\"code\"></tui-doc-copy>\n    </section>\n    <tui-doc-code [code]=\"code\"></tui-doc-code>\n</ng-template>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{position:relative;display:block;padding-top:3.5rem;clear:right}:host :host-context(tui-root._mobile){padding-top:2rem}.t-title{font:var(--tui-font-heading-5);margin:0 0 .5rem}:host-context(tui-root._mobile) .t-title{font:var(--tui-font-heading-6)}.t-description{font:var(--tui-font-text-m);font-weight:400;margin:0}.t-example{position:relative;margin-top:1.5rem;border:1px solid var(--tui-base-03);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem rgba(0,0,0,.1)}:host-context(tui-root._mobile) .t-example{margin-top:.75rem}.t-tabs-wrapper{display:flex;padding:0 2rem;box-shadow:inset 0 -1px var(--tui-base-03);justify-content:space-between;align-items:center}:host-context(tui-root._mobile) .t-tabs-wrapper{padding:0 1rem}.t-tabs{flex-grow:1}.t-demo{padding:2rem;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution:0.001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:2.667rem solid transparent}.t-demo::-webkit-scrollbar{background-color:transparent}.t-demo::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host-context(tui-root._mobile) .t-demo{padding:1rem}.t-code-actions{position:absolute;top:4.375rem;right:1rem;display:flex;justify-content:flex-end;align-items:center}.t-code-actions>*{margin-left:.5rem}.t-link-icon{margin-left:.3rem;vertical-align:baseline}.t-content{will-change:opacity;height:0;visibility:hidden;opacity:0}.t-content_animated{transition:opacity .3s ease-in-out}.t-content_visible{height:auto;visibility:visible;opacity:1}"]
-            }),
-            __param(0, core.Attribute("id")),
-            __param(1, core.Inject(clipboard.Clipboard)),
-            __param(2, core.Inject(core$1.TuiNotificationsService)),
-            __param(3, core.Inject(common$1.LOCATION)),
-            __param(4, core.Inject(kit.TUI_COPY_TEXTS)),
-            __param(5, core.Inject(TUI_DOC_EXAMPLE_TEXTS)),
-            __param(6, core.Optional()),
-            __param(6, core.Inject(TUI_DOC_CODE_EDITOR)),
-            __param(7, core.Inject(TUI_DOC_EXAMPLE_CONTENT_PROCESSOR)),
-            __param(8, core.Inject(cdk.TUI_IS_CYPRESS)),
-            __param(9, core.Inject(TUI_DOC_CODE_ACTIONS)),
-            __param(10, core.Inject(router.Router)),
-            __param(11, core.Inject(router.ActivatedRoute)),
-            __param(12, core.Inject(common.Location))
-        ], TuiDocExampleComponent);
         return TuiDocExampleComponent;
     }());
-
-    var TuiDocExampleCapitalizePipe = /** @class */ (function () {
-        function TuiDocExampleCapitalizePipe() {
-        }
-        TuiDocExampleCapitalizePipe.prototype.transform = function (content) {
-            return typeof content === "string" ? core$1.capitalizeFirstLetter(content) : content;
-        };
-        TuiDocExampleCapitalizePipe = __decorate([
-            core.Pipe({ name: "tuiDocExampleCapitalize" })
-        ], TuiDocExampleCapitalizePipe);
-        return TuiDocExampleCapitalizePipe;
-    }());
-
-    var TuiDocExampleGetTabsPipe = /** @class */ (function () {
-        function TuiDocExampleGetTabsPipe() {
-        }
-        TuiDocExampleGetTabsPipe.prototype.transform = function (content, defaultTab) {
-            return __spread([defaultTab], Object.keys(content));
-        };
-        TuiDocExampleGetTabsPipe = __decorate([
-            core.Pipe({ name: "tuiDocExampleGetTabs" })
-        ], TuiDocExampleGetTabsPipe);
-        return TuiDocExampleGetTabsPipe;
-    }());
+    TuiDocExampleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleComponent, deps: [{ token: "id", attribute: true }, { token: i8.Clipboard }, { token: i2$1.TuiAlertService }, { token: common.LOCATION }, { token: i1.TUI_COPY_TEXTS }, { token: TUI_DOC_EXAMPLE_TEXTS }, { token: TUI_DOC_CODE_EDITOR, optional: true }, { token: TUI_DOC_EXAMPLE_CONTENT_PROCESSOR }, { token: i6.TUI_IS_CYPRESS }, { token: TUI_DOC_CODE_ACTIONS }, { token: i6$1.Router }, { token: i6$1.ActivatedRoute }, { token: i5.Location }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocExampleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocExampleComponent, selector: "tui-doc-example", inputs: { heading: "heading", description: "description", content: "content", componentName: "componentName" }, ngImport: i0__namespace, template: "<h3\n    *ngIf=\"heading\"\n    class=\"t-title\"\n>\n    <span\n        *polymorpheusOutlet=\"heading | tuiDocExampleCapitalize as text\"\n        [textContent]=\"text\"\n    ></span>\n    <button\n        *ngIf=\"id\"\n        tuiIconButton\n        type=\"button\"\n        size=\"xs\"\n        icon=\"tuiIconLinkLarge\"\n        appearance=\"icon\"\n        class=\"t-link-icon\"\n        [title]=\"copy$ | async\"\n        (click)=\"copyExampleLink()\"\n    ></button>\n</h3>\n<h4\n    *ngIf=\"description\"\n    class=\"t-description\"\n>\n    <ng-container *polymorpheusOutlet=\"description | tuiDocExampleCapitalize as text\">\n        {{ text }}\n    </ng-container>\n</h4>\n\n<div\n    *ngIf=\"processor$ | async as files\"\n    class=\"t-example\"\n>\n    <ng-container *ngIf=\"files | tuiDocExampleGetTabs: defaultTab as tabs\">\n        <div class=\"t-tabs-wrapper\">\n            <tui-tabs-with-more\n                class=\"t-tabs\"\n                [(activeItemIndex)]=\"activeItemIndex\"\n            >\n                <ng-container *ngFor=\"let tab of tabs\">\n                    <button\n                        *tuiItem\n                        tuiTab\n                    >\n                        {{ tab }}\n                    </button>\n                </ng-container>\n            </tui-tabs-with-more>\n\n            <button\n                *ngIf=\"codeEditor\"\n                tuiButton\n                appearance=\"flat\"\n                size=\"s\"\n                [showLoader]=\"!!(loading$ | async)\"\n                (click)=\"edit(files)\"\n            >\n                Edit on {{ codeEditor.name }}\n            </button>\n        </div>\n\n        <div\n            *ngFor=\"let tab of tabs; let index = index\"\n            class=\"t-content\"\n            [class.t-content_animated]=\"!isCypress\"\n            [class.t-content_visible]=\"activeItemIndex === index\"\n        >\n            <ng-container\n                *ngIf=\"index === defaultTabIndex; else anotherTab\"\n                [ngTemplateOutlet]=\"preview\"\n            ></ng-container>\n            <ng-template #anotherTab>\n                <ng-container\n                    [ngTemplateOutlet]=\"codeSection\"\n                    [ngTemplateOutletContext]=\"{$implicit: files[tabs[activeItemIndex]] || ''}\"\n                ></ng-container>\n            </ng-template>\n        </div>\n    </ng-container>\n</div>\n\n<ng-template #preview>\n    <div\n        automation-id=\"tui-doc-example\"\n        class=\"t-demo\"\n    >\n        <ng-content></ng-content>\n    </div>\n</ng-template>\n\n<ng-template\n    #codeSection\n    let-code\n>\n    <section class=\"t-code-actions\">\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-copy [cdkCopyToClipboard]=\"code\"></tui-doc-copy>\n    </section>\n    <tui-doc-code [code]=\"code\"></tui-doc-code>\n</ng-template>\n", styles: [":host{position:relative;display:block;padding-top:3.5rem;clear:right}:host :host-context(tui-root._mobile){padding-top:2rem}.t-title{font:var(--tui-font-heading-5);margin:0 0 .5rem}:host-context(tui-root._mobile) .t-title{font:var(--tui-font-heading-6)}.t-description{font:var(--tui-font-text-m);font-weight:normal;margin:0}.t-example{position:relative;margin-top:1.5rem;border:1px solid var(--tui-base-03);border-radius:var(--tui-radius-m);box-shadow:0 .125rem .1875rem rgba(0,0,0,.1)}:host-context(tui-root._mobile) .t-example{margin-top:.75rem}.t-tabs-wrapper{display:flex;padding:0 2rem;box-shadow:inset 0 -1px var(--tui-base-03);justify-content:space-between;align-items:center}:host-context(tui-root._mobile) .t-tabs-wrapper{padding:0 1rem}.t-tabs{flex-grow:1}.t-demo{padding:2rem;overflow-x:auto}@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm){.t-demo::-webkit-scrollbar,.t-demo::-webkit-scrollbar-thumb{width:1rem;height:1rem;border-radius:6.25rem;background-clip:padding-box;border:2.667rem solid transparent}.t-demo::-webkit-scrollbar{background-color:transparent}.t-demo::-webkit-scrollbar-thumb{background-color:var(--tui-clear-hover)}.t-demo::-webkit-scrollbar-thumb:hover{background-color:var(--tui-clear-active)}.t-demo::-webkit-scrollbar-thumb:active{background-color:var(--tui-text-03)}}:host-context(tui-root._mobile) .t-demo{padding:1rem}.t-code-actions{position:absolute;top:4.375rem;right:1rem;display:flex;justify-content:flex-end;align-items:center}.t-code-actions>*{margin-left:.5rem}.t-link-icon{margin-left:.3rem;vertical-align:baseline}.t-content{will-change:opacity;height:0;visibility:hidden;opacity:0}.t-content_animated{transition:opacity .3s ease-in-out}.t-content_visible{height:auto;visibility:visible;opacity:1}\n"], components: [{ type: i2__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { type: i1__namespace.TuiTabsWithMoreComponent, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["moreContent", "dropdownContent", "underline", "activeItemIndex", "itemsLimit"], outputs: ["activeItemIndexChange"] }, { type: i1__namespace.TuiTabComponent, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { type: TuiDocCopyComponent, selector: "tui-doc-copy" }, { type: TuiDocCodeComponent, selector: "tui-doc-code", inputs: ["filename", "code"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace$2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace$1.TuiItemDirective, selector: "[tuiItem]" }, { type: i5__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i8__namespace.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }], pipes: { "tuiDocExampleCapitalize": TuiDocExampleCapitalizePipe, "async": i5__namespace.AsyncPipe, "tuiDocExampleGetTabs": TuiDocExampleGetTabsPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-example",
+                        templateUrl: "./example.template.html",
+                        styleUrls: ["./example.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Attribute,
+                            args: ["id"]
+                        }] }, { type: i8__namespace.Clipboard, decorators: [{
+                            type: i0.Inject,
+                            args: [i8.Clipboard]
+                        }] }, { type: i2__namespace$1.TuiAlertService, decorators: [{
+                            type: i0.Inject,
+                            args: [i2$1.TuiAlertService]
+                        }] }, { type: Location, decorators: [{
+                            type: i0.Inject,
+                            args: [common.LOCATION]
+                        }] }, { type: i9__namespace.Observable, decorators: [{
+                            type: i0.Inject,
+                            args: [i1.TUI_COPY_TEXTS]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_EXAMPLE_TEXTS]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Optional
+                        }, {
+                            type: i0.Inject,
+                            args: [TUI_DOC_CODE_EDITOR]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_EXAMPLE_CONTENT_PROCESSOR]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TUI_IS_CYPRESS]
+                        }] }, { type: Array, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_CODE_ACTIONS]
+                        }] }, { type: i6__namespace.Router, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.Router]
+                        }] }, { type: i6__namespace.ActivatedRoute, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.ActivatedRoute]
+                        }] }, { type: i5__namespace.Location, decorators: [{
+                            type: i0.Inject,
+                            args: [i5.Location]
+                        }] }];
+        }, propDecorators: { heading: [{
+                    type: i0.Input
+                }], description: [{
+                    type: i0.Input
+                }], content: [{
+                    type: i0.Input
+                }], componentName: [{
+                    type: i0.Input
+                }] } });
 
     var TuiDocExampleModule = /** @class */ (function () {
         function TuiDocExampleModule() {
         }
-        TuiDocExampleModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    clipboard.ClipboardModule,
-                    kit.TuiTabsModule,
-                    core$1.TuiButtonModule,
-                    TuiDocCopyModule,
-                    TuiDocCodeModule,
-                    ngPolymorpheus.PolymorpheusModule,
-                ],
-                declarations: [
-                    TuiDocExampleComponent,
-                    TuiDocExampleGetTabsPipe,
-                    TuiDocExampleCapitalizePipe,
-                ],
-                exports: [
-                    TuiDocExampleComponent,
-                    TuiDocExampleGetTabsPipe,
-                    TuiDocExampleCapitalizePipe,
-                ],
-            })
-        ], TuiDocExampleModule);
         return TuiDocExampleModule;
     }());
+    TuiDocExampleModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocExampleModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleModule, declarations: [TuiDocExampleComponent,
+            TuiDocExampleGetTabsPipe,
+            TuiDocExampleCapitalizePipe], imports: [i5.CommonModule,
+            i8.ClipboardModule,
+            i1.TuiTabsModule,
+            i2$1.TuiButtonModule,
+            TuiDocCopyModule,
+            TuiDocCodeModule,
+            i6$2.PolymorpheusModule], exports: [TuiDocExampleComponent,
+            TuiDocExampleGetTabsPipe,
+            TuiDocExampleCapitalizePipe] });
+    TuiDocExampleModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleModule, imports: [[
+                i5.CommonModule,
+                i8.ClipboardModule,
+                i1.TuiTabsModule,
+                i2$1.TuiButtonModule,
+                TuiDocCopyModule,
+                TuiDocCodeModule,
+                i6$2.PolymorpheusModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocExampleModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i8.ClipboardModule,
+                            i1.TuiTabsModule,
+                            i2$1.TuiButtonModule,
+                            TuiDocCopyModule,
+                            TuiDocCodeModule,
+                            i6$2.PolymorpheusModule,
+                        ],
+                        declarations: [
+                            TuiDocExampleComponent,
+                            TuiDocExampleGetTabsPipe,
+                            TuiDocExampleCapitalizePipe,
+                        ],
+                        exports: [
+                            TuiDocExampleComponent,
+                            TuiDocExampleGetTabsPipe,
+                            TuiDocExampleCapitalizePipe,
+                        ],
+                    }]
+            }] });
 
     var TuiLanguageSwitcherComponent = /** @class */ (function () {
         function TuiLanguageSwitcherComponent(switcher, iconsPath) {
             this.switcher = switcher;
             this.iconsPath = iconsPath;
             this.path = this.iconsPath("tuiIcon").replace("tuiIcon.svg#tuiIcon", "");
-            this.language = new forms.FormControl(core$1.tuiCapitalizeFirstLetter(this.switcher.language));
+            this.language = new i5$1.FormControl(i2$1.tuiCapitalizeFirstLetter(this.switcher.language));
             this.flags = new Map([
-                ["chinese", i18n.TuiCountryIsoCode.CN],
-                ["dutch", i18n.TuiCountryIsoCode.NL],
-                ["english", i18n.TuiCountryIsoCode.GB],
-                ["french", i18n.TuiCountryIsoCode.FR],
-                ["german", i18n.TuiCountryIsoCode.DE],
-                ["italian", i18n.TuiCountryIsoCode.IT],
-                ["polish", i18n.TuiCountryIsoCode.PL],
-                ["portuguese", i18n.TuiCountryIsoCode.PT],
-                ["russian", i18n.TuiCountryIsoCode.RU],
-                ["spanish", i18n.TuiCountryIsoCode.ES],
-                ["turkish", i18n.TuiCountryIsoCode.TR],
-                ["ukrainian", i18n.TuiCountryIsoCode.UA],
-                ["vietnamese", i18n.TuiCountryIsoCode.VN],
+                ["chinese", i5$2.TuiCountryIsoCode.CN],
+                ["dutch", i5$2.TuiCountryIsoCode.NL],
+                ["english", i5$2.TuiCountryIsoCode.GB],
+                ["french", i5$2.TuiCountryIsoCode.FR],
+                ["german", i5$2.TuiCountryIsoCode.DE],
+                ["italian", i5$2.TuiCountryIsoCode.IT],
+                ["polish", i5$2.TuiCountryIsoCode.PL],
+                ["portuguese", i5$2.TuiCountryIsoCode.PT],
+                ["russian", i5$2.TuiCountryIsoCode.RU],
+                ["spanish", i5$2.TuiCountryIsoCode.ES],
+                ["turkish", i5$2.TuiCountryIsoCode.TR],
+                ["ukrainian", i5$2.TuiCountryIsoCode.UA],
+                ["vietnamese", i5$2.TuiCountryIsoCode.VN],
             ]);
             this.names = Array.from(this.flags.keys());
         }
         TuiLanguageSwitcherComponent.prototype.getFlagPath = function (code) {
             return code ? "" + this.path + code + ".png" : null;
         };
-        TuiLanguageSwitcherComponent.ctorParameters = function () { return [
-            { type: i18n.TuiLanguageSwitcher, decorators: [{ type: core.Inject, args: [i18n.TuiLanguageSwitcher,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [core$1.TUI_ICONS_PATH,] }] }
-        ]; };
-        TuiLanguageSwitcherComponent = __decorate([
-            core.Component({
-                selector: "tui-language-switcher",
-                template: "<tui-select [formControl]=\"language\">\n    <ng-content></ng-content>\n    <tui-data-list *tuiDataList>\n        <button\n            *ngFor=\"let name of names\"\n            tuiOption\n            [value]=\"name | titlecase\"\n            (click)=\"switcher.setLanguage(name)\"\n        >\n            <img\n                alt=\"\"\n                class=\"t-flag\"\n                [src]=\"getFlagPath(flags.get(name))\"\n            />\n            {{ name | titlecase }}\n        </button>\n    </tui-data-list>\n</tui-select>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [".t-flag{width:1.75rem;height:1.25rem;margin-right:.5rem}"]
-            }),
-            __param(0, core.Inject(i18n.TuiLanguageSwitcher)),
-            __param(1, core.Inject(core$1.TUI_ICONS_PATH))
-        ], TuiLanguageSwitcherComponent);
         return TuiLanguageSwitcherComponent;
     }());
+    TuiLanguageSwitcherComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiLanguageSwitcherComponent, deps: [{ token: i5$2.TuiLanguageSwitcher }, { token: i2$1.TUI_ICONS_PATH }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiLanguageSwitcherComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiLanguageSwitcherComponent, selector: "tui-language-switcher", ngImport: i0__namespace, template: "<tui-select [formControl]=\"language\">\n    <ng-content></ng-content>\n    <tui-data-list *tuiDataList>\n        <button\n            *ngFor=\"let name of names\"\n            tuiOption\n            [value]=\"name | titlecase\"\n            (click)=\"switcher.setLanguage(name)\"\n        >\n            <img\n                alt=\"\"\n                class=\"t-flag\"\n                [src]=\"getFlagPath(flags.get(name))\"\n            />\n            {{ name | titlecase }}\n        </button>\n    </tui-data-list>\n</tui-select>\n", styles: [".t-flag{width:1.75rem;height:1.25rem;margin-right:.5rem}\n"], components: [{ type: i1__namespace.TuiSelectComponent, selector: "tui-select", inputs: ["stringify", "identityMatcher", "valueContent"] }, { type: i2__namespace$1.TuiDataListComponent, selector: "tui-data-list", inputs: ["role", "emptyContent"] }, { type: i2__namespace$1.TuiOptionComponent, selector: "button[tuiOption], a[tuiOption]", inputs: ["size", "role", "disabled", "value"] }], directives: [{ type: i1__namespace.TuiSelectDirective, selector: "tui-select" }, { type: i5__namespace$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5__namespace$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace$1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "titlecase": i5__namespace.TitleCasePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiLanguageSwitcherComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-language-switcher",
+                        templateUrl: "./language-switcher.component.html",
+                        styleUrls: ["./language-switcher.component.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i5__namespace$2.TuiLanguageSwitcher, decorators: [{
+                            type: i0.Inject,
+                            args: [i5$2.TuiLanguageSwitcher]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [i2$1.TUI_ICONS_PATH]
+                        }] }];
+        } });
 
     var TuiLanguageSwitcherModule = /** @class */ (function () {
         function TuiLanguageSwitcherModule() {
         }
-        TuiLanguageSwitcherModule = __decorate([
-            core.NgModule({
-                exports: [TuiLanguageSwitcherComponent],
-                declarations: [TuiLanguageSwitcherComponent],
-                imports: [common.CommonModule, kit.TuiSelectModule, core$1.TuiDataListModule, forms.ReactiveFormsModule],
-            })
-        ], TuiLanguageSwitcherModule);
         return TuiLanguageSwitcherModule;
     }());
+    TuiLanguageSwitcherModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiLanguageSwitcherModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiLanguageSwitcherModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiLanguageSwitcherModule, declarations: [TuiLanguageSwitcherComponent], imports: [i5.CommonModule, i1.TuiSelectModule, i2$1.TuiDataListModule, i5$1.ReactiveFormsModule], exports: [TuiLanguageSwitcherComponent] });
+    TuiLanguageSwitcherModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiLanguageSwitcherModule, imports: [[i5.CommonModule, i1.TuiSelectModule, i2$1.TuiDataListModule, i5$1.ReactiveFormsModule]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiLanguageSwitcherModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        exports: [TuiLanguageSwitcherComponent],
+                        declarations: [TuiLanguageSwitcherComponent],
+                        imports: [i5.CommonModule, i1.TuiSelectModule, i2$1.TuiDataListModule, i5$1.ReactiveFormsModule],
+                    }]
+            }] });
 
-    // @dynamic
-    var TuiDocMainComponent = /** @class */ (function () {
-        function TuiDocMainComponent(storage, windowRef) {
-            this.storage = storage;
-            this.windowRef = windowRef;
-            this.night = this.storage.getItem("night") === "true" ||
-                (this.storage.getItem("night") === null &&
-                    this.windowRef.matchMedia("(prefers-color-scheme: dark)").matches);
-            this.change$ = new rxjs.Subject();
-        }
-        TuiDocMainComponent_1 = TuiDocMainComponent;
-        Object.defineProperty(TuiDocMainComponent.prototype, "mode", {
-            get: function () {
-                return this.night ? "onDark" : null;
-            },
-            enumerable: true,
-            configurable: true
-        });
-        TuiDocMainComponent.prototype.onMode = function (night) {
-            this.night = night;
-            this.change$.next();
-            this.storage.setItem("night", String(night));
-        };
-        var TuiDocMainComponent_1;
-        TuiDocMainComponent.ctorParameters = function () { return [
-            { type: Storage, decorators: [{ type: core.Inject, args: [common$1.LOCAL_STORAGE,] }] },
-            { type: Window, decorators: [{ type: core.Inject, args: [common$1.WINDOW,] }] }
-        ]; };
-        __decorate([
-            core.HostBinding("attr.data-mode")
-        ], TuiDocMainComponent.prototype, "mode", null);
-        TuiDocMainComponent = TuiDocMainComponent_1 = __decorate([
-            core.Component({
-                selector: "tui-doc-main",
-                template: "<tui-theme-night *ngIf=\"night\"></tui-theme-night>\n<tui-root>\n    <div class=\"tui-doc-page\">\n        <tui-doc-navigation class=\"tui-doc-navigation\">\n            <ng-content select=\"tuiDocNavigation\"></ng-content>\n        </tui-doc-navigation>\n        <div class=\"tui-doc-content\">\n            <router-outlet class=\"tui-doc-outlet\"></router-outlet>\n        </div>\n    </div>\n    <header tuiDocHeader>\n        <label class=\"night-mode\">\n            Night mode\n            <tui-toggle\n                class=\"tui-toggle\"\n                [ngModel]=\"night\"\n                (ngModelChange)=\"onMode($event)\"\n            ></tui-toggle>\n        </label>\n        <ng-content select=\"tuiDocHeader\"></ng-content>\n    </header>\n    <ng-container ngProjectAs=\"tuiOverContent\">\n        <ng-content select=\"tuiOverContent\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDialogs\">\n        <ng-content select=\"tuiOverDialogs\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverAlerts\">\n        <ng-content select=\"tuiOverAlerts\"></ng-content>\n    </ng-container>\n    <!-- TODO: 3.0 Remove-->\n    <ng-container ngProjectAs=\"tuiOverNotifications\">\n        <ng-content select=\"tuiOverNotifications\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverPortals\">\n        <ng-content select=\"tuiOverPortals\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverHints\">\n        <ng-content select=\"tuiOverHints\"></ng-content>\n    </ng-container>\n</tui-root>\n",
-                encapsulation: core.ViewEncapsulation.None,
-                providers: [
-                    {
-                        provide: core$1.TuiModeDirective,
-                        useExisting: core.forwardRef(function () { return TuiDocMainComponent_1; }),
-                    },
-                    cdk.TuiSwipeService,
-                ],
-                styles: ["html{scroll-padding-top:4rem;height:auto}tui-root>tui-scroll-controls>.t-bar_vertical{top:4rem!important}@-webkit-keyframes tuiShaking{from,to{transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{transform:translate3d(-.3125rem,0,0)}20%,40%,60%,80%{transform:translate3d(.3125rem,0,0)}}@keyframes tuiShaking{from,to{transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{transform:translate3d(-.3125rem,0,0)}20%,40%,60%,80%{transform:translate3d(.3125rem,0,0)}}body{background:var(--tui-base-01);height:auto}tui-doc-main{display:block}code:not(.hljs):not([class*=language-]):not(.exception){transition-property:background;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;background:var(--tui-base-02);color:var(--tui-text-02);vertical-align:middle;box-shadow:inset 0 -2px var(--tui-secondary);padding:.375rem .5rem;font-size:.875rem;border-radius:.5rem}a:focus code,button:focus code{background:var(--tui-base-01)}.tui-doc-page{position:relative;z-index:0;padding-top:4rem}tui-doc-navigation.tui-doc-navigation{position:fixed;top:4rem;bottom:0;width:16.25rem;border-right:1px solid var(--tui-base-03)}.tui-doc-content{margin-left:16.25rem}@media screen and (max-width:47.9625em){tui-doc-navigation.tui-doc-navigation{display:none}.tui-doc-content{margin-left:0}}.tui-doc-outlet+*{display:block}.tui-doc-animated-example{-webkit-animation:1s .3s tuiShaking;animation:1s .3s tuiShaking}label.night-mode{cursor:pointer}label.night-mode .tui-toggle{margin-left:.5rem}.hljs-tag{background:0 0}.hljs{display:block;overflow-x:auto;padding:.5em;color:var(--tui-text-01);background-color:var(--tui-clear-disabled)}.hljs.hljs-line-numbers{background:0 0}.hljs-subst,.hljs-title{font-weight:400;color:var(--tui-text-01)}.hljs-comment,.hljs-quote{color:var(--tui-text-03);font-style:italic}.hljs-meta{color:#e38162}.hljs-keyword,.hljs-literal,.hljs-name,.hljs-section,.hljs-selector-class,.hljs-selector-id,.hljs-selector-tag,.hljs-type{font-weight:700;color:var(--tui-link)}.hljs-attribute,.hljs-link,.hljs-number,.hljs-regexp{font-weight:700;color:var(--tui-support-06)}.hljs-link,.hljs-number,.hljs-regexp{font-weight:400}.hljs-string{color:var(--tui-positive);font-weight:700}.hljs-bullet,.hljs-formula,.hljs-symbol{color:var(--tui-text-01);background:var(--tui-base-02);font-style:italic}.hljs-doctag{text-decoration:underline}.hljs-template-variable,.hljs-variable{color:var(--tui-link-hover)}[data-mode=onDark] .hljs-template-variable,[data-mode=onDark] .hljs-variable{color:var(--tui-warning-fill)}.hljs-addition{background:var(--tui-success-bg)}.hljs-deletion{background:var(--tui-error-bg)}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs .hljs-line-numbers{padding:0}.hljs-ln-numbers{vertical-align:top;opacity:.3;text-align:right;padding-right:1em!important}"]
-            }),
-            __param(0, core.Inject(common$1.LOCAL_STORAGE)),
-            __param(1, core.Inject(common$1.WINDOW))
-        ], TuiDocMainComponent);
-        return TuiDocMainComponent;
-    }());
+    var TUI_DOC_PAGE_LOADED = new i0.InjectionToken("[TUI_DOC_PAGE_LOADED] Stream that emits if loading of page is over (for example, to begin scrollIntoView)", { factory: function () { return i9.defer(function () { return i9.timer(200).pipe(operators.switchMapTo(i9.of(true))); }); } });
 
-    var TUI_DOC_PAGE_LOADED = new core.InjectionToken("[TUI_DOC_PAGE_LOADED] Stream that emits if loading of page is over (for example, to begin scrollIntoView)", { factory: function () { return rxjs.defer(function () { return rxjs.timer(200).pipe(operators.switchMapTo(rxjs.of(true))); }); } });
-
-    /**
-     * @deprecated: use {@link TuiScrollIntoViewLinkDirective}
-     * TODO: remove in v3.0
-     */
-    var ScrollIntoViewDirective = /** @class */ (function () {
-        function ScrollIntoViewDirective(destroy$, _a, readyToScroll$) {
-            var nativeElement = _a.nativeElement;
-            this.readyToScroll$ = readyToScroll$;
-            this.scroll$ = new rxjs.ReplaySubject(1);
-            this.readyToScroll$
-                .pipe(operators.filter(Boolean), operators.switchMapTo(this.scroll$), operators.debounceTime(750), operators.filter(function (shallWe) { return shallWe && !!cdk.getElementObscurers(nativeElement); }), operators.takeUntil(destroy$))
-                .subscribe(function () {
-                nativeElement.scrollIntoView();
-            });
-        }
-        Object.defineProperty(ScrollIntoViewDirective.prototype, "scrollIntoView", {
-            set: function (shallWe) {
-                this.scroll$.next(shallWe);
-            },
-            enumerable: true,
-            configurable: true
-        });
-        ScrollIntoViewDirective.ctorParameters = function () { return [
-            { type: cdk.TuiDestroyService, decorators: [{ type: core.Inject, args: [cdk.TuiDestroyService,] }] },
-            { type: core.ElementRef, decorators: [{ type: core.Inject, args: [core.ElementRef,] }] },
-            { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [TUI_DOC_PAGE_LOADED,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], ScrollIntoViewDirective.prototype, "scrollIntoView", null);
-        ScrollIntoViewDirective = __decorate([
-            core.Directive({
-                selector: "[scrollIntoView]",
-                providers: [cdk.TuiDestroyService],
-            })
-            // eslint-disable-next-line @typescript-eslint/naming-convention
-            ,
-            __param(0, core.Inject(cdk.TuiDestroyService)),
-            __param(1, core.Inject(core.ElementRef)),
-            __param(2, core.Inject(TUI_DOC_PAGE_LOADED))
-        ], ScrollIntoViewDirective);
-        return ScrollIntoViewDirective;
-    }());
-    var TuiScrollIntoViewLinkDirective = /** @class */ (function (_super) {
-        __extends(TuiScrollIntoViewLinkDirective, _super);
-        function TuiScrollIntoViewLinkDirective() {
-            return _super !== null && _super.apply(this, arguments) || this;
-        }
-        TuiScrollIntoViewLinkDirective = __decorate([
-            core.Directive({
-                selector: "[tuiScrollIntoViewLink]",
-                providers: [cdk.TuiDestroyService],
-            })
-        ], TuiScrollIntoViewLinkDirective);
-        return TuiScrollIntoViewLinkDirective;
-    }(ScrollIntoViewDirective));
-
-    /**
-     * @deprecated: use {@link TuiScrollIntoViewLinkModule}
-     * TODO: remove in v3.0
-     */
-    var ScrollIntoViewModule = /** @class */ (function () {
-        // eslint-disable-next-line @typescript-eslint/naming-convention
-        function ScrollIntoViewModule() {
-        }
-        ScrollIntoViewModule = __decorate([
-            core.NgModule({
-                declarations: [ScrollIntoViewDirective],
-                exports: [ScrollIntoViewDirective],
-            })
-            // eslint-disable-next-line @typescript-eslint/naming-convention
-        ], ScrollIntoViewModule);
-        return ScrollIntoViewModule;
-    }());
-    var TuiScrollIntoViewLinkModule = /** @class */ (function () {
-        function TuiScrollIntoViewLinkModule() {
-        }
-        TuiScrollIntoViewLinkModule = __decorate([
-            core.NgModule({
-                declarations: [TuiScrollIntoViewLinkDirective],
-                exports: [TuiScrollIntoViewLinkDirective],
-            })
-        ], TuiScrollIntoViewLinkModule);
-        return TuiScrollIntoViewLinkModule;
-    }());
-
-    var TUI_DOC_SCROLL_BEHAVIOR = new core.InjectionToken("[TUI_DOC_SCROLL_BEHAVIOR] Defines the transition animation for scroll", { factory: function () { return "smooth"; } });
+    var TUI_DOC_SCROLL_BEHAVIOR = new i0.InjectionToken("[TUI_DOC_SCROLL_BEHAVIOR] Defines the transition animation for scroll", { factory: function () { return "smooth"; } });
 
     var MAP = {
         а: "f",
@@ -1570,38 +1678,43 @@
         я: "z",
     };
     /**
-     * @deprecated: use {@link tuiTransliterateKeyboardLayout} instead
      * Translates text mistakenly typed in the Russian layout into English
      * @param string string with Russian layout characters
      * @return string with English layout characters
      */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function transliterateKeyboardLayout(string) {
+    function tuiTransliterateKeyboardLayout(string) {
         var newStr = "";
         for (var i = 0; i < string.length; i++) {
             newStr += string.charAt(i) in MAP ? MAP[string.charAt(i)] : string.charAt(i);
         }
         return newStr;
     }
-    var tuiTransliterateKeyboardLayout = transliterateKeyboardLayout;
 
-    var TUI_DOC_PAGES = new core.InjectionToken("Documentation pages", {
+    var TUI_DOC_PAGES = new i0.InjectionToken("Documentation pages", {
         factory: function () { return []; },
     });
 
-    var TUI_DOC_TITLE = new core.InjectionToken("Page title", {
+    var TUI_DOC_TITLE = new i0.InjectionToken("Page title", {
         factory: function () { return ""; },
     });
 
-    var NAVIGATION_TITLE = new core.InjectionToken("Page title");
-    var NAVIGATION_LABELS = new core.InjectionToken("Navigation sections labels for search");
-    var NAVIGATION_ITEMS = new core.InjectionToken("Navigation pages");
+    var NAVIGATION_TITLE = new i0.InjectionToken("Page title");
+    var NAVIGATION_LABELS = new i0.InjectionToken("Navigation sections labels for search");
+    var NAVIGATION_ITEMS = new i0.InjectionToken("Navigation pages");
     var NAVIGATION_PROVIDERS = [
-        cdk.TuiDestroyService,
+        i6.TuiDestroyService,
         {
             provide: NAVIGATION_TITLE,
-            deps: [router.Router, router.ActivatedRoute, TUI_DOC_TITLE, cdk.TuiDestroyService],
-            useFactory: titleProviderFactory,
+            deps: [i6$1.Router, i6$1.ActivatedRoute, TUI_DOC_TITLE, i6.TuiDestroyService],
+            useFactory: function (router, activatedRoute, titlePrefix, destroy$) {
+                return router.events.pipe(operators.filter(function (event) { return event instanceof i6$1.NavigationEnd; }), operators.map(function () { return activatedRoute.firstChild; }), operators.filter(i6.tuiIsPresent), operators.mergeMap(function (_a) {
+                    var data = _a.data;
+                    return data;
+                }), operators.map(function (_a) {
+                    var title = _a.title;
+                    return titlePrefix + title;
+                }), operators.takeUntil(destroy$));
+            },
         },
         {
             provide: NAVIGATION_LABELS,
@@ -1611,41 +1724,70 @@
         {
             provide: NAVIGATION_ITEMS,
             deps: [TUI_DOC_PAGES],
-            useFactory: itemsProviderFactory,
+            useFactory: function (pages) {
+                var labels = labelsProviderFactory(pages);
+                return __spreadArray(__spreadArray([], __read(labels.map(function (label) { return pages.filter(function (_a) {
+                    var section = _a.section;
+                    return section === label;
+                }); }))), [
+                    pages.filter(function (page) { return !page.section; }),
+                ]);
+            },
         },
     ];
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function titleProviderFactory(router$1, activatedRoute, titlePrefix, destroy$) {
-        return router$1.events.pipe(operators.filter(function (event) { return event instanceof router.NavigationEnd; }), operators.map(function () { return activatedRoute.firstChild; }), operators.filter(cdk.isPresent), operators.mergeMap(function (_a) {
-            var data = _a.data;
-            return data;
-        }), operators.map(function (_a) {
-            var title = _a.title;
-            return titlePrefix + title;
-        }), operators.takeUntil(destroy$));
-    }
-    // eslint-disable-next-line @typescript-eslint/naming-convention
     function labelsProviderFactory(pages) {
         return pages
             .map(function (_a) {
             var section = _a.section;
             return section;
         })
-            .filter(cdk.isPresent)
+            .filter(i6.tuiIsPresent)
             .filter(function (item, index, array) { return array.indexOf(item) === index; });
     }
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function itemsProviderFactory(pages) {
-        var labels = labelsProviderFactory(pages);
-        return __spread(labels.map(function (label) { return pages.filter(function (_a) {
-            var section = _a.section;
-            return section === label;
-        }); }), [
-            pages.filter(function (page) { return !page.section; }),
-        ]);
-    }
 
-    // @dynamic
+    var TuiScrollIntoViewLinkDirective = /** @class */ (function () {
+        function TuiScrollIntoViewLinkDirective(destroy$, _a, readyToScroll$) {
+            var nativeElement = _a.nativeElement;
+            this.readyToScroll$ = readyToScroll$;
+            this.scroll$ = new i9.ReplaySubject(1);
+            this.readyToScroll$
+                .pipe(operators.filter(Boolean), operators.switchMapTo(this.scroll$), operators.debounceTime(750), operators.filter(function (shallWe) { return shallWe && !!i6.tuiGetElementObscures(nativeElement); }), operators.takeUntil(destroy$))
+                .subscribe(function () {
+                nativeElement.scrollIntoView();
+            });
+        }
+        Object.defineProperty(TuiScrollIntoViewLinkDirective.prototype, "tuiScrollIntoViewLink", {
+            set: function (shallWe) {
+                this.scroll$.next(shallWe);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return TuiScrollIntoViewLinkDirective;
+    }());
+    TuiScrollIntoViewLinkDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiScrollIntoViewLinkDirective, deps: [{ token: i6.TuiDestroyService }, { token: i0.ElementRef }, { token: TUI_DOC_PAGE_LOADED }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    TuiScrollIntoViewLinkDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiScrollIntoViewLinkDirective, selector: "[tuiScrollIntoViewLink]", inputs: { tuiScrollIntoViewLink: "tuiScrollIntoViewLink" }, providers: [i6.TuiDestroyService], ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiScrollIntoViewLinkDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: "[tuiScrollIntoViewLink]",
+                        providers: [i6.TuiDestroyService],
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i6__namespace$1.TuiDestroyService, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TuiDestroyService]
+                        }] }, { type: i0__namespace.ElementRef, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.ElementRef]
+                        }] }, { type: i9__namespace.Observable, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_PAGE_LOADED]
+                        }] }];
+        }, propDecorators: { tuiScrollIntoViewLink: [{
+                    type: i0.Input
+                }] } });
+
     var TuiDocNavigationComponent = /** @class */ (function () {
         function TuiDocNavigationComponent(changeDetectorRef, titleService, title$, documentRef, mode, sidebar, labels, items, searchText, router, activatedRoute, destroy$, readyToScroll$, scrollBehavior) {
             var _this = this;
@@ -1661,11 +1803,11 @@
             this.readyToScroll$ = readyToScroll$;
             this.scrollBehavior = scrollBehavior;
             this.menuOpen = false;
-            this.search = "";
-            this.open = false;
             this.openPagesArr = [];
             this.openPagesGroupsArr = [];
             this.active = "";
+            this.search = new i5$1.FormControl("");
+            this.filtered$ = i6.tuiControlValue(this.search).pipe(operators.filter(function (search) { return search.length > 2; }), operators.map(function (search) { return _this.filterItems(_this.flattenSubPages(_this.items), search); }));
             this.mode$ = this.mode.change$.pipe(operators.startWith(null), operators.map(function () { return _this.mode.mode || "onLight"; }));
             // Angular can't navigate no anchor links
             // https://stackoverflow.com/questions/36101756/angular2-routing-with-hashtag-to-page-anchor
@@ -1678,23 +1820,16 @@
         }
         Object.defineProperty(TuiDocNavigationComponent.prototype, "canOpen", {
             get: function () {
-                return this.search.length > 2;
-            },
-            enumerable: true,
-            configurable: true
-        });
-        Object.defineProperty(TuiDocNavigationComponent.prototype, "filteredItems", {
-            get: function () {
-                return this.filterItems(this.flattenSubPages(this.items), this.search);
+                return this.search.value.length > 2;
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         Object.defineProperty(TuiDocNavigationComponent.prototype, "itemsWithoutSections", {
             get: function () {
                 return this.items[this.items.length - 1];
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
         TuiDocNavigationComponent.prototype.isActive = function (route) {
@@ -1706,37 +1841,29 @@
         TuiDocNavigationComponent.prototype.closeMenu = function () {
             this.menuOpen = false;
         };
-        TuiDocNavigationComponent.prototype.onSearchChange = function (search) {
-            this.search = search;
-            this.open = this.canOpen;
-        };
-        TuiDocNavigationComponent.prototype.onClick = function () {
-            this.open = false;
+        TuiDocNavigationComponent.prototype.onClick = function (input) {
+            input.open = false;
             this.menuOpen = false;
-            this.search = "";
+            this.search.setValue("");
             this.openActivePageGroup();
         };
         TuiDocNavigationComponent.prototype.filterItems = function (items, search) {
-            return items.map(function (section) {
-                return cdk.uniqBy(section.filter(function (_a) {
-                    var title = _a.title, _b = _a.keywords, keywords = _b === void 0 ? "" : _b;
-                    title = title.toLowerCase();
-                    search = search.toLowerCase();
-                    keywords = keywords.toLowerCase();
-                    return (title.includes(search) ||
-                        keywords.includes(search) ||
-                        title.includes(transliterateKeyboardLayout(search)) ||
-                        keywords.includes(transliterateKeyboardLayout(search)) ||
-                        search.replace(/-/gi, "").includes(title));
-                }), "title");
-            });
+            return items.map(function (section) { return i6.tuiUniqBy(section.filter(function (_a) {
+                var title = _a.title, _b = _a.keywords, keywords = _b === void 0 ? "" : _b;
+                title = title.toLowerCase();
+                search = search.toLowerCase();
+                keywords = keywords.toLowerCase();
+                return (title.includes(search) ||
+                    keywords.includes(search) ||
+                    title.includes(tuiTransliterateKeyboardLayout(search)) ||
+                    keywords.includes(tuiTransliterateKeyboardLayout(search)) ||
+                    search.replace(/-/gi, "").includes(title));
+            }), "title"); });
         };
         TuiDocNavigationComponent.prototype.flattenSubPages = function (items) {
-            return items.reduce(function (array, item) { return __spread(array, [
-                item.reduce(function (pages, page) {
-                    return "subPages" in page
-                        ? __spread(pages, page.subPages) : __spread(pages, [page]);
-                }, []),
+            return items.reduce(function (array, item) { return __spreadArray(__spreadArray([], __read(array)), [
+                item.reduce(function (pages, page) { return "subPages" in page
+                    ? __spreadArray(__spreadArray([], __read(pages)), __read(page.subPages)) : __spreadArray(__spreadArray([], __read(pages)), [page]); }, []),
             ]); }, []);
         };
         TuiDocNavigationComponent.prototype.isActiveRoute = function (route) {
@@ -1780,93 +1907,77 @@
                 behavior: this.scrollBehavior,
             });
         };
-        TuiDocNavigationComponent.ctorParameters = function () { return [
-            { type: core.ChangeDetectorRef, decorators: [{ type: core.Inject, args: [core.ChangeDetectorRef,] }] },
-            { type: platformBrowser.Title, decorators: [{ type: core.Inject, args: [platformBrowser.Title,] }] },
-            { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [NAVIGATION_TITLE,] }] },
-            { type: Document, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] }] },
-            { type: core$1.TuiModeDirective, decorators: [{ type: core.Inject, args: [core$1.TuiModeDirective,] }] },
-            { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [addonMobile.TuiSidebarDirective,] }] },
-            { type: Array, decorators: [{ type: core.Inject, args: [NAVIGATION_LABELS,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [NAVIGATION_ITEMS,] }] },
-            { type: String, decorators: [{ type: core.Inject, args: [TUI_DOC_SEARCH_TEXT,] }] },
-            { type: router.Router, decorators: [{ type: core.Inject, args: [router.Router,] }] },
-            { type: router.ActivatedRoute, decorators: [{ type: core.Inject, args: [router.ActivatedRoute,] }] },
-            { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [cdk.TuiDestroyService,] }] },
-            { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [TUI_DOC_PAGE_LOADED,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_SCROLL_BEHAVIOR,] }] }
-        ]; };
-        __decorate([
-            core.HostBinding("class._open")
-        ], TuiDocNavigationComponent.prototype, "menuOpen", void 0);
-        __decorate([
-            cdk.tuiPure
-        ], TuiDocNavigationComponent.prototype, "filterItems", null);
-        __decorate([
-            cdk.tuiPure
-        ], TuiDocNavigationComponent.prototype, "flattenSubPages", null);
-        TuiDocNavigationComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-navigation",
-                template: "<tui-hosted-dropdown\n    *tuiLet=\"filteredItems as filtered\"\n    tuiAutoFocus\n    tuiDropdownLimitWidth=\"fixed\"\n    class=\"t-input\"\n    [autoFocus]=\"!!sidebar\"\n    [content]=\"dropdown\"\n    [canOpen]=\"canOpen\"\n    [(open)]=\"open\"\n>\n    <tui-primitive-textfield\n        iconAlign=\"left\"\n        tuiTextfieldSize=\"m\"\n        iconContent=\"tuiIconSearch\"\n        [pseudoFocused]=\"open || null\"\n        [tuiTextfieldCleaner]=\"true\"\n        [tuiTextfieldLabelOutside]=\"true\"\n        [value]=\"search\"\n        (valueChange)=\"onSearchChange($event)\"\n    >\n        {{ searchText }}\n    </tui-primitive-textfield>\n    <ng-template\n        #dropdown\n        let-activeZone\n    >\n        <tui-data-list>\n            <tui-opt-group\n                *ngFor=\"let group of filtered; let index = index\"\n                [label]=\"labels[index] || ''\"\n            >\n                <a\n                    *ngFor=\"let item of group\"\n                    tuiOption\n                    [routerLink]=\"item.route\"\n                    (click)=\"onClick()\"\n                >\n                    {{ item.title }}\n                </a>\n            </tui-opt-group>\n        </tui-data-list>\n    </ng-template>\n</tui-hosted-dropdown>\n\n<nav class=\"t-navigation\">\n    <tui-scrollbar\n        class=\"t-scrollbar\"\n        [tuiMode]=\"mode$ | async\"\n    >\n        <tui-accordion\n            [closeOthers]=\"false\"\n            [rounded]=\"false\"\n        >\n            <tui-accordion-item\n                *ngFor=\"let label of labels; index as index\"\n                size=\"s\"\n                [borders]=\"null\"\n                [(open)]=\"!!openPagesArr[index]\"\n            >\n                <span class=\"t-label\">\n                    <strong>{{ label }}</strong>\n                </span>\n                <ng-template tuiAccordionItemContent>\n                    <div class=\"t-section\">\n                        <ng-container\n                            *ngFor=\"let item of items[index]; index as subIndex\"\n                            [ngTemplateOutlet]=\"pages\"\n                            [ngTemplateOutletContext]=\"{item: item, index: index * 100 + subIndex}\"\n                        ></ng-container>\n                    </div>\n                </ng-template>\n            </tui-accordion-item>\n        </tui-accordion>\n        <div class=\"t-items-container\">\n            <ng-container\n                *ngFor=\"let item of itemsWithoutSections; let index = index\"\n                [ngTemplateOutlet]=\"pages\"\n                [ngTemplateOutletContext]=\"{item: item, index: items.length - 1 + index}\"\n            ></ng-container>\n        </div>\n\n        <ng-template\n            #pages\n            let-item=\"item\"\n            let-index=\"index\"\n        >\n            <a\n                *ngIf=\"!item.subPages; else subPages\"\n                tuiLink\n                routerLinkActive=\"t-sublink_active\"\n                class=\"t-sublink\"\n                [routerLink]=\"item.route\"\n                [scrollIntoView]=\"isActive(item.route)\"\n                (click)=\"closeMenu()\"\n            >\n                {{ item.title }}\n            </a>\n            <ng-template #subPages>\n                <div\n                    routerLinkActive\n                    class=\"t-subsection\"\n                    [routerLinkActiveOptions]=\"{exact: false}\"\n                >\n                    <button\n                        *ngIf=\"item.subPages\"\n                        tuiLink\n                        type=\"button\"\n                        class=\"t-sublink t-sublink_subsection\"\n                        (click)=\"onGroupClick(index)\"\n                    >\n                        <tui-svg\n                            src=\"tuiIconChevronRight\"\n                            class=\"t-chevron\"\n                            [class.t-chevron_active]=\"!!openPagesGroupsArr[index]\"\n                        ></tui-svg>\n                        {{ item.title }}\n                    </button>\n                    <tui-expand\n                        class=\"t-expand\"\n                        [expanded]=\"!!openPagesGroupsArr[index]\"\n                    >\n                        <div class=\"t-section t-section_bordered\">\n                            <a\n                                *ngFor=\"let subPage of item.subPages\"\n                                tuiLink\n                                routerLinkActive=\"t-sublink_active\"\n                                class=\"t-sublink t-sublink_small\"\n                                [routerLink]=\"subPage.route\"\n                                [scrollIntoView]=\"isActive(subPage.route)\"\n                                (click)=\"closeMenu()\"\n                            >\n                                {{ subPage.title }}\n                            </a>\n                        </div>\n                    </tui-expand>\n                </div>\n            </ng-template>\n        </ng-template>\n    </tui-scrollbar>\n</nav>\n\n<ng-content></ng-content>\n",
-                providers: NAVIGATION_PROVIDERS,
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{z-index:1;display:flex;flex-direction:column;text-align:center;background:var(--tui-base-01)}.t-input{display:block;margin:1.25rem}.t-navigation{display:flex;max-height:100%;min-height:0;flex:1 1 0;text-align:left}.t-scrollbar{width:100%;scroll-behavior:smooth}.t-items-container{display:flex;flex-direction:column;padding:0 1rem}.t-label{margin-left:.5rem}.t-expand{margin-left:.25rem}.t-section{display:flex;flex-direction:column;align-items:flex-start;margin:-1rem 0 -.5rem}.t-section_bordered{margin:.5rem 0;border-left:1px solid var(--tui-base-03)}.t-subsection{margin-left:.5rem}.t-sublink{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:1rem 0 0;border:0;background:0 0;font-size:inherit;line-height:inherit;font:var(--tui-font-text-m);margin-left:.5rem}.t-sublink_small{margin-left:1rem;line-height:1.5rem;padding-top:.5rem}.t-sublink_subsection{margin-left:0;line-height:1.6rem}.t-sublink_active{color:var(--tui-text-01)}.t-chevron{transition-property:transform;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;width:1rem;height:1rem;margin:-.25rem .25rem 0 -.1875rem}.t-chevron_active{transform:rotate(90deg)}"]
-            }),
-            __param(0, core.Inject(core.ChangeDetectorRef)),
-            __param(1, core.Inject(platformBrowser.Title)),
-            __param(2, core.Inject(NAVIGATION_TITLE)),
-            __param(3, core.Inject(common.DOCUMENT)),
-            __param(4, core.Inject(core$1.TuiModeDirective)),
-            __param(5, core.Optional()),
-            __param(5, core.Inject(addonMobile.TuiSidebarDirective)),
-            __param(6, core.Inject(NAVIGATION_LABELS)),
-            __param(7, core.Inject(NAVIGATION_ITEMS)),
-            __param(8, core.Inject(TUI_DOC_SEARCH_TEXT)),
-            __param(9, core.Inject(router.Router)),
-            __param(10, core.Inject(router.ActivatedRoute)),
-            __param(11, core.Inject(cdk.TuiDestroyService)),
-            __param(12, core.Inject(TUI_DOC_PAGE_LOADED)),
-            __param(13, core.Inject(TUI_DOC_SCROLL_BEHAVIOR))
-        ], TuiDocNavigationComponent);
         return TuiDocNavigationComponent;
     }());
+    TuiDocNavigationComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i8$1.Title }, { token: NAVIGATION_TITLE }, { token: i5.DOCUMENT }, { token: i2$1.TuiModeDirective }, { token: i4.TuiSidebarDirective, optional: true }, { token: NAVIGATION_LABELS }, { token: NAVIGATION_ITEMS }, { token: TUI_DOC_SEARCH_TEXT }, { token: i6$1.Router }, { token: i6$1.ActivatedRoute }, { token: i6.TuiDestroyService }, { token: TUI_DOC_PAGE_LOADED }, { token: TUI_DOC_SCROLL_BEHAVIOR }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocNavigationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocNavigationComponent, selector: "tui-doc-navigation", host: { properties: { "class._open": "this.menuOpen" } }, providers: NAVIGATION_PROVIDERS, ngImport: i0__namespace, template: "<tui-input\n    #input\n    tuiTextfieldSize=\"m\"\n    tuiTextfieldIconLeft=\"tuiIconSearch\"\n    class=\"t-input\"\n    [formControl]=\"search\"\n    [tuiAutoFocus]=\"!!sidebar\"\n    [tuiTextfieldCleaner]=\"true\"\n    [tuiTextfieldLabelOutside]=\"true\"\n>\n    {{ searchText }}\n    <ng-container *ngIf=\"canOpen\">\n        <tui-data-list *tuiDataList>\n            <tui-opt-group\n                *ngFor=\"let group of filtered$ | async; let index = index\"\n                [label]=\"labels[index] || ''\"\n            >\n                <a\n                    *ngFor=\"let item of group\"\n                    tuiOption\n                    [routerLink]=\"item.route\"\n                    (click)=\"onClick(input)\"\n                >\n                    {{ item.title }}\n                </a>\n            </tui-opt-group>\n        </tui-data-list>\n    </ng-container>\n</tui-input>\n\n<nav class=\"t-navigation\">\n    <tui-scrollbar\n        class=\"t-scrollbar\"\n        [tuiMode]=\"mode$ | async\"\n    >\n        <tui-accordion\n            [closeOthers]=\"false\"\n            [rounded]=\"false\"\n        >\n            <tui-accordion-item\n                *ngFor=\"let label of labels; index as index\"\n                size=\"s\"\n                [borders]=\"null\"\n                [(open)]=\"!!openPagesArr[index]\"\n            >\n                <span class=\"t-label\">\n                    <strong>{{ label }}</strong>\n                </span>\n                <ng-template tuiAccordionItemContent>\n                    <div class=\"t-section\">\n                        <ng-container\n                            *ngFor=\"let item of items[index]; index as subIndex\"\n                            [ngTemplateOutlet]=\"pages\"\n                            [ngTemplateOutletContext]=\"{item: item, index: index * 100 + subIndex}\"\n                        ></ng-container>\n                    </div>\n                </ng-template>\n            </tui-accordion-item>\n        </tui-accordion>\n        <div class=\"t-items-container\">\n            <ng-container\n                *ngFor=\"let item of itemsWithoutSections; let index = index\"\n                [ngTemplateOutlet]=\"pages\"\n                [ngTemplateOutletContext]=\"{item: item, index: items.length - 1 + index}\"\n            ></ng-container>\n        </div>\n\n        <ng-template\n            #pages\n            let-item=\"item\"\n            let-index=\"index\"\n        >\n            <a\n                *ngIf=\"!item.subPages; else subPages\"\n                tuiLink\n                routerLinkActive=\"t-sublink_active\"\n                class=\"t-sublink\"\n                [routerLink]=\"item.route\"\n                [tuiScrollIntoViewLink]=\"isActive(item.route)\"\n                (click)=\"closeMenu()\"\n            >\n                {{ item.title }}\n            </a>\n            <ng-template #subPages>\n                <div\n                    routerLinkActive\n                    class=\"t-subsection\"\n                    [routerLinkActiveOptions]=\"{exact: false}\"\n                >\n                    <button\n                        *ngIf=\"item.subPages\"\n                        tuiLink\n                        type=\"button\"\n                        class=\"t-sublink t-sublink_subsection\"\n                        (click)=\"onGroupClick(index)\"\n                    >\n                        <tui-svg\n                            src=\"tuiIconChevronRight\"\n                            class=\"t-chevron\"\n                            [class.t-chevron_active]=\"!!openPagesGroupsArr[index]\"\n                        ></tui-svg>\n                        {{ item.title }}\n                    </button>\n                    <tui-expand\n                        class=\"t-expand\"\n                        [expanded]=\"!!openPagesGroupsArr[index]\"\n                    >\n                        <div class=\"t-section t-section_bordered\">\n                            <a\n                                *ngFor=\"let subPage of item.subPages\"\n                                tuiLink\n                                routerLinkActive=\"t-sublink_active\"\n                                class=\"t-sublink t-sublink_small\"\n                                [routerLink]=\"subPage.route\"\n                                [tuiScrollIntoViewLink]=\"isActive(subPage.route)\"\n                                (click)=\"closeMenu()\"\n                            >\n                                {{ subPage.title }}\n                            </a>\n                        </div>\n                    </tui-expand>\n                </div>\n            </ng-template>\n        </ng-template>\n    </tui-scrollbar>\n</nav>\n\n<ng-content></ng-content>\n", styles: [":host{z-index:1;display:flex;flex-direction:column;text-align:center;background:var(--tui-base-01)}.t-input{margin:1.25rem}.t-navigation{display:flex;max-height:100%;min-height:0;flex:1 1 0;text-align:left}.t-scrollbar{width:100%;scroll-behavior:smooth}.t-items-container{display:flex;flex-direction:column;padding:0 1rem}.t-label{margin-left:.5rem}.t-expand{margin-left:.25rem}.t-section{display:flex;flex-direction:column;align-items:flex-start;margin:-1rem 0 -.5rem}.t-section_bordered{margin:.5rem 0;border-left:1px solid var(--tui-base-03)}.t-subsection{margin-left:.5rem}.t-sublink{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:1rem 0 0;border:0;background:none;font-size:inherit;line-height:inherit;font:var(--tui-font-text-m);margin-left:.5rem}.t-sublink_small{margin-left:1rem;line-height:1.5rem;padding-top:.5rem}.t-sublink_subsection{margin-left:0;line-height:1.6rem}.t-sublink_active{color:var(--tui-text-01)}.t-chevron{transition-property:transform;transition-duration:.3s;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:1rem;height:1rem;margin:-.25rem .25rem 0 -.1875rem}.t-chevron_active{transform:rotate(90deg)}\n"], components: [{ type: i1__namespace.TuiInputComponent, selector: "tui-input" }, { type: i2__namespace$1.TuiDataListComponent, selector: "tui-data-list", inputs: ["role", "emptyContent"] }, { type: i2__namespace$1.TuiOptionComponent, selector: "button[tuiOption], a[tuiOption]", inputs: ["size", "role", "disabled", "value"] }, { type: i2__namespace$1.TuiScrollbarComponent, selector: "tui-scrollbar", inputs: ["hidden"] }, { type: i1__namespace.TuiAccordionComponent, selector: "tui-accordion", inputs: ["closeOthers", "rounded"] }, { type: i1__namespace.TuiAccordionItemComponent, selector: "tui-accordion-item", inputs: ["noPadding", "showArrow", "borders", "size", "disabled", "disableHover", "open", "async"], outputs: ["openChange"] }, { type: i2__namespace$1.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }, { type: i2__namespace$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i2__namespace$1.TuiExpandComponent, selector: "tui-expand", inputs: ["async", "expanded"] }], directives: [{ type: i1__namespace.TuiInputDirective, selector: "tui-input" }, { type: i2__namespace$1.TuiTextfieldSizeDirective, selector: "[tuiTextfieldSize]", inputs: ["tuiTextfieldSize"] }, { type: i2__namespace$1.TuiTextfieldIconLeftDirective, selector: "[tuiTextfieldIconLeft]", inputs: ["tuiTextfieldIconLeft"] }, { type: i5__namespace$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5__namespace$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6__namespace$1.TuiAutoFocusDirective, selector: "[tuiAutoFocus]", inputs: ["tuiAutoFocus"] }, { type: i2__namespace$1.TuiTextfieldCleanerDirective, selector: "[tuiTextfieldCleaner]", inputs: ["tuiTextfieldCleaner"] }, { type: i2__namespace$1.TuiTextfieldLabelOutsideDirective, selector: "[tuiTextfieldLabelOutside]", inputs: ["tuiTextfieldLabelOutside"] }, { type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$1.TuiDataListDirective, selector: "ng-template[tuiDataList]" }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$1.TuiOptGroupDirective, selector: "tui-opt-group", inputs: ["label"] }, { type: i6__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i2__namespace$1.TuiModeDirective, selector: "[tuiMode]", inputs: ["tuiMode"] }, { type: i1__namespace.TuiAccordionItemContentDirective, selector: "ng-template[tuiAccordionItemContent]" }, { type: i5__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6__namespace.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: TuiScrollIntoViewLinkDirective, selector: "[tuiScrollIntoViewLink]", inputs: ["tuiScrollIntoViewLink"] }], pipes: { "async": i5__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    __decorate([
+        i6.tuiPure
+    ], TuiDocNavigationComponent.prototype, "filterItems", null);
+    __decorate([
+        i6.tuiPure
+    ], TuiDocNavigationComponent.prototype, "flattenSubPages", null);
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocNavigationComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-navigation",
+                        templateUrl: "navigation.template.html",
+                        styleUrls: ["navigation.style.less"],
+                        providers: NAVIGATION_PROVIDERS,
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i0__namespace.ChangeDetectorRef, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.ChangeDetectorRef]
+                        }] }, { type: i8__namespace$1.Title, decorators: [{
+                            type: i0.Inject,
+                            args: [i8$1.Title]
+                        }] }, { type: i9__namespace.Observable, decorators: [{
+                            type: i0.Inject,
+                            args: [NAVIGATION_TITLE]
+                        }] }, { type: Document, decorators: [{
+                            type: i0.Inject,
+                            args: [i5.DOCUMENT]
+                        }] }, { type: i2__namespace$1.TuiModeDirective, decorators: [{
+                            type: i0.Inject,
+                            args: [i2$1.TuiModeDirective]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Optional
+                        }, {
+                            type: i0.Inject,
+                            args: [i4.TuiSidebarDirective]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [NAVIGATION_LABELS]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [NAVIGATION_ITEMS]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_SEARCH_TEXT]
+                        }] }, { type: i6__namespace.Router, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.Router]
+                        }] }, { type: i6__namespace.ActivatedRoute, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.ActivatedRoute]
+                        }] }, { type: i9__namespace.Observable, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TuiDestroyService]
+                        }] }, { type: i9__namespace.Observable, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_PAGE_LOADED]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_SCROLL_BEHAVIOR]
+                        }] }];
+        }, propDecorators: { menuOpen: [{
+                    type: i0.HostBinding,
+                    args: ["class._open"]
+                }], filterItems: [], flattenSubPages: [] } });
 
-    var TuiDocNavigationModule = /** @class */ (function () {
-        function TuiDocNavigationModule() {
-        }
-        TuiDocNavigationModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    forms.FormsModule,
-                    router.RouterModule,
-                    ScrollIntoViewModule,
-                    TuiScrollIntoViewLinkModule,
-                    core$1.TuiButtonModule,
-                    core$1.TuiPrimitiveTextfieldModule,
-                    core$1.TuiTextfieldControllerModule,
-                    cdk.TuiActiveZoneModule,
-                    cdk.TuiLetModule,
-                    core$1.TuiModeModule,
-                    core$1.TuiLinkModule,
-                    core$1.TuiExpandModule,
-                    core$1.TuiHostedDropdownModule,
-                    core$1.TuiDropdownControllerModule,
-                    kit.TuiAccordionModule,
-                    core$1.TuiScrollbarModule,
-                    core$1.TuiSvgModule,
-                    core$1.TuiDataListModule,
-                    cdk.TuiAutoFocusModule,
-                ],
-                declarations: [TuiDocNavigationComponent],
-                exports: [TuiDocNavigationComponent],
-            })
-        ], TuiDocNavigationModule);
-        return TuiDocNavigationModule;
-    }());
-
-    var TUI_DOC_LOGO = new core.InjectionToken("Main logo", {
+    var TUI_DOC_LOGO = new i0.InjectionToken("Main logo", {
         factory: function () { return ""; },
     });
 
@@ -1876,8 +1987,8 @@
             this.menu = menu;
             this.router = router;
             this.swipes$ = swipes$;
-            this.stream$ = new rxjs.Subject();
-            this.open$ = rxjs.merge(this.router.events.pipe(operators.mapTo(false)), this.stream$, this.swipes$.pipe(operators.filter(function (swipe) { return swipe.direction === "left" || swipe.direction === "right"; }), operators.map(function (swipe) { return swipe.direction === "right"; }))).pipe(operators.startWith(false), operators.distinctUntilChanged());
+            this.stream$ = new i9.Subject();
+            this.open$ = i9.merge(this.router.events.pipe(operators.mapTo(false)), this.stream$, this.swipes$.pipe(operators.filter(function (swipe) { return swipe.direction === "left" || swipe.direction === "right"; }), operators.map(function (swipe) { return swipe.direction === "right"; }))).pipe(operators.startWith(false), operators.distinctUntilChanged());
         }
         TuiDocHeaderComponent.prototype.onClick = function () {
             this.stream$.next(true);
@@ -1887,180 +1998,382 @@
                 this.stream$.next(false);
             }
         };
-        TuiDocHeaderComponent.ctorParameters = function () { return [
-            { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_LOGO,] }] },
-            { type: String, decorators: [{ type: core.Inject, args: [TUI_DOC_MENU_TEXT,] }] },
-            { type: router.Router, decorators: [{ type: core.Inject, args: [router.Router,] }] },
-            { type: cdk.TuiSwipeService, decorators: [{ type: core.Inject, args: [cdk.TuiSwipeService,] }] }
-        ]; };
-        TuiDocHeaderComponent = __decorate([
-            core.Component({
-                selector: "header[tuiDocHeader]",
-                template: "<button\n    tuiIconButton\n    icon=\"tuiIconMenuLarge\"\n    appearance=\"icon\"\n    class=\"t-menu\"\n    [title]=\"menu\"\n    (click)=\"onClick()\"\n    (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n    <tui-doc-navigation\n        *tuiSidebar=\"!!(open$ | async)\"\n        class=\"t-navigation\"\n    ></tui-doc-navigation>\n</button>\n<div\n    polymorpheus-outlet\n    class=\"t-logo\"\n    [content]=\"logo\"\n>\n    <ng-template let-src>\n        <img\n            alt=\"Logo\"\n            class=\"t-img\"\n            [src]=\"src\"\n        />\n    </ng-template>\n</div>\n<ng-content></ng-content>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{box-shadow:0 .125rem 1rem rgba(0,0,0,.08);position:fixed;top:0;left:0;right:0;z-index:1;display:flex;height:3.9375rem;align-items:center;padding:0 1.25rem;background:var(--tui-base-01);border-bottom:1px solid var(--tui-base-03)}.t-logo{margin-right:auto;font:var(--tui-font-heading-5)}.t-img{display:block}.t-menu{margin-left:-1.25rem}@media screen and (min-width:48em){.t-menu{display:none}}.t-navigation{min-height:100%}"]
-            }),
-            __param(0, core.Inject(TUI_DOC_LOGO)),
-            __param(1, core.Inject(TUI_DOC_MENU_TEXT)),
-            __param(2, core.Inject(router.Router)),
-            __param(3, core.Inject(cdk.TuiSwipeService))
-        ], TuiDocHeaderComponent);
         return TuiDocHeaderComponent;
     }());
+    TuiDocHeaderComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocHeaderComponent, deps: [{ token: TUI_DOC_LOGO }, { token: TUI_DOC_MENU_TEXT }, { token: i6$1.Router }, { token: i6.TuiSwipeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocHeaderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocHeaderComponent, selector: "header[tuiDocHeader]", ngImport: i0__namespace, template: "<button\n    tuiIconButton\n    icon=\"tuiIconMenuLarge\"\n    appearance=\"icon\"\n    class=\"t-menu\"\n    [title]=\"menu\"\n    (click)=\"onClick()\"\n    (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n    <tui-doc-navigation\n        *tuiSidebar=\"!!(open$ | async)\"\n        class=\"t-navigation\"\n    ></tui-doc-navigation>\n</button>\n<div class=\"t-logo\">\n    <img\n        *polymorpheusOutlet=\"logo as src\"\n        alt=\"Logo\"\n        class=\"t-img\"\n        [src]=\"src\"\n    />\n</div>\n<ng-content></ng-content>\n", styles: [":host{box-shadow:0 .125rem 1rem rgba(0,0,0,.08);position:fixed;top:0;left:0;right:0;z-index:1;display:flex;height:3.9375rem;align-items:center;padding:0 1.25rem;background:var(--tui-base-01);border-bottom:1px solid var(--tui-base-03)}.t-logo{margin-right:auto;font:var(--tui-font-heading-5)}.t-img{display:block}.t-menu{margin-left:-1.25rem}@media screen and (min-width: 48em){.t-menu{display:none}}.t-navigation{min-height:100%}\n"], components: [{ type: i2__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }, { type: TuiDocNavigationComponent, selector: "tui-doc-navigation" }], directives: [{ type: i6__namespace$1.TuiActiveZoneDirective, selector: "[tuiActiveZone]:not(ng-container), [tuiActiveZoneChange]:not(ng-container), [tuiActiveZoneParent]:not(ng-container)", inputs: ["tuiActiveZoneParent"], outputs: ["tuiActiveZoneChange"], exportAs: ["tuiActiveZone"] }, { type: i4__namespace.TuiSidebarDirective, selector: "[tuiSidebar]", inputs: ["tuiSidebarDirection", "tuiSidebarAutoWidth", "tuiSidebar"] }, { type: i6__namespace$2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], pipes: { "async": i5__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocHeaderComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "header[tuiDocHeader]",
+                        templateUrl: "./header.template.html",
+                        styleUrls: ["./header.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_LOGO]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_MENU_TEXT]
+                        }] }, { type: i6__namespace.Router, decorators: [{
+                            type: i0.Inject,
+                            args: [i6$1.Router]
+                        }] }, { type: i6__namespace$1.TuiSwipeService, decorators: [{
+                            type: i0.Inject,
+                            args: [i6.TuiSwipeService]
+                        }] }];
+        } });
+
+    var TuiDocMainComponent = /** @class */ (function () {
+        function TuiDocMainComponent(storage, windowRef) {
+            this.storage = storage;
+            this.windowRef = windowRef;
+            this.night = this.storage.getItem("night") === "true" ||
+                (this.storage.getItem("night") === null &&
+                    this.windowRef.matchMedia("(prefers-color-scheme: dark)").matches);
+            this.change$ = new i9.Subject();
+        }
+        Object.defineProperty(TuiDocMainComponent.prototype, "mode", {
+            get: function () {
+                return this.night ? "onDark" : null;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TuiDocMainComponent.prototype.onMode = function (night) {
+            this.night = night;
+            this.change$.next();
+            this.storage.setItem("night", String(night));
+        };
+        return TuiDocMainComponent;
+    }());
+    TuiDocMainComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocMainComponent, deps: [{ token: common.LOCAL_STORAGE }, { token: common.WINDOW }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocMainComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocMainComponent, selector: "tui-doc-main", host: { properties: { "attr.data-mode": "this.mode" } }, providers: [
+            {
+                provide: i2$1.TuiModeDirective,
+                useExisting: i0.forwardRef(function () { return TuiDocMainComponent; }),
+            },
+            i6.TuiSwipeService,
+        ], ngImport: i0__namespace, template: "<tui-theme-night *ngIf=\"night\"></tui-theme-night>\n<tui-root>\n    <div class=\"tui-doc-page\">\n        <tui-doc-navigation class=\"tui-doc-navigation\">\n            <ng-content select=\"tuiDocNavigation\"></ng-content>\n        </tui-doc-navigation>\n        <div class=\"tui-doc-content\">\n            <router-outlet class=\"tui-doc-outlet\"></router-outlet>\n        </div>\n    </div>\n    <header tuiDocHeader>\n        <label class=\"night-mode\">\n            Night mode\n            <tui-toggle\n                class=\"tui-toggle\"\n                [ngModel]=\"night\"\n                (ngModelChange)=\"onMode($event)\"\n            ></tui-toggle>\n        </label>\n        <ng-content select=\"tuiDocHeader\"></ng-content>\n    </header>\n    <ng-container ngProjectAs=\"tuiOverContent\">\n        <ng-content select=\"tuiOverContent\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverDialogs\">\n        <ng-content select=\"tuiOverDialogs\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverAlerts\">\n        <ng-content select=\"tuiOverAlerts\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverPortals\">\n        <ng-content select=\"tuiOverPortals\"></ng-content>\n    </ng-container>\n    <ng-container ngProjectAs=\"tuiOverHints\">\n        <ng-content select=\"tuiOverHints\"></ng-content>\n    </ng-container>\n</tui-root>\n", styles: ["html{scroll-padding-top:4rem;height:auto}tui-root>tui-scroll-controls>.t-bar_vertical{top:4rem!important}@-webkit-keyframes tuiShaking{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-.3125rem)}20%,40%,60%,80%{transform:translate(.3125rem)}}@keyframes tuiShaking{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-.3125rem)}20%,40%,60%,80%{transform:translate(.3125rem)}}body{background:var(--tui-base-01);height:auto}tui-doc-main{display:block}code:not(.hljs):not([class*=\"language-\"]):not(.exception){transition-property:background;transition-duration:.3s;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;background:var(--tui-base-02);color:var(--tui-text-02);vertical-align:middle;box-shadow:inset 0 -2px var(--tui-secondary);padding:.375rem .5rem;font-size:.875rem;border-radius:.5rem}button:focus code,a:focus code{background:var(--tui-base-01)}.tui-doc-page{position:relative;z-index:0;padding-top:4rem}tui-doc-navigation.tui-doc-navigation{position:fixed;top:4rem;bottom:0;width:16.25rem;border-right:1px solid var(--tui-base-03)}@media screen and (max-width: 47.9625em){tui-doc-navigation.tui-doc-navigation{display:none}}.tui-doc-content{margin-left:16.25rem}@media screen and (max-width: 47.9625em){.tui-doc-content{margin-left:0}}.tui-doc-outlet+*{display:block}.tui-doc-animated-example{-webkit-animation:1s .3s tuiShaking;animation:1s .3s tuiShaking}label.night-mode{cursor:pointer}label.night-mode .tui-toggle{margin-left:.5rem}.hljs-tag{background:none}.hljs{display:block;overflow-x:auto;padding:.5em;color:var(--tui-text-01);background-color:var(--tui-clear-disabled)}.hljs.hljs-line-numbers{background:transparent}.hljs-subst,.hljs-title{font-weight:normal;color:var(--tui-text-01)}.hljs-comment,.hljs-quote{color:var(--tui-text-03);font-style:italic}.hljs-meta{color:#e38162}.hljs-section,.hljs-name,.hljs-literal,.hljs-keyword,.hljs-selector-tag,.hljs-type,.hljs-selector-id,.hljs-selector-class{font-weight:bold;color:var(--tui-link)}.hljs-attribute,.hljs-number,.hljs-regexp,.hljs-link{font-weight:bold;color:var(--tui-support-06)}.hljs-number,.hljs-regexp,.hljs-link{font-weight:normal}.hljs-string{color:var(--tui-positive);font-weight:bold}.hljs-symbol,.hljs-bullet,.hljs-formula{color:var(--tui-text-01);background:var(--tui-base-02);font-style:italic}.hljs-doctag{text-decoration:underline}.hljs-variable,.hljs-template-variable{color:var(--tui-link-hover)}[data-mode=onDark] .hljs-variable,[data-mode=onDark] .hljs-template-variable{color:var(--tui-warning-fill)}.hljs-addition{background:var(--tui-success-bg)}.hljs-deletion{background:var(--tui-error-bg)}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:bold}.hljs .hljs-line-numbers{padding:0}.hljs-ln-numbers{vertical-align:top;opacity:.3;text-align:right;padding-right:1em!important}\n"], components: [{ type: i2__namespace$1.TuiThemeNightComponent, selector: "tui-theme-night" }, { type: i2__namespace$1.TuiRootComponent, selector: "tui-root" }, { type: TuiDocNavigationComponent, selector: "tui-doc-navigation" }, { type: TuiDocHeaderComponent, selector: "header[tuiDocHeader]" }, { type: i1__namespace.TuiToggleComponent, selector: "tui-toggle", inputs: ["singleColor", "showIcons", "showLoader", "size"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate"], exportAs: ["outlet"] }, { type: i5__namespace$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5__namespace$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocMainComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-main",
+                        templateUrl: "./main.template.html",
+                        styleUrls: ["./main.style.less"],
+                        encapsulation: i0.ViewEncapsulation.None,
+                        providers: [
+                            {
+                                provide: i2$1.TuiModeDirective,
+                                useExisting: i0.forwardRef(function () { return TuiDocMainComponent; }),
+                            },
+                            i6.TuiSwipeService,
+                        ],
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: Storage, decorators: [{
+                            type: i0.Inject,
+                            args: [common.LOCAL_STORAGE]
+                        }] }, { type: Window, decorators: [{
+                            type: i0.Inject,
+                            args: [common.WINDOW]
+                        }] }];
+        }, propDecorators: { mode: [{
+                    type: i0.HostBinding,
+                    args: ["attr.data-mode"]
+                }] } });
+
+    var TuiScrollIntoViewLinkModule = /** @class */ (function () {
+        function TuiScrollIntoViewLinkModule() {
+        }
+        return TuiScrollIntoViewLinkModule;
+    }());
+    TuiScrollIntoViewLinkModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiScrollIntoViewLinkModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiScrollIntoViewLinkModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiScrollIntoViewLinkModule, declarations: [TuiScrollIntoViewLinkDirective], exports: [TuiScrollIntoViewLinkDirective] });
+    TuiScrollIntoViewLinkModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiScrollIntoViewLinkModule });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiScrollIntoViewLinkModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [TuiScrollIntoViewLinkDirective],
+                        exports: [TuiScrollIntoViewLinkDirective],
+                    }]
+            }] });
+
+    var TuiDocNavigationModule = /** @class */ (function () {
+        function TuiDocNavigationModule() {
+        }
+        return TuiDocNavigationModule;
+    }());
+    TuiDocNavigationModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocNavigationModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocNavigationModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocNavigationModule, declarations: [TuiDocNavigationComponent], imports: [i5.CommonModule,
+            i5$1.ReactiveFormsModule,
+            i6$1.RouterModule,
+            i6$2.PolymorpheusModule,
+            TuiScrollIntoViewLinkModule,
+            i2$1.TuiButtonModule,
+            i1.TuiInputModule,
+            i2$1.TuiTextfieldControllerModule,
+            i6.TuiActiveZoneModule,
+            i6.TuiLetModule,
+            i2$1.TuiModeModule,
+            i2$1.TuiLinkModule,
+            i2$1.TuiExpandModule,
+            i2$1.TuiHostedDropdownModule,
+            i2$1.TuiDropdownModule,
+            i1.TuiAccordionModule,
+            i2$1.TuiScrollbarModule,
+            i2$1.TuiSvgModule,
+            i2$1.TuiDataListModule,
+            i6.TuiAutoFocusModule], exports: [TuiDocNavigationComponent] });
+    TuiDocNavigationModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocNavigationModule, imports: [[
+                i5.CommonModule,
+                i5$1.ReactiveFormsModule,
+                i6$1.RouterModule,
+                i6$2.PolymorpheusModule,
+                TuiScrollIntoViewLinkModule,
+                i2$1.TuiButtonModule,
+                i1.TuiInputModule,
+                i2$1.TuiTextfieldControllerModule,
+                i6.TuiActiveZoneModule,
+                i6.TuiLetModule,
+                i2$1.TuiModeModule,
+                i2$1.TuiLinkModule,
+                i2$1.TuiExpandModule,
+                i2$1.TuiHostedDropdownModule,
+                i2$1.TuiDropdownModule,
+                i1.TuiAccordionModule,
+                i2$1.TuiScrollbarModule,
+                i2$1.TuiSvgModule,
+                i2$1.TuiDataListModule,
+                i6.TuiAutoFocusModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocNavigationModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i5$1.ReactiveFormsModule,
+                            i6$1.RouterModule,
+                            i6$2.PolymorpheusModule,
+                            TuiScrollIntoViewLinkModule,
+                            i2$1.TuiButtonModule,
+                            i1.TuiInputModule,
+                            i2$1.TuiTextfieldControllerModule,
+                            i6.TuiActiveZoneModule,
+                            i6.TuiLetModule,
+                            i2$1.TuiModeModule,
+                            i2$1.TuiLinkModule,
+                            i2$1.TuiExpandModule,
+                            i2$1.TuiHostedDropdownModule,
+                            i2$1.TuiDropdownModule,
+                            i1.TuiAccordionModule,
+                            i2$1.TuiScrollbarModule,
+                            i2$1.TuiSvgModule,
+                            i2$1.TuiDataListModule,
+                            i6.TuiAutoFocusModule,
+                        ],
+                        declarations: [TuiDocNavigationComponent],
+                        exports: [TuiDocNavigationComponent],
+                    }]
+            }] });
 
     var TuiDocHeaderModule = /** @class */ (function () {
         function TuiDocHeaderModule() {
         }
-        TuiDocHeaderModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    ngPolymorpheus.PolymorpheusModule,
-                    core$1.TuiButtonModule,
-                    addonMobile.TuiSidebarModule,
-                    cdk.TuiActiveZoneModule,
-                    TuiDocNavigationModule,
-                ],
-                declarations: [TuiDocHeaderComponent],
-                exports: [TuiDocHeaderComponent],
-            })
-        ], TuiDocHeaderModule);
         return TuiDocHeaderModule;
     }());
+    TuiDocHeaderModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocHeaderModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocHeaderModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocHeaderModule, declarations: [TuiDocHeaderComponent], imports: [i5.CommonModule,
+            i6$2.PolymorpheusModule,
+            i2$1.TuiButtonModule,
+            i4.TuiSidebarModule,
+            i6.TuiActiveZoneModule,
+            TuiDocNavigationModule], exports: [TuiDocHeaderComponent] });
+    TuiDocHeaderModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocHeaderModule, imports: [[
+                i5.CommonModule,
+                i6$2.PolymorpheusModule,
+                i2$1.TuiButtonModule,
+                i4.TuiSidebarModule,
+                i6.TuiActiveZoneModule,
+                TuiDocNavigationModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocHeaderModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i6$2.PolymorpheusModule,
+                            i2$1.TuiButtonModule,
+                            i4.TuiSidebarModule,
+                            i6.TuiActiveZoneModule,
+                            TuiDocNavigationModule,
+                        ],
+                        declarations: [TuiDocHeaderComponent],
+                        exports: [TuiDocHeaderComponent],
+                    }]
+            }] });
 
     var TuiDocMainModule = /** @class */ (function () {
         function TuiDocMainModule() {
         }
-        TuiDocMainModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    router.RouterModule,
-                    forms.FormsModule,
-                    kit.TuiToggleModule,
-                    core$1.TuiThemeNightModule,
-                    TuiDocHeaderModule,
-                    core$1.TuiRootModule,
-                    core$1.TuiDialogModule,
-                    core$1.TuiAlertModule,
-                    TuiDocNavigationModule,
-                ],
-                declarations: [TuiDocMainComponent],
-                exports: [TuiDocMainComponent],
-            })
-        ], TuiDocMainModule);
         return TuiDocMainModule;
     }());
+    TuiDocMainModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocMainModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocMainModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocMainModule, declarations: [TuiDocMainComponent], imports: [i5.CommonModule,
+            i6$1.RouterModule,
+            i5$1.FormsModule,
+            i1.TuiToggleModule,
+            i2$1.TuiThemeNightModule,
+            TuiDocHeaderModule,
+            i2$1.TuiRootModule,
+            i2$1.TuiDialogModule,
+            i2$1.TuiAlertModule,
+            TuiDocNavigationModule], exports: [TuiDocMainComponent] });
+    TuiDocMainModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocMainModule, imports: [[
+                i5.CommonModule,
+                i6$1.RouterModule,
+                i5$1.FormsModule,
+                i1.TuiToggleModule,
+                i2$1.TuiThemeNightModule,
+                TuiDocHeaderModule,
+                i2$1.TuiRootModule,
+                i2$1.TuiDialogModule,
+                i2$1.TuiAlertModule,
+                TuiDocNavigationModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocMainModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i6$1.RouterModule,
+                            i5$1.FormsModule,
+                            i1.TuiToggleModule,
+                            i2$1.TuiThemeNightModule,
+                            TuiDocHeaderModule,
+                            i2$1.TuiRootModule,
+                            i2$1.TuiDialogModule,
+                            i2$1.TuiAlertModule,
+                            TuiDocNavigationModule,
+                        ],
+                        declarations: [TuiDocMainComponent],
+                        exports: [TuiDocMainComponent],
+                    }]
+            }] });
 
-    var TUI_DOC_DEFAULT_TABS = new core.InjectionToken("Array of default tab names", {
+    var TUI_DOC_DEFAULT_TABS = new i0.InjectionToken("Array of default tab names", {
         factory: function () { return []; },
     });
 
-    var TUI_DOC_SEE_ALSO = new core.InjectionToken("Array of arrays of related pages", {
+    var TUI_DOC_SEE_ALSO = new i0.InjectionToken("Array of arrays of related pages", {
         factory: function () { return []; },
     });
 
-    var PAGE_SEE_ALSO = new core.InjectionToken("Page see also");
+    var PAGE_SEE_ALSO = new i0.InjectionToken("Page see also");
     var PAGE_PROVIDERS = [
         {
             provide: PAGE_SEE_ALSO,
-            deps: [core.ElementRef, TUI_DOC_SEE_ALSO],
-            useFactory: seeAlsoProviderFactory,
+            deps: [i0.ElementRef, TUI_DOC_SEE_ALSO],
+            useFactory: function (_a, seeAlsoGroups) {
+                var nativeElement = _a.nativeElement;
+                var currentHeader = nativeElement.getAttribute("header");
+                var groups = seeAlsoGroups.filter(function (group) { return group.includes(currentHeader); }) || [];
+                var seeAlsoSet = new Set(groups
+                    .join()
+                    .split(",")
+                    .filter(function (component) { return component && component !== currentHeader; }));
+                return Array.from(seeAlsoSet);
+            },
         },
     ];
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function seeAlsoProviderFactory(_a, seeAlsoGroups) {
-        var nativeElement = _a.nativeElement;
-        var currentHeader = nativeElement.getAttribute("header");
-        var groups = seeAlsoGroups.filter(function (group) { return group.includes(currentHeader); }) || [];
-        var seeAlsoSet = new Set(groups
-            .join()
-            .split(",")
-            .filter(function (component) { return component && component !== currentHeader; }));
-        return Array.from(seeAlsoSet);
-    }
 
     var TuiDocPageTabConnectorDirective = /** @class */ (function () {
         function TuiDocPageTabConnectorDirective(template) {
             this.template = template;
         }
-        TuiDocPageTabConnectorDirective.ctorParameters = function () { return [
-            { type: core.TemplateRef, decorators: [{ type: core.Inject, args: [core.TemplateRef,] }] }
-        ]; };
-        __decorate([
-            core.Input(),
-            cdk.tuiDefaultProp()
-        ], TuiDocPageTabConnectorDirective.prototype, "pageTab", void 0);
-        TuiDocPageTabConnectorDirective = __decorate([
-            core.Directive({
-                selector: "[pageTab]",
-            }),
-            __param(0, core.Inject(core.TemplateRef))
-        ], TuiDocPageTabConnectorDirective);
         return TuiDocPageTabConnectorDirective;
     }());
+    TuiDocPageTabConnectorDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageTabConnectorDirective, deps: [{ token: i0.TemplateRef }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    TuiDocPageTabConnectorDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocPageTabConnectorDirective, selector: "[pageTab]", inputs: { pageTab: "pageTab" }, ngImport: i0__namespace });
+    __decorate([
+        i6.tuiDefaultProp()
+    ], TuiDocPageTabConnectorDirective.prototype, "pageTab", void 0);
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageTabConnectorDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: "[pageTab]",
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: i0__namespace.TemplateRef, decorators: [{
+                            type: i0.Inject,
+                            args: [i0.TemplateRef]
+                        }] }];
+        }, propDecorators: { pageTab: [{
+                    type: i0.Input
+                }] } });
 
-    // Ambient type cannot be used without dynamic https://github.com/angular/angular/issues/23395
-    // @dynamic
-    var TuiDocPageComponent = /** @class */ (function () {
-        function TuiDocPageComponent(deprecated, defaultTabs, seeAlso) {
-            this.deprecated = deprecated;
-            this.defaultTabs = defaultTabs;
-            this.seeAlso = seeAlso;
+    var TUI_DOC_SOURCE_CODE = new i0.InjectionToken("Source code link", {
+        factory: function () { return null; },
+    });
+
+    var TuiDocSourceCodeComponent = /** @class */ (function () {
+        function TuiDocSourceCodeComponent(sourceCode, text) {
+            this.sourceCode = sourceCode;
+            this.text = text;
             this.header = "";
             this.package = "";
             this.type = "";
             this.path = "";
-            this.tabConnectors = cdk.EMPTY_QUERY;
-            this.activeItemIndex = NaN;
         }
-        Object.defineProperty(TuiDocPageComponent.prototype, "showSeeAlso", {
+        Object.defineProperty(TuiDocSourceCodeComponent.prototype, "pathOptions", {
             get: function () {
-                return !!this.seeAlso.length && this.activeItemIndex === 0;
+                return this.getPathOptions(this.header, this.package, this.type, this.path);
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
-        TuiDocPageComponent.prototype.getRouterLink = function (tab) {
-            if (tab === void 0) { tab = ""; }
-            return "./" + tab.replace(/ /g, "_");
+        TuiDocSourceCodeComponent.prototype.getPathOptions = function (header, packageName, type, path) {
+            return {
+                header: header,
+                package: packageName,
+                type: type,
+                path: path,
+            };
         };
-        TuiDocPageComponent.ctorParameters = function () { return [
-            { type: String, decorators: [{ type: core.Attribute, args: ["deprecated",] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_DEFAULT_TABS,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [PAGE_SEE_ALSO,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiDocPageComponent.prototype, "header", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocPageComponent.prototype, "package", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocPageComponent.prototype, "type", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocPageComponent.prototype, "path", void 0);
-        __decorate([
-            core.ContentChildren(TuiDocPageTabConnectorDirective)
-        ], TuiDocPageComponent.prototype, "tabConnectors", void 0);
-        TuiDocPageComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-page",
-                template: "<header class=\"t-header\">\n    <h1 class=\"t-title\">\n        {{ header }}\n        <tui-tag\n            *ngIf=\"deprecated !== null\"\n            value=\"deprecated\"\n            status=\"custom\"\n            class=\"t-tag t-tag_deprecated\"\n        ></tui-tag>\n        <tui-tag\n            *ngIf=\"package\"\n            status=\"custom\"\n            class=\"t-tag t-tag_package\"\n            [value]=\"package\"\n            [autoColor]=\"true\"\n        ></tui-tag>\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=\"first; else dynamicTab\">\n                <a\n                    *tuiTab\n                    tuiTab\n                    routerLink=\"./\"\n                    routerLinkActive\n                    [routerLinkActiveOptions]=\"{exact: true}\"\n                >\n                    {{ tab.pageTab || defaultTabs[index] }}\n                </a>\n            </ng-container>\n            <ng-template #dynamicTab>\n                <a\n                    *tuiTab\n                    tuiTab\n                    routerLinkActive\n                    [routerLink]=\"getRouterLink(tab.pageTab || defaultTabs[index])\"\n                >\n                    {{ tab.pageTab || defaultTabs[index] }}\n                </a>\n            </ng-template>\n        </ng-container>\n    </tui-tabs-with-more>\n    <tui-doc-source-code\n        class=\"t-source-code\"\n        [header]=\"header\"\n        [package]=\"package\"\n        [type]=\"type\"\n        [path]=\"path\"\n    ></tui-doc-source-code>\n</header>\n<div class=\"t-content\">\n    <ng-content></ng-content>\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    ></tui-doc-see-also>\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        ></ng-container>\n    </ng-container>\n</div>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                providers: PAGE_PROVIDERS,
-                styles: [":host{display:flex;flex-direction:column;min-height:0;flex-basis:0;flex-grow:1}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;min-height:7.25rem;color:var(--tui-text-01);box-shadow:inset 0 -1px 0 0 var(--tui-base-03);padding:3.75rem 0 0;box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}:host-context(tui-root._mobile) .t-header{font:var(--tui-font-heading-4);min-height:4.5rem;padding:1.25rem 1.25rem 0;margin:0}.t-title{min-width:100%;font-size:inherit;margin:0}.t-tag{vertical-align:middle;text-transform:uppercase;margin-right:.5rem}.t-tag_deprecated{background-color:var(--tui-error-fill)}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0}:host-context(tui-root._mobile) .t-tabs{margin-top:.25rem}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}:host-context(tui-root._mobile) .t-content{padding:2rem 1.25rem;margin:0}.t-see-also{min-width:18.75rem;width:30%;float:right;margin-left:1.5rem}:host-context(tui-root._mobile) .t-see-also{float:none;width:100%;margin:0 0 1.5rem}.t-source-code{align-self:flex-end;line-height:2.75rem}"]
-            }),
-            __param(0, core.Attribute("deprecated")),
-            __param(1, core.Inject(TUI_DOC_DEFAULT_TABS)),
-            __param(2, core.Inject(PAGE_SEE_ALSO))
-        ], TuiDocPageComponent);
-        return TuiDocPageComponent;
+        return TuiDocSourceCodeComponent;
     }());
+    TuiDocSourceCodeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSourceCodeComponent, deps: [{ token: TUI_DOC_SOURCE_CODE }, { token: TUI_DOC_SOURCE_CODE_TEXT }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocSourceCodeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocSourceCodeComponent, selector: "tui-doc-source-code", inputs: { header: "header", package: "package", type: "type", path: "path" }, ngImport: i0__namespace, template: "<a\n    *polymorpheusOutlet=\"sourceCode as link; context: pathOptions\"\n    tuiIconButton\n    type=\"button\"\n    icon=\"tuiIconCodeLarge\"\n    appearance=\"icon\"\n    target=\"_blank\"\n    size=\"s\"\n    [title]=\"text\"\n    [href]=\"link\"\n></a>\n", components: [{ type: i2__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i6__namespace$2.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    __decorate([
+        i6.tuiPure
+    ], TuiDocSourceCodeComponent.prototype, "getPathOptions", null);
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSourceCodeComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-source-code",
+                        templateUrl: "./source-code.template.html",
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_SOURCE_CODE]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_SOURCE_CODE_TEXT]
+                        }] }];
+        }, propDecorators: { header: [{
+                    type: i0.Input
+                }], package: [{
+                    type: i0.Input
+                }], type: [{
+                    type: i0.Input
+                }], path: [{
+                    type: i0.Input
+                }], getPathOptions: [] } });
 
-    // @dynamic
     var TuiDocSeeAlsoComponent = /** @class */ (function () {
         function TuiDocSeeAlsoComponent(text, pages) {
             this.text = text;
@@ -2071,7 +2384,7 @@
             for (var i = 0; i < this.pages.length; i++) {
                 var page = this.pages
                     .map(function (page) { return ("subPages" in page ? page.subPages : [page]); })
-                    .reduce(function (pages, subPages) { return __spread(pages, subPages); }, [])
+                    .reduce(function (pages, subPages) { return __spreadArray(__spreadArray([], __read(pages)), __read(subPages)); }, [])
                     .find(function (page) { return page.title === pageTitle; });
                 if (page === null || page === void 0 ? void 0 : page.route) {
                     return page.route;
@@ -2079,130 +2392,159 @@
             }
             return "";
         };
-        TuiDocSeeAlsoComponent.ctorParameters = function () { return [
-            { type: String, decorators: [{ type: core.Inject, args: [TUI_DOC_SEE_ALSO_TEXT,] }] },
-            { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_PAGES,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiDocSeeAlsoComponent.prototype, "seeAlso", void 0);
-        TuiDocSeeAlsoComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-see-also",
-                template: "<h5 class=\"t-header\">{{ text }}</h5>\n<ng-container *ngFor=\"let item of seeAlso; last as last\">\n    <a\n        tuiLink\n        [routerLink]=\"getRouterLink(item)\"\n    >\n        {{ item }}\n    </a>\n    <ng-container *ngIf=\"!last\">{{ ', ' }}</ng-container>\n</ng-container>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush,
-                styles: [":host{display:block}.t-header{font-size:.6875rem;line-height:1rem;text-transform:uppercase;letter-spacing:.075em;color:var(--tui-text-02);margin:0 0 .5rem;white-space:nowrap}"]
-            }),
-            __param(0, core.Inject(TUI_DOC_SEE_ALSO_TEXT)),
-            __param(1, core.Inject(TUI_DOC_PAGES))
-        ], TuiDocSeeAlsoComponent);
         return TuiDocSeeAlsoComponent;
     }());
+    TuiDocSeeAlsoComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSeeAlsoComponent, deps: [{ token: TUI_DOC_SEE_ALSO_TEXT }, { token: TUI_DOC_PAGES }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocSeeAlsoComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocSeeAlsoComponent, selector: "tui-doc-see-also", inputs: { seeAlso: "seeAlso" }, ngImport: i0__namespace, template: "<h5 class=\"t-header\">{{ text }}</h5>\n<ng-container *ngFor=\"let item of seeAlso; last as last\">\n    <a\n        tuiLink\n        [routerLink]=\"getRouterLink(item)\"\n    >\n        {{ item }}\n    </a>\n    <ng-container *ngIf=\"!last\">{{ ', ' }}</ng-container>\n</ng-container>\n", styles: [":host{display:block}.t-header{font-size:.6875rem;line-height:1rem;text-transform:uppercase;letter-spacing:.075em;color:var(--tui-text-02);margin:0 0 .5rem;white-space:nowrap}\n"], components: [{ type: i2__namespace$1.TuiLinkComponent, selector: "a[tuiLink], button[tuiLink]", inputs: ["pseudo", "icon", "iconAlign", "iconRotated", "mode"], exportAs: ["tuiLink"] }], directives: [{ type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSeeAlsoComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-see-also",
+                        templateUrl: "./see-also.template.html",
+                        styleUrls: ["./see-also.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_SEE_ALSO_TEXT]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_PAGES]
+                        }] }];
+        }, propDecorators: { seeAlso: [{
+                    type: i0.Input
+                }] } });
 
-    var TuiDocSeeAlsoModule = /** @class */ (function () {
-        function TuiDocSeeAlsoModule() {
-        }
-        TuiDocSeeAlsoModule = __decorate([
-            core.NgModule({
-                imports: [common.CommonModule, router.RouterModule, core$1.TuiLinkModule],
-                declarations: [TuiDocSeeAlsoComponent],
-                exports: [TuiDocSeeAlsoComponent],
-            })
-        ], TuiDocSeeAlsoModule);
-        return TuiDocSeeAlsoModule;
-    }());
-
-    var TUI_DOC_SOURCE_CODE = new core.InjectionToken("Source code link", {
-        factory: function () { return ""; },
-    });
-
-    var TuiDocSourceCodeComponent = /** @class */ (function () {
-        function TuiDocSourceCodeComponent(sourceCode, text) {
-            this.sourceCode = sourceCode;
-            this.text = text;
+    var TuiDocPageComponent = /** @class */ (function () {
+        function TuiDocPageComponent(deprecated, defaultTabs, seeAlso) {
+            this.deprecated = deprecated;
+            this.defaultTabs = defaultTabs;
+            this.seeAlso = seeAlso;
             this.header = "";
             this.package = "";
             this.type = "";
             this.path = "";
+            this.tabConnectors = i6.EMPTY_QUERY;
+            this.activeItemIndex = NaN;
         }
-        Object.defineProperty(TuiDocSourceCodeComponent.prototype, "pathOptions", {
+        Object.defineProperty(TuiDocPageComponent.prototype, "showSeeAlso", {
             get: function () {
-                return this.getPathOptions(this.header, this.package, this.type, this.path);
+                return !!this.seeAlso.length && this.activeItemIndex === 0;
             },
-            enumerable: true,
+            enumerable: false,
             configurable: true
         });
-        TuiDocSourceCodeComponent.prototype.getPathOptions = function (header, packageName, type, path) {
-            return {
-                header: header,
-                package: packageName,
-                type: type,
-                path: path,
-            };
+        TuiDocPageComponent.prototype.getRouterLink = function (tab) {
+            if (tab === void 0) { tab = ""; }
+            return "./" + tab.replace(/ /g, "_");
         };
-        TuiDocSourceCodeComponent.ctorParameters = function () { return [
-            { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_SOURCE_CODE,] }] },
-            { type: String, decorators: [{ type: core.Inject, args: [TUI_DOC_SOURCE_CODE_TEXT,] }] }
-        ]; };
-        __decorate([
-            core.Input()
-        ], TuiDocSourceCodeComponent.prototype, "header", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocSourceCodeComponent.prototype, "package", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocSourceCodeComponent.prototype, "type", void 0);
-        __decorate([
-            core.Input()
-        ], TuiDocSourceCodeComponent.prototype, "path", void 0);
-        __decorate([
-            cdk.tuiPure
-        ], TuiDocSourceCodeComponent.prototype, "getPathOptions", null);
-        TuiDocSourceCodeComponent = __decorate([
-            core.Component({
-                selector: "tui-doc-source-code",
-                template: "<div\n    *ngIf=\"!!sourceCode\"\n    polymorpheus-outlet\n    [content]=\"sourceCode\"\n    [context]=\"pathOptions\"\n>\n    <ng-template let-link>\n        <a\n            *ngIf=\"link\"\n            tuiIconButton\n            type=\"button\"\n            icon=\"tuiIconCodeLarge\"\n            appearance=\"icon\"\n            target=\"_blank\"\n            size=\"s\"\n            [title]=\"text\"\n            [href]=\"link\"\n        ></a>\n    </ng-template>\n</div>\n",
-                changeDetection: core.ChangeDetectionStrategy.OnPush
-            }),
-            __param(0, core.Inject(TUI_DOC_SOURCE_CODE)),
-            __param(1, core.Inject(TUI_DOC_SOURCE_CODE_TEXT))
-        ], TuiDocSourceCodeComponent);
-        return TuiDocSourceCodeComponent;
+        return TuiDocPageComponent;
+    }());
+    TuiDocPageComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageComponent, deps: [{ token: "deprecated", attribute: true }, { token: TUI_DOC_DEFAULT_TABS }, { token: PAGE_SEE_ALSO }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TuiDocPageComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: TuiDocPageComponent, selector: "tui-doc-page", inputs: { header: "header", package: "package", type: "type", path: "path" }, providers: PAGE_PROVIDERS, queries: [{ propertyName: "tabConnectors", predicate: TuiDocPageTabConnectorDirective }], ngImport: i0__namespace, template: "<header class=\"t-header\">\n    <h1 class=\"t-title\">\n        {{ header }}\n        <tui-tag\n            *ngIf=\"deprecated !== null\"\n            value=\"deprecated\"\n            status=\"custom\"\n            class=\"t-tag t-tag_deprecated\"\n        ></tui-tag>\n        <tui-tag\n            *ngIf=\"package\"\n            status=\"custom\"\n            class=\"t-tag t-tag_package\"\n            [value]=\"package\"\n            [autoColor]=\"true\"\n        ></tui-tag>\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=\"first; else dynamicTab\">\n                <a\n                    *tuiItem\n                    tuiTab\n                    routerLink=\"./\"\n                    routerLinkActive\n                    [routerLinkActiveOptions]=\"{exact: true}\"\n                >\n                    {{ tab.pageTab || defaultTabs[index] }}\n                </a>\n            </ng-container>\n            <ng-template #dynamicTab>\n                <a\n                    *tuiItem\n                    tuiTab\n                    routerLinkActive\n                    [routerLink]=\"getRouterLink(tab.pageTab || defaultTabs[index])\"\n                >\n                    {{ tab.pageTab || defaultTabs[index] }}\n                </a>\n            </ng-template>\n        </ng-container>\n    </tui-tabs-with-more>\n    <tui-doc-source-code\n        class=\"t-source-code\"\n        [header]=\"header\"\n        [package]=\"package\"\n        [type]=\"type\"\n        [path]=\"path\"\n    ></tui-doc-source-code>\n</header>\n<div class=\"t-content\">\n    <ng-content></ng-content>\n    <tui-doc-see-also\n        *ngIf=\"showSeeAlso\"\n        class=\"t-see-also\"\n        [seeAlso]=\"seeAlso\"\n    ></tui-doc-see-also>\n    <ng-container *ngFor=\"let tab of tabConnectors; index as index\">\n        <ng-container\n            *ngIf=\"index === activeItemIndex\"\n            [ngTemplateOutlet]=\"tab.template\"\n        ></ng-container>\n    </ng-container>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-height:0;flex-basis:0;flex-grow:1}.t-header{display:flex;font:var(--tui-font-heading-3);flex-wrap:wrap;min-height:7.25rem;color:var(--tui-text-01);box-shadow:inset 0 -1px 0 0 var(--tui-base-03);padding:3.75rem 0 0;box-sizing:border-box;flex-shrink:0;margin:0 min(10vw,8.75rem)}:host-context(tui-root._mobile) .t-header{font:var(--tui-font-heading-4);min-height:4.5rem;padding:1.25rem 1.25rem 0;margin:0}.t-title{min-width:100%;font-size:inherit;margin:0}.t-tag{vertical-align:middle;text-transform:uppercase;margin-right:.5rem}.t-tag_deprecated{background-color:var(--tui-error-fill)}.t-tag.t-tag_package{color:#000}.t-tabs{flex:1;margin:1.125rem .3125rem 0 0}:host-context(tui-root._mobile) .t-tabs{margin-top:.25rem}.t-content{padding:2rem 0;margin:0 min(10vw,8.75rem)}:host-context(tui-root._mobile) .t-content{padding:2rem 1.25rem;margin:0}.t-see-also{min-width:18.75rem;width:30%;float:right;margin-left:1.5rem}:host-context(tui-root._mobile) .t-see-also{float:none;width:100%;margin:0 0 1.5rem}.t-source-code{align-self:flex-end;line-height:2.75rem}\n"], components: [{ type: i1__namespace.TuiTagComponent, selector: "tui-tag, a[tuiTag]", inputs: ["value", "editable", "separator", "maxLength", "size", "showLoader", "status", "hoverable", "removable", "disabled", "autoColor", "leftContent"], outputs: ["edited"] }, { type: i1__namespace.TuiTabsWithMoreComponent, selector: "tui-tabs-with-more, nav[tuiTabsWithMore]", inputs: ["moreContent", "dropdownContent", "underline", "activeItemIndex", "itemsLimit"], outputs: ["activeItemIndexChange"] }, { type: i1__namespace.TuiTabComponent, selector: "a[tuiTab]:not([routerLink]), a[tuiTab][routerLink][routerLinkActive], button[tuiTab]" }, { type: TuiDocSourceCodeComponent, selector: "tui-doc-source-code", inputs: ["header", "package", "type", "path"] }, { type: TuiDocSeeAlsoComponent, selector: "tui-doc-see-also", inputs: ["seeAlso"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace$1.TuiItemDirective, selector: "[tuiItem]" }, { type: i6__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i6__namespace.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: i5__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageComponent, decorators: [{
+                type: i0.Component,
+                args: [{
+                        selector: "tui-doc-page",
+                        templateUrl: "./page.template.html",
+                        styleUrls: ["./page.style.less"],
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                        providers: PAGE_PROVIDERS,
+                    }]
+            }], ctorParameters: function () {
+            return [{ type: undefined, decorators: [{
+                            type: i0.Attribute,
+                            args: ["deprecated"]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [TUI_DOC_DEFAULT_TABS]
+                        }] }, { type: undefined, decorators: [{
+                            type: i0.Inject,
+                            args: [PAGE_SEE_ALSO]
+                        }] }];
+        }, propDecorators: { header: [{
+                    type: i0.Input
+                }], package: [{
+                    type: i0.Input
+                }], type: [{
+                    type: i0.Input
+                }], path: [{
+                    type: i0.Input
+                }], tabConnectors: [{
+                    type: i0.ContentChildren,
+                    args: [TuiDocPageTabConnectorDirective]
+                }] } });
+
+    var TuiDocSeeAlsoModule = /** @class */ (function () {
+        function TuiDocSeeAlsoModule() {
+        }
+        return TuiDocSeeAlsoModule;
     }());
+    TuiDocSeeAlsoModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSeeAlsoModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocSeeAlsoModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSeeAlsoModule, declarations: [TuiDocSeeAlsoComponent], imports: [i5.CommonModule, i6$1.RouterModule, i2$1.TuiLinkModule], exports: [TuiDocSeeAlsoComponent] });
+    TuiDocSeeAlsoModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSeeAlsoModule, imports: [[i5.CommonModule, i6$1.RouterModule, i2$1.TuiLinkModule]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSeeAlsoModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [i5.CommonModule, i6$1.RouterModule, i2$1.TuiLinkModule],
+                        declarations: [TuiDocSeeAlsoComponent],
+                        exports: [TuiDocSeeAlsoComponent],
+                    }]
+            }] });
 
     var TuiDocSourceCodeModule = /** @class */ (function () {
         function TuiDocSourceCodeModule() {
         }
-        TuiDocSourceCodeModule = __decorate([
-            core.NgModule({
-                declarations: [TuiDocSourceCodeComponent],
-                imports: [common.CommonModule, ngPolymorpheus.PolymorpheusModule, core$1.TuiButtonModule],
-                exports: [TuiDocSourceCodeComponent],
-            })
-        ], TuiDocSourceCodeModule);
         return TuiDocSourceCodeModule;
     }());
+    TuiDocSourceCodeModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSourceCodeModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocSourceCodeModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSourceCodeModule, declarations: [TuiDocSourceCodeComponent], imports: [i5.CommonModule, i6$2.PolymorpheusModule, i2$1.TuiButtonModule], exports: [TuiDocSourceCodeComponent] });
+    TuiDocSourceCodeModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSourceCodeModule, imports: [[i5.CommonModule, i6$2.PolymorpheusModule, i2$1.TuiButtonModule]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocSourceCodeModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        declarations: [TuiDocSourceCodeComponent],
+                        imports: [i5.CommonModule, i6$2.PolymorpheusModule, i2$1.TuiButtonModule],
+                        exports: [TuiDocSourceCodeComponent],
+                    }]
+            }] });
 
     var TuiDocPageModule = /** @class */ (function () {
         function TuiDocPageModule() {
         }
-        TuiDocPageModule = __decorate([
-            core.NgModule({
-                imports: [
-                    common.CommonModule,
-                    router.RouterModule,
-                    TuiDocSeeAlsoModule,
-                    kit.TuiTabsModule,
-                    kit.TuiTagModule,
-                    TuiDocSourceCodeModule,
-                ],
-                declarations: [TuiDocPageComponent, TuiDocPageTabConnectorDirective],
-                exports: [TuiDocPageComponent, TuiDocPageTabConnectorDirective],
-            })
-        ], TuiDocPageModule);
         return TuiDocPageModule;
     }());
+    TuiDocPageModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiDocPageModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageModule, declarations: [TuiDocPageComponent, TuiDocPageTabConnectorDirective], imports: [i5.CommonModule,
+            i6$1.RouterModule,
+            TuiDocSeeAlsoModule,
+            i1.TuiTabsModule,
+            i1.TuiTagModule,
+            TuiDocSourceCodeModule], exports: [TuiDocPageComponent, TuiDocPageTabConnectorDirective] });
+    TuiDocPageModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageModule, imports: [[
+                i5.CommonModule,
+                i6$1.RouterModule,
+                TuiDocSeeAlsoModule,
+                i1.TuiTabsModule,
+                i1.TuiTagModule,
+                TuiDocSourceCodeModule,
+            ]] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiDocPageModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        imports: [
+                            i5.CommonModule,
+                            i6$1.RouterModule,
+                            TuiDocSeeAlsoModule,
+                            i1.TuiTabsModule,
+                            i1.TuiTagModule,
+                            TuiDocSourceCodeModule,
+                        ],
+                        declarations: [TuiDocPageComponent, TuiDocPageTabConnectorDirective],
+                        exports: [TuiDocPageComponent, TuiDocPageTabConnectorDirective],
+                    }]
+            }] });
 
     var TUI_EXAMPLE_PRIMARY_FILE_NAME = {
         TS: "TypeScript",
@@ -2210,28 +2552,24 @@
         HTML: "HTML",
     };
 
-    // TODO: 3.0 remove in ivy compilation
-    var DEMO_TEXTS = ["\u0421\u0434\u0435\u043B\u0430\u043D\u043E \u0441 \u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0434\u0438\u0440\u0435\u043A\u0442\u0438\u0432\u044B: ", "\u0424\u043E\u043D", "\u0414\u0435\u0442\u0430\u043B\u0438 \u0444\u043E\u0440\u043C\u044B"];
-    var DOC_TEXTS = [
-        "\u0410\u0440\u0433\u0443\u043C\u0435\u043D\u0442",
-        "\u0422\u0438\u043F",
-        "\u0418\u043C\u044F \u0438 \u043E\u043F\u0438\u0441\u0430\u043D\u0438\u0435",
-        "\u0417\u043D\u0430\u0447\u0435\u043D\u0438\u0435",
-        "\u0414\u043B\u044F \u0440\u0430\u0431\u043E\u0442\u044B \u0441 \u0434\u0438\u043D\u0430\u043C\u0438\u0447\u0435\u0441\u043A\u0438\u043C\u0438 \u0448\u0430\u0431\u043B\u043E\u043D\u0430\u043C\u0438 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442\u0441\u044F",
-    ];
-    var EXAMPLE_TEXTS = ["\u041F\u0440\u0435\u0432\u044C\u044E", "\u0421\u0441\u044B\u043B\u043A\u0430 \u043D\u0430 \u043F\u0440\u0438\u043C\u0435\u0440 \u0441\u043A\u043E\u043F\u0438\u0440\u043E\u0432\u0430\u043D\u0430", "\u0413\u043E\u0442\u043E\u0432\u043E"];
     var TUI_DOC_RUSSIAN = [
         {
             provide: TUI_DOC_DEMO_TEXTS,
-            useValue: DEMO_TEXTS,
+            useValue: ["\u0421\u0434\u0435\u043B\u0430\u043D\u043E \u0441 \u043F\u043E\u043C\u043E\u0449\u044C\u044E \u0434\u0438\u0440\u0435\u043A\u0442\u0438\u0432\u044B: ", "\u0424\u043E\u043D", "\u0414\u0435\u0442\u0430\u043B\u0438 \u0444\u043E\u0440\u043C\u044B"],
         },
         {
             provide: TUI_DOC_DOCUMENTATION_TEXTS,
-            useValue: DOC_TEXTS,
+            useValue: [
+                "\u0410\u0440\u0433\u0443\u043C\u0435\u043D\u0442",
+                "\u0422\u0438\u043F",
+                "\u0418\u043C\u044F \u0438 \u043E\u043F\u0438\u0441\u0430\u043D\u0438\u0435",
+                "\u0417\u043D\u0430\u0447\u0435\u043D\u0438\u0435",
+                "\u0414\u043B\u044F \u0440\u0430\u0431\u043E\u0442\u044B \u0441 \u0434\u0438\u043D\u0430\u043C\u0438\u0447\u0435\u0441\u043A\u0438\u043C\u0438 \u0448\u0430\u0431\u043B\u043E\u043D\u0430\u043C\u0438 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442\u0441\u044F",
+            ],
         },
         {
             provide: TUI_DOC_EXAMPLE_TEXTS,
-            useValue: EXAMPLE_TEXTS,
+            useValue: ["\u041F\u0440\u0435\u0432\u044C\u044E", "\u0421\u0441\u044B\u043B\u043A\u0430 \u043D\u0430 \u043F\u0440\u0438\u043C\u0435\u0440 \u0441\u043A\u043E\u043F\u0438\u0440\u043E\u0432\u0430\u043D\u0430", "\u0413\u043E\u0442\u043E\u0432\u043E"],
         },
         {
             provide: TUI_DOC_MENU_TEXT,
@@ -2254,26 +2592,33 @@
     var TuiAddonDocModule = /** @class */ (function () {
         function TuiAddonDocModule() {
         }
-        TuiAddonDocModule = __decorate([
-            core.NgModule({
-                exports: [
-                    TuiDocCodeModule,
-                    TuiDocDemoModule,
-                    TuiDocDocumentationModule,
-                    TuiDocPageModule,
-                    TuiDocExampleModule,
-                ],
-            })
-        ], TuiAddonDocModule);
         return TuiAddonDocModule;
     }());
+    TuiAddonDocModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiAddonDocModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
+    TuiAddonDocModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiAddonDocModule, exports: [TuiDocCodeModule,
+            TuiDocDemoModule,
+            TuiDocDocumentationModule,
+            TuiDocPageModule,
+            TuiDocExampleModule] });
+    TuiAddonDocModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiAddonDocModule, imports: [TuiDocCodeModule,
+            TuiDocDemoModule,
+            TuiDocDocumentationModule,
+            TuiDocPageModule,
+            TuiDocExampleModule] });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: TuiAddonDocModule, decorators: [{
+                type: i0.NgModule,
+                args: [{
+                        exports: [
+                            TuiDocCodeModule,
+                            TuiDocDemoModule,
+                            TuiDocDocumentationModule,
+                            TuiDocPageModule,
+                            TuiDocExampleModule,
+                        ],
+                    }]
+            }] });
 
-    /**
-     * @deprecated: use {@link tuiGenerateRoutes} instead
-     * Generates typical page routing structure
-     */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    function generateRoutes(type) {
+    function tuiGenerateRoutes(type) {
         return [
             {
                 path: "",
@@ -2287,13 +2632,15 @@
             },
         ];
     }
-    var tuiGenerateRoutes = generateRoutes;
 
-    exports.DEMO_TEXTS = DEMO_TEXTS;
-    exports.DOC_TEXTS = DOC_TEXTS;
-    exports.EXAMPLE_TEXTS = EXAMPLE_TEXTS;
-    exports.ScrollIntoViewDirective = ScrollIntoViewDirective;
-    exports.ScrollIntoViewModule = ScrollIntoViewModule;
+    /**
+     * Public API Surface of @taiga-ui/addon-doc
+     */
+
+    /**
+     * Generated bundle index. Do not edit.
+     */
+
     exports.TUI_DOC_CODE_ACTIONS = TUI_DOC_CODE_ACTIONS;
     exports.TUI_DOC_CODE_EDITOR = TUI_DOC_CODE_EDITOR;
     exports.TUI_DOC_DEFAULT_TABS = TUI_DOC_DEFAULT_TABS;
@@ -2324,7 +2671,9 @@
     exports.TuiDocDocumentationComponent = TuiDocDocumentationComponent;
     exports.TuiDocDocumentationModule = TuiDocDocumentationModule;
     exports.TuiDocDocumentationPropertyConnectorDirective = TuiDocDocumentationPropertyConnectorDirective;
+    exports.TuiDocExampleCapitalizePipe = TuiDocExampleCapitalizePipe;
     exports.TuiDocExampleComponent = TuiDocExampleComponent;
+    exports.TuiDocExampleGetTabsPipe = TuiDocExampleGetTabsPipe;
     exports.TuiDocExampleModule = TuiDocExampleModule;
     exports.TuiDocMainComponent = TuiDocMainComponent;
     exports.TuiDocMainModule = TuiDocMainModule;
@@ -2337,38 +2686,13 @@
     exports.TuiLanguageSwitcherModule = TuiLanguageSwitcherModule;
     exports.TuiScrollIntoViewLinkDirective = TuiScrollIntoViewLinkDirective;
     exports.TuiScrollIntoViewLinkModule = TuiScrollIntoViewLinkModule;
-    exports.coerceValue = coerceValue;
-    exports.generateRoutes = generateRoutes;
-    exports.rawLoad = rawLoad;
-    exports.rawLoadRecord = rawLoadRecord;
-    exports.tryParseMarkdownCodeBlock = tryParseMarkdownCodeBlock;
     exports.tuiCoerceValue = tuiCoerceValue;
     exports.tuiGenerateRoutes = tuiGenerateRoutes;
     exports.tuiRawLoad = tuiRawLoad;
     exports.tuiRawLoadRecord = tuiRawLoadRecord;
     exports.tuiTryParseMarkdownCodeBlock = tuiTryParseMarkdownCodeBlock;
-    exports.ɵa = TuiInputOpacityModule;
-    exports.ɵb = TuiInputOpacityDirective;
-    exports.ɵc = TuiDocExampleGetTabsPipe;
-    exports.ɵd = TuiDocExampleCapitalizePipe;
-    exports.ɵe = TuiDocHeaderModule;
-    exports.ɵf = NAVIGATION_TITLE;
-    exports.ɵg = NAVIGATION_LABELS;
-    exports.ɵh = NAVIGATION_ITEMS;
-    exports.ɵi = NAVIGATION_PROVIDERS;
-    exports.ɵj = titleProviderFactory;
-    exports.ɵk = labelsProviderFactory;
-    exports.ɵl = itemsProviderFactory;
-    exports.ɵm = TuiDocHeaderComponent;
-    exports.ɵn = PAGE_SEE_ALSO;
-    exports.ɵo = PAGE_PROVIDERS;
-    exports.ɵp = seeAlsoProviderFactory;
-    exports.ɵq = TuiDocSeeAlsoModule;
-    exports.ɵr = TuiDocSeeAlsoComponent;
-    exports.ɵs = TuiDocSourceCodeModule;
-    exports.ɵt = TuiDocSourceCodeComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });
 
-})));
+}));
 //# sourceMappingURL=taiga-ui-addon-doc.umd.js.map