@pega/cosmos-react-work 8.0.0-build.3.2 → 8.0.0-build.30.1

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.js

@@ -1,10 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { forwardRef, useRef } from 'react';
+import { useState, forwardRef, useRef, useCallback, useMemo } from 'react';
 import { CardHeader, useI18n, Icon, Text, Flex, useUID, Progress, useTestIds, withTestIds, useBreakpoint, ExpandCollapse } from '@pega/cosmos-react-core';
 import { TaskItem } from '../Tasks/TaskList';
-import { StyledAssignments, StyledExpandButton as StyledTitleExpandButton, StyledParentExpandCollapse } from './Assignments.styles';
-import AssignmentContainer from './AssignmentContainer';
+import { StyledAssignments, StyledExpandButton as StyledTitleExpandButton } from './Assignments.styles';
 import { getHierarchicalAssignmentsTestIds } from './HierarchicalAssignments.test-ids';
+import AssignmentTreeContext from './AssignmentContext';
+import AssignmentTree from './AssignmentTree';
+import { getNextNode, getPreviousNode, getParentNode, getFirstChildNode, getDeepestNode } from './helpers';
 const HierarchicalAssignments = forwardRef(({ assignments, childCases, collapsed = false, onToggleCollapsed, openItem, progress, name, testId }, ref) => {
     const t = useI18n();
     const id = useUID();
@@ -12,22 +14,102 @@ const HierarchicalAssignments = forwardRef(({ assignments, childCases, collapsed
     const containerRef = useRef(null);
     const isMediumOrAbove = useBreakpoint('sm', { breakpointRef: containerRef });
     const open = !collapsed;
+    const [focusedNodeId, setFocusedNodeId] = useState();
+    const parentRef = useRef(null);
+    const [caseIdExpandList, setCaseIdExpandList] = useState([]);
     const header = (_jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'caret-right' }), _jsx(Text, { variant: 'h2', children: name ?? t('assignments') })] }));
-    const findFirstLeaf = () => {
+    const firstNode = useMemo(() => {
         if (assignments?.length) {
             return assignments[0].id;
         }
         if (childCases?.length) {
             return childCases[0].id;
         }
-    };
+    }, [assignments, childCases]);
     const showAssignmentList = !!(assignments?.length || childCases?.length);
+    const lastNodeId = useMemo(() => {
+        const nodeList = {
+            assignments: assignments?.length ? assignments : [],
+            childCases: childCases?.length ? childCases : []
+        };
+        const nodes = [...nodeList.assignments, ...nodeList.childCases];
+        return getDeepestNode(nodeList, nodes[nodes.length - 1]?.id, caseIdExpandList)?.id;
+    }, [assignments, childCases, caseIdExpandList]);
+    const changeFocusHandler = useCallback((nodeId, key, expandList) => {
+        const nodeList = {
+            assignments: assignments?.length ? assignments : [],
+            childCases: childCases?.length ? childCases : []
+        };
+        const expandedChildCase = expandList?.length ? expandList : [];
+        switch (key) {
+            case 'down': {
+                const nextNode = getNextNode(nodeList, nodeId, expandedChildCase);
+                if (nextNode) {
+                    setFocusedNodeId(nextNode?.id);
+                }
+                break;
+            }
+            case 'up': {
+                const previousNode = getPreviousNode(nodeList, nodeId, expandedChildCase);
+                if (previousNode) {
+                    setFocusedNodeId(previousNode?.id);
+                }
+                break;
+            }
+            case 'left': {
+                const parentNode = getParentNode(nodeList, nodeId);
+                if (parentNode) {
+                    setFocusedNodeId(parentNode.id);
+                }
+                break;
+            }
+            case 'right': {
+                const childNode = getFirstChildNode(nodeList, nodeId, expandedChildCase);
+                if (childNode) {
+                    setFocusedNodeId(childNode.id);
+                }
+                break;
+            }
+            default:
+                if (nodeId !== focusedNodeId)
+                    setFocusedNodeId(nodeId);
+                break;
+        }
+    }, [assignments, childCases, focusedNodeId]);
+    const assignmentContextValue = useMemo(() => {
+        return {
+            firstNodeId: firstNode,
+            lastNodeId,
+            focusedNodeId,
+            changeFocusHandler,
+            caseIdExpandList,
+            isMediumOrAbove,
+            parentRef
+        };
+    }, [
+        firstNode,
+        changeFocusHandler,
+        focusedNodeId,
+        caseIdExpandList,
+        lastNodeId,
+        isMediumOrAbove
+    ]);
+    const childCaseToggleHandler = (value, selectedCaseId) => {
+        if (value) {
+            setCaseIdExpandList(prevState => [...prevState, selectedCaseId]);
+        }
+        else {
+            setCaseIdExpandList(prevState => {
+                return prevState.filter(caseId => caseId !== selectedCaseId);
+            });
+        }
+    };
     if (openItem?.content) {
-        return (_jsx(StyledAssignments, { "data-testid": testIds.root, ref: ref, expanded: true, children: _jsx(TaskItem, { ...openItem }) }));
+        return (_jsx(StyledAssignments, { "data-testid": testIds.root, ref: ref, expanded: true, children: _jsx(TaskItem, { ...openItem, headingTag: 'h2' }) }));
     }
-    return (_jsx(_Fragment, { children: showAssignmentList && (_jsx(StyledAssignments, { "data-testid": testIds.root, ref: ref, expanded: open, children: _jsxs(_Fragment, { children: [_jsx(CardHeader, { container: { justify: 'start', alignItems: 'center', gap: 1 }, children: _jsx(StyledTitleExpandButton, { "data-testid": testIds.toggleAction, type: 'button', variant: 'text', onClick: () => {
+    return (_jsx(_Fragment, { children: showAssignmentList && (_jsx(StyledAssignments, { "data-testid": testIds.root, ref: ref, expanded: open, children: _jsxs(_Fragment, { children: [_jsx(CardHeader, { ref: containerRef, container: { justify: 'start', alignItems: 'center', gap: 1 }, children: _jsx(StyledTitleExpandButton, { "data-testid": testIds.toggleAction, type: 'button', variant: 'text', onClick: () => {
                                 onToggleCollapsed?.(!collapsed);
-                            }, "aria-controls": id, "aria-expanded": open, "aria-label": name || t('assignments'), children: header }) }), open && (_jsx(ExpandCollapse, { as: StyledParentExpandCollapse, ref: containerRef, collapsed: collapsed, role: 'tree', id: id, children: progress ? (_jsx(Progress, { focusOnVisible: true, delay: true, placement: 'block', message: t('loading') })) : (_jsx(AssignmentContainer, { assignments: assignments, childCases: childCases, depth: 0, collapsed: true, firstItemId: findFirstLeaf(), isMediumOrAbove: isMediumOrAbove })) }))] }) })) }));
+                            }, "aria-controls": id, "aria-expanded": open, "aria-label": name || t('assignments'), children: header }) }), open && (_jsx(ExpandCollapse, { id: id, collapsed: collapsed, children: progress ? (_jsx(Progress, { focusOnVisible: true, delay: true, placement: 'block', message: t('loading') })) : (_jsx(AssignmentTreeContext.Provider, { value: assignmentContextValue, children: _jsx(AssignmentTree, { assignments: assignments, childCases: childCases, childCaseToggleHandler: childCaseToggleHandler, ref: parentRef }) })) }))] }) })) }));
 });
 export default withTestIds(HierarchicalAssignments, getHierarchicalAssignmentsTestIds);
 //# sourceMappingURL=HierarchicalAssignments.js.map

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.js.map

@@ -1 +1 @@
-{"version":3,"file":"HierarchicalAssignments.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef } from 'react';\nimport type { FC } from 'react';\n\nimport {\n  CardHeader,\n  useI18n,\n  Icon,\n  Text,\n  Flex,\n  useUID,\n  Progress,\n  useTestIds,\n  withTestIds,\n  useBreakpoint,\n  ExpandCollapse\n} from '@pega/cosmos-react-core';\n\nimport { TaskItem } from '../Tasks/TaskList';\n\nimport {\n  StyledAssignments,\n  StyledExpandButton as StyledTitleExpandButton,\n  StyledParentExpandCollapse\n} from './Assignments.styles';\nimport type { HierarchicalAssignmentProps } from './HierarchicalAssignments.types';\nimport AssignmentContainer from './AssignmentContainer';\nimport { getHierarchicalAssignmentsTestIds } from './HierarchicalAssignments.test-ids';\n\nconst HierarchicalAssignments: FC<HierarchicalAssignmentProps> = forwardRef(\n  (\n    {\n      assignments,\n      childCases,\n      collapsed = false,\n      onToggleCollapsed,\n      openItem,\n      progress,\n      name,\n      testId\n    },\n    ref: HierarchicalAssignmentProps['ref']\n  ) => {\n    const t = useI18n();\n    const id = useUID();\n    const testIds = useTestIds(testId, getHierarchicalAssignmentsTestIds);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const isMediumOrAbove = useBreakpoint('sm', { breakpointRef: containerRef });\n    const open = !collapsed;\n\n    const header = (\n      <Flex container={{ alignItems: 'center', gap: 1 }}>\n        <Icon name='caret-right' />\n        <Text variant='h2'>{name ?? t('assignments')}</Text>\n      </Flex>\n    );\n\n    const findFirstLeaf = () => {\n      if (assignments?.length) {\n        return assignments[0].id;\n      }\n      if (childCases?.length) {\n        return childCases[0].id;\n      }\n    };\n\n    const showAssignmentList = !!(assignments?.length || childCases?.length);\n\n    if (openItem?.content) {\n      return (\n        <StyledAssignments data-testid={testIds.root} ref={ref} expanded>\n          <TaskItem {...openItem} />\n        </StyledAssignments>\n      );\n    }\n\n    return (\n      <>\n        {showAssignmentList && (\n          <StyledAssignments data-testid={testIds.root} ref={ref} expanded={open}>\n            <>\n              <CardHeader container={{ justify: 'start', alignItems: 'center', gap: 1 }}>\n                <StyledTitleExpandButton\n                  data-testid={testIds.toggleAction}\n                  type='button'\n                  variant='text'\n                  onClick={() => {\n                    onToggleCollapsed?.(!collapsed);\n                  }}\n                  aria-controls={id}\n                  aria-expanded={open}\n                  aria-label={name || t('assignments')}\n                >\n                  {header}\n                </StyledTitleExpandButton>\n              </CardHeader>\n              {open && (\n                <ExpandCollapse\n                  as={StyledParentExpandCollapse}\n                  ref={containerRef}\n                  collapsed={collapsed}\n                  role='tree'\n                  id={id}\n                >\n                  {progress ? (\n                    <Progress focusOnVisible delay placement='block' message={t('loading')} />\n                  ) : (\n                    <AssignmentContainer\n                      assignments={assignments}\n                      childCases={childCases}\n                      depth={0}\n                      collapsed\n                      firstItemId={findFirstLeaf()}\n                      isMediumOrAbove={isMediumOrAbove}\n                    />\n                  )}\n                </ExpandCollapse>\n              )}\n            </>\n          </StyledAssignments>\n        )}\n      </>\n    );\n  }\n);\n\nexport default withTestIds(HierarchicalAssignments, getHierarchicalAssignmentsTestIds);\n"]}
+{"version":3,"file":"HierarchicalAssignments.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, forwardRef, useRef, useCallback, useMemo } from 'react';\nimport type { PropsWithoutRef } from 'react';\n\nimport {\n  CardHeader,\n  useI18n,\n  Icon,\n  Text,\n  Flex,\n  useUID,\n  Progress,\n  useTestIds,\n  withTestIds,\n  useBreakpoint,\n  ExpandCollapse\n} from '@pega/cosmos-react-core';\n\nimport { TaskItem } from '../Tasks/TaskList';\n\nimport {\n  StyledAssignments,\n  StyledExpandButton as StyledTitleExpandButton\n} from './Assignments.styles';\nimport type { HierarchicalAssignmentProps, CaseListProps } from './HierarchicalAssignments.types';\nimport { getHierarchicalAssignmentsTestIds } from './HierarchicalAssignments.test-ids';\nimport AssignmentTreeContext from './AssignmentContext';\nimport AssignmentTree from './AssignmentTree';\nimport {\n  getNextNode,\n  getPreviousNode,\n  getParentNode,\n  getFirstChildNode,\n  getDeepestNode\n} from './helpers';\n\nconst HierarchicalAssignments = forwardRef(\n  (\n    {\n      assignments,\n      childCases,\n      collapsed = false,\n      onToggleCollapsed,\n      openItem,\n      progress,\n      name,\n      testId\n    }: PropsWithoutRef<HierarchicalAssignmentProps>,\n    ref: HierarchicalAssignmentProps['ref']\n  ) => {\n    const t = useI18n();\n    const id = useUID();\n    const testIds = useTestIds(testId, getHierarchicalAssignmentsTestIds);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const isMediumOrAbove = useBreakpoint('sm', { breakpointRef: containerRef });\n    const open = !collapsed;\n    const [focusedNodeId, setFocusedNodeId] = useState<string>();\n    const parentRef = useRef<HTMLUListElement>(null);\n    const [caseIdExpandList, setCaseIdExpandList] = useState<CaseListProps['id'][]>([]);\n\n    const header = (\n      <Flex container={{ alignItems: 'center', gap: 1 }}>\n        <Icon name='caret-right' />\n        <Text variant='h2'>{name ?? t('assignments')}</Text>\n      </Flex>\n    );\n\n    const firstNode = useMemo(() => {\n      if (assignments?.length) {\n        return assignments[0].id;\n      }\n      if (childCases?.length) {\n        return childCases[0].id;\n      }\n    }, [assignments, childCases]);\n\n    const showAssignmentList = !!(assignments?.length || childCases?.length);\n    const lastNodeId = useMemo(() => {\n      const nodeList = {\n        assignments: assignments?.length ? assignments : [],\n        childCases: childCases?.length ? childCases : []\n      };\n      const nodes = [...nodeList.assignments, ...nodeList.childCases];\n      return getDeepestNode(nodeList, nodes[nodes.length - 1]?.id, caseIdExpandList)?.id;\n    }, [assignments, childCases, caseIdExpandList]);\n\n    const changeFocusHandler = useCallback(\n      (nodeId: string, key?: string, expandList?: string[]) => {\n        const nodeList = {\n          assignments: assignments?.length ? assignments : [],\n          childCases: childCases?.length ? childCases : []\n        };\n        const expandedChildCase = expandList?.length ? expandList : [];\n        switch (key) {\n          case 'down': {\n            const nextNode = getNextNode(nodeList, nodeId, expandedChildCase);\n            if (nextNode) {\n              setFocusedNodeId(nextNode?.id);\n            }\n            break;\n          }\n          case 'up': {\n            const previousNode = getPreviousNode(nodeList, nodeId, expandedChildCase);\n            if (previousNode) {\n              setFocusedNodeId(previousNode?.id);\n            }\n            break;\n          }\n          case 'left': {\n            const parentNode = getParentNode(nodeList, nodeId);\n            if (parentNode) {\n              setFocusedNodeId(parentNode.id);\n            }\n            break;\n          }\n          case 'right': {\n            const childNode = getFirstChildNode(nodeList, nodeId, expandedChildCase);\n            if (childNode) {\n              setFocusedNodeId(childNode.id);\n            }\n            break;\n          }\n          default:\n            if (nodeId !== focusedNodeId) setFocusedNodeId(nodeId);\n            break;\n        }\n      },\n      [assignments, childCases, focusedNodeId]\n    );\n\n    const assignmentContextValue = useMemo(() => {\n      return {\n        firstNodeId: firstNode,\n        lastNodeId,\n        focusedNodeId,\n        changeFocusHandler,\n        caseIdExpandList,\n        isMediumOrAbove,\n        parentRef\n      };\n    }, [\n      firstNode,\n      changeFocusHandler,\n      focusedNodeId,\n      caseIdExpandList,\n      lastNodeId,\n      isMediumOrAbove\n    ]);\n\n    const childCaseToggleHandler = (value: boolean, selectedCaseId: CaseListProps['id']) => {\n      if (value) {\n        setCaseIdExpandList(prevState => [...prevState, selectedCaseId]);\n      } else {\n        setCaseIdExpandList(prevState => {\n          return prevState.filter(caseId => caseId !== selectedCaseId);\n        });\n      }\n    };\n\n    if (openItem?.content) {\n      return (\n        <StyledAssignments data-testid={testIds.root} ref={ref} expanded>\n          <TaskItem {...openItem} headingTag='h2' />\n        </StyledAssignments>\n      );\n    }\n\n    return (\n      <>\n        {showAssignmentList && (\n          <StyledAssignments data-testid={testIds.root} ref={ref} expanded={open}>\n            <>\n              <CardHeader\n                ref={containerRef}\n                container={{ justify: 'start', alignItems: 'center', gap: 1 }}\n              >\n                <StyledTitleExpandButton\n                  data-testid={testIds.toggleAction}\n                  type='button'\n                  variant='text'\n                  onClick={() => {\n                    onToggleCollapsed?.(!collapsed);\n                  }}\n                  aria-controls={id}\n                  aria-expanded={open}\n                  aria-label={name || t('assignments')}\n                >\n                  {header}\n                </StyledTitleExpandButton>\n              </CardHeader>\n              {open && (\n                <ExpandCollapse id={id} collapsed={collapsed}>\n                  {progress ? (\n                    <Progress focusOnVisible delay placement='block' message={t('loading')} />\n                  ) : (\n                    <AssignmentTreeContext.Provider value={assignmentContextValue}>\n                      <AssignmentTree\n                        assignments={assignments}\n                        childCases={childCases}\n                        childCaseToggleHandler={childCaseToggleHandler}\n                        ref={parentRef}\n                      />\n                    </AssignmentTreeContext.Provider>\n                  )}\n                </ExpandCollapse>\n              )}\n            </>\n          </StyledAssignments>\n        )}\n      </>\n    );\n  }\n);\n\nexport default withTestIds(HierarchicalAssignments, getHierarchicalAssignmentsTestIds);\n"]}

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.d.ts

@@ -1,4 +1,4 @@
-export declare const getHierarchicalAssignmentsTestIds: (testIdProp?: string | null | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["toggle-action"]>;
-export declare const getAssignmentTestIds: (testIdProp?: string | null | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["label", "assignee", "urgency", "action"]>;
-export declare const getCaseTestIds: (testIdProp?: string | null | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["toggle-action", "label", "id", "status"]>;
+export declare const getHierarchicalAssignmentsTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["toggle-action"]>;
+export declare const getAssignmentTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["label", "assignee", "urgency", "action", "sla"]>;
+export declare const getCaseTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["toggle-action", "label", "id", "status"]>;
 //# sourceMappingURL=HierarchicalAssignments.test-ids.d.ts.map

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HierarchicalAssignments.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iCAAiC,yHAEnC,CAAC;AAEZ,eAAO,MAAM,oBAAoB,kJAKtB,CAAC;AAEZ,eAAO,MAAM,cAAc,kJAKhB,CAAC"}
+{"version":3,"file":"HierarchicalAssignments.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iCAAiC,sJAEnC,CAAC;AAEZ,eAAO,MAAM,oBAAoB,sLAMtB,CAAC;AAEZ,eAAO,MAAM,cAAc,+KAKhB,CAAC"}

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.js

@@ -6,7 +6,8 @@ export const getAssignmentTestIds = createTestIds('assignment', [
     'label',
     'assignee',
     'urgency',
-    'action'
+    'action',
+    'sla'
 ]);
 export const getCaseTestIds = createTestIds('case', [
     'toggle-action',

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.js.map

@@ -1 +1 @@
-{"version":3,"file":"HierarchicalAssignments.test-ids.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,CAAC,MAAM,iCAAiC,GAAG,aAAa,CAAC,0BAA0B,EAAE;IACzF,eAAe;CACP,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC9D,OAAO;IACP,UAAU;IACV,SAAS;IACT,QAAQ;CACA,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,cAAc,GAAG,aAAa,CAAC,MAAM,EAAE;IAClD,eAAe;IACf,OAAO;IACP,IAAI;IACJ,QAAQ;CACA,CAAC,CAAC","sourcesContent":["import { createTestIds } from '@pega/cosmos-react-core';\n\nexport const getHierarchicalAssignmentsTestIds = createTestIds('hierarchical-assignments', [\n  'toggle-action'\n] as const);\n\nexport const getAssignmentTestIds = createTestIds('assignment', [\n  'label',\n  'assignee',\n  'urgency',\n  'action'\n] as const);\n\nexport const getCaseTestIds = createTestIds('case', [\n  'toggle-action',\n  'label',\n  'id',\n  'status'\n] as const);\n"]}
+{"version":3,"file":"HierarchicalAssignments.test-ids.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,CAAC,MAAM,iCAAiC,GAAG,aAAa,CAAC,0BAA0B,EAAE;IACzF,eAAe;CACP,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,YAAY,EAAE;IAC9D,OAAO;IACP,UAAU;IACV,SAAS;IACT,QAAQ;IACR,KAAK;CACG,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,cAAc,GAAG,aAAa,CAAC,MAAM,EAAE;IAClD,eAAe;IACf,OAAO;IACP,IAAI;IACJ,QAAQ;CACA,CAAC,CAAC","sourcesContent":["import { createTestIds } from '@pega/cosmos-react-core';\n\nexport const getHierarchicalAssignmentsTestIds = createTestIds('hierarchical-assignments', [\n  'toggle-action'\n] as const);\n\nexport const getAssignmentTestIds = createTestIds('assignment', [\n  'label',\n  'assignee',\n  'urgency',\n  'action',\n  'sla'\n] as const);\n\nexport const getCaseTestIds = createTestIds('case', [\n  'toggle-action',\n  'label',\n  'id',\n  'status'\n] as const);\n"]}

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.types.d.ts

@@ -1,13 +1,15 @@
 import type { MouseEvent, Ref } from 'react';
 import type { LinkProps, NoChildrenProp, OmitStrict, StatusProps, TestIdProp } from '@pega/cosmos-react-core';
-import type { GlimpseProps, TaskItemProps } from '@pega/cosmos-react-work';
-export interface AssignmentProps extends TestIdProp {
+import type { TaskItemProps } from '@pega/cosmos-react-work';
+export interface AssignmentProps {
     /** Unique Id of the assignment */
     id: string;
     /** Assignment name shown in Assignment's description */
     name: string;
     /** Process Name for the assignment. */
     processName?: string;
+    /** Service Level Agreement for the assignment. */
+    sla?: string;
     /** Number to defined the Urgency of assignment */
     urgency: number;
     /** Assignee's Id, passed on callback of onAssigneeClick */
@@ -24,15 +26,10 @@ export interface ItemsProps extends NoChildrenProp {
     assignments?: AssignmentProps[];
     /** An array of child cases to be rendered as case details */
     childCases?: CaseListProps[];
-    /**
-     * Boolean that refers the state of the ExpandButton.
-     * @default false
-     */
-    collapsed?: boolean;
-    /** Callback on toggle of ExpandCollapseButton of each Case */
-    onToggleCollapsed?: (collapsed: boolean, id: string) => void;
+    /** Callback on toggle of ExpandCollapseButton of each Case, with arguments current expanded state of toggler and case id */
+    onToggleCollapsed?: (value: boolean, id: string) => void;
 }
-export interface CaseListProps extends NoChildrenProp, ItemsProps, TestIdProp {
+export interface CaseListProps extends NoChildrenProp, ItemsProps {
     /** Name of the task group displayed in the list. */
     name: string;
     /** Unique Id of the childcase */
@@ -59,8 +56,11 @@ export interface HierarchicalAssignmentProps extends OmitStrict<ItemsProps, 'onT
     progress?: boolean;
     /** Task Content to be rendered on click of Go Action button */
     openItem?: TaskItemProps;
-    /** Meta details to Render the Glimpse component to show the Assignee details */
-    assigneeProfile?: GlimpseProps;
+    /**
+     * Boolean that refers the state of the ExpandButton.
+     * @default false
+     */
+    collapsed?: boolean;
     /** Callback on toggle of Top level ExpandCollapseButton */
     onToggleCollapsed: (collapsed: boolean) => void;
     /** Ref placed on the element. */

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HierarchicalAssignments.types.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACd,UAAU,EACV,WAAW,EACX,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE3E,MAAM,WAAW,eAAgB,SAAQ,UAAU;IACjD,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kDAAkD;IAClD,OAAO,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,UAAU,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,YAAY,EAAE,MAAM,CAAC;IACrB,2EAA2E;IAC3E,eAAe,EAAE,CACf,UAAU,EAAE,eAAe,CAAC,YAAY,CAAC,EACzC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAC7B,IAAI,CAAC;IACV,wCAAwC;IACxC,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAChF;AAED,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,0EAA0E;IAC1E,WAAW,CAAC,EAAE,eAAe,EAAE,CAAC;IAChC,6DAA6D;IAC7D,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,8DAA8D;IAC9D,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9D;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,UAAU,EAAE,UAAU;IAC3E,oDAAoD;IACpD,IAAI,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,kCAAkC;IAClC,MAAM,EAAE;QACN,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;KACjC,CAAC;IACF,mDAAmD;IACnD,IAAI,EAAE;QACJ,SAAS,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;QAClC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;QACxB,MAAM,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;KAC9B,CAAC;CACH;AAED,MAAM,WAAW,2BACf,SAAQ,UAAU,CAAC,UAAU,EAAE,mBAAmB,CAAC,EACjD,UAAU;IACZ;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,gFAAgF;IAChF,eAAe,CAAC,EAAE,YAAY,CAAC;IAC/B,2DAA2D;IAC3D,iBAAiB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,iCAAiC;IACjC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
+{"version":3,"file":"HierarchicalAssignments.types.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACd,UAAU,EACV,WAAW,EACX,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,WAAW,eAAe;IAC9B,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kDAAkD;IAClD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,OAAO,EAAE,MAAM,CAAC;IAChB,2DAA2D;IAC3D,UAAU,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,YAAY,EAAE,MAAM,CAAC;IACrB,2EAA2E;IAC3E,eAAe,EAAE,CACf,UAAU,EAAE,eAAe,CAAC,YAAY,CAAC,EACzC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAC7B,IAAI,CAAC;IACV,wCAAwC;IACxC,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAChF;AAED,MAAM,WAAW,UAAW,SAAQ,cAAc;IAChD,0EAA0E;IAC1E,WAAW,CAAC,EAAE,eAAe,EAAE,CAAC;IAChC,6DAA6D;IAC7D,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAC7B,4HAA4H;IAC5H,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1D;AACD,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,UAAU;IAC/D,oDAAoD;IACpD,IAAI,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,kCAAkC;IAClC,MAAM,EAAE;QACN,IAAI,EAAE,MAAM,CAAC;QACb,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;KACjC,CAAC;IACF,mDAAmD;IACnD,IAAI,EAAE;QACJ,SAAS,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;QAClC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;QACxB,MAAM,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;KAC9B,CAAC;CACH;AAED,MAAM,WAAW,2BACf,SAAQ,UAAU,CAAC,UAAU,EAAE,mBAAmB,CAAC,EACjD,UAAU;IACZ;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,2DAA2D;IAC3D,iBAAiB,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,iCAAiC;IACjC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}

package/lib/components/HierarchicalAssignments/HierarchicalAssignments.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"HierarchicalAssignments.types.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MouseEvent, Ref } from 'react';\n\nimport type {\n  LinkProps,\n  NoChildrenProp,\n  OmitStrict,\n  StatusProps,\n  TestIdProp\n} from '@pega/cosmos-react-core';\nimport type { GlimpseProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nexport interface AssignmentProps extends TestIdProp {\n  /** Unique Id of the assignment */\n  id: string;\n  /** Assignment name shown in Assignment's description */\n  name: string;\n  /** Process Name for the assignment. */\n  processName?: string;\n  /** Number to defined the Urgency of assignment */\n  urgency: number;\n  /** Assignee's Id, passed on callback of onAssigneeClick */\n  assigneeId: string;\n  /** Assignee's Name of the assignment */\n  assigneeName: string;\n  /** Callback fired when click of Assignee Name to show Glimpse component */\n  onAssigneeClick: (\n    assigneeId: AssignmentProps['assigneeId'],\n    e: MouseEvent<HTMLButtonElement>\n  ) => void;\n  /** Callback fired from the Go button */\n  onOpen?: (id: AssignmentProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport interface ItemsProps extends NoChildrenProp {\n  /** An array of assignment details to be rendered as Assignment details */\n  assignments?: AssignmentProps[];\n  /** An array of child cases to be rendered as case details */\n  childCases?: CaseListProps[];\n  /**\n   * Boolean that refers the state of the ExpandButton.\n   * @default false\n   */\n  collapsed?: boolean;\n  /** Callback on toggle of ExpandCollapseButton of each Case */\n  onToggleCollapsed?: (collapsed: boolean, id: string) => void;\n}\n\nexport interface CaseListProps extends NoChildrenProp, ItemsProps, TestIdProp {\n  /** Name of the task group displayed in the list. */\n  name: string;\n  /** Unique Id of the childcase */\n  id: string;\n  /** status details for the case */\n  status: {\n    text: string;\n    variant: StatusProps['variant'];\n  };\n  /** Meta details of link to navigate to the case */\n  link: {\n    onPreview: LinkProps['onPreview'];\n    href: LinkProps['href'];\n    target?: LinkProps['target'];\n  };\n}\n\nexport interface HierarchicalAssignmentProps\n  extends OmitStrict<ItemsProps, 'onToggleCollapsed'>,\n    TestIdProp {\n  /**\n   * Hierarchical Assignment widget's title\n   * @default  'Assignment'\n   */\n  name?: string;\n  /** Boolean refers to state of the progress in assignment widget */\n  progress?: boolean;\n  /** Task Content to be rendered on click of Go Action button */\n  openItem?: TaskItemProps;\n  /** Meta details to Render the Glimpse component to show the Assignee details */\n  assigneeProfile?: GlimpseProps;\n  /** Callback on toggle of Top level ExpandCollapseButton */\n  onToggleCollapsed: (collapsed: boolean) => void;\n  /** Ref placed on the element. */\n  ref?: Ref<HTMLDivElement>;\n}\n"]}
+{"version":3,"file":"HierarchicalAssignments.types.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/HierarchicalAssignments.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MouseEvent, Ref } from 'react';\n\nimport type {\n  LinkProps,\n  NoChildrenProp,\n  OmitStrict,\n  StatusProps,\n  TestIdProp\n} from '@pega/cosmos-react-core';\nimport type { TaskItemProps } from '@pega/cosmos-react-work';\n\nexport interface AssignmentProps {\n  /** Unique Id of the assignment */\n  id: string;\n  /** Assignment name shown in Assignment's description */\n  name: string;\n  /** Process Name for the assignment. */\n  processName?: string;\n  /** Service Level Agreement for the assignment. */\n  sla?: string;\n  /** Number to defined the Urgency of assignment */\n  urgency: number;\n  /** Assignee's Id, passed on callback of onAssigneeClick */\n  assigneeId: string;\n  /** Assignee's Name of the assignment */\n  assigneeName: string;\n  /** Callback fired when click of Assignee Name to show Glimpse component */\n  onAssigneeClick: (\n    assigneeId: AssignmentProps['assigneeId'],\n    e: MouseEvent<HTMLButtonElement>\n  ) => void;\n  /** Callback fired from the Go button */\n  onOpen?: (id: AssignmentProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport interface ItemsProps extends NoChildrenProp {\n  /** An array of assignment details to be rendered as Assignment details */\n  assignments?: AssignmentProps[];\n  /** An array of child cases to be rendered as case details */\n  childCases?: CaseListProps[];\n  /** Callback on toggle of ExpandCollapseButton of each Case, with arguments current expanded state of toggler and case id */\n  onToggleCollapsed?: (value: boolean, id: string) => void;\n}\nexport interface CaseListProps extends NoChildrenProp, ItemsProps {\n  /** Name of the task group displayed in the list. */\n  name: string;\n  /** Unique Id of the childcase */\n  id: string;\n  /** status details for the case */\n  status: {\n    text: string;\n    variant: StatusProps['variant'];\n  };\n  /** Meta details of link to navigate to the case */\n  link: {\n    onPreview: LinkProps['onPreview'];\n    href: LinkProps['href'];\n    target?: LinkProps['target'];\n  };\n}\n\nexport interface HierarchicalAssignmentProps\n  extends OmitStrict<ItemsProps, 'onToggleCollapsed'>,\n    TestIdProp {\n  /**\n   * Hierarchical Assignment widget's title\n   * @default  'Assignment'\n   */\n  name?: string;\n  /** Boolean refers to state of the progress in assignment widget */\n  progress?: boolean;\n  /** Task Content to be rendered on click of Go Action button */\n  openItem?: TaskItemProps;\n  /**\n   * Boolean that refers the state of the ExpandButton.\n   * @default false\n   */\n  collapsed?: boolean;\n  /** Callback on toggle of Top level ExpandCollapseButton */\n  onToggleCollapsed: (collapsed: boolean) => void;\n  /** Ref placed on the element. */\n  ref?: Ref<HTMLDivElement>;\n}\n"]}

package/lib/components/HierarchicalAssignments/helpers.d.ts

@@ -0,0 +1,20 @@
+import type { RefObject } from 'react';
+import type { AssignmentProps, CaseListProps } from './HierarchicalAssignments.types';
+export interface AssignmentNodes {
+    assignments?: AssignmentProps[];
+    childCases?: CaseListProps[];
+}
+type Node = AssignmentProps | CaseListProps | undefined;
+export declare const isAssignment: (assignment: AssignmentProps | CaseListProps) => assignment is AssignmentProps;
+export declare const isExpandedNode: (expandedList: string[], id: string) => boolean;
+export declare const getNode: (nodes: AssignmentNodes, id: string) => Node;
+export declare const getParentNode: (nodes: AssignmentNodes, id: string, parentItem?: CaseListProps) => Node;
+export declare const getFirstChildNode: (nodes: AssignmentNodes, id: string, expanded: string[]) => Node;
+export declare const getCombinedAdjacentIndex: (combinedNodes: (AssignmentProps | CaseListProps)[], id: string) => number;
+export declare const getAdjacentNode: (nodes: AssignmentNodes, id: string) => AssignmentProps | CaseListProps;
+export declare const getNextNode: ({ assignments, childCases }: AssignmentNodes, id: string, expanded: string[]) => AssignmentProps | CaseListProps;
+export declare const getDeepestNode: ({ assignments, childCases }: AssignmentNodes, id: string, expanded: string[]) => Node;
+export declare const getPreviousNode: ({ assignments, childCases }: AssignmentNodes, id: string, expanded: string[]) => Node;
+export declare const scrollChildIntoView: (parentRef?: RefObject<HTMLUListElement>, childRef?: RefObject<HTMLLIElement>) => void;
+export {};
+//# sourceMappingURL=helpers.d.ts.map

package/lib/components/HierarchicalAssignments/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAEtF,MAAM,WAAW,eAAe;IAC9B,WAAW,CAAC,EAAE,eAAe,EAAE,CAAC;IAChC,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;CAC9B;AAED,KAAK,IAAI,GAAG,eAAe,GAAG,aAAa,GAAG,SAAS,CAAC;AAExD,eAAO,MAAM,YAAY,eACX,eAAe,GAAG,aAAa,KAC1C,UAAU,IAAI,eAMhB,CAAC;AAEF,eAAO,MAAM,cAAc,iBAAkB,MAAM,EAAE,MAAM,MAAM,YAEhE,CAAC;AAEF,eAAO,MAAM,OAAO,UAAW,eAAe,MAAM,MAAM,SAyBzD,CAAC;AAEF,eAAO,MAAM,aAAa,UAAW,eAAe,MAAM,MAAM,eAAe,aAAa,SA2B3F,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,eAAe,MAAM,MAAM,YAAY,MAAM,EAAE,SAevF,CAAC;AAEF,eAAO,MAAM,wBAAwB,kBACpB,CAAC,eAAe,GAAG,aAAa,CAAC,EAAE,MAC9C,MAAM,WAGX,CAAC;AAEF,eAAO,MAAM,eAAe,UACnB,eAAe,MAClB,MAAM,KACT,eAAe,GAAG,aAuBpB,CAAC;AAEF,eAAO,MAAM,WAAW,gCACiB,eAAe,MAClD,MAAM,YACA,MAAM,EAAE,oCAUnB,CAAC;AAEF,eAAO,MAAM,cAAc,gCACc,eAAe,MAClD,MAAM,YACA,MAAM,EAAE,KACjB,IAuBF,CAAC;AAEF,eAAO,MAAM,eAAe,gCACa,eAAe,MAClD,MAAM,YACA,MAAM,EAAE,SAiCnB,CAAC;AAEF,eAAO,MAAM,mBAAmB,eAClB,SAAS,CAAC,gBAAgB,CAAC,aAC5B,SAAS,CAAC,aAAa,CAAC,SAkBpC,CAAC"}

package/lib/components/HierarchicalAssignments/helpers.js

@@ -0,0 +1,164 @@
+import { hasProp } from '@pega/cosmos-react-core';
+export const isAssignment = (assignment) => {
+    return (hasProp(assignment, 'name') &&
+        hasProp(assignment, 'assigneeName') &&
+        hasProp(assignment, 'urgency'));
+};
+export const isExpandedNode = (expandedList, id) => {
+    return !!expandedList.find(expandedId => expandedId === id);
+};
+export const getNode = (nodes, id) => {
+    let found;
+    const assignment = nodes.assignments?.find(node => node.id === id);
+    if (assignment) {
+        found = assignment;
+    }
+    if (!found) {
+        nodes.childCases?.some(node => {
+            if (node.id === id) {
+                found = node;
+                return true;
+            }
+            if (node.assignments?.length || node.childCases?.length) {
+                found = getNode(node, id);
+                return !!found;
+            }
+            return false;
+        });
+    }
+    return found;
+};
+export const getParentNode = (nodes, id, parentItem) => {
+    let found;
+    const assignment = nodes.assignments?.find(node => node.id === id);
+    if (assignment) {
+        found = parentItem;
+    }
+    if (!found) {
+        nodes.childCases?.some(node => {
+            if (node.id === id) {
+                found = parentItem;
+                return true;
+            }
+            if (node.assignments?.length || node.childCases?.length) {
+                found = getParentNode({ assignments: node.assignments, childCases: node.childCases }, id, node);
+                return !!found;
+            }
+            return false;
+        });
+    }
+    return found;
+};
+export const getFirstChildNode = (nodes, id, expanded) => {
+    let firstChildNode;
+    const node = getNode(nodes, id);
+    if (node && !isAssignment(node)) {
+        const isNodeExpanded = isExpandedNode(expanded, node.id);
+        if (isNodeExpanded && node.assignments?.length) {
+            const childNodes = node.assignments;
+            firstChildNode = childNodes[0];
+        }
+        else if (isNodeExpanded && node.childCases?.length) {
+            const childNodes = node.childCases;
+            firstChildNode = childNodes[0];
+        }
+    }
+    return firstChildNode;
+};
+export const getCombinedAdjacentIndex = (combinedNodes, id) => {
+    return combinedNodes?.map(nodeEl => nodeEl.id).indexOf(id);
+};
+export const getAdjacentNode = (nodes, id) => {
+    let nextNode;
+    const parent = getParentNode(nodes, id);
+    if (parent &&
+        !isAssignment(parent) &&
+        (parent?.assignments?.length || parent?.childCases?.length)) {
+        const childNodes = [...(parent?.assignments ?? []), ...(parent?.childCases ?? [])];
+        const currentIndex = childNodes.map(nodeEl => nodeEl.id).indexOf(id);
+        if (currentIndex === childNodes.length - 1) {
+            nextNode = getAdjacentNode(nodes, parent?.id);
+        }
+        else {
+            nextNode = childNodes[currentIndex + 1];
+        }
+    }
+    else {
+        const combinedNodes = [...(nodes.assignments ?? []), ...(nodes.childCases ?? [])];
+        const elementsIndex = getCombinedAdjacentIndex(combinedNodes, id);
+        nextNode = combinedNodes?.[elementsIndex + 1];
+    }
+    return nextNode;
+};
+export const getNextNode = ({ assignments = [], childCases = [] }, id, expanded) => {
+    let nextNode;
+    const firstChildNode = getFirstChildNode({ assignments, childCases }, id, expanded);
+    if (firstChildNode) {
+        nextNode = firstChildNode;
+    }
+    else {
+        nextNode = getAdjacentNode({ assignments, childCases }, id);
+    }
+    return nextNode;
+};
+export const getDeepestNode = ({ assignments = [], childCases = [] }, id, expanded) => {
+    const node = getNode({ assignments, childCases }, id);
+    let lastNode = node;
+    let isNodeExpanded = false;
+    if (node) {
+        isNodeExpanded = isExpandedNode(expanded, node.id);
+    }
+    if (node &&
+        !isAssignment(node) &&
+        isNodeExpanded &&
+        (node.assignments?.length || node.childCases?.length)) {
+        const childNodes = [...(node.assignments ?? []), ...(node.childCases ?? [])];
+        const lastChildNode = childNodes[childNodes.length - 1];
+        const isLastChildNodeExpanded = isExpandedNode(expanded, lastChildNode.id);
+        if (isLastChildNodeExpanded) {
+            lastNode = getDeepestNode({ assignments, childCases }, lastChildNode.id, expanded);
+        }
+        else {
+            lastNode = lastChildNode;
+        }
+    }
+    return lastNode;
+};
+export const getPreviousNode = ({ assignments = [], childCases = [] }, id, expanded) => {
+    const parent = getParentNode({ assignments, childCases }, id);
+    let previousNode;
+    if (parent &&
+        !isAssignment(parent) &&
+        (parent?.assignments?.length || parent?.childCases?.length)) {
+        const childNodes = [...(parent?.assignments ?? []), ...(parent?.childCases ?? [])];
+        const currentIndex = childNodes.map(nodeEl => nodeEl.id).indexOf(id);
+        if (currentIndex === 0) {
+            previousNode = parent;
+        }
+        else {
+            previousNode = getDeepestNode({ assignments, childCases }, childNodes[currentIndex - 1].id, expanded);
+        }
+    }
+    else {
+        const currentNode = [...assignments, ...childCases];
+        const index = currentNode.map(node => node.id).indexOf(id);
+        if (currentNode[index - 1]) {
+            previousNode = getDeepestNode({ assignments, childCases }, currentNode[index - 1].id, expanded);
+        }
+    }
+    return previousNode;
+};
+export const scrollChildIntoView = (parentRef, childRef) => {
+    const parent = parentRef?.current;
+    const child = childRef?.current;
+    if (!parent || !child) {
+        return;
+    }
+    const parentRect = parent.getBoundingClientRect();
+    const childRect = child.getBoundingClientRect();
+    const isViewable = childRect.top >= parentRect.top && childRect.top <= parentRect.top + parent.clientHeight;
+    if (!isViewable) {
+        parent.scrollTop = childRect.top + parent.scrollTop - parentRect.top;
+    }
+};
+//# sourceMappingURL=helpers.js.map

package/lib/components/HierarchicalAssignments/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/helpers.ts"],"names":[],"mappings":"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","sourcesContent":["import type { RefObject } from 'react';\n\nimport { hasProp } from '@pega/cosmos-react-core';\n\nimport type { AssignmentProps, CaseListProps } from './HierarchicalAssignments.types';\n\nexport interface AssignmentNodes {\n  assignments?: AssignmentProps[];\n  childCases?: CaseListProps[];\n}\n\ntype Node = AssignmentProps | CaseListProps | undefined;\n\nexport const isAssignment = (\n  assignment: AssignmentProps | CaseListProps\n): assignment is AssignmentProps => {\n  return (\n    hasProp(assignment, 'name') &&\n    hasProp(assignment, 'assigneeName') &&\n    hasProp(assignment, 'urgency')\n  );\n};\n\nexport const isExpandedNode = (expandedList: string[], id: string) => {\n  return !!expandedList.find(expandedId => expandedId === id);\n};\n\nexport const getNode = (nodes: AssignmentNodes, id: string) => {\n  let found: Node;\n\n  const assignment = nodes.assignments?.find(node => node.id === id);\n  if (assignment) {\n    found = assignment;\n  }\n\n  if (!found) {\n    nodes.childCases?.some(node => {\n      if (node.id === id) {\n        found = node;\n        return true;\n      }\n\n      if (node.assignments?.length || node.childCases?.length) {\n        found = getNode(node, id);\n        return !!found;\n      }\n\n      return false;\n    });\n  }\n\n  return found;\n};\n\nexport const getParentNode = (nodes: AssignmentNodes, id: string, parentItem?: CaseListProps) => {\n  let found: Node;\n\n  const assignment = nodes.assignments?.find(node => node.id === id);\n  if (assignment) {\n    found = parentItem;\n  }\n\n  if (!found) {\n    nodes.childCases?.some(node => {\n      if (node.id === id) {\n        found = parentItem;\n        return true;\n      }\n      if (node.assignments?.length || node.childCases?.length) {\n        found = getParentNode(\n          { assignments: node.assignments, childCases: node.childCases },\n          id,\n          node\n        );\n        return !!found;\n      }\n      return false;\n    });\n  }\n\n  return found;\n};\n\nexport const getFirstChildNode = (nodes: AssignmentNodes, id: string, expanded: string[]) => {\n  let firstChildNode: Node;\n  const node = getNode(nodes, id);\n\n  if (node && !isAssignment(node)) {\n    const isNodeExpanded = isExpandedNode(expanded, node.id);\n    if (isNodeExpanded && node.assignments?.length) {\n      const childNodes = node.assignments;\n      firstChildNode = childNodes[0];\n    } else if (isNodeExpanded && node.childCases?.length) {\n      const childNodes = node.childCases;\n      firstChildNode = childNodes[0];\n    }\n  }\n  return firstChildNode;\n};\n\nexport const getCombinedAdjacentIndex = (\n  combinedNodes: (AssignmentProps | CaseListProps)[],\n  id: string\n) => {\n  return combinedNodes?.map(nodeEl => nodeEl.id).indexOf(id);\n};\n\nexport const getAdjacentNode = (\n  nodes: AssignmentNodes,\n  id: string\n): AssignmentProps | CaseListProps => {\n  let nextNode: AssignmentProps | CaseListProps;\n  const parent = getParentNode(nodes, id);\n\n  if (\n    parent &&\n    !isAssignment(parent) &&\n    (parent?.assignments?.length || parent?.childCases?.length)\n  ) {\n    const childNodes = [...(parent?.assignments ?? []), ...(parent?.childCases ?? [])];\n    const currentIndex = childNodes.map(nodeEl => nodeEl.id).indexOf(id);\n    if (currentIndex === childNodes.length - 1) {\n      nextNode = getAdjacentNode(nodes, parent?.id);\n    } else {\n      nextNode = childNodes[currentIndex + 1];\n    }\n  } else {\n    const combinedNodes = [...(nodes.assignments ?? []), ...(nodes.childCases ?? [])];\n    const elementsIndex = getCombinedAdjacentIndex(combinedNodes, id);\n    nextNode = combinedNodes?.[elementsIndex + 1];\n  }\n\n  return nextNode;\n};\n\nexport const getNextNode = (\n  { assignments = [], childCases = [] }: AssignmentNodes,\n  id: string,\n  expanded: string[]\n) => {\n  let nextNode: Node;\n  const firstChildNode = getFirstChildNode({ assignments, childCases }, id, expanded);\n  if (firstChildNode) {\n    nextNode = firstChildNode;\n  } else {\n    nextNode = getAdjacentNode({ assignments, childCases }, id);\n  }\n  return nextNode;\n};\n\nexport const getDeepestNode = (\n  { assignments = [], childCases = [] }: AssignmentNodes,\n  id: string,\n  expanded: string[]\n): Node => {\n  const node = getNode({ assignments, childCases }, id);\n  let lastNode = node;\n  let isNodeExpanded = false;\n  if (node) {\n    isNodeExpanded = isExpandedNode(expanded, node.id);\n  }\n  if (\n    node &&\n    !isAssignment(node) &&\n    isNodeExpanded &&\n    (node.assignments?.length || node.childCases?.length)\n  ) {\n    const childNodes = [...(node.assignments ?? []), ...(node.childCases ?? [])];\n    const lastChildNode = childNodes[childNodes.length - 1];\n    const isLastChildNodeExpanded = isExpandedNode(expanded, lastChildNode.id);\n    if (isLastChildNodeExpanded) {\n      lastNode = getDeepestNode({ assignments, childCases }, lastChildNode.id, expanded);\n    } else {\n      lastNode = lastChildNode;\n    }\n  }\n  return lastNode;\n};\n\nexport const getPreviousNode = (\n  { assignments = [], childCases = [] }: AssignmentNodes,\n  id: string,\n  expanded: string[]\n) => {\n  const parent = getParentNode({ assignments, childCases }, id);\n  let previousNode;\n\n  if (\n    parent &&\n    !isAssignment(parent) &&\n    (parent?.assignments?.length || parent?.childCases?.length)\n  ) {\n    const childNodes = [...(parent?.assignments ?? []), ...(parent?.childCases ?? [])];\n    const currentIndex = childNodes.map(nodeEl => nodeEl.id).indexOf(id);\n    if (currentIndex === 0) {\n      previousNode = parent;\n    } else {\n      previousNode = getDeepestNode(\n        { assignments, childCases },\n        childNodes[currentIndex - 1].id,\n        expanded\n      );\n    }\n  } else {\n    const currentNode = [...assignments, ...childCases];\n    const index = currentNode.map(node => node.id).indexOf(id);\n    if (currentNode[index - 1]) {\n      previousNode = getDeepestNode(\n        { assignments, childCases },\n        currentNode[index - 1].id,\n        expanded\n      );\n    }\n  }\n  return previousNode;\n};\n\nexport const scrollChildIntoView = (\n  parentRef?: RefObject<HTMLUListElement>,\n  childRef?: RefObject<HTMLLIElement>\n) => {\n  const parent = parentRef?.current;\n  const child = childRef?.current;\n\n  if (!parent || !child) {\n    return;\n  }\n\n  const parentRect = parent.getBoundingClientRect();\n  const childRect = child.getBoundingClientRect();\n\n  const isViewable =\n    childRect.top >= parentRect.top && childRect.top <= parentRect.top + parent.clientHeight;\n\n  if (!isViewable) {\n    parent.scrollTop = childRect.top + parent.scrollTop - parentRect.top;\n  }\n};\n"]}

package/lib/components/HierarchicalAssignments/nodeItems/AssignmentItem.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+import type { AssignmentProps } from '../HierarchicalAssignments.types';
+interface AssignmentItemProps extends AssignmentProps {
+    /** Property defines the node's level */
+    depth: number;
+}
+export declare const PauseTextNode: ({ children }: {
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+declare const _default: (({ name, processName, assigneeName, urgency, sla, depth, id, assigneeId, onOpen, onAssigneeClick }: AssignmentItemProps) => import("react/jsx-runtime").JSX.Element) & {
+    getTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["label", "assignee", "urgency", "action", "sla"]>;
+};
+export default _default;
+//# sourceMappingURL=AssignmentItem.d.ts.map

package/lib/components/HierarchicalAssignments/nodeItems/AssignmentItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentItem.d.ts","sourceRoot":"","sources":["../../../../src/components/HierarchicalAssignments/nodeItems/AssignmentItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AA4BlE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AAOxE,UAAU,mBAAoB,SAAQ,eAAe;IACnD,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;CACf;AAMD,eAAO,MAAM,aAAa,iBAAkB;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,4CAOlE,CAAC;6HAaC,mBAAmB;;;AAiLtB,wBAAiE"}

package/lib/components/HierarchicalAssignments/nodeItems/AssignmentItem.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useContext, useCallback } from 'react';
+import styled from 'styled-components';
+import { Grid, Flex, Button, useI18n, withTestIds, useTestIds, cap, useDirection, Text, VisuallyHiddenText, useElement, Tooltip } from '@pega/cosmos-react-core';
+import { StyledAssignmentItem, StyledProcessContainer, StyledActionContainer, StyledAssigneeContainer, StyledLabelContainer, StyledNode, StyledAssigneeText, StyledAssignmentItemMetaList } from '../Assignments.styles';
+import { getAssignmentTestIds } from '../HierarchicalAssignments.test-ids';
+import AssignmentTreeContext from '../AssignmentContext';
+import AssignmentDetails from '../AssignmentDetail';
+import useNodeFocus from './useNodeFocus';
+const StyledHiddenText = styled(VisuallyHiddenText) `
+  width: 0;
+`;
+export const PauseTextNode = ({ children }) => {
+    return (_jsxs(_Fragment, { children: [children, _jsx(StyledHiddenText, { children: ", " })] }));
+};
+const AssignmentItem = ({ name, processName, assigneeName, urgency, sla, depth, id, assigneeId, onOpen, onAssigneeClick }) => {
+    const { firstNodeId, focusedNodeId, lastNodeId, changeFocusHandler, caseIdExpandList, isMediumOrAbove, parentRef } = useContext(AssignmentTreeContext);
+    const assignmentRef = useRef(null);
+    const { parentNodeTabIndex, childElementsTabIndex, isNodeInternalFocus, lastNode, setIsNodeInternalFocus, escapeNodeHandler } = useNodeFocus(id, assignmentRef, parentRef, {
+        firstNodeId,
+        focusedNodeId,
+        lastNodeId
+    });
+    const { start } = useDirection();
+    const t = useI18n();
+    const [assigneeEl, setAssigneeElement] = useElement();
+    const testIds = useTestIds('', getAssignmentTestIds);
+    const navigationHandler = useCallback((e) => {
+        if (['ArrowUp', 'ArrowDown'].includes(e.key))
+            e.preventDefault();
+        switch (e.key) {
+            case 'ArrowUp':
+                changeFocusHandler(id, 'up', caseIdExpandList);
+                break;
+            case 'ArrowDown':
+                changeFocusHandler(id, 'down', caseIdExpandList);
+                break;
+            case `Arrow${cap(start)}`:
+                if (depth > 0) {
+                    changeFocusHandler(id, 'left', caseIdExpandList);
+                }
+                break;
+            case 'Home':
+                if (firstNodeId)
+                    changeFocusHandler(firstNodeId);
+                break;
+            case 'End':
+                if (lastNodeId)
+                    changeFocusHandler(lastNodeId);
+                break;
+            default:
+        }
+    }, [id, firstNodeId, lastNodeId, depth, caseIdExpandList]);
+    return (_jsx(StyledNode, { "data-testid": testIds.root, role: 'treeitem', "aria-selected": isNodeInternalFocus ? false : parentNodeTabIndex === 0, "aria-labelledby": id, ref: assignmentRef, onKeyDown: (e) => {
+            e.stopPropagation();
+            if (e.key === 'Enter' && !isNodeInternalFocus) {
+                setIsNodeInternalFocus?.(true);
+                return;
+            }
+            if (e.key === 'Escape' && isNodeInternalFocus) {
+                changeFocusHandler(id);
+                setIsNodeInternalFocus?.(false);
+                escapeNodeHandler();
+                return;
+            }
+            if (!isNodeInternalFocus) {
+                navigationHandler(e);
+            }
+        }, onClick: (e) => {
+            e.stopPropagation();
+            changeFocusHandler(id);
+        }, tabIndex: isNodeInternalFocus ? -1 : parentNodeTabIndex, isNodeInternalFocus: isNodeInternalFocus, isFocus: isNodeInternalFocus ? false : parentNodeTabIndex === 0, lastNode: lastNode, depth: depth, children: _jsxs(Grid, { container: {
+                alignItems: 'center',
+                cols: isMediumOrAbove ? '2fr 2fr auto' : '2fr 0.5fr',
+                colGap: isMediumOrAbove ? 3 : 0,
+                rows: isMediumOrAbove ? 'repeat(1, auto)' : 'repeat(2, auto)'
+            }, as: StyledAssignmentItem, children: [_jsx(VisuallyHiddenText, { children: `${t('assignment_announcement_label')}` }), _jsx(Flex, { "data-testid": testIds.label, container: { alignItems: 'center' }, as: StyledProcessContainer, depth: depth, children: _jsx(PauseTextNode, { children: _jsx(AssignmentDetails, { processName: processName, name: name }) }) }), _jsx(Flex, { "data-testid": testIds.assignee, container: { justify: isMediumOrAbove ? 'end' : 'start' }, as: StyledAssigneeContainer, depth: depth, variant: 'secondary', children: _jsx(StyledAssignmentItemMetaList, { wrapItems: true, items: [
+                            _jsxs(_Fragment, { children: [_jsx(StyledAssigneeText, { onClick: (e) => {
+                                            onAssigneeClick(assigneeId, e);
+                                        }, variant: 'link', ref: setAssigneeElement, "data-testid": testIds.assignee, tabIndex: childElementsTabIndex, children: _jsx(PauseTextNode, { children: assigneeName }) }), _jsx(Tooltip, { target: assigneeEl, smart: true, children: assigneeName })] }),
+                            sla && (_jsx(Text, { variant: 'secondary', "data-testid": testIds.sla, children: _jsx(PauseTextNode, { children: sla }) })),
+                            _jsxs(_Fragment, { children: [_jsx(Text, { variant: 'secondary', as: StyledLabelContainer, "data-testid": testIds.urgency, children: t('assignment_item_urgency') }), _jsx(Text, { variant: 'secondary', children: _jsx(PauseTextNode, { children: urgency }) })] })
+                        ] }) }), _jsx(Flex, { as: StyledActionContainer, container: { justify: 'end' }, isMediumOrAbove: isMediumOrAbove, children: onOpen && (_jsx(Button, { "data-testid": testIds.action, compact: true, variant: 'primary', onClick: (e) => onOpen(id, e), tabIndex: childElementsTabIndex, children: t('go') })) })] }) }));
+};
+export default withTestIds(AssignmentItem, getAssignmentTestIds);
+//# sourceMappingURL=AssignmentItem.js.map