@atlaskit/editor-plugin-table 31.0.3 → 31.0.5
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 +16 -0
- package/dist/cjs/nodeviews/TableContainer.js +1 -2
- package/dist/cjs/nodeviews/TableResizer.js +3 -4
- package/dist/cjs/nodeviews/toDOM.js +1 -1
- package/dist/cjs/pm-plugins/table-resizing/utils/misc.js +1 -2
- package/dist/cjs/pm-plugins/table-width.js +2 -3
- package/dist/cjs/pm-plugins/transforms/content-mode.js +1 -2
- package/dist/cjs/pm-plugins/utils/create.js +2 -3
- package/dist/cjs/pm-plugins/utils/snapping.js +1 -4
- package/dist/es2019/nodeviews/TableContainer.js +2 -3
- package/dist/es2019/nodeviews/TableResizer.js +4 -5
- package/dist/es2019/nodeviews/toDOM.js +2 -2
- package/dist/es2019/pm-plugins/table-resizing/utils/misc.js +2 -3
- package/dist/es2019/pm-plugins/table-width.js +3 -4
- package/dist/es2019/pm-plugins/transforms/content-mode.js +2 -3
- package/dist/es2019/pm-plugins/utils/create.js +2 -3
- package/dist/es2019/pm-plugins/utils/snapping.js +1 -4
- package/dist/esm/nodeviews/TableContainer.js +2 -3
- package/dist/esm/nodeviews/TableResizer.js +4 -5
- package/dist/esm/nodeviews/toDOM.js +2 -2
- package/dist/esm/pm-plugins/table-resizing/utils/misc.js +2 -3
- package/dist/esm/pm-plugins/table-width.js +3 -4
- package/dist/esm/pm-plugins/transforms/content-mode.js +2 -3
- package/dist/esm/pm-plugins/utils/create.js +2 -3
- package/dist/esm/pm-plugins/utils/snapping.js +1 -4
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 31.0.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 31.0.4
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`3f8ea6c51b718`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3f8ea6c51b718) -
|
|
14
|
+
Remove the rolled-out `editor_tinymce_full_width_mode` and
|
|
15
|
+
`confluence_max_width_content_appearance` experiments and make max-width content behavior
|
|
16
|
+
permanent.
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
3
19
|
## 31.0.3
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -16,7 +16,6 @@ var _nodeWidth = require("@atlaskit/editor-common/node-width");
|
|
|
16
16
|
var _resizer = require("@atlaskit/editor-common/styles/resizer");
|
|
17
17
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
18
18
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
19
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
20
19
|
var _commandsWithAnalytics = require("../pm-plugins/commands/commands-with-analytics");
|
|
21
20
|
var _colgroup = require("../pm-plugins/table-resizing/utils/colgroup");
|
|
22
21
|
var _consts = require("../pm-plugins/table-resizing/utils/consts");
|
|
@@ -258,7 +257,7 @@ var ResizableTableContainer = exports.ResizableTableContainer = /*#__PURE__*/_re
|
|
|
258
257
|
|
|
259
258
|
// Ensure minimum width for usability while respecting container constraints
|
|
260
259
|
var width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
|
|
261
|
-
var maxResizerWidth = !isFullPageAppearance ? responsiveContainerWidth : Math.min(responsiveContainerWidth,
|
|
260
|
+
var maxResizerWidth = !isFullPageAppearance ? responsiveContainerWidth : Math.min(responsiveContainerWidth, _consts.TABLE_MAX_WIDTH);
|
|
262
261
|
return {
|
|
263
262
|
width: width,
|
|
264
263
|
maxResizerWidth: maxResizerWidth
|
|
@@ -25,7 +25,6 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
|
25
25
|
var _utils = require("@atlaskit/editor-tables/utils");
|
|
26
26
|
var _insm = require("@atlaskit/insm");
|
|
27
27
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
28
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
29
28
|
var _commandsWithAnalytics = require("../pm-plugins/commands/commands-with-analytics");
|
|
30
29
|
var _misc = require("../pm-plugins/commands/misc");
|
|
31
30
|
var _tableAnalytics = require("../pm-plugins/table-analytics");
|
|
@@ -89,7 +88,7 @@ var getTableMaxWidth = function getTableMaxWidth(containerWidth, lineLength, isC
|
|
|
89
88
|
} else if (isChromelessEditor) {
|
|
90
89
|
return Number.isFinite(lineLength) && lineLength !== undefined ? lineLength : Math.floor(containerWidth - _consts.RESIZE_HANDLE_SPACING);
|
|
91
90
|
} else {
|
|
92
|
-
return
|
|
91
|
+
return _consts.TABLE_MAX_WIDTH;
|
|
93
92
|
}
|
|
94
93
|
};
|
|
95
94
|
|
|
@@ -310,7 +309,7 @@ var TableResizer = exports.TableResizer = function TableResizer(_ref) {
|
|
|
310
309
|
var fullWidthGuideline = (0, _guidelines.defaultGuidelinesForPreserveTable)(_guidelines.PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig).filter(function (guideline) {
|
|
311
310
|
return guideline.isFullWidth;
|
|
312
311
|
})[0];
|
|
313
|
-
var isFullWidthGuidelineActive =
|
|
312
|
+
var isFullWidthGuidelineActive = closestSnap && fullWidthGuideline && closestSnap.keys.includes(fullWidthGuideline.key);
|
|
314
313
|
var tableMaxWidth = getTableMaxWidth(containerWidth, lineLength, isCommentEditor, isChromelessEditor);
|
|
315
314
|
var shouldUpdateWidthToWidest = !isFullPageAppearance ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
|
|
316
315
|
var previewParentWidth = !isFullPageAppearance && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
|
|
@@ -339,7 +338,7 @@ var TableResizer = exports.TableResizer = function TableResizer(_ref) {
|
|
|
339
338
|
var pos = getPos();
|
|
340
339
|
var currentTableNodeLocalId = (_node$attrs$localId2 = node === null || node === void 0 || (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) !== null && _node$attrs$localId2 !== void 0 ? _node$attrs$localId2 : '';
|
|
341
340
|
var tableMaxWidth = !isFullPageAppearance ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
|
|
342
|
-
:
|
|
341
|
+
: _consts.TABLE_MAX_WIDTH;
|
|
343
342
|
newWidth = widthToWidest && currentTableNodeLocalId && widthToWidest[currentTableNodeLocalId] ? tableMaxWidth : newWidth;
|
|
344
343
|
var tr = state.tr.setMeta(_tableWidth.pluginKey, {
|
|
345
344
|
resizing: false,
|
|
@@ -137,7 +137,7 @@ var tableNodeSpecWithFixedToDOM = exports.tableNodeSpecWithFixedToDOM = function
|
|
|
137
137
|
position: 'relative',
|
|
138
138
|
userSelect: 'auto',
|
|
139
139
|
boxSizing: 'border-box',
|
|
140
|
-
'--ak-editor-table-max-width': "".concat(
|
|
140
|
+
'--ak-editor-table-max-width': "".concat(_consts.TABLE_MAX_WIDTH, "px"),
|
|
141
141
|
'--ak-editor-table-min-width': "".concat(tableMinWidth, "px"),
|
|
142
142
|
minWidth: 'var(--ak-editor-table-min-width)',
|
|
143
143
|
maxWidth: (0, _misc.getTableResizerContainerMaxWidthInCSS)(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),
|
|
@@ -12,7 +12,6 @@ var _styles = require("@atlaskit/editor-common/styles");
|
|
|
12
12
|
var _utils = require("@atlaskit/editor-common/utils");
|
|
13
13
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
14
14
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
15
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
16
15
|
var _colgroup = require("./colgroup");
|
|
17
16
|
var _consts = require("./consts");
|
|
18
17
|
// Translates named layouts in number values.
|
|
@@ -106,7 +105,7 @@ var getTableContainerElementWidth = exports.getTableContainerElementWidth = func
|
|
|
106
105
|
* @returns The CSS max-width value
|
|
107
106
|
*/
|
|
108
107
|
var getTableResizerContainerMaxWidthInCSS = exports.getTableResizerContainerMaxWidthInCSS = function getTableResizerContainerMaxWidthInCSS(isCommentEditor, isChromelessEditor, isTableScalingEnabled) {
|
|
109
|
-
var maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat(
|
|
108
|
+
var maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat(_consts.TABLE_MAX_WIDTH, "px)") : "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ".concat(_consts.TABLE_MAX_WIDTH, "px)");
|
|
110
109
|
return isCommentEditor || isChromelessEditor ? '100%' : maxResizerWidthForNonCommentEditor;
|
|
111
110
|
};
|
|
112
111
|
|
|
@@ -13,7 +13,6 @@ var _table = require("@atlaskit/editor-common/table");
|
|
|
13
13
|
var _document = require("@atlaskit/editor-common/utils/document");
|
|
14
14
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
15
15
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
16
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
17
16
|
var _consts = require("./table-resizing/utils/consts");
|
|
18
17
|
var _alignment = require("./utils/alignment");
|
|
19
18
|
var _isContentModeSupported = require("./utils/tableMode/is-content-mode-supported");
|
|
@@ -122,8 +121,8 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, dispat
|
|
|
122
121
|
step.getMap().forEach(function (_, __, newStart, newEnd) {
|
|
123
122
|
newState.doc.nodesBetween(newStart, newEnd, function (node, pos) {
|
|
124
123
|
if (node.type === table) {
|
|
125
|
-
if (shouldPatchTableWidth && node.attrs.width !==
|
|
126
|
-
tr.setNodeAttribute(pos, 'width',
|
|
124
|
+
if (shouldPatchTableWidth && node.attrs.width !== _consts.TABLE_MAX_WIDTH) {
|
|
125
|
+
tr.setNodeAttribute(pos, 'width', _consts.TABLE_MAX_WIDTH);
|
|
127
126
|
}
|
|
128
127
|
if (shouldPatchTableAlignment) {
|
|
129
128
|
tr.setNodeAttribute(pos, 'layout', _alignment.ALIGN_START);
|
|
@@ -8,12 +8,11 @@ exports.getTableMeasurement = exports.clampToEditorMaxWidth = exports.applyTable
|
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _styles = require("@atlaskit/editor-common/styles");
|
|
10
10
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
11
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
12
11
|
var _tableTransformUtils = require("./table-transform-utils");
|
|
13
12
|
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; }
|
|
14
13
|
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) { (0, _defineProperty2.default)(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; }
|
|
15
14
|
var clampToEditorMaxWidth = exports.clampToEditorMaxWidth = function clampToEditorMaxWidth(contentWidth) {
|
|
16
|
-
var maxEditorWidth =
|
|
15
|
+
var maxEditorWidth = _editorSharedStyles.akEditorMaxLayoutWidth;
|
|
17
16
|
return Math.min(maxEditorWidth, contentWidth);
|
|
18
17
|
};
|
|
19
18
|
var tableWidth = clampToEditorMaxWidth;
|
|
@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.createTableWithWidth = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _utils = require("@atlaskit/editor-tables/utils");
|
|
10
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
11
10
|
var _consts = require("../table-resizing/utils/consts");
|
|
12
11
|
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; }
|
|
13
12
|
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) { (0, _defineProperty2.default)(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; }
|
|
@@ -30,13 +29,13 @@ var createTableWithWidth = exports.createTableWithWidth = function createTableWi
|
|
|
30
29
|
attrsOverrides.colsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.colsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.colsCount : NESTED_TABLE_DEFAULT_COLS;
|
|
31
30
|
}
|
|
32
31
|
if (isTableScalingEnabled && !isCommentEditor) {
|
|
33
|
-
if (
|
|
32
|
+
if (isMaxWidthModeEnabled) {
|
|
34
33
|
attrsOverrides.tableWidth = _consts.TABLE_MAX_WIDTH;
|
|
35
34
|
} else if (isFullWidthModeEnabled) {
|
|
36
35
|
attrsOverrides.tableWidth = _consts.TABLE_FULL_WIDTH;
|
|
37
36
|
}
|
|
38
37
|
}
|
|
39
|
-
if (isTableAlignmentEnabled && (isFullWidthModeEnabled ||
|
|
38
|
+
if (isTableAlignmentEnabled && (isFullWidthModeEnabled || isMaxWidthModeEnabled || isCommentEditor)) {
|
|
40
39
|
attrsOverrides.layout = 'align-start';
|
|
41
40
|
}
|
|
42
41
|
if (isCommentEditor && isTableResizingEnabled || isChromelessEditor) {
|
|
@@ -9,7 +9,6 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
|
|
|
9
9
|
var _guideline = require("@atlaskit/editor-common/guideline");
|
|
10
10
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
11
11
|
var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
|
|
12
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
13
12
|
var numberOfLanesInDefaultLayoutWidth = 12;
|
|
14
13
|
var calculateSubSnappingWidths = function calculateSubSnappingWidths(totalLanes, totalWidth) {
|
|
15
14
|
return new Array(Math.round(totalLanes / 2) - 1).fill(totalWidth / totalLanes).map(function (v, i) {
|
|
@@ -38,9 +37,7 @@ var calculateDefaultTablePreserveSnappings = exports.calculateDefaultTablePreser
|
|
|
38
37
|
var dynamicFullWidthLine = editorContainerWidth - padding * 2 >= _editorSharedStyles.akEditorFullWidthLayoutWidth ? _editorSharedStyles.akEditorFullWidthLayoutWidth : editorContainerWidth - padding * 2;
|
|
39
38
|
var dynamicMaxWidthLine = editorContainerWidth - padding * 2 >= _editorSharedStyles.akEditorMaxWidthLayoutWidth ? _editorSharedStyles.akEditorMaxWidthLayoutWidth : editorContainerWidth - padding * 2;
|
|
40
39
|
var guides = [dynamicFullWidthLine - lengthOffset];
|
|
41
|
-
|
|
42
|
-
guides.push(dynamicMaxWidthLine - lengthOffset);
|
|
43
|
-
}
|
|
40
|
+
guides.push(dynamicMaxWidthLine - lengthOffset);
|
|
44
41
|
if (!exclude.breakoutPoints) {
|
|
45
42
|
guides.unshift(_editorSharedStyles.akEditorDefaultLayoutWidth + lengthOffset, _editorSharedStyles.akEditorCalculatedWideLayoutWidth + lengthOffset);
|
|
46
43
|
}
|
|
@@ -7,10 +7,9 @@ import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
|
7
7
|
import { resizerHoverZoneClassName, resizerItemClassName } from '@atlaskit/editor-common/styles/resizer';
|
|
8
8
|
import { akEditorDefaultLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
|
|
9
9
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
10
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
11
10
|
import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
12
11
|
import { getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
13
|
-
import { TABLE_MAX_WIDTH,
|
|
12
|
+
import { TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR, RESIZE_HANDLE_SPACING } from '../pm-plugins/table-resizing/utils/consts';
|
|
14
13
|
import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS, getTableResizerItemWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
|
|
15
14
|
import { ALIGN_CENTER, ALIGN_START } from '../pm-plugins/utils/alignment';
|
|
16
15
|
import { TableCssClassName as ClassName } from '../types';
|
|
@@ -254,7 +253,7 @@ export const ResizableTableContainer = /*#__PURE__*/React.memo(({
|
|
|
254
253
|
|
|
255
254
|
// Ensure minimum width for usability while respecting container constraints
|
|
256
255
|
const width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
|
|
257
|
-
const maxResizerWidth = !isFullPageAppearance ? responsiveContainerWidth : Math.min(responsiveContainerWidth,
|
|
256
|
+
const maxResizerWidth = !isFullPageAppearance ? responsiveContainerWidth : Math.min(responsiveContainerWidth, TABLE_MAX_WIDTH);
|
|
258
257
|
return {
|
|
259
258
|
width,
|
|
260
259
|
maxResizerWidth
|
|
@@ -15,12 +15,11 @@ import { akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFul
|
|
|
15
15
|
import { findTable } from '@atlaskit/editor-tables/utils';
|
|
16
16
|
import { insm } from '@atlaskit/insm';
|
|
17
17
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
18
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
19
18
|
import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
20
19
|
import { updateWidthToWidest } from '../pm-plugins/commands/misc';
|
|
21
20
|
import { META_KEYS } from '../pm-plugins/table-analytics';
|
|
22
21
|
import { getColgroupChildrenLength } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
23
|
-
import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH,
|
|
22
|
+
import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR, RESIZE_HANDLE_SPACING } from '../pm-plugins/table-resizing/utils/consts';
|
|
24
23
|
import { previewScaleTable, scaleTable } from '../pm-plugins/table-resizing/utils/scale-table';
|
|
25
24
|
import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
|
|
26
25
|
import { ALIGN_CENTER, ALIGN_START, normaliseAlignment, shouldChangeAlignmentToCenterResized } from '../pm-plugins/utils/alignment';
|
|
@@ -76,7 +75,7 @@ const getTableMaxWidth = (containerWidth, lineLength, isCommentEditor, isChromel
|
|
|
76
75
|
} else if (isChromelessEditor) {
|
|
77
76
|
return Number.isFinite(lineLength) && lineLength !== undefined ? lineLength : Math.floor(containerWidth - RESIZE_HANDLE_SPACING);
|
|
78
77
|
} else {
|
|
79
|
-
return
|
|
78
|
+
return TABLE_MAX_WIDTH;
|
|
80
79
|
}
|
|
81
80
|
};
|
|
82
81
|
|
|
@@ -303,7 +302,7 @@ export const TableResizer = ({
|
|
|
303
302
|
} = editorView;
|
|
304
303
|
const currentTableNodeLocalId = (_node$attrs$localId = node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.localId) !== null && _node$attrs$localId !== void 0 ? _node$attrs$localId : '';
|
|
305
304
|
const fullWidthGuideline = defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig).filter(guideline => guideline.isFullWidth)[0];
|
|
306
|
-
const isFullWidthGuidelineActive =
|
|
305
|
+
const isFullWidthGuidelineActive = closestSnap && fullWidthGuideline && closestSnap.keys.includes(fullWidthGuideline.key);
|
|
307
306
|
const tableMaxWidth = getTableMaxWidth(containerWidth, lineLength, isCommentEditor, isChromelessEditor);
|
|
308
307
|
const shouldUpdateWidthToWidest = !isFullPageAppearance ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
|
|
309
308
|
const previewParentWidth = !isFullPageAppearance && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
|
|
@@ -334,7 +333,7 @@ export const TableResizer = ({
|
|
|
334
333
|
const pos = getPos();
|
|
335
334
|
const currentTableNodeLocalId = (_node$attrs$localId2 = node === null || node === void 0 ? void 0 : (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) !== null && _node$attrs$localId2 !== void 0 ? _node$attrs$localId2 : '';
|
|
336
335
|
const tableMaxWidth = !isFullPageAppearance ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
|
|
337
|
-
:
|
|
336
|
+
: TABLE_MAX_WIDTH;
|
|
338
337
|
newWidth = widthToWidest && currentTableNodeLocalId && widthToWidest[currentTableNodeLocalId] ? tableMaxWidth : newWidth;
|
|
339
338
|
let tr = state.tr.setMeta(tableWidthPluginKey, {
|
|
340
339
|
resizing: false,
|
|
@@ -6,7 +6,7 @@ import { isTableInContentMode } from '@atlaskit/editor-common/table';
|
|
|
6
6
|
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
7
7
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
8
8
|
import { generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
9
|
-
import { TABLE_MAX_WIDTH
|
|
9
|
+
import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils/consts';
|
|
10
10
|
import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS, getTableResizerItemWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
|
|
11
11
|
import { isContentModeSupported } from '../pm-plugins/utils/tableMode/is-content-mode-supported';
|
|
12
12
|
import { TableCssClassName as ClassName } from '../types';
|
|
@@ -123,7 +123,7 @@ export const tableNodeSpecWithFixedToDOM = config => {
|
|
|
123
123
|
position: 'relative',
|
|
124
124
|
userSelect: 'auto',
|
|
125
125
|
boxSizing: 'border-box',
|
|
126
|
-
'--ak-editor-table-max-width': `${
|
|
126
|
+
'--ak-editor-table-max-width': `${TABLE_MAX_WIDTH}px`,
|
|
127
127
|
'--ak-editor-table-min-width': `${tableMinWidth}px`,
|
|
128
128
|
minWidth: 'var(--ak-editor-table-min-width)',
|
|
129
129
|
maxWidth: getTableResizerContainerMaxWidthInCSS(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),
|
|
@@ -3,9 +3,8 @@ import { calcTableWidth } from '@atlaskit/editor-common/styles';
|
|
|
3
3
|
import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
|
|
4
4
|
import { akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorTableNumberColumnWidth, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
|
|
5
5
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
6
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
7
6
|
import { hasTableBeenResized, hasTableColumnBeenResized } from './colgroup';
|
|
8
|
-
import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_MAX_WIDTH
|
|
7
|
+
import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_MAX_WIDTH } from './consts';
|
|
9
8
|
|
|
10
9
|
// Translates named layouts in number values.
|
|
11
10
|
export function getLayoutSize(tableLayout, containerWidth = 0, options) {
|
|
@@ -98,7 +97,7 @@ export const getTableContainerElementWidth = table => {
|
|
|
98
97
|
* @returns The CSS max-width value
|
|
99
98
|
*/
|
|
100
99
|
export const getTableResizerContainerMaxWidthInCSS = (isCommentEditor, isChromelessEditor, isTableScalingEnabled) => {
|
|
101
|
-
const maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ${
|
|
100
|
+
const maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ${TABLE_MAX_WIDTH}px)` : `min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ${TABLE_MAX_WIDTH}px)`;
|
|
102
101
|
return isCommentEditor || isChromelessEditor ? '100%' : maxResizerWidthForNonCommentEditor;
|
|
103
102
|
};
|
|
104
103
|
|
|
@@ -10,8 +10,7 @@ import { isTableInContentMode } from '@atlaskit/editor-common/table';
|
|
|
10
10
|
import { isReplaceDocOperation } from '@atlaskit/editor-common/utils/document';
|
|
11
11
|
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
12
12
|
import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorMaxWidthLayoutWidth, akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
|
|
13
|
-
import {
|
|
14
|
-
import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from './table-resizing/utils/consts';
|
|
13
|
+
import { TABLE_MAX_WIDTH } from './table-resizing/utils/consts';
|
|
15
14
|
import { ALIGN_START } from './utils/alignment';
|
|
16
15
|
import { isContentModeSupported } from './utils/tableMode/is-content-mode-supported';
|
|
17
16
|
export const pluginKey = new PluginKey('tableWidthPlugin');
|
|
@@ -117,8 +116,8 @@ const createPlugin = (dispatch, dispatchAnalyticsEvent, fullWidthEnabled, maxWid
|
|
|
117
116
|
step.getMap().forEach((_, __, newStart, newEnd) => {
|
|
118
117
|
newState.doc.nodesBetween(newStart, newEnd, (node, pos) => {
|
|
119
118
|
if (node.type === table) {
|
|
120
|
-
if (shouldPatchTableWidth && node.attrs.width !==
|
|
121
|
-
tr.setNodeAttribute(pos, 'width',
|
|
119
|
+
if (shouldPatchTableWidth && node.attrs.width !== TABLE_MAX_WIDTH) {
|
|
120
|
+
tr.setNodeAttribute(pos, 'width', TABLE_MAX_WIDTH);
|
|
122
121
|
}
|
|
123
122
|
if (shouldPatchTableAlignment) {
|
|
124
123
|
tr.setNodeAttribute(pos, 'layout', ALIGN_START);
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
2
|
-
import {
|
|
3
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
2
|
+
import { akEditorMaxLayoutWidth } from '@atlaskit/editor-shared-styles';
|
|
4
3
|
import { updateCellsMarkup } from './table-transform-utils';
|
|
5
4
|
export const clampToEditorMaxWidth = contentWidth => {
|
|
6
|
-
const maxEditorWidth =
|
|
5
|
+
const maxEditorWidth = akEditorMaxLayoutWidth;
|
|
7
6
|
return Math.min(maxEditorWidth, contentWidth);
|
|
8
7
|
};
|
|
9
8
|
const tableWidth = clampToEditorMaxWidth;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { createTable } from '@atlaskit/editor-tables/utils';
|
|
2
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
3
2
|
import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from '../table-resizing/utils/consts';
|
|
4
3
|
const NESTED_TABLE_DEFAULT_ROWS = 2;
|
|
5
4
|
const NESTED_TABLE_DEFAULT_COLS = 2;
|
|
@@ -20,13 +19,13 @@ export const createTableWithWidth = ({
|
|
|
20
19
|
attrsOverrides.colsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.colsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.colsCount : NESTED_TABLE_DEFAULT_COLS;
|
|
21
20
|
}
|
|
22
21
|
if (isTableScalingEnabled && !isCommentEditor) {
|
|
23
|
-
if (
|
|
22
|
+
if (isMaxWidthModeEnabled) {
|
|
24
23
|
attrsOverrides.tableWidth = TABLE_MAX_WIDTH;
|
|
25
24
|
} else if (isFullWidthModeEnabled) {
|
|
26
25
|
attrsOverrides.tableWidth = TABLE_FULL_WIDTH;
|
|
27
26
|
}
|
|
28
27
|
}
|
|
29
|
-
if (isTableAlignmentEnabled && (isFullWidthModeEnabled ||
|
|
28
|
+
if (isTableAlignmentEnabled && (isFullWidthModeEnabled || isMaxWidthModeEnabled || isCommentEditor)) {
|
|
30
29
|
attrsOverrides.layout = 'align-start';
|
|
31
30
|
}
|
|
32
31
|
if (isCommentEditor && isTableResizingEnabled || isChromelessEditor) {
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { isVerticalPosition } from '@atlaskit/editor-common/guideline';
|
|
2
2
|
import { akEditorCalculatedWideLayoutWidth, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMaxWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
|
|
3
3
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
4
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
5
4
|
const numberOfLanesInDefaultLayoutWidth = 12;
|
|
6
5
|
const calculateSubSnappingWidths = (totalLanes, totalWidth) => new Array(Math.round(totalLanes / 2) - 1).fill(totalWidth / totalLanes).map((v, i) => v * (i + 1) * 2);
|
|
7
6
|
export const calculateDefaultSnappings = (lengthOffset = 0) => [...calculateSubSnappingWidths(numberOfLanesInDefaultLayoutWidth, akEditorDefaultLayoutWidth + lengthOffset), akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset, akEditorFullWidthLayoutWidth + lengthOffset];
|
|
@@ -20,9 +19,7 @@ export const calculateDefaultTablePreserveSnappings = (lengthOffset = 0, editorC
|
|
|
20
19
|
const dynamicFullWidthLine = editorContainerWidth - padding * 2 >= akEditorFullWidthLayoutWidth ? akEditorFullWidthLayoutWidth : editorContainerWidth - padding * 2;
|
|
21
20
|
const dynamicMaxWidthLine = editorContainerWidth - padding * 2 >= akEditorMaxWidthLayoutWidth ? akEditorMaxWidthLayoutWidth : editorContainerWidth - padding * 2;
|
|
22
21
|
const guides = [dynamicFullWidthLine - lengthOffset];
|
|
23
|
-
|
|
24
|
-
guides.push(dynamicMaxWidthLine - lengthOffset);
|
|
25
|
-
}
|
|
22
|
+
guides.push(dynamicMaxWidthLine - lengthOffset);
|
|
26
23
|
if (!exclude.breakoutPoints) {
|
|
27
24
|
guides.unshift(akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset);
|
|
28
25
|
}
|
|
@@ -8,10 +8,9 @@ import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
|
8
8
|
import { resizerHoverZoneClassName, resizerItemClassName } from '@atlaskit/editor-common/styles/resizer';
|
|
9
9
|
import { akEditorDefaultLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMobileBreakoutPoint } from '@atlaskit/editor-shared-styles';
|
|
10
10
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
11
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
12
11
|
import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
13
12
|
import { getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
14
|
-
import { TABLE_MAX_WIDTH,
|
|
13
|
+
import { TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR, RESIZE_HANDLE_SPACING } from '../pm-plugins/table-resizing/utils/consts';
|
|
15
14
|
import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS, getTableResizerItemWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
|
|
16
15
|
import { ALIGN_CENTER, ALIGN_START } from '../pm-plugins/utils/alignment';
|
|
17
16
|
import { TableCssClassName as ClassName } from '../types';
|
|
@@ -249,7 +248,7 @@ export var ResizableTableContainer = /*#__PURE__*/React.memo(function (_ref4) {
|
|
|
249
248
|
|
|
250
249
|
// Ensure minimum width for usability while respecting container constraints
|
|
251
250
|
var width = Math.max(calculatedWidth, Math.min(responsiveContainerWidth * 0.5, 300));
|
|
252
|
-
var maxResizerWidth = !isFullPageAppearance ? responsiveContainerWidth : Math.min(responsiveContainerWidth,
|
|
251
|
+
var maxResizerWidth = !isFullPageAppearance ? responsiveContainerWidth : Math.min(responsiveContainerWidth, TABLE_MAX_WIDTH);
|
|
253
252
|
return {
|
|
254
253
|
width: width,
|
|
255
254
|
maxResizerWidth: maxResizerWidth
|
|
@@ -19,12 +19,11 @@ import { akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFul
|
|
|
19
19
|
import { findTable } from '@atlaskit/editor-tables/utils';
|
|
20
20
|
import { insm } from '@atlaskit/insm';
|
|
21
21
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
22
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
23
22
|
import { setTableAlignmentWithTableContentWithPosWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
24
23
|
import { updateWidthToWidest } from '../pm-plugins/commands/misc';
|
|
25
24
|
import { META_KEYS } from '../pm-plugins/table-analytics';
|
|
26
25
|
import { getColgroupChildrenLength } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
27
|
-
import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH,
|
|
26
|
+
import { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_OFFSET_IN_COMMENT_EDITOR, RESIZE_HANDLE_SPACING } from '../pm-plugins/table-resizing/utils/consts';
|
|
28
27
|
import { previewScaleTable, scaleTable } from '../pm-plugins/table-resizing/utils/scale-table';
|
|
29
28
|
import { pluginKey as tableWidthPluginKey } from '../pm-plugins/table-width';
|
|
30
29
|
import { ALIGN_CENTER, ALIGN_START, normaliseAlignment, shouldChangeAlignmentToCenterResized } from '../pm-plugins/utils/alignment';
|
|
@@ -80,7 +79,7 @@ var getTableMaxWidth = function getTableMaxWidth(containerWidth, lineLength, isC
|
|
|
80
79
|
} else if (isChromelessEditor) {
|
|
81
80
|
return Number.isFinite(lineLength) && lineLength !== undefined ? lineLength : Math.floor(containerWidth - RESIZE_HANDLE_SPACING);
|
|
82
81
|
} else {
|
|
83
|
-
return
|
|
82
|
+
return TABLE_MAX_WIDTH;
|
|
84
83
|
}
|
|
85
84
|
};
|
|
86
85
|
|
|
@@ -301,7 +300,7 @@ export var TableResizer = function TableResizer(_ref) {
|
|
|
301
300
|
var fullWidthGuideline = defaultGuidelinesForPreserveTable(PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET, editorContainerWidth, excludeGuidelineConfig).filter(function (guideline) {
|
|
302
301
|
return guideline.isFullWidth;
|
|
303
302
|
})[0];
|
|
304
|
-
var isFullWidthGuidelineActive =
|
|
303
|
+
var isFullWidthGuidelineActive = closestSnap && fullWidthGuideline && closestSnap.keys.includes(fullWidthGuideline.key);
|
|
305
304
|
var tableMaxWidth = getTableMaxWidth(containerWidth, lineLength, isCommentEditor, isChromelessEditor);
|
|
306
305
|
var shouldUpdateWidthToWidest = !isFullPageAppearance ? tableMaxWidth <= newWidth : !!isTableScalingEnabled && isFullWidthGuidelineActive;
|
|
307
306
|
var previewParentWidth = !isFullPageAppearance && shouldUpdateWidthToWidest ? tableMaxWidth : newWidth;
|
|
@@ -330,7 +329,7 @@ export var TableResizer = function TableResizer(_ref) {
|
|
|
330
329
|
var pos = getPos();
|
|
331
330
|
var currentTableNodeLocalId = (_node$attrs$localId2 = node === null || node === void 0 || (_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.localId) !== null && _node$attrs$localId2 !== void 0 ? _node$attrs$localId2 : '';
|
|
332
331
|
var tableMaxWidth = !isFullPageAppearance ? undefined // Table's full-width in comment appearance inherit the width of the Editor/Renderer
|
|
333
|
-
:
|
|
332
|
+
: TABLE_MAX_WIDTH;
|
|
334
333
|
newWidth = widthToWidest && currentTableNodeLocalId && widthToWidest[currentTableNodeLocalId] ? tableMaxWidth : newWidth;
|
|
335
334
|
var tr = state.tr.setMeta(tableWidthPluginKey, {
|
|
336
335
|
resizing: false,
|
|
@@ -11,7 +11,7 @@ import { isTableInContentMode } from '@atlaskit/editor-common/table';
|
|
|
11
11
|
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
12
12
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
13
13
|
import { generateColgroupFromNode, getResizerMinWidth } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
14
|
-
import { TABLE_MAX_WIDTH
|
|
14
|
+
import { TABLE_MAX_WIDTH } from '../pm-plugins/table-resizing/utils/consts';
|
|
15
15
|
import { getTableResizerContainerMaxWidthInCSS, getTableResizerContainerForFullPageWidthInCSS, getTableResizerItemWidthInCSS } from '../pm-plugins/table-resizing/utils/misc';
|
|
16
16
|
import { isContentModeSupported } from '../pm-plugins/utils/tableMode/is-content-mode-supported';
|
|
17
17
|
import { TableCssClassName as ClassName } from '../types';
|
|
@@ -130,7 +130,7 @@ export var tableNodeSpecWithFixedToDOM = function tableNodeSpecWithFixedToDOM(co
|
|
|
130
130
|
position: 'relative',
|
|
131
131
|
userSelect: 'auto',
|
|
132
132
|
boxSizing: 'border-box',
|
|
133
|
-
'--ak-editor-table-max-width': "".concat(
|
|
133
|
+
'--ak-editor-table-max-width': "".concat(TABLE_MAX_WIDTH, "px"),
|
|
134
134
|
'--ak-editor-table-min-width': "".concat(tableMinWidth, "px"),
|
|
135
135
|
minWidth: 'var(--ak-editor-table-min-width)',
|
|
136
136
|
maxWidth: getTableResizerContainerMaxWidthInCSS(config.isCommentEditor, config.isChromelessEditor, config.isTableScalingEnabled),
|
|
@@ -3,9 +3,8 @@ import { calcTableWidth } from '@atlaskit/editor-common/styles';
|
|
|
3
3
|
import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
|
|
4
4
|
import { akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorTableNumberColumnWidth, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout } from '@atlaskit/editor-shared-styles';
|
|
5
5
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
6
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
7
6
|
import { hasTableBeenResized, hasTableColumnBeenResized } from './colgroup';
|
|
8
|
-
import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_MAX_WIDTH
|
|
7
|
+
import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION, TABLE_MAX_WIDTH } from './consts';
|
|
9
8
|
|
|
10
9
|
// Translates named layouts in number values.
|
|
11
10
|
export function getLayoutSize(tableLayout) {
|
|
@@ -98,7 +97,7 @@ export var getTableContainerElementWidth = function getTableContainerElementWidt
|
|
|
98
97
|
* @returns The CSS max-width value
|
|
99
98
|
*/
|
|
100
99
|
export var getTableResizerContainerMaxWidthInCSS = function getTableResizerContainerMaxWidthInCSS(isCommentEditor, isChromelessEditor, isTableScalingEnabled) {
|
|
101
|
-
var maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat(
|
|
100
|
+
var maxResizerWidthForNonCommentEditor = isTableScalingEnabled ? "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2)), ".concat(TABLE_MAX_WIDTH, "px)") : "min(calc(100cqw - calc(var(--ak-editor--large-gutter-padding) * 2) - var(--ak-editor--resizer-handle-spacing)), ".concat(TABLE_MAX_WIDTH, "px)");
|
|
102
101
|
return isCommentEditor || isChromelessEditor ? '100%' : maxResizerWidthForNonCommentEditor;
|
|
103
102
|
};
|
|
104
103
|
|
|
@@ -15,8 +15,7 @@ import { isTableInContentMode } from '@atlaskit/editor-common/table';
|
|
|
15
15
|
import { isReplaceDocOperation } from '@atlaskit/editor-common/utils/document';
|
|
16
16
|
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
17
17
|
import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorMaxWidthLayoutWidth, akEditorWideLayoutWidth } from '@atlaskit/editor-shared-styles';
|
|
18
|
-
import {
|
|
19
|
-
import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from './table-resizing/utils/consts';
|
|
18
|
+
import { TABLE_MAX_WIDTH } from './table-resizing/utils/consts';
|
|
20
19
|
import { ALIGN_START } from './utils/alignment';
|
|
21
20
|
import { isContentModeSupported } from './utils/tableMode/is-content-mode-supported';
|
|
22
21
|
export var pluginKey = new PluginKey('tableWidthPlugin');
|
|
@@ -117,8 +116,8 @@ var createPlugin = function createPlugin(dispatch, dispatchAnalyticsEvent, fullW
|
|
|
117
116
|
step.getMap().forEach(function (_, __, newStart, newEnd) {
|
|
118
117
|
newState.doc.nodesBetween(newStart, newEnd, function (node, pos) {
|
|
119
118
|
if (node.type === table) {
|
|
120
|
-
if (shouldPatchTableWidth && node.attrs.width !==
|
|
121
|
-
tr.setNodeAttribute(pos, 'width',
|
|
119
|
+
if (shouldPatchTableWidth && node.attrs.width !== TABLE_MAX_WIDTH) {
|
|
120
|
+
tr.setNodeAttribute(pos, 'width', TABLE_MAX_WIDTH);
|
|
122
121
|
}
|
|
123
122
|
if (shouldPatchTableAlignment) {
|
|
124
123
|
tr.setNodeAttribute(pos, 'layout', ALIGN_START);
|
|
@@ -2,11 +2,10 @@ 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 { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
5
|
-
import {
|
|
6
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
5
|
+
import { akEditorMaxLayoutWidth } from '@atlaskit/editor-shared-styles';
|
|
7
6
|
import { updateCellsMarkup } from './table-transform-utils';
|
|
8
7
|
export var clampToEditorMaxWidth = function clampToEditorMaxWidth(contentWidth) {
|
|
9
|
-
var maxEditorWidth =
|
|
8
|
+
var maxEditorWidth = akEditorMaxLayoutWidth;
|
|
10
9
|
return Math.min(maxEditorWidth, contentWidth);
|
|
11
10
|
};
|
|
12
11
|
var tableWidth = clampToEditorMaxWidth;
|
|
@@ -2,7 +2,6 @@ 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 { createTable } from '@atlaskit/editor-tables/utils';
|
|
5
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
6
5
|
import { TABLE_MAX_WIDTH, TABLE_FULL_WIDTH } from '../table-resizing/utils/consts';
|
|
7
6
|
var NESTED_TABLE_DEFAULT_ROWS = 2;
|
|
8
7
|
var NESTED_TABLE_DEFAULT_COLS = 2;
|
|
@@ -23,13 +22,13 @@ export var createTableWithWidth = function createTableWithWidth(_ref) {
|
|
|
23
22
|
attrsOverrides.colsCount = createTableProps !== null && createTableProps !== void 0 && createTableProps.colsCount ? createTableProps === null || createTableProps === void 0 ? void 0 : createTableProps.colsCount : NESTED_TABLE_DEFAULT_COLS;
|
|
24
23
|
}
|
|
25
24
|
if (isTableScalingEnabled && !isCommentEditor) {
|
|
26
|
-
if (
|
|
25
|
+
if (isMaxWidthModeEnabled) {
|
|
27
26
|
attrsOverrides.tableWidth = TABLE_MAX_WIDTH;
|
|
28
27
|
} else if (isFullWidthModeEnabled) {
|
|
29
28
|
attrsOverrides.tableWidth = TABLE_FULL_WIDTH;
|
|
30
29
|
}
|
|
31
30
|
}
|
|
32
|
-
if (isTableAlignmentEnabled && (isFullWidthModeEnabled ||
|
|
31
|
+
if (isTableAlignmentEnabled && (isFullWidthModeEnabled || isMaxWidthModeEnabled || isCommentEditor)) {
|
|
33
32
|
attrsOverrides.layout = 'align-start';
|
|
34
33
|
}
|
|
35
34
|
if (isCommentEditor && isTableResizingEnabled || isChromelessEditor) {
|
|
@@ -2,7 +2,6 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
|
|
|
2
2
|
import { isVerticalPosition } from '@atlaskit/editor-common/guideline';
|
|
3
3
|
import { akEditorCalculatedWideLayoutWidth, akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth, akEditorGutterPaddingDynamic, akEditorGutterPaddingReduced, akEditorFullPageNarrowBreakout, akEditorMaxWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
|
|
4
4
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
|
|
5
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
6
5
|
var numberOfLanesInDefaultLayoutWidth = 12;
|
|
7
6
|
var calculateSubSnappingWidths = function calculateSubSnappingWidths(totalLanes, totalWidth) {
|
|
8
7
|
return new Array(Math.round(totalLanes / 2) - 1).fill(totalWidth / totalLanes).map(function (v, i) {
|
|
@@ -31,9 +30,7 @@ export var calculateDefaultTablePreserveSnappings = function calculateDefaultTab
|
|
|
31
30
|
var dynamicFullWidthLine = editorContainerWidth - padding * 2 >= akEditorFullWidthLayoutWidth ? akEditorFullWidthLayoutWidth : editorContainerWidth - padding * 2;
|
|
32
31
|
var dynamicMaxWidthLine = editorContainerWidth - padding * 2 >= akEditorMaxWidthLayoutWidth ? akEditorMaxWidthLayoutWidth : editorContainerWidth - padding * 2;
|
|
33
32
|
var guides = [dynamicFullWidthLine - lengthOffset];
|
|
34
|
-
|
|
35
|
-
guides.push(dynamicMaxWidthLine - lengthOffset);
|
|
36
|
-
}
|
|
33
|
+
guides.push(dynamicMaxWidthLine - lengthOffset);
|
|
37
34
|
if (!exclude.breakoutPoints) {
|
|
38
35
|
guides.unshift(akEditorDefaultLayoutWidth + lengthOffset, akEditorCalculatedWideLayoutWidth + lengthOffset);
|
|
39
36
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "31.0.
|
|
3
|
+
"version": "31.0.5",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"@atlaskit/editor-plugin-batch-attribute-updates": "^19.0.0",
|
|
30
30
|
"@atlaskit/editor-plugin-content-insertion": "^19.0.0",
|
|
31
31
|
"@atlaskit/editor-plugin-editor-viewmode": "^21.0.0",
|
|
32
|
-
"@atlaskit/editor-plugin-extension": "22.0.
|
|
32
|
+
"@atlaskit/editor-plugin-extension": "22.0.5",
|
|
33
33
|
"@atlaskit/editor-plugin-guideline": "^19.0.0",
|
|
34
34
|
"@atlaskit/editor-plugin-interaction": "^32.0.0",
|
|
35
35
|
"@atlaskit/editor-plugin-limited-mode": "^16.0.0",
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^3.2.0",
|
|
54
54
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^2.2.0",
|
|
55
55
|
"@atlaskit/primitives": "^22.5.0",
|
|
56
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
56
|
+
"@atlaskit/tmp-editor-statsig": "^202.0.0",
|
|
57
57
|
"@atlaskit/toggle": "^17.3.0",
|
|
58
58
|
"@atlaskit/tokens": "^18.2.0",
|
|
59
59
|
"@atlaskit/tooltip": "^24.3.0",
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
"uuid": "^11.1.1"
|
|
69
69
|
},
|
|
70
70
|
"peerDependencies": {
|
|
71
|
-
"@atlaskit/editor-common": "^123.
|
|
71
|
+
"@atlaskit/editor-common": "^123.5.0",
|
|
72
72
|
"react": "^18.2.0 || ^19.2.0",
|
|
73
73
|
"react-dom": "^18.2.0 || ^19.2.0",
|
|
74
74
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|