@atlaskit/editor-plugin-block-menu/dist/es2019/blockMenuPlugin.js

BlockMenu plugin for @atlaskit/editor-core

import React from 'react';
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
import { createBlockMenuRegistry } from './editor-actions';
import { isTransformToTargetDisabled } from './editor-actions/isTransformToTargetDisabled';
import { transformNode } from './editor-commands/transformNode';
import { getBlockMenuExperiencesPlugin } from './pm-plugins/experiences/block-menu-experiences';
import { keymapPlugin } from './pm-plugins/keymap';
import { blockMenuPluginKey, createPlugin } from './pm-plugins/main';
import BlockMenu from './ui/block-menu';
import { getBlockMenuComponents } from './ui/block-menu-components';
import { BlockMenuProvider } from './ui/block-menu-provider';
import { Flag } from './ui/flag';
export const blockMenuPlugin = ({
  api,
  config
}) => {
  const registry = createBlockMenuRegistry();
  registry.register(getBlockMenuComponents({
    api,
    config
  }));
  const refs = {};
  return {
    name: 'blockMenu',
    pmPlugins() {
      return [{
        name: 'blockMenuPlugin',
        plugin: () => createPlugin(api)
      }, {
        name: 'blockMenuKeymap',
        plugin: () => keymapPlugin(api, config)
      }, ...(expValEqualsNoExposure('platform_editor_experience_tracking_observer', 'isEnabled', true) ? [{
        name: 'blockMenuExperiences',
        plugin: () => getBlockMenuExperiencesPlugin({
          refs,
          dispatchAnalyticsEvent: payload => {
            var _api$analytics, _api$analytics$action;
            return api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : (_api$analytics$action = _api$analytics.actions) === null || _api$analytics$action === void 0 ? void 0 : _api$analytics$action.fireAnalyticsEvent(payload);
          }
        })
      }] : [])];
    },
    actions: {
      registerBlockMenuComponents: blockMenuComponents => {
        registry.register(blockMenuComponents);
      },
      getBlockMenuComponents: () => {
        return registry.components;
      },
      isTransformOptionDisabled: (optionNodeTypeName, optionNodeTypeAttrs) => {
        var _api$blockControls, _api$blockControls$sh, _api$selection, _api$selection$shared, _api$selection$shared2;
        const preservedSelection = api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : (_api$blockControls$sh = _api$blockControls.sharedState.currentState()) === null || _api$blockControls$sh === void 0 ? void 0 : _api$blockControls$sh.preservedSelection;
        const selection = api === null || api === void 0 ? void 0 : (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : (_api$selection$shared = _api$selection.sharedState) === null || _api$selection$shared === void 0 ? void 0 : (_api$selection$shared2 = _api$selection$shared.currentState()) === null || _api$selection$shared2 === void 0 ? void 0 : _api$selection$shared2.selection;
        const currentSelection = preservedSelection || selection;
        if (!currentSelection) {
          return true;
        }
        return isTransformToTargetDisabled({
          selection: currentSelection,
          targetNodeTypeName: optionNodeTypeName,
          targetNodeTypeAttrs: optionNodeTypeAttrs
        });
      }
    },
    commands: {
      transformNode: (targetType, metadata) => {
        return transformNode(api)(targetType, metadata);
      }
    },
    getSharedState(editorState) {
      var _config$useStandardNo, _api$blockControls2, _api$blockControls2$s, _pluginState$showFlag;
      const useStandardNodeWidth = (_config$useStandardNo = config === null || config === void 0 ? void 0 : config.useStandardNodeWidth) !== null && _config$useStandardNo !== void 0 ? _config$useStandardNo : false;
      if (!editorState) {
        return {
          currentSelectedNodeName: undefined,
          showFlag: false,
          useStandardNodeWidth
        };
      }

      // Get the menuTriggerBy from blockControls plugin if available
      const currentSelectedNodeName = api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$s = _api$blockControls2.sharedState.currentState()) === null || _api$blockControls2$s === void 0 ? void 0 : _api$blockControls2$s.menuTriggerBy;

      // Get the showFlag from plugin state
      const pluginState = blockMenuPluginKey.getState(editorState);
      const showFlag = (_pluginState$showFlag = pluginState === null || pluginState === void 0 ? void 0 : pluginState.showFlag) !== null && _pluginState$showFlag !== void 0 ? _pluginState$showFlag : false;
      return {
        currentSelectedNodeName,
        showFlag,
        useStandardNodeWidth
      };
    },
    contentComponent({
      editorView,
      popupsMountPoint,
      popupsBoundariesElement,
      popupsScrollableElement
    }) {
      refs.popupsMountPoint = popupsMountPoint || undefined;
      return /*#__PURE__*/React.createElement(BlockMenuProvider, {
        api: api,
        editorView: editorView
      }, /*#__PURE__*/React.createElement(BlockMenu, {
        editorView: editorView,
        api: api,
        mountTo: popupsMountPoint,
        boundariesElement: popupsBoundariesElement,
        scrollableElement: popupsScrollableElement
      }), /*#__PURE__*/React.createElement(Flag, {
        api: api
      }));
    }
  };
};