@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.
- package/bundles/taiga-ui-addon-doc.umd.js +98 -26
- package/bundles/taiga-ui-addon-doc.umd.js.map +1 -1
- package/bundles/taiga-ui-addon-doc.umd.min.js +1 -1
- package/bundles/taiga-ui-addon-doc.umd.min.js.map +1 -1
- package/components/code/parse-code-block.d.ts +4 -0
- package/components/example/example.component.d.ts +2 -1
- package/components/navigation/navigation.component.d.ts +4 -1
- package/directives/scroll-into-view/scroll-into-view.directive.d.ts +3 -1
- package/esm2015/components/code/code.component.js +2 -2
- package/esm2015/components/code/parse-code-block.js +6 -1
- package/esm2015/components/demo/demo.component.js +2 -2
- package/esm2015/components/documentation/documentation.component.js +2 -2
- package/esm2015/components/example/example.component.js +10 -6
- package/esm2015/components/navigation/navigation.component.js +22 -12
- package/esm2015/components/navigation/navigation.providers.js +4 -1
- package/esm2015/components/page/page.component.js +2 -2
- package/esm2015/components/page/page.providers.js +2 -1
- package/esm2015/directives/scroll-into-view/scroll-into-view.directive.js +13 -9
- package/esm2015/internal/see-also/see-also.component.js +2 -2
- package/esm2015/public-api.js +4 -1
- package/esm2015/tokens/code-actions.js +5 -0
- package/esm2015/tokens/page-loaded.js +5 -0
- package/esm2015/tokens/scroll-behavior.js +3 -0
- package/esm2015/utils/coerce-value.js +7 -2
- package/esm2015/utils/color-conversion.js +10 -1
- package/esm2015/utils/generate-routes.js +4 -1
- package/esm2015/utils/inspect.js +4 -1
- package/esm2015/utils/raw-load-record.js +6 -1
- package/esm2015/utils/raw-load.js +6 -1
- package/esm2015/utils/transliterate-keyboard-layout.js +4 -1
- package/esm5/components/code/code.component.js +2 -2
- package/esm5/components/code/parse-code-block.js +6 -1
- package/esm5/components/demo/demo.component.js +2 -2
- package/esm5/components/documentation/documentation.component.js +2 -2
- package/esm5/components/example/example.component.js +10 -6
- package/esm5/components/navigation/navigation.component.js +22 -12
- package/esm5/components/navigation/navigation.providers.js +4 -1
- package/esm5/components/page/page.component.js +2 -2
- package/esm5/components/page/page.providers.js +2 -1
- package/esm5/directives/scroll-into-view/scroll-into-view.directive.js +13 -9
- package/esm5/internal/see-also/see-also.component.js +2 -2
- package/esm5/public-api.js +4 -1
- package/esm5/tokens/code-actions.js +5 -0
- package/esm5/tokens/page-loaded.js +5 -0
- package/esm5/tokens/scroll-behavior.js +3 -0
- package/esm5/utils/coerce-value.js +7 -2
- package/esm5/utils/color-conversion.js +10 -1
- package/esm5/utils/generate-routes.js +4 -1
- package/esm5/utils/inspect.js +4 -1
- package/esm5/utils/raw-load-record.js +6 -1
- package/esm5/utils/raw-load.js +6 -1
- package/esm5/utils/transliterate-keyboard-layout.js +4 -1
- package/fesm2015/taiga-ui-addon-doc.js +93 -29
- package/fesm2015/taiga-ui-addon-doc.js.map +1 -1
- package/fesm5/taiga-ui-addon-doc.js +93 -29
- package/fesm5/taiga-ui-addon-doc.js.map +1 -1
- package/package.json +5 -5
- package/public-api.d.ts +3 -0
- package/taiga-ui-addon-doc.metadata.json +1 -1
- package/tokens/code-actions.d.ts +4 -0
- package/tokens/page-loaded.d.ts +3 -0
- package/tokens/scroll-behavior.d.ts +2 -0
- package/utils/coerce-value.d.ts +4 -0
- package/utils/color-conversion.d.ts +7 -0
- package/utils/generate-routes.d.ts +2 -0
- package/utils/inspect.d.ts +2 -0
- package/utils/raw-load-record.d.ts +4 -0
- package/utils/raw-load.d.ts +4 -0
- 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
|
|
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
|
-
|
|
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
|
|
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
|
|
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-
|
|
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.
|
|
1345
|
-
this.scroll$
|
|
1346
|
-
|
|
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
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
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:
|
|
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
|
|
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
|
|
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;
|