@atlaskit/editor-common 69.2.2 → 69.3.0

package/dist/es2019/utils/dom.js

@@ -0,0 +1,113 @@
+/**
+ * Walks a DOM tree up to the provided `stopElement`, or if falsy before.
+ * @param element
+ * @param stopElement
+ */
+export function walkUpTreeUntil(element, shouldStop) {
+  let rootElement = element;
+
+  while (rootElement && rootElement.parentElement && !shouldStop(rootElement)) {
+    rootElement = rootElement.parentElement;
+  }
+
+  return rootElement;
+}
+/**
+ * Takes all children out from wrapped el and puts them directly inside
+ * the parent el, at the wrapped el's position
+ */
+
+export function unwrap(parent, wrapped) {
+  const docsFragment = document.createDocumentFragment();
+  Array.from(wrapped.children).forEach(child => {
+    docsFragment.appendChild(child);
+  });
+  parent.replaceChild(docsFragment, wrapped);
+}
+/**
+ * Walks up DOM removing elements if they are empty until it finds
+ * one that is not
+ */
+
+export function removeNestedEmptyEls(el) {
+  while (el.parentElement && el.childElementCount === 0 && el.textContent === '') {
+    const parentEl = el.parentElement;
+    parentEl.removeChild(el);
+    el = parentEl;
+  }
+}
+/**
+ * IE11 doesn't support classList to SVGElements
+ **/
+
+export const containsClassName = (node, className) => {
+  if (!node) {
+    return false;
+  }
+
+  if (node.classList && node.classList.contains) {
+    return node.classList.contains(className);
+  }
+
+  if (!node.className) {
+    return false;
+  }
+
+  const classNames = typeof node.className.baseVal === 'string' ? node.className.baseVal : node.className;
+  return classNames.split(' ').indexOf(className) !== -1;
+};
+export function closest(node, s) {
+  if (!node) {
+    return null;
+  }
+
+  let el = node;
+
+  if (!document.documentElement || !document.documentElement.contains(el)) {
+    return null;
+  }
+
+  if (el.closest) {
+    return el.closest(s);
+  }
+
+  do {
+    const matchfn = el.matches ? el.matches : el.msMatchesSelector;
+
+    if (matchfn && matchfn.call(el, s)) {
+      return el;
+    }
+
+    el = el.parentElement || el.parentNode;
+  } while (el !== null && el.nodeType === 1);
+
+  return null;
+}
+/*
+ * @deprecated - Use HTMLElement.protoype.closest instead
+ */
+
+export function closestElement(node, s) {
+  return closest(node, s);
+}
+export function parsePx(pxStr) {
+  if (!pxStr.endsWith('px')) {
+    return undefined;
+  }
+
+  const maybeNumber = parseInt(pxStr, 10);
+  return !Number.isNaN(maybeNumber) ? maybeNumber : undefined;
+}
+// does typescript have function templates yet?
+export function mapElem(elem, callback) {
+  const array = [];
+
+  for (let i = 0; i < elem.childElementCount; i++) {
+    array.push(callback(elem.children[i], i, elem));
+  }
+
+  return array;
+}
+export function maphElem(elem, callback) {
+  return mapElem(elem, callback);
+}

package/dist/es2019/utils/editor-core-utils.js

@@ -0,0 +1,72 @@
+import { NodeSelection, TextSelection } from 'prosemirror-state';
+import { ReplaceAroundStep, ReplaceStep } from 'prosemirror-transform';
+import { closest } from './dom';
+export const stepHasSlice = step => step && step.hasOwnProperty('slice');
+/**
+ * Checks whether a given step is adding nodes of given nodeTypes
+ *
+ * @param step Step to check
+ * @param nodeTypes NodeTypes being added
+ */
+
+export function stepAddsOneOf(step, nodeTypes) {
+  let adds = false;
+
+  if (!stepHasSlice(step)) {
+    return adds;
+  }
+
+  step.slice.content.descendants(node => {
+    if (nodeTypes.has(node.type)) {
+      adds = true;
+    }
+
+    return !adds;
+  });
+  return adds;
+}
+export const extractSliceFromStep = step => {
+  if (!(step instanceof ReplaceStep) && !(step instanceof ReplaceAroundStep)) {
+    return null;
+  } // @ts-ignore This is by design. Slice is a private property, but accesible, from ReplaceStep.
+  // However, we need to read it to found if the step was adding a newline
+
+
+  const slice = step.slice;
+  return slice;
+};
+export const isTextSelection = selection => selection instanceof TextSelection;
+export const isElementInTableCell = element => {
+  return closest(element, 'td') || closest(element, 'th');
+};
+export const isLastItemMediaGroup = node => {
+  const {
+    content
+  } = node;
+  return !!content.lastChild && content.lastChild.type.name === 'mediaGroup';
+}; // TODO: pulled from `packages/editor/editor-core/src/utils/selection.ts`
+
+export const setNodeSelection = (view, pos) => {
+  const {
+    state,
+    dispatch
+  } = view;
+
+  if (!isFinite(pos)) {
+    return;
+  }
+
+  const tr = state.tr.setSelection(NodeSelection.create(state.doc, pos));
+  dispatch(tr);
+};
+export function nonNullable(value) {
+  return value !== null && value !== undefined;
+} // checks if the given position is within the ProseMirror document
+
+export const isValidPosition = (pos, state) => {
+  if (pos >= 0 && pos <= state.doc.resolve(0).end()) {
+    return true;
+  }
+
+  return false;
+};

package/dist/es2019/utils/index.js

@@ -3,8 +3,13 @@ export { getExtensionLozengeData } from './macro';
 export { default as browser } from './browser';
 export { default as ErrorReporter } from './error-reporter';
 export { isPastDate, timestampToIsoFormat, timestampToString, timestampToTaskContext, timestampToUTCDate, todayTimestampInUTC } from './date';
+export { isElementInTableCell, isTextSelection, isLastItemMediaGroup, setNodeSelection, nonNullable, stepAddsOneOf, stepHasSlice, extractSliceFromStep, isValidPosition } from './editor-core-utils';
 export { withImageLoader } from './imageLoader';
 export { absoluteBreakoutWidth, calcBreakoutWidth, calcWideWidth, breakoutConsts } from './breakout';
+export { findChangedNodesFromTransaction, validNode, validateNodes, isType, isParagraph, isText, isLinkMark, SelectedState, isNodeSelectedOrInRange, isSupportedInParent } from './nodes';
+export { pluginFactory } from './plugin-state-factory';
+export { getFragmentBackingArray, mapFragment, mapSlice, flatmap, mapChildren } from './slice';
+export { walkUpTreeUntil, unwrap, removeNestedEmptyEls, containsClassName, closest, closestElement, parsePx, mapElem, maphElem } from './dom';
 export { default as ADFTraversor } from './traversor';
 export { analyticsEventKey, getAnalyticsAppearance, getAnalyticsEventSeverity, SEVERITY, getUnsupportedContentLevelData, UNSUPPORTED_CONTENT_LEVEL_SEVERITY, UNSUPPORTED_CONTENT_LEVEL_SEVERITY_THRESHOLD_DEFAULTS } from './analytics';
 export { findAndTrackUnsupportedContentNodes } from './track-unsupported-content';
@@ -17,6 +22,7 @@ export { getExtensionRenderer } from './extension-handler';
 export { hasMergedCell, calcTableColumnWidths, convertProsemirrorTableNodeToArrayOfRows } from './table';
 export { createCompareNodes } from './compareNodes';
 export { compose } from './compose';
+export { isTextInput } from './is-text-input';
 export { ZERO_WIDTH_SPACE } from './whitespace';
 export { shouldForceTracking } from './should-force-tracking';
 export { getModeFromTheme } from './getModeFromTheme';

package/dist/es2019/utils/is-text-input.js

@@ -0,0 +1,19 @@
+// TODO: remove from editor-core utils, re-export from editor-common
+import { ReplaceStep } from 'prosemirror-transform';
+export const isTextInput = tr => {
+  const [step] = tr.steps;
+
+  if (!step || !(step instanceof ReplaceStep)) {
+    return false;
+  }
+
+  const {
+    slice: {
+      content
+    },
+    from,
+    to
+  } = step;
+  const char = content.firstChild;
+  return from === to && content.childCount === 1 && !!char && !!char.text && char.text.length === 1;
+};

package/dist/es2019/utils/nodes.js

@@ -0,0 +1,88 @@
+/**
+ * Finds all top level nodes affected by the transaction
+ * Uses from/to positions in transaction's steps to work out which nodes will
+ * be changed by the transaction
+ */
+export const findChangedNodesFromTransaction = tr => {
+  const nodes = [];
+  const steps = tr.steps || [];
+  steps.forEach(step => {
+    const {
+      to,
+      from,
+      slice
+    } = step;
+    const size = slice && slice.content ? slice.content.size : 0;
+
+    for (let i = from; i <= to + size; i++) {
+      if (i <= tr.doc.content.size) {
+        const topLevelNode = tr.doc.resolve(i).node(1);
+
+        if (topLevelNode && !nodes.find(n => n === topLevelNode)) {
+          nodes.push(topLevelNode);
+        }
+      }
+    }
+  });
+  return nodes;
+};
+export const validNode = node => {
+  try {
+    node.check(); // this will throw an error if the node is invalid
+  } catch (error) {
+    return false;
+  }
+
+  return true;
+};
+/** Validates prosemirror nodes, and returns true only if all nodes are valid */
+
+export const validateNodes = nodes => nodes.every(validNode);
+export const isType = (node, type) => type && node && node.type === type;
+export const isParagraph = (node, schema) => isType(node, schema.nodes.paragraph);
+export const isText = (node, schema) => isType(node, schema.nodes.text);
+export const isLinkMark = (node, schema) => isType(node, schema.marks.link);
+export let SelectedState;
+/**
+ * Returns if the current selection from achor-head is selecting the node.
+ * If the node is not selected then null is returned.
+ * If the node is selected then an enum is returned that describes weather the node
+ * is fully selected by a range or if the "inside" of the node has been selected or clicked.
+ */
+
+(function (SelectedState) {
+  SelectedState[SelectedState["selectedInRange"] = 0] = "selectedInRange";
+  SelectedState[SelectedState["selectedInside"] = 1] = "selectedInside";
+})(SelectedState || (SelectedState = {}));
+
+export const isNodeSelectedOrInRange = (anchorPosition, headPosition, nodePosition, nodeSize) => {
+  const rangeStart = Math.min(anchorPosition, headPosition);
+  const rangeEnd = Math.max(anchorPosition, headPosition);
+  const nodeStart = nodePosition;
+  const nodeEnd = nodePosition + nodeSize;
+
+  if (anchorPosition === headPosition) {
+    return null;
+  }
+
+  if (rangeStart <= nodeStart && nodeEnd < rangeEnd || rangeStart < nodeStart && nodeEnd <= rangeEnd) {
+    return SelectedState.selectedInRange;
+  }
+
+  if (nodeStart <= anchorPosition && headPosition <= nodeEnd) {
+    return SelectedState.selectedInside;
+  }
+
+  return null;
+};
+/**
+ * Checks if a particular node fragment is supported in the parent
+ * @param state EditorState
+ * @param fragment The fragment to be checked for
+ */
+
+export const isSupportedInParent = (state, fragment, currentAppearance) => {
+  const depth = currentAppearance === 'embed' || currentAppearance === 'block' ? undefined : -1;
+  const parent = state.selection.$from.node(depth);
+  return parent && parent.type.validContent(fragment);
+};

package/dist/es2019/utils/plugin-state-factory.js

@@ -0,0 +1,107 @@
+/**
+ * Creates a ProseMirror plugin's state and handles UI updates.
+ *
+ * Here's a few things to keep in mind:
+ * - plugin's state is stored as a single object
+ * - `Reducer` specifies how plugin's state changes in response to commands
+ * - `Command` describes only what happen, but not how state changes
+ * - `mapping` could be used to map ProseMirror positions stored in plugin's state
+ *
+ * Example:
+ *  const { createPluginState, createCommand, getPluginState } = pluginFactory(
+ *    reducer,
+ *    pluginKey
+ *  );
+ *
+ *  export const createPlugin = (dispatch: Dispatch, initialState) =>
+ *    new SafePlugin({
+ *      state: createPluginState(dispatch, initialState),
+ *      key: pluginKey
+ *    });
+ *
+ * Example of a reducer:
+ *
+ *  export const reducer = (
+ *    state: TablePluginState,
+ *    action: TableAction,
+ *  ): TablePluginState => {
+ *    switch (action.type) {
+ *      case 'TOGGLE_CONTEXTUAL_MENU':
+ *      return {
+ *        ...state,
+ *        isContextualMenuOpen: !state.isContextualMenuOpen,
+ *      };
+ *    default:
+ *      return state;
+ *    }
+ *  };
+ *
+ *
+ * Example of a command:
+ *
+ * export const toggleContextualMenu = createCommand({
+ *   type: 'TOGGLE_CONTEXTUAL_MENU',
+ * }, tr => tr.setMeta('addToHistory', false));
+ *
+ */
+function isFunction(x) {
+  return typeof x === 'function';
+}
+
+export function pluginFactory(pluginKey, reducer, options = {}) {
+  const {
+    mapping,
+    onDocChanged,
+    onSelectionChanged
+  } = options;
+  return {
+    createPluginState(dispatch, initialState) {
+      return {
+        init: (_, state) => isFunction(initialState) ? initialState(state) : initialState,
+        apply: (tr, _pluginState) => {
+          const oldState = mapping ? mapping(tr, _pluginState) : _pluginState;
+          let newState = oldState;
+          const meta = tr.getMeta(pluginKey);
+
+          if (meta) {
+            newState = reducer(oldState, meta);
+          }
+
+          if (onDocChanged && tr.docChanged) {
+            newState = onDocChanged(tr, newState);
+          } else if (onSelectionChanged && tr.selectionSet) {
+            newState = onSelectionChanged(tr, newState);
+          }
+
+          if (newState !== oldState) {
+            dispatch(pluginKey, newState);
+          }
+
+          return newState;
+        }
+      };
+    },
+
+    createCommand(action, transform) {
+      return (state, dispatch) => {
+        if (dispatch) {
+          const tr = transform ? transform(state.tr, state) : state.tr;
+          const resolvedAction = isFunction(action) ? action(state) : action;
+
+          if (tr && resolvedAction) {
+            dispatch(tr.setMeta(pluginKey, resolvedAction));
+          } else {
+            return false;
+          }
+        }
+
+        return true;
+      };
+    },
+
+    getPluginState(state) {
+      return pluginKey.getState(state);
+    }
+
+  };
+}

package/dist/es2019/utils/slice.js

@@ -0,0 +1,56 @@
+import { Fragment, Slice } from 'prosemirror-model';
+/**
+ * A helper to get the underlying array of a fragment.
+ */
+
+export function getFragmentBackingArray(fragment) {
+  return fragment.content;
+}
+export function mapFragment(content, callback, parent = null) {
+  const children = [];
+
+  for (let i = 0, size = content.childCount; i < size; i++) {
+    const node = content.child(i);
+    const transformed = node.isLeaf ? callback(node, parent, i) : callback(node.copy(mapFragment(node.content, callback, node)), parent, i);
+
+    if (transformed) {
+      if (transformed instanceof Fragment) {
+        children.push(...getFragmentBackingArray(transformed));
+      } else if (Array.isArray(transformed)) {
+        children.push(...transformed);
+      } else {
+        children.push(transformed);
+      }
+    }
+  }
+
+  return Fragment.fromArray(children);
+}
+export function mapSlice(slice, callback) {
+  const fragment = mapFragment(slice.content, callback);
+  return new Slice(fragment, slice.openStart, slice.openEnd);
+}
+export function flatmap(fragment, callback) {
+  const fragmentContent = [];
+
+  for (let i = 0; i < fragment.childCount; i++) {
+    const child = callback(fragment.child(i), i, fragment);
+
+    if (Array.isArray(child)) {
+      fragmentContent.push(...child);
+    } else {
+      fragmentContent.push(child);
+    }
+  }
+
+  return Fragment.fromArray(fragmentContent);
+}
+export function mapChildren(node, callback) {
+  const array = [];
+
+  for (let i = 0; i < node.childCount; i++) {
+    array.push(callback(node.child(i), i, node instanceof Fragment ? node : node.content));
+  }
+
+  return array;
+}

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "69.2.2",
+	"version": "69.3.0",
 	"sideEffects": false
 }