@atlaskit/editor-core 190.2.3 → 191.0.1

package/dist/es2019/plugins/extension/ui/Extension/MultiBodiedExtension/index.js

@@ -1,282 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-/** @jsx jsx */
-
-import { jsx, css } from '@emotion/react';
-import { N30, N40, N50 } from '@atlaskit/theme/colors';
-import React, { useState } from 'react';
-import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { createDispatch } from '@atlaskit/editor-common/event-dispatcher';
-import { analyticsEventKey, calculateBreakoutStyles } from '@atlaskit/editor-common/utils';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
-const useMultiBodiedExtensionActions = ({
-  updateActiveChild,
-  editorView,
-  getPos,
-  node,
-  eventDispatcher
-}) => {
-  const actions = React.useMemo(() => {
-    return {
-      changeActive(index) {
-        const updateActiveChildResult = updateActiveChild(index);
-        if (eventDispatcher) {
-          sendMBEAnalyticsEvent(ACTION.CHANGE_ACTIVE, node, eventDispatcher);
-        }
-        return updateActiveChildResult;
-      },
-      addChild() {
-        const {
-          state,
-          dispatch
-        } = editorView;
-        if (node.content.childCount >= node.attrs.maxFrames) {
-          throw new Error(`Cannot add more than ${node.attrs.maxFrames} frames`);
-        }
-        const p = state.schema.nodes.paragraph.createAndFill({});
-        if (!p) {
-          throw new Error('Could not create paragraph');
-        }
-        const frame = state.schema.nodes.extensionFrame.createAndFill({}, [p]);
-        const pos = getPos();
-        if (typeof pos !== 'number' || !frame) {
-          throw new Error('Could not create frame or position not valid');
-        }
-        const insertAt = Math.min((pos || 1) + node.content.size, state.doc.content.size);
-        dispatch(state.tr.insert(insertAt, frame));
-        if (eventDispatcher) {
-          sendMBEAnalyticsEvent(ACTION.ADD_CHILD, node, eventDispatcher);
-        }
-        return true;
-      },
-      getChildrenCount() {
-        return node.content.childCount;
-      },
-      removeChild(index) {
-        const pos = getPos();
-        // TODO: Add child index validation here, don't trust this data
-        if (typeof pos !== 'number' || typeof index !== 'number') {
-          throw new Error('Position or index not valid');
-        }
-        const {
-          state,
-          dispatch
-        } = editorView;
-        if (node.content.childCount === 1) {
-          const tr = state.tr;
-          tr.deleteRange(pos, pos + node.content.size);
-          dispatch(tr);
-          return true;
-        }
-        const $pos = state.doc.resolve(pos);
-        const $startNodePos = state.doc.resolve($pos.start($pos.depth + 1));
-        const startFramePosition = $startNodePos.posAtIndex(index);
-        const maybeFrameNode = state.doc.nodeAt(startFramePosition);
-        if (!maybeFrameNode) {
-          throw new Error('Could not find frame node');
-        }
-        const endFramePosition = maybeFrameNode.content.size + startFramePosition;
-        const tr = state.tr;
-        tr.deleteRange(startFramePosition, endFramePosition);
-        dispatch(tr);
-        if (eventDispatcher) {
-          sendMBEAnalyticsEvent(ACTION.REMOVE_CHILD, node, eventDispatcher);
-        }
-        return true;
-      },
-      updateParameters(parameters) {
-        const {
-          state,
-          dispatch
-        } = editorView;
-        const pos = getPos();
-        if (typeof pos !== 'number') {
-          throw new Error('Position not valid');
-        }
-        const tr = state.tr.setNodeMarkup(pos, undefined, {
-          ...node.attrs,
-          parameters: {
-            ...node.attrs.parameters,
-            macroParams: parameters
-          }
-        });
-        dispatch(tr);
-        if (eventDispatcher) {
-          sendMBEAnalyticsEvent(ACTION.UPDATE_PARAMETERS, node, eventDispatcher);
-        }
-        return true;
-      },
-      getChildren() {
-        var _state$doc$nodeAt;
-        const {
-          state
-        } = editorView;
-        const pos = getPos();
-        if (typeof pos !== 'number') {
-          return [];
-        }
-        const children = (_state$doc$nodeAt = state.doc.nodeAt(pos)) === null || _state$doc$nodeAt === void 0 ? void 0 : _state$doc$nodeAt.content;
-        if (eventDispatcher) {
-          sendMBEAnalyticsEvent(ACTION.GET_CHILDERN, node, eventDispatcher);
-        }
-        return children ? children.toJSON() : [];
-      }
-    };
-  }, [node, editorView, getPos, updateActiveChild, eventDispatcher]);
-  return actions;
-};
-const navigationCSS = css`
-  // make sure the user can't see a range selection inside the navigation
-  // This is really important to keep the navigation working properly
-  user-select: none;
-  -webkit-user-modify: read-only;
-  border: 1px solid ${`var(--ds-border, ${N40})`};
-`;
-const MultiBodiedExtensionWithWidth = ({
-  node,
-  handleContentDOMRef,
-  getPos,
-  tryExtensionHandler,
-  editorView,
-  eventDispatcher,
-  widthState,
-  editorAppearance
-}) => {
-  const [activeChildIndex, setActiveChildIndex] = useState(0);
-  // Adding to avoid aliasing `this` for the callbacks
-  const updateActiveChild = React.useCallback(index => {
-    if (typeof index !== 'number') {
-      setActiveChildIndex(0);
-      throw new Error('Index is not valid');
-    }
-    setActiveChildIndex(index);
-    return true;
-  }, [setActiveChildIndex]);
-  const actions = useMultiBodiedExtensionActions({
-    updateActiveChild,
-    editorView,
-    getPos,
-    eventDispatcher,
-    node
-  });
-  const extensionHandlerResult = React.useMemo(() => {
-    return tryExtensionHandler(actions);
-  }, [tryExtensionHandler, actions]);
-  const articleRef = React.useCallback(node => {
-    return handleContentDOMRef(node);
-  }, [handleContentDOMRef]);
-  const containerCSS = css`
-    border: 1px solid ${`var(--ds-border, ${N30})`};
-    min-height: 100px;
-    .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {
-      display: none;
-    }
-
-    .multiBodiedExtension-content-dom-wrapper
-      > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1}) {
-      border: 1px solid ${`var(--ds-border, ${N50})`};
-      display: block;
-      min-height: 100px;
-    }
-  `;
-  const shouldBreakout =
-  // Extension should breakout when the layout is set to 'full-width' or 'wide'.
-  ['full-width', 'wide'].includes(node.attrs.layout) &&
-  // Extension breakout state should not be respected when the editor appearance is full-width mode
-  editorAppearance !== 'full-width';
-  let mbeContainerStyles = {};
-  if (shouldBreakout) {
-    const {
-      ...breakoutStyles
-    } = calculateBreakoutStyles({
-      mode: node.attrs.layout,
-      widthStateLineLength: widthState === null || widthState === void 0 ? void 0 : widthState.lineLength,
-      widthStateWidth: widthState === null || widthState === void 0 ? void 0 : widthState.width
-    });
-    mbeContainerStyles = breakoutStyles;
-  }
-  return jsx("section", {
-    className: "multiBodiedExtension--container",
-    css: containerCSS,
-    "data-testid": "multiBodiedExtension--container",
-    "data-active-child-index": activeChildIndex,
-    style: mbeContainerStyles
-  }, jsx("nav", {
-    className: "multiBodiedExtension-navigation",
-    css: navigationCSS,
-    "data-testid": "multiBodiedExtension-navigation"
-  }, extensionHandlerResult), jsx("article", {
-    className: "multiBodiedExtension--frames",
-    "data-testid": "multiBodiedExtension--frames",
-    ref: articleRef
-  }));
-};
-const sendMBEAnalyticsEvent = (action, node, eventDispatcher) => {
-  const analyticsDispatch = createDispatch(eventDispatcher);
-  analyticsDispatch(analyticsEventKey, {
-    payload: {
-      action,
-      actionSubject: ACTION_SUBJECT.MULTI_BODIED_EXTENSION,
-      eventType: EVENT_TYPE.TRACK,
-      attributes: {
-        extensionType: node.attrs.extensionType,
-        extensionKey: node.attrs.extensionKey,
-        localId: node.attrs.localId,
-        maxFramesCount: node.attrs.maxFrames,
-        currentFramesCount: node.content.childCount
-      }
-    }
-  });
-};
-const MultiBodiedExtensionWithSharedState = props => {
-  const {
-    pluginInjectionApi
-  } = props;
-  const {
-    widthState
-  } = useSharedPluginState(pluginInjectionApi, ['width']);
-  return jsx(MultiBodiedExtensionWithWidth, _extends({
-    widthState: widthState
-  }, props));
-};
-
-// Workaround taken from platform/packages/editor/editor-core/src/plugins/extension/ui/Extension/Extension/index.tsx
-const MultiBodiedExtension = props => {
-  // TODO: ED-17836 This code is here because confluence injects
-  // the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
-  // which cannot access the `pluginInjectionApi`. When we move
-  // Confluence to using presets we can remove this workaround.
-  const {
-    pluginInjectionApi
-  } = props;
-  return pluginInjectionApi === undefined ? jsx(MultiBodiedExtensionDeprecated, props) : jsx(MultiBodiedExtensionWithSharedState, props);
-};
-import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
-// TODO: ED-17836 This code is here because Confluence injects
-// the `editor-referentiality` plugin via `dangerouslyAppendPlugins`
-// which cannot access the `pluginInjectionApi`. When we move
-// Confluence to using presets we can remove this workaround.
-// @ts-ignore
-const widthPluginKey = {
-  key: 'widthPlugin$',
-  getState: state => {
-    return state['widthPlugin$'];
-  }
-};
-const MultiBodiedExtensionDeprecated = props => {
-  return jsx(WithPluginState, {
-    editorView: props.editorView,
-    plugins: {
-      widthState: widthPluginKey
-    },
-    render: ({
-      widthState
-    }) => jsx(MultiBodiedExtensionWithWidth, _extends({
-      widthState: widthState
-    }, props))
-  });
-};
-/**
- * End workaround
- */
-
-export default MultiBodiedExtension;

package/dist/es2019/plugins/extension/ui/Extension/index.js

@@ -1,53 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { Component } from 'react';
-import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
-import ExtensionComponent from './ExtensionComponent';
-export default class Extension extends Component {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "renderWithProvider", ({
-      extensionProvider
-    }) => {
-      const {
-        node,
-        getPos,
-        editorView,
-        handleContentDOMRef,
-        extensionHandlers,
-        references,
-        editorAppearance,
-        pluginInjectionApi,
-        eventDispatcher
-      } = this.props;
-      return /*#__PURE__*/React.createElement(ExtensionComponent, {
-        editorView: editorView,
-        node: node,
-        getPos: getPos,
-        references: references,
-        extensionProvider: extensionProvider,
-        handleContentDOMRef: handleContentDOMRef,
-        extensionHandlers: extensionHandlers,
-        editorAppearance: editorAppearance,
-        pluginInjectionApi: pluginInjectionApi,
-        eventDispatcher: eventDispatcher
-      });
-    });
-    this.providerFactory = props.providerFactory || new ProviderFactory();
-  }
-  componentWillUnmount() {
-    if (!this.props.providerFactory) {
-      // new ProviderFactory is created if no `providers` has been set
-      // in this case when component is unmounted it's safe to destroy this providerFactory
-      this.providerFactory.destroy();
-    }
-  }
-  render() {
-    return /*#__PURE__*/React.createElement(WithProviders, {
-      providers: ['extensionProvider'],
-      providerFactory: this.providerFactory,
-      renderNode: this.renderWithProvider
-    });
-  }
-}
-_defineProperty(Extension, "displayName", 'Extension');

package/dist/es2019/plugins/extension/ui/Extension/styles.js

@@ -1,62 +0,0 @@
-import { css } from '@emotion/react';
-import { N20, B200, N20A, N70 } from '@atlaskit/theme/colors';
-import { EXTENSION_PADDING, BODIED_EXT_PADDING } from '@atlaskit/editor-common/styles';
-export { EXTENSION_PADDING as padding, BODIED_EXT_PADDING };
-export const wrapperDefault = css`
-  background: ${`var(--ds-background-neutral, ${N20})`};
-  border-radius: ${"var(--ds-border-radius, 3px)"};
-  position: relative;
-  vertical-align: middle;
-
-  .ProseMirror-selectednode > span > & > .extension-overlay {
-    box-shadow: inset 0px 0px 0px 2px ${`var(--ds-border-selected, ${B200})`};
-    opacity: 1;
-  }
-
-  &.with-overlay {
-    .extension-overlay {
-      background: ${`var(--ds-background-neutral-hovered, ${N20A})`};
-      color: transparent;
-    }
-
-    &:hover .extension-overlay {
-      opacity: 1;
-    }
-  }
-`;
-export const overlay = css`
-  border-radius: ${"var(--ds-border-radius, 3px)"};
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.3s;
-`;
-export const placeholderFallback = css`
-  display: inline-flex;
-  align-items: center;
-
-  & > img {
-    margin: 0 ${"var(--ds-space-050, 4px)"};
-  }
-  /* TODO: fix in develop: https://atlassian.slack.com/archives/CFG3PSQ9E/p1647395052443259?thread_ts=1647394572.556029&cid=CFG3PSQ9E */
-  /* stylelint-disable-next-line */
-  label: placeholder-fallback;
-`;
-export const placeholderFallbackParams = css`
-  display: inline-block;
-  max-width: 200px;
-  margin-left: 5px;
-  color: ${`var(--ds-text-subtlest, ${N70})`};
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-`;
-export const styledImage = css`
-  max-height: 16px;
-  max-width: 16px;
-  /* TODO: fix in develop: https://atlassian.slack.com/archives/CFG3PSQ9E/p1647395052443259?thread_ts=1647394572.556029&cid=CFG3PSQ9E */
-  /* stylelint-disable-next-line */
-  label: lozenge-image;
-`;

package/dist/es2019/utils/document-logger.js

@@ -1,161 +0,0 @@
-const hash = {
-  nodes: {
-    doc: 'doc',
-    paragraph: 'p',
-    text: 't',
-    bulletList: 'ul',
-    orderedList: 'ol',
-    listItem: 'li',
-    heading: 'h',
-    blockquote: 'blockq',
-    codeBlock: 'codebl',
-    panel: 'pnl',
-    rule: 'rl',
-    hardBreak: 'br',
-    mention: 'ment',
-    emoji: 'emj',
-    image: 'img',
-    caption: 'cap',
-    media: 'media',
-    mediaGroup: 'mediag',
-    mediaSingle: 'medias',
-    plain: 'pln',
-    table: 'table',
-    tableCell: 'td',
-    tableHeader: 'th',
-    tableRow: 'tr',
-    decisionList: 'dl',
-    decisionItem: 'di',
-    taskList: 'tl',
-    taskItem: 'ti',
-    extension: 'ext',
-    inlineExtension: 'exti',
-    bodiedExtension: 'extb',
-    multiBodiedExtension: 'extmbe',
-    extensionFrame: 'extfrm',
-    status: 'sts',
-    placeholder: 'plh',
-    inlineCard: 'cardi',
-    blockCard: 'cardb',
-    embedCard: 'carde',
-    expand: 'exp',
-    nestedExpand: 'expn',
-    unsupportedBlock: 'unsupb',
-    unsupportedInline: 'unsupi',
-    unknownBlock: 'unkb',
-    date: 'date'
-  },
-  marks: {
-    em: 'em',
-    strong: 'strong',
-    code: 'code',
-    strike: 'strike',
-    underline: 'undline',
-    link: 'lnk',
-    subsup: 'subsup',
-    textColor: 'txtclr',
-    unsupportedMark: 'unsupmrk',
-    unsupportedNodeAttribute: 'unsupnattr',
-    annotation: 'anno'
-  }
-};
-function shortHash(type, isMark) {
-  const code = hash[isMark ? 'marks' : 'nodes'][type];
-  return code ? code : type;
-}
-function compactStringifier(node) {
-  var _node$marks;
-  const isContentEmpty = !node.content;
-  const isTextNode = (node === null || node === void 0 ? void 0 : node.type) === 'text';
-  const hasMarks = (_node$marks = node.marks) === null || _node$marks === void 0 ? void 0 : _node$marks.length;
-  const isContentArray = Array.isArray(node.content);
-  const marks = child => {
-    if (hasMarks) {
-      return node.marks.reduce((str, mark) => `${shortHash(mark, true)}(${str})`, child);
-    }
-    return child;
-  };
-  let content;
-  if (isTextNode) {
-    content = String(node.nodeSize);
-  } else if (isContentEmpty) {
-    content = '';
-  } else if (isContentArray) {
-    content = node.content.map(node => compactStringifier(node)).join(',');
-  }
-  return marks(`${shortHash(node.type, false)}(${content})`);
-}
-export const getDocStructure = (doc, options) => {
-  try {
-    const result = getBlockNode(doc, 0);
-    if (options !== null && options !== void 0 && options.compact) {
-      return compactStringifier(result);
-    }
-    return result;
-  } catch (error) {
-    return `Error logging document structure: ${error}`;
-  }
-};
-const getBlockNode = (node, pos) => {
-  const blockNode = {
-    type: node.type.name,
-    pos,
-    nodeSize: node.nodeSize
-  };
-  const content = getBlockNodeContent(node.content, pos);
-  if (content.length > 0) {
-    blockNode.content = content;
-  }
-  const marks = getMarks(node);
-  if (marks.length > 0) {
-    blockNode.marks = marks;
-  }
-  return blockNode;
-};
-const getBlockNodeContent = (node, pos) => {
-  if (!node || !node.content || !node.content.length) {
-    return [];
-  }
-  let blockNodeContent = [];
-  const {
-    content
-  } = node;
-  if (content[0].isBlock) {
-    // children are block nodes
-    let prevNode;
-    blockNodeContent = content.map(node => {
-      pos += prevNode ? prevNode.nodeSize : 1;
-      prevNode = node;
-      return getBlockNode(node, pos);
-    });
-  } else {
-    // children are inline nodes .
-    const result = getInlineNodes(content, pos);
-    blockNodeContent = result.inlineNodes;
-    pos = result.pos;
-  }
-  return blockNodeContent;
-};
-const getInlineNodes = (nodes, pos) => {
-  let inlineNodes = nodes.map(node => {
-    const {
-      nodeSize
-    } = node;
-    const inlineNode = {
-      type: node.type.name,
-      pos,
-      nodeSize
-    };
-    const marks = getMarks(node);
-    if (marks.length > 0) {
-      inlineNode.marks = marks;
-    }
-    pos += nodeSize;
-    return inlineNode;
-  });
-  return {
-    inlineNodes,
-    pos
-  };
-};
-const getMarks = node => node.marks.map(mark => mark.type.name);

package/dist/esm/extensibility.js

@@ -1,17 +0,0 @@
-export { getChangedNodes } from '@atlaskit/editor-common/utils';
-export { validateNodes } from './utils/nodes';
-export { toJSON } from './utils';
-export { default as Extension } from './plugins/extension/ui/Extension';
-export { default as ExtensionNodeWrapper } from './plugins/extension/ui/Extension/ExtensionNodeWrapper';
-export { ExtensionNode } from './plugins/extension/nodeviews/extension';
-import { pluginKey as tablePluginKeyInner } from '@atlaskit/editor-plugin-table/plugin-key';
-
-/**
- * @deprecated [ED-14688] - used during the table viz project and not used anymore
- * will be removed in a future version of `@atlaskit/editor-core`
- */
-var tablePluginKey = tablePluginKeyInner;
-export { tablePluginKey };
-export var EmitterEvents = {
-  TABLE_DELETED: 'TABLE_DELETED'
-};

package/dist/esm/extensions.js

@@ -1 +0,0 @@
-export { editSelectedExtension } from './plugins/extension/actions';

package/dist/esm/plugins/collab-edit/actions.js

@@ -1,103 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import { AllSelection, NodeSelection } from '@atlaskit/editor-prosemirror/state';
-import { Step } from '@atlaskit/editor-prosemirror/transform';
-import { receiveTransaction } from 'prosemirror-collab';
-import { replaceDocument } from './utils';
-export var handleInit = function handleInit(initData, view, options) {
-  var doc = initData.doc,
-    json = initData.json,
-    version = initData.version,
-    reserveCursor = initData.reserveCursor;
-  if (doc) {
-    var state = view.state;
-    var tr = replaceDocument(doc, state, version, options, reserveCursor);
-    tr.setMeta('isRemote', true);
-    view.dispatch(tr);
-  } else if (json) {
-    applyRemoteSteps(json, view);
-  }
-};
-export var handleConnection = function handleConnection(connectionData, view) {
-  var tr = view.state.tr;
-  view.dispatch(tr.setMeta('sessionId', connectionData));
-};
-export var handlePresence = function handlePresence(presenceData, view) {
-  var tr = view.state.tr;
-  view.dispatch(tr.setMeta('presence', presenceData));
-};
-export var applyRemoteData = function applyRemoteData(remoteData, view, options) {
-  var json = remoteData.json,
-    _remoteData$userIds = remoteData.userIds,
-    userIds = _remoteData$userIds === void 0 ? [] : _remoteData$userIds;
-  if (json) {
-    applyRemoteSteps(json, view, userIds, options);
-  }
-};
-export var applyRemoteSteps = function applyRemoteSteps(json, view, userIds, options) {
-  if (!json || !json.length) {
-    return;
-  }
-  var state = view.state,
-    schema = view.state.schema;
-  var steps = json.map(function (step) {
-    return Step.fromJSON(schema, step);
-  });
-  var tr;
-  if (options && options.useNativePlugin && userIds) {
-    tr = receiveTransaction(state, steps, userIds);
-  } else {
-    tr = state.tr;
-    steps.forEach(function (step) {
-      return tr.step(step);
-    });
-  }
-  if (tr) {
-    tr.setMeta('addToHistory', false);
-    tr.setMeta('isRemote', true);
-    var _state$selection = state.selection,
-      from = _state$selection.from,
-      to = _state$selection.to;
-    var _json = _slicedToArray(json, 1),
-      firstStep = _json[0];
-
-    /*
-     * Persist marks across transactions. Fixes an issue where
-     * marks are lost if remote transactions are dispatched
-     * between a user creating the mark and typing.
-     */
-    if (state.tr.storedMarks) {
-      tr.setStoredMarks(state.tr.storedMarks);
-    }
-
-    /**
-     * If the cursor is a the same position as the first step in
-     * the remote data, we need to manually set it back again
-     * in order to prevent the cursor from moving.
-     */
-    if (from === firstStep.from && to === firstStep.to) {
-      tr.setSelection(state.selection.map(tr.doc, tr.mapping));
-    }
-    view.dispatch(tr);
-  }
-};
-export var handleTelePointer = function handleTelePointer(telepointerData, view) {
-  var tr = view.state.tr;
-  view.dispatch(tr.setMeta('telepointer', telepointerData));
-};
-function isAllSelection(selection) {
-  return selection instanceof AllSelection;
-}
-function isNodeSelection(selection) {
-  return selection instanceof NodeSelection;
-}
-export var getSendableSelection = function getSendableSelection(selection) {
-  /**
-   * <kbd>CMD + A</kbd> triggers a AllSelection
-   * <kbd>escape</kbd> triggers a NodeSelection
-   */
-  return {
-    type: 'textSelection',
-    anchor: selection.anchor,
-    head: isAllSelection(selection) || isNodeSelection(selection) ? selection.head - 1 : selection.head
-  };
-};