@atlaskit/editor-plugin-table 15.3.14 → 15.3.15

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 15.3.15
4
+
5
+ ### Patch Changes
6
+
7
+ - [`fd0c8ec823f49`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fd0c8ec823f49) -
8
+ NOISSUE - Add limited mode check for expensive getTableScalingPercent calls for the table floating
9
+ toolbar alignment button.
10
+ - Updated dependencies
11
+
3
12
  ## 15.3.14
4
13
 
5
14
  ### Patch Changes
@@ -72,7 +72,7 @@ var tableStickyHeaderFirefoxFixStyle = function tableStickyHeaderFirefoxFixStyle
72
72
  * inspired by https://css-scroll-shadows.vercel.app/
73
73
  */
74
74
  var tableScrollInlineShadowStyles = function tableScrollInlineShadowStyles() {
75
- return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\t--editor-table-shadow-cover: #fff;\n\t\t\t--editor-table-shadow-color: ", ";\n\t\t\t--editor-table-shadow-size: ", ";\n\t\t\tbackground-image:\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-cover) 33%, transparent),\n\t\t\t\tlinear-gradient(to right, transparent, var(--editor-table-shadow-cover) 66%),\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-color), transparent),\n\t\t\t\tlinear-gradient(to left, var(--editor-table-shadow-color), transparent);\n\t\t\tbackground-size:\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%;\n\t\t\tbackground-position:\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ",\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ";\n\t\t\tbackground-attachment: local, local, scroll, scroll;\n\t\t\tbackground-repeat: no-repeat;\n\n\t\t\tth,\n\t\t\ttd {\n\t\t\t\tmix-blend-mode: multiply;\n\t\t\t}\n\t\t}\n\n\t\t.", " .", " tr.sticky th,\n\t\t.", " .", " tr.sticky td {\n\t\t\tmix-blend-mode: normal;\n\t\t}\n\t"])), _types.TableCssClassName.TABLE_SCROLL_INLINE_SHADOW, "var(--ds-shadow-overflow-spread, #091e4229)", "var(--ds-space-100, 8px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_SCROLL_INLINE_SHADOW, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_SCROLL_INLINE_SHADOW);
75
+ return (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n\t\t.", " {\n\t\t\t--editor-table-shadow-cover: #fff;\n\t\t\t--editor-table-shadow-color: ", ";\n\t\t\t--editor-table-shadow-size: ", ";\n\t\t\tbackground-image:\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-cover) 33%, transparent),\n\t\t\t\tlinear-gradient(to right, transparent, var(--editor-table-shadow-cover) 66%),\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-color), transparent),\n\t\t\t\tlinear-gradient(to left, var(--editor-table-shadow-color), transparent);\n\t\t\tbackground-size:\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%;\n\t\t\tbackground-position:\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ",\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ";\n\t\t\tbackground-attachment: local, local, scroll, scroll;\n\t\t\tbackground-repeat: no-repeat;\n\n\t\t\tth,\n\t\t\ttd {\n\t\t\t\tmix-blend-mode: multiply;\n\t\t\t}\n\t\t}\n\n\t\t.", " .", " tr.sticky th,\n\t\t.", " .", " tr.sticky td {\n\t\t\tmix-blend-mode: normal;\n\t\t}\n\t"])), _types.TableCssClassName.TABLE_SCROLL_INLINE_SHADOW, "var(--ds-shadow-overflow-spread, #1E1F2129)", "var(--ds-space-100, 8px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_SCROLL_INLINE_SHADOW, _types.TableCssClassName.TABLE_STICKY, _types.TableCssClassName.TABLE_SCROLL_INLINE_SHADOW);
76
76
  };
77
77
 
78
78
  // re-exporting these styles to use in Gemini test when table node view is rendered outside of PM
@@ -150,6 +150,7 @@ var getToolbarCellOptionsConfig = exports.getToolbarCellOptionsConfig = function
150
150
  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
151
151
  var shouldUseIncreasedScalingPercent = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
152
152
  var isCommentEditor = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
153
+ var isLimitedModeEnabled = arguments.length > 11 && arguments[11] !== undefined ? arguments[11] : false;
153
154
  var top = initialSelectionRect.top,
154
155
  bottom = initialSelectionRect.bottom,
155
156
  right = initialSelectionRect.right,
@@ -247,15 +248,35 @@ var getToolbarCellOptionsConfig = exports.getToolbarCellOptionsConfig = function
247
248
  });
248
249
  }
249
250
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo = pluginState.pluginConfig) !== null && _pluginState$pluginCo !== void 0 && _pluginState$pluginCo.allowDistributeColumns) {
250
- var _newResizeStateWithAn;
251
- var newResizeStateWithAnalytics = editorView ? (0, _resizeState.getNewResizeStateFromSelectedColumns)(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
252
- var wouldChange = (_newResizeStateWithAn = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
253
- var distributeColumnWidths = function distributeColumnWidths(state, dispatch) {
254
- if (newResizeStateWithAnalytics) {
255
- (0, _commandsWithAnalytics.distributeColumnsWidthsWithAnalytics)(editorAnalyticsAPI, api)(_analytics.INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
256
- return true;
251
+ var wouldChange = true; // Default to enabled - show the button.
252
+ var newResizeStateWithAnalytics;
253
+
254
+ // Performance optimization: Skip expensive getTableScalingPercent() DOM query when limited mode is enabled.
255
+ // This avoids layout reflows on every transaction. Instead, button stays enabled and calculates on-demand when clicked.
256
+ if (!(0, _expValEquals.expValEquals)('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) || !isLimitedModeEnabled) {
257
+ var _newResizeStateWithAn, _newResizeStateWithAn2;
258
+ newResizeStateWithAnalytics = editorView ? (0, _resizeState.getNewResizeStateFromSelectedColumns)(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
259
+ wouldChange = (_newResizeStateWithAn = (_newResizeStateWithAn2 = newResizeStateWithAnalytics) === null || _newResizeStateWithAn2 === void 0 ? void 0 : _newResizeStateWithAn2.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
260
+ }
261
+ var distributeColumnWidths = function distributeColumnWidths(state, dispatch, view) {
262
+ // When optimization is enabled, calculate on-demand when clicked
263
+ if ((0, _expValEquals.expValEquals)('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) && isLimitedModeEnabled) {
264
+ if (view) {
265
+ var resizeState = (0, _resizeState.getNewResizeStateFromSelectedColumns)(initialSelectionRect, state, view.domAtPos.bind(view), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
266
+ if (resizeState) {
267
+ (0, _commandsWithAnalytics.distributeColumnsWidthsWithAnalytics)(editorAnalyticsAPI, api)(_analytics.INPUT_METHOD.FLOATING_TB, resizeState)(state, dispatch);
268
+ return true;
269
+ }
270
+ }
271
+ return false;
272
+ } else {
273
+ // Original behavior: use pre-calculated state
274
+ if (newResizeStateWithAnalytics) {
275
+ (0, _commandsWithAnalytics.distributeColumnsWidthsWithAnalytics)(editorAnalyticsAPI, api)(_analytics.INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
276
+ return true;
277
+ }
278
+ return false;
257
279
  }
258
- return false;
259
280
  };
260
281
  options.push({
261
282
  id: 'editor.table.distributeColumns',
@@ -410,7 +431,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
410
431
  // We don't want to show floating toolbar while resizing the table
411
432
  var isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
412
433
  if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
413
- var _api$extension, _api$extension2;
434
+ var _api$limitedMode$shar, _api$limitedMode, _api$extension, _api$extension2;
414
435
  var isNested = pluginState.tablePos && (0, _nodes.isTableNested)(state, pluginState.tablePos);
415
436
  var isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
416
437
  var areTableColumWidthsFixed = tableObject.node.attrs.displayMode === 'fixed';
@@ -432,8 +453,9 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
432
453
  };
433
454
  var menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI, isTableScalingWithFixedColumnWidthsOptionShown, areTableColumWidthsFixed);
434
455
  var alignmentMenu = config.allowTableAlignment && !isNested ? getAlignmentOptionsConfig(state, intl, editorAnalyticsAPI, getEditorContainerWidth, editorView, shouldUseIncreasedScalingPercent, areAnyNewToolbarFlagsEnabled, options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
435
- var cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
436
- var columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
456
+ var isLimitedModeEnabled = (_api$limitedMode$shar = api === null || api === void 0 || (_api$limitedMode = api.limitedMode) === null || _api$limitedMode === void 0 || (_api$limitedMode = _api$limitedMode.sharedState.currentState()) === null || _api$limitedMode === void 0 ? void 0 : _api$limitedMode.enabled) !== null && _api$limitedMode$shar !== void 0 ? _api$limitedMode$shar : false;
457
+ var cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor, isLimitedModeEnabled);
458
+ var columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor, isLimitedModeEnabled) : [];
437
459
  var colorPicker = !areAnyNewToolbarFlagsEnabled ? getColorPicker(state, menu, intl, editorAnalyticsAPI, getEditorView) : [];
438
460
 
439
461
  // Check if we need to show confirm dialog for delete button
@@ -591,11 +613,12 @@ var getCellItems = function getCellItems(state, view, _ref3, getEditorContainerW
591
613
  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
592
614
  var shouldUseIncreasedScalingPercent = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
593
615
  var isCommentEditor = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
616
+ var isLimitedModeEnabled = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
594
617
  var initialSelectionRect = getClosestSelectionRect(state);
595
618
  if (initialSelectionRect) {
596
619
  var cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
597
620
  formatMessage: formatMessage
598
- }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor);
621
+ }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isLimitedModeEnabled);
599
622
  // Ignored via go/ees005
600
623
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
601
624
  return [cellOptions, separator(cellOptions.hidden)];
@@ -623,18 +646,27 @@ var getDistributeConfig = function getDistributeConfig(getEditorContainerWidth,
623
646
  // this create the button group for distribute column and also fixed column width
624
647
  // fixed column button should be in this function call in the future
625
648
  var getColumnSettingItems = function getColumnSettingItems(editorState, editorView, _ref4, getEditorContainerWidth, api, editorAnalyticsAPI) {
626
- var _newResizeStateWithAn2, _pluginState$pluginCo3;
649
+ var _pluginState$pluginCo3;
627
650
  var formatMessage = _ref4.formatMessage;
628
651
  var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
629
652
  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
630
653
  var isCommentEditor = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
654
+ var isLimitedModeEnabled = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
631
655
  var pluginState = (0, _pluginFactory2.getPluginState)(editorState);
632
656
  var selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
633
657
  if (!selectionOrTableRect || !editorView) {
634
658
  return [];
635
659
  }
636
- var newResizeStateWithAnalytics = (0, _resizeState.getNewResizeStateFromSelectedColumns)(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
637
- var wouldChange = (_newResizeStateWithAn2 = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn2 !== void 0 ? _newResizeStateWithAn2 : false;
660
+ var wouldChange = true; // Default to enabled - show the button.
661
+ var newResizeStateWithAnalytics;
662
+
663
+ // Performance optimization: Skip expensive getTableScalingPercent() DOM query when limited mode is enabled.
664
+ // This avoids layout reflows on every transaction. Instead, button stays enabled and calculates on-demand when clicked.
665
+ if (!(0, _expValEquals.expValEquals)('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) || !isLimitedModeEnabled) {
666
+ var _newResizeStateWithAn3, _newResizeStateWithAn4;
667
+ newResizeStateWithAnalytics = (0, _resizeState.getNewResizeStateFromSelectedColumns)(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
668
+ wouldChange = (_newResizeStateWithAn3 = (_newResizeStateWithAn4 = newResizeStateWithAnalytics) === null || _newResizeStateWithAn4 === void 0 ? void 0 : _newResizeStateWithAn4.changed) !== null && _newResizeStateWithAn3 !== void 0 ? _newResizeStateWithAn3 : false;
669
+ }
638
670
  var items = [];
639
671
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo3 = pluginState.pluginConfig) !== null && _pluginState$pluginCo3 !== void 0 && _pluginState$pluginCo3.allowDistributeColumns && pluginState.isDragAndDropEnabled) {
640
672
  items.push({
@@ -212,7 +212,7 @@ const tableScrollInlineShadowStyles = () => {
212
212
  return css`
213
213
  .${ClassName.TABLE_SCROLL_INLINE_SHADOW} {
214
214
  --editor-table-shadow-cover: #fff;
215
- --editor-table-shadow-color: ${"var(--ds-shadow-overflow-spread, #091e4229)"};
215
+ --editor-table-shadow-color: ${"var(--ds-shadow-overflow-spread, #1E1F2129)"};
216
216
  --editor-table-shadow-size: ${"var(--ds-space-100, 8px)"};
217
217
  background-image:
218
218
  linear-gradient(to right, var(--editor-table-shadow-cover) 33%, transparent),
@@ -129,7 +129,7 @@ export const getToolbarMenuConfig = (config, state, {
129
129
  // with native widgets. It's enabled via a plugin config.
130
130
  export const getToolbarCellOptionsConfig = (editorState, editorView, initialSelectionRect, {
131
131
  formatMessage
132
- }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => {
132
+ }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false, isLimitedModeEnabled = false) => {
133
133
  var _pluginState$pluginCo, _pluginState$pluginCo2;
134
134
  const {
135
135
  top,
@@ -230,15 +230,35 @@ export const getToolbarCellOptionsConfig = (editorState, editorView, initialSele
230
230
  });
231
231
  }
232
232
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo = pluginState.pluginConfig) !== null && _pluginState$pluginCo !== void 0 && _pluginState$pluginCo.allowDistributeColumns) {
233
- var _newResizeStateWithAn;
234
- const newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
235
- const wouldChange = (_newResizeStateWithAn = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
236
- const distributeColumnWidths = (state, dispatch) => {
237
- if (newResizeStateWithAnalytics) {
238
- distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI, api)(INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
239
- return true;
233
+ let wouldChange = true; // Default to enabled - show the button.
234
+ let newResizeStateWithAnalytics;
235
+
236
+ // Performance optimization: Skip expensive getTableScalingPercent() DOM query when limited mode is enabled.
237
+ // This avoids layout reflows on every transaction. Instead, button stays enabled and calculates on-demand when clicked.
238
+ if (!expValEquals('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) || !isLimitedModeEnabled) {
239
+ var _newResizeStateWithAn, _newResizeStateWithAn2;
240
+ newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
241
+ wouldChange = (_newResizeStateWithAn = (_newResizeStateWithAn2 = newResizeStateWithAnalytics) === null || _newResizeStateWithAn2 === void 0 ? void 0 : _newResizeStateWithAn2.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
242
+ }
243
+ const distributeColumnWidths = (state, dispatch, view) => {
244
+ // When optimization is enabled, calculate on-demand when clicked
245
+ if (expValEquals('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) && isLimitedModeEnabled) {
246
+ if (view) {
247
+ const resizeState = getNewResizeStateFromSelectedColumns(initialSelectionRect, state, view.domAtPos.bind(view), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
248
+ if (resizeState) {
249
+ distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI, api)(INPUT_METHOD.FLOATING_TB, resizeState)(state, dispatch);
250
+ return true;
251
+ }
252
+ }
253
+ return false;
254
+ } else {
255
+ // Original behavior: use pre-calculated state
256
+ if (newResizeStateWithAnalytics) {
257
+ distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI, api)(INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
258
+ return true;
259
+ }
260
+ return false;
240
261
  }
241
- return false;
242
262
  };
243
263
  options.push({
244
264
  id: 'editor.table.distributeColumns',
@@ -389,7 +409,7 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
389
409
  // We don't want to show floating toolbar while resizing the table
390
410
  const isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
391
411
  if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
392
- var _api$extension, _api$extension$shared, _api$extension2;
412
+ var _api$limitedMode$shar, _api$limitedMode, _api$limitedMode$shar2, _api$extension, _api$extension$shared, _api$extension2;
393
413
  const isNested = pluginState.tablePos && isTableNested(state, pluginState.tablePos);
394
414
  const isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
395
415
  const areTableColumWidthsFixed = tableObject.node.attrs.displayMode === 'fixed';
@@ -411,8 +431,9 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
411
431
  };
412
432
  const menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI, isTableScalingWithFixedColumnWidthsOptionShown, areTableColumWidthsFixed);
413
433
  const alignmentMenu = config.allowTableAlignment && !isNested ? getAlignmentOptionsConfig(state, intl, editorAnalyticsAPI, getEditorContainerWidth, editorView, shouldUseIncreasedScalingPercent, areAnyNewToolbarFlagsEnabled, options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
414
- const cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
415
- const columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
434
+ const isLimitedModeEnabled = (_api$limitedMode$shar = api === null || api === void 0 ? void 0 : (_api$limitedMode = api.limitedMode) === null || _api$limitedMode === void 0 ? void 0 : (_api$limitedMode$shar2 = _api$limitedMode.sharedState.currentState()) === null || _api$limitedMode$shar2 === void 0 ? void 0 : _api$limitedMode$shar2.enabled) !== null && _api$limitedMode$shar !== void 0 ? _api$limitedMode$shar : false;
435
+ const cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor, isLimitedModeEnabled);
436
+ const columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor, isLimitedModeEnabled) : [];
416
437
  const colorPicker = !areAnyNewToolbarFlagsEnabled ? getColorPicker(state, menu, intl, editorAnalyticsAPI, getEditorView) : [];
417
438
 
418
439
  // Check if we need to show confirm dialog for delete button
@@ -556,12 +577,12 @@ const separator = hidden => {
556
577
  };
557
578
  const getCellItems = (state, view, {
558
579
  formatMessage
559
- }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false) => {
580
+ }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false, isCommentEditor = false, isLimitedModeEnabled = false) => {
560
581
  const initialSelectionRect = getClosestSelectionRect(state);
561
582
  if (initialSelectionRect) {
562
583
  const cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
563
584
  formatMessage
564
- }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor);
585
+ }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isLimitedModeEnabled);
565
586
  // Ignored via go/ees005
566
587
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
567
588
  return [cellOptions, separator(cellOptions.hidden)];
@@ -585,15 +606,23 @@ const getDistributeConfig = (getEditorContainerWidth, api, editorAnalyticsAPI, i
585
606
  // fixed column button should be in this function call in the future
586
607
  const getColumnSettingItems = (editorState, editorView, {
587
608
  formatMessage
588
- }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, isCommentEditor = false) => {
589
- var _newResizeStateWithAn2, _pluginState$pluginCo3;
609
+ }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled = false, isTableFixedColumnWidthsOptionEnabled = false, isCommentEditor = false, isLimitedModeEnabled = false) => {
610
+ var _pluginState$pluginCo3;
590
611
  const pluginState = getPluginState(editorState);
591
612
  const selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
592
613
  if (!selectionOrTableRect || !editorView) {
593
614
  return [];
594
615
  }
595
- const newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
596
- const wouldChange = (_newResizeStateWithAn2 = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn2 !== void 0 ? _newResizeStateWithAn2 : false;
616
+ let wouldChange = true; // Default to enabled - show the button.
617
+ let newResizeStateWithAnalytics;
618
+
619
+ // Performance optimization: Skip expensive getTableScalingPercent() DOM query when limited mode is enabled.
620
+ // This avoids layout reflows on every transaction. Instead, button stays enabled and calculates on-demand when clicked.
621
+ if (!expValEquals('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) || !isLimitedModeEnabled) {
622
+ var _newResizeStateWithAn3, _newResizeStateWithAn4;
623
+ newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
624
+ wouldChange = (_newResizeStateWithAn3 = (_newResizeStateWithAn4 = newResizeStateWithAnalytics) === null || _newResizeStateWithAn4 === void 0 ? void 0 : _newResizeStateWithAn4.changed) !== null && _newResizeStateWithAn3 !== void 0 ? _newResizeStateWithAn3 : false;
625
+ }
597
626
  const items = [];
598
627
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo3 = pluginState.pluginConfig) !== null && _pluginState$pluginCo3 !== void 0 && _pluginState$pluginCo3.allowDistributeColumns && pluginState.isDragAndDropEnabled) {
599
628
  items.push({
@@ -67,7 +67,7 @@ var tableStickyHeaderFirefoxFixStyle = function tableStickyHeaderFirefoxFixStyle
67
67
  * inspired by https://css-scroll-shadows.vercel.app/
68
68
  */
69
69
  var tableScrollInlineShadowStyles = function tableScrollInlineShadowStyles() {
70
- return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n\t\t.", " {\n\t\t\t--editor-table-shadow-cover: #fff;\n\t\t\t--editor-table-shadow-color: ", ";\n\t\t\t--editor-table-shadow-size: ", ";\n\t\t\tbackground-image:\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-cover) 33%, transparent),\n\t\t\t\tlinear-gradient(to right, transparent, var(--editor-table-shadow-cover) 66%),\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-color), transparent),\n\t\t\t\tlinear-gradient(to left, var(--editor-table-shadow-color), transparent);\n\t\t\tbackground-size:\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%;\n\t\t\tbackground-position:\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ",\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ";\n\t\t\tbackground-attachment: local, local, scroll, scroll;\n\t\t\tbackground-repeat: no-repeat;\n\n\t\t\tth,\n\t\t\ttd {\n\t\t\t\tmix-blend-mode: multiply;\n\t\t\t}\n\t\t}\n\n\t\t.", " .", " tr.sticky th,\n\t\t.", " .", " tr.sticky td {\n\t\t\tmix-blend-mode: normal;\n\t\t}\n\t"])), ClassName.TABLE_SCROLL_INLINE_SHADOW, "var(--ds-shadow-overflow-spread, #091e4229)", "var(--ds-space-100, 8px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", ClassName.TABLE_STICKY, ClassName.TABLE_SCROLL_INLINE_SHADOW, ClassName.TABLE_STICKY, ClassName.TABLE_SCROLL_INLINE_SHADOW);
70
+ return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n\t\t.", " {\n\t\t\t--editor-table-shadow-cover: #fff;\n\t\t\t--editor-table-shadow-color: ", ";\n\t\t\t--editor-table-shadow-size: ", ";\n\t\t\tbackground-image:\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-cover) 33%, transparent),\n\t\t\t\tlinear-gradient(to right, transparent, var(--editor-table-shadow-cover) 66%),\n\t\t\t\tlinear-gradient(to right, var(--editor-table-shadow-color), transparent),\n\t\t\t\tlinear-gradient(to left, var(--editor-table-shadow-color), transparent);\n\t\t\tbackground-size:\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 3) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%,\n\t\t\t\tcalc(var(--editor-table-shadow-size) * 1) 100%;\n\t\t\tbackground-position:\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ",\n\t\t\t\tleft ", ",\n\t\t\t\tright ", ";\n\t\t\tbackground-attachment: local, local, scroll, scroll;\n\t\t\tbackground-repeat: no-repeat;\n\n\t\t\tth,\n\t\t\ttd {\n\t\t\t\tmix-blend-mode: multiply;\n\t\t\t}\n\t\t}\n\n\t\t.", " .", " tr.sticky th,\n\t\t.", " .", " tr.sticky td {\n\t\t\tmix-blend-mode: normal;\n\t\t}\n\t"])), ClassName.TABLE_SCROLL_INLINE_SHADOW, "var(--ds-shadow-overflow-spread, #1E1F2129)", "var(--ds-space-100, 8px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", "var(--ds-space-300, 24px)", ClassName.TABLE_STICKY, ClassName.TABLE_SCROLL_INLINE_SHADOW, ClassName.TABLE_STICKY, ClassName.TABLE_SCROLL_INLINE_SHADOW);
71
71
  };
72
72
 
73
73
  // re-exporting these styles to use in Gemini test when table node view is rendered outside of PM
@@ -143,6 +143,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
143
143
  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
144
144
  var shouldUseIncreasedScalingPercent = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
145
145
  var isCommentEditor = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
146
+ var isLimitedModeEnabled = arguments.length > 11 && arguments[11] !== undefined ? arguments[11] : false;
146
147
  var top = initialSelectionRect.top,
147
148
  bottom = initialSelectionRect.bottom,
148
149
  right = initialSelectionRect.right,
@@ -240,15 +241,35 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
240
241
  });
241
242
  }
242
243
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo = pluginState.pluginConfig) !== null && _pluginState$pluginCo !== void 0 && _pluginState$pluginCo.allowDistributeColumns) {
243
- var _newResizeStateWithAn;
244
- var newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
245
- var wouldChange = (_newResizeStateWithAn = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
246
- var distributeColumnWidths = function distributeColumnWidths(state, dispatch) {
247
- if (newResizeStateWithAnalytics) {
248
- distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI, api)(INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
249
- return true;
244
+ var wouldChange = true; // Default to enabled - show the button.
245
+ var newResizeStateWithAnalytics;
246
+
247
+ // Performance optimization: Skip expensive getTableScalingPercent() DOM query when limited mode is enabled.
248
+ // This avoids layout reflows on every transaction. Instead, button stays enabled and calculates on-demand when clicked.
249
+ if (!expValEquals('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) || !isLimitedModeEnabled) {
250
+ var _newResizeStateWithAn, _newResizeStateWithAn2;
251
+ newResizeStateWithAnalytics = editorView ? getNewResizeStateFromSelectedColumns(initialSelectionRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor) : undefined;
252
+ wouldChange = (_newResizeStateWithAn = (_newResizeStateWithAn2 = newResizeStateWithAnalytics) === null || _newResizeStateWithAn2 === void 0 ? void 0 : _newResizeStateWithAn2.changed) !== null && _newResizeStateWithAn !== void 0 ? _newResizeStateWithAn : false;
253
+ }
254
+ var distributeColumnWidths = function distributeColumnWidths(state, dispatch, view) {
255
+ // When optimization is enabled, calculate on-demand when clicked
256
+ if (expValEquals('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) && isLimitedModeEnabled) {
257
+ if (view) {
258
+ var resizeState = getNewResizeStateFromSelectedColumns(initialSelectionRect, state, view.domAtPos.bind(view), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
259
+ if (resizeState) {
260
+ distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI, api)(INPUT_METHOD.FLOATING_TB, resizeState)(state, dispatch);
261
+ return true;
262
+ }
263
+ }
264
+ return false;
265
+ } else {
266
+ // Original behavior: use pre-calculated state
267
+ if (newResizeStateWithAnalytics) {
268
+ distributeColumnsWidthsWithAnalytics(editorAnalyticsAPI, api)(INPUT_METHOD.FLOATING_TB, newResizeStateWithAnalytics)(state, dispatch);
269
+ return true;
270
+ }
271
+ return false;
250
272
  }
251
- return false;
252
273
  };
253
274
  options.push({
254
275
  id: 'editor.table.distributeColumns',
@@ -403,7 +424,7 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
403
424
  // We don't want to show floating toolbar while resizing the table
404
425
  var isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
405
426
  if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
406
- var _api$extension, _api$extension2;
427
+ var _api$limitedMode$shar, _api$limitedMode, _api$extension, _api$extension2;
407
428
  var isNested = pluginState.tablePos && isTableNested(state, pluginState.tablePos);
408
429
  var isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
409
430
  var areTableColumWidthsFixed = tableObject.node.attrs.displayMode === 'fixed';
@@ -425,8 +446,9 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
425
446
  };
426
447
  var menu = getToolbarMenuConfig(config, pluginState, intl, editorAnalyticsAPI, isTableScalingWithFixedColumnWidthsOptionShown, areTableColumWidthsFixed);
427
448
  var alignmentMenu = config.allowTableAlignment && !isNested ? getAlignmentOptionsConfig(state, intl, editorAnalyticsAPI, getEditorContainerWidth, editorView, shouldUseIncreasedScalingPercent, areAnyNewToolbarFlagsEnabled, options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
428
- var cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor);
429
- var columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor) : [];
449
+ var isLimitedModeEnabled = (_api$limitedMode$shar = api === null || api === void 0 || (_api$limitedMode = api.limitedMode) === null || _api$limitedMode === void 0 || (_api$limitedMode = _api$limitedMode.sharedState.currentState()) === null || _api$limitedMode === void 0 ? void 0 : _api$limitedMode.enabled) !== null && _api$limitedMode$shar !== void 0 ? _api$limitedMode$shar : false;
450
+ var cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, options === null || options === void 0 ? void 0 : options.isCommentEditor, isLimitedModeEnabled);
451
+ var columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, editorView, intl, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options === null || options === void 0 ? void 0 : options.isCommentEditor, isLimitedModeEnabled) : [];
430
452
  var colorPicker = !areAnyNewToolbarFlagsEnabled ? getColorPicker(state, menu, intl, editorAnalyticsAPI, getEditorView) : [];
431
453
 
432
454
  // Check if we need to show confirm dialog for delete button
@@ -584,11 +606,12 @@ var getCellItems = function getCellItems(state, view, _ref3, getEditorContainerW
584
606
  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
585
607
  var shouldUseIncreasedScalingPercent = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
586
608
  var isCommentEditor = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
609
+ var isLimitedModeEnabled = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
587
610
  var initialSelectionRect = getClosestSelectionRect(state);
588
611
  if (initialSelectionRect) {
589
612
  var cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
590
613
  formatMessage: formatMessage
591
- }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor);
614
+ }, getEditorContainerWidth, api, editorAnalyticsAPI, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isLimitedModeEnabled);
592
615
  // Ignored via go/ees005
593
616
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
594
617
  return [cellOptions, separator(cellOptions.hidden)];
@@ -616,18 +639,27 @@ var getDistributeConfig = function getDistributeConfig(getEditorContainerWidth,
616
639
  // this create the button group for distribute column and also fixed column width
617
640
  // fixed column button should be in this function call in the future
618
641
  var getColumnSettingItems = function getColumnSettingItems(editorState, editorView, _ref4, getEditorContainerWidth, api, editorAnalyticsAPI) {
619
- var _newResizeStateWithAn2, _pluginState$pluginCo3;
642
+ var _pluginState$pluginCo3;
620
643
  var formatMessage = _ref4.formatMessage;
621
644
  var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
622
645
  var isTableFixedColumnWidthsOptionEnabled = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
623
646
  var isCommentEditor = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
647
+ var isLimitedModeEnabled = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : false;
624
648
  var pluginState = getPluginState(editorState);
625
649
  var selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
626
650
  if (!selectionOrTableRect || !editorView) {
627
651
  return [];
628
652
  }
629
- var newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
630
- var wouldChange = (_newResizeStateWithAn2 = newResizeStateWithAnalytics === null || newResizeStateWithAnalytics === void 0 ? void 0 : newResizeStateWithAnalytics.changed) !== null && _newResizeStateWithAn2 !== void 0 ? _newResizeStateWithAn2 : false;
653
+ var wouldChange = true; // Default to enabled - show the button.
654
+ var newResizeStateWithAnalytics;
655
+
656
+ // Performance optimization: Skip expensive getTableScalingPercent() DOM query when limited mode is enabled.
657
+ // This avoids layout reflows on every transaction. Instead, button stays enabled and calculates on-demand when clicked.
658
+ if (!expValEquals('cc_editor_limited_mode_table_align_bttn', 'isEnabled', true) || !isLimitedModeEnabled) {
659
+ var _newResizeStateWithAn3, _newResizeStateWithAn4;
660
+ newResizeStateWithAnalytics = getNewResizeStateFromSelectedColumns(selectionOrTableRect, editorState, editorView.domAtPos.bind(editorView), getEditorContainerWidth, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, isCommentEditor);
661
+ wouldChange = (_newResizeStateWithAn3 = (_newResizeStateWithAn4 = newResizeStateWithAnalytics) === null || _newResizeStateWithAn4 === void 0 ? void 0 : _newResizeStateWithAn4.changed) !== null && _newResizeStateWithAn3 !== void 0 ? _newResizeStateWithAn3 : false;
662
+ }
631
663
  var items = [];
632
664
  if (pluginState !== null && pluginState !== void 0 && (_pluginState$pluginCo3 = pluginState.pluginConfig) !== null && _pluginState$pluginCo3 !== void 0 && _pluginState$pluginCo3.allowDistributeColumns && pluginState.isDragAndDropEnabled) {
633
665
  items.push({
@@ -6,6 +6,6 @@ import { Rect } from '@atlaskit/editor-tables/table-map';
6
6
  import type { TablePluginOptions } from '../tablePluginType';
7
7
  import type { PluginConfig, PluginInjectionAPI, ToolbarMenuConfig, ToolbarMenuContext, ToolbarMenuState } from '../types';
8
8
  export declare const getToolbarMenuConfig: (config: ToolbarMenuConfig, state: ToolbarMenuState, { formatMessage }: ToolbarMenuContext, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingWithFixedColumnWidthsOptionShown?: boolean, areTableColumnWidthsFixed?: boolean) => FloatingToolbarItem<Command>;
9
- export declare const getToolbarCellOptionsConfig: (editorState: EditorState, editorView: EditorView | undefined | null, initialSelectionRect: Rect, { formatMessage }: ToolbarMenuContext, getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => FloatingToolbarDropdown<Command>;
9
+ export declare const getToolbarCellOptionsConfig: (editorState: EditorState, editorView: EditorView | undefined | null, initialSelectionRect: Rect, { formatMessage }: ToolbarMenuContext, getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isLimitedModeEnabled?: boolean) => FloatingToolbarDropdown<Command>;
10
10
  export declare const getClosestSelectionRect: (state: EditorState) => Rect | undefined;
11
11
  export declare const getToolbarConfig: (getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, getEditorView: () => EditorView | null, options?: TablePluginOptions, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => (config: PluginConfig) => FloatingToolbarHandler;
@@ -6,6 +6,6 @@ import { Rect } from '@atlaskit/editor-tables/table-map';
6
6
  import type { TablePluginOptions } from '../tablePluginType';
7
7
  import type { PluginConfig, PluginInjectionAPI, ToolbarMenuConfig, ToolbarMenuContext, ToolbarMenuState } from '../types';
8
8
  export declare const getToolbarMenuConfig: (config: ToolbarMenuConfig, state: ToolbarMenuState, { formatMessage }: ToolbarMenuContext, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingWithFixedColumnWidthsOptionShown?: boolean, areTableColumnWidthsFixed?: boolean) => FloatingToolbarItem<Command>;
9
- export declare const getToolbarCellOptionsConfig: (editorState: EditorState, editorView: EditorView | undefined | null, initialSelectionRect: Rect, { formatMessage }: ToolbarMenuContext, getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => FloatingToolbarDropdown<Command>;
9
+ export declare const getToolbarCellOptionsConfig: (editorState: EditorState, editorView: EditorView | undefined | null, initialSelectionRect: Rect, { formatMessage }: ToolbarMenuContext, getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isLimitedModeEnabled?: boolean) => FloatingToolbarDropdown<Command>;
10
10
  export declare const getClosestSelectionRect: (state: EditorState) => Rect | undefined;
11
11
  export declare const getToolbarConfig: (getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, getEditorView: () => EditorView | null, options?: TablePluginOptions, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => (config: PluginConfig) => FloatingToolbarHandler;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-table",
3
- "version": "15.3.14",
3
+ "version": "15.3.15",
4
4
  "description": "Table plugin for the @atlaskit/editor",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -59,7 +59,7 @@
59
59
  "@atlaskit/primitives": "^16.1.0",
60
60
  "@atlaskit/react-ufo": "^4.14.0",
61
61
  "@atlaskit/theme": "^21.0.0",
62
- "@atlaskit/tmp-editor-statsig": "^13.32.0",
62
+ "@atlaskit/tmp-editor-statsig": "^13.33.0",
63
63
  "@atlaskit/toggle": "^15.1.0",
64
64
  "@atlaskit/tokens": "^8.0.0",
65
65
  "@atlaskit/tooltip": "^20.8.0",
@@ -72,7 +72,7 @@
72
72
  "uuid": "^3.1.0"
73
73
  },
74
74
  "peerDependencies": {
75
- "@atlaskit/editor-common": "^110.24.0",
75
+ "@atlaskit/editor-common": "^110.25.0",
76
76
  "react": "^18.2.0",
77
77
  "react-dom": "^18.2.0",
78
78
  "react-intl-next": "npm:react-intl@^5.18.1"