@atlaskit/editor-plugin-table 7.16.11 → 7.16.13

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 (254) hide show
  1. package/.eslintrc.js +3 -3
  2. package/CHANGELOG.md +16 -0
  3. package/dist/cjs/commands/misc.js +3 -3
  4. package/dist/cjs/nodeviews/TableCell.js +10 -10
  5. package/dist/cjs/nodeviews/TableContainer.js +83 -27
  6. package/dist/cjs/nodeviews/TableResizer.js +40 -19
  7. package/dist/cjs/nodeviews/TableRow.js +23 -23
  8. package/dist/cjs/pm-plugins/table-resizing/plugin.js +3 -3
  9. package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +4 -4
  10. package/dist/cjs/pm-plugins/table-resizing/utils/scale-table.js +3 -3
  11. package/dist/cjs/ui/FloatingContextualMenu/styles.js +1 -1
  12. package/dist/cjs/ui/FloatingDragMenu/styles.js +1 -1
  13. package/dist/cjs/ui/common-styles.js +13 -13
  14. package/dist/cjs/ui/ui-styles.js +25 -25
  15. package/dist/cjs/utils/guidelines.js +7 -4
  16. package/dist/cjs/utils/merged-cells.js +3 -3
  17. package/dist/cjs/utils/snapping.js +7 -8
  18. package/dist/es2019/commands/misc.js +3 -3
  19. package/dist/es2019/nodeviews/TableContainer.js +70 -9
  20. package/dist/es2019/nodeviews/TableResizer.js +42 -21
  21. package/dist/es2019/nodeviews/TableRow.js +21 -21
  22. package/dist/es2019/pm-plugins/table-resizing/plugin.js +3 -3
  23. package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +4 -4
  24. package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js +3 -3
  25. package/dist/es2019/ui/FloatingContextualMenu/styles.js +47 -47
  26. package/dist/es2019/ui/FloatingDragMenu/styles.js +30 -30
  27. package/dist/es2019/ui/common-styles.js +802 -816
  28. package/dist/es2019/ui/ui-styles.js +665 -678
  29. package/dist/es2019/utils/guidelines.js +5 -2
  30. package/dist/es2019/utils/merged-cells.js +3 -3
  31. package/dist/es2019/utils/snapping.js +5 -6
  32. package/dist/esm/commands/misc.js +3 -3
  33. package/dist/esm/nodeviews/TableCell.js +10 -10
  34. package/dist/esm/nodeviews/TableContainer.js +85 -29
  35. package/dist/esm/nodeviews/TableResizer.js +42 -21
  36. package/dist/esm/nodeviews/TableRow.js +23 -23
  37. package/dist/esm/pm-plugins/table-resizing/plugin.js +3 -3
  38. package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +4 -4
  39. package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js +3 -3
  40. package/dist/esm/ui/FloatingContextualMenu/styles.js +1 -1
  41. package/dist/esm/ui/FloatingDragMenu/styles.js +1 -1
  42. package/dist/esm/ui/common-styles.js +13 -13
  43. package/dist/esm/ui/ui-styles.js +25 -25
  44. package/dist/esm/utils/guidelines.js +6 -3
  45. package/dist/esm/utils/merged-cells.js +3 -3
  46. package/dist/esm/utils/snapping.js +6 -7
  47. package/dist/types/nodeviews/TableResizer.d.ts +2 -1
  48. package/dist/types/pm-plugins/decorations/utils/index.d.ts +1 -1
  49. package/dist/types/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +1 -1
  50. package/dist/types/pm-plugins/drag-and-drop/utils/getDragBehaviour.d.ts +1 -1
  51. package/dist/types/pm-plugins/table-resizing/utils/index.d.ts +1 -1
  52. package/dist/types/ui/ColumnResizeWidget/index.d.ts +1 -1
  53. package/dist/types/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.d.ts +1 -1
  54. package/dist/types/ui/FloatingToolbarLabel/FloatingToolbarLabel.d.ts +1 -1
  55. package/dist/types/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.d.ts +1 -1
  56. package/dist/types/ui/TableFloatingControls/CornerControls/index.d.ts +1 -1
  57. package/dist/types/ui/icons/DragHandleDisabledIcon.d.ts +1 -1
  58. package/dist/types/utils/guidelines.d.ts +2 -1
  59. package/dist/types/utils/snapping.d.ts +3 -2
  60. package/dist/types-ts4.5/nodeviews/TableResizer.d.ts +2 -1
  61. package/dist/types-ts4.5/pm-plugins/decorations/utils/index.d.ts +1 -1
  62. package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +1 -1
  63. package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/getDragBehaviour.d.ts +1 -1
  64. package/dist/types-ts4.5/pm-plugins/table-resizing/utils/index.d.ts +1 -1
  65. package/dist/types-ts4.5/ui/ColumnResizeWidget/index.d.ts +1 -1
  66. package/dist/types-ts4.5/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.d.ts +1 -1
  67. package/dist/types-ts4.5/ui/FloatingToolbarLabel/FloatingToolbarLabel.d.ts +1 -1
  68. package/dist/types-ts4.5/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.d.ts +1 -1
  69. package/dist/types-ts4.5/ui/TableFloatingControls/CornerControls/index.d.ts +1 -1
  70. package/dist/types-ts4.5/ui/icons/DragHandleDisabledIcon.d.ts +1 -1
  71. package/dist/types-ts4.5/utils/guidelines.d.ts +2 -1
  72. package/dist/types-ts4.5/utils/snapping.d.ts +3 -2
  73. package/docs/0-intro.tsx +9 -7
  74. package/package.json +3 -3
  75. package/report.api.md +67 -66
  76. package/src/commands/clear.ts +36 -44
  77. package/src/commands/collapse.ts +8 -8
  78. package/src/commands/column-resize.ts +412 -452
  79. package/src/commands/delete.ts +14 -14
  80. package/src/commands/display-mode.ts +10 -11
  81. package/src/commands/go-to-next-cell.ts +48 -54
  82. package/src/commands/hover.ts +210 -227
  83. package/src/commands/index.ts +35 -35
  84. package/src/commands/insert.ts +208 -235
  85. package/src/commands/misc.ts +655 -748
  86. package/src/commands/referentiality.ts +9 -9
  87. package/src/commands/selection.ts +433 -563
  88. package/src/commands/sort.ts +68 -86
  89. package/src/commands/split-cell.ts +14 -14
  90. package/src/commands/toggle.ts +69 -67
  91. package/src/commands-with-analytics.ts +570 -639
  92. package/src/create-plugin-config.ts +13 -13
  93. package/src/event-handlers.ts +513 -612
  94. package/src/handlers.ts +120 -133
  95. package/src/nodeviews/ExternalDropTargets.tsx +68 -73
  96. package/src/nodeviews/OverflowShadowsObserver.ts +148 -157
  97. package/src/nodeviews/TableCell.ts +47 -54
  98. package/src/nodeviews/TableComponent.tsx +1018 -1112
  99. package/src/nodeviews/TableComponentWithSharedState.tsx +91 -94
  100. package/src/nodeviews/TableContainer.tsx +384 -340
  101. package/src/nodeviews/TableNodeViewBase.ts +19 -24
  102. package/src/nodeviews/TableResizer.tsx +642 -653
  103. package/src/nodeviews/TableRow.ts +580 -629
  104. package/src/nodeviews/TableStickyScrollbar.ts +173 -190
  105. package/src/nodeviews/__mocks__/OverflowShadowsObserver.ts +8 -8
  106. package/src/nodeviews/__mocks__/OverridableMock.ts +14 -15
  107. package/src/nodeviews/table.tsx +345 -375
  108. package/src/nodeviews/types.ts +21 -24
  109. package/src/nodeviews/update-overflow-shadows.ts +8 -14
  110. package/src/plugin.tsx +578 -603
  111. package/src/pm-plugins/analytics/actions.ts +10 -12
  112. package/src/pm-plugins/analytics/commands.ts +31 -37
  113. package/src/pm-plugins/analytics/plugin-factory.ts +4 -2
  114. package/src/pm-plugins/analytics/plugin-key.ts +1 -3
  115. package/src/pm-plugins/analytics/plugin.ts +60 -70
  116. package/src/pm-plugins/analytics/reducer.ts +19 -19
  117. package/src/pm-plugins/analytics/types.ts +10 -10
  118. package/src/pm-plugins/analytics/utils/moved-event.ts +38 -38
  119. package/src/pm-plugins/decorations/plugin.ts +58 -77
  120. package/src/pm-plugins/decorations/utils/column-controls.ts +59 -71
  121. package/src/pm-plugins/decorations/utils/column-resizing.ts +50 -57
  122. package/src/pm-plugins/decorations/utils/compose-decorations.ts +6 -6
  123. package/src/pm-plugins/decorations/utils/index.ts +3 -6
  124. package/src/pm-plugins/decorations/utils/types.ts +7 -12
  125. package/src/pm-plugins/default-table-selection.ts +3 -3
  126. package/src/pm-plugins/drag-and-drop/actions.ts +25 -25
  127. package/src/pm-plugins/drag-and-drop/commands-with-analytics.ts +158 -190
  128. package/src/pm-plugins/drag-and-drop/commands.ts +154 -170
  129. package/src/pm-plugins/drag-and-drop/consts.ts +4 -5
  130. package/src/pm-plugins/drag-and-drop/plugin-factory.ts +23 -20
  131. package/src/pm-plugins/drag-and-drop/plugin-key.ts +1 -3
  132. package/src/pm-plugins/drag-and-drop/plugin.ts +329 -383
  133. package/src/pm-plugins/drag-and-drop/reducer.ts +30 -30
  134. package/src/pm-plugins/drag-and-drop/types.ts +8 -8
  135. package/src/pm-plugins/drag-and-drop/utils/autoscrollers.ts +38 -41
  136. package/src/pm-plugins/drag-and-drop/utils/getDragBehaviour.ts +3 -6
  137. package/src/pm-plugins/drag-and-drop/utils/monitor.ts +57 -70
  138. package/src/pm-plugins/keymap.ts +208 -220
  139. package/src/pm-plugins/main.ts +348 -400
  140. package/src/pm-plugins/plugin-factory.ts +32 -34
  141. package/src/pm-plugins/safari-delete-composition-text-issue-workaround.ts +83 -97
  142. package/src/pm-plugins/sticky-headers/commands.ts +2 -6
  143. package/src/pm-plugins/sticky-headers/plugin-key.ts +1 -3
  144. package/src/pm-plugins/sticky-headers/plugin-state.ts +41 -44
  145. package/src/pm-plugins/sticky-headers/plugin.ts +4 -4
  146. package/src/pm-plugins/sticky-headers/types.ts +8 -8
  147. package/src/pm-plugins/sticky-headers/util.ts +10 -10
  148. package/src/pm-plugins/table-analytics.ts +70 -72
  149. package/src/pm-plugins/table-local-id.ts +180 -184
  150. package/src/pm-plugins/table-resizing/commands.ts +72 -85
  151. package/src/pm-plugins/table-resizing/event-handlers.ts +298 -317
  152. package/src/pm-plugins/table-resizing/plugin-factory.ts +10 -10
  153. package/src/pm-plugins/table-resizing/plugin-key.ts +1 -3
  154. package/src/pm-plugins/table-resizing/plugin.ts +61 -68
  155. package/src/pm-plugins/table-resizing/reducer.ts +30 -33
  156. package/src/pm-plugins/table-resizing/utils/colgroup.ts +84 -84
  157. package/src/pm-plugins/table-resizing/utils/column-state.ts +78 -81
  158. package/src/pm-plugins/table-resizing/utils/content-width.ts +94 -114
  159. package/src/pm-plugins/table-resizing/utils/dom.ts +93 -110
  160. package/src/pm-plugins/table-resizing/utils/index.ts +29 -34
  161. package/src/pm-plugins/table-resizing/utils/misc.ts +94 -119
  162. package/src/pm-plugins/table-resizing/utils/resize-column.ts +93 -106
  163. package/src/pm-plugins/table-resizing/utils/resize-logic.ts +240 -257
  164. package/src/pm-plugins/table-resizing/utils/resize-state.ts +343 -372
  165. package/src/pm-plugins/table-resizing/utils/scale-table.ts +202 -207
  166. package/src/pm-plugins/table-resizing/utils/types.ts +17 -17
  167. package/src/pm-plugins/table-resizing/utils/unit-to-number.ts +1 -2
  168. package/src/pm-plugins/table-selection-keymap.ts +25 -51
  169. package/src/pm-plugins/table-width.ts +191 -204
  170. package/src/pm-plugins/view-mode-sort/index.ts +223 -227
  171. package/src/pm-plugins/view-mode-sort/plugin-key.ts +3 -2
  172. package/src/pm-plugins/view-mode-sort/types.ts +12 -12
  173. package/src/pm-plugins/view-mode-sort/utils.ts +108 -117
  174. package/src/reducer.ts +139 -155
  175. package/src/toolbar.tsx +815 -905
  176. package/src/transforms/column-width.ts +186 -213
  177. package/src/transforms/delete-columns.ts +208 -222
  178. package/src/transforms/delete-rows.ts +117 -121
  179. package/src/transforms/fix-tables.ts +190 -215
  180. package/src/transforms/merge.ts +263 -269
  181. package/src/transforms/replace-table.ts +27 -43
  182. package/src/transforms/split.ts +65 -75
  183. package/src/types.ts +421 -427
  184. package/src/ui/ColumnResizeWidget/index.tsx +40 -47
  185. package/src/ui/DragHandle/HandleIconComponent.tsx +9 -13
  186. package/src/ui/DragHandle/index.tsx +221 -250
  187. package/src/ui/DragPreview/index.tsx +35 -35
  188. package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx +33 -41
  189. package/src/ui/FloatingContextualButton/FixedButton.tsx +154 -157
  190. package/src/ui/FloatingContextualButton/index.tsx +109 -115
  191. package/src/ui/FloatingContextualButton/styles.ts +43 -46
  192. package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +634 -694
  193. package/src/ui/FloatingContextualMenu/index.tsx +83 -101
  194. package/src/ui/FloatingContextualMenu/styles.ts +57 -65
  195. package/src/ui/FloatingDeleteButton/DeleteButton.tsx +37 -37
  196. package/src/ui/FloatingDeleteButton/getPopUpOptions.ts +47 -57
  197. package/src/ui/FloatingDeleteButton/index.tsx +319 -350
  198. package/src/ui/FloatingDragMenu/DragMenu.tsx +555 -596
  199. package/src/ui/FloatingDragMenu/DropdownMenu.tsx +152 -162
  200. package/src/ui/FloatingDragMenu/index.tsx +88 -102
  201. package/src/ui/FloatingDragMenu/styles.ts +51 -54
  202. package/src/ui/FloatingInsertButton/InsertButton.tsx +204 -217
  203. package/src/ui/FloatingInsertButton/getPopupOptions.ts +100 -115
  204. package/src/ui/FloatingInsertButton/index.tsx +248 -292
  205. package/src/ui/FloatingToolbarLabel/FloatingToolbarLabel.tsx +24 -29
  206. package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +308 -329
  207. package/src/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.tsx +85 -94
  208. package/src/ui/TableFloatingColumnControls/ColumnDropTargets/index.tsx +46 -46
  209. package/src/ui/TableFloatingColumnControls/index.tsx +116 -136
  210. package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +79 -91
  211. package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +95 -102
  212. package/src/ui/TableFloatingControls/CornerControls/index.tsx +1 -4
  213. package/src/ui/TableFloatingControls/CornerControls/types.ts +8 -8
  214. package/src/ui/TableFloatingControls/FloatingControlsWithSelection.tsx +50 -50
  215. package/src/ui/TableFloatingControls/NumberColumn/index.tsx +111 -124
  216. package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +86 -105
  217. package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +305 -341
  218. package/src/ui/TableFloatingControls/RowDropTarget/index.tsx +72 -75
  219. package/src/ui/TableFloatingControls/index.tsx +191 -193
  220. package/src/ui/TableFullWidthLabel/index.tsx +20 -20
  221. package/src/ui/common-styles.ts +880 -912
  222. package/src/ui/consts.ts +29 -74
  223. package/src/ui/icons/AddColLeftIcon.tsx +33 -39
  224. package/src/ui/icons/AddColRightIcon.tsx +33 -39
  225. package/src/ui/icons/AddRowAboveIcon.tsx +16 -22
  226. package/src/ui/icons/AddRowBelowIcon.tsx +33 -39
  227. package/src/ui/icons/DisplayModeIcon.tsx +31 -31
  228. package/src/ui/icons/DragHandleDisabledIcon.tsx +19 -21
  229. package/src/ui/icons/DragHandleIcon.tsx +12 -12
  230. package/src/ui/icons/DragInMotionIcon.tsx +45 -52
  231. package/src/ui/icons/MergeCellsIcon.tsx +22 -28
  232. package/src/ui/icons/MinimisedHandle.tsx +9 -9
  233. package/src/ui/icons/SplitCellIcon.tsx +30 -36
  234. package/src/ui/ui-styles.ts +769 -798
  235. package/src/utils/alignment.ts +1 -1
  236. package/src/utils/analytics.ts +192 -208
  237. package/src/utils/collapse.ts +55 -64
  238. package/src/utils/column-controls.ts +237 -254
  239. package/src/utils/create.ts +30 -30
  240. package/src/utils/decoration.ts +482 -502
  241. package/src/utils/dom.ts +127 -134
  242. package/src/utils/drag-menu.ts +322 -373
  243. package/src/utils/get-allow-add-column-custom-step.ts +4 -5
  244. package/src/utils/guidelines.ts +16 -21
  245. package/src/utils/index.ts +68 -68
  246. package/src/utils/merged-cells.ts +245 -254
  247. package/src/utils/nodes.ts +91 -106
  248. package/src/utils/paste.ts +119 -135
  249. package/src/utils/row-controls.ts +199 -213
  250. package/src/utils/selection.ts +77 -87
  251. package/src/utils/snapping.ts +87 -100
  252. package/src/utils/table.ts +44 -44
  253. package/src/utils/transforms.ts +5 -5
  254. package/src/utils/update-plugin-state-decorations.ts +5 -9
@@ -2,489 +2,449 @@ import type { IntlShape } from 'react-intl-next/src/types';
2
2
 
3
3
  import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
4
  import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
5
- import type {
6
- Command,
7
- GetEditorContainerWidth,
8
- } from '@atlaskit/editor-common/types';
5
+ import type { Command, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
9
6
  import type { AriaLiveElementAttributes } from '@atlaskit/editor-plugin-accessibility-utils';
10
7
  import type { Transaction } from '@atlaskit/editor-prosemirror/state';
11
8
  import { TableMap } from '@atlaskit/editor-tables';
12
9
  import type { CellAttributes, Direction } from '@atlaskit/editor-tables/types';
13
10
  import {
14
- findCellClosestToPos,
15
- findCellRectClosestToPos,
16
- findTableClosestToPos,
17
- getSelectionRect,
18
- isSelectionType,
19
- nextCell,
11
+ findCellClosestToPos,
12
+ findCellRectClosestToPos,
13
+ findTableClosestToPos,
14
+ getSelectionRect,
15
+ isSelectionType,
16
+ nextCell,
20
17
  } from '@atlaskit/editor-tables/utils';
21
18
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
22
19
 
23
20
  import { getDecorations } from '../pm-plugins/decorations/plugin';
24
21
  import {
25
- buildColumnResizingDecorations,
26
- clearColumnResizingDecorations,
22
+ buildColumnResizingDecorations,
23
+ clearColumnResizingDecorations,
27
24
  } from '../pm-plugins/decorations/utils';
28
25
  import { createCommand, getPluginState } from '../pm-plugins/plugin-factory';
29
26
  import {
30
- getPluginState as getTableResizingPluginState,
31
- createCommand as tableResizingPluginCreateCommand,
27
+ getPluginState as getTableResizingPluginState,
28
+ createCommand as tableResizingPluginCreateCommand,
32
29
  } from '../pm-plugins/table-resizing/plugin-factory';
33
30
  import { pluginKey as tableResizingPK } from '../pm-plugins/table-resizing/plugin-key';
34
31
  import {
35
- currentColWidth,
36
- getResizeState,
37
- getTableMaxWidth,
38
- resizeColumn,
39
- updateControls,
32
+ currentColWidth,
33
+ getResizeState,
34
+ getTableMaxWidth,
35
+ resizeColumn,
36
+ updateControls,
40
37
  } from '../pm-plugins/table-resizing/utils';
41
38
  import { updateColumnWidths } from '../transforms';
42
39
  import { TableDecorations } from '../types';
43
40
  import type { TablePluginAction } from '../types';
44
- import {
45
- createColumnLineResize,
46
- getSelectedColumnIndexes,
47
- updateDecorations,
48
- } from '../utils';
41
+ import { createColumnLineResize, getSelectedColumnIndexes, updateDecorations } from '../utils';
49
42
 
50
43
  const getTablePluginCommand = (
51
- actionPayload: TablePluginAction,
52
- originalTr?: Transaction,
44
+ actionPayload: TablePluginAction,
45
+ originalTr?: Transaction,
53
46
  ): Command => {
54
- return createCommand(
55
- () => actionPayload,
56
- (tr) => (originalTr || tr).setMeta('addToHistory', false),
57
- );
47
+ return createCommand(
48
+ () => actionPayload,
49
+ (tr) => (originalTr || tr).setMeta('addToHistory', false),
50
+ );
58
51
  };
59
52
 
60
53
  const updateResizeHandleAndStatePosition =
61
- (
62
- rowIndex: number,
63
- columnIndex: number,
64
- nextResizeHandlePos: number,
65
- ): Command =>
66
- (state, dispatch) => {
67
- let customTr = state.tr;
68
- const {
69
- pluginConfig: { allowColumnResizing },
70
- getIntl,
71
- } = getPluginState(state);
72
-
73
- const fakeDispatch = (tr: Transaction) => {
74
- customTr = tr;
75
- };
76
-
77
- if (!allowColumnResizing) {
78
- return false;
79
- }
80
-
81
- const decorationsWithWidget = buildColumnResizingDecorations(
82
- rowIndex,
83
- columnIndex,
84
- true,
85
- getIntl,
86
- )({
87
- tr: customTr,
88
- decorationSet: getDecorations(state),
89
- });
90
-
91
- const decorationsWithWidgetAndHandle = updateDecorations(
92
- customTr.doc,
93
- decorationsWithWidget,
94
- createColumnLineResize(state.selection, {
95
- right: columnIndex,
96
- }),
97
- TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
98
- );
99
-
100
- getTablePluginCommand(
101
- {
102
- type: 'START_KEYBOARD_COLUMN_RESIZE',
103
- data: {
104
- resizeHandleRowIndex: rowIndex,
105
- resizeHandleColumnIndex: columnIndex,
106
- resizeHandleIncludeTooltip: true,
107
- isKeyboardResize: true,
108
- decorationSet: decorationsWithWidgetAndHandle,
109
- },
110
- },
111
- customTr,
112
- )(state, fakeDispatch);
113
-
114
- customTr.setMeta(tableResizingPK, {
115
- type: 'SET_RESIZE_HANDLE_POSITION',
116
- data: {
117
- resizeHandlePos: nextResizeHandlePos,
118
- },
119
- });
120
-
121
- if (dispatch) {
122
- dispatch(customTr);
123
- return true;
124
- }
125
- return false;
126
- };
54
+ (rowIndex: number, columnIndex: number, nextResizeHandlePos: number): Command =>
55
+ (state, dispatch) => {
56
+ let customTr = state.tr;
57
+ const {
58
+ pluginConfig: { allowColumnResizing },
59
+ getIntl,
60
+ } = getPluginState(state);
61
+
62
+ const fakeDispatch = (tr: Transaction) => {
63
+ customTr = tr;
64
+ };
65
+
66
+ if (!allowColumnResizing) {
67
+ return false;
68
+ }
69
+
70
+ const decorationsWithWidget = buildColumnResizingDecorations(
71
+ rowIndex,
72
+ columnIndex,
73
+ true,
74
+ getIntl,
75
+ )({
76
+ tr: customTr,
77
+ decorationSet: getDecorations(state),
78
+ });
79
+
80
+ const decorationsWithWidgetAndHandle = updateDecorations(
81
+ customTr.doc,
82
+ decorationsWithWidget,
83
+ createColumnLineResize(state.selection, {
84
+ right: columnIndex,
85
+ }),
86
+ TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
87
+ );
88
+
89
+ getTablePluginCommand(
90
+ {
91
+ type: 'START_KEYBOARD_COLUMN_RESIZE',
92
+ data: {
93
+ resizeHandleRowIndex: rowIndex,
94
+ resizeHandleColumnIndex: columnIndex,
95
+ resizeHandleIncludeTooltip: true,
96
+ isKeyboardResize: true,
97
+ decorationSet: decorationsWithWidgetAndHandle,
98
+ },
99
+ },
100
+ customTr,
101
+ )(state, fakeDispatch);
102
+
103
+ customTr.setMeta(tableResizingPK, {
104
+ type: 'SET_RESIZE_HANDLE_POSITION',
105
+ data: {
106
+ resizeHandlePos: nextResizeHandlePos,
107
+ },
108
+ });
109
+
110
+ if (dispatch) {
111
+ dispatch(customTr);
112
+ return true;
113
+ }
114
+ return false;
115
+ };
127
116
 
128
117
  export const initiateKeyboardColumnResizing =
129
- ({
130
- ariaNotify,
131
- getIntl,
132
- }: {
133
- ariaNotify?: (
134
- message: string,
135
- ariaLiveElementAttributes?: AriaLiveElementAttributes,
136
- ) => void;
137
- getIntl?: () => IntlShape;
138
- }): Command =>
139
- (state, dispatch, view) => {
140
- if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
141
- return false;
142
- }
143
-
144
- const { selection } = state;
145
- const selectionRect = isSelectionType(selection, 'cell')
146
- ? getSelectionRect(selection)!
147
- : findCellRectClosestToPos(selection.$from);
148
- const cell = findCellClosestToPos(selection.$from);
149
-
150
- if (ariaNotify && getIntl) {
151
- ariaNotify(getIntl().formatMessage(messages.startedColumnResize), {
152
- priority: 'important',
153
- });
154
- }
155
-
156
- if (selectionRect && cell && view) {
157
- return updateResizeHandleAndStatePosition(
158
- selectionRect.top,
159
- selectionRect.right,
160
- cell.pos,
161
- )(state, dispatch);
162
- }
163
- return false;
164
- };
118
+ ({
119
+ ariaNotify,
120
+ getIntl,
121
+ }: {
122
+ ariaNotify?: (message: string, ariaLiveElementAttributes?: AriaLiveElementAttributes) => void;
123
+ getIntl?: () => IntlShape;
124
+ }): Command =>
125
+ (state, dispatch, view) => {
126
+ if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
127
+ return false;
128
+ }
129
+
130
+ const { selection } = state;
131
+ const selectionRect = isSelectionType(selection, 'cell')
132
+ ? getSelectionRect(selection)!
133
+ : findCellRectClosestToPos(selection.$from);
134
+ const cell = findCellClosestToPos(selection.$from);
135
+
136
+ if (ariaNotify && getIntl) {
137
+ ariaNotify(getIntl().formatMessage(messages.startedColumnResize), {
138
+ priority: 'important',
139
+ });
140
+ }
141
+
142
+ if (selectionRect && cell && view) {
143
+ return updateResizeHandleAndStatePosition(
144
+ selectionRect.top,
145
+ selectionRect.right,
146
+ cell.pos,
147
+ )(state, dispatch);
148
+ }
149
+ return false;
150
+ };
165
151
 
166
152
  export const activateNextResizeArea =
167
- ({
168
- direction,
169
- ariaNotify,
170
- getIntl,
171
- }: {
172
- direction: Direction;
173
- ariaNotify?: (
174
- message: string,
175
- ariaLiveElementAttributes?: AriaLiveElementAttributes,
176
- ) => void;
177
- getIntl?: () => IntlShape;
178
- }): Command =>
179
- (state, dispatch, view) => {
180
- if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
181
- return false;
182
- }
183
-
184
- const { resizeHandlePos } = getTableResizingPluginState(state) || {};
185
- // If No resizing has initiated, skip to regular handler
186
- if (!resizeHandlePos) {
187
- return false;
188
- }
189
-
190
- const { selection } = state;
191
- const cell = findCellClosestToPos(selection.$from);
192
- if (!cell) {
193
- // cursor position may be changed by mouse to be outside of table;
194
- return false;
195
- }
196
-
197
- const $currentCell = state.doc.resolve(resizeHandlePos);
198
- if (!$currentCell) {
199
- return false;
200
- }
201
-
202
- const tableNode = $currentCell.node(-1);
203
- const closestTable = findTableClosestToPos($currentCell);
204
- const tableMap = TableMap.get(tableNode);
205
-
206
- if (!tableNode || !closestTable || !tableMap) {
207
- return false;
208
- }
209
-
210
- const currentCellRect = tableMap.findCell(
211
- $currentCell.pos - $currentCell.start(-1),
212
- );
213
-
214
- const $nextCell = nextCell($currentCell, 'horiz', direction);
215
-
216
- if (ariaNotify && getIntl) {
217
- if (direction === 1) {
218
- ariaNotify(
219
- getIntl().formatMessage(messages.focusedOtherResize, {
220
- direction: 'right',
221
- }),
222
- { priority: 'important' },
223
- );
224
- }
225
-
226
- if (direction === -1) {
227
- ariaNotify(
228
- getIntl().formatMessage(messages.focusedOtherResize, {
229
- direction: 'left',
230
- }),
231
- { priority: 'important' },
232
- );
233
- }
234
- }
235
-
236
- if ($nextCell) {
237
- // we are somewhere in between the side columns of the table
238
- const offset = $nextCell.pos - $nextCell.start(-1);
239
- const rectForNextCell = tableMap.findCell(offset);
240
- return updateResizeHandleAndStatePosition(
241
- rectForNextCell.top,
242
- rectForNextCell.right,
243
- $nextCell.pos,
244
- )(state, dispatch, view);
245
- } else {
246
- // current position is in the one of the side columns of the table(left or right)
247
- if (currentCellRect.left === 0) {
248
- const lastCellInCurrentRow =
249
- tableMap.positionAt(
250
- currentCellRect.top,
251
- tableMap.width - 1,
252
- tableNode,
253
- ) + closestTable.start;
254
- const $lastCell = state.doc.resolve(lastCellInCurrentRow);
255
-
256
- return updateResizeHandleAndStatePosition(
257
- currentCellRect.top,
258
- tableMap.width,
259
- $lastCell.pos,
260
- )(state, dispatch, view);
261
- } else if (tableMap.width === currentCellRect.right) {
262
- const firsCellInCurrentRow =
263
- tableMap.positionAt(currentCellRect.top, 0, tableNode) +
264
- closestTable.start;
265
- const $nextCell = state.doc.resolve(firsCellInCurrentRow);
266
-
267
- return updateResizeHandleAndStatePosition(
268
- currentCellRect.top,
269
- 1,
270
- $nextCell.pos,
271
- )(state, dispatch);
272
- }
273
- }
274
-
275
- return false;
276
- };
153
+ ({
154
+ direction,
155
+ ariaNotify,
156
+ getIntl,
157
+ }: {
158
+ direction: Direction;
159
+ ariaNotify?: (message: string, ariaLiveElementAttributes?: AriaLiveElementAttributes) => void;
160
+ getIntl?: () => IntlShape;
161
+ }): Command =>
162
+ (state, dispatch, view) => {
163
+ if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
164
+ return false;
165
+ }
166
+
167
+ const { resizeHandlePos } = getTableResizingPluginState(state) || {};
168
+ // If No resizing has initiated, skip to regular handler
169
+ if (!resizeHandlePos) {
170
+ return false;
171
+ }
172
+
173
+ const { selection } = state;
174
+ const cell = findCellClosestToPos(selection.$from);
175
+ if (!cell) {
176
+ // cursor position may be changed by mouse to be outside of table;
177
+ return false;
178
+ }
179
+
180
+ const $currentCell = state.doc.resolve(resizeHandlePos);
181
+ if (!$currentCell) {
182
+ return false;
183
+ }
184
+
185
+ const tableNode = $currentCell.node(-1);
186
+ const closestTable = findTableClosestToPos($currentCell);
187
+ const tableMap = TableMap.get(tableNode);
188
+
189
+ if (!tableNode || !closestTable || !tableMap) {
190
+ return false;
191
+ }
192
+
193
+ const currentCellRect = tableMap.findCell($currentCell.pos - $currentCell.start(-1));
194
+
195
+ const $nextCell = nextCell($currentCell, 'horiz', direction);
196
+
197
+ if (ariaNotify && getIntl) {
198
+ if (direction === 1) {
199
+ ariaNotify(
200
+ getIntl().formatMessage(messages.focusedOtherResize, {
201
+ direction: 'right',
202
+ }),
203
+ { priority: 'important' },
204
+ );
205
+ }
206
+
207
+ if (direction === -1) {
208
+ ariaNotify(
209
+ getIntl().formatMessage(messages.focusedOtherResize, {
210
+ direction: 'left',
211
+ }),
212
+ { priority: 'important' },
213
+ );
214
+ }
215
+ }
216
+
217
+ if ($nextCell) {
218
+ // we are somewhere in between the side columns of the table
219
+ const offset = $nextCell.pos - $nextCell.start(-1);
220
+ const rectForNextCell = tableMap.findCell(offset);
221
+ return updateResizeHandleAndStatePosition(
222
+ rectForNextCell.top,
223
+ rectForNextCell.right,
224
+ $nextCell.pos,
225
+ )(state, dispatch, view);
226
+ } else {
227
+ // current position is in the one of the side columns of the table(left or right)
228
+ if (currentCellRect.left === 0) {
229
+ const lastCellInCurrentRow =
230
+ tableMap.positionAt(currentCellRect.top, tableMap.width - 1, tableNode) +
231
+ closestTable.start;
232
+ const $lastCell = state.doc.resolve(lastCellInCurrentRow);
233
+
234
+ return updateResizeHandleAndStatePosition(
235
+ currentCellRect.top,
236
+ tableMap.width,
237
+ $lastCell.pos,
238
+ )(state, dispatch, view);
239
+ } else if (tableMap.width === currentCellRect.right) {
240
+ const firsCellInCurrentRow =
241
+ tableMap.positionAt(currentCellRect.top, 0, tableNode) + closestTable.start;
242
+ const $nextCell = state.doc.resolve(firsCellInCurrentRow);
243
+
244
+ return updateResizeHandleAndStatePosition(
245
+ currentCellRect.top,
246
+ 1,
247
+ $nextCell.pos,
248
+ )(state, dispatch);
249
+ }
250
+ }
251
+
252
+ return false;
253
+ };
277
254
 
278
255
  export const changeColumnWidthByStep =
279
- ({
280
- stepSize,
281
- getEditorContainerWidth,
282
- isTableScalingEnabled,
283
- ariaNotify,
284
- getIntl,
285
- }: {
286
- stepSize: number;
287
- getEditorContainerWidth: GetEditorContainerWidth;
288
- isTableScalingEnabled: boolean;
289
- ariaNotify?: (
290
- message: string,
291
- ariaLiveElementAttributes?: AriaLiveElementAttributes,
292
- ) => void;
293
- getIntl?: () => IntlShape;
294
- originalTr?: Transaction;
295
- }): Command =>
296
- (state, dispatch, view) => {
297
- let customTr = state.tr;
298
- const fakeDispatch = (tr: Transaction) => {
299
- customTr = tr;
300
- };
301
- if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
302
- return false;
303
- }
304
- const { resizeHandlePos } = getTableResizingPluginState(state);
305
- const cell = findCellClosestToPos(state.selection.$from);
306
- if (!view || !resizeHandlePos || !cell) {
307
- return false;
308
- }
309
-
310
- const $cell = state.doc.resolve(resizeHandlePos);
311
-
312
- const tableStartPosition = $cell.start(-1);
313
- const originalTable = $cell.node(-1);
314
- const map = TableMap.get(originalTable);
315
- const domAtPos = view.domAtPos.bind(view);
316
-
317
- const colIndex =
318
- map.colCount($cell.pos - tableStartPosition) +
319
- ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) -
320
- 1;
321
-
322
- let dom: HTMLTableElement | null = null;
323
- if (getBooleanFF('platform.editor.explicit-html-element-check')) {
324
- const domAtPosition = domAtPos(tableStartPosition);
325
- dom =
326
- domAtPosition.node instanceof HTMLTableElement
327
- ? domAtPosition.node
328
- : null;
329
- } else {
330
- dom = domAtPos(tableStartPosition).node as HTMLTableElement;
331
- }
332
-
333
- if (dom && dom.nodeName !== 'TABLE') {
334
- dom = dom.closest('table');
335
- }
336
-
337
- const cellAttrs = cell?.node.attrs;
338
- const width = currentColWidth(view, cell?.pos, cellAttrs as CellAttributes);
339
- tableResizingPluginCreateCommand({
340
- type: 'SET_DRAGGING',
341
- data: {
342
- dragging: {
343
- startX: 0,
344
- startWidth: width,
345
- },
346
- },
347
- })(state, fakeDispatch);
348
-
349
- const maxSize = getTableMaxWidth({
350
- table: originalTable,
351
- tableStart: tableStartPosition,
352
- state,
353
- layout: originalTable.attrs.layout,
354
- getEditorContainerWidth,
355
- });
356
-
357
- let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
358
- if (
359
- isTableScalingEnabled &&
360
- getBooleanFF('platform.editor.table.preserve-widths-with-lock-button')
361
- ) {
362
- isTableScalingEnabledOnCurrentTable =
363
- originalTable.attrs.displayMode !== 'fixed';
364
- }
365
-
366
- const initialResizeState = getResizeState({
367
- minWidth: tableCellMinWidth,
368
- maxSize,
369
- table: originalTable,
370
- tableRef: dom,
371
- start: tableStartPosition,
372
- domAtPos,
373
- isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
374
- });
375
-
376
- updateControls()(state);
377
-
378
- const selectionRect = getSelectionRect(state.selection);
379
- const selectedColumns = selectionRect
380
- ? getSelectedColumnIndexes(selectionRect)
381
- : [];
382
- // only selected (or selected - 1) columns should be distributed
383
- const resizingSelectedColumns =
384
- selectedColumns.indexOf(colIndex) > -1 ||
385
- selectedColumns.indexOf(colIndex + 1) > -1;
386
- let newResizeState = resizeColumn(
387
- initialResizeState,
388
- colIndex,
389
- stepSize,
390
- dom,
391
- originalTable,
392
- resizingSelectedColumns ? selectedColumns : undefined,
393
- isTableScalingEnabled,
394
- );
395
-
396
- customTr = updateColumnWidths(
397
- newResizeState,
398
- originalTable,
399
- tableStartPosition,
400
- )(customTr);
401
-
402
- if (dispatch) {
403
- dispatch(customTr);
404
- }
405
-
406
- if (ariaNotify && getIntl) {
407
- ariaNotify(
408
- getIntl().formatMessage(messages.changedColumnWidth, {
409
- width: Math.floor(newResizeState.cols[colIndex].width),
410
- }),
411
- );
412
-
413
- if (newResizeState.cols.length === colIndex + 1) {
414
- if (newResizeState.overflow === true) {
415
- ariaNotify(getIntl().formatMessage(messages.columnResizeLast), {
416
- priority: 'important',
417
- });
418
- }
419
- if (newResizeState.overflow === false) {
420
- ariaNotify(getIntl().formatMessage(messages.columnResizeOverflow), {
421
- priority: 'important',
422
- });
423
- }
424
- }
425
- }
426
-
427
- return true;
428
- };
256
+ ({
257
+ stepSize,
258
+ getEditorContainerWidth,
259
+ isTableScalingEnabled,
260
+ ariaNotify,
261
+ getIntl,
262
+ }: {
263
+ stepSize: number;
264
+ getEditorContainerWidth: GetEditorContainerWidth;
265
+ isTableScalingEnabled: boolean;
266
+ ariaNotify?: (message: string, ariaLiveElementAttributes?: AriaLiveElementAttributes) => void;
267
+ getIntl?: () => IntlShape;
268
+ originalTr?: Transaction;
269
+ }): Command =>
270
+ (state, dispatch, view) => {
271
+ let customTr = state.tr;
272
+ const fakeDispatch = (tr: Transaction) => {
273
+ customTr = tr;
274
+ };
275
+ if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
276
+ return false;
277
+ }
278
+ const { resizeHandlePos } = getTableResizingPluginState(state);
279
+ const cell = findCellClosestToPos(state.selection.$from);
280
+ if (!view || !resizeHandlePos || !cell) {
281
+ return false;
282
+ }
283
+
284
+ const $cell = state.doc.resolve(resizeHandlePos);
285
+
286
+ const tableStartPosition = $cell.start(-1);
287
+ const originalTable = $cell.node(-1);
288
+ const map = TableMap.get(originalTable);
289
+ const domAtPos = view.domAtPos.bind(view);
290
+
291
+ const colIndex =
292
+ map.colCount($cell.pos - tableStartPosition) +
293
+ ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) -
294
+ 1;
295
+
296
+ let dom: HTMLTableElement | null = null;
297
+ if (getBooleanFF('platform.editor.explicit-html-element-check')) {
298
+ const domAtPosition = domAtPos(tableStartPosition);
299
+ dom = domAtPosition.node instanceof HTMLTableElement ? domAtPosition.node : null;
300
+ } else {
301
+ dom = domAtPos(tableStartPosition).node as HTMLTableElement;
302
+ }
303
+
304
+ if (dom && dom.nodeName !== 'TABLE') {
305
+ dom = dom.closest('table');
306
+ }
307
+
308
+ const cellAttrs = cell?.node.attrs;
309
+ const width = currentColWidth(view, cell?.pos, cellAttrs as CellAttributes);
310
+ tableResizingPluginCreateCommand({
311
+ type: 'SET_DRAGGING',
312
+ data: {
313
+ dragging: {
314
+ startX: 0,
315
+ startWidth: width,
316
+ },
317
+ },
318
+ })(state, fakeDispatch);
319
+
320
+ const maxSize = getTableMaxWidth({
321
+ table: originalTable,
322
+ tableStart: tableStartPosition,
323
+ state,
324
+ layout: originalTable.attrs.layout,
325
+ getEditorContainerWidth,
326
+ });
327
+
328
+ let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
329
+ if (
330
+ isTableScalingEnabled &&
331
+ getBooleanFF('platform.editor.table.preserve-widths-with-lock-button')
332
+ ) {
333
+ isTableScalingEnabledOnCurrentTable = originalTable.attrs.displayMode !== 'fixed';
334
+ }
335
+
336
+ const initialResizeState = getResizeState({
337
+ minWidth: tableCellMinWidth,
338
+ maxSize,
339
+ table: originalTable,
340
+ tableRef: dom,
341
+ start: tableStartPosition,
342
+ domAtPos,
343
+ isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
344
+ });
345
+
346
+ updateControls()(state);
347
+
348
+ const selectionRect = getSelectionRect(state.selection);
349
+ const selectedColumns = selectionRect ? getSelectedColumnIndexes(selectionRect) : [];
350
+ // only selected (or selected - 1) columns should be distributed
351
+ const resizingSelectedColumns =
352
+ selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
353
+ let newResizeState = resizeColumn(
354
+ initialResizeState,
355
+ colIndex,
356
+ stepSize,
357
+ dom,
358
+ originalTable,
359
+ resizingSelectedColumns ? selectedColumns : undefined,
360
+ isTableScalingEnabled,
361
+ );
362
+
363
+ customTr = updateColumnWidths(newResizeState, originalTable, tableStartPosition)(customTr);
364
+
365
+ if (dispatch) {
366
+ dispatch(customTr);
367
+ }
368
+
369
+ if (ariaNotify && getIntl) {
370
+ ariaNotify(
371
+ getIntl().formatMessage(messages.changedColumnWidth, {
372
+ width: Math.floor(newResizeState.cols[colIndex].width),
373
+ }),
374
+ );
375
+
376
+ if (newResizeState.cols.length === colIndex + 1) {
377
+ if (newResizeState.overflow === true) {
378
+ ariaNotify(getIntl().formatMessage(messages.columnResizeLast), {
379
+ priority: 'important',
380
+ });
381
+ }
382
+ if (newResizeState.overflow === false) {
383
+ ariaNotify(getIntl().formatMessage(messages.columnResizeOverflow), {
384
+ priority: 'important',
385
+ });
386
+ }
387
+ }
388
+ }
389
+
390
+ return true;
391
+ };
429
392
 
430
393
  export const stopKeyboardColumnResizing =
431
- ({
432
- ariaNotify,
433
- getIntl,
434
- originalTr,
435
- }: {
436
- ariaNotify?: (
437
- message: string,
438
- ariaLiveElementAttributes?: AriaLiveElementAttributes,
439
- ) => void;
440
- getIntl?: () => IntlShape;
441
- originalTr?: Transaction;
442
- }): Command =>
443
- (state, dispatch) => {
444
- if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
445
- return false;
446
- }
447
- let customTr = originalTr || state.tr;
448
- const fakeDispatch = (tr: Transaction) => {
449
- customTr = tr;
450
- };
451
-
452
- const decorationWithoutWidget = clearColumnResizingDecorations()({
453
- tr: customTr,
454
- decorationSet: getDecorations(state),
455
- });
456
-
457
- const decorationWithoutWidgetAndHandle = updateDecorations(
458
- customTr.doc,
459
- decorationWithoutWidget,
460
- [],
461
- TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
462
- );
463
- getTablePluginCommand(
464
- {
465
- type: 'STOP_KEYBOARD_COLUMN_RESIZE',
466
- data: {
467
- decorationSet: decorationWithoutWidgetAndHandle,
468
- },
469
- },
470
- customTr,
471
- )(state, fakeDispatch);
472
-
473
- tableResizingPluginCreateCommand(
474
- {
475
- type: 'STOP_RESIZING',
476
- },
477
- () => customTr.setMeta('scrollIntoView', false),
478
- )(state, fakeDispatch);
479
- if (ariaNotify && getIntl) {
480
- ariaNotify(getIntl().formatMessage(messages.columnResizeStop), {
481
- priority: 'important',
482
- });
483
- }
484
-
485
- if (dispatch) {
486
- dispatch(customTr);
487
- return true;
488
- }
489
- return false;
490
- };
394
+ ({
395
+ ariaNotify,
396
+ getIntl,
397
+ originalTr,
398
+ }: {
399
+ ariaNotify?: (message: string, ariaLiveElementAttributes?: AriaLiveElementAttributes) => void;
400
+ getIntl?: () => IntlShape;
401
+ originalTr?: Transaction;
402
+ }): Command =>
403
+ (state, dispatch) => {
404
+ if (!getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
405
+ return false;
406
+ }
407
+ let customTr = originalTr || state.tr;
408
+ const fakeDispatch = (tr: Transaction) => {
409
+ customTr = tr;
410
+ };
411
+
412
+ const decorationWithoutWidget = clearColumnResizingDecorations()({
413
+ tr: customTr,
414
+ decorationSet: getDecorations(state),
415
+ });
416
+
417
+ const decorationWithoutWidgetAndHandle = updateDecorations(
418
+ customTr.doc,
419
+ decorationWithoutWidget,
420
+ [],
421
+ TableDecorations.COLUMN_RESIZING_HANDLE_LINE,
422
+ );
423
+ getTablePluginCommand(
424
+ {
425
+ type: 'STOP_KEYBOARD_COLUMN_RESIZE',
426
+ data: {
427
+ decorationSet: decorationWithoutWidgetAndHandle,
428
+ },
429
+ },
430
+ customTr,
431
+ )(state, fakeDispatch);
432
+
433
+ tableResizingPluginCreateCommand(
434
+ {
435
+ type: 'STOP_RESIZING',
436
+ },
437
+ () => customTr.setMeta('scrollIntoView', false),
438
+ )(state, fakeDispatch);
439
+ if (ariaNotify && getIntl) {
440
+ ariaNotify(getIntl().formatMessage(messages.columnResizeStop), {
441
+ priority: 'important',
442
+ });
443
+ }
444
+
445
+ if (dispatch) {
446
+ dispatch(customTr);
447
+ return true;
448
+ }
449
+ return false;
450
+ };