"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");
/**
 * @todo make sure interface is same as Toggle
 */


const react_1 = tslib_1.__importDefault(require("react"));

const mobx_react_1 = require("xmobx/mobx-react");

const exotic_1 = require("exotic");

const Icons_1 = require("../../atoms/Icons");

const common_1 = require("../../../state/common");

const styled_1 = require("./styled");

const renderProps_1 = require("./renderProps");

let Switch = class Switch extends react_1.default.Component {
  constructor() {
    super(...arguments);
    this.observableState = common_1.toCommonState(this.props);

    this.handleClick = event => {
      this.observableState.handleToggleSelected();

      if (exotic_1.isFunction(this.props.onToggle)) {
        // @todo @james
        // we can just pass in observableState, but the reference-store commonState is missing label
        // this.props.onToggle(this.observableState)
        const args = {
          isSelected: this.observableState.isSelected,
          label: this.props.label,
          state: this.observableState
        };
        this.props.onToggle(args);
      }
    };
  }
  /**
   * @todo link to example where putting it in the render method patched a problem of it not updating
   */


  render() {
    const {
      className,
      renderWrap
    } = this.props;
    const attributes = {
      className,
      isSelected: this.observableState.isSelected,
      onClick: this.handleClick
    };
    /**
     * @todo this is not a real label, need to be able to click a label and toggle the form input (in this case, the checkbox)
     * @todo renderLabel
     */

    const switchLabelView = react_1.default.createElement(styled_1.SwitchLabel, {
      isSelected: this.observableState.isSelected
    }, this.observableState.isSelected ? 'ON' : 'OFF');
    /**
     * @todo renderWrap
     */

    const switchView = react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement(Icons_1.SwitchIcon, Object.assign({}, attributes)), switchLabelView);
    return renderWrap(Object.assign({}, attributes, {
      children: switchView
    }));
  }

};
Switch.defaultProps = {
  className: '',
  renderWrap: renderProps_1.defaultRenderWrap
};
Switch = tslib_1.__decorate([mobx_react_1.observer], Switch);
exports.Switch = Switch;
exports.default = Switch; //# sourceMappingURL=Switch.js.map