@atlaskit/editor-plugin-insert-block/dist/esm/plugin.js

import React, { useLayoutEffect } from 'react';
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
import { WithProviders } from '@atlaskit/editor-common/provider-factory';
import { ToolbarSize } from '@atlaskit/editor-common/types';
import { BLOCK_QUOTE, CODE_BLOCK, PANEL } from '@atlaskit/editor-plugin-block-type/consts';
import ToolbarInsertBlock from './ui/ToolbarInsertBlock';
var toolbarSizeToButtons = function toolbarSizeToButtons(toolbarSize) {
  switch (toolbarSize) {
    case ToolbarSize.XXL:
    case ToolbarSize.XL:
    case ToolbarSize.L:
    case ToolbarSize.M:
      return 7;
    case ToolbarSize.S:
      return 2;
    default:
      return 0;
  }
};
/**
 * Wrapper over insertBlockTypeWithAnalytics to autobind toolbar input method
 * @param name Block name
 */
function handleInsertBlockType(insertCodeBlock, insertPanel, insertBlockQuote) {
  return function (name) {
    if (name === CODE_BLOCK.name && insertCodeBlock) {
      return insertCodeBlock(INPUT_METHOD.TOOLBAR);
    }
    if (name === PANEL.name && insertPanel) {
      return insertPanel(INPUT_METHOD.TOOLBAR);
    }
    if (name === BLOCK_QUOTE.name && insertBlockQuote) {
      return insertBlockQuote(INPUT_METHOD.TOOLBAR);
    }
    return function () {
      return false;
    };
  };
}
export var insertBlockPlugin = function insertBlockPlugin(_ref) {
  var _ref$config = _ref.config,
    options = _ref$config === void 0 ? {} : _ref$config,
    api = _ref.api;
  var toggleDropdownMenuOptionsRef = {
    current: null
  };
  var registerToggleDropdownMenuOptions = function registerToggleDropdownMenuOptions(cb) {
    toggleDropdownMenuOptionsRef.current = cb;
    return function () {
      toggleDropdownMenuOptionsRef.current = null;
    };
  };
  return {
    name: 'insertBlock',
    actions: {
      toggleAdditionalMenu: function toggleAdditionalMenu() {
        var toggle = toggleDropdownMenuOptionsRef.current;
        if (!toggle) {
          return;
        }
        toggle();
      }
    },
    usePluginHook: function usePluginHook() {
      useLayoutEffect(function () {
        return function () {
          toggleDropdownMenuOptionsRef.current = null;
        };
      }, []);
    },
    primaryToolbarComponent: function primaryToolbarComponent(_ref2) {
      var editorView = _ref2.editorView,
        editorActions = _ref2.editorActions,
        dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent,
        providerFactory = _ref2.providerFactory,
        popupsMountPoint = _ref2.popupsMountPoint,
        popupsBoundariesElement = _ref2.popupsBoundariesElement,
        popupsScrollableElement = _ref2.popupsScrollableElement,
        toolbarSize = _ref2.toolbarSize,
        disabled = _ref2.disabled,
        isToolbarReducedSpacing = _ref2.isToolbarReducedSpacing,
        isLastItem = _ref2.isLastItem;
      var renderNode = function renderNode(providers) {
        return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
          pluginInjectionApi: api,
          editorView: editorView,
          editorActions: editorActions,
          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
          providerFactory: providerFactory,
          popupsMountPoint: popupsMountPoint,
          popupsBoundariesElement: popupsBoundariesElement,
          popupsScrollableElement: popupsScrollableElement,
          toolbarSize: toolbarSize,
          disabled: disabled,
          isToolbarReducedSpacing: isToolbarReducedSpacing,
          isLastItem: isLastItem,
          providers: providers,
          options: options,
          registerToggleDropdownMenuOptions: registerToggleDropdownMenuOptions
        });
      };
      return /*#__PURE__*/React.createElement(WithProviders, {
        providerFactory: providerFactory,
        providers: ['emojiProvider'],
        renderNode: renderNode
      });
    }
  };
};
function ToolbarInsertBlockWithInjectionApi(_ref3) {
  var _ref4, _ref5, _pluginInjectionApi$i, _pluginInjectionApi$c, _pluginInjectionApi$p, _pluginInjectionApi$b, _pluginInjectionApi$e;
  var editorView = _ref3.editorView,
    editorActions = _ref3.editorActions,
    dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
    popupsMountPoint = _ref3.popupsMountPoint,
    popupsBoundariesElement = _ref3.popupsBoundariesElement,
    popupsScrollableElement = _ref3.popupsScrollableElement,
    toolbarSize = _ref3.toolbarSize,
    disabled = _ref3.disabled,
    isToolbarReducedSpacing = _ref3.isToolbarReducedSpacing,
    isLastItem = _ref3.isLastItem,
    providers = _ref3.providers,
    pluginInjectionApi = _ref3.pluginInjectionApi,
    options = _ref3.options,
    registerToggleDropdownMenuOptions = _ref3.registerToggleDropdownMenuOptions;
  var buttons = toolbarSizeToButtons(toolbarSize);
  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media', 'typeAhead', 'placeholderText']),
    dateState = _useSharedPluginState.dateState,
    hyperlinkState = _useSharedPluginState.hyperlinkState,
    imageUploadState = _useSharedPluginState.imageUploadState,
    mentionState = _useSharedPluginState.mentionState,
    emojiState = _useSharedPluginState.emojiState,
    blockTypeState = _useSharedPluginState.blockTypeState,
    mediaState = _useSharedPluginState.mediaState,
    typeAheadState = _useSharedPluginState.typeAheadState,
    placeholderTextState = _useSharedPluginState.placeholderTextState;
  return /*#__PURE__*/React.createElement(ToolbarInsertBlock, {
    pluginInjectionApi: pluginInjectionApi,
    buttons: buttons,
    isReducedSpacing: isToolbarReducedSpacing,
    isDisabled: disabled,
    isTypeAheadAllowed: Boolean(typeAheadState === null || typeAheadState === void 0 ? void 0 : typeAheadState.isAllowed),
    editorView: editorView,
    tableSupported: !!editorView.state.schema.nodes.table,
    tableSelectorSupported: options.tableSelectorSupported && !!editorView.state.schema.nodes.table,
    actionSupported: !!editorView.state.schema.nodes.taskItem,
    mentionsSupported: !!(mentionState && mentionState.mentionProvider),
    mentionsDisabled: !!(mentionState && !mentionState.canInsertMention),
    decisionSupported: !!editorView.state.schema.nodes.decisionItem,
    dateEnabled: !!dateState,
    placeholderTextEnabled: placeholderTextState && placeholderTextState.allowInserting,
    layoutSectionEnabled: Boolean(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.layout),
    expandEnabled: !!options.allowExpand,
    mediaUploadsEnabled: (_ref4 = mediaState && mediaState.allowsUploads) !== null && _ref4 !== void 0 ? _ref4 : undefined,
    onShowMediaPicker: (_ref5 = mediaState && mediaState.showMediaPicker) !== null && _ref5 !== void 0 ? _ref5 : undefined,
    mediaSupported: !!mediaState,
    imageUploadSupported: !!(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.imageUpload),
    imageUploadEnabled: imageUploadState === null || imageUploadState === void 0 ? void 0 : imageUploadState.enabled,
    handleImageUpload: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$i = pluginInjectionApi.imageUpload) === null || _pluginInjectionApi$i === void 0 ? void 0 : _pluginInjectionApi$i.actions.startUpload,
    availableWrapperBlockTypes: blockTypeState && blockTypeState.availableWrapperBlockTypes,
    linkSupported: !!hyperlinkState,
    linkDisabled: !hyperlinkState || !hyperlinkState.canInsertLink || !!hyperlinkState.activeLinkMark,
    emojiDisabled: !emojiState || !providers.emojiProvider,
    emojiProvider: providers.emojiProvider,
    nativeStatusSupported: options.nativeStatusSupported,
    horizontalRuleEnabled: options.horizontalRuleEnabled,
    onInsertBlockType: handleInsertBlockType(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.codeBlock) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.actions.insertCodeBlock, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$p = pluginInjectionApi.panel) === null || _pluginInjectionApi$p === void 0 ? void 0 : _pluginInjectionApi$p.actions.insertPanel, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$b = pluginInjectionApi.blockType) === null || _pluginInjectionApi$b === void 0 ? void 0 : _pluginInjectionApi$b.actions.insertBlockQuote),
    onInsertMacroFromMacroBrowser: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$e = pluginInjectionApi.extension) === null || _pluginInjectionApi$e === void 0 ? void 0 : _pluginInjectionApi$e.actions.insertMacroFromMacroBrowser,
    popupsMountPoint: popupsMountPoint,
    popupsBoundariesElement: popupsBoundariesElement,
    popupsScrollableElement: popupsScrollableElement,
    insertMenuItems: options.insertMenuItems,
    editorActions: editorActions,
    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
    replacePlusMenuWithElementBrowser: options.replacePlusMenuWithElementBrowser,
    showElementBrowserLink: options.showElementBrowserLink,
    showSeparator: !isLastItem && toolbarSize <= ToolbarSize.S,
    registerToggleDropdownMenuOptions: registerToggleDropdownMenuOptions
  });
}