ngx-color 7.0.1 → 7.3.0

package/swatches/fesm2015/ngx-color-swatches.js

@@ -1,339 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
-import { red, pink, purple, deepPurple, indigo, blue, lightBlue, cyan, teal, green, lightGreen, lime, yellow, amber, orange, deepOrange, brown, blueGrey } from 'material-colors';
-import { getContrastingColor, ColorWrap, SwatchModule, RaisedModule } from 'ngx-color';
-
-class SwatchesColorComponent {
-    constructor() {
-        this.first = false;
-        this.last = false;
-        this.onClick = new EventEmitter();
-        this.onSwatchHover = new EventEmitter();
-        this.getContrastingColor = getContrastingColor;
-        this.colorStyle = {
-            width: '40px',
-            height: '24px',
-            cursor: 'pointer',
-            marginBottom: '1px',
-        };
-        this.focusStyle = {};
-    }
-    ngOnInit() {
-        this.colorStyle.background = this.color;
-        this.focusStyle.boxShadow = `0 0 4px ${this.color}`;
-        if (this.first) {
-            this.colorStyle.borderRadius = '2px 2px 0 0';
-        }
-        if (this.last) {
-            this.colorStyle.borderRadius = '0 0 2px 2px';
-        }
-        if (this.color === '#FFFFFF') {
-            this.colorStyle.boxShadow = 'inset 0 0 0 1px #ddd';
-        }
-    }
-    handleClick($event) {
-        this.onClick.emit({
-            data: {
-                hex: this.color,
-                source: 'hex',
-            },
-            $event,
-        });
-    }
-}
-SwatchesColorComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'color-swatches-color',
-                template: `
-    <color-swatch
-      [color]="color"
-      [style]="colorStyle"
-      [focusStyle]="focusStyle"
-      [class.first]="first"
-      [class.last]="last"
-      (click)="handleClick($event)"
-      (keydown.enter)="handleClick($event)"
-      (onHover)="onSwatchHover.emit($event)"
-    >
-      <div class="swatch-check" *ngIf="active" [class.first]="first" [class.last]="last">
-        <svg
-          style="width: 24px; height: 24px;"
-          viewBox="0 0 24 24"
-          [style.fill]="getContrastingColor(color)"
-        >
-          <path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z" />
-        </svg>
-      </div>
-    </color-swatch>
-  `,
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                preserveWhitespaces: false,
-                styles: [`
-      .swatches-group {
-        padding-bottom: 10px;
-        width: 40px;
-        float: left;
-        margin-right: 10px;
-      }
-      .swatch-check {
-        display: flex;
-        margin-left: 8px;
-      }
-    `]
-            },] }
-];
-SwatchesColorComponent.propDecorators = {
-    color: [{ type: Input }],
-    first: [{ type: Input }],
-    last: [{ type: Input }],
-    active: [{ type: Input }],
-    onClick: [{ type: Output }],
-    onSwatchHover: [{ type: Output }]
-};
-
-class SwatchesGroupComponent {
-    constructor() {
-        this.onClick = new EventEmitter();
-        this.onSwatchHover = new EventEmitter();
-    }
-}
-SwatchesGroupComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'color-swatches-group',
-                template: `
-    <div class="swatches-group">
-      <color-swatches-color
-        *ngFor="let color of group; let idx = index"
-        [active]="color.toLowerCase() === active"
-        [color]="color"
-        [first]="idx === 0"
-        [last]="idx === group.length - 1"
-        (onClick)="onClick.emit($event)"
-      >
-      </color-swatches-color>
-    </div>
-  `,
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                preserveWhitespaces: false,
-                styles: [`
-      .swatches-group {
-        padding-bottom: 10px;
-        width: 40px;
-        float: left;
-        margin-right: 10px;
-      }
-    `]
-            },] }
-];
-SwatchesGroupComponent.propDecorators = {
-    group: [{ type: Input }],
-    active: [{ type: Input }],
-    onClick: [{ type: Output }],
-    onSwatchHover: [{ type: Output }]
-};
-
-class SwatchesComponent extends ColorWrap {
-    constructor() {
-        super();
-        /** Pixel value for picker width */
-        this.width = 320;
-        /** Color squares to display */
-        this.height = 240;
-        /** An array of color groups, each with an array of colors */
-        this.colors = [
-            [
-                red['900'],
-                red['700'],
-                red['500'],
-                red['300'],
-                red['100'],
-            ],
-            [
-                pink['900'],
-                pink['700'],
-                pink['500'],
-                pink['300'],
-                pink['100'],
-            ],
-            [
-                purple['900'],
-                purple['700'],
-                purple['500'],
-                purple['300'],
-                purple['100'],
-            ],
-            [
-                deepPurple['900'],
-                deepPurple['700'],
-                deepPurple['500'],
-                deepPurple['300'],
-                deepPurple['100'],
-            ],
-            [
-                indigo['900'],
-                indigo['700'],
-                indigo['500'],
-                indigo['300'],
-                indigo['100'],
-            ],
-            [
-                blue['900'],
-                blue['700'],
-                blue['500'],
-                blue['300'],
-                blue['100'],
-            ],
-            [
-                lightBlue['900'],
-                lightBlue['700'],
-                lightBlue['500'],
-                lightBlue['300'],
-                lightBlue['100'],
-            ],
-            [
-                cyan['900'],
-                cyan['700'],
-                cyan['500'],
-                cyan['300'],
-                cyan['100'],
-            ],
-            [
-                teal['900'],
-                teal['700'],
-                teal['500'],
-                teal['300'],
-                teal['100'],
-            ],
-            [
-                '#194D33',
-                green['700'],
-                green['500'],
-                green['300'],
-                green['100'],
-            ],
-            [
-                lightGreen['900'],
-                lightGreen['700'],
-                lightGreen['500'],
-                lightGreen['300'],
-                lightGreen['100'],
-            ],
-            [
-                lime['900'],
-                lime['700'],
-                lime['500'],
-                lime['300'],
-                lime['100'],
-            ],
-            [
-                yellow['900'],
-                yellow['700'],
-                yellow['500'],
-                yellow['300'],
-                yellow['100'],
-            ],
-            [
-                amber['900'],
-                amber['700'],
-                amber['500'],
-                amber['300'],
-                amber['100'],
-            ],
-            [
-                orange['900'],
-                orange['700'],
-                orange['500'],
-                orange['300'],
-                orange['100'],
-            ],
-            [
-                deepOrange['900'],
-                deepOrange['700'],
-                deepOrange['500'],
-                deepOrange['300'],
-                deepOrange['100'],
-            ],
-            [
-                brown['900'],
-                brown['700'],
-                brown['500'],
-                brown['300'],
-                brown['100'],
-            ],
-            [
-                blueGrey['900'],
-                blueGrey['700'],
-                blueGrey['500'],
-                blueGrey['300'],
-                blueGrey['100'],
-            ],
-            ['#000000', '#525252', '#969696', '#D9D9D9', '#FFFFFF'],
-        ];
-        this.zDepth = 1;
-        this.radius = 1;
-        this.background = '#fff';
-    }
-    handlePickerChange({ data, $event }) {
-        this.handleChange(data, $event);
-    }
-}
-SwatchesComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'color-swatches',
-                template: `
-  <div class="swatches-picker {{ className }}"
-    [style.width.px]="width" [style.height.px]="height">
-    <color-raised [zDepth]="zDepth" [background]="background" [radius]="radius">
-      <div class="swatches-overflow" [style.height.px]="height">
-        <div class="swatches-body">
-          <color-swatches-group
-            *ngFor="let group of colors"
-            [group]="group" [active]="hex"
-            (onClick)="handlePickerChange($event)"
-          ></color-swatches-group>
-        </div>
-      </div>
-    </color-raised>
-  </div>
-  `,
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                preserveWhitespaces: false,
-                styles: [`
-      .swatches-overflow {
-        overflow-y: scroll;
-      }
-      .swatches-overflow {
-        padding: 16px 0 6px 16px;
-      }
-    `]
-            },] }
-];
-SwatchesComponent.ctorParameters = () => [];
-SwatchesComponent.propDecorators = {
-    width: [{ type: Input }],
-    height: [{ type: Input }],
-    colors: [{ type: Input }],
-    zDepth: [{ type: Input }],
-    radius: [{ type: Input }],
-    background: [{ type: Input }]
-};
-class ColorSwatchesModule {
-}
-ColorSwatchesModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [
-                    SwatchesComponent,
-                    SwatchesGroupComponent,
-                    SwatchesColorComponent,
-                ],
-                exports: [SwatchesComponent, SwatchesGroupComponent, SwatchesColorComponent],
-                imports: [CommonModule, SwatchModule, RaisedModule],
-            },] }
-];
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { ColorSwatchesModule, SwatchesComponent, SwatchesGroupComponent as ɵa, SwatchesColorComponent as ɵb };
-//# sourceMappingURL=ngx-color-swatches.js.map

package/swatches/fesm2015/ngx-color-swatches.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ngx-color-swatches.js","sources":["../../../../src/lib/components/swatches/swatches-color.component.ts","../../../../src/lib/components/swatches/swatches-group.component.ts","../../../../src/lib/components/swatches/swatches.component.ts","../../../../src/lib/components/swatches/ngx-color-swatches.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  EventEmitter,\n  Input,\n  OnInit,\n  Output,\n} from '@angular/core';\n\nimport { getContrastingColor } from 'ngx-color';\n\n@Component({\n  selector: 'color-swatches-color',\n  template: `\n    <color-swatch\n      [color]=\"color\"\n      [style]=\"colorStyle\"\n      [focusStyle]=\"focusStyle\"\n      [class.first]=\"first\"\n      [class.last]=\"last\"\n      (click)=\"handleClick($event)\"\n      (keydown.enter)=\"handleClick($event)\"\n      (onHover)=\"onSwatchHover.emit($event)\"\n    >\n      <div class=\"swatch-check\" *ngIf=\"active\" [class.first]=\"first\" [class.last]=\"last\">\n        <svg\n          style=\"width: 24px; height: 24px;\"\n          viewBox=\"0 0 24 24\"\n          [style.fill]=\"getContrastingColor(color)\"\n        >\n          <path d=\"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z\" />\n        </svg>\n      </div>\n    </color-swatch>\n  `,\n  styles: [\n    `\n      .swatches-group {\n        padding-bottom: 10px;\n        width: 40px;\n        float: left;\n        margin-right: 10px;\n      }\n      .swatch-check {\n        display: flex;\n        margin-left: 8px;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n})\nexport class SwatchesColorComponent implements OnInit {\n  @Input() color!: string;\n  @Input() first = false;\n  @Input() last = false;\n  @Input() active!: boolean;\n  @Output() onClick = new EventEmitter<any>();\n  @Output() onSwatchHover = new EventEmitter<any>();\n  getContrastingColor = getContrastingColor;\n  colorStyle: Record<string, string> = {\n    width: '40px',\n    height: '24px',\n    cursor: 'pointer',\n    marginBottom: '1px',\n  };\n  focusStyle: Record<string, string> = {};\n\n  ngOnInit() {\n    this.colorStyle.background = this.color;\n    this.focusStyle.boxShadow = `0 0 4px ${this.color}`;\n    if (this.first) {\n      this.colorStyle.borderRadius = '2px 2px 0 0';\n    }\n    if (this.last) {\n      this.colorStyle.borderRadius = '0 0 2px 2px';\n    }\n    if (this.color === '#FFFFFF') {\n      this.colorStyle.boxShadow = 'inset 0 0 0 1px #ddd';\n    }\n  }\n  handleClick($event) {\n    this.onClick.emit({\n      data: {\n        hex: this.color,\n        source: 'hex',\n      },\n      $event,\n    });\n  }\n}\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\n\n@Component({\n  selector: 'color-swatches-group',\n  template: `\n    <div class=\"swatches-group\">\n      <color-swatches-color\n        *ngFor=\"let color of group; let idx = index\"\n        [active]=\"color.toLowerCase() === active\"\n        [color]=\"color\"\n        [first]=\"idx === 0\"\n        [last]=\"idx === group.length - 1\"\n        (onClick)=\"onClick.emit($event)\"\n      >\n      </color-swatches-color>\n    </div>\n  `,\n  styles: [\n    `\n      .swatches-group {\n        padding-bottom: 10px;\n        width: 40px;\n        float: left;\n        margin-right: 10px;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n})\nexport class SwatchesGroupComponent {\n  @Input() group!: string[];\n  @Input() active!: string;\n  @Output() onClick = new EventEmitter<any>();\n  @Output() onSwatchHover = new EventEmitter<any>();\n}\n","import { CommonModule } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  Input,\n  NgModule,\n} from '@angular/core';\nimport {\n  amber,\n  blue,\n  blueGrey,\n  brown,\n  cyan,\n  deepOrange,\n  deepPurple,\n  green,\n  indigo,\n  lightBlue,\n  lightGreen,\n  lime,\n  orange,\n  pink,\n  purple,\n  red,\n  teal,\n  yellow,\n} from 'material-colors';\n\nimport { ColorWrap, RaisedModule, SwatchModule, zDepth } from 'ngx-color';\nimport { SwatchesColorComponent } from './swatches-color.component';\nimport { SwatchesGroupComponent } from './swatches-group.component';\n\n@Component({\n  selector: 'color-swatches',\n  template: `\n  <div class=\"swatches-picker {{ className }}\"\n    [style.width.px]=\"width\" [style.height.px]=\"height\">\n    <color-raised [zDepth]=\"zDepth\" [background]=\"background\" [radius]=\"radius\">\n      <div class=\"swatches-overflow\" [style.height.px]=\"height\">\n        <div class=\"swatches-body\">\n          <color-swatches-group\n            *ngFor=\"let group of colors\"\n            [group]=\"group\" [active]=\"hex\"\n            (onClick)=\"handlePickerChange($event)\"\n          ></color-swatches-group>\n        </div>\n      </div>\n    </color-raised>\n  </div>\n  `,\n  styles: [\n    `\n      .swatches-overflow {\n        overflow-y: scroll;\n      }\n      .swatches-overflow {\n        padding: 16px 0 6px 16px;\n      }\n    `,\n  ],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  preserveWhitespaces: false,\n})\nexport class SwatchesComponent extends ColorWrap {\n  /** Pixel value for picker width */\n  @Input() width: string | number = 320;\n  /** Color squares to display */\n  @Input() height: string | number = 240;\n  /** An array of color groups, each with an array of colors */\n  @Input()\n  colors: string[][] = [\n    [\n      red['900'],\n      red['700'],\n      red['500'],\n      red['300'],\n      red['100'],\n    ],\n    [\n      pink['900'],\n      pink['700'],\n      pink['500'],\n      pink['300'],\n      pink['100'],\n    ],\n    [\n      purple['900'],\n      purple['700'],\n      purple['500'],\n      purple['300'],\n      purple['100'],\n    ],\n    [\n      deepPurple['900'],\n      deepPurple['700'],\n      deepPurple['500'],\n      deepPurple['300'],\n      deepPurple['100'],\n    ],\n    [\n      indigo['900'],\n      indigo['700'],\n      indigo['500'],\n      indigo['300'],\n      indigo['100'],\n    ],\n    [\n      blue['900'],\n      blue['700'],\n      blue['500'],\n      blue['300'],\n      blue['100'],\n    ],\n    [\n      lightBlue['900'],\n      lightBlue['700'],\n      lightBlue['500'],\n      lightBlue['300'],\n      lightBlue['100'],\n    ],\n    [\n      cyan['900'],\n      cyan['700'],\n      cyan['500'],\n      cyan['300'],\n      cyan['100'],\n    ],\n    [\n      teal['900'],\n      teal['700'],\n      teal['500'],\n      teal['300'],\n      teal['100'],\n    ],\n    [\n      '#194D33',\n      green['700'],\n      green['500'],\n      green['300'],\n      green['100'],\n    ],\n    [\n      lightGreen['900'],\n      lightGreen['700'],\n      lightGreen['500'],\n      lightGreen['300'],\n      lightGreen['100'],\n    ],\n    [\n      lime['900'],\n      lime['700'],\n      lime['500'],\n      lime['300'],\n      lime['100'],\n    ],\n    [\n      yellow['900'],\n      yellow['700'],\n      yellow['500'],\n      yellow['300'],\n      yellow['100'],\n    ],\n    [\n      amber['900'],\n      amber['700'],\n      amber['500'],\n      amber['300'],\n      amber['100'],\n    ],\n    [\n      orange['900'],\n      orange['700'],\n      orange['500'],\n      orange['300'],\n      orange['100'],\n    ],\n    [\n      deepOrange['900'],\n      deepOrange['700'],\n      deepOrange['500'],\n      deepOrange['300'],\n      deepOrange['100'],\n    ],\n    [\n      brown['900'],\n      brown['700'],\n      brown['500'],\n      brown['300'],\n      brown['100'],\n    ],\n    [\n      blueGrey['900'],\n      blueGrey['700'],\n      blueGrey['500'],\n      blueGrey['300'],\n      blueGrey['100'],\n    ],\n    ['#000000', '#525252', '#969696', '#D9D9D9', '#FFFFFF'],\n  ];\n  @Input() zDepth: zDepth = 1;\n  @Input() radius = 1;\n  @Input() background = '#fff';\n\n  constructor() {\n    super();\n  }\n\n  handlePickerChange({ data, $event }) {\n    this.handleChange(data, $event);\n  }\n}\n\n@NgModule({\n  declarations: [\n    SwatchesComponent,\n    SwatchesGroupComponent,\n    SwatchesColorComponent,\n  ],\n  exports: [SwatchesComponent, SwatchesGroupComponent, SwatchesColorComponent],\n  imports: [CommonModule, SwatchModule, RaisedModule],\n})\nexport class ColorSwatchesModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './swatches.component';\n\nexport {SwatchesColorComponent as ɵb} from './swatches-color.component';\nexport {SwatchesGroupComponent as ɵa} from './swatches-group.component';"],"names":[],"mappings":"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"}

package/swatches/ngx-color-swatches.metadata.json

@@ -1 +0,0 @@
-{"__symbolic":"module","version":4,"metadata":{"SwatchesComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"ngx-color","name":"ColorWrap","line":63,"character":39},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":32,"character":1},"arguments":[{"selector":"color-swatches","template":"\n  <div class=\"swatches-picker {{ className }}\"\n    [style.width.px]=\"width\" [style.height.px]=\"height\">\n    <color-raised [zDepth]=\"zDepth\" [background]=\"background\" [radius]=\"radius\">\n      <div class=\"swatches-overflow\" [style.height.px]=\"height\">\n        <div class=\"swatches-body\">\n          <color-swatches-group\n            *ngFor=\"let group of colors\"\n            [group]=\"group\" [active]=\"hex\"\n            (onClick)=\"handlePickerChange($event)\"\n          ></color-swatches-group>\n        </div>\n      </div>\n    </color-raised>\n  </div>\n  ","styles":["\n      .swatches-overflow {\n        overflow-y: scroll;\n      }\n      .swatches-overflow {\n        padding: 16px 0 6px 16px;\n      }\n    "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":60,"character":19},"member":"OnPush"},"preserveWhitespaces":false}]}],"members":{"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"height":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":3}}]}],"colors":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"zDepth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":199,"character":3}}]}],"radius":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":200,"character":3}}]}],"background":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":201,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"handlePickerChange":[{"__symbolic":"method"}]}},"ColorSwatchesModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":212,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"SwatchesComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"}],"exports":[{"__symbolic":"reference","name":"SwatchesComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":219,"character":12},{"__symbolic":"reference","module":"ngx-color","name":"SwatchModule","line":219,"character":26},{"__symbolic":"reference","module":"ngx-color","name":"RaisedModule","line":219,"character":40}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"color-swatches-group","template":"\n    <div class=\"swatches-group\">\n      <color-swatches-color\n        *ngFor=\"let color of group; let idx = index\"\n        [active]=\"color.toLowerCase() === active\"\n        [color]=\"color\"\n        [first]=\"idx === 0\"\n        [last]=\"idx === group.length - 1\"\n        (onClick)=\"onClick.emit($event)\"\n      >\n      </color-swatches-color>\n    </div>\n  ","styles":["\n      .swatches-group {\n        padding-bottom: 10px;\n        width: 40px;\n        float: left;\n        margin-right: 10px;\n      }\n    "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":27,"character":19},"member":"OnPush"},"preserveWhitespaces":false}]}],"members":{"group":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"onClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":33,"character":3}}]}],"onSwatchHover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":34,"character":3}}]}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"color-swatches-color","template":"\n    <color-swatch\n      [color]=\"color\"\n      [style]=\"colorStyle\"\n      [focusStyle]=\"focusStyle\"\n      [class.first]=\"first\"\n      [class.last]=\"last\"\n      (click)=\"handleClick($event)\"\n      (keydown.enter)=\"handleClick($event)\"\n      (onHover)=\"onSwatchHover.emit($event)\"\n    >\n      <div class=\"swatch-check\" *ngIf=\"active\" [class.first]=\"first\" [class.last]=\"last\">\n        <svg\n          style=\"width: 24px; height: 24px;\"\n          viewBox=\"0 0 24 24\"\n          [style.fill]=\"getContrastingColor(color)\"\n        >\n          <path d=\"M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z\" />\n        </svg>\n      </div>\n    </color-swatch>\n  ","styles":["\n      .swatches-group {\n        padding-bottom: 10px;\n        width: 40px;\n        float: left;\n        margin-right: 10px;\n      }\n      .swatch-check {\n        display: flex;\n        margin-left: 8px;\n      }\n    "],"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":49,"character":19},"member":"OnPush"},"preserveWhitespaces":false}]}],"members":{"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3}}]}],"first":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"last":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"active":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"onClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":57,"character":3}}]}],"onSwatchHover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":58,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}],"handleClick":[{"__symbolic":"method"}]}}},"origins":{"SwatchesComponent":"./swatches.component","ColorSwatchesModule":"./swatches.component","ɵa":"./swatches-group.component","ɵb":"./swatches-color.component"},"importAs":"ngx-color/swatches"}