npm - @pega/cosmos-react-condition-builder - Versions diffs - 2.0.0-dev.9.2 → 2.0.0-rc.2 - Mend

@pega/cosmos-react-condition-builder 2.0.0-dev.9.2 → 2.0.0-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (88) hide show

package/lib/components/ConditionBuilder/RhsControls/RhsModeSwitch.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RhsModeSwitch.js","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/RhsModeSwitch.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useMemo } from 'react';\n\nimport {\n BaseProps,\n ComboBox,\n ForwardProps,\n hasProp,\n MenuButton,\n menuHelpers,\n MenuProps,\n NoChildrenProp,\n TranslationPack,\n useI18n\n} from '@pega/cosmos-react-core';\nimport { TranslationFunction } from '@pega/cosmos-react-core/lib/i18n/translate';\nimport { Selected } from '@pega/cosmos-react-core/lib/components/ComboBox/ComboBox.types';\n\nimport { Comparator, FieldType, RHSType } from '../core/types';\nimport { DateFunctionsByType, LeafCondition } from '../ConditionBuilder.types';\n\nenum ItemID {\n LITERAL_VALUE = 'LITERAL_VALUE',\n DATE_PART = 'DATE_PART',\n RELATIVE_DATE = 'RELATIVE_DATE',\n ANOTHER_FIELD = 'ANOTHER_FIELD'\n}\n\n// Label for the `Enter <value>` option on the gear-menu\nfunction getValueOptionLabel(\n fieldType: FieldType,\n t: TranslationFunction<TranslationPack>\n): string {\n switch (fieldType) {\n case 'TEXT':\n return t('condition_builder_compare_with_text_value');\n case 'NUMBER':\n return t('condition_builder_compare_with_numeric_value');\n case 'DATE_TIME':\n case 'DATE_ONLY':\n return t('condition_builder_compare_with_date_value');\n case 'TIME_ONLY':\n return t('condition_builder_compare_with_time_value');\n default:\n return t('condition_builder_value_label'); // Not needed (BOOLEAN is not expected to be passed to the function)\n }\n}\n\ninterface RhsMenuButtonProps extends BaseProps, NoChildrenProp {\n /** Type of field on the LHS */\n fieldType: FieldType;\n\n /** Comparator for the condition */\n comparator: Comparator;\n\n /** Rhs for the condition */\n rhs: LeafCondition['rhs'];\n\n /** Callback for any modifications to the Rhs */\n onChange: (rhs: LeafCondition['rhs']) => void;\n\n /** Display mode */\n mode: 'combo-box' | 'menu-button';\n\n /** Restricts RHS values to only specified RHS types */\n validRhsTypes: Set<RHSType>;\n\n /** Passed to enable additional date controls on the RHS, when a DATE_TIME/DATE_ONLY field is selected on the LHS */\n dateFunctions?: DateFunctionsByType;\n}\n\n/** Renders a Gear MenuButton on the RHS (when applicable) */\nconst RhsModeSwitch: FunctionComponent<RhsMenuButtonProps & ForwardProps> = (\n props: RhsMenuButtonProps\n) => {\n const { fieldType, comparator, rhs, onChange, mode, validRhsTypes, dateFunctions } = props;\n const t = useI18n();\n\n // Identify current mode\n const currentMode = useMemo(() => {\n // rhs should already be defined if this component is being rendered. Indicating the same to TS using `!`\n if (hasProp(rhs!, 'field')) return ItemID.ANOTHER_FIELD;\n if (hasProp(rhs!, 'value') && hasProp(rhs!, 'dateFunction')) return ItemID.DATE_PART;\n if (hasProp(rhs!, 'relativeDate')) return ItemID.RELATIVE_DATE;\n return ItemID.LITERAL_VALUE;\n }, [rhs]);\n\n // Determine actions for the menu\n const menu = useMemo<MenuProps>(() => {\n const items: MenuProps['items'] = [];\n\n // Boolean conditions either don't use an rhs or always use the field-selector\n // For IN/NOT_IN comparators, only one mode is possible for a given case - CSV Input or a Value-selector\n if (fieldType !== 'BOOLEAN' && !['IN', 'NOT_IN'].includes(comparator)) {\n // Literal value input\n if (validRhsTypes.has('LITERAL')) {\n // Literal Value inputs\n items.push({\n id: ItemID.LITERAL_VALUE,\n primary: getValueOptionLabel(fieldType, t),\n onClick: id => {\n if (id === currentMode) return; // Ignore if already in that mode\n onChange({ value: '' }); // Submit a new RHS to re-render with the new mode\n }\n });\n }\n\n // Field selector\n if (validRhsTypes.has('FIELD')) {\n items.push({\n id: ItemID.ANOTHER_FIELD,\n primary: t('condition_builder_compare_with_another_field'),\n onClick: id => {\n if (id === currentMode) return; // Ignore if already in that mode\n onChange({ field: '' }); // Submit a new RHS to re-render with the new mode\n }\n });\n }\n\n // Relative Date value input\n if (\n validRhsTypes.has('RELATIVE_DATE') &&\n (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY')\n ) {\n items.push({\n id: ItemID.RELATIVE_DATE,\n primary: t('condition_builder_compare_with_relative_date'),\n onClick: id => {\n if (id === currentMode) return; // Ignore if already in that mode\n onChange({\n relativeDate: {\n timePeriod: 'CURRENT',\n datePart: 'DAYS'\n }\n });\n }\n });\n }\n\n // Date Part value input\n if (\n validRhsTypes.has('DATE_FUNCTION') &&\n dateFunctions &&\n (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY')\n ) {\n items.push({\n id: ItemID.DATE_PART,\n primary: t('condition_builder_date_part'),\n onClick: id => {\n if (id === currentMode) return; // Ignore if already in that mode\n onChange({ value: '', dateFunction: dateFunctions[fieldType][0] }); // Submit a new RHS to re-render with the new mode. Initializing with the first available date function\n }\n });\n }\n }\n\n return { items, mode: 'action' };\n }, [fieldType, comparator, onChange, validRhsTypes, dateFunctions, currentMode, t]);\n\n // Identify current selection for ComboBox\n const selected = useMemo<Selected | undefined>(() => {\n const selectedItem = menuHelpers.getItem(menu.items, currentMode);\n return selectedItem ? { id: selectedItem.id, text: selectedItem.primary } : undefined;\n }, [menu, currentMode]);\n\n // Render the button only when there are multiple options in the menu\n if (menu.items.length < 2) return null;\n\n if (mode === 'combo-box') {\n return (\n <ComboBox\n label={t('condition_builder_compare_with')}\n labelHidden\n mode='single-select'\n selected={{ items: selected }}\n menu={menu}\n />\n );\n }\n\n return (\n <MenuButton\n text={t('condition_builder_compare_with')}\n icon='gear'\n iconOnly\n variant='simple'\n menu={menu}\n />\n );\n};\n\nexport default RhsModeSwitch;\n"]}

package/lib/components/ConditionBuilder/{TimePeriodInput.d.ts → RhsControls/TimePeriodInput.d.ts} RENAMED Viewed

@@ -1,6 +1,7 @@
 import { FunctionComponent } from 'react';
 import { ForwardProps } from '@pega/cosmos-react-core';
 import { TimePeriodMenuProps } from './TimePeriodMenu';
+export declare const StyledOpenerButton: import("styled-components").StyledComponent<FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 /** Renders a button that opens up TimePeriodMenu in a Popover */
 declare const TimePeriodInput: FunctionComponent<TimePeriodMenuProps & ForwardProps>;
 export default TimePeriodInput;

package/lib/components/ConditionBuilder/RhsControls/TimePeriodInput.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TimePeriodInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/TimePeriodInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAoB,MAAM,OAAO,CAAC;AAG5D,OAAO,EAEL,YAAY,EAWb,MAAM,yBAAyB,CAAC;AAUjC,OAAuB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAGvE,eAAO,MAAM,kBAAkB,mLAa7B,CAAC;AAwEH,iEAAiE;AACjE,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAkE1E,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/components/ConditionBuilder/RhsControls/TimePeriodInput.js ADDED Viewed

@@ -0,0 +1,89 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useRef, useState } from 'react';
+import styled, { css } from 'styled-components';
+import { Flex, Icon, Popover, Text, useElement, useOuterEvent, useConfiguration, useI18n, hasProp, Button, defaultThemeProp } from '@pega/cosmos-react-core';
+import { StyledFormFieldInfo } from '@pega/cosmos-react-core/lib/components/FormField/FormField';
+import DateTimeDisplay from '@pega/cosmos-react-core/lib/components/DateTime/DateTimeDisplay';
+import { formatRelativeDate } from '../core/formatter';
+import TimePeriodMenu from './TimePeriodMenu';
+// Custom styles for the button to match the designs
+export const StyledOpenerButton = styled(Button)(props => {
+    const { 'border-radius': baseBorderRadius } = props.theme.base;
+    const { 'form-control': formControl } = props.theme.components;
+    const { 'status-color': errorColor } = props.theme.components['form-field'].error;
+    return css `
+    width: 100%;
+    padding: 0 ${formControl.padding};
+    color: ${formControl['foreground-color']};
+    border-radius: calc(${baseBorderRadius} * ${formControl['border-radius']});
+    background-color: ${formControl['background-color']};
+    border-color: ${props.hasError ? errorColor : formControl['border-color']};
+  `;
+});
+StyledOpenerButton.defaultProps = defaultThemeProp;
+const dateDisplayVariants = {
+    YEARS: 'year',
+    QUARTERS: 'quarteryear',
+    MONTHS: 'monthyear',
+    WEEKS: 'week',
+    DAYS: 'date',
+    HOURS: 'datetime'
+};
+const EllipsisLabel = styled.div `
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`;
+/** Display for the selected time period value */
+const TimePeriodDisplay = (props) => {
+    const { locale } = useConfiguration();
+    const t = useI18n();
+    const { rhs } = props;
+    if (hasProp(rhs, 'relativeDate')) {
+        const { relativeDate: { timePeriod, interval, datePart } } = rhs;
+        return _jsx(Text, { children: formatRelativeDate(t, timePeriod, datePart, interval) }, void 0);
+    }
+    const { value, dateFunction } = rhs;
+    if (!value) {
+        return _jsx(Text, { children: t('condition_builder_select_placeholder') }, void 0);
+    }
+    if (dateFunction === 'MONTHS_OF_YEAR') {
+        return (_jsx(Text, { children: new Date(2021, value - 1, 1).toLocaleString(locale, { month: 'long' }) }, void 0));
+    }
+    if (dateFunction === 'DAYS_OF_MONTH') {
+        return (_jsx(Text, { children: t('condition_builder_day_number_of_month', [value], {
+                count: Number(value),
+                pluralType: 'ordinal'
+            }) }, void 0));
+    }
+    if (dateFunction === 'DAYS_OF_WEEK') {
+        return (
+        // Choosing Feb-2021 as it starts on a Monday
+        _jsx(Text, { children: new Date(2021, 1, value).toLocaleString(locale, { weekday: 'long' }) }, void 0));
+    }
+    return _jsx(DateTimeDisplay, { value: value, variant: dateDisplayVariants[dateFunction] }, void 0);
+};
+/** Renders a button that opens up TimePeriodMenu in a Popover */
+const TimePeriodInput = (props) => {
+    const { rhs, onChange, dateFunctionsList, status, fieldType } = props;
+    const t = useI18n();
+    // Ref for the opener button
+    const buttonRef = useRef(null);
+    // Set up a Popover for the controls
+    const [isOpen, setIsOpen] = useState(false);
+    const [popoverEl, setPopoverEl] = useElement(null);
+    const hidePopup = () => {
+        if (isOpen)
+            setIsOpen(false);
+    };
+    useOuterEvent('mousedown', [popoverEl, buttonRef.current], hidePopup); // Call the method on clicking outside these elements
+    const hideOnEscape = (e) => {
+        if (e.key === 'Escape')
+            hidePopup(); // Call the method when Escape key is pressed
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(StyledOpenerButton, { ref: buttonRef, "aria-haspopup": true, "aria-expanded": isOpen, onClick: () => setIsOpen(!isOpen), onKeyDown: hideOnEscape, hasError: status === 'error', name: 'time-period-button', children: _jsxs(Flex, { container: { justify: 'between', alignItems: 'center', gap: 1 }, item: { grow: 1 }, children: [_jsx(EllipsisLabel, { children: _jsx(TimePeriodDisplay, { rhs: rhs }, void 0) }, void 0), _jsx(Icon, { name: isOpen ? 'times' : 'calendar' }, void 0)] }, void 0) }, void 0), status === 'error' && (_jsx(StyledFormFieldInfo, { status: 'error', children: hasProp(rhs, 'relativeDate')
+                    ? t('condition_builder_invalid_relative_date')
+                    : t('condition_builder_invalid_time_period') }, void 0)), _jsx(Popover, { show: isOpen, ref: setPopoverEl, target: buttonRef.current, placement: 'bottom-start', style: { width: '40ch' }, children: _jsx(Flex, { container: { pad: 1 }, children: _jsx(TimePeriodMenu, { rhs: rhs, fieldType: fieldType, onChange: onChange, dateFunctionsList: dateFunctionsList, status: status }, void 0) }, void 0) }, void 0)] }, void 0));
+};
+export default TimePeriodInput;
+//# sourceMappingURL=TimePeriodInput.js.map

package/lib/components/ConditionBuilder/RhsControls/TimePeriodInput.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TimePeriodInput.js","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/TimePeriodInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useRef, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n ForwardProps,\n Icon,\n Popover,\n Text,\n useElement,\n useOuterEvent,\n useConfiguration,\n useI18n,\n hasProp,\n Button,\n defaultThemeProp\n} from '@pega/cosmos-react-core';\nimport { StyledFormFieldInfo } from '@pega/cosmos-react-core/lib/components/FormField/FormField';\nimport DateTimeDisplay, {\n DateTimeVariant\n} from '@pega/cosmos-react-core/lib/components/DateTime/DateTimeDisplay';\n\nimport { RhsWithDateFunction, RhsWithRelativeDate } from '../ConditionBuilder.types';\nimport { formatRelativeDate } from '../core/formatter';\nimport { DateFunction } from '../core/types';\n\nimport TimePeriodMenu, { TimePeriodMenuProps } from './TimePeriodMenu';\n\n// Custom styles for the button to match the designs\nexport const StyledOpenerButton = styled(Button)(props => {\n const { 'border-radius': baseBorderRadius } = props.theme.base;\n const { 'form-control': formControl } = props.theme.components;\n const { 'status-color': errorColor } = props.theme.components['form-field'].error;\n\n return css`\n width: 100%;\n padding: 0 ${formControl.padding};\n color: ${formControl['foreground-color']};\n border-radius: calc(${baseBorderRadius} * ${formControl['border-radius']});\n background-color: ${formControl['background-color']};\n border-color: ${props.hasError ? errorColor : formControl['border-color']};\n `;\n});\nStyledOpenerButton.defaultProps = defaultThemeProp;\n\nconst dateDisplayVariants: Record<\n Exclude<DateFunction, 'MONTHS_OF_YEAR' | 'DAYS_OF_MONTH' | 'DAYS_OF_WEEK'>,\n DateTimeVariant\n> = {\n YEARS: 'year',\n QUARTERS: 'quarteryear',\n MONTHS: 'monthyear',\n WEEKS: 'week',\n DAYS: 'date',\n HOURS: 'datetime'\n};\n\nconst EllipsisLabel = styled.div`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\n/** Display for the selected time period value */\nconst TimePeriodDisplay: FunctionComponent<{ rhs: RhsWithDateFunction | RhsWithRelativeDate }> =\n (props: { rhs: RhsWithDateFunction | RhsWithRelativeDate }) => {\n const { locale } = useConfiguration();\n const t = useI18n();\n const { rhs } = props;\n\n if (hasProp(rhs, 'relativeDate')) {\n const {\n relativeDate: { timePeriod, interval, datePart }\n } = rhs;\n return <Text>{formatRelativeDate(t, timePeriod, datePart, interval)}</Text>;\n }\n\n const { value, dateFunction } = rhs;\n\n if (!value) {\n return <Text>{t('condition_builder_select_placeholder')}</Text>;\n }\n\n if (dateFunction === 'MONTHS_OF_YEAR') {\n return (\n <Text>\n {new Date(2021, (value as number) - 1, 1).toLocaleString(locale, { month: 'long' })}\n </Text>\n );\n }\n\n if (dateFunction === 'DAYS_OF_MONTH') {\n return (\n <Text>\n {t('condition_builder_day_number_of_month', [value], {\n count: Number(value),\n pluralType: 'ordinal'\n })}\n </Text>\n );\n }\n\n if (dateFunction === 'DAYS_OF_WEEK') {\n return (\n // Choosing Feb-2021 as it starts on a Monday\n <Text>\n {new Date(2021, 1, value as number).toLocaleString(locale, { weekday: 'long' })}\n </Text>\n );\n }\n\n return <DateTimeDisplay value={value} variant={dateDisplayVariants[dateFunction]} />;\n };\n\n/** Renders a button that opens up TimePeriodMenu in a Popover */\nconst TimePeriodInput: FunctionComponent<TimePeriodMenuProps & ForwardProps> = (\n props: TimePeriodMenuProps\n) => {\n const { rhs, onChange, dateFunctionsList, status, fieldType } = props;\n const t = useI18n();\n\n // Ref for the opener button\n const buttonRef = useRef(null);\n\n // Set up a Popover for the controls\n const [isOpen, setIsOpen] = useState(false);\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const hidePopup = () => {\n if (isOpen) setIsOpen(false);\n };\n useOuterEvent('mousedown', [popoverEl, buttonRef.current], hidePopup); // Call the method on clicking outside these elements\n const hideOnEscape = (e: KeyboardEvent) => {\n if (e.key === 'Escape') hidePopup(); // Call the method when Escape key is pressed\n };\n\n return (\n <>\n <StyledOpenerButton\n ref={buttonRef}\n aria-haspopup\n aria-expanded={isOpen}\n onClick={() => setIsOpen(!isOpen)}\n onKeyDown={hideOnEscape}\n hasError={status === 'error'}\n name='time-period-button'\n >\n <Flex container={{ justify: 'between', alignItems: 'center', gap: 1 }} item={{ grow: 1 }}>\n <EllipsisLabel>\n <TimePeriodDisplay rhs={rhs} />\n </EllipsisLabel>\n <Icon name={isOpen ? 'times' : 'calendar'} />\n </Flex>\n </StyledOpenerButton>\n\n {status === 'error' && (\n <StyledFormFieldInfo status='error'>\n {hasProp(rhs, 'relativeDate')\n ? t('condition_builder_invalid_relative_date')\n : t('condition_builder_invalid_time_period')}\n </StyledFormFieldInfo>\n )}\n\n <Popover\n show={isOpen}\n ref={setPopoverEl}\n target={buttonRef.current}\n placement='bottom-start'\n style={{ width: '40ch' }}\n >\n <Flex container={{ pad: 1 }}>\n <TimePeriodMenu\n rhs={rhs}\n fieldType={fieldType}\n onChange={onChange}\n dateFunctionsList={dateFunctionsList}\n status={status}\n />\n </Flex>\n </Popover>\n </>\n );\n};\n\nexport default TimePeriodInput;\n"]}

package/lib/components/ConditionBuilder/RhsControls/TimePeriodMenu.d.ts ADDED Viewed

@@ -0,0 +1,20 @@
+import { FunctionComponent } from 'react';
+import { BaseProps, ForwardProps, NoChildrenProp } from '@pega/cosmos-react-core';
+import { RhsWithDateFunction, RhsWithRelativeDate } from '../ConditionBuilder.types';
+import { DateFunction, FieldType } from '../core/types';
+export interface TimePeriodMenuProps extends BaseProps, NoChildrenProp {
+    /** Rhs for the condition */
+    rhs: RhsWithDateFunction | RhsWithRelativeDate;
+    /** Callback for any modifications to the Rhs */
+    onChange: (rhs: RhsWithDateFunction | RhsWithRelativeDate) => void;
+    /** List of date functions enabled for the current LHS field type */
+    dateFunctionsList: DateFunction[];
+    /** FieldType of the LHS Field. Will only be DATE_TIME or DATE_ONLY */
+    fieldType: FieldType;
+    /** Used to indicate any errors on the control */
+    status?: 'error';
+}
+/** A menu with controls to select a Time period value on RHS */
+declare const TimePeriodMenu: FunctionComponent<TimePeriodMenuProps & ForwardProps>;
+export default TimePeriodMenu;
+//# sourceMappingURL=TimePeriodMenu.d.ts.map

package/lib/components/ConditionBuilder/RhsControls/TimePeriodMenu.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TimePeriodMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/TimePeriodMenu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,SAAS,EAAQ,YAAY,EAAW,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAEjG,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AACrF,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAKxD,MAAM,WAAW,mBAAoB,SAAQ,SAAS,EAAE,cAAc;IACpE,4BAA4B;IAC5B,GAAG,EAAE,mBAAmB,GAAG,mBAAmB,CAAC;IAE/C,gDAAgD;IAChD,QAAQ,EAAE,CAAC,GAAG,EAAE,mBAAmB,GAAG,mBAAmB,KAAK,IAAI,CAAC;IAEnE,oEAAoE;IACpE,iBAAiB,EAAE,YAAY,EAAE,CAAC;IAElC,sEAAsE;IACtE,SAAS,EAAE,SAAS,CAAC;IAErB,iDAAiD;IACjD,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,gEAAgE;AAChE,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAmBzE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/ConditionBuilder/RhsControls/TimePeriodMenu.js ADDED Viewed

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Flex, hasProp } from '@pega/cosmos-react-core';
+import DateFunctionMenu from './DateFunctionMenu';
+import RelativeDateMenu from './RelativeDateMenu';
+/** A menu with controls to select a Time period value on RHS */
+const TimePeriodMenu = (props) => {
+    const { rhs, onChange, dateFunctionsList, status, fieldType } = props;
+    return (_jsxs(Flex, { container: { direction: 'column', rowGap: 0.5 }, item: { grow: 1 }, children: [hasProp(rhs, 'dateFunction') && (_jsx(DateFunctionMenu, { rhs: rhs, onChange: onChange, dateFunctionsList: dateFunctionsList, status: status }, void 0)), hasProp(rhs, 'relativeDate') && (_jsx(RelativeDateMenu, { rhs: rhs, fieldType: fieldType, onChange: onChange, status: status }, void 0))] }, void 0));
+};
+export default TimePeriodMenu;
+//# sourceMappingURL=TimePeriodMenu.js.map

package/lib/components/ConditionBuilder/RhsControls/TimePeriodMenu.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TimePeriodMenu.js","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/TimePeriodMenu.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAa,IAAI,EAAgB,OAAO,EAAkB,MAAM,yBAAyB,CAAC;AAKjG,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAClD,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAmBlD,gEAAgE;AAChE,MAAM,cAAc,GAA0D,CAC5E,KAA0B,EAC1B,EAAE;IACF,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IACtE,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aACrE,OAAO,CAAC,GAAG,EAAE,cAAc,CAAC,IAAI,CAC/B,KAAC,gBAAgB,IACf,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,iBAAiB,EACpC,MAAM,EAAE,MAAM,WACd,CACH,EACA,OAAO,CAAC,GAAG,EAAE,cAAc,CAAC,IAAI,CAC/B,KAAC,gBAAgB,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,WAAI,CACzF,YACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["// cspell:ignore words DDTHH\nimport { FunctionComponent } from 'react';\n\nimport { BaseProps, Flex, ForwardProps, hasProp, NoChildrenProp } from '@pega/cosmos-react-core';\n\nimport { RhsWithDateFunction, RhsWithRelativeDate } from '../ConditionBuilder.types';\nimport { DateFunction, FieldType } from '../core/types';\n\nimport DateFunctionMenu from './DateFunctionMenu';\nimport RelativeDateMenu from './RelativeDateMenu';\n\nexport interface TimePeriodMenuProps extends BaseProps, NoChildrenProp {\n /** Rhs for the condition */\n rhs: RhsWithDateFunction | RhsWithRelativeDate;\n\n /** Callback for any modifications to the Rhs */\n onChange: (rhs: RhsWithDateFunction | RhsWithRelativeDate) => void;\n\n /** List of date functions enabled for the current LHS field type */\n dateFunctionsList: DateFunction[];\n\n /** FieldType of the LHS Field. Will only be DATE_TIME or DATE_ONLY */\n fieldType: FieldType;\n\n /** Used to indicate any errors on the control */\n status?: 'error';\n}\n\n/** A menu with controls to select a Time period value on RHS */\nconst TimePeriodMenu: FunctionComponent<TimePeriodMenuProps & ForwardProps> = (\n props: TimePeriodMenuProps\n) => {\n const { rhs, onChange, dateFunctionsList, status, fieldType } = props;\n return (\n <Flex container={{ direction: 'column', rowGap: 0.5 }} item={{ grow: 1 }}>\n {hasProp(rhs, 'dateFunction') && (\n <DateFunctionMenu\n rhs={rhs}\n onChange={onChange}\n dateFunctionsList={dateFunctionsList}\n status={status}\n />\n )}\n {hasProp(rhs, 'relativeDate') && (\n <RelativeDateMenu rhs={rhs} fieldType={fieldType} onChange={onChange} status={status} />\n )}\n </Flex>\n );\n};\n\nexport default TimePeriodMenu;\n"]}

package/lib/components/ConditionBuilder/{RhsControls.d.ts → RhsControls/index.d.ts} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { FunctionComponent } from 'react';
 import { BaseProps, ForwardProps } from '@pega/cosmos-react-core';
-import { FieldType, Comparator, RHSType } from './core/types';
-import { LeafCondition, Field, DateFunctionsByType } from './ConditionBuilder.types';
+import { FieldType, Comparator, RHSType } from '../core/types';
+import { LeafCondition, Field, DateFunctionsByType } from '../ConditionBuilder.types';
 /**
  * Verifies if the condition has all valid values.
  * NOTES:
@@ -36,4 +36,4 @@ interface RhsControlProps extends BaseProps {
 /** A controlled component for controls on a Condition's RHS */
 declare const RhsControls: FunctionComponent<RhsControlProps & ForwardProps>;
 export default RhsControls;
-//# sourceMappingURL=RhsControls.d.ts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/components/ConditionBuilder/RhsControls/index.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAA6C,MAAM,OAAO,CAAC;AAErF,OAAO,EAQL,SAAS,EACT,YAAY,EACb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAUtF;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,SAAS,CAAC,EAAE,SAAS,EACrB,UAAU,GAAE,OAAe,GAC1B,OAAO,CA2DT;AAED,wHAAwH;AACxH,wBAAgB,aAAa,CAC3B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,EAC3B,aAAa,CAAC,EAAE,mBAAmB,GAClC,aAAa,CAAC,KAAK,CAAC,CAyCtB;AAqBD,yDAAyD;AACzD,UAAU,eAAgB,SAAQ,SAAS;IACzC,4BAA4B;IAC5B,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1B,mCAAmC;IACnC,UAAU,EAAE,UAAU,CAAC;IAEvB,4BAA4B;IAC5B,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1B,4EAA4E;IAC5E,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,gDAAgD;IAChD,QAAQ,EAAE,CAAC,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC;IAE9C,+DAA+D;IAC/D,cAAc,EAAE,OAAO,CAAC;IAExB,0BAA0B;IAC1B,aAAa,EAAE,KAAK,GAAG,QAAQ,CAAC;IAEhC,uDAAuD;IACvD,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAE5B,oHAAoH;IACpH,aAAa,CAAC,EAAE,mBAAmB,CAAC;CACrC;AAED,+DAA+D;AAC/D,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAuQlE,CAAC;AACF,eAAe,WAAW,CAAC"}

package/lib/components/ConditionBuilder/{RhsControls.js → RhsControls/index.js} RENAMED Viewed

@@ -1,12 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useMemo } from 'react';
 import { DateInput, DateTimeInput, Flex, Input, Select, Option, hasProp } from '@pega/cosmos-react-core';
+import { convertTimeValueToMs, convertMsToTimeValue } from '../core/time-utils';
 import MultiValueSelector from './MultiValueSelector';
 import FieldSelector from './FieldSelector';
 import RhsModeSwitch from './RhsModeSwitch';
-import { convertTimeValueToMs, convertMsToTimeValue } from './core/time-utils';
 import TimePeriodInput from './TimePeriodInput';
 import TimePeriodMenu from './TimePeriodMenu';
+import NumericInput from './NumericInput';
 /**
  * Verifies if the condition has all valid values.
  * NOTES:
@@ -31,14 +32,12 @@ export function isValidRhs(rhs, fieldType, trimValues = false) {
             return false;
         }
         // For numeric fields, RHS is invalid if any NaN values are present in the list
-        if (fieldType === 'NUMBER') {
-            if (rhs.values.some(v => Number.isNaN(v))) {
-                return false;
-            }
+        if (fieldType === 'NUMBER' && rhs.values.some(v => Number.isNaN(v))) {
+            return false;
         }
     }
     if (hasProp(rhs, 'value')) {
-        // Identify any invalid numbers (not expected)
+        // Identify any invalid numbers (e.g. when `-` is entered)
         if (typeof rhs.value === 'number') {
             return !Number.isNaN(rhs.value);
         }
@@ -51,12 +50,17 @@ export function isValidRhs(rhs, fieldType, trimValues = false) {
             return false;
         }
         // This check is needed to eliminate invalid dates like `Feb 31` (02/31/2020), which the input allows
-        if (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY') {
-            if (Number.isNaN(new Date(rhs.value).getTime())) {
-                return false;
-            }
+        if ((fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY') &&
+            Number.isNaN(new Date(rhs.value).getTime())) {
+            return false;
         }
     }
+    if (hasProp(rhs, 'relativeDate') &&
+        ((rhs.relativeDate.timePeriod === 'CURRENT' && rhs.relativeDate.interval) ||
+            (rhs.relativeDate.timePeriod !== 'CURRENT' &&
+                (!rhs.relativeDate.interval || rhs.relativeDate.interval <= 0)))) {
+        return false;
+    }
     return true;
 }
 /** For a condition with the given comparator and lhs-field-type, determines an appropriate default value for the Rhs */
@@ -81,6 +85,15 @@ export function getDefaultRhs(fieldType, comparator, validRhsTypes, dateFunction
                 dateFunctions &&
                 (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY'))
                 return { value: '', dateFunction: dateFunctions[fieldType][0] };
+            if (validRhsTypes.has('RELATIVE_DATE') &&
+                (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY')) {
+                return {
+                    relativeDate: {
+                        timePeriod: 'CURRENT',
+                        datePart: 'DAYS'
+                    }
+                };
+            }
             return { field: '' };
         }
     }
@@ -159,13 +172,7 @@ const RhsControls = (props) => {
     // Handle changes from a Value-input
     const handleValueChange = (e) => {
         // NOTE: Not trimming the value here so that users can freely type spaces between words. Trimming is done on Submit, via the isValidRhs call
-        let newValue = e.target.value;
-        if (fieldType === 'NUMBER' && newValue !== '') {
-            // Save as a number unless it is an empty string
-            // If empty strings aren't allowed, users wont be able to clear a value to type something else
-            newValue = Number(newValue);
-        }
-        onChange({ value: newValue }); // Submit a new RHS
+        onChange({ value: e.target.value }); // Submit a new RHS
     };
     // Handle changes from a Time-input
     const handleTimeValueChange = (e) => {
@@ -199,27 +206,14 @@ const RhsControls = (props) => {
     };
     // Render the menu directly if in a vertical layout
     const TimePeriodComp = itemDirection === 'column' ? TimePeriodMenu : TimePeriodInput;
-    return (_jsxs(Flex, Object.assign({ container: {
+    return (_jsxs(Flex, { container: {
             direction: itemDirection,
             alignItems: itemDirection === 'column' ? 'stretch' : 'start',
             justify: 'between',
             gap: 0.5
-        } }, { children: [_jsx(RhsModeSwitch, { fieldType: fieldType, comparator: comparator, rhs: rhs, onChange: onChange, mode: itemDirection === 'column' ? 'combo-box' : 'menu-button', validRhsTypes: validRhsTypes, dateFunctions: dateFunctions }, void 0),
-            hasProp(rhs, 'field') && (_jsx(Flex, Object.assign({ item: { grow: 1 } }, { children: _jsx(FieldSelector, { value: rhs.field, onChange: handleFieldChange, fields: fieldOptions, status: showError ? 'error' : undefined, info: showError ? 'No selection' : undefined }, void 0) }), void 0)),
-            hasProp(rhs, 'value') && (_jsxs(Flex, Object.assign({ item: { grow: 1 } }, { children: [fieldType === 'TEXT' && useValueSelector && (_jsxs(Select, Object.assign({ value: rhs.value, onChange: (e) => handleValueSelection(e.target.value), status: showError ? 'error' : undefined, info: showError ? 'No selection' : undefined, label: '-', labelHidden: true }, { children: [_jsx(Option, Object.assign({ value: '' }, { children: "Select value" }), void 0),
-                            possibleValues.map(value => (_jsx(Option, Object.assign({ value: value }, { children: value }), value)))] }), void 0)),
-                    fieldType === 'TEXT' && !useValueSelector && (_jsx(Input, { value: rhs.value, onChange: handleValueChange, status: showError ? 'error' : undefined, info: showError ? 'Empty value' : undefined, name: 'rhs-text-literal-input', label: '-', labelHidden: true }, void 0)),
-                    fieldType === 'NUMBER' && (
-                    // NOTE: If `as string` is used instead of `.toString()`, users won't be able to enter the value `0`
-                    _jsx(Input, { type: 'number', value: rhs.value.toString(), onChange: handleValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid number' : undefined, label: '-', labelHidden: true }, void 0)),
-                    fieldType === 'TIME_ONLY' && (_jsx(Input, { type: 'time', step: '1', value: typeof rhs.value === 'string' ? rhs.value : convertMsToTimeValue(rhs.value), onChange: handleTimeValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid time' : undefined, label: '-', labelHidden: true }, void 0)),
-                    fieldType === 'DATE_ONLY' && !hasProp(rhs, 'dateFunction') && (_jsx(DateInput, { value: rhs.value, onBlur: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid date' : '', label: '-', labelHidden: true }, void 0)),
-                    fieldType === 'DATE_TIME' && !hasProp(rhs, 'dateFunction') && (_jsx(DateTimeInput, { value: rhs.value !== '' ? rhs.value : undefined, onBlur: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid date' : '', label: '-', labelHidden: true }, void 0)),
-                    (fieldType === 'DATE_ONLY' || fieldType === 'DATE_TIME') &&
-                        hasProp(rhs, 'dateFunction') && (_jsx(TimePeriodComp, { rhs: rhs, onChange: onChange, dateFunctionsList: dateFunctions[fieldType], status: showError ? 'error' : undefined }, void 0))] }), void 0)),
-            hasProp(rhs, 'values') && (_jsxs(Flex, Object.assign({ item: { grow: 1 } }, { children: [useValueSelector && (_jsx(MultiValueSelector, { values: rhs.values, options: possibleValues, onChange: handleValueSelection, status: showError ? 'error' : undefined }, void 0)),
-                    !useValueSelector && (_jsx(Input, { value: csvInput, onChange: handleCSVChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid values' : undefined, label: '-', labelHidden: true, placeholder: 'Enter comma separated values' // FIXME: TR
-                     }, void 0))] }), void 0))] }), void 0));
+        }, children: [_jsx(RhsModeSwitch, { fieldType: fieldType, comparator: comparator, rhs: rhs, onChange: onChange, mode: itemDirection === 'column' ? 'combo-box' : 'menu-button', validRhsTypes: validRhsTypes, dateFunctions: dateFunctions }, void 0), hasProp(rhs, 'field') && (_jsx(Flex, { item: { grow: 1 }, children: _jsx(FieldSelector, { value: rhs.field, onChange: handleFieldChange, fields: fieldOptions, status: showError ? 'error' : undefined, info: showError ? 'No selection' : undefined }, void 0) }, void 0)), hasProp(rhs, 'value') && !hasProp(rhs, 'dateFunction') && (_jsxs(Flex, { item: { grow: 1 }, children: [fieldType === 'TEXT' && useValueSelector && (_jsxs(Select, { value: rhs.value, onChange: (e) => handleValueSelection(e.target.value), status: showError ? 'error' : undefined, info: showError ? 'No selection' : undefined, label: '-', labelHidden: true, children: [_jsx(Option, { value: '', children: "Select value" }, void 0), possibleValues.map(value => (_jsx(Option, { value: value, children: value }, value)))] }, void 0)), fieldType === 'TEXT' && !useValueSelector && (_jsx(Input, { value: rhs.value, onChange: handleValueChange, status: showError ? 'error' : undefined, info: showError ? 'Empty value' : undefined, name: 'rhs-text-literal-input', label: '-', labelHidden: true }, void 0)), fieldType === 'NUMBER' && (_jsx(NumericInput, { rhs: rhs, onChange: onChange, status: showError ? 'error' : undefined }, void 0)), fieldType === 'TIME_ONLY' && (_jsx(Input, { type: 'time', step: '1', value: typeof rhs.value === 'string' ? rhs.value : convertMsToTimeValue(rhs.value), onChange: handleTimeValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid time' : undefined, label: '-', labelHidden: true }, void 0)), fieldType === 'DATE_ONLY' && (_jsx(DateInput, { value: rhs.value, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid date' : '', label: '-', labelHidden: true }, void 0)), fieldType === 'DATE_TIME' && (_jsx(DateTimeInput, { value: rhs.value !== '' ? rhs.value : undefined, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid date' : '', label: '-', labelHidden: true }, void 0))] }, void 0)), (fieldType === 'DATE_ONLY' || fieldType === 'DATE_TIME') &&
+                (hasProp(rhs, 'relativeDate') || hasProp(rhs, 'dateFunction')) && (_jsx(Flex, { item: { grow: 1 }, children: _jsx(TimePeriodComp, { rhs: rhs, fieldType: fieldType, onChange: onChange, dateFunctionsList: dateFunctions ? dateFunctions[fieldType] : [], status: showError ? 'error' : undefined }, void 0) }, void 0)), hasProp(rhs, 'values') && (_jsxs(Flex, { item: { grow: 1 }, children: [useValueSelector && (_jsx(MultiValueSelector, { values: rhs.values, options: possibleValues, onChange: handleValueSelection, status: showError ? 'error' : undefined }, void 0)), !useValueSelector && (_jsx(Input, { value: csvInput, onChange: handleCSVChange, status: showError ? 'error' : undefined, info: showError ? 'Invalid values' : undefined, label: '-', labelHidden: true, placeholder: 'Enter comma separated values' // FIXME: TR
+                     }, void 0))] }, void 0))] }, void 0));
 };
 export default RhsControls;
-//# sourceMappingURL=RhsControls.js.map
+//# sourceMappingURL=index.js.map

package/lib/components/ConditionBuilder/RhsControls/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, ChangeEvent, useState, useEffect, useMemo } from 'react';\n\nimport {\n DateInput,\n DateTimeInput,\n Flex,\n Input,\n Select,\n Option,\n hasProp,\n BaseProps,\n ForwardProps\n} from '@pega/cosmos-react-core';\nimport type { DateTimeCallbackParameter } from '@pega/cosmos-react-core/lib/components/DateTime/DateTime.types';\n\nimport { FieldType, Comparator, RHSType } from '../core/types';\nimport { LeafCondition, Field, DateFunctionsByType } from '../ConditionBuilder.types';\nimport { convertTimeValueToMs, convertMsToTimeValue } from '../core/time-utils';\n\nimport MultiValueSelector from './MultiValueSelector';\nimport FieldSelector from './FieldSelector';\nimport RhsModeSwitch from './RhsModeSwitch';\nimport TimePeriodInput from './TimePeriodInput';\nimport TimePeriodMenu from './TimePeriodMenu';\nimport NumericInput from './NumericInput';\n\n/**\n * Verifies if the condition has all valid values.\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 * - Also, this does not try to validate if the given `rhs` matches the `lhs`/`comparator`/`validRhsTypes`. Instead, it assumes that the appropriate LHS/Comparator/validRhsTypes must have been already in place for this rhs to be generated.\n */\nexport function isValidRhs(\n rhs: LeafCondition['rhs'],\n fieldType?: FieldType,\n trimValues: boolean = false\n): boolean {\n // RHS would be `undefined` when no RHS is needed. Treat it as a valid value\n if (rhs === undefined) {\n return true;\n }\n\n // Field-selector on the RHS\n if (hasProp(rhs, 'field')) {\n // RHS is invalid if no field is selected\n return rhs.field !== '';\n }\n\n // List-input cases\n if (hasProp(rhs, 'values')) {\n // RHS is invalid if the list is empty\n if (rhs.values.length === 0) {\n return false;\n }\n // For numeric fields, RHS is invalid if any NaN values are present in the list\n if (fieldType === 'NUMBER' && (rhs.values as number[]).some(v => Number.isNaN(v))) {\n return false;\n }\n }\n\n if (hasProp(rhs, 'value')) {\n // Identify any invalid numbers (e.g. when `-` is entered)\n if (typeof rhs.value === 'number') {\n return !Number.isNaN(rhs.value);\n }\n\n // NOTE: Not trimming the value in the change-handler so that users can freely type spaces between words\n if (trimValues) {\n rhs.value = rhs.value.trim();\n }\n\n // Can be empty on init and on clearing the value\n if (rhs.value.trim() === '') {\n return false;\n }\n\n // This check is needed to eliminate invalid dates like `Feb 31` (02/31/2020), which the input allows\n if (\n (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY') &&\n Number.isNaN(new Date(rhs.value).getTime())\n ) {\n return false;\n }\n }\n\n if (\n hasProp(rhs, 'relativeDate') &&\n ((rhs.relativeDate.timePeriod === 'CURRENT' && rhs.relativeDate.interval) ||\n (rhs.relativeDate.timePeriod !== 'CURRENT' &&\n (!rhs.relativeDate.interval || rhs.relativeDate.interval <= 0)))\n ) {\n return false;\n }\n\n return true;\n}\n\n/** For a condition with the given comparator and lhs-field-type, determines an appropriate default value for the Rhs */\nexport function getDefaultRhs(\n fieldType: FieldType,\n comparator: Comparator,\n validRhsTypes: Set<RHSType>,\n dateFunctions?: DateFunctionsByType\n): LeafCondition['rhs'] {\n switch (comparator) {\n case 'IS_TRUE':\n case 'IS_FALSE':\n case 'IS_NULL':\n case 'IS_NOT_NULL':\n return undefined; // These comparators do not have an Rhs\n\n case 'IN':\n case 'NOT_IN':\n return { values: [] };\n\n default: {\n if (fieldType === 'BOOLEAN' && (comparator === 'EQ' || comparator === 'NEQ')) {\n // For booleans, these comparators can only be used for comparing with other fields\n return { field: '' };\n }\n\n if (validRhsTypes.has('LITERAL')) return { value: '' };\n if (\n validRhsTypes.has('DATE_FUNCTION') &&\n dateFunctions &&\n (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY')\n )\n return { value: '', dateFunction: dateFunctions[fieldType][0] };\n\n if (\n validRhsTypes.has('RELATIVE_DATE') &&\n (fieldType === 'DATE_TIME' || fieldType === 'DATE_ONLY')\n ) {\n return {\n relativeDate: {\n timePeriod: 'CURRENT',\n datePart: 'DAYS'\n }\n };\n }\n\n return { field: '' };\n }\n }\n}\n\n// Truncates output values from DateInput/DateTimeInput to return a wall time on the RHS\n// NOTE: This assumes that the input date is set up on the UTC timezone\nfunction truncateISODateString(dateString: string, fieldType: FieldType): string {\n const date = new Date(dateString);\n const YYYY = date.getUTCFullYear().toString().padStart(4, '0');\n const MM = (date.getUTCMonth() + 1).toString().padStart(2, '0');\n const DD = date.getUTCDate().toString().padStart(2, '0');\n\n // For DATE_ONLY fields, returning a YYYY-MM-DD format as per spec\n if (fieldType === 'DATE_ONLY') return `${YYYY}-${MM}-${DD}`;\n\n const hh = date.getUTCHours().toString().padStart(2, '0');\n const mm = date.getUTCMinutes().toString().padStart(2, '0');\n\n // cspell:disable-next-line\n // For DATE_TIME fields, returning a YYYY-MM-DDTHH:mm format and discarding the time-zone etc. to be consistent with the previous spec which was returning a wall time\n return `${YYYY}-${MM}-${DD}T${hh}:${mm}`;\n}\n\n/** Type definition for the input props of RhsControls */\ninterface RhsControlProps extends BaseProps {\n /** Lhs for the condition */\n lhs: LeafCondition['lhs'];\n\n /** Comparator for the condition */\n comparator: Comparator;\n\n /** Rhs for the condition */\n rhs: LeafCondition['rhs'];\n\n /** Metadata (data-model) for the Fields to use in the RHS field-selector */\n fields: Field[];\n\n /** Callback for any modifications to the Rhs */\n onChange: (rhs: LeafCondition['rhs']) => void;\n\n /** Used to enable inline error indicators on invalid inputs */\n indicateErrors: boolean;\n\n /** Item flow direction */\n itemDirection: 'row' | 'column';\n\n /** Restricts RHS values to only specified RHS types */\n validRhsTypes: Set<RHSType>;\n\n /** Passed to enable additional date controls on the RHS, when a DATE_TIME/DATE_ONLY field is selected on the LHS */\n dateFunctions?: DateFunctionsByType;\n}\n\n/** A controlled component for controls on a Condition's RHS */\nconst RhsControls: FunctionComponent<RhsControlProps & ForwardProps> = (props: RhsControlProps) => {\n const {\n lhs,\n comparator,\n rhs,\n fields,\n onChange,\n indicateErrors,\n itemDirection,\n validRhsTypes,\n dateFunctions\n } = props;\n\n // Find the field corresponding to the LHS\n const matchingField = fields.find(f => f.name === lhs.field);\n\n // Options for the Field-selector (if applicable)\n const fieldOptions = useMemo(() => {\n if (!matchingField) return [];\n // Show all other fields of the same data type as the LHS\n return fields.filter(f => f.type === matchingField.type && f.name !== lhs.field);\n }, [fields, lhs]);\n\n // Set up a CSV input for IN/NOT_IN comparators\n const [csvInput, setCsvInput] = useState(\n rhs && hasProp(rhs, 'values') ? rhs.values.join(', ') : ''\n );\n useEffect(() => {\n // If moving away from the CSV-mode, clear the CSV Input.\n // This ensures that if a different `rhs.values` is passed (a new empty array can be passed when an applicable comparator is selected), the local state matches the new input.\n if (csvInput && (!rhs || !hasProp(rhs, 'values'))) {\n setCsvInput('');\n }\n }, [rhs]);\n\n // If a field is not selected or if the comparator doesn't need any RHS, don't render anything\n if (rhs === undefined) {\n return <div />; // Rendering a placeholder div to keep the layout consistent\n }\n\n if (matchingField === undefined) {\n // For safety against any rare cases where the LHS from an input condition is not present in the input fields to the ConditionBuilder\n // In those cases, don't render an RHS and wait for a valid value to be picked on LHS\n return <div />; // Rendering a placeholder div to keep the layout consistent\n }\n const fieldType = matchingField.type;\n\n // If errors should be indicated inline, validate the current rhs\n let showError = false;\n if (indicateErrors) {\n showError = !isValidRhs(rhs, fieldType, false);\n }\n\n // Set up Value-selector (if applicable)\n const { possibleValues } = matchingField; // These are passed when possible values are known ahead of time\n const isValueSelectorPossible =\n fieldType === 'TEXT' &&\n possibleValues !== undefined &&\n ['EQ', 'NEQ', 'IN', 'NOT_IN'].includes(comparator); // A ValueSelector in single/multiple mode is possible when these criteria are met\n const useValueSelector = isValueSelectorPossible && !hasProp(rhs, 'field'); // Use the ValueSelector component if it is applicable and if not in ANOTHER_FIELD mode\n\n // Handle changes from the Value-selector\n const handleValueSelection = (selection: string | string[]) => {\n if (typeof selection === 'string') {\n onChange({ value: selection }); // Submit a new RHS\n } else {\n onChange({ values: selection }); // Submit a new RHS\n }\n };\n\n // Handle changes from the Field-selector\n const handleFieldChange = (id: string) => {\n onChange({ field: id }); // Submit a new RHS\n };\n\n // Handle changes from a Value-input\n const handleValueChange = (e: ChangeEvent<HTMLInputElement>) => {\n // NOTE: Not trimming the value here so that users can freely type spaces between words. Trimming is done on Submit, via the isValidRhs call\n onChange({ value: e.target.value }); // Submit a new RHS\n };\n\n // Handle changes from a Time-input\n const handleTimeValueChange = (e: ChangeEvent<HTMLInputElement>) => {\n let newValue = e.target.value;\n if (newValue.length === 5) {\n newValue += ':00'; // Enforce a fixed hh:mm:ss format\n }\n onChange({ value: convertTimeValueToMs(newValue) }); // Submit a new RHS\n };\n\n // Handle changes from a DateInput\n const handleDateValueChange = ({\n valueAsISOString,\n valueAsTimestamp,\n state\n }: DateTimeCallbackParameter) => {\n // NOTE: Not relying fully on `state` since in some cases state and valueAsTimestamp as both undefined\n if (valueAsTimestamp === undefined || state === 'incomplete' || state === 'invalid') return;\n\n const truncatedValue = truncateISODateString(valueAsISOString, fieldType); // Truncate to return a wall time as per spec\n onChange({ value: truncatedValue });\n };\n\n // Handle changes from a CSV-input\n const handleCSVChange = (e: ChangeEvent<HTMLInputElement>) => {\n // Update the controlled input\n setCsvInput(e.target.value);\n\n // Submit a new RHS\n let newValues: string[] | number[] = e.target.value\n .split(',')\n .map(v => v.trim())\n .filter(v => v.length > 0); // Ignore empty strings\n if (fieldType === 'NUMBER') {\n newValues = newValues.map(v => Number(v)); // This can set up some NaN values. Those are used to show an appropriate feedback when the submit button is hit\n }\n onChange({ values: newValues });\n };\n\n // Render the menu directly if in a vertical layout\n const TimePeriodComp = itemDirection === 'column' ? TimePeriodMenu : TimePeriodInput;\n\n return (\n <Flex\n container={{\n direction: itemDirection,\n alignItems: itemDirection === 'column' ? 'stretch' : 'start',\n justify: 'between',\n gap: 0.5\n }}\n >\n {/* Gear MenuButton */}\n <RhsModeSwitch\n fieldType={fieldType}\n comparator={comparator}\n rhs={rhs}\n onChange={onChange}\n mode={itemDirection === 'column' ? 'combo-box' : 'menu-button'}\n validRhsTypes={validRhsTypes}\n dateFunctions={dateFunctions}\n />\n\n {/* Field-selector */}\n {hasProp(rhs, 'field') && (\n <Flex item={{ grow: 1 }}>\n <FieldSelector\n value={rhs.field}\n onChange={handleFieldChange}\n fields={fieldOptions}\n status={showError ? 'error' : undefined}\n info={showError ? 'No selection' : undefined} // FIXME: TR\n />\n </Flex>\n )}\n\n {/* Value input */}\n {hasProp(rhs, 'value') && !hasProp(rhs, 'dateFunction') && (\n <Flex item={{ grow: 1 }}>\n {fieldType === 'TEXT' && useValueSelector && (\n <Select\n value={rhs.value as string}\n onChange={(e: ChangeEvent<HTMLSelectElement>) => handleValueSelection(e.target.value)}\n status={showError ? 'error' : undefined}\n info={showError ? 'No selection' : undefined} // FIXME: TR\n label='-'\n labelHidden\n >\n <Option value=''>Select value</Option>\n {possibleValues!.map(value => (\n <Option key={value} value={value}>\n {value}\n </Option>\n ))}\n </Select>\n )}\n {fieldType === 'TEXT' && !useValueSelector && (\n <Input\n value={rhs.value as string}\n onChange={handleValueChange}\n status={showError ? 'error' : undefined}\n info={showError ? 'Empty value' : undefined} // FIXME: TR\n name='rhs-text-literal-input'\n label='-'\n labelHidden\n />\n )}\n {fieldType === 'NUMBER' && (\n <NumericInput rhs={rhs} onChange={onChange} status={showError ? 'error' : undefined} />\n )}\n {fieldType === 'TIME_ONLY' && (\n <Input\n type='time'\n step='1'\n value={typeof rhs.value === 'string' ? rhs.value : convertMsToTimeValue(rhs.value)}\n onChange={handleTimeValueChange}\n status={showError ? 'error' : undefined}\n info={showError ? 'Invalid time' : undefined} // FIXME: TR\n label='-'\n labelHidden\n />\n )}\n {fieldType === 'DATE_ONLY' && (\n <DateInput\n value={rhs.value}\n onChange={handleDateValueChange}\n status={showError ? 'error' : undefined}\n info={showError ? 'Invalid date' : ''} // FIXME: TR , NOTE: Using empty quotes to disable the default info which indicates the format\n label='-'\n labelHidden\n />\n )}\n {fieldType === 'DATE_TIME' && (\n <DateTimeInput\n value={rhs.value !== '' ? rhs.value : undefined}\n onChange={handleDateValueChange}\n status={showError ? 'error' : undefined}\n info={showError ? 'Invalid date' : ''} // FIXME: TR , NOTE: Using empty quotes to disable the default info which indicates the format\n label='-'\n labelHidden\n />\n )}\n </Flex>\n )}\n\n {(fieldType === 'DATE_ONLY' || fieldType === 'DATE_TIME') &&\n (hasProp(rhs, 'relativeDate') || hasProp(rhs, 'dateFunction')) && (\n <Flex item={{ grow: 1 }}>\n <TimePeriodComp\n rhs={rhs}\n fieldType={fieldType}\n onChange={onChange}\n dateFunctionsList={dateFunctions ? dateFunctions[fieldType] : []}\n status={showError ? 'error' : undefined}\n />\n </Flex>\n )}\n\n {/* Multiple-values input */}\n {hasProp(rhs, 'values') && (\n <Flex item={{ grow: 1 }}>\n {useValueSelector && (\n <MultiValueSelector\n values={rhs.values as string[]}\n options={possibleValues!}\n onChange={handleValueSelection}\n status={showError ? 'error' : undefined}\n />\n )}\n {!useValueSelector && (\n <Input\n value={csvInput}\n onChange={handleCSVChange}\n status={showError ? 'error' : undefined}\n info={showError ? 'Invalid values' : undefined} // FIXME: TR\n label='-'\n labelHidden\n placeholder='Enter comma separated values' // FIXME: TR\n />\n )}\n </Flex>\n )}\n </Flex>\n );\n};\nexport default RhsControls;\n"]}

package/lib/components/ConditionBuilder/core/evaluator.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"evaluator.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/core/evaluator.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAiB,KAAK,EAAuB,MAAM,2BAA2B,CAAC;~~AA+NjG~~;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE;IAAE,CAAC,SAAS,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAClC,MAAM,EAAE,KAAK,EAAE,GACd,OAAO,~~CAkBT~~"}
1	+ {"version":3,"file":"evaluator.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/core/evaluator.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAiB,KAAK,EAAuB,MAAM,2BAA2B,CAAC;AAyQjG;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE;IAAE,CAAC,SAAS,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,EAClC,MAAM,EAAE,KAAK,EAAE,GACd,OAAO,CAoBT"}

package/lib/components/ConditionBuilder/core/evaluator.js CHANGED Viewed

@@ -1,5 +1,7 @@
-// cspell:ignore words YYYYMM, YYYYMMDD, YYYYMMDDHH
+// cspell:ignore words YYYYQQ, YYYYMM, YYYYMMDD, YYYYMMDDHH
 import { hasProp } from '@pega/cosmos-react-core';
+import transformComplexCondition from './transformer';
+const QUOTE = '"';
 /** Evaluates leaf conditions with BOOLEAN fields */
 function evaluateBoolCondition(lhsValue, comparator, rhsValue // undefined for IS_TRUE/IS_FALSE comparators
 ) {
@@ -21,10 +23,24 @@ function evaluateTextCondition(lhsValue, comparator, rhsValue) {
     lhsValue = lhsValue.toLowerCase(); // Converting to lowerCase to perform case-insensitive comparisons
     // For IN/NOT_IN comparators, the rhsValue is of type `string[]`
     if (Array.isArray(rhsValue)) {
-        const lhsInRhs = rhsValue.map(v => v.toLowerCase()).includes(lhsValue); // Converting to lowerCase to perform case-insensitive comparisons
+        const lhsInRhs = rhsValue
+            .map(v => {
+            v = v.toLowerCase().trim();
+            // Handle text in quotes
+            if (v.startsWith(QUOTE) && v.endsWith(QUOTE)) {
+                v = v.slice(1, -1);
+            }
+            return v;
+        })
+            .includes(lhsValue); // Converting to lowerCase to perform case-insensitive comparisons
         return comparator === 'IN' ? lhsInRhs : !lhsInRhs; // Handling IN/NOT_IN comparators
     }
-    rhsValue = rhsValue.toLowerCase(); // Converting to lowerCase to perform case-insensitive comparisons
+    // Converting to lowerCase to perform case-insensitive comparisons
+    rhsValue = rhsValue.toLowerCase().trim();
+    // Handle if rhs is in quotes
+    if (rhsValue.startsWith(QUOTE) && rhsValue.endsWith(QUOTE)) {
+        rhsValue = rhsValue.slice(1, -1);
+    }
     switch (comparator) {
         case 'EQ':
             return lhsValue === rhsValue;
@@ -74,6 +90,7 @@ function evaluateNumericCondition(lhsValue, comparator, rhsValue) {
 function getDateParts(date) {
     return {
         YYYY: date.getFullYear().toString().padStart(4, '0'),
+        QQ: (3 * Math.floor(date.getMonth() / 3) + 1).toString().padStart(2, '0'),
         MM: (date.getMonth() + 1).toString().padStart(2, '0'),
         DD: date.getDate().toString().padStart(2, '0'),
         HH: date.getHours().toString().padStart(2, '0')
@@ -84,12 +101,21 @@ function evaluateDateFuncCondition(lhsValue, fieldType, comparator, rhs) {
     if (fieldType === 'DATE_ONLY')
         lhsValue += 'T00:00:00'; // `T00:00:00` is needed for the `Date()` constructor to treat it as local (not UTC)
     const lhsDateObj = new Date(lhsValue);
-    const { YYYY: lhsYYYY, MM: lhsMM, DD: lhsDD, HH: lhsHH } = getDateParts(lhsDateObj);
+    const { YYYY: lhsYYYY, QQ: lhsQQ, MM: lhsMM, DD: lhsDD, HH: lhsHH } = getDateParts(lhsDateObj);
     // Determine a numeric representation of the values for the given date function
     let lhsNumVal = 0;
     let rhsNumVal = 0;
     switch (rhs.dateFunction) {
-        // TODO: Enable YEARS/QUARTERS/MONTHS_OF_YEAR
+        case 'YEARS':
+            // Using YYYY as a number
+            lhsNumVal = Number(lhsYYYY);
+            rhsNumVal = Number(rhs.value.slice(0, 4));
+            break;
+        case 'QUARTERS':
+            // Using YYYYQQ as a number
+            lhsNumVal = Number(`${lhsYYYY}${lhsQQ}`);
+            rhsNumVal = Number(rhs.value.replace(/-/g, '').slice(0, 6));
+            break;
         case 'MONTHS':
             // Using YYYYMM as a number
             lhsNumVal = Number(`${lhsYYYY}${lhsMM}`);
@@ -116,6 +142,10 @@ function evaluateDateFuncCondition(lhsValue, fieldType, comparator, rhs) {
             lhsNumVal = Number(`${lhsYYYY}${lhsMM}${lhsDD}${lhsHH}`);
             rhsNumVal = Number(rhs.value.replace(/-|T/g, '').slice(0, 10));
             break;
+        case 'MONTHS_OF_YEAR':
+            lhsNumVal = Number(lhsMM);
+            rhsNumVal = rhs.value;
+            break;
         case 'DAYS_OF_MONTH':
             lhsNumVal = Number(lhsDD);
             rhsNumVal = rhs.value;
@@ -144,6 +174,9 @@ function evaluateLeafCondition(leaf, data, fields) {
             else if (hasProp(rhs, 'value')) {
                 rhsValue = rhs.value; // If RHS is a single value
             }
+            else if (hasProp(rhs, 'relativeDate')) {
+                rhsValue = true; // TODO: When we transform relative dates to LT/GT statements, we won't need this.
+            }
             else {
                 rhsValue = rhs.values; // If RHS is a list of values
             }
@@ -174,6 +207,9 @@ function evaluateLeafCondition(leaf, data, fields) {
                 if (rhs && hasProp(rhs, 'dateFunction')) {
                     return evaluateDateFuncCondition(lhsValue, field.type, comparator, rhs);
                 }
+                if (rhs && hasProp(rhs, 'relativeDate')) {
+                    return true; // TODO: When we transform relative dates to LT/GT statements, we won't need this.
+                }
                 // Both the values are expected to be in an ISO-8601 format
                 const lhsAsTicks = new Date(lhsValue).getTime();
                 const rhsAsTicks = new Date(rhsValue).getTime();
@@ -199,18 +235,20 @@ function evaluateLeafCondition(leaf, data, fields) {
 export default function evaluateCondition(condition, data, fields) {
     // For safety against any malformed trees
     try {
-        if (hasProp(condition, 'AND')) {
+        // Update relative date conditions to be LT/GT date range conditions
+        const updatedCondition = transformComplexCondition(condition, fields);
+        if (hasProp(updatedCondition, 'AND')) {
             // Return true if all the child nodes are true
-            return condition.AND.every(child => evaluateCondition(child, data, fields));
+            return updatedCondition.AND.every(child => evaluateCondition(child, data, fields));
         }
-        if (hasProp(condition, 'OR')) {
+        if (hasProp(updatedCondition, 'OR')) {
             // Return true if any one of the child nodes is true
-            return condition.OR.some(child => evaluateCondition(child, data, fields));
+            return updatedCondition.OR.some(child => evaluateCondition(child, data, fields));
         }
-        if (hasProp(condition, 'NOT')) {
-            return !evaluateCondition(condition.NOT, data, fields);
+        if (hasProp(updatedCondition, 'NOT')) {
+            return !evaluateCondition(updatedCondition.NOT, data, fields);
         }
-        return evaluateLeafCondition(condition.condition, data, fields);
+        return evaluateLeafCondition(updatedCondition.condition, data, fields);
     }
     catch {
         return false;