@atlaskit/editor-plugin-table 15.2.1 → 15.2.2
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 +8 -0
- package/dist/cjs/nodeviews/TableComponentLegacy.js +18 -34
- package/dist/cjs/nodeviews/TableComponentNext.js +19 -34
- package/dist/cjs/nodeviews/TableContainer.js +31 -215
- package/dist/cjs/nodeviews/TableResizer.js +3 -10
- package/dist/cjs/nodeviews/table.js +1 -2
- package/dist/cjs/nodeviews/toDOM.js +9 -27
- package/dist/cjs/pm-plugins/main.js +0 -31
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +1 -2
- package/dist/cjs/ui/TableFloatingControls/NumberColumn/index.js +5 -8
- package/dist/es2019/nodeviews/TableComponentLegacy.js +9 -25
- package/dist/es2019/nodeviews/TableComponentNext.js +10 -25
- package/dist/es2019/nodeviews/TableContainer.js +9 -190
- package/dist/es2019/nodeviews/TableResizer.js +3 -10
- package/dist/es2019/nodeviews/table.js +1 -2
- package/dist/es2019/nodeviews/toDOM.js +9 -28
- package/dist/es2019/pm-plugins/main.js +1 -32
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +1 -2
- package/dist/es2019/ui/TableFloatingControls/NumberColumn/index.js +2 -5
- package/dist/esm/nodeviews/TableComponentLegacy.js +18 -34
- package/dist/esm/nodeviews/TableComponentNext.js +19 -34
- package/dist/esm/nodeviews/TableContainer.js +31 -215
- package/dist/esm/nodeviews/TableResizer.js +3 -10
- package/dist/esm/nodeviews/table.js +1 -2
- package/dist/esm/nodeviews/toDOM.js +10 -28
- package/dist/esm/pm-plugins/main.js +1 -32
- package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +1 -2
- package/dist/esm/ui/TableFloatingControls/NumberColumn/index.js +5 -8
- package/dist/types/nodeviews/TableContainer.d.ts +1 -3
- package/dist/types-ts4.5/nodeviews/TableContainer.d.ts +1 -3
- package/package.json +4 -4
|
@@ -7,8 +7,6 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
|
|
|
7
7
|
import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
8
8
|
import { akEditorDefaultLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
|
|
9
9
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
10
|
-
import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
|
|
11
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
12
10
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
13
11
|
import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
14
12
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
@@ -75,8 +73,8 @@ var AlignmentTableContainer = function AlignmentTableContainer(_ref2) {
|
|
|
75
73
|
}, [alignment]);
|
|
76
74
|
return /*#__PURE__*/React.createElement("div", {
|
|
77
75
|
"data-testid": "table-alignment-container",
|
|
78
|
-
"data-ssr-placeholder":
|
|
79
|
-
"data-ssr-placeholder-replace":
|
|
76
|
+
"data-ssr-placeholder": "table-".concat(node.attrs.localId),
|
|
77
|
+
"data-ssr-placeholder-replace": "table-".concat(node.attrs.localId)
|
|
80
78
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
81
79
|
,
|
|
82
80
|
style: style
|
|
@@ -92,8 +90,8 @@ var AlignmentTableContainerWrapper = function AlignmentTableContainerWrapper(_re
|
|
|
92
90
|
if (!isTableAlignmentEnabled) {
|
|
93
91
|
return /*#__PURE__*/React.createElement("div", {
|
|
94
92
|
"data-testid": "table-alignment-container",
|
|
95
|
-
"data-ssr-placeholder":
|
|
96
|
-
"data-ssr-placeholder-replace":
|
|
93
|
+
"data-ssr-placeholder": "table-".concat(node.attrs.localId),
|
|
94
|
+
"data-ssr-placeholder-replace": "table-".concat(node.attrs.localId),
|
|
97
95
|
style: {
|
|
98
96
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
99
97
|
display: 'flex',
|
|
@@ -120,7 +118,7 @@ var getPadding = function getPadding(containerWidth) {
|
|
|
120
118
|
exposure: true
|
|
121
119
|
}) ? akEditorGutterPaddingReduced : akEditorGutterPaddingDynamic();
|
|
122
120
|
};
|
|
123
|
-
var
|
|
121
|
+
export var ResizableTableContainer = /*#__PURE__*/React.memo(function (_ref4) {
|
|
124
122
|
var children = _ref4.children,
|
|
125
123
|
className = _ref4.className,
|
|
126
124
|
node = _ref4.node,
|
|
@@ -137,7 +135,9 @@ var ResizableTableContainerLegacy = /*#__PURE__*/React.memo(function (_ref4) {
|
|
|
137
135
|
isTableWithFixedColumnWidthsOptionEnabled = _ref4.isTableWithFixedColumnWidthsOptionEnabled,
|
|
138
136
|
isTableAlignmentEnabled = _ref4.isTableAlignmentEnabled,
|
|
139
137
|
shouldUseIncreasedScalingPercent = _ref4.shouldUseIncreasedScalingPercent,
|
|
140
|
-
isCommentEditor = _ref4.isCommentEditor
|
|
138
|
+
isCommentEditor = _ref4.isCommentEditor,
|
|
139
|
+
isChromelessEditor = _ref4.isChromelessEditor;
|
|
140
|
+
var tableWidth = getTableContainerWidth(node);
|
|
141
141
|
var containerRef = useRef(null);
|
|
142
142
|
var tableWidthRef = useRef(akEditorDefaultLayoutWidth);
|
|
143
143
|
var _useState = useState(false),
|
|
@@ -201,186 +201,6 @@ var ResizableTableContainerLegacy = /*#__PURE__*/React.memo(function (_ref4) {
|
|
|
201
201
|
var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
|
|
202
202
|
return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
|
|
203
203
|
}, [pluginInjectionApi]);
|
|
204
|
-
var tableWidth = getTableContainerWidth(node);
|
|
205
|
-
var responsiveContainerWidth = 0;
|
|
206
|
-
var resizeHandleSpacing = 12;
|
|
207
|
-
var padding = getPadding(containerWidth);
|
|
208
|
-
// When Full width editor enabled, a Mac OS user can change "ak-editor-content-area" width by
|
|
209
|
-
// updating Settings -> Appearance -> Show scroll bars from "When scrolling" to "Always". It causes
|
|
210
|
-
// issues when viwport width is less than full width Editor's width. To detect avoid them
|
|
211
|
-
// we need to use lineLength to defined responsiveWidth instead of containerWidth
|
|
212
|
-
// (which does not get updated when Mac setting changes) in Full-width editor.
|
|
213
|
-
if (isFullWidthModeEnabled) {
|
|
214
|
-
// When: Show scroll bars -> containerWidth = akEditorGutterPadding * 2 + lineLength;
|
|
215
|
-
// When: Always -> containerWidth = akEditorGutterPadding * 2 + lineLength + scrollbarWidth;
|
|
216
|
-
// scrollbarWidth can vary. Values can be 14, 15, 16 and up to 20px;
|
|
217
|
-
responsiveContainerWidth = isTableScalingEnabled ? lineLength : containerWidth - padding * 2 - resizeHandleSpacing;
|
|
218
|
-
|
|
219
|
-
// platform_editor_table_fw_numcol_overflow_fix:
|
|
220
|
-
// lineLength is undefined on first paint → width: NaN → wrapper expands to page
|
|
221
|
-
// width. rAF col-sizing then runs before the number-column padding and
|
|
222
|
-
// the final shrink, so column widths are locked in wrong.
|
|
223
|
-
// With the flag ON, if the value isn’t finite we fall back to gutterWidth
|
|
224
|
-
// for that first frame—no flash, no premature rAF.
|
|
225
|
-
//
|
|
226
|
-
// Type clean-up comes later:
|
|
227
|
-
// 1) ship this runtime guard (quick fix, no breakage);
|
|
228
|
-
// 2) TODO: widen lineLength to `number|undefined` and remove this block.
|
|
229
|
-
if (fg('platform_editor_table_fw_numcol_overflow_fix')) {
|
|
230
|
-
if (isTableScalingEnabled && !Number.isFinite(responsiveContainerWidth)) {
|
|
231
|
-
responsiveContainerWidth = containerWidth - padding * 2 - resizeHandleSpacing;
|
|
232
|
-
}
|
|
233
|
-
}
|
|
234
|
-
} else if (isCommentEditor) {
|
|
235
|
-
responsiveContainerWidth = containerWidth - TABLE_OFFSET_IN_COMMENT_EDITOR;
|
|
236
|
-
} else {
|
|
237
|
-
// 76 is currently an accepted padding value considering the spacing for resizer handle
|
|
238
|
-
// containerWidth = width of a DIV with test id="ak-editor-fp-content-area". It is a parent of
|
|
239
|
-
// a DIV with className="ak-editor-content-area". This DIV has padding left and padding right.
|
|
240
|
-
// padding left = padding right = akEditorGutterPadding = 32
|
|
241
|
-
responsiveContainerWidth = isTableScalingEnabled ? containerWidth - padding * 2 : containerWidth - padding * 2 - resizeHandleSpacing;
|
|
242
|
-
}
|
|
243
|
-
// Fix for HOT-119925: Ensure table width is properly constrained and responsive
|
|
244
|
-
// For wide tables, ensure they don't exceed container width and can be scrolled
|
|
245
|
-
var calculatedWidth = !node.attrs.width && isCommentEditor ? responsiveContainerWidth : Math.min(tableWidth, responsiveContainerWidth);
|
|
246
|
-
|
|
247
|
-
// Ensure minimum width for usability while respecting container constraints
|
|
248
|
-
var width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
|
|
249
|
-
if (!isResizing) {
|
|
250
|
-
tableWidthRef.current = width;
|
|
251
|
-
}
|
|
252
|
-
var maxResizerWidth = isCommentEditor ? responsiveContainerWidth : Math.min(responsiveContainerWidth, TABLE_MAX_WIDTH);
|
|
253
|
-
var tableResizerProps = {
|
|
254
|
-
width: width,
|
|
255
|
-
maxWidth: maxResizerWidth,
|
|
256
|
-
containerWidth: containerWidth,
|
|
257
|
-
lineLength: lineLength,
|
|
258
|
-
updateWidth: updateWidth,
|
|
259
|
-
editorView: editorView,
|
|
260
|
-
getPos: getPos,
|
|
261
|
-
node: node,
|
|
262
|
-
tableRef: tableRef,
|
|
263
|
-
displayGuideline: displayGuideline,
|
|
264
|
-
attachAnalyticsEvent: attachAnalyticsEvent,
|
|
265
|
-
displayGapCursor: displayGapCursor,
|
|
266
|
-
isTableAlignmentEnabled: isTableAlignmentEnabled,
|
|
267
|
-
isFullWidthModeEnabled: isFullWidthModeEnabled,
|
|
268
|
-
isTableScalingEnabled: isTableScalingEnabled,
|
|
269
|
-
isTableWithFixedColumnWidthsOptionEnabled: isTableWithFixedColumnWidthsOptionEnabled,
|
|
270
|
-
isWholeTableInDanger: isWholeTableInDanger,
|
|
271
|
-
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
|
|
272
|
-
pluginInjectionApi: pluginInjectionApi,
|
|
273
|
-
onResizeStart: onResizeStart,
|
|
274
|
-
onResizeStop: onResizeStop,
|
|
275
|
-
isCommentEditor: isCommentEditor
|
|
276
|
-
};
|
|
277
|
-
var isLivePageViewMode = mode === 'view';
|
|
278
|
-
return /*#__PURE__*/React.createElement(AlignmentTableContainerWrapper, {
|
|
279
|
-
isTableAlignmentEnabled: isTableAlignmentEnabled,
|
|
280
|
-
node: node,
|
|
281
|
-
pluginInjectionApi: pluginInjectionApi,
|
|
282
|
-
getPos: getPos,
|
|
283
|
-
editorView: editorView
|
|
284
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
285
|
-
style: {
|
|
286
|
-
width: tableWidthRef.current,
|
|
287
|
-
height: resizing ? updateContainerHeight(tableWrapperHeight !== null && tableWrapperHeight !== void 0 ? tableWrapperHeight : 'auto') : 'auto',
|
|
288
|
-
position: isLivePageViewMode ? 'relative' : 'unset'
|
|
289
|
-
}
|
|
290
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
291
|
-
,
|
|
292
|
-
className: ClassName.TABLE_RESIZER_CONTAINER,
|
|
293
|
-
ref: containerRef
|
|
294
|
-
}, /*#__PURE__*/React.createElement(TableResizer, _extends({}, tableResizerProps, {
|
|
295
|
-
disabled: isLivePageViewMode
|
|
296
|
-
}), /*#__PURE__*/React.createElement(InnerContainer, {
|
|
297
|
-
className: className,
|
|
298
|
-
node: node
|
|
299
|
-
}, children))));
|
|
300
|
-
});
|
|
301
|
-
var ResizableTableContainerNext = /*#__PURE__*/React.memo(function (_ref5) {
|
|
302
|
-
var children = _ref5.children,
|
|
303
|
-
className = _ref5.className,
|
|
304
|
-
node = _ref5.node,
|
|
305
|
-
containerWidth = _ref5.containerWidth,
|
|
306
|
-
lineLength = _ref5.lineLength,
|
|
307
|
-
editorView = _ref5.editorView,
|
|
308
|
-
getPos = _ref5.getPos,
|
|
309
|
-
tableRef = _ref5.tableRef,
|
|
310
|
-
isResizing = _ref5.isResizing,
|
|
311
|
-
pluginInjectionApi = _ref5.pluginInjectionApi,
|
|
312
|
-
tableWrapperHeight = _ref5.tableWrapperHeight,
|
|
313
|
-
isWholeTableInDanger = _ref5.isWholeTableInDanger,
|
|
314
|
-
isTableScalingEnabled = _ref5.isTableScalingEnabled,
|
|
315
|
-
isTableWithFixedColumnWidthsOptionEnabled = _ref5.isTableWithFixedColumnWidthsOptionEnabled,
|
|
316
|
-
isTableAlignmentEnabled = _ref5.isTableAlignmentEnabled,
|
|
317
|
-
shouldUseIncreasedScalingPercent = _ref5.shouldUseIncreasedScalingPercent,
|
|
318
|
-
isCommentEditor = _ref5.isCommentEditor,
|
|
319
|
-
isChromelessEditor = _ref5.isChromelessEditor;
|
|
320
|
-
var tableWidth = getTableContainerWidth(node);
|
|
321
|
-
var containerRef = useRef(null);
|
|
322
|
-
var tableWidthRef = useRef(akEditorDefaultLayoutWidth);
|
|
323
|
-
var _useState3 = useState(false),
|
|
324
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
325
|
-
resizing = _useState4[0],
|
|
326
|
-
setIsResizing = _useState4[1];
|
|
327
|
-
var _useSharedPluginState3 = useSharedPluginStateWithSelector(pluginInjectionApi, ['table', 'editorViewMode'], selector),
|
|
328
|
-
tableState = _useSharedPluginState3.tableState,
|
|
329
|
-
editorViewModeState = _useSharedPluginState3.editorViewModeState;
|
|
330
|
-
var isFullWidthModeEnabled = tableState === null || tableState === void 0 ? void 0 : tableState.isFullWidthModeEnabled;
|
|
331
|
-
var mode = editorViewModeState === null || editorViewModeState === void 0 ? void 0 : editorViewModeState.mode;
|
|
332
|
-
var updateContainerHeight = useCallback(function (height) {
|
|
333
|
-
var _containerRef$current3;
|
|
334
|
-
// current StickyHeader State is not stable to be fetch.
|
|
335
|
-
// we need to update stickyHeader plugin to make sure state can be
|
|
336
|
-
// consistently fetch and refactor below
|
|
337
|
-
var stickyHeaders = (_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getElementsByClassName('pm-table-sticky');
|
|
338
|
-
if (!stickyHeaders || stickyHeaders.length < 1) {
|
|
339
|
-
// when starting to drag, we need to keep the original space,
|
|
340
|
-
// -- When sticky header not appear, margin top(24px) and margin bottom(16px), should be 40px,
|
|
341
|
-
// 1px is border width but collapse make it 0.5.
|
|
342
|
-
// -- When sticky header appear, we should add first row height but reduce
|
|
343
|
-
// collapsed border
|
|
344
|
-
return typeof height === 'number' ? "".concat(height + 40.5, "px") : 'auto';
|
|
345
|
-
} else {
|
|
346
|
-
var _containerRef$current4;
|
|
347
|
-
var stickyHeaderHeight = ((_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.getElementsByTagName('th')[0].getBoundingClientRect().height) || 0;
|
|
348
|
-
return typeof height === 'number' ? "".concat(height + stickyHeaderHeight + 39.5, "px") : 'auto';
|
|
349
|
-
}
|
|
350
|
-
}, []);
|
|
351
|
-
var onResizeStart = useCallback(function () {
|
|
352
|
-
setIsResizing(true);
|
|
353
|
-
}, []);
|
|
354
|
-
var onResizeStop = useCallback(function () {
|
|
355
|
-
setIsResizing(false);
|
|
356
|
-
}, []);
|
|
357
|
-
var updateWidth = useCallback(function (width) {
|
|
358
|
-
if (!containerRef.current) {
|
|
359
|
-
return;
|
|
360
|
-
}
|
|
361
|
-
|
|
362
|
-
// make sure during resizing
|
|
363
|
-
// the pm-table-resizer-container width is the same as its child div resizer-item
|
|
364
|
-
// otherwise when resize table from wider to narrower , pm-table-resizer-container stays wider
|
|
365
|
-
// and cause the fabric-editor-popup-scroll-parent to overflow
|
|
366
|
-
if (containerRef.current.style.width !== "".concat(width, "px")) {
|
|
367
|
-
containerRef.current.style.width = "".concat(width, "px");
|
|
368
|
-
}
|
|
369
|
-
}, []);
|
|
370
|
-
var displayGuideline = useCallback(function (guidelines) {
|
|
371
|
-
var _pluginInjectionApi$g3, _pluginInjectionApi$g4;
|
|
372
|
-
return (_pluginInjectionApi$g3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$g4 = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g4 === void 0 || (_pluginInjectionApi$g4 = _pluginInjectionApi$g4.actions) === null || _pluginInjectionApi$g4 === void 0 ? void 0 : _pluginInjectionApi$g4.displayGuideline(editorView)({
|
|
373
|
-
guidelines: guidelines
|
|
374
|
-
})) !== null && _pluginInjectionApi$g3 !== void 0 ? _pluginInjectionApi$g3 : false;
|
|
375
|
-
}, [pluginInjectionApi, editorView]);
|
|
376
|
-
var attachAnalyticsEvent = useCallback(function (payload) {
|
|
377
|
-
var _pluginInjectionApi$a3;
|
|
378
|
-
return pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions.attachAnalyticsEvent(payload);
|
|
379
|
-
}, [pluginInjectionApi]);
|
|
380
|
-
var displayGapCursor = useCallback(function (toggle) {
|
|
381
|
-
var _pluginInjectionApi$c3, _pluginInjectionApi$c4, _pluginInjectionApi$s2;
|
|
382
|
-
return (_pluginInjectionApi$c3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c4 = pluginInjectionApi.core) === null || _pluginInjectionApi$c4 === void 0 ? void 0 : _pluginInjectionApi$c4.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s2 = pluginInjectionApi.selection) === null || _pluginInjectionApi$s2 === void 0 ? void 0 : _pluginInjectionApi$s2.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c3 !== void 0 ? _pluginInjectionApi$c3 : false;
|
|
383
|
-
}, [pluginInjectionApi]);
|
|
384
204
|
var isFullPageAppearance = !isCommentEditor && !isChromelessEditor;
|
|
385
205
|
var _useMemo = useMemo(function () {
|
|
386
206
|
var responsiveContainerWidth = 0;
|
|
@@ -510,32 +330,28 @@ var ResizableTableContainerNext = /*#__PURE__*/React.memo(function (_ref5) {
|
|
|
510
330
|
node: node
|
|
511
331
|
}, children))));
|
|
512
332
|
});
|
|
513
|
-
export var
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
isTableAlignmentEnabled = _ref6.isTableAlignmentEnabled,
|
|
536
|
-
shouldUseIncreasedScalingPercent = _ref6.shouldUseIncreasedScalingPercent,
|
|
537
|
-
isCommentEditor = _ref6.isCommentEditor,
|
|
538
|
-
isChromelessEditor = _ref6.isChromelessEditor;
|
|
333
|
+
export var TableContainer = function TableContainer(_ref5) {
|
|
334
|
+
var children = _ref5.children,
|
|
335
|
+
node = _ref5.node,
|
|
336
|
+
className = _ref5.className,
|
|
337
|
+
_ref5$containerWidth = _ref5.containerWidth,
|
|
338
|
+
editorWidth = _ref5$containerWidth.width,
|
|
339
|
+
lineLength = _ref5$containerWidth.lineLength,
|
|
340
|
+
editorView = _ref5.editorView,
|
|
341
|
+
getPos = _ref5.getPos,
|
|
342
|
+
tableRef = _ref5.tableRef,
|
|
343
|
+
isNested = _ref5.isNested,
|
|
344
|
+
tableWrapperHeight = _ref5.tableWrapperHeight,
|
|
345
|
+
isResizing = _ref5.isResizing,
|
|
346
|
+
pluginInjectionApi = _ref5.pluginInjectionApi,
|
|
347
|
+
isWholeTableInDanger = _ref5.isWholeTableInDanger,
|
|
348
|
+
isTableResizingEnabled = _ref5.isTableResizingEnabled,
|
|
349
|
+
isTableScalingEnabled = _ref5.isTableScalingEnabled,
|
|
350
|
+
isTableWithFixedColumnWidthsOptionEnabled = _ref5.isTableWithFixedColumnWidthsOptionEnabled,
|
|
351
|
+
isTableAlignmentEnabled = _ref5.isTableAlignmentEnabled,
|
|
352
|
+
shouldUseIncreasedScalingPercent = _ref5.shouldUseIncreasedScalingPercent,
|
|
353
|
+
isCommentEditor = _ref5.isCommentEditor,
|
|
354
|
+
isChromelessEditor = _ref5.isChromelessEditor;
|
|
539
355
|
if (isTableResizingEnabled && !isNested) {
|
|
540
356
|
return /*#__PURE__*/React.createElement(ResizableTableContainer
|
|
541
357
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
@@ -568,7 +384,7 @@ export var TableContainer = function TableContainer(_ref6) {
|
|
|
568
384
|
var _getPluginState = getPluginState(editorView.state),
|
|
569
385
|
isDragAndDropEnabled = _getPluginState.isDragAndDropEnabled;
|
|
570
386
|
var isFullPageAppearance = !isCommentEditor && !isChromelessEditor;
|
|
571
|
-
var resizableTableWidth =
|
|
387
|
+
var resizableTableWidth = isFullPageAppearance ? getTableResizerContainerForFullPageWidthInCSS(node, isTableScalingEnabled) : "calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2))";
|
|
572
388
|
return /*#__PURE__*/React.createElement(InnerContainer, {
|
|
573
389
|
node: node
|
|
574
390
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
@@ -409,15 +409,8 @@ export var TableResizer = function TableResizer(_ref) {
|
|
|
409
409
|
}, [editorView, getPos, node, isCommentEditor, widthToWidest, isToolbarAIFCEnabled, endMeasure, displayGapCursor, displayGuideline, updateWidth, scheduleResize, onResizeStop, pluginInjectionApi, attachAnalyticsEvent, tableRef, isTableScalingEnabled, shouldUseIncreasedScalingPercent, formatMessage]);
|
|
410
410
|
var handleTableSizeChangeOnKeypress = useCallback(function (step) {
|
|
411
411
|
var newWidth = width + step;
|
|
412
|
-
if (
|
|
413
|
-
|
|
414
|
-
return;
|
|
415
|
-
}
|
|
416
|
-
} else {
|
|
417
|
-
// maxWidth when platform_editor_tables_scaling_css off is always a number
|
|
418
|
-
if (newWidth > maxWidth || newWidth < resizerMinWidth) {
|
|
419
|
-
return;
|
|
420
|
-
}
|
|
412
|
+
if (newWidth < resizerMinWidth) {
|
|
413
|
+
return;
|
|
421
414
|
}
|
|
422
415
|
handleResizeStop({
|
|
423
416
|
width: width,
|
|
@@ -428,7 +421,7 @@ export var TableResizer = function TableResizer(_ref) {
|
|
|
428
421
|
width: step,
|
|
429
422
|
height: 0
|
|
430
423
|
});
|
|
431
|
-
}, [width, handleResizeStop,
|
|
424
|
+
}, [width, handleResizeStop, resizerMinWidth]);
|
|
432
425
|
var handleEscape = useCallback(function () {
|
|
433
426
|
editorView === null || editorView === void 0 || editorView.focus();
|
|
434
427
|
}, [editorView]);
|
|
@@ -16,7 +16,6 @@ import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
|
|
|
16
16
|
import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
17
17
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
18
18
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
19
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
20
19
|
import { pluginConfig as getPluginConfig } from '../pm-plugins/create-plugin-config';
|
|
21
20
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
22
21
|
import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
|
|
@@ -142,7 +141,7 @@ var TableView = /*#__PURE__*/function (_ReactNodeView) {
|
|
|
142
141
|
if (this.view.state.selection.visible) {
|
|
143
142
|
selectionBookmark = this.view.state.selection.getBookmark();
|
|
144
143
|
}
|
|
145
|
-
if (this.dom
|
|
144
|
+
if (this.dom) {
|
|
146
145
|
this.dom.setAttribute('data-ssr-placeholder', "table-nodeview-".concat(this.node.attrs.localId));
|
|
147
146
|
this.dom.setAttribute('data-ssr-placeholder-replace', "table-nodeview-".concat(this.node.attrs.localId));
|
|
148
147
|
}
|
|
@@ -6,10 +6,8 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
6
6
|
import kebabCase from 'lodash/kebabCase';
|
|
7
7
|
import { table, tableWithNestedTable } from '@atlaskit/adf-schema';
|
|
8
8
|
import { convertToInlineCss } from '@atlaskit/editor-common/lazy-node-view';
|
|
9
|
-
import { akEditorGutterPaddingDynamic } from '@atlaskit/editor-shared-styles';
|
|
10
9
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
11
|
-
import {
|
|
12
|
-
import { generateColgroup, generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
10
|
+
import { generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
13
11
|
import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils/consts';
|
|
14
12
|
import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS, getTableResizerItemWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
|
|
15
13
|
import { getAlignmentStyle } from './table-container-styles';
|
|
@@ -17,16 +15,6 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
|
|
|
17
15
|
var tableNode = config.isNestingSupported ? tableWithNestedTable : table;
|
|
18
16
|
return _objectSpread(_objectSpread({}, tableNode), {}, {
|
|
19
17
|
toDOM: function toDOM(node) {
|
|
20
|
-
var _node$attrs$width;
|
|
21
|
-
var gutterPadding = function gutterPadding() {
|
|
22
|
-
if (editorExperiment('platform_editor_preview_panel_responsiveness', true, {
|
|
23
|
-
exposure: true
|
|
24
|
-
})) {
|
|
25
|
-
return 'calc(var(--ak-editor--large-gutter-padding) * 2)';
|
|
26
|
-
} else {
|
|
27
|
-
return "".concat(akEditorGutterPaddingDynamic() * 2, "px");
|
|
28
|
-
}
|
|
29
|
-
};
|
|
30
18
|
var alignmentStyle = Object.entries(getAlignmentStyle(node.attrs.layout)).map(function (_ref) {
|
|
31
19
|
var _ref2 = _slicedToArray(_ref, 2),
|
|
32
20
|
k = _ref2[0],
|
|
@@ -34,29 +22,23 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
|
|
|
34
22
|
return "".concat(kebabCase(k), ": ").concat(kebabCase(v));
|
|
35
23
|
}).join(';');
|
|
36
24
|
var tableMinWidth = getResizerMinWidth(node);
|
|
37
|
-
var tableWidthAttribute = node.attrs.width ? "".concat(node.attrs.width, "px") : "100%";
|
|
38
25
|
var isFullPageEditor = !config.isChromelessEditor && !config.isCommentEditor;
|
|
39
|
-
var attrs =
|
|
26
|
+
var attrs = {
|
|
40
27
|
'data-number-column': node.attrs.isNumberColumnEnabled,
|
|
41
28
|
'data-layout': node.attrs.layout,
|
|
42
29
|
'data-autosize': node.attrs.__autoSize,
|
|
43
30
|
'data-table-local-id': node.attrs.localId,
|
|
44
|
-
'data-table-width': node.attrs.width
|
|
45
|
-
}, expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true) && {
|
|
31
|
+
'data-table-width': node.attrs.width,
|
|
46
32
|
'data-ssr-placeholder': "table-".concat(node.attrs.localId),
|
|
47
33
|
'data-ssr-placeholder-replace': "table-".concat(node.attrs.localId)
|
|
48
|
-
}
|
|
34
|
+
};
|
|
49
35
|
|
|
50
36
|
// This would be used for table scaling in colgroup CSS
|
|
51
37
|
// cqw, or px is well supported
|
|
52
|
-
var resizableTableWidth =
|
|
38
|
+
var resizableTableWidth = isFullPageEditor ? getTableResizerContainerForFullPageWidthInCSS(node, config.isTableScalingEnabled) : "calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2))";
|
|
53
39
|
var colgroup = '';
|
|
54
40
|
if (config.allowColumnResizing) {
|
|
55
|
-
|
|
56
|
-
colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroupFromNode(node, config.isCommentEditor, config.isChromelessEditor, config.isNested, config.isTableScalingEnabled, config.shouldUseIncreasedScalingPercent)));
|
|
57
|
-
} else {
|
|
58
|
-
colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroup(node)));
|
|
59
|
-
}
|
|
41
|
+
colgroup = ['colgroup', {}].concat(_toConsumableArray(generateColgroupFromNode(node, config.isCommentEditor, config.isChromelessEditor, config.isNested, config.isTableScalingEnabled, config.shouldUseIncreasedScalingPercent)));
|
|
60
42
|
}
|
|
61
43
|
|
|
62
44
|
// For Chromeless editor, and nested tables in full page editor
|
|
@@ -105,7 +87,7 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
|
|
|
105
87
|
'data-testid': 'sticky-sentinel-bottom'
|
|
106
88
|
}]];
|
|
107
89
|
var tableContainerDiv = expValEquals('platform_editor_disable_table_overflow_shadows', 'cohort', 'variant1') || expValEquals('platform_editor_disable_table_overflow_shadows', 'cohort', 'variant2') || expValEquals('platform_editor_disable_table_overflow_shadows', 'cohort', 'variant3') ? tableContainerDivNext : tableContainerDivLegacy;
|
|
108
|
-
if (!config.tableResizingEnabled ||
|
|
90
|
+
if (!config.tableResizingEnabled || config.isNested) {
|
|
109
91
|
return ['div', {
|
|
110
92
|
class: 'tableView-content-wrap',
|
|
111
93
|
'data-prosemirror-initial-toDOM-render': 'true',
|
|
@@ -122,7 +104,7 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
|
|
|
122
104
|
style: convertToInlineCss({
|
|
123
105
|
'--ak-editor-table-gutter-padding': config.isTableScalingEnabled ? 'calc(var(--ak-editor--large-gutter-padding) * 2)' : 'calc(var(--ak-editor--large-gutter-padding) * 2 - var(--ak-editor-resizer-handle-spacing))',
|
|
124
106
|
'--ak-editor-table-width': resizableTableWidth,
|
|
125
|
-
width:
|
|
107
|
+
width: "var(--ak-editor-table-width)"
|
|
126
108
|
})
|
|
127
109
|
}, ['div', {
|
|
128
110
|
class: 'resizer-item display-handle',
|
|
@@ -133,8 +115,8 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
|
|
|
133
115
|
'--ak-editor-table-max-width': "".concat(TABLE_MAX_WIDTH, "px"),
|
|
134
116
|
'--ak-editor-table-min-width': "".concat(tableMinWidth, "px"),
|
|
135
117
|
minWidth: 'var(--ak-editor-table-min-width)',
|
|
136
|
-
maxWidth:
|
|
137
|
-
width:
|
|
118
|
+
maxWidth: getTableResizerContainerMaxWidthInCSS(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),
|
|
119
|
+
width: getTableResizerItemWidthInCSS(node, config.isCommentEditor, config.isChromelessEditor)
|
|
138
120
|
})
|
|
139
121
|
}, ['span', {
|
|
140
122
|
class: 'resizer-hover-zone'
|
|
@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
2
2
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
3
|
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; }
|
|
4
4
|
import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
5
|
-
import { insideTable
|
|
5
|
+
import { insideTable } from '@atlaskit/editor-common/core-utils';
|
|
6
6
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
7
7
|
import { transformSliceToRemoveOpenBodiedExtension, transformSliceToRemoveOpenExpand, transformSliceToRemoveOpenLayoutNodes, transformSliceToRemoveOpenMultiBodiedExtension, transformSliceToRemoveOpenNestedExpand } from '@atlaskit/editor-common/transforms';
|
|
8
8
|
import { browser, closestElement } from '@atlaskit/editor-common/utils';
|
|
@@ -10,7 +10,6 @@ import { findParentDomRefOfType, findParentNodeOfType } from '@atlaskit/editor-p
|
|
|
10
10
|
import { TableMap } from '@atlaskit/editor-tables';
|
|
11
11
|
import { findTable } from '@atlaskit/editor-tables/utils';
|
|
12
12
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
14
13
|
import { tableCellView, tableHeaderView, tableRowView, tableView } from '../nodeviews/table-node-views';
|
|
15
14
|
import { pluginKey as decorationsPluginKey } from '../pm-plugins/decorations/plugin';
|
|
16
15
|
import { TableCssClassName as ClassName } from '../types';
|
|
@@ -54,36 +53,6 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
|
|
|
54
53
|
return editorView.state;
|
|
55
54
|
};
|
|
56
55
|
var getNodeView = function getNodeView() {
|
|
57
|
-
// Because the layout shift issues has been fixed under experiment platform_editor_tables_scaling_css, so still want to load nodeview on SSR if experiment is enabled
|
|
58
|
-
if (expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)) {
|
|
59
|
-
return {
|
|
60
|
-
table: tableView({
|
|
61
|
-
portalProviderAPI: portalProviderAPI,
|
|
62
|
-
eventDispatcher: eventDispatcher,
|
|
63
|
-
getEditorContainerWidth: getEditorContainerWidth,
|
|
64
|
-
getEditorFeatureFlags: getEditorFeatureFlags,
|
|
65
|
-
dispatchAnalyticsEvent: dispatchAnalyticsEvent,
|
|
66
|
-
pluginInjectionApi: pluginInjectionApi,
|
|
67
|
-
isCommentEditor: isCommentEditor,
|
|
68
|
-
isChromelessEditor: isChromelessEditor
|
|
69
|
-
}),
|
|
70
|
-
tableRow: tableRowView({
|
|
71
|
-
eventDispatcher: eventDispatcher,
|
|
72
|
-
pluginInjectionApi: pluginInjectionApi
|
|
73
|
-
}),
|
|
74
|
-
tableCell: tableCellView({
|
|
75
|
-
eventDispatcher: eventDispatcher,
|
|
76
|
-
pluginInjectionApi: pluginInjectionApi
|
|
77
|
-
}),
|
|
78
|
-
tableHeader: tableHeaderView({
|
|
79
|
-
eventDispatcher: eventDispatcher,
|
|
80
|
-
pluginInjectionApi: pluginInjectionApi
|
|
81
|
-
})
|
|
82
|
-
};
|
|
83
|
-
}
|
|
84
|
-
if (isSSR()) {
|
|
85
|
-
return undefined;
|
|
86
|
-
}
|
|
87
56
|
return {
|
|
88
57
|
table: tableView({
|
|
89
58
|
portalProviderAPI: portalProviderAPI,
|
|
@@ -4,7 +4,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
4
4
|
import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
5
5
|
import { tableCellMinWidth, tableNewColumnMinWidth } from '@atlaskit/editor-common/styles';
|
|
6
6
|
import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
|
|
7
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
8
7
|
import { getSelectedTableInfo } from '../../utils/analytics';
|
|
9
8
|
import { getColWidthFix, hasTableBeenResized, insertColgroupFromNode } from './colgroup';
|
|
10
9
|
import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
|
|
@@ -95,7 +94,7 @@ export var getResizeState = function getResizeState(_ref) {
|
|
|
95
94
|
|
|
96
95
|
// updates Colgroup DOM node with new widths
|
|
97
96
|
export var updateColgroup = function updateColgroup(state, tableRef, tableNode, isTableScalingEnabled, scalePercent) {
|
|
98
|
-
var cols =
|
|
97
|
+
var cols = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelectorAll(':scope > colgroup > col');
|
|
99
98
|
var columnsCount = cols === null || cols === void 0 ? void 0 : cols.length;
|
|
100
99
|
/**
|
|
101
100
|
updateColgroup will update whole table scale when click the column resize handle, this behavior will affect when table overflowed, when now resize handle been dragged and extend to make table overflowed, table will show overflow. This need to be confirmed because it conflict with how isTableScalingEnabled work.
|
|
@@ -4,8 +4,6 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
|
|
|
4
4
|
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/inherits";
|
|
6
6
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
7
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
8
|
-
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; }
|
|
9
7
|
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
|
|
10
8
|
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
11
9
|
import React, { Component } from 'react';
|
|
@@ -13,7 +11,6 @@ import classnames from 'classnames';
|
|
|
13
11
|
import { isSSR } from '@atlaskit/editor-common/core-utils';
|
|
14
12
|
import { Selection } from '@atlaskit/editor-prosemirror/state';
|
|
15
13
|
import { isRowSelected } from '@atlaskit/editor-tables/utils';
|
|
16
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
17
14
|
import { clearHoverSelection } from '../../../pm-plugins/commands';
|
|
18
15
|
import { getRowHeights } from '../../../pm-plugins/utils/row-controls';
|
|
19
16
|
import { TableCssClassName as ClassName } from '../../../types';
|
|
@@ -104,7 +101,7 @@ var NumberColumn = /*#__PURE__*/function (_Component) {
|
|
|
104
101
|
tableActive = _this$props5.tableActive,
|
|
105
102
|
updateCellHoverLocation = _this$props5.updateCellHoverLocation;
|
|
106
103
|
var rowHeights = getRowHeights(tableRef);
|
|
107
|
-
if (isSSR()
|
|
104
|
+
if (isSSR()) {
|
|
108
105
|
return /*#__PURE__*/React.createElement("div", {
|
|
109
106
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
110
107
|
className: ClassName.NUMBERED_COLUMN,
|
|
@@ -123,15 +120,15 @@ var NumberColumn = /*#__PURE__*/function (_Component) {
|
|
|
123
120
|
return /*#__PURE__*/React.createElement("div", {
|
|
124
121
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
|
|
125
122
|
className: ClassName.NUMBERED_COLUMN,
|
|
126
|
-
style:
|
|
123
|
+
style: {
|
|
127
124
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
128
125
|
marginTop: hasHeaderRow && this.props.stickyTop !== undefined ? rowHeights[0] : undefined,
|
|
129
126
|
borderLeft:
|
|
130
127
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
131
|
-
isDragAndDropEnabled && tableActive ? "1px solid ".concat(tableBorderColor) : undefined
|
|
132
|
-
|
|
128
|
+
isDragAndDropEnabled && tableActive ? "1px solid ".concat(tableBorderColor) : undefined,
|
|
129
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
|
|
133
130
|
visibility: 'visible'
|
|
134
|
-
}
|
|
131
|
+
},
|
|
135
132
|
contentEditable: false
|
|
136
133
|
}, rowHeights.map(function (rowHeight, index) {
|
|
137
134
|
return isDragAndDropEnabled ?
|
|
@@ -23,9 +23,7 @@ type ResizableTableContainerProps = {
|
|
|
23
23
|
tableRef: HTMLTableElement;
|
|
24
24
|
tableWrapperHeight?: number;
|
|
25
25
|
};
|
|
26
|
-
export declare const ResizableTableContainer: React.
|
|
27
|
-
children?: React.ReactNode | undefined;
|
|
28
|
-
}>;
|
|
26
|
+
export declare const ResizableTableContainer: React.MemoExoticComponent<({ children, className, node, containerWidth, lineLength, editorView, getPos, tableRef, isResizing, pluginInjectionApi, tableWrapperHeight, isWholeTableInDanger, isTableScalingEnabled, isTableWithFixedColumnWidthsOptionEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, }: PropsWithChildren<ResizableTableContainerProps>) => React.JSX.Element>;
|
|
29
27
|
type TableContainerProps = {
|
|
30
28
|
className: string;
|
|
31
29
|
containerWidth: EditorContainerWidth;
|
|
@@ -23,9 +23,7 @@ type ResizableTableContainerProps = {
|
|
|
23
23
|
tableRef: HTMLTableElement;
|
|
24
24
|
tableWrapperHeight?: number;
|
|
25
25
|
};
|
|
26
|
-
export declare const ResizableTableContainer: React.
|
|
27
|
-
children?: React.ReactNode | undefined;
|
|
28
|
-
}>;
|
|
26
|
+
export declare const ResizableTableContainer: React.MemoExoticComponent<({ children, className, node, containerWidth, lineLength, editorView, getPos, tableRef, isResizing, pluginInjectionApi, tableWrapperHeight, isWholeTableInDanger, isTableScalingEnabled, isTableWithFixedColumnWidthsOptionEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, }: PropsWithChildren<ResizableTableContainerProps>) => React.JSX.Element>;
|
|
29
27
|
type TableContainerProps = {
|
|
30
28
|
className: string;
|
|
31
29
|
containerWidth: EditorContainerWidth;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "15.2.
|
|
3
|
+
"version": "15.2.2",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -59,10 +59,10 @@
|
|
|
59
59
|
"@atlaskit/primitives": "^16.0.0",
|
|
60
60
|
"@atlaskit/react-ufo": "^4.12.0",
|
|
61
61
|
"@atlaskit/theme": "^21.0.0",
|
|
62
|
-
"@atlaskit/tmp-editor-statsig": "^13.
|
|
62
|
+
"@atlaskit/tmp-editor-statsig": "^13.15.0",
|
|
63
63
|
"@atlaskit/toggle": "^15.1.0",
|
|
64
64
|
"@atlaskit/tokens": "^7.0.0",
|
|
65
|
-
"@atlaskit/tooltip": "^20.
|
|
65
|
+
"@atlaskit/tooltip": "^20.6.0",
|
|
66
66
|
"@babel/runtime": "^7.0.0",
|
|
67
67
|
"@emotion/react": "^11.7.1",
|
|
68
68
|
"classnames": "^2.2.5",
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
"uuid": "^3.1.0"
|
|
73
73
|
},
|
|
74
74
|
"peerDependencies": {
|
|
75
|
-
"@atlaskit/editor-common": "^110.
|
|
75
|
+
"@atlaskit/editor-common": "^110.15.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"
|