@pega/cosmos-react-condition-builder 4.0.0-dev.2.0 → 4.0.0-dev.21.0

package/lib/components/ConditionBuilder/AtomicCondition.d.ts

@@ -1,5 +1,5 @@
-import { FunctionComponent } from 'react';
-import { BaseProps, ForwardProps, FormControlProps } from '@pega/cosmos-react-core';
+import { FunctionComponent, Ref } from 'react';
+import { BaseProps, HandleValue, ForwardProps } from '@pega/cosmos-react-core';
 import { LeafCondition, Field, DateFunctionsByType } from './ConditionBuilder.types';
 import { ComparatorsByType, RHSType } from './core/types';
 /** Determines the default condition object for a given LHS value */
@@ -22,7 +22,9 @@ export interface AtomicConditionProps extends BaseProps {
     /** (Optional) Lookup used to limit the Comparators allowed in the Condition. */
     validComparators?: ComparatorsByType[];
     /** Callback for any modifications to the Condition */
-    onChange: (newCondition: LeafCondition) => void;
+    onChange?: (newCondition: LeafCondition, status?: 'error') => void;
+    /** Callback fired when the condition changes. */
+    onBlur?: (newCondition?: LeafCondition) => void;
     /** Item flow direction. Defaults to 'row' */
     itemDirection?: 'row' | 'column';
     /**
@@ -44,8 +46,10 @@ export interface AtomicConditionProps extends BaseProps {
     validRhsTypes?: Set<RHSType>;
     /** (Optional) When enabling 'DATE_FUNCTION's via `validRhsTypes`, pass this to specify which all date functions are applicable per field type */
     dateFunctions?: DateFunctionsByType;
-    /** Visually hides the label region of the RHS. */
-    rhsLabelHidden?: FormControlProps['labelHidden'];
+    /** Ref forwarded to the wrapping element. */
+    ref?: Ref<HTMLDivElement>;
+    /** Imperative handle */
+    handle?: Ref<HandleValue>;
 }
 /** A controlled component for Atomic Conditions */
 declare const AtomicCondition: FunctionComponent<AtomicConditionProps & ForwardProps>;

package/lib/components/ConditionBuilder/AtomicCondition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AtomicCondition.d.ts","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/AtomicCondition.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAe,MAAM,OAAO,CAAC;AAEvD,OAAO,EAML,SAAS,EACT,YAAY,EACZ,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAIrF,OAAO,EAAc,iBAAiB,EAAa,OAAO,EAAE,MAAM,cAAc,CAAC;AAoDjF,oEAAoE;AACpE,wBAAgB,sBAAsB,CACpC,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,MAAM,EAAE,KAAK,EAAE,EACf,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,EAC3B,gBAAgB,CAAC,EAAE,iBAAiB,EAAE,EACtC,aAAa,CAAC,EAAE,mBAAmB,GAClC,aAAa,CAcf;AAED;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,KAAK,EAAE,EACf,UAAU,GAAE,OAAe,GAC1B,OAAO,CAST;AAED,6DAA6D;AAC7D,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,wCAAwC;IACxC,SAAS,EAAE,aAAa,CAAC;IAEzB,mEAAmE;IACnE,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,+DAA+D;IAC/D,cAAc,EAAE,OAAO,CAAC;IAExB,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAEvC,sDAAsD;IACtD,QAAQ,EAAE,CAAC,YAAY,EAAE,aAAa,KAAK,IAAI,CAAC;IAEhD,6CAA6C;IAC7C,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAEjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;IAEvC;;;;;;;;;;OAUG;IACH,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAE7B,iJAAiJ;IACjJ,aAAa,CAAC,EAAE,mBAAmB,CAAC;IAEpC,kDAAkD;IAClD,cAAc,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;CAClD;AAED,mDAAmD;AACnD,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAwH3E,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"AtomicCondition.d.ts","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/AtomicCondition.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAGjB,GAAG,EAKJ,MAAM,OAAO,CAAC;AAEf,OAAO,EAML,SAAS,EACT,WAAW,EACX,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAIrF,OAAO,EAAc,iBAAiB,EAAa,OAAO,EAAE,MAAM,cAAc,CAAC;AAoDjF,oEAAoE;AACpE,wBAAgB,sBAAsB,CACpC,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,MAAM,EAAE,KAAK,EAAE,EACf,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,EAC3B,gBAAgB,CAAC,EAAE,iBAAiB,EAAE,EACtC,aAAa,CAAC,EAAE,mBAAmB,GAClC,aAAa,CAcf;AAED;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,KAAK,EAAE,EACf,UAAU,GAAE,OAAe,GAC1B,OAAO,CAST;AAED,6DAA6D;AAC7D,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,wCAAwC;IACxC,SAAS,EAAE,aAAa,CAAC;IAEzB,mEAAmE;IACnE,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,+DAA+D;IAC/D,cAAc,EAAE,OAAO,CAAC;IAExB,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAEvC,sDAAsD;IACtD,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,aAAa,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAEnE,iDAAiD;IACjD,MAAM,CAAC,EAAE,CAAC,YAAY,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IAEhD,6CAA6C;IAC7C,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAEjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;IAEvC;;;;;;;;;;OAUG;IACH,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAE7B,iJAAiJ;IACjJ,aAAa,CAAC,EAAE,mBAAmB,CAAC;IAEpC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;AAED,mDAAmD;AACnD,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,GAAG,YAAY,CAiL3E,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/components/ConditionBuilder/AtomicCondition.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Grid, Select, Option, useI18n, hasProp } from '@pega/cosmos-react-core';
+import { forwardRef, useRef, useState, useImperativeHandle } from 'react';
+import { Grid, Select, Option, useI18n, hasProp, useConsolidatedRef, useFocusWithin, useAfterInitialEffect } from '@pega/cosmos-react-core';
 import { getItem } from './core/utils';
 import FieldSelector from './RhsControls/FieldSelector';
 import RhsControls, { getDefaultRhs, isValidRhs } from './RhsControls';
@@ -81,17 +82,41 @@ export function isValidCondition(condition, fields, trimValues = false) {
     return isValidRhs(condition.rhs, condition.lhs, fields, fieldType, trimValues);
 }
 /** A controlled component for Atomic Conditions */
-const AtomicCondition = ({ condition, fields, indicateErrors, validComparators, onChange, itemDirection, lhsMode = 'input', validRhsTypes = new Set(['LITERAL', 'FIELD']), dateFunctions, rhsLabelHidden, ...restProps }) => {
+const AtomicCondition = forwardRef(({ condition, fields, indicateErrors, validComparators, onChange, onBlur, itemDirection, lhsMode = 'input', validRhsTypes = new Set(['LITERAL', 'FIELD']), dateFunctions, handle, ...restProps }, ref) => {
     const t = useI18n();
+    // stores condition form state
+    const [state, setState] = useState(condition);
+    // ref needed to handle use case of onChange and onBlur being triggered at the same time
+    // state is not updated by the time blur is invoked, ref is always set to newest value
+    const newCondition = useRef(condition);
     const fieldType = getFieldType(condition.lhs.field, fields); // Can be `undefined` if no match or if no previous field
     const comparatorOptions = fieldType
         ? getComparatorOptions(fieldType, validComparators)
         : [{ id: '', label: t('condition_builder_select_placeholder') }];
+    useAfterInitialEffect(() => {
+        setState(condition);
+    }, [condition]);
+    const onFocusChange = (focused) => {
+        if (!focused) {
+            // newCondition is returned, as it stores newest value
+            onBlur?.(newCondition.current && isValidCondition(newCondition.current, fields, true)
+                ? newCondition.current
+                : undefined);
+        }
+    };
+    const containerRef = useConsolidatedRef(ref);
+    useFocusWithin([containerRef], onFocusChange);
+    // Handle condition update
+    const handleConditionChange = (updatedCondition, status) => {
+        newCondition.current = updatedCondition;
+        // new condition is returned with status to allow recognizing errors and avoiding clearing wrong values from input
+        onChange?.(updatedCondition, status);
+    };
     // Handle change in the field-selector
     const handleFieldChange = (id) => {
         const lhs = { field: id };
-        const newCondition = getInitConditionForLhs(lhs, fields, validRhsTypes, validComparators, dateFunctions); // Determine comparator and rhs for the new lhs
-        onChange(newCondition); // Submit the new condition
+        const initCondition = getInitConditionForLhs(lhs, fields, validRhsTypes, validComparators, dateFunctions); // Determine comparator and rhs for the new lhs
+        handleConditionChange(initCondition);
     };
     // Handle change in the comparator
     const handleComparatorChange = (e) => {
@@ -100,30 +125,40 @@ const AtomicCondition = ({ condition, fields, indicateErrors, validComparators,
         }
         const comparator = e.target.value;
         const rhs = isRhsValidForComparator(condition.rhs, comparator)
-            ? condition.rhs
+            ? { ...condition.rhs } // Duplicating rhs to avoid using source object as it can be mutated later.
             : getDefaultRhs(fieldType, comparator, validRhsTypes, dateFunctions);
-        onChange({ ...condition, comparator, rhs }); // Submit the new condition
+        handleConditionChange({ ...condition, comparator, rhs });
     };
     // Handle change in the RHS
-    const handleRHSChange = (rhs) => {
-        onChange({ ...condition, rhs }); // Submit the new condition
+    const handleRHSChange = (rhs, status) => {
+        handleConditionChange({ ...condition, rhs }, status);
+    };
+    const rhsHandle = useRef(null);
+    const clear = () => {
+        rhsHandle.current?.clear();
+        if (newCondition.current) {
+            handleConditionChange(getInitConditionForLhs(state.lhs, fields, validRhsTypes, validComparators, dateFunctions));
+        }
     };
+    useImperativeHandle(handle, () => ({
+        clear
+    }), [clear]);
     const lhsLabel = getFieldLabel(condition.lhs.field, fields);
     return (
     // Using minmax() to get equal widths: https://stackoverflow.com/a/61240964/4247448
-    _jsx(StyledAtomicCondition, { ...restProps, name: lhsMode === 'label' ? lhsLabel : undefined, "aria-label": lhsLabel, children: _jsxs(Grid, { sm: {
+    _jsx(StyledAtomicCondition, { ...restProps, name: lhsMode === 'label' ? lhsLabel : undefined, "aria-label": lhsMode === 'hidden' ? lhsLabel : undefined, children: _jsxs(Grid, { sm: {
                 container: {
                     cols: itemDirection === 'column'
-                        ? '1fr'
+                        ? 'minmax(0, 1fr)'
                         : `repeat(${lhsMode !== 'input' ? 2 : 3}, minmax(0,1fr))`
                 }
             }, container: {
                 justifyItems: 'stretch',
                 colGap: 0.5,
                 rowGap: 0.5
-            }, children: [lhsMode === 'input' && (_jsx(FieldSelector, { value: condition.lhs.field, onChange: handleFieldChange, fields: fields, status: indicateErrors && condition.lhs.field === '' ? 'error' : undefined, info: indicateErrors && condition.lhs.field === ''
+            }, ref: containerRef, children: [lhsMode === 'input' && (_jsx(FieldSelector, { value: state.lhs.field, onChange: handleFieldChange, fields: fields, status: indicateErrors && state.lhs.field === '' ? 'error' : undefined, info: indicateErrors && state.lhs.field === ''
                         ? t('condition_builder_condition_select_info_default')
-                        : undefined })), _jsx(Select, { value: condition.comparator, onChange: handleComparatorChange, name: 'comparator', label: t('condition_builder_comparator_label'), labelHidden: true, children: comparatorOptions.map(option => (_jsx(Option, { value: option.id, children: option.label }, option.id))) }), _jsx(RhsControls, { lhs: condition.lhs, comparator: condition.comparator, rhs: condition.rhs, fields: fields, onChange: handleRHSChange, indicateErrors: indicateErrors, validRhsTypes: validRhsTypes, dateFunctions: dateFunctions, itemDirection: itemDirection || 'row', labelHidden: rhsLabelHidden })] }) }));
-};
+                        : undefined })), _jsx(Select, { value: state.comparator, onChange: handleComparatorChange, name: 'comparator', label: t('condition_builder_comparator_label'), children: comparatorOptions.map(option => (_jsx(Option, { value: option.id, children: option.label }, option.id))) }), _jsx(RhsControls, { lhs: state.lhs, comparator: state.comparator, rhs: state.rhs, fields: fields, onChange: handleRHSChange, indicateErrors: indicateErrors, validRhsTypes: validRhsTypes, dateFunctions: dateFunctions, itemDirection: itemDirection || 'row', handle: rhsHandle })] }) }));
+});
 export default AtomicCondition;
 //# sourceMappingURL=AtomicCondition.js.map

package/lib/components/ConditionBuilder/AtomicCondition.js.map

@@ -1 +1 @@
-{"version":3,"file":"AtomicCondition.js","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/AtomicCondition.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, ChangeEvent } from 'react';\n\nimport {\n  Grid,\n  Select,\n  Option,\n  useI18n,\n  hasProp,\n  BaseProps,\n  ForwardProps,\n  FormControlProps\n} from '@pega/cosmos-react-core';\n\nimport { getItem } from './core/utils';\nimport { LeafCondition, Field, DateFunctionsByType } from './ConditionBuilder.types';\nimport FieldSelector from './RhsControls/FieldSelector';\nimport RhsControls, { getDefaultRhs, isValidRhs } from './RhsControls';\nimport getComparatorOptions from './core/comparators';\nimport { Comparator, ComparatorsByType, FieldType, RHSType } from './core/types';\nimport { StyledAtomicCondition } from './ConditionBuilder.styles';\n\n// Returns field-type for a given field-name\nfunction getFieldType(fieldName: string, fields: Field[]): FieldType | undefined {\n  const matchingField = getItem(fields, fieldName);\n  return matchingField && hasProp(matchingField, 'type') ? matchingField.type : undefined;\n}\n\n// Returns display label for a given field-name\nfunction getFieldLabel(fieldName: string, fields: Field[]): string | undefined {\n  const matchingField = getItem(fields, fieldName);\n  return matchingField?.primary;\n}\n\n/**\n * Upon changing the comparator, checks if the old RHS is valid for the new comparator\n * NOTE: This works under the assumption that the LHS doesn't change\n */\nfunction isRhsValidForComparator(rhs: LeafCondition['rhs'], comparator: Comparator): boolean {\n  if (rhs === undefined) {\n    return ['IS_NULL', 'IS_NOT_NULL', 'IS_TRUE', 'IS_FALSE'].includes(comparator);\n  }\n  if (hasProp(rhs, 'values')) {\n    return ['IN', 'NOT_IN'].includes(comparator);\n  }\n\n  if (hasProp(rhs, 'parameterId')) {\n    return ['EQ', 'NEQ'].includes(comparator);\n  }\n\n  if (hasProp(rhs, 'start')) {\n    return ['BTW', 'NOT_BTW'].includes(comparator);\n  }\n\n  // `rhs.field` and `rhs.value` cases\n  return [\n    'EQ',\n    'NEQ',\n    'GT',\n    'GTE',\n    'LT',\n    'LTE',\n    'STARTS_WITH',\n    'NOT_STARTS_WITH',\n    'ENDS_WITH',\n    'NOT_ENDS_WITH',\n    'CONTAINS',\n    'NOT_CONTAINS'\n  ].includes(comparator);\n}\n\n/** Determines the default condition object for a given LHS value */\nexport function getInitConditionForLhs(\n  lhs: LeafCondition['lhs'],\n  fields: Field[],\n  validRhsTypes: Set<RHSType>,\n  validComparators?: ComparatorsByType[],\n  dateFunctions?: DateFunctionsByType\n): LeafCondition {\n  let comparator: Comparator;\n  let rhs: LeafCondition['rhs'];\n  if (lhs.field === '') {\n    // If the empty option is selected, reset the comparator and rhs to their default values\n    comparator = 'IS_NOT_NULL';\n    rhs = undefined;\n  } else {\n    const newFieldType = getFieldType(lhs.field, fields) as FieldType;\n    comparator = getComparatorOptions(newFieldType, validComparators)[0].id; // Find the applicable comparators and select the first among them\n    rhs = getDefaultRhs(newFieldType, comparator, validRhsTypes, dateFunctions);\n  }\n\n  return { lhs, comparator, rhs };\n}\n\n/**\n * Verifies if all the values in the condition are valid.\n * NOTES:\n * - This is intended to be used only on conditions emitted by the components in this package.\n * - If a condition is manually constructed outside these components, this utility could miss some malformed conditions.\n */\nexport function isValidCondition(\n  condition: LeafCondition,\n  fields: Field[],\n  trimValues: boolean = false\n): boolean {\n  // If no field is yet selected on the LHS\n  if (condition.lhs.field === '') {\n    return false;\n  }\n  // If a field is present on the LHS, check if the RHS is valid\n  // No need to check the comparator since the comparator is always assigned a valid value\n  const fieldType = getFieldType(condition.lhs.field, fields);\n  return isValidRhs(condition.rhs, condition.lhs, fields, fieldType, trimValues);\n}\n\n/** Type definition for the input props of AtomicCondition */\nexport interface AtomicConditionProps extends BaseProps {\n  /** Condition to use in the component */\n  condition: LeafCondition;\n\n  /** Metadata (data-model) for the Fields to use in the Condition */\n  fields: Field[];\n\n  /** Used to enable inline error indicators on invalid inputs */\n  indicateErrors: boolean;\n\n  /** (Optional) Lookup used to limit the Comparators allowed in the Condition. */\n  validComparators?: ComparatorsByType[];\n\n  /** Callback for any modifications to the Condition */\n  onChange: (newCondition: LeafCondition) => void;\n\n  /** Item flow direction. Defaults to 'row' */\n  itemDirection?: 'row' | 'column';\n\n  /**\n   * Allows presenting the LHS as a readonly text, input or hidden. Defaults presenting as 'input'.\n   * NOTE: Make sure that a valid LHS is passed in the 'condition'\n   */\n  lhsMode?: 'input' | 'label' | 'hidden';\n\n  /** Restricts RHS values to only specified types of values.\n   * DEFAULT: Set(['LITERAL', 'FIELD']).\n   * WARNING: There are LHS/Comparator pairings that require specific RHS types. Please be mindful of\n   *          these incompatibilities when limiting RHS value types using this prop. We do not support\n   *          limiting RHS field types to incompatible types and it will result in a validation error\n   *          if you do so. The pairings referred to here are as follows:\n   *              - BOOLEAN LHS Fields coupled with \"EQ\" or \"NEQ\" comparators, will always yield a Field RHS\n   *              - Any LHS Fields coupled with \"IN\" or \"NOT_IN\" comparators, will always yield a Literal RHS (Comma separated list)\n   *          If you would like to limit RHS value types and avoid these incompatibilities, you will need to exclude these\n   *          comparators using the validComparators prop.\n   */\n  validRhsTypes?: Set<RHSType>;\n\n  /** (Optional) When enabling 'DATE_FUNCTION's via `validRhsTypes`, pass this to specify which all date functions are applicable per field type */\n  dateFunctions?: DateFunctionsByType;\n\n  /** Visually hides the label region of the RHS. */\n  rhsLabelHidden?: FormControlProps['labelHidden'];\n}\n\n/** A controlled component for Atomic Conditions */\nconst AtomicCondition: FunctionComponent<AtomicConditionProps & ForwardProps> = ({\n  condition,\n  fields,\n  indicateErrors,\n  validComparators,\n  onChange,\n  itemDirection,\n  lhsMode = 'input',\n  validRhsTypes = new Set<RHSType>(['LITERAL', 'FIELD']),\n  dateFunctions,\n  rhsLabelHidden,\n  ...restProps\n}: AtomicConditionProps) => {\n  const t = useI18n();\n\n  const fieldType = getFieldType(condition.lhs.field, fields); // Can be `undefined` if no match or if no previous field\n  const comparatorOptions = fieldType\n    ? getComparatorOptions(fieldType, validComparators)\n    : [{ id: '', label: t('condition_builder_select_placeholder') }];\n\n  // Handle change in the field-selector\n  const handleFieldChange = (id: string) => {\n    const lhs = { field: id };\n    const newCondition = getInitConditionForLhs(\n      lhs,\n      fields,\n      validRhsTypes,\n      validComparators,\n      dateFunctions\n    ); // Determine comparator and rhs for the new lhs\n    onChange(newCondition); // Submit the new condition\n  };\n\n  // Handle change in the comparator\n  const handleComparatorChange = (e: ChangeEvent<HTMLSelectElement>) => {\n    if (e.target.value === '') {\n      return; // The option is shown only when an lhs is not yet selected. Ignore this selection for those cases\n    }\n    const comparator = e.target.value as Comparator;\n    const rhs = isRhsValidForComparator(condition.rhs, comparator)\n      ? condition.rhs\n      : getDefaultRhs(fieldType as FieldType, comparator, validRhsTypes, dateFunctions);\n    onChange({ ...condition, comparator, rhs }); // Submit the new condition\n  };\n\n  // Handle change in the RHS\n  const handleRHSChange = (rhs: LeafCondition['rhs']) => {\n    onChange({ ...condition, rhs }); // Submit the new condition\n  };\n\n  const lhsLabel = getFieldLabel(condition.lhs.field, fields);\n\n  return (\n    // Using minmax() to get equal widths: https://stackoverflow.com/a/61240964/4247448\n    <StyledAtomicCondition\n      {...restProps}\n      name={lhsMode === 'label' ? lhsLabel : undefined}\n      aria-label={lhsLabel}\n    >\n      <Grid\n        sm={{\n          container: {\n            cols:\n              itemDirection === 'column'\n                ? '1fr'\n                : `repeat(${lhsMode !== 'input' ? 2 : 3}, minmax(0,1fr))`\n          }\n        }}\n        container={{\n          justifyItems: 'stretch',\n          colGap: 0.5,\n          rowGap: 0.5\n        }}\n      >\n        {/* LHS selector */}\n        {lhsMode === 'input' && (\n          <FieldSelector\n            value={condition.lhs.field}\n            onChange={handleFieldChange}\n            fields={fields}\n            status={indicateErrors && condition.lhs.field === '' ? 'error' : undefined}\n            info={\n              indicateErrors && condition.lhs.field === ''\n                ? t('condition_builder_condition_select_info_default')\n                : undefined\n            }\n          />\n        )}\n\n        {/* Comparator selector */}\n        <Select\n          value={condition.comparator}\n          onChange={handleComparatorChange}\n          name='comparator'\n          label={t('condition_builder_comparator_label')}\n          labelHidden\n        >\n          {comparatorOptions.map(option => (\n            <Option key={option.id} value={option.id}>\n              {option.label}\n            </Option>\n          ))}\n        </Select>\n\n        {/* RHS controls */}\n        <RhsControls\n          lhs={condition.lhs}\n          comparator={condition.comparator}\n          rhs={condition.rhs}\n          fields={fields}\n          onChange={handleRHSChange}\n          indicateErrors={indicateErrors}\n          validRhsTypes={validRhsTypes}\n          dateFunctions={dateFunctions}\n          itemDirection={itemDirection || 'row'}\n          labelHidden={rhsLabelHidden}\n        />\n      </Grid>\n    </StyledAtomicCondition>\n  );\n};\n\nexport default AtomicCondition;\n"]}
+{"version":3,"file":"AtomicCondition.js","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/AtomicCondition.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  ChangeEvent,\n  forwardRef,\n  Ref,\n  useRef,\n  useState,\n  PropsWithoutRef,\n  useImperativeHandle\n} from 'react';\n\nimport {\n  Grid,\n  Select,\n  Option,\n  useI18n,\n  hasProp,\n  BaseProps,\n  HandleValue,\n  ForwardProps,\n  useConsolidatedRef,\n  useFocusWithin,\n  useAfterInitialEffect\n} from '@pega/cosmos-react-core';\n\nimport { getItem } from './core/utils';\nimport { LeafCondition, Field, DateFunctionsByType } from './ConditionBuilder.types';\nimport FieldSelector from './RhsControls/FieldSelector';\nimport RhsControls, { getDefaultRhs, isValidRhs } from './RhsControls';\nimport getComparatorOptions from './core/comparators';\nimport { Comparator, ComparatorsByType, FieldType, RHSType } from './core/types';\nimport { StyledAtomicCondition } from './ConditionBuilder.styles';\n\n// Returns field-type for a given field-name\nfunction getFieldType(fieldName: string, fields: Field[]): FieldType | undefined {\n  const matchingField = getItem(fields, fieldName);\n  return matchingField && hasProp(matchingField, 'type') ? matchingField.type : undefined;\n}\n\n// Returns display label for a given field-name\nfunction getFieldLabel(fieldName: string, fields: Field[]): string | undefined {\n  const matchingField = getItem(fields, fieldName);\n  return matchingField?.primary;\n}\n\n/**\n * Upon changing the comparator, checks if the old RHS is valid for the new comparator\n * NOTE: This works under the assumption that the LHS doesn't change\n */\nfunction isRhsValidForComparator(rhs: LeafCondition['rhs'], comparator: Comparator): boolean {\n  if (rhs === undefined) {\n    return ['IS_NULL', 'IS_NOT_NULL', 'IS_TRUE', 'IS_FALSE'].includes(comparator);\n  }\n  if (hasProp(rhs, 'values')) {\n    return ['IN', 'NOT_IN'].includes(comparator);\n  }\n\n  if (hasProp(rhs, 'parameterId')) {\n    return ['EQ', 'NEQ'].includes(comparator);\n  }\n\n  if (hasProp(rhs, 'start')) {\n    return ['BTW', 'NOT_BTW'].includes(comparator);\n  }\n\n  // `rhs.field` and `rhs.value` cases\n  return [\n    'EQ',\n    'NEQ',\n    'GT',\n    'GTE',\n    'LT',\n    'LTE',\n    'STARTS_WITH',\n    'NOT_STARTS_WITH',\n    'ENDS_WITH',\n    'NOT_ENDS_WITH',\n    'CONTAINS',\n    'NOT_CONTAINS'\n  ].includes(comparator);\n}\n\n/** Determines the default condition object for a given LHS value */\nexport function getInitConditionForLhs(\n  lhs: LeafCondition['lhs'],\n  fields: Field[],\n  validRhsTypes: Set<RHSType>,\n  validComparators?: ComparatorsByType[],\n  dateFunctions?: DateFunctionsByType\n): LeafCondition {\n  let comparator: Comparator;\n  let rhs: LeafCondition['rhs'];\n  if (lhs.field === '') {\n    // If the empty option is selected, reset the comparator and rhs to their default values\n    comparator = 'IS_NOT_NULL';\n    rhs = undefined;\n  } else {\n    const newFieldType = getFieldType(lhs.field, fields) as FieldType;\n    comparator = getComparatorOptions(newFieldType, validComparators)[0].id; // Find the applicable comparators and select the first among them\n    rhs = getDefaultRhs(newFieldType, comparator, validRhsTypes, dateFunctions);\n  }\n\n  return { lhs, comparator, rhs };\n}\n\n/**\n * Verifies if all the values in the condition are valid.\n * NOTES:\n * - This is intended to be used only on conditions emitted by the components in this package.\n * - If a condition is manually constructed outside these components, this utility could miss some malformed conditions.\n */\nexport function isValidCondition(\n  condition: LeafCondition,\n  fields: Field[],\n  trimValues: boolean = false\n): boolean {\n  // If no field is yet selected on the LHS\n  if (condition.lhs.field === '') {\n    return false;\n  }\n  // If a field is present on the LHS, check if the RHS is valid\n  // No need to check the comparator since the comparator is always assigned a valid value\n  const fieldType = getFieldType(condition.lhs.field, fields);\n  return isValidRhs(condition.rhs, condition.lhs, fields, fieldType, trimValues);\n}\n\n/** Type definition for the input props of AtomicCondition */\nexport interface AtomicConditionProps extends BaseProps {\n  /** Condition to use in the component */\n  condition: LeafCondition;\n\n  /** Metadata (data-model) for the Fields to use in the Condition */\n  fields: Field[];\n\n  /** Used to enable inline error indicators on invalid inputs */\n  indicateErrors: boolean;\n\n  /** (Optional) Lookup used to limit the Comparators allowed in the Condition. */\n  validComparators?: ComparatorsByType[];\n\n  /** Callback for any modifications to the Condition */\n  onChange?: (newCondition: LeafCondition, status?: 'error') => void;\n\n  /** Callback fired when the condition changes. */\n  onBlur?: (newCondition?: LeafCondition) => void;\n\n  /** Item flow direction. Defaults to 'row' */\n  itemDirection?: 'row' | 'column';\n\n  /**\n   * Allows presenting the LHS as a readonly text, input or hidden. Defaults presenting as 'input'.\n   * NOTE: Make sure that a valid LHS is passed in the 'condition'\n   */\n  lhsMode?: 'input' | 'label' | 'hidden';\n\n  /** Restricts RHS values to only specified types of values.\n   * DEFAULT: Set(['LITERAL', 'FIELD']).\n   * WARNING: There are LHS/Comparator pairings that require specific RHS types. Please be mindful of\n   *          these incompatibilities when limiting RHS value types using this prop. We do not support\n   *          limiting RHS field types to incompatible types and it will result in a validation error\n   *          if you do so. The pairings referred to here are as follows:\n   *              - BOOLEAN LHS Fields coupled with \"EQ\" or \"NEQ\" comparators, will always yield a Field RHS\n   *              - Any LHS Fields coupled with \"IN\" or \"NOT_IN\" comparators, will always yield a Literal RHS (Comma separated list)\n   *          If you would like to limit RHS value types and avoid these incompatibilities, you will need to exclude these\n   *          comparators using the validComparators prop.\n   */\n  validRhsTypes?: Set<RHSType>;\n\n  /** (Optional) When enabling 'DATE_FUNCTION's via `validRhsTypes`, pass this to specify which all date functions are applicable per field type */\n  dateFunctions?: DateFunctionsByType;\n\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n  /** Imperative handle */\n  handle?: Ref<HandleValue>;\n}\n\n/** A controlled component for Atomic Conditions */\nconst AtomicCondition: FunctionComponent<AtomicConditionProps & ForwardProps> = forwardRef(\n  (\n    {\n      condition,\n      fields,\n      indicateErrors,\n      validComparators,\n      onChange,\n      onBlur,\n      itemDirection,\n      lhsMode = 'input',\n      validRhsTypes = new Set<RHSType>(['LITERAL', 'FIELD']),\n      dateFunctions,\n      handle,\n      ...restProps\n    }: PropsWithoutRef<AtomicConditionProps>,\n    ref: AtomicConditionProps['ref']\n  ) => {\n    const t = useI18n();\n\n    // stores condition form state\n    const [state, setState] = useState<LeafCondition>(condition);\n    // ref needed to handle use case of onChange and onBlur being triggered at the same time\n    // state is not updated by the time blur is invoked, ref is always set to newest value\n    const newCondition = useRef(condition);\n\n    const fieldType = getFieldType(condition.lhs.field, fields); // Can be `undefined` if no match or if no previous field\n    const comparatorOptions = fieldType\n      ? getComparatorOptions(fieldType, validComparators)\n      : [{ id: '', label: t('condition_builder_select_placeholder') }];\n\n    useAfterInitialEffect(() => {\n      setState(condition);\n    }, [condition]);\n\n    const onFocusChange = (focused: boolean) => {\n      if (!focused) {\n        // newCondition is returned, as it stores newest value\n        onBlur?.(\n          newCondition.current && isValidCondition(newCondition.current, fields, true)\n            ? newCondition.current\n            : undefined\n        );\n      }\n    };\n\n    const containerRef = useConsolidatedRef(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    // Handle condition update\n    const handleConditionChange = (updatedCondition: LeafCondition, status?: 'error') => {\n      newCondition.current = updatedCondition;\n      // new condition is returned with status to allow recognizing errors and avoiding clearing wrong values from input\n      onChange?.(updatedCondition, status);\n    };\n\n    // Handle change in the field-selector\n    const handleFieldChange = (id: string) => {\n      const lhs = { field: id };\n      const initCondition = getInitConditionForLhs(\n        lhs,\n        fields,\n        validRhsTypes,\n        validComparators,\n        dateFunctions\n      ); // Determine comparator and rhs for the new lhs\n      handleConditionChange(initCondition);\n    };\n\n    // Handle change in the comparator\n    const handleComparatorChange = (e: ChangeEvent<HTMLSelectElement>) => {\n      if (e.target.value === '') {\n        return; // The option is shown only when an lhs is not yet selected. Ignore this selection for those cases\n      }\n      const comparator = e.target.value as Comparator;\n      const rhs = isRhsValidForComparator(condition.rhs, comparator)\n        ? ({ ...condition.rhs } as LeafCondition['rhs']) // Duplicating rhs to avoid using source object as it can be mutated later.\n        : getDefaultRhs(fieldType as FieldType, comparator, validRhsTypes, dateFunctions);\n\n      handleConditionChange({ ...condition, comparator, rhs });\n    };\n\n    // Handle change in the RHS\n    const handleRHSChange = (rhs: LeafCondition['rhs'], status?: 'error') => {\n      handleConditionChange({ ...condition, rhs }, status);\n    };\n\n    const rhsHandle = useRef<HandleValue>(null);\n\n    const clear = () => {\n      rhsHandle.current?.clear();\n      if (newCondition.current) {\n        handleConditionChange(\n          getInitConditionForLhs(state.lhs, fields, validRhsTypes, validComparators, dateFunctions)\n        );\n      }\n    };\n\n    useImperativeHandle(\n      handle,\n      () => ({\n        clear\n      }),\n      [clear]\n    );\n\n    const lhsLabel = getFieldLabel(condition.lhs.field, fields);\n\n    return (\n      // Using minmax() to get equal widths: https://stackoverflow.com/a/61240964/4247448\n      <StyledAtomicCondition\n        {...restProps}\n        name={lhsMode === 'label' ? lhsLabel : undefined}\n        aria-label={lhsMode === 'hidden' ? lhsLabel : undefined}\n      >\n        <Grid\n          sm={{\n            container: {\n              cols:\n                itemDirection === 'column'\n                  ? 'minmax(0, 1fr)'\n                  : `repeat(${lhsMode !== 'input' ? 2 : 3}, minmax(0,1fr))`\n            }\n          }}\n          container={{\n            justifyItems: 'stretch',\n            colGap: 0.5,\n            rowGap: 0.5\n          }}\n          ref={containerRef}\n        >\n          {/* LHS selector */}\n          {lhsMode === 'input' && (\n            <FieldSelector\n              value={state.lhs.field}\n              onChange={handleFieldChange}\n              fields={fields}\n              status={indicateErrors && state.lhs.field === '' ? 'error' : undefined}\n              info={\n                indicateErrors && state.lhs.field === ''\n                  ? t('condition_builder_condition_select_info_default')\n                  : undefined\n              }\n            />\n          )}\n\n          {/* Comparator selector */}\n          <Select\n            value={state.comparator}\n            onChange={handleComparatorChange}\n            name='comparator'\n            label={t('condition_builder_comparator_label')}\n          >\n            {comparatorOptions.map(option => (\n              <Option key={option.id} value={option.id}>\n                {option.label}\n              </Option>\n            ))}\n          </Select>\n\n          {/* RHS controls */}\n          <RhsControls\n            lhs={state.lhs}\n            comparator={state.comparator}\n            rhs={state.rhs}\n            fields={fields}\n            onChange={handleRHSChange}\n            indicateErrors={indicateErrors}\n            validRhsTypes={validRhsTypes}\n            dateFunctions={dateFunctions}\n            itemDirection={itemDirection || 'row'}\n            handle={rhsHandle}\n          />\n        </Grid>\n      </StyledAtomicCondition>\n    );\n  }\n);\n\nexport default AtomicCondition;\n"]}

package/lib/components/ConditionBuilder/ConditionBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionBuilder.d.ts","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/ConditionBuilder.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAOL,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAIjC,OAAO,qBAIN,MAAM,0BAA0B,CAAC;AAwBlC,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA+U7E,CAAC;AAGF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"ConditionBuilder.d.ts","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/ConditionBuilder.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAOL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,qBAIN,MAAM,0BAA0B,CAAC;AA6BlC,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA6Z7E,CAAC;AAGF,eAAe,gBAAgB,CAAC"}

package/lib/components/ConditionBuilder/ConditionBuilder.js

@@ -1,11 +1,10 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Fragment, useState, useReducer, useImperativeHandle } from 'react';
-import { Banner, Button, Flex, Icon, Input, MenuButton, createUID, hasProp, useI18n } from '@pega/cosmos-react-core';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment, useState, useReducer, useImperativeHandle, useRef, useEffect } from 'react';
+import { Banner, Button, Flex, Icon, Input, MenuButton, hasProp, useI18n, getFocusables, Label, useUID, useLiveLog, AdditionalInfo } from '@pega/cosmos-react-core';
 import AtomicCondition, { isValidCondition } from './AtomicCondition';
-import HelpButton from './HelpButton';
 import { splitConditionForBuilder, parseLogicString, disambiguateLogic, isBasicModeApplicable, getBasicModeOperators, getLogicFromBasicMode } from './core/utils';
 import rowsReducer, { INSERT_ROW, UPDATE_ROW, REMOVE_ROW } from './core/rows-reducer';
-import { StyledRowWithSeparator, StyledRow, StyledLabel } from './ConditionBuilder.styles';
+import { StyledRowWithSeparator, StyledRow, StyledLabel, StyledConditionBuilder } from './ConditionBuilder.styles';
 // Default props for the builder
 const defaultProps = {
     condition: {
@@ -30,6 +29,12 @@ const ConditionBuilder = (props) => {
     const [showModeWarning, setModeWarning] = useState(false); // Used to warn user about losing information when moving away from Advanced mode
     const [showErrorIndicators, setErrorIndicators] = useState(false); // Used to enable inline error indicators in the condition rows
     const enableShading = isBasicMode && operatorsList.includes('AND') && operatorsList.includes('OR'); // In Basic mode, enable shading to indicate grouping only when both operators are present
+    const labelId = useUID();
+    const newOperatorButtonRef = useRef(null);
+    const focusRowRef = useRef(null);
+    const [focusRowIndex, setFocusRowIndex] = useState(null);
+    const bannerHandleRef = useRef(null);
+    const buttonRef = useRef(null);
     // Upon adding/removing rows in Advanced mode, update the logic string to reflect the change in labels
     // NOTE: The input is updated only if the previous logicString was simple enough
     const updateLogicString = (actionType) => {
@@ -54,6 +59,19 @@ const ConditionBuilder = (props) => {
                 .join(` ${splitter} `));
         }
     };
+    // Manages the focus behavior when inserting/removing a row
+    useEffect(() => {
+        if (focusRowIndex === null)
+            return;
+        if (newOperatorButtonRef.current) {
+            newOperatorButtonRef.current.focus();
+            newOperatorButtonRef.current = null;
+        }
+        else if (focusRowIndex !== null) {
+            getFocusables(focusRowRef)[0]?.focus();
+        }
+        setFocusRowIndex(null);
+    }, [focusRowIndex]);
     // Insert a new row at the given index
     const insertRow = (insertAt) => {
         dispatch({ type: INSERT_ROW, payload: { insertAt } }); // Insert an entry in conditionRows
@@ -69,6 +87,7 @@ const ConditionBuilder = (props) => {
         else {
             updateLogicString(INSERT_ROW); // Update the logicString input to reflect the insertion
         }
+        setFocusRowIndex(insertAt);
     };
     // Remove the row at the given index
     const removeRow = (removeAt) => {
@@ -94,6 +113,12 @@ const ConditionBuilder = (props) => {
         else {
             updateLogicString(REMOVE_ROW); // Update the logicString input to reflect the removal
         }
+        setFocusRowIndex(() => {
+            if (removeAt !== 0 && removeAt === conditionRows.length - 1) {
+                return removeAt - 1;
+            }
+            return removeAt;
+        });
     };
     // Update a Basic-mode operator at the given index
     const updateOperator = (updateAt, newValue) => {
@@ -183,23 +208,61 @@ const ConditionBuilder = (props) => {
         getCondition
     }), [getCondition]);
     const t = useI18n();
-    return (_jsxs(Flex, { container: { direction: 'column', gap: 4 }, children: [_jsx("div", { children: conditionRows.map(({ id, label, ...leaf }, index) => (_jsxs(Fragment, { children: [isBasicMode && index > 0 && (_jsx(StyledRowWithSeparator, { container: true, shaded: enableShading && operatorsList[index - 1] === 'AND', children: _jsx(MenuButton, { text: operatorsList[index - 1].toLowerCase(), variant: 'simple', menu: {
-                                    items: [
-                                        {
-                                            id: 'AND',
-                                            primary: 'and',
-                                            onClick: () => updateOperator(index - 1, 'AND')
-                                        },
-                                        {
-                                            id: 'OR',
-                                            primary: 'or',
-                                            onClick: () => updateOperator(index - 1, 'OR')
-                                        }
-                                    ]
-                                } }) })), _jsxs(StyledRow, { container: { gap: 0.5, alignItems: 'start' }, shaded: isBasicMode && enableShading, children: [!isBasicMode && _jsx(StyledLabel, { children: label }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(AtomicCondition, { condition: leaf, fields: fields, indicateErrors: showErrorIndicators, validComparators: validComparators, dateFunctions: dateFunctions, onChange: (newCondition) => {
-                                            const newRow = { id, label, ...newCondition };
-                                            dispatch({ type: UPDATE_ROW, payload: { updateAt: index, newRow } });
-                                        }, validRhsTypes: validRhsTypes }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => insertRow(index + 1), "aria-label": t('condition_builder_add_button_label'), children: _jsx(Icon, { name: 'plus' }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => removeRow(index), "aria-label": t('condition_builder_remove_button_label'), children: _jsx(Icon, { name: 'trash' }) })] })] }, id))) }), !isBasicMode && (_jsx("div", { children: _jsx(Input, { type: 'text', placeholder: t('condition_builder_advanced_condition_placeholder'), label: _jsxs(_Fragment, { children: [t('condition_builder_advanced_condition_label'), "\u00A0", _jsx(HelpButton, { children: `A logical expression representing an advanced condition.\nUse numbers like 1,2,3,… to represent different condition rows.\nUse ${disallowNOT ? 'AND/OR' : 'AND/OR/NOT'} operators and parentheses to construct advanced conditions.\n\nExample: ${disallowNOT ? '(1 OR 2) AND (3 OR 4 OR 5)' : '(1 AND 2) OR (3 AND NOT 4)'}` })] }), value: logicString, onChange: (e) => setLogicString(e.target.value), onBlur: () => validateLogicString(logicString), status: logicError !== null ? 'error' : undefined, info: logicError }) })), _jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [showModeWarning && (_jsx(Banner, { id: createUID(), variant: 'warning', messages: [t('condition_builder_switch_banner_text')], action: _jsx(Button, { name: 'force-mode-switch', variant: 'secondary', onClick: () => toggleMode(true), children: t('condition_builder_confirm_button_label') }), onDismiss: () => setModeWarning(false) })), _jsx(Flex, { container: { justify: 'between' }, children: _jsx(Button, { name: 'mode-switch', variant: 'simple', onClick: () => toggleMode(false), children: isBasicMode
+    useEffect(() => {
+        if (showModeWarning)
+            bannerHandleRef.current?.focus();
+    }, [showModeWarning]);
+    const { announceAssertive } = useLiveLog();
+    useEffect(() => {
+        announceAssertive({ message: t('condition_builder_mode_switch') });
+    }, [isBasicMode]);
+    return (_jsxs(StyledConditionBuilder, { container: { direction: 'column', gap: 4 }, children: [_jsx("div", { children: conditionRows.map(({ id, label, ...leaf }, index) => {
+                    const deleteAriaLabel = `${t('condition_builder_field_label')} ${leaf.lhs.field
+                        .split('.')
+                        .pop()}`;
+                    let alignItems = 'end';
+                    if (showErrorIndicators && !isValidCondition(leaf, fields, false)) {
+                        alignItems = 'center';
+                    }
+                    return (_jsxs(Fragment, { children: [isBasicMode && index > 0 && (_jsx(StyledRowWithSeparator, { container: true, shaded: enableShading && operatorsList[index - 1] === 'AND', children: _jsx(MenuButton, { popover: { hideOnTargetHidden: false }, text: operatorsList[index - 1].toLowerCase(), variant: 'simple', menu: {
+                                        items: [
+                                            {
+                                                id: 'AND',
+                                                primary: 'and',
+                                                onClick: () => updateOperator(index - 1, 'AND')
+                                            },
+                                            {
+                                                id: 'OR',
+                                                primary: 'or',
+                                                onClick: () => updateOperator(index - 1, 'OR')
+                                            }
+                                        ]
+                                    }, ref: index === focusRowIndex ? newOperatorButtonRef : null }) })), _jsxs(StyledRow, { container: { gap: 0.5, alignItems }, shaded: isBasicMode && enableShading, ref: index === focusRowIndex ? focusRowRef : null, children: [!isBasicMode && _jsx(StyledLabel, { children: label }), _jsx(Flex, { item: { grow: 1 }, children: _jsx(AtomicCondition, { condition: leaf, fields: fields, indicateErrors: showErrorIndicators, validComparators: validComparators, dateFunctions: dateFunctions, onChange: (newCondition) => {
+                                                const newRow = { id, label, ...newCondition };
+                                                dispatch({ type: UPDATE_ROW, payload: { updateAt: index, newRow } });
+                                            }, validRhsTypes: validRhsTypes }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => insertRow(index + 1), label: t('add_condition'), children: _jsx(Icon, { name: 'plus' }) }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => removeRow(index), label: t('delete'), "aria-label": deleteAriaLabel ? t('delete_noun', [deleteAriaLabel]) : undefined, children: _jsx(Icon, { name: 'trash' }) })] })] }, id));
+                }) }), !isBasicMode && (_jsx("div", { children: _jsxs(Flex, { container: { gap: 0.25, direction: 'column' }, children: [_jsxs(Flex, { container: { alignItems: 'center' }, children: [_jsxs(Label, { htmlFor: labelId, children: [t('condition_builder_advanced_condition_label'), "\u00A0"] }), _jsx(AdditionalInfo, { heading: t('condition_builder_advanced_condition_label'), children: t('condition_builder_advanced_condition_tooltip', [
+                                        disallowNOT ? 'AND/OR' : 'AND/OR/NOT',
+                                        disallowNOT ? '(1 OR 2) AND (3 OR 4 OR 5)' : '(1 AND 2) OR (3 AND NOT 4)'
+                                    ]) })] }), _jsx(Input, { id: labelId, type: 'text', placeholder: t('condition_builder_advanced_condition_placeholder'), value: logicString, onChange: (e) => setLogicString(e.target.value), onBlur: () => validateLogicString(logicString), status: logicError !== null ? 'error' : undefined, info: logicError })] }) })), _jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [showModeWarning && (_jsx(Banner, { variant: 'warning', messages: [
+                            {
+                                label: t('condition_builder_switch_banner_text'),
+                                action: {
+                                    text: t('condition_builder_confirm_button_label'),
+                                    onClick: () => {
+                                        toggleMode(true);
+                                        buttonRef.current?.focus();
+                                    }
+                                }
+                            }
+                        ], onDismiss: () => {
+                            setModeWarning(false);
+                            buttonRef.current?.focus();
+                        }, handle: bannerHandleRef })), _jsx(Flex, { container: { justify: 'between' }, children: _jsx(Button, { name: 'mode-switch', variant: 'simple', onClick: () => {
+                                toggleMode(false);
+                            }, "aria-label": isBasicMode
+                                ? t('condition_builder_advanced_mode_button_aria_label')
+                                : t('condition_builder_basic_mode_button_aria_label'), ref: buttonRef, children: isBasicMode
                                 ? t('condition_builder_advanced_mode_button_label')
                                 : t('condition_builder_basic_mode_button_label') }) })] })] }));
 };

package/lib/components/ConditionBuilder/ConditionBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionBuilder.js","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/ConditionBuilder.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  Fragment,\n  ChangeEvent,\n  useState,\n  useReducer,\n  useImperativeHandle\n} from 'react';\n\nimport {\n  Banner,\n  Button,\n  Flex,\n  Icon,\n  Input,\n  MenuButton,\n  ForwardProps,\n  createUID,\n  hasProp,\n  useI18n\n} from '@pega/cosmos-react-core';\n\nimport AtomicCondition, { isValidCondition } from './AtomicCondition';\nimport HelpButton from './HelpButton';\nimport ConditionBuilderProps, {\n  Condition,\n  HandleValue,\n  LeafCondition\n} from './ConditionBuilder.types';\nimport {\n  splitConditionForBuilder,\n  parseLogicString,\n  disambiguateLogic,\n  isBasicModeApplicable,\n  getBasicModeOperators,\n  getLogicFromBasicMode\n} from './core/utils';\nimport rowsReducer, { INSERT_ROW, UPDATE_ROW, REMOVE_ROW } from './core/rows-reducer';\nimport { RHSType } from './core/types';\nimport { StyledRowWithSeparator, StyledRow, StyledLabel } from './ConditionBuilder.styles';\n\n// Default props for the builder\nconst defaultProps: Partial<ConditionBuilderProps> = {\n  condition: {\n    condition: {\n      comparator: 'IS_NOT_NULL',\n      lhs: { field: '' }\n    }\n  }\n};\n\n// Component for the builder\nconst ConditionBuilder: FunctionComponent<ConditionBuilderProps & ForwardProps> = (\n  props: ConditionBuilderProps\n) => {\n  const {\n    fields,\n    condition: seedCondition,\n    validComparators,\n    validRhsTypes = new Set<RHSType>(['LITERAL', 'FIELD']),\n    dateFunctions,\n    disallowNOT,\n    handle\n  } = props;\n\n  // Split the condition tree into a logic-string and a list of condition-rows.\n  const clonedCondition: Condition = JSON.parse(JSON.stringify(seedCondition)); // Cloning to avoid modifying the original\n  const { logic: seedLogic, rows: seedRows } = splitConditionForBuilder(clonedCondition);\n\n  // On load, look to use the Basic-mode if the seed-condition is simple enough\n  const [isBasicMode, setBasicMode] = useState(() => isBasicModeApplicable(clonedCondition));\n  const [operatorsList, setOperatorsList] = useState(() => getBasicModeOperators(seedLogic)); // Operators-list used in Basic-mode to render dropdowns between the rows. NOTE: When in Advanced-mode, this can contain stale values.\n  const [logicString, setLogicString] = useState(seedLogic); // Logic-string used in Advanced-mode. NOTE: When in Basic-mode, this can contain stale values.\n  const [conditionRows, dispatch] = useReducer(rowsReducer, seedRows); // Conditions-rows\n  const [logicError, setLogicError] = useState<string | null>(null); // Used to indicate errors in the logic string\n  const [showModeWarning, setModeWarning] = useState(false); // Used to warn user about losing information when moving away from Advanced mode\n  const [showErrorIndicators, setErrorIndicators] = useState(false); // Used to enable inline error indicators in the condition rows\n  const enableShading =\n    isBasicMode && operatorsList.includes('AND') && operatorsList.includes('OR'); // In Basic mode, enable shading to indicate grouping only when both operators are present\n\n  // Upon adding/removing rows in Advanced mode, update the logic string to reflect the change in labels\n  // NOTE: The input is updated only if the previous logicString was simple enough\n  const updateLogicString = (actionType: string): void => {\n    const numNewRows =\n      actionType === INSERT_ROW ? conditionRows.length + 1 : conditionRows.length - 1;\n\n    // If only one row left after the action, simply use its label as logicString\n    // NOTE: If none left, the rowsReducer adds a new empty row\n    if (numNewRows <= 1) {\n      setLogicString('1');\n      return;\n    }\n\n    // If the previous string was a simple AND/OR between all the rows, update the logicString to follow the same for the new list of rows.\n    // If the previous string was a single token like `1` and a new row is inserted, do an AND between the new rows, i.e. `1 AND 2`\n    // For all other complex cases, skip automatically updating the string and wait for the user to change it\n    // To check this, split the previous string by `OR/AND` and check if each of the resultant token is a simple numeric token\n    const splitter = logicString.includes('OR') ? 'OR' : 'AND';\n    const tokens = logicString.split(splitter);\n    const isEveryTokenInteger = tokens.every(w => /^\\d+$/.test(w.trim()));\n    if (isEveryTokenInteger) {\n      setLogicString(\n        new Array(numNewRows)\n          .fill(0)\n          .map((w, i) => i + 1)\n          .join(` ${splitter} `)\n      );\n    }\n  };\n\n  // Insert a new row at the given index\n  const insertRow = (insertAt: number): void => {\n    dispatch({ type: INSERT_ROW, payload: { insertAt } }); // Insert an entry in conditionRows\n    if (isBasicMode) {\n      // Set up a new AND/OR selector\n      const insertOpAt = insertAt - 1; // Using `insertAt-1` since the operatorsList has one less entry compared to the conditionRows\n      setOperatorsList([\n        ...operatorsList.slice(0, insertOpAt),\n        'AND',\n        ...operatorsList.slice(insertOpAt)\n      ]);\n    } else {\n      updateLogicString(INSERT_ROW); // Update the logicString input to reflect the insertion\n    }\n  };\n\n  // Remove the row at the given index\n  const removeRow = (removeAt: number): void => {\n    dispatch({ type: REMOVE_ROW, payload: { removeAt } }); // Remove an entry in conditionRows\n    if (isBasicMode) {\n      // Remove an AND/OR selector\n      if (removeAt === 0) {\n        // If removing the first of the condition rows, remove the extraneous operator\n        setOperatorsList(operatorsList.slice(1));\n      } else {\n        let removeOpAt = removeAt - 1; // Using `removeAt-1` since the operatorsList has one less entry compared to the conditionRows\n        if (operatorsList[removeOpAt] === 'OR' && operatorsList[removeOpAt + 1] === 'AND') {\n          // If removing a condition at the start of a nested group, remove the first operator from that group. e.g. Take `(1 AND 2) OR (3 AND 4 AND 5)`. If `3` is being deleted, it should become `(1 AND 2) OR (4 AND 5)` instead of `1 AND 2 AND 4 AND 5`\n          removeOpAt += 1;\n        }\n        setOperatorsList([\n          ...operatorsList.slice(0, removeOpAt),\n          ...operatorsList.slice(removeOpAt + 1)\n        ]);\n      }\n    } else {\n      updateLogicString(REMOVE_ROW); // Update the logicString input to reflect the removal\n    }\n  };\n\n  // Update a Basic-mode operator at the given index\n  const updateOperator = (updateAt: number, newValue: 'AND' | 'OR'): void => {\n    setOperatorsList([\n      ...operatorsList.slice(0, updateAt),\n      newValue,\n      ...operatorsList.slice(updateAt + 1)\n    ]);\n  };\n\n  // Validate the logic input. Called upon clicking outside the textBox or upon submission.\n  // If the expression is invalid, shows appropriate feedback and returns null.\n  // If the expression is valid, formats it by setting up brackets at necessary places (to clear any ambiguities e.g. `1 AND 2 OR 3` is formatted as `(1 AND 2) OR 3` ). Returns a save-ready condition\n  const validateLogicString = (logicToUse: string): Condition | null => {\n    // Set up a lookup with row-labels as keys and rows as values\n    const conditionLookup: { [label: string]: LeafCondition } = {};\n    conditionRows.forEach(row => {\n      const { id, label, ...leaf } = row; // Discard the extra properties added by ConditionRow to the LeafCondition interface\n      conditionLookup[row.label] = leaf;\n    });\n\n    // Convert the logic string into a condition tree\n    const parseResult = parseLogicString(logicToUse, conditionLookup, disallowNOT);\n\n    // Indicate any parse error\n    if (hasProp(parseResult, 'error')) {\n      setLogicError(parseResult.error);\n      return null;\n    }\n\n    // If no errors\n    setLogicError(null); // Clear any previous error\n    setLogicString(disambiguateLogic(logicToUse)); // Disambiguating the logic string by placing parentheses at appropriate places\n    return parseResult.condition;\n  };\n\n  // Toggle between the Basic and Advanced modes\n  // `forceToggle:true` is passed when switching from Advanced to Basic mode despite a loss of information\n  const toggleMode = (forceToggle?: boolean): void => {\n    setModeWarning(false); // Clear any previous warning\n    if (isBasicMode) {\n      // Update the logicString to match the operatorsList before switching the mode\n      setLogicString(getLogicFromBasicMode(operatorsList));\n      setBasicMode(false);\n    } else if (forceToggle) {\n      // If forcibly toggling from Advanced to Basic despite a loss of operators\n      // Set up the default `AND` operator between all rows before switching to Basic mode\n      setOperatorsList(new Array(conditionRows.length - 1).fill('AND'));\n      setBasicMode(true);\n    } else {\n      // If switching from Advanced mode\n      const condition = validateLogicString(logicString); // Validate the logicString. If it is an invalid, an appropriate error is shown for the user to act on\n      if (condition !== null) {\n        // If it's a valid condition, check if it's simple enough to be shown in Basic mode without any loss of information\n        if (isBasicModeApplicable(condition)) {\n          // If the logic is simple enough, identify the new set of operators before switching to Basic mode\n          setOperatorsList(getBasicModeOperators(logicString));\n          setBasicMode(true);\n        } else {\n          // If the logic is too complex show a warning for the user to act on\n          setModeWarning(true);\n        }\n      }\n    }\n  };\n\n  const getCondition: HandleValue['getCondition'] = () => {\n    setErrorIndicators(false); // Reset any previous flag\n    setLogicError(null); // Clear any previous error\n\n    // If there's a single empty condition, submit with an `undefined` value (useful for clearing a previous condition)\n    if (conditionRows.length === 1 && conditionRows[0].lhs.field === '') {\n      return [true, undefined];\n    }\n\n    // Identify and indicate any invalid values in the condition rows\n    const hasInvalidRows = conditionRows.some(row => !isValidCondition(row, fields, true));\n    if (hasInvalidRows) {\n      setErrorIndicators(true); // Enable inline error indications\n      return [false];\n    }\n\n    // Validate the Logic string\n    const logicToUse = isBasicMode ? getLogicFromBasicMode(operatorsList) : logicString; // If in Basic-mode, construct a different logicString based on the operatorsList\n    const condition = validateLogicString(logicToUse); // This also takes care of showing an appropriate error feedback as needed\n    if (condition !== null) {\n      // Can be null when the logic string has errors\n      return [true, condition];\n    }\n\n    return [false];\n  };\n\n  useImperativeHandle(\n    handle,\n    () => ({\n      getCondition\n    }),\n    [getCondition]\n  );\n\n  const t = useI18n();\n\n  return (\n    <Flex container={{ direction: 'column', gap: 4 }}>\n      {/* Condition Rows */}\n      <div>\n        {conditionRows.map(({ id, label, ...leaf }, index) => (\n          <Fragment key={id}>\n            {/* Row with the operator dropdown in Basic mode */}\n            {isBasicMode && index > 0 && (\n              <StyledRowWithSeparator\n                container\n                shaded={enableShading && operatorsList[index - 1] === 'AND'}\n              >\n                <MenuButton\n                  text={operatorsList[index - 1].toLowerCase()}\n                  variant='simple'\n                  menu={{\n                    items: [\n                      {\n                        id: 'AND',\n                        primary: 'and',\n                        onClick: () => updateOperator(index - 1, 'AND')\n                      },\n                      {\n                        id: 'OR',\n                        primary: 'or',\n                        onClick: () => updateOperator(index - 1, 'OR')\n                      }\n                    ]\n                  }}\n                />\n              </StyledRowWithSeparator>\n            )}\n\n            {/* Row with the AtomicCondition */}\n            <StyledRow\n              container={{ gap: 0.5, alignItems: 'start' }}\n              shaded={isBasicMode && enableShading}\n            >\n              {/* Label */}\n              {!isBasicMode && <StyledLabel>{label}</StyledLabel>}\n\n              {/* Condition controls */}\n              <Flex item={{ grow: 1 }}>\n                <AtomicCondition\n                  condition={leaf}\n                  fields={fields}\n                  indicateErrors={showErrorIndicators}\n                  validComparators={validComparators}\n                  dateFunctions={dateFunctions}\n                  onChange={(newCondition: LeafCondition) => {\n                    const newRow = { id, label, ...newCondition };\n                    dispatch({ type: UPDATE_ROW, payload: { updateAt: index, newRow } });\n                  }}\n                  validRhsTypes={validRhsTypes}\n                />\n              </Flex>\n\n              {/* Row actions */}\n              <Button\n                icon\n                variant='simple'\n                onClick={() => insertRow(index + 1)}\n                aria-label={t('condition_builder_add_button_label')}\n              >\n                <Icon name='plus' />\n              </Button>\n              <Button\n                icon\n                variant='simple'\n                onClick={() => removeRow(index)}\n                aria-label={t('condition_builder_remove_button_label')}\n              >\n                <Icon name='trash' />\n              </Button>\n            </StyledRow>\n          </Fragment>\n        ))}\n      </div>\n\n      {/* LogicString input */}\n      {!isBasicMode && (\n        <div>\n          <Input\n            type='text'\n            placeholder={t('condition_builder_advanced_condition_placeholder')}\n            label={\n              <>\n                {t('condition_builder_advanced_condition_label')}&nbsp;\n                {/* FIXME: TR */}\n                <HelpButton>\n                  {`A logical expression representing an advanced condition.\\nUse numbers like 1,2,3,… to represent different condition rows.\\nUse ${\n                    disallowNOT ? 'AND/OR' : 'AND/OR/NOT'\n                  } operators and parentheses to construct advanced conditions.\\n\\nExample: ${\n                    disallowNOT ? '(1 OR 2) AND (3 OR 4 OR 5)' : '(1 AND 2) OR (3 AND NOT 4)'\n                  }`}\n                </HelpButton>\n              </>\n            }\n            value={logicString}\n            onChange={(e: ChangeEvent<HTMLInputElement>) => setLogicString(e.target.value)}\n            onBlur={() => validateLogicString(logicString)}\n            status={logicError !== null ? 'error' : undefined}\n            info={logicError}\n          />\n        </div>\n      )}\n\n      {/* Submit block */}\n      <Flex container={{ direction: 'column', gap: 2 }}>\n        {/* Banner to show a warning when switching from Advanced to Basic mode */}\n        {showModeWarning && (\n          <Banner\n            id={createUID()}\n            variant='warning'\n            messages={[t('condition_builder_switch_banner_text')]}\n            action={\n              <Button name='force-mode-switch' variant='secondary' onClick={() => toggleMode(true)}>\n                {t('condition_builder_confirm_button_label')}\n              </Button>\n            }\n            onDismiss={() => setModeWarning(false)}\n          />\n        )}\n\n        {/* Footer buttons */}\n        <Flex container={{ justify: 'between' }}>\n          <Button name='mode-switch' variant='simple' onClick={() => toggleMode(false)}>\n            {isBasicMode\n              ? t('condition_builder_advanced_mode_button_label')\n              : t('condition_builder_basic_mode_button_label')}\n          </Button>\n        </Flex>\n      </Flex>\n    </Flex>\n  );\n};\nConditionBuilder.defaultProps = defaultProps;\n\nexport default ConditionBuilder;\n"]}
+{"version":3,"file":"ConditionBuilder.js","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/ConditionBuilder.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FunctionComponent,\n  Fragment,\n  ChangeEvent,\n  useState,\n  useReducer,\n  useImperativeHandle,\n  useRef,\n  useEffect\n} from 'react';\n\nimport {\n  Banner,\n  Button,\n  Flex,\n  Icon,\n  Input,\n  MenuButton,\n  ForwardProps,\n  hasProp,\n  useI18n,\n  getFocusables,\n  BannerHandleValue,\n  Label,\n  useUID,\n  useLiveLog,\n  AdditionalInfo\n} from '@pega/cosmos-react-core';\n\nimport AtomicCondition, { isValidCondition } from './AtomicCondition';\nimport ConditionBuilderProps, {\n  Condition,\n  HandleValue,\n  LeafCondition\n} from './ConditionBuilder.types';\nimport {\n  splitConditionForBuilder,\n  parseLogicString,\n  disambiguateLogic,\n  isBasicModeApplicable,\n  getBasicModeOperators,\n  getLogicFromBasicMode\n} from './core/utils';\nimport rowsReducer, { INSERT_ROW, UPDATE_ROW, REMOVE_ROW } from './core/rows-reducer';\nimport { RHSType } from './core/types';\nimport {\n  StyledRowWithSeparator,\n  StyledRow,\n  StyledLabel,\n  StyledConditionBuilder\n} from './ConditionBuilder.styles';\n\n// Default props for the builder\nconst defaultProps: Partial<ConditionBuilderProps> = {\n  condition: {\n    condition: {\n      comparator: 'IS_NOT_NULL',\n      lhs: { field: '' }\n    }\n  }\n};\n\n// Component for the builder\nconst ConditionBuilder: FunctionComponent<ConditionBuilderProps & ForwardProps> = (\n  props: ConditionBuilderProps\n) => {\n  const {\n    fields,\n    condition: seedCondition,\n    validComparators,\n    validRhsTypes = new Set<RHSType>(['LITERAL', 'FIELD']),\n    dateFunctions,\n    disallowNOT,\n    handle\n  } = props;\n\n  // Split the condition tree into a logic-string and a list of condition-rows.\n  const clonedCondition: Condition = JSON.parse(JSON.stringify(seedCondition)); // Cloning to avoid modifying the original\n  const { logic: seedLogic, rows: seedRows } = splitConditionForBuilder(clonedCondition);\n\n  // On load, look to use the Basic-mode if the seed-condition is simple enough\n  const [isBasicMode, setBasicMode] = useState(() => isBasicModeApplicable(clonedCondition));\n  const [operatorsList, setOperatorsList] = useState(() => getBasicModeOperators(seedLogic)); // Operators-list used in Basic-mode to render dropdowns between the rows. NOTE: When in Advanced-mode, this can contain stale values.\n  const [logicString, setLogicString] = useState(seedLogic); // Logic-string used in Advanced-mode. NOTE: When in Basic-mode, this can contain stale values.\n  const [conditionRows, dispatch] = useReducer(rowsReducer, seedRows); // Conditions-rows\n  const [logicError, setLogicError] = useState<string | null>(null); // Used to indicate errors in the logic string\n  const [showModeWarning, setModeWarning] = useState(false); // Used to warn user about losing information when moving away from Advanced mode\n  const [showErrorIndicators, setErrorIndicators] = useState(false); // Used to enable inline error indicators in the condition rows\n  const enableShading =\n    isBasicMode && operatorsList.includes('AND') && operatorsList.includes('OR'); // In Basic mode, enable shading to indicate grouping only when both operators are present\n  const labelId = useUID();\n\n  const newOperatorButtonRef = useRef<HTMLButtonElement | null>(null);\n  const focusRowRef = useRef<HTMLElement | null>(null);\n  const [focusRowIndex, setFocusRowIndex] = useState<number | null>(null);\n  const bannerHandleRef = useRef<BannerHandleValue>(null);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n\n  // Upon adding/removing rows in Advanced mode, update the logic string to reflect the change in labels\n  // NOTE: The input is updated only if the previous logicString was simple enough\n  const updateLogicString = (actionType: string): void => {\n    const numNewRows =\n      actionType === INSERT_ROW ? conditionRows.length + 1 : conditionRows.length - 1;\n\n    // If only one row left after the action, simply use its label as logicString\n    // NOTE: If none left, the rowsReducer adds a new empty row\n    if (numNewRows <= 1) {\n      setLogicString('1');\n      return;\n    }\n\n    // If the previous string was a simple AND/OR between all the rows, update the logicString to follow the same for the new list of rows.\n    // If the previous string was a single token like `1` and a new row is inserted, do an AND between the new rows, i.e. `1 AND 2`\n    // For all other complex cases, skip automatically updating the string and wait for the user to change it\n    // To check this, split the previous string by `OR/AND` and check if each of the resultant token is a simple numeric token\n    const splitter = logicString.includes('OR') ? 'OR' : 'AND';\n    const tokens = logicString.split(splitter);\n    const isEveryTokenInteger = tokens.every(w => /^\\d+$/.test(w.trim()));\n    if (isEveryTokenInteger) {\n      setLogicString(\n        new Array(numNewRows)\n          .fill(0)\n          .map((w, i) => i + 1)\n          .join(` ${splitter} `)\n      );\n    }\n  };\n\n  // Manages the focus behavior when inserting/removing a row\n  useEffect(() => {\n    if (focusRowIndex === null) return;\n\n    if (newOperatorButtonRef.current) {\n      newOperatorButtonRef.current.focus();\n      newOperatorButtonRef.current = null;\n    } else if (focusRowIndex !== null) {\n      getFocusables(focusRowRef)[0]?.focus();\n    }\n\n    setFocusRowIndex(null);\n  }, [focusRowIndex]);\n\n  // Insert a new row at the given index\n  const insertRow = (insertAt: number): void => {\n    dispatch({ type: INSERT_ROW, payload: { insertAt } }); // Insert an entry in conditionRows\n    if (isBasicMode) {\n      // Set up a new AND/OR selector\n      const insertOpAt = insertAt - 1; // Using `insertAt-1` since the operatorsList has one less entry compared to the conditionRows\n      setOperatorsList([\n        ...operatorsList.slice(0, insertOpAt),\n        'AND',\n        ...operatorsList.slice(insertOpAt)\n      ]);\n    } else {\n      updateLogicString(INSERT_ROW); // Update the logicString input to reflect the insertion\n    }\n    setFocusRowIndex(insertAt);\n  };\n\n  // Remove the row at the given index\n  const removeRow = (removeAt: number): void => {\n    dispatch({ type: REMOVE_ROW, payload: { removeAt } }); // Remove an entry in conditionRows\n    if (isBasicMode) {\n      // Remove an AND/OR selector\n      if (removeAt === 0) {\n        // If removing the first of the condition rows, remove the extraneous operator\n        setOperatorsList(operatorsList.slice(1));\n      } else {\n        let removeOpAt = removeAt - 1; // Using `removeAt-1` since the operatorsList has one less entry compared to the conditionRows\n        if (operatorsList[removeOpAt] === 'OR' && operatorsList[removeOpAt + 1] === 'AND') {\n          // If removing a condition at the start of a nested group, remove the first operator from that group. e.g. Take `(1 AND 2) OR (3 AND 4 AND 5)`. If `3` is being deleted, it should become `(1 AND 2) OR (4 AND 5)` instead of `1 AND 2 AND 4 AND 5`\n          removeOpAt += 1;\n        }\n        setOperatorsList([\n          ...operatorsList.slice(0, removeOpAt),\n          ...operatorsList.slice(removeOpAt + 1)\n        ]);\n      }\n    } else {\n      updateLogicString(REMOVE_ROW); // Update the logicString input to reflect the removal\n    }\n    setFocusRowIndex(() => {\n      if (removeAt !== 0 && removeAt === conditionRows.length - 1) {\n        return removeAt - 1;\n      }\n\n      return removeAt;\n    });\n  };\n\n  // Update a Basic-mode operator at the given index\n  const updateOperator = (updateAt: number, newValue: 'AND' | 'OR'): void => {\n    setOperatorsList([\n      ...operatorsList.slice(0, updateAt),\n      newValue,\n      ...operatorsList.slice(updateAt + 1)\n    ]);\n  };\n\n  // Validate the logic input. Called upon clicking outside the textBox or upon submission.\n  // If the expression is invalid, shows appropriate feedback and returns null.\n  // If the expression is valid, formats it by setting up brackets at necessary places (to clear any ambiguities e.g. `1 AND 2 OR 3` is formatted as `(1 AND 2) OR 3` ). Returns a save-ready condition\n  const validateLogicString = (logicToUse: string): Condition | null => {\n    // Set up a lookup with row-labels as keys and rows as values\n    const conditionLookup: { [label: string]: LeafCondition } = {};\n    conditionRows.forEach(row => {\n      const { id, label, ...leaf } = row; // Discard the extra properties added by ConditionRow to the LeafCondition interface\n      conditionLookup[row.label] = leaf;\n    });\n\n    // Convert the logic string into a condition tree\n    const parseResult = parseLogicString(logicToUse, conditionLookup, disallowNOT);\n\n    // Indicate any parse error\n    if (hasProp(parseResult, 'error')) {\n      setLogicError(parseResult.error);\n      return null;\n    }\n\n    // If no errors\n    setLogicError(null); // Clear any previous error\n    setLogicString(disambiguateLogic(logicToUse)); // Disambiguating the logic string by placing parentheses at appropriate places\n    return parseResult.condition;\n  };\n\n  // Toggle between the Basic and Advanced modes\n  // `forceToggle:true` is passed when switching from Advanced to Basic mode despite a loss of information\n  const toggleMode = (forceToggle?: boolean): void => {\n    setModeWarning(false); // Clear any previous warning\n    if (isBasicMode) {\n      // Update the logicString to match the operatorsList before switching the mode\n      setLogicString(getLogicFromBasicMode(operatorsList));\n      setBasicMode(false);\n    } else if (forceToggle) {\n      // If forcibly toggling from Advanced to Basic despite a loss of operators\n      // Set up the default `AND` operator between all rows before switching to Basic mode\n      setOperatorsList(new Array(conditionRows.length - 1).fill('AND'));\n      setBasicMode(true);\n    } else {\n      // If switching from Advanced mode\n      const condition = validateLogicString(logicString); // Validate the logicString. If it is an invalid, an appropriate error is shown for the user to act on\n      if (condition !== null) {\n        // If it's a valid condition, check if it's simple enough to be shown in Basic mode without any loss of information\n        if (isBasicModeApplicable(condition)) {\n          // If the logic is simple enough, identify the new set of operators before switching to Basic mode\n          setOperatorsList(getBasicModeOperators(logicString));\n          setBasicMode(true);\n        } else {\n          // If the logic is too complex show a warning for the user to act on\n          setModeWarning(true);\n        }\n      }\n    }\n  };\n\n  const getCondition: HandleValue['getCondition'] = () => {\n    setErrorIndicators(false); // Reset any previous flag\n    setLogicError(null); // Clear any previous error\n\n    // If there's a single empty condition, submit with an `undefined` value (useful for clearing a previous condition)\n    if (conditionRows.length === 1 && conditionRows[0].lhs.field === '') {\n      return [true, undefined];\n    }\n\n    // Identify and indicate any invalid values in the condition rows\n    const hasInvalidRows = conditionRows.some(row => !isValidCondition(row, fields, true));\n    if (hasInvalidRows) {\n      setErrorIndicators(true); // Enable inline error indications\n      return [false];\n    }\n\n    // Validate the Logic string\n    const logicToUse = isBasicMode ? getLogicFromBasicMode(operatorsList) : logicString; // If in Basic-mode, construct a different logicString based on the operatorsList\n    const condition = validateLogicString(logicToUse); // This also takes care of showing an appropriate error feedback as needed\n    if (condition !== null) {\n      // Can be null when the logic string has errors\n      return [true, condition];\n    }\n\n    return [false];\n  };\n\n  useImperativeHandle(\n    handle,\n    () => ({\n      getCondition\n    }),\n    [getCondition]\n  );\n\n  const t = useI18n();\n\n  useEffect(() => {\n    if (showModeWarning) bannerHandleRef.current?.focus();\n  }, [showModeWarning]);\n\n  const { announceAssertive } = useLiveLog();\n\n  useEffect(() => {\n    announceAssertive({ message: t('condition_builder_mode_switch') });\n  }, [isBasicMode]);\n\n  return (\n    <StyledConditionBuilder container={{ direction: 'column', gap: 4 }}>\n      {/* Condition Rows */}\n      <div>\n        {conditionRows.map(({ id, label, ...leaf }, index) => {\n          const deleteAriaLabel = `${t('condition_builder_field_label')} ${leaf.lhs.field\n            .split('.')\n            .pop()}`;\n\n          let alignItems = 'end';\n          if (showErrorIndicators && !isValidCondition(leaf, fields, false)) {\n            alignItems = 'center';\n          }\n\n          return (\n            <Fragment key={id}>\n              {/* Row with the operator dropdown in Basic mode */}\n              {isBasicMode && index > 0 && (\n                <StyledRowWithSeparator\n                  container\n                  shaded={enableShading && operatorsList[index - 1] === 'AND'}\n                >\n                  <MenuButton\n                    popover={{ hideOnTargetHidden: false }}\n                    text={operatorsList[index - 1].toLowerCase()}\n                    variant='simple'\n                    menu={{\n                      items: [\n                        {\n                          id: 'AND',\n                          primary: 'and',\n                          onClick: () => updateOperator(index - 1, 'AND')\n                        },\n                        {\n                          id: 'OR',\n                          primary: 'or',\n                          onClick: () => updateOperator(index - 1, 'OR')\n                        }\n                      ]\n                    }}\n                    ref={index === focusRowIndex ? newOperatorButtonRef : null}\n                  />\n                </StyledRowWithSeparator>\n              )}\n\n              {/* Row with the AtomicCondition */}\n              <StyledRow\n                container={{ gap: 0.5, alignItems }}\n                shaded={isBasicMode && enableShading}\n                ref={index === focusRowIndex ? focusRowRef : null}\n              >\n                {/* Label */}\n                {!isBasicMode && <StyledLabel>{label}</StyledLabel>}\n\n                {/* Condition controls */}\n                <Flex item={{ grow: 1 }}>\n                  <AtomicCondition\n                    condition={leaf}\n                    fields={fields}\n                    indicateErrors={showErrorIndicators}\n                    validComparators={validComparators}\n                    dateFunctions={dateFunctions}\n                    onChange={(newCondition: LeafCondition) => {\n                      const newRow = { id, label, ...newCondition };\n                      dispatch({ type: UPDATE_ROW, payload: { updateAt: index, newRow } });\n                    }}\n                    validRhsTypes={validRhsTypes}\n                  />\n                </Flex>\n\n                {/* Row actions */}\n                <Button\n                  icon\n                  variant='simple'\n                  onClick={() => insertRow(index + 1)}\n                  label={t('add_condition')}\n                >\n                  <Icon name='plus' />\n                </Button>\n                <Button\n                  icon\n                  variant='simple'\n                  onClick={() => removeRow(index)}\n                  label={t('delete')}\n                  aria-label={deleteAriaLabel ? t('delete_noun', [deleteAriaLabel]) : undefined}\n                >\n                  <Icon name='trash' />\n                </Button>\n              </StyledRow>\n            </Fragment>\n          );\n        })}\n      </div>\n\n      {/* LogicString input */}\n      {!isBasicMode && (\n        <div>\n          <Flex container={{ gap: 0.25, direction: 'column' }}>\n            <Flex container={{ alignItems: 'center' }}>\n              <Label htmlFor={labelId}>\n                {t('condition_builder_advanced_condition_label')}&nbsp;\n              </Label>\n\n              <AdditionalInfo heading={t('condition_builder_advanced_condition_label')}>\n                {t('condition_builder_advanced_condition_tooltip', [\n                  disallowNOT ? 'AND/OR' : 'AND/OR/NOT',\n                  disallowNOT ? '(1 OR 2) AND (3 OR 4 OR 5)' : '(1 AND 2) OR (3 AND NOT 4)'\n                ])}\n              </AdditionalInfo>\n            </Flex>\n\n            <Input\n              id={labelId}\n              type='text'\n              placeholder={t('condition_builder_advanced_condition_placeholder')}\n              value={logicString}\n              onChange={(e: ChangeEvent<HTMLInputElement>) => setLogicString(e.target.value)}\n              onBlur={() => validateLogicString(logicString)}\n              status={logicError !== null ? 'error' : undefined}\n              info={logicError}\n            />\n          </Flex>\n        </div>\n      )}\n\n      {/* Submit block */}\n      <Flex container={{ direction: 'column', gap: 2 }}>\n        {/* Banner to show a warning when switching from Advanced to Basic mode */}\n        {showModeWarning && (\n          <Banner\n            variant='warning'\n            messages={[\n              {\n                label: t('condition_builder_switch_banner_text'),\n                action: {\n                  text: t('condition_builder_confirm_button_label'),\n                  onClick: () => {\n                    toggleMode(true);\n                    buttonRef.current?.focus();\n                  }\n                }\n              }\n            ]}\n            onDismiss={() => {\n              setModeWarning(false);\n              buttonRef.current?.focus();\n            }}\n            handle={bannerHandleRef}\n          />\n        )}\n\n        {/* Footer buttons */}\n        <Flex container={{ justify: 'between' }}>\n          <Button\n            name='mode-switch'\n            variant='simple'\n            onClick={() => {\n              toggleMode(false);\n            }}\n            aria-label={\n              isBasicMode\n                ? t('condition_builder_advanced_mode_button_aria_label')\n                : t('condition_builder_basic_mode_button_aria_label')\n            }\n            ref={buttonRef}\n          >\n            {isBasicMode\n              ? t('condition_builder_advanced_mode_button_label')\n              : t('condition_builder_basic_mode_button_label')}\n          </Button>\n        </Flex>\n      </Flex>\n    </StyledConditionBuilder>\n  );\n};\nConditionBuilder.defaultProps = defaultProps;\n\nexport default ConditionBuilder;\n"]}

package/lib/components/ConditionBuilder/ConditionBuilder.styles.d.ts

@@ -1,4 +1,6 @@
+export declare const StyledConditionBuilder: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").FlexProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledRow: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").FlexProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledTimePeriodContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledRowWithSeparator: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").FlexProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledLabel: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledAtomicCondition: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").FieldGroupProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;

package/lib/components/ConditionBuilder/ConditionBuilder.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConditionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/ConditionBuilder.styles.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,SAAS,mOAGrB,CAAC;AAKF,eAAO,MAAM,sBAAsB,mOAUlC,CAAC;AAKF,eAAO,MAAM,WAAW,yGAOvB,CAAC;AAIF,eAAO,MAAM,qBAAqB,yOAoBjC,CAAC"}
+{"version":3,"file":"ConditionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ConditionBuilder/ConditionBuilder.styles.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,sBAAsB,mOAYlC,CAAC;AAKF,eAAO,MAAM,SAAS,mOAGrB,CAAC;AAIF,eAAO,MAAM,yBAAyB,yGAIpC,CAAC;AAKH,eAAO,MAAM,sBAAsB,mOAUlC,CAAC;AAKF,eAAO,MAAM,WAAW,yGAOvB,CAAC;AAIF,eAAO,MAAM,qBAAqB,yOAoBjC,CAAC"}

package/lib/components/ConditionBuilder/ConditionBuilder.styles.js

@@ -1,11 +1,26 @@
 import styled, { css } from 'styled-components';
-import { calculateFontSize, defaultThemeProp, FieldGroup, Flex, StyledFieldGroupLegend } from '@pega/cosmos-react-core';
+import { calculateFontSize, defaultThemeProp, FieldGroup, Flex, StyledFieldGroupLegend, StyledPopover } from '@pega/cosmos-react-core';
+import { StyledDialog } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.styles';
+export const StyledConditionBuilder = styled(Flex)(({ theme: { base: { 'content-width': contentWidth, spacing } } }) => {
+    return css `
+      ${StyledPopover}:not(${StyledDialog}) & {
+        min-width: min(${contentWidth.lg}, calc(100vw - 4 * ${spacing}));
+      }
+    `;
+});
+StyledConditionBuilder.defaultProps = defaultThemeProp;
 // Styled wrapper for each Condition row
 export const StyledRow = styled(Flex) `
   padding: 0.25rem;
   background: ${props => (props.shaded ? 'rgba(0, 0, 0, 0.05)' : 'transparent')};
 `;
 StyledRow.defaultProps = defaultThemeProp;
+export const StyledTimePeriodContainer = styled.div(({ theme }) => {
+    return css `
+    width: ${theme.base['content-width'].sm};
+  `;
+});
+StyledTimePeriodContainer.defaultProps = defaultThemeProp;
 // Styled row-separators for Basic-mode
 export const StyledRowWithSeparator = styled(StyledRow) `
   padding: 0 0.25rem;
@@ -29,9 +44,9 @@ export const StyledLabel = styled.div `
   background: rgba(0, 0, 0, 0.04);
 `;
 StyledLabel.defaultProps = defaultThemeProp;
-export const StyledAtomicCondition = styled(FieldGroup)(({ theme: { base: { 'font-size': fontSize, 'font-scale': fontScale, spacing }, components: { text } }, collapsible }) => {
+export const StyledAtomicCondition = styled(FieldGroup)(({ theme: { base: { 'font-size': fontSize, 'font-scale': fontScale, spacing }, components: { text } }, collapsed }) => {
     const fontSizes = calculateFontSize(fontSize, fontScale);
-    return (!collapsible &&
+    return (!collapsed &&
         css `
         ${StyledFieldGroupLegend} {
           font-size: ${fontSizes[text.secondary['font-size']]};