@atlaskit/editor-plugin-table 5.3.17 → 5.3.18

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 (57) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/plugins/table/nodeviews/TableResizer.js +2 -8
  3. package/dist/cjs/plugins/table/toolbar.js +29 -56
  4. package/dist/cjs/plugins/table/ui/ColumnResizeWidget/index.js +2 -2
  5. package/dist/cjs/plugins/table/ui/FloatingContextualButton/index.js +2 -2
  6. package/dist/cjs/plugins/table/ui/FloatingContextualMenu/ContextualMenu.js +14 -56
  7. package/dist/cjs/plugins/table/ui/FloatingDeleteButton/index.js +2 -2
  8. package/dist/cjs/plugins/table/ui/FloatingInsertButton/InsertButton.js +2 -2
  9. package/dist/cjs/plugins/table/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +2 -2
  10. package/dist/cjs/plugins/table/ui/TableFloatingControls/CornerControls/DragCornerControls.js +2 -2
  11. package/dist/cjs/plugins/table/ui/TableFloatingControls/RowControls/ClassicControls.js +2 -8
  12. package/dist/es2019/plugins/table/nodeviews/TableResizer.js +2 -8
  13. package/dist/es2019/plugins/table/toolbar.js +20 -50
  14. package/dist/es2019/plugins/table/ui/ColumnResizeWidget/index.js +1 -1
  15. package/dist/es2019/plugins/table/ui/FloatingContextualButton/index.js +1 -1
  16. package/dist/es2019/plugins/table/ui/FloatingContextualMenu/ContextualMenu.js +6 -48
  17. package/dist/es2019/plugins/table/ui/FloatingDeleteButton/index.js +2 -2
  18. package/dist/es2019/plugins/table/ui/FloatingInsertButton/InsertButton.js +2 -2
  19. package/dist/es2019/plugins/table/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +1 -1
  20. package/dist/es2019/plugins/table/ui/TableFloatingControls/CornerControls/DragCornerControls.js +1 -1
  21. package/dist/es2019/plugins/table/ui/TableFloatingControls/RowControls/ClassicControls.js +2 -8
  22. package/dist/esm/plugins/table/nodeviews/TableResizer.js +2 -8
  23. package/dist/esm/plugins/table/toolbar.js +20 -50
  24. package/dist/esm/plugins/table/ui/ColumnResizeWidget/index.js +1 -1
  25. package/dist/esm/plugins/table/ui/FloatingContextualButton/index.js +1 -1
  26. package/dist/esm/plugins/table/ui/FloatingContextualMenu/ContextualMenu.js +6 -48
  27. package/dist/esm/plugins/table/ui/FloatingDeleteButton/index.js +2 -2
  28. package/dist/esm/plugins/table/ui/FloatingInsertButton/InsertButton.js +2 -2
  29. package/dist/esm/plugins/table/ui/TableFloatingControls/CornerControls/ClassicCornerControls.js +1 -1
  30. package/dist/esm/plugins/table/ui/TableFloatingControls/CornerControls/DragCornerControls.js +1 -1
  31. package/dist/esm/plugins/table/ui/TableFloatingControls/RowControls/ClassicControls.js +2 -8
  32. package/dist/types/plugins/table/toolbar.d.ts +0 -27
  33. package/dist/types/plugins/table/ui/FloatingContextualButton/index.d.ts +5 -5
  34. package/dist/types/plugins/table/ui/FloatingContextualMenu/ContextualMenu.d.ts +0 -42
  35. package/dist/types-ts4.5/plugins/table/toolbar.d.ts +0 -27
  36. package/dist/types-ts4.5/plugins/table/ui/FloatingContextualButton/index.d.ts +5 -5
  37. package/dist/types-ts4.5/plugins/table/ui/FloatingContextualMenu/ContextualMenu.d.ts +0 -42
  38. package/package.json +1 -1
  39. package/src/__tests__/integration/delete-columns.ts +1 -1
  40. package/src/__tests__/integration/delete-rows.ts +1 -1
  41. package/src/__tests__/unit/ui/DeleteButton.tsx +4 -3
  42. package/src/plugins/table/nodeviews/TableResizer.tsx +2 -9
  43. package/src/plugins/table/toolbar.tsx +22 -53
  44. package/src/plugins/table/ui/ColumnResizeWidget/index.tsx +1 -1
  45. package/src/plugins/table/ui/FloatingContextualButton/index.tsx +10 -11
  46. package/src/plugins/table/ui/FloatingContextualMenu/ContextualMenu.tsx +6 -50
  47. package/src/plugins/table/ui/FloatingDeleteButton/index.tsx +3 -3
  48. package/src/plugins/table/ui/FloatingInsertButton/InsertButton.tsx +2 -2
  49. package/src/plugins/table/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +1 -1
  50. package/src/plugins/table/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +1 -1
  51. package/src/plugins/table/ui/TableFloatingControls/RowControls/ClassicControls.tsx +2 -10
  52. package/dist/cjs/plugins/table/ui/messages.js +0 -74
  53. package/dist/es2019/plugins/table/ui/messages.js +0 -68
  54. package/dist/esm/plugins/table/ui/messages.js +0 -68
  55. package/dist/types/plugins/table/ui/messages.d.ts +0 -68
  56. package/dist/types-ts4.5/plugins/table/ui/messages.d.ts +0 -68
  57. package/src/plugins/table/ui/messages.ts +0 -74
@@ -1,8 +1,9 @@
1
1
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
2
2
  import rafSchd from 'raf-schd';
3
- import { defineMessages, useIntl } from 'react-intl-next';
3
+ import { useIntl } from 'react-intl-next';
4
4
  import { TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics';
5
5
  import { getGuidelinesWithHighlights } from '@atlaskit/editor-common/guideline';
6
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
6
7
  import { ResizerNext } from '@atlaskit/editor-common/resizer';
7
8
  import { findTable } from '@atlaskit/editor-tables/utils';
8
9
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -14,13 +15,6 @@ import { TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE, TABLE_SNAP_GAP } from '
14
15
  import { generateResizedPayload, generateResizeFrameRatePayloads, useMeasureFramerate } from '../utils/analytics';
15
16
  import { defaultGuidelines } from '../utils/guidelines';
16
17
  import { defaultSnappingWidths, findClosestSnap } from '../utils/snapping';
17
- const messages = defineMessages({
18
- resizeTable: {
19
- id: 'fabric.editor.tables.resizeTable',
20
- defaultMessage: 'Resize table',
21
- description: 'Tooltip displayed on custom table width resize hande'
22
- }
23
- });
24
18
  const handles = {
25
19
  right: true
26
20
  };
@@ -1,10 +1,9 @@
1
1
  /** @jsx jsx */
2
2
  import { jsx } from '@emotion/react';
3
- import { defineMessages } from 'react-intl-next';
4
3
  import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
5
4
  import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
6
5
  import { addColumnAfter, addRowAfter, backspace, tooltip } from '@atlaskit/editor-common/keymaps';
7
- import commonMessages from '@atlaskit/editor-common/messages';
6
+ import commonMessages, { tableMessages as messages } from '@atlaskit/editor-common/messages';
8
7
  import { cellBackgroundColorPalette, DEFAULT_BORDER_COLOR } from '@atlaskit/editor-common/ui-color';
9
8
  import { closestElement, getChildrenInfo, getNodeName, isReferencedSource } from '@atlaskit/editor-common/utils';
10
9
  import { findParentDomRefOfType } from '@atlaskit/editor-prosemirror/utils';
@@ -21,36 +20,7 @@ import { getNewResizeStateFromSelectedColumns } from './pm-plugins/table-resizin
21
20
  import { pluginKey as tableWidthPluginKey } from './pm-plugins/table-width';
22
21
  import { canMergeCells } from './transforms';
23
22
  import { TableCssClassName } from './types';
24
- import { messages as ContextualMenuMessages } from './ui/FloatingContextualMenu/ContextualMenu';
25
- import tableMessages from './ui/messages';
26
23
  import { getMergedCellsPositions, getSelectedColumnIndexes, getSelectedRowIndexes } from './utils';
27
- export const messages = defineMessages({
28
- tableOptions: {
29
- id: 'fabric.editor.tableOptions',
30
- defaultMessage: 'Table options',
31
- description: 'Opens a menu with additional table options'
32
- },
33
- headerRow: {
34
- id: 'fabric.editor.headerRow',
35
- defaultMessage: 'Header row',
36
- description: 'Marks the first table row as a header row'
37
- },
38
- headerColumn: {
39
- id: 'fabric.editor.headerColumn',
40
- defaultMessage: 'Header column',
41
- description: 'Marks the first table column as a header row'
42
- },
43
- numberedColumn: {
44
- id: 'fabric.editor.numberedColumn',
45
- defaultMessage: 'Numbered column',
46
- description: 'Adds an auto-numbering column to your table'
47
- },
48
- collapseTable: {
49
- id: 'fabric.editor.collapseTable',
50
- defaultMessage: 'Collapse table',
51
- description: 'Wraps table in an expand'
52
- }
53
- });
54
24
  export const getToolbarMenuConfig = (config, state, {
55
25
  formatMessage
56
26
  }, editorAnalyticsAPI) => {
@@ -108,7 +78,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
108
78
  const pluginState = getPluginState(editorState);
109
79
  const options = [{
110
80
  id: 'editor.table.insertColumn',
111
- title: formatMessage(tableMessages.insertColumn),
81
+ title: formatMessage(messages.insertColumn),
112
82
  onClick: (state, dispatch, view) => {
113
83
  const selectionRect = getClosestSelectionRect(state);
114
84
  const index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.right;
@@ -124,7 +94,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
124
94
  }, tooltip(addColumnAfter))
125
95
  }, {
126
96
  id: 'editor.table.insertRow',
127
- title: formatMessage(tableMessages.insertRow),
97
+ title: formatMessage(messages.insertRow),
128
98
  onClick: (state, dispatch) => {
129
99
  const selectionRect = getClosestSelectionRect(state);
130
100
  const index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.bottom;
@@ -143,7 +113,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
143
113
  }, tooltip(addRowAfter))
144
114
  }, {
145
115
  id: 'editor.table.removeColumns',
146
- title: formatMessage(tableMessages.removeColumns, {
116
+ title: formatMessage(messages.removeColumns, {
147
117
  0: numberOfColumns
148
118
  }),
149
119
  onClick: (state, dispatch, view) => {
@@ -161,7 +131,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
161
131
  disabled: false
162
132
  }, {
163
133
  id: 'editor.table.removeRows',
164
- title: formatMessage(tableMessages.removeRows, {
134
+ title: formatMessage(messages.removeRows, {
165
135
  0: numberOfRows
166
136
  }),
167
137
  onClick: (state, dispatch) => {
@@ -179,13 +149,13 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
179
149
  disabled: false
180
150
  }, {
181
151
  id: 'editor.table.mergeCells',
182
- title: formatMessage(ContextualMenuMessages.mergeCells),
152
+ title: formatMessage(messages.mergeCells),
183
153
  onClick: mergeCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB),
184
154
  selected: false,
185
155
  disabled: !canMergeCells(editorState.tr)
186
156
  }, {
187
157
  id: 'editor.table.splitCell',
188
- title: formatMessage(ContextualMenuMessages.splitCell),
158
+ title: formatMessage(messages.splitCell),
189
159
  onClick: splitCellWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB),
190
160
  selected: false,
191
161
  disabled: !splitCell(editorState)
@@ -203,7 +173,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
203
173
  };
204
174
  options.push({
205
175
  id: 'editor.table.distributeColumns',
206
- title: formatMessage(ContextualMenuMessages.distributeColumns),
176
+ title: formatMessage(messages.distributeColumns),
207
177
  onClick: distributeColumnWidths,
208
178
  selected: false,
209
179
  disabled: !wouldChange
@@ -211,10 +181,10 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
211
181
  }
212
182
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo2 = pluginState.pluginConfig) !== null && _pluginState$pluginCo2 !== void 0 && _pluginState$pluginCo2.allowColumnSorting) {
213
183
  const hasMergedCellsInTable = getMergedCellsPositions(editorState.tr).length > 0;
214
- const warning = hasMergedCellsInTable ? formatMessage(ContextualMenuMessages.canNotSortTable) : undefined;
184
+ const warning = hasMergedCellsInTable ? formatMessage(messages.canNotSortTable) : undefined;
215
185
  options.push({
216
186
  id: 'editor.table.sortColumnAsc',
217
- title: formatMessage(ContextualMenuMessages.sortColumnASC),
187
+ title: formatMessage(messages.sortColumnASC),
218
188
  onMouseOver: (state, dispatch) => {
219
189
  if (getMergedCellsPositions(state.tr).length !== 0) {
220
190
  hoverMergedCells()(state, dispatch);
@@ -236,7 +206,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
236
206
  });
237
207
  options.push({
238
208
  id: 'editor.table.sortColumnDesc',
239
- title: formatMessage(ContextualMenuMessages.sortColumnDESC),
209
+ title: formatMessage(messages.sortColumnDESC),
240
210
  onMouseOver: (state, dispatch) => {
241
211
  if (getMergedCellsPositions(state.tr).length !== 0) {
242
212
  hoverMergedCells()(state, dispatch);
@@ -259,7 +229,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
259
229
  }
260
230
  options.push({
261
231
  id: 'editor.table.clearCells',
262
- title: formatMessage(ContextualMenuMessages.clearCells, {
232
+ title: formatMessage(messages.clearCells, {
263
233
  0: Math.max(numberOfColumns, numberOfRows)
264
234
  }),
265
235
  onClick: (state, dispatch) => {
@@ -279,7 +249,7 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
279
249
  id: 'editor.table.cellOptions',
280
250
  testId: 'cell_options',
281
251
  type: 'dropdown',
282
- title: formatMessage(tableMessages.cellOptions),
252
+ title: formatMessage(messages.cellOptions),
283
253
  options,
284
254
  // Increased dropdown item width to prevent labels from being truncated
285
255
  dropdownWidth: 230,
@@ -307,17 +277,17 @@ export const getToolbarConfig = (getEditorContainerWidth, editorAnalyticsAPI, ge
307
277
  // Check if we need to show confirm dialog for delete button
308
278
  let confirmDialog;
309
279
  if (isReferencedSource(state, tableObject.node)) {
310
- const localSourceName = intl.formatMessage(tableMessages.unnamedSource);
280
+ const localSourceName = intl.formatMessage(messages.unnamedSource);
311
281
  confirmDialog = () => ({
312
- title: intl.formatMessage(tableMessages.deleteElementTitle),
313
- okButtonLabel: intl.formatMessage(tableMessages.confirmDeleteLinkedModalOKButton),
314
- message: intl.formatMessage(tableMessages.confirmDeleteLinkedModalMessage, {
282
+ title: intl.formatMessage(messages.deleteElementTitle),
283
+ okButtonLabel: intl.formatMessage(messages.confirmDeleteLinkedModalOKButton),
284
+ message: intl.formatMessage(messages.confirmDeleteLinkedModalMessage, {
315
285
  nodeName: getNodeName(state, tableObject.node) || localSourceName
316
286
  }),
317
- messagePrefix: intl.formatMessage(tableMessages.confirmDeleteLinkedModalMessagePrefix),
287
+ messagePrefix: intl.formatMessage(messages.confirmDeleteLinkedModalMessagePrefix),
318
288
  isReferentialityDialog: true,
319
289
  getChildrenInfo: () => getChildrenInfo(state, tableObject.node),
320
- checkboxLabel: intl.formatMessage(tableMessages.confirmModalCheckboxLabel),
290
+ checkboxLabel: intl.formatMessage(messages.confirmModalCheckboxLabel),
321
291
  onConfirm: (isChecked = false) => clickWithCheckboxHandler(isChecked, tableObject.node)
322
292
  });
323
293
  }
@@ -419,7 +389,7 @@ const getColorPicker = (state, menu, {
419
389
  };
420
390
  return [{
421
391
  id: 'editor.table.colorPicker',
422
- title: formatMessage(ContextualMenuMessages.cellBackground),
392
+ title: formatMessage(messages.cellBackground),
423
393
  type: 'select',
424
394
  selectType: 'color',
425
395
  defaultValue: defaultPalette,
@@ -3,9 +3,9 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import React from 'react';
4
4
  import { jsx } from '@emotion/react';
5
5
  import { useIntl } from 'react-intl-next';
6
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
6
7
  import Tooltip from '@atlaskit/tooltip';
7
8
  import { TableCssClassName } from '../../types';
8
- import messages from '../messages';
9
9
  export const ColumnResizeWidget = ({
10
10
  startIndex,
11
11
  endIndex,
@@ -4,6 +4,7 @@ import { jsx } from '@emotion/react';
4
4
  import { injectIntl } from 'react-intl-next';
5
5
  import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
6
6
  import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
7
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
7
8
  import { Popup } from '@atlaskit/editor-common/ui';
8
9
  import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
9
10
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
@@ -11,7 +12,6 @@ import { akEditorSmallZIndex } from '@atlaskit/editor-shared-styles';
11
12
  import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
12
13
  import { toggleContextualMenu } from '../../commands';
13
14
  import { TableCssClassName as ClassName } from '../../types';
14
- import messages from '../../ui/messages';
15
15
  import FixedButton from './FixedButton';
16
16
  import { tableFloatingCellButtonSelectedStyles, tableFloatingCellButtonStyles } from './styles';
17
17
  const BUTTON_OFFSET = 3;
@@ -2,10 +2,11 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  /** @jsx jsx */
3
3
  import { Component } from 'react';
4
4
  import { jsx } from '@emotion/react';
5
- import { defineMessages, injectIntl } from 'react-intl-next';
5
+ import { injectIntl } from 'react-intl-next';
6
6
  import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
7
7
  import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
8
8
  import { addColumnAfter, addRowAfter, backspace, tooltip } from '@atlaskit/editor-common/keymaps';
9
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
9
10
  import { DropdownMenuSharedCssClassName } from '@atlaskit/editor-common/styles';
10
11
  import { backgroundPaletteTooltipMessages, cellBackgroundColorPalette, ColorPalette } from '@atlaskit/editor-common/ui-color';
11
12
  import { ArrowKeyNavigationType, DropdownMenu } from '@atlaskit/editor-common/ui-menu';
@@ -21,50 +22,7 @@ import { canMergeCells } from '../../transforms';
21
22
  import { TableCssClassName as ClassName } from '../../types';
22
23
  import { getMergedCellsPositions, getSelectedColumnIndexes, getSelectedRowIndexes } from '../../utils';
23
24
  import { contextualMenuDropdownWidth } from '../consts';
24
- import tableMessages from '../messages';
25
25
  import { cellColourPreviewStyles } from './styles';
26
- export const messages = defineMessages({
27
- cellBackground: {
28
- id: 'fabric.editor.cellBackground',
29
- defaultMessage: 'Cell background',
30
- description: 'Change the background color of a table cell.'
31
- },
32
- mergeCells: {
33
- id: 'fabric.editor.mergeCells',
34
- defaultMessage: 'Merge cells',
35
- description: 'Merge tables cells together.'
36
- },
37
- splitCell: {
38
- id: 'fabric.editor.splitCell',
39
- defaultMessage: 'Split cell',
40
- description: 'Split a merged table cell.'
41
- },
42
- clearCells: {
43
- id: 'fabric.editor.clearCells',
44
- defaultMessage: 'Clear {0, plural, one {cell} other {cells}}',
45
- description: 'Clears the contents of the selected cells (this does not delete the cells themselves).'
46
- },
47
- sortColumnASC: {
48
- id: 'fabric.editor.sortColumnASC',
49
- defaultMessage: 'Sort column A → Z',
50
- description: 'Sort column in ascending order'
51
- },
52
- sortColumnDESC: {
53
- id: 'fabric.editor.sortColumnDESC',
54
- defaultMessage: 'Sort column Z → A',
55
- description: 'Sort column in descending order'
56
- },
57
- canNotSortTable: {
58
- id: 'fabric.editor.canNotSortTable',
59
- defaultMessage: `⚠️ You can't sort a table with merged cells`,
60
- description: `Split your cells to enable this feature`
61
- },
62
- distributeColumns: {
63
- id: 'fabric.editor.distributeColumns',
64
- defaultMessage: `Distribute columns`,
65
- description: `Distribute widths between selected columns`
66
- }
67
- });
68
26
  export class ContextualMenu extends Component {
69
27
  constructor(...args) {
70
28
  super(...args);
@@ -138,7 +96,7 @@ export class ContextualMenu extends Component {
138
96
  });
139
97
  }
140
98
  items.push({
141
- content: formatMessage(tableMessages.insertColumn),
99
+ content: formatMessage(messages.insertColumn),
142
100
  value: {
143
101
  name: 'insert_column'
144
102
  },
@@ -147,7 +105,7 @@ export class ContextualMenu extends Component {
147
105
  }, tooltip(addColumnAfter))
148
106
  });
149
107
  items.push({
150
- content: formatMessage(tableMessages.insertRow),
108
+ content: formatMessage(messages.insertRow),
151
109
  value: {
152
110
  name: 'insert_row'
153
111
  },
@@ -164,7 +122,7 @@ export class ContextualMenu extends Component {
164
122
  const noOfColumns = right - left;
165
123
  const noOfRows = bottom - top;
166
124
  items.push({
167
- content: formatMessage(tableMessages.removeColumns, {
125
+ content: formatMessage(messages.removeColumns, {
168
126
  0: noOfColumns
169
127
  }),
170
128
  value: {
@@ -172,7 +130,7 @@ export class ContextualMenu extends Component {
172
130
  }
173
131
  });
174
132
  items.push({
175
- content: formatMessage(tableMessages.removeRows, {
133
+ content: formatMessage(messages.removeRows, {
176
134
  0: noOfRows
177
135
  }),
178
136
  value: {
@@ -3,6 +3,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import React, { Component } from 'react';
4
4
  import { createPortal } from 'react-dom';
5
5
  import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
6
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
6
7
  import { Popup } from '@atlaskit/editor-common/ui';
7
8
  import { closestElement } from '@atlaskit/editor-common/utils';
8
9
  import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
@@ -14,7 +15,6 @@ import { getPluginState as getTablePluginState } from '../../pm-plugins/plugin-f
14
15
  import { TableCssClassName as ClassName } from '../../types';
15
16
  import { getColumnDeleteButtonParams, getColumnsWidths, getRowDeleteButtonParams, getRowHeights } from '../../utils';
16
17
  import { stickyRowZIndex } from '../consts';
17
- import tableMessages from '../messages';
18
18
  import DeleteButton from './DeleteButton';
19
19
  import getPopupOptions from './getPopUpOptions';
20
20
  export function getSelectionType(selection) {
@@ -227,7 +227,7 @@ class FloatingDeleteButton extends Component {
227
227
  }
228
228
  const tableContainerWrapper = closestElement(tableRef, `.${ClassName.TABLE_CONTAINER}`);
229
229
  const button = /*#__PURE__*/React.createElement(DeleteButton, {
230
- removeLabel: selectionType === 'column' ? tableMessages.removeColumns : tableMessages.removeRows,
230
+ removeLabel: selectionType === 'column' ? messages.removeColumns : messages.removeRows,
231
231
  onClick: this.handleClick,
232
232
  onMouseEnter: this.handleMouseEnter,
233
233
  onMouseLeave: this.handleMouseLeave
@@ -3,13 +3,13 @@
3
3
  import React from 'react';
4
4
  import { injectIntl } from 'react-intl-next';
5
5
  import { addColumnAfter, addRowAfter, ToolTipContent } from '@atlaskit/editor-common/keymaps';
6
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
6
7
  import { tableMarginTop } from '@atlaskit/editor-common/styles';
7
8
  import { closestElement } from '@atlaskit/editor-common/utils';
8
9
  import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
9
10
  import Tooltip from '@atlaskit/tooltip';
10
11
  import { TableCssClassName as ClassName } from '../../types';
11
12
  import { tableToolbarSize } from '../consts';
12
- import tableMessages from '../messages';
13
13
  const getInsertLineHeight = (tableRef, hasStickyHeaders) => {
14
14
  // The line gets height 100% from the table,
15
15
  // but since we have an overflow on the left,
@@ -43,7 +43,7 @@ const getInsertLineWidth = (tableRef, isDragAndDropEnabled) => {
43
43
  return Math.min(offsetWidth + toolbarSize, parentOffsetWidth + toolbarSize - Math.max(scrollLeft - diff, 0)) + LINE_OFFSET;
44
44
  };
45
45
  const tooltipMessageByType = type => {
46
- return type === 'row' ? tableMessages.insertRow : tableMessages.insertColumn;
46
+ return type === 'row' ? messages.insertRow : messages.insertColumn;
47
47
  };
48
48
  export const InsertButtonForDragAndDrop = ({
49
49
  onMouseDown,
@@ -2,11 +2,11 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import React, { Component } from 'react';
3
3
  import classnames from 'classnames';
4
4
  import { injectIntl } from 'react-intl-next';
5
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
5
6
  import { TableMap } from '@atlaskit/editor-tables/table-map';
6
7
  import { findTable, isTableSelected, selectTable } from '@atlaskit/editor-tables/utils';
7
8
  import { clearHoverSelection, hoverTable } from '../../../commands';
8
9
  import { TableCssClassName as ClassName } from '../../../types';
9
- import messages from '../../messages';
10
10
  class CornerControlComponent extends Component {
11
11
  constructor(...args) {
12
12
  super(...args);
@@ -1,10 +1,10 @@
1
1
  import React, { useMemo } from 'react';
2
2
  import classnames from 'classnames';
3
3
  import { injectIntl } from 'react-intl-next';
4
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
5
  import { findTable, isTableSelected, selectTable } from '@atlaskit/editor-tables/utils';
5
6
  import { clearHoverSelection, hoverTable } from '../../../commands';
6
7
  import { TableCssClassName as ClassName } from '../../../types';
7
- import messages from '../../messages';
8
8
  const DragCornerControlsComponent = ({
9
9
  editorView,
10
10
  isInDanger,
@@ -1,17 +1,11 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import React, { Component } from 'react';
3
- import { defineMessages, injectIntl } from 'react-intl-next';
3
+ import { injectIntl } from 'react-intl-next';
4
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
4
5
  import { clearHoverSelection } from '../../../commands';
5
6
  import { TableCssClassName as ClassName } from '../../../types';
6
7
  import { getRowClassNames, getRowHeights, getRowsParams } from '../../../utils';
7
8
  import { tableControlsSpacing, tableToolbarSize } from '../../consts';
8
- const messages = defineMessages({
9
- rowControl: {
10
- id: 'fabric.editor.rowControl',
11
- defaultMessage: 'Highlight row',
12
- description: 'A button on the left of each row that shows up when the table is in focus. Clicking on it will select the entire row.'
13
- }
14
- });
15
9
  class RowControlsComponent extends Component {
16
10
  constructor(...args) {
17
11
  super(...args);
@@ -4,9 +4,10 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
4
4
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
5
5
  import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
6
6
  import rafSchd from 'raf-schd';
7
- import { defineMessages, useIntl } from 'react-intl-next';
7
+ import { useIntl } from 'react-intl-next';
8
8
  import { TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics';
9
9
  import { getGuidelinesWithHighlights } from '@atlaskit/editor-common/guideline';
10
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
10
11
  import { ResizerNext } from '@atlaskit/editor-common/resizer';
11
12
  import { findTable } from '@atlaskit/editor-tables/utils';
12
13
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -18,13 +19,6 @@ import { TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE, TABLE_SNAP_GAP } from '
18
19
  import { generateResizedPayload, generateResizeFrameRatePayloads, useMeasureFramerate } from '../utils/analytics';
19
20
  import { defaultGuidelines } from '../utils/guidelines';
20
21
  import { defaultSnappingWidths, findClosestSnap } from '../utils/snapping';
21
- var messages = defineMessages({
22
- resizeTable: {
23
- id: 'fabric.editor.tables.resizeTable',
24
- defaultMessage: 'Resize table',
25
- description: 'Tooltip displayed on custom table width resize hande'
26
- }
27
- });
28
22
  var handles = {
29
23
  right: true
30
24
  };
@@ -1,10 +1,9 @@
1
1
  /** @jsx jsx */
2
2
  import { jsx } from '@emotion/react';
3
- import { defineMessages } from 'react-intl-next';
4
3
  import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
5
4
  import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
6
5
  import { addColumnAfter, addRowAfter, backspace, tooltip } from '@atlaskit/editor-common/keymaps';
7
- import commonMessages from '@atlaskit/editor-common/messages';
6
+ import commonMessages, { tableMessages as messages } from '@atlaskit/editor-common/messages';
8
7
  import { cellBackgroundColorPalette, DEFAULT_BORDER_COLOR } from '@atlaskit/editor-common/ui-color';
9
8
  import { closestElement, getChildrenInfo as _getChildrenInfo, getNodeName, isReferencedSource } from '@atlaskit/editor-common/utils';
10
9
  import { findParentDomRefOfType } from '@atlaskit/editor-prosemirror/utils';
@@ -21,36 +20,7 @@ import { getNewResizeStateFromSelectedColumns } from './pm-plugins/table-resizin
21
20
  import { pluginKey as tableWidthPluginKey } from './pm-plugins/table-width';
22
21
  import { canMergeCells } from './transforms';
23
22
  import { TableCssClassName } from './types';
24
- import { messages as ContextualMenuMessages } from './ui/FloatingContextualMenu/ContextualMenu';
25
- import tableMessages from './ui/messages';
26
23
  import { getMergedCellsPositions, getSelectedColumnIndexes, getSelectedRowIndexes } from './utils';
27
- export var messages = defineMessages({
28
- tableOptions: {
29
- id: 'fabric.editor.tableOptions',
30
- defaultMessage: 'Table options',
31
- description: 'Opens a menu with additional table options'
32
- },
33
- headerRow: {
34
- id: 'fabric.editor.headerRow',
35
- defaultMessage: 'Header row',
36
- description: 'Marks the first table row as a header row'
37
- },
38
- headerColumn: {
39
- id: 'fabric.editor.headerColumn',
40
- defaultMessage: 'Header column',
41
- description: 'Marks the first table column as a header row'
42
- },
43
- numberedColumn: {
44
- id: 'fabric.editor.numberedColumn',
45
- defaultMessage: 'Numbered column',
46
- description: 'Adds an auto-numbering column to your table'
47
- },
48
- collapseTable: {
49
- id: 'fabric.editor.collapseTable',
50
- defaultMessage: 'Collapse table',
51
- description: 'Wraps table in an expand'
52
- }
53
- });
54
24
  export var getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _ref, editorAnalyticsAPI) {
55
25
  var formatMessage = _ref.formatMessage;
56
26
  var options = [{
@@ -106,7 +76,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
106
76
  var pluginState = getPluginState(editorState);
107
77
  var options = [{
108
78
  id: 'editor.table.insertColumn',
109
- title: formatMessage(tableMessages.insertColumn),
79
+ title: formatMessage(messages.insertColumn),
110
80
  onClick: function onClick(state, dispatch, view) {
111
81
  var selectionRect = getClosestSelectionRect(state);
112
82
  var index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.right;
@@ -122,7 +92,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
122
92
  }, tooltip(addColumnAfter))
123
93
  }, {
124
94
  id: 'editor.table.insertRow',
125
- title: formatMessage(tableMessages.insertRow),
95
+ title: formatMessage(messages.insertRow),
126
96
  onClick: function onClick(state, dispatch) {
127
97
  var selectionRect = getClosestSelectionRect(state);
128
98
  var index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.bottom;
@@ -141,7 +111,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
141
111
  }, tooltip(addRowAfter))
142
112
  }, {
143
113
  id: 'editor.table.removeColumns',
144
- title: formatMessage(tableMessages.removeColumns, {
114
+ title: formatMessage(messages.removeColumns, {
145
115
  0: numberOfColumns
146
116
  }),
147
117
  onClick: function onClick(state, dispatch, view) {
@@ -159,7 +129,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
159
129
  disabled: false
160
130
  }, {
161
131
  id: 'editor.table.removeRows',
162
- title: formatMessage(tableMessages.removeRows, {
132
+ title: formatMessage(messages.removeRows, {
163
133
  0: numberOfRows
164
134
  }),
165
135
  onClick: function onClick(state, dispatch) {
@@ -177,13 +147,13 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
177
147
  disabled: false
178
148
  }, {
179
149
  id: 'editor.table.mergeCells',
180
- title: formatMessage(ContextualMenuMessages.mergeCells),
150
+ title: formatMessage(messages.mergeCells),
181
151
  onClick: mergeCellsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB),
182
152
  selected: false,
183
153
  disabled: !canMergeCells(editorState.tr)
184
154
  }, {
185
155
  id: 'editor.table.splitCell',
186
- title: formatMessage(ContextualMenuMessages.splitCell),
156
+ title: formatMessage(messages.splitCell),
187
157
  onClick: splitCellWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB),
188
158
  selected: false,
189
159
  disabled: !splitCell(editorState)
@@ -201,7 +171,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
201
171
  };
202
172
  options.push({
203
173
  id: 'editor.table.distributeColumns',
204
- title: formatMessage(ContextualMenuMessages.distributeColumns),
174
+ title: formatMessage(messages.distributeColumns),
205
175
  onClick: distributeColumnWidths,
206
176
  selected: false,
207
177
  disabled: !wouldChange
@@ -209,10 +179,10 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
209
179
  }
210
180
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo2 = pluginState.pluginConfig) !== null && _pluginState$pluginCo2 !== void 0 && _pluginState$pluginCo2.allowColumnSorting) {
211
181
  var hasMergedCellsInTable = getMergedCellsPositions(editorState.tr).length > 0;
212
- var warning = hasMergedCellsInTable ? formatMessage(ContextualMenuMessages.canNotSortTable) : undefined;
182
+ var warning = hasMergedCellsInTable ? formatMessage(messages.canNotSortTable) : undefined;
213
183
  options.push({
214
184
  id: 'editor.table.sortColumnAsc',
215
- title: formatMessage(ContextualMenuMessages.sortColumnASC),
185
+ title: formatMessage(messages.sortColumnASC),
216
186
  onMouseOver: function onMouseOver(state, dispatch) {
217
187
  if (getMergedCellsPositions(state.tr).length !== 0) {
218
188
  hoverMergedCells()(state, dispatch);
@@ -234,7 +204,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
234
204
  });
235
205
  options.push({
236
206
  id: 'editor.table.sortColumnDesc',
237
- title: formatMessage(ContextualMenuMessages.sortColumnDESC),
207
+ title: formatMessage(messages.sortColumnDESC),
238
208
  onMouseOver: function onMouseOver(state, dispatch) {
239
209
  if (getMergedCellsPositions(state.tr).length !== 0) {
240
210
  hoverMergedCells()(state, dispatch);
@@ -257,7 +227,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
257
227
  }
258
228
  options.push({
259
229
  id: 'editor.table.clearCells',
260
- title: formatMessage(ContextualMenuMessages.clearCells, {
230
+ title: formatMessage(messages.clearCells, {
261
231
  0: Math.max(numberOfColumns, numberOfRows)
262
232
  }),
263
233
  onClick: function onClick(state, dispatch) {
@@ -276,7 +246,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
276
246
  id: 'editor.table.cellOptions',
277
247
  testId: 'cell_options',
278
248
  type: 'dropdown',
279
- title: formatMessage(tableMessages.cellOptions),
249
+ title: formatMessage(messages.cellOptions),
280
250
  options: options,
281
251
  // Increased dropdown item width to prevent labels from being truncated
282
252
  dropdownWidth: 230,
@@ -306,20 +276,20 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
306
276
  // Check if we need to show confirm dialog for delete button
307
277
  var confirmDialog;
308
278
  if (isReferencedSource(state, tableObject.node)) {
309
- var localSourceName = intl.formatMessage(tableMessages.unnamedSource);
279
+ var localSourceName = intl.formatMessage(messages.unnamedSource);
310
280
  confirmDialog = function confirmDialog() {
311
281
  return {
312
- title: intl.formatMessage(tableMessages.deleteElementTitle),
313
- okButtonLabel: intl.formatMessage(tableMessages.confirmDeleteLinkedModalOKButton),
314
- message: intl.formatMessage(tableMessages.confirmDeleteLinkedModalMessage, {
282
+ title: intl.formatMessage(messages.deleteElementTitle),
283
+ okButtonLabel: intl.formatMessage(messages.confirmDeleteLinkedModalOKButton),
284
+ message: intl.formatMessage(messages.confirmDeleteLinkedModalMessage, {
315
285
  nodeName: getNodeName(state, tableObject.node) || localSourceName
316
286
  }),
317
- messagePrefix: intl.formatMessage(tableMessages.confirmDeleteLinkedModalMessagePrefix),
287
+ messagePrefix: intl.formatMessage(messages.confirmDeleteLinkedModalMessagePrefix),
318
288
  isReferentialityDialog: true,
319
289
  getChildrenInfo: function getChildrenInfo() {
320
290
  return _getChildrenInfo(state, tableObject.node);
321
291
  },
322
- checkboxLabel: intl.formatMessage(tableMessages.confirmModalCheckboxLabel),
292
+ checkboxLabel: intl.formatMessage(messages.confirmModalCheckboxLabel),
323
293
  onConfirm: function onConfirm() {
324
294
  var isChecked = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
325
295
  return clickWithCheckboxHandler(isChecked, tableObject.node);
@@ -426,7 +396,7 @@ var getColorPicker = function getColorPicker(state, menu, _ref4, editorAnalytics
426
396
  };
427
397
  return [{
428
398
  id: 'editor.table.colorPicker',
429
- title: formatMessage(ContextualMenuMessages.cellBackground),
399
+ title: formatMessage(messages.cellBackground),
430
400
  type: 'select',
431
401
  selectType: 'color',
432
402
  defaultValue: defaultPalette,
@@ -3,9 +3,9 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import React from 'react';
4
4
  import { jsx } from '@emotion/react';
5
5
  import { useIntl } from 'react-intl-next';
6
+ import { tableMessages as messages } from '@atlaskit/editor-common/messages';
6
7
  import Tooltip from '@atlaskit/tooltip';
7
8
  import { TableCssClassName } from '../../types';
8
- import messages from '../messages';
9
9
  export var ColumnResizeWidget = function ColumnResizeWidget(_ref) {
10
10
  var startIndex = _ref.startIndex,
11
11
  endIndex = _ref.endIndex,