import { Component, EventEmitter, Input, Output } from '@angular/core';
import { Constants } from './../constant/constants';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class AswColorPicker {
    isEditor = false;
    textColor;
    backgroundColor;
    colorChange = new EventEmitter();
    constants = Constants;
    colorsName = [];
    constructor() { }
    ngOnInit() {
        this.colorsName = Object.keys(this.constants.colors);
    }
    /**
     * Change color from default colors
     */
    onChange(color, where) {
        if (where === 'textColor') {
            this.textColor = color;
        }
        else {
            this.backgroundColor = color;
        }
        this.colorChange.emit({ colorCode: color, where });
    }
    /**
     * Change color from input
     */
    changeColorManual(color, where) {
        const isValid = /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(color);
        if (isValid) {
            this.onChange(color, where);
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: AswColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: AswColorPicker, selector: "asw-color-picker", inputs: { isEditor: "isEditor", textColor: "textColor", backgroundColor: "backgroundColor" }, outputs: { colorChange: "colorChange" }, ngImport: i0, template: "<ng-container *ngIf=\"isEditor; else normalPicker\">\r\n    <div class=\"asw-color-picker\">\r\n        <div class=\"opened asw-opened\">\r\n            <div class=\"asw-row\">\r\n                <div class=\"asw-col-md-6\">\r\n                    <span>Background color</span>\r\n                    <div class=\"colors\">\r\n                        <div [ngClass]=\"colorName\" [class.selected]=\"backgroundColor == constants.colors[colorName]\"\r\n                            (click)=\"onChange(constants.colors[colorName], 'backgroundColor')\"\r\n                            *ngFor=\"let colorName of colorsName\" class=\"circle\"\r\n                            [style.background]=\"constants.colors[colorName]\"></div>\r\n                    </div>\r\n                    <div class=\"asw-hex-code\">\r\n                        <p>Hex Code</p>\r\n                        <div class=\"asw-input\">\r\n                            <input type=\"text\" maxlength=\"7\" [value]=\"backgroundColor\"\r\n                                (keyup)=\"changeColorManual(paintBackgroundColor.value, 'backgroundColor')\"\r\n                                #paintBackgroundColor />\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"asw-col-md-6\">\r\n                    <span>Text color</span>\r\n                    <div class=\"colors\">\r\n                        <div [ngClass]=\"colorName\" [class.selected]=\"textColor == constants.colors[colorName]\"\r\n                            (click)=\"onChange(constants.colors[colorName], 'textColor')\"\r\n                            *ngFor=\"let colorName of colorsName\" class=\"circle\"\r\n                            [style.background]=\"constants.colors[colorName]\"></div>\r\n                    </div>\r\n                    <div class=\"asw-hex-code\">\r\n                        <p>Hex Code</p>\r\n                        <div class=\"asw-input\">\r\n                            <input type=\"text\" maxlength=\"7\" [value]=\"textColor\"\r\n                                (keyup)=\"changeColorManual(paintTextColor.value, 'textColor')\" #paintTextColor />\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-container>\r\n<ng-template #normalPicker>\r\n    <div class=\"asw-color-picker\">\r\n        <div class=\"opened-menu asw-opened-menu\">\r\n            <div class=\"colors\">\r\n                <div [ngClass]=\"colorName\" [class.selected]=\"backgroundColor == constants.colors[colorName]\"\r\n                    (click)=\"onChange(constants.colors[colorName], 'backgroundColor')\"\r\n                    *ngFor=\"let colorName of colorsName\" class=\"circle\"\r\n                    [style.background]=\"constants.colors[colorName]\"></div>\r\n            </div>\r\n            <div class=\"asw-hex-code\">\r\n                <p>Hex Code</p>\r\n                <div class=\"asw-input\">\r\n                    <input type=\"text\" maxlength=\"7\" [value]=\"backgroundColor\"\r\n                        (keyup)=\"changeColorManual(paintColor.value, 'backgroundColor')\" #paintColor />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-template>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: AswColorPicker, decorators: [{
            type: Component,
            args: [{ selector: 'asw-color-picker', template: "<ng-container *ngIf=\"isEditor; else normalPicker\">\r\n    <div class=\"asw-color-picker\">\r\n        <div class=\"opened asw-opened\">\r\n            <div class=\"asw-row\">\r\n                <div class=\"asw-col-md-6\">\r\n                    <span>Background color</span>\r\n                    <div class=\"colors\">\r\n                        <div [ngClass]=\"colorName\" [class.selected]=\"backgroundColor == constants.colors[colorName]\"\r\n                            (click)=\"onChange(constants.colors[colorName], 'backgroundColor')\"\r\n                            *ngFor=\"let colorName of colorsName\" class=\"circle\"\r\n                            [style.background]=\"constants.colors[colorName]\"></div>\r\n                    </div>\r\n                    <div class=\"asw-hex-code\">\r\n                        <p>Hex Code</p>\r\n                        <div class=\"asw-input\">\r\n                            <input type=\"text\" maxlength=\"7\" [value]=\"backgroundColor\"\r\n                                (keyup)=\"changeColorManual(paintBackgroundColor.value, 'backgroundColor')\"\r\n                                #paintBackgroundColor />\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"asw-col-md-6\">\r\n                    <span>Text color</span>\r\n                    <div class=\"colors\">\r\n                        <div [ngClass]=\"colorName\" [class.selected]=\"textColor == constants.colors[colorName]\"\r\n                            (click)=\"onChange(constants.colors[colorName], 'textColor')\"\r\n                            *ngFor=\"let colorName of colorsName\" class=\"circle\"\r\n                            [style.background]=\"constants.colors[colorName]\"></div>\r\n                    </div>\r\n                    <div class=\"asw-hex-code\">\r\n                        <p>Hex Code</p>\r\n                        <div class=\"asw-input\">\r\n                            <input type=\"text\" maxlength=\"7\" [value]=\"textColor\"\r\n                                (keyup)=\"changeColorManual(paintTextColor.value, 'textColor')\" #paintTextColor />\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-container>\r\n<ng-template #normalPicker>\r\n    <div class=\"asw-color-picker\">\r\n        <div class=\"opened-menu asw-opened-menu\">\r\n            <div class=\"colors\">\r\n                <div [ngClass]=\"colorName\" [class.selected]=\"backgroundColor == constants.colors[colorName]\"\r\n                    (click)=\"onChange(constants.colors[colorName], 'backgroundColor')\"\r\n                    *ngFor=\"let colorName of colorsName\" class=\"circle\"\r\n                    [style.background]=\"constants.colors[colorName]\"></div>\r\n            </div>\r\n            <div class=\"asw-hex-code\">\r\n                <p>Hex Code</p>\r\n                <div class=\"asw-input\">\r\n                    <input type=\"text\" maxlength=\"7\" [value]=\"backgroundColor\"\r\n                        (keyup)=\"changeColorManual(paintColor.value, 'backgroundColor')\" #paintColor />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-template>" }]
        }], ctorParameters: function () { return []; }, propDecorators: { isEditor: [{
                type: Input
            }], textColor: [{
                type: Input
            }], backgroundColor: [{
                type: Input
            }], colorChange: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 