@atlaskit/editor-common/dist/cjs/link/ConfigureLinkOverlay/Dropdown.js

A package that contains common classes and components for editor and renderer

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = require("react");
var _react2 = require("@emotion/react");
var _reactIntlNext = require("react-intl-next");
var _withAnalyticsContext = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsContext"));
var _dropdownMenu = _interopRequireWildcard(require("@atlaskit/dropdown-menu"));
var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
var _preferences = _interopRequireDefault(require("@atlaskit/icon/glyph/preferences"));
var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
var _messages = require("../../messages");
var _StyledButton = require("./StyledButton");
var _useLinkOverlayAnalyticsEvents = require("./useLinkOverlayAnalyticsEvents");
var _excluded = ["onClick", "triggerRef"];
/**
 * @jsxRuntime classic
 * @jsx jsx
 */
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
var SMALL_LINK_TOOLBAR_ANALYTICS_SOURCE = 'smallLinkToolbar';
var Dropdown = function Dropdown(_ref) {
  var onConfigureClickCallback = _ref.onConfigureClick,
    onOpenLinkClickCallback = _ref.onOpenLinkClick,
    onDropdownChange = _ref.onDropdownChange,
    editorView = _ref.editorView,
    testId = _ref.testId;
  var _useIntl = (0, _reactIntlNext.useIntl)(),
    formatMessage = _useIntl.formatMessage;
  var configureLinkLabel = formatMessage(_messages.cardMessages.inlineConfigureLink);
  var goToLinkLabel = formatMessage(_messages.cardMessages.inlineGoToLink);
  var _useLinkOverlayAnalyt = (0, _useLinkOverlayAnalyticsEvents.useLinkOverlayAnalyticsEvents)(),
    fireActionClickEvent = _useLinkOverlayAnalyt.fireActionClickEvent,
    fireLinkClickEvent = _useLinkOverlayAnalyt.fireLinkClickEvent,
    fireToolbarViewEvent = _useLinkOverlayAnalyt.fireToolbarViewEvent;
  var focusEditor = (0, _react.useCallback)(function () {
    // Fix dropdown giving focus back to the trigger async which is then unmounted and losing focus
    // this is happening deep within atlaskit dropdown as a result of this code: https://github.com/focus-trap/focus-trap/blob/master/index.js#L987
    // use setTimeout to run this async after that call
    setTimeout(function () {
      return editorView.focus();
    }, 0);
  }, [editorView]);
  var onOpenChange = (0, _react.useCallback)(function (_ref2) {
    var isOpen = _ref2.isOpen,
      event = _ref2.event;
    onDropdownChange === null || onDropdownChange === void 0 || onDropdownChange(isOpen);
    if (isOpen) {
      fireToolbarViewEvent();
    }
    if (!isOpen && event instanceof KeyboardEvent) {
      focusEditor();
    }
  }, [fireToolbarViewEvent, focusEditor, onDropdownChange]);
  var onGoToLinkClick = (0, _react.useCallback)(function (event) {
    fireActionClickEvent('goToLink');
    onOpenLinkClickCallback === null || onOpenLinkClickCallback === void 0 || onOpenLinkClickCallback(event);
    focusEditor();
  }, [fireActionClickEvent, focusEditor, onOpenLinkClickCallback]);
  var onConfigureClick = (0, _react.useCallback)(function () {
    fireActionClickEvent('configureLink');
    onConfigureClickCallback === null || onConfigureClickCallback === void 0 || onConfigureClickCallback();
    focusEditor();
  }, [fireActionClickEvent, focusEditor, onConfigureClickCallback]);
  return (0, _react2.jsx)(_dropdownMenu.default, {
    trigger: function trigger(_ref3) {
      var _onClick = _ref3.onClick,
        triggerRef = _ref3.triggerRef,
        props = (0, _objectWithoutProperties2.default)(_ref3, _excluded);
      return (0, _react2.jsx)(_StyledButton.StyledButton, (0, _extends2.default)({
        innerRef: triggerRef
        // Ignored via go/ees005
        // eslint-disable-next-line react/jsx-props-no-spreading
      }, props, {
        iconBefore: (0, _react2.jsx)(_chevronDown.default, {
          label: configureLinkLabel,
          size: 'small'
        }),
        onClick: function onClick(e) {
          _onClick === null || _onClick === void 0 || _onClick(e);
          fireLinkClickEvent();
        }
      }));
    },
    testId: "".concat(testId, "-dropdown"),
    onOpenChange: onOpenChange
  }, (0, _react2.jsx)(_dropdownMenu.DropdownItemGroup, null, (0, _react2.jsx)(_dropdownMenu.DropdownItem, {
    elemBefore: (0, _react2.jsx)(_shortcut.default, {
      label: goToLinkLabel,
      size: 'medium'
    }),
    testId: "".concat(testId, "-dropdown-item-open-link"),
    onClick: onGoToLinkClick
  }, goToLinkLabel), (0, _react2.jsx)(_dropdownMenu.DropdownItem, {
    elemBefore: (0, _react2.jsx)(_preferences.default, {
      label: configureLinkLabel,
      size: 'medium'
    }),
    onClick: onConfigureClick,
    testId: "".concat(testId, "-dropdown-item-configure")
  }, configureLinkLabel)));
};
var _default = exports.default = (0, _withAnalyticsContext.default)({
  source: SMALL_LINK_TOOLBAR_ANALYTICS_SOURCE
})(Dropdown);