@atlaskit/editor-plugin-table 7.6.14 → 7.7.0
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 +6 -0
- package/dist/cjs/commands/misc.js +0 -2
- package/dist/cjs/nodeviews/OverflowShadowsObserver.js +1 -3
- package/dist/cjs/nodeviews/TableComponent.js +3 -18
- package/dist/cjs/nodeviews/TableContainer.js +2 -18
- package/dist/cjs/nodeviews/table.js +0 -2
- package/dist/cjs/plugin.js +3 -20
- package/dist/cjs/pm-plugins/main.js +1 -2
- package/dist/cjs/pm-plugins/table-resizing/event-handlers.js +7 -21
- package/dist/cjs/pm-plugins/table-resizing/utils/colgroup.js +32 -57
- package/dist/cjs/pm-plugins/table-resizing/utils/misc.js +1 -2
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +16 -28
- package/dist/cjs/pm-plugins/table-resizing/utils/scale-table.js +2 -12
- package/dist/cjs/reducer.js +0 -2
- package/dist/cjs/transforms/column-width.js +3 -5
- package/dist/cjs/types.js +0 -1
- package/dist/cjs/ui/ColumnResizeWidget/index.js +5 -1
- package/dist/cjs/ui/common-styles.js +5 -12
- package/dist/cjs/ui/ui-styles.js +7 -12
- package/dist/cjs/utils/index.js +0 -6
- package/dist/cjs/utils/nodes.js +5 -18
- package/dist/es2019/commands/misc.js +0 -2
- package/dist/es2019/nodeviews/OverflowShadowsObserver.js +1 -3
- package/dist/es2019/nodeviews/TableComponent.js +3 -18
- package/dist/es2019/nodeviews/TableContainer.js +1 -16
- package/dist/es2019/nodeviews/table.js +0 -2
- package/dist/es2019/plugin.js +5 -24
- package/dist/es2019/pm-plugins/main.js +1 -2
- package/dist/es2019/pm-plugins/table-resizing/event-handlers.js +8 -22
- package/dist/es2019/pm-plugins/table-resizing/utils/colgroup.js +30 -53
- package/dist/es2019/pm-plugins/table-resizing/utils/misc.js +1 -2
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +14 -24
- package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js +2 -12
- package/dist/es2019/reducer.js +0 -5
- package/dist/es2019/transforms/column-width.js +3 -5
- package/dist/es2019/types.js +0 -1
- package/dist/es2019/ui/ColumnResizeWidget/index.js +5 -1
- package/dist/es2019/ui/common-styles.js +15 -46
- package/dist/es2019/ui/ui-styles.js +34 -41
- package/dist/es2019/utils/index.js +1 -1
- package/dist/es2019/utils/nodes.js +0 -15
- package/dist/esm/commands/misc.js +0 -2
- package/dist/esm/nodeviews/OverflowShadowsObserver.js +1 -3
- package/dist/esm/nodeviews/TableComponent.js +3 -18
- package/dist/esm/nodeviews/TableContainer.js +2 -18
- package/dist/esm/nodeviews/table.js +0 -2
- package/dist/esm/plugin.js +5 -22
- package/dist/esm/pm-plugins/main.js +1 -2
- package/dist/esm/pm-plugins/table-resizing/event-handlers.js +8 -22
- package/dist/esm/pm-plugins/table-resizing/utils/colgroup.js +32 -57
- package/dist/esm/pm-plugins/table-resizing/utils/misc.js +1 -2
- package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +16 -28
- package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js +2 -12
- package/dist/esm/reducer.js +0 -2
- package/dist/esm/transforms/column-width.js +3 -5
- package/dist/esm/types.js +0 -1
- package/dist/esm/ui/ColumnResizeWidget/index.js +5 -1
- package/dist/esm/ui/common-styles.js +6 -13
- package/dist/esm/ui/ui-styles.js +7 -12
- package/dist/esm/utils/index.js +1 -1
- package/dist/esm/utils/nodes.js +0 -13
- package/dist/types/nodeviews/TableContainer.d.ts +1 -2
- package/dist/types/nodeviews/types.d.ts +0 -1
- package/dist/types/plugin.d.ts +0 -1
- package/dist/types/pm-plugins/main.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/scale-table.d.ts +0 -1
- package/dist/types/types.d.ts +0 -9
- package/dist/types/ui/FloatingContextualButton/index.d.ts +0 -2
- package/dist/types/utils/index.d.ts +1 -1
- package/dist/types/utils/nodes.d.ts +0 -1
- package/dist/types-ts4.5/nodeviews/TableContainer.d.ts +1 -2
- package/dist/types-ts4.5/nodeviews/types.d.ts +0 -1
- package/dist/types-ts4.5/plugin.d.ts +0 -1
- package/dist/types-ts4.5/pm-plugins/main.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/scale-table.d.ts +0 -1
- package/dist/types-ts4.5/types.d.ts +0 -9
- package/dist/types-ts4.5/ui/FloatingContextualButton/index.d.ts +0 -2
- package/dist/types-ts4.5/utils/index.d.ts +1 -1
- package/dist/types-ts4.5/utils/nodes.d.ts +0 -1
- package/package.json +2 -5
- package/src/commands/misc.ts +0 -2
- package/src/nodeviews/OverflowShadowsObserver.ts +1 -6
- package/src/nodeviews/TableComponent.tsx +2 -25
- package/src/nodeviews/TableContainer.tsx +2 -26
- package/src/nodeviews/table.tsx +0 -2
- package/src/nodeviews/types.ts +0 -1
- package/src/plugin.tsx +4 -43
- package/src/pm-plugins/main.ts +0 -2
- package/src/pm-plugins/table-resizing/event-handlers.ts +8 -37
- package/src/pm-plugins/table-resizing/utils/colgroup.ts +40 -61
- package/src/pm-plugins/table-resizing/utils/misc.ts +4 -6
- package/src/pm-plugins/table-resizing/utils/resize-state.ts +18 -29
- package/src/pm-plugins/table-resizing/utils/scale-table.ts +2 -13
- package/src/reducer.ts +0 -3
- package/src/transforms/column-width.ts +2 -10
- package/src/types.ts +0 -8
- package/src/ui/ColumnResizeWidget/index.tsx +10 -1
- package/src/ui/FloatingContextualButton/index.tsx +0 -2
- package/src/ui/common-styles.ts +15 -53
- package/src/ui/ui-styles.ts +34 -47
- package/src/utils/index.ts +0 -1
- package/src/utils/nodes.ts +0 -23
- package/dist/cjs/ui/LayoutButton/index.js +0 -206
- package/dist/es2019/ui/LayoutButton/index.js +0 -168
- package/dist/esm/ui/LayoutButton/index.js +0 -196
- package/dist/types/ui/LayoutButton/index.d.ts +0 -21
- package/dist/types-ts4.5/ui/LayoutButton/index.d.ts +0 -21
- package/src/ui/LayoutButton/index.tsx +0 -217
|
@@ -296,7 +296,7 @@ export const OverflowShadow = isDragAndDropEnabled => css`
|
|
|
296
296
|
${"var(--ds-shadow-overflow-perimeter, transparent)"} 0px,
|
|
297
297
|
transparent 1px
|
|
298
298
|
);
|
|
299
|
-
left:
|
|
299
|
+
left: calc(100% - ${tableOverflowShadowWidthWide}px);
|
|
300
300
|
}
|
|
301
301
|
.${ClassName.WITH_CONTROLS} {
|
|
302
302
|
${overflowShadowWidhoutDnD(isDragAndDropEnabled)}
|
|
@@ -346,24 +346,24 @@ const columnHeaderButtonSelected = () => css({
|
|
|
346
346
|
zIndex: columnControlsSelectedZIndex
|
|
347
347
|
});
|
|
348
348
|
const getFloatingDotOverrides = () => {
|
|
349
|
-
return
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
349
|
+
return css`
|
|
350
|
+
tr
|
|
351
|
+
th:last-child
|
|
352
|
+
.${ClassName.COLUMN_CONTROLS_DECORATIONS}::before,
|
|
353
|
+
tr
|
|
354
|
+
td:last-child
|
|
355
|
+
.${ClassName.COLUMN_CONTROLS_DECORATIONS}::before {
|
|
356
|
+
content: '';
|
|
357
|
+
background-color: ${tableBorderColor};
|
|
358
|
+
position: absolute;
|
|
359
|
+
height: ${lineMarkerSize}px;
|
|
360
|
+
width: ${lineMarkerSize}px;
|
|
361
|
+
border-radius: 50%;
|
|
362
|
+
pointer-events: none;
|
|
363
|
+
top: ${"var(--ds-space-025, 2px)"};
|
|
364
|
+
right: 0px;
|
|
365
|
+
}
|
|
366
|
+
`;
|
|
367
367
|
};
|
|
368
368
|
export const floatingColumnControls = () => {
|
|
369
369
|
return css`
|
|
@@ -647,27 +647,6 @@ export const hoveredWarningCell = css`
|
|
|
647
647
|
}
|
|
648
648
|
`;
|
|
649
649
|
|
|
650
|
-
// move the resize handle zone completely inside the table cell to avoid overflow
|
|
651
|
-
const getLastColumnResizerOverrides = () => {
|
|
652
|
-
return getBooleanFF('platform.editor.custom-table-width') ? css`
|
|
653
|
-
tr
|
|
654
|
-
th:last-child
|
|
655
|
-
.${ClassName.RESIZE_HANDLE_DECORATION},
|
|
656
|
-
tr
|
|
657
|
-
td:last-child
|
|
658
|
-
.${ClassName.RESIZE_HANDLE_DECORATION} {
|
|
659
|
-
background-color: transparent;
|
|
660
|
-
position: absolute;
|
|
661
|
-
width: ${resizeHandlerAreaWidth / 2}px;
|
|
662
|
-
height: 100%;
|
|
663
|
-
top: 0;
|
|
664
|
-
right: 0;
|
|
665
|
-
cursor: col-resize;
|
|
666
|
-
z-index: ${resizeHandlerZIndex};
|
|
667
|
-
}
|
|
668
|
-
` : '';
|
|
669
|
-
};
|
|
670
|
-
|
|
671
650
|
// Explicit pixel values required here to ensure correct positioning and sizes of column resize handle
|
|
672
651
|
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
673
652
|
const resizeHandleOverrides = isDragAndDropEnabled => {
|
|
@@ -757,7 +736,21 @@ export const resizeHandle = isDragAndDropEnabled => css`
|
|
|
757
736
|
z-index: ${resizeHandlerZIndex};
|
|
758
737
|
}
|
|
759
738
|
|
|
760
|
-
|
|
739
|
+
tr
|
|
740
|
+
th:last-child
|
|
741
|
+
.${ClassName.RESIZE_HANDLE_DECORATION},
|
|
742
|
+
tr
|
|
743
|
+
td:last-child
|
|
744
|
+
.${ClassName.RESIZE_HANDLE_DECORATION} {
|
|
745
|
+
background-color: transparent;
|
|
746
|
+
position: absolute;
|
|
747
|
+
width: ${resizeHandlerAreaWidth / 2}px;
|
|
748
|
+
height: 100%;
|
|
749
|
+
top: 0;
|
|
750
|
+
right: 0;
|
|
751
|
+
cursor: col-resize;
|
|
752
|
+
z-index: ${resizeHandlerZIndex};
|
|
753
|
+
}
|
|
761
754
|
|
|
762
755
|
${resizeHandleOverrides(isDragAndDropEnabled)}
|
|
763
756
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { getSelectedColumnIndexes, getSelectedRowIndexes, normalizeSelection, isSelectionUpdated } from './selection';
|
|
2
2
|
export { findControlsHoverDecoration, createControlsHoverDecoration, createColumnControlsDecoration, createColumnSelectedDecoration, createCellHoverDecoration, updateDecorations, createResizeHandleDecoration, createColumnInsertLine, createColumnLineResize, createRowInsertLine } from './decoration';
|
|
3
|
-
export { isIsolating, containsHeaderColumn, containsHeaderRow, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColumnEnabled,
|
|
3
|
+
export { isIsolating, containsHeaderColumn, containsHeaderRow, checkIfHeaderColumnEnabled, checkIfHeaderRowEnabled, checkIfNumberColumnEnabled, getTableWidth, tablesHaveDifferentColumnWidths, tablesHaveDifferentNoOfColumns, isTableNested, anyChildCellMergedAcrossRow, supportedHeaderRow } from './nodes';
|
|
4
4
|
export { unwrapContentFromTable, removeTableFromFirstChild, removeTableFromLastChild, transformSliceToRemoveOpenTable, transformSliceToCorrectEmptyTableCells, transformSliceToFixHardBreakProblemOnCopyFromCell } from './paste';
|
|
5
5
|
export { isCell, isCornerButton, isInsertRowButton, isColumnControlsDecorations, isTableControlsButton, isTableContainerOrWrapper, isRowControlsButton, isDragRowControlsButton, isDragColumnFloatingInsertDot, isDragRowFloatingInsertDot, isDragCornerButton, getColumnOrRowIndex, getMousePositionHorizontalRelativeByElement, getMousePositionVerticalRelativeByElement, isResizeHandleDecoration, hasResizeHandler, findNearestCellIndexToPoint } from './dom';
|
|
6
6
|
export { convertHTMLCellIndexToColumnIndex, getColumnsWidths, isColumnDeleteButtonVisible, getColumnDeleteButtonParams, getColumnClassNames, getColumnIndexMappedToColumnIndexInFirstRow } from './column-controls';
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import { mapChildren } from '@atlaskit/editor-common/utils';
|
|
2
|
-
import { hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
|
|
3
2
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
4
3
|
import { findTable } from '@atlaskit/editor-tables/utils';
|
|
5
|
-
import { pluginKey } from '../pm-plugins/plugin-key';
|
|
6
4
|
export const isIsolating = node => {
|
|
7
5
|
return !!node.type.spec.isolating;
|
|
8
6
|
};
|
|
@@ -40,19 +38,6 @@ export const containsHeaderRow = table => {
|
|
|
40
38
|
export const checkIfHeaderColumnEnabled = selection => filterNearSelection(selection, findTable, containsHeaderColumn, false);
|
|
41
39
|
export const checkIfHeaderRowEnabled = selection => filterNearSelection(selection, findTable, containsHeaderRow, false);
|
|
42
40
|
export const checkIfNumberColumnEnabled = selection => filterNearSelection(selection, findTable, table => !!table.attrs.isNumberColumnEnabled, false);
|
|
43
|
-
export const isLayoutSupported = state => {
|
|
44
|
-
var _pluginKey$getState;
|
|
45
|
-
const {
|
|
46
|
-
permittedLayouts
|
|
47
|
-
} = ((_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pluginConfig) || {};
|
|
48
|
-
const {
|
|
49
|
-
bodiedExtension,
|
|
50
|
-
layoutSection,
|
|
51
|
-
expand,
|
|
52
|
-
extensionFrame
|
|
53
|
-
} = state.schema.nodes;
|
|
54
|
-
return !hasParentNodeOfType([expand, layoutSection, bodiedExtension, extensionFrame])(state.selection) && !!permittedLayouts && (permittedLayouts === 'all' || permittedLayouts.indexOf('default') > -1 && permittedLayouts.indexOf('wide') > -1 && permittedLayouts.indexOf('full-width') > -1);
|
|
55
|
-
};
|
|
56
41
|
export const getTableWidth = node => {
|
|
57
42
|
return getTableWidths(node).reduce((acc, current) => acc + current, 0);
|
|
58
43
|
};
|
|
@@ -31,7 +31,6 @@ export var setTableRef = function setTableRef(ref) {
|
|
|
31
31
|
var tableNode = ref && foundTable ? foundTable.node : undefined;
|
|
32
32
|
var tablePos = ref && foundTable ? foundTable.pos : undefined;
|
|
33
33
|
var tableWrapperTarget = closestElement(tableRef, ".".concat(ClassName.TABLE_NODE_WRAPPER)) || undefined;
|
|
34
|
-
var layout = tableNode ? tableNode.attrs.layout : undefined;
|
|
35
34
|
var _getPluginState = getPluginState(state),
|
|
36
35
|
isDragAndDropEnabled = _getPluginState.isDragAndDropEnabled;
|
|
37
36
|
return {
|
|
@@ -41,7 +40,6 @@ export var setTableRef = function setTableRef(ref) {
|
|
|
41
40
|
tableNode: tableNode,
|
|
42
41
|
tablePos: tablePos,
|
|
43
42
|
tableWrapperTarget: tableWrapperTarget,
|
|
44
|
-
layout: layout || 'default',
|
|
45
43
|
isNumberColumnEnabled: checkIfNumberColumnEnabled(state.selection),
|
|
46
44
|
isHeaderRowEnabled: checkIfHeaderRowEnabled(state.selection),
|
|
47
45
|
isHeaderColumnEnabled: checkIfHeaderColumnEnabled(state.selection),
|
|
@@ -2,9 +2,7 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
|
2
2
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
4
|
import rafSchedule from 'raf-schd';
|
|
5
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
6
5
|
import { TableCssClassName as ClassName, ShadowEvent } from '../types';
|
|
7
|
-
import { tableInsertColumnButtonSize } from '../ui/consts';
|
|
8
6
|
import { updateShadowListForStickyStyles } from './update-overflow-shadows';
|
|
9
7
|
export var OverflowShadowsObserver = /*#__PURE__*/function () {
|
|
10
8
|
// updateShadowState is a method to update shadow key
|
|
@@ -36,7 +34,7 @@ export var OverflowShadowsObserver = /*#__PURE__*/function () {
|
|
|
36
34
|
}, {
|
|
37
35
|
threshold: [0, 1],
|
|
38
36
|
root: _this.wrapper,
|
|
39
|
-
rootMargin:
|
|
37
|
+
rootMargin: '0px'
|
|
40
38
|
});
|
|
41
39
|
return;
|
|
42
40
|
}
|
|
@@ -128,16 +128,12 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
128
128
|
var node = getNode();
|
|
129
129
|
var prevAttrs = prevNode.attrs;
|
|
130
130
|
var isNested = isTableNested(_this.props.view.state, _this.props.getPos());
|
|
131
|
-
// We only consider a layout change valid if it's done outside of an autoSize.
|
|
132
|
-
var layoutChanged = prevAttrs.layout !== node.attrs.layout && prevAttrs.__autoSize === node.attrs.__autoSize;
|
|
133
131
|
var parentWidth = _this.getParentNodeWidth();
|
|
134
132
|
var parentWidthChanged = parentWidth && parentWidth !== _this.state.parentWidth;
|
|
135
133
|
var layoutSize = _this.tableNodeLayoutSize(node, containerWidth.width, options);
|
|
136
134
|
var hasNumberedColumnChanged = prevAttrs.isNumberColumnEnabled !== node.attrs.isNumberColumnEnabled;
|
|
137
135
|
var noOfColumnsChanged = tablesHaveDifferentNoOfColumns(node, prevNode);
|
|
138
136
|
if (
|
|
139
|
-
// Breakout mode/layout changed
|
|
140
|
-
layoutChanged ||
|
|
141
137
|
// We need to react if our parent changes
|
|
142
138
|
// Scales the cols widths relative to the new parent width.
|
|
143
139
|
parentWidthChanged ||
|
|
@@ -151,8 +147,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
151
147
|
// If column has been inserted/deleted avoid multi dispatch
|
|
152
148
|
if (shouldScaleTable) {
|
|
153
149
|
_this.scaleTable({
|
|
154
|
-
parentWidth: parentWidth
|
|
155
|
-
layoutChanged: layoutChanged
|
|
150
|
+
parentWidth: parentWidth
|
|
156
151
|
});
|
|
157
152
|
}
|
|
158
153
|
|
|
@@ -160,8 +155,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
160
155
|
if (options !== null && options !== void 0 && options.isTableResizingEnabled && hasNumberedColumnChanged) {
|
|
161
156
|
if (!hasTableBeenResized(prevNode)) {
|
|
162
157
|
_this.scaleTable({
|
|
163
|
-
parentWidth: node.attrs.width
|
|
164
|
-
layoutChanged: layoutChanged
|
|
158
|
+
parentWidth: node.attrs.width
|
|
165
159
|
});
|
|
166
160
|
}
|
|
167
161
|
}
|
|
@@ -239,21 +233,16 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
239
233
|
}
|
|
240
234
|
});
|
|
241
235
|
_defineProperty(_assertThisInitialized(_this), "handleWindowResize", function () {
|
|
242
|
-
var _node$attrs, _node$attrs2;
|
|
243
236
|
var _this$props5 = _this.props,
|
|
244
237
|
getNode = _this$props5.getNode,
|
|
245
238
|
containerWidth = _this$props5.containerWidth;
|
|
246
239
|
var node = getNode();
|
|
247
|
-
var prevNode = _this.node;
|
|
248
240
|
var layoutSize = _this.tableNodeLayoutSize(node);
|
|
249
|
-
var prevAttrs = prevNode === null || prevNode === void 0 ? void 0 : prevNode.attrs;
|
|
250
|
-
var layoutChanged = (prevAttrs === null || prevAttrs === void 0 ? void 0 : prevAttrs.layout) !== (node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.layout) && (prevAttrs === null || prevAttrs === void 0 ? void 0 : prevAttrs.__autoSize) === (node === null || node === void 0 || (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.__autoSize);
|
|
251
241
|
if (containerWidth.width > layoutSize) {
|
|
252
242
|
return;
|
|
253
243
|
}
|
|
254
244
|
var parentWidth = _this.getParentNodeWidth();
|
|
255
245
|
_this.scaleTableDebounced({
|
|
256
|
-
layoutChanged: layoutChanged,
|
|
257
246
|
parentWidth: parentWidth
|
|
258
247
|
});
|
|
259
248
|
});
|
|
@@ -706,7 +695,6 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
706
695
|
node: node,
|
|
707
696
|
tableRef: tableRef,
|
|
708
697
|
containerWidth: containerWidth,
|
|
709
|
-
isBreakoutEnabled: options === null || options === void 0 ? void 0 : options.isBreakoutEnabled,
|
|
710
698
|
isNested: isNested,
|
|
711
699
|
pluginInjectionApi: pluginInjectionApi,
|
|
712
700
|
tableWrapperHeight: this.state.tableWrapperHeight,
|
|
@@ -777,10 +765,7 @@ var TableComponent = /*#__PURE__*/function (_React$Component) {
|
|
|
777
765
|
}), this.state.stickyHeader && /*#__PURE__*/React.createElement("div", {
|
|
778
766
|
style: {
|
|
779
767
|
position: 'absolute',
|
|
780
|
-
right:
|
|
781
|
-
:
|
|
782
|
-
// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
|
|
783
|
-
'22px'
|
|
768
|
+
right: "var(--ds-space-400, 32px)" // tableOverflowShadowWidthWide
|
|
784
769
|
}
|
|
785
770
|
}, /*#__PURE__*/React.createElement("div", {
|
|
786
771
|
className: "".concat(ClassName.TABLE_RIGHT_SHADOW, " ").concat(ClassName.TABLE_STICKY_SHADOW),
|
|
@@ -6,22 +6,11 @@ import React, { forwardRef, useCallback, useRef, useState } from 'react';
|
|
|
6
6
|
import classNames from 'classnames';
|
|
7
7
|
import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
|
|
8
8
|
import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
9
|
-
import { calcTableWidth } from '@atlaskit/editor-common/styles';
|
|
10
9
|
import { akEditorDefaultLayoutWidth, akEditorGutterPadding, akEditorMediaResizeHandlerPaddingWide, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
|
|
11
10
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
12
11
|
import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils';
|
|
13
12
|
import { TableCssClassName as ClassName } from '../types';
|
|
14
13
|
import { TableResizer } from './TableResizer';
|
|
15
|
-
var getMarginLeft = function getMarginLeft(lineLength, tableWidth) {
|
|
16
|
-
var marginLeft;
|
|
17
|
-
if (tableWidth !== 'inherit' && lineLength) {
|
|
18
|
-
var containerWidth = tableWidth;
|
|
19
|
-
if (containerWidth) {
|
|
20
|
-
marginLeft = (lineLength - containerWidth) / 2;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
return marginLeft;
|
|
24
|
-
};
|
|
25
14
|
export var InnerContainer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
26
15
|
var className = _ref.className,
|
|
27
16
|
style = _ref.style,
|
|
@@ -164,11 +153,8 @@ export var TableContainer = function TableContainer(_ref3) {
|
|
|
164
153
|
var children = _ref3.children,
|
|
165
154
|
node = _ref3.node,
|
|
166
155
|
className = _ref3.className,
|
|
167
|
-
|
|
168
|
-
lineLength = _ref3$containerWidth.lineLength,
|
|
169
|
-
editorWidth = _ref3$containerWidth.width,
|
|
156
|
+
editorWidth = _ref3.containerWidth.width,
|
|
170
157
|
isTableResizingEnabled = _ref3.isTableResizingEnabled,
|
|
171
|
-
isBreakoutEnabled = _ref3.isBreakoutEnabled,
|
|
172
158
|
editorView = _ref3.editorView,
|
|
173
159
|
getPos = _ref3.getPos,
|
|
174
160
|
tableRef = _ref3.tableRef,
|
|
@@ -193,15 +179,13 @@ export var TableContainer = function TableContainer(_ref3) {
|
|
|
193
179
|
isWholeTableInDanger: isWholeTableInDanger
|
|
194
180
|
}, children);
|
|
195
181
|
}
|
|
196
|
-
var tableWidth = isBreakoutEnabled ? calcTableWidth(node.attrs.layout, editorWidth) : 'inherit';
|
|
197
182
|
return /*#__PURE__*/React.createElement(InnerContainer, {
|
|
198
183
|
node: node,
|
|
199
184
|
className: classNames(className, {
|
|
200
185
|
'less-padding': editorWidth < akEditorMobileBreakoutPoint && !isNested
|
|
201
186
|
}),
|
|
202
187
|
style: {
|
|
203
|
-
width:
|
|
204
|
-
marginLeft: getMarginLeft(lineLength, tableWidth)
|
|
188
|
+
width: 'inherit'
|
|
205
189
|
}
|
|
206
190
|
}, children);
|
|
207
191
|
};
|
|
@@ -273,7 +273,6 @@ export { TableView as default };
|
|
|
273
273
|
export var createTableView = function createTableView(node, view, getPos, portalProviderAPI, eventDispatcher, getEditorContainerWidth, getEditorFeatureFlags, dispatchAnalyticsEvent, pluginInjectionApi) {
|
|
274
274
|
var _getPluginState2 = getPluginState(view.state),
|
|
275
275
|
pluginConfig = _getPluginState2.pluginConfig,
|
|
276
|
-
isBreakoutEnabled = _getPluginState2.isBreakoutEnabled,
|
|
277
276
|
isFullWidthModeEnabled = _getPluginState2.isFullWidthModeEnabled,
|
|
278
277
|
wasFullWidthModeEnabled = _getPluginState2.wasFullWidthModeEnabled,
|
|
279
278
|
isTableResizingEnabled = _getPluginState2.isTableResizingEnabled,
|
|
@@ -292,7 +291,6 @@ export var createTableView = function createTableView(node, view, getPos, portal
|
|
|
292
291
|
eventDispatcher: eventDispatcher,
|
|
293
292
|
getPos: getPos,
|
|
294
293
|
options: {
|
|
295
|
-
isBreakoutEnabled: isBreakoutEnabled,
|
|
296
294
|
isFullWidthModeEnabled: isFullWidthModeEnabled,
|
|
297
295
|
wasFullWidthModeEnabled: wasFullWidthModeEnabled,
|
|
298
296
|
isTableResizingEnabled: isTableResizingEnabled,
|
package/dist/esm/plugin.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { table, tableCell, tableHeader, tableRow
|
|
2
|
+
import { table, tableCell, tableHeader, tableRow } from '@atlaskit/adf-schema';
|
|
3
3
|
import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, TABLE_ACTION } from '@atlaskit/editor-common/analytics';
|
|
4
4
|
import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
|
|
5
5
|
import { IconTable } from '@atlaskit/editor-common/icons';
|
|
@@ -33,8 +33,7 @@ import FloatingContextualMenu from './ui/FloatingContextualMenu';
|
|
|
33
33
|
import FloatingDeleteButton from './ui/FloatingDeleteButton';
|
|
34
34
|
import FloatingDragMenu from './ui/FloatingDragMenu';
|
|
35
35
|
import FloatingInsertButton from './ui/FloatingInsertButton';
|
|
36
|
-
import
|
|
37
|
-
import { createTableWithWidth, isLayoutSupported } from './utils';
|
|
36
|
+
import { createTableWithWidth } from './utils';
|
|
38
37
|
var defaultGetEditorFeatureFlags = function defaultGetEditorFeatureFlags() {
|
|
39
38
|
return {};
|
|
40
39
|
};
|
|
@@ -110,10 +109,9 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
110
109
|
insertTableWithSize: insertTableWithSize(options === null || options === void 0 ? void 0 : options.fullWidthEnabled, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions)
|
|
111
110
|
},
|
|
112
111
|
nodes: function nodes() {
|
|
113
|
-
var tableNode = options !== null && options !== void 0 && options.tableResizingEnabled ? tableWithCustomWidth : table;
|
|
114
112
|
return [{
|
|
115
113
|
name: 'table',
|
|
116
|
-
node:
|
|
114
|
+
node: table
|
|
117
115
|
}, {
|
|
118
116
|
name: 'tableHeader',
|
|
119
117
|
node: tableHeader
|
|
@@ -138,12 +136,11 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
138
136
|
fullWidthEnabled = _ref3.fullWidthEnabled,
|
|
139
137
|
wasFullWidthEnabled = _ref3.wasFullWidthEnabled,
|
|
140
138
|
tableResizingEnabled = _ref3.tableResizingEnabled,
|
|
141
|
-
breakoutEnabled = _ref3.breakoutEnabled,
|
|
142
139
|
tableOptions = _ref3.tableOptions,
|
|
143
140
|
getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
|
|
144
141
|
dragAndDropEnabled = _ref3.dragAndDropEnabled,
|
|
145
142
|
isTableScalingEnabled = _ref3.isTableScalingEnabled;
|
|
146
|
-
return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl,
|
|
143
|
+
return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled);
|
|
147
144
|
}
|
|
148
145
|
}, {
|
|
149
146
|
name: 'tablePMColResizing',
|
|
@@ -305,7 +302,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
305
302
|
tablePluginState = _ref17.tablePluginState,
|
|
306
303
|
tableWidthPluginState = _ref17.tableWidthPluginState,
|
|
307
304
|
dragAndDropState = _ref17.dragAndDropState;
|
|
308
|
-
var state = editorView.state;
|
|
309
305
|
var isColumnResizing = resizingPluginState === null || resizingPluginState === void 0 ? void 0 : resizingPluginState.dragging;
|
|
310
306
|
var isTableResizing = tableWidthPluginState === null || tableWidthPluginState === void 0 ? void 0 : tableWidthPluginState.resizing;
|
|
311
307
|
var isResizing = isColumnResizing || isTableResizing;
|
|
@@ -314,7 +310,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
314
310
|
tablePos = _ref18.tablePos,
|
|
315
311
|
targetCellPosition = _ref18.targetCellPosition,
|
|
316
312
|
isContextualMenuOpen = _ref18.isContextualMenuOpen,
|
|
317
|
-
layout = _ref18.layout,
|
|
318
313
|
tableRef = _ref18.tableRef,
|
|
319
314
|
pluginConfig = _ref18.pluginConfig,
|
|
320
315
|
insertColumnButtonIndex = _ref18.insertColumnButtonIndex,
|
|
@@ -325,17 +320,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
325
320
|
tableWrapperTarget = _ref18.tableWrapperTarget;
|
|
326
321
|
var allowControls = pluginConfig.allowControls;
|
|
327
322
|
var stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePos) : undefined;
|
|
328
|
-
var LayoutContent = options && !options.tableResizingEnabled && isLayoutSupported(state) && options.breakoutEnabled ? /*#__PURE__*/React.createElement(LayoutButton, {
|
|
329
|
-
editorView: editorView,
|
|
330
|
-
mountPoint: popupsMountPoint,
|
|
331
|
-
boundariesElement: popupsBoundariesElement,
|
|
332
|
-
scrollableElement: popupsScrollableElement,
|
|
333
|
-
targetRef: tableWrapperTarget,
|
|
334
|
-
layout: layout,
|
|
335
|
-
isResizing: !!resizingPluginState && !!resizingPluginState.dragging,
|
|
336
|
-
stickyHeader: stickyHeader,
|
|
337
|
-
editorAnalyticsAPI: editorAnalyticsAPI
|
|
338
|
-
}) : null;
|
|
339
323
|
return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && tableRef && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
|
|
340
324
|
isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
|
|
341
325
|
editorView: editorView,
|
|
@@ -345,7 +329,6 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
345
329
|
scrollableElement: popupsScrollableElement,
|
|
346
330
|
dispatchAnalyticsEvent: dispatchAnalyticsEvent,
|
|
347
331
|
isContextualMenuOpen: isContextualMenuOpen,
|
|
348
|
-
layout: layout,
|
|
349
332
|
stickyHeader: stickyHeader,
|
|
350
333
|
tableWrapper: tableWrapperTarget
|
|
351
334
|
}), allowControls && /*#__PURE__*/React.createElement(FloatingInsertButton, {
|
|
@@ -398,7 +381,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
398
381
|
stickyHeaders: stickyHeader,
|
|
399
382
|
isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
|
|
400
383
|
editorAnalyticsAPI: editorAnalyticsAPI
|
|
401
|
-
})
|
|
384
|
+
}));
|
|
402
385
|
}
|
|
403
386
|
}));
|
|
404
387
|
},
|
|
@@ -25,7 +25,7 @@ import { isHeaderRowRequired } from '../utils/paste';
|
|
|
25
25
|
import { defaultHoveredCell, defaultTableSelection } from './default-table-selection';
|
|
26
26
|
import { createPluginState, getPluginState } from './plugin-factory';
|
|
27
27
|
import { pluginKey } from './plugin-key';
|
|
28
|
-
export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl,
|
|
28
|
+
export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled) {
|
|
29
29
|
var _accessibilityUtils;
|
|
30
30
|
var state = createPluginState(dispatch, _objectSpread(_objectSpread(_objectSpread({
|
|
31
31
|
pluginConfig: pluginConfig,
|
|
@@ -33,7 +33,6 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
|
|
|
33
33
|
insertColumnButtonIndex: undefined,
|
|
34
34
|
insertRowButtonIndex: undefined,
|
|
35
35
|
isFullWidthModeEnabled: fullWidthModeEnabled,
|
|
36
|
-
isBreakoutEnabled: breakoutEnabled,
|
|
37
36
|
wasFullWidthModeEnabled: previousFullWidthModeEnabled,
|
|
38
37
|
isTableResizingEnabled: tableResizingEnabled,
|
|
39
38
|
isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
import { ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD, TABLE_ACTION, TABLE_OVERFLOW_CHANGE_TRIGGER } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import { getParentNodeWidth } from '@atlaskit/editor-common/node-width';
|
|
3
2
|
import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
4
|
-
import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
5
3
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
6
4
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
7
5
|
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
@@ -13,7 +11,7 @@ import { getPluginState as getTablePluginState } from '../plugin-factory';
|
|
|
13
11
|
import { META_KEYS } from '../table-analytics';
|
|
14
12
|
import { evenColumns, setDragging, stopResizing } from './commands';
|
|
15
13
|
import { getPluginState } from './plugin-factory';
|
|
16
|
-
import { currentColWidth,
|
|
14
|
+
import { currentColWidth, getResizeState, getTableMaxWidth, pointsAtCell, resizeColumn, updateControls } from './utils';
|
|
17
15
|
export var handleMouseDown = function handleMouseDown(view, event, localResizeHandlePos, getEditorContainerWidth, getEditorFeatureFlags, editorAnalyticsAPI) {
|
|
18
16
|
var state = view.state,
|
|
19
17
|
dispatch = view.dispatch;
|
|
@@ -44,25 +42,13 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
|
|
|
44
42
|
if (dom && dom.nodeName !== 'TABLE') {
|
|
45
43
|
dom = dom.closest('table');
|
|
46
44
|
}
|
|
47
|
-
var maxSize
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
if (originalTable.attrs.isNumberColumnEnabled) {
|
|
55
|
-
maxSize -= akEditorTableNumberColumnWidth;
|
|
56
|
-
}
|
|
57
|
-
} else {
|
|
58
|
-
maxSize = getTableMaxWidth({
|
|
59
|
-
table: originalTable,
|
|
60
|
-
tableStart: start,
|
|
61
|
-
state: state,
|
|
62
|
-
layout: originalTable.attrs.layout,
|
|
63
|
-
getEditorContainerWidth: getEditorContainerWidth
|
|
64
|
-
});
|
|
65
|
-
}
|
|
45
|
+
var maxSize = getTableMaxWidth({
|
|
46
|
+
table: originalTable,
|
|
47
|
+
tableStart: start,
|
|
48
|
+
state: state,
|
|
49
|
+
layout: originalTable.attrs.layout,
|
|
50
|
+
getEditorContainerWidth: getEditorContainerWidth
|
|
51
|
+
});
|
|
66
52
|
var shouldScale = tableDepth === 0 && isTableScalingEnabled;
|
|
67
53
|
var resizeState = getResizeState({
|
|
68
54
|
minWidth: tableCellMinWidth,
|
|
@@ -3,7 +3,6 @@ import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
|
3
3
|
import { getFragmentBackingArray } from '@atlaskit/editor-common/utils';
|
|
4
4
|
import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
|
|
5
5
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
6
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
7
6
|
import { getTableScalingPercent } from './misc';
|
|
8
7
|
/**
|
|
9
8
|
* This ensures the combined width of the columns (and tbody) of table is always smaller or equal
|
|
@@ -16,66 +15,42 @@ export var getColWidthFix = function getColWidthFix(colwidth, tableColumnCount)
|
|
|
16
15
|
};
|
|
17
16
|
export var generateColgroup = function generateColgroup(table, tableRef) {
|
|
18
17
|
var cols = [];
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
var scalePercent = getTableScalingPercent(table, tableRef);
|
|
28
|
-
cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
|
|
29
|
-
var fixedColWidth = getColWidthFix(width, map.width);
|
|
30
|
-
var scaledWidth = fixedColWidth * scalePercent;
|
|
31
|
-
var finalWidth = Math.max(scaledWidth, tableCellMinWidth);
|
|
32
|
-
cols.push(['col', {
|
|
33
|
-
style: "width: ".concat(finalWidth, "px;")
|
|
34
|
-
}]);
|
|
35
|
-
});
|
|
36
|
-
} else {
|
|
37
|
-
cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
|
|
38
|
-
cols.push(['col', {
|
|
39
|
-
style: "width: ".concat(getColWidthFix(width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth, map.width), "px;")
|
|
40
|
-
}]);
|
|
41
|
-
});
|
|
42
|
-
}
|
|
43
|
-
} else {
|
|
44
|
-
// When we have merged cells on the first row (firstChild),
|
|
45
|
-
// We want to ensure we're creating the appropriate amount of
|
|
46
|
-
// cols the table still has.
|
|
47
|
-
cols.push.apply(cols, _toConsumableArray(Array.from({
|
|
48
|
-
length: colspan
|
|
49
|
-
}, function (_) {
|
|
50
|
-
return ['col', {
|
|
51
|
-
style: "width: ".concat(tableCellMinWidth, "px;")
|
|
52
|
-
}];
|
|
53
|
-
})));
|
|
54
|
-
}
|
|
55
|
-
});
|
|
56
|
-
} else {
|
|
57
|
-
table.content.firstChild.content.forEach(function (cell) {
|
|
58
|
-
var colspan = cell.attrs.colspan || 1;
|
|
59
|
-
if (Array.isArray(cell.attrs.colwidth)) {
|
|
60
|
-
// We slice here to guard against our colwidth array having more entries
|
|
61
|
-
// Than the we actually span. We'll patch the document at a later point.
|
|
18
|
+
var map = TableMap.get(table);
|
|
19
|
+
table.content.firstChild.content.forEach(function (cell) {
|
|
20
|
+
var colspan = cell.attrs.colspan || 1;
|
|
21
|
+
if (Array.isArray(cell.attrs.colwidth)) {
|
|
22
|
+
// We slice here to guard against our colwidth array having more entries
|
|
23
|
+
// Than the we actually span. We'll patch the document at a later point.
|
|
24
|
+
if (tableRef) {
|
|
25
|
+
var scalePercent = getTableScalingPercent(table, tableRef);
|
|
62
26
|
cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
27
|
+
var fixedColWidth = getColWidthFix(width, map.width);
|
|
28
|
+
var scaledWidth = fixedColWidth * scalePercent;
|
|
29
|
+
var finalWidth = Math.max(scaledWidth, tableCellMinWidth);
|
|
30
|
+
cols.push(['col', {
|
|
31
|
+
style: "width: ".concat(finalWidth, "px;")
|
|
32
|
+
}]);
|
|
66
33
|
});
|
|
67
34
|
} else {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
}, function (_) {
|
|
74
|
-
return ['col', {}];
|
|
75
|
-
})));
|
|
35
|
+
cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
|
|
36
|
+
cols.push(['col', {
|
|
37
|
+
style: "width: ".concat(getColWidthFix(width ? Math.max(width, tableCellMinWidth) : tableCellMinWidth, map.width), "px;")
|
|
38
|
+
}]);
|
|
39
|
+
});
|
|
76
40
|
}
|
|
77
|
-
}
|
|
78
|
-
|
|
41
|
+
} else {
|
|
42
|
+
// When we have merged cells on the first row (firstChild),
|
|
43
|
+
// We want to ensure we're creating the appropriate amount of
|
|
44
|
+
// cols the table still has.
|
|
45
|
+
cols.push.apply(cols, _toConsumableArray(Array.from({
|
|
46
|
+
length: colspan
|
|
47
|
+
}, function (_) {
|
|
48
|
+
return ['col', {
|
|
49
|
+
style: "width: ".concat(tableCellMinWidth, "px;")
|
|
50
|
+
}];
|
|
51
|
+
})));
|
|
52
|
+
}
|
|
53
|
+
});
|
|
79
54
|
return cols;
|
|
80
55
|
};
|
|
81
56
|
export var insertColgroupFromNode = function insertColgroupFromNode(tableRef, table) {
|
|
@@ -3,7 +3,6 @@ import { calcTableWidth } from '@atlaskit/editor-common/styles';
|
|
|
3
3
|
import { getBreakpoint, mapBreakpointToLayoutMaxWidth } from '@atlaskit/editor-common/ui';
|
|
4
4
|
import { calcTableColumnWidths, containsClassName } from '@atlaskit/editor-common/utils';
|
|
5
5
|
import { akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
6
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
7
6
|
import { hasTableBeenResized } from './colgroup';
|
|
8
7
|
import { MAX_SCALING_PERCENT } from './consts';
|
|
9
8
|
|
|
@@ -67,7 +66,7 @@ export var getTableMaxWidth = function getTableMaxWidth(_ref2) {
|
|
|
67
66
|
getEditorContainerWidth = _ref2.getEditorContainerWidth;
|
|
68
67
|
var containerWidth = getEditorContainerWidth();
|
|
69
68
|
var parentWidth = getParentNodeWidth(tableStart, state, containerWidth);
|
|
70
|
-
var maxWidth =
|
|
69
|
+
var maxWidth = parentWidth || table.attrs.width || getLayoutSize(layout, containerWidth.width, {});
|
|
71
70
|
if (table.attrs.isNumberColumnEnabled) {
|
|
72
71
|
maxWidth -= akEditorTableNumberColumnWidth;
|
|
73
72
|
}
|