@pega/cosmos-react-work 4.1.1 → 4.1.2
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAmBf,OAAO,KAAK,EAAU,YAAY,EAA0B,MAAM,yBAAyB,CAAC;AAE5F,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAsCpE,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CA4UrE,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,21 +1,37 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, useRef, useEffect, useMemo, useState, useCallback } from 'react';
|
|
3
|
-
import styled from 'styled-components';
|
|
4
|
-
import { SummaryList, useI18n, Button, ViewAll, Modal, Popover, Flex, Text, useModalManager, useOuterEvent, Progress, useAfterInitialEffect } from '@pega/cosmos-react-core';
|
|
3
|
+
import styled, { css } from 'styled-components';
|
|
4
|
+
import { SummaryList, useI18n, Button, ViewAll, Modal, Popover, Flex, Text, useModalManager, useOuterEvent, Progress, useAfterInitialEffect, defaultThemeProp } from '@pega/cosmos-react-core';
|
|
5
5
|
import StakeholderForm from './StakeholderForm';
|
|
6
6
|
const StyledStakeholders = styled(SummaryList) ``;
|
|
7
|
-
const StyledEditFormWrap = styled.div
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
const StyledEditFormWrap = styled.div(({ theme }) => {
|
|
8
|
+
return css `
|
|
9
|
+
position: relative;
|
|
10
|
+
min-height: 8rem;
|
|
11
|
+
overflow: auto;
|
|
12
|
+
padding-block: calc(${theme.base.spacing} / 2);
|
|
13
|
+
padding-inline: calc(2 * ${theme.base.spacing});
|
|
10
14
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
`;
|
|
15
|
+
&[aria-busy='true'] > :nth-child(2) {
|
|
16
|
+
visibility: hidden;
|
|
17
|
+
}
|
|
18
|
+
`;
|
|
19
|
+
});
|
|
20
|
+
StyledEditFormWrap.defaultProps = defaultThemeProp;
|
|
15
21
|
const StyledPopover = styled(Popover) `
|
|
16
22
|
width: 40ch;
|
|
17
23
|
min-height: 12rem;
|
|
18
24
|
`;
|
|
25
|
+
const StyledContainer = styled(Flex)(({ theme }) => {
|
|
26
|
+
return css `
|
|
27
|
+
max-height: inherit;
|
|
28
|
+
> h3 {
|
|
29
|
+
padding-block-start: calc(2 * ${theme.base.spacing});
|
|
30
|
+
padding-inline: calc(2 * ${theme.base.spacing});
|
|
31
|
+
}
|
|
32
|
+
`;
|
|
33
|
+
});
|
|
34
|
+
StyledContainer.defaultProps = defaultThemeProp;
|
|
19
35
|
const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count, loading, onAddNew, form, onViewAll, viewAll, error, ...restProps }, ref) {
|
|
20
36
|
const { create: createModal } = useModalManager();
|
|
21
37
|
const t = useI18n();
|
|
@@ -117,7 +133,7 @@ const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count,
|
|
|
117
133
|
}
|
|
118
134
|
let editPopover = null;
|
|
119
135
|
if (popoverTarget) {
|
|
120
|
-
editPopover = (_jsx(StyledPopover, { ref: popoverRef, target: popoverTarget.button, placement: 'auto', role: 'dialog', children: _jsxs(
|
|
136
|
+
editPopover = (_jsx(StyledPopover, { ref: popoverRef, target: popoverTarget.button, placement: 'auto', role: 'dialog', children: _jsxs(StyledContainer, { container: { direction: 'column', gap: 2 }, children: [_jsx(Text, { variant: 'h3', children: t('edit_stakeholder') }), _jsxs(StyledEditFormWrap, { "aria-busy": form.loading ? 'true' : 'false', children: [_jsx(Progress, { placement: 'local', visible: form.loading, message: progressMsgRef.current }), (!form.loading || progressMsgRef.current === t('submitting')) && (_jsx(StakeholderForm, { roles: form.roles, currentRole: form.currentRole, renderer: form.renderer, rendererProps: form.rendererProps, setSelectedRoleNameRef: setSelectedRoleNameRef }))] }), formActions && (_jsx(Flex, { container: { justify: 'between', pad: [undefined, 2, 2] }, children: formActions }))] }) }));
|
|
121
137
|
}
|
|
122
138
|
// Content for the modal either for adding new or viewing all.
|
|
123
139
|
let modalContent = null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stakeholders.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useRef,\n useEffect,\n useMemo,\n useState,\n ReactNode,\n useCallback\n} from 'react';\nimport styled from 'styled-components';\n\nimport {\n SummaryList,\n useI18n,\n ModalMethods,\n Button,\n ViewAll,\n Modal,\n Popover,\n Flex,\n Text,\n useModalManager,\n useOuterEvent,\n Progress,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\nimport type { Action, ForwardProps, ModalProps, OmitStrict } from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nconst StyledEditFormWrap = styled.div`\n position: relative;\n min-height: 8rem;\n\n &[aria-busy='true'] > :nth-child(2) {\n visibility: hidden;\n }\n`;\n\nconst StyledPopover = styled(Popover)`\n width: 40ch;\n min-height: 12rem;\n`;\n\nconst Stakeholders: FunctionComponent<StakeholdersProps & ForwardProps> = 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 modalMethods = useRef<ModalMethods>();\n const [mode, setMode] = useState<undefined | 'add' | 'viewAll'>();\n const [editing, setEditing] = useState(false);\n const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n const popoverRef = useRef<HTMLDivElement>(null);\n const progressMsgRef = useRef(t('loading'));\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 const [popoverTarget, setPopoverTarget] = useState<{\n portal: HTMLLIElement;\n button: HTMLButtonElement | null;\n } | null>(null);\n\n const itemElsRef = useRef<{ itemEls: HTMLLIElement[]; viewAllItemEls: HTMLLIElement[] }>({\n itemEls: [],\n viewAllItemEls: []\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 ) => {\n return items.map(({ onEdit, onRemove, ...rest }, i) => {\n let itemActions: Action[] = [];\n const elArray = itemElsRef.current[mode === 'viewAll' ? 'viewAllItemEls' : 'itemEls'];\n\n if (onEdit) {\n itemActions = [\n {\n id: 'edit',\n text: t('edit'),\n icon: 'pencil',\n onClick: () => {\n setEditing(true);\n setPopoverTarget({\n portal: elArray[i],\n button: elArray[i].querySelector<HTMLButtonElement>(\n 'button[aria-haspopup=\"menu\"]'\n )\n });\n\n onEdit?.();\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 ref: (el: HTMLLIElement) => {\n elArray[i] = el;\n },\n actions: itemActions\n };\n });\n };\n\n const closePopover = () => {\n if (!popoverTarget || (form.loading && progressMsgRef.current === t('submitting'))) return;\n popoverTarget.button?.focus();\n setPopoverTarget(null);\n setEditing(false);\n progressMsgRef.current = t('loading');\n };\n\n let formContent: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n formContent = (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n );\n }\n\n // Actions used for add and edit both in the modal and the popover.\n let formActions: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n const closeForm = () => {\n if (mode === 'add') {\n modalMethods.current?.dismiss();\n } else {\n closePopover();\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 let editPopover: ReactNode = null;\n if (popoverTarget) {\n editPopover = (\n <StyledPopover\n ref={popoverRef}\n target={popoverTarget.button}\n placement='auto'\n role='dialog'\n >\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }}>\n <Text variant='h3'>{t('edit_stakeholder')}</Text>\n <StyledEditFormWrap aria-busy={form.loading ? 'true' : 'false'}>\n <Progress placement='local' visible={form.loading} message={progressMsgRef.current} />\n {(!form.loading || progressMsgRef.current === t('submitting')) && (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n )}\n </StyledEditFormWrap>\n {formActions && <Flex container={{ justify: 'between' }}>{formActions}</Flex>}\n </Flex>\n </StyledPopover>\n );\n }\n\n // Content for the modal either for adding new or viewing all.\n let modalContent: ReactNode = null;\n if (mode === 'add') modalContent = formContent;\n\n if (!viewAll.loading && (mode === 'viewAll' || (editing && modalMethods.current))) {\n modalContent = (\n <>\n <ViewAll\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 />\n {/* Edit popover triggered from a modal must be rendered within modal content to render in correct DOM position. */}\n {editPopover}\n </>\n );\n }\n\n useEffect(() => {\n if (!mode) {\n modalMethods.current = undefined;\n return;\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress:\n (mode === 'add' && form.loading) || viewAll.loading\n ? { message: progressMsgRef.current }\n : undefined,\n count: mode === 'viewAll' ? count : undefined,\n children: modalContent,\n actions: mode === 'add' ? 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 if (mode === 'add' || mode === 'viewAll') {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n heading: mode === 'add' ? t('add_stakeholders') : t('view_stakeholders'),\n onAfterClose: () => {\n if (mode === 'add') {\n form.onAfterClose?.();\n } else {\n setViewAllSearchValue('');\n viewAll.onAfterClose?.();\n }\n\n progressMsgRef.current = t('loading');\n setMode(undefined);\n }\n });\n }\n }, [mode, modalContent, form.loading, formActions, count, viewAll.loading]);\n\n // Using mousedown instead of click since drag selecting an input's value within the popover, then releasing outside the popover triggers outer click.\n useOuterEvent('mousedown', [popoverRef], closePopover);\n\n const onKeydown = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closePopover();\n }\n };\n\n useEffect(() => {\n if (!popoverTarget) return;\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [popoverTarget]);\n\n useAfterInitialEffect(() => {\n if (!popoverTarget) form.onAfterClose?.();\n }, [popoverTarget]);\n\n return (\n <>\n <StyledStakeholders\n {...restProps}\n ref={ref}\n icon='person'\n name={t('view_stakeholders')}\n headingTag='h3'\n loading={loading}\n count={count}\n error={error}\n items={useMemo(\n () => mergeItemActions(itemsProp.slice(0, 3)),\n [mergeItemActions, itemsProp]\n )}\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 {/* When edit is opened outside of the view all modal. */}\n {editPopover && mode !== 'viewAll' ? editPopover : null}\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 {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useRef,\n useEffect,\n useMemo,\n useState,\n ReactNode,\n useCallback\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryList,\n useI18n,\n ModalMethods,\n Button,\n ViewAll,\n Modal,\n Popover,\n Flex,\n Text,\n useModalManager,\n useOuterEvent,\n Progress,\n useAfterInitialEffect,\n defaultThemeProp\n} from '@pega/cosmos-react-core';\nimport type { Action, ForwardProps, ModalProps, OmitStrict } from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nconst StyledEditFormWrap = styled.div(({ theme }) => {\n return css`\n position: relative;\n min-height: 8rem;\n overflow: auto;\n padding-block: calc(${theme.base.spacing} / 2);\n padding-inline: calc(2 * ${theme.base.spacing});\n\n &[aria-busy='true'] > :nth-child(2) {\n visibility: hidden;\n }\n `;\n});\n\nStyledEditFormWrap.defaultProps = defaultThemeProp;\n\nconst StyledPopover = styled(Popover)`\n width: 40ch;\n min-height: 12rem;\n`;\n\nconst StyledContainer = styled(Flex)(({ theme }) => {\n return css`\n max-height: inherit;\n > h3 {\n padding-block-start: calc(2 * ${theme.base.spacing});\n padding-inline: calc(2 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledContainer.defaultProps = defaultThemeProp;\n\nconst Stakeholders: FunctionComponent<StakeholdersProps & ForwardProps> = 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 modalMethods = useRef<ModalMethods>();\n const [mode, setMode] = useState<undefined | 'add' | 'viewAll'>();\n const [editing, setEditing] = useState(false);\n const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n const popoverRef = useRef<HTMLDivElement>(null);\n const progressMsgRef = useRef(t('loading'));\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 const [popoverTarget, setPopoverTarget] = useState<{\n portal: HTMLLIElement;\n button: HTMLButtonElement | null;\n } | null>(null);\n\n const itemElsRef = useRef<{ itemEls: HTMLLIElement[]; viewAllItemEls: HTMLLIElement[] }>({\n itemEls: [],\n viewAllItemEls: []\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 ) => {\n return items.map(({ onEdit, onRemove, ...rest }, i) => {\n let itemActions: Action[] = [];\n const elArray = itemElsRef.current[mode === 'viewAll' ? 'viewAllItemEls' : 'itemEls'];\n\n if (onEdit) {\n itemActions = [\n {\n id: 'edit',\n text: t('edit'),\n icon: 'pencil',\n onClick: () => {\n setEditing(true);\n setPopoverTarget({\n portal: elArray[i],\n button: elArray[i].querySelector<HTMLButtonElement>(\n 'button[aria-haspopup=\"menu\"]'\n )\n });\n\n onEdit?.();\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 ref: (el: HTMLLIElement) => {\n elArray[i] = el;\n },\n actions: itemActions\n };\n });\n };\n\n const closePopover = () => {\n if (!popoverTarget || (form.loading && progressMsgRef.current === t('submitting'))) return;\n popoverTarget.button?.focus();\n setPopoverTarget(null);\n setEditing(false);\n progressMsgRef.current = t('loading');\n };\n\n let formContent: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n formContent = (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n );\n }\n\n // Actions used for add and edit both in the modal and the popover.\n let formActions: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n const closeForm = () => {\n if (mode === 'add') {\n modalMethods.current?.dismiss();\n } else {\n closePopover();\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 let editPopover: ReactNode = null;\n if (popoverTarget) {\n editPopover = (\n <StyledPopover\n ref={popoverRef}\n target={popoverTarget.button}\n placement='auto'\n role='dialog'\n >\n <StyledContainer container={{ direction: 'column', gap: 2 }}>\n <Text variant='h3'>{t('edit_stakeholder')}</Text>\n <StyledEditFormWrap aria-busy={form.loading ? 'true' : 'false'}>\n <Progress placement='local' visible={form.loading} message={progressMsgRef.current} />\n {(!form.loading || progressMsgRef.current === t('submitting')) && (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n )}\n </StyledEditFormWrap>\n {formActions && (\n <Flex container={{ justify: 'between', pad: [undefined, 2, 2] }}>{formActions}</Flex>\n )}\n </StyledContainer>\n </StyledPopover>\n );\n }\n\n // Content for the modal either for adding new or viewing all.\n let modalContent: ReactNode = null;\n if (mode === 'add') modalContent = formContent;\n\n if (!viewAll.loading && (mode === 'viewAll' || (editing && modalMethods.current))) {\n modalContent = (\n <>\n <ViewAll\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 />\n {/* Edit popover triggered from a modal must be rendered within modal content to render in correct DOM position. */}\n {editPopover}\n </>\n );\n }\n\n useEffect(() => {\n if (!mode) {\n modalMethods.current = undefined;\n return;\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress:\n (mode === 'add' && form.loading) || viewAll.loading\n ? { message: progressMsgRef.current }\n : undefined,\n count: mode === 'viewAll' ? count : undefined,\n children: modalContent,\n actions: mode === 'add' ? 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 if (mode === 'add' || mode === 'viewAll') {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n heading: mode === 'add' ? t('add_stakeholders') : t('view_stakeholders'),\n onAfterClose: () => {\n if (mode === 'add') {\n form.onAfterClose?.();\n } else {\n setViewAllSearchValue('');\n viewAll.onAfterClose?.();\n }\n\n progressMsgRef.current = t('loading');\n setMode(undefined);\n }\n });\n }\n }, [mode, modalContent, form.loading, formActions, count, viewAll.loading]);\n\n // Using mousedown instead of click since drag selecting an input's value within the popover, then releasing outside the popover triggers outer click.\n useOuterEvent('mousedown', [popoverRef], closePopover);\n\n const onKeydown = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closePopover();\n }\n };\n\n useEffect(() => {\n if (!popoverTarget) return;\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [popoverTarget]);\n\n useAfterInitialEffect(() => {\n if (!popoverTarget) form.onAfterClose?.();\n }, [popoverTarget]);\n\n return (\n <>\n <StyledStakeholders\n {...restProps}\n ref={ref}\n icon='person'\n name={t('view_stakeholders')}\n headingTag='h3'\n loading={loading}\n count={count}\n error={error}\n items={useMemo(\n () => mergeItemActions(itemsProp.slice(0, 3)),\n [mergeItemActions, itemsProp]\n )}\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 {/* When edit is opened outside of the view all modal. */}\n {editPopover && mode !== 'viewAll' ? editPopover : null}\n </>\n );\n }\n);\n\nexport default Stakeholders;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-work",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.2",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "https://github.com/pegasystems/cosmos-react.git",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"build": "tsc -b"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@pega/cosmos-react-core": "4.1.
|
|
23
|
+
"@pega/cosmos-react-core": "4.1.2",
|
|
24
24
|
"@types/react": "^16.14.43 || ^17.0.62",
|
|
25
25
|
"@types/react-dom": "^16.9.19 || ^17.0.20",
|
|
26
26
|
"@types/styled-components": "^5.1.26",
|
|
@@ -38,8 +38,8 @@
|
|
|
38
38
|
"@storybook/theming": "^7.0.24",
|
|
39
39
|
"@testing-library/react": "^12.1.3",
|
|
40
40
|
"@testing-library/user-event": "^13.5.0",
|
|
41
|
-
"@types/dompurify": "^3.0.
|
|
42
|
-
"dompurify": "^3.0.
|
|
41
|
+
"@types/dompurify": "^3.0.5",
|
|
42
|
+
"dompurify": "^3.0.7",
|
|
43
43
|
"typescript": "~5.0.2"
|
|
44
44
|
}
|
|
45
45
|
}
|