@atlaskit/editor-plugin-block-menu/dist/esm/ui/flag.js

BlockMenu plugin for @atlaskit/editor-core

import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';
import { useIntl } from 'react-intl';
import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
import { blockMenuMessages as messages } from '@atlaskit/editor-common/messages';
import AkFlag, { FlagGroup, AutoDismissFlag } from '@atlaskit/flag';
import SuccessIcon from '@atlaskit/icon/core/check-circle';
import { FLAG_ID } from '../blockMenuPluginType';
import { blockMenuPluginKey } from '../pm-plugins/main';
var flagMap = _defineProperty({}, FLAG_ID.LINK_COPIED_TO_CLIPBOARD, {
  title: messages.linkCopiedToClipboard,
  autoDismiss: true
});
export var Flag = function Flag(_ref) {
  var api = _ref.api;
  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['blockMenu'], function (states) {
      var _states$blockMenuStat;
      return {
        showFlag: (_states$blockMenuStat = states.blockMenuState) === null || _states$blockMenuStat === void 0 ? void 0 : _states$blockMenuStat.showFlag
      };
    }),
    showFlag = _useSharedPluginState.showFlag;
  var _useIntl = useIntl(),
    formatMessage = _useIntl.formatMessage;
  if (!showFlag) {
    return;
  }
  var title = flagMap[showFlag].title;
  var onDismissed = function onDismissed() {
    api === null || api === void 0 || api.core.actions.execute(function (_ref2) {
      var tr = _ref2.tr;
      tr.setMeta(blockMenuPluginKey, {
        showFlag: false
      });
      return tr;
    });
    api === null || api === void 0 || api.core.actions.focus();
  };
  var FlagComponent = flagMap[showFlag].autoDismiss ? AutoDismissFlag : AkFlag;
  return /*#__PURE__*/React.createElement(FlagGroup, null, /*#__PURE__*/React.createElement(FlagComponent, {
    onDismissed: onDismissed,
    title: formatMessage(title),
    id: showFlag,
    testId: showFlag,
    icon: /*#__PURE__*/React.createElement(SuccessIcon, {
      label: "",
      color: "var(--ds-icon-success, #6A9A23)",
      size: "small"
    })
  }));
};