@atlaskit/editor-plugin-type-ahead 0.5.0 → 0.7.0

package/dist/cjs/messages.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.typeAheadListMessages = void 0;
+var _reactIntlNext = require("react-intl-next");
+var typeAheadListMessages = exports.typeAheadListMessages = (0, _reactIntlNext.defineMessages)({
+  typeAheadPopupLabel: {
+    id: 'fabric.editor.typeAhead.popupLabel',
+    defaultMessage: 'Typeahead results',
+    description: 'the result of a typeahead, similar to autocomplete results+'
+  },
+  quickInsertPopupLabel: {
+    id: 'fabric.editor.typeAhead.quickInsertPopupLabel',
+    defaultMessage: 'Shortcuts for inserts and formatting',
+    description: 'the result of a quick insert typeahead, similar to autocomplete results+'
+  },
+  quickInsertInputLabel: {
+    id: 'fabric.editor.typeAhead.quickInsertInputLabel',
+    defaultMessage: 'Begin typing to search or filter shortcut options',
+    description: 'assisitve text for typeahed input field'
+  },
+  emojiPopupLabel: {
+    id: 'fabric.editor.typeahead.emojiPopupLabel',
+    defaultMessage: 'Emoji shortcuts',
+    description: 'the result of a emoji typeahead, similar to autocomplete results+'
+  },
+  emojiInputLabel: {
+    id: 'fabric.editor.typeahead.emojiInputLabel',
+    defaultMessage: 'Begin typing to search or filter emoji options',
+    description: 'assisitve text for typeahed input field'
+  },
+  mentionPopupLabel: {
+    id: 'fabric.editor.typeahead.mentionPopupLabel',
+    defaultMessage: 'Users you can tag',
+    description: 'the aria label of a mention typeahead popup'
+  },
+  mentionInputLabel: {
+    id: 'fabric.editor.typeahead.mentionInputLabel',
+    defaultMessage: 'Begin typing to search for users to tag',
+    description: 'assisitve text for typeahed input field'
+  },
+  metionListItemLabel: {
+    id: 'fabric.editor.typeahead.metionListItemLabel',
+    defaultMessage: 'User {name} @{shortName}',
+    description: 'assistive text for user mention items username and nickname'
+  },
+  emojiListItemLabel: {
+    id: 'fabric.editor.typeahead.emojiListItemLabel',
+    defaultMessage: 'Emoji {name} Text Shortcut {shortcut}',
+    description: 'assistive text for emoji name and shortcut'
+  },
+  inputQueryAssistiveLabel: {
+    id: 'fabric.editor.inputQueryAssistiveTxt',
+    defaultMessage: 'When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.',
+    description: 'Assistive text to the user when using typeahead shortcut'
+  },
+  searchResultsLabel: {
+    id: 'fabric.editor.searchResults',
+    defaultMessage: '{itemsLength, plural, one {# search result} other {# search results}} available',
+    description: 'Assistive text to the user when using typeahead shortcut and it preceeds with a number - Ex: 10 search results available'
+  },
+  noSearchResultsLabel: {
+    id: 'fabric.editor.noSearchResults',
+    defaultMessage: 'No search results',
+    description: 'Assistive text to the user when using typeahead shortcut'
+  },
+  descriptionLabel: {
+    id: 'fabric.editor.description',
+    defaultMessage: 'Description',
+    description: 'Description'
+  },
+  shortcutLabel: {
+    id: 'fabric.editor.shortcut',
+    defaultMessage: 'Text shortcut',
+    description: 'Text shortcut'
+  }
+});

package/dist/cjs/plugin.js

@@ -0,0 +1,382 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.typeAheadPlugin = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireDefault(require("react"));
+var _adfSchema = require("@atlaskit/adf-schema");
+var _analytics = require("@atlaskit/editor-common/analytics");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+var _typeAhead = require("@atlaskit/editor-common/type-ahead");
+var _withPluginState = require("@atlaskit/editor-common/with-plugin-state");
+var _insertTypeAheadItem = require("./commands/insert-type-ahead-item");
+var _updateSelectedIndex = require("./commands/update-selected-index");
+var _inputRules = require("./pm-plugins/input-rules");
+var _insertItemPlugin = require("./pm-plugins/insert-item-plugin");
+var _key = require("./pm-plugins/key");
+var _main = require("./pm-plugins/main");
+var _statsModifier = require("./stats-modifier");
+var _closeTypeAhead = require("./transforms/close-type-ahead");
+var _openTypeaheadAtCursor = require("./transforms/open-typeahead-at-cursor");
+var _useItemInsert3 = require("./ui/hooks/use-item-insert");
+var _TypeAheadPopup = require("./ui/TypeAheadPopup");
+var _utils = require("./utils");
+/**
+ *
+ * Revamped typeahead using decorations instead of the `typeAheadQuery` mark
+ *
+ * https://product-fabric.atlassian.net/wiki/spaces/E/pages/2992177582/Technical+TypeAhead+Data+Flow
+ *
+ *
+ */
+
+var TypeAheadMenu = /*#__PURE__*/_react.default.memo(function (_ref) {
+  var _popupMountRef$curren, _popupMountRef$curren2, _popupMountRef$curren3;
+  var editorView = _ref.editorView,
+    popupMountRef = _ref.popupMountRef,
+    typeAheadState = _ref.typeAheadState,
+    fireAnalyticsCallback = _ref.fireAnalyticsCallback;
+  var isOpen = typeAheadState.decorationSet.find().length > 0;
+  var triggerHandler = typeAheadState.triggerHandler,
+    items = typeAheadState.items,
+    selectedIndex = typeAheadState.selectedIndex,
+    decorationElement = typeAheadState.decorationElement,
+    decorationSet = typeAheadState.decorationSet,
+    query = typeAheadState.query;
+  var _useItemInsert = (0, _useItemInsert3.useItemInsert)(triggerHandler, editorView, items),
+    _useItemInsert2 = (0, _slicedToArray2.default)(_useItemInsert, 3),
+    onItemInsert = _useItemInsert2[0],
+    onTextInsert = _useItemInsert2[1],
+    onItemMatch = _useItemInsert2[2];
+  var setSelectedItem = _react.default.useCallback(function (_ref2) {
+    var nextIndex = _ref2.index;
+    queueMicrotask(function () {
+      (0, _updateSelectedIndex.updateSelectedIndex)(nextIndex)(editorView.state, editorView.dispatch);
+    });
+  }, [editorView]);
+  var insertItem = _react.default.useCallback(function () {
+    var mode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _typeAhead.SelectItemMode.SELECTED;
+    var index = arguments.length > 1 ? arguments[1] : undefined;
+    queueMicrotask(function () {
+      onItemInsert({
+        mode: mode,
+        index: index,
+        query: query
+      });
+    });
+  }, [onItemInsert, query]);
+  var cancel = _react.default.useCallback(function (_ref3) {
+    var setSelectionAt = _ref3.setSelectionAt,
+      addPrefixTrigger = _ref3.addPrefixTrigger,
+      forceFocusOnEditor = _ref3.forceFocusOnEditor;
+    var fullQuery = addPrefixTrigger ? "".concat(triggerHandler === null || triggerHandler === void 0 ? void 0 : triggerHandler.trigger).concat(query) : query;
+    onTextInsert({
+      forceFocusOnEditor: forceFocusOnEditor,
+      setSelectionAt: setSelectionAt,
+      text: fullQuery
+    });
+  }, [triggerHandler, onTextInsert, query]);
+  _react.default.useEffect(function () {
+    if (!isOpen || !query) {
+      return;
+    }
+    var isLastCharSpace = query[query.length - 1] === ' ';
+    if (!isLastCharSpace) {
+      return;
+    }
+    var result = onItemMatch({
+      mode: _typeAhead.SelectItemMode.SPACE,
+      query: query.trim()
+    });
+    if (!result) {
+      return;
+    }
+  }, [isOpen, query, onItemMatch]);
+  if (!isOpen || !triggerHandler || !(decorationElement instanceof HTMLElement) || items.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_TypeAheadPopup.TypeAheadPopup, {
+    editorView: editorView,
+    popupsMountPoint: (_popupMountRef$curren = popupMountRef.current) === null || _popupMountRef$curren === void 0 ? void 0 : _popupMountRef$curren.popupsMountPoint,
+    popupsBoundariesElement: (_popupMountRef$curren2 = popupMountRef.current) === null || _popupMountRef$curren2 === void 0 ? void 0 : _popupMountRef$curren2.popupsBoundariesElement,
+    popupsScrollableElement: (_popupMountRef$curren3 = popupMountRef.current) === null || _popupMountRef$curren3 === void 0 ? void 0 : _popupMountRef$curren3.popupsScrollableElement,
+    anchorElement: decorationElement,
+    triggerHandler: triggerHandler,
+    fireAnalyticsCallback: fireAnalyticsCallback,
+    items: items,
+    selectedIndex: selectedIndex,
+    setSelectedItem: setSelectedItem,
+    onItemInsert: insertItem,
+    decorationSet: decorationSet,
+    isEmptyQuery: !query,
+    cancel: cancel
+  });
+});
+var createOpenAtTransaction = function createOpenAtTransaction(editorAnalyticsAPI) {
+  return function (props) {
+    return function (tr) {
+      var triggerHandler = props.triggerHandler,
+        inputMethod = props.inputMethod;
+      (0, _openTypeaheadAtCursor.openTypeAheadAtCursor)({
+        triggerHandler: triggerHandler,
+        inputMethod: inputMethod
+      })({
+        tr: tr
+      });
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+        action: _analytics.ACTION.INVOKED,
+        actionSubject: _analytics.ACTION_SUBJECT.TYPEAHEAD,
+        actionSubjectId: triggerHandler.id,
+        attributes: {
+          inputMethod: inputMethod
+        },
+        eventType: _analytics.EVENT_TYPE.UI
+      })(tr);
+      return true;
+    };
+  };
+};
+var createOpenTypeAhead = function createOpenTypeAhead(editorViewRef, editorAnalyticsAPI) {
+  return function (props) {
+    if (!editorViewRef.current) {
+      return false;
+    }
+    var view = editorViewRef.current;
+    var tr = view.state.tr;
+    createOpenAtTransaction(editorAnalyticsAPI)(props)(tr);
+    view.dispatch(tr);
+    return true;
+  };
+};
+var createInsertTypeAheadItem = function createInsertTypeAheadItem(editorViewRef) {
+  return function (props) {
+    if (!editorViewRef.current) {
+      return false;
+    }
+    var view = editorViewRef.current;
+    var triggerHandler = props.triggerHandler,
+      contentItem = props.contentItem,
+      query = props.query,
+      sourceListItem = props.sourceListItem,
+      mode = props.mode;
+    (0, _insertTypeAheadItem.insertTypeAheadItem)(view)({
+      handler: triggerHandler,
+      item: contentItem,
+      mode: mode || _typeAhead.SelectItemMode.SELECTED,
+      query: query,
+      sourceListItem: sourceListItem
+    });
+    return true;
+  };
+};
+var createFindHandlerByTrigger = function createFindHandlerByTrigger(editorViewRef) {
+  return function (trigger) {
+    if (!editorViewRef.current) {
+      return null;
+    }
+    var view = editorViewRef.current;
+    return (0, _utils.findHandler)(trigger, view.state);
+  };
+};
+var createCloseTypeAhead = function createCloseTypeAhead(editorViewRef) {
+  return function (options) {
+    if (!editorViewRef.current) {
+      return false;
+    }
+    var view = editorViewRef.current;
+    var currentQuery = (0, _utils.getTypeAheadQuery)(view.state) || '';
+    var state = view.state;
+    var tr = state.tr;
+    if (options.attachCommand) {
+      var fakeDispatch = function fakeDispatch(customTr) {
+        tr = customTr;
+      };
+      options.attachCommand(state, fakeDispatch);
+    }
+    (0, _closeTypeAhead.closeTypeAhead)(tr);
+    if (options.insertCurrentQueryAsRawText && currentQuery && currentQuery.length > 0) {
+      var handler = (0, _utils.getTypeAheadHandler)(state);
+      if (!handler) {
+        return false;
+      }
+      var text = handler.trigger.concat(currentQuery);
+      tr.replaceSelectionWith(state.schema.text(text));
+    }
+    view.dispatch(tr);
+    if (!view.hasFocus()) {
+      view.focus();
+    }
+    return true;
+  };
+};
+
+/**
+ *
+ * Revamped typeahead using decorations instead of the `typeAheadQuery` mark
+ *
+ * https://product-fabric.atlassian.net/wiki/spaces/E/pages/2992177582/Technical+TypeAhead+Data+Flow
+ *
+ *
+ */
+var typeAheadPlugin = exports.typeAheadPlugin = function typeAheadPlugin(_ref4) {
+  var _api$analytics, _api$analytics2;
+  var options = _ref4.config,
+    api = _ref4.api;
+  var fireAnalyticsCallback = (0, _analytics.fireAnalyticsEvent)(options === null || options === void 0 ? void 0 : options.createAnalyticsEvent);
+  var popupMountRef = {
+    current: null
+  };
+  var editorViewRef = {
+    current: null
+  };
+  return {
+    name: 'typeAhead',
+    marks: function marks() {
+      // We need to keep this to make sure
+      // All documents with typeahead marks will be loaded normally
+      return [{
+        name: 'typeAheadQuery',
+        mark: _adfSchema.typeAheadQuery
+      }];
+    },
+    pmPlugins: function pmPlugins() {
+      var typeAhead = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+      return [{
+        name: 'typeAhead',
+        plugin: function plugin(_ref5) {
+          var dispatch = _ref5.dispatch,
+            getIntl = _ref5.getIntl;
+          return (0, _main.createPlugin)({
+            getIntl: getIntl,
+            popupMountRef: popupMountRef,
+            reactDispatch: dispatch,
+            typeAheadHandlers: typeAhead,
+            createAnalyticsEvent: options === null || options === void 0 ? void 0 : options.createAnalyticsEvent
+          });
+        }
+      }, {
+        name: 'typeAheadEditorViewRef',
+        plugin: function plugin() {
+          return new _safePlugin.SafePlugin({
+            view: function view(_view) {
+              editorViewRef.current = _view;
+              return {
+                destroy: function destroy() {
+                  editorViewRef.current = null;
+                }
+              };
+            }
+          });
+        }
+      }, {
+        name: 'typeAheadInsertItem',
+        plugin: _insertItemPlugin.createPlugin
+      }, {
+        name: 'typeAheadInputRule',
+        plugin: function plugin(_ref6) {
+          var schema = _ref6.schema,
+            featureFlags = _ref6.featureFlags;
+          return (0, _inputRules.inputRulePlugin)(schema, typeAhead, featureFlags);
+        }
+      }];
+    },
+    getSharedState: function getSharedState(editorState) {
+      if (!editorState) {
+        return {
+          query: '',
+          isOpen: false,
+          isAllowed: false,
+          currentHandler: undefined
+        };
+      }
+      var isOpen = (0, _utils.isTypeAheadOpen)(editorState);
+      return {
+        query: (0, _utils.getTypeAheadQuery)(editorState) || '',
+        currentHandler: (0, _utils.getTypeAheadHandler)(editorState),
+        isOpen: isOpen,
+        isAllowed: !isOpen
+      };
+    },
+    actions: {
+      isOpen: _utils.isTypeAheadOpen,
+      isAllowed: _utils.isTypeAheadAllowed,
+      open: createOpenTypeAhead(editorViewRef, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions),
+      openAtTransaction: createOpenAtTransaction(api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions),
+      findHandlerByTrigger: createFindHandlerByTrigger(editorViewRef),
+      insert: createInsertTypeAheadItem(editorViewRef),
+      close: createCloseTypeAhead(editorViewRef)
+    },
+    contentComponent: function contentComponent(_ref7) {
+      var editorView = _ref7.editorView,
+        containerElement = _ref7.containerElement,
+        popupsMountPoint = _ref7.popupsMountPoint,
+        popupsBoundariesElement = _ref7.popupsBoundariesElement,
+        popupsScrollableElement = _ref7.popupsScrollableElement,
+        wrapperElement = _ref7.wrapperElement;
+      popupMountRef.current = {
+        popupsMountPoint: popupsMountPoint || wrapperElement || undefined,
+        popupsBoundariesElement: popupsBoundariesElement,
+        popupsScrollableElement: popupsScrollableElement || containerElement || undefined
+      };
+      return /*#__PURE__*/_react.default.createElement(_withPluginState.WithPluginState, {
+        plugins: {
+          typeAheadState: _key.pluginKey
+        },
+        render: function render(_ref8) {
+          var typeAheadState = _ref8.typeAheadState;
+          if (!typeAheadState) {
+            return null;
+          }
+          return /*#__PURE__*/_react.default.createElement(TypeAheadMenu, {
+            editorView: editorView,
+            popupMountRef: popupMountRef,
+            typeAheadState: typeAheadState,
+            fireAnalyticsCallback: fireAnalyticsCallback
+          });
+        }
+      });
+    },
+    onEditorViewStateUpdated: function onEditorViewStateUpdated(_ref9) {
+      var originalTransaction = _ref9.originalTransaction,
+        oldEditorState = _ref9.oldEditorState,
+        newEditorState = _ref9.newEditorState;
+      var oldPluginState = (0, _utils.getPluginState)(oldEditorState);
+      var newPluginState = (0, _utils.getPluginState)(newEditorState);
+      if (!oldPluginState || !newPluginState) {
+        return;
+      }
+      var oldTriggerHandler = oldPluginState.triggerHandler;
+      var newTriggerHandler = newPluginState.triggerHandler;
+      var isANewHandler = oldTriggerHandler !== newTriggerHandler;
+      if (oldTriggerHandler !== null && oldTriggerHandler !== void 0 && oldTriggerHandler.dismiss && isANewHandler) {
+        var typeAheadMessage = originalTransaction.getMeta(_key.pluginKey);
+        var wasItemInserted = typeAheadMessage && typeAheadMessage.action === 'INSERT_RAW_QUERY';
+        oldTriggerHandler.dismiss({
+          editorState: newEditorState,
+          query: oldPluginState.query,
+          stats: (oldPluginState.stats || new _statsModifier.StatsModifier()).serialize(),
+          wasItemInserted: wasItemInserted
+        });
+      }
+      if (newTriggerHandler !== null && newTriggerHandler !== void 0 && newTriggerHandler.onOpen && isANewHandler) {
+        newTriggerHandler.onOpen(newEditorState);
+      }
+      if (newTriggerHandler && isANewHandler && options !== null && options !== void 0 && options.createAnalyticsEvent) {
+        fireAnalyticsCallback({
+          payload: {
+            action: _analytics.ACTION.INVOKED,
+            actionSubject: _analytics.ACTION_SUBJECT.TYPEAHEAD,
+            actionSubjectId: newTriggerHandler.id || 'not_set',
+            attributes: {
+              inputMethod: newPluginState.inputMethod || _analytics.INPUT_METHOD.KEYBOARD
+            },
+            eventType: _analytics.EVENT_TYPE.UI
+          }
+        });
+      }
+    }
+  };
+};

package/dist/cjs/pm-plugins/actions.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ACTIONS = void 0;
+var ACTIONS = exports.ACTIONS = /*#__PURE__*/function (ACTIONS) {
+  ACTIONS["OPEN_TYPEAHEAD_AT_CURSOR"] = "OPEN_TYPEAHEAD_AT_CURSOR";
+  ACTIONS["CLOSE_TYPE_AHEAD"] = "CLOSE_TYPE_AHEAD";
+  ACTIONS["CHANGE_QUERY"] = "CHANGE_QUERY";
+  ACTIONS["INSERT_ITEM"] = "INSERT_ITEM";
+  ACTIONS["INSERT_RAW_QUERY"] = "INSERT_RAW_QUERY";
+  ACTIONS["UPDATE_LIST_ITEMS"] = "UPDATE_LIST_ITEMS";
+  ACTIONS["UPDATE_SELECTED_INDEX"] = "UPDATE_SELECTED_INDEX";
+  return ACTIONS;
+}({});

package/dist/cjs/pm-plugins/decorations.js

@@ -0,0 +1,148 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.factoryDecorations = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactDom = _interopRequireDefault(require("react-dom"));
+var _reactIntlNext = require("react-intl-next");
+var _uuid = _interopRequireDefault(require("uuid"));
+var _w3cKeyname = require("w3c-keyname");
+var _history = require("@atlaskit/editor-prosemirror/history");
+var _state = require("@atlaskit/editor-prosemirror/state");
+var _view = require("@atlaskit/editor-prosemirror/view");
+var _colors = require("@atlaskit/theme/colors");
+var _constants = require("../constants");
+var _statsModifier = require("../stats-modifier");
+var _closeTypeAhead = require("../transforms/close-type-ahead");
+var _WrapperTypeAhead = require("../ui/WrapperTypeAhead");
+var _utils = require("../utils");
+var factoryDecorations = exports.factoryDecorations = function factoryDecorations(_ref) {
+  var intl = _ref.intl,
+    popupMountRef = _ref.popupMountRef,
+    createAnalyticsEvent = _ref.createAnalyticsEvent;
+  var createDecorations = function createDecorations(tr, _ref2) {
+    var triggerHandler = _ref2.triggerHandler,
+      inputMethod = _ref2.inputMethod,
+      reopenQuery = _ref2.reopenQuery;
+    var selection = tr.selection;
+    if (!(selection instanceof _state.TextSelection) || !selection.$cursor) {
+      return {
+        decorationSet: _view.DecorationSet.empty,
+        stats: null,
+        decorationElement: null
+      };
+    }
+    var decorationId = "decoration_id_".concat(_constants.TYPE_AHEAD_DECORATION_KEY, "_").concat((0, _uuid.default)());
+    var $cursor = selection.$cursor;
+    var typeaheadComponent = document.createElement('mark');
+    var stats = new _statsModifier.StatsModifier();
+    var shouldFocusCursorInsideQuery = true;
+    var deco = _view.Decoration.widget($cursor.pos, function (editorView, getDecorationPosition) {
+      var _popupMountRef$curren, _popupMountRef$curren2, _popupMountRef$curren3;
+      typeaheadComponent.setAttribute('id', decorationId);
+      typeaheadComponent.setAttribute('role', 'search');
+      typeaheadComponent.dataset.typeAheadQuery = 'true';
+      typeaheadComponent.dataset.trigger = triggerHandler.trigger;
+
+      // This line below seems weird,
+      // we need that cuz the clickAreaHelper
+      // will try to hijack any click event coming
+      // from the inside of the Editor
+      // packages/editor/editor-core/src/ui/Addon/click-area-helper.ts
+      typeaheadComponent.dataset.editorPopup = 'true';
+      typeaheadComponent.dataset.typeAhead = _constants.TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE;
+      typeaheadComponent.style.color = "var(--ds-text-accent-blue, ".concat(_colors.B400, ")");
+      typeaheadComponent.style.backgroundColor = 'transparent';
+      var onUndoRedo = function onUndoRedo(inputType) {
+        if (!['historyUndo', 'historyRedo'].includes(inputType)) {
+          return false;
+        }
+        var hasReopenQuery = typeof reopenQuery === 'string' && reopenQuery.trim().length > 0;
+        var currentQuery = (0, _utils.getTypeAheadQuery)(editorView.state);
+        if (hasReopenQuery || (currentQuery === null || currentQuery === void 0 ? void 0 : currentQuery.length) === 0) {
+          var command = inputType === 'historyUndo' ? _history.undo : _history.redo;
+          var _tr = editorView.state.tr;
+          var fakeDispatch = function fakeDispatch(customTr) {
+            _tr = customTr;
+          };
+          var result = command(editorView.state, fakeDispatch);
+          if (result) {
+            (0, _closeTypeAhead.closeTypeAhead)(_tr);
+            editorView.dispatch(_tr);
+            editorView.focus();
+          }
+          return result;
+        }
+        return false;
+      };
+      _reactDom.default.render( /*#__PURE__*/_react.default.createElement(_reactIntlNext.IntlProvider, {
+        locale: intl.locale || 'en',
+        messages: intl.messages,
+        formats: intl.formats
+      }, /*#__PURE__*/_react.default.createElement(_WrapperTypeAhead.WrapperTypeAhead, {
+        triggerHandler: triggerHandler,
+        editorView: editorView,
+        anchorElement: typeaheadComponent,
+        createAnalyticsEvent: createAnalyticsEvent,
+        inputMethod: inputMethod,
+        getDecorationPosition: getDecorationPosition,
+        shouldFocusCursorInsideQuery: shouldFocusCursorInsideQuery,
+        popupsMountPoint: (_popupMountRef$curren = popupMountRef.current) === null || _popupMountRef$curren === void 0 ? void 0 : _popupMountRef$curren.popupsMountPoint,
+        popupsBoundariesElement: (_popupMountRef$curren2 = popupMountRef.current) === null || _popupMountRef$curren2 === void 0 ? void 0 : _popupMountRef$curren2.popupsBoundariesElement,
+        popupsScrollableElement: (_popupMountRef$curren3 = popupMountRef.current) === null || _popupMountRef$curren3 === void 0 ? void 0 : _popupMountRef$curren3.popupsScrollableElement,
+        onUndoRedo: onUndoRedo,
+        reopenQuery: reopenQuery
+      })), typeaheadComponent);
+      shouldFocusCursorInsideQuery = false;
+      return typeaheadComponent;
+    }, {
+      isTypeAheadDecoration: true,
+      key: decorationId,
+      side: 0,
+      stopEvent: function stopEvent(e) {
+        var key = (0, _w3cKeyname.keyName)(e);
+        var sel = document.getSelection();
+        if ('ArrowLeft' === key && (sel === null || sel === void 0 ? void 0 : sel.anchorOffset) === 0) {
+          return false;
+        }
+        return true;
+      },
+      ignoreSelection: false
+    });
+    return {
+      decorationSet: _view.DecorationSet.create(tr.doc, [deco]),
+      decorationElement: typeaheadComponent,
+      stats: stats
+    };
+  };
+  var removeDecorations = function removeDecorations(decorationSet) {
+    if (!decorationSet || decorationSet === _view.DecorationSet.empty) {
+      return false;
+    }
+    var typeAheadDecorations = decorationSet.find(undefined, undefined, function (spec) {
+      return spec.isTypeAheadDecoration;
+    });
+    if (!typeAheadDecorations || typeAheadDecorations.length === 0) {
+      return false;
+    }
+    typeAheadDecorations.forEach(function (_ref3) {
+      var spec = _ref3.spec;
+      if (!spec.key) {
+        return;
+      }
+      var decoElement = document.querySelector("#".concat(spec.key));
+      if (!decoElement) {
+        return;
+      }
+      _reactDom.default.unmountComponentAtNode(decoElement);
+    });
+    return true;
+  };
+  return {
+    createDecorations: createDecorations,
+    removeDecorations: removeDecorations
+  };
+};

package/dist/cjs/pm-plugins/input-rules.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+exports.inputRulePlugin = inputRulePlugin;
+var _analytics = require("@atlaskit/editor-common/analytics");
+var _prosemirrorInputRules = require("@atlaskit/prosemirror-input-rules");
+var _openTypeaheadAtCursor = require("../transforms/open-typeahead-at-cursor");
+function inputRulePlugin(schema, typeAheads, featureFlags) {
+  if (!typeAheads || typeAheads.length === 0) {
+    return;
+  }
+  var rules = typeAheads.reduce(function (acc, typeAhead) {
+    var trigger = typeAhead.customRegex || typeAhead.trigger;
+    if (!trigger) {
+      return acc;
+    }
+    var regex = new RegExp("(^|[.!?\\s".concat(_prosemirrorInputRules.leafNodeReplacementCharacter, "])(").concat(trigger, ")$"));
+    acc.push((0, _prosemirrorInputRules.createRule)(regex, function (state, match) {
+      return (0, _openTypeaheadAtCursor.openTypeAheadAtCursor)({
+        triggerHandler: typeAhead,
+        inputMethod: _analytics.INPUT_METHOD.KEYBOARD
+      })({
+        tr: state.tr
+      });
+    }));
+    return acc;
+  }, []);
+  var plugin = (0, _prosemirrorInputRules.createPlugin)('type-ahead', rules, {
+    allowInsertTextOnDocument: false
+  });
+  return plugin;
+}
+var _default = exports.default = inputRulePlugin;

package/dist/cjs/pm-plugins/insert-item-plugin.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createPlugin = createPlugin;
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+var _actions = require("./actions");
+var _utils = require("./utils");
+function createPlugin() {
+  return new _safePlugin.SafePlugin({
+    appendTransaction: function appendTransaction(transactions, _oldState, newState) {
+      var insertItemCallback = (0, _utils.isInsertionTransaction)(transactions, _actions.ACTIONS.INSERT_ITEM);
+      if (insertItemCallback) {
+        var tr = insertItemCallback(newState);
+        if (tr) {
+          return tr;
+        }
+      }
+    }
+  });
+}