@atlaskit/editor-plugin-table 12.2.6 → 12.2.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (204) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/package.json +4 -4
  3. package/afm-cc/tsconfig.json +0 -123
  4. package/afm-dev-agents/tsconfig.json +0 -123
  5. package/afm-jira/tsconfig.json +0 -123
  6. package/afm-passionfruit/tsconfig.json +0 -123
  7. package/afm-post-office/tsconfig.json +0 -123
  8. package/afm-rovo-extension/tsconfig.json +0 -123
  9. package/afm-townsquare/tsconfig.json +0 -123
  10. package/afm-volt/tsconfig.json +0 -114
  11. package/build/tsconfig.json +0 -23
  12. package/docs/0-intro.tsx +0 -57
  13. package/src/index.ts +0 -21
  14. package/src/nodeviews/ExternalDropTargets.tsx +0 -91
  15. package/src/nodeviews/OverflowShadowsObserver.ts +0 -156
  16. package/src/nodeviews/TableCell.ts +0 -134
  17. package/src/nodeviews/TableComponent.tsx +0 -1590
  18. package/src/nodeviews/TableComponentWithSharedState.tsx +0 -278
  19. package/src/nodeviews/TableContainer.tsx +0 -926
  20. package/src/nodeviews/TableNodeViewBase.ts +0 -29
  21. package/src/nodeviews/TableResizer.tsx +0 -884
  22. package/src/nodeviews/TableRow.ts +0 -830
  23. package/src/nodeviews/TableStickyScrollbar.ts +0 -211
  24. package/src/nodeviews/__mocks__/OverflowShadowsObserver.ts +0 -15
  25. package/src/nodeviews/__mocks__/OverridableMock.ts +0 -26
  26. package/src/nodeviews/table-container-styles.ts +0 -9
  27. package/src/nodeviews/table-node-views.ts +0 -76
  28. package/src/nodeviews/table.tsx +0 -530
  29. package/src/nodeviews/toDOM.ts +0 -244
  30. package/src/nodeviews/types.ts +0 -36
  31. package/src/nodeviews/update-overflow-shadows.ts +0 -11
  32. package/src/pm-plugins/analytics/actions.ts +0 -21
  33. package/src/pm-plugins/analytics/commands.ts +0 -47
  34. package/src/pm-plugins/analytics/plugin-factory.ts +0 -9
  35. package/src/pm-plugins/analytics/plugin-key.ts +0 -5
  36. package/src/pm-plugins/analytics/plugin.ts +0 -80
  37. package/src/pm-plugins/analytics/reducer.ts +0 -27
  38. package/src/pm-plugins/analytics/types.ts +0 -20
  39. package/src/pm-plugins/analytics/utils/moved-event.ts +0 -51
  40. package/src/pm-plugins/commands/clear.ts +0 -43
  41. package/src/pm-plugins/commands/collapse.ts +0 -17
  42. package/src/pm-plugins/commands/column-resize.ts +0 -478
  43. package/src/pm-plugins/commands/commands-with-analytics.ts +0 -715
  44. package/src/pm-plugins/commands/delete.ts +0 -42
  45. package/src/pm-plugins/commands/display-mode.ts +0 -18
  46. package/src/pm-plugins/commands/go-to-next-cell.ts +0 -198
  47. package/src/pm-plugins/commands/hover.ts +0 -242
  48. package/src/pm-plugins/commands/index.ts +0 -51
  49. package/src/pm-plugins/commands/insert.ts +0 -438
  50. package/src/pm-plugins/commands/misc.ts +0 -811
  51. package/src/pm-plugins/commands/referentiality.ts +0 -15
  52. package/src/pm-plugins/commands/selection.ts +0 -537
  53. package/src/pm-plugins/commands/sort.ts +0 -102
  54. package/src/pm-plugins/commands/split-cell.ts +0 -28
  55. package/src/pm-plugins/commands/toggle.ts +0 -109
  56. package/src/pm-plugins/create-plugin-config.ts +0 -17
  57. package/src/pm-plugins/decorations/plugin.ts +0 -107
  58. package/src/pm-plugins/decorations/utils/column-controls.ts +0 -91
  59. package/src/pm-plugins/decorations/utils/column-resizing.ts +0 -71
  60. package/src/pm-plugins/decorations/utils/compose-decorations.ts +0 -9
  61. package/src/pm-plugins/decorations/utils/types.ts +0 -16
  62. package/src/pm-plugins/default-table-selection.ts +0 -14
  63. package/src/pm-plugins/drag-and-drop/actions.ts +0 -48
  64. package/src/pm-plugins/drag-and-drop/commands-with-analytics.ts +0 -222
  65. package/src/pm-plugins/drag-and-drop/commands.ts +0 -194
  66. package/src/pm-plugins/drag-and-drop/consts.ts +0 -7
  67. package/src/pm-plugins/drag-and-drop/plugin-factory.ts +0 -33
  68. package/src/pm-plugins/drag-and-drop/plugin-key.ts +0 -5
  69. package/src/pm-plugins/drag-and-drop/plugin.ts +0 -398
  70. package/src/pm-plugins/drag-and-drop/reducer.ts +0 -38
  71. package/src/pm-plugins/drag-and-drop/types.ts +0 -18
  72. package/src/pm-plugins/drag-and-drop/utils/autoscrollers.ts +0 -49
  73. package/src/pm-plugins/drag-and-drop/utils/getDragBehaviour.ts +0 -9
  74. package/src/pm-plugins/drag-and-drop/utils/monitor.ts +0 -73
  75. package/src/pm-plugins/handlers.ts +0 -161
  76. package/src/pm-plugins/keymap.ts +0 -436
  77. package/src/pm-plugins/main.ts +0 -433
  78. package/src/pm-plugins/plugin-factory.ts +0 -42
  79. package/src/pm-plugins/plugin-key.ts +0 -8
  80. package/src/pm-plugins/reducer.ts +0 -145
  81. package/src/pm-plugins/safari-delete-composition-text-issue-workaround.ts +0 -102
  82. package/src/pm-plugins/sticky-headers/commands.ts +0 -8
  83. package/src/pm-plugins/sticky-headers/plugin-key.ts +0 -5
  84. package/src/pm-plugins/sticky-headers/plugin-state.ts +0 -52
  85. package/src/pm-plugins/sticky-headers/plugin.ts +0 -12
  86. package/src/pm-plugins/sticky-headers/types.ts +0 -20
  87. package/src/pm-plugins/sticky-headers/util.ts +0 -18
  88. package/src/pm-plugins/table-analytics.ts +0 -100
  89. package/src/pm-plugins/table-local-id.ts +0 -213
  90. package/src/pm-plugins/table-resizing/commands.ts +0 -116
  91. package/src/pm-plugins/table-resizing/event-handlers.ts +0 -352
  92. package/src/pm-plugins/table-resizing/plugin-factory.ts +0 -29
  93. package/src/pm-plugins/table-resizing/plugin-key.ts +0 -5
  94. package/src/pm-plugins/table-resizing/plugin.ts +0 -94
  95. package/src/pm-plugins/table-resizing/reducer.ts +0 -37
  96. package/src/pm-plugins/table-resizing/utils/colgroup.ts +0 -306
  97. package/src/pm-plugins/table-resizing/utils/column-state.ts +0 -120
  98. package/src/pm-plugins/table-resizing/utils/consts.ts +0 -11
  99. package/src/pm-plugins/table-resizing/utils/content-width.ts +0 -118
  100. package/src/pm-plugins/table-resizing/utils/dom.ts +0 -132
  101. package/src/pm-plugins/table-resizing/utils/misc.ts +0 -282
  102. package/src/pm-plugins/table-resizing/utils/resize-column.ts +0 -34
  103. package/src/pm-plugins/table-resizing/utils/resize-logic.ts +0 -289
  104. package/src/pm-plugins/table-resizing/utils/resize-state.ts +0 -417
  105. package/src/pm-plugins/table-resizing/utils/scale-table.ts +0 -290
  106. package/src/pm-plugins/table-resizing/utils/types.ts +0 -25
  107. package/src/pm-plugins/table-resizing/utils/unit-to-number.ts +0 -1
  108. package/src/pm-plugins/table-selection-keymap.ts +0 -64
  109. package/src/pm-plugins/table-size-selector.ts +0 -39
  110. package/src/pm-plugins/table-width-in-comment-fix.ts +0 -113
  111. package/src/pm-plugins/table-width.ts +0 -153
  112. package/src/pm-plugins/transforms/column-width.ts +0 -249
  113. package/src/pm-plugins/transforms/delete-columns.ts +0 -281
  114. package/src/pm-plugins/transforms/delete-rows.ts +0 -154
  115. package/src/pm-plugins/transforms/fix-tables.ts +0 -249
  116. package/src/pm-plugins/transforms/merge.ts +0 -301
  117. package/src/pm-plugins/transforms/replace-table.ts +0 -38
  118. package/src/pm-plugins/transforms/split.ts +0 -90
  119. package/src/pm-plugins/utils/alignment.ts +0 -33
  120. package/src/pm-plugins/utils/analytics.ts +0 -238
  121. package/src/pm-plugins/utils/collapse.ts +0 -93
  122. package/src/pm-plugins/utils/column-controls.ts +0 -250
  123. package/src/pm-plugins/utils/create.ts +0 -64
  124. package/src/pm-plugins/utils/decoration.ts +0 -672
  125. package/src/pm-plugins/utils/dom.ts +0 -251
  126. package/src/pm-plugins/utils/drag-menu.tsx +0 -491
  127. package/src/pm-plugins/utils/get-allow-add-column-custom-step.ts +0 -10
  128. package/src/pm-plugins/utils/guidelines.ts +0 -30
  129. package/src/pm-plugins/utils/merged-cells.ts +0 -239
  130. package/src/pm-plugins/utils/nodes.ts +0 -162
  131. package/src/pm-plugins/utils/paste.ts +0 -386
  132. package/src/pm-plugins/utils/row-controls.ts +0 -211
  133. package/src/pm-plugins/utils/selection.ts +0 -17
  134. package/src/pm-plugins/utils/snapping.ts +0 -136
  135. package/src/pm-plugins/utils/table.ts +0 -60
  136. package/src/pm-plugins/utils/update-plugin-state-decorations.ts +0 -13
  137. package/src/pm-plugins/view-mode-sort/consts.ts +0 -3
  138. package/src/pm-plugins/view-mode-sort/index.ts +0 -291
  139. package/src/pm-plugins/view-mode-sort/plugin-key.ts +0 -7
  140. package/src/pm-plugins/view-mode-sort/types.ts +0 -23
  141. package/src/pm-plugins/view-mode-sort/utils.ts +0 -136
  142. package/src/tablePlugin.tsx +0 -971
  143. package/src/tablePluginType.ts +0 -102
  144. package/src/types/index.ts +0 -592
  145. package/src/ui/ColumnResizeWidget/index.tsx +0 -61
  146. package/src/ui/ContentComponent.tsx +0 -311
  147. package/src/ui/DragHandle/HandleIconComponent.tsx +0 -21
  148. package/src/ui/DragHandle/index.tsx +0 -391
  149. package/src/ui/DragPreview/index.tsx +0 -51
  150. package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx +0 -59
  151. package/src/ui/FloatingContextualButton/FixedButton.tsx +0 -203
  152. package/src/ui/FloatingContextualButton/index.tsx +0 -168
  153. package/src/ui/FloatingContextualButton/styles.ts +0 -69
  154. package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +0 -931
  155. package/src/ui/FloatingContextualMenu/index.tsx +0 -141
  156. package/src/ui/FloatingContextualMenu/styles.ts +0 -77
  157. package/src/ui/FloatingDeleteButton/DeleteButton.tsx +0 -54
  158. package/src/ui/FloatingDeleteButton/getPopUpOptions.ts +0 -65
  159. package/src/ui/FloatingDeleteButton/index.tsx +0 -383
  160. package/src/ui/FloatingDeleteButton/types.ts +0 -3
  161. package/src/ui/FloatingDragMenu/DragMenu.tsx +0 -668
  162. package/src/ui/FloatingDragMenu/DropdownMenu.tsx +0 -221
  163. package/src/ui/FloatingDragMenu/index.tsx +0 -136
  164. package/src/ui/FloatingDragMenu/styles.ts +0 -83
  165. package/src/ui/FloatingInsertButton/InsertButton.tsx +0 -263
  166. package/src/ui/FloatingInsertButton/getPopupOptions.ts +0 -131
  167. package/src/ui/FloatingInsertButton/index.tsx +0 -314
  168. package/src/ui/FloatingToolbarLabel/FloatingToolbarLabel.tsx +0 -31
  169. package/src/ui/SizeSelector/index.tsx +0 -74
  170. package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +0 -397
  171. package/src/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.tsx +0 -105
  172. package/src/ui/TableFloatingColumnControls/ColumnDropTargets/index.tsx +0 -63
  173. package/src/ui/TableFloatingColumnControls/index.tsx +0 -151
  174. package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +0 -106
  175. package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +0 -143
  176. package/src/ui/TableFloatingControls/CornerControls/types.ts +0 -12
  177. package/src/ui/TableFloatingControls/FloatingControlsWithSelection.tsx +0 -88
  178. package/src/ui/TableFloatingControls/NumberColumn/index.tsx +0 -175
  179. package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +0 -131
  180. package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +0 -429
  181. package/src/ui/TableFloatingControls/RowDropTarget/index.tsx +0 -96
  182. package/src/ui/TableFloatingControls/index.tsx +0 -275
  183. package/src/ui/TableFullWidthLabel/index.tsx +0 -38
  184. package/src/ui/common-styles.ts +0 -1218
  185. package/src/ui/consts.ts +0 -109
  186. package/src/ui/event-handlers.ts +0 -662
  187. package/src/ui/global-styles.tsx +0 -55
  188. package/src/ui/hooks/useInternalTablePluginStateSelector.ts +0 -38
  189. package/src/ui/icons/AddColLeftIcon.tsx +0 -37
  190. package/src/ui/icons/AddColRightIcon.tsx +0 -37
  191. package/src/ui/icons/AddRowAboveIcon.tsx +0 -22
  192. package/src/ui/icons/AddRowBelowIcon.tsx +0 -39
  193. package/src/ui/icons/DragHandleDisabledIcon.tsx +0 -25
  194. package/src/ui/icons/DragHandleIcon.tsx +0 -16
  195. package/src/ui/icons/DragInMotionIcon.tsx +0 -54
  196. package/src/ui/icons/MergeCellsIcon.tsx +0 -26
  197. package/src/ui/icons/MinimisedHandle.tsx +0 -15
  198. package/src/ui/icons/SortingIconWrapper.tsx +0 -43
  199. package/src/ui/icons/SplitCellIcon.tsx +0 -34
  200. package/src/ui/toolbar.tsx +0 -1153
  201. package/src/ui/ui-styles.ts +0 -960
  202. package/tsconfig.app.json +0 -135
  203. package/tsconfig.dev.json +0 -54
  204. package/tsconfig.json +0 -18
@@ -1,662 +0,0 @@
1
- import rafSchedule from 'raf-schd';
2
-
3
- import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
4
- import { ACTION_SUBJECT, EVENT_TYPE, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
5
- import { getParentOfTypeCount } from '@atlaskit/editor-common/nesting';
6
- import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
7
- import {
8
- browser,
9
- closestElement,
10
- isElementInTableCell,
11
- isLastItemMediaGroup,
12
- setNodeSelection,
13
- } from '@atlaskit/editor-common/utils';
14
- import type { Node as PmNode } from '@atlaskit/editor-prosemirror/model';
15
- import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
16
- import { Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
17
- import { findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
18
- import type { EditorView } from '@atlaskit/editor-prosemirror/view';
19
- import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
20
- import { TableMap } from '@atlaskit/editor-tables/table-map';
21
- import {
22
- cellAround,
23
- findCellRectClosestToPos,
24
- findTable,
25
- getSelectionRect,
26
- removeTable,
27
- } from '@atlaskit/editor-tables/utils';
28
-
29
- import {
30
- addResizeHandleDecorations,
31
- clearHoverSelection,
32
- hideInsertColumnOrRowButton,
33
- hideResizeHandleLine,
34
- hoverCell,
35
- hoverColumns,
36
- selectColumn,
37
- setEditorFocus,
38
- setTableHovered,
39
- showInsertColumnButton,
40
- showInsertRowButton,
41
- showResizeHandleLine,
42
- } from '../pm-plugins/commands';
43
- import { getPluginState as getDragDropPluginState } from '../pm-plugins/drag-and-drop/plugin-factory';
44
- import { getPluginState } from '../pm-plugins/plugin-factory';
45
- import { getPluginState as getResizePluginState } from '../pm-plugins/table-resizing/plugin-factory';
46
- import { deleteColumns } from '../pm-plugins/transforms/delete-columns';
47
- import { deleteRows } from '../pm-plugins/transforms/delete-rows';
48
- import { getSelectedCellInfo } from '../pm-plugins/utils/analytics';
49
- import {
50
- convertHTMLCellIndexToColumnIndex,
51
- getColumnIndexMappedToColumnIndexInFirstRow,
52
- } from '../pm-plugins/utils/column-controls';
53
- import {
54
- getColumnOrRowIndex,
55
- getMousePositionHorizontalRelativeByElement,
56
- getMousePositionVerticalRelativeByElement,
57
- hasResizeHandler,
58
- isCell,
59
- isColumnControlsDecorations,
60
- isCornerButton,
61
- isDragColumnFloatingInsertDot,
62
- isDragCornerButton,
63
- isDragRowFloatingInsertDot,
64
- isInsertRowButton,
65
- isResizeHandleDecoration,
66
- isRowControlsButton,
67
- isTableContainerOrWrapper,
68
- isTableControlsButton,
69
- } from '../pm-plugins/utils/dom';
70
- import { getAllowAddColumnCustomStep } from '../pm-plugins/utils/get-allow-add-column-custom-step';
71
- import { TableCssClassName as ClassName, RESIZE_HANDLE_AREA_DECORATION_GAP } from '../types';
72
- import type { PluginInjectionAPI } from '../types';
73
-
74
- const isFocusingCalendar = (event: Event) =>
75
- event instanceof FocusEvent &&
76
- event.relatedTarget instanceof HTMLElement &&
77
- event.relatedTarget.getAttribute('aria-label') === 'calendar';
78
-
79
- const isFocusingModal = (event: Event) =>
80
- event instanceof FocusEvent &&
81
- event.relatedTarget instanceof HTMLElement &&
82
- event.relatedTarget.closest('[role="dialog"]');
83
-
84
- const isFocusingFloatingToolbar = (event: Event) =>
85
- event instanceof FocusEvent &&
86
- event.relatedTarget instanceof HTMLElement &&
87
- event.relatedTarget.closest('[role="toolbar"]');
88
-
89
- const isFocusingDragHandles = (event: Event) =>
90
- event instanceof FocusEvent &&
91
- event.relatedTarget instanceof HTMLElement &&
92
- event.relatedTarget.closest('button') &&
93
- event.relatedTarget.getAttribute('draggable') === 'true';
94
-
95
- const isFocusingDragHandlesClickableZone = (event: Event) =>
96
- event instanceof FocusEvent &&
97
- event.relatedTarget instanceof HTMLElement &&
98
- event.relatedTarget.closest('button') &&
99
- event.relatedTarget.classList.contains(ClassName.DRAG_HANDLE_BUTTON_CLICKABLE_ZONE);
100
-
101
- export const handleBlur = (view: EditorView, event: Event): boolean => {
102
- const { state, dispatch } = view;
103
- // IE version check for ED-4665
104
- // Calendar focus check for ED-10466
105
- if (
106
- browser.ie_version !== 11 &&
107
- !isFocusingCalendar(event) &&
108
- !isFocusingModal(event) &&
109
- !isFocusingFloatingToolbar(event) &&
110
- !isFocusingDragHandles(event) &&
111
- !isFocusingDragHandlesClickableZone(event)
112
- ) {
113
- setEditorFocus(false)(state, dispatch);
114
- }
115
- event.preventDefault();
116
- return false;
117
- };
118
-
119
- export const handleFocus = (view: EditorView, event: Event): boolean => {
120
- const { state, dispatch } = view;
121
- setEditorFocus(true)(state, dispatch);
122
- event.preventDefault();
123
- return false;
124
- };
125
-
126
- type HTMLElementIE9 = Omit<HTMLElement, 'matches'> & {
127
- matches?: HTMLElement['matches']; // WARNING: 'matches' is optional in IE9
128
- msMatchesSelector?: (selectors: string) => boolean;
129
- };
130
-
131
- export const handleClick = (view: EditorView, event: Event): boolean => {
132
- if (!(event.target instanceof HTMLElement)) {
133
- return false;
134
- }
135
- const element = event.target as HTMLElementIE9;
136
- // Ignored via go/ees005
137
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
138
- const table = findTable(view.state.selection)!;
139
-
140
- // Ignored via go/ees005
141
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
142
- if (event instanceof MouseEvent && isColumnControlsDecorations(element as HTMLElement)) {
143
- // Ignored via go/ees005
144
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
145
- const [startIndex] = getColumnOrRowIndex(element as HTMLElement);
146
- const { state, dispatch } = view;
147
-
148
- return selectColumn(startIndex, event.shiftKey)(state, dispatch);
149
- }
150
-
151
- const matchfn = element.matches ? element.matches : element.msMatchesSelector;
152
-
153
- // check if the table cell with an image is clicked and its not the image itself
154
- if (
155
- !table ||
156
- // Ignored via go/ees005
157
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
158
- !isElementInTableCell(element as HTMLElement) ||
159
- !matchfn ||
160
- matchfn.call(element, 'table .image, table p, table .image div')
161
- ) {
162
- return false;
163
- }
164
- const map = TableMap.get(table.node);
165
-
166
- /** Getting the offset of current item clicked */
167
- // Ignored via go/ees005
168
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
169
- const colElement = (closestElement(element as HTMLElement, 'td') ||
170
- // Ignored via go/ees005
171
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
172
- closestElement(element as HTMLElement, 'th')) as HTMLTableDataCellElement;
173
- const colIndex = colElement && colElement.cellIndex;
174
- // Ignored via go/ees005
175
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
176
- const rowElement = closestElement(element as HTMLElement, 'tr') as HTMLTableRowElement;
177
- const rowIndex = rowElement && rowElement.rowIndex;
178
- const cellIndex = map.width * rowIndex + colIndex;
179
- const {
180
- dispatch,
181
- state: {
182
- tr,
183
- schema: {
184
- nodes: { paragraph },
185
- },
186
- },
187
- } = view;
188
- const cellPos = map.map[cellIndex];
189
- if (isNaN(cellPos) || cellPos === undefined || typeof cellPos !== 'number') {
190
- return false;
191
- }
192
-
193
- const editorElement = table.node.nodeAt(cellPos) as PmNode;
194
- /** Only if the last item is media group, insert a paragraph */
195
- if (isLastItemMediaGroup(editorElement)) {
196
- const posInTable = map.map[cellIndex] + editorElement.nodeSize;
197
- tr.insert(posInTable + table.pos, paragraph.create());
198
- dispatch(tr);
199
- setNodeSelection(view, posInTable + table.pos);
200
- }
201
- return true;
202
- };
203
-
204
- export const handleMouseOver = (view: EditorView, mouseEvent: Event): boolean => {
205
- if (!(mouseEvent.target instanceof HTMLElement)) {
206
- return false;
207
- }
208
- const { state, dispatch } = view;
209
- const target = mouseEvent.target;
210
- const { insertColumnButtonIndex, insertRowButtonIndex, isTableHovered } = getPluginState(state);
211
-
212
- if (isInsertRowButton(target)) {
213
- const [startIndex, endIndex] = getColumnOrRowIndex(target);
214
-
215
- const positionRow =
216
- getMousePositionVerticalRelativeByElement(mouseEvent as MouseEvent) === 'bottom'
217
- ? endIndex
218
- : startIndex;
219
- return showInsertRowButton(positionRow)(state, dispatch);
220
- }
221
-
222
- if (isColumnControlsDecorations(target)) {
223
- const [startIndex] = getColumnOrRowIndex(target);
224
- const { state, dispatch } = view;
225
-
226
- return hoverColumns([startIndex], false)(state, dispatch);
227
- }
228
-
229
- const isNestedTable = getParentOfTypeCount(state.schema.nodes.table)(state.selection.$from) > 1;
230
-
231
- if (isNestedTable) {
232
- // if the table is nested inside a table, we only call hideInsertColumnOrRowButton if the table nearest to the mouse target is NOT the parent table
233
- const nearestTable = closestElement(target, 'table');
234
- const nestedTable = findParentNodeOfTypeClosestToPos(state.doc.resolve(state.selection.from), [
235
- state.schema.nodes.table,
236
- ]);
237
-
238
- const parentTable = findParentNodeOfTypeClosestToPos(state.doc.resolve(nestedTable?.pos || 0), [
239
- state.schema.nodes.table,
240
- ]);
241
-
242
- if (
243
- nearestTable?.dataset.tableLocalId !== parentTable?.node.attrs.localId &&
244
- (isCell(target) || isCornerButton(target)) &&
245
- (typeof insertColumnButtonIndex === 'number' || typeof insertRowButtonIndex === 'number')
246
- ) {
247
- return hideInsertColumnOrRowButton()(state, dispatch);
248
- }
249
- } else if (
250
- (isCell(target) || isCornerButton(target)) &&
251
- (typeof insertColumnButtonIndex === 'number' || typeof insertRowButtonIndex === 'number')
252
- ) {
253
- return hideInsertColumnOrRowButton()(state, dispatch);
254
- }
255
-
256
- if (isResizeHandleDecoration(target)) {
257
- const [startIndex, endIndex] = getColumnOrRowIndex(target);
258
- return showResizeHandleLine({ left: startIndex, right: endIndex })(state, dispatch);
259
- }
260
-
261
- if (!isTableHovered) {
262
- return setTableHovered(true)(state, dispatch);
263
- }
264
-
265
- return false;
266
- };
267
-
268
- export const handleMouseUp = (view: EditorView, mouseEvent: Event): boolean => {
269
- if (!(mouseEvent instanceof MouseEvent)) {
270
- return false;
271
- }
272
- const { state, dispatch } = view;
273
- const { insertColumnButtonIndex, tableNode, tableRef } = getPluginState(state);
274
-
275
- if (insertColumnButtonIndex !== undefined && tableRef && tableRef.parentElement && tableNode) {
276
- const { width } = TableMap.get(tableNode);
277
- const newInsertColumnButtonIndex = insertColumnButtonIndex + 1;
278
- if (width === newInsertColumnButtonIndex) {
279
- const tableWidth = tableRef.clientWidth;
280
- tableRef.parentElement.scrollTo(tableWidth, 0);
281
-
282
- return showInsertColumnButton(newInsertColumnButtonIndex)(state, dispatch);
283
- }
284
- }
285
-
286
- return false;
287
- };
288
-
289
- // Ignore any `mousedown` `event` from control and numbered column buttons
290
- // PM end up changing selection during shift selection if not prevented
291
- export const handleMouseDown = (_: EditorView, event: Event) => {
292
- const isControl = !!(
293
- event.target &&
294
- event.target instanceof HTMLElement &&
295
- (isTableContainerOrWrapper(event.target) ||
296
- isColumnControlsDecorations(event.target) ||
297
- isRowControlsButton(event.target) ||
298
- isDragCornerButton(event.target))
299
- );
300
-
301
- if (isControl) {
302
- event.preventDefault();
303
- }
304
-
305
- return isControl;
306
- };
307
-
308
- export const handleMouseOut = (view: EditorView, mouseEvent: Event): boolean => {
309
- if (!(mouseEvent instanceof MouseEvent) || !(mouseEvent.target instanceof HTMLElement)) {
310
- return false;
311
- }
312
-
313
- const target = mouseEvent.target;
314
-
315
- if (isColumnControlsDecorations(target)) {
316
- const { state, dispatch } = view;
317
- return clearHoverSelection()(state, dispatch);
318
- }
319
-
320
- const relatedTarget = mouseEvent.relatedTarget as HTMLElement | null;
321
- // In case the user is moving between cell at the same column
322
- // we don't need to hide the resize handle decoration
323
- if (isResizeHandleDecoration(target) && !isResizeHandleDecoration(relatedTarget)) {
324
- const { state, dispatch } = view;
325
- const { isKeyboardResize } = getPluginState(state);
326
- if (isKeyboardResize) {
327
- // no need to hide decoration if column resizing started by keyboard
328
- return false;
329
- }
330
- return hideResizeHandleLine()(state, dispatch);
331
- }
332
-
333
- return false;
334
- };
335
-
336
- export const handleMouseEnter = (view: EditorView, mouseEvent: Event): boolean => {
337
- const { state, dispatch } = view;
338
-
339
- const { isTableHovered } = getPluginState(state);
340
-
341
- if (!isTableHovered) {
342
- return setTableHovered(true)(state, dispatch);
343
- }
344
-
345
- return false;
346
- };
347
-
348
- export const handleMouseLeave = (view: EditorView, event: Event): boolean => {
349
- if (!(event.target instanceof HTMLElement)) {
350
- return false;
351
- }
352
-
353
- const { state, dispatch } = view;
354
- const { insertColumnButtonIndex, insertRowButtonIndex, isDragAndDropEnabled, isTableHovered } =
355
- getPluginState(state);
356
-
357
- if (isTableHovered) {
358
- if (isDragAndDropEnabled) {
359
- const { isDragMenuOpen = false } = getDragDropPluginState(state);
360
- !isDragMenuOpen && setTableHovered(false)(state, dispatch);
361
- } else {
362
- setTableHovered(false)(state, dispatch);
363
- }
364
- return true;
365
- }
366
-
367
- // If this table doesn't have focus then we want to skip everything after this.
368
- if (!isTableInFocus(view)) {
369
- return false;
370
- }
371
-
372
- const target = event.target;
373
- if (isTableControlsButton(target)) {
374
- return true;
375
- }
376
-
377
- if (
378
- (typeof insertColumnButtonIndex !== 'undefined' ||
379
- typeof insertRowButtonIndex !== 'undefined') &&
380
- hideInsertColumnOrRowButton()(state, dispatch)
381
- ) {
382
- return true;
383
- }
384
-
385
- return false;
386
- };
387
-
388
- // IMPORTANT: The mouse move handler has been setup with RAF schedule to avoid Reflows which will occur as some methods
389
- // need to access the mouse event offset position and also the target clientWidth vallue.
390
- const handleMouseMoveDebounce = (nodeViewPortalProviderAPI: PortalProviderAPI) =>
391
- rafSchedule((view: EditorView, event: MouseEvent, offsetX: number) => {
392
- if (!(event.target instanceof HTMLElement)) {
393
- return false;
394
- }
395
- const element = event.target;
396
-
397
- if (isColumnControlsDecorations(element) || isDragColumnFloatingInsertDot(element)) {
398
- const { state, dispatch } = view;
399
- const { insertColumnButtonIndex } = getPluginState(state);
400
- const [startIndex, endIndex] = getColumnOrRowIndex(element);
401
-
402
- const positionColumn =
403
- getMousePositionHorizontalRelativeByElement(event, offsetX, undefined) === 'right'
404
- ? endIndex
405
- : startIndex;
406
-
407
- if (positionColumn !== insertColumnButtonIndex) {
408
- return showInsertColumnButton(positionColumn)(state, dispatch);
409
- }
410
- }
411
-
412
- if (isRowControlsButton(element) || isDragRowFloatingInsertDot(element)) {
413
- const { state, dispatch } = view;
414
- const { insertRowButtonIndex } = getPluginState(state);
415
- const [startIndex, endIndex] = getColumnOrRowIndex(element);
416
-
417
- const positionRow =
418
- getMousePositionVerticalRelativeByElement(event) === 'bottom' ? endIndex : startIndex;
419
-
420
- if (positionRow !== insertRowButtonIndex) {
421
- return showInsertRowButton(positionRow)(state, dispatch);
422
- }
423
- }
424
-
425
- if (!isResizeHandleDecoration(element) && isCell(element)) {
426
- const positionColumn = getMousePositionHorizontalRelativeByElement(
427
- event,
428
- offsetX,
429
- RESIZE_HANDLE_AREA_DECORATION_GAP,
430
- );
431
-
432
- if (positionColumn !== null) {
433
- const { state, dispatch } = view;
434
- const { resizeHandleColumnIndex, resizeHandleRowIndex } = getPluginState(state);
435
-
436
- const isKeyboardResize = getPluginState(state).isKeyboardResize;
437
- const tableCell = closestElement(element, 'td, th') as HTMLTableCellElement;
438
- const cellStartPosition = view.posAtDOM(tableCell, 0);
439
- const rect = findCellRectClosestToPos(state.doc.resolve(cellStartPosition));
440
-
441
- if (rect) {
442
- const columnEndIndexTarget = positionColumn === 'left' ? rect.left : rect.right;
443
-
444
- const rowIndexTarget = rect.top;
445
-
446
- if (
447
- (columnEndIndexTarget !== resizeHandleColumnIndex ||
448
- rowIndexTarget !== resizeHandleRowIndex ||
449
- !hasResizeHandler({ target: element, columnEndIndexTarget })) &&
450
- !isKeyboardResize // if initiated by keyboard don't need to react on hover for other resize sliders
451
- ) {
452
- return addResizeHandleDecorations(
453
- rowIndexTarget,
454
- columnEndIndexTarget,
455
- true,
456
- nodeViewPortalProviderAPI,
457
- )(state, dispatch);
458
- }
459
- }
460
- }
461
- }
462
-
463
- return false;
464
- });
465
-
466
- export const handleMouseMove =
467
- (nodeViewPortalProviderAPI: PortalProviderAPI) => (view: EditorView, event: Event) => {
468
- if (!(event.target instanceof HTMLElement)) {
469
- return false;
470
- }
471
-
472
- // NOTE: When accessing offsetX in gecko from a deferred callback, it will return 0. However it will be non-zero if accessed
473
- // within the scope of it's initial mouse move handler. Also Chrome does return the correct value, however it could trigger
474
- // a reflow. So for now this will just grab the offsetX value immediately for gecko and chrome will calculate later
475
- // in the deferred callback handler.
476
- // Bug Tracking: https://bugzilla.mozilla.org/show_bug.cgi?id=1882903
477
- handleMouseMoveDebounce(nodeViewPortalProviderAPI)(
478
- view,
479
- event as MouseEvent,
480
- browser.gecko ? (event as MouseEvent).offsetX : NaN,
481
- );
482
- return false;
483
- };
484
-
485
- export function handleTripleClick(view: EditorView, pos: number) {
486
- const { state, dispatch } = view;
487
- const $cellPos = cellAround(state.doc.resolve(pos));
488
- if (!$cellPos) {
489
- return false;
490
- }
491
-
492
- const cell = state.doc.nodeAt($cellPos.pos);
493
- if (cell) {
494
- const selFrom = Selection.findFrom($cellPos, 1, true);
495
- const selTo = Selection.findFrom(state.doc.resolve($cellPos.pos + cell.nodeSize), -1, true);
496
- if (selFrom && selTo) {
497
- dispatch(state.tr.setSelection(new TextSelection(selFrom.$from, selTo.$to)));
498
- return true;
499
- }
500
- }
501
-
502
- return false;
503
- }
504
- export const handleCut = (
505
- oldTr: Transaction,
506
- oldState: EditorState,
507
- newState: EditorState,
508
- api: PluginInjectionAPI | undefined | null,
509
- editorAnalyticsAPI?: EditorAnalyticsAPI,
510
- editorView?: EditorView,
511
- isTableScalingEnabled = false,
512
- isTableFixedColumnWidthsOptionEnabled = false,
513
- shouldUseIncreasedScalingPercent = false,
514
- ): Transaction => {
515
- const oldSelection = oldState.tr.selection;
516
- let { tr } = newState;
517
- if (oldSelection instanceof CellSelection) {
518
- const $anchorCell = oldTr.doc.resolve(oldTr.mapping.map(oldSelection.$anchorCell.pos));
519
- const $headCell = oldTr.doc.resolve(oldTr.mapping.map(oldSelection.$headCell.pos));
520
-
521
- const cellSelection = new CellSelection($anchorCell, $headCell);
522
- tr.setSelection(cellSelection);
523
-
524
- if (tr.selection instanceof CellSelection) {
525
- const rect = getSelectionRect(cellSelection);
526
- if (rect) {
527
- const { verticalCells, horizontalCells, totalCells, totalRowCount, totalColumnCount } =
528
- getSelectedCellInfo(tr.selection);
529
-
530
- // Reassigning to make it more obvious and consistent
531
- editorAnalyticsAPI?.attachAnalyticsEvent({
532
- action: TABLE_ACTION.CUT,
533
- actionSubject: ACTION_SUBJECT.TABLE,
534
- actionSubjectId: null,
535
- attributes: {
536
- verticalCells,
537
- horizontalCells,
538
- totalCells,
539
- totalRowCount,
540
- totalColumnCount,
541
- },
542
- eventType: EVENT_TYPE.TRACK,
543
- })(tr);
544
-
545
- // Need this check again since we are overriding the tr in previous statement
546
- if (tr.selection instanceof CellSelection) {
547
- const isTableSelected = tr.selection.isRowSelection() && tr.selection.isColSelection();
548
- if (isTableSelected) {
549
- tr = removeTable(tr);
550
- } else if (tr.selection.isRowSelection()) {
551
- const {
552
- pluginConfig: { isHeaderRowRequired },
553
- } = getPluginState(newState);
554
- tr = deleteRows(rect, isHeaderRowRequired)(tr);
555
- } else if (tr.selection.isColSelection()) {
556
- tr = deleteColumns(
557
- rect,
558
- getAllowAddColumnCustomStep(oldState),
559
- api,
560
- editorView,
561
- isTableScalingEnabled,
562
- isTableFixedColumnWidthsOptionEnabled,
563
- shouldUseIncreasedScalingPercent,
564
- )(tr);
565
- }
566
- }
567
- }
568
- }
569
- }
570
-
571
- return tr;
572
- };
573
-
574
- export const isTableInFocus = (view: EditorView) => {
575
- return !!getPluginState(view.state)?.tableNode && !getResizePluginState(view.state)?.dragging;
576
- };
577
-
578
- export const whenTableInFocus =
579
- (
580
- eventHandler: (view: EditorView, mouseEvent: Event) => boolean,
581
- pluginInjectionApi?: PluginInjectionAPI,
582
- ) =>
583
- (view: EditorView, mouseEvent: Event): boolean => {
584
- if (!isTableInFocus(view)) {
585
- return false;
586
- }
587
-
588
- const isViewMode =
589
- pluginInjectionApi?.editorViewMode?.sharedState.currentState()?.mode === 'view';
590
- /**
591
- * Table cannot be in focus if we are in view mode.
592
- * This will prevent an infinite flow of adding and removing
593
- * resize handle decorations in view mode that causes unpredictable
594
- * selections.
595
- */
596
- if (isViewMode) {
597
- return false;
598
- }
599
-
600
- return eventHandler(view, mouseEvent);
601
- };
602
-
603
- const trackCellLocation = (view: EditorView, mouseEvent: Event) => {
604
- const target = mouseEvent.target;
605
- // Ignored via go/ees005
606
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
607
- const maybeTableCell = isElementInTableCell(target as HTMLElement) as HTMLTableCellElement | null;
608
- const { tableNode, tableRef } = getPluginState(view.state);
609
-
610
- // Ignored via go/ees005
611
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
612
- const tableElement = closestElement(target as HTMLElement, 'table') as HTMLTableElement;
613
-
614
- // hover will only trigger if target localId is the same with selected localId
615
- if (
616
- tableElement?.dataset?.tableLocalId &&
617
- tableElement.dataset.tableLocalId !== tableNode?.attrs.localId
618
- ) {
619
- return;
620
- }
621
-
622
- if (!maybeTableCell || !tableRef) {
623
- return;
624
- }
625
-
626
- const htmlColIndex = maybeTableCell.cellIndex;
627
- // Ignored via go/ees005
628
- // eslint-disable-next-line @atlaskit/editor/no-as-casting
629
- const rowElement = closestElement(target as HTMLElement, 'tr') as HTMLTableRowElement;
630
- const htmlRowIndex = rowElement && rowElement.rowIndex;
631
-
632
- const tableMap = tableNode && TableMap.get(tableNode);
633
- let colIndex = htmlColIndex;
634
- if (tableMap) {
635
- const convertedColIndex = convertHTMLCellIndexToColumnIndex(
636
- htmlColIndex,
637
- htmlRowIndex,
638
- tableMap,
639
- );
640
-
641
- colIndex = getColumnIndexMappedToColumnIndexInFirstRow(
642
- convertedColIndex,
643
- htmlRowIndex,
644
- tableMap,
645
- );
646
- }
647
-
648
- hoverCell(htmlRowIndex, colIndex)(view.state, view.dispatch);
649
- };
650
-
651
- export const withCellTracking =
652
- (eventHandler: (view: EditorView, mouseEvent: Event) => boolean) =>
653
- (view: EditorView, mouseEvent: Event): boolean => {
654
- if (
655
- getPluginState(view.state).isDragAndDropEnabled &&
656
- getDragDropPluginState(view.state) &&
657
- !getDragDropPluginState(view.state).isDragging
658
- ) {
659
- trackCellLocation(view, mouseEvent);
660
- }
661
- return eventHandler(view, mouseEvent);
662
- };