@carbon/ibm-products 2.43.2-canary.2 → 2.43.2-canary.22
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +35 -3
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +35 -3
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +35 -3
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +23 -21
- package/es/components/ConditionBuilder/ConditionBuilder.js +67 -20
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +15 -0
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +129 -0
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +6 -4
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +5 -1
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +16 -4
- package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +9 -11
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +36 -32
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +0 -1
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +7 -2
- package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +6 -1
- package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +18 -10
- package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +39 -36
- package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +12 -10
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +24 -16
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +19 -4
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +13 -0
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +109 -0
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.d.ts → ItemOptionForValueField.d.ts} +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.js → ItemOptionForValueField.js} +58 -33
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +4 -6
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +14 -5
- package/es/components/ConditionBuilder/utils/handleKeyboardEvents.js +1 -2
- package/es/components/ConditionBuilder/utils/util.d.ts +1 -0
- package/es/components/ConditionBuilder/utils/util.js +16 -1
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +29 -16
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +9 -1
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +18 -2
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +8 -0
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +17 -6
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +4 -1
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +3 -1
- package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +15 -3
- package/es/components/DataSpreadsheet/types/index.d.ts +1 -1
- package/es/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +34 -2
- package/es/components/Datagrid/Datagrid/Datagrid.js +2 -1
- package/es/components/Datagrid/Datagrid/DatagridContent.js +1 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +6 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.d.ts +3 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +6 -3
- package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.d.ts +1 -1
- package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +21 -16
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +21 -3
- package/es/components/Datagrid/types/index.d.ts +18 -4
- package/es/components/Datagrid/useActionsColumn.d.ts +8 -1
- package/es/components/Datagrid/useActionsColumn.js +7 -6
- package/es/components/Datagrid/useColumnRightAlign.d.ts +8 -1
- package/es/components/Datagrid/useColumnRightAlign.js +4 -3
- package/es/components/Datagrid/useInlineEdit.d.ts +8 -1
- package/es/components/Datagrid/useInlineEdit.js +13 -3
- package/es/components/Datagrid/useNestedRows.js +27 -9
- package/es/components/Decorator/Decorator.js +2 -1
- package/es/components/DecoratorBase/DecoratorBase.js +3 -5
- package/es/components/DecoratorDualButton/DecoratorDualButton.js +2 -1
- package/es/components/DecoratorLink/DecoratorLink.js +2 -1
- package/es/components/DecoratorSingleButton/DecoratorSingleButton.js +2 -1
- package/es/components/Tearsheet/Tearsheet.d.ts +8 -1
- package/es/components/Tearsheet/Tearsheet.js +9 -1
- package/es/components/Tearsheet/TearsheetNarrow.d.ts +11 -0
- package/es/components/Tearsheet/TearsheetNarrow.js +12 -0
- package/es/components/Tearsheet/TearsheetShell.d.ts +10 -0
- package/es/components/Tearsheet/TearsheetShell.js +17 -3
- package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +23 -21
- package/lib/components/ConditionBuilder/ConditionBuilder.js +67 -20
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +15 -0
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +137 -0
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +6 -3
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +5 -1
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +16 -4
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +9 -11
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +36 -32
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +0 -1
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +7 -2
- package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +6 -1
- package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +18 -10
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +39 -36
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +12 -10
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +23 -15
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +20 -5
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +13 -0
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +117 -0
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.d.ts → ItemOptionForValueField.d.ts} +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/{ConditionBuilderItemOption.js → ItemOptionForValueField.js} +56 -31
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +4 -6
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +14 -4
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +1 -2
- package/lib/components/ConditionBuilder/utils/util.d.ts +1 -0
- package/lib/components/ConditionBuilder/utils/util.js +17 -0
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +29 -16
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +9 -1
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +18 -2
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +8 -0
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +17 -6
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +4 -1
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +3 -1
- package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +15 -3
- package/lib/components/DataSpreadsheet/types/index.d.ts +1 -1
- package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +34 -2
- package/lib/components/Datagrid/Datagrid/Datagrid.js +2 -1
- package/lib/components/Datagrid/Datagrid/DatagridContent.js +1 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +6 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +6 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.d.ts +3 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +6 -3
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.d.ts +1 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +21 -16
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +21 -3
- package/lib/components/Datagrid/types/index.d.ts +18 -4
- package/lib/components/Datagrid/useActionsColumn.d.ts +8 -1
- package/lib/components/Datagrid/useActionsColumn.js +7 -6
- package/lib/components/Datagrid/useColumnRightAlign.d.ts +8 -1
- package/lib/components/Datagrid/useColumnRightAlign.js +4 -3
- package/lib/components/Datagrid/useInlineEdit.d.ts +8 -1
- package/lib/components/Datagrid/useInlineEdit.js +13 -3
- package/lib/components/Datagrid/useNestedRows.js +27 -9
- package/lib/components/Decorator/Decorator.js +2 -1
- package/lib/components/DecoratorBase/DecoratorBase.js +3 -5
- package/lib/components/DecoratorDualButton/DecoratorDualButton.js +2 -1
- package/lib/components/DecoratorLink/DecoratorLink.js +2 -1
- package/lib/components/DecoratorSingleButton/DecoratorSingleButton.js +2 -1
- package/lib/components/Tearsheet/Tearsheet.d.ts +8 -1
- package/lib/components/Tearsheet/Tearsheet.js +9 -1
- package/lib/components/Tearsheet/TearsheetNarrow.d.ts +11 -0
- package/lib/components/Tearsheet/TearsheetNarrow.js +12 -0
- package/lib/components/Tearsheet/TearsheetShell.d.ts +10 -0
- package/lib/components/Tearsheet/TearsheetShell.js +16 -2
- package/package.json +3 -3
- package/scss/components/ConditionBuilder/styles/_conditionBuilderCondition.scss +9 -1
- package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +26 -1
- package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +1 -0
- package/scss/components/StatusIcon/_status-icon.scss +4 -4
- package/scss/components/StringFormatter/_string-formatter.scss +2 -2
- package/scss/components/UserProfileImage/_user-profile-image.scss +6 -2
- package/telemetry.yml +1 -0
- package/es/components/ConditionBuilder/utils/checkForHoldingKey.d.ts +0 -1
- package/es/components/ConditionBuilder/utils/checkForHoldingKey.js +0 -16
- package/lib/components/ConditionBuilder/utils/checkForHoldingKey.d.ts +0 -1
- package/lib/components/ConditionBuilder/utils/checkForHoldingKey.js +0 -20
@@ -9,7 +9,9 @@
|
|
9
9
|
|
10
10
|
Object.defineProperty(exports, '__esModule', { value: true });
|
11
11
|
|
12
|
+
var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
|
12
13
|
var React = require('react');
|
14
|
+
var cx = require('classnames');
|
13
15
|
var index = require('../../../node_modules/prop-types/index.js');
|
14
16
|
var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
|
15
17
|
var ConditionBuilderItem = require('../ConditionBuilderItem/ConditionBuilderItem.js');
|
@@ -18,9 +20,17 @@ var ConditionConnector = require('../ConditionBuilderConnector/ConditionConnecto
|
|
18
20
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
19
21
|
|
20
22
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
23
|
+
var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
|
21
24
|
|
22
25
|
var ConditionPreview = function ConditionPreview(_ref) {
|
23
26
|
var previewType = _ref.previewType;
|
27
|
+
var _useState = React.useState(false),
|
28
|
+
_useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
|
29
|
+
animate = _useState2[0],
|
30
|
+
setAnimate = _useState2[1];
|
31
|
+
React.useEffect(function () {
|
32
|
+
setAnimate(true);
|
33
|
+
}, []);
|
24
34
|
var getConditionSection = function getConditionSection() {
|
25
35
|
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
|
26
36
|
label: DataConfigs.translateWithId('property')
|
@@ -31,20 +41,20 @@ var ConditionPreview = function ConditionPreview(_ref) {
|
|
31
41
|
}));
|
32
42
|
};
|
33
43
|
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, previewType == 'newGroup' && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
34
|
-
className: "".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview
|
44
|
+
className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
|
35
45
|
}, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
|
36
46
|
className: "".concat(DataConfigs.blockClass, "__statement-button"),
|
37
47
|
label: DataConfigs.translateWithId('and')
|
38
48
|
})), /*#__PURE__*/React__default["default"].createElement("div", {
|
39
49
|
"aria-hidden": true,
|
40
|
-
className: "".concat(DataConfigs.blockClass, "__group ").concat(DataConfigs.blockClass, "__condition-wrapper ").concat(DataConfigs.blockClass, "__group-preview ").concat(DataConfigs.blockClass, "__group-wrapper")
|
50
|
+
className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group ").concat(DataConfigs.blockClass, "__condition-wrapper ").concat(DataConfigs.blockClass, "__group-preview ").concat(DataConfigs.blockClass, "__group-wrapper "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
|
41
51
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
42
52
|
className: "".concat(DataConfigs.blockClass, "__gap")
|
43
53
|
}, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
|
44
54
|
className: "".concat(DataConfigs.blockClass, "__statement-button"),
|
45
55
|
label: DataConfigs.translateWithId('if')
|
46
56
|
})), getConditionSection())), previewType == 'subGroup' && /*#__PURE__*/React__default["default"].createElement("div", {
|
47
|
-
className: "".concat(DataConfigs.blockClass, "__group-preview")
|
57
|
+
className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
|
48
58
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
49
59
|
className: "".concat(DataConfigs.blockClass, "__condition-block ").concat(DataConfigs.blockClass, "__gap")
|
50
60
|
}, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
|
@@ -57,7 +67,7 @@ var ConditionPreview = function ConditionPreview(_ref) {
|
|
57
67
|
className: "".concat(DataConfigs.blockClass, "__gap ").concat(DataConfigs.blockClass, "__groupConnector"),
|
58
68
|
operator: DataConfigs.translateWithId('if')
|
59
69
|
}), getConditionSection()))), previewType == 'condition' && /*#__PURE__*/React__default["default"].createElement("div", {
|
60
|
-
className: "".concat(DataConfigs.blockClass, "__group-preview")
|
70
|
+
className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
|
61
71
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
62
72
|
className: "".concat(DataConfigs.blockClass, "__condition-block ").concat(DataConfigs.blockClass, "__gap")
|
63
73
|
}, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
|
@@ -11,7 +11,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
11
11
|
|
12
12
|
var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
|
13
13
|
var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
|
14
|
-
var checkForHoldingKey = require('./checkForHoldingKey.js');
|
15
14
|
var util = require('./util.js');
|
16
15
|
|
17
16
|
var handleKeyDown = function handleKeyDown(evt, conditionBuilderRef) {
|
@@ -25,7 +24,7 @@ var handleKeyDown = function handleKeyDown(evt, conditionBuilderRef) {
|
|
25
24
|
var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentContainer) {
|
26
25
|
var _parentContainer$quer;
|
27
26
|
var key = evt.key;
|
28
|
-
var isHoldingShiftKey =
|
27
|
+
var isHoldingShiftKey = util.checkForHoldingKey(evt, 'shiftKey');
|
29
28
|
var isMultiSelect = (_parentContainer$quer = parentContainer.querySelector('ul')) === null || _parentContainer$quer === void 0 ? void 0 : _parentContainer$quer.dataset.multiSelect;
|
30
29
|
var allItems = [];
|
31
30
|
switch (key) {
|
@@ -3,3 +3,4 @@ export function focusThisItem(currentElement: any): void;
|
|
3
3
|
export function traverseClockVise(eachElem: any, index: any, allElements: any, rotate: any, trapFocus: any): void;
|
4
4
|
export function traverseReverse(eachElem: any, index: any, allElements: any, rotate: any, trapFocus: any): void;
|
5
5
|
export function checkForHoldingKey(evt: any, key: any): any;
|
6
|
+
export function checkDuplicateAction(actionState: any, selectedId: any, currentActionId: any): boolean;
|
@@ -45,7 +45,24 @@ var traverseReverse = function traverseReverse(eachElem, index, allElements, rot
|
|
45
45
|
focusThisItem(allElements[allElements.length - 1]);
|
46
46
|
}
|
47
47
|
};
|
48
|
+
var checkForHoldingKey = function checkForHoldingKey(evt, key) {
|
49
|
+
// possible key inputs: altKey,ctrlKey,metaKey,shiftKey
|
50
|
+
if (key === 'cmd') {
|
51
|
+
return evt.metaKey || evt.ctrlKey;
|
52
|
+
}
|
53
|
+
return evt[key];
|
54
|
+
};
|
55
|
+
var checkDuplicateAction = function checkDuplicateAction(actionState, selectedId, currentActionId) {
|
56
|
+
if (selectedId !== currentActionId && actionState.find(function (eachAction) {
|
57
|
+
return eachAction.id === selectedId;
|
58
|
+
})) {
|
59
|
+
return true;
|
60
|
+
}
|
61
|
+
return false;
|
62
|
+
};
|
48
63
|
|
64
|
+
exports.checkDuplicateAction = checkDuplicateAction;
|
65
|
+
exports.checkForHoldingKey = checkForHoldingKey;
|
49
66
|
exports.focusThisField = focusThisField;
|
50
67
|
exports.focusThisItem = focusThisItem;
|
51
68
|
exports.traverseClockVise = traverseClockVise;
|
@@ -121,15 +121,19 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
121
121
|
_useState18 = _rollupPluginBabelHelpers.slicedToArray(_useState17, 2),
|
122
122
|
headerCellHoldActive = _useState18[0],
|
123
123
|
setHeaderCellHoldActive = _useState18[1];
|
124
|
-
var isBlurSpreadsheet = React.useRef(false);
|
125
124
|
var _useState19 = React.useState(false),
|
126
125
|
_useState20 = _rollupPluginBabelHelpers.slicedToArray(_useState19, 2),
|
127
|
-
|
128
|
-
|
126
|
+
selectedHeaderReorderActive = _useState20[0],
|
127
|
+
setSelectedHeaderReorderActive = _useState20[1];
|
128
|
+
var isBlurSpreadsheet = React.useRef(false);
|
129
129
|
var _useState21 = React.useState(false),
|
130
130
|
_useState22 = _rollupPluginBabelHelpers.slicedToArray(_useState21, 2),
|
131
|
-
|
132
|
-
|
131
|
+
isActiveHeaderCellChanged = _useState22[0],
|
132
|
+
setIsActiveHeaderCellChanged = _useState22[1];
|
133
|
+
var _useState23 = React.useState(false),
|
134
|
+
_useState24 = _rollupPluginBabelHelpers.slicedToArray(_useState23, 2),
|
135
|
+
activeCellInsideSelectionArea = _useState24[0],
|
136
|
+
setActiveCellInsideSelectionArea = _useState24[1];
|
133
137
|
var previousState = usePreviousValue.usePreviousValue({
|
134
138
|
activeCellCoordinates: activeCellCoordinates,
|
135
139
|
isEditing: isEditing,
|
@@ -137,10 +141,10 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
137
141
|
}) || {};
|
138
142
|
var cellSizeValue = getCellSize.getCellSize(cellSize);
|
139
143
|
var cellEditorRef = React.useRef();
|
140
|
-
var
|
141
|
-
|
142
|
-
activeCellContent =
|
143
|
-
setActiveCellContent =
|
144
|
+
var _useState25 = React.useState(),
|
145
|
+
_useState26 = _rollupPluginBabelHelpers.slicedToArray(_useState25, 2),
|
146
|
+
activeCellContent = _useState26[0],
|
147
|
+
setActiveCellContent = _useState26[1];
|
144
148
|
var activeCellRef = React.useRef();
|
145
149
|
var cellEditorRulerRef = React.useRef();
|
146
150
|
var defaultColumn = React.useMemo(function () {
|
@@ -216,9 +220,12 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
216
220
|
}
|
217
221
|
if ((prevCoords === null || prevCoords === void 0 ? void 0 : prevCoords.row) !== (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) || (prevCoords === null || prevCoords === void 0 ? void 0 : prevCoords.column) !== (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column)) {
|
218
222
|
if (activeCellCoordinates && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) !== 'header' && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) !== 'header') {
|
219
|
-
var _activeCellFullData$r;
|
220
223
|
var activeCellFullData = typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'number' && typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'number' ? rows[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row].cells[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column] : null;
|
221
|
-
|
224
|
+
if (activeCellFullData) {
|
225
|
+
setActiveCellContent(activeCellFullData.render('Cell'));
|
226
|
+
} else {
|
227
|
+
setActiveCellContent(null);
|
228
|
+
}
|
222
229
|
}
|
223
230
|
if (activeCellCoordinates && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header') {
|
224
231
|
setActiveCellContent(null);
|
@@ -433,8 +440,8 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
433
440
|
var activeCellFullData = typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'number' && typeof (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'number' ? rows[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row].cells[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column] : null;
|
434
441
|
var activeCellValue;
|
435
442
|
if (activeCellFullData && activeCellCoordinates !== null && activeCellCoordinates !== void 0 && activeCellCoordinates.column) {
|
436
|
-
var _activeCellFullData$
|
437
|
-
activeCellValue = activeCellFullData ? (_activeCellFullData$
|
443
|
+
var _activeCellFullData$r;
|
444
|
+
activeCellValue = activeCellFullData ? (_activeCellFullData$r = activeCellFullData.row.cells) === null || _activeCellFullData$r === void 0 || (_activeCellFullData$r = _activeCellFullData$r[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column]) === null || _activeCellFullData$r === void 0 ? void 0 : _activeCellFullData$r.value : null;
|
438
445
|
}
|
439
446
|
setCellEditorValue(activeCellValue || '');
|
440
447
|
if (cellEditorRulerRef !== null && cellEditorRulerRef !== void 0 && cellEditorRulerRef.current) {
|
@@ -624,6 +631,8 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
624
631
|
columns: columns,
|
625
632
|
currentMatcher: currentMatcher,
|
626
633
|
defaultColumn: defaultColumn,
|
634
|
+
selectedHeaderReorderActive: selectedHeaderReorderActive,
|
635
|
+
setSelectedHeaderReorderActive: setSelectedHeaderReorderActive,
|
627
636
|
headerGroups: headerGroups,
|
628
637
|
rows: rows,
|
629
638
|
scrollBarSize: scrollBarSize,
|
@@ -647,6 +656,8 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
647
656
|
currentMatcher: currentMatcher,
|
648
657
|
setCurrentMatcher: setCurrentMatcher,
|
649
658
|
setContainerHasFocus: setContainerHasFocus,
|
659
|
+
selectedHeaderReorderActive: selectedHeaderReorderActive,
|
660
|
+
setSelectedHeaderReorderActive: setSelectedHeaderReorderActive,
|
650
661
|
selectionAreas: selectionAreas,
|
651
662
|
setSelectionAreas: setSelectionAreas,
|
652
663
|
headerGroups: headerGroups,
|
@@ -697,9 +708,11 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
|
|
697
708
|
updateData: updateData
|
698
709
|
}),
|
699
710
|
onChange: function onChange(event) {
|
700
|
-
|
701
|
-
|
702
|
-
cellEditorRulerRef.current
|
711
|
+
if (previousState.isEditing) {
|
712
|
+
setCellEditorValue(event.target.value);
|
713
|
+
if (cellEditorRulerRef !== null && cellEditorRulerRef !== void 0 && cellEditorRulerRef.current) {
|
714
|
+
cellEditorRulerRef.current.textContent = event.target.value;
|
715
|
+
}
|
703
716
|
}
|
704
717
|
},
|
705
718
|
ref: cellEditorRef,
|
@@ -79,7 +79,15 @@ interface DataSpreadsheetBodyProps {
|
|
79
79
|
/**
|
80
80
|
* Array of selection area data
|
81
81
|
*/
|
82
|
-
selectionAreaData?:
|
82
|
+
selectionAreaData?: any[];
|
83
|
+
/**
|
84
|
+
* Header reordering is active
|
85
|
+
*/
|
86
|
+
selectedHeaderReorderActive?: boolean;
|
87
|
+
/**
|
88
|
+
* Set header reordering active or not
|
89
|
+
*/
|
90
|
+
setSelectedHeaderReorderActive?: Dispatch<SetStateAction<boolean>>;
|
83
91
|
/**
|
84
92
|
* Array of selection areas
|
85
93
|
*/
|
@@ -49,6 +49,8 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
49
49
|
selectionAreaData = _ref.selectionAreaData,
|
50
50
|
setSelectionAreaData = _ref.setSelectionAreaData,
|
51
51
|
setActiveCellCoordinates = _ref.setActiveCellCoordinates,
|
52
|
+
selectedHeaderReorderActive = _ref.selectedHeaderReorderActive,
|
53
|
+
setSelectedHeaderReorderActive = _ref.setSelectedHeaderReorderActive,
|
52
54
|
selectionAreas = _ref.selectionAreas,
|
53
55
|
setContainerHasFocus = _ref.setContainerHasFocus,
|
54
56
|
setSelectionAreas = _ref.setSelectionAreas,
|
@@ -84,8 +86,12 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
84
86
|
// back to the consumer
|
85
87
|
React.useEffect(function () {
|
86
88
|
if (selectionAreaData !== null && selectionAreaData !== void 0 && selectionAreaData.length) {
|
87
|
-
var _previousState$select;
|
88
|
-
|
89
|
+
var _previousState$select, _selectionAreaData$, _previousState$select2;
|
90
|
+
var selectionChanged = false;
|
91
|
+
if ((previousState === null || previousState === void 0 || (_previousState$select = previousState.selectionAreaData) === null || _previousState$select === void 0 ? void 0 : _previousState$select.length) !== (selectionAreaData === null || selectionAreaData === void 0 ? void 0 : selectionAreaData.length) || (selectionAreaData === null || selectionAreaData === void 0 || (_selectionAreaData$ = selectionAreaData[0]) === null || _selectionAreaData$ === void 0 ? void 0 : _selectionAreaData$.cells.length) !== (previousState === null || previousState === void 0 || (_previousState$select2 = previousState.selectionAreaData) === null || _previousState$select2 === void 0 || (_previousState$select2 = _previousState$select2[0]) === null || _previousState$select2 === void 0 ? void 0 : _previousState$select2.cells.length)) {
|
92
|
+
selectionChanged = true;
|
93
|
+
}
|
94
|
+
if (!clickAndHoldActive && previousState !== null && previousState !== void 0 && previousState.clickAndHoldActive || selectionChanged) {
|
89
95
|
onSelectionAreaChange === null || onSelectionAreaChange === void 0 || onSelectionAreaChange(selectionAreaData);
|
90
96
|
}
|
91
97
|
}
|
@@ -160,6 +166,8 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
160
166
|
setClickAndHoldActive: setClickAndHoldActive,
|
161
167
|
setSelectionAreas: setSelectionAreas,
|
162
168
|
setValidStartingPoint: setValidStartingPoint,
|
169
|
+
selectedHeaderReorderActive: selectedHeaderReorderActive,
|
170
|
+
setSelectedHeaderReorderActive: setSelectedHeaderReorderActive,
|
163
171
|
validStartingPoint: validStartingPoint,
|
164
172
|
ref: ref,
|
165
173
|
setHeaderCellHoldActive: setHeaderCellHoldActive,
|
@@ -466,6 +474,10 @@ DataSpreadsheetBody.propTypes = {
|
|
466
474
|
* The scrollbar width
|
467
475
|
*/
|
468
476
|
scrollBarSize: index["default"].number,
|
477
|
+
/**
|
478
|
+
* Header reordering is active
|
479
|
+
*/
|
480
|
+
selectedHeaderReorderActive: index["default"].bool,
|
469
481
|
/**
|
470
482
|
* Array of selection area data
|
471
483
|
*/
|
@@ -502,6 +514,10 @@ DataSpreadsheetBody.propTypes = {
|
|
502
514
|
* Setter fn for header cell hold active value
|
503
515
|
*/
|
504
516
|
setHeaderCellHoldActive: index["default"].func,
|
517
|
+
/**
|
518
|
+
* Set header reordering active or not
|
519
|
+
*/
|
520
|
+
setSelectedHeaderReorderActive: index["default"].func,
|
505
521
|
/**
|
506
522
|
* Setter fn for selectionAreaData state value
|
507
523
|
*/
|
@@ -56,6 +56,14 @@ interface DataSpreadsheetHeaderProps {
|
|
56
56
|
* Setter fn for activeCellCoordinates value
|
57
57
|
*/
|
58
58
|
setActiveCellCoordinates?: Dispatch<SetStateAction<ActiveCellCoordinates | null>>;
|
59
|
+
/**
|
60
|
+
* Header reordering is active
|
61
|
+
*/
|
62
|
+
selectedHeaderReorderActive?: boolean;
|
63
|
+
/**
|
64
|
+
* Set header reordering active or not
|
65
|
+
*/
|
66
|
+
setSelectedHeaderReorderActive?: Dispatch<SetStateAction<boolean>>;
|
59
67
|
/**
|
60
68
|
* Setter fn for currentMatcher value
|
61
69
|
*/
|
@@ -40,6 +40,8 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
40
40
|
headerGroups = _ref.headerGroups,
|
41
41
|
scrollBarSize = _ref.scrollBarSize,
|
42
42
|
selectionAreas = _ref.selectionAreas,
|
43
|
+
selectedHeaderReorderActive = _ref.selectedHeaderReorderActive,
|
44
|
+
setSelectedHeaderReorderActive = _ref.setSelectedHeaderReorderActive,
|
43
45
|
setActiveCellCoordinates = _ref.setActiveCellCoordinates,
|
44
46
|
setCurrentMatcher = _ref.setCurrentMatcher,
|
45
47
|
setSelectionAreas = _ref.setSelectionAreas,
|
@@ -55,10 +57,6 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
55
57
|
_useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
|
56
58
|
scrollBarSizeValue = _useState2[0],
|
57
59
|
setScrollBarSizeValue = _useState2[1];
|
58
|
-
var _useState3 = React.useState(false),
|
59
|
-
_useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
|
60
|
-
selectedHeaderReorderActive = _useState4[0],
|
61
|
-
setSelectedHeaderReorderActive = _useState4[1];
|
62
60
|
var previousState = usePreviousValue.usePreviousValue({
|
63
61
|
cellSize: cellSize
|
64
62
|
}) || {};
|
@@ -116,11 +114,16 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
116
114
|
// Remove columns, need to call handleHeaderCellSelection
|
117
115
|
return;
|
118
116
|
}
|
119
|
-
setSelectedHeaderReorderActive(true);
|
120
117
|
var selectionAreaToClone = selectionAreas === null || selectionAreas === void 0 ? void 0 : selectionAreas.filter(function (item) {
|
121
118
|
return (item === null || item === void 0 ? void 0 : item.matcher) === currentMatcher;
|
122
119
|
});
|
123
120
|
var selectionAreaElement = ref.current.querySelector("[data-matcher-id=\"".concat(selectionAreaToClone === null || selectionAreaToClone === void 0 || (_selectionAreaToClone = selectionAreaToClone[0]) === null || _selectionAreaToClone === void 0 ? void 0 : _selectionAreaToClone.matcher, "\"]"));
|
121
|
+
if (selectionAreaElement) {
|
122
|
+
selectionAreaElement.classList.add("".concat(blockClass, "__selection-area--element"));
|
123
|
+
}
|
124
|
+
if (typeof setSelectedHeaderReorderActive === 'function') {
|
125
|
+
setSelectedHeaderReorderActive(true);
|
126
|
+
}
|
124
127
|
var clickXPosition = event.clientX;
|
125
128
|
var headerButtonCoords = event.target.getBoundingClientRect();
|
126
129
|
var headerIndex = event.target.getAttribute('data-column-index');
|
@@ -198,7 +201,7 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
198
201
|
"data-column-index": index,
|
199
202
|
tabIndex: -1,
|
200
203
|
onMouseDown: selectedHeader ? handleHeaderMouseDown(index) : undefined,
|
201
|
-
onMouseUp: selectedHeader ? function () {
|
204
|
+
onMouseUp: selectedHeader && typeof setSelectedHeaderReorderActive === 'function' ? function () {
|
202
205
|
return setSelectedHeaderReorderActive(false);
|
203
206
|
} : undefined,
|
204
207
|
onClick: !selectedHeader ? handleColumnHeaderClick(index) : undefined,
|
@@ -263,6 +266,10 @@ DataSpreadsheetHeader.propTypes = {
|
|
263
266
|
* The aria label applied to the Select all button
|
264
267
|
*/
|
265
268
|
selectAllAriaLabel: index["default"].string.isRequired,
|
269
|
+
/**
|
270
|
+
* Header reordering is active
|
271
|
+
*/
|
272
|
+
selectedHeaderReorderActive: index["default"].bool,
|
266
273
|
/**
|
267
274
|
* All of the cell selection area items
|
268
275
|
*/
|
@@ -280,6 +287,10 @@ DataSpreadsheetHeader.propTypes = {
|
|
280
287
|
* Setter fn for header cell hold active value
|
281
288
|
*/
|
282
289
|
setHeaderCellHoldActive: index["default"].func,
|
290
|
+
/**
|
291
|
+
* Set header reordering active or not
|
292
|
+
*/
|
293
|
+
setSelectedHeaderReorderActive: index["default"].func,
|
283
294
|
/**
|
284
295
|
* Setter fn for selectionAreaData state value
|
285
296
|
*/
|
@@ -44,9 +44,12 @@ var useSpreadsheetMouseMove = function useSpreadsheetMouseMove(_ref) {
|
|
44
44
|
var totalSpreadsheetScrollingWidth = listContainer.scrollWidth;
|
45
45
|
var clonedSelectionWidth = clonedSelectionElement.offsetWidth;
|
46
46
|
var clonePlacement = Math.max(xPositionRelativeToSpreadsheet - offsetXValue, defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeaderWidth);
|
47
|
+
var leftPosition = totalSpreadsheetScrollingWidth - clonedSelectionWidth >= clonePlacement ? clonePlacement + scrollAmount : totalSpreadsheetScrollingWidth - clonedSelectionWidth;
|
47
48
|
// Moves the position of the cloned selection area to follow mouse, and
|
48
49
|
// add the amount horizontally scrolled
|
49
|
-
|
50
|
+
if (leftPosition < spreadsheetCoords.right - 40) {
|
51
|
+
clonedSelectionElement.style.left = layout.px(leftPosition);
|
52
|
+
}
|
50
53
|
};
|
51
54
|
if (headerCellHoldActive) {
|
52
55
|
ref.current.addEventListener('mousemove', handleMouseMove);
|
@@ -1,6 +1,8 @@
|
|
1
|
-
export function useSpreadsheetMouseUp({ currentMatcher, setSelectionAreas, setClickAndHoldActive, setValidStartingPoint, validStartingPoint, blockClass, ref, setHeaderCellHoldActive, setColumnOrder, visibleColumns, setActiveCellCoordinates, activeCellCoordinates, rows, defaultColumn, selectionAreas, }: {
|
1
|
+
export function useSpreadsheetMouseUp({ currentMatcher, setSelectionAreas, selectedHeaderReorderActive, setSelectedHeaderReorderActive, setClickAndHoldActive, setValidStartingPoint, validStartingPoint, blockClass, ref, setHeaderCellHoldActive, setColumnOrder, visibleColumns, setActiveCellCoordinates, activeCellCoordinates, rows, defaultColumn, selectionAreas, }: {
|
2
2
|
currentMatcher: any;
|
3
3
|
setSelectionAreas: any;
|
4
|
+
selectedHeaderReorderActive: any;
|
5
|
+
setSelectedHeaderReorderActive: any;
|
4
6
|
setClickAndHoldActive: any;
|
5
7
|
setValidStartingPoint: any;
|
6
8
|
validStartingPoint: any;
|
@@ -18,6 +18,8 @@ var deepCloneObject = require('../../../global/js/utils/deepCloneObject.js');
|
|
18
18
|
var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
19
19
|
var currentMatcher = _ref.currentMatcher,
|
20
20
|
setSelectionAreas = _ref.setSelectionAreas,
|
21
|
+
selectedHeaderReorderActive = _ref.selectedHeaderReorderActive,
|
22
|
+
setSelectedHeaderReorderActive = _ref.setSelectedHeaderReorderActive,
|
21
23
|
setClickAndHoldActive = _ref.setClickAndHoldActive,
|
22
24
|
setValidStartingPoint = _ref.setValidStartingPoint,
|
23
25
|
validStartingPoint = _ref.validStartingPoint,
|
@@ -34,15 +36,22 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
34
36
|
selectionAreas = _ref.selectionAreas;
|
35
37
|
React.useEffect(function () {
|
36
38
|
var handleMouseUp = function handleMouseUp(event) {
|
39
|
+
var _selectionAreas$;
|
40
|
+
var isHoldingColumn = false;
|
41
|
+
if (selectionAreas !== null && selectionAreas !== void 0 && (_selectionAreas$ = selectionAreas[0]) !== null && _selectionAreas$ !== void 0 && _selectionAreas$.header && selectionAreas[0].header.type === 'column') {
|
42
|
+
isHoldingColumn = true;
|
43
|
+
}
|
37
44
|
// Remove the cloned selection area on mouse up
|
38
|
-
if (!validStartingPoint) {
|
45
|
+
if (!validStartingPoint && isHoldingColumn) {
|
39
46
|
setHeaderCellHoldActive(false);
|
47
|
+
var selectionAreaElement = ref.current.querySelector(".".concat(blockClass, "__selection-area--element"));
|
40
48
|
var selectionAreaCloneElement = ref.current.querySelector(".".concat(blockClass, "__selection-area--element-cloned"));
|
41
49
|
if (!selectionAreaCloneElement) {
|
42
50
|
return;
|
43
51
|
}
|
44
52
|
// Mouse up while a cloned selection area exists/a column is being reordered
|
45
53
|
if (selectionAreaCloneElement) {
|
54
|
+
var _selectionAreaElement;
|
46
55
|
var closestCell = event.target.closest(".".concat(blockClass, "--interactive-cell-element"));
|
47
56
|
var newColumnIndex = parseInt === null || parseInt === void 0 ? void 0 : parseInt(closestCell === null || closestCell === void 0 ? void 0 : closestCell.getAttribute('data-column-index'));
|
48
57
|
var originalColumnIndex = parseInt === null || parseInt === void 0 ? void 0 : parseInt(selectionAreaCloneElement === null || selectionAreaCloneElement === void 0 ? void 0 : selectionAreaCloneElement.getAttribute('data-column-index-original'));
|
@@ -85,6 +94,7 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
85
94
|
selectionAreaClone[indexOfItemToUpdate].point1.column = Math.min.apply(Math, _rollupPluginBabelHelpers.toConsumableArray(newIndexArray));
|
86
95
|
selectionAreaClone[indexOfItemToUpdate].point2.column = Math.max.apply(Math, _rollupPluginBabelHelpers.toConsumableArray(newIndexArray));
|
87
96
|
}
|
97
|
+
selectionAreaClone[indexOfItemToUpdate].areaCreated = false;
|
88
98
|
return selectionAreaClone;
|
89
99
|
});
|
90
100
|
// Only reorder columns if the new index is _not_ part of the
|
@@ -129,11 +139,13 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
129
139
|
var indicatorLineElement = ref.current.querySelector(".".concat(blockClass, "__reorder-indicator-line"));
|
130
140
|
indicatorLineElement === null || indicatorLineElement === void 0 || indicatorLineElement.remove();
|
131
141
|
selectionAreaCloneElement === null || selectionAreaCloneElement === void 0 || selectionAreaCloneElement.remove();
|
142
|
+
selectionAreaElement === null || selectionAreaElement === void 0 || (_selectionAreaElement = selectionAreaElement.classList) === null || _selectionAreaElement === void 0 || _selectionAreaElement.remove("".concat(blockClass, "__selection-area--element"));
|
143
|
+
setSelectedHeaderReorderActive(false);
|
132
144
|
}
|
133
145
|
}
|
134
146
|
// Mouse up was on a spreadsheet body cell which is a valid
|
135
147
|
// start/end point for creating a selection area
|
136
|
-
if (validStartingPoint) {
|
148
|
+
if (validStartingPoint || event.type === 'mouseup') {
|
137
149
|
setClickAndHoldActive(false);
|
138
150
|
setValidStartingPoint(false);
|
139
151
|
var cellButton = event.target.closest(".".concat(blockClass, "__body--td"));
|
@@ -162,7 +174,7 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
|
|
162
174
|
return function () {
|
163
175
|
document.removeEventListener('mouseup', handleMouseUp);
|
164
176
|
};
|
165
|
-
}, [blockClass, currentMatcher, setSelectionAreas, setClickAndHoldActive, setValidStartingPoint, validStartingPoint, ref, setHeaderCellHoldActive, setColumnOrder, visibleColumns, setActiveCellCoordinates, activeCellCoordinates, rows, defaultColumn, selectionAreas]);
|
177
|
+
}, [blockClass, currentMatcher, setSelectionAreas, setClickAndHoldActive, setValidStartingPoint, validStartingPoint, selectedHeaderReorderActive, setSelectedHeaderReorderActive, ref, setHeaderCellHoldActive, setColumnOrder, visibleColumns, setActiveCellCoordinates, activeCellCoordinates, rows, defaultColumn, selectionAreas]);
|
166
178
|
};
|
167
179
|
|
168
180
|
exports.useSpreadsheetMouseUp = useSpreadsheetMouseUp;
|
@@ -13,7 +13,7 @@ export interface PrevState {
|
|
13
13
|
cellEditorValue?: string;
|
14
14
|
activeCellCoordinates?: ActiveCellCoordinates;
|
15
15
|
isEditing?: boolean;
|
16
|
-
selectionAreaData?:
|
16
|
+
selectionAreaData?: any[];
|
17
17
|
clickAndHoldActive?: boolean;
|
18
18
|
rowHeight?: number;
|
19
19
|
cellSize?: Size;
|
@@ -26,11 +26,43 @@ var moveColumnIndicatorLine = function moveColumnIndicatorLine(_ref) {
|
|
26
26
|
var indicatorLineElement = ref.current.querySelector(".".concat(blockClass, "__reorder-indicator-line"));
|
27
27
|
var matcherId = clonedSelectionElement === null || clonedSelectionElement === void 0 ? void 0 : clonedSelectionElement.getAttribute('data-matcher-id');
|
28
28
|
var selectionAreaOrigin = ref.current.querySelector("[data-matcher-id=\"".concat(matcherId, "\"]"));
|
29
|
+
var listContainer = ref.current.querySelector(".".concat(blockClass, "__list--container"));
|
30
|
+
var scrollSpeed = 10; // Scrolling speed
|
31
|
+
var leftEdgeThreshold = 120; // Distance from the left edge to start scrolling
|
32
|
+
var rightEdgeThreshold = 100; // Distance from the right edge to start scrolling
|
33
|
+
|
34
|
+
var _event = event,
|
35
|
+
clientX = _event.clientX;
|
36
|
+
var _listContainer$getBou = listContainer.getBoundingClientRect(),
|
37
|
+
left = _listContainer$getBou.left,
|
38
|
+
right = _listContainer$getBou.right;
|
39
|
+
|
40
|
+
// Is near left side of viewport
|
41
|
+
if (clientX < leftEdgeThreshold) {
|
42
|
+
window.scrollBy(-scrollSpeed, 0);
|
43
|
+
}
|
44
|
+
|
45
|
+
// Is near right side of viewport
|
46
|
+
if (clientX > window.innerWidth - rightEdgeThreshold) {
|
47
|
+
window.scrollBy(scrollSpeed, 0);
|
48
|
+
}
|
49
|
+
|
50
|
+
// Is near left edge of table
|
51
|
+
if (clientX > left && clientX < left + leftEdgeThreshold) {
|
52
|
+
listContainer.scrollBy(-scrollSpeed, 0);
|
53
|
+
}
|
54
|
+
|
55
|
+
// Is near right edge of table
|
56
|
+
if (clientX < right && clientX > right - rightEdgeThreshold) {
|
57
|
+
listContainer.scrollBy(scrollSpeed, 0);
|
58
|
+
}
|
29
59
|
if (Number(newColumnIndex) > Number(originalColumnIndex)) {
|
30
|
-
|
60
|
+
var leftPosition = closestCellCoords.left - spreadsheetCoords.left + closestCell.offsetWidth - 2 + leftScrollAmount;
|
61
|
+
indicatorLineElement.style.left = layout.px(leftPosition);
|
31
62
|
}
|
32
63
|
if (Number(newColumnIndex) < Number(originalColumnIndex)) {
|
33
|
-
|
64
|
+
var _leftPosition = closestCellCoords.left - spreadsheetCoords.left + leftScrollAmount;
|
65
|
+
indicatorLineElement.style.left = layout.px(_leftPosition);
|
34
66
|
}
|
35
67
|
if (Number(newColumnIndex) === Number(originalColumnIndex)) {
|
36
68
|
indicatorLineElement.style.left = selectionAreaOrigin.style.left;
|
@@ -55,7 +55,8 @@ exports.Datagrid = /*#__PURE__*/React__default["default"].forwardRef(function (_
|
|
55
55
|
};
|
56
56
|
return /*#__PURE__*/React__default["default"].createElement(FilterProvider.FilterProvider, {
|
57
57
|
filters: state === null || state === void 0 ? void 0 : state.filters,
|
58
|
-
filterProps: filterProps
|
58
|
+
filterProps: filterProps,
|
59
|
+
tableId: tableId
|
59
60
|
}, /*#__PURE__*/React__default["default"].createElement(InlineEditContext.InlineEditProvider, null, /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
|
60
61
|
id: tableId,
|
61
62
|
ref: ref,
|
@@ -167,7 +167,7 @@ var DatagridContent = function DatagridContent(_ref) {
|
|
167
167
|
className: "".concat(blockClass, "__filter-summary"),
|
168
168
|
filters: filterTags,
|
169
169
|
clearFilters: function clearFilters() {
|
170
|
-
return EventEmitter.dispatch(constants.CLEAR_FILTERS);
|
170
|
+
return EventEmitter.dispatch(constants.CLEAR_FILTERS, tableId);
|
171
171
|
},
|
172
172
|
renderLabel: filterProps === null || filterProps === void 0 ? void 0 : filterProps.renderLabel,
|
173
173
|
overflowType: "tag"
|
@@ -218,7 +218,12 @@ var FilterFlyout = function FilterFlyout(_ref) {
|
|
218
218
|
closeFlyout();
|
219
219
|
cancel();
|
220
220
|
});
|
221
|
-
|
221
|
+
|
222
|
+
// tableId is passed in from the event emitter from the FilterSummary component
|
223
|
+
// in DatagridContent
|
224
|
+
useSubscribeToEventEmitter["default"](constants.CLEAR_FILTERS, function (tableId) {
|
225
|
+
reset(tableId);
|
226
|
+
});
|
222
227
|
React.useEffect(function reflectLastAppliedFiltersWhenReactTableUpdates() {
|
223
228
|
lastAppliedFilters.current = JSON.stringify(reactTableFiltersState);
|
224
229
|
}, [reactTableFiltersState, lastAppliedFilters]);
|
@@ -192,7 +192,12 @@ var FilterPanel = function FilterPanel(_ref) {
|
|
192
192
|
var _filterPanelRef$curre;
|
193
193
|
(_filterPanelRef$curre = filterPanelRef.current) === null || _filterPanelRef$curre === void 0 || _filterPanelRef$curre.style.setProperty('--filter-panel-min-height', layout.rem(filterPanelMinHeight));
|
194
194
|
}, [filterPanelMinHeight]);
|
195
|
-
|
195
|
+
|
196
|
+
// tableId is passed in from the event emitter from the FilterSummary component
|
197
|
+
// in DatagridContent
|
198
|
+
useSubscribeToEventEmitter["default"](constants.CLEAR_FILTERS, function (tableId) {
|
199
|
+
reset(tableId);
|
200
|
+
});
|
196
201
|
var getScrollableContainerHeight = function getScrollableContainerHeight() {
|
197
202
|
var _filterHeadingRef$cur, _filterSearchRef$curr, _actionSetRef$current;
|
198
203
|
var filterHeadingHeight = (_filterHeadingRef$cur = filterHeadingRef.current) === null || _filterHeadingRef$cur === void 0 ? void 0 : _filterHeadingRef$cur.getBoundingClientRect().height;
|
@@ -3,16 +3,18 @@ export function clearSingleFilter({ key, value }: {
|
|
3
3
|
key: any;
|
4
4
|
value: any;
|
5
5
|
}, setAllFilters: any, state: any): void;
|
6
|
-
export function FilterProvider({ children, filters, filterProps }: {
|
6
|
+
export function FilterProvider({ children, filters, filterProps, tableId }: {
|
7
7
|
children: any;
|
8
8
|
filters: any;
|
9
9
|
filterProps: any;
|
10
|
+
tableId: any;
|
10
11
|
}): import("react/jsx-runtime").JSX.Element;
|
11
12
|
export namespace FilterProvider {
|
12
13
|
namespace propTypes {
|
13
14
|
let children: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike>>>;
|
14
15
|
let filterProps: PropTypes.Requireable<object>;
|
15
16
|
let filters: PropTypes.Validator<(object | null | undefined)[]>;
|
17
|
+
let tableId: PropTypes.Requireable<string>;
|
16
18
|
}
|
17
19
|
}
|
18
20
|
import React from 'react';
|
@@ -164,7 +164,8 @@ var filteringReducer = function filteringReducer(state, action) {
|
|
164
164
|
var FilterProvider = function FilterProvider(_ref4) {
|
165
165
|
var children = _ref4.children,
|
166
166
|
filters = _ref4.filters,
|
167
|
-
filterProps = _ref4.filterProps
|
167
|
+
filterProps = _ref4.filterProps,
|
168
|
+
tableId = _ref4.tableId;
|
168
169
|
var _ref5 = filterProps || {},
|
169
170
|
renderDateLabel = _ref5.renderDateLabel;
|
170
171
|
var filterTags = prepareFiltersForTags(filters, renderDateLabel);
|
@@ -185,7 +186,8 @@ var FilterProvider = function FilterProvider(_ref4) {
|
|
185
186
|
panelOpen: panelOpen,
|
186
187
|
setPanelOpen: setPanelOpen,
|
187
188
|
state: state,
|
188
|
-
dispatch: dispatch
|
189
|
+
dispatch: dispatch,
|
190
|
+
tableId: tableId
|
189
191
|
};
|
190
192
|
return /*#__PURE__*/React__default["default"].createElement(FilterContext.Provider, {
|
191
193
|
value: value
|
@@ -194,7 +196,8 @@ var FilterProvider = function FilterProvider(_ref4) {
|
|
194
196
|
FilterProvider.propTypes = {
|
195
197
|
children: index["default"].oneOfType([index["default"].arrayOf(index["default"].node), index["default"].node]).isRequired,
|
196
198
|
filterProps: index["default"].object,
|
197
|
-
filters: index["default"].arrayOf(index["default"].object).isRequired
|
199
|
+
filters: index["default"].arrayOf(index["default"].object).isRequired,
|
200
|
+
tableId: index["default"].string
|
198
201
|
};
|
199
202
|
|
200
203
|
exports.FilterContext = FilterContext;
|
@@ -15,7 +15,7 @@ declare function useFilters({ updateMethod, filters, setAllFilters, variation, r
|
|
15
15
|
prevFiltersObjectArrayRef: React.MutableRefObject<string>;
|
16
16
|
prevFiltersRef: React.MutableRefObject<string>;
|
17
17
|
revertToPreviousFilters: () => void;
|
18
|
-
reset: () => void;
|
18
|
+
reset: (tableId: any) => void;
|
19
19
|
renderFilter: ({ type, column, props: components }: {
|
20
20
|
type: any;
|
21
21
|
column: any;
|