import { Component, EventEmitter, Input, Output } from '@angular/core';
import { OverlayService } from '@aztrix/components/overlay';
import { ColorPickerService } from 'ngx-color-picker';
import * as i0 from "@angular/core";
import * as i1 from "@aztrix/components/overlay";
import * as i2 from "@aztrix/components/button";
import * as i3 from "ngx-color-picker";
import * as i4 from "@aztrix/helpers";
export class ColorPickerModalComponent {
    constructor(_overlay) {
        this._overlay = _overlay;
        this.valueChange = new EventEmitter();
        this._initialValue = '';
    }
    ngOnChanges(changes) {
        if (changes.value) {
            this._initialValue = this.value;
        }
    }
    save() {
        this._overlay.closeModal();
    }
    cancel() {
        this.valueChange.next(this._initialValue);
        this._overlay.closeModal();
    }
}
ColorPickerModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: ColorPickerModalComponent, deps: [{ token: i1.OverlayService }], target: i0.ɵɵFactoryTarget.Component });
ColorPickerModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: ColorPickerModalComponent, selector: "ng-component", inputs: { value: "value" }, outputs: { valueChange: "valueChange" }, providers: [ColorPickerService], usesOnChanges: true, ngImport: i0, template: "<div>\n  <color-picker\n    [cpToggle]=\"true\"\n    cpDialogDisplay=\"inline\"\n    cpAlphaChannel=\"disabled\"\n    [colorPicker]=\"value\"\n    (colorPickerChange)=\"valueChange.next($event)\"\n  ></color-picker>\n</div>\n<div class=\"actions h-button-wrapper\">\n  <button axButton (click)=\"cancel()\">\n    {{ 'label.cancel' | translate }}\n  </button>\n  <button axButton color=\"primary\" filled (click)=\"save()\">\n    {{ 'label.ok' | translate }}\n  </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;align-items:center;margin:1rem}.actions{width:100%}:host ::ng-deep .color-picker{border:none}\n"], dependencies: [{ kind: "directive", type: i2.ButtonDirective, selector: "[axButton]", inputs: ["color", "labelHideMobile", "smallButton", "bigButton", "fullWidth", "filled", "outline", "icon-button", "hoverLabel", "hover", "lowercase", "disabled"] }, { kind: "directive", type: i3.ColorPickerDirective, selector: "[colorPicker]", inputs: ["cpWidth", "cpHeight", "cpToggle", "cpDisabled", "cpIgnoredElements", "cpFallbackColor", "cpColorMode", "cpCmykEnabled", "cpOutputFormat", "cpAlphaChannel", "cpDisableInput", "cpDialogDisplay", "cpSaveClickOutside", "cpCloseClickOutside", "cpUseRootViewContainer", "cpPosition", "cpPositionOffset", "cpPositionRelativeToArrow", "cpOKButton", "cpOKButtonText", "cpOKButtonClass", "cpCancelButton", "cpCancelButtonText", "cpCancelButtonClass", "cpPresetLabel", "cpPresetColorsClass", "cpMaxPresetColorsLength", "cpPresetEmptyMessage", "cpPresetEmptyMessageClass", "cpAddColorButton", "cpAddColorButtonText", "cpAddColorButtonClass", "cpRemoveColorButtonClass", "colorPicker", "cpPresetColors"], outputs: ["cpInputChange", "cpToggleChange", "cpSliderChange", "cpSliderDragEnd", "cpSliderDragStart", "colorPickerOpen", "colorPickerClose", "colorPickerCancel", "colorPickerSelect", "colorPickerChange", "cpCmykColorChange", "cpPresetColorsChange"], exportAs: ["ngxColorPicker"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: ColorPickerModalComponent, decorators: [{
            type: Component,
            args: [{ providers: [ColorPickerService], template: "<div>\n  <color-picker\n    [cpToggle]=\"true\"\n    cpDialogDisplay=\"inline\"\n    cpAlphaChannel=\"disabled\"\n    [colorPicker]=\"value\"\n    (colorPickerChange)=\"valueChange.next($event)\"\n  ></color-picker>\n</div>\n<div class=\"actions h-button-wrapper\">\n  <button axButton (click)=\"cancel()\">\n    {{ 'label.cancel' | translate }}\n  </button>\n  <button axButton color=\"primary\" filled (click)=\"save()\">\n    {{ 'label.ok' | translate }}\n  </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column;align-items:center;margin:1rem}.actions{width:100%}:host ::ng-deep .color-picker{border:none}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.OverlayService }]; }, propDecorators: { value: [{
                type: Input
            }], valueChange: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItcGlja2VyLW1vZGFsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9jb2xvci1zZWxlY3QvY29sb3ItcGlja2VyLW1vZGFsL2NvbG9yLXBpY2tlci1tb2RhbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvY29sb3Itc2VsZWN0L2NvbG9yLXBpY2tlci1tb2RhbC9jb2xvci1waWNrZXItbW9kYWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFhLE1BQU0sRUFBZ0IsTUFBTSxlQUFlLENBQUM7QUFDL0YsT0FBTyxFQUFDLGNBQWMsRUFBQyxNQUFNLDRCQUE0QixDQUFDO0FBQzFELE9BQU8sRUFBQyxrQkFBa0IsRUFBQyxNQUFNLGtCQUFrQixDQUFDOzs7Ozs7QUFPcEQsTUFBTSxPQUFPLHlCQUF5QjtJQU1wQyxZQUFvQixRQUF3QjtRQUF4QixhQUFRLEdBQVIsUUFBUSxDQUFnQjtRQUpsQyxnQkFBVyxHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7UUFFM0Msa0JBQWEsR0FBRyxFQUFFLENBQUM7SUFFb0IsQ0FBQztJQUVoRCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxPQUFPLENBQUMsS0FBSyxFQUFFO1lBQ2pCLElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQztTQUNqQztJQUNILENBQUM7SUFFRCxJQUFJO1FBQ0YsSUFBSSxDQUFDLFFBQVEsQ0FBQyxVQUFVLEVBQUUsQ0FBQztJQUM3QixDQUFDO0lBRUQsTUFBTTtRQUNKLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQztRQUMxQyxJQUFJLENBQUMsUUFBUSxDQUFDLFVBQVUsRUFBRSxDQUFDO0lBQzdCLENBQUM7O3NIQXJCVSx5QkFBeUI7MEdBQXpCLHlCQUF5Qiw0R0FGekIsQ0FBQyxrQkFBa0IsQ0FBQywrQ0NQakMsa2VBaUJBOzJGRFJhLHlCQUF5QjtrQkFMckMsU0FBUztnQ0FHRyxDQUFDLGtCQUFrQixDQUFDO3FHQUd0QixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0ksV0FBVztzQkFBcEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkNoYW5nZXMsIE91dHB1dCwgU2ltcGxlQ2hhbmdlc30gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge092ZXJsYXlTZXJ2aWNlfSBmcm9tICdAYXp0cml4L2NvbXBvbmVudHMvb3ZlcmxheSc7XG5pbXBvcnQge0NvbG9yUGlja2VyU2VydmljZX0gZnJvbSAnbmd4LWNvbG9yLXBpY2tlcic7XG5cbkBDb21wb25lbnQoe1xuICB0ZW1wbGF0ZVVybDogJy4vY29sb3ItcGlja2VyLW1vZGFsLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vY29sb3ItcGlja2VyLW1vZGFsLmNvbXBvbmVudC5zY3NzJ10sXG4gIHByb3ZpZGVyczogW0NvbG9yUGlja2VyU2VydmljZV0sXG59KVxuZXhwb3J0IGNsYXNzIENvbG9yUGlja2VyTW9kYWxDb21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBASW5wdXQoKSB2YWx1ZTogc3RyaW5nO1xuICBAT3V0cHV0KCkgdmFsdWVDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcblxuICBwcml2YXRlIF9pbml0aWFsVmFsdWUgPSAnJztcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIF9vdmVybGF5OiBPdmVybGF5U2VydmljZSkge31cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgaWYgKGNoYW5nZXMudmFsdWUpIHtcbiAgICAgIHRoaXMuX2luaXRpYWxWYWx1ZSA9IHRoaXMudmFsdWU7XG4gICAgfVxuICB9XG5cbiAgc2F2ZSgpIHtcbiAgICB0aGlzLl9vdmVybGF5LmNsb3NlTW9kYWwoKTtcbiAgfVxuXG4gIGNhbmNlbCgpIHtcbiAgICB0aGlzLnZhbHVlQ2hhbmdlLm5leHQodGhpcy5faW5pdGlhbFZhbHVlKTtcbiAgICB0aGlzLl9vdmVybGF5LmNsb3NlTW9kYWwoKTtcbiAgfVxufVxuIiwiPGRpdj5cbiAgPGNvbG9yLXBpY2tlclxuICAgIFtjcFRvZ2dsZV09XCJ0cnVlXCJcbiAgICBjcERpYWxvZ0Rpc3BsYXk9XCJpbmxpbmVcIlxuICAgIGNwQWxwaGFDaGFubmVsPVwiZGlzYWJsZWRcIlxuICAgIFtjb2xvclBpY2tlcl09XCJ2YWx1ZVwiXG4gICAgKGNvbG9yUGlja2VyQ2hhbmdlKT1cInZhbHVlQ2hhbmdlLm5leHQoJGV2ZW50KVwiXG4gID48L2NvbG9yLXBpY2tlcj5cbjwvZGl2PlxuPGRpdiBjbGFzcz1cImFjdGlvbnMgaC1idXR0b24td3JhcHBlclwiPlxuICA8YnV0dG9uIGF4QnV0dG9uIChjbGljayk9XCJjYW5jZWwoKVwiPlxuICAgIHt7ICdsYWJlbC5jYW5jZWwnIHwgdHJhbnNsYXRlIH19XG4gIDwvYnV0dG9uPlxuICA8YnV0dG9uIGF4QnV0dG9uIGNvbG9yPVwicHJpbWFyeVwiIGZpbGxlZCAoY2xpY2spPVwic2F2ZSgpXCI+XG4gICAge3sgJ2xhYmVsLm9rJyB8IHRyYW5zbGF0ZSB9fVxuICA8L2J1dHRvbj5cbjwvZGl2PlxuIl19