import { Component, EventEmitter, Input, Output } from '@angular/core';
import { LoggerService } from 'dotcms-js/dotcms-js';
var InputToggle = (function () {
    function InputToggle(loggerService) {
        this.loggerService = loggerService;
        this.value = false;
        this.disabled = false;
        this.onText = 'On';
        this.offText = 'Off';
        this.change = new EventEmitter();
    }
    InputToggle.prototype.ngOnChanges = function (change) {
        if (change.value) {
            this.value = change.value.currentValue === true;
        }
    };
    InputToggle.prototype.updateValue = function ($event) {
        $event.stopPropagation(); // grrr.
        var value = $event.target.checked;
        this.loggerService.debug('InputToggle', 'updateValue', 'input value changed: [from / to]', this.value, value);
        this.value = value;
        this.change.emit(value);
    };
    return InputToggle;
}());
export { InputToggle };
InputToggle.decorators = [
    { type: Component, args: [{
                selector: 'cw-toggle-input',
                template: "<style>\n  .ui.toggle.checkbox label {\n    float: left\n  }\n\n  .on-label, .off-label {\n    position: absolute;\n    top: 0;\n    padding-top: .3em;\n    font-weight: 900;\n    font-size: 75%;\n    z-index: 2;\n  }\n\n  .on-label {\n    left: .75em;\n    color: white;\n  }\n\n  .off-label {\n    right: .75em;\n    color:#555;\n  }\n\n  .off .on-label, .on .off-label {\n    display: none;\n  }\n\n</style>\n  <span class=\"ui toggle fitted checkbox\" [class.on]=\"value === true\" [class.off]=\"value === false\">\n    <input type=\"checkbox\" [value]=\"value\" [checked]=\"value\" (change)=\"updateValue($event)\" [disabled]=\"disabled\">\n    <label></label>\n    <span class=\"on-label\">{{onText}}</span>\n    <span class=\"off-label\">{{offText}}</span>\n  </span>\n  "
            },] },
];
/** @nocollapse */
InputToggle.ctorParameters = function () { return [
    { type: LoggerService, },
]; };
InputToggle.propDecorators = {
    'value': [{ type: Input },],
    'disabled': [{ type: Input },],
    'onText': [{ type: Input },],
    'offText': [{ type: Input },],
    'change': [{ type: Output },],
};
//# sourceMappingURL=InputToggle.js.map