@pega/cosmos-react-demos 5.0.0-dev.2.1 → 5.0.0-dev.4.0

package/jsx/build/AppShell/AppShell.stories.jsx

@@ -1,201 +0,0 @@
-import { useMemo, useState } from 'react';
-import { action } from '@storybook/addon-actions';
-import { Icon, useModalManager, Input, Button, Modal, useI18n } from '@pega/cosmos-react-core';
-import { AppShell } from '@pega/cosmos-react-build';
-import { contents, defaultNavItems, ShowcasePageComp, TabbedPageComp, operatorData } from './AppShell.mocks';
-export default {
-    title: 'Build/AppShell',
-    component: AppShell,
-    parameters: {
-        layout: 'fullscreen'
-    }
-};
-export const AppShellDemo = (args) => {
-    const t = useI18n();
-    const initialId = defaultNavItems[0].id;
-    const [pageContent, setPageContent] = useState(contents.find(content => content.id === initialId) || contents[0]);
-    const [currentItemId, setCurrentItemId] = useState(args.currentItemId || initialId);
-    const [searchText, setSearchText] = useState('');
-    const { create } = useModalManager();
-    const addHandlersToItems = (navItems) => {
-        return (navItems || []).map(item => {
-            const mutatedItem = { ...item };
-            if (!mutatedItem.items) {
-                mutatedItem.onClick = (itemId, e) => {
-                    e.preventDefault();
-                    setCurrentItemId(itemId);
-                    setPageContent(contents.find(content => content.id === itemId) || contents[0]);
-                };
-            }
-            else if (mutatedItem.items) {
-                mutatedItem.items = addHandlersToItems(mutatedItem.items);
-            }
-            return mutatedItem;
-        });
-    };
-    const items = useMemo(() => {
-        return addHandlersToItems(defaultNavItems);
-    }, [defaultNavItems]);
-    const openAddBranchModal = () => {
-        const { dismiss, update } = create(Modal, {
-            children: <Input label='Branch'/>,
-            heading: 'Add branch'
-        });
-        update({
-            actions: [
-                <Button onClick={dismiss}>Cancel</Button>,
-                <Button onClick={dismiss} variant='primary'>
-          Finish
-        </Button>
-            ]
-        });
-    };
-    const [contexts, setContexts] = useState([
-        {
-            id: '1',
-            primary: 'Studio',
-            selected: true,
-            visual: <Icon name='app'/>
-        },
-        {
-            id: '2',
-            primary: 'Administration',
-            selected: false,
-            visual: <Icon name='cloud'/>
-        }
-    ]);
-    const appHeaderProps = {
-        brand: {
-            label: 'Launchpad',
-            logo: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg',
-            href: '/',
-            onClick: e => {
-                e.preventDefault();
-                action('Navigated to root');
-            }
-        },
-        contextSwitcher: {
-            contexts,
-            onContextClick: (id) => setContexts(cur => cur.map(ctx => ({ ...ctx, selected: id === ctx.id }))),
-            label: t('switch_to')
-        },
-        utils: {
-            search: {
-                value: searchText,
-                placeholder: 'Search',
-                onSearchChange: setSearchText
-            },
-            appInfo: args.showAppNameAndVersion
-                ? {
-                    name: args.appName,
-                    version: '1.0.0'
-                }
-                : undefined,
-            operator: operatorData,
-            branch: args.showBranch
-                ? {
-                    text: args.text,
-                    variant: args.variant,
-                    count: args.count,
-                    compact: args.compact,
-                    items: [
-                        {
-                            primary: 'Commit to branch',
-                            id: 'commitToBranch',
-                            onClick: action('Clicked commitToBranch')
-                        },
-                        {
-                            primary: 'Merge branch',
-                            id: 'mergeBranch',
-                            onClick: action('Clicked mergeBranch')
-                        },
-                        {
-                            primary: 'View branch',
-                            id: 'viewBranch',
-                            onClick: action('Clicked viewBranch')
-                        },
-                        {
-                            primary: 'Switch branch',
-                            id: 'switchBranch',
-                            onClick: action('Clicked switchBranch')
-                        },
-                        {
-                            primary: 'Add branch',
-                            id: 'addBranch',
-                            onClick: () => {
-                                action('Clicked addBranch')();
-                                openAddBranchModal();
-                            }
-                        },
-                        {
-                            primary: 'View all branches',
-                            id: 'viewAllBranches',
-                            onClick: action('Clicked viewAllBranches')
-                        }
-                    ]
-                }
-                : undefined,
-            action: args.showPreview
-                ? {
-                    id: 'preview',
-                    text: 'Preview',
-                    onClick: args.onPreviewClick,
-                    icon: 'play-solid'
-                }
-                : undefined
-        },
-        links: args.showLinks
-            ? [
-                {
-                    id: '1',
-                    name: 'Applications',
-                    onClick: action('Clicked Applications')
-                },
-                {
-                    id: '2',
-                    name: 'Shared resources',
-                    onClick: action('Clicked Shared resources')
-                }
-            ]
-            : []
-    };
-    const mainContent = pageContent.data.template === 'showcase' ? (<ShowcasePageComp {...pageContent.data}/>) : (<TabbedPageComp pageContent={pageContent.data} showBreadcrumbs={!!args.showBreadcrumbs}/>);
-    return (<AppShell main={args.main || mainContent} appHeader={appHeaderProps} nav={args.hideNav
-            ? undefined
-            : {
-                items: items,
-                currentItemId,
-                defaultExpanded: args.defaultExpanded
-            }}/>);
-};
-AppShellDemo.args = {
-    hideNav: false,
-    defaultExpanded: true,
-    showBreadcrumbs: true,
-    variant: undefined,
-    text: 'Launchpad (Main)',
-    count: null,
-    compact: false,
-    showPreview: true,
-    onPreviewClick: action('Clicked preview button'),
-    showLinks: false,
-    showAppNameAndVersion: true,
-    showBranch: true,
-    appName: 'Launchpad'
-};
-AppShellDemo.argTypes = {
-    hideNav: { control: { type: 'boolean' } },
-    defaultExpanded: { control: { type: 'boolean' } },
-    showBreadcrumbs: { control: { type: 'boolean' } },
-    variant: { options: ['success', 'urgent'], control: { type: 'radio' } },
-    text: { control: { type: 'text' } },
-    count: { control: { type: 'number' } },
-    compact: { control: { type: 'boolean' } },
-    onPreviewClick: { table: { disable: true } },
-    showLinks: { control: { type: 'boolean' } },
-    showAppNameAndVersion: { control: { type: 'boolean' } },
-    showBranch: { control: { type: 'boolean' } },
-    showPreview: { control: { type: 'boolean' } },
-    appName: { control: { type: 'text' } }
-};
-//# sourceMappingURL=AppShell.stories.jsx.map

package/jsx/build/AppShell/AppShell.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"AppShell.stories.jsx","sourceRoot":"","sources":["../../../src/build/AppShell/AppShell.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useState } from 'react';\nimport type { KeyboardEvent, MouseEvent } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport { Icon, useModalManager, Input, Button, Modal, useI18n } from '@pega/cosmos-react-core';\nimport type { ContextSwitcherProps, OmitStrict, Action } from '@pega/cosmos-react-core';\nimport { AppShell } from '@pega/cosmos-react-build';\nimport type {\n  AppHeaderProps,\n  AppShellProps,\n  NavItemProps,\n  BranchButtonProps,\n  NestedNavItemProps\n} from '@pega/cosmos-react-build';\n\nimport {\n  contents,\n  defaultNavItems,\n  ShowcasePageComp,\n  TabbedPageComp,\n  operatorData\n} from './AppShell.mocks';\nimport type { PageContentProps } from './AppShell.mocks';\n\nexport default {\n  title: 'Build/AppShell',\n  component: AppShell,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\nexport interface AppShellStoryProps extends OmitStrict<BranchButtonProps, 'items'> {\n  appName: string;\n  hideNav?: boolean;\n  defaultExpanded?: boolean;\n  showPreview?: boolean;\n  showLinks?: boolean;\n  showBranch?: boolean;\n  showAppNameAndVersion?: boolean;\n  onPreviewClick?: Action['onClick'];\n  showBreadcrumbs?: boolean;\n  main?: AppShellProps['main'];\n  currentItemId?: string;\n}\n\nexport const AppShellDemo: StoryFn<AppShellStoryProps> = (args: AppShellStoryProps) => {\n  const t = useI18n();\n  const initialId = defaultNavItems[0].id;\n  const [pageContent, setPageContent] = useState<PageContentProps>(\n    contents.find(content => content.id === initialId) || contents[0]\n  );\n  const [currentItemId, setCurrentItemId] = useState(args.currentItemId || initialId);\n  const [searchText, setSearchText] = useState('');\n  const { create } = useModalManager();\n\n  const addHandlersToItems = (\n    navItems: NavItemProps[] | NestedNavItemProps[]\n  ): NavItemProps[] | NestedNavItemProps[] => {\n    return (navItems || []).map(item => {\n      const mutatedItem = { ...item };\n      if (!mutatedItem.items) {\n        mutatedItem.onClick = (\n          itemId: string,\n          e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>\n        ) => {\n          e.preventDefault();\n          setCurrentItemId(itemId);\n          setPageContent(contents.find(content => content.id === itemId) || contents[0]);\n        };\n      } else if (mutatedItem.items) {\n        mutatedItem.items = addHandlersToItems(mutatedItem.items);\n      }\n      return mutatedItem;\n    });\n  };\n\n  const items = useMemo<NavItemProps[] | NestedNavItemProps[]>(() => {\n    return addHandlersToItems(defaultNavItems);\n  }, [defaultNavItems]);\n\n  const openAddBranchModal = () => {\n    const { dismiss, update } = create(Modal, {\n      children: <Input label='Branch' />,\n      heading: 'Add branch'\n    });\n    update({\n      actions: [\n        <Button onClick={dismiss}>Cancel</Button>,\n        <Button onClick={dismiss} variant='primary'>\n          Finish\n        </Button>\n      ]\n    });\n  };\n\n  const [contexts, setContexts] = useState<ContextSwitcherProps['contexts']>([\n    {\n      id: '1',\n      primary: 'Studio',\n      selected: true,\n      visual: <Icon name='app' />\n    },\n    {\n      id: '2',\n      primary: 'Administration',\n      selected: false,\n      visual: <Icon name='cloud' />\n    }\n  ]);\n\n  const appHeaderProps: AppHeaderProps = {\n    brand: {\n      label: 'Launchpad',\n      logo: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg',\n      href: '/',\n      onClick: e => {\n        e.preventDefault();\n        action('Navigated to root');\n      }\n    },\n    contextSwitcher: {\n      contexts,\n      onContextClick: (id: string) =>\n        setContexts(cur => cur.map(ctx => ({ ...ctx, selected: id === ctx.id }))),\n      label: t('switch_to')\n    },\n    utils: {\n      search: {\n        value: searchText,\n        placeholder: 'Search',\n        onSearchChange: setSearchText\n      },\n      appInfo: args.showAppNameAndVersion\n        ? {\n            name: args.appName,\n            version: '1.0.0'\n          }\n        : undefined,\n      operator: operatorData,\n      branch: args.showBranch\n        ? {\n            text: args.text,\n            variant: args.variant,\n            count: args.count,\n            compact: args.compact,\n            items: [\n              {\n                primary: 'Commit to branch',\n                id: 'commitToBranch',\n                onClick: action('Clicked commitToBranch')\n              },\n              {\n                primary: 'Merge branch',\n                id: 'mergeBranch',\n                onClick: action('Clicked mergeBranch')\n              },\n              {\n                primary: 'View branch',\n                id: 'viewBranch',\n                onClick: action('Clicked viewBranch')\n              },\n              {\n                primary: 'Switch branch',\n                id: 'switchBranch',\n                onClick: action('Clicked switchBranch')\n              },\n              {\n                primary: 'Add branch',\n                id: 'addBranch',\n                onClick: () => {\n                  action('Clicked addBranch')();\n                  openAddBranchModal();\n                }\n              },\n              {\n                primary: 'View all branches',\n                id: 'viewAllBranches',\n                onClick: action('Clicked viewAllBranches')\n              }\n            ]\n          }\n        : undefined,\n      action: args.showPreview\n        ? {\n            id: 'preview',\n            text: 'Preview',\n            onClick: args.onPreviewClick,\n            icon: 'play-solid'\n          }\n        : undefined\n    },\n    links: args.showLinks\n      ? [\n          {\n            id: '1',\n            name: 'Applications',\n            onClick: action('Clicked Applications')\n          },\n          {\n            id: '2',\n            name: 'Shared resources',\n            onClick: action('Clicked Shared resources')\n          }\n        ]\n      : []\n  };\n\n  const mainContent =\n    pageContent.data.template === 'showcase' ? (\n      <ShowcasePageComp {...pageContent.data} />\n    ) : (\n      <TabbedPageComp pageContent={pageContent.data} showBreadcrumbs={!!args.showBreadcrumbs} />\n    );\n\n  return (\n    <AppShell\n      main={args.main || mainContent}\n      appHeader={appHeaderProps}\n      nav={\n        args.hideNav\n          ? undefined\n          : {\n              items: items as NavItemProps[],\n              currentItemId,\n              defaultExpanded: args.defaultExpanded\n            }\n      }\n    />\n  );\n};\n\nAppShellDemo.args = {\n  hideNav: false,\n  defaultExpanded: true,\n  showBreadcrumbs: true,\n  variant: undefined,\n  text: 'Launchpad (Main)',\n  count: null,\n  compact: false,\n  showPreview: true,\n  onPreviewClick: action('Clicked preview button'),\n  showLinks: false,\n  showAppNameAndVersion: true,\n  showBranch: true,\n  appName: 'Launchpad'\n};\n\nAppShellDemo.argTypes = {\n  hideNav: { control: { type: 'boolean' } },\n  defaultExpanded: { control: { type: 'boolean' } },\n  showBreadcrumbs: { control: { type: 'boolean' } },\n  variant: { options: ['success', 'urgent'], control: { type: 'radio' } },\n  text: { control: { type: 'text' } },\n  count: { control: { type: 'number' } },\n  compact: { control: { type: 'boolean' } },\n  onPreviewClick: { table: { disable: true } },\n  showLinks: { control: { type: 'boolean' } },\n  showAppNameAndVersion: { control: { type: 'boolean' } },\n  showBranch: { control: { type: 'boolean' } },\n  showPreview: { control: { type: 'boolean' } },\n  appName: { control: { type: 'text' } }\n};\n"]}

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

@@ -1,8 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import { DynamicContentEditorProps } from '@pega/cosmos-react-build';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
-export default _default;
-export interface DynamicContentEditorStoryProps extends DynamicContentEditorProps {
-}
-export declare const DynamicContentEditorDemo: StoryFn<Partial<DynamicContentEditorStoryProps>>;
-//# sourceMappingURL=DynamicContentEditor.stories.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"DynamicContentEditor.stories.d.ts","sourceRoot":"","sources":["../../../src/build/DynamicContentEditor/DynamicContentEditor.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAgBtD,OAAO,EAAwB,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;;AAM3F,wBAGU;AAEV,MAAM,WAAW,8BAA+B,SAAQ,yBAAyB;CAAG;AAEpF,eAAO,MAAM,wBAAwB,EAAE,OAAO,CAAC,OAAO,CAAC,8BAA8B,CAAC,CAkIrF,CAAC"}

package/jsx/build/DynamicContentEditor/DynamicContentEditor.stories.jsx

@@ -1,101 +0,0 @@
-import { useRef, useState, useCallback } from 'react';
-import { action } from '@storybook/addon-actions';
-import { Button, Card, CardContent, CardFooter, Flex, TextArea, useAutoResize, useConsolidatedRef, useI18n } from '@pega/cosmos-react-core';
-import { DynamicContentEditor } from '@pega/cosmos-react-build';
-import FieldSelector from './FieldSelector';
-export default {
-    title: 'Build/DynamicContentEditor',
-    component: DynamicContentEditor
-};
-export const DynamicContentEditorDemo = (args) => {
-    const [html, setHtml] = useState('<p>Hi <pega-reference role="button" contenteditable="false" data-rule-type="field" data-rule-id="CustomerName">CustomerName</pega-reference><p>please check this <a href="https://google.com">link</a></p></p>');
-    const rteRef = useRef(null);
-    const fieldItems = [
-        {
-            id: 'CustomerName',
-            primary: 'CustomerName',
-            items: [
-                {
-                    id: '1-2',
-                    primary: 'Locale'
-                },
-                {
-                    id: '1-1',
-                    primary: 'Response Type',
-                    items: [
-                        {
-                            id: 'group-1-1-b',
-                            label: 'B',
-                            items: [{ id: '1-1-1', primary: 'Reply to' }]
-                        },
-                        { id: '1-1-4', primary: 'Forward to' }
-                    ]
-                }
-            ]
-        },
-        { id: 'Address', primary: 'Address' },
-        { id: 'Locality', primary: 'Locality' },
-        { id: 'Country', primary: 'Country' },
-        { id: 'Region', primary: 'Region' },
-        { id: 'Occupation', primary: 'Occupation' },
-        { id: 'City', primary: 'City' },
-        { id: 'Colony', primary: 'Colony' },
-        { id: 'Lastname', primary: 'Lastname' },
-        { id: 'Preference', primary: 'Preference' },
-        { id: 'Currency', primary: 'Currency' },
-        { id: 'Iconname', primary: 'Iconname' }
-    ];
-    const onImageAdded = (image, id) => {
-        const src = URL.createObjectURL(image);
-        rteRef.current?.appendImage({ src, alt: image.name }, id);
-    };
-    const [textAreaRef, resizeTextArea] = useAutoResize(undefined, 100);
-    const ref = useRef(null);
-    const consolidatedRef = useConsolidatedRef(textAreaRef, ref);
-    const handleShowHtml = () => {
-        resizeTextArea();
-        setHtml(rteRef.current?.getHtml() || '');
-    };
-    const t = useI18n();
-    const [selectedField, setSelectedField] = useState({
-        id: '',
-        text: ''
-    });
-    const updateSelection = (selectedItem) => {
-        setSelectedField(selectedItem);
-    };
-    const onSubmit = useCallback((insertField) => {
-        insertField(selectedField);
-    }, [selectedField]);
-    const dynamicContentPicker = (<Flex container={{
-            gap: 2,
-            direction: 'column'
-        }}>
-      <FieldSelector itemList={[
-            { id: 'CustomerName', text: 'CustomerName' },
-            { id: 'Address', text: 'Address' },
-            { id: 'Locality', text: 'Locality' },
-            { id: 'Country', text: 'Country' },
-            { id: 'Region', text: 'Region' },
-            { id: 'Occupation', text: 'Occupation' }
-        ]} key={selectedField?.id} label='Field' updateSelection={updateSelection} placeholder={t('select')} defaultSelection={selectedField}/>
-    </Flex>);
-    const onActiveFieldChange = (field) => setSelectedField(field);
-    return (<Flex container={{ direction: 'column', gap: 2 }}>
-      <Card>
-        <CardContent>
-          <TextArea value={html} onChange={e => setHtml(e.target.value)} autoResize ref={consolidatedRef}/>
-        </CardContent>
-        <CardFooter>
-          <Button onClick={() => rteRef.current?.insertHtml(html.trim(), true)}>
-            Overwrite RTE with new HTML
-          </Button>
-        </CardFooter>
-      </Card>
-      <DynamicContentEditor defaultValue={args.defaultValue || html} onImageAdded={onImageAdded} ref={rteRef} label='Dynamic content editor' toolbar={['inline-styling', 'lists', 'indentation', 'links', 'images']} form={args.form || { onSubmit, dynamicContentPicker }} onActiveFieldChange={args.onActiveFieldChange || onActiveFieldChange} fieldItems={args.fieldItems || fieldItems} onBlur={action('Editor onBlur')}/>
-      <Flex container={{ gap: 1 }}>
-        <Button onClick={() => handleShowHtml()}>Show HTML</Button>
-      </Flex>
-    </Flex>);
-};
-//# sourceMappingURL=DynamicContentEditor.stories.jsx.map

package/jsx/build/DynamicContentEditor/DynamicContentEditor.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"DynamicContentEditor.stories.jsx","sourceRoot":"","sources":["../../../src/build/DynamicContentEditor/DynamicContentEditor.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useRef, useState, useCallback } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  CardFooter,\n  Flex,\n  TextArea,\n  useAutoResize,\n  useConsolidatedRef,\n  useI18n\n} from '@pega/cosmos-react-core';\nimport type { EditorState } from '@pega/cosmos-react-rte';\nimport { DynamicContentEditor, DynamicContentEditorProps } from '@pega/cosmos-react-build';\nimport type { ItemType } from '@pega/cosmos-react-build';\n\nimport FieldSelector from './FieldSelector';\nimport type { FieldSelectorProps } from './FieldSelector';\n\nexport default {\n  title: 'Build/DynamicContentEditor',\n  component: DynamicContentEditor\n} as Meta;\n\nexport interface DynamicContentEditorStoryProps extends DynamicContentEditorProps {}\n\nexport const DynamicContentEditorDemo: StoryFn<Partial<DynamicContentEditorStoryProps>> = (\n  args: Partial<DynamicContentEditorStoryProps>\n) => {\n  const [html, setHtml] = useState(\n    '<p>Hi <pega-reference role=\"button\" contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=\"CustomerName\">CustomerName</pega-reference><p>please check this <a href=\"https://google.com\">link</a></p></p>'\n  );\n  const rteRef = useRef<EditorState>(null);\n\n  const fieldItems: DynamicContentEditorProps['fieldItems'] = [\n    {\n      id: 'CustomerName',\n      primary: 'CustomerName',\n      items: [\n        {\n          id: '1-2',\n          primary: 'Locale'\n        },\n        {\n          id: '1-1',\n          primary: 'Response Type',\n          items: [\n            {\n              id: 'group-1-1-b',\n              label: 'B',\n              items: [{ id: '1-1-1', primary: 'Reply to' }]\n            },\n            { id: '1-1-4', primary: 'Forward to' }\n          ]\n        }\n      ]\n    },\n    { id: 'Address', primary: 'Address' },\n    { id: 'Locality', primary: 'Locality' },\n    { id: 'Country', primary: 'Country' },\n    { id: 'Region', primary: 'Region' },\n    { id: 'Occupation', primary: 'Occupation' },\n    { id: 'City', primary: 'City' },\n    { id: 'Colony', primary: 'Colony' },\n    { id: 'Lastname', primary: 'Lastname' },\n    { id: 'Preference', primary: 'Preference' },\n    { id: 'Currency', primary: 'Currency' },\n    { id: 'Iconname', primary: 'Iconname' }\n  ];\n\n  const onImageAdded = (image: File, id: string) => {\n    const src = URL.createObjectURL(image);\n    rteRef.current?.appendImage({ src, alt: image.name }, id);\n  };\n  const [textAreaRef, resizeTextArea] = useAutoResize<HTMLTextAreaElement>(undefined, 100);\n  const ref = useRef(null);\n  const consolidatedRef = useConsolidatedRef(textAreaRef, ref);\n  const handleShowHtml = () => {\n    resizeTextArea();\n    setHtml(rteRef.current?.getHtml() || '');\n  };\n  const t = useI18n();\n  const [selectedField, setSelectedField] = useState<ItemType>({\n    id: '',\n    text: ''\n  });\n\n  const updateSelection: FieldSelectorProps['updateSelection'] = (selectedItem: ItemType) => {\n    setSelectedField(selectedItem);\n  };\n  const onSubmit = useCallback(\n    (insertField: (selectedField: ItemType) => void) => {\n      insertField(selectedField);\n    },\n    [selectedField]\n  );\n\n  const dynamicContentPicker = (\n    <Flex\n      container={{\n        gap: 2,\n        direction: 'column'\n      }}\n    >\n      <FieldSelector\n        itemList={[\n          { id: 'CustomerName', text: 'CustomerName' },\n          { id: 'Address', text: 'Address' },\n          { id: 'Locality', text: 'Locality' },\n          { id: 'Country', text: 'Country' },\n          { id: 'Region', text: 'Region' },\n          { id: 'Occupation', text: 'Occupation' }\n        ]}\n        key={selectedField?.id}\n        label='Field'\n        updateSelection={updateSelection}\n        placeholder={t('select')}\n        defaultSelection={selectedField}\n      />\n    </Flex>\n  );\n  const onActiveFieldChange = (field: ItemType) => setSelectedField(field);\n\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Card>\n        <CardContent>\n          <TextArea\n            value={html}\n            onChange={e => setHtml(e.target.value)}\n            autoResize\n            ref={consolidatedRef}\n          />\n        </CardContent>\n        <CardFooter>\n          <Button onClick={() => rteRef.current?.insertHtml(html.trim(), true)}>\n            Overwrite RTE with new HTML\n          </Button>\n        </CardFooter>\n      </Card>\n      <DynamicContentEditor\n        defaultValue={args.defaultValue || html}\n        onImageAdded={onImageAdded}\n        ref={rteRef}\n        label='Dynamic content editor'\n        toolbar={['inline-styling', 'lists', 'indentation', 'links', 'images']}\n        form={args.form || { onSubmit, dynamicContentPicker }}\n        onActiveFieldChange={args.onActiveFieldChange || onActiveFieldChange}\n        fieldItems={args.fieldItems || fieldItems}\n        onBlur={action('Editor onBlur')}\n      />\n      <Flex container={{ gap: 1 }}>\n        <Button onClick={() => handleShowHtml()}>Show HTML</Button>\n      </Flex>\n    </Flex>\n  );\n};\n"]}

package/jsx/build/DynamicContentEditor/FieldSelector.d.ts

@@ -1,11 +0,0 @@
-import { FunctionComponent } from 'react';
-import { ComboBoxProps, NoChildrenProp } from '@pega/cosmos-react-core';
-import { ItemType } from '@pega/cosmos-react-build/lib/components/DynamicContentEditor/DynamicContentEditor.types';
-export interface FieldSelectorProps extends NoChildrenProp {
-    itemList: ItemType[];
-    updateSelection: (selectedItem: ItemType, label: ComboBoxProps['label']) => void;
-    defaultSelection?: ItemType;
-}
-declare const FieldSelector: FunctionComponent<FieldSelectorProps & Pick<ComboBoxProps, 'label' | 'mode' | 'required' | 'placeholder'>>;
-export default FieldSelector;
-//# sourceMappingURL=FieldSelector.d.ts.map

package/jsx/build/DynamicContentEditor/FieldSelector.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../src/build/DynamicContentEditor/FieldSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,iBAAiB,EAAkC,MAAM,OAAO,CAAC;AAEvF,OAAO,EAEL,aAAa,EAGb,cAAc,EAEf,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,yFAAyF,CAAC;AAEnH,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IAExD,QAAQ,EAAE,QAAQ,EAAE,CAAC;IAErB,eAAe,EAAE,CAAC,YAAY,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAEjF,gBAAgB,CAAC,EAAE,QAAQ,CAAC;CAC7B;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CACpC,kBAAkB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,aAAa,CAAC,CAiGxF,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/jsx/build/DynamicContentEditor/FieldSelector.jsx

@@ -1,80 +0,0 @@
-import { useMemo, useState, useCallback } from 'react';
-import { ComboBox, createStringMatcher, useI18n } from '@pega/cosmos-react-core';
-const FieldSelector = ({ itemList, label, mode = 'single-select', required = false, updateSelection, placeholder, defaultSelection }) => {
-    const t = useI18n();
-    const [filterValue, setFilterValue] = useState('');
-    const [items, setItems] = useState(() => {
-        return itemList.map(item => {
-            return {
-                id: item.id,
-                primary: item.text,
-                selected: defaultSelection ? defaultSelection.id === item.id : false
-            };
-        });
-    });
-    const filterRegex = createStringMatcher(filterValue, 'contains');
-    const itemsToRender = useMemo(() => {
-        return filterRegex ? items.filter(({ primary }) => filterRegex.test(primary)) : items;
-    }, [filterValue, items]);
-    const clearSelection = () => {
-        setItems(curr => {
-            return curr?.map(item => {
-                return {
-                    ...item,
-                    selected: false
-                };
-            });
-        });
-    };
-    const selectItem = useCallback((id) => {
-        setFilterValue('');
-        setItems(curr => curr?.map(item => {
-            if (item.id === id) {
-                return {
-                    ...item,
-                    selected: true
-                };
-            }
-            return { ...item, selected: false };
-        }));
-        const selectedItem = items?.find(item => item.id === id);
-        if (selectedItem?.id)
-            updateSelection({
-                id: selectedItem.id,
-                text: selectedItem.primary
-            }, label);
-    }, [filterValue, items]);
-    const selected = useMemo(() => {
-        return items?.find(item => item.selected);
-    }, [items]);
-    const comboBoxProps = {
-        label,
-        placeholder,
-        mode,
-        value: filterValue,
-        selected: selected
-            ? {
-                items: {
-                    id: selected.id,
-                    text: selected.primary
-                }
-            }
-            : undefined,
-        onChange: (e) => {
-            if (e.target.value)
-                clearSelection();
-            setFilterValue(e.target.value);
-        },
-        onBlur: () => setFilterValue(''),
-        menu: {
-            items: itemsToRender,
-            accent: filterRegex,
-            onItemClick: selectItem,
-            emptyText: t('no_items')
-        },
-        required
-    };
-    return <ComboBox {...comboBoxProps}/>;
-};
-export default FieldSelector;
-//# sourceMappingURL=FieldSelector.jsx.map

package/jsx/build/DynamicContentEditor/FieldSelector.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FieldSelector.jsx","sourceRoot":"","sources":["../../../src/build/DynamicContentEditor/FieldSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent, FunctionComponent, useMemo, useState, useCallback } from 'react';\n\nimport {\n  ComboBox,\n  ComboBoxProps,\n  createStringMatcher,\n  MenuItemProps,\n  NoChildrenProp,\n  useI18n\n} from '@pega/cosmos-react-core';\nimport { ItemType } from '@pega/cosmos-react-build/lib/components/DynamicContentEditor/DynamicContentEditor.types';\n\nexport interface FieldSelectorProps extends NoChildrenProp {\n  /** Array of values for the combobox options. */\n  itemList: ItemType[];\n  /** Return selected item */\n  updateSelection: (selectedItem: ItemType, label: ComboBoxProps['label']) => void;\n  /** Default selected item */\n  defaultSelection?: ItemType;\n}\n\nconst FieldSelector: FunctionComponent<\n  FieldSelectorProps & Pick<ComboBoxProps, 'label' | 'mode' | 'required' | 'placeholder'>\n> = ({\n  itemList,\n  label,\n  mode = 'single-select',\n  required = false,\n  updateSelection,\n  placeholder,\n  defaultSelection\n}) => {\n  const t = useI18n();\n\n  const [filterValue, setFilterValue] = useState('');\n  const [items, setItems] = useState(() => {\n    return itemList.map(item => {\n      return {\n        id: item.id,\n        primary: item.text,\n        selected: defaultSelection ? defaultSelection.id === item.id : false\n      };\n    });\n  });\n\n  const filterRegex = createStringMatcher(filterValue, 'contains');\n  const itemsToRender = useMemo(() => {\n    return filterRegex ? items.filter(({ primary }) => filterRegex.test(primary)) : items;\n  }, [filterValue, items]);\n\n  const clearSelection = () => {\n    setItems(curr => {\n      return curr?.map(item => {\n        return {\n          ...item,\n          selected: false\n        };\n      });\n    });\n  };\n\n  const selectItem = useCallback(\n    (id: MenuItemProps['id']) => {\n      setFilterValue('');\n      setItems(curr =>\n        curr?.map(item => {\n          if (item.id === id) {\n            return {\n              ...item,\n              selected: true\n            };\n          }\n          return { ...item, selected: false };\n        })\n      );\n      const selectedItem = items?.find(item => item.id === id);\n      if (selectedItem?.id)\n        updateSelection(\n          {\n            id: selectedItem.id,\n            text: selectedItem.primary\n          },\n          label\n        );\n    },\n    [filterValue, items]\n  );\n\n  const selected = useMemo(() => {\n    return items?.find(item => item.selected);\n  }, [items]);\n\n  const comboBoxProps: ComboBoxProps = {\n    label,\n    placeholder,\n    mode,\n    value: filterValue,\n    selected: selected\n      ? {\n          items: {\n            id: selected.id,\n            text: selected.primary\n          }\n        }\n      : undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.value) clearSelection();\n      setFilterValue(e.target.value);\n    },\n    onBlur: () => setFilterValue(''),\n    menu: {\n      items: itemsToRender,\n      accent: filterRegex,\n      onItemClick: selectItem,\n      emptyText: t('no_items')\n    },\n    required\n  };\n  return <ComboBox {...comboBoxProps} />;\n};\n\nexport default FieldSelector;\n"]}

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

@@ -1,64 +0,0 @@
-import { AutoCompleteTriggerChar, CursorPosition } from '@pega/cosmos-react-build';
-import { MenuProps } from '@pega/cosmos-react-core';
-export declare const getFilterRegex: (inputValue: string) => RegExp;
-export declare const errors = "Error message 1. Some unrealistic error message. Server unreachable. Check your network connection and try again";
-export declare const items: ({
-    id: 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;
-    primary: string;
-    type: string;
-    expression: string;
-    details: {
-        primary: {
-            field: string;
-            value: string;
-        }[];
-        output: {
-            field: string;
-            value: string;
-        }[];
-        input?: undefined;
-    };
-})[];
-export declare const filterCategories: MenuProps['items'];
-export declare const StyledExpressionBuilderDemo: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const primaryDetails: {
-    id: string;
-    name: string;
-    value: string;
-}[];
-export declare const suggestedFields: {
-    primary: string;
-    id: string;
-    secondary: string[];
-}[];
-export declare const getScopeFromPosition: (cursorPosition: CursorPosition, autoCompleteTrigger: AutoCompleteTriggerChar, value: string) => string;
-export declare const getSuggestedFunction: (scope: string) => {
-    primary: string;
-    id: string;
-    secondary: string[];
-}[];
-export declare const suggestedRuleType: {
-    primary: string;
-    id: string;
-}[];
-//# sourceMappingURL=ExpressionBuilder.mocks.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ExpressionBuilder.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.mocks.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,uBAAuB,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AACnF,OAAO,EAAa,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAE/D,eAAO,MAAM,cAAc,eAAgB,MAAM,WAEhD,CAAC;AAEF,eAAO,MAAM,MAAM,qHACiG,CAAC;AAErH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgejB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,SAAS,CAAC,OAAO,CA+B/C,CAAC;AAEF,eAAO,MAAM,2BAA2B,yGAMtC,CAAC;AAEH,eAAO,MAAM,cAAc;;;;GAgB1B,CAAC;AAEF,eAAO,MAAM,eAAe;;;;GAMvB,CAAC;AAEN,eAAO,MAAM,oBAAoB,mBACf,cAAc,uBACT,uBAAuB,SACrC,MAAM,KACZ,MAuBF,CAAC;AAEF,eAAO,MAAM,oBAAoB,UAAW,MAAM;;;;GAyBjD,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;GAK7B,CAAC"}