import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
export class CsCheckboxIndeterminateComponent {
    constructor() {
        this.ngValueChange = new EventEmitter();
    }
    ngOnInit() {
    }
    valueChanged() {
        const emitValue = {
            value: this.value,
            checked: this.ngValue
        };
        this.ngValueChange.emit(emitValue);
    }
    chileClick(event) {
        event.stopPropagation();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsCheckboxIndeterminateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CsCheckboxIndeterminateComponent, selector: "app-cs-checkbox-indeterminate", inputs: { disabled: "disabled", ngValue: "ngValue", value: "value" }, outputs: { ngValueChange: "ngValueChange" }, ngImport: i0, template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\" (click)=\"chileClick($event)\">\n    <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\n    <span class=\"checkbox\">\n      <span class=\"inner\"></span>\n    </span>\n    <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n      <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n      <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\n    </svg>\n    <span class=\"value\"><ng-content></ng-content></span>\n  </label>\n  ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 24px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"], dependencies: [{ kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CsCheckboxIndeterminateComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-cs-checkbox-indeterminate', template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\" (click)=\"chileClick($event)\">\n    <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\n    <span class=\"checkbox\">\n      <span class=\"inner\"></span>\n    </span>\n    <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\n      <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\n      <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\n    </svg>\n    <span class=\"value\"><ng-content></ng-content></span>\n  </label>\n  ", styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 24px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"] }]
        }], ctorParameters: function () { return []; }, propDecorators: { disabled: [{
                type: Input
            }], ngValue: [{
                type: Input
            }], value: [{
                type: Input
            }], ngValueChange: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3MtY2hlY2tib3gtaW5kZXRlcm1pbmF0ZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy92eC13b3JrZmxvdy1lbmdpbmUvc3JjL2xpYi9mb3JtZ3JvdXAvY3MtY2hlY2tib3gtaW5kZXRlcm1pbmF0ZS9jcy1jaGVja2JveC1pbmRldGVybWluYXRlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Z4LXdvcmtmbG93LWVuZ2luZS9zcmMvbGliL2Zvcm1ncm91cC9jcy1jaGVja2JveC1pbmRldGVybWluYXRlL2NzLWNoZWNrYm94LWluZGV0ZXJtaW5hdGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBTy9FLE1BQU0sT0FBTyxnQ0FBZ0M7SUFNM0M7UUFGVSxrQkFBYSxHQUFHLElBQUksWUFBWSxFQUFPLENBQUM7SUFFbEMsQ0FBQztJQUVqQixRQUFRO0lBQ1IsQ0FBQztJQUNELFlBQVk7UUFDVixNQUFNLFNBQVMsR0FBRztZQUNoQixLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUs7WUFDakIsT0FBTyxFQUFFLElBQUksQ0FBQyxPQUFPO1NBQ3RCLENBQUE7UUFDRCxJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQztJQUNyQyxDQUFDO0lBRUQsVUFBVSxDQUFDLEtBQVU7UUFDbkIsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQzFCLENBQUM7K0dBcEJVLGdDQUFnQzttR0FBaEMsZ0NBQWdDLHdMQ1A3QywwbkJBV0U7OzRGREpXLGdDQUFnQztrQkFMNUMsU0FBUzsrQkFDRSwrQkFBK0I7MEVBS2hDLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDSSxhQUFhO3NCQUF0QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdhcHAtY3MtY2hlY2tib3gtaW5kZXRlcm1pbmF0ZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9jcy1jaGVja2JveC1pbmRldGVybWluYXRlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vY3MtY2hlY2tib3gtaW5kZXRlcm1pbmF0ZS5jb21wb25lbnQubGVzcyddXG59KVxuZXhwb3J0IGNsYXNzIENzQ2hlY2tib3hJbmRldGVybWluYXRlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgQElucHV0KCkgZGlzYWJsZWQhOiBib29sZWFuO1xuICBASW5wdXQoKSBuZ1ZhbHVlOiBhbnk7XG4gIEBJbnB1dCgpIHZhbHVlOiBhbnk7XG4gIEBPdXRwdXQoKSBuZ1ZhbHVlQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgY29uc3RydWN0b3IoKSB7IH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgfVxuICB2YWx1ZUNoYW5nZWQoKSB7XG4gICAgY29uc3QgZW1pdFZhbHVlID0ge1xuICAgICAgdmFsdWU6IHRoaXMudmFsdWUsXG4gICAgICBjaGVja2VkOiB0aGlzLm5nVmFsdWVcbiAgICB9XG4gICAgdGhpcy5uZ1ZhbHVlQ2hhbmdlLmVtaXQoZW1pdFZhbHVlKTtcbiAgfVxuXG4gIGNoaWxlQ2xpY2soZXZlbnQ6IGFueSl7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gIH1cblxufVxuIiwiPGxhYmVsIGNsYXNzPVwiY2hlY2tib3gtaXRlbVwiIFtjbGFzcy5kaXNhYmxlZF09XCJkaXNhYmxlZFwiIChjbGljayk9XCJjaGlsZUNsaWNrKCRldmVudClcIj5cbiAgICA8aW5wdXQgdHlwZT1cImNoZWNrYm94XCIgW25hbWVdPVwidmFsdWVcIiBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIiBbKG5nTW9kZWwpXT1cIm5nVmFsdWVcIiAobmdNb2RlbENoYW5nZSk9XCJ2YWx1ZUNoYW5nZWQoKVwiIC8+XG4gICAgPHNwYW4gY2xhc3M9XCJjaGVja2JveFwiPlxuICAgICAgPHNwYW4gY2xhc3M9XCJpbm5lclwiPjwvc3Bhbj5cbiAgICA8L3NwYW4+XG4gICAgPHN2ZyBjbGFzcz1cImNoZWNrbWFya1wiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIiB2aWV3Qm94PVwiMCAwIDUyIDUyXCI+XG4gICAgICA8Y2lyY2xlIGNsYXNzPVwiY2hlY2ttYXJrX19jaXJjbGVcIiBjeD1cIjI2XCIgY3k9XCIyNlwiIHI9XCIyNVwiIGZpbGw9XCJub25lXCIgLz5cbiAgICAgIDxwYXRoIGZpbGw9XCJub25lXCIgZD1cIk0zNy45LDI3SDE0di0yaDIzLjlWMjd6XCIvPlxuICAgIDwvc3ZnPlxuICAgIDxzcGFuIGNsYXNzPVwidmFsdWVcIj48bmctY29udGVudD48L25nLWNvbnRlbnQ+PC9zcGFuPlxuICA8L2xhYmVsPlxuICAiXX0=