@atlaskit/editor-core 174.0.0 → 175.0.0

package/dist/es2019/plugins/table/nodeviews/table.js

@@ -1,197 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import React from 'react';
-import { DOMSerializer } from 'prosemirror-model';
-import { stateKey as mediaPluginKey } from '../../../plugins/media/pm-plugins/plugin-key';
-import ReactNodeView from '../../../nodeviews/ReactNodeView';
-import WithPluginState from '../../../ui/WithPluginState';
-import { pluginConfig as getPluginConfig } from '../create-plugin-config';
-import { getPluginState } from '../pm-plugins/plugin-factory';
-import { pluginKey } from '../pm-plugins/plugin-key';
-import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizing';
-import { generateColgroup } from '../pm-plugins/table-resizing/utils';
-import { TableMap } from '@atlaskit/editor-tables/table-map';
-import TableComponent from './TableComponent';
-import { EmitterEvents } from '../../../extensibility';
-
-const tableAttributes = node => {
-  return {
-    'data-number-column': node.attrs.isNumberColumnEnabled,
-    'data-layout': node.attrs.layout,
-    'data-autosize': node.attrs.__autoSize,
-    'data-table-local-id': node.attrs.localId || ''
-  };
-};
-
-const toDOM = (node, props) => {
-  let colgroup = '';
-
-  if (props.allowColumnResizing) {
-    colgroup = ['colgroup', {}, ...generateColgroup(node)];
-  }
-
-  return ['table', tableAttributes(node), colgroup, ['tbody', 0]];
-};
-
-export default class TableView extends ReactNodeView {
-  constructor(props) {
-    super(props.node, props.view, props.getPos, props.portalProviderAPI, props.eventDispatcher, props);
-
-    _defineProperty(this, "getNode", () => {
-      return this.node;
-    });
-
-    _defineProperty(this, "hasHoveredRows", false);
-
-    this.getPos = props.getPos;
-    this.tableRenderOptimization = props.tableRenderOptimization;
-    this.eventDispatcher = props.eventDispatcher;
-  }
-
-  getContentDOM() {
-    const rendered = DOMSerializer.renderSpec(document, toDOM(this.node, this.reactComponentProps));
-
-    if (rendered.dom) {
-      this.table = rendered.dom;
-    }
-
-    return rendered;
-  }
-
-  setDomAttrs(node) {
-    if (!this.table) {
-      return;
-    }
-
-    const attrs = tableAttributes(node);
-    Object.keys(attrs).forEach(attr => {
-      this.table.setAttribute(attr, attrs[attr]);
-    });
-  }
-
-  render(props, forwardRef) {
-    // TODO: ED-15663
-    // Please, do not copy or use this kind of code below
-    // @ts-ignore
-    const fakePluginKey = {
-      key: 'widthPlugin$',
-      getState: state => {
-        return state['widthPlugin$'];
-      }
-    };
-    return /*#__PURE__*/React.createElement(WithPluginState, {
-      plugins: {
-        pluginState: pluginKey,
-        widthPlugin: fakePluginKey,
-        tableResizingPluginState: tableResizingPluginKey,
-        mediaState: mediaPluginKey
-      },
-      editorView: props.view,
-      render: pluginStates => {
-        const {
-          tableResizingPluginState,
-          pluginState,
-          mediaState
-        } = pluginStates;
-        const tableActive = props.getPos() === pluginState.tablePos;
-        const containerWidth = props.getEditorContainerWidth();
-        return /*#__PURE__*/React.createElement(TableComponent, {
-          view: props.view,
-          allowColumnResizing: props.allowColumnResizing,
-          eventDispatcher: props.eventDispatcher,
-          getPos: props.getPos,
-          isMediaFullscreen: mediaState === null || mediaState === void 0 ? void 0 : mediaState.isFullscreen,
-          options: props.options,
-          allowControls: pluginState.pluginConfig.allowControls,
-          isHeaderRowEnabled: pluginState.isHeaderRowEnabled,
-          isHeaderColumnEnabled: pluginState.isHeaderColumnEnabled,
-          tableActive: tableActive,
-          ordering: pluginState.ordering,
-          tableResizingPluginState: tableResizingPluginState,
-          getNode: this.getNode,
-          containerWidth: containerWidth,
-          contentDOM: forwardRef,
-          getEditorFeatureFlags: props.getEditorFeatureFlags
-        });
-      }
-    });
-  }
-
-  viewShouldUpdate(nextNode) {
-    if (this.tableRenderOptimization) {
-      const {
-        hoveredRows
-      } = getPluginState(this.view.state);
-      const hoveredRowsChanged = !!(hoveredRows !== null && hoveredRows !== void 0 && hoveredRows.length) !== this.hasHoveredRows;
-
-      if (nextNode.attrs.isNumberColumnEnabled && hoveredRowsChanged) {
-        this.hasHoveredRows = !!(hoveredRows !== null && hoveredRows !== void 0 && hoveredRows.length);
-        return true;
-      }
-
-      const node = this.getNode();
-
-      if (typeof node.attrs !== typeof nextNode.attrs) {
-        return true;
-      }
-
-      const attrKeys = Object.keys(node.attrs);
-      const nextAttrKeys = Object.keys(nextNode.attrs);
-
-      if (attrKeys.length !== nextAttrKeys.length) {
-        return true;
-      }
-
-      const tableMap = TableMap.get(node);
-      const nextTableMap = TableMap.get(nextNode);
-
-      if (tableMap.width !== nextTableMap.width) {
-        return true;
-      }
-
-      return attrKeys.some(key => {
-        return node.attrs[key] !== nextNode.attrs[key];
-      });
-    }
-
-    return super.viewShouldUpdate(nextNode);
-  }
-
-  ignoreMutation() {
-    return true;
-  }
-
-  destroy() {
-    var _this$eventDispatcher;
-
-    if (this.resizeObserver) {
-      this.resizeObserver.disconnect();
-    }
-
-    (_this$eventDispatcher = this.eventDispatcher) === null || _this$eventDispatcher === void 0 ? void 0 : _this$eventDispatcher.emit(EmitterEvents.TABLE_DELETED, this.node);
-    super.destroy();
-  }
-
-}
-export const createTableView = (node, view, getPos, portalProviderAPI, eventDispatcher, options, getEditorContainerWidth, getEditorFeatureFlags) => {
-  const {
-    pluginConfig
-  } = getPluginState(view.state);
-  const {
-    allowColumnResizing
-  } = getPluginConfig(pluginConfig);
-  const {
-    tableRenderOptimization
-  } = getEditorFeatureFlags();
-  return new TableView({
-    node,
-    view,
-    allowColumnResizing,
-    portalProviderAPI,
-    eventDispatcher,
-    getPos: getPos,
-    options,
-    tableRenderOptimization,
-    getEditorContainerWidth,
-    getEditorFeatureFlags
-  }).init();
-};

package/dist/es2019/plugins/table/nodeviews/tableCell.js

@@ -1,77 +0,0 @@
-import uuid from 'uuid';
-import { DOMSerializer } from 'prosemirror-model';
-import { getCellDomAttrs, getCellAttrs } from '@atlaskit/adf-schema';
-export default class TableCellNodeView {
-  constructor(node, view, getPos, getEditorFeatureFlags, observer) {
-    this.view = view;
-    this.node = node;
-    const {
-      dom,
-      contentDOM
-    } = DOMSerializer.renderSpec(document, node.type.spec.toDOM(node));
-    this.getPos = getPos;
-    this.dom = dom;
-    this.contentDOM = contentDOM;
-    const {
-      mouseMoveOptimization
-    } = getEditorFeatureFlags();
-
-    if (mouseMoveOptimization && observer) {
-      this.contentDOM.id = uuid();
-      this.mouseMoveOptimization = mouseMoveOptimization;
-      this.observer = observer;
-      observer.observe(this.contentDOM);
-    }
-  }
-
-  updateNodeView(node) {
-    if (this.node.type !== node.type) {
-      return false;
-    }
-
-    const attrs = getCellDomAttrs(this.node);
-    const nextAttrs = getCellDomAttrs(node);
-    const {
-      colspan,
-      rowspan
-    } = getCellAttrs(this.dom); // need to rerender when colspan/rowspan in dom are different from the node attrs
-    // this can happen when undoing merge cells
-
-    const defaultColspan = 1,
-          defaultRowspan = 1;
-
-    if (colspan !== (node.attrs.colspan || defaultColspan) || rowspan !== (node.attrs.rowspan || defaultRowspan)) {
-      return false;
-    } // added + changed attributes
-
-
-    const addedAttrs = Object.entries(nextAttrs).filter(([key, value]) => attrs[key] !== value);
-    const removedAttrs = Object.keys(attrs).filter(key => !nextAttrs.hasOwnProperty(key));
-
-    if (addedAttrs.length || removedAttrs.length) {
-      addedAttrs.forEach(([key, value]) => this.dom.setAttribute(key, value || ''));
-      removedAttrs.forEach(key => this.dom.removeAttribute(key));
-      return true;
-    } // Return true to not re-render this node view
-
-
-    if (this.node.sameMarkup(node)) {
-      return true;
-    }
-
-    return false;
-  }
-
-  update(node) {
-    const didUpdate = this.updateNodeView(node);
-    this.node = node;
-    return didUpdate;
-  }
-
-  destroy() {
-    if (this.mouseMoveOptimization && this.observer) {
-      this.observer.unobserve(this.contentDOM);
-    }
-  }
-
-}

package/dist/es2019/plugins/table/nodeviews/types.js

@@ -1 +0,0 @@
-export {};

package/dist/es2019/plugins/table/nodeviews/update-overflow-shadows.js

@@ -1,52 +0,0 @@
-import { TableCssClassName as ClassName } from '../types';
-export const updateShadowListForStickyStyles = (heightStyle, shadows) => {
-  Array.from(shadows).forEach(shadow => {
-    if (shadow.classList.contains(ClassName.TABLE_STICKY_SHADOW)) {
-      if (shadow instanceof HTMLElement && shadow.style.height !== heightStyle) {
-        shadow.style.height = heightStyle;
-      }
-    }
-  });
-};
-/**
- * Update overflow shadows for a given wrapper & table.
- * if `overflowShadowOptimization` is enabled, this will exit early.
- */
-
-export const updateOverflowShadows = getEditorFeatureFlags => (editorState, wrapper, table, rightShadows, leftShadows) => {
-  var _getEditorFeatureFlag;
-
-  if (((_getEditorFeatureFlag = getEditorFeatureFlags()) === null || _getEditorFeatureFlag === void 0 ? void 0 : _getEditorFeatureFlag.tableOverflowShadowsOptimization) === true) {
-    return false;
-  } // Right shadow
-
-
-  if (table && wrapper) {
-    const stickyRow = wrapper.querySelector('tr.sticky');
-    const stickyCell = stickyRow && stickyRow.firstElementChild;
-
-    if (rightShadows) {
-      const diff = table.offsetWidth - wrapper.offsetWidth;
-
-      for (let i = 0; i < rightShadows.length; i++) {
-        const rightShadow = rightShadows[i];
-        rightShadow.style.display = diff > 0 && diff > wrapper.scrollLeft ? 'block' : 'none';
-
-        if (rightShadow.classList.contains(ClassName.TABLE_STICKY_SHADOW) && stickyCell) {
-          rightShadow.style.height = `${stickyCell.clientHeight + 1}px`;
-        }
-      }
-    }
-
-    if (leftShadows) {
-      for (let i = 0; i < leftShadows.length; i++) {
-        const leftShadow = leftShadows[i];
-        leftShadow.style.display = wrapper.scrollLeft > 0 ? 'block' : 'none';
-
-        if (leftShadow.classList.contains(ClassName.TABLE_STICKY_SHADOW) && stickyCell) {
-          leftShadow.style.height = `${stickyCell.clientHeight + 1}px`;
-        }
-      }
-    }
-  }
-};

package/dist/es2019/plugins/table/pm-plugins/decorations/plugin.js

@@ -1,52 +0,0 @@
-import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { PluginKey } from 'prosemirror-state';
-import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
-import { DecorationSet } from 'prosemirror-view';
-import { pluginKey as tablePluginKey } from '../plugin-key';
-import { buildColumnControlsDecorations, maybeUpdateColumnControlsSelectedDecoration } from './utils';
-export const pluginKey = new PluginKey('tableDecorationsPlugin');
-export const getDecorations = state => pluginKey.getState(state);
-export const handleDocOrSelectionChanged = (tr, decorationSet, oldState) => {
-  if (tr.docChanged || tr.selection instanceof CellSelection) {
-    return buildColumnControlsDecorations({
-      decorationSet,
-      tr
-    });
-  } else if (tr.selectionSet) {
-    const isTransactionFromMouseClick = !tr.docChanged && tr.selectionSet && tr.getMeta('pointer');
-
-    if (isTransactionFromMouseClick || oldState.selection instanceof CellSelection) {
-      return maybeUpdateColumnControlsSelectedDecoration({
-        decorationSet,
-        tr
-      });
-    }
-  }
-
-  return decorationSet;
-};
-export const createPlugin = () => {
-  return new SafePlugin({
-    state: {
-      init: () => DecorationSet.empty,
-      apply: (tr, decorationSet, oldState) => {
-        let pluginState = decorationSet;
-        const meta = tr.getMeta(tablePluginKey);
-
-        if (meta && meta.data && meta.data.decorationSet) {
-          pluginState = meta.data.decorationSet;
-        }
-
-        if (tr.docChanged || tr.selectionSet) {
-          return handleDocOrSelectionChanged(tr, pluginState, oldState);
-        }
-
-        return pluginState;
-      }
-    },
-    key: pluginKey,
-    props: {
-      decorations: state => getDecorations(state)
-    }
-  });
-};

package/dist/es2019/plugins/table/pm-plugins/decorations/utils/column-controls.js

@@ -1,67 +0,0 @@
-import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
-import { findTable } from '@atlaskit/editor-tables/utils';
-import { DecorationSet } from 'prosemirror-view';
-import { TableDecorations } from '../../../types';
-import { createColumnControlsDecoration, createColumnSelectedDecoration, findColumnControlSelectedDecoration, findControlsHoverDecoration, updateDecorations } from '../../../utils/decoration';
-import { composeDecorations } from './compose-decorations';
-
-const isColumnSelected = tr => tr.selection instanceof CellSelection && tr.selection.isColSelection(); // @see: https://product-fabric.atlassian.net/browse/ED-3796
-
-
-const removeControlsHoverDecoration = ({
-  decorationSet
-}) => decorationSet.remove(findControlsHoverDecoration(decorationSet));
-
-const maybeUpdateColumnSelectedDecoration = ({
-  decorationSet,
-  tr
-}) => {
-  if (!isColumnSelected(tr)) {
-    return decorationSet;
-  }
-
-  return updateDecorations(tr.doc, decorationSet, createColumnSelectedDecoration(tr), TableDecorations.COLUMN_SELECTED);
-};
-
-const maybeUpdateColumnControlsDecoration = ({
-  decorationSet,
-  tr
-}) => {
-  const table = findTable(tr.selection);
-
-  if (!table) {
-    return decorationSet;
-  }
-
-  return updateDecorations(tr.doc, decorationSet, createColumnControlsDecoration(tr.selection), TableDecorations.COLUMN_CONTROLS_DECORATIONS);
-}; // @see: https://product-fabric.atlassian.net/browse/ED-7304
-
-
-const removeColumnControlsSelectedDecoration = ({
-  decorationSet
-}) => decorationSet.remove(findColumnControlSelectedDecoration(decorationSet));
-
-const hasColumnSelectedDecorations = decorationSet => !!findColumnControlSelectedDecoration(decorationSet).length;
-
-export const maybeUpdateColumnControlsSelectedDecoration = ({
-  decorationSet,
-  tr
-}) => {
-  if (!hasColumnSelectedDecorations(decorationSet)) {
-    return decorationSet;
-  }
-
-  return removeColumnControlsSelectedDecoration({
-    decorationSet,
-    tr
-  });
-};
-export const buildColumnControlsDecorations = ({
-  decorationSet,
-  tr
-}) => {
-  return composeDecorations([removeColumnControlsSelectedDecoration, removeControlsHoverDecoration, maybeUpdateColumnSelectedDecoration, maybeUpdateColumnControlsDecoration])({
-    decorationSet: DecorationSet.empty,
-    tr
-  });
-};

package/dist/es2019/plugins/table/pm-plugins/decorations/utils/column-resizing.js

@@ -1,27 +0,0 @@
-import { TableDecorations } from '../../../types';
-import { createResizeHandleDecoration, updateDecorations } from '../../../utils/decoration';
-import { composeDecorations } from './compose-decorations';
-const emptyDecorations = [[], []];
-
-const updateColumnResizeHandle = columnResizesDecorations => ({
-  decorationSet,
-  tr
-}) => updateDecorations(tr.doc, decorationSet, columnResizesDecorations, TableDecorations.COLUMN_RESIZING_HANDLE);
-
-const updateLastCellElement = lastCellElementsDecorations => ({
-  decorationSet,
-  tr
-}) => updateDecorations(tr.doc, decorationSet, lastCellElementsDecorations, TableDecorations.LAST_CELL_ELEMENT);
-
-export const buildColumnResizingDecorations = columnEndIndex => ({
-  tr,
-  decorationSet
-}) => {
-  const [columnResizesDecorations, lastCellElementsDecorations] = columnEndIndex < 0 ? emptyDecorations : createResizeHandleDecoration(tr, {
-    right: columnEndIndex
-  });
-  return composeDecorations([updateColumnResizeHandle(columnResizesDecorations), updateLastCellElement(lastCellElementsDecorations)])({
-    decorationSet,
-    tr
-  });
-};

package/dist/es2019/plugins/table/pm-plugins/decorations/utils/compose-decorations.js

@@ -1,7 +0,0 @@
-export const composeDecorations = transformers => ({
-  decorationSet,
-  tr
-}) => transformers.reduce((decorationSet, transform) => transform({
-  decorationSet,
-  tr
-}), decorationSet);

package/dist/es2019/plugins/table/pm-plugins/decorations/utils/index.js

@@ -1,3 +0,0 @@
-export { buildColumnControlsDecorations, maybeUpdateColumnControlsSelectedDecoration } from './column-controls';
-export { buildColumnResizingDecorations } from './column-resizing';
-export { composeDecorations } from './compose-decorations';

package/dist/es2019/plugins/table/pm-plugins/decorations/utils/types.js

@@ -1 +0,0 @@
-export {};

package/dist/es2019/plugins/table/pm-plugins/default-table-selection.js

@@ -1,5 +0,0 @@
-export const defaultTableSelection = {
-  hoveredColumns: [],
-  hoveredRows: [],
-  isInDanger: false
-};

package/dist/es2019/plugins/table/pm-plugins/keymap.js

@@ -1,34 +0,0 @@
-import { keymap } from 'prosemirror-keymap';
-import { chainCommands } from 'prosemirror-commands';
-import * as keymaps from '../../../keymaps';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { createTable, goToNextCell, moveCursorBackward, triggerUnlessTableHeader } from '../commands';
-import { addRowAroundSelection, emptyMultipleCellsWithAnalytics, deleteTableIfSelectedWithAnalytics } from '../commands-with-analytics';
-import { addColumnAfter, addColumnBefore } from '../commands/insert';
-import { withEditorAnalyticsAPI } from '../utils/analytics';
-
-const createTableWithAnalytics = editorAnalyticsAPI => withEditorAnalyticsAPI({
-  action: ACTION.INSERTED,
-  actionSubject: ACTION_SUBJECT.DOCUMENT,
-  actionSubjectId: ACTION_SUBJECT_ID.TABLE,
-  attributes: {
-    inputMethod: INPUT_METHOD.SHORTCUT
-  },
-  eventType: EVENT_TYPE.TRACK
-})(editorAnalyticsAPI)(createTable());
-
-export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI) {
-  const list = {};
-  keymaps.bindKeymapWithCommand(keymaps.nextCell.common, goToNextCell(editorAnalyticsAPI)(1), list);
-  keymaps.bindKeymapWithCommand(keymaps.previousCell.common, goToNextCell(editorAnalyticsAPI)(-1), list);
-  keymaps.bindKeymapWithCommand(keymaps.toggleTable.common, createTableWithAnalytics(editorAnalyticsAPI), list);
-  keymaps.bindKeymapWithCommand(keymaps.backspace.common, chainCommands(deleteTableIfSelectedWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD), emptyMultipleCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD)), list);
-  keymaps.bindKeymapWithCommand(keymaps.backspace.common, moveCursorBackward, list); // Add row/column shortcuts
-
-  keymaps.bindKeymapWithCommand(keymaps.addRowBefore.common, addRowAroundSelection(editorAnalyticsAPI)('TOP'), list);
-  keymaps.bindKeymapWithCommand(keymaps.addRowAfter.common, addRowAroundSelection(editorAnalyticsAPI)('BOTTOM'), list);
-  keymaps.bindKeymapWithCommand(keymaps.addColumnBefore.common, triggerUnlessTableHeader(addColumnBefore(getEditorContainerWidth)), list);
-  keymaps.bindKeymapWithCommand(keymaps.addColumnAfter.common, addColumnAfter(getEditorContainerWidth), list);
-  return keymap(list);
-}
-export default keymapPlugin;