UNPKG

@atlaskit/editor-plugin-insert-block

Version:

Insert block plugin for @atlaskit/editor-core

64 lines (62 loc) • 4.11 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.MentionButton = void 0; var _react = _interopRequireDefault(require("react")); var _reactIntl = require("react-intl"); var _enums = require("@atlaskit/editor-common/analytics/types/enums"); var _keymaps = require("@atlaskit/editor-common/keymaps"); var _insertBlock = require("@atlaskit/editor-common/messages/insert-block"); var _keys = require("@atlaskit/editor-common/toolbar/keys"); var _useSharedPluginStateWithSelector = require("@atlaskit/editor-common/useSharedPluginStateWithSelector"); var _mentionIcon = require("@atlaskit/editor-toolbar/mention-icon"); var _toolbarButton = require("@atlaskit/editor-toolbar/toolbar-button"); var _toolbarTooltip = require("@atlaskit/editor-toolbar/toolbar-tooltip"); var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled"); var MentionButton = exports.MentionButton = function MentionButton(_ref) { var api = _ref.api; var _useIntl = (0, _reactIntl.useIntl)(), formatMessage = _useIntl.formatMessage; var _useSharedPluginState = (0, _useSharedPluginStateWithSelector.useSharedPluginStateWithSelector)(api, ['mention', 'typeAhead'], function (states) { var _states$mentionState, _states$mentionState2, _states$mentionState3, _states$typeAheadStat; return { canInsertMention: (_states$mentionState = states.mentionState) === null || _states$mentionState === void 0 ? void 0 : _states$mentionState.canInsertMention, mentionProvider: (_states$mentionState2 = states.mentionState) === null || _states$mentionState2 === void 0 ? void 0 : _states$mentionState2.mentionProvider, mentionProviderStatus: (_states$mentionState3 = states.mentionState) === null || _states$mentionState3 === void 0 ? void 0 : _states$mentionState3.mentionProviderStatus, hasMentionState: states.mentionState !== undefined, isTypeAheadAllowed: (_states$typeAheadStat = states.typeAheadState) === null || _states$typeAheadStat === void 0 ? void 0 : _states$typeAheadStat.isAllowed }; }), canInsertMention = _useSharedPluginState.canInsertMention, mentionProvider = _useSharedPluginState.mentionProvider, mentionProviderStatus = _useSharedPluginState.mentionProviderStatus, hasMentionState = _useSharedPluginState.hasMentionState, isTypeAheadAllowed = _useSharedPluginState.isTypeAheadAllowed; if (!(api !== null && api !== void 0 && api.mention)) { return null; } var onClick = function onClick() { var _api$mention; api === null || api === void 0 || (_api$mention = api.mention) === null || _api$mention === void 0 || (_api$mention = _api$mention.actions) === null || _api$mention === void 0 || _api$mention.openTypeAhead(_enums.INPUT_METHOD.TOOLBAR); }; // The SSR state cannot resolve providers. Keep pending and available visually identical, // while preserving known selection restrictions and settled provider failures. var isDisabled = (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_ssr_toolbar_optimistic') ? canInsertMention === false || hasMentionState && isTypeAheadAllowed === false || mentionProviderStatus !== 'pending' && hasMentionState && !mentionProvider : !canInsertMention || !mentionProvider || !isTypeAheadAllowed; return /*#__PURE__*/_react.default.createElement(_toolbarTooltip.ToolbarTooltip, { content: /*#__PURE__*/_react.default.createElement(_keymaps.ToolTipContent, { description: formatMessage(_insertBlock.toolbarInsertBlockMessages.mention), keymap: _keymaps.insertMention }) }, /*#__PURE__*/_react.default.createElement(_toolbarButton.ToolbarButton, { iconBefore: /*#__PURE__*/_react.default.createElement(_mentionIcon.MentionIcon, { label: formatMessage(_insertBlock.toolbarInsertBlockMessages.mention), size: "small" }), onClick: onClick, ariaKeyshortcuts: "Shift+2 Space", isDisabled: isDisabled, testId: _keys.TOOLBAR_BUTTON_TEST_ID.MENTION })); };