@pega/cosmos-react-work 7.5.6 → 7.6.0

package/lib/components/Assignments/Assignments.js

@@ -8,7 +8,7 @@ const Assignments = ({ items, count, collapsed, onToggleCollapsed, ...restProps
     const t = useI18n();
     const assignmentsId = useUID();
     const TaskItems = useMemo(() => {
-        return openItem ? _jsx(TaskItem, { ...openItem }) : _jsx(TaskList, { items: items });
+        return openItem ? _jsx(TaskItem, { ...openItem, headingTag: 'h2' }) : _jsx(TaskList, { items: items });
     }, [items, openItem]);
     const tasks = _jsx(CardContent, { children: items.length > 0 ? TaskItems : _jsx(EmptyState, {}) });
     const header = (_jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [typeof collapsed === 'boolean' && _jsx(Icon, { name: 'caret-right' }), _jsx(Text, { variant: 'h2', children: t('assignments') }), _jsx(Count, { children: count })] }));

package/lib/components/Assignments/Assignments.js.map

@@ -1 +1 @@
-{"version":3,"file":"Assignments.js","sourceRoot":"","sources":["../../../src/components/Assignments/Assignments.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,EACL,UAAU,EACV,OAAO,EACP,UAAU,EACV,cAAc,EACd,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,MAAM,EACN,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAGjC,OAAO,QAAQ,EAAE,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAGvD,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAkB7E,MAAM,WAAW,GAAwC,CAAC,EACxD,KAAK,EACL,KAAK,EACL,SAAS,EACT,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,aAAa,GAAG,MAAM,EAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE;QAC7B,OAAO,QAAQ,CAAC,CAAC,CAAC,KAAC,QAAQ,OAAK,QAAQ,GAAI,CAAC,CAAC,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC;IAC5E,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtB,MAAM,KAAK,GAAG,KAAC,WAAW,cAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAC,UAAU,KAAG,GAAe,CAAC;IAEzF,MAAM,MAAM,GAAG,CACb,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,OAAO,SAAS,KAAK,SAAS,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,EAC9D,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,aAAa,CAAC,GAAQ,EAC5C,KAAC,KAAK,cAAE,KAAK,GAAS,IACjB,CACR,CAAC;IAEF,OAAO,CACL,MAAC,iBAAiB,OAAK,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,sCACnD,CAAC,QAAQ,IAAI,CACZ,MAAC,UAAU,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACtE,OAAO,SAAS,KAAK,SAAS,IAAI,iBAAiB,IAAI,CACtD,KAAC,kBAAkB,IACjB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,EAAE,CAAC;wBACtB,CAAC,mBACc,aAAa,mBACb,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,gBAChC,CAAC,CAAC,aAAa,CAAC,YAE3B,MAAM,GACY,CACtB,EACA,SAAS,KAAK,SAAS,IAAI,MAAM,IACvB,CACd,EAEA,OAAO,SAAS,KAAK,SAAS,IAAI,iBAAiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAClE,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,YAAG,KAAK,GAAkB,CAC/D,CAAC,CAAC,CAAC,CACF,KAAK,CACN,IACiB,CACrB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { useMemo } from 'react';\nimport type { FC } from 'react';\n\nimport {\n  CardHeader,\n  useI18n,\n  EmptyState,\n  ExpandCollapse,\n  Icon,\n  Text,\n  Count,\n  Flex,\n  useUID,\n  CardContent\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nimport TaskList, { TaskItem } from '../Tasks/TaskList';\nimport type { TaskItemProps } from '../Tasks/TaskList';\n\nimport { StyledAssignments, StyledExpandButton } from './Assignments.styles';\n\nexport interface AssignmentsProps extends NoChildrenProp {\n  /** An array of TaskItemProps to generate the list. */\n  items: TaskItemProps[];\n  /** Integer representing the total count of tasks. */\n  count: number;\n  /**\n   * Controls the collapsed state of the assignments list.\n   * @default false\n   */\n  collapsed?: boolean;\n  /**\n   * Call when the user clicks the collapsed element.\n   */\n  onToggleCollapsed?: () => void;\n}\n\nconst Assignments: FC<ForwardProps & AssignmentsProps> = ({\n  items,\n  count,\n  collapsed,\n  onToggleCollapsed,\n  ...restProps\n}) => {\n  const openItem = items.find(item => item.content);\n  const t = useI18n();\n  const assignmentsId = useUID();\n\n  const TaskItems = useMemo(() => {\n    return openItem ? <TaskItem {...openItem} /> : <TaskList items={items} />;\n  }, [items, openItem]);\n\n  const tasks = <CardContent>{items.length > 0 ? TaskItems : <EmptyState />}</CardContent>;\n\n  const header = (\n    <Flex container={{ alignItems: 'center', gap: 1 }}>\n      {typeof collapsed === 'boolean' && <Icon name='caret-right' />}\n      <Text variant='h2'>{t('assignments')}</Text>\n      <Count>{count}</Count>\n    </Flex>\n  );\n\n  return (\n    <StyledAssignments {...restProps} openItem={!!openItem} data-app-region>\n      {!openItem && (\n        <CardHeader container={{ justify: 'start', alignItems: 'center', gap: 1 }}>\n          {typeof collapsed === 'boolean' && onToggleCollapsed && (\n            <StyledExpandButton\n              type='button'\n              variant='text'\n              onClick={() => {\n                onToggleCollapsed();\n              }}\n              aria-controls={assignmentsId}\n              aria-expanded={!collapsed ? 'true' : 'false'}\n              aria-label={t('assignments')}\n            >\n              {header}\n            </StyledExpandButton>\n          )}\n          {collapsed === undefined && header}\n        </CardHeader>\n      )}\n\n      {typeof collapsed === 'boolean' && onToggleCollapsed && !openItem ? (\n        <ExpandCollapse collapsed={collapsed}>{tasks}</ExpandCollapse>\n      ) : (\n        tasks\n      )}\n    </StyledAssignments>\n  );\n};\n\nexport default Assignments;\n"]}
+{"version":3,"file":"Assignments.js","sourceRoot":"","sources":["../../../src/components/Assignments/Assignments.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,EACL,UAAU,EACV,OAAO,EACP,UAAU,EACV,cAAc,EACd,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,MAAM,EACN,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAGjC,OAAO,QAAQ,EAAE,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAGvD,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAkB7E,MAAM,WAAW,GAAwC,CAAC,EACxD,KAAK,EACL,KAAK,EACL,SAAS,EACT,iBAAiB,EACjB,GAAG,SAAS,EACb,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,aAAa,GAAG,MAAM,EAAE,CAAC;IAE/B,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE;QAC7B,OAAO,QAAQ,CAAC,CAAC,CAAC,KAAC,QAAQ,OAAK,QAAQ,EAAE,UAAU,EAAC,IAAI,GAAG,CAAC,CAAC,CAAC,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC;IAC5F,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtB,MAAM,KAAK,GAAG,KAAC,WAAW,cAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAC,UAAU,KAAG,GAAe,CAAC;IAEzF,MAAM,MAAM,GAAG,CACb,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,OAAO,SAAS,KAAK,SAAS,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,EAC9D,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,aAAa,CAAC,GAAQ,EAC5C,KAAC,KAAK,cAAE,KAAK,GAAS,IACjB,CACR,CAAC;IAEF,OAAO,CACL,MAAC,iBAAiB,OAAK,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,sCACnD,CAAC,QAAQ,IAAI,CACZ,MAAC,UAAU,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACtE,OAAO,SAAS,KAAK,SAAS,IAAI,iBAAiB,IAAI,CACtD,KAAC,kBAAkB,IACjB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,EAAE,CAAC;wBACtB,CAAC,mBACc,aAAa,mBACb,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,gBAChC,CAAC,CAAC,aAAa,CAAC,YAE3B,MAAM,GACY,CACtB,EACA,SAAS,KAAK,SAAS,IAAI,MAAM,IACvB,CACd,EAEA,OAAO,SAAS,KAAK,SAAS,IAAI,iBAAiB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAClE,KAAC,cAAc,IAAC,SAAS,EAAE,SAAS,YAAG,KAAK,GAAkB,CAC/D,CAAC,CAAC,CAAC,CACF,KAAK,CACN,IACiB,CACrB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { useMemo } from 'react';\nimport type { FC } from 'react';\n\nimport {\n  CardHeader,\n  useI18n,\n  EmptyState,\n  ExpandCollapse,\n  Icon,\n  Text,\n  Count,\n  Flex,\n  useUID,\n  CardContent\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nimport TaskList, { TaskItem } from '../Tasks/TaskList';\nimport type { TaskItemProps } from '../Tasks/TaskList';\n\nimport { StyledAssignments, StyledExpandButton } from './Assignments.styles';\n\nexport interface AssignmentsProps extends NoChildrenProp {\n  /** An array of TaskItemProps to generate the list. */\n  items: TaskItemProps[];\n  /** Integer representing the total count of tasks. */\n  count: number;\n  /**\n   * Controls the collapsed state of the assignments list.\n   * @default false\n   */\n  collapsed?: boolean;\n  /**\n   * Call when the user clicks the collapsed element.\n   */\n  onToggleCollapsed?: () => void;\n}\n\nconst Assignments: FC<ForwardProps & AssignmentsProps> = ({\n  items,\n  count,\n  collapsed,\n  onToggleCollapsed,\n  ...restProps\n}) => {\n  const openItem = items.find(item => item.content);\n  const t = useI18n();\n  const assignmentsId = useUID();\n\n  const TaskItems = useMemo(() => {\n    return openItem ? <TaskItem {...openItem} headingTag='h2' /> : <TaskList items={items} />;\n  }, [items, openItem]);\n\n  const tasks = <CardContent>{items.length > 0 ? TaskItems : <EmptyState />}</CardContent>;\n\n  const header = (\n    <Flex container={{ alignItems: 'center', gap: 1 }}>\n      {typeof collapsed === 'boolean' && <Icon name='caret-right' />}\n      <Text variant='h2'>{t('assignments')}</Text>\n      <Count>{count}</Count>\n    </Flex>\n  );\n\n  return (\n    <StyledAssignments {...restProps} openItem={!!openItem} data-app-region>\n      {!openItem && (\n        <CardHeader container={{ justify: 'start', alignItems: 'center', gap: 1 }}>\n          {typeof collapsed === 'boolean' && onToggleCollapsed && (\n            <StyledExpandButton\n              type='button'\n              variant='text'\n              onClick={() => {\n                onToggleCollapsed();\n              }}\n              aria-controls={assignmentsId}\n              aria-expanded={!collapsed ? 'true' : 'false'}\n              aria-label={t('assignments')}\n            >\n              {header}\n            </StyledExpandButton>\n          )}\n          {collapsed === undefined && header}\n        </CardHeader>\n      )}\n\n      {typeof collapsed === 'boolean' && onToggleCollapsed && !openItem ? (\n        <ExpandCollapse collapsed={collapsed}>{tasks}</ExpandCollapse>\n      ) : (\n        tasks\n      )}\n    </StyledAssignments>\n  );\n};\n\nexport default Assignments;\n"]}

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

@@ -0,0 +1,28 @@
+import type { MutableRefObject, RefObject } from 'react';
+import type { CaseListProps, AssignmentProps } from './HierarchicalAssignments.types';
+type Id = CaseListProps['id'] | AssignmentProps['id'];
+export interface AssignmentContextProps {
+    /** First Element's Assignment or Case Id in the list */
+    firstNodeId?: Id;
+    /** Last Element's Assignment or Case Id in the list */
+    lastNodeId?: Id;
+    /** Current Focused Element's Id */
+    focusedNodeId?: Id;
+    /** Callback to change the focus */
+    changeFocusHandler: (id: Id, key?: string, caseIdExpandList?: CaseListProps['id'][]) => void;
+    /** Array of Expanded Case Id's List */
+    caseIdExpandList: CaseListProps['id'][];
+    /** Boolean that refers component's breakpoint. */
+    isMediumOrAbove?: boolean;
+    /** Root Tree Ref */
+    parentRef?: RefObject<HTMLUListElement>;
+    /** State maintains key navigation switched to Forms mode. */
+    nodeInternalFocus?: boolean;
+    /** Function to update nodeInternalFocus state. */
+    setNodeInternalFocusHandler?: (value: boolean) => void;
+    /** Mutable Ref, tracks the reverse tab flow order in Forms mode. */
+    reverseTabFlow: MutableRefObject<boolean>;
+}
+declare const AssignmentContext: import("react").Context<AssignmentContextProps>;
+export default AssignmentContext;
+//# sourceMappingURL=AssignmentContext.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentContext.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAEtF,KAAK,EAAE,GAAG,aAAa,CAAC,IAAI,CAAC,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;AAEtD,MAAM,WAAW,sBAAsB;IACrC,wDAAwD;IACxD,WAAW,CAAC,EAAE,EAAE,CAAC;IACjB,uDAAuD;IACvD,UAAU,CAAC,EAAE,EAAE,CAAC;IAChB,mCAAmC;IACnC,aAAa,CAAC,EAAE,EAAE,CAAC;IACnB,mCAAmC;IACnC,kBAAkB,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC;IAC7F,uCAAuC;IACvC,gBAAgB,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC;IACxC,kDAAkD;IAClD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oBAAoB;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACxC,6DAA6D;IAC7D,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,kDAAkD;IAClD,2BAA2B,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACvD,oEAAoE;IACpE,cAAc,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;CAC3C;AAED,QAAA,MAAM,iBAAiB,iDAUrB,CAAC;AAEH,eAAe,iBAAiB,CAAC"}

package/lib/components/HierarchicalAssignments/AssignmentContext.js

@@ -0,0 +1,14 @@
+import { createContext } from 'react';
+const AssignmentContext = createContext({
+    firstNodeId: undefined,
+    lastNodeId: undefined,
+    focusedNodeId: undefined,
+    changeFocusHandler: () => { },
+    caseIdExpandList: [],
+    isMediumOrAbove: true,
+    parentRef: undefined,
+    setNodeInternalFocusHandler: () => { },
+    reverseTabFlow: { current: false }
+});
+export default AssignmentContext;
+//# sourceMappingURL=AssignmentContext.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentContext.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AA8BtC,MAAM,iBAAiB,GAAG,aAAa,CAAyB;IAC9D,WAAW,EAAE,SAAS;IACtB,UAAU,EAAE,SAAS;IACrB,aAAa,EAAE,SAAS;IACxB,kBAAkB,EAAE,GAAG,EAAE,GAAE,CAAC;IAC5B,gBAAgB,EAAE,EAAE;IACpB,eAAe,EAAE,IAAI;IACrB,SAAS,EAAE,SAAS;IACpB,2BAA2B,EAAE,GAAG,EAAE,GAAE,CAAC;IACrC,cAAc,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;CACnC,CAAC,CAAC;AAEH,eAAe,iBAAiB,CAAC","sourcesContent":["import { createContext } from 'react';\nimport type { MutableRefObject, RefObject } from 'react';\n\nimport type { CaseListProps, AssignmentProps } from './HierarchicalAssignments.types';\n\ntype Id = CaseListProps['id'] | AssignmentProps['id'];\n\nexport interface AssignmentContextProps {\n  /** First Element's Assignment or Case Id in the list */\n  firstNodeId?: Id;\n  /** Last Element's Assignment or Case Id in the list */\n  lastNodeId?: Id;\n  /** Current Focused Element's Id */\n  focusedNodeId?: Id;\n  /** Callback to change the focus */\n  changeFocusHandler: (id: Id, key?: string, caseIdExpandList?: CaseListProps['id'][]) => void;\n  /** Array of Expanded Case Id's List */\n  caseIdExpandList: CaseListProps['id'][];\n  /** Boolean that refers component's breakpoint. */\n  isMediumOrAbove?: boolean;\n  /** Root Tree Ref */\n  parentRef?: RefObject<HTMLUListElement>;\n  /** State maintains key navigation switched to Forms mode. */\n  nodeInternalFocus?: boolean;\n  /** Function to update nodeInternalFocus state. */\n  setNodeInternalFocusHandler?: (value: boolean) => void;\n  /** Mutable Ref, tracks the reverse tab flow order in Forms mode. */\n  reverseTabFlow: MutableRefObject<boolean>;\n}\n\nconst AssignmentContext = createContext<AssignmentContextProps>({\n  firstNodeId: undefined,\n  lastNodeId: undefined,\n  focusedNodeId: undefined,\n  changeFocusHandler: () => {},\n  caseIdExpandList: [],\n  isMediumOrAbove: true,\n  parentRef: undefined,\n  setNodeInternalFocusHandler: () => {},\n  reverseTabFlow: { current: false }\n});\n\nexport default AssignmentContext;\n"]}

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

@@ -1,5 +1,8 @@
 /// <reference types="react" />
+import type { HeadingTag } from '@pega/cosmos-react-core';
 import type { AssignmentProps } from './HierarchicalAssignments.types';
-export declare const AssignmentDetail: ({ processName, name }: Pick<AssignmentProps, 'processName' | 'name'>) => JSX.Element;
+export declare const AssignmentDetail: ({ processName, name, headingTag }: Pick<AssignmentProps, "name" | "processName"> & {
+    headingTag?: HeadingTag | undefined;
+}) => JSX.Element;
 export default AssignmentDetail;
 //# sourceMappingURL=AssignmentDetail.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"AssignmentDetail.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentDetail.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAGvE,eAAO,MAAM,gBAAgB,0BAG1B,KAAK,eAAe,EAAE,aAAa,GAAG,MAAM,CAAC,gBAa/C,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"AssignmentDetail.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentDetail.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAGvE,eAAO,MAAM,gBAAgB;;iBAiB5B,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/HierarchicalAssignments/AssignmentDetail.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Text, Tooltip, useElement } from '@pega/cosmos-react-core';
 import { StyledAssignmentText } from './Assignments.styles';
-export const AssignmentDetail = ({ processName, name }) => {
+export const AssignmentDetail = ({ processName, name, headingTag }) => {
     const [element, setElement] = useElement();
     const assignmentDetail = processName ? `${processName} - ${name}` : name;
-    return (_jsxs(_Fragment, { children: [_jsx(Text, { as: StyledAssignmentText, ref: setElement, children: assignmentDetail }), _jsx(Tooltip, { target: element, smart: true, children: assignmentDetail })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Text, { variant: headingTag, as: StyledAssignmentText, ref: setElement, children: assignmentDetail }), _jsx(Tooltip, { target: element, smart: true, children: assignmentDetail })] }));
 };
 export default AssignmentDetail;
 //# sourceMappingURL=AssignmentDetail.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"AssignmentDetail.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentDetail.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAGpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,WAAW,EACX,IAAI,EAC0C,EAAE,EAAE;IAClD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,UAAU,EAAe,CAAC;IACxD,MAAM,gBAAgB,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IACzE,OAAO,CACL,8BACE,KAAC,IAAI,IAAC,EAAE,EAAE,oBAAoB,EAAE,GAAG,EAAE,UAAU,YAC5C,gBAAgB,GACZ,EACP,KAAC,OAAO,IAAC,MAAM,EAAE,OAAO,EAAE,KAAK,kBAC5B,gBAAgB,GACT,IACT,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { Text, Tooltip, useElement } from '@pega/cosmos-react-core';\n\nimport type { AssignmentProps } from './HierarchicalAssignments.types';\nimport { StyledAssignmentText } from './Assignments.styles';\n\nexport const AssignmentDetail = ({\n  processName,\n  name\n}: Pick<AssignmentProps, 'processName' | 'name'>) => {\n  const [element, setElement] = useElement<HTMLElement>();\n  const assignmentDetail = processName ? `${processName} - ${name}` : name;\n  return (\n    <>\n      <Text as={StyledAssignmentText} ref={setElement}>\n        {assignmentDetail}\n      </Text>\n      <Tooltip target={element} smart>\n        {assignmentDetail}\n      </Tooltip>\n    </>\n  );\n};\n\nexport default AssignmentDetail;\n"]}
+{"version":3,"file":"AssignmentDetail.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentDetail.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAIpE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,WAAW,EACX,IAAI,EACJ,UAAU,EACkE,EAAE,EAAE;IAChF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,UAAU,EAAe,CAAC;IACxD,MAAM,gBAAgB,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,WAAW,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;IACzE,OAAO,CACL,8BACE,KAAC,IAAI,IAAC,OAAO,EAAE,UAAU,EAAE,EAAE,EAAE,oBAAoB,EAAE,GAAG,EAAE,UAAU,YACjE,gBAAgB,GACZ,EACP,KAAC,OAAO,IAAC,MAAM,EAAE,OAAO,EAAE,KAAK,kBAC5B,gBAAgB,GACT,IACT,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { Text, Tooltip, useElement } from '@pega/cosmos-react-core';\nimport type { HeadingTag } from '@pega/cosmos-react-core';\n\nimport type { AssignmentProps } from './HierarchicalAssignments.types';\nimport { StyledAssignmentText } from './Assignments.styles';\n\nexport const AssignmentDetail = ({\n  processName,\n  name,\n  headingTag\n}: Pick<AssignmentProps, 'processName' | 'name'> & { headingTag?: HeadingTag }) => {\n  const [element, setElement] = useElement<HTMLElement>();\n  const assignmentDetail = processName ? `${processName} - ${name}` : name;\n  return (\n    <>\n      <Text variant={headingTag} as={StyledAssignmentText} ref={setElement}>\n        {assignmentDetail}\n      </Text>\n      <Tooltip target={element} smart>\n        {assignmentDetail}\n      </Tooltip>\n    </>\n  );\n};\n\nexport default AssignmentDetail;\n"]}

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

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import type { ItemsProps, AssignmentProps, CaseListProps } from './HierarchicalAssignments.types';
+export interface AssignmentNodeProps {
+    /** Object that can be Assignment or Child details */
+    node: CaseListProps | AssignmentProps;
+    /** Property defines the node's depth level */
+    depth: number;
+    /** Callback of case expand/collapse button. */
+    childCaseToggleHandler?: ItemsProps['onToggleCollapsed'];
+    /** Boolean refers current case is expanded  */
+    expanded: boolean;
+    /** total the number of items in the current set of treeitems */
+    setSize?: number;
+    /** the position of the element within the whole set of treeitems */
+    posInset?: number;
+}
+export declare const maxDepth = 5;
+declare const AssignmentNode: ({ node, depth, expanded, childCaseToggleHandler, setSize, posInset }: AssignmentNodeProps) => JSX.Element;
+export default AssignmentNode;
+//# sourceMappingURL=AssignmentNode.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentNode.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentNode.tsx"],"names":[],"mappings":";AAOA,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAElG,MAAM,WAAW,mBAAmB;IAClC,qDAAqD;IACrD,IAAI,EAAE,aAAa,GAAG,eAAe,CAAC;IACtC,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,sBAAsB,CAAC,EAAE,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACzD,+CAA+C;IAC/C,QAAQ,EAAE,OAAO,CAAC;IAClB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,QAAQ,IAAI,CAAC;AAE1B,QAAA,MAAM,cAAc,yEAOjB,mBAAmB,gBA0ErB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/HierarchicalAssignments/AssignmentNode.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useContext, useCallback } from 'react';
+import AssignmentItem from './nodeItems/AssignmentItem';
+import CaseDetail from './nodeItems/CaseDetail';
+import AssignmentTreeContext from './AssignmentContext';
+import { isAssignment, isExpandedNode } from './helpers';
+import { StyledExpandCollpase } from './Assignments.styles';
+export const maxDepth = 5;
+const AssignmentNode = ({ node, depth, expanded, childCaseToggleHandler, setSize, posInset }) => {
+    const { caseIdExpandList } = useContext(AssignmentTreeContext);
+    const isAssignmentProps = isAssignment(node);
+    const [open, setOpen] = useState(expanded);
+    const handleToggle = useCallback(() => {
+        if (!isAssignmentProps) {
+            node.onToggleCollapsed?.(!open, node.id);
+        }
+        childCaseToggleHandler?.(!open, node.id);
+        setOpen(prevState => !prevState);
+    }, [open, node.id]);
+    const childSetSize = !isAssignmentProps
+        ? (node?.assignments?.length ?? 0) + (node?.childCases?.length ?? 0)
+        : 0;
+    let childPosInset = 0;
+    return (_jsx(_Fragment, { children: isAssignmentProps ? (_jsx(AssignmentItem, { ...node, depth: depth, setSize: setSize, posInset: posInset })) : (_jsx(CaseDetail, { ...node, onExpandButtonClickHandler: handleToggle, hasChildren: !!(node.assignments?.length || node.childCases?.length), open: open, depth: depth, setSize: setSize, posInset: posInset, children: open && !isAssignmentProps && (_jsx(StyledExpandCollpase, { collapsed: !open, id: `${node.id}-subtree`, forwardedAs: 'ul', role: 'group', children: _jsxs(_Fragment, { children: [node.assignments?.map(assignment => {
+                            childPosInset += 1;
+                            return (_jsx(AssignmentNode, { node: assignment, depth: depth + 1, expanded: false, setSize: childSetSize, posInset: childPosInset }, assignment.id));
+                        }), node.childCases?.map(childNode => {
+                            childPosInset += 1;
+                            return (_jsx(AssignmentNode, { node: childNode, depth: depth + 1, expanded: isExpandedNode(caseIdExpandList, childNode.id), childCaseToggleHandler: childCaseToggleHandler, setSize: childSetSize, posInset: childPosInset }, childNode.id));
+                        })] }) })) })) }));
+};
+export default AssignmentNode;
+//# sourceMappingURL=AssignmentNode.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentNode.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentNode.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useContext, useCallback } from 'react';\n\nimport AssignmentItem from './nodeItems/AssignmentItem';\nimport CaseDetail from './nodeItems/CaseDetail';\nimport AssignmentTreeContext from './AssignmentContext';\nimport { isAssignment, isExpandedNode } from './helpers';\nimport { StyledExpandCollpase } from './Assignments.styles';\nimport type { ItemsProps, AssignmentProps, CaseListProps } from './HierarchicalAssignments.types';\n\nexport interface AssignmentNodeProps {\n  /** Object that can be Assignment or Child details */\n  node: CaseListProps | AssignmentProps;\n  /** Property defines the node's depth level */\n  depth: number;\n  /** Callback of case expand/collapse button. */\n  childCaseToggleHandler?: ItemsProps['onToggleCollapsed'];\n  /** Boolean refers current case is expanded  */\n  expanded: boolean;\n  /** total the number of items in the current set of treeitems */\n  setSize?: number;\n  /** the position of the element within the whole set of treeitems */\n  posInset?: number;\n}\n\nexport const maxDepth = 5;\n\nconst AssignmentNode = ({\n  node,\n  depth,\n  expanded,\n  childCaseToggleHandler,\n  setSize,\n  posInset\n}: AssignmentNodeProps) => {\n  const { caseIdExpandList } = useContext(AssignmentTreeContext);\n  const isAssignmentProps = isAssignment(node);\n  const [open, setOpen] = useState(expanded);\n\n  const handleToggle = useCallback(() => {\n    if (!isAssignmentProps) {\n      node.onToggleCollapsed?.(!open, node.id);\n    }\n    childCaseToggleHandler?.(!open, node.id);\n    setOpen(prevState => !prevState);\n  }, [open, node.id]);\n\n  const childSetSize = !isAssignmentProps\n    ? (node?.assignments?.length ?? 0) + (node?.childCases?.length ?? 0)\n    : 0;\n  let childPosInset = 0;\n\n  return (\n    <>\n      {isAssignmentProps ? (\n        <AssignmentItem {...node} depth={depth} setSize={setSize} posInset={posInset} />\n      ) : (\n        <CaseDetail\n          {...node}\n          onExpandButtonClickHandler={handleToggle}\n          hasChildren={!!(node.assignments?.length || node.childCases?.length)}\n          open={open}\n          depth={depth}\n          setSize={setSize}\n          posInset={posInset}\n        >\n          {open && !isAssignmentProps && (\n            <StyledExpandCollpase\n              collapsed={!open}\n              id={`${node.id}-subtree`}\n              forwardedAs='ul'\n              role='group'\n            >\n              <>\n                {node.assignments?.map(assignment => {\n                  childPosInset += 1;\n                  return (\n                    <AssignmentNode\n                      key={assignment.id}\n                      node={assignment}\n                      depth={depth + 1}\n                      expanded={false}\n                      setSize={childSetSize}\n                      posInset={childPosInset}\n                    />\n                  );\n                })}\n                {node.childCases?.map(childNode => {\n                  childPosInset += 1;\n                  return (\n                    <AssignmentNode\n                      key={childNode.id}\n                      node={childNode}\n                      depth={depth + 1}\n                      expanded={isExpandedNode(caseIdExpandList, childNode.id)}\n                      childCaseToggleHandler={childCaseToggleHandler}\n                      setSize={childSetSize}\n                      posInset={childPosInset}\n                    />\n                  );\n                })}\n              </>\n            </StyledExpandCollpase>\n          )}\n        </CaseDetail>\n      )}\n    </>\n  );\n};\n\nexport default AssignmentNode;\n"]}

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

@@ -0,0 +1,15 @@
+import type { Ref } from 'react';
+import type { HierarchicalAssignmentProps, ItemsProps } from './HierarchicalAssignments.types';
+export interface AssignmentTreeProps {
+    /** An array of assignment details to be rendered as Assignment details */
+    assignments?: HierarchicalAssignmentProps['assignments'];
+    /** An array of child cases to be rendered as case details */
+    childCases?: HierarchicalAssignmentProps['childCases'];
+    /** Callback of case expand/collapse button.  */
+    childCaseToggleHandler?: ItemsProps['onToggleCollapsed'];
+    /** Ref placed on the tree element. */
+    ref?: Ref<HTMLUListElement>;
+}
+declare const AssignmentTree: import("react").ForwardRefExoticComponent<Omit<AssignmentTreeProps, "ref"> & import("react").RefAttributes<HTMLUListElement>>;
+export default AssignmentTree;
+//# sourceMappingURL=AssignmentTree.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentTree.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentTree.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAMjC,OAAO,KAAK,EAAE,2BAA2B,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAG/F,MAAM,WAAW,mBAAmB;IAClC,0EAA0E;IAC1E,WAAW,CAAC,EAAE,2BAA2B,CAAC,aAAa,CAAC,CAAC;IACzD,6DAA6D;IAC7D,UAAU,CAAC,EAAE,2BAA2B,CAAC,YAAY,CAAC,CAAC;IACvD,gDAAgD;IAChD,sBAAsB,CAAC,EAAE,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACzD,sCAAsC;IACtC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,QAAA,MAAM,cAAc,+HAuCnB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/HierarchicalAssignments/AssignmentTree.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, forwardRef } from 'react';
+import AssignmentNode from './AssignmentNode';
+import AssignmentItem from './nodeItems/AssignmentItem';
+import AssignmentTreeContext from './AssignmentContext';
+import { isExpandedNode, initialDepth } from './helpers';
+import { StyledTreeRoot } from './Assignments.styles';
+const AssignmentTree = forwardRef(({ assignments, childCases, childCaseToggleHandler }, ref) => {
+    const { caseIdExpandList } = useContext(AssignmentTreeContext);
+    const setSize = (assignments?.length ?? 0) + (childCases?.length ?? 0);
+    let posInset = 0;
+    return (_jsxs(StyledTreeRoot, { role: 'tree', ref: ref, tabIndex: -1, children: [assignments?.map(assignment => {
+                posInset += 1;
+                return (_jsx(AssignmentItem, { ...assignment, depth: initialDepth, setSize: setSize, posInset: posInset }, assignment.id));
+            }), childCases?.map(childNode => {
+                posInset += 1;
+                return (_jsx(AssignmentNode, { depth: initialDepth, node: childNode, expanded: isExpandedNode(caseIdExpandList, childNode.id), childCaseToggleHandler: childCaseToggleHandler, setSize: setSize, posInset: posInset }, childNode.id));
+            })] }));
+});
+export default AssignmentTree;
+//# sourceMappingURL=AssignmentTree.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AssignmentTree.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/AssignmentTree.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAG/C,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,cAAc,MAAM,4BAA4B,CAAC;AACxD,OAAO,qBAAqB,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAatD,MAAM,cAAc,GAAG,UAAU,CAC/B,CACE,EAAE,WAAW,EAAE,UAAU,EAAE,sBAAsB,EAAuB,EACxE,GAA+B,EAC/B,EAAE;IACF,MAAM,EAAE,gBAAgB,EAAE,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAC;IAC/D,MAAM,OAAO,GAAG,CAAC,WAAW,EAAE,MAAM,IAAI,CAAC,CAAC,GAAG,CAAC,UAAU,EAAE,MAAM,IAAI,CAAC,CAAC,CAAC;IACvE,IAAI,QAAQ,GAAG,CAAC,CAAC;IACjB,OAAO,CACL,MAAC,cAAc,IAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC,aAC/C,WAAW,EAAE,GAAG,CAAC,UAAU,CAAC,EAAE;gBAC7B,QAAQ,IAAI,CAAC,CAAC;gBACd,OAAO,CACL,KAAC,cAAc,OAET,UAAU,EACd,KAAK,EAAE,YAAY,EACnB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,IAJb,UAAU,CAAC,EAAE,CAKlB,CACH,CAAC;YACJ,CAAC,CAAC,EACD,UAAU,EAAE,GAAG,CAAC,SAAS,CAAC,EAAE;gBAC3B,QAAQ,IAAI,CAAC,CAAC;gBACd,OAAO,CACL,KAAC,cAAc,IACb,KAAK,EAAE,YAAY,EAEnB,IAAI,EAAE,SAAS,EACf,QAAQ,EAAE,cAAc,CAAC,gBAAgB,EAAE,SAAS,CAAC,EAAE,CAAC,EACxD,sBAAsB,EAAE,sBAAsB,EAC9C,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,IALb,SAAS,CAAC,EAAE,CAMjB,CACH,CAAC;YACJ,CAAC,CAAC,IACa,CAClB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { useContext, forwardRef } from 'react';\nimport type { Ref } from 'react';\n\nimport AssignmentNode from './AssignmentNode';\nimport AssignmentItem from './nodeItems/AssignmentItem';\nimport AssignmentTreeContext from './AssignmentContext';\nimport { isExpandedNode, initialDepth } from './helpers';\nimport type { HierarchicalAssignmentProps, ItemsProps } from './HierarchicalAssignments.types';\nimport { StyledTreeRoot } from './Assignments.styles';\n\nexport interface AssignmentTreeProps {\n  /** An array of assignment details to be rendered as Assignment details */\n  assignments?: HierarchicalAssignmentProps['assignments'];\n  /** An array of child cases to be rendered as case details */\n  childCases?: HierarchicalAssignmentProps['childCases'];\n  /** Callback of case expand/collapse button.  */\n  childCaseToggleHandler?: ItemsProps['onToggleCollapsed'];\n  /** Ref placed on the tree element. */\n  ref?: Ref<HTMLUListElement>;\n}\n\nconst AssignmentTree = forwardRef(\n  (\n    { assignments, childCases, childCaseToggleHandler }: AssignmentTreeProps,\n    ref: AssignmentTreeProps['ref']\n  ) => {\n    const { caseIdExpandList } = useContext(AssignmentTreeContext);\n    const setSize = (assignments?.length ?? 0) + (childCases?.length ?? 0);\n    let posInset = 0;\n    return (\n      <StyledTreeRoot role='tree' ref={ref} tabIndex={-1}>\n        {assignments?.map(assignment => {\n          posInset += 1;\n          return (\n            <AssignmentItem\n              key={assignment.id}\n              {...assignment}\n              depth={initialDepth}\n              setSize={setSize}\n              posInset={posInset}\n            />\n          );\n        })}\n        {childCases?.map(childNode => {\n          posInset += 1;\n          return (\n            <AssignmentNode\n              depth={initialDepth}\n              key={childNode.id}\n              node={childNode}\n              expanded={isExpandedNode(caseIdExpandList, childNode.id)}\n              childCaseToggleHandler={childCaseToggleHandler}\n              setSize={setSize}\n              posInset={posInset}\n            />\n          );\n        })}\n      </StyledTreeRoot>\n    );\n  }\n);\n\nexport default AssignmentTree;\n"]}

package/lib/components/HierarchicalAssignments/Assignments.styles.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { Grid } from '@pega/cosmos-react-core';
 export declare const StyledExpandButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledExpandCollapse: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ExpandCollapseProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledParentExpandCollapse: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledAssignmentItem: typeof Grid;
+export declare const StyledExpandCollpase: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ExpandCollapseProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledAssignmentItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
+    hideBorders?: boolean | undefined;
+}, never>;
 export declare const StyledProcessContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     depth?: number | undefined;
 }, never>;
@@ -21,17 +21,12 @@ export declare const StyledSummaryItem: import("styled-components").StyledCompon
 export declare const StyledAssignments: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").CardProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {
     expanded?: boolean | undefined;
 }, never>;
-export declare const StyledAssignmentContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
-    depth?: number | undefined;
-    hideBorders?: boolean | undefined;
-}, never>;
 export declare const StyledAssignmentText: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").TextProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledLinkContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     isMediumOrAbove?: boolean | undefined;
 }, never>;
 export declare const StyledAssigneeContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     depth?: number | undefined;
-    isMediumOrAbove?: boolean | undefined;
 }, never>;
 export declare const StyledAssigneeText: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledMetaListContainer: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").MetaListProps & import("@pega/cosmos-react-core").ForwardProps> & {
@@ -42,4 +37,15 @@ export declare const StyledMetaListContainer: import("styled-components").Styled
 export declare const StyledMetaIdStatusContainer: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").MetaListProps & import("@pega/cosmos-react-core").ForwardProps> & {
     getTestIds: (testIdProp?: string | null | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly []>;
 }, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledLabelContainer: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledTreeRoot: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledNode: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {
+    isFocus?: boolean | undefined;
+    lastNode?: boolean | undefined;
+    isChild?: boolean | undefined;
+    depth: number;
+}, never>;
+export declare const StyledAssignmentItemMetaList: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").MetaListProps & import("@pega/cosmos-react-core").ForwardProps> & {
+    getTestIds: (testIdProp?: string | null | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly []>;
+}, import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=Assignments.styles.d.ts.map

package/lib/components/HierarchicalAssignments/Assignments.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Assignments.styles.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/Assignments.styles.ts"],"names":[],"mappings":";AAEA,OAAO,EACL,IAAI,EAYL,MAAM,yBAAyB,CAAC;AAKjC,eAAO,MAAM,kBAAkB,qOA0B7B,CAAC;AAIH,eAAO,MAAM,oBAAoB,6OAQ/B,CAAC;AAIH,eAAO,MAAM,0BAA0B,yGAMrC,CAAC;AAIH,eAAO,MAAM,oBAAoB,EAAE,OAAO,IAsBxC,CAAC;AAGH,eAAO,MAAM,sBAAsB;;SA0BlC,CAAC;AAGF,eAAO,MAAM,qBAAqB;;SAYjC,CAAC;AAGF,eAAO,MAAM,qBAAqB;;SAoBjC,CAAC;AAGF,eAAO,MAAM,iBAAiB;;;YAAiC,OAAO;SAiBpE,CAAC;AAGH,eAAO,MAAM,iBAAiB;;SAW5B,CAAC;AAIH,eAAO,MAAM,yBAAyB;;;SA8BrC,CAAC;AAGF,eAAO,MAAM,oBAAoB,mOAI/B,CAAC;AAGH,eAAO,MAAM,mBAAmB;;SAsB/B,CAAC;AAGF,eAAO,MAAM,uBAAuB;;;SA2BnC,CAAC;AAGF,eAAO,MAAM,kBAAkB,qOAO7B,CAAC;AAGH,eAAO,MAAM,uBAAuB;;;YAC1B,OAAO;SA2Bf,CAAC;AAGH,eAAO,MAAM,2BAA2B;;uDAQtC,CAAC"}
+{"version":3,"file":"Assignments.styles.d.ts","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/Assignments.styles.ts"],"names":[],"mappings":";AAmBA,eAAO,MAAM,kBAAkB,qOA0B7B,CAAC;AAIH,eAAO,MAAM,oBAAoB,6OAQ/B,CAAC;AAGH,eAAO,MAAM,oBAAoB;;SAahC,CAAC;AAGF,eAAO,MAAM,sBAAsB;;SA4BlC,CAAC;AAGF,eAAO,MAAM,qBAAqB;;SAajC,CAAC;AAGF,eAAO,MAAM,qBAAqB;;SAgBjC,CAAC;AAGF,eAAO,MAAM,iBAAiB;;;YAAiC,OAAO;SAiBpE,CAAC;AAGH,eAAO,MAAM,iBAAiB;;SAe5B,CAAC;AAIH,eAAO,MAAM,oBAAoB,mOAI/B,CAAC;AAGH,eAAO,MAAM,mBAAmB;;SAsB/B,CAAC;AAGF,eAAO,MAAM,uBAAuB;;SAqBnC,CAAC;AAGF,eAAO,MAAM,kBAAkB,qOAQ7B,CAAC;AAGH,eAAO,MAAM,uBAAuB;;;YAC1B,OAAO;SA2Bf,CAAC;AAGH,eAAO,MAAM,2BAA2B;;uDAQtC,CAAC;AAGH,eAAO,MAAM,oBAAoB,0GAUhC,CAAC;AAGF,eAAO,MAAM,cAAc,wGAkC1B,CAAC;AAGF,eAAO,MAAM,UAAU;;;;WAId,MAAM;SAoDd,CAAC;AAGF,eAAO,MAAM,4BAA4B;;uDAQvC,CAAC"}

package/lib/components/HierarchicalAssignments/Assignments.styles.js

@@ -1,5 +1,5 @@
 import styled, { css } from 'styled-components';
-import { Grid, Button, Card, defaultThemeProp, StyledIcon, ExpandCollapse, useDirection, Text, MetaList, SummaryItem, calculateFontSize, StyledText } from '@pega/cosmos-react-core';
+import { Button, Card, defaultThemeProp, StyledIcon, useDirection, MetaList, SummaryItem, calculateFontSize, StyledText, Text, ExpandCollapse } from '@pega/cosmos-react-core';
 import { elipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';
 import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
 export const StyledExpandButton = styled(Button)(({ theme: { base: { animation } } }) => {
@@ -26,30 +26,17 @@ export const StyledExpandButton = styled(Button)(({ theme: { base: { animation }
   `;
 });
 StyledExpandButton.defaultProps = defaultThemeProp;
-export const StyledExpandCollapse = styled(ExpandCollapse)(({ theme: { base: { spacing } } }) => {
+export const StyledExpandCollpase = styled(ExpandCollapse)(({ theme: { base: { spacing } } }) => {
     return css `
-    padding-inline: calc(${spacing} * 2);
+    margin-block-start: calc(0.125 * ${spacing});
   `;
 });
-StyledExpandCollapse.defaultProps = defaultThemeProp;
-export const StyledParentExpandCollapse = styled.div(() => {
-    const assignmentHeight = '50dvh';
+StyledExpandCollpase.defaultProps = defaultThemeProp;
+export const StyledAssignmentItem = styled.div(({ theme: { base: { spacing } } }) => {
     return css `
-    max-height: ${assignmentHeight};
-    overflow-y: auto;
-  `;
-});
-StyledParentExpandCollapse.defaultProps = defaultThemeProp;
-export const StyledAssignmentItem = styled(Grid)(({ theme: { base: { spacing, colors }, components: { table: { body: { 'border-width': borderWidth } } } }, hideBorders }) => {
-    return css `
-    padding-inline-end: calc(2 * ${spacing});
-    padding-block: calc(0.5 * ${spacing});
-    border-block-start: ${borderWidth} dashed ${colors.gray.light};
-    ${hideBorders &&
-        css `
-      border-block-start: none;
-    `};
-  `;
+      padding-inline-end: calc(2 * ${spacing});
+      padding-block: calc(0.5 * ${spacing});
+    `;
 });
 StyledAssignmentItem.defaultProps = defaultThemeProp;
 export const StyledProcessContainer = styled.div(({ depth, theme: { base: { spacing }, components: { icon: { size: { s } } } } }) => {
@@ -61,14 +48,17 @@ export const StyledProcessContainer = styled.div(({ depth, theme: { base: { spac
       padding-inline-start: ${paddingInlineStart};
       grid-row-start: 1;
       grid-row-end: 1;
+      height: 100%;
       ${StyledText} {
         ${elipsisOverflow}
+        padding-inline: calc(0.5 * ${spacing});
       }
     `;
 });
 StyledProcessContainer.defaultProps = defaultThemeProp;
 export const StyledActionContainer = styled.div(({ isMediumOrAbove }) => {
     return css `
+      min-width: 3.313rem;
       grid-row-start: 1;
       grid-row-end: -1;
       ${isMediumOrAbove &&
@@ -79,14 +69,13 @@ export const StyledActionContainer = styled.div(({ isMediumOrAbove }) => {
     `;
 });
 StyledActionContainer.defaultProps = defaultThemeProp;
-export const StyledHeaderContainer = styled.div(({ theme: { base: { spacing, palette: { 'secondary-background': secondaryBackground } } }, depth }) => {
+export const StyledHeaderContainer = styled.div(({ theme: { base: { spacing } }, depth }) => {
     const paddingInlineStart = depth
         ? `calc(1.5 * ${spacing} * ${depth})`
         : `calc(1.5 * ${spacing})`;
     return css `
       padding-inline-start: ${paddingInlineStart};
       padding-block: calc(0.5 * ${spacing});
-      background-color: ${secondaryBackground};
     `;
 });
 StyledHeaderContainer.defaultProps = defaultThemeProp;
@@ -102,8 +91,12 @@ StyledSummaryItem.defaultProps = defaultThemeProp;
 export const StyledAssignments = styled(Card)(({ theme, expanded }) => {
     return css `
     padding: calc(${theme.base.spacing} * 2);
-    box-shadow: ${expanded ? theme.base.shadow.low : 'none'};
-    &&& {
+
+    &:has(form) {
+      box-shadow: ${expanded ? theme.base.shadow.low : 'none'};
+    }
+
+    &&&& {
       > ${StyledCardHeader} {
         padding: 0;
         padding-block-end: ${expanded ? `calc(${theme.base.spacing} * 2)` : 0};
@@ -112,22 +105,6 @@ export const StyledAssignments = styled(Card)(({ theme, expanded }) => {
   `;
 });
 StyledAssignments.defaultProps = defaultThemeProp;
-export const StyledAssignmentContainer = styled.div(({ theme: { base: { colors, 'border-radius': borderRadius }, components: { table: { body: { 'border-width': borderWidth } } } }, depth, hideBorders }) => {
-    return css `
-      overflow: hidden;
-      width: 100%;
-      ${!depth &&
-        css `
-        border: ${borderWidth} solid ${colors.gray.light};
-        border-radius: ${borderRadius};
-      `}
-      ${depth &&
-        css `
-        border-block-start: ${hideBorders ? 'none' : `${borderWidth} dashed ${colors.gray.light}`};
-      `}
-    `;
-});
-StyledAssignmentContainer.defaultProps = defaultThemeProp;
 export const StyledAssignmentText = styled(Text)(({ theme }) => {
     return css `
     font-weight: ${theme.base['font-weight']['semi-bold']};
@@ -151,24 +128,20 @@ export const StyledLinkContainer = styled.div(({ theme: { base: { spacing } }, i
     `;
 });
 StyledLinkContainer.defaultProps = defaultThemeProp;
-export const StyledAssigneeContainer = styled.div(({ theme: { base: { spacing }, components: { icon: { size: { s } } } }, depth, isMediumOrAbove }) => {
+export const StyledAssigneeContainer = styled.div(({ theme: { base: { spacing }, components: { icon: { size: { s } } } }, depth }) => {
     const paddingInlineStart = depth
         ? `calc(1.5 * ${spacing} * ${depth} + ${s} + ${spacing})`
         : `calc(1.5 * ${spacing})`;
     return css `
-      padding-block: calc(0.5 * ${spacing});
       overflow: hidden;
       padding-inline-start: ${paddingInlineStart};
-      ${isMediumOrAbove &&
-        css `
-        padding: calc(0.5 * ${spacing});
-      `};
     `;
 });
 StyledAssigneeContainer.defaultProps = defaultThemeProp;
 export const StyledAssigneeText = styled(Button)(({ theme }) => {
     const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);
     return css `
+    max-width: 16ch;
     ${elipsisOverflow}
     font-size: ${fontSizes[theme.components.text.secondary['font-size']]};
     font-weight: ${theme.components.text.secondary['font-weight']};
@@ -199,4 +172,68 @@ export const StyledMetaIdStatusContainer = styled(MetaList)(({ theme: { base: {
   `;
 });
 StyledMetaIdStatusContainer.defaultProps = defaultThemeProp;
+export const StyledLabelContainer = styled.span(({ theme: { base: { spacing } } }) => {
+    return css `
+      padding-inline-end: calc(0.5 * ${spacing});
+    `;
+});
+StyledLabelContainer.defaultProps = defaultThemeProp;
+export const StyledTreeRoot = styled.ul(({ theme: { base: { 'border-radius': borderRadius, palette: { 'border-line': borderLine } }, components: { table: { body: { 'border-width': borderWidth } } } } }) => {
+    return css `
+      list-style-type: none;
+      /* stylelint-disable-next-line unit-allowed-list */
+      max-height: 50dvh;
+      overflow-y: auto;
+      border: ${borderWidth} solid ${borderLine};
+      border-radius: ${borderRadius};
+
+      & > li:first-child {
+        border-block-start: none;
+        border-start-start-radius: ${borderRadius};
+        border-start-end-radius: ${borderRadius};
+        & > div,
+        & > div:focus-within {
+          border-start-start-radius: ${borderRadius};
+          border-start-end-radius: ${borderRadius};
+        }
+      }
+    `;
+});
+StyledTreeRoot.defaultProps = defaultThemeProp;
+export const StyledNode = styled.li(({ theme: { base: { shadow, 'border-radius': borderRadius, palette: { 'secondary-background': secondaryBackground, 'primary-background': primaryBackground, 'border-line': borderLine } }, components: { table: { body: { 'border-width': borderWidth } } } }, isFocus, lastNode, isChild, depth }) => {
+    return css `
+      list-style: none;
+      border-block-start: ${borderWidth} dashed ${borderLine};
+      outline: none;
+      padding: ${depth <= 1 ? borderWidth : '0'};
+      background-color: ${isChild ? secondaryBackground : primaryBackground};
+      ${isFocus &&
+        css `
+        &:focus {
+          position: relative;
+        }
+        &:focus > div {
+          box-shadow: ${shadow['focus-solid']};
+        }
+      `}
+
+      ${lastNode &&
+        css `
+        border-end-start-radius: ${borderRadius};
+        border-end-end-radius: ${borderRadius};
+        & > div,
+        & > div:focus-within {
+          border-end-start-radius: ${borderRadius};
+          border-end-end-radius: ${borderRadius};
+        }
+      `};
+    `;
+});
+StyledNode.defaultProps = defaultThemeProp;
+export const StyledAssignmentItemMetaList = styled(MetaList)(({ theme: { base: { spacing } } }) => {
+    return css `
+    padding: calc(0.5 * ${spacing});
+  `;
+});
+StyledAssignmentItemMetaList.defaultProps = defaultThemeProp;
 //# sourceMappingURL=Assignments.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Assignments.styles.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/Assignments.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n  Grid,\n  Button,\n  Card,\n  defaultThemeProp,\n  StyledIcon,\n  ExpandCollapse,\n  useDirection,\n  Text,\n  MetaList,\n  SummaryItem,\n  calculateFontSize,\n  StyledText\n} from '@pega/cosmos-react-core';\nimport { elipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport type { FontSize } from '@pega/cosmos-react-core';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\n\nexport const StyledExpandButton = styled(Button)(({\n  theme: {\n    base: { animation }\n  }\n}) => {\n  const { rtl } = useDirection();\n  return css`\n    margin: 0;\n\n    ${StyledIcon} {\n      transition: transform ${animation.speed} ${animation.timing.ease};\n    }\n\n    &[aria-expanded='true'] ${StyledIcon} {\n      transform: rotate(90deg);\n    }\n\n    &[aria-expanded='false'] ${StyledIcon} {\n      transform: rotate(${rtl ? 180 : 0}deg);\n    }\n\n    &:hover,\n    &:active {\n      text-decoration: none;\n    }\n  `;\n});\n\nStyledExpandButton.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapse = styled(ExpandCollapse)(({\n  theme: {\n    base: { spacing }\n  }\n}) => {\n  return css`\n    padding-inline: calc(${spacing} * 2);\n  `;\n});\n\nStyledExpandCollapse.defaultProps = defaultThemeProp;\n\nexport const StyledParentExpandCollapse = styled.div(() => {\n  const assignmentHeight = '50dvh';\n  return css`\n    max-height: ${assignmentHeight};\n    overflow-y: auto;\n  `;\n});\n\nStyledParentExpandCollapse.defaultProps = defaultThemeProp;\n\nexport const StyledAssignmentItem: typeof Grid = styled(Grid)<{\n  hideBorders?: boolean;\n}>(({\n  theme: {\n    base: { spacing, colors },\n    components: {\n      table: {\n        body: { 'border-width': borderWidth }\n      }\n    }\n  },\n  hideBorders\n}) => {\n  return css`\n    padding-inline-end: calc(2 * ${spacing});\n    padding-block: calc(0.5 * ${spacing});\n    border-block-start: ${borderWidth} dashed ${colors.gray.light};\n    ${hideBorders &&\n    css`\n      border-block-start: none;\n    `};\n  `;\n});\nStyledAssignmentItem.defaultProps = defaultThemeProp;\n\nexport const StyledProcessContainer = styled.div<{ depth?: number }>(\n  ({\n    depth,\n    theme: {\n      base: { spacing },\n      components: {\n        icon: {\n          size: { s }\n        }\n      }\n    }\n  }) => {\n    const paddingInlineStart = depth\n      ? `calc(1.5 * ${spacing} * ${depth} + ${s} + ${spacing})`\n      : `calc(1.5 * ${spacing})`;\n\n    return css`\n      overflow: hidden;\n      padding-inline-start: ${paddingInlineStart};\n      grid-row-start: 1;\n      grid-row-end: 1;\n      ${StyledText} {\n        ${elipsisOverflow}\n      }\n    `;\n  }\n);\nStyledProcessContainer.defaultProps = defaultThemeProp;\n\nexport const StyledActionContainer = styled.div<{ isMediumOrAbove?: boolean }>(\n  ({ isMediumOrAbove }) => {\n    return css`\n      grid-row-start: 1;\n      grid-row-end: -1;\n      ${isMediumOrAbove &&\n      css`\n        grid-column-start: 4;\n        grid-column-end: -1;\n      `}\n    `;\n  }\n);\nStyledActionContainer.defaultProps = defaultThemeProp;\n\nexport const StyledHeaderContainer = styled.div<{ depth?: number }>(\n  ({\n    theme: {\n      base: {\n        spacing,\n        palette: { 'secondary-background': secondaryBackground }\n      }\n    },\n    depth\n  }) => {\n    const paddingInlineStart = depth\n      ? `calc(1.5 * ${spacing} * ${depth})`\n      : `calc(1.5 * ${spacing})`;\n\n    return css`\n      padding-inline-start: ${paddingInlineStart};\n      padding-block: calc(0.5 * ${spacing});\n      background-color: ${secondaryBackground};\n    `;\n  }\n);\nStyledHeaderContainer.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryItem = styled(SummaryItem)<{ indent: boolean }>(({\n  theme: {\n    base: { spacing },\n    components: {\n      icon: {\n        size: { s }\n      }\n    }\n  },\n  indent\n}) => {\n  return css`\n    ${indent &&\n    css`\n      padding-inline-start: calc(${s} + ${spacing});\n    `}\n  `;\n});\nStyledSummaryItem.defaultProps = defaultThemeProp;\n\nexport const StyledAssignments = styled(Card)<{ expanded?: boolean }>(({ theme, expanded }) => {\n  return css`\n    padding: calc(${theme.base.spacing} * 2);\n    box-shadow: ${expanded ? theme.base.shadow.low : 'none'};\n    &&& {\n      > ${StyledCardHeader} {\n        padding: 0;\n        padding-block-end: ${expanded ? `calc(${theme.base.spacing} * 2)` : 0};\n      }\n    }\n  `;\n});\n\nStyledAssignments.defaultProps = defaultThemeProp;\n\nexport const StyledAssignmentContainer = styled.div<{\n  depth?: number;\n  hideBorders?: boolean;\n}>(\n  ({\n    theme: {\n      base: { colors, 'border-radius': borderRadius },\n      components: {\n        table: {\n          body: { 'border-width': borderWidth }\n        }\n      }\n    },\n    depth,\n    hideBorders\n  }) => {\n    return css`\n      overflow: hidden;\n      width: 100%;\n      ${!depth &&\n      css`\n        border: ${borderWidth} solid ${colors.gray.light};\n        border-radius: ${borderRadius};\n      `}\n      ${depth &&\n      css`\n        border-block-start: ${hideBorders ? 'none' : `${borderWidth} dashed ${colors.gray.light}`};\n      `}\n    `;\n  }\n);\nStyledAssignmentContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAssignmentText = styled(Text)(({ theme }) => {\n  return css`\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n  `;\n});\nStyledAssignmentText.defaultProps = defaultThemeProp;\n\nexport const StyledLinkContainer = styled.div<{ isMediumOrAbove?: boolean }>(\n  ({\n    theme: {\n      base: { spacing }\n    },\n    isMediumOrAbove\n  }) => {\n    const caseNameWidth = '28rem';\n    return css`\n      ${elipsisOverflow};\n      padding: calc(0.5 * ${spacing});\n      padding-inline-end: calc(2 * ${spacing});\n      & > a > span {\n        width: 0;\n      }\n      ${isMediumOrAbove &&\n      css`\n        max-width: ${caseNameWidth};\n        padding-inline-end: calc(0.5 * ${spacing});\n      `}\n    `;\n  }\n);\nStyledLinkContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAssigneeContainer = styled.div<{ depth?: number; isMediumOrAbove?: boolean }>(\n  ({\n    theme: {\n      base: { spacing },\n      components: {\n        icon: {\n          size: { s }\n        }\n      }\n    },\n    depth,\n    isMediumOrAbove\n  }) => {\n    const paddingInlineStart = depth\n      ? `calc(1.5 * ${spacing} * ${depth} + ${s} + ${spacing})`\n      : `calc(1.5 * ${spacing})`;\n\n    return css`\n      padding-block: calc(0.5 * ${spacing});\n      overflow: hidden;\n      padding-inline-start: ${paddingInlineStart};\n      ${isMediumOrAbove &&\n      css`\n        padding: calc(0.5 * ${spacing});\n      `};\n    `;\n  }\n);\nStyledAssigneeContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAssigneeText = styled(Button)(({ theme }) => {\n  const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  return css`\n    ${elipsisOverflow}\n    font-size: ${fontSizes[theme.components.text.secondary['font-size'] as FontSize]};\n    font-weight: ${theme.components.text.secondary['font-weight']};\n  `;\n});\nStyledAssigneeText.defaultProps = defaultThemeProp;\n\nexport const StyledMetaListContainer = styled(MetaList)<{\n  indent: boolean;\n}>(({\n  theme: {\n    base: { spacing },\n    components: {\n      icon: {\n        size: { s }\n      }\n    }\n  },\n  indent\n}) => {\n  return css`\n    ${indent &&\n    css`\n      padding-inline-start: calc(${s} + ${spacing});\n    `}\n    width: 100%;\n    flex-wrap: nowrap;\n    & > li:nth-child(1) {\n      flex-shrink: 1;\n    }\n    & > li:nth-child(2),\n    & > li:nth-child(3) {\n      flex-shrink: 0;\n    }\n  `;\n});\nStyledMetaListContainer.defaultProps = defaultThemeProp;\n\nexport const StyledMetaIdStatusContainer = styled(MetaList)(({\n  theme: {\n    base: { spacing }\n  }\n}) => {\n  return css`\n    padding-inline: calc(0.5 * ${spacing});\n  `;\n});\nStyledMetaIdStatusContainer.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"Assignments.styles.js","sourceRoot":"","sources":["../../../src/components/HierarchicalAssignments/Assignments.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  Card,\n  defaultThemeProp,\n  StyledIcon,\n  useDirection,\n  MetaList,\n  SummaryItem,\n  calculateFontSize,\n  StyledText,\n  Text,\n  ExpandCollapse\n} from '@pega/cosmos-react-core';\nimport { elipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport type { FontSize } from '@pega/cosmos-react-core';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\n\nexport const StyledExpandButton = styled(Button)(({\n  theme: {\n    base: { animation }\n  }\n}) => {\n  const { rtl } = useDirection();\n  return css`\n    margin: 0;\n\n    ${StyledIcon} {\n      transition: transform ${animation.speed} ${animation.timing.ease};\n    }\n\n    &[aria-expanded='true'] ${StyledIcon} {\n      transform: rotate(90deg);\n    }\n\n    &[aria-expanded='false'] ${StyledIcon} {\n      transform: rotate(${rtl ? 180 : 0}deg);\n    }\n\n    &:hover,\n    &:active {\n      text-decoration: none;\n    }\n  `;\n});\n\nStyledExpandButton.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollpase = styled(ExpandCollapse)(({\n  theme: {\n    base: { spacing }\n  }\n}) => {\n  return css`\n    margin-block-start: calc(0.125 * ${spacing});\n  `;\n});\nStyledExpandCollpase.defaultProps = defaultThemeProp;\n\nexport const StyledAssignmentItem = styled.div<{\n  hideBorders?: boolean;\n}>(\n  ({\n    theme: {\n      base: { spacing }\n    }\n  }) => {\n    return css`\n      padding-inline-end: calc(2 * ${spacing});\n      padding-block: calc(0.5 * ${spacing});\n    `;\n  }\n);\nStyledAssignmentItem.defaultProps = defaultThemeProp;\n\nexport const StyledProcessContainer = styled.div<{ depth?: number }>(\n  ({\n    depth,\n    theme: {\n      base: { spacing },\n      components: {\n        icon: {\n          size: { s }\n        }\n      }\n    }\n  }) => {\n    const paddingInlineStart = depth\n      ? `calc(1.5 * ${spacing} * ${depth} + ${s} + ${spacing})`\n      : `calc(1.5 * ${spacing})`;\n\n    return css`\n      overflow: hidden;\n      padding-inline-start: ${paddingInlineStart};\n      grid-row-start: 1;\n      grid-row-end: 1;\n      height: 100%;\n      ${StyledText} {\n        ${elipsisOverflow}\n        padding-inline: calc(0.5 * ${spacing});\n      }\n    `;\n  }\n);\nStyledProcessContainer.defaultProps = defaultThemeProp;\n\nexport const StyledActionContainer = styled.div<{ isMediumOrAbove?: boolean }>(\n  ({ isMediumOrAbove }) => {\n    return css`\n      min-width: 3.313rem;\n      grid-row-start: 1;\n      grid-row-end: -1;\n      ${isMediumOrAbove &&\n      css`\n        grid-column-start: 4;\n        grid-column-end: -1;\n      `}\n    `;\n  }\n);\nStyledActionContainer.defaultProps = defaultThemeProp;\n\nexport const StyledHeaderContainer = styled.div<{ depth?: number }>(\n  ({\n    theme: {\n      base: { spacing }\n    },\n    depth\n  }) => {\n    const paddingInlineStart = depth\n      ? `calc(1.5 * ${spacing} * ${depth})`\n      : `calc(1.5 * ${spacing})`;\n\n    return css`\n      padding-inline-start: ${paddingInlineStart};\n      padding-block: calc(0.5 * ${spacing});\n    `;\n  }\n);\nStyledHeaderContainer.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryItem = styled(SummaryItem)<{ indent: boolean }>(({\n  theme: {\n    base: { spacing },\n    components: {\n      icon: {\n        size: { s }\n      }\n    }\n  },\n  indent\n}) => {\n  return css`\n    ${indent &&\n    css`\n      padding-inline-start: calc(${s} + ${spacing});\n    `}\n  `;\n});\nStyledSummaryItem.defaultProps = defaultThemeProp;\n\nexport const StyledAssignments = styled(Card)<{ expanded?: boolean }>(({ theme, expanded }) => {\n  return css`\n    padding: calc(${theme.base.spacing} * 2);\n\n    &:has(form) {\n      box-shadow: ${expanded ? theme.base.shadow.low : 'none'};\n    }\n\n    &&&& {\n      > ${StyledCardHeader} {\n        padding: 0;\n        padding-block-end: ${expanded ? `calc(${theme.base.spacing} * 2)` : 0};\n      }\n    }\n  `;\n});\n\nStyledAssignments.defaultProps = defaultThemeProp;\n\nexport const StyledAssignmentText = styled(Text)(({ theme }) => {\n  return css`\n    font-weight: ${theme.base['font-weight']['semi-bold']};\n  `;\n});\nStyledAssignmentText.defaultProps = defaultThemeProp;\n\nexport const StyledLinkContainer = styled.div<{ isMediumOrAbove?: boolean }>(\n  ({\n    theme: {\n      base: { spacing }\n    },\n    isMediumOrAbove\n  }) => {\n    const caseNameWidth = '28rem';\n    return css`\n      ${elipsisOverflow};\n      padding: calc(0.5 * ${spacing});\n      padding-inline-end: calc(2 * ${spacing});\n      & > a > span {\n        width: 0;\n      }\n      ${isMediumOrAbove &&\n      css`\n        max-width: ${caseNameWidth};\n        padding-inline-end: calc(0.5 * ${spacing});\n      `}\n    `;\n  }\n);\nStyledLinkContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAssigneeContainer = styled.div<{ depth?: number }>(\n  ({\n    theme: {\n      base: { spacing },\n      components: {\n        icon: {\n          size: { s }\n        }\n      }\n    },\n    depth\n  }) => {\n    const paddingInlineStart = depth\n      ? `calc(1.5 * ${spacing} * ${depth} + ${s} + ${spacing})`\n      : `calc(1.5 * ${spacing})`;\n\n    return css`\n      overflow: hidden;\n      padding-inline-start: ${paddingInlineStart};\n    `;\n  }\n);\nStyledAssigneeContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAssigneeText = styled(Button)(({ theme }) => {\n  const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  return css`\n    max-width: 16ch;\n    ${elipsisOverflow}\n    font-size: ${fontSizes[theme.components.text.secondary['font-size'] as FontSize]};\n    font-weight: ${theme.components.text.secondary['font-weight']};\n  `;\n});\nStyledAssigneeText.defaultProps = defaultThemeProp;\n\nexport const StyledMetaListContainer = styled(MetaList)<{\n  indent: boolean;\n}>(({\n  theme: {\n    base: { spacing },\n    components: {\n      icon: {\n        size: { s }\n      }\n    }\n  },\n  indent\n}) => {\n  return css`\n    ${indent &&\n    css`\n      padding-inline-start: calc(${s} + ${spacing});\n    `}\n    width: 100%;\n    flex-wrap: nowrap;\n    & > li:nth-child(1) {\n      flex-shrink: 1;\n    }\n    & > li:nth-child(2),\n    & > li:nth-child(3) {\n      flex-shrink: 0;\n    }\n  `;\n});\nStyledMetaListContainer.defaultProps = defaultThemeProp;\n\nexport const StyledMetaIdStatusContainer = styled(MetaList)(({\n  theme: {\n    base: { spacing }\n  }\n}) => {\n  return css`\n    padding-inline: calc(0.5 * ${spacing});\n  `;\n});\nStyledMetaIdStatusContainer.defaultProps = defaultThemeProp;\n\nexport const StyledLabelContainer = styled.span(\n  ({\n    theme: {\n      base: { spacing }\n    }\n  }) => {\n    return css`\n      padding-inline-end: calc(0.5 * ${spacing});\n    `;\n  }\n);\nStyledLabelContainer.defaultProps = defaultThemeProp;\n\nexport const StyledTreeRoot = styled.ul(\n  ({\n    theme: {\n      base: {\n        'border-radius': borderRadius,\n        palette: { 'border-line': borderLine }\n      },\n      components: {\n        table: {\n          body: { 'border-width': borderWidth }\n        }\n      }\n    }\n  }) => {\n    return css`\n      list-style-type: none;\n      /* stylelint-disable-next-line unit-allowed-list */\n      max-height: 50dvh;\n      overflow-y: auto;\n      border: ${borderWidth} solid ${borderLine};\n      border-radius: ${borderRadius};\n\n      & > li:first-child {\n        border-block-start: none;\n        border-start-start-radius: ${borderRadius};\n        border-start-end-radius: ${borderRadius};\n        & > div,\n        & > div:focus-within {\n          border-start-start-radius: ${borderRadius};\n          border-start-end-radius: ${borderRadius};\n        }\n      }\n    `;\n  }\n);\nStyledTreeRoot.defaultProps = defaultThemeProp;\n\nexport const StyledNode = styled.li<{\n  isFocus?: boolean;\n  lastNode?: boolean;\n  isChild?: boolean;\n  depth: number;\n}>(\n  ({\n    theme: {\n      base: {\n        shadow,\n        'border-radius': borderRadius,\n        palette: {\n          'secondary-background': secondaryBackground,\n          'primary-background': primaryBackground,\n          'border-line': borderLine\n        }\n      },\n      components: {\n        table: {\n          body: { 'border-width': borderWidth }\n        }\n      }\n    },\n    isFocus,\n    lastNode,\n    isChild,\n    depth\n  }) => {\n    return css`\n      list-style: none;\n      border-block-start: ${borderWidth} dashed ${borderLine};\n      outline: none;\n      padding: ${depth <= 1 ? borderWidth : '0'};\n      background-color: ${isChild ? secondaryBackground : primaryBackground};\n      ${isFocus &&\n      css`\n        &:focus {\n          position: relative;\n        }\n        &:focus > div {\n          box-shadow: ${shadow['focus-solid']};\n        }\n      `}\n\n      ${lastNode &&\n      css`\n        border-end-start-radius: ${borderRadius};\n        border-end-end-radius: ${borderRadius};\n        & > div,\n        & > div:focus-within {\n          border-end-start-radius: ${borderRadius};\n          border-end-end-radius: ${borderRadius};\n        }\n      `};\n    `;\n  }\n);\nStyledNode.defaultProps = defaultThemeProp;\n\nexport const StyledAssignmentItemMetaList = styled(MetaList)(({\n  theme: {\n    base: { spacing }\n  }\n}) => {\n  return css`\n    padding: calc(0.5 * ${spacing});\n  `;\n});\nStyledAssignmentItemMetaList.defaultProps = defaultThemeProp;\n"]}