@ruc-lib/knob 2.0.0 → 3.1.0

package/fesm2022/ruc-lib-knob.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ruc-lib-knob.mjs","sources":["../../src/models/knob-config.model.ts","../../src/lib/ruclib-knob/ruclib-knob.component.ts","../../src/lib/ruclib-knob/ruclib-knob.component.html","../../src/models/knob.interface.ts","../../src/ruc-lib-knob.ts"],"sourcesContent":["export const DefaultKnobConfig = {\r\n    min:<number> 0,\r\n    max:<number> 100,\r\n    step:<number> 1,\r\n    size:<number> 150,\r\n    valueColor:<string> '',\r\n    strokeBackground:<string> 'lightblue',\r\n    progressBackground: <string | string[]> 'blue', // 'green' |  ['green'] | ['red', 'blue', 'green', 'black', 'orange'],\r\n    strokeWidth:<number> 15,\r\n    valueSize:<number> 20,\r\n    valueWeight:<string> 'normal',\r\n    showHandle:<boolean> true,\r\n    handleBackground:<string> 'lightblue',\r\n    handleBorderColor:<string> 'blue',\r\n    handleBorderWidth:<number> 4,\r\n    roundedCorner:<boolean> true,\r\n    valuePrefix:<string> '',\r\n    valueSuffix:<string> '',\r\n    readOnly:<boolean> false,\r\n    disabled:<boolean> false,\r\n    enableTooltip:<boolean> false,\r\n    animateOnHover:<boolean> false,\r\n    isRangeMode:<boolean> false,\r\n    rangeStartValue:<number> 25,\r\n    rangeEndValue:<number> 75,\r\n    showButtons:<boolean> false,\r\n    knobType:<'horizontal' | 'vertical' | 'arc'> 'arc' // 'horizontal' | 'vertical' | 'arc'\r\n  }\r\n\r\n  export const DEFAULT_LABELS = {\r\n    incrementButton:<string> 'Increment Value',\r\n    decrementButton:<string> 'Decrement Value'\r\n  }","/* eslint-disable @typescript-eslint/no-empty-function */\r\n/* eslint-disable @typescript-eslint/no-unused-vars */\r\n/* eslint-disable @typescript-eslint/no-inferrable-types */\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { CommonModule } from '@angular/common';\r\nimport { AfterViewInit, ChangeDetectorRef, Component, ElementRef, EventEmitter, forwardRef, HostListener, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\r\nimport { KnobConfig } from '../../models/knob.interface';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { DEFAULT_LABELS, DefaultKnobConfig } from '../../models/knob-config.model';\r\n\r\n@Component({\r\n    selector: 'uxp-ruclib-knob',\r\n    imports: [CommonModule,\r\n        FormsModule,\r\n        ReactiveFormsModule,\r\n        MatButtonModule,\r\n        MatIconModule],\r\n    templateUrl: './ruclib-knob.component.html',\r\n    styleUrl: './ruclib-knob.component.scss',\r\n    providers: [\r\n        {\r\n            provide: NG_VALUE_ACCESSOR,\r\n            useExisting: forwardRef(() => RuclibKnobComponent),\r\n            multi: true\r\n        }\r\n    ]\r\n})\r\nexport class RuclibKnobComponent  implements ControlValueAccessor, OnInit, AfterViewInit, OnChanges {\r\n\r\n  @ViewChild('bgArc') bgArcRef!: ElementRef<SVGPathElement>;\r\n  @ViewChild('progressArc') progressArcRef!: ElementRef<SVGPathElement>;\r\n  @ViewChild('handle') handleRef!: ElementRef<SVGCircleElement>;\r\n  @ViewChild('horizontalLine') horizontalLineRef!: ElementRef<SVGLineElement>;\r\n  @ViewChild('verticalLine') verticalLineRef!: ElementRef<SVGLineElement>;\r\n\r\n  @Output() rucEvent = new EventEmitter<any>();\r\n\r\n  @Input() customTheme?: string = '';\r\n  @Input() rucInputData!: KnobConfig;\r\n\r\n  activeHandle: 'start' | 'end' | '' = '';\r\n  value: number = 0;\r\n  dragging:boolean = false;\r\n  centerX:number = 0;\r\n  centerY:number = 0;\r\n  radius:number = 0;\r\n  startAngle:number = 210;\r\n  endAngle:number = 510;\r\n  arcLength:number = 300;\r\n  changeColorAfter:number = 0;\r\n  tooltipX:number = 0;\r\n  tooltipY:number = 0;\r\n  showTooltip: boolean = false;\r\n  hovering:boolean = false;\r\n\r\n  config = DefaultKnobConfig;\r\n\r\n  private onTouched = () => { };\r\n  private onChange = (value: number) => { };\r\n\r\n  constructor(private cdr: ChangeDetectorRef) {\r\n  }\r\n\r\n  /**\r\n   * handling form control binding to write value\r\n   * @param val\r\n   */\r\n  writeValue(val: number): void {\r\n    this.value = val;\r\n  }\r\n\r\n  /**\r\n   * registering onChange method to use as form control\r\n   * @param fn\r\n   */\r\n  registerOnChange(fn: () => void): void {\r\n    this.onChange = fn;\r\n  }\r\n\r\n  /**\r\n   * registering onTouch method to use as form control\r\n   * @param fn\r\n   */\r\n  registerOnTouched(fn: () => void): void {\r\n    this.onTouched = fn;\r\n  }\r\n\r\n  /**\r\n   * registering disabled state\r\n   * @param isDisabled\r\n   */\r\n  setDisabledState(isDisabled: boolean): void {\r\n    this.config.disabled = isDisabled;\r\n  }\r\n\r\n  /**\r\n   * handling input data changes\r\n   * updating default config with user provided config\r\n   * @param changes\r\n   */\r\n  ngOnChanges(changes: SimpleChanges) {\r\n    if (changes && changes['rucInputData'] && changes['rucInputData'].currentValue) {\r\n      this.config = { ...this.config, ...changes['rucInputData'].currentValue }\r\n    }\r\n  }\r\n\r\n  /**\r\n   * handling change on component initilization\r\n   */\r\n  ngOnInit() {\r\n    this.adjustDefaultValue();\r\n    if (this.config.knobType != 'arc') {\r\n      this.config.isRangeMode = false;\r\n      this.config.enableTooltip = false;\r\n    }\r\n    if (Array.isArray(this.config.progressBackground)) {\r\n      this.changeColorAfter = Math.round(100 / this.config.progressBackground.length);\r\n    }\r\n  }\r\n\r\n  /**\r\n   * handling change after view initilization\r\n   */\r\n  ngAfterViewInit() {\r\n    this.centerX = this.config.size / 2;\r\n    this.centerY = this.config.size / 2;\r\n    this.radius = this.config.size / 2 - 20;\r\n\r\n    this.bgArcRef?.nativeElement.setAttribute('d',\r\n      this.describeArc(this.centerX, this.centerY, this.radius, this.startAngle, this.endAngle));\r\n    this.updateArc();\r\n    this.cdr.detectChanges();\r\n  }\r\n\r\n  /**\r\n   * handling change when dragin on svg\r\n   * @returns\r\n   */\r\n  startDrag() {\r\n    if (this.config.disabled || this.config.readOnly) return;\r\n    this.dragging = true;\r\n    this.showTooltip = true;\r\n    this.rucEvent.emit({ eventName: 'dragStart', eventOutput: { value: this.getEventOutput() } })\r\n  }\r\n\r\n  /**\r\n   * rounding value to increment or decrement based on provide config value for step\r\n   * @param value\r\n   * @returns\r\n   */\r\n  roundToStep(value: number): number {\r\n    const stepped = Math.round((value - this.config.min) / this.config.step) * this.config.step + this.config.min;\r\n    return this.clamp(stepped, this.config.min, this.config.max);\r\n  }\r\n\r\n  /**\r\n   * adjusting default value within min & max value when its provide out of range\r\n   */\r\n  adjustDefaultValue() {\r\n    if (this.value < this.config.min) {\r\n      this.value = this.config.min;\r\n    }\r\n    if (this.value > this.config.max) {\r\n      this.value = this.config.max;\r\n    }\r\n    if (this.config.isRangeMode) {\r\n      if (this.config.rangeStartValue < this.config.min || this.config.rangeStartValue > this.config.max) {\r\n        this.config.rangeStartValue = this.config.min;\r\n      }\r\n      if (this.config.rangeEndValue > this.config.max || this.config.rangeEndValue < this.config.min) {\r\n        this.config.rangeEndValue = this.config.max;\r\n      }\r\n    }\r\n    this.updateArc();\r\n  }\r\n\r\n  /**\r\n   * handle changes on mouseUp and touchEnd event\r\n   */\r\n  @HostListener('window:mouseup')\r\n  @HostListener('window:touchend')\r\n  stopDrag() {\r\n    this.dragging = false;\r\n    this.showTooltip = false;\r\n    this.rucEvent.emit({ eventName: 'dragEnd', eventOutput: { value: this.getEventOutput() } })\r\n  }\r\n\r\n  /**\r\n   * handle changes on mouseMove and touch event\r\n   * @param event\r\n   * @returns\r\n   */\r\n  @HostListener('window:mousemove', ['$event'])\r\n  @HostListener('window:touchmove', ['$event'])\r\n  onMove(event: MouseEvent | TouchEvent) {\r\n    if (this.config.disabled || this.config.readOnly || !this.dragging) return;\r\n    event.preventDefault();\r\n    this.setProgressFromEvent(event);\r\n  }\r\n\r\n  /**\r\n   * handling change on main svg click\r\n   * @param event\r\n   * @returns\r\n   */\r\n  onSvgClick(event: MouseEvent | TouchEvent) {\r\n    if (this.config.disabled || this.config.readOnly || this.config.isRangeMode) return;\r\n    this.setProgressFromEvent(event);\r\n  }\r\n\r\n  /**\r\n   * get ref of active svg element for different type of knobs\r\n   * @returns\r\n   */\r\n  getTargetSvg(): SVGElement | null {\r\n    if (this.config.knobType === 'horizontal') {\r\n      return this.horizontalLineRef.nativeElement.closest('svg');\r\n    } else\r\n      if (this.config.knobType === 'vertical') {\r\n        return this.verticalLineRef.nativeElement.closest('svg');\r\n      }\r\n    return this.bgArcRef.nativeElement.closest('svg');\r\n\r\n  }\r\n\r\n  /**\r\n   * updating progrees value while dragging the handle on stroke bar\r\n   * @param e\r\n   * @returns\r\n   */\r\n  setProgressFromEvent(e: MouseEvent | TouchEvent) {\r\n    const svg = this.getTargetSvg();\r\n    if (!svg) {\r\n      return;\r\n    }\r\n    const rect = svg.getBoundingClientRect();\r\n    const clientX = (e instanceof TouchEvent) ? e.touches[0].clientX : e.clientX;\r\n    const clientY = (e instanceof TouchEvent) ? e.touches[0].clientY : e.clientY;\r\n\r\n    const x = clientX - rect.left;\r\n    const y = clientY - rect.top;\r\n\r\n    let rawPercent: number;\r\n    if (this.config.knobType === 'horizontal') {\r\n      const usableWidth = this.config.size - 2 * this.config.strokeWidth;\r\n      rawPercent = ((x - this.config.strokeWidth) / usableWidth) * 100;\r\n    } else if (this.config.knobType === 'vertical') {\r\n      const usableHeight = this.config.size - 2 * this.config.strokeWidth;\r\n      rawPercent = (1 - (y - this.config.strokeWidth) / usableHeight) * 100;\r\n    } else {\r\n      const angle = this.getAngleFromPoint(x, y);\r\n      if (angle === null) return;\r\n      rawPercent = ((angle - this.startAngle) / this.arcLength) * 100;\r\n    }\r\n\r\n    const clampedPercent = this.clamp(rawPercent, 0, 100);\r\n    let absolutePercent = this.config.min + (clampedPercent / 100) * (this.config.max - this.config.min);\r\n    absolutePercent = this.roundToStep(absolutePercent);\r\n\r\n    if (this.config.isRangeMode) {\r\n      if (this.activeHandle === 'start') {\r\n        if (absolutePercent > this.config.rangeEndValue) {\r\n          absolutePercent = this.config.rangeEndValue;\r\n        }\r\n        this.config.rangeStartValue = absolutePercent;\r\n      } else {\r\n        if (absolutePercent < this.config.rangeStartValue) {\r\n          absolutePercent = this.config.rangeStartValue;\r\n        }\r\n        this.config.rangeEndValue = absolutePercent;\r\n      }\r\n      this.rucEvent.emit({ eventName: 'valueChange', eventOutput: { start: this.config.rangeStartValue, end: this.config.rangeEndValue } })\r\n    } else {\r\n      this.value = absolutePercent;\r\n      this.rucEvent.emit({ eventName: 'valueChange', eventOutput: this.value });\r\n    }\r\n\r\n    this.updateArc();\r\n    this.onChange(this.value);\r\n    this.onTouched();\r\n  }\r\n\r\n  /**\r\n   * updating svg progress based on value changes\r\n   * @returns\r\n   */\r\n  updateArc() {\r\n    if (this.config.knobType !== 'arc') {\r\n      return\r\n    }\r\n\r\n    const scaled = (this.value - this.config.min) / (this.config.max - this.config.min);\r\n    const angle = this.startAngle + scaled * this.arcLength;\r\n\r\n    const path = this.describeArc(this.centerX, this.centerY, this.radius, this.startAngle, angle);\r\n    this.progressArcRef?.nativeElement.setAttribute('d', path);\r\n\r\n    const pos = this.polarToCartesian(this.centerX, this.centerY, this.radius, angle);\r\n    this.handleRef?.nativeElement.setAttribute('cx', pos.x.toString());\r\n    this.handleRef?.nativeElement.setAttribute('cy', pos.y.toString());\r\n\r\n    // for tooltip\r\n    const angleRad = (angle - 90) * Math.PI / 180;\r\n    const tooltipRadius = this.radius + this.config.strokeWidth / 2 + 10;\r\n    this.tooltipX = this.centerX + tooltipRadius * Math.cos(angleRad);\r\n    this.tooltipY = this.centerY + tooltipRadius * Math.sin(angleRad);\r\n  }\r\n\r\n  /**\r\n   * return maximum value out of min & max range\r\n   * @param val\r\n   * @param min\r\n   * @param max\r\n   * @returns\r\n   */\r\n  clamp(val: number, min: number, max: number): number {\r\n    return Math.max(min, Math.min(max, val));\r\n  }\r\n\r\n  /**\r\n   * getting calulated  point from polar coordinates to cartesian coordinates\r\n   * @param cx\r\n   * @param cy\r\n   * @param r\r\n   * @param angleDeg\r\n   * @returns\r\n   */\r\n  polarToCartesian(cx: number, cy: number, r: number, angleDeg: number) {\r\n    const angleRad = (angleDeg - 90) * Math.PI / 180;\r\n    return {\r\n      x: cx + r * Math.cos(angleRad),\r\n      y: cy + r * Math.sin(angleRad)\r\n    };\r\n  }\r\n\r\n  /**\r\n   * getting radius for arc handle based on stroke width\r\n   * @returns\r\n   */\r\n  getRadius() {\r\n    return this.config.strokeWidth ? (this.config.strokeWidth / 2) - ((this.config.handleBorderWidth ?? 0) / 2) : 4;\r\n  }\r\n\r\n  /**\r\n   * getting svg box size based on different knob shapes\r\n   * @returns\r\n   */\r\n  getSvgViewBoxSize() {\r\n    let width = this.config.size, height = this.config.size;\r\n    if (this.config.knobType === 'horizontal') {\r\n      height = this.config.strokeWidth + 40;\r\n    }\r\n    if (this.config.knobType === 'vertical') {\r\n      height = this.config.size / 4 + 5\r\n      width = this.config.strokeWidth + 40;\r\n    }\r\n    return '0 0 ' + width + ' ' + height\r\n  }\r\n\r\n  /**\r\n   * geeting dynamic bg color for progress stroke based on provide config for \"progressBackground\"\r\n   */\r\n  get progressColor(): string {\r\n    if (typeof this.config.progressBackground === 'string') {\r\n      return this.config.progressBackground;\r\n    } else\r\n      if ((this.config.progressBackground as string[])?.length == 1) {\r\n        return this.config.progressBackground[0];\r\n      } else\r\n        if ((this.config.progressBackground as string[]).length > 1) {\r\n          return this.config.progressBackground[Math.ceil(this.value / this.changeColorAfter) - 1]\r\n        } else {\r\n          return 'green'\r\n        }\r\n  }\r\n\r\n  /**\r\n   * getting coordinates for arc based on provided inputs\r\n   * @param cx\r\n   * @param cy\r\n   * @param r\r\n   * @param start\r\n   * @param end\r\n   * @returns\r\n   */\r\n  describeArc(cx: number, cy: number, r: number, start: number, end: number): string {\r\n    const startPos = this.polarToCartesian(cx, cy, r, end);\r\n    const endPos = this.polarToCartesian(cx, cy, r, start);\r\n    const largeArc = end - start <= 180 ? 0 : 1;\r\n\r\n    return [\r\n      \"M\", startPos.x, startPos.y,\r\n      \"A\", r, r, 0, largeArc, 0, endPos.x, endPos.y\r\n    ].join(\" \");\r\n  }\r\n\r\n  /**\r\n   * getting calculated angle for arc progress based on provided input\r\n   * @param x\r\n   * @param y\r\n   * @returns\r\n   */\r\n  getAngleFromPoint(x: number, y: number): number | null {\r\n    const dx = x - this.centerX;\r\n    if (dx === 0) {\r\n      return null;\r\n    }\r\n    const dy = y - this.centerY;\r\n\r\n    let angle = Math.atan2(dy, dx) * 180 / Math.PI + 90;\r\n    if (angle < 0) angle += 360;\r\n\r\n    const normalizedStart = this.startAngle % 360;\r\n    let delta = angle - normalizedStart;\r\n    if (delta < 0) delta += 360;\r\n\r\n    if (delta > this.arcLength) return null;\r\n\r\n    return this.startAngle + delta;\r\n  }\r\n\r\n  /**\r\n   * increment value on click on button\r\n   * @returns\r\n   */\r\n  increment() {\r\n    if (this.config.disabled || this.config.readOnly) return;\r\n    this.value = this.clamp((this.value + this.config.step), this.config.min, this.config.max);\r\n    this.updateArc();\r\n    this.onChange(this.value);\r\n    this.onTouched();\r\n  }\r\n\r\n  /**\r\n   * decrement value on click on button\r\n   * @returns\r\n   */\r\n  decrement() {\r\n    if (this.config.disabled || this.config.readOnly) return;\r\n    this.value = this.clamp((this.value - this.config.step), this.config.min, this.config.max);\r\n    this.updateArc();\r\n    this.onChange(this.value);\r\n    this.onTouched();\r\n  }\r\n  /**\r\n   * change value using arrow keys for accessibility\r\n   * @param event\r\n   * @returns\r\n   */\r\n  onKeyDown(event: KeyboardEvent) {\r\n    if (this.config.readOnly || this.config.disabled) return;\r\n\r\n    if (event.key === 'ArrowRight' || event.key === 'ArrowUp') {\r\n      this.increment();\r\n      event.preventDefault();\r\n    } else if (event.key === 'ArrowLeft' || event.key === 'ArrowDown') {\r\n      this.decrement();\r\n      event.preventDefault();\r\n    }\r\n  }\r\n  /**\r\n   * geeting arc coordinated for range selection mode\r\n   * @returns\r\n   */\r\n  getRangeArcPath(): string {\r\n    const startAngle = this.startAngle + (this.config.rangeStartValue / (this.config.max - this.config.min)) * (this.endAngle - this.startAngle);\r\n    const endAngle = this.startAngle + (this.config.rangeEndValue / (this.config.max - this.config.min)) * (this.endAngle - this.startAngle);\r\n    return this.describeArc(this.centerX, this.centerY, this.radius, startAngle, endAngle);\r\n  }\r\n\r\n  /**\r\n   * handling mousedown when range mode is enabled\r\n   * @param event\r\n   * @param handleType\r\n   * @returns\r\n   */\r\n  onHandleMouseDown(event: MouseEvent, handleType: 'start' | 'end') {\r\n    if (this.config.disabled || this.config.readOnly) return;\r\n    this.activeHandle = handleType;\r\n    this.startDrag();\r\n  }\r\n\r\n  /**\r\n   * getting x & y to update handle position when dragging\r\n   * @param value\r\n   * @returns\r\n   */\r\n  getHandlePosition(value: number): { x: number, y: number } {\r\n    const scaled = (value - this.config.min) / (this.config.max - this.config.min);\r\n    const angle = this.startAngle + scaled * this.arcLength;\r\n    const pos = this.polarToCartesian(this.centerX, this.centerY, this.radius, angle);\r\n    return pos;\r\n  }\r\n\r\n  /**\r\n   * geeting handle position for  horizontal line\r\n   * @param value\r\n   * @returns\r\n   */\r\n  getHorizontalHandleX(value: number): number {\r\n    const usableWidth = this.config.size - 2 * this.config.strokeWidth;\r\n    const ratio = (value - this.config.min) / (this.config.max - this.config.min);\r\n    return this.config.strokeWidth + usableWidth * ratio;\r\n  }\r\n\r\n  /**\r\n   * geeting start position for  horizontal line\r\n   * @param value\r\n   * @returns\r\n   */\r\n  getHorizontalLineStartX(): number {\r\n    return this.getHorizontalHandleX(this.config.isRangeMode ? this.config.rangeStartValue : this.config.min);\r\n  }\r\n\r\n  /**\r\n   * geeting end position for  horizontal line\r\n   * @param value\r\n   * @returns\r\n   */\r\n  getHorizontalLineEndX(): number {\r\n    return this.getHorizontalHandleX(this.config.isRangeMode ? this.config.rangeEndValue : this.value);\r\n  }\r\n\r\n  /**\r\n   * geeting handle position for  vertical line\r\n   * @param value\r\n   * @returns\r\n   */\r\n  getVerticalHandleY(value: number): number {\r\n    const usableHeight = this.config.size - 2 * this.config.strokeWidth;\r\n    const ratio = 1 - (value - this.config.min) / (this.config.max - this.config.min);\r\n    return this.config.strokeWidth + usableHeight * ratio;\r\n  }\r\n\r\n  /**\r\n   * geeting start position for  vertical line\r\n   * @param value\r\n   * @returns\r\n   */\r\n  getVerticalLineStartY(): number {\r\n    return this.getVerticalHandleY(this.config.isRangeMode ? this.config.rangeEndValue : this.value);\r\n  }\r\n\r\n  /**\r\n   * get output to be emitted based on range mode\r\n   * @returns\r\n   */\r\n  getEventOutput() {\r\n    if (this.config.isRangeMode) {\r\n      return { start: this.config.rangeStartValue, end: this.config.rangeEndValue };\r\n    }\r\n    return this.value;\r\n  }\r\n\r\n  /**\r\n   * get correct page label from object\r\n   * @param labelName\r\n   * @returns string\r\n   */\r\n  getLabel(labelName: string): string {\r\n    return (DEFAULT_LABELS as any)[labelName] || '';\r\n  }\r\n\r\n\r\n  // component end\r\n}\r\n","<div class=\"knob-container {{customTheme}}\" [style.width.px]=\"config.size\">\r\n  <svg [ngClass]=\"{ 'hover-animate': config.animateOnHover }\" [attr.viewBox]=\"getSvgViewBoxSize()\"\r\n    (click)=\"onSvgClick($event)\" [style.cursor]=\"(config.readOnly || config.disabled) ? 'not-allowed' : 'pointer'\"\r\n    [class.disabled]=\"config.disabled\" [class.read-only]=\"config.readOnly\"\r\n    (mouseenter)=\"showTooltip = true; hovering=true; rucEvent.emit({eventName: 'hover'})\"\r\n    (mouseleave)=\"showTooltip = false; hovering=false\" (focus)=\"rucEvent.emit({eventName: 'focus'})\"\r\n    (blur)=\"rucEvent.emit({eventName: 'blur'})\" (keydown)=\"onKeyDown($event)\" [attr.role]=\"'slider'\"\r\n    [attr.aria-valuemin]=\"config.min\" [attr.aria-valuemax]=\"config.max\" [attr.aria-valuenow]=\"value\"\r\n    [attr.aria-disabled]=\"config.disabled\">\r\n    @switch (config.knobType) {\r\n      <!-- arc knob -->\r\n      @case ('arc') {\r\n        <ng-container>\r\n          <!-- glow effect -->\r\n          <defs>\r\n            <filter id=\"glow\" x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\">\r\n              <feDropShadow dx=\"0\" dy=\"0\" stdDeviation=\"4\" [attr.flood-color]=\"config.strokeBackground\"\r\n                flood-opacity=\"0.75\" />\r\n            </filter>\r\n          </defs>\r\n          <!-- arc main stroke -->\r\n          <path #bgArc fill=\"none\" class=\"main-path\" [attr.stroke]=\"config.strokeBackground\"\r\n            [attr.stroke-width]=\"config.strokeWidth\" [attr.stroke-linecap]=\"config.roundedCorner ? 'round' : ''\" />\r\n          <!-- arc progress stroke - single handle -->\r\n          @if (!config.isRangeMode) {\r\n            <path #progressArc fill=\"none\" class=\"progress-path\" [attr.stroke]=\"progressColor\"\r\n              [attr.stroke-width]=\"config.strokeWidth\" [attr.stroke-linecap]=\"config.roundedCorner ? 'round' : ''\" />\r\n          }\r\n          <!-- arc - single handle -->\r\n          @if (!config.isRangeMode) {\r\n            <circle #handle class=\"handle\" [attr.r]=\"getRadius()\"\r\n              [attr.fill]=\"config.showHandle ? config.handleBackground : 'transparent'\"\r\n              [attr.stroke-width]=\"config.showHandle ? config.handleBorderWidth : 0\"\r\n              [attr.stroke]=\"config.showHandle ? config.handleBorderColor : 'transparent'\" (mousedown)=\"startDrag()\"\r\n              (touchstart)=\"startDrag()\" />\r\n          }\r\n          <!-- arc progress stroke - dual handle for range -->\r\n          @if (config.isRangeMode) {\r\n            <path [attr.d]=\"getRangeArcPath()\" [attr.stroke]=\"progressColor\"\r\n              [attr.stroke-width]=\"config.strokeWidth\" fill=\"none\" stroke-linecap=\"round\" />\r\n          }\r\n          <!-- arc dual handle - start -->\r\n          @if (config.isRangeMode) {\r\n            <circle [attr.cx]=\"getHandlePosition(config.rangeStartValue).x\"\r\n              [attr.cy]=\"getHandlePosition(config.rangeStartValue).y\" [attr.r]=\"getRadius()\"\r\n              [attr.fill]=\"config.handleBackground\" [attr.stroke-width]=\"config.handleBorderWidth\"\r\n              [attr.stroke]=\"config.handleBorderColor\" (mousedown)=\"onHandleMouseDown($event, 'start')\" />\r\n          }\r\n          <!-- arc dual handle - end -->\r\n          @if (config.isRangeMode) {\r\n            <circle [attr.cx]=\"getHandlePosition(config.rangeEndValue).x\"\r\n              [attr.cy]=\"getHandlePosition(config.rangeEndValue).y\" [attr.r]=\"getRadius()\"\r\n              [attr.fill]=\"config.handleBackground\" [attr.stroke-width]=\"config.handleBorderWidth\"\r\n              [attr.stroke]=\"config.handleBorderColor\" (mousedown)=\"onHandleMouseDown($event, 'end')\" />\r\n          }\r\n        </ng-container>\r\n      }\r\n      <!-- horizontal line -->\r\n      @case ('horizontal') {\r\n        <ng-container>\r\n          <line #horizontalLine [attr.x1]=\"config.strokeWidth\" [attr.x2]=\"config.size\" [attr.y1]=\"config.strokeWidth + 10\"\r\n            [attr.y2]=\"config.strokeWidth + 10\" [attr.stroke]=\"config.strokeBackground\"\r\n            [attr.stroke-width]=\"config.strokeWidth\" [attr.line-cap]=\"config.roundedCorner ? 'round' : ''\" />\r\n          <!-- progress for horizontal line -->\r\n          <line [attr.x1]=\"getHorizontalLineStartX()\" [attr.x2]=\"getHorizontalLineEndX()\"\r\n            [attr.y1]=\"config.strokeWidth + 10\" [attr.y2]=\"config.strokeWidth + 10\" [attr.stroke]=\"progressColor\"\r\n            [attr.stroke-width]=\"config.strokeWidth\" />\r\n          <!-- handle for horizontal line -->\r\n          @if (!config.isRangeMode) {\r\n            <rect [attr.x]=\"getHorizontalHandleX(value)\"\r\n              [attr.y]=\"config.strokeWidth + 10 - getRadius()-1\" [attr.width]=\"config.strokeWidth\"\r\n              [attr.height]=\"config.strokeWidth\"\r\n              [attr.fill]=\"config.handleBackground ? config.handleBackground : progressColor\" (mousedown)=\"startDrag()\"\r\n              (touchstart)=\"startDrag()\" />\r\n          }\r\n        </ng-container>\r\n      }\r\n      <!-- vertical line -->\r\n      @case ('vertical') {\r\n        <ng-container>\r\n          <line #verticalLine [attr.y1]=\"config.strokeWidth/4\" [attr.y2]=\"config.size/4\" [attr.x1]=\"config.strokeWidth + 10\"\r\n            [attr.x2]=\"config.strokeWidth + 10\" [attr.stroke]=\"config.strokeBackground\"\r\n            [attr.stroke-width]=\"config.strokeWidth/4\" [attr.line-cap]=\"config.roundedCorner ? 'round' : ''\" />\r\n          <!-- progress for vertical line -->\r\n          <line [attr.y1]=\"getVerticalLineStartY()/4\" [attr.y2]=\"config.size/4\" [attr.x1]=\"config.strokeWidth + 10\"\r\n            [attr.x2]=\"config.strokeWidth + 10\" [attr.stroke]=\"progressColor\" [attr.stroke-width]=\"config.strokeWidth/4\" />\r\n          <!-- Handle for vertical line -->\r\n          @if (!config.isRangeMode) {\r\n            <rect [attr.y]=\"getVerticalHandleY(value)/4\" [attr.x]=\"config.strokeWidth + 7.5\"\r\n              [attr.width]=\"config.strokeWidth/4\" [attr.height]=\"config.strokeWidth/4\"\r\n              [attr.fill]=\"config.handleBackground ? config.handleBackground : progressColor\" (mousedown)=\"startDrag()\"\r\n              (touchstart)=\"startDrag()\" />\r\n          }\r\n        </ng-container>\r\n      }\r\n    }\r\n  </svg>\r\n\r\n  <!-- tooltip -->\r\n  @if (config.enableTooltip && !config.isRangeMode) {\r\n    <div class=\"tooltip\" [class.show]=\"showTooltip\"\r\n      [style.left.px]=\"tooltipX\" [style.top.px]=\"tooltipY\">\r\n      {{ value}}\r\n    </div>\r\n  }\r\n\r\n  <!-- progress value -->\r\n  <div class=\"progress-value {{config.knobType}}\" [style.maxWidth.px]=\"config.size * 2 - 50\"\r\n    [style.color]=\"config.valueColor\" [style.fontSize.px]=\"config.valueSize\" [style.fontWeight]=\"config.valueWeight\"\r\n    [style.cursor]=\"(config.readOnly || config.disabled) ? 'not-allowed' : ''\" [class.disabled]=\"config.disabled\"\r\n    [class.read-only]=\"config.readOnly\" title=\"{{config.valuePrefix +''+value+''+config.valueSuffix}}\">\r\n    @if (!config.isRangeMode) {\r\n      <span class=\"value-prefix\">{{config.valuePrefix}}</span>\r\n      <span class=\"value\">{{ value }}</span>\r\n      <span class=\"value-suffix\">{{config.valueSuffix}}</span>\r\n    }\r\n    @if (config.isRangeMode) {\r\n      <span class=\"value\">{{config.rangeStartValue}} : {{config.rangeEndValue}}</span>\r\n    }\r\n  </div>\r\n\r\n  <!-- increment-decrement button -->\r\n  @if (!config.isRangeMode && config.showButtons) {\r\n    <div class=\"arc-buttons\">\r\n      <button mat-mini-fab color=\"secondary\" (click)=\"decrement()\" [disabled]=\"config.disabled || config.readOnly\" (keydown)=\"onKeyDown($event)\"\r\n        [attr.aria-label]=\"getLabel('decrementButton')\">\r\n        <mat-icon>remove</mat-icon>\r\n      </button>\r\n      <button mat-mini-fab color=\"secondary\" (click)=\"increment()\" [disabled]=\"config.disabled || config.readOnly\" (keydown)=\"onKeyDown($event)\"\r\n        [attr.aria-label]=\"getLabel('incrementButton')\">\r\n        <mat-icon>add</mat-icon>\r\n      </button>\r\n    </div>\r\n  }\r\n</div>\r\n","// interface for reusable knob component\r\nexport interface KnobConfig {\r\n\r\n  /**\r\n   * Defines the minimum value of the knob.\r\n   * @type {number}\r\n   * @default 0\r\n   */\r\n  min?: number;\r\n\r\n  /**\r\n   * Defines the maximum value of the knob.\r\n   * @type {number}\r\n   * @default 100\r\n   */\r\n  max?: number;\r\n\r\n  /**\r\n   * Defines the step size for incrementing/decrementing the knob value.\r\n   * @type {number}\r\n   * @default 1\r\n   */\r\n  step?: number;\r\n\r\n  /**\r\n   * Defines the size (width and height) of the knob in pixels.\r\n   * @type {number}\r\n   * @default 150\r\n   */\r\n  size?: number;\r\n\r\n  /**\r\n   * Defines the color of the displayed value.\r\n   * @type {string}\r\n   * @default ''\r\n   */\r\n  valueColor?: string;\r\n\r\n  /**\r\n  * Defines the font weight of the displayed value.\r\n  * @type {string}\r\n  * @default 'normal'\r\n  */\r\n  valueWeight?: string;\r\n\r\n  /**\r\n   * Defines the font size of the displayed value in pixels.\r\n   * @type {number}\r\n   * @default 20\r\n   */\r\n  valueSize?: number;\r\n\r\n  /**\r\n  * Defines the background color of the knob's stroke.\r\n  * @type {string}\r\n  * @default 'lightblue'\r\n  */\r\n  strokeBackground?: string;\r\n\r\n  /**\r\n  * Defines the background color of the progress stroke. Can be a single color or an array of colors for gradient.\r\n  * @type {string | string[]}\r\n  * @default 'blue'\r\n  */\r\n  progressBackground?: string | string[];\r\n\r\n  /**\r\n   * Defines the width of the knob's stroke in pixels.\r\n   * @type {number}\r\n   * @default 15\r\n   */\r\n  strokeWidth?: number;\r\n\r\n  /**\r\n   * Specifies whether the corners of the progress stroke should be rounded.\r\n   * @type {boolean}\r\n   * @default true\r\n   */\r\n  roundedCorner?: boolean;\r\n\r\n  /**\r\n   * Specifies whether a handle should be displayed on the knob.\r\n   * @type {boolean}\r\n   * @default true\r\n   */\r\n  showHandle?: boolean;\r\n\r\n  /* Defines the background color of the handle.\r\n  * @type {string}\r\n  * @default 'lightblue'\r\n  */\r\n  handleBackground?: string;\r\n\r\n  /**\r\n   * Defines the border color of the handle.\r\n   * @type {string}\r\n   * @default 'blue'\r\n   */\r\n  handleBorderColor?: string;\r\n\r\n  /**\r\n   * Defines the border width of the handle.\r\n   * @type {number}\r\n   * @default 4\r\n   */\r\n  handleBorderWidth?: number;\r\n\r\n\r\n  /**\r\n     * Defines the prefix for the displayed value (e.g., '$').\r\n     * @type {string}\r\n     * @default ''\r\n     */\r\n  valuePrefix?: string;\r\n\r\n  /**\r\n   * Defines the suffix for the displayed value (e.g., '%').\r\n   * @type {string}\r\n   * @default ''\r\n   */\r\n  valueSuffix?: string;\r\n\r\n  /**\r\n   * Specifies whether the knob is read-only.\r\n   * @type {boolean}\r\n   * @default false\r\n   */\r\n  readOnly?: boolean;\r\n\r\n\r\n  /**\r\n     * Specifies whether the knob is disabled.\r\n     * @type {boolean}\r\n     * @default false\r\n     */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * Specifies whether a tooltip should be enabled for the knob.\r\n   * @type {boolean}\r\n   * @default false\r\n   */\r\n  enableTooltip?: boolean;\r\n\r\n  /**\r\n   * Specifies whether the knob animates on hover.\r\n   * @type {boolean}\r\n   * @default false\r\n   */\r\n  animateOnHover?: boolean;\r\n\r\n  /**\r\n   * Specifies whether the knob operates in range mode, allowing selection of a value range.\r\n   * @type {boolean}\r\n   * @default false\r\n   */\r\n  isRangeMode?: boolean;\r\n\r\n  /**\r\n   * Defines the starting value for the range when `isRangeMode` is true.\r\n   * @type {number}\r\n   * @default 25\r\n   */\r\n  rangeStartValue?: number;\r\n\r\n  /**\r\n   * Defines the ending value for the range when `isRangeMode` is true.\r\n   * @type {number}\r\n   * @default 75\r\n   */\r\n  rangeEndValue?: number;\r\n\r\n  /**\r\n   * Specifies whether increment/decrement buttons should be shown.\r\n   * @type {boolean}\r\n   * @default false\r\n   */\r\n  showButtons?: boolean;\r\n\r\n  /**\r\n   * Defines the type of knob.\r\n   * @type {'arc' | 'horizontal' | 'vertical'}\r\n   * @default 'arc'\r\n   */\r\n  knobType?: 'arc' | 'horizontal' | 'vertical';\r\n};\r\n\r\nexport interface KnobRangeValue { start: number, end: number }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -1,3 +1,436 @@
-export * from './lib/ruclib-knob.module';
-export * from './lib/ruclib-knob/ruclib-knob.component';
-export * from './models/knob.interface';
+import * as i0 from '@angular/core';
+import { OnInit, AfterViewInit, OnChanges, ElementRef, EventEmitter, ChangeDetectorRef, SimpleChanges } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+
+interface KnobConfig {
+    /**
+     * Defines the minimum value of the knob.
+     * @type {number}
+     * @default 0
+     */
+    min?: number;
+    /**
+     * Defines the maximum value of the knob.
+     * @type {number}
+     * @default 100
+     */
+    max?: number;
+    /**
+     * Defines the step size for incrementing/decrementing the knob value.
+     * @type {number}
+     * @default 1
+     */
+    step?: number;
+    /**
+     * Defines the size (width and height) of the knob in pixels.
+     * @type {number}
+     * @default 150
+     */
+    size?: number;
+    /**
+     * Defines the color of the displayed value.
+     * @type {string}
+     * @default ''
+     */
+    valueColor?: string;
+    /**
+    * Defines the font weight of the displayed value.
+    * @type {string}
+    * @default 'normal'
+    */
+    valueWeight?: string;
+    /**
+     * Defines the font size of the displayed value in pixels.
+     * @type {number}
+     * @default 20
+     */
+    valueSize?: number;
+    /**
+    * Defines the background color of the knob's stroke.
+    * @type {string}
+    * @default 'lightblue'
+    */
+    strokeBackground?: string;
+    /**
+    * Defines the background color of the progress stroke. Can be a single color or an array of colors for gradient.
+    * @type {string | string[]}
+    * @default 'blue'
+    */
+    progressBackground?: string | string[];
+    /**
+     * Defines the width of the knob's stroke in pixels.
+     * @type {number}
+     * @default 15
+     */
+    strokeWidth?: number;
+    /**
+     * Specifies whether the corners of the progress stroke should be rounded.
+     * @type {boolean}
+     * @default true
+     */
+    roundedCorner?: boolean;
+    /**
+     * Specifies whether a handle should be displayed on the knob.
+     * @type {boolean}
+     * @default true
+     */
+    showHandle?: boolean;
+    handleBackground?: string;
+    /**
+     * Defines the border color of the handle.
+     * @type {string}
+     * @default 'blue'
+     */
+    handleBorderColor?: string;
+    /**
+     * Defines the border width of the handle.
+     * @type {number}
+     * @default 4
+     */
+    handleBorderWidth?: number;
+    /**
+       * Defines the prefix for the displayed value (e.g., '$').
+       * @type {string}
+       * @default ''
+       */
+    valuePrefix?: string;
+    /**
+     * Defines the suffix for the displayed value (e.g., '%').
+     * @type {string}
+     * @default ''
+     */
+    valueSuffix?: string;
+    /**
+     * Specifies whether the knob is read-only.
+     * @type {boolean}
+     * @default false
+     */
+    readOnly?: boolean;
+    /**
+       * Specifies whether the knob is disabled.
+       * @type {boolean}
+       * @default false
+       */
+    disabled?: boolean;
+    /**
+     * Specifies whether a tooltip should be enabled for the knob.
+     * @type {boolean}
+     * @default false
+     */
+    enableTooltip?: boolean;
+    /**
+     * Specifies whether the knob animates on hover.
+     * @type {boolean}
+     * @default false
+     */
+    animateOnHover?: boolean;
+    /**
+     * Specifies whether the knob operates in range mode, allowing selection of a value range.
+     * @type {boolean}
+     * @default false
+     */
+    isRangeMode?: boolean;
+    /**
+     * Defines the starting value for the range when `isRangeMode` is true.
+     * @type {number}
+     * @default 25
+     */
+    rangeStartValue?: number;
+    /**
+     * Defines the ending value for the range when `isRangeMode` is true.
+     * @type {number}
+     * @default 75
+     */
+    rangeEndValue?: number;
+    /**
+     * Specifies whether increment/decrement buttons should be shown.
+     * @type {boolean}
+     * @default false
+     */
+    showButtons?: boolean;
+    /**
+     * Defines the type of knob.
+     * @type {'arc' | 'horizontal' | 'vertical'}
+     * @default 'arc'
+     */
+    knobType?: 'arc' | 'horizontal' | 'vertical';
+}
+interface KnobRangeValue {
+    start: number;
+    end: number;
+}
+
+declare class RuclibKnobComponent implements ControlValueAccessor, OnInit, AfterViewInit, OnChanges {
+    private cdr;
+    bgArcRef: ElementRef<SVGPathElement>;
+    progressArcRef: ElementRef<SVGPathElement>;
+    handleRef: ElementRef<SVGCircleElement>;
+    horizontalLineRef: ElementRef<SVGLineElement>;
+    verticalLineRef: ElementRef<SVGLineElement>;
+    rucEvent: EventEmitter<any>;
+    customTheme?: string;
+    rucInputData: KnobConfig;
+    activeHandle: 'start' | 'end' | '';
+    value: number;
+    dragging: boolean;
+    centerX: number;
+    centerY: number;
+    radius: number;
+    startAngle: number;
+    endAngle: number;
+    arcLength: number;
+    changeColorAfter: number;
+    tooltipX: number;
+    tooltipY: number;
+    showTooltip: boolean;
+    hovering: boolean;
+    config: {
+        min: number;
+        max: number;
+        step: number;
+        size: number;
+        valueColor: string;
+        strokeBackground: string;
+        progressBackground: string | string[];
+        strokeWidth: number;
+        valueSize: number;
+        valueWeight: string;
+        showHandle: boolean;
+        handleBackground: string;
+        handleBorderColor: string;
+        handleBorderWidth: number;
+        roundedCorner: boolean;
+        valuePrefix: string;
+        valueSuffix: string;
+        readOnly: boolean;
+        disabled: boolean;
+        enableTooltip: boolean;
+        animateOnHover: boolean;
+        isRangeMode: boolean;
+        rangeStartValue: number;
+        rangeEndValue: number;
+        showButtons: boolean;
+        knobType: "horizontal" | "vertical" | "arc";
+    };
+    private onTouched;
+    private onChange;
+    constructor(cdr: ChangeDetectorRef);
+    /**
+     * handling form control binding to write value
+     * @param val
+     */
+    writeValue(val: number): void;
+    /**
+     * registering onChange method to use as form control
+     * @param fn
+     */
+    registerOnChange(fn: () => void): void;
+    /**
+     * registering onTouch method to use as form control
+     * @param fn
+     */
+    registerOnTouched(fn: () => void): void;
+    /**
+     * registering disabled state
+     * @param isDisabled
+     */
+    setDisabledState(isDisabled: boolean): void;
+    /**
+     * handling input data changes
+     * updating default config with user provided config
+     * @param changes
+     */
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * handling change on component initilization
+     */
+    ngOnInit(): void;
+    /**
+     * handling change after view initilization
+     */
+    ngAfterViewInit(): void;
+    /**
+     * handling change when dragin on svg
+     * @returns
+     */
+    startDrag(): void;
+    /**
+     * rounding value to increment or decrement based on provide config value for step
+     * @param value
+     * @returns
+     */
+    roundToStep(value: number): number;
+    /**
+     * adjusting default value within min & max value when its provide out of range
+     */
+    adjustDefaultValue(): void;
+    /**
+     * handle changes on mouseUp and touchEnd event
+     */
+    stopDrag(): void;
+    /**
+     * handle changes on mouseMove and touch event
+     * @param event
+     * @returns
+     */
+    onMove(event: MouseEvent | TouchEvent): void;
+    /**
+     * handling change on main svg click
+     * @param event
+     * @returns
+     */
+    onSvgClick(event: MouseEvent | TouchEvent): void;
+    /**
+     * get ref of active svg element for different type of knobs
+     * @returns
+     */
+    getTargetSvg(): SVGElement | null;
+    /**
+     * updating progrees value while dragging the handle on stroke bar
+     * @param e
+     * @returns
+     */
+    setProgressFromEvent(e: MouseEvent | TouchEvent): void;
+    /**
+     * updating svg progress based on value changes
+     * @returns
+     */
+    updateArc(): void;
+    /**
+     * return maximum value out of min & max range
+     * @param val
+     * @param min
+     * @param max
+     * @returns
+     */
+    clamp(val: number, min: number, max: number): number;
+    /**
+     * getting calulated  point from polar coordinates to cartesian coordinates
+     * @param cx
+     * @param cy
+     * @param r
+     * @param angleDeg
+     * @returns
+     */
+    polarToCartesian(cx: number, cy: number, r: number, angleDeg: number): {
+        x: number;
+        y: number;
+    };
+    /**
+     * getting radius for arc handle based on stroke width
+     * @returns
+     */
+    getRadius(): number;
+    /**
+     * getting svg box size based on different knob shapes
+     * @returns
+     */
+    getSvgViewBoxSize(): string;
+    /**
+     * geeting dynamic bg color for progress stroke based on provide config for "progressBackground"
+     */
+    get progressColor(): string;
+    /**
+     * getting coordinates for arc based on provided inputs
+     * @param cx
+     * @param cy
+     * @param r
+     * @param start
+     * @param end
+     * @returns
+     */
+    describeArc(cx: number, cy: number, r: number, start: number, end: number): string;
+    /**
+     * getting calculated angle for arc progress based on provided input
+     * @param x
+     * @param y
+     * @returns
+     */
+    getAngleFromPoint(x: number, y: number): number | null;
+    /**
+     * increment value on click on button
+     * @returns
+     */
+    increment(): void;
+    /**
+     * decrement value on click on button
+     * @returns
+     */
+    decrement(): void;
+    /**
+     * change value using arrow keys for accessibility
+     * @param event
+     * @returns
+     */
+    onKeyDown(event: KeyboardEvent): void;
+    /**
+     * geeting arc coordinated for range selection mode
+     * @returns
+     */
+    getRangeArcPath(): string;
+    /**
+     * handling mousedown when range mode is enabled
+     * @param event
+     * @param handleType
+     * @returns
+     */
+    onHandleMouseDown(event: MouseEvent, handleType: 'start' | 'end'): void;
+    /**
+     * getting x & y to update handle position when dragging
+     * @param value
+     * @returns
+     */
+    getHandlePosition(value: number): {
+        x: number;
+        y: number;
+    };
+    /**
+     * geeting handle position for  horizontal line
+     * @param value
+     * @returns
+     */
+    getHorizontalHandleX(value: number): number;
+    /**
+     * geeting start position for  horizontal line
+     * @param value
+     * @returns
+     */
+    getHorizontalLineStartX(): number;
+    /**
+     * geeting end position for  horizontal line
+     * @param value
+     * @returns
+     */
+    getHorizontalLineEndX(): number;
+    /**
+     * geeting handle position for  vertical line
+     * @param value
+     * @returns
+     */
+    getVerticalHandleY(value: number): number;
+    /**
+     * geeting start position for  vertical line
+     * @param value
+     * @returns
+     */
+    getVerticalLineStartY(): number;
+    /**
+     * get output to be emitted based on range mode
+     * @returns
+     */
+    getEventOutput(): number | {
+        start: number;
+        end: number;
+    };
+    /**
+     * get correct page label from object
+     * @param labelName
+     * @returns string
+     */
+    getLabel(labelName: string): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RuclibKnobComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RuclibKnobComponent, "uxp-ruclib-knob", never, { "customTheme": { "alias": "customTheme"; "required": false; }; "rucInputData": { "alias": "rucInputData"; "required": false; }; }, { "rucEvent": "rucEvent"; }, never, never, true, never>;
+}
+
+export { RuclibKnobComponent };
+export type { KnobConfig, KnobRangeValue };

package/package.json

@@ -1,25 +1,22 @@
 {
   "name": "@ruc-lib/knob",
-  "version": "2.0.0",
-  "license": "MIT",
+  "version": "3.1.0",
   "peerDependencies": {
-    "@angular/common": "^17.0.0 || ^16.0.0 || ^15.0.0",
-    "@angular/core": "^17.0.0 || ^16.0.0 || ^15.0.0",
-    "@angular/material": "^15.2.9 || ^14.0.0 || ^13.0.0",
-    "@angular/forms": "15.2.10"
+    "@angular/common": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/core": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/material": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/platform-browser": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/animations": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "@angular/forms": "^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^20.0.0",
+    "ngx-pagination": "^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0",
+    "rxjs": ">=7.5.0 <8.0.0",
+    "zone.js": "^0.13.0 || ^0.14.0"
   },
   "dependencies": {
     "tslib": "^2.3.0"
   },
-  "publishConfig": {
-    "access": "public"
-  },
   "sideEffects": false,
-  "module": "fesm2015/ruc-lib-knob.mjs",
-  "es2020": "fesm2020/ruc-lib-knob.mjs",
-  "esm2020": "esm2020/ruc-lib-knob.mjs",
-  "fesm2020": "fesm2020/ruc-lib-knob.mjs",
-  "fesm2015": "fesm2015/ruc-lib-knob.mjs",
+  "module": "fesm2022/ruc-lib-knob.mjs",
   "typings": "index.d.ts",
   "exports": {
     "./package.json": {
@@ -27,11 +24,7 @@
     },
     ".": {
       "types": "./index.d.ts",
-      "esm2020": "./esm2020/ruc-lib-knob.mjs",
-      "es2020": "./fesm2020/ruc-lib-knob.mjs",
-      "es2015": "./fesm2015/ruc-lib-knob.mjs",
-      "node": "./fesm2015/ruc-lib-knob.mjs",
-      "default": "./fesm2020/ruc-lib-knob.mjs"
+      "default": "./fesm2022/ruc-lib-knob.mjs"
     }
   }
-}
+}

package/esm2020/index.mjs

@@ -1,4 +0,0 @@
-export * from './lib/ruclib-knob.module';
-export * from './lib/ruclib-knob/ruclib-knob.component';
-export * from './models/knob.interface';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL3J1Y2xpYi9rbm9iL3NyYy9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLDBCQUEwQixDQUFDO0FBQ3pDLGNBQWMseUNBQXlDLENBQUM7QUFDeEQsY0FBYyx5QkFBeUIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vbGliL3J1Y2xpYi1rbm9iLm1vZHVsZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3J1Y2xpYi1rbm9iL3J1Y2xpYi1rbm9iLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbW9kZWxzL2tub2IuaW50ZXJmYWNlJztcclxuIl19