systelab-components
Version:
systelab-components is a set of components that use wide accepted and adopted standard technologies like Angular and Bootstrap, as well as other popular libraries. Please read the ATTRIBUTION.md file for a complete list of dependencies.
47 lines • 5.7 kB
JavaScript
import { Component, EventEmitter, Input, Output, ViewChild } from '@angular/core';
import * as i0 from "@angular/core";
export class SliderComponent {
constructor() {
this.min = 0;
this.max = 100;
this.step = 1;
this.continuous = true;
this.value = 0;
this.valueChange = new EventEmitter();
}
sliderChangeEvent(event) {
const v = this.element.nativeElement.value;
if (v !== this.value) {
this.value = v;
this.valueChange.emit(this.value);
}
}
sliderInputEvent(event) {
if (this.continuous) {
this.value = this.element.nativeElement.value;
this.valueChange.emit(this.value);
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: SliderComponent, selector: "systelab-slider", inputs: { min: "min", max: "max", step: "step", continuous: "continuous", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "element", first: true, predicate: ["range"], descendants: true }], ngImport: i0, template: "<input #range type=\"range\" min=\"{{ min }}\" max=\"{{ max }}\" value=\"{{ value }}\" step=\"{{ step }}\"\n (change)=\"sliderChangeEvent($event)\" (input)=\"sliderInputEvent($event)\" class=\"slab-slider\" id=\"myRange\" />" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: SliderComponent, decorators: [{
type: Component,
args: [{ selector: 'systelab-slider', template: "<input #range type=\"range\" min=\"{{ min }}\" max=\"{{ max }}\" value=\"{{ value }}\" step=\"{{ step }}\"\n (change)=\"sliderChangeEvent($event)\" (input)=\"sliderInputEvent($event)\" class=\"slab-slider\" id=\"myRange\" />" }]
}], propDecorators: { min: [{
type: Input
}], max: [{
type: Input
}], step: [{
type: Input
}], continuous: [{
type: Input
}], value: [{
type: Input
}], valueChange: [{
type: Output
}], element: [{
type: ViewChild,
args: ['range', { static: false }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2xpZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3N5c3RlbGFiLWNvbXBvbmVudHMvc3JjL2xpYi9zbGlkZXIvc2xpZGVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3N5c3RlbGFiLWNvbXBvbmVudHMvc3JjL2xpYi9zbGlkZXIvc2xpZGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU05RixNQUFNLE9BQU8sZUFBZTtJQUo1QjtRQU1pQixRQUFHLEdBQUcsQ0FBQyxDQUFDO1FBQ1IsUUFBRyxHQUFHLEdBQUcsQ0FBQztRQUNWLFNBQUksR0FBRyxDQUFDLENBQUM7UUFDVCxlQUFVLEdBQUcsSUFBSSxDQUFDO1FBRWxCLFVBQUssR0FBRyxDQUFDLENBQUM7UUFDVCxnQkFBVyxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7S0FrQmxEO0lBZE8saUJBQWlCLENBQUMsS0FBVTtRQUNsQyxNQUFNLENBQUMsR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUM7UUFDM0MsSUFBSSxDQUFDLEtBQUssSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNyQixJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsQ0FBQztZQUNmLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztTQUNsQztJQUNGLENBQUM7SUFFTSxnQkFBZ0IsQ0FBQyxLQUFVO1FBQ2pDLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtZQUNwQixJQUFJLENBQUMsS0FBSyxHQUFHLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQztZQUM5QyxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDbEM7SUFDRixDQUFDOzhHQXpCVyxlQUFlO2tHQUFmLGVBQWUsOFJDTjVCLG1PQUM2Rzs7MkZES2hHLGVBQWU7a0JBSjNCLFNBQVM7K0JBQ0ksaUJBQWlCOzhCQUtkLEdBQUc7c0JBQWxCLEtBQUs7Z0JBQ1UsR0FBRztzQkFBbEIsS0FBSztnQkFDVSxJQUFJO3NCQUFuQixLQUFLO2dCQUNVLFVBQVU7c0JBQXpCLEtBQUs7Z0JBRVUsS0FBSztzQkFBcEIsS0FBSztnQkFDVyxXQUFXO3NCQUEzQixNQUFNO2dCQUU4QixPQUFPO3NCQUEzQyxTQUFTO3VCQUFDLE9BQU8sRUFBRSxFQUFDLE1BQU0sRUFBRSxLQUFLLEVBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogICAgJ3N5c3RlbGFiLXNsaWRlcicsXG5cdHRlbXBsYXRlVXJsOiAnc2xpZGVyLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBTbGlkZXJDb21wb25lbnQge1xuXG5cdEBJbnB1dCgpIHB1YmxpYyBtaW4gPSAwO1xuXHRASW5wdXQoKSBwdWJsaWMgbWF4ID0gMTAwO1xuXHRASW5wdXQoKSBwdWJsaWMgc3RlcCA9IDE7XG5cdEBJbnB1dCgpIHB1YmxpYyBjb250aW51b3VzID0gdHJ1ZTtcblxuXHRASW5wdXQoKSBwdWJsaWMgdmFsdWUgPSAwO1xuXHRAT3V0cHV0KCkgcHVibGljIHZhbHVlQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG5cdEBWaWV3Q2hpbGQoJ3JhbmdlJywge3N0YXRpYzogZmFsc2V9KSBlbGVtZW50OiBFbGVtZW50UmVmO1xuXG5cdHB1YmxpYyBzbGlkZXJDaGFuZ2VFdmVudChldmVudDogYW55KSB7XG5cdFx0Y29uc3QgdiA9IHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50LnZhbHVlO1xuXHRcdGlmICh2ICE9PSB0aGlzLnZhbHVlKSB7XG5cdFx0XHR0aGlzLnZhbHVlID0gdjtcblx0XHRcdHRoaXMudmFsdWVDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcblx0XHR9XG5cdH1cblxuXHRwdWJsaWMgc2xpZGVySW5wdXRFdmVudChldmVudDogYW55KSB7XG5cdFx0aWYgKHRoaXMuY29udGludW91cykge1xuXHRcdFx0dGhpcy52YWx1ZSA9IHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50LnZhbHVlO1xuXHRcdFx0dGhpcy52YWx1ZUNoYW5nZS5lbWl0KHRoaXMudmFsdWUpO1xuXHRcdH1cblx0fVxufVxuIiwiPGlucHV0ICNyYW5nZSB0eXBlPVwicmFuZ2VcIiBtaW49XCJ7eyBtaW4gfX1cIiBtYXg9XCJ7eyBtYXggfX1cIiB2YWx1ZT1cInt7IHZhbHVlIH19XCIgc3RlcD1cInt7IHN0ZXAgfX1cIlxuICAoY2hhbmdlKT1cInNsaWRlckNoYW5nZUV2ZW50KCRldmVudClcIiAoaW5wdXQpPVwic2xpZGVySW5wdXRFdmVudCgkZXZlbnQpXCIgY2xhc3M9XCJzbGFiLXNsaWRlclwiIGlkPVwibXlSYW5nZVwiIC8+Il19