@pega/cosmos-react-work 10.0.0-build.1.9 → 10.0.0-build.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/lib/components/CaseView/CaseView.d.ts.map +1 -1
  2. package/lib/components/CaseView/CaseView.js +5 -11
  3. package/lib/components/CaseView/CaseView.js.map +1 -1
  4. package/lib/components/CaseView/CaseView.styles.d.ts.map +1 -1
  5. package/lib/components/CaseView/CaseView.styles.js +7 -20
  6. package/lib/components/CaseView/CaseView.styles.js.map +1 -1
  7. package/lib/components/Details/Details.styles.js +5 -5
  8. package/lib/components/Details/Details.styles.js.map +1 -1
  9. package/lib/components/GenAICoach/GenAICoach.styles.d.ts.map +1 -1
  10. package/lib/components/GenAICoach/GenAICoach.styles.js +3 -4
  11. package/lib/components/GenAICoach/GenAICoach.styles.js.map +1 -1
  12. package/lib/components/InteractionNotification/InteractionNotification.d.ts +2 -2
  13. package/lib/components/InteractionNotification/InteractionNotification.d.ts.map +1 -1
  14. package/lib/components/InteractionNotification/InteractionNotification.js +6 -4
  15. package/lib/components/InteractionNotification/InteractionNotification.js.map +1 -1
  16. package/lib/components/SearchResults/SearchResults.d.ts.map +1 -1
  17. package/lib/components/SearchResults/SearchResults.js +4 -2
  18. package/lib/components/SearchResults/SearchResults.js.map +1 -1
  19. package/lib/components/SearchResults/SearchResults.styles.js +3 -3
  20. package/lib/components/SearchResults/SearchResults.styles.js.map +1 -1
  21. package/lib/components/Shortcuts/Shortcuts.d.ts.map +1 -1
  22. package/lib/components/Shortcuts/Shortcuts.js +5 -8
  23. package/lib/components/Shortcuts/Shortcuts.js.map +1 -1
  24. package/lib/components/Shortcuts/Shortcuts.styles.d.ts +4 -7
  25. package/lib/components/Shortcuts/Shortcuts.styles.d.ts.map +1 -1
  26. package/lib/components/Shortcuts/Shortcuts.styles.js +29 -32
  27. package/lib/components/Shortcuts/Shortcuts.styles.js.map +1 -1
  28. package/lib/components/Stages/Stages.d.ts +4 -2
  29. package/lib/components/Stages/Stages.d.ts.map +1 -1
  30. package/lib/components/Stages/Stages.js +99 -88
  31. package/lib/components/Stages/Stages.js.map +1 -1
  32. package/lib/components/Stages/Stages.styles.d.ts +14 -0
  33. package/lib/components/Stages/Stages.styles.d.ts.map +1 -1
  34. package/lib/components/Stages/Stages.styles.js +179 -39
  35. package/lib/components/Stages/Stages.styles.js.map +1 -1
  36. package/lib/components/Stages/Stages.test-ids.d.ts +2 -0
  37. package/lib/components/Stages/Stages.test-ids.d.ts.map +1 -0
  38. package/lib/components/Stages/Stages.test-ids.js +3 -0
  39. package/lib/components/Stages/Stages.test-ids.js.map +1 -0
  40. package/lib/components/Stages/Stages.types.d.ts +3 -3
  41. package/lib/components/Stages/Stages.types.d.ts.map +1 -1
  42. package/lib/components/Stages/Stages.types.js.map +1 -1
  43. package/lib/components/Stages/index.d.ts +1 -0
  44. package/lib/components/Stages/index.d.ts.map +1 -1
  45. package/lib/components/Stages/index.js +1 -0
  46. package/lib/components/Stages/index.js.map +1 -1
  47. package/lib/components/Stakeholders/Stakeholders.d.ts.map +1 -1
  48. package/lib/components/Stakeholders/Stakeholders.js +2 -2
  49. package/lib/components/Stakeholders/Stakeholders.js.map +1 -1
  50. package/lib/components/Stakeholders/Stakeholders.types.d.ts +1 -1
  51. package/lib/components/Stakeholders/Stakeholders.types.d.ts.map +1 -1
  52. package/lib/components/Stakeholders/Stakeholders.types.js.map +1 -1
  53. package/lib/components/Tasks/TaskCard.d.ts +8 -0
  54. package/lib/components/Tasks/TaskCard.d.ts.map +1 -0
  55. package/lib/components/Tasks/TaskCard.js +39 -0
  56. package/lib/components/Tasks/TaskCard.js.map +1 -0
  57. package/lib/components/Tasks/TaskCards.d.ts +9 -0
  58. package/lib/components/Tasks/TaskCards.d.ts.map +1 -0
  59. package/lib/components/Tasks/TaskCards.js +39 -0
  60. package/lib/components/Tasks/TaskCards.js.map +1 -0
  61. package/lib/components/Tasks/TaskList.d.ts +11 -1
  62. package/lib/components/Tasks/TaskList.d.ts.map +1 -1
  63. package/lib/components/Tasks/TaskList.js +8 -5
  64. package/lib/components/Tasks/TaskList.js.map +1 -1
  65. package/lib/components/Tasks/Tasks.d.ts +40 -5
  66. package/lib/components/Tasks/Tasks.d.ts.map +1 -1
  67. package/lib/components/Tasks/Tasks.js +5 -1
  68. package/lib/components/Tasks/Tasks.js.map +1 -1
  69. package/lib/components/Tasks/Tasks.test-ids.d.ts +1 -1
  70. package/lib/components/Tasks/Tasks.test-ids.d.ts.map +1 -1
  71. package/lib/components/Tasks/Tasks.test-ids.js +1 -1
  72. package/lib/components/Tasks/Tasks.test-ids.js.map +1 -1
  73. package/lib/components/Tasks/index.d.ts +1 -1
  74. package/lib/components/Tasks/index.d.ts.map +1 -1
  75. package/lib/components/Tasks/index.js.map +1 -1
  76. package/package.json +3 -3
@@ -1,5 +1,5 @@
1
1
  import type { ReactNode, Ref } from 'react';
2
- import type { BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';
2
+ import type { BaseProps, NoChildrenProp, TestIdProp } from '@pega/cosmos-react-core';
3
3
  export interface StepProps {
4
4
  /** Step name - either text or link. */
5
5
  name: ReactNode;
@@ -20,7 +20,7 @@ export interface StageProps {
20
20
  /** Steps data defined in this stage. The stage is treated as not loaded if undefined. */
21
21
  steps?: StepProps[];
22
22
  }
23
- export interface StagesProps extends BaseProps, NoChildrenProp {
23
+ export interface StagesProps extends BaseProps, NoChildrenProp, TestIdProp {
24
24
  /** List of objects describing each stage and their state. */
25
25
  stages: StageProps[];
26
26
  /** Current stage id. */
@@ -38,7 +38,7 @@ export interface StagesProps extends BaseProps, NoChildrenProp {
38
38
  */
39
39
  readOnly?: boolean;
40
40
  /** Ref to the stages container. */
41
- ref?: Ref<HTMLDivElement>;
41
+ ref?: Ref<HTMLOListElement>;
42
42
  }
43
43
  export type StageStatus = 'completed' | 'current' | 'pending';
44
44
  //# sourceMappingURL=Stages.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Stages.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAEzE,MAAM,WAAW,SAAS;IACxB,uCAAuC;IACvC,IAAI,EAAE,SAAS,CAAC;IAChB,wDAAwD;IACxD,SAAS,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,UAAU;IACzB,kBAAkB;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,yBAAyB;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,wEAAwE;IACxE,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC;IAC9B,uDAAuD;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,yFAAyF;IACzF,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC;CACrB;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc;IAC5D,6DAA6D;IAC7D,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,wBAAwB;IACxB,OAAO,EAAE,MAAM,CAAC;IAChB,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC;IACnD;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,SAAS,GAAG,SAAS,CAAC"}
1
+ {"version":3,"file":"Stages.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErF,MAAM,WAAW,SAAS;IACxB,uCAAuC;IACvC,IAAI,EAAE,SAAS,CAAC;IAChB,wDAAwD;IACxD,SAAS,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,MAAM,WAAW,UAAU;IACzB,kBAAkB;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,yBAAyB;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,wEAAwE;IACxE,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC;IAC9B,uDAAuD;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,yFAAyF;IACzF,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC;CACrB;AAED,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IACxE,6DAA6D;IAC7D,MAAM,EAAE,UAAU,EAAE,CAAC;IACrB,wBAAwB;IACxB,OAAO,EAAE,MAAM,CAAC;IAChB,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC;IACnD;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,SAAS,GAAG,SAAS,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Stages.types.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { BaseProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nexport interface StepProps {\n /** Step name - either text or link. */\n name: ReactNode;\n /** Flag determining whether step has been completed. */\n completed: boolean;\n /** Unique step identifier. */\n id: string;\n}\n\nexport interface StageProps {\n /** Stage name. */\n name: string;\n /** Unique identifier. */\n id: string;\n /** Date of completion. Accepts date object, ISO string or timestamp. */\n date?: Date | string | number;\n /** Flag determining whether the stage is completed. */\n completed: boolean;\n /** Steps data defined in this stage. The stage is treated as not loaded if undefined. */\n steps?: StepProps[];\n}\n\nexport interface StagesProps extends BaseProps, NoChildrenProp {\n /** List of objects describing each stage and their state. */\n stages: StageProps[];\n /** Current stage id. */\n current: string;\n /** Case title (label) */\n caseTitle?: string;\n /**\n * Callback invoked when stage details are requested to show.\n * @param stages stages' ids requested to load details for.\n */\n onLoadStage?: (stages: StageProps['id'][]) => void;\n /**\n * Render stages in read-only mode.\n * @default false\n */\n readOnly?: boolean;\n /** Ref to the stages container. */\n ref?: Ref<HTMLDivElement>;\n}\n\nexport type StageStatus = 'completed' | 'current' | 'pending';\n"]}
1
+ {"version":3,"file":"Stages.types.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { BaseProps, NoChildrenProp, TestIdProp } from '@pega/cosmos-react-core';\n\nexport interface StepProps {\n /** Step name - either text or link. */\n name: ReactNode;\n /** Flag determining whether step has been completed. */\n completed: boolean;\n /** Unique step identifier. */\n id: string;\n}\n\nexport interface StageProps {\n /** Stage name. */\n name: string;\n /** Unique identifier. */\n id: string;\n /** Date of completion. Accepts date object, ISO string or timestamp. */\n date?: Date | string | number;\n /** Flag determining whether the stage is completed. */\n completed: boolean;\n /** Steps data defined in this stage. The stage is treated as not loaded if undefined. */\n steps?: StepProps[];\n}\n\nexport interface StagesProps extends BaseProps, NoChildrenProp, TestIdProp {\n /** List of objects describing each stage and their state. */\n stages: StageProps[];\n /** Current stage id. */\n current: string;\n /** Case title (label) */\n caseTitle?: string;\n /**\n * Callback invoked when stage details are requested to show.\n * @param stages stages' ids requested to load details for.\n */\n onLoadStage?: (stages: StageProps['id'][]) => void;\n /**\n * Render stages in read-only mode.\n * @default false\n */\n readOnly?: boolean;\n /** Ref to the stages container. */\n ref?: Ref<HTMLOListElement>;\n}\n\nexport type StageStatus = 'completed' | 'current' | 'pending';\n"]}
@@ -1,3 +1,4 @@
1
1
  export { default } from './Stages';
2
2
  export type { StagesProps } from './Stages.types';
3
+ export { getStagesTestIds } from './Stages.test-ids';
3
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC"}
@@ -1,2 +1,3 @@
1
1
  export { default } from './Stages';
2
+ export { getStagesTestIds } from './Stages.test-ids';
2
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Stages/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default } from './Stages';\nexport type { StagesProps } from './Stages.types';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Stages/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAEnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { default } from './Stages';\nexport type { StagesProps } from './Stages.types';\nexport { getStagesTestIds } from './Stages.test-ids';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAEV,+BAA+B,EAKhC,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAOpE,QAAA,MAAM,YAAY,EAAE,+BAA+B,CAAC,iBAAiB,CAkSpE,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAEV,+BAA+B,EAKhC,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAOpE,QAAA,MAAM,YAAY,EAAE,+BAA+B,CAAC,iBAAiB,CAmSpE,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -5,7 +5,7 @@ import { SummaryList, useI18n, Button, ViewAll, Modal, useModalManager, defaultT
5
5
  import StakeholderForm from './StakeholderForm';
6
6
  const StyledStakeholders = styled(SummaryList) ``;
7
7
  StyledStakeholders.defaultProps = defaultThemeProp;
8
- const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count, loading, onAddNew, form, onViewAll, viewAll, error, ...restProps }, ref) {
8
+ const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count, loading, onAddNew, form, onViewAll, viewAll, error, name, ...restProps }, ref) {
9
9
  const { create: createModal } = useModalManager();
10
10
  const t = useI18n();
11
11
  const theme = useTheme();
@@ -192,7 +192,7 @@ const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count,
192
192
  }
193
193
  : {
194
194
  name: 'person'
195
- }, name: t('view_stakeholders'), headingTag: 'h3', loading: loading, count: count, error: error, items: mergeItemActions(itemsProp.slice(0, 3)), actions: onAddNew
195
+ }, name: name || t('view_stakeholders'), headingTag: 'h3', loading: loading, count: count, error: error, items: mergeItemActions(itemsProp.slice(0, 3)), actions: onAddNew
196
196
  ? [
197
197
  {
198
198
  text: t('add'),
@@ -1 +1 @@
1
- {"version":3,"file":"Stakeholders.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect, useState, useCallback } from 'react';\nimport type { PropsWithoutRef, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport {\n SummaryList,\n useI18n,\n Button,\n ViewAll,\n Modal,\n useModalManager,\n defaultThemeProp,\n colorIconMapping,\n useTheme,\n getFocusables\n} from '@pega/cosmos-react-core';\nimport type {\n Action,\n ForwardRefForwardPropsComponent,\n ModalMethods,\n ModalProps,\n OmitStrict,\n SummaryListProps\n} from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nStyledStakeholders.defaultProps = defaultThemeProp;\n\nconst Stakeholders: ForwardRefForwardPropsComponent<StakeholdersProps> = forwardRef(\n function Stakeholders(\n {\n items: itemsProp,\n count,\n loading,\n onAddNew,\n form,\n onViewAll,\n viewAll,\n error,\n ...restProps\n }: PropsWithoutRef<StakeholdersProps>,\n ref: StakeholdersProps['ref']\n ) {\n const { create: createModal } = useModalManager();\n const t = useI18n();\n const theme = useTheme();\n const modalMethods = useRef<ModalMethods>();\n const [mode, setMode] = useState<undefined | 'add' | 'viewAll' | 'edit' | 'viewAllEdit'>();\n const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n const progressMsgRef = useRef(t('loading'));\n const viewAllRef = useRef<HTMLDivElement>(null);\n const editIDRef = useRef<string | null>();\n const [triedToReturnFocus, setTriedToReturnFocus] = useState(false);\n\n // Why? Don't think this should trigger a re-render. We just need the value when we invoke callback props.\n const selectedRoleNameRef = useRef<Role['name'] | undefined>();\n // Setter for the ref. Avoids a re-render.\n const setSelectedRoleNameRef = useCallback((selectedRoleName?: Role['name']) => {\n selectedRoleNameRef.current = selectedRoleName;\n }, []);\n\n // This function merges the pre-defined actions(add & edit) to the item object.\n const mergeItemActions = (\n items: StakeholdersProps['items'] | NonNullable<StakeholdersProps['viewAll']>['items']\n ): SummaryListProps['items'] => {\n return items.map(({ id, onEdit, onRemove, ...rest }) => {\n let itemActions: Action[] = [];\n\n if (onEdit) {\n itemActions = [\n {\n id: 'edit',\n text: t('edit'),\n icon: 'pencil',\n onClick: () => {\n setMode(mode === 'viewAll' ? 'viewAllEdit' : 'edit');\n onEdit?.();\n editIDRef.current = id;\n }\n }\n ];\n }\n\n if (onRemove) {\n itemActions = [\n ...itemActions,\n {\n id: 'remove',\n text: t('remove'),\n icon: 'trash',\n onClick: () => {\n onRemove?.();\n }\n }\n ];\n }\n\n return {\n ...rest,\n id,\n actions: itemActions,\n // Return focus to the element which initiated edit\n actionsRef: el => {\n if (!el || !editIDRef.current) return;\n setTriedToReturnFocus(true);\n if (id === editIDRef.current) {\n el.focus();\n editIDRef.current = null;\n }\n }\n };\n });\n };\n\n // Fallback focus handling for edit\n useEffect(() => {\n if (!triedToReturnFocus) return;\n if (editIDRef.current) {\n getFocusables(viewAllRef)[0]?.focus();\n editIDRef.current = null;\n }\n setTriedToReturnFocus(false);\n }, [triedToReturnFocus]);\n\n let formContent: ReactNode = null;\n if (mode === 'add' || mode === 'edit' || mode === 'viewAllEdit') {\n formContent = (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n banners={form.banners}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n );\n }\n\n // Actions used for add, edit, and viewAll-editing in the modal.\n let formActions: ReactNode = null;\n if (mode === 'add' || mode === 'edit' || mode === 'viewAllEdit') {\n const closeForm = () => {\n if (mode === 'viewAllEdit') {\n // Go back to the viewAll list; keep the modal open.\n setMode('viewAll');\n form.onAfterClose?.();\n progressMsgRef.current = t('loading');\n } else {\n modalMethods.current?.dismiss();\n }\n };\n\n formActions = (\n <>\n <Button\n disabled={form.loading}\n onClick={() => {\n form.onDismiss({ closeForm });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={form.loading}\n type='submit'\n variant='primary'\n onClick={() => {\n progressMsgRef.current = t('submitting');\n form.onSubmit({\n selectedRoleName: selectedRoleNameRef.current,\n closeForm\n });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n // Content for the modal: add form, edit form, viewAll list, or edit form within viewAll.\n let modalContent: ReactNode = null;\n if (mode === 'add' || mode === 'edit') modalContent = formContent;\n\n if (mode === 'viewAll' || mode === 'viewAllEdit') {\n if (mode === 'viewAllEdit') {\n modalContent = formContent;\n } else if (!viewAll.loading) {\n modalContent = (\n <ViewAll\n name={t('view_stakeholders')}\n items={mergeItemActions(viewAll.items)}\n actions={[\n {\n id: 'addStakeHolder',\n text: 'Add new',\n onClick: () => {\n setMode('add');\n onAddNew?.();\n }\n }\n ]}\n searchInputProps={\n viewAll.onSearch\n ? {\n value: viewAllSearchValue,\n onSearchChange: (value: string) => {\n setViewAllSearchValue(value);\n viewAll?.onSearch?.(value);\n }\n }\n : undefined\n }\n ref={viewAllRef}\n />\n );\n }\n }\n\n useEffect(() => {\n if (!mode) {\n modalMethods.current = undefined;\n return;\n }\n\n const isEditingForm = mode === 'add' || mode === 'edit' || mode === 'viewAllEdit';\n\n let heading: string;\n if (mode === 'add') {\n heading = t('add_stakeholders');\n } else if (mode === 'edit' || mode === 'viewAllEdit') {\n heading = t('edit_stakeholder');\n } else {\n heading = t('view_stakeholders');\n }\n\n const modalProps: OmitStrict<ModalProps, 'onAfterClose'> = {\n heading,\n progress:\n (isEditingForm && form.loading) || (mode === 'viewAll' && viewAll.loading)\n ? { message: progressMsgRef.current }\n : undefined,\n count: mode === 'viewAll' ? count : undefined,\n children: modalContent,\n actions: isEditingForm ? formActions : undefined,\n onRequestDismiss:\n form.loading && progressMsgRef.current === t('submitting') ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n onAfterClose: () => {\n if (mode === 'add' || mode === 'edit' || mode === 'viewAllEdit') {\n form.onAfterClose?.();\n }\n if (mode === 'viewAll' || mode === 'viewAllEdit') {\n setViewAllSearchValue('');\n viewAll.onAfterClose?.();\n }\n\n progressMsgRef.current = t('loading');\n modalMethods.current = undefined;\n setMode(undefined);\n }\n });\n }\n }, [mode, form.loading, count, viewAll.loading, modalContent, formActions]);\n\n return (\n <StyledStakeholders\n {...restProps}\n ref={ref}\n icon={\n theme.components['case-view'].utilities['icon-color']\n ? {\n name: 'person',\n background: colorIconMapping(theme, 'person'),\n shape: 'circle'\n }\n : {\n name: 'person'\n }\n }\n name={t('view_stakeholders')}\n headingTag='h3'\n loading={loading}\n count={count}\n error={error}\n items={mergeItemActions(itemsProp.slice(0, 3))}\n actions={\n onAddNew\n ? [\n {\n text: t('add'),\n id: 'add_new',\n icon: 'plus',\n onClick() {\n setMode('add');\n onAddNew?.();\n }\n }\n ]\n : undefined\n }\n onViewAll={\n onViewAll && count && count > 3\n ? () => {\n setMode('viewAll');\n onViewAll?.();\n }\n : undefined\n }\n />\n );\n }\n);\n\nexport default Stakeholders;\n"]}
1
+ {"version":3,"file":"Stakeholders.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect, useState, useCallback } from 'react';\nimport type { PropsWithoutRef, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport {\n SummaryList,\n useI18n,\n Button,\n ViewAll,\n Modal,\n useModalManager,\n defaultThemeProp,\n colorIconMapping,\n useTheme,\n getFocusables\n} from '@pega/cosmos-react-core';\nimport type {\n Action,\n ForwardRefForwardPropsComponent,\n ModalMethods,\n ModalProps,\n OmitStrict,\n SummaryListProps\n} from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nStyledStakeholders.defaultProps = defaultThemeProp;\n\nconst Stakeholders: ForwardRefForwardPropsComponent<StakeholdersProps> = forwardRef(\n function Stakeholders(\n {\n items: itemsProp,\n count,\n loading,\n onAddNew,\n form,\n onViewAll,\n viewAll,\n error,\n name,\n ...restProps\n }: PropsWithoutRef<StakeholdersProps>,\n ref: StakeholdersProps['ref']\n ) {\n const { create: createModal } = useModalManager();\n const t = useI18n();\n const theme = useTheme();\n const modalMethods = useRef<ModalMethods>();\n const [mode, setMode] = useState<undefined | 'add' | 'viewAll' | 'edit' | 'viewAllEdit'>();\n const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n const progressMsgRef = useRef(t('loading'));\n const viewAllRef = useRef<HTMLDivElement>(null);\n const editIDRef = useRef<string | null>();\n const [triedToReturnFocus, setTriedToReturnFocus] = useState(false);\n\n // Why? Don't think this should trigger a re-render. We just need the value when we invoke callback props.\n const selectedRoleNameRef = useRef<Role['name'] | undefined>();\n // Setter for the ref. Avoids a re-render.\n const setSelectedRoleNameRef = useCallback((selectedRoleName?: Role['name']) => {\n selectedRoleNameRef.current = selectedRoleName;\n }, []);\n\n // This function merges the pre-defined actions(add & edit) to the item object.\n const mergeItemActions = (\n items: StakeholdersProps['items'] | NonNullable<StakeholdersProps['viewAll']>['items']\n ): SummaryListProps['items'] => {\n return items.map(({ id, onEdit, onRemove, ...rest }) => {\n let itemActions: Action[] = [];\n\n if (onEdit) {\n itemActions = [\n {\n id: 'edit',\n text: t('edit'),\n icon: 'pencil',\n onClick: () => {\n setMode(mode === 'viewAll' ? 'viewAllEdit' : 'edit');\n onEdit?.();\n editIDRef.current = id;\n }\n }\n ];\n }\n\n if (onRemove) {\n itemActions = [\n ...itemActions,\n {\n id: 'remove',\n text: t('remove'),\n icon: 'trash',\n onClick: () => {\n onRemove?.();\n }\n }\n ];\n }\n\n return {\n ...rest,\n id,\n actions: itemActions,\n // Return focus to the element which initiated edit\n actionsRef: el => {\n if (!el || !editIDRef.current) return;\n setTriedToReturnFocus(true);\n if (id === editIDRef.current) {\n el.focus();\n editIDRef.current = null;\n }\n }\n };\n });\n };\n\n // Fallback focus handling for edit\n useEffect(() => {\n if (!triedToReturnFocus) return;\n if (editIDRef.current) {\n getFocusables(viewAllRef)[0]?.focus();\n editIDRef.current = null;\n }\n setTriedToReturnFocus(false);\n }, [triedToReturnFocus]);\n\n let formContent: ReactNode = null;\n if (mode === 'add' || mode === 'edit' || mode === 'viewAllEdit') {\n formContent = (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n banners={form.banners}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n );\n }\n\n // Actions used for add, edit, and viewAll-editing in the modal.\n let formActions: ReactNode = null;\n if (mode === 'add' || mode === 'edit' || mode === 'viewAllEdit') {\n const closeForm = () => {\n if (mode === 'viewAllEdit') {\n // Go back to the viewAll list; keep the modal open.\n setMode('viewAll');\n form.onAfterClose?.();\n progressMsgRef.current = t('loading');\n } else {\n modalMethods.current?.dismiss();\n }\n };\n\n formActions = (\n <>\n <Button\n disabled={form.loading}\n onClick={() => {\n form.onDismiss({ closeForm });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={form.loading}\n type='submit'\n variant='primary'\n onClick={() => {\n progressMsgRef.current = t('submitting');\n form.onSubmit({\n selectedRoleName: selectedRoleNameRef.current,\n closeForm\n });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n // Content for the modal: add form, edit form, viewAll list, or edit form within viewAll.\n let modalContent: ReactNode = null;\n if (mode === 'add' || mode === 'edit') modalContent = formContent;\n\n if (mode === 'viewAll' || mode === 'viewAllEdit') {\n if (mode === 'viewAllEdit') {\n modalContent = formContent;\n } else if (!viewAll.loading) {\n modalContent = (\n <ViewAll\n name={t('view_stakeholders')}\n items={mergeItemActions(viewAll.items)}\n actions={[\n {\n id: 'addStakeHolder',\n text: 'Add new',\n onClick: () => {\n setMode('add');\n onAddNew?.();\n }\n }\n ]}\n searchInputProps={\n viewAll.onSearch\n ? {\n value: viewAllSearchValue,\n onSearchChange: (value: string) => {\n setViewAllSearchValue(value);\n viewAll?.onSearch?.(value);\n }\n }\n : undefined\n }\n ref={viewAllRef}\n />\n );\n }\n }\n\n useEffect(() => {\n if (!mode) {\n modalMethods.current = undefined;\n return;\n }\n\n const isEditingForm = mode === 'add' || mode === 'edit' || mode === 'viewAllEdit';\n\n let heading: string;\n if (mode === 'add') {\n heading = t('add_stakeholders');\n } else if (mode === 'edit' || mode === 'viewAllEdit') {\n heading = t('edit_stakeholder');\n } else {\n heading = t('view_stakeholders');\n }\n\n const modalProps: OmitStrict<ModalProps, 'onAfterClose'> = {\n heading,\n progress:\n (isEditingForm && form.loading) || (mode === 'viewAll' && viewAll.loading)\n ? { message: progressMsgRef.current }\n : undefined,\n count: mode === 'viewAll' ? count : undefined,\n children: modalContent,\n actions: isEditingForm ? formActions : undefined,\n onRequestDismiss:\n form.loading && progressMsgRef.current === t('submitting') ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n onAfterClose: () => {\n if (mode === 'add' || mode === 'edit' || mode === 'viewAllEdit') {\n form.onAfterClose?.();\n }\n if (mode === 'viewAll' || mode === 'viewAllEdit') {\n setViewAllSearchValue('');\n viewAll.onAfterClose?.();\n }\n\n progressMsgRef.current = t('loading');\n modalMethods.current = undefined;\n setMode(undefined);\n }\n });\n }\n }, [mode, form.loading, count, viewAll.loading, modalContent, formActions]);\n\n return (\n <StyledStakeholders\n {...restProps}\n ref={ref}\n icon={\n theme.components['case-view'].utilities['icon-color']\n ? {\n name: 'person',\n background: colorIconMapping(theme, 'person'),\n shape: 'circle'\n }\n : {\n name: 'person'\n }\n }\n name={name || t('view_stakeholders')}\n headingTag='h3'\n loading={loading}\n count={count}\n error={error}\n items={mergeItemActions(itemsProp.slice(0, 3))}\n actions={\n onAddNew\n ? [\n {\n text: t('add'),\n id: 'add_new',\n icon: 'plus',\n onClick() {\n setMode('add');\n onAddNew?.();\n }\n }\n ]\n : undefined\n }\n onViewAll={\n onViewAll && count && count > 3\n ? () => {\n setMode('viewAll');\n onViewAll?.();\n }\n : undefined\n }\n />\n );\n }\n);\n\nexport default Stakeholders;\n"]}
@@ -9,7 +9,7 @@ export interface Stakeholder extends SummaryListItem, ForwardProps {
9
9
  onEdit?: () => void;
10
10
  onRemove?: () => void;
11
11
  }
12
- export interface StakeholdersProps extends NoChildrenProp, Pick<SummaryListProps, 'count' | 'loading' | 'error' | 'ref'> {
12
+ export interface StakeholdersProps extends NoChildrenProp, Pick<SummaryListProps, 'count' | 'loading' | 'error' | 'ref' | 'name'> {
13
13
  /**
14
14
  * The initial array of stakeholders presented in the default state of the widget.
15
15
  * This array will be sliced internally to the first three items but recommend only passing up to that length as a best practice.
@@ -1 +1 @@
1
- {"version":3,"file":"Stakeholders.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,cAAc,EACd,eAAe,EAChB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,MAAM,IAAI,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,sHAAsH;AACtH,MAAM,WAAW,WAAY,SAAQ,eAAe,EAAE,YAAY;IAChE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,KAAK,CAAC;IAC/D;;;OAGG;IACH,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,IAAI,EAAE;QACJ,gGAAgG;QAChG,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,iEAAiE;QACjE,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;QACf,yGAAyG;QACzG,WAAW,CAAC,EAAE,IAAI,CAAC;QACnB;;;WAGG;QACH,QAAQ,EAAE,aAAa,CAAC;YAAE,gBAAgB,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;SAAE,CAAC,CAAC;QAC7D,+DAA+D;QAC/D,aAAa,CAAC,EAAE;YACd,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;QACF,mEAAmE;QACnE,OAAO,CAAC,EAAE,SAAS,CAAC;QACpB;;;;;WAKG;QACH,QAAQ,EAAE,CAAC,EACT,gBAAgB,EAChB,SAAS,EACV,EAAE;YACD,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;YAC3C,SAAS,EAAE,MAAM,IAAI,CAAC;SACvB,KAAK,IAAI,CAAC;QACX;;;WAGG;QACH,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE;YAAE,SAAS,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;QAC9D,qHAAqH;QACrH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,CAAC;IACF,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE;QACP,+EAA+E;QAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,uFAAuF;QACvF,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;QAClC,2HAA2H;QAC3H,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QACnC,qHAAqH;QACrH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,CAAC;CACH"}
1
+ {"version":3,"file":"Stakeholders.types.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,cAAc,EACd,eAAe,EAChB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,MAAM,IAAI,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,sHAAsH;AACtH,MAAM,WAAW,WAAY,SAAQ,eAAe,EAAE,YAAY;IAChE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,MAAM,WAAW,iBACf,SAAQ,cAAc,EACpB,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,SAAS,GAAG,OAAO,GAAG,KAAK,GAAG,MAAM,CAAC;IACxE;;;OAGG;IACH,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,IAAI,EAAE;QACJ,gGAAgG;QAChG,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,iEAAiE;QACjE,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC;QACf,yGAAyG;QACzG,WAAW,CAAC,EAAE,IAAI,CAAC;QACnB;;;WAGG;QACH,QAAQ,EAAE,aAAa,CAAC;YAAE,gBAAgB,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;SAAE,CAAC,CAAC;QAC7D,+DAA+D;QAC/D,aAAa,CAAC,EAAE;YACd,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;QACF,mEAAmE;QACnE,OAAO,CAAC,EAAE,SAAS,CAAC;QACpB;;;;;WAKG;QACH,QAAQ,EAAE,CAAC,EACT,gBAAgB,EAChB,SAAS,EACV,EAAE;YACD,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;YAC3C,SAAS,EAAE,MAAM,IAAI,CAAC;SACvB,KAAK,IAAI,CAAC;QACX;;;WAGG;QACH,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE;YAAE,SAAS,EAAE,MAAM,IAAI,CAAA;SAAE,KAAK,IAAI,CAAC;QAC9D,qHAAqH;QACrH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,CAAC;IACF,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,EAAE;QACP,+EAA+E;QAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,uFAAuF;QACvF,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;QAClC,2HAA2H;QAC3H,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QACnC,qHAAqH;QACrH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,CAAC;CACH"}
@@ -1 +1 @@
1
- {"version":3,"file":"Stakeholders.types.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, ReactNode } from 'react';\n\nimport type {\n SummaryListProps,\n ForwardProps,\n NoChildrenProp,\n SummaryListItem\n} from '@pega/cosmos-react-core';\n\nexport type Role = {\n name: string;\n description: string;\n};\n\n/** A simple extension of a SummaryListItem. Pass onEdit and or onRemove to render either action for a stakeholder. */\nexport interface Stakeholder extends SummaryListItem, ForwardProps {\n onEdit?: () => void;\n onRemove?: () => void;\n}\n\nexport interface StakeholdersProps\n extends NoChildrenProp,\n Pick<SummaryListProps, 'count' | 'loading' | 'error' | 'ref'> {\n /**\n * The initial array of stakeholders presented in the default state of the widget.\n * This array will be sliced internally to the first three items but recommend only passing up to that length as a best practice.\n */\n items: Stakeholder[];\n /** Called when a user opens the add form. */\n onAddNew?: () => void;\n /**\n * Data and a component required to render a form for both add and edit.\n * If there are roles, the renderer is passed the currently selected role.\n */\n form: {\n /** Indicates the form is in a loading state either initially or after add/edit is submitted. */\n loading?: boolean;\n /** An array of available roles a stakeholder may be assigned. */\n roles?: Role[];\n /** Use this when onAdd or onEdit is invoked to indicate to the component which role option to select. */\n currentRole?: Role;\n /**\n * A component to render the main portion of the add/edit stakeholder form.\n * This may be a simple function and will be pass a prop when the selected role changes.\n */\n renderer: ComponentType<{ selectedRoleName?: Role['name'] }>;\n /** A props object that will be passed to the form renderer. */\n rendererProps?: {\n [key: string]: unknown;\n };\n /** Banner region to present errors or information after submit. */\n banners?: ReactNode;\n /**\n * Called when a user submits the form.\n * The name of the currently selected role will be passed along with a function to close the form on an arg object.\n * closeForm will close the modal or popover the form is preseneted in.\n * closeForm can be call once validations and requests have resolved.\n */\n onSubmit: ({\n selectedRoleName,\n closeForm\n }: {\n selectedRoleName: Role['name'] | undefined;\n closeForm: () => void;\n }) => void;\n /**\n * Called when a user cancels a form.\n * A function to close the form will be passed on an arg object.\n */\n onDismiss: ({ closeForm }: { closeForm: () => void }) => void;\n /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */\n onAfterClose?: () => void;\n };\n /** Called when a user opens the view all modal. */\n onViewAll?: () => void;\n viewAll: {\n /** Indicates the view all list is in a loading state while data is fetched. */\n loading?: boolean;\n /** Pass a full or filtered list of stakeholder items. Filter based on search input. */\n items: StakeholdersProps['items'];\n /** Called when a user enters a view all search. Return a filtered array to viewAll['items'] with matching stakeholders. */\n onSearch?: (value: string) => void;\n /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */\n onAfterClose?: () => void;\n };\n}\n"]}
1
+ {"version":3,"file":"Stakeholders.types.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, ReactNode } from 'react';\n\nimport type {\n SummaryListProps,\n ForwardProps,\n NoChildrenProp,\n SummaryListItem\n} from '@pega/cosmos-react-core';\n\nexport type Role = {\n name: string;\n description: string;\n};\n\n/** A simple extension of a SummaryListItem. Pass onEdit and or onRemove to render either action for a stakeholder. */\nexport interface Stakeholder extends SummaryListItem, ForwardProps {\n onEdit?: () => void;\n onRemove?: () => void;\n}\n\nexport interface StakeholdersProps\n extends NoChildrenProp,\n Pick<SummaryListProps, 'count' | 'loading' | 'error' | 'ref' | 'name'> {\n /**\n * The initial array of stakeholders presented in the default state of the widget.\n * This array will be sliced internally to the first three items but recommend only passing up to that length as a best practice.\n */\n items: Stakeholder[];\n /** Called when a user opens the add form. */\n onAddNew?: () => void;\n /**\n * Data and a component required to render a form for both add and edit.\n * If there are roles, the renderer is passed the currently selected role.\n */\n form: {\n /** Indicates the form is in a loading state either initially or after add/edit is submitted. */\n loading?: boolean;\n /** An array of available roles a stakeholder may be assigned. */\n roles?: Role[];\n /** Use this when onAdd or onEdit is invoked to indicate to the component which role option to select. */\n currentRole?: Role;\n /**\n * A component to render the main portion of the add/edit stakeholder form.\n * This may be a simple function and will be pass a prop when the selected role changes.\n */\n renderer: ComponentType<{ selectedRoleName?: Role['name'] }>;\n /** A props object that will be passed to the form renderer. */\n rendererProps?: {\n [key: string]: unknown;\n };\n /** Banner region to present errors or information after submit. */\n banners?: ReactNode;\n /**\n * Called when a user submits the form.\n * The name of the currently selected role will be passed along with a function to close the form on an arg object.\n * closeForm will close the modal or popover the form is preseneted in.\n * closeForm can be call once validations and requests have resolved.\n */\n onSubmit: ({\n selectedRoleName,\n closeForm\n }: {\n selectedRoleName: Role['name'] | undefined;\n closeForm: () => void;\n }) => void;\n /**\n * Called when a user cancels a form.\n * A function to close the form will be passed on an arg object.\n */\n onDismiss: ({ closeForm }: { closeForm: () => void }) => void;\n /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */\n onAfterClose?: () => void;\n };\n /** Called when a user opens the view all modal. */\n onViewAll?: () => void;\n viewAll: {\n /** Indicates the view all list is in a loading state while data is fetched. */\n loading?: boolean;\n /** Pass a full or filtered list of stakeholder items. Filter based on search input. */\n items: StakeholdersProps['items'];\n /** Called when a user enters a view all search. Return a filtered array to viewAll['items'] with matching stakeholders. */\n onSearch?: (value: string) => void;\n /** Called after the modal or popover transitions and un-mounts as a result of a closeForm call or user dismissal. */\n onAfterClose?: () => void;\n };\n}\n"]}
@@ -0,0 +1,8 @@
1
+ import type { TaskGroupProps } from './Tasks';
2
+ interface TaskCardProps {
3
+ group: TaskGroupProps;
4
+ onShowMoreClick: (group: TaskGroupProps) => void;
5
+ }
6
+ declare const TaskCard: ({ group, onShowMoreClick }: TaskCardProps) => import("react/jsx-runtime").JSX.Element;
7
+ export default TaskCard;
8
+ //# sourceMappingURL=TaskCard.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TaskCard.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskCard.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,UAAU,aAAa;IACrB,KAAK,EAAE,cAAc,CAAC;IACtB,eAAe,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;CAClD;AA4BD,QAAA,MAAM,QAAQ,GAAI,4BAA4B,aAAa,4CAmD1D,CAAC;AAEF,eAAe,QAAQ,CAAC"}
@@ -0,0 +1,39 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import styled, { css } from 'styled-components';
3
+ import { Card, CardHeader, CardContent, CardFooter, Button, Count, Flex, Text, VisuallyHiddenText, Progress, EmptyState, useI18n, defaultThemeProp, StyledEmptyState } from '@pega/cosmos-react-core';
4
+ import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
5
+ import { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';
6
+ import TaskList from './TaskList';
7
+ const StyledTaskCard = styled(Card)(({ theme }) => css `
8
+ block-size: 100%;
9
+
10
+ ${StyledCardHeader} {
11
+ border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};
12
+ }
13
+
14
+ ${StyledCardContent} {
15
+ flex-grow: 1;
16
+ }
17
+
18
+ ${StyledEmptyState} {
19
+ margin-block: calc(${theme.base.spacing} * 2);
20
+ }
21
+ `);
22
+ StyledTaskCard.defaultProps = defaultThemeProp;
23
+ const StyledHeadingFlex = styled(Flex) `
24
+ min-width: 0;
25
+ `;
26
+ StyledHeadingFlex.defaultProps = defaultThemeProp;
27
+ const TaskCard = ({ group, onShowMoreClick }) => {
28
+ const { name, visual, items, count = items.length, loadingMore = false } = group;
29
+ const t = useI18n();
30
+ const cardItemLimit = 3;
31
+ const displayItems = items.slice(0, cardItemLimit);
32
+ const hasShowMore = items.length > cardItemLimit || (count !== undefined && count > items.length);
33
+ return (_jsxs(StyledTaskCard, { children: [_jsxs(CardHeader, { container: { justify: 'start', alignItems: 'center', gap: 1 }, children: [visual && _jsx(Flex, { item: { shrink: 0 }, children: visual }), _jsx(StyledHeadingFlex, { item: { grow: 0 }, children: _jsx(Text, { variant: 'h3', children: name }) }), count > cardItemLimit ? (_jsx(Count, { children: count })) : (_jsx(VisuallyHiddenText, { children: t('task_count', [count], { count }) }))] }), _jsx(CardContent, { children: displayItems.length > 0 ? (_jsx(TaskList, { items: displayItems, openButtonIconOnly: true })) : (_jsx(EmptyState, {})) }), _jsx(Progress, { placement: 'block', visible: loadingMore }), hasShowMore && (_jsx(CardFooter, { justify: 'center', children: _jsx(Button, { variant: 'link', onClick: () => {
34
+ group.onShowMore?.();
35
+ onShowMoreClick(group);
36
+ }, children: t('show_more') }) }))] }));
37
+ };
38
+ export default TaskCard;
39
+ //# sourceMappingURL=TaskCard.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TaskCard.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n Button,\n Count,\n Flex,\n Text,\n VisuallyHiddenText,\n Progress,\n EmptyState,\n useI18n,\n defaultThemeProp,\n StyledEmptyState\n} from '@pega/cosmos-react-core';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';\n\nimport TaskList from './TaskList';\nimport type { TaskGroupProps } from './Tasks';\n\ninterface TaskCardProps {\n group: TaskGroupProps;\n onShowMoreClick: (group: TaskGroupProps) => void;\n}\n\nconst StyledTaskCard = styled(Card)(\n ({ theme }) => css`\n block-size: 100%;\n\n ${StyledCardHeader} {\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n\n ${StyledCardContent} {\n flex-grow: 1;\n }\n\n ${StyledEmptyState} {\n margin-block: calc(${theme.base.spacing} * 2);\n }\n `\n);\n\nStyledTaskCard.defaultProps = defaultThemeProp;\n\nconst StyledHeadingFlex = styled(Flex)`\n min-width: 0;\n`;\n\nStyledHeadingFlex.defaultProps = defaultThemeProp;\n\nconst TaskCard = ({ group, onShowMoreClick }: TaskCardProps) => {\n const { name, visual, items, count = items.length, loadingMore = false } = group;\n\n const t = useI18n();\n\n const cardItemLimit = 3;\n\n const displayItems = items.slice(0, cardItemLimit);\n const hasShowMore = items.length > cardItemLimit || (count !== undefined && count > items.length);\n\n return (\n <StyledTaskCard>\n <CardHeader container={{ justify: 'start', alignItems: 'center', gap: 1 }}>\n {visual && <Flex item={{ shrink: 0 }}>{visual}</Flex>}\n\n <StyledHeadingFlex item={{ grow: 0 }}>\n <Text variant='h3'>{name}</Text>\n </StyledHeadingFlex>\n\n {count > cardItemLimit ? (\n <Count>{count}</Count>\n ) : (\n <VisuallyHiddenText>{t('task_count', [count], { count })}</VisuallyHiddenText>\n )}\n </CardHeader>\n\n <CardContent>\n {displayItems.length > 0 ? (\n <TaskList items={displayItems} openButtonIconOnly />\n ) : (\n <EmptyState />\n )}\n </CardContent>\n\n <Progress placement='block' visible={loadingMore} />\n\n {hasShowMore && (\n <CardFooter justify='center'>\n <Button\n variant='link'\n onClick={() => {\n group.onShowMore?.();\n onShowMoreClick(group);\n }}\n >\n {t('show_more')}\n </Button>\n </CardFooter>\n )}\n </StyledTaskCard>\n );\n};\n\nexport default TaskCard;\n"]}
@@ -0,0 +1,9 @@
1
+ import type { TestIdProp } from '@pega/cosmos-react-core';
2
+ import type { TaskGroupProps } from './Tasks';
3
+ export interface TaskCardsGridProps extends TestIdProp {
4
+ groups: TaskGroupProps[];
5
+ name?: string;
6
+ }
7
+ declare const TaskCards: ({ groups, testId, name, ...restProps }: TaskCardsGridProps) => import("react/jsx-runtime").JSX.Element;
8
+ export default TaskCards;
9
+ //# sourceMappingURL=TaskCards.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TaskCards.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskCards.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAIxE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAG9C,MAAM,WAAW,kBAAmB,SAAQ,UAAU;IACpD,MAAM,EAAE,cAAc,EAAE,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,SAAS,GAAI,wCAAwC,kBAAkB,4CAkD5E,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -0,0 +1,39 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useRef } from 'react';
3
+ import { Grid, Modal, useModalManager, useTestIds } from '@pega/cosmos-react-core';
4
+ import TaskList from './TaskList';
5
+ import TaskCard from './TaskCard';
6
+ import { getTasksTestIds } from './Tasks.test-ids';
7
+ const TaskCards = ({ groups, testId, name, ...restProps }) => {
8
+ const testIds = useTestIds(testId, getTasksTestIds);
9
+ const { create: createModal } = useModalManager();
10
+ const modalMethodsRef = useRef();
11
+ const baseGroups = groups.length > 0 ? groups : [{ id: 'default', name: name ?? '', items: [] }];
12
+ const sortedGroups = [...baseGroups].sort((a, b) => (a.isApprovals ? 1 : 0) - (b.isApprovals ? 1 : 0));
13
+ const handleShowMore = (group) => {
14
+ const updatedItems = group.items.map(item => {
15
+ const { onOpen } = item;
16
+ if (!onOpen)
17
+ return item;
18
+ return {
19
+ ...item,
20
+ onOpen: (...args) => {
21
+ modalMethodsRef.current?.dismiss();
22
+ onOpen(...args);
23
+ }
24
+ };
25
+ });
26
+ modalMethodsRef.current = createModal(Modal, {
27
+ heading: group.name,
28
+ count: group.count ?? group.items.length,
29
+ children: _jsx(TaskList, { items: updatedItems, openButtonIconOnly: true })
30
+ });
31
+ };
32
+ return (_jsx(Grid, { container: {
33
+ cols: 'repeat(auto-fill, minmax(min(18rem, 100%), 1fr))',
34
+ gap: 1,
35
+ alignItems: 'stretch'
36
+ }, md: { container: { cols: 'repeat(3, 1fr)' } }, xl: { container: { cols: 'repeat(4, 1fr)' } }, ...restProps, "data-testid": testIds.cardGrid, children: sortedGroups.map(group => (_jsx(TaskCard, { group: group, onShowMoreClick: handleShowMore }, group.id))) }));
37
+ };
38
+ export default TaskCards;
39
+ //# sourceMappingURL=TaskCards.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TaskCards.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskCards.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAGnF,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAOnD,MAAM,SAAS,GAAG,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,SAAS,EAAsB,EAAE,EAAE;IAC/E,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;IAEpD,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,eAAe,EAAE,CAAC;IAClD,MAAM,eAAe,GAAG,MAAM,EAAgB,CAAC;IAE/C,MAAM,UAAU,GACd,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;IAChF,MAAM,YAAY,GAAG,CAAC,GAAG,UAAU,CAAC,CAAC,IAAI,CACvC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAC5D,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,KAAqB,EAAE,EAAE;QAC/C,MAAM,YAAY,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAC1C,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;YACxB,IAAI,CAAC,MAAM;gBAAE,OAAO,IAAI,CAAC;YAEzB,OAAO;gBACL,GAAG,IAAI;gBACP,MAAM,EAAE,CAAC,GAAG,IAA+B,EAAE,EAAE;oBAC7C,eAAe,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC;oBACnC,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC;gBAClB,CAAC;aACF,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,eAAe,CAAC,OAAO,GAAG,WAAW,CAAC,KAAK,EAAE;YAC3C,OAAO,EAAE,KAAK,CAAC,IAAI;YACnB,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM;YACxC,QAAQ,EAAE,KAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,EAAE,kBAAkB,SAAG;SAC/D,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE;YACT,IAAI,EAAE,kDAAkD;YACxD,GAAG,EAAE,CAAC;YACN,UAAU,EAAE,SAAS;SACtB,EACD,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,gBAAgB,EAAE,EAAE,EAC7C,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,gBAAgB,EAAE,EAAE,KACzC,SAAS,iBACA,OAAO,CAAC,QAAQ,YAE5B,YAAY,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CACzB,KAAC,QAAQ,IAAgB,KAAK,EAAE,KAAK,EAAE,eAAe,EAAE,cAAc,IAAvD,KAAK,CAAC,EAAE,CAAmD,CAC3E,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { useRef } from 'react';\n\nimport { Grid, Modal, useModalManager, useTestIds } from '@pega/cosmos-react-core';\nimport type { ModalMethods, TestIdProp } from '@pega/cosmos-react-core';\n\nimport TaskList from './TaskList';\nimport TaskCard from './TaskCard';\nimport type { TaskGroupProps } from './Tasks';\nimport { getTasksTestIds } from './Tasks.test-ids';\n\nexport interface TaskCardsGridProps extends TestIdProp {\n groups: TaskGroupProps[];\n name?: string;\n}\n\nconst TaskCards = ({ groups, testId, name, ...restProps }: TaskCardsGridProps) => {\n const testIds = useTestIds(testId, getTasksTestIds);\n\n const { create: createModal } = useModalManager();\n const modalMethodsRef = useRef<ModalMethods>();\n\n const baseGroups: TaskGroupProps[] =\n groups.length > 0 ? groups : [{ id: 'default', name: name ?? '', items: [] }];\n const sortedGroups = [...baseGroups].sort(\n (a, b) => (a.isApprovals ? 1 : 0) - (b.isApprovals ? 1 : 0)\n );\n\n const handleShowMore = (group: TaskGroupProps) => {\n const updatedItems = group.items.map(item => {\n const { onOpen } = item;\n if (!onOpen) return item;\n\n return {\n ...item,\n onOpen: (...args: Parameters<typeof onOpen>) => {\n modalMethodsRef.current?.dismiss();\n onOpen(...args);\n }\n };\n });\n\n modalMethodsRef.current = createModal(Modal, {\n heading: group.name,\n count: group.count ?? group.items.length,\n children: <TaskList items={updatedItems} openButtonIconOnly />\n });\n };\n\n return (\n <Grid\n container={{\n cols: 'repeat(auto-fill, minmax(min(18rem, 100%), 1fr))',\n gap: 1,\n alignItems: 'stretch'\n }}\n md={{ container: { cols: 'repeat(3, 1fr)' } }}\n xl={{ container: { cols: 'repeat(4, 1fr)' } }}\n {...restProps}\n data-testid={testIds.cardGrid}\n >\n {sortedGroups.map(group => (\n <TaskCard key={group.id} group={group} onShowMoreClick={handleShowMore} />\n ))}\n </Grid>\n );\n};\n\nexport default TaskCards;\n"]}
@@ -25,10 +25,20 @@ export interface TaskItemProps extends TestIdProp {
25
25
  * @default true
26
26
  */
27
27
  animateOpen?: boolean;
28
+ /**
29
+ * When true, renders the open button as a compact icon-only arrow button.
30
+ * @default false
31
+ */
32
+ openButtonIconOnly?: boolean;
28
33
  }
29
34
  export interface TaskListProps extends TestIdProp {
30
35
  items: TaskItemProps[];
31
36
  hasFooter?: boolean;
37
+ /**
38
+ * When true, all task items render the open button as a compact icon-only arrow.
39
+ * @default false
40
+ */
41
+ openButtonIconOnly?: boolean;
32
42
  /** Ref for the wrapping element. */
33
43
  ref?: Ref<HTMLElement>;
34
44
  }
@@ -39,7 +49,7 @@ interface Announcement {
39
49
  export declare const StyledTaskList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {
40
50
  hasFooter: boolean;
41
51
  }>> & string;
42
- export declare const TaskItem: (({ testId, id, name, avatar, meta, processName, onOpen, caseId, content, headingTag, addAnnouncement, additionalActions, animateOpen, ...restProps }: TaskItemProps & {
52
+ export declare const TaskItem: (({ testId, id, name, avatar, meta, processName, onOpen, caseId, content, headingTag, addAnnouncement, additionalActions, animateOpen, openButtonIconOnly, ...restProps }: TaskItemProps & {
43
53
  addAnnouncement?: (announcement: Announcement) => void;
44
54
  }) => import("react/jsx-runtime").JSX.Element) & {
45
55
  getTestIds: (testIdProp?: TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["open-task"]>;
@@ -1 +1 @@
1
- {"version":3,"file":"TaskList.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,SAAS,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAyBzE,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAMpF,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,EAAE,EAAE,MAAM,CAAC;IACX,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wDAAwD;IACxD,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC7E,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sCAAsC;IACtC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,iBAAiB,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAC1C;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,UAAU,YAAY;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc;eAA0B,OAAO;YAuB1D,CAAC;AAsDH,eAAO,MAAM,QAAQ,yJAgBhB,aAAa,GAAG;IAAE,eAAe,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,KAAK,IAAI,CAAA;CAAE;;CAoG9E,CAAC;;;;AAgEF,wBAAyD"}
1
+ {"version":3,"file":"TaskList.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,SAAS,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AA4BzE,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAQpF,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,EAAE,EAAE,MAAM,CAAC;IACX,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wDAAwD;IACxD,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC7E,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sCAAsC;IACtC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,iBAAiB,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAC1C;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,UAAU,YAAY;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc;eAA0B,OAAO;YAuB1D,CAAC;AAsDH,eAAO,MAAM,QAAQ,6KAiBhB,aAAa,GAAG;IAAE,eAAe,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,KAAK,IAAI,CAAA;CAAE;;CAgH9E,CAAC;;;;AAqEF,wBAAyD"}
@@ -4,10 +4,12 @@ import { forwardRef, useEffect, useRef } from 'react';
4
4
  import styled, { css } from 'styled-components';
5
5
  import { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';
6
6
  import { animations } from '@pega/cosmos-react-core/lib/styles';
7
- import { SummaryItem, StyledSummaryListItem, Flex, defaultThemeProp, Button, Text, useI18n, VisuallyHiddenText, useTestIds, useLiveLog, debounce, Actions, withTestIds, StyledPrimary, StyledText, useTheme, useTransitionState } from '@pega/cosmos-react-core';
7
+ import { SummaryItem, StyledSummaryListItem, Flex, defaultThemeProp, Button, Text, useI18n, VisuallyHiddenText, useTestIds, useLiveLog, debounce, Actions, withTestIds, StyledPrimary, StyledText, useTheme, useTransitionState, Icon, registerIcon } from '@pega/cosmos-react-core';
8
+ import * as arrowRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-right.icon';
8
9
  import { expandCollapseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';
9
10
  import AssignmentDetails from '../HierarchicalAssignments/AssignmentDetail';
10
11
  import { getTaskListTestIds, getTaskItemTestIds } from './Tasks.test-ids';
12
+ registerIcon(arrowRightIcon);
11
13
  export const StyledTaskList = styled.ul(({ theme, hasFooter }) => {
12
14
  const speed = theme.base.animation.speed;
13
15
  return css `
@@ -72,7 +74,7 @@ const StyledOpenTaskButton = styled(Button)(({ theme: { base } }) => {
72
74
  `;
73
75
  });
74
76
  StyledOpenTaskButton.defaultProps = defaultThemeProp;
75
- export const TaskItem = withTestIds(({ testId, id, name, avatar, meta, processName, onOpen, caseId, content, headingTag, addAnnouncement, additionalActions, animateOpen = true, ...restProps }) => {
77
+ export const TaskItem = withTestIds(({ testId, id, name, avatar, meta, processName, onOpen, caseId, content, headingTag, addAnnouncement, additionalActions, animateOpen = true, openButtonIconOnly = false, ...restProps }) => {
76
78
  const testIds = useTestIds(testId, getTaskItemTestIds);
77
79
  const t = useI18n();
78
80
  const { components: { 'case-view': { summary: { detached } } } } = useTheme();
@@ -106,10 +108,11 @@ export const TaskItem = withTestIds(({ testId, id, name, avatar, meta, processNa
106
108
  }
107
109
  const summary = (_jsx(StyledSummaryItem, { visual: avatar, hasProcessName: !!processName, primary: primaryValue, secondary: meta, actions: content
108
110
  ? additionalActions && _jsx(Actions, { menuAt: 1, items: additionalActions })
109
- : onOpen && (_jsxs(StyledOpenTaskButton, { "data-testid": testIds.openTask, variant: 'primary', compact: detached, onClick: (e) => onOpen(id, e), children: [_jsx("span", { children: t('go') }), _jsx(VisuallyHiddenText, { children: ` - ${processName ? `${processName} ` : ''}${name}${caseId ? ` ${caseId}` : ''}` })] })) }));
111
+ : onOpen &&
112
+ (openButtonIconOnly ? (_jsx(Button, { "data-testid": testIds.openTask, variant: 'secondary', icon: true, compact: true, "aria-label": `${t('go')} - ${processName ? `${processName} ` : ''}${name}${caseId ? ` ${caseId}` : ''}`, onClick: (e) => onOpen(id, e), children: _jsx(Icon, { name: 'arrow-right' }) })) : (_jsxs(StyledOpenTaskButton, { "data-testid": testIds.openTask, variant: 'primary', compact: detached, onClick: (e) => onOpen(id, e), children: [_jsx("span", { children: t('go') }), _jsx(VisuallyHiddenText, { children: ` - ${processName ? `${processName} ` : ''}${name}${caseId ? ` ${caseId}` : ''}` })] }))) }));
110
113
  return (_jsxs(Flex, { "data-testid": testIds.root, ...restProps, container: { direction: 'column', gap: 2 }, item: { grow: 1 }, as: content ? undefined : StyledSummaryListItem, forwardedAs: content ? 'div' : 'li', children: [summary, content && (_jsx(StyledTaskContent, { ref: contentRef, isAnimating: isAnimating, isExpanded: isExpanded, children: content }))] }));
111
114
  }, getTaskItemTestIds);
112
- const TaskList = forwardRef(function TaskList({ testId, items, hasFooter = false }, ref) {
115
+ const TaskList = forwardRef(function TaskList({ testId, items, hasFooter = false, openButtonIconOnly = false }, ref) {
113
116
  const testIds = useTestIds(testId, getTaskListTestIds);
114
117
  const t = useI18n();
115
118
  const { announcePolite } = useLiveLog();
@@ -147,7 +150,7 @@ const TaskList = forwardRef(function TaskList({ testId, items, hasFooter = false
147
150
  announcements.current = [...announcements.current, announcement];
148
151
  debouncedAnnounce();
149
152
  };
150
- return (_jsx(Flex, { "data-testid": testIds.root, container: { direction: 'column' }, as: StyledTaskList, hasFooter: hasFooter, ref: ref, children: items.map(item => (_createElement(TaskItem, { ...item, addAnnouncement: addAnnouncement, key: item.id }))) }));
153
+ return (_jsx(Flex, { "data-testid": testIds.root, container: { direction: 'column' }, as: StyledTaskList, hasFooter: hasFooter, ref: ref, children: items.map(item => (_createElement(TaskItem, { ...item, openButtonIconOnly: item.openButtonIconOnly ?? openButtonIconOnly, addAnnouncement: addAnnouncement, key: item.id }))) }));
151
154
  });
152
155
  export default withTestIds(TaskList, getTaskListTestIds);
153
156
  //# sourceMappingURL=TaskList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TaskList.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef } from 'react';\nimport type { PropsWithoutRef, ReactNode, Ref, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport { animations } from '@pega/cosmos-react-core/lib/styles';\nimport {\n SummaryItem,\n StyledSummaryListItem,\n Flex,\n defaultThemeProp,\n Button,\n Text,\n useI18n,\n VisuallyHiddenText,\n useTestIds,\n useLiveLog,\n debounce,\n Actions,\n withTestIds,\n StyledPrimary,\n StyledText,\n useTheme,\n useTransitionState\n} from '@pega/cosmos-react-core';\nimport { expandCollapseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\nimport type { TestIdProp, ActionsProps, HeadingTag } from '@pega/cosmos-react-core';\n\nimport AssignmentDetails from '../HierarchicalAssignments/AssignmentDetail';\n\nimport { getTaskListTestIds, getTaskItemTestIds } from './Tasks.test-ids';\n\nexport interface TaskItemProps extends TestIdProp {\n id: string;\n /** Name of the task displayed in the list. */\n name: string;\n /** Name of the process for the task. */\n processName?: string;\n /** The heading tag to render task name and process as. */\n headingTag?: HeadingTag;\n /** Avatar element to represent the task's assignee. */\n avatar?: ReactNode;\n /** MetaList element with info related to the task. */\n meta?: ReactNode;\n /** Provide a callback to render a button for a task. */\n onOpen?: (id: TaskItemProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n /** Case identifier */\n caseId?: string;\n /** Content for the task when open. */\n content?: ReactNode;\n /** An array of actions to add to open task. */\n additionalActions?: ActionsProps['items'];\n /**\n * When true, animates the content expanding in.\n * @default true\n */\n animateOpen?: boolean;\n}\n\nexport interface TaskListProps extends TestIdProp {\n items: TaskItemProps[];\n hasFooter?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLElement>;\n}\n\ninterface Announcement {\n name: string;\n status: 'removed' | 'added';\n}\n\nexport const StyledTaskList = styled.ul<{ hasFooter: boolean }>(({ theme, hasFooter }) => {\n const speed = theme.base.animation.speed;\n\n return css`\n ${animations.subProperties}\n animation-name: ${animations.reveal}, ${animations.slideInYStart};\n --slide-in-y-start-offset: -0.5rem;\n --animation-duration: max(calc(${speed} * 3), 1ms);\n\n @media (prefers-reduced-motion: reduce) {\n animation-duration: 1ms;\n }\n\n > li:last-child {\n ${hasFooter\n ? css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `\n : css`\n padding-block-end: 0;\n `}\n }\n `;\n});\n\nStyledTaskList.defaultProps = defaultThemeProp;\n\nconst StyledTaskContent = styled.div<{ isAnimating?: boolean; isExpanded?: boolean }>(\n ({ isAnimating, isExpanded, theme }) => {\n const speed = theme.base.animation.speed;\n\n return css`\n display: grid;\n grid-template-rows: ${isExpanded ? '1fr' : '0fr'};\n opacity: ${isExpanded ? 1 : 0};\n transform: translateY(${isExpanded ? '0' : '-0.5rem'});\n transition-duration: max(calc(${speed} * 3), 1ms);\n transition-property: grid-template-rows, opacity, transform;\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n @media (prefers-reduced-motion: reduce) {\n transition-duration: 1ms;\n }\n\n > * {\n overflow: ${isAnimating ? 'hidden' : 'visible'};\n }\n `;\n }\n);\n\nStyledTaskContent.defaultProps = defaultThemeProp;\n\nconst StyledSummaryItem = styled(SummaryItem)<{ hasProcessName?: boolean }>(({\n hasProcessName\n}) => {\n return hasProcessName\n ? css`\n ${StyledPrimary} {\n display: contents;\n\n & > ${StyledText} {\n ${ellipsisOverflow};\n }\n }\n `\n : null;\n});\n\nconst StyledOpenTaskButton = styled(Button)(({ theme: { base } }) => {\n return css`\n padding: 0 calc(2 * ${base.spacing});\n `;\n});\n\nStyledOpenTaskButton.defaultProps = defaultThemeProp;\n\nexport const TaskItem = withTestIds(\n ({\n testId,\n id,\n name,\n avatar,\n meta,\n processName,\n onOpen,\n caseId,\n content,\n headingTag,\n addAnnouncement,\n additionalActions,\n animateOpen = true,\n ...restProps\n }: TaskItemProps & { addAnnouncement?: (announcement: Announcement) => void }) => {\n const testIds = useTestIds(testId, getTaskItemTestIds);\n const t = useI18n();\n const {\n components: {\n 'case-view': {\n summary: { detached }\n }\n }\n } = useTheme();\n\n const contentRef = useRef<HTMLDivElement>(null);\n\n const { state, set } = useTransitionState({\n ref: contentRef,\n property: 'grid-template-rows',\n states: expandCollapseStates,\n defaultState: content && !animateOpen ? 'expanded' : 'collapsed'\n });\n\n const isAnimating = state === 'expanding' || state === 'collapsing';\n const isExpanded = state === 'expanded' || state === 'expanding';\n\n useEffect(() => {\n const shouldBeExpanded = !!content;\n\n if (shouldBeExpanded !== isExpanded) {\n set(shouldBeExpanded ? 'expanded' : 'collapsed');\n }\n }, [content, isExpanded, set]);\n\n useEffect(() => {\n addAnnouncement?.({ name, status: 'added' });\n\n return () => {\n addAnnouncement?.({ name, status: 'removed' });\n };\n }, []);\n\n let primaryValue;\n if (processName) {\n primaryValue = (\n <AssignmentDetails\n name={name}\n headingTag={headingTag}\n processName={processName}\n active={!!content}\n />\n );\n } else {\n primaryValue = (\n <Text variant={headingTag} data-focusable-form-heading={content ? '' : undefined}>\n {name}\n </Text>\n );\n }\n\n const summary = (\n <StyledSummaryItem\n visual={avatar}\n hasProcessName={!!processName}\n primary={primaryValue}\n secondary={meta}\n actions={\n content\n ? additionalActions && <Actions menuAt={1} items={additionalActions} />\n : onOpen && (\n <StyledOpenTaskButton\n data-testid={testIds.openTask}\n variant='primary'\n compact={detached}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onOpen(id, e)}\n >\n <span>{t('go')}</span>\n <VisuallyHiddenText>{` - ${processName ? `${processName} ` : ''}${name}${caseId ? ` ${caseId}` : ''}`}</VisuallyHiddenText>\n </StyledOpenTaskButton>\n )\n }\n />\n );\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n container={{ direction: 'column', gap: 2 }}\n item={{ grow: 1 }}\n as={content ? undefined : StyledSummaryListItem}\n forwardedAs={content ? 'div' : 'li'}\n >\n {summary}\n {content && (\n <StyledTaskContent ref={contentRef} isAnimating={isAnimating} isExpanded={isExpanded}>\n {content}\n </StyledTaskContent>\n )}\n </Flex>\n );\n },\n getTaskItemTestIds\n);\n\nconst TaskList = forwardRef(function TaskList(\n { testId, items, hasFooter = false }: PropsWithoutRef<TaskListProps>,\n ref: TaskListProps['ref']\n) {\n const testIds = useTestIds(testId, getTaskListTestIds);\n const t = useI18n();\n const { announcePolite } = useLiveLog();\n const announcements = useRef<Announcement[]>([]);\n const mounted = useRef(false);\n\n useEffect(() => {\n mounted.current = true;\n\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const debouncedAnnounce = debounce(() => {\n if (announcements.current.length > 0) {\n let tasksAdded = 0;\n let tasksRemoved = 0;\n announcements.current.forEach(item => {\n if (item.status === 'removed') {\n tasksRemoved += 1;\n } else {\n tasksAdded += 1;\n }\n });\n let message = tasksAdded ? t('tasks_added', [tasksAdded], { count: tasksAdded }) : '';\n if (tasksRemoved) {\n message += t('tasks_removed', [tasksRemoved], { count: tasksRemoved });\n }\n\n if (mounted.current) {\n announcePolite({ message });\n }\n\n announcements.current = [];\n }\n }, 2000);\n\n const addAnnouncement = (announcement: Announcement) => {\n announcements.current = [...announcements.current, announcement];\n debouncedAnnounce();\n };\n\n return (\n <Flex\n data-testid={testIds.root}\n container={{ direction: 'column' }}\n as={StyledTaskList}\n hasFooter={hasFooter}\n ref={ref}\n >\n {items.map(item => (\n <TaskItem {...item} addAnnouncement={addAnnouncement} key={item.id} />\n ))}\n </Flex>\n );\n});\n\nexport default withTestIds(TaskList, getTaskListTestIds);\n"]}
1
+ {"version":3,"file":"TaskList.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef } from 'react';\nimport type { PropsWithoutRef, ReactNode, Ref, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport { animations } from '@pega/cosmos-react-core/lib/styles';\nimport {\n SummaryItem,\n StyledSummaryListItem,\n Flex,\n defaultThemeProp,\n Button,\n Text,\n useI18n,\n VisuallyHiddenText,\n useTestIds,\n useLiveLog,\n debounce,\n Actions,\n withTestIds,\n StyledPrimary,\n StyledText,\n useTheme,\n useTransitionState,\n Icon,\n registerIcon\n} from '@pega/cosmos-react-core';\nimport * as arrowRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-right.icon';\nimport { expandCollapseStates } from '@pega/cosmos-react-core/lib/hooks/useTransitionState';\nimport type { TestIdProp, ActionsProps, HeadingTag } from '@pega/cosmos-react-core';\n\nimport AssignmentDetails from '../HierarchicalAssignments/AssignmentDetail';\n\nimport { getTaskListTestIds, getTaskItemTestIds } from './Tasks.test-ids';\n\nregisterIcon(arrowRightIcon);\n\nexport interface TaskItemProps extends TestIdProp {\n id: string;\n /** Name of the task displayed in the list. */\n name: string;\n /** Name of the process for the task. */\n processName?: string;\n /** The heading tag to render task name and process as. */\n headingTag?: HeadingTag;\n /** Avatar element to represent the task's assignee. */\n avatar?: ReactNode;\n /** MetaList element with info related to the task. */\n meta?: ReactNode;\n /** Provide a callback to render a button for a task. */\n onOpen?: (id: TaskItemProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n /** Case identifier */\n caseId?: string;\n /** Content for the task when open. */\n content?: ReactNode;\n /** An array of actions to add to open task. */\n additionalActions?: ActionsProps['items'];\n /**\n * When true, animates the content expanding in.\n * @default true\n */\n animateOpen?: boolean;\n /**\n * When true, renders the open button as a compact icon-only arrow button.\n * @default false\n */\n openButtonIconOnly?: boolean;\n}\n\nexport interface TaskListProps extends TestIdProp {\n items: TaskItemProps[];\n hasFooter?: boolean;\n /**\n * When true, all task items render the open button as a compact icon-only arrow.\n * @default false\n */\n openButtonIconOnly?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLElement>;\n}\n\ninterface Announcement {\n name: string;\n status: 'removed' | 'added';\n}\n\nexport const StyledTaskList = styled.ul<{ hasFooter: boolean }>(({ theme, hasFooter }) => {\n const speed = theme.base.animation.speed;\n\n return css`\n ${animations.subProperties}\n animation-name: ${animations.reveal}, ${animations.slideInYStart};\n --slide-in-y-start-offset: -0.5rem;\n --animation-duration: max(calc(${speed} * 3), 1ms);\n\n @media (prefers-reduced-motion: reduce) {\n animation-duration: 1ms;\n }\n\n > li:last-child {\n ${hasFooter\n ? css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `\n : css`\n padding-block-end: 0;\n `}\n }\n `;\n});\n\nStyledTaskList.defaultProps = defaultThemeProp;\n\nconst StyledTaskContent = styled.div<{ isAnimating?: boolean; isExpanded?: boolean }>(\n ({ isAnimating, isExpanded, theme }) => {\n const speed = theme.base.animation.speed;\n\n return css`\n display: grid;\n grid-template-rows: ${isExpanded ? '1fr' : '0fr'};\n opacity: ${isExpanded ? 1 : 0};\n transform: translateY(${isExpanded ? '0' : '-0.5rem'});\n transition-duration: max(calc(${speed} * 3), 1ms);\n transition-property: grid-template-rows, opacity, transform;\n transition-timing-function: ${theme.base.animation.timing.ease};\n\n @media (prefers-reduced-motion: reduce) {\n transition-duration: 1ms;\n }\n\n > * {\n overflow: ${isAnimating ? 'hidden' : 'visible'};\n }\n `;\n }\n);\n\nStyledTaskContent.defaultProps = defaultThemeProp;\n\nconst StyledSummaryItem = styled(SummaryItem)<{ hasProcessName?: boolean }>(({\n hasProcessName\n}) => {\n return hasProcessName\n ? css`\n ${StyledPrimary} {\n display: contents;\n\n & > ${StyledText} {\n ${ellipsisOverflow};\n }\n }\n `\n : null;\n});\n\nconst StyledOpenTaskButton = styled(Button)(({ theme: { base } }) => {\n return css`\n padding: 0 calc(2 * ${base.spacing});\n `;\n});\n\nStyledOpenTaskButton.defaultProps = defaultThemeProp;\n\nexport const TaskItem = withTestIds(\n ({\n testId,\n id,\n name,\n avatar,\n meta,\n processName,\n onOpen,\n caseId,\n content,\n headingTag,\n addAnnouncement,\n additionalActions,\n animateOpen = true,\n openButtonIconOnly = false,\n ...restProps\n }: TaskItemProps & { addAnnouncement?: (announcement: Announcement) => void }) => {\n const testIds = useTestIds(testId, getTaskItemTestIds);\n const t = useI18n();\n const {\n components: {\n 'case-view': {\n summary: { detached }\n }\n }\n } = useTheme();\n\n const contentRef = useRef<HTMLDivElement>(null);\n\n const { state, set } = useTransitionState({\n ref: contentRef,\n property: 'grid-template-rows',\n states: expandCollapseStates,\n defaultState: content && !animateOpen ? 'expanded' : 'collapsed'\n });\n\n const isAnimating = state === 'expanding' || state === 'collapsing';\n const isExpanded = state === 'expanded' || state === 'expanding';\n\n useEffect(() => {\n const shouldBeExpanded = !!content;\n\n if (shouldBeExpanded !== isExpanded) {\n set(shouldBeExpanded ? 'expanded' : 'collapsed');\n }\n }, [content, isExpanded, set]);\n\n useEffect(() => {\n addAnnouncement?.({ name, status: 'added' });\n\n return () => {\n addAnnouncement?.({ name, status: 'removed' });\n };\n }, []);\n\n let primaryValue;\n if (processName) {\n primaryValue = (\n <AssignmentDetails\n name={name}\n headingTag={headingTag}\n processName={processName}\n active={!!content}\n />\n );\n } else {\n primaryValue = (\n <Text variant={headingTag} data-focusable-form-heading={content ? '' : undefined}>\n {name}\n </Text>\n );\n }\n\n const summary = (\n <StyledSummaryItem\n visual={avatar}\n hasProcessName={!!processName}\n primary={primaryValue}\n secondary={meta}\n actions={\n content\n ? additionalActions && <Actions menuAt={1} items={additionalActions} />\n : onOpen &&\n (openButtonIconOnly ? (\n <Button\n data-testid={testIds.openTask}\n variant='secondary'\n icon\n compact\n aria-label={`${t('go')} - ${processName ? `${processName} ` : ''}${name}${caseId ? ` ${caseId}` : ''}`}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onOpen(id, e)}\n >\n <Icon name='arrow-right' />\n </Button>\n ) : (\n <StyledOpenTaskButton\n data-testid={testIds.openTask}\n variant='primary'\n compact={detached}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onOpen(id, e)}\n >\n <span>{t('go')}</span>\n <VisuallyHiddenText>{` - ${processName ? `${processName} ` : ''}${name}${caseId ? ` ${caseId}` : ''}`}</VisuallyHiddenText>\n </StyledOpenTaskButton>\n ))\n }\n />\n );\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n container={{ direction: 'column', gap: 2 }}\n item={{ grow: 1 }}\n as={content ? undefined : StyledSummaryListItem}\n forwardedAs={content ? 'div' : 'li'}\n >\n {summary}\n {content && (\n <StyledTaskContent ref={contentRef} isAnimating={isAnimating} isExpanded={isExpanded}>\n {content}\n </StyledTaskContent>\n )}\n </Flex>\n );\n },\n getTaskItemTestIds\n);\n\nconst TaskList = forwardRef(function TaskList(\n { testId, items, hasFooter = false, openButtonIconOnly = false }: PropsWithoutRef<TaskListProps>,\n ref: TaskListProps['ref']\n) {\n const testIds = useTestIds(testId, getTaskListTestIds);\n const t = useI18n();\n const { announcePolite } = useLiveLog();\n const announcements = useRef<Announcement[]>([]);\n const mounted = useRef(false);\n\n useEffect(() => {\n mounted.current = true;\n\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const debouncedAnnounce = debounce(() => {\n if (announcements.current.length > 0) {\n let tasksAdded = 0;\n let tasksRemoved = 0;\n announcements.current.forEach(item => {\n if (item.status === 'removed') {\n tasksRemoved += 1;\n } else {\n tasksAdded += 1;\n }\n });\n let message = tasksAdded ? t('tasks_added', [tasksAdded], { count: tasksAdded }) : '';\n if (tasksRemoved) {\n message += t('tasks_removed', [tasksRemoved], { count: tasksRemoved });\n }\n\n if (mounted.current) {\n announcePolite({ message });\n }\n\n announcements.current = [];\n }\n }, 2000);\n\n const addAnnouncement = (announcement: Announcement) => {\n announcements.current = [...announcements.current, announcement];\n debouncedAnnounce();\n };\n\n return (\n <Flex\n data-testid={testIds.root}\n container={{ direction: 'column' }}\n as={StyledTaskList}\n hasFooter={hasFooter}\n ref={ref}\n >\n {items.map(item => (\n <TaskItem\n {...item}\n openButtonIconOnly={item.openButtonIconOnly ?? openButtonIconOnly}\n addAnnouncement={addAnnouncement}\n key={item.id}\n />\n ))}\n </Flex>\n );\n});\n\nexport default withTestIds(TaskList, getTaskListTestIds);\n"]}