@taiga-ui/kit 4.44.0-canary.09b0f40 → 4.44.0-canary.e6f9a42
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/components/preview/index.d.ts +2 -2
- package/components/preview/preview.d.ts +1 -1
- package/components/slider/helpers/slider-thumb-label.component.d.ts +1 -1
- package/esm2022/components/breadcrumbs/breadcrumbs.component.mjs +3 -3
- package/esm2022/components/files/file/file.component.mjs +4 -5
- package/esm2022/components/input-chip/input-chip.directive.mjs +2 -6
- package/esm2022/components/input-number/step/input-number-step.component.mjs +3 -3
- package/esm2022/components/pagination/pagination.component.mjs +3 -3
- package/esm2022/components/preview/{preview-action → action}/preview-action.directive.mjs +1 -1
- package/esm2022/components/preview/dialog/index.mjs +4 -0
- package/esm2022/components/preview/{preview-dialog → dialog}/preview-dialog.component.mjs +1 -1
- package/esm2022/components/preview/{preview-dialog → dialog}/preview-dialog.directive.mjs +1 -1
- package/esm2022/components/preview/{preview-dialog → dialog}/preview-dialog.service.mjs +1 -1
- package/esm2022/components/preview/dialog/taiga-ui-kit-components-preview-dialog.mjs +5 -0
- package/esm2022/components/preview/index.mjs +3 -3
- package/esm2022/components/preview/pagination/preview-pagination.component.mjs +4 -4
- package/esm2022/components/preview/preview.component.mjs +2 -2
- package/esm2022/components/preview/preview.mjs +2 -2
- package/esm2022/components/preview/zoom/preview-zoom.component.mjs +4 -4
- package/esm2022/components/push/push.component.mjs +3 -3
- package/esm2022/components/rating/rating.component.mjs +3 -3
- package/esm2022/components/slider/helpers/slider-thumb-label.component.mjs +5 -4
- package/esm2022/components/slider/slider.component.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-breadcrumbs.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-files.mjs +3 -4
- package/fesm2022/taiga-ui-kit-components-files.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-input-chip.mjs +1 -5
- package/fesm2022/taiga-ui-kit-components-input-chip.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-input-number.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-input-number.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-pagination.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-pagination.mjs.map +1 -1
- package/fesm2022/{taiga-ui-kit-components-preview-preview-dialog.mjs → taiga-ui-kit-components-preview-dialog.mjs} +1 -1
- package/fesm2022/taiga-ui-kit-components-preview-dialog.mjs.map +1 -0
- package/fesm2022/taiga-ui-kit-components-preview.mjs +63 -63
- package/fesm2022/taiga-ui-kit-components-preview.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-push.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-push.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-rating.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-rating.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-slider.mjs +6 -5
- package/fesm2022/taiga-ui-kit-components-slider.mjs.map +1 -1
- package/package.json +6 -6
- package/esm2022/components/preview/preview-dialog/index.mjs +0 -4
- package/esm2022/components/preview/preview-dialog/taiga-ui-kit-components-preview-preview-dialog.mjs +0 -5
- package/fesm2022/taiga-ui-kit-components-preview-preview-dialog.mjs.map +0 -1
- /package/components/preview/{preview-action → action}/preview-action.directive.d.ts +0 -0
- /package/components/preview/{preview-dialog → dialog}/index.d.ts +0 -0
- /package/components/preview/{preview-dialog → dialog}/preview-dialog.component.d.ts +0 -0
- /package/components/preview/{preview-dialog → dialog}/preview-dialog.directive.d.ts +0 -0
- /package/components/preview/{preview-dialog → dialog}/preview-dialog.service.d.ts +0 -0
|
@@ -17,14 +17,14 @@ class TuiPushComponent {
|
|
|
17
17
|
this.close = new EventEmitter();
|
|
18
18
|
}
|
|
19
19
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiPushComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiPushComponent, isStandalone: true, selector: "tui-push", inputs: { heading: "heading", type: "type", lines: "lines", timestamp: "timestamp" }, outputs: { close: "close" }, host: { properties: { "style.--t-lines": "lines" } }, providers: [tuiButtonOptionsProvider({ size: 's', appearance: 'secondary' })], ngImport: i0, template: "<div class=\"t-image\">\n <ng-content select=\"img\" />\n</div>\n<button\n *ngIf=\"close.observed\"\n appearance=\"\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-close\"\n [iconStart]=\"icons.close\"\n [style.border-radius.%]=\"100\"\n (click)=\"close.emit()\"\n>\n {{ closeWord$ | async }}\n</button>\n<div class=\"t-top\">\n <span class=\"t-icon\">\n <ng-content select=\"tui-svg,tui-icon\" />\n </span>\n {{ type }}\n <span\n *ngIf=\"timestamp\"\n class=\"t-time\"\n [textContent]=\"isString(timestamp) ? timestamp : (timestamp | tuiFormatDate | async)\"\n ></span>\n</div>\n<h3\n automation-id=\"tui-push__heading\"\n class=\"t-heading\"\n>\n {{ heading }}\n</h3>\n<div class=\"t-content\">\n <ng-content />\n</div>\n<div class=\"t-actions\">\n <span class=\"t-button\">\n <ng-content select=\"[tuiButton]\" />\n </span>\n <span class=\"t-link\">\n <ng-content select=\"[tuiLink]\" />\n </span>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:22.5rem;max-inline-size:100%;box-sizing:border-box;padding:1.25rem 1.25rem .25rem;overflow:hidden;font:var(--tui-font-text-m);border-radius:var(--tui-radius-xl);background:var(--tui-background-elevation-2);box-shadow:var(--tui-shadow-small)}.t-image{display:flex;flex-direction:column;max-block-size:10.625rem;overflow:hidden;margin:-1.25rem -1.25rem 1.25rem}.t-close{position:absolute;top:.75rem;right:.75rem;color:#0000008a;background:#f2f2f252;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}.t-top{display:flex;align-items:center;font:var(--tui-font-text-s);color:var(--tui-text-secondary)}.t-icon{block-size:1.25rem;margin-inline-end:.5rem;transform:scale(.833);transform-origin:top left;color:var(--tui-text-action)}.t-time:before{content:\"\\2022\";display:inline-block;inline-size:1rem;text-align:center}.t-heading{line-height:1.25rem;font-weight:700;margin:.75rem 0 .25rem}.t-heading,.t-content{display:-webkit-box;-webkit-box-orient:block-axis;-webkit-line-clamp:var(--t-lines);word-break:break-word;overflow:hidden}.t-actions{display:flex;align-items:center;font:var(--tui-font-text-s)}.t-button:not(:empty){margin:.75rem .75rem .75rem 0}.t-link{margin:.75rem 0}.t-link:empty{margin:.5rem}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "pipe", type: TuiFormatDatePipe, name: "tuiFormatDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiPushComponent, isStandalone: true, selector: "tui-push", inputs: { heading: "heading", type: "type", lines: "lines", timestamp: "timestamp" }, outputs: { close: "close" }, host: { properties: { "style.--t-lines": "lines" } }, providers: [tuiButtonOptionsProvider({ size: 's', appearance: 'secondary' })], ngImport: i0, template: "<div class=\"t-image\">\n <ng-content select=\"img\" />\n</div>\n<button\n *ngIf=\"close.observed\"\n appearance=\"\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-close\"\n [iconStart]=\"icons.close\"\n [style.border-radius.%]=\"100\"\n (click)=\"close.emit()\"\n>\n {{ closeWord$ | async }}\n</button>\n<div class=\"t-top\">\n <span class=\"t-icon\">\n <ng-content select=\"tui-svg,tui-icon\" />\n </span>\n {{ type }}\n <span\n *ngIf=\"timestamp\"\n class=\"t-time\"\n [textContent]=\"isString(timestamp) ? timestamp : (timestamp | tuiFormatDate | async)\"\n ></span>\n</div>\n<h3\n automation-id=\"tui-push__heading\"\n class=\"t-heading\"\n>\n {{ heading }}\n</h3>\n<div class=\"t-content\">\n <ng-content />\n</div>\n<div class=\"t-actions\">\n <span class=\"t-button\">\n <ng-content select=\"[tuiButton]\" />\n </span>\n <span class=\"t-link\">\n <ng-content select=\"[tuiLink]\" />\n </span>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:22.5rem;max-inline-size:100%;box-sizing:border-box;padding:1.25rem 1.25rem .25rem;overflow:hidden;font:var(--tui-font-text-m);border-radius:var(--tui-radius-xl);background:var(--tui-background-elevation-2);box-shadow:var(--tui-shadow-small)}.t-image{display:flex;flex-direction:column;max-block-size:10.625rem;overflow:hidden;margin:-1.25rem -1.25rem 1.25rem}.t-close{position:absolute;top:.75rem;right:.75rem;color:#0000008a;background:#f2f2f252;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}@supports (inset-inline-end: 0){.t-close{right:unset;inset-inline-end:.75rem}}.t-top{display:flex;align-items:center;font:var(--tui-font-text-s);color:var(--tui-text-secondary)}.t-icon{block-size:1.25rem;margin-inline-end:.5rem;transform:scale(.833);transform-origin:top left;color:var(--tui-text-action)}.t-time:before{content:\"\\2022\";display:inline-block;inline-size:1rem;text-align:center}.t-heading{line-height:1.25rem;font-weight:700;margin:.75rem 0 .25rem}.t-heading,.t-content{display:-webkit-box;-webkit-box-orient:block-axis;-webkit-line-clamp:var(--t-lines);word-break:break-word;overflow:hidden}.t-actions{display:flex;align-items:center;font:var(--tui-font-text-s)}.t-button:not(:empty){margin:.75rem .75rem .75rem 0}.t-link{margin:.75rem 0}.t-link:empty{margin:.5rem}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "pipe", type: TuiFormatDatePipe, name: "tuiFormatDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
21
21
|
}
|
|
22
22
|
export { TuiPushComponent };
|
|
23
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiPushComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
25
|
args: [{ standalone: true, selector: 'tui-push', imports: [AsyncPipe, NgIf, TuiButton, TuiFormatDatePipe], changeDetection: ChangeDetectionStrategy.OnPush, providers: [tuiButtonOptionsProvider({ size: 's', appearance: 'secondary' })], host: {
|
|
26
26
|
'[style.--t-lines]': 'lines',
|
|
27
|
-
}, template: "<div class=\"t-image\">\n <ng-content select=\"img\" />\n</div>\n<button\n *ngIf=\"close.observed\"\n appearance=\"\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-close\"\n [iconStart]=\"icons.close\"\n [style.border-radius.%]=\"100\"\n (click)=\"close.emit()\"\n>\n {{ closeWord$ | async }}\n</button>\n<div class=\"t-top\">\n <span class=\"t-icon\">\n <ng-content select=\"tui-svg,tui-icon\" />\n </span>\n {{ type }}\n <span\n *ngIf=\"timestamp\"\n class=\"t-time\"\n [textContent]=\"isString(timestamp) ? timestamp : (timestamp | tuiFormatDate | async)\"\n ></span>\n</div>\n<h3\n automation-id=\"tui-push__heading\"\n class=\"t-heading\"\n>\n {{ heading }}\n</h3>\n<div class=\"t-content\">\n <ng-content />\n</div>\n<div class=\"t-actions\">\n <span class=\"t-button\">\n <ng-content select=\"[tuiButton]\" />\n </span>\n <span class=\"t-link\">\n <ng-content select=\"[tuiLink]\" />\n </span>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:22.5rem;max-inline-size:100%;box-sizing:border-box;padding:1.25rem 1.25rem .25rem;overflow:hidden;font:var(--tui-font-text-m);border-radius:var(--tui-radius-xl);background:var(--tui-background-elevation-2);box-shadow:var(--tui-shadow-small)}.t-image{display:flex;flex-direction:column;max-block-size:10.625rem;overflow:hidden;margin:-1.25rem -1.25rem 1.25rem}.t-close{position:absolute;top:.75rem;right:.75rem;color:#0000008a;background:#f2f2f252;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}.t-top{display:flex;align-items:center;font:var(--tui-font-text-s);color:var(--tui-text-secondary)}.t-icon{block-size:1.25rem;margin-inline-end:.5rem;transform:scale(.833);transform-origin:top left;color:var(--tui-text-action)}.t-time:before{content:\"\\2022\";display:inline-block;inline-size:1rem;text-align:center}.t-heading{line-height:1.25rem;font-weight:700;margin:.75rem 0 .25rem}.t-heading,.t-content{display:-webkit-box;-webkit-box-orient:block-axis;-webkit-line-clamp:var(--t-lines);word-break:break-word;overflow:hidden}.t-actions{display:flex;align-items:center;font:var(--tui-font-text-s)}.t-button:not(:empty){margin:.75rem .75rem .75rem 0}.t-link{margin:.75rem 0}.t-link:empty{margin:.5rem}\n"] }]
|
|
27
|
+
}, template: "<div class=\"t-image\">\n <ng-content select=\"img\" />\n</div>\n<button\n *ngIf=\"close.observed\"\n appearance=\"\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-close\"\n [iconStart]=\"icons.close\"\n [style.border-radius.%]=\"100\"\n (click)=\"close.emit()\"\n>\n {{ closeWord$ | async }}\n</button>\n<div class=\"t-top\">\n <span class=\"t-icon\">\n <ng-content select=\"tui-svg,tui-icon\" />\n </span>\n {{ type }}\n <span\n *ngIf=\"timestamp\"\n class=\"t-time\"\n [textContent]=\"isString(timestamp) ? timestamp : (timestamp | tuiFormatDate | async)\"\n ></span>\n</div>\n<h3\n automation-id=\"tui-push__heading\"\n class=\"t-heading\"\n>\n {{ heading }}\n</h3>\n<div class=\"t-content\">\n <ng-content />\n</div>\n<div class=\"t-actions\">\n <span class=\"t-button\">\n <ng-content select=\"[tuiButton]\" />\n </span>\n <span class=\"t-link\">\n <ng-content select=\"[tuiLink]\" />\n </span>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:22.5rem;max-inline-size:100%;box-sizing:border-box;padding:1.25rem 1.25rem .25rem;overflow:hidden;font:var(--tui-font-text-m);border-radius:var(--tui-radius-xl);background:var(--tui-background-elevation-2);box-shadow:var(--tui-shadow-small)}.t-image{display:flex;flex-direction:column;max-block-size:10.625rem;overflow:hidden;margin:-1.25rem -1.25rem 1.25rem}.t-close{position:absolute;top:.75rem;right:.75rem;color:#0000008a;background:#f2f2f252;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}@supports (inset-inline-end: 0){.t-close{right:unset;inset-inline-end:.75rem}}.t-top{display:flex;align-items:center;font:var(--tui-font-text-s);color:var(--tui-text-secondary)}.t-icon{block-size:1.25rem;margin-inline-end:.5rem;transform:scale(.833);transform-origin:top left;color:var(--tui-text-action)}.t-time:before{content:\"\\2022\";display:inline-block;inline-size:1rem;text-align:center}.t-heading{line-height:1.25rem;font-weight:700;margin:.75rem 0 .25rem}.t-heading,.t-content{display:-webkit-box;-webkit-box-orient:block-axis;-webkit-line-clamp:var(--t-lines);word-break:break-word;overflow:hidden}.t-actions{display:flex;align-items:center;font:var(--tui-font-text-s)}.t-button:not(:empty){margin:.75rem .75rem .75rem 0}.t-link{margin:.75rem 0}.t-link:empty{margin:.5rem}\n"] }]
|
|
28
28
|
}], propDecorators: { heading: [{
|
|
29
29
|
type: Input
|
|
30
30
|
}], type: [{
|
|
@@ -36,4 +36,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
36
36
|
}], close: [{
|
|
37
37
|
type: Output
|
|
38
38
|
}] } });
|
|
39
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
39
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVzaC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9raXQvY29tcG9uZW50cy9wdXNoL3B1c2guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2l0L2NvbXBvbmVudHMvcHVzaC9wdXNoLnRlbXBsYXRlLmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxJQUFJLEVBQUMsTUFBTSxpQkFBaUIsQ0FBQztBQUNoRCxPQUFPLEVBQ0gsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxZQUFZLEVBQ1osTUFBTSxFQUNOLEtBQUssRUFDTCxNQUFNLEdBQ1QsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLFdBQVcsRUFBQyxNQUFNLG1DQUFtQyxDQUFDO0FBQzlELE9BQU8sRUFBQyxTQUFTLEVBQUUsd0JBQXdCLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQztBQUNyRixPQUFPLEVBQUMsaUJBQWlCLEVBQUMsTUFBTSxrQ0FBa0MsQ0FBQztBQUNuRSxPQUFPLEVBQUMsY0FBYyxFQUFFLGdCQUFnQixFQUFDLE1BQU0sdUJBQXVCLENBQUM7O0FBRXZFLE1BWWEsZ0JBQWdCO0lBWjdCO1FBYXVCLGFBQVEsR0FBRyxXQUFXLENBQUM7UUFDdkIsZUFBVSxHQUFHLE1BQU0sQ0FBQyxjQUFjLENBQUMsQ0FBQztRQUNwQyxVQUFLLEdBQUcsTUFBTSxDQUFDLGdCQUFnQixDQUFDLENBQUM7UUFHN0MsWUFBTyxHQUFHLEVBQUUsQ0FBQztRQUdiLFNBQUksR0FBRyxFQUFFLENBQUM7UUFHVixVQUFLLEdBQUcsQ0FBQyxDQUFDO1FBR1YsY0FBUyxHQUFvQixFQUFFLENBQUM7UUFHdkIsVUFBSyxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7S0FDcEQ7K0dBbkJZLGdCQUFnQjttR0FBaEIsZ0JBQWdCLGdPQUxkLENBQUMsd0JBQXdCLENBQUMsRUFBQyxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxXQUFXLEVBQUMsQ0FBQyxDQUFDLDBCQ3JCL0UsZ2hDQTRDQSxxM0NEM0JjLFNBQVMsOENBQUUsSUFBSSw2RkFBRSxTQUFTLCtIQUFFLGlCQUFpQjs7U0FTOUMsZ0JBQWdCOzRGQUFoQixnQkFBZ0I7a0JBWjVCLFNBQVM7aUNBQ00sSUFBSSxZQUNOLFVBQVUsV0FDWCxDQUFDLFNBQVMsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLGlCQUFpQixDQUFDLG1CQUd2Qyx1QkFBdUIsQ0FBQyxNQUFNLGFBQ3BDLENBQUMsd0JBQXdCLENBQUMsRUFBQyxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxXQUFXLEVBQUMsQ0FBQyxDQUFDLFFBQ3JFO3dCQUNGLG1CQUFtQixFQUFFLE9BQU87cUJBQy9COzhCQVFNLE9BQU87c0JBRGIsS0FBSztnQkFJQyxJQUFJO3NCQURWLEtBQUs7Z0JBSUMsS0FBSztzQkFEWCxLQUFLO2dCQUlDLFNBQVM7c0JBRGYsS0FBSztnQkFJVSxLQUFLO3NCQURwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtBc3luY1BpcGUsIE5nSWZ9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBFdmVudEVtaXR0ZXIsXG4gICAgaW5qZWN0LFxuICAgIElucHV0LFxuICAgIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge3R1aUlzU3RyaW5nfSBmcm9tICdAdGFpZ2EtdWkvY2RrL3V0aWxzL21pc2NlbGxhbmVvdXMnO1xuaW1wb3J0IHtUdWlCdXR0b24sIHR1aUJ1dHRvbk9wdGlvbnNQcm92aWRlcn0gZnJvbSAnQHRhaWdhLXVpL2NvcmUvY29tcG9uZW50cy9idXR0b24nO1xuaW1wb3J0IHtUdWlGb3JtYXREYXRlUGlwZX0gZnJvbSAnQHRhaWdhLXVpL2NvcmUvcGlwZXMvZm9ybWF0LWRhdGUnO1xuaW1wb3J0IHtUVUlfQ0xPU0VfV09SRCwgVFVJX0NPTU1PTl9JQ09OU30gZnJvbSAnQHRhaWdhLXVpL2NvcmUvdG9rZW5zJztcblxuQENvbXBvbmVudCh7XG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBzZWxlY3RvcjogJ3R1aS1wdXNoJyxcbiAgICBpbXBvcnRzOiBbQXN5bmNQaXBlLCBOZ0lmLCBUdWlCdXR0b24sIFR1aUZvcm1hdERhdGVQaXBlXSxcbiAgICB0ZW1wbGF0ZVVybDogJy4vcHVzaC50ZW1wbGF0ZS5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9wdXNoLnN0eWxlLmxlc3MnXSxcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgICBwcm92aWRlcnM6IFt0dWlCdXR0b25PcHRpb25zUHJvdmlkZXIoe3NpemU6ICdzJywgYXBwZWFyYW5jZTogJ3NlY29uZGFyeSd9KV0sXG4gICAgaG9zdDoge1xuICAgICAgICAnW3N0eWxlLi0tdC1saW5lc10nOiAnbGluZXMnLFxuICAgIH0sXG59KVxuZXhwb3J0IGNsYXNzIFR1aVB1c2hDb21wb25lbnQge1xuICAgIHByb3RlY3RlZCByZWFkb25seSBpc1N0cmluZyA9IHR1aUlzU3RyaW5nO1xuICAgIHByb3RlY3RlZCByZWFkb25seSBjbG9zZVdvcmQkID0gaW5qZWN0KFRVSV9DTE9TRV9XT1JEKTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgaWNvbnMgPSBpbmplY3QoVFVJX0NPTU1PTl9JQ09OUyk7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBoZWFkaW5nID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyB0eXBlID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBsaW5lcyA9IDI7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyB0aW1lc3RhbXA6IG51bWJlciB8IHN0cmluZyA9ICcnO1xuXG4gICAgQE91dHB1dCgpXG4gICAgcHVibGljIHJlYWRvbmx5IGNsb3NlID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xufVxuIiwiPGRpdiBjbGFzcz1cInQtaW1hZ2VcIj5cbiAgICA8bmctY29udGVudCBzZWxlY3Q9XCJpbWdcIiAvPlxuPC9kaXY+XG48YnV0dG9uXG4gICAgKm5nSWY9XCJjbG9zZS5vYnNlcnZlZFwiXG4gICAgYXBwZWFyYW5jZT1cIlwiXG4gICAgc2l6ZT1cInhzXCJcbiAgICB0dWlJY29uQnV0dG9uXG4gICAgdHlwZT1cImJ1dHRvblwiXG4gICAgY2xhc3M9XCJ0LWNsb3NlXCJcbiAgICBbaWNvblN0YXJ0XT1cImljb25zLmNsb3NlXCJcbiAgICBbc3R5bGUuYm9yZGVyLXJhZGl1cy4lXT1cIjEwMFwiXG4gICAgKGNsaWNrKT1cImNsb3NlLmVtaXQoKVwiXG4+XG4gICAge3sgY2xvc2VXb3JkJCB8IGFzeW5jIH19XG48L2J1dHRvbj5cbjxkaXYgY2xhc3M9XCJ0LXRvcFwiPlxuICAgIDxzcGFuIGNsYXNzPVwidC1pY29uXCI+XG4gICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cInR1aS1zdmcsdHVpLWljb25cIiAvPlxuICAgIDwvc3Bhbj5cbiAgICB7eyB0eXBlIH19XG4gICAgPHNwYW5cbiAgICAgICAgKm5nSWY9XCJ0aW1lc3RhbXBcIlxuICAgICAgICBjbGFzcz1cInQtdGltZVwiXG4gICAgICAgIFt0ZXh0Q29udGVudF09XCJpc1N0cmluZyh0aW1lc3RhbXApID8gdGltZXN0YW1wIDogKHRpbWVzdGFtcCB8IHR1aUZvcm1hdERhdGUgfCBhc3luYylcIlxuICAgID48L3NwYW4+XG48L2Rpdj5cbjxoM1xuICAgIGF1dG9tYXRpb24taWQ9XCJ0dWktcHVzaF9faGVhZGluZ1wiXG4gICAgY2xhc3M9XCJ0LWhlYWRpbmdcIlxuPlxuICAgIHt7IGhlYWRpbmcgfX1cbjwvaDM+XG48ZGl2IGNsYXNzPVwidC1jb250ZW50XCI+XG4gICAgPG5nLWNvbnRlbnQgLz5cbjwvZGl2PlxuPGRpdiBjbGFzcz1cInQtYWN0aW9uc1wiPlxuICAgIDxzcGFuIGNsYXNzPVwidC1idXR0b25cIj5cbiAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW3R1aUJ1dHRvbl1cIiAvPlxuICAgIDwvc3Bhbj5cbiAgICA8c3BhbiBjbGFzcz1cInQtbGlua1wiPlxuICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbdHVpTGlua11cIiAvPlxuICAgIDwvc3Bhbj5cbjwvZGl2PlxuIl19
|
|
@@ -43,7 +43,7 @@ class TuiRating extends TuiControl {
|
|
|
43
43
|
: 0;
|
|
44
44
|
}
|
|
45
45
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiRating, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
46
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiRating, isStandalone: true, selector: "tui-rating", inputs: { icon: "icon", max: "max" }, host: { listeners: { "keydown.capture": "onKeyDown($event)", "pointerdown": "onPointer(1)", "pointercancel": "onPointer(-1)", "document:pointerup": "onPointer(-1)" }, properties: { "class._disabled": "disabled()", "class._readonly": "readOnly()", "class._active": "active" } }, providers: [tuiFallbackValueProvider(0)], usesInheritance: true, ngImport: i0, template: "<input\n min=\"1\"\n type=\"range\"\n class=\"t-range\"\n [attr.aria-disabled]=\"readOnly()\"\n [disabled]=\"disabled()\"\n [max]=\"max\"\n [ngModel]=\"value()\"\n [ngModelOptions]=\"{standalone: true}\"\n (blur)=\"onTouched()\"\n (ngModelChange)=\"onChange($event)\"\n/>\n<div class=\"t-items\">\n <div\n *tuiRepeatTimes=\"let index of max\"\n class=\"t-item\"\n [class.t-item_active]=\"isActive(index)\"\n (pointerup)=\"onClick(max - index)\"\n >\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon t-icon_blank\"\n [class.t-icon_fraction]=\"isFraction(index)\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"100 - getCut(index)\"\n />\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"getCut(index)\"\n />\n </div>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;min-inline-size:-webkit-fit-content;min-inline-size:-moz-fit-content;min-inline-size:fit-content;font-size:1rem;color:var(--tui-chart-categorical-12);cursor:pointer;-webkit-user-select:none;user-select:none}:host._readonly{pointer-events:none}:host._disabled{pointer-events:none;opacity:var(--tui-disabled-opacity)}.t-range{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;opacity:0;box-sizing:border-box;padding:0 .75em;pointer-events:none}.t-range:focus-visible+.t-items{box-shadow:inset 0 0 0 .125rem var(--tui-border-focus)}.t-items{position:relative;display:flex;flex-direction:row-reverse}.t-items:hover .t-icon{clip-path:inset(0 0 0 0)}.t-items:hover .t-icon_blank{clip-path:inset(0 0 0 100%)}.t-item{position:relative;flex:1 0 0;color:var(--tui-text-tertiary);transition-property:color,transform;transition-duration:var(--tui-duration);transition-timing-function:ease-in-out,cubic-bezier(.35,1.5,.4,2.5)}.t-item:first-child{max-inline-size:2.5em}.t-item:hover,.t-item:hover~.t-item,.t-items:not(:hover) .t-item_active{color:currentColor}.t-items:active .t-item:hover,.t-items:active .t-item:hover~.t-item{transform:scale(.85);transition-duration:var(--tui-duration),calc(var(--tui-duration) / 3);transition-timing-function:ease-in-out}.t-icon{transition-property:clip-path;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;inline-size:2.5em;block-size:2.5em;font-size:inherit;clip-path:inset(0 var(--t-cut) 0 0)}.t-icon ::ng-deep>*{font-size:1rem}.t-icon_blank{position:absolute;top:0;left:0;display:none;color:var(--tui-text-tertiary);clip-path:inset(0 0 0 var(--t-cut))}.t-icon_fraction{display:block}@media (any-pointer: coarse){:host._active .t-item_active{transform:scale(.85);transition-timing-function:ease-in-out}:host:not(._readonly) .t-range{pointer-events:auto}.t-icon{transition:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: TuiRepeatTimes, selector: "[tuiRepeatTimes][tuiRepeatTimesOf]", inputs: ["tuiRepeatTimesOf"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
46
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiRating, isStandalone: true, selector: "tui-rating", inputs: { icon: "icon", max: "max" }, host: { listeners: { "keydown.capture": "onKeyDown($event)", "pointerdown": "onPointer(1)", "pointercancel": "onPointer(-1)", "document:pointerup": "onPointer(-1)" }, properties: { "class._disabled": "disabled()", "class._readonly": "readOnly()", "class._active": "active" } }, providers: [tuiFallbackValueProvider(0)], usesInheritance: true, ngImport: i0, template: "<input\n min=\"1\"\n type=\"range\"\n class=\"t-range\"\n [attr.aria-disabled]=\"readOnly()\"\n [disabled]=\"disabled()\"\n [max]=\"max\"\n [ngModel]=\"value()\"\n [ngModelOptions]=\"{standalone: true}\"\n (blur)=\"onTouched()\"\n (ngModelChange)=\"onChange($event)\"\n/>\n<div class=\"t-items\">\n <div\n *tuiRepeatTimes=\"let index of max\"\n class=\"t-item\"\n [class.t-item_active]=\"isActive(index)\"\n (pointerup)=\"onClick(max - index)\"\n >\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon t-icon_blank\"\n [class.t-icon_fraction]=\"isFraction(index)\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"100 - getCut(index)\"\n />\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"getCut(index)\"\n />\n </div>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;min-inline-size:-webkit-fit-content;min-inline-size:-moz-fit-content;min-inline-size:fit-content;font-size:1rem;color:var(--tui-chart-categorical-12);cursor:pointer;-webkit-user-select:none;user-select:none}:host._readonly{pointer-events:none}:host._disabled{pointer-events:none;opacity:var(--tui-disabled-opacity)}.t-range{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;opacity:0;box-sizing:border-box;padding:0 .75em;pointer-events:none}.t-range:focus-visible+.t-items{box-shadow:inset 0 0 0 .125rem var(--tui-border-focus)}.t-items{position:relative;display:flex;flex-direction:row-reverse}.t-items:hover .t-icon{clip-path:inset(0 0 0 0)}.t-items:hover .t-icon_blank{clip-path:inset(0 0 0 100%)}.t-item{position:relative;flex:1 0 0;color:var(--tui-text-tertiary);transition-property:color,transform;transition-duration:var(--tui-duration);transition-timing-function:ease-in-out,cubic-bezier(.35,1.5,.4,2.5)}.t-item:first-child{max-inline-size:2.5em}.t-item:hover,.t-item:hover~.t-item,.t-items:not(:hover) .t-item_active{color:currentColor}.t-items:active .t-item:hover,.t-items:active .t-item:hover~.t-item{transform:scale(.85);transition-duration:var(--tui-duration),calc(var(--tui-duration) / 3);transition-timing-function:ease-in-out}.t-icon{transition-property:clip-path;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;inline-size:2.5em;block-size:2.5em;font-size:inherit;clip-path:inset(0 var(--t-cut) 0 0)}:host-context([dir=\"rtl\"]) .t-icon{clip-path:inset(0 0 0 var(--t-cut))}.t-icon ::ng-deep>*{font-size:1rem}.t-icon_blank{position:absolute;top:0;left:0;display:none;color:var(--tui-text-tertiary);clip-path:inset(0 0 0 var(--t-cut))}:host-context([dir=\"rtl\"]) .t-icon_blank{clip-path:inset(0 var(--t-cut) 0 0)}.t-icon_fraction{display:block}@media (any-pointer: coarse){:host._active .t-item_active{transform:scale(.85);transition-timing-function:ease-in-out}:host:not(._readonly) .t-range{pointer-events:auto}.t-icon{transition:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "directive", type: TuiRepeatTimes, selector: "[tuiRepeatTimes][tuiRepeatTimesOf]", inputs: ["tuiRepeatTimesOf"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
47
47
|
}
|
|
48
48
|
export { TuiRating };
|
|
49
49
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiRating, decorators: [{
|
|
@@ -56,10 +56,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
56
56
|
'(pointerdown)': 'onPointer(1)',
|
|
57
57
|
'(pointercancel)': 'onPointer(-1)',
|
|
58
58
|
'(document:pointerup)': 'onPointer(-1)',
|
|
59
|
-
}, template: "<input\n min=\"1\"\n type=\"range\"\n class=\"t-range\"\n [attr.aria-disabled]=\"readOnly()\"\n [disabled]=\"disabled()\"\n [max]=\"max\"\n [ngModel]=\"value()\"\n [ngModelOptions]=\"{standalone: true}\"\n (blur)=\"onTouched()\"\n (ngModelChange)=\"onChange($event)\"\n/>\n<div class=\"t-items\">\n <div\n *tuiRepeatTimes=\"let index of max\"\n class=\"t-item\"\n [class.t-item_active]=\"isActive(index)\"\n (pointerup)=\"onClick(max - index)\"\n >\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon t-icon_blank\"\n [class.t-icon_fraction]=\"isFraction(index)\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"100 - getCut(index)\"\n />\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"getCut(index)\"\n />\n </div>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;min-inline-size:-webkit-fit-content;min-inline-size:-moz-fit-content;min-inline-size:fit-content;font-size:1rem;color:var(--tui-chart-categorical-12);cursor:pointer;-webkit-user-select:none;user-select:none}:host._readonly{pointer-events:none}:host._disabled{pointer-events:none;opacity:var(--tui-disabled-opacity)}.t-range{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;opacity:0;box-sizing:border-box;padding:0 .75em;pointer-events:none}.t-range:focus-visible+.t-items{box-shadow:inset 0 0 0 .125rem var(--tui-border-focus)}.t-items{position:relative;display:flex;flex-direction:row-reverse}.t-items:hover .t-icon{clip-path:inset(0 0 0 0)}.t-items:hover .t-icon_blank{clip-path:inset(0 0 0 100%)}.t-item{position:relative;flex:1 0 0;color:var(--tui-text-tertiary);transition-property:color,transform;transition-duration:var(--tui-duration);transition-timing-function:ease-in-out,cubic-bezier(.35,1.5,.4,2.5)}.t-item:first-child{max-inline-size:2.5em}.t-item:hover,.t-item:hover~.t-item,.t-items:not(:hover) .t-item_active{color:currentColor}.t-items:active .t-item:hover,.t-items:active .t-item:hover~.t-item{transform:scale(.85);transition-duration:var(--tui-duration),calc(var(--tui-duration) / 3);transition-timing-function:ease-in-out}.t-icon{transition-property:clip-path;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;inline-size:2.5em;block-size:2.5em;font-size:inherit;clip-path:inset(0 var(--t-cut) 0 0)}.t-icon ::ng-deep>*{font-size:1rem}.t-icon_blank{position:absolute;top:0;left:0;display:none;color:var(--tui-text-tertiary);clip-path:inset(0 0 0 var(--t-cut))}.t-icon_fraction{display:block}@media (any-pointer: coarse){:host._active .t-item_active{transform:scale(.85);transition-timing-function:ease-in-out}:host:not(._readonly) .t-range{pointer-events:auto}.t-icon{transition:none}}\n"] }]
|
|
59
|
+
}, template: "<input\n min=\"1\"\n type=\"range\"\n class=\"t-range\"\n [attr.aria-disabled]=\"readOnly()\"\n [disabled]=\"disabled()\"\n [max]=\"max\"\n [ngModel]=\"value()\"\n [ngModelOptions]=\"{standalone: true}\"\n (blur)=\"onTouched()\"\n (ngModelChange)=\"onChange($event)\"\n/>\n<div class=\"t-items\">\n <div\n *tuiRepeatTimes=\"let index of max\"\n class=\"t-item\"\n [class.t-item_active]=\"isActive(index)\"\n (pointerup)=\"onClick(max - index)\"\n >\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon t-icon_blank\"\n [class.t-icon_fraction]=\"isFraction(index)\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"100 - getCut(index)\"\n />\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: max - index, value: value()}\"\n class=\"t-icon\"\n [icon]=\"src.toString()\"\n [style.--t-cut.%]=\"getCut(index)\"\n />\n </div>\n</div>\n", styles: [":host{position:relative;display:block;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;min-inline-size:-webkit-fit-content;min-inline-size:-moz-fit-content;min-inline-size:fit-content;font-size:1rem;color:var(--tui-chart-categorical-12);cursor:pointer;-webkit-user-select:none;user-select:none}:host._readonly{pointer-events:none}:host._disabled{pointer-events:none;opacity:var(--tui-disabled-opacity)}.t-range{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;opacity:0;box-sizing:border-box;padding:0 .75em;pointer-events:none}.t-range:focus-visible+.t-items{box-shadow:inset 0 0 0 .125rem var(--tui-border-focus)}.t-items{position:relative;display:flex;flex-direction:row-reverse}.t-items:hover .t-icon{clip-path:inset(0 0 0 0)}.t-items:hover .t-icon_blank{clip-path:inset(0 0 0 100%)}.t-item{position:relative;flex:1 0 0;color:var(--tui-text-tertiary);transition-property:color,transform;transition-duration:var(--tui-duration);transition-timing-function:ease-in-out,cubic-bezier(.35,1.5,.4,2.5)}.t-item:first-child{max-inline-size:2.5em}.t-item:hover,.t-item:hover~.t-item,.t-items:not(:hover) .t-item_active{color:currentColor}.t-items:active .t-item:hover,.t-items:active .t-item:hover~.t-item{transform:scale(.85);transition-duration:var(--tui-duration),calc(var(--tui-duration) / 3);transition-timing-function:ease-in-out}.t-icon{transition-property:clip-path;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;inline-size:2.5em;block-size:2.5em;font-size:inherit;clip-path:inset(0 var(--t-cut) 0 0)}:host-context([dir=\"rtl\"]) .t-icon{clip-path:inset(0 0 0 var(--t-cut))}.t-icon ::ng-deep>*{font-size:1rem}.t-icon_blank{position:absolute;top:0;left:0;display:none;color:var(--tui-text-tertiary);clip-path:inset(0 0 0 var(--t-cut))}:host-context([dir=\"rtl\"]) .t-icon_blank{clip-path:inset(0 var(--t-cut) 0 0)}.t-icon_fraction{display:block}@media (any-pointer: coarse){:host._active .t-item_active{transform:scale(.85);transition-timing-function:ease-in-out}:host:not(._readonly) .t-range{pointer-events:auto}.t-icon{transition:none}}\n"] }]
|
|
60
60
|
}], propDecorators: { icon: [{
|
|
61
61
|
type: Input
|
|
62
62
|
}], max: [{
|
|
63
63
|
type: Input
|
|
64
64
|
}] } });
|
|
65
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
65
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmF0aW5nLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2tpdC9jb21wb25lbnRzL3JhdGluZy9yYXRpbmcuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2l0L2NvbXBvbmVudHMvcmF0aW5nL3JhdGluZy50ZW1wbGF0ZS5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxZQUFZLEVBQUMsTUFBTSxpQkFBaUIsQ0FBQztBQUM3QyxPQUFPLEVBQUMsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDaEYsT0FBTyxFQUFDLFdBQVcsRUFBQyxNQUFNLGdCQUFnQixDQUFDO0FBQzNDLE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSx1QkFBdUIsQ0FBQztBQUNqRCxPQUFPLEVBQUMsY0FBYyxFQUFDLE1BQU0sdUNBQXVDLENBQUM7QUFDckUsT0FBTyxFQUFDLHdCQUF3QixFQUFDLE1BQU0sc0JBQXNCLENBQUM7QUFDOUQsT0FBTyxFQUFDLFFBQVEsRUFBQyxNQUFNLDBCQUEwQixDQUFDO0FBQ2xELE9BQU8sRUFBQyxPQUFPLEVBQUMsTUFBTSxnQ0FBZ0MsQ0FBQztBQUN2RCxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSx3QkFBd0IsQ0FBQztBQUcxRCxPQUFPLEVBQUMsa0JBQWtCLEVBQUMsTUFBTSxrQkFBa0IsQ0FBQzs7O0FBRXBELE1Ba0JhLFNBQVUsU0FBUSxVQUFrQjtJQWxCakQ7O1FBbUJxQixZQUFPLEdBQUcsTUFBTSxDQUFDLGtCQUFrQixDQUFDLENBQUM7UUFFNUMsV0FBTSxHQUFHLENBQUMsQ0FBQztRQUdkLFNBQUksR0FBNkIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUM7UUFHbkQsUUFBRyxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDO0tBK0JqQztJQTdCYSxTQUFTLENBQUMsS0FBb0I7UUFDcEMsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFLEVBQUU7WUFDakIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1NBQzFCO0lBQ0wsQ0FBQztJQUVTLFNBQVMsQ0FBQyxLQUFhO1FBQzdCLElBQUksQ0FBQyxNQUFNLEdBQUcsUUFBUSxDQUFDLElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUMsQ0FBQztJQUN0RCxDQUFDO0lBRVMsT0FBTyxDQUFDLEtBQWE7UUFDM0IsSUFBSSxJQUFJLENBQUMsTUFBTSxFQUFFO1lBQ2IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsQ0FBQztTQUN4QjtJQUNMLENBQUM7SUFFUyxRQUFRLENBQUMsS0FBYTtRQUM1QixPQUFPLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDLElBQUksSUFBSSxDQUFDLEdBQUcsR0FBRyxLQUFLLENBQUM7SUFDdkQsQ0FBQztJQUVTLFVBQVUsQ0FBQyxLQUFhO1FBQzlCLE9BQU8sSUFBSSxDQUFDLEtBQUssRUFBRSxHQUFHLElBQUksQ0FBQyxHQUFHLEdBQUcsS0FBSyxHQUFHLENBQUMsSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFLEdBQUcsSUFBSSxDQUFDLEdBQUcsR0FBRyxLQUFLLENBQUM7SUFDbEYsQ0FBQztJQUVTLE1BQU0sQ0FBQyxLQUFhO1FBQzFCLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxLQUFLLENBQUM7WUFDekIsQ0FBQyxDQUFDLEdBQUcsR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxHQUFHLEdBQUcsS0FBSyxHQUFHLElBQUksQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLENBQUM7WUFDcEQsQ0FBQyxDQUFDLENBQUMsQ0FBQztJQUNaLENBQUM7K0dBdkNRLFNBQVM7bUdBQVQsU0FBUyxxWEFYUCxDQUFDLHdCQUF3QixDQUFDLENBQUMsQ0FBQyxDQUFDLGlEQ3BCNUMsd2xDQWtDQSw0b0VEbEJjLFlBQVksOEJBQUUsV0FBVyw2d0JBQUUsa0JBQWtCLDhIQUFFLE9BQU8scUZBQUUsY0FBYzs7U0FldkUsU0FBUzs0RkFBVCxTQUFTO2tCQWxCckIsU0FBUztpQ0FDTSxJQUFJLFlBQ04sWUFBWSxXQUNiLENBQUMsWUFBWSxFQUFFLFdBQVcsRUFBRSxrQkFBa0IsRUFBRSxPQUFPLEVBQUUsY0FBYyxDQUFDLG1CQUdoRSx1QkFBdUIsQ0FBQyxNQUFNLGFBQ3BDLENBQUMsd0JBQXdCLENBQUMsQ0FBQyxDQUFDLENBQUMsUUFDbEM7d0JBQ0YsbUJBQW1CLEVBQUUsWUFBWTt3QkFDakMsbUJBQW1CLEVBQUUsWUFBWTt3QkFDakMsaUJBQWlCLEVBQUUsUUFBUTt3QkFDM0IsbUJBQW1CLEVBQUUsbUJBQW1CO3dCQUN4QyxlQUFlLEVBQUUsY0FBYzt3QkFDL0IsaUJBQWlCLEVBQUUsZUFBZTt3QkFDbEMsc0JBQXNCLEVBQUUsZUFBZTtxQkFDMUM7OEJBUU0sSUFBSTtzQkFEVixLQUFLO2dCQUlDLEdBQUc7c0JBRFQsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tbW9uTW9kdWxlfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBpbmplY3QsIElucHV0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7Rm9ybXNNb2R1bGV9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7VHVpQ29udHJvbH0gZnJvbSAnQHRhaWdhLXVpL2Nkay9jbGFzc2VzJztcbmltcG9ydCB7VHVpUmVwZWF0VGltZXN9IGZyb20gJ0B0YWlnYS11aS9jZGsvZGlyZWN0aXZlcy9yZXBlYXQtdGltZXMnO1xuaW1wb3J0IHt0dWlGYWxsYmFja1ZhbHVlUHJvdmlkZXJ9IGZyb20gJ0B0YWlnYS11aS9jZGsvdG9rZW5zJztcbmltcG9ydCB7dHVpQ2xhbXB9IGZyb20gJ0B0YWlnYS11aS9jZGsvdXRpbHMvbWF0aCc7XG5pbXBvcnQge1R1aUljb259IGZyb20gJ0B0YWlnYS11aS9jb3JlL2NvbXBvbmVudHMvaWNvbic7XG5pbXBvcnQge1BvbHltb3JwaGV1c091dGxldH0gZnJvbSAnQHRhaWdhLXVpL3BvbHltb3JwaGV1cyc7XG5cbmltcG9ydCB0eXBlIHtUdWlSYXRpbmdPcHRpb25zfSBmcm9tICcuL3JhdGluZy5vcHRpb25zJztcbmltcG9ydCB7VFVJX1JBVElOR19PUFRJT05TfSBmcm9tICcuL3JhdGluZy5vcHRpb25zJztcblxuQENvbXBvbmVudCh7XG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBzZWxlY3RvcjogJ3R1aS1yYXRpbmcnLFxuICAgIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEZvcm1zTW9kdWxlLCBQb2x5bW9ycGhldXNPdXRsZXQsIFR1aUljb24sIFR1aVJlcGVhdFRpbWVzXSxcbiAgICB0ZW1wbGF0ZVVybDogJy4vcmF0aW5nLnRlbXBsYXRlLmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3JhdGluZy5zdHlsZS5sZXNzJ10sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgcHJvdmlkZXJzOiBbdHVpRmFsbGJhY2tWYWx1ZVByb3ZpZGVyKDApXSxcbiAgICBob3N0OiB7XG4gICAgICAgICdbY2xhc3MuX2Rpc2FibGVkXSc6ICdkaXNhYmxlZCgpJyxcbiAgICAgICAgJ1tjbGFzcy5fcmVhZG9ubHldJzogJ3JlYWRPbmx5KCknLFxuICAgICAgICAnW2NsYXNzLl9hY3RpdmVdJzogJ2FjdGl2ZScsXG4gICAgICAgICcoa2V5ZG93bi5jYXB0dXJlKSc6ICdvbktleURvd24oJGV2ZW50KScsXG4gICAgICAgICcocG9pbnRlcmRvd24pJzogJ29uUG9pbnRlcigxKScsXG4gICAgICAgICcocG9pbnRlcmNhbmNlbCknOiAnb25Qb2ludGVyKC0xKScsXG4gICAgICAgICcoZG9jdW1lbnQ6cG9pbnRlcnVwKSc6ICdvblBvaW50ZXIoLTEpJyxcbiAgICB9LFxufSlcbmV4cG9ydCBjbGFzcyBUdWlSYXRpbmcgZXh0ZW5kcyBUdWlDb250cm9sPG51bWJlcj4ge1xuICAgIHByaXZhdGUgcmVhZG9ubHkgb3B0aW9ucyA9IGluamVjdChUVUlfUkFUSU5HX09QVElPTlMpO1xuXG4gICAgcHJvdGVjdGVkIGFjdGl2ZSA9IDA7XG5cbiAgICBASW5wdXQoKVxuICAgIHB1YmxpYyBpY29uOiBUdWlSYXRpbmdPcHRpb25zWydpY29uJ10gPSB0aGlzLm9wdGlvbnMuaWNvbjtcblxuICAgIEBJbnB1dCgpXG4gICAgcHVibGljIG1heCA9IHRoaXMub3B0aW9ucy5tYXg7XG5cbiAgICBwcm90ZWN0ZWQgb25LZXlEb3duKGV2ZW50OiBLZXlib2FyZEV2ZW50KTogdm9pZCB7XG4gICAgICAgIGlmICh0aGlzLnJlYWRPbmx5KCkpIHtcbiAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBwcm90ZWN0ZWQgb25Qb2ludGVyKGRlbHRhOiBudW1iZXIpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5hY3RpdmUgPSB0dWlDbGFtcCh0aGlzLmFjdGl2ZSArIGRlbHRhLCAwLCAxKTtcbiAgICB9XG5cbiAgICBwcm90ZWN0ZWQgb25DbGljayh2YWx1ZTogbnVtYmVyKTogdm9pZCB7XG4gICAgICAgIGlmICh0aGlzLmFjdGl2ZSkge1xuICAgICAgICAgICAgdGhpcy5vbkNoYW5nZSh2YWx1ZSk7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBwcm90ZWN0ZWQgaXNBY3RpdmUoaW5kZXg6IG51bWJlcik6IGJvb2xlYW4ge1xuICAgICAgICByZXR1cm4gTWF0aC5jZWlsKHRoaXMudmFsdWUoKSkgPj0gdGhpcy5tYXggLSBpbmRleDtcbiAgICB9XG5cbiAgICBwcm90ZWN0ZWQgaXNGcmFjdGlvbihpbmRleDogbnVtYmVyKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiB0aGlzLnZhbHVlKCkgPiB0aGlzLm1heCAtIGluZGV4IC0gMSAmJiB0aGlzLnZhbHVlKCkgPCB0aGlzLm1heCAtIGluZGV4O1xuICAgIH1cblxuICAgIHByb3RlY3RlZCBnZXRDdXQoaW5kZXg6IG51bWJlcik6IG51bWJlciB7XG4gICAgICAgIHJldHVybiB0aGlzLmlzRnJhY3Rpb24oaW5kZXgpXG4gICAgICAgICAgICA/IDEwMCAqIE1hdGgubWF4KHRoaXMubWF4IC0gaW5kZXggLSB0aGlzLnZhbHVlKCksIDApXG4gICAgICAgICAgICA6IDA7XG4gICAgfVxufVxuIiwiPGlucHV0XG4gICAgbWluPVwiMVwiXG4gICAgdHlwZT1cInJhbmdlXCJcbiAgICBjbGFzcz1cInQtcmFuZ2VcIlxuICAgIFthdHRyLmFyaWEtZGlzYWJsZWRdPVwicmVhZE9ubHkoKVwiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkKClcIlxuICAgIFttYXhdPVwibWF4XCJcbiAgICBbbmdNb2RlbF09XCJ2YWx1ZSgpXCJcbiAgICBbbmdNb2RlbE9wdGlvbnNdPVwie3N0YW5kYWxvbmU6IHRydWV9XCJcbiAgICAoYmx1cik9XCJvblRvdWNoZWQoKVwiXG4gICAgKG5nTW9kZWxDaGFuZ2UpPVwib25DaGFuZ2UoJGV2ZW50KVwiXG4vPlxuPGRpdiBjbGFzcz1cInQtaXRlbXNcIj5cbiAgICA8ZGl2XG4gICAgICAgICp0dWlSZXBlYXRUaW1lcz1cImxldCBpbmRleCBvZiBtYXhcIlxuICAgICAgICBjbGFzcz1cInQtaXRlbVwiXG4gICAgICAgIFtjbGFzcy50LWl0ZW1fYWN0aXZlXT1cImlzQWN0aXZlKGluZGV4KVwiXG4gICAgICAgIChwb2ludGVydXApPVwib25DbGljayhtYXggLSBpbmRleClcIlxuICAgID5cbiAgICAgICAgPHR1aS1pY29uXG4gICAgICAgICAgICAqcG9seW1vcnBoZXVzT3V0bGV0PVwiaWNvbiBhcyBzcmM7IGNvbnRleHQ6IHskaW1wbGljaXQ6IG1heCAtIGluZGV4LCB2YWx1ZTogdmFsdWUoKX1cIlxuICAgICAgICAgICAgY2xhc3M9XCJ0LWljb24gdC1pY29uX2JsYW5rXCJcbiAgICAgICAgICAgIFtjbGFzcy50LWljb25fZnJhY3Rpb25dPVwiaXNGcmFjdGlvbihpbmRleClcIlxuICAgICAgICAgICAgW2ljb25dPVwic3JjLnRvU3RyaW5nKClcIlxuICAgICAgICAgICAgW3N0eWxlLi0tdC1jdXQuJV09XCIxMDAgLSBnZXRDdXQoaW5kZXgpXCJcbiAgICAgICAgLz5cbiAgICAgICAgPHR1aS1pY29uXG4gICAgICAgICAgICAqcG9seW1vcnBoZXVzT3V0bGV0PVwiaWNvbiBhcyBzcmM7IGNvbnRleHQ6IHskaW1wbGljaXQ6IG1heCAtIGluZGV4LCB2YWx1ZTogdmFsdWUoKX1cIlxuICAgICAgICAgICAgY2xhc3M9XCJ0LWljb25cIlxuICAgICAgICAgICAgW2ljb25dPVwic3JjLnRvU3RyaW5nKClcIlxuICAgICAgICAgICAgW3N0eWxlLi0tdC1jdXQuJV09XCJnZXRDdXQoaW5kZXgpXCJcbiAgICAgICAgLz5cbiAgICA8L2Rpdj5cbjwvZGl2PlxuIl19
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
import { AsyncPipe, NgIf } from '@angular/common';
|
|
4
4
|
import { ChangeDetectionStrategy, Component, ContentChild } from '@angular/core';
|
|
5
5
|
import { NgControl } from '@angular/forms';
|
|
6
|
+
import { tuiHintOptionsProvider } from '@taiga-ui/core/directives/hint';
|
|
6
7
|
import { TuiSliderComponent } from '../slider.component';
|
|
7
8
|
import * as i0 from "@angular/core";
|
|
8
9
|
class TuiSliderThumbLabel {
|
|
@@ -17,16 +18,16 @@ class TuiSliderThumbLabel {
|
|
|
17
18
|
get ratio() {
|
|
18
19
|
return this.slider?.valueRatio || 0;
|
|
19
20
|
}
|
|
20
|
-
get
|
|
21
|
+
get ghostStart() {
|
|
21
22
|
return this.ratio * (this.slider?.el.offsetWidth || 0);
|
|
22
23
|
}
|
|
23
24
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSliderThumbLabel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiSliderThumbLabel, isStandalone: true, selector: "[tuiSliderThumbLabel]", queries: [{ propertyName: "slider", first: true, predicate: TuiSliderComponent, descendants: true }, { propertyName: "control", first: true, predicate: NgControl, descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"control?.valueChanges | async\" />\n\n<div\n class=\"t-ghost\"\n [attr.data-size]=\"size\"\n [style.--tui-slider-thumb-ratio]=\"ratio\"\n [style.left.px]=\"
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiSliderThumbLabel, isStandalone: true, selector: "[tuiSliderThumbLabel]", providers: [tuiHintOptionsProvider({ direction: 'top', appearance: 'dark' })], queries: [{ propertyName: "slider", first: true, predicate: TuiSliderComponent, descendants: true }, { propertyName: "control", first: true, predicate: NgControl, descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"control?.valueChanges | async\" />\n\n<div\n class=\"t-ghost\"\n [attr.data-size]=\"size\"\n [style.--tui-slider-thumb-ratio]=\"ratio\"\n [style.inset-inline-start.px]=\"ghostStart\"\n [style.left.px]=\"ghostStart\"\n>\n <ng-content />\n</div>\n\n<ng-content select=\"input[type=range]\" />\n", styles: [":host{position:relative}.t-ghost{position:absolute;top:0;bottom:0;margin:auto;border-radius:50%;pointer-events:none}.t-ghost[data-size=s]{inline-size:.5rem;block-size:.5rem;transform:translate(calc(var(--tui-slider-thumb-ratio) * -.5rem * var(--t-inline)))}.t-ghost[data-size=m]{inline-size:.75rem;block-size:.75rem;transform:translate(calc(var(--tui-slider-thumb-ratio) * -.75rem * var(--t-inline)))}@supports (inset-inline-end: 0){:host-context([dir=\"rtl\"]) .t-ghost{left:unset!important}}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
25
26
|
}
|
|
26
27
|
export { TuiSliderThumbLabel };
|
|
27
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSliderThumbLabel, decorators: [{
|
|
28
29
|
type: Component,
|
|
29
|
-
args: [{ standalone: true, selector: '[tuiSliderThumbLabel]', imports: [AsyncPipe, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"control?.valueChanges | async\" />\n\n<div\n class=\"t-ghost\"\n [attr.data-size]=\"size\"\n [style.--tui-slider-thumb-ratio]=\"ratio\"\n [style.left.px]=\"
|
|
30
|
+
args: [{ standalone: true, selector: '[tuiSliderThumbLabel]', imports: [AsyncPipe, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, providers: [tuiHintOptionsProvider({ direction: 'top', appearance: 'dark' })], template: "<ng-container *ngIf=\"control?.valueChanges | async\" />\n\n<div\n class=\"t-ghost\"\n [attr.data-size]=\"size\"\n [style.--tui-slider-thumb-ratio]=\"ratio\"\n [style.inset-inline-start.px]=\"ghostStart\"\n [style.left.px]=\"ghostStart\"\n>\n <ng-content />\n</div>\n\n<ng-content select=\"input[type=range]\" />\n", styles: [":host{position:relative}.t-ghost{position:absolute;top:0;bottom:0;margin:auto;border-radius:50%;pointer-events:none}.t-ghost[data-size=s]{inline-size:.5rem;block-size:.5rem;transform:translate(calc(var(--tui-slider-thumb-ratio) * -.5rem * var(--t-inline)))}.t-ghost[data-size=m]{inline-size:.75rem;block-size:.75rem;transform:translate(calc(var(--tui-slider-thumb-ratio) * -.75rem * var(--t-inline)))}@supports (inset-inline-end: 0){:host-context([dir=\"rtl\"]) .t-ghost{left:unset!important}}\n"] }]
|
|
30
31
|
}], propDecorators: { slider: [{
|
|
31
32
|
type: ContentChild,
|
|
32
33
|
args: [TuiSliderComponent]
|
|
@@ -34,4 +35,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
34
35
|
type: ContentChild,
|
|
35
36
|
args: [NgControl]
|
|
36
37
|
}] } });
|
|
37
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
38
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2xpZGVyLXRodW1iLWxhYmVsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2tpdC9jb21wb25lbnRzL3NsaWRlci9oZWxwZXJzL3NsaWRlci10aHVtYi1sYWJlbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9raXQvY29tcG9uZW50cy9zbGlkZXIvaGVscGVycy9zbGlkZXItdGh1bWItbGFiZWwudGVtcGxhdGUuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSx3REFBd0Q7QUFBeEQsd0RBQXdEO0FBQ3hELE9BQU8sRUFBQyxTQUFTLEVBQUUsSUFBSSxFQUFDLE1BQU0saUJBQWlCLENBQUM7QUFFaEQsT0FBTyxFQUFDLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDL0UsT0FBTyxFQUFDLFNBQVMsRUFBQyxNQUFNLGdCQUFnQixDQUFDO0FBQ3pDLE9BQU8sRUFBQyxzQkFBc0IsRUFBQyxNQUFNLGdDQUFnQyxDQUFDO0FBR3RFLE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLHFCQUFxQixDQUFDOztBQUV2RCxNQVNhLG1CQUFtQjtJQU9yQixrQkFBa0I7UUFDckIsU0FBUztZQUNMLE9BQU8sQ0FBQyxNQUFNLENBQ1YsT0FBTyxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsWUFBWSxDQUFDLEVBQ25DLDJGQUEyRjtnQkFDdkYsdUVBQXVFLENBQzlFLENBQUM7SUFDVixDQUFDO0lBRUQsSUFBYyxJQUFJO1FBQ2QsT0FBTyxJQUFJLENBQUMsTUFBTSxFQUFFLElBQUksSUFBSSxHQUFHLENBQUM7SUFDcEMsQ0FBQztJQUVELElBQWMsS0FBSztRQUNmLE9BQU8sSUFBSSxDQUFDLE1BQU0sRUFBRSxVQUFVLElBQUksQ0FBQyxDQUFDO0lBQ3hDLENBQUM7SUFFRCxJQUFjLFVBQVU7UUFDcEIsT0FBTyxJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxFQUFFLENBQUMsV0FBVyxJQUFJLENBQUMsQ0FBQyxDQUFDO0lBQzNELENBQUM7K0dBMUJRLG1CQUFtQjttR0FBbkIsbUJBQW1CLG9FQUZqQixDQUFDLHNCQUFzQixDQUFDLEVBQUMsU0FBUyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFDLENBQUMsQ0FBQyw4REFHN0Qsa0JBQWtCLDBFQUdsQixTQUFTLGdEQ3ZCM0IsOFVBYUEsb2lCREFjLFNBQVMsOENBQUUsSUFBSTs7U0FNaEIsbUJBQW1COzRGQUFuQixtQkFBbUI7a0JBVC9CLFNBQVM7aUNBQ00sSUFBSSxZQUNOLHVCQUF1QixXQUN4QixDQUFDLFNBQVMsRUFBRSxJQUFJLENBQUMsbUJBR1QsdUJBQXVCLENBQUMsTUFBTSxhQUNwQyxDQUFDLHNCQUFzQixDQUFDLEVBQUMsU0FBUyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsTUFBTSxFQUFDLENBQUMsQ0FBQzs4QkFJeEQsTUFBTTtzQkFEeEIsWUFBWTt1QkFBQyxrQkFBa0I7Z0JBSWIsT0FBTztzQkFEekIsWUFBWTt1QkFBQyxTQUFTIiwic291cmNlc0NvbnRlbnQiOlsiLy8vIDxyZWZlcmVuY2UgdHlwZXM9XCJAdGFpZ2EtdWkvdHNjb25maWcvbmctZGV2LW1vZGVcIiAvPlxuaW1wb3J0IHtBc3luY1BpcGUsIE5nSWZ9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgdHlwZSB7QWZ0ZXJDb250ZW50SW5pdH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0NoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIENvbnRlbnRDaGlsZH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge05nQ29udHJvbH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHt0dWlIaW50T3B0aW9uc1Byb3ZpZGVyfSBmcm9tICdAdGFpZ2EtdWkvY29yZS9kaXJlY3RpdmVzL2hpbnQnO1xuaW1wb3J0IHR5cGUge1R1aVNpemVTfSBmcm9tICdAdGFpZ2EtdWkvY29yZS90eXBlcyc7XG5cbmltcG9ydCB7VHVpU2xpZGVyQ29tcG9uZW50fSBmcm9tICcuLi9zbGlkZXIuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBzZWxlY3RvcjogJ1t0dWlTbGlkZXJUaHVtYkxhYmVsXScsXG4gICAgaW1wb3J0czogW0FzeW5jUGlwZSwgTmdJZl0sXG4gICAgdGVtcGxhdGVVcmw6ICcuL3NsaWRlci10aHVtYi1sYWJlbC50ZW1wbGF0ZS5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9zbGlkZXItdGh1bWItbGFiZWwuc3R5bGUubGVzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIHByb3ZpZGVyczogW3R1aUhpbnRPcHRpb25zUHJvdmlkZXIoe2RpcmVjdGlvbjogJ3RvcCcsIGFwcGVhcmFuY2U6ICdkYXJrJ30pXSxcbn0pXG5leHBvcnQgY2xhc3MgVHVpU2xpZGVyVGh1bWJMYWJlbCBpbXBsZW1lbnRzIEFmdGVyQ29udGVudEluaXQge1xuICAgIEBDb250ZW50Q2hpbGQoVHVpU2xpZGVyQ29tcG9uZW50KVxuICAgIHByb3RlY3RlZCByZWFkb25seSBzbGlkZXI/OiBUdWlTbGlkZXJDb21wb25lbnQ7XG5cbiAgICBAQ29udGVudENoaWxkKE5nQ29udHJvbClcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgY29udHJvbD86IE5nQ29udHJvbDtcblxuICAgIHB1YmxpYyBuZ0FmdGVyQ29udGVudEluaXQoKTogdm9pZCB7XG4gICAgICAgIG5nRGV2TW9kZSAmJlxuICAgICAgICAgICAgY29uc29sZS5hc3NlcnQoXG4gICAgICAgICAgICAgICAgQm9vbGVhbih0aGlzLmNvbnRyb2w/LnZhbHVlQ2hhbmdlcyksXG4gICAgICAgICAgICAgICAgJ1xcblt0dWlTbGlkZXJUaHVtYkxhYmVsXSBleHBlY3RlZCA8aW5wdXQgdHVpU2xpZGVyIHR5cGU9XCJyYW5nZVwiIC8+IHRvIHVzZSBBbmd1bGFyIEZvcm1zLlxcbicgK1xuICAgICAgICAgICAgICAgICAgICAnVXNlIFsobmdNb2RlbCldIG9yIFtmb3JtQ29udHJvbF0gb3IgZm9ybUNvbnRyb2xOYW1lIGZvciBjb3JyZWN0IHdvcmsuJyxcbiAgICAgICAgICAgICk7XG4gICAgfVxuXG4gICAgcHJvdGVjdGVkIGdldCBzaXplKCk6IFR1aVNpemVTIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuc2xpZGVyPy5zaXplIHx8ICdtJztcbiAgICB9XG5cbiAgICBwcm90ZWN0ZWQgZ2V0IHJhdGlvKCk6IG51bWJlciB7XG4gICAgICAgIHJldHVybiB0aGlzLnNsaWRlcj8udmFsdWVSYXRpbyB8fCAwO1xuICAgIH1cblxuICAgIHByb3RlY3RlZCBnZXQgZ2hvc3RTdGFydCgpOiBudW1iZXIge1xuICAgICAgICByZXR1cm4gdGhpcy5yYXRpbyAqICh0aGlzLnNsaWRlcj8uZWwub2Zmc2V0V2lkdGggfHwgMCk7XG4gICAgfVxufVxuIiwiPG5nLWNvbnRhaW5lciAqbmdJZj1cImNvbnRyb2w/LnZhbHVlQ2hhbmdlcyB8IGFzeW5jXCIgLz5cblxuPGRpdlxuICAgIGNsYXNzPVwidC1naG9zdFwiXG4gICAgW2F0dHIuZGF0YS1zaXplXT1cInNpemVcIlxuICAgIFtzdHlsZS4tLXR1aS1zbGlkZXItdGh1bWItcmF0aW9dPVwicmF0aW9cIlxuICAgIFtzdHlsZS5pbnNldC1pbmxpbmUtc3RhcnQucHhdPVwiZ2hvc3RTdGFydFwiXG4gICAgW3N0eWxlLmxlZnQucHhdPVwiZ2hvc3RTdGFydFwiXG4+XG4gICAgPG5nLWNvbnRlbnQgLz5cbjwvZGl2PlxuXG48bmctY29udGVudCBzZWxlY3Q9XCJpbnB1dFt0eXBlPXJhbmdlXVwiIC8+XG4iXX0=
|
|
@@ -94,7 +94,7 @@ class TuiSliderComponent {
|
|
|
94
94
|
`, `linear-gradient(to right, transparent 0 ${percentages[0]}%,`);
|
|
95
95
|
}
|
|
96
96
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
97
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.12", type: TuiSliderComponent, isStandalone: true, selector: "input[type=range][tuiSlider]", inputs: { size: "size", segmentsSetter: ["segments", "segmentsSetter", (x) => Array.isArray(x) ? x : new Array(x).fill(null).map((_, i) => i / x)] }, host: { listeners: { "input": "0" }, properties: { "style.--tui-slider-track-color": "options.trackColor", "style.--tui-ticks-gradient": "ticksGradient()", "style.--tui-slider-fill-ratio": "valueRatio", "attr.data-size": "size" } }, providers: [tuiAsAuxiliary(TuiSliderComponent)], ngImport: i0, template: '', isInline: true, styles: [":host{--t-tick-thickness: .25rem;position:relative;display:block;inline-size:100%;color:var(--tui-background-accent-1);cursor:pointer;-webkit-appearance:none;appearance:none;block-size:.125rem;padding:.4375rem 0;background-color:transparent;background-clip:content-box;outline:none;border-radius:var(--tui-radius-m)}:host
|
|
97
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "16.2.12", type: TuiSliderComponent, isStandalone: true, selector: "input[type=range][tuiSlider]", inputs: { size: "size", segmentsSetter: ["segments", "segmentsSetter", (x) => Array.isArray(x) ? x : new Array(x).fill(null).map((_, i) => i / x)] }, host: { listeners: { "input": "0" }, properties: { "style.--tui-slider-track-color": "options.trackColor", "style.--tui-ticks-gradient": "ticksGradient()", "style.--tui-slider-fill-ratio": "valueRatio", "attr.data-size": "size" } }, providers: [tuiAsAuxiliary(TuiSliderComponent)], ngImport: i0, template: '', isInline: true, styles: [":host{--t-tick-thickness: .25rem;position:relative;display:block;inline-size:100%;color:var(--tui-background-accent-1);cursor:pointer;-webkit-appearance:none;appearance:none;block-size:.125rem;padding:.4375rem 0;background-color:transparent;background-clip:content-box;outline:none;border-radius:var(--tui-radius-m)}:host:active{cursor:ew-resize}:host:disabled{opacity:var(--tui-disabled-opacity);cursor:auto}:host[data-size=s]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.25rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.5rem;block-size:.5rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .5rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=s]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host[data-size=m]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.125rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.75rem;block-size:.75rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .75rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=m]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host::-webkit-slider-container{border-radius:inherit}:host[data-size=m]::-webkit-slider-runnable-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--t-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .75rem),auto}:host[data-size=s]::-webkit-slider-runnable-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--t-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .5rem),auto}:host[data-size=m]::-moz-range-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .75rem)}:host[data-size=s]::-moz-range-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .5rem)}:host[data-size=m]::-webkit-slider-thumb{-webkit-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:-.4375rem}:not(:disabled):host[data-size=m]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=m]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-webkit-slider-thumb{-webkit-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:-.4375rem}:not(:disabled):host[data-size=s]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=s]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=m]::-moz-range-thumb{-moz-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=m]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=m]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-moz-range-thumb{-moz-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=s]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=s]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host::-moz-range-progress{border-radius:inherit}:host::-moz-range-progress{block-size:.125rem;background:currentColor;border-top-right-radius:0;border-bottom-right-radius:0}:host-context(tui-textfield) :host([type=\"range\"]){--tui-radius: var(--tui-radius-m);position:absolute;top:100%;left:calc(var(--tui-radius) / 2);right:calc(var(--tui-radius) / 2);inline-size:calc(100% - calc(var(--tui-radius) / 2) * 2);box-sizing:border-box;block-size:1rem;margin:-.5625rem 0 0;padding:0;border-top-left-radius:0;border-bottom-left-radius:calc(var(--tui-radius) * 10) calc(var(--tui-radius) * 2);pointer-events:auto}:host-context(tui-textfield[data-size=\"l\"]) :host([type=\"range\"]){--tui-radius: var(--tui-radius-l)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
98
98
|
}
|
|
99
99
|
export { TuiSliderComponent };
|
|
100
100
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSliderComponent, decorators: [{
|
|
@@ -111,7 +111,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
111
111
|
'[style.--tui-ticks-gradient]': 'ticksGradient()',
|
|
112
112
|
'[style.--tui-slider-fill-ratio]': 'valueRatio',
|
|
113
113
|
'[attr.data-size]': 'size',
|
|
114
|
-
}, styles: [":host{--t-tick-thickness: .25rem;position:relative;display:block;inline-size:100%;color:var(--tui-background-accent-1);cursor:pointer;-webkit-appearance:none;appearance:none;block-size:.125rem;padding:.4375rem 0;background-color:transparent;background-clip:content-box;outline:none;border-radius:var(--tui-radius-m)}:host
|
|
114
|
+
}, styles: [":host{--t-tick-thickness: .25rem;position:relative;display:block;inline-size:100%;color:var(--tui-background-accent-1);cursor:pointer;-webkit-appearance:none;appearance:none;block-size:.125rem;padding:.4375rem 0;background-color:transparent;background-clip:content-box;outline:none;border-radius:var(--tui-radius-m)}:host:active{cursor:ew-resize}:host:disabled{opacity:var(--tui-disabled-opacity);cursor:auto}:host[data-size=s]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.25rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.5rem;block-size:.5rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .5rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=s]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host[data-size=m]:not(:disabled):before{transition-property:transform,opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.125rem;left:var(--t-left);inset-inline-start:var(--t-left);inline-size:.75rem;block-size:.75rem;border-radius:50%;transform:var(--tui-slider-thumb-transform, scale(1));--t-left: calc(var(--tui-slider-fill-ratio) * 100% - var(--tui-slider-fill-ratio) * .75rem);content:\"\";cursor:ew-resize;background:currentColor;opacity:0}:host[data-size=m]:active:before{opacity:.2;transform:var(--tui-slider-thumb-transform, scale(1)) scale(2.33)}:host::-webkit-slider-container{border-radius:inherit}:host[data-size=m]::-webkit-slider-runnable-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--t-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .75rem),auto}:host[data-size=s]::-webkit-slider-runnable-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient),linear-gradient(to var(--t-inline-end),currentColor calc(100% * var(--tui-slider-fill-ratio)),transparent calc(100% * var(--tui-slider-fill-ratio)));background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2),0;background-size:calc(100% - .5rem),auto}:host[data-size=m]::-moz-range-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.75rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .75rem)}:host[data-size=s]::-moz-range-track{block-size:.125rem;border-radius:inherit;background-repeat:no-repeat;background-color:var(--tui-slider-track-color);background-image:var(--tui-ticks-gradient);background-position-x:calc((.5rem - var(--t-tick-thickness)) / 2);background-size:calc(100% - .5rem)}:host[data-size=m]::-webkit-slider-thumb{-webkit-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:-.4375rem}:not(:disabled):host[data-size=m]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=m]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-webkit-slider-thumb{-webkit-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1));margin-block-start:-.4375rem}:not(:disabled):host[data-size=s]::-webkit-slider-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-webkit-slider-thumb:hover,:active:not(:disabled):host[data-size=s]::-webkit-slider-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-webkit-slider-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=m]::-moz-range-thumb{-moz-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.75rem;inline-size:.75rem;box-sizing:content-box;background-clip:content-box;border:.125rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=m]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=m]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=m]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.333)}:focus-visible:host[data-size=m]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host[data-size=s]::-moz-range-thumb{-moz-transition-property:transform;transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;isolation:isolate;-webkit-appearance:none;appearance:none;background-color:currentColor;box-shadow:none;border-radius:50%;block-size:.5rem;inline-size:.5rem;box-sizing:content-box;background-clip:content-box;border:.25rem solid transparent;border-inline-start:0;border-inline-end:0;transform:var(--tui-slider-thumb-transform, scale(1))}:not(:disabled):host[data-size=s]::-moz-range-thumb{cursor:ew-resize}:not(:disabled):host[data-size=s]::-moz-range-thumb:hover,:active:not(:disabled):host[data-size=s]::-moz-range-thumb{transform:var(--tui-slider-thumb-transform, scale(1)) scale(1.5)}:focus-visible:host[data-size=s]::-moz-range-thumb{box-shadow:0 0 0 2px inset var(--tui-border-focus)}:host::-moz-range-progress{border-radius:inherit}:host::-moz-range-progress{block-size:.125rem;background:currentColor;border-top-right-radius:0;border-bottom-right-radius:0}:host-context(tui-textfield) :host([type=\"range\"]){--tui-radius: var(--tui-radius-m);position:absolute;top:100%;left:calc(var(--tui-radius) / 2);right:calc(var(--tui-radius) / 2);inline-size:calc(100% - calc(var(--tui-radius) / 2) * 2);box-sizing:border-box;block-size:1rem;margin:-.5625rem 0 0;padding:0;border-top-left-radius:0;border-bottom-left-radius:calc(var(--tui-radius) * 10) calc(var(--tui-radius) * 2);pointer-events:auto}:host-context(tui-textfield[data-size=\"l\"]) :host([type=\"range\"]){--tui-radius: var(--tui-radius-l)}\n"] }]
|
|
115
115
|
}], ctorParameters: function () { return []; }, propDecorators: { size: [{
|
|
116
116
|
type: Input
|
|
117
117
|
}], segmentsSetter: [{
|
|
@@ -50,7 +50,7 @@ class TuiBreadcrumbs {
|
|
|
50
50
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiBreadcrumbs, isStandalone: true, selector: "tui-breadcrumbs", inputs: { size: "size", itemsLimit: "itemsLimit" }, host: { properties: { "attr.data-size": "size" } }, providers: [
|
|
51
51
|
tuiLinkOptionsProvider({ appearance: 'action-grayscale' }),
|
|
52
52
|
tuiHintOptionsProvider({ direction: 'bottom' }),
|
|
53
|
-
], queries: [{ propertyName: "items", predicate: TuiItem, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n <ng-container *ngIf=\"itemsLimit !== 2\">\n <ng-container [ngTemplateOutlet]=\"items.first\" />\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </ng-container>\n <tui-items-with-more\n side=\"start\"\n [itemsLimit]=\"itemsLimit - 2\"\n [required]=\"items.length + offset - 2\"\n >\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n <ng-container *tuiItem>\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n </ng-container>\n </ng-container>\n <ng-template\n let-index\n tuiMore\n >\n <span class=\"t-more\">\n <button\n appearance=\"flat\"\n size=\"xs\"\n tuiDropdownOpen\n tuiIconButton\n type=\"button\"\n [iconStart]=\"icons.ellipsis\"\n [tuiDropdown]=\"dropdown\"\n >\n {{ more() }}\n </button>\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </span>\n <ng-template #dropdown>\n <tui-data-list size=\"s\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n <span\n *ngIf=\"i + offset && i <= index && item !== items.last\"\n tuiOption\n class=\"t-option\"\n >\n <ng-container [ngTemplateOutlet]=\"item\" />\n </span>\n </ng-container>\n </tui-data-list>\n </ng-template>\n </ng-template>\n </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n <tui-icon\n *ngIf=\"options.icon.length > 1; else char\"\n class=\"t-icon\"\n [icon]=\"options.icon\"\n />\n <ng-template #char>\n <span class=\"t-char\">{{ options.icon }}</span>\n </ng-template>\n</ng-template>\n<ng-template #plain>\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n</ng-template>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap;color:var(--tui-text-secondary)}:host[data-size=m]{font:var(--tui-font-text-s);line-height:1.5rem;block-size:1.5rem}:host[data-size=l]{font:var(--tui-font-text-m);line-height:2.5rem;block-size:2.5rem}:host ::ng-deep [tuiLink]{text-decoration:none}.t-more{display:flex;align-items:center}.t-option ::ng-deep>*{color:var(--tui-text-primary)!important;background:transparent!important;text-decoration:none}.t-icon{margin:0 .5rem;font-size:1rem}.t-char{margin:0 .375rem}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "directive", type: i2.TuiDropdownDirective, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: ["tuiDropdown"], exportAs: ["tuiDropdown"] }, { kind: "directive", type: i2.TuiDropdownOpen, selector: "[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: ["tuiDropdownEnabled", "tuiDropdownOpen"], outputs: ["tuiDropdownOpenChange"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i3.TuiItemsWithMoreComponent, selector: "tui-items-with-more", outputs: ["lastIndexChange"] }, { kind: "directive", type: i3.TuiMore, selector: "[tuiMore]" }, { kind: "directive", type: i4.TuiItem, selector: "[tuiItem]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
53
|
+
], queries: [{ propertyName: "items", predicate: TuiItem, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n <ng-container *ngIf=\"itemsLimit !== 2\">\n <ng-container [ngTemplateOutlet]=\"items.first\" />\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </ng-container>\n <tui-items-with-more\n side=\"start\"\n [itemsLimit]=\"itemsLimit - 2\"\n [required]=\"items.length + offset - 2\"\n >\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n <ng-container *tuiItem>\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n </ng-container>\n </ng-container>\n <ng-template\n let-index\n tuiMore\n >\n <span class=\"t-more\">\n <button\n appearance=\"flat\"\n size=\"xs\"\n tuiDropdownOpen\n tuiIconButton\n type=\"button\"\n [iconStart]=\"icons.ellipsis\"\n [tuiDropdown]=\"dropdown\"\n >\n {{ more() }}\n </button>\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </span>\n <ng-template #dropdown>\n <tui-data-list size=\"s\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n <span\n *ngIf=\"i + offset && i <= index && item !== items.last\"\n tuiOption\n class=\"t-option\"\n >\n <ng-container [ngTemplateOutlet]=\"item\" />\n </span>\n </ng-container>\n </tui-data-list>\n </ng-template>\n </ng-template>\n </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n <tui-icon\n *ngIf=\"options.icon.length > 1; else char\"\n class=\"t-icon\"\n [icon]=\"options.icon\"\n />\n <ng-template #char>\n <span class=\"t-char\">{{ options.icon }}</span>\n </ng-template>\n</ng-template>\n<ng-template #plain>\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n</ng-template>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap;color:var(--tui-text-secondary)}:host[data-size=m]{font:var(--tui-font-text-s);line-height:1.5rem;block-size:1.5rem}:host[data-size=l]{font:var(--tui-font-text-m);line-height:2.5rem;block-size:2.5rem}:host ::ng-deep [tuiLink]{text-decoration:none}.t-more{display:flex;align-items:center}.t-option ::ng-deep>*{color:var(--tui-text-primary)!important;background:transparent!important;text-decoration:none}.t-icon{margin:0 .5rem;font-size:1rem;transform:scaleX(var(--t-inline))}.t-char{margin:0 .375rem}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "component", type: i1.TuiDataListComponent, selector: "tui-data-list", inputs: ["emptyContent", "size"] }, { kind: "directive", type: i2.TuiDropdownDirective, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: ["tuiDropdown"], exportAs: ["tuiDropdown"] }, { kind: "directive", type: i2.TuiDropdownOpen, selector: "[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: ["tuiDropdownEnabled", "tuiDropdownOpen"], outputs: ["tuiDropdownOpenChange"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: i3.TuiItemsWithMoreComponent, selector: "tui-items-with-more", outputs: ["lastIndexChange"] }, { kind: "directive", type: i3.TuiMore, selector: "[tuiMore]" }, { kind: "directive", type: i4.TuiItem, selector: "[tuiItem]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
54
54
|
}
|
|
55
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiBreadcrumbs, decorators: [{
|
|
56
56
|
type: Component,
|
|
@@ -69,7 +69,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
69
69
|
tuiHintOptionsProvider({ direction: 'bottom' }),
|
|
70
70
|
], host: {
|
|
71
71
|
'[attr.data-size]': 'size',
|
|
72
|
-
}, template: "<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n <ng-container *ngIf=\"itemsLimit !== 2\">\n <ng-container [ngTemplateOutlet]=\"items.first\" />\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </ng-container>\n <tui-items-with-more\n side=\"start\"\n [itemsLimit]=\"itemsLimit - 2\"\n [required]=\"items.length + offset - 2\"\n >\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n <ng-container *tuiItem>\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n </ng-container>\n </ng-container>\n <ng-template\n let-index\n tuiMore\n >\n <span class=\"t-more\">\n <button\n appearance=\"flat\"\n size=\"xs\"\n tuiDropdownOpen\n tuiIconButton\n type=\"button\"\n [iconStart]=\"icons.ellipsis\"\n [tuiDropdown]=\"dropdown\"\n >\n {{ more() }}\n </button>\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </span>\n <ng-template #dropdown>\n <tui-data-list size=\"s\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n <span\n *ngIf=\"i + offset && i <= index && item !== items.last\"\n tuiOption\n class=\"t-option\"\n >\n <ng-container [ngTemplateOutlet]=\"item\" />\n </span>\n </ng-container>\n </tui-data-list>\n </ng-template>\n </ng-template>\n </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n <tui-icon\n *ngIf=\"options.icon.length > 1; else char\"\n class=\"t-icon\"\n [icon]=\"options.icon\"\n />\n <ng-template #char>\n <span class=\"t-char\">{{ options.icon }}</span>\n </ng-template>\n</ng-template>\n<ng-template #plain>\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n</ng-template>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap;color:var(--tui-text-secondary)}:host[data-size=m]{font:var(--tui-font-text-s);line-height:1.5rem;block-size:1.5rem}:host[data-size=l]{font:var(--tui-font-text-m);line-height:2.5rem;block-size:2.5rem}:host ::ng-deep [tuiLink]{text-decoration:none}.t-more{display:flex;align-items:center}.t-option ::ng-deep>*{color:var(--tui-text-primary)!important;background:transparent!important;text-decoration:none}.t-icon{margin:0 .5rem;font-size:1rem}.t-char{margin:0 .375rem}\n"] }]
|
|
72
|
+
}, template: "<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n <ng-container *ngIf=\"itemsLimit !== 2\">\n <ng-container [ngTemplateOutlet]=\"items.first\" />\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </ng-container>\n <tui-items-with-more\n side=\"start\"\n [itemsLimit]=\"itemsLimit - 2\"\n [required]=\"items.length + offset - 2\"\n >\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n <ng-container *tuiItem>\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n </ng-container>\n </ng-container>\n <ng-template\n let-index\n tuiMore\n >\n <span class=\"t-more\">\n <button\n appearance=\"flat\"\n size=\"xs\"\n tuiDropdownOpen\n tuiIconButton\n type=\"button\"\n [iconStart]=\"icons.ellipsis\"\n [tuiDropdown]=\"dropdown\"\n >\n {{ more() }}\n </button>\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </span>\n <ng-template #dropdown>\n <tui-data-list size=\"s\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n <span\n *ngIf=\"i + offset && i <= index && item !== items.last\"\n tuiOption\n class=\"t-option\"\n >\n <ng-container [ngTemplateOutlet]=\"item\" />\n </span>\n </ng-container>\n </tui-data-list>\n </ng-template>\n </ng-template>\n </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n <tui-icon\n *ngIf=\"options.icon.length > 1; else char\"\n class=\"t-icon\"\n [icon]=\"options.icon\"\n />\n <ng-template #char>\n <span class=\"t-char\">{{ options.icon }}</span>\n </ng-template>\n</ng-template>\n<ng-template #plain>\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n</ng-template>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap;color:var(--tui-text-secondary)}:host[data-size=m]{font:var(--tui-font-text-s);line-height:1.5rem;block-size:1.5rem}:host[data-size=l]{font:var(--tui-font-text-m);line-height:2.5rem;block-size:2.5rem}:host ::ng-deep [tuiLink]{text-decoration:none}.t-more{display:flex;align-items:center}.t-option ::ng-deep>*{color:var(--tui-text-primary)!important;background:transparent!important;text-decoration:none}.t-icon{margin:0 .5rem;font-size:1rem;transform:scaleX(var(--t-inline))}.t-char{margin:0 .375rem}\n"] }]
|
|
73
73
|
}], propDecorators: { items: [{
|
|
74
74
|
type: ContentChildren,
|
|
75
75
|
args: [TuiItem, { read: TemplateRef }]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"taiga-ui-kit-components-breadcrumbs.mjs","sources":["../../../projects/kit/components/breadcrumbs/breadcrumbs.options.ts","../../../projects/kit/components/breadcrumbs/breadcrumbs.component.ts","../../../projects/kit/components/breadcrumbs/breadcrumbs.template.html","../../../projects/kit/components/breadcrumbs/taiga-ui-kit-components-breadcrumbs.ts"],"sourcesContent":["import type {Provider} from '@angular/core';\nimport {InjectionToken} from '@angular/core';\nimport {tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {TuiSizeL} from '@taiga-ui/core/types';\n\nexport interface TuiBreadcrumbsOptions {\n readonly icon: string;\n readonly size: TuiSizeL;\n readonly itemsLimit: number;\n}\n\nexport const TUI_BREADCRUMBS_DEFAULT_OPTIONS: TuiBreadcrumbsOptions = {\n icon: '@tui.chevron-right',\n size: 'm',\n itemsLimit: 0,\n};\n\nexport const TUI_BREADCRUMBS_OPTIONS = new InjectionToken(\n ngDevMode ? 'TUI_BREADCRUMBS_OPTIONS' : '',\n {\n factory: () => TUI_BREADCRUMBS_DEFAULT_OPTIONS,\n },\n);\n\nexport function tuiBreadcrumbsOptionsProvider(\n options: Partial<TuiBreadcrumbsOptions>,\n): Provider {\n return tuiProvideOptions(\n TUI_BREADCRUMBS_OPTIONS,\n options,\n TUI_BREADCRUMBS_DEFAULT_OPTIONS,\n );\n}\n","import {AsyncPipe, NgForOf, NgIf, NgTemplateOutlet} from '@angular/common';\nimport type {QueryList} from '@angular/core';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n inject,\n Input,\n TemplateRef,\n} from '@angular/core';\nimport {toSignal} from '@angular/core/rxjs-interop';\nimport {EMPTY_QUERY} from '@taiga-ui/cdk/constants';\nimport {TuiItem} from '@taiga-ui/cdk/directives/item';\nimport {TuiButton} from '@taiga-ui/core/components/button';\nimport {TuiDataList} from '@taiga-ui/core/components/data-list';\nimport {TuiIcon} from '@taiga-ui/core/components/icon';\nimport {tuiLinkOptionsProvider} from '@taiga-ui/core/components/link';\nimport {TuiDropdown} from '@taiga-ui/core/directives/dropdown';\nimport {tuiHintOptionsProvider} from '@taiga-ui/core/directives/hint';\nimport {TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';\nimport {TuiItemsWithMore} from '@taiga-ui/kit/components/items-with-more';\nimport {TUI_MORE_WORD} from '@taiga-ui/kit/tokens';\n\nimport type {TuiBreadcrumbsOptions} from './breadcrumbs.options';\nimport {TUI_BREADCRUMBS_OPTIONS} from './breadcrumbs.options';\n\n@Component({\n standalone: true,\n selector: 'tui-breadcrumbs',\n imports: [\n AsyncPipe,\n NgForOf,\n NgIf,\n NgTemplateOutlet,\n TuiButton,\n TuiDataList,\n TuiDropdown,\n TuiIcon,\n TuiItemsWithMore,\n ],\n templateUrl: './breadcrumbs.template.html',\n styleUrls: ['./breadcrumbs.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n tuiLinkOptionsProvider({appearance: 'action-grayscale'}),\n tuiHintOptionsProvider({direction: 'bottom'}),\n ],\n host: {\n '[attr.data-size]': 'size',\n },\n})\nexport class TuiBreadcrumbs {\n @ContentChildren(TuiItem, {read: TemplateRef})\n protected readonly items: QueryList<TemplateRef<Record<string, unknown>>> =\n EMPTY_QUERY;\n\n protected readonly options = inject(TUI_BREADCRUMBS_OPTIONS);\n protected readonly icons = inject(TUI_COMMON_ICONS);\n protected readonly more = toSignal(inject(TUI_MORE_WORD), {initialValue: ''});\n\n @Input()\n public size: TuiBreadcrumbsOptions['size'] = this.options.size;\n\n @Input()\n public itemsLimit = this.options.itemsLimit;\n\n protected get limit(): number {\n return this.itemsLimit ? this.itemsLimit - 2 : Infinity;\n }\n\n protected get offset(): number {\n return this.itemsLimit === 2 ? 1 : 0;\n }\n}\n","<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n <ng-container *ngIf=\"itemsLimit !== 2\">\n <ng-container [ngTemplateOutlet]=\"items.first\" />\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </ng-container>\n <tui-items-with-more\n side=\"start\"\n [itemsLimit]=\"itemsLimit - 2\"\n [required]=\"items.length + offset - 2\"\n >\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n <ng-container *tuiItem>\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n </ng-container>\n </ng-container>\n <ng-template\n let-index\n tuiMore\n >\n <span class=\"t-more\">\n <button\n appearance=\"flat\"\n size=\"xs\"\n tuiDropdownOpen\n tuiIconButton\n type=\"button\"\n [iconStart]=\"icons.ellipsis\"\n [tuiDropdown]=\"dropdown\"\n >\n {{ more() }}\n </button>\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </span>\n <ng-template #dropdown>\n <tui-data-list size=\"s\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n <span\n *ngIf=\"i + offset && i <= index && item !== items.last\"\n tuiOption\n class=\"t-option\"\n >\n <ng-container [ngTemplateOutlet]=\"item\" />\n </span>\n </ng-container>\n </tui-data-list>\n </ng-template>\n </ng-template>\n </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n <tui-icon\n *ngIf=\"options.icon.length > 1; else char\"\n class=\"t-icon\"\n [icon]=\"options.icon\"\n />\n <ng-template #char>\n <span class=\"t-char\">{{ options.icon }}</span>\n </ng-template>\n</ng-template>\n<ng-template #plain>\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAWa,MAAA,+BAA+B,GAA0B;AAClE,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,GAAG;AACT,IAAA,UAAU,EAAE,CAAC;EACf;AAEW,MAAA,uBAAuB,GAAG,IAAI,cAAc,CACrD,SAAS,GAAG,yBAAyB,GAAG,EAAE,EAC1C;AACI,IAAA,OAAO,EAAE,MAAM,+BAA+B;AACjD,CAAA,EACH;AAEI,SAAU,6BAA6B,CACzC,OAAuC,EAAA;IAEvC,OAAO,iBAAiB,CACpB,uBAAuB,EACvB,OAAO,EACP,+BAA+B,CAClC,CAAC;AACN;;ACNA,MAyBa,cAAc,CAAA;AAzB3B,IAAA,WAAA,GAAA;QA2BuB,IAAK,CAAA,KAAA,GACpB,WAAW,CAAC;AAEG,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAC,uBAAuB,CAAC,CAAC;AAC1C,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC;AACjC,QAAA,IAAA,CAAA,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,EAAC,YAAY,EAAE,EAAE,EAAC,CAAC,CAAC;AAGvE,QAAA,IAAA,CAAA,IAAI,GAAkC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;AAGxD,QAAA,IAAA,CAAA,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;AAS/C,KAAA;AAPG,IAAA,IAAc,KAAK,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC;KAC3D;AAED,IAAA,IAAc,MAAM,GAAA;AAChB,QAAA,OAAO,IAAI,CAAC,UAAU,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;KACxC;+GArBQ,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,cAAc,EARZ,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,UAAA,EAAA,YAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,EAAA,SAAA,EAAA;AACP,YAAA,sBAAsB,CAAC,EAAC,UAAU,EAAE,kBAAkB,EAAC,CAAC;AACxD,YAAA,sBAAsB,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAC,CAAC;AAChD,SAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAMgB,OAAO,EAAS,IAAA,EAAA,WAAW,ECpDhD,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,ktFA2EA,
|
|
1
|
+
{"version":3,"file":"taiga-ui-kit-components-breadcrumbs.mjs","sources":["../../../projects/kit/components/breadcrumbs/breadcrumbs.options.ts","../../../projects/kit/components/breadcrumbs/breadcrumbs.component.ts","../../../projects/kit/components/breadcrumbs/breadcrumbs.template.html","../../../projects/kit/components/breadcrumbs/taiga-ui-kit-components-breadcrumbs.ts"],"sourcesContent":["import type {Provider} from '@angular/core';\nimport {InjectionToken} from '@angular/core';\nimport {tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {TuiSizeL} from '@taiga-ui/core/types';\n\nexport interface TuiBreadcrumbsOptions {\n readonly icon: string;\n readonly size: TuiSizeL;\n readonly itemsLimit: number;\n}\n\nexport const TUI_BREADCRUMBS_DEFAULT_OPTIONS: TuiBreadcrumbsOptions = {\n icon: '@tui.chevron-right',\n size: 'm',\n itemsLimit: 0,\n};\n\nexport const TUI_BREADCRUMBS_OPTIONS = new InjectionToken(\n ngDevMode ? 'TUI_BREADCRUMBS_OPTIONS' : '',\n {\n factory: () => TUI_BREADCRUMBS_DEFAULT_OPTIONS,\n },\n);\n\nexport function tuiBreadcrumbsOptionsProvider(\n options: Partial<TuiBreadcrumbsOptions>,\n): Provider {\n return tuiProvideOptions(\n TUI_BREADCRUMBS_OPTIONS,\n options,\n TUI_BREADCRUMBS_DEFAULT_OPTIONS,\n );\n}\n","import {AsyncPipe, NgForOf, NgIf, NgTemplateOutlet} from '@angular/common';\nimport type {QueryList} from '@angular/core';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n inject,\n Input,\n TemplateRef,\n} from '@angular/core';\nimport {toSignal} from '@angular/core/rxjs-interop';\nimport {EMPTY_QUERY} from '@taiga-ui/cdk/constants';\nimport {TuiItem} from '@taiga-ui/cdk/directives/item';\nimport {TuiButton} from '@taiga-ui/core/components/button';\nimport {TuiDataList} from '@taiga-ui/core/components/data-list';\nimport {TuiIcon} from '@taiga-ui/core/components/icon';\nimport {tuiLinkOptionsProvider} from '@taiga-ui/core/components/link';\nimport {TuiDropdown} from '@taiga-ui/core/directives/dropdown';\nimport {tuiHintOptionsProvider} from '@taiga-ui/core/directives/hint';\nimport {TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';\nimport {TuiItemsWithMore} from '@taiga-ui/kit/components/items-with-more';\nimport {TUI_MORE_WORD} from '@taiga-ui/kit/tokens';\n\nimport type {TuiBreadcrumbsOptions} from './breadcrumbs.options';\nimport {TUI_BREADCRUMBS_OPTIONS} from './breadcrumbs.options';\n\n@Component({\n standalone: true,\n selector: 'tui-breadcrumbs',\n imports: [\n AsyncPipe,\n NgForOf,\n NgIf,\n NgTemplateOutlet,\n TuiButton,\n TuiDataList,\n TuiDropdown,\n TuiIcon,\n TuiItemsWithMore,\n ],\n templateUrl: './breadcrumbs.template.html',\n styleUrls: ['./breadcrumbs.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n tuiLinkOptionsProvider({appearance: 'action-grayscale'}),\n tuiHintOptionsProvider({direction: 'bottom'}),\n ],\n host: {\n '[attr.data-size]': 'size',\n },\n})\nexport class TuiBreadcrumbs {\n @ContentChildren(TuiItem, {read: TemplateRef})\n protected readonly items: QueryList<TemplateRef<Record<string, unknown>>> =\n EMPTY_QUERY;\n\n protected readonly options = inject(TUI_BREADCRUMBS_OPTIONS);\n protected readonly icons = inject(TUI_COMMON_ICONS);\n protected readonly more = toSignal(inject(TUI_MORE_WORD), {initialValue: ''});\n\n @Input()\n public size: TuiBreadcrumbsOptions['size'] = this.options.size;\n\n @Input()\n public itemsLimit = this.options.itemsLimit;\n\n protected get limit(): number {\n return this.itemsLimit ? this.itemsLimit - 2 : Infinity;\n }\n\n protected get offset(): number {\n return this.itemsLimit === 2 ? 1 : 0;\n }\n}\n","<ng-container *ngIf=\"items.changes | async\" />\n<ng-container *ngIf=\"itemsLimit > 1; else plain\">\n <ng-container *ngIf=\"itemsLimit !== 2\">\n <ng-container [ngTemplateOutlet]=\"items.first\" />\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </ng-container>\n <tui-items-with-more\n side=\"start\"\n [itemsLimit]=\"itemsLimit - 2\"\n [required]=\"items.length + offset - 2\"\n >\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container *ngIf=\"item !== items.first || itemsLimit === 2\">\n <ng-container *tuiItem>\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n </ng-container>\n </ng-container>\n <ng-template\n let-index\n tuiMore\n >\n <span class=\"t-more\">\n <button\n appearance=\"flat\"\n size=\"xs\"\n tuiDropdownOpen\n tuiIconButton\n type=\"button\"\n [iconStart]=\"icons.ellipsis\"\n [tuiDropdown]=\"dropdown\"\n >\n {{ more() }}\n </button>\n <ng-container [ngTemplateOutlet]=\"separator\" />\n </span>\n <ng-template #dropdown>\n <tui-data-list size=\"s\">\n <ng-container *ngFor=\"let item of items; let i = index\">\n <span\n *ngIf=\"i + offset && i <= index && item !== items.last\"\n tuiOption\n class=\"t-option\"\n >\n <ng-container [ngTemplateOutlet]=\"item\" />\n </span>\n </ng-container>\n </tui-data-list>\n </ng-template>\n </ng-template>\n </tui-items-with-more>\n</ng-container>\n<ng-template #separator>\n <tui-icon\n *ngIf=\"options.icon.length > 1; else char\"\n class=\"t-icon\"\n [icon]=\"options.icon\"\n />\n <ng-template #char>\n <span class=\"t-char\">{{ options.icon }}</span>\n </ng-template>\n</ng-template>\n<ng-template #plain>\n <ng-container *ngFor=\"let item of items; let last = last\">\n <ng-container [ngTemplateOutlet]=\"item\" />\n <ng-container\n *ngIf=\"!last\"\n [ngTemplateOutlet]=\"separator\"\n />\n </ng-container>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAWa,MAAA,+BAA+B,GAA0B;AAClE,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,GAAG;AACT,IAAA,UAAU,EAAE,CAAC;EACf;AAEW,MAAA,uBAAuB,GAAG,IAAI,cAAc,CACrD,SAAS,GAAG,yBAAyB,GAAG,EAAE,EAC1C;AACI,IAAA,OAAO,EAAE,MAAM,+BAA+B;AACjD,CAAA,EACH;AAEI,SAAU,6BAA6B,CACzC,OAAuC,EAAA;IAEvC,OAAO,iBAAiB,CACpB,uBAAuB,EACvB,OAAO,EACP,+BAA+B,CAClC,CAAC;AACN;;ACNA,MAyBa,cAAc,CAAA;AAzB3B,IAAA,WAAA,GAAA;QA2BuB,IAAK,CAAA,KAAA,GACpB,WAAW,CAAC;AAEG,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAC,uBAAuB,CAAC,CAAC;AAC1C,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC;AACjC,QAAA,IAAA,CAAA,IAAI,GAAG,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,EAAC,YAAY,EAAE,EAAE,EAAC,CAAC,CAAC;AAGvE,QAAA,IAAA,CAAA,IAAI,GAAkC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;AAGxD,QAAA,IAAA,CAAA,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;AAS/C,KAAA;AAPG,IAAA,IAAc,KAAK,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC;KAC3D;AAED,IAAA,IAAc,MAAM,GAAA;AAChB,QAAA,OAAO,IAAI,CAAC,UAAU,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;KACxC;+GArBQ,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,cAAc,EARZ,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,UAAA,EAAA,YAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,EAAA,SAAA,EAAA;AACP,YAAA,sBAAsB,CAAC,EAAC,UAAU,EAAE,kBAAkB,EAAC,CAAC;AACxD,YAAA,sBAAsB,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAC,CAAC;AAChD,SAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,OAAA,EAAA,SAAA,EAMgB,OAAO,EAAS,IAAA,EAAA,WAAW,ECpDhD,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,ktFA2EA,omBD7CQ,SAAS,EAAA,IAAA,EAAA,OAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACT,OAAO,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACP,IAAI,EACJ,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,EAChB,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,SAAS,wnBAGT,OAAO,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,yBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;4FAcF,cAAc,EAAA,UAAA,EAAA,CAAA;kBAzB1B,SAAS;iCACM,IAAI,EAAA,QAAA,EACN,iBAAiB,EAClB,OAAA,EAAA;wBACL,SAAS;wBACT,OAAO;wBACP,IAAI;wBACJ,gBAAgB;wBAChB,SAAS;wBACT,WAAW;wBACX,WAAW;wBACX,OAAO;wBACP,gBAAgB;qBACnB,EAGgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACpC,SAAA,EAAA;AACP,wBAAA,sBAAsB,CAAC,EAAC,UAAU,EAAE,kBAAkB,EAAC,CAAC;AACxD,wBAAA,sBAAsB,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAC,CAAC;qBAChD,EACK,IAAA,EAAA;AACF,wBAAA,kBAAkB,EAAE,MAAM;AAC7B,qBAAA,EAAA,QAAA,EAAA,ktFAAA,EAAA,MAAA,EAAA,CAAA,ijBAAA,CAAA,EAAA,CAAA;8BAIkB,KAAK,EAAA,CAAA;sBADvB,eAAe;AAAC,gBAAA,IAAA,EAAA,CAAA,OAAO,EAAE,EAAC,IAAI,EAAE,WAAW,EAAC,CAAA;gBAStC,IAAI,EAAA,CAAA;sBADV,KAAK;gBAIC,UAAU,EAAA,CAAA;sBADhB,KAAK;;;AE/DV;;AAEG;;;;"}
|
|
@@ -14,7 +14,7 @@ import { tuiAppearanceOptionsProvider, TuiAppearance, TuiWithAppearance } from '
|
|
|
14
14
|
import { TuiHintOverflow } from '@taiga-ui/core/directives/hint';
|
|
15
15
|
import { TUI_COMMON_ICONS } from '@taiga-ui/core/tokens';
|
|
16
16
|
import { TUI_DIGITAL_INFORMATION_UNITS, TUI_FILE_TEXTS, TUI_HIDE_TEXT, TUI_SHOW_ALL_TEXT, TUI_INPUT_FILE_TEXTS } from '@taiga-ui/kit/tokens';
|
|
17
|
-
import { PolymorpheusOutlet,
|
|
17
|
+
import { PolymorpheusOutlet, injectContext, PolymorpheusComponent, PolymorpheusTemplate } from '@taiga-ui/polymorpheus';
|
|
18
18
|
import { map, of, combineLatest, timer, switchMap, filter } from 'rxjs';
|
|
19
19
|
import { tuiCreateOptions } from '@taiga-ui/cdk/utils/di';
|
|
20
20
|
import { coerceArray } from '@angular/cdk/coercion';
|
|
@@ -185,7 +185,7 @@ class TuiFile {
|
|
|
185
185
|
return dot > 0 ? file.name.slice(dot) : '';
|
|
186
186
|
}
|
|
187
187
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiFile, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
188
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiFile, isStandalone: true, selector: "tui-file,a[tuiFile],button[tuiFile]", inputs: { file: "file", state: "state", size: "size", showDelete: "showDelete", showSize: "showSize", leftContent: "leftContent" }, outputs: { remove: "remove" }, host: { properties: { "attr.data-delete": "showDelete" } }, providers: [tuiAppearanceOptionsProvider(TUI_FILE_OPTIONS)], hostDirectives: [{ directive: i1.TuiAppearance }], ngImport: i0, template: "<div\n class=\"t-preview\"\n [class.t-preview_big]=\"isBig\"\n>\n <ng-container *polymorpheusOutlet=\"leftContent || defaultLeftContent as text\">\n {{ text }}\n </ng-container>\n</div>\n<div class=\"t-wrapper\">\n <div class=\"t-text\">\n <div\n tuiHintOverflow\n class=\"t-name\"\n >\n {{ name }}\n </div>\n <div class=\"t-type\">{{ type }}</div>\n <div\n *ngIf=\"showSize && (fileSize$ | async) as fileSize\"\n class=\"t-size\"\n >\n {{ fileSize }}\n </div>\n </div>\n <div\n *ngIf=\"content$ | async as content\"\n class=\"t-content\"\n >\n <ng-container *polymorpheusOutlet=\"content as text\">\n {{ text }}\n </ng-container>\n </div>\n <ng-content />\n</div>\n<ng-container *ngIf=\"allowDelete\">\n <button\n *ngIf=\"fileTexts$ | async as texts\"\n appearance=\"icon\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-remove\"\n [iconStart]=\"icons.close\"\n (click.prevent)=\"remove.emit()\"\n (mousedown.prevent.zoneless)=\"(0)\"\n >\n {{ texts.remove }}\n </button>\n</ng-container>\n\n<ng-template #defaultLeftContent>\n <img\n *ngIf=\"preview; else loader\"\n alt=\"file preview\"\n class=\"t-image\"\n [src]=\"preview\"\n />\n <ng-template #loader>\n <tui-loader\n *ngIf=\"isLoading; else svg\"\n class=\"t-loader\"\n [inheritColor]=\"isBig\"\n />\n </ng-template>\n <ng-template #svg>\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: size}\"\n class=\"t-icon\"\n [class.t-icon_blank]=\"isBig || isDeleted\"\n [class.t-icon_error]=\"isError\"\n [icon]=\"src.toString()\"\n />\n </ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:flex;align-items:center;font:var(--tui-font-text-m);padding:.625rem
|
|
188
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiFile, isStandalone: true, selector: "tui-file,a[tuiFile],button[tuiFile]", inputs: { file: "file", state: "state", size: "size", showDelete: "showDelete", showSize: "showSize", leftContent: "leftContent" }, outputs: { remove: "remove" }, host: { properties: { "attr.data-delete": "showDelete" } }, providers: [tuiAppearanceOptionsProvider(TUI_FILE_OPTIONS)], hostDirectives: [{ directive: i1.TuiAppearance }], ngImport: i0, template: "<div\n class=\"t-preview\"\n [class.t-preview_big]=\"isBig\"\n>\n <ng-container *polymorpheusOutlet=\"leftContent || defaultLeftContent as text\">\n {{ text }}\n </ng-container>\n</div>\n<div class=\"t-wrapper\">\n <div class=\"t-text\">\n <div\n tuiHintOverflow\n class=\"t-name\"\n >\n {{ name }}\n </div>\n <div class=\"t-type\">{{ type }}</div>\n <div\n *ngIf=\"showSize && (fileSize$ | async) as fileSize\"\n class=\"t-size\"\n >\n {{ fileSize }}\n </div>\n </div>\n <div\n *ngIf=\"content$ | async as content\"\n class=\"t-content\"\n >\n <ng-container *polymorpheusOutlet=\"content as text\">\n {{ text }}\n </ng-container>\n </div>\n <ng-content />\n</div>\n<ng-container *ngIf=\"allowDelete\">\n <button\n *ngIf=\"fileTexts$ | async as texts\"\n appearance=\"icon\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-remove\"\n [iconStart]=\"icons.close\"\n (click.prevent)=\"remove.emit()\"\n (mousedown.prevent.zoneless)=\"(0)\"\n >\n {{ texts.remove }}\n </button>\n</ng-container>\n\n<ng-template #defaultLeftContent>\n <img\n *ngIf=\"preview; else loader\"\n alt=\"file preview\"\n class=\"t-image\"\n [src]=\"preview\"\n />\n <ng-template #loader>\n <tui-loader\n *ngIf=\"isLoading; else svg\"\n class=\"t-loader\"\n [inheritColor]=\"isBig\"\n />\n </ng-template>\n <ng-template #svg>\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: size}\"\n class=\"t-icon\"\n [class.t-icon_blank]=\"isBig || isDeleted\"\n [class.t-icon_error]=\"isError\"\n [icon]=\"src.toString()\"\n />\n </ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:flex;align-items:center;font:var(--tui-font-text-m);padding:.625rem;padding-inline-end:2.25rem;text-decoration:none;border-radius:var(--tui-radius-m)}:host:hover .t-remove,:host[data-delete=always] .t-remove{opacity:1}.t-preview{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;inline-size:1.5rem;block-size:1.5rem;margin-inline-end:.75rem;border-radius:var(--tui-radius-m);overflow:hidden;color:var(--tui-text-tertiary)}.t-preview_big{inline-size:4rem;block-size:4rem;margin-inline-end:1rem}.t-preview_big:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";background:var(--tui-background-neutral-1)}.t-image{max-inline-size:100%;max-block-size:100%}.t-loader{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}.t-icon{position:absolute;top:0;left:0;bottom:0;right:0;color:var(--tui-status-positive);margin:auto}.t-icon_blank{color:var(--tui-text-tertiary)}.t-icon_error{color:var(--tui-text-negative)}.t-remove{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.625rem;right:.625rem}@supports (inset-inline-end: 0){.t-remove{right:unset;inset-inline-end:.625rem}}.t-remove:focus{opacity:1}.t-remove:focus-visible{box-shadow:inset 0 0 0 2px var(--tui-border-focus)}@media (hover: hover) and (pointer: fine){.t-remove{opacity:0}}.t-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;overflow:hidden;color:var(--tui-text-primary)}.t-text{display:flex}.t-size{flex-shrink:0;opacity:var(--tui-disabled-opacity);margin-inline-start:.5rem}.t-type{flex-shrink:0}.t-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-content{font:var(--tui-font-text-s);color:var(--tui-text-negative)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiButton, selector: "a[tuiButton],button[tuiButton],a[tuiIconButton],button[tuiIconButton]", inputs: ["size"] }, { kind: "directive", type: TuiHintOverflow, selector: "[tuiHintOverflow]", inputs: ["tuiHintOverflow"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }, { kind: "component", type: TuiLoader, selector: "tui-loader", inputs: ["size", "inheritColor", "overlay", "textContent", "showLoader"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
189
189
|
}
|
|
190
190
|
__decorate([
|
|
191
191
|
tuiPure
|
|
@@ -207,14 +207,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
207
207
|
args: [{ standalone: true, selector: 'tui-file,a[tuiFile],button[tuiFile]', imports: [
|
|
208
208
|
CommonModule,
|
|
209
209
|
PolymorpheusOutlet,
|
|
210
|
-
PolymorpheusTemplate,
|
|
211
210
|
TuiButton,
|
|
212
211
|
TuiHintOverflow,
|
|
213
212
|
TuiIcon,
|
|
214
213
|
TuiLoader,
|
|
215
214
|
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [tuiAppearanceOptionsProvider(TUI_FILE_OPTIONS)], hostDirectives: [TuiAppearance], host: {
|
|
216
215
|
'[attr.data-delete]': 'showDelete',
|
|
217
|
-
}, template: "<div\n class=\"t-preview\"\n [class.t-preview_big]=\"isBig\"\n>\n <ng-container *polymorpheusOutlet=\"leftContent || defaultLeftContent as text\">\n {{ text }}\n </ng-container>\n</div>\n<div class=\"t-wrapper\">\n <div class=\"t-text\">\n <div\n tuiHintOverflow\n class=\"t-name\"\n >\n {{ name }}\n </div>\n <div class=\"t-type\">{{ type }}</div>\n <div\n *ngIf=\"showSize && (fileSize$ | async) as fileSize\"\n class=\"t-size\"\n >\n {{ fileSize }}\n </div>\n </div>\n <div\n *ngIf=\"content$ | async as content\"\n class=\"t-content\"\n >\n <ng-container *polymorpheusOutlet=\"content as text\">\n {{ text }}\n </ng-container>\n </div>\n <ng-content />\n</div>\n<ng-container *ngIf=\"allowDelete\">\n <button\n *ngIf=\"fileTexts$ | async as texts\"\n appearance=\"icon\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-remove\"\n [iconStart]=\"icons.close\"\n (click.prevent)=\"remove.emit()\"\n (mousedown.prevent.zoneless)=\"(0)\"\n >\n {{ texts.remove }}\n </button>\n</ng-container>\n\n<ng-template #defaultLeftContent>\n <img\n *ngIf=\"preview; else loader\"\n alt=\"file preview\"\n class=\"t-image\"\n [src]=\"preview\"\n />\n <ng-template #loader>\n <tui-loader\n *ngIf=\"isLoading; else svg\"\n class=\"t-loader\"\n [inheritColor]=\"isBig\"\n />\n </ng-template>\n <ng-template #svg>\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: size}\"\n class=\"t-icon\"\n [class.t-icon_blank]=\"isBig || isDeleted\"\n [class.t-icon_error]=\"isError\"\n [icon]=\"src.toString()\"\n />\n </ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:flex;align-items:center;font:var(--tui-font-text-m);padding:.625rem
|
|
216
|
+
}, template: "<div\n class=\"t-preview\"\n [class.t-preview_big]=\"isBig\"\n>\n <ng-container *polymorpheusOutlet=\"leftContent || defaultLeftContent as text\">\n {{ text }}\n </ng-container>\n</div>\n<div class=\"t-wrapper\">\n <div class=\"t-text\">\n <div\n tuiHintOverflow\n class=\"t-name\"\n >\n {{ name }}\n </div>\n <div class=\"t-type\">{{ type }}</div>\n <div\n *ngIf=\"showSize && (fileSize$ | async) as fileSize\"\n class=\"t-size\"\n >\n {{ fileSize }}\n </div>\n </div>\n <div\n *ngIf=\"content$ | async as content\"\n class=\"t-content\"\n >\n <ng-container *polymorpheusOutlet=\"content as text\">\n {{ text }}\n </ng-container>\n </div>\n <ng-content />\n</div>\n<ng-container *ngIf=\"allowDelete\">\n <button\n *ngIf=\"fileTexts$ | async as texts\"\n appearance=\"icon\"\n size=\"xs\"\n tuiIconButton\n type=\"button\"\n class=\"t-remove\"\n [iconStart]=\"icons.close\"\n (click.prevent)=\"remove.emit()\"\n (mousedown.prevent.zoneless)=\"(0)\"\n >\n {{ texts.remove }}\n </button>\n</ng-container>\n\n<ng-template #defaultLeftContent>\n <img\n *ngIf=\"preview; else loader\"\n alt=\"file preview\"\n class=\"t-image\"\n [src]=\"preview\"\n />\n <ng-template #loader>\n <tui-loader\n *ngIf=\"isLoading; else svg\"\n class=\"t-loader\"\n [inheritColor]=\"isBig\"\n />\n </ng-template>\n <ng-template #svg>\n <tui-icon\n *polymorpheusOutlet=\"icon as src; context: {$implicit: size}\"\n class=\"t-icon\"\n [class.t-icon_blank]=\"isBig || isDeleted\"\n [class.t-icon_error]=\"isError\"\n [icon]=\"src.toString()\"\n />\n </ng-template>\n</ng-template>\n", styles: [":host{position:relative;display:flex;align-items:center;font:var(--tui-font-text-m);padding:.625rem;padding-inline-end:2.25rem;text-decoration:none;border-radius:var(--tui-radius-m)}:host:hover .t-remove,:host[data-delete=always] .t-remove{opacity:1}.t-preview{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;inline-size:1.5rem;block-size:1.5rem;margin-inline-end:.75rem;border-radius:var(--tui-radius-m);overflow:hidden;color:var(--tui-text-tertiary)}.t-preview_big{inline-size:4rem;block-size:4rem;margin-inline-end:1rem}.t-preview_big:before{position:absolute;top:0;left:0;inline-size:100%;block-size:100%;content:\"\";background:var(--tui-background-neutral-1)}.t-image{max-inline-size:100%;max-block-size:100%}.t-loader{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}.t-icon{position:absolute;top:0;left:0;bottom:0;right:0;color:var(--tui-status-positive);margin:auto}.t-icon_blank{color:var(--tui-text-tertiary)}.t-icon_error{color:var(--tui-text-negative)}.t-remove{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;top:.625rem;right:.625rem}@supports (inset-inline-end: 0){.t-remove{right:unset;inset-inline-end:.625rem}}.t-remove:focus{opacity:1}.t-remove:focus-visible{box-shadow:inset 0 0 0 2px var(--tui-border-focus)}@media (hover: hover) and (pointer: fine){.t-remove{opacity:0}}.t-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;overflow:hidden;color:var(--tui-text-primary)}.t-text{display:flex}.t-size{flex-shrink:0;opacity:var(--tui-disabled-opacity);margin-inline-start:.5rem}.t-type{flex-shrink:0}.t-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-content{font:var(--tui-font-text-s);color:var(--tui-text-negative)}\n"] }]
|
|
218
217
|
}], propDecorators: { file: [{
|
|
219
218
|
type: Input
|
|
220
219
|
}], state: [{
|