@atlaskit/editor-plugin-table 24.3.3 → 24.3.4
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 +9 -0
- package/dist/cjs/ui/TableMenu/column/items/SortDecreasingItem.compiled.css +3 -0
- package/dist/cjs/ui/TableMenu/column/items/SortDecreasingItem.js +41 -0
- package/dist/cjs/ui/TableMenu/column/items/SortIncreasingItem.compiled.css +3 -0
- package/dist/cjs/ui/TableMenu/column/items/SortIncreasingItem.js +41 -0
- package/dist/es2019/ui/TableMenu/column/items/SortDecreasingItem.compiled.css +3 -0
- package/dist/es2019/ui/TableMenu/column/items/SortDecreasingItem.js +40 -1
- package/dist/es2019/ui/TableMenu/column/items/SortIncreasingItem.compiled.css +3 -0
- package/dist/es2019/ui/TableMenu/column/items/SortIncreasingItem.js +40 -1
- package/dist/esm/ui/TableMenu/column/items/SortDecreasingItem.compiled.css +3 -0
- package/dist/esm/ui/TableMenu/column/items/SortDecreasingItem.js +42 -1
- package/dist/esm/ui/TableMenu/column/items/SortIncreasingItem.compiled.css +3 -0
- package/dist/esm/ui/TableMenu/column/items/SortIncreasingItem.js +42 -1
- package/dist/types/ui/TableMenu/column/items/SortDecreasingItem.d.ts +4 -0
- package/dist/types/ui/TableMenu/column/items/SortIncreasingItem.d.ts +4 -0
- package/package.json +17 -14
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 24.3.4
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`cc7e55c918e23`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cc7e55c918e23) -
|
|
8
|
+
[ux] Adds info icon next to visually disabled table column sort buttons with a tooltip explaining
|
|
9
|
+
that sort won't work when merged cells present.
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
3
12
|
## 24.3.3
|
|
4
13
|
|
|
5
14
|
### Patch Changes
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* SortDecreasingItem.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
@@ -5,6 +6,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.SortDecreasingItem = void 0;
|
|
9
|
+
require("./SortDecreasingItem.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
11
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
8
12
|
var _react = _interopRequireDefault(require("react"));
|
|
9
13
|
var _reactIntl = require("react-intl");
|
|
10
14
|
var _customSteps = require("@atlaskit/custom-steps");
|
|
@@ -12,9 +16,16 @@ var _analytics = require("@atlaskit/editor-common/analytics");
|
|
|
12
16
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
13
17
|
var _utils = require("@atlaskit/editor-tables/utils");
|
|
14
18
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
19
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
20
|
+
var _compiled = require("@atlaskit/primitives/compiled");
|
|
21
|
+
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
15
22
|
var _commands = require("../../../../pm-plugins/commands");
|
|
16
23
|
var _commandsWithAnalytics = require("../../../../pm-plugins/commands/commands-with-analytics");
|
|
17
24
|
var _TableMenuContext = require("../../shared/TableMenuContext");
|
|
25
|
+
var styles = {
|
|
26
|
+
disabledLabel: "_syaz1gmx",
|
|
27
|
+
infoIconTrigger: "_1e0c116y _4cvr1h6o"
|
|
28
|
+
};
|
|
18
29
|
var SortDecreasingItem = exports.SortDecreasingItem = function SortDecreasingItem(_ref) {
|
|
19
30
|
var api = _ref.api;
|
|
20
31
|
var tableMenuContext = (0, _TableMenuContext.useTableMenuContext)();
|
|
@@ -22,6 +33,7 @@ var SortDecreasingItem = exports.SortDecreasingItem = function SortDecreasingIte
|
|
|
22
33
|
editorView = _ref2.editorView;
|
|
23
34
|
var _useIntl = (0, _reactIntl.useIntl)(),
|
|
24
35
|
formatMessage = _useIntl.formatMessage;
|
|
36
|
+
var hasMergedCellsInTable = Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable);
|
|
25
37
|
var handleClick = function handleClick() {
|
|
26
38
|
var _api$analytics;
|
|
27
39
|
if (!editorView) {
|
|
@@ -36,6 +48,35 @@ var SortDecreasingItem = exports.SortDecreasingItem = function SortDecreasingIte
|
|
|
36
48
|
api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
|
|
37
49
|
api === null || api === void 0 || api.core.actions.focus();
|
|
38
50
|
};
|
|
51
|
+
|
|
52
|
+
// When the table has merged cells, the item remains interactive but is rendered
|
|
53
|
+
// with a disabled-looking label and leading icon, alongside an enabled info icon
|
|
54
|
+
// that surfaces why sorting is unavailable.
|
|
55
|
+
if (hasMergedCellsInTable && (0, _platformFeatureFlags.fg)('platform_editor_table_menu_updates_patch_1')) {
|
|
56
|
+
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
57
|
+
elemBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.SortDescendingIcon, {
|
|
58
|
+
label: "",
|
|
59
|
+
size: "small",
|
|
60
|
+
color: "var(--ds-text-disabled, #080F214A)"
|
|
61
|
+
}),
|
|
62
|
+
elemAfter: /*#__PURE__*/_react.default.createElement(_tooltip.default, {
|
|
63
|
+
content: formatMessage(_messages.tableMessages.canNotSortTableNoIcon),
|
|
64
|
+
position: "top"
|
|
65
|
+
}, function (tooltipProps) {
|
|
66
|
+
return /*#__PURE__*/_react.default.createElement(_compiled.Box, (0, _extends2.default)({
|
|
67
|
+
as: "span",
|
|
68
|
+
xcss: styles.infoIconTrigger
|
|
69
|
+
}, tooltipProps), /*#__PURE__*/_react.default.createElement(_editorToolbar.InformationCircleIcon, {
|
|
70
|
+
label: "",
|
|
71
|
+
size: "small",
|
|
72
|
+
color: "var(--ds-icon, #292A2E)"
|
|
73
|
+
}));
|
|
74
|
+
})
|
|
75
|
+
}, /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
76
|
+
as: "span",
|
|
77
|
+
xcss: styles.disabledLabel
|
|
78
|
+
}, formatMessage(_messages.tableMessages.sortColumnDecreasing)));
|
|
79
|
+
}
|
|
39
80
|
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
40
81
|
onClick: handleClick,
|
|
41
82
|
isDisabled: Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable),
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* SortIncreasingItem.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
1
2
|
"use strict";
|
|
2
3
|
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
@@ -5,6 +6,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.SortIncreasingItem = void 0;
|
|
9
|
+
require("./SortIncreasingItem.compiled.css");
|
|
10
|
+
var _runtime = require("@compiled/react/runtime");
|
|
11
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
8
12
|
var _react = _interopRequireDefault(require("react"));
|
|
9
13
|
var _reactIntl = require("react-intl");
|
|
10
14
|
var _customSteps = require("@atlaskit/custom-steps");
|
|
@@ -12,9 +16,16 @@ var _analytics = require("@atlaskit/editor-common/analytics");
|
|
|
12
16
|
var _messages = require("@atlaskit/editor-common/messages");
|
|
13
17
|
var _utils = require("@atlaskit/editor-tables/utils");
|
|
14
18
|
var _editorToolbar = require("@atlaskit/editor-toolbar");
|
|
19
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
20
|
+
var _compiled = require("@atlaskit/primitives/compiled");
|
|
21
|
+
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
15
22
|
var _commands = require("../../../../pm-plugins/commands");
|
|
16
23
|
var _commandsWithAnalytics = require("../../../../pm-plugins/commands/commands-with-analytics");
|
|
17
24
|
var _TableMenuContext = require("../../shared/TableMenuContext");
|
|
25
|
+
var styles = {
|
|
26
|
+
disabledLabel: "_syaz1gmx",
|
|
27
|
+
infoIconTrigger: "_1e0c116y _4cvr1h6o"
|
|
28
|
+
};
|
|
18
29
|
var SortIncreasingItem = exports.SortIncreasingItem = function SortIncreasingItem(_ref) {
|
|
19
30
|
var api = _ref.api;
|
|
20
31
|
var tableMenuContext = (0, _TableMenuContext.useTableMenuContext)();
|
|
@@ -22,6 +33,7 @@ var SortIncreasingItem = exports.SortIncreasingItem = function SortIncreasingIte
|
|
|
22
33
|
editorView = _ref2.editorView;
|
|
23
34
|
var _useIntl = (0, _reactIntl.useIntl)(),
|
|
24
35
|
formatMessage = _useIntl.formatMessage;
|
|
36
|
+
var hasMergedCellsInTable = Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable);
|
|
25
37
|
var handleClick = function handleClick() {
|
|
26
38
|
var _api$analytics;
|
|
27
39
|
if (!editorView) {
|
|
@@ -36,6 +48,35 @@ var SortIncreasingItem = exports.SortIncreasingItem = function SortIncreasingIte
|
|
|
36
48
|
api === null || api === void 0 || api.core.actions.execute((0, _commands.closeActiveTableMenu)(api));
|
|
37
49
|
api === null || api === void 0 || api.core.actions.focus();
|
|
38
50
|
};
|
|
51
|
+
|
|
52
|
+
// When the table has merged cells, the item remains interactive but is rendered
|
|
53
|
+
// with a disabled-looking label and leading icon, alongside an enabled info icon
|
|
54
|
+
// that surfaces why sorting is unavailable.
|
|
55
|
+
if (hasMergedCellsInTable && (0, _platformFeatureFlags.fg)('platform_editor_table_menu_updates_patch_1')) {
|
|
56
|
+
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
57
|
+
elemBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.SortAscendingIcon, {
|
|
58
|
+
label: "",
|
|
59
|
+
size: "small",
|
|
60
|
+
color: "var(--ds-text-disabled, #080F214A)"
|
|
61
|
+
}),
|
|
62
|
+
elemAfter: /*#__PURE__*/_react.default.createElement(_tooltip.default, {
|
|
63
|
+
content: formatMessage(_messages.tableMessages.canNotSortTableNoIcon),
|
|
64
|
+
position: "top"
|
|
65
|
+
}, function (tooltipProps) {
|
|
66
|
+
return /*#__PURE__*/_react.default.createElement(_compiled.Box, (0, _extends2.default)({
|
|
67
|
+
as: "span",
|
|
68
|
+
xcss: styles.infoIconTrigger
|
|
69
|
+
}, tooltipProps), /*#__PURE__*/_react.default.createElement(_editorToolbar.InformationCircleIcon, {
|
|
70
|
+
label: "",
|
|
71
|
+
size: "small",
|
|
72
|
+
color: "var(--ds-icon, #292A2E)"
|
|
73
|
+
}));
|
|
74
|
+
})
|
|
75
|
+
}, /*#__PURE__*/_react.default.createElement(_compiled.Box, {
|
|
76
|
+
as: "span",
|
|
77
|
+
xcss: styles.disabledLabel
|
|
78
|
+
}, formatMessage(_messages.tableMessages.sortColumnIncreasing)));
|
|
79
|
+
}
|
|
39
80
|
return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
|
|
40
81
|
onClick: handleClick,
|
|
41
82
|
isDisabled: Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable),
|
|
@@ -1,13 +1,24 @@
|
|
|
1
|
+
/* SortDecreasingItem.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import "./SortDecreasingItem.compiled.css";
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
5
|
import React from 'react';
|
|
2
6
|
import { useIntl } from 'react-intl';
|
|
3
7
|
import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
|
|
4
8
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
5
9
|
import { tableMessages as messages } from '@atlaskit/editor-common/messages';
|
|
6
10
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
7
|
-
import { SortDescendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
11
|
+
import { InformationCircleIcon, SortDescendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
12
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
14
|
+
import Tooltip from '@atlaskit/tooltip';
|
|
8
15
|
import { closeActiveTableMenu } from '../../../../pm-plugins/commands';
|
|
9
16
|
import { sortColumnWithAnalytics } from '../../../../pm-plugins/commands/commands-with-analytics';
|
|
10
17
|
import { useTableMenuContext } from '../../shared/TableMenuContext';
|
|
18
|
+
const styles = {
|
|
19
|
+
disabledLabel: "_syaz1gmx",
|
|
20
|
+
infoIconTrigger: "_1e0c116y _4cvr1h6o"
|
|
21
|
+
};
|
|
11
22
|
export const SortDecreasingItem = ({
|
|
12
23
|
api
|
|
13
24
|
}) => {
|
|
@@ -18,6 +29,7 @@ export const SortDecreasingItem = ({
|
|
|
18
29
|
const {
|
|
19
30
|
formatMessage
|
|
20
31
|
} = useIntl();
|
|
32
|
+
const hasMergedCellsInTable = Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable);
|
|
21
33
|
const handleClick = () => {
|
|
22
34
|
var _api$analytics;
|
|
23
35
|
if (!editorView) {
|
|
@@ -32,6 +44,33 @@ export const SortDecreasingItem = ({
|
|
|
32
44
|
api === null || api === void 0 ? void 0 : api.core.actions.execute(closeActiveTableMenu(api));
|
|
33
45
|
api === null || api === void 0 ? void 0 : api.core.actions.focus();
|
|
34
46
|
};
|
|
47
|
+
|
|
48
|
+
// When the table has merged cells, the item remains interactive but is rendered
|
|
49
|
+
// with a disabled-looking label and leading icon, alongside an enabled info icon
|
|
50
|
+
// that surfaces why sorting is unavailable.
|
|
51
|
+
if (hasMergedCellsInTable && fg('platform_editor_table_menu_updates_patch_1')) {
|
|
52
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
53
|
+
elemBefore: /*#__PURE__*/React.createElement(SortDescendingIcon, {
|
|
54
|
+
label: "",
|
|
55
|
+
size: "small",
|
|
56
|
+
color: "var(--ds-text-disabled, #080F214A)"
|
|
57
|
+
}),
|
|
58
|
+
elemAfter: /*#__PURE__*/React.createElement(Tooltip, {
|
|
59
|
+
content: formatMessage(messages.canNotSortTableNoIcon),
|
|
60
|
+
position: "top"
|
|
61
|
+
}, tooltipProps => /*#__PURE__*/React.createElement(Box, _extends({
|
|
62
|
+
as: "span",
|
|
63
|
+
xcss: styles.infoIconTrigger
|
|
64
|
+
}, tooltipProps), /*#__PURE__*/React.createElement(InformationCircleIcon, {
|
|
65
|
+
label: "",
|
|
66
|
+
size: "small",
|
|
67
|
+
color: "var(--ds-icon, #292A2E)"
|
|
68
|
+
})))
|
|
69
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
70
|
+
as: "span",
|
|
71
|
+
xcss: styles.disabledLabel
|
|
72
|
+
}, formatMessage(messages.sortColumnDecreasing)));
|
|
73
|
+
}
|
|
35
74
|
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
36
75
|
onClick: handleClick,
|
|
37
76
|
isDisabled: Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable),
|
|
@@ -1,13 +1,24 @@
|
|
|
1
|
+
/* SortIncreasingItem.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import "./SortIncreasingItem.compiled.css";
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
5
|
import React from 'react';
|
|
2
6
|
import { useIntl } from 'react-intl';
|
|
3
7
|
import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
|
|
4
8
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
5
9
|
import { tableMessages as messages } from '@atlaskit/editor-common/messages';
|
|
6
10
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
7
|
-
import { SortAscendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
11
|
+
import { InformationCircleIcon, SortAscendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
12
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
14
|
+
import Tooltip from '@atlaskit/tooltip';
|
|
8
15
|
import { closeActiveTableMenu } from '../../../../pm-plugins/commands';
|
|
9
16
|
import { sortColumnWithAnalytics } from '../../../../pm-plugins/commands/commands-with-analytics';
|
|
10
17
|
import { useTableMenuContext } from '../../shared/TableMenuContext';
|
|
18
|
+
const styles = {
|
|
19
|
+
disabledLabel: "_syaz1gmx",
|
|
20
|
+
infoIconTrigger: "_1e0c116y _4cvr1h6o"
|
|
21
|
+
};
|
|
11
22
|
export const SortIncreasingItem = ({
|
|
12
23
|
api
|
|
13
24
|
}) => {
|
|
@@ -18,6 +29,7 @@ export const SortIncreasingItem = ({
|
|
|
18
29
|
const {
|
|
19
30
|
formatMessage
|
|
20
31
|
} = useIntl();
|
|
32
|
+
const hasMergedCellsInTable = Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable);
|
|
21
33
|
const handleClick = () => {
|
|
22
34
|
var _api$analytics;
|
|
23
35
|
if (!editorView) {
|
|
@@ -32,6 +44,33 @@ export const SortIncreasingItem = ({
|
|
|
32
44
|
api === null || api === void 0 ? void 0 : api.core.actions.execute(closeActiveTableMenu(api));
|
|
33
45
|
api === null || api === void 0 ? void 0 : api.core.actions.focus();
|
|
34
46
|
};
|
|
47
|
+
|
|
48
|
+
// When the table has merged cells, the item remains interactive but is rendered
|
|
49
|
+
// with a disabled-looking label and leading icon, alongside an enabled info icon
|
|
50
|
+
// that surfaces why sorting is unavailable.
|
|
51
|
+
if (hasMergedCellsInTable && fg('platform_editor_table_menu_updates_patch_1')) {
|
|
52
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
53
|
+
elemBefore: /*#__PURE__*/React.createElement(SortAscendingIcon, {
|
|
54
|
+
label: "",
|
|
55
|
+
size: "small",
|
|
56
|
+
color: "var(--ds-text-disabled, #080F214A)"
|
|
57
|
+
}),
|
|
58
|
+
elemAfter: /*#__PURE__*/React.createElement(Tooltip, {
|
|
59
|
+
content: formatMessage(messages.canNotSortTableNoIcon),
|
|
60
|
+
position: "top"
|
|
61
|
+
}, tooltipProps => /*#__PURE__*/React.createElement(Box, _extends({
|
|
62
|
+
as: "span",
|
|
63
|
+
xcss: styles.infoIconTrigger
|
|
64
|
+
}, tooltipProps), /*#__PURE__*/React.createElement(InformationCircleIcon, {
|
|
65
|
+
label: "",
|
|
66
|
+
size: "small",
|
|
67
|
+
color: "var(--ds-icon, #292A2E)"
|
|
68
|
+
})))
|
|
69
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
70
|
+
as: "span",
|
|
71
|
+
xcss: styles.disabledLabel
|
|
72
|
+
}, formatMessage(messages.sortColumnIncreasing)));
|
|
73
|
+
}
|
|
35
74
|
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
36
75
|
onClick: handleClick,
|
|
37
76
|
isDisabled: Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable),
|
|
@@ -1,13 +1,24 @@
|
|
|
1
|
+
/* SortDecreasingItem.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import "./SortDecreasingItem.compiled.css";
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
5
|
import React from 'react';
|
|
2
6
|
import { useIntl } from 'react-intl';
|
|
3
7
|
import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
|
|
4
8
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
5
9
|
import { tableMessages as messages } from '@atlaskit/editor-common/messages';
|
|
6
10
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
7
|
-
import { SortDescendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
11
|
+
import { InformationCircleIcon, SortDescendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
12
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
14
|
+
import Tooltip from '@atlaskit/tooltip';
|
|
8
15
|
import { closeActiveTableMenu } from '../../../../pm-plugins/commands';
|
|
9
16
|
import { sortColumnWithAnalytics } from '../../../../pm-plugins/commands/commands-with-analytics';
|
|
10
17
|
import { useTableMenuContext } from '../../shared/TableMenuContext';
|
|
18
|
+
var styles = {
|
|
19
|
+
disabledLabel: "_syaz1gmx",
|
|
20
|
+
infoIconTrigger: "_1e0c116y _4cvr1h6o"
|
|
21
|
+
};
|
|
11
22
|
export var SortDecreasingItem = function SortDecreasingItem(_ref) {
|
|
12
23
|
var api = _ref.api;
|
|
13
24
|
var tableMenuContext = useTableMenuContext();
|
|
@@ -15,6 +26,7 @@ export var SortDecreasingItem = function SortDecreasingItem(_ref) {
|
|
|
15
26
|
editorView = _ref2.editorView;
|
|
16
27
|
var _useIntl = useIntl(),
|
|
17
28
|
formatMessage = _useIntl.formatMessage;
|
|
29
|
+
var hasMergedCellsInTable = Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable);
|
|
18
30
|
var handleClick = function handleClick() {
|
|
19
31
|
var _api$analytics;
|
|
20
32
|
if (!editorView) {
|
|
@@ -29,6 +41,35 @@ export var SortDecreasingItem = function SortDecreasingItem(_ref) {
|
|
|
29
41
|
api === null || api === void 0 || api.core.actions.execute(closeActiveTableMenu(api));
|
|
30
42
|
api === null || api === void 0 || api.core.actions.focus();
|
|
31
43
|
};
|
|
44
|
+
|
|
45
|
+
// When the table has merged cells, the item remains interactive but is rendered
|
|
46
|
+
// with a disabled-looking label and leading icon, alongside an enabled info icon
|
|
47
|
+
// that surfaces why sorting is unavailable.
|
|
48
|
+
if (hasMergedCellsInTable && fg('platform_editor_table_menu_updates_patch_1')) {
|
|
49
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
50
|
+
elemBefore: /*#__PURE__*/React.createElement(SortDescendingIcon, {
|
|
51
|
+
label: "",
|
|
52
|
+
size: "small",
|
|
53
|
+
color: "var(--ds-text-disabled, #080F214A)"
|
|
54
|
+
}),
|
|
55
|
+
elemAfter: /*#__PURE__*/React.createElement(Tooltip, {
|
|
56
|
+
content: formatMessage(messages.canNotSortTableNoIcon),
|
|
57
|
+
position: "top"
|
|
58
|
+
}, function (tooltipProps) {
|
|
59
|
+
return /*#__PURE__*/React.createElement(Box, _extends({
|
|
60
|
+
as: "span",
|
|
61
|
+
xcss: styles.infoIconTrigger
|
|
62
|
+
}, tooltipProps), /*#__PURE__*/React.createElement(InformationCircleIcon, {
|
|
63
|
+
label: "",
|
|
64
|
+
size: "small",
|
|
65
|
+
color: "var(--ds-icon, #292A2E)"
|
|
66
|
+
}));
|
|
67
|
+
})
|
|
68
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
69
|
+
as: "span",
|
|
70
|
+
xcss: styles.disabledLabel
|
|
71
|
+
}, formatMessage(messages.sortColumnDecreasing)));
|
|
72
|
+
}
|
|
32
73
|
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
33
74
|
onClick: handleClick,
|
|
34
75
|
isDisabled: Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable),
|
|
@@ -1,13 +1,24 @@
|
|
|
1
|
+
/* SortIncreasingItem.tsx generated by @compiled/babel-plugin v0.39.1 */
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
|
+
import "./SortIncreasingItem.compiled.css";
|
|
4
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
1
5
|
import React from 'react';
|
|
2
6
|
import { useIntl } from 'react-intl';
|
|
3
7
|
import { TableSortOrder as SortOrder } from '@atlaskit/custom-steps';
|
|
4
8
|
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
5
9
|
import { tableMessages as messages } from '@atlaskit/editor-common/messages';
|
|
6
10
|
import { getSelectionRect } from '@atlaskit/editor-tables/utils';
|
|
7
|
-
import { SortAscendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
11
|
+
import { InformationCircleIcon, SortAscendingIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
|
|
12
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
+
import { Box } from '@atlaskit/primitives/compiled';
|
|
14
|
+
import Tooltip from '@atlaskit/tooltip';
|
|
8
15
|
import { closeActiveTableMenu } from '../../../../pm-plugins/commands';
|
|
9
16
|
import { sortColumnWithAnalytics } from '../../../../pm-plugins/commands/commands-with-analytics';
|
|
10
17
|
import { useTableMenuContext } from '../../shared/TableMenuContext';
|
|
18
|
+
var styles = {
|
|
19
|
+
disabledLabel: "_syaz1gmx",
|
|
20
|
+
infoIconTrigger: "_1e0c116y _4cvr1h6o"
|
|
21
|
+
};
|
|
11
22
|
export var SortIncreasingItem = function SortIncreasingItem(_ref) {
|
|
12
23
|
var api = _ref.api;
|
|
13
24
|
var tableMenuContext = useTableMenuContext();
|
|
@@ -15,6 +26,7 @@ export var SortIncreasingItem = function SortIncreasingItem(_ref) {
|
|
|
15
26
|
editorView = _ref2.editorView;
|
|
16
27
|
var _useIntl = useIntl(),
|
|
17
28
|
formatMessage = _useIntl.formatMessage;
|
|
29
|
+
var hasMergedCellsInTable = Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable);
|
|
18
30
|
var handleClick = function handleClick() {
|
|
19
31
|
var _api$analytics;
|
|
20
32
|
if (!editorView) {
|
|
@@ -29,6 +41,35 @@ export var SortIncreasingItem = function SortIncreasingItem(_ref) {
|
|
|
29
41
|
api === null || api === void 0 || api.core.actions.execute(closeActiveTableMenu(api));
|
|
30
42
|
api === null || api === void 0 || api.core.actions.focus();
|
|
31
43
|
};
|
|
44
|
+
|
|
45
|
+
// When the table has merged cells, the item remains interactive but is rendered
|
|
46
|
+
// with a disabled-looking label and leading icon, alongside an enabled info icon
|
|
47
|
+
// that surfaces why sorting is unavailable.
|
|
48
|
+
if (hasMergedCellsInTable && fg('platform_editor_table_menu_updates_patch_1')) {
|
|
49
|
+
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
50
|
+
elemBefore: /*#__PURE__*/React.createElement(SortAscendingIcon, {
|
|
51
|
+
label: "",
|
|
52
|
+
size: "small",
|
|
53
|
+
color: "var(--ds-text-disabled, #080F214A)"
|
|
54
|
+
}),
|
|
55
|
+
elemAfter: /*#__PURE__*/React.createElement(Tooltip, {
|
|
56
|
+
content: formatMessage(messages.canNotSortTableNoIcon),
|
|
57
|
+
position: "top"
|
|
58
|
+
}, function (tooltipProps) {
|
|
59
|
+
return /*#__PURE__*/React.createElement(Box, _extends({
|
|
60
|
+
as: "span",
|
|
61
|
+
xcss: styles.infoIconTrigger
|
|
62
|
+
}, tooltipProps), /*#__PURE__*/React.createElement(InformationCircleIcon, {
|
|
63
|
+
label: "",
|
|
64
|
+
size: "small",
|
|
65
|
+
color: "var(--ds-icon, #292A2E)"
|
|
66
|
+
}));
|
|
67
|
+
})
|
|
68
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
69
|
+
as: "span",
|
|
70
|
+
xcss: styles.disabledLabel
|
|
71
|
+
}, formatMessage(messages.sortColumnIncreasing)));
|
|
72
|
+
}
|
|
32
73
|
return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
|
|
33
74
|
onClick: handleClick,
|
|
34
75
|
isDisabled: Boolean(tableMenuContext === null || tableMenuContext === void 0 ? void 0 : tableMenuContext.hasMergedCellsInTable),
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "24.3.
|
|
3
|
+
"version": "24.3.4",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@atlaskit/adf-schema": "^56.0.0",
|
|
24
|
-
"@atlaskit/button": "^24.
|
|
24
|
+
"@atlaskit/button": "^24.3.0",
|
|
25
25
|
"@atlaskit/custom-steps": "^1.0.0",
|
|
26
26
|
"@atlaskit/editor-palette": "^3.1.0",
|
|
27
27
|
"@atlaskit/editor-plugin-accessibility-utils": "^12.0.0",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"@atlaskit/editor-plugin-batch-attribute-updates": "^12.0.0",
|
|
30
30
|
"@atlaskit/editor-plugin-content-insertion": "^12.0.0",
|
|
31
31
|
"@atlaskit/editor-plugin-editor-viewmode": "^14.0.0",
|
|
32
|
-
"@atlaskit/editor-plugin-extension": "15.0.
|
|
32
|
+
"@atlaskit/editor-plugin-extension": "15.0.12",
|
|
33
33
|
"@atlaskit/editor-plugin-guideline": "^12.0.0",
|
|
34
34
|
"@atlaskit/editor-plugin-interaction": "^22.0.0",
|
|
35
35
|
"@atlaskit/editor-plugin-limited-mode": "^9.0.0",
|
|
@@ -41,21 +41,21 @@
|
|
|
41
41
|
"@atlaskit/editor-prosemirror": "^8.0.0",
|
|
42
42
|
"@atlaskit/editor-shared-styles": "^4.0.0",
|
|
43
43
|
"@atlaskit/editor-tables": "^3.0.0",
|
|
44
|
-
"@atlaskit/editor-toolbar": "^2.
|
|
45
|
-
"@atlaskit/editor-ui-control-model": "^2.
|
|
46
|
-
"@atlaskit/icon": "^36.
|
|
47
|
-
"@atlaskit/icon-lab": "^7.
|
|
44
|
+
"@atlaskit/editor-toolbar": "^2.1.0",
|
|
45
|
+
"@atlaskit/editor-ui-control-model": "^2.1.0",
|
|
46
|
+
"@atlaskit/icon": "^36.1.0",
|
|
47
|
+
"@atlaskit/icon-lab": "^7.2.0",
|
|
48
48
|
"@atlaskit/insm": "^1.0.0",
|
|
49
|
-
"@atlaskit/menu": "^9.
|
|
49
|
+
"@atlaskit/menu": "^9.1.0",
|
|
50
50
|
"@atlaskit/platform-feature-flags": "^2.0.0",
|
|
51
51
|
"@atlaskit/pragmatic-drag-and-drop": "^2.0.0",
|
|
52
52
|
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^3.0.0",
|
|
53
53
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^2.0.0",
|
|
54
|
-
"@atlaskit/primitives": "^20.
|
|
55
|
-
"@atlaskit/tmp-editor-statsig": "^114.
|
|
56
|
-
"@atlaskit/toggle": "^17.
|
|
57
|
-
"@atlaskit/tokens": "^15.
|
|
58
|
-
"@atlaskit/tooltip": "^23.
|
|
54
|
+
"@atlaskit/primitives": "^20.2.0",
|
|
55
|
+
"@atlaskit/tmp-editor-statsig": "^114.5.0",
|
|
56
|
+
"@atlaskit/toggle": "^17.1.0",
|
|
57
|
+
"@atlaskit/tokens": "^15.2.0",
|
|
58
|
+
"@atlaskit/tooltip": "^23.1.0",
|
|
59
59
|
"@babel/runtime": "^7.0.0",
|
|
60
60
|
"@compiled/react": "^0.20.0",
|
|
61
61
|
"@emotion/react": "^11.7.1",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"uuid": "^3.1.0"
|
|
68
68
|
},
|
|
69
69
|
"peerDependencies": {
|
|
70
|
-
"@atlaskit/editor-common": "^116.
|
|
70
|
+
"@atlaskit/editor-common": "^116.17.0",
|
|
71
71
|
"react": "^18.2.0",
|
|
72
72
|
"react-dom": "^18.2.0",
|
|
73
73
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|
|
@@ -168,6 +168,9 @@
|
|
|
168
168
|
},
|
|
169
169
|
"platform_editor_ai_table_ai_streaming_pos_fix": {
|
|
170
170
|
"type": "boolean"
|
|
171
|
+
},
|
|
172
|
+
"platform_editor_table_menu_updates_patch_1": {
|
|
173
|
+
"type": "boolean"
|
|
171
174
|
}
|
|
172
175
|
},
|
|
173
176
|
"devDependencies": {
|