@carbon/ibm-products 2.43.2-canary.172 → 2.43.2-canary.174
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +13 -1
- 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 +4 -0
- 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 +13 -1
- 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 +13 -1
- 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 +7 -3
- package/es/components/ConditionBuilder/ConditionBuilder.js +2 -1
- package/es/components/ConditionBuilder/ConditionBuilder.types.d.ts +2 -1
- package/es/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +3 -1
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +4 -2
- package/es/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +4 -1
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +5 -0
- package/es/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +5 -0
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +9 -3
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -2
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +3 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +11 -5
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +1 -2
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +1 -1
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +7 -4
- package/es/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +1 -1
- package/es/components/ConditionBuilder/utils/handleKeyboardEvents.js +1 -2
- 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/Datagrid/Datagrid/DatagridToolbar.js +8 -3
- package/es/components/Datagrid/types/index.d.ts +1 -0
- package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +17 -13
- package/lib/components/ConditionBuilder/ConditionBuilder.js +5 -4
- package/lib/components/ConditionBuilder/ConditionBuilder.types.d.ts +2 -1
- package/lib/components/ConditionBuilder/ConditionBuilderActions/ConditionBuilderActions.js +9 -9
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +6 -6
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.d.ts +3 -1
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +3 -3
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/ConditionConnector.js +7 -5
- package/lib/components/ConditionBuilder/ConditionBuilderConnector/GroupConnector.js +8 -5
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +11 -11
- package/lib/components/ConditionBuilder/ConditionBuilderContext/ConditionBuilderProvider.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.d.ts +5 -0
- package/lib/components/ConditionBuilder/ConditionBuilderContext/translationObject.js +5 -0
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +13 -7
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +2 -3
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts +3 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js +17 -11
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js +12 -12
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +1 -2
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +2 -2
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +20 -17
- package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js +17 -17
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +8 -9
- 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/Datagrid/Datagrid/DatagridToolbar.js +8 -3
- package/lib/components/Datagrid/types/index.d.ts +1 -0
- package/package.json +3 -3
- package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +10 -1
- package/scss/components/Datagrid/styles/_datagrid.scss +6 -0
- package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +0 -30
- package/es/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +0 -125
- package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.d.ts +0 -30
- package/lib/components/ConditionBuilder/ConditionBuilderContext/DataConfigs.js +0 -135
@@ -14,10 +14,11 @@ 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, NON_HIERARCHICAL_VARIANT } 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
22
|
// Carbon and package components we use.
|
22
23
|
/* TODO: @import(s) of carbon components and other package components. */
|
23
24
|
|
@@ -10,7 +10,7 @@ import { CarbonIconType } from '@carbon/react/icons';
|
|
10
10
|
import { NumberInputProps } from '@carbon/react/lib/components/NumberInput/NumberInput';
|
11
11
|
import { Dispatch, ForwardedRef, PropsWithChildren, ReactNode, SetStateAction } from 'react';
|
12
12
|
export type LogicalOperator = 'and' | 'or';
|
13
|
-
export type StatementOperator = '
|
13
|
+
export type StatementOperator = 'ifAll' | 'ifAny' | 'unlessAll' | 'unlessAny';
|
14
14
|
type CoreOperator = 'is';
|
15
15
|
type NumberOperator = 'greater' | 'greaterEqual' | 'lower' | 'lowerEqual';
|
16
16
|
type StringOperator = 'startsWith' | 'endsWith';
|
@@ -119,6 +119,7 @@ export type Action = {
|
|
119
119
|
id?: string | number;
|
120
120
|
label?: string;
|
121
121
|
};
|
122
|
+
export type variantsType = 'Non-Hierarchical' | 'Hierarchical';
|
122
123
|
export type ConditionBuilderProps = {
|
123
124
|
inputConfig: inputConfig;
|
124
125
|
initialState?: ConditionBuilderState;
|
@@ -12,13 +12,13 @@ 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,
|
@@ -11,8 +11,8 @@ import cx from 'classnames';
|
|
11
11
|
import { AddAlt, TextNewLine } from '@carbon/react/icons';
|
12
12
|
import { ConditionBuilderButton } from '../ConditionBuilderButton/ConditionBuilderButton.js';
|
13
13
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
14
|
-
import { blockClass } from '../ConditionBuilderContext/DataConfigs.js';
|
15
14
|
import { useTranslations } from '../utils/useTranslations.js';
|
15
|
+
import { blockClass } from '../utils/util.js';
|
16
16
|
|
17
17
|
var ConditionBuilderAdd = function ConditionBuilderAdd(_ref) {
|
18
18
|
var className = _ref.className,
|
@@ -4,14 +4,16 @@
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
6
6
|
*/
|
7
|
+
/// <reference path="../../../../src/custom-typings/index.d.ts" />
|
7
8
|
import React from 'react';
|
8
9
|
import PropTypes from 'prop-types';
|
10
|
+
import { PopoverAlignment } from '@carbon/react';
|
9
11
|
import { CarbonIconType } from '@carbon/react/icons';
|
10
12
|
interface ConditionBuilderButtonProps {
|
11
13
|
className?: string;
|
12
14
|
label: string;
|
13
15
|
hideLabel?: boolean;
|
14
|
-
tooltipAlign?:
|
16
|
+
tooltipAlign?: PopoverAlignment;
|
15
17
|
renderIcon?: CarbonIconType;
|
16
18
|
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
17
19
|
onBlur?: React.FocusEventHandler<HTMLButtonElement>;
|
@@ -10,8 +10,8 @@ import React__default from 'react';
|
|
10
10
|
import cx from 'classnames';
|
11
11
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
12
12
|
import { usePrefix, Tooltip } from '@carbon/react';
|
13
|
-
import { blockClass } from '../ConditionBuilderContext/DataConfigs.js';
|
14
13
|
import { WarningAltFilled } from '@carbon/react/icons';
|
14
|
+
import { blockClass } from '../utils/util.js';
|
15
15
|
|
16
16
|
var _WarningAltFilled;
|
17
17
|
var _excluded = ["className", "label", "hideLabel", "tooltipAlign", "renderIcon", "onClick", "showToolTip", "wrapperProps", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "isInvalid", "wrapperClassName", "tabIndex"];
|
@@ -9,11 +9,11 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
|
|
9
9
|
import React__default, { useContext, useCallback } from 'react';
|
10
10
|
import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
|
11
11
|
import { ItemOption } from '../ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js';
|
12
|
-
import { HIERARCHICAL_VARIANT, blockClass, connectorConfig } from '../ConditionBuilderContext/DataConfigs.js';
|
13
12
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
14
|
-
import { focusThisField } from '../utils/util.js';
|
13
|
+
import { HIERARCHICAL_VARIANT, blockClass, focusThisField } from '../utils/util.js';
|
15
14
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
16
15
|
import { useTranslations } from '../utils/useTranslations.js';
|
16
|
+
import { useDataConfigs } from '../utils/useDataConfigs.js';
|
17
17
|
import { ConditionBuilderButton } from '../ConditionBuilderButton/ConditionBuilderButton.js';
|
18
18
|
|
19
19
|
var _excluded = ["operator", "className", "onChange"];
|
@@ -28,6 +28,8 @@ var ConditionConnector = function ConditionConnector(_ref) {
|
|
28
28
|
var _useTranslations = useTranslations(['connectorText']),
|
29
29
|
_useTranslations2 = _slicedToArray(_useTranslations, 1),
|
30
30
|
connectorText = _useTranslations2[0];
|
31
|
+
var _useDataConfigs = useDataConfigs(),
|
32
|
+
connectorConfig = _useDataConfigs.connectorConfig;
|
31
33
|
var handleConnectorHover = useCallback(function (parentGroup, isHover) {
|
32
34
|
if (isHover) {
|
33
35
|
parentGroup.classList.add('hoveredConnector');
|
@@ -8,10 +8,11 @@
|
|
8
8
|
import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPluginBabelHelpers.js';
|
9
9
|
import React__default, { useContext } from 'react';
|
10
10
|
import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
|
11
|
-
import { blockClass, connectorConfig } from '../ConditionBuilderContext/DataConfigs.js';
|
12
11
|
import { ItemOption } from '../ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js';
|
13
12
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
14
13
|
import { useTranslations } from '../utils/useTranslations.js';
|
14
|
+
import { blockClass } from '../utils/util.js';
|
15
|
+
import { useDataConfigs } from '../utils/useDataConfigs.js';
|
15
16
|
|
16
17
|
var GroupConnector = function GroupConnector() {
|
17
18
|
var _useContext = useContext(ConditionBuilderContext),
|
@@ -20,6 +21,8 @@ var GroupConnector = function GroupConnector() {
|
|
20
21
|
var _useTranslations = useTranslations(['conditionText']),
|
21
22
|
_useTranslations2 = _slicedToArray(_useTranslations, 1),
|
22
23
|
conditionText = _useTranslations2[0];
|
24
|
+
var _useDataConfigs = useDataConfigs(),
|
25
|
+
connectorConfig = _useDataConfigs.connectorConfig;
|
23
26
|
var onStatementChangeHandler = function onStatementChangeHandler(updatedStatement) {
|
24
27
|
setRootState(_objectSpread2(_objectSpread2({}, rootState), {}, {
|
25
28
|
operator: updatedStatement
|
@@ -12,13 +12,13 @@ import { Button, Section, Heading } from '@carbon/react';
|
|
12
12
|
import { Add, TextNewLine } from '@carbon/react/icons';
|
13
13
|
import ConditionGroupBuilder from '../ConditionGroupBuilder/ConditionGroupBuilder.js';
|
14
14
|
import { ConditionBuilderContext, emptyState } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
15
|
-
import { blockClass, HIERARCHICAL_VARIANT } from '../ConditionBuilderContext/DataConfigs.js';
|
16
15
|
import { ConditionBuilderButton } from '../ConditionBuilderButton/ConditionBuilderButton.js';
|
17
16
|
import uuidv4 from '../../../global/js/utils/uuidv4.js';
|
18
17
|
import ConditionPreview from '../ConditionPreview/ConditionPreview.js';
|
19
18
|
import GroupConnector from '../ConditionBuilderConnector/GroupConnector.js';
|
20
19
|
import ConditionBuilderActions from '../ConditionBuilderActions/ConditionBuilderActions.js';
|
21
20
|
import { useTranslations } from '../utils/useTranslations.js';
|
21
|
+
import { blockClass, HIERARCHICAL_VARIANT } from '../utils/util.js';
|
22
22
|
|
23
23
|
var _GroupConnector;
|
24
24
|
var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
@@ -97,7 +97,7 @@ var ConditionBuilderContent = function ConditionBuilderContent(_ref) {
|
|
97
97
|
};
|
98
98
|
var addConditionGroupHandler = function addConditionGroupHandler() {
|
99
99
|
var newGroup = {
|
100
|
-
statement: '
|
100
|
+
statement: 'ifAll',
|
101
101
|
// 'if|exclude if',
|
102
102
|
groupOperator: 'and',
|
103
103
|
id: uuidv4(),
|
@@ -1,9 +1,14 @@
|
|
1
1
|
export namespace translationsObject {
|
2
2
|
let ifText: string;
|
3
|
+
let unlessText: string;
|
3
4
|
let excl_if: string;
|
4
5
|
let and: string;
|
5
6
|
let or: string;
|
6
7
|
let is: string;
|
8
|
+
let ifAll: string;
|
9
|
+
let ifAny: string;
|
10
|
+
let unlessAll: string;
|
11
|
+
let unlessAny: string;
|
7
12
|
let greater: string;
|
8
13
|
let greaterEqual: string;
|
9
14
|
let lower: string;
|
@@ -7,10 +7,15 @@
|
|
7
7
|
|
8
8
|
var translationsObject = {
|
9
9
|
ifText: 'if',
|
10
|
+
unlessText: 'unless',
|
10
11
|
excl_if: 'excl.if',
|
11
12
|
and: 'and',
|
12
13
|
or: 'or',
|
13
14
|
is: 'is',
|
15
|
+
ifAll: 'if all',
|
16
|
+
ifAny: 'if any',
|
17
|
+
unlessAll: 'unless all',
|
18
|
+
unlessAny: 'unless any',
|
14
19
|
greater: 'is greater than',
|
15
20
|
greaterEqual: 'is greater than or equal to',
|
16
21
|
lower: 'is lower than',
|
@@ -10,11 +10,11 @@ import React__default, { useRef, useState, useContext, useEffect } from 'react';
|
|
10
10
|
import { Popover, PopoverContent, Layer } from '@carbon/react';
|
11
11
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
12
12
|
import { Add } from '@carbon/react/icons';
|
13
|
-
import { blockClass, valueRenderers } from '../ConditionBuilderContext/DataConfigs.js';
|
14
13
|
import { ConditionBuilderButton } from '../ConditionBuilderButton/ConditionBuilderButton.js';
|
15
14
|
import { useTranslations } from '../utils/useTranslations.js';
|
16
15
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
17
16
|
import { handleKeyDownForPopover } from '../utils/handleKeyboardEvents.js';
|
17
|
+
import { blockClass, getValue } from '../utils/util.js';
|
18
18
|
|
19
19
|
var _excluded = ["children", "className", "label", "renderIcon", "title", "type", "showToolTip", "condition", "popOverClassName", "config", "renderChildren", "onChange"];
|
20
20
|
var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
|
@@ -36,7 +36,13 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
|
|
36
36
|
_useState2 = _slicedToArray(_useState, 2),
|
37
37
|
open = _useState2[0],
|
38
38
|
setOpen = _useState2[1];
|
39
|
-
var
|
39
|
+
var statementIdMap = {
|
40
|
+
ifAll: 'if',
|
41
|
+
ifAny: 'if',
|
42
|
+
unlessAll: 'unless',
|
43
|
+
unlessAny: 'unless'
|
44
|
+
};
|
45
|
+
var _useTranslations = useTranslations(['invalidText', 'addConditionText', 'addPropertyText', 'addOperatorText', 'addValueText', label], statementIdMap),
|
40
46
|
_useTranslations2 = _slicedToArray(_useTranslations, 6),
|
41
47
|
invalidText = _useTranslations2[0],
|
42
48
|
addConditionText = _useTranslations2[1],
|
@@ -56,7 +62,7 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
|
|
56
62
|
isInvalid: true
|
57
63
|
};
|
58
64
|
}
|
59
|
-
var propertyId = rest['data-name'] == 'valueField' && type ?
|
65
|
+
var propertyId = rest['data-name'] == 'valueField' && type ? getValue[type](label, config) : labelText;
|
60
66
|
return {
|
61
67
|
isInvalid: false,
|
62
68
|
propertyLabel: propertyId
|
@@ -8,11 +8,10 @@
|
|
8
8
|
import { slicedToArray as _slicedToArray } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
|
9
9
|
import React__default, { useRef } from 'react';
|
10
10
|
import { DatePicker, DatePickerInput } from '@carbon/react';
|
11
|
-
import { pkg } from '../../../../settings.js';
|
12
11
|
import PropTypes from '../../../../node_modules/prop-types/index.js';
|
13
12
|
import { useTranslations } from '../../utils/useTranslations.js';
|
13
|
+
import { blockClass } from '../../utils/util.js';
|
14
14
|
|
15
|
-
var blockClass = "".concat(pkg.prefix, "--condition-builder");
|
16
15
|
var ConditionBuilderItemDate = function ConditionBuilderItemDate(_ref) {
|
17
16
|
var conditionState = _ref.conditionState,
|
18
17
|
onChange = _ref.onChange,
|
@@ -9,8 +9,8 @@ import { slicedToArray as _slicedToArray, extends as _extends } from '../../../.
|
|
9
9
|
import React__default from 'react';
|
10
10
|
import { NumberInput } from '@carbon/react';
|
11
11
|
import PropTypes from '../../../../node_modules/prop-types/index.js';
|
12
|
-
import { blockClass } from '../../ConditionBuilderContext/DataConfigs.js';
|
13
12
|
import { useTranslations } from '../../utils/useTranslations.js';
|
13
|
+
import { blockClass } from '../../utils/util.js';
|
14
14
|
|
15
15
|
var ConditionBuilderItemNumber = function ConditionBuilderItemNumber(_ref) {
|
16
16
|
var _conditionState$prope;
|
@@ -11,7 +11,9 @@ interface ItemOptionProps {
|
|
11
11
|
label?: string;
|
12
12
|
value?: string;
|
13
13
|
};
|
14
|
-
config: PropertyConfigOption['config']
|
14
|
+
config: PropertyConfigOption['config'] & {
|
15
|
+
isStatement?: boolean;
|
16
|
+
};
|
15
17
|
onChange: (value: string, e: Event) => void;
|
16
18
|
}
|
17
19
|
export declare const ItemOption: {
|
package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js
CHANGED
@@ -11,8 +11,8 @@ import { Search } from '@carbon/react';
|
|
11
11
|
import { Checkmark } from '@carbon/react/icons';
|
12
12
|
import PropTypes from '../../../../node_modules/prop-types/index.js';
|
13
13
|
import { ConditionBuilderContext } from '../../ConditionBuilderContext/ConditionBuilderProvider.js';
|
14
|
-
import { blockClass } from '../../ConditionBuilderContext/DataConfigs.js';
|
15
14
|
import { useTranslations } from '../../utils/useTranslations.js';
|
15
|
+
import { blockClass } from '../../utils/util.js';
|
16
16
|
|
17
17
|
var ItemOption = function ItemOption(_ref) {
|
18
18
|
var _ref$conditionState = _ref.conditionState,
|
@@ -33,9 +33,10 @@ var ItemOption = function ItemOption(_ref) {
|
|
33
33
|
searchValue = _useState2[0],
|
34
34
|
setSearchValue = _useState2[1];
|
35
35
|
var selection = conditionState.value;
|
36
|
-
var filteredItems = allOptions === null || allOptions === void 0 ? void 0 : allOptions.filter(function (opt) {
|
37
|
-
|
38
|
-
|
36
|
+
var filteredItems = searchValue ? allOptions === null || allOptions === void 0 ? void 0 : allOptions.filter(function (opt) {
|
37
|
+
var _opt$label;
|
38
|
+
return (_opt$label = opt.label) === null || _opt$label === void 0 ? void 0 : _opt$label.toLowerCase().includes(searchValue.toLowerCase());
|
39
|
+
}) : allOptions;
|
39
40
|
useEffect(function () {
|
40
41
|
//this will focus the first input field in the popover
|
41
42
|
|
@@ -57,6 +58,11 @@ var ItemOption = function ItemOption(_ref) {
|
|
57
58
|
var getAriaLabel = function getAriaLabel() {
|
58
59
|
return conditionState.label ? conditionState.label : propertyText;
|
59
60
|
};
|
61
|
+
var getStatementContent = function getStatementContent(option) {
|
62
|
+
return /*#__PURE__*/React__default.createElement("div", {
|
63
|
+
className: "".concat(blockClass, "__statement_wrapper")
|
64
|
+
}, /*#__PURE__*/React__default.createElement("div", null, option.text1, " (", option.connector, ")"), /*#__PURE__*/React__default.createElement("div", null, option.text2));
|
65
|
+
};
|
60
66
|
if (!allOptions) {
|
61
67
|
return;
|
62
68
|
}
|
@@ -92,7 +98,7 @@ var ItemOption = function ItemOption(_ref) {
|
|
92
98
|
className: "".concat(blockClass, "__item-option__option-content")
|
93
99
|
}, /*#__PURE__*/React__default.createElement("span", {
|
94
100
|
className: "".concat(blockClass, "__item-option__option-label")
|
95
|
-
}, Icon && /*#__PURE__*/React__default.createElement(Icon, null), option.label), isSelected && /*#__PURE__*/React__default.createElement(Checkmark, {
|
101
|
+
}, Icon && /*#__PURE__*/React__default.createElement(Icon, null), config.isStatement ? getStatementContent(option) : option.label), isSelected && /*#__PURE__*/React__default.createElement(Checkmark, {
|
96
102
|
className: "".concat(blockClass, "__checkmark")
|
97
103
|
})));
|
98
104
|
})));
|
@@ -11,8 +11,8 @@ import { SelectSkeleton, Search, Button } from '@carbon/react';
|
|
11
11
|
import { CheckboxCheckedFilled, Checkbox, Checkmark } from '@carbon/react/icons';
|
12
12
|
import PropTypes from '../../../../node_modules/prop-types/index.js';
|
13
13
|
import { ConditionBuilderContext } from '../../ConditionBuilderContext/ConditionBuilderProvider.js';
|
14
|
-
import { blockClass } from '../../ConditionBuilderContext/DataConfigs.js';
|
15
14
|
import { useTranslations } from '../../utils/useTranslations.js';
|
15
|
+
import { blockClass } from '../../utils/util.js';
|
16
16
|
|
17
17
|
var _SelectSkeleton, _CheckboxCheckedFille, _Checkbox;
|
18
18
|
var ItemOptionForValueField = function ItemOptionForValueField(_ref) {
|
@@ -9,8 +9,7 @@ import { objectSpread2 as _objectSpread2 } from '../../../../_virtual/_rollupPlu
|
|
9
9
|
import React__default from 'react';
|
10
10
|
import { TextArea, TextInput } from '@carbon/react';
|
11
11
|
import PropTypes from '../../../../node_modules/prop-types/index.js';
|
12
|
-
import { blockClass } from '../../
|
13
|
-
import { checkIsValid } from '../../utils/util.js';
|
12
|
+
import { checkIsValid, blockClass } from '../../utils/util.js';
|
14
13
|
|
15
14
|
var ConditionBuilderItemText = function ConditionBuilderItemText(_ref) {
|
16
15
|
var _conditionState$prope;
|
@@ -9,7 +9,7 @@ import { slicedToArray as _slicedToArray } from '../../../../_virtual/_rollupPlu
|
|
9
9
|
import React__default, { useState, useEffect } from 'react';
|
10
10
|
import { TimePicker, TimePickerSelect, SelectItem } from '@carbon/react';
|
11
11
|
import PropTypes from '../../../../node_modules/prop-types/index.js';
|
12
|
-
import { blockClass } from '../../
|
12
|
+
import { blockClass } from '../../utils/util.js';
|
13
13
|
|
14
14
|
var _SelectItem, _SelectItem2;
|
15
15
|
var ConditionBuilderItemTime = function ConditionBuilderItemTime(_ref) {
|
@@ -10,15 +10,15 @@ import React__default, { useContext, useState, useRef, Fragment } from 'react';
|
|
10
10
|
import ConditionBlock from '../ConditionBlock/ConditionBlock.js';
|
11
11
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
12
12
|
import cx from 'classnames';
|
13
|
-
import { HIERARCHICAL_VARIANT, NON_HIERARCHICAL_VARIANT, blockClass, statementConfig } from '../ConditionBuilderContext/DataConfigs.js';
|
14
13
|
import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
|
15
|
-
import { focusThisField, manageTabIndexAndFocus } from '../utils/util.js';
|
14
|
+
import { HIERARCHICAL_VARIANT, NON_HIERARCHICAL_VARIANT, blockClass, focusThisField, manageTabIndexAndFocus } from '../utils/util.js';
|
16
15
|
import ConditionConnector from '../ConditionBuilderConnector/ConditionConnector.js';
|
17
16
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
18
17
|
import uuidv4 from '../../../global/js/utils/uuidv4.js';
|
19
18
|
import ConditionPreview from '../ConditionPreview/ConditionPreview.js';
|
20
19
|
import { ItemOption } from '../ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js';
|
21
20
|
import { useTranslations } from '../utils/useTranslations.js';
|
21
|
+
import { useDataConfigs } from '../utils/useDataConfigs.js';
|
22
22
|
|
23
23
|
/**
|
24
24
|
*
|
@@ -39,6 +39,8 @@ var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
|
|
39
39
|
conditionBuilderGroupText = _useTranslations2[0],
|
40
40
|
conditionText = _useTranslations2[1],
|
41
41
|
conditionBuilderText = _useTranslations2[2];
|
42
|
+
var _useDataConfigs = useDataConfigs(),
|
43
|
+
statementConfig = _useDataConfigs.statementConfig;
|
42
44
|
var _useContext = useContext(ConditionBuilderContext),
|
43
45
|
variant = _useContext.variant,
|
44
46
|
conditionBuilderRef = _useContext.conditionBuilderRef;
|
@@ -172,7 +174,7 @@ var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
|
|
172
174
|
var addConditionSubGroupHandler = function addConditionSubGroupHandler(conditionIndex) {
|
173
175
|
onChange(_objectSpread2(_objectSpread2({}, group), {}, {
|
174
176
|
conditions: [].concat(_toConsumableArray(group.conditions ? group.conditions.slice(0, conditionIndex + 1) : []), [{
|
175
|
-
statement: '
|
177
|
+
statement: 'ifAll',
|
176
178
|
groupOperator: 'and',
|
177
179
|
conditions: [{
|
178
180
|
property: undefined,
|
@@ -281,7 +283,8 @@ var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
|
|
281
283
|
onStatementChangeHandler(v);
|
282
284
|
},
|
283
285
|
config: {
|
284
|
-
options: statementConfig
|
286
|
+
options: statementConfig,
|
287
|
+
isStatement: true
|
285
288
|
}
|
286
289
|
}))), group === null || group === void 0 || (_group$conditions4 = group.conditions) === null || _group$conditions4 === void 0 ? void 0 : _group$conditions4.map(function (eachCondition, conditionIndex) {
|
287
290
|
var _group$conditions$len, _group$conditions5, _group$conditions$len2, _group$conditions6;
|
@@ -9,11 +9,11 @@ import { slicedToArray as _slicedToArray, defineProperty as _defineProperty } fr
|
|
9
9
|
import React__default, { useState, useEffect } from 'react';
|
10
10
|
import cx from 'classnames';
|
11
11
|
import PropTypes from '../../../node_modules/prop-types/index.js';
|
12
|
-
import { blockClass } from '../ConditionBuilderContext/DataConfigs.js';
|
13
12
|
import { ConditionBuilderItem } from '../ConditionBuilderItem/ConditionBuilderItem.js';
|
14
13
|
import ConditionConnector from '../ConditionBuilderConnector/ConditionConnector.js';
|
15
14
|
import { useTranslations } from '../utils/useTranslations.js';
|
16
15
|
import { Bee } from '@carbon/react/icons';
|
16
|
+
import { blockClass } from '../utils/util.js';
|
17
17
|
|
18
18
|
var ConditionPreview = function ConditionPreview(_ref) {
|
19
19
|
var _ConditionBuilderItem, _ConditionBuilderItem2, _ConditionBuilderItem3;
|
@@ -6,8 +6,7 @@
|
|
6
6
|
*/
|
7
7
|
|
8
8
|
import { toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
|
9
|
-
import { blockClass, HIERARCHICAL_VARIANT } from '
|
10
|
-
import { focusThisItem, manageTabIndexAndFocus, traverseClockVise, traverseReverse, checkForHoldingKey, focusThisField } from './util.js';
|
9
|
+
import { blockClass, HIERARCHICAL_VARIANT, focusThisItem, manageTabIndexAndFocus, traverseClockVise, traverseReverse, checkForHoldingKey, focusThisField } from './util.js';
|
11
10
|
|
12
11
|
var handleKeyDown = function handleKeyDown(evt, conditionBuilderRef, variant) {
|
13
12
|
var _activeElement$closes;
|
@@ -0,0 +1,18 @@
|
|
1
|
+
export function useDataConfigs(): {
|
2
|
+
statementConfig: {
|
3
|
+
label: string;
|
4
|
+
id: string;
|
5
|
+
connector: string;
|
6
|
+
text1: any;
|
7
|
+
text2: string;
|
8
|
+
}[];
|
9
|
+
connectorConfig: {
|
10
|
+
label: any;
|
11
|
+
id: string;
|
12
|
+
}[];
|
13
|
+
operatorConfig: {
|
14
|
+
label: any;
|
15
|
+
id: string;
|
16
|
+
type: string;
|
17
|
+
}[];
|
18
|
+
};
|
@@ -0,0 +1,120 @@
|
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2020, 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
|
+
|
8
|
+
import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
|
9
|
+
import { useTranslations } from './useTranslations.js';
|
10
|
+
|
11
|
+
var useDataConfigs = function useDataConfigs() {
|
12
|
+
var _useTranslations = useTranslations(['ifAll', 'ifAny', 'unlessAll', 'unlessAny', 'and', 'or', 'is', 'greater', 'greaterEqual', 'lower', 'lowerEqual', 'startsWith', 'endsWith', 'contains', 'oneOf', 'before', 'after', 'between']),
|
13
|
+
_useTranslations2 = _slicedToArray(_useTranslations, 18),
|
14
|
+
ifAll = _useTranslations2[0],
|
15
|
+
ifAny = _useTranslations2[1],
|
16
|
+
unlessAll = _useTranslations2[2],
|
17
|
+
unlessAny = _useTranslations2[3],
|
18
|
+
and = _useTranslations2[4],
|
19
|
+
or = _useTranslations2[5],
|
20
|
+
is = _useTranslations2[6],
|
21
|
+
greater = _useTranslations2[7],
|
22
|
+
greaterEqual = _useTranslations2[8],
|
23
|
+
lower = _useTranslations2[9],
|
24
|
+
lowerEqual = _useTranslations2[10],
|
25
|
+
startsWith = _useTranslations2[11],
|
26
|
+
endsWith = _useTranslations2[12],
|
27
|
+
contains = _useTranslations2[13],
|
28
|
+
oneOf = _useTranslations2[14],
|
29
|
+
before = _useTranslations2[15],
|
30
|
+
after = _useTranslations2[16],
|
31
|
+
between = _useTranslations2[17];
|
32
|
+
var statementConfig = [{
|
33
|
+
label: 'ifText',
|
34
|
+
id: 'ifAll',
|
35
|
+
connector: 'and',
|
36
|
+
text1: ifAll,
|
37
|
+
text2: '(a && b)'
|
38
|
+
}, {
|
39
|
+
label: 'ifText',
|
40
|
+
id: 'ifAny',
|
41
|
+
connector: 'or',
|
42
|
+
text1: ifAny,
|
43
|
+
text2: '(a || b)'
|
44
|
+
}, {
|
45
|
+
label: 'unlessText',
|
46
|
+
id: 'unlessAll',
|
47
|
+
connector: 'and',
|
48
|
+
text1: unlessAll,
|
49
|
+
text2: '! (a && b)'
|
50
|
+
}, {
|
51
|
+
label: 'unlessText',
|
52
|
+
id: 'unlessAny',
|
53
|
+
connector: 'or',
|
54
|
+
text1: unlessAny,
|
55
|
+
text2: '! (a || b)'
|
56
|
+
}];
|
57
|
+
var connectorConfig = [{
|
58
|
+
label: and,
|
59
|
+
id: 'and'
|
60
|
+
}, {
|
61
|
+
label: or,
|
62
|
+
id: 'or'
|
63
|
+
}];
|
64
|
+
var operatorConfig = [{
|
65
|
+
label: is,
|
66
|
+
id: 'is',
|
67
|
+
type: 'all'
|
68
|
+
}, {
|
69
|
+
label: greater,
|
70
|
+
id: 'greater',
|
71
|
+
type: 'number'
|
72
|
+
}, {
|
73
|
+
label: greaterEqual,
|
74
|
+
id: 'greaterEqual',
|
75
|
+
type: 'number'
|
76
|
+
}, {
|
77
|
+
label: lower,
|
78
|
+
id: 'lower',
|
79
|
+
type: 'number'
|
80
|
+
}, {
|
81
|
+
label: lowerEqual,
|
82
|
+
id: 'lowerEqual',
|
83
|
+
type: 'number'
|
84
|
+
}, {
|
85
|
+
label: startsWith,
|
86
|
+
id: 'startsWith',
|
87
|
+
type: 'text,textarea'
|
88
|
+
}, {
|
89
|
+
label: endsWith,
|
90
|
+
id: 'endsWith',
|
91
|
+
type: 'text,textarea'
|
92
|
+
}, {
|
93
|
+
label: contains,
|
94
|
+
id: 'contains',
|
95
|
+
type: 'text,textarea'
|
96
|
+
}, {
|
97
|
+
label: oneOf,
|
98
|
+
id: 'oneOf',
|
99
|
+
type: 'option'
|
100
|
+
}, {
|
101
|
+
label: before,
|
102
|
+
id: 'before',
|
103
|
+
type: 'date,time'
|
104
|
+
}, {
|
105
|
+
label: after,
|
106
|
+
id: 'after',
|
107
|
+
type: 'date,time'
|
108
|
+
}, {
|
109
|
+
label: between,
|
110
|
+
id: 'between',
|
111
|
+
type: 'date'
|
112
|
+
}];
|
113
|
+
return {
|
114
|
+
statementConfig: statementConfig,
|
115
|
+
connectorConfig: connectorConfig,
|
116
|
+
operatorConfig: operatorConfig
|
117
|
+
};
|
118
|
+
};
|
119
|
+
|
120
|
+
export { useDataConfigs };
|
@@ -1 +1 @@
|
|
1
|
-
export function useTranslations(translationKeys: any): any;
|
1
|
+
export function useTranslations(translationKeys: any, alterTranslationKeyMap: any): any;
|
@@ -9,10 +9,13 @@ import { useContext } from 'react';
|
|
9
9
|
import { ConditionBuilderContext } from '../ConditionBuilderContext/ConditionBuilderProvider.js';
|
10
10
|
import { translationsObject } from '../ConditionBuilderContext/translationObject.js';
|
11
11
|
|
12
|
-
var useTranslations = function useTranslations(translationKeys) {
|
12
|
+
var useTranslations = function useTranslations(translationKeys, alterTranslationKeyMap) {
|
13
13
|
var _useContext = useContext(ConditionBuilderContext),
|
14
14
|
translateWithId = _useContext.translateWithId;
|
15
15
|
return translationKeys.map(function (translationKey) {
|
16
|
+
if (alterTranslationKeyMap !== null && alterTranslationKeyMap !== void 0 && alterTranslationKeyMap[translationKey]) {
|
17
|
+
translationKey = alterTranslationKeyMap[translationKey];
|
18
|
+
}
|
16
19
|
if (translateWithId !== null && translateWithId !== void 0 && translateWithId(translationKey)) {
|
17
20
|
return translateWithId(translationKey);
|
18
21
|
} else if (translationsObject[translationKey]) {
|
@@ -1,3 +1,6 @@
|
|
1
|
+
export const blockClass: string;
|
2
|
+
export const NON_HIERARCHICAL_VARIANT: "Non-Hierarchical";
|
3
|
+
export const HIERARCHICAL_VARIANT: "Hierarchical";
|
1
4
|
export function focusThisField(evt: any, conditionBuilderRef: any): void;
|
2
5
|
export function focusThisItem(currentElement: any, conditionBuilderRef: any): void;
|
3
6
|
export function traverseClockVise(eachElem: any, index: any, allElements: any, rotate: any, trapFocus: any, conditionBuilderRef: any): void;
|
@@ -5,3 +8,12 @@ export function traverseReverse(eachElem: any, index: any, allElements: any, rot
|
|
5
8
|
export function checkForHoldingKey(evt: any, key: any): any;
|
6
9
|
export function checkIsValid(item: any): any;
|
7
10
|
export function manageTabIndexAndFocus(currentElement: any, conditionBuilderRef: any): void;
|
11
|
+
export namespace getValue {
|
12
|
+
function text(value: any): any;
|
13
|
+
function textarea(value: any): any;
|
14
|
+
function time(value: any): any;
|
15
|
+
function number(value: any): any;
|
16
|
+
function option(value: any): any;
|
17
|
+
function date(value: any): any;
|
18
|
+
function custom(value: any): any;
|
19
|
+
}
|