@atlaskit/editor-plugin-find-replace/dist/esm/findReplacePlugin.js

find replace plugin for @atlaskit/editor-core

import React from 'react';
import { TRIGGER_METHOD } from '@atlaskit/editor-common/analytics';
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
import { ToolbarSize } from '@atlaskit/editor-common/types';
import { fg } from '@atlaskit/platform-feature-flags';
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
import { activate } from './pm-plugins/commands';
import { activateWithAnalytics } from './pm-plugins/commands-with-analytics';
import keymapPlugin from './pm-plugins/keymap';
import { createPlugin } from './pm-plugins/main';
import { findReplacePluginKey } from './pm-plugins/plugin-key';
import FindReplaceDropDownOrToolbarButtonWithState from './ui/FindReplaceDropDownOrToolbarButtonWithState';
export var findReplacePlugin = function findReplacePlugin(_ref) {
  var _api$primaryToolbar;
  var props = _ref.config,
    api = _ref.api;
  var editorViewRef = {
    current: null
  };
  var toolbarButtonRegisteredExternally = {
    current: false
  };
  var primaryToolbarComponent = function primaryToolbarComponent(_ref2) {
    var popupsBoundariesElement = _ref2.popupsBoundariesElement,
      popupsMountPoint = _ref2.popupsMountPoint,
      popupsScrollableElement = _ref2.popupsScrollableElement,
      isToolbarReducedSpacing = _ref2.isToolbarReducedSpacing,
      toolbarSize = _ref2.toolbarSize,
      editorView = _ref2.editorView,
      containerElement = _ref2.containerElement,
      dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent;
    if (!editorView) {
      return null;
    }
    var isButtonHidden = fg('platform_editor_toolbar_responsive_fixes') ? toolbarSize < ToolbarSize.XL : false;
    if (props !== null && props !== void 0 && props.twoLineEditorToolbar) {
      return null;
    } else if (toolbarButtonRegisteredExternally.current && editorExperiment('platform_editor_controls', 'variant1')) {
      return null;
    } else {
      return /*#__PURE__*/React.createElement(FindReplaceDropDownOrToolbarButtonWithState, {
        popupsBoundariesElement: popupsBoundariesElement,
        popupsMountPoint: popupsMountPoint,
        popupsScrollableElement: popupsScrollableElement,
        isToolbarReducedSpacing: isToolbarReducedSpacing,
        editorView: editorView,
        containerElement: containerElement,
        dispatchAnalyticsEvent: dispatchAnalyticsEvent,
        takeFullWidth: props === null || props === void 0 ? void 0 : props.takeFullWidth,
        api: api,
        isButtonHidden: isButtonHidden
      });
    }
  };
  api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
    name: 'findReplace',
    component: primaryToolbarComponent
  });
  return {
    name: 'findReplace',
    pmPlugins: function pmPlugins() {
      var plugins = [{
        name: 'findReplace',
        plugin: function plugin(_ref3) {
          var dispatch = _ref3.dispatch,
            getIntl = _ref3.getIntl;
          return createPlugin(dispatch, getIntl, api);
        }
      }, {
        name: 'findReplaceKeymap',
        plugin: function plugin() {
          var _api$analytics;
          return keymapPlugin(api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions);
        }
      }];
      if (editorExperiment('platform_editor_controls', 'variant1', {
        exposure: false
      })) {
        plugins.push({
          name: 'findReplaceEditorViewReferencePlugin',
          plugin: function plugin() {
            return new SafePlugin({
              view: function view(editorView) {
                editorViewRef.current = editorView;
                return {
                  destroy: function destroy() {
                    editorViewRef.current = null;
                  }
                };
              }
            });
          }
        });
      }
      return plugins;
    },
    getSharedState: function getSharedState(editorState) {
      if (!editorState) {
        return undefined;
      }
      return findReplacePluginKey.getState(editorState) || undefined;
    },
    actions: {
      registerToolbarButton: function registerToolbarButton(_ref4) {
        var popupsBoundariesElement = _ref4.popupsBoundariesElement,
          popupsMountPoint = _ref4.popupsMountPoint,
          popupsScrollableElement = _ref4.popupsScrollableElement,
          editorView = _ref4.editorView,
          containerElement = _ref4.containerElement,
          dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent,
          isToolbarReducedSpacing = _ref4.isToolbarReducedSpacing;
        toolbarButtonRegisteredExternally.current = editorExperiment('platform_editor_controls', 'variant1');
        return /*#__PURE__*/React.createElement(FindReplaceDropDownOrToolbarButtonWithState, {
          popupsBoundariesElement: popupsBoundariesElement,
          popupsMountPoint: popupsMountPoint,
          popupsScrollableElement: popupsScrollableElement,
          editorView: editorView,
          containerElement: containerElement,
          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
          isToolbarReducedSpacing: isToolbarReducedSpacing,
          api: api
        });
      },
      activateFindReplace: function activateFindReplace(triggerMethod) {
        var _api$analytics2;
        if (!editorViewRef.current) {
          return false;
        }
        var _editorViewRef$curren = editorViewRef.current,
          state = _editorViewRef$curren.state,
          dispatch = _editorViewRef$curren.dispatch;
        if (api !== null && api !== void 0 && (_api$analytics2 = api.analytics) !== null && _api$analytics2 !== void 0 && _api$analytics2.actions) {
          var _api$analytics3;
          activateWithAnalytics(api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions)({
            triggerMethod: triggerMethod || TRIGGER_METHOD.EXTERNAL
          })(state, dispatch);
        } else {
          activate()(state, dispatch);
        }
        return true;
      }
    },
    primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) ? primaryToolbarComponent : undefined,
    contentComponent: editorExperiment('platform_editor_controls', 'variant1', {
      exposure: true
    }) ? function (_ref5) {
      var editorView = _ref5.editorView,
        containerElement = _ref5.containerElement,
        popupsMountPoint = _ref5.popupsMountPoint,
        popupsBoundariesElement = _ref5.popupsBoundariesElement,
        popupsScrollableElement = _ref5.popupsScrollableElement,
        wrapperElement = _ref5.wrapperElement,
        dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
      if (toolbarButtonRegisteredExternally.current || !editorView) {
        return null;
      }
      var popupsMountPointEl = popupsMountPoint || ( // eslint-disable-next-line @atlaskit/editor/no-as-casting
      wrapperElement === null || wrapperElement === void 0 ? void 0 : wrapperElement.querySelector("[data-editor-container='true']"));
      return /*#__PURE__*/React.createElement(FindReplaceDropDownOrToolbarButtonWithState, {
        popupsBoundariesElement: popupsBoundariesElement,
        popupsMountPoint: popupsMountPointEl,
        popupsScrollableElement: popupsScrollableElement || containerElement || undefined,
        isToolbarReducedSpacing: false,
        editorView: editorView,
        containerElement: containerElement,
        dispatchAnalyticsEvent: dispatchAnalyticsEvent,
        takeFullWidth: props === null || props === void 0 ? void 0 : props.takeFullWidth,
        api: api,
        doesNotHaveButton: true
      });
    } : undefined
  };
};