ngx-color 7.2.0 → 7.3.0

package/github/fesm2015/ngx-color-github.mjs

@@ -0,0 +1,250 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, forwardRef, NgModule } from '@angular/core';
+import * as i1 from 'ngx-color';
+import { ColorWrap, isValidHex, SwatchModule } from 'ngx-color';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+
+class GithubSwatchComponent {
+    constructor() {
+        this.onClick = new EventEmitter();
+        this.onSwatchHover = new EventEmitter();
+        this.focusStyle = {
+            position: 'relative',
+            'z-index': '2',
+            outline: '2px solid #fff',
+            'box-shadow': '0 0 5px 2px rgba(0,0,0,0.25)',
+        };
+    }
+    handleClick({ hex, $event }) {
+        this.onClick.emit({ hex, $event });
+    }
+}
+GithubSwatchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubSwatchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GithubSwatchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: GithubSwatchComponent, selector: "color-github-swatch", inputs: { color: "color" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
+    <div class="github-swatch">
+      <color-swatch
+        [color]="color"
+        [focusStyle]="focusStyle"
+        (onClick)="handleClick($event)"
+        (onHover)="onSwatchHover.emit($event)"
+        class="swatch"
+      ></color-swatch>
+      <div class="clear"></div>
+    </div>
+  `, isInline: true, styles: [".github-swatch{width:25px;height:25px;font-size:0}\n"], components: [{ type: i1.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubSwatchComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'color-github-swatch',
+                    template: `
+    <div class="github-swatch">
+      <color-swatch
+        [color]="color"
+        [focusStyle]="focusStyle"
+        (onClick)="handleClick($event)"
+        (onHover)="onSwatchHover.emit($event)"
+        class="swatch"
+      ></color-swatch>
+      <div class="clear"></div>
+    </div>
+  `,
+                    styles: [
+                        `
+      .github-swatch {
+        width: 25px;
+        height: 25px;
+        font-size: 0;
+      }
+    `,
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    preserveWhitespaces: false,
+                }]
+        }], propDecorators: { color: [{
+                type: Input
+            }], onClick: [{
+                type: Output
+            }], onSwatchHover: [{
+                type: Output
+            }] } });
+
+class GithubComponent extends ColorWrap {
+    constructor() {
+        super();
+        /** Pixel value for picker width */
+        this.width = 212;
+        /** Color squares to display */
+        this.colors = [
+            '#B80000',
+            '#DB3E00',
+            '#FCCB00',
+            '#008B02',
+            '#006B76',
+            '#1273DE',
+            '#004DCF',
+            '#5300EB',
+            '#EB9694',
+            '#FAD0C3',
+            '#FEF3BD',
+            '#C1E1C5',
+            '#BEDADC',
+            '#C4DEF6',
+            '#BED3F3',
+            '#D4C4FB',
+        ];
+        this.triangle = 'top-left';
+    }
+    handleBlockChange({ hex, $event }) {
+        if (isValidHex(hex)) {
+            this.handleChange({ hex, source: 'hex' }, $event);
+        }
+    }
+    handleValueChange({ data, $event }) {
+        this.handleChange(data, $event);
+    }
+}
+GithubComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GithubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: GithubComponent, selector: "color-github", inputs: { width: "width", colors: "colors", triangle: "triangle" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => GithubComponent),
+            multi: true,
+        },
+        {
+            provide: ColorWrap,
+            useExisting: forwardRef(() => GithubComponent),
+        },
+    ], usesInheritance: true, ngImport: i0, template: `
+  <div class="github-picker {{ triangle }}-triangle {{ className }}"
+    [style.width.px]="width"
+  >
+    <div class="triangleShadow"></div>
+    <div class="triangle"></div>
+    <color-github-swatch *ngFor="let color of colors"
+      [color]="color"
+      (onClick)="handleBlockChange($event)"
+      (onSwatchHover)="onSwatchHover.emit($event)"
+    ></color-github-swatch>
+  </div>
+  `, isInline: true, styles: [".github-picker{background:rgb(255,255,255);border:1px solid rgba(0,0,0,.2);box-shadow:#00000026 0 3px 12px;border-radius:4px;position:relative;padding:5px;display:flex;flex-wrap:wrap;box-sizing:border-box}.triangleShadow{position:absolute;border-width:8px;border-style:solid;border-color:transparent transparent rgba(0,0,0,.15);border-image:initial}.triangle{position:absolute;border-width:7px;border-style:solid;border-color:transparent transparent rgb(255,255,255);border-image:initial}.hide-triangle>.triangle{display:none}.hide-triangle>.triangleShadow{display:none}.top-left-triangle>.triangle{top:-14px;left:10px}.top-left-triangle>.triangleShadow{top:-16px;left:9px}.top-right-triangle>.triangle{top:-14px;right:10px}.top-right-triangle>.triangleShadow{top:-16px;right:9px}.bottom-right-triangle>.triangle{top:35px;right:10px;transform:rotate(180deg)}.bottom-right-triangle>.triangleShadow{top:37px;right:9px;transform:rotate(180deg)}\n"], components: [{ type: i0.forwardRef(function () { return GithubSwatchComponent; }), selector: "color-github-swatch", inputs: ["color"], outputs: ["onClick", "onSwatchHover"] }], directives: [{ type: i0.forwardRef(function () { return i1$1.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'color-github',
+                    template: `
+  <div class="github-picker {{ triangle }}-triangle {{ className }}"
+    [style.width.px]="width"
+  >
+    <div class="triangleShadow"></div>
+    <div class="triangle"></div>
+    <color-github-swatch *ngFor="let color of colors"
+      [color]="color"
+      (onClick)="handleBlockChange($event)"
+      (onSwatchHover)="onSwatchHover.emit($event)"
+    ></color-github-swatch>
+  </div>
+  `,
+                    styles: [
+                        `
+  .github-picker {
+    background: rgb(255, 255, 255);
+    border: 1px solid rgba(0, 0, 0, 0.2);
+    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 12px;
+    border-radius: 4px;
+    position: relative;
+    padding: 5px;
+    display: flex;
+    flex-wrap: wrap;
+    box-sizing: border-box;
+  }
+  .triangleShadow {
+    position: absolute;
+    border-width: 8px;
+    border-style: solid;
+    border-color: transparent transparent rgba(0, 0, 0, 0.15);
+    border-image: initial;
+  }
+  .triangle {
+    position: absolute;
+    border-width: 7px;
+    border-style: solid;
+    border-color: transparent transparent rgb(255, 255, 255);
+    border-image: initial;
+  }
+  .hide-triangle > .triangle {
+    display: none;
+  }
+  .hide-triangle > .triangleShadow {
+    display: none;
+  }
+  .top-left-triangle > .triangle {
+    top: -14px;
+    left: 10px;
+  }
+  .top-left-triangle > .triangleShadow {
+    top: -16px;
+    left: 9px;
+  }
+  .top-right-triangle > .triangle {
+    top: -14px;
+    right: 10px;
+  }
+  .top-right-triangle > .triangleShadow {
+    top: -16px;
+    right: 9px;
+  }
+  .bottom-right-triangle > .triangle {
+    top: 35px;
+    right: 10px;
+    transform: rotate(180deg);
+  }
+  .bottom-right-triangle > .triangleShadow {
+    top: 37px;
+    right: 9px;
+    transform: rotate(180deg);
+  }
+  `,
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    preserveWhitespaces: false,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => GithubComponent),
+                            multi: true,
+                        },
+                        {
+                            provide: ColorWrap,
+                            useExisting: forwardRef(() => GithubComponent),
+                        },
+                    ]
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { width: [{
+                type: Input
+            }], colors: [{
+                type: Input
+            }], triangle: [{
+                type: Input
+            }] } });
+class ColorGithubModule {
+}
+ColorGithubModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ColorGithubModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, declarations: [GithubComponent, GithubSwatchComponent], imports: [CommonModule, SwatchModule], exports: [GithubComponent, GithubSwatchComponent] });
+ColorGithubModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, imports: [[CommonModule, SwatchModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [GithubComponent, GithubSwatchComponent],
+                    exports: [GithubComponent, GithubSwatchComponent],
+                    imports: [CommonModule, SwatchModule],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ColorGithubModule, GithubComponent, GithubSwatchComponent };
+//# sourceMappingURL=ngx-color-github.mjs.map

package/github/fesm2015/ngx-color-github.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngx-color-github.mjs","sources":["../../../../src/lib/components/github/github-swatch.component.ts","../../../../src/lib/components/github/github.component.ts","../../../../src/lib/components/github/ngx-color-github.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\n\n@Component({\n  selector: 'color-github-swatch',\n  template: `\n    <div class=\"github-swatch\">\n      <color-swatch\n        [color]=\"color\"\n        [focusStyle]=\"focusStyle\"\n        (onClick)=\"handleClick($event)\"\n        (onHover)=\"onSwatchHover.emit($event)\"\n        class=\"swatch\"\n      ></color-swatch>\n      <div class=\"clear\"></div>\n    </div>\n  `,\n  styles: [\n    `\n      .github-swatch {\n        width: 25px;\n        height: 25px;\n        font-size: 0;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n})\nexport class GithubSwatchComponent {\n  @Input() color!: string;\n  @Output() onClick = new EventEmitter<any>();\n  @Output() onSwatchHover = new EventEmitter<any>();\n  focusStyle = {\n    position: 'relative',\n    'z-index': '2',\n    outline: '2px solid #fff',\n    'box-shadow': '0 0 5px 2px rgba(0,0,0,0.25)',\n  };\n\n  handleClick({ hex, $event }) {\n    this.onClick.emit({ hex, $event });\n  }\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';\n\nimport { ColorWrap, isValidHex, SwatchModule } from 'ngx-color';\nimport { GithubSwatchComponent } from './github-swatch.component';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n  selector: 'color-github',\n  template: `\n  <div class=\"github-picker {{ triangle }}-triangle {{ className }}\"\n    [style.width.px]=\"width\"\n  >\n    <div class=\"triangleShadow\"></div>\n    <div class=\"triangle\"></div>\n    <color-github-swatch *ngFor=\"let color of colors\"\n      [color]=\"color\"\n      (onClick)=\"handleBlockChange($event)\"\n      (onSwatchHover)=\"onSwatchHover.emit($event)\"\n    ></color-github-swatch>\n  </div>\n  `,\n  styles: [\n    `\n  .github-picker {\n    background: rgb(255, 255, 255);\n    border: 1px solid rgba(0, 0, 0, 0.2);\n    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 12px;\n    border-radius: 4px;\n    position: relative;\n    padding: 5px;\n    display: flex;\n    flex-wrap: wrap;\n    box-sizing: border-box;\n  }\n  .triangleShadow {\n    position: absolute;\n    border-width: 8px;\n    border-style: solid;\n    border-color: transparent transparent rgba(0, 0, 0, 0.15);\n    border-image: initial;\n  }\n  .triangle {\n    position: absolute;\n    border-width: 7px;\n    border-style: solid;\n    border-color: transparent transparent rgb(255, 255, 255);\n    border-image: initial;\n  }\n  .hide-triangle > .triangle {\n    display: none;\n  }\n  .hide-triangle > .triangleShadow {\n    display: none;\n  }\n  .top-left-triangle > .triangle {\n    top: -14px;\n    left: 10px;\n  }\n  .top-left-triangle > .triangleShadow {\n    top: -16px;\n    left: 9px;\n  }\n  .top-right-triangle > .triangle {\n    top: -14px;\n    right: 10px;\n  }\n  .top-right-triangle > .triangleShadow {\n    top: -16px;\n    right: 9px;\n  }\n  .bottom-right-triangle > .triangle {\n    top: 35px;\n    right: 10px;\n    transform: rotate(180deg);\n  }\n  .bottom-right-triangle > .triangleShadow {\n    top: 37px;\n    right: 9px;\n    transform: rotate(180deg);\n  }\n  `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => GithubComponent),\n      multi: true,\n    },\n    {\n      provide: ColorWrap,\n      useExisting: forwardRef(() => GithubComponent),\n    },\n  ]\n})\nexport class GithubComponent extends ColorWrap {\n  /** Pixel value for picker width */\n  @Input() width: string | number = 212;\n  /** Color squares to display */\n  @Input() colors = [\n    '#B80000',\n    '#DB3E00',\n    '#FCCB00',\n    '#008B02',\n    '#006B76',\n    '#1273DE',\n    '#004DCF',\n    '#5300EB',\n    '#EB9694',\n    '#FAD0C3',\n    '#FEF3BD',\n    '#C1E1C5',\n    '#BEDADC',\n    '#C4DEF6',\n    '#BED3F3',\n    '#D4C4FB',\n  ];\n  @Input() triangle: 'hide' | 'top-left' | 'top-right' | 'bottom-right' = 'top-left';\n\n  constructor() {\n    super();\n  }\n\n  handleBlockChange({ hex, $event }: { hex: string, $event: Event }) {\n    if (isValidHex(hex)) {\n      this.handleChange({ hex, source: 'hex' }, $event);\n    }\n  }\n  handleValueChange({ data, $event }) {\n    this.handleChange(data, $event);\n  }\n}\n\n@NgModule({\n  declarations: [GithubComponent, GithubSwatchComponent],\n  exports: [GithubComponent, GithubSwatchComponent],\n  imports: [CommonModule, SwatchModule],\n})\nexport class ColorGithubModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/github/fesm2020/ngx-color-github.mjs

@@ -0,0 +1,250 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, forwardRef, NgModule } from '@angular/core';
+import * as i1 from 'ngx-color';
+import { ColorWrap, isValidHex, SwatchModule } from 'ngx-color';
+import * as i1$1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+
+class GithubSwatchComponent {
+    constructor() {
+        this.onClick = new EventEmitter();
+        this.onSwatchHover = new EventEmitter();
+        this.focusStyle = {
+            position: 'relative',
+            'z-index': '2',
+            outline: '2px solid #fff',
+            'box-shadow': '0 0 5px 2px rgba(0,0,0,0.25)',
+        };
+    }
+    handleClick({ hex, $event }) {
+        this.onClick.emit({ hex, $event });
+    }
+}
+GithubSwatchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubSwatchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GithubSwatchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: GithubSwatchComponent, selector: "color-github-swatch", inputs: { color: "color" }, outputs: { onClick: "onClick", onSwatchHover: "onSwatchHover" }, ngImport: i0, template: `
+    <div class="github-swatch">
+      <color-swatch
+        [color]="color"
+        [focusStyle]="focusStyle"
+        (onClick)="handleClick($event)"
+        (onHover)="onSwatchHover.emit($event)"
+        class="swatch"
+      ></color-swatch>
+      <div class="clear"></div>
+    </div>
+  `, isInline: true, styles: [".github-swatch{width:25px;height:25px;font-size:0}\n"], components: [{ type: i1.SwatchComponent, selector: "color-swatch", inputs: ["color", "style", "focusStyle", "focus"], outputs: ["onClick", "onHover"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubSwatchComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'color-github-swatch',
+                    template: `
+    <div class="github-swatch">
+      <color-swatch
+        [color]="color"
+        [focusStyle]="focusStyle"
+        (onClick)="handleClick($event)"
+        (onHover)="onSwatchHover.emit($event)"
+        class="swatch"
+      ></color-swatch>
+      <div class="clear"></div>
+    </div>
+  `,
+                    styles: [
+                        `
+      .github-swatch {
+        width: 25px;
+        height: 25px;
+        font-size: 0;
+      }
+    `,
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    preserveWhitespaces: false,
+                }]
+        }], propDecorators: { color: [{
+                type: Input
+            }], onClick: [{
+                type: Output
+            }], onSwatchHover: [{
+                type: Output
+            }] } });
+
+class GithubComponent extends ColorWrap {
+    constructor() {
+        super();
+        /** Pixel value for picker width */
+        this.width = 212;
+        /** Color squares to display */
+        this.colors = [
+            '#B80000',
+            '#DB3E00',
+            '#FCCB00',
+            '#008B02',
+            '#006B76',
+            '#1273DE',
+            '#004DCF',
+            '#5300EB',
+            '#EB9694',
+            '#FAD0C3',
+            '#FEF3BD',
+            '#C1E1C5',
+            '#BEDADC',
+            '#C4DEF6',
+            '#BED3F3',
+            '#D4C4FB',
+        ];
+        this.triangle = 'top-left';
+    }
+    handleBlockChange({ hex, $event }) {
+        if (isValidHex(hex)) {
+            this.handleChange({ hex, source: 'hex' }, $event);
+        }
+    }
+    handleValueChange({ data, $event }) {
+        this.handleChange(data, $event);
+    }
+}
+GithubComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GithubComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: GithubComponent, selector: "color-github", inputs: { width: "width", colors: "colors", triangle: "triangle" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => GithubComponent),
+            multi: true,
+        },
+        {
+            provide: ColorWrap,
+            useExisting: forwardRef(() => GithubComponent),
+        },
+    ], usesInheritance: true, ngImport: i0, template: `
+  <div class="github-picker {{ triangle }}-triangle {{ className }}"
+    [style.width.px]="width"
+  >
+    <div class="triangleShadow"></div>
+    <div class="triangle"></div>
+    <color-github-swatch *ngFor="let color of colors"
+      [color]="color"
+      (onClick)="handleBlockChange($event)"
+      (onSwatchHover)="onSwatchHover.emit($event)"
+    ></color-github-swatch>
+  </div>
+  `, isInline: true, styles: [".github-picker{background:rgb(255,255,255);border:1px solid rgba(0,0,0,.2);box-shadow:#00000026 0 3px 12px;border-radius:4px;position:relative;padding:5px;display:flex;flex-wrap:wrap;box-sizing:border-box}.triangleShadow{position:absolute;border-width:8px;border-style:solid;border-color:transparent transparent rgba(0,0,0,.15);border-image:initial}.triangle{position:absolute;border-width:7px;border-style:solid;border-color:transparent transparent rgb(255,255,255);border-image:initial}.hide-triangle>.triangle{display:none}.hide-triangle>.triangleShadow{display:none}.top-left-triangle>.triangle{top:-14px;left:10px}.top-left-triangle>.triangleShadow{top:-16px;left:9px}.top-right-triangle>.triangle{top:-14px;right:10px}.top-right-triangle>.triangleShadow{top:-16px;right:9px}.bottom-right-triangle>.triangle{top:35px;right:10px;transform:rotate(180deg)}.bottom-right-triangle>.triangleShadow{top:37px;right:9px;transform:rotate(180deg)}\n"], components: [{ type: i0.forwardRef(function () { return GithubSwatchComponent; }), selector: "color-github-swatch", inputs: ["color"], outputs: ["onClick", "onSwatchHover"] }], directives: [{ type: i0.forwardRef(function () { return i1$1.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: GithubComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'color-github',
+                    template: `
+  <div class="github-picker {{ triangle }}-triangle {{ className }}"
+    [style.width.px]="width"
+  >
+    <div class="triangleShadow"></div>
+    <div class="triangle"></div>
+    <color-github-swatch *ngFor="let color of colors"
+      [color]="color"
+      (onClick)="handleBlockChange($event)"
+      (onSwatchHover)="onSwatchHover.emit($event)"
+    ></color-github-swatch>
+  </div>
+  `,
+                    styles: [
+                        `
+  .github-picker {
+    background: rgb(255, 255, 255);
+    border: 1px solid rgba(0, 0, 0, 0.2);
+    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 12px;
+    border-radius: 4px;
+    position: relative;
+    padding: 5px;
+    display: flex;
+    flex-wrap: wrap;
+    box-sizing: border-box;
+  }
+  .triangleShadow {
+    position: absolute;
+    border-width: 8px;
+    border-style: solid;
+    border-color: transparent transparent rgba(0, 0, 0, 0.15);
+    border-image: initial;
+  }
+  .triangle {
+    position: absolute;
+    border-width: 7px;
+    border-style: solid;
+    border-color: transparent transparent rgb(255, 255, 255);
+    border-image: initial;
+  }
+  .hide-triangle > .triangle {
+    display: none;
+  }
+  .hide-triangle > .triangleShadow {
+    display: none;
+  }
+  .top-left-triangle > .triangle {
+    top: -14px;
+    left: 10px;
+  }
+  .top-left-triangle > .triangleShadow {
+    top: -16px;
+    left: 9px;
+  }
+  .top-right-triangle > .triangle {
+    top: -14px;
+    right: 10px;
+  }
+  .top-right-triangle > .triangleShadow {
+    top: -16px;
+    right: 9px;
+  }
+  .bottom-right-triangle > .triangle {
+    top: 35px;
+    right: 10px;
+    transform: rotate(180deg);
+  }
+  .bottom-right-triangle > .triangleShadow {
+    top: 37px;
+    right: 9px;
+    transform: rotate(180deg);
+  }
+  `,
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    preserveWhitespaces: false,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => GithubComponent),
+                            multi: true,
+                        },
+                        {
+                            provide: ColorWrap,
+                            useExisting: forwardRef(() => GithubComponent),
+                        },
+                    ]
+                }]
+        }], ctorParameters: function () { return []; }, propDecorators: { width: [{
+                type: Input
+            }], colors: [{
+                type: Input
+            }], triangle: [{
+                type: Input
+            }] } });
+class ColorGithubModule {
+}
+ColorGithubModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ColorGithubModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, declarations: [GithubComponent, GithubSwatchComponent], imports: [CommonModule, SwatchModule], exports: [GithubComponent, GithubSwatchComponent] });
+ColorGithubModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, imports: [[CommonModule, SwatchModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: ColorGithubModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [GithubComponent, GithubSwatchComponent],
+                    exports: [GithubComponent, GithubSwatchComponent],
+                    imports: [CommonModule, SwatchModule],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ColorGithubModule, GithubComponent, GithubSwatchComponent };
+//# sourceMappingURL=ngx-color-github.mjs.map

package/github/fesm2020/ngx-color-github.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngx-color-github.mjs","sources":["../../../../src/lib/components/github/github-swatch.component.ts","../../../../src/lib/components/github/github.component.ts","../../../../src/lib/components/github/ngx-color-github.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\n\n@Component({\n  selector: 'color-github-swatch',\n  template: `\n    <div class=\"github-swatch\">\n      <color-swatch\n        [color]=\"color\"\n        [focusStyle]=\"focusStyle\"\n        (onClick)=\"handleClick($event)\"\n        (onHover)=\"onSwatchHover.emit($event)\"\n        class=\"swatch\"\n      ></color-swatch>\n      <div class=\"clear\"></div>\n    </div>\n  `,\n  styles: [\n    `\n      .github-swatch {\n        width: 25px;\n        height: 25px;\n        font-size: 0;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n})\nexport class GithubSwatchComponent {\n  @Input() color!: string;\n  @Output() onClick = new EventEmitter<any>();\n  @Output() onSwatchHover = new EventEmitter<any>();\n  focusStyle = {\n    position: 'relative',\n    'z-index': '2',\n    outline: '2px solid #fff',\n    'box-shadow': '0 0 5px 2px rgba(0,0,0,0.25)',\n  };\n\n  handleClick({ hex, $event }) {\n    this.onClick.emit({ hex, $event });\n  }\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, forwardRef, Input, NgModule } from '@angular/core';\n\nimport { ColorWrap, isValidHex, SwatchModule } from 'ngx-color';\nimport { GithubSwatchComponent } from './github-swatch.component';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n  selector: 'color-github',\n  template: `\n  <div class=\"github-picker {{ triangle }}-triangle {{ className }}\"\n    [style.width.px]=\"width\"\n  >\n    <div class=\"triangleShadow\"></div>\n    <div class=\"triangle\"></div>\n    <color-github-swatch *ngFor=\"let color of colors\"\n      [color]=\"color\"\n      (onClick)=\"handleBlockChange($event)\"\n      (onSwatchHover)=\"onSwatchHover.emit($event)\"\n    ></color-github-swatch>\n  </div>\n  `,\n  styles: [\n    `\n  .github-picker {\n    background: rgb(255, 255, 255);\n    border: 1px solid rgba(0, 0, 0, 0.2);\n    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 12px;\n    border-radius: 4px;\n    position: relative;\n    padding: 5px;\n    display: flex;\n    flex-wrap: wrap;\n    box-sizing: border-box;\n  }\n  .triangleShadow {\n    position: absolute;\n    border-width: 8px;\n    border-style: solid;\n    border-color: transparent transparent rgba(0, 0, 0, 0.15);\n    border-image: initial;\n  }\n  .triangle {\n    position: absolute;\n    border-width: 7px;\n    border-style: solid;\n    border-color: transparent transparent rgb(255, 255, 255);\n    border-image: initial;\n  }\n  .hide-triangle > .triangle {\n    display: none;\n  }\n  .hide-triangle > .triangleShadow {\n    display: none;\n  }\n  .top-left-triangle > .triangle {\n    top: -14px;\n    left: 10px;\n  }\n  .top-left-triangle > .triangleShadow {\n    top: -16px;\n    left: 9px;\n  }\n  .top-right-triangle > .triangle {\n    top: -14px;\n    right: 10px;\n  }\n  .top-right-triangle > .triangleShadow {\n    top: -16px;\n    right: 9px;\n  }\n  .bottom-right-triangle > .triangle {\n    top: 35px;\n    right: 10px;\n    transform: rotate(180deg);\n  }\n  .bottom-right-triangle > .triangleShadow {\n    top: 37px;\n    right: 9px;\n    transform: rotate(180deg);\n  }\n  `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => GithubComponent),\n      multi: true,\n    },\n    {\n      provide: ColorWrap,\n      useExisting: forwardRef(() => GithubComponent),\n    },\n  ]\n})\nexport class GithubComponent extends ColorWrap {\n  /** Pixel value for picker width */\n  @Input() width: string | number = 212;\n  /** Color squares to display */\n  @Input() colors = [\n    '#B80000',\n    '#DB3E00',\n    '#FCCB00',\n    '#008B02',\n    '#006B76',\n    '#1273DE',\n    '#004DCF',\n    '#5300EB',\n    '#EB9694',\n    '#FAD0C3',\n    '#FEF3BD',\n    '#C1E1C5',\n    '#BEDADC',\n    '#C4DEF6',\n    '#BED3F3',\n    '#D4C4FB',\n  ];\n  @Input() triangle: 'hide' | 'top-left' | 'top-right' | 'bottom-right' = 'top-left';\n\n  constructor() {\n    super();\n  }\n\n  handleBlockChange({ hex, $event }: { hex: string, $event: Event }) {\n    if (isValidHex(hex)) {\n      this.handleChange({ hex, source: 'hex' }, $event);\n    }\n  }\n  handleValueChange({ data, $event }) {\n    this.handleChange(data, $event);\n  }\n}\n\n@NgModule({\n  declarations: [GithubComponent, GithubSwatchComponent],\n  exports: [GithubComponent, GithubSwatchComponent],\n  imports: [CommonModule, SwatchModule],\n})\nexport class ColorGithubModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

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

@@ -1,4 +1,5 @@
 import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
 export declare class GithubSwatchComponent {
     color: string;
     onClick: EventEmitter<any>;
@@ -13,4 +14,6 @@ export declare class GithubSwatchComponent {
         hex: any;
         $event: any;
     }): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GithubSwatchComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GithubSwatchComponent, "color-github-swatch", never, { "color": "color"; }, { "onClick": "onClick"; "onSwatchHover": "onSwatchHover"; }, never, never>;
 }

package/github/github.component.d.ts

@@ -1,4 +1,8 @@
 import { ColorWrap } from 'ngx-color';
+import * as i0 from "@angular/core";
+import * as i1 from "./github-swatch.component";
+import * as i2 from "@angular/common";
+import * as i3 from "ngx-color";
 export declare class GithubComponent extends ColorWrap {
     /** Pixel value for picker width */
     width: string | number;
@@ -14,6 +18,11 @@ export declare class GithubComponent extends ColorWrap {
         data: any;
         $event: any;
     }): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GithubComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GithubComponent, "color-github", never, { "width": "width"; "colors": "colors"; "triangle": "triangle"; }, {}, never, never>;
 }
 export declare class ColorGithubModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ColorGithubModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ColorGithubModule, [typeof GithubComponent, typeof i1.GithubSwatchComponent], [typeof i2.CommonModule, typeof i3.SwatchModule], [typeof GithubComponent, typeof i1.GithubSwatchComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ColorGithubModule>;
 }

package/github/ngx-color-github.d.ts

@@ -1,5 +1,5 @@
 /**
  * Generated bundle index. Do not edit.
  */
-export * from './github.component';
-export { GithubSwatchComponent as ɵa } from './github-swatch.component';
+/// <amd-module name="ngx-color/github" />
+export * from './public_api';

package/github/package.json

@@ -6,15 +6,27 @@
     "url": "git+https://github.com/scttcper/ngx-color.git"
   },
   "license": "MIT",
-  "main": "bundles/ngx-color-github.umd.js",
-  "module": "fesm2015/ngx-color-github.js",
-  "es2015": "fesm2015/ngx-color-github.js",
-  "esm2015": "esm2015/ngx-color-github.js",
-  "fesm2015": "fesm2015/ngx-color-github.js",
+  "module": "fesm2015/ngx-color-github.mjs",
+  "es2020": "fesm2020/ngx-color-github.mjs",
+  "esm2020": "esm2020/ngx-color-github.mjs",
+  "fesm2020": "fesm2020/ngx-color-github.mjs",
+  "fesm2015": "fesm2015/ngx-color-github.mjs",
   "typings": "ngx-color-github.d.ts",
-  "metadata": "ngx-color-github.metadata.json",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./ngx-color-github.d.ts",
+      "esm2020": "./esm2020/ngx-color-github.mjs",
+      "es2020": "./fesm2020/ngx-color-github.mjs",
+      "es2015": "./fesm2015/ngx-color-github.mjs",
+      "node": "./fesm2015/ngx-color-github.mjs",
+      "default": "./fesm2020/ngx-color-github.mjs"
+    }
+  },
   "sideEffects": false,
   "dependencies": {
-    "tslib": "^2.1.0"
+    "tslib": "^2.3.0"
   }
 }

package/github/public_api.d.ts

@@ -0,0 +1,2 @@
+export { GithubSwatchComponent } from './github-swatch.component';
+export { ColorGithubModule, GithubComponent } from './github.component';

package/helpers/checkboard.d.ts

@@ -1,2 +1,2 @@
-export declare function render(c1: string, c2: string, size: number): string;
-export declare function getCheckerboard(c1: string, c2: string, size: number): string;
+export declare function render(c1: string, c2: string, size: number): string | null;
+export declare function getCheckerboard(c1: string, c2: string, size: number): string | null;