import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["disabled"];
/** @jsx jsx */
import React from 'react';
import { css, jsx } from '@emotion/react';
import { ButtonGroup } from '@atlaskit/button';
import { FloatingToolbarButton as Button } from '../ui';

/**
 * Applying `pointer-events: none;` when disabled allows the Tooltip to be displayed
 */
var buttonStyle = css({
  pointerEvents: 'auto'
});
var buttonStyleNoneEvent = css({
  pointerEvents: 'none'
});
var DisallowedWrapper = function DisallowedWrapper(_ref) {
  var disabled = _ref.disabled,
    props = _objectWithoutProperties(_ref, _excluded);
  return jsx("div", props);
};

/**
 * The button requires `pointer-events: none;` in order to fix the tooltip, hence
 * leaving us without a disabled cursor, the following fixes this:
 */
var defaultWrapperStyle = css({
  cursor: 'pointer'
});
var disallowedWrapperStyle = css({
  cursor: 'not-allowed'
});
export var LinkToolbarButtonGroup = function LinkToolbarButtonGroup(_ref2) {
  var options = _ref2.options;
  return jsx(ButtonGroup, null, options.map(function (_ref3) {
    var onClick = _ref3.onClick,
      selected = _ref3.selected,
      disabled = _ref3.disabled,
      testId = _ref3.testId,
      tooltipContent = _ref3.tooltipContent,
      title = _ref3.title,
      Icon = _ref3.icon;
    return jsx(DisallowedWrapper, {
      css: disabled ? disallowedWrapperStyle : defaultWrapperStyle,
      key: testId,
      disabled: disabled
    }, jsx(Button, {
      css: disabled ? buttonStyleNoneEvent : buttonStyle,
      title: title,
      icon: jsx(Icon, {
        size: "medium",
        label: title
      }),
      selected: selected,
      onClick: onClick,
      testId: testId,
      disabled: disabled,
      tooltipContent: tooltipContent
    }));
  }));
};