ngx-color 8.0.2 → 9.0.0

package/README.md

@@ -6,8 +6,6 @@
   <a href="https://www.npmjs.org/package/ngx-color">
     <img src="https://badge.fury.io/js/ngx-color.svg" alt="npm">
   </a> 
-  <a href="https://circleci.com/gh/scttcper/ngx-color">
-    <img src="https://circleci.com/gh/scttcper/ngx-color.svg?style=svg" alt="circleci"></a> 
   <a href="https://codecov.io/github/scttcper/ngx-color">
     <img src="https://img.shields.io/codecov/c/github/scttcper/ngx-color.svg" alt="codecov">
   </a>
@@ -59,7 +57,8 @@ Latest version available for each version of Angular
 | 5.1.4     | 9.x       |
 | 6.2.0     | 10.x 11.x |
 | 7.3.3     | 12.x 13.x |
-| current   | >= 14.x   |
+| 8.0.3     | 14.x 15.x |
+| current   | >= 16.x   |
 
 ### Install
 

package/alpha/alpha-picker.component.d.ts

@@ -19,7 +19,7 @@ export declare class AlphaPickerComponent extends ColorWrap implements OnChanges
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AlphaPickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AlphaPickerComponent, "color-alpha-picker", never, { "width": "width"; "height": "height"; "direction": "direction"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AlphaPickerComponent, "color-alpha-picker", never, { "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class ColorAlphaModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorAlphaModule, never>;

package/alpha.component.d.ts

@@ -24,7 +24,7 @@ export declare class AlphaComponent implements OnChanges {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AlphaComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AlphaComponent, "color-alpha", never, { "hsl": "hsl"; "rgb": "rgb"; "pointer": "pointer"; "shadow": "shadow"; "radius": "radius"; "direction": "direction"; }, { "onChange": "onChange"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AlphaComponent, "color-alpha", never, { "hsl": { "alias": "hsl"; "required": false; }; "rgb": { "alias": "rgb"; "required": false; }; "pointer": { "alias": "pointer"; "required": false; }; "shadow": { "alias": "shadow"; "required": false; }; "radius": { "alias": "radius"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; }, { "onChange": "onChange"; }, never, never, false, never>;
 }
 export declare class AlphaModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<AlphaModule, never>;

package/block/block-swatches.component.d.ts

@@ -20,5 +20,5 @@ export declare class BlockSwatchesComponent {
         boxShadow: string;
     };
     static ɵfac: i0.ɵɵFactoryDeclaration<BlockSwatchesComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BlockSwatchesComponent, "color-block-swatches", never, { "colors": "colors"; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BlockSwatchesComponent, "color-block-swatches", never, { "colors": { "alias": "colors"; "required": false; }; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never, false, never>;
 }

package/block/block.component.d.ts

@@ -27,7 +27,7 @@ export declare class BlockComponent extends ColorWrap {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<BlockComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BlockComponent, "color-block", never, { "width": "width"; "colors": "colors"; "triangle": "triangle"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BlockComponent, "color-block", never, { "width": { "alias": "width"; "required": false; }; "colors": { "alias": "colors"; "required": false; }; "triangle": { "alias": "triangle"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class ColorBlockModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorBlockModule, never>;

package/checkboard.component.d.ts

@@ -10,7 +10,7 @@ export declare class CheckboardComponent implements OnInit {
     gridStyles: Record<string, string>;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CheckboardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboardComponent, "color-checkboard", never, { "white": "white"; "size": "size"; "grey": "grey"; "boxShadow": "boxShadow"; "borderRadius": "borderRadius"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboardComponent, "color-checkboard", never, { "white": { "alias": "white"; "required": false; }; "size": { "alias": "size"; "required": false; }; "grey": { "alias": "grey"; "required": false; }; "boxShadow": { "alias": "boxShadow"; "required": false; }; "borderRadius": { "alias": "borderRadius"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class CheckboardModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<CheckboardModule, never>;

package/chrome/chrome-fields.component.d.ts

@@ -18,5 +18,5 @@ export declare class ChromeFieldsComponent implements OnInit {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChromeFieldsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ChromeFieldsComponent, "color-chrome-fields", never, { "disableAlpha": "disableAlpha"; "hsl": "hsl"; "rgb": "rgb"; "hex": "hex"; }, { "onChange": "onChange"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ChromeFieldsComponent, "color-chrome-fields", never, { "disableAlpha": { "alias": "disableAlpha"; "required": false; }; "hsl": { "alias": "hsl"; "required": false; }; "rgb": { "alias": "rgb"; "required": false; }; "hex": { "alias": "hex"; "required": false; }; }, { "onChange": "onChange"; }, never, never, false, never>;
 }

package/chrome/chrome.component.d.ts

@@ -16,7 +16,7 @@ export declare class ChromeComponent extends ColorWrap {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ChromeComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ChromeComponent, "color-chrome", never, { "disableAlpha": "disableAlpha"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ChromeComponent, "color-chrome", never, { "disableAlpha": { "alias": "disableAlpha"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class ColorChromeModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorChromeModule, never>;

package/circle/circle-swatch.component.d.ts

@@ -15,5 +15,5 @@ export declare class CircleSwatchComponent implements OnChanges {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CircleSwatchComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CircleSwatchComponent, "color-circle-swatch", never, { "color": "color"; "circleSize": "circleSize"; "circleSpacing": "circleSpacing"; "focus": "focus"; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CircleSwatchComponent, "color-circle-swatch", never, { "color": { "alias": "color"; "required": false; }; "circleSize": { "alias": "circleSize"; "required": false; }; "circleSpacing": { "alias": "circleSpacing"; "required": false; }; "focus": { "alias": "focus"; "required": false; }; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never, false, never>;
 }

package/circle/circle.component.d.ts

@@ -23,7 +23,7 @@ export declare class CircleComponent extends ColorWrap {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CircleComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CircleComponent, "color-circle", never, { "width": "width"; "colors": "colors"; "circleSize": "circleSize"; "circleSpacing": "circleSpacing"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CircleComponent, "color-circle", never, { "width": { "alias": "width"; "required": false; }; "colors": { "alias": "colors"; "required": false; }; "circleSize": { "alias": "circleSize"; "required": false; }; "circleSpacing": { "alias": "circleSpacing"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class ColorCircleModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorCircleModule, never>;

package/color-wrap.component.d.ts

@@ -49,7 +49,7 @@ export declare class ColorWrap implements OnInit, OnChanges, OnDestroy, ControlV
     setDisabledState(isDisabled: boolean): void;
     writeValue(hex: string): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorWrap, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ColorWrap, "color-wrap", never, { "className": "className"; "mode": "mode"; "color": "color"; }, { "colorChange": "colorChange"; "onChange": "onChange"; "onChangeComplete": "onChangeComplete"; "onSwatchHover": "onSwatchHover"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ColorWrap, "color-wrap", never, { "className": { "alias": "className"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "color": { "alias": "color"; "required": false; }; }, { "colorChange": "colorChange"; "onChange": "onChange"; "onChangeComplete": "onChangeComplete"; "onSwatchHover": "onSwatchHover"; }, never, never, false, never>;
 }
 export declare class ColorWrapModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorWrapModule, never>;

package/compact/compact-color.component.d.ts

@@ -15,5 +15,5 @@ export declare class CompactColorComponent implements OnChanges {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CompactColorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CompactColorComponent, "color-compact-color", never, { "color": "color"; "active": "active"; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CompactColorComponent, "color-compact-color", never, { "color": { "alias": "color"; "required": false; }; "active": { "alias": "active"; "required": false; }; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never, false, never>;
 }

package/compact/compact-fields.component.d.ts

@@ -28,5 +28,5 @@ export declare class CompactFieldsComponent {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CompactFieldsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CompactFieldsComponent, "color-compact-fields", never, { "hex": "hex"; "rgb": "rgb"; }, { "onChange": "onChange"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CompactFieldsComponent, "color-compact-fields", never, { "hex": { "alias": "hex"; "required": false; }; "rgb": { "alias": "rgb"; "required": false; }; }, { "onChange": "onChange"; }, never, never, false, never>;
 }

package/compact/compact.component.d.ts

@@ -21,7 +21,7 @@ export declare class CompactComponent extends ColorWrap {
         $event: any;
     }): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CompactComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CompactComponent, "color-compact", never, { "colors": "colors"; "zDepth": "zDepth"; "radius": "radius"; "background": "background"; }, {}, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CompactComponent, "color-compact", never, { "colors": { "alias": "colors"; "required": false; }; "zDepth": { "alias": "zDepth"; "required": false; }; "radius": { "alias": "radius"; "required": false; }; "background": { "alias": "background"; "required": false; }; }, {}, never, never, false, never>;
 }
 export declare class ColorCompactModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ColorCompactModule, never>;

package/coordinates.directive.d.ts

@@ -23,7 +23,7 @@ export declare class CoordinatesDirective implements OnInit, OnDestroy {
     ngOnDestroy(): void;
     handleChange(x: number, y: number, $event: Event, isTouch: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CoordinatesDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<CoordinatesDirective, "[ngx-color-coordinates]", never, {}, { "coordinatesChange": "coordinatesChange"; }, never, never, false>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CoordinatesDirective, "[ngx-color-coordinates]", never, {}, { "coordinatesChange": "coordinatesChange"; }, never, never, false, never>;
 }
 export declare class CoordinatesModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<CoordinatesModule, never>;

package/editable-input.component.d.ts

@@ -36,7 +36,7 @@ export declare class EditableInputComponent implements OnInit, OnChanges, OnDest
     handleMousedown($event: Event): void;
     handleDrag($event: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<EditableInputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EditableInputComponent, "color-editable-input", never, { "style": "style"; "label": "label"; "value": "value"; "arrowOffset": "arrowOffset"; "dragLabel": "dragLabel"; "dragMax": "dragMax"; "placeholder": "placeholder"; }, { "onChange": "onChange"; }, never, never, false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EditableInputComponent, "color-editable-input", never, { "style": { "alias": "style"; "required": false; }; "label": { "alias": "label"; "required": false; }; "value": { "alias": "value"; "required": false; }; "arrowOffset": { "alias": "arrowOffset"; "required": false; }; "dragLabel": { "alias": "dragLabel"; "required": false; }; "dragMax": { "alias": "dragMax"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; }, { "onChange": "onChange"; }, never, never, false, never>;
 }
 export declare class EditableInputModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<EditableInputModule, never>;

package/esm2022/alpha/alpha-picker.component.mjs

@@ -0,0 +1,102 @@
+import { CommonModule } from '@angular/common';
+import { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';
+import { AlphaModule, CheckboardModule, ColorWrap, toState } from 'ngx-color';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "ngx-color";
+class AlphaPickerComponent extends ColorWrap {
+    /** Pixel value for picker width */
+    width = 316;
+    /** Pixel value for picker height */
+    height = 16;
+    direction = 'horizontal';
+    pointer = {
+        width: '18px',
+        height: '18px',
+        borderRadius: '50%',
+        transform: 'translate(-9px, -2px)',
+        boxShadow: '0 1px 4px 0 rgba(0, 0, 0, 0.37)',
+    };
+    constructor() {
+        super();
+    }
+    ngOnChanges() {
+        if (this.direction === 'vertical') {
+            this.pointer.transform = 'translate(-3px, -9px)';
+        }
+        this.setState(toState(this.color, this.oldHue));
+    }
+    handlePickerChange({ data, $event }) {
+        this.handleChange(data, $event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AlphaPickerComponent, selector: "color-alpha-picker", inputs: { width: "width", height: "height", direction: "direction" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => AlphaPickerComponent),
+                multi: true,
+            },
+            {
+                provide: ColorWrap,
+                useExisting: forwardRef(() => AlphaPickerComponent)
+            }
+        ], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
+    <div class="alpha-picker {{ className }}"
+      [style.width.px]="width" [style.height.px]="height">
+      <color-alpha
+        [hsl]="hsl"
+        [rgb]="rgb"
+        [pointer]="pointer"
+        [direction]="direction"
+        (onChange)="handlePickerChange($event)"
+      ></color-alpha>
+    </div>
+  `, isInline: true, styles: [".alpha-picker{position:relative}.color-alpha{radius:2px}\n"], dependencies: [{ kind: "component", type: i1.AlphaComponent, selector: "color-alpha", inputs: ["hsl", "rgb", "pointer", "shadow", "radius", "direction"], outputs: ["onChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+export { AlphaPickerComponent };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaPickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'color-alpha-picker', template: `
+    <div class="alpha-picker {{ className }}"
+      [style.width.px]="width" [style.height.px]="height">
+      <color-alpha
+        [hsl]="hsl"
+        [rgb]="rgb"
+        [pointer]="pointer"
+        [direction]="direction"
+        (onChange)="handlePickerChange($event)"
+      ></color-alpha>
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => AlphaPickerComponent),
+                            multi: true,
+                        },
+                        {
+                            provide: ColorWrap,
+                            useExisting: forwardRef(() => AlphaPickerComponent)
+                        }
+                    ], styles: [".alpha-picker{position:relative}.color-alpha{radius:2px}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], direction: [{
+                type: Input
+            }] } });
+class ColorAlphaModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorAlphaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: ColorAlphaModule, declarations: [AlphaPickerComponent], imports: [CommonModule, AlphaModule, CheckboardModule], exports: [AlphaPickerComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorAlphaModule, imports: [CommonModule, AlphaModule, CheckboardModule] });
+}
+export { ColorAlphaModule };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: ColorAlphaModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AlphaPickerComponent],
+                    exports: [AlphaPickerComponent],
+                    imports: [CommonModule, AlphaModule, CheckboardModule],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxwaGEtcGlja2VyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9saWIvYWxwaGEvYWxwaGEtcGlja2VyLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBYSxNQUFNLGVBQWUsQ0FBQztBQUUzRyxPQUFPLEVBQUUsV0FBVyxFQUFFLGdCQUFnQixFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFDOUUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7OztBQUVuRCxNQXNDYSxvQkFBcUIsU0FBUSxTQUFTO0lBQ2pELG1DQUFtQztJQUMxQixLQUFLLEdBQW9CLEdBQUcsQ0FBQztJQUN0QyxvQ0FBb0M7SUFDM0IsTUFBTSxHQUFvQixFQUFFLENBQUM7SUFDN0IsU0FBUyxHQUE4QixZQUFZLENBQUM7SUFDN0QsT0FBTyxHQUE0QjtRQUNqQyxLQUFLLEVBQUUsTUFBTTtRQUNiLE1BQU0sRUFBRSxNQUFNO1FBQ2QsWUFBWSxFQUFFLEtBQUs7UUFDbkIsU0FBUyxFQUFFLHVCQUF1QjtRQUNsQyxTQUFTLEVBQUUsaUNBQWlDO0tBQzdDLENBQUM7SUFFRjtRQUNFLEtBQUssRUFBRSxDQUFDO0lBQ1YsQ0FBQztJQUNELFdBQVc7UUFDVCxJQUFJLElBQUksQ0FBQyxTQUFTLEtBQUssVUFBVSxFQUFFO1lBQ2pDLElBQUksQ0FBQyxPQUFPLENBQUMsU0FBUyxHQUFHLHVCQUF1QixDQUFDO1NBQ2xEO1FBQ0QsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQztJQUNsRCxDQUFDO0lBQ0Qsa0JBQWtCLENBQUMsRUFBRSxJQUFJLEVBQUUsTUFBTSxFQUFFO1FBQ2pDLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxFQUFFLE1BQU0sQ0FBQyxDQUFDO0lBQ2xDLENBQUM7dUdBekJVLG9CQUFvQjsyRkFBcEIsb0JBQW9CLG1IQVpwQjtZQUNUO2dCQUNFLE9BQU8sRUFBRSxpQkFBaUI7Z0JBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsb0JBQW9CLENBQUM7Z0JBQ25ELEtBQUssRUFBRSxJQUFJO2FBQ1o7WUFDRDtnQkFDRSxPQUFPLEVBQUUsU0FBUztnQkFDbEIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxvQkFBb0IsQ0FBQzthQUNwRDtTQUNGLHNFQWxDUzs7Ozs7Ozs7Ozs7R0FXVDs7U0F5QlUsb0JBQW9COzJGQUFwQixvQkFBb0I7a0JBdENoQyxTQUFTOytCQUNFLG9CQUFvQixZQUNwQjs7Ozs7Ozs7Ozs7R0FXVCxtQkFXZ0IsdUJBQXVCLENBQUMsTUFBTSx1QkFDMUIsS0FBSyxhQUNmO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLHFCQUFxQixDQUFDOzRCQUNuRCxLQUFLLEVBQUUsSUFBSTt5QkFDWjt3QkFDRDs0QkFDRSxPQUFPLEVBQUUsU0FBUzs0QkFDbEIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUscUJBQXFCLENBQUM7eUJBQ3BEO3FCQUNGOzBFQUlRLEtBQUs7c0JBQWIsS0FBSztnQkFFRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSzs7QUF1QlIsTUFLYSxnQkFBZ0I7dUdBQWhCLGdCQUFnQjt3R0FBaEIsZ0JBQWdCLGlCQWpDaEIsb0JBQW9CLGFBK0JyQixZQUFZLEVBQUUsV0FBVyxFQUFFLGdCQUFnQixhQS9CMUMsb0JBQW9CO3dHQWlDcEIsZ0JBQWdCLFlBRmpCLFlBQVksRUFBRSxXQUFXLEVBQUUsZ0JBQWdCOztTQUUxQyxnQkFBZ0I7MkZBQWhCLGdCQUFnQjtrQkFMNUIsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUUsQ0FBQyxvQkFBb0IsQ0FBQztvQkFDcEMsT0FBTyxFQUFFLENBQUMsb0JBQW9CLENBQUM7b0JBQy9CLE9BQU8sRUFBRSxDQUFDLFlBQVksRUFBRSxXQUFXLEVBQUUsZ0JBQWdCLENBQUM7aUJBQ3ZEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIGZvcndhcmRSZWYsIElucHV0LCBOZ01vZHVsZSwgT25DaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IEFscGhhTW9kdWxlLCBDaGVja2JvYXJkTW9kdWxlLCBDb2xvcldyYXAsIHRvU3RhdGUgfSBmcm9tICduZ3gtY29sb3InO1xuaW1wb3J0IHsgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2NvbG9yLWFscGhhLXBpY2tlcicsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdiBjbGFzcz1cImFscGhhLXBpY2tlciB7eyBjbGFzc05hbWUgfX1cIlxuICAgICAgW3N0eWxlLndpZHRoLnB4XT1cIndpZHRoXCIgW3N0eWxlLmhlaWdodC5weF09XCJoZWlnaHRcIj5cbiAgICAgIDxjb2xvci1hbHBoYVxuICAgICAgICBbaHNsXT1cImhzbFwiXG4gICAgICAgIFtyZ2JdPVwicmdiXCJcbiAgICAgICAgW3BvaW50ZXJdPVwicG9pbnRlclwiXG4gICAgICAgIFtkaXJlY3Rpb25dPVwiZGlyZWN0aW9uXCJcbiAgICAgICAgKG9uQ2hhbmdlKT1cImhhbmRsZVBpY2tlckNoYW5nZSgkZXZlbnQpXCJcbiAgICAgID48L2NvbG9yLWFscGhhPlxuICAgIDwvZGl2PlxuICBgLFxuICBzdHlsZXM6IFtcbiAgICBgXG4gICAgLmFscGhhLXBpY2tlciB7XG4gICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgfVxuICAgIC5jb2xvci1hbHBoYSB7XG4gICAgICByYWRpdXM6IDJweDtcbiAgICB9XG4gIGAsXG4gIF0sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBwcmVzZXJ2ZVdoaXRlc3BhY2VzOiBmYWxzZSxcbiAgcHJvdmlkZXJzOiBbXG4gICAge1xuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBBbHBoYVBpY2tlckNvbXBvbmVudCksXG4gICAgICBtdWx0aTogdHJ1ZSxcbiAgICB9LFxuICAgIHtcbiAgICAgIHByb3ZpZGU6IENvbG9yV3JhcCxcbiAgICAgIHVzZUV4aXN0aW5nOiBmb3J3YXJkUmVmKCgpID0+IEFscGhhUGlja2VyQ29tcG9uZW50KVxuICAgIH1cbiAgXVxufSlcbmV4cG9ydCBjbGFzcyBBbHBoYVBpY2tlckNvbXBvbmVudCBleHRlbmRzIENvbG9yV3JhcCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gIC8qKiBQaXhlbCB2YWx1ZSBmb3IgcGlja2VyIHdpZHRoICovXG4gIEBJbnB1dCgpIHdpZHRoOiBzdHJpbmcgfCBudW1iZXIgPSAzMTY7XG4gIC8qKiBQaXhlbCB2YWx1ZSBmb3IgcGlja2VyIGhlaWdodCAqL1xuICBASW5wdXQoKSBoZWlnaHQ6IHN0cmluZyB8IG51bWJlciA9IDE2O1xuICBASW5wdXQoKSBkaXJlY3Rpb246ICdob3Jpem9udGFsJyB8ICd2ZXJ0aWNhbCcgPSAnaG9yaXpvbnRhbCc7XG4gIHBvaW50ZXI6IHtba2V5OiBzdHJpbmddOiBzdHJpbmd9ID0ge1xuICAgIHdpZHRoOiAnMThweCcsXG4gICAgaGVpZ2h0OiAnMThweCcsXG4gICAgYm9yZGVyUmFkaXVzOiAnNTAlJyxcbiAgICB0cmFuc2Zvcm06ICd0cmFuc2xhdGUoLTlweCwgLTJweCknLFxuICAgIGJveFNoYWRvdzogJzAgMXB4IDRweCAwIHJnYmEoMCwgMCwgMCwgMC4zNyknLFxuICB9O1xuXG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHN1cGVyKCk7XG4gIH1cbiAgbmdPbkNoYW5nZXMoKSB7XG4gICAgaWYgKHRoaXMuZGlyZWN0aW9uID09PSAndmVydGljYWwnKSB7XG4gICAgICB0aGlzLnBvaW50ZXIudHJhbnNmb3JtID0gJ3RyYW5zbGF0ZSgtM3B4LCAtOXB4KSc7XG4gICAgfVxuICAgIHRoaXMuc2V0U3RhdGUodG9TdGF0ZSh0aGlzLmNvbG9yLCB0aGlzLm9sZEh1ZSkpO1xuICB9XG4gIGhhbmRsZVBpY2tlckNoYW5nZSh7IGRhdGEsICRldmVudCB9KSB7XG4gICAgdGhpcy5oYW5kbGVDaGFuZ2UoZGF0YSwgJGV2ZW50KTtcbiAgfVxufVxuXG5ATmdNb2R1bGUoe1xuICBkZWNsYXJhdGlvbnM6IFtBbHBoYVBpY2tlckNvbXBvbmVudF0sXG4gIGV4cG9ydHM6IFtBbHBoYVBpY2tlckNvbXBvbmVudF0sXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEFscGhhTW9kdWxlLCBDaGVja2JvYXJkTW9kdWxlXSxcbn0pXG5leHBvcnQgY2xhc3MgQ29sb3JBbHBoYU1vZHVsZSB7fVxuIl19

package/esm2022/alpha.component.mjs

@@ -0,0 +1,146 @@
+import { CommonModule } from '@angular/common';
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, NgModule, Output, } from '@angular/core';
+import { CheckboardModule } from './checkboard.component';
+import { CoordinatesModule } from './coordinates.directive';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "./checkboard.component";
+import * as i3 from "./coordinates.directive";
+class AlphaComponent {
+    hsl;
+    rgb;
+    pointer;
+    shadow;
+    radius;
+    direction = 'horizontal';
+    onChange = new EventEmitter();
+    gradient;
+    pointerLeft;
+    pointerTop;
+    ngOnChanges() {
+        if (this.direction === 'vertical') {
+            this.pointerLeft = 0;
+            this.pointerTop = this.rgb.a * 100;
+            this.gradient = {
+                background: `linear-gradient(to bottom, rgba(${this.rgb.r},${this.rgb.g},${this.rgb.b}, 0) 0%,
+          rgba(${this.rgb.r},${this.rgb.g},${this.rgb.b}, 1) 100%)`,
+            };
+        }
+        else {
+            this.gradient = {
+                background: `linear-gradient(to right, rgba(${this.rgb.r},${this.rgb.g},${this.rgb.b}, 0) 0%,
+          rgba(${this.rgb.r},${this.rgb.g},${this.rgb.b}, 1) 100%)`,
+            };
+            this.pointerLeft = this.rgb.a * 100;
+        }
+    }
+    handleChange({ top, left, containerHeight, containerWidth, $event }) {
+        let data;
+        if (this.direction === 'vertical') {
+            let a;
+            if (top < 0) {
+                a = 0;
+            }
+            else if (top > containerHeight) {
+                a = 1;
+            }
+            else {
+                a = Math.round(top * 100 / containerHeight) / 100;
+            }
+            if (this.hsl.a !== a) {
+                data = {
+                    h: this.hsl.h,
+                    s: this.hsl.s,
+                    l: this.hsl.l,
+                    a,
+                    source: 'rgb',
+                };
+            }
+        }
+        else {
+            let a;
+            if (left < 0) {
+                a = 0;
+            }
+            else if (left > containerWidth) {
+                a = 1;
+            }
+            else {
+                a = Math.round(left * 100 / containerWidth) / 100;
+            }
+            if (this.hsl.a !== a) {
+                data = {
+                    h: this.hsl.h,
+                    s: this.hsl.s,
+                    l: this.hsl.l,
+                    a,
+                    source: 'rgb',
+                };
+            }
+        }
+        if (!data) {
+            return;
+        }
+        this.onChange.emit({ data, $event });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: AlphaComponent, selector: "color-alpha", inputs: { hsl: "hsl", rgb: "rgb", pointer: "pointer", shadow: "shadow", radius: "radius", direction: "direction" }, outputs: { onChange: "onChange" }, usesOnChanges: true, ngImport: i0, template: `
+  <div class="alpha" [style.border-radius]="radius">
+    <div class="alpha-checkboard">
+      <color-checkboard></color-checkboard>
+    </div>
+    <div class="alpha-gradient" [ngStyle]="gradient" [style.box-shadow]="shadow" [style.border-radius]="radius"></div>
+    <div ngx-color-coordinates (coordinatesChange)="handleChange($event)" class="alpha-container color-alpha-{{direction}}">
+      <div class="alpha-pointer" [style.left.%]="pointerLeft" [style.top.%]="pointerTop">
+        <div class="alpha-slider" [ngStyle]="pointer"></div>
+      </div>
+    </div>
+  </div>
+  `, isInline: true, styles: [".alpha{position:absolute;inset:0}.alpha-checkboard{position:absolute;inset:0;overflow:hidden}.alpha-gradient{position:absolute;inset:0}.alpha-container{position:relative;height:100%;margin:0 3px}.alpha-pointer{position:absolute}.alpha-slider{width:4px;border-radius:1px;height:8px;box-shadow:0 0 2px #0009;background:#fff;margin-top:1px;transform:translate(-2px)}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.CheckboardComponent, selector: "color-checkboard", inputs: ["white", "size", "grey", "boxShadow", "borderRadius"] }, { kind: "directive", type: i3.CoordinatesDirective, selector: "[ngx-color-coordinates]", outputs: ["coordinatesChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+export { AlphaComponent };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'color-alpha', template: `
+  <div class="alpha" [style.border-radius]="radius">
+    <div class="alpha-checkboard">
+      <color-checkboard></color-checkboard>
+    </div>
+    <div class="alpha-gradient" [ngStyle]="gradient" [style.box-shadow]="shadow" [style.border-radius]="radius"></div>
+    <div ngx-color-coordinates (coordinatesChange)="handleChange($event)" class="alpha-container color-alpha-{{direction}}">
+      <div class="alpha-pointer" [style.left.%]="pointerLeft" [style.top.%]="pointerTop">
+        <div class="alpha-slider" [ngStyle]="pointer"></div>
+      </div>
+    </div>
+  </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [".alpha{position:absolute;inset:0}.alpha-checkboard{position:absolute;inset:0;overflow:hidden}.alpha-gradient{position:absolute;inset:0}.alpha-container{position:relative;height:100%;margin:0 3px}.alpha-pointer{position:absolute}.alpha-slider{width:4px;border-radius:1px;height:8px;box-shadow:0 0 2px #0009;background:#fff;margin-top:1px;transform:translate(-2px)}\n"] }]
+        }], propDecorators: { hsl: [{
+                type: Input
+            }], rgb: [{
+                type: Input
+            }], pointer: [{
+                type: Input
+            }], shadow: [{
+                type: Input
+            }], radius: [{
+                type: Input
+            }], direction: [{
+                type: Input
+            }], onChange: [{
+                type: Output
+            }] } });
+class AlphaModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.0.1", ngImport: i0, type: AlphaModule, declarations: [AlphaComponent], imports: [CommonModule, CheckboardModule, CoordinatesModule], exports: [AlphaComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaModule, imports: [CommonModule, CheckboardModule, CoordinatesModule] });
+}
+export { AlphaModule };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: AlphaModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AlphaComponent],
+                    exports: [AlphaComponent],
+                    imports: [CommonModule, CheckboardModule, CoordinatesModule],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxwaGEuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2xpYi9hbHBoYS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFDTCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixLQUFLLEVBQ0wsUUFBUSxFQUVSLE1BQU0sR0FDUCxNQUFNLGVBQWUsQ0FBQztBQUV2QixPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUMxRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQzs7Ozs7QUFHNUQsTUE2RGEsY0FBYztJQUNoQixHQUFHLENBQVE7SUFDWCxHQUFHLENBQVE7SUFDWCxPQUFPLENBQTBCO0lBQ2pDLE1BQU0sQ0FBVTtJQUNoQixNQUFNLENBQW1CO0lBQ3pCLFNBQVMsR0FBOEIsWUFBWSxDQUFDO0lBQ25ELFFBQVEsR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO0lBQzdDLFFBQVEsQ0FBMEI7SUFDbEMsV0FBVyxDQUFVO0lBQ3JCLFVBQVUsQ0FBVTtJQUVwQixXQUFXO1FBQ1QsSUFBSSxJQUFJLENBQUMsU0FBUyxLQUFLLFVBQVUsRUFBRTtZQUNqQyxJQUFJLENBQUMsV0FBVyxHQUFHLENBQUMsQ0FBQztZQUNyQixJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxHQUFHLEdBQUcsQ0FBQztZQUNuQyxJQUFJLENBQUMsUUFBUSxHQUFHO2dCQUNkLFVBQVUsRUFBRSxtQ0FBbUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLElBQ3ZELElBQUksQ0FBQyxHQUFHLENBQUMsQ0FDWCxJQUFJLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztpQkFDTCxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsSUFBSSxJQUFJLENBQUMs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WCxLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0ksUUFBUTtzQkFBakIsTUFBTTs7QUEyRVQsTUFLYSxXQUFXO3VHQUFYLFdBQVc7d0dBQVgsV0FBVyxpQkF2RlgsY0FBYyxhQXFGZixZQUFZLEVBQUUsZ0JBQWdCLEVBQUUsaUJBQWlCLGFBckZoRCxjQUFjO3dHQXVGZCxXQUFXLFlBRlosWUFBWSxFQUFFLGdCQUFnQixFQUFFLGlCQUFpQjs7U0FFaEQsV0FBVzsyRkFBWCxXQUFXO2tCQUx2QixRQUFRO21CQUFDO29CQUNSLFlBQVksRUFBRSxDQUFDLGNBQWMsQ0FBQztvQkFDOUIsT0FBTyxFQUFFLENBQUMsY0FBYyxDQUFDO29CQUN6QixPQUFPLEVBQUUsQ0FBQyxZQUFZLEVBQUUsZ0JBQWdCLEVBQUUsaUJBQWlCLENBQUM7aUJBQzdEIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7XG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDb21wb25lbnQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE5nTW9kdWxlLFxuICBPbkNoYW5nZXMsXG4gIE91dHB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IENoZWNrYm9hcmRNb2R1bGUgfSBmcm9tICcuL2NoZWNrYm9hcmQuY29tcG9uZW50JztcbmltcG9ydCB7IENvb3JkaW5hdGVzTW9kdWxlIH0gZnJvbSAnLi9jb29yZGluYXRlcy5kaXJlY3RpdmUnO1xuaW1wb3J0IHsgSFNMQSwgUkdCQSB9IGZyb20gJy4vaGVscGVycy9jb2xvci5pbnRlcmZhY2VzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY29sb3ItYWxwaGEnLFxuICB0ZW1wbGF0ZTogYFxuICA8ZGl2IGNsYXNzPVwiYWxwaGFcIiBbc3R5bGUuYm9yZGVyLXJhZGl1c109XCJyYWRpdXNcIj5cbiAgICA8ZGl2IGNsYXNzPVwiYWxwaGEtY2hlY2tib2FyZFwiPlxuICAgICAgPGNvbG9yLWNoZWNrYm9hcmQ+PC9jb2xvci1jaGVja2JvYXJkPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJhbHBoYS1ncmFkaWVudFwiIFtuZ1N0eWxlXT1cImdyYWRpZW50XCIgW3N0eWxlLmJveC1zaGFkb3ddPVwic2hhZG93XCIgW3N0eWxlLmJvcmRlci1yYWRpdXNdPVwicmFkaXVzXCI+PC9kaXY+XG4gICAgPGRpdiBuZ3gtY29sb3ItY29vcmRpbmF0ZXMgKGNvb3JkaW5hdGVzQ2hhbmdlKT1cImhhbmRsZUNoYW5nZSgkZXZlbnQpXCIgY2xhc3M9XCJhbHBoYS1jb250YWluZXIgY29sb3ItYWxwaGEte3tkaXJlY3Rpb259fVwiPlxuICAgICAgPGRpdiBjbGFzcz1cImFscGhhLXBvaW50ZXJcIiBbc3R5bGUubGVmdC4lXT1cInBvaW50ZXJMZWZ0XCIgW3N0eWxlLnRvcC4lXT1cInBvaW50ZXJUb3BcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImFscGhhLXNsaWRlclwiIFtuZ1N0eWxlXT1cInBvaW50ZXJcIj48L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVzOiBbXG4gICAgYFxuICAgIC5hbHBoYSB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB0b3A6IDA7XG4gICAgICBib3R0b206IDA7XG4gICAgICBsZWZ0OiAwO1xuICAgICAgcmlnaHQ6IDA7XG4gICAgfVxuICAgIC5hbHBoYS1jaGVja2JvYXJkIHtcbiAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgIHRvcDogMDtcbiAgICAgIGJvdHRvbTogMDtcbiAgICAgIGxlZnQ6IDA7XG4gICAgICByaWdodDogMDtcbiAgICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgfVxuICAgIC5hbHBoYS1ncmFkaWVudCB7XG4gICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICB0b3A6IDA7XG4gICAgICBib3R0b206IDA7XG4gICAgICBsZWZ0OiAwO1xuICAgICAgcmlnaHQ6IDA7XG4gICAgfVxuICAgIC5hbHBoYS1jb250YWluZXIge1xuICAgICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgbWFyZ2luOiAwIDNweDtcbiAgICB9XG4gICAgLmFscGhhLXBvaW50ZXIge1xuICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIH1cbiAgICAuYWxwaGEtc2xpZGVyIHtcbiAgICAgIHdpZHRoOiA0cHg7XG4gICAgICBib3JkZXItcmFkaXVzOiAxcHg7XG4gICAgICBoZWlnaHQ6IDhweDtcbiAgICAgIGJveC1zaGFkb3c6IDAgMCAycHggcmdiYSgwLCAwLCAwLCAuNik7XG4gICAgICBiYWNrZ3JvdW5kOiAjZmZmO1xuICAgICAgbWFyZ2luLXRvcDogMXB4O1xuICAgICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVYKC0ycHgpO1xuICAgIH1cbiAgYCxcbiAgXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHByZXNlcnZlV2hpdGVzcGFjZXM6IGZhbHNlLFxufSlcbmV4cG9ydCBjbGFzcyBBbHBoYUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIGhzbCE6IEhTTEE7XG4gIEBJbnB1dCgpIHJnYiE6IFJHQkE7XG4gIEBJbnB1dCgpIHBvaW50ZXIhOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+O1xuICBASW5wdXQoKSBzaGFkb3chOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHJhZGl1cyE6IG51bWJlciB8IHN0cmluZztcbiAgQElucHV0KCkgZGlyZWN0aW9uOiAnaG9yaXpvbnRhbCcgfCAndmVydGljYWwnID0gJ2hvcml6b250YWwnO1xuICBAT3V0cHV0KCkgb25DaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcbiAgZ3JhZGllbnQhOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+O1xuICBwb2ludGVyTGVmdCE6IG51bWJlcjtcbiAgcG9pbnRlclRvcCE6IG51bWJlcjtcblxuICBuZ09uQ2hhbmdlcygpIHtcbiAgICBpZiAodGhpcy5kaXJlY3Rpb24gPT09ICd2ZXJ0aWNhbCcpIHtcbiAgICAgIHRoaXMucG9pbnRlckxlZnQgPSAwO1xuICAgICAgdGhpcy5wb2ludGVyVG9wID0gdGhpcy5yZ2IuYSAqIDEwMDtcbiAgICAgIHRoaXMuZ3JhZGllbnQgPSB7XG4gICAgICAgIGJhY2tncm91bmQ6IGBsaW5lYXItZ3JhZGllbnQodG8gYm90dG9tLCByZ2JhKCR7dGhpcy5yZ2Iucn0sJHtcbiAgICAgICAgICB0aGlzLnJnYi5nXG4gICAgICAgIH0sJHt0aGlzLnJnYi5ifSwgMCkgMCUsXG4gICAgICAgICAgcmdiYSgke3RoaXMucmdiLnJ9LCR7dGhpcy5yZ2IuZ30sJHt0aGlzLnJnYi5ifSwgMSkgMTAwJSlgLFxuICAgICAgfTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5ncmFkaWVudCA9IHtcbiAgICAgICAgYmFja2dyb3VuZDogYGxpbmVhci1ncmFkaWVudCh0byByaWdodCwgcmdiYSgke3RoaXMucmdiLnJ9LCR7XG4gICAgICAgICAgdGhpcy5yZ2IuZ1xuICAgICAgICB9LCR7dGhpcy5yZ2IuYn0sIDApIDAlLFxuICAgICAgICAgIHJnYmEoJHt0aGlzLnJnYi5yfSwke3RoaXMucmdiLmd9LCR7dGhpcy5yZ2IuYn0sIDEpIDEwMCUpYCxcbiAgICAgIH07XG4gICAgICB0aGlzLnBvaW50ZXJMZWZ0ID0gdGhpcy5yZ2IuYSAqIDEwMDtcbiAgICB9XG4gIH1cbiAgaGFuZGxlQ2hhbmdlKHsgdG9wLCBsZWZ0LCBjb250YWluZXJIZWlnaHQsIGNvbnRhaW5lcldpZHRoLCAkZXZlbnQgfSk6IHZvaWQge1xuICAgIGxldCBkYXRhOiBhbnk7XG4gICAgaWYgKHRoaXMuZGlyZWN0aW9uID09PSAndmVydGljYWwnKSB7XG4gICAgICBsZXQgYTogbnVtYmVyO1xuICAgICAgaWYgKHRvcCA8IDApIHtcbiAgICAgICAgYSA9IDA7XG4gICAgICB9IGVsc2UgaWYgKHRvcCA+IGNvbnRhaW5lckhlaWdodCkge1xuICAgICAgICBhID0gMTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGEgPSBNYXRoLnJvdW5kKHRvcCAqIDEwMCAvIGNvbnRhaW5lckhlaWdodCkgLyAxMDA7XG4gICAgICB9XG5cbiAgICAgIGlmICh0aGlzLmhzbC5hICE9PSBhKSB7XG4gICAgICAgIGRhdGEgPSB7XG4gICAgICAgICAgaDogdGhpcy5oc2wuaCxcbiAgICAgICAgICBzOiB0aGlzLmhzbC5zLFxuICAgICAgICAgIGw6IHRoaXMuaHNsLmwsXG4gICAgICAgICAgYSxcbiAgICAgICAgICBzb3VyY2U6ICdyZ2InLFxuICAgICAgICB9O1xuICAgICAgfVxuICAgIH0gZWxzZSB7XG4gICAgICBsZXQgYTogbnVtYmVyO1xuICAgICAgaWYgKGxlZnQgPCAwKSB7XG4gICAgICAgIGEgPSAwO1xuICAgICAgfSBlbHNlIGlmIChsZWZ0ID4gY29udGFpbmVyV2lkdGgpIHtcbiAgICAgICAgYSA9IDE7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBhID0gTWF0aC5yb3VuZChsZWZ0ICogMTAwIC8gY29udGFpbmVyV2lkdGgpIC8gMTAwO1xuICAgICAgfVxuXG4gICAgICBpZiAodGhpcy5oc2wuYSAhPT0gYSkge1xuICAgICAgICBkYXRhID0ge1xuICAgICAgICAgIGg6IHRoaXMuaHNsLmgsXG4gICAgICAgICAgczogdGhpcy5oc2wucyxcbiAgICAgICAgICBsOiB0aGlzLmhzbC5sLFxuICAgICAgICAgIGEsXG4gICAgICAgICAgc291cmNlOiAncmdiJyxcbiAgICAgICAgfTtcbiAgICAgIH1cbiAgICB9XG5cbiAgICBpZiAoIWRhdGEpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB0aGlzLm9uQ2hhbmdlLmVtaXQoeyBkYXRhLCAkZXZlbnQgfSk7XG4gIH1cbn1cblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbQWxwaGFDb21wb25lbnRdLFxuICBleHBvcnRzOiBbQWxwaGFDb21wb25lbnRdLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBDaGVja2JvYXJkTW9kdWxlLCBDb29yZGluYXRlc01vZHVsZV0sXG59KVxuZXhwb3J0IGNsYXNzIEFscGhhTW9kdWxlIHt9XG4iXX0=

package/esm2022/block/block-swatches.component.mjs

@@ -0,0 +1,63 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "ngx-color";
+class BlockSwatchesComponent {
+    colors;
+    onClick = new EventEmitter();
+    onSwatchHover = new EventEmitter();
+    swatchStyle = {
+        width: '22px',
+        height: '22px',
+        float: 'left',
+        marginRight: '10px',
+        marginBottom: '10px',
+        borderRadius: '4px',
+    };
+    handleClick({ hex, $event }) {
+        this.onClick.emit({ hex, $event });
+    }
+    focusStyle(c) {
+        return {
+            boxShadow: `${c} 0 0 4px`,
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BlockSwatchesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.1", type: BlockSwatchesComponent, selector: "color-block-swatches", inputs: { colors: "colors" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
+    <div class="block-swatches">
+      <color-swatch
+        *ngFor="let c of colors"
+        [color]="c"
+        [style]="swatchStyle"
+        [focusStyle]="focusStyle(c)"
+        (onClick)="handleClick($event)"
+        (onHover)="onSwatchHover.emit($event)"
+      ></color-swatch>
+      <div class="clear"></div>
+    </div>
+  `, isInline: true, styles: [".block-swatches{margin-right:-10px}.clear{clear:both}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }] });
+}
+export { BlockSwatchesComponent };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.1", ngImport: i0, type: BlockSwatchesComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'color-block-swatches', template: `
+    <div class="block-swatches">
+      <color-swatch
+        *ngFor="let c of colors"
+        [color]="c"
+        [style]="swatchStyle"
+        [focusStyle]="focusStyle(c)"
+        (onClick)="handleClick($event)"
+        (onHover)="onSwatchHover.emit($event)"
+      ></color-swatch>
+      <div class="clear"></div>
+    </div>
+  `, styles: [".block-swatches{margin-right:-10px}.clear{clear:both}\n"] }]
+        }], propDecorators: { colors: [{
+                type: Input
+            }], onClick: [{
+                type: Output
+            }], onSwatchHover: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmxvY2stc3dhdGNoZXMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2xpYi9ibG9jay9ibG9jay1zd2F0Y2hlcy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQUN2RSxNQXdCYSxzQkFBc0I7SUFDeEIsTUFBTSxDQUFZO0lBQ2pCLE9BQU8sR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO0lBQ2xDLGFBQWEsR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO0lBRWxELFdBQVcsR0FBRztRQUNaLEtBQUssRUFBRSxNQUFNO1FBQ2IsTUFBTSxFQUFFLE1BQU07UUFDZCxLQUFLLEVBQUUsTUFBTTtRQUNiLFdBQVcsRUFBRSxNQUFNO1FBQ25CLFlBQVksRUFBRSxNQUFNO1FBQ3BCLFlBQVksRUFBRSxLQUFLO0tBQ3BCLENBQUM7SUFFRixXQUFXLENBQUMsRUFBQyxHQUFHLEVBQUUsTUFBTSxFQUFDO1FBQ3ZCLElBQUksQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLEVBQUMsR0FBRyxFQUFFLE1BQU0sRUFBQyxDQUFDLENBQUM7SUFDbkMsQ0FBQztJQUNELFVBQVUsQ0FBQyxDQUFDO1FBQ1YsT0FBTztZQUNMLFNBQVMsRUFBRSxHQUFJLENBQUUsVUFBVTtTQUM1QixDQUFDO0lBQ0osQ0FBQzt1R0FyQlUsc0JBQXNCOzJGQUF0QixzQkFBc0IsMkpBdEJ2Qjs7Ozs7Ozs7Ozs7O0dBWVQ7O1NBVVUsc0JBQXNCOzJGQUF0QixzQkFBc0I7a0JBeEJsQyxTQUFTOytCQUNFLHNCQUFzQixZQUN0Qjs7Ozs7Ozs7Ozs7O0dBWVQ7OEJBV1EsTUFBTTtzQkFBZCxLQUFLO2dCQUNJLE9BQU87c0JBQWhCLE1BQU07Z0JBQ0csYUFBYTtzQkFBdEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjb2xvci1ibG9jay1zd2F0Y2hlcycsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdiBjbGFzcz1cImJsb2NrLXN3YXRjaGVzXCI+XG4gICAgICA8Y29sb3Itc3dhdGNoXG4gICAgICAgICpuZ0Zvcj1cImxldCBjIG9mIGNvbG9yc1wiXG4gICAgICAgIFtjb2xvcl09XCJjXCJcbiAgICAgICAgW3N0eWxlXT1cInN3YXRjaFN0eWxlXCJcbiAgICAgICAgW2ZvY3VzU3R5bGVdPVwiZm9jdXNTdHlsZShjKVwiXG4gICAgICAgIChvbkNsaWNrKT1cImhhbmRsZUNsaWNrKCRldmVudClcIlxuICAgICAgICAob25Ib3Zlcik9XCJvblN3YXRjaEhvdmVyLmVtaXQoJGV2ZW50KVwiXG4gICAgICA+PC9jb2xvci1zd2F0Y2g+XG4gICAgICA8ZGl2IGNsYXNzPVwiY2xlYXJcIj48L2Rpdj5cbiAgICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVzOiBbYFxuICAgIC5ibG9jay1zd2F0Y2hlcyB7XG4gICAgICBtYXJnaW4tcmlnaHQ6IC0xMHB4O1xuICAgIH1cbiAgICAuY2xlYXIge1xuICAgICAgY2xlYXI6IGJvdGg7XG4gICAgfVxuICBgXSxcbn0pXG5leHBvcnQgY2xhc3MgQmxvY2tTd2F0Y2hlc0NvbXBvbmVudCB7XG4gIEBJbnB1dCgpIGNvbG9ycyE6IHN0cmluZ1tdO1xuICBAT3V0cHV0KCkgb25DbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuICBAT3V0cHV0KCkgb25Td2F0Y2hIb3ZlciA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuXG4gIHN3YXRjaFN0eWxlID0ge1xuICAgIHdpZHRoOiAnMjJweCcsXG4gICAgaGVpZ2h0OiAnMjJweCcsXG4gICAgZmxvYXQ6ICdsZWZ0JyxcbiAgICBtYXJnaW5SaWdodDogJzEwcHgnLFxuICAgIG1hcmdpbkJvdHRvbTogJzEwcHgnLFxuICAgIGJvcmRlclJhZGl1czogJzRweCcsXG4gIH07XG5cbiAgaGFuZGxlQ2xpY2soe2hleCwgJGV2ZW50fSkge1xuICAgIHRoaXMub25DbGljay5lbWl0KHtoZXgsICRldmVudH0pO1xuICB9XG4gIGZvY3VzU3R5bGUoYykge1xuICAgIHJldHVybiB7XG4gICAgICBib3hTaGFkb3c6IGAkeyBjIH0gMCAwIDRweGAsXG4gICAgfTtcbiAgfVxuXG59XG4iXX0=