@taiga-ui/kit
Version:
Taiga UI Angular main components kit
1 lines • 10.8 kB
Source Map (JSON)
{"version":3,"file":"taiga-ui-kit-components-input-slider.mjs","sources":["../../../projects/kit/components/input-slider/input-slider.directive.ts","../../../projects/kit/components/input-slider/input-slider.ts","../../../projects/kit/components/input-slider/taiga-ui-kit-components-input-slider.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n computed,\n Directive,\n effect,\n inject,\n ViewEncapsulation,\n} from '@angular/core';\nimport {\n TUI_IDENTITY_VALUE_TRANSFORMER,\n TuiNonNullableValueTransformer,\n TuiValueTransformer,\n} from '@taiga-ui/cdk/classes';\nimport {TUI_ALLOW_SIGNAL_WRITES} from '@taiga-ui/cdk/constants';\nimport {TUI_IS_MOBILE} from '@taiga-ui/cdk/tokens';\nimport {tuiInjectElement, tuiIsElement, tuiIsInput} from '@taiga-ui/cdk/utils/dom';\nimport {tuiClamp} from '@taiga-ui/cdk/utils/math';\nimport {tuiWithStyles} from '@taiga-ui/cdk/utils/miscellaneous';\nimport {tuiInjectAuxiliary} from '@taiga-ui/core/components/textfield';\nimport {\n TuiInputNumberDirective,\n tuiInputNumberOptionsProvider,\n} from '@taiga-ui/kit/components/input-number';\nimport {TuiSliderComponent} from '@taiga-ui/kit/components/slider';\nimport {filter, fromEvent} from 'rxjs';\n\n@Directive({\n standalone: true,\n selector: 'input[tuiInputSlider]',\n providers: [\n tuiInputNumberOptionsProvider({\n valueTransformer: new TuiNonNullableValueTransformer(),\n }),\n ],\n hostDirectives: [\n {\n directive: TuiInputNumberDirective,\n inputs: ['min', 'max', 'prefix', 'postfix', 'invalid', 'readOnly'],\n },\n ],\n host: {\n '(blur)': 'onBlur()',\n '(keydown.arrowUp)': 'onStep(1)',\n '(keydown.arrowDown)': 'onStep(-1)',\n },\n})\nexport class TuiInputSliderDirective {\n private readonly isMobile = inject(TUI_IS_MOBILE);\n private readonly element = tuiInjectElement<HTMLInputElement>();\n private readonly inputNumber = inject(TuiInputNumberDirective, {self: true});\n private readonly slider = tuiInjectAuxiliary<TuiSliderComponent>(\n (x) => x instanceof TuiSliderComponent,\n );\n\n private readonly controlTransformer = inject<\n TuiValueTransformer<number | null, number>\n >(TuiValueTransformer, {self: true});\n\n private readonly value = computed(() =>\n this.controlTransformer.toControlValue(this.inputNumber.value()),\n );\n\n private readonly keyStepsTransformer = computed(\n () => this.slider()?.keySteps?.transformer() ?? TUI_IDENTITY_VALUE_TRANSFORMER,\n );\n\n protected readonly nothing = tuiWithStyles(TuiInputSliderStyles);\n\n protected readonly textfieldToSliderSync = effect(() => {\n const slider = this.slider();\n\n if (!slider) {\n return;\n }\n\n if (\n slider.keySteps?.transformer() &&\n Number.isFinite(slider.keySteps?.totalSteps)\n ) {\n // TODO(v5): move all if-condition body inside `TuiSliderKeyStepsBase`\n slider.min = 0;\n slider.step = 1;\n slider.max = slider.keySteps?.totalSteps ?? 100;\n } else {\n slider.min = this.inputNumber.min();\n slider.max = this.inputNumber.max();\n }\n\n slider.value = this.keyStepsTransformer().fromControlValue(this.value());\n slider.el.disabled = !this.inputNumber.interactive();\n }, TUI_ALLOW_SIGNAL_WRITES);\n\n protected readonly sliderInitEffect = effect((onCleanup) => {\n const slider = this.slider();\n\n if (!slider) {\n return;\n }\n\n slider.el.style.setProperty('--tui-slider-track-color', 'transparent');\n\n if (slider.keySteps) {\n slider.keySteps.value = this.value;\n }\n\n const subscription = fromEvent(slider.el, 'input', (x) => x.target)\n .pipe(filter(tuiIsElement), filter(tuiIsInput))\n .subscribe((x) => this.onSliderInput(x.valueAsNumber));\n\n onCleanup(() => subscription.unsubscribe());\n });\n\n protected onStep(coefficient: number): void {\n const slider = this.slider();\n\n if (slider && this.inputNumber.interactive()) {\n const newValue = tuiClamp(\n slider.keySteps?.takeStep(coefficient) ??\n slider.value + coefficient * slider.step,\n this.inputNumber.min(),\n this.inputNumber.max(),\n );\n\n this.inputNumber.setValue(newValue);\n }\n }\n\n protected onBlur(): void {\n if (!this.element.value) {\n this.inputNumber.setValue(this.value() ?? null);\n }\n }\n\n private onSliderInput(value: number): void {\n this.inputNumber.setValue(this.keyStepsTransformer().toControlValue(value));\n\n if (!this.isMobile) {\n this.element.focus();\n }\n }\n}\n\n@Component({\n standalone: true,\n template: '',\n styles: [\n // TODO: tui-textfield:has([tuiInputSlider]) .t-clear\n 'tui-textfield [tuiInputSlider] ~ .t-content .t-clear {display: none !important}',\n ],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'tui-input-slider',\n },\n})\nclass TuiInputSliderStyles {}\n","import {\n TuiSliderComponent,\n TuiSliderKeySteps,\n TuiSliderKeyStepsBase,\n} from '@taiga-ui/kit/components/slider';\n\nimport {TuiInputSliderDirective} from './input-slider.directive';\n\nexport const TuiInputSlider = [\n TuiSliderComponent,\n TuiSliderKeyStepsBase,\n TuiSliderKeySteps,\n TuiInputSliderDirective,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;AA2BA,MAoBa,uBAAuB,CAAA;AApBpC,IAAA,WAAA,GAAA;AAqBqB,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC;QACjC,IAAO,CAAA,OAAA,GAAG,gBAAgB,EAAoB,CAAC;QAC/C,IAAW,CAAA,WAAA,GAAG,MAAM,CAAC,uBAAuB,EAAE,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAC;AAC5D,QAAA,IAAA,CAAA,MAAM,GAAG,kBAAkB,CACxC,CAAC,CAAC,KAAK,CAAC,YAAY,kBAAkB,CACzC,CAAC;QAEe,IAAkB,CAAA,kBAAA,GAAG,MAAM,CAE1C,mBAAmB,EAAE,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAC;QAEpB,IAAK,CAAA,KAAA,GAAG,QAAQ,CAAC,MAC9B,IAAI,CAAC,kBAAkB,CAAC,cAAc,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC,CACnE,CAAC;AAEe,QAAA,IAAA,CAAA,mBAAmB,GAAG,QAAQ,CAC3C,MAAM,IAAI,CAAC,MAAM,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,8BAA8B,CACjF,CAAC;AAEiB,QAAA,IAAA,CAAA,OAAO,GAAG,aAAa,CAAC,oBAAoB,CAAC,CAAC;AAE9C,QAAA,IAAA,CAAA,qBAAqB,GAAG,MAAM,CAAC,MAAK;AACnD,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;YAE7B,IAAI,CAAC,MAAM,EAAE;gBACT,OAAO;AACV,aAAA;AAED,YAAA,IACI,MAAM,CAAC,QAAQ,EAAE,WAAW,EAAE;gBAC9B,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,QAAQ,EAAE,UAAU,CAAC,EAC9C;;AAEE,gBAAA,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC;AACf,gBAAA,MAAM,CAAC,IAAI,GAAG,CAAC,CAAC;gBAChB,MAAM,CAAC,GAAG,GAAG,MAAM,CAAC,QAAQ,EAAE,UAAU,IAAI,GAAG,CAAC;AACnD,aAAA;AAAM,iBAAA;gBACH,MAAM,CAAC,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC;gBACpC,MAAM,CAAC,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC;AACvC,aAAA;AAED,YAAA,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;AACzE,YAAA,MAAM,CAAC,EAAE,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC;SACxD,EAAE,uBAAuB,CAAC,CAAC;AAET,QAAA,IAAA,CAAA,gBAAgB,GAAG,MAAM,CAAC,CAAC,SAAS,KAAI;AACvD,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;YAE7B,IAAI,CAAC,MAAM,EAAE;gBACT,OAAO;AACV,aAAA;YAED,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,0BAA0B,EAAE,aAAa,CAAC,CAAC;YAEvE,IAAI,MAAM,CAAC,QAAQ,EAAE;gBACjB,MAAM,CAAC,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;AACtC,aAAA;AAED,YAAA,MAAM,YAAY,GAAG,SAAS,CAAC,MAAM,CAAC,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC;iBAC9D,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;AAC9C,iBAAA,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC;YAE3D,SAAS,CAAC,MAAM,YAAY,CAAC,WAAW,EAAE,CAAC,CAAC;AAChD,SAAC,CAAC,CAAC;AA8BN,KAAA;AA5Ba,IAAA,MAAM,CAAC,WAAmB,EAAA;AAChC,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;QAE7B,IAAI,MAAM,IAAI,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,EAAE;YAC1C,MAAM,QAAQ,GAAG,QAAQ,CACrB,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,WAAW,CAAC;gBAClC,MAAM,CAAC,KAAK,GAAG,WAAW,GAAG,MAAM,CAAC,IAAI,EAC5C,IAAI,CAAC,WAAW,CAAC,GAAG,EAAE,EACtB,IAAI,CAAC,WAAW,CAAC,GAAG,EAAE,CACzB,CAAC;AAEF,YAAA,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;AACvC,SAAA;KACJ;IAES,MAAM,GAAA;AACZ,QAAA,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE;AACrB,YAAA,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,IAAI,CAAC,CAAC;AACnD,SAAA;KACJ;AAEO,IAAA,aAAa,CAAC,KAAa,EAAA;AAC/B,QAAA,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;AAE5E,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAChB,YAAA,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;AACxB,SAAA;KACJ;+GA7FQ,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,uBAAuB,EAjBrB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,MAAA,EAAA,UAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,mBAAA,EAAA,YAAA,EAAA,EAAA,EAAA,SAAA,EAAA;AACP,YAAA,6BAA6B,CAAC;gBAC1B,gBAAgB,EAAE,IAAI,8BAA8B,EAAE;aACzD,CAAC;AACL,SAAA,EAAA,cAAA,EAAA,CAAA,EAAA,SAAA,EAAA,EAAA,CAAA,uBAAA,EAAA,MAAA,EAAA,CAAA,KAAA,EAAA,KAAA,EAAA,KAAA,EAAA,KAAA,EAAA,QAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;4FAaQ,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBApBnC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,uBAAuB;AACjC,oBAAA,SAAS,EAAE;AACP,wBAAA,6BAA6B,CAAC;4BAC1B,gBAAgB,EAAE,IAAI,8BAA8B,EAAE;yBACzD,CAAC;AACL,qBAAA;AACD,oBAAA,cAAc,EAAE;AACZ,wBAAA;AACI,4BAAA,SAAS,EAAE,uBAAuB;AAClC,4BAAA,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,UAAU,CAAC;AACrE,yBAAA;AACJ,qBAAA;AACD,oBAAA,IAAI,EAAE;AACF,wBAAA,QAAQ,EAAE,UAAU;AACpB,wBAAA,mBAAmB,EAAE,WAAW;AAChC,wBAAA,qBAAqB,EAAE,YAAY;AACtC,qBAAA;AACJ,iBAAA,CAAA;;AAiGD,MAaM,oBAAoB,CAAA;+GAApB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,sHAXZ,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,8EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;4FAWV,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAbzB,SAAS;iCACM,IAAI,EAAA,QAAA,EACN,EAAE,EAAA,aAAA,EAKG,iBAAiB,CAAC,IAAI,EACpB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACzC,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,kBAAkB;AAC5B,qBAAA,EAAA,MAAA,EAAA,CAAA,8EAAA,CAAA,EAAA,CAAA;;;AClJQ,MAAA,cAAc,GAAG;IAC1B,kBAAkB;IAClB,qBAAqB;IACrB,iBAAiB;IACjB,uBAAuB;;;ACZ3B;;AAEG;;;;"}