ngx-kit 6.1.0 → 6.2.0

package/fesm2022/ngx-kit-angle-selector.mjs

@@ -134,7 +134,7 @@ class NgxAngleSelectorComponent {
                 useExisting: forwardRef(() => NgxAngleSelectorComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "selectorContainer", first: true, predicate: ["selectorContainer"], descendants: true }], ngImport: i0, template: "<div class=\"ngx-input-angle-selector\">\n  <div #selectorContainer class=\"angle-selector\">\n    <div class=\"center-dot\"></div>\n    <div #hand class=\"hand\" [style.transform]=\"'rotate(' + currentAngle() + 'deg)'\"></div>\n\n    @for (angle of tickes; track $index) {\n      <div [style.transform]=\"'rotate(' + angle + 'deg)'\" class=\"tick\"></div>\n    }\n  </div>\n</div>\n", styles: [":host{--ngx-color-bg: #e5e5e5;--ngx-color-text: #000;--border-color: #c8c8c8;--ngx-size: 100px;--handle-color: #007ac6;--tick-color: #444444;--inner-shadow-color: #000000a3}:host-context(.dark){--ngx-color-bg: #222222;--ngx-color-text: #fff;--border-color: #3a3a3a;--tick-color: #595959;--inner-shadow-color: #000}.ngx-input-angle-selector{width:var(--ngx-size, 100);height:var(--ngx-size, 100);border:calc(8 * var(--ngx-size, 100) / 100) var(--border-color) solid;background:var(--ngx-color-bg);color:var(--ngx-color-text);overflow:hidden;box-shadow:0 0 10px #0000005d;margin:14px 4px;border-radius:50%;direction:ltr;font-family:arial,tahoma;box-sizing:border-box}.ngx-input-angle-selector *{box-sizing:border-box}.angle-selector{position:relative;width:100%;height:100%;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;box-shadow:inset 0 0 20px 0 var(--inner-shadow-color)}.center-dot{width:15px;height:15px;background:var(--handle-color);border-radius:50%;z-index:10;box-shadow:0 0 20px #303030}.hand{position:absolute;width:4px;height:calc(var(--ngx-size, 100) * .6);box-shadow:0 0 20px #303030;background:var(--handle-color);bottom:50%;transform-origin:bottom center;border-radius:4px;pointer-events:none;z-index:1}.tick{position:absolute;width:2px;height:12%;background:var(--tick-color);left:50%;top:0;transform-origin:50% calc(var(--ngx-size, 100px) / 2 - 8 * var(--ngx-size, 100) / 100)}::ng-deep dialog .ngx-input-angle-selector:before{content:\" \";border:14px var(--border-color) solid;position:absolute;z-index:1;filter:drop-shadow(0px -3px 2px rgba(0,0,0,.2));box-sizing:border-box}::ng-deep dialog.tips-above .ngx-input-angle-selector:before{border-top-color:transparent;border-right-color:transparent;border-left-color:transparent;top:-12px;left:calc(50% - 14px)}::ng-deep dialog.tips-bottom .ngx-input-angle-selector:before{border-bottom-color:transparent;border-right-color:transparent;border-left-color:transparent;bottom:-10px;left:calc(50% - 14px);filter:drop-shadow(0px 4px 2px rgba(0,0,0,.2))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "selectorContainer", first: true, predicate: ["selectorContainer"], descendants: true }], ngImport: i0, template: "<div class=\"ngx-input-angle-selector\">\r\n  <div #selectorContainer class=\"angle-selector\">\r\n    <div class=\"center-dot\"></div>\r\n    <div #hand class=\"hand\" [style.transform]=\"'rotate(' + currentAngle() + 'deg)'\"></div>\r\n\r\n    @for (angle of tickes; track $index) {\r\n      <div [style.transform]=\"'rotate(' + angle + 'deg)'\" class=\"tick\"></div>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{--ngx-color-bg: #e5e5e5;--ngx-color-text: #000;--border-color: #c8c8c8;--ngx-size: 100px;--handle-color: #007ac6;--tick-color: #444444;--inner-shadow-color: #000000a3}:host-context(.dark){--ngx-color-bg: #222222;--ngx-color-text: #fff;--border-color: #3a3a3a;--tick-color: #595959;--inner-shadow-color: #000}.ngx-input-angle-selector{width:var(--ngx-size, 100);height:var(--ngx-size, 100);border:calc(8 * var(--ngx-size, 100) / 100) var(--border-color) solid;background:var(--ngx-color-bg);color:var(--ngx-color-text);overflow:hidden;box-shadow:0 0 10px #0000005d;margin:14px 4px;border-radius:50%;direction:ltr;font-family:arial,tahoma;box-sizing:border-box}.ngx-input-angle-selector *{box-sizing:border-box}.angle-selector{position:relative;width:100%;height:100%;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;box-shadow:inset 0 0 20px 0 var(--inner-shadow-color)}.center-dot{width:15px;height:15px;background:var(--handle-color);border-radius:50%;z-index:10;box-shadow:0 0 20px #303030}.hand{position:absolute;width:4px;height:calc(var(--ngx-size, 100) * .6);box-shadow:0 0 20px #303030;background:var(--handle-color);bottom:50%;transform-origin:bottom center;border-radius:4px;pointer-events:none;z-index:1}.tick{position:absolute;width:2px;height:12%;background:var(--tick-color);left:50%;top:0;transform-origin:50% calc(var(--ngx-size, 100px) / 2 - 8 * var(--ngx-size, 100) / 100)}::ng-deep dialog .ngx-input-angle-selector:before{content:\" \";border:14px var(--border-color) solid;position:absolute;z-index:1;filter:drop-shadow(0px -3px 2px rgba(0,0,0,.2));box-sizing:border-box}::ng-deep dialog.tips-above .ngx-input-angle-selector:before{border-top-color:transparent;border-right-color:transparent;border-left-color:transparent;top:-12px;left:calc(50% - 14px)}::ng-deep dialog.tips-bottom .ngx-input-angle-selector:before{border-bottom-color:transparent;border-right-color:transparent;border-left-color:transparent;bottom:-10px;left:calc(50% - 14px);filter:drop-shadow(0px 4px 2px rgba(0,0,0,.2))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxAngleSelectorComponent, decorators: [{
             type: Component,
@@ -147,7 +147,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
                     ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.dark]': 'theme=="dark"',
                         '[style.--ngx-size]': 'size()+"px"',
-                    }, template: "<div class=\"ngx-input-angle-selector\">\n  <div #selectorContainer class=\"angle-selector\">\n    <div class=\"center-dot\"></div>\n    <div #hand class=\"hand\" [style.transform]=\"'rotate(' + currentAngle() + 'deg)'\"></div>\n\n    @for (angle of tickes; track $index) {\n      <div [style.transform]=\"'rotate(' + angle + 'deg)'\" class=\"tick\"></div>\n    }\n  </div>\n</div>\n", styles: [":host{--ngx-color-bg: #e5e5e5;--ngx-color-text: #000;--border-color: #c8c8c8;--ngx-size: 100px;--handle-color: #007ac6;--tick-color: #444444;--inner-shadow-color: #000000a3}:host-context(.dark){--ngx-color-bg: #222222;--ngx-color-text: #fff;--border-color: #3a3a3a;--tick-color: #595959;--inner-shadow-color: #000}.ngx-input-angle-selector{width:var(--ngx-size, 100);height:var(--ngx-size, 100);border:calc(8 * var(--ngx-size, 100) / 100) var(--border-color) solid;background:var(--ngx-color-bg);color:var(--ngx-color-text);overflow:hidden;box-shadow:0 0 10px #0000005d;margin:14px 4px;border-radius:50%;direction:ltr;font-family:arial,tahoma;box-sizing:border-box}.ngx-input-angle-selector *{box-sizing:border-box}.angle-selector{position:relative;width:100%;height:100%;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;box-shadow:inset 0 0 20px 0 var(--inner-shadow-color)}.center-dot{width:15px;height:15px;background:var(--handle-color);border-radius:50%;z-index:10;box-shadow:0 0 20px #303030}.hand{position:absolute;width:4px;height:calc(var(--ngx-size, 100) * .6);box-shadow:0 0 20px #303030;background:var(--handle-color);bottom:50%;transform-origin:bottom center;border-radius:4px;pointer-events:none;z-index:1}.tick{position:absolute;width:2px;height:12%;background:var(--tick-color);left:50%;top:0;transform-origin:50% calc(var(--ngx-size, 100px) / 2 - 8 * var(--ngx-size, 100) / 100)}::ng-deep dialog .ngx-input-angle-selector:before{content:\" \";border:14px var(--border-color) solid;position:absolute;z-index:1;filter:drop-shadow(0px -3px 2px rgba(0,0,0,.2));box-sizing:border-box}::ng-deep dialog.tips-above .ngx-input-angle-selector:before{border-top-color:transparent;border-right-color:transparent;border-left-color:transparent;top:-12px;left:calc(50% - 14px)}::ng-deep dialog.tips-bottom .ngx-input-angle-selector:before{border-bottom-color:transparent;border-right-color:transparent;border-left-color:transparent;bottom:-10px;left:calc(50% - 14px);filter:drop-shadow(0px 4px 2px rgba(0,0,0,.2))}\n"] }]
+                    }, template: "<div class=\"ngx-input-angle-selector\">\r\n  <div #selectorContainer class=\"angle-selector\">\r\n    <div class=\"center-dot\"></div>\r\n    <div #hand class=\"hand\" [style.transform]=\"'rotate(' + currentAngle() + 'deg)'\"></div>\r\n\r\n    @for (angle of tickes; track $index) {\r\n      <div [style.transform]=\"'rotate(' + angle + 'deg)'\" class=\"tick\"></div>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{--ngx-color-bg: #e5e5e5;--ngx-color-text: #000;--border-color: #c8c8c8;--ngx-size: 100px;--handle-color: #007ac6;--tick-color: #444444;--inner-shadow-color: #000000a3}:host-context(.dark){--ngx-color-bg: #222222;--ngx-color-text: #fff;--border-color: #3a3a3a;--tick-color: #595959;--inner-shadow-color: #000}.ngx-input-angle-selector{width:var(--ngx-size, 100);height:var(--ngx-size, 100);border:calc(8 * var(--ngx-size, 100) / 100) var(--border-color) solid;background:var(--ngx-color-bg);color:var(--ngx-color-text);overflow:hidden;box-shadow:0 0 10px #0000005d;margin:14px 4px;border-radius:50%;direction:ltr;font-family:arial,tahoma;box-sizing:border-box}.ngx-input-angle-selector *{box-sizing:border-box}.angle-selector{position:relative;width:100%;height:100%;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;box-shadow:inset 0 0 20px 0 var(--inner-shadow-color)}.center-dot{width:15px;height:15px;background:var(--handle-color);border-radius:50%;z-index:10;box-shadow:0 0 20px #303030}.hand{position:absolute;width:4px;height:calc(var(--ngx-size, 100) * .6);box-shadow:0 0 20px #303030;background:var(--handle-color);bottom:50%;transform-origin:bottom center;border-radius:4px;pointer-events:none;z-index:1}.tick{position:absolute;width:2px;height:12%;background:var(--tick-color);left:50%;top:0;transform-origin:50% calc(var(--ngx-size, 100px) / 2 - 8 * var(--ngx-size, 100) / 100)}::ng-deep dialog .ngx-input-angle-selector:before{content:\" \";border:14px var(--border-color) solid;position:absolute;z-index:1;filter:drop-shadow(0px -3px 2px rgba(0,0,0,.2));box-sizing:border-box}::ng-deep dialog.tips-above .ngx-input-angle-selector:before{border-top-color:transparent;border-right-color:transparent;border-left-color:transparent;top:-12px;left:calc(50% - 14px)}::ng-deep dialog.tips-bottom .ngx-input-angle-selector:before{border-bottom-color:transparent;border-right-color:transparent;border-left-color:transparent;bottom:-10px;left:calc(50% - 14px);filter:drop-shadow(0px 4px 2px rgba(0,0,0,.2))}\n"] }]
         }], propDecorators: { setTheme: [{
                 type: Input,
                 args: ['theme']

package/fesm2022/ngx-kit-angle-selector.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngx-kit-angle-selector.mjs","sources":["../../../projects/libs/angle-selector/components/input-angle.component.ts","../../../projects/libs/angle-selector/components/input-angle.component.html","../../../projects/libs/angle-selector/directives/ngx-input-angle.directive.ts","../../../projects/libs/angle-selector/ngx-kit-angle-selector.ts"],"sourcesContent":["import {\n  Component,\n  Output,\n  EventEmitter,\n  ElementRef,\n  ViewChild,\n  AfterViewInit,\n  OnInit,\n  inject,\n  signal,\n  effect,\n  DestroyRef,\n  WritableSignal,\n  forwardRef,\n  ChangeDetectionStrategy,\n  input,\n  ChangeDetectorRef,\n  Input,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { BrowserService } from 'ngx-kit/shared';\nimport { Subject, fromEvent, merge, tap, map, filter, switchMap, takeUntil, repeat } from 'rxjs';\n\n@Component({\n  selector: 'ngx-input-angle',\n  templateUrl: './input-angle.component.html',\n  styleUrls: ['./input-angle.component.scss'],\n  standalone: true,\n  imports: [],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NgxAngleSelectorComponent),\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class.dark]': 'theme==\"dark\"',\n    '[style.--ngx-size]': 'size()+\"px\"',\n  },\n})\nexport class NgxAngleSelectorComponent implements OnInit, AfterViewInit, ControlValueAccessor {\n  browserService = inject(BrowserService);\n  theme: 'light' | 'dark' = this.browserService.prefersDarkMode ? 'dark' : 'light';\n  @Input('theme') set setTheme(val: 'light' | 'dark' | 'auto') {\n    if (!val || val == 'auto') {\n      this.theme = this.browserService.prefersDarkMode ? 'dark' : 'light';\n    } else {\n      this.theme = val;\n    }\n  }\n  size = input<number>(90);\n  private minAngle = signal<number>(0);\n  private maxAngle = signal<number>(360);\n\n  isDisabled = signal(false);\n\n  @Output() change: EventEmitter<number> = new EventEmitter<number>();\n\n  private onChange: (value: number) => void = () => {};\n  private onTouched: () => void = () => {};\n\n  @ViewChild('selectorContainer') selectorContainer!: ElementRef<HTMLDivElement>;\n  currentAngle = signal(0);\n  isDragging = signal(false);\n  selectorRect: DOMRect | null = null;\n  centerX: number = 0;\n  centerY: number = 0;\n\n  tickes: number[] = [];\n  private pointerDownSubject = new Subject<PointerEvent>();\n  private pointerMoveSubject = new Subject<PointerEvent>();\n  private pointerUpSubject = new Subject<PointerEvent>();\n\n  private destroyRef = inject(DestroyRef);\n\n  chdr = inject(ChangeDetectorRef);\n  ngOnInit(): void {\n    // const clampedInitial = this.clamp(this.initialAngle(), this.minAngle(), this.maxAngle());\n    // this.currentAngle.set(clampedInitial);\n  }\n\n  ngAfterViewInit(): void {\n    this.updateSelectorDimensions();\n    this.drawTicks();\n    this.setupPointerEvents();\n  }\n\n  writeValue(value: number | null | undefined): void {\n    if (value !== null && value != undefined) {\n      const clampedValue = this.clamp(+value, this.minAngle(), this.maxAngle());\n      this.currentAngle.set(clampedValue);\n    }\n  }\n  registerOnChange(fn: (value: number) => void): void {\n    this.onChange = fn;\n  }\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n  setDisabledState?(isDisabled: boolean): void {\n    this.isDisabled.set(isDisabled);\n  }\n\n  private clamp(value: number, min: number, max: number): number {\n    return Math.max(min, Math.min(value, max));\n  }\n\n  private updateSelectorDimensions(): void {\n    const containerElement = this.selectorContainer.nativeElement;\n    this.selectorRect = containerElement.getBoundingClientRect();\n    this.centerX = this.selectorRect.left + this.selectorRect.width / 2;\n    this.centerY = this.selectorRect.top + this.selectorRect.height / 2;\n  }\n  selectorSize() {\n    return this.selectorRect?.width ?? 300;\n  }\n\n  private drawTicks(): void {\n    const containerElement = this.selectorContainer.nativeElement;\n\n    containerElement.querySelectorAll('.tick').forEach((tick: any) => tick.remove());\n\n    const numTicks = 8;\n    const tickInterval = 360 / numTicks;\n    this.tickes = [];\n    for (let i = 0; i < numTicks; i++) {\n      const angle = i * tickInterval;\n      this.tickes.push(angle);\n    }\n    this.chdr.detectChanges();\n  }\n\n  private calculateAngle(event: PointerEvent): void {\n    if (!this.selectorRect) return;\n\n    const clientX = event.clientX;\n    const clientY = event.clientY;\n\n    const dx = clientX - this.centerX;\n    const dy = clientY - this.centerY;\n\n    let angleRad = Math.atan2(dy, dx);\n    let angleDeg = angleRad * (180 / Math.PI);\n\n    angleDeg += 90;\n    if (angleDeg < 0) {\n      angleDeg += 360;\n    }\n\n    // const finalAngle = this.clamp(angleDeg, this.minAngle(), this.maxAngle());\n\n    const finalAngle = Math.round(angleDeg);\n\n    if (finalAngle !== this.currentAngle()) {\n      this.currentAngle.set(finalAngle);\n      this.change.emit(Math.round(this.currentAngle()));\n      this.onChange(Math.round(this.currentAngle()));\n    }\n  }\n\n  private setupPointerEvents(): void {\n    const container = this.selectorContainer.nativeElement;\n\n    const pointerDown$ = fromEvent<PointerEvent>(container, 'pointerdown').pipe(\n      tap((event) => {\n        event.preventDefault();\n        this.isDragging.set(true);\n        this.onTouched();\n        this.updateSelectorDimensions();\n      }),\n\n      switchMap((event) => {\n        this.calculateAngle(event);\n        return merge(\n          fromEvent<PointerEvent>(document, 'pointermove').pipe(\n            tap((moveEvent) => moveEvent.preventDefault()),\n            map((moveEvent) => this.calculateAngle(moveEvent)),\n\n            filter(() => this.isDragging()),\n            takeUntil(fromEvent(document, 'pointerup')),\n          ),\n          fromEvent<PointerEvent>(document, 'pointerup').pipe(\n            tap((upEvent) => {\n              upEvent.preventDefault();\n              this.isDragging.set(false);\n            }),\n            takeUntil(fromEvent(document, 'pointercancel')),\n          ),\n        );\n      }),\n      repeat(),\n    );\n\n    pointerDown$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe();\n  }\n}\n","<div class=\"ngx-input-angle-selector\">\n  <div #selectorContainer class=\"angle-selector\">\n    <div class=\"center-dot\"></div>\n    <div #hand class=\"hand\" [style.transform]=\"'rotate(' + currentAngle() + 'deg)'\"></div>\n\n    @for (angle of tickes; track $index) {\n      <div [style.transform]=\"'rotate(' + angle + 'deg)'\" class=\"tick\"></div>\n    }\n  </div>\n</div>\n","import {\n  Directive,\n  forwardRef,\n  OnDestroy,\n  Input,\n  ElementRef,\n  Renderer2,\n  ViewContainerRef,\n  HostListener,\n  Output,\n  EventEmitter,\n  input,\n} from '@angular/core';\nimport {\n  NG_VALUE_ACCESSOR,\n  NG_VALIDATORS,\n  ControlValueAccessor,\n  Validator,\n  AbstractControl,\n  ValidationErrors,\n} from '@angular/forms';\nimport { OverlayRef, OverlayService } from 'ngx-kit/shared';\nimport { NgxAngleSelectorComponent } from '../components/input-angle.component';\n\n@Directive({\n  selector: '[ngxInputAngle]',\n  exportAs: 'ngxInputAngle',\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NgxInputAngle),\n      multi: true,\n    },\n    {\n      provide: NG_VALIDATORS,\n      useExisting: forwardRef(() => NgxInputAngle),\n      multi: true,\n    },\n  ],\n})\nexport class NgxInputAngle implements OnDestroy, ControlValueAccessor, Validator {\n  @Input() theme: 'light' | 'dark' | 'auto' = 'auto';\n  size = input<number>(90);\n  openOnCLick = input<boolean>(true);\n  @Output() change = new EventEmitter<number>();\n  private value?: number | null;\n  private pickerRef?: OverlayRef<NgxAngleSelectorComponent>;\n  inValid: boolean = false;\n\n  private isDisabled = false;\n  protected _onChange = (value?: number | null) => {};\n  protected _onTouched = () => {};\n  _onValidateChange = () => {};\n\n  constructor(\n    private el: ElementRef<HTMLInputElement>,\n    private renderer: Renderer2,\n    private viewContainerRef: ViewContainerRef,\n    private overlayService: OverlayService,\n  ) {}\n\n  ngOnDestroy(): void {\n    this.destroyAnglePicker();\n  }\n\n  @HostListener('click', ['$event'])\n  onClick(ev: Event) {\n    if (this.openOnCLick() && !this.isDisabled) {\n      ev.stopPropagation();\n      ev.preventDefault();\n      this.toggle();\n    }\n  }\n\n  @HostListener('input', ['$event'])\n  onInput(event: Event) {\n    const input = event.target as HTMLInputElement;\n    this.parseInput(input.value);\n    this._onChange(this.value);\n  }\n\n  @HostListener('blur')\n  onBlur() {\n    this._onTouched();\n  }\n\n  writeValue(val: any): void {\n    this.parseInput(val);\n    this.renderer.setProperty(this.el.nativeElement, 'value', this.value);\n\n    this.inValid = false;\n    if (this.pickerRef && this.pickerRef.componentRef) {\n      this.pickerRef.componentRef.instance.writeValue(this.value);\n    }\n    this._onValidateChange();\n  }\n\n  parseInput(val: any) {\n    try {\n      this.inValid = false;\n      this.value = val != null && val != undefined ? Number.parseInt(val) : val;\n    } catch {\n      this.inValid = true;\n    }\n  }\n\n  registerOnChange(fn: any): void {\n    this._onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n\n  setDisabledState(disabled: boolean): void {\n    this.isDisabled = disabled;\n    if (disabled) {\n      this.renderer.setProperty(this.el.nativeElement, 'disabled', disabled);\n    } else {\n      this.renderer.removeAttribute(this.el.nativeElement, 'disabled');\n    }\n  }\n\n  registerOnValidatorChange(fn: () => void): void {\n    this._onValidateChange = fn;\n  }\n\n  validate(control: AbstractControl): ValidationErrors | null {\n    if (this.inValid === true) {\n      return { invalid: true };\n    }\n    if (this.value && this.value > 360) return { max: true };\n    if (this.value && this.value < 0) return { min: true };\n    return null;\n  }\n\n  public toggle() {\n    if (this.pickerRef || this.isDisabled) {\n      this.destroyAnglePicker();\n      return;\n    }\n\n    this.pickerRef = this.overlayService.open({\n      anchor: this.el.nativeElement,\n      component: NgxAngleSelectorComponent,\n      viewContainerRef: this.viewContainerRef,\n      alignment: 'center',\n      placement: 'bottom',\n      margin: 2,\n      configure: (instance, ref) => {\n        instance.size = this.size;\n        instance.setTheme = this.theme;\n        instance.writeValue(this.value);\n\n        instance.change.subscribe((c: number) => {\n          this.value = c;\n          this.emitChange(c);\n        });\n\n        // instance.closed.subscribe(() => ref.close());\n      },\n      onClosed: () => {\n        this.pickerRef = undefined;\n      },\n    });\n  }\n\n  private destroyAnglePicker() {\n    this.pickerRef?.close();\n    this.pickerRef = undefined;\n  }\n\n  private async emitChange(c: number) {\n    this.renderer.setProperty(this.el.nativeElement, 'value', c);\n\n    this._onChange(c);\n    this.change.emit(c);\n    this._onTouched();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ngx-kit-angle-selector.mjs","sources":["../../../projects/libs/angle-selector/components/input-angle.component.ts","../../../projects/libs/angle-selector/components/input-angle.component.html","../../../projects/libs/angle-selector/directives/ngx-input-angle.directive.ts","../../../projects/libs/angle-selector/ngx-kit-angle-selector.ts"],"sourcesContent":["import {\n  Component,\n  Output,\n  EventEmitter,\n  ElementRef,\n  ViewChild,\n  AfterViewInit,\n  OnInit,\n  inject,\n  signal,\n  effect,\n  DestroyRef,\n  WritableSignal,\n  forwardRef,\n  ChangeDetectionStrategy,\n  input,\n  ChangeDetectorRef,\n  Input,\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { BrowserService } from 'ngx-kit/shared';\nimport { Subject, fromEvent, merge, tap, map, filter, switchMap, takeUntil, repeat } from 'rxjs';\n\n@Component({\n  selector: 'ngx-input-angle',\n  templateUrl: './input-angle.component.html',\n  styleUrls: ['./input-angle.component.scss'],\n  standalone: true,\n  imports: [],\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NgxAngleSelectorComponent),\n      multi: true,\n    },\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class.dark]': 'theme==\"dark\"',\n    '[style.--ngx-size]': 'size()+\"px\"',\n  },\n})\nexport class NgxAngleSelectorComponent implements OnInit, AfterViewInit, ControlValueAccessor {\n  browserService = inject(BrowserService);\n  theme: 'light' | 'dark' = this.browserService.prefersDarkMode ? 'dark' : 'light';\n  @Input('theme') set setTheme(val: 'light' | 'dark' | 'auto') {\n    if (!val || val == 'auto') {\n      this.theme = this.browserService.prefersDarkMode ? 'dark' : 'light';\n    } else {\n      this.theme = val;\n    }\n  }\n  size = input<number>(90);\n  private minAngle = signal<number>(0);\n  private maxAngle = signal<number>(360);\n\n  isDisabled = signal(false);\n\n  @Output() change: EventEmitter<number> = new EventEmitter<number>();\n\n  private onChange: (value: number) => void = () => {};\n  private onTouched: () => void = () => {};\n\n  @ViewChild('selectorContainer') selectorContainer!: ElementRef<HTMLDivElement>;\n  currentAngle = signal(0);\n  isDragging = signal(false);\n  selectorRect: DOMRect | null = null;\n  centerX: number = 0;\n  centerY: number = 0;\n\n  tickes: number[] = [];\n  private pointerDownSubject = new Subject<PointerEvent>();\n  private pointerMoveSubject = new Subject<PointerEvent>();\n  private pointerUpSubject = new Subject<PointerEvent>();\n\n  private destroyRef = inject(DestroyRef);\n\n  chdr = inject(ChangeDetectorRef);\n  ngOnInit(): void {\n    // const clampedInitial = this.clamp(this.initialAngle(), this.minAngle(), this.maxAngle());\n    // this.currentAngle.set(clampedInitial);\n  }\n\n  ngAfterViewInit(): void {\n    this.updateSelectorDimensions();\n    this.drawTicks();\n    this.setupPointerEvents();\n  }\n\n  writeValue(value: number | null | undefined): void {\n    if (value !== null && value != undefined) {\n      const clampedValue = this.clamp(+value, this.minAngle(), this.maxAngle());\n      this.currentAngle.set(clampedValue);\n    }\n  }\n  registerOnChange(fn: (value: number) => void): void {\n    this.onChange = fn;\n  }\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n  setDisabledState?(isDisabled: boolean): void {\n    this.isDisabled.set(isDisabled);\n  }\n\n  private clamp(value: number, min: number, max: number): number {\n    return Math.max(min, Math.min(value, max));\n  }\n\n  private updateSelectorDimensions(): void {\n    const containerElement = this.selectorContainer.nativeElement;\n    this.selectorRect = containerElement.getBoundingClientRect();\n    this.centerX = this.selectorRect.left + this.selectorRect.width / 2;\n    this.centerY = this.selectorRect.top + this.selectorRect.height / 2;\n  }\n  selectorSize() {\n    return this.selectorRect?.width ?? 300;\n  }\n\n  private drawTicks(): void {\n    const containerElement = this.selectorContainer.nativeElement;\n\n    containerElement.querySelectorAll('.tick').forEach((tick: any) => tick.remove());\n\n    const numTicks = 8;\n    const tickInterval = 360 / numTicks;\n    this.tickes = [];\n    for (let i = 0; i < numTicks; i++) {\n      const angle = i * tickInterval;\n      this.tickes.push(angle);\n    }\n    this.chdr.detectChanges();\n  }\n\n  private calculateAngle(event: PointerEvent): void {\n    if (!this.selectorRect) return;\n\n    const clientX = event.clientX;\n    const clientY = event.clientY;\n\n    const dx = clientX - this.centerX;\n    const dy = clientY - this.centerY;\n\n    let angleRad = Math.atan2(dy, dx);\n    let angleDeg = angleRad * (180 / Math.PI);\n\n    angleDeg += 90;\n    if (angleDeg < 0) {\n      angleDeg += 360;\n    }\n\n    // const finalAngle = this.clamp(angleDeg, this.minAngle(), this.maxAngle());\n\n    const finalAngle = Math.round(angleDeg);\n\n    if (finalAngle !== this.currentAngle()) {\n      this.currentAngle.set(finalAngle);\n      this.change.emit(Math.round(this.currentAngle()));\n      this.onChange(Math.round(this.currentAngle()));\n    }\n  }\n\n  private setupPointerEvents(): void {\n    const container = this.selectorContainer.nativeElement;\n\n    const pointerDown$ = fromEvent<PointerEvent>(container, 'pointerdown').pipe(\n      tap((event) => {\n        event.preventDefault();\n        this.isDragging.set(true);\n        this.onTouched();\n        this.updateSelectorDimensions();\n      }),\n\n      switchMap((event) => {\n        this.calculateAngle(event);\n        return merge(\n          fromEvent<PointerEvent>(document, 'pointermove').pipe(\n            tap((moveEvent) => moveEvent.preventDefault()),\n            map((moveEvent) => this.calculateAngle(moveEvent)),\n\n            filter(() => this.isDragging()),\n            takeUntil(fromEvent(document, 'pointerup')),\n          ),\n          fromEvent<PointerEvent>(document, 'pointerup').pipe(\n            tap((upEvent) => {\n              upEvent.preventDefault();\n              this.isDragging.set(false);\n            }),\n            takeUntil(fromEvent(document, 'pointercancel')),\n          ),\n        );\n      }),\n      repeat(),\n    );\n\n    pointerDown$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe();\n  }\n}\n","<div class=\"ngx-input-angle-selector\">\r\n  <div #selectorContainer class=\"angle-selector\">\r\n    <div class=\"center-dot\"></div>\r\n    <div #hand class=\"hand\" [style.transform]=\"'rotate(' + currentAngle() + 'deg)'\"></div>\r\n\r\n    @for (angle of tickes; track $index) {\r\n      <div [style.transform]=\"'rotate(' + angle + 'deg)'\" class=\"tick\"></div>\r\n    }\r\n  </div>\r\n</div>\r\n","import {\n  Directive,\n  forwardRef,\n  OnDestroy,\n  Input,\n  ElementRef,\n  Renderer2,\n  ViewContainerRef,\n  HostListener,\n  Output,\n  EventEmitter,\n  input,\n} from '@angular/core';\nimport {\n  NG_VALUE_ACCESSOR,\n  NG_VALIDATORS,\n  ControlValueAccessor,\n  Validator,\n  AbstractControl,\n  ValidationErrors,\n} from '@angular/forms';\nimport { OverlayRef, OverlayService } from 'ngx-kit/shared';\nimport { NgxAngleSelectorComponent } from '../components/input-angle.component';\n\n@Directive({\n  selector: '[ngxInputAngle]',\n  exportAs: 'ngxInputAngle',\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NgxInputAngle),\n      multi: true,\n    },\n    {\n      provide: NG_VALIDATORS,\n      useExisting: forwardRef(() => NgxInputAngle),\n      multi: true,\n    },\n  ],\n})\nexport class NgxInputAngle implements OnDestroy, ControlValueAccessor, Validator {\n  @Input() theme: 'light' | 'dark' | 'auto' = 'auto';\n  size = input<number>(90);\n  openOnCLick = input<boolean>(true);\n  @Output() change = new EventEmitter<number>();\n  private value?: number | null;\n  private pickerRef?: OverlayRef<NgxAngleSelectorComponent>;\n  inValid: boolean = false;\n\n  private isDisabled = false;\n  protected _onChange = (value?: number | null) => {};\n  protected _onTouched = () => {};\n  _onValidateChange = () => {};\n\n  constructor(\n    private el: ElementRef<HTMLInputElement>,\n    private renderer: Renderer2,\n    private viewContainerRef: ViewContainerRef,\n    private overlayService: OverlayService,\n  ) {}\n\n  ngOnDestroy(): void {\n    this.destroyAnglePicker();\n  }\n\n  @HostListener('click', ['$event'])\n  onClick(ev: Event) {\n    if (this.openOnCLick() && !this.isDisabled) {\n      ev.stopPropagation();\n      ev.preventDefault();\n      this.toggle();\n    }\n  }\n\n  @HostListener('input', ['$event'])\n  onInput(event: Event) {\n    const input = event.target as HTMLInputElement;\n    this.parseInput(input.value);\n    this._onChange(this.value);\n  }\n\n  @HostListener('blur')\n  onBlur() {\n    this._onTouched();\n  }\n\n  writeValue(val: any): void {\n    this.parseInput(val);\n    this.renderer.setProperty(this.el.nativeElement, 'value', this.value);\n\n    this.inValid = false;\n    if (this.pickerRef && this.pickerRef.componentRef) {\n      this.pickerRef.componentRef.instance.writeValue(this.value);\n    }\n    this._onValidateChange();\n  }\n\n  parseInput(val: any) {\n    try {\n      this.inValid = false;\n      this.value = val != null && val != undefined ? Number.parseInt(val) : val;\n    } catch {\n      this.inValid = true;\n    }\n  }\n\n  registerOnChange(fn: any): void {\n    this._onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n\n  setDisabledState(disabled: boolean): void {\n    this.isDisabled = disabled;\n    if (disabled) {\n      this.renderer.setProperty(this.el.nativeElement, 'disabled', disabled);\n    } else {\n      this.renderer.removeAttribute(this.el.nativeElement, 'disabled');\n    }\n  }\n\n  registerOnValidatorChange(fn: () => void): void {\n    this._onValidateChange = fn;\n  }\n\n  validate(control: AbstractControl): ValidationErrors | null {\n    if (this.inValid === true) {\n      return { invalid: true };\n    }\n    if (this.value && this.value > 360) return { max: true };\n    if (this.value && this.value < 0) return { min: true };\n    return null;\n  }\n\n  public toggle() {\n    if (this.pickerRef || this.isDisabled) {\n      this.destroyAnglePicker();\n      return;\n    }\n\n    this.pickerRef = this.overlayService.open({\n      anchor: this.el.nativeElement,\n      component: NgxAngleSelectorComponent,\n      viewContainerRef: this.viewContainerRef,\n      alignment: 'center',\n      placement: 'bottom',\n      margin: 2,\n      configure: (instance, ref) => {\n        instance.size = this.size;\n        instance.setTheme = this.theme;\n        instance.writeValue(this.value);\n\n        instance.change.subscribe((c: number) => {\n          this.value = c;\n          this.emitChange(c);\n        });\n\n        // instance.closed.subscribe(() => ref.close());\n      },\n      onClosed: () => {\n        this.pickerRef = undefined;\n      },\n    });\n  }\n\n  private destroyAnglePicker() {\n    this.pickerRef?.close();\n    this.pickerRef = undefined;\n  }\n\n  private async emitChange(c: number) {\n    this.renderer.setProperty(this.el.nativeElement, 'value', c);\n\n    this._onChange(c);\n    this.change.emit(c);\n    this._onTouched();\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngx-kit-box-shadow.mjs

@@ -272,7 +272,7 @@ class NgxBoxShadowComponent {
                 multi: true,
                 useExisting: NgxBoxShadowComponent,
             },
-        ], viewQueries: [{ propertyName: "pad", first: true, predicate: ["pad"], descendants: true, static: true }, { propertyName: "thumb", first: true, predicate: ["thumb"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"ngx-box-shadow-container\" (click)=\"stopPropagation($event)\">\n  <div class=\"pad-container\" #pad>\n    <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\">\n      <line\n        [attr.x1]=\"line.x1\"\n        [attr.y1]=\"line.y1\"\n        [attr.x2]=\"line.x2\"\n        [attr.y2]=\"line.y2\"\n        stroke=\"blue\"\n        stroke-width=\"2\" />\n    </svg>\n    <div\n      class=\"thumb\"\n      #thumb\n      [style.left.px]=\"x\"\n      [style.top.px]=\"y\"\n      (mousedown)=\"dragStart($event)\"\n      (touchstart)=\"dragStart($event)\"></div>\n  </div>\n\n  <div class=\"ngx-settings\">\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Offset X</span>\n        <input\n          type=\"number\"\n          id=\"offsetX\"\n          [(ngModel)]=\"value.x\"\n          name=\"offsetX\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"offsetX\"\n        [(ngModel)]=\"value.x\"\n        name=\"rangeOffsetX\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\"\n        [min]=\"-maxRange\"\n        [max]=\"maxRange\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Offset Y</span>\n        <input\n          type=\"number\"\n          id=\"offsetY\"\n          [(ngModel)]=\"value.y\"\n          name=\"offsetY\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"offsetY\"\n        [(ngModel)]=\"value.y\"\n        name=\"rangeOffsetY\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\"\n        [min]=\"-maxRange\"\n        [max]=\"maxRange\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Blur</span>\n        <input\n          type=\"number\"\n          id=\"blur\"\n          [(ngModel)]=\"blur\"\n          name=\"blur\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"blur\"\n        [(ngModel)]=\"blur\"\n        name=\"rangeBlur\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Spread</span>\n        <input\n          type=\"number\"\n          id=\"spread\"\n          [(ngModel)]=\"spread\"\n          name=\"spread\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"spread\"\n        [(ngModel)]=\"spread\"\n        name=\"rangeSpread\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>color</span>\n        <input\n          type=\"text\"\n          readonly\n          id=\"color\"\n          [(ngModel)]=\"color\"\n          name=\"color\"\n          ngxInputColor\n          [simpleMode]=\"true\"\n          (ngModelChange)=\"onChangeData()\"\n          autocomplete=\"off\" />\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".ngx-box-shadow-container{width:180px;max-width:100%;border-radius:15px;background-color:#fff;overflow:hidden;direction:ltr;padding:12px;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-box-shadow-container *{box-sizing:border-box}.pad-container{position:relative;width:100px;height:100px;border:1px #545454 solid;box-sizing:border-box;direction:ltr;border-radius:3px}.pad-container:after,.pad-container:before{content:\"\";position:absolute;border:1px rgba(145,145,145,.4117647059) solid}.pad-container:after{width:100%;top:calc(50% - 1px);left:0}.pad-container:before{height:100%;top:0;left:calc(50% - 1px)}.pad-container .thumb{box-shadow:inset 0 0 0 2px #fff;width:15px;height:15px;display:block;border-radius:10px;position:absolute;cursor:pointer;background:#00f}.ngx-settings .ngx-row{display:flex;align-items:flex-end;justify-content:space-between}.ngx-settings input:not([type=range]){width:46px;border:none;border:1px solid rgba(145,145,145,.4117647059);padding:2px 4px;border-radius:5px;background-color:transparent;color:#000;font-size:14px;font-weight:500;text-align:center;direction:ltr}.ngx-settings input:not([type=range]):focus{outline:none;border:1px solid #09218d}.ngx-settings input[type=range]{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.RangeValueAccessor, selector: "input[type=range]:not([ngNoCva])[formControlName],input[type=range]:not([ngNoCva])[formControl],input[type=range]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgxInputColor, selector: "[ngxInputColor]", inputs: ["setInputBackgroundColor", "defaultInspector", "simpleMode", "outputType", "theme", "useAlphaChannel", "ngxInputColor"], outputs: ["change"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], viewQueries: [{ propertyName: "pad", first: true, predicate: ["pad"], descendants: true, static: true }, { propertyName: "thumb", first: true, predicate: ["thumb"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"ngx-box-shadow-container\" (click)=\"stopPropagation($event)\">\r\n  <div class=\"pad-container\" #pad>\r\n    <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <line\r\n        [attr.x1]=\"line.x1\"\r\n        [attr.y1]=\"line.y1\"\r\n        [attr.x2]=\"line.x2\"\r\n        [attr.y2]=\"line.y2\"\r\n        stroke=\"blue\"\r\n        stroke-width=\"2\" />\r\n    </svg>\r\n    <div\r\n      class=\"thumb\"\r\n      #thumb\r\n      [style.left.px]=\"x\"\r\n      [style.top.px]=\"y\"\r\n      (mousedown)=\"dragStart($event)\"\r\n      (touchstart)=\"dragStart($event)\"></div>\r\n  </div>\r\n\r\n  <div class=\"ngx-settings\">\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Offset X</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"offsetX\"\r\n          [(ngModel)]=\"value.x\"\r\n          name=\"offsetX\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"offsetX\"\r\n        [(ngModel)]=\"value.x\"\r\n        name=\"rangeOffsetX\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\"\r\n        [min]=\"-maxRange\"\r\n        [max]=\"maxRange\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Offset Y</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"offsetY\"\r\n          [(ngModel)]=\"value.y\"\r\n          name=\"offsetY\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"offsetY\"\r\n        [(ngModel)]=\"value.y\"\r\n        name=\"rangeOffsetY\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\"\r\n        [min]=\"-maxRange\"\r\n        [max]=\"maxRange\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Blur</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"blur\"\r\n          [(ngModel)]=\"blur\"\r\n          name=\"blur\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"blur\"\r\n        [(ngModel)]=\"blur\"\r\n        name=\"rangeBlur\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Spread</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"spread\"\r\n          [(ngModel)]=\"spread\"\r\n          name=\"spread\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"spread\"\r\n        [(ngModel)]=\"spread\"\r\n        name=\"rangeSpread\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>color</span>\r\n        <input\r\n          type=\"text\"\r\n          readonly\r\n          id=\"color\"\r\n          [(ngModel)]=\"color\"\r\n          name=\"color\"\r\n          ngxInputColor\r\n          [simpleMode]=\"true\"\r\n          (ngModelChange)=\"onChangeData()\"\r\n          autocomplete=\"off\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".ngx-box-shadow-container{width:180px;max-width:100%;border-radius:15px;background-color:#fff;overflow:hidden;direction:ltr;padding:12px;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-box-shadow-container *{box-sizing:border-box}.pad-container{position:relative;width:100px;height:100px;border:1px #545454 solid;box-sizing:border-box;direction:ltr;border-radius:3px}.pad-container:after,.pad-container:before{content:\"\";position:absolute;border:1px rgba(145,145,145,.4117647059) solid}.pad-container:after{width:100%;top:calc(50% - 1px);left:0}.pad-container:before{height:100%;top:0;left:calc(50% - 1px)}.pad-container .thumb{box-shadow:inset 0 0 0 2px #fff;width:15px;height:15px;display:block;border-radius:10px;position:absolute;cursor:pointer;background:#00f}.ngx-settings .ngx-row{display:flex;align-items:flex-end;justify-content:space-between}.ngx-settings input:not([type=range]){width:46px;border:none;border:1px solid rgba(145,145,145,.4117647059);padding:2px 4px;border-radius:5px;background-color:transparent;color:#000;font-size:14px;font-weight:500;text-align:center;direction:ltr}.ngx-settings input:not([type=range]):focus{outline:none;border:1px solid #09218d}.ngx-settings input[type=range]{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.RangeValueAccessor, selector: "input[type=range]:not([ngNoCva])[formControlName],input[type=range]:not([ngNoCva])[formControl],input[type=range]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgxInputColor, selector: "[ngxInputColor]", inputs: ["setInputBackgroundColor", "defaultInspector", "simpleMode", "outputType", "theme", "useAlphaChannel", "ngxInputColor"], outputs: ["change"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxBoxShadowComponent, decorators: [{
             type: Component,
@@ -289,7 +289,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
                         },
                     ], imports: [FormsModule, NgxInputColor], host: {
                         '[class.dark]': 'theme=="dark"',
-                    }, template: "<div class=\"ngx-box-shadow-container\" (click)=\"stopPropagation($event)\">\n  <div class=\"pad-container\" #pad>\n    <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\">\n      <line\n        [attr.x1]=\"line.x1\"\n        [attr.y1]=\"line.y1\"\n        [attr.x2]=\"line.x2\"\n        [attr.y2]=\"line.y2\"\n        stroke=\"blue\"\n        stroke-width=\"2\" />\n    </svg>\n    <div\n      class=\"thumb\"\n      #thumb\n      [style.left.px]=\"x\"\n      [style.top.px]=\"y\"\n      (mousedown)=\"dragStart($event)\"\n      (touchstart)=\"dragStart($event)\"></div>\n  </div>\n\n  <div class=\"ngx-settings\">\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Offset X</span>\n        <input\n          type=\"number\"\n          id=\"offsetX\"\n          [(ngModel)]=\"value.x\"\n          name=\"offsetX\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"offsetX\"\n        [(ngModel)]=\"value.x\"\n        name=\"rangeOffsetX\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\"\n        [min]=\"-maxRange\"\n        [max]=\"maxRange\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Offset Y</span>\n        <input\n          type=\"number\"\n          id=\"offsetY\"\n          [(ngModel)]=\"value.y\"\n          name=\"offsetY\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"offsetY\"\n        [(ngModel)]=\"value.y\"\n        name=\"rangeOffsetY\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\"\n        [min]=\"-maxRange\"\n        [max]=\"maxRange\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Blur</span>\n        <input\n          type=\"number\"\n          id=\"blur\"\n          [(ngModel)]=\"blur\"\n          name=\"blur\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"blur\"\n        [(ngModel)]=\"blur\"\n        name=\"rangeBlur\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Spread</span>\n        <input\n          type=\"number\"\n          id=\"spread\"\n          [(ngModel)]=\"spread\"\n          name=\"spread\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"spread\"\n        [(ngModel)]=\"spread\"\n        name=\"rangeSpread\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>color</span>\n        <input\n          type=\"text\"\n          readonly\n          id=\"color\"\n          [(ngModel)]=\"color\"\n          name=\"color\"\n          ngxInputColor\n          [simpleMode]=\"true\"\n          (ngModelChange)=\"onChangeData()\"\n          autocomplete=\"off\" />\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".ngx-box-shadow-container{width:180px;max-width:100%;border-radius:15px;background-color:#fff;overflow:hidden;direction:ltr;padding:12px;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-box-shadow-container *{box-sizing:border-box}.pad-container{position:relative;width:100px;height:100px;border:1px #545454 solid;box-sizing:border-box;direction:ltr;border-radius:3px}.pad-container:after,.pad-container:before{content:\"\";position:absolute;border:1px rgba(145,145,145,.4117647059) solid}.pad-container:after{width:100%;top:calc(50% - 1px);left:0}.pad-container:before{height:100%;top:0;left:calc(50% - 1px)}.pad-container .thumb{box-shadow:inset 0 0 0 2px #fff;width:15px;height:15px;display:block;border-radius:10px;position:absolute;cursor:pointer;background:#00f}.ngx-settings .ngx-row{display:flex;align-items:flex-end;justify-content:space-between}.ngx-settings input:not([type=range]){width:46px;border:none;border:1px solid rgba(145,145,145,.4117647059);padding:2px 4px;border-radius:5px;background-color:transparent;color:#000;font-size:14px;font-weight:500;text-align:center;direction:ltr}.ngx-settings input:not([type=range]):focus{outline:none;border:1px solid #09218d}.ngx-settings input[type=range]{width:100%}\n"] }]
+                    }, template: "<div class=\"ngx-box-shadow-container\" (click)=\"stopPropagation($event)\">\r\n  <div class=\"pad-container\" #pad>\r\n    <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <line\r\n        [attr.x1]=\"line.x1\"\r\n        [attr.y1]=\"line.y1\"\r\n        [attr.x2]=\"line.x2\"\r\n        [attr.y2]=\"line.y2\"\r\n        stroke=\"blue\"\r\n        stroke-width=\"2\" />\r\n    </svg>\r\n    <div\r\n      class=\"thumb\"\r\n      #thumb\r\n      [style.left.px]=\"x\"\r\n      [style.top.px]=\"y\"\r\n      (mousedown)=\"dragStart($event)\"\r\n      (touchstart)=\"dragStart($event)\"></div>\r\n  </div>\r\n\r\n  <div class=\"ngx-settings\">\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Offset X</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"offsetX\"\r\n          [(ngModel)]=\"value.x\"\r\n          name=\"offsetX\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"offsetX\"\r\n        [(ngModel)]=\"value.x\"\r\n        name=\"rangeOffsetX\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\"\r\n        [min]=\"-maxRange\"\r\n        [max]=\"maxRange\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Offset Y</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"offsetY\"\r\n          [(ngModel)]=\"value.y\"\r\n          name=\"offsetY\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"offsetY\"\r\n        [(ngModel)]=\"value.y\"\r\n        name=\"rangeOffsetY\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\"\r\n        [min]=\"-maxRange\"\r\n        [max]=\"maxRange\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Blur</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"blur\"\r\n          [(ngModel)]=\"blur\"\r\n          name=\"blur\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"blur\"\r\n        [(ngModel)]=\"blur\"\r\n        name=\"rangeBlur\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Spread</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"spread\"\r\n          [(ngModel)]=\"spread\"\r\n          name=\"spread\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"spread\"\r\n        [(ngModel)]=\"spread\"\r\n        name=\"rangeSpread\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>color</span>\r\n        <input\r\n          type=\"text\"\r\n          readonly\r\n          id=\"color\"\r\n          [(ngModel)]=\"color\"\r\n          name=\"color\"\r\n          ngxInputColor\r\n          [simpleMode]=\"true\"\r\n          (ngModelChange)=\"onChangeData()\"\r\n          autocomplete=\"off\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".ngx-box-shadow-container{width:180px;max-width:100%;border-radius:15px;background-color:#fff;overflow:hidden;direction:ltr;padding:12px;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-box-shadow-container *{box-sizing:border-box}.pad-container{position:relative;width:100px;height:100px;border:1px #545454 solid;box-sizing:border-box;direction:ltr;border-radius:3px}.pad-container:after,.pad-container:before{content:\"\";position:absolute;border:1px rgba(145,145,145,.4117647059) solid}.pad-container:after{width:100%;top:calc(50% - 1px);left:0}.pad-container:before{height:100%;top:0;left:calc(50% - 1px)}.pad-container .thumb{box-shadow:inset 0 0 0 2px #fff;width:15px;height:15px;display:block;border-radius:10px;position:absolute;cursor:pointer;background:#00f}.ngx-settings .ngx-row{display:flex;align-items:flex-end;justify-content:space-between}.ngx-settings input:not([type=range]){width:46px;border:none;border:1px solid rgba(145,145,145,.4117647059);padding:2px 4px;border-radius:5px;background-color:transparent;color:#000;font-size:14px;font-weight:500;text-align:center;direction:ltr}.ngx-settings input:not([type=range]):focus{outline:none;border:1px solid #09218d}.ngx-settings input[type=range]{width:100%}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { setTheme: [{
                 type: Input,
                 args: ['theme']

package/fesm2022/ngx-kit-box-shadow.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngx-kit-box-shadow.mjs","sources":["../../../projects/libs/box-shadow/utils/box-shadow.ts","../../../projects/libs/box-shadow/components/box-shadow.component.ts","../../../projects/libs/box-shadow/components/box-shadow.component.html","../../../projects/libs/box-shadow/directives/ngx-input-box-shadow.directive.ts","../../../projects/libs/box-shadow/ngx-kit-box-shadow.ts"],"sourcesContent":["import { BoxShadowValue } from '../contracts/BoxShadowValue';\nexport function parseBoxShadowToPx(shadow: string, contextPx = 16): BoxShadowValue | null {\n  if (!shadow || !shadow?.trim()) return null;\n  let inset = false;\n  shadow = shadow.trim();\n\n  if (shadow.startsWith('inset')) {\n    inset = true;\n    shadow = shadow.slice(5).trim();\n  }\n\n  const colorRegex =\n    /(#(?:[a-f0-9]{3}|[a-f0-9]{6}|[a-f0-9]{4}|[a-f0-9]{8})\\b|rgb\\(\\d{1,3},\\s*\\d{1,3},\\s*\\d{1,3}\\)|rgba\\(\\d{1,3},\\s*\\d{1,3},\\s*\\d{1,3},\\s*\\d*(?:\\.\\d+)?\\)|hsl\\(\\s*\\d+,\\s*\\d*(?:\\.\\d+)?%,\\s*\\d*(?:\\.\\d+)?%\\)|hsla\\(\\d+,\\s*[\\d.]+%,\\s*[\\d.]+%,\\s*\\d*(?:\\.\\d+)?\\))/gi;\n  const colorMatch = shadow.match(colorRegex);\n  let color = 'black';\n  if (colorMatch) {\n    color = colorMatch[0];\n    shadow = shadow.replace(color, '').trim();\n  }\n\n  const toPx = (value: number, unit: string): number => {\n    switch (unit.toLowerCase()) {\n      case 'px':\n      case '':\n        return value;\n      case 'em':\n      case 'rem':\n        return value * contextPx;\n      case '%':\n        return (value / 100) * contextPx;\n      case 'pt':\n        return value * 1.333;\n      default:\n        return value; // fallback\n    }\n  };\n\n  const matches = [...shadow.matchAll(/(-?\\d*\\.?\\d+)([a-zA-Z%]*)/g)];\n  const values = matches.map(([_, num, unit]) => toPx(parseFloat(num), unit));\n\n  const [offsetX, offsetY, blur, spread] = values;\n\n  return {\n    inset,\n    offsetX: offsetX ?? 0,\n    offsetY: offsetY ?? 0,\n    blurRadius: blur ?? 0,\n    spreadRadius: spread ?? 0,\n    color,\n  };\n}\n\nexport function stringifyBoxShadow(obj: BoxShadowValue): string {\n  const { inset, offsetX, offsetY, blurRadius, spreadRadius, color } = obj;\n\n  const parts = [\n    inset ? 'inset' : '',\n    `${offsetX}px`,\n    `${offsetY}px`,\n    `${blurRadius}px`,\n    `${spreadRadius}px`,\n    color,\n  ];\n\n  return parts.filter(Boolean).join(' ').trim();\n}\n","import {\n  Component,\n  ChangeDetectionStrategy,\n  forwardRef,\n  OnInit,\n  OnDestroy,\n  ChangeDetectorRef,\n  HostListener,\n  ElementRef,\n  ViewChild,\n  AfterViewInit,\n  Input,\n  Output,\n  EventEmitter,\n  inject,\n} from '@angular/core';\nimport {\n  NG_VALUE_ACCESSOR,\n  NG_VALIDATORS,\n  FormsModule,\n  ControlValueAccessor,\n  Validator,\n  AbstractControl,\n  ValidationErrors,\n} from '@angular/forms';\nimport { parseBoxShadowToPx, stringifyBoxShadow } from '../utils/box-shadow';\nimport { IPosition, getOffsetPosition, startDragSession } from 'ngx-kit/shared';\nimport { NgxInputColor } from 'ngx-kit/color-picker';\nimport { BrowserService } from 'ngx-kit/shared';\n\n@Component({\n  selector: 'ngx-box-shadow',\n  templateUrl: './box-shadow.component.html',\n  styleUrls: ['./box-shadow.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NgxBoxShadowComponent),\n      multi: true,\n    },\n    {\n      provide: NG_VALIDATORS,\n      multi: true,\n      useExisting: NgxBoxShadowComponent,\n    },\n  ],\n  imports: [FormsModule, NgxInputColor],\n  host: {\n    '[class.dark]': 'theme==\"dark\"',\n  },\n})\nexport class NgxBoxShadowComponent\n  implements OnInit, AfterViewInit, OnDestroy, ControlValueAccessor, Validator\n{\n  theme: 'light' | 'dark' | 'auto' = 'light';\n  @Input('theme') set setTheme(val: 'light' | 'dark' | 'auto') {\n    if (!val || val == 'auto') {\n      this.theme = this.browserService.prefersDarkMode ? 'dark' : 'light';\n    } else {\n      this.theme = val;\n    }\n  }\n  /**\n   * The maximum range of the box shadow.\n   * @default 25\n   */\n  @Input() maxRange = 25;\n  @Output() change = new EventEmitter<string>();\n  isDisabled = false;\n  isDragging = false;\n  value: IPosition = { x: 0, y: 0 };\n  x = 0;\n  y = 0;\n  blur = 0;\n  spread = 0;\n  color = 'black';\n  line: { x1: number; y1: number; x2: number; y2: number } = { x1: 0, y1: 0, x2: 0, y2: 0 };\n  center: { x: number; y: number } = { x: 0, y: 0 };\n\n  padRect?: DOMRect;\n  thumbRect?: DOMRect;\n  protected _onChange = (value: string) => {};\n  protected _onTouched = () => {};\n  _onValidateChange = () => {};\n  private stopDrag?: () => void;\n\n  @ViewChild('pad', { static: true }) pad!: ElementRef<HTMLDivElement>;\n  @ViewChild('thumb', { static: true }) thumb!: ElementRef<HTMLDivElement>;\n\n  browserService = inject(BrowserService);\n\n  constructor(private cd: ChangeDetectorRef) {}\n\n  ngOnInit(): void {}\n  ngAfterViewInit(): void {\n    this.updateRects();\n  }\n  ngOnDestroy(): void {\n    this.stopDrag?.();\n  }\n  registerOnChange(fn: any): void {\n    this._onChange = fn;\n  }\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n  setDisabledState(disabled: boolean): void {\n    this.isDisabled = disabled;\n  }\n  registerOnValidatorChange(fn: () => void): void {\n    this._onValidateChange = fn;\n  }\n  validate(control: AbstractControl): ValidationErrors | null {\n    return null;\n  }\n\n  writeValue(value: any): void {\n    this.resetPosition();\n    if (value) {\n      const boxShadow = parseBoxShadowToPx(value);\n      // console.log(boxShadow);\n      if (boxShadow) {\n        this.value = { x: boxShadow.offsetX, y: boxShadow.offsetY };\n        this.blur = boxShadow.blurRadius;\n        this.spread = boxShadow.spreadRadius;\n        this.color = boxShadow.color;\n        this.convertValueToPosition(boxShadow.offsetX, boxShadow.offsetY);\n      }\n    }\n  }\n\n  dragStart(ev: MouseEvent | TouchEvent) {\n    ev.stopPropagation();\n    ev.preventDefault();\n    this.isDragging = true;\n    this.updatePosition(ev);\n    this.updateRects();\n    this.stopDrag?.();\n    this.stopDrag = startDragSession({\n      onMove: (moveEv) => this.updatePosition(moveEv),\n      onEnd: () => {\n        this.isDragging = false;\n        this.stopDrag = undefined;\n        this.cd.markForCheck();\n      },\n    });\n  }\n  private updateRects() {\n    this.padRect = this.pad.nativeElement.getBoundingClientRect();\n    this.thumbRect = this.thumb.nativeElement.getBoundingClientRect();\n  }\n  private resetPosition() {\n    if (!this.padRect || !this.thumbRect) this.updateRects();\n    this.center = { x: this.padRect!.width / 2, y: this.padRect!.height / 2 };\n    this.x = this.center.x - this.thumbRect!.width / 2;\n    this.y = this.center.y - this.thumbRect!.height / 2;\n    this.line = { x1: this.center.x, y1: this.center.y, x2: this.center.x, y2: this.center.y };\n    this.cd.detectChanges();\n  }\n\n  @HostListener('window:resize')\n  onResize() {\n    this.writeValue(this.value);\n  }\n\n  private updatePosition(ev: MouseEvent | TouchEvent) {\n    if (!this.isDragging) return;\n    if (!this.padRect || !this.thumbRect) this.updateRects();\n    const position = getOffsetPosition(ev, this.pad.nativeElement);\n\n    const padRec = this.padRect!;\n    const thumbRec = this.thumbRect!;\n\n    const minX = thumbRec.width / 2;\n    const maxX = padRec.width - thumbRec.width / 2;\n    const minY = thumbRec.height / 2;\n    const maxY = padRec.height - thumbRec.height / 2;\n\n    const clampedX = Math.max(minX, Math.min(position.x, maxX));\n    const clampedY = Math.max(minY, Math.min(position.y, maxY));\n\n    // فقط یکبار از وسط اصلاح کن\n    this.x = clampedX - thumbRec.width / 2;\n    this.y = clampedY - thumbRec.height / 2;\n\n    this.line = {\n      x1: this.center.x,\n      y1: this.center.y,\n      x2: this.x + thumbRec.width / 2,\n      y2: this.y + thumbRec.height / 2,\n    };\n\n    this.setValueByPosition(thumbRec, padRec);\n    this.cd.markForCheck();\n  }\n\n  setValueByPosition(thumbRec: DOMRect, padRec: DOMRect) {\n    const padCenterX = (padRec.width - thumbRec.width) / 2;\n    const padCenterY = (padRec.height - thumbRec.height) / 2;\n\n    // فاصله thumb از مرکز\n    const dx = this.x - padCenterX;\n    const dy = this.y - padCenterY;\n\n    // مقیاس تبدیل به -50 تا +50 (یا هرچقدر بخوای)\n    const halfRangeX = (padRec.width - thumbRec.width) / 2;\n    const halfRangeY = (padRec.height - thumbRec.height) / 2;\n\n    let valueX = (dx / halfRangeX) * this.maxRange; // -50 تا +50\n    let valueY = (dy / halfRangeY) * this.maxRange;\n\n    // رُند کردن\n    valueX = Math.round(valueX);\n    valueY = Math.round(valueY);\n\n    // محدود کردن به -50 تا +50 یا هر مقدار دلخواه\n    valueX = Math.min(Math.max(valueX, -this.maxRange), this.maxRange);\n    valueY = Math.min(Math.max(valueY, -this.maxRange), this.maxRange);\n\n    const newValue = { x: valueX, y: valueY };\n\n    if (!this.value || this.value.x !== valueX || this.value.y !== valueY) {\n      this.value = newValue;\n      this.onChangeData();\n    }\n  }\n\n  public onChangeValue() {\n    this.convertValueToPosition(this.value.x, this.value.y);\n    this.onChangeData();\n  }\n  private convertValueToPosition(offsetX: number, offsetY: number) {\n    if (!this.padRect || !this.thumbRect) this.updateRects();\n\n    // موقعیت پیشنهادی بر اساس offset\n    let proposedX = this.padRect!.width / 2 + offsetX - this.thumbRect!.width / 2;\n    let proposedY = this.padRect!.height / 2 + offsetY - this.thumbRect!.height / 2;\n\n    // محدود کردن (clamp) تا خارج از pad نره\n    const minX = 0;\n    const maxX = this.padRect!.width - this.thumbRect!.width;\n    const minY = 0;\n    const maxY = this.padRect!.height - this.thumbRect!.height;\n\n    this.x = Math.min(Math.max(proposedX, minX), maxX);\n    this.y = Math.min(Math.max(proposedY, minY), maxY);\n\n    // رسم خط راهنما از مرکز به thumb\n    this.line = {\n      x1: this.center.x,\n      y1: this.center.y,\n      x2: this.x + this.thumbRect!.width / 2,\n      y2: this.y + this.thumbRect!.height / 2,\n    };\n\n    this.cd.detectChanges();\n  }\n\n  onChangeData() {\n    const boxShadow = stringifyBoxShadow({\n      inset: false,\n      offsetX: this.value.x,\n      offsetY: this.value.y,\n      blurRadius: this.blur,\n      spreadRadius: this.spread,\n      color: this.color,\n    });\n    this._onChange(boxShadow);\n    this.change.emit(boxShadow);\n  }\n\n  stopPropagation(ev: Event) {\n    ev.stopPropagation();\n  }\n}\n","<div class=\"ngx-box-shadow-container\" (click)=\"stopPropagation($event)\">\n  <div class=\"pad-container\" #pad>\n    <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\">\n      <line\n        [attr.x1]=\"line.x1\"\n        [attr.y1]=\"line.y1\"\n        [attr.x2]=\"line.x2\"\n        [attr.y2]=\"line.y2\"\n        stroke=\"blue\"\n        stroke-width=\"2\" />\n    </svg>\n    <div\n      class=\"thumb\"\n      #thumb\n      [style.left.px]=\"x\"\n      [style.top.px]=\"y\"\n      (mousedown)=\"dragStart($event)\"\n      (touchstart)=\"dragStart($event)\"></div>\n  </div>\n\n  <div class=\"ngx-settings\">\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Offset X</span>\n        <input\n          type=\"number\"\n          id=\"offsetX\"\n          [(ngModel)]=\"value.x\"\n          name=\"offsetX\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"offsetX\"\n        [(ngModel)]=\"value.x\"\n        name=\"rangeOffsetX\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\"\n        [min]=\"-maxRange\"\n        [max]=\"maxRange\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Offset Y</span>\n        <input\n          type=\"number\"\n          id=\"offsetY\"\n          [(ngModel)]=\"value.y\"\n          name=\"offsetY\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"offsetY\"\n        [(ngModel)]=\"value.y\"\n        name=\"rangeOffsetY\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\"\n        [min]=\"-maxRange\"\n        [max]=\"maxRange\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Blur</span>\n        <input\n          type=\"number\"\n          id=\"blur\"\n          [(ngModel)]=\"blur\"\n          name=\"blur\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"blur\"\n        [(ngModel)]=\"blur\"\n        name=\"rangeBlur\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>Spread</span>\n        <input\n          type=\"number\"\n          id=\"spread\"\n          [(ngModel)]=\"spread\"\n          name=\"spread\"\n          (ngModelChange)=\"onChangeValue()\" />\n      </div>\n      <input\n        type=\"range\"\n        id=\"spread\"\n        [(ngModel)]=\"spread\"\n        name=\"rangeSpread\"\n        (ngModelChange)=\"onChangeValue()\"\n        step=\"1\" />\n    </div>\n    <div class=\"ngx-setting-item\">\n      <div class=\"ngx-row\">\n        <span>color</span>\n        <input\n          type=\"text\"\n          readonly\n          id=\"color\"\n          [(ngModel)]=\"color\"\n          name=\"color\"\n          ngxInputColor\n          [simpleMode]=\"true\"\n          (ngModelChange)=\"onChangeData()\"\n          autocomplete=\"off\" />\n      </div>\n    </div>\n  </div>\n</div>\n","import {\n  ComponentRef,\n  Directive,\n  ElementRef,\n  HostListener,\n  Inject,\n  Input,\n  OnDestroy,\n  Renderer2,\n  ViewContainerRef,\n  forwardRef,\n} from '@angular/core';\nimport {\n  AbstractControl,\n  ControlValueAccessor,\n  NG_VALIDATORS,\n  NG_VALUE_ACCESSOR,\n  ValidationErrors,\n  Validator,\n} from '@angular/forms';\nimport { DOCUMENT } from '@angular/common';\nimport { NgxBoxShadowComponent } from '../components/box-shadow.component';\nimport { OverlayRef, OverlayService } from 'ngx-kit/shared';\n\n@Directive({\n  selector: '[ngxInputBoxShadow]',\n  providers: [\n    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NgxInputBoxShadow), multi: true },\n    {\n      provide: NG_VALIDATORS,\n      multi: true,\n      useExisting: NgxInputBoxShadow,\n    },\n  ],\n})\nexport class NgxInputBoxShadow implements OnDestroy, ControlValueAccessor, Validator {\n  @Input() setInputBackground = true;\n\n  private pickerRef?: OverlayRef<NgxBoxShadowComponent>;\n\n  value = '';\n\n  protected _onChange = (value: string) => {};\n  protected _onTouched = () => {};\n  _onValidateChange = () => {};\n  constructor(\n    private el: ElementRef,\n    private viewContainerRef: ViewContainerRef,\n    private renderer: Renderer2,\n    private overlayService: OverlayService,\n  ) {}\n\n  @HostListener('click', ['$event']) onClick(ev: Event) {\n    ev.stopPropagation();\n    ev.preventDefault();\n    this.toggleColorPicker();\n  }\n\n  registerOnChange(fn: any): void {\n    this._onChange = fn;\n  }\n  registerOnTouched(fn: any): void {\n    this._onTouched = fn;\n  }\n  setDisabledState(disabled: boolean): void {\n    if (disabled) {\n      this.renderer.setProperty(this.el.nativeElement, 'disabled', disabled);\n    } else {\n      this.renderer.removeAttribute(this.el.nativeElement, 'disabled');\n    }\n  }\n  registerOnValidatorChange(fn: () => void): void {\n    this._onValidateChange = fn;\n  }\n  validate(control: AbstractControl): ValidationErrors | null {\n    return null;\n  }\n\n  ngOnDestroy(): void {\n    this.destroyPicker();\n  }\n\n  writeValue(value: any): void {\n    this.value = value;\n  }\n\n  toggleColorPicker() {\n    if (this.pickerRef) {\n      this.destroyPicker();\n      return;\n    }\n    this.pickerRef = this.overlayService.open({\n      anchor: this.el.nativeElement,\n      component: NgxBoxShadowComponent,\n      viewContainerRef: this.viewContainerRef,\n      alignment: 'start',\n      placement: 'auto',\n      configure: (instance, ref) => {\n        instance.writeValue(this.value);\n\n        instance.change.subscribe((c: string) => {\n          this._onChange(c);\n        });\n\n        // instance.closed.subscribe(() => ref.close());\n      },\n      onClosed: () => {\n        this.pickerRef = undefined;\n      },\n    });\n  }\n\n  destroyPicker() {\n    if (this.pickerRef) {\n      this.pickerRef.close();\n      this.pickerRef = undefined;\n    }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":";;;;;;;;SACgB,kBAAkB,CAAC,MAAc,EAAE,SAAS,GAAG,EAAE,EAAA;AAC/D,IAAA,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE;AAAE,QAAA,OAAO,IAAI;IAC3C,IAAI,KAAK,GAAG,KAAK;AACjB,IAAA,MAAM,GAAG,MAAM,CAAC,IAAI,EAAE;AAEtB,IAAA,IAAI,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE;QAC9B,KAAK,GAAG,IAAI;QACZ,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE;IACjC;IAEA,MAAM,UAAU,GACd,6PAA6P;IAC/P,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAC,UAAU,CAAC;IAC3C,IAAI,KAAK,GAAG,OAAO;IACnB,IAAI,UAAU,EAAE;AACd,QAAA,KAAK,GAAG,UAAU,CAAC,CAAC,CAAC;AACrB,QAAA,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE;IAC3C;AAEA,IAAA,MAAM,IAAI,GAAG,CAAC,KAAa,EAAE,IAAY,KAAY;AACnD,QAAA,QAAQ,IAAI,CAAC,WAAW,EAAE;AACxB,YAAA,KAAK,IAAI;AACT,YAAA,KAAK,EAAE;AACL,gBAAA,OAAO,KAAK;AACd,YAAA,KAAK,IAAI;AACT,YAAA,KAAK,KAAK;gBACR,OAAO,KAAK,GAAG,SAAS;AAC1B,YAAA,KAAK,GAAG;AACN,gBAAA,OAAO,CAAC,KAAK,GAAG,GAAG,IAAI,SAAS;AAClC,YAAA,KAAK,IAAI;gBACP,OAAO,KAAK,GAAG,KAAK;AACtB,YAAA;gBACE,OAAO,KAAK,CAAC;;AAEnB,IAAA,CAAC;IAED,MAAM,OAAO,GAAG,CAAC,GAAG,MAAM,CAAC,QAAQ,CAAC,4BAA4B,CAAC,CAAC;IAClE,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC;IAE3E,MAAM,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,MAAM;IAE/C,OAAO;QACL,KAAK;QACL,OAAO,EAAE,OAAO,IAAI,CAAC;QACrB,OAAO,EAAE,OAAO,IAAI,CAAC;QACrB,UAAU,EAAE,IAAI,IAAI,CAAC;QACrB,YAAY,EAAE,MAAM,IAAI,CAAC;QACzB,KAAK;KACN;AACH;AAEM,SAAU,kBAAkB,CAAC,GAAmB,EAAA;AACpD,IAAA,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,KAAK,EAAE,GAAG,GAAG;AAExE,IAAA,MAAM,KAAK,GAAG;AACZ,QAAA,KAAK,GAAG,OAAO,GAAG,EAAE;AACpB,QAAA,CAAA,EAAG,OAAO,CAAA,EAAA,CAAI;AACd,QAAA,CAAA,EAAG,OAAO,CAAA,EAAA,CAAI;AACd,QAAA,CAAA,EAAG,UAAU,CAAA,EAAA,CAAI;AACjB,QAAA,CAAA,EAAG,YAAY,CAAA,EAAA,CAAI;QACnB,KAAK;KACN;AAED,IAAA,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;AAC/C;;MCba,qBAAqB,CAAA;AAwCZ,IAAA,EAAA;IArCpB,KAAK,GAA8B,OAAO;IAC1C,IAAoB,QAAQ,CAAC,GAA8B,EAAA;AACzD,QAAA,IAAI,CAAC,GAAG,IAAI,GAAG,IAAI,MAAM,EAAE;AACzB,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,eAAe,GAAG,MAAM,GAAG,OAAO;QACrE;aAAO;AACL,YAAA,IAAI,CAAC,KAAK,GAAG,GAAG;QAClB;IACF;AACA;;;AAGG;IACM,QAAQ,GAAG,EAAE;AACZ,IAAA,MAAM,GAAG,IAAI,YAAY,EAAU;IAC7C,UAAU,GAAG,KAAK;IAClB,UAAU,GAAG,KAAK;IAClB,KAAK,GAAc,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IACjC,CAAC,GAAG,CAAC;IACL,CAAC,GAAG,CAAC;IACL,IAAI,GAAG,CAAC;IACR,MAAM,GAAG,CAAC;IACV,KAAK,GAAG,OAAO;AACf,IAAA,IAAI,GAAuD,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE;IACzF,MAAM,GAA6B,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AAEjD,IAAA,OAAO;AACP,IAAA,SAAS;AACC,IAAA,SAAS,GAAG,CAAC,KAAa,KAAI,EAAE,CAAC;AACjC,IAAA,UAAU,GAAG,MAAK,EAAE,CAAC;AAC/B,IAAA,iBAAiB,GAAG,MAAK,EAAE,CAAC;AACpB,IAAA,QAAQ;AAEoB,IAAA,GAAG;AACD,IAAA,KAAK;AAE3C,IAAA,cAAc,GAAG,MAAM,CAAC,cAAc,CAAC;AAEvC,IAAA,WAAA,CAAoB,EAAqB,EAAA;QAArB,IAAA,CAAA,EAAE,GAAF,EAAE;IAAsB;AAE5C,IAAA,QAAQ,KAAU;IAClB,eAAe,GAAA;QACb,IAAI,CAAC,WAAW,EAAE;IACpB;IACA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,QAAQ,IAAI;IACnB;AACA,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AACA,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;IACtB;AACA,IAAA,gBAAgB,CAAC,QAAiB,EAAA;AAChC,QAAA,IAAI,CAAC,UAAU,GAAG,QAAQ;IAC5B;AACA,IAAA,yBAAyB,CAAC,EAAc,EAAA;AACtC,QAAA,IAAI,CAAC,iBAAiB,GAAG,EAAE;IAC7B;AACA,IAAA,QAAQ,CAAC,OAAwB,EAAA;AAC/B,QAAA,OAAO,IAAI;IACb;AAEA,IAAA,UAAU,CAAC,KAAU,EAAA;QACnB,IAAI,CAAC,aAAa,EAAE;QACpB,IAAI,KAAK,EAAE;AACT,YAAA,MAAM,SAAS,GAAG,kBAAkB,CAAC,KAAK,CAAC;;YAE3C,IAAI,SAAS,EAAE;AACb,gBAAA,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,EAAE,SAAS,CAAC,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,OAAO,EAAE;AAC3D,gBAAA,IAAI,CAAC,IAAI,GAAG,SAAS,CAAC,UAAU;AAChC,gBAAA,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,YAAY;AACpC,gBAAA,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK;gBAC5B,IAAI,CAAC,sBAAsB,CAAC,SAAS,CAAC,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC;YACnE;QACF;IACF;AAEA,IAAA,SAAS,CAAC,EAA2B,EAAA;QACnC,EAAE,CAAC,eAAe,EAAE;QACpB,EAAE,CAAC,cAAc,EAAE;AACnB,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI;AACtB,QAAA,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC;QACvB,IAAI,CAAC,WAAW,EAAE;AAClB,QAAA,IAAI,CAAC,QAAQ,IAAI;AACjB,QAAA,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC;YAC/B,MAAM,EAAE,CAAC,MAAM,KAAK,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC;YAC/C,KAAK,EAAE,MAAK;AACV,gBAAA,IAAI,CAAC,UAAU,GAAG,KAAK;AACvB,gBAAA,IAAI,CAAC,QAAQ,GAAG,SAAS;AACzB,gBAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;YACxB,CAAC;AACF,SAAA,CAAC;IACJ;IACQ,WAAW,GAAA;QACjB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,qBAAqB,EAAE;QAC7D,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,qBAAqB,EAAE;IACnE;IACQ,aAAa,GAAA;QACnB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,IAAI,CAAC,WAAW,EAAE;QACxD,IAAI,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,IAAI,CAAC,OAAQ,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,OAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;AACzE,QAAA,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC,SAAU,CAAC,KAAK,GAAG,CAAC;AAClD,QAAA,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC,SAAU,CAAC,MAAM,GAAG,CAAC;AACnD,QAAA,IAAI,CAAC,IAAI,GAAG,EAAE,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE;AAC1F,QAAA,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE;IACzB;IAGA,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;IAC7B;AAEQ,IAAA,cAAc,CAAC,EAA2B,EAAA;QAChD,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE;QACtB,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,IAAI,CAAC,WAAW,EAAE;AACxD,QAAA,MAAM,QAAQ,GAAG,iBAAiB,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;AAE9D,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,OAAQ;AAC5B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAU;AAEhC,QAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,KAAK,GAAG,CAAC;QAC/B,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,GAAG,CAAC;AAC9C,QAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC;QAChC,MAAM,IAAI,GAAG,MAAM,CAAC,MAAM,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC;AAEhD,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;AAC3D,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;;QAG3D,IAAI,CAAC,CAAC,GAAG,QAAQ,GAAG,QAAQ,CAAC,KAAK,GAAG,CAAC;QACtC,IAAI,CAAC,CAAC,GAAG,QAAQ,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC;QAEvC,IAAI,CAAC,IAAI,GAAG;AACV,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;AACjB,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YACjB,EAAE,EAAE,IAAI,CAAC,CAAC,GAAG,QAAQ,CAAC,KAAK,GAAG,CAAC;YAC/B,EAAE,EAAE,IAAI,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC;SACjC;AAED,QAAA,IAAI,CAAC,kBAAkB,CAAC,QAAQ,EAAE,MAAM,CAAC;AACzC,QAAA,IAAI,CAAC,EAAE,CAAC,YAAY,EAAE;IACxB;IAEA,kBAAkB,CAAC,QAAiB,EAAE,MAAe,EAAA;AACnD,QAAA,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,IAAI,CAAC;AACtD,QAAA,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,MAAM,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC;;AAGxD,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,CAAC,GAAG,UAAU;AAC9B,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,CAAC,GAAG,UAAU;;AAG9B,QAAA,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK,IAAI,CAAC;AACtD,QAAA,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,MAAM,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC;AAExD,QAAA,IAAI,MAAM,GAAG,CAAC,EAAE,GAAG,UAAU,IAAI,IAAI,CAAC,QAAQ,CAAC;QAC/C,IAAI,MAAM,GAAG,CAAC,EAAE,GAAG,UAAU,IAAI,IAAI,CAAC,QAAQ;;AAG9C,QAAA,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;AAC3B,QAAA,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;;QAG3B,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;QAClE,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;QAElE,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE;QAEzC,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,MAAM,EAAE;AACrE,YAAA,IAAI,CAAC,KAAK,GAAG,QAAQ;YACrB,IAAI,CAAC,YAAY,EAAE;QACrB;IACF;IAEO,aAAa,GAAA;AAClB,QAAA,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;QACvD,IAAI,CAAC,YAAY,EAAE;IACrB;IACQ,sBAAsB,CAAC,OAAe,EAAE,OAAe,EAAA;QAC7D,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,IAAI,CAAC,WAAW,EAAE;;AAGxD,QAAA,IAAI,SAAS,GAAG,IAAI,CAAC,OAAQ,CAAC,KAAK,GAAG,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC,SAAU,CAAC,KAAK,GAAG,CAAC;AAC7E,QAAA,IAAI,SAAS,GAAG,IAAI,CAAC,OAAQ,CAAC,MAAM,GAAG,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC,SAAU,CAAC,MAAM,GAAG,CAAC;;QAG/E,MAAM,IAAI,GAAG,CAAC;AACd,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAQ,CAAC,KAAK,GAAG,IAAI,CAAC,SAAU,CAAC,KAAK;QACxD,MAAM,IAAI,GAAG,CAAC;AACd,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAQ,CAAC,MAAM,GAAG,IAAI,CAAC,SAAU,CAAC,MAAM;AAE1D,QAAA,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,EAAE,IAAI,CAAC;AAClD,QAAA,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,EAAE,IAAI,CAAC;;QAGlD,IAAI,CAAC,IAAI,GAAG;AACV,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;AACjB,YAAA,EAAE,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YACjB,EAAE,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,SAAU,CAAC,KAAK,GAAG,CAAC;YACtC,EAAE,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,SAAU,CAAC,MAAM,GAAG,CAAC;SACxC;AAED,QAAA,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE;IACzB;IAEA,YAAY,GAAA;QACV,MAAM,SAAS,GAAG,kBAAkB,CAAC;AACnC,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;AACrB,YAAA,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;YACrB,UAAU,EAAE,IAAI,CAAC,IAAI;YACrB,YAAY,EAAE,IAAI,CAAC,MAAM;YACzB,KAAK,EAAE,IAAI,CAAC,KAAK;AAClB,SAAA,CAAC;AACF,QAAA,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC;AACzB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC;IAC7B;AAEA,IAAA,eAAe,CAAC,EAAS,EAAA;QACvB,EAAE,CAAC,eAAe,EAAE;IACtB;uGA9NW,qBAAqB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,CAAA,OAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,eAAA,EAAA,YAAA,EAAA,EAAA,UAAA,EAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,SAAA,EAjBrB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,qBAAqB,CAAC;AACpD,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;AACD,YAAA;AACE,gBAAA,OAAO,EAAE,aAAa;AACtB,gBAAA,KAAK,EAAE,IAAI;AACX,gBAAA,WAAW,EAAE,qBAAqB;AACnC,aAAA;AACF,SAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,KAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,KAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,OAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC9CH,6kGAkHA,EAAA,MAAA,EAAA,CAAA,8uCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDnEY,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,wSAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,8IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,2IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,aAAa,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,YAAA,EAAA,YAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,eAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAKzB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAtBjC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,gBAAgB,EAAA,eAAA,EAGT,uBAAuB,CAAC,MAAM,EAAA,SAAA,EACpC;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,2BAA2B,CAAC;AACpD,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACD,wBAAA;AACE,4BAAA,OAAO,EAAE,aAAa;AACtB,4BAAA,KAAK,EAAE,IAAI;AACX,4BAAA,WAAW,EAAA,qBAAuB;AACnC,yBAAA;AACF,qBAAA,EAAA,OAAA,EACQ,CAAC,WAAW,EAAE,aAAa,CAAC,EAAA,IAAA,EAC/B;AACJ,wBAAA,cAAc,EAAE,eAAe;AAChC,qBAAA,EAAA,QAAA,EAAA,6kGAAA,EAAA,MAAA,EAAA,CAAA,8uCAAA,CAAA,EAAA;;sBAMA,KAAK;uBAAC,OAAO;;sBAWb;;sBACA;;sBAmBA,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;sBACjC,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,OAAO,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;sBAyEnC,YAAY;uBAAC,eAAe;;;ME9HlB,iBAAiB,CAAA;AAWlB,IAAA,EAAA;AACA,IAAA,gBAAA;AACA,IAAA,QAAA;AACA,IAAA,cAAA;IAbD,kBAAkB,GAAG,IAAI;AAE1B,IAAA,SAAS;IAEjB,KAAK,GAAG,EAAE;AAEA,IAAA,SAAS,GAAG,CAAC,KAAa,KAAI,EAAE,CAAC;AACjC,IAAA,UAAU,GAAG,MAAK,EAAE,CAAC;AAC/B,IAAA,iBAAiB,GAAG,MAAK,EAAE,CAAC;AAC5B,IAAA,WAAA,CACU,EAAc,EACd,gBAAkC,EAClC,QAAmB,EACnB,cAA8B,EAAA;QAH9B,IAAA,CAAA,EAAE,GAAF,EAAE;QACF,IAAA,CAAA,gBAAgB,GAAhB,gBAAgB;QAChB,IAAA,CAAA,QAAQ,GAAR,QAAQ;QACR,IAAA,CAAA,cAAc,GAAd,cAAc;IACrB;AAEgC,IAAA,OAAO,CAAC,EAAS,EAAA;QAClD,EAAE,CAAC,eAAe,EAAE;QACpB,EAAE,CAAC,cAAc,EAAE;QACnB,IAAI,CAAC,iBAAiB,EAAE;IAC1B;AAEA,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AACA,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;IACtB;AACA,IAAA,gBAAgB,CAAC,QAAiB,EAAA;QAChC,IAAI,QAAQ,EAAE;AACZ,YAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,UAAU,EAAE,QAAQ,CAAC;QACxE;aAAO;AACL,YAAA,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,UAAU,CAAC;QAClE;IACF;AACA,IAAA,yBAAyB,CAAC,EAAc,EAAA;AACtC,QAAA,IAAI,CAAC,iBAAiB,GAAG,EAAE;IAC7B;AACA,IAAA,QAAQ,CAAC,OAAwB,EAAA;AAC/B,QAAA,OAAO,IAAI;IACb;IAEA,WAAW,GAAA;QACT,IAAI,CAAC,aAAa,EAAE;IACtB;AAEA,IAAA,UAAU,CAAC,KAAU,EAAA;AACnB,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK;IACpB;IAEA,iBAAiB,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,aAAa,EAAE;YACpB;QACF;QACA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;AACxC,YAAA,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,aAAa;AAC7B,YAAA,SAAS,EAAE,qBAAqB;YAChC,gBAAgB,EAAE,IAAI,CAAC,gBAAgB;AACvC,YAAA,SAAS,EAAE,OAAO;AAClB,YAAA,SAAS,EAAE,MAAM;AACjB,YAAA,SAAS,EAAE,CAAC,QAAQ,EAAE,GAAG,KAAI;AAC3B,gBAAA,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;gBAE/B,QAAQ,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAS,KAAI;AACtC,oBAAA,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;AACnB,gBAAA,CAAC,CAAC;;YAGJ,CAAC;YACD,QAAQ,EAAE,MAAK;AACb,gBAAA,IAAI,CAAC,SAAS,GAAG,SAAS;YAC5B,CAAC;AACF,SAAA,CAAC;IACJ;IAEA,aAAa,GAAA;AACX,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE;AACtB,YAAA,IAAI,CAAC,SAAS,GAAG,SAAS;QAC5B;IACF;uGAlFW,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,EAAA,EAAA,KAAA,EAAAA,IAAA,CAAA,cAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,SAAA,EATjB;AACT,YAAA,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,CAAC,MAAM,iBAAiB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE;AAC7F,YAAA;AACE,gBAAA,OAAO,EAAE,aAAa;AACtB,gBAAA,KAAK,EAAE,IAAI;AACX,gBAAA,WAAW,EAAE,iBAAiB;AAC/B,aAAA;AACF,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAEU,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAX7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qBAAqB;AAC/B,oBAAA,SAAS,EAAE;AACT,wBAAA,EAAE,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,CAAC,uBAAuB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE;AAC7F,wBAAA;AACE,4BAAA,OAAO,EAAE,aAAa;AACtB,4BAAA,KAAK,EAAE,IAAI;AACX,4BAAA,WAAW,EAAA,iBAAmB;AAC/B,yBAAA;AACF,qBAAA;AACF,iBAAA;;sBAEE;;sBAgBA,YAAY;uBAAC,OAAO,EAAE,CAAC,QAAQ,CAAC;;;ACpDnC;;AAEG;;;;"}
+{"version":3,"file":"ngx-kit-box-shadow.mjs","sources":["../../../projects/libs/box-shadow/utils/box-shadow.ts","../../../projects/libs/box-shadow/components/box-shadow.component.ts","../../../projects/libs/box-shadow/components/box-shadow.component.html","../../../projects/libs/box-shadow/directives/ngx-input-box-shadow.directive.ts","../../../projects/libs/box-shadow/ngx-kit-box-shadow.ts"],"sourcesContent":["import { BoxShadowValue } from '../contracts/BoxShadowValue';\nexport function parseBoxShadowToPx(shadow: string, contextPx = 16): BoxShadowValue | null {\n  if (!shadow || !shadow?.trim()) return null;\n  let inset = false;\n  shadow = shadow.trim();\n\n  if (shadow.startsWith('inset')) {\n    inset = true;\n    shadow = shadow.slice(5).trim();\n  }\n\n  const colorRegex =\n    /(#(?:[a-f0-9]{3}|[a-f0-9]{6}|[a-f0-9]{4}|[a-f0-9]{8})\\b|rgb\\(\\d{1,3},\\s*\\d{1,3},\\s*\\d{1,3}\\)|rgba\\(\\d{1,3},\\s*\\d{1,3},\\s*\\d{1,3},\\s*\\d*(?:\\.\\d+)?\\)|hsl\\(\\s*\\d+,\\s*\\d*(?:\\.\\d+)?%,\\s*\\d*(?:\\.\\d+)?%\\)|hsla\\(\\d+,\\s*[\\d.]+%,\\s*[\\d.]+%,\\s*\\d*(?:\\.\\d+)?\\))/gi;\n  const colorMatch = shadow.match(colorRegex);\n  let color = 'black';\n  if (colorMatch) {\n    color = colorMatch[0];\n    shadow = shadow.replace(color, '').trim();\n  }\n\n  const toPx = (value: number, unit: string): number => {\n    switch (unit.toLowerCase()) {\n      case 'px':\n      case '':\n        return value;\n      case 'em':\n      case 'rem':\n        return value * contextPx;\n      case '%':\n        return (value / 100) * contextPx;\n      case 'pt':\n        return value * 1.333;\n      default:\n        return value; // fallback\n    }\n  };\n\n  const matches = [...shadow.matchAll(/(-?\\d*\\.?\\d+)([a-zA-Z%]*)/g)];\n  const values = matches.map(([_, num, unit]) => toPx(parseFloat(num), unit));\n\n  const [offsetX, offsetY, blur, spread] = values;\n\n  return {\n    inset,\n    offsetX: offsetX ?? 0,\n    offsetY: offsetY ?? 0,\n    blurRadius: blur ?? 0,\n    spreadRadius: spread ?? 0,\n    color,\n  };\n}\n\nexport function stringifyBoxShadow(obj: BoxShadowValue): string {\n  const { inset, offsetX, offsetY, blurRadius, spreadRadius, color } = obj;\n\n  const parts = [\n    inset ? 'inset' : '',\n    `${offsetX}px`,\n    `${offsetY}px`,\n    `${blurRadius}px`,\n    `${spreadRadius}px`,\n    color,\n  ];\n\n  return parts.filter(Boolean).join(' ').trim();\n}\n","import {\r\n  Component,\r\n  ChangeDetectionStrategy,\r\n  forwardRef,\r\n  OnInit,\r\n  OnDestroy,\r\n  ChangeDetectorRef,\r\n  HostListener,\r\n  ElementRef,\r\n  ViewChild,\r\n  AfterViewInit,\r\n  Input,\r\n  Output,\r\n  EventEmitter,\r\n  inject,\r\n} from '@angular/core';\r\nimport {\r\n  NG_VALUE_ACCESSOR,\r\n  NG_VALIDATORS,\r\n  FormsModule,\r\n  ControlValueAccessor,\r\n  Validator,\r\n  AbstractControl,\r\n  ValidationErrors,\r\n} from '@angular/forms';\r\nimport { parseBoxShadowToPx, stringifyBoxShadow } from '../utils/box-shadow';\r\nimport { IPosition, getOffsetPosition, startDragSession } from 'ngx-kit/shared';\r\nimport { NgxInputColor } from 'ngx-kit/color-picker';\r\nimport { BrowserService } from 'ngx-kit/shared';\r\n\r\n@Component({\r\n  selector: 'ngx-box-shadow',\r\n  templateUrl: './box-shadow.component.html',\r\n  styleUrls: ['./box-shadow.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  providers: [\r\n    {\r\n      provide: NG_VALUE_ACCESSOR,\r\n      useExisting: forwardRef(() => NgxBoxShadowComponent),\r\n      multi: true,\r\n    },\r\n    {\r\n      provide: NG_VALIDATORS,\r\n      multi: true,\r\n      useExisting: NgxBoxShadowComponent,\r\n    },\r\n  ],\r\n  imports: [FormsModule, NgxInputColor],\r\n  host: {\r\n    '[class.dark]': 'theme==\"dark\"',\r\n  },\r\n})\r\nexport class NgxBoxShadowComponent\r\n  implements OnInit, AfterViewInit, OnDestroy, ControlValueAccessor, Validator\r\n{\r\n  theme: 'light' | 'dark' | 'auto' = 'light';\r\n  @Input('theme') set setTheme(val: 'light' | 'dark' | 'auto') {\r\n    if (!val || val == 'auto') {\r\n      this.theme = this.browserService.prefersDarkMode ? 'dark' : 'light';\r\n    } else {\r\n      this.theme = val;\r\n    }\r\n  }\r\n  /**\r\n   * The maximum range of the box shadow.\r\n   * @default 25\r\n   */\r\n  @Input() maxRange = 25;\r\n  @Output() change = new EventEmitter<string>();\r\n  isDisabled = false;\r\n  isDragging = false;\r\n  value: IPosition = { x: 0, y: 0 };\r\n  x = 0;\r\n  y = 0;\r\n  blur = 0;\r\n  spread = 0;\r\n  color = 'black';\r\n  line: { x1: number; y1: number; x2: number; y2: number } = { x1: 0, y1: 0, x2: 0, y2: 0 };\r\n  center: { x: number; y: number } = { x: 0, y: 0 };\r\n\r\n  padRect?: DOMRect;\r\n  thumbRect?: DOMRect;\r\n  protected _onChange = (value: string) => {};\r\n  protected _onTouched = () => {};\r\n  _onValidateChange = () => {};\r\n  private stopDrag?: () => void;\r\n\r\n  @ViewChild('pad', { static: true }) pad!: ElementRef<HTMLDivElement>;\r\n  @ViewChild('thumb', { static: true }) thumb!: ElementRef<HTMLDivElement>;\r\n\r\n  browserService = inject(BrowserService);\r\n\r\n  constructor(private cd: ChangeDetectorRef) {}\r\n\r\n  ngOnInit(): void {}\r\n  ngAfterViewInit(): void {\r\n    this.updateRects();\r\n  }\r\n  ngOnDestroy(): void {\r\n    this.stopDrag?.();\r\n  }\r\n  registerOnChange(fn: any): void {\r\n    this._onChange = fn;\r\n  }\r\n  registerOnTouched(fn: any): void {\r\n    this._onTouched = fn;\r\n  }\r\n  setDisabledState(disabled: boolean): void {\r\n    this.isDisabled = disabled;\r\n  }\r\n  registerOnValidatorChange(fn: () => void): void {\r\n    this._onValidateChange = fn;\r\n  }\r\n  validate(control: AbstractControl): ValidationErrors | null {\r\n    return null;\r\n  }\r\n\r\n  writeValue(value: any): void {\r\n    this.resetPosition();\r\n    if (value) {\r\n      const boxShadow = parseBoxShadowToPx(value);\r\n      // console.log(boxShadow);\r\n      if (boxShadow) {\r\n        this.value = { x: boxShadow.offsetX, y: boxShadow.offsetY };\r\n        this.blur = boxShadow.blurRadius;\r\n        this.spread = boxShadow.spreadRadius;\r\n        this.color = boxShadow.color;\r\n        this.convertValueToPosition(boxShadow.offsetX, boxShadow.offsetY);\r\n      }\r\n    }\r\n  }\r\n\r\n  dragStart(ev: MouseEvent | TouchEvent) {\r\n    ev.stopPropagation();\r\n    ev.preventDefault();\r\n    this.isDragging = true;\r\n    this.updatePosition(ev);\r\n    this.updateRects();\r\n    this.stopDrag?.();\r\n    this.stopDrag = startDragSession({\r\n      onMove: (moveEv) => this.updatePosition(moveEv),\r\n      onEnd: () => {\r\n        this.isDragging = false;\r\n        this.stopDrag = undefined;\r\n        this.cd.markForCheck();\r\n      },\r\n    });\r\n  }\r\n  private updateRects() {\r\n    this.padRect = this.pad.nativeElement.getBoundingClientRect();\r\n    this.thumbRect = this.thumb.nativeElement.getBoundingClientRect();\r\n  }\r\n  private resetPosition() {\r\n    if (!this.padRect || !this.thumbRect) this.updateRects();\r\n    this.center = { x: this.padRect!.width / 2, y: this.padRect!.height / 2 };\r\n    this.x = this.center.x - this.thumbRect!.width / 2;\r\n    this.y = this.center.y - this.thumbRect!.height / 2;\r\n    this.line = { x1: this.center.x, y1: this.center.y, x2: this.center.x, y2: this.center.y };\r\n    this.cd.detectChanges();\r\n  }\r\n\r\n  @HostListener('window:resize')\r\n  onResize() {\r\n    this.writeValue(this.value);\r\n  }\r\n\r\n  private updatePosition(ev: MouseEvent | TouchEvent) {\r\n    if (!this.isDragging) return;\r\n    if (!this.padRect || !this.thumbRect) this.updateRects();\r\n    const position = getOffsetPosition(ev, this.pad.nativeElement);\r\n\r\n    const padRec = this.padRect!;\r\n    const thumbRec = this.thumbRect!;\r\n\r\n    const minX = thumbRec.width / 2;\r\n    const maxX = padRec.width - thumbRec.width / 2;\r\n    const minY = thumbRec.height / 2;\r\n    const maxY = padRec.height - thumbRec.height / 2;\r\n\r\n    const clampedX = Math.max(minX, Math.min(position.x, maxX));\r\n    const clampedY = Math.max(minY, Math.min(position.y, maxY));\r\n\r\n    // فقط یکبار از وسط اصلاح کن\r\n    this.x = clampedX - thumbRec.width / 2;\r\n    this.y = clampedY - thumbRec.height / 2;\r\n\r\n    this.line = {\r\n      x1: this.center.x,\r\n      y1: this.center.y,\r\n      x2: this.x + thumbRec.width / 2,\r\n      y2: this.y + thumbRec.height / 2,\r\n    };\r\n\r\n    this.setValueByPosition(thumbRec, padRec);\r\n    this.cd.markForCheck();\r\n  }\r\n\r\n  setValueByPosition(thumbRec: DOMRect, padRec: DOMRect) {\r\n    const padCenterX = (padRec.width - thumbRec.width) / 2;\r\n    const padCenterY = (padRec.height - thumbRec.height) / 2;\r\n\r\n    // فاصله thumb از مرکز\r\n    const dx = this.x - padCenterX;\r\n    const dy = this.y - padCenterY;\r\n\r\n    // مقیاس تبدیل به -50 تا +50 (یا هرچقدر بخوای)\r\n    const halfRangeX = (padRec.width - thumbRec.width) / 2;\r\n    const halfRangeY = (padRec.height - thumbRec.height) / 2;\r\n\r\n    let valueX = (dx / halfRangeX) * this.maxRange; // -50 تا +50\r\n    let valueY = (dy / halfRangeY) * this.maxRange;\r\n\r\n    // رُند کردن\r\n    valueX = Math.round(valueX);\r\n    valueY = Math.round(valueY);\r\n\r\n    // محدود کردن به -50 تا +50 یا هر مقدار دلخواه\r\n    valueX = Math.min(Math.max(valueX, -this.maxRange), this.maxRange);\r\n    valueY = Math.min(Math.max(valueY, -this.maxRange), this.maxRange);\r\n\r\n    const newValue = { x: valueX, y: valueY };\r\n\r\n    if (!this.value || this.value.x !== valueX || this.value.y !== valueY) {\r\n      this.value = newValue;\r\n      this.onChangeData();\r\n    }\r\n  }\r\n\r\n  public onChangeValue() {\r\n    this.convertValueToPosition(this.value.x, this.value.y);\r\n    this.onChangeData();\r\n  }\r\n  private convertValueToPosition(offsetX: number, offsetY: number) {\r\n    if (!this.padRect || !this.thumbRect) this.updateRects();\r\n\r\n    // موقعیت پیشنهادی بر اساس offset\r\n    let proposedX = this.padRect!.width / 2 + offsetX - this.thumbRect!.width / 2;\r\n    let proposedY = this.padRect!.height / 2 + offsetY - this.thumbRect!.height / 2;\r\n\r\n    // محدود کردن (clamp) تا خارج از pad نره\r\n    const minX = 0;\r\n    const maxX = this.padRect!.width - this.thumbRect!.width;\r\n    const minY = 0;\r\n    const maxY = this.padRect!.height - this.thumbRect!.height;\r\n\r\n    this.x = Math.min(Math.max(proposedX, minX), maxX);\r\n    this.y = Math.min(Math.max(proposedY, minY), maxY);\r\n\r\n    // رسم خط راهنما از مرکز به thumb\r\n    this.line = {\r\n      x1: this.center.x,\r\n      y1: this.center.y,\r\n      x2: this.x + this.thumbRect!.width / 2,\r\n      y2: this.y + this.thumbRect!.height / 2,\r\n    };\r\n\r\n    this.cd.detectChanges();\r\n  }\r\n\r\n  onChangeData() {\r\n    const boxShadow = stringifyBoxShadow({\r\n      inset: false,\r\n      offsetX: this.value.x,\r\n      offsetY: this.value.y,\r\n      blurRadius: this.blur,\r\n      spreadRadius: this.spread,\r\n      color: this.color,\r\n    });\r\n    this._onChange(boxShadow);\r\n    this.change.emit(boxShadow);\r\n  }\r\n\r\n  stopPropagation(ev: Event) {\r\n    ev.stopPropagation();\r\n  }\r\n}\r\n","<div class=\"ngx-box-shadow-container\" (click)=\"stopPropagation($event)\">\r\n  <div class=\"pad-container\" #pad>\r\n    <svg viewBox=\"0 0 100 100\" xmlns=\"http://www.w3.org/2000/svg\">\r\n      <line\r\n        [attr.x1]=\"line.x1\"\r\n        [attr.y1]=\"line.y1\"\r\n        [attr.x2]=\"line.x2\"\r\n        [attr.y2]=\"line.y2\"\r\n        stroke=\"blue\"\r\n        stroke-width=\"2\" />\r\n    </svg>\r\n    <div\r\n      class=\"thumb\"\r\n      #thumb\r\n      [style.left.px]=\"x\"\r\n      [style.top.px]=\"y\"\r\n      (mousedown)=\"dragStart($event)\"\r\n      (touchstart)=\"dragStart($event)\"></div>\r\n  </div>\r\n\r\n  <div class=\"ngx-settings\">\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Offset X</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"offsetX\"\r\n          [(ngModel)]=\"value.x\"\r\n          name=\"offsetX\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"offsetX\"\r\n        [(ngModel)]=\"value.x\"\r\n        name=\"rangeOffsetX\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\"\r\n        [min]=\"-maxRange\"\r\n        [max]=\"maxRange\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Offset Y</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"offsetY\"\r\n          [(ngModel)]=\"value.y\"\r\n          name=\"offsetY\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"offsetY\"\r\n        [(ngModel)]=\"value.y\"\r\n        name=\"rangeOffsetY\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\"\r\n        [min]=\"-maxRange\"\r\n        [max]=\"maxRange\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Blur</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"blur\"\r\n          [(ngModel)]=\"blur\"\r\n          name=\"blur\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"blur\"\r\n        [(ngModel)]=\"blur\"\r\n        name=\"rangeBlur\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>Spread</span>\r\n        <input\r\n          type=\"number\"\r\n          id=\"spread\"\r\n          [(ngModel)]=\"spread\"\r\n          name=\"spread\"\r\n          (ngModelChange)=\"onChangeValue()\" />\r\n      </div>\r\n      <input\r\n        type=\"range\"\r\n        id=\"spread\"\r\n        [(ngModel)]=\"spread\"\r\n        name=\"rangeSpread\"\r\n        (ngModelChange)=\"onChangeValue()\"\r\n        step=\"1\" />\r\n    </div>\r\n    <div class=\"ngx-setting-item\">\r\n      <div class=\"ngx-row\">\r\n        <span>color</span>\r\n        <input\r\n          type=\"text\"\r\n          readonly\r\n          id=\"color\"\r\n          [(ngModel)]=\"color\"\r\n          name=\"color\"\r\n          ngxInputColor\r\n          [simpleMode]=\"true\"\r\n          (ngModelChange)=\"onChangeData()\"\r\n          autocomplete=\"off\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n","import {\r\n  ComponentRef,\r\n  Directive,\r\n  ElementRef,\r\n  HostListener,\r\n  Inject,\r\n  Input,\r\n  OnDestroy,\r\n  Renderer2,\r\n  ViewContainerRef,\r\n  forwardRef,\r\n} from '@angular/core';\r\nimport {\r\n  AbstractControl,\r\n  ControlValueAccessor,\r\n  NG_VALIDATORS,\r\n  NG_VALUE_ACCESSOR,\r\n  ValidationErrors,\r\n  Validator,\r\n} from '@angular/forms';\r\nimport { DOCUMENT } from '@angular/common';\r\nimport { NgxBoxShadowComponent } from '../components/box-shadow.component';\r\nimport { OverlayRef, OverlayService } from 'ngx-kit/shared';\r\n\r\n@Directive({\r\n  selector: '[ngxInputBoxShadow]',\r\n  providers: [\r\n    { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NgxInputBoxShadow), multi: true },\r\n    {\r\n      provide: NG_VALIDATORS,\r\n      multi: true,\r\n      useExisting: NgxInputBoxShadow,\r\n    },\r\n  ],\r\n})\r\nexport class NgxInputBoxShadow implements OnDestroy, ControlValueAccessor, Validator {\r\n  @Input() setInputBackground = true;\r\n\r\n  private pickerRef?: OverlayRef<NgxBoxShadowComponent>;\r\n\r\n  value = '';\r\n\r\n  protected _onChange = (value: string) => {};\r\n  protected _onTouched = () => {};\r\n  _onValidateChange = () => {};\r\n  constructor(\r\n    private el: ElementRef,\r\n    private viewContainerRef: ViewContainerRef,\r\n    private renderer: Renderer2,\r\n    private overlayService: OverlayService,\r\n  ) {}\r\n\r\n  @HostListener('click', ['$event']) onClick(ev: Event) {\r\n    ev.stopPropagation();\r\n    ev.preventDefault();\r\n    this.toggleColorPicker();\r\n  }\r\n\r\n  registerOnChange(fn: any): void {\r\n    this._onChange = fn;\r\n  }\r\n  registerOnTouched(fn: any): void {\r\n    this._onTouched = fn;\r\n  }\r\n  setDisabledState(disabled: boolean): void {\r\n    if (disabled) {\r\n      this.renderer.setProperty(this.el.nativeElement, 'disabled', disabled);\r\n    } else {\r\n      this.renderer.removeAttribute(this.el.nativeElement, 'disabled');\r\n    }\r\n  }\r\n  registerOnValidatorChange(fn: () => void): void {\r\n    this._onValidateChange = fn;\r\n  }\r\n  validate(control: AbstractControl): ValidationErrors | null {\r\n    return null;\r\n  }\r\n\r\n  ngOnDestroy(): void {\r\n    this.destroyPicker();\r\n  }\r\n\r\n  writeValue(value: any): void {\r\n    this.value = value;\r\n  }\r\n\r\n  toggleColorPicker() {\r\n    if (this.pickerRef) {\r\n      this.destroyPicker();\r\n      return;\r\n    }\r\n    this.pickerRef = this.overlayService.open({\r\n      anchor: this.el.nativeElement,\r\n      component: NgxBoxShadowComponent,\r\n      viewContainerRef: this.viewContainerRef,\r\n      alignment: 'start',\r\n      placement: 'auto',\r\n      configure: (instance, ref) => {\r\n        instance.writeValue(this.value);\r\n\r\n        instance.change.subscribe((c: string) => {\r\n          this._onChange(c);\r\n        });\r\n\r\n        // instance.closed.subscribe(() => ref.close());\r\n      },\r\n      onClosed: () => {\r\n        this.pickerRef = undefined;\r\n      },\r\n    });\r\n  }\r\n\r\n  destroyPicker() {\r\n    if (this.pickerRef) {\r\n      this.pickerRef.close();\r\n      this.pickerRef = undefined;\r\n    }\r\n  }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}

package/fesm2022/ngx-kit-color-picker.mjs

@@ -995,11 +995,11 @@ class HslComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: HslComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: HslComponent, isStandalone: true, selector: "app-hsl", inputs: { color: "color", useAlphaChannel: "useAlphaChannel" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<slider\n  [(ngModel)]=\"hue\"\n  name=\"hue\"\n  [min]=\"0\"\n  [max]=\"360\"\n  [step]=\"1\"\n  (change)=\"generateColor()\"\n  background=\"linear-gradient(to right,red 0%,#ff0 17%,lime 33%,cyan 50%,blue 66%,#f0f 83%,red 100%)\">\n  <div class=\"slider-title\">\n    <span>Hue</span>\n    <input type=\"number\" [(ngModel)]=\"hue\" name=\"inputHue\" min=\"0\" max=\"360\" step=\"1\" />\n  </div>\n</slider>\n<slider\n  [(ngModel)]=\"saturation\"\n  name=\"saturation\"\n  [min]=\"0\"\n  [max]=\"100\"\n  [step]=\"1\"\n  (change)=\"generateColor()\"\n  [background]=\"'linear-gradient(to right,#808080,' + baseColor + ')'\">\n  <div class=\"slider-title\">\n    <span>Saturation</span>\n    <input\n      type=\"number\"\n      [(ngModel)]=\"saturation\"\n      name=\"inputSaturation\"\n      min=\"0\"\n      max=\"100\"\n      step=\"1\" />\n  </div>\n</slider>\n<slider\n  [(ngModel)]=\"luminance\"\n  name=\"luminance\"\n  [min]=\"0\"\n  [max]=\"100\"\n  [step]=\"1\"\n  (change)=\"generateColor()\"\n  [background]=\"'linear-gradient(to right,black,' + baseColor + ',white)'\">\n  <div class=\"slider-title\">\n    <span>Luminance</span>\n    <input type=\"number\" [(ngModel)]=\"luminance\" name=\"inputLuminance\" min=\"0\" max=\"100\" step=\"1\" />\n  </div>\n</slider>\n@if (useAlphaChannel) {\n  <slider\n    [(ngModel)]=\"alpha\"\n    name=\"alpha\"\n    [min]=\"0\"\n    [max]=\"1\"\n    [step]=\"0.1\"\n    (change)=\"generateColor()\"\n    [isBgTransparent]=\"true\"\n    [background]=\"'linear-gradient(to right,transparent,' + baseColor + ')'\">\n    <div class=\"slider-title\">\n      <span>Alpha</span>\n      <input type=\"number\" [(ngModel)]=\"alpha\" name=\"inputAlpha\" min=\"0\" max=\"1\" step=\"0.1\" />\n    </div>\n  </slider>\n}\n", styles: [".slider-title{display:flex;align-items:center;justify-content:space-between}.slider-title input{transition:box-shadow .1s;box-shadow:inset #d8d8da 0 0 0 1px,inset #fff 0 0 0 100px;border:none;width:48px;color:#000;font-family:Inter,sans-serif;padding:5px 6px;border-radius:5px;font-size:12px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SliderComponent, selector: "slider", inputs: ["step", "min", "max", "background", "isBgTransparent"], outputs: ["change"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: HslComponent, isStandalone: true, selector: "app-hsl", inputs: { color: "color", useAlphaChannel: "useAlphaChannel" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<slider\r\n  [(ngModel)]=\"hue\"\r\n  name=\"hue\"\r\n  [min]=\"0\"\r\n  [max]=\"360\"\r\n  [step]=\"1\"\r\n  (change)=\"generateColor()\"\r\n  background=\"linear-gradient(to right,red 0%,#ff0 17%,lime 33%,cyan 50%,blue 66%,#f0f 83%,red 100%)\">\r\n  <div class=\"slider-title\">\r\n    <span>Hue</span>\r\n    <input type=\"number\" [(ngModel)]=\"hue\" name=\"inputHue\" min=\"0\" max=\"360\" step=\"1\" />\r\n  </div>\r\n</slider>\r\n<slider\r\n  [(ngModel)]=\"saturation\"\r\n  name=\"saturation\"\r\n  [min]=\"0\"\r\n  [max]=\"100\"\r\n  [step]=\"1\"\r\n  (change)=\"generateColor()\"\r\n  [background]=\"'linear-gradient(to right,#808080,' + baseColor + ')'\">\r\n  <div class=\"slider-title\">\r\n    <span>Saturation</span>\r\n    <input\r\n      type=\"number\"\r\n      [(ngModel)]=\"saturation\"\r\n      name=\"inputSaturation\"\r\n      min=\"0\"\r\n      max=\"100\"\r\n      step=\"1\" />\r\n  </div>\r\n</slider>\r\n<slider\r\n  [(ngModel)]=\"luminance\"\r\n  name=\"luminance\"\r\n  [min]=\"0\"\r\n  [max]=\"100\"\r\n  [step]=\"1\"\r\n  (change)=\"generateColor()\"\r\n  [background]=\"'linear-gradient(to right,black,' + baseColor + ',white)'\">\r\n  <div class=\"slider-title\">\r\n    <span>Luminance</span>\r\n    <input type=\"number\" [(ngModel)]=\"luminance\" name=\"inputLuminance\" min=\"0\" max=\"100\" step=\"1\" />\r\n  </div>\r\n</slider>\r\n@if (useAlphaChannel) {\r\n  <slider\r\n    [(ngModel)]=\"alpha\"\r\n    name=\"alpha\"\r\n    [min]=\"0\"\r\n    [max]=\"1\"\r\n    [step]=\"0.1\"\r\n    (change)=\"generateColor()\"\r\n    [isBgTransparent]=\"true\"\r\n    [background]=\"'linear-gradient(to right,transparent,' + baseColor + ')'\">\r\n    <div class=\"slider-title\">\r\n      <span>Alpha</span>\r\n      <input type=\"number\" [(ngModel)]=\"alpha\" name=\"inputAlpha\" min=\"0\" max=\"1\" step=\"0.1\" />\r\n    </div>\r\n  </slider>\r\n}\r\n", styles: [".slider-title{display:flex;align-items:center;justify-content:space-between}.slider-title input{transition:box-shadow .1s;box-shadow:inset #d8d8da 0 0 0 1px,inset #fff 0 0 0 100px;border:none;width:48px;color:#000;font-family:Inter,sans-serif;padding:5px 6px;border-radius:5px;font-size:12px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SliderComponent, selector: "slider", inputs: ["step", "min", "max", "background", "isBgTransparent"], outputs: ["change"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: HslComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-hsl', imports: [FormsModule, SliderComponent], template: "<slider\n  [(ngModel)]=\"hue\"\n  name=\"hue\"\n  [min]=\"0\"\n  [max]=\"360\"\n  [step]=\"1\"\n  (change)=\"generateColor()\"\n  background=\"linear-gradient(to right,red 0%,#ff0 17%,lime 33%,cyan 50%,blue 66%,#f0f 83%,red 100%)\">\n  <div class=\"slider-title\">\n    <span>Hue</span>\n    <input type=\"number\" [(ngModel)]=\"hue\" name=\"inputHue\" min=\"0\" max=\"360\" step=\"1\" />\n  </div>\n</slider>\n<slider\n  [(ngModel)]=\"saturation\"\n  name=\"saturation\"\n  [min]=\"0\"\n  [max]=\"100\"\n  [step]=\"1\"\n  (change)=\"generateColor()\"\n  [background]=\"'linear-gradient(to right,#808080,' + baseColor + ')'\">\n  <div class=\"slider-title\">\n    <span>Saturation</span>\n    <input\n      type=\"number\"\n      [(ngModel)]=\"saturation\"\n      name=\"inputSaturation\"\n      min=\"0\"\n      max=\"100\"\n      step=\"1\" />\n  </div>\n</slider>\n<slider\n  [(ngModel)]=\"luminance\"\n  name=\"luminance\"\n  [min]=\"0\"\n  [max]=\"100\"\n  [step]=\"1\"\n  (change)=\"generateColor()\"\n  [background]=\"'linear-gradient(to right,black,' + baseColor + ',white)'\">\n  <div class=\"slider-title\">\n    <span>Luminance</span>\n    <input type=\"number\" [(ngModel)]=\"luminance\" name=\"inputLuminance\" min=\"0\" max=\"100\" step=\"1\" />\n  </div>\n</slider>\n@if (useAlphaChannel) {\n  <slider\n    [(ngModel)]=\"alpha\"\n    name=\"alpha\"\n    [min]=\"0\"\n    [max]=\"1\"\n    [step]=\"0.1\"\n    (change)=\"generateColor()\"\n    [isBgTransparent]=\"true\"\n    [background]=\"'linear-gradient(to right,transparent,' + baseColor + ')'\">\n    <div class=\"slider-title\">\n      <span>Alpha</span>\n      <input type=\"number\" [(ngModel)]=\"alpha\" name=\"inputAlpha\" min=\"0\" max=\"1\" step=\"0.1\" />\n    </div>\n  </slider>\n}\n", styles: [".slider-title{display:flex;align-items:center;justify-content:space-between}.slider-title input{transition:box-shadow .1s;box-shadow:inset #d8d8da 0 0 0 1px,inset #fff 0 0 0 100px;border:none;width:48px;color:#000;font-family:Inter,sans-serif;padding:5px 6px;border-radius:5px;font-size:12px}\n"] }]
+            args: [{ selector: 'app-hsl', imports: [FormsModule, SliderComponent], template: "<slider\r\n  [(ngModel)]=\"hue\"\r\n  name=\"hue\"\r\n  [min]=\"0\"\r\n  [max]=\"360\"\r\n  [step]=\"1\"\r\n  (change)=\"generateColor()\"\r\n  background=\"linear-gradient(to right,red 0%,#ff0 17%,lime 33%,cyan 50%,blue 66%,#f0f 83%,red 100%)\">\r\n  <div class=\"slider-title\">\r\n    <span>Hue</span>\r\n    <input type=\"number\" [(ngModel)]=\"hue\" name=\"inputHue\" min=\"0\" max=\"360\" step=\"1\" />\r\n  </div>\r\n</slider>\r\n<slider\r\n  [(ngModel)]=\"saturation\"\r\n  name=\"saturation\"\r\n  [min]=\"0\"\r\n  [max]=\"100\"\r\n  [step]=\"1\"\r\n  (change)=\"generateColor()\"\r\n  [background]=\"'linear-gradient(to right,#808080,' + baseColor + ')'\">\r\n  <div class=\"slider-title\">\r\n    <span>Saturation</span>\r\n    <input\r\n      type=\"number\"\r\n      [(ngModel)]=\"saturation\"\r\n      name=\"inputSaturation\"\r\n      min=\"0\"\r\n      max=\"100\"\r\n      step=\"1\" />\r\n  </div>\r\n</slider>\r\n<slider\r\n  [(ngModel)]=\"luminance\"\r\n  name=\"luminance\"\r\n  [min]=\"0\"\r\n  [max]=\"100\"\r\n  [step]=\"1\"\r\n  (change)=\"generateColor()\"\r\n  [background]=\"'linear-gradient(to right,black,' + baseColor + ',white)'\">\r\n  <div class=\"slider-title\">\r\n    <span>Luminance</span>\r\n    <input type=\"number\" [(ngModel)]=\"luminance\" name=\"inputLuminance\" min=\"0\" max=\"100\" step=\"1\" />\r\n  </div>\r\n</slider>\r\n@if (useAlphaChannel) {\r\n  <slider\r\n    [(ngModel)]=\"alpha\"\r\n    name=\"alpha\"\r\n    [min]=\"0\"\r\n    [max]=\"1\"\r\n    [step]=\"0.1\"\r\n    (change)=\"generateColor()\"\r\n    [isBgTransparent]=\"true\"\r\n    [background]=\"'linear-gradient(to right,transparent,' + baseColor + ')'\">\r\n    <div class=\"slider-title\">\r\n      <span>Alpha</span>\r\n      <input type=\"number\" [(ngModel)]=\"alpha\" name=\"inputAlpha\" min=\"0\" max=\"1\" step=\"0.1\" />\r\n    </div>\r\n  </slider>\r\n}\r\n", styles: [".slider-title{display:flex;align-items:center;justify-content:space-between}.slider-title input{transition:box-shadow .1s;box-shadow:inset #d8d8da 0 0 0 1px,inset #fff 0 0 0 100px;border:none;width:48px;color:#000;font-family:Inter,sans-serif;padding:5px 6px;border-radius:5px;font-size:12px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { color: [{
                 type: Input
             }], useAlphaChannel: [{
@@ -1222,7 +1222,7 @@ class NgxInputColorComponent {
                 multi: true,
                 useExisting: NgxInputColorComponent,
             },
-        ], ngImport: i0, template: "<div\n  class=\"ngx-input-color-picker\"\n  (click)=\"stopPropagation($event)\"\n  [class.simple-mode]=\"simpleMode\">\n  @if (!simpleMode) {\n    <div\n      class=\"ngx-color-preview\"\n      [ngStyle]=\"{ '--ngx-selected-color': rgbaColor }\"\n      [class.is-dark-color]=\"isDarkColor\">\n      <div class=\"rgbacode\">{{ outputColor | uppercase }}</div>\n      @if (outputType !== 'HEX') {\n        <div class=\"hexacode\">{{ hexColor | uppercase }}</div>\n      }\n      <div class=\"colorname\">{{ name }}</div>\n      <div class=\"color\"></div>\n    </div>\n  }\n  <div class=\"ngx-c-inner\">\n    <div class=\"top-actions\">\n      <select [(ngModel)]=\"defaultInspector\" name=\"inspector\">\n        @for (inspector of ColorInspector | enumToArray; track inspector) {\n          <option [value]=\"inspector\">\n            {{ ColorInspector[+inspector] }}\n          </option>\n        }\n      </select>\n      @if (isSupportedEyeDrop) {\n        <button type=\"button\" (click)=\"openEyeDrop()\" class=\"ngx-btn-eyedroper\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n            <defs>\n              <style>\n                .fa-secondary {\n                  opacity: 0.4;\n                }\n              </style>\n            </defs>\n            <path\n              class=\"fa-primary\"\n              d=\"M482.8 29.23C521.7 68.21 521.7 131.4 482.8 170.4L381.2 271.9L390.6 281.4C403.1 293.9 403.1 314.1 390.6 326.6C378.1 339.1 357.9 339.1 345.4 326.6L185.4 166.6C172.9 154.1 172.9 133.9 185.4 121.4C197.9 108.9 218.1 108.9 230.6 121.4L240.1 130.8L341.6 29.23C380.6-9.744 443.8-9.744 482.8 29.23L482.8 29.23zM132.1 416H96V379.9C96 375.6 97.69 371.6 100.7 368.6L149.3 320H234.7L143.4 411.3C140.4 414.3 136.4 416 132.1 416H132.1z\" />\n            <path\n              class=\"fa-secondary\"\n              d=\"M244 225.3L100.7 368.6C97.69 371.6 96 375.6 96 379.9V416H132.1C136.4 416 140.4 414.3 143.4 411.3L286.7 268L332 313.3L188.7 456.6C173.7 471.6 153.3 480 132.1 480H89.69L49.75 506.6C37.06 515.1 20.16 513.4 9.372 502.6C-1.414 491.8-3.087 474.9 5.374 462.2L32 422.3V379.9C32 358.7 40.43 338.3 55.43 323.3L198.7 180L244 225.3z\" />\n          </svg>\n        </button>\n      }\n    </div>\n\n    @switch (+defaultInspector) {\n      @case (ColorInspector.Picker) {\n        <app-picker\n          [color]=\"color\"\n          (colorChange)=\"initColor($event)\"\n          [simpleMode]=\"simpleMode\"\n          [useAlphaChannel]=\"useAlphaChannel\"></app-picker>\n      }\n      @case (ColorInspector.HSL) {\n        <app-hsl\n          [color]=\"color\"\n          (colorChange)=\"initColor($event)\"\n          [useAlphaChannel]=\"useAlphaChannel\"></app-hsl>\n      }\n      @case (ColorInspector.RGB) {\n        <app-rgb\n          [color]=\"color\"\n          (colorChange)=\"initColor($event)\"\n          [useAlphaChannel]=\"useAlphaChannel\"></app-rgb>\n      }\n      @case (ColorInspector.CMYK) {\n        <app-cmyk [color]=\"color\" (colorChange)=\"initColor($event)\"></app-cmyk>\n      }\n    }\n  </div>\n</div>\n", styles: [":host{--ngx-color-bg: #fff;--ngx-color-text: #000}:host-context(.dark){--ngx-color-bg: #222;--ngx-color-text: #fff}.ngx-input-color-picker{width:270px;max-width:100%;border-radius:15px;overflow:hidden;direction:ltr;font-family:arial,tahoma;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-input-color-picker .ngx-c-inner{padding:12px;background:var(--ngx-color-bg);color:var(--ngx-color-text);border-radius:15px;margin-top:-15px;position:relative}.ngx-input-color-picker *{box-sizing:border-box}.ngx-input-color-picker.simple-mode{width:220px;--ngx-thumb-size: 24px}.ngx-input-color-picker.simple-mode .ngx-c-inner{padding:12px;margin:0}.ngx-color-preview{min-height:100px;padding:10px 36px;line-height:1.6;font-size:14px;font-family:arial,tahoma;font-weight:700;position:relative;color:#353535;background-color:#fff}.ngx-color-preview.is-dark-color{color:#fff}.ngx-color-preview:after,.ngx-color-preview:before{content:\" \";position:absolute;inset:0}.ngx-color-preview:before{background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(-45deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(-45deg,transparent 75%,#ccc 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.ngx-color-preview:after{background:var(--ngx-selected-color)}.ngx-color-preview .rgbacode,.ngx-color-preview .colorname,.ngx-color-preview .color{text-shadow:0 0 1px #000000;position:relative;z-index:1}.button-groups{display:flex;border-radius:4px;overflow:hidden;border:1px #d3d3d3 solid}.button-groups button{cursor:pointer;background:#f9f9f9;outline:none;border:none;transition:all .3s;border-left:1px #d3d3d3 solid;padding:10px 12px;flex:auto}.button-groups button:hover{background:#8db6e4}.button-groups button:first-child{border-left-width:0}.ngx-btn-eyedroper{padding:2px;min-width:0;width:45px;cursor:pointer;background-color:transparent;outline:none;transition:all .3s;border:none;border-radius:6px}.ngx-btn-eyedroper svg{width:18px;fill:var(--ngx-color-text)}.top-actions{display:flex;justify-content:space-between;align-items:center;padding:0 0 12px}.top-actions select{outline:none;border:none;border-radius:4px;padding:5px 10px;background:none;color:var(--ngx-color-text)}.top-actions select:focus{cursor:pointer;background:#e5f0ff;color:#06f}.top-actions select option{padding:10px 20px;background:var(--ngx-color-bg);color:var(--ngx-color-text);transition:all .3s}.top-actions select option:hover{background:#f0f0f048}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PickerComponent, selector: "app-picker", inputs: ["simpleMode", "color", "useAlphaChannel"], outputs: ["colorChange"] }, { kind: "component", type: CmykComponent, selector: "app-cmyk", inputs: ["color"], outputs: ["colorChange"] }, { kind: "component", type: HslComponent, selector: "app-hsl", inputs: ["color", "useAlphaChannel"], outputs: ["colorChange"] }, { kind: "component", type: RgbComponent, selector: "app-rgb", inputs: ["color", "useAlphaChannel"], outputs: ["colorChange"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: EnumToArrayPipe, name: "enumToArray" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        ], ngImport: i0, template: "<div\r\n  class=\"ngx-input-color-picker\"\r\n  (click)=\"stopPropagation($event)\"\r\n  [class.simple-mode]=\"simpleMode\">\r\n  @if (!simpleMode) {\r\n    <div\r\n      class=\"ngx-color-preview\"\r\n      [ngStyle]=\"{ '--ngx-selected-color': rgbaColor }\"\r\n      [class.is-dark-color]=\"isDarkColor\">\r\n      <div class=\"rgbacode\">{{ outputColor | uppercase }}</div>\r\n      @if (outputType !== 'HEX') {\r\n        <div class=\"hexacode\">{{ hexColor | uppercase }}</div>\r\n      }\r\n      <div class=\"colorname\">{{ name }}</div>\r\n      <div class=\"color\"></div>\r\n    </div>\r\n  }\r\n  <div class=\"ngx-c-inner\">\r\n    <div class=\"top-actions\">\r\n      <select [(ngModel)]=\"defaultInspector\" name=\"inspector\">\r\n        @for (inspector of ColorInspector | enumToArray; track inspector) {\r\n          <option [value]=\"inspector\">\r\n            {{ ColorInspector[+inspector] }}\r\n          </option>\r\n        }\r\n      </select>\r\n      @if (isSupportedEyeDrop) {\r\n        <button type=\"button\" (click)=\"openEyeDrop()\" class=\"ngx-btn-eyedroper\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\r\n            <defs>\r\n              <style>\r\n                .fa-secondary {\r\n                  opacity: 0.4;\r\n                }\r\n              </style>\r\n            </defs>\r\n            <path\r\n              class=\"fa-primary\"\r\n              d=\"M482.8 29.23C521.7 68.21 521.7 131.4 482.8 170.4L381.2 271.9L390.6 281.4C403.1 293.9 403.1 314.1 390.6 326.6C378.1 339.1 357.9 339.1 345.4 326.6L185.4 166.6C172.9 154.1 172.9 133.9 185.4 121.4C197.9 108.9 218.1 108.9 230.6 121.4L240.1 130.8L341.6 29.23C380.6-9.744 443.8-9.744 482.8 29.23L482.8 29.23zM132.1 416H96V379.9C96 375.6 97.69 371.6 100.7 368.6L149.3 320H234.7L143.4 411.3C140.4 414.3 136.4 416 132.1 416H132.1z\" />\r\n            <path\r\n              class=\"fa-secondary\"\r\n              d=\"M244 225.3L100.7 368.6C97.69 371.6 96 375.6 96 379.9V416H132.1C136.4 416 140.4 414.3 143.4 411.3L286.7 268L332 313.3L188.7 456.6C173.7 471.6 153.3 480 132.1 480H89.69L49.75 506.6C37.06 515.1 20.16 513.4 9.372 502.6C-1.414 491.8-3.087 474.9 5.374 462.2L32 422.3V379.9C32 358.7 40.43 338.3 55.43 323.3L198.7 180L244 225.3z\" />\r\n          </svg>\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    @switch (+defaultInspector) {\r\n      @case (ColorInspector.Picker) {\r\n        <app-picker\r\n          [color]=\"color\"\r\n          (colorChange)=\"initColor($event)\"\r\n          [simpleMode]=\"simpleMode\"\r\n          [useAlphaChannel]=\"useAlphaChannel\"></app-picker>\r\n      }\r\n      @case (ColorInspector.HSL) {\r\n        <app-hsl\r\n          [color]=\"color\"\r\n          (colorChange)=\"initColor($event)\"\r\n          [useAlphaChannel]=\"useAlphaChannel\"></app-hsl>\r\n      }\r\n      @case (ColorInspector.RGB) {\r\n        <app-rgb\r\n          [color]=\"color\"\r\n          (colorChange)=\"initColor($event)\"\r\n          [useAlphaChannel]=\"useAlphaChannel\"></app-rgb>\r\n      }\r\n      @case (ColorInspector.CMYK) {\r\n        <app-cmyk [color]=\"color\" (colorChange)=\"initColor($event)\"></app-cmyk>\r\n      }\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{--ngx-color-bg: #fff;--ngx-color-text: #000}:host-context(.dark){--ngx-color-bg: #222;--ngx-color-text: #fff}.ngx-input-color-picker{width:270px;max-width:100%;border-radius:15px;overflow:hidden;direction:ltr;font-family:arial,tahoma;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-input-color-picker .ngx-c-inner{padding:12px;background:var(--ngx-color-bg);color:var(--ngx-color-text);border-radius:15px;margin-top:-15px;position:relative}.ngx-input-color-picker *{box-sizing:border-box}.ngx-input-color-picker.simple-mode{width:220px;--ngx-thumb-size: 24px}.ngx-input-color-picker.simple-mode .ngx-c-inner{padding:12px;margin:0}.ngx-color-preview{min-height:100px;padding:10px 36px;line-height:1.6;font-size:14px;font-family:arial,tahoma;font-weight:700;position:relative;color:#353535;background-color:#fff}.ngx-color-preview.is-dark-color{color:#fff}.ngx-color-preview:after,.ngx-color-preview:before{content:\" \";position:absolute;inset:0}.ngx-color-preview:before{background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(-45deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(-45deg,transparent 75%,#ccc 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.ngx-color-preview:after{background:var(--ngx-selected-color)}.ngx-color-preview .rgbacode,.ngx-color-preview .colorname,.ngx-color-preview .color{text-shadow:0 0 1px #000000;position:relative;z-index:1}.button-groups{display:flex;border-radius:4px;overflow:hidden;border:1px #d3d3d3 solid}.button-groups button{cursor:pointer;background:#f9f9f9;outline:none;border:none;transition:all .3s;border-left:1px #d3d3d3 solid;padding:10px 12px;flex:auto}.button-groups button:hover{background:#8db6e4}.button-groups button:first-child{border-left-width:0}.ngx-btn-eyedroper{padding:2px;min-width:0;width:45px;cursor:pointer;background-color:transparent;outline:none;transition:all .3s;border:none;border-radius:6px}.ngx-btn-eyedroper svg{width:18px;fill:var(--ngx-color-text)}.top-actions{display:flex;justify-content:space-between;align-items:center;padding:0 0 12px}.top-actions select{outline:none;border:none;border-radius:4px;padding:5px 10px;background:none;color:var(--ngx-color-text)}.top-actions select:focus{cursor:pointer;background:#e5f0ff;color:#06f}.top-actions select option{padding:10px 20px;background:var(--ngx-color-bg);color:var(--ngx-color-text);transition:all .3s}.top-actions select option:hover{background:#f0f0f048}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PickerComponent, selector: "app-picker", inputs: ["simpleMode", "color", "useAlphaChannel"], outputs: ["colorChange"] }, { kind: "component", type: CmykComponent, selector: "app-cmyk", inputs: ["color"], outputs: ["colorChange"] }, { kind: "component", type: HslComponent, selector: "app-hsl", inputs: ["color", "useAlphaChannel"], outputs: ["colorChange"] }, { kind: "component", type: RgbComponent, selector: "app-rgb", inputs: ["color", "useAlphaChannel"], outputs: ["colorChange"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: EnumToArrayPipe, name: "enumToArray" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: NgxInputColorComponent, decorators: [{
             type: Component,
@@ -1247,7 +1247,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
                         CmykComponent,
                         HslComponent,
                         RgbComponent,
-                    ], template: "<div\n  class=\"ngx-input-color-picker\"\n  (click)=\"stopPropagation($event)\"\n  [class.simple-mode]=\"simpleMode\">\n  @if (!simpleMode) {\n    <div\n      class=\"ngx-color-preview\"\n      [ngStyle]=\"{ '--ngx-selected-color': rgbaColor }\"\n      [class.is-dark-color]=\"isDarkColor\">\n      <div class=\"rgbacode\">{{ outputColor | uppercase }}</div>\n      @if (outputType !== 'HEX') {\n        <div class=\"hexacode\">{{ hexColor | uppercase }}</div>\n      }\n      <div class=\"colorname\">{{ name }}</div>\n      <div class=\"color\"></div>\n    </div>\n  }\n  <div class=\"ngx-c-inner\">\n    <div class=\"top-actions\">\n      <select [(ngModel)]=\"defaultInspector\" name=\"inspector\">\n        @for (inspector of ColorInspector | enumToArray; track inspector) {\n          <option [value]=\"inspector\">\n            {{ ColorInspector[+inspector] }}\n          </option>\n        }\n      </select>\n      @if (isSupportedEyeDrop) {\n        <button type=\"button\" (click)=\"openEyeDrop()\" class=\"ngx-btn-eyedroper\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\n            <defs>\n              <style>\n                .fa-secondary {\n                  opacity: 0.4;\n                }\n              </style>\n            </defs>\n            <path\n              class=\"fa-primary\"\n              d=\"M482.8 29.23C521.7 68.21 521.7 131.4 482.8 170.4L381.2 271.9L390.6 281.4C403.1 293.9 403.1 314.1 390.6 326.6C378.1 339.1 357.9 339.1 345.4 326.6L185.4 166.6C172.9 154.1 172.9 133.9 185.4 121.4C197.9 108.9 218.1 108.9 230.6 121.4L240.1 130.8L341.6 29.23C380.6-9.744 443.8-9.744 482.8 29.23L482.8 29.23zM132.1 416H96V379.9C96 375.6 97.69 371.6 100.7 368.6L149.3 320H234.7L143.4 411.3C140.4 414.3 136.4 416 132.1 416H132.1z\" />\n            <path\n              class=\"fa-secondary\"\n              d=\"M244 225.3L100.7 368.6C97.69 371.6 96 375.6 96 379.9V416H132.1C136.4 416 140.4 414.3 143.4 411.3L286.7 268L332 313.3L188.7 456.6C173.7 471.6 153.3 480 132.1 480H89.69L49.75 506.6C37.06 515.1 20.16 513.4 9.372 502.6C-1.414 491.8-3.087 474.9 5.374 462.2L32 422.3V379.9C32 358.7 40.43 338.3 55.43 323.3L198.7 180L244 225.3z\" />\n          </svg>\n        </button>\n      }\n    </div>\n\n    @switch (+defaultInspector) {\n      @case (ColorInspector.Picker) {\n        <app-picker\n          [color]=\"color\"\n          (colorChange)=\"initColor($event)\"\n          [simpleMode]=\"simpleMode\"\n          [useAlphaChannel]=\"useAlphaChannel\"></app-picker>\n      }\n      @case (ColorInspector.HSL) {\n        <app-hsl\n          [color]=\"color\"\n          (colorChange)=\"initColor($event)\"\n          [useAlphaChannel]=\"useAlphaChannel\"></app-hsl>\n      }\n      @case (ColorInspector.RGB) {\n        <app-rgb\n          [color]=\"color\"\n          (colorChange)=\"initColor($event)\"\n          [useAlphaChannel]=\"useAlphaChannel\"></app-rgb>\n      }\n      @case (ColorInspector.CMYK) {\n        <app-cmyk [color]=\"color\" (colorChange)=\"initColor($event)\"></app-cmyk>\n      }\n    }\n  </div>\n</div>\n", styles: [":host{--ngx-color-bg: #fff;--ngx-color-text: #000}:host-context(.dark){--ngx-color-bg: #222;--ngx-color-text: #fff}.ngx-input-color-picker{width:270px;max-width:100%;border-radius:15px;overflow:hidden;direction:ltr;font-family:arial,tahoma;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-input-color-picker .ngx-c-inner{padding:12px;background:var(--ngx-color-bg);color:var(--ngx-color-text);border-radius:15px;margin-top:-15px;position:relative}.ngx-input-color-picker *{box-sizing:border-box}.ngx-input-color-picker.simple-mode{width:220px;--ngx-thumb-size: 24px}.ngx-input-color-picker.simple-mode .ngx-c-inner{padding:12px;margin:0}.ngx-color-preview{min-height:100px;padding:10px 36px;line-height:1.6;font-size:14px;font-family:arial,tahoma;font-weight:700;position:relative;color:#353535;background-color:#fff}.ngx-color-preview.is-dark-color{color:#fff}.ngx-color-preview:after,.ngx-color-preview:before{content:\" \";position:absolute;inset:0}.ngx-color-preview:before{background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(-45deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(-45deg,transparent 75%,#ccc 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.ngx-color-preview:after{background:var(--ngx-selected-color)}.ngx-color-preview .rgbacode,.ngx-color-preview .colorname,.ngx-color-preview .color{text-shadow:0 0 1px #000000;position:relative;z-index:1}.button-groups{display:flex;border-radius:4px;overflow:hidden;border:1px #d3d3d3 solid}.button-groups button{cursor:pointer;background:#f9f9f9;outline:none;border:none;transition:all .3s;border-left:1px #d3d3d3 solid;padding:10px 12px;flex:auto}.button-groups button:hover{background:#8db6e4}.button-groups button:first-child{border-left-width:0}.ngx-btn-eyedroper{padding:2px;min-width:0;width:45px;cursor:pointer;background-color:transparent;outline:none;transition:all .3s;border:none;border-radius:6px}.ngx-btn-eyedroper svg{width:18px;fill:var(--ngx-color-text)}.top-actions{display:flex;justify-content:space-between;align-items:center;padding:0 0 12px}.top-actions select{outline:none;border:none;border-radius:4px;padding:5px 10px;background:none;color:var(--ngx-color-text)}.top-actions select:focus{cursor:pointer;background:#e5f0ff;color:#06f}.top-actions select option{padding:10px 20px;background:var(--ngx-color-bg);color:var(--ngx-color-text);transition:all .3s}.top-actions select option:hover{background:#f0f0f048}\n"] }]
+                    ], template: "<div\r\n  class=\"ngx-input-color-picker\"\r\n  (click)=\"stopPropagation($event)\"\r\n  [class.simple-mode]=\"simpleMode\">\r\n  @if (!simpleMode) {\r\n    <div\r\n      class=\"ngx-color-preview\"\r\n      [ngStyle]=\"{ '--ngx-selected-color': rgbaColor }\"\r\n      [class.is-dark-color]=\"isDarkColor\">\r\n      <div class=\"rgbacode\">{{ outputColor | uppercase }}</div>\r\n      @if (outputType !== 'HEX') {\r\n        <div class=\"hexacode\">{{ hexColor | uppercase }}</div>\r\n      }\r\n      <div class=\"colorname\">{{ name }}</div>\r\n      <div class=\"color\"></div>\r\n    </div>\r\n  }\r\n  <div class=\"ngx-c-inner\">\r\n    <div class=\"top-actions\">\r\n      <select [(ngModel)]=\"defaultInspector\" name=\"inspector\">\r\n        @for (inspector of ColorInspector | enumToArray; track inspector) {\r\n          <option [value]=\"inspector\">\r\n            {{ ColorInspector[+inspector] }}\r\n          </option>\r\n        }\r\n      </select>\r\n      @if (isSupportedEyeDrop) {\r\n        <button type=\"button\" (click)=\"openEyeDrop()\" class=\"ngx-btn-eyedroper\">\r\n          <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\">\r\n            <defs>\r\n              <style>\r\n                .fa-secondary {\r\n                  opacity: 0.4;\r\n                }\r\n              </style>\r\n            </defs>\r\n            <path\r\n              class=\"fa-primary\"\r\n              d=\"M482.8 29.23C521.7 68.21 521.7 131.4 482.8 170.4L381.2 271.9L390.6 281.4C403.1 293.9 403.1 314.1 390.6 326.6C378.1 339.1 357.9 339.1 345.4 326.6L185.4 166.6C172.9 154.1 172.9 133.9 185.4 121.4C197.9 108.9 218.1 108.9 230.6 121.4L240.1 130.8L341.6 29.23C380.6-9.744 443.8-9.744 482.8 29.23L482.8 29.23zM132.1 416H96V379.9C96 375.6 97.69 371.6 100.7 368.6L149.3 320H234.7L143.4 411.3C140.4 414.3 136.4 416 132.1 416H132.1z\" />\r\n            <path\r\n              class=\"fa-secondary\"\r\n              d=\"M244 225.3L100.7 368.6C97.69 371.6 96 375.6 96 379.9V416H132.1C136.4 416 140.4 414.3 143.4 411.3L286.7 268L332 313.3L188.7 456.6C173.7 471.6 153.3 480 132.1 480H89.69L49.75 506.6C37.06 515.1 20.16 513.4 9.372 502.6C-1.414 491.8-3.087 474.9 5.374 462.2L32 422.3V379.9C32 358.7 40.43 338.3 55.43 323.3L198.7 180L244 225.3z\" />\r\n          </svg>\r\n        </button>\r\n      }\r\n    </div>\r\n\r\n    @switch (+defaultInspector) {\r\n      @case (ColorInspector.Picker) {\r\n        <app-picker\r\n          [color]=\"color\"\r\n          (colorChange)=\"initColor($event)\"\r\n          [simpleMode]=\"simpleMode\"\r\n          [useAlphaChannel]=\"useAlphaChannel\"></app-picker>\r\n      }\r\n      @case (ColorInspector.HSL) {\r\n        <app-hsl\r\n          [color]=\"color\"\r\n          (colorChange)=\"initColor($event)\"\r\n          [useAlphaChannel]=\"useAlphaChannel\"></app-hsl>\r\n      }\r\n      @case (ColorInspector.RGB) {\r\n        <app-rgb\r\n          [color]=\"color\"\r\n          (colorChange)=\"initColor($event)\"\r\n          [useAlphaChannel]=\"useAlphaChannel\"></app-rgb>\r\n      }\r\n      @case (ColorInspector.CMYK) {\r\n        <app-cmyk [color]=\"color\" (colorChange)=\"initColor($event)\"></app-cmyk>\r\n      }\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [":host{--ngx-color-bg: #fff;--ngx-color-text: #000}:host-context(.dark){--ngx-color-bg: #222;--ngx-color-text: #fff}.ngx-input-color-picker{width:270px;max-width:100%;border-radius:15px;overflow:hidden;direction:ltr;font-family:arial,tahoma;border:1px rgba(134,134,134,.3490196078) solid;box-shadow:0 0 20px #7a7a7a21}.ngx-input-color-picker .ngx-c-inner{padding:12px;background:var(--ngx-color-bg);color:var(--ngx-color-text);border-radius:15px;margin-top:-15px;position:relative}.ngx-input-color-picker *{box-sizing:border-box}.ngx-input-color-picker.simple-mode{width:220px;--ngx-thumb-size: 24px}.ngx-input-color-picker.simple-mode .ngx-c-inner{padding:12px;margin:0}.ngx-color-preview{min-height:100px;padding:10px 36px;line-height:1.6;font-size:14px;font-family:arial,tahoma;font-weight:700;position:relative;color:#353535;background-color:#fff}.ngx-color-preview.is-dark-color{color:#fff}.ngx-color-preview:after,.ngx-color-preview:before{content:\" \";position:absolute;inset:0}.ngx-color-preview:before{background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(-45deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(-45deg,transparent 75%,#ccc 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.ngx-color-preview:after{background:var(--ngx-selected-color)}.ngx-color-preview .rgbacode,.ngx-color-preview .colorname,.ngx-color-preview .color{text-shadow:0 0 1px #000000;position:relative;z-index:1}.button-groups{display:flex;border-radius:4px;overflow:hidden;border:1px #d3d3d3 solid}.button-groups button{cursor:pointer;background:#f9f9f9;outline:none;border:none;transition:all .3s;border-left:1px #d3d3d3 solid;padding:10px 12px;flex:auto}.button-groups button:hover{background:#8db6e4}.button-groups button:first-child{border-left-width:0}.ngx-btn-eyedroper{padding:2px;min-width:0;width:45px;cursor:pointer;background-color:transparent;outline:none;transition:all .3s;border:none;border-radius:6px}.ngx-btn-eyedroper svg{width:18px;fill:var(--ngx-color-text)}.top-actions{display:flex;justify-content:space-between;align-items:center;padding:0 0 12px}.top-actions select{outline:none;border:none;border-radius:4px;padding:5px 10px;background:none;color:var(--ngx-color-text)}.top-actions select:focus{cursor:pointer;background:#e5f0ff;color:#06f}.top-actions select option{padding:10px 20px;background:var(--ngx-color-bg);color:var(--ngx-color-text);transition:all .3s}.top-actions select option:hover{background:#f0f0f048}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { setTheme: [{
                 type: Input,
                 args: ['theme']