@pega/cosmos-react-demos 2.0.0 → 2.1.3

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

@@ -0,0 +1,194 @@
+import { useState } from 'react';
+import { action } from '@storybook/addon-actions';
+import { Text, treeHelpers, TabbedPage as TabbedPageComp } from '@pega/cosmos-react-core';
+import { AppShell } from '@pega/cosmos-react-build';
+import { appExplorerMenuList, branchesMenuList, contents, recordMenuList, treeList } from './AppShell.mocks';
+export default {
+    title: 'Build/AppShell',
+    component: AppShell,
+    parameters: {
+        layout: 'fullscreen'
+    }
+};
+const getPath = (args) => {
+    const { showBreadcrumbs, pageContent: { data: { pageTitle, breadcrumbsPath } } } = args;
+    if (showBreadcrumbs) {
+        const path = pageTitle === 'Overview' ? 'Home' : breadcrumbsPath;
+        return path
+            ? path.split(',').map((crumb, i) => {
+                return {
+                    id: crumb,
+                    primary: crumb,
+                    href: i < 3 ? `#${crumb.replace(/\s/g, '-')}` : undefined
+                };
+            })
+            : [];
+    }
+};
+const TabbedPage = (args) => {
+    const [currentTabId, setCurrentTabId] = useState('1');
+    const [content, setContent] = useState('Tab 1 content');
+    const { pageContent, showBreadcrumbs } = args;
+    return (<TabbedPageComp a={<Text variant='h1' as='div'>
+          {content}
+        </Text>} path={getPath({ showBreadcrumbs, pageContent })} title={pageContent.data.pageTitle} tabs={{
+            tabs: pageContent.data.tabs.map((name, i) => {
+                const id = `${i + 1}`;
+                return { id, name };
+            }),
+            type: 'horizontal',
+            currentTabId,
+            onTabClick: id => {
+                setCurrentTabId(id);
+                setContent(`Tab ${id} content`);
+            }
+        }}/>);
+};
+export const AppShellDemo = (args) => {
+    const [currentNodeId, setCurrentNodeId] = useState('60');
+    const [allNodes, setAllNodes] = useState(treeHelpers.expandTo(appExplorerMenuList, currentNodeId));
+    const [currentDrawer, setCurrentDrawer] = useState('explorer');
+    const [currentUtil, setCurrentUtil] = useState('explorer');
+    const [pageContent, setPageContent] = useState(contents[0]);
+    const onNodeClick = (nodeId, activeDrawerId) => {
+        const clickedNode = treeHelpers.getNode(allNodes, nodeId);
+        if (!clickedNode?.nodes) {
+            setCurrentUtil(activeDrawerId);
+            setCurrentNodeId(nodeId);
+            setPageContent(contents.find(content => content.id === clickedNode?.id));
+            return;
+        }
+        setAllNodes(tree => treeHelpers.mapNode(tree, nodeId, node => {
+            return {
+                ...node,
+                expanded: !node.expanded
+            };
+        }));
+    };
+    const appHeader = {
+        brand: {
+            name: 'AppStudioX'
+        },
+        utils: {
+            avatar: { name: 'Alan' },
+            search: {
+                placeholder: 'Search anything, anywhere…'
+            },
+            branchName: 'test',
+            actions: [
+                {
+                    primary: 'Switch branch',
+                    id: 'switchbranch',
+                    onClick: () => action('Clicked switchbranch')()
+                },
+                {
+                    primary: 'Create branch',
+                    id: 'createbranch',
+                    onClick: () => action('Clicked createbranch')()
+                }
+            ],
+            onPreviewClick: args.showPreview ? args.onPreviewClick : undefined
+        },
+        links: [
+            {
+                id: '1',
+                name: 'Applications',
+                onClick: () => action('Clicked Applications')()
+            },
+            {
+                id: '2',
+                name: 'Shared resources',
+                onClick: () => action('Clicked Shared resources')()
+            },
+            {
+                id: '3',
+                name: 'Teams',
+                onClick: () => action('Clicked Teams')()
+            },
+            {
+                id: '4',
+                name: 'AI & Analytics',
+                onClick: () => action('Clicked AI & Analytics')()
+            },
+            {
+                id: '5',
+                name: 'Deploy',
+                onClick: () => action('Clicked Deploy')()
+            }
+        ]
+    };
+    return (<>
+      <AppShell main={<TabbedPage {...{ ...args, pageContent }}/>} appHeader={appHeader} hideNav={args.hideNavigation} appInfo={{
+            text: 'U+ Desk',
+            visual: {
+                icon: {
+                    name: 'phone-in-solid',
+                    bgColor: '#0ac7c8'
+                }
+            }
+        }} navigation={{
+            nodes: allNodes,
+            currentNodeId,
+            onNodeClick: id => {
+                onNodeClick(id, currentDrawer);
+            }
+        }} utils={{
+            onItemClick: id => {
+                setCurrentDrawer(id);
+                if (id === 'explorer') {
+                    const appExploreTree = currentNodeId
+                        ? treeHelpers.expandTo(appExplorerMenuList, currentNodeId)
+                        : appExplorerMenuList;
+                    setAllNodes(appExploreTree);
+                }
+                if (id === 'branches') {
+                    const branchTree = currentNodeId
+                        ? treeHelpers.expandTo(branchesMenuList, currentNodeId)
+                        : branchesMenuList;
+                    setAllNodes(branchTree);
+                }
+                if (id === 'records') {
+                    const recordTree = currentNodeId
+                        ? treeHelpers.expandTo(recordMenuList, currentNodeId)
+                        : recordMenuList;
+                    setAllNodes(recordTree);
+                }
+            },
+            currentItemId: currentUtil,
+            items: [
+                {
+                    label: 'App Explorer',
+                    id: 'explorer'
+                },
+                {
+                    label: 'Branches',
+                    id: 'branches'
+                },
+                {
+                    label: 'Records',
+                    id: 'records'
+                }
+            ],
+            drawer: {
+                onBeforeClose: () => {
+                    setCurrentDrawer('');
+                    setAllNodes(currentNodeId ? treeHelpers.expandTo(treeList, currentNodeId) : treeList);
+                }
+            },
+            devMode: true
+        }}/>
+    </>);
+};
+AppShellDemo.args = {
+    hideNavigation: false,
+    showBreadcrumbs: true,
+    showPreview: true,
+    onPreviewClick: action('Clicked preview button')
+};
+AppShellDemo.argTypes = {
+    hideNavigation: { control: { type: 'boolean' } },
+    showBreadcrumbs: { control: { type: 'boolean' } },
+    showPreview: { control: { type: 'boolean' } },
+    onPreviewClick: { table: { disable: true } }
+};
+//# sourceMappingURL=AppShell.stories.jsx.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AppShell.stories.jsx","sourceRoot":"","sources":["../../../src/build/AppShell/AppShell.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, MouseEvent } from 'react';\nimport { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Text,\n  StandardTreeProps,\n  treeHelpers,\n  TabbedPage as TabbedPageComp\n} from '@pega/cosmos-react-core';\nimport { AppShell } from '@pega/cosmos-react-build';\n\nimport {\n  appExplorerMenuList,\n  branchesMenuList,\n  contents,\n  recordMenuList,\n  treeList\n} 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 {\n  hideNavigation: boolean;\n  showBreadcrumbs: boolean;\n  showPreview: boolean;\n  onPreviewClick: (e: MouseEvent<HTMLButtonElement>) => void;\n}\n\ninterface PageContentProps {\n  id: string;\n  data: {\n    pageTitle: string;\n    breadcrumbsPath: string;\n    tabs: string[];\n  };\n}\n\nconst getPath = (\n  args: Pick<AppShellStoryProps, 'showBreadcrumbs'> & { pageContent: PageContentProps }\n) => {\n  const {\n    showBreadcrumbs,\n    pageContent: {\n      data: { pageTitle, breadcrumbsPath }\n    }\n  } = args;\n\n  if (showBreadcrumbs) {\n    const path = pageTitle === 'Overview' ? 'Home' : breadcrumbsPath;\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\nconst TabbedPage: Story<AppShellStoryProps & { pageContent: PageContentProps }> = (\n  args: AppShellStoryProps & { pageContent: PageContentProps }\n) => {\n  const [currentTabId, setCurrentTabId] = useState('1');\n  const [content, setContent] = useState('Tab 1 content');\n  const { pageContent, showBreadcrumbs } = args;\n\n  return (\n    <TabbedPageComp\n      a={\n        <Text variant='h1' as='div'>\n          {content}\n        </Text>\n      }\n      path={getPath({ showBreadcrumbs, pageContent })}\n      title={pageContent.data.pageTitle}\n      tabs={{\n        tabs: pageContent.data.tabs.map((name, i) => {\n          const id = `${i + 1}`;\n          return { id, name };\n        }),\n        type: 'horizontal',\n        currentTabId,\n        onTabClick: id => {\n          setCurrentTabId(id);\n          setContent(`Tab ${id} content`);\n        }\n      }}\n    />\n  );\n};\n\nexport const AppShellDemo: Story<AppShellStoryProps> = (args: AppShellStoryProps) => {\n  const [currentNodeId, setCurrentNodeId] = useState<string>('60');\n  const [allNodes, setAllNodes] = useState<StandardTreeProps['nodes']>(\n    treeHelpers.expandTo(appExplorerMenuList, currentNodeId)\n  );\n  const [currentDrawer, setCurrentDrawer] = useState('explorer');\n  const [currentUtil, setCurrentUtil] = useState('explorer');\n  const [pageContent, setPageContent] = useState<PageContentProps>(contents[0]);\n\n  const onNodeClick = (nodeId: string, activeDrawerId: string) => {\n    const clickedNode = treeHelpers.getNode(allNodes, nodeId);\n\n    if (!clickedNode?.nodes) {\n      setCurrentUtil(activeDrawerId);\n      setCurrentNodeId(nodeId);\n      setPageContent(contents.find(content => content.id === clickedNode?.id)!);\n      return;\n    }\n\n    setAllNodes(tree =>\n      treeHelpers.mapNode(tree, nodeId, node => {\n        return {\n          ...node,\n          expanded: !node.expanded\n        };\n      })\n    );\n  };\n\n  const appHeader = {\n    brand: {\n      name: 'AppStudioX'\n    },\n    utils: {\n      avatar: { name: 'Alan' },\n      search: {\n        placeholder: 'Search anything, anywhere…'\n      },\n      branchName: 'test',\n      actions: [\n        {\n          primary: 'Switch branch',\n          id: 'switchbranch',\n          onClick: () => action('Clicked switchbranch')()\n        },\n        {\n          primary: 'Create branch',\n          id: 'createbranch',\n          onClick: () => action('Clicked createbranch')()\n        }\n      ],\n      onPreviewClick: args.showPreview ? args.onPreviewClick : undefined\n    },\n    links: [\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        id: '3',\n        name: 'Teams',\n        onClick: () => action('Clicked Teams')()\n      },\n      {\n        id: '4',\n        name: 'AI & Analytics',\n        onClick: () => action('Clicked AI & Analytics')()\n      },\n      {\n        id: '5',\n        name: 'Deploy',\n        onClick: () => action('Clicked Deploy')()\n      }\n    ]\n  };\n\n  return (\n    <>\n      <AppShell\n        main={<TabbedPage {...{ ...args, pageContent }} />}\n        appHeader={appHeader}\n        hideNav={args.hideNavigation}\n        appInfo={{\n          text: 'U+ Desk',\n          visual: {\n            icon: {\n              name: 'phone-in-solid',\n              bgColor: '#0ac7c8'\n            }\n          }\n        }}\n        navigation={{\n          nodes: allNodes,\n          currentNodeId,\n          onNodeClick: id => {\n            onNodeClick(id, currentDrawer);\n          }\n        }}\n        utils={{\n          onItemClick: id => {\n            setCurrentDrawer(id);\n            if (id === 'explorer') {\n              const appExploreTree = currentNodeId\n                ? treeHelpers.expandTo(appExplorerMenuList, currentNodeId)\n                : appExplorerMenuList;\n              setAllNodes(appExploreTree);\n            }\n\n            if (id === 'branches') {\n              const branchTree = currentNodeId\n                ? treeHelpers.expandTo(branchesMenuList, currentNodeId)\n                : branchesMenuList;\n              setAllNodes(branchTree);\n            }\n\n            if (id === 'records') {\n              const recordTree = currentNodeId\n                ? treeHelpers.expandTo(recordMenuList, currentNodeId)\n                : recordMenuList;\n              setAllNodes(recordTree);\n            }\n          },\n          currentItemId: currentUtil,\n          items: [\n            {\n              label: 'App Explorer',\n              id: 'explorer'\n            },\n            {\n              label: 'Branches',\n              id: 'branches'\n            },\n            {\n              label: 'Records',\n              id: 'records'\n            }\n          ],\n          drawer: {\n            onBeforeClose: () => {\n              setCurrentDrawer('');\n              setAllNodes(currentNodeId ? treeHelpers.expandTo(treeList, currentNodeId) : treeList);\n            }\n          },\n          devMode: true\n        }}\n      />\n    </>\n  );\n};\n\nAppShellDemo.args = {\n  hideNavigation: false,\n  showBreadcrumbs: true,\n  showPreview: true,\n  onPreviewClick: action('Clicked preview button')\n};\n\nAppShellDemo.argTypes = {\n  hideNavigation: { control: { type: 'boolean' } },\n  showBreadcrumbs: { control: { type: 'boolean' } },\n  showPreview: { control: { type: 'boolean' } },\n  onPreviewClick: { table: { disable: true } }\n};\n"]}

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

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

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

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

package/jsx/build/FlowModeller/AddNodeUtils.mocks.js

@@ -0,0 +1,291 @@
+const nodeDefaults = {
+    position: { x: 0, y: 0 },
+    dimensions: { width: 20, height: 20 }
+};
+const connectorDefaults = {
+    points: []
+};
+const graphData1 = {
+    nodes: [
+        {
+            ...nodeDefaults,
+            id: '100'
+        },
+        {
+            ...nodeDefaults,
+            id: '101'
+        },
+        {
+            ...nodeDefaults,
+            id: '102'
+        },
+        {
+            ...nodeDefaults,
+            id: '103'
+        },
+        {
+            ...nodeDefaults,
+            id: '104'
+        },
+        {
+            ...nodeDefaults,
+            id: '105'
+        },
+        {
+            ...nodeDefaults,
+            id: '106'
+        },
+        {
+            ...nodeDefaults,
+            id: '107'
+        },
+        {
+            ...nodeDefaults,
+            id: '108'
+        },
+        {
+            ...nodeDefaults,
+            id: '109'
+        },
+        {
+            ...nodeDefaults,
+            id: '110'
+        },
+        {
+            ...nodeDefaults,
+            id: '111'
+        }
+    ],
+    connectors: [
+        {
+            ...connectorDefaults,
+            id: '100-101',
+            fromNodeId: '100',
+            toNodeId: '101'
+        },
+        {
+            ...connectorDefaults,
+            id: '101-102',
+            fromNodeId: '101',
+            toNodeId: '102'
+        },
+        {
+            ...connectorDefaults,
+            id: '101-103',
+            fromNodeId: '101',
+            toNodeId: '103'
+        },
+        {
+            ...connectorDefaults,
+            id: '102-104',
+            fromNodeId: '102',
+            toNodeId: '104'
+        },
+        {
+            ...connectorDefaults,
+            id: '102-105',
+            fromNodeId: '102',
+            toNodeId: '105'
+        },
+        {
+            ...connectorDefaults,
+            id: '102-106',
+            fromNodeId: '102',
+            toNodeId: '106'
+        },
+        {
+            ...connectorDefaults,
+            id: '103-107',
+            fromNodeId: '103',
+            toNodeId: '107'
+        },
+        {
+            ...connectorDefaults,
+            id: '103-108',
+            fromNodeId: '103',
+            toNodeId: '108'
+        },
+        {
+            ...connectorDefaults,
+            id: '104-109',
+            fromNodeId: '104',
+            toNodeId: '109'
+        },
+        {
+            ...connectorDefaults,
+            id: '104-110',
+            fromNodeId: '104',
+            toNodeId: '110'
+        },
+        {
+            ...connectorDefaults,
+            id: '105-111',
+            fromNodeId: '105',
+            toNodeId: '111'
+        },
+        {
+            ...connectorDefaults,
+            id: '106-111',
+            fromNodeId: '106',
+            toNodeId: '111'
+        },
+        {
+            ...connectorDefaults,
+            id: '107-111',
+            fromNodeId: '107',
+            toNodeId: '111'
+        },
+        {
+            ...connectorDefaults,
+            id: '108-111',
+            fromNodeId: '108',
+            toNodeId: '111'
+        },
+        {
+            ...connectorDefaults,
+            id: '109-111',
+            fromNodeId: '109',
+            toNodeId: '111'
+        },
+        {
+            ...connectorDefaults,
+            id: '110-111',
+            fromNodeId: '110',
+            toNodeId: '111'
+        }
+    ]
+};
+const onGetNewNode = metaData => {
+    return {
+        ...nodeDefaults,
+        id: `ph-n-${metaData.refId.join('_')}`
+    };
+};
+const onGetNewConnector = (fromNodeId, toNodeId, metaData) => {
+    return {
+        ...connectorDefaults,
+        id: `ph-c-${metaData.refId.join('_')}`,
+        fromNodeId,
+        toNodeId
+    };
+};
+const result = {
+    nodes: [
+        { ...nodeDefaults, id: '100' },
+        { ...nodeDefaults, id: '101' },
+        { ...nodeDefaults, id: '102' },
+        { ...nodeDefaults, id: '103' },
+        { ...nodeDefaults, id: '104' },
+        { ...nodeDefaults, id: '105' },
+        { ...nodeDefaults, id: '106' },
+        { ...nodeDefaults, id: '107' },
+        { ...nodeDefaults, id: '108' },
+        { ...nodeDefaults, id: '109' },
+        { ...nodeDefaults, id: '110' },
+        { ...nodeDefaults, id: '111' },
+        {
+            ...nodeDefaults,
+            id: 'ph-n-109-111_110-111',
+            realConnectors: ['109-111', '110-111']
+        },
+        {
+            ...nodeDefaults,
+            id: 'ph-n-109-111_110-111_105-111_106-111',
+            realConnectors: ['109-111', '110-111', '105-111', '106-111']
+        },
+        {
+            ...nodeDefaults,
+            id: 'ph-n-107-111_108-111',
+            realConnectors: ['107-111', '108-111']
+        },
+        {
+            ...nodeDefaults,
+            id: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',
+            realConnectors: ['109-111', '110-111', '105-111', '106-111', '107-111', '108-111']
+        }
+    ],
+    connectors: [
+        { points: [], id: '100-101', fromNodeId: '100', toNodeId: '101' },
+        { points: [], id: '101-102', fromNodeId: '101', toNodeId: '102' },
+        { points: [], id: '101-103', fromNodeId: '101', toNodeId: '103' },
+        { points: [], id: '102-104', fromNodeId: '102', toNodeId: '104' },
+        { points: [], id: '102-105', fromNodeId: '102', toNodeId: '105' },
+        { points: [], id: '102-106', fromNodeId: '102', toNodeId: '106' },
+        { points: [], id: '103-107', fromNodeId: '103', toNodeId: '107' },
+        { points: [], id: '103-108', fromNodeId: '103', toNodeId: '108' },
+        { points: [], id: '104-109', fromNodeId: '104', toNodeId: '109' },
+        { points: [], id: '104-110', fromNodeId: '104', toNodeId: '110' },
+        {
+            points: [],
+            id: '105-111',
+            fromNodeId: '105',
+            toNodeId: 'ph-n-109-111_110-111_105-111_106-111'
+        },
+        {
+            points: [],
+            id: '106-111',
+            fromNodeId: '106',
+            toNodeId: 'ph-n-109-111_110-111_105-111_106-111'
+        },
+        {
+            points: [],
+            id: '107-111',
+            fromNodeId: '107',
+            toNodeId: 'ph-n-107-111_108-111'
+        },
+        {
+            points: [],
+            id: '108-111',
+            fromNodeId: '108',
+            toNodeId: 'ph-n-107-111_108-111'
+        },
+        {
+            points: [],
+            id: '109-111',
+            fromNodeId: '109',
+            toNodeId: 'ph-n-109-111_110-111'
+        },
+        {
+            points: [],
+            id: '110-111',
+            fromNodeId: '110',
+            toNodeId: 'ph-n-109-111_110-111'
+        },
+        {
+            points: [],
+            id: 'ph-c-109-111_110-111',
+            fromNodeId: 'ph-n-109-111_110-111',
+            toNodeId: 'ph-n-109-111_110-111_105-111_106-111',
+            realConnectors: ['109-111', '110-111']
+        },
+        {
+            points: [],
+            id: 'ph-c-109-111_110-111_105-111_106-111',
+            fromNodeId: 'ph-n-109-111_110-111_105-111_106-111',
+            toNodeId: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',
+            realConnectors: ['109-111', '110-111', '105-111', '106-111']
+        },
+        {
+            points: [],
+            id: 'ph-c-107-111_108-111',
+            fromNodeId: 'ph-n-107-111_108-111',
+            toNodeId: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',
+            realConnectors: ['107-111', '108-111']
+        },
+        {
+            points: [],
+            id: 'ph-c-109-111_110-111_105-111_106-111_107-111_108-111',
+            fromNodeId: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',
+            toNodeId: '111',
+            realConnectors: ['109-111', '110-111', '105-111', '106-111', '107-111', '108-111']
+        }
+    ]
+};
+const AddNodeUtilsMocks = {
+    graphData1,
+    onGetNewNode,
+    onGetNewConnector,
+    result
+};
+export default AddNodeUtilsMocks;
+//# sourceMappingURL=AddNodeUtils.mocks.js.map

package/jsx/build/FlowModeller/AddNodeUtils.mocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddNodeUtils.mocks.js","sourceRoot":"","sources":["../../../src/build/FlowModeller/AddNodeUtils.mocks.ts"],"names":[],"mappings":"AAOA,MAAM,YAAY,GAAG;IACnB,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IACxB,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;CACtC,CAAC;AAEF,MAAM,iBAAiB,GAAG;IACxB,MAAM,EAAE,EAAE;CACX,CAAC;AAEF,MAAM,UAAU,GAAyD;IACvE,KAAK,EAAE;QACL;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,KAAK;SACV;KACF;IACD,UAAU,EAAE;QACV;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;QACD;YACE,GAAG,iBAAiB;YACpB,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,KAAK;SAChB;KACF;CACF,CAAC;AAEF,MAAM,YAAY,GAA0D,QAAQ,CAAC,EAAE;IACrF,OAAO;QACL,GAAG,YAAY;QACf,EAAE,EAAE,QAAS,QAAQ,CAAC,KAAkB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;KACrD,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAIO,CAAC,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE;IAC/D,OAAO;QACL,GAAG,iBAAiB;QACpB,EAAE,EAAE,QAAS,QAAQ,CAAC,KAAkB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;QACpD,UAAU;QACV,QAAQ;KACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG;IACb,KAAK,EAAE;QACL,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B,EAAE,GAAG,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE;QAC9B;YACE,GAAG,YAAY;YACf,EAAE,EAAE,sBAAsB;YAC1B,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;SACvC;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,sCAAsC;YAC1C,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC;SAC7D;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,sBAAsB;YAC1B,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;SACvC;QACD;YACE,GAAG,YAAY;YACf,EAAE,EAAE,sDAAsD;YAC1D,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC;SACnF;KACF;IACD,UAAU,EAAE;QACV,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE;QACjE;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sCAAsC;SACjD;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sCAAsC;SACjD;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sBAAsB;SACjC;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sBAAsB;SACjC;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sBAAsB;SACjC;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,SAAS;YACb,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sBAAsB;SACjC;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,sBAAsB;YAC1B,UAAU,EAAE,sBAAsB;YAClC,QAAQ,EAAE,sCAAsC;YAChD,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;SACvC;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,sCAAsC;YAC1C,UAAU,EAAE,sCAAsC;YAClD,QAAQ,EAAE,sDAAsD;YAChE,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC;SAC7D;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,sBAAsB;YAC1B,UAAU,EAAE,sBAAsB;YAClC,QAAQ,EAAE,sDAAsD;YAChE,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;SACvC;QACD;YACE,MAAM,EAAE,EAAE;YACV,EAAE,EAAE,sDAAsD;YAC1D,UAAU,EAAE,sDAAsD;YAClE,QAAQ,EAAE,KAAK;YACf,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC;SACnF;KACF;CACF,CAAC;AAEF,MAAM,iBAAiB,GAAG;IACxB,UAAU;IACV,YAAY;IACZ,iBAAiB;IACjB,MAAM;CACP,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import {\n  AddNodeHandlerParams,\n  RendererConnectorProps,\n  RendererNodeProps,\n  GraphData\n} from '@pega/cosmos-react-build';\n\nconst nodeDefaults = {\n  position: { x: 0, y: 0 },\n  dimensions: { width: 20, height: 20 }\n};\n\nconst connectorDefaults = {\n  points: []\n};\n\nconst graphData1: GraphData<RendererNodeProps, RendererConnectorProps> = {\n  nodes: [\n    {\n      ...nodeDefaults,\n      id: '100'\n    },\n    {\n      ...nodeDefaults,\n      id: '101'\n    },\n    {\n      ...nodeDefaults,\n      id: '102'\n    },\n    {\n      ...nodeDefaults,\n      id: '103'\n    },\n    {\n      ...nodeDefaults,\n      id: '104'\n    },\n    {\n      ...nodeDefaults,\n      id: '105'\n    },\n    {\n      ...nodeDefaults,\n      id: '106'\n    },\n    {\n      ...nodeDefaults,\n      id: '107'\n    },\n    {\n      ...nodeDefaults,\n      id: '108'\n    },\n    {\n      ...nodeDefaults,\n      id: '109'\n    },\n    {\n      ...nodeDefaults,\n      id: '110'\n    },\n    {\n      ...nodeDefaults,\n      id: '111'\n    }\n  ],\n  connectors: [\n    {\n      ...connectorDefaults,\n      id: '100-101',\n      fromNodeId: '100',\n      toNodeId: '101'\n    },\n    {\n      ...connectorDefaults,\n      id: '101-102',\n      fromNodeId: '101',\n      toNodeId: '102'\n    },\n    {\n      ...connectorDefaults,\n      id: '101-103',\n      fromNodeId: '101',\n      toNodeId: '103'\n    },\n    {\n      ...connectorDefaults,\n      id: '102-104',\n      fromNodeId: '102',\n      toNodeId: '104'\n    },\n    {\n      ...connectorDefaults,\n      id: '102-105',\n      fromNodeId: '102',\n      toNodeId: '105'\n    },\n    {\n      ...connectorDefaults,\n      id: '102-106',\n      fromNodeId: '102',\n      toNodeId: '106'\n    },\n    {\n      ...connectorDefaults,\n      id: '103-107',\n      fromNodeId: '103',\n      toNodeId: '107'\n    },\n    {\n      ...connectorDefaults,\n      id: '103-108',\n      fromNodeId: '103',\n      toNodeId: '108'\n    },\n    {\n      ...connectorDefaults,\n      id: '104-109',\n      fromNodeId: '104',\n      toNodeId: '109'\n    },\n    {\n      ...connectorDefaults,\n      id: '104-110',\n      fromNodeId: '104',\n      toNodeId: '110'\n    },\n    {\n      ...connectorDefaults,\n      id: '105-111',\n      fromNodeId: '105',\n      toNodeId: '111'\n    },\n    {\n      ...connectorDefaults,\n      id: '106-111',\n      fromNodeId: '106',\n      toNodeId: '111'\n    },\n    {\n      ...connectorDefaults,\n      id: '107-111',\n      fromNodeId: '107',\n      toNodeId: '111'\n    },\n    {\n      ...connectorDefaults,\n      id: '108-111',\n      fromNodeId: '108',\n      toNodeId: '111'\n    },\n    {\n      ...connectorDefaults,\n      id: '109-111',\n      fromNodeId: '109',\n      toNodeId: '111'\n    },\n    {\n      ...connectorDefaults,\n      id: '110-111',\n      fromNodeId: '110',\n      toNodeId: '111'\n    }\n  ]\n};\n\nconst onGetNewNode: (metaData: AddNodeHandlerParams) => RendererNodeProps = metaData => {\n  return {\n    ...nodeDefaults,\n    id: `ph-n-${(metaData.refId as string[]).join('_')}` // ${createUID()}`\n  };\n};\n\nconst onGetNewConnector: (\n  fromNodeId: string,\n  toNodeId: string,\n  metaData: AddNodeHandlerParams\n) => RendererConnectorProps = (fromNodeId, toNodeId, metaData) => {\n  return {\n    ...connectorDefaults,\n    id: `ph-c-${(metaData.refId as string[]).join('_')}`, // ${createUID()}`\n    fromNodeId,\n    toNodeId\n  };\n};\n\nconst result = {\n  nodes: [\n    { ...nodeDefaults, id: '100' },\n    { ...nodeDefaults, id: '101' },\n    { ...nodeDefaults, id: '102' },\n    { ...nodeDefaults, id: '103' },\n    { ...nodeDefaults, id: '104' },\n    { ...nodeDefaults, id: '105' },\n    { ...nodeDefaults, id: '106' },\n    { ...nodeDefaults, id: '107' },\n    { ...nodeDefaults, id: '108' },\n    { ...nodeDefaults, id: '109' },\n    { ...nodeDefaults, id: '110' },\n    { ...nodeDefaults, id: '111' },\n    {\n      ...nodeDefaults,\n      id: 'ph-n-109-111_110-111',\n      realConnectors: ['109-111', '110-111']\n    },\n    {\n      ...nodeDefaults,\n      id: 'ph-n-109-111_110-111_105-111_106-111',\n      realConnectors: ['109-111', '110-111', '105-111', '106-111']\n    },\n    {\n      ...nodeDefaults,\n      id: 'ph-n-107-111_108-111',\n      realConnectors: ['107-111', '108-111']\n    },\n    {\n      ...nodeDefaults,\n      id: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',\n      realConnectors: ['109-111', '110-111', '105-111', '106-111', '107-111', '108-111']\n    }\n  ],\n  connectors: [\n    { points: [], id: '100-101', fromNodeId: '100', toNodeId: '101' },\n    { points: [], id: '101-102', fromNodeId: '101', toNodeId: '102' },\n    { points: [], id: '101-103', fromNodeId: '101', toNodeId: '103' },\n    { points: [], id: '102-104', fromNodeId: '102', toNodeId: '104' },\n    { points: [], id: '102-105', fromNodeId: '102', toNodeId: '105' },\n    { points: [], id: '102-106', fromNodeId: '102', toNodeId: '106' },\n    { points: [], id: '103-107', fromNodeId: '103', toNodeId: '107' },\n    { points: [], id: '103-108', fromNodeId: '103', toNodeId: '108' },\n    { points: [], id: '104-109', fromNodeId: '104', toNodeId: '109' },\n    { points: [], id: '104-110', fromNodeId: '104', toNodeId: '110' },\n    {\n      points: [],\n      id: '105-111',\n      fromNodeId: '105',\n      toNodeId: 'ph-n-109-111_110-111_105-111_106-111'\n    },\n    {\n      points: [],\n      id: '106-111',\n      fromNodeId: '106',\n      toNodeId: 'ph-n-109-111_110-111_105-111_106-111'\n    },\n    {\n      points: [],\n      id: '107-111',\n      fromNodeId: '107',\n      toNodeId: 'ph-n-107-111_108-111'\n    },\n    {\n      points: [],\n      id: '108-111',\n      fromNodeId: '108',\n      toNodeId: 'ph-n-107-111_108-111'\n    },\n    {\n      points: [],\n      id: '109-111',\n      fromNodeId: '109',\n      toNodeId: 'ph-n-109-111_110-111'\n    },\n    {\n      points: [],\n      id: '110-111',\n      fromNodeId: '110',\n      toNodeId: 'ph-n-109-111_110-111'\n    },\n    {\n      points: [],\n      id: 'ph-c-109-111_110-111',\n      fromNodeId: 'ph-n-109-111_110-111',\n      toNodeId: 'ph-n-109-111_110-111_105-111_106-111',\n      realConnectors: ['109-111', '110-111']\n    },\n    {\n      points: [],\n      id: 'ph-c-109-111_110-111_105-111_106-111',\n      fromNodeId: 'ph-n-109-111_110-111_105-111_106-111',\n      toNodeId: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',\n      realConnectors: ['109-111', '110-111', '105-111', '106-111']\n    },\n    {\n      points: [],\n      id: 'ph-c-107-111_108-111',\n      fromNodeId: 'ph-n-107-111_108-111',\n      toNodeId: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',\n      realConnectors: ['107-111', '108-111']\n    },\n    {\n      points: [],\n      id: 'ph-c-109-111_110-111_105-111_106-111_107-111_108-111',\n      fromNodeId: 'ph-n-109-111_110-111_105-111_106-111_107-111_108-111',\n      toNodeId: '111',\n      realConnectors: ['109-111', '110-111', '105-111', '106-111', '107-111', '108-111']\n    }\n  ]\n};\n\nconst AddNodeUtilsMocks = {\n  graphData1,\n  onGetNewNode,\n  onGetNewConnector,\n  result\n};\n\nexport default AddNodeUtilsMocks;\n"]}

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

@@ -0,0 +1,9 @@
+import { Action } from '@pega/cosmos-react-core';
+import { ConnectorProps, NodeProps, NodeLibraryItem } from '@pega/cosmos-react-build';
+export declare const exampleCRMNodesData: NodeProps[];
+export declare const exampleCRMConnectorsData: ConnectorProps[];
+export declare const emptyNodesData: NodeProps[];
+export declare const emptyConnectorsData: ConnectorProps[];
+export declare const nodeActions: Action[];
+export declare const nodeLibrary: NodeLibraryItem[];
+//# sourceMappingURL=FlowModeller.mocks.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModeller.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/FlowModeller/FlowModeller.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EACL,cAAc,EACd,SAAS,EAET,eAAe,EAGhB,MAAM,0BAA0B,CAAC;AAuGlC,eAAO,MAAM,mBAAmB,EAAE,SAAS,EAoH1C,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,cAAc,EAyHpD,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,SAAS,EAWrC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,cAAc,EAO/C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,MAAM,EAS/B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,eAAe,EAsCxC,CAAC"}