@provoly/dashboard 0.18.2 → 0.18.3

package/fesm2022/provoly-dashboard-components-color-picker.mjs

@@ -0,0 +1,337 @@
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { forwardRef, Component, ViewChild, NgModule } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+
+class PryColorPickerComponent {
+    constructor(_cd) {
+        this._cd = _cd;
+        this.onChange = () => { };
+        this.onTouch = () => { };
+        this.color = '#000000';
+        this.barColor = '#0000ff';
+        this.disabled = false;
+        this.inhibate = true;
+        this.picking = false;
+        this.markerSelectorPosition = [0, 0];
+        this.markerBarPosition = 0;
+        this.innerRadius = 3;
+        this.outerRadius = 8;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouch = fn;
+    }
+    // Define what should happen in this component, if something changes outside
+    writeValue(color) {
+        if (this.color !== color && !this.inhibate) {
+            this.color = color;
+            this.onChange(this.color);
+            this.onTouch();
+            this._cd.markForCheck();
+            this.inputColor(color);
+        }
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+        this._cd.markForCheck();
+    }
+    ngAfterViewInit() {
+        this.inhibate = false;
+        this.selectorContext = this.selector.nativeElement.getContext('2d', { willReadFrequently: true });
+        this.barContext = this.bar.nativeElement.getContext('2d', { willReadFrequently: true });
+    }
+    togglePicker($event) {
+        this.picking = !this.disabled && !this.picking;
+        if (!this.picking && this.temporaryColor) {
+            this.writeValue(this.temporaryColor);
+        }
+        if (this.picking) {
+            this.redrawSelector();
+            this.redrawBar();
+        }
+    }
+    redrawSelector() {
+        this.selectorContext.clearRect(0, 0, this.selectorContext.canvas.width, this.selectorContext.canvas.height);
+        this.drawColorGradient(this.selectorContext, false, ['#ffffff', this.barColor]);
+        this.drawColorGradient(this.selectorContext, true, ['rgba(0,0,0,0)', '#000']);
+        this.drawSelectorMarker();
+    }
+    redrawBar() {
+        this.barContext.clearRect(0, 0, this.barContext.canvas.width, this.barContext.canvas.height);
+        this.drawColorGradient(this.barContext, true, [
+            '#FF0000',
+            '#ffff00',
+            '#00FF00',
+            '#00FFFF',
+            '#0000FF',
+            '#FF00FF',
+            '#FF0000'
+        ]);
+        this.drawBarMarker();
+    }
+    drawColorGradient(ctxt, vertical = true, colors) {
+        const gradientArgs = vertical
+            ? [0, 0, 0, ctxt.canvas.height]
+            : [0, 0, ctxt.canvas.width, 0];
+        let gradient = ctxt.createLinearGradient(...gradientArgs);
+        colors.forEach((color, idx) => {
+            gradient.addColorStop(idx / (colors.length - 1), color);
+        });
+        ctxt.fillStyle = gradient;
+        ctxt.fillRect(0, 0, ctxt.canvas.width, ctxt.canvas.height);
+    }
+    drawSelectorMarker() {
+        const gradient = this.selectorContext.createRadialGradient(this.markerSelectorPosition[0], this.markerSelectorPosition[1], this.innerRadius, this.markerSelectorPosition[0], this.markerSelectorPosition[1], this.outerRadius);
+        gradient.addColorStop(0, 'rgba(0,0,0,0)');
+        gradient.addColorStop(1, '#ffffff');
+        this.selectorContext.beginPath();
+        this.selectorContext.arc(this.markerSelectorPosition[0], this.markerSelectorPosition[1], this.outerRadius, 0, 2 * Math.PI);
+        this.selectorContext.fillStyle = gradient;
+        this.selectorContext.fill();
+        this.selectorContext.stroke();
+    }
+    drawBarMarker() {
+        this.barContext.strokeStyle = '2px solid black';
+        this.barContext.beginPath();
+        this.barContext.moveTo(0, this.markerBarPosition - this.innerRadius);
+        this.barContext.lineTo(this.barContext.canvas.width, this.markerBarPosition - this.innerRadius);
+        this.barContext.stroke();
+        this.barContext.beginPath();
+        this.barContext.moveTo(0, this.markerBarPosition + this.innerRadius);
+        this.barContext.lineTo(this.barContext.canvas.width, this.markerBarPosition + this.innerRadius);
+        this.barContext.stroke();
+    }
+    selectColor($event, temporary = false) {
+        // Read pixel Color
+        const pixelColor = this.rgbToHex(...this.selectorContext.getImageData($event.offsetX, $event.offsetY, 1, 1)['data']);
+        if (!temporary) {
+            this.writeValue(pixelColor);
+        }
+        else {
+            this.temporaryColor = pixelColor;
+        }
+        this.markerSelectorPosition = [$event.offsetX, $event.offsetY];
+        this.redrawSelector();
+        $event.stopPropagation();
+    }
+    selectColorFromBar($event) {
+        this.markerBarPosition = $event.offsetY;
+        this.barColor = this.rgbToHex(...this.barContext.getImageData(20, $event.offsetY, 1, 1)['data']);
+        this.redrawBar();
+        this.redrawSelector();
+        this.selectColor({
+            offsetX: this.markerSelectorPosition[0],
+            offsetY: this.markerSelectorPosition[1],
+            stopPropagation: () => $event.stopPropagation()
+        }, true);
+        $event.stopPropagation();
+    }
+    componentToHex(c) {
+        return c.toString(16).padStart(2, '0');
+    }
+    rgbToHex(r, g, b) {
+        return '#' + this.componentToHex(r) + this.componentToHex(g) + this.componentToHex(b);
+    }
+    clickInput($event) {
+        this.input.nativeElement.focus();
+        $event.stopPropagation();
+    }
+    inputColor($event) {
+        const possibleColor = !!$event ? ($event.indexOf('#') === -1 ? '#' + $event : $event) : '#FFFFFF';
+        if (/^#[0-9A-F]{6}$/i.test(possibleColor)) {
+            this.writeValue(possibleColor);
+            const rgba = this.strToRGBA(this.color);
+            const hsva = this.RGBAtoHSVA(rgba);
+            this.markerBarPosition = (this.barContext.canvas.height * hsva.h) / 360;
+            this.markerSelectorPosition = [
+                (this.selectorContext.canvas.width * hsva.s) / 100,
+                this.selectorContext.canvas.height * (1 - hsva.v / 100)
+            ];
+            this.barColor = this.hslToHex(hsva.h, 100, 50);
+            this.redrawBar();
+            this.redrawSelector();
+        }
+    }
+    strToRGBA(str) {
+        const regex = /^((rgba)|rgb)[\D]+([\d.]+)[\D]+([\d.]+)[\D]+([\d.]+)[\D]*?([\d.]+|$)/i;
+        let match, rgba;
+        // Default to black for invalid color strings
+        this.selectorContext.fillStyle = '#000';
+        // Use canvas to convert the string to a valid color string
+        this.selectorContext.fillStyle = str;
+        match = regex.exec(this.selectorContext.fillStyle);
+        if (match) {
+            rgba = {
+                // @ts-ignore
+                r: match[3] * 1,
+                // @ts-ignore
+                g: match[4] * 1,
+                // @ts-ignore
+                b: match[5] * 1,
+                // @ts-ignore
+                a: match[6] * 1
+            };
+            // Workaround to mitigate a Chromium bug where the alpha value is rounded incorrectly
+            rgba.a = +rgba.a.toFixed(2);
+        }
+        else {
+            match = this.selectorContext.fillStyle
+                .replace('#', '')
+                .match(/.{2}/g)
+                .map((h) => parseInt(h, 16));
+            rgba = {
+                r: match[0],
+                g: match[1],
+                b: match[2],
+                a: 1
+            };
+        }
+        return rgba;
+    }
+    RGBAtoHSVA(rgba) {
+        const red = rgba.r / 255;
+        const green = rgba.g / 255;
+        const blue = rgba.b / 255;
+        const xmax = Math.max(red, green, blue);
+        const xmin = Math.min(red, green, blue);
+        const chroma = xmax - xmin;
+        const value = xmax;
+        let hue = 0;
+        let saturation = 0;
+        if (chroma) {
+            if (xmax === red) {
+                hue = (green - blue) / chroma;
+            }
+            if (xmax === green) {
+                hue = 2 + (blue - red) / chroma;
+            }
+            if (xmax === blue) {
+                hue = 4 + (red - green) / chroma;
+            }
+            if (xmax) {
+                saturation = chroma / xmax;
+            }
+        }
+        hue = Math.floor(hue * 60);
+        return {
+            h: hue < 0 ? hue + 360 : hue,
+            s: Math.round(saturation * 100),
+            v: Math.round(value * 100),
+            a: rgba.a
+        };
+    }
+    hslToHex(h, s, l) {
+        s /= 100;
+        l /= 100;
+        let c = (1 - Math.abs(2 * l - 1)) * s, x = c * (1 - Math.abs(((h / 60) % 2) - 1)), m = l - c / 2, r = 0, g = 0, b = 0;
+        if (0 <= h && h < 60) {
+            r = c;
+            g = x;
+            b = 0;
+        }
+        else if (60 <= h && h < 120) {
+            r = x;
+            g = c;
+            b = 0;
+        }
+        else if (120 <= h && h < 180) {
+            r = 0;
+            g = c;
+            b = x;
+        }
+        else if (180 <= h && h < 240) {
+            r = 0;
+            g = x;
+            b = c;
+        }
+        else if (240 <= h && h < 300) {
+            r = x;
+            g = 0;
+            b = c;
+        }
+        else if (300 <= h && h < 360) {
+            r = c;
+            g = 0;
+            b = x;
+        }
+        // Having obtained RGB, convert channels to hex
+        // @ts-ignore
+        r = Math.round((r + m) * 255).toString(16);
+        // @ts-ignore
+        g = Math.round((g + m) * 255).toString(16);
+        // @ts-ignore
+        b = Math.round((b + m) * 255).toString(16);
+        // Prepend 0s, if necessary
+        // @ts-ignore
+        if (r.length == 1)
+            r = '0' + r;
+        // @ts-ignore
+        if (g.length == 1)
+            g = '0' + g;
+        // @ts-ignore
+        if (b.length == 1)
+            b = '0' + b;
+        return '#' + r + g + b;
+    }
+    mouseMove($event) {
+        if ($event.buttons > 0) {
+            this.selectColor($event, true);
+        }
+    }
+    mouseUp($event) {
+        this.selectColor($event, false);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryColorPickerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryColorPickerComponent, selector: "pry-color-picker", providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => PryColorPickerComponent),
+                multi: true
+            }
+        ], viewQueries: [{ propertyName: "selector", first: true, predicate: ["selector"], descendants: true }, { propertyName: "bar", first: true, predicate: ["bar"], descendants: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "<div\n  class=\"a-color-picker\"\n  (click)=\"togglePicker($event)\"\n  [style.background-color]=\"temporaryColor ?? color\"\n  [title]=\"color\"\n  role=\"button\"\n>\n  <div class=\"a-color-picker__modal\" [style.display]=\"picking ? 'flex' : 'none'\">\n    <div class=\"a-color-picker__modal__backdrop\">\n      <canvas\n        #selector\n        class=\"a-color-picker__modal__selector\"\n        (mousemove)=\"mouseMove($event)\"\n        (mouseup)=\"mouseUp($event)\"\n        height=\"300\"\n        width=\"300\"\n      ></canvas>\n      <canvas\n        #bar\n        class=\"a-color-picker__modal__bar\"\n        (click)=\"selectColorFromBar($event)\"\n        height=\"300\"\n        width=\"40\"\n      ></canvas>\n      <div class=\"a-color-picker__modal__input\" (click)=\"clickInput($event)\">\n        #<input [ngModel]=\"(color ?? '#').substring(1)\" (ngModelChange)=\"inputColor($event)\" #input />\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryColorPickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pry-color-picker', providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => PryColorPickerComponent),
+                            multi: true
+                        }
+                    ], template: "<div\n  class=\"a-color-picker\"\n  (click)=\"togglePicker($event)\"\n  [style.background-color]=\"temporaryColor ?? color\"\n  [title]=\"color\"\n  role=\"button\"\n>\n  <div class=\"a-color-picker__modal\" [style.display]=\"picking ? 'flex' : 'none'\">\n    <div class=\"a-color-picker__modal__backdrop\">\n      <canvas\n        #selector\n        class=\"a-color-picker__modal__selector\"\n        (mousemove)=\"mouseMove($event)\"\n        (mouseup)=\"mouseUp($event)\"\n        height=\"300\"\n        width=\"300\"\n      ></canvas>\n      <canvas\n        #bar\n        class=\"a-color-picker__modal__bar\"\n        (click)=\"selectColorFromBar($event)\"\n        height=\"300\"\n        width=\"40\"\n      ></canvas>\n      <div class=\"a-color-picker__modal__input\" (click)=\"clickInput($event)\">\n        #<input [ngModel]=\"(color ?? '#').substring(1)\" (ngModelChange)=\"inputColor($event)\" #input />\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { selector: [{
+                type: ViewChild,
+                args: ['selector']
+            }], bar: [{
+                type: ViewChild,
+                args: ['bar']
+            }], input: [{
+                type: ViewChild,
+                args: ['input']
+            }] } });
+
+const PRY_COLORPICKER_COMPONENTS = [PryColorPickerComponent];
+class PryColorPickerModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.6", ngImport: i0, type: PryColorPickerModule, declarations: [PryColorPickerComponent], imports: [CommonModule, FormsModule], exports: [PryColorPickerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryColorPickerModule, imports: [CommonModule, FormsModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryColorPickerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, FormsModule],
+                    declarations: [...PRY_COLORPICKER_COMPONENTS],
+                    exports: [...PRY_COLORPICKER_COMPONENTS]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PryColorPickerComponent, PryColorPickerModule };
+//# sourceMappingURL=provoly-dashboard-components-color-picker.mjs.map

package/fesm2022/provoly-dashboard-components-color-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"provoly-dashboard-components-color-picker.mjs","sources":["../../../../projects/provoly/dashboard/components/color-picker/color-picker.component.ts","../../../../projects/provoly/dashboard/components/color-picker/color-picker.component.html","../../../../projects/provoly/dashboard/components/color-picker/color-picker.module.ts","../../../../projects/provoly/dashboard/components/color-picker/provoly-dashboard-components-color-picker.ts"],"sourcesContent":["import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, forwardRef, ViewChild } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n  selector: 'pry-color-picker',\n  templateUrl: './color-picker.component.html',\n\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => PryColorPickerComponent),\n      multi: true\n    }\n  ]\n})\nexport class PryColorPickerComponent implements ControlValueAccessor, AfterViewInit {\n  onChange: any = () => {};\n  onTouch: any = () => {};\n  color? = '#000000';\n  barColor: string = '#0000ff';\n  disabled = false;\n  inhibate = true;\n  picking: boolean = false;\n\n  @ViewChild('selector') selector!: ElementRef<HTMLCanvasElement>;\n  selectorContext!: CanvasRenderingContext2D;\n  @ViewChild('bar') bar!: ElementRef<HTMLCanvasElement>;\n  barContext!: CanvasRenderingContext2D;\n  markerSelectorPosition: [number, number] = [0, 0];\n  markerBarPosition = 0;\n\n  @ViewChild('input') input!: ElementRef<HTMLInputElement>;\n  innerRadius = 3;\n  outerRadius = 8;\n  temporaryColor?: string;\n\n  constructor(private _cd: ChangeDetectorRef) {}\n\n  registerOnChange(fn: any): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this.onTouch = fn;\n  }\n\n  // Define what should happen in this component, if something changes outside\n  writeValue(color: string) {\n    if (this.color !== color && !this.inhibate) {\n      this.color = color;\n      this.onChange(this.color);\n      this.onTouch();\n      this._cd.markForCheck();\n      this.inputColor(color);\n    }\n  }\n\n  setDisabledState(isDisabled: boolean) {\n    this.disabled = isDisabled;\n    this._cd.markForCheck();\n  }\n\n  ngAfterViewInit(): void {\n    this.inhibate = false;\n    this.selectorContext = this.selector.nativeElement.getContext('2d', { willReadFrequently: true })!;\n    this.barContext = this.bar.nativeElement.getContext('2d', { willReadFrequently: true })!;\n  }\n\n  togglePicker($event: MouseEvent) {\n    this.picking = !this.disabled && !this.picking;\n    if (!this.picking && this.temporaryColor) {\n      this.writeValue(this.temporaryColor);\n    }\n    if (this.picking) {\n      this.redrawSelector();\n      this.redrawBar();\n    }\n  }\n\n  redrawSelector() {\n    this.selectorContext.clearRect(0, 0, this.selectorContext.canvas.width, this.selectorContext.canvas.height);\n    this.drawColorGradient(this.selectorContext, false, ['#ffffff', this.barColor]);\n    this.drawColorGradient(this.selectorContext, true, ['rgba(0,0,0,0)', '#000']);\n    this.drawSelectorMarker();\n  }\n\n  redrawBar() {\n    this.barContext.clearRect(0, 0, this.barContext.canvas.width, this.barContext.canvas.height);\n    this.drawColorGradient(this.barContext, true, [\n      '#FF0000',\n      '#ffff00',\n      '#00FF00',\n      '#00FFFF',\n      '#0000FF',\n      '#FF00FF',\n      '#FF0000'\n    ]);\n    this.drawBarMarker();\n  }\n\n  drawColorGradient(ctxt: CanvasRenderingContext2D, vertical = true, colors: string[]) {\n    const gradientArgs: [number, number, number, number] = vertical\n      ? [0, 0, 0, ctxt.canvas.height]\n      : [0, 0, ctxt.canvas.width, 0];\n    let gradient = ctxt.createLinearGradient(...gradientArgs);\n    colors.forEach((color, idx) => {\n      gradient.addColorStop(idx / (colors.length - 1), color);\n    });\n    ctxt.fillStyle = gradient;\n    ctxt.fillRect(0, 0, ctxt.canvas.width, ctxt.canvas.height);\n  }\n\n  drawSelectorMarker() {\n    const gradient = this.selectorContext.createRadialGradient(\n      this.markerSelectorPosition[0],\n      this.markerSelectorPosition[1],\n      this.innerRadius,\n      this.markerSelectorPosition[0],\n      this.markerSelectorPosition[1],\n      this.outerRadius\n    );\n    gradient.addColorStop(0, 'rgba(0,0,0,0)');\n    gradient.addColorStop(1, '#ffffff');\n\n    this.selectorContext.beginPath();\n    this.selectorContext.arc(\n      this.markerSelectorPosition[0],\n      this.markerSelectorPosition[1],\n      this.outerRadius,\n      0,\n      2 * Math.PI\n    );\n    this.selectorContext.fillStyle = gradient;\n    this.selectorContext.fill();\n    this.selectorContext.stroke();\n  }\n\n  drawBarMarker() {\n    this.barContext.strokeStyle = '2px solid black';\n    this.barContext.beginPath();\n    this.barContext.moveTo(0, this.markerBarPosition - this.innerRadius);\n    this.barContext.lineTo(this.barContext.canvas.width, this.markerBarPosition - this.innerRadius);\n    this.barContext.stroke();\n    this.barContext.beginPath();\n    this.barContext.moveTo(0, this.markerBarPosition + this.innerRadius);\n    this.barContext.lineTo(this.barContext.canvas.width, this.markerBarPosition + this.innerRadius);\n    this.barContext.stroke();\n  }\n\n  selectColor($event: MouseEvent, temporary = false) {\n    // Read pixel Color\n    const pixelColor = this.rgbToHex(\n      ...(this.selectorContext.getImageData($event.offsetX, $event.offsetY, 1, 1)['data'] as unknown as [\n        number,\n        number,\n        number\n      ])\n    );\n    if (!temporary) {\n      this.writeValue(pixelColor);\n    } else {\n      this.temporaryColor = pixelColor;\n    }\n\n    this.markerSelectorPosition = [$event.offsetX, $event.offsetY];\n    this.redrawSelector();\n    $event.stopPropagation();\n  }\n\n  selectColorFromBar($event: MouseEvent) {\n    this.markerBarPosition = $event.offsetY;\n    this.barColor = this.rgbToHex(\n      ...(this.barContext.getImageData(20, $event.offsetY, 1, 1)['data'] as unknown as [number, number, number])\n    );\n    this.redrawBar();\n    this.redrawSelector();\n    this.selectColor(\n      {\n        offsetX: this.markerSelectorPosition[0],\n        offsetY: this.markerSelectorPosition[1],\n        stopPropagation: () => $event.stopPropagation()\n      } as unknown as MouseEvent,\n      true\n    );\n    $event.stopPropagation();\n  }\n\n  componentToHex(c: number) {\n    return c.toString(16).padStart(2, '0');\n  }\n\n  rgbToHex(r: number, g: number, b: number) {\n    return '#' + this.componentToHex(r) + this.componentToHex(g) + this.componentToHex(b);\n  }\n\n  clickInput($event: MouseEvent) {\n    this.input.nativeElement.focus();\n    $event.stopPropagation();\n  }\n\n  inputColor($event: any) {\n    const possibleColor = !!$event ? ($event.indexOf('#') === -1 ? '#' + $event : $event) : '#FFFFFF';\n    if (/^#[0-9A-F]{6}$/i.test(possibleColor)) {\n      this.writeValue(possibleColor);\n      const rgba = this.strToRGBA(this.color!);\n      const hsva = this.RGBAtoHSVA(rgba);\n      this.markerBarPosition = (this.barContext.canvas.height * hsva.h) / 360;\n      this.markerSelectorPosition = [\n        (this.selectorContext.canvas.width * hsva.s) / 100,\n        this.selectorContext.canvas.height * (1 - hsva.v / 100)\n      ];\n      this.barColor = this.hslToHex(hsva.h, 100, 50);\n      this.redrawBar();\n      this.redrawSelector();\n    }\n  }\n\n  strToRGBA(str: string) {\n    const regex = /^((rgba)|rgb)[\\D]+([\\d.]+)[\\D]+([\\d.]+)[\\D]+([\\d.]+)[\\D]*?([\\d.]+|$)/i;\n    let match, rgba;\n\n    // Default to black for invalid color strings\n    this.selectorContext.fillStyle = '#000';\n\n    // Use canvas to convert the string to a valid color string\n    this.selectorContext.fillStyle = str;\n    match = regex.exec(this.selectorContext.fillStyle);\n\n    if (match) {\n      rgba = {\n        // @ts-ignore\n        r: match[3] * 1,\n        // @ts-ignore\n        g: match[4] * 1,\n        // @ts-ignore\n        b: match[5] * 1,\n        // @ts-ignore\n        a: match[6] * 1\n      };\n\n      // Workaround to mitigate a Chromium bug where the alpha value is rounded incorrectly\n      rgba.a = +rgba.a.toFixed(2);\n    } else {\n      match = this.selectorContext.fillStyle\n        .replace('#', '')\n        .match(/.{2}/g)!\n        .map((h) => parseInt(h, 16));\n      rgba = {\n        r: match[0],\n        g: match[1],\n        b: match[2],\n        a: 1\n      };\n    }\n\n    return rgba;\n  }\n\n  RGBAtoHSVA(rgba: any) {\n    const red = rgba.r / 255;\n    const green = rgba.g / 255;\n    const blue = rgba.b / 255;\n    const xmax = Math.max(red, green, blue);\n    const xmin = Math.min(red, green, blue);\n    const chroma = xmax - xmin;\n    const value = xmax;\n    let hue = 0;\n    let saturation = 0;\n\n    if (chroma) {\n      if (xmax === red) {\n        hue = (green - blue) / chroma;\n      }\n      if (xmax === green) {\n        hue = 2 + (blue - red) / chroma;\n      }\n      if (xmax === blue) {\n        hue = 4 + (red - green) / chroma;\n      }\n      if (xmax) {\n        saturation = chroma / xmax;\n      }\n    }\n\n    hue = Math.floor(hue * 60);\n\n    return {\n      h: hue < 0 ? hue + 360 : hue,\n      s: Math.round(saturation * 100),\n      v: Math.round(value * 100),\n      a: rgba.a\n    };\n  }\n\n  hslToHex(h: number, s: number, l: number) {\n    s /= 100;\n    l /= 100;\n\n    let c = (1 - Math.abs(2 * l - 1)) * s,\n      x = c * (1 - Math.abs(((h / 60) % 2) - 1)),\n      m = l - c / 2,\n      r = 0,\n      g = 0,\n      b = 0;\n\n    if (0 <= h && h < 60) {\n      r = c;\n      g = x;\n      b = 0;\n    } else if (60 <= h && h < 120) {\n      r = x;\n      g = c;\n      b = 0;\n    } else if (120 <= h && h < 180) {\n      r = 0;\n      g = c;\n      b = x;\n    } else if (180 <= h && h < 240) {\n      r = 0;\n      g = x;\n      b = c;\n    } else if (240 <= h && h < 300) {\n      r = x;\n      g = 0;\n      b = c;\n    } else if (300 <= h && h < 360) {\n      r = c;\n      g = 0;\n      b = x;\n    }\n    // Having obtained RGB, convert channels to hex\n    // @ts-ignore\n    r = Math.round((r + m) * 255).toString(16);\n    // @ts-ignore\n    g = Math.round((g + m) * 255).toString(16);\n    // @ts-ignore\n    b = Math.round((b + m) * 255).toString(16);\n\n    // Prepend 0s, if necessary\n    // @ts-ignore\n    if (r.length == 1) r = '0' + r;\n    // @ts-ignore\n    if (g.length == 1) g = '0' + g;\n    // @ts-ignore\n    if (b.length == 1) b = '0' + b;\n\n    return '#' + r + g + b;\n  }\n\n  mouseMove($event: MouseEvent) {\n    if ($event.buttons > 0) {\n      this.selectColor($event, true);\n    }\n  }\n\n  mouseUp($event: MouseEvent) {\n    this.selectColor($event, false);\n  }\n}\n","<div\n  class=\"a-color-picker\"\n  (click)=\"togglePicker($event)\"\n  [style.background-color]=\"temporaryColor ?? color\"\n  [title]=\"color\"\n  role=\"button\"\n>\n  <div class=\"a-color-picker__modal\" [style.display]=\"picking ? 'flex' : 'none'\">\n    <div class=\"a-color-picker__modal__backdrop\">\n      <canvas\n        #selector\n        class=\"a-color-picker__modal__selector\"\n        (mousemove)=\"mouseMove($event)\"\n        (mouseup)=\"mouseUp($event)\"\n        height=\"300\"\n        width=\"300\"\n      ></canvas>\n      <canvas\n        #bar\n        class=\"a-color-picker__modal__bar\"\n        (click)=\"selectColorFromBar($event)\"\n        height=\"300\"\n        width=\"40\"\n      ></canvas>\n      <div class=\"a-color-picker__modal__input\" (click)=\"clickInput($event)\">\n        #<input [ngModel]=\"(color ?? '#').substring(1)\" (ngModelChange)=\"inputColor($event)\" #input />\n      </div>\n    </div>\n  </div>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { PryColorPickerComponent } from './color-picker.component';\n\nconst PRY_COLORPICKER_COMPONENTS = [PryColorPickerComponent];\n\n@NgModule({\n  imports: [CommonModule, FormsModule],\n  declarations: [...PRY_COLORPICKER_COMPONENTS],\n  exports: [...PRY_COLORPICKER_COMPONENTS]\n})\nexport class PryColorPickerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MAea,uBAAuB,CAAA;AAqBlC,IAAA,WAAA,CAAoB,GAAsB,EAAA;QAAtB,IAAG,CAAA,GAAA,GAAH,GAAG,CAAmB;AApB1C,QAAA,IAAA,CAAA,QAAQ,GAAQ,MAAK,GAAG,CAAC;AACzB,QAAA,IAAA,CAAA,OAAO,GAAQ,MAAK,GAAG,CAAC;QACxB,IAAK,CAAA,KAAA,GAAI,SAAS,CAAC;QACnB,IAAQ,CAAA,QAAA,GAAW,SAAS,CAAC;QAC7B,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;QACjB,IAAQ,CAAA,QAAA,GAAG,IAAI,CAAC;QAChB,IAAO,CAAA,OAAA,GAAY,KAAK,CAAC;AAMzB,QAAA,IAAA,CAAA,sBAAsB,GAAqB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAClD,IAAiB,CAAA,iBAAA,GAAG,CAAC,CAAC;QAGtB,IAAW,CAAA,WAAA,GAAG,CAAC,CAAC;QAChB,IAAW,CAAA,WAAA,GAAG,CAAC,CAAC;KAG8B;AAE9C,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;KACpB;AAED,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;KACnB;;AAGD,IAAA,UAAU,CAAC,KAAa,EAAA;QACtB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AAC1C,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;AACnB,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC1B,IAAI,CAAC,OAAO,EAAE,CAAC;AACf,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC;AACxB,YAAA,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;AACxB,SAAA;KACF;AAED,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAClC,QAAA,IAAI,CAAC,QAAQ,GAAG,UAAU,CAAC;AAC3B,QAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC;KACzB;IAED,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;AACtB,QAAA,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE,kBAAkB,EAAE,IAAI,EAAE,CAAE,CAAC;AACnG,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,UAAU,CAAC,IAAI,EAAE,EAAE,kBAAkB,EAAE,IAAI,EAAE,CAAE,CAAC;KAC1F;AAED,IAAA,YAAY,CAAC,MAAkB,EAAA;AAC7B,QAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;QAC/C,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,cAAc,EAAE;AACxC,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;AACtC,SAAA;QACD,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,cAAc,EAAE,CAAC;YACtB,IAAI,CAAC,SAAS,EAAE,CAAC;AAClB,SAAA;KACF;IAED,cAAc,GAAA;QACZ,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AAC5G,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;AAChF,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,EAAE,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAC;QAC9E,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAC3B;IAED,SAAS,GAAA;QACP,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAC7F,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE;YAC5C,SAAS;YACT,SAAS;YACT,SAAS;YACT,SAAS;YACT,SAAS;YACT,SAAS;YACT,SAAS;AACV,SAAA,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;AAED,IAAA,iBAAiB,CAAC,IAA8B,EAAE,QAAQ,GAAG,IAAI,EAAE,MAAgB,EAAA;QACjF,MAAM,YAAY,GAAqC,QAAQ;AAC7D,cAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC;AAC/B,cAAE,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QACjC,IAAI,QAAQ,GAAG,IAAI,CAAC,oBAAoB,CAAC,GAAG,YAAY,CAAC,CAAC;QAC1D,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,GAAG,KAAI;AAC5B,YAAA,QAAQ,CAAC,YAAY,CAAC,GAAG,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC;AAC1D,SAAC,CAAC,CAAC;AACH,QAAA,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;AAC1B,QAAA,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;KAC5D;IAED,kBAAkB,GAAA;QAChB,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,oBAAoB,CACxD,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC9B,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC9B,IAAI,CAAC,WAAW,EAChB,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC9B,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC9B,IAAI,CAAC,WAAW,CACjB,CAAC;AACF,QAAA,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,eAAe,CAAC,CAAC;AAC1C,QAAA,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;AAEpC,QAAA,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE,CAAC;AACjC,QAAA,IAAI,CAAC,eAAe,CAAC,GAAG,CACtB,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC9B,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC9B,IAAI,CAAC,WAAW,EAChB,CAAC,EACD,CAAC,GAAG,IAAI,CAAC,EAAE,CACZ,CAAC;AACF,QAAA,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,QAAQ,CAAC;AAC1C,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC;AAC5B,QAAA,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,CAAC;KAC/B;IAED,aAAa,GAAA;AACX,QAAA,IAAI,CAAC,UAAU,CAAC,WAAW,GAAG,iBAAiB,CAAC;AAChD,QAAA,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,CAAC;AAC5B,QAAA,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC;QACrE,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC;AAChG,QAAA,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC;AACzB,QAAA,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,CAAC;AAC5B,QAAA,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC;QACrE,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC;AAChG,QAAA,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC;KAC1B;AAED,IAAA,WAAW,CAAC,MAAkB,EAAE,SAAS,GAAG,KAAK,EAAA;;AAE/C,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,CAC9B,GAAI,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAIhF,CACH,CAAC;QACF,IAAI,CAAC,SAAS,EAAE;AACd,YAAA,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;AAC7B,SAAA;AAAM,aAAA;AACL,YAAA,IAAI,CAAC,cAAc,GAAG,UAAU,CAAC;AAClC,SAAA;AAED,QAAA,IAAI,CAAC,sBAAsB,GAAG,CAAC,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;QAC/D,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,MAAM,CAAC,eAAe,EAAE,CAAC;KAC1B;AAED,IAAA,kBAAkB,CAAC,MAAkB,EAAA;AACnC,QAAA,IAAI,CAAC,iBAAiB,GAAG,MAAM,CAAC,OAAO,CAAC;AACxC,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAC3B,GAAI,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAyC,CAC3G,CAAC;QACF,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,WAAW,CACd;AACE,YAAA,OAAO,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC;AACvC,YAAA,OAAO,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC;AACvC,YAAA,eAAe,EAAE,MAAM,MAAM,CAAC,eAAe,EAAE;SACvB,EAC1B,IAAI,CACL,CAAC;QACF,MAAM,CAAC,eAAe,EAAE,CAAC;KAC1B;AAED,IAAA,cAAc,CAAC,CAAS,EAAA;AACtB,QAAA,OAAO,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;KACxC;AAED,IAAA,QAAQ,CAAC,CAAS,EAAE,CAAS,EAAE,CAAS,EAAA;QACtC,OAAO,GAAG,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;KACvF;AAED,IAAA,UAAU,CAAC,MAAkB,EAAA;AAC3B,QAAA,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;QACjC,MAAM,CAAC,eAAe,EAAE,CAAC;KAC1B;AAED,IAAA,UAAU,CAAC,MAAW,EAAA;AACpB,QAAA,MAAM,aAAa,GAAG,CAAC,CAAC,MAAM,IAAI,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,GAAG,MAAM,IAAI,SAAS,CAAC;AAClG,QAAA,IAAI,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE;AACzC,YAAA,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;YAC/B,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAM,CAAC,CAAC;YACzC,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;AACnC,YAAA,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,IAAI,GAAG,CAAC;YACxE,IAAI,CAAC,sBAAsB,GAAG;AAC5B,gBAAA,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,IAAI,GAAG;AAClD,gBAAA,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC;aACxD,CAAC;AACF,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC;YAC/C,IAAI,CAAC,SAAS,EAAE,CAAC;YACjB,IAAI,CAAC,cAAc,EAAE,CAAC;AACvB,SAAA;KACF;AAED,IAAA,SAAS,CAAC,GAAW,EAAA;QACnB,MAAM,KAAK,GAAG,uEAAuE,CAAC;QACtF,IAAI,KAAK,EAAE,IAAI,CAAC;;AAGhB,QAAA,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,MAAM,CAAC;;AAGxC,QAAA,IAAI,CAAC,eAAe,CAAC,SAAS,GAAG,GAAG,CAAC;QACrC,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;AAEnD,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,IAAI,GAAG;;AAEL,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC;;AAEf,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC;;AAEf,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC;;AAEf,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC;aAChB,CAAC;;AAGF,YAAA,IAAI,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAC7B,SAAA;AAAM,aAAA;AACL,YAAA,KAAK,GAAG,IAAI,CAAC,eAAe,CAAC,SAAS;AACnC,iBAAA,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;iBAChB,KAAK,CAAC,OAAO,CAAE;AACf,iBAAA,GAAG,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;AAC/B,YAAA,IAAI,GAAG;AACL,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACX,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACX,gBAAA,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;AACX,gBAAA,CAAC,EAAE,CAAC;aACL,CAAC;AACH,SAAA;AAED,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,UAAU,CAAC,IAAS,EAAA;AAClB,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC;AACzB,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC;AAC3B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,CAAC,GAAG,GAAG,CAAC;AAC1B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;AACxC,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;AACxC,QAAA,MAAM,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;QAC3B,MAAM,KAAK,GAAG,IAAI,CAAC;QACnB,IAAI,GAAG,GAAG,CAAC,CAAC;QACZ,IAAI,UAAU,GAAG,CAAC,CAAC;AAEnB,QAAA,IAAI,MAAM,EAAE;YACV,IAAI,IAAI,KAAK,GAAG,EAAE;gBAChB,GAAG,GAAG,CAAC,KAAK,GAAG,IAAI,IAAI,MAAM,CAAC;AAC/B,aAAA;YACD,IAAI,IAAI,KAAK,KAAK,EAAE;gBAClB,GAAG,GAAG,CAAC,GAAG,CAAC,IAAI,GAAG,GAAG,IAAI,MAAM,CAAC;AACjC,aAAA;YACD,IAAI,IAAI,KAAK,IAAI,EAAE;gBACjB,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,GAAG,KAAK,IAAI,MAAM,CAAC;AAClC,aAAA;AACD,YAAA,IAAI,IAAI,EAAE;AACR,gBAAA,UAAU,GAAG,MAAM,GAAG,IAAI,CAAC;AAC5B,aAAA;AACF,SAAA;QAED,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,EAAE,CAAC,CAAC;QAE3B,OAAO;AACL,YAAA,CAAC,EAAE,GAAG,GAAG,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG;YAC5B,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,CAAC;YAC/B,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC;YAC1B,CAAC,EAAE,IAAI,CAAC,CAAC;SACV,CAAC;KACH;AAED,IAAA,QAAQ,CAAC,CAAS,EAAE,CAAS,EAAE,CAAS,EAAA;QACtC,CAAC,IAAI,GAAG,CAAC;QACT,CAAC,IAAI,GAAG,CAAC;AAET,QAAA,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,EACnC,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAC1C,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,EACb,CAAC,GAAG,CAAC,EACL,CAAC,GAAG,CAAC,EACL,CAAC,GAAG,CAAC,CAAC;AAER,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE;YACpB,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;AACP,SAAA;AAAM,aAAA,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,EAAE;YAC7B,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;AACP,SAAA;AAAM,aAAA,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,EAAE;YAC9B,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;AACP,SAAA;AAAM,aAAA,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,EAAE;YAC9B,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;AACP,SAAA;AAAM,aAAA,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,EAAE;YAC9B,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;AACP,SAAA;AAAM,aAAA,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,EAAE;YAC9B,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;YACN,CAAC,GAAG,CAAC,CAAC;AACP,SAAA;;;AAGD,QAAA,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;;AAE3C,QAAA,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;;AAE3C,QAAA,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;;;AAI3C,QAAA,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC;AAAE,YAAA,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;;AAE/B,QAAA,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC;AAAE,YAAA,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;;AAE/B,QAAA,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC;AAAE,YAAA,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;AAE/B,QAAA,OAAO,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;KACxB;AAED,IAAA,SAAS,CAAC,MAAkB,EAAA;AAC1B,QAAA,IAAI,MAAM,CAAC,OAAO,GAAG,CAAC,EAAE;AACtB,YAAA,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAChC,SAAA;KACF;AAED,IAAA,OAAO,CAAC,MAAkB,EAAA;AACxB,QAAA,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;KACjC;8GAtVU,uBAAuB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,uBAAuB,EARvB,QAAA,EAAA,kBAAA,EAAA,SAAA,EAAA;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,uBAAuB,CAAC;AACtD,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;AACF,SAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,KAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,KAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,OAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,OAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECbH,q8BA8BA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,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,CAAA,EAAA,CAAA,CAAA,EAAA;;2FDfa,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAZnC,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,kBAAkB,EAGjB,SAAA,EAAA;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,6BAA6B,CAAC;AACtD,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACF,qBAAA,EAAA,QAAA,EAAA,q8BAAA,EAAA,CAAA;wGAWsB,QAAQ,EAAA,CAAA;sBAA9B,SAAS;uBAAC,UAAU,CAAA;gBAEH,GAAG,EAAA,CAAA;sBAApB,SAAS;uBAAC,KAAK,CAAA;gBAKI,KAAK,EAAA,CAAA;sBAAxB,SAAS;uBAAC,OAAO,CAAA;;;AE1BpB,MAAM,0BAA0B,GAAG,CAAC,uBAAuB,CAAC,CAAC;MAOhD,oBAAoB,CAAA;8GAApB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,iBAPG,uBAAuB,CAAA,EAAA,OAAA,EAAA,CAG/C,YAAY,EAAE,WAAW,aAHD,uBAAuB,CAAA,EAAA,CAAA,CAAA,EAAA;+GAO9C,oBAAoB,EAAA,OAAA,EAAA,CAJrB,YAAY,EAAE,WAAW,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAIxB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBALhC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;AACpC,oBAAA,YAAY,EAAE,CAAC,GAAG,0BAA0B,CAAC;AAC7C,oBAAA,OAAO,EAAE,CAAC,GAAG,0BAA0B,CAAC;AACzC,iBAAA,CAAA;;;ACXD;;AAEG;;;;"}

package/fesm2022/provoly-dashboard-components-scheme-picker.mjs

@@ -0,0 +1,171 @@
+import * as i3 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { Injectable, forwardRef, Component, NgModule } from '@angular/core';
+import * as i4 from '@angular/forms';
+import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+import { BehaviorSubject, map } from 'rxjs';
+import * as i2 from '@provoly/dashboard';
+import { VegaColorType, PryI18nModule, PrySelectModule, PryIconModule } from '@provoly/dashboard';
+import { vega } from 'vega-embed';
+import * as i5 from '@provoly/dashboard/components/color-picker';
+import { PryColorPickerModule } from '@provoly/dashboard/components/color-picker';
+
+class PrySchemeService {
+    constructor() {
+        this.schemeIds$ = new BehaviorSubject([]);
+        vega.scheme('KO/W/OK', ['#C04D3F', '#FD9843', '#9ABE29']);
+        vega.scheme('Provoly', ['#113B6E', '#4E92E4', '#40B688', '#7BCCAD', '#FFC971', '#FD9843', '#EC547A']);
+        this.schemeIds$.next(Object.values(VegaColorType));
+    }
+    getSchemeColors(scheme) {
+        if (!scheme) {
+            return this.getSchemeColors(this.getDefaultScheme());
+        }
+        if (scheme.indexOf('#') === 0) {
+            return scheme.split(',').map((color) => (color.indexOf('#') === 0 ? color : `#${color}`));
+        }
+        return vega.scheme(scheme);
+    }
+    getDefaultScheme() {
+        return this.schemeIds$.getValue()[0];
+    }
+    randomColor() {
+        return ('#' +
+            Math.floor(Math.random() * 16777215)
+                .toString(16)
+                .padStart(6, '0')
+                .toUpperCase());
+    }
+    assertScheme(scheme) {
+        if (!!scheme) {
+            if (scheme.indexOf('#') === 0) {
+                vega.scheme(scheme, scheme.split(','));
+                this.schemeIds$.next([...new Set([...this.schemeIds$.getValue(), scheme])]);
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemeService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemeService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: function () { return []; } });
+
+class PrySchemePickerComponent {
+    constructor(_cd, schemeService, i18nService) {
+        this._cd = _cd;
+        this.schemeService = schemeService;
+        this.i18nService = i18nService;
+        this.onChange = () => { };
+        this.onTouch = () => { };
+        this.scheme$ = new BehaviorSubject('Provoly');
+        this.inhibate = true;
+        this.disabled = false;
+        this.schemes$ = this.schemeService.schemeIds$.pipe(map((schemes) => {
+            let customNumber = 1;
+            return schemes.map((scheme, idx) => ({
+                id: scheme,
+                label: scheme.indexOf('#') === 0 ? this.i18nService.instant('@pry.widget.custom', { id: customNumber++ }) : scheme
+            }));
+        }));
+        this.schemeColors$ = this.scheme$.pipe(map((scheme) => this.schemeService.getSchemeColors(scheme)));
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouch = fn;
+    }
+    // Define what should happen in this component, if something changes outside
+    writeValue(scheme) {
+        if (this.scheme$.getValue() !== scheme && !this.inhibate) {
+            this.scheme$.next(scheme);
+            this.onChange(this.scheme$.getValue());
+            this.onTouch();
+            this._cd.markForCheck();
+            this.schemeService.assertScheme(this.scheme$.getValue());
+            this.temporaryDisable();
+        }
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+        this._cd.markForCheck();
+    }
+    temporaryDisable() {
+        this.inhibate = true;
+        setTimeout(() => {
+            this.inhibate = false;
+        }, 100);
+    }
+    ngAfterViewInit() {
+        this.temporaryDisable();
+    }
+    changeColorScheme($event) {
+        if ($event === '#') {
+            this.writeValue(this.schemeService.getSchemeColors(this.schemeService.getDefaultScheme()).join(','));
+        }
+        else {
+            this.writeValue($event);
+        }
+    }
+    modifyColorScheme($event, index) {
+        if (!this.inhibate) {
+            const newScheme = [...this.schemeService.getSchemeColors(this.scheme$.getValue())];
+            newScheme[index] = $event;
+            this.writeValue(newScheme.join(','));
+        }
+    }
+    addColorToScheme() {
+        this.writeValue(this.schemeService
+            .getSchemeColors(this.scheme$.getValue())
+            .concat('#' + this.schemeService.randomColor())
+            .join(','));
+    }
+    removeColorFromScheme(index) {
+        const newScheme = [...this.schemeService.getSchemeColors(this.scheme$.getValue())];
+        newScheme.splice(index, 1);
+        this.writeValue(newScheme.join(','));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemePickerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: PrySchemeService }, { token: i2.PryI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PrySchemePickerComponent, selector: "pry-scheme-picker", providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => PrySchemePickerComponent),
+                multi: true
+            }
+        ], ngImport: i0, template: "<div class=\"m-color-scheme\">\n  <label class=\"a-label\" for=\"scheme\">{{ '@pry.widget.colorScheme' | i18n }}</label>\n  <pry-select\n    (ngModelChange)=\"changeColorScheme($event)\"\n    [ngModel]=\"scheme$ | async\"\n    [itemsAsOption]=\"true\"\n    [items]=\"schemes$ | async\"\n    id=\"scheme\"\n    bindValue=\"id\"\n    bindLabel=\"label\"\n  ></pry-select>\n</div>\n\n<div class=\"m-color-scheme__display\">\n  <div class=\"m-color-scheme__display__item\" *ngFor=\"let colorScheme of schemeColors$ | async; let i = index\">\n    <pry-color-picker [ngModel]=\"colorScheme\" (ngModelChange)=\"modifyColorScheme($event, i)\"></pry-color-picker>\n    <button\n      (click)=\"removeColorFromScheme(i)\"\n      class=\"a-btn a-btn--icon-only\"\n      title=\"{{ '@pry.widget.removeColor' | i18n }}\"\n    >\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.removeColor' | i18n }}</span>\n      <pry-icon iconSvg=\"trash\"></pry-icon>\n    </button>\n  </div>\n  <button\n    (click)=\"addColorToScheme()\"\n    class=\"a-btn a-btn--primary a-btn--icon-only\"\n    title=\"{{ '@pry.widget.addColor' | i18n }}\"\n  >\n    <span class=\"u-visually-hidden\">{{ '@pry.widget.addColor' | i18n }}</span>\n    <pry-icon iconSvg=\"add\"></pry-icon>\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i5.PryColorPickerComponent, selector: "pry-color-picker" }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemePickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pry-scheme-picker', providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => PrySchemePickerComponent),
+                            multi: true
+                        }
+                    ], template: "<div class=\"m-color-scheme\">\n  <label class=\"a-label\" for=\"scheme\">{{ '@pry.widget.colorScheme' | i18n }}</label>\n  <pry-select\n    (ngModelChange)=\"changeColorScheme($event)\"\n    [ngModel]=\"scheme$ | async\"\n    [itemsAsOption]=\"true\"\n    [items]=\"schemes$ | async\"\n    id=\"scheme\"\n    bindValue=\"id\"\n    bindLabel=\"label\"\n  ></pry-select>\n</div>\n\n<div class=\"m-color-scheme__display\">\n  <div class=\"m-color-scheme__display__item\" *ngFor=\"let colorScheme of schemeColors$ | async; let i = index\">\n    <pry-color-picker [ngModel]=\"colorScheme\" (ngModelChange)=\"modifyColorScheme($event, i)\"></pry-color-picker>\n    <button\n      (click)=\"removeColorFromScheme(i)\"\n      class=\"a-btn a-btn--icon-only\"\n      title=\"{{ '@pry.widget.removeColor' | i18n }}\"\n    >\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.removeColor' | i18n }}</span>\n      <pry-icon iconSvg=\"trash\"></pry-icon>\n    </button>\n  </div>\n  <button\n    (click)=\"addColorToScheme()\"\n    class=\"a-btn a-btn--primary a-btn--icon-only\"\n    title=\"{{ '@pry.widget.addColor' | i18n }}\"\n  >\n    <span class=\"u-visually-hidden\">{{ '@pry.widget.addColor' | i18n }}</span>\n    <pry-icon iconSvg=\"add\"></pry-icon>\n  </button>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: PrySchemeService }, { type: i2.PryI18nService }]; } });
+
+const PRY_SCHEMEPICKER_COMPONENTS = [PrySchemePickerComponent];
+class PrySchemePickerModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.6", ngImport: i0, type: PrySchemePickerModule, declarations: [PrySchemePickerComponent], imports: [CommonModule, FormsModule, PryI18nModule, PrySelectModule, PryColorPickerModule, PryIconModule], exports: [PrySchemePickerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemePickerModule, imports: [CommonModule, FormsModule, PryI18nModule, PrySelectModule, PryColorPickerModule, PryIconModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PrySchemePickerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, FormsModule, PryI18nModule, PrySelectModule, PryColorPickerModule, PryIconModule],
+                    declarations: [...PRY_SCHEMEPICKER_COMPONENTS],
+                    exports: [...PRY_SCHEMEPICKER_COMPONENTS]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PrySchemePickerComponent, PrySchemePickerModule, PrySchemeService };
+//# sourceMappingURL=provoly-dashboard-components-scheme-picker.mjs.map

package/fesm2022/provoly-dashboard-components-scheme-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"provoly-dashboard-components-scheme-picker.mjs","sources":["../../../../projects/provoly/dashboard/components/scheme-picker/scheme.service.ts","../../../../projects/provoly/dashboard/components/scheme-picker/scheme-picker.component.ts","../../../../projects/provoly/dashboard/components/scheme-picker/scheme-picker.component.html","../../../../projects/provoly/dashboard/components/scheme-picker/scheme-picker.module.ts","../../../../projects/provoly/dashboard/components/scheme-picker/provoly-dashboard-components-scheme-picker.ts"],"sourcesContent":["import {Injectable} from '@angular/core';\nimport {BehaviorSubject} from 'rxjs';\nimport {VegaColorType} from '@provoly/dashboard';\nimport {vega} from 'vega-embed';\n\n@Injectable({ providedIn: 'root' })\nexport class PrySchemeService {\n  schemeIds$ = new BehaviorSubject<string[]>([]);\n\n  constructor() {\n    vega.scheme('KO/W/OK', ['#C04D3F', '#FD9843', '#9ABE29']);\n    vega.scheme('Provoly', ['#113B6E', '#4E92E4', '#40B688', '#7BCCAD', '#FFC971', '#FD9843', '#EC547A']);\n    this.schemeIds$.next(Object.values(VegaColorType));\n  }\n\n  getSchemeColors(scheme: string): string[] {\n    if (!scheme) {\n      return this.getSchemeColors(this.getDefaultScheme());\n    }\n    if (scheme.indexOf('#') === 0) {\n      return scheme.split(',').map((color) => (color.indexOf('#') === 0 ? color : `#${color}`));\n    }\n    return vega.scheme(scheme) as string[];\n  }\n\n  getDefaultScheme() {\n    return this.schemeIds$.getValue()[0];\n  }\n\n  randomColor() {\n    return (\n      '#' +\n      Math.floor(Math.random() * 16777215)\n        .toString(16)\n        .padStart(6, '0')\n        .toUpperCase()\n    );\n  }\n\n  assertScheme(scheme: string) {\n    if (!!scheme) {\n      if (scheme.indexOf('#') === 0) {\n        vega.scheme(scheme, scheme.split(','));\n        this.schemeIds$.next([...new Set([...this.schemeIds$.getValue(), scheme])]);\n      }\n    }\n  }\n}\n","import { AfterViewInit, ChangeDetectorRef, Component, forwardRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { PrySchemeService } from './scheme.service';\nimport { BehaviorSubject, map, Observable } from 'rxjs';\nimport { PryI18nService } from '@provoly/dashboard';\n\n@Component({\n  selector: 'pry-scheme-picker',\n  templateUrl: './scheme-picker.component.html',\n\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => PrySchemePickerComponent),\n      multi: true\n    }\n  ]\n})\nexport class PrySchemePickerComponent implements ControlValueAccessor, AfterViewInit {\n  onChange: any = () => {};\n  onTouch: any = () => {};\n  scheme$ = new BehaviorSubject<string>('Provoly');\n  schemes$: Observable<{ id: string; label: string }[]>;\n  inhibate = true;\n  disabled = false;\n  schemeColors$: Observable<string[]>;\n\n  constructor(\n    private _cd: ChangeDetectorRef,\n    private schemeService: PrySchemeService,\n    private i18nService: PryI18nService\n  ) {\n    this.schemes$ = this.schemeService.schemeIds$.pipe(\n      map((schemes) => {\n        let customNumber = 1;\n        return schemes.map((scheme, idx) => ({\n          id: scheme,\n          label:\n            scheme.indexOf('#') === 0 ? this.i18nService.instant('@pry.widget.custom', { id: customNumber++ }) : scheme\n        }));\n      })\n    );\n    this.schemeColors$ = this.scheme$.pipe(map((scheme) => this.schemeService.getSchemeColors(scheme)));\n  }\n\n  registerOnChange(fn: any): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: any): void {\n    this.onTouch = fn;\n  }\n\n  // Define what should happen in this component, if something changes outside\n  writeValue(scheme: string) {\n    if (this.scheme$.getValue() !== scheme && !this.inhibate) {\n      this.scheme$.next(scheme);\n      this.onChange(this.scheme$.getValue());\n      this.onTouch();\n      this._cd.markForCheck();\n      this.schemeService.assertScheme(this.scheme$.getValue());\n      this.temporaryDisable();\n    }\n  }\n\n  setDisabledState(isDisabled: boolean) {\n    this.disabled = isDisabled;\n    this._cd.markForCheck();\n  }\n\n  temporaryDisable() {\n    this.inhibate = true;\n    setTimeout(() => {\n      this.inhibate = false;\n    }, 100);\n  }\n\n  ngAfterViewInit(): void {\n    this.temporaryDisable();\n  }\n\n  changeColorScheme($event: any) {\n    if ($event === '#') {\n      this.writeValue(this.schemeService.getSchemeColors(this.schemeService.getDefaultScheme()).join(','));\n    } else {\n      this.writeValue($event);\n    }\n  }\n\n  modifyColorScheme($event: string, index: number) {\n    if (!this.inhibate) {\n      const newScheme = [...this.schemeService.getSchemeColors(this.scheme$.getValue())];\n      newScheme[index] = $event;\n      this.writeValue(newScheme.join(','));\n    }\n  }\n\n  addColorToScheme() {\n    this.writeValue(\n      this.schemeService\n        .getSchemeColors(this.scheme$.getValue())\n        .concat('#' + this.schemeService.randomColor())\n        .join(',')\n    );\n  }\n\n  removeColorFromScheme(index: number) {\n    const newScheme = [...this.schemeService.getSchemeColors(this.scheme$.getValue())];\n    newScheme.splice(index, 1);\n    this.writeValue(newScheme.join(','));\n  }\n}\n","<div class=\"m-color-scheme\">\n  <label class=\"a-label\" for=\"scheme\">{{ '@pry.widget.colorScheme' | i18n }}</label>\n  <pry-select\n    (ngModelChange)=\"changeColorScheme($event)\"\n    [ngModel]=\"scheme$ | async\"\n    [itemsAsOption]=\"true\"\n    [items]=\"schemes$ | async\"\n    id=\"scheme\"\n    bindValue=\"id\"\n    bindLabel=\"label\"\n  ></pry-select>\n</div>\n\n<div class=\"m-color-scheme__display\">\n  <div class=\"m-color-scheme__display__item\" *ngFor=\"let colorScheme of schemeColors$ | async; let i = index\">\n    <pry-color-picker [ngModel]=\"colorScheme\" (ngModelChange)=\"modifyColorScheme($event, i)\"></pry-color-picker>\n    <button\n      (click)=\"removeColorFromScheme(i)\"\n      class=\"a-btn a-btn--icon-only\"\n      title=\"{{ '@pry.widget.removeColor' | i18n }}\"\n    >\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.removeColor' | i18n }}</span>\n      <pry-icon iconSvg=\"trash\"></pry-icon>\n    </button>\n  </div>\n  <button\n    (click)=\"addColorToScheme()\"\n    class=\"a-btn a-btn--primary a-btn--icon-only\"\n    title=\"{{ '@pry.widget.addColor' | i18n }}\"\n  >\n    <span class=\"u-visually-hidden\">{{ '@pry.widget.addColor' | i18n }}</span>\n    <pry-icon iconSvg=\"add\"></pry-icon>\n  </button>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { PrySchemePickerComponent } from './scheme-picker.component';\nimport { PryI18nModule, PryIconModule, PrySelectModule } from '@provoly/dashboard';\nimport { PryColorPickerModule } from '@provoly/dashboard/components/color-picker';\n\nconst PRY_SCHEMEPICKER_COMPONENTS = [PrySchemePickerComponent];\n\n@NgModule({\n  imports: [CommonModule, FormsModule, PryI18nModule, PrySelectModule, PryColorPickerModule, PryIconModule],\n  declarations: [...PRY_SCHEMEPICKER_COMPONENTS],\n  exports: [...PRY_SCHEMEPICKER_COMPONENTS]\n})\nexport class PrySchemePickerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.PrySchemeService"],"mappings":"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"}