@pega/cosmos-react-demos 3.0.0-dev.4.2 → 3.0.0-dev.7.0

package/lib/work/Tasks/Tasks.stories.js

@@ -10,7 +10,7 @@ export const TasksDemo = (args) => {
     const [isLimited, setIsLimited] = useState(true);
     const [hasOpenTask, setHasOpenTask] = useState(false);
     const DemoTaskForm = ({ onSubmit, onCancel }) => {
-        return (_jsxs(Form, { actions: _jsxs(_Fragment, { children: [_jsx(Button, { onClick: onCancel, children: "Cancel" }, void 0), _jsx(Button, { variant: 'primary', onClick: onSubmit, children: "Submit" }, void 0)] }, void 0), children: [_jsx(Input, { label: 'Text field 1', required: true }, void 0), _jsx(Input, { label: 'Text field 2' }, void 0), _jsx(NumberInput, { label: 'Number field' }, void 0), _jsx(Checkbox, { label: 'Boolean field', required: true }, void 0), _jsxs(RadioCheckGroup, { label: 'Picklist options', name: 'picklist-1', children: [_jsx(RadioButton, { label: 'option 1', defaultChecked: true }, void 0), _jsx(RadioButton, { label: 'option 2' }, void 0), _jsx(RadioButton, { label: 'option 3' }, void 0)] }, void 0), _jsx(TextArea, { label: 'Text paragraph field', required: true }, void 0), _jsx(FileInput, { label: 'File field' }, void 0), _jsx(DateInput, { label: 'Datetime field' }, void 0)] }, void 0));
+        return (_jsxs(Form, { actions: _jsxs(_Fragment, { children: [_jsx(Button, { onClick: onCancel, children: "Cancel" }), _jsx(Button, { variant: 'primary', onClick: onSubmit, children: "Submit" })] }), children: [_jsx(Input, { label: 'Text field 1', required: true }), _jsx(Input, { label: 'Text field 2' }), _jsx(NumberInput, { label: 'Number field' }), _jsx(Checkbox, { label: 'Boolean field', required: true }), _jsxs(RadioCheckGroup, { label: 'Picklist options', name: 'picklist-1', children: [_jsx(RadioButton, { label: 'option 1', defaultChecked: true }), _jsx(RadioButton, { label: 'option 2' }), _jsx(RadioButton, { label: 'option 3' })] }), _jsx(TextArea, { label: 'Text paragraph field', required: true }), _jsx(FileInput, { label: 'File field' }), _jsx(DateInput, { label: 'Datetime field' })] }));
     };
     const [workGroups, setWorkGroups] = useState(() => {
         return Array.from({ length: 10 }, (_, i) => {
@@ -19,7 +19,7 @@ export const TasksDemo = (args) => {
                 primary: `Workgroup ${i + 1}`,
                 count: Math.floor(Math.random() * 10),
                 selected: i === 0,
-                visual: _jsx(Avatar, { size: 'l', name: `Team ${i + 1}` }, void 0)
+                visual: _jsx(Avatar, { size: 'l', name: `Team ${i + 1}` })
             };
         });
     });
@@ -39,7 +39,7 @@ export const TasksDemo = (args) => {
                         });
                     });
                 }
-            } }, void 0));
+            } }));
     }, [activeGroup.primary]);
     const taskArray = useMemo(() => Array.from({ length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount }, (_, i) => {
         const dueIn = 86400000 * i;
@@ -53,23 +53,23 @@ export const TasksDemo = (args) => {
         return {
             name: `Task ${i + 1}`,
             meta: (_jsx(MetaList, { items: [
-                    _jsx(Status, { variant: status, children: status }, void 0),
-                    _jsxs(Text, { variant: 'secondary', children: ["Due ", _jsx(DateTimeDisplay, { variant: 'relative', value: Date.now() + dueIn }, void 0)] }, void 0),
-                    _jsx(Link, { href: '#demo', children: "Parent case link" }, void 0)
-                ] }, void 0)),
+                    _jsx(Status, { variant: status, children: status }),
+                    _jsxs(Text, { variant: 'secondary', children: ["Due ", _jsx(DateTimeDisplay, { variant: 'relative', value: Date.now() + dueIn })] }),
+                    _jsx(Link, { href: '#demo', children: "Parent case link" })
+                ] })),
             actions: (_jsx(Button, { onClick: () => {
                     setHasOpenTask(true);
-                }, children: "Go" }, void 0)),
+                }, children: "Go" })),
             content: hasOpenTask ? (_jsx(DemoTaskForm, { onSubmit: () => {
                     setHasOpenTask(false);
                 }, onCancel: () => {
                     setHasOpenTask(false);
-                } }, void 0)) : null
+                } })) : null
         };
     }), [isLimited, activeGroup, hasOpenTask]);
-    return (_jsx(Tasks, { headerText: args.headerText || 'Tasks', count: activeGroupTaskCount, items: taskArray, headerVisual: activeGroup ? _jsx(Avatar, { size: 'l', name: activeGroup.primary }, void 0) : undefined, headerSecondary: groupSelection, emptyPlaceholder: _jsx(EmptyState, {}, void 0), onExpandToggle: () => {
+    return (_jsx(Tasks, { headerText: args.headerText || 'Tasks', count: activeGroupTaskCount, items: taskArray, headerVisual: activeGroup ? _jsx(Avatar, { size: 'l', name: activeGroup.primary }) : undefined, headerSecondary: groupSelection, emptyPlaceholder: _jsx(EmptyState, {}), onExpandToggle: () => {
             setIsLimited(cur => !cur);
-        } }, void 0));
+        } }));
 };
 TasksDemo.args = {
     headerText: 'Tasks'

package/lib/work/Tasks/Tasks.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tasks.stories.js","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useMemo, useState } from 'react';\n\nimport {\n  Avatar,\n  Button,\n  MenuButton,\n  MenuProps,\n  MetaList,\n  Text,\n  Form,\n  Input,\n  TextArea,\n  RadioCheckGroup,\n  RadioButton,\n  Checkbox,\n  DateInput,\n  NumberInput,\n  FileInput,\n  menuHelpers,\n  Status,\n  Link,\n  DateTimeDisplay,\n  StatusProps,\n  EmptyState\n} from '@pega/cosmos-react-core';\nimport { Tasks, TasksProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nexport default {\n  title: 'Work/Tasks',\n  component: Tasks\n} as Meta;\n\ninterface TasksStoryProps {\n  headerText?: TasksProps['headerText'];\n}\n\nexport const TasksDemo: Story<TasksStoryProps> = (args: TasksStoryProps) => {\n  const [isLimited, setIsLimited] = useState(true);\n  const [hasOpenTask, setHasOpenTask] = useState(false);\n\n  const DemoTaskForm = ({ onSubmit, onCancel }: { onSubmit: () => void; onCancel: () => void }) => {\n    return (\n      <Form\n        actions={\n          <>\n            <Button onClick={onCancel}>Cancel</Button>\n            <Button variant='primary' onClick={onSubmit}>\n              Submit\n            </Button>\n          </>\n        }\n      >\n        <Input label='Text field 1' required />\n        <Input label='Text field 2' />\n        <NumberInput label='Number field' />\n        <Checkbox label='Boolean field' required />\n        <RadioCheckGroup label='Picklist options' name='picklist-1'>\n          <RadioButton label='option 1' defaultChecked />\n          <RadioButton label='option 2' />\n          <RadioButton label='option 3' />\n        </RadioCheckGroup>\n        <TextArea label='Text paragraph field' required />\n        <FileInput label='File field' />\n        <DateInput label='Datetime field' />\n      </Form>\n    );\n  };\n\n  const [workGroups, setWorkGroups] = useState<MenuProps['items']>(() => {\n    return Array.from({ length: 10 }, (_, i) => {\n      return {\n        id: `${i + 1}`,\n        primary: `Workgroup ${i + 1}`,\n        count: Math.floor(Math.random() * 10),\n        selected: i === 0,\n        visual: <Avatar size='l' name={`Team ${i + 1}`} />\n      };\n    });\n  });\n\n  const activeGroup = useMemo(() => menuHelpers.getSelected(workGroups)[0], [workGroups]);\n  const activeGroupTaskCount = activeGroup?.count ?? 0;\n\n  const groupSelection = useMemo(() => {\n    return (\n      <MenuButton\n        variant='text'\n        text={activeGroup.primary}\n        menu={{\n          mode: 'single-select',\n          items: workGroups,\n          onItemClick: id => {\n            setWorkGroups(currentWorkGroups => {\n              return menuHelpers.mapTree(currentWorkGroups, group => {\n                if (id === group.id || group.selected) {\n                  return { ...group, selected: id === group.id };\n                }\n\n                return group;\n              });\n            });\n          }\n        }}\n      />\n    );\n  }, [activeGroup.primary]);\n\n  const taskArray: TaskItemProps[] = useMemo(\n    () =>\n      Array.from(\n        { length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount },\n        (_, i) => {\n          const dueIn = 86400000 * i;\n          let status: StatusProps['variant'] = 'info';\n\n          if (i === 0) {\n            status = 'urgent';\n          } else if (i === 1) {\n            status = 'warn';\n          }\n\n          return {\n            name: `Task ${i + 1}`,\n            meta: (\n              <MetaList\n                items={[\n                  <Status variant={status}>{status}</Status>,\n                  <Text variant='secondary'>\n                    Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn} />\n                  </Text>,\n                  <Link href='#demo'>Parent case link</Link>\n                ]}\n              />\n            ),\n            actions: (\n              <Button\n                onClick={() => {\n                  setHasOpenTask(true);\n                }}\n              >\n                Go\n              </Button>\n            ),\n            content: hasOpenTask ? (\n              <DemoTaskForm\n                onSubmit={() => {\n                  setHasOpenTask(false);\n                }}\n                onCancel={() => {\n                  setHasOpenTask(false);\n                }}\n              />\n            ) : null\n          };\n        }\n      ),\n    [isLimited, activeGroup, hasOpenTask]\n  );\n\n  return (\n    <Tasks\n      headerText={args.headerText || 'Tasks'}\n      count={activeGroupTaskCount}\n      items={taskArray}\n      headerVisual={activeGroup ? <Avatar size='l' name={activeGroup.primary} /> : undefined}\n      headerSecondary={groupSelection}\n      emptyPlaceholder={<EmptyState />}\n      onExpandToggle={() => {\n        setIsLimited(cur => !cur);\n      }}\n    />\n  );\n};\n\nTasksDemo.args = {\n  headerText: 'Tasks'\n};\n\nTasksDemo.argTypes = {\n  headerText: { control: { type: 'text' } }\n};\n"]}
+{"version":3,"file":"Tasks.stories.js","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EACL,MAAM,EACN,MAAM,EACN,UAAU,EAEV,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,eAAe,EACf,WAAW,EACX,QAAQ,EACR,SAAS,EACT,WAAW,EACX,SAAS,EACT,WAAW,EACX,MAAM,EACN,IAAI,EACJ,eAAe,EAEf,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,KAAK,EAA6B,MAAM,yBAAyB,CAAC;AAE3E,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,KAAK;CACT,CAAC;AAMV,MAAM,CAAC,MAAM,SAAS,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACzE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,MAAM,YAAY,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAkD,EAAE,EAAE;QAC9F,OAAO,CACL,MAAC,IAAI,IACH,OAAO,EACL,8BACE,KAAC,MAAM,IAAC,OAAO,EAAE,QAAQ,uBAAiB,EAC1C,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAE,QAAQ,uBAElC,IACR,aAGL,KAAC,KAAK,IAAC,KAAK,EAAC,cAAc,EAAC,QAAQ,SAAG,EACvC,KAAC,KAAK,IAAC,KAAK,EAAC,cAAc,GAAG,EAC9B,KAAC,WAAW,IAAC,KAAK,EAAC,cAAc,GAAG,EACpC,KAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,SAAG,EAC3C,MAAC,eAAe,IAAC,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,YAAY,aACzD,KAAC,WAAW,IAAC,KAAK,EAAC,UAAU,EAAC,cAAc,SAAG,EAC/C,KAAC,WAAW,IAAC,KAAK,EAAC,UAAU,GAAG,EAChC,KAAC,WAAW,IAAC,KAAK,EAAC,UAAU,GAAG,IAChB,EAClB,KAAC,QAAQ,IAAC,KAAK,EAAC,sBAAsB,EAAC,QAAQ,SAAG,EAClD,KAAC,SAAS,IAAC,KAAK,EAAC,YAAY,GAAG,EAChC,KAAC,SAAS,IAAC,KAAK,EAAC,gBAAgB,GAAG,IAC/B,CACR,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAqB,GAAG,EAAE;QACpE,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACzC,OAAO;gBACL,EAAE,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE;gBACd,OAAO,EAAE,aAAa,CAAC,GAAG,CAAC,EAAE;gBAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC;gBACrC,QAAQ,EAAE,CAAC,KAAK,CAAC;gBACjB,MAAM,EAAE,KAAC,MAAM,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,GAAI;aACnD,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IACxF,MAAM,oBAAoB,GAAG,WAAW,EAAE,KAAK,IAAI,CAAC,CAAC;IAErD,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,IAAI,EAAE;gBACJ,IAAI,EAAE,eAAe;gBACrB,KAAK,EAAE,UAAU;gBACjB,WAAW,EAAE,EAAE,CAAC,EAAE;oBAChB,aAAa,CAAC,iBAAiB,CAAC,EAAE;wBAChC,OAAO,WAAW,CAAC,OAAO,CAAC,iBAAiB,EAAE,KAAK,CAAC,EAAE;4BACpD,IAAI,EAAE,KAAK,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,QAAQ,EAAE;gCACrC,OAAO,EAAE,GAAG,KAAK,EAAE,QAAQ,EAAE,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,CAAC;6BAChD;4BAED,OAAO,KAAK,CAAC;wBACf,CAAC,CAAC,CAAC;oBACL,CAAC,CAAC,CAAC;gBACL,CAAC;aACF,GACD,CACH,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;IAE1B,MAAM,SAAS,GAAoB,OAAO,CACxC,GAAG,EAAE,CACH,KAAK,CAAC,IAAI,CACR,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC,oBAAoB,EAAE,EAChF,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACP,MAAM,KAAK,GAAG,QAAQ,GAAG,CAAC,CAAC;QAC3B,IAAI,MAAM,GAA2B,MAAM,CAAC;QAE5C,IAAI,CAAC,KAAK,CAAC,EAAE;YACX,MAAM,GAAG,QAAQ,CAAC;SACnB;aAAM,IAAI,CAAC,KAAK,CAAC,EAAE;YAClB,MAAM,GAAG,MAAM,CAAC;SACjB;QAED,OAAO;YACL,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE;YACrB,IAAI,EAAE,CACJ,KAAC,QAAQ,IACP,KAAK,EAAE;oBACL,KAAC,MAAM,IAAC,OAAO,EAAE,MAAM,YAAG,MAAM,GAAU;oBAC1C,MAAC,IAAI,IAAC,OAAO,EAAC,WAAW,qBACnB,KAAC,eAAe,IAAC,OAAO,EAAC,UAAU,EAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,GAAI,IAChE;oBACP,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,iCAAwB;iBAC3C,GACD,CACH;YACD,OAAO,EAAE,CACP,KAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE;oBACZ,cAAc,CAAC,IAAI,CAAC,CAAC;gBACvB,CAAC,mBAGM,CACV;YACD,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CACrB,KAAC,YAAY,IACX,QAAQ,EAAE,GAAG,EAAE;oBACb,cAAc,CAAC,KAAK,CAAC,CAAC;gBACxB,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;oBACb,cAAc,CAAC,KAAK,CAAC,CAAC;gBACxB,CAAC,GACD,CACH,CAAC,CAAC,CAAC,IAAI;SACT,CAAC;IACJ,CAAC,CACF,EACH,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,CAAC,CACtC,CAAC;IAEF,OAAO,CACL,KAAC,KAAK,IACJ,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,OAAO,EACtC,KAAK,EAAE,oBAAoB,EAC3B,KAAK,EAAE,SAAS,EAChB,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC,KAAC,MAAM,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,WAAW,CAAC,OAAO,GAAI,CAAC,CAAC,CAAC,SAAS,EACtF,eAAe,EAAE,cAAc,EAC/B,gBAAgB,EAAE,KAAC,UAAU,KAAG,EAChC,cAAc,EAAE,GAAG,EAAE;YACnB,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;QAC5B,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,CAAC,IAAI,GAAG;IACf,UAAU,EAAE,OAAO;CACpB,CAAC;AAEF,SAAS,CAAC,QAAQ,GAAG;IACnB,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CAC1C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useMemo, useState } from 'react';\n\nimport {\n  Avatar,\n  Button,\n  MenuButton,\n  MenuProps,\n  MetaList,\n  Text,\n  Form,\n  Input,\n  TextArea,\n  RadioCheckGroup,\n  RadioButton,\n  Checkbox,\n  DateInput,\n  NumberInput,\n  FileInput,\n  menuHelpers,\n  Status,\n  Link,\n  DateTimeDisplay,\n  StatusProps,\n  EmptyState\n} from '@pega/cosmos-react-core';\nimport { Tasks, TasksProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nexport default {\n  title: 'Work/Tasks',\n  component: Tasks\n} as Meta;\n\ninterface TasksStoryProps {\n  headerText?: TasksProps['headerText'];\n}\n\nexport const TasksDemo: Story<TasksStoryProps> = (args: TasksStoryProps) => {\n  const [isLimited, setIsLimited] = useState(true);\n  const [hasOpenTask, setHasOpenTask] = useState(false);\n\n  const DemoTaskForm = ({ onSubmit, onCancel }: { onSubmit: () => void; onCancel: () => void }) => {\n    return (\n      <Form\n        actions={\n          <>\n            <Button onClick={onCancel}>Cancel</Button>\n            <Button variant='primary' onClick={onSubmit}>\n              Submit\n            </Button>\n          </>\n        }\n      >\n        <Input label='Text field 1' required />\n        <Input label='Text field 2' />\n        <NumberInput label='Number field' />\n        <Checkbox label='Boolean field' required />\n        <RadioCheckGroup label='Picklist options' name='picklist-1'>\n          <RadioButton label='option 1' defaultChecked />\n          <RadioButton label='option 2' />\n          <RadioButton label='option 3' />\n        </RadioCheckGroup>\n        <TextArea label='Text paragraph field' required />\n        <FileInput label='File field' />\n        <DateInput label='Datetime field' />\n      </Form>\n    );\n  };\n\n  const [workGroups, setWorkGroups] = useState<MenuProps['items']>(() => {\n    return Array.from({ length: 10 }, (_, i) => {\n      return {\n        id: `${i + 1}`,\n        primary: `Workgroup ${i + 1}`,\n        count: Math.floor(Math.random() * 10),\n        selected: i === 0,\n        visual: <Avatar size='l' name={`Team ${i + 1}`} />\n      };\n    });\n  });\n\n  const activeGroup = useMemo(() => menuHelpers.getSelected(workGroups)[0], [workGroups]);\n  const activeGroupTaskCount = activeGroup?.count ?? 0;\n\n  const groupSelection = useMemo(() => {\n    return (\n      <MenuButton\n        variant='text'\n        text={activeGroup.primary}\n        menu={{\n          mode: 'single-select',\n          items: workGroups,\n          onItemClick: id => {\n            setWorkGroups(currentWorkGroups => {\n              return menuHelpers.mapTree(currentWorkGroups, group => {\n                if (id === group.id || group.selected) {\n                  return { ...group, selected: id === group.id };\n                }\n\n                return group;\n              });\n            });\n          }\n        }}\n      />\n    );\n  }, [activeGroup.primary]);\n\n  const taskArray: TaskItemProps[] = useMemo(\n    () =>\n      Array.from(\n        { length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount },\n        (_, i) => {\n          const dueIn = 86400000 * i;\n          let status: StatusProps['variant'] = 'info';\n\n          if (i === 0) {\n            status = 'urgent';\n          } else if (i === 1) {\n            status = 'warn';\n          }\n\n          return {\n            name: `Task ${i + 1}`,\n            meta: (\n              <MetaList\n                items={[\n                  <Status variant={status}>{status}</Status>,\n                  <Text variant='secondary'>\n                    Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn} />\n                  </Text>,\n                  <Link href='#demo'>Parent case link</Link>\n                ]}\n              />\n            ),\n            actions: (\n              <Button\n                onClick={() => {\n                  setHasOpenTask(true);\n                }}\n              >\n                Go\n              </Button>\n            ),\n            content: hasOpenTask ? (\n              <DemoTaskForm\n                onSubmit={() => {\n                  setHasOpenTask(false);\n                }}\n                onCancel={() => {\n                  setHasOpenTask(false);\n                }}\n              />\n            ) : null\n          };\n        }\n      ),\n    [isLimited, activeGroup, hasOpenTask]\n  );\n\n  return (\n    <Tasks\n      headerText={args.headerText || 'Tasks'}\n      count={activeGroupTaskCount}\n      items={taskArray}\n      headerVisual={activeGroup ? <Avatar size='l' name={activeGroup.primary} /> : undefined}\n      headerSecondary={groupSelection}\n      emptyPlaceholder={<EmptyState />}\n      onExpandToggle={() => {\n        setIsLimited(cur => !cur);\n      }}\n    />\n  );\n};\n\nTasksDemo.args = {\n  headerText: 'Tasks'\n};\n\nTasksDemo.argTypes = {\n  headerText: { control: { type: 'text' } }\n};\n"]}

package/lib/work/Timeline/Timeline.mocks.js

@@ -20,11 +20,11 @@ export const activity = [
         icon: 'bulb-solid',
         status: { variant: 'success', children: 'Good' },
         content: [
-            { id: '31', name: 'Date range', value: _jsx(Text, { children: "Jan 1, 2021 - May 3, 2021" }, void 0) },
+            { id: '31', name: 'Date range', value: _jsx(Text, { children: "Jan 1, 2021 - May 3, 2021" }) },
             {
                 id: '32',
                 name: "What's next",
-                value: (_jsx(Text, { children: "We will fulfill your request within 3 business days. You will receive your statement copy via mail at 23 Main St. Boston, MA." }, void 0))
+                value: (_jsx(Text, { children: "We will fulfill your request within 3 business days. You will receive your statement copy via mail at 23 Main St. Boston, MA." }))
             }
         ]
     },
@@ -35,18 +35,18 @@ export const activity = [
         icon: 'layers',
         status: { variant: 'pending', children: 'Wait' },
         content: [
-            { id: '41', name: 'Date range', value: _jsx(Text, { children: "Jan 1, 2021 - May 3, 2021" }, void 0) },
+            { id: '41', name: 'Date range', value: _jsx(Text, { children: "Jan 1, 2021 - May 3, 2021" }) },
             {
                 id: '42',
                 name: "What's next",
-                value: (_jsx(Text, { children: "We will fulfill your request within 3 business days. You will receive your statement copy via mail at 23 Main St. Boston, MA." }, void 0))
+                value: (_jsx(Text, { children: "We will fulfill your request within 3 business days. You will receive your statement copy via mail at 23 Main St. Boston, MA." }))
             }
         ]
     },
     {
         id: '5',
         date: Date.UTC(2021, 1, 20, 0, 1, 22),
-        title: (_jsx(Link, { href: 'https://community.pega.com/support', target: '_blank', children: "Visit Pega support for assistance" }, void 0))
+        title: (_jsx(Link, { href: 'https://community.pega.com/support', target: '_blank', children: "Visit Pega support for assistance" }))
     },
     {
         id: '6',
@@ -55,11 +55,11 @@ export const activity = [
         icon: 'bulb-solid',
         status: { variant: 'success', children: 'Good' },
         content: [
-            { id: '61', name: 'Date range', value: _jsx(Text, { children: "Jan 1, 2021 - May 3, 2021" }, void 0) },
+            { id: '61', name: 'Date range', value: _jsx(Text, { children: "Jan 1, 2021 - May 3, 2021" }) },
             {
                 id: '62',
                 name: "What's next",
-                value: (_jsx(Text, { children: "We will fulfill your request within 3 business days. You will receive your statement copy via mail at 23 Main St. Boston, MA." }, void 0))
+                value: (_jsx(Text, { children: "We will fulfill your request within 3 business days. You will receive your statement copy via mail at 23 Main St. Boston, MA." }))
             }
         ]
     },
@@ -98,7 +98,7 @@ export const activity = [
     {
         id: '12',
         date: Date.UTC(2022, 6, 18, 0, 1, 22),
-        title: (_jsx(Link, { href: 'https://www.pega.com', target: '_blank', children: "Visit Pega" }, void 0))
+        title: (_jsx(Link, { href: 'https://www.pega.com', target: '_blank', children: "Visit Pega" }))
     },
     {
         id: '13',

package/lib/work/Timeline/Timeline.mocks.js.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.mocks.js","sourceRoot":"","sources":["../../../src/work/Timeline/Timeline.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAGrD,MAAM,CAAC,MAAM,QAAQ,GAA8B;IACjD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,0BAA0B;QACjC,IAAI,EAAE,gBAAgB;KACvB;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;QACtC,KAAK,EAAE,qBAAqB;QAC5B,IAAI,EAAE,sBAAsB;KAC7B;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,mBAAmB;QAC1B,IAAI,EAAE,YAAY;QAClB,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;QAChD,OAAO,EAAE;YACP,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,KAAC,IAAI,oDAAiC,EAAE;YAC/E;gBACE,EAAE,EAAE,IAAI;gBACR,IAAI,EAAE,aAAa;gBACnB,KAAK,EAAE,CACL,KAAC,IAAI,wJAGE,CACR;aACF;SACF;KACF;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,6DAA6D;QACpE,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;QAChD,OAAO,EAAE;YACP,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,KAAC,IAAI,oDAAiC,EAAE;YAC/E;gBACE,EAAE,EAAE,IAAI;gBACR,IAAI,EAAE,aAAa;gBACnB,KAAK,EAAE,CACL,KAAC,IAAI,wJAGE,CACR;aACF;SACF;KACF;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;QACrC,KAAK,EAAE,CACL,KAAC,IAAI,IAAC,IAAI,EAAC,oCAAoC,EAAC,MAAM,EAAC,QAAQ,0DAExD,CACR;KACF;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,mBAAmB;QAC1B,IAAI,EAAE,YAAY;QAClB,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;QAChD,OAAO,EAAE;YACP,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,KAAC,IAAI,oDAAiC,EAAE;YAC/E;gBACE,EAAE,EAAE,IAAI;gBACR,IAAI,EAAE,aAAa;gBACnB,KAAK,EAAE,CACL,KAAC,IAAI,wJAGE,CACR;aACF;SACF;KACF;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,wBAAwB;QAC/B,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;KACjD;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,2BAA2B;QAClC,IAAI,EAAE,gBAAgB;KACvB;IACD;QACE,EAAE,EAAE,GAAG;QACP,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;QACtC,KAAK,EAAE,qBAAqB;QAC5B,IAAI,EAAE,sBAAsB;KAC7B;IACD;QACE,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,aAAa;QACpB,IAAI,EAAE,YAAY;QAClB,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;KACjD;IACD;QACE,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACxC,KAAK,EAAE,iBAAiB;QACxB,IAAI,EAAE,aAAa;QACnB,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;KACjD;IACD;QACE,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;QACrC,KAAK,EAAE,CACL,KAAC,IAAI,IAAC,IAAI,EAAC,sBAAsB,EAAC,MAAM,EAAC,QAAQ,mCAE1C,CACR;KACF;IACD;QACE,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC;QACtC,KAAK,EAAE,sBAAsB;QAC7B,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;KACjD;IACD;QACE,EAAE,EAAE,IAAI;QACR,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;QACvC,KAAK,EAAE,uBAAuB;QAC9B,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE;KACjD;CACF,CAAC","sourcesContent":["import { Link, Text } from '@pega/cosmos-react-core';\nimport { TimelineProps } from '@pega/cosmos-react-work';\n\nexport const activity: TimelineProps['activity'] = [\n  {\n    id: '1',\n    date: Date.UTC(2025, 2, 20, 19, 28, 22),\n    title: 'Email blast: \"Buy today\"',\n    icon: 'bell-off-solid'\n  },\n  {\n    id: '2',\n    date: Date.UTC(2025, 2, 20, 18, 6, 22),\n    title: 'Confirm eligibility',\n    icon: 'circle-stacked-mixed'\n  },\n  {\n    id: '3',\n    date: Date.UTC(2021, 1, 20, 13, 20, 22),\n    title: 'Sent over request',\n    icon: 'bulb-solid',\n    status: { variant: 'success', children: 'Good' },\n    content: [\n      { id: '31', name: 'Date range', value: <Text>Jan 1, 2021 - May 3, 2021</Text> },\n      {\n        id: '32',\n        name: \"What's next\",\n        value: (\n          <Text>\n            We will fulfill your request within 3 business days. You will receive your statement\n            copy via mail at 23 Main St. Boston, MA.\n          </Text>\n        )\n      }\n    ]\n  },\n  {\n    id: '4',\n    date: Date.UTC(2021, 1, 20, 13, 19, 22),\n    title: 'Fulfill customer request for last month’s billing statement',\n    icon: 'layers',\n    status: { variant: 'pending', children: 'Wait' },\n    content: [\n      { id: '41', name: 'Date range', value: <Text>Jan 1, 2021 - May 3, 2021</Text> },\n      {\n        id: '42',\n        name: \"What's next\",\n        value: (\n          <Text>\n            We will fulfill your request within 3 business days. You will receive your statement\n            copy via mail at 23 Main St. Boston, MA.\n          </Text>\n        )\n      }\n    ]\n  },\n  {\n    id: '5',\n    date: Date.UTC(2021, 1, 20, 0, 1, 22),\n    title: (\n      <Link href='https://community.pega.com/support' target='_blank'>\n        Visit Pega support for assistance\n      </Link>\n    )\n  },\n  {\n    id: '6',\n    date: Date.UTC(2021, 1, 19, 13, 20, 22),\n    title: 'Sent over request',\n    icon: 'bulb-solid',\n    status: { variant: 'success', children: 'Good' },\n    content: [\n      { id: '61', name: 'Date range', value: <Text>Jan 1, 2021 - May 3, 2021</Text> },\n      {\n        id: '62',\n        name: \"What's next\",\n        value: (\n          <Text>\n            We will fulfill your request within 3 business days. You will receive your statement\n            copy via mail at 23 Main St. Boston, MA.\n          </Text>\n        )\n      }\n    ]\n  },\n  {\n    id: '7',\n    date: Date.UTC(2021, 1, 17, 36, 20, 22),\n    title: 'Initial claim received',\n    status: { variant: 'pending', children: 'Wait' }\n  },\n  {\n    id: '8',\n    date: Date.UTC(2020, 2, 20, 19, 28, 22),\n    title: 'Email blast: \"Best Offer\"',\n    icon: 'bell-off-solid'\n  },\n  {\n    id: '9',\n    date: Date.UTC(2022, 7, 10, 18, 6, 22),\n    title: 'Confirm eligibility',\n    icon: 'circle-stacked-mixed'\n  },\n  {\n    id: '10',\n    date: Date.UTC(2021, 6, 10, 13, 20, 22),\n    title: 'Update plat',\n    icon: 'bulb-solid',\n    status: { variant: 'success', children: 'Good' }\n  },\n  {\n    id: '11',\n    date: Date.UTC(2020, 12, 15, 13, 19, 22),\n    title: 'Balance inquiry',\n    icon: 'phone-solid',\n    status: { variant: 'pending', children: 'Wait' }\n  },\n  {\n    id: '12',\n    date: Date.UTC(2022, 6, 18, 0, 1, 22),\n    title: (\n      <Link href='https://www.pega.com' target='_blank'>\n        Visit Pega\n      </Link>\n    )\n  },\n  {\n    id: '13',\n    date: Date.UTC(2023, 2, 10, 9, 26, 22),\n    title: 'Review customer bill',\n    status: { variant: 'pending', children: 'Wait' }\n  },\n  {\n    id: '14',\n    date: Date.UTC(2020, 1, 12, 10, 25, 48),\n    title: 'Receive customer bill',\n    icon: 'layers',\n    status: { variant: 'success', children: 'Good' }\n  }\n];\n"]}
+{"version":3,"file":"Timeline.mocks.js","sourceRoot":"","sources":["../../../src/work/Timeline/Timeline.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Link, Text } from '@pega/cosmos-react-core';\nimport { TimelineProps } from '@pega/cosmos-react-work';\n\nexport const activity: TimelineProps['activity'] = [\n  {\n    id: '1',\n    date: Date.UTC(2025, 2, 20, 19, 28, 22),\n    title: 'Email blast: \"Buy today\"',\n    icon: 'bell-off-solid'\n  },\n  {\n    id: '2',\n    date: Date.UTC(2025, 2, 20, 18, 6, 22),\n    title: 'Confirm eligibility',\n    icon: 'circle-stacked-mixed'\n  },\n  {\n    id: '3',\n    date: Date.UTC(2021, 1, 20, 13, 20, 22),\n    title: 'Sent over request',\n    icon: 'bulb-solid',\n    status: { variant: 'success', children: 'Good' },\n    content: [\n      { id: '31', name: 'Date range', value: <Text>Jan 1, 2021 - May 3, 2021</Text> },\n      {\n        id: '32',\n        name: \"What's next\",\n        value: (\n          <Text>\n            We will fulfill your request within 3 business days. You will receive your statement\n            copy via mail at 23 Main St. Boston, MA.\n          </Text>\n        )\n      }\n    ]\n  },\n  {\n    id: '4',\n    date: Date.UTC(2021, 1, 20, 13, 19, 22),\n    title: 'Fulfill customer request for last month’s billing statement',\n    icon: 'layers',\n    status: { variant: 'pending', children: 'Wait' },\n    content: [\n      { id: '41', name: 'Date range', value: <Text>Jan 1, 2021 - May 3, 2021</Text> },\n      {\n        id: '42',\n        name: \"What's next\",\n        value: (\n          <Text>\n            We will fulfill your request within 3 business days. You will receive your statement\n            copy via mail at 23 Main St. Boston, MA.\n          </Text>\n        )\n      }\n    ]\n  },\n  {\n    id: '5',\n    date: Date.UTC(2021, 1, 20, 0, 1, 22),\n    title: (\n      <Link href='https://community.pega.com/support' target='_blank'>\n        Visit Pega support for assistance\n      </Link>\n    )\n  },\n  {\n    id: '6',\n    date: Date.UTC(2021, 1, 19, 13, 20, 22),\n    title: 'Sent over request',\n    icon: 'bulb-solid',\n    status: { variant: 'success', children: 'Good' },\n    content: [\n      { id: '61', name: 'Date range', value: <Text>Jan 1, 2021 - May 3, 2021</Text> },\n      {\n        id: '62',\n        name: \"What's next\",\n        value: (\n          <Text>\n            We will fulfill your request within 3 business days. You will receive your statement\n            copy via mail at 23 Main St. Boston, MA.\n          </Text>\n        )\n      }\n    ]\n  },\n  {\n    id: '7',\n    date: Date.UTC(2021, 1, 17, 36, 20, 22),\n    title: 'Initial claim received',\n    status: { variant: 'pending', children: 'Wait' }\n  },\n  {\n    id: '8',\n    date: Date.UTC(2020, 2, 20, 19, 28, 22),\n    title: 'Email blast: \"Best Offer\"',\n    icon: 'bell-off-solid'\n  },\n  {\n    id: '9',\n    date: Date.UTC(2022, 7, 10, 18, 6, 22),\n    title: 'Confirm eligibility',\n    icon: 'circle-stacked-mixed'\n  },\n  {\n    id: '10',\n    date: Date.UTC(2021, 6, 10, 13, 20, 22),\n    title: 'Update plat',\n    icon: 'bulb-solid',\n    status: { variant: 'success', children: 'Good' }\n  },\n  {\n    id: '11',\n    date: Date.UTC(2020, 12, 15, 13, 19, 22),\n    title: 'Balance inquiry',\n    icon: 'phone-solid',\n    status: { variant: 'pending', children: 'Wait' }\n  },\n  {\n    id: '12',\n    date: Date.UTC(2022, 6, 18, 0, 1, 22),\n    title: (\n      <Link href='https://www.pega.com' target='_blank'>\n        Visit Pega\n      </Link>\n    )\n  },\n  {\n    id: '13',\n    date: Date.UTC(2023, 2, 10, 9, 26, 22),\n    title: 'Review customer bill',\n    status: { variant: 'pending', children: 'Wait' }\n  },\n  {\n    id: '14',\n    date: Date.UTC(2020, 1, 12, 10, 25, 48),\n    title: 'Receive customer bill',\n    icon: 'layers',\n    status: { variant: 'success', children: 'Good' }\n  }\n];\n"]}

package/lib/work/Timeline/Timeline.stories.js

@@ -29,7 +29,7 @@ export const TimelineDemo = (args) => {
             }, 2000);
         }
     }, [loading]);
-    return (_jsx(Timeline, { activity: items, currentTime: new Date(), sortOrder: args.sortOrder, groupBy: args.groupBy, loading: loading, loadMore: hasMore ? loadMore : undefined }, void 0));
+    return (_jsx(Timeline, { activity: items, currentTime: new Date(), sortOrder: args.sortOrder, groupBy: args.groupBy, loading: loading, loadMore: hasMore ? loadMore : undefined }));
 };
 TimelineDemo.args = {
     sortOrder: 'descending',
@@ -59,6 +59,6 @@ export const TimelineToolbarDemo = () => {
                         onItemClick: (id) => {
                             setGroupBy(id);
                         }
-                    } }, void 0) }, void 0), _jsx(CardContent, { children: _jsx(Timeline, { activity: items, currentTime: new Date(), sortOrder: sortOrder, groupBy: groupBy }, void 0) }, void 0)] }, void 0));
+                    } }) }), _jsx(CardContent, { children: _jsx(Timeline, { activity: items, currentTime: new Date(), sortOrder: sortOrder, groupBy: groupBy }) })] }));
 };
 //# sourceMappingURL=Timeline.stories.js.map

package/lib/work/Timeline/Timeline.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.stories.js","sourceRoot":"","sources":["../../../src/work/Timeline/Timeline.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useCallback, useState } from 'react';\n\nimport { Card, CardContent, CardHeader, OmitStrict } from '@pega/cosmos-react-core';\nimport { Timeline, TimelineProps, TimelineToolbar } from '@pega/cosmos-react-work';\nimport {\n  TimelineGroupBy,\n  TimelineSortOrder\n} from '@pega/cosmos-react-work/lib/components/Timeline/Timeline.types';\n\nimport { activity } from './Timeline.mocks';\n\nexport default {\n  title: 'Work/Timeline',\n  component: Timeline\n} as Meta;\n\nexport const TimelineDemo: Story<OmitStrict<TimelineProps, 'activity' | 'currentTime'>> = (\n  args: OmitStrict<TimelineProps, 'activity' | 'currentTime'>\n) => {\n  const INITIAL_CHUNK_SIZE = 7;\n  const APPEND_CHUNK_SIZE = 3;\n\n  const [loading, setLoading] = useState(false);\n  const [hasMore, setHasMore] = useState(true);\n  const [items, setItems] = useState<TimelineProps['activity']>(() =>\n    activity.slice(0, INITIAL_CHUNK_SIZE)\n  );\n\n  const loadMore = useCallback(() => {\n    if (!loading) {\n      setLoading(true);\n      setTimeout(() => {\n        setLoading(false);\n\n        setItems(prevItems => {\n          const previousItemsLength = prevItems.length;\n          const newItems = activity.slice(\n            previousItemsLength,\n            previousItemsLength + APPEND_CHUNK_SIZE\n          );\n\n          if (newItems.length === 0) {\n            setHasMore(false);\n          }\n\n          return [...prevItems, ...newItems];\n        });\n      }, 2000);\n    }\n  }, [loading]);\n\n  return (\n    <Timeline\n      activity={items}\n      currentTime={new Date()}\n      sortOrder={args.sortOrder}\n      groupBy={args.groupBy}\n      loading={loading}\n      loadMore={hasMore ? loadMore : undefined}\n    />\n  );\n};\n\nTimelineDemo.args = {\n  sortOrder: 'descending',\n  groupBy: 'date'\n};\n\nTimelineDemo.argTypes = {\n  sortOrder: { options: ['ascending', 'descending'], control: { type: 'select' } },\n  groupBy: {\n    options: ['date', 'monthyear', 'quarteryear', 'year', 'none'],\n    control: { type: 'select' }\n  }\n};\n\nexport const TimelineToolbarDemo = () => {\n  const [sortOrder, setSortOrder] = useState<TimelineSortOrder>();\n  const [groupBy, setGroupBy] = useState<TimelineGroupBy>();\n  const [items, setItems] = useState<TimelineProps['activity']>(activity);\n\n  const onSearchSubmit = useCallback((value: string) => {\n    setItems(activity.filter(item => JSON.stringify(item.title).includes(value)));\n  }, []);\n\n  return (\n    <Card>\n      <CardHeader>\n        <TimelineToolbar\n          heading='Timeline Demo'\n          search={{ onSearchSubmit }}\n          count={{ total: items.length }}\n          sort={{\n            selected: sortOrder,\n            onItemClick: (id: TimelineProps['sortOrder']) => {\n              setSortOrder(id);\n            }\n          }}\n          group={{\n            selected: groupBy,\n            onItemClick: (id: TimelineProps['groupBy']) => {\n              setGroupBy(id);\n            }\n          }}\n        />\n      </CardHeader>\n      <CardContent>\n        <Timeline\n          activity={items}\n          currentTime={new Date()}\n          sortOrder={sortOrder}\n          groupBy={groupBy}\n        />\n      </CardContent>\n    </Card>\n  );\n};\n"]}
+{"version":3,"file":"Timeline.stories.js","sourceRoot":"","sources":["../../../src/work/Timeline/Timeline.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAc,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,QAAQ,EAAiB,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAMnF,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,QAAQ;CACZ,CAAC;AAEV,MAAM,CAAC,MAAM,YAAY,GAAiE,CACxF,IAA2D,EAC3D,EAAE;IACF,MAAM,kBAAkB,GAAG,CAAC,CAAC;IAC7B,MAAM,iBAAiB,GAAG,CAAC,CAAC;IAE5B,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAA4B,GAAG,EAAE,CACjE,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,kBAAkB,CAAC,CACtC,CAAC;IAEF,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,IAAI,CAAC,OAAO,EAAE;YACZ,UAAU,CAAC,IAAI,CAAC,CAAC;YACjB,UAAU,CAAC,GAAG,EAAE;gBACd,UAAU,CAAC,KAAK,CAAC,CAAC;gBAElB,QAAQ,CAAC,SAAS,CAAC,EAAE;oBACnB,MAAM,mBAAmB,GAAG,SAAS,CAAC,MAAM,CAAC;oBAC7C,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,CAC7B,mBAAmB,EACnB,mBAAmB,GAAG,iBAAiB,CACxC,CAAC;oBAEF,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;wBACzB,UAAU,CAAC,KAAK,CAAC,CAAC;qBACnB;oBAED,OAAO,CAAC,GAAG,SAAS,EAAE,GAAG,QAAQ,CAAC,CAAC;gBACrC,CAAC,CAAC,CAAC;YACL,CAAC,EAAE,IAAI,CAAC,CAAC;SACV;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACL,KAAC,QAAQ,IACP,QAAQ,EAAE,KAAK,EACf,WAAW,EAAE,IAAI,IAAI,EAAE,EACvB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,GACxC,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,IAAI,GAAG;IAClB,SAAS,EAAE,YAAY;IACvB,OAAO,EAAE,MAAM;CAChB,CAAC;AAEF,YAAY,CAAC,QAAQ,GAAG;IACtB,SAAS,EAAE,EAAE,OAAO,EAAE,CAAC,WAAW,EAAE,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IAChF,OAAO,EAAE;QACP,OAAO,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,CAAC;QAC7D,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,GAAG,EAAE;IACtC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAqB,CAAC;IAChE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,EAAmB,CAAC;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAA4B,QAAQ,CAAC,CAAC;IAExE,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,EAAE;QACnD,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAChF,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,MAAC,IAAI,eACH,KAAC,UAAU,cACT,KAAC,eAAe,IACd,OAAO,EAAC,eAAe,EACvB,MAAM,EAAE,EAAE,cAAc,EAAE,EAC1B,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,EAC9B,IAAI,EAAE;wBACJ,QAAQ,EAAE,SAAS;wBACnB,WAAW,EAAE,CAAC,EAA8B,EAAE,EAAE;4BAC9C,YAAY,CAAC,EAAE,CAAC,CAAC;wBACnB,CAAC;qBACF,EACD,KAAK,EAAE;wBACL,QAAQ,EAAE,OAAO;wBACjB,WAAW,EAAE,CAAC,EAA4B,EAAE,EAAE;4BAC5C,UAAU,CAAC,EAAE,CAAC,CAAC;wBACjB,CAAC;qBACF,GACD,GACS,EACb,KAAC,WAAW,cACV,KAAC,QAAQ,IACP,QAAQ,EAAE,KAAK,EACf,WAAW,EAAE,IAAI,IAAI,EAAE,EACvB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,GAChB,GACU,IACT,CACR,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useCallback, useState } from 'react';\n\nimport { Card, CardContent, CardHeader, OmitStrict } from '@pega/cosmos-react-core';\nimport { Timeline, TimelineProps, TimelineToolbar } from '@pega/cosmos-react-work';\nimport {\n  TimelineGroupBy,\n  TimelineSortOrder\n} from '@pega/cosmos-react-work/lib/components/Timeline/Timeline.types';\n\nimport { activity } from './Timeline.mocks';\n\nexport default {\n  title: 'Work/Timeline',\n  component: Timeline\n} as Meta;\n\nexport const TimelineDemo: Story<OmitStrict<TimelineProps, 'activity' | 'currentTime'>> = (\n  args: OmitStrict<TimelineProps, 'activity' | 'currentTime'>\n) => {\n  const INITIAL_CHUNK_SIZE = 7;\n  const APPEND_CHUNK_SIZE = 3;\n\n  const [loading, setLoading] = useState(false);\n  const [hasMore, setHasMore] = useState(true);\n  const [items, setItems] = useState<TimelineProps['activity']>(() =>\n    activity.slice(0, INITIAL_CHUNK_SIZE)\n  );\n\n  const loadMore = useCallback(() => {\n    if (!loading) {\n      setLoading(true);\n      setTimeout(() => {\n        setLoading(false);\n\n        setItems(prevItems => {\n          const previousItemsLength = prevItems.length;\n          const newItems = activity.slice(\n            previousItemsLength,\n            previousItemsLength + APPEND_CHUNK_SIZE\n          );\n\n          if (newItems.length === 0) {\n            setHasMore(false);\n          }\n\n          return [...prevItems, ...newItems];\n        });\n      }, 2000);\n    }\n  }, [loading]);\n\n  return (\n    <Timeline\n      activity={items}\n      currentTime={new Date()}\n      sortOrder={args.sortOrder}\n      groupBy={args.groupBy}\n      loading={loading}\n      loadMore={hasMore ? loadMore : undefined}\n    />\n  );\n};\n\nTimelineDemo.args = {\n  sortOrder: 'descending',\n  groupBy: 'date'\n};\n\nTimelineDemo.argTypes = {\n  sortOrder: { options: ['ascending', 'descending'], control: { type: 'select' } },\n  groupBy: {\n    options: ['date', 'monthyear', 'quarteryear', 'year', 'none'],\n    control: { type: 'select' }\n  }\n};\n\nexport const TimelineToolbarDemo = () => {\n  const [sortOrder, setSortOrder] = useState<TimelineSortOrder>();\n  const [groupBy, setGroupBy] = useState<TimelineGroupBy>();\n  const [items, setItems] = useState<TimelineProps['activity']>(activity);\n\n  const onSearchSubmit = useCallback((value: string) => {\n    setItems(activity.filter(item => JSON.stringify(item.title).includes(value)));\n  }, []);\n\n  return (\n    <Card>\n      <CardHeader>\n        <TimelineToolbar\n          heading='Timeline Demo'\n          search={{ onSearchSubmit }}\n          count={{ total: items.length }}\n          sort={{\n            selected: sortOrder,\n            onItemClick: (id: TimelineProps['sortOrder']) => {\n              setSortOrder(id);\n            }\n          }}\n          group={{\n            selected: groupBy,\n            onItemClick: (id: TimelineProps['groupBy']) => {\n              setGroupBy(id);\n            }\n          }}\n        />\n      </CardHeader>\n      <CardContent>\n        <Timeline\n          activity={items}\n          currentTime={new Date()}\n          sortOrder={sortOrder}\n          groupBy={groupBy}\n        />\n      </CardContent>\n    </Card>\n  );\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-demos",
-  "version": "3.0.0-dev.4.2",
+  "version": "3.0.0-dev.7.0",
   "author": "Pegasystems",
   "license": "SEE LICENSE IN LICENSE",
   "repository": {
@@ -20,14 +20,14 @@
     "build": "tsc -b"
   },
   "dependencies": {
-    "@pega/cosmos-react-build": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-condition-builder": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-core": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-cs": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-dnd": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-rte": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-social": "3.0.0-dev.4.2",
-    "@pega/cosmos-react-work": "3.0.0-dev.4.2",
+    "@pega/cosmos-react-build": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-condition-builder": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-core": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-cs": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-dnd": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-rte": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-social": "3.0.0-dev.7.0",
+    "@pega/cosmos-react-work": "3.0.0-dev.7.0",
     "emoji-mart": "^3.0.1",
     "polished": "^4.1.0",
     "react": "^16.14.0 || ^17.0.0",
@@ -43,6 +43,6 @@
     "@storybook/addons": "^6.4.19",
     "@storybook/react": "^6.4.19",
     "@storybook/theming": "^6.4.19",
-    "typescript": "~4.5.2"
+    "typescript": "~4.6.2"
   }
 }

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

@@ -1 +0,0 @@
-{"version":3,"file":"AppShell.mocks.js","sourceRoot":"","sources":["../../../src/build/AppShell/AppShell.mocks.ts"],"names":[],"mappings":"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","sourcesContent":["export interface TabbedPageStoryProps {\n  pageContent: PageContentProps;\n  showBreadcrumbs: boolean;\n}\n\nexport interface PageContentProps {\n  id: string;\n  data: {\n    pageTitle: string;\n    breadcrumbsPath: string;\n    tabs: string[];\n  };\n}\n\nexport const getPath = (args: TabbedPageStoryProps) => {\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\nexport const appExplorerMenuList = [\n  {\n    id: '50',\n    label: 'SysAdmin',\n    nodes: [\n      {\n        id: '54',\n        label: 'Class',\n        nodes: [\n          {\n            id: '55',\n            label: 'OJ4RFS-PegaTest-Work'\n          }\n        ]\n      }\n    ]\n  },\n  {\n    id: '51',\n    label: 'XCompass',\n    nodes: [\n      {\n        id: '56',\n        label: 'Data Model'\n      },\n      {\n        id: '57',\n        label: 'Process',\n        nodes: [\n          {\n            id: '60',\n            label: 'Case Type'\n          },\n          {\n            id: '61',\n            label: 'Flow'\n          },\n          {\n            id: '62',\n            label: 'Work Parties'\n          }\n        ]\n      },\n      {\n        id: '58',\n        label: 'Reports',\n        nodes: [\n          {\n            id: '63',\n            label: 'Report Definition'\n          }\n        ]\n      },\n      {\n        id: '59',\n        label: 'SysAdmin'\n      }\n    ]\n  }\n];\n\nexport const branchesMenuList = [\n  {\n    icon: 'nodes-right',\n    id: '40',\n    label: 'Theme-Cosmos'\n  },\n  {\n    icon: 'nodes-right',\n    id: '41',\n    label: 'PegaDevelopment'\n  },\n  {\n    icon: 'nodes-right',\n    id: '42',\n    label: 'PegaSSOT'\n  },\n  {\n    icon: 'nodes-right',\n    id: '43',\n    label: 'PegaRULES'\n  }\n];\n\nexport const contents = [\n  {\n    id: '1',\n    data: {\n      pageTitle: 'Application definition',\n      breadcrumbsPath: 'Home',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '100',\n    data: {\n      pageTitle: 'Decisions',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '101',\n    data: {\n      pageTitle: 'Validations',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '102',\n    data: {\n      pageTitle: 'When',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '103',\n    data: {\n      pageTitle: 'Configuration sets',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '104',\n    data: {\n      pageTitle: 'Data pages',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '105',\n    data: {\n      pageTitle: 'Data sources',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '106',\n    data: {\n      pageTitle: 'Data transforms',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '107',\n    data: {\n      pageTitle: 'Fields',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '108',\n    data: {\n      pageTitle: 'Queries',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '109',\n    data: {\n      pageTitle: 'Email account',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '110',\n    data: {\n      pageTitle: 'Integration systems',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '111',\n    data: {\n      pageTitle: 'Actions',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '112',\n    data: {\n      pageTitle: 'Automations',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '113',\n    data: {\n      pageTitle: 'Access groups',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '114',\n    data: {\n      pageTitle: 'Access roles',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '55',\n    data: {\n      pageTitle: 'OJ4RFS-PegaTest-Work',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '',\n    data: {\n      pageTitle: 'OJ4RFS-PegaTest-Work',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '56',\n    data: {\n      pageTitle: 'Data Model',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '60',\n    data: {\n      pageTitle: 'Case Type',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '61',\n    data: {\n      pageTitle: 'Flow',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '62',\n    data: {\n      pageTitle: 'Work Parties',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '63',\n    data: {\n      pageTitle: 'Report Definition',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '59',\n    data: {\n      pageTitle: 'SysAdmin',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n\n  {\n    id: '40',\n    data: {\n      pageTitle: 'Theme-Cosmos',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '41',\n    data: {\n      pageTitle: 'PegaDevelopment',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '42',\n    data: {\n      pageTitle: 'PegaSSOT',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '43',\n    data: {\n      pageTitle: 'PegaRULES',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '25',\n    data: {\n      pageTitle: 'Association',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '26',\n    data: {\n      pageTitle: 'Data Flow',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '27',\n    data: {\n      pageTitle: 'Adaptive Model',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '28',\n    data: {\n      pageTitle: 'Case Match',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '29',\n    data: {\n      pageTitle: 'Connect File',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '30',\n    data: {\n      pageTitle: 'Connect Cassandra',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  },\n  {\n    id: '31',\n    data: {\n      pageTitle: 'EForm File',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application']\n    }\n  },\n  {\n    id: '32',\n    data: {\n      pageTitle: 'Map eForm',\n      breadcrumbsPath: 'Home, U+ Desk',\n      tabs: ['Application', 'User Interface']\n    }\n  }\n];\n\nexport const recordMenuList = [\n  {\n    id: '21',\n    label: 'Data Model',\n    nodes: [\n      { id: '25', label: 'Association' },\n      { id: '26', label: 'Data Flow' }\n    ]\n  },\n  {\n    id: '22',\n    label: 'Decision',\n    nodes: [\n      { id: '27', label: 'Adaptive Model' },\n      { id: '28', label: 'Case Match' }\n    ]\n  },\n  {\n    id: '23',\n    label: 'Integration-Connectors',\n    nodes: [\n      { id: '29', label: 'Connect File' },\n      { id: '30', label: 'Connect Cassandra' }\n    ]\n  },\n  {\n    id: '24',\n    label: 'Integration-Mapping',\n    nodes: [\n      { id: '31', label: 'EForm File' },\n      { id: '32', label: 'Map eForm' }\n    ]\n  }\n];\n\nexport const treeList = [\n  {\n    id: '1',\n    label: 'Application definition'\n  },\n  {\n    id: '2',\n    label: 'App logic',\n    nodes: [\n      {\n        id: '100',\n        label: 'Decisions'\n      },\n      {\n        id: '101',\n        label: 'Validations'\n      },\n      {\n        id: '102',\n        label: 'When'\n      }\n    ]\n  },\n  {\n    id: '3',\n    label: 'Applications',\n    nodes: [\n      {\n        id: '103',\n        label: 'Configuration sets'\n      }\n    ]\n  },\n  {\n    id: '4',\n    label: 'Data',\n    nodes: [\n      {\n        id: '104',\n        label: 'Data pages'\n      },\n      {\n        id: '105',\n        label: 'Data sources'\n      },\n      {\n        id: '106',\n        label: 'Data transforms'\n      },\n      {\n        id: '107',\n        label: 'Fields'\n      },\n      {\n        id: '108',\n        label: 'Queries'\n      }\n    ]\n  },\n  {\n    id: '5',\n    label: 'Integration',\n    nodes: [\n      {\n        id: '109',\n        label: 'Email account'\n      },\n      {\n        id: '110',\n        label: 'Integration systems'\n      }\n    ]\n  },\n  {\n    id: '6',\n    label: 'Process',\n    nodes: [\n      {\n        id: '111',\n        label: 'Actions'\n      },\n      { id: '112', label: 'Automations' }\n    ]\n  },\n  {\n    id: '7',\n    label: 'Security',\n    nodes: [\n      {\n        id: '113',\n        label: 'Access groups'\n      },\n      { id: '114', label: 'Access roles' }\n    ]\n  }\n];\n"]}