@pega/cosmos-react-social 3.0.0-dev.3.0 → 3.0.0-dev.4.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.
- package/lib/components/Email/ContextMenuPopover.d.ts +5 -0
- package/lib/components/Email/ContextMenuPopover.d.ts.map +1 -0
- package/lib/components/Email/ContextMenuPopover.js +48 -0
- package/lib/components/Email/ContextMenuPopover.js.map +1 -0
- package/lib/components/Email/Email.d.ts.map +1 -1
- package/lib/components/Email/Email.js +45 -11
- package/lib/components/Email/Email.js.map +1 -1
- package/lib/components/Email/Email.styles.d.ts +5 -1
- package/lib/components/Email/Email.styles.d.ts.map +1 -1
- package/lib/components/Email/Email.styles.js +39 -0
- package/lib/components/Email/Email.styles.js.map +1 -1
- package/lib/components/Email/Email.types.d.ts +35 -2
- package/lib/components/Email/Email.types.d.ts.map +1 -1
- package/lib/components/Email/Email.types.js.map +1 -1
- package/lib/components/Email/EmailComposer.d.ts +1 -1
- package/lib/components/Email/EmailComposer.d.ts.map +1 -1
- package/lib/components/Email/EmailComposer.js +42 -27
- package/lib/components/Email/EmailComposer.js.map +1 -1
- package/lib/components/Email/EmailEntity.d.ts.map +1 -1
- package/lib/components/Email/EmailEntity.js +6 -2
- package/lib/components/Email/EmailEntity.js.map +1 -1
- package/lib/components/Email/EmailSummaryItem.d.ts.map +1 -1
- package/lib/components/Email/EmailSummaryItem.js +15 -7
- package/lib/components/Email/EmailSummaryItem.js.map +1 -1
- package/lib/components/Email/EmailSummaryList.d.ts.map +1 -1
- package/lib/components/Email/EmailSummaryList.js +74 -33
- package/lib/components/Email/EmailSummaryList.js.map +1 -1
- package/lib/components/Feed/Feed.d.ts +2 -0
- package/lib/components/Feed/Feed.d.ts.map +1 -1
- package/lib/components/Feed/Feed.js +19 -42
- package/lib/components/Feed/Feed.js.map +1 -1
- package/lib/components/Feed/FeedLikeButton.d.ts +1 -1
- package/lib/components/Feed/FeedLikeButton.d.ts.map +1 -1
- package/lib/components/Feed/FeedLikeButton.js +6 -4
- package/lib/components/Feed/FeedLikeButton.js.map +1 -1
- package/lib/components/Feed/FeedModalList.d.ts +2 -0
- package/lib/components/Feed/FeedModalList.d.ts.map +1 -1
- package/lib/components/Feed/FeedModalList.js +25 -38
- package/lib/components/Feed/FeedModalList.js.map +1 -1
- package/lib/components/Feed/FeedPost.d.ts.map +1 -1
- package/lib/components/Feed/FeedPost.js +7 -5
- package/lib/components/Feed/FeedPost.js.map +1 -1
- package/lib/components/Feed/FeedPost.types.d.ts +4 -0
- package/lib/components/Feed/FeedPost.types.d.ts.map +1 -1
- package/lib/components/Feed/FeedPost.types.js.map +1 -1
- package/lib/components/Feed/FeedReply.d.ts.map +1 -1
- package/lib/components/Feed/FeedReply.js +2 -2
- package/lib/components/Feed/FeedReply.js.map +1 -1
- package/lib/components/Feed/FeedReply.types.d.ts +2 -0
- package/lib/components/Feed/FeedReply.types.d.ts.map +1 -1
- package/lib/components/Feed/FeedReply.types.js.map +1 -1
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailComposer.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAGL,IAAI,
|
|
1
|
+
{"version":3,"file":"EmailComposer.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAGL,IAAI,EAYL,MAAM,yBAAyB,CAAC;AAOjC,OAAO,EAAE,kBAAkB,EAAa,MAAM,eAAe,CAAC;AAK9D,eAAO,MAAM,mBAAmB,yHAW9B,CAAC;AAEH,eAAO,MAAM,sBAAsB,EAAE,OAAO,IAI1C,CAAC;AAIH,eAAO,MAAM,kBAAkB,qNAK7B,CAAC;AAmBH,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,CAqVxD,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -2,7 +2,7 @@ import { createElement as _createElement } from "react";
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef, useState, useMemo, useRef, useCallback, useEffect } from 'react';
|
|
4
4
|
import styled, { css } from 'styled-components';
|
|
5
|
-
import { Button, Flex, Icon, registerIcon, useI18n, Option, defaultThemeProp, FileUploadItem, MenuButton, Select, Input, useUID } from '@pega/cosmos-react-core';
|
|
5
|
+
import { Button, Flex, Icon, registerIcon, useI18n, Option, defaultThemeProp, FileUploadItem, MenuButton, Select, Input, useUID, Progress } from '@pega/cosmos-react-core';
|
|
6
6
|
import { RichTextEditor } from '@pega/cosmos-react-rte';
|
|
7
7
|
import * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';
|
|
8
8
|
import * as replyAllIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply-all.icon';
|
|
@@ -10,9 +10,18 @@ import * as replyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/re
|
|
|
10
10
|
import * as forwardIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/forward.icon';
|
|
11
11
|
import EmailSelector from './EmailSelector';
|
|
12
12
|
registerIcon(paperClipIcon, replyAllIcon, replyIcon, forwardIcon);
|
|
13
|
-
export const StyledEmailComposer = styled.div
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
export const StyledEmailComposer = styled.div(({ progress }) => {
|
|
14
|
+
return css `
|
|
15
|
+
max-height: 70vh;
|
|
16
|
+
${progress
|
|
17
|
+
? css `
|
|
18
|
+
visibility: hidden;
|
|
19
|
+
`
|
|
20
|
+
: css `
|
|
21
|
+
visibility: visible;
|
|
22
|
+
`}
|
|
23
|
+
`;
|
|
24
|
+
});
|
|
16
25
|
export const StyledResponseTypeIcon = styled(Icon)(({ theme }) => {
|
|
17
26
|
return css `
|
|
18
27
|
color: ${theme.base.palette.interactive};
|
|
@@ -39,7 +48,7 @@ const rteToolbar = [
|
|
|
39
48
|
'cut-copy-paste',
|
|
40
49
|
'indentation'
|
|
41
50
|
];
|
|
42
|
-
const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend, onImageAdded, externalValidator, onTemplateChange, to, footerMoreActions, templates, defaultTemplateId, ...restProps }, ref) => {
|
|
51
|
+
const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend, onImageAdded, externalValidator, onTemplateChange, to, footerMoreActions, progress = false, templates, defaultTemplateId, ...restProps }, ref) => {
|
|
43
52
|
const t = useI18n();
|
|
44
53
|
const [cc, setCC] = useState(restProps.cc);
|
|
45
54
|
const [bcc, setBCC] = useState(restProps.bcc);
|
|
@@ -165,28 +174,34 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
|
|
|
165
174
|
responseType
|
|
166
175
|
});
|
|
167
176
|
};
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
}, children: [_jsx(
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
177
|
+
const handleImageAdded = (image, id) => {
|
|
178
|
+
const src = URL.createObjectURL(image);
|
|
179
|
+
rteEditorRef.current?.appendImage({ src, alt: image.name }, id);
|
|
180
|
+
if (onImageAdded)
|
|
181
|
+
onImageAdded(image, id);
|
|
182
|
+
};
|
|
183
|
+
return (_jsxs(_Fragment, { children: [_jsxs(Flex, { as: StyledEmailComposer, ref: ref, ...restProps, container: {
|
|
184
|
+
gap: 2,
|
|
185
|
+
direction: 'column'
|
|
186
|
+
}, progress: !!progress, children: [_jsx("div", { children: responseType !== 'forward' && (_jsx(MenuButton, { text: responseTypeMenuData.selectedResponseType, variant: 'link', icon: responseTypeMenuData.selectedResponseTypeIcon, menu: {
|
|
187
|
+
mode: 'single-select',
|
|
188
|
+
items: responseTypeMenuData.menuItems
|
|
189
|
+
} }, void 0)) }, void 0), _jsxs(Flex, { container: {
|
|
190
|
+
alignItems: 'start',
|
|
191
|
+
gap: 0.5
|
|
192
|
+
}, children: [_jsx(Flex, { container: {
|
|
193
|
+
gap: 1,
|
|
194
|
+
direction: 'column'
|
|
195
|
+
}, item: {
|
|
196
|
+
grow: 1
|
|
197
|
+
}, children: _jsx(EmailSelector, { participants: participants, defaultSelections: to?.[responseType], label: t('to'), mode: 'multi-select', required: true, selections: selectedItems, externalValidator: externalValidator }, void 0) }, void 0), !showCC && (_jsx(StyledToggleButton, { variant: 'simple', onClick: () => setShowCC(true), icon: true, children: t('cc') }, void 0)), !showBCC && (_jsx(StyledToggleButton, { variant: 'simple', onClick: () => setShowBCC(true), icon: true, children: t('bcc') }, void 0))] }, void 0), showCC && (_jsx(EmailSelector, { participants: participants, defaultSelections: responseType === 'replyAll' ? cc : undefined, label: t('cc'), mode: 'multi-select', selections: selectedItems, externalValidator: externalValidator }, void 0)), showBCC && (_jsx(EmailSelector, { selections: selectedItems, participants: participants, defaultSelections: responseType === 'replyAll' ? bcc : undefined, label: t('bcc'), mode: 'multi-select', externalValidator: externalValidator }, void 0)), _jsx(Input, { value: subject, onChange: onSubjectChange, label: t('subject') }, void 0), _jsxs(Select, { onChange: onTemplateSelectionChange, label: t('auto_reply'), value: autoReplyTemplate, children: [_jsx(Option, { value: uid, children: t('insert') }, uid), _jsx(_Fragment, { children: templateOptions }, void 0)] }, void 0), _jsx(RichTextEditor, { autoFocus: true, ref: rteEditorRef, toolbar: rteToolbar, onImageAdded: handleImageAdded, labelHidden: true, label: t('email_message'), defaultValue: bodyContent,
|
|
198
|
+
// Below rem values are derived from min 150px, max 300px minus the approx height of toolbar
|
|
199
|
+
height: {
|
|
200
|
+
min: '7rem',
|
|
201
|
+
max: '16.5rem'
|
|
202
|
+
} }, void 0), attachments.length > 0 && (_jsx(Flex, { container: { gap: 1, wrap: 'wrap' }, children: attachments.map(attachment => (_createElement(FileUploadItem, { ...attachment, key: attachment.name, onDelete: onAttachmentDelete }))) }, void 0)), _jsxs(Flex, { container: {
|
|
203
|
+
gap: 1
|
|
204
|
+
}, children: [_jsxs(Flex, { container: true, item: { grow: 1 }, children: [_jsx(Button, { variant: 'secondary', onClick: onCancel, children: t('cancel') }, void 0), footerMoreActions] }, void 0), _jsxs(Flex, { container: true, children: [_jsx(Button, { onClick: () => fileUploadInputRef.current?.click(), variant: 'link', label: t('file_upload_text_multiple'), children: _jsx(Icon, { name: 'paper-clip' }, void 0) }, void 0), _jsx(Button, { variant: 'primary', onClick: handleSend, children: t('send_label') }, void 0)] }, void 0)] }, void 0), _jsx("input", { type: 'file', style: { display: 'none' }, ref: fileUploadInputRef, onChange: onFileChange, multiple: true }, void 0)] }, void 0), !!progress && (_jsx(Progress, { visible: !!progress, placement: 'local', message: typeof progress === 'object' ? progress.message : t('loading') }, void 0))] }, void 0));
|
|
190
205
|
});
|
|
191
206
|
export default EmailComposer;
|
|
192
207
|
//# sourceMappingURL=EmailComposer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailComposer.js","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useState,\n ChangeEvent,\n useMemo,\n useRef,\n useCallback,\n useEffect,\n ReactNode\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Flex,\n Icon,\n registerIcon,\n useI18n,\n Option,\n defaultThemeProp,\n FileUploadItem,\n MenuButton,\n FileUploadItemProps,\n Select,\n Input,\n useUID\n} from '@pega/cosmos-react-core';\nimport { RichTextEditor, RichTextEditorProps, RichTextEditorState } from '@pega/cosmos-react-rte';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\nimport * as replyAllIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply-all.icon';\nimport * as replyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply.icon';\nimport * as forwardIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/forward.icon';\n\nimport { EmailComposerProps, EmailUser } from './Email.types';\nimport EmailSelector from './EmailSelector';\n\nregisterIcon(paperClipIcon, replyAllIcon, replyIcon, forwardIcon);\n\nexport const StyledEmailComposer = styled.div`\n max-height: 70vh;\n`;\n\nexport const StyledResponseTypeIcon: typeof Icon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.palette.interactive};\n `;\n});\n\nStyledResponseTypeIcon.defaultProps = defaultThemeProp;\n\nexport const StyledToggleButton = styled(Button)(({ theme }) => {\n return css`\n margin-block-start: calc(2 * ${theme.base.spacing});\n color: ${theme.base.palette.interactive};\n `;\n});\n\nStyledToggleButton.defaultProps = defaultThemeProp;\n\nconst responseTypeIcons = {\n reply: 'reply',\n replyAll: 'reply-all',\n forward: 'forward'\n};\n\nconst rteToolbar: RichTextEditorProps['toolbar'] = [\n 'inline-styling',\n 'headers',\n 'lists',\n 'images',\n 'cut-copy-paste',\n 'indentation'\n];\n\nconst EmailComposer: FunctionComponent<EmailComposerProps> = forwardRef(\n (\n {\n participants,\n bodyContent,\n onCancel,\n onSend,\n onImageAdded,\n externalValidator,\n onTemplateChange,\n to,\n footerMoreActions,\n templates,\n defaultTemplateId,\n ...restProps\n }: PropsWithoutRef<EmailComposerProps>,\n ref: EmailComposerProps['ref']\n ) => {\n const t = useI18n();\n const [cc, setCC] = useState(restProps.cc);\n const [bcc, setBCC] = useState(restProps.bcc);\n const [responseType, setResponseType] = useState(restProps.responseType);\n const [showCC, setShowCC] = useState(\n restProps.responseType !== 'reply' && !!cc && cc.length > 0\n );\n const [showBCC, setShowBCC] = useState(\n restProps.responseType !== 'reply' && !!bcc && bcc.length > 0\n );\n const [subject, setSubject] = useState(restProps.subject);\n const [autoReplyTemplate, setAutoReplyTemplate] = useState(defaultTemplateId || '');\n const [attachments, setAttachments] = useState(restProps.attachments || []);\n const [toAddresses, setToAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n if (responseType && to?.[responseType])\n return to?.[responseType] as EmailUser['emailAddress'][];\n return [];\n });\n const [ccAddresses, setCcAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n if (responseType === 'replyAll') return cc as EmailUser['emailAddress'][];\n return [];\n });\n const [bccAddresses, setBccAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n if (responseType === 'replyAll') return bcc as EmailUser['emailAddress'][];\n return [];\n });\n\n const initialCC = cc;\n const initialBCC = bcc;\n\n const rteEditorRef = useRef<RichTextEditorState>(null);\n const fileUploadInputRef = useRef<HTMLInputElement>(null);\n const uid = useUID();\n\n // inserts selected template in RTE\n useEffect(() => {\n const selectedTemplate = templates?.find(template => template.id === autoReplyTemplate);\n if (selectedTemplate) {\n rteEditorRef?.current?.insertHtml(onTemplateChange?.(selectedTemplate.id) as string, true);\n }\n }, [autoReplyTemplate]);\n\n // resets To | CC | BCC combobox selection and toggles fields on responseType change reply | replyAll | forward\n useEffect(() => {\n setShowCC(responseType === 'replyAll' ? !!cc && cc.length > 0 : false);\n setShowBCC(responseType === 'replyAll' && !!bcc && bcc?.length > 0 ? !!bcc : false);\n if (responseType === 'replyAll') {\n setCC(initialCC);\n setBCC(initialBCC);\n }\n if (responseType === 'reply') {\n setCcAddresses([] as EmailUser['emailAddress'][]);\n setBccAddresses([] as EmailUser['emailAddress'][]);\n }\n }, [responseType]);\n\n const templateOptions = useMemo(\n () =>\n templates &&\n templates.map(template => {\n if (template.id === defaultTemplateId) {\n <Option selected='selected' key={template.id} value={template.id}>\n {template.title}\n </Option>;\n }\n return (\n <Option key={template.id} value={template.id}>\n {template.title}\n </Option>\n );\n }),\n [templates]\n );\n\n const responseTypeMenuData = useMemo(() => {\n const menuItems = [\n {\n id: 'reply',\n primary: t('reply'),\n visual: <StyledResponseTypeIcon name={responseTypeIcons.reply} />,\n selected: responseType === 'reply',\n onClick: () => {\n setResponseType('reply');\n }\n },\n {\n id: 'replyAll',\n primary: t('reply_all'),\n visual: <StyledResponseTypeIcon name={responseTypeIcons.replyAll} />,\n selected: responseType === 'replyAll',\n onClick: () => {\n setResponseType('replyAll');\n }\n }\n ];\n return {\n menuItems,\n selectedResponseType:\n menuItems.find(item => item.selected)?.primary || menuItems[0].primary,\n selectedResponseTypeIcon:\n (responseType && responseTypeIcons[responseType]) || responseTypeIcons.reply\n };\n }, [responseType]);\n\n const onSubjectChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n setSubject(e.target.value);\n }, []);\n\n const onTemplateSelectionChange = useCallback((e: ChangeEvent<HTMLSelectElement>) => {\n setAutoReplyTemplate(e.target.value);\n }, []);\n\n const onAttachmentDelete = useCallback((name: FileUploadItemProps['name']) => {\n setAttachments(prevAttachments => prevAttachments.filter(item => item.name !== name));\n }, []);\n\n const onFileChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n if (e.target.files) {\n setAttachments(prevAttachments => [\n ...prevAttachments,\n ...Array.from(e.target.files!).map(file => ({\n name: file.name,\n file\n }))\n ]);\n }\n }, []);\n\n const selectedItems = (selections: EmailUser['emailAddress'][], label: ReactNode) => {\n if (label === 'To') {\n setToAddresses(selections);\n }\n if (label === 'Cc') {\n setCcAddresses(selections);\n }\n if (label === 'Bcc') {\n setBccAddresses(selections);\n }\n };\n const handleSend = () => {\n onSend({\n to: toAddresses,\n cc: showCC ? ccAddresses : undefined,\n bcc: showBCC ? bccAddresses : undefined,\n subject,\n bodyContent: rteEditorRef.current?.getHtml() || '',\n attachments,\n responseType\n });\n };\n\n return (\n <Flex\n as={StyledEmailComposer}\n ref={ref}\n {...restProps}\n container={{\n gap: 2,\n direction: 'column'\n }}\n >\n <div>\n {responseType !== 'forward' && (\n <MenuButton\n text={responseTypeMenuData.selectedResponseType}\n variant='link'\n icon={responseTypeMenuData.selectedResponseTypeIcon}\n menu={{\n mode: 'single-select',\n items: responseTypeMenuData.menuItems\n }}\n />\n )}\n </div>\n\n <Flex\n container={{\n alignItems: 'start',\n gap: 0.5\n }}\n >\n <Flex\n container={{\n gap: 1,\n direction: 'column'\n }}\n item={{\n grow: 1\n }}\n >\n <EmailSelector\n participants={participants}\n defaultSelections={to?.[responseType!]}\n label={t('to')}\n mode='multi-select'\n required\n selections={selectedItems}\n externalValidator={externalValidator}\n />\n </Flex>\n {!showCC && (\n <StyledToggleButton variant='simple' onClick={() => setShowCC(true)} icon>\n {t('cc')}\n </StyledToggleButton>\n )}\n {!showBCC && (\n <StyledToggleButton variant='simple' onClick={() => setShowBCC(true)} icon>\n {t('bcc')}\n </StyledToggleButton>\n )}\n </Flex>\n\n {showCC && (\n <EmailSelector\n participants={participants}\n defaultSelections={responseType === 'replyAll' ? cc : undefined}\n label={t('cc')}\n mode='multi-select'\n selections={selectedItems}\n externalValidator={externalValidator}\n />\n )}\n {showBCC && (\n <EmailSelector\n selections={selectedItems}\n participants={participants}\n defaultSelections={responseType === 'replyAll' ? bcc : undefined}\n label={t('bcc')}\n mode='multi-select'\n externalValidator={externalValidator}\n />\n )}\n\n <Input value={subject} onChange={onSubjectChange} label={t('subject')} />\n\n <Select\n onChange={onTemplateSelectionChange}\n label={t('auto_reply')}\n value={autoReplyTemplate}\n >\n <Option key={uid} value={uid}>\n {t('insert')}\n </Option>\n <>{templateOptions}</>\n </Select>\n\n <RichTextEditor\n autoFocus\n ref={rteEditorRef}\n toolbar={rteToolbar}\n onImageAdded={onImageAdded}\n labelHidden\n label={t('email_message')}\n defaultValue={bodyContent}\n // Below rem values are derived from min 150px, max 300px minus the approx height of toolbar\n height={{\n min: '7rem',\n max: '16.5rem'\n }}\n />\n {attachments.length > 0 && (\n <Flex container={{ gap: 1, wrap: 'wrap' }}>\n {attachments.map(attachment => (\n <FileUploadItem {...attachment} key={attachment.name} onDelete={onAttachmentDelete} />\n ))}\n </Flex>\n )}\n <Flex\n container={{\n gap: 1\n }}\n >\n <Flex container item={{ grow: 1 }}>\n <Button variant='secondary' onClick={onCancel}>\n {t('cancel')}\n </Button>\n {footerMoreActions}\n </Flex>\n <Flex container>\n <Button\n onClick={() => fileUploadInputRef.current?.click()}\n variant='link'\n label={t('file_upload_text_multiple')}\n >\n <Icon name='paper-clip' />\n </Button>\n\n <Button variant='primary' onClick={handleSend}>\n {t('send_label')}\n </Button>\n </Flex>\n </Flex>\n <input\n type='file'\n style={{ display: 'none' }}\n ref={fileUploadInputRef}\n onChange={onFileChange}\n multiple\n />\n </Flex>\n );\n }\n);\n\nexport default EmailComposer;\n"]}
|
|
1
|
+
{"version":3,"file":"EmailComposer.js","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useState,\n ChangeEvent,\n useMemo,\n useRef,\n useCallback,\n useEffect,\n ReactNode\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Flex,\n Icon,\n registerIcon,\n useI18n,\n Option,\n defaultThemeProp,\n FileUploadItem,\n MenuButton,\n FileUploadItemProps,\n Select,\n Input,\n useUID,\n Progress\n} from '@pega/cosmos-react-core';\nimport { RichTextEditor, RichTextEditorProps, RichTextEditorState } from '@pega/cosmos-react-rte';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\nimport * as replyAllIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply-all.icon';\nimport * as replyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply.icon';\nimport * as forwardIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/forward.icon';\n\nimport { EmailComposerProps, EmailUser } from './Email.types';\nimport EmailSelector from './EmailSelector';\n\nregisterIcon(paperClipIcon, replyAllIcon, replyIcon, forwardIcon);\n\nexport const StyledEmailComposer = styled.div<EmailComposerProps>(({ progress }) => {\n return css`\n max-height: 70vh;\n ${progress\n ? css`\n visibility: hidden;\n `\n : css`\n visibility: visible;\n `}\n `;\n});\n\nexport const StyledResponseTypeIcon: typeof Icon = styled(Icon)(({ theme }) => {\n return css`\n color: ${theme.base.palette.interactive};\n `;\n});\n\nStyledResponseTypeIcon.defaultProps = defaultThemeProp;\n\nexport const StyledToggleButton = styled(Button)(({ theme }) => {\n return css`\n margin-block-start: calc(2 * ${theme.base.spacing});\n color: ${theme.base.palette.interactive};\n `;\n});\n\nStyledToggleButton.defaultProps = defaultThemeProp;\n\nconst responseTypeIcons = {\n reply: 'reply',\n replyAll: 'reply-all',\n forward: 'forward'\n};\n\nconst rteToolbar: RichTextEditorProps['toolbar'] = [\n 'inline-styling',\n 'headers',\n 'lists',\n 'images',\n 'cut-copy-paste',\n 'indentation'\n];\n\nconst EmailComposer: FunctionComponent<EmailComposerProps> = forwardRef(\n (\n {\n participants,\n bodyContent,\n onCancel,\n onSend,\n onImageAdded,\n externalValidator,\n onTemplateChange,\n to,\n footerMoreActions,\n progress = false,\n templates,\n defaultTemplateId,\n ...restProps\n }: PropsWithoutRef<EmailComposerProps>,\n ref: EmailComposerProps['ref']\n ) => {\n const t = useI18n();\n const [cc, setCC] = useState(restProps.cc);\n const [bcc, setBCC] = useState(restProps.bcc);\n const [responseType, setResponseType] = useState(restProps.responseType);\n const [showCC, setShowCC] = useState(\n restProps.responseType !== 'reply' && !!cc && cc.length > 0\n );\n const [showBCC, setShowBCC] = useState(\n restProps.responseType !== 'reply' && !!bcc && bcc.length > 0\n );\n const [subject, setSubject] = useState(restProps.subject);\n const [autoReplyTemplate, setAutoReplyTemplate] = useState(defaultTemplateId || '');\n const [attachments, setAttachments] = useState(restProps.attachments || []);\n const [toAddresses, setToAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n if (responseType && to?.[responseType])\n return to?.[responseType] as EmailUser['emailAddress'][];\n return [];\n });\n const [ccAddresses, setCcAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n if (responseType === 'replyAll') return cc as EmailUser['emailAddress'][];\n return [];\n });\n const [bccAddresses, setBccAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n if (responseType === 'replyAll') return bcc as EmailUser['emailAddress'][];\n return [];\n });\n\n const initialCC = cc;\n const initialBCC = bcc;\n\n const rteEditorRef = useRef<RichTextEditorState>(null);\n const fileUploadInputRef = useRef<HTMLInputElement>(null);\n const uid = useUID();\n\n // inserts selected template in RTE\n useEffect(() => {\n const selectedTemplate = templates?.find(template => template.id === autoReplyTemplate);\n if (selectedTemplate) {\n rteEditorRef?.current?.insertHtml(onTemplateChange?.(selectedTemplate.id) as string, true);\n }\n }, [autoReplyTemplate]);\n\n // resets To | CC | BCC combobox selection and toggles fields on responseType change reply | replyAll | forward\n useEffect(() => {\n setShowCC(responseType === 'replyAll' ? !!cc && cc.length > 0 : false);\n setShowBCC(responseType === 'replyAll' && !!bcc && bcc?.length > 0 ? !!bcc : false);\n if (responseType === 'replyAll') {\n setCC(initialCC);\n setBCC(initialBCC);\n }\n if (responseType === 'reply') {\n setCcAddresses([] as EmailUser['emailAddress'][]);\n setBccAddresses([] as EmailUser['emailAddress'][]);\n }\n }, [responseType]);\n\n const templateOptions = useMemo(\n () =>\n templates &&\n templates.map(template => {\n if (template.id === defaultTemplateId) {\n <Option selected='selected' key={template.id} value={template.id}>\n {template.title}\n </Option>;\n }\n return (\n <Option key={template.id} value={template.id}>\n {template.title}\n </Option>\n );\n }),\n [templates]\n );\n\n const responseTypeMenuData = useMemo(() => {\n const menuItems = [\n {\n id: 'reply',\n primary: t('reply'),\n visual: <StyledResponseTypeIcon name={responseTypeIcons.reply} />,\n selected: responseType === 'reply',\n onClick: () => {\n setResponseType('reply');\n }\n },\n {\n id: 'replyAll',\n primary: t('reply_all'),\n visual: <StyledResponseTypeIcon name={responseTypeIcons.replyAll} />,\n selected: responseType === 'replyAll',\n onClick: () => {\n setResponseType('replyAll');\n }\n }\n ];\n return {\n menuItems,\n selectedResponseType:\n menuItems.find(item => item.selected)?.primary || menuItems[0].primary,\n selectedResponseTypeIcon:\n (responseType && responseTypeIcons[responseType]) || responseTypeIcons.reply\n };\n }, [responseType]);\n\n const onSubjectChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n setSubject(e.target.value);\n }, []);\n\n const onTemplateSelectionChange = useCallback((e: ChangeEvent<HTMLSelectElement>) => {\n setAutoReplyTemplate(e.target.value);\n }, []);\n\n const onAttachmentDelete = useCallback((name: FileUploadItemProps['name']) => {\n setAttachments(prevAttachments => prevAttachments.filter(item => item.name !== name));\n }, []);\n\n const onFileChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n if (e.target.files) {\n setAttachments(prevAttachments => [\n ...prevAttachments,\n ...Array.from(e.target.files!).map(file => ({\n name: file.name,\n file\n }))\n ]);\n }\n }, []);\n\n const selectedItems = (selections: EmailUser['emailAddress'][], label: ReactNode) => {\n if (label === 'To') {\n setToAddresses(selections);\n }\n if (label === 'Cc') {\n setCcAddresses(selections);\n }\n if (label === 'Bcc') {\n setBccAddresses(selections);\n }\n };\n const handleSend = () => {\n onSend({\n to: toAddresses,\n cc: showCC ? ccAddresses : undefined,\n bcc: showBCC ? bccAddresses : undefined,\n subject,\n bodyContent: rteEditorRef.current?.getHtml() || '',\n attachments,\n responseType\n });\n };\n\n const handleImageAdded = (image: File, id: string) => {\n const src = URL.createObjectURL(image);\n rteEditorRef.current?.appendImage({ src, alt: image.name }, id);\n if (onImageAdded) onImageAdded(image, id);\n };\n\n return (\n <>\n <Flex\n as={StyledEmailComposer}\n ref={ref}\n {...restProps}\n container={{\n gap: 2,\n direction: 'column'\n }}\n progress={!!progress}\n >\n <div>\n {responseType !== 'forward' && (\n <MenuButton\n text={responseTypeMenuData.selectedResponseType}\n variant='link'\n icon={responseTypeMenuData.selectedResponseTypeIcon}\n menu={{\n mode: 'single-select',\n items: responseTypeMenuData.menuItems\n }}\n />\n )}\n </div>\n\n <Flex\n container={{\n alignItems: 'start',\n gap: 0.5\n }}\n >\n <Flex\n container={{\n gap: 1,\n direction: 'column'\n }}\n item={{\n grow: 1\n }}\n >\n <EmailSelector\n participants={participants}\n defaultSelections={to?.[responseType!]}\n label={t('to')}\n mode='multi-select'\n required\n selections={selectedItems}\n externalValidator={externalValidator}\n />\n </Flex>\n {!showCC && (\n <StyledToggleButton variant='simple' onClick={() => setShowCC(true)} icon>\n {t('cc')}\n </StyledToggleButton>\n )}\n {!showBCC && (\n <StyledToggleButton variant='simple' onClick={() => setShowBCC(true)} icon>\n {t('bcc')}\n </StyledToggleButton>\n )}\n </Flex>\n\n {showCC && (\n <EmailSelector\n participants={participants}\n defaultSelections={responseType === 'replyAll' ? cc : undefined}\n label={t('cc')}\n mode='multi-select'\n selections={selectedItems}\n externalValidator={externalValidator}\n />\n )}\n {showBCC && (\n <EmailSelector\n selections={selectedItems}\n participants={participants}\n defaultSelections={responseType === 'replyAll' ? bcc : undefined}\n label={t('bcc')}\n mode='multi-select'\n externalValidator={externalValidator}\n />\n )}\n\n <Input value={subject} onChange={onSubjectChange} label={t('subject')} />\n\n <Select\n onChange={onTemplateSelectionChange}\n label={t('auto_reply')}\n value={autoReplyTemplate}\n >\n <Option key={uid} value={uid}>\n {t('insert')}\n </Option>\n <>{templateOptions}</>\n </Select>\n\n <RichTextEditor\n autoFocus\n ref={rteEditorRef}\n toolbar={rteToolbar}\n onImageAdded={handleImageAdded}\n labelHidden\n label={t('email_message')}\n defaultValue={bodyContent}\n // Below rem values are derived from min 150px, max 300px minus the approx height of toolbar\n height={{\n min: '7rem',\n max: '16.5rem'\n }}\n />\n {attachments.length > 0 && (\n <Flex container={{ gap: 1, wrap: 'wrap' }}>\n {attachments.map(attachment => (\n <FileUploadItem\n {...attachment}\n key={attachment.name}\n onDelete={onAttachmentDelete}\n />\n ))}\n </Flex>\n )}\n <Flex\n container={{\n gap: 1\n }}\n >\n <Flex container item={{ grow: 1 }}>\n <Button variant='secondary' onClick={onCancel}>\n {t('cancel')}\n </Button>\n {footerMoreActions}\n </Flex>\n <Flex container>\n <Button\n onClick={() => fileUploadInputRef.current?.click()}\n variant='link'\n label={t('file_upload_text_multiple')}\n >\n <Icon name='paper-clip' />\n </Button>\n\n <Button variant='primary' onClick={handleSend}>\n {t('send_label')}\n </Button>\n </Flex>\n </Flex>\n <input\n type='file'\n style={{ display: 'none' }}\n ref={fileUploadInputRef}\n onChange={onFileChange}\n multiple\n />\n </Flex>\n {!!progress && (\n <Progress\n visible={!!progress}\n placement='local'\n message={typeof progress === 'object' ? progress.message : t('loading')}\n />\n )}\n </>\n );\n }\n);\n\nexport default EmailComposer;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailEntity.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailEntity.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,
|
|
1
|
+
{"version":3,"file":"EmailEntity.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailEntity.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAA2B,MAAM,OAAO,CAAC;AAE/E,OAAO,EACL,YAAY,EAQb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEjD,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAoCnE,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef } from 'react';
|
|
2
|
+
import { forwardRef, useRef } from 'react';
|
|
3
3
|
import { Tooltip, useConsolidatedRef, useElement, useI18n, useConfiguration, formatListToLocaleString, Icon } from '@pega/cosmos-react-core';
|
|
4
4
|
import { StyledEmailEntity } from './Email.styles';
|
|
5
5
|
const EmailEntity = forwardRef(({ entity, ...restProps }, ref) => {
|
|
@@ -7,9 +7,13 @@ const EmailEntity = forwardRef(({ entity, ...restProps }, ref) => {
|
|
|
7
7
|
const elementRef = useConsolidatedRef(setEl, ref);
|
|
8
8
|
const t = useI18n();
|
|
9
9
|
const { locale } = useConfiguration();
|
|
10
|
+
const tooltipRef = useRef(null);
|
|
10
11
|
return (_jsxs(StyledEmailEntity, { ...restProps, entity: entity, ref: elementRef, "aria-label": Array.isArray(entity.description)
|
|
11
12
|
? formatListToLocaleString(entity.description, t, locale)
|
|
12
|
-
: entity.description,
|
|
13
|
+
: entity.description, onContextMenu: () => {
|
|
14
|
+
if (tooltipRef.current)
|
|
15
|
+
tooltipRef.current.hidden = true;
|
|
16
|
+
}, contentEditable: false, children: [entity.value, entity.icon && _jsx(Icon, { name: entity.icon }, void 0), entity.description && (_jsx(Tooltip, { target: el, ref: tooltipRef, children: Array.isArray(entity.description)
|
|
13
17
|
? formatListToLocaleString(entity.description, t, locale, {
|
|
14
18
|
separator: '\n'
|
|
15
19
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailEntity.js","sourceRoot":"","sources":["../../../src/components/Email/EmailEntity.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAsC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"EmailEntity.js","sourceRoot":"","sources":["../../../src/components/Email/EmailEntity.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAsC,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/E,OAAO,EAEL,OAAO,EACP,kBAAkB,EAClB,UAAU,EACV,OAAO,EACP,gBAAgB,EAChB,wBAAwB,EACxB,IAAI,EACL,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGnD,MAAM,WAAW,GAAuD,UAAU,CAChF,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,EAAqC,EAAE,GAA4B,EAAE,EAAE;IAC5F,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,UAAU,EAAe,CAAC;IAC9C,MAAM,UAAU,GAAG,kBAAkB,CAAc,KAAK,EAAE,GAAG,CAAC,CAAC;IAC/D,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACtC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,OAAO,CACL,MAAC,iBAAiB,OACZ,SAAS,EACb,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,UAAU,gBAEb,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC;YAC/B,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,EAAE,MAAM,CAAC;YACzD,CAAC,CAAC,MAAM,CAAC,WAAW,EAExB,aAAa,EAAE,GAAG,EAAE;YAClB,IAAI,UAAU,CAAC,OAAO;gBAAE,UAAU,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;QAC3D,CAAC,EACD,eAAe,EAAE,KAAK,aAErB,MAAM,CAAC,KAAK,EACZ,MAAM,CAAC,IAAI,IAAI,KAAC,IAAI,IAAC,IAAI,EAAE,MAAM,CAAC,IAAI,WAAI,EAC1C,MAAM,CAAC,WAAW,IAAI,CACrB,KAAC,OAAO,IAAC,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,UAAU,YACjC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC;oBAChC,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,EAAE,MAAM,EAAE;wBACtD,SAAS,EAAE,IAAI;qBAChB,CAAC;oBACJ,CAAC,CAAC,MAAM,CAAC,WAAW,WACd,CACX,YACiB,CACrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef } from 'react';\n\nimport {\n ForwardProps,\n Tooltip,\n useConsolidatedRef,\n useElement,\n useI18n,\n useConfiguration,\n formatListToLocaleString,\n Icon\n} from '@pega/cosmos-react-core';\n\nimport { StyledEmailEntity } from './Email.styles';\nimport { EmailEntityProps } from './Email.types';\n\nconst EmailEntity: FunctionComponent<EmailEntityProps & ForwardProps> = forwardRef(\n ({ entity, ...restProps }: PropsWithoutRef<EmailEntityProps>, ref: EmailEntityProps['ref']) => {\n const [el, setEl] = useElement<HTMLElement>();\n const elementRef = useConsolidatedRef<HTMLElement>(setEl, ref);\n const t = useI18n();\n const { locale } = useConfiguration();\n const tooltipRef = useRef<HTMLDivElement>(null);\n return (\n <StyledEmailEntity\n {...restProps}\n entity={entity}\n ref={elementRef}\n aria-label={\n Array.isArray(entity.description)\n ? formatListToLocaleString(entity.description, t, locale)\n : entity.description\n }\n onContextMenu={() => {\n if (tooltipRef.current) tooltipRef.current.hidden = true;\n }}\n contentEditable={false}\n >\n {entity.value}\n {entity.icon && <Icon name={entity.icon} />}\n {entity.description && (\n <Tooltip target={el} ref={tooltipRef}>\n {Array.isArray(entity.description)\n ? formatListToLocaleString(entity.description, t, locale, {\n separator: '\\n'\n })\n : entity.description}\n </Tooltip>\n )}\n </StyledEmailEntity>\n );\n }\n);\n\nexport default EmailEntity;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailSummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,
|
|
1
|
+
{"version":3,"file":"EmailSummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAsB,MAAM,OAAO,CAAC;AAI1E,OAAO,EAEL,YAAY,EAUb,MAAM,yBAAyB,CAAC;AAIjC,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAsCtD,UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,iBAAiB,EAAE,OAAO,CAAC;CAC5B;AACD,eAAO,MAAM,sBAAsB,qIA2BjC,CAAC;AAMH,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CAoF7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, useMemo } from 'react';
|
|
3
3
|
import styled, { css } from 'styled-components';
|
|
4
4
|
import { mix } from 'polished';
|
|
@@ -70,11 +70,19 @@ StyledParticipants.defaultProps = defaultThemeProp;
|
|
|
70
70
|
StyledMessage.defaultProps = defaultThemeProp;
|
|
71
71
|
const EmailSummaryItem = forwardRef(({ id, activeParticipants, sentiment, message, timeStamp, topic, urgency, active = false, onClick, unreadEmailCount, ...restProps }, ref) => {
|
|
72
72
|
const t = useI18n();
|
|
73
|
-
const items = useMemo(() =>
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
73
|
+
const items = useMemo(() => {
|
|
74
|
+
const itemList = [];
|
|
75
|
+
if (typeof topic === 'string' && topic.length > 0) {
|
|
76
|
+
itemList.push(_jsx(Status, { variant: 'info', children: topic }, 'info'));
|
|
77
|
+
}
|
|
78
|
+
if (sentiment) {
|
|
79
|
+
itemList.push(_jsx(Sentiment, { variant: sentiment.variant, labelHidden: true }, void 0));
|
|
80
|
+
}
|
|
81
|
+
if (typeof urgency === 'number') {
|
|
82
|
+
itemList.push(_jsx(Text, { variant: 'secondary', children: `${t('priority')} ${urgency}` }, void 0));
|
|
83
|
+
}
|
|
84
|
+
return itemList;
|
|
85
|
+
}, [sentiment, topic, urgency]);
|
|
78
86
|
const emailParticipants = useMemo(() => {
|
|
79
87
|
let participants = '';
|
|
80
88
|
if (activeParticipants.length > 0) {
|
|
@@ -85,7 +93,7 @@ const EmailSummaryItem = forwardRef(({ id, activeParticipants, sentiment, messag
|
|
|
85
93
|
}
|
|
86
94
|
return participants;
|
|
87
95
|
}, [activeParticipants]);
|
|
88
|
-
return (_jsxs(BareButton, { as: StyledEmailSummaryItem, ref: ref, ...restProps, id: id, onClick: onClick, active: active, "aria-selected": active, "aria-label": `${emailParticipants}, ${message} ${timeStamp} ${topic} ${sentiment?.variant} ${t('priority')} ${urgency}`, tabIndex: -1, children: [_jsxs(StyledParticipants, { unreadEmailCount: unreadEmailCount, container: { justify: 'between' }, children: [_jsx(Text, { variant:
|
|
96
|
+
return (_jsxs(BareButton, { as: StyledEmailSummaryItem, ref: ref, ...restProps, id: id, onClick: onClick, active: active, "aria-selected": active, "aria-label": `${emailParticipants}, ${message} ${timeStamp} ${topic} ${sentiment?.variant} ${t('priority')} ${urgency}`, tabIndex: -1, children: [_jsxs(StyledParticipants, { unreadEmailCount: unreadEmailCount, container: { justify: 'between' }, children: [_jsx(Text, { variant: 'h4', children: emailParticipants }, void 0), typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (_jsx(Count, { variant: 'default', children: unreadEmailCount }, void 0))] }, void 0), _jsxs(Flex, { container: {
|
|
89
97
|
justify: 'between'
|
|
90
98
|
}, as: StyledMessageAndDate, children: [_jsx(StyledMessage, { unreadEmailCount: unreadEmailCount, children: message }, void 0), _jsx(DateTimeDisplay, { value: timeStamp, variant: 'date', format: 'short' }, void 0)] }, void 0), _jsx(MetaList, { items: items }, void 0)] }, void 0));
|
|
91
99
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailSummaryItem.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"EmailSummaryItem.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, ReactNode, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport {\n defaultThemeProp,\n ForwardProps,\n Text,\n Flex,\n Count,\n Sentiment,\n MetaList,\n DateTimeDisplay,\n Status,\n tryCatch,\n useI18n\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\n\nimport { EmailSummaryItemProps } from './Email.types';\n\nconst StyledMessage = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n margin-inline-end: ${theme.base.spacing};\n ${unreadEmailCount !== undefined &&\n unreadEmailCount > 0 &&\n css`\n color: ${theme.base.palette.interactive};\n `}\n `;\n});\n\nconst StyledMessageAndDate = styled.div`\n white-space: nowrap;\n`;\n\nconst StyledParticipants = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n return css`\n ${unreadEmailCount !== undefined &&\n unreadEmailCount > 0 &&\n css`\n position: relative;\n &::before {\n content: '';\n position: absolute;\n inset-inline: calc(-1.5 * ${theme.base.spacing});\n inset-block-start: calc(0.8 * ${theme.base.spacing});\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: ${theme.base.palette.interactive};\n }\n `}\n `;\n});\ninterface StyledEmailSummaryItemProps extends EmailSummaryItemProps {\n isEmailItemActive: boolean;\n}\nexport const StyledEmailSummaryItem = styled.button<StyledEmailSummaryItemProps>(({ theme }) => {\n const hoverColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n return css`\n width: 100%;\n color: ${theme.base.palette['foreground-color']};\n background-color: ${theme.base.palette['primary-background']};\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n ${StyledMetaList}, ${StyledMessageAndDate} {\n margin-block-start: ${theme.base.spacing};\n }\n & + & {\n margin-inline-start: 0;\n }\n\n &[aria-selected='true'],\n &[data-current='true'] {\n background-color: ${theme.base.palette['secondary-background']};\n }\n\n &:hover,\n &:focus-within {\n background-color: ${hoverColor};\n }\n `;\n});\n\nStyledEmailSummaryItem.defaultProps = defaultThemeProp;\nStyledParticipants.defaultProps = defaultThemeProp;\nStyledMessage.defaultProps = defaultThemeProp;\n\nconst EmailSummaryItem: FunctionComponent<EmailSummaryItemProps & ForwardProps> = forwardRef(\n (\n {\n id,\n activeParticipants,\n sentiment,\n message,\n timeStamp,\n topic,\n urgency,\n active = false,\n onClick,\n unreadEmailCount,\n ...restProps\n },\n ref: EmailSummaryItemProps['ref']\n ) => {\n const t = useI18n();\n const items = useMemo(() => {\n const itemList: ReactNode[] = [];\n\n if (typeof topic === 'string' && topic.length > 0) {\n itemList.push(\n <Status variant='info' key='info'>\n {topic}\n </Status>\n );\n }\n\n if (sentiment) {\n itemList.push(<Sentiment variant={sentiment.variant} labelHidden />);\n }\n\n if (typeof urgency === 'number') {\n itemList.push(<Text variant='secondary'>{`${t('priority')} ${urgency}`}</Text>);\n }\n\n return itemList;\n }, [sentiment, topic, urgency]);\n\n const emailParticipants = useMemo(() => {\n let participants = '';\n if (activeParticipants.length > 0) {\n participants =\n activeParticipants.length === 1\n ? activeParticipants[0].fullName\n : activeParticipants.map(participant => `${participant.shortName}`).join(', ');\n }\n return participants;\n }, [activeParticipants]);\n\n return (\n <BareButton\n as={StyledEmailSummaryItem}\n ref={ref}\n {...restProps}\n id={id}\n onClick={onClick}\n active={active}\n aria-selected={active}\n aria-label={`${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n sentiment?.variant\n } ${t('priority')} ${urgency}`}\n tabIndex={-1}\n >\n <StyledParticipants unreadEmailCount={unreadEmailCount} container={{ justify: 'between' }}>\n <Text variant='h4'>{emailParticipants}</Text>\n {typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (\n <Count variant='default'>{unreadEmailCount}</Count>\n )}\n </StyledParticipants>\n <Flex\n container={{\n justify: 'between'\n }}\n as={StyledMessageAndDate}\n >\n <StyledMessage unreadEmailCount={unreadEmailCount}>{message}</StyledMessage>\n <DateTimeDisplay value={timeStamp} variant='date' format='short' />\n </Flex>\n <MetaList items={items} />\n </BareButton>\n );\n }\n);\n\nexport default EmailSummaryItem;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmailSummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"EmailSummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,iBAAiB,EAElB,MAAM,OAAO,CAAC;AAGf,OAAO,EAKL,YAAY,EAkBb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AA+DtD,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CAyL7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { createRef, useMemo, useState, useEffect, forwardRef
|
|
2
|
+
import { createRef, useMemo, useState, useEffect, forwardRef } from 'react';
|
|
3
3
|
import styled, { css } from 'styled-components';
|
|
4
|
-
import { Button, Count, defaultThemeProp, Flex, Icon, registerIcon, MenuButton, Text, useActiveDescendant, useConsolidatedRef, useI18n, menuHelpers } from '@pega/cosmos-react-core';
|
|
4
|
+
import { Button, Count, defaultThemeProp, Flex, Icon, registerIcon, MenuButton, Text, useActiveDescendant, useLazyDescendant, useConsolidatedRef, useI18n, menuHelpers, Progress, useItemIntersection, usePrevious, VisuallyHiddenText, EmptyState, calculateFontSize, StyledText } from '@pega/cosmos-react-core';
|
|
5
5
|
import * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';
|
|
6
6
|
import EmailSummaryItem, { StyledEmailSummaryItem } from './EmailSummaryItem';
|
|
7
|
+
import { StyledLoadMore } from './Email.styles';
|
|
7
8
|
registerIcon(filterIcon);
|
|
8
9
|
const StyledEmailSummaryListContainer = styled(Flex)(({ theme }) => {
|
|
9
10
|
return css `
|
|
@@ -44,72 +45,112 @@ const StyledEmailSummaryList = styled.div(({ theme }) => {
|
|
|
44
45
|
`;
|
|
45
46
|
});
|
|
46
47
|
StyledEmailSummaryList.defaultProps = defaultThemeProp;
|
|
47
|
-
const
|
|
48
|
+
const StyledWorklist = styled(MenuButton)(({ theme }) => {
|
|
49
|
+
const { 'font-size': fontSize, 'font-scale': fontScale } = theme.base;
|
|
50
|
+
const fontSizes = calculateFontSize(fontSize, fontScale);
|
|
51
|
+
return css `
|
|
52
|
+
${StyledText} {
|
|
53
|
+
font-weight: ${theme.base['font-weight']['semi-bold']};
|
|
54
|
+
font-size: ${fontSizes.m};
|
|
55
|
+
}
|
|
56
|
+
`;
|
|
57
|
+
});
|
|
58
|
+
StyledWorklist.defaultProps = defaultThemeProp;
|
|
59
|
+
const EmailSummaryList = forwardRef(({ loading = false, onLoadMore, categories, onCategoryClick, items, unreadEmailCount, filters, onFilterChange, onItemClick, emptyMessage, ...restProps }, ref) => {
|
|
48
60
|
const t = useI18n();
|
|
49
61
|
const tablistRef = useConsolidatedRef(ref);
|
|
50
62
|
const tabRefs = items.map(() => createRef());
|
|
63
|
+
const [focusReturnEl, setFocusReturnEl] = useState();
|
|
51
64
|
const [focusDescendant, setFocusDescendant] = useState(null);
|
|
52
|
-
const previousActiveDescendant = useRef();
|
|
53
65
|
const [listHasBeenViewed, setListHasBeenViewed] = useState(false);
|
|
54
66
|
const [clickOnInitialView, setClickOnInitialView] = useState(false);
|
|
67
|
+
const prevEmail = usePrevious(items);
|
|
68
|
+
const [announcement, setAnnouncement] = useState('');
|
|
55
69
|
const uadConfig = useMemo(() => ({
|
|
56
70
|
focusEl: tablistRef.current,
|
|
57
71
|
scope: tablistRef.current,
|
|
58
72
|
selector: 'button[role="tab"]',
|
|
73
|
+
focusReturnEl,
|
|
74
|
+
clearFocusReturn: () => {
|
|
75
|
+
setFocusReturnEl(null);
|
|
76
|
+
},
|
|
59
77
|
focusDescendantEl: focusDescendant,
|
|
60
78
|
clearFocusDescendant: () => {
|
|
61
79
|
setFocusDescendant(null);
|
|
62
80
|
tablistRef.current?.focus();
|
|
63
81
|
},
|
|
64
82
|
pauseDescendantEvaluation: !listHasBeenViewed
|
|
65
|
-
}), [tablistRef.current, focusDescendant, listHasBeenViewed]);
|
|
66
|
-
const { activeDescendant } = useActiveDescendant(uadConfig);
|
|
83
|
+
}), [tablistRef.current, focusDescendant, focusReturnEl, listHasBeenViewed]);
|
|
84
|
+
const { activeDescendant, descendants } = useActiveDescendant(uadConfig, [items.length]);
|
|
85
|
+
const previousActiveDescendant = usePrevious(activeDescendant);
|
|
86
|
+
useLazyDescendant({
|
|
87
|
+
loading,
|
|
88
|
+
descendants,
|
|
89
|
+
previousActiveDescendant,
|
|
90
|
+
activeDescendant,
|
|
91
|
+
focusReturnEl,
|
|
92
|
+
setFocusReturnEl,
|
|
93
|
+
scrollEl: tablistRef.current
|
|
94
|
+
});
|
|
67
95
|
// Trigger click of new active descendant
|
|
68
96
|
useEffect(() => {
|
|
69
|
-
const hasPreviousOrClickInitial = previousActiveDescendant
|
|
97
|
+
const hasPreviousOrClickInitial = previousActiveDescendant || clickOnInitialView;
|
|
70
98
|
if (hasPreviousOrClickInitial && activeDescendant) {
|
|
71
99
|
activeDescendant.click();
|
|
72
100
|
}
|
|
73
|
-
previousActiveDescendant.current = activeDescendant;
|
|
74
101
|
}, [activeDescendant]);
|
|
75
102
|
const buttonText = useMemo(() => {
|
|
76
103
|
return (menuHelpers.getSelected(categories)[0]?.primary ??
|
|
77
104
|
menuHelpers.flatten(categories)[0].primary);
|
|
78
105
|
}, [categories]);
|
|
79
|
-
|
|
106
|
+
useItemIntersection(tablistRef, items.length - 1, () => {
|
|
107
|
+
onLoadMore?.();
|
|
108
|
+
}, ':scope > button[role="tab"]');
|
|
109
|
+
useEffect(() => {
|
|
110
|
+
if (loading)
|
|
111
|
+
setAnnouncement(t('loading_email'));
|
|
112
|
+
}, [loading]);
|
|
113
|
+
useEffect(() => {
|
|
114
|
+
if (prevEmail) {
|
|
115
|
+
const difference = items.length - prevEmail.length;
|
|
116
|
+
if (difference)
|
|
117
|
+
setAnnouncement(t('new_emails_count', [difference], { count: difference }));
|
|
118
|
+
}
|
|
119
|
+
}, [items]);
|
|
120
|
+
return (_jsxs(StyledEmailSummaryListContainer, { container: { direction: 'column' }, ...restProps, children: [_jsxs(StyledEmailSummaryListHeader, { children: [_jsx(Text, { variant: 'h2', children: t('inbox') }, void 0), _jsxs(StyledActionWrapper, { container: { alignItems: 'center', gap: 0.5 }, children: [_jsx(StyledWorklist, { text: buttonText, variant: 'text', menu: {
|
|
80
121
|
mode: 'single-select',
|
|
81
122
|
items: categories,
|
|
82
123
|
onItemClick: onCategoryClick
|
|
83
|
-
} }, void 0), unreadEmailCount && (_jsx(Count, { "aria-label": t('unread_email_count', [unreadEmailCount], {
|
|
124
|
+
} }, void 0), typeof unreadEmailCount === 'number' && (_jsx(Count, { "aria-label": t('unread_email_count', [unreadEmailCount], {
|
|
84
125
|
count: unreadEmailCount
|
|
85
|
-
}), variant: 'default', children: unreadEmailCount }, void 0)), _jsx(StyledFilterButton, { variant: 'simple', label: t('email_filters'), icon: true, children: _jsx(Icon, { name: 'filter' }, void 0) }, void 0)] }, void 0)] }, void 0),
|
|
126
|
+
}), variant: 'default', children: unreadEmailCount }, void 0)), _jsx(StyledFilterButton, { variant: 'simple', label: t('email_filters'), icon: true, children: _jsx(Icon, { name: 'filter' }, void 0) }, void 0)] }, void 0)] }, void 0), items.length > 0 ? (_jsxs(StyledEmailSummaryList, { role: 'tablist', tabIndex: 0, ref: tablistRef, onFocus: e => {
|
|
86
127
|
if (!listHasBeenViewed && e.target.getAttribute('role') === 'tablist') {
|
|
87
128
|
setClickOnInitialView(true);
|
|
88
129
|
setListHasBeenViewed(true);
|
|
89
130
|
}
|
|
90
|
-
}, children: items.map((emailItem, i) => {
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
131
|
+
}, children: [_jsx(VisuallyHiddenText, { "aria-live": 'polite', children: announcement }, void 0), items.map((emailItem, i) => {
|
|
132
|
+
const { id, ...emailItemProps } = emailItem;
|
|
133
|
+
return (_jsx(EmailSummaryItem, { ref: tabRefs[i], id: id, role: 'tab', ...emailItemProps, onClick: (e) => {
|
|
134
|
+
const mouseClick = e.detail !== 0;
|
|
135
|
+
if (mouseClick) {
|
|
136
|
+
const target = e.target;
|
|
137
|
+
const focusAtEl = target.getAttribute('role') === 'tab'
|
|
138
|
+
? target
|
|
139
|
+
: target.closest('button[role="tab"]');
|
|
140
|
+
if (focusAtEl)
|
|
141
|
+
setFocusDescendant(focusAtEl);
|
|
142
|
+
if (!listHasBeenViewed) {
|
|
143
|
+
if (i === 0)
|
|
144
|
+
setClickOnInitialView(true);
|
|
145
|
+
setListHasBeenViewed(true);
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
// Click is triggered by active descendant change, 'enter', & duplicate click
|
|
149
|
+
if (!mouseClick || activeDescendant?.id === id) {
|
|
150
|
+
onItemClick(id);
|
|
105
151
|
}
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
if (!mouseClick || activeDescendant?.id === id) {
|
|
109
|
-
onItemClick(id);
|
|
110
|
-
}
|
|
111
|
-
}, active: activeDescendant && activeDescendant.id === id }, id));
|
|
112
|
-
}) }, void 0)] }, void 0));
|
|
152
|
+
}, active: activeDescendant && activeDescendant.id === id }, id));
|
|
153
|
+
}), loading && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }, void 0) }, void 0))] }, void 0)) : (_jsx(EmptyState, { message: emptyMessage }, void 0))] }, void 0));
|
|
113
154
|
});
|
|
114
155
|
export default EmailSummaryList;
|
|
115
156
|
//# sourceMappingURL=EmailSummaryList.js.map
|