megadraft/lib/components/ToolbarItem.js

Rich Text editor built on top of draft.js

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = ToolbarItem;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _Separator = _interopRequireDefault(require("./Separator"));

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

/*
 * Copyright (c) 2016, Globo.com (https://github.com/globocom)
 *
 * License: MIT
 */
function ToolbarItem(_ref) {
  var item = _ref.item,
      active = _ref.active,
      toggle = _ref.toggle;
  var Icon = item.icon;
  var className = (0, _classnames["default"])("toolbar__item", {
    "toolbar__item--active": active
  });

  function toggleAction() {
    if (toggle) {
      toggle(!active);
    }
  }

  if (item.type == "separator") {
    return /*#__PURE__*/_react["default"].createElement(_Separator["default"], null);
  }

  return /*#__PURE__*/_react["default"].createElement("li", {
    className: className
  }, /*#__PURE__*/_react["default"].createElement("button", {
    onClick: function onClick() {
      return toggleAction();
    },
    type: "button",
    className: "toolbar__button"
  }, /*#__PURE__*/_react["default"].createElement(Icon, null)));
}

ToolbarItem.propTypes = {
  item: _propTypes["default"].shape({
    type: _propTypes["default"].string.isRequired,
    label: _propTypes["default"].string,
    icon: _propTypes["default"].func.isRequired,
    style: _propTypes["default"].string
  }),
  active: _propTypes["default"].bool,
  toggle: _propTypes["default"].func
};