@taiga-ui/addon-doc 2.36.0 → 2.38.0

package/esm5/public-api.js

@@ -24,6 +24,7 @@ export * from './components/page/page-tab.directive';
 /* Directives */
 export * from './directives/scroll-into-view/scroll-into-view.directive';
 export * from './directives/scroll-into-view/scroll-into-view.module';
+export * from './interfaces/page';
 /* Languages */
 export * from './languages/russian';
 /* Tokens */
@@ -40,4 +41,4 @@ export * from './tokens/title';
 export * from './addon-doc.module';
 export * from './utils/coerce-value';
 export * from './utils/generate-routes';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0B0YWlnYS11aS9hZGRvbi1kb2MvIiwic291cmNlcyI6WyJwdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsZ0JBQWdCO0FBQ2hCLGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLG9DQUFvQyxDQUFDO0FBQ25ELGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyxvREFBb0QsQ0FBQztBQUNuRSxjQUFjLGlEQUFpRCxDQUFDO0FBQ2hFLGNBQWMsdUVBQXVFLENBQUM7QUFDdEYsY0FBYyx3Q0FBd0MsQ0FBQztBQUN2RCxjQUFjLHFDQUFxQyxDQUFDO0FBQ3BELGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLDhDQUE4QyxDQUFDO0FBQzdELGNBQWMsMkNBQTJDLENBQUM7QUFDMUQsY0FBYyxrQ0FBa0MsQ0FBQztBQUNqRCxjQUFjLCtCQUErQixDQUFDO0FBQzlDLGNBQWMsc0NBQXNDLENBQUM7QUFFckQsZ0JBQWdCO0FBQ2hCLGNBQWMsMERBQTBELENBQUM7QUFDekUsY0FBYyx1REFBdUQsQ0FBQztBQU90RSxlQUFlO0FBQ2YsY0FBYyxxQkFBcUIsQ0FBQztBQUVwQyxZQUFZO0FBQ1osY0FBYyxzQkFBc0IsQ0FBQztBQUNyQyxjQUFjLHVCQUF1QixDQUFDO0FBQ3RDLGNBQWMsb0NBQW9DLENBQUM7QUFDbkQsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxnQkFBZ0IsQ0FBQztBQUMvQixjQUFjLG1CQUFtQixDQUFDO0FBQ2xDLGNBQWMsc0JBQXNCLENBQUM7QUFDckMsY0FBYyxnQkFBZ0IsQ0FBQztBQUsvQixXQUFXO0FBQ1gsY0FBYyxvQkFBb0IsQ0FBQztBQUNuQyxjQUFjLHNCQUFzQixDQUFDO0FBQ3JDLGNBQWMseUJBQXlCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIFB1YmxpYyBBUEkgU3VyZmFjZSBvZiBAdGFpZ2EtdWkvYWRkb24tZG9jXG4gKi9cblxuLyogQ29tcG9uZW50cyAqL1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2NvZGUvY29kZS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2NvZGUvY29kZS5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2NvZGUvcGFyc2UtY29kZS1ibG9jayc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY29weS9jb3B5LmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY29weS9jb3B5Lm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZGVtby9kZW1vLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZGVtby9kZW1vLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZG9jdW1lbnRhdGlvbi9kb2N1bWVudGF0aW9uLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZG9jdW1lbnRhdGlvbi9kb2N1bWVudGF0aW9uLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZG9jdW1lbnRhdGlvbi9kb2N1bWVudGF0aW9uLXByb3BlcnR5LWNvbm5lY3Rvci5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2V4YW1wbGUvZXhhbXBsZS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2V4YW1wbGUvZXhhbXBsZS5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL21haW4vbWFpbi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL21haW4vbWFpbi5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL25hdmlnYXRpb24vbmF2aWdhdGlvbi5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL25hdmlnYXRpb24vbmF2aWdhdGlvbi5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3BhZ2UvcGFnZS5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3BhZ2UvcGFnZS5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3BhZ2UvcGFnZS10YWIuZGlyZWN0aXZlJztcblxuLyogRGlyZWN0aXZlcyAqL1xuZXhwb3J0ICogZnJvbSAnLi9kaXJlY3RpdmVzL3Njcm9sbC1pbnRvLXZpZXcvc2Nyb2xsLWludG8tdmlldy5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9kaXJlY3RpdmVzL3Njcm9sbC1pbnRvLXZpZXcvc2Nyb2xsLWludG8tdmlldy5tb2R1bGUnO1xuXG4vKiBJbnRlcmZhY2VzICovXG5leHBvcnQgKiBmcm9tICcuL2ludGVyZmFjZXMvY29kZS1lZGl0b3InO1xuZXhwb3J0ICogZnJvbSAnLi9pbnRlcmZhY2VzL3BhZ2UnO1xuZXhwb3J0ICogZnJvbSAnLi9pbnRlcmZhY2VzL3NvdXJjZS1jb2RlLXBhdGgtb3B0aW9ucyc7XG5cbi8qIExhbmd1YWdlcyAqL1xuZXhwb3J0ICogZnJvbSAnLi9sYW5ndWFnZXMvcnVzc2lhbic7XG5cbi8qIFRva2VucyAqL1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvY29kZS1lZGl0b3InO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvZGVmYXVsdC10YWJzJztcbmV4cG9ydCAqIGZyb20gJy4vdG9rZW5zL2V4YW1wbGUtY29udGVudC1wcm9jZXNzb3InO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvaTE4bic7XG5leHBvcnQgKiBmcm9tICcuL3Rva2Vucy9sb2dvJztcbmV4cG9ydCAqIGZyb20gJy4vdG9rZW5zL3BhZ2VzJztcbmV4cG9ydCAqIGZyb20gJy4vdG9rZW5zL3NlZS1hbHNvJztcbmV4cG9ydCAqIGZyb20gJy4vdG9rZW5zL3NvdXJjZS1jb2RlJztcbmV4cG9ydCAqIGZyb20gJy4vdG9rZW5zL3RpdGxlJztcblxuLyogVHlwZXMgKi9cbmV4cG9ydCAqIGZyb20gJy4vdHlwZXMvcGFnZXMnO1xuXG4vKiBVdGlscyAqL1xuZXhwb3J0ICogZnJvbSAnLi9hZGRvbi1kb2MubW9kdWxlJztcbmV4cG9ydCAqIGZyb20gJy4vdXRpbHMvY29lcmNlLXZhbHVlJztcbmV4cG9ydCAqIGZyb20gJy4vdXRpbHMvZ2VuZXJhdGUtcm91dGVzJztcbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0B0YWlnYS11aS9hZGRvbi1kb2MvIiwic291cmNlcyI6WyJwdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsZ0JBQWdCO0FBQ2hCLGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLG9DQUFvQyxDQUFDO0FBQ25ELGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyxvREFBb0QsQ0FBQztBQUNuRSxjQUFjLGlEQUFpRCxDQUFDO0FBQ2hFLGNBQWMsdUVBQXVFLENBQUM7QUFDdEYsY0FBYyx3Q0FBd0MsQ0FBQztBQUN2RCxjQUFjLHFDQUFxQyxDQUFDO0FBQ3BELGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYywrQkFBK0IsQ0FBQztBQUM5QyxjQUFjLDhDQUE4QyxDQUFDO0FBQzdELGNBQWMsMkNBQTJDLENBQUM7QUFDMUQsY0FBYyxrQ0FBa0MsQ0FBQztBQUNqRCxjQUFjLCtCQUErQixDQUFDO0FBQzlDLGNBQWMsc0NBQXNDLENBQUM7QUFFckQsZ0JBQWdCO0FBQ2hCLGNBQWMsMERBQTBELENBQUM7QUFDekUsY0FBYyx1REFBdUQsQ0FBQztBQUl0RSxjQUFjLG1CQUFtQixDQUFDO0FBR2xDLGVBQWU7QUFDZixjQUFjLHFCQUFxQixDQUFDO0FBRXBDLFlBQVk7QUFDWixjQUFjLHNCQUFzQixDQUFDO0FBQ3JDLGNBQWMsdUJBQXVCLENBQUM7QUFDdEMsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLGVBQWUsQ0FBQztBQUM5QixjQUFjLGVBQWUsQ0FBQztBQUM5QixjQUFjLGdCQUFnQixDQUFDO0FBQy9CLGNBQWMsbUJBQW1CLENBQUM7QUFDbEMsY0FBYyxzQkFBc0IsQ0FBQztBQUNyQyxjQUFjLGdCQUFnQixDQUFDO0FBSy9CLFdBQVc7QUFDWCxjQUFjLG9CQUFvQixDQUFDO0FBQ25DLGNBQWMsc0JBQXNCLENBQUM7QUFDckMsY0FBYyx5QkFBeUIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIEB0YWlnYS11aS9hZGRvbi1kb2NcbiAqL1xuXG4vKiBDb21wb25lbnRzICovXG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY29kZS9jb2RlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY29kZS9jb2RlLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY29kZS9wYXJzZS1jb2RlLWJsb2NrJztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9jb3B5L2NvcHkuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9jb3B5L2NvcHkubW9kdWxlJztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9kZW1vL2RlbW8uY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9kZW1vL2RlbW8ubW9kdWxlJztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9kb2N1bWVudGF0aW9uL2RvY3VtZW50YXRpb24uY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9kb2N1bWVudGF0aW9uL2RvY3VtZW50YXRpb24ubW9kdWxlJztcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9kb2N1bWVudGF0aW9uL2RvY3VtZW50YXRpb24tcHJvcGVydHktY29ubmVjdG9yLmRpcmVjdGl2ZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZXhhbXBsZS9leGFtcGxlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvZXhhbXBsZS9leGFtcGxlLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbWFpbi9tYWluLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbWFpbi9tYWluLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbmF2aWdhdGlvbi9uYXZpZ2F0aW9uLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvbmF2aWdhdGlvbi9uYXZpZ2F0aW9uLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvcGFnZS9wYWdlLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvcGFnZS9wYWdlLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvcGFnZS9wYWdlLXRhYi5kaXJlY3RpdmUnO1xuXG4vKiBEaXJlY3RpdmVzICovXG5leHBvcnQgKiBmcm9tICcuL2RpcmVjdGl2ZXMvc2Nyb2xsLWludG8tdmlldy9zY3JvbGwtaW50by12aWV3LmRpcmVjdGl2ZSc7XG5leHBvcnQgKiBmcm9tICcuL2RpcmVjdGl2ZXMvc2Nyb2xsLWludG8tdmlldy9zY3JvbGwtaW50by12aWV3Lm1vZHVsZSc7XG5cbi8qIEludGVyZmFjZXMgKi9cbmV4cG9ydCAqIGZyb20gJy4vaW50ZXJmYWNlcy9jb2RlLWVkaXRvcic7XG5leHBvcnQgKiBmcm9tICcuL2ludGVyZmFjZXMvcGFnZSc7XG5leHBvcnQgKiBmcm9tICcuL2ludGVyZmFjZXMvc291cmNlLWNvZGUtcGF0aC1vcHRpb25zJztcblxuLyogTGFuZ3VhZ2VzICovXG5leHBvcnQgKiBmcm9tICcuL2xhbmd1YWdlcy9ydXNzaWFuJztcblxuLyogVG9rZW5zICovXG5leHBvcnQgKiBmcm9tICcuL3Rva2Vucy9jb2RlLWVkaXRvcic7XG5leHBvcnQgKiBmcm9tICcuL3Rva2Vucy9kZWZhdWx0LXRhYnMnO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvZXhhbXBsZS1jb250ZW50LXByb2Nlc3Nvcic7XG5leHBvcnQgKiBmcm9tICcuL3Rva2Vucy9pMThuJztcbmV4cG9ydCAqIGZyb20gJy4vdG9rZW5zL2xvZ28nO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvcGFnZXMnO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvc2VlLWFsc28nO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvc291cmNlLWNvZGUnO1xuZXhwb3J0ICogZnJvbSAnLi90b2tlbnMvdGl0bGUnO1xuXG4vKiBUeXBlcyAqL1xuZXhwb3J0ICogZnJvbSAnLi90eXBlcy9wYWdlcyc7XG5cbi8qIFV0aWxzICovXG5leHBvcnQgKiBmcm9tICcuL2FkZG9uLWRvYy5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi91dGlscy9jb2VyY2UtdmFsdWUnO1xuZXhwb3J0ICogZnJvbSAnLi91dGlscy9nZW5lcmF0ZS1yb3V0ZXMnO1xuIl19

package/esm5/utils/color-conversion.js

@@ -1,11 +1,8 @@
+/**
+ * TODO: move another package for reuse between addon-editor and addon-doc
+ */
 export function rgbToHex(r, g, b) {
-    return ('#' +
-        [r, g, b]
-            .map(function (x) {
-            var hex = x.toString(16);
-            return hex.length === 1 ? '0' + hex : hex;
-        })
-            .join(''));
+    return "#" + [r, g, b].map(function (x) { return x.toString(16).padStart(2, '0'); }).join('');
 }
 export function hexToRgb(hex) {
     var matches = hex
@@ -18,4 +15,4 @@ export function hexToRgb(hex) {
         ? matches.map(function (x) { return Number.parseInt(x, 16); })
         : [0, 0, 0];
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItY29udmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0B0YWlnYS11aS9hZGRvbi1kb2MvIiwic291cmNlcyI6WyJ1dGlscy9jb2xvci1jb252ZXJzaW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE1BQU0sVUFBVSxRQUFRLENBQUMsQ0FBUyxFQUFFLENBQVMsRUFBRSxDQUFTO0lBQ3BELE9BQU8sQ0FDSCxHQUFHO1FBQ0gsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQzthQUNKLEdBQUcsQ0FBQyxVQUFBLENBQUM7WUFDRixJQUFNLEdBQUcsR0FBRyxDQUFDLENBQUMsUUFBUSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1lBRTNCLE9BQU8sR0FBRyxDQUFDLE1BQU0sS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFHLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQztRQUM5QyxDQUFDLENBQUM7YUFDRCxJQUFJLENBQUMsRUFBRSxDQUFDLENBQ2hCLENBQUM7QUFDTixDQUFDO0FBRUQsTUFBTSxVQUFVLFFBQVEsQ0FBQyxHQUFXO0lBQ2hDLElBQU0sT0FBTyxHQUFHLEdBQUc7U0FDZCxPQUFPLENBQUMsR0FBRyxFQUFFLEVBQUUsQ0FBQztTQUNoQixLQUFLLENBQUMsRUFBRSxDQUFDO1NBQ1QsR0FBRyxDQUFDLFVBQUMsSUFBSSxFQUFFLENBQUMsRUFBRSxLQUFLLElBQUssT0FBQSxDQUFDLEtBQUssQ0FBQyxNQUFNLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsRUFBekMsQ0FBeUMsQ0FBQztTQUNsRSxJQUFJLENBQUMsRUFBRSxDQUFDO1NBQ1IsS0FBSyxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBRXBCLE9BQU8sT0FBTztRQUNWLENBQUMsQ0FBRSxPQUFPLENBQUMsR0FBRyxDQUFDLFVBQUEsQ0FBQyxJQUFJLE9BQUEsTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFDLEVBQUUsRUFBRSxDQUFDLEVBQXRCLENBQXNCLENBQThCO1FBQ3hFLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUM7QUFDcEIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBmdW5jdGlvbiByZ2JUb0hleChyOiBudW1iZXIsIGc6IG51bWJlciwgYjogbnVtYmVyKTogc3RyaW5nIHtcbiAgICByZXR1cm4gKFxuICAgICAgICAnIycgK1xuICAgICAgICBbciwgZywgYl1cbiAgICAgICAgICAgIC5tYXAoeCA9PiB7XG4gICAgICAgICAgICAgICAgY29uc3QgaGV4ID0geC50b1N0cmluZygxNik7XG5cbiAgICAgICAgICAgICAgICByZXR1cm4gaGV4Lmxlbmd0aCA9PT0gMSA/ICcwJyArIGhleCA6IGhleDtcbiAgICAgICAgICAgIH0pXG4gICAgICAgICAgICAuam9pbignJylcbiAgICApO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gaGV4VG9SZ2IoaGV4OiBzdHJpbmcpOiBbbnVtYmVyLCBudW1iZXIsIG51bWJlcl0ge1xuICAgIGNvbnN0IG1hdGNoZXMgPSBoZXhcbiAgICAgICAgLnJlcGxhY2UoJyMnLCAnJylcbiAgICAgICAgLnNwbGl0KCcnKVxuICAgICAgICAubWFwKChjaGFyLCBfLCBhcnJheSkgPT4gKGFycmF5Lmxlbmd0aCA9PT0gMyA/IGNoYXIgKyBjaGFyIDogY2hhcikpXG4gICAgICAgIC5qb2luKCcnKVxuICAgICAgICAubWF0Y2goLy57Mn0vZyk7XG5cbiAgICByZXR1cm4gbWF0Y2hlc1xuICAgICAgICA/IChtYXRjaGVzLm1hcCh4ID0+IE51bWJlci5wYXJzZUludCh4LCAxNikpIGFzIFtudW1iZXIsIG51bWJlciwgbnVtYmVyXSlcbiAgICAgICAgOiBbMCwgMCwgMF07XG59XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItY29udmVyc2lvbi5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0B0YWlnYS11aS9hZGRvbi1kb2MvIiwic291cmNlcyI6WyJ1dGlscy9jb2xvci1jb252ZXJzaW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBQ0gsTUFBTSxVQUFVLFFBQVEsQ0FBQyxDQUFTLEVBQUUsQ0FBUyxFQUFFLENBQVM7SUFDcEQsT0FBTyxNQUFJLENBQUMsQ0FBQyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQyxHQUFHLENBQUMsVUFBQSxDQUFDLElBQUksT0FBQSxDQUFDLENBQUMsUUFBUSxDQUFDLEVBQUUsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxDQUFDLEVBQUUsR0FBRyxDQUFDLEVBQS9CLENBQStCLENBQUMsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFHLENBQUM7QUFDOUUsQ0FBQztBQUVELE1BQU0sVUFBVSxRQUFRLENBQUMsR0FBVztJQUNoQyxJQUFNLE9BQU8sR0FBRyxHQUFHO1NBQ2QsT0FBTyxDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUM7U0FDaEIsS0FBSyxDQUFDLEVBQUUsQ0FBQztTQUNULEdBQUcsQ0FBQyxVQUFDLElBQUksRUFBRSxDQUFDLEVBQUUsS0FBSyxJQUFLLE9BQUEsQ0FBQyxLQUFLLENBQUMsTUFBTSxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxHQUFHLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEVBQXpDLENBQXlDLENBQUM7U0FDbEUsSUFBSSxDQUFDLEVBQUUsQ0FBQztTQUNSLEtBQUssQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUVwQixPQUFPLE9BQU87UUFDVixDQUFDLENBQUUsT0FBTyxDQUFDLEdBQUcsQ0FBQyxVQUFBLENBQUMsSUFBSSxPQUFBLE1BQU0sQ0FBQyxRQUFRLENBQUMsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxFQUF0QixDQUFzQixDQUE4QjtRQUN4RSxDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDO0FBQ3BCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIFRPRE86IG1vdmUgYW5vdGhlciBwYWNrYWdlIGZvciByZXVzZSBiZXR3ZWVuIGFkZG9uLWVkaXRvciBhbmQgYWRkb24tZG9jXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiByZ2JUb0hleChyOiBudW1iZXIsIGc6IG51bWJlciwgYjogbnVtYmVyKTogc3RyaW5nIHtcbiAgICByZXR1cm4gYCMke1tyLCBnLCBiXS5tYXAoeCA9PiB4LnRvU3RyaW5nKDE2KS5wYWRTdGFydCgyLCAnMCcpKS5qb2luKCcnKX1gO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gaGV4VG9SZ2IoaGV4OiBzdHJpbmcpOiBbbnVtYmVyLCBudW1iZXIsIG51bWJlcl0ge1xuICAgIGNvbnN0IG1hdGNoZXMgPSBoZXhcbiAgICAgICAgLnJlcGxhY2UoJyMnLCAnJylcbiAgICAgICAgLnNwbGl0KCcnKVxuICAgICAgICAubWFwKChjaGFyLCBfLCBhcnJheSkgPT4gKGFycmF5Lmxlbmd0aCA9PT0gMyA/IGNoYXIgKyBjaGFyIDogY2hhcikpXG4gICAgICAgIC5qb2luKCcnKVxuICAgICAgICAubWF0Y2goLy57Mn0vZyk7XG5cbiAgICByZXR1cm4gbWF0Y2hlc1xuICAgICAgICA/IChtYXRjaGVzLm1hcCh4ID0+IE51bWJlci5wYXJzZUludCh4LCAxNikpIGFzIFtudW1iZXIsIG51bWJlciwgbnVtYmVyXSlcbiAgICAgICAgOiBbMCwgMCwgMF07XG59XG4iXX0=

package/esm5/utils/raw-load-record.js

@@ -16,6 +16,7 @@ export function rawLoadRecord(example) {
                 case 2:
                     if (!!_b.done) return [3 /*break*/, 5];
                     _c = __read(_b.value, 2), key = _c[0], content = _c[1];
+                    if (!content) return [3 /*break*/, 4];
                     _d = processedContent;
                     _e = key;
                     return [4 /*yield*/, rawLoad(content)];
@@ -41,4 +42,4 @@ export function rawLoadRecord(example) {
         });
     });
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmF3LWxvYWQtcmVjb3JkLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQHRhaWdhLXVpL2FkZG9uLWRvYy8iLCJzb3VyY2VzIjpbInV0aWxzL3Jhdy1sb2FkLXJlY29yZC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFDLE9BQU8sRUFBQyxNQUFNLFlBQVksQ0FBQztBQUVuQyxNQUFNLFVBQWdCLGFBQWEsQ0FDL0IsT0FBc0I7Ozs7Ozs7b0JBRWhCLGdCQUFnQixHQUEyQixFQUFFLENBQUM7Ozs7b0JBRXZCLEtBQUEsU0FBQSxNQUFNLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFBOzs7O29CQUF6QyxLQUFBLG1CQUFjLEVBQWIsR0FBRyxRQUFBLEVBQUUsT0FBTyxRQUFBO29CQUNwQixLQUFBLGdCQUFnQixDQUFBO29CQUFDLEtBQUEsR0FBRyxDQUFBO29CQUFJLHFCQUFNLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBQTs7b0JBQTlDLE1BQXFCLEdBQUcsU0FBc0IsQ0FBQzs7Ozs7Ozs7Ozs7Ozs7Ozt3QkFHbkQsc0JBQU8sZ0JBQWdCLEVBQUM7Ozs7Q0FDM0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1R1aURvY0V4YW1wbGV9IGZyb20gJy4uL2ludGVyZmFjZXMvcGFnZSc7XG5pbXBvcnQge3Jhd0xvYWR9IGZyb20gJy4vcmF3LWxvYWQnO1xuXG5leHBvcnQgYXN5bmMgZnVuY3Rpb24gcmF3TG9hZFJlY29yZChcbiAgICBleGFtcGxlOiBUdWlEb2NFeGFtcGxlLFxuKTogUHJvbWlzZTxSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+PiB7XG4gICAgY29uc3QgcHJvY2Vzc2VkQ29udGVudDogUmVjb3JkPHN0cmluZywgc3RyaW5nPiA9IHt9O1xuXG4gICAgZm9yIChjb25zdCBba2V5LCBjb250ZW50XSBvZiBPYmplY3QuZW50cmllcyhleGFtcGxlKSkge1xuICAgICAgICBwcm9jZXNzZWRDb250ZW50W2tleV0gPSBhd2FpdCByYXdMb2FkKGNvbnRlbnQpO1xuICAgIH1cblxuICAgIHJldHVybiBwcm9jZXNzZWRDb250ZW50O1xufVxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmF3LWxvYWQtcmVjb3JkLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQHRhaWdhLXVpL2FkZG9uLWRvYy8iLCJzb3VyY2VzIjpbInV0aWxzL3Jhdy1sb2FkLXJlY29yZC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFDLE9BQU8sRUFBQyxNQUFNLFlBQVksQ0FBQztBQUVuQyxNQUFNLFVBQWdCLGFBQWEsQ0FDL0IsT0FBc0I7Ozs7Ozs7b0JBRWhCLGdCQUFnQixHQUEyQixFQUFFLENBQUM7Ozs7b0JBRXZCLEtBQUEsU0FBQSxNQUFNLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFBOzs7O29CQUF6QyxLQUFBLG1CQUFjLEVBQWIsR0FBRyxRQUFBLEVBQUUsT0FBTyxRQUFBO3lCQUNoQixPQUFPLEVBQVAsd0JBQU87b0JBQ1AsS0FBQSxnQkFBZ0IsQ0FBQTtvQkFBQyxLQUFBLEdBQUcsQ0FBQTtvQkFBSSxxQkFBTSxPQUFPLENBQUMsT0FBTyxDQUFDLEVBQUE7O29CQUE5QyxNQUFxQixHQUFHLFNBQXNCLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7d0JBSXZELHNCQUFPLGdCQUFnQixFQUFDOzs7O0NBQzNCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtUdWlEb2NFeGFtcGxlfSBmcm9tICcuLi9pbnRlcmZhY2VzL3BhZ2UnO1xuaW1wb3J0IHtyYXdMb2FkfSBmcm9tICcuL3Jhdy1sb2FkJztcblxuZXhwb3J0IGFzeW5jIGZ1bmN0aW9uIHJhd0xvYWRSZWNvcmQoXG4gICAgZXhhbXBsZTogVHVpRG9jRXhhbXBsZSxcbik6IFByb21pc2U8UmVjb3JkPHN0cmluZywgc3RyaW5nPj4ge1xuICAgIGNvbnN0IHByb2Nlc3NlZENvbnRlbnQ6IFJlY29yZDxzdHJpbmcsIHN0cmluZz4gPSB7fTtcblxuICAgIGZvciAoY29uc3QgW2tleSwgY29udGVudF0gb2YgT2JqZWN0LmVudHJpZXMoZXhhbXBsZSkpIHtcbiAgICAgICAgaWYgKGNvbnRlbnQpIHtcbiAgICAgICAgICAgIHByb2Nlc3NlZENvbnRlbnRba2V5XSA9IGF3YWl0IHJhd0xvYWQoY29udGVudCk7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICByZXR1cm4gcHJvY2Vzc2VkQ29udGVudDtcbn1cbiJdfQ==

package/fesm2015/taiga-ui-addon-doc.js

@@ -5,7 +5,7 @@ import { switchMap, map, switchMapTo, mapTo, startWith, takeUntil, debounceTime,
 import MarkdownIt from 'markdown-it';
 import { CommonModule, isPlatformBrowser, Location as Location$1, DOCUMENT } from '@angular/common';
 import { HighlightModule } from 'ngx-highlightjs';
-import { tuiPure, TuiDestroyService, TUI_IS_MOBILE, TuiDragModule, EMPTY_QUERY, itemsQueryListObservable, watch, TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_CYPRESS, TuiSwipeService, getElementObscurers, isPresent, uniqBy, TuiActiveZoneModule, TuiLetModule, TuiAutoFocusModule, tuiDefaultProp } from '@taiga-ui/cdk';
+import { tuiPure, TuiDestroyService, px, TUI_IS_MOBILE, TuiDragModule, EMPTY_QUERY, itemsQueryListObservable, watch, TUI_FOCUSABLE_ITEM_ACCESSOR, TUI_IS_CYPRESS, TuiSwipeService, getElementObscurers, isPresent, uniqBy, TuiActiveZoneModule, TuiLetModule, TuiAutoFocusModule, tuiDefaultProp } from '@taiga-ui/cdk';
 import { TUI_COPY_TEXTS, TuiSelectModule, TuiRadioBlockModule, TuiCheckboxLabeledModule, TuiDataListWrapperModule, TuiBadgeModule, TuiToggleModule, TuiInputCountModule, TuiTabsModule, TuiAccordionModule, TuiTagModule } from '@taiga-ui/kit';
 import { TuiButtonModule, TuiModeDirective, TuiLinkModule, TuiExpandModule, TuiGroupModule, TuiTooltipModule, TuiModeModule, TuiSvgModule, TuiDataListModule, TuiTextfieldControllerModule, TuiHintControllerModule, TuiPrimitiveTextfieldModule, TuiDropdownControllerModule, TuiNotificationModule, TuiNotificationsService, TuiHostedDropdownModule, TuiScrollbarModule, TuiThemeNightModule, TuiRootModule, TuiDialogModule, TuiNotificationsModule } from '@taiga-ui/core';
 import { FormControl, FormGroup, ReactiveFormsModule, FormsModule } from '@angular/forms';
@@ -250,7 +250,7 @@ let TuiDocDemoComponent = TuiDocDemoComponent_1 = class TuiDocDemoComponent {
         if (!this.wrapper) {
             return;
         }
-        this.renderer.setStyle(this.wrapper.nativeElement, 'width', `${Math.max(this.wrapperWidth - delta, MIN_COMPONENT_WIDTH)}px`);
+        this.renderer.setStyle(this.wrapper.nativeElement, 'width', px(Math.max(this.wrapperWidth - delta, MIN_COMPONENT_WIDTH)));
     }
 };
 TuiDocDemoComponent.ctorParameters = () => [
@@ -283,7 +283,7 @@ __decorate([
 TuiDocDemoComponent = TuiDocDemoComponent_1 = __decorate([
     Component({
         selector: 'tui-doc-demo',
-        template: "<div class=\"t-bg-toggle\" [tuiMode]=\"null\">\n    <ng-template #tooltip>\n        {{ texts[0] }}\n        <a tuiLink tuiMode=\"onDark\" routerLink=\"/directives/mode\">\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 describeId=\"form\" [content]=\"tooltip\"></tui-tooltip>\n        <div tuiGroup class=\"tui-space_left-3\" [collapsed]=\"true\">\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=\"tui-space_left-3\"\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 #content id=\"demoContent\" class=\"t-content\">\n        <form *ngIf=\"testForm\" class=\"t-form\" [formGroup]=\"testForm\">\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=\"tui-space_top-3\"\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 class=\"t-expand\" [expanded]=\"expanded\">\n                <ng-template tuiExpandContent>\n                    <pre class=\"t-value\">\nForm data: {{ testForm.value | json }}</pre\n                    >\n                    <div tuiGroup class=\"tui-space_top-3\">\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 #resizerText class=\"t-resizer-text\"></span>\n    </button>\n</div>\n",
+        template: "<div class=\"t-bg-toggle\" [tuiMode]=\"null\">\n    <ng-template #tooltip>\n        {{ texts[0] }}\n        <a tuiLink tuiMode=\"onDark\" routerLink=\"/directives/mode\">\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 describeId=\"form\" [content]=\"tooltip\"></tui-tooltip>\n        <div tuiGroup class=\"t-group\" [collapsed]=\"true\">\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 size=\"m\" class=\"t-checkbox\" [(ngModel)]=\"opaque\">\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 #content id=\"demoContent\" class=\"t-content\">\n        <form *ngIf=\"testForm\" class=\"t-form\" [formGroup]=\"testForm\">\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 class=\"t-expand\" [expanded]=\"expanded\">\n                <ng-template tuiExpandContent>\n                    <pre class=\"t-value\">\nForm data: {{ testForm.value | json }}</pre\n                    >\n                    <div tuiGroup class=\"t-form-controls\">\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 #resizerText class=\"t-resizer-text\"></span>\n    </button>\n</div>\n",
         changeDetection: ChangeDetectionStrategy.OnPush,
         providers: [
             TuiDestroyService,
@@ -292,7 +292,7 @@ TuiDocDemoComponent = TuiDocDemoComponent_1 = __decorate([
                 useExisting: forwardRef(() => 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}@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}}}"]
+        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, Inject(TUI_IS_MOBILE)),
     __param(1, Inject(TuiDestroyService)),
@@ -333,14 +333,11 @@ TuiDocDemoModule = __decorate([
     })
 ], TuiDocDemoModule);
 
+/**
+ * TODO: move another package for reuse between addon-editor and addon-doc
+ */
 function rgbToHex(r, g, b) {
-    return ('#' +
-        [r, g, b]
-            .map(x => {
-            const hex = x.toString(16);
-            return hex.length === 1 ? '0' + hex : hex;
-        })
-            .join(''));
+    return `#${[r, g, b].map(x => x.toString(16).padStart(2, '0')).join('')}`;
 }
 function hexToRgb(hex) {
     const matches = hex
@@ -666,14 +663,14 @@ __decorate([
 TuiDocDocumentationComponent = __decorate([
     Component({
         selector: 'tui-doc-documentation',
-        template: "<h1 *ngIf=\"heading\" class=\"tui-text_h4\">{{ heading }}</h1>\n<ng-content></ng-content>\n<table class=\"tui-table tui-table_layout_fixed tui-table_font-size_s\">\n    <tr class=\"tui-table__tr tui-table__tr_hover_disabled t-row t-row_header\">\n        <th class=\"tui-table__th tui-table__th_first t-cell t-cell_prop\">\n            {{ texts[2] }}\n        </th>\n        <td class=\"tui-table__th\">{{ type }}</td>\n        <td\n            *ngIf=\"showValues && !isAPI\"\n            class=\"tui-table__th tui-table__th_last tui-table__th_text_right t-cell t-cell_value\"\n        >\n            {{ texts[3] }}\n        </td>\n    </tr>\n    <tr\n        *ngFor=\"let propertyConnector of propertiesConnectors; last as lastItem\"\n        class=\"tui-table__tr tui-table__tr_hover_disabled t-row\"\n        [class.t-deprecated]=\"propertyConnector.documentationPropertyDeprecated\"\n        [class.tui-table__tr_border_none]=\"lastItem\"\n    >\n        <td\n            class=\"tui-table__td tui-table__td_first tui-table__td_align_center t-cell\"\n        >\n            <div\n                automation-id=\"tui-documentation__property-name\"\n                class=\"t-property t-cell\"\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\n                *ngTemplateOutlet=\"propertyConnector.template\"\n            ></ng-container>\n        </td>\n        <td class=\"tui-table__td tui-table__td_align_center 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=\"tui-table__td tui-table__td_align_center tui-table__td_last tui-table__td_text_right t-cell\"\n        >\n            <ng-container\n                *ngIf=\"propertyConnector.shouldShowValues; else elseEmitter\"\n            >\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 #selectContent let-data>\n                    <code>{{ inspectAny(data) }}</code>\n                </ng-template>\n\n                <ng-template #noItems>\n                    <ng-container\n                        [ngSwitch]=\"propertyConnector.documentationPropertyType\"\n                    >\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 *ngSwitchCase=\"'color'\" tuiGroup>\n                            <tui-primitive-textfield\n                                tuiTextfieldType=\"color\"\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                    </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",
+        template: "<h1 *ngIf=\"heading\" class=\"t-heading\">{{ heading }}</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 *ngIf=\"showValues && !isAPI\" class=\"t-th t-cell t-cell_value\">\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\n                *ngTemplateOutlet=\"propertyConnector.template\"\n            ></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 *ngIf=\"showValues\" class=\"t-cell\">\n            <ng-container\n                *ngIf=\"propertyConnector.shouldShowValues; else elseEmitter\"\n            >\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 #selectContent let-data>\n                    <code>{{ inspectAny(data) }}</code>\n                </ng-template>\n\n                <ng-template #noItems>\n                    <ng-container\n                        [ngSwitch]=\"propertyConnector.documentationPropertyType\"\n                    >\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 *ngSwitchCase=\"'color'\" tuiGroup>\n                            <tui-primitive-textfield\n                                tuiTextfieldType=\"color\"\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                    </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: ChangeDetectionStrategy.OnPush,
         animations: [
             trigger('emitEvent', [
                 transition(':increment', [style({ opacity: 1 }), animate('500ms ease-in')]),
             ]),
         ],
-        styles: [":host{display:block;min-width:100%}:host-context(tui-root._mobile) .t-row{display:flex;flex-wrap:wrap}:host-context(tui-root._mobile) .t-row_header{display:none}.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-property{font:var(--tui-font-text-m);margin-bottom:.25rem;font-family:monospace;color:#8f75d1}.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}"]
+        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, Inject(ChangeDetectorRef)),
     __param(1, Inject(TUI_DOC_DOCUMENTATION_TEXTS))
@@ -759,7 +756,9 @@ function rawLoadRecord(example) {
     return __awaiter(this, void 0, void 0, function* () {
         const processedContent = {};
         for (const [key, content] of Object.entries(example)) {
-            processedContent[key] = yield rawLoad(content);
+            if (content) {
+                processedContent[key] = yield rawLoad(content);
+            }
         }
         return processedContent;
     });
@@ -905,7 +904,7 @@ __decorate([
 TuiDocMainComponent = TuiDocMainComponent_1 = __decorate([
     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-space_left-2\"\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=\"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",
+        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=\"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: ViewEncapsulation.None,
         providers: [
             {
@@ -914,7 +913,7 @@ TuiDocMainComponent = TuiDocMainComponent_1 = __decorate([
             },
             TuiSwipeService,
         ],
-        styles: ["html{scroll-padding-top:4rem;height:auto}tui-root>tui-scroll-controls>.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.9375em){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}.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}"]
+        styles: ["html{scroll-padding-top:4rem;height:auto}tui-root>tui-scroll-controls>.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.9375em){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, Inject(LOCAL_STORAGE)),
     __param(1, Inject(WINDOW))
@@ -1192,10 +1191,10 @@ __decorate([
 TuiDocNavigationComponent = __decorate([
     Component({
         selector: 'tui-doc-navigation',
-        template: "<tui-hosted-dropdown\n    *tuiLet=\"filteredItems as filtered\"\n    tuiAutoFocus\n    tuiDropdownLimitWidth=\"fixed\"\n    class=\"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 #dropdown let-activeZone>\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=\"navigation\">\n    <tui-scrollbar class=\"scrollbar\" [tuiMode]=\"mode$ | async\">\n        <tui-accordion [closeOthers]=\"false\" [rounded]=\"false\">\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=\"tui-space_left-2\">\n                    <strong>{{ label }}</strong>\n                </span>\n                <ng-template tuiAccordionItemContent>\n                    <div class=\"section\">\n                        <ng-container\n                            *ngFor=\"let item of items[index]; index as subIndex\"\n                        >\n                            <ng-container\n                                *ngTemplateOutlet=\"pages; context: {item: item, index: index * 100 + subIndex}\"\n                            ></ng-container>\n                        </ng-container>\n                    </div>\n                </ng-template>\n            </tui-accordion-item>\n        </tui-accordion>\n        <div class=\"items-container\">\n            <ng-container\n                *ngFor=\"let item of itemsWithoutSections; let index = index\"\n            >\n                <ng-container\n                    *ngTemplateOutlet=\"pages; context: {item: item, index: items.length - 1 + index}\"\n                ></ng-container>\n            </ng-container>\n        </div>\n\n        <ng-template #pages let-item=\"item\" let-index=\"index\">\n            <a\n                *ngIf=\"!item.subPages; else subPages\"\n                tuiLink\n                routerLinkActive=\"sublink_active\"\n                class=\"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=\"subsection\"\n                    [routerLinkActiveOptions]=\"{exact: false}\"\n                >\n                    <button\n                        *ngIf=\"item.subPages\"\n                        tuiLink\n                        type=\"button\"\n                        class=\"sublink sublink_subsection\"\n                        (click)=\"onGroupClick(index)\"\n                    >\n                        <tui-svg\n                            src=\"tuiIconChevronRight\"\n                            class=\"chevron\"\n                            [class.chevron_active]=\"!!openPagesGroupsArr[index]\"\n                        ></tui-svg>\n                        {{ item.title }}\n                    </button>\n                    <tui-expand\n                        class=\"tui-space_left-1\"\n                        [expanded]=\"!!openPagesGroupsArr[index]\"\n                    >\n                        <div class=\"section section_bordered\">\n                            <a\n                                *ngFor=\"let subPage of item.subPages\"\n                                tuiLink\n                                routerLinkActive=\"sublink_active\"\n                                class=\"sublink 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",
+        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 #dropdown let-activeZone>\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 class=\"t-scrollbar\" [tuiMode]=\"mode$ | async\">\n        <tui-accordion [closeOthers]=\"false\" [rounded]=\"false\">\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                        >\n                            <ng-container\n                                *ngTemplateOutlet=\"pages; context: {item: item, index: index * 100 + subIndex}\"\n                            ></ng-container>\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            >\n                <ng-container\n                    *ngTemplateOutlet=\"pages; context: {item: item, index: items.length - 1 + index}\"\n                ></ng-container>\n            </ng-container>\n        </div>\n\n        <ng-template #pages let-item=\"item\" let-index=\"index\">\n            <a\n                *ngIf=\"!item.subPages; else subPages\"\n                tuiLink\n                routerLinkActive=\"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=\"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: ChangeDetectionStrategy.OnPush,
-        styles: [":host{z-index:1;display:flex;flex-direction:column;text-align:center;background:var(--tui-base-01)}.input{display:block;margin:1.25rem}.navigation{display:flex;max-height:100%;min-height:0;flex:1 1 0;text-align:left}.scrollbar{width:100%;scroll-behavior:smooth}.items-container{display:flex;flex-direction:column;padding:0 16px}.section{display:flex;flex-direction:column;align-items:flex-start;margin:-1rem 0 -.5rem}.section_bordered{margin:.5rem 0;border-left:1px solid var(--tui-base-03)}.subsection{margin-left:.5rem}.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}.sublink_small{margin-left:1rem;line-height:1.5rem;padding-top:.5rem}.sublink_subsection{margin-left:0;line-height:1.6rem}.sublink_active{color:var(--tui-text-01)}.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}.chevron_active{transform:rotate(90deg)}"]
+        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, Inject(ChangeDetectorRef)),
     __param(1, Inject(Title)),
@@ -1272,9 +1271,9 @@ TuiDocHeaderComponent.ctorParameters = () => [
 TuiDocHeaderComponent = __decorate([
     Component({
         selector: 'header[tuiDocHeader]',
-        template: "<button\n    tuiIconButton\n    icon=\"tuiIconMenuLarge\"\n    appearance=\"icon\"\n    class=\"menu\"\n    [title]=\"menu\"\n    (click)=\"onClick()\"\n    (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n    <tui-doc-navigation\n        *tuiSidebar=\"open$ | async\"\n        class=\"navigation\"\n    ></tui-doc-navigation>\n</button>\n<div polymorpheus-outlet class=\"logo tui-text_h5\" [content]=\"logo\">\n    <ng-template let-src>\n        <img alt=\"Logo\" class=\"img\" [src]=\"src\" />\n    </ng-template>\n</div>\n<ng-content></ng-content>\n",
+        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 polymorpheus-outlet class=\"t-logo\" [content]=\"logo\">\n    <ng-template let-src>\n        <img alt=\"Logo\" class=\"t-img\" [src]=\"src\" />\n    </ng-template>\n</div>\n<ng-content></ng-content>\n",
         changeDetection: 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)}.logo{margin-right:auto}.img{display:block}.menu{margin-left:-1.25rem}@media screen and (min-width:48em){.menu{display:none}}.navigation{min-height:100%}"]
+        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, Inject(TUI_DOC_LOGO)),
     __param(1, Inject(TUI_DOC_MENU_TEXT)),
@@ -1337,7 +1336,7 @@ const PAGE_PROVIDERS = [
     },
 ];
 function seeAlsoProviderFactory({ nativeElement }, seeAlsoGroups) {
-    const groups = seeAlsoGroups.filter(group => group.indexOf(nativeElement.header) !== -1) || [];
+    const groups = seeAlsoGroups.filter(group => group.includes(nativeElement.header)) || [];
     const seeAlsoSet = new Set(groups
         .join()
         .split(',')
@@ -1547,6 +1546,12 @@ TuiDocPageModule = __decorate([
     })
 ], TuiDocPageModule);
 
+const TUI_EXAMPLE_PRIMARY_FILE_NAME = {
+    TS: 'TypeScript',
+    LESS: 'LESS',
+    HTML: 'HTML',
+};
+
 // TODO: remove in ivy compilation
 const DEMO_TEXTS = ['Сделано с помощью директивы: ', 'Фон', 'Детали формы'];
 const DOC_TEXTS = [
@@ -1628,5 +1633,5 @@ function generateRoutes(type) {
  * Generated bundle index. Do not edit.
  */
 
-export { DEMO_TEXTS, DOC_TEXTS, EXAMPLE_TEXTS, ScrollIntoViewDirective, ScrollIntoViewModule, TUI_DOC_CODE_EDITOR, TUI_DOC_DEFAULT_TABS, TUI_DOC_DEMO_TEXTS, TUI_DOC_DOCUMENTATION_TEXTS, TUI_DOC_EXAMPLE_CONTENT_PROCESSOR, TUI_DOC_EXAMPLE_TEXTS, TUI_DOC_LOGO, TUI_DOC_MENU_TEXT, TUI_DOC_PAGES, TUI_DOC_RUSSIAN, TUI_DOC_SEARCH_TEXT, TUI_DOC_SEE_ALSO, TUI_DOC_SEE_ALSO_TEXT, TUI_DOC_SOURCE_CODE, TUI_DOC_SOURCE_CODE_TEXT, TUI_DOC_TITLE, TuiAddonDocModule, TuiDocCodeComponent, TuiDocCodeModule, TuiDocCopyComponent, TuiDocCopyModule, TuiDocDemoComponent, TuiDocDemoModule, TuiDocDocumentationComponent, TuiDocDocumentationModule, TuiDocDocumentationPropertyConnectorDirective, TuiDocExampleComponent, TuiDocExampleModule, TuiDocMainComponent, TuiDocMainModule, TuiDocNavigationComponent, TuiDocNavigationModule, TuiDocPageComponent, TuiDocPageModule, TuiDocPageTabConnectorDirective, coerceValue, generateRoutes, tryParseMarkdownCodeBlock, TuiInputOpacityModule as ɵa, TuiInputOpacityDirective as ɵb, TuiDocExampleGetTabsPipe as ɵc, TuiDocHeaderModule as ɵd, NAVIGATION_TITLE as ɵe, NAVIGATION_LABELS as ɵf, NAVIGATION_ITEMS as ɵg, NAVIGATION_PROVIDERS as ɵh, titleProviderFactory as ɵi, labelsProviderFactory as ɵj, itemsProviderFactory as ɵk, TuiDocHeaderComponent as ɵl, PAGE_SEE_ALSO as ɵm, PAGE_PROVIDERS as ɵn, seeAlsoProviderFactory as ɵo, TuiDocSeeAlsoModule as ɵp, TuiDocSeeAlsoComponent as ɵq, TuiDocSourceCodeModule as ɵr, TuiDocSourceCodeComponent as ɵs };
+export { DEMO_TEXTS, DOC_TEXTS, EXAMPLE_TEXTS, ScrollIntoViewDirective, ScrollIntoViewModule, TUI_DOC_CODE_EDITOR, TUI_DOC_DEFAULT_TABS, TUI_DOC_DEMO_TEXTS, TUI_DOC_DOCUMENTATION_TEXTS, TUI_DOC_EXAMPLE_CONTENT_PROCESSOR, TUI_DOC_EXAMPLE_TEXTS, TUI_DOC_LOGO, TUI_DOC_MENU_TEXT, TUI_DOC_PAGES, TUI_DOC_RUSSIAN, TUI_DOC_SEARCH_TEXT, TUI_DOC_SEE_ALSO, TUI_DOC_SEE_ALSO_TEXT, TUI_DOC_SOURCE_CODE, TUI_DOC_SOURCE_CODE_TEXT, TUI_DOC_TITLE, TUI_EXAMPLE_PRIMARY_FILE_NAME, TuiAddonDocModule, TuiDocCodeComponent, TuiDocCodeModule, TuiDocCopyComponent, TuiDocCopyModule, TuiDocDemoComponent, TuiDocDemoModule, TuiDocDocumentationComponent, TuiDocDocumentationModule, TuiDocDocumentationPropertyConnectorDirective, TuiDocExampleComponent, TuiDocExampleModule, TuiDocMainComponent, TuiDocMainModule, TuiDocNavigationComponent, TuiDocNavigationModule, TuiDocPageComponent, TuiDocPageModule, TuiDocPageTabConnectorDirective, coerceValue, generateRoutes, tryParseMarkdownCodeBlock, TuiInputOpacityModule as ɵa, TuiInputOpacityDirective as ɵb, TuiDocExampleGetTabsPipe as ɵc, TuiDocHeaderModule as ɵd, NAVIGATION_TITLE as ɵe, NAVIGATION_LABELS as ɵf, NAVIGATION_ITEMS as ɵg, NAVIGATION_PROVIDERS as ɵh, titleProviderFactory as ɵi, labelsProviderFactory as ɵj, itemsProviderFactory as ɵk, TuiDocHeaderComponent as ɵl, PAGE_SEE_ALSO as ɵm, PAGE_PROVIDERS as ɵn, seeAlsoProviderFactory as ɵo, TuiDocSeeAlsoModule as ɵp, TuiDocSeeAlsoComponent as ɵq, TuiDocSourceCodeModule as ɵr, TuiDocSourceCodeComponent as ɵs };
 //# sourceMappingURL=taiga-ui-addon-doc.js.map