@carbon/ibm-products 2.48.0 → 2.49.0
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/css/index-full-carbon.css +29 -14
- 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 +11 -2
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +29 -14
- 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 +29 -14
- 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/APIKeyModal/APIKeyModal.types.d.ts +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 +30 -27
- package/es/components/ConditionBuilder/ConditionBuilder.d.ts +9 -2
- package/es/components/ConditionBuilder/ConditionBuilder.js +13 -9
- package/es/components/ConditionBuilder/ConditionBuilder.types.d.ts +151 -0
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +26 -12
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +7 -7
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +62 -27
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +2 -3
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +86 -37
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.d.ts +29 -14
- package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +10 -9
- package/es/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +4 -1
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +40 -20
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +40 -37
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +10 -49
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +22 -31
- package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +6 -0
- package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +7 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +81 -31
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +14 -8
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.d.ts +27 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +2 -3
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.d.ts +30 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +12 -7
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +35 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +16 -9
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.d.ts +32 -12
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +4 -4
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.d.ts +35 -14
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +5 -6
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.d.ts +25 -10
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +1 -1
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.d.ts +44 -17
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +50 -40
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +30 -13
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +2 -3
- package/es/components/ConditionBuilder/utils/handleKeyboardEvents.js +9 -10
- package/es/components/ConditionBuilder/utils/useDataConfigs.d.ts +18 -0
- package/es/components/ConditionBuilder/utils/useDataConfigs.js +120 -0
- package/es/components/ConditionBuilder/utils/useTranslations.d.ts +1 -1
- package/es/components/ConditionBuilder/utils/useTranslations.js +4 -1
- package/es/components/ConditionBuilder/utils/util.d.ts +12 -0
- package/es/components/ConditionBuilder/utils/util.js +48 -2
- package/es/components/CreateFullPage/CreateFullPageStep.d.ts +2 -2
- package/es/components/CreateFullPage/index.d.ts +1 -0
- package/es/components/CreateTearsheet/CreateTearsheet.js +3 -4
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +8 -1
- package/es/components/Datagrid/Datagrid/DatagridToolbar.js +8 -3
- package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +20 -11
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +7 -2
- package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +12 -7
- package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +18 -16
- package/es/components/Datagrid/types/index.d.ts +1 -0
- package/es/components/Datagrid/useActionsColumn.js +1 -4
- package/es/components/Datagrid/useFiltering.d.ts +1 -0
- package/es/components/Datagrid/useFiltering.js +14 -3
- package/es/components/EditInPlace/EditInPlace.js +7 -5
- package/es/components/NotificationsPanel/NotificationsPanel.d.ts +2 -0
- package/es/components/NotificationsPanel/NotificationsPanel.js +75 -5
- package/es/components/TagOverflow/TagOverflow.d.ts +1 -0
- package/es/components/TagOverflow/TagOverflow.js +8 -2
- package/es/components/TagOverflow/TagOverflowPopover.d.ts +1 -0
- package/es/components/TagOverflow/TagOverflowPopover.js +7 -1
- package/es/components/TagSet/TagSetOverflow.js +1 -1
- package/es/components/Tearsheet/Tearsheet.d.ts +2 -2
- package/es/components/Tearsheet/TearsheetShell.js +7 -3
- package/es/components/Toolbar/ToolbarButton.d.ts +12 -1
- package/es/components/Toolbar/ToolbarButton.js +16 -8
- package/es/global/js/hooks/useFocus.d.ts +1 -1
- package/es/global/js/hooks/useFocus.js +40 -24
- package/es/global/js/utils/keyboardNavigation.d.ts +27 -0
- package/es/global/js/utils/keyboardNavigation.js +37 -0
- package/es/global/js/utils/wrapFocus.d.ts +25 -0
- package/es/global/js/utils/wrapFocus.js +68 -0
- package/lib/components/APIKeyModal/APIKeyModal.types.d.ts +1 -1
- 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 +36 -33
- package/lib/components/ConditionBuilder/ConditionBuilder.d.ts +9 -2
- package/lib/components/ConditionBuilder/ConditionBuilder.js +15 -11
- package/lib/components/ConditionBuilder/ConditionBuilder.types.d.ts +151 -0
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.d.ts +26 -12
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +15 -15
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.d.ts +62 -27
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +7 -8
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +86 -37
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +4 -4
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.d.ts +29 -14
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +11 -10
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +8 -5
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.d.ts +40 -20
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +47 -44
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.d.ts +10 -49
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +22 -31
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +6 -0
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +7 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts +81 -31
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +18 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.d.ts +27 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +3 -4
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.d.ts +30 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +13 -8
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +35 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +22 -15
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.d.ts +32 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +15 -15
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.d.ts +35 -14
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +5 -6
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.d.ts +25 -10
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +2 -2
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.d.ts +44 -17
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +60 -50
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts +30 -13
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +18 -19
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +12 -13
- package/lib/components/ConditionBuilder/utils/useDataConfigs.d.ts +18 -0
- package/lib/components/ConditionBuilder/utils/useDataConfigs.js +124 -0
- package/lib/components/ConditionBuilder/utils/useTranslations.d.ts +1 -1
- package/lib/components/ConditionBuilder/utils/useTranslations.js +4 -1
- package/lib/components/ConditionBuilder/utils/util.d.ts +12 -0
- package/lib/components/ConditionBuilder/utils/util.js +53 -3
- package/lib/components/CreateFullPage/CreateFullPageStep.d.ts +2 -2
- package/lib/components/CreateFullPage/index.d.ts +1 -0
- package/lib/components/CreateTearsheet/CreateTearsheet.js +3 -4
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +8 -1
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +8 -3
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +19 -10
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +6 -1
- package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +11 -6
- package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +18 -16
- package/lib/components/Datagrid/types/index.d.ts +1 -0
- package/lib/components/Datagrid/useActionsColumn.js +1 -4
- package/lib/components/Datagrid/useFiltering.d.ts +1 -0
- package/lib/components/Datagrid/useFiltering.js +13 -1
- package/lib/components/EditInPlace/EditInPlace.js +7 -5
- package/lib/components/NotificationsPanel/NotificationsPanel.d.ts +2 -0
- package/lib/components/NotificationsPanel/NotificationsPanel.js +74 -4
- package/lib/components/TagOverflow/TagOverflow.d.ts +1 -0
- package/lib/components/TagOverflow/TagOverflow.js +8 -2
- package/lib/components/TagOverflow/TagOverflowPopover.d.ts +1 -0
- package/lib/components/TagOverflow/TagOverflowPopover.js +7 -1
- package/lib/components/TagSet/TagSetOverflow.js +1 -1
- package/lib/components/Tearsheet/Tearsheet.d.ts +2 -2
- package/lib/components/Tearsheet/TearsheetShell.js +6 -2
- package/lib/components/Toolbar/ToolbarButton.d.ts +12 -1
- package/lib/components/Toolbar/ToolbarButton.js +15 -6
- package/lib/global/js/hooks/useFocus.d.ts +1 -1
- package/lib/global/js/hooks/useFocus.js +40 -24
- package/lib/global/js/utils/keyboardNavigation.d.ts +27 -0
- package/lib/global/js/utils/keyboardNavigation.js +43 -0
- package/lib/global/js/utils/wrapFocus.d.ts +25 -0
- package/lib/global/js/utils/wrapFocus.js +73 -0
- package/package.json +4 -4
- package/scss/components/ConditionBuilder/_condition-builder.scss +1 -1
- package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +33 -22
- package/scss/components/Datagrid/styles/_datagrid.scss +7 -0
- package/scss/components/Datagrid/styles/_useActionsColumn.scss +4 -0
- package/scss/components/EditInPlace/_edit-in-place.scss +2 -2
- package/telemetry.yml +15 -6
- package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +0 -28
- package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +0 -123
- package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +0 -28
- package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +0 -131
@@ -1,28 +1,104 @@
|
|
1
|
-
|
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 from 'react';
|
8
|
+
import PropTypes from 'prop-types';
|
9
|
+
import { Condition, ConditionGroup, LogicalOperator } from '../ConditionBuilder.types';
|
2
10
|
/**
|
3
11
|
* This component build each block of condition consisting of property, operator value and close button.
|
4
12
|
*/
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
13
|
+
interface ConditionBlockProps {
|
14
|
+
condition?: Condition;
|
15
|
+
onRemove: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
16
|
+
onChange: (condition: Condition) => void;
|
17
|
+
onConnectorOperatorChange?: (op: string) => void;
|
18
|
+
onStatementChange?: (v: string) => void;
|
19
|
+
addConditionHandler?: (conditionIndex: number) => void;
|
20
|
+
addConditionSubGroupHandler?: (conditionIndex: number) => void;
|
21
|
+
hideConditionSubGroupPreviewHandler?: () => void;
|
22
|
+
showConditionSubGroupPreviewHandler?: () => void;
|
23
|
+
hideConditionPreviewHandler?: () => void;
|
24
|
+
showConditionPreviewHandler?: () => void;
|
25
|
+
conjunction?: LogicalOperator;
|
26
|
+
isStatement?: boolean;
|
27
|
+
group: ConditionGroup;
|
28
|
+
conditionIndex: number;
|
29
|
+
aria: {
|
30
|
+
level: number;
|
31
|
+
posinset: number;
|
32
|
+
setsize?: number;
|
33
|
+
};
|
34
|
+
isLastCondition: (index: number, conditions: (ConditionGroup | Condition)[]) => void;
|
27
35
|
}
|
28
|
-
|
36
|
+
declare const ConditionBlock: {
|
37
|
+
(props: ConditionBlockProps): import("react/jsx-runtime").JSX.Element;
|
38
|
+
propTypes: {
|
39
|
+
/**
|
40
|
+
* callback to add a new condition
|
41
|
+
*/
|
42
|
+
addConditionHandler: PropTypes.Requireable<(...args: any[]) => any>;
|
43
|
+
/**
|
44
|
+
* callback to add a new condition subgroup
|
45
|
+
*/
|
46
|
+
addConditionSubGroupHandler: PropTypes.Requireable<(...args: any[]) => any>;
|
47
|
+
/**
|
48
|
+
* object hold aria attributes
|
49
|
+
*/
|
50
|
+
aria: PropTypes.Requireable<object>;
|
51
|
+
condition: PropTypes.Requireable<object>;
|
52
|
+
conditionIndex: PropTypes.Requireable<number>;
|
53
|
+
/**
|
54
|
+
* string that decides to show the condition connector
|
55
|
+
*/
|
56
|
+
conjunction: PropTypes.Requireable<string>;
|
57
|
+
/**
|
58
|
+
* object that hold the current group object where is condition is part of
|
59
|
+
*/
|
60
|
+
group: PropTypes.Requireable<object>;
|
61
|
+
/**
|
62
|
+
* handler for hiding sub group preview
|
63
|
+
*/
|
64
|
+
hideConditionPreviewHandler: PropTypes.Requireable<(...args: any[]) => any>;
|
65
|
+
/**
|
66
|
+
* handler for hiding sub group preview
|
67
|
+
*/
|
68
|
+
hideConditionSubGroupPreviewHandler: PropTypes.Requireable<(...args: any[]) => any>;
|
69
|
+
isLastCondition: PropTypes.Requireable<(...args: any[]) => any>;
|
70
|
+
/**
|
71
|
+
* boolean that decides to show the statement(if/ excl.if)
|
72
|
+
*/
|
73
|
+
isStatement: PropTypes.Requireable<boolean>;
|
74
|
+
/**
|
75
|
+
* callback to update the current condition of the state tree
|
76
|
+
*/
|
77
|
+
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
78
|
+
/**
|
79
|
+
* callback to handle the connector(and/or) change
|
80
|
+
*/
|
81
|
+
onConnectorOperatorChange: PropTypes.Requireable<(...args: any[]) => any>;
|
82
|
+
/**
|
83
|
+
* callback for Remove a condition
|
84
|
+
*/
|
85
|
+
onRemove: PropTypes.Requireable<(...args: any[]) => any>;
|
86
|
+
/**
|
87
|
+
* callback to handle the statement(if/ excl.if) change
|
88
|
+
*/
|
89
|
+
onStatementChange: PropTypes.Requireable<(...args: any[]) => any>;
|
90
|
+
/**
|
91
|
+
* handler for showing add condition preview
|
92
|
+
*/
|
93
|
+
showConditionPreviewHandler: PropTypes.Requireable<(...args: any[]) => any>;
|
94
|
+
/**
|
95
|
+
* handler for showing sub group preview
|
96
|
+
*/
|
97
|
+
showConditionSubGroupPreviewHandler: PropTypes.Requireable<(...args: any[]) => any>;
|
98
|
+
/**
|
99
|
+
* object that hold the current condition
|
100
|
+
*/
|
101
|
+
state: PropTypes.Requireable<object>;
|
102
|
+
};
|
103
|
+
};
|
104
|
+
export default ConditionBlock;
|
@@ -10,7 +10,6 @@ import React__default, { useContext, useState } from 'react';
|
|
10
10
|
import { Close } from '@carbon/react/icons';
|
11
11
|
import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
|
12
12
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
13
|
-
import { blockClass, statementConfig, operatorConfig } from '../ConditionBuilderContext/DataConfigs.js';
|
14
13
|
import cx from 'classnames';
|
15
14
|
import ConditionConnector from '../ConditionBuilderConnector/ConditionConnector.js';
|
16
15
|
import { ConditionBuilderItemNumber } from '../ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js';
|
@@ -18,12 +17,13 @@ import { ConditionBuilderItemText } from '../ConditionBuilderItem/ConditionBuild
|
|
18
17
|
import { ConditionBuilderItemDate } from '../ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js';
|
19
18
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
20
19
|
import { ConditionBuilderButton } from '../ConditionBuilderButton/ConditionBuilderButton.js';
|
21
|
-
import { checkIsValid, focusThisField } from '../utils/util.js';
|
20
|
+
import { blockClass, HIERARCHICAL_VARIANT, NON_HIERARCHICAL_VARIANT, checkIsValid, focusThisField } from '../utils/util.js';
|
22
21
|
import { ConditionBuilderItemTime } from '../ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js';
|
23
22
|
import ConditionBuilderAdd from '../ConditionBuilderAdd/ConditionBuilderAdd.js';
|
24
23
|
import { ItemOption } from '../ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js';
|
25
24
|
import { ItemOptionForValueField } from '../ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js';
|
26
25
|
import { useTranslations } from '../utils/useTranslations.js';
|
26
|
+
import { useDataConfigs } from '../utils/useDataConfigs.js';
|
27
27
|
|
28
28
|
var _div;
|
29
29
|
|
@@ -32,13 +32,10 @@ var _div;
|
|
32
32
|
*/
|
33
33
|
|
34
34
|
var ConditionBlock = function ConditionBlock(props) {
|
35
|
-
var _props$condition = props.condition,
|
36
|
-
property = _props$condition.property,
|
37
|
-
value = _props$condition.value,
|
38
|
-
operator = _props$condition.operator;
|
39
35
|
var onRemove = props.onRemove,
|
40
36
|
onChange = props.onChange,
|
41
|
-
condition = props.condition,
|
37
|
+
_props$condition = props.condition,
|
38
|
+
condition = _props$condition === void 0 ? {} : _props$condition,
|
42
39
|
conjunction = props.conjunction,
|
43
40
|
onConnectorOperatorChange = props.onConnectorOperatorChange,
|
44
41
|
isStatement = props.isStatement,
|
@@ -53,6 +50,9 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
53
50
|
hideConditionPreviewHandler = props.hideConditionPreviewHandler,
|
54
51
|
showConditionPreviewHandler = props.showConditionPreviewHandler,
|
55
52
|
isLastCondition = props.isLastCondition;
|
53
|
+
var property = condition.property,
|
54
|
+
value = condition.value,
|
55
|
+
operator = condition.operator;
|
56
56
|
var _useContext = useContext(ConditionBuilderContext),
|
57
57
|
inputConfig = _useContext.inputConfig,
|
58
58
|
variant = _useContext.variant,
|
@@ -72,19 +72,22 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
72
72
|
propertyText = _useTranslations2[2],
|
73
73
|
operatorText = _useTranslations2[3],
|
74
74
|
removeConditionText = _useTranslations2[4];
|
75
|
+
var _useDataConfigs = useDataConfigs(),
|
76
|
+
statementConfig = _useDataConfigs.statementConfig,
|
77
|
+
operatorConfig = _useDataConfigs.operatorConfig;
|
75
78
|
|
76
79
|
//filtering the current property to access its properties and config options
|
77
80
|
var getCurrentConfig = function getCurrentConfig(property) {
|
78
81
|
var _inputConfig$properti, _inputConfig$properti2;
|
79
|
-
return (_inputConfig$properti = (_inputConfig$properti2 = inputConfig.properties) === null || _inputConfig$properti2 === void 0 ? void 0 : _inputConfig$properti2.find(function (eachProperty) {
|
82
|
+
return (_inputConfig$properti = inputConfig === null || inputConfig === void 0 || (_inputConfig$properti2 = inputConfig.properties) === null || _inputConfig$properti2 === void 0 ? void 0 : _inputConfig$properti2.find(function (eachProperty) {
|
80
83
|
return eachProperty.id == property;
|
81
84
|
})) !== null && _inputConfig$properti !== void 0 ? _inputConfig$properti : {};
|
82
85
|
};
|
83
|
-
var
|
84
|
-
icon =
|
85
|
-
type =
|
86
|
-
config =
|
87
|
-
label =
|
86
|
+
var _ref = getCurrentConfig(property),
|
87
|
+
icon = _ref.icon,
|
88
|
+
type = _ref.type,
|
89
|
+
config = _ref.config,
|
90
|
+
label = _ref.label;
|
88
91
|
|
89
92
|
//Below possible input types expected for value field.
|
90
93
|
var itemComponents = {
|
@@ -96,7 +99,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
96
99
|
custom: config === null || config === void 0 ? void 0 : config.component,
|
97
100
|
textarea: ConditionBuilderItemText
|
98
101
|
};
|
99
|
-
var ItemComponent =
|
102
|
+
var ItemComponent = itemComponents[type];
|
100
103
|
var showAllActionsHandler = function showAllActionsHandler() {
|
101
104
|
setShowAllActions(true);
|
102
105
|
};
|
@@ -105,7 +108,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
105
108
|
};
|
106
109
|
var onStatementChangeHandler = function onStatementChangeHandler(v, evt) {
|
107
110
|
focusThisField(evt, conditionBuilderRef);
|
108
|
-
onStatementChange(v);
|
111
|
+
onStatementChange === null || onStatementChange === void 0 || onStatementChange(v);
|
109
112
|
};
|
110
113
|
var onPropertyChangeHandler = function onPropertyChangeHandler(newProperty) {
|
111
114
|
onChange(_objectSpread2(_objectSpread2({}, condition), {}, {
|
@@ -136,7 +139,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
136
139
|
setShowDeletionPreview(false);
|
137
140
|
};
|
138
141
|
var manageActionButtons = function manageActionButtons(conditionIndex, conditions) {
|
139
|
-
if (variant ===
|
142
|
+
if (variant === HIERARCHICAL_VARIANT) {
|
140
143
|
return true;
|
141
144
|
}
|
142
145
|
return isLastCondition(conditionIndex, conditions);
|
@@ -150,7 +153,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
150
153
|
});
|
151
154
|
};
|
152
155
|
var getAriaAttributes = function getAriaAttributes() {
|
153
|
-
return variant ==
|
156
|
+
return variant == HIERARCHICAL_VARIANT ? {
|
154
157
|
'aria-level': aria.level,
|
155
158
|
'aria-posinset': aria.posinset,
|
156
159
|
'aria-setsize': aria.setsize
|
@@ -171,7 +174,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
171
174
|
});
|
172
175
|
};
|
173
176
|
return /*#__PURE__*/React__default.createElement("div", _extends({
|
174
|
-
className: cx("".concat(blockClass, "__condition-block"), _defineProperty({}, "".concat(blockClass, "__condition__deletion-preview"), showDeletionPreview), _defineProperty({}, "".concat(blockClass, "__gap-bottom"), variant ==
|
177
|
+
className: cx("".concat(blockClass, "__condition-block"), _defineProperty({}, "".concat(blockClass, "__condition__deletion-preview"), showDeletionPreview), _defineProperty({}, "".concat(blockClass, "__gap-bottom"), variant == HIERARCHICAL_VARIANT), _defineProperty({}, "".concat(blockClass, "__gap ").concat(blockClass, "__gap-bottom"), variant == NON_HIERARCHICAL_VARIANT), _defineProperty({}, "".concat(blockClass, "__condition--interacting"), showAllActions)),
|
175
178
|
role: "row",
|
176
179
|
"aria-label": conditionRowText
|
177
180
|
}, getAriaAttributes(), {
|
@@ -183,7 +186,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
183
186
|
className: "".concat(blockClass, "__gap"),
|
184
187
|
operator: conjunction,
|
185
188
|
onChange: function onChange(op) {
|
186
|
-
return onConnectorOperatorChange(op);
|
189
|
+
return onConnectorOperatorChange === null || onConnectorOperatorChange === void 0 ? void 0 : onConnectorOperatorChange(op);
|
187
190
|
}
|
188
191
|
}) : _div || (_div = /*#__PURE__*/React__default.createElement("div", {
|
189
192
|
role: "gridcell"
|
@@ -201,12 +204,13 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
201
204
|
},
|
202
205
|
onChange: onStatementChangeHandler,
|
203
206
|
config: {
|
204
|
-
options: statementConfig
|
207
|
+
options: statementConfig,
|
208
|
+
isStatement: true
|
205
209
|
}
|
206
210
|
})), /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
|
207
211
|
label: label !== null && label !== void 0 ? label : condition === null || condition === void 0 ? void 0 : condition.property,
|
208
212
|
title: propertyText,
|
209
|
-
renderIcon: icon !== null && icon !== void 0 ? icon :
|
213
|
+
renderIcon: icon !== null && icon !== void 0 ? icon : undefined,
|
210
214
|
className: "".concat(blockClass, "__property-field"),
|
211
215
|
"data-name": "propertyField",
|
212
216
|
condition: condition,
|
@@ -219,7 +223,7 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
219
223
|
},
|
220
224
|
onChange: onPropertyChangeHandler,
|
221
225
|
config: {
|
222
|
-
options: inputConfig.properties
|
226
|
+
options: inputConfig === null || inputConfig === void 0 ? void 0 : inputConfig.properties
|
223
227
|
}
|
224
228
|
})), checkIsValid(property) && /*#__PURE__*/React__default.createElement(ConditionBuilderItem, {
|
225
229
|
label: operator,
|
@@ -263,20 +267,19 @@ var ConditionBlock = function ConditionBlock(props) {
|
|
263
267
|
"data-name": "closeCondition"
|
264
268
|
})), manageActionButtons(conditionIndex, group.conditions) && /*#__PURE__*/React__default.createElement(ConditionBuilderAdd, {
|
265
269
|
onClick: function onClick() {
|
266
|
-
addConditionHandler(conditionIndex);
|
270
|
+
addConditionHandler === null || addConditionHandler === void 0 || addConditionHandler(conditionIndex);
|
267
271
|
},
|
268
272
|
addConditionSubGroupHandler: function addConditionSubGroupHandler() {
|
269
|
-
_addConditionSubGroupHandler(conditionIndex);
|
273
|
+
_addConditionSubGroupHandler === null || _addConditionSubGroupHandler === void 0 || _addConditionSubGroupHandler(conditionIndex);
|
270
274
|
},
|
271
275
|
showConditionSubGroupPreviewHandler: showConditionSubGroupPreviewHandler,
|
272
276
|
hideConditionSubGroupPreviewHandler: hideConditionSubGroupPreviewHandler,
|
273
|
-
enableSubGroup: variant ==
|
277
|
+
enableSubGroup: variant == HIERARCHICAL_VARIANT,
|
274
278
|
showConditionPreviewHandler: showConditionPreviewHandler,
|
275
279
|
hideConditionPreviewHandler: hideConditionPreviewHandler,
|
276
280
|
className: "".concat(blockClass, "__gap ").concat(blockClass, "__gap-left")
|
277
281
|
}));
|
278
282
|
};
|
279
|
-
var ConditionBlock$1 = ConditionBlock;
|
280
283
|
ConditionBlock.propTypes = {
|
281
284
|
/**
|
282
285
|
* callback to add a new condition
|
@@ -343,4 +346,4 @@ ConditionBlock.propTypes = {
|
|
343
346
|
state: PropTypes.object
|
344
347
|
};
|
345
348
|
|
346
|
-
export { ConditionBlock
|
349
|
+
export { ConditionBlock as default };
|
@@ -1,5 +1,12 @@
|
|
1
1
|
/**
|
2
|
-
*
|
2
|
+
* Copyright IBM Corp. 2024, 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.
|
3
6
|
*/
|
4
|
-
export let ConditionBuilder: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
|
5
7
|
import React from 'react';
|
8
|
+
import { ConditionBuilderProps } from './ConditionBuilder.types';
|
9
|
+
/**
|
10
|
+
* TODO: A description of the component.
|
11
|
+
*/
|
12
|
+
export declare let ConditionBuilder: React.ForwardRefExoticComponent<ConditionBuilderProps & React.RefAttributes<HTMLDivElement>>;
|
@@ -14,8 +14,8 @@ import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
|
|
14
14
|
import ConditionBuilderContent from './ConditionBuilderContent/ConditionBuilderContent.js';
|
15
15
|
import { ConditionBuilderProvider } from './ConditionBuilderContext/ConditionBuilderProvider.js';
|
16
16
|
import { pkg } from '../../settings.js';
|
17
|
-
import { blockClass } from './ConditionBuilderContext/DataConfigs.js';
|
18
17
|
import { handleKeyDown } from './utils/handleKeyboardEvents.js';
|
18
|
+
import { blockClass, NON_HIERARCHICAL_VARIANT } from './utils/util.js';
|
19
19
|
|
20
20
|
var _excluded = ["className", "inputConfig", "startConditionLabel", "popOverSearchThreshold", "getOptions", "initialState", "getConditionState", "getActionsState", "variant", "actions", "translateWithId"];
|
21
21
|
|
@@ -54,11 +54,11 @@ var ConditionBuilder = /*#__PURE__*/React__default.forwardRef(function (_ref, re
|
|
54
54
|
getConditionState = _ref.getConditionState,
|
55
55
|
getActionsState = _ref.getActionsState,
|
56
56
|
_ref$variant = _ref.variant,
|
57
|
-
variant = _ref$variant === void 0 ?
|
57
|
+
variant = _ref$variant === void 0 ? NON_HIERARCHICAL_VARIANT : _ref$variant,
|
58
58
|
actions = _ref.actions,
|
59
59
|
translateWithId = _ref.translateWithId,
|
60
60
|
rest = _objectWithoutProperties(_ref, _excluded);
|
61
|
-
var localRef = useRef();
|
61
|
+
var localRef = useRef(null);
|
62
62
|
var conditionBuilderRef = ref || localRef;
|
63
63
|
var handleKeyDownHandler = function handleKeyDownHandler(evt) {
|
64
64
|
handleKeyDown(evt, conditionBuilderRef, variant);
|
@@ -108,6 +108,7 @@ ConditionBuilder.propTypes = {
|
|
108
108
|
/**
|
109
109
|
* optional array of actions
|
110
110
|
*/
|
111
|
+
/**@ts-ignore */
|
111
112
|
actions: PropTypes.arrayOf(PropTypes.shape({
|
112
113
|
id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
|
113
114
|
label: PropTypes.string.isRequired
|
@@ -149,13 +150,14 @@ ConditionBuilder.propTypes = {
|
|
149
150
|
* Optional prop if you want to pass a saved condition state.
|
150
151
|
* This object should respect the structure of condition state that is available in getConditionState callback
|
151
152
|
*/
|
153
|
+
/**@ts-ignore */
|
152
154
|
initialState: PropTypes.shape({
|
153
155
|
groups: PropTypes.arrayOf(PropTypes.shape({
|
154
|
-
groupOperator: PropTypes.string
|
155
|
-
statement: PropTypes.string
|
156
|
+
groupOperator: PropTypes.string,
|
157
|
+
statement: PropTypes.string,
|
156
158
|
conditions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.shape({
|
157
|
-
property: PropTypes.string
|
158
|
-
operator: PropTypes.string
|
159
|
+
property: PropTypes.string,
|
160
|
+
operator: PropTypes.string,
|
159
161
|
value: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.shape({
|
160
162
|
id: PropTypes.string,
|
161
163
|
label: PropTypes.string
|
@@ -171,6 +173,7 @@ ConditionBuilder.propTypes = {
|
|
171
173
|
* This is a mandatory prop that defines the input to the condition builder.
|
172
174
|
|
173
175
|
*/
|
176
|
+
/**@ts-ignore */
|
174
177
|
inputConfig: PropTypes.shape({
|
175
178
|
properties: PropTypes.arrayOf(PropTypes.shape({
|
176
179
|
id: PropTypes.string.isRequired,
|
@@ -205,12 +208,13 @@ ConditionBuilder.propTypes = {
|
|
205
208
|
* The message id will be one of [ "ifText","addConditionText", "addConditionGroupText", "addSubgroupText", "conditionText", "propertyText", "operatorText", "valueText", "connectorText", "conditionRowText","conditionRowGroupText","conditionBuilderText","actionSectionText", "removeConditionText", "addConditionRowText", "startText", "endText", "clearSearchText", "actionsText", "then", "removeActionText", "addActionText", "invalidText", "invalidNumberWarnText"]
|
206
209
|
]
|
207
210
|
*/
|
211
|
+
/**@ts-ignore */
|
208
212
|
translateWithId: PropTypes.func,
|
209
213
|
/* TODO: add types and DocGen for all props. */
|
210
214
|
/**
|
211
|
-
* Provide the condition builder variant:
|
215
|
+
* Provide the condition builder variant: Non-Hierarchical/ Hierarchical
|
212
216
|
*/
|
213
|
-
variant: PropTypes.oneOf(['
|
217
|
+
variant: PropTypes.oneOf(['Non-Hierarchical', 'Hierarchical'])
|
214
218
|
};
|
215
219
|
|
216
220
|
export { ConditionBuilder };
|
@@ -0,0 +1,151 @@
|
|
1
|
+
/// <reference path="../../../src/custom-typings/index.d.ts" />
|
2
|
+
/**
|
3
|
+
* Copyright IBM Corp. 2024
|
4
|
+
*
|
5
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
6
|
+
* LICENSE file in the root directory of this source tree.
|
7
|
+
*/
|
8
|
+
import { TextAreaProps, TextInputProps } from '@carbon/react';
|
9
|
+
import { CarbonIconType } from '@carbon/react/icons';
|
10
|
+
import { NumberInputProps } from '@carbon/react/lib/components/NumberInput/NumberInput';
|
11
|
+
import { Dispatch, ForwardedRef, PropsWithChildren, ReactNode, SetStateAction } from 'react';
|
12
|
+
export type LogicalOperator = 'and' | 'or';
|
13
|
+
export type StatementOperator = 'ifAll' | 'ifAny' | 'unlessAll' | 'unlessAny';
|
14
|
+
type CoreOperator = 'is';
|
15
|
+
type NumberOperator = 'greater' | 'greaterEqual' | 'lower' | 'lowerEqual';
|
16
|
+
type StringOperator = 'startsWith' | 'endsWith';
|
17
|
+
type ArrayOperator = 'contains';
|
18
|
+
type OptionOperator = 'oneOf';
|
19
|
+
type DateOperator = 'before' | 'after';
|
20
|
+
export type Operator = LogicalOperator | StatementOperator | CoreOperator | NumberOperator | StringOperator | ArrayOperator | OptionOperator | DateOperator;
|
21
|
+
export type OperatorGroups = 'logical' | 'statement' | 'core' | 'number' | 'string' | 'array' | 'option' | 'date';
|
22
|
+
export type Operators = {
|
23
|
+
logical: LogicalOperator;
|
24
|
+
statement: StatementOperator;
|
25
|
+
core: CoreOperator;
|
26
|
+
number: NumberOperator;
|
27
|
+
string: StringOperator;
|
28
|
+
array: ArrayOperator;
|
29
|
+
option: OptionOperator;
|
30
|
+
date: DateOperator;
|
31
|
+
};
|
32
|
+
export type PropertyConfigOption = {
|
33
|
+
type: 'option';
|
34
|
+
config?: {
|
35
|
+
options?: {
|
36
|
+
id: string;
|
37
|
+
label: string;
|
38
|
+
icon?: CarbonIconType;
|
39
|
+
}[];
|
40
|
+
};
|
41
|
+
};
|
42
|
+
export interface PropertyConfigText {
|
43
|
+
type: 'text';
|
44
|
+
config: TextInputProps;
|
45
|
+
}
|
46
|
+
export interface PropertyConfigTextArea {
|
47
|
+
type: 'textarea';
|
48
|
+
config: TextAreaProps;
|
49
|
+
}
|
50
|
+
export interface PropertyConfigNumber {
|
51
|
+
type: 'number';
|
52
|
+
config: {
|
53
|
+
min?: number;
|
54
|
+
max?: number;
|
55
|
+
step?: number;
|
56
|
+
unit?: string;
|
57
|
+
} & NumberInputProps;
|
58
|
+
}
|
59
|
+
export type PropertyConfigDate = {
|
60
|
+
type: 'date';
|
61
|
+
config: object;
|
62
|
+
};
|
63
|
+
export type PropertyConfigTime = {
|
64
|
+
type: 'time';
|
65
|
+
config: {
|
66
|
+
timeZones: string[];
|
67
|
+
};
|
68
|
+
};
|
69
|
+
export type PropertyConfigCustom = {
|
70
|
+
type: 'custom';
|
71
|
+
config: {
|
72
|
+
component: React.ComponentType<any>;
|
73
|
+
operators: {
|
74
|
+
label: string;
|
75
|
+
id: string;
|
76
|
+
}[];
|
77
|
+
};
|
78
|
+
};
|
79
|
+
export type PropertyConfig = {
|
80
|
+
option: PropertyConfigOption;
|
81
|
+
text: PropertyConfigText;
|
82
|
+
textarea: PropertyConfigTextArea;
|
83
|
+
number: PropertyConfigNumber;
|
84
|
+
date: PropertyConfigDate;
|
85
|
+
time: PropertyConfigTime;
|
86
|
+
custom: PropertyConfigCustom;
|
87
|
+
};
|
88
|
+
export type Property = {
|
89
|
+
id: string;
|
90
|
+
label: string;
|
91
|
+
icon?: CarbonIconType;
|
92
|
+
} & (PropertyConfig['option'] | PropertyConfig['text'] | PropertyConfig['number'] | PropertyConfig['date'] | PropertyConfig['textarea'] | PropertyConfig['time'] | PropertyConfig['custom']);
|
93
|
+
export type inputConfig = {
|
94
|
+
properties: Property[];
|
95
|
+
};
|
96
|
+
export type Option = {
|
97
|
+
id: string;
|
98
|
+
label: string;
|
99
|
+
icon?: CarbonIconType;
|
100
|
+
};
|
101
|
+
export type Condition = {
|
102
|
+
property?: string;
|
103
|
+
operator?: Operator | '' | 'INVALID';
|
104
|
+
value?: string | Option[] | Option;
|
105
|
+
id?: string | number;
|
106
|
+
popoverToOpen?: string;
|
107
|
+
};
|
108
|
+
export type ConditionGroup = {
|
109
|
+
conditions?: (ConditionGroup | Condition)[];
|
110
|
+
groupOperator?: LogicalOperator;
|
111
|
+
statement?: StatementOperator;
|
112
|
+
id: string;
|
113
|
+
};
|
114
|
+
export type ConditionBuilderState = {
|
115
|
+
groups?: ConditionGroup[];
|
116
|
+
operator?: LogicalOperator;
|
117
|
+
};
|
118
|
+
export type Action = {
|
119
|
+
id?: string | number;
|
120
|
+
label?: string;
|
121
|
+
};
|
122
|
+
export type variantsType = 'Non-Hierarchical' | 'Hierarchical';
|
123
|
+
export type ConditionBuilderProps = {
|
124
|
+
inputConfig: inputConfig;
|
125
|
+
initialState?: ConditionBuilderState;
|
126
|
+
getActionsState?: (state: Action[] | undefined) => void;
|
127
|
+
getConditionState: (state: ConditionBuilderState | undefined) => void;
|
128
|
+
getOptions?: (state: ConditionBuilderState, condition: Condition) => Promise<Option[]>;
|
129
|
+
actions?: Action[];
|
130
|
+
className?: string;
|
131
|
+
popOverSearchThreshold: number;
|
132
|
+
startConditionLabel: string;
|
133
|
+
variant?: 'Non-Hierarchical' | 'Hierarchical';
|
134
|
+
translateWithId: (id: string) => string;
|
135
|
+
};
|
136
|
+
export interface ConditionBuilderContextInputProps extends PropsWithChildren {
|
137
|
+
children?: ReactNode;
|
138
|
+
inputConfig?: inputConfig;
|
139
|
+
popOverSearchThreshold?: number;
|
140
|
+
getOptions?: (state: ConditionBuilderState, condition: Condition) => Promise<Option[]>;
|
141
|
+
variant?: string;
|
142
|
+
translateWithId?: (id: string) => string;
|
143
|
+
conditionBuilderRef?: ForwardedRef<HTMLDivElement>;
|
144
|
+
}
|
145
|
+
export type ConditionBuilderContextProps = {
|
146
|
+
rootState?: ConditionBuilderState;
|
147
|
+
setRootState?: Dispatch<SetStateAction<ConditionBuilderState>>;
|
148
|
+
actionState?: Action[];
|
149
|
+
setActionState?: Dispatch<SetStateAction<Action[]>>;
|
150
|
+
} & ConditionBuilderContextInputProps;
|
151
|
+
export {};
|
@@ -1,15 +1,29 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
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, Option } from '../ConditionBuilder.types';
|
9
|
+
interface ConditionBuilderActionsProps {
|
10
|
+
actions: Action[] | Option[];
|
11
|
+
className?: string;
|
12
|
+
}
|
13
|
+
declare const ConditionBuilderActions: {
|
14
|
+
({ actions, className, }: ConditionBuilderActionsProps): import("react/jsx-runtime").JSX.Element;
|
15
|
+
propTypes: {
|
16
|
+
/**
|
17
|
+
* optional array of object that give the list of actions.
|
18
|
+
*/
|
19
|
+
actions: PropTypes.Requireable<(PropTypes.InferProps<{
|
9
20
|
id: PropTypes.Validator<NonNullable<NonNullable<string | number | null | undefined>>>;
|
10
21
|
label: PropTypes.Validator<string>;
|
11
22
|
}> | null | undefined)[]>;
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
23
|
+
/**
|
24
|
+
* Provide an optional class to be applied to the containing node.
|
25
|
+
*/
|
26
|
+
className: PropTypes.Requireable<string>;
|
27
|
+
};
|
28
|
+
};
|
29
|
+
export default ConditionBuilderActions;
|
@@ -12,19 +12,20 @@ import cx from 'classnames';
|
|
12
12
|
import { Close } from '@carbon/react/icons';
|
13
13
|
import { Section, Heading } from '@carbon/react';
|
14
14
|
import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
|
15
|
-
import { blockClass } from '../ConditionBuilderContext/DataConfigs.js';
|
16
15
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
17
16
|
import ConditionBuilderAdd from '../ConditionBuilderAdd/ConditionBuilderAdd.js';
|
18
17
|
import uuidv4 from '../../../global/js/utils/uuidv4.js';
|
19
18
|
import { ConditionBuilderButton } from '../ConditionBuilderButton/ConditionBuilderButton.js';
|
20
19
|
import { useTranslations } from '../utils/useTranslations.js';
|
21
20
|
import { ItemOptionForValueField } from '../ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js';
|
21
|
+
import { blockClass } from '../utils/util.js';
|
22
22
|
|
23
23
|
var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
|
24
24
|
var actions = _ref.actions,
|
25
25
|
className = _ref.className;
|
26
26
|
var _useContext = useContext(ConditionBuilderContext),
|
27
|
-
|
27
|
+
_useContext$actionSta = _useContext.actionState,
|
28
|
+
actionState = _useContext$actionSta === void 0 ? [] : _useContext$actionSta,
|
28
29
|
setActionState = _useContext.setActionState;
|
29
30
|
var _useState = useState(-1),
|
30
31
|
_useState2 = _slicedToArray(_useState, 2),
|
@@ -44,7 +45,7 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
|
|
44
45
|
label: undefined,
|
45
46
|
popoverToOpen: 'valueField'
|
46
47
|
};
|
47
|
-
setActionState([].concat(_toConsumableArray(actionState), [action]));
|
48
|
+
setActionState === null || setActionState === void 0 || setActionState([].concat(_toConsumableArray(actionState), [action]));
|
48
49
|
};
|
49
50
|
var onchangeHandler = function onchangeHandler(selectedId, actionIndex) {
|
50
51
|
var action = actions.find(function (action) {
|
@@ -55,10 +56,10 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
|
|
55
56
|
var newAction = _objectSpread2(_objectSpread2({}, action), {}, {
|
56
57
|
id: actionState[actionIndex].id
|
57
58
|
});
|
58
|
-
setActionState([].concat(_toConsumableArray(actionState.slice(0, actionIndex)), [newAction], _toConsumableArray(actionState.slice(actionIndex + 1))));
|
59
|
+
setActionState === null || setActionState === void 0 || setActionState([].concat(_toConsumableArray(actionState.slice(0, actionIndex)), [newAction], _toConsumableArray(actionState.slice(actionIndex + 1))));
|
59
60
|
};
|
60
61
|
var onRemove = function onRemove(selectedId) {
|
61
|
-
setActionState(actionState.filter(function (action) {
|
62
|
+
setActionState === null || setActionState === void 0 || setActionState(actionState.filter(function (action) {
|
62
63
|
return action.id !== selectedId;
|
63
64
|
}));
|
64
65
|
};
|
@@ -136,7 +137,6 @@ var ConditionBuilderActions = function ConditionBuilderActions(_ref) {
|
|
136
137
|
tabIndex: 0
|
137
138
|
})));
|
138
139
|
};
|
139
|
-
var ConditionBuilderActions$1 = ConditionBuilderActions;
|
140
140
|
ConditionBuilderActions.propTypes = {
|
141
141
|
/**
|
142
142
|
* optional array of object that give the list of actions.
|
@@ -151,4 +151,4 @@ ConditionBuilderActions.propTypes = {
|
|
151
151
|
className: PropTypes.string
|
152
152
|
};
|
153
153
|
|
154
|
-
export { ConditionBuilderActions
|
154
|
+
export { ConditionBuilderActions as default };
|