@atlaskit/editor-core 188.8.0 → 188.9.2

package/dist/es2019/plugins/type-ahead/pm-plugins/decorations.js

@@ -1,148 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import uuid from 'uuid';
-import { TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { DecorationSet, Decoration } from '@atlaskit/editor-prosemirror/view';
-import { B400 } from '@atlaskit/theme/colors';
-import { keyName as keyNameNormalized } from 'w3c-keyname';
-import { IntlProvider } from 'react-intl-next';
-import { redo, undo } from '@atlaskit/editor-prosemirror/history';
-import { TYPE_AHEAD_DECORATION_KEY, TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE } from '../constants';
-import { WrapperTypeAhead } from '../ui/WrapperTypeAhead';
-import { StatsModifier } from '../stats-modifier';
-import { getTypeAheadQuery } from '../utils';
-import { closeTypeAhead } from '../transforms/close-type-ahead';
-export const factoryDecorations = ({
-  intl,
-  popupMountRef,
-  createAnalyticsEvent
-}) => {
-  const createDecorations = (tr, {
-    triggerHandler,
-    inputMethod,
-    reopenQuery
-  }) => {
-    const {
-      selection
-    } = tr;
-    if (!(selection instanceof TextSelection) || !selection.$cursor) {
-      return {
-        decorationSet: DecorationSet.empty,
-        stats: null,
-        decorationElement: null
-      };
-    }
-    const decorationId = `decoration_id_${TYPE_AHEAD_DECORATION_KEY}_${uuid()}`;
-    const {
-      $cursor
-    } = selection;
-    const typeaheadComponent = document.createElement('mark');
-    const stats = new StatsModifier();
-    let shouldFocusCursorInsideQuery = true;
-    const deco = Decoration.widget($cursor.pos, (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 = TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE;
-      typeaheadComponent.style.color = `var(--ds-text-accent-blue, ${B400})`;
-      typeaheadComponent.style.backgroundColor = 'transparent';
-      const onUndoRedo = inputType => {
-        if (!['historyUndo', 'historyRedo'].includes(inputType)) {
-          return false;
-        }
-        const hasReopenQuery = typeof reopenQuery === 'string' && reopenQuery.trim().length > 0;
-        const currentQuery = getTypeAheadQuery(editorView.state);
-        if (hasReopenQuery || (currentQuery === null || currentQuery === void 0 ? void 0 : currentQuery.length) === 0) {
-          const command = inputType === 'historyUndo' ? undo : redo;
-          let tr = editorView.state.tr;
-          const fakeDispatch = customTr => {
-            tr = customTr;
-          };
-          const result = command(editorView.state, fakeDispatch);
-          if (result) {
-            closeTypeAhead(tr);
-            editorView.dispatch(tr);
-            editorView.focus();
-          }
-          return result;
-        }
-        return false;
-      };
-      ReactDOM.render( /*#__PURE__*/React.createElement(IntlProvider, {
-        locale: intl.locale || 'en',
-        messages: intl.messages,
-        formats: intl.formats
-      }, /*#__PURE__*/React.createElement(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: e => {
-        const key = keyNameNormalized(e);
-        const sel = document.getSelection();
-        if ('ArrowLeft' === key && (sel === null || sel === void 0 ? void 0 : sel.anchorOffset) === 0) {
-          return false;
-        }
-        return true;
-      },
-      ignoreSelection: false
-    });
-    return {
-      decorationSet: DecorationSet.create(tr.doc, [deco]),
-      decorationElement: typeaheadComponent,
-      stats
-    };
-  };
-  const removeDecorations = decorationSet => {
-    if (!decorationSet || decorationSet === DecorationSet.empty) {
-      return false;
-    }
-    const typeAheadDecorations = decorationSet.find(undefined, undefined, spec => {
-      return spec.isTypeAheadDecoration;
-    });
-    if (!typeAheadDecorations || typeAheadDecorations.length === 0) {
-      return false;
-    }
-    typeAheadDecorations.forEach(({
-      spec
-    }) => {
-      if (!spec.key) {
-        return;
-      }
-      const decoElement = document.querySelector(`#${spec.key}`);
-      if (!decoElement) {
-        return;
-      }
-      ReactDOM.unmountComponentAtNode(decoElement);
-    });
-    return true;
-  };
-  return {
-    createDecorations,
-    removeDecorations
-  };
-};

package/dist/es2019/plugins/type-ahead/pm-plugins/input-rules.js

@@ -1,29 +0,0 @@
-import { createRule, createPlugin, leafNodeReplacementCharacter } from '@atlaskit/prosemirror-input-rules';
-import { openTypeAheadAtCursor } from '../transforms/open-typeahead-at-cursor';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-export function inputRulePlugin(schema, typeAheads, featureFlags) {
-  if (!typeAheads || typeAheads.length === 0) {
-    return;
-  }
-  const rules = typeAheads.reduce((acc, typeAhead) => {
-    const trigger = typeAhead.customRegex || typeAhead.trigger;
-    if (!trigger) {
-      return acc;
-    }
-    const regex = new RegExp(`(^|[.!?\\s${leafNodeReplacementCharacter}])(${trigger})$`);
-    acc.push(createRule(regex, (state, match) => {
-      return openTypeAheadAtCursor({
-        triggerHandler: typeAhead,
-        inputMethod: INPUT_METHOD.KEYBOARD
-      })({
-        tr: state.tr
-      });
-    }));
-    return acc;
-  }, []);
-  const plugin = createPlugin('type-ahead', rules, {
-    allowInsertTextOnDocument: false
-  });
-  return plugin;
-}
-export default inputRulePlugin;

package/dist/es2019/plugins/type-ahead/pm-plugins/insert-item-plugin.js

@@ -1,16 +0,0 @@
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { ACTIONS } from './actions';
-import { isInsertionTransaction } from './utils';
-export function createPlugin() {
-  return new SafePlugin({
-    appendTransaction(transactions, _oldState, newState) {
-      const insertItemCallback = isInsertionTransaction(transactions, ACTIONS.INSERT_ITEM);
-      if (insertItemCallback) {
-        const tr = insertItemCallback(newState);
-        if (tr) {
-          return tr;
-        }
-      }
-    }
-  });
-}

package/dist/es2019/plugins/type-ahead/pm-plugins/key.js

@@ -1,2 +0,0 @@
-import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-export const pluginKey = new PluginKey('typeAheadPlugin');

package/dist/es2019/plugins/type-ahead/pm-plugins/main.js

@@ -1,106 +0,0 @@
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
-import { InsertTypeAheadStep } from '@atlaskit/adf-schema/steps';
-import { TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE } from '../constants';
-import { ACTIONS } from './actions';
-import { pluginKey } from './key';
-import { closest } from '@atlaskit/editor-common/utils';
-import { createReducer } from './reducer';
-import { factoryDecorations } from './decorations';
-import { isInsertionTransaction } from './utils';
-const hasValidTypeAheadStep = tr => {
-  const steps = tr.steps.filter(step => step instanceof InsertTypeAheadStep);
-
-  // There are some cases, like collab rebase, where the steps are re-applied
-  // We should not re open the type-ahead for those cases
-  if (steps.length === 1) {
-    return steps[0];
-  }
-  return null;
-};
-export function createPlugin({
-  reactDispatch,
-  popupMountRef,
-  createAnalyticsEvent,
-  typeAheadHandlers,
-  getIntl
-}) {
-  const intl = getIntl();
-  const {
-    createDecorations,
-    removeDecorations
-  } = factoryDecorations({
-    intl,
-    popupMountRef,
-    createAnalyticsEvent: createAnalyticsEvent
-  });
-  const reducer = createReducer({
-    createDecorations,
-    removeDecorations,
-    typeAheadHandlers,
-    popupMountRef
-  });
-  return new SafePlugin({
-    key: pluginKey,
-    state: {
-      init() {
-        return {
-          typeAheadHandlers,
-          query: '',
-          decorationSet: DecorationSet.empty,
-          decorationElement: null,
-          items: [],
-          selectedIndex: -1,
-          stats: null,
-          inputMethod: null
-        };
-      },
-      apply(tr, currentPluginState, oldEditorState, state) {
-        const customStep = hasValidTypeAheadStep(tr);
-        const nextPluginState = reducer(tr, currentPluginState, customStep);
-        if (currentPluginState !== nextPluginState) {
-          reactDispatch(pluginKey, nextPluginState);
-        }
-        return nextPluginState;
-      }
-    },
-    appendTransaction(transactions, _oldState, newState) {
-      const insertItemCallback = isInsertionTransaction(transactions, ACTIONS.INSERT_RAW_QUERY);
-      if (insertItemCallback) {
-        const tr = insertItemCallback(newState);
-        if (tr) {
-          return tr;
-        }
-      }
-    },
-    view() {
-      return {
-        update(editorView) {}
-      };
-    },
-    props: {
-      decorations: state => {
-        var _pluginKey$getState;
-        return (_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.decorationSet;
-      },
-      handleDOMEvents: {
-        compositionend: (view, event) => {
-          return false;
-        },
-        click: (view, event) => {
-          const {
-            target
-          } = event;
-          // ProseMirror view listen to any click event inside of it
-          // When this event is coming from the typeahead
-          // we should tell to ProseMirror to sit down and relax
-          // cuz we know what we are doing (I hope)
-          if (target instanceof HTMLElement && closest(target, `[data-type-ahead=${TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE}]`)) {
-            return true;
-          }
-          return false;
-        }
-      }
-    }
-  });
-}

package/dist/es2019/plugins/type-ahead/pm-plugins/reducer.js

@@ -1,160 +0,0 @@
-import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
-import { InsertTypeAheadStep, InsertTypeAheadStages } from '@atlaskit/adf-schema/steps';
-import { ACTIONS } from './actions';
-import { pluginKey } from './key';
-import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { isTypeAheadHandler } from '../utils';
-const shouldForceOpen = step => {
-  if (!(step instanceof InsertTypeAheadStep)) {
-    return false;
-  }
-  const isDeletionRawQueryOperation = step.isInsertionStep() && step.stage === InsertTypeAheadStages.DELETING_RAW_QUERY;
-  const isUndoingInsertionItem = step.isUndoingStep() && step.stage === InsertTypeAheadStages.INSERTING_ITEM;
-  return isDeletionRawQueryOperation || isUndoingInsertionItem;
-};
-const shouldForceClose = step => {
-  if (!(step instanceof InsertTypeAheadStep)) {
-    return false;
-  }
-  const isInsertingItem = step.isInsertionStep() && step.stage === InsertTypeAheadStages.INSERTING_ITEM;
-  const isUndoingDeletionRawQuery = step.isUndoingStep() && step.stage === InsertTypeAheadStages.DELETING_RAW_QUERY;
-  return isInsertingItem || isUndoingDeletionRawQuery;
-};
-const createFindHandler = typeAheadHandlers => step => {
-  if (!(step instanceof InsertTypeAheadStep)) {
-    return null;
-  }
-  const handler = typeAheadHandlers.find(h => h.trigger === step.trigger);
-  return handler || null;
-};
-export const createReducer = ({
-  typeAheadHandlers,
-  removeDecorations,
-  createDecorations
-}) => {
-  const findHandler = createFindHandler(typeAheadHandlers);
-  const openMenu = (currentPluginState, {
-    tr,
-    triggerHandler,
-    inputMethod,
-    reopenQuery,
-    selectedIndex
-  }) => {
-    removeDecorations(currentPluginState.decorationSet);
-    const {
-      decorationSet,
-      decorationElement,
-      stats
-    } = createDecorations(tr, {
-      triggerHandler,
-      inputMethod,
-      reopenQuery
-    });
-    return {
-      ...currentPluginState,
-      stats,
-      decorationSet,
-      triggerHandler,
-      decorationElement,
-      inputMethod,
-      selectedIndex: typeof selectedIndex === 'number' ? selectedIndex : -1,
-      items: [],
-      query: reopenQuery || ''
-    };
-  };
-  const closeMenu = currentPluginState => {
-    removeDecorations(currentPluginState.decorationSet);
-    return {
-      ...currentPluginState,
-      inputMethod: null,
-      query: '',
-      decorationElement: null,
-      decorationSet: DecorationSet.empty,
-      stats: null,
-      triggerHandler: undefined,
-      items: []
-    };
-  };
-  return (tr, currentPluginState, typeAheadStepOverride) => {
-    const meta = tr.getMeta(pluginKey) || {};
-
-    // This code below controls when we should force
-    // the menu to open or close during undo/redo operations
-    const overrideHandler = findHandler(typeAheadStepOverride);
-    if (typeAheadStepOverride && overrideHandler && shouldForceOpen(typeAheadStepOverride)) {
-      return openMenu(currentPluginState, {
-        tr,
-        triggerHandler: overrideHandler,
-        inputMethod: INPUT_METHOD.KEYBOARD,
-        reopenQuery: typeAheadStepOverride.query,
-        selectedIndex: typeAheadStepOverride.selectedIndex
-      });
-    } else if (shouldForceClose(typeAheadStepOverride)) {
-      return closeMenu(currentPluginState);
-    }
-    const {
-      action,
-      params
-    } = meta || {};
-    const shouldOpenMenu = action === ACTIONS.OPEN_TYPEAHEAD_AT_CURSOR && isTypeAheadHandler(params === null || params === void 0 ? void 0 : params.triggerHandler);
-    const selectionChanged = tr.selectionSet && (tr.isGeneric || Boolean(tr.getMeta('pointer')));
-    const shouldCloseMenu = [ACTIONS.CLOSE_TYPE_AHEAD, ACTIONS.INSERT_ITEM].includes(action) || selectionChanged;
-    const shouldUpdateQuery = action === ACTIONS.CHANGE_QUERY;
-    const shouldUpdateListItems = action === ACTIONS.UPDATE_LIST_ITEMS;
-    const shouldUpdateSelectedIndex = action === ACTIONS.UPDATE_SELECTED_INDEX;
-    if (shouldOpenMenu) {
-      return openMenu(currentPluginState, {
-        tr,
-        triggerHandler: params.triggerHandler,
-        inputMethod: params.inputMethod
-      });
-    } else if (shouldCloseMenu) {
-      return closeMenu(currentPluginState);
-    } else if (shouldUpdateQuery) {
-      return {
-        ...currentPluginState,
-        query: params.query
-      };
-    } else if (shouldUpdateListItems) {
-      const {
-        items
-      } = params;
-      const {
-        selectedIndex
-      } = currentPluginState;
-      return {
-        ...currentPluginState,
-        items,
-        selectedIndex: Math.max(selectedIndex >= items.length ? items.length - 1 : selectedIndex, -1)
-      };
-    } else if (shouldUpdateSelectedIndex) {
-      return {
-        ...currentPluginState,
-        selectedIndex: params.selectedIndex
-      };
-    }
-    if (tr.docChanged) {
-      const {
-        decorationSet
-      } = currentPluginState;
-      const onRemove = () => {
-        // Make sure we are unmounting the component
-        // from the react tree when this decoration is removed
-        removeDecorations(currentPluginState.decorationSet);
-      };
-      const mappedDecorationSet = decorationSet.map(tr.mapping, tr.doc, {
-        onRemove
-      });
-
-      // return same pluginState if decorationSet did not change
-      if (mappedDecorationSet === currentPluginState.decorationSet) {
-        return currentPluginState;
-      }
-      return {
-        ...currentPluginState,
-        decorationSet: mappedDecorationSet
-      };
-    }
-    return currentPluginState;
-  };
-};

package/dist/es2019/plugins/type-ahead/pm-plugins/utils.js

@@ -1,12 +0,0 @@
-import { pluginKey } from './key';
-export const isInsertionTransaction = (transactions, action) => {
-  var _tr$getMeta2;
-  const tr = transactions.find(tr => {
-    var _tr$getMeta;
-    return ((_tr$getMeta = tr.getMeta(pluginKey)) === null || _tr$getMeta === void 0 ? void 0 : _tr$getMeta.action) === action;
-  });
-  if (!tr) {
-    return null;
-  }
-  return (_tr$getMeta2 = tr.getMeta(pluginKey)) === null || _tr$getMeta2 === void 0 ? void 0 : _tr$getMeta2.params;
-};

package/dist/es2019/plugins/type-ahead/stats-modifier.js

@@ -1,33 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-export class StatsModifier {
-  constructor() {
-    _defineProperty(this, "startedAt", 0);
-    _defineProperty(this, "endedAt", 0);
-    _defineProperty(this, "keyCount", {
-      arrowUp: 0,
-      arrowDown: 0
-    });
-    _defineProperty(this, "increaseArrowUp", () => {
-      this.keyCount.arrowUp += 1;
-    });
-    _defineProperty(this, "increaseArrowDown", () => {
-      this.keyCount.arrowDown += 1;
-    });
-    _defineProperty(this, "serialize", () => {
-      var _this$keyCount, _this$keyCount2;
-      return {
-        startedAt: this.startedAt,
-        endedAt: performance.now(),
-        keyCount: {
-          arrowUp: ((_this$keyCount = this.keyCount) === null || _this$keyCount === void 0 ? void 0 : _this$keyCount.arrowUp) || 0,
-          arrowDown: ((_this$keyCount2 = this.keyCount) === null || _this$keyCount2 === void 0 ? void 0 : _this$keyCount2.arrowDown) || 0
-        }
-      };
-    });
-    this.startedAt = performance.now();
-    this.keyCount = {
-      arrowUp: 0,
-      arrowDown: 0
-    };
-  }
-}

package/dist/es2019/plugins/type-ahead/transforms/close-type-ahead.js

@@ -1,7 +0,0 @@
-import { pluginKey } from '../pm-plugins/key';
-import { ACTIONS } from '../pm-plugins/actions';
-export const closeTypeAhead = tr => {
-  return tr.setMeta(pluginKey, {
-    action: ACTIONS.CLOSE_TYPE_AHEAD
-  });
-};

package/dist/es2019/plugins/type-ahead/transforms/open-typeahead-at-cursor.js

@@ -1,71 +0,0 @@
-import { TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { GapCursorSelection } from '@atlaskit/editor-common/selection';
-import { pluginKey } from '../pm-plugins/key';
-import { ACTIONS } from '../pm-plugins/actions';
-export const openTypeAhead = props => tr => {
-  const {
-    triggerHandler,
-    inputMethod,
-    query
-  } = props;
-  tr.setMeta(pluginKey, {
-    action: ACTIONS.OPEN_TYPEAHEAD_AT_CURSOR,
-    params: {
-      triggerHandler,
-      inputMethod,
-      query
-    }
-  });
-};
-export const openTypeAheadAtCursor = ({
-  triggerHandler,
-  inputMethod,
-  query
-}) => ({
-  tr
-}) => {
-  openTypeAhead({
-    triggerHandler,
-    inputMethod,
-    query
-  })(tr);
-  const {
-    selection
-  } = tr;
-  if (!(selection instanceof TextSelection || selection instanceof GapCursorSelection)) {
-    return tr;
-  }
-  if (selection instanceof GapCursorSelection) {
-    // Create space for the typeahead menu in gap cursor
-    tr.insertText(' ');
-    // delete 1 pos before wherever selection is now - that will delete the empty space
-    tr.delete(tr.selection.from - 1, tr.selection.from);
-  } else {
-    var _selection$$head, _selection$$head$pare, _selection$$head$pare2, _selection$$head$pare3;
-    if (!selection.$cursor) {
-      tr.deleteSelection();
-      return tr;
-    }
-
-    // Search & Destroy placeholder
-    const cursorPos = selection.$cursor.pos;
-    const nodeAtCursor = tr.doc.nodeAt(cursorPos);
-    const isPlaceholderAtCursorPosition = nodeAtCursor && nodeAtCursor.type.name === 'placeholder';
-    if (nodeAtCursor && isPlaceholderAtCursorPosition) {
-      tr.delete(cursorPos, cursorPos + nodeAtCursor.nodeSize);
-    }
-
-    // ME-2375 remove the superfluous '@' inserted before decoration
-    // by composition (https://github.com/ProseMirror/prosemirror/issues/903)
-    //
-    // Update:
-    // Now also handles any use case with superfluous typeahead triggers (ie. '@', ':', '/')
-    // being inserted due to composition by checking if we have the trigger
-    // directly before the typeahead. This should not happen unless it has
-    // been eroneously added because we require whitespace/newline for typeahead.
-    if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head$pare = _selection$$head.parent) !== null && _selection$$head$pare !== void 0 && _selection$$head$pare.textContent) && (_selection$$head$pare2 = (_selection$$head$pare3 = selection.$head.parent.textContent).endsWith) !== null && _selection$$head$pare2 !== void 0 && _selection$$head$pare2.call(_selection$$head$pare3, triggerHandler.trigger)) {
-      tr.delete(cursorPos - 1, cursorPos);
-    }
-  }
-  return tr;
-};

package/dist/es2019/plugins/type-ahead/transforms/set-selection-before-query.js

@@ -1,10 +0,0 @@
-import { TextSelection } from '@atlaskit/editor-prosemirror/state';
-export const setSelectionBeforeQuery = rawText => tr => {
-  const currentPosition = tr.selection.$from.pos;
-  const positionBeforeRawText = Math.max(currentPosition - rawText.length, 0);
-  const resolvedPositionBeforeText = tr.doc.resolve(positionBeforeRawText);
-  const nextSelection = TextSelection.findFrom(resolvedPositionBeforeText, -1, true);
-  if (nextSelection) {
-    tr.setSelection(nextSelection);
-  }
-};

package/dist/es2019/plugins/type-ahead/types.js

@@ -1 +0,0 @@
-export {};