@atlaskit/editor-common 74.29.3 → 74.31.0

package/dist/es2019/mark/commands.js

@@ -0,0 +1,205 @@
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+// eslint-disable-next-line no-duplicate-imports
+
+import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
+const SMART_TO_ASCII = {
+  '…': '...',
+  '→': '->',
+  '←': '<-',
+  '–': '--',
+  '“': '"',
+  '”': '"',
+  '‘': "'",
+  '’': "'"
+};
+const FIND_SMART_CHAR = new RegExp(`[${Object.keys(SMART_TO_ASCII).join('')}]`, 'g');
+const isNodeTextBlock = schema => {
+  const {
+    mention,
+    text,
+    emoji
+  } = schema.nodes;
+  return (node, _, parent) => {
+    if (node.type === mention || node.type === emoji || node.type === text) {
+      return parent === null || parent === void 0 ? void 0 : parent.isTextblock;
+    }
+    return;
+  };
+};
+const replaceSmartCharsToAscii = (position, textContent, tr) => {
+  const {
+    schema
+  } = tr.doc.type;
+  let match;
+  while (match = FIND_SMART_CHAR.exec(textContent)) {
+    const {
+      0: smartChar,
+      index: offset
+    } = match;
+    const replacePos = tr.mapping.map(position + offset);
+    const replacementText = schema.text(SMART_TO_ASCII[smartChar]);
+    tr.replaceWith(replacePos, replacePos + smartChar.length, replacementText);
+  }
+};
+const replaceMentionOrEmojiForTextContent = (position, nodeSize, textContent, tr) => {
+  const currentPos = tr.mapping.map(position);
+  const {
+    schema
+  } = tr.doc.type;
+  tr.replaceWith(currentPos, currentPos + nodeSize, schema.text(textContent));
+};
+export function filterChildrenBetween(doc, from, to, predicate) {
+  const results = [];
+  doc.nodesBetween(from, to, (node, pos, parent) => {
+    if (predicate(node, pos, parent)) {
+      results.push({
+        node,
+        pos
+      });
+    }
+  });
+  return results;
+}
+export const transformSmartCharsMentionsAndEmojis = (from, to, tr) => {
+  const {
+    schema
+  } = tr.doc.type;
+  const {
+    mention,
+    text,
+    emoji
+  } = schema.nodes;
+  // Traverse through all the nodes within the range and replace them with their plaintext counterpart
+  const children = filterChildrenBetween(tr.doc, from, to, isNodeTextBlock(schema));
+  children.forEach(({
+    node,
+    pos
+  }) => {
+    if (node.type === mention || node.type === emoji) {
+      // Convert gracefully when no text found, ProseMirror will blow up if you try to create a node with an empty string or undefined
+      let replacementText = node.attrs.text;
+      if (typeof replacementText === 'undefined' || replacementText === '') {
+        replacementText = `${node.type.name} text missing`;
+      }
+      replaceMentionOrEmojiForTextContent(pos, node.nodeSize, replacementText, tr);
+    } else if (node.type === text && node.text) {
+      const replacePosition = pos > from ? pos : from;
+      const textToReplace = pos > from ? node.text : node.text.substr(from - pos);
+      replaceSmartCharsToAscii(replacePosition, textToReplace, tr);
+    }
+  });
+};
+export const applyMarkOnRange = (from, to, removeMark, mark, tr) => {
+  const {
+    schema
+  } = tr.doc.type;
+  const {
+    code
+  } = schema.marks;
+  if (mark.type === code) {
+    transformSmartCharsMentionsAndEmojis(from, to, tr);
+  }
+  tr.doc.nodesBetween(tr.mapping.map(from), tr.mapping.map(to), (node, pos) => {
+    if (!node.isText) {
+      return true;
+    }
+
+    // This is an issue when the user selects some text.
+    // We need to check if the current node position is less than the range selection from.
+    // If it’s true, that means we should apply the mark using the range selection,
+    // not the current node position.
+    const nodeBetweenFrom = Math.max(pos, tr.mapping.map(from));
+    const nodeBetweenTo = Math.min(pos + node.nodeSize, tr.mapping.map(to));
+    if (removeMark) {
+      tr.removeMark(nodeBetweenFrom, nodeBetweenTo, mark);
+    } else {
+      tr.addMark(nodeBetweenFrom, nodeBetweenTo, mark);
+    }
+    return true;
+  });
+  return tr;
+};
+const entireSelectionContainsMark = (mark, doc, fromPos, toPos) => {
+  let onlyContainsMark = true;
+  doc.nodesBetween(fromPos, toPos, node => {
+    // Skip recursion once we've found text which doesn't include the mark
+    if (!onlyContainsMark) {
+      return false;
+    }
+    if (node.isText) {
+      onlyContainsMark && (onlyContainsMark = mark.isInSet(node.marks));
+    }
+  });
+  return onlyContainsMark;
+};
+const toggleMarkInRange = mark => (state, dispatch) => {
+  const {
+    tr
+  } = state;
+  if (state.selection instanceof CellSelection) {
+    let removeMark = true;
+    const cells = [];
+    state.selection.forEachCell((cell, cellPos) => {
+      cells.push({
+        node: cell,
+        pos: cellPos
+      });
+      const from = cellPos;
+      const to = cellPos + cell.nodeSize;
+      removeMark && (removeMark = entireSelectionContainsMark(mark, state.doc, from, to));
+    });
+    for (let i = cells.length - 1; i >= 0; i--) {
+      const cell = cells[i];
+      const from = cell.pos;
+      const to = from + cell.node.nodeSize;
+      applyMarkOnRange(from, to, removeMark, mark, tr);
+    }
+  } else {
+    const {
+      $from,
+      $to
+    } = state.selection;
+    // We decide to remove the mark only if the entire selection contains the mark
+    // Examples with *bold* text
+    // Scenario 1: Selection contains both bold and non-bold text -> bold entire selection
+    // Scenario 2: Selection contains only bold text -> un-bold entire selection
+    // Scenario 3: Selection contains no bold text -> bold entire selection
+    const removeMark = entireSelectionContainsMark(mark, state.doc, $from.pos, $to.pos);
+    applyMarkOnRange($from.pos, $to.pos, removeMark, mark, tr);
+  }
+  if (tr.docChanged) {
+    if (dispatch) {
+      dispatch(tr);
+    }
+    return true;
+  }
+  return false;
+};
+
+/**
+ * A wrapper over the default toggleMark, except when we have a selection
+ * we only toggle marks on text nodes rather than inline nodes.
+ * @param markType
+ * @param attrs
+ */
+export const toggleMark = (markType, attrs) => (state, dispatch) => {
+  const mark = markType.create(attrs);
+
+  // For cursor selections we can use the default behaviour.
+  if (state.selection instanceof TextSelection && state.selection.$cursor) {
+    const {
+      tr
+    } = state;
+    if (mark.isInSet(state.storedMarks || state.selection.$cursor.marks())) {
+      tr.removeStoredMark(mark);
+    } else {
+      tr.addStoredMark(mark);
+    }
+    if (dispatch) {
+      dispatch(tr);
+      return true;
+    }
+    return false;
+  }
+  return toggleMarkInRange(mark)(state, dispatch);
+};

package/dist/es2019/mark/index.js

@@ -0,0 +1 @@
+export { transformSmartCharsMentionsAndEmojis, applyMarkOnRange, toggleMark, filterChildrenBetween } from './commands';

package/dist/es2019/messages/full-page.js

@@ -0,0 +1,18 @@
+import { defineMessages } from 'react-intl-next';
+export const messages = defineMessages({
+  toolbarLabel: {
+    id: 'fabric.editor.toolbarLabel',
+    defaultMessage: 'Editor toolbar',
+    description: 'Label for the ARIA region landmark'
+  },
+  pageActionsLabel: {
+    id: 'fabric.editor.pageActionsLabel',
+    defaultMessage: 'Page actions',
+    description: 'Label for the ARIA region landmark'
+  },
+  editableContentLabel: {
+    id: 'fabric.editor.editableContentLabel',
+    defaultMessage: 'Editable content',
+    description: 'Label for the ARIA region landmark'
+  }
+});

package/dist/es2019/messages/index.js

@@ -7,6 +7,7 @@ export { codeBlockButtonMessages } from './codeBlockButton';
 export { toolbarInsertBlockMessages } from './insert-block';
 export { toolbarMessages as mediaAndEmbedToolbarMessages } from './media-and-embed-toolbar';
 export { messages as cardMessages } from './card';
+export { messages as fullPageMessages } from './full-page';
 export default defineMessages({
   layoutFixedWidth: {
     id: 'fabric.editor.layoutFixedWidth',

package/dist/es2019/monitoring/error.js

@@ -1,6 +1,6 @@
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "74.29.3";
+const packageVersion = "74.31.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

package/dist/es2019/node-width/index.js

@@ -102,4 +102,11 @@ export const getTableContainerWidth = node => {
     return node.attrs.width;
   }
   return layoutToWidth[node.attrs.layout];
+};
+export const getTableWidthWithNumberColumn = (node, offset) => {
+  const isNumberColumnEnabled = node.attrs.isNumberColumnEnabled;
+  if (isNumberColumnEnabled && offset > 0) {
+    return getTableContainerWidth(node) - offset;
+  }
+  return getTableContainerWidth(node);
 };

package/dist/es2019/ui/DropList/index.js

@@ -8,7 +8,7 @@ import { themed } from '@atlaskit/theme/components';
 import { borderRadius } from '@atlaskit/theme/constants';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "74.29.3";
+const packageVersion = "74.31.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 class DropList extends Component {

package/dist/es2019/ui/Toolbar/index.js

@@ -0,0 +1 @@
+export const EDIT_AREA_ID = 'ak-editor-textarea';

package/dist/es2019/ui/index.js

@@ -25,4 +25,5 @@ export { snapTo, handleSides, imageAlignmentMap } from './ResizerLegacy/utils';
 export { wrapperStyle } from './ResizerLegacy/styled';
 export { panelTextInput } from './PanelTextInput/styles';
 export { default as PanelTextInput } from './PanelTextInput';
-export { default as Announcer } from './Announcer/announcer';
+export { default as Announcer } from './Announcer/announcer';
+export { EDIT_AREA_ID } from './Toolbar';

package/dist/es2019/ui-menu/DropdownMenu/index.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /** @jsx jsx */
-import React, { PureComponent } from 'react';
+import React, { PureComponent, useContext } from 'react';
 import { css, jsx } from '@emotion/react';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { CustomItem, MenuGroup } from '@atlaskit/menu';
@@ -10,6 +10,7 @@ import { B100, DN600, DN80, N70, N900 } from '@atlaskit/theme/colors';
 import { themed } from '@atlaskit/theme/components';
 import Tooltip from '@atlaskit/tooltip';
 import { DropdownMenuSharedCssClassName } from '../../styles';
+import { KeyDownHandlerContext } from '../../ui-menu/ToolbarArrowKeyNavigationProvider';
 import { withReactEditorViewOuterListeners } from '../../ui-react';
 import DropList from '../../ui/DropList';
 import Popup from '../../ui/Popup';
@@ -319,4 +320,17 @@ function DropdownMenuItem({
     }, dropListItem);
   }
   return dropListItem;
-}
+}
+export const DropdownMenuWithKeyboardNavigation = /*#__PURE__*/React.memo(({
+  ...props
+}) => {
+  const keyDownHandlerContext = useContext(KeyDownHandlerContext);
+  //This context is to handle the tab, Arrow Right/Left key events for dropdown.
+  //Default context has the void callbacks for above key events
+  return jsx(DropdownMenuWrapper, _extends({
+    arrowKeyNavigationProviderOptions: {
+      ...props.arrowKeyNavigationProviderOptions,
+      keyDownHandlerContext
+    }
+  }, props));
+});

package/dist/es2019/ui-menu/ToolbarArrowKeyNavigationProvider/index.js

@@ -0,0 +1,209 @@
+/** @jsx jsx */
+/* eslint-disable no-console */
+import React, { useCallback, useLayoutEffect, useRef } from 'react';
+import { css, jsx } from '@emotion/react';
+import { fullPageMessages as messages } from '../../messages';
+import { EDIT_AREA_ID } from '../../ui';
+/*
+ **  The context is used to handle the keydown events of submenus.
+ **  Because the keyboard navigation is explicitly managed for main toolbar items
+ **  Few key presses such as Tab,Arrow Right/Left need ot be handled here via context
+ */
+export const KeyDownHandlerContext = /*#__PURE__*/React.createContext({
+  handleArrowLeft: () => {},
+  handleArrowRight: () => {},
+  handleTab: () => {}
+});
+const centeredToolbarContainer = css`
+  display: flex;
+  width: 100%;
+  align-items: center;
+`;
+
+/**
+ * This component is a wrapper of main toolbar which listens to keydown events of children
+ * and handles left/right arrow key navigation for all focusable elements
+ * @param
+ * @returns
+ */
+export const ToolbarArrowKeyNavigationProvider = ({
+  children,
+  editorView,
+  childComponentSelector,
+  handleEscape,
+  disableArrowKeyNavigation,
+  isShortcutToFocusToolbar,
+  editorAppearance,
+  useStickyToolbar,
+  intl
+}) => {
+  const wrapperRef = useRef(null);
+  const selectedItemIndex = useRef(0);
+  const incrementIndex = useCallback(list => {
+    let index = 0;
+    if (document.activeElement) {
+      index = list.indexOf(document.activeElement);
+      index = (index + 1) % list.length;
+    }
+    selectedItemIndex.current = index;
+  }, []);
+  const decrementIndex = useCallback(list => {
+    let index = 0;
+    if (document.activeElement) {
+      index = list.indexOf(document.activeElement);
+      index = (list.length + index - 1) % list.length;
+    }
+    selectedItemIndex.current = index;
+  }, []);
+  const handleArrowRight = () => {
+    var _filteredFocusableEle;
+    const filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    incrementIndex(filteredFocusableElements);
+    (_filteredFocusableEle = filteredFocusableElements[selectedItemIndex.current]) === null || _filteredFocusableEle === void 0 ? void 0 : _filteredFocusableEle.focus();
+  };
+  const handleArrowLeft = () => {
+    var _filteredFocusableEle2;
+    const filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    decrementIndex(filteredFocusableElements);
+    (_filteredFocusableEle2 = filteredFocusableElements[selectedItemIndex.current]) === null || _filteredFocusableEle2 === void 0 ? void 0 : _filteredFocusableEle2.focus();
+  };
+  const handleTab = () => {
+    var _filteredFocusableEle3;
+    const filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    (_filteredFocusableEle3 = filteredFocusableElements[selectedItemIndex.current]) === null || _filteredFocusableEle3 === void 0 ? void 0 : _filteredFocusableEle3.focus();
+  };
+  const handleTabLocal = () => {
+    const filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+    filteredFocusableElements.forEach(element => {
+      element.setAttribute('tabindex', '-1');
+    });
+    filteredFocusableElements[selectedItemIndex.current].setAttribute('tabindex', '0');
+  };
+  const focusAndScrollToElement = (element, scrollToElement = true) => {
+    if (scrollToElement) {
+      element === null || element === void 0 ? void 0 : element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center',
+        inline: 'nearest'
+      });
+    }
+    element.focus();
+  };
+  const submenuKeydownHandleContext = {
+    handleArrowLeft,
+    handleArrowRight,
+    handleTab
+  };
+  useLayoutEffect(() => {
+    if (!wrapperRef.current || disableArrowKeyNavigation) {
+      return;
+    }
+    const {
+      current: element
+    } = wrapperRef;
+
+    /**
+     * To handle the key events on the list
+     * @param event
+     */
+    const handleKeyDown = event => {
+      var _document$querySelect, _document$querySelect2, _wrapperRef$current;
+      //To trap the focus inside the horizontal toolbar for left and right arrow keys
+      const targetElement = event.target;
+
+      //To filter out the events outside the child component
+      if (!targetElement.closest(`${childComponentSelector}`)) {
+        return;
+      }
+
+      //The key events are from child components such as dropdown menus / popups are ignored
+      if ((_document$querySelect = document.querySelector('[data-role="droplistContent"], [data-test-id="color-picker-menu"], [data-emoji-picker-container="true"]')) !== null && _document$querySelect !== void 0 && _document$querySelect.contains(targetElement) || (_document$querySelect2 = document.querySelector('[data-test-id="color-picker-menu"]')) !== null && _document$querySelect2 !== void 0 && _document$querySelect2.contains(targetElement) || event.key === 'ArrowUp' || event.key === 'ArrowDown' || disableArrowKeyNavigation) {
+        return;
+      }
+      const menuWrapper = document.querySelector('.menu-key-handler-wrapper');
+      if (menuWrapper) {
+        // if menu wrapper exists, then a menu is open and arrow keys will be handled by MenuArrowKeyNavigationProvider
+        return;
+      }
+      const filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+      if (!filteredFocusableElements || (filteredFocusableElements === null || filteredFocusableElements === void 0 ? void 0 : filteredFocusableElements.length) === 0) {
+        return;
+      }
+
+      //This is kind of hack to reset the current focused toolbar item
+      //to handle some use cases such as Tab in/out of main toolbar
+      if (!((_wrapperRef$current = wrapperRef.current) !== null && _wrapperRef$current !== void 0 && _wrapperRef$current.contains(targetElement))) {
+        selectedItemIndex.current = -1;
+      } else {
+        selectedItemIndex.current = filteredFocusableElements.indexOf(targetElement) > -1 ? filteredFocusableElements.indexOf(targetElement) : selectedItemIndex.current;
+      }
+
+      //do not scroll to focused element for sticky toolbar when navigating with arrows to avoid unnesessary scroll jump
+      const allowScrollToElement = !(editorAppearance === 'comment' && !!useStickyToolbar);
+      switch (event.key) {
+        case 'ArrowRight':
+          incrementIndex(filteredFocusableElements);
+          focusAndScrollToElement(filteredFocusableElements[selectedItemIndex.current], allowScrollToElement);
+          event.preventDefault();
+          break;
+        case 'ArrowLeft':
+          decrementIndex(filteredFocusableElements);
+          focusAndScrollToElement(filteredFocusableElements[selectedItemIndex.current], allowScrollToElement);
+          event.preventDefault();
+          break;
+        case 'Tab':
+          handleTabLocal();
+          break;
+        case 'Escape':
+          handleEscape(event);
+          break;
+        default:
+      }
+    };
+    const globalKeyDownHandler = event => {
+      //To focus the first element in the toolbar
+      if (isShortcutToFocusToolbar(event)) {
+        var _filteredFocusableEle4, _filteredFocusableEle5;
+        const filteredFocusableElements = getFilteredFocusableElements(wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current);
+        (_filteredFocusableEle4 = filteredFocusableElements[0]) === null || _filteredFocusableEle4 === void 0 ? void 0 : _filteredFocusableEle4.focus();
+        (_filteredFocusableEle5 = filteredFocusableElements[0]) === null || _filteredFocusableEle5 === void 0 ? void 0 : _filteredFocusableEle5.scrollIntoView({
+          behavior: 'smooth',
+          block: 'center',
+          inline: 'nearest'
+        });
+      }
+    };
+    element === null || element === void 0 ? void 0 : element.addEventListener('keydown', handleKeyDown);
+    const editorViewDom = editorView === null || editorView === void 0 ? void 0 : editorView.dom;
+    if (isShortcutToFocusToolbar) {
+      editorViewDom === null || editorViewDom === void 0 ? void 0 : editorViewDom.addEventListener('keydown', globalKeyDownHandler);
+    }
+    return () => {
+      element === null || element === void 0 ? void 0 : element.removeEventListener('keydown', handleKeyDown);
+      if (isShortcutToFocusToolbar) {
+        editorViewDom === null || editorViewDom === void 0 ? void 0 : editorViewDom.removeEventListener('keydown', globalKeyDownHandler);
+      }
+    };
+  }, [selectedItemIndex, wrapperRef, editorView, disableArrowKeyNavigation, handleEscape, childComponentSelector, incrementIndex, decrementIndex, isShortcutToFocusToolbar, editorAppearance, useStickyToolbar]);
+  return jsx("div", {
+    css: editorAppearance === 'comment' && centeredToolbarContainer,
+    className: "custom-key-handler-wrapper",
+    ref: wrapperRef,
+    role: "toolbar",
+    "aria-label": intl.formatMessage(messages.toolbarLabel),
+    "aria-controls": EDIT_AREA_ID
+  }, jsx(KeyDownHandlerContext.Provider, {
+    value: submenuKeydownHandleContext
+  }, children));
+};
+function getFocusableElements(rootNode) {
+  if (!rootNode) {
+    return [];
+  }
+  const focusableModalElements = rootNode.querySelectorAll('a[href], button:not([disabled]), textarea, input, select, div[tabindex="-1"], div[tabindex="0"]') || [];
+  return Array.from(focusableModalElements);
+}
+function getFilteredFocusableElements(rootNode) {
+  //The focusable elements from child components such as dropdown menus / popups are ignored
+  return getFocusableElements(rootNode).filter(elm => !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons'));
+}

package/dist/es2019/ui-menu/index.js

@@ -1,6 +1,7 @@
-export { default as DropdownMenu } from '../ui-menu/DropdownMenu';
-export { default as ToolbarButton, TOOLBAR_BUTTON } from '../ui-menu/ToolbarButton';
-export { ArrowKeyNavigationProvider } from '../ui-menu/ArrowKeyNavigationProvider';
-export { ArrowKeyNavigationType } from '../ui-menu/ArrowKeyNavigationProvider/types';
+export { default as DropdownMenu, DropdownMenuWithKeyboardNavigation } from './DropdownMenu';
+export { default as ToolbarButton, TOOLBAR_BUTTON } from './ToolbarButton';
+export { ArrowKeyNavigationProvider } from './ArrowKeyNavigationProvider';
+export { ToolbarArrowKeyNavigationProvider, KeyDownHandlerContext } from './ToolbarArrowKeyNavigationProvider';
+export { ArrowKeyNavigationType } from './ArrowKeyNavigationProvider/types';
 export { ColorPaletteArrowKeyNavigationProvider } from './ArrowKeyNavigationProvider/ColorPaletteArrowKeyNavigationProvider';
 export { default as Dropdown } from './Dropdown';

package/dist/es2019/utils/commands.js

@@ -1,4 +1,7 @@
-export const filter = (predicates, cmd) => {
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { GapCursorSelection } from '../selection';
+import { isEmptyParagraph } from './editor-core-utils';
+const filter = (predicates, cmd) => {
   return function (state, dispatch, view) {
     if (!Array.isArray(predicates)) {
       predicates = [predicates];
@@ -8,4 +11,105 @@ export const filter = (predicates, cmd) => {
     }
     return cmd(state, dispatch, view) || false;
   };
-};
+};
+
+/**
+ * Walk forwards from a position until we encounter the (inside) start of
+ * the next node, or reach the end of the document.
+ *
+ * @param $startPos Position to start walking from.
+ */
+export const walkNextNode = $startPos => {
+  let $pos = $startPos;
+
+  // invariant 1: don't walk past the end of the document
+  // invariant 2: we are at the beginning or
+  //              we haven't walked to the start of *any* node
+  //              parentOffset includes textOffset.
+  while ($pos.pos < $pos.doc.nodeSize - 2 && ($pos.pos === $startPos.pos || $pos.parentOffset > 0)) {
+    $pos = $pos.doc.resolve($pos.pos + 1);
+  }
+  return {
+    $pos: $pos,
+    foundNode: $pos.pos < $pos.doc.nodeSize - 2
+  };
+};
+
+/**
+ * Walk backwards from a position until we encounter the (inside) end of
+ * the previous node, or reach the start of the document.
+ *
+ * @param $startPos Position to start walking from.
+ */
+export const walkPrevNode = $startPos => {
+  let $pos = $startPos;
+  while ($pos.pos > 0 && ($pos.pos === $startPos.pos || $pos.parentOffset < $pos.parent.nodeSize - 2)) {
+    $pos = $pos.doc.resolve($pos.pos - 1);
+  }
+  return {
+    $pos: $pos,
+    foundNode: $pos.pos > 0
+  };
+};
+
+/**
+ * If the selection is empty, is inside a paragraph node and `canNextNodeMoveUp` is true then delete current paragraph
+ * and move the node below it up. The selection will be retained, to be placed in the moved node.
+ *
+ * @param canNextNodeMoveUp check if node directly after the selection is able to be brought up to selection
+ * @returns PM Command
+ */
+export const deleteEmptyParagraphAndMoveBlockUp = canNextNodeMoveUp => {
+  return (state, dispatch, view) => {
+    const {
+      selection: {
+        $from: {
+          pos,
+          parent
+        },
+        $head,
+        empty
+      },
+      tr,
+      doc
+    } = state;
+    const {
+      $pos
+    } = walkNextNode($head);
+    const nextPMNode = doc.nodeAt($pos.pos - 1);
+    if (empty && nextPMNode && canNextNodeMoveUp(nextPMNode) && isEmptyParagraph(parent) && view !== null && view !== void 0 && view.endOfTextblock('right')) {
+      tr.deleteRange(pos - 1, pos + 1);
+      if (dispatch) {
+        dispatch(tr);
+      }
+      return true;
+    }
+    return false;
+  };
+};
+export const insertContentDeleteRange = (tr, getSelectionResolvedPos, insertions, deletions) => {
+  insertions.forEach(contentInsert => {
+    let [content, pos] = contentInsert;
+    tr.insert(tr.mapping.map(pos), content);
+  });
+  deletions.forEach(deleteRange => {
+    let [firstPos, lastPos] = deleteRange;
+    tr.delete(tr.mapping.map(firstPos), tr.mapping.map(lastPos));
+  });
+  tr.setSelection(new TextSelection(getSelectionResolvedPos(tr)));
+};
+export const isEmptySelectionAtStart = state => {
+  const {
+    empty,
+    $from
+  } = state.selection;
+  return empty && ($from.parentOffset === 0 || state.selection instanceof GapCursorSelection);
+};
+export const isEmptySelectionAtEnd = state => {
+  const {
+    empty,
+    $from
+  } = state.selection;
+  return empty && ($from.end() === $from.pos || state.selection instanceof GapCursorSelection);
+};
+export { filter as filterCommand };