@atlaskit/editor-plugin-table 7.16.11 → 7.16.12

package/src/commands/delete.ts

@@ -5,17 +5,17 @@ import { deleteColumns } from '../transforms/delete-columns';
 import { getAllowAddColumnCustomStep } from '../utils/get-allow-add-column-custom-step';
 
 export const deleteColumnsCommand =
-  (rect: Rect, isTableScalingEnabled = false): Command =>
-  (state, dispatch, view) => {
-    const tr = deleteColumns(
-      rect,
-      getAllowAddColumnCustomStep(state),
-      view,
-      isTableScalingEnabled,
-    )(state.tr);
-    if (dispatch) {
-      dispatch(tr);
-      return true;
-    }
-    return false;
-  };
+	(rect: Rect, isTableScalingEnabled = false): Command =>
+	(state, dispatch, view) => {
+		const tr = deleteColumns(
+			rect,
+			getAllowAddColumnCustomStep(state),
+			view,
+			isTableScalingEnabled,
+		)(state.tr);
+		if (dispatch) {
+			dispatch(tr);
+			return true;
+		}
+		return false;
+	};

package/src/commands/display-mode.ts

@@ -2,18 +2,17 @@ import type { EditorCommand } from '@atlaskit/editor-common/types';
 import { findTable } from '@atlaskit/editor-tables/utils';
 
 export const setTableDisplayMode: EditorCommand = ({ tr }) => {
-  const table = findTable(tr.selection);
-  if (!table) {
-    return null;
-  }
+	const table = findTable(tr.selection);
+	if (!table) {
+		return null;
+	}
 
-  const { displayMode } = table.node.attrs;
+	const { displayMode } = table.node.attrs;
 
-  tr.setNodeMarkup(table.pos, tr.doc.type.schema.nodes.table, {
-    ...table.node.attrs,
-    displayMode:
-      !displayMode || displayMode === 'default' ? 'fixed' : 'default',
-  });
+	tr.setNodeMarkup(table.pos, tr.doc.type.schema.nodes.table, {
+		...table.node.attrs,
+		displayMode: !displayMode || displayMode === 'default' ? 'fixed' : 'default',
+	});
 
-  return tr.setMeta('scrollIntoView', false);
+	return tr.setMeta('scrollIntoView', false);
 };

package/src/commands/go-to-next-cell.ts

@@ -7,10 +7,7 @@ import type { Command } from '@atlaskit/editor-common/types';
 import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { TableMap } from '@atlaskit/editor-tables/table-map';
 import type { Direction } from '@atlaskit/editor-tables/types';
-import {
-  goToNextCell as baseGotoNextCell,
-  findTable,
-} from '@atlaskit/editor-tables/utils';
+import { goToNextCell as baseGotoNextCell, findTable } from '@atlaskit/editor-tables/utils';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 
 import { insertRowWithAnalytics } from '../commands-with-analytics';
@@ -22,59 +19,56 @@ const TAB_FORWARD_DIRECTION = 1;
 const TAB_BACKWARD_DIRECTION = -1;
 
 export const goToNextCell =
-  (
-    editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
-    ariaNotify?: (message: string) => void,
-    getIntl?: () => IntlShape,
-  ) =>
-  (direction: Direction): Command =>
-  (state, dispatch, view) => {
-    const table = findTable(state.selection);
-    if (!table) {
-      return false;
-    }
+	(
+		editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
+		ariaNotify?: (message: string) => void,
+		getIntl?: () => IntlShape,
+	) =>
+	(direction: Direction): Command =>
+	(state, dispatch, view) => {
+		const table = findTable(state.selection);
+		if (!table) {
+			return false;
+		}
 
-    if (getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
-      const isColumnResizing = getPluginState(state)?.isKeyboardResize;
-      if (isColumnResizing) {
-        stopKeyboardColumnResizing({
-          ariaNotify: ariaNotify,
-          getIntl: getIntl,
-        })(state, dispatch, view);
-        return true;
-      }
-    }
+		if (getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
+			const isColumnResizing = getPluginState(state)?.isKeyboardResize;
+			if (isColumnResizing) {
+				stopKeyboardColumnResizing({
+					ariaNotify: ariaNotify,
+					getIntl: getIntl,
+				})(state, dispatch, view);
+				return true;
+			}
+		}
 
-    const map = TableMap.get(table.node);
-    const { tableCell, tableHeader } = state.schema.nodes;
-    const cell = findParentNodeOfType([tableCell, tableHeader])(
-      state.selection,
-    )!;
-    const firstCellPos = map.positionAt(0, 0, table.node) + table.start;
-    const lastCellPos =
-      map.positionAt(map.height - 1, map.width - 1, table.node) + table.start;
+		const map = TableMap.get(table.node);
+		const { tableCell, tableHeader } = state.schema.nodes;
+		const cell = findParentNodeOfType([tableCell, tableHeader])(state.selection)!;
+		const firstCellPos = map.positionAt(0, 0, table.node) + table.start;
+		const lastCellPos = map.positionAt(map.height - 1, map.width - 1, table.node) + table.start;
 
-    // when tabbing backwards at first cell (top left), insert row at the start of table
-    if (firstCellPos === cell.pos && direction === TAB_BACKWARD_DIRECTION) {
-      insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD, {
-        index: 0,
-        moveCursorToInsertedRow: true,
-      })(state, dispatch);
-      return true;
-    }
+		// when tabbing backwards at first cell (top left), insert row at the start of table
+		if (firstCellPos === cell.pos && direction === TAB_BACKWARD_DIRECTION) {
+			insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD, {
+				index: 0,
+				moveCursorToInsertedRow: true,
+			})(state, dispatch);
+			return true;
+		}
 
-    // when tabbing forwards at last cell (bottom right), insert row at the end of table
-    if (lastCellPos === cell.pos && direction === TAB_FORWARD_DIRECTION) {
-      insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD, {
-        index: map.height,
-        moveCursorToInsertedRow: true,
-      })(state, dispatch);
-      return true;
-    }
+		// when tabbing forwards at last cell (bottom right), insert row at the end of table
+		if (lastCellPos === cell.pos && direction === TAB_FORWARD_DIRECTION) {
+			insertRowWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.KEYBOARD, {
+				index: map.height,
+				moveCursorToInsertedRow: true,
+			})(state, dispatch);
+			return true;
+		}
 
-    if (dispatch) {
-      return baseGotoNextCell(direction)(state, dispatch);
-    }
+		if (dispatch) {
+			return baseGotoNextCell(direction)(state, dispatch);
+		}
 
-    return true;
-  };
+		return true;
+	};

package/src/commands/hover.ts

@@ -1,253 +1,236 @@
 // #region Imports
 import { TableMap } from '@atlaskit/editor-tables/table-map';
-import {
-  findTable,
-  getCellsInColumn,
-  getCellsInRow,
-} from '@atlaskit/editor-tables/utils';
+import { findTable, getCellsInColumn, getCellsInRow } from '@atlaskit/editor-tables/utils';
 
 import { createCommand, getPluginState } from '../pm-plugins/plugin-factory';
 import type { Cell, CellColumnPositioning } from '../types';
 import { TableDecorations } from '../types';
 import {
-  createCellHoverDecoration,
-  createColumnLineResize,
-  createControlsHoverDecoration,
-  getMergedCellsPositions,
-  updatePluginStateDecorations,
+	createCellHoverDecoration,
+	createColumnLineResize,
+	createControlsHoverDecoration,
+	getMergedCellsPositions,
+	updatePluginStateDecorations,
 } from '../utils';
 
 const makeArray = (n: number) => Array.from(Array(n).keys());
 
 export const hoverMergedCells = () =>
-  createCommand(
-    (state) => {
-      const mergedCellsPositions = getMergedCellsPositions(state.tr);
-      if (!mergedCellsPositions.length) {
-        return false;
-      }
-      const table = findTable(state.tr.selection);
-      if (!table) {
-        return false;
-      }
-
-      const mergedCells: Cell[] = mergedCellsPositions.map((pos) => ({
-        pos: pos + table.start,
-        start: pos + table.start + 1,
-        node: table.node.nodeAt(pos)!,
-      }));
-
-      const decorations = createCellHoverDecoration(mergedCells);
-
-      return {
-        type: 'HOVER_MERGED_CELLS',
-        data: {
-          decorationSet: updatePluginStateDecorations(
-            state,
-            decorations,
-            TableDecorations.CELL_CONTROLS_HOVER,
-          ),
-        },
-      };
-    },
-    (tr) => tr.setMeta('addToHistory', false),
-  );
+	createCommand(
+		(state) => {
+			const mergedCellsPositions = getMergedCellsPositions(state.tr);
+			if (!mergedCellsPositions.length) {
+				return false;
+			}
+			const table = findTable(state.tr.selection);
+			if (!table) {
+				return false;
+			}
+
+			const mergedCells: Cell[] = mergedCellsPositions.map((pos) => ({
+				pos: pos + table.start,
+				start: pos + table.start + 1,
+				node: table.node.nodeAt(pos)!,
+			}));
+
+			const decorations = createCellHoverDecoration(mergedCells);
+
+			return {
+				type: 'HOVER_MERGED_CELLS',
+				data: {
+					decorationSet: updatePluginStateDecorations(
+						state,
+						decorations,
+						TableDecorations.CELL_CONTROLS_HOVER,
+					),
+				},
+			};
+		},
+		(tr) => tr.setMeta('addToHistory', false),
+	);
 
 export const hoverColumns = (hoveredColumns: number[], isInDanger?: boolean) =>
-  createCommand(
-    (state) => {
-      const cells = getCellsInColumn(hoveredColumns)(state.tr.selection);
-
-      const { isDragAndDropEnabled } = getPluginState(state);
-      if (!cells) {
-        return false;
-      }
-
-      const decorations = createControlsHoverDecoration(
-        cells,
-        'column',
-        state.tr,
-        isDragAndDropEnabled,
-        hoveredColumns,
-        isInDanger,
-      );
-
-      return {
-        type: 'HOVER_COLUMNS',
-        data: {
-          decorationSet: updatePluginStateDecorations(
-            state,
-            decorations,
-            TableDecorations.COLUMN_CONTROLS_HOVER,
-          ),
-          hoveredColumns,
-          isInDanger,
-        },
-      };
-    },
-    (tr) => tr.setMeta('addToHistory', false),
-  );
+	createCommand(
+		(state) => {
+			const cells = getCellsInColumn(hoveredColumns)(state.tr.selection);
+
+			const { isDragAndDropEnabled } = getPluginState(state);
+			if (!cells) {
+				return false;
+			}
+
+			const decorations = createControlsHoverDecoration(
+				cells,
+				'column',
+				state.tr,
+				isDragAndDropEnabled,
+				hoveredColumns,
+				isInDanger,
+			);
+
+			return {
+				type: 'HOVER_COLUMNS',
+				data: {
+					decorationSet: updatePluginStateDecorations(
+						state,
+						decorations,
+						TableDecorations.COLUMN_CONTROLS_HOVER,
+					),
+					hoveredColumns,
+					isInDanger,
+				},
+			};
+		},
+		(tr) => tr.setMeta('addToHistory', false),
+	);
 
 export const hoverRows = (hoveredRows: number[], isInDanger?: boolean) =>
-  createCommand(
-    (state) => {
-      const cells = getCellsInRow(hoveredRows)(state.selection);
-      if (!cells) {
-        return false;
-      }
-      const { isDragAndDropEnabled } = getPluginState(state);
-      const decorations = createControlsHoverDecoration(
-        cells,
-        'row',
-        state.tr,
-        isDragAndDropEnabled,
-        hoveredRows,
-        isInDanger,
-      );
-
-      return {
-        type: 'HOVER_ROWS',
-        data: {
-          decorationSet: updatePluginStateDecorations(
-            state,
-            decorations,
-            TableDecorations.ROW_CONTROLS_HOVER,
-          ),
-          hoveredRows,
-          isInDanger,
-        },
-      };
-    },
-    (tr) => tr.setMeta('addToHistory', false),
-  );
+	createCommand(
+		(state) => {
+			const cells = getCellsInRow(hoveredRows)(state.selection);
+			if (!cells) {
+				return false;
+			}
+			const { isDragAndDropEnabled } = getPluginState(state);
+			const decorations = createControlsHoverDecoration(
+				cells,
+				'row',
+				state.tr,
+				isDragAndDropEnabled,
+				hoveredRows,
+				isInDanger,
+			);
+
+			return {
+				type: 'HOVER_ROWS',
+				data: {
+					decorationSet: updatePluginStateDecorations(
+						state,
+						decorations,
+						TableDecorations.ROW_CONTROLS_HOVER,
+					),
+					hoveredRows,
+					isInDanger,
+				},
+			};
+		},
+		(tr) => tr.setMeta('addToHistory', false),
+	);
 
 export const hoverTable = (isInDanger?: boolean, isSelected?: boolean) =>
-  createCommand(
-    (state) => {
-      const table = findTable(state.selection);
-      if (!table) {
-        return false;
-      }
-      const map = TableMap.get(table.node);
-      const hoveredColumns = makeArray(map.width);
-      const hoveredRows = makeArray(map.height);
-      const cells = getCellsInRow(hoveredRows)(state.selection);
-      if (!cells) {
-        return false;
-      }
-      const { isDragAndDropEnabled } = getPluginState(state);
-      const decorations = createControlsHoverDecoration(
-        cells,
-        'table',
-        state.tr,
-        isDragAndDropEnabled,
-        [],
-        isInDanger,
-        isSelected,
-      );
-
-      return {
-        type: 'HOVER_TABLE',
-        data: {
-          decorationSet: updatePluginStateDecorations(
-            state,
-            decorations,
-            TableDecorations.TABLE_CONTROLS_HOVER,
-          ),
-          hoveredColumns,
-          hoveredRows,
-          isInDanger,
-          isWholeTableInDanger: isInDanger,
-        },
-      };
-    },
-    (tr) => tr.setMeta('addToHistory', false),
-  );
+	createCommand(
+		(state) => {
+			const table = findTable(state.selection);
+			if (!table) {
+				return false;
+			}
+			const map = TableMap.get(table.node);
+			const hoveredColumns = makeArray(map.width);
+			const hoveredRows = makeArray(map.height);
+			const cells = getCellsInRow(hoveredRows)(state.selection);
+			if (!cells) {
+				return false;
+			}
+			const { isDragAndDropEnabled } = getPluginState(state);
+			const decorations = createControlsHoverDecoration(
+				cells,
+				'table',
+				state.tr,
+				isDragAndDropEnabled,
+				[],
+				isInDanger,
+				isSelected,
+			);
+
+			return {
+				type: 'HOVER_TABLE',
+				data: {
+					decorationSet: updatePluginStateDecorations(
+						state,
+						decorations,
+						TableDecorations.TABLE_CONTROLS_HOVER,
+					),
+					hoveredColumns,
+					hoveredRows,
+					isInDanger,
+					isWholeTableInDanger: isInDanger,
+				},
+			};
+		},
+		(tr) => tr.setMeta('addToHistory', false),
+	);
 
 export const clearHoverSelection = () =>
-  createCommand((state) => ({
-    type: 'CLEAR_HOVER_SELECTION',
-    data: {
-      decorationSet: updatePluginStateDecorations(
-        state,
-        [],
-        TableDecorations.ALL_CONTROLS_HOVER,
-      ),
-      isInDanger: false,
-      isWholeTableInDanger: false,
-    },
-  }));
-
-export const showResizeHandleLine = (
-  cellColumnPositioning: CellColumnPositioning,
-) =>
-  createCommand((state) => ({
-    type: 'SHOW_RESIZE_HANDLE_LINE',
-    data: {
-      decorationSet: updatePluginStateDecorations(
-        state,
-        createColumnLineResize(state.selection, cellColumnPositioning),
-        TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
-      ),
-    },
-  }));
+	createCommand((state) => ({
+		type: 'CLEAR_HOVER_SELECTION',
+		data: {
+			decorationSet: updatePluginStateDecorations(state, [], TableDecorations.ALL_CONTROLS_HOVER),
+			isInDanger: false,
+			isWholeTableInDanger: false,
+		},
+	}));
+
+export const showResizeHandleLine = (cellColumnPositioning: CellColumnPositioning) =>
+	createCommand((state) => ({
+		type: 'SHOW_RESIZE_HANDLE_LINE',
+		data: {
+			decorationSet: updatePluginStateDecorations(
+				state,
+				createColumnLineResize(state.selection, cellColumnPositioning),
+				TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
+			),
+		},
+	}));
 
 export const hideResizeHandleLine = () =>
-  createCommand((state) => ({
-    type: 'HIDE_RESIZE_HANDLE_LINE',
-    data: {
-      decorationSet: updatePluginStateDecorations(
-        state,
-        [],
-        TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
-      ),
-    },
-  }));
+	createCommand((state) => ({
+		type: 'HIDE_RESIZE_HANDLE_LINE',
+		data: {
+			decorationSet: updatePluginStateDecorations(
+				state,
+				[],
+				TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
+			),
+		},
+	}));
 
 export const setTableHovered = (hovered: boolean) =>
-  createCommand(
-    () => {
-      return {
-        type: 'TABLE_HOVERED',
-        data: {
-          isTableHovered: hovered,
-        },
-      };
-    },
-    (tr) => tr.setMeta('addToHistory', false),
-  );
+	createCommand(
+		() => {
+			return {
+				type: 'TABLE_HOVERED',
+				data: {
+					isTableHovered: hovered,
+				},
+			};
+		},
+		(tr) => tr.setMeta('addToHistory', false),
+	);
 
 export const hoverCell = (rowIndex?: number, colIndex?: number) =>
-  createCommand(
-    (state) => {
-      const { hoveredCell: prevHoveredCell } = getPluginState(state);
-
-      // If no arguments have been passed then the intention it to reset the hover cell data
-      const clear = rowIndex === undefined && colIndex === undefined;
-
-      const nextRowIndex = clear
-        ? undefined
-        : rowIndex ?? prevHoveredCell.rowIndex;
-      const nextColIndex = clear
-        ? undefined
-        : colIndex ?? prevHoveredCell.colIndex;
-
-      if (
-        nextRowIndex === prevHoveredCell.rowIndex &&
-        nextColIndex === prevHoveredCell.colIndex
-      ) {
-        return false;
-      }
-
-      return {
-        type: 'HOVER_CELL',
-        data: {
-          hoveredCell: {
-            rowIndex: nextRowIndex,
-            colIndex: nextColIndex,
-          },
-        },
-      };
-    },
-    (tr) => tr.setMeta('addToHistory', false),
-  );
+	createCommand(
+		(state) => {
+			const { hoveredCell: prevHoveredCell } = getPluginState(state);
+
+			// If no arguments have been passed then the intention it to reset the hover cell data
+			const clear = rowIndex === undefined && colIndex === undefined;
+
+			const nextRowIndex = clear ? undefined : rowIndex ?? prevHoveredCell.rowIndex;
+			const nextColIndex = clear ? undefined : colIndex ?? prevHoveredCell.colIndex;
+
+			if (nextRowIndex === prevHoveredCell.rowIndex && nextColIndex === prevHoveredCell.colIndex) {
+				return false;
+			}
+
+			return {
+				type: 'HOVER_CELL',
+				data: {
+					hoveredCell: {
+						rowIndex: nextRowIndex,
+						colIndex: nextColIndex,
+					},
+				},
+			};
+		},
+		(tr) => tr.setMeta('addToHistory', false),
+	);