rm-range-slider 3.0.1 → 3.0.3
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/README.md
CHANGED
|
@@ -10,7 +10,7 @@ These optimizations help to achieve as much native look & feel as possible using
|
|
|
10
10
|
|
|
11
11
|
## Installation
|
|
12
12
|
|
|
13
|
-
Install
|
|
13
|
+
Install rm-range-slider with npm or yarn
|
|
14
14
|
|
|
15
15
|
```bash
|
|
16
16
|
npm: npm install --save rm-range-slider
|
|
@@ -24,7 +24,7 @@ Dual Range Slider uses angular hooks, so this component doesn't work with angula
|
|
|
24
24
|
```
|
|
25
25
|
...
|
|
26
26
|
|
|
27
|
-
import {RmRangeSliderModule} from "
|
|
27
|
+
import {RmRangeSliderModule} from "rm-range-slider";
|
|
28
28
|
|
|
29
29
|
...
|
|
30
30
|
<rm-range-slider
|
|
@@ -81,34 +81,34 @@ export class RmRangeSliderComponent {
|
|
|
81
81
|
this.destroy$.complete();
|
|
82
82
|
}
|
|
83
83
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: RmRangeSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
84
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.2", type: RmRangeSliderComponent, isStandalone: true, selector: "rm-range-slider", inputs: { startValue: ["startValue", "startValue", numberAttribute], endValue: ["endValue", "endValue", numberAttribute], min: ["min", "min", numberAttribute], max: ["max", "max", numberAttribute] }, outputs: { onValueChanged: "onValueChanged" }, ngImport: i0, template: `
|
|
85
|
-
<mat-slider
|
|
86
|
-
[min]="this.min"
|
|
87
|
-
[max]="this.max"
|
|
88
|
-
showTickMarks
|
|
89
|
-
discrete
|
|
90
|
-
[displayWith]="formatLabel"
|
|
91
|
-
(change)="onSliderInput()"
|
|
92
|
-
>
|
|
93
|
-
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
94
|
-
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
95
|
-
</mat-slider>
|
|
84
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.2", type: RmRangeSliderComponent, isStandalone: true, selector: "rm-range-slider", inputs: { startValue: ["startValue", "startValue", numberAttribute], endValue: ["endValue", "endValue", numberAttribute], min: ["min", "min", numberAttribute], max: ["max", "max", numberAttribute] }, outputs: { onValueChanged: "onValueChanged" }, ngImport: i0, template: `
|
|
85
|
+
<mat-slider
|
|
86
|
+
[min]="this.min"
|
|
87
|
+
[max]="this.max"
|
|
88
|
+
showTickMarks
|
|
89
|
+
discrete
|
|
90
|
+
[displayWith]="formatLabel"
|
|
91
|
+
(change)="onSliderInput()"
|
|
92
|
+
>
|
|
93
|
+
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
94
|
+
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
95
|
+
</mat-slider>
|
|
96
96
|
`, isInline: true, styles: ["mat-slider{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i1.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i1.MatSliderRangeThumb, selector: "input[matSliderStartThumb], input[matSliderEndThumb]", exportAs: ["matSliderRangeThumb"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
97
97
|
}
|
|
98
98
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: RmRangeSliderComponent, decorators: [{
|
|
99
99
|
type: Component,
|
|
100
|
-
args: [{ selector: 'rm-range-slider', standalone: true, imports: [MatSliderModule, FormsModule], template: `
|
|
101
|
-
<mat-slider
|
|
102
|
-
[min]="this.min"
|
|
103
|
-
[max]="this.max"
|
|
104
|
-
showTickMarks
|
|
105
|
-
discrete
|
|
106
|
-
[displayWith]="formatLabel"
|
|
107
|
-
(change)="onSliderInput()"
|
|
108
|
-
>
|
|
109
|
-
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
110
|
-
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
111
|
-
</mat-slider>
|
|
100
|
+
args: [{ selector: 'rm-range-slider', standalone: true, imports: [MatSliderModule, FormsModule], template: `
|
|
101
|
+
<mat-slider
|
|
102
|
+
[min]="this.min"
|
|
103
|
+
[max]="this.max"
|
|
104
|
+
showTickMarks
|
|
105
|
+
discrete
|
|
106
|
+
[displayWith]="formatLabel"
|
|
107
|
+
(change)="onSliderInput()"
|
|
108
|
+
>
|
|
109
|
+
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
110
|
+
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
111
|
+
</mat-slider>
|
|
112
112
|
`, styles: ["mat-slider{width:100%}\n"] }]
|
|
113
113
|
}], propDecorators: { startValue: [{
|
|
114
114
|
type: Input,
|
|
@@ -137,4 +137,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImpor
|
|
|
137
137
|
}], onValueChanged: [{
|
|
138
138
|
type: Output
|
|
139
139
|
}] } });
|
|
140
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
140
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicm0tcmFuZ2Utc2xpZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL3JtLXJhbmdlLXNsaWRlci9zcmMvbGliL3JtLXJhbmdlLXNsaWRlci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxZQUFZLEVBQ1osS0FBSyxFQUVMLE1BQU0sRUFDTixlQUFlLEdBQ2hCLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUM3QyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDM0QsT0FBTyxFQUFFLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLE1BQU0sTUFBTSxDQUFDOzs7O0FBNkJ4RCxNQUFNLE9BQU8sc0JBQXNCO0lBdkJuQztRQXdCVSxhQUFRLEdBQUcsSUFBSSxPQUFPLEVBQVEsQ0FBQztRQUV2Qzs4RUFDc0U7UUFLdEUsZUFBVSxHQUFXLENBQUMsQ0FBQztRQUV2Qjs7NkVBRXFFO1FBS3JFLGFBQVEsR0FBVyxFQUFFLENBQUM7UUFFdEI7O3VFQUUrRDtRQUsvRCxRQUFHLEdBQVcsQ0FBQyxDQUFDO1FBRWhCOzt1RUFFK0Q7UUFLL0QsUUFBRyxHQUFXLEdBQUcsQ0FBQztRQUVsQjs7d0ZBRWdGO1FBRXpFLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztLQTBEcEQ7SUF4REM7OztPQUdHO0lBQ0gsYUFBYTtRQUNYLE1BQU0sS0FBSyxHQUFXO1lBQ3BCLElBQUksRUFBRSxJQUFJLENBQUMsVUFBVTtZQUNyQixFQUFFLEVBQUUsSUFBSSxDQUFDLFFBQVE7U0FDbEIsQ0FBQztRQUNGLElBQUksQ0FBQyxjQUFjLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUVEOzs7Ozs7Ozs7T0FTRztJQUVILFdBQVcsQ0FBQyxLQUFhO1FBQ3ZCLElBQUksS0FBSyxJQUFJLElBQUksRUFBRSxDQUFDO1lBQ2xCLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLEdBQUcsR0FBRyxDQUFDLEdBQUcsR0FBRyxDQUFDO1FBQ3ZDLENBQUM7UUFDRCxPQUFPLEdBQUcsS0FBSyxFQUFFLENBQUM7SUFDcEIsQ0FBQztJQUVEOzs7OztPQUtHO0lBQ0gsY0FBYyxDQUFDLEtBQWE7UUFDMUIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLEVBQUUsQ0FBQztRQUNyQixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsRUFBRSxDQUFDO1FBQ3pCLE1BQU0sbUJBQW1CLEdBQUcsSUFBSSxPQUFPLEVBQVUsQ0FBQztRQUNsRCxtQkFBbUI7YUFDaEIsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDO2FBQ2xELFNBQVMsQ0FBQyxDQUFDLFFBQWdCLEVBQUUsRUFBRTtZQUM5QixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUNyQyxDQUFDLENBQUMsQ0FBQztRQUNMLG1CQUFtQixDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNsQyxDQUFDO0lBRUQ7OztPQUdHO0lBQ0gsV0FBVztRQUNULElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7UUFDckIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUMzQixDQUFDOzhHQW5HVSxzQkFBc0I7a0dBQXRCLHNCQUFzQixzR0FPcEIsZUFBZSxzQ0FTZixlQUFlLHVCQVNmLGVBQWUsdUJBU2YsZUFBZSw0RUFyRGxCOzs7Ozs7Ozs7Ozs7R0FZVCxpR0FiUyxlQUFlLHNZQUFFLFdBQVc7OzJGQW9CM0Isc0JBQXNCO2tCQXZCbEMsU0FBUzsrQkFDRSxpQkFBaUIsY0FDZixJQUFJLFdBQ1AsQ0FBQyxlQUFlLEVBQUUsV0FBVyxDQUFDLFlBQzdCOzs7Ozs7Ozs7Ozs7R0FZVDs4QkFnQkQsVUFBVTtzQkFKVCxLQUFLO3VCQUFDO3dCQUNMLFFBQVEsRUFBRSxJQUFJO3dCQUNkLFNBQVMsRUFBRSxlQUFlO3FCQUMzQjtnQkFVRCxRQUFRO3NCQUpQLEtBQUs7dUJBQUM7d0JBQ0wsUUFBUSxFQUFFLElBQUk7d0JBQ2QsU0FBUyxFQUFFLGVBQWU7cUJBQzNCO2dCQVVELEdBQUc7c0JBSkYsS0FBSzt1QkFBQzt3QkFDTCxRQUFRLEVBQUUsSUFBSTt3QkFDZCxTQUFTLEVBQUUsZUFBZTtxQkFDM0I7Z0JBVUQsR0FBRztzQkFKRixLQUFLO3VCQUFDO3dCQUNMLFFBQVEsRUFBRSxJQUFJO3dCQUNkLFNBQVMsRUFBRSxlQUFlO3FCQUMzQjtnQkFPTSxjQUFjO3NCQURwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBDb21wb25lbnQsXHJcbiAgRXZlbnRFbWl0dGVyLFxyXG4gIElucHV0LFxyXG4gIE9uRGVzdHJveSxcclxuICBPdXRwdXQsXHJcbiAgbnVtYmVyQXR0cmlidXRlLFxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgTWF0U2xpZGVyTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvc2xpZGVyJztcclxuaW1wb3J0IHsgU3ViamVjdCwgdGFrZVVudGlsLCB0aHJvdHRsZVRpbWUgfSBmcm9tICdyeGpzJztcclxuZXhwb3J0IGludGVyZmFjZSBNSU5NQVgge1xyXG4gIGZyb206IG51bWJlcjtcclxuICB0bzogbnVtYmVyO1xyXG59XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3JtLXJhbmdlLXNsaWRlcicsXHJcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcclxuICBpbXBvcnRzOiBbTWF0U2xpZGVyTW9kdWxlLCBGb3Jtc01vZHVsZV0sXHJcbiAgdGVtcGxhdGU6IGBcclxuICAgIDxtYXQtc2xpZGVyXHJcbiAgICAgIFttaW5dPVwidGhpcy5taW5cIlxyXG4gICAgICBbbWF4XT1cInRoaXMubWF4XCJcclxuICAgICAgc2hvd1RpY2tNYXJrc1xyXG4gICAgICBkaXNjcmV0ZVxyXG4gICAgICBbZGlzcGxheVdpdGhdPVwiZm9ybWF0TGFiZWxcIlxyXG4gICAgICAoY2hhbmdlKT1cIm9uU2xpZGVySW5wdXQoKVwiXHJcbiAgICA+XHJcbiAgICAgIDxpbnB1dCBtYXRTbGlkZXJTdGFydFRodW1iIFsobmdNb2RlbCldPVwic3RhcnRWYWx1ZVwiIC8+XHJcbiAgICAgIDxpbnB1dCBtYXRTbGlkZXJFbmRUaHVtYiBbKG5nTW9kZWwpXT1cImVuZFZhbHVlXCIgLz5cclxuICAgIDwvbWF0LXNsaWRlcj5cclxuICBgLFxyXG4gIHN0eWxlczogYFxyXG4gICAgbWF0LXNsaWRlciB7XHJcbiAgICAgIHdpZHRoOiAxMDAlO1xyXG4gICAgfVxyXG4gIGAsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBSbVJhbmdlU2xpZGVyQ29tcG9uZW50IGltcGxlbWVudHMgT25EZXN0cm95IHtcclxuICBwcml2YXRlIGRlc3Ryb3kkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcclxuXHJcbiAgLyogVGhlIGBASW5wdXRgIGRlY29yYXRvciBpbiB0aGUgVHlwZVNjcmlwdCBjb2RlIHNuaXBwZXQgaXMgdXNlZCB0byBkZWZpbmUgYW4gaW5wdXQgcHJvcGVydHkgZm9yIHRoZVxyXG5gUm1SYW5nZVNsaWRlckNvbXBvbmVudGAgY29tcG9uZW50IGluIEFuZ3VsYXIuIEluIHRoaXMgc3BlY2lmaWMgY2FzZTogKi9cclxuICBASW5wdXQoe1xyXG4gICAgcmVxdWlyZWQ6IHRydWUsXHJcbiAgICB0cmFuc2Zvcm06IG51bWJlckF0dHJpYnV0ZSxcclxuICB9KVxyXG4gIHN0YXJ0VmFsdWU6IG51bWJlciA9IDA7XHJcblxyXG4gIC8qIFRoZSBgQElucHV0YCBkZWNvcmF0b3IgaW4gdGhlIFR5cGVTY3JpcHQgY29kZSBzbmlwcGV0IGlzIHVzZWQgdG8gZGVmaW5lIGFuIGlucHV0IHByb3BlcnR5IGZvciB0aGVcclxuYFJtUmFuZ2VTbGlkZXJDb21wb25lbnRgIGNvbXBvbmVudCBpbiBBbmd1bGFyLiBJbiB0aGlzIHNwZWNpZmljIGNhc2UsIHRoZSBgZW5kVmFsdWVgIHByb3BlcnR5IGlzXHJcbmJlaW5nIGRlZmluZWQgYXMgYW4gaW5wdXQgcHJvcGVydHkgd2l0aCB0aGUgZm9sbG93aW5nIGNvbmZpZ3VyYXRpb246ICovXHJcbiAgQElucHV0KHtcclxuICAgIHJlcXVpcmVkOiB0cnVlLFxyXG4gICAgdHJhbnNmb3JtOiBudW1iZXJBdHRyaWJ1dGUsXHJcbiAgfSlcclxuICBlbmRWYWx1ZTogbnVtYmVyID0gMTA7XHJcblxyXG4gIC8qIFRoZSBgQElucHV0YCBkZWNvcmF0b3IgaW4gdGhlIFR5cGVTY3JpcHQgY29kZSBzbmlwcGV0IGlzIHVzZWQgdG8gZGVmaW5lIGFuIGlucHV0IHByb3BlcnR5IGZvciB0aGVcclxuYFJtUmFuZ2VTbGlkZXJDb21wb25lbnRgIGNvbXBvbmVudCBpbiBBbmd1bGFyLiBJbiB0aGlzIHNwZWNpZmljIGNhc2UsIHRoZSBgbWluYCBwcm9wZXJ0eSBpcyBiZWluZ1xyXG5kZWZpbmVkIGFzIGFuIGlucHV0IHByb3BlcnR5IHdpdGggdGhlIGZvbGxvd2luZyBjb25maWd1cmF0aW9uOiAqL1xyXG4gIEBJbnB1dCh7XHJcbiAgICByZXF1aXJlZDogdHJ1ZSxcclxuICAgIHRyYW5zZm9ybTogbnVtYmVyQXR0cmlidXRlLFxyXG4gIH0pXHJcbiAgbWluOiBudW1iZXIgPSAwO1xyXG5cclxuICAvKiBUaGUgYEBJbnB1dGAgZGVjb3JhdG9yIGluIHRoZSBUeXBlU2NyaXB0IGNvZGUgc25pcHBldCBpcyB1c2VkIHRvIGRlZmluZSBhbiBpbnB1dCBwcm9wZXJ0eSBmb3IgdGhlXHJcbmBSbVJhbmdlU2xpZGVyQ29tcG9uZW50YCBjb21wb25lbnQgaW4gQW5ndWxhci4gSW4gdGhpcyBzcGVjaWZpYyBjYXNlLCB0aGUgYG1heGAgcHJvcGVydHkgaXMgYmVpbmdcclxuZGVmaW5lZCBhcyBhbiBpbnB1dCBwcm9wZXJ0eSB3aXRoIHRoZSBmb2xsb3dpbmcgY29uZmlndXJhdGlvbjogKi9cclxuICBASW5wdXQoe1xyXG4gICAgcmVxdWlyZWQ6IHRydWUsXHJcbiAgICB0cmFuc2Zvcm06IG51bWJlckF0dHJpYnV0ZSxcclxuICB9KVxyXG4gIG1heDogbnVtYmVyID0gMTAwO1xyXG5cclxuICAvKiBUaGUgYEBPdXRwdXQoKWAgZGVjb3JhdG9yIGluIHRoZSBUeXBlU2NyaXB0IGNvZGUgc25pcHBldCBpcyB1c2VkIHRvIGRlZmluZSBhbiBvdXRwdXQgcHJvcGVydHkgZm9yXHJcbnRoZSBgUm1SYW5nZVNsaWRlckNvbXBvbmVudGAgY29tcG9uZW50IGluIEFuZ3VsYXIuIEluIHRoaXMgc3BlY2lmaWMgY2FzZSwgdGhlIGBnZXRNaW5NYXhgIHByb3BlcnR5XHJcbmlzIGJlaW5nIGRlZmluZWQgYXMgYW4gb3V0cHV0IHByb3BlcnR5IHdpdGggdGhlIHR5cGUgb2YgYEV2ZW50RW1pdHRlcjxNSU5NQVg+YC4gKi9cclxuICBAT3V0cHV0KClcclxuICBwdWJsaWMgb25WYWx1ZUNoYW5nZWQgPSBuZXcgRXZlbnRFbWl0dGVyPE1JTk1BWD4oKTtcclxuXHJcbiAgLyoqXHJcbiAgICogVGhlIGBvblNsaWRlcklucHV0YCBmdW5jdGlvbiBzZXRzIHRoZSBgdmFsdWVgIG9iamVjdCB3aXRoIGBzdGFydFZhbHVlYCBhbmQgYGVuZFZhbHVlYCBwcm9wZXJ0aWVzIGFuZFxyXG4gICAqIGNhbGxzIHRoZSBgb25TbGlkZXJDaGFuZ2VgIGZ1bmN0aW9uIHdpdGggdGhpcyB2YWx1ZS5cclxuICAgKi9cclxuICBvblNsaWRlcklucHV0KCk6IHZvaWQge1xyXG4gICAgY29uc3QgdmFsdWU6IE1JTk1BWCA9IHtcclxuICAgICAgZnJvbTogdGhpcy5zdGFydFZhbHVlLFxyXG4gICAgICB0bzogdGhpcy5lbmRWYWx1ZSxcclxuICAgIH07XHJcbiAgICB0aGlzLm9uU2xpZGVyQ2hhbmdlKHZhbHVlKTtcclxuICB9XHJcblxyXG4gIC8qKlxyXG4gICAqIFRoZSBgZm9ybWF0TGFiZWxgIGZ1bmN0aW9uIGluIFR5cGVTY3JpcHQgZm9ybWF0cyBhIG51bWJlciB2YWx1ZSBieSByb3VuZGluZyBpdCB0byB0aGUgbmVhcmVzdFxyXG4gICAqIGh1bmRyZWR0aCBhbmQgYXBwZW5kaW5nIGEgJ2snIGlmIHRoZSB2YWx1ZSBpcyBncmVhdGVyIHRoYW4gb3IgZXF1YWwgdG8gMTAwMC5cclxuICAgKiBAcGFyYW0ge251bWJlcn0gdmFsdWUgLSBUaGUgYHZhbHVlYCBwYXJhbWV0ZXIgaXMgYSBudW1iZXIgdGhhdCByZXByZXNlbnRzIGEgbnVtZXJpY2FsIHZhbHVlIHdoaWNoXHJcbiAgICogbmVlZHMgdG8gYmUgZm9ybWF0dGVkLiBUaGUgYGZvcm1hdExhYmVsYCBmdW5jdGlvbiB0YWtlcyB0aGlzIG51bWJlciBhcyBpbnB1dCBhbmQgcmV0dXJucyBhIGZvcm1hdHRlZFxyXG4gICAqIHN0cmluZyByZXByZXNlbnRhdGlvbiBvZiB0aGUgbnVtYmVyLiBJZiB0aGUgdmFsdWUgaXMgZ3JlYXRlciB0aGFuIG9yIGVxdWFsIHRvIDEwMDAsIGl0IHdpbGwgYmVcclxuICAgKiByb3VuZGVkIGFuZCBkaXNwbGF5ZWQgaW5cclxuICAgKiBAcmV0dXJucyBJZiB0aGUgYHZhbHVlYCBpcyBncmVhdGVyIHRoYW4gb3IgZXF1YWwgdG8gMTAwMCwgdGhlIGZ1bmN0aW9uIHdpbGwgcmV0dXJuIHRoZSB2YWx1ZSBkaXZpZGVkXHJcbiAgICogYnkgMTAwIGFuZCByb3VuZGVkLCBmb2xsb3dlZCBieSB0aGUgbGV0dGVyICdrJy4gT3RoZXJ3aXNlLCBpdCB3aWxsIHJldHVybiB0aGUgdmFsdWUgYXMgYSBzdHJpbmcuXHJcbiAgICovXHJcblxyXG4gIGZvcm1hdExhYmVsKHZhbHVlOiBudW1iZXIpOiBzdHJpbmcge1xyXG4gICAgaWYgKHZhbHVlID49IDEwMDApIHtcclxuICAgICAgcmV0dXJuIE1hdGgucm91bmQodmFsdWUgLyAxMDApICsgJ2snO1xyXG4gICAgfVxyXG4gICAgcmV0dXJuIGAke3ZhbHVlfWA7XHJcbiAgfVxyXG5cclxuICAvKipcclxuICAgKiBUaGUgYG9uU2xpZGVyQ2hhbmdlYCBmdW5jdGlvbiBpbiBUeXBlU2NyaXB0IHNldHMgdXAgYSBTdWJqZWN0IHRvIGVtaXQgc2xpZGVyIHZhbHVlIGNoYW5nZXMgd2l0aCBhXHJcbiAgICogdGhyb3R0bGUgdGltZSBvZiA1MDAwIG1pbGxpc2Vjb25kcy5cclxuICAgKiBAcGFyYW0ge01JTk1BWH0gdmFsdWUgLSBUaGUgYHZhbHVlYCBwYXJhbWV0ZXIgaW4gdGhlIGBvblNsaWRlckNoYW5nZWAgbWV0aG9kIHJlcHJlc2VudHMgdGhlIGN1cnJlbnRcclxuICAgKiB2YWx1ZSBvZiB0aGUgc2xpZGVyLCB3aGljaCBpcyBvZiB0eXBlIGBNSU5NQVhgLlxyXG4gICAqL1xyXG4gIG9uU2xpZGVyQ2hhbmdlKHZhbHVlOiBNSU5NQVgpOiB2b2lkIHtcclxuICAgIHRoaXMuZGVzdHJveSQubmV4dCgpO1xyXG4gICAgdGhpcy5kZXN0cm95JC5jb21wbGV0ZSgpO1xyXG4gICAgY29uc3Qgc2xpZGVyVmFsdWVDaGFuZ2VzJCA9IG5ldyBTdWJqZWN0PE1JTk1BWD4oKTtcclxuICAgIHNsaWRlclZhbHVlQ2hhbmdlcyRcclxuICAgICAgLnBpcGUodGhyb3R0bGVUaW1lKDUwMDApLCB0YWtlVW50aWwodGhpcy5kZXN0cm95JCkpXHJcbiAgICAgIC5zdWJzY3JpYmUoKG5ld1ZhbHVlOiBNSU5NQVgpID0+IHtcclxuICAgICAgICB0aGlzLm9uVmFsdWVDaGFuZ2VkLmVtaXQobmV3VmFsdWUpO1xyXG4gICAgICB9KTtcclxuICAgIHNsaWRlclZhbHVlQ2hhbmdlcyQubmV4dCh2YWx1ZSk7XHJcbiAgfVxyXG5cclxuICAvKipcclxuICAgKiBUaGUgbmdPbkRlc3Ryb3kgZnVuY3Rpb24gaW4gVHlwZVNjcmlwdCBpcyB1c2VkIHRvIGNsZWFuIHVwIHJlc291cmNlcyBhbmQgdW5zdWJzY3JpYmUgZnJvbVxyXG4gICAqIG9ic2VydmFibGVzIGJ5IGNvbXBsZXRpbmcgYSBzdWJqZWN0LlxyXG4gICAqL1xyXG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xyXG4gICAgdGhpcy5kZXN0cm95JC5uZXh0KCk7XHJcbiAgICB0aGlzLmRlc3Ryb3kkLmNvbXBsZXRlKCk7XHJcbiAgfVxyXG59XHJcbiJdfQ==
|
package/esm2022/public-api.mjs
CHANGED
|
@@ -2,4 +2,4 @@
|
|
|
2
2
|
* Public API Surface of rm-range-slider
|
|
3
3
|
*/
|
|
4
4
|
export * from './lib/rm-range-slider.component';
|
|
5
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
5
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL3JtLXJhbmdlLXNsaWRlci9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsaUNBQWlDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxyXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2Ygcm0tcmFuZ2Utc2xpZGVyXHJcbiAqL1xyXG5cclxuZXhwb3J0ICogZnJvbSAnLi9saWIvcm0tcmFuZ2Utc2xpZGVyLmNvbXBvbmVudCc7XHJcbiJdfQ==
|
|
@@ -82,34 +82,34 @@ class RmRangeSliderComponent {
|
|
|
82
82
|
this.destroy$.complete();
|
|
83
83
|
}
|
|
84
84
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: RmRangeSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
85
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.2", type: RmRangeSliderComponent, isStandalone: true, selector: "rm-range-slider", inputs: { startValue: ["startValue", "startValue", numberAttribute], endValue: ["endValue", "endValue", numberAttribute], min: ["min", "min", numberAttribute], max: ["max", "max", numberAttribute] }, outputs: { onValueChanged: "onValueChanged" }, ngImport: i0, template: `
|
|
86
|
-
<mat-slider
|
|
87
|
-
[min]="this.min"
|
|
88
|
-
[max]="this.max"
|
|
89
|
-
showTickMarks
|
|
90
|
-
discrete
|
|
91
|
-
[displayWith]="formatLabel"
|
|
92
|
-
(change)="onSliderInput()"
|
|
93
|
-
>
|
|
94
|
-
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
95
|
-
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
96
|
-
</mat-slider>
|
|
85
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.2.2", type: RmRangeSliderComponent, isStandalone: true, selector: "rm-range-slider", inputs: { startValue: ["startValue", "startValue", numberAttribute], endValue: ["endValue", "endValue", numberAttribute], min: ["min", "min", numberAttribute], max: ["max", "max", numberAttribute] }, outputs: { onValueChanged: "onValueChanged" }, ngImport: i0, template: `
|
|
86
|
+
<mat-slider
|
|
87
|
+
[min]="this.min"
|
|
88
|
+
[max]="this.max"
|
|
89
|
+
showTickMarks
|
|
90
|
+
discrete
|
|
91
|
+
[displayWith]="formatLabel"
|
|
92
|
+
(change)="onSliderInput()"
|
|
93
|
+
>
|
|
94
|
+
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
95
|
+
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
96
|
+
</mat-slider>
|
|
97
97
|
`, isInline: true, styles: ["mat-slider{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatSliderModule }, { kind: "component", type: i1.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i1.MatSliderRangeThumb, selector: "input[matSliderStartThumb], input[matSliderEndThumb]", exportAs: ["matSliderRangeThumb"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
|
|
98
98
|
}
|
|
99
99
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: RmRangeSliderComponent, decorators: [{
|
|
100
100
|
type: Component,
|
|
101
|
-
args: [{ selector: 'rm-range-slider', standalone: true, imports: [MatSliderModule, FormsModule], template: `
|
|
102
|
-
<mat-slider
|
|
103
|
-
[min]="this.min"
|
|
104
|
-
[max]="this.max"
|
|
105
|
-
showTickMarks
|
|
106
|
-
discrete
|
|
107
|
-
[displayWith]="formatLabel"
|
|
108
|
-
(change)="onSliderInput()"
|
|
109
|
-
>
|
|
110
|
-
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
111
|
-
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
112
|
-
</mat-slider>
|
|
101
|
+
args: [{ selector: 'rm-range-slider', standalone: true, imports: [MatSliderModule, FormsModule], template: `
|
|
102
|
+
<mat-slider
|
|
103
|
+
[min]="this.min"
|
|
104
|
+
[max]="this.max"
|
|
105
|
+
showTickMarks
|
|
106
|
+
discrete
|
|
107
|
+
[displayWith]="formatLabel"
|
|
108
|
+
(change)="onSliderInput()"
|
|
109
|
+
>
|
|
110
|
+
<input matSliderStartThumb [(ngModel)]="startValue" />
|
|
111
|
+
<input matSliderEndThumb [(ngModel)]="endValue" />
|
|
112
|
+
</mat-slider>
|
|
113
113
|
`, styles: ["mat-slider{width:100%}\n"] }]
|
|
114
114
|
}], propDecorators: { startValue: [{
|
|
115
115
|
type: Input,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rm-range-slider.mjs","sources":["../../../projects/rm-range-slider/src/lib/rm-range-slider.component.ts","../../../projects/rm-range-slider/src/public-api.ts","../../../projects/rm-range-slider/src/rm-range-slider.ts"],"sourcesContent":["import {\n Component,\n EventEmitter,\n Input,\n OnDestroy,\n Output,\n numberAttribute,\n} from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { MatSliderModule } from '@angular/material/slider';\nimport { Subject, takeUntil, throttleTime } from 'rxjs';\nexport interface MINMAX {\n from: number;\n to: number;\n}\n\n@Component({\n selector: 'rm-range-slider',\n standalone: true,\n imports: [MatSliderModule, FormsModule],\n template: `\n <mat-slider\n [min]=\"this.min\"\n [max]=\"this.max\"\n showTickMarks\n discrete\n [displayWith]=\"formatLabel\"\n (change)=\"onSliderInput()\"\n >\n <input matSliderStartThumb [(ngModel)]=\"startValue\" />\n <input matSliderEndThumb [(ngModel)]=\"endValue\" />\n </mat-slider>\n `,\n styles: `\n mat-slider {\n width: 100%;\n }\n `,\n})\nexport class RmRangeSliderComponent implements OnDestroy {\n private destroy$ = new Subject<void>();\n\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\n`RmRangeSliderComponent` component in Angular. In this specific case: */\n @Input({\n required: true,\n transform: numberAttribute,\n })\n startValue: number = 0;\n\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\n`RmRangeSliderComponent` component in Angular. In this specific case, the `endValue` property is\nbeing defined as an input property with the following configuration: */\n @Input({\n required: true,\n transform: numberAttribute,\n })\n endValue: number = 10;\n\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\n`RmRangeSliderComponent` component in Angular. In this specific case, the `min` property is being\ndefined as an input property with the following configuration: */\n @Input({\n required: true,\n transform: numberAttribute,\n })\n min: number = 0;\n\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\n`RmRangeSliderComponent` component in Angular. In this specific case, the `max` property is being\ndefined as an input property with the following configuration: */\n @Input({\n required: true,\n transform: numberAttribute,\n })\n max: number = 100;\n\n /* The `@Output()` decorator in the TypeScript code snippet is used to define an output property for\nthe `RmRangeSliderComponent` component in Angular. In this specific case, the `getMinMax` property\nis being defined as an output property with the type of `EventEmitter<MINMAX>`. */\n @Output()\n public onValueChanged = new EventEmitter<MINMAX>();\n\n /**\n * The `onSliderInput` function sets the `value` object with `startValue` and `endValue` properties and\n * calls the `onSliderChange` function with this value.\n */\n onSliderInput(): void {\n const value: MINMAX = {\n from: this.startValue,\n to: this.endValue,\n };\n this.onSliderChange(value);\n }\n\n /**\n * The `formatLabel` function in TypeScript formats a number value by rounding it to the nearest\n * hundredth and appending a 'k' if the value is greater than or equal to 1000.\n * @param {number} value - The `value` parameter is a number that represents a numerical value which\n * needs to be formatted. The `formatLabel` function takes this number as input and returns a formatted\n * string representation of the number. If the value is greater than or equal to 1000, it will be\n * rounded and displayed in\n * @returns If the `value` is greater than or equal to 1000, the function will return the value divided\n * by 100 and rounded, followed by the letter 'k'. Otherwise, it will return the value as a string.\n */\n\n formatLabel(value: number): string {\n if (value >= 1000) {\n return Math.round(value / 100) + 'k';\n }\n return `${value}`;\n }\n\n /**\n * The `onSliderChange` function in TypeScript sets up a Subject to emit slider value changes with a\n * throttle time of 5000 milliseconds.\n * @param {MINMAX} value - The `value` parameter in the `onSliderChange` method represents the current\n * value of the slider, which is of type `MINMAX`.\n */\n onSliderChange(value: MINMAX): void {\n this.destroy$.next();\n this.destroy$.complete();\n const sliderValueChanges$ = new Subject<MINMAX>();\n sliderValueChanges$\n .pipe(throttleTime(5000), takeUntil(this.destroy$))\n .subscribe((newValue: MINMAX) => {\n this.onValueChanged.emit(newValue);\n });\n sliderValueChanges$.next(value);\n }\n\n /**\n * The ngOnDestroy function in TypeScript is used to clean up resources and unsubscribe from\n * observables by completing a subject.\n */\n ngOnDestroy(): void {\n this.destroy$.next();\n this.destroy$.complete();\n }\n}\n","/*\n * Public API Surface of rm-range-slider\n */\n\nexport * from './lib/rm-range-slider.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"rm-range-slider.mjs","sources":["../../../projects/rm-range-slider/src/lib/rm-range-slider.component.ts","../../../projects/rm-range-slider/src/public-api.ts","../../../projects/rm-range-slider/src/rm-range-slider.ts"],"sourcesContent":["import {\r\n Component,\r\n EventEmitter,\r\n Input,\r\n OnDestroy,\r\n Output,\r\n numberAttribute,\r\n} from '@angular/core';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { MatSliderModule } from '@angular/material/slider';\r\nimport { Subject, takeUntil, throttleTime } from 'rxjs';\r\nexport interface MINMAX {\r\n from: number;\r\n to: number;\r\n}\r\n\r\n@Component({\r\n selector: 'rm-range-slider',\r\n standalone: true,\r\n imports: [MatSliderModule, FormsModule],\r\n template: `\r\n <mat-slider\r\n [min]=\"this.min\"\r\n [max]=\"this.max\"\r\n showTickMarks\r\n discrete\r\n [displayWith]=\"formatLabel\"\r\n (change)=\"onSliderInput()\"\r\n >\r\n <input matSliderStartThumb [(ngModel)]=\"startValue\" />\r\n <input matSliderEndThumb [(ngModel)]=\"endValue\" />\r\n </mat-slider>\r\n `,\r\n styles: `\r\n mat-slider {\r\n width: 100%;\r\n }\r\n `,\r\n})\r\nexport class RmRangeSliderComponent implements OnDestroy {\r\n private destroy$ = new Subject<void>();\r\n\r\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\r\n`RmRangeSliderComponent` component in Angular. In this specific case: */\r\n @Input({\r\n required: true,\r\n transform: numberAttribute,\r\n })\r\n startValue: number = 0;\r\n\r\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\r\n`RmRangeSliderComponent` component in Angular. In this specific case, the `endValue` property is\r\nbeing defined as an input property with the following configuration: */\r\n @Input({\r\n required: true,\r\n transform: numberAttribute,\r\n })\r\n endValue: number = 10;\r\n\r\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\r\n`RmRangeSliderComponent` component in Angular. In this specific case, the `min` property is being\r\ndefined as an input property with the following configuration: */\r\n @Input({\r\n required: true,\r\n transform: numberAttribute,\r\n })\r\n min: number = 0;\r\n\r\n /* The `@Input` decorator in the TypeScript code snippet is used to define an input property for the\r\n`RmRangeSliderComponent` component in Angular. In this specific case, the `max` property is being\r\ndefined as an input property with the following configuration: */\r\n @Input({\r\n required: true,\r\n transform: numberAttribute,\r\n })\r\n max: number = 100;\r\n\r\n /* The `@Output()` decorator in the TypeScript code snippet is used to define an output property for\r\nthe `RmRangeSliderComponent` component in Angular. In this specific case, the `getMinMax` property\r\nis being defined as an output property with the type of `EventEmitter<MINMAX>`. */\r\n @Output()\r\n public onValueChanged = new EventEmitter<MINMAX>();\r\n\r\n /**\r\n * The `onSliderInput` function sets the `value` object with `startValue` and `endValue` properties and\r\n * calls the `onSliderChange` function with this value.\r\n */\r\n onSliderInput(): void {\r\n const value: MINMAX = {\r\n from: this.startValue,\r\n to: this.endValue,\r\n };\r\n this.onSliderChange(value);\r\n }\r\n\r\n /**\r\n * The `formatLabel` function in TypeScript formats a number value by rounding it to the nearest\r\n * hundredth and appending a 'k' if the value is greater than or equal to 1000.\r\n * @param {number} value - The `value` parameter is a number that represents a numerical value which\r\n * needs to be formatted. The `formatLabel` function takes this number as input and returns a formatted\r\n * string representation of the number. If the value is greater than or equal to 1000, it will be\r\n * rounded and displayed in\r\n * @returns If the `value` is greater than or equal to 1000, the function will return the value divided\r\n * by 100 and rounded, followed by the letter 'k'. Otherwise, it will return the value as a string.\r\n */\r\n\r\n formatLabel(value: number): string {\r\n if (value >= 1000) {\r\n return Math.round(value / 100) + 'k';\r\n }\r\n return `${value}`;\r\n }\r\n\r\n /**\r\n * The `onSliderChange` function in TypeScript sets up a Subject to emit slider value changes with a\r\n * throttle time of 5000 milliseconds.\r\n * @param {MINMAX} value - The `value` parameter in the `onSliderChange` method represents the current\r\n * value of the slider, which is of type `MINMAX`.\r\n */\r\n onSliderChange(value: MINMAX): void {\r\n this.destroy$.next();\r\n this.destroy$.complete();\r\n const sliderValueChanges$ = new Subject<MINMAX>();\r\n sliderValueChanges$\r\n .pipe(throttleTime(5000), takeUntil(this.destroy$))\r\n .subscribe((newValue: MINMAX) => {\r\n this.onValueChanged.emit(newValue);\r\n });\r\n sliderValueChanges$.next(value);\r\n }\r\n\r\n /**\r\n * The ngOnDestroy function in TypeScript is used to clean up resources and unsubscribe from\r\n * observables by completing a subject.\r\n */\r\n ngOnDestroy(): void {\r\n this.destroy$.next();\r\n this.destroy$.complete();\r\n }\r\n}\r\n","/*\r\n * Public API Surface of rm-range-slider\r\n */\r\n\r\nexport * from './lib/rm-range-slider.component';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "rm-range-slider",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.3",
|
|
4
4
|
"description": "A highly optimized and fully customizable pure angular component for value range selection.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"",
|
|
@@ -33,7 +33,8 @@
|
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"@angular/common": "^17.2.0",
|
|
36
|
-
"@angular/core": "^17.2.0"
|
|
36
|
+
"@angular/core": "^17.2.0",
|
|
37
|
+
"@angular/material": "^17.2.1"
|
|
37
38
|
},
|
|
38
39
|
"dependencies": {
|
|
39
40
|
"tslib": "^2.3.0"
|