"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = exports.ToolbarButton = exports.DefaultToolbar = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _doneButton = require("./done-button");

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

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

var _slatePropTypes = _interopRequireDefault(require("slate-prop-types"));

var _utils = require("../utils");

var _styles = require("@material-ui/core/styles");

var _toolbarButtons = require("./toolbar-buttons");

var _debug = _interopRequireDefault(require("debug"));

var _immutable = require("immutable");

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

var log = (0, _debug["default"])('@pie-lib:editable-html:plugins:toolbar');

var ToolbarButton = function ToolbarButton(props) {
  var onToggle = function onToggle() {
    var c = props.onToggle(props.value.change(), props);
    props.onChange(c);
  };

  if (props.isMark) {
    var isActive = (0, _utils.hasMark)(props.value, props.type);
    log('[ToolbarButton] mark:isActive: ', isActive);
    return /*#__PURE__*/_react["default"].createElement(_toolbarButtons.MarkButton, {
      active: isActive,
      label: props.type,
      onToggle: onToggle,
      mark: props.type
    }, props.icon);
  } else {
    var disabled = props.disabled;

    var _isActive = props.isActive ? props.isActive(props.value, props.type) : (0, _utils.hasBlock)(props.value, props.type);

    log('[ToolbarButton] block:isActive: ', _isActive);
    return /*#__PURE__*/_react["default"].createElement(_toolbarButtons.Button, {
      active: _isActive,
      disabled: disabled,
      onClick: function onClick() {
        return props.onClick(props.value, props.onChange, props.getFocusedValue);
      },
      extraStyles: props.buttonStyles
    }, props.icon);
  }
};

exports.ToolbarButton = ToolbarButton;
ToolbarButton.propTypes = {
  buttonStyles: _propTypes["default"].object,
  disabled: _propTypes["default"].bool,
  icon: _propTypes["default"].any,
  isActive: _propTypes["default"].bool,
  isMark: _propTypes["default"].bool,
  getFocusedValue: _propTypes["default"].func,
  onToggle: _propTypes["default"].func,
  onChange: _propTypes["default"].func,
  onClick: _propTypes["default"].func,
  type: _propTypes["default"].string,
  value: _propTypes["default"].object
};

var isActiveToolbarPlugin = function isActiveToolbarPlugin(props) {
  return function (plugin) {
    var isDisabled = (props[plugin.name] || {}).disabled;
    return plugin && plugin.toolbar && !isDisabled;
  };
};

var DefaultToolbar = function DefaultToolbar(_ref) {
  var plugins = _ref.plugins,
      pluginProps = _ref.pluginProps,
      value = _ref.value,
      onChange = _ref.onChange,
      getFocusedValue = _ref.getFocusedValue,
      onDone = _ref.onDone,
      classes = _ref.classes,
      showDone = _ref.showDone,
      deletable = _ref.deletable,
      isHtmlMode = _ref.isHtmlMode;
  pluginProps = _objectSpread({
    // disable HTML plugin by default, at least for now
    html: {
      disabled: true
    }
  }, pluginProps);
  var filtered;

  if (isHtmlMode) {
    filtered = plugins.filter(function (plugin) {
      return isActiveToolbarPlugin(pluginProps)(plugin) && (plugin.name === 'characters' || plugin.name === 'html');
    }).map(function (p) {
      return p.toolbar;
    });
  } else {
    filtered = plugins.filter(isActiveToolbarPlugin(pluginProps)).map(function (p) {
      return p.toolbar;
    });
  }

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: classes.defaultToolbar
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: classes.buttonsContainer
  }, filtered.map(function (p, index) {
    return /*#__PURE__*/_react["default"].createElement(ToolbarButton, (0, _extends2["default"])({}, p, {
      key: index,
      value: value,
      onChange: onChange,
      getFocusedValue: getFocusedValue
    }));
  })), showDone && !deletable && !isHtmlMode && /*#__PURE__*/_react["default"].createElement(_doneButton.DoneButton, {
    onClick: onDone
  }));
};

exports.DefaultToolbar = DefaultToolbar;
DefaultToolbar.propTypes = {
  classes: _propTypes["default"].object.isRequired,
  plugins: _propTypes["default"].array.isRequired,
  pluginProps: _propTypes["default"].object,
  value: _slatePropTypes["default"].value.isRequired,
  onChange: _propTypes["default"].func.isRequired,
  getFocusedValue: _propTypes["default"].func.isRequired,
  onDone: _propTypes["default"].func.isRequired,
  showDone: _propTypes["default"].bool,
  addArea: _propTypes["default"].bool,
  deletable: _propTypes["default"].bool
};
DefaultToolbar.defaultProps = {
  pluginProps: {}
};

var toolbarStyles = function toolbarStyles() {
  return {
    defaultToolbar: {
      display: 'flex',
      width: '100%',
      justifyContent: 'space-between'
    },
    buttonsContainer: {
      alignItems: 'center',
      display: 'flex',
      width: '100%'
    }
  };
};

var _default = (0, _styles.withStyles)(toolbarStyles)(DefaultToolbar);

exports["default"] = _default;
//# sourceMappingURL=default-toolbar.js.map