@taiga-ui/kit 2.53.0 → 2.55.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/taiga-ui-kit-components-input-files.umd.js +11 -5
- package/bundles/taiga-ui-kit-components-input-files.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-input-files.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-components-input-files.umd.min.js.map +1 -1
- package/bundles/taiga-ui-kit-components-input-month-range.umd.js +1 -2
- package/bundles/taiga-ui-kit-components-input-month-range.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-input-month-range.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-components-input-month-range.umd.min.js.map +1 -1
- package/bundles/taiga-ui-kit-components-input-phone-international.umd.js +1 -0
- package/bundles/taiga-ui-kit-components-input-phone-international.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-input-phone-international.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-components-input-phone-international.umd.min.js.map +1 -1
- package/bundles/taiga-ui-kit-components-line-clamp.umd.js +32 -4
- package/bundles/taiga-ui-kit-components-line-clamp.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-line-clamp.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-components-line-clamp.umd.min.js.map +1 -1
- package/bundles/taiga-ui-kit-components-slider.umd.js +148 -85
- package/bundles/taiga-ui-kit-components-slider.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-slider.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-components-slider.umd.min.js.map +1 -1
- package/bundles/taiga-ui-kit-components-tabs.umd.js +5 -3
- package/bundles/taiga-ui-kit-components-tabs.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-tabs.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-components-tabs.umd.min.js.map +1 -1
- package/components/input-files/taiga-ui-kit-components-input-files.metadata.json +1 -1
- package/components/input-phone-international/taiga-ui-kit-components-input-phone-international.metadata.json +1 -1
- package/components/line-clamp/index.d.ts +1 -0
- package/components/line-clamp/line-clamp-options.d.ts +7 -0
- package/components/line-clamp/line-clamp.component.d.ts +8 -3
- package/components/line-clamp/taiga-ui-kit-components-line-clamp.metadata.json +1 -1
- package/components/slider/{slider-key-steps.directive.d.ts → helpers/slider-key-steps.directive.d.ts} +1 -1
- package/components/slider/{slider-readonly.directive.d.ts → helpers/slider-readonly.directive.d.ts} +0 -0
- package/components/slider/helpers/slider-thumb-label/slider-thumb-label.component.d.ts +12 -0
- package/components/slider/index.d.ts +3 -2
- package/components/slider/slider.component.d.ts +2 -1
- package/components/slider/taiga-ui-kit-components-slider.metadata.json +1 -1
- package/components/tabs/taiga-ui-kit-components-tabs.metadata.json +1 -1
- package/esm2015/components/input-files/input-files.module.js +10 -3
- package/esm2015/components/input-month-range/input-month-range.component.js +3 -4
- package/esm2015/components/input-phone-international/const/countries.js +2 -1
- package/esm2015/components/line-clamp/index.js +2 -1
- package/esm2015/components/line-clamp/line-clamp-options.js +12 -0
- package/esm2015/components/line-clamp/line-clamp.component.js +23 -8
- package/esm2015/components/slider/helpers/slider-key-steps.directive.js +103 -0
- package/esm2015/components/slider/helpers/slider-readonly.directive.js +79 -0
- package/esm2015/components/slider/helpers/slider-thumb-label/slider-thumb-label.component.js +40 -0
- package/esm2015/components/slider/index.js +4 -3
- package/esm2015/components/slider/slider.component.js +12 -2
- package/esm2015/components/slider/slider.module.js +6 -3
- package/esm2015/components/tabs/tab/tab.component.js +1 -1
- package/esm2015/components/tabs/tabs-with-more/tabs-with-more.component.js +6 -4
- package/esm5/components/input-files/input-files.module.js +10 -3
- package/esm5/components/input-month-range/input-month-range.component.js +3 -4
- package/esm5/components/input-phone-international/const/countries.js +2 -1
- package/esm5/components/line-clamp/index.js +2 -1
- package/esm5/components/line-clamp/line-clamp-options.js +13 -0
- package/esm5/components/line-clamp/line-clamp.component.js +23 -8
- package/esm5/components/slider/helpers/slider-key-steps.directive.js +129 -0
- package/esm5/components/slider/helpers/slider-readonly.directive.js +87 -0
- package/esm5/components/slider/helpers/slider-thumb-label/slider-thumb-label.component.js +55 -0
- package/esm5/components/slider/index.js +4 -3
- package/esm5/components/slider/slider.component.js +12 -2
- package/esm5/components/slider/slider.module.js +6 -3
- package/esm5/components/tabs/tab/tab.component.js +1 -1
- package/esm5/components/tabs/tabs-with-more/tabs-with-more.component.js +6 -4
- package/fesm2015/taiga-ui-kit-components-input-files.js +9 -2
- package/fesm2015/taiga-ui-kit-components-input-files.js.map +1 -1
- package/fesm2015/taiga-ui-kit-components-input-month-range.js +2 -3
- package/fesm2015/taiga-ui-kit-components-input-month-range.js.map +1 -1
- package/fesm2015/taiga-ui-kit-components-input-phone-international.js +1 -0
- package/fesm2015/taiga-ui-kit-components-input-phone-international.js.map +1 -1
- package/fesm2015/taiga-ui-kit-components-line-clamp.js +33 -8
- package/fesm2015/taiga-ui-kit-components-line-clamp.js.map +1 -1
- package/fesm2015/taiga-ui-kit-components-slider.js +122 -75
- package/fesm2015/taiga-ui-kit-components-slider.js.map +1 -1
- package/fesm2015/taiga-ui-kit-components-tabs.js +6 -4
- package/fesm2015/taiga-ui-kit-components-tabs.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-input-files.js +9 -2
- package/fesm5/taiga-ui-kit-components-input-files.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-input-month-range.js +2 -3
- package/fesm5/taiga-ui-kit-components-input-month-range.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-input-phone-international.js +1 -0
- package/fesm5/taiga-ui-kit-components-input-phone-international.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-line-clamp.js +34 -9
- package/fesm5/taiga-ui-kit-components-line-clamp.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-slider.js +149 -87
- package/fesm5/taiga-ui-kit-components-slider.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-tabs.js +6 -4
- package/fesm5/taiga-ui-kit-components-tabs.js.map +1 -1
- package/package.json +5 -5
- package/esm2015/components/slider/slider-key-steps.directive.js +0 -102
- package/esm2015/components/slider/slider-readonly.directive.js +0 -79
- package/esm5/components/slider/slider-key-steps.directive.js +0 -128
- package/esm5/components/slider/slider-readonly.directive.js +0 -87
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { __decorate, __param } from 'tslib';
|
|
2
|
-
import { InjectionToken, Optional, Self, Inject, ChangeDetectorRef, ElementRef, Input, HostBinding, Component, ChangeDetectionStrategy, Output, HostListener, Directive, Pipe, forwardRef, NgModule } from '@angular/core';
|
|
2
|
+
import { InjectionToken, Optional, Self, Inject, ChangeDetectorRef, ElementRef, Input, HostBinding, Component, ChangeDetectionStrategy, Output, HostListener, Directive, Pipe, ContentChild, forwardRef, NgModule } from '@angular/core';
|
|
3
3
|
import { NgModel, NgControl } from '@angular/forms';
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { watch, isEdgeOlderThan, CHROMIUM_EDGE_START_VERSION, tuiDefaultProp, AbstractTuiControl, typedFromEvent, isNativeFocused, clamp, tuiAssert, tuiCoerceBooleanProperty, TuiDestroyService, TUI_FOCUSABLE_ITEM_ACCESSOR, TuiRepeatTimesModule, TuiFocusableModule, TuiFocusVisibleModule, TuiActiveZoneModule } from '@taiga-ui/cdk';
|
|
5
|
+
import { tuiPercentageToKeyStepValue, tuiKeyStepValueToPercentage, tuiCheckKeyStepsHaveMinMaxPercents } from '@taiga-ui/kit/utils';
|
|
6
6
|
import { take, map, tap, mapTo, filter, takeUntil } from 'rxjs/operators';
|
|
7
|
+
import { USER_AGENT } from '@ng-web-apis/common';
|
|
7
8
|
import { DOCUMENT, CommonModule } from '@angular/common';
|
|
9
|
+
import { merge, combineLatest, Observable } from 'rxjs';
|
|
8
10
|
import { TuiFormatNumberPipeModule } from '@taiga-ui/core';
|
|
9
|
-
import { tuiPercentageToKeyStepValue, tuiKeyStepValueToPercentage, tuiCheckKeyStepsHaveMinMaxPercents } from '@taiga-ui/kit/utils';
|
|
10
11
|
import { AbstractTuiSlider } from '@taiga-ui/kit/abstract';
|
|
11
12
|
import { TUI_FROM_TO_TEXTS } from '@taiga-ui/kit/tokens';
|
|
12
|
-
import { Observable, merge, combineLatest } from 'rxjs';
|
|
13
13
|
|
|
14
14
|
const TUI_SLIDER_DEFAULT_OPTIONS = {
|
|
15
15
|
size: 'm',
|
|
@@ -26,6 +26,7 @@ function tuiSliderOptionsProvider(options) {
|
|
|
26
26
|
let TuiSliderComponent = class TuiSliderComponent {
|
|
27
27
|
constructor(control, changeDetectorRef, options, elementRef, userAgent) {
|
|
28
28
|
var _a;
|
|
29
|
+
this.control = control;
|
|
29
30
|
this.options = options;
|
|
30
31
|
this.elementRef = elementRef;
|
|
31
32
|
this.userAgent = userAgent;
|
|
@@ -52,7 +53,16 @@ let TuiSliderComponent = class TuiSliderComponent {
|
|
|
52
53
|
return Number(this.elementRef.nativeElement.step) || 1;
|
|
53
54
|
}
|
|
54
55
|
get value() {
|
|
55
|
-
|
|
56
|
+
const { elementRef, control } = this;
|
|
57
|
+
const noKeySteps = !elementRef.nativeElement.hasAttribute('data-key-steps');
|
|
58
|
+
if (noKeySteps && control instanceof NgModel) {
|
|
59
|
+
/**
|
|
60
|
+
* If developer uses `[(ngModel)]` and programmatically change value,
|
|
61
|
+
* the `elementRef.nativeElement.value` is equal to the previous value at this moment.
|
|
62
|
+
*/
|
|
63
|
+
return control.viewModel;
|
|
64
|
+
}
|
|
65
|
+
return Number(elementRef.nativeElement.value) || 0;
|
|
56
66
|
}
|
|
57
67
|
set value(newValue) {
|
|
58
68
|
this.elementRef.nativeElement.value = `${newValue}`;
|
|
@@ -190,6 +200,7 @@ TuiSliderKeyStepsDirective = __decorate([
|
|
|
190
200
|
Directive({
|
|
191
201
|
selector: 'input[tuiSlider][keySteps]',
|
|
192
202
|
host: {
|
|
203
|
+
'[attr.data-key-steps]': 'true',
|
|
193
204
|
'[attr.aria-valuenow]': 'controlValue',
|
|
194
205
|
'[attr.aria-valuemin]': 'min',
|
|
195
206
|
'[attr.aria-valuemax]': 'max',
|
|
@@ -217,74 +228,6 @@ TuiSliderTickLabelPipe = __decorate([
|
|
|
217
228
|
Pipe({ name: 'tuiSliderTickLabel' })
|
|
218
229
|
], TuiSliderTickLabelPipe);
|
|
219
230
|
|
|
220
|
-
var TuiSliderOldComponent_1;
|
|
221
|
-
/**
|
|
222
|
-
* @deprecated use {@link TuiSliderComponent} instead
|
|
223
|
-
* TODO: 3.0 remove
|
|
224
|
-
*/
|
|
225
|
-
// @dynamic
|
|
226
|
-
let TuiSliderOldComponent = TuiSliderOldComponent_1 = class TuiSliderOldComponent extends AbstractTuiSlider {
|
|
227
|
-
constructor(control, changeDetectorRef, documentRef, fromToTexts$) {
|
|
228
|
-
super(control, changeDetectorRef, documentRef, fromToTexts$);
|
|
229
|
-
}
|
|
230
|
-
get nativeFocusableElement() {
|
|
231
|
-
return this.dotRight ? this.dotRight.nativeElement : null;
|
|
232
|
-
}
|
|
233
|
-
get focused() {
|
|
234
|
-
return isNativeFocused(this.nativeFocusableElement);
|
|
235
|
-
}
|
|
236
|
-
get left() {
|
|
237
|
-
return 0;
|
|
238
|
-
}
|
|
239
|
-
get right() {
|
|
240
|
-
return 100 - 100 * this.getFractionFromValue(this.value);
|
|
241
|
-
}
|
|
242
|
-
processValue(value) {
|
|
243
|
-
this.updateValue(this.valueGuard(value));
|
|
244
|
-
}
|
|
245
|
-
decrement() {
|
|
246
|
-
this.processStep(false);
|
|
247
|
-
}
|
|
248
|
-
increment() {
|
|
249
|
-
this.processStep(true);
|
|
250
|
-
}
|
|
251
|
-
getFallbackValue() {
|
|
252
|
-
return 0;
|
|
253
|
-
}
|
|
254
|
-
processStep(increment) {
|
|
255
|
-
const fraction = this.getFractionFromValue(this.value);
|
|
256
|
-
const step = this.computedStep;
|
|
257
|
-
const value = this.getValueFromFraction(increment ? fraction + step : fraction - step);
|
|
258
|
-
this.processValue(value);
|
|
259
|
-
}
|
|
260
|
-
};
|
|
261
|
-
TuiSliderOldComponent.ctorParameters = () => [
|
|
262
|
-
{ type: NgControl, decorators: [{ type: Optional }, { type: Self }, { type: Inject, args: [NgControl,] }] },
|
|
263
|
-
{ type: ChangeDetectorRef, decorators: [{ type: Inject, args: [ChangeDetectorRef,] }] },
|
|
264
|
-
{ type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
|
|
265
|
-
{ type: Observable, decorators: [{ type: Inject, args: [TUI_FROM_TO_TEXTS,] }] }
|
|
266
|
-
];
|
|
267
|
-
TuiSliderOldComponent = TuiSliderOldComponent_1 = __decorate([
|
|
268
|
-
Component({
|
|
269
|
-
selector: 'tui-slider',
|
|
270
|
-
template: "<div\n class=\"event-catcher\"\n (tuiActiveZoneChange)=\"onActiveZone($event)\"\n (mousedown)=\"onMouseDown($event)\"\n (touchstart)=\"onTouchStart($event)\"\n>\n <div class=\"wrapper\">\n <div\n *ngIf=\"segmented\"\n class=\"segments\"\n >\n <span\n *tuiRepeatTimes=\"let segmentIndex of segments + 1\"\n automation-id=\"tui-slider__segment\"\n class=\"segment\"\n >\n <span\n *ngIf=\"fromToTexts$ | async as fromToText\"\n class=\"number\"\n >\n {{ getSegmentPrefix(segmentIndex, fromToText) }}\n {{ getSegmentLabel(segmentIndex) | tuiFormatNumber }}\n <span *ngIf=\"pluralizeMap\">\n {{ getSegmentLabel(segmentIndex) | i18nPlural: pluralizeMap }}\n </span>\n </span>\n </span>\n </div>\n <div\n automation-id=\"tui-slider__bar\"\n class=\"bar\"\n [style.left.%]=\"left\"\n [style.right.%]=\"right\"\n >\n <div\n #dotLeft\n automation-id=\"tui-slider__left\"\n class=\"dot\"\n [class.dot_focus-visible]=\"focusVisibleLeft && computedFocused\"\n [tuiFocusable]=\"isLeftFocusable\"\n (tuiFocusVisibleChange)=\"onLeftFocusVisible($event)\"\n (keydown.arrowLeft.prevent)=\"decrement()\"\n (keydown.arrowDown.prevent)=\"decrement()\"\n (keydown.arrowRight.prevent)=\"increment()\"\n (keydown.arrowUp.prevent)=\"increment()\"\n ></div>\n <div\n #dotRight\n automation-id=\"tui-slider__right\"\n class=\"dot\"\n [class.dot_focus-visible]=\"focusVisibleRight && computedFocused\"\n [tuiFocusable]=\"isRightFocusable\"\n (tuiFocusVisibleChange)=\"onRightFocusVisible($event)\"\n (keydown.arrowLeft.prevent)=\"decrement()\"\n (keydown.arrowDown.prevent)=\"decrement()\"\n (keydown.arrowRight.prevent)=\"increment()\"\n (keydown.arrowUp.prevent)=\"increment()\"\n ></div>\n </div>\n </div>\n</div>\n",
|
|
271
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
272
|
-
providers: [
|
|
273
|
-
{
|
|
274
|
-
provide: TUI_FOCUSABLE_ITEM_ACCESSOR,
|
|
275
|
-
useExisting: forwardRef(() => TuiSliderOldComponent_1),
|
|
276
|
-
},
|
|
277
|
-
],
|
|
278
|
-
styles: [":host{display:block;border-radius:var(--tui-radius-m);color:var(--tui-base-03);min-height:.125rem;font-size:1rem}:host[data-size='s']{min-height:.125rem;font-size:.5rem}:host._segmented{padding-bottom:1.25rem}:host._disabled{cursor:default;pointer-events:none;opacity:var(--tui-disabled-opacity)}.event-catcher{min-height:inherit;border-radius:inherit;padding:.4375rem 0;cursor:pointer}.wrapper{position:relative;min-height:inherit;border-radius:inherit;background-color:currentColor;border:solid transparent;border-width:0 1em}.bar{position:absolute;top:0;bottom:0;margin:0 -1em;border-radius:inherit;background-color:var(--tui-primary)}:host-context(tui-input-slider) .bar{margin-left:calc(var(--tui-radius-m)/ 2);border-bottom-left-radius:calc(var(--tui-radius-m) * 5) calc(var(--tui-radius-m) * 1.5)}.dot{transition-property:background-color;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;position:absolute;top:50%;z-index:1;width:1em;height:1em;transform:translate(0,-50%);border-radius:100%;background-color:var(--tui-primary);outline:0;cursor:ew-resize}.dot:last-child{right:0;transform:translate(0,-50%)}.dot:hover{background-color:var(--tui-primary-hover)}.dot:active{background-color:var(--tui-primary-active)}.dot_focus-visible{box-shadow:inset 0 0 0 2px var(--tui-focus)}.segments{position:relative;z-index:1;display:flex;justify-content:space-between;min-height:inherit;margin:0 -1em}.segments-spacer{height:1.625rem}.segment{position:relative;height:inherit;width:.25rem;background-color:rgba(0,0,0,.36);pointer-events:none}.segment:first-of-type,.segment:last-of-type{background-color:transparent}.number{position:absolute;left:50%;transform:translate(-50%,0);top:100%;font:var(--tui-font-text-s);margin-top:.5rem;color:var(--tui-text-02);white-space:nowrap}.segment:first-of-type .number{left:-.05em;transform:none}.segment:last-of-type .number{left:auto;right:-.05em;transform:none}:host._disabled .number{color:var(--tui-text-01)}", ".dot:first-child{display:none}.wrapper{border-left:none}.bar,.segments{margin-left:0}"]
|
|
279
|
-
}),
|
|
280
|
-
__param(0, Optional()),
|
|
281
|
-
__param(0, Self()),
|
|
282
|
-
__param(0, Inject(NgControl)),
|
|
283
|
-
__param(1, Inject(ChangeDetectorRef)),
|
|
284
|
-
__param(2, Inject(DOCUMENT)),
|
|
285
|
-
__param(3, Inject(TUI_FROM_TO_TEXTS))
|
|
286
|
-
], TuiSliderOldComponent);
|
|
287
|
-
|
|
288
231
|
const SLIDER_INTERACTION_KEYS = new Set([
|
|
289
232
|
'ArrowLeft',
|
|
290
233
|
'ArrowRight',
|
|
@@ -357,6 +300,108 @@ TuiSliderReadonlyDirective = __decorate([
|
|
|
357
300
|
__param(2, Inject(TuiDestroyService))
|
|
358
301
|
], TuiSliderReadonlyDirective);
|
|
359
302
|
|
|
303
|
+
let TuiSliderThumbLabelComponent = class TuiSliderThumbLabelComponent {
|
|
304
|
+
get size() {
|
|
305
|
+
var _a;
|
|
306
|
+
return ((_a = this.slider) === null || _a === void 0 ? void 0 : _a.size) || 'm';
|
|
307
|
+
}
|
|
308
|
+
get ratio() {
|
|
309
|
+
var _a;
|
|
310
|
+
return (((_a = this.slider) === null || _a === void 0 ? void 0 : _a.valuePercentage) || 0) / 100;
|
|
311
|
+
}
|
|
312
|
+
get ghostLeft() {
|
|
313
|
+
var _a;
|
|
314
|
+
return this.ratio * (((_a = this.slider) === null || _a === void 0 ? void 0 : _a.elementRef.nativeElement.offsetWidth) || 0);
|
|
315
|
+
}
|
|
316
|
+
ngAfterContentInit() {
|
|
317
|
+
var _a;
|
|
318
|
+
tuiAssert.assert(Boolean((_a = this.control) === null || _a === void 0 ? void 0 : _a.valueChanges), `\n[tuiSliderThumbLabel] expected <input tuiSlider type="range" /> to use Angular Forms.\n` +
|
|
319
|
+
'Use [(ngModel)] or [formControl] or formControlName for correct work.');
|
|
320
|
+
}
|
|
321
|
+
};
|
|
322
|
+
__decorate([
|
|
323
|
+
ContentChild(TuiSliderComponent)
|
|
324
|
+
], TuiSliderThumbLabelComponent.prototype, "slider", void 0);
|
|
325
|
+
__decorate([
|
|
326
|
+
ContentChild(NgControl)
|
|
327
|
+
], TuiSliderThumbLabelComponent.prototype, "control", void 0);
|
|
328
|
+
TuiSliderThumbLabelComponent = __decorate([
|
|
329
|
+
Component({
|
|
330
|
+
selector: '[tuiSliderThumbLabel]',
|
|
331
|
+
template: "<ng-container *ngIf=\"control?.valueChanges | async\"></ng-container>\n\n<div\n class=\"t-ghost\"\n [attr.data-size]=\"size\"\n [style.left.px]=\"ghostLeft\"\n [style.--tui-slider-thumb-ratio]=\"ratio\"\n>\n <ng-content></ng-content>\n</div>\n\n<ng-content select=\"input[type=range]\"></ng-content>\n",
|
|
332
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
333
|
+
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']{width:.5rem;height:.5rem;transform:translateX(calc(var(--tui-slider-thumb-ratio) * -.5rem))}.t-ghost[data-size='m']{width:1rem;height:1rem;transform:translateX(calc(var(--tui-slider-thumb-ratio) * -1rem))}"]
|
|
334
|
+
})
|
|
335
|
+
], TuiSliderThumbLabelComponent);
|
|
336
|
+
|
|
337
|
+
var TuiSliderOldComponent_1;
|
|
338
|
+
/**
|
|
339
|
+
* @deprecated use {@link TuiSliderComponent} instead
|
|
340
|
+
* TODO: 3.0 remove
|
|
341
|
+
*/
|
|
342
|
+
// @dynamic
|
|
343
|
+
let TuiSliderOldComponent = TuiSliderOldComponent_1 = class TuiSliderOldComponent extends AbstractTuiSlider {
|
|
344
|
+
constructor(control, changeDetectorRef, documentRef, fromToTexts$) {
|
|
345
|
+
super(control, changeDetectorRef, documentRef, fromToTexts$);
|
|
346
|
+
}
|
|
347
|
+
get nativeFocusableElement() {
|
|
348
|
+
return this.dotRight ? this.dotRight.nativeElement : null;
|
|
349
|
+
}
|
|
350
|
+
get focused() {
|
|
351
|
+
return isNativeFocused(this.nativeFocusableElement);
|
|
352
|
+
}
|
|
353
|
+
get left() {
|
|
354
|
+
return 0;
|
|
355
|
+
}
|
|
356
|
+
get right() {
|
|
357
|
+
return 100 - 100 * this.getFractionFromValue(this.value);
|
|
358
|
+
}
|
|
359
|
+
processValue(value) {
|
|
360
|
+
this.updateValue(this.valueGuard(value));
|
|
361
|
+
}
|
|
362
|
+
decrement() {
|
|
363
|
+
this.processStep(false);
|
|
364
|
+
}
|
|
365
|
+
increment() {
|
|
366
|
+
this.processStep(true);
|
|
367
|
+
}
|
|
368
|
+
getFallbackValue() {
|
|
369
|
+
return 0;
|
|
370
|
+
}
|
|
371
|
+
processStep(increment) {
|
|
372
|
+
const fraction = this.getFractionFromValue(this.value);
|
|
373
|
+
const step = this.computedStep;
|
|
374
|
+
const value = this.getValueFromFraction(increment ? fraction + step : fraction - step);
|
|
375
|
+
this.processValue(value);
|
|
376
|
+
}
|
|
377
|
+
};
|
|
378
|
+
TuiSliderOldComponent.ctorParameters = () => [
|
|
379
|
+
{ type: NgControl, decorators: [{ type: Optional }, { type: Self }, { type: Inject, args: [NgControl,] }] },
|
|
380
|
+
{ type: ChangeDetectorRef, decorators: [{ type: Inject, args: [ChangeDetectorRef,] }] },
|
|
381
|
+
{ type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
|
|
382
|
+
{ type: Observable, decorators: [{ type: Inject, args: [TUI_FROM_TO_TEXTS,] }] }
|
|
383
|
+
];
|
|
384
|
+
TuiSliderOldComponent = TuiSliderOldComponent_1 = __decorate([
|
|
385
|
+
Component({
|
|
386
|
+
selector: 'tui-slider',
|
|
387
|
+
template: "<div\n class=\"event-catcher\"\n (tuiActiveZoneChange)=\"onActiveZone($event)\"\n (mousedown)=\"onMouseDown($event)\"\n (touchstart)=\"onTouchStart($event)\"\n>\n <div class=\"wrapper\">\n <div\n *ngIf=\"segmented\"\n class=\"segments\"\n >\n <span\n *tuiRepeatTimes=\"let segmentIndex of segments + 1\"\n automation-id=\"tui-slider__segment\"\n class=\"segment\"\n >\n <span\n *ngIf=\"fromToTexts$ | async as fromToText\"\n class=\"number\"\n >\n {{ getSegmentPrefix(segmentIndex, fromToText) }}\n {{ getSegmentLabel(segmentIndex) | tuiFormatNumber }}\n <span *ngIf=\"pluralizeMap\">\n {{ getSegmentLabel(segmentIndex) | i18nPlural: pluralizeMap }}\n </span>\n </span>\n </span>\n </div>\n <div\n automation-id=\"tui-slider__bar\"\n class=\"bar\"\n [style.left.%]=\"left\"\n [style.right.%]=\"right\"\n >\n <div\n #dotLeft\n automation-id=\"tui-slider__left\"\n class=\"dot\"\n [class.dot_focus-visible]=\"focusVisibleLeft && computedFocused\"\n [tuiFocusable]=\"isLeftFocusable\"\n (tuiFocusVisibleChange)=\"onLeftFocusVisible($event)\"\n (keydown.arrowLeft.prevent)=\"decrement()\"\n (keydown.arrowDown.prevent)=\"decrement()\"\n (keydown.arrowRight.prevent)=\"increment()\"\n (keydown.arrowUp.prevent)=\"increment()\"\n ></div>\n <div\n #dotRight\n automation-id=\"tui-slider__right\"\n class=\"dot\"\n [class.dot_focus-visible]=\"focusVisibleRight && computedFocused\"\n [tuiFocusable]=\"isRightFocusable\"\n (tuiFocusVisibleChange)=\"onRightFocusVisible($event)\"\n (keydown.arrowLeft.prevent)=\"decrement()\"\n (keydown.arrowDown.prevent)=\"decrement()\"\n (keydown.arrowRight.prevent)=\"increment()\"\n (keydown.arrowUp.prevent)=\"increment()\"\n ></div>\n </div>\n </div>\n</div>\n",
|
|
388
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
389
|
+
providers: [
|
|
390
|
+
{
|
|
391
|
+
provide: TUI_FOCUSABLE_ITEM_ACCESSOR,
|
|
392
|
+
useExisting: forwardRef(() => TuiSliderOldComponent_1),
|
|
393
|
+
},
|
|
394
|
+
],
|
|
395
|
+
styles: [":host{display:block;border-radius:var(--tui-radius-m);color:var(--tui-base-03);min-height:.125rem;font-size:1rem}:host[data-size='s']{min-height:.125rem;font-size:.5rem}:host._segmented{padding-bottom:1.25rem}:host._disabled{cursor:default;pointer-events:none;opacity:var(--tui-disabled-opacity)}.event-catcher{min-height:inherit;border-radius:inherit;padding:.4375rem 0;cursor:pointer}.wrapper{position:relative;min-height:inherit;border-radius:inherit;background-color:currentColor;border:solid transparent;border-width:0 1em}.bar{position:absolute;top:0;bottom:0;margin:0 -1em;border-radius:inherit;background-color:var(--tui-primary)}:host-context(tui-input-slider) .bar{margin-left:calc(var(--tui-radius-m)/ 2);border-bottom-left-radius:calc(var(--tui-radius-m) * 5) calc(var(--tui-radius-m) * 1.5)}.dot{transition-property:background-color;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;position:absolute;top:50%;z-index:1;width:1em;height:1em;transform:translate(0,-50%);border-radius:100%;background-color:var(--tui-primary);outline:0;cursor:ew-resize}.dot:last-child{right:0;transform:translate(0,-50%)}.dot:hover{background-color:var(--tui-primary-hover)}.dot:active{background-color:var(--tui-primary-active)}.dot_focus-visible{box-shadow:inset 0 0 0 2px var(--tui-focus)}.segments{position:relative;z-index:1;display:flex;justify-content:space-between;min-height:inherit;margin:0 -1em}.segments-spacer{height:1.625rem}.segment{position:relative;height:inherit;width:.25rem;background-color:rgba(0,0,0,.36);pointer-events:none}.segment:first-of-type,.segment:last-of-type{background-color:transparent}.number{position:absolute;left:50%;transform:translate(-50%,0);top:100%;font:var(--tui-font-text-s);margin-top:.5rem;color:var(--tui-text-02);white-space:nowrap}.segment:first-of-type .number{left:-.05em;transform:none}.segment:last-of-type .number{left:auto;right:-.05em;transform:none}:host._disabled .number{color:var(--tui-text-01)}", ".dot:first-child{display:none}.wrapper{border-left:none}.bar,.segments{margin-left:0}"]
|
|
396
|
+
}),
|
|
397
|
+
__param(0, Optional()),
|
|
398
|
+
__param(0, Self()),
|
|
399
|
+
__param(0, Inject(NgControl)),
|
|
400
|
+
__param(1, Inject(ChangeDetectorRef)),
|
|
401
|
+
__param(2, Inject(DOCUMENT)),
|
|
402
|
+
__param(3, Inject(TUI_FROM_TO_TEXTS))
|
|
403
|
+
], TuiSliderOldComponent);
|
|
404
|
+
|
|
360
405
|
let TuiSliderModule = class TuiSliderModule {
|
|
361
406
|
};
|
|
362
407
|
TuiSliderModule = __decorate([
|
|
@@ -371,6 +416,7 @@ TuiSliderModule = __decorate([
|
|
|
371
416
|
],
|
|
372
417
|
declarations: [
|
|
373
418
|
TuiSliderComponent,
|
|
419
|
+
TuiSliderThumbLabelComponent,
|
|
374
420
|
TuiSliderKeyStepsDirective,
|
|
375
421
|
TuiSliderReadonlyDirective,
|
|
376
422
|
TuiSliderTickLabelPipe,
|
|
@@ -378,6 +424,7 @@ TuiSliderModule = __decorate([
|
|
|
378
424
|
],
|
|
379
425
|
exports: [
|
|
380
426
|
TuiSliderComponent,
|
|
427
|
+
TuiSliderThumbLabelComponent,
|
|
381
428
|
TuiSliderKeyStepsDirective,
|
|
382
429
|
TuiSliderReadonlyDirective,
|
|
383
430
|
TuiSliderTickLabelPipe,
|
|
@@ -390,5 +437,5 @@ TuiSliderModule = __decorate([
|
|
|
390
437
|
* Generated bundle index. Do not edit.
|
|
391
438
|
*/
|
|
392
439
|
|
|
393
|
-
export { TUI_SLIDER_DEFAULT_OPTIONS, TUI_SLIDER_OPTIONS, TuiSliderComponent, TuiSliderKeyStepsDirective, TuiSliderModule, TuiSliderOldComponent, TuiSliderReadonlyDirective, TuiSliderTickLabelPipe, tuiSliderOptionsProvider };
|
|
440
|
+
export { TUI_SLIDER_DEFAULT_OPTIONS, TUI_SLIDER_OPTIONS, TuiSliderComponent, TuiSliderKeyStepsDirective, TuiSliderModule, TuiSliderOldComponent, TuiSliderReadonlyDirective, TuiSliderThumbLabelComponent, TuiSliderTickLabelPipe, tuiSliderOptionsProvider };
|
|
394
441
|
//# sourceMappingURL=taiga-ui-kit-components-slider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"taiga-ui-kit-components-slider.js","sources":["ng://@taiga-ui/kit/components/slider/slider-options.ts","ng://@taiga-ui/kit/components/slider/slider.component.ts","ng://@taiga-ui/kit/components/slider/slider-key-steps.directive.ts","ng://@taiga-ui/kit/components/slider/slider-old.component.ts","ng://@taiga-ui/kit/components/slider/slider-readonly.directive.ts","ng://@taiga-ui/kit/components/slider/slider.module.ts","ng://@taiga-ui/kit/components/slider/taiga-ui-kit-components-slider.ts"],"sourcesContent":["import {InjectionToken, ValueProvider} from '@angular/core';\nimport {TuiSizeS} from '@taiga-ui/core';\n\nexport interface TuiSliderOptions {\n readonly size: TuiSizeS;\n readonly trackColor: string;\n}\n\nexport const TUI_SLIDER_DEFAULT_OPTIONS: TuiSliderOptions = {\n size: 'm',\n trackColor: 'var(--tui-base-03)',\n};\n\nexport const TUI_SLIDER_OPTIONS = new InjectionToken<TuiSliderOptions>(\n 'Default parameters for Slider component',\n {factory: () => TUI_SLIDER_DEFAULT_OPTIONS},\n);\n\nexport function tuiSliderOptionsProvider(\n options: Partial<TuiSliderOptions>,\n): ValueProvider {\n return {\n provide: TUI_SLIDER_OPTIONS,\n useValue: {...TUI_SLIDER_DEFAULT_OPTIONS, ...options},\n };\n}\n","import {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n HostBinding,\n Inject,\n Input,\n Optional,\n Self,\n} from '@angular/core';\nimport {NgControl, NgModel} from '@angular/forms';\nimport {USER_AGENT} from '@ng-web-apis/common';\nimport {\n CHROMIUM_EDGE_START_VERSION,\n isEdgeOlderThan,\n tuiDefaultProp,\n watch,\n} from '@taiga-ui/cdk';\nimport {TuiSizeS} from '@taiga-ui/core';\nimport {take} from 'rxjs/operators';\n\nimport {TUI_SLIDER_OPTIONS, TuiSliderOptions} from './slider-options';\n\n@Component({\n /**\n * We have to call our component as `<input tuiSlider type=\"range\" ... />`\n * because otherwise built-in angular\n * {@link https://github.com/angular/angular/blob/master/packages/forms/src/directives/range_value_accessor.ts#L45 RangeValueAccessor}\n * cannot be matched by its CSS selector.\n */\n selector: 'input[type=range][tuiSlider]',\n template: ``,\n styleUrls: ['./slider.style.less'],\n host: {\n /**\n * For change detection.\n * Webkit does not have built-in method for customization of filling progress (as Firefox).\n * We draw filling of progress by `background: linear-gradient(...)` of the track.\n * This function triggers change detection (for {@link valuePercentage} function) when we drag thumb of the input.\n */\n '(input)': '0',\n '[style.--tui-slider-track-color]': 'options.trackColor',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TuiSliderComponent {\n @Input()\n @HostBinding('attr.data-size')\n @tuiDefaultProp()\n size: TuiSizeS = this.options.size;\n\n @Input()\n @tuiDefaultProp()\n segments = 1;\n\n get min(): number {\n return Number(this.elementRef.nativeElement.min);\n }\n\n get max(): number {\n return Number(this.elementRef.nativeElement.max || 100);\n }\n\n get step(): number {\n return Number(this.elementRef.nativeElement.step) || 1;\n }\n\n get value(): number {\n return Number(this.elementRef.nativeElement.value) || 0;\n }\n\n set value(newValue: number) {\n this.elementRef.nativeElement.value = `${newValue}`;\n }\n\n @HostBinding('style.--tui-slider-fill-percentage.%')\n get valuePercentage(): number {\n return (100 * (this.value - this.min)) / (this.max - this.min) || 0;\n }\n\n @HostBinding('style.--tui-slider-segment-width.%')\n get segmentWidth(): number {\n return 100 / Math.max(1, this.segments);\n }\n\n @HostBinding('class._old-edge')\n get isOldEdge(): boolean {\n return isEdgeOlderThan(CHROMIUM_EDGE_START_VERSION, this.userAgent);\n }\n\n constructor(\n @Optional()\n @Self()\n @Inject(NgControl)\n control: NgControl | null,\n @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef,\n @Inject(TUI_SLIDER_OPTIONS) readonly options: TuiSliderOptions,\n @Inject(ElementRef) private readonly elementRef: ElementRef<HTMLInputElement>,\n @Inject(USER_AGENT) private readonly userAgent: string,\n ) {\n if (control instanceof NgModel) {\n /**\n * The ValueAccessor.writeValue method is called twice on any value accessor during component initialization,\n * when a control is bound using [(ngModel)], first time with a phantom null value.\n * With `changeDetection: ChangeDetectionStrategy.OnPush` the second call of writeValue with real value don't re-render the view.\n * ___\n * See this {@link https://github.com/angular/angular/issues/14988 issue}\n */\n control.valueChanges?.pipe(watch(changeDetectorRef), take(1)).subscribe();\n }\n }\n}\n","import {\n ChangeDetectorRef,\n Directive,\n ElementRef,\n HostListener,\n Inject,\n Input,\n Optional,\n Output,\n Pipe,\n PipeTransform,\n Self,\n} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {\n AbstractTuiControl,\n clamp,\n isNativeFocused,\n tuiAssert,\n tuiDefaultProp,\n TuiFocusableElementAccessor,\n typedFromEvent,\n} from '@taiga-ui/cdk';\nimport {TuiKeySteps} from '@taiga-ui/kit/types';\nimport {\n tuiCheckKeyStepsHaveMinMaxPercents,\n tuiKeyStepValueToPercentage,\n tuiPercentageToKeyStepValue,\n} from '@taiga-ui/kit/utils';\nimport {map} from 'rxjs/operators';\n\nimport {TuiSliderComponent} from './slider.component';\n\n// @dynamic\n@Directive({\n selector: 'input[tuiSlider][keySteps]',\n host: {\n '[attr.aria-valuenow]': 'controlValue',\n '[attr.aria-valuemin]': 'min',\n '[attr.aria-valuemax]': 'max',\n },\n})\nexport class TuiSliderKeyStepsDirective\n extends AbstractTuiControl<number>\n implements TuiFocusableElementAccessor\n{\n @Input()\n @tuiDefaultProp(\n tuiCheckKeyStepsHaveMinMaxPercents,\n 'Should contain min and max values',\n )\n keySteps: TuiKeySteps = [];\n\n @Output()\n keyStepsInput = typedFromEvent(this.elementRef.nativeElement, 'input').pipe(\n map(() => this.controlValue),\n );\n\n get nativeFocusableElement(): HTMLInputElement | null {\n return this.computedDisabled ? null : this.elementRef.nativeElement;\n }\n\n get focused(): boolean {\n return isNativeFocused(this.nativeFocusableElement);\n }\n\n get min(): number {\n return this.keySteps[0]?.[1] || 0;\n }\n\n get max(): number {\n return this.keySteps[this.keySteps.length - 1]?.[1] || 100;\n }\n\n get controlValue(): number {\n return tuiPercentageToKeyStepValue(this.slider.valuePercentage, this.keySteps);\n }\n\n constructor(\n @Optional()\n @Self()\n @Inject(NgControl)\n control: NgControl | null,\n @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef,\n @Inject(ElementRef) private readonly elementRef: ElementRef<HTMLInputElement>,\n @Inject(TuiSliderComponent) private readonly slider: TuiSliderComponent,\n ) {\n super(control, changeDetectorRef);\n }\n\n @HostListener('change')\n updateControlValue(): void {\n this.updateValue(this.controlValue);\n }\n\n writeValue(controlValue: number | null): void {\n if (controlValue === null) {\n return;\n }\n\n const clampedControlValue = clamp(controlValue, this.min, this.max);\n\n tuiAssert.assert(\n controlValue === clampedControlValue,\n '\\n[SliderKeySteps]: You cannot programmatically set value which is less/more than min/max',\n );\n\n this.slider.value = this.transformToNativeValue(clampedControlValue);\n }\n\n protected getFallbackValue(): number {\n return 0;\n }\n\n private transformToNativeValue(controlValue: number): number {\n const {min, max} = this.slider;\n const newValuePercentage = tuiKeyStepValueToPercentage(\n controlValue,\n this.keySteps,\n );\n\n return (newValuePercentage * (max - min)) / 100 + min;\n }\n}\n\n/**\n * @deprecated DONT USE IT! It is just temporary solution for internal purposes only. We will delete it in next major release.\n * TODO delete it in v3.0\n *\n */\n@Pipe({name: 'tuiSliderTickLabel'})\nexport class TuiSliderTickLabelPipe implements PipeTransform {\n transform(tickIndex: number, totalSegments: number, keySteps: TuiKeySteps): number {\n const percentage = (100 / totalSegments) * tickIndex;\n\n return tuiPercentageToKeyStepValue(percentage, keySteps);\n }\n}\n","import {DOCUMENT} from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n forwardRef,\n Inject,\n Optional,\n Self,\n} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {\n isNativeFocused,\n TUI_FOCUSABLE_ITEM_ACCESSOR,\n TuiFocusableElementAccessor,\n TuiNativeFocusableElement,\n} from '@taiga-ui/cdk';\nimport {AbstractTuiSlider} from '@taiga-ui/kit/abstract';\nimport {TUI_FROM_TO_TEXTS} from '@taiga-ui/kit/tokens';\nimport {Observable} from 'rxjs';\n\n/**\n * @deprecated use {@link TuiSliderComponent} instead\n * TODO: 3.0 remove\n */\n// @dynamic\n@Component({\n selector: 'tui-slider',\n templateUrl: '../../abstract/slider/slider.common.template.html',\n styleUrls: [\n '../../abstract/slider/slider.common.style.less',\n './slider-old.style.less',\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n {\n provide: TUI_FOCUSABLE_ITEM_ACCESSOR,\n useExisting: forwardRef(() => TuiSliderOldComponent),\n },\n ],\n})\nexport class TuiSliderOldComponent\n extends AbstractTuiSlider<number>\n implements TuiFocusableElementAccessor\n{\n constructor(\n @Optional()\n @Self()\n @Inject(NgControl)\n control: NgControl | null,\n @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef,\n @Inject(DOCUMENT) documentRef: Document,\n @Inject(TUI_FROM_TO_TEXTS) fromToTexts$: Observable<[string, string]>,\n ) {\n super(control, changeDetectorRef, documentRef, fromToTexts$);\n }\n\n get nativeFocusableElement(): TuiNativeFocusableElement | null {\n return this.dotRight ? this.dotRight.nativeElement : null;\n }\n\n get focused(): boolean {\n return isNativeFocused(this.nativeFocusableElement);\n }\n\n get left(): number {\n return 0;\n }\n\n get right(): number {\n return 100 - 100 * this.getFractionFromValue(this.value);\n }\n\n processValue(value: number): void {\n this.updateValue(this.valueGuard(value));\n }\n\n decrement(): void {\n this.processStep(false);\n }\n\n increment(): void {\n this.processStep(true);\n }\n\n protected getFallbackValue(): number {\n return 0;\n }\n\n protected processStep(increment: boolean): void {\n const fraction = this.getFractionFromValue(this.value);\n const step = this.computedStep;\n const value = this.getValueFromFraction(\n increment ? fraction + step : fraction - step,\n );\n\n this.processValue(value);\n }\n}\n","import {DOCUMENT} from '@angular/common';\nimport {Directive, ElementRef, HostListener, Inject, Input} from '@angular/core';\nimport {\n tuiCoerceBooleanProperty,\n tuiDefaultProp,\n TuiDestroyService,\n typedFromEvent,\n} from '@taiga-ui/cdk';\nimport {combineLatest, merge, Observable} from 'rxjs';\nimport {filter, mapTo, takeUntil, tap} from 'rxjs/operators';\n\nconst SLIDER_INTERACTION_KEYS = new Set([\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowDown',\n 'Home',\n 'End',\n 'PageUp',\n 'PageDown',\n]);\n\n/**\n * Native <input type='range' readonly> doesn't work.\n * This directive imitates this native behaviour.\n */\n// @dynamic\n@Directive({\n selector: 'input[tuiSlider][readonly]',\n providers: [TuiDestroyService],\n})\nexport class TuiSliderReadonlyDirective {\n @Input()\n @tuiDefaultProp()\n readonly: string | boolean = true;\n\n constructor(\n @Inject(ElementRef) elementRef: ElementRef<HTMLInputElement>,\n @Inject(DOCUMENT) documentRef: Document,\n @Inject(TuiDestroyService)\n destroy$: Observable<unknown>,\n ) {\n const touchStart$ = typedFromEvent(elementRef.nativeElement, 'touchstart', {\n passive: false,\n });\n const touchMove$ = typedFromEvent(documentRef, 'touchmove', {\n passive: false,\n });\n const touchEnd$ = typedFromEvent(documentRef, 'touchend', {\n passive: true,\n });\n\n const shouldPreventMove$ = merge(\n touchStart$.pipe(\n tap(e => this.preventEvent(e)),\n mapTo(true),\n ),\n touchEnd$.pipe(mapTo(false)),\n );\n\n /**\n * @bad TODO think about another solution.\n * Keep in mind that preventing touch event (on slider) inside `@HostListener('touchstart')` doesn't work for mobile chrome.\n */\n combineLatest([touchMove$, shouldPreventMove$])\n .pipe(\n filter(([_, shouldPreventMove]) => shouldPreventMove),\n takeUntil(destroy$),\n )\n .subscribe(([moveEvent]) => this.preventEvent(moveEvent));\n }\n\n @HostListener('mousedown', ['$event'])\n preventEvent(event: Event): void {\n if (event.cancelable && tuiCoerceBooleanProperty(this.readonly)) {\n event.preventDefault();\n }\n }\n\n @HostListener('keydown', ['$event'])\n preventKeyboardInteraction(event: KeyboardEvent): void {\n if (SLIDER_INTERACTION_KEYS.has(event.key)) {\n this.preventEvent(event);\n }\n }\n}\n","import {CommonModule} from '@angular/common';\nimport {NgModule} from '@angular/core';\nimport {\n TuiActiveZoneModule,\n TuiFocusableModule,\n TuiFocusVisibleModule,\n TuiRepeatTimesModule,\n} from '@taiga-ui/cdk';\nimport {TuiFormatNumberPipeModule} from '@taiga-ui/core';\n\nimport {TuiSliderComponent} from './slider.component';\nimport {\n TuiSliderKeyStepsDirective,\n TuiSliderTickLabelPipe,\n} from './slider-key-steps.directive';\nimport {TuiSliderOldComponent} from './slider-old.component';\nimport {TuiSliderReadonlyDirective} from './slider-readonly.directive';\n\n@NgModule({\n imports: [\n CommonModule,\n TuiRepeatTimesModule,\n TuiFocusableModule,\n TuiFocusVisibleModule,\n TuiActiveZoneModule,\n TuiFormatNumberPipeModule,\n ],\n declarations: [\n TuiSliderComponent,\n TuiSliderKeyStepsDirective,\n TuiSliderReadonlyDirective,\n TuiSliderTickLabelPipe,\n TuiSliderOldComponent,\n ],\n exports: [\n TuiSliderComponent,\n TuiSliderKeyStepsDirective,\n TuiSliderReadonlyDirective,\n TuiSliderTickLabelPipe,\n TuiSliderOldComponent,\n ],\n})\nexport class TuiSliderModule {}\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-slider.js","sources":["ng://@taiga-ui/kit/components/slider/slider-options.ts","ng://@taiga-ui/kit/components/slider/slider.component.ts","ng://@taiga-ui/kit/components/slider/helpers/slider-key-steps.directive.ts","ng://@taiga-ui/kit/components/slider/helpers/slider-readonly.directive.ts","ng://@taiga-ui/kit/components/slider/helpers/slider-thumb-label/slider-thumb-label.component.ts","ng://@taiga-ui/kit/components/slider/slider-old.component.ts","ng://@taiga-ui/kit/components/slider/slider.module.ts","ng://@taiga-ui/kit/components/slider/taiga-ui-kit-components-slider.ts"],"sourcesContent":["import {InjectionToken, ValueProvider} from '@angular/core';\nimport {TuiSizeS} from '@taiga-ui/core';\n\nexport interface TuiSliderOptions {\n readonly size: TuiSizeS;\n readonly trackColor: string;\n}\n\nexport const TUI_SLIDER_DEFAULT_OPTIONS: TuiSliderOptions = {\n size: 'm',\n trackColor: 'var(--tui-base-03)',\n};\n\nexport const TUI_SLIDER_OPTIONS = new InjectionToken<TuiSliderOptions>(\n 'Default parameters for Slider component',\n {factory: () => TUI_SLIDER_DEFAULT_OPTIONS},\n);\n\nexport function tuiSliderOptionsProvider(\n options: Partial<TuiSliderOptions>,\n): ValueProvider {\n return {\n provide: TUI_SLIDER_OPTIONS,\n useValue: {...TUI_SLIDER_DEFAULT_OPTIONS, ...options},\n };\n}\n","import {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n HostBinding,\n Inject,\n Input,\n Optional,\n Self,\n} from '@angular/core';\nimport {NgControl, NgModel} from '@angular/forms';\nimport {USER_AGENT} from '@ng-web-apis/common';\nimport {\n CHROMIUM_EDGE_START_VERSION,\n isEdgeOlderThan,\n tuiDefaultProp,\n watch,\n} from '@taiga-ui/cdk';\nimport {TuiSizeS} from '@taiga-ui/core';\nimport {take} from 'rxjs/operators';\n\nimport {TUI_SLIDER_OPTIONS, TuiSliderOptions} from './slider-options';\n\n@Component({\n /**\n * We have to call our component as `<input tuiSlider type=\"range\" ... />`\n * because otherwise built-in angular\n * {@link https://github.com/angular/angular/blob/master/packages/forms/src/directives/range_value_accessor.ts#L45 RangeValueAccessor}\n * cannot be matched by its CSS selector.\n */\n selector: 'input[type=range][tuiSlider]',\n template: ``,\n styleUrls: ['./slider.style.less'],\n host: {\n /**\n * For change detection.\n * Webkit does not have built-in method for customization of filling progress (as Firefox).\n * We draw filling of progress by `background: linear-gradient(...)` of the track.\n * This function triggers change detection (for {@link valuePercentage} function) when we drag thumb of the input.\n */\n '(input)': '0',\n '[style.--tui-slider-track-color]': 'options.trackColor',\n },\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TuiSliderComponent {\n @Input()\n @HostBinding('attr.data-size')\n @tuiDefaultProp()\n size: TuiSizeS = this.options.size;\n\n @Input()\n @tuiDefaultProp()\n segments = 1;\n\n get min(): number {\n return Number(this.elementRef.nativeElement.min);\n }\n\n get max(): number {\n return Number(this.elementRef.nativeElement.max || 100);\n }\n\n get step(): number {\n return Number(this.elementRef.nativeElement.step) || 1;\n }\n\n get value(): number {\n const {elementRef, control} = this;\n const noKeySteps = !elementRef.nativeElement.hasAttribute('data-key-steps');\n\n if (noKeySteps && control instanceof NgModel) {\n /**\n * If developer uses `[(ngModel)]` and programmatically change value,\n * the `elementRef.nativeElement.value` is equal to the previous value at this moment.\n */\n return control.viewModel;\n }\n\n return Number(elementRef.nativeElement.value) || 0;\n }\n\n set value(newValue: number) {\n this.elementRef.nativeElement.value = `${newValue}`;\n }\n\n @HostBinding('style.--tui-slider-fill-percentage.%')\n get valuePercentage(): number {\n return (100 * (this.value - this.min)) / (this.max - this.min) || 0;\n }\n\n @HostBinding('style.--tui-slider-segment-width.%')\n get segmentWidth(): number {\n return 100 / Math.max(1, this.segments);\n }\n\n @HostBinding('class._old-edge')\n get isOldEdge(): boolean {\n return isEdgeOlderThan(CHROMIUM_EDGE_START_VERSION, this.userAgent);\n }\n\n constructor(\n @Optional()\n @Self()\n @Inject(NgControl)\n private readonly control: NgControl | null,\n @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef,\n @Inject(TUI_SLIDER_OPTIONS) readonly options: TuiSliderOptions,\n @Inject(ElementRef) readonly elementRef: ElementRef<HTMLInputElement>,\n @Inject(USER_AGENT) private readonly userAgent: string,\n ) {\n if (control instanceof NgModel) {\n /**\n * The ValueAccessor.writeValue method is called twice on any value accessor during component initialization,\n * when a control is bound using [(ngModel)], first time with a phantom null value.\n * With `changeDetection: ChangeDetectionStrategy.OnPush` the second call of writeValue with real value don't re-render the view.\n * ___\n * See this {@link https://github.com/angular/angular/issues/14988 issue}\n */\n control.valueChanges?.pipe(watch(changeDetectorRef), take(1)).subscribe();\n }\n }\n}\n","import {\n ChangeDetectorRef,\n Directive,\n ElementRef,\n HostListener,\n Inject,\n Input,\n Optional,\n Output,\n Pipe,\n PipeTransform,\n Self,\n} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {\n AbstractTuiControl,\n clamp,\n isNativeFocused,\n tuiAssert,\n tuiDefaultProp,\n TuiFocusableElementAccessor,\n typedFromEvent,\n} from '@taiga-ui/cdk';\nimport {TuiKeySteps} from '@taiga-ui/kit/types';\nimport {\n tuiCheckKeyStepsHaveMinMaxPercents,\n tuiKeyStepValueToPercentage,\n tuiPercentageToKeyStepValue,\n} from '@taiga-ui/kit/utils';\nimport {map} from 'rxjs/operators';\n\nimport {TuiSliderComponent} from '../slider.component';\n\n// @dynamic\n@Directive({\n selector: 'input[tuiSlider][keySteps]',\n host: {\n '[attr.data-key-steps]': 'true',\n '[attr.aria-valuenow]': 'controlValue',\n '[attr.aria-valuemin]': 'min',\n '[attr.aria-valuemax]': 'max',\n },\n})\nexport class TuiSliderKeyStepsDirective\n extends AbstractTuiControl<number>\n implements TuiFocusableElementAccessor\n{\n @Input()\n @tuiDefaultProp(\n tuiCheckKeyStepsHaveMinMaxPercents,\n 'Should contain min and max values',\n )\n keySteps: TuiKeySteps = [];\n\n @Output()\n keyStepsInput = typedFromEvent(this.elementRef.nativeElement, 'input').pipe(\n map(() => this.controlValue),\n );\n\n get nativeFocusableElement(): HTMLInputElement | null {\n return this.computedDisabled ? null : this.elementRef.nativeElement;\n }\n\n get focused(): boolean {\n return isNativeFocused(this.nativeFocusableElement);\n }\n\n get min(): number {\n return this.keySteps[0]?.[1] || 0;\n }\n\n get max(): number {\n return this.keySteps[this.keySteps.length - 1]?.[1] || 100;\n }\n\n get controlValue(): number {\n return tuiPercentageToKeyStepValue(this.slider.valuePercentage, this.keySteps);\n }\n\n constructor(\n @Optional()\n @Self()\n @Inject(NgControl)\n control: NgControl | null,\n @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef,\n @Inject(ElementRef) private readonly elementRef: ElementRef<HTMLInputElement>,\n @Inject(TuiSliderComponent) private readonly slider: TuiSliderComponent,\n ) {\n super(control, changeDetectorRef);\n }\n\n @HostListener('change')\n updateControlValue(): void {\n this.updateValue(this.controlValue);\n }\n\n writeValue(controlValue: number | null): void {\n if (controlValue === null) {\n return;\n }\n\n const clampedControlValue = clamp(controlValue, this.min, this.max);\n\n tuiAssert.assert(\n controlValue === clampedControlValue,\n '\\n[SliderKeySteps]: You cannot programmatically set value which is less/more than min/max',\n );\n\n this.slider.value = this.transformToNativeValue(clampedControlValue);\n }\n\n protected getFallbackValue(): number {\n return 0;\n }\n\n private transformToNativeValue(controlValue: number): number {\n const {min, max} = this.slider;\n const newValuePercentage = tuiKeyStepValueToPercentage(\n controlValue,\n this.keySteps,\n );\n\n return (newValuePercentage * (max - min)) / 100 + min;\n }\n}\n\n/**\n * @deprecated DONT USE IT! It is just temporary solution for internal purposes only. We will delete it in next major release.\n * TODO delete it in v3.0\n *\n */\n@Pipe({name: 'tuiSliderTickLabel'})\nexport class TuiSliderTickLabelPipe implements PipeTransform {\n transform(tickIndex: number, totalSegments: number, keySteps: TuiKeySteps): number {\n const percentage = (100 / totalSegments) * tickIndex;\n\n return tuiPercentageToKeyStepValue(percentage, keySteps);\n }\n}\n","import {DOCUMENT} from '@angular/common';\nimport {Directive, ElementRef, HostListener, Inject, Input} from '@angular/core';\nimport {\n tuiCoerceBooleanProperty,\n tuiDefaultProp,\n TuiDestroyService,\n typedFromEvent,\n} from '@taiga-ui/cdk';\nimport {combineLatest, merge, Observable} from 'rxjs';\nimport {filter, mapTo, takeUntil, tap} from 'rxjs/operators';\n\nconst SLIDER_INTERACTION_KEYS = new Set([\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowUp',\n 'ArrowDown',\n 'Home',\n 'End',\n 'PageUp',\n 'PageDown',\n]);\n\n/**\n * Native <input type='range' readonly> doesn't work.\n * This directive imitates this native behaviour.\n */\n// @dynamic\n@Directive({\n selector: 'input[tuiSlider][readonly]',\n providers: [TuiDestroyService],\n})\nexport class TuiSliderReadonlyDirective {\n @Input()\n @tuiDefaultProp()\n readonly: string | boolean = true;\n\n constructor(\n @Inject(ElementRef) elementRef: ElementRef<HTMLInputElement>,\n @Inject(DOCUMENT) documentRef: Document,\n @Inject(TuiDestroyService)\n destroy$: Observable<unknown>,\n ) {\n const touchStart$ = typedFromEvent(elementRef.nativeElement, 'touchstart', {\n passive: false,\n });\n const touchMove$ = typedFromEvent(documentRef, 'touchmove', {\n passive: false,\n });\n const touchEnd$ = typedFromEvent(documentRef, 'touchend', {\n passive: true,\n });\n\n const shouldPreventMove$ = merge(\n touchStart$.pipe(\n tap(e => this.preventEvent(e)),\n mapTo(true),\n ),\n touchEnd$.pipe(mapTo(false)),\n );\n\n /**\n * @bad TODO think about another solution.\n * Keep in mind that preventing touch event (on slider) inside `@HostListener('touchstart')` doesn't work for mobile chrome.\n */\n combineLatest([touchMove$, shouldPreventMove$])\n .pipe(\n filter(([_, shouldPreventMove]) => shouldPreventMove),\n takeUntil(destroy$),\n )\n .subscribe(([moveEvent]) => this.preventEvent(moveEvent));\n }\n\n @HostListener('mousedown', ['$event'])\n preventEvent(event: Event): void {\n if (event.cancelable && tuiCoerceBooleanProperty(this.readonly)) {\n event.preventDefault();\n }\n }\n\n @HostListener('keydown', ['$event'])\n preventKeyboardInteraction(event: KeyboardEvent): void {\n if (SLIDER_INTERACTION_KEYS.has(event.key)) {\n this.preventEvent(event);\n }\n }\n}\n","import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n ContentChild,\n} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {tuiAssert} from '@taiga-ui/cdk';\nimport {TuiSizeS} from '@taiga-ui/core';\n\nimport {TuiSliderComponent} from '../../slider.component';\n\n@Component({\n selector: '[tuiSliderThumbLabel]',\n templateUrl: './slider-thumb-label.template.html',\n styleUrls: ['./slider-thumb-label.style.less'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TuiSliderThumbLabelComponent implements AfterContentInit {\n @ContentChild(TuiSliderComponent)\n readonly slider?: TuiSliderComponent;\n\n @ContentChild(NgControl)\n readonly control?: NgControl;\n\n get size(): TuiSizeS {\n return this.slider?.size || 'm';\n }\n\n get ratio(): number {\n return (this.slider?.valuePercentage || 0) / 100;\n }\n\n get ghostLeft(): number {\n return this.ratio * (this.slider?.elementRef.nativeElement.offsetWidth || 0);\n }\n\n ngAfterContentInit(): void {\n tuiAssert.assert(\n Boolean(this.control?.valueChanges),\n `\\n[tuiSliderThumbLabel] expected <input tuiSlider type=\"range\" /> to use Angular Forms.\\n` +\n 'Use [(ngModel)] or [formControl] or formControlName for correct work.',\n );\n }\n}\n","import {DOCUMENT} from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n forwardRef,\n Inject,\n Optional,\n Self,\n} from '@angular/core';\nimport {NgControl} from '@angular/forms';\nimport {\n isNativeFocused,\n TUI_FOCUSABLE_ITEM_ACCESSOR,\n TuiFocusableElementAccessor,\n TuiNativeFocusableElement,\n} from '@taiga-ui/cdk';\nimport {AbstractTuiSlider} from '@taiga-ui/kit/abstract';\nimport {TUI_FROM_TO_TEXTS} from '@taiga-ui/kit/tokens';\nimport {Observable} from 'rxjs';\n\n/**\n * @deprecated use {@link TuiSliderComponent} instead\n * TODO: 3.0 remove\n */\n// @dynamic\n@Component({\n selector: 'tui-slider',\n templateUrl: '../../abstract/slider/slider.common.template.html',\n styleUrls: [\n '../../abstract/slider/slider.common.style.less',\n './slider-old.style.less',\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n {\n provide: TUI_FOCUSABLE_ITEM_ACCESSOR,\n useExisting: forwardRef(() => TuiSliderOldComponent),\n },\n ],\n})\nexport class TuiSliderOldComponent\n extends AbstractTuiSlider<number>\n implements TuiFocusableElementAccessor\n{\n constructor(\n @Optional()\n @Self()\n @Inject(NgControl)\n control: NgControl | null,\n @Inject(ChangeDetectorRef) changeDetectorRef: ChangeDetectorRef,\n @Inject(DOCUMENT) documentRef: Document,\n @Inject(TUI_FROM_TO_TEXTS) fromToTexts$: Observable<[string, string]>,\n ) {\n super(control, changeDetectorRef, documentRef, fromToTexts$);\n }\n\n get nativeFocusableElement(): TuiNativeFocusableElement | null {\n return this.dotRight ? this.dotRight.nativeElement : null;\n }\n\n get focused(): boolean {\n return isNativeFocused(this.nativeFocusableElement);\n }\n\n get left(): number {\n return 0;\n }\n\n get right(): number {\n return 100 - 100 * this.getFractionFromValue(this.value);\n }\n\n processValue(value: number): void {\n this.updateValue(this.valueGuard(value));\n }\n\n decrement(): void {\n this.processStep(false);\n }\n\n increment(): void {\n this.processStep(true);\n }\n\n protected getFallbackValue(): number {\n return 0;\n }\n\n protected processStep(increment: boolean): void {\n const fraction = this.getFractionFromValue(this.value);\n const step = this.computedStep;\n const value = this.getValueFromFraction(\n increment ? fraction + step : fraction - step,\n );\n\n this.processValue(value);\n }\n}\n","import {CommonModule} from '@angular/common';\nimport {NgModule} from '@angular/core';\nimport {\n TuiActiveZoneModule,\n TuiFocusableModule,\n TuiFocusVisibleModule,\n TuiRepeatTimesModule,\n} from '@taiga-ui/cdk';\nimport {TuiFormatNumberPipeModule} from '@taiga-ui/core';\n\nimport {\n TuiSliderKeyStepsDirective,\n TuiSliderTickLabelPipe,\n} from './helpers/slider-key-steps.directive';\nimport {TuiSliderReadonlyDirective} from './helpers/slider-readonly.directive';\nimport {TuiSliderThumbLabelComponent} from './helpers/slider-thumb-label/slider-thumb-label.component';\nimport {TuiSliderComponent} from './slider.component';\nimport {TuiSliderOldComponent} from './slider-old.component';\n\n@NgModule({\n imports: [\n CommonModule,\n TuiRepeatTimesModule,\n TuiFocusableModule,\n TuiFocusVisibleModule,\n TuiActiveZoneModule,\n TuiFormatNumberPipeModule,\n ],\n declarations: [\n TuiSliderComponent,\n TuiSliderThumbLabelComponent,\n TuiSliderKeyStepsDirective,\n TuiSliderReadonlyDirective,\n TuiSliderTickLabelPipe,\n TuiSliderOldComponent,\n ],\n exports: [\n TuiSliderComponent,\n TuiSliderThumbLabelComponent,\n TuiSliderKeyStepsDirective,\n TuiSliderReadonlyDirective,\n TuiSliderTickLabelPipe,\n TuiSliderOldComponent,\n ],\n})\nexport class TuiSliderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate, __param } from 'tslib';
|
|
2
2
|
import { TemplateRef, Inject, Directive, InjectionToken, ElementRef, Optional, HostBinding, Component, ChangeDetectionStrategy, EventEmitter, Renderer2, ChangeDetectorRef, ContentChildren, forwardRef, Input, Output, HostListener, ViewChild, NgZone, NgModule } from '@angular/core';
|
|
3
3
|
import { RouterLinkActive } from '@angular/router';
|
|
4
|
-
import { TuiDestroyService, TuiFocusVisibleService, typedFromEvent, tuiCustomEvent, isNativeFocused, setNativeFocused, TUI_IS_IOS, TUI_IS_ANDROID, EMPTY_QUERY, moveFocus, TuiResizeService, tuiDefaultProp, tuiAssertIsHTMLElement, getClosestFocusable, toInt, tuiZonefree, px, TuiFocusableModule } from '@taiga-ui/cdk';
|
|
4
|
+
import { TuiDestroyService, TuiFocusVisibleService, typedFromEvent, tuiCustomEvent, isNativeFocused, setNativeFocused, TUI_IS_IOS, TUI_IS_ANDROID, EMPTY_QUERY, moveFocus, TuiResizeService, tuiDefaultProp, tuiClamp, tuiAssertIsHTMLElement, getClosestFocusable, toInt, tuiZonefree, px, TuiFocusableModule } from '@taiga-ui/cdk';
|
|
5
5
|
import { TuiRouterLinkActiveService, MODE_PROVIDER, TUI_MODE, TuiHostedDropdownModule, TuiSvgModule } from '@taiga-ui/core';
|
|
6
6
|
import { TUI_TAB_MARGIN, TUI_MOBILE_AWARE, TUI_MORE_WORD } from '@taiga-ui/kit/tokens';
|
|
7
7
|
import { EMPTY, merge, identity, Observable, ReplaySubject, of } from 'rxjs';
|
|
@@ -111,7 +111,7 @@ TuiTabComponent = __decorate([
|
|
|
111
111
|
'[style.--tui-tab-margin.px]': 'margin',
|
|
112
112
|
type: 'button',
|
|
113
113
|
},
|
|
114
|
-
styles: [":host-context(._underline):hover{box-shadow:inset 0 -2px var(--tui-base-03)}:host-context([tuiTabs]>):first-child,:host-context([tuiTabs]>:first-child),:host-context(tui-tabs>):first-child,:host-context(tui-tabs>:first-child){margin-left:0}:host{transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:0 0;font-size:inherit;line-height:inherit;position:relative;display:flex;flex-shrink:0;height:100%;box-sizing:border-box;justify-content:space-between;align-items:center;white-space:nowrap;cursor:pointer;outline:0;text-decoration:none;color:inherit;transition-property:color,box-shadow,opacity;margin-left:var(--tui-tab-margin,1.5rem)}:host:
|
|
114
|
+
styles: [":host-context(._underline):hover{box-shadow:inset 0 -2px var(--tui-base-03)}:host-context([tuiTabs]>):first-child,:host-context([tuiTabs]>:first-child),:host-context(tui-tabs>):first-child,:host-context(tui-tabs>:first-child){margin-left:0}:host{transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;border:0;background:0 0;font-size:inherit;line-height:inherit;position:relative;display:flex;flex-shrink:0;height:100%;box-sizing:border-box;justify-content:space-between;align-items:center;white-space:nowrap;cursor:pointer;outline:0;text-decoration:none;color:inherit;transition-property:color,box-shadow,opacity;margin-left:var(--tui-tab-margin,1.5rem)}:host:disabled{opacity:var(--tui-disabled-opacity);pointer-events:none}:host:not([data-mode])._active{opacity:1;color:var(--tui-text-01);box-shadow:none}:host[data-mode=onDark]{color:rgba(255,255,255,.72)}:host[data-mode=onDark]._active,:host[data-mode=onDark]:hover{color:#fff}:host[data-mode=onDark]._focus-visible .t-highlight{background:var(--tui-clear-inverse);color:var(--tui-text-01)}:host[data-mode=onLight]{color:var(--tui-text-02)}:host[data-mode=onLight]._active,:host[data-mode=onLight]:hover{color:var(--tui-text-01)}:host[data-mode=onLight]._focus-visible .t-highlight{background:var(--tui-text-01);color:#fff}:host._focus-visible .t-highlight{background:var(--tui-selection)}:host._android{transition-property:opacity;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;height:3rem;flex:1;flex-shrink:0;justify-content:center;margin:0;text-transform:uppercase;color:var(--tui-base-09);opacity:.5;font-size:.875rem;font-weight:500;letter-spacing:-.008125rem;font-family:-apple-system,BlinkMacSystemFont,Roboto,'Helvetica Neue',sans-serif}:host._android:hover{box-shadow:none}:host._android._active{opacity:1;color:var(--tui-base-09)}:host._android .t-highlight{width:auto}:host._ios{height:1.75rem;flex:1;flex-shrink:0;justify-content:center;margin:0;color:var(--tui-base-01);opacity:1;font-size:.8125rem;font-weight:500;letter-spacing:-.005rem;font-family:-apple-system,BlinkMacSystemFont,Roboto,'Helvetica Neue',sans-serif}:host._ios:hover{box-shadow:none}:host._ios._active{font-size:.875rem;font-weight:600;color:var(--tui-link)}:host._ios .t-highlight{width:auto}@media (hover:hover){:host:hover{color:var(--tui-text-01)}}.t-highlight{display:inline-flex;width:100%;align-items:center;justify-content:inherit}.t-highlight ::ng-deep>*{flex-shrink:0}"]
|
|
115
115
|
}),
|
|
116
116
|
__param(0, Optional()),
|
|
117
117
|
__param(0, Inject(RouterLinkActive)),
|
|
@@ -331,8 +331,10 @@ let TuiTabsWithMoreComponent = class TuiTabsWithMoreComponent {
|
|
|
331
331
|
}
|
|
332
332
|
get activeElement() {
|
|
333
333
|
var _a;
|
|
334
|
-
|
|
335
|
-
|
|
334
|
+
const { tabs } = this;
|
|
335
|
+
const safeActiveIndex = tuiClamp(this.activeItemIndex || 0, 0, tabs.length - 2);
|
|
336
|
+
return this.options.exposeActive || this.lastVisibleIndex >= safeActiveIndex
|
|
337
|
+
? tabs[safeActiveIndex] || null
|
|
336
338
|
: ((_a = this.moreButton) === null || _a === void 0 ? void 0 : _a.nativeElement) || null;
|
|
337
339
|
}
|
|
338
340
|
get isMoreVisible() {
|