/**
 * This file is part of the MedSafe application which is commercial software created by MedVision360 B.V.
 * The source code is proprietary and confidential.
 *
 * Unauthorized copying of this file, via any medium is strictly prohibited.
 *
 * Copyright (c) by MedVision360 B.V. All rights reserved.
 *
 * For the application name: io.medrecord.medsafe
 */
import { __decorate, __param } from "tslib";
import { Component, EventEmitter, HostBinding, Input, Optional, Output, Self, ViewChild } from '@angular/core';
import { NgControl } from '@angular/forms';
import { IconType } from '../../../../models';
var CheckboxComponent = /** @class */ (function () {
    function CheckboxComponent(ngControl) {
        this.ngControl = ngControl;
        this.hint = '';
        this.valueChanged = new EventEmitter();
        this.iconTypes = IconType;
        this.isSelected = false;
        this.disabled = false;
        this.onChange = function () { };
        this.onTouched = function () { };
        if (ngControl) {
            ngControl.valueAccessor = this;
        }
    }
    Object.defineProperty(CheckboxComponent.prototype, "control", {
        get: function () {
            return this.ngControl;
        },
        enumerable: true,
        configurable: true
    });
    CheckboxComponent.prototype.ngOnInit = function () {
        if (this.defaultValue !== undefined) {
            this.isSelected = this.defaultValue;
        }
    };
    Object.defineProperty(CheckboxComponent.prototype, "inputId", {
        get: function () {
            return this.ngControl ? this.ngControl.name : null;
        },
        enumerable: true,
        configurable: true
    });
    CheckboxComponent.prototype.click = function () {
        if (this.disabled) {
            return;
        }
        this.isSelected = !this.isSelected;
        this.valueChanged.emit(this.isSelected);
        this.onChange(this.isSelected);
        this.onTouched();
    };
    // ControlValueAccessor implementations
    CheckboxComponent.prototype.writeValue = function (value) {
        this.isSelected = value;
    };
    CheckboxComponent.prototype.registerOnChange = function (fn) {
        this.onChange = fn;
    };
    CheckboxComponent.prototype.registerOnTouched = function (fn) {
        this.onTouched = fn;
    };
    CheckboxComponent.prototype.setDisabledState = function (disabled) {
        this.disabled = disabled;
    };
    CheckboxComponent.ctorParameters = function () { return [
        { type: NgControl, decorators: [{ type: Self }, { type: Optional }] }
    ]; };
    __decorate([
        ViewChild('checkbox', { static: true })
    ], CheckboxComponent.prototype, "inputElementRef", void 0);
    __decorate([
        HostBinding('class.form-control-styles')
    ], CheckboxComponent.prototype, "control", null);
    __decorate([
        Input()
    ], CheckboxComponent.prototype, "defaultValue", void 0);
    __decorate([
        Input()
    ], CheckboxComponent.prototype, "labelDescription", void 0);
    __decorate([
        Input()
    ], CheckboxComponent.prototype, "description", void 0);
    __decorate([
        Input()
    ], CheckboxComponent.prototype, "hint", void 0);
    __decorate([
        Output()
    ], CheckboxComponent.prototype, "valueChanged", void 0);
    __decorate([
        Input()
    ], CheckboxComponent.prototype, "disabled", void 0);
    CheckboxComponent = __decorate([
        Component({
            selector: 'app-checkbox',
            template: "<div class=\"input-wrapper\">\n  <input [value]=\"isSelected\"\n         type=\"checkbox\"\n         [id]=\"inputId\"\n         [disabled]=\"disabled\"\n         [checked]=\"isSelected\"\n         #checkbox\n  />\n  <div class=\"input-placeholder\" [ngClass]=\"{active: isSelected}\" (click)=\"click()\">\n    <svg-icon\n      *ngIf=\"isSelected\"\n      [name]=\"iconTypes.check\"\n    ></svg-icon>\n  </div>\n</div>\n\n<div class=\"label-wrapper\">\n  <label [for]=\"inputId\" (click)=\"click()\">\n    <ng-content></ng-content>\n  </label>\n  <app-hint *ngIf=\"hint\" [hint]=\"hint\"></app-hint>\n  <span *ngIf=\"labelDescription\" class=\"label-desc\">({{ labelDescription }})</span>\n</div>\n\n<div *ngIf=\"description\" class=\"description\">\n  {{ description }}\n</div>\n",
            styles: ["/*!\n * This file is part of the MedSafe application which is commercial software created by MedVision360 B.V.\n *  The source code is proprietary and confidential.\n *\n *  Unauthorized copying of this file, via any medium is strictly prohibited.\n *\n *  Copyright (c) by MedVision360 B.V. All rights reserved.\n *\n *  For the application name: io.medrecord.medsafe\n */:host{display:flex;align-items:center}:host.form-control-styles{margin-bottom:24px}.description{margin-left:10px}.input-wrapper{cursor:pointer;flex-shrink:0;position:relative;width:18px;height:18px;display:flex;justify-content:center;align-items:center}.input-placeholder{position:absolute;left:0;top:0;right:0;bottom:0;justify-content:center;align-items:center;display:flex;background:var(--white-color);border:2px solid var(--secondary-color);border-radius:3px}.input-placeholder path{fill:var(--white-color)}.input-placeholder circle{fill:var(--success-color);fill:var(--white-color)}.input-placeholder circle~path{fill:var(--success-color)}.input-placeholder rect~path{fill:var(--success-color);stroke:var(--white-color)}.input-placeholder rect~path+path{fill:var(--white-color)}.input-placeholder .inverted-stroke{stroke:var(--white-color)}.input-placeholder .inverted-fill{fill:var(--success-color)}.input-placeholder:hover path{fill:var(--white-hover-color)}.input-placeholder:hover circle{fill:var(--success-hover-color);fill:var(--white-hover-color)}.input-placeholder:hover circle~path{fill:var(--success-hover-color)}.input-placeholder:hover rect~path{fill:var(--success-hover-color);stroke:var(--white-hover-color)}.input-placeholder:hover rect~path+path{fill:var(--white-hover-color)}.input-placeholder:hover .inverted-stroke{stroke:var(--white-hover-color)}.input-placeholder:hover .inverted-fill{fill:var(--success-hover-color)}.input-placeholder:active path{fill:var(--white-pressed-color)}.input-placeholder:active circle{fill:var(--success-pressed-color);fill:var(--white-pressed-color)}.input-placeholder:active circle~path{fill:var(--success-pressed-color)}.input-placeholder:active rect~path{fill:var(--success-pressed-color);stroke:var(--white-pressed-color)}.input-placeholder:active rect~path+path{fill:var(--white-pressed-color)}.input-placeholder:active .inverted-stroke{stroke:var(--white-pressed-color)}.input-placeholder:active .inverted-fill{fill:var(--success-pressed-color)}.input-placeholder:focus path{fill:var(--white-pressed-color)}.input-placeholder:focus circle{fill:var(--success-pressed-color);fill:var(--white-pressed-color)}.input-placeholder:focus circle~path{fill:var(--success-pressed-color)}.input-placeholder:focus rect~path{fill:var(--success-pressed-color);stroke:var(--white-pressed-color)}.input-placeholder:focus rect~path+path{fill:var(--white-pressed-color)}.input-placeholder:focus .inverted-stroke{stroke:var(--white-pressed-color)}.input-placeholder:focus .inverted-fill{fill:var(--success-pressed-color)}.input-placeholder:disabled path{fill:var(--white-disabled-color)}.input-placeholder:disabled circle{fill:var(--success-disabled-color);fill:var(--white-disabled-color)}.input-placeholder:disabled circle~path{fill:var(--success-disabled-color)}.input-placeholder:disabled rect~path{fill:var(--success-disabled-color);stroke:var(--white-disabled-color)}.input-placeholder:disabled rect~path+path{fill:var(--white-disabled-color)}.input-placeholder:disabled .inverted-stroke{stroke:var(--white-disabled-color)}.input-placeholder:disabled .inverted-fill{fill:var(--success-disabled-color)}.input-placeholder:hover:not(.active){border-color:var(--primary-color);background:var(--white-color)}.active{border:1px solid var(--success-color);background:var(--success-color)}.label-wrapper{display:flex}.label-wrapper label{font-size:14px;font-weight:600;display:inline-block;line-height:1;cursor:pointer;margin-left:16px;margin-right:8px;margin-bottom:0}.label-wrapper app-hint{margin-left:5px;margin-right:10px}.label-wrapper .label-desc{font-weight:400}"]
        }),
        __param(0, Self()), __param(0, Optional())
    ], CheckboxComponent);
    return CheckboxComponent;
}());
export { CheckboxComponent };
//# sourceMappingURL=data:application/json;base64, 