rm-range-slider/fesm2022/rm-range-slider.mjs.map

A highly optimized and fully customizable pure angular component for value range selection.

{"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  min: number;\r\n  max: number;\r\n}\r\n\r\n@Component({\r\n  selector: 'rm-range-slider',\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      min: this.startValue,\r\n      max: 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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"}