@taiga-ui/kit 4.1.0 → 4.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/accordion/accordion.directive.d.ts +1 -0
- package/components/carousel/carousel.component.d.ts +1 -1
- package/components/input-phone-international/input-phone-international.options.d.ts +1 -1
- package/components/segmented/segmented.directive.d.ts +2 -3
- package/components/slider/slider.component.d.ts +1 -1
- package/components/tiles/tile-handle.directive.d.ts +1 -1
- package/directives/button-select/button-select.directive.d.ts +12 -0
- package/directives/button-select/index.d.ts +1 -0
- package/directives/index.d.ts +1 -0
- package/esm2022/components/accordion/accordion-item.component.mjs +11 -27
- package/esm2022/components/accordion/accordion.directive.mjs +8 -17
- package/esm2022/components/avatar/avatar-labeled.component.mjs +3 -6
- package/esm2022/components/avatar/avatar-stack.component.mjs +6 -7
- package/esm2022/components/breadcrumbs/breadcrumbs.component.mjs +6 -7
- package/esm2022/components/button-loading/button-loading.component.mjs +3 -5
- package/esm2022/components/calendar-month/calendar-month.component.mjs +6 -7
- package/esm2022/components/calendar-range/calendar-range.component.mjs +5 -6
- package/esm2022/components/carousel/carousel.component.mjs +17 -28
- package/esm2022/components/checkbox/checkbox.options.mjs +3 -3
- package/esm2022/components/compass/compass.component.mjs +6 -7
- package/esm2022/components/elastic-container/elastic-container.component.mjs +8 -11
- package/esm2022/components/elastic-container/elastic-container.directive.mjs +2 -2
- package/esm2022/components/files/file/file.component.mjs +6 -7
- package/esm2022/components/files/input-files/input-files-validator.directive.mjs +6 -6
- package/esm2022/components/files/input-files/input-files.component.mjs +3 -5
- package/esm2022/components/files/pipes/file-rejected.pipe.mjs +3 -2
- package/esm2022/components/filter/filter.component.mjs +6 -7
- package/esm2022/components/input-inline/input-inline.component.mjs +5 -6
- package/esm2022/components/input-phone-international/input-phone-international.component.mjs +3 -3
- package/esm2022/components/input-phone-international/input-phone-international.options.mjs +3 -3
- package/esm2022/components/items-with-more/items-with-more.service.mjs +2 -2
- package/esm2022/components/line-clamp/line-clamp-box.component.mjs +7 -8
- package/esm2022/components/line-clamp/line-clamp.component.mjs +5 -6
- package/esm2022/components/pagination/pagination.component.mjs +4 -12
- package/esm2022/components/pdf-viewer/pdf-viewer.component.mjs +4 -6
- package/esm2022/components/pin/pin.directive.mjs +6 -6
- package/esm2022/components/preview/pagination/preview-pagination.component.mjs +6 -9
- package/esm2022/components/preview/zoom/preview-zoom.component.mjs +3 -3
- package/esm2022/components/progress/progress-bar/progress-bar.component.mjs +7 -10
- package/esm2022/components/progress/progress-bar/progress-color-segments.directive.mjs +2 -2
- package/esm2022/components/progress/progress-circle/progress-circle.component.mjs +8 -13
- package/esm2022/components/radio-list/radio-list.component.mjs +7 -10
- package/esm2022/components/range/range.component.mjs +9 -19
- package/esm2022/components/rating/rating.component.mjs +12 -29
- package/esm2022/components/segmented/segmented.component.mjs +8 -9
- package/esm2022/components/segmented/segmented.directive.mjs +17 -21
- package/esm2022/components/slider/helpers/slider-key-steps.directive.mjs +4 -8
- package/esm2022/components/slider/helpers/slider-readonly.directive.mjs +7 -9
- package/esm2022/components/slider/slider.component.mjs +8 -12
- package/esm2022/components/stepper/step.component.mjs +12 -23
- package/esm2022/components/stepper/stepper.component.mjs +12 -21
- package/esm2022/components/switch/switch.component.mjs +4 -6
- package/esm2022/components/tabs/tabs-horizontal.directive.mjs +7 -13
- package/esm2022/components/tabs/tabs-vertical.directive.mjs +8 -12
- package/esm2022/components/tabs/tabs.directive.mjs +7 -7
- package/esm2022/components/tiles/tile-handle.directive.mjs +15 -21
- package/esm2022/components/tiles/tile.component.mjs +9 -16
- package/esm2022/components/tiles/tiles.component.mjs +7 -10
- package/esm2022/components/tree/components/tree-item/tree-item.component.mjs +4 -6
- package/esm2022/components/tree/components/tree-item-content/tree-item-content.component.mjs +7 -8
- package/esm2022/directives/button-select/button-select.directive.mjs +41 -0
- package/esm2022/directives/button-select/index.mjs +2 -0
- package/esm2022/directives/button-select/taiga-ui-kit-directives-button-select.mjs +5 -0
- package/esm2022/directives/fade/fade.directive.mjs +11 -19
- package/esm2022/directives/fluid-typography/fluid-typography.directive.mjs +2 -2
- package/esm2022/directives/highlight/highlight.directive.mjs +2 -2
- package/esm2022/directives/index.mjs +2 -1
- package/esm2022/directives/lazy-loading/lazy-loading.directive.mjs +15 -20
- package/esm2022/directives/present/present.directive.mjs +4 -8
- package/esm2022/directives/sensitive/sensitive.directive.mjs +2 -2
- package/esm2022/directives/tooltip/tooltip.directive.mjs +7 -7
- package/fesm2022/taiga-ui-kit-components-accordion.mjs +16 -41
- package/fesm2022/taiga-ui-kit-components-accordion.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-avatar.mjs +6 -10
- package/fesm2022/taiga-ui-kit-components-avatar.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-breadcrumbs.mjs +5 -6
- package/fesm2022/taiga-ui-kit-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-button-loading.mjs +2 -4
- package/fesm2022/taiga-ui-kit-components-button-loading.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-calendar-month.mjs +5 -6
- package/fesm2022/taiga-ui-kit-components-calendar-month.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-calendar-range.mjs +4 -5
- package/fesm2022/taiga-ui-kit-components-calendar-range.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-carousel.mjs +16 -27
- package/fesm2022/taiga-ui-kit-components-carousel.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-checkbox.mjs +2 -2
- package/fesm2022/taiga-ui-kit-components-checkbox.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-compass.mjs +5 -6
- package/fesm2022/taiga-ui-kit-components-compass.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-elastic-container.mjs +8 -11
- package/fesm2022/taiga-ui-kit-components-elastic-container.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-files.mjs +12 -15
- package/fesm2022/taiga-ui-kit-components-files.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-filter.mjs +5 -6
- package/fesm2022/taiga-ui-kit-components-filter.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-input-inline.mjs +4 -5
- package/fesm2022/taiga-ui-kit-components-input-inline.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-input-phone-international.mjs +4 -4
- package/fesm2022/taiga-ui-kit-components-input-phone-international.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-items-with-more.mjs +1 -1
- package/fesm2022/taiga-ui-kit-components-items-with-more.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-line-clamp.mjs +9 -11
- package/fesm2022/taiga-ui-kit-components-line-clamp.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-pagination.mjs +3 -11
- package/fesm2022/taiga-ui-kit-components-pagination.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-pdf-viewer.mjs +3 -5
- package/fesm2022/taiga-ui-kit-components-pdf-viewer.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-pin.mjs +5 -5
- package/fesm2022/taiga-ui-kit-components-pin.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-preview.mjs +7 -10
- package/fesm2022/taiga-ui-kit-components-preview.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-progress.mjs +13 -21
- package/fesm2022/taiga-ui-kit-components-progress.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-radio-list.mjs +6 -9
- package/fesm2022/taiga-ui-kit-components-radio-list.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-range.mjs +8 -18
- package/fesm2022/taiga-ui-kit-components-range.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-rating.mjs +11 -28
- package/fesm2022/taiga-ui-kit-components-rating.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-segmented.mjs +22 -26
- package/fesm2022/taiga-ui-kit-components-segmented.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-slider.mjs +14 -24
- package/fesm2022/taiga-ui-kit-components-slider.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-stepper.mjs +21 -41
- package/fesm2022/taiga-ui-kit-components-stepper.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-switch.mjs +3 -5
- package/fesm2022/taiga-ui-kit-components-switch.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-tabs.mjs +17 -27
- package/fesm2022/taiga-ui-kit-components-tabs.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-tiles.mjs +26 -42
- package/fesm2022/taiga-ui-kit-components-tiles.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-components-tree.mjs +8 -11
- package/fesm2022/taiga-ui-kit-components-tree.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-button-select.mjs +47 -0
- package/fesm2022/taiga-ui-kit-directives-button-select.mjs.map +1 -0
- package/fesm2022/taiga-ui-kit-directives-fade.mjs +10 -18
- package/fesm2022/taiga-ui-kit-directives-fade.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-fluid-typography.mjs +1 -1
- package/fesm2022/taiga-ui-kit-directives-fluid-typography.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-highlight.mjs +1 -1
- package/fesm2022/taiga-ui-kit-directives-highlight.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-lazy-loading.mjs +14 -19
- package/fesm2022/taiga-ui-kit-directives-lazy-loading.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-present.mjs +3 -7
- package/fesm2022/taiga-ui-kit-directives-present.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-sensitive.mjs +1 -1
- package/fesm2022/taiga-ui-kit-directives-sensitive.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives-tooltip.mjs +6 -6
- package/fesm2022/taiga-ui-kit-directives-tooltip.mjs.map +1 -1
- package/fesm2022/taiga-ui-kit-directives.mjs +1 -0
- package/fesm2022/taiga-ui-kit-directives.mjs.map +1 -1
- package/package.json +14 -8
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { AsyncPipe, NgIf } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { inject, ChangeDetectorRef, DestroyRef, EventEmitter, ElementRef, Component, ChangeDetectionStrategy, ContentChildren, forwardRef, Input,
|
|
3
|
+
import { inject, ChangeDetectorRef, DestroyRef, EventEmitter, ElementRef, Component, ChangeDetectionStrategy, ContentChildren, forwardRef, Input, Output } from '@angular/core';
|
|
4
4
|
import { RouterLinkActive } from '@angular/router';
|
|
5
5
|
import { tuiInjectElement, tuiIsElement } from '@taiga-ui/cdk/utils/dom';
|
|
6
6
|
import { TuiIcon } from '@taiga-ui/core/components/icon';
|
|
@@ -27,7 +27,7 @@ class TuiStepperComponent {
|
|
|
27
27
|
this.activeItemIndex = 0;
|
|
28
28
|
this.orientation = 'horizontal';
|
|
29
29
|
this.activeItemIndexChange = new EventEmitter();
|
|
30
|
-
inject(ResizeObserverService)
|
|
30
|
+
inject(ResizeObserverService, { self: true })
|
|
31
31
|
.pipe(takeUntilDestroyed())
|
|
32
32
|
.subscribe(() => this.scrollIntoView(this.activeItemIndex));
|
|
33
33
|
}
|
|
@@ -92,40 +92,31 @@ class TuiStepperComponent {
|
|
|
92
92
|
.subscribe();
|
|
93
93
|
}
|
|
94
94
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
95
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiStepperComponent, isStandalone: true, selector: "tui-stepper, nav[tuiStepper]", inputs: { orientation: "orientation", activeIndex: ["activeItemIndex", "activeIndex"] }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { listeners: { "keydown.arrowRight": "onHorizontal($event,1)", "keydown.arrowLeft": "onHorizontal($event
|
|
95
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiStepperComponent, isStandalone: true, selector: "tui-stepper, nav[tuiStepper]", inputs: { orientation: "orientation", activeIndex: ["activeItemIndex", "activeIndex"] }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { listeners: { "keydown.arrowRight": "onHorizontal($event, 1)", "keydown.arrowLeft": "onHorizontal($event, -1)", "keydown.arrowDown": "onVertical($event, 1)", "keydown.arrowUp": "onVertical($event, -1)" }, properties: { "attr.data-orientation": "orientation" } }, providers: [ResizeObserverService], queries: [{ propertyName: "steps", predicate: i0.forwardRef(function () { return TuiStep; }), read: ElementRef }], ngImport: i0, template: "<ng-container *ngIf=\"changes$ | async\" />\n<ng-content />\n", styles: [":host{scrollbar-width:none;-ms-overflow-style:none;display:flex;scroll-behavior:var(--tui-scroll-behavior);overflow:auto;counter-reset:steps}:host::-webkit-scrollbar,:host::-webkit-scrollbar-thumb{display:none}:host[data-orientation=vertical]{flex-direction:column}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
96
96
|
}
|
|
97
97
|
__decorate([
|
|
98
98
|
tuiPure
|
|
99
99
|
], TuiStepperComponent.prototype, "changes$", null);
|
|
100
100
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiStepperComponent, decorators: [{
|
|
101
101
|
type: Component,
|
|
102
|
-
args: [{ standalone: true, selector: 'tui-stepper, nav[tuiStepper]', imports: [AsyncPipe, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ResizeObserverService],
|
|
102
|
+
args: [{ standalone: true, selector: 'tui-stepper, nav[tuiStepper]', imports: [AsyncPipe, NgIf], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ResizeObserverService], host: {
|
|
103
|
+
'[attr.data-orientation]': 'orientation',
|
|
104
|
+
'(keydown.arrowRight)': 'onHorizontal($event, 1)',
|
|
105
|
+
'(keydown.arrowLeft)': 'onHorizontal($event, -1)',
|
|
106
|
+
'(keydown.arrowDown)': 'onVertical($event, 1)',
|
|
107
|
+
'(keydown.arrowUp)': 'onVertical($event, -1)',
|
|
108
|
+
}, template: "<ng-container *ngIf=\"changes$ | async\" />\n<ng-content />\n", styles: [":host{scrollbar-width:none;-ms-overflow-style:none;display:flex;scroll-behavior:var(--tui-scroll-behavior);overflow:auto;counter-reset:steps}:host::-webkit-scrollbar,:host::-webkit-scrollbar-thumb{display:none}:host[data-orientation=vertical]{flex-direction:column}\n"] }]
|
|
103
109
|
}], ctorParameters: function () { return []; }, propDecorators: { steps: [{
|
|
104
110
|
type: ContentChildren,
|
|
105
111
|
args: [forwardRef(() => TuiStep), { read: ElementRef }]
|
|
106
112
|
}], orientation: [{
|
|
107
113
|
type: Input
|
|
108
|
-
}, {
|
|
109
|
-
type: HostBinding,
|
|
110
|
-
args: ['attr.data-orientation']
|
|
111
114
|
}], activeItemIndexChange: [{
|
|
112
115
|
type: Output
|
|
113
116
|
}], activeIndex: [{
|
|
114
117
|
type: Input,
|
|
115
118
|
args: ['activeItemIndex']
|
|
116
|
-
}], changes$: []
|
|
117
|
-
type: HostListener,
|
|
118
|
-
args: ['keydown.arrowRight', ['$event', '1']]
|
|
119
|
-
}, {
|
|
120
|
-
type: HostListener,
|
|
121
|
-
args: ['keydown.arrowLeft', ['$event', '-1']]
|
|
122
|
-
}], onVertical: [{
|
|
123
|
-
type: HostListener,
|
|
124
|
-
args: ['keydown.arrowDown', ['$event', '1']]
|
|
125
|
-
}, {
|
|
126
|
-
type: HostListener,
|
|
127
|
-
args: ['keydown.arrowUp', ['$event', '-1']]
|
|
128
|
-
}] } });
|
|
119
|
+
}], changes$: [] } });
|
|
129
120
|
|
|
130
121
|
class TuiStep {
|
|
131
122
|
constructor() {
|
|
@@ -156,33 +147,22 @@ class TuiStep {
|
|
|
156
147
|
this.stepper.activate(this.index);
|
|
157
148
|
}
|
|
158
149
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiStep, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
159
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiStep, isStandalone: true, selector: "button[tuiStep], a[tuiStep]:not([routerLink]), a[tuiStep][routerLink][routerLinkActive]", inputs: { stepState: "stepState", icon: "icon" }, host: { listeners: { "click": "activate()" }, properties: { "
|
|
150
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiStep, isStandalone: true, selector: "button[tuiStep], a[tuiStep]:not([routerLink]), a[tuiStep][routerLink][routerLinkActive]", inputs: { stepState: "stepState", icon: "icon" }, host: { listeners: { "click": "activate()" }, properties: { "attr.data-state": "stepState", "class._vertical": "isVertical", "class._focus-visible": "focusVisible", "class._active": "isActive", "tabIndex": "tabIndex" } }, ngImport: i0, template: "<tui-icon\n *ngIf=\"icon\"\n class=\"t-marker t-marker_custom\"\n [icon]=\"icon\"\n/>\n<tui-icon\n class=\"t-marker t-marker_error\"\n [icon]=\"icons.error\"\n/>\n<tui-icon\n class=\"t-marker t-marker_pass\"\n [icon]=\"icons.check\"\n/>\n<div class=\"t-marker t-marker_index\"></div>\n<ng-content />\n", styles: [":host{-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;text-decoration:none;position:relative;display:flex;align-items:center;flex-shrink:0;color:var(--tui-text-action);margin-right:1.5rem;outline:none;cursor:pointer;counter-increment:steps;text-align:left}:host:disabled{pointer-events:none;color:var(--tui-text-secondary)}:host:hover{color:var(--tui-text-action-hover)}:host:not(:last-of-type)._vertical{margin-bottom:1.25rem}:host._active,:host._active:hover{color:var(--tui-text-primary);cursor:default}:host:focus-visible:before{content:\"\";position:absolute;left:2.75rem;right:0;top:50%;height:1.5rem;margin-top:-.75rem;background:var(--tui-service-selection-background)}.t-marker{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;display:flex;width:2rem;height:2rem;border-radius:100%;margin-right:.75rem;flex-shrink:0;align-items:center;align-self:flex-start;justify-content:center;background:var(--tui-background-neutral-1);color:var(--tui-text-action);border:.5rem solid transparent;box-sizing:border-box}:host:disabled .t-marker{background:var(--tui-background-neutral-1);color:var(--tui-text-secondary)}.t-marker_index:before{content:counter(steps)}:host:hover .t-marker_index{color:var(--tui-text-action-hover);background:var(--tui-background-neutral-1-hover)}:host._active .t-marker_index{color:var(--tui-text-primary-on-accent-1);background:var(--tui-background-accent-1)}:host:not([data-state=normal]):not(._active) .t-marker_index,:host:not(._active) .t-marker_custom~.t-marker_index{display:none}.t-marker_error{background:var(--tui-status-negative-pale);color:var(--tui-status-negative)}:host:hover .t-marker_error{background:var(--tui-status-negative-pale-hover);color:var(--tui-status-negative)}:host:not([data-state=error]) .t-marker_error,:host._active .t-marker_error{display:none}:host:not([data-state=pass]) .t-marker_pass,:host._active .t-marker_pass{display:none}:host:not([data-state=normal]) .t-marker_custom,:host._active .t-marker_custom{display:none}:host:hover .t-marker_custom{color:var(--tui-text-action-hover);background:var(--tui-background-neutral-1-hover)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TuiIcon, selector: "tui-icon", inputs: ["icon", "background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
160
151
|
}
|
|
161
152
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiStep, decorators: [{
|
|
162
153
|
type: Component,
|
|
163
|
-
args: [{ standalone: true, selector: 'button[tuiStep], a[tuiStep]:not([routerLink]), a[tuiStep][routerLink][routerLinkActive]', imports: [NgIf, TuiIcon], changeDetection: ChangeDetectionStrategy.OnPush,
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
154
|
+
args: [{ standalone: true, selector: 'button[tuiStep], a[tuiStep]:not([routerLink]), a[tuiStep][routerLink][routerLinkActive]', imports: [NgIf, TuiIcon], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
155
|
+
'[attr.data-state]': 'stepState',
|
|
156
|
+
'[class._vertical]': 'isVertical',
|
|
157
|
+
'[class._focus-visible]': 'focusVisible',
|
|
158
|
+
'[class._active]': 'isActive',
|
|
159
|
+
'[tabIndex]': 'tabIndex',
|
|
160
|
+
'(click)': 'activate()',
|
|
161
|
+
}, template: "<tui-icon\n *ngIf=\"icon\"\n class=\"t-marker t-marker_custom\"\n [icon]=\"icon\"\n/>\n<tui-icon\n class=\"t-marker t-marker_error\"\n [icon]=\"icons.error\"\n/>\n<tui-icon\n class=\"t-marker t-marker_pass\"\n [icon]=\"icons.check\"\n/>\n<div class=\"t-marker t-marker_index\"></div>\n<ng-content />\n", styles: [":host{-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;font-size:inherit;line-height:inherit;text-decoration:none;position:relative;display:flex;align-items:center;flex-shrink:0;color:var(--tui-text-action);margin-right:1.5rem;outline:none;cursor:pointer;counter-increment:steps;text-align:left}:host:disabled{pointer-events:none;color:var(--tui-text-secondary)}:host:hover{color:var(--tui-text-action-hover)}:host:not(:last-of-type)._vertical{margin-bottom:1.25rem}:host._active,:host._active:hover{color:var(--tui-text-primary);cursor:default}:host:focus-visible:before{content:\"\";position:absolute;left:2.75rem;right:0;top:50%;height:1.5rem;margin-top:-.75rem;background:var(--tui-service-selection-background)}.t-marker{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;display:flex;width:2rem;height:2rem;border-radius:100%;margin-right:.75rem;flex-shrink:0;align-items:center;align-self:flex-start;justify-content:center;background:var(--tui-background-neutral-1);color:var(--tui-text-action);border:.5rem solid transparent;box-sizing:border-box}:host:disabled .t-marker{background:var(--tui-background-neutral-1);color:var(--tui-text-secondary)}.t-marker_index:before{content:counter(steps)}:host:hover .t-marker_index{color:var(--tui-text-action-hover);background:var(--tui-background-neutral-1-hover)}:host._active .t-marker_index{color:var(--tui-text-primary-on-accent-1);background:var(--tui-background-accent-1)}:host:not([data-state=normal]):not(._active) .t-marker_index,:host:not(._active) .t-marker_custom~.t-marker_index{display:none}.t-marker_error{background:var(--tui-status-negative-pale);color:var(--tui-status-negative)}:host:hover .t-marker_error{background:var(--tui-status-negative-pale-hover);color:var(--tui-status-negative)}:host:not([data-state=error]) .t-marker_error,:host._active .t-marker_error{display:none}:host:not([data-state=pass]) .t-marker_pass,:host._active .t-marker_pass{display:none}:host:not([data-state=normal]) .t-marker_custom,:host._active .t-marker_custom{display:none}:host:hover .t-marker_custom{color:var(--tui-text-action-hover);background:var(--tui-background-neutral-1-hover)}\n"] }]
|
|
162
|
+
}], ctorParameters: function () { return []; }, propDecorators: { stepState: [{
|
|
168
163
|
type: Input
|
|
169
|
-
}, {
|
|
170
|
-
type: HostBinding,
|
|
171
|
-
args: ['attr.data-state']
|
|
172
164
|
}], icon: [{
|
|
173
165
|
type: Input
|
|
174
|
-
}], isActive: [{
|
|
175
|
-
type: HostBinding,
|
|
176
|
-
args: ['class._active']
|
|
177
|
-
}], isVertical: [{
|
|
178
|
-
type: HostBinding,
|
|
179
|
-
args: ['class._vertical']
|
|
180
|
-
}], tabIndex: [{
|
|
181
|
-
type: HostBinding,
|
|
182
|
-
args: ['tabIndex']
|
|
183
|
-
}], activate: [{
|
|
184
|
-
type: HostListener,
|
|
185
|
-
args: ['click']
|
|
186
166
|
}] } });
|
|
187
167
|
|
|
188
168
|
const TuiStepper = [TuiStepperComponent, TuiStep];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"taiga-ui-kit-components-stepper.mjs","sources":["../../../projects/kit/components/stepper/stepper.component.ts","../../../projects/kit/components/stepper/stepper.template.html","../../../projects/kit/components/stepper/step.component.ts","../../../projects/kit/components/stepper/step.template.html","../../../projects/kit/components/stepper/stepper.ts","../../../projects/kit/components/stepper/taiga-ui-kit-components-stepper.ts"],"sourcesContent":["import {AsyncPipe, NgIf} from '@angular/common';\nimport type {QueryList} from '@angular/core';\nimport {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n DestroyRef,\n ElementRef,\n EventEmitter,\n forwardRef,\n HostBinding,\n HostListener,\n inject,\n Input,\n Output,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {ResizeObserverService} from '@ng-web-apis/resize-observer';\nimport {EMPTY_QUERY} from '@taiga-ui/cdk/constants';\nimport {tuiQueryListChanges} from '@taiga-ui/cdk/observables';\nimport {TuiScrollService} from '@taiga-ui/cdk/services';\nimport {tuiInjectElement, tuiIsElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiMoveFocus} from '@taiga-ui/cdk/utils/focus';\nimport {\n tuiGetOriginalArrayFromQueryList,\n tuiPure,\n} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_ANIMATIONS_SPEED} from '@taiga-ui/core/tokens';\nimport type {TuiOrientation} from '@taiga-ui/core/types';\nimport {tuiGetDuration} from '@taiga-ui/core/utils/miscellaneous';\nimport type {Observable} from 'rxjs';\nimport {delay} from 'rxjs';\n\nimport {TuiStep} from './step.component';\n\n@Component({\n standalone: true,\n selector: 'tui-stepper, nav[tuiStepper]',\n imports: [AsyncPipe, NgIf],\n templateUrl: './stepper.template.html',\n styleUrls: ['./stepper.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [ResizeObserverService],\n})\nexport class TuiStepperComponent {\n @ContentChildren(forwardRef(() => TuiStep), {read: ElementRef})\n private readonly steps: QueryList<ElementRef<HTMLElement>> = EMPTY_QUERY;\n\n private readonly cdr = inject(ChangeDetectorRef);\n private readonly el = tuiInjectElement();\n private readonly scrollService = inject(TuiScrollService);\n private readonly speed = inject(TUI_ANIMATIONS_SPEED);\n private readonly destroyRef = inject(DestroyRef);\n\n protected activeItemIndex = 0;\n\n @Input()\n @HostBinding('attr.data-orientation')\n public orientation: TuiOrientation = 'horizontal';\n\n @Output()\n public readonly activeItemIndexChange = new EventEmitter<number>();\n\n constructor() {\n inject(ResizeObserverService)\n .pipe(takeUntilDestroyed())\n .subscribe(() => this.scrollIntoView(this.activeItemIndex));\n }\n\n @Input('activeItemIndex')\n public set activeIndex(index: number) {\n this.activeItemIndex = index;\n this.scrollIntoView(index);\n }\n\n public indexOf(step: HTMLElement): number {\n return tuiGetOriginalArrayFromQueryList(this.steps).findIndex(\n ({nativeElement}) => nativeElement === step,\n );\n }\n\n public isActive(index: number): boolean {\n return index === this.activeItemIndex;\n }\n\n public activate(index: number): void {\n if (this.activeItemIndex === index) {\n return;\n }\n\n this.activeItemIndex = index;\n this.activeItemIndexChange.emit(index);\n this.cdr.markForCheck();\n this.scrollIntoView(index);\n }\n\n @tuiPure\n protected get changes$(): Observable<unknown> {\n // Delay is required to trigger change detection after steps are rendered,\n // so they can update their \"active\" status\n return tuiQueryListChanges(this.steps).pipe(delay(0));\n }\n\n @HostListener('keydown.arrowRight', ['$event', '1'])\n @HostListener('keydown.arrowLeft', ['$event', '-1'])\n protected onHorizontal(event: Event, step: number): void {\n if (this.orientation !== 'horizontal' || !event.target) {\n return;\n }\n\n event.preventDefault();\n this.moveFocus(event.target, step);\n }\n\n @HostListener('keydown.arrowDown', ['$event', '1'])\n @HostListener('keydown.arrowUp', ['$event', '-1'])\n protected onVertical(event: Event, step: number): void {\n if (this.orientation !== 'vertical' || !event.target) {\n return;\n }\n\n event.preventDefault();\n this.moveFocus(event.target, step);\n }\n\n private moveFocus(current: EventTarget, step: number): void {\n if (!tuiIsElement(current)) {\n return;\n }\n\n const stepElements = this.steps.toArray().map(({nativeElement}) => nativeElement);\n const index = stepElements.findIndex((element) => element === current);\n\n tuiMoveFocus(index, stepElements, step);\n }\n\n private scrollIntoView(index: number): void {\n const step = this.steps.get(index)?.nativeElement;\n\n if (!step) {\n return;\n }\n\n const {clientHeight, clientWidth, offsetTop, offsetLeft} = this.el;\n const {\n offsetHeight,\n offsetWidth,\n offsetTop: stepOffsetTop,\n offsetLeft: stepOffsetLeft,\n } = step;\n const top = stepOffsetTop - offsetTop - clientHeight / 2 + offsetHeight / 2;\n const left = stepOffsetLeft - offsetLeft - clientWidth / 2 + offsetWidth / 2;\n\n this.scrollService\n .scroll$(\n this.el,\n Math.max(0, top),\n Math.max(0, left),\n tuiGetDuration(this.speed) / 3,\n )\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe();\n }\n}\n","<ng-container *ngIf=\"changes$ | async\" />\n<ng-content />\n","import {NgIf} from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n HostBinding,\n HostListener,\n inject,\n Input,\n} from '@angular/core';\nimport {RouterLinkActive} from '@angular/router';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {TuiIcon} from '@taiga-ui/core/components/icon';\nimport {TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';\nimport type {Observable} from 'rxjs';\nimport {EMPTY, filter} from 'rxjs';\n\nimport {TuiStepperComponent} from './stepper.component';\n\n@Component({\n standalone: true,\n selector:\n 'button[tuiStep], a[tuiStep]:not([routerLink]), a[tuiStep][routerLink][routerLinkActive]',\n imports: [NgIf, TuiIcon],\n templateUrl: './step.template.html',\n styleUrls: ['./step.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TuiStep {\n private readonly stepper = inject(TuiStepperComponent);\n private readonly el = tuiInjectElement();\n private readonly routerLinkActive$: Observable<boolean> =\n inject(RouterLinkActive, {optional: true})?.isActiveChange || EMPTY;\n\n @HostBinding('class._focus-visible')\n protected focusVisible = false;\n\n protected readonly icons = inject(TUI_COMMON_ICONS);\n\n @Input()\n @HostBinding('attr.data-state')\n public stepState: 'error' | 'normal' | 'pass' = 'normal';\n\n @Input()\n public icon = '';\n\n constructor() {\n this.routerLinkActive$.pipe(filter(Boolean)).subscribe(() => {\n this.activate();\n });\n }\n\n @HostBinding('class._active')\n protected get isActive(): boolean {\n return this.stepper.isActive(this.index);\n }\n\n @HostBinding('class._vertical')\n protected get isVertical(): boolean {\n return this.stepper.orientation === 'vertical';\n }\n\n @HostBinding('tabIndex')\n protected get tabIndex(): number {\n return this.isActive ? 0 : -1;\n }\n\n protected get index(): number {\n return this.stepper.indexOf(this.el);\n }\n\n @HostListener('click')\n protected activate(): void {\n this.stepper.activate(this.index);\n }\n}\n","<tui-icon\n *ngIf=\"icon\"\n class=\"t-marker t-marker_custom\"\n [icon]=\"icon\"\n/>\n<tui-icon\n class=\"t-marker t-marker_error\"\n [icon]=\"icons.error\"\n/>\n<tui-icon\n class=\"t-marker t-marker_pass\"\n [icon]=\"icons.check\"\n/>\n<div class=\"t-marker t-marker_index\"></div>\n<ng-content />\n","import {TuiStep} from './step.component';\nimport {TuiStepperComponent} from './stepper.component';\n\nexport const TuiStepper = [TuiStepperComponent, TuiStep] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"taiga-ui-kit-components-stepper.mjs","sources":["../../../projects/kit/components/stepper/stepper.component.ts","../../../projects/kit/components/stepper/stepper.template.html","../../../projects/kit/components/stepper/step.component.ts","../../../projects/kit/components/stepper/step.template.html","../../../projects/kit/components/stepper/stepper.ts","../../../projects/kit/components/stepper/taiga-ui-kit-components-stepper.ts"],"sourcesContent":["import {AsyncPipe, NgIf} from '@angular/common';\nimport type {QueryList} from '@angular/core';\nimport {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ContentChildren,\n DestroyRef,\n ElementRef,\n EventEmitter,\n forwardRef,\n inject,\n Input,\n Output,\n} from '@angular/core';\nimport {takeUntilDestroyed} from '@angular/core/rxjs-interop';\nimport {ResizeObserverService} from '@ng-web-apis/resize-observer';\nimport {EMPTY_QUERY} from '@taiga-ui/cdk/constants';\nimport {tuiQueryListChanges} from '@taiga-ui/cdk/observables';\nimport {TuiScrollService} from '@taiga-ui/cdk/services';\nimport {tuiInjectElement, tuiIsElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiMoveFocus} from '@taiga-ui/cdk/utils/focus';\nimport {\n tuiGetOriginalArrayFromQueryList,\n tuiPure,\n} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TUI_ANIMATIONS_SPEED} from '@taiga-ui/core/tokens';\nimport type {TuiOrientation} from '@taiga-ui/core/types';\nimport {tuiGetDuration} from '@taiga-ui/core/utils/miscellaneous';\nimport type {Observable} from 'rxjs';\nimport {delay} from 'rxjs';\n\nimport {TuiStep} from './step.component';\n\n@Component({\n standalone: true,\n selector: 'tui-stepper, nav[tuiStepper]',\n imports: [AsyncPipe, NgIf],\n templateUrl: './stepper.template.html',\n styleUrls: ['./stepper.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [ResizeObserverService],\n host: {\n '[attr.data-orientation]': 'orientation',\n '(keydown.arrowRight)': 'onHorizontal($event, 1)',\n '(keydown.arrowLeft)': 'onHorizontal($event, -1)',\n '(keydown.arrowDown)': 'onVertical($event, 1)',\n '(keydown.arrowUp)': 'onVertical($event, -1)',\n },\n})\nexport class TuiStepperComponent {\n @ContentChildren(forwardRef(() => TuiStep), {read: ElementRef})\n private readonly steps: QueryList<ElementRef<HTMLElement>> = EMPTY_QUERY;\n\n private readonly cdr = inject(ChangeDetectorRef);\n private readonly el = tuiInjectElement();\n private readonly scrollService = inject(TuiScrollService);\n private readonly speed = inject(TUI_ANIMATIONS_SPEED);\n private readonly destroyRef = inject(DestroyRef);\n\n protected activeItemIndex = 0;\n\n @Input()\n public orientation: TuiOrientation = 'horizontal';\n\n @Output()\n public readonly activeItemIndexChange = new EventEmitter<number>();\n\n constructor() {\n inject(ResizeObserverService, {self: true})\n .pipe(takeUntilDestroyed())\n .subscribe(() => this.scrollIntoView(this.activeItemIndex));\n }\n\n @Input('activeItemIndex')\n public set activeIndex(index: number) {\n this.activeItemIndex = index;\n this.scrollIntoView(index);\n }\n\n public indexOf(step: HTMLElement): number {\n return tuiGetOriginalArrayFromQueryList(this.steps).findIndex(\n ({nativeElement}) => nativeElement === step,\n );\n }\n\n public isActive(index: number): boolean {\n return index === this.activeItemIndex;\n }\n\n public activate(index: number): void {\n if (this.activeItemIndex === index) {\n return;\n }\n\n this.activeItemIndex = index;\n this.activeItemIndexChange.emit(index);\n this.cdr.markForCheck();\n this.scrollIntoView(index);\n }\n\n @tuiPure\n protected get changes$(): Observable<unknown> {\n // Delay is required to trigger change detection after steps are rendered,\n // so they can update their \"active\" status\n return tuiQueryListChanges(this.steps).pipe(delay(0));\n }\n\n protected onHorizontal(event: Event, step: number): void {\n if (this.orientation !== 'horizontal' || !event.target) {\n return;\n }\n\n event.preventDefault();\n this.moveFocus(event.target, step);\n }\n\n protected onVertical(event: Event, step: number): void {\n if (this.orientation !== 'vertical' || !event.target) {\n return;\n }\n\n event.preventDefault();\n this.moveFocus(event.target, step);\n }\n\n private moveFocus(current: EventTarget, step: number): void {\n if (!tuiIsElement(current)) {\n return;\n }\n\n const stepElements = this.steps.toArray().map(({nativeElement}) => nativeElement);\n const index = stepElements.findIndex((element) => element === current);\n\n tuiMoveFocus(index, stepElements, step);\n }\n\n private scrollIntoView(index: number): void {\n const step = this.steps.get(index)?.nativeElement;\n\n if (!step) {\n return;\n }\n\n const {clientHeight, clientWidth, offsetTop, offsetLeft} = this.el;\n const {\n offsetHeight,\n offsetWidth,\n offsetTop: stepOffsetTop,\n offsetLeft: stepOffsetLeft,\n } = step;\n const top = stepOffsetTop - offsetTop - clientHeight / 2 + offsetHeight / 2;\n const left = stepOffsetLeft - offsetLeft - clientWidth / 2 + offsetWidth / 2;\n\n this.scrollService\n .scroll$(\n this.el,\n Math.max(0, top),\n Math.max(0, left),\n tuiGetDuration(this.speed) / 3,\n )\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe();\n }\n}\n","<ng-container *ngIf=\"changes$ | async\" />\n<ng-content />\n","import {NgIf} from '@angular/common';\nimport {ChangeDetectionStrategy, Component, inject, Input} from '@angular/core';\nimport {RouterLinkActive} from '@angular/router';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {TuiIcon} from '@taiga-ui/core/components/icon';\nimport {TUI_COMMON_ICONS} from '@taiga-ui/core/tokens';\nimport type {Observable} from 'rxjs';\nimport {EMPTY, filter} from 'rxjs';\n\nimport {TuiStepperComponent} from './stepper.component';\n\n@Component({\n standalone: true,\n selector:\n 'button[tuiStep], a[tuiStep]:not([routerLink]), a[tuiStep][routerLink][routerLinkActive]',\n imports: [NgIf, TuiIcon],\n templateUrl: './step.template.html',\n styleUrls: ['./step.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n '[attr.data-state]': 'stepState',\n '[class._vertical]': 'isVertical',\n '[class._focus-visible]': 'focusVisible',\n '[class._active]': 'isActive',\n '[tabIndex]': 'tabIndex',\n '(click)': 'activate()',\n },\n})\nexport class TuiStep {\n private readonly stepper = inject(TuiStepperComponent);\n private readonly el = tuiInjectElement();\n private readonly routerLinkActive$: Observable<boolean> =\n inject(RouterLinkActive, {optional: true})?.isActiveChange || EMPTY;\n\n protected focusVisible = false;\n\n protected readonly icons = inject(TUI_COMMON_ICONS);\n\n @Input()\n public stepState: 'error' | 'normal' | 'pass' = 'normal';\n\n @Input()\n public icon = '';\n\n constructor() {\n this.routerLinkActive$.pipe(filter(Boolean)).subscribe(() => {\n this.activate();\n });\n }\n\n protected get isActive(): boolean {\n return this.stepper.isActive(this.index);\n }\n\n protected get isVertical(): boolean {\n return this.stepper.orientation === 'vertical';\n }\n\n protected get tabIndex(): number {\n return this.isActive ? 0 : -1;\n }\n\n protected get index(): number {\n return this.stepper.indexOf(this.el);\n }\n\n protected activate(): void {\n this.stepper.activate(this.index);\n }\n}\n","<tui-icon\n *ngIf=\"icon\"\n class=\"t-marker t-marker_custom\"\n [icon]=\"icon\"\n/>\n<tui-icon\n class=\"t-marker t-marker_error\"\n [icon]=\"icons.error\"\n/>\n<tui-icon\n class=\"t-marker t-marker_pass\"\n [icon]=\"icons.check\"\n/>\n<div class=\"t-marker t-marker_index\"></div>\n<ng-content />\n","import {TuiStep} from './step.component';\nimport {TuiStepperComponent} from './stepper.component';\n\nexport const TuiStepper = [TuiStepperComponent, TuiStep] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, Component, ViewEncapsulation, ChangeDetectionStrategy, Input
|
|
2
|
+
import { inject, Component, ViewEncapsulation, ChangeDetectionStrategy, Input } from '@angular/core';
|
|
3
3
|
import { NgControl } from '@angular/forms';
|
|
4
4
|
import * as i2 from '@taiga-ui/cdk/directives/native-validator';
|
|
5
5
|
import { TuiNativeValidator } from '@taiga-ui/cdk/directives/native-validator';
|
|
@@ -39,7 +39,7 @@ class TuiSwitch {
|
|
|
39
39
|
return this.showIcons ? `url(${resolver(icon)})` : null;
|
|
40
40
|
}
|
|
41
41
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSwitch, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
42
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiSwitch, isStandalone: true, selector: "input[type=\"checkbox\"][tuiSwitch]", inputs: { size: "size", showIcons: "showIcons" }, host: { attributes: { "role": "switch" }, properties: { "disabled": "!control || control.disabled", "attr.data-size": "size", "class._readonly": "!control", "style.--t-checked-icon": "
|
|
42
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiSwitch, isStandalone: true, selector: "input[type=\"checkbox\"][tuiSwitch]", inputs: { size: "size", showIcons: "showIcons" }, host: { attributes: { "role": "switch" }, properties: { "disabled": "!control || control.disabled", "attr.data-size": "size", "class._readonly": "!control", "style.--t-checked-icon": "icon" } }, hostDirectives: [{ directive: i1.TuiWithAppearance }, { directive: i2.TuiNativeValidator }], ngImport: i0, template: '', isInline: true, styles: ["[tuiSwitch]{transition-property:background,box-shadow;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:3rem;height:1.5rem;border-radius:2rem;overflow:hidden;cursor:pointer;margin:0;flex-shrink:0;color:#fff!important}[tuiSwitch][data-size=s]{height:1rem;width:2rem}[tuiSwitch][data-size=s]:before{width:1rem;transform:translate(-1rem);-webkit-mask-size:.75rem;mask-size:.75rem}[tuiSwitch][data-size=s]:after{width:1rem;box-shadow:-2.625rem 0 0 .5rem currentColor;outline-width:.167rem;transform:scale(.375)}[tuiSwitch][data-size=s]:checked:after{transform:scale(.375) translate(2.625rem)}[tuiSwitch]:checked:before{transform:none}[tuiSwitch]:checked:after{transform:scale(.33333) translate(4.5rem)}[tuiSwitch]:disabled._readonly{opacity:1}[tuiSwitch]:before,[tuiSwitch]:after{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;height:100%;width:1.5rem}[tuiSwitch]:before{display:var(--t-checked-icon, none);background:currentColor;-webkit-mask:var(--t-checked-icon) no-repeat center;mask:var(--t-checked-icon) no-repeat center;-webkit-mask-size:1rem;mask-size:1rem;transform:translate(-1.5rem)}[tuiSwitch]:after{right:0;border-radius:100%;transform:scale(.33333);box-shadow:-4.5rem 0 0 .75rem currentColor;outline:.375rem solid var(--tui-background-neutral-2-pressed);outline-offset:var(--t-checked-icon, 20rem)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
43
43
|
}
|
|
44
44
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiSwitch, decorators: [{
|
|
45
45
|
type: Component,
|
|
@@ -48,14 +48,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
48
48
|
'[disabled]': '!control || control.disabled',
|
|
49
49
|
'[attr.data-size]': 'size',
|
|
50
50
|
'[class._readonly]': '!control',
|
|
51
|
+
'[style.--t-checked-icon]': 'icon',
|
|
51
52
|
}, styles: ["[tuiSwitch]{transition-property:background,box-shadow;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;width:3rem;height:1.5rem;border-radius:2rem;overflow:hidden;cursor:pointer;margin:0;flex-shrink:0;color:#fff!important}[tuiSwitch][data-size=s]{height:1rem;width:2rem}[tuiSwitch][data-size=s]:before{width:1rem;transform:translate(-1rem);-webkit-mask-size:.75rem;mask-size:.75rem}[tuiSwitch][data-size=s]:after{width:1rem;box-shadow:-2.625rem 0 0 .5rem currentColor;outline-width:.167rem;transform:scale(.375)}[tuiSwitch][data-size=s]:checked:after{transform:scale(.375) translate(2.625rem)}[tuiSwitch]:checked:before{transform:none}[tuiSwitch]:checked:after{transform:scale(.33333) translate(4.5rem)}[tuiSwitch]:disabled._readonly{opacity:1}[tuiSwitch]:before,[tuiSwitch]:after{transition-property:transform;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;height:100%;width:1.5rem}[tuiSwitch]:before{display:var(--t-checked-icon, none);background:currentColor;-webkit-mask:var(--t-checked-icon) no-repeat center;mask:var(--t-checked-icon) no-repeat center;-webkit-mask-size:1rem;mask-size:1rem;transform:translate(-1.5rem)}[tuiSwitch]:after{right:0;border-radius:100%;transform:scale(.33333);box-shadow:-4.5rem 0 0 .75rem currentColor;outline:.375rem solid var(--tui-background-neutral-2-pressed);outline-offset:var(--t-checked-icon, 20rem)}\n"] }]
|
|
52
53
|
}], propDecorators: { size: [{
|
|
53
54
|
type: Input
|
|
54
55
|
}], showIcons: [{
|
|
55
56
|
type: Input
|
|
56
|
-
}], icon: [{
|
|
57
|
-
type: HostBinding,
|
|
58
|
-
args: ['style.--t-checked-icon']
|
|
59
57
|
}] } });
|
|
60
58
|
|
|
61
59
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"taiga-ui-kit-components-switch.mjs","sources":["../../../projects/kit/components/switch/switch.options.ts","../../../projects/kit/components/switch/switch.component.ts","../../../projects/kit/components/switch/taiga-ui-kit-components-switch.ts"],"sourcesContent":["import type {Provider} from '@angular/core';\nimport type {TuiStringHandler} from '@taiga-ui/cdk/types';\nimport {tuiCreateToken, tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {TuiSizeS} from '@taiga-ui/core/types';\n\nexport interface TuiSwitchOptions {\n readonly showIcons: boolean;\n readonly size: TuiSizeS;\n readonly icon: TuiStringHandler<TuiSizeS> | string;\n readonly appearance: TuiStringHandler<HTMLInputElement>;\n}\n\nexport const TUI_SWITCH_DEFAULT_OPTIONS: TuiSwitchOptions = {\n showIcons: true,\n size: 'm',\n icon: '@tui.check',\n appearance: (el) => (el.checked ? 'primary' : 'secondary'),\n};\n\nexport const TUI_SWITCH_OPTIONS = tuiCreateToken(TUI_SWITCH_DEFAULT_OPTIONS);\n\nexport function tuiSwitchOptionsProvider(options: Partial<TuiSwitchOptions>): Provider {\n return tuiProvideOptions(TUI_SWITCH_OPTIONS, options, TUI_SWITCH_DEFAULT_OPTIONS);\n}\n","import type {DoCheck} from '@angular/core';\nimport {\n ChangeDetectionStrategy,\n Component,\n
|
|
1
|
+
{"version":3,"file":"taiga-ui-kit-components-switch.mjs","sources":["../../../projects/kit/components/switch/switch.options.ts","../../../projects/kit/components/switch/switch.component.ts","../../../projects/kit/components/switch/taiga-ui-kit-components-switch.ts"],"sourcesContent":["import type {Provider} from '@angular/core';\nimport type {TuiStringHandler} from '@taiga-ui/cdk/types';\nimport {tuiCreateToken, tuiProvideOptions} from '@taiga-ui/cdk/utils/miscellaneous';\nimport type {TuiSizeS} from '@taiga-ui/core/types';\n\nexport interface TuiSwitchOptions {\n readonly showIcons: boolean;\n readonly size: TuiSizeS;\n readonly icon: TuiStringHandler<TuiSizeS> | string;\n readonly appearance: TuiStringHandler<HTMLInputElement>;\n}\n\nexport const TUI_SWITCH_DEFAULT_OPTIONS: TuiSwitchOptions = {\n showIcons: true,\n size: 'm',\n icon: '@tui.check',\n appearance: (el) => (el.checked ? 'primary' : 'secondary'),\n};\n\nexport const TUI_SWITCH_OPTIONS = tuiCreateToken(TUI_SWITCH_DEFAULT_OPTIONS);\n\nexport function tuiSwitchOptionsProvider(options: Partial<TuiSwitchOptions>): Provider {\n return tuiProvideOptions(TUI_SWITCH_OPTIONS, options, TUI_SWITCH_DEFAULT_OPTIONS);\n}\n","import type {DoCheck} from '@angular/core';\nimport {\n ChangeDetectionStrategy,\n Component,\n inject,\n Input,\n ViewEncapsulation,\n} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {TuiNativeValidator} from '@taiga-ui/cdk/directives/native-validator';\nimport {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';\nimport {tuiIsString} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {TuiAppearance, TuiWithAppearance} from '@taiga-ui/core/directives/appearance';\nimport {tuiInjectIconResolver} from '@taiga-ui/core/tokens';\nimport type {TuiSizeS} from '@taiga-ui/core/types';\n\nimport {TUI_SWITCH_OPTIONS} from './switch.options';\n\n@Component({\n standalone: true,\n selector: 'input[type=\"checkbox\"][tuiSwitch]',\n template: '',\n styles: ['@import \"@taiga-ui/kit/styles/components/switch.less\";'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n hostDirectives: [TuiWithAppearance, TuiNativeValidator],\n host: {\n role: 'switch',\n '[disabled]': '!control || control.disabled',\n '[attr.data-size]': 'size',\n '[class._readonly]': '!control',\n '[style.--t-checked-icon]': 'icon',\n },\n})\nexport class TuiSwitch implements DoCheck {\n private readonly appearance = inject(TuiAppearance);\n private readonly resolver = tuiInjectIconResolver();\n private readonly options = inject(TUI_SWITCH_OPTIONS);\n private readonly el = tuiInjectElement<HTMLInputElement>();\n\n protected readonly control = inject(NgControl, {optional: true, self: true});\n\n @Input()\n public size: TuiSizeS = this.options.size;\n\n @Input()\n public showIcons = this.options.showIcons;\n\n public ngDoCheck(): void {\n this.appearance.tuiAppearance = this.options.appearance(this.el);\n }\n\n protected get icon(): string | null {\n const {options, resolver, size} = this;\n const icon = tuiIsString(options.icon) ? options.icon : options.icon(size);\n\n return this.showIcons ? `url(${resolver(icon)})` : null;\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, Directive, Component, ViewEncapsulation, ChangeDetectionStrategy, INJECTOR, EventEmitter, afterNextRender, Input, Output,
|
|
2
|
+
import { inject, Directive, Component, ViewEncapsulation, ChangeDetectionStrategy, INJECTOR, EventEmitter, afterNextRender, Input, Output, NgZone, ContentChildren, forwardRef, InjectionToken, ElementRef, ChangeDetectorRef, TemplateRef, ViewChild } from '@angular/core';
|
|
3
3
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
4
4
|
import { RouterLinkActive } from '@angular/router';
|
|
5
5
|
import { MutationObserverService, WA_MUTATION_OBSERVER_INIT } from '@ng-web-apis/mutation-observer';
|
|
@@ -121,13 +121,16 @@ class TuiTabsDirective {
|
|
|
121
121
|
});
|
|
122
122
|
}
|
|
123
123
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTabsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
124
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTabsDirective, isStandalone: true, inputs: { size: "size", activeItemIndex: "activeItemIndex" }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { listeners: { "tui-tab-activate": "onActivate($event
|
|
124
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTabsDirective, isStandalone: true, inputs: { size: "size", activeItemIndex: "activeItemIndex" }, outputs: { activeItemIndexChange: "activeItemIndexChange" }, host: { listeners: { "tui-tab-activate": "onActivate($event, $event.target)" }, properties: { "attr.data-size": "size" } }, ngImport: i0 }); }
|
|
125
125
|
}
|
|
126
126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTabsDirective, decorators: [{
|
|
127
127
|
type: Directive,
|
|
128
128
|
args: [{
|
|
129
129
|
standalone: true,
|
|
130
|
-
host: {
|
|
130
|
+
host: {
|
|
131
|
+
'[attr.data-size]': 'size',
|
|
132
|
+
[`(${TUI_TAB_ACTIVATE})`]: 'onActivate($event, $event.target)',
|
|
133
|
+
},
|
|
131
134
|
}]
|
|
132
135
|
}], propDecorators: { size: [{
|
|
133
136
|
type: Input
|
|
@@ -135,9 +138,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
135
138
|
type: Input
|
|
136
139
|
}], activeItemIndexChange: [{
|
|
137
140
|
type: Output
|
|
138
|
-
}], onActivate: [{
|
|
139
|
-
type: HostListener,
|
|
140
|
-
args: [TUI_TAB_ACTIVATE, ['$event', '$event.target']]
|
|
141
141
|
}] } });
|
|
142
142
|
|
|
143
143
|
class TuiTabsHorizontal {
|
|
@@ -146,7 +146,7 @@ class TuiTabsHorizontal {
|
|
|
146
146
|
this.options = inject(TUI_TABS_OPTIONS);
|
|
147
147
|
this.tabs = inject(TuiTabsDirective);
|
|
148
148
|
this.children = EMPTY_QUERY;
|
|
149
|
-
this.sub = inject(MutationObserverService)
|
|
149
|
+
this.sub = inject(MutationObserverService, { self: true })
|
|
150
150
|
.pipe(tuiZonefree(inject(NgZone)), takeUntilDestroyed())
|
|
151
151
|
.subscribe(() => this.refresh());
|
|
152
152
|
this.underline = this.options.underline;
|
|
@@ -181,7 +181,7 @@ class TuiTabsHorizontal {
|
|
|
181
181
|
}
|
|
182
182
|
}
|
|
183
183
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTabsHorizontal, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
184
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTabsHorizontal, isStandalone: true, selector: "tui-tabs:not([vertical]), nav[tuiTabs]:not([vertical])", inputs: { underline: "underline" }, host: { listeners: { "keydown.arrowRight.prevent": "onKeyDownArrow($event.target,1)", "keydown.arrowLeft.prevent": "onKeyDownArrow($event.target
|
|
184
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTabsHorizontal, isStandalone: true, selector: "tui-tabs:not([vertical]), nav[tuiTabs]:not([vertical])", inputs: { underline: "underline" }, host: { listeners: { "animationend": "refresh()", "keydown.arrowRight.prevent": "onKeyDownArrow($event.target, 1)", "keydown.arrowLeft.prevent": "onKeyDownArrow($event.target, -1)" }, properties: { "class._underline": "underline", "style.--t-color": "underline === true ? 'var(--tui-background-accent-1)' : underline" } }, providers: [
|
|
185
185
|
MutationObserverService,
|
|
186
186
|
{
|
|
187
187
|
provide: WA_MUTATION_OBSERVER_INIT,
|
|
@@ -222,6 +222,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
222
222
|
host: {
|
|
223
223
|
'[class._underline]': 'underline',
|
|
224
224
|
'[style.--t-color]': "underline === true ? 'var(--tui-background-accent-1)' : underline",
|
|
225
|
+
'(animationend)': 'refresh()',
|
|
226
|
+
'(keydown.arrowRight.prevent)': 'onKeyDownArrow($event.target, 1)',
|
|
227
|
+
'(keydown.arrowLeft.prevent)': 'onKeyDownArrow($event.target, -1)',
|
|
225
228
|
},
|
|
226
229
|
}]
|
|
227
230
|
}], propDecorators: { children: [{
|
|
@@ -229,15 +232,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
229
232
|
args: [forwardRef(() => TuiTab)]
|
|
230
233
|
}], underline: [{
|
|
231
234
|
type: Input
|
|
232
|
-
}], onKeyDownArrow: [{
|
|
233
|
-
type: HostListener,
|
|
234
|
-
args: ['keydown.arrowRight.prevent', ['$event.target', '1']]
|
|
235
|
-
}, {
|
|
236
|
-
type: HostListener,
|
|
237
|
-
args: ['keydown.arrowLeft.prevent', ['$event.target', '-1']]
|
|
238
|
-
}], refresh: [{
|
|
239
|
-
type: HostListener,
|
|
240
|
-
args: ['animationend']
|
|
241
235
|
}], scrollTo: [] } });
|
|
242
236
|
|
|
243
237
|
class TuiTabsVertical {
|
|
@@ -249,7 +243,7 @@ class TuiTabsVertical {
|
|
|
249
243
|
this.tabs.moveFocus(current, step);
|
|
250
244
|
}
|
|
251
245
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTabsVertical, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
252
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTabsVertical, isStandalone: true, selector: "tui-tabs[vertical], nav[tuiTabs][vertical]", inputs: { vertical: "vertical" }, host: { listeners: { "keydown.arrowDown.prevent": "onKeyDownArrow($event.target,1)", "keydown.arrowUp.prevent": "onKeyDownArrow($event.target
|
|
246
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiTabsVertical, isStandalone: true, selector: "tui-tabs[vertical], nav[tuiTabs][vertical]", inputs: { vertical: "vertical" }, host: { listeners: { "keydown.arrowDown.prevent": "onKeyDownArrow($event.target, 1)", "keydown.arrowUp.prevent": "onKeyDownArrow($event.target, -1)" }, properties: { "attr.data-vertical": "vertical" } }, hostDirectives: [{ directive: TuiTabsDirective, inputs: ["activeItemIndex", "activeItemIndex", "size", "size"], outputs: ["activeItemIndexChange", "activeItemIndexChange"] }], ngImport: i0 }); }
|
|
253
247
|
}
|
|
254
248
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiTabsVertical, decorators: [{
|
|
255
249
|
type: Directive,
|
|
@@ -263,18 +257,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
263
257
|
outputs: ['activeItemIndexChange'],
|
|
264
258
|
},
|
|
265
259
|
],
|
|
260
|
+
host: {
|
|
261
|
+
'[attr.data-vertical]': 'vertical',
|
|
262
|
+
'(keydown.arrowDown.prevent)': 'onKeyDownArrow($event.target, 1)',
|
|
263
|
+
'(keydown.arrowUp.prevent)': 'onKeyDownArrow($event.target, -1)',
|
|
264
|
+
},
|
|
266
265
|
}]
|
|
267
266
|
}], propDecorators: { vertical: [{
|
|
268
267
|
type: Input
|
|
269
|
-
}, {
|
|
270
|
-
type: HostBinding,
|
|
271
|
-
args: ['attr.data-vertical']
|
|
272
|
-
}], onKeyDownArrow: [{
|
|
273
|
-
type: HostListener,
|
|
274
|
-
args: ['keydown.arrowDown.prevent', ['$event.target', '1']]
|
|
275
|
-
}, {
|
|
276
|
-
type: HostListener,
|
|
277
|
-
args: ['keydown.arrowUp.prevent', ['$event.target', '-1']]
|
|
278
268
|
}] } });
|
|
279
269
|
|
|
280
270
|
const TUI_TABS_REFRESH = new InjectionToken('[TUI_TABS_REFRESH]');
|