@atlaskit/editor-core 174.0.0 → 175.0.0

package/dist/es2019/plugins/table/event-handlers.js

@@ -1,381 +0,0 @@
-import { Selection, TextSelection } from 'prosemirror-state';
-import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
-import { TableMap } from '@atlaskit/editor-tables/table-map';
-import { cellAround, findCellRectClosestToPos, findTable, getSelectionRect, removeTable } from '@atlaskit/editor-tables/utils';
-import { browser } from '@atlaskit/editor-common/utils';
-import { isElementInTableCell, isLastItemMediaGroup, setNodeSelection } from '../../utils';
-import { closestElement } from '../../utils/dom';
-import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
-import { addResizeHandleDecorations, clearHoverSelection, hideInsertColumnOrRowButton, hideResizeHandleLine, hoverColumns, selectColumn, setEditorFocus, showInsertColumnButton, showInsertRowButton, showResizeHandleLine } from './commands';
-import { getPluginState } from './pm-plugins/plugin-factory';
-import { getPluginState as getResizePluginState } from './pm-plugins/table-resizing/plugin-factory';
-import { deleteColumns, deleteRows } from './transforms';
-import { RESIZE_HANDLE_AREA_DECORATION_GAP } from './types';
-import { getColumnOrRowIndex, getMousePositionHorizontalRelativeByElement, getMousePositionVerticalRelativeByElement, getSelectedCellInfo, hasResizeHandler, isCell, isColumnControlsDecorations, isCornerButton, isInsertRowButton, isResizeHandleDecoration, isRowControlsButton, isTableControlsButton, isTableContainerOrWrapper } from './utils';
-import { getAllowAddColumnCustomStep } from './utils/get-allow-add-column-custom-step';
-
-const isFocusingCalendar = event => event instanceof FocusEvent && event.relatedTarget instanceof HTMLElement && event.relatedTarget.getAttribute('aria-label') === 'calendar';
-
-const isFocusingModal = event => event instanceof FocusEvent && event.relatedTarget instanceof HTMLElement && event.relatedTarget.closest('[role="dialog"]');
-
-export const handleBlur = (view, event) => {
-  const {
-    state,
-    dispatch
-  } = view; // IE version check for ED-4665
-  // Calendar focus check for ED-10466
-
-  if (browser.ie_version !== 11 && !isFocusingCalendar(event) && !isFocusingModal(event)) {
-    setEditorFocus(false)(state, dispatch);
-  }
-
-  event.preventDefault();
-  return false;
-};
-export const handleFocus = (view, event) => {
-  const {
-    state,
-    dispatch
-  } = view;
-  setEditorFocus(true)(state, dispatch);
-  event.preventDefault();
-  return false;
-};
-export const handleClick = (view, event) => {
-  if (!(event.target instanceof HTMLElement)) {
-    return false;
-  }
-
-  const element = event.target;
-  const table = findTable(view.state.selection);
-
-  if (event instanceof MouseEvent && isColumnControlsDecorations(element)) {
-    const [startIndex] = getColumnOrRowIndex(element);
-    const {
-      state,
-      dispatch
-    } = view;
-    return selectColumn(startIndex, event.shiftKey)(state, dispatch);
-  }
-
-  const matchfn = element.matches ? element.matches : element.msMatchesSelector; // check if the table cell with an image is clicked and its not the image itself
-
-  if (!table || !isElementInTableCell(element) || !matchfn || matchfn.call(element, 'table .image, table p, table .image div')) {
-    return false;
-  }
-
-  const map = TableMap.get(table.node);
-  /** Getting the offset of current item clicked */
-
-  const colElement = closestElement(element, 'td') || closestElement(element, 'th');
-  const colIndex = colElement && colElement.cellIndex;
-  const rowElement = closestElement(element, 'tr');
-  const rowIndex = rowElement && rowElement.rowIndex;
-  const cellIndex = map.width * rowIndex + colIndex;
-  const {
-    dispatch,
-    state: {
-      tr,
-      schema: {
-        nodes: {
-          paragraph
-        }
-      }
-    }
-  } = view;
-  const editorElement = table.node.nodeAt(map.map[cellIndex]);
-  /** Only if the last item is media group, insert a paragraph */
-
-  if (isLastItemMediaGroup(editorElement)) {
-    const posInTable = map.map[cellIndex] + editorElement.nodeSize;
-    tr.insert(posInTable + table.pos, paragraph.create());
-    dispatch(tr);
-    setNodeSelection(view, posInTable + table.pos);
-  }
-
-  return true;
-};
-export const handleMouseOver = (view, mouseEvent) => {
-  if (!(mouseEvent.target instanceof HTMLElement)) {
-    return false;
-  }
-
-  const {
-    state,
-    dispatch
-  } = view;
-  const target = mouseEvent.target;
-  const {
-    insertColumnButtonIndex,
-    insertRowButtonIndex
-  } = getPluginState(state);
-
-  if (isInsertRowButton(target)) {
-    const [startIndex, endIndex] = getColumnOrRowIndex(target);
-    const positionRow = getMousePositionVerticalRelativeByElement(mouseEvent) === 'bottom' ? endIndex : startIndex;
-    return showInsertRowButton(positionRow)(state, dispatch);
-  }
-
-  if (isColumnControlsDecorations(target)) {
-    const [startIndex] = getColumnOrRowIndex(target);
-    const {
-      state,
-      dispatch
-    } = view;
-    return hoverColumns([startIndex], false)(state, dispatch);
-  }
-
-  if ((isCell(target) || isCornerButton(target)) && (typeof insertColumnButtonIndex === 'number' || typeof insertRowButtonIndex === 'number')) {
-    return hideInsertColumnOrRowButton()(state, dispatch);
-  }
-
-  if (isResizeHandleDecoration(target)) {
-    const [startIndex, endIndex] = getColumnOrRowIndex(target);
-    return showResizeHandleLine({
-      left: startIndex,
-      right: endIndex
-    })(state, dispatch);
-  }
-
-  return false;
-}; // Ignore any `mousedown` `event` from control and numbered column buttons
-// PM end up changing selection during shift selection if not prevented
-
-export const handleMouseDown = (_, event) => {
-  const isControl = !!(event.target && event.target instanceof HTMLElement && (isTableContainerOrWrapper(event.target) || isColumnControlsDecorations(event.target) || isRowControlsButton(event.target)));
-
-  if (isControl) {
-    event.preventDefault();
-  }
-
-  return isControl;
-};
-export const handleMouseOut = (view, mouseEvent) => {
-  if (!(mouseEvent instanceof MouseEvent) || !(mouseEvent.target instanceof HTMLElement)) {
-    return false;
-  }
-
-  const target = mouseEvent.target;
-
-  if (isColumnControlsDecorations(target)) {
-    const {
-      state,
-      dispatch
-    } = view;
-    return clearHoverSelection()(state, dispatch);
-  }
-
-  const relatedTarget = mouseEvent.relatedTarget; // In case the user is moving between cell at the same column
-  // we don't need to hide the resize handle decoration
-
-  if (isResizeHandleDecoration(target) && !isResizeHandleDecoration(relatedTarget)) {
-    const {
-      state,
-      dispatch
-    } = view;
-    return hideResizeHandleLine()(state, dispatch);
-  }
-
-  return false;
-};
-export const handleMouseLeave = (view, event) => {
-  if (!(event.target instanceof HTMLElement)) {
-    return false;
-  }
-
-  const {
-    state,
-    dispatch
-  } = view;
-  const {
-    insertColumnButtonIndex,
-    insertRowButtonIndex
-  } = getPluginState(state);
-  const target = event.target;
-
-  if (isTableControlsButton(target)) {
-    return true;
-  }
-
-  if ((typeof insertColumnButtonIndex !== 'undefined' || typeof insertRowButtonIndex !== 'undefined') && hideInsertColumnOrRowButton()(state, dispatch)) {
-    return true;
-  }
-
-  return false;
-};
-export const handleMouseMove = getEditorFeatureFlags => (view, event, tableCellOptimization, elementContentRects) => {
-  if (!(event.target instanceof HTMLElement)) {
-    return false;
-  }
-
-  const element = event.target;
-
-  if (isColumnControlsDecorations(element)) {
-    const {
-      state,
-      dispatch
-    } = view;
-    const {
-      insertColumnButtonIndex
-    } = getPluginState(state);
-    const [startIndex, endIndex] = getColumnOrRowIndex(element);
-    const positionColumn = getMousePositionHorizontalRelativeByElement(event, tableCellOptimization, elementContentRects) === 'right' ? endIndex : startIndex;
-
-    if (positionColumn !== insertColumnButtonIndex) {
-      return showInsertColumnButton(positionColumn)(state, dispatch);
-    }
-  }
-
-  if (isRowControlsButton(element)) {
-    const {
-      state,
-      dispatch
-    } = view;
-    const {
-      insertRowButtonIndex
-    } = getPluginState(state);
-    const [startIndex, endIndex] = getColumnOrRowIndex(element);
-    const positionRow = getMousePositionVerticalRelativeByElement(event) === 'bottom' ? endIndex : startIndex;
-
-    if (positionRow !== insertRowButtonIndex) {
-      return showInsertRowButton(positionRow)(state, dispatch);
-    }
-  }
-
-  const {
-    mouseMoveOptimization
-  } = getEditorFeatureFlags(); // we only want to allow mouseMoveOptimisation when tableCellOptimization is enabled
-  // because it relies on tableCell node view that is added  via tableCellOptimization
-
-  const useMouseMoveOptimisation = tableCellOptimization && mouseMoveOptimization;
-
-  if (!isResizeHandleDecoration(element) && isCell(element)) {
-    const positionColumn = getMousePositionHorizontalRelativeByElement(event, useMouseMoveOptimisation, elementContentRects, RESIZE_HANDLE_AREA_DECORATION_GAP);
-
-    if (positionColumn !== null) {
-      const {
-        state,
-        dispatch
-      } = view;
-      const {
-        resizeHandleColumnIndex
-      } = getPluginState(state);
-      const tableCell = closestElement(element, 'td, th');
-      const cellStartPosition = view.posAtDOM(tableCell, 0);
-      const rect = findCellRectClosestToPos(state.doc.resolve(cellStartPosition));
-
-      if (rect) {
-        const columnEndIndexTarget = positionColumn === 'left' ? rect.left : rect.right;
-
-        if (columnEndIndexTarget !== resizeHandleColumnIndex || !hasResizeHandler({
-          target: element,
-          columnEndIndexTarget
-        })) {
-          return addResizeHandleDecorations(columnEndIndexTarget)(state, dispatch);
-        }
-      }
-    }
-  }
-
-  return false;
-};
-export function handleTripleClick(view, pos) {
-  const {
-    state,
-    dispatch
-  } = view;
-  const $cellPos = cellAround(state.doc.resolve(pos));
-
-  if (!$cellPos) {
-    return false;
-  }
-
-  const cell = state.doc.nodeAt($cellPos.pos);
-
-  if (cell) {
-    const selFrom = Selection.findFrom($cellPos, 1, true);
-    const selTo = Selection.findFrom(state.doc.resolve($cellPos.pos + cell.nodeSize), -1, true);
-
-    if (selFrom && selTo) {
-      dispatch(state.tr.setSelection(new TextSelection(selFrom.$from, selTo.$to)));
-      return true;
-    }
-  }
-
-  return false;
-}
-export const handleCut = (oldTr, oldState, newState, editorAnalyticsAPI) => {
-  const oldSelection = oldState.tr.selection;
-  let {
-    tr
-  } = newState;
-
-  if (oldSelection instanceof CellSelection) {
-    const $anchorCell = oldTr.doc.resolve(oldTr.mapping.map(oldSelection.$anchorCell.pos));
-    const $headCell = oldTr.doc.resolve(oldTr.mapping.map(oldSelection.$headCell.pos));
-    const cellSelection = new CellSelection($anchorCell, $headCell);
-    tr.setSelection(cellSelection);
-
-    if (tr.selection instanceof CellSelection) {
-      const rect = getSelectionRect(cellSelection);
-
-      if (rect) {
-        const {
-          verticalCells,
-          horizontalCells,
-          totalCells,
-          totalRowCount,
-          totalColumnCount
-        } = getSelectedCellInfo(tr.selection); // Reassigning to make it more obvious and consistent
-
-        editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
-          action: TABLE_ACTION.CUT,
-          actionSubject: ACTION_SUBJECT.TABLE,
-          actionSubjectId: null,
-          attributes: {
-            verticalCells,
-            horizontalCells,
-            totalCells,
-            totalRowCount,
-            totalColumnCount
-          },
-          eventType: EVENT_TYPE.TRACK
-        })(tr); // Need this check again since we are overriding the tr in previous statement
-
-        if (tr.selection instanceof CellSelection) {
-          const isTableSelected = tr.selection.isRowSelection() && tr.selection.isColSelection();
-
-          if (isTableSelected) {
-            tr = removeTable(tr);
-          } else if (tr.selection.isRowSelection()) {
-            const {
-              pluginConfig: {
-                isHeaderRowRequired
-              }
-            } = getPluginState(newState);
-            tr = deleteRows(rect, isHeaderRowRequired)(tr);
-          } else if (tr.selection.isColSelection()) {
-            tr = deleteColumns(rect, getAllowAddColumnCustomStep(oldState))(tr);
-          }
-        }
-      }
-    }
-  }
-
-  return tr;
-};
-export const whenTableInFocus = (eventHandler, elementContentRects) => (view, mouseEvent) => {
-  var _tablePluginState$plu;
-
-  const tableResizePluginState = getResizePluginState(view.state);
-  const tablePluginState = getPluginState(view.state);
-  const isDragging = tableResizePluginState && !!tableResizePluginState.dragging;
-  const hasTableNode = tablePluginState && tablePluginState.tableNode;
-  const tableCellOptimization = tablePluginState === null || tablePluginState === void 0 ? void 0 : (_tablePluginState$plu = tablePluginState.pluginConfig) === null || _tablePluginState$plu === void 0 ? void 0 : _tablePluginState$plu.tableCellOptimization;
-
-  if (!hasTableNode || isDragging) {
-    return false;
-  }
-
-  return eventHandler(view, mouseEvent, tableCellOptimization, elementContentRects);
-};

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

@@ -1,122 +0,0 @@
-// #region Imports
-import { findParentNodeOfType } from 'prosemirror-utils';
-import { findTable } from '@atlaskit/editor-tables/utils';
-import { isTextInput } from '../../utils/is-text-input';
-import { isTableCollapsible } from './utils/collapse';
-import { defaultTableSelection } from './pm-plugins/default-table-selection';
-import { pluginKey as tableResizingPluginKey } from './pm-plugins/table-resizing';
-import { TableSortStep } from '@atlaskit/adf-schema/steps';
-// #endregion
-import { checkIfNumberColumnEnabled, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled } from './utils/nodes';
-
-const nextTableSorting = (tr, table) => {
-  const tableSortStep = tr.steps.find(step => step instanceof TableSortStep);
-  return tableSortStep && table && table.pos === tableSortStep.pos ? tableSortStep.next : undefined;
-};
-
-const nextResizeHandleColumnIndex = (tr, resizeHandleColumnIndex) => {
-  if (tr.getMeta(tableResizingPluginKey)) {
-    return undefined;
-  }
-
-  return resizeHandleColumnIndex;
-};
-
-const updateTargetCellPosition = ({
-  tr,
-  table
-}) => pluginState => {
-  const tableNode = table && table.node;
-
-  if (!tableNode) {
-    return { ...pluginState,
-      targetCellPosition: undefined
-    };
-  }
-
-  const {
-    tableCell,
-    tableHeader
-  } = tr.doc.type.schema.nodes;
-  const cell = findParentNodeOfType([tableCell, tableHeader])(tr.selection);
-  const targetCellPosition = cell ? cell.pos : undefined;
-
-  if (pluginState.targetCellPosition === targetCellPosition) {
-    return pluginState;
-  }
-
-  return { ...pluginState,
-    targetCellPosition
-  };
-};
-
-const updateTableNodePluginState = ({
-  tr,
-  table
-}) => pluginState => {
-  const tableNode = table && table.node;
-
-  if (!tableNode || isTextInput(tr)) {
-    return pluginState;
-  }
-
-  return { ...pluginState,
-    ...defaultTableSelection,
-    tableNode,
-    ordering: nextTableSorting(tr, table),
-    resizeHandleColumnIndex: nextResizeHandleColumnIndex(tr, pluginState.resizeHandleColumnIndex),
-    isNumberColumnEnabled: checkIfNumberColumnEnabled(tr.selection),
-    isHeaderColumnEnabled: checkIfHeaderColumnEnabled(tr.selection),
-    isHeaderRowEnabled: checkIfHeaderRowEnabled(tr.selection)
-  };
-};
-
-const updateCollapseHandler = ({
-  tr,
-  table
-}) => pluginState => {
-  const tableNode = table && table.node;
-  const schema = tr.doc.type.schema;
-  const allowCollapse = pluginState.pluginConfig.allowCollapse;
-  const isExpandInSchema = schema.nodes.expand !== undefined;
-  const isCollapseEnabled = allowCollapse && isExpandInSchema;
-  /**
-   * If we don't have focus, or collapse isn't allowed, or a table node doesn't
-   * exist, we don't need to waste extra checks below
-   */
-
-  if (!pluginState.editorHasFocus || !isCollapseEnabled || !tableNode) {
-    return pluginState;
-  }
-
-  const expandNodeType = schema.nodes.expand;
-  const isTableCollapsed = expandNodeType && !!findParentNodeOfType(expandNodeType)(tr.selection);
-  const trCanBeCollapsed = isTableCollapsible(tr).tableIsCollapsible; // We're focused on a table + we're not inside an expand
-
-  const canCollapseTable = !!pluginState.tableNode && // is it already collapsed?
-  !isTableCollapsed && !!trCanBeCollapsed;
-
-  if (pluginState.isTableCollapsed !== isTableCollapsed || pluginState.canCollapseTable !== canCollapseTable) {
-    return { ...pluginState,
-      isTableCollapsed,
-      canCollapseTable
-    };
-  }
-
-  return pluginState;
-};
-
-const buildPluginState = builders => props => pluginState => {
-  if (!props.table) {
-    return pluginState.targetCellPosition ? { ...pluginState,
-      targetCellPosition: undefined
-    } : pluginState;
-  }
-
-  return builders.reduce((_pluginState, transform) => transform(props)(_pluginState), pluginState);
-};
-
-export const handleDocOrSelectionChanged = (tr, pluginState) => buildPluginState([updateTargetCellPosition, updateTableNodePluginState, updateCollapseHandler])({
-  tr,
-  table: findTable(tr.selection)
-})(pluginState);