@lyra/components/lib/toggles/ToggleButton.js

Basic UX components

'use strict';

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

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _buttonStyle = require('part:@lyra/components/toggles/button-style');

var _buttonStyle2 = _interopRequireDefault(_buttonStyle);

var _default = require('part:@lyra/components/buttons/default');

var _default2 = _interopRequireDefault(_default);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

class ToggleButton extends _react2.default.Component {

  render() {
    var _props = this.props;
    const disabled = _props.disabled,
          selected = _props.selected,
          icon = _props.icon,
          className = _props.className,
          title = _props.title;

    const buttonClasses = `
      ${selected ? _buttonStyle2.default.selected : _buttonStyle2.default.unSelected}
      ${className}
    `;
    return _react2.default.createElement(
      _default2.default,
      {
        className: buttonClasses,
        icon: icon,
        title: title,
        disabled: disabled,
        onClick: this.props.onClick,
        kind: 'simple'
      },
      this.props.children
    );
  }
}
exports.default = ToggleButton;
ToggleButton.propTypes = {
  icon: _propTypes2.default.func,
  onClick: _propTypes2.default.func.isRequired,
  selected: _propTypes2.default.bool,
  disabled: _propTypes2.default.bool,
  children: _propTypes2.default.node,
  className: _propTypes2.default.string,
  title: _propTypes2.default.string
};
ToggleButton.defaultProps = {
  className: '',
  disabled: false
};