@taiga-ui/addon-doc 2.51.1 → 2.54.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/bundles/taiga-ui-addon-doc.umd.js +98 -26
  2. package/bundles/taiga-ui-addon-doc.umd.js.map +1 -1
  3. package/bundles/taiga-ui-addon-doc.umd.min.js +1 -1
  4. package/bundles/taiga-ui-addon-doc.umd.min.js.map +1 -1
  5. package/components/code/parse-code-block.d.ts +4 -0
  6. package/components/example/example.component.d.ts +2 -1
  7. package/components/navigation/navigation.component.d.ts +4 -1
  8. package/directives/scroll-into-view/scroll-into-view.directive.d.ts +3 -1
  9. package/esm2015/components/code/code.component.js +2 -2
  10. package/esm2015/components/code/parse-code-block.js +6 -1
  11. package/esm2015/components/demo/demo.component.js +2 -2
  12. package/esm2015/components/documentation/documentation.component.js +2 -2
  13. package/esm2015/components/example/example.component.js +10 -6
  14. package/esm2015/components/navigation/navigation.component.js +22 -12
  15. package/esm2015/components/navigation/navigation.providers.js +4 -1
  16. package/esm2015/components/page/page.component.js +2 -2
  17. package/esm2015/components/page/page.providers.js +2 -1
  18. package/esm2015/directives/scroll-into-view/scroll-into-view.directive.js +13 -9
  19. package/esm2015/internal/see-also/see-also.component.js +2 -2
  20. package/esm2015/public-api.js +4 -1
  21. package/esm2015/tokens/code-actions.js +5 -0
  22. package/esm2015/tokens/page-loaded.js +5 -0
  23. package/esm2015/tokens/scroll-behavior.js +3 -0
  24. package/esm2015/utils/coerce-value.js +7 -2
  25. package/esm2015/utils/color-conversion.js +10 -1
  26. package/esm2015/utils/generate-routes.js +4 -1
  27. package/esm2015/utils/inspect.js +4 -1
  28. package/esm2015/utils/raw-load-record.js +6 -1
  29. package/esm2015/utils/raw-load.js +6 -1
  30. package/esm2015/utils/transliterate-keyboard-layout.js +4 -1
  31. package/esm5/components/code/code.component.js +2 -2
  32. package/esm5/components/code/parse-code-block.js +6 -1
  33. package/esm5/components/demo/demo.component.js +2 -2
  34. package/esm5/components/documentation/documentation.component.js +2 -2
  35. package/esm5/components/example/example.component.js +10 -6
  36. package/esm5/components/navigation/navigation.component.js +22 -12
  37. package/esm5/components/navigation/navigation.providers.js +4 -1
  38. package/esm5/components/page/page.component.js +2 -2
  39. package/esm5/components/page/page.providers.js +2 -1
  40. package/esm5/directives/scroll-into-view/scroll-into-view.directive.js +13 -9
  41. package/esm5/internal/see-also/see-also.component.js +2 -2
  42. package/esm5/public-api.js +4 -1
  43. package/esm5/tokens/code-actions.js +5 -0
  44. package/esm5/tokens/page-loaded.js +5 -0
  45. package/esm5/tokens/scroll-behavior.js +3 -0
  46. package/esm5/utils/coerce-value.js +7 -2
  47. package/esm5/utils/color-conversion.js +10 -1
  48. package/esm5/utils/generate-routes.js +4 -1
  49. package/esm5/utils/inspect.js +4 -1
  50. package/esm5/utils/raw-load-record.js +6 -1
  51. package/esm5/utils/raw-load.js +6 -1
  52. package/esm5/utils/transliterate-keyboard-layout.js +4 -1
  53. package/fesm2015/taiga-ui-addon-doc.js +93 -29
  54. package/fesm2015/taiga-ui-addon-doc.js.map +1 -1
  55. package/fesm5/taiga-ui-addon-doc.js +93 -29
  56. package/fesm5/taiga-ui-addon-doc.js.map +1 -1
  57. package/package.json +5 -5
  58. package/public-api.d.ts +3 -0
  59. package/taiga-ui-addon-doc.metadata.json +1 -1
  60. package/tokens/code-actions.d.ts +4 -0
  61. package/tokens/page-loaded.d.ts +3 -0
  62. package/tokens/scroll-behavior.d.ts +2 -0
  63. package/utils/coerce-value.d.ts +4 -0
  64. package/utils/color-conversion.d.ts +7 -0
  65. package/utils/generate-routes.d.ts +2 -0
  66. package/utils/inspect.d.ts +2 -0
  67. package/utils/raw-load-record.d.ts +4 -0
  68. package/utils/raw-load.d.ts +4 -0
  69. package/utils/transliterate-keyboard-layout.d.ts +2 -0
@@ -255,6 +255,10 @@
255
255
  return typeof state === "function" ? receiver === state : state.has(receiver);
256
256
  }
257
257
 
258
+ /**
259
+ * @deprecated: use {@link tuiRawLoad} instead
260
+ */
261
+ // eslint-disable-next-line @typescript-eslint/naming-convention
258
262
  function rawLoad(content) {
259
263
  return __awaiter(this, void 0, void 0, function () {
260
264
  var _a;
@@ -274,7 +278,12 @@
274
278
  });
275
279
  });
276
280
  }
281
+ var tuiRawLoad = rawLoad;
277
282
 
283
+ /**
284
+ * @deprecated: use {@link tuiTryParseMarkdownCodeBlock} instead
285
+ */
286
+ // eslint-disable-next-line @typescript-eslint/naming-convention
278
287
  function tryParseMarkdownCodeBlock(text) {
279
288
  if (text === void 0) { text = ''; }
280
289
  var tokens = new MarkdownIt().parse(text, {});
@@ -289,6 +298,7 @@
289
298
  });
290
299
  return result.length ? result : [text];
291
300
  }
301
+ var tuiTryParseMarkdownCodeBlock = tryParseMarkdownCodeBlock;
292
302
 
293
303
  var TuiDocCodeComponent = /** @class */ (function () {
294
304
  function TuiDocCodeComponent() {
@@ -322,7 +332,7 @@
322
332
  TuiDocCodeComponent = __decorate([
323
333
  core.Component({
324
334
  selector: 'tui-doc-code',
325
- 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",
335
+ 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",
326
336
  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}"]
327
337
  })
328
338
  ], TuiDocCodeComponent);
@@ -564,7 +574,7 @@
564
574
  TuiDocDemoComponent = TuiDocDemoComponent_1 = __decorate([
565
575
  core.Component({
566
576
  selector: 'tui-doc-demo',
567
- 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\">\nForm data: {{ testForm.value | json }}</pre\n >\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",
577
+ 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",
568
578
  changeDetection: core.ChangeDetectionStrategy.OnPush,
569
579
  providers: [
570
580
  cdk.TuiDestroyService,
@@ -620,11 +630,19 @@
620
630
  }());
621
631
 
622
632
  /**
633
+ * TODO: duplicate, need fix it before v3
623
634
  * TODO: move another package for reuse between addon-editor and addon-doc
635
+ * @deprecated: use {@link tuiRgbToHex} instead
624
636
  */
637
+ // eslint-disable-next-line @typescript-eslint/naming-convention
625
638
  function rgbToHex(r, g, b) {
626
639
  return "#" + [r, g, b].map(function (x) { return x.toString(16).padStart(2, '0'); }).join('');
627
640
  }
641
+ var tuiRgbToHex = rgbToHex;
642
+ /**
643
+ * @deprecated: use {@link tuiHexToRgb} instead
644
+ */
645
+ // eslint-disable-next-line @typescript-eslint/naming-convention
628
646
  function hexToRgb(hex) {
629
647
  var matches = hex
630
648
  .replace('#', '')
@@ -636,6 +654,7 @@
636
654
  ? matches.map(function (x) { return Number.parseInt(x, 16); })
637
655
  : [0, 0, 0];
638
656
  }
657
+ var tuiHexToRgb = hexToRgb;
639
658
 
640
659
  function inspectArray(array, depth) {
641
660
  if (depth === 0) {
@@ -675,11 +694,13 @@
675
694
  return "{" + result + "}";
676
695
  }
677
696
  /**
697
+ * @deprecated: use {@link tuiInspectAny} instead
678
698
  * Returns readable JS entity
679
699
  * @param data
680
700
  * @param depth
681
701
  * @return readable JS entity
682
702
  */
703
+ // eslint-disable-next-line @typescript-eslint/naming-convention
683
704
  function inspectAny(data, depth) {
684
705
  if (data === null) {
685
706
  return 'null';
@@ -701,8 +722,12 @@
701
722
  }
702
723
  return inspectObject(data, depth);
703
724
  }
725
+ var tuiInspectAny = inspectAny;
704
726
 
705
- /* eslint-disable unicorn/no-unsafe-regex */
727
+ /**
728
+ * @deprecated: use {@link tuiCoerceValue} instead
729
+ */
730
+ // eslint-disable-next-line @typescript-eslint/naming-convention
706
731
  function coerceValue(value) {
707
732
  var prepared = String(value).trim();
708
733
  if (isEmptyParamValue(prepared)) {
@@ -724,6 +749,7 @@
724
749
  return decodedValue;
725
750
  }
726
751
  }
752
+ var tuiCoerceValue = coerceValue;
727
753
  function isEmptyParamValue(value) {
728
754
  return ['undefined', 'null', 'NaN', 'Infinity'].includes(value);
729
755
  }
@@ -732,6 +758,7 @@
732
758
  }
733
759
  function isNumberParamValue(value) {
734
760
  // TODO: investigate to disallow potentially catastrophic exponential-time regular expressions.
761
+ // eslint-disable-next-line unicorn/no-unsafe-regex
735
762
  return /^-?[\d.]+(?:e-?\d+)?$/.test(value);
736
763
  }
737
764
  function isPossibleArray(value) {
@@ -986,7 +1013,7 @@
986
1013
  TuiDocDocumentationComponent = __decorate([
987
1014
  core.Component({
988
1015
  selector: 'tui-doc-documentation',
989
- 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\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\n *ngIf=\"showValues\"\n class=\"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\n #selectContent\n let-data\n >\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\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",
1016
+ 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",
990
1017
  changeDetection: core.ChangeDetectionStrategy.OnPush,
991
1018
  animations: [
992
1019
  animations.trigger('emitEvent', [
@@ -1084,10 +1111,18 @@
1084
1111
  return TuiDocDocumentationModule;
1085
1112
  }());
1086
1113
 
1114
+ var TUI_DOC_CODE_ACTIONS = new core.InjectionToken('Code actions for the opened tab with code example', {
1115
+ factory: function () { return ''; },
1116
+ });
1117
+
1087
1118
  var TUI_DOC_CODE_EDITOR = new core.InjectionToken('Contains service for opening online IDE e.g. Stackblitz');
1088
1119
 
1089
1120
  var TUI_DOC_EXAMPLE_CONTENT_PROCESSOR = new core.InjectionToken('Processes content in example', { factory: function () { return rxjs.identity; } });
1090
1121
 
1122
+ /**
1123
+ * @deprecated: use {@link tuiRawLoadRecord} instead
1124
+ */
1125
+ // eslint-disable-next-line @typescript-eslint/naming-convention
1091
1126
  function rawLoadRecord(example) {
1092
1127
  return __awaiter(this, void 0, void 0, function () {
1093
1128
  var processedContent, _a, _b, _c, key, content, _d, _e, e_1_1;
@@ -1130,11 +1165,12 @@
1130
1165
  });
1131
1166
  });
1132
1167
  }
1168
+ var tuiRawLoadRecord = rawLoadRecord;
1133
1169
 
1134
1170
  // Ambient type cannot be used without dynamic https://github.com/angular/angular/issues/23395
1135
1171
  // @dynamic
1136
1172
  var TuiDocExampleComponent = /** @class */ (function () {
1137
- function TuiDocExampleComponent(id, clipboard, notifications, location, copyTexts$, texts, codeEditor, processContent, isCypress) {
1173
+ function TuiDocExampleComponent(id, clipboard, notifications, location, copyTexts$, texts, codeEditor, processContent, isCypress, codeActions) {
1138
1174
  var _this = this;
1139
1175
  this.id = id;
1140
1176
  this.clipboard = clipboard;
@@ -1145,6 +1181,7 @@
1145
1181
  this.codeEditor = codeEditor;
1146
1182
  this.processContent = processContent;
1147
1183
  this.isCypress = isCypress;
1184
+ this.codeActions = codeActions;
1148
1185
  this.rawLoader$$ = new rxjs.BehaviorSubject({});
1149
1186
  this.heading = '';
1150
1187
  this.description = '';
@@ -1195,7 +1232,8 @@
1195
1232
  { type: Array, decorators: [{ type: core.Inject, args: [TUI_DOC_EXAMPLE_TEXTS,] }] },
1196
1233
  { type: undefined, decorators: [{ type: core.Optional }, { type: core.Inject, args: [TUI_DOC_CODE_EDITOR,] }] },
1197
1234
  { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_EXAMPLE_CONTENT_PROCESSOR,] }] },
1198
- { type: Boolean, decorators: [{ type: core.Inject, args: [cdk.TUI_IS_CYPRESS,] }] }
1235
+ { type: Boolean, decorators: [{ type: core.Inject, args: [cdk.TUI_IS_CYPRESS,] }] },
1236
+ { type: Array, decorators: [{ type: core.Inject, args: [TUI_DOC_CODE_ACTIONS,] }] }
1199
1237
  ]; };
1200
1238
  __decorate([
1201
1239
  core.Input()
@@ -1212,9 +1250,9 @@
1212
1250
  TuiDocExampleComponent = __decorate([
1213
1251
  core.Component({
1214
1252
  selector: 'tui-doc-example',
1215
- 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 *ngIf=\"index === defaultTabIndex; else anotherTab\">\n <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\n </ng-container>\n <ng-template #anotherTab>\n <ng-container\n *ngTemplateOutlet=\"codeSection; context: { $implicit: files[tabs[activeItemIndex]] || '' }\"\n ></ng-container>\n </ng-template>\n </div>\n </ng-container>\n</div>\n\n<ng-template #preview>\n <div\n automation-id=\"tui-doc-example\"\n class=\"t-demo\"\n >\n <ng-content></ng-content>\n </div>\n</ng-template>\n\n<ng-template\n #codeSection\n let-code\n>\n <tui-doc-copy\n class=\"t-copy-code\"\n [cdkCopyToClipboard]=\"code\"\n ></tui-doc-copy>\n <tui-doc-code [code]=\"code\"></tui-doc-code>\n</ng-template>\n",
1253
+ 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",
1216
1254
  changeDetection: core.ChangeDetectionStrategy.OnPush,
1217
- 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-copy-code{position:absolute;top:4.375rem;right:1rem}.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}"]
1255
+ 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}"]
1218
1256
  }),
1219
1257
  __param(0, core.Attribute('id')),
1220
1258
  __param(1, core.Inject(clipboard.Clipboard)),
@@ -1225,7 +1263,8 @@
1225
1263
  __param(6, core.Optional()),
1226
1264
  __param(6, core.Inject(TUI_DOC_CODE_EDITOR)),
1227
1265
  __param(7, core.Inject(TUI_DOC_EXAMPLE_CONTENT_PROCESSOR)),
1228
- __param(8, core.Inject(cdk.TUI_IS_CYPRESS))
1266
+ __param(8, core.Inject(cdk.TUI_IS_CYPRESS)),
1267
+ __param(9, core.Inject(TUI_DOC_CODE_ACTIONS))
1229
1268
  ], TuiDocExampleComponent);
1230
1269
  return TuiDocExampleComponent;
1231
1270
  }());
@@ -1334,16 +1373,19 @@
1334
1373
  return TuiDocMainComponent;
1335
1374
  }());
1336
1375
 
1376
+ 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))); }); } });
1377
+
1337
1378
  /**
1338
1379
  * @deprecated: use {@link TuiScrollIntoViewLinkDirective}
1339
1380
  * TODO: remove in v3.0
1340
1381
  */
1341
1382
  var ScrollIntoViewDirective = /** @class */ (function () {
1342
- function ScrollIntoViewDirective(destroy$, _a) {
1383
+ function ScrollIntoViewDirective(destroy$, _a, readyToScroll$) {
1343
1384
  var nativeElement = _a.nativeElement;
1344
- this.scroll$ = new rxjs.Subject();
1345
- this.scroll$
1346
- .pipe(operators.debounceTime(750), operators.filter(function (shallWe) { return shallWe && !!cdk.getElementObscurers(nativeElement); }), operators.takeUntil(destroy$))
1385
+ this.readyToScroll$ = readyToScroll$;
1386
+ this.scroll$ = new rxjs.ReplaySubject(1);
1387
+ this.readyToScroll$
1388
+ .pipe(operators.filter(Boolean), operators.switchMapTo(this.scroll$), operators.debounceTime(750), operators.filter(function (shallWe) { return shallWe && !!cdk.getElementObscurers(nativeElement); }), operators.takeUntil(destroy$))
1347
1389
  .subscribe(function () {
1348
1390
  nativeElement.scrollIntoView();
1349
1391
  });
@@ -1357,7 +1399,8 @@
1357
1399
  });
1358
1400
  ScrollIntoViewDirective.ctorParameters = function () { return [
1359
1401
  { type: cdk.TuiDestroyService, decorators: [{ type: core.Inject, args: [cdk.TuiDestroyService,] }] },
1360
- { type: core.ElementRef, decorators: [{ type: core.Inject, args: [core.ElementRef,] }] }
1402
+ { type: core.ElementRef, decorators: [{ type: core.Inject, args: [core.ElementRef,] }] },
1403
+ { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [TUI_DOC_PAGE_LOADED,] }] }
1361
1404
  ]; };
1362
1405
  __decorate([
1363
1406
  core.Input()
@@ -1370,7 +1413,8 @@
1370
1413
  // eslint-disable-next-line @typescript-eslint/naming-convention
1371
1414
  ,
1372
1415
  __param(0, core.Inject(cdk.TuiDestroyService)),
1373
- __param(1, core.Inject(core.ElementRef))
1416
+ __param(1, core.Inject(core.ElementRef)),
1417
+ __param(2, core.Inject(TUI_DOC_PAGE_LOADED))
1374
1418
  ], ScrollIntoViewDirective);
1375
1419
  return ScrollIntoViewDirective;
1376
1420
  }());
@@ -1417,6 +1461,8 @@
1417
1461
  return TuiScrollIntoViewLinkModule;
1418
1462
  }());
1419
1463
 
1464
+ var TUI_DOC_SCROLL_BEHAVIOR = new core.InjectionToken('[TUI_DOC_SCROLL_BEHAVIOR] Defines the transition animation for scroll', { factory: function () { return 'smooth'; } });
1465
+
1420
1466
  var MAP = {
1421
1467
  а: 'f',
1422
1468
  б: ',',
@@ -1452,10 +1498,12 @@
1452
1498
  я: 'z',
1453
1499
  };
1454
1500
  /**
1501
+ * @deprecated: use {@link tuiTransliterateKeyboardLayout} instead
1455
1502
  * Translates text mistakenly typed in the Russian layout into English
1456
1503
  * @param string string with Russian layout characters
1457
1504
  * @return string with English layout characters
1458
1505
  */
1506
+ // eslint-disable-next-line @typescript-eslint/naming-convention
1459
1507
  function transliterateKeyboardLayout(string) {
1460
1508
  var newStr = '';
1461
1509
  for (var i = 0; i < string.length; i++) {
@@ -1463,6 +1511,7 @@
1463
1511
  }
1464
1512
  return newStr;
1465
1513
  }
1514
+ var tuiTransliterateKeyboardLayout = transliterateKeyboardLayout;
1466
1515
 
1467
1516
  var TUI_DOC_PAGES = new core.InjectionToken('Documentation pages', {
1468
1517
  factory: function () { return []; },
@@ -1493,6 +1542,7 @@
1493
1542
  useFactory: itemsProviderFactory,
1494
1543
  },
1495
1544
  ];
1545
+ // eslint-disable-next-line @typescript-eslint/naming-convention
1496
1546
  function titleProviderFactory(router$1, activatedRoute, titlePrefix, destroy$) {
1497
1547
  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) {
1498
1548
  var data = _a.data;
@@ -1502,6 +1552,7 @@
1502
1552
  return titlePrefix + title;
1503
1553
  }), operators.takeUntil(destroy$));
1504
1554
  }
1555
+ // eslint-disable-next-line @typescript-eslint/naming-convention
1505
1556
  function labelsProviderFactory(pages) {
1506
1557
  return pages
1507
1558
  .map(function (_a) {
@@ -1511,6 +1562,7 @@
1511
1562
  .filter(cdk.isPresent)
1512
1563
  .filter(function (item, index, array) { return array.indexOf(item) === index; });
1513
1564
  }
1565
+ // eslint-disable-next-line @typescript-eslint/naming-convention
1514
1566
  function itemsProviderFactory(pages) {
1515
1567
  var labels = labelsProviderFactory(pages);
1516
1568
  return __spread(labels.map(function (label) { return pages.filter(function (_a) {
@@ -1521,10 +1573,9 @@
1521
1573
  ]);
1522
1574
  }
1523
1575
 
1524
- var SCROLL_INTO_VIEW_DELAY = 200;
1525
1576
  // @dynamic
1526
1577
  var TuiDocNavigationComponent = /** @class */ (function () {
1527
- function TuiDocNavigationComponent(changeDetectorRef, titleService, title$, documentRef, mode, sidebar, labels, items, searchText, router, activatedRoute) {
1578
+ function TuiDocNavigationComponent(changeDetectorRef, titleService, title$, documentRef, mode, sidebar, labels, items, searchText, router, activatedRoute, destroy$, readyToScroll$, scrollBehavior) {
1528
1579
  var _this = this;
1529
1580
  this.documentRef = documentRef;
1530
1581
  this.mode = mode;
@@ -1534,6 +1585,9 @@
1534
1585
  this.searchText = searchText;
1535
1586
  this.router = router;
1536
1587
  this.activatedRoute = activatedRoute;
1588
+ this.destroy$ = destroy$;
1589
+ this.readyToScroll$ = readyToScroll$;
1590
+ this.scrollBehavior = scrollBehavior;
1537
1591
  this.menuOpen = false;
1538
1592
  this.search = '';
1539
1593
  this.open = false;
@@ -1618,9 +1672,9 @@
1618
1672
  };
1619
1673
  TuiDocNavigationComponent.prototype.handleAnchorLink = function (hash) {
1620
1674
  var _this = this;
1621
- setTimeout(function () {
1622
- _this.navigateToAnchorLink(hash);
1623
- }, SCROLL_INTO_VIEW_DELAY);
1675
+ this.readyToScroll$
1676
+ .pipe(operators.filter(Boolean), operators.take(1), operators.takeUntil(this.destroy$))
1677
+ .subscribe(function () { return _this.navigateToAnchorLink(hash); });
1624
1678
  };
1625
1679
  TuiDocNavigationComponent.prototype.openActivePageGroup = function () {
1626
1680
  var _this = this;
@@ -1651,7 +1705,7 @@
1651
1705
  element.scrollIntoView({
1652
1706
  block: 'start',
1653
1707
  inline: 'nearest',
1654
- behavior: 'smooth',
1708
+ behavior: this.scrollBehavior,
1655
1709
  });
1656
1710
  };
1657
1711
  TuiDocNavigationComponent.ctorParameters = function () { return [
@@ -1665,7 +1719,10 @@
1665
1719
  { type: undefined, decorators: [{ type: core.Inject, args: [NAVIGATION_ITEMS,] }] },
1666
1720
  { type: String, decorators: [{ type: core.Inject, args: [TUI_DOC_SEARCH_TEXT,] }] },
1667
1721
  { type: router.Router, decorators: [{ type: core.Inject, args: [router.Router,] }] },
1668
- { type: router.ActivatedRoute, decorators: [{ type: core.Inject, args: [router.ActivatedRoute,] }] }
1722
+ { type: router.ActivatedRoute, decorators: [{ type: core.Inject, args: [router.ActivatedRoute,] }] },
1723
+ { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [cdk.TuiDestroyService,] }] },
1724
+ { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [TUI_DOC_PAGE_LOADED,] }] },
1725
+ { type: undefined, decorators: [{ type: core.Inject, args: [TUI_DOC_SCROLL_BEHAVIOR,] }] }
1669
1726
  ]; };
1670
1727
  __decorate([
1671
1728
  core.HostBinding('class._open')
@@ -1679,7 +1736,7 @@
1679
1736
  TuiDocNavigationComponent = __decorate([
1680
1737
  core.Component({
1681
1738
  selector: 'tui-doc-navigation',
1682
- 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 >\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\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",
1739
+ 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",
1683
1740
  providers: NAVIGATION_PROVIDERS,
1684
1741
  changeDetection: core.ChangeDetectionStrategy.OnPush,
1685
1742
  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)}"]
@@ -1695,7 +1752,10 @@
1695
1752
  __param(7, core.Inject(NAVIGATION_ITEMS)),
1696
1753
  __param(8, core.Inject(TUI_DOC_SEARCH_TEXT)),
1697
1754
  __param(9, core.Inject(router.Router)),
1698
- __param(10, core.Inject(router.ActivatedRoute))
1755
+ __param(10, core.Inject(router.ActivatedRoute)),
1756
+ __param(11, core.Inject(cdk.TuiDestroyService)),
1757
+ __param(12, core.Inject(TUI_DOC_PAGE_LOADED)),
1758
+ __param(13, core.Inject(TUI_DOC_SCROLL_BEHAVIOR))
1699
1759
  ], TuiDocNavigationComponent);
1700
1760
  return TuiDocNavigationComponent;
1701
1761
  }());
@@ -1836,6 +1896,7 @@
1836
1896
  useFactory: seeAlsoProviderFactory,
1837
1897
  },
1838
1898
  ];
1899
+ // eslint-disable-next-line @typescript-eslint/naming-convention
1839
1900
  function seeAlsoProviderFactory(_a, seeAlsoGroups) {
1840
1901
  var nativeElement = _a.nativeElement;
1841
1902
  var currentHeader = nativeElement.getAttribute('header');
@@ -1915,7 +1976,7 @@
1915
1976
  TuiDocPageComponent = __decorate([
1916
1977
  core.Component({
1917
1978
  selector: 'tui-doc-page',
1918
- 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\n *ngFor=\"let tab of tabConnectors; first as first; index as index\"\n >\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 *ngIf=\"index === activeItemIndex\">\n <ng-container *ngTemplateOutlet=\"tab.template\"></ng-container>\n </ng-container>\n </ng-container>\n</div>\n",
1979
+ 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",
1919
1980
  changeDetection: core.ChangeDetectionStrategy.OnPush,
1920
1981
  providers: PAGE_PROVIDERS,
1921
1982
  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}"]
@@ -1956,7 +2017,7 @@
1956
2017
  TuiDocSeeAlsoComponent = __decorate([
1957
2018
  core.Component({
1958
2019
  selector: 'tui-doc-see-also',
1959
- template: "<h5 class=\"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",
2020
+ template: "<h5 class=\"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",
1960
2021
  changeDetection: core.ChangeDetectionStrategy.OnPush,
1961
2022
  styles: [":host{display:block}.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}"]
1962
2023
  }),
@@ -2136,8 +2197,10 @@
2136
2197
  }());
2137
2198
 
2138
2199
  /**
2200
+ * @deprecated: use {@link tuiGenerateRoutes} instead
2139
2201
  * Generates typical page routing structure
2140
2202
  */
2203
+ // eslint-disable-next-line @typescript-eslint/naming-convention
2141
2204
  function generateRoutes(type) {
2142
2205
  return [
2143
2206
  {
@@ -2152,12 +2215,14 @@
2152
2215
  },
2153
2216
  ];
2154
2217
  }
2218
+ var tuiGenerateRoutes = generateRoutes;
2155
2219
 
2156
2220
  exports.DEMO_TEXTS = DEMO_TEXTS;
2157
2221
  exports.DOC_TEXTS = DOC_TEXTS;
2158
2222
  exports.EXAMPLE_TEXTS = EXAMPLE_TEXTS;
2159
2223
  exports.ScrollIntoViewDirective = ScrollIntoViewDirective;
2160
2224
  exports.ScrollIntoViewModule = ScrollIntoViewModule;
2225
+ exports.TUI_DOC_CODE_ACTIONS = TUI_DOC_CODE_ACTIONS;
2161
2226
  exports.TUI_DOC_CODE_EDITOR = TUI_DOC_CODE_EDITOR;
2162
2227
  exports.TUI_DOC_DEFAULT_TABS = TUI_DOC_DEFAULT_TABS;
2163
2228
  exports.TUI_DOC_DEMO_TEXTS = TUI_DOC_DEMO_TEXTS;
@@ -2167,7 +2232,9 @@
2167
2232
  exports.TUI_DOC_LOGO = TUI_DOC_LOGO;
2168
2233
  exports.TUI_DOC_MENU_TEXT = TUI_DOC_MENU_TEXT;
2169
2234
  exports.TUI_DOC_PAGES = TUI_DOC_PAGES;
2235
+ exports.TUI_DOC_PAGE_LOADED = TUI_DOC_PAGE_LOADED;
2170
2236
  exports.TUI_DOC_RUSSIAN = TUI_DOC_RUSSIAN;
2237
+ exports.TUI_DOC_SCROLL_BEHAVIOR = TUI_DOC_SCROLL_BEHAVIOR;
2171
2238
  exports.TUI_DOC_SEARCH_TEXT = TUI_DOC_SEARCH_TEXT;
2172
2239
  exports.TUI_DOC_SEE_ALSO = TUI_DOC_SEE_ALSO;
2173
2240
  exports.TUI_DOC_SEE_ALSO_TEXT = TUI_DOC_SEE_ALSO_TEXT;
@@ -2201,6 +2268,11 @@
2201
2268
  exports.rawLoad = rawLoad;
2202
2269
  exports.rawLoadRecord = rawLoadRecord;
2203
2270
  exports.tryParseMarkdownCodeBlock = tryParseMarkdownCodeBlock;
2271
+ exports.tuiCoerceValue = tuiCoerceValue;
2272
+ exports.tuiGenerateRoutes = tuiGenerateRoutes;
2273
+ exports.tuiRawLoad = tuiRawLoad;
2274
+ exports.tuiRawLoadRecord = tuiRawLoadRecord;
2275
+ exports.tuiTryParseMarkdownCodeBlock = tuiTryParseMarkdownCodeBlock;
2204
2276
  exports.ɵa = TuiInputOpacityModule;
2205
2277
  exports.ɵb = TuiInputOpacityDirective;
2206
2278
  exports.ɵc = TuiDocExampleGetTabsPipe;