@atlaskit/editor-core 172.0.3 → 172.1.0

package/dist/es2019/plugins/media/pm-plugins/main.js

@@ -65,8 +65,6 @@ export class MediaPluginStateImplementation {
 
     _defineProperty(this, "mediaGroupNodes", {});
 
-    _defineProperty(this, "mobileUploadComplete", {});
-
     _defineProperty(this, "pendingTask", Promise.resolve(null));
 
     _defineProperty(this, "destroyed", false);
@@ -177,7 +175,7 @@ export class MediaPluginStateImplementation {
     });
 
     _defineProperty(this, "insertFile", (mediaState, onMediaStateChanged, pickerType) => {
-      var _this$mediaOptions2;
+      var _mediaState$collectio, _this$mediaOptions2;
 
       const {
         state
@@ -185,14 +183,10 @@ export class MediaPluginStateImplementation {
       const mediaStateWithContext = { ...mediaState,
         contextId: this.contextIdentifierProvider ? this.contextIdentifierProvider.objectId : undefined
       };
-      const collection = this.collectionFromProvider();
+      const collection = (_mediaState$collectio = mediaState.collection) !== null && _mediaState$collectio !== void 0 ? _mediaState$collectio : this.collectionFromProvider();
 
       if (collection === undefined) {
         return;
-      }
-
-      if (this.mediaOptions && this.mediaOptions.allowMarkingUploadsAsIncomplete) {
-        this.mobileUploadComplete[mediaStateWithContext.id] = false;
       } // We need to dispatch the change to event dispatcher only for successful files
 
 
@@ -390,16 +384,12 @@ export class MediaPluginStateImplementation {
             attrs.collection = state.collection;
           }
 
-          this.updateMediaNodeAttrs(state.id, attrs, isMediaSingle(this.view.state.schema, state.fileMimeType)); // mark mobile upload as complete
-
-          this.mobileUploadComplete[attrs.id] = true;
+          this.updateMediaNodeAttrs(state.id, attrs, isMediaSingle(this.view.state.schema, state.fileMimeType));
           delete this.mediaGroupNodes[state.id];
           break;
       }
     });
 
-    _defineProperty(this, "isMobileUploadCompleted", mediaId => helpers.isMobileUploadCompleted(this, mediaId));
-
     _defineProperty(this, "removeNodeById", state => {
       const {
         id

package/dist/es2019/plugins/paste/handlers.js

@@ -2,10 +2,10 @@ import { closeHistory } from 'prosemirror-history';
 import { Fragment, Node as PMNode, Slice } from 'prosemirror-model';
 import { TextSelection, NodeSelection } from 'prosemirror-state';
 import { findParentNodeOfType, hasParentNodeOfType, safeInsert } from 'prosemirror-utils';
-import { compose, insideTable, isParagraph, isText, isLinkMark, processRawValue, insideTableCell } from '../../utils';
+import { compose, insideTable, isParagraph, isText, isLinkMark, insideTableCell } from '../../utils';
 import { mapSlice } from '../../utils/slice';
 import { INPUT_METHOD } from '../analytics';
-import { insertCard, queueCardsFromChangedTr } from '../card/pm-plugins/doc';
+import { queueCardsFromChangedTr } from '../card/pm-plugins/doc';
 import { GapCursorSelection, Side } from '../selection/gap-cursor-selection';
 import { linkifyContent } from '../hyperlink/utils';
 import { runMacroAutoConvert } from '../macro';
@@ -286,7 +286,7 @@ export function handlePastePreservingMarks(slice) {
   };
 }
 
-async function isLinkSmart(text, type, cardOptions) {
+async function getSmartLinkAdf(text, type, cardOptions) {
   if (!cardOptions.provider) {
     throw Error('No card provider found');
   }
@@ -312,7 +312,7 @@ function insertAutoMacro(slice, macro, view) {
 }
 
 export function handleMacroAutoConvert(text, slice, cardsOptions, extensionAutoConverter) {
-  return (state, _dispatch, view) => {
+  return (state, dispatch, view) => {
     let macro = null; // try to use auto convert from extension provider first
 
     if (extensionAutoConverter) {
@@ -337,22 +337,10 @@ export function handleMacroAutoConvert(text, slice, cardsOptions, extensionAutoC
           return insertAutoMacro(slice, macro, view);
         }
 
-        isLinkSmart(text, 'inline', cardsOptions).then(cardData => {
-          if (!view) {
-            throw new Error('Missing view');
-          }
-
-          const {
-            schema,
-            tr
-          } = view.state;
-          const cardAdf = processRawValue(schema, cardData);
-
-          if (!cardAdf) {
-            throw new Error('Received invalid ADF from CardProvider');
+        getSmartLinkAdf(text, 'inline', cardsOptions).then(() => {
+          if (dispatch) {
+            handleMarkdown(slice)(state, dispatch);
           }
-
-          view.dispatch(insertCard(tr, cardAdf, schema));
         }).catch(() => insertAutoMacro(slice, macro, view));
         return true;
       }

package/dist/es2019/plugins/paste/md.js

@@ -1,11 +1,15 @@
 import MarkdownIt from 'markdown-it';
 import linkify from './linkify-md-plugin';
+import newline from './newline-md-plugin';
+import paragraph from './paragraph-md-plugin';
 export const md = MarkdownIt('zero', {
   html: false
 });
 md.enable([// Process html entity - {, ¯, ", ...
 'entity', // Process escaped chars and hardbreaks
-'escape', 'newline']); // enable modified version of linkify plugin
+'escape', 'newline']);
+md.use(paragraph); // enable modified version of linkify plugin
 // @see https://product-fabric.atlassian.net/browse/ED-3097
 
-md.use(linkify);
+md.use(linkify);
+md.use(newline);

package/dist/es2019/plugins/paste/newline-md-plugin.js

@@ -0,0 +1,56 @@
+// ED-15363: modified version of the original newline plugin
+// https://github.com/markdown-it/markdown-it/blob/master/lib/rules_inline/newline.js
+const newline = (state, silent) => {
+  let pmax,
+      // ED-15363: unread variables
+  // max,
+  // ws,
+  pos = state.pos;
+
+  if (state.src.charCodeAt(pos) !== 0x0a
+  /* \n */
+  ) {
+    return false;
+  }
+
+  pmax = state.pending.length - 1; // ED-15363: unread variable
+  // max = state.posMax;
+  // '  \n' -> hardbreak
+  // Lookup in pending chars is bad practice! Don't copy to other rules!
+  // Pending string is stored in concat mode, indexed lookups will cause
+  // convertion to flat mode.
+
+  if (!silent) {
+    if (pmax >= 0 && state.pending.charCodeAt(pmax) === 0x20) {
+      if (pmax >= 1 && state.pending.charCodeAt(pmax - 1) === 0x20) {
+        // ED-15363: We commented out this logic to preserve trailing whitespaces
+        // for each line of text when pasting plain text
+        // // Find whitespaces tail of pending chars.
+        // ws = pmax - 1;
+        // while (ws >= 1 && state.pending.charCodeAt(ws - 1) === 0x20) {
+        //   ws--;
+        // }
+        // state.pending = state.pending.slice(0, ws);
+        state.push('hardbreak', 'br', 0);
+      } else {
+        state.pending = state.pending.slice(0, -1);
+        state.push('softbreak', 'br', 0);
+      }
+    } else {
+      state.push('softbreak', 'br', 0);
+    }
+  }
+
+  pos++; // ED-15363: We commented out this logic from the original library to
+  // preserve leading whitespaces for each line of text when pasting plain
+  // text (to preserve whitespace-based indentation).
+  // // skip heading spaces for next line
+  // while (pos < max && isSpace(state.src.charCodeAt(pos))) {
+  //   pos++;
+  // }
+
+  state.pos = pos;
+  return true;
+};
+
+export default (md => md.inline.ruler.at('newline', newline));

package/dist/es2019/plugins/paste/paragraph-md-plugin.js

@@ -0,0 +1,61 @@
+// ED-15363: modified version of the original paragraph plugin
+// https://github.com/markdown-it/markdown-it/blob/master/lib/rules_block/paragraph.js
+const paragraph = (state, startLine) => {
+  let content,
+      terminate,
+      i,
+      l,
+      token,
+      oldParentType,
+      nextLine = startLine + 1,
+      terminatorRules = state.md.block.ruler.getRules('paragraph'),
+      endLine = state.lineMax;
+  oldParentType = state.parentType;
+  state.parentType = 'paragraph'; // jump line-by-line until empty one or EOF
+
+  for (; nextLine < endLine && !state.isEmpty(nextLine); nextLine++) {
+    // this would be a code block normally, but after paragraph
+    // it's considered a lazy continuation regardless of what's there
+    if (state.sCount[nextLine] - state.blkIndent > 3) {
+      continue;
+    } // quirk for blockquotes, this line should already be checked by that rule
+
+
+    if (state.sCount[nextLine] < 0) {
+      continue;
+    } // Some tags can terminate paragraph without empty line.
+
+
+    terminate = false;
+
+    for (i = 0, l = terminatorRules.length; i < l; i++) {
+      if (terminatorRules[i](state, nextLine, endLine, true)) {
+        terminate = true;
+        break;
+      }
+    }
+
+    if (terminate) {
+      break;
+    }
+  } // ED-15363: We removed .trim() from this logic from the original library to
+  // preserve leading whitespaces at the beginning and end of paragraph blocks
+  // when pasting plain text (to preserve whitespace-based indentation, at the
+  // beginning and end of paragraphs).
+  // content = state.getLines(startLine, nextLine, state.blkIndent, false) .trim()
+
+
+  content = state.getLines(startLine, nextLine, state.blkIndent, false);
+  state.line = nextLine;
+  token = state.push('paragraph_open', 'p', 1);
+  token.map = [startLine, state.line];
+  token = state.push('inline', '', 0);
+  token.content = content;
+  token.map = [startLine, state.line];
+  token.children = [];
+  token = state.push('paragraph_close', 'p', -1);
+  state.parentType = oldParentType;
+  return true;
+};
+
+export default (md => md.block.ruler.at('paragraph', paragraph));

package/dist/es2019/plugins/table/commands/hover.js

@@ -37,13 +37,13 @@ export const hoverMergedCells = () => createCommand(state => {
   };
 }, tr => tr.setMeta('addToHistory', false));
 export const hoverColumns = (hoveredColumns, isInDanger) => createCommand(state => {
-  const cells = getCellsInColumn(hoveredColumns)(state.selection);
+  const cells = getCellsInColumn(hoveredColumns)(state.tr.selection);
 
   if (!cells) {
     return false;
   }
 
-  const decorations = createControlsHoverDecoration(cells, 'column', isInDanger);
+  const decorations = createControlsHoverDecoration(cells, 'column', state.tr, isInDanger);
   return {
     type: 'HOVER_COLUMNS',
     data: {
@@ -60,7 +60,7 @@ export const hoverRows = (hoveredRows, isInDanger) => createCommand(state => {
     return false;
   }
 
-  const decorations = createControlsHoverDecoration(cells, 'row', isInDanger);
+  const decorations = createControlsHoverDecoration(cells, 'row', state.tr, isInDanger);
   return {
     type: 'HOVER_ROWS',
     data: {
@@ -86,7 +86,7 @@ export const hoverTable = (isInDanger, isSelected) => createCommand(state => {
     return false;
   }
 
-  const decorations = createControlsHoverDecoration(cells, 'table', isInDanger, isSelected);
+  const decorations = createControlsHoverDecoration(cells, 'table', state.tr, isInDanger, isSelected);
   return {
     type: 'HOVER_TABLE',
     data: {

package/dist/es2019/plugins/table/ui/TableFloatingControls/CornerControls/index.js

@@ -72,7 +72,8 @@ export default class CornerControls extends Component {
       }),
       style: {
         top: this.props.stickyTop !== undefined ? `${this.props.stickyTop}px` : undefined
-      }
+      },
+      contentEditable: false
     }, /*#__PURE__*/React.createElement("button", {
       type: "button",
       className: classnames(ClassName.CONTROLS_CORNER_BUTTON, {

package/dist/es2019/plugins/table/ui/common-styles.js

@@ -79,6 +79,22 @@ export const tableStyles = props => {
 
       td.${ClassName.TABLE_CELL} {
         background-color: ${tableCellBackgroundColor(props)};
+
+        // ED-15246: Trello card is visible through a border of a table border
+        // This fixes a border issue caused by relative positioned table cells
+        &::after {
+          height: 100%;
+          content: '';
+          border-left: 1px solid ${tableBorderColor(props)};
+          border-bottom: 1px solid ${tableBorderColor(props)};
+          position: absolute;
+          right: 0px;
+          top: 0px;
+          bottom: 0;
+          width: 100%;
+          display: inline-block;
+          pointer-events: none;
+        }
       }
     }
 
@@ -500,8 +516,6 @@ export const tableStyles = props => {
     /* Table */
     .${ClassName.TABLE_NODE_WRAPPER} > table {
       table-layout: fixed;
-      // Fixes Chrome border clipping bug ED-15245
-      background: ${tableBorderColor(props)};
 
       .${ClassName.COLUMN_CONTROLS_DECORATIONS} + * {
         margin-top: 0;
@@ -538,6 +552,7 @@ export const tableStyles = props => {
         right: 0;
         top: 0;
         bottom: 0;
+        width: 100%;
         pointer-events: none;
       }
       .${ClassName.SELECTED_CELL} {
@@ -545,10 +560,32 @@ export const tableStyles = props => {
       }
       .${ClassName.SELECTED_CELL}::after {
         background: ${tableCellSelectedColor};
+        z-index: ${akEditorSmallZIndex};
       }
       th.${ClassName.HOVERED_CELL_IN_DANGER}::after,
         td.${ClassName.HOVERED_CELL_IN_DANGER}::after {
         background: ${tableCellDeleteColor};
+        z-index: ${akEditorUnitZIndex * 100};
+      }
+      // ED-15246: Trello card is visible through a border of a table border
+      td.${ClassName.HOVERED_CELL}, td.${ClassName.SELECTED_CELL} {
+        &::after {
+          height: 100%;
+          width: 100%;
+          border: 1px solid ${tableBorderSelectedColor};
+          content: '';
+          position: absolute;
+          left: -1px;
+          top: -1px;
+          bottom: 0;
+          z-index: ${akEditorSmallZIndex};
+          display: inline-block;
+          pointer-events: none;
+        }
+        &.${ClassName.HOVERED_CELL_IN_DANGER}::after {
+          border: 1px solid ${tableBorderDeleteColor};
+          z-index: ${akEditorUnitZIndex * 100};
+        }
       }
     }
     .${ClassName.ROW_CONTROLS_WRAPPER} {

package/dist/es2019/plugins/table/utils/decoration.js

@@ -13,40 +13,76 @@ export const createCellHoverDecoration = (cells, type) => cells.map(cell => Deco
 }, {
   key: TableDecorations.CELL_CONTROLS_HOVER
 }));
-export const createControlsHoverDecoration = (cells, type, danger, selected) => cells.map(cell => {
-  const classes = [ClassName.HOVERED_CELL];
+export const createControlsHoverDecoration = (cells, type, tr, danger, selected) => {
+  const table = findTable(tr.selection);
 
-  if (danger) {
-    classes.push(ClassName.HOVERED_CELL_IN_DANGER);
+  if (!table) {
+    return [];
   }
 
-  if (selected) {
-    classes.push(ClassName.SELECTED_CELL);
-  }
+  const map = TableMap.get(table.node);
+  const [min, max] = cells.reduce(([min, max], cell) => {
+    if (min === null || cell.pos < min) {
+      min = cell.pos;
+    }
 
-  classes.push(type === 'column' ? ClassName.HOVERED_COLUMN : type === 'row' ? ClassName.HOVERED_ROW : ClassName.HOVERED_TABLE);
-  let key;
+    if (max === null || cell.pos > max) {
+      max = cell.pos;
+    }
+
+    return [min, max];
+  }, [null, null]);
 
-  switch (type) {
-    case 'row':
-      key = TableDecorations.ROW_CONTROLS_HOVER;
-      break;
+  if (min === null || max === null) {
+    return [];
+  }
 
-    case 'column':
-      key = TableDecorations.COLUMN_CONTROLS_HOVER;
-      break;
+  let updatedCells = cells.map(x => x.pos); // ED-15246 fixed trello card table overflow issue
+  // If columns / rows have been merged the hovered selection is different to the actual selection
+  // So If the table cells are in danger we want to create a "rectangle" selection
+  // to match the "clicked" selection
 
-    default:
-      key = TableDecorations.TABLE_CONTROLS_HOVER;
-      break;
+  if (danger) {
+    const rect = map.rectBetween(min - table.start, max - table.start);
+    updatedCells = map.cellsInRect(rect).map(x => x + table.start);
   }
 
-  return Decoration.node(cell.pos, cell.pos + cell.node.nodeSize, {
-    class: classes.join(' ')
-  }, {
-    key
+  return updatedCells.map(pos => {
+    const cell = tr.doc.nodeAt(pos);
+    const classes = [ClassName.HOVERED_CELL];
+
+    if (danger) {
+      classes.push(ClassName.HOVERED_CELL_IN_DANGER);
+    }
+
+    if (selected) {
+      classes.push(ClassName.SELECTED_CELL);
+    }
+
+    classes.push(type === 'column' ? ClassName.HOVERED_COLUMN : type === 'row' ? ClassName.HOVERED_ROW : ClassName.HOVERED_TABLE);
+    let key;
+
+    switch (type) {
+      case 'row':
+        key = TableDecorations.ROW_CONTROLS_HOVER;
+        break;
+
+      case 'column':
+        key = TableDecorations.COLUMN_CONTROLS_HOVER;
+        break;
+
+      default:
+        key = TableDecorations.TABLE_CONTROLS_HOVER;
+        break;
+    }
+
+    return Decoration.node(pos, pos + cell.nodeSize, {
+      class: classes.join(' ')
+    }, {
+      key
+    });
   });
-});
+};
 export const createColumnSelectedDecoration = tr => {
   const {
     selection,

package/dist/es2019/plugins/tasks-and-decisions/nodeviews/taskItem.js

@@ -20,6 +20,7 @@ class Task extends ReactNodeView {
         state: isChecked ? 'DONE' : 'TODO',
         localId: taskId
       });
+      tr.setMeta('scrollIntoView', false);
       this.view.dispatch(tr);
     });
 

package/dist/es2019/plugins/type-ahead/ui/InputQuery.js

@@ -1,5 +1,5 @@
 /** @jsx jsx */
-import React, { useRef, useEffect, useCallback, Fragment } from 'react';
+import React, { useRef, useCallback, Fragment, useLayoutEffect } from 'react';
 import { css, jsx } from '@emotion/react';
 import { keyName as keyNameNormalized } from 'w3c-keyname';
 import { browser, ZERO_WIDTH_SPACE } from '@atlaskit/editor-common/utils';
@@ -85,6 +85,7 @@ export const InputQuery = /*#__PURE__*/React.memo(({
           addPrefixTrigger: true,
           setSelectionAt: CloseSelectionOptions.AFTER_TEXT_INSERTED
         });
+        stopDefault = true;
         break;
 
       case 'Backspace':
@@ -146,7 +147,7 @@ export const InputQuery = /*#__PURE__*/React.memo(({
     (_ref$current3 = ref.current) === null || _ref$current3 === void 0 ? void 0 : _ref$current3.focus();
     return false;
   }, [onQueryFocus]);
-  useEffect(() => {
+  useLayoutEffect(() => {
     if (!ref.current) {
       return;
     }
@@ -307,7 +308,7 @@ export const InputQuery = /*#__PURE__*/React.memo(({
       }
     };
   }, [triggerQueryPrefix, cleanedInputContent, onQueryFocus, cancel, checkKeyEvent]);
-  useEffect(() => {
+  useLayoutEffect(() => {
     const hasReopenQuery = typeof reopenQuery === 'string' && reopenQuery.trim().length > 0;
 
     if (ref.current && forceFocus) {