range-selection-input 15.0.2 → 15.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.
@@ -1,21 +1,20 @@
1
1
  import * as i0 from '@angular/core';
2
- import { inject, forwardRef, Component, Input, NgModule } from '@angular/core';
3
- import * as i2 from '@angular/forms';
2
+ import { inject, forwardRef, Input, Component, NgModule } from '@angular/core';
3
+ import * as i1 from '@angular/forms';
4
4
  import { FormBuilder, Validators, NG_VALUE_ACCESSOR, NG_VALIDATORS, FormsModule, ReactiveFormsModule } from '@angular/forms';
5
- import * as i1 from '@angular/common';
6
- import { CommonModule } from '@angular/common';
7
- import * as i3$1 from '@angular/material/button';
5
+ import * as i2$1 from '@angular/material/button';
8
6
  import { MatButtonModule } from '@angular/material/button';
9
- import * as i4 from '@angular/material/form-field';
7
+ import * as i3 from '@angular/material/form-field';
10
8
  import { MatFormFieldModule } from '@angular/material/form-field';
11
- import * as i5 from '@angular/material/slide-toggle';
9
+ import * as i4 from '@angular/material/slide-toggle';
12
10
  import { MatSlideToggleModule } from '@angular/material/slide-toggle';
13
- import * as i6 from '@angular/material/divider';
11
+ import * as i5 from '@angular/material/divider';
14
12
  import { MatDividerModule } from '@angular/material/divider';
15
- import * as i7 from '@angular/material/button-toggle';
13
+ import * as i6 from '@angular/material/button-toggle';
16
14
  import { MatButtonToggleModule } from '@angular/material/button-toggle';
17
- import * as i3 from '@angular/material/slider';
15
+ import * as i2 from '@angular/material/slider';
18
16
  import { MatSliderModule } from '@angular/material/slider';
17
+ import { CommonModule } from '@angular/common';
19
18
 
20
19
  class RangeSelectionInputComponent {
21
20
  set min(value) {
@@ -109,8 +108,8 @@ class RangeSelectionInputComponent {
109
108
  setDisabledState(isDisabled) {
110
109
  this.disabled = isDisabled;
111
110
  }
112
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeSelectionInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
113
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RangeSelectionInputComponent, selector: "app-range-selection-input", inputs: { min: "min", max: "max", showValue: "showValue", showDivisions: "showDivisions", divisions: "divisions", minRequired: "minRequired", maxRequired: "maxRequired", displayFunc: "displayFunc" }, providers: [
111
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeSelectionInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
112
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RangeSelectionInputComponent, selector: "app-range-selection-input", inputs: { min: "min", max: "max", showValue: "showValue", showDivisions: "showDivisions", divisions: "divisions", minRequired: "minRequired", maxRequired: "maxRequired", displayFunc: "displayFunc" }, providers: [
114
113
  {
115
114
  provide: NG_VALUE_ACCESSOR,
116
115
  useExisting: forwardRef(() => RangeSelectionInputComponent),
@@ -121,9 +120,9 @@ class RangeSelectionInputComponent {
121
120
  useExisting: forwardRef(() => RangeSelectionInputComponent),
122
121
  multi: true
123
122
  }
124
- ], ngImport: i0, template: "<div style=\"display: flex; gap: 2rem; flex-direction: column;\">\n\n <ng-container *ngIf=\"doubleSlider; else SINGLE\">\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [showTickMarks]=\"showDivisions\"\n [discrete]=\"showValue\"\n [step]=\"divisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n [formControl]=\"startValue\"\n matSliderStartThumb\n (change)=\"onSetStartValue(startValue.value)\"\n />\n <input\n [formControl]=\"endValue\"\n matSliderEndThumb\n (change)=\"onSetEndValue(endValue.value)\"\n >\n </mat-slider>\n </ng-container>\n\n <ng-template #SINGLE>\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"0\"\n [max]=\"max\"\n [step]=\"divisions\"\n [discrete]=\"showValue\"\n [showTickMarks]=\"showDivisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n matSliderThumb\n [formControl]=\"endValue\"\n (change)=\"onSetStartValue(endValue.value)\"\n >\n </mat-slider>\n\n </ng-template>\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatSlider, selector: "mat-slider", inputs: ["color", "disableRipple", "disabled", "discrete", "showTickMarks", "min", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i3.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "directive", type: i3.MatSliderRangeThumb, selector: "input[matSliderStartThumb], input[matSliderEndThumb]", exportAs: ["matSliderRangeThumb"] }] }); }
123
+ ], ngImport: i0, template: "<div style=\"display: flex; gap: 2rem; flex-direction: column;\">\n\n @if (doubleSlider) {\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [showTickMarks]=\"showDivisions\"\n [discrete]=\"showValue\"\n [step]=\"divisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n [formControl]=\"startValue\"\n matSliderStartThumb\n (change)=\"onSetStartValue(startValue.value)\"\n />\n <input\n [formControl]=\"endValue\"\n matSliderEndThumb\n (change)=\"onSetEndValue(endValue.value)\"\n >\n </mat-slider>\n } @else {\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"0\"\n [max]=\"max\"\n [step]=\"divisions\"\n [discrete]=\"showValue\"\n [showTickMarks]=\"showDivisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n matSliderThumb\n [formControl]=\"endValue\"\n (change)=\"onSetStartValue(endValue.value)\"\n >\n </mat-slider>\n }\n\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.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: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2.MatSlider, selector: "mat-slider", inputs: ["disabled", "discrete", "showTickMarks", "min", "color", "disableRipple", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i2.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "directive", type: i2.MatSliderRangeThumb, selector: "input[matSliderStartThumb], input[matSliderEndThumb]", exportAs: ["matSliderRangeThumb"] }] }); }
125
124
  }
126
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeSelectionInputComponent, decorators: [{
125
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeSelectionInputComponent, decorators: [{
127
126
  type: Component,
128
127
  args: [{ selector: 'app-range-selection-input', providers: [
129
128
  {
@@ -136,8 +135,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
136
135
  useExisting: forwardRef(() => RangeSelectionInputComponent),
137
136
  multi: true
138
137
  }
139
- ], template: "<div style=\"display: flex; gap: 2rem; flex-direction: column;\">\n\n <ng-container *ngIf=\"doubleSlider; else SINGLE\">\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [showTickMarks]=\"showDivisions\"\n [discrete]=\"showValue\"\n [step]=\"divisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n [formControl]=\"startValue\"\n matSliderStartThumb\n (change)=\"onSetStartValue(startValue.value)\"\n />\n <input\n [formControl]=\"endValue\"\n matSliderEndThumb\n (change)=\"onSetEndValue(endValue.value)\"\n >\n </mat-slider>\n </ng-container>\n\n <ng-template #SINGLE>\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"0\"\n [max]=\"max\"\n [step]=\"divisions\"\n [discrete]=\"showValue\"\n [showTickMarks]=\"showDivisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n matSliderThumb\n [formControl]=\"endValue\"\n (change)=\"onSetStartValue(endValue.value)\"\n >\n </mat-slider>\n\n </ng-template>\n\n</div>\n" }]
140
- }], ctorParameters: function () { return []; }, propDecorators: { min: [{
138
+ ], standalone: false, template: "<div style=\"display: flex; gap: 2rem; flex-direction: column;\">\n\n @if (doubleSlider) {\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [showTickMarks]=\"showDivisions\"\n [discrete]=\"showValue\"\n [step]=\"divisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n [formControl]=\"startValue\"\n matSliderStartThumb\n (change)=\"onSetStartValue(startValue.value)\"\n />\n <input\n [formControl]=\"endValue\"\n matSliderEndThumb\n (change)=\"onSetEndValue(endValue.value)\"\n >\n </mat-slider>\n } @else {\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"0\"\n [max]=\"max\"\n [step]=\"divisions\"\n [discrete]=\"showValue\"\n [showTickMarks]=\"showDivisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n matSliderThumb\n [formControl]=\"endValue\"\n (change)=\"onSetStartValue(endValue.value)\"\n >\n </mat-slider>\n }\n\n\n</div>\n" }]
139
+ }], ctorParameters: () => [], propDecorators: { min: [{
141
140
  type: Input
142
141
  }], max: [{
143
142
  type: Input
@@ -207,17 +206,17 @@ class RangeDemoComponent {
207
206
  nothingMethod(value) {
208
207
  return value.toString();
209
208
  }
210
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeDemoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
211
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RangeDemoComponent, selector: "app-range-selection-input-demo", ngImport: i0, template: "<div style=\"display: flex;\">\n <h1>Slider FormControl</h1>\n <div style=\"flex:1; text-align: right;\">\n <div style=\"display: flex; gap: 2rem; flex-direction: row-reverse;\">\n <mat-button-toggle (click)=\"onPerformPatch()\">Patch</mat-button-toggle>\n </div>\n </div>\n</div>\n\n<!-- <h3>No Data - Projection of Error</h3>\n\n<app-input-slider>\n <h3 style=\"color: red; margin-top: 0; margin-bottom: 0;\">No Data</h3>\n</app-input-slider>\n\n<div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n</div> -->\n\n<div>\n <h3 style=\"margin-bottom: 0;\">Single Range Selection - VALUE</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_1.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_1\"\n [max]=\"25\"\n [showValue]=\"showVal_1.checked\"\n [showDivisions]=\"showTicks_1.checked\"\n [divisions]=\"showTicks_1.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_1.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_1\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #disable1 (change)=\"onDisabled_1(disable1.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_1>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_1>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_1>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_1>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range 0 - 25<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n No label<br>\n No Validation Required<br>\n Valid {{ selectionControl_1.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_2.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_2\"\n [min]=\"0\"\n [max]=\"100\"\n [showValue]=\"showVal_2.checked\"\n [showDivisions]=\"showTicks_2.checked\"\n [divisions]=\"showTicks_2.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_2.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div *ngIf=\"error2.checked\">\n <mat-error *ngIf=\"selectionControl_2.hasError('valueRequired')\">Must have a Selection</mat-error>\n </div>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error2>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable2 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_2>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_2>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_2>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_2>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required<br>\n Valid {{ selectionControl_2.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection with Min/Max Validation - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_3.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_3\"\n [min]=\"0\"\n [max]=\"100\"\n [minRequired]=\"10\"\n [maxRequired]=\"50\"\n [showValue]=\"showVal_3.checked\"\n [showDivisions]=\"showTicks_3.checked\"\n [divisions]=\"showTicks_3.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_3.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div *ngIf=\"error3.checked\">\n <mat-error *ngIf=\"selectionControl_3.hasError('minRequired')\">Range must be greater then 10</mat-error>\n </div>\n <div *ngIf=\"error3.checked\">\n <mat-error *ngIf=\"selectionControl_3.hasError('maxRequired')\">Range must me less then 50</mat-error>\n </div>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error3>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable3 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_3>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_3>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_3>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_3>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required with Min > 10 and Max < 50<br>\n Valid {{ selectionControl_3.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i5.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i6.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i7.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: RangeSelectionInputComponent, selector: "app-range-selection-input", inputs: ["min", "max", "showValue", "showDivisions", "divisions", "minRequired", "maxRequired", "displayFunc"] }] }); }
209
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeDemoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
210
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RangeDemoComponent, selector: "app-range-selection-input-demo", ngImport: i0, template: "<div style=\"display: flex;\">\n <h1>Slider FormControl</h1>\n <div style=\"flex:1; text-align: right;\">\n <div style=\"display: flex; gap: 2rem; flex-direction: row-reverse;\">\n <mat-button-toggle (click)=\"onPerformPatch()\">Patch</mat-button-toggle>\n </div>\n </div>\n</div>\n\n<!-- <h3>No Data - Projection of Error</h3>\n\n<app-input-slider>\n <h3 style=\"color: red; margin-top: 0; margin-bottom: 0;\">No Data</h3>\n</app-input-slider>\n\n<div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n</div> -->\n\n<div>\n <h3 style=\"margin-bottom: 0;\">Single Range Selection - VALUE</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_1.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_1\"\n [max]=\"25\"\n [showValue]=\"showVal_1.checked\"\n [showDivisions]=\"showTicks_1.checked\"\n [divisions]=\"showTicks_1.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_1.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_1\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #disable1 (change)=\"onDisabled_1(disable1.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_1>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_1>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_1>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_1>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range 0 - 25<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n No label<br>\n No Validation Required<br>\n Valid {{ selectionControl_1.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_2.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_2\"\n [min]=\"0\"\n [max]=\"100\"\n [showValue]=\"showVal_2.checked\"\n [showDivisions]=\"showTicks_2.checked\"\n [divisions]=\"showTicks_2.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_2.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n @if (error2.checked) {\n <div>\n @if (selectionControl_2.hasError('valueRequired')) {\n <mat-error>Must have a Selection</mat-error>\n }\n </div>\n }\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error2>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable2 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_2>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_2>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_2>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_2>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required<br>\n Valid {{ selectionControl_2.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection with Min/Max Validation - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_3.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_3\"\n [min]=\"0\"\n [max]=\"100\"\n [minRequired]=\"10\"\n [maxRequired]=\"50\"\n [showValue]=\"showVal_3.checked\"\n [showDivisions]=\"showTicks_3.checked\"\n [divisions]=\"showTicks_3.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_3.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n @if (error3.checked) {\n <div>\n @if (selectionControl_3.hasError('minRequired')) {\n <mat-error>Range must be greater then 10</mat-error>\n }\n </div>\n }\n @if (error3.checked) {\n <div>\n @if (selectionControl_3.hasError('maxRequired')) {\n <mat-error>Range must me less then 50</mat-error>\n }\n </div>\n }\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error3>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable3 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_3>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_3>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_3>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_3>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required with Min > 10 and Max < 50<br>\n Valid {{ selectionControl_3.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "component", type: i5.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i6.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: RangeSelectionInputComponent, selector: "app-range-selection-input", inputs: ["min", "max", "showValue", "showDivisions", "divisions", "minRequired", "maxRequired", "displayFunc"] }] }); }
212
211
  }
213
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeDemoComponent, decorators: [{
212
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeDemoComponent, decorators: [{
214
213
  type: Component,
215
- args: [{ selector: 'app-range-selection-input-demo', template: "<div style=\"display: flex;\">\n <h1>Slider FormControl</h1>\n <div style=\"flex:1; text-align: right;\">\n <div style=\"display: flex; gap: 2rem; flex-direction: row-reverse;\">\n <mat-button-toggle (click)=\"onPerformPatch()\">Patch</mat-button-toggle>\n </div>\n </div>\n</div>\n\n<!-- <h3>No Data - Projection of Error</h3>\n\n<app-input-slider>\n <h3 style=\"color: red; margin-top: 0; margin-bottom: 0;\">No Data</h3>\n</app-input-slider>\n\n<div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n</div> -->\n\n<div>\n <h3 style=\"margin-bottom: 0;\">Single Range Selection - VALUE</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_1.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_1\"\n [max]=\"25\"\n [showValue]=\"showVal_1.checked\"\n [showDivisions]=\"showTicks_1.checked\"\n [divisions]=\"showTicks_1.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_1.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_1\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #disable1 (change)=\"onDisabled_1(disable1.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_1>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_1>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_1>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_1>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range 0 - 25<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n No label<br>\n No Validation Required<br>\n Valid {{ selectionControl_1.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_2.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_2\"\n [min]=\"0\"\n [max]=\"100\"\n [showValue]=\"showVal_2.checked\"\n [showDivisions]=\"showTicks_2.checked\"\n [divisions]=\"showTicks_2.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_2.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div *ngIf=\"error2.checked\">\n <mat-error *ngIf=\"selectionControl_2.hasError('valueRequired')\">Must have a Selection</mat-error>\n </div>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error2>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable2 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_2>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_2>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_2>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_2>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required<br>\n Valid {{ selectionControl_2.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection with Min/Max Validation - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_3.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_3\"\n [min]=\"0\"\n [max]=\"100\"\n [minRequired]=\"10\"\n [maxRequired]=\"50\"\n [showValue]=\"showVal_3.checked\"\n [showDivisions]=\"showTicks_3.checked\"\n [divisions]=\"showTicks_3.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_3.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div *ngIf=\"error3.checked\">\n <mat-error *ngIf=\"selectionControl_3.hasError('minRequired')\">Range must be greater then 10</mat-error>\n </div>\n <div *ngIf=\"error3.checked\">\n <mat-error *ngIf=\"selectionControl_3.hasError('maxRequired')\">Range must me less then 50</mat-error>\n </div>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error3>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable3 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_3>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_3>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_3>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_3>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required with Min > 10 and Max < 50<br>\n Valid {{ selectionControl_3.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n" }]
216
- }], ctorParameters: function () { return []; } });
214
+ args: [{ selector: 'app-range-selection-input-demo', standalone: false, template: "<div style=\"display: flex;\">\n <h1>Slider FormControl</h1>\n <div style=\"flex:1; text-align: right;\">\n <div style=\"display: flex; gap: 2rem; flex-direction: row-reverse;\">\n <mat-button-toggle (click)=\"onPerformPatch()\">Patch</mat-button-toggle>\n </div>\n </div>\n</div>\n\n<!-- <h3>No Data - Projection of Error</h3>\n\n<app-input-slider>\n <h3 style=\"color: red; margin-top: 0; margin-bottom: 0;\">No Data</h3>\n</app-input-slider>\n\n<div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n</div> -->\n\n<div>\n <h3 style=\"margin-bottom: 0;\">Single Range Selection - VALUE</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_1.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_1\"\n [max]=\"25\"\n [showValue]=\"showVal_1.checked\"\n [showDivisions]=\"showTicks_1.checked\"\n [divisions]=\"showTicks_1.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_1.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_1\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #disable1 (change)=\"onDisabled_1(disable1.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_1>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_1>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_1>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_1>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range 0 - 25<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n No label<br>\n No Validation Required<br>\n Valid {{ selectionControl_1.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_2.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_2\"\n [min]=\"0\"\n [max]=\"100\"\n [showValue]=\"showVal_2.checked\"\n [showDivisions]=\"showTicks_2.checked\"\n [divisions]=\"showTicks_2.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_2.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n @if (error2.checked) {\n <div>\n @if (selectionControl_2.hasError('valueRequired')) {\n <mat-error>Must have a Selection</mat-error>\n }\n </div>\n }\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error2>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable2 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_2>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_2>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_2>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_2>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required<br>\n Valid {{ selectionControl_2.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection with Min/Max Validation - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_3.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_3\"\n [min]=\"0\"\n [max]=\"100\"\n [minRequired]=\"10\"\n [maxRequired]=\"50\"\n [showValue]=\"showVal_3.checked\"\n [showDivisions]=\"showTicks_3.checked\"\n [divisions]=\"showTicks_3.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_3.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n @if (error3.checked) {\n <div>\n @if (selectionControl_3.hasError('minRequired')) {\n <mat-error>Range must be greater then 10</mat-error>\n }\n </div>\n }\n @if (error3.checked) {\n <div>\n @if (selectionControl_3.hasError('maxRequired')) {\n <mat-error>Range must me less then 50</mat-error>\n }\n </div>\n }\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error3>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable3 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_3>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_3>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_3>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_3>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required with Min > 10 and Max < 50<br>\n Valid {{ selectionControl_3.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n" }]
215
+ }], ctorParameters: () => [] });
217
216
 
218
217
  class RangeSelectionInputModule {
219
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeSelectionInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
220
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: RangeSelectionInputModule, declarations: [RangeSelectionInputComponent,
218
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeSelectionInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
219
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: RangeSelectionInputModule, declarations: [RangeSelectionInputComponent,
221
220
  RangeDemoComponent], imports: [CommonModule,
222
221
  FormsModule,
223
222
  ReactiveFormsModule,
@@ -228,7 +227,7 @@ class RangeSelectionInputModule {
228
227
  MatDividerModule,
229
228
  MatButtonToggleModule], exports: [RangeSelectionInputComponent,
230
229
  RangeDemoComponent] }); }
231
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeSelectionInputModule, imports: [CommonModule,
230
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeSelectionInputModule, imports: [CommonModule,
232
231
  FormsModule,
233
232
  ReactiveFormsModule,
234
233
  MatButtonModule,
@@ -238,7 +237,7 @@ class RangeSelectionInputModule {
238
237
  MatDividerModule,
239
238
  MatButtonToggleModule] }); }
240
239
  }
241
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RangeSelectionInputModule, decorators: [{
240
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RangeSelectionInputModule, decorators: [{
242
241
  type: NgModule,
243
242
  args: [{
244
243
  imports: [
@@ -1 +1 @@
1
- {"version":3,"file":"range-selection-input.mjs","sources":["../../../projects/range-selection-input/src/lib/input-slider/range-selection-input.component.ts","../../../projects/range-selection-input/src/lib/input-slider/range-selection-input.component.html","../../../projects/range-selection-input/src/lib/range-demo/range-demo.component.ts","../../../projects/range-selection-input/src/lib/range-demo/range-demo.component.html","../../../projects/range-selection-input/src/lib/range-selection-input.module.ts","../../../projects/range-selection-input/src/public-api.ts","../../../projects/range-selection-input/src/range-selection-input.ts"],"sourcesContent":["import { Component, Input, OnInit, forwardRef, inject } from '@angular/core';\nimport { NG_VALUE_ACCESSOR, NG_VALIDATORS, ControlValueAccessor, AbstractControl, ValidationErrors, Validators, FormBuilder } from '@angular/forms';\n\n@Component({\n selector: 'app-range-selection-input',\n templateUrl: './range-selection-input.component.html',\n styleUrls: ['./range-selection-input.component.css'],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => RangeSelectionInputComponent),\n multi: true\n },\n {\n provide: NG_VALIDATORS,\n useExisting: forwardRef(() => RangeSelectionInputComponent),\n multi: true\n }\n ]\n})\nexport class RangeSelectionInputComponent implements OnInit, ControlValueAccessor {\n\n fb = inject(FormBuilder)\n\n doubleSlider = false\n\n startValue = this.fb.control(0)\n endValue = this.fb.control(0)\n\n _min = 0\n @Input() set min(value: number) {\n this._min = (value) ? value : 0\n this.doubleSlider = value > -1 ? true : false\n }\n\n get min() {\n return this._min\n }\n\n _max = 0\n @Input() set max(value: number) {\n this._max = value ? value : 100\n }\n\n get max() {\n return this._max\n }\n\n @Input() showValue = false\n @Input() showDivisions = false\n @Input() divisions = 0\n\n @Input() minRequired = this.min\n @Input() maxRequired = this.max\n\n _displayFunc: any\n @Input() set displayFunc(value: (data: any) => any) {\n this._displayFunc = value\n }\n\n get displayFunc() {\n return (this._displayFunc) ? this._displayFunc : () => {}\n }\n\n isObject = (value: any) => typeof value === \"object\"\n\n disabled = false\n\n onChange: any = () => {}\n onTouch: any = () => {}\n\n sliderValue = { start: 0, end: 10 }\n\n constructor() { }\n\n ngOnInit() {\n\n }\n\n onSetStartValue(value: any) {\n\n if(!this.doubleSlider) {\n\n this.sliderValue.end = +value\n this.onChange(this.sliderValue.end)\n\n } else {\n\n this.sliderValue.start = +value\n this.onChange(this.sliderValue)\n\n }\n\n }\n\n onSetEndValue(value: any) {\n this.sliderValue.end = +value\n this.onChange(this.sliderValue)\n }\n\n writeValue(value: any|number) {\n\n if(value) {\n\n if(this.isObject(value) && this.doubleSlider) {\n this.sliderValue.start = value.start || 0\n this.sliderValue.end = value.end || 0\n } else {\n this.sliderValue.end = value\n }\n\n this.sliderValue.start = this.sliderValue.start < this.min ? this.min : this.sliderValue.start\n this.sliderValue.end = this.sliderValue.end < this.max ? this.sliderValue.end : this.max\n\n this.endValue.patchValue(this.sliderValue.end, { emitEvent: false })\n this.startValue.patchValue(this.sliderValue.start, { emitEvent: false })\n\n } else {\n\n this.sliderValue.start = 0\n this.sliderValue.end = 0\n\n this.startValue.patchValue(this.sliderValue.start, { emitEvent: false })\n this.endValue.patchValue(this.sliderValue.end, { emitEvent: false })\n\n }\n\n }\n\n validate(control: AbstractControl): ValidationErrors | null {\n\n const isRequired = control.hasValidator(Validators.required) ? true : false\n\n let errors = { 'minRequired': false, 'maxRequired': false, 'valueRequired': false }\n\n errors.valueRequired = this.sliderValue.start === 0 || this.sliderValue.end === 0 ? true : false\n\n errors.minRequired = this.sliderValue.start < this.minRequired ? true : false\n errors.maxRequired = this.sliderValue.end > this.maxRequired || this.sliderValue.end < this.minRequired ? true : false\n\n return Object.fromEntries(Object.entries(errors).filter(([key, value]) => value !== false))\n\n }\n\n registerOnChange(fn: any){\n this.onChange = fn\n }\n\n registerOnTouched(fn: any){\n this.onTouch = fn\n }\n\n setDisabledState(isDisabled: boolean) {\n this.disabled = isDisabled\n }\n\n}\n","<div style=\"display: flex; gap: 2rem; flex-direction: column;\">\n\n <ng-container *ngIf=\"doubleSlider; else SINGLE\">\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [showTickMarks]=\"showDivisions\"\n [discrete]=\"showValue\"\n [step]=\"divisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n [formControl]=\"startValue\"\n matSliderStartThumb\n (change)=\"onSetStartValue(startValue.value)\"\n />\n <input\n [formControl]=\"endValue\"\n matSliderEndThumb\n (change)=\"onSetEndValue(endValue.value)\"\n >\n </mat-slider>\n </ng-container>\n\n <ng-template #SINGLE>\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"0\"\n [max]=\"max\"\n [step]=\"divisions\"\n [discrete]=\"showValue\"\n [showTickMarks]=\"showDivisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n matSliderThumb\n [formControl]=\"endValue\"\n (change)=\"onSetStartValue(endValue.value)\"\n >\n </mat-slider>\n\n </ng-template>\n\n</div>\n","import { Component, OnInit, inject } from '@angular/core';\nimport { FormBuilder, Validators } from '@angular/forms';\n\n@Component({\n selector: 'app-range-selection-input-demo',\n templateUrl: './range-demo.component.html',\n styleUrls: ['./range-demo.component.css']\n})\nexport class RangeDemoComponent implements OnInit {\n\n fb = inject(FormBuilder)\n\n selectionControl_1 = this.fb.control<number|null>(null)\n selectionControl_2 = this.fb.control<{ start: number, end: number }|null>(null, Validators.required)\n selectionControl_3 = this.fb.control<{ start: number, end: number }|null>(null, Validators.required)\n\n changeDetection_1 = this.fb.control<any[]|null>(null)\n changeDetection_2 = this.fb.control<any[]|null>(null)\n changeDetection_3 = this.fb.control<any[]|null>(null)\n\n\n\n constructor() { }\n\n ngOnInit() {\n\n this.selectionControl_1.valueChanges.subscribe(data => {\n if(this.changeDetection_1.valid) console.log('CHANGE:',data)\n })\n\n this.selectionControl_2.valueChanges.subscribe(data => {\n if(this.changeDetection_2.valid) console.log('CHANGE:',data)\n })\n\n this.selectionControl_3.valueChanges.subscribe(data => {\n if(this.changeDetection_3.valid) console.log('CHANGE:',data)\n })\n\n }\n\n customLabel(value: number): string {\n return `${value}K`;\n }\n\n // DISABLE\n onDisabled_1(disable: boolean) {\n\n if(disable) {\n this.selectionControl_1.disable()\n } else {\n this.selectionControl_1.enable()\n }\n\n }\n\n onDisabled_2(disable: boolean) {\n\n if(disable) {\n this.selectionControl_2.disable()\n } else {\n this.selectionControl_2.enable()\n }\n\n }\n\n onPerformPatch() {\n this.selectionControl_1.patchValue(5)\n this.selectionControl_2.patchValue({ start: 25, end: 50 })\n this.selectionControl_3.patchValue({ start: 25, end: 50 })\n }\n\n nothingMethod(value: number) {\n return value.toString()\n }\n\n}\n\n\n\n","<div style=\"display: flex;\">\n <h1>Slider FormControl</h1>\n <div style=\"flex:1; text-align: right;\">\n <div style=\"display: flex; gap: 2rem; flex-direction: row-reverse;\">\n <mat-button-toggle (click)=\"onPerformPatch()\">Patch</mat-button-toggle>\n </div>\n </div>\n</div>\n\n<!-- <h3>No Data - Projection of Error</h3>\n\n<app-input-slider>\n <h3 style=\"color: red; margin-top: 0; margin-bottom: 0;\">No Data</h3>\n</app-input-slider>\n\n<div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n</div> -->\n\n<div>\n <h3 style=\"margin-bottom: 0;\">Single Range Selection - VALUE</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_1.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_1\"\n [max]=\"25\"\n [showValue]=\"showVal_1.checked\"\n [showDivisions]=\"showTicks_1.checked\"\n [divisions]=\"showTicks_1.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_1.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_1\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #disable1 (change)=\"onDisabled_1(disable1.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_1>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_1>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_1>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_1>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range 0 - 25<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n No label<br>\n No Validation Required<br>\n Valid {{ selectionControl_1.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_2.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_2\"\n [min]=\"0\"\n [max]=\"100\"\n [showValue]=\"showVal_2.checked\"\n [showDivisions]=\"showTicks_2.checked\"\n [divisions]=\"showTicks_2.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_2.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div *ngIf=\"error2.checked\">\n <mat-error *ngIf=\"selectionControl_2.hasError('valueRequired')\">Must have a Selection</mat-error>\n </div>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error2>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable2 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_2>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_2>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_2>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_2>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required<br>\n Valid {{ selectionControl_2.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection with Min/Max Validation - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_3.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_3\"\n [min]=\"0\"\n [max]=\"100\"\n [minRequired]=\"10\"\n [maxRequired]=\"50\"\n [showValue]=\"showVal_3.checked\"\n [showDivisions]=\"showTicks_3.checked\"\n [divisions]=\"showTicks_3.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_3.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div *ngIf=\"error3.checked\">\n <mat-error *ngIf=\"selectionControl_3.hasError('minRequired')\">Range must be greater then 10</mat-error>\n </div>\n <div *ngIf=\"error3.checked\">\n <mat-error *ngIf=\"selectionControl_3.hasError('maxRequired')\">Range must me less then 50</mat-error>\n </div>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error3>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable3 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_3>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_3>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_3>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_3>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required with Min > 10 and Max < 50<br>\n Valid {{ selectionControl_3.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\n\nimport { MatSliderModule } from '@angular/material/slider';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatSlideToggleModule } from '@angular/material/slide-toggle';\n\nimport { MatButtonToggleModule } from '@angular/material/button-toggle';\nimport { MatDividerModule } from '@angular/material/divider';\n\nimport { RangeDemoComponent } from './range-demo/range-demo.component';\nimport { RangeSelectionInputComponent } from './input-slider/range-selection-input.component';\n\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n ReactiveFormsModule,\n MatButtonModule,\n MatFormFieldModule,\n MatSliderModule,\n MatSlideToggleModule,\n MatDividerModule,\n MatButtonToggleModule,\n ],\n declarations: [\n RangeSelectionInputComponent,\n RangeDemoComponent,\n ],\n exports: [\n RangeSelectionInputComponent,\n RangeDemoComponent\n ]\n})\nexport class RangeSelectionInputModule { }\n","/*\n * Public API Surface of range-selection-input\n */\n\nexport * from './lib/range-demo/range-demo.component';\nexport * from './lib/input-slider/range-selection-input.component';\n\nexport * from './lib/range-selection-input.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i3","i8.RangeSelectionInputComponent"],"mappings":"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"}
1
+ {"version":3,"file":"range-selection-input.mjs","sources":["../../../projects/range-selection-input/src/lib/input-slider/range-selection-input.component.ts","../../../projects/range-selection-input/src/lib/input-slider/range-selection-input.component.html","../../../projects/range-selection-input/src/lib/range-demo/range-demo.component.ts","../../../projects/range-selection-input/src/lib/range-demo/range-demo.component.html","../../../projects/range-selection-input/src/lib/range-selection-input.module.ts","../../../projects/range-selection-input/src/public-api.ts","../../../projects/range-selection-input/src/range-selection-input.ts"],"sourcesContent":["import { Component, Input, OnInit, forwardRef, inject } from '@angular/core';\nimport { NG_VALUE_ACCESSOR, NG_VALIDATORS, ControlValueAccessor, AbstractControl, ValidationErrors, Validators, FormBuilder } from '@angular/forms';\n\n@Component({\n selector: 'app-range-selection-input',\n templateUrl: './range-selection-input.component.html',\n styleUrls: ['./range-selection-input.component.css'],\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => RangeSelectionInputComponent),\n multi: true\n },\n {\n provide: NG_VALIDATORS,\n useExisting: forwardRef(() => RangeSelectionInputComponent),\n multi: true\n }\n ],\n standalone: false\n})\nexport class RangeSelectionInputComponent implements OnInit, ControlValueAccessor {\n\n fb = inject(FormBuilder)\n\n doubleSlider = false\n\n startValue = this.fb.control(0)\n endValue = this.fb.control(0)\n\n _min = 0\n @Input() set min(value: number) {\n this._min = (value) ? value : 0\n this.doubleSlider = value > -1 ? true : false\n }\n\n get min() {\n return this._min\n }\n\n _max = 0\n @Input() set max(value: number) {\n this._max = value ? value : 100\n }\n\n get max() {\n return this._max\n }\n\n @Input() showValue = false\n @Input() showDivisions = false\n @Input() divisions = 0\n\n @Input() minRequired = this.min\n @Input() maxRequired = this.max\n\n _displayFunc: any\n @Input() set displayFunc(value: (data: any) => any) {\n this._displayFunc = value\n }\n\n get displayFunc() {\n return (this._displayFunc) ? this._displayFunc : () => {}\n }\n\n isObject = (value: any) => typeof value === \"object\"\n\n disabled = false\n\n onChange: any = () => {}\n onTouch: any = () => {}\n\n sliderValue = { start: 0, end: 10 }\n\n constructor() { }\n\n ngOnInit() {\n\n }\n\n onSetStartValue(value: any) {\n\n if(!this.doubleSlider) {\n\n this.sliderValue.end = +value\n this.onChange(this.sliderValue.end)\n\n } else {\n\n this.sliderValue.start = +value\n this.onChange(this.sliderValue)\n\n }\n\n }\n\n onSetEndValue(value: any) {\n this.sliderValue.end = +value\n this.onChange(this.sliderValue)\n }\n\n writeValue(value: any|number) {\n\n if(value) {\n\n if(this.isObject(value) && this.doubleSlider) {\n this.sliderValue.start = value.start || 0\n this.sliderValue.end = value.end || 0\n } else {\n this.sliderValue.end = value\n }\n\n this.sliderValue.start = this.sliderValue.start < this.min ? this.min : this.sliderValue.start\n this.sliderValue.end = this.sliderValue.end < this.max ? this.sliderValue.end : this.max\n\n this.endValue.patchValue(this.sliderValue.end, { emitEvent: false })\n this.startValue.patchValue(this.sliderValue.start, { emitEvent: false })\n\n } else {\n\n this.sliderValue.start = 0\n this.sliderValue.end = 0\n\n this.startValue.patchValue(this.sliderValue.start, { emitEvent: false })\n this.endValue.patchValue(this.sliderValue.end, { emitEvent: false })\n\n }\n\n }\n\n validate(control: AbstractControl): ValidationErrors | null {\n\n const isRequired = control.hasValidator(Validators.required) ? true : false\n\n let errors = { 'minRequired': false, 'maxRequired': false, 'valueRequired': false }\n\n errors.valueRequired = this.sliderValue.start === 0 || this.sliderValue.end === 0 ? true : false\n\n errors.minRequired = this.sliderValue.start < this.minRequired ? true : false\n errors.maxRequired = this.sliderValue.end > this.maxRequired || this.sliderValue.end < this.minRequired ? true : false\n\n return Object.fromEntries(Object.entries(errors).filter(([key, value]) => value !== false))\n\n }\n\n registerOnChange(fn: any){\n this.onChange = fn\n }\n\n registerOnTouched(fn: any){\n this.onTouch = fn\n }\n\n setDisabledState(isDisabled: boolean) {\n this.disabled = isDisabled\n }\n\n}\n","<div style=\"display: flex; gap: 2rem; flex-direction: column;\">\n\n @if (doubleSlider) {\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"min\"\n [max]=\"max\"\n [showTickMarks]=\"showDivisions\"\n [discrete]=\"showValue\"\n [step]=\"divisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n [formControl]=\"startValue\"\n matSliderStartThumb\n (change)=\"onSetStartValue(startValue.value)\"\n />\n <input\n [formControl]=\"endValue\"\n matSliderEndThumb\n (change)=\"onSetEndValue(endValue.value)\"\n >\n </mat-slider>\n } @else {\n <mat-slider\n [disabled]=\"disabled\"\n [min]=\"0\"\n [max]=\"max\"\n [step]=\"divisions\"\n [discrete]=\"showValue\"\n [showTickMarks]=\"showDivisions\"\n [displayWith]=\"displayFunc\"\n >\n <input\n matSliderThumb\n [formControl]=\"endValue\"\n (change)=\"onSetStartValue(endValue.value)\"\n >\n </mat-slider>\n }\n\n\n</div>\n","import { Component, OnInit, inject } from '@angular/core';\nimport { FormBuilder, Validators } from '@angular/forms';\n\n@Component({\n selector: 'app-range-selection-input-demo',\n templateUrl: './range-demo.component.html',\n styleUrls: ['./range-demo.component.css'],\n standalone: false\n})\nexport class RangeDemoComponent implements OnInit {\n\n fb = inject(FormBuilder)\n\n selectionControl_1 = this.fb.control<number|null>(null)\n selectionControl_2 = this.fb.control<{ start: number, end: number }|null>(null, Validators.required)\n selectionControl_3 = this.fb.control<{ start: number, end: number }|null>(null, Validators.required)\n\n changeDetection_1 = this.fb.control<any[]|null>(null)\n changeDetection_2 = this.fb.control<any[]|null>(null)\n changeDetection_3 = this.fb.control<any[]|null>(null)\n\n\n\n constructor() { }\n\n ngOnInit() {\n\n this.selectionControl_1.valueChanges.subscribe(data => {\n if(this.changeDetection_1.valid) console.log('CHANGE:',data)\n })\n\n this.selectionControl_2.valueChanges.subscribe(data => {\n if(this.changeDetection_2.valid) console.log('CHANGE:',data)\n })\n\n this.selectionControl_3.valueChanges.subscribe(data => {\n if(this.changeDetection_3.valid) console.log('CHANGE:',data)\n })\n\n }\n\n customLabel(value: number): string {\n return `${value}K`;\n }\n\n // DISABLE\n onDisabled_1(disable: boolean) {\n\n if(disable) {\n this.selectionControl_1.disable()\n } else {\n this.selectionControl_1.enable()\n }\n\n }\n\n onDisabled_2(disable: boolean) {\n\n if(disable) {\n this.selectionControl_2.disable()\n } else {\n this.selectionControl_2.enable()\n }\n\n }\n\n onPerformPatch() {\n this.selectionControl_1.patchValue(5)\n this.selectionControl_2.patchValue({ start: 25, end: 50 })\n this.selectionControl_3.patchValue({ start: 25, end: 50 })\n }\n\n nothingMethod(value: number) {\n return value.toString()\n }\n\n}\n\n\n\n","<div style=\"display: flex;\">\n <h1>Slider FormControl</h1>\n <div style=\"flex:1; text-align: right;\">\n <div style=\"display: flex; gap: 2rem; flex-direction: row-reverse;\">\n <mat-button-toggle (click)=\"onPerformPatch()\">Patch</mat-button-toggle>\n </div>\n </div>\n</div>\n\n<!-- <h3>No Data - Projection of Error</h3>\n\n<app-input-slider>\n <h3 style=\"color: red; margin-top: 0; margin-bottom: 0;\">No Data</h3>\n</app-input-slider>\n\n<div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n</div> -->\n\n<div>\n <h3 style=\"margin-bottom: 0;\">Single Range Selection - VALUE</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_1.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_1\"\n [max]=\"25\"\n [showValue]=\"showVal_1.checked\"\n [showDivisions]=\"showTicks_1.checked\"\n [divisions]=\"showTicks_1.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_1.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_1\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #disable1 (change)=\"onDisabled_1(disable1.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_1>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_1>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_1>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_1>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range 0 - 25<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n No label<br>\n No Validation Required<br>\n Valid {{ selectionControl_1.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_2.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_2\"\n [min]=\"0\"\n [max]=\"100\"\n [showValue]=\"showVal_2.checked\"\n [showDivisions]=\"showTicks_2.checked\"\n [divisions]=\"showTicks_2.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_2.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n @if (error2.checked) {\n <div>\n @if (selectionControl_2.hasError('valueRequired')) {\n <mat-error>Must have a Selection</mat-error>\n }\n </div>\n }\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error2>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable2 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_2>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_2>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_2>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_2>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required<br>\n Valid {{ selectionControl_2.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n\n<div>\n\n <h3 style=\"margin-bottom: 0;\">Start/End Range Selection with Min/Max Validation - OBJECT</h3>\n\n <div style=\"display: flex;\">\n <span style=\"flex:1\"></span>\n <button mat-button (click)=\"selectionControl_3.reset()\">Reset</button>\n </div>\n <app-range-selection-input\n [formControl]=\"selectionControl_3\"\n [min]=\"0\"\n [max]=\"100\"\n [minRequired]=\"10\"\n [maxRequired]=\"50\"\n [showValue]=\"showVal_3.checked\"\n [showDivisions]=\"showTicks_3.checked\"\n [divisions]=\"showTicks_3.checked ? 5 : 0\"\n [displayFunc]=\"(labelFormat_3.checked) ? customLabel : nothingMethod\"\n >\n </app-range-selection-input>\n @if (error3.checked) {\n <div>\n @if (selectionControl_3.hasError('minRequired')) {\n <mat-error>Range must be greater then 10</mat-error>\n }\n </div>\n }\n @if (error3.checked) {\n <div>\n @if (selectionControl_3.hasError('maxRequired')) {\n <mat-error>Range must me less then 50</mat-error>\n }\n </div>\n }\n <div style=\"display: flex; gap: 2rem; margin-top: 2rem;\">\n <mat-slide-toggle [formControl]=\"changeDetection_2\">Change Detection</mat-slide-toggle>\n <mat-slide-toggle #error3>Display Error</mat-slide-toggle>\n <mat-slide-toggle #disable3 (change)=\"onDisabled_2(disable2.checked)\">Disable</mat-slide-toggle>\n <span style=\"flex:1\"></span>\n <mat-slide-toggle #showVal_3>Show Value</mat-slide-toggle>\n <mat-slide-toggle #showTicks_3>Show Divisions</mat-slide-toggle>\n <mat-slide-toggle #divisions_3>Divisions</mat-slide-toggle>\n <mat-slide-toggle #labelFormat_3>Label Format</mat-slide-toggle>\n </div>\n <div style=\"margin-top: 2rem;\">\n Range from 0 - 100<br />\n Step Increment is set to 5 only when Show Divisions = true<br>\n Label<br>\n Validation Required with Min > 10 and Max < 50<br>\n Valid {{ selectionControl_3.valid }}<br>\n </div>\n <div style=\"margin-top: .5rem; margin-bottom: 1rem;\">\n <mat-divider></mat-divider>\n </div>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\n\nimport { MatSliderModule } from '@angular/material/slider';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatSlideToggleModule } from '@angular/material/slide-toggle';\n\nimport { MatButtonToggleModule } from '@angular/material/button-toggle';\nimport { MatDividerModule } from '@angular/material/divider';\n\nimport { RangeDemoComponent } from './range-demo/range-demo.component';\nimport { RangeSelectionInputComponent } from './input-slider/range-selection-input.component';\n\n@NgModule({\n imports: [\n CommonModule,\n FormsModule,\n ReactiveFormsModule,\n MatButtonModule,\n MatFormFieldModule,\n MatSliderModule,\n MatSlideToggleModule,\n MatDividerModule,\n MatButtonToggleModule,\n ],\n declarations: [\n RangeSelectionInputComponent,\n RangeDemoComponent,\n ],\n exports: [\n RangeSelectionInputComponent,\n RangeDemoComponent\n ]\n})\nexport class RangeSelectionInputModule { }\n","/*\n * Public API Surface of range-selection-input\n */\n\nexport * from './lib/range-demo/range-demo.component';\nexport * from './lib/input-slider/range-selection-input.component';\n\nexport * from './lib/range-selection-input.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i2","i7.RangeSelectionInputComponent"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,15 @@
1
1
  {
2
2
  "name": "range-selection-input",
3
- "version": "15.0.2",
3
+ "version": "15.0.3",
4
+ "homepage": "https://wavecoders.ca",
5
+ "author": "Mike Bonifacio <wavecoders@gmail.com> (http://wavecoders@gmail.com/)",
6
+ "description": "This is an Angular Module containing Components/Services using Material",
7
+ "funding": [
8
+ {
9
+ "type": "individual",
10
+ "url": "http://wavecoders.ca/donate"
11
+ }
12
+ ],
4
13
  "peerDependencies": {
5
14
  "@angular/common": "^15.2.0",
6
15
  "@angular/core": "^15.2.0"
@@ -10,15 +19,13 @@
10
19
  },
11
20
  "sideEffects": false,
12
21
  "module": "fesm2022/range-selection-input.mjs",
13
- "typings": "index.d.ts",
22
+ "typings": "types/range-selection-input.d.ts",
14
23
  "exports": {
15
24
  "./package.json": {
16
25
  "default": "./package.json"
17
26
  },
18
27
  ".": {
19
- "types": "./index.d.ts",
20
- "esm2022": "./esm2022/range-selection-input.mjs",
21
- "esm": "./esm2022/range-selection-input.mjs",
28
+ "types": "./types/range-selection-input.d.ts",
22
29
  "default": "./fesm2022/range-selection-input.mjs"
23
30
  }
24
31
  }
Binary file
@@ -0,0 +1,84 @@
1
+ import * as _angular_forms from '@angular/forms';
2
+ import { FormBuilder, ControlValueAccessor, AbstractControl, ValidationErrors } from '@angular/forms';
3
+ import * as i0 from '@angular/core';
4
+ import { OnInit } from '@angular/core';
5
+ import * as i3 from '@angular/common';
6
+ import * as i5 from '@angular/material/button';
7
+ import * as i6 from '@angular/material/form-field';
8
+ import * as i7 from '@angular/material/slider';
9
+ import * as i8 from '@angular/material/slide-toggle';
10
+ import * as i9 from '@angular/material/divider';
11
+ import * as i10 from '@angular/material/button-toggle';
12
+
13
+ declare class RangeDemoComponent implements OnInit {
14
+ fb: FormBuilder;
15
+ selectionControl_1: _angular_forms.FormControl<number | null>;
16
+ selectionControl_2: _angular_forms.FormControl<{
17
+ start: number;
18
+ end: number;
19
+ } | null>;
20
+ selectionControl_3: _angular_forms.FormControl<{
21
+ start: number;
22
+ end: number;
23
+ } | null>;
24
+ changeDetection_1: _angular_forms.FormControl<any[] | null>;
25
+ changeDetection_2: _angular_forms.FormControl<any[] | null>;
26
+ changeDetection_3: _angular_forms.FormControl<any[] | null>;
27
+ constructor();
28
+ ngOnInit(): void;
29
+ customLabel(value: number): string;
30
+ onDisabled_1(disable: boolean): void;
31
+ onDisabled_2(disable: boolean): void;
32
+ onPerformPatch(): void;
33
+ nothingMethod(value: number): string;
34
+ static ɵfac: i0.ɵɵFactoryDeclaration<RangeDemoComponent, never>;
35
+ static ɵcmp: i0.ɵɵComponentDeclaration<RangeDemoComponent, "app-range-selection-input-demo", never, {}, {}, never, never, false, never>;
36
+ }
37
+
38
+ declare class RangeSelectionInputComponent implements OnInit, ControlValueAccessor {
39
+ fb: FormBuilder;
40
+ doubleSlider: boolean;
41
+ startValue: _angular_forms.FormControl<number | null>;
42
+ endValue: _angular_forms.FormControl<number | null>;
43
+ _min: number;
44
+ set min(value: number);
45
+ get min(): number;
46
+ _max: number;
47
+ set max(value: number);
48
+ get max(): number;
49
+ showValue: boolean;
50
+ showDivisions: boolean;
51
+ divisions: number;
52
+ minRequired: number;
53
+ maxRequired: number;
54
+ _displayFunc: any;
55
+ set displayFunc(value: (data: any) => any);
56
+ get displayFunc(): (data: any) => any;
57
+ isObject: (value: any) => boolean;
58
+ disabled: boolean;
59
+ onChange: any;
60
+ onTouch: any;
61
+ sliderValue: {
62
+ start: number;
63
+ end: number;
64
+ };
65
+ constructor();
66
+ ngOnInit(): void;
67
+ onSetStartValue(value: any): void;
68
+ onSetEndValue(value: any): void;
69
+ writeValue(value: any | number): void;
70
+ validate(control: AbstractControl): ValidationErrors | null;
71
+ registerOnChange(fn: any): void;
72
+ registerOnTouched(fn: any): void;
73
+ setDisabledState(isDisabled: boolean): void;
74
+ static ɵfac: i0.ɵɵFactoryDeclaration<RangeSelectionInputComponent, never>;
75
+ static ɵcmp: i0.ɵɵComponentDeclaration<RangeSelectionInputComponent, "app-range-selection-input", never, { "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "showValue": { "alias": "showValue"; "required": false; }; "showDivisions": { "alias": "showDivisions"; "required": false; }; "divisions": { "alias": "divisions"; "required": false; }; "minRequired": { "alias": "minRequired"; "required": false; }; "maxRequired": { "alias": "maxRequired"; "required": false; }; "displayFunc": { "alias": "displayFunc"; "required": false; }; }, {}, never, never, false, never>;
76
+ }
77
+
78
+ declare class RangeSelectionInputModule {
79
+ static ɵfac: i0.ɵɵFactoryDeclaration<RangeSelectionInputModule, never>;
80
+ static ɵmod: i0.ɵɵNgModuleDeclaration<RangeSelectionInputModule, [typeof RangeSelectionInputComponent, typeof RangeDemoComponent], [typeof i3.CommonModule, typeof _angular_forms.FormsModule, typeof _angular_forms.ReactiveFormsModule, typeof i5.MatButtonModule, typeof i6.MatFormFieldModule, typeof i7.MatSliderModule, typeof i8.MatSlideToggleModule, typeof i9.MatDividerModule, typeof i10.MatButtonToggleModule], [typeof RangeSelectionInputComponent, typeof RangeDemoComponent]>;
81
+ static ɵinj: i0.ɵɵInjectorDeclaration<RangeSelectionInputModule>;
82
+ }
83
+
84
+ export { RangeDemoComponent, RangeSelectionInputComponent, RangeSelectionInputModule };