@carbon/ibm-products 2.43.2-canary.145 → 2.43.2-canary.149
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +4 -6
- 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.css +4 -6
- 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 +4 -6
- 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/Card/Card.js +4 -2
- package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.d.ts +100 -24
- package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +19 -20
- package/es/components/ConditionBuilder/ConditionBuilder.d.ts +9 -2
- package/es/components/ConditionBuilder/ConditionBuilder.js +9 -6
- package/es/components/ConditionBuilder/ConditionBuilder.types.d.ts +150 -0
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +26 -12
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +6 -6
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +62 -27
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +1 -2
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +84 -37
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.d.ts +29 -14
- package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +5 -6
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +40 -20
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +32 -30
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +10 -49
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +20 -29
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +81 -31
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +5 -5
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.d.ts +27 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.d.ts +30 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +11 -6
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +33 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +5 -4
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.d.ts +32 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +3 -3
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.d.ts +35 -14
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +4 -4
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.d.ts +25 -10
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.d.ts +44 -17
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +39 -32
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +30 -13
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +1 -2
- package/es/components/ConditionBuilder/utils/handleKeyboardEvents.js +1 -1
- package/es/components/Datagrid/useFiltering.d.ts +1 -0
- package/es/components/Datagrid/useFiltering.js +14 -3
- package/lib/components/Card/Card.js +3 -1
- package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.d.ts +100 -24
- package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +19 -20
- package/lib/components/ConditionBuilder/ConditionBuilder.d.ts +9 -2
- package/lib/components/ConditionBuilder/ConditionBuilder.js +9 -6
- package/lib/components/ConditionBuilder/ConditionBuilder.types.d.ts +150 -0
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +26 -12
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +6 -6
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +62 -27
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +1 -2
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +84 -37
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.d.ts +29 -14
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +5 -6
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +40 -20
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +32 -30
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +10 -49
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +20 -29
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +81 -31
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +5 -5
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.d.ts +27 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.d.ts +30 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +11 -6
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +33 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +5 -4
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.d.ts +32 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +3 -3
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.d.ts +35 -14
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +4 -4
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.d.ts +25 -10
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.d.ts +44 -17
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +39 -32
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +30 -13
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +1 -2
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +1 -1
- package/lib/components/Datagrid/useFiltering.d.ts +1 -0
- package/lib/components/Datagrid/useFiltering.js +13 -1
- package/package.json +3 -3
- package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +21 -19
package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts
CHANGED
@@ -1,28 +1,48 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
}
|
9
|
-
|
10
|
-
|
11
|
-
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
import PropTypes from 'prop-types';
|
8
|
+
import { Action, ConditionBuilderState } from '../ConditionBuilder.types';
|
9
|
+
interface ConditionBuilderContentProps {
|
10
|
+
startConditionLabel: string;
|
11
|
+
getConditionState: (state: ConditionBuilderState) => void;
|
12
|
+
getActionsState?: (state: Action[]) => void;
|
13
|
+
initialState?: ConditionBuilderState;
|
14
|
+
actions?: Action[];
|
15
|
+
}
|
16
|
+
declare const ConditionBuilderContent: {
|
17
|
+
({ startConditionLabel, getConditionState, getActionsState, initialState, actions, }: ConditionBuilderContentProps): import("react/jsx-runtime").JSX.Element;
|
18
|
+
propTypes: {
|
19
|
+
/**
|
20
|
+
* optional array of object that give the list of actions.
|
21
|
+
*/
|
22
|
+
actions: PropTypes.Requireable<(PropTypes.InferProps<{
|
12
23
|
id: PropTypes.Validator<NonNullable<NonNullable<string | number | null | undefined>>>;
|
13
24
|
label: PropTypes.Validator<string>;
|
14
25
|
}> | null | undefined)[]>;
|
15
|
-
|
16
|
-
|
17
|
-
|
26
|
+
/**
|
27
|
+
* callback functions that will provide the updated action state back.
|
28
|
+
*/
|
29
|
+
getActionsState: PropTypes.Requireable<(...args: any[]) => any>;
|
30
|
+
/**
|
31
|
+
* This is a callback function that returns the updated state
|
32
|
+
*/
|
33
|
+
getConditionState: PropTypes.Validator<(...args: any[]) => any>;
|
34
|
+
/**
|
35
|
+
* Optional prop if the condition building need to start from a predefined initial state
|
36
|
+
*/
|
37
|
+
initialState: PropTypes.Requireable<PropTypes.InferProps<{
|
18
38
|
groups: PropTypes.Requireable<(PropTypes.InferProps<{
|
19
|
-
groupOperator: PropTypes.
|
20
|
-
statement: PropTypes.
|
39
|
+
groupOperator: PropTypes.Requireable<string>;
|
40
|
+
statement: PropTypes.Requireable<string>;
|
21
41
|
conditions: PropTypes.Requireable<(object | null | undefined)[]>;
|
22
42
|
}> | null | undefined)[]>;
|
23
43
|
operator: PropTypes.Requireable<string>;
|
24
44
|
}>>;
|
25
|
-
|
26
|
-
}
|
27
|
-
}
|
28
|
-
|
45
|
+
startConditionLabel: PropTypes.Validator<string>;
|
46
|
+
};
|
47
|
+
};
|
48
|
+
export default ConditionBuilderContent;
|
@@ -30,7 +30,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
30
30
|
|
31
31
|
var _GroupConnector;
|
32
32
|
var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
33
|
-
var _rootState$
|
33
|
+
var _rootState$groups4;
|
34
34
|
var startConditionLabel = _ref.startConditionLabel,
|
35
35
|
getConditionState = _ref.getConditionState,
|
36
36
|
getActionsState = _ref.getActionsState,
|
@@ -67,26 +67,27 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
67
67
|
setIsConditionBuilderActive(false);
|
68
68
|
}
|
69
69
|
if (getConditionState) {
|
70
|
-
getConditionState(rootState);
|
70
|
+
getConditionState(rootState !== null && rootState !== void 0 ? rootState : {});
|
71
71
|
}
|
72
72
|
|
73
73
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
74
74
|
}, [rootState]);
|
75
75
|
React.useEffect(function () {
|
76
|
-
getActionsState === null || getActionsState === void 0 || getActionsState(actionState);
|
76
|
+
getActionsState === null || getActionsState === void 0 || getActionsState(actionState !== null && actionState !== void 0 ? actionState : []);
|
77
77
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
78
78
|
}, [actionState]);
|
79
79
|
var onStartConditionBuilder = function onStartConditionBuilder() {
|
80
80
|
//when add condition button is clicked.
|
81
81
|
setIsConditionBuilderActive(true);
|
82
|
-
setRootState(initialState !== null && initialState !== void 0 ? initialState : ConditionBuilderProvider.emptyState); //here we can set an empty skeleton object for an empty condition builder,
|
82
|
+
setRootState === null || setRootState === void 0 || setRootState(initialState !== null && initialState !== void 0 ? initialState : ConditionBuilderProvider.emptyState); //here we can set an empty skeleton object for an empty condition builder,
|
83
83
|
//or we can even pre-populate some existing builder and continue editing
|
84
84
|
};
|
85
85
|
var _onRemove = React.useCallback(function (groupId) {
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
86
|
+
var _rootState$groups2;
|
87
|
+
setRootState === null || setRootState === void 0 || setRootState(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, rootState), {}, {
|
88
|
+
groups: rootState ? rootState === null || rootState === void 0 || (_rootState$groups2 = rootState.groups) === null || _rootState$groups2 === void 0 ? void 0 : _rootState$groups2.filter(function (group) {
|
89
|
+
return groupId !== (group === null || group === void 0 ? void 0 : group.id);
|
90
|
+
}) : []
|
90
91
|
}));
|
91
92
|
}, [setRootState, rootState]);
|
92
93
|
var onChangeHandler = function onChangeHandler(updatedGroup, groupIndex) {
|
@@ -94,17 +95,18 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
94
95
|
* This method is triggered from inner components. This will be called every time when any change is to be updated in the rootState.
|
95
96
|
* This gets the updated group as argument.
|
96
97
|
*/
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
98
|
+
if (rootState && rootState.groups) {
|
99
|
+
var groups = [].concat(_rollupPluginBabelHelpers.toConsumableArray(rootState.groups ? rootState.groups.slice(0, groupIndex) : []), [updatedGroup], _rollupPluginBabelHelpers.toConsumableArray(rootState.groups ? rootState.groups.slice(groupIndex + 1) : []));
|
100
|
+
setRootState === null || setRootState === void 0 || setRootState(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, rootState), {}, {
|
101
|
+
groups: groups
|
102
|
+
}));
|
103
|
+
}
|
101
104
|
};
|
102
105
|
var addConditionGroupHandler = function addConditionGroupHandler() {
|
103
106
|
var newGroup = {
|
104
|
-
groupOperator: 'and',
|
105
|
-
//'and|or',
|
106
107
|
statement: 'if',
|
107
108
|
// 'if|exclude if',
|
109
|
+
groupOperator: 'and',
|
108
110
|
id: uuidv4["default"](),
|
109
111
|
conditions: [{
|
110
112
|
property: undefined,
|
@@ -114,13 +116,13 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
114
116
|
id: uuidv4["default"]()
|
115
117
|
}]
|
116
118
|
};
|
117
|
-
setRootState(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, rootState), {}, {
|
118
|
-
groups: [].concat(_rollupPluginBabelHelpers.toConsumableArray(rootState.groups), [newGroup])
|
119
|
+
setRootState === null || setRootState === void 0 || setRootState(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, rootState), {}, {
|
120
|
+
groups: rootState && rootState.groups ? [].concat(_rollupPluginBabelHelpers.toConsumableArray(rootState.groups), [newGroup]) : [newGroup]
|
119
121
|
}));
|
120
122
|
};
|
121
123
|
var getColorIndex = function getColorIndex() {
|
122
|
-
var _rootState$groups$len, _rootState$
|
123
|
-
var groupLength = (_rootState$groups$len = rootState === null || rootState === void 0 || (_rootState$
|
124
|
+
var _rootState$groups$len, _rootState$groups3;
|
125
|
+
var groupLength = (_rootState$groups$len = rootState === null || rootState === void 0 || (_rootState$groups3 = rootState.groups) === null || _rootState$groups3 === void 0 ? void 0 : _rootState$groups3.length) !== null && _rootState$groups$len !== void 0 ? _rootState$groups$len : 0;
|
124
126
|
return groupLength % 5;
|
125
127
|
};
|
126
128
|
if (!isConditionBuilderActive) {
|
@@ -142,7 +144,8 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
142
144
|
className: "".concat(DataConfigs.blockClass, "__content-container"),
|
143
145
|
role: "treegrid",
|
144
146
|
"aria-label": "condition builder tree"
|
145
|
-
}, rootState && (rootState === null || rootState === void 0 || (_rootState$
|
147
|
+
}, rootState && (rootState === null || rootState === void 0 || (_rootState$groups4 = rootState.groups) === null || _rootState$groups4 === void 0 ? void 0 : _rootState$groups4.map(function (eachGroup, groupIndex) {
|
148
|
+
var _ref2;
|
146
149
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
147
150
|
key: eachGroup.id,
|
148
151
|
className: "".concat(DataConfigs.blockClass, "__group-wrapper")
|
@@ -151,7 +154,7 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
151
154
|
aria: {
|
152
155
|
level: 1,
|
153
156
|
posinset: groupIndex * 2 + 1,
|
154
|
-
setsize: rootState.groups.length * 2
|
157
|
+
setsize: (_ref2 = rootState.groups && rootState.groups.length * 2) !== null && _ref2 !== void 0 ? _ref2 : 0
|
155
158
|
},
|
156
159
|
group: eachGroup,
|
157
160
|
onRemove: function onRemove() {
|
@@ -160,7 +163,7 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
160
163
|
onChange: function onChange(updatedGroup) {
|
161
164
|
onChangeHandler(updatedGroup, groupIndex);
|
162
165
|
}
|
163
|
-
}), groupIndex < rootState.groups.length - 1 && (_GroupConnector || (_GroupConnector = /*#__PURE__*/React__default["default"].createElement(GroupConnector["default"], null))));
|
166
|
+
}), rootState.groups && groupIndex < rootState.groups.length - 1 && (_GroupConnector || (_GroupConnector = /*#__PURE__*/React__default["default"].createElement(GroupConnector["default"], null))));
|
164
167
|
})), variant == 'tree' && /*#__PURE__*/React__default["default"].createElement("div", {
|
165
168
|
role: "row",
|
166
169
|
tabIndex: -1,
|
@@ -184,15 +187,14 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
184
187
|
previewType: "newGroup",
|
185
188
|
colorIndex: getColorIndex(),
|
186
189
|
group: {
|
187
|
-
groupOperator: rootState.operator
|
190
|
+
groupOperator: rootState === null || rootState === void 0 ? void 0 : rootState.operator,
|
191
|
+
id: uuidv4["default"]()
|
188
192
|
}
|
189
193
|
})), actions && /*#__PURE__*/React__default["default"].createElement(ConditionBuilderActions["default"], {
|
190
194
|
actions: actions,
|
191
|
-
className: "".concat(DataConfigs.blockClass, "__actions-container")
|
192
|
-
variant: variant
|
195
|
+
className: "".concat(DataConfigs.blockClass, "__actions-container")
|
193
196
|
}));
|
194
197
|
};
|
195
|
-
var ConditionBuilderContent$1 = ConditionBuilderContent;
|
196
198
|
ConditionBuilderContent.propTypes = {
|
197
199
|
/**
|
198
200
|
* optional array of object that give the list of actions.
|
@@ -214,11 +216,11 @@ ConditionBuilderContent.propTypes = {
|
|
214
216
|
*/
|
215
217
|
initialState: index["default"].shape({
|
216
218
|
groups: index["default"].arrayOf(index["default"].shape({
|
217
|
-
groupOperator: index["default"].string
|
218
|
-
statement: index["default"].string
|
219
|
+
groupOperator: index["default"].string,
|
220
|
+
statement: index["default"].string,
|
219
221
|
conditions: index["default"].arrayOf(index["default"].oneOfType([index["default"].shape({
|
220
|
-
property: index["default"].string
|
221
|
-
operator: index["default"].string
|
222
|
+
property: index["default"].string,
|
223
|
+
operator: index["default"].string,
|
222
224
|
value: index["default"].oneOfType([index["default"].string, index["default"].arrayOf(index["default"].shape({
|
223
225
|
id: index["default"].string,
|
224
226
|
label: index["default"].string
|
@@ -235,4 +237,4 @@ ConditionBuilderContent.propTypes = {
|
|
235
237
|
startConditionLabel: index["default"].string.isRequired
|
236
238
|
};
|
237
239
|
|
238
|
-
exports["default"] = ConditionBuilderContent
|
240
|
+
exports["default"] = ConditionBuilderContent;
|
package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts
CHANGED
@@ -1,50 +1,11 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
conditions: {
|
8
|
-
property: undefined;
|
9
|
-
operator: string;
|
10
|
-
value: string;
|
11
|
-
popoverToOpen: string;
|
12
|
-
id: any;
|
13
|
-
}[];
|
14
|
-
}[];
|
15
|
-
}
|
16
|
-
export const ConditionBuilderContext: React.Context<any>;
|
17
|
-
export function ConditionBuilderProvider(props: any): import("react/jsx-runtime").JSX.Element;
|
18
|
-
export namespace ConditionBuilderProvider {
|
19
|
-
namespace propTypes {
|
20
|
-
let children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
|
21
|
-
let conditionBuilderRef: PropTypes.Requireable<object>;
|
22
|
-
let getOptions: PropTypes.Requireable<(...args: any[]) => any>;
|
23
|
-
let inputConfig: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
|
24
|
-
properties: PropTypes.Requireable<(PropTypes.InferProps<{
|
25
|
-
id: PropTypes.Validator<string>;
|
26
|
-
label: PropTypes.Validator<string>;
|
27
|
-
icon: PropTypes.Requireable<object>;
|
28
|
-
type: PropTypes.Validator<string>;
|
29
|
-
config: PropTypes.Requireable<PropTypes.InferProps<{
|
30
|
-
options: PropTypes.Requireable<(PropTypes.InferProps<{
|
31
|
-
id: PropTypes.Validator<string>;
|
32
|
-
label: PropTypes.Validator<string>;
|
33
|
-
icon: PropTypes.Requireable<object>;
|
34
|
-
}> | null | undefined)[]>;
|
35
|
-
component: PropTypes.Requireable<(...args: any[]) => any>;
|
36
|
-
operators: PropTypes.Requireable<(PropTypes.InferProps<{
|
37
|
-
id: PropTypes.Validator<string>;
|
38
|
-
label: PropTypes.Validator<string>;
|
39
|
-
}> | null | undefined)[]>;
|
40
|
-
long: PropTypes.Requireable<boolean>;
|
41
|
-
}>>;
|
42
|
-
}> | null | undefined)[]>;
|
43
|
-
}>>>;
|
44
|
-
let popOverSearchThreshold: PropTypes.Validator<number>;
|
45
|
-
let translateWithId: PropTypes.Requireable<(...args: any[]) => any>;
|
46
|
-
let variant: PropTypes.Validator<string>;
|
47
|
-
}
|
48
|
-
}
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
49
7
|
import React from 'react';
|
50
|
-
import
|
8
|
+
import { ConditionBuilderContextProps, ConditionBuilderState } from '../ConditionBuilder.types';
|
9
|
+
export declare const emptyState: ConditionBuilderState;
|
10
|
+
export declare const ConditionBuilderContext: React.Context<ConditionBuilderContextProps>;
|
11
|
+
export declare const ConditionBuilderProvider: React.FC<ConditionBuilderContextProps>;
|
@@ -33,23 +33,11 @@ var emptyState = {
|
|
33
33
|
}]
|
34
34
|
}]
|
35
35
|
};
|
36
|
-
var ConditionBuilderContext = /*#__PURE__*/React.createContext(
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
// ;
|
42
|
-
// return {
|
43
|
-
// ...state,
|
44
|
-
// ...action.payload
|
45
|
-
// }
|
46
|
-
// break;
|
47
|
-
// default:
|
48
|
-
// return state;
|
49
|
-
// }
|
50
|
-
|
51
|
-
// }
|
52
|
-
|
36
|
+
var ConditionBuilderContext = /*#__PURE__*/React.createContext({
|
37
|
+
rootState: {
|
38
|
+
groups: []
|
39
|
+
}
|
40
|
+
});
|
53
41
|
var ConditionBuilderProvider = function ConditionBuilderProvider(props) {
|
54
42
|
var _useState = React.useState({
|
55
43
|
groups: []
|
@@ -61,19 +49,20 @@ var ConditionBuilderProvider = function ConditionBuilderProvider(props) {
|
|
61
49
|
_useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
|
62
50
|
actionState = _useState4[0],
|
63
51
|
setActionState = _useState4[1];
|
52
|
+
var contextValue = {
|
53
|
+
rootState: rootState,
|
54
|
+
setRootState: setRootState,
|
55
|
+
actionState: actionState,
|
56
|
+
setActionState: setActionState,
|
57
|
+
inputConfig: props.inputConfig,
|
58
|
+
popOverSearchThreshold: props.popOverSearchThreshold,
|
59
|
+
getOptions: props.getOptions,
|
60
|
+
variant: props.variant,
|
61
|
+
translateWithId: props.translateWithId,
|
62
|
+
conditionBuilderRef: props.conditionBuilderRef
|
63
|
+
};
|
64
64
|
return /*#__PURE__*/React__default["default"].createElement(ConditionBuilderContext.Provider, {
|
65
|
-
value:
|
66
|
-
rootState: rootState,
|
67
|
-
setRootState: setRootState,
|
68
|
-
actionState: actionState,
|
69
|
-
setActionState: setActionState,
|
70
|
-
inputConfig: props.inputConfig,
|
71
|
-
popOverSearchThreshold: props.popOverSearchThreshold,
|
72
|
-
getOptions: props.getOptions,
|
73
|
-
variant: props.variant,
|
74
|
-
translateWithId: props.translateWithId,
|
75
|
-
conditionBuilderRef: props.conditionBuilderRef
|
76
|
-
}
|
65
|
+
value: contextValue
|
77
66
|
},
|
78
67
|
// eslint-disable-next-line react/prop-types
|
79
68
|
props.children);
|
@@ -86,6 +75,7 @@ ConditionBuilderProvider.propTypes = {
|
|
86
75
|
/**
|
87
76
|
* ref of condition builder
|
88
77
|
*/
|
78
|
+
/**@ts-ignore */
|
89
79
|
conditionBuilderRef: index["default"].object,
|
90
80
|
/**
|
91
81
|
* This is an optional callback function that will be triggered when options array is not passed in the inputConfig against a property.
|
@@ -101,6 +91,7 @@ ConditionBuilderProvider.propTypes = {
|
|
101
91
|
* This is a mandatory prop that defines the input to the condition builder.
|
102
92
|
|
103
93
|
*/
|
94
|
+
/**@ts-ignore */
|
104
95
|
inputConfig: index["default"].shape({
|
105
96
|
properties: index["default"].arrayOf(index["default"].shape({
|
106
97
|
id: index["default"].string.isRequired,
|
@@ -1,32 +1,82 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
type: any;
|
9
|
-
showToolTip: any;
|
10
|
-
condition: any;
|
11
|
-
popOverClassName: any;
|
12
|
-
config: any;
|
13
|
-
renderChildren: any;
|
14
|
-
onChange: any;
|
15
|
-
}): import("react/jsx-runtime").JSX.Element;
|
16
|
-
export namespace ConditionBuilderItem {
|
17
|
-
namespace propTypes {
|
18
|
-
let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
19
|
-
let className: PropTypes.Requireable<string>;
|
20
|
-
let condition: PropTypes.Requireable<object>;
|
21
|
-
let config: PropTypes.Requireable<object>;
|
22
|
-
let label: PropTypes.Requireable<NonNullable<string | object | null | undefined>>;
|
23
|
-
let onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
24
|
-
let popOverClassName: PropTypes.Requireable<string>;
|
25
|
-
let renderChildren: PropTypes.Requireable<(...args: any[]) => any>;
|
26
|
-
let renderIcon: PropTypes.Requireable<object>;
|
27
|
-
let showToolTip: PropTypes.Requireable<boolean>;
|
28
|
-
let title: PropTypes.Requireable<string>;
|
29
|
-
let type: PropTypes.Requireable<string>;
|
30
|
-
}
|
31
|
-
}
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
import React, { PropsWithChildren, ReactNode, RefObject } from 'react';
|
32
8
|
import PropTypes from 'prop-types';
|
9
|
+
import { CarbonIconType } from '@carbon/react/icons';
|
10
|
+
import { Condition, PropertyConfig, Action, Option } from '../ConditionBuilder.types';
|
11
|
+
interface ConditionBuilderItemProps extends PropsWithChildren {
|
12
|
+
className?: string;
|
13
|
+
label?: string | Option | Option[];
|
14
|
+
renderIcon?: CarbonIconType;
|
15
|
+
title?: string;
|
16
|
+
showToolTip?: boolean;
|
17
|
+
popOverClassName?: string;
|
18
|
+
type?: string;
|
19
|
+
condition?: Action & Condition;
|
20
|
+
config?: PropertyConfig;
|
21
|
+
renderChildren?: (ref: RefObject<HTMLDivElement>) => ReactNode;
|
22
|
+
onChange?: (val: string) => void;
|
23
|
+
tabIndex?: number;
|
24
|
+
onMouseEnter?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
25
|
+
onMouseLeave?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
26
|
+
onFocus?: React.FocusEventHandler<HTMLButtonElement>;
|
27
|
+
onBlur?: React.FocusEventHandler<HTMLButtonElement>;
|
28
|
+
}
|
29
|
+
export declare const ConditionBuilderItem: {
|
30
|
+
({ children, className, label, renderIcon, title, type, showToolTip, condition, popOverClassName, config, renderChildren, onChange, ...rest }: ConditionBuilderItemProps): import("react/jsx-runtime").JSX.Element;
|
31
|
+
propTypes: {
|
32
|
+
/**
|
33
|
+
* provide the contents of the popover
|
34
|
+
*/
|
35
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
36
|
+
/**
|
37
|
+
* Provide an optional class to be applied to the containing node.
|
38
|
+
*/
|
39
|
+
className: PropTypes.Requireable<string>;
|
40
|
+
/**
|
41
|
+
* current condition state object
|
42
|
+
*/
|
43
|
+
condition: PropTypes.Requireable<object>;
|
44
|
+
/**
|
45
|
+
* this is the config object again the current property from inputConfig
|
46
|
+
*/
|
47
|
+
config: PropTypes.Requireable<object>;
|
48
|
+
/**
|
49
|
+
* text to be displayed in the field
|
50
|
+
*/
|
51
|
+
label: PropTypes.Requireable<NonNullable<string | object | null | undefined>>;
|
52
|
+
/**
|
53
|
+
* callback to update the current condition of the state tree
|
54
|
+
*/
|
55
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
56
|
+
/**
|
57
|
+
* class name for popover
|
58
|
+
*/
|
59
|
+
popOverClassName: PropTypes.Requireable<string>;
|
60
|
+
/**
|
61
|
+
* callback prop that returns the jsx for children
|
62
|
+
*/
|
63
|
+
renderChildren: PropTypes.Requireable<(...args: any[]) => any>;
|
64
|
+
/**
|
65
|
+
* Optional prop to allow overriding the icon rendering.
|
66
|
+
*/
|
67
|
+
renderIcon: PropTypes.Requireable<object>;
|
68
|
+
/**
|
69
|
+
* show tool tip
|
70
|
+
*/
|
71
|
+
showToolTip: PropTypes.Requireable<boolean>;
|
72
|
+
/**
|
73
|
+
* title of the popover
|
74
|
+
*/
|
75
|
+
title: PropTypes.Requireable<string>;
|
76
|
+
/**
|
77
|
+
* input type
|
78
|
+
*/
|
79
|
+
type: PropTypes.Requireable<string>;
|
80
|
+
};
|
81
|
+
};
|
82
|
+
export {};
|
@@ -84,7 +84,7 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
|
|
84
84
|
if (condition.popoverToOpen && currentField !== condition.popoverToOpen) {
|
85
85
|
// close the previous popover
|
86
86
|
closePopover();
|
87
|
-
} else if (currentField == 'valueField' && type == 'option' && condition.operator !== 'oneOf') {
|
87
|
+
} else if (currentField == 'valueField' && type == 'option' && (condition === null || condition === void 0 ? void 0 : condition.operator) !== 'oneOf') {
|
88
88
|
//close the current popover if the field is valueField and is a single select dropdown. For all other inputs ,popover need to be open on value changes.
|
89
89
|
closePopover();
|
90
90
|
}
|
@@ -102,7 +102,8 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
|
|
102
102
|
React.useEffect(function () {
|
103
103
|
//this will focus the first input field in the popover
|
104
104
|
if (open && popoverRef.current) {
|
105
|
-
var
|
105
|
+
var _popoverRef$current;
|
106
|
+
var firstFocusableElement = popoverRef === null || popoverRef === void 0 || (_popoverRef$current = popoverRef.current) === null || _popoverRef$current === void 0 ? void 0 : _popoverRef$current.querySelector('input,textarea');
|
106
107
|
if (firstFocusableElement) {
|
107
108
|
setTimeout(function () {
|
108
109
|
return firstFocusableElement.focus();
|
@@ -163,10 +164,9 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
|
|
163
164
|
className: className,
|
164
165
|
"aria-haspopup": true,
|
165
166
|
"aria-expanded": open,
|
166
|
-
renderIcon: renderIcon ? renderIcon : label == undefined ? icons.Add :
|
167
|
+
renderIcon: renderIcon ? renderIcon : label == undefined ? icons.Add : undefined,
|
167
168
|
showToolTip: showToolTip,
|
168
|
-
isInvalid: isInvalid
|
169
|
-
condition: condition
|
169
|
+
isInvalid: isInvalid
|
170
170
|
}, rest)), open && /*#__PURE__*/React__default["default"].createElement(react.PopoverContent, {
|
171
171
|
className: "".concat(DataConfigs.blockClass, "__popover-content-wrapper"),
|
172
172
|
role: "dialog",
|
@@ -1,13 +1,28 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
namespace propTypes {
|
8
|
-
let conditionState: PropTypes.Requireable<object>;
|
9
|
-
let onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
10
|
-
let parentRef: PropTypes.Requireable<object>;
|
11
|
-
}
|
12
|
-
}
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
13
7
|
import PropTypes from 'prop-types';
|
8
|
+
export declare const ConditionBuilderItemDate: {
|
9
|
+
({ conditionState, onChange, parentRef, }: {
|
10
|
+
conditionState: any;
|
11
|
+
onChange: any;
|
12
|
+
parentRef: any;
|
13
|
+
}): import("react/jsx-runtime").JSX.Element;
|
14
|
+
propTypes: {
|
15
|
+
/**
|
16
|
+
* current condition object
|
17
|
+
*/
|
18
|
+
conditionState: PropTypes.Requireable<object>;
|
19
|
+
/**
|
20
|
+
* callback to update state oin date change
|
21
|
+
*/
|
22
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
23
|
+
/**
|
24
|
+
* reference to the popover node
|
25
|
+
*/
|
26
|
+
parentRef: PropTypes.Requireable<object>;
|
27
|
+
};
|
28
|
+
};
|
@@ -25,7 +25,7 @@ var ConditionBuilderItemDate = function ConditionBuilderItemDate(_ref) {
|
|
25
25
|
var conditionState = _ref.conditionState,
|
26
26
|
onChange = _ref.onChange,
|
27
27
|
parentRef = _ref.parentRef;
|
28
|
-
var DatePickerInputRef = React.useRef();
|
28
|
+
var DatePickerInputRef = React.useRef(null);
|
29
29
|
var _useTranslations = useTranslations.useTranslations(['startText', 'endText']),
|
30
30
|
_useTranslations2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslations, 2),
|
31
31
|
startText = _useTranslations2[0],
|
@@ -1,13 +1,31 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
namespace propTypes {
|
8
|
-
let conditionState: PropTypes.Requireable<object>;
|
9
|
-
let config: PropTypes.Requireable<object>;
|
10
|
-
let onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
11
|
-
}
|
12
|
-
}
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
13
7
|
import PropTypes from 'prop-types';
|
8
|
+
import { Condition, PropertyConfigNumber } from '../../ConditionBuilder.types';
|
9
|
+
interface ConditionBuilderItemNumberProps {
|
10
|
+
conditionState: Condition;
|
11
|
+
config: PropertyConfigNumber['config'];
|
12
|
+
onChange: (value: string) => void;
|
13
|
+
}
|
14
|
+
export declare const ConditionBuilderItemNumber: {
|
15
|
+
({ conditionState, config, onChange, }: ConditionBuilderItemNumberProps): import("react/jsx-runtime").JSX.Element;
|
16
|
+
propTypes: {
|
17
|
+
/**
|
18
|
+
* current condition object
|
19
|
+
*/
|
20
|
+
conditionState: PropTypes.Requireable<object>;
|
21
|
+
/**
|
22
|
+
* current config object that this property is part of
|
23
|
+
*/
|
24
|
+
config: PropTypes.Requireable<object>;
|
25
|
+
/**
|
26
|
+
* callback to update state oin date change
|
27
|
+
*/
|
28
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
29
|
+
};
|
30
|
+
};
|
31
|
+
export {};
|
@@ -38,25 +38,30 @@ var ConditionBuilderItemNumber = function ConditionBuilderItemNumber(_ref) {
|
|
38
38
|
}
|
39
39
|
};
|
40
40
|
var checkIfValid = function checkIfValid(value) {
|
41
|
-
if (
|
41
|
+
if (config.max !== undefined && config.min === undefined && value > config.max) {
|
42
|
+
return false;
|
43
|
+
}
|
44
|
+
if (config.min !== undefined && config.max === undefined && value < config.min) {
|
45
|
+
return false;
|
46
|
+
}
|
47
|
+
if (config.max !== undefined && config.min !== undefined && (value > config.max || value < config.min)) {
|
42
48
|
return false;
|
43
49
|
}
|
44
50
|
return true;
|
45
51
|
};
|
46
52
|
var getDefaultValue = function getDefaultValue() {
|
47
|
-
var _conditionState$value
|
48
|
-
return (
|
53
|
+
var _split$, _conditionState$value;
|
54
|
+
return (_split$ = (_conditionState$value = conditionState.value) === null || _conditionState$value === void 0 || (_conditionState$value = _conditionState$value.split(' ')) === null || _conditionState$value === void 0 ? void 0 : _conditionState$value[0]) !== null && _split$ !== void 0 ? _split$ : '';
|
49
55
|
};
|
50
56
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
51
57
|
className: "".concat(DataConfigs.blockClass, "__item-number")
|
52
|
-
}, /*#__PURE__*/React__default["default"].createElement(react.NumberInput, _rollupPluginBabelHelpers["extends"]({
|
58
|
+
}, /*#__PURE__*/React__default["default"].createElement(react.NumberInput, _rollupPluginBabelHelpers["extends"]({}, config, {
|
53
59
|
label: conditionState.property,
|
54
60
|
hideLabel: true,
|
55
61
|
id: (_conditionState$prope = conditionState.property) === null || _conditionState$prope === void 0 ? void 0 : _conditionState$prope.replace(/\s/g, ''),
|
56
62
|
invalidText: invalidNumberWarnText,
|
57
63
|
allowEmpty: true,
|
58
|
-
onChange: onChangeHandler
|
59
|
-
}, config, {
|
64
|
+
onChange: onChangeHandler,
|
60
65
|
defaultValue: getDefaultValue()
|
61
66
|
})));
|
62
67
|
};
|