@pega/cosmos-react-demos 5.0.0-dev.1.0 → 5.0.0-dev.10.1

package/jsx/build/ExpressionBuilder/ExpressionBuilder.stories.jsx

@@ -1,344 +0,0 @@
-import { action } from '@storybook/addon-actions';
-import { useState, useEffect, useRef, useMemo } from 'react';
-import { ExpressionBuilder, ExpressionItem, ExpressionList, ExpressionDetails, CodeEditor } from '@pega/cosmos-react-build';
-import ExpressionBuilderContext from '@pega/cosmos-react-build/lib/components/ExpressionBuilder/ExpressionBuilderContext';
-import { BuildTheme, Configuration, createUID, debounce, Input } from '@pega/cosmos-react-core';
-import { errors, getFilterRegex, items, primaryDetails, StyledExpressionBuilderDemo, suggestedFields, suggestedRuleType, getSuggestedFunction, getScopeFromPosition } from './ExpressionBuilder.mocks';
-export default {
-    title: 'Build/ExpressionBuilder',
-    component: ExpressionBuilder
-};
-export const ExpressionItemDemo = (args) => {
-    const [expanded, setExpanded] = useState(false);
-    const onAdd = (id) => {
-        action(`${id} clicked`);
-    };
-    const onExpand = (id) => {
-        setExpanded(true);
-        action(`${id} expanded`);
-    };
-    const onCollapse = (id) => {
-        setExpanded(false);
-        action(`${id} collapsed`);
-    };
-    const handleChange = (id, field, value) => {
-        action('Input param change')(id, field, value);
-    };
-    const ctx = useMemo(() => ({ accent: args.accent }), [args.accent]);
-    return (<ExpressionBuilderContext.Provider value={ctx}>
-      <ExpressionItem id={createUID()} primary='Loan to value validation' type='Decision' onAdd={onAdd} onExpand={onExpand} onCollapse={onCollapse} expanded={expanded} matchedField={args.matchedField} details={{
-            primary: primaryDetails,
-            outputParams: [
-                {
-                    id: 'type',
-                    name: 'Type',
-                    value: 'Text'
-                }
-            ],
-            inputParams: [
-                {
-                    id: 'firstParam',
-                    renderer: Input,
-                    rendererProps: {
-                        onChange: (e) => handleChange('Test Expression Id', 'Test Input Field', e.target.value),
-                        label: 'Test Input'
-                    }
-                },
-                {
-                    id: 'secondParam',
-                    renderer: Input,
-                    rendererProps: {
-                        onChange: (e) => handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),
-                        label: 'Test Input2'
-                    }
-                }
-            ]
-        }}/>
-    </ExpressionBuilderContext.Provider>);
-};
-export const ExpressionDetailsDemo = () => {
-    const handleChange = (id, field, value) => {
-        action('Input param change')(id, field, value);
-    };
-    return (<ExpressionDetails primary={primaryDetails} outputParams={[
-            {
-                id: 'type',
-                name: 'Type',
-                value: 'Text'
-            }
-        ]} inputParams={[
-            {
-                id: 'firstParam',
-                renderer: Input,
-                rendererProps: {
-                    onChange: (e) => handleChange('Test Expression Id', 'Test Input Field', e.target.value),
-                    label: 'Test Input'
-                }
-            },
-            {
-                id: 'secondParam',
-                renderer: Input,
-                rendererProps: {
-                    onChange: (e) => handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),
-                    label: 'Test Input2'
-                }
-            }
-        ]}/>);
-};
-export const ExpressionListDemo = () => {
-    const [expressionDetails, setExpressionDetails] = useState({});
-    const onInputParamChange = (id, field, value) => {
-        action('Input param change')(id, field, value);
-    };
-    const onItemExpand = (id) => {
-        action('onItemExpand')(id);
-        const itemDetails = items.find(item => item.id === id)?.details;
-        const fieldValueMapper = ({ field, value }) => {
-            return {
-                id: `${id}-${field}`,
-                name: field,
-                value
-            };
-        };
-        if (itemDetails) {
-            const primary = itemDetails.primary.map(fieldValueMapper);
-            const outputParams = itemDetails.output?.map(fieldValueMapper);
-            const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {
-                const inputParam = {
-                    id: `${id}-${fieldId}`,
-                    renderer: Input,
-                    rendererProps: {
-                        label: field,
-                        onChange: (e) => onInputParamChange(id, fieldId, e.target.value),
-                        type: type
-                    }
-                };
-                return inputParam;
-            });
-            setExpressionDetails(prev => {
-                return {
-                    ...prev,
-                    [id]: {
-                        primary,
-                        outputParams,
-                        inputParams
-                    }
-                };
-            });
-        }
-    };
-    const onItemCollapse = (id) => {
-        action('onItemCollapse')(id);
-        setTimeout(() => {
-            setExpressionDetails(prev => {
-                const newExpressionDetails = { ...prev };
-                delete newExpressionDetails[id];
-                return newExpressionDetails;
-            });
-        }, 500);
-    };
-    return (<ExpressionList items={items} onItemAdd={action('onItemAdd')} onItemExpand={onItemExpand} onItemCollapse={onItemCollapse} details={expressionDetails}/>);
-};
-export const ExpressionBuilderDemo = (args) => {
-    const [searchValue, setSearchValue] = useState('');
-    const [searchFilter, setSearchFilter] = useState('');
-    const [expressionItems, setExpressionItems] = useState(items);
-    const [loading, setLoading] = useState(false);
-    const handle = useRef(null);
-    const [validationErrors, setErrors] = useState('');
-    const [expressionDetails, setExpressionDetails] = useState({});
-    const [expressionDetailsValues, setExpressionDetailsValues] = useState({});
-    const filterRegex = useMemo(() => getFilterRegex(searchValue), [searchValue]);
-    const detailsFilter = (location, filterValue) => location.find(field => field.value.toLowerCase().includes(filterValue));
-    useEffect(() => {
-        const lowerSearchFilter = searchFilter.toLowerCase();
-        const lowerSearchValue = searchValue.toLowerCase();
-        const filteredItems = items.filter(item => {
-            return (item.type.toLowerCase().includes(lowerSearchFilter === 'all' ? '' : lowerSearchFilter) &&
-                (item.primary.toLowerCase().includes(lowerSearchValue) ||
-                    detailsFilter(item.details.primary, lowerSearchValue) ||
-                    detailsFilter(item.details.output, lowerSearchValue)));
-        });
-        const matchedItems = filteredItems.map(item => {
-            if (item.primary.toLowerCase().includes(lowerSearchValue))
-                return item;
-            let matchedField;
-            const primaryField = detailsFilter(item.details.primary, lowerSearchValue);
-            if (primaryField)
-                matchedField = primaryField;
-            const outputField = detailsFilter(item.details.output, lowerSearchValue);
-            if (outputField && !primaryField)
-                matchedField = outputField;
-            return {
-                ...item,
-                matchedField: { name: matchedField?.field, value: matchedField?.value }
-            };
-        });
-        setExpressionItems(matchedItems);
-    }, [searchValue, searchFilter]);
-    const onItemAdd = (id, addExpression) => {
-        const item = items.find(instance => instance.id === id);
-        if (!item)
-            return;
-        if (item.type.toLowerCase() === 'field') {
-            addExpression(item.expression);
-        }
-        else {
-            addExpression(`${item.expression.slice(0, item.expression.length - 1)}${expressionDetailsValues[item.id]
-                ? Object.keys(expressionDetailsValues[item.id])
-                    .map(field => `${expressionDetailsValues[item.id][field]}`)
-                    .join(', ')
-                : ''})`);
-        }
-    };
-    const onInputParamChange = (id, field, value) => {
-        action('Input param change')(id, field, value);
-        setExpressionDetailsValues(prev => {
-            return {
-                ...prev,
-                [id]: { ...prev[id], [field]: value }
-            };
-        });
-    };
-    const onItemExpand = (id) => {
-        action('onItemExpand')(id);
-        const itemDetails = expressionItems.find(item => item.id === id)?.details;
-        const fieldValueMapper = ({ field, value }) => {
-            return {
-                id: `${id}-${field}`,
-                name: field,
-                value
-            };
-        };
-        if (itemDetails) {
-            const primary = itemDetails.primary.map(fieldValueMapper);
-            const outputParams = itemDetails.output?.map(fieldValueMapper);
-            const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {
-                const inputParam = {
-                    id: `${id}-${fieldId}`,
-                    renderer: Input,
-                    rendererProps: {
-                        label: field,
-                        onChange: (e) => onInputParamChange(id, fieldId, e.target.value),
-                        type: type
-                    }
-                };
-                return inputParam;
-            });
-            setExpressionDetails(prev => {
-                return {
-                    ...prev,
-                    [id]: {
-                        primary,
-                        outputParams,
-                        inputParams
-                    }
-                };
-            });
-        }
-    };
-    const onItemCollapse = (id) => {
-        action('onItemCollapse')(id);
-        setTimeout(() => {
-            setExpressionDetails(prev => {
-                const newExpressionDetails = { ...prev };
-                delete newExpressionDetails[id];
-                return newExpressionDetails;
-            });
-        }, 500);
-        setExpressionDetailsValues(prev => {
-            const newValues = { ...prev };
-            delete newValues[id];
-            return newValues;
-        });
-    };
-    const fetchSuggestions = (autoCompleteTrigger, cursorPosition) => {
-        action('cursorPosition')(cursorPosition);
-        if (autoCompleteTrigger === '@') {
-            setLoading(true);
-            return new Promise(resolve => {
-                setTimeout(() => {
-                    setLoading(false);
-                    resolve(suggestedRuleType);
-                }, 1000);
-            });
-        }
-        if (autoCompleteTrigger === ':') {
-            const scope = getScopeFromPosition(cursorPosition, autoCompleteTrigger, handle.current?.getExpression() ?? '').split('@')[0];
-            const suggestedFunctions = getSuggestedFunction(scope);
-            setLoading(true);
-            return new Promise(resolve => {
-                setTimeout(() => {
-                    setLoading(false);
-                    resolve(suggestedFunctions);
-                }, 1000);
-            });
-        }
-        setLoading(true);
-        return new Promise(resolve => {
-            setTimeout(() => {
-                setLoading(false);
-                resolve(suggestedFields);
-            }, 1000);
-        });
-    };
-    const debouncedHandler = useRef(debounce(expression => {
-        if (expression.includes('undefined'))
-            setErrors('Correct the invalid expression, expression cannot contain "undefined" ');
-        else
-            setErrors('');
-    }, 600)).current;
-    return (<StyledExpressionBuilderDemo>
-      <ExpressionBuilder list={{
-            items: expressionItems,
-            onItemAdd: args.onItemAdd || onItemAdd,
-            onItemExpand: args.onItemExpand || onItemExpand,
-            onItemCollapse: args.onItemCollapse || onItemCollapse,
-            details: expressionDetails
-        }} search={{
-            filters: ['Field', 'Function', 'Decision', 'When'],
-            onFilterChange: args.onFilterChange
-                ? args.onFilterChange
-                : value => setSearchFilter(value),
-            onSearchChange: args.onSearchChange
-                ? args.onSearchChange
-                : value => setSearchValue(value),
-            value: searchValue,
-            accent: filterRegex
-        }} onChange={debouncedHandler} errors={validationErrors && !args.readOnly ? validationErrors : undefined} readOnly={args.readOnly} defaultValue={args.defaultValue === undefined ? 'Math@Function:max(param1,param2)' : args.defaultValue} handle={args.handle || handle} fetchSuggestions={fetchSuggestions} loading={loading}/>
-    </StyledExpressionBuilderDemo>);
-};
-ExpressionBuilderDemo.args = {
-    readOnly: false
-};
-ExpressionBuilderDemo.argTypes = {
-    readOnly: { control: { type: 'boolean' } }
-};
-export const CodeEditorDemo = (args) => {
-    const codeEditorHandle = useRef(null);
-    const [loading, setLoading] = useState(false);
-    const fetchSuggestions = () => {
-        setLoading(true);
-        return new Promise(resolve => {
-            setTimeout(() => {
-                setLoading(false);
-                resolve(suggestedFields);
-            }, 1000);
-        });
-    };
-    return (<Configuration theme={BuildTheme}>
-      <CodeEditor fetchSuggestions={fetchSuggestions} autoCompleteTriggers={['.', '@']} editorConfigProps={{
-            mode: 'expression',
-            readOnly: args.readOnly
-        }} codeEditorHandle={codeEditorHandle} defaultValue='Math@Function:max(param1,param2)' loading={loading} errors={args.showErrors && !args.readOnly ? errors : undefined} readOnly={args.readOnly}/>
-    </Configuration>);
-};
-CodeEditorDemo.args = {
-    showErrors: false,
-    readOnly: false
-};
-CodeEditorDemo.argTypes = {
-    showErrors: { control: { type: 'boolean' } },
-    readOnly: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=ExpressionBuilder.stories.jsx.map

package/jsx/build/ExpressionBuilder/ExpressionBuilder.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"ExpressionBuilder.stories.jsx","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\nimport { useState, useEffect, useRef, useMemo } from 'react';\nimport type { ChangeEvent } from 'react';\n\nimport {\n  ExpressionBuilder,\n  ExpressionItem,\n  ExpressionList,\n  ExpressionDetails,\n  CodeEditor\n} from '@pega/cosmos-react-build';\nimport type {\n  ExpressionItemProps,\n  ExpressionBuilderProps,\n  HandleValue,\n  InputParams,\n  EditorState\n} from '@pega/cosmos-react-build';\nimport ExpressionBuilderContext from '@pega/cosmos-react-build/lib/components/ExpressionBuilder/ExpressionBuilderContext';\nimport { BuildTheme, Configuration, createUID, debounce, Input } from '@pega/cosmos-react-core';\nimport type { ForwardProps, InputProps } from '@pega/cosmos-react-core';\n\nimport {\n  errors,\n  getFilterRegex,\n  items,\n  primaryDetails,\n  StyledExpressionBuilderDemo,\n  suggestedFields,\n  suggestedRuleType,\n  getSuggestedFunction,\n  getScopeFromPosition\n} from './ExpressionBuilder.mocks';\n\nexport default {\n  title: 'Build/ExpressionBuilder',\n  component: ExpressionBuilder\n} as Meta;\n\ninterface ExpressionItemDemoProps {\n  accent?: ExpressionBuilderProps['search']['accent'];\n  matchedField?: ExpressionItemProps['matchedField'];\n}\n\nexport const ExpressionItemDemo: StoryFn<ExpressionItemDemoProps> = (\n  args: ExpressionItemDemoProps\n) => {\n  const [expanded, setExpanded] = useState<ExpressionItemProps['expanded']>(false);\n  const onAdd = (id: ExpressionItemProps['id']) => {\n    action(`${id} clicked`);\n  };\n\n  const onExpand = (id: ExpressionItemProps['id']) => {\n    setExpanded(true);\n    action(`${id} expanded`);\n  };\n\n  const onCollapse = (id: ExpressionItemProps['id']) => {\n    setExpanded(false);\n    action(`${id} collapsed`);\n  };\n\n  const handleChange = (id: string, field: string, value: any) => {\n    action('Input param change')(id, field, value);\n  };\n\n  const ctx = useMemo(() => ({ accent: args.accent }), [args.accent]);\n\n  return (\n    <ExpressionBuilderContext.Provider value={ctx}>\n      <ExpressionItem\n        id={createUID()}\n        primary='Loan to value validation'\n        type='Decision'\n        onAdd={onAdd}\n        onExpand={onExpand}\n        onCollapse={onCollapse}\n        expanded={expanded}\n        matchedField={args.matchedField}\n        details={{\n          primary: primaryDetails,\n          outputParams: [\n            {\n              id: 'type',\n              name: 'Type',\n              value: 'Text'\n            }\n          ],\n          inputParams: [\n            {\n              id: 'firstParam',\n              renderer: Input,\n              rendererProps: {\n                onChange: (e: ChangeEvent<HTMLInputElement>) =>\n                  handleChange('Test Expression Id', 'Test Input Field', e.target.value),\n                label: 'Test Input'\n              }\n            },\n            {\n              id: 'secondParam',\n              renderer: Input,\n              rendererProps: {\n                onChange: (e: ChangeEvent<HTMLInputElement>) =>\n                  handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),\n                label: 'Test Input2'\n              }\n            }\n          ]\n        }}\n      />\n    </ExpressionBuilderContext.Provider>\n  );\n};\n\nexport const ExpressionDetailsDemo: StoryFn = () => {\n  const handleChange = (id: string, field: string, value: any) => {\n    action('Input param change')(id, field, value);\n  };\n  return (\n    <ExpressionDetails\n      primary={primaryDetails}\n      outputParams={[\n        {\n          id: 'type',\n          name: 'Type',\n          value: 'Text'\n        }\n      ]}\n      inputParams={[\n        {\n          id: 'firstParam',\n          renderer: Input,\n          rendererProps: {\n            onChange: (e: ChangeEvent<HTMLInputElement>) =>\n              handleChange('Test Expression Id', 'Test Input Field', e.target.value),\n            label: 'Test Input'\n          }\n        },\n        {\n          id: 'secondParam',\n          renderer: Input,\n          rendererProps: {\n            onChange: (e: ChangeEvent<HTMLInputElement>) =>\n              handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),\n            label: 'Test Input2'\n          }\n        }\n      ]}\n    />\n  );\n};\n\nexport const ExpressionListDemo: StoryFn = () => {\n  const [expressionDetails, setExpressionDetails] = useState<\n    ExpressionBuilderProps['list']['details']\n  >({});\n  const onInputParamChange = (id: string, field: string, value: any) => {\n    action('Input param change')(id, field, value);\n  };\n\n  const onItemExpand = (id: string) => {\n    action('onItemExpand')(id);\n    const itemDetails = items.find(item => item.id === id)?.details;\n\n    const fieldValueMapper = ({ field, value }: { field: string; value: string }) => {\n      return {\n        id: `${id}-${field}`,\n        name: field,\n        value\n      };\n    };\n\n    if (itemDetails) {\n      const primary = itemDetails.primary.map(fieldValueMapper);\n\n      const outputParams = itemDetails.output?.map(fieldValueMapper);\n\n      const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {\n        const inputParam: InputParams<InputProps & ForwardProps> = {\n          id: `${id}-${fieldId}`,\n          renderer: Input,\n          rendererProps: {\n            label: field,\n            onChange: (e: ChangeEvent<HTMLInputElement>) =>\n              onInputParamChange(id, fieldId, e.target.value),\n            type: type as InputProps['type']\n          }\n        };\n        return inputParam;\n      });\n\n      setExpressionDetails(prev => {\n        return {\n          ...prev,\n          [id]: {\n            primary,\n            outputParams,\n            inputParams\n          }\n        };\n      });\n    }\n  };\n\n  const onItemCollapse = (id: string) => {\n    action('onItemCollapse')(id);\n    setTimeout(() => {\n      setExpressionDetails(prev => {\n        const newExpressionDetails = { ...prev };\n        delete newExpressionDetails[id];\n        return newExpressionDetails;\n      });\n    }, 500);\n  };\n\n  return (\n    <ExpressionList\n      items={items}\n      onItemAdd={action('onItemAdd')}\n      onItemExpand={onItemExpand}\n      onItemCollapse={onItemCollapse}\n      details={expressionDetails}\n    />\n  );\n};\n\ninterface ExpressionBuilderStoryProps {\n  readOnly?: boolean;\n  errors?: ExpressionBuilderProps['errors'];\n  onItemAdd?: ExpressionBuilderProps['list']['onItemAdd'];\n  onItemExpand?: ExpressionBuilderProps['list']['onItemExpand'];\n  onItemCollapse?: ExpressionBuilderProps['list']['onItemCollapse'];\n  onFilterChange?: ExpressionBuilderProps['search']['onFilterChange'];\n  onSearchChange?: ExpressionBuilderProps['search']['onSearchChange'];\n  handle?: ExpressionBuilderProps['handle'];\n  defaultValue?: string;\n}\nexport const ExpressionBuilderDemo: StoryFn<ExpressionBuilderStoryProps> = (\n  args: ExpressionBuilderStoryProps\n) => {\n  const [searchValue, setSearchValue] = useState('');\n  const [searchFilter, setSearchFilter] = useState('');\n  const [expressionItems, setExpressionItems] = useState(items);\n  const [loading, setLoading] = useState(false);\n  const handle = useRef<HandleValue>(null);\n  const [validationErrors, setErrors] = useState('');\n  const [expressionDetails, setExpressionDetails] = useState<\n    ExpressionBuilderProps['list']['details']\n  >({});\n  const [expressionDetailsValues, setExpressionDetailsValues] = useState<{\n    [id: string]: {\n      [field: string]: any;\n    };\n  }>({});\n\n  const filterRegex = useMemo(() => getFilterRegex(searchValue), [searchValue]);\n\n  const detailsFilter = (location: { field: string; value: string }[], filterValue: string) =>\n    location.find(field => field.value.toLowerCase().includes(filterValue));\n\n  useEffect(() => {\n    const lowerSearchFilter = searchFilter.toLowerCase();\n    const lowerSearchValue = searchValue.toLowerCase();\n    const filteredItems = items.filter(item => {\n      return (\n        item.type.toLowerCase().includes(lowerSearchFilter === 'all' ? '' : lowerSearchFilter) &&\n        (item.primary.toLowerCase().includes(lowerSearchValue) ||\n          detailsFilter(item.details.primary, lowerSearchValue) ||\n          detailsFilter(item.details.output, lowerSearchValue))\n      );\n    });\n\n    const matchedItems = filteredItems.map(item => {\n      if (item.primary.toLowerCase().includes(lowerSearchValue)) return item;\n\n      let matchedField;\n\n      const primaryField = detailsFilter(item.details.primary, lowerSearchValue);\n      if (primaryField) matchedField = primaryField;\n\n      const outputField = detailsFilter(item.details.output, lowerSearchValue);\n      if (outputField && !primaryField) matchedField = outputField;\n\n      return {\n        ...item,\n        matchedField: { name: matchedField?.field, value: matchedField?.value }\n      };\n    });\n\n    setExpressionItems(matchedItems);\n  }, [searchValue, searchFilter]);\n\n  const onItemAdd = (\n    id: ExpressionItemProps['id'],\n    addExpression: (expression: string) => void\n  ) => {\n    const item = items.find(instance => instance.id === id);\n    if (!item) return;\n    if (item.type.toLowerCase() === 'field') {\n      addExpression(item.expression);\n    } else {\n      addExpression(\n        `${item.expression.slice(0, item.expression.length - 1)}${\n          expressionDetailsValues[item.id]\n            ? Object.keys(expressionDetailsValues[item.id])\n                .map(field => `${expressionDetailsValues[item.id][field]}`)\n                .join(', ')\n            : ''\n        })`\n      );\n    }\n  };\n\n  const onInputParamChange = (id: string, field: string, value: any) => {\n    action('Input param change')(id, field, value);\n    setExpressionDetailsValues(prev => {\n      return {\n        ...prev,\n        [id]: { ...prev[id], [field]: value }\n      };\n    });\n  };\n\n  const onItemExpand = (id: string) => {\n    action('onItemExpand')(id);\n    const itemDetails = expressionItems.find(item => item.id === id)?.details;\n\n    const fieldValueMapper = ({ field, value }: { field: string; value: string }) => {\n      return {\n        id: `${id}-${field}`,\n        name: field,\n        value\n      };\n    };\n\n    if (itemDetails) {\n      const primary = itemDetails.primary.map(fieldValueMapper);\n\n      const outputParams = itemDetails.output?.map(fieldValueMapper);\n\n      const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {\n        const inputParam: InputParams<InputProps & ForwardProps> = {\n          id: `${id}-${fieldId}`,\n          renderer: Input,\n          rendererProps: {\n            label: field,\n            onChange: (e: ChangeEvent<HTMLInputElement>) =>\n              onInputParamChange(id, fieldId, e.target.value),\n            type: type as InputProps['type']\n          }\n        };\n        return inputParam;\n      });\n\n      setExpressionDetails(prev => {\n        return {\n          ...prev,\n          [id]: {\n            primary,\n            outputParams,\n            inputParams\n          }\n        };\n      });\n    }\n  };\n\n  const onItemCollapse = (id: string) => {\n    action('onItemCollapse')(id);\n    setTimeout(() => {\n      setExpressionDetails(prev => {\n        const newExpressionDetails = { ...prev };\n        delete newExpressionDetails[id];\n        return newExpressionDetails;\n      });\n    }, 500);\n\n    setExpressionDetailsValues(prev => {\n      const newValues = { ...prev };\n      delete newValues[id];\n      return newValues;\n    });\n  };\n\n  const fetchSuggestions: ExpressionBuilderProps['fetchSuggestions'] = (\n    autoCompleteTrigger,\n    cursorPosition\n  ) => {\n    action('cursorPosition')(cursorPosition);\n    if (autoCompleteTrigger === '@') {\n      setLoading(true);\n      return new Promise(resolve => {\n        setTimeout(() => {\n          setLoading(false);\n          resolve(suggestedRuleType);\n        }, 1000);\n      });\n    }\n    if (autoCompleteTrigger === ':') {\n      const scope = getScopeFromPosition(\n        cursorPosition,\n        autoCompleteTrigger,\n        handle.current?.getExpression() ?? ''\n      ).split('@')[0];\n      const suggestedFunctions = getSuggestedFunction(scope);\n\n      setLoading(true);\n      return new Promise(resolve => {\n        setTimeout(() => {\n          setLoading(false);\n          resolve(suggestedFunctions);\n        }, 1000);\n      });\n    }\n    setLoading(true);\n    return new Promise(resolve => {\n      setTimeout(() => {\n        setLoading(false);\n        resolve(suggestedFields);\n      }, 1000);\n    });\n  };\n\n  const debouncedHandler = useRef(\n    debounce(expression => {\n      if (expression.includes('undefined'))\n        setErrors('Correct the invalid expression, expression cannot contain \"undefined\" ');\n      else setErrors('');\n    }, 600)\n  ).current;\n\n  return (\n    <StyledExpressionBuilderDemo>\n      <ExpressionBuilder\n        list={{\n          items: expressionItems,\n          onItemAdd: args.onItemAdd || onItemAdd,\n          onItemExpand: args.onItemExpand || onItemExpand,\n          onItemCollapse: args.onItemCollapse || onItemCollapse,\n          details: expressionDetails\n        }}\n        search={{\n          filters: ['Field', 'Function', 'Decision', 'When'],\n          onFilterChange: args.onFilterChange\n            ? args.onFilterChange\n            : value => setSearchFilter(value),\n          onSearchChange: args.onSearchChange\n            ? args.onSearchChange\n            : value => setSearchValue(value),\n          value: searchValue,\n          accent: filterRegex\n        }}\n        onChange={debouncedHandler}\n        errors={validationErrors && !args.readOnly ? validationErrors : undefined}\n        readOnly={args.readOnly}\n        defaultValue={\n          args.defaultValue === undefined ? 'Math@Function:max(param1,param2)' : args.defaultValue\n        }\n        handle={args.handle || handle}\n        fetchSuggestions={fetchSuggestions}\n        loading={loading}\n      />\n    </StyledExpressionBuilderDemo>\n  );\n};\n\nExpressionBuilderDemo.args = {\n  readOnly: false\n};\n\nExpressionBuilderDemo.argTypes = {\n  readOnly: { control: { type: 'boolean' } }\n};\n\ninterface CodeEditorDemoProps {\n  showErrors?: boolean;\n  readOnly?: boolean;\n}\n\nexport const CodeEditorDemo: StoryFn<CodeEditorDemoProps> = (args: CodeEditorDemoProps) => {\n  const codeEditorHandle = useRef<EditorState | null>(null);\n  const [loading, setLoading] = useState(false);\n\n  const fetchSuggestions: ExpressionBuilderProps['fetchSuggestions'] = () => {\n    setLoading(true);\n    return new Promise(resolve => {\n      setTimeout(() => {\n        setLoading(false);\n        resolve(suggestedFields);\n      }, 1000);\n    });\n  };\n\n  return (\n    <Configuration theme={BuildTheme}>\n      <CodeEditor\n        fetchSuggestions={fetchSuggestions}\n        autoCompleteTriggers={['.', '@']}\n        editorConfigProps={{\n          mode: 'expression',\n          readOnly: args.readOnly\n        }}\n        codeEditorHandle={codeEditorHandle}\n        defaultValue='Math@Function:max(param1,param2)'\n        loading={loading}\n        errors={args.showErrors && !args.readOnly ? errors : undefined}\n        readOnly={args.readOnly}\n      />\n    </Configuration>\n  );\n};\n\nCodeEditorDemo.args = {\n  showErrors: false,\n  readOnly: false\n};\n\nCodeEditorDemo.argTypes = {\n  showErrors: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/build/FlowModeller/AddNodeUtils.mocks.d.ts

@@ -1,45 +0,0 @@
-import { AddNodeHandlerParams, GraphData, PlottedGraphConnector, PlottedGraphNode } from '@pega/cosmos-react-build';
-declare const AddNodeUtilsMocks: {
-    graphData1: GraphData<PlottedGraphNode<any>, PlottedGraphConnector<any>>;
-    onGetNewNode: (metaData: AddNodeHandlerParams) => PlottedGraphNode;
-    onGetNewConnector: (fromNodeId: string, toNodeId: string, metaData: AddNodeHandlerParams) => PlottedGraphConnector;
-    result: {
-        nodes: ({
-            id: string;
-            position: {
-                x: number;
-                y: number;
-            };
-            dimensions: {
-                width: number;
-                height: number;
-            };
-        } | {
-            id: string;
-            realConnectors: string[];
-            position: {
-                x: number;
-                y: number;
-            };
-            dimensions: {
-                width: number;
-                height: number;
-            };
-        })[];
-        connectors: ({
-            points: never[];
-            id: string;
-            fromNodeId: string;
-            toNodeId: string;
-            realConnectors?: undefined;
-        } | {
-            points: never[];
-            id: string;
-            fromNodeId: string;
-            toNodeId: string;
-            realConnectors: string[];
-        })[];
-    };
-};
-export default AddNodeUtilsMocks;
-//# sourceMappingURL=AddNodeUtils.mocks.d.ts.map

package/jsx/build/FlowModeller/AddNodeUtils.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AddNodeUtils.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/FlowModeller/AddNodeUtils.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,SAAS,EACT,qBAAqB,EACrB,gBAAgB,EACjB,MAAM,0BAA0B,CAAC;AAuSlC,QAAA,MAAM,iBAAiB;;6BArIQ,oBAAoB,KAAK,gBAAgB;oCAQ1D,MAAM,YACR,MAAM,YACN,oBAAoB,KAC3B,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+HzB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}