npm - @pega/cosmos-react-demos - Versions diffs - 3.0.0-dev.9.0 → 3.0.0-rc.2 - Mend

@pega/cosmos-react-demos 3.0.0-dev.9.0 → 3.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 (987) hide show

package/lib/build/PageTemplates/PageTemplates.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplates.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/PageTemplates.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,~~EAAiC~~,UAAU,EAAE,MAAM,OAAO,CAAC;~~AAGlE~~,OAAO,~~EAUL~~,WAAW,EACX,iBAAiB,~~EAClB~~,MAAM,yBAAyB,CAAC;AAMjC,OAAO,EAGL,aAAa,EAEd,MAAM,uBAAuB,CAAC;;AAE/B,wBAKU;AAEV,MAAM,WAAW,uBAAwB,SAAQ,iBAAiB;IAChE,QAAQ,CAAC,EACL,YAAY,GACZ,YAAY,GACZ,cAAc,GACd,aAAa,GACb,aAAa,GACb,aAAa,GACb,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,GACpB,QAAQ,CAAC;IACb,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACrD;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,uBAAuB,GAAG,aAAa,CAiQ5E,CAAC"}
1	+ {"version":3,"file":"PageTemplates.stories.d.ts","sourceRoot":"","sources":["../../../src/build/PageTemplates/PageTemplates.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAqB,UAAU,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EASL,WAAW,EACX,iBAAiB,EAElB,MAAM,yBAAyB,CAAC;AAMjC,OAAO,EAGL,aAAa,EAEd,MAAM,uBAAuB,CAAC;;AAE/B,wBAKU;AAEV,MAAM,WAAW,uBAAwB,SAAQ,iBAAiB;IAChE,QAAQ,CAAC,EACL,YAAY,GACZ,YAAY,GACZ,cAAc,GACd,aAAa,GACb,aAAa,GACb,aAAa,GACb,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,GACpB,QAAQ,CAAC;IACb,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACrD;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,uBAAuB,GAAG,aAAa,CAiQ5E,CAAC"}

package/lib/build/PageTemplates/PageTemplates.stories.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useMemo, useContext } from 'react';
+import { useState, useMemo } from 'react';
 import { action } from '@storybook/addon-actions';
-import { Button, Banner, Configuration, Modal, ModalManagerContext, BuildTheme, Flex, Text, Actions } from '@pega/cosmos-react-core';
+import { Button, Banner, Configuration, Modal, BuildTheme, Flex, Text, Actions, useModalManager } from '@pega/cosmos-react-core';
 import { TabbedPage, OneColumnPage, ObjectPreview } from '@pega/cosmos-react-build';
 import { TableDemo } from '../../core/Table/Table.stories';
 import { WorkbenchDemo } from '../Workbench/Workbench.stories';
@@ -13,7 +13,7 @@ export default {
     }
 };
 export const PageTemplatesDemo = (args) => {
-    const { create } = useContext(ModalManagerContext);
+    const { create } = useModalManager();
     const getPath = () => {
         if (args.showBreadcrumbs) {
             const path = args.pathData;

package/lib/build/PageTemplates/PageTemplates.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplates.stories.js","sourceRoot":"","sources":["../../../src/build/PageTemplates/PageTemplates.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words XPTI\nimport { Meta, Story } from '@storybook/react';\nimport { useState, useMemo, useContext, MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n Button,\n Banner,\n Configuration,\n Modal,\n ModalManagerContext,\n BuildTheme,\n Flex,\n Text,\n Actions,\n StatusProps,\n PageTemplateProps\n} from '@pega/cosmos-react-core';\nimport { AppShellProps, TabbedPage, OneColumnPage, ObjectPreview } from '@pega/cosmos-react-build';\n\nimport { TableDemo } from '../../core/Table/Table.stories';\nimport { WorkbenchDemo } from '../Workbench/Workbench.stories';\n\nimport {\n OneColumnForm,\n AppShellWithMenuNavigation,\n AppShellStory,\n PreviewMainContent\n} from './PageTemplates.mocks';\n\nexport default {\n title: 'Build/PageTemplates',\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nexport interface PageTemplatesStoryProps extends PageTemplateProps {\n template?:\n \| 'one column'\n \| 'two column'\n \| 'three column'\n \| 'four column'\n \| 'wide narrow'\n \| 'narrow wide'\n \| 'wide wide narrow'\n \| 'narrow wide wide'\n \| 'narrow wide narrow'\n \| 'tabbed';\n showBreadcrumbs?: boolean;\n pathData?: string;\n showActions?: boolean;\n showBanners?: boolean;\n subTitle?: string;\n showStatus?: boolean;\n statusVariant?: StatusProps['variant'];\n statusLabel?: string;\n showEditButton?: boolean;\n onEdit?: (e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const PageTemplatesDemo: Story<PageTemplatesStoryProps & AppShellStory> = (\n args: PageTemplatesStoryProps & AppShellStory\n) => {\n const { create } = useContext(ModalManagerContext);\n\n const getPath = () => {\n if (args.showBreadcrumbs) {\n const path = args.pathData;\n\n return path\n ? path.split(',').map((crumb: string, i) => {\n // FIXME: https://stackoverflow.com/questions/63616486/property-replaceall-does-not-exist-on-type-string\n return {\n id: crumb,\n primary: crumb,\n href: i < 3 ? `#${(crumb as any).replace(/\\s/g, '-')}` : undefined\n };\n })\n : [];\n }\n };\n\n const actions: PageTemplateProps['actions'] = args.showActions ? (\n <Flex container>\n <Button variant='primary'>Save</Button>\n <Actions\n menuAt={2}\n items={[\n {\n id: '1',\n text: 'Page action 1'\n },\n {\n id: '2',\n text: 'Page action 2'\n }\n ]}\n />\n </Flex>\n ) : undefined;\n\n const banners: PageTemplateProps['banners'] = args.showBanners ? (\n <Banner\n id='warning-banner'\n variant='warning'\n messages={['This is a warning banner. You have been warned!']}\n />\n ) : undefined;\n\n const mainContent = <OneColumnForm />;\n const modal = () => (\n <Configuration theme={BuildTheme}>\n <Modal heading='This is the Modal heading' autoWidth={false} center stretch={false}>\n <Text>This is the content of the Modal.</Text>\n </Modal>\n </Configuration>\n );\n\n const pageTemplateProps = useMemo(() => {\n const status = args.showStatus\n ? {\n type: args.statusVariant \|\| 'pending',\n label: args.statusLabel \|\| 'private change'\n }\n : undefined;\n\n return {\n title: args.title,\n actions,\n banners,\n path: getPath(),\n status,\n metadata: [\n { id: '1', name: 'ID', value: 'InterestRate' },\n { id: '2', name: 'Rule type', value: 'Field' },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n { id: '4', name: 'Application', value: 'XCompass' }\n ],\n additionalInfo: {\n title: 'Interest rate',\n description: 'Interest rate for the savings account',\n fields: [\n {\n id: '1',\n name: 'Id',\n value: 'InterestRate'\n },\n {\n id: '2',\n name: 'Rule type',\n value: 'Field'\n },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n {\n id: '4',\n name: 'Branch',\n value: 'xCompass (Main)'\n },\n {\n id: '5',\n name: 'Application',\n value: 'XCompass'\n }\n ],\n onEdit: args.showEditButton\n ? (e: MouseEvent<HTMLButtonElement>) => {\n args.onEdit?.(e);\n create(modal);\n }\n : undefined\n }\n };\n }, [args]);\n\n const [tabs, setTabs] = useState([\n { id: 'accounts', name: 'Accounts', content: <TableDemo /> },\n { id: 'form', name: 'Form', content: null },\n { id: 'workbench', name: 'Workbench', content: null }\n ]);\n\n let demo;\n const [openDrawer, setOpenDrawer] = useState(false);\n\n switch (args.template) {\n case 'one column':\n demo = <OneColumnPage a={mainContent} {...pageTemplateProps} />;\n break;\n case 'tabbed':\n default:\n demo = (\n <>\n <TabbedPage\n tabs={{\n tabs,\n type: 'horizontal',\n onTabClick: id => {\n // eslint-disable-next-line sonarjs/no-nested-switch\n switch (id) {\n case 'form':\n if (tabs[1].content === null) {\n const updatedTabs = [...tabs];\n updatedTabs[1].content = (\n <OneColumnForm\n previewCallback={() => {\n setOpenDrawer(true);\n }}\n />\n );\n\n setTabs(updatedTabs);\n }\n break;\n case 'workbench':\n if (tabs[2].content === null) {\n const updatedTabs = [...tabs];\n updatedTabs[2].content = <WorkbenchDemo />;\n\n setTabs(updatedTabs);\n }\n break;\n default:\n }\n }\n }}\n {...pageTemplateProps}\n />\n <ObjectPreview\n open={openDrawer}\n onDismiss={() => setOpenDrawer(false)}\n header={{\n title: 'Interest rate',\n metadata: [\n { id: '1', name: 'ID', value: 'InterestRate' },\n { id: '2', name: 'Rule type', value: 'Field' },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n { id: '4', name: 'Application', value: 'XCompass' }\n ],\n additionalInfo: {\n title: 'Interest rate',\n description: 'Interest rate for the savings account',\n fields: [\n {\n id: '1',\n name: 'Id',\n value: 'InterestRate'\n },\n {\n id: '2',\n name: 'Rule type',\n value: 'Field'\n },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n {\n id: '4',\n name: 'Branch',\n value: 'xCompass (Main)'\n },\n {\n id: '5',\n name: 'Application',\n value: 'XCompass'\n }\n ],\n onEdit: () => {}\n }\n }}\n content={<PreviewMainContent />}\n primaryAction={{\n id: 'PA',\n text: 'Save',\n onClick: () => {}\n }}\n secondaryAction={{\n id: 'SA',\n text: 'Open rule',\n onClick: () => {}\n }}\n additionalActions={{\n items: [\n {\n id: '1',\n text: 'Page action 1'\n },\n {\n id: '2',\n text: 'Page action 2'\n }\n ]\n }}\n />\n </>\n );\n break;\n }\n\n return (\n <AppShellWithMenuNavigation\n main={demo as AppShellProps['main']}\n hideNavigation={args.hideNavigation}\n />\n );\n};\n\nPageTemplatesDemo.args = {\n template: 'tabbed',\n title: 'Interest rate',\n subTitle: 'Uplus-Data-Integrations',\n hideNavigation: false,\n showBreadcrumbs: true,\n pathData: 'Home,xCompass,Fields',\n showActions: true,\n showBanners: false,\n showStatus: true,\n statusVariant: 'pending',\n statusLabel: 'private change',\n showEditButton: true,\n // eslint-disable-next-line demo-patterns/literal-args\n onEdit: action('Clicked edit button in popover')\n};\n\nPageTemplatesDemo.argTypes = {\n template: {\n options: ['one column', 'tabbed'],\n control: { type: 'select' }\n },\n subTitle: { control: { type: 'text' } },\n title: { control: { type: 'text' } },\n hideNavigation: { control: { type: 'boolean' } },\n showBreadcrumbs: { control: { type: 'boolean' } },\n pathData: { control: { type: 'text' } },\n showActions: { control: { type: 'boolean' } },\n showBanners: { control: { type: 'boolean' } },\n showStatus: { control: { type: 'boolean' } },\n statusVariant: {\n options: ['success', 'urgent', 'warn', 'pending', 'info'],\n control: { type: 'select' }\n },\n statusLabel: { control: { type: 'text' } },\n showEditButton: { control: { type: 'boolean' } },\n onEdit: { table: { disable: true } }\n};\n"]}
1	+ {"version":3,"file":"PageTemplates.stories.js","sourceRoot":"","sources":["../../../src/build/PageTemplates/PageTemplates.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words XPTI\nimport { Meta, Story } from '@storybook/react';\nimport { useState, useMemo, MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n Button,\n Banner,\n Configuration,\n Modal,\n BuildTheme,\n Flex,\n Text,\n Actions,\n StatusProps,\n PageTemplateProps,\n useModalManager\n} from '@pega/cosmos-react-core';\nimport { AppShellProps, TabbedPage, OneColumnPage, ObjectPreview } from '@pega/cosmos-react-build';\n\nimport { TableDemo } from '../../core/Table/Table.stories';\nimport { WorkbenchDemo } from '../Workbench/Workbench.stories';\n\nimport {\n OneColumnForm,\n AppShellWithMenuNavigation,\n AppShellStory,\n PreviewMainContent\n} from './PageTemplates.mocks';\n\nexport default {\n title: 'Build/PageTemplates',\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nexport interface PageTemplatesStoryProps extends PageTemplateProps {\n template?:\n \| 'one column'\n \| 'two column'\n \| 'three column'\n \| 'four column'\n \| 'wide narrow'\n \| 'narrow wide'\n \| 'wide wide narrow'\n \| 'narrow wide wide'\n \| 'narrow wide narrow'\n \| 'tabbed';\n showBreadcrumbs?: boolean;\n pathData?: string;\n showActions?: boolean;\n showBanners?: boolean;\n subTitle?: string;\n showStatus?: boolean;\n statusVariant?: StatusProps['variant'];\n statusLabel?: string;\n showEditButton?: boolean;\n onEdit?: (e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const PageTemplatesDemo: Story<PageTemplatesStoryProps & AppShellStory> = (\n args: PageTemplatesStoryProps & AppShellStory\n) => {\n const { create } = useModalManager();\n\n const getPath = () => {\n if (args.showBreadcrumbs) {\n const path = args.pathData;\n\n return path\n ? path.split(',').map((crumb: string, i) => {\n // FIXME: https://stackoverflow.com/questions/63616486/property-replaceall-does-not-exist-on-type-string\n return {\n id: crumb,\n primary: crumb,\n href: i < 3 ? `#${(crumb as any).replace(/\\s/g, '-')}` : undefined\n };\n })\n : [];\n }\n };\n\n const actions: PageTemplateProps['actions'] = args.showActions ? (\n <Flex container>\n <Button variant='primary'>Save</Button>\n <Actions\n menuAt={2}\n items={[\n {\n id: '1',\n text: 'Page action 1'\n },\n {\n id: '2',\n text: 'Page action 2'\n }\n ]}\n />\n </Flex>\n ) : undefined;\n\n const banners: PageTemplateProps['banners'] = args.showBanners ? (\n <Banner\n id='warning-banner'\n variant='warning'\n messages={['This is a warning banner. You have been warned!']}\n />\n ) : undefined;\n\n const mainContent = <OneColumnForm />;\n const modal = () => (\n <Configuration theme={BuildTheme}>\n <Modal heading='This is the Modal heading' autoWidth={false} center stretch={false}>\n <Text>This is the content of the Modal.</Text>\n </Modal>\n </Configuration>\n );\n\n const pageTemplateProps = useMemo(() => {\n const status = args.showStatus\n ? {\n type: args.statusVariant \|\| 'pending',\n label: args.statusLabel \|\| 'private change'\n }\n : undefined;\n\n return {\n title: args.title,\n actions,\n banners,\n path: getPath(),\n status,\n metadata: [\n { id: '1', name: 'ID', value: 'InterestRate' },\n { id: '2', name: 'Rule type', value: 'Field' },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n { id: '4', name: 'Application', value: 'XCompass' }\n ],\n additionalInfo: {\n title: 'Interest rate',\n description: 'Interest rate for the savings account',\n fields: [\n {\n id: '1',\n name: 'Id',\n value: 'InterestRate'\n },\n {\n id: '2',\n name: 'Rule type',\n value: 'Field'\n },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n {\n id: '4',\n name: 'Branch',\n value: 'xCompass (Main)'\n },\n {\n id: '5',\n name: 'Application',\n value: 'XCompass'\n }\n ],\n onEdit: args.showEditButton\n ? (e: MouseEvent<HTMLButtonElement>) => {\n args.onEdit?.(e);\n create(modal);\n }\n : undefined\n }\n };\n }, [args]);\n\n const [tabs, setTabs] = useState([\n { id: 'accounts', name: 'Accounts', content: <TableDemo /> },\n { id: 'form', name: 'Form', content: null },\n { id: 'workbench', name: 'Workbench', content: null }\n ]);\n\n let demo;\n const [openDrawer, setOpenDrawer] = useState(false);\n\n switch (args.template) {\n case 'one column':\n demo = <OneColumnPage a={mainContent} {...pageTemplateProps} />;\n break;\n case 'tabbed':\n default:\n demo = (\n <>\n <TabbedPage\n tabs={{\n tabs,\n type: 'horizontal',\n onTabClick: id => {\n // eslint-disable-next-line sonarjs/no-nested-switch\n switch (id) {\n case 'form':\n if (tabs[1].content === null) {\n const updatedTabs = [...tabs];\n updatedTabs[1].content = (\n <OneColumnForm\n previewCallback={() => {\n setOpenDrawer(true);\n }}\n />\n );\n\n setTabs(updatedTabs);\n }\n break;\n case 'workbench':\n if (tabs[2].content === null) {\n const updatedTabs = [...tabs];\n updatedTabs[2].content = <WorkbenchDemo />;\n\n setTabs(updatedTabs);\n }\n break;\n default:\n }\n }\n }}\n {...pageTemplateProps}\n />\n <ObjectPreview\n open={openDrawer}\n onDismiss={() => setOpenDrawer(false)}\n header={{\n title: 'Interest rate',\n metadata: [\n { id: '1', name: 'ID', value: 'InterestRate' },\n { id: '2', name: 'Rule type', value: 'Field' },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n { id: '4', name: 'Application', value: 'XCompass' }\n ],\n additionalInfo: {\n title: 'Interest rate',\n description: 'Interest rate for the savings account',\n fields: [\n {\n id: '1',\n name: 'Id',\n value: 'InterestRate'\n },\n {\n id: '2',\n name: 'Rule type',\n value: 'Field'\n },\n {\n id: '3',\n name: 'Scope',\n value: 'O1XPTI-CCompass-Work-MortgageRequest'\n },\n {\n id: '4',\n name: 'Branch',\n value: 'xCompass (Main)'\n },\n {\n id: '5',\n name: 'Application',\n value: 'XCompass'\n }\n ],\n onEdit: () => {}\n }\n }}\n content={<PreviewMainContent />}\n primaryAction={{\n id: 'PA',\n text: 'Save',\n onClick: () => {}\n }}\n secondaryAction={{\n id: 'SA',\n text: 'Open rule',\n onClick: () => {}\n }}\n additionalActions={{\n items: [\n {\n id: '1',\n text: 'Page action 1'\n },\n {\n id: '2',\n text: 'Page action 2'\n }\n ]\n }}\n />\n </>\n );\n break;\n }\n\n return (\n <AppShellWithMenuNavigation\n main={demo as AppShellProps['main']}\n hideNavigation={args.hideNavigation}\n />\n );\n};\n\nPageTemplatesDemo.args = {\n template: 'tabbed',\n title: 'Interest rate',\n subTitle: 'Uplus-Data-Integrations',\n hideNavigation: false,\n showBreadcrumbs: true,\n pathData: 'Home,xCompass,Fields',\n showActions: true,\n showBanners: false,\n showStatus: true,\n statusVariant: 'pending',\n statusLabel: 'private change',\n showEditButton: true,\n // eslint-disable-next-line demo-patterns/literal-args\n onEdit: action('Clicked edit button in popover')\n};\n\nPageTemplatesDemo.argTypes = {\n template: {\n options: ['one column', 'tabbed'],\n control: { type: 'select' }\n },\n subTitle: { control: { type: 'text' } },\n title: { control: { type: 'text' } },\n hideNavigation: { control: { type: 'boolean' } },\n showBreadcrumbs: { control: { type: 'boolean' } },\n pathData: { control: { type: 'text' } },\n showActions: { control: { type: 'boolean' } },\n showBanners: { control: { type: 'boolean' } },\n showStatus: { control: { type: 'boolean' } },\n statusVariant: {\n options: ['success', 'urgent', 'warn', 'pending', 'info'],\n control: { type: 'select' }\n },\n statusLabel: { control: { type: 'text' } },\n showEditButton: { control: { type: 'boolean' } },\n onEdit: { table: { disable: true } }\n};\n"]}

package/lib/build/Workbench/Workbench.stories.d.ts CHANGED Viewed

@@ -7,4 +7,5 @@ export interface WorkbenchStoryProps {
     zoom?: boolean;
 }
 export declare const WorkbenchDemo: Story<WorkbenchStoryProps>;
+export declare const WorkbenchWithLifecycleDemo: Story<WorkbenchStoryProps>;
 //# sourceMappingURL=Workbench.stories.d.ts.map

package/lib/build/Workbench/Workbench.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Workbench.stories.d.ts","sourceRoot":"","sources":["../../../src/build/Workbench/Workbench.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;~~AAqC~~/C,~~wBAYU~~;AAEV,MAAM,WAAW,mBAAmB;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,mBAAmB,~~CA+HpD~~,CAAC"}
1	+ {"version":3,"file":"Workbench.stories.d.ts","sourceRoot":"","sources":["../../../src/build/Workbench/Workbench.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAyD/C,wBAaU;AAEV,MAAM,WAAW,mBAAmB;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,mBAAmB,CAiIpD,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,mBAAmB,CAyPjE,CAAC"}

package/lib/build/Workbench/Workbench.stories.js CHANGED Viewed

@@ -1,13 +1,16 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { treeHelpers, StandardTree, Flex, SearchInput, TextArea, Input, Configuration, BuildTheme } from '@pega/cosmos-react-core';
-import { FlowModeller, Workbench } from '@pega/cosmos-react-build';
+import { FlowModeller, LifeCycle, Workbench } from '@pega/cosmos-react-build';
 import { DirectedGraph } from '@pega/cosmos-react-build/lib/components/FlowModeller/Renderer/Utils/Graph';
 import FlowModellerHelper from '@pega/cosmos-react-build/lib/components/FlowModeller/helper';
-import { nodeLibrary, nodeActions, exampleCRMNodesData as nodesData, exampleCRMConnectorsData as connectorsData } from '../FlowModeller/FlowModeller.mocks';
+import { nodeLibrary, nodeActions, exampleCRMNodesData as nodesData, exampleCRMConnectorsData as connectorsData, FlowShapeType } from '../FlowModeller/FlowModeller.mocks';
+import { LifeCycleWorkFlowData, workFlowNodeLibrary } from '../LifeCycle/LifeCycle.mocks';
+import { addStageCallback, addStepCallback, addTaskCallback, deleteStageCallback, deleteStepCallback, deleteTaskCallback } from '../LifeCycle/utils';
 import { sideList } from './Workbench.mocks';
 export default {
     title: 'Build/Workbench',
+    component: Workbench,
     parameters: {
         layout: 'fullscreen'
     },
@@ -50,13 +53,15 @@ export const WorkbenchDemo = (args) => {
             setOpen(true);
         };
         const addNode = (nodeType, metaData) => {
+            const isBranchNode = nodeType.id === FlowShapeType.GOTO.id;
             const UpdatedData = FlowModellerHelper.addNode({
                 nodeType,
                 graphData,
+                isBranchNode,
                 metaData
             });
             if (UpdatedData) {
-                const newGraphData = UpdatedData;
+                const newGraphData = UpdatedData.graphData;
                 setGraphData(newGraphData);
             }
         };
@@ -90,6 +95,193 @@ export const WorkbenchDemo = (args) => {
                 }
             }, children: _jsx(FlowChartView, {}) }) }));
 };
+export const WorkbenchWithLifecycleDemo = () => {
+    const [open, setOpen] = useState(false);
+    const [heading, setHeading] = useState('');
+    const ConfigContent = () => {
+        return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Input, { defaultValue: heading }), _jsx(TextArea, { name: 'Description', required: true, label: 'Description', displayCharCount: true, maxLength: 300, value: '' })] }));
+    };
+    const WorkFlowView = () => {
+        const workFlowState = {
+            activeElementId: '',
+            data: LifeCycleWorkFlowData
+        };
+        const [workFlowData, setWorkFlowData] = useState(workFlowState);
+        const addProcessStep = (stepData, libItem) => {
+            const newStep = {
+                id: libItem.id,
+                label: libItem.primary,
+                visual: {
+                    color: libItem.type.color,
+                    icon: libItem.type.icon
+                },
+                error: '',
+                status: { label: '' }
+            };
+            const updatedTask = {
+                ...stepData.task,
+                steps: [...stepData.task.steps, newStep]
+            };
+            const updatedData = { ...stepData, task: updatedTask };
+            const changedData = addStepCallback(updatedData, workFlowData);
+            setWorkFlowData(changedData);
+        };
+        const deleteProcessStep = (stepData) => {
+            const changedData = deleteStepCallback(stepData, workFlowData);
+            setWorkFlowData(changedData);
+        };
+        const addProcess = (taskData) => {
+            const changedData = addTaskCallback(taskData, workFlowData);
+            setWorkFlowData(changedData);
+        };
+        const addParallelProcess = (taskData) => {
+            const changedData = addTaskCallback(taskData, workFlowData, true);
+            setWorkFlowData(changedData);
+        };
+        const deleteProcess = (taskData) => {
+            const changedData = deleteTaskCallback(taskData, workFlowData);
+            setWorkFlowData(changedData);
+        };
+        const configureProcess = () => {
+            setHeading('Configure Process');
+            setOpen(true);
+        };
+        const onAddStage = () => {
+            const changedData = addStageCallback(workFlowData, 'stages');
+            setWorkFlowData(changedData);
+        };
+        const onAddAlternateStage = () => {
+            const changedData = addStageCallback(workFlowData, 'alternateStages');
+            setWorkFlowData(changedData);
+        };
+        const onDeleteStage = param => {
+            const changedData = deleteStageCallback(param, workFlowData);
+            if (changedData === 'firstStage') {
+                // eslint-disable-next-line no-alert
+                alert("you can't delete the create stage");
+            }
+            else {
+                setWorkFlowData(changedData);
+            }
+        };
+        const stepInputFocus = () => { };
+        const stepInputBlur = () => { };
+        const stepInputChange = () => { };
+        const taskInputFocus = () => { };
+        const taskInputBlur = () => { };
+        const taskInputChange = () => { };
+        const onStageInputFocus = () => { };
+        const onStageInputBlur = () => { };
+        const onStageInputChange = () => { };
+        const onAlternateStageInputChange = () => { };
+        useEffect(() => {
+            if (workFlowData.activeElementId) {
+                const elementId = document.getElementById(`${workFlowData.activeElementId}`);
+                if (elementId) {
+                    elementId.focus();
+                }
+            }
+        });
+        const stages = workFlowData.data.stages;
+        const alternateStages = workFlowData.data.alternateStages;
+        const categories = LifeCycleWorkFlowData.categories;
+        return (_jsx(LifeCycle, { items: stages, alternateItems: alternateStages, categories: categories, task: [
+                {
+                    actions: [
+                        {
+                            text: 'Delete Process',
+                            id: 'delete9',
+                            icon: 'trash',
+                            onClick: deleteProcess
+                        },
+                        {
+                            text: 'Configure Process',
+                            id: 'share2',
+                            icon: 'share',
+                            onClick: configureProcess
+                        }
+                    ],
+                    addStepTitle: 'step',
+                    addTask: {
+                        title: 'Process',
+                        showOnce: true,
+                        onAddTask: addProcess
+                    },
+                    onFocus: taskInputFocus,
+                    onBlur: taskInputBlur,
+                    onChange: taskInputChange,
+                    onAddStep: addProcessStep,
+                    nodeLibrary: workFlowNodeLibrary
+                }
+            ], step: [
+                {
+                    actions: [
+                        {
+                            text: 'Delete step',
+                            id: 'delete10',
+                            icon: 'trash',
+                            onClick: deleteProcessStep
+                        }
+                    ],
+                    onFocus: stepInputFocus,
+                    onBlur: stepInputBlur,
+                    onChange: stepInputChange
+                    // disabled: true
+                }
+            ], stage: {
+                actions: {
+                    start: [
+                        { text: 'Add Process', id: 'add1', onClick: addProcess },
+                        { text: 'Add Parallel Process', id: 'add3', onClick: addParallelProcess },
+                        { text: 'Add Alternate Stage', id: 'add2', onClick: onAddAlternateStage }
+                    ],
+                    default: [
+                        { text: 'Add Process', id: 'add1', onClick: addProcess },
+                        { text: 'Add Parallel Process', id: 'add3', onClick: addParallelProcess },
+                        { text: 'Add Alternate Stage', id: 'add2', onClick: onAddAlternateStage },
+                        { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }
+                    ],
+                    'default-wait': [
+                        { text: 'Add Process', id: 'add1', onClick: addProcess },
+                        { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }
+                    ],
+                    resolution: [],
+                    alternate: [
+                        { text: 'Add Process', id: 'add1', onClick: addProcess },
+                        { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }
+                    ],
+                    'alternate-wait': [
+                        { text: 'Add Process', id: 'add1', onClick: addProcess },
+                        { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }
+                    ]
+                },
+                onFocus: onStageInputFocus,
+                onBlur: onStageInputBlur,
+                onChange: onStageInputChange
+            }, alternateStage: {
+                actions: [
+                    { text: 'Add Process', id: 'add1', onClick: addProcess },
+                    { text: 'Add Parallel Process', id: 'add3', onClick: addParallelProcess },
+                    { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }
+                ],
+                onChange: onAlternateStageInputChange
+            }, onAddStage: onAddStage, onAddAlternateStage: onAddAlternateStage }));
+    };
+    const toolbarActions = {
+        undo: { id: 'undo', disabled: false, onClick: () => { } },
+        redo: { id: 'redo', disabled: true, onClick: () => { } }
+    };
+    return (_jsx(Configuration, { theme: BuildTheme, children: _jsx(Workbench, { initiallyVisiblePanelId: undefined, toolbar: {
+                toolbarActions
+            }, configurationPanel: {
+                open,
+                content: _jsx(ConfigContent, {}),
+                header: heading,
+                onDismiss: () => {
+                    setOpen(false);
+                }
+            }, children: _jsx(WorkFlowView, {}) }) }));
+};
 WorkbenchDemo.args = {
     showActions: true,
     hideSidePanel: false

package/lib/build/Workbench/Workbench.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Workbench.stories.js","sourceRoot":"","sources":["../../../src/build/Workbench/Workbench.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport {\n StandardTreeProps,\n treeHelpers,\n StandardTree,\n Flex,\n SearchInput,\n TextArea,\n Input,\n Configuration,\n BuildTheme\n} from '@pega/cosmos-react-core';\nimport { FlowModeller, Workbench } from '@pega/cosmos-react-build';\nimport { IconNames } from '@pega/cosmos-react-core/lib/components/Icon/iconNames';\nimport {\n NodeProps,\n NodeType\n} from '@pega/cosmos-react-build/lib/components/FlowModeller/Node/Node.types';\nimport {\n DirectedGraph,\n GraphData,\n ConnectorProps\n} from '@pega/cosmos-react-build/lib/components/FlowModeller/Renderer/Utils/Graph';\nimport FlowModellerHelper from '@pega/cosmos-react-build/lib/components/FlowModeller/helper';\nimport { AddNodeHandlerParams } from '@pega/cosmos-react-build/lib/components/FlowModeller/Renderer/Renderer.types';\n\nimport {\n nodeLibrary,\n nodeActions,\n exampleCRMNodesData as nodesData,\n exampleCRMConnectorsData as connectorsData\n} from '../FlowModeller/FlowModeller.mocks';\n\nimport { sideList } from './Workbench.mocks';\n\nexport default {\n title: 'Build/Workbench',\n parameters: {\n layout: 'fullscreen'\n },\n decorators: [\n StoryComp => (\n <div style={{ height: '100vh' }}>\n <StoryComp />\n </div>\n )\n ]\n} as Meta;\n\nexport interface WorkbenchStoryProps {\n showActions?: boolean;\n hideSidePanel?: boolean;\n zoom?: boolean;\n}\n\nexport const WorkbenchDemo: Story<WorkbenchStoryProps> = (args: WorkbenchStoryProps) => {\n const [open, setOpen] = useState(false);\n const [heading, setHeading] = useState('');\n const [description, setDescription] = useState('');\n const Content = () => {\n const [currentNodeId, setCurrentNodeId] = useState<string \| undefined>();\n const [allNodes, setAllNodes] = useState<StandardTreeProps['nodes']>(sideList);\n\n return (\n <>\n <SearchInput />\n <StandardTree\n currentNodeId={currentNodeId}\n nodes={allNodes}\n onNodeClick={id => {\n const clickedNode = treeHelpers.getNode(allNodes, id);\n setCurrentNodeId(id);\n // If a leaf node, just set to current\n if (!clickedNode?.nodes) return;\n\n setAllNodes(tree =>\n treeHelpers.mapNode(tree, id, node => {\n return {\n ...node,\n expanded: !node.expanded\n };\n })\n );\n }}\n />\n </>\n );\n };\n\n const ConfigContent = () => {\n return (\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input defaultValue={heading} />\n <TextArea\n name='Description'\n required\n label='Description'\n displayCharCount\n maxLength={300}\n value={description}\n />\n </Flex>\n );\n };\n\n const FlowChartView = () => {\n const [graphData, setGraphData] = useState<GraphData<NodeProps, ConnectorProps>>({\n nodes: nodesData,\n connectors: connectorsData\n });\n\n const launchPropertyModal = (node: NodeProps) => {\n setHeading(node.label);\n setDescription(node.description \|\| '');\n setOpen(true);\n };\n\n const addNode = (nodeType: NodeType, metaData: AddNodeHandlerParams) => {\n const UpdatedData = FlowModellerHelper.addNode({\n nodeType,\n graphData,\n metaData\n });\n if (UpdatedData) {\n const newGraphData: GraphData<NodeProps, ConnectorProps> = UpdatedData;\n setGraphData(newGraphData);\n }\n };\n\n const selectNode = (nodeId: NodeProps['id']) => {\n const graph = new DirectedGraph(graphData);\n const node = graph.getNode(nodeId);\n launchPropertyModal(node);\n };\n\n return (\n <FlowModeller\n graphData={graphData}\n nodeLibrary={nodeLibrary}\n onNodeAdd={addNode}\n onNodeClick={selectNode}\n actions={nodeActions}\n />\n );\n };\n\n const ExplorerContent = () => {\n return <SearchInput />;\n };\n\n const utilityPanels = [\n { title: 'Steps', id: '1', icon: 'plus' as IconNames, content: <Content /> },\n { title: 'Explorer', id: '2', icon: 'app' as IconNames, content: <ExplorerContent /> },\n { title: 'Views', id: '3', icon: 'headline' as IconNames, content: <Content /> }\n ];\n\n const toolbarActions = {\n undo: { id: 'undo', disabled: false, onClick: () => {} },\n redo: { id: 'redo', disabled: true, onClick: () => {} }\n };\n\n return (\n <Configuration theme={BuildTheme}>\n <Workbench\n utilityPanels={utilityPanels}\n initiallyVisiblePanelId={utilityPanels[0].id}\n toolbar={{\n toolbarActions: args.showActions ? toolbarActions : undefined\n }}\n configurationPanel={{\n open,\n content: <ConfigContent />,\n header: heading,\n onDismiss: () => {\n setOpen(false);\n }\n }}\n >\n <FlowChartView />\n </Workbench>\n </Configuration>\n );\n};\n\nWorkbenchDemo.args = {\n showActions: true,\n hideSidePanel: false\n};\n\nWorkbenchDemo.argTypes = {\n showActions: { control: { type: 'boolean' } },\n hideSidePanel: { control: { type: 'boolean' } }\n};\n"]}
1	+ {"version":3,"file":"Workbench.stories.js","sourceRoot":"","sources":["../../../src/build/Workbench/Workbench.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useEffect, useState } from 'react';\n\nimport {\n StandardTreeProps,\n treeHelpers,\n StandardTree,\n Flex,\n SearchInput,\n TextArea,\n Input,\n Configuration,\n BuildTheme\n} from '@pega/cosmos-react-core';\nimport {\n CategoriesItemProps,\n FlowModeller,\n LibraryItem,\n LifeCycle,\n LifeCycleAction,\n LifeCycleActionParam,\n StageItemProps,\n StepItemProps,\n Workbench\n} from '@pega/cosmos-react-build';\nimport {\n NodeProps,\n NodeType\n} from '@pega/cosmos-react-build/lib/components/FlowModeller/Node/Node.types';\nimport {\n DirectedGraph,\n GraphData,\n ConnectorProps\n} from '@pega/cosmos-react-build/lib/components/FlowModeller/Renderer/Utils/Graph';\nimport FlowModellerHelper from '@pega/cosmos-react-build/lib/components/FlowModeller/helper';\nimport { AddNodeHandlerParams } from '@pega/cosmos-react-build/lib/components/FlowModeller/Renderer/Renderer.types';\n\nimport {\n nodeLibrary,\n nodeActions,\n exampleCRMNodesData as nodesData,\n exampleCRMConnectorsData as connectorsData,\n FlowShapeType\n} from '../FlowModeller/FlowModeller.mocks';\nimport { LifeCycleWorkFlowData, workFlowNodeLibrary } from '../LifeCycle/LifeCycle.mocks';\nimport {\n addStageCallback,\n addStepCallback,\n addTaskCallback,\n deleteStageCallback,\n deleteStepCallback,\n deleteTaskCallback,\n LifeCycleMockState\n} from '../LifeCycle/utils';\n\nimport { sideList } from './Workbench.mocks';\n\nexport default {\n title: 'Build/Workbench',\n component: Workbench,\n parameters: {\n layout: 'fullscreen'\n },\n decorators: [\n StoryComp => (\n <div style={{ height: '100vh' }}>\n <StoryComp />\n </div>\n )\n ]\n} as Meta;\n\nexport interface WorkbenchStoryProps {\n showActions?: boolean;\n hideSidePanel?: boolean;\n zoom?: boolean;\n}\n\nexport const WorkbenchDemo: Story<WorkbenchStoryProps> = (args: WorkbenchStoryProps) => {\n const [open, setOpen] = useState(false);\n const [heading, setHeading] = useState('');\n const [description, setDescription] = useState('');\n const Content = () => {\n const [currentNodeId, setCurrentNodeId] = useState<string \| undefined>();\n const [allNodes, setAllNodes] = useState<StandardTreeProps['nodes']>(sideList);\n\n return (\n <>\n <SearchInput />\n <StandardTree\n currentNodeId={currentNodeId}\n nodes={allNodes}\n onNodeClick={id => {\n const clickedNode = treeHelpers.getNode(allNodes, id);\n setCurrentNodeId(id);\n // If a leaf node, just set to current\n if (!clickedNode?.nodes) return;\n\n setAllNodes(tree =>\n treeHelpers.mapNode(tree, id, node => {\n return {\n ...node,\n expanded: !node.expanded\n };\n })\n );\n }}\n />\n </>\n );\n };\n\n const ConfigContent = () => {\n return (\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input defaultValue={heading} />\n <TextArea\n name='Description'\n required\n label='Description'\n displayCharCount\n maxLength={300}\n value={description}\n />\n </Flex>\n );\n };\n\n const FlowChartView = () => {\n const [graphData, setGraphData] = useState<GraphData<NodeProps, ConnectorProps>>({\n nodes: nodesData,\n connectors: connectorsData\n });\n\n const launchPropertyModal = (node: NodeProps) => {\n setHeading(node.label);\n setDescription(node.description \|\| '');\n setOpen(true);\n };\n\n const addNode = (nodeType: NodeType, metaData: AddNodeHandlerParams) => {\n const isBranchNode = nodeType.id === FlowShapeType.GOTO.id;\n const UpdatedData = FlowModellerHelper.addNode({\n nodeType,\n graphData,\n isBranchNode,\n metaData\n });\n if (UpdatedData) {\n const newGraphData: GraphData<NodeProps, ConnectorProps> = UpdatedData.graphData;\n setGraphData(newGraphData);\n }\n };\n\n const selectNode = (nodeId: NodeProps['id']) => {\n const graph = new DirectedGraph(graphData);\n const node = graph.getNode(nodeId);\n launchPropertyModal(node);\n };\n\n return (\n <FlowModeller\n graphData={graphData}\n nodeLibrary={nodeLibrary}\n onNodeAdd={addNode}\n onNodeClick={selectNode}\n actions={nodeActions}\n />\n );\n };\n\n const ExplorerContent = () => {\n return <SearchInput />;\n };\n\n const utilityPanels = [\n { title: 'Steps', id: '1', icon: 'plus' as const, content: <Content /> },\n { title: 'Explorer', id: '2', icon: 'app' as const, content: <ExplorerContent /> },\n { title: 'Views', id: '3', icon: 'headline' as const, content: <Content /> }\n ];\n\n const toolbarActions = {\n undo: { id: 'undo', disabled: false, onClick: () => {} },\n redo: { id: 'redo', disabled: true, onClick: () => {} }\n };\n\n return (\n <Configuration theme={BuildTheme}>\n <Workbench\n utilityPanels={utilityPanels}\n initiallyVisiblePanelId={utilityPanels[0].id}\n toolbar={{\n toolbarActions: args.showActions ? toolbarActions : undefined\n }}\n configurationPanel={{\n open,\n content: <ConfigContent />,\n header: heading,\n onDismiss: () => {\n setOpen(false);\n }\n }}\n >\n <FlowChartView />\n </Workbench>\n </Configuration>\n );\n};\n\nexport const WorkbenchWithLifecycleDemo: Story<WorkbenchStoryProps> = () => {\n const [open, setOpen] = useState(false);\n const [heading, setHeading] = useState('');\n\n const ConfigContent = () => {\n return (\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input defaultValue={heading} />\n <TextArea\n name='Description'\n required\n label='Description'\n displayCharCount\n maxLength={300}\n value=''\n />\n </Flex>\n );\n };\n\n const WorkFlowView = () => {\n const workFlowState = {\n activeElementId: '',\n data: LifeCycleWorkFlowData\n } as LifeCycleMockState;\n\n const [workFlowData, setWorkFlowData] = useState(workFlowState);\n\n const addProcessStep = (stepData: LifeCycleActionParam, libItem: LibraryItem) => {\n const newStep: StepItemProps = {\n id: libItem.id,\n label: libItem.primary,\n visual: {\n color: libItem.type.color as StepItemProps['visual']['color'],\n icon: libItem.type.icon\n } as StepItemProps['visual'],\n error: '',\n status: { label: '' }\n };\n const updatedTask = {\n ...stepData.task,\n steps: [...stepData.task!.steps, newStep]\n } as LifeCycleActionParam['task'];\n\n const updatedData: LifeCycleActionParam = { ...stepData, task: updatedTask };\n\n const changedData = addStepCallback(updatedData, workFlowData);\n setWorkFlowData(changedData);\n };\n\n const deleteProcessStep = (stepData: LifeCycleActionParam) => {\n const changedData = deleteStepCallback(stepData, workFlowData);\n setWorkFlowData(changedData);\n };\n\n const addProcess = (taskData: LifeCycleActionParam) => {\n const changedData = addTaskCallback(taskData, workFlowData);\n setWorkFlowData(changedData);\n };\n\n const addParallelProcess = (taskData: LifeCycleActionParam) => {\n const changedData = addTaskCallback(taskData, workFlowData, true);\n setWorkFlowData(changedData);\n };\n\n const deleteProcess = (taskData: LifeCycleActionParam) => {\n const changedData = deleteTaskCallback(taskData, workFlowData);\n setWorkFlowData(changedData);\n };\n\n const configureProcess = () => {\n setHeading('Configure Process');\n setOpen(true);\n };\n\n const onAddStage = () => {\n const changedData = addStageCallback(workFlowData, 'stages');\n setWorkFlowData(changedData);\n };\n\n const onAddAlternateStage = () => {\n const changedData = addStageCallback(workFlowData, 'alternateStages');\n setWorkFlowData(changedData);\n };\n\n const onDeleteStage: LifeCycleAction['onClick'] = param => {\n const changedData = deleteStageCallback(param, workFlowData);\n if (changedData === 'firstStage') {\n // eslint-disable-next-line no-alert\n alert(\"you can't delete the create stage\");\n } else {\n setWorkFlowData(changedData);\n }\n };\n\n const stepInputFocus = () => {};\n\n const stepInputBlur = () => {};\n\n const stepInputChange = () => {};\n\n const taskInputFocus = () => {};\n\n const taskInputBlur = () => {};\n\n const taskInputChange = () => {};\n\n const onStageInputFocus = () => {};\n\n const onStageInputBlur = () => {};\n\n const onStageInputChange = () => {};\n\n const onAlternateStageInputChange = () => {};\n useEffect(() => {\n if (workFlowData.activeElementId) {\n const elementId: HTMLElement \| null = document.getElementById(\n `${workFlowData.activeElementId}`\n );\n if (elementId) {\n elementId.focus();\n }\n }\n });\n\n const stages = workFlowData.data.stages as StageItemProps[];\n const alternateStages = workFlowData.data.alternateStages as StageItemProps[];\n const categories: CategoriesItemProps[] = LifeCycleWorkFlowData.categories;\n\n return (\n <LifeCycle\n items={stages}\n alternateItems={alternateStages}\n categories={categories}\n task={[\n {\n actions: [\n {\n text: 'Delete Process',\n id: 'delete9',\n icon: 'trash',\n onClick: deleteProcess\n },\n {\n text: 'Configure Process',\n id: 'share2',\n icon: 'share',\n onClick: configureProcess\n }\n ],\n addStepTitle: 'step',\n addTask: {\n title: 'Process',\n showOnce: true,\n onAddTask: addProcess\n },\n onFocus: taskInputFocus,\n onBlur: taskInputBlur,\n onChange: taskInputChange,\n onAddStep: addProcessStep,\n nodeLibrary: workFlowNodeLibrary\n }\n ]}\n step={[\n {\n actions: [\n {\n text: 'Delete step',\n id: 'delete10',\n icon: 'trash',\n onClick: deleteProcessStep\n }\n ],\n onFocus: stepInputFocus,\n onBlur: stepInputBlur,\n onChange: stepInputChange\n // disabled: true\n }\n ]}\n stage={{\n actions: {\n start: [\n { text: 'Add Process', id: 'add1', onClick: addProcess },\n { text: 'Add Parallel Process', id: 'add3', onClick: addParallelProcess },\n { text: 'Add Alternate Stage', id: 'add2', onClick: onAddAlternateStage }\n ],\n default: [\n { text: 'Add Process', id: 'add1', onClick: addProcess },\n { text: 'Add Parallel Process', id: 'add3', onClick: addParallelProcess },\n { text: 'Add Alternate Stage', id: 'add2', onClick: onAddAlternateStage },\n { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }\n ],\n 'default-wait': [\n { text: 'Add Process', id: 'add1', onClick: addProcess },\n { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }\n ],\n resolution: [],\n alternate: [\n { text: 'Add Process', id: 'add1', onClick: addProcess },\n { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }\n ],\n 'alternate-wait': [\n { text: 'Add Process', id: 'add1', onClick: addProcess },\n { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }\n ]\n },\n onFocus: onStageInputFocus,\n onBlur: onStageInputBlur,\n onChange: onStageInputChange\n }}\n alternateStage={{\n actions: [\n { text: 'Add Process', id: 'add1', onClick: addProcess },\n { text: 'Add Parallel Process', id: 'add3', onClick: addParallelProcess },\n { text: 'Delete Stage', id: 'delete11', onClick: onDeleteStage }\n ],\n onChange: onAlternateStageInputChange\n }}\n onAddStage={onAddStage}\n onAddAlternateStage={onAddAlternateStage}\n />\n );\n };\n\n const toolbarActions = {\n undo: { id: 'undo', disabled: false, onClick: () => {} },\n redo: { id: 'redo', disabled: true, onClick: () => {} }\n };\n\n return (\n <Configuration theme={BuildTheme}>\n <Workbench\n initiallyVisiblePanelId={undefined}\n toolbar={{\n toolbarActions\n }}\n configurationPanel={{\n open,\n content: <ConfigContent />,\n header: heading,\n onDismiss: () => {\n setOpen(false);\n }\n }}\n >\n <WorkFlowView />\n </Workbench>\n </Configuration>\n );\n};\n\nWorkbenchDemo.args = {\n showActions: true,\n hideSidePanel: false\n};\n\nWorkbenchDemo.argTypes = {\n showActions: { control: { type: 'boolean' } },\n hideSidePanel: { control: { type: 'boolean' } }\n};\n"]}

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.mocks.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 import { DateFunctionsByType, RHSType } from '@pega/cosmos-react-condition-builder';
-export declare const convertRhsTypes: (useLiteralRHSType: boolean, useFieldRHSType: boolean, useRelativeDatesType: boolean, dateFunctions?: DateFunctionsByType | undefined) => Set<RHSType>;
+export declare const convertRhsTypes: (useLiteralRHSType: boolean, useFieldRHSType: boolean, useRelativeDatesType: boolean, useParameterRHSType: boolean, dateFunctions?: DateFunctionsByType) => Set<RHSType>;
 //# sourceMappingURL=ConditionBuilder.mocks.d.ts.map

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.mocks.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConditionBuilder.mocks.d.ts","sourceRoot":"","sources":["../../../src/condition-builder/ConditionBuilder/ConditionBuilder.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,OAAO,EAAE,MAAM,sCAAsC,CAAC;AAEpF,eAAO,MAAM,eAAe,sBACP,OAAO,mBACT,OAAO,wBACF,OAAO,~~kEAS9B~~,CAAC"}
1	+ {"version":3,"file":"ConditionBuilder.mocks.d.ts","sourceRoot":"","sources":["../../../src/condition-builder/ConditionBuilder/ConditionBuilder.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,OAAO,EAAE,MAAM,sCAAsC,CAAC;AAEpF,eAAO,MAAM,eAAe,sBACP,OAAO,mBACT,OAAO,wBACF,OAAO,uBACR,OAAO,kBACZ,mBAAmB,iBASpC,CAAC"}

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.mocks.js CHANGED Viewed

@@ -1,4 +1,4 @@
-export const convertRhsTypes = (useLiteralRHSType, useFieldRHSType, useRelativeDatesType, dateFunctions) => {
+export const convertRhsTypes = (useLiteralRHSType, useFieldRHSType, useRelativeDatesType, useParameterRHSType, dateFunctions) => {
     const setRhsTypes = new Set();
     if (useLiteralRHSType)
         setRhsTypes.add('LITERAL');
@@ -8,6 +8,8 @@ export const convertRhsTypes = (useLiteralRHSType, useFieldRHSType, useRelativeD
         setRhsTypes.add('DATE_FUNCTION');
     if (useRelativeDatesType)
         setRhsTypes.add('RELATIVE_DATE');
+    if (useParameterRHSType)
+        setRhsTypes.add('PARAMETER');
     return setRhsTypes;
 };
 //# sourceMappingURL=ConditionBuilder.mocks.js.map

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.mocks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConditionBuilder.mocks.js","sourceRoot":"","sources":["../../../src/condition-builder/ConditionBuilder/ConditionBuilder.mocks.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,iBAA0B,EAC1B,eAAwB,EACxB,oBAA6B,EAC7B,aAAmC,EACnC,EAAE;IACF,MAAM,WAAW,GAAiB,IAAI,GAAG,EAAW,CAAC;IACrD,IAAI,iBAAiB;QAAE,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAClD,IAAI,eAAe;QAAE,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IAC9C,IAAI,aAAa;QAAE,WAAW,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACpD,IAAI,oBAAoB;QAAE,WAAW,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IAC3D,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC","sourcesContent":["import { DateFunctionsByType, RHSType } from '@pega/cosmos-react-condition-builder';\n\nexport const convertRhsTypes = (\n useLiteralRHSType: boolean,\n useFieldRHSType: boolean,\n useRelativeDatesType: boolean,\n dateFunctions?: DateFunctionsByType\n) => {\n const setRhsTypes: Set<RHSType> = new Set<RHSType>();\n if (useLiteralRHSType) setRhsTypes.add('LITERAL');\n if (useFieldRHSType) setRhsTypes.add('FIELD');\n if (dateFunctions) setRhsTypes.add('DATE_FUNCTION');\n if (useRelativeDatesType) setRhsTypes.add('RELATIVE_DATE');\n return setRhsTypes;\n};\n"]}
1	+ {"version":3,"file":"ConditionBuilder.mocks.js","sourceRoot":"","sources":["../../../src/condition-builder/ConditionBuilder/ConditionBuilder.mocks.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,iBAA0B,EAC1B,eAAwB,EACxB,oBAA6B,EAC7B,mBAA4B,EAC5B,aAAmC,EACnC,EAAE;IACF,MAAM,WAAW,GAAiB,IAAI,GAAG,EAAW,CAAC;IACrD,IAAI,iBAAiB;QAAE,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAClD,IAAI,eAAe;QAAE,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IAC9C,IAAI,aAAa;QAAE,WAAW,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACpD,IAAI,oBAAoB;QAAE,WAAW,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IAC3D,IAAI,mBAAmB;QAAE,WAAW,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IACtD,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC","sourcesContent":["import { DateFunctionsByType, RHSType } from '@pega/cosmos-react-condition-builder';\n\nexport const convertRhsTypes = (\n useLiteralRHSType: boolean,\n useFieldRHSType: boolean,\n useRelativeDatesType: boolean,\n useParameterRHSType: boolean,\n dateFunctions?: DateFunctionsByType\n) => {\n const setRhsTypes: Set<RHSType> = new Set<RHSType>();\n if (useLiteralRHSType) setRhsTypes.add('LITERAL');\n if (useFieldRHSType) setRhsTypes.add('FIELD');\n if (dateFunctions) setRhsTypes.add('DATE_FUNCTION');\n if (useRelativeDatesType) setRhsTypes.add('RELATIVE_DATE');\n if (useParameterRHSType) setRhsTypes.add('PARAMETER');\n return setRhsTypes;\n};\n"]}

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.stories.d.ts CHANGED Viewed

@@ -8,9 +8,10 @@ interface ConditionBuilderStoryProps {
     dateFunctions?: boolean;
     itemDirection?: 'column' | 'row';
     useLiteralRHSType?: boolean;
+    useParameterRHSType?: boolean;
     useFieldRHSType?: boolean;
     useRelativeDatesRHSType?: boolean;
-    showLhsAsLabel?: boolean;
+    lhsMode?: 'input' | 'label' | 'hidden';
 }
 export declare const DefaultBuilder: Story<ConditionBuilderStoryProps>;
 export declare const FieldConditionDemo: Story<ConditionBuilderStoryProps>;

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConditionBuilder.stories.d.ts","sourceRoot":"","sources":["../../../src/condition-builder/ConditionBuilder/ConditionBuilder.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;~~AA6B~~/C,wBAGU;AAEV,UAAU,0BAA0B;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,~~cAAc~~,CAAC,EAAE,OAAO,CAAC;~~CAC1B~~;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,0BAA0B,~~CA8F5D~~,CAAC;AAgBF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,0BAA0B,~~CAkFhE~~,CAAC;AAcF,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,0BAA0B,~~CAyJjE~~,CAAC"}
1	+ {"version":3,"file":"ConditionBuilder.stories.d.ts","sourceRoot":"","sources":["../../../src/condition-builder/ConditionBuilder/ConditionBuilder.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AA+B/C,wBAGU;AAEV,UAAU,0BAA0B;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;CACxC;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,0BAA0B,CAgH5D,CAAC;AAgBF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,0BAA0B,CAqGhE,CAAC;AAcF,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,0BAA0B,CA4JjE,CAAC"}

package/lib/condition-builder/ConditionBuilder/ConditionBuilder.stories.js CHANGED Viewed

@@ -38,15 +38,21 @@ export const DefaultBuilder = (args) => {
         if (e.key === 'Escape')
             hidePopover(); // Call the method when Escape key is pressed
     };
-    const builderJsx = (_jsx(ConditionBuilder, { fields: demoFields, condition: condition, validComparators: args.validComparators ? demoComparators : undefined, validRhsTypes: new Set(['LITERAL', 'FIELD', 'DATE_FUNCTION', 'RELATIVE_DATE']), dateFunctions: args.dateFunctions ? demoDateFunctions : undefined, disallowNOT: args.disallowNOT, onConditionSubmit: (c) => {
-            setCondition(c);
-            hidePopover();
-            sessionStorage.setItem('CBDemoCondition', JSON.stringify(c)); // Persist on sessionStorage for the next time
-        } }));
+    const handle = useRef(null);
+    const builderJsx = (_jsxs(_Fragment, { children: [_jsx(ConditionBuilder, { fields: demoFields, condition: condition, validComparators: args.validComparators ? demoComparators : undefined, validRhsTypes: new Set(['LITERAL', 'FIELD', 'DATE_FUNCTION', 'RELATIVE_DATE', 'PARAMETER']), dateFunctions: args.dateFunctions ? demoDateFunctions : undefined, disallowNOT: args.disallowNOT, handle: handle }), _jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { variant: 'primary', onClick: () => {
+                        if (handle?.current) {
+                            const [valid, newCondition] = handle.current.getCondition();
+                            if (valid) {
+                                setCondition(newCondition);
+                                hidePopover();
+                                sessionStorage.setItem('CBDemoCondition', JSON.stringify(newCondition)); // Persist on sessionStorage for the next time
+                            }
+                        }
+                    }, children: "Submit" }) })] }));
     return (_jsxs(StyledGrid, { container: {
             cols: '1fr',
             rowGap: 3
-        }, children: [!args.renderInPopover && builderJsx, args.renderInPopover && (_jsxs(_Fragment, { children: [_jsx(Button, { ref: buttonRef, "aria-haspopup": true, "aria-expanded": isOpen, onClick: () => setIsOpen(!isOpen), onKeyDown: hideOnEscape, children: "Open Condition builder" }), _jsx(Popover, { show: isOpen, ref: setPopoverEl, target: buttonRef.current, placement: 'bottom-start', children: _jsx(Flex, { container: { pad: 1 }, children: builderJsx }) })] })), _jsxs("div", { children: [_jsx(Text, { variant: 'h4', children: "Output:" }), _jsx(StyledCodeBlock, { children: condition ? JSON.stringify(condition, null, 2) : '(No condition)' })] }), _jsxs("div", { children: [_jsx(Text, { variant: 'h4', children: "Formatted Output:" }), _jsx(StyledCodeBlock, { children: condition ? formatCondition(condition, demoFields, translate) : '(No condition)' })] })] }));
+        }, children: [!args.renderInPopover && builderJsx, args.renderInPopover && (_jsxs(_Fragment, { children: [_jsx(Button, { ref: buttonRef, "aria-haspopup": true, "aria-expanded": isOpen, onClick: () => setIsOpen(!isOpen), onKeyDown: hideOnEscape, children: "Open Condition builder" }), _jsx(Popover, { show: isOpen, ref: setPopoverEl, target: buttonRef.current, placement: 'bottom-start', children: _jsx(Flex, { container: { pad: 1, direction: 'column' }, children: builderJsx }) })] })), _jsxs("div", { children: [_jsx(Text, { variant: 'h4', children: "Output:" }), _jsx(StyledCodeBlock, { children: condition ? JSON.stringify(condition, null, 2) : '(No condition)' })] }), _jsxs("div", { children: [_jsx(Text, { variant: 'h4', children: "Formatted Output:" }), _jsx(StyledCodeBlock, { children: condition ? formatCondition(condition, demoFields, translate) : '(No condition)' })] })] }));
 };
 DefaultBuilder.args = {
     validComparators: false,
@@ -77,10 +83,16 @@ export const FieldConditionDemo = (args) => {
         if (e.key === 'Escape')
             hidePopover(); // Call the method when Escape key is pressed
     };
-    const builderJsx = (_jsx(FieldCondition, { targetField: 'lastActivityAt', fields: demoFields, condition: condition, validComparators: args.validComparators ? demoComparators : undefined, validRhsTypes: new Set(['LITERAL', 'FIELD', 'DATE_FUNCTION', 'RELATIVE_DATE']), dateFunctions: args.dateFunctions ? demoDateFunctions : undefined, onSubmit: c => {
-            hidePopover();
-            setCondition(c);
-        } }));
+    const handle = useRef(null);
+    const builderJsx = (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(FieldCondition, { targetField: 'technicalDetails.lastActivityAt', fields: demoFields, condition: condition, validComparators: args.validComparators ? demoComparators : undefined, validRhsTypes: new Set(['LITERAL', 'FIELD', 'DATE_FUNCTION', 'RELATIVE_DATE']), dateFunctions: args.dateFunctions ? demoDateFunctions : undefined, handle: handle }), _jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { name: 'field-condition-submit', variant: 'primary', onClick: () => {
+                        if (!handle.current)
+                            return;
+                        const [isValid, c] = handle.current.getCondition();
+                        if (!isValid)
+                            return;
+                        hidePopover();
+                        setCondition(c);
+                    }, children: "Submit" }) })] }));
     return (_jsxs(StyledGrid, { container: {
             cols: 'repeat(2, minmax(0, 1fr))',
             justifyItems: 'stretch',
@@ -100,7 +112,7 @@ FieldConditionDemo.argTypes = {
 };
 export const AtomicConditionDemo = (args) => {
     const translate = useI18n();
-    const validRHSTypes = convertRhsTypes(!!args.useLiteralRHSType, !!args.useFieldRHSType, !!args.useRelativeDatesRHSType, args.dateFunctions ? demoDateFunctions : undefined);
+    const validRHSTypes = convertRhsTypes(!!args.useLiteralRHSType, !!args.useFieldRHSType, !!args.useRelativeDatesRHSType, !!args.useParameterRHSType, args.dateFunctions ? demoDateFunctions : undefined);
     // Story State object to simulate "submitting"
     const [submitCondition, setSubmitCondition] = useState(undefined);
     // State needed to use Popover in Story
@@ -122,7 +134,7 @@ export const AtomicConditionDemo = (args) => {
     const [condition, setCondition] = useState(
     // If editing use the seedCondition, otherwise, determine an initial condition based on the targetField
     () => submitCondition ||
-        getInitConditionForLhs({ field: 'age' }, demoFields, validRHSTypes, args.validComparators ? demoComparators : undefined, args.dateFunctions ? demoDateFunctions : undefined));
+        getInitConditionForLhs({ field: 'details.age' }, demoFields, validRHSTypes, args.validComparators ? demoComparators : undefined, args.dateFunctions ? demoDateFunctions : undefined));
     const handleSubmission = () => {
         setShowErrorIndicators(false);
         if (isValidCondition(condition, demoFields, true)) {
@@ -135,7 +147,7 @@ export const AtomicConditionDemo = (args) => {
             setShowErrorIndicators(true);
         }
     };
-    const atomicConditionJSX = (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(AtomicCondition, { condition: condition, fields: demoFields, indicateErrors: showErrorIndicators, validComparators: args.validComparators ? demoComparators : undefined, dateFunctions: args.dateFunctions ? demoDateFunctions : undefined, onChange: c => setCondition(c), itemDirection: args.itemDirection, showLhsAsLabel: args.showLhsAsLabel, validRhsTypes: validRHSTypes }), _jsx(Button, { variant: 'primary', onClick: handleSubmission, children: "Submit Condition" })] }));
+    const atomicConditionJSX = (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(AtomicCondition, { condition: condition, fields: demoFields, indicateErrors: showErrorIndicators, validComparators: args.validComparators ? demoComparators : undefined, dateFunctions: args.dateFunctions ? demoDateFunctions : undefined, onChange: c => setCondition(c), itemDirection: args.itemDirection, lhsMode: args.lhsMode, validRhsTypes: validRHSTypes }), _jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { variant: 'primary', onClick: handleSubmission, children: "Submit" }) })] }));
     return (_jsxs(StyledGrid, { container: {
             cols: 'repeat(2, minmax(0, 1fr))',
             justifyItems: 'stretch',
@@ -151,9 +163,10 @@ AtomicConditionDemo.args = {
     dateFunctions: true,
     itemDirection: 'column',
     useLiteralRHSType: true,
+    useParameterRHSType: true,
     useFieldRHSType: true,
     useRelativeDatesRHSType: true,
-    showLhsAsLabel: false
+    lhsMode: 'input'
 };
 AtomicConditionDemo.argTypes = {
     validComparators: { control: { type: 'boolean' } },
@@ -161,8 +174,9 @@ AtomicConditionDemo.argTypes = {
     dateFunctions: { control: { type: 'boolean' } },
     itemDirection: { options: ['column', 'row'], control: { type: 'select' } },
     useLiteralRHSType: { control: { type: 'boolean' } },
+    useParameterRHSType: { control: { type: 'boolean' } },
     useFieldRHSType: { control: { type: 'boolean' } },
     useRelativeDatesRHSType: { control: { type: 'boolean' } },
-    showLhsAsLabel: { control: { type: 'boolean' } }
+    lhsMode: { options: ['input', 'label', 'hidden'], control: { type: 'select' } }
 };
 //# sourceMappingURL=ConditionBuilder.stories.js.map