@atlaskit/editor-plugin-table 7.17.3 → 7.17.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 +17 -0
- package/dist/cjs/commands/column-resize.js +2 -6
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +1 -1
- package/dist/cjs/toolbar.js +1 -1
- package/dist/cjs/transforms/column-width.js +1 -2
- package/dist/cjs/ui/ColumnResizeWidget/index.js +1 -0
- package/dist/cjs/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.js +1 -0
- package/dist/cjs/ui/FloatingContextualButton/index.js +2 -0
- package/dist/cjs/ui/FloatingContextualButton/styles.js +2 -0
- package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js +5 -5
- package/dist/cjs/ui/FloatingContextualMenu/index.js +1 -0
- package/dist/cjs/ui/FloatingContextualMenu/styles.js +1 -1
- package/dist/cjs/ui/FloatingDragMenu/DragMenu.js +11 -9
- package/dist/cjs/ui/FloatingDragMenu/index.js +3 -3
- package/dist/cjs/ui/FloatingDragMenu/styles.js +3 -3
- package/dist/cjs/ui/TableFloatingControls/RowControls/DragControls.js +7 -19
- package/dist/cjs/ui/common-styles.js +1 -0
- package/dist/cjs/ui/ui-styles.js +1 -0
- package/dist/cjs/utils/drag-menu.js +2 -2
- package/dist/es2019/commands/column-resize.js +2 -6
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +1 -1
- package/dist/es2019/toolbar.js +1 -0
- package/dist/es2019/transforms/column-width.js +1 -2
- package/dist/es2019/ui/ColumnResizeWidget/index.js +1 -0
- package/dist/es2019/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.js +1 -0
- package/dist/es2019/ui/FloatingContextualButton/index.js +2 -0
- package/dist/es2019/ui/FloatingContextualButton/styles.js +1 -0
- package/dist/es2019/ui/FloatingContextualMenu/ContextualMenu.js +5 -3
- package/dist/es2019/ui/FloatingContextualMenu/index.js +1 -0
- package/dist/es2019/ui/FloatingContextualMenu/styles.js +1 -0
- package/dist/es2019/ui/FloatingDragMenu/DragMenu.js +11 -9
- package/dist/es2019/ui/FloatingDragMenu/index.js +2 -2
- package/dist/es2019/ui/FloatingDragMenu/styles.js +3 -2
- package/dist/es2019/ui/TableFloatingControls/RowControls/DragControls.js +7 -19
- package/dist/es2019/ui/common-styles.js +1 -0
- package/dist/es2019/ui/ui-styles.js +1 -0
- package/dist/es2019/utils/drag-menu.js +2 -2
- package/dist/esm/commands/column-resize.js +2 -6
- package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +1 -1
- package/dist/esm/toolbar.js +1 -0
- package/dist/esm/transforms/column-width.js +1 -2
- package/dist/esm/ui/ColumnResizeWidget/index.js +1 -0
- package/dist/esm/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.js +1 -0
- package/dist/esm/ui/FloatingContextualButton/index.js +2 -0
- package/dist/esm/ui/FloatingContextualButton/styles.js +1 -0
- package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js +6 -4
- package/dist/esm/ui/FloatingContextualMenu/index.js +1 -0
- package/dist/esm/ui/FloatingContextualMenu/styles.js +1 -0
- package/dist/esm/ui/FloatingDragMenu/DragMenu.js +11 -9
- package/dist/esm/ui/FloatingDragMenu/index.js +3 -3
- package/dist/esm/ui/FloatingDragMenu/styles.js +3 -2
- package/dist/esm/ui/TableFloatingControls/RowControls/DragControls.js +7 -19
- package/dist/esm/ui/common-styles.js +1 -0
- package/dist/esm/ui/ui-styles.js +1 -0
- package/dist/esm/utils/drag-menu.js +2 -2
- package/dist/types/ui/FloatingDragMenu/DragMenu.d.ts +2 -2
- package/dist/types/ui/FloatingDragMenu/styles.d.ts +1 -1
- package/dist/types/utils/drag-menu.d.ts +1 -1
- package/dist/types-ts4.5/ui/FloatingDragMenu/DragMenu.d.ts +2 -2
- package/dist/types-ts4.5/ui/FloatingDragMenu/styles.d.ts +1 -1
- package/dist/types-ts4.5/utils/drag-menu.d.ts +1 -1
- package/package.json +6 -9
- package/src/commands/column-resize.ts +2 -6
- package/src/pm-plugins/table-resizing/utils/resize-state.ts +1 -3
- package/src/toolbar.tsx +1 -0
- package/src/transforms/column-width.ts +1 -6
- package/src/ui/ColumnResizeWidget/index.tsx +1 -0
- package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx +1 -0
- package/src/ui/FloatingContextualButton/index.tsx +1 -0
- package/src/ui/FloatingContextualButton/styles.ts +1 -0
- package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +4 -5
- package/src/ui/FloatingContextualMenu/index.tsx +1 -0
- package/src/ui/FloatingContextualMenu/styles.ts +1 -0
- package/src/ui/FloatingDragMenu/DragMenu.tsx +11 -10
- package/src/ui/FloatingDragMenu/index.tsx +2 -2
- package/src/ui/FloatingDragMenu/styles.ts +3 -4
- package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +8 -23
- package/src/ui/common-styles.ts +1 -0
- package/src/ui/ui-styles.ts +1 -0
- package/src/utils/drag-menu.ts +2 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 7.17.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#111382](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111382)
|
|
8
|
+
[`5ce3f135c6211`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5ce3f135c6211) -
|
|
9
|
+
Cleanup feature flag to protect for explicit HTML element check in some places.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 7.17.4
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [#111851](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111851)
|
|
17
|
+
[`4aefbe38ee8e2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4aefbe38ee8e2) -
|
|
18
|
+
ED-23129: Updated experiment ID and corresponding editor FF
|
|
19
|
+
|
|
3
20
|
## 7.17.3
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
|
@@ -184,12 +184,8 @@ var changeColumnWidthByStep = exports.changeColumnWidthByStep = function changeC
|
|
|
184
184
|
var domAtPos = view.domAtPos.bind(view);
|
|
185
185
|
var colIndex = map.colCount($cell.pos - tableStartPosition) + ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) - 1;
|
|
186
186
|
var dom = null;
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
dom = domAtPosition.node instanceof HTMLTableElement ? domAtPosition.node : null;
|
|
190
|
-
} else {
|
|
191
|
-
dom = domAtPos(tableStartPosition).node;
|
|
192
|
-
}
|
|
187
|
+
var domAtPosition = domAtPos(tableStartPosition);
|
|
188
|
+
dom = domAtPosition.node instanceof HTMLTableElement ? domAtPosition.node : null;
|
|
193
189
|
if (dom && dom.nodeName !== 'TABLE') {
|
|
194
190
|
dom = dom.closest('table');
|
|
195
191
|
}
|
|
@@ -325,7 +325,7 @@ var getNewResizeStateFromSelectedColumns = exports.getNewResizeStateFromSelected
|
|
|
325
325
|
}
|
|
326
326
|
var maybeTable = domAtPos(table.start).node;
|
|
327
327
|
var maybeTableElement = maybeTable instanceof HTMLElement ? maybeTable : null;
|
|
328
|
-
var tableRef =
|
|
328
|
+
var tableRef = maybeTableElement === null || maybeTableElement === void 0 ? void 0 : maybeTableElement.closest('table');
|
|
329
329
|
if (!tableRef) {
|
|
330
330
|
return;
|
|
331
331
|
}
|
package/dist/cjs/toolbar.js
CHANGED
|
@@ -43,7 +43,7 @@ var _alignment = require("./utils/alignment");
|
|
|
43
43
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
44
44
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
45
45
|
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; }
|
|
46
|
-
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; } /** @jsx jsx */
|
|
46
|
+
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; } /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
47
47
|
var getToolbarMenuConfig = exports.getToolbarMenuConfig = function getToolbarMenuConfig(config, state, _ref, editorAnalyticsAPI) {
|
|
48
48
|
var formatMessage = _ref.formatMessage;
|
|
49
49
|
var isTableScalingWithFixedColumnWidthsOptionShown = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
|
|
@@ -9,7 +9,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
|
|
|
9
9
|
var _styles = require("@atlaskit/editor-common/styles");
|
|
10
10
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
11
11
|
var _tableMap = require("@atlaskit/editor-tables/table-map");
|
|
12
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
13
12
|
var _utils = require("../pm-plugins/table-resizing/utils");
|
|
14
13
|
var _colgroup = require("../pm-plugins/table-resizing/utils/colgroup");
|
|
15
14
|
var _resizeState = require("../pm-plugins/table-resizing/utils/resize-state");
|
|
@@ -108,7 +107,7 @@ var rescaleColumns = exports.rescaleColumns = function rescaleColumns() {
|
|
|
108
107
|
var newTable = tr.doc.nodeAt(table.pos);
|
|
109
108
|
var domAtPos = view.domAtPos.bind(view);
|
|
110
109
|
var maybeTable = domAtPos(table.start).node;
|
|
111
|
-
var maybeTableElement =
|
|
110
|
+
var maybeTableElement = maybeTable instanceof HTMLElement ? maybeTable : null;
|
|
112
111
|
var tableRef = maybeTableElement === null || maybeTableElement === void 0 ? void 0 : maybeTableElement.closest('table');
|
|
113
112
|
if (!tableRef || !newTable) {
|
|
114
113
|
return tr;
|
|
@@ -13,6 +13,7 @@ var _messages = require("@atlaskit/editor-common/messages");
|
|
|
13
13
|
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
14
14
|
var _types = require("../../types");
|
|
15
15
|
/** @jsx jsx */
|
|
16
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
16
17
|
|
|
17
18
|
var ColumnResizeWidget = exports.ColumnResizeWidget = function ColumnResizeWidget(_ref) {
|
|
18
19
|
var startIndex = _ref.startIndex,
|
|
@@ -9,6 +9,7 @@ var _button = require("@atlaskit/button");
|
|
|
9
9
|
var _ui = require("@atlaskit/editor-common/ui");
|
|
10
10
|
var _primitives = require("@atlaskit/primitives");
|
|
11
11
|
/** @jsx jsx */
|
|
12
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
12
13
|
|
|
13
14
|
var containerStyles = (0, _primitives.xcss)({
|
|
14
15
|
marginLeft: 'space.100'
|
|
@@ -22,6 +22,8 @@ var _FixedButton = _interopRequireDefault(require("./FixedButton"));
|
|
|
22
22
|
var _styles = require("./styles");
|
|
23
23
|
/** @jsx jsx */
|
|
24
24
|
|
|
25
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
26
|
+
|
|
25
27
|
var BUTTON_OFFSET = 3;
|
|
26
28
|
var FloatingContextualButtonInner = /*#__PURE__*/_react.default.memo(function (props) {
|
|
27
29
|
var editorView = props.editorView,
|
|
@@ -7,6 +7,8 @@ exports.tableFloatingCellButtonStyles = exports.tableFloatingCellButtonSelectedS
|
|
|
7
7
|
var _react = require("@emotion/react");
|
|
8
8
|
var _colors = require("@atlaskit/theme/colors");
|
|
9
9
|
var _consts = require("../consts");
|
|
10
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
11
|
+
|
|
10
12
|
var tableFloatingCellButtonStyles = exports.tableFloatingCellButtonStyles = function tableFloatingCellButtonStyles() {
|
|
11
13
|
return (0, _react.css)({
|
|
12
14
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
|
|
@@ -44,7 +44,7 @@ var _styles2 = require("./styles");
|
|
|
44
44
|
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; }
|
|
45
45
|
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; }
|
|
46
46
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
47
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/prefer-primitives */ /** @jsx jsx */
|
|
47
|
+
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @atlaskit/design-system/prefer-primitives */ /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
48
48
|
var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
49
49
|
(0, _inherits2.default)(ContextualMenu, _Component);
|
|
50
50
|
var _super = _createSuper(ContextualMenu);
|
|
@@ -355,12 +355,12 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
|
|
|
355
355
|
var items = [];
|
|
356
356
|
var getEditorFeatureFlags = _this.props.getEditorFeatureFlags;
|
|
357
357
|
var _ref2 = getEditorFeatureFlags ? getEditorFeatureFlags() : {},
|
|
358
|
-
_ref2$tableSortColumn = _ref2.
|
|
359
|
-
|
|
358
|
+
_ref2$tableSortColumn = _ref2.tableSortColumnReorder,
|
|
359
|
+
tableSortColumnReorder = _ref2$tableSortColumn === void 0 ? false : _ref2$tableSortColumn;
|
|
360
360
|
var sortColumnItems = _this.createSortColumnItems();
|
|
361
361
|
var backgroundColorItem = _this.createBackgroundColorItem();
|
|
362
362
|
var distributeColumnsItem = _this.createDistributeColumnsItem();
|
|
363
|
-
|
|
363
|
+
tableSortColumnReorder && sortColumnItems && items.push.apply(items, (0, _toConsumableArray2.default)(sortColumnItems));
|
|
364
364
|
backgroundColorItem && items.push(backgroundColorItem);
|
|
365
365
|
items.push(_this.createInsertColumnItem());
|
|
366
366
|
items.push(_this.createInsertRowItem());
|
|
@@ -368,7 +368,7 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
|
|
|
368
368
|
items.push(_this.createDeleteRowItem());
|
|
369
369
|
items.push.apply(items, (0, _toConsumableArray2.default)(_this.createMergeSplitCellItems()));
|
|
370
370
|
distributeColumnsItem && items.push(distributeColumnsItem);
|
|
371
|
-
!
|
|
371
|
+
!tableSortColumnReorder && sortColumnItems && items.push.apply(items, (0, _toConsumableArray2.default)(sortColumnItems));
|
|
372
372
|
items.push(_this.createClearCellsItem());
|
|
373
373
|
return [{
|
|
374
374
|
items: items
|
|
@@ -15,6 +15,7 @@ var _consts = require("../consts");
|
|
|
15
15
|
var _ContextualMenu = _interopRequireDefault(require("./ContextualMenu"));
|
|
16
16
|
var _styles = require("./styles");
|
|
17
17
|
/** @jsx jsx */
|
|
18
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
18
19
|
|
|
19
20
|
var FloatingContextualMenu = function FloatingContextualMenu(_ref) {
|
|
20
21
|
var mountPoint = _ref.mountPoint,
|
|
@@ -11,7 +11,7 @@ var _adfSchema = require("@atlaskit/adf-schema");
|
|
|
11
11
|
var _colors = require("@atlaskit/theme/colors");
|
|
12
12
|
var _types = require("../../types");
|
|
13
13
|
var _consts = require("../consts");
|
|
14
|
-
var _templateObject;
|
|
14
|
+
var _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
15
15
|
var cellColourPreviewStyles = exports.cellColourPreviewStyles = function cellColourPreviewStyles(selectedColor) {
|
|
16
16
|
return (0, _react.css)({
|
|
17
17
|
'&::before': {
|
|
@@ -42,6 +42,8 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
|
|
|
42
42
|
/** @jsx jsx */
|
|
43
43
|
/** @jsxFrag */
|
|
44
44
|
|
|
45
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
46
|
+
|
|
45
47
|
var MapDragMenuOptionIdToMessage = {
|
|
46
48
|
add_row_above: {
|
|
47
49
|
message: _messages.tableMessages.addRowAbove,
|
|
@@ -100,16 +102,16 @@ var MapDragMenuOptionIdToMessage = {
|
|
|
100
102
|
plural: null
|
|
101
103
|
}
|
|
102
104
|
};
|
|
103
|
-
var getGroupedDragMenuConfig = function getGroupedDragMenuConfig(
|
|
105
|
+
var getGroupedDragMenuConfig = function getGroupedDragMenuConfig(tableSortColumnReorder) {
|
|
104
106
|
var groupedDragMenuConfig = [['add_row_above', 'add_row_below', 'add_column_left', 'add_column_right', 'distribute_columns', 'clear_cells', 'delete_row', 'delete_column'], ['move_column_left', 'move_column_right', 'move_row_up', 'move_row_down']];
|
|
105
107
|
var sortColumnItems = ['sort_column_asc', 'sort_column_desc'];
|
|
106
|
-
|
|
108
|
+
tableSortColumnReorder ? groupedDragMenuConfig.unshift(sortColumnItems) : groupedDragMenuConfig.push(sortColumnItems);
|
|
107
109
|
return groupedDragMenuConfig;
|
|
108
110
|
};
|
|
109
111
|
var convertToDropdownItems = function convertToDropdownItems(dragMenuConfig, formatMessage) {
|
|
110
|
-
var
|
|
112
|
+
var tableSortColumnReorder = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
111
113
|
var selectionRect = arguments.length > 3 ? arguments[3] : undefined;
|
|
112
|
-
var groupedDragMenuConfig = getGroupedDragMenuConfig(
|
|
114
|
+
var groupedDragMenuConfig = getGroupedDragMenuConfig(tableSortColumnReorder);
|
|
113
115
|
var menuItemsArr = (0, _toConsumableArray2.default)(Array(groupedDragMenuConfig.length)).map(function () {
|
|
114
116
|
return [];
|
|
115
117
|
});
|
|
@@ -206,7 +208,7 @@ var DragMenu = exports.DragMenu = /*#__PURE__*/_react.default.memo(function (_re
|
|
|
206
208
|
tableDuplicateCellColouring = _ref.tableDuplicateCellColouring,
|
|
207
209
|
shouldUseIncreasedScalingPercent = _ref.shouldUseIncreasedScalingPercent,
|
|
208
210
|
isTableFixedColumnWidthsOptionEnabled = _ref.isTableFixedColumnWidthsOptionEnabled,
|
|
209
|
-
|
|
211
|
+
tableSortColumnReorder = _ref.tableSortColumnReorder;
|
|
210
212
|
var state = editorView.state,
|
|
211
213
|
dispatch = editorView.dispatch;
|
|
212
214
|
var selection = state.selection;
|
|
@@ -230,8 +232,8 @@ var DragMenu = exports.DragMenu = /*#__PURE__*/_react.default.memo(function (_re
|
|
|
230
232
|
hasMergedCellsInTable = (0, _utils3.getMergedCellsPositions)(state.tr).length > 0;
|
|
231
233
|
}
|
|
232
234
|
var allowBackgroundColor = (_pluginConfig$allowBa = pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.allowBackgroundColor) !== null && _pluginConfig$allowBa !== void 0 ? _pluginConfig$allowBa : false;
|
|
233
|
-
var dragMenuConfig = (0, _dragMenu.getDragMenuConfig)(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled, tableDuplicateCellColouring, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent,
|
|
234
|
-
var _convertToDropdownIte = convertToDropdownItems(dragMenuConfig, formatMessage,
|
|
235
|
+
var dragMenuConfig = (0, _dragMenu.getDragMenuConfig)(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled, tableDuplicateCellColouring, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, tableSortColumnReorder);
|
|
236
|
+
var _convertToDropdownIte = convertToDropdownItems(dragMenuConfig, formatMessage, tableSortColumnReorder, selectionRect),
|
|
235
237
|
menuItems = _convertToDropdownIte.menuItems,
|
|
236
238
|
menuCallback = _convertToDropdownIte.menuCallback;
|
|
237
239
|
var handleSubMenuRef = function handleSubMenuRef(ref) {
|
|
@@ -282,7 +284,7 @@ var DragMenu = exports.DragMenu = /*#__PURE__*/_react.default.memo(function (_re
|
|
|
282
284
|
className: _styles.DropdownMenuSharedCssClassName.SUBMENU
|
|
283
285
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
284
286
|
,
|
|
285
|
-
css: (0, _styles2.dragMenuBackgroundColorStyles)(
|
|
287
|
+
css: (0, _styles2.dragMenuBackgroundColorStyles)(tableSortColumnReorder)
|
|
286
288
|
}, (0, _react2.jsx)("div", {
|
|
287
289
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
288
290
|
css: (0, _styles2.cellColourPreviewStyles)(background)
|
|
@@ -480,7 +482,7 @@ var DragMenu = exports.DragMenu = /*#__PURE__*/_react.default.memo(function (_re
|
|
|
480
482
|
return null;
|
|
481
483
|
}
|
|
482
484
|
if (allowBackgroundColor) {
|
|
483
|
-
|
|
485
|
+
tableSortColumnReorder ? menuItems[1].items.unshift(createBackgroundColorMenuItem()) : menuItems[0].items.unshift(createBackgroundColorMenuItem());
|
|
484
486
|
}
|
|
485
487
|
|
|
486
488
|
// If first row, add toggle for Header row, default is true
|
|
@@ -42,8 +42,8 @@ var FloatingDragMenu = function FloatingDragMenu(_ref) {
|
|
|
42
42
|
tableDuplicateCellColouring = _ref2$tableDuplicateC === void 0 ? false : _ref2$tableDuplicateC,
|
|
43
43
|
_ref2$tableWithFixedC = _ref2.tableWithFixedColumnWidthsOption,
|
|
44
44
|
tableWithFixedColumnWidthsOption = _ref2$tableWithFixedC === void 0 ? false : _ref2$tableWithFixedC,
|
|
45
|
-
_ref2$tableSortColumn = _ref2.
|
|
46
|
-
|
|
45
|
+
_ref2$tableSortColumn = _ref2.tableSortColumnReorder,
|
|
46
|
+
tableSortColumnReorder = _ref2$tableSortColumn === void 0 ? false : _ref2$tableSortColumn;
|
|
47
47
|
var shouldUseIncreasedScalingPercent = isTableScalingEnabled && tableWithFixedColumnWidthsOption && (0, _platformFeatureFlags.getBooleanFF)('platform.editor.table.use-increased-scaling-percent');
|
|
48
48
|
return /*#__PURE__*/_react.default.createElement(_ui.Popup, {
|
|
49
49
|
alignX: direction === 'row' ? 'right' : undefined,
|
|
@@ -82,7 +82,7 @@ var FloatingDragMenu = function FloatingDragMenu(_ref) {
|
|
|
82
82
|
tableDuplicateCellColouring: tableDuplicateCellColouring,
|
|
83
83
|
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
|
|
84
84
|
isTableFixedColumnWidthsOptionEnabled: tableWithFixedColumnWidthsOption,
|
|
85
|
-
|
|
85
|
+
tableSortColumnReorder: tableSortColumnReorder
|
|
86
86
|
}));
|
|
87
87
|
};
|
|
88
88
|
FloatingDragMenu.displayName = 'FloatingDragMenu';
|
|
@@ -11,7 +11,7 @@ var _adfSchema = require("@atlaskit/adf-schema");
|
|
|
11
11
|
var _colors = require("@atlaskit/theme/colors");
|
|
12
12
|
var _types = require("../../types");
|
|
13
13
|
var _consts = require("../consts");
|
|
14
|
-
var _templateObject;
|
|
14
|
+
var _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
15
15
|
var cellColourPreviewStyles = exports.cellColourPreviewStyles = function cellColourPreviewStyles(selectedColor) {
|
|
16
16
|
return (0, _react.css)({
|
|
17
17
|
'&::before': {
|
|
@@ -29,8 +29,8 @@ var elementBeforeIconStyles = exports.elementBeforeIconStyles = (0, _react.css)(
|
|
|
29
29
|
|
|
30
30
|
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
|
|
31
31
|
var dragMenuBackgroundColorStyles = exports.dragMenuBackgroundColorStyles = function dragMenuBackgroundColorStyles() {
|
|
32
|
-
var
|
|
33
|
-
return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: ", "px; // move the submenu down when 'sort increasing/decreasing' appear before background color picker\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.DRAG_SUBMENU, "var(--ds-border-radius, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"),
|
|
32
|
+
var tableSortColumnReorder = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
33
|
+
return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tborder-radius: ", ";\n\t\tbackground: ", ";\n\t\tbox-shadow: ", ";\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\ttop: ", "px; // move the submenu down when 'sort increasing/decreasing' appear before background color picker\n\t\tleft: ", "px;\n\t\tpadding: ", ";\n\n\t\t> div {\n\t\t\tpadding: 0;\n\t\t}\n\t}\n\n\t.", " {\n\t\tdisplay: flex;\n\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tdisplay: block;\n\t\t\tborder: 1px solid ", ";\n\t\t\tborder-radius: ", ";\n\t\t\twidth: 14px;\n\t\t\theight: 14px;\n\t\t}\n\n\t\t&::after {\n\t\t\tcontent: '\u203A';\n\t\t\tmargin-left: ", ";\n\t\t\tline-height: 14px;\n\t\t\tcolor: ", ";\n\t\t}\n\t}\n"])), _types.TableCssClassName.DRAG_SUBMENU, "var(--ds-border-radius, 3px)", "var(--ds-surface-overlay, white)", "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N60A, ", 0 0 1px ").concat(_colors.N60A), ")"), tableSortColumnReorder ? _consts.TABLE_DRAG_MENU_PADDING_TOP + _consts.TABLE_DRAG_MENU_SORT_GROUP_HEIGHT + _consts.TABLE_DRAG_MENU_MENU_GROUP_BEFORE_HEIGHT : 0, _consts.dragMenuDropdownWidth, "var(--ds-space-100, 8px)", _types.TableCssClassName.DRAG_SUBMENU_ICON, _adfSchema.tableBackgroundBorderColor, "var(--ds-border-radius, 3px)", "var(--ds-space-050, 4px)", "var(--ds-icon, ".concat(_colors.N90, ")"));
|
|
34
34
|
};
|
|
35
35
|
|
|
36
36
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/design-system/no-exported-css -- Ignored via go/DSP-18766
|
|
@@ -11,7 +11,6 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
11
11
|
var _reactIntlNext = require("react-intl-next");
|
|
12
12
|
var _editorTables = require("@atlaskit/editor-tables");
|
|
13
13
|
var _utils = require("@atlaskit/editor-tables/utils");
|
|
14
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
14
|
var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
|
|
16
15
|
var _commands = require("../../../commands");
|
|
17
16
|
var _commands2 = require("../../../pm-plugins/drag-and-drop/commands");
|
|
@@ -101,26 +100,15 @@ var DragControlsComponent = function DragControlsComponent(_ref) {
|
|
|
101
100
|
}
|
|
102
101
|
}, [editorView, tableActive]);
|
|
103
102
|
var handleMouseMove = (0, _react.useCallback)(function (e) {
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
var _rowIndex = target === null || target === void 0 ? void 0 : target.getAttribute('data-start-index');
|
|
103
|
+
var target = e.nativeEvent.target instanceof Element ? e.nativeEvent.target : null;
|
|
104
|
+
var isParentDragControls = target === null || target === void 0 ? void 0 : target.closest(".".concat(_types.TableCssClassName.DRAG_ROW_CONTROLS));
|
|
105
|
+
var rowIndex = target === null || target === void 0 ? void 0 : target.getAttribute('data-start-index');
|
|
108
106
|
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
updateCellHoverLocation(Number(_rowIndex));
|
|
114
|
-
} else {
|
|
115
|
-
var _isParentDragControls = e.nativeEvent.target.closest(".".concat(_types.TableCssClassName.DRAG_ROW_CONTROLS));
|
|
116
|
-
var _rowIndex2 = e.nativeEvent.target.getAttribute('data-start-index');
|
|
117
|
-
|
|
118
|
-
// avoid updating if event target is not related
|
|
119
|
-
if (!_isParentDragControls || !_rowIndex2) {
|
|
120
|
-
return;
|
|
121
|
-
}
|
|
122
|
-
updateCellHoverLocation(Number(_rowIndex2));
|
|
107
|
+
// avoid updating if event target is not related
|
|
108
|
+
if (!isParentDragControls || !rowIndex) {
|
|
109
|
+
return;
|
|
123
110
|
}
|
|
111
|
+
updateCellHoverLocation(Number(rowIndex));
|
|
124
112
|
}, [updateCellHoverLocation]);
|
|
125
113
|
var rowIndexes = (0, _react.useMemo)(function () {
|
|
126
114
|
return [rowIndex];
|
|
@@ -21,6 +21,7 @@ var _consts2 = require("./consts");
|
|
|
21
21
|
var _uiStyles = require("./ui-styles");
|
|
22
22
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
|
|
23
23
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression */
|
|
24
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
24
25
|
var cornerControlHeight = _consts2.tableToolbarSize + 1;
|
|
25
26
|
|
|
26
27
|
/*
|
package/dist/cjs/ui/ui-styles.js
CHANGED
|
@@ -14,6 +14,7 @@ var _types = require("../types");
|
|
|
14
14
|
var _consts = require("./consts");
|
|
15
15
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25;
|
|
16
16
|
/* eslint-disable @atlaskit/design-system/no-css-tagged-template-expression -- needs mahual remediation */
|
|
17
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
17
18
|
var InsertLine = function InsertLine(cssString) {
|
|
18
19
|
return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t.", " {\n\t\tbackground: ", ";\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tz-index: ", ";\n\t\t", "\n\t}\n"])), _types.TableCssClassName.CONTROLS_INSERT_LINE, _consts.tableBorderSelectedColor, _editorSharedStyles.akEditorUnitZIndex, cssString);
|
|
19
20
|
};
|
|
@@ -81,7 +81,7 @@ var getDragMenuConfig = exports.getDragMenuConfig = function getDragMenuConfig(d
|
|
|
81
81
|
var tableDuplicateCellColouring = arguments.length > 12 && arguments[12] !== undefined ? arguments[12] : false;
|
|
82
82
|
var isTableFixedColumnWidthsOptionEnabled = arguments.length > 13 && arguments[13] !== undefined ? arguments[13] : false;
|
|
83
83
|
var shouldUseIncreasedScalingPercent = arguments.length > 14 && arguments[14] !== undefined ? arguments[14] : false;
|
|
84
|
-
var
|
|
84
|
+
var tableSortColumnReorder = arguments.length > 15 && arguments[15] !== undefined ? arguments[15] : false;
|
|
85
85
|
var selection = editorView.state.selection;
|
|
86
86
|
var addOptions = direction === 'row' ? [{
|
|
87
87
|
label: 'above',
|
|
@@ -251,6 +251,6 @@ var getDragMenuConfig = exports.getDragMenuConfig = function getDragMenuConfig(d
|
|
|
251
251
|
};
|
|
252
252
|
})));
|
|
253
253
|
var allConfigs = (0, _toConsumableArray2.default)(restConfigs);
|
|
254
|
-
|
|
254
|
+
tableSortColumnReorder ? allConfigs.unshift.apply(allConfigs, (0, _toConsumableArray2.default)(sortConfigs)) : allConfigs.push.apply(allConfigs, (0, _toConsumableArray2.default)(sortConfigs));
|
|
255
255
|
return allConfigs.filter(Boolean);
|
|
256
256
|
};
|
|
@@ -179,12 +179,8 @@ export const changeColumnWidthByStep = ({
|
|
|
179
179
|
const domAtPos = view.domAtPos.bind(view);
|
|
180
180
|
const colIndex = map.colCount($cell.pos - tableStartPosition) + ($cell.nodeAfter ? $cell.nodeAfter.attrs.colspan : 1) - 1;
|
|
181
181
|
let dom = null;
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
dom = domAtPosition.node instanceof HTMLTableElement ? domAtPosition.node : null;
|
|
185
|
-
} else {
|
|
186
|
-
dom = domAtPos(tableStartPosition).node;
|
|
187
|
-
}
|
|
182
|
+
const domAtPosition = domAtPos(tableStartPosition);
|
|
183
|
+
dom = domAtPosition.node instanceof HTMLTableElement ? domAtPosition.node : null;
|
|
188
184
|
if (dom && dom.nodeName !== 'TABLE') {
|
|
189
185
|
dom = dom.closest('table');
|
|
190
186
|
}
|
|
@@ -294,7 +294,7 @@ export const getNewResizeStateFromSelectedColumns = (rect, state, domAtPos, getE
|
|
|
294
294
|
}
|
|
295
295
|
const maybeTable = domAtPos(table.start).node;
|
|
296
296
|
const maybeTableElement = maybeTable instanceof HTMLElement ? maybeTable : null;
|
|
297
|
-
const tableRef =
|
|
297
|
+
const tableRef = maybeTableElement === null || maybeTableElement === void 0 ? void 0 : maybeTableElement.closest('table');
|
|
298
298
|
if (!tableRef) {
|
|
299
299
|
return;
|
|
300
300
|
}
|
package/dist/es2019/toolbar.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
/** @jsx jsx */
|
|
3
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
4
|
import { jsx } from '@emotion/react';
|
|
4
5
|
import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
|
|
5
6
|
import { CHANGE_ALIGNMENT_REASON, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
2
2
|
import { AttrStep } from '@atlaskit/editor-prosemirror/transform';
|
|
3
3
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
4
|
-
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
5
4
|
import { getTableContainerElementWidth, getTableElementWidth, hasTableBeenResized } from '../pm-plugins/table-resizing/utils';
|
|
6
5
|
import { isMinCellWidthTable } from '../pm-plugins/table-resizing/utils/colgroup';
|
|
7
6
|
import { getResizeState } from '../pm-plugins/table-resizing/utils/resize-state';
|
|
@@ -95,7 +94,7 @@ export const rescaleColumns = (isTableScalingEnabled = false, isTableFixedColumn
|
|
|
95
94
|
const newTable = tr.doc.nodeAt(table.pos);
|
|
96
95
|
const domAtPos = view.domAtPos.bind(view);
|
|
97
96
|
const maybeTable = domAtPos(table.start).node;
|
|
98
|
-
const maybeTableElement =
|
|
97
|
+
const maybeTableElement = maybeTable instanceof HTMLElement ? maybeTable : null;
|
|
99
98
|
const tableRef = maybeTableElement === null || maybeTableElement === void 0 ? void 0 : maybeTableElement.closest('table');
|
|
100
99
|
if (!tableRef || !newTable) {
|
|
101
100
|
return tr;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
/** @jsx jsx */
|
|
3
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
4
|
import { jsx } from '@emotion/react';
|
|
4
5
|
import { useIntl } from 'react-intl-next';
|
|
5
6
|
import { startColumnResizing, ToolTipContent } from '@atlaskit/editor-common/keymaps';
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
2
3
|
import { jsx } from '@emotion/react';
|
|
3
4
|
import { ButtonGroup } from '@atlaskit/button';
|
|
4
5
|
import { FloatingToolbarButton as Button, FloatingToolbarSeparator } from '@atlaskit/editor-common/ui';
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
2
|
import React from 'react';
|
|
3
|
+
|
|
4
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
5
|
import { jsx } from '@emotion/react';
|
|
4
6
|
import { injectIntl } from 'react-intl-next';
|
|
5
7
|
import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
|
|
@@ -2,6 +2,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
2
2
|
/* eslint-disable @atlaskit/design-system/prefer-primitives */
|
|
3
3
|
/** @jsx jsx */
|
|
4
4
|
import { Component } from 'react';
|
|
5
|
+
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
5
7
|
import { jsx } from '@emotion/react';
|
|
6
8
|
import { injectIntl } from 'react-intl-next';
|
|
7
9
|
import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
|
|
@@ -386,12 +388,12 @@ export class ContextualMenu extends Component {
|
|
|
386
388
|
getEditorFeatureFlags
|
|
387
389
|
} = this.props;
|
|
388
390
|
const {
|
|
389
|
-
|
|
391
|
+
tableSortColumnReorder = false
|
|
390
392
|
} = getEditorFeatureFlags ? getEditorFeatureFlags() : {};
|
|
391
393
|
const sortColumnItems = this.createSortColumnItems();
|
|
392
394
|
const backgroundColorItem = this.createBackgroundColorItem();
|
|
393
395
|
const distributeColumnsItem = this.createDistributeColumnsItem();
|
|
394
|
-
|
|
396
|
+
tableSortColumnReorder && sortColumnItems && items.push(...sortColumnItems);
|
|
395
397
|
backgroundColorItem && items.push(backgroundColorItem);
|
|
396
398
|
items.push(this.createInsertColumnItem());
|
|
397
399
|
items.push(this.createInsertRowItem());
|
|
@@ -399,7 +401,7 @@ export class ContextualMenu extends Component {
|
|
|
399
401
|
items.push(this.createDeleteRowItem());
|
|
400
402
|
items.push(...this.createMergeSplitCellItems());
|
|
401
403
|
distributeColumnsItem && items.push(distributeColumnsItem);
|
|
402
|
-
!
|
|
404
|
+
!tableSortColumnReorder && sortColumnItems && items.push(...sortColumnItems);
|
|
403
405
|
items.push(this.createClearCellsItem());
|
|
404
406
|
return [{
|
|
405
407
|
items
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/** @jsx jsx */
|
|
2
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
2
3
|
import { jsx } from '@emotion/react';
|
|
3
4
|
import { Popup } from '@atlaskit/editor-common/ui';
|
|
4
5
|
import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
|
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
/** @jsx jsx */
|
|
3
3
|
/** @jsxFrag */
|
|
4
4
|
import React, { useEffect, useState } from 'react';
|
|
5
|
+
|
|
6
|
+
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
5
7
|
import { jsx } from '@emotion/react';
|
|
6
8
|
import { injectIntl } from 'react-intl-next';
|
|
7
9
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
@@ -87,14 +89,14 @@ const MapDragMenuOptionIdToMessage = {
|
|
|
87
89
|
plural: null
|
|
88
90
|
}
|
|
89
91
|
};
|
|
90
|
-
const getGroupedDragMenuConfig =
|
|
92
|
+
const getGroupedDragMenuConfig = tableSortColumnReorder => {
|
|
91
93
|
let groupedDragMenuConfig = [['add_row_above', 'add_row_below', 'add_column_left', 'add_column_right', 'distribute_columns', 'clear_cells', 'delete_row', 'delete_column'], ['move_column_left', 'move_column_right', 'move_row_up', 'move_row_down']];
|
|
92
94
|
const sortColumnItems = ['sort_column_asc', 'sort_column_desc'];
|
|
93
|
-
|
|
95
|
+
tableSortColumnReorder ? groupedDragMenuConfig.unshift(sortColumnItems) : groupedDragMenuConfig.push(sortColumnItems);
|
|
94
96
|
return groupedDragMenuConfig;
|
|
95
97
|
};
|
|
96
|
-
const convertToDropdownItems = (dragMenuConfig, formatMessage,
|
|
97
|
-
const groupedDragMenuConfig = getGroupedDragMenuConfig(
|
|
98
|
+
const convertToDropdownItems = (dragMenuConfig, formatMessage, tableSortColumnReorder = false, selectionRect) => {
|
|
99
|
+
const groupedDragMenuConfig = getGroupedDragMenuConfig(tableSortColumnReorder);
|
|
98
100
|
let menuItemsArr = [...Array(groupedDragMenuConfig.length)].map(() => []);
|
|
99
101
|
let menuCallback = {};
|
|
100
102
|
dragMenuConfig.forEach(item => {
|
|
@@ -189,7 +191,7 @@ export const DragMenu = /*#__PURE__*/React.memo(({
|
|
|
189
191
|
tableDuplicateCellColouring,
|
|
190
192
|
shouldUseIncreasedScalingPercent,
|
|
191
193
|
isTableFixedColumnWidthsOptionEnabled,
|
|
192
|
-
|
|
194
|
+
tableSortColumnReorder
|
|
193
195
|
}) => {
|
|
194
196
|
var _pluginConfig$allowBa;
|
|
195
197
|
const {
|
|
@@ -217,11 +219,11 @@ export const DragMenu = /*#__PURE__*/React.memo(({
|
|
|
217
219
|
hasMergedCellsInTable = getMergedCellsPositions(state.tr).length > 0;
|
|
218
220
|
}
|
|
219
221
|
const allowBackgroundColor = (_pluginConfig$allowBa = pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.allowBackgroundColor) !== null && _pluginConfig$allowBa !== void 0 ? _pluginConfig$allowBa : false;
|
|
220
|
-
const dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled, tableDuplicateCellColouring, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent,
|
|
222
|
+
const dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled, tableDuplicateCellColouring, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, tableSortColumnReorder);
|
|
221
223
|
const {
|
|
222
224
|
menuItems,
|
|
223
225
|
menuCallback
|
|
224
|
-
} = convertToDropdownItems(dragMenuConfig, formatMessage,
|
|
226
|
+
} = convertToDropdownItems(dragMenuConfig, formatMessage, tableSortColumnReorder, selectionRect);
|
|
225
227
|
const handleSubMenuRef = ref => {
|
|
226
228
|
const parent = closestElement(editorView.dom, '.fabric-editor-popup-scroll-parent');
|
|
227
229
|
if (!(parent && ref)) {
|
|
@@ -275,7 +277,7 @@ export const DragMenu = /*#__PURE__*/React.memo(({
|
|
|
275
277
|
className: DropdownMenuSharedCssClassName.SUBMENU
|
|
276
278
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
277
279
|
,
|
|
278
|
-
css: dragMenuBackgroundColorStyles(
|
|
280
|
+
css: dragMenuBackgroundColorStyles(tableSortColumnReorder)
|
|
279
281
|
}, jsx("div", {
|
|
280
282
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
|
|
281
283
|
css: cellColourPreviewStyles(background)
|
|
@@ -478,7 +480,7 @@ export const DragMenu = /*#__PURE__*/React.memo(({
|
|
|
478
480
|
return null;
|
|
479
481
|
}
|
|
480
482
|
if (allowBackgroundColor) {
|
|
481
|
-
|
|
483
|
+
tableSortColumnReorder ? menuItems[1].items.unshift(createBackgroundColorMenuItem()) : menuItems[0].items.unshift(createBackgroundColorMenuItem());
|
|
482
484
|
}
|
|
483
485
|
|
|
484
486
|
// If first row, add toggle for Header row, default is true
|
|
@@ -34,7 +34,7 @@ const FloatingDragMenu = ({
|
|
|
34
34
|
const {
|
|
35
35
|
tableDuplicateCellColouring = false,
|
|
36
36
|
tableWithFixedColumnWidthsOption = false,
|
|
37
|
-
|
|
37
|
+
tableSortColumnReorder = false
|
|
38
38
|
} = getEditorFeatureFlags ? getEditorFeatureFlags() : {};
|
|
39
39
|
const shouldUseIncreasedScalingPercent = isTableScalingEnabled && tableWithFixedColumnWidthsOption && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
40
40
|
return /*#__PURE__*/React.createElement(Popup, {
|
|
@@ -74,7 +74,7 @@ const FloatingDragMenu = ({
|
|
|
74
74
|
tableDuplicateCellColouring: tableDuplicateCellColouring,
|
|
75
75
|
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent,
|
|
76
76
|
isTableFixedColumnWidthsOptionEnabled: tableWithFixedColumnWidthsOption,
|
|
77
|
-
|
|
77
|
+
tableSortColumnReorder: tableSortColumnReorder
|
|
78
78
|
}));
|
|
79
79
|
};
|
|
80
80
|
FloatingDragMenu.displayName = 'FloatingDragMenu';
|