@pega/cosmos-react-demos 8.0.0-build.9.0 → 8.0.0

package/jsx/build/BackgroundPicker/BackgroundPicker.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryFn } from '@storybook/react';
+import { type BackgroundPickerProps } from '@pega/cosmos-react-build';
+declare const _default: Meta;
+export default _default;
+interface BackgroundPickerStoryProps extends BackgroundPickerProps {
+    showAdditionalInfo?: boolean;
+}
+export declare const BackgroundPickerDemo: StoryFn<BackgroundPickerStoryProps>;
+//# sourceMappingURL=BackgroundPicker.stories.d.ts.map

package/jsx/build/BackgroundPicker/BackgroundPicker.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackgroundPicker.stories.d.ts","sourceRoot":"","sources":["../../../src/build/BackgroundPicker/BackgroundPicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;wBAKnF,IAAI;AAHT,wBAGU;AAEV,UAAU,0BAA2B,SAAQ,qBAAqB;IAChE,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,oBAAoB,EAAE,OAAO,CAAC,0BAA0B,CAgCpE,CAAC"}

package/jsx/build/BackgroundPicker/BackgroundPicker.stories.jsx

@@ -0,0 +1,42 @@
+import { useState } from 'react';
+import { BackgroundPicker } from '@pega/cosmos-react-build';
+export default {
+    title: 'Build/BackgroundPicker',
+    component: BackgroundPicker
+};
+export const BackgroundPickerDemo = (args) => {
+    const [value, setValue] = useState('#10a5acdb');
+    const onSubmit = (updatedValue) => {
+        setValue(updatedValue);
+    };
+    return (<BackgroundPicker additionalInfo={args.showAdditionalInfo
+            ? {
+                content: 'Select a background from the list.'
+            }
+            : undefined} label={args.label} labelHidden={args.labelHidden} info={args.info} status={args.status} swatchOnly={args.swatchOnly} inline={args.inline} required={args.required} disabled={args.disabled} readOnly={args.readOnly} value={value} onBeforeClose={args.onBeforeClose} onSubmit={onSubmit}/>);
+};
+BackgroundPickerDemo.args = {
+    label: 'Background',
+    labelHidden: false,
+    info: 'Pick a background',
+    status: undefined,
+    swatchOnly: false,
+    inline: false,
+    required: false,
+    disabled: false,
+    readOnly: false,
+    showAdditionalInfo: false
+};
+BackgroundPickerDemo.argTypes = {
+    label: { control: { type: 'text' } },
+    labelHidden: { control: { type: 'boolean' } },
+    info: { control: { type: 'text', label: 'Helper text' } },
+    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },
+    swatchOnly: { control: { type: 'boolean' } },
+    inline: { control: { type: 'boolean' } },
+    required: { control: { type: 'boolean' } },
+    disabled: { control: { type: 'boolean' } },
+    readOnly: { control: { type: 'boolean' } },
+    showAdditionalInfo: { control: { type: 'boolean' } }
+};
+//# sourceMappingURL=BackgroundPicker.stories.jsx.map

package/jsx/build/BackgroundPicker/BackgroundPicker.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackgroundPicker.stories.jsx","sourceRoot":"","sources":["../../../src/build/BackgroundPicker/BackgroundPicker.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,gBAAgB,EAA8B,MAAM,0BAA0B,CAAC;AAExF,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,gBAAgB;CACpB,CAAC;AAMV,MAAM,CAAC,MAAM,oBAAoB,GAAwC,CACvE,IAAgC,EAChC,EAAE;IACF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,WAAW,CAAC,CAAC;IAExD,MAAM,QAAQ,GAAG,CAAC,YAAoB,EAAE,EAAE;QACxC,QAAQ,CAAC,YAAY,CAAC,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,gBAAgB,CACf,cAAc,CAAC,CACb,IAAI,CAAC,kBAAkB;YACrB,CAAC,CAAC;gBACE,OAAO,EAAE,oCAAoC;aAC9C;YACH,CAAC,CAAC,SACN,CAAC,CACD,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,WAAW,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAC9B,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAChB,MAAM,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CACpB,UAAU,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAC5B,MAAM,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CACpB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,aAAa,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAClC,QAAQ,CAAC,CAAC,QAAQ,CAAC,EACnB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,oBAAoB,CAAC,IAAI,GAAG;IAC1B,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,KAAK;IAClB,IAAI,EAAE,mBAAmB;IACzB,MAAM,EAAE,SAAS;IACjB,UAAU,EAAE,KAAK;IACjB,MAAM,EAAE,KAAK;IACb,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;IACf,kBAAkB,EAAE,KAAK;CAC1B,CAAC;AAEF,oBAAoB,CAAC,QAAQ,GAAG;IAC9B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC7C,IAAI,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE;IACzD,MAAM,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAC5F,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC5C,MAAM,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACxC,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,kBAAkB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CACrD,CAAC","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { BackgroundPicker, type BackgroundPickerProps } from '@pega/cosmos-react-build';\n\nexport default {\n  title: 'Build/BackgroundPicker',\n  component: BackgroundPicker\n} as Meta;\n\ninterface BackgroundPickerStoryProps extends BackgroundPickerProps {\n  showAdditionalInfo?: boolean;\n}\n\nexport const BackgroundPickerDemo: StoryFn<BackgroundPickerStoryProps> = (\n  args: BackgroundPickerStoryProps\n) => {\n  const [value, setValue] = useState<string>('#10a5acdb');\n\n  const onSubmit = (updatedValue: string) => {\n    setValue(updatedValue);\n  };\n\n  return (\n    <BackgroundPicker\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              content: 'Select a background from the list.'\n            }\n          : undefined\n      }\n      label={args.label}\n      labelHidden={args.labelHidden}\n      info={args.info}\n      status={args.status}\n      swatchOnly={args.swatchOnly}\n      inline={args.inline}\n      required={args.required}\n      disabled={args.disabled}\n      readOnly={args.readOnly}\n      value={value}\n      onBeforeClose={args.onBeforeClose}\n      onSubmit={onSubmit}\n    />\n  );\n};\n\nBackgroundPickerDemo.args = {\n  label: 'Background',\n  labelHidden: false,\n  info: 'Pick a background',\n  status: undefined,\n  swatchOnly: false,\n  inline: false,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  showAdditionalInfo: false\n};\n\nBackgroundPickerDemo.argTypes = {\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text', label: 'Helper text' } },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n  swatchOnly: { control: { type: 'boolean' } },\n  inline: { control: { type: 'boolean' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/build/DynamicInput/DynamicInput.stories.d.ts

@@ -1,9 +1,9 @@
 import type { Meta, StoryFn } from '@storybook/react';
-import type { ConstantFormat, Source } from '@pega/cosmos-react-build';
+import type { ConstantControlConfig, Source } from '@pega/cosmos-react-build';
 declare const _default: Meta;
 export default _default;
 interface DynamicInputStoryProps {
-    constantFormat?: ConstantFormat;
+    constantFormat?: ConstantControlConfig['format'];
     required?: boolean;
     defaultSource?: Source;
     timeout?: boolean;

package/jsx/build/DynamicInput/DynamicInput.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicInput.stories.d.ts","sourceRoot":"","sources":["../../../src/build/DynamicInput/DynamicInput.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EACV,cAAc,EAId,MAAM,EACP,MAAM,0BAA0B,CAAC;wBAuC7B,IAAI;AAjCT,wBAiCU;AAIV,UAAU,sBAAsB;IAC9B,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,sBAAsB,CAuX5D,CAAC"}
+{"version":3,"file":"DynamicInput.stories.d.ts","sourceRoot":"","sources":["../../../src/build/DynamicInput/DynamicInput.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAMtD,OAAO,KAAK,EAGV,qBAAqB,EACrB,MAAM,EAEP,MAAM,0BAA0B,CAAC;wBAuC7B,IAAI;AAjCT,wBAiCU;AAIV,UAAU,sBAAsB;IAC9B,cAAc,CAAC,EAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;IACjD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,sBAAsB,CA2Y5D,CAAC"}

package/jsx/build/DynamicInput/DynamicInput.stories.jsx

@@ -80,20 +80,44 @@ export const DynamicInputDemo = (args) => {
         ]);
     }, [defaultSource]);
     const [constantValue, setConstantValue] = useState('');
-    const constant = useMemo(() => ({
-        format: constantFormat,
-        props: {
-            value: '',
-            onChange: value => {
-                setConstantValue(value);
-            }
+    const constant = useMemo(() => {
+        if (constantFormat === 'Boolean') {
+            return {
+                format: 'Boolean',
+                props: {
+                    value: constantValue === true,
+                    onChange: value => {
+                        setConstantValue(value);
+                    }
+                }
+            };
         }
-    }), [constantValue, constantFormat]);
+        if (constantFormat === 'Date' || constantFormat === 'DateTime' || constantFormat === 'Time') {
+            return {
+                format: constantFormat,
+                props: {
+                    value: constantValue,
+                    onChange: (value) => {
+                        setConstantValue(value.valueAsISOString);
+                    }
+                }
+            };
+        }
+        return {
+            format: constantFormat,
+            props: {
+                value: String(constantValue),
+                onChange: (value) => {
+                    setConstantValue(value);
+                }
+            }
+        };
+    }, [constantValue, constantFormat]);
     const [ruleState, setRuleState] = useState({
         props: defaultRuleState
     });
     const [ruleConfigDialogTarget, setRuleConfigDialogTarget] = useState();
-    const onRuleExpand = useCallback(itemId => {
+    const onRuleExpand = useCallback((itemId) => {
         const expandedItem = ruleState.props.ruleTypes?.find(item => item.id === itemId);
         if (expandedItem?.rules.length === 0) {
             const { promise } = fetchRules({ ruleType: expandedItem.type, delay: timeout ? 1000 : 0 });
@@ -117,7 +141,7 @@ export const DynamicInputDemo = (args) => {
             });
         }
     }, [ruleState]);
-    const onRuleFilter = useCallback(filterValue => {
+    const onRuleFilter = useCallback((filterValue) => {
         if (ruleState.pendingFetch) {
             ruleState.pendingFetch.abort();
         }
@@ -156,7 +180,7 @@ export const DynamicInputDemo = (args) => {
             }
         });
     }, [ruleState]);
-    const ruleLoadMore = useCallback(itemId => {
+    const ruleLoadMore = useCallback((itemId) => {
         const ruleStateProps = ruleState.props;
         const ruleItems = ruleStateProps.items;
         const directList = !!ruleState.props.items;
@@ -215,7 +239,7 @@ export const DynamicInputDemo = (args) => {
             }
         });
     }, [ruleState]);
-    const onRuleSelect = useCallback(selectedRule => {
+    const onRuleSelect = useCallback((selectedRule) => {
         setRuleState({
             ...ruleState,
             props: {
@@ -230,7 +254,7 @@ export const DynamicInputDemo = (args) => {
                     onLinkClick: () => {
                         alert('Link clicked');
                     },
-                    onConfig: (configTarget) => {
+                    onConfig: configTarget => {
                         setRuleConfigDialogTarget(configTarget);
                     },
                     onClear: () => {

package/jsx/build/DynamicInput/DynamicInput.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"DynamicInput.stories.jsx","sourceRoot":"","sources":["../../../src/build/DynamicInput/DynamicInput.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useMemo, useCallback, useEffect } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport { BuildTheme, ThemeOverride, Flex, FormDialog, Input } from '@pega/cosmos-react-core';\nimport { CodeEditor, DynamicInput } from '@pega/cosmos-react-build';\nimport type {\n  ConstantFormat,\n  RuleSelectProps,\n  SourceConfig,\n  ConstantControlConfig,\n  Source\n} from '@pega/cosmos-react-build';\n\nimport { useFieldReferenceMock } from '../FieldReference/FieldReference.mocks';\n\nimport { baseRuleTypes, defaultRuleState, fetchRules } from './DynamicInput.mocks';\n\nexport default {\n  title: 'Build/DynamicInput',\n  component: DynamicInput,\n  args: {\n    constantFormat: 'Text',\n    defaultSource: 'Rule',\n    required: true\n  },\n  argTypes: {\n    constantFormat: {\n      control: { type: 'select' },\n      options: [\n        'Text',\n        'Text (paragraph)',\n        'Boolean',\n        'Currency',\n        'Percentage',\n        'Integer',\n        'Decimal',\n        'Phone',\n        'DateTime',\n        'Date',\n        'Time'\n      ]\n    },\n    defaultSource: {\n      control: { type: 'select' },\n      options: ['Rule', 'Constant', 'FieldReference', 'Expression']\n    },\n    required: {\n      control: { type: 'boolean' }\n    }\n  }\n} as Meta;\n\ntype RuleType = 'Automation' | 'Decision' | 'Field' | 'Paragraph';\n\ninterface DynamicInputStoryProps {\n  constantFormat?: ConstantFormat;\n  required?: boolean;\n  defaultSource?: Source;\n  timeout?: boolean;\n}\n\nexport const DynamicInputDemo: StoryFn<DynamicInputStoryProps> = (args: DynamicInputStoryProps) => {\n  const defaultSource = args.defaultSource || 'Rule';\n  const constantFormat = args.constantFormat || 'Text';\n  const timeout = args.timeout || true;\n\n  const [sources, setSources] = useState<SourceConfig[]>([\n    {\n      type: 'Constant',\n      selected: defaultSource === 'Constant'\n    },\n    {\n      type: 'Rule',\n      selected: defaultSource === 'Rule'\n    },\n    {\n      type: 'FieldReference',\n      selected: defaultSource === 'FieldReference'\n    },\n    {\n      type: 'Expression',\n      selected: defaultSource === 'Expression'\n    }\n  ]);\n\n  useEffect(() => {\n    setSources([\n      {\n        type: 'Constant',\n        selected: defaultSource === 'Constant'\n      },\n      {\n        type: 'Rule',\n        selected: defaultSource === 'Rule'\n      },\n      {\n        type: 'FieldReference',\n        selected: defaultSource === 'FieldReference'\n      },\n      {\n        type: 'Expression',\n        selected: defaultSource === 'Expression'\n      }\n    ]);\n  }, [defaultSource]);\n\n  /**\n   * Constant Input\n   */\n  const [constantValue, setConstantValue] = useState<ConstantControlConfig['props']['value']>('');\n  const constant = useMemo<ConstantControlConfig>(\n    () => ({\n      format: constantFormat,\n      props: {\n        value: '',\n        onChange: value => {\n          setConstantValue(value);\n        }\n      }\n    }),\n    [constantValue, constantFormat]\n  );\n\n  /**\n   * Rule input\n   */\n  const [ruleState, setRuleState] = useState<{\n    props: typeof defaultRuleState;\n    pendingFetch?: ReturnType<typeof fetchRules>;\n  }>({\n    props: defaultRuleState\n  });\n  // todo-lc: type this\n  const [ruleConfigDialogTarget, setRuleConfigDialogTarget] = useState();\n\n  const onRuleExpand = useCallback<(id: string) => void>(\n    itemId => {\n      const expandedItem = ruleState.props.ruleTypes?.find(item => item.id === itemId);\n\n      // Demos lazy loading rules.\n      if (expandedItem?.rules.length === 0) {\n        const { promise } = fetchRules({ ruleType: expandedItem.type, delay: timeout ? 1000 : 0 });\n\n        promise\n          .then(res => {\n            const newItems = ruleState.props.ruleTypes?.map(item => {\n              if (item.id === expandedItem.id) {\n                return { ...item, rules: res.results };\n              }\n\n              return item;\n            });\n\n            setRuleState({\n              ...ruleState,\n              props: { ...ruleState.props, loading: false, ruleTypes: newItems }\n            });\n          })\n          .catch(() => {});\n\n        // Set loading while rules are fetched initially.\n        setRuleState({\n          ...ruleState,\n          props: { ...ruleState.props, loading: true }\n        });\n      }\n    },\n    [ruleState]\n  );\n\n  const onRuleFilter = useCallback(\n    filterValue => {\n      // Abort requests before reissuing if necessary.\n      if (ruleState.pendingFetch) {\n        ruleState.pendingFetch.abort();\n      }\n\n      // If the filterValue is an empty string from backspace both remove any selection and reset the menu to its default.\n      if (!filterValue) {\n        setRuleState({\n          ...ruleState,\n          props: {\n            ...defaultRuleState\n          }\n        });\n        return;\n      }\n\n      const fetch = fetchRules({ filter: filterValue, delay: timeout ? 1000 : 0 });\n\n      fetch.promise.then(fetchedRules => {\n        if (!ruleState.props) {\n          return undefined;\n        }\n\n        setRuleState({\n          pendingFetch: undefined,\n          props: {\n            ...ruleState.props,\n            filterValue,\n            loading: false,\n            items: fetchedRules.results\n          }\n        });\n      });\n\n      // Place the menu into a loading state while rules are fetched.\n      // Additionally, set a reference to the pending fetch to conditionally abort if onFilter is retriggered before fetch resolves.\n      setRuleState({\n        pendingFetch: fetch,\n        props: {\n          ...ruleState.props,\n          loading: true,\n          filterValue,\n          ruleTypes: [],\n          items: undefined\n        }\n      });\n    },\n    [ruleState]\n  );\n\n  const ruleLoadMore = useCallback(\n    itemId => {\n      const ruleStateProps = ruleState.props as RuleSelectProps;\n      const ruleItems = ruleStateProps.items;\n\n      const directList = !!ruleState.props.items;\n\n      // No rule type expanded and no items provided directly.\n      if (!itemId && !directList) {\n        return ruleStateProps;\n      }\n\n      const expandedItem = ruleState.props.ruleTypes?.find(item => item.id === itemId);\n\n      // Apply based on if an expanded rule or a list of items provided directly.\n      let fetchParams = {};\n\n      // Expanded rule type's list.\n      if (!directList && expandedItem) {\n        const currentLength = expandedItem?.rules.length;\n\n        // The demo is assuming a total count in known upfront.\n        // (If that is not the case an empty response can be used to determine all rules are fetched)\n        const totalCount = baseRuleTypes.find(item => item.id === itemId)!.count!;\n\n        if (currentLength >= totalCount) {\n          return ruleStateProps;\n        }\n\n        fetchParams = {\n          ruleType: itemId as RuleType,\n          start: currentLength,\n          delay: timeout ? 1000 : 0\n        };\n      }\n\n      // Abort requests before reissuing if necessary.\n      if (ruleState.pendingFetch) {\n        ruleState.pendingFetch.abort();\n      }\n\n      const fetch = fetchRules(fetchParams);\n\n      fetch.promise.then(res => {\n        setRuleState({\n          pendingFetch: undefined,\n          props: {\n            ...ruleState.props,\n            loading: false,\n            items: ruleItems\n              ? {\n                  ...ruleItems,\n                  ...res.results\n                }\n              : undefined,\n            ruleTypes: expandedItem\n              ? ruleState.props.ruleTypes?.map(item => {\n                  if (item.id === expandedItem.id) {\n                    return {\n                      ...item,\n                      rules: [...item.rules, ...res.results]\n                    };\n                  }\n\n                  return item;\n                })\n              : defaultRuleState.ruleTypes\n          }\n        });\n      });\n\n      setRuleState({\n        pendingFetch: fetch,\n        props: {\n          ...ruleState.props,\n          loading: true\n        }\n      });\n    },\n    [ruleState]\n  );\n\n  const onRuleSelect = useCallback(\n    selectedRule => {\n      setRuleState({\n        ...ruleState,\n        props: {\n          ...ruleState.props,\n          filterValue: undefined,\n          selectedRule: {\n            ...selectedRule,\n            href: `/rules/${selectedRule.id}`,\n            onPreview: () => {\n              // eslint-disable-next-line no-alert\n              alert('Link previewed');\n            },\n            onLinkClick: () => {\n              // eslint-disable-next-line no-alert\n              alert('Link clicked');\n            },\n            onConfig: (configTarget: any) => {\n              setRuleConfigDialogTarget(configTarget);\n            },\n            onClear: () => {\n              setRuleConfigDialogTarget(undefined);\n              setRuleState({\n                props: defaultRuleState\n              });\n            }\n          }\n        }\n      });\n    },\n    [ruleState]\n  );\n\n  /**\n   * Field reference input\n   */\n  const fieldReferenceMock = useFieldReferenceMock('static');\n\n  return (\n    <ThemeOverride theme={BuildTheme}>\n      <DynamicInput\n        required={args.required}\n        sources={sources}\n        onSourceChange={selectedSource => {\n          const updatedSources = sources.map(source => ({\n            ...source,\n            selected: source.type === selectedSource\n          }));\n          setSources(updatedSources);\n        }}\n        controls={{\n          constant,\n          rule: {\n            props: {\n              ...ruleState.props,\n              onExpand: onRuleExpand,\n              onFilter: onRuleFilter,\n              loadMore: ruleLoadMore,\n              onSelect: onRuleSelect,\n              onCreateNew: () => {}\n            }\n          },\n          fieldReference: {\n            props: {\n              placeholder: 'Choose a field...',\n              onSelectedChange: fieldReferenceMock.handleSelectedChange,\n              menu: {\n                items: fieldReferenceMock.itemsToRender,\n                altContexts: fieldReferenceMock.altContexts,\n                currentContext: fieldReferenceMock.currentContext,\n                parentItem: fieldReferenceMock.parentItem,\n                loading: fieldReferenceMock.menuLoading\n              },\n              selected: fieldReferenceMock.selected,\n              filterValue: fieldReferenceMock.filterValue,\n              onFilterChange: fieldReferenceMock.setFilterValue,\n              onBlur: () => {\n                fieldReferenceMock.setFilterValue('');\n              }\n            }\n          },\n          expression: {\n            component: CodeEditor,\n            props: {\n              list: {\n                onItemAdd: () => {},\n                details: {}\n              },\n              search: {\n                filters: [],\n                onFilterChange: () => {},\n                onSearchChange: () => {},\n                value: ''\n              },\n              codeEditorHandle: {\n                current: {\n                  getValue: () => {\n                    return undefined;\n                  },\n                  insertText: (text: string) => {\n                    // eslint-disable-next-line no-console\n                    console.log(text);\n                  }\n                }\n              }\n            }\n          }\n        }}\n      />\n\n      {/* Mock demoing rule config by way of a dialog but, any pattern could be used: modal, panel, etc... */}\n      {ruleConfigDialogTarget && ruleState && ruleState.props?.selectedRule && (\n        <FormDialog\n          target={ruleConfigDialogTarget}\n          heading={ruleState.props?.selectedRule.name}\n          onCancel={() => {\n            setRuleConfigDialogTarget(undefined);\n          }}\n          onSubmit={() => {\n            setRuleConfigDialogTarget(undefined);\n          }}\n        >\n          <Flex container={{ direction: 'column', gap: 2 }}>\n            <Input label='Config field 1' />\n            <Input label='Config field 2' />\n            <Input label='Config field 3' />\n          </Flex>\n        </FormDialog>\n      )}\n    </ThemeOverride>\n  );\n};\n"]}
+{"version":3,"file":"DynamicInput.stories.jsx","sourceRoot":"","sources":["../../../src/build/DynamicInput/DynamicInput.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useMemo, useCallback, useEffect } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\n\nimport type DateTimeProps from '@pega/cosmos-react-core/lib/components/DateTime/DateTime.types';\nimport type { DateTimeCallbackParameter } from '@pega/cosmos-react-core/lib/components/DateTime/DateTime.types';\nimport { BuildTheme, ThemeOverride, Flex, FormDialog, Input } from '@pega/cosmos-react-core';\nimport { CodeEditor, DynamicInput } from '@pega/cosmos-react-build';\nimport type {\n  RuleSelectProps,\n  SourceConfig,\n  ConstantControlConfig,\n  Source,\n  RuleSelectItem\n} from '@pega/cosmos-react-build';\n\nimport { useFieldReferenceMock } from '../FieldReference/FieldReference.mocks';\n\nimport { baseRuleTypes, defaultRuleState, fetchRules } from './DynamicInput.mocks';\n\nexport default {\n  title: 'Build/DynamicInput',\n  component: DynamicInput,\n  args: {\n    constantFormat: 'Text',\n    defaultSource: 'Rule',\n    required: true\n  },\n  argTypes: {\n    constantFormat: {\n      control: { type: 'select' },\n      options: [\n        'Text',\n        'Text (paragraph)',\n        'Boolean',\n        'Currency',\n        'Percentage',\n        'Integer',\n        'Decimal',\n        'Phone',\n        'DateTime',\n        'Date',\n        'Time'\n      ]\n    },\n    defaultSource: {\n      control: { type: 'select' },\n      options: ['Rule', 'Constant', 'FieldReference', 'Expression']\n    },\n    required: {\n      control: { type: 'boolean' }\n    }\n  }\n} as Meta;\n\ntype RuleType = 'Automation' | 'Decision' | 'Field' | 'Paragraph';\n\ninterface DynamicInputStoryProps {\n  constantFormat?: ConstantControlConfig['format'];\n  required?: boolean;\n  defaultSource?: Source;\n  timeout?: boolean;\n}\n\nexport const DynamicInputDemo: StoryFn<DynamicInputStoryProps> = (args: DynamicInputStoryProps) => {\n  const defaultSource = args.defaultSource || 'Rule';\n  const constantFormat = args.constantFormat || 'Text';\n  const timeout = args.timeout || true;\n\n  const [sources, setSources] = useState<SourceConfig[]>([\n    {\n      type: 'Constant',\n      selected: defaultSource === 'Constant'\n    },\n    {\n      type: 'Rule',\n      selected: defaultSource === 'Rule'\n    },\n    {\n      type: 'FieldReference',\n      selected: defaultSource === 'FieldReference'\n    },\n    {\n      type: 'Expression',\n      selected: defaultSource === 'Expression'\n    }\n  ]);\n\n  useEffect(() => {\n    setSources([\n      {\n        type: 'Constant',\n        selected: defaultSource === 'Constant'\n      },\n      {\n        type: 'Rule',\n        selected: defaultSource === 'Rule'\n      },\n      {\n        type: 'FieldReference',\n        selected: defaultSource === 'FieldReference'\n      },\n      {\n        type: 'Expression',\n        selected: defaultSource === 'Expression'\n      }\n    ]);\n  }, [defaultSource]);\n\n  /**\n   * Constant Input\n   */\n  const [constantValue, setConstantValue] = useState<ConstantControlConfig['props']['value']>('');\n  const constant = useMemo<ConstantControlConfig>(() => {\n    if (constantFormat === 'Boolean') {\n      return {\n        format: 'Boolean',\n        props: {\n          value: constantValue === true,\n          onChange: value => {\n            setConstantValue(value);\n          }\n        }\n      };\n    }\n    if (constantFormat === 'Date' || constantFormat === 'DateTime' || constantFormat === 'Time') {\n      return {\n        format: constantFormat,\n        props: {\n          value: constantValue as DateTimeProps['value'],\n          onChange: (value: DateTimeCallbackParameter) => {\n            setConstantValue(value.valueAsISOString);\n          }\n        }\n      };\n    }\n    return {\n      format: constantFormat,\n      props: {\n        value: String(constantValue),\n        onChange: (value: ConstantControlConfig['props']['value']) => {\n          setConstantValue(value);\n        }\n      }\n    };\n  }, [constantValue, constantFormat]);\n\n  /**\n   * Rule input\n   */\n  const [ruleState, setRuleState] = useState<{\n    props: typeof defaultRuleState;\n    pendingFetch?: ReturnType<typeof fetchRules>;\n  }>({\n    props: defaultRuleState\n  });\n  const [ruleConfigDialogTarget, setRuleConfigDialogTarget] = useState<HTMLElement>();\n\n  const onRuleExpand = useCallback(\n    (itemId: string) => {\n      const expandedItem = ruleState.props.ruleTypes?.find(item => item.id === itemId);\n\n      // Demos lazy loading rules.\n      if (expandedItem?.rules.length === 0) {\n        const { promise } = fetchRules({ ruleType: expandedItem.type, delay: timeout ? 1000 : 0 });\n\n        promise\n          .then(res => {\n            const newItems = ruleState.props.ruleTypes?.map(item => {\n              if (item.id === expandedItem.id) {\n                return { ...item, rules: res.results };\n              }\n\n              return item;\n            });\n\n            setRuleState({\n              ...ruleState,\n              props: { ...ruleState.props, loading: false, ruleTypes: newItems }\n            });\n          })\n          .catch(() => {});\n\n        // Set loading while rules are fetched initially.\n        setRuleState({\n          ...ruleState,\n          props: { ...ruleState.props, loading: true }\n        });\n      }\n    },\n    [ruleState]\n  );\n\n  const onRuleFilter = useCallback(\n    (filterValue: string) => {\n      // Abort requests before reissuing if necessary.\n      if (ruleState.pendingFetch) {\n        ruleState.pendingFetch.abort();\n      }\n\n      // If the filterValue is an empty string from backspace both remove any selection and reset the menu to its default.\n      if (!filterValue) {\n        setRuleState({\n          ...ruleState,\n          props: {\n            ...defaultRuleState\n          }\n        });\n        return;\n      }\n\n      const fetch = fetchRules({ filter: filterValue, delay: timeout ? 1000 : 0 });\n\n      fetch.promise.then(fetchedRules => {\n        if (!ruleState.props) {\n          return undefined;\n        }\n\n        setRuleState({\n          pendingFetch: undefined,\n          props: {\n            ...ruleState.props,\n            filterValue,\n            loading: false,\n            items: fetchedRules.results\n          }\n        });\n      });\n\n      // Place the menu into a loading state while rules are fetched.\n      // Additionally, set a reference to the pending fetch to conditionally abort if onFilter is retriggered before fetch resolves.\n      setRuleState({\n        pendingFetch: fetch,\n        props: {\n          ...ruleState.props,\n          loading: true,\n          filterValue,\n          ruleTypes: [],\n          items: undefined\n        }\n      });\n    },\n    [ruleState]\n  );\n\n  const ruleLoadMore = useCallback(\n    (itemId: string | undefined) => {\n      const ruleStateProps = ruleState.props as RuleSelectProps;\n      const ruleItems = ruleStateProps.items;\n\n      const directList = !!ruleState.props.items;\n\n      // No rule type expanded and no items provided directly.\n      if (!itemId && !directList) {\n        return ruleStateProps;\n      }\n\n      const expandedItem = ruleState.props.ruleTypes?.find(item => item.id === itemId);\n\n      // Apply based on if an expanded rule or a list of items provided directly.\n      let fetchParams = {};\n\n      // Expanded rule type's list.\n      if (!directList && expandedItem) {\n        const currentLength = expandedItem?.rules.length;\n\n        // The demo is assuming a total count in known upfront.\n        // (If that is not the case an empty response can be used to determine all rules are fetched)\n        const totalCount = baseRuleTypes.find(item => item.id === itemId)!.count!;\n\n        if (currentLength >= totalCount) {\n          return ruleStateProps;\n        }\n\n        fetchParams = {\n          ruleType: itemId as RuleType,\n          start: currentLength,\n          delay: timeout ? 1000 : 0\n        };\n      }\n\n      // Abort requests before reissuing if necessary.\n      if (ruleState.pendingFetch) {\n        ruleState.pendingFetch.abort();\n      }\n\n      const fetch = fetchRules(fetchParams);\n\n      fetch.promise.then(res => {\n        setRuleState({\n          pendingFetch: undefined,\n          props: {\n            ...ruleState.props,\n            loading: false,\n            items: ruleItems\n              ? {\n                  ...ruleItems,\n                  ...res.results\n                }\n              : undefined,\n            ruleTypes: expandedItem\n              ? ruleState.props.ruleTypes?.map(item => {\n                  if (item.id === expandedItem.id) {\n                    return {\n                      ...item,\n                      rules: [...item.rules, ...res.results]\n                    };\n                  }\n\n                  return item;\n                })\n              : defaultRuleState.ruleTypes\n          }\n        });\n      });\n\n      setRuleState({\n        pendingFetch: fetch,\n        props: {\n          ...ruleState.props,\n          loading: true\n        }\n      });\n    },\n    [ruleState]\n  );\n\n  const onRuleSelect = useCallback(\n    (selectedRule: RuleSelectItem) => {\n      setRuleState({\n        ...ruleState,\n        props: {\n          ...ruleState.props,\n          filterValue: undefined,\n          selectedRule: {\n            ...selectedRule,\n            href: `/rules/${selectedRule.id}`,\n            onPreview: () => {\n              // eslint-disable-next-line no-alert\n              alert('Link previewed');\n            },\n            onLinkClick: () => {\n              // eslint-disable-next-line no-alert\n              alert('Link clicked');\n            },\n            onConfig: configTarget => {\n              setRuleConfigDialogTarget(configTarget);\n            },\n            onClear: () => {\n              setRuleConfigDialogTarget(undefined);\n              setRuleState({\n                props: defaultRuleState\n              });\n            }\n          }\n        }\n      });\n    },\n    [ruleState]\n  );\n\n  /**\n   * Field reference input\n   */\n  const fieldReferenceMock = useFieldReferenceMock('static');\n\n  return (\n    <ThemeOverride theme={BuildTheme}>\n      <DynamicInput\n        required={args.required}\n        sources={sources}\n        onSourceChange={selectedSource => {\n          const updatedSources = sources.map(source => ({\n            ...source,\n            selected: source.type === selectedSource\n          }));\n          setSources(updatedSources);\n        }}\n        controls={{\n          constant,\n          rule: {\n            props: {\n              ...ruleState.props,\n              onExpand: onRuleExpand,\n              onFilter: onRuleFilter,\n              loadMore: ruleLoadMore,\n              onSelect: onRuleSelect,\n              onCreateNew: () => {}\n            }\n          },\n          fieldReference: {\n            props: {\n              placeholder: 'Choose a field...',\n              onSelectedChange: fieldReferenceMock.handleSelectedChange,\n              menu: {\n                items: fieldReferenceMock.itemsToRender,\n                altContexts: fieldReferenceMock.altContexts,\n                currentContext: fieldReferenceMock.currentContext,\n                parentItem: fieldReferenceMock.parentItem,\n                loading: fieldReferenceMock.menuLoading\n              },\n              selected: fieldReferenceMock.selected,\n              filterValue: fieldReferenceMock.filterValue,\n              onFilterChange: fieldReferenceMock.setFilterValue,\n              onBlur: () => {\n                fieldReferenceMock.setFilterValue('');\n              }\n            }\n          },\n          expression: {\n            component: CodeEditor,\n            props: {\n              list: {\n                onItemAdd: () => {},\n                details: {}\n              },\n              search: {\n                filters: [],\n                onFilterChange: () => {},\n                onSearchChange: () => {},\n                value: ''\n              },\n              codeEditorHandle: {\n                current: {\n                  getValue: () => {\n                    return undefined;\n                  },\n                  insertText: (text: string) => {\n                    // eslint-disable-next-line no-console\n                    console.log(text);\n                  }\n                }\n              }\n            }\n          }\n        }}\n      />\n\n      {/* Mock demoing rule config by way of a dialog but, any pattern could be used: modal, panel, etc... */}\n      {ruleConfigDialogTarget && ruleState && ruleState.props?.selectedRule && (\n        <FormDialog\n          target={ruleConfigDialogTarget}\n          heading={ruleState.props?.selectedRule.name}\n          onCancel={() => {\n            setRuleConfigDialogTarget(undefined);\n          }}\n          onSubmit={() => {\n            setRuleConfigDialogTarget(undefined);\n          }}\n        >\n          <Flex container={{ direction: 'column', gap: 2 }}>\n            <Input label='Config field 1' />\n            <Input label='Config field 2' />\n            <Input label='Config field 3' />\n          </Flex>\n        </FormDialog>\n      )}\n    </ThemeOverride>\n  );\n};\n"]}

package/jsx/build/Expression/Expression.mocks.d.ts

@@ -0,0 +1,11 @@
+export declare const mockSuggestionList: {
+    id: string;
+    key: string;
+    primary: string;
+    type: string;
+    secondary: string[];
+    cursorPos: number;
+    testId: string;
+}[];
+export declare const additionalContentInfo = "Some additional info";
+//# sourceMappingURL=Expression.mocks.d.ts.map

package/jsx/build/Expression/Expression.mocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Expression.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/Expression/Expression.mocks.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB;;;;;;;;GAqC9B,CAAC;AAEF,eAAO,MAAM,qBAAqB,yBAAyB,CAAC"}

package/jsx/build/Expression/Expression.mocks.js

@@ -0,0 +1,41 @@
+const mortgageRequest = 'CCompass-Work-MortgageRequest';
+export const mockSuggestionList = [
+    {
+        id: '1',
+        key: 'Property',
+        primary: 'Property',
+        type: 'SingleRecord',
+        secondary: [mortgageRequest, 'Private'],
+        cursorPos: 0,
+        testId: 'valueinput-Property'
+    },
+    {
+        id: '2',
+        key: 'mayOverrideField',
+        primary: 'may override field',
+        type: 'Text',
+        secondary: [mortgageRequest, 'Private'],
+        cursorPos: 0,
+        testId: 'valueinput-mayOverrideField'
+    },
+    {
+        id: '3',
+        key: 'pxCommitDateTime',
+        primary: 'pxCommitDateTime',
+        type: 'DateTime',
+        secondary: [mortgageRequest, 'Private'],
+        cursorPos: 0,
+        testId: 'valueinput-pxCommitDateTime'
+    },
+    {
+        id: '4',
+        key: 'MortgageProduct',
+        primary: 'Mortgage product',
+        type: 'Text',
+        secondary: [mortgageRequest, 'Private'],
+        cursorPos: 0,
+        testId: 'valueinput-MortgageProduct'
+    }
+];
+export const additionalContentInfo = 'Some additional info';
+//# sourceMappingURL=Expression.mocks.js.map

package/jsx/build/Expression/Expression.mocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Expression.mocks.js","sourceRoot":"","sources":["../../../src/build/Expression/Expression.mocks.ts"],"names":[],"mappings":"AAAA,MAAM,eAAe,GAAG,+BAA+B,CAAC;AAExD,MAAM,CAAC,MAAM,kBAAkB,GAAG;IAChC;QACE,EAAE,EAAE,GAAG;QACP,GAAG,EAAE,UAAU;QACf,OAAO,EAAE,UAAU;QACnB,IAAI,EAAE,cAAc;QACpB,SAAS,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC;QACvC,SAAS,EAAE,CAAC;QACZ,MAAM,EAAE,qBAAqB;KAC9B;IACD;QACE,EAAE,EAAE,GAAG;QACP,GAAG,EAAE,kBAAkB;QACvB,OAAO,EAAE,oBAAoB;QAC7B,IAAI,EAAE,MAAM;QACZ,SAAS,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC;QACvC,SAAS,EAAE,CAAC;QACZ,MAAM,EAAE,6BAA6B;KACtC;IACD;QACE,EAAE,EAAE,GAAG;QACP,GAAG,EAAE,kBAAkB;QACvB,OAAO,EAAE,kBAAkB;QAC3B,IAAI,EAAE,UAAU;QAChB,SAAS,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC;QACvC,SAAS,EAAE,CAAC;QACZ,MAAM,EAAE,6BAA6B;KACtC;IACD;QACE,EAAE,EAAE,GAAG;QACP,GAAG,EAAE,iBAAiB;QACtB,OAAO,EAAE,kBAAkB;QAC3B,IAAI,EAAE,MAAM;QACZ,SAAS,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC;QACvC,SAAS,EAAE,CAAC;QACZ,MAAM,EAAE,4BAA4B;KACrC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,sBAAsB,CAAC","sourcesContent":["const mortgageRequest = 'CCompass-Work-MortgageRequest';\n\nexport const mockSuggestionList = [\n  {\n    id: '1',\n    key: 'Property',\n    primary: 'Property',\n    type: 'SingleRecord',\n    secondary: [mortgageRequest, 'Private'],\n    cursorPos: 0,\n    testId: 'valueinput-Property'\n  },\n  {\n    id: '2',\n    key: 'mayOverrideField',\n    primary: 'may override field',\n    type: 'Text',\n    secondary: [mortgageRequest, 'Private'],\n    cursorPos: 0,\n    testId: 'valueinput-mayOverrideField'\n  },\n  {\n    id: '3',\n    key: 'pxCommitDateTime',\n    primary: 'pxCommitDateTime',\n    type: 'DateTime',\n    secondary: [mortgageRequest, 'Private'],\n    cursorPos: 0,\n    testId: 'valueinput-pxCommitDateTime'\n  },\n  {\n    id: '4',\n    key: 'MortgageProduct',\n    primary: 'Mortgage product',\n    type: 'Text',\n    secondary: [mortgageRequest, 'Private'],\n    cursorPos: 0,\n    testId: 'valueinput-MortgageProduct'\n  }\n];\n\nexport const additionalContentInfo = 'Some additional info';\n"]}

package/jsx/build/Expression/Expression.stories.d.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryFn } from '@storybook/react';
+import type { InputProps } from '@pega/cosmos-react-core';
+import type { ExpressionProps } from '@pega/cosmos-react-build';
+declare const _default: Meta;
+export default _default;
+interface ExpressionDemoProps extends Pick<InputProps, 'info' | 'readOnly' | 'disabled' | 'required' | 'labelHidden'> {
+    showErrors?: boolean;
+    inLineError?: 'single' | 'multiple';
+    showExpressionBuilderErrorBanner?: boolean;
+    expressionSubmitHandler?: () => void;
+    expressionCancelHandler?: () => void;
+    showAdditionalInfo?: boolean;
+    label?: ExpressionProps['label'];
+    placeholder?: ExpressionProps['placeholder'];
+    showExpressionGenerationUI?: boolean;
+}
+export declare const ExpressionDemo: StoryFn<ExpressionDemoProps>;
+//# sourceMappingURL=Expression.stories.d.ts.map

package/jsx/build/Expression/Expression.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Expression.stories.d.ts","sourceRoot":"","sources":["../../../src/build/Expression/Expression.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;wBAQ3D,IAAI;AAHT,wBAGU;AAEV,UAAU,mBACR,SAAQ,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,GAAG,aAAa,CAAC;IACvF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IACpC,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,KAAK,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IACjC,WAAW,CAAC,EAAE,eAAe,CAAC,aAAa,CAAC,CAAC;IAC7C,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACtC;AAED,eAAO,MAAM,cAAc,EAAE,OAAO,CAAC,mBAAmB,CAmDvD,CAAC"}

package/jsx/build/Expression/Expression.stories.jsx

@@ -0,0 +1,57 @@
+import { useUID } from '@pega/cosmos-react-core';
+import { Expression } from '@pega/cosmos-react-build';
+import useMockExpression from './useMockExpression';
+import { additionalContentInfo } from './Expression.mocks';
+export default {
+    title: 'Build/Expression',
+    component: Expression
+};
+export const ExpressionDemo = (args) => {
+    const { inputValue, showExpBuilderModal, openExpBuilderModal, errors, handle, inLineErrors, expressionRef } = useMockExpression({
+        inLineError: args.inLineError,
+        showExpressionBuilderErrorBanner: args.showExpressionBuilderErrorBanner,
+        expShowErrors: args.showErrors
+    });
+    const { fetchSuggestions: inputFetchSuggestions, loading: inputLoading } = useMockExpression({
+        inLineError: args.inLineError,
+        showExpressionBuilderErrorBanner: args.showExpressionBuilderErrorBanner,
+        expShowErrors: args.showErrors
+    });
+    return (<Expression value={inputValue} label={args.label} editorInput={{
+            fetchSuggestions: inputFetchSuggestions,
+            loading: inputLoading,
+            handle,
+            inLineErrors
+        }} showExpressionBuilder={showExpBuilderModal} onExpBuilderShowHandler={openExpBuilderModal} readOnly={args.readOnly} ref={expressionRef} disabled={args.disabled} status={args?.showErrors ? 'error' : undefined} required={args.required} info={args?.showErrors ? errors : args.info} additionalInfo={args.showAdditionalInfo
+            ? {
+                content: additionalContentInfo
+            }
+            : undefined} labelHidden={args.labelHidden} placeholder={args.placeholder} id={useUID()}/>);
+};
+ExpressionDemo.args = {
+    showErrors: false,
+    readOnly: false,
+    disabled: false,
+    inLineError: 'single',
+    showExpressionBuilderErrorBanner: false,
+    showAdditionalInfo: false,
+    info: 'Type in the value',
+    required: false,
+    labelHidden: false,
+    label: 'Expression',
+    placeholder: 'Writing expressions'
+};
+ExpressionDemo.argTypes = {
+    showErrors: { control: { type: 'boolean' } },
+    readOnly: { control: { type: 'boolean' } },
+    disabled: { control: { type: 'boolean' } },
+    showExpressionBuilderErrorBanner: { control: { type: 'boolean' } },
+    inLineError: { options: ['single', 'multiple'], control: { type: 'select' } },
+    showAdditionalInfo: { control: { type: 'boolean' } },
+    labelHidden: { control: { type: 'boolean' } },
+    info: { control: { type: 'text' } },
+    required: { control: { type: 'boolean' } },
+    label: { control: { type: 'text' } },
+    placeholder: { control: { type: 'text' } }
+};
+//# sourceMappingURL=Expression.stories.jsx.map

package/jsx/build/Expression/Expression.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Expression.stories.jsx","sourceRoot":"","sources":["../../../src/build/Expression/Expression.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\n\nimport { useUID } from '@pega/cosmos-react-core';\nimport type { InputProps } from '@pega/cosmos-react-core';\nimport { Expression } from '@pega/cosmos-react-build';\nimport type { ExpressionProps } from '@pega/cosmos-react-build';\n\nimport useMockExpression from './useMockExpression';\nimport { additionalContentInfo } from './Expression.mocks';\n\nexport default {\n  title: 'Build/Expression',\n  component: Expression\n} as Meta;\n\ninterface ExpressionDemoProps\n  extends Pick<InputProps, 'info' | 'readOnly' | 'disabled' | 'required' | 'labelHidden'> {\n  showErrors?: boolean;\n  inLineError?: 'single' | 'multiple';\n  showExpressionBuilderErrorBanner?: boolean;\n  expressionSubmitHandler?: () => void;\n  expressionCancelHandler?: () => void;\n  showAdditionalInfo?: boolean;\n  label?: ExpressionProps['label'];\n  placeholder?: ExpressionProps['placeholder'];\n  showExpressionGenerationUI?: boolean;\n}\n\nexport const ExpressionDemo: StoryFn<ExpressionDemoProps> = (args: ExpressionDemoProps) => {\n  const {\n    inputValue,\n    showExpBuilderModal,\n    openExpBuilderModal,\n    errors,\n    handle,\n    inLineErrors,\n    expressionRef\n  } = useMockExpression({\n    inLineError: args.inLineError,\n    showExpressionBuilderErrorBanner: args.showExpressionBuilderErrorBanner,\n    expShowErrors: args.showErrors\n  });\n\n  const { fetchSuggestions: inputFetchSuggestions, loading: inputLoading } = useMockExpression({\n    inLineError: args.inLineError,\n    showExpressionBuilderErrorBanner: args.showExpressionBuilderErrorBanner,\n    expShowErrors: args.showErrors\n  });\n\n  return (\n    <Expression\n      value={inputValue}\n      label={args.label}\n      editorInput={{\n        fetchSuggestions: inputFetchSuggestions,\n        loading: inputLoading,\n        handle,\n        inLineErrors\n      }}\n      showExpressionBuilder={showExpBuilderModal}\n      onExpBuilderShowHandler={openExpBuilderModal}\n      readOnly={args.readOnly}\n      ref={expressionRef}\n      disabled={args.disabled}\n      status={args?.showErrors ? 'error' : undefined}\n      required={args.required}\n      info={args?.showErrors ? errors : args.info}\n      additionalInfo={\n        args.showAdditionalInfo\n          ? {\n              content: additionalContentInfo\n            }\n          : undefined\n      }\n      labelHidden={args.labelHidden}\n      placeholder={args.placeholder}\n      id={useUID()}\n    />\n  );\n};\n\nExpressionDemo.args = {\n  showErrors: false,\n  readOnly: false,\n  disabled: false,\n  inLineError: 'single',\n  showExpressionBuilderErrorBanner: false,\n  showAdditionalInfo: false,\n  info: 'Type in the value',\n  required: false,\n  labelHidden: false,\n  label: 'Expression',\n  placeholder: 'Writing expressions'\n};\n\nExpressionDemo.argTypes = {\n  showErrors: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  showExpressionBuilderErrorBanner: { control: { type: 'boolean' } },\n  inLineError: { options: ['single', 'multiple'], control: { type: 'select' } },\n  showAdditionalInfo: { control: { type: 'boolean' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text' } },\n  required: { control: { type: 'boolean' } },\n  label: { control: { type: 'text' } },\n  placeholder: { control: { type: 'text' } }\n};\n"]}

package/jsx/build/Expression/useMockExpression.d.ts

@@ -0,0 +1,96 @@
+import type { MenuItemProps } from '@pega/cosmos-react-core';
+import type { ExpressionRefInterface, ExpressionItemProps, HandleValue, AutoCompleteTriggerChar, CursorPosition } from '@pega/cosmos-react-build';
+export default function useMockExpression({ inLineError, showExpressionBuilderErrorBanner, expShowErrors }: {
+    inLineError?: string;
+    showExpressionBuilderErrorBanner?: boolean;
+    expShowErrors?: boolean;
+}): {
+    showExpBuilderModal: boolean;
+    setShowExpBuilderModal: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    openExpBuilderModal: () => Promise<void>;
+    showSuggestions: boolean;
+    suggestionList: (MenuItemProps & {
+        key?: string;
+    })[];
+    inputValue: string;
+    expBuilderInputValue: string;
+    expressionItems: ({
+        id: string;
+        testId: string;
+        primary: string;
+        type: string;
+        expression: string;
+        details: {
+            primary: {
+                field: string;
+                value: string;
+            }[];
+            output: {
+                field: string;
+                value: string;
+            }[];
+            input: {
+                id: string;
+                field: string;
+                type: string;
+            }[];
+        };
+    } | {
+        id: string;
+        testId: string;
+        primary: string;
+        type: string;
+        expression: string;
+        details: {
+            primary: {
+                field: string;
+                value: string;
+            }[];
+            output: {
+                field: string;
+                value: string;
+            }[];
+            input?: undefined;
+        };
+    })[];
+    expressionDetails: {
+        [id: string]: import("@pega/cosmos-react-build/lib/components/ExpressionBuilder/ExpressionBuilder.types").ExpressionDetailsProps;
+    };
+    isExpBuilderLoading: boolean;
+    searchFilter: string;
+    setSearchFilter: import("react").Dispatch<import("react").SetStateAction<string>>;
+    filterRegex: RegExp;
+    searchValue: string;
+    setSearchValue: import("react").Dispatch<import("react").SetStateAction<string>>;
+    errors: string;
+    handle: import("react").RefObject<HandleValue>;
+    expressionRef: import("react").RefObject<ExpressionRefInterface>;
+    loading: boolean;
+    inLineErrors: {
+        start: import("@pega/cosmos-react-build/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types").ErrorRange;
+        end: import("@pega/cosmos-react-build/lib/components/ExpressionBuilder/CodeEditor/CodeEditor.types").ErrorRange;
+        messages: string[];
+    }[] | undefined;
+    expBuilderErrorBanner: Pick<import("@pega/cosmos-react-core").BannerProps, "variant" | "onDismiss" | "messages"> | undefined;
+    expressionSubmitHandler: ({ close }: {
+        close: () => void;
+    }) => void;
+    expressionCancelHandler: ({ close }: {
+        close?: () => void;
+    }) => void;
+    onItemAdd: (id: ExpressionItemProps["id"], addExpression: (expression: string) => void) => void;
+    onItemExpand: (id: string) => void;
+    onItemCollapse: (id: string) => void;
+    expressionChangeHandler: (expression: any) => void;
+    fetchSuggestions: (autoCompleteTrigger: AutoCompleteTriggerChar, cursorPosition: CursorPosition) => Promise<import("@pega/cosmos-react-build").SuggestionType[] | undefined>;
+    suggestionItemsToRender: (MenuItemProps & {
+        key?: string;
+    })[];
+    inputKeydownHandler: (e: React.KeyboardEvent<HTMLInputElement>) => Promise<void>;
+    inputChangeHandler: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    expBuilderFilterChangeHandler: (value: string) => void;
+    expBuilderSearchChangeHandler: (value: string) => void;
+    suggestionItemClickHandler: (id: MenuItemProps["id"]) => void;
+    resetExpression: () => void;
+};
+//# sourceMappingURL=useMockExpression.d.ts.map

package/jsx/build/Expression/useMockExpression.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMockExpression.d.ts","sourceRoot":"","sources":["../../../src/build/Expression/useMockExpression.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAA4B,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvF,OAAO,KAAK,EAEV,sBAAsB,EACtB,mBAAmB,EAEnB,WAAW,EAEX,uBAAuB,EACvB,cAAc,EACf,MAAM,0BAA0B,CAAC;AAgBlC,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,WAAsB,EACtB,gCAAgC,EAChC,aAAa,EACd,EAAE;IACD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;;;;;;cACoD,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yCAsI3C;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE;yCAUS;QAAE,KAAK,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE;oBAc5D,mBAAmB,CAAC,IAAI,CAAC,iBACd,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI;uBAqBnB,MAAM;yBA4CJ,MAAM;;;;cAhOiB,MAAM;;6BAuTnB,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC;4BAa5C,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC;2CA/KpB,MAAM;2CAIN,MAAM;qCA0IZ,aAAa,CAAC,IAAI,CAAC;;EA2F5D"}