define(["require", "exports", "tslib", "react", "../../Utilities", "../../Icon", "../../Utilities", "./Checkbox.classNames", "./Checkbox.styles"], function (require, exports, tslib_1, React, Utilities_1, Icon_1, Utilities_2, Checkbox_classNames_1, Checkbox_styles_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Checkbox = (function (_super) {
        tslib_1.__extends(Checkbox, _super);
        /**
         * Initialize a new instance of the TopHeaderV2
         * @param props Props for the component
         * @param context Context or initial state for the base component.
         */
        function Checkbox(props, context) {
            var _this = _super.call(this, props, context) || this;
            _this._warnMutuallyExclusive({
                'checked': 'defaultChecked'
            });
            _this._id = Utilities_1.getId('checkbox-');
            _this.state = {
                isChecked: !!(props.checked !== undefined ? props.checked : props.defaultChecked)
            };
            return _this;
        }
        Checkbox.prototype.componentWillReceiveProps = function (newProps) {
            if (newProps.checked !== undefined) {
                this.setState({
                    isChecked: !!newProps.checked // convert null to false
                });
            }
        };
        /**
         * Render the Checkbox based on passed props
         */
        Checkbox.prototype.render = function () {
            var _a = this.props, checked = _a.checked, className = _a.className, defaultChecked = _a.defaultChecked, disabled = _a.disabled, inputProps = _a.inputProps, name = _a.name, boxSide = _a.boxSide, theme = _a.theme, ariaLabel = _a.ariaLabel, ariaLabelledBy = _a.ariaLabelledBy, ariaDescribedBy = _a.ariaDescribedBy, customStyles = _a.styles, _b = _a.onRenderLabel, onRenderLabel = _b === void 0 ? this._onRenderLabel : _b;
            var isChecked = checked === undefined ? this.state.isChecked : checked;
            var isReversed = boxSide !== 'start' ? true : false;
            this._classNames = Checkbox_classNames_1.getClassNames(Checkbox_styles_1.getStyles(theme, customStyles), className, disabled, isChecked, isReversed);
            return (React.createElement("button", tslib_1.__assign({}, inputProps, (checked !== undefined && { checked: checked }), (defaultChecked !== undefined && { defaultChecked: defaultChecked }), { disabled: disabled, ref: this._resolveRef('_checkBox'), name: name, id: this._id, role: 'checkbox', type: 'button', className: this._classNames.root, onClick: this._onClick, onFocus: this._onFocus, onBlur: this._onBlur, "aria-checked": isChecked, "aria-disabled": disabled, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy }),
                React.createElement("label", { className: this._classNames.label, htmlFor: this._id },
                    React.createElement("div", { className: this._classNames.checkbox },
                        React.createElement(Icon_1.Icon, { iconName: 'CheckMark', className: this._classNames.checkmark })),
                    onRenderLabel(this.props, this._onRenderLabel))));
        };
        Object.defineProperty(Checkbox.prototype, "checked", {
            get: function () {
                return this.state.isChecked;
            },
            enumerable: true,
            configurable: true
        });
        Checkbox.prototype.focus = function () {
            if (this._checkBox) {
                this._checkBox.focus();
            }
        };
        Checkbox.prototype._onFocus = function (ev) {
            var inputProps = this.props.inputProps;
            if (inputProps && inputProps.onFocus) {
                inputProps.onFocus(ev);
            }
        };
        Checkbox.prototype._onBlur = function (ev) {
            var inputProps = this.props.inputProps;
            if (inputProps && inputProps.onBlur) {
                inputProps.onBlur(ev);
            }
        };
        Checkbox.prototype._onClick = function (ev) {
            var _a = this.props, disabled = _a.disabled, onChange = _a.onChange;
            var isChecked = this.state.isChecked;
            ev.preventDefault();
            ev.stopPropagation();
            if (!disabled) {
                if (onChange) {
                    onChange(ev, !isChecked);
                }
                if (this.props.checked === undefined) {
                    this.setState({ isChecked: !isChecked });
                }
            }
        };
        Checkbox.prototype._onRenderLabel = function (props) {
            var label = props.label;
            return label ? (React.createElement("span", { className: this._classNames.text }, label)) : (null);
        };
        Checkbox.defaultProps = {
            boxSide: 'start'
        };
        tslib_1.__decorate([
            Utilities_1.autobind
        ], Checkbox.prototype, "_onFocus", null);
        tslib_1.__decorate([
            Utilities_1.autobind
        ], Checkbox.prototype, "_onBlur", null);
        tslib_1.__decorate([
            Utilities_1.autobind
        ], Checkbox.prototype, "_onClick", null);
        tslib_1.__decorate([
            Utilities_1.autobind
        ], Checkbox.prototype, "_onRenderLabel", null);
        Checkbox = tslib_1.__decorate([
            Utilities_2.customizable('Checkbox', ['theme'])
        ], Checkbox);
        return Checkbox;
    }(Utilities_1.BaseComponent));
    exports.Checkbox = Checkbox;
});
//# sourceMappingURL=Checkbox.js.map