text: "use strict";
  Object.defineProperty(exports, "__esModule", { value: true });
  var tslib_1 = require("tslib");
  var React = require("react");
  var Utilities_1 = require("../../Utilities");
  var Icon_1 = require("../../Icon");
  var KeytipData_1 = require("../../KeytipData");
  var getClassNames = Utilities_1.classNamesFunction();
  var CheckboxBase = /** @class */ (function (_super) {
      tslib_1.__extends(CheckboxBase, _super);
      /**
       * Initialize a new instance of the Checkbox
       * @param props - Props for the component
       * @param context - Context or initial state for the base component.
       */
      function CheckboxBase(props, context) {
          var _this = _super.call(this, props, context) || this;
          _this._checkBox = React.createRef();
          _this._onFocus = function (ev) {
              var inputProps = _this.props.inputProps;
              if (inputProps && inputProps.onFocus) {
                  inputProps.onFocus(ev);
              }
          };
          _this._onBlur = function (ev) {
              var inputProps = _this.props.inputProps;
              if (inputProps && inputProps.onBlur) {
                  inputProps.onBlur(ev);
              }
          };
          _this._onChange = function (ev) {
              var _a = _this.props, disabled = _a.disabled, onChange = _a.onChange;
              var isChecked = _this.state.isChecked;
              if (!disabled) {
                  if (onChange) {
                      onChange(ev, !isChecked);
                  }
                  if (_this.props.checked === undefined) {
                      _this.setState({ isChecked: !isChecked });
                  }
              }
          };
          _this._onRenderLabel = function (props) {
              var label = props.label;
              return label ? React.createElement("span", { className: _this._classNames.text }, label) : null;
          };
          _this._warnMutuallyExclusive({
              checked: 'defaultChecked'
          });
          _this._id = _this.props.id || Utilities_1.getId('checkbox-');
          _this.state = {
              isChecked: !!(props.checked !== undefined ? props.checked : props.defaultChecked)
          };
          return _this;
      }
      CheckboxBase.prototype.componentWillReceiveProps = function (newProps) {
          if (newProps.checked !== undefined) {
              this.setState({
                  isChecked: !!newProps.checked // convert null to false
              });
          }
      };
      /**
       * Render the Checkbox based on passed props
       */
      CheckboxBase.prototype.render = function () {
          var _this = this;
          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, styles = _a.styles, _b = _a.onRenderLabel, onRenderLabel = _b === void 0 ? this._onRenderLabel : _b, checkmarkIconProps = _a.checkmarkIconProps, ariaPositionInSet = _a.ariaPositionInSet, ariaSetSize = _a.ariaSetSize, keytipProps = _a.keytipProps, title = _a.title;
          var isChecked = checked === undefined ? this.state.isChecked : checked;
          var isReversed = boxSide !== 'start' ? true : false;
          this._classNames = getClassNames(styles, {
              theme: theme,
              className: className,
              disabled: disabled,
              checked: isChecked,
              reversed: isReversed,
              isUsingCustomLabelRender: onRenderLabel !== this._onRenderLabel
          });
          return (React.createElement(KeytipData_1.KeytipData, { keytipProps: keytipProps, disabled: disabled }, function (keytipAttributes) { return (React.createElement("div", { className: _this._classNames.root },
              React.createElement("input", tslib_1.__assign({ type: "checkbox" }, inputProps, { "data-ktp-execute-target": keytipAttributes['data-ktp-execute-target'] }, checked !== undefined && { checked: checked }, defaultChecked !== undefined && { defaultChecked: defaultChecked }, { disabled: disabled, className: _this._classNames.input, ref: _this._checkBox, name: name, id: _this._id, title: title, onChange: _this._onChange, onFocus: _this._onFocus, onBlur: _this._onBlur, "aria-disabled": disabled, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": Utilities_1.mergeAriaAttributeValues(ariaDescribedBy, keytipAttributes['aria-describedby']), "aria-posinset": ariaPositionInSet, "aria-setsize": ariaSetSize })),
              React.createElement("label", { className: _this._classNames.label, htmlFor: _this._id },
                  React.createElement("div", { className: _this._classNames.checkbox, "data-ktp-target": keytipAttributes['data-ktp-target'] },
                      React.createElement(Icon_1.Icon, tslib_1.__assign({ iconName: "CheckMark" }, checkmarkIconProps, { className: _this._classNames.checkmark }))),
                  onRenderLabel(_this.props, _this._onRenderLabel)))); }));
      };
      Object.defineProperty(CheckboxBase.prototype, "checked", {
          get: function () {
              return this.state.isChecked;
          },
          enumerable: true,
          configurable: true
      });
      CheckboxBase.prototype.focus = function () {
          if (this._checkBox.current) {
              this._checkBox.current.focus();
          }
      };
      CheckboxBase.defaultProps = {
          boxSide: 'start'
      };
      return CheckboxBase;
  }(Utilities_1.BaseComponent));
  exports.CheckboxBase = CheckboxBase;
  //# sourceMappingURL=Checkbox.base.js.map