@atlaskit/editor-core 178.1.1 → 178.1.2

package/dist/es2019/plugins/selection/gap-cursor/actions.js

@@ -16,7 +16,6 @@ const mapDirection = {
   [Direction.BACKWARD]: -1,
   [Direction.FORWARD]: 1
 };
-
 function shouldHandleMediaGapCursor(dir, state) {
   const {
     doc,
@@ -24,30 +23,26 @@ function shouldHandleMediaGapCursor(dir, state) {
     selection
   } = state;
   let $pos = isBackward(dir) ? selection.$from : selection.$to;
-
   if (selection instanceof TextSelection) {
     // Should not use gap cursor if I am moving from a text selection into a media node
     if (dir === Direction.UP && !atTheBeginningOfDoc(state) || dir === Direction.DOWN && !atTheEndOfDoc(state)) {
       const media = getMediaNearPos(doc, $pos, schema, mapDirection[dir]);
-
       if (media) {
         return false;
       }
-    } // Should not use gap cursor if I am moving from a text selection into a media node with layout wrap-right or wrap-left
-
+    }
 
+    // Should not use gap cursor if I am moving from a text selection into a media node with layout wrap-right or wrap-left
     if (dir === Direction.LEFT || dir === Direction.RIGHT) {
       const media = getMediaNearPos(doc, $pos, schema, mapDirection[dir]);
       const {
         mediaSingle
       } = schema.nodes;
-
       if (media && media.type === mediaSingle && (media.attrs.layout === 'wrap-right' || media.attrs.layout === 'wrap-left')) {
         return false;
       }
     }
   }
-
   if (selection instanceof NodeSelection) {
     // Should not use gap cursor if I am moving left/right from media node with layout wrap right or wrap-left
     if (dir === Direction.LEFT || dir === Direction.RIGHT) {
@@ -55,33 +50,26 @@ function shouldHandleMediaGapCursor(dir, state) {
       const {
         mediaSingle
       } = schema.nodes;
-
       if (maybeMedia && maybeMedia.type === mediaSingle && (maybeMedia.attrs.layout === 'wrap-right' || maybeMedia.attrs.layout === 'wrap-left')) {
         return false;
       }
     }
   }
-
   return true;
 }
-
 export const shouldSkipGapCursor = (direction, state, $pos) => {
   const {
     doc,
     schema
   } = state;
-
   switch (direction) {
     case Direction.UP:
       if (atTheBeginningOfDoc(state)) {
         return false;
       }
-
       return isPositionNearTableRow($pos, schema, 'before') || isTextBlockNearPos(doc, schema, $pos, -1);
-
     case Direction.DOWN:
       return atTheEndOfDoc(state) || isTextBlockNearPos(doc, schema, $pos, 1) || isPositionNearTableRow($pos, schema, 'after');
-
     default:
       return false;
   }
@@ -93,79 +81,70 @@ export const arrow = (dir, endOfTextblock) => (state, dispatch, view) => {
     tr
   } = state;
   let $pos = isBackward(dir) ? selection.$from : selection.$to;
-  let mustMove = selection.empty; // start from text selection
+  let mustMove = selection.empty;
 
+  // start from text selection
   if (selection instanceof TextSelection) {
     // if cursor is in the middle of a text node, do nothing
     if (!endOfTextblock || !endOfTextblock(dir.toString())) {
       return false;
-    } // UP/DOWN jumps to the nearest texblock skipping gapcursor whenever possible
-
+    }
 
+    // UP/DOWN jumps to the nearest texblock skipping gapcursor whenever possible
     if (shouldSkipGapCursor(dir, state, $pos)) {
       return false;
-    } // otherwise resolve previous/next position
-
+    }
 
+    // otherwise resolve previous/next position
     $pos = doc.resolve(isBackward(dir) ? $pos.before() : $pos.after());
     mustMove = false;
   }
-
   if (selection instanceof NodeSelection) {
     if (selection.node.isInline) {
       return false;
     }
-
     if (dir === Direction.UP || dir === Direction.DOWN) {
       // We dont add gap cursor on node selections going up and down
       return false;
     }
   }
-
   if (!shouldHandleMediaGapCursor(dir, state)) {
     return false;
-  } // when jumping between block nodes at the same depth, we need to reverse cursor without changing ProseMirror position
-
+  }
 
-  if (selection instanceof GapCursorSelection && // next node allow gap cursor position
-  isValidTargetNode(isBackward(dir) ? $pos.nodeBefore : $pos.nodeAfter) && ( // gap cursor changes block node
+  // when jumping between block nodes at the same depth, we need to reverse cursor without changing ProseMirror position
+  if (selection instanceof GapCursorSelection &&
+  // next node allow gap cursor position
+  isValidTargetNode(isBackward(dir) ? $pos.nodeBefore : $pos.nodeAfter) && (
+  // gap cursor changes block node
   isBackward(dir) && selection.side === Side.LEFT || isForward(dir) && selection.side === Side.RIGHT)) {
     // reverse cursor position
     if (dispatch) {
       dispatch(tr.setSelection(new GapCursorSelection($pos, selection.side === Side.RIGHT ? Side.LEFT : Side.RIGHT)).scrollIntoView());
     }
-
     return true;
   }
-
   if (view) {
     const domAtPos = view.domAtPos.bind(view);
     const target = findDomRefAtPos($pos.pos, domAtPos);
-
     if (target && target.textContent === ZERO_WIDTH_SPACE) {
       return false;
     }
   }
-
   const nextSelection = GapCursorSelection.findFrom($pos, isBackward(dir) ? -1 : 1, mustMove);
-
   if (!nextSelection) {
     return false;
   }
-
   if (!isValidTargetNode(isForward(dir) ? nextSelection.$from.nodeBefore : nextSelection.$from.nodeAfter)) {
     // reverse cursor position
     if (dispatch) {
       dispatch(tr.setSelection(new GapCursorSelection(nextSelection.$from, isForward(dir) ? Side.LEFT : Side.RIGHT)).scrollIntoView());
     }
-
     return true;
   }
-
   if (dispatch) {
     dispatch(tr.setSelection(nextSelection).scrollIntoView());
   }
-
   return true;
 };
 export const deleteNode = dir => (state, dispatch) => {
@@ -177,30 +156,23 @@ export const deleteNode = dir => (state, dispatch) => {
     let {
       tr
     } = state;
-
     if (isBackward(dir)) {
       if (state.selection.side === 'left') {
         tr.setSelection(new GapCursorSelection($anchor, Side.RIGHT));
-
         if (dispatch) {
           dispatch(tr);
         }
-
         return true;
       }
-
       tr = removeNodeBefore(state.tr);
     } else if ($from.nodeAfter) {
       tr = tr.delete($from.pos, $from.pos + $from.nodeAfter.nodeSize);
     }
-
     if (dispatch) {
       dispatch(tr.setSelection(Selection.near(tr.doc.resolve(tr.mapping.map(state.selection.$from.pos)))).scrollIntoView());
     }
-
     return true;
   }
-
   return false;
 };
 export const setGapCursorAtPos = (position, side = Side.LEFT) => (state, dispatch) => {
@@ -208,79 +180,65 @@ export const setGapCursorAtPos = (position, side = Side.LEFT) => (state, dispatc
   if (position > state.doc.content.size) {
     return false;
   }
-
   const $pos = state.doc.resolve(position);
-
   if (GapCursorSelection.valid($pos)) {
     if (dispatch) {
       dispatch(state.tr.setSelection(new GapCursorSelection($pos, side)));
     }
-
     return true;
   }
-
   return false;
-}; // This function captures clicks outside of the ProseMirror contentEditable area
-// see also description of "handleClick" in gap-cursor pm-plugin
+};
 
+// This function captures clicks outside of the ProseMirror contentEditable area
+// see also description of "handleClick" in gap-cursor pm-plugin
 const captureCursorCoords = (event, editorRef, posAtCoords, tr) => {
-  const rect = editorRef.getBoundingClientRect(); // capture clicks before the first block element
+  const rect = editorRef.getBoundingClientRect();
 
+  // capture clicks before the first block element
   if (event.clientY < rect.top) {
     return {
       position: 0,
       side: Side.LEFT
     };
   }
-
   if (rect.left > 0) {
     // calculate start position of a node that is vertically at the same level
     const coords = posAtCoords({
       left: rect.left,
       top: event.clientY
     });
-
     if (coords && coords.inside > -1) {
       const $from = tr.doc.resolve(coords.inside);
       const start = $from.before(1);
       const side = event.clientX < rect.left ? Side.LEFT : Side.RIGHT;
       let position;
-
       if (side === Side.LEFT) {
         position = start;
       } else {
         const node = tr.doc.nodeAt(start);
-
         if (node) {
           position = start + node.nodeSize;
         }
       }
-
       return {
         position,
         side
       };
     }
   }
-
   return null;
 };
-
 export const setSelectionTopLevelBlocks = (tr, event, editorRef, posAtCoords, editorFocused) => {
   const cursorCoords = captureCursorCoords(event, editorRef, posAtCoords, tr);
-
   if (!cursorCoords) {
     return;
   }
-
   const $pos = cursorCoords.position !== undefined ? tr.doc.resolve(cursorCoords.position) : null;
-
   if ($pos === null) {
     return;
   }
-
   const isGapCursorAllowed = cursorCoords.side === Side.LEFT ? isValidTargetNode($pos.nodeAfter) : isValidTargetNode($pos.nodeBefore);
-
   if (isGapCursorAllowed && GapCursorSelection.valid($pos)) {
     // this forces PM to re-render the decoration node if we change the side of the gap cursor, it doesn't do it by default
     if (tr.selection instanceof GapCursorSelection) {
@@ -288,11 +246,11 @@ export const setSelectionTopLevelBlocks = (tr, event, editorRef, posAtCoords, ed
     } else {
       tr.setSelection(new GapCursorSelection($pos, cursorCoords.side));
     }
-  } // try to set text selection if the editor isnt focused
+  }
+  // try to set text selection if the editor isnt focused
   // if the editor is focused, we are most likely dragging a selection outside.
   else if (editorFocused === false) {
     const selectionTemp = Selection.findFrom($pos, cursorCoords.side === Side.LEFT ? 1 : -1, true);
-
     if (selectionTemp) {
       tr.setSelection(selectionTemp);
     }
@@ -303,12 +261,10 @@ export const setCursorForTopLevelBlocks = (event, editorRef, posAtCoords, editor
     tr
   } = state;
   setSelectionTopLevelBlocks(tr, event, editorRef, posAtCoords, editorFocused);
-
   if (tr.selectionSet && dispatch) {
     dispatch(tr);
     return true;
   }
-
   return false;
 };
 export const hasGapCursorPlugin = state => {

package/dist/es2019/plugins/selection/gap-cursor/direction.js

@@ -1,5 +1,4 @@
 export let Direction;
-
 (function (Direction) {
   Direction["UP"] = "up";
   Direction["RIGHT"] = "right";
@@ -8,7 +7,6 @@ export let Direction;
   Direction["BACKWARD"] = "backward";
   Direction["FORWARD"] = "forward";
 })(Direction || (Direction = {}));
-
 export function isBackward(dir) {
   return [Direction.UP, Direction.LEFT, Direction.BACKWARD].indexOf(dir) !== -1;
 }

package/dist/es2019/plugins/selection/gap-cursor/utils/place-gap-cursor.js

@@ -1,63 +1,51 @@
 import { getBreakoutModeFromTargetNode, isLeftCursor } from '../utils';
 import { Side } from '../selection';
+
 /**
  * We have a couple of nodes that require us to compute style
  * on different elements, ideally all nodes should be able to
  * compute the appropriate styles based on their wrapper.
  */
-
 const nestedCases = {
   'tableView-content-wrap': 'table',
   'mediaSingleView-content-wrap': '.rich-media-item'
 };
-
 const computeNestedStyle = dom => {
   const foundKey = Object.keys(nestedCases).find(className => dom.classList.contains(className));
   const nestedSelector = foundKey && nestedCases[foundKey];
-
   if (nestedSelector) {
     const nestedElement = dom.querySelector(nestedSelector);
-
     if (nestedElement) {
       return window.getComputedStyle(nestedElement);
     }
   }
 };
-
 const measureHeight = style => {
   return measureValue(style, ['height', 'padding-top', 'padding-bottom', 'border-top-width', 'border-bottom-width']);
 };
-
 const measureWidth = style => {
   return measureValue(style, ['width', 'padding-left', 'padding-right', 'border-left-width', 'border-right-width']);
 };
-
 const measureValue = (style, measureValues) => {
   const [base, ...contentBoxValues] = measureValues;
   const measures = [style.getPropertyValue(base)];
   const boxSizing = style.getPropertyValue('box-sizing');
-
   if (boxSizing === 'content-box') {
     contentBoxValues.forEach(value => {
       measures.push(style.getPropertyValue(value));
     });
   }
-
   let result = 0;
-
   for (let i = 0; i < measures.length; i++) {
     result += parseFloat(measures[i]);
   }
-
   return result;
 };
-
 const mutateElementStyle = (element, style, side) => {
   if (isLeftCursor(side)) {
     element.style.marginLeft = style.getPropertyValue('margin-left');
   } else {
     const marginRight = parseFloat(style.getPropertyValue('margin-right'));
-
     if (marginRight > 0) {
       element.style.marginLeft = `-${Math.abs(marginRight)}px`;
     } else {
@@ -65,7 +53,6 @@ const mutateElementStyle = (element, style, side) => {
     }
   }
 };
-
 export const toDOM = (view, getPos) => {
   const selection = view.state.selection;
   const {
@@ -79,18 +66,16 @@ export const toDOM = (view, getPos) => {
   const element = document.createElement('span');
   element.className = `ProseMirror-gapcursor ${isRightCursor ? '-right' : '-left'}`;
   element.appendChild(document.createElement('span'));
-
   if (dom instanceof HTMLElement && element.firstChild) {
     const style = computeNestedStyle(dom) || window.getComputedStyle(dom);
     const gapCursor = element.firstChild;
-    gapCursor.style.height = `${measureHeight(style)}px`; // TODO remove this table specific piece. need to figure out margin collapsing logic
+    gapCursor.style.height = `${measureHeight(style)}px`;
 
+    // TODO remove this table specific piece. need to figure out margin collapsing logic
     if (nodeStart !== 0 || node && node.type.name === 'table') {
       gapCursor.style.marginTop = style.getPropertyValue('margin-top');
     }
-
     const breakoutMode = node && getBreakoutModeFromTargetNode(node);
-
     if (breakoutMode) {
       gapCursor.setAttribute('layout', breakoutMode);
       gapCursor.style.width = `${measureWidth(style)}px`;
@@ -98,6 +83,5 @@ export const toDOM = (view, getPos) => {
       mutateElementStyle(gapCursor, style, selection.side);
     }
   }
-
   return element;
 };

package/dist/es2019/plugins/selection/gap-cursor/utils.js

@@ -11,72 +11,56 @@ export function getMediaNearPos(doc, $pos, schema, dir = -1) {
     media,
     mediaGroup
   } = schema.nodes;
-
   do {
     $currentPos = doc.resolve(dir === -1 ? $currentPos.before() : $currentPos.after());
-
     if (!$currentPos) {
       return null;
     }
-
     currentNode = (dir === -1 ? $currentPos.nodeBefore : $currentPos.nodeAfter) || $currentPos.parent;
-
     if (!currentNode || currentNode.type === schema.nodes.doc) {
       return null;
     }
-
     if (currentNode.type === mediaSingle || currentNode.type === media || currentNode.type === mediaGroup) {
       return currentNode;
     }
   } while ($currentPos.depth > 0);
-
   return null;
 }
 export const isTextBlockNearPos = (doc, schema, $pos, dir) => {
   let $currentPos = $pos;
-  let currentNode = dir === -1 ? $currentPos.nodeBefore : $currentPos.nodeAfter; // If next node is a text or a text block bail out early.
+  let currentNode = dir === -1 ? $currentPos.nodeBefore : $currentPos.nodeAfter;
 
+  // If next node is a text or a text block bail out early.
   if (currentNode && (currentNode.isTextblock || currentNode.isText)) {
     return true;
   }
-
   while ($currentPos.depth > 0) {
     $currentPos = doc.resolve(dir === -1 ? $currentPos.before() : $currentPos.after());
-
     if (!$currentPos) {
       return false;
     }
-
     currentNode = (dir === -1 ? $currentPos.nodeBefore : $currentPos.nodeAfter) || $currentPos.parent;
-
     if (!currentNode || currentNode.type === schema.nodes.doc) {
       return false;
     }
-
     if (currentNode.isTextblock) {
       return true;
     }
   }
-
   let childNode = currentNode;
-
   while (childNode && childNode.firstChild) {
     childNode = childNode.firstChild;
-
     if (childNode && (childNode.isTextblock || childNode.isText)) {
       return true;
     }
   }
-
   return false;
 };
 export function getBreakoutModeFromTargetNode(node) {
   let layout;
-
   if (node.attrs.layout) {
     layout = node.attrs.layout;
   }
-
   if (node.marks && node.marks.length) {
     layout = (node.marks.find(mark => mark.type.name === 'breakout') || {
       attrs: {
@@ -84,47 +68,41 @@ export function getBreakoutModeFromTargetNode(node) {
       }
     }).attrs.mode;
   }
-
   if (['wide', 'full-width'].indexOf(layout) === -1) {
     return '';
   }
-
   return layout;
 }
 export const isIgnoredClick = elem => {
   if (elem.nodeName === 'BUTTON' || elem.closest('button')) {
     return true;
-  } // check if we're clicking an image caption placeholder
-
+  }
 
+  // check if we're clicking an image caption placeholder
   if (elem.closest(`[data-id="${CAPTION_PLACEHOLDER_ID}"]`)) {
     return true;
-  } // check if target node has a parent table node
-
+  }
 
+  // check if target node has a parent table node
   let tableWrap;
   let node = elem;
-
   while (node) {
     if (node.className && (node.getAttribute('class') || '').indexOf(TableSharedCssClassName.TABLE_CONTAINER) > -1) {
       tableWrap = node;
       break;
     }
-
     node = node.parentNode;
   }
-
   if (tableWrap) {
     const rowControls = tableWrap.querySelector(`.${TableSharedCssClassName.TABLE_ROW_CONTROLS_WRAPPER}`);
     const isColumnControlsDecoration = elem && elem.classList && elem.classList.contains(TableSharedCssClassName.TABLE_COLUMN_CONTROLS_DECORATIONS);
     return rowControls && rowControls.contains(elem) || isColumnControlsDecoration;
-  } // Check if unsupported node selection
-  // (without this, selection requires double clicking in FF due to posAtCoords differences)
-
+  }
 
+  // Check if unsupported node selection
+  // (without this, selection requires double clicking in FF due to posAtCoords differences)
   if (elem.closest(`.${UnsupportedSharedCssClassName.BLOCK_CONTAINER}`)) {
     return true;
   }
-
   return false;
 };

package/dist/es2019/plugins/selection/index.js

@@ -4,7 +4,6 @@ import gapCursorPlugin from './pm-plugins/gap-cursor-main';
 import gapCursorKeymapPlugin from './pm-plugins/gap-cursor-keymap';
 export const selectionPlugin = options => ({
   name: 'selection',
-
   pmPlugins() {
     return [{
       name: 'selection',
@@ -23,6 +22,5 @@ export const selectionPlugin = options => ({
       plugin: () => gapCursorPlugin
     }];
   }
-
 });
 export default selectionPlugin;

package/dist/es2019/plugins/selection/plugin-factory.js

@@ -5,36 +5,34 @@ import { pluginFactory } from '../../utils/plugin-state-factory';
 import { reducer } from './reducer';
 import { selectionPluginKey } from './types';
 import { getDecorations, isSelectableContainerNode } from './utils';
-
 const handleDocChanged = (tr, pluginState) => {
   // in some collab edge cases mapping decorations could throw an error
   try {
     if (pluginState.decorationSet.find().length === 0 && (!tr.selectionSet || getDecorations(tr).find().length === 0)) {
       return pluginState;
     }
-
     const decorationSet = pluginState.decorationSet.map(tr.mapping, tr.doc);
-    return { ...pluginState,
+    return {
+      ...pluginState,
       decorationSet
     };
   } catch (error) {
-    return { ...pluginState,
+    return {
+      ...pluginState,
       decorationSet: DecorationSet.empty
     };
   }
 };
-
 const handleSelectionChanged = (tr, pluginState) => {
   // Reset relative selection pos when user clicks to select a node
   if ((tr.selection instanceof NodeSelection && isSelectableContainerNode(tr.selection.node) || tr.selection instanceof CellSelection) && !tr.getMeta(selectionPluginKey)) {
-    return { ...pluginState,
+    return {
+      ...pluginState,
       selectionRelativeToNode: undefined
     };
   }
-
   return pluginState;
 };
-
 export const {
   createCommand,
   getPluginState,

package/dist/es2019/plugins/selection/pm-plugins/events/create-selection-between.js

@@ -1,46 +1,35 @@
 import { NodeSelection, TextSelection } from 'prosemirror-state';
-
 function findEmptySelectableParentNodePosition($pos, isValidPosition) {
   const {
     doc
   } = $pos;
-
   if ($pos.pos + 1 > doc.content.size) {
     return null;
   }
-
   if ($pos.depth === 0) {
     if (isValidPosition($pos)) {
       return $pos;
     }
-
     return null;
   }
-
   if (isValidPosition($pos)) {
     return $pos;
   }
-
   const positionLevelUp = $pos.before();
   const resolvedPositionLevelUp = doc.resolve(positionLevelUp);
   return findEmptySelectableParentNodePosition(resolvedPositionLevelUp, isValidPosition);
 }
-
 const checkPositionNode = $pos => {
   const maybeNode = $pos.nodeAfter;
-
   if (!maybeNode || !maybeNode.isBlock) {
     return false;
   }
-
   if (maybeNode.isAtom) {
     return true;
   }
-
   const isParentEmpty = maybeNode.content.size === 0 || maybeNode.textContent === '';
   return isParentEmpty && NodeSelection.isSelectable(maybeNode);
 };
-
 function findNextSelectionPosition({
   $targetHead,
   $anchor,
@@ -48,32 +37,26 @@ function findNextSelectionPosition({
 }) {
   const direction = $anchor.pos < $targetHead.pos ? 'down' : 'up';
   const maybeNextPosition = findEmptySelectableParentNodePosition($targetHead, checkPositionNode);
-
   if (maybeNextPosition && maybeNextPosition.nodeAfter) {
     const nodeAfter = maybeNextPosition.nodeAfter;
     const pos = maybeNextPosition.pos;
     const nextPositionToSelect = direction === 'down' ? Math.min(nodeAfter.nodeSize + pos, doc.content.size) : Math.max(pos, 0);
     return doc.resolve(nextPositionToSelect);
   }
-
   return null;
 }
-
 export const onCreateSelectionBetween = (view, $anchor, $head) => {
   if ($anchor.pos === $head.pos) {
     return null;
   }
-
   const $nextHeadPosition = findNextSelectionPosition({
     $targetHead: $head,
     $anchor,
     doc: view.state.doc
   });
-
   if (!$nextHeadPosition) {
     return null;
   }
-
   const forcedTextSelection = TextSelection.create(view.state.doc, $anchor.pos, $nextHeadPosition.pos);
   return forcedTextSelection;
 };