@atlaskit/editor-plugin-media/dist/cjs/toolbar/layout-group.js

Media plugin for @atlaskit/editor-core

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.LayoutGroup = void 0;
var _react = require("@emotion/react");
var _button = require("@atlaskit/button");
var _ui = require("@atlaskit/editor-common/ui");
/** @jsx jsx */

var containerStyles = (0, _react.css)({
  marginLeft: "var(--ds-space-100, 8px)"
});
var LayoutGroup = exports.LayoutGroup = function LayoutGroup(_ref) {
  var layoutButtons = _ref.layoutButtons,
    dispatchCommand = _ref.dispatchCommand,
    hide = _ref.hide;
  return (0, _react.jsx)("div", {
    css: containerStyles
  }, (0, _react.jsx)(_button.ButtonGroup, null, layoutButtons.map(function (item, idx) {
    switch (item.type) {
      case 'separator':
        return (0, _react.jsx)(_ui.FloatingToolbarSeparator, {
          key: idx
        });
      case 'button':
        var ButtonIcon = item.icon;
        return (0, _react.jsx)(_ui.FloatingToolbarButton, {
          key: idx,
          icon: item.icon ? (0, _react.jsx)(ButtonIcon, {
            label: item.title
          }) : undefined,
          title: item.title,
          selected: item.selected,
          disabled: item.disabled,
          onClick: function onClick() {
            dispatchCommand(item.onClick);
            hide();
          }
        });
    }
  })));
};