@atlaskit/editor-plugin-list 0.2.0 → 1.0.0

package/dist/es2019/actions/join-list-items-scenarios/join-sibling-list-items.js

@@ -0,0 +1,48 @@
+import { insertContentDeleteRange } from '@atlaskit/editor-common/utils';
+//Case for two adjacent list items of the same indentation
+export const joinSiblingListItems = ({
+  tr,
+  $next,
+  $head
+}) => {
+  /* CASE 2
+   * Initial Structure:
+   *
+   * List A {
+   *   ListItem B {
+   *     ...Children C
+   *     Paragraph D { text1 |$head||textInsertPos| }       //Cant have children since that would be Case 4
+   *   |childrenGInsertPos| }
+   *   ListItem E { |$next|
+   *     Paragraph F { text2 }
+   *     ...Children G
+   *   }
+   * }
+   *
+   * Converts to:
+   *
+   * List A {
+   *   ListItem B {
+   *     ...Children C
+   *     Paragraph C { text1text2 }
+   *     ...Children G
+   *   }
+   * }
+   *
+   */
+
+  const listItemE = $next.parent;
+  const paragraphF = $next.nodeAfter; //ListItem must have at least one child
+  if (!paragraphF) {
+    return false;
+  }
+  const beforeListItemE = $next.before();
+  const afterListItemE = $next.after();
+  const endListItemB = $head.end(-1);
+  const textInsertPos = $head.pos;
+  const childrenGInsertPos = endListItemB;
+  const textContent = paragraphF.content;
+  const childrenGContent = listItemE.content.cut(paragraphF.nodeSize);
+  insertContentDeleteRange(tr, tr => tr.doc.resolve(textInsertPos), [[textContent, textInsertPos], [childrenGContent, childrenGInsertPos]], [[beforeListItemE, afterListItemE]]);
+  return true;
+};

package/dist/es2019/actions/merge-lists.js

@@ -0,0 +1,24 @@
+import { isListNode } from '@atlaskit/editor-common/utils';
+export function mergeNextListAtPosition({
+  tr,
+  listPosition
+}) {
+  const listNodeAtPosition = tr.doc.nodeAt(listPosition);
+  if (!isListNode(listNodeAtPosition)) {
+    return;
+  }
+  const listPositionResolved = tr.doc.resolve(listPosition + listNodeAtPosition.nodeSize);
+  const {
+    pos,
+    nodeAfter,
+    nodeBefore
+  } = listPositionResolved;
+  if (!isListNode(nodeBefore) || !isListNode(nodeAfter)) {
+    return;
+  }
+  if ((nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.type.name) !== (nodeBefore === null || nodeBefore === void 0 ? void 0 : nodeBefore.type.name)) {
+    const previousListPosition = pos - nodeBefore.nodeSize;
+    tr.setNodeMarkup(previousListPosition, nodeAfter.type);
+  }
+  tr.join(pos);
+}

package/dist/es2019/actions/outdent-list-items-selected.js

@@ -0,0 +1,295 @@
+import { OUTDENT_SCENARIOS } from '@atlaskit/editor-common/analytics';
+import { JoinDirection, joinSiblingLists, normalizeListItemsSelection } from '@atlaskit/editor-common/lists';
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
+import { getOrderFromOrderedListNode, isListItemNode, isListNode } from '@atlaskit/editor-common/utils';
+import { Fragment, NodeRange, Slice } from '@atlaskit/editor-prosemirror/model';
+import { NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { liftTarget, ReplaceAroundStep, ReplaceStep } from '@atlaskit/editor-prosemirror/transform';
+import { getRestartListsAttributes, storeRestartListsAttributes } from '../utils/analytics';
+import { findFirstParentListItemNode, findRootParentListNode } from '../utils/find';
+import { createListNodeRange } from '../utils/selection';
+export const outdentListItemsSelected = (tr, state, featureFlags) => {
+  const originalSelection = tr.selection;
+  const normalizedSelection = normalizeListItemsSelection({
+    selection: tr.selection,
+    doc: tr.doc
+  });
+  const rootList = findRootParentListNode(normalizedSelection.$from);
+  if (!rootList) {
+    return;
+  }
+  const commonList = normalizedSelection.$from.blockRange(rootList, isListNode);
+  if (!commonList) {
+    return;
+  }
+  let hasNormalizedToPositionLiftedOut = false;
+  let hasNormalizedFromPositionLiftedOut = false;
+  const {
+    from: oldFrom,
+    to: oldTo
+  } = normalizedSelection;
+  const nodeRanges = splitRangeSelection(normalizedSelection);
+  nodeRanges.forEach(range => {
+    const $from = tr.doc.resolve(tr.mapping.map(range.from));
+    const $to = tr.doc.resolve(tr.mapping.map(range.to));
+    const mappedRange = $from.blockRange($to, isListNode);
+    if (!mappedRange) {
+      return;
+    }
+    if (isListItemNode($from.node(mappedRange.depth - 1))) {
+      outdentRangeToParentList({
+        tr,
+        range: mappedRange
+      });
+    } else {
+      extractListItemsRangeFromList({
+        tr,
+        range: mappedRange,
+        state,
+        featureFlags
+      });
+      hasNormalizedToPositionLiftedOut = hasNormalizedToPositionLiftedOut || oldTo >= range.from && oldTo < range.to;
+      hasNormalizedFromPositionLiftedOut = hasNormalizedFromPositionLiftedOut || oldFrom >= range.from && oldFrom < range.to;
+    }
+  });
+  const hasCommonListMoved = commonList.start !== tr.mapping.map(commonList.start);
+  const nextSelection = calculateNewSelection({
+    originalSelection,
+    normalizedSelection,
+    tr,
+    hasCommonListMoved,
+    hasNormalizedToPositionLiftedOut,
+    hasNormalizedFromPositionLiftedOut
+  });
+  tr.setSelection(nextSelection);
+  joinSiblingLists({
+    tr,
+    direction: JoinDirection.RIGHT
+  });
+};
+const calculateNewSelection = ({
+  tr,
+  originalSelection,
+  normalizedSelection,
+  hasCommonListMoved,
+  hasNormalizedToPositionLiftedOut,
+  hasNormalizedFromPositionLiftedOut
+}) => {
+  const {
+    $from,
+    $to
+  } = normalizedSelection;
+  const isCursorSelection = normalizedSelection.empty;
+  let from = tr.mapping.map($from.pos);
+  let to = tr.mapping.map($to.pos);
+  const LIST_STRUCTURE_CHANGED_OFFSET = 2;
+  const isToFromSameListItem = $from.sameParent($to);
+  if (hasNormalizedFromPositionLiftedOut) {
+    const fromMapped = isToFromSameListItem ? $from.pos : from;
+    from = hasNormalizedFromPositionLiftedOut ? $from.pos : fromMapped;
+    from = hasCommonListMoved ? from - LIST_STRUCTURE_CHANGED_OFFSET : from;
+    from = Math.max(from, 0);
+  }
+  if (hasNormalizedToPositionLiftedOut) {
+    const toMapped = isToFromSameListItem ? $to.pos : to;
+    to = hasNormalizedToPositionLiftedOut ? $to.pos : toMapped;
+    to = hasCommonListMoved ? to - LIST_STRUCTURE_CHANGED_OFFSET : to;
+    to = Math.min(to, tr.doc.nodeSize - 2);
+  }
+  if (normalizedSelection instanceof GapCursorSelection) {
+    const nextSelectionFrom = tr.doc.resolve(from);
+    return new GapCursorSelection(nextSelectionFrom, normalizedSelection.side);
+  }
+  if (originalSelection instanceof NodeSelection) {
+    return NodeSelection.create(tr.doc, from);
+  }
+  if (isCursorSelection) {
+    return TextSelection.between(tr.doc.resolve(to), tr.doc.resolve(to), -1);
+  }
+  return TextSelection.between(tr.doc.resolve(from), tr.doc.resolve(to), -1);
+};
+const splitRangeSelection = selection => {
+  const commonListRange = createListNodeRange({
+    selection
+  });
+  if (!commonListRange) {
+    return [];
+  }
+  const {
+    $from,
+    $to
+  } = selection;
+  if ($from.pos === $to.pos && $from.sameParent($to)) {
+    return [{
+      from: commonListRange.start,
+      to: commonListRange.end,
+      depth: commonListRange.depth
+    }];
+  }
+  const lastListItem = findPreviousListItemSibling($from);
+  if (!lastListItem) {
+    return [];
+  }
+  const nodeRanges = [];
+  const {
+    doc
+  } = $from;
+  let previousListItem = findPreviousListItemSibling($to);
+  while (previousListItem && previousListItem.pos >= lastListItem.pos && previousListItem.pos >= commonListRange.start) {
+    const node = doc.nodeAt(previousListItem.pos);
+    if (!node || !isListItemNode(node)) {
+      return [];
+    }
+    let offset = 0;
+    if (node && node.lastChild && isListNode(node.lastChild)) {
+      offset = node.lastChild.nodeSize;
+    }
+    const start = previousListItem.pos + 1;
+    nodeRanges.push({
+      from: start,
+      to: doc.resolve(start).end() - offset,
+      depth: previousListItem.depth
+    });
+    previousListItem = findPreviousListItemSibling(previousListItem);
+  }
+  return nodeRanges;
+};
+const outdentRangeToParentList = ({
+  tr,
+  range
+}) => {
+  const end = range.end;
+  const endOfList = range.$to.end(range.depth);
+  const {
+    listItem
+  } = tr.doc.type.schema.nodes;
+  if (end < endOfList) {
+    const slice = new Slice(Fragment.from(listItem.create(null, range.parent.copy())), 1, 0);
+    const step = new ReplaceAroundStep(end - 1, endOfList, end, endOfList, slice, 1, true);
+    tr.step(step);
+    range = new NodeRange(tr.doc.resolve(range.$from.pos), tr.doc.resolve(endOfList), range.depth);
+  }
+  const target = liftTarget(range);
+  if (target) {
+    tr.lift(range, target);
+  }
+};
+const extractListItemsRangeFromList = ({
+  tr,
+  range,
+  state,
+  featureFlags
+}) => {
+  const list = range.parent;
+  const $start = tr.doc.resolve(range.start);
+  const listStart = $start.start(range.depth);
+  const listEnd = $start.end(range.depth);
+  const isAtTop = listStart === range.start;
+  const isAtBottom = listEnd === range.end;
+  const isTheEntireList = isAtTop && isAtBottom;
+  let listItemContent = isAtTop ? Fragment.empty : Fragment.from(list.copy(Fragment.empty));
+  for (let i = range.startIndex; i < range.endIndex; i++) {
+    listItemContent = listItemContent.append(list.child(i).content);
+  }
+  if (isAtTop) {
+    for (let i = 0; i < listItemContent.childCount; i++) {
+      const child = listItemContent.child(i);
+      if (child && isListNode(child) && child.type !== list.type) {
+        const newNestedList = list.type.create(null, child.content);
+        listItemContent = listItemContent.replaceChild(i, newNestedList);
+      }
+    }
+  }
+  let nextList = list.copy(Fragment.empty);
+  let nextListStartNumber;
+  if (featureFlags !== null && featureFlags !== void 0 && featureFlags.restartNumberedLists) {
+    // if splitting a numbered list, keep the splitted item
+    // counter as the start of the next (second half) list (instead
+    // of reverting back to 1 as a starting number)
+    const order = getOrderFromOrderedListNode(list);
+    if (list.type.name === 'orderedList') {
+      nextListStartNumber = range.endIndex - 1 + order;
+      // @ts-ignore - [unblock prosemirror bump] assigning to readonly attrs
+      nextList.attrs = {
+        ...nextList.attrs,
+        order: nextListStartNumber
+      };
+      const {
+        splitListStartNumber
+      } = getRestartListsAttributes(tr);
+      if (typeof splitListStartNumber !== 'number') {
+        storeRestartListsAttributes(tr, {
+          splitListStartNumber: nextListStartNumber
+        });
+      }
+    }
+  }
+  const nextListFragment = listItemContent.append(Fragment.from(nextList));
+  if (featureFlags !== null && featureFlags !== void 0 && featureFlags.restartNumberedLists) {
+    // if the split list with nextListStartNumber is below another list
+    // with order (e.g due to multi-level indent items being lifted), track the
+    // list above's order instead, as it will be the split list's order after sibling joins
+    nextListFragment.forEach((node, _offset, index) => {
+      var _node$attrs;
+      if (node.type.name === 'orderedList' && ((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.order) === nextListStartNumber) {
+        var _prev$attrs;
+        const prev = nextListFragment.child(index - 1);
+        if ((prev === null || prev === void 0 ? void 0 : (_prev$attrs = prev.attrs) === null || _prev$attrs === void 0 ? void 0 : _prev$attrs.order) >= 0) {
+          var _prev$attrs2;
+          storeRestartListsAttributes(tr, {
+            splitListStartNumber: prev === null || prev === void 0 ? void 0 : (_prev$attrs2 = prev.attrs) === null || _prev$attrs2 === void 0 ? void 0 : _prev$attrs2.order
+          });
+        }
+      }
+    });
+  }
+  if (isTheEntireList) {
+    const slice = new Slice(listItemContent, 0, 0);
+    const step = new ReplaceStep($start.pos - 1, range.end + 1, slice, false);
+    if (featureFlags !== null && featureFlags !== void 0 && featureFlags.restartNumberedLists) {
+      storeRestartListsAttributes(tr, {
+        outdentScenario: undefined
+      });
+    }
+    tr.step(step);
+  } else if (isAtTop) {
+    const slice = new Slice(nextListFragment, 0, 1);
+    const step = new ReplaceStep($start.pos - 1, range.end, slice, false);
+    tr.step(step);
+  } else if (isAtBottom) {
+    const slice = new Slice(listItemContent, 1, 0);
+    const step = new ReplaceStep($start.pos, listEnd + 1, slice, false);
+    tr.step(step);
+  } else {
+    if (featureFlags !== null && featureFlags !== void 0 && featureFlags.restartNumberedLists) {
+      storeRestartListsAttributes(tr, {
+        outdentScenario: OUTDENT_SCENARIOS.SPLIT_LIST
+      });
+    }
+    const slice = new Slice(nextListFragment, 1, 1);
+    const step = new ReplaceAroundStep($start.pos, listEnd, range.end, listEnd, slice, slice.size, false);
+    tr.step(step);
+  }
+};
+const findPreviousListItemSibling = $pos => {
+  const doc = $pos.doc;
+  const isPositionListItem = isListNode($pos.node());
+  let listItemPosition = $pos;
+  if (!isPositionListItem) {
+    const listItem = findFirstParentListItemNode($pos);
+    if (!listItem) {
+      return null;
+    }
+    return doc.resolve(listItem.pos);
+  }
+  const resolved = doc.resolve(listItemPosition.pos);
+  const foundPosition = Selection.findFrom(resolved, -1);
+  if (!foundPosition) {
+    return null;
+  }
+  const parentListItemNode = findFirstParentListItemNode(foundPosition.$from);
+  if (!parentListItemNode) {
+    return null;
+  }
+  return doc.resolve(parentListItemNode.pos);
+};

package/dist/es2019/actions/wrap-and-join-lists.js

@@ -0,0 +1,93 @@
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
+import { autoJoinTr } from '@atlaskit/editor-common/utils';
+import { Fragment, NodeRange, Slice } from '@atlaskit/editor-prosemirror/model';
+import { canSplit, findWrapping, ReplaceAroundStep } from '@atlaskit/editor-prosemirror/transform';
+import { isWrappingPossible } from '../utils/selection';
+
+/**
+ * Wraps the selection in a list with the given type. If this results in
+ * two adjacent lists of the same type, those will be joined together.
+ */
+export function wrapInListAndJoin(nodeType, tr) {
+  wrapInList(nodeType)(tr);
+  autoJoinTr(tr, (before, after) => before.type === after.type && before.type === nodeType);
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+/**
+ * Wraps the selection in a list with the given type and attributes.
+ *
+ * Adapted from https://github.com/ProseMirror/prosemirror-schema-list/blob/master/src/schema-list.js#L64-L89
+ */
+export function wrapInList(listType, attrs) {
+  return function (tr) {
+    const {
+      $from,
+      $to
+    } = tr.selection;
+    let range;
+    if (tr.selection instanceof GapCursorSelection && $from.nodeAfter && isWrappingPossible(listType, tr.selection)) {
+      const nodeSize = $from.nodeAfter.nodeSize || 1;
+      range = $from.blockRange($from.doc.resolve($from.pos + nodeSize));
+    } else {
+      range = $from.blockRange($to);
+    }
+    let doJoin = false;
+    let outerRange = range;
+    if (!range) {
+      return false;
+    }
+    // This is at the top of an existing list item
+    if (range.depth >= 2 &&
+    // @ts-ignore - missing type for compatibleContent
+    $from.node(range.depth - 1).type.compatibleContent(listType) && range.startIndex === 0) {
+      // Don't do anything if this is the top of the list
+      if ($from.index(range.depth - 1) === 0) {
+        return false;
+      }
+      let $insert = tr.doc.resolve(range.start - 2);
+      outerRange = new NodeRange($insert, $insert, range.depth);
+      if (range.endIndex < range.parent.childCount) {
+        range = new NodeRange($from, tr.doc.resolve($to.end(range.depth)), range.depth);
+      }
+      doJoin = true;
+    }
+    let wrap = findWrapping(outerRange, listType, attrs, range);
+    if (!wrap) {
+      return false;
+    }
+    tr = doWrapInList(tr, range, wrap, doJoin, listType);
+    return true;
+  };
+}
+
+/**
+ * Internal function used by wrapInList
+ *
+ * Adapted from https://github.com/ProseMirror/prosemirror-schema-list/blob/master/src/schema-list.js#L91-L112
+ */
+function doWrapInList(tr, range, wrappers, joinBefore, listType) {
+  let content = Fragment.empty;
+  for (let i = wrappers.length - 1; i >= 0; i--) {
+    content = Fragment.from(wrappers[i].type.create(wrappers[i].attrs, content));
+  }
+  tr.step(new ReplaceAroundStep(range.start - (joinBefore ? 2 : 0), range.end, range.start, range.end, new Slice(content, 0, 0), wrappers.length, true));
+  let found = 0;
+  for (let i = 0; i < wrappers.length; i++) {
+    if (wrappers[i].type === listType) {
+      found = i + 1;
+    }
+  }
+  const splitDepth = wrappers.length - found;
+  let splitPos = range.start + wrappers.length - (joinBefore ? 2 : 0);
+  const parent = range.parent;
+  for (let i = range.startIndex, e = range.endIndex, first = true; i < e; i++, first = false) {
+    if (!first && canSplit(tr.doc, splitPos, splitDepth)) {
+      tr.split(splitPos, splitDepth);
+      splitPos += 2 * splitDepth;
+    }
+    splitPos += parent.child(i).nodeSize;
+  }
+  return tr;
+}

package/dist/es2019/commands/indent-list.js

@@ -0,0 +1,62 @@
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { getCommonListAnalyticsAttributes, getListItemAttributes, hasValidListIndentationLevel } from '@atlaskit/editor-common/lists';
+import { isBulletList } from '@atlaskit/editor-common/utils';
+import { closeHistory } from '@atlaskit/editor-prosemirror/history';
+import { indentListItemsSelected as indentListAction } from '../actions/indent-list-items-selected';
+import { MAX_NESTED_LIST_INDENTATION } from '../types';
+import { findFirstParentListNode } from '../utils/find';
+import { isInsideListItem, isInsideTableCell } from '../utils/selection';
+export const indentList = editorAnalyticsAPI => (inputMethod = INPUT_METHOD.KEYBOARD) => {
+  return function (state, dispatch) {
+    const {
+      tr,
+      selection: {
+        $from
+      }
+    } = state;
+
+    // don't indent if selection is not inside a list
+    if (!isInsideListItem(state)) {
+      return false;
+    }
+
+    // Save the history, so it could undo/revert to the same state before the indent, see https://product-fabric.atlassian.net/browse/ED-14753
+    closeHistory(tr);
+    const firstListItemSelectedAttributes = getListItemAttributes($from);
+    const parentListNode = findFirstParentListNode($from);
+    if (!parentListNode || firstListItemSelectedAttributes && firstListItemSelectedAttributes.indentLevel === 0 && firstListItemSelectedAttributes.itemIndex === 0) {
+      if (isInsideTableCell(state)) {
+        // dont consume tab, as table-keymap should move cursor to next cell
+        return false;
+      } else {
+        // Even though this is a non-operation, we don't want to send this event to the browser. Because if we return false, the browser will move the focus to another place
+        return true;
+      }
+    }
+    const currentListNode = parentListNode.node;
+    const actionSubjectId = isBulletList(currentListNode) ? ACTION_SUBJECT_ID.FORMAT_LIST_BULLET : ACTION_SUBJECT_ID.FORMAT_LIST_NUMBER;
+    indentListAction(tr);
+    const maximimunNestedLevelReached = !hasValidListIndentationLevel({
+      tr,
+      maxIndentation: MAX_NESTED_LIST_INDENTATION
+    });
+    if (maximimunNestedLevelReached || !tr.docChanged) {
+      // Even though this is a non-operation, we don't want to send this event to the browser. Because if we return false, the browser will move the focus to another place
+      return true;
+    }
+    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
+      action: ACTION.INDENTED,
+      actionSubject: ACTION_SUBJECT.LIST,
+      actionSubjectId,
+      eventType: EVENT_TYPE.TRACK,
+      attributes: {
+        ...getCommonListAnalyticsAttributes(state),
+        inputMethod
+      }
+    })(tr);
+    if (dispatch) {
+      dispatch(tr);
+    }
+    return true;
+  };
+};