npm - @pega/cosmos-react-social - Versions diffs - 5.0.0-dev.1.0 → 5.0.0-dev.2.0 - Mend

@pega/cosmos-react-social 5.0.0-dev.1.0 → 5.0.0-dev.2.0

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 (15) hide show

package/lib/components/Chat/SuggestedReplyPicker.d.ts CHANGED Viewed

@@ -17,7 +17,7 @@ export interface SuggestedReply {
     /** Confidence of this suggested reply */
     confidence: number;
 }
-export interface SuggestedReplyPickerProps extends Pick<ChatComposerProps, 'onSend' | 'maxLength'> {
+export interface SuggestedReplyPickerProps extends Pick<ChatComposerProps, 'onSend' | 'maxLength' | 'disabled'> {
     /** ref to the element */
     ref?: Ref<HTMLDivElement>;
     /** Suggested replies */

package/lib/components/Chat/SuggestedReplyPicker.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SuggestedReplyPicker.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/SuggestedReplyPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAmB,GAAG,EAAa,MAAM,OAAO,CAAC;AAGvF,OAAO,EAQL,YAAY,EAMb,MAAM,yBAAyB,CAAC;AAMjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAInD,eAAO,MAAM,0BAA0B,yGAAe,CAAC;AACvD,eAAO,MAAM,2BAA2B,yGAAe,CAAC;AACxD,eAAO,MAAM,WAAW,yGAAe,CAAC;AACxC,eAAO,MAAM,mBAAmB,yGAAe,CAAC;AAChD,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAI/C,eAAO,MAAM,wBAAwB;;SAqBpC,CAAC;AAoCF,MAAM,WAAW,cAAc;IAC7B,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,yCAAyC;IACzC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,~~yBAA0B~~,SAAQ,IAAI,CAAC,iBAAiB,EAAE,QAAQ,GAAG,WAAW,CAAC;~~IAChG~~,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,wBAAwB;IACxB,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,8BAA8B;IAC9B,cAAc,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,CAAC;IACtC;;OAEG;IACH,aAAa,EAAE,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAClD,iCAAiC;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,4CAA4C;IAC5C,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,gEAAgE;IAChE,QAAQ,EAAE,CAAC,cAAc,EAAE,cAAc,KAAK,IAAI,CAAC;IACnD,yCAAyC;IACzC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,~~CAqNlF~~,CAAC;AAEL,eAAe,oBAAoB,CAAC"}
1	+ {"version":3,"file":"SuggestedReplyPicker.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/SuggestedReplyPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAmB,GAAG,EAAa,MAAM,OAAO,CAAC;AAGvF,OAAO,EAQL,YAAY,EAMb,MAAM,yBAAyB,CAAC;AAMjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAInD,eAAO,MAAM,0BAA0B,yGAAe,CAAC;AACvD,eAAO,MAAM,2BAA2B,yGAAe,CAAC;AACxD,eAAO,MAAM,WAAW,yGAAe,CAAC;AACxC,eAAO,MAAM,mBAAmB,yGAAe,CAAC;AAChD,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAI/C,eAAO,MAAM,wBAAwB;;SAqBpC,CAAC;AAoCF,MAAM,WAAW,cAAc;IAC7B,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,yCAAyC;IACzC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,yBACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,QAAQ,GAAG,WAAW,GAAG,UAAU,CAAC;IACpE,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,wBAAwB;IACxB,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,8BAA8B;IAC9B,cAAc,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,CAAC;IACtC;;OAEG;IACH,aAAa,EAAE,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAClD,iCAAiC;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,4CAA4C;IAC5C,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,gEAAgE;IAChE,QAAQ,EAAE,CAAC,cAAc,EAAE,cAAc,KAAK,IAAI,CAAC;IACnD,yCAAyC;IACzC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,CAyNlF,CAAC;AAEL,eAAe,oBAAoB,CAAC"}

package/lib/components/Chat/SuggestedReplyPicker.js CHANGED Viewed

@@ -59,7 +59,7 @@ const StyledSuggestedReplyContainer = styled.div(props => {
 });
 StyledSuggestedReplyContainer.defaultProps = defaultThemeProp;
 const SuggestedReplyPicker = forwardRef(function SuggestedReplyPicker(props, ref) {
-    const { replies = [], collapsed, onExpandCollapse, showNotification, onSelect, currentReplyId, onReplyChange, onSend, maxLength = 256, ...restProps } = props;
+    const { replies = [], collapsed, onExpandCollapse, showNotification, onSelect, currentReplyId, onReplyChange, onSend, maxLength = 256, disabled = false, ...restProps } = props;
     const { announcePolite } = useLiveLog();
     const t = useI18n();
     const { rtl, ltr } = useDirection();
@@ -104,7 +104,7 @@ const SuggestedReplyPicker = forwardRef(function SuggestedReplyPicker(props, ref
                                 justify: 'center'
                             }, as: StyledRepliesAction, children: [replies.length > 1 && (_jsx(Button, { icon: true, "aria-label": t('prev_suggested_reply'), variant: 'simple', disabled: currentReplyId === undefined || replies.length <= 1, onClick: () => {
                                         onSuggestedReplyChange('prev');
-                                    }, children: _jsx(Icon, { name: 'caret-left' }) })), _jsx(Button, { disabled: currentReplyId === undefined || !replies || replies.length === 0, onClick: () => {
+                                    }, children: _jsx(Icon, { name: 'caret-left' }) })), _jsx(Button, { disabled: disabled || currentReplyId === undefined || !replies || replies.length === 0, onClick: () => {
                                         const selectedReply = replies.find(reply => reply.id === currentReplyId);
                                         if (selectedReply) {
                                             onSelect(selectedReply);
@@ -118,7 +118,8 @@ const SuggestedReplyPicker = forwardRef(function SuggestedReplyPicker(props, ref
                                                 : 0,
                                             replies.length
                                         ])
-                                        : undefined, children: t('edit') }), _jsx(Button, { disabled: currentReplyId === undefined ||
+                                        : undefined, children: t('edit') }), _jsx(Button, { disabled: disabled ||
+                                        currentReplyId === undefined ||
                                         !replies ||
                                         replies.length === 0 ||
                                         (!!maxLength && replies.length > maxLength), onClick: () => {

package/lib/components/Chat/SuggestedReplyPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SuggestedReplyPicker.js","sourceRoot":"","sources":["../../../src/components/Chat/SuggestedReplyPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref, useEffect } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n Icon,\n registerIcon,\n Button,\n Text,\n useI18n,\n defaultThemeProp,\n ForwardProps,\n useLiveLog,\n ExpandCollapse,\n Alert,\n useDirection,\n EmptyState\n} from '@pega/cosmos-react-core';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\nimport { StyledAlert } from '@pega/cosmos-react-core/lib/components/Badges/Alert';\n\nimport { ChatComposerProps } from './ChatComposer';\n\nregisterIcon(timesIcon, caretLeftIcon, caretRightIcon);\n\nexport const StyledSuggestedReplyHeader = styled.div``;\nexport const StyledSuggestedReplyContent = styled.div``;\nexport const StyledReply = styled.div``;\nexport const StyledRepliesAction = styled.div``;\nexport const StyledNotification = styled.div``;\nconst maxNumOfLines = 5;\nconst minNumOfLines = 2;\n\nexport const StyledSuggestedReplyIcon = styled.svg<{ suggestedReplyCollapsed?: boolean }>(\n ({ suggestedReplyCollapsed, theme }) => {\n const { rtl } = useDirection();\n const {\n base: {\n animation: {\n speed,\n timing: { ease }\n }\n }\n } = theme;\n return css`\n transition-property: transform;\n transition-duration: ${speed};\n transition-timing-function: ${ease};\n ${suggestedReplyCollapsed &&\n css`\n transform: rotateZ(${rtl ? '0deg' : '-90deg'});\n `}\n `;\n }\n);\n\nStyledSuggestedReplyIcon.defaultProps = defaultThemeProp;\n\nconst StyledSuggestedReplyContainer = styled.div(props => {\n const { theme } = props;\n return css`\n border-top: 0.0625rem solid ${theme.base.palette['border-line']};\n background-color: ${theme.base.palette['primary-background']};\n\n > ${StyledSuggestedReplyHeader} {\n padding: ${theme.base.spacing};\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n\n ${StyledAlert} {\n position: relative;\n inset-block-start: calc(-0.25 * ${theme.base.spacing});\n inset-inline-start: calc(-0.5 * ${theme.base.spacing});\n }\n\n ${StyledSuggestedReplyContent} {\n padding: calc(2 * ${theme.base.spacing});\n position: relative;\n\n > ${StyledReply} {\n overflow-y: auto;\n max-height: calc(2.5 * ${theme.base.spacing} * ${maxNumOfLines});\n min-height: calc(2.5 * ${theme.base.spacing} * ${minNumOfLines});\n }\n }\n `;\n});\n\nStyledSuggestedReplyContainer.defaultProps = defaultThemeProp;\n\nexport interface SuggestedReply {\n /** Id for this suggested reply /\n id: string;\n /* Suggested reply message /\n message: string;\n /* Confidence of this suggested reply /\n confidence: number;\n}\n\nexport interface SuggestedReplyPickerProps extends Pick<ChatComposerProps, 'onSend' \| 'maxLength'> {\n /* ref to the element /\n ref?: Ref<HTMLDivElement>;\n /* Suggested replies /\n replies?: SuggestedReply[];\n /* Id of the current reply /\n currentReplyId?: SuggestedReply['id'];\n /* Fired when user clicks on left or right buttons\n * @param id Id of the new reply\n /\n onReplyChange: (id: SuggestedReply['id']) => void;\n /* Current state of the panel /\n collapsed: boolean;\n /* Callback for expand or collapse click /\n onExpandCollapse: () => void;\n /* Callback for the event when a suggested reply is selected /\n onSelect: (suggestedReply: SuggestedReply) => void;\n /* Show notification on picker header */\n showNotification?: boolean;\n}\n\nconst SuggestedReplyPicker: FunctionComponent<SuggestedReplyPickerProps & ForwardProps> =\n forwardRef(function SuggestedReplyPicker(\n props: PropsWithoutRef<SuggestedReplyPickerProps>,\n ref: SuggestedReplyPickerProps['ref']\n ) {\n const {\n replies = [],\n collapsed,\n onExpandCollapse,\n showNotification,\n onSelect,\n currentReplyId,\n onReplyChange,\n onSend,\n maxLength = 256,\n ...restProps\n } = props;\n const { announcePolite } = useLiveLog();\n const t = useI18n();\n const { rtl, ltr } = useDirection();\n\n // Allows suggested replies to cycle\n const onSuggestedReplyChange = (mode: 'prev' \| 'next') => {\n const currentReplyIndex = replies.findIndex(reply => reply.id === currentReplyId);\n let newReplyIndex = mode === 'prev' ? currentReplyIndex - 1 : currentReplyIndex + 1;\n newReplyIndex = (newReplyIndex + replies.length) % replies.length;\n onReplyChange(replies[newReplyIndex].id);\n };\n\n // SR announcement when current reply changes\n useEffect(() => {\n if (!replies \|\| replies.length === 0 \|\| !currentReplyId) {\n return;\n }\n const currentReplyIndex = replies.findIndex(reply => reply.id === currentReplyId);\n announcePolite({\n message: `${t('suggested_replies_current_of_total', [\n currentReplyIndex + 1,\n replies.length\n ])},\n ${t('confidence_percentage', [replies[currentReplyIndex]?.confidence])},${\n replies[currentReplyIndex]?.message\n }`,\n type: 'acknowledgement'\n });\n }, [currentReplyId]);\n\n const onEditAnnouncement = () => {\n announcePolite({\n message: t('suggested_reply_copied_to_input_field'),\n type: 'acknowledgement'\n });\n };\n\n return (\n <StyledSuggestedReplyContainer ref={ref} {...restProps}>\n <Flex\n as={StyledSuggestedReplyHeader}\n container={{\n justify: 'between',\n alignContent: 'center'\n }}\n >\n <Flex\n container={{\n alignItems: 'center',\n gap: 1\n }}\n >\n {ltr && (\n <Button\n variant='simple'\n label={collapsed ? t('expand') : t('collapse')}\n aria-label={t(\n collapsed ? 'expand_suggested_replies' : 'collapse_suggested_replies'\n )}\n icon\n onClick={onExpandCollapse}\n >\n <Icon\n name='caret-down'\n suggestedReplyCollapsed={collapsed}\n as={StyledSuggestedReplyIcon}\n />\n </Button>\n )}\n\n <Flex container={{ gap: 0.5 }}>\n <Text variant='h3'>{t('suggested_replies')}</Text>\n {collapsed && showNotification && <Alert variant='urgent' />}\n </Flex>\n\n {rtl && (\n <Button\n variant='simple'\n label={collapsed ? t('expand') : t('collapse')}\n aria-label={t(\n collapsed ? 'expand_suggested_replies' : 'collapse_suggested_replies'\n )}\n icon\n onClick={onExpandCollapse}\n >\n <Icon\n name='caret-down'\n suggestedReplyCollapsed={collapsed}\n as={StyledSuggestedReplyIcon}\n />\n </Button>\n )}\n </Flex>\n </Flex>\n <ExpandCollapse dimension='height' collapsed={collapsed} nullWhenCollapsed>\n <Flex\n container={{\n direction: 'column',\n gap: 1\n }}\n as={StyledSuggestedReplyContent}\n >\n {currentReplyId && replies.length ? (\n <Flex container as={StyledReply}>\n {replies.find(reply => reply.id === currentReplyId)?.message}\n </Flex>\n ) : (\n <EmptyState message={t('no_suggestion')} />\n )}\n <Flex\n container={{\n justify: 'center'\n }}\n as={StyledRepliesAction}\n >\n {replies.length > 1 && (\n <Button\n icon\n aria-label={t('prev_suggested_reply')}\n variant='simple'\n disabled={currentReplyId === undefined \|\| replies.length <= 1}\n onClick={() => {\n onSuggestedReplyChange('prev');\n }}\n >\n <Icon name='caret-left' />\n </Button>\n )}\n <Button\n disabled={currentReplyId === undefined \|\| !replies \|\| replies.length === 0}\n onClick={() => {\n const selectedReply = replies.find(reply => reply.id === currentReplyId);\n if (selectedReply) {\n onSelect(selectedReply);\n onExpandCollapse();\n onEditAnnouncement();\n }\n }}\n aria-label={\n replies.length > 0 && currentReplyId\n ? t('edit_current_template', [\n replies.length > 0 && currentReplyId\n ? replies.findIndex(reply => reply.id === currentReplyId) + 1\n : 0,\n replies.length\n ])\n : undefined\n }\n >\n {t('edit')}\n </Button>\n <Button\n disabled={\n currentReplyId === undefined \|\|\n !replies \|\|\n replies.length === 0 \|\|\n (!!maxLength && replies.length > maxLength)\n }\n onClick={() => {\n const selectedReply = replies.find(reply => reply.id === currentReplyId);\n if (selectedReply) {\n onSend(selectedReply.message);\n onExpandCollapse();\n }\n }}\n aria-label={\n replies.length > 0 && currentReplyId\n ? t('send_current_template', [\n replies.length > 0 && currentReplyId\n ? replies.findIndex(reply => reply.id === currentReplyId) + 1\n : 0,\n replies.length\n ])\n : undefined\n }\n >\n {t('send')}\n </Button>\n {replies.length > 1 && (\n <Button\n icon\n aria-label={t('next_suggested_reply')}\n variant='simple'\n onClick={() => {\n onSuggestedReplyChange('next');\n }}\n disabled={currentReplyId === undefined \|\| replies.length <= 1}\n >\n <Icon name='caret-right' />\n </Button>\n )}\n </Flex>\n </Flex>\n </ExpandCollapse>\n </StyledSuggestedReplyContainer>\n );\n });\n\nexport default SuggestedReplyPicker;\n"]}
1	+ {"version":3,"file":"SuggestedReplyPicker.js","sourceRoot":"","sources":["../../../src/components/Chat/SuggestedReplyPicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref, useEffect } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n Icon,\n registerIcon,\n Button,\n Text,\n useI18n,\n defaultThemeProp,\n ForwardProps,\n useLiveLog,\n ExpandCollapse,\n Alert,\n useDirection,\n EmptyState\n} from '@pega/cosmos-react-core';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\nimport { StyledAlert } from '@pega/cosmos-react-core/lib/components/Badges/Alert';\n\nimport { ChatComposerProps } from './ChatComposer';\n\nregisterIcon(timesIcon, caretLeftIcon, caretRightIcon);\n\nexport const StyledSuggestedReplyHeader = styled.div``;\nexport const StyledSuggestedReplyContent = styled.div``;\nexport const StyledReply = styled.div``;\nexport const StyledRepliesAction = styled.div``;\nexport const StyledNotification = styled.div``;\nconst maxNumOfLines = 5;\nconst minNumOfLines = 2;\n\nexport const StyledSuggestedReplyIcon = styled.svg<{ suggestedReplyCollapsed?: boolean }>(\n ({ suggestedReplyCollapsed, theme }) => {\n const { rtl } = useDirection();\n const {\n base: {\n animation: {\n speed,\n timing: { ease }\n }\n }\n } = theme;\n return css`\n transition-property: transform;\n transition-duration: ${speed};\n transition-timing-function: ${ease};\n ${suggestedReplyCollapsed &&\n css`\n transform: rotateZ(${rtl ? '0deg' : '-90deg'});\n `}\n `;\n }\n);\n\nStyledSuggestedReplyIcon.defaultProps = defaultThemeProp;\n\nconst StyledSuggestedReplyContainer = styled.div(props => {\n const { theme } = props;\n return css`\n border-top: 0.0625rem solid ${theme.base.palette['border-line']};\n background-color: ${theme.base.palette['primary-background']};\n\n > ${StyledSuggestedReplyHeader} {\n padding: ${theme.base.spacing};\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n\n ${StyledAlert} {\n position: relative;\n inset-block-start: calc(-0.25 * ${theme.base.spacing});\n inset-inline-start: calc(-0.5 * ${theme.base.spacing});\n }\n\n ${StyledSuggestedReplyContent} {\n padding: calc(2 * ${theme.base.spacing});\n position: relative;\n\n > ${StyledReply} {\n overflow-y: auto;\n max-height: calc(2.5 * ${theme.base.spacing} * ${maxNumOfLines});\n min-height: calc(2.5 * ${theme.base.spacing} * ${minNumOfLines});\n }\n }\n `;\n});\n\nStyledSuggestedReplyContainer.defaultProps = defaultThemeProp;\n\nexport interface SuggestedReply {\n /** Id for this suggested reply /\n id: string;\n /* Suggested reply message /\n message: string;\n /* Confidence of this suggested reply /\n confidence: number;\n}\n\nexport interface SuggestedReplyPickerProps\n extends Pick<ChatComposerProps, 'onSend' \| 'maxLength' \| 'disabled'> {\n /* ref to the element /\n ref?: Ref<HTMLDivElement>;\n /* Suggested replies /\n replies?: SuggestedReply[];\n /* Id of the current reply /\n currentReplyId?: SuggestedReply['id'];\n /* Fired when user clicks on left or right buttons\n * @param id Id of the new reply\n /\n onReplyChange: (id: SuggestedReply['id']) => void;\n /* Current state of the panel /\n collapsed: boolean;\n /* Callback for expand or collapse click /\n onExpandCollapse: () => void;\n /* Callback for the event when a suggested reply is selected /\n onSelect: (suggestedReply: SuggestedReply) => void;\n /* Show notification on picker header */\n showNotification?: boolean;\n}\n\nconst SuggestedReplyPicker: FunctionComponent<SuggestedReplyPickerProps & ForwardProps> =\n forwardRef(function SuggestedReplyPicker(\n props: PropsWithoutRef<SuggestedReplyPickerProps>,\n ref: SuggestedReplyPickerProps['ref']\n ) {\n const {\n replies = [],\n collapsed,\n onExpandCollapse,\n showNotification,\n onSelect,\n currentReplyId,\n onReplyChange,\n onSend,\n maxLength = 256,\n disabled = false,\n ...restProps\n } = props;\n const { announcePolite } = useLiveLog();\n const t = useI18n();\n const { rtl, ltr } = useDirection();\n\n // Allows suggested replies to cycle\n const onSuggestedReplyChange = (mode: 'prev' \| 'next') => {\n const currentReplyIndex = replies.findIndex(reply => reply.id === currentReplyId);\n let newReplyIndex = mode === 'prev' ? currentReplyIndex - 1 : currentReplyIndex + 1;\n newReplyIndex = (newReplyIndex + replies.length) % replies.length;\n onReplyChange(replies[newReplyIndex].id);\n };\n\n // SR announcement when current reply changes\n useEffect(() => {\n if (!replies \|\| replies.length === 0 \|\| !currentReplyId) {\n return;\n }\n const currentReplyIndex = replies.findIndex(reply => reply.id === currentReplyId);\n announcePolite({\n message: `${t('suggested_replies_current_of_total', [\n currentReplyIndex + 1,\n replies.length\n ])},\n ${t('confidence_percentage', [replies[currentReplyIndex]?.confidence])},${\n replies[currentReplyIndex]?.message\n }`,\n type: 'acknowledgement'\n });\n }, [currentReplyId]);\n\n const onEditAnnouncement = () => {\n announcePolite({\n message: t('suggested_reply_copied_to_input_field'),\n type: 'acknowledgement'\n });\n };\n\n return (\n <StyledSuggestedReplyContainer ref={ref} {...restProps}>\n <Flex\n as={StyledSuggestedReplyHeader}\n container={{\n justify: 'between',\n alignContent: 'center'\n }}\n >\n <Flex\n container={{\n alignItems: 'center',\n gap: 1\n }}\n >\n {ltr && (\n <Button\n variant='simple'\n label={collapsed ? t('expand') : t('collapse')}\n aria-label={t(\n collapsed ? 'expand_suggested_replies' : 'collapse_suggested_replies'\n )}\n icon\n onClick={onExpandCollapse}\n >\n <Icon\n name='caret-down'\n suggestedReplyCollapsed={collapsed}\n as={StyledSuggestedReplyIcon}\n />\n </Button>\n )}\n\n <Flex container={{ gap: 0.5 }}>\n <Text variant='h3'>{t('suggested_replies')}</Text>\n {collapsed && showNotification && <Alert variant='urgent' />}\n </Flex>\n\n {rtl && (\n <Button\n variant='simple'\n label={collapsed ? t('expand') : t('collapse')}\n aria-label={t(\n collapsed ? 'expand_suggested_replies' : 'collapse_suggested_replies'\n )}\n icon\n onClick={onExpandCollapse}\n >\n <Icon\n name='caret-down'\n suggestedReplyCollapsed={collapsed}\n as={StyledSuggestedReplyIcon}\n />\n </Button>\n )}\n </Flex>\n </Flex>\n <ExpandCollapse dimension='height' collapsed={collapsed} nullWhenCollapsed>\n <Flex\n container={{\n direction: 'column',\n gap: 1\n }}\n as={StyledSuggestedReplyContent}\n >\n {currentReplyId && replies.length ? (\n <Flex container as={StyledReply}>\n {replies.find(reply => reply.id === currentReplyId)?.message}\n </Flex>\n ) : (\n <EmptyState message={t('no_suggestion')} />\n )}\n <Flex\n container={{\n justify: 'center'\n }}\n as={StyledRepliesAction}\n >\n {replies.length > 1 && (\n <Button\n icon\n aria-label={t('prev_suggested_reply')}\n variant='simple'\n disabled={currentReplyId === undefined \|\| replies.length <= 1}\n onClick={() => {\n onSuggestedReplyChange('prev');\n }}\n >\n <Icon name='caret-left' />\n </Button>\n )}\n <Button\n disabled={\n disabled \|\| currentReplyId === undefined \|\| !replies \|\| replies.length === 0\n }\n onClick={() => {\n const selectedReply = replies.find(reply => reply.id === currentReplyId);\n if (selectedReply) {\n onSelect(selectedReply);\n onExpandCollapse();\n onEditAnnouncement();\n }\n }}\n aria-label={\n replies.length > 0 && currentReplyId\n ? t('edit_current_template', [\n replies.length > 0 && currentReplyId\n ? replies.findIndex(reply => reply.id === currentReplyId) + 1\n : 0,\n replies.length\n ])\n : undefined\n }\n >\n {t('edit')}\n </Button>\n <Button\n disabled={\n disabled \|\|\n currentReplyId === undefined \|\|\n !replies \|\|\n replies.length === 0 \|\|\n (!!maxLength && replies.length > maxLength)\n }\n onClick={() => {\n const selectedReply = replies.find(reply => reply.id === currentReplyId);\n if (selectedReply) {\n onSend(selectedReply.message);\n onExpandCollapse();\n }\n }}\n aria-label={\n replies.length > 0 && currentReplyId\n ? t('send_current_template', [\n replies.length > 0 && currentReplyId\n ? replies.findIndex(reply => reply.id === currentReplyId) + 1\n : 0,\n replies.length\n ])\n : undefined\n }\n >\n {t('send')}\n </Button>\n {replies.length > 1 && (\n <Button\n icon\n aria-label={t('next_suggested_reply')}\n variant='simple'\n onClick={() => {\n onSuggestedReplyChange('next');\n }}\n disabled={currentReplyId === undefined \|\| replies.length <= 1}\n >\n <Icon name='caret-right' />\n </Button>\n )}\n </Flex>\n </Flex>\n </ExpandCollapse>\n </StyledSuggestedReplyContainer>\n );\n });\n\nexport default SuggestedReplyPicker;\n"]}

package/lib/components/Email/Email.styles.d.ts CHANGED Viewed

@@ -59,7 +59,7 @@ export declare const StyledEmailCaseViewColumns: import("styled-components").Sty
 export declare const StyledEmailCaseViewDrawer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledEmailCaseViewContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledEmailManagerContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledEmailCountIcon: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledEmailCountIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("@pega/cosmos-react-core").CountProps, "hidden" | "color" | "style" | "translate" | "prefix" | "slot" | "title" | "children" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "variant"> & import("react").RefAttributes<HTMLSpanElement>>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledEmailSummaryList: import("styled-components").StyledComponent<"ol", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledEmailNotificationList: import("styled-components").StyledComponent<"ol", import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=Email.styles.d.ts.map

package/lib/components/Email/Email.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Email.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Email/Email.styles.ts"],"names":[],"mappings":";~~AAwBA~~,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGlE,eAAO,MAAM,yBAAyB,4GAIrC,CAAC;AAEF,eAAO,MAAM,iBAAiB,yGAW5B,CAAC;AAIH,eAAO,MAAM,4BAA4B,qOAUvC,CAAC;AAIH,eAAO,MAAM,gCAAgC;;uDAU3C,CAAC;AAIH,eAAO,MAAM,eAAe,yGAAe,CAAC;AAE5C,eAAO,MAAM,sBAAsB,2OAMjC,CAAC;AAIH,eAAO,MAAM,kBAAkB,0GAE9B,CAAC;AAEF,eAAO,MAAM,gCAAgC;;uDAE5C,CAAC;AAEF,eAAO,MAAM,kCAAkC;;uDAY7C,CAAC;AAIH,eAAO,MAAM,0BAA0B,yGAKrC,CAAC;AAIH,eAAO,MAAM,wBAAwB,yGAInC,CAAC;AAIH,eAAO,MAAM,WAAW,yGAStB,CAAC;AAIH,eAAO,MAAM,iBAAiB,wHAc5B,CAAC;AAIH,eAAO,MAAM,gBAAgB;;uDAU3B,CAAC;AAIH,eAAO,MAAM,4BAA4B,qOAExC,CAAC;AAEF,eAAO,MAAM,cAAc,yGAMzB,CAAC;AAIH,eAAO,MAAM,8BAA8B;;SAmBzC,CAAC;AAIH,eAAO,MAAM,sBAAsB,4GAAkB,CAAC;AACtD,eAAO,MAAM,2BAA2B,wGAAc,CAAC;AACvD,eAAO,MAAM,gBAAgB;;SA6B5B,CAAC;AAIF,eAAO,MAAM,iBAAiB,yGAM5B,CAAC;AAIH,eAAO,MAAM,UAAU,yGAIrB,CAAC;AAIH,eAAO,MAAM,YAAY,4GAOvB,CAAC;AAEH,eAAO,MAAM,yBAAyB,4GAMpC,CAAC;AAEH,eAAO,MAAM,wBAAwB;2BAAuC,OAAO;SAelF,CAAC;AAEF,eAAO,MAAM,mBAAmB;;eAEnB,OAAO;SAgClB,CAAC;AAIH,eAAO,MAAM,8BAA8B,4GAKzC,CAAC;AAIH,eAAO,MAAM,6BAA6B,4GAMxC,CAAC;AAIH,eAAO,MAAM,2BAA2B,4GAMtC,CAAC;AAIH,eAAO,MAAM,uBAAuB;2BAAuC,OAAO;SAUjF,CAAC;AAEF,eAAO,MAAM,kBAAkB,yGAS7B,CAAC;AAEH,eAAO,MAAM,eAAe;2BAAuC,OAAO;SAUzE,CAAC;AAIF,eAAO,MAAM,0BAA0B;;SAerC,CAAC;AAEH,eAAO,MAAM,yBAAyB,yGAUpC,CAAC;AAIH,eAAO,MAAM,4BAA4B,yGAIvC,CAAC;AAIH,eAAO,MAAM,2BAA2B,yGAOtC,CAAC;AAIH,eAAO,MAAM,oBAAoB,~~yGAO~~/B,CAAC;AAIH,eAAO,MAAM,sBAAsB,wGAejC,CAAC;AAGH,eAAO,MAAM,2BAA2B,wGAiBtC,CAAC"}
1	+ {"version":3,"file":"Email.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Email/Email.styles.ts"],"names":[],"mappings":";AAyBA,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAGlE,eAAO,MAAM,yBAAyB,4GAIrC,CAAC;AAEF,eAAO,MAAM,iBAAiB,yGAW5B,CAAC;AAIH,eAAO,MAAM,4BAA4B,qOAUvC,CAAC;AAIH,eAAO,MAAM,gCAAgC;;uDAU3C,CAAC;AAIH,eAAO,MAAM,eAAe,yGAAe,CAAC;AAE5C,eAAO,MAAM,sBAAsB,2OAMjC,CAAC;AAIH,eAAO,MAAM,kBAAkB,0GAE9B,CAAC;AAEF,eAAO,MAAM,gCAAgC;;uDAE5C,CAAC;AAEF,eAAO,MAAM,kCAAkC;;uDAY7C,CAAC;AAIH,eAAO,MAAM,0BAA0B,yGAKrC,CAAC;AAIH,eAAO,MAAM,wBAAwB,yGAInC,CAAC;AAIH,eAAO,MAAM,WAAW,yGAStB,CAAC;AAIH,eAAO,MAAM,iBAAiB,wHAc5B,CAAC;AAIH,eAAO,MAAM,gBAAgB;;uDAU3B,CAAC;AAIH,eAAO,MAAM,4BAA4B,qOAExC,CAAC;AAEF,eAAO,MAAM,cAAc,yGAMzB,CAAC;AAIH,eAAO,MAAM,8BAA8B;;SAmBzC,CAAC;AAIH,eAAO,MAAM,sBAAsB,4GAAkB,CAAC;AACtD,eAAO,MAAM,2BAA2B,wGAAc,CAAC;AACvD,eAAO,MAAM,gBAAgB;;SA6B5B,CAAC;AAIF,eAAO,MAAM,iBAAiB,yGAM5B,CAAC;AAIH,eAAO,MAAM,UAAU,yGAIrB,CAAC;AAIH,eAAO,MAAM,YAAY,4GAOvB,CAAC;AAEH,eAAO,MAAM,yBAAyB,4GAMpC,CAAC;AAEH,eAAO,MAAM,wBAAwB;2BAAuC,OAAO;SAelF,CAAC;AAEF,eAAO,MAAM,mBAAmB;;eAEnB,OAAO;SAgClB,CAAC;AAIH,eAAO,MAAM,8BAA8B,4GAKzC,CAAC;AAIH,eAAO,MAAM,6BAA6B,4GAMxC,CAAC;AAIH,eAAO,MAAM,2BAA2B,4GAMtC,CAAC;AAIH,eAAO,MAAM,uBAAuB;2BAAuC,OAAO;SAUjF,CAAC;AAEF,eAAO,MAAM,kBAAkB,yGAS7B,CAAC;AAEH,eAAO,MAAM,eAAe;2BAAuC,OAAO;SAUzE,CAAC;AAIF,eAAO,MAAM,0BAA0B;;SAerC,CAAC;AAEH,eAAO,MAAM,yBAAyB,yGAUpC,CAAC;AAIH,eAAO,MAAM,4BAA4B,yGAIvC,CAAC;AAIH,eAAO,MAAM,2BAA2B,yGAOtC,CAAC;AAIH,eAAO,MAAM,oBAAoB,wtJAO/B,CAAC;AAIH,eAAO,MAAM,sBAAsB,wGAejC,CAAC;AAGH,eAAO,MAAM,2BAA2B,wGAiBtC,CAAC"}

package/lib/components/Email/Email.styles.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import styled, { css } from 'styled-components';
 import { mix, readableColor } from 'polished';
-import { Button, calculateFontSize, defaultThemeProp, EmailDisplay, FieldValueList, MenuButton, StyledFieldName, StyledFieldValue, StyledSecondary, StyledSummaryItemActions, StyledVisual, tryCatch, readableHue, nlpColors, StyledPopover, StyledButton, StyledEmptyState } from '@pega/cosmos-react-core';
+import { Button, calculateFontSize, defaultThemeProp, EmailDisplay, FieldValueList, MenuButton, StyledFieldName, StyledFieldValue, StyledSecondary, StyledSummaryItemActions, StyledVisual, tryCatch, readableHue, nlpColors, StyledPopover, StyledButton, StyledEmptyState, Count } from '@pega/cosmos-react-core';
 import { StyledBanner } from '@pega/cosmos-react-core/lib/components/Banner/Banner';
 import { StyledEmailSummaryItem, StyledMessageAndDate } from './EmailSummaryItem';
 export const StyledEmailMoreInfoButton = styled.button `
@@ -350,7 +350,7 @@ export const StyledEmailManagerContainer = styled.div(({ theme }) => {
   `;
 });
 StyledEmailManagerContainer.defaultProps = defaultThemeProp;
-export const StyledEmailCountIcon = styled.div(({ theme }) => {
+export const StyledEmailCountIcon = styled(Count)(({ theme }) => {
     return css `
     position: absolute;
     inset-inline-start: calc(2.5 * ${theme.base.spacing});

package/lib/components/Email/Email.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Email.styles.js","sourceRoot":"","sources":["../../../src/components/Email/Email.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { mix, readableColor } from 'polished';\n\nimport {\n Button,\n calculateFontSize,\n defaultThemeProp,\n EmailDisplay,\n FieldValueList,\n MenuButton,\n StyledFieldName,\n StyledFieldValue,\n StyledSecondary,\n StyledSummaryItemActions,\n StyledVisual,\n tryCatch,\n readableHue,\n nlpColors,\n StyledPopover,\n StyledButton,\n StyledEmptyState\n} from '@pega/cosmos-react-core';\nimport { StyledBanner } from '@pega/cosmos-react-core/lib/components/Banner/Banner';\n\nimport { EmailEntityProps, EmailShellProps } from './Email.types';\nimport { StyledEmailSummaryItem, StyledMessageAndDate } from './EmailSummaryItem';\n\nexport const StyledEmailMoreInfoButton = styled.button`\n min-height: 0.5rem;\n min-width: 0.5rem;\n flex-shrink: 0;\n`;\n\nexport const StyledEmailHeader = styled.div(({ theme }) => {\n return css`\n grid-column-gap: ${theme.base.spacing};\n padding: 0 0 calc(2 * ${theme.base.spacing}) calc(2 * ${theme.base.spacing});\n ${StyledVisual},${StyledSummaryItemActions} {\n align-self: flex-start;\n }\n ${StyledSecondary} {\n margin-top: calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledEmailHeader.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestedRepliesButton = styled(Button)(({ theme }) => {\n return css`\n & + & {\n margin-inline-start: 0;\n }\n margin-block-start: ${theme.base.spacing};\n :not(:last-child) {\n margin-inline-end: ${theme.base.spacing};\n }\n `;\n});\n\nStyledSuggestedRepliesButton.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestedRepliesMenuButton = styled(MenuButton)(({ theme }) => {\n return css`\n &&& {\n margin-inline-start: 0;\n }\n margin-block-start: ${theme.base.spacing};\n :not(:last-child) {\n margin-inline-end: ${theme.base.spacing};\n }\n `;\n});\n\nStyledSuggestedRepliesMenuButton.defaultProps = defaultThemeProp;\n\nexport const StyledEmailBody = styled.div``;\n\nexport const StyledFromEmailDisplay = styled(EmailDisplay)(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSize.m};\n `;\n});\n\nStyledFromEmailDisplay.defaultProps = defaultThemeProp;\n\nexport const StyledEmailDisplay = styled.span`\n font-size: inherit;\n`;\n\nexport const StyledEmailPrimaryFieldValueList = styled(FieldValueList)`\n grid-template-columns: auto 1fr;\n`;\n\nexport const StyledEmailSecondaryFieldValueList = styled(FieldValueList)(({ theme }) => {\n return css`\n grid-template-columns: 1fr;\n gap: 0;\n padding: ${theme.base.spacing} 0;\n ${StyledFieldValue}:not(:last-child) {\n margin-bottom: calc(2 * ${theme.base.spacing});\n }\n ${StyledFieldName} {\n margin-bottom: calc(0.25 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledEmailSecondaryFieldValueList.defaultProps = defaultThemeProp;\n\nexport const StyledEmailMoreInfoPopover = styled.div(({ theme }) => {\n return css`\n z-index: ${theme.base['z-index'].modal + 1};\n max-width: 30rem;\n `;\n});\n\nStyledEmailMoreInfoPopover.defaultProps = defaultThemeProp;\n\nexport const StyledSecondarySeparator = styled.div(({ theme }) => {\n return css`\n margin: 0 calc(${theme.base.spacing} / 2);\n `;\n});\n\nStyledSecondarySeparator.defaultProps = defaultThemeProp;\n\nexport const StyledEmail = styled.div(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n return css`\n ${StyledBanner} {\n padding: 0 calc(2 * ${spacing}) calc(2 * ${spacing});\n }\n `;\n});\n\nStyledEmail.defaultProps = defaultThemeProp;\n\nexport const StyledEmailEntity = styled.mark<EmailEntityProps>(({ entity, theme }) => {\n const variant = entity.variant;\n const backgroundColor = readableHue(\n nlpColors[variant % nlpColors.length],\n theme.base.palette['primary-background']\n );\n const textColor = tryCatch(() => readableColor(backgroundColor));\n return css`\n border-radius: calc(${theme.base['border-radius']} / 3);\n padding: 0 calc(0.5 * ${theme.base.spacing});\n background-color: ${backgroundColor};\n color: ${textColor};\n display: inline-block;\n `;\n});\n\nStyledEmailEntity.defaultProps = defaultThemeProp;\n\nexport const StyledEntityList = styled(FieldValueList)(({ theme }) => {\n const textColor = tryCatch(() => readableColor(theme.base.palette['primary-background']));\n return css`\n ${StyledFieldName} {\n color: ${textColor};\n }\n ${StyledEmailEntity} {\n padding: 0 calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledEntityList.defaultProps = defaultThemeProp;\n\nexport const StyledForwardedContentToggle = styled(Button)`\n align-self: flex-start;\n`;\n\nexport const StyledLoadMore = styled.div(({ theme }) => {\n return css`\n margin: ${theme.base.spacing} 0;\n min-height: 2rem;\n min-width: 2rem;\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nexport const StyledContextMenuFieldSelector = styled.div<{\n selected?: boolean;\n}>(({ theme, selected }) => {\n const background = selected\n ? theme.base.colors.green.medium\n : theme.base.palette['primary-background'];\n const borderColor = selected\n ? theme.base.colors.green['extra-light']\n : theme.base.palette['primary-background'];\n return css`\n background-color: ${background};\n border: 0.0625rem solid ${borderColor};\n border-radius: 100%;\n display: inline-block;\n height: 0.625rem;\n width: 0.625rem;\n background-clip: content-box;\n padding: 0.0625rem;\n `;\n});\n\nStyledContextMenuFieldSelector.defaultProps = defaultThemeProp;\n\nexport const StyledEmailShellHeader = styled.header``;\nexport const StyledEmailConversationList = styled.ul``;\nexport const StyledEmailShell = styled.div<EmailShellProps & { singleConversation?: boolean }>(\n props => {\n const {\n theme: { base },\n singleConversation\n } = props;\n return css`\n min-width: 30rem;\n height: 100%;\n border-radius: ${base['border-radius']};\n > ${StyledEmailShellHeader} {\n padding-inline: calc(2 * ${base.spacing}) ${base.spacing};\n padding-block: ${base.spacing};\n background: ${base.palette['primary-background']};\n border-radius: ${base['border-radius']};\n\n ${singleConversation &&\n `\n border-radius: ${base['border-radius']} ${base['border-radius']} 0 0;\n border-bottom: 0.0625rem solid ${base.palette['border-line']};\n `}\n }\n > ${StyledEmailConversationList} {\n height: 100%;\n overflow-y: auto;\n list-style-type: none;\n }\n `;\n }\n);\n\nStyledEmailShell.defaultProps = defaultThemeProp;\n\nexport const StyledContextMenu = styled.div(({ theme }) => {\n return css`\n header {\n background-color: ${theme.base.palette['secondary-background']};\n }\n `;\n});\n\nStyledContextMenu.defaultProps = defaultThemeProp;\n\nexport const StyledList = styled.div(() => {\n return css`\n position: sticky;\n `;\n});\n\nStyledList.defaultProps = defaultThemeProp;\n\nexport const StyledHeader = styled.header(() => {\n return css`\n position: sticky;\n top: var(--appshell-offset);\n height: 4rem;\n padding-inline-start: 0;\n `;\n});\n\nexport const StyledEmailCaseViewHeader = styled.header(() => {\n return css`\n top: var(--appshell-offset);\n height: 4rem;\n padding-inline-start: 0;\n `;\n});\n\nexport const StyledUtilitiesContainer = styled.div<{ showExpandedUtilities: boolean }>(\n ({ showExpandedUtilities }) => {\n return css`\n ${showExpandedUtilities\n ? css`\n flex-shrink: 0;\n max-width: 23rem;\n `\n : css`\n position: sticky;\n top: calc(var(--appshell-offset));\n height: fit-content;\n `}\n `;\n }\n);\n\nexport const StyledGridContainer = styled.div<{\n showExpandedUtilities?: boolean;\n hasHeader: boolean;\n}>(({ theme, showExpandedUtilities, hasHeader }) => {\n return css`\n min-height: calc(100vh - var(--appshell-offset, 0rem));\n background-color: ${theme.base.palette['app-background']};\n ${hasHeader &&\n css`\n top: calc(var(--appshell-offset) + var(--headerOffsetHeight));\n `}\n ${!showExpandedUtilities &&\n css`\n width: auto;\n `}\n\n ${StyledList} {\n ${hasHeader\n ? css`\n top: calc(var(--appshell-offset) + var(--headerOffsetHeight));\n height: calc(100vh - var(--appshell-offset) - var(--headerOffsetHeight));\n `\n : css`\n top: calc(var(--appshell-offset));\n height: calc(100vh - var(--appshell-offset));\n `}\n }\n ${StyledUtilitiesContainer} {\n ${hasHeader &&\n css`\n top: calc(var(--appshell-offset) + 4rem);\n `}\n }\n `;\n});\n\nStyledGridContainer.defaultProps = defaultThemeProp;\n\nexport const StyledCollapsedUtilitiesToggle = styled.button(({ theme }) => {\n return css`\n color: ${theme.base.palette['foreground-color']};\n align-self: center;\n `;\n});\n\nStyledCollapsedUtilitiesToggle.defaultProps = defaultThemeProp;\n\nexport const StyledExpandedUtilitiesToggle = styled.button(({ theme }) => {\n return css`\n color: ${theme.base.palette['foreground-color']};\n align-self: flex-end;\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledExpandedUtilitiesToggle.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerUtilitiesToggle = styled.button(({ theme }) => {\n return css`\n color: ${theme.base.palette['foreground-color']};\n align-self: end;\n margin-block-start: 3rem;\n `;\n});\n\nStyledDrawerUtilitiesToggle.defaultProps = defaultThemeProp;\n\nexport const StyledExpandedUtilities = styled.div<{ showExpandedUtilities: boolean }>(\n ({ showExpandedUtilities }) => {\n return css`\n width: inherit;\n ${!showExpandedUtilities &&\n css`\n display: none;\n `}\n `;\n }\n);\n\nexport const StyledEmailActions = styled.div(() => {\n return css`\n ${StyledButton} + ${StyledButton} {\n margin-inline-start: 0;\n }\n ${StyledButton} + ${StyledPopover} + ${StyledButton} {\n margin-inline-start: 0;\n }\n `;\n});\n\nexport const StyledUtilities = styled.div<{ showExpandedUtilities: boolean }>(\n ({ showExpandedUtilities, theme }) => {\n return css`\n ${showExpandedUtilities &&\n css`\n width: 25rem;\n `}\n margin-inline-end: calc(2 * ${theme.base.spacing});\n `;\n }\n);\n\nStyledUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledEmailCaseViewColumns = styled.div<{ hasHeader?: boolean }>(({ hasHeader }) => {\n return css`\n ${StyledEmptyState} {\n flex-grow: 1;\n }\n ${StyledEmailShell} {\n min-width: 0;\n }\n ${StyledUtilitiesContainer} {\n ${hasHeader &&\n css`\n top: calc(var(--appshell-offset) + 4rem);\n `}\n }\n `;\n});\n\nexport const StyledEmailCaseViewDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: calc(100vh - 3rem);\n z-index: ${theme.base['z-index'].drawer - 1};\n top: 3rem;\n `;\n});\n\nStyledEmailCaseViewDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledEmailCaseViewContainer = styled.div(({ theme }) => {\n return css`\n padding-inline: calc(2 * ${theme.base.spacing});\n `;\n});\n\nStyledEmailCaseViewContainer.defaultProps = defaultThemeProp;\n\nexport const StyledEmailManagerContainer = styled.div(({ theme }) => {\n return css`\n padding-inline: calc(2 * ${theme.base.spacing});\n ${StyledEmailCaseViewContainer} {\n padding-inline: 0;\n }\n `;\n});\n\nStyledEmailManagerContainer.defaultProps = defaultThemeProp;\n\nexport const StyledEmailCountIcon = styled.div(({ theme }) => {\n return css`\n position: absolute;\n inset-inline-start: calc(2.5 * ${theme.base.spacing});\n inset-block-start: calc(-0.5 * ${theme.base.spacing});\n padding-inline: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledEmailCountIcon.defaultProps = defaultThemeProp;\n\nexport const StyledEmailSummaryList = styled.ol(({ theme }) => {\n return css`\n height: 100%;\n overflow-y: auto;\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus {\n ${StyledEmailSummaryItem}[data-current='true'] {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n }\n `;\n});\nStyledEmailSummaryList.defaultProps = defaultThemeProp;\n\nexport const StyledEmailNotificationList = styled(StyledEmailSummaryList)(({ theme }) => {\n const hoverColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n return css`\n ${StyledEmailSummaryItem} {\n background-color: ${theme.components['app-shell'].nav['background-color']};\n &:hover,\n &:focus-within {\n background-color: ${hoverColor};\n }\n }\n ${StyledMessageAndDate} {\n flex-wrap: wrap;\n }\n `;\n});\n\nStyledEmailNotificationList.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"Email.styles.js","sourceRoot":"","sources":["../../../src/components/Email/Email.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { mix, readableColor } from 'polished';\n\nimport {\n Button,\n calculateFontSize,\n defaultThemeProp,\n EmailDisplay,\n FieldValueList,\n MenuButton,\n StyledFieldName,\n StyledFieldValue,\n StyledSecondary,\n StyledSummaryItemActions,\n StyledVisual,\n tryCatch,\n readableHue,\n nlpColors,\n StyledPopover,\n StyledButton,\n StyledEmptyState,\n Count\n} from '@pega/cosmos-react-core';\nimport { StyledBanner } from '@pega/cosmos-react-core/lib/components/Banner/Banner';\n\nimport { EmailEntityProps, EmailShellProps } from './Email.types';\nimport { StyledEmailSummaryItem, StyledMessageAndDate } from './EmailSummaryItem';\n\nexport const StyledEmailMoreInfoButton = styled.button`\n min-height: 0.5rem;\n min-width: 0.5rem;\n flex-shrink: 0;\n`;\n\nexport const StyledEmailHeader = styled.div(({ theme }) => {\n return css`\n grid-column-gap: ${theme.base.spacing};\n padding: 0 0 calc(2 * ${theme.base.spacing}) calc(2 * ${theme.base.spacing});\n ${StyledVisual},${StyledSummaryItemActions} {\n align-self: flex-start;\n }\n ${StyledSecondary} {\n margin-top: calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledEmailHeader.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestedRepliesButton = styled(Button)(({ theme }) => {\n return css`\n & + & {\n margin-inline-start: 0;\n }\n margin-block-start: ${theme.base.spacing};\n :not(:last-child) {\n margin-inline-end: ${theme.base.spacing};\n }\n `;\n});\n\nStyledSuggestedRepliesButton.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestedRepliesMenuButton = styled(MenuButton)(({ theme }) => {\n return css`\n &&& {\n margin-inline-start: 0;\n }\n margin-block-start: ${theme.base.spacing};\n :not(:last-child) {\n margin-inline-end: ${theme.base.spacing};\n }\n `;\n});\n\nStyledSuggestedRepliesMenuButton.defaultProps = defaultThemeProp;\n\nexport const StyledEmailBody = styled.div``;\n\nexport const StyledFromEmailDisplay = styled(EmailDisplay)(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSize.m};\n `;\n});\n\nStyledFromEmailDisplay.defaultProps = defaultThemeProp;\n\nexport const StyledEmailDisplay = styled.span`\n font-size: inherit;\n`;\n\nexport const StyledEmailPrimaryFieldValueList = styled(FieldValueList)`\n grid-template-columns: auto 1fr;\n`;\n\nexport const StyledEmailSecondaryFieldValueList = styled(FieldValueList)(({ theme }) => {\n return css`\n grid-template-columns: 1fr;\n gap: 0;\n padding: ${theme.base.spacing} 0;\n ${StyledFieldValue}:not(:last-child) {\n margin-bottom: calc(2 * ${theme.base.spacing});\n }\n ${StyledFieldName} {\n margin-bottom: calc(0.25 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledEmailSecondaryFieldValueList.defaultProps = defaultThemeProp;\n\nexport const StyledEmailMoreInfoPopover = styled.div(({ theme }) => {\n return css`\n z-index: ${theme.base['z-index'].modal + 1};\n max-width: 30rem;\n `;\n});\n\nStyledEmailMoreInfoPopover.defaultProps = defaultThemeProp;\n\nexport const StyledSecondarySeparator = styled.div(({ theme }) => {\n return css`\n margin: 0 calc(${theme.base.spacing} / 2);\n `;\n});\n\nStyledSecondarySeparator.defaultProps = defaultThemeProp;\n\nexport const StyledEmail = styled.div(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n return css`\n ${StyledBanner} {\n padding: 0 calc(2 * ${spacing}) calc(2 * ${spacing});\n }\n `;\n});\n\nStyledEmail.defaultProps = defaultThemeProp;\n\nexport const StyledEmailEntity = styled.mark<EmailEntityProps>(({ entity, theme }) => {\n const variant = entity.variant;\n const backgroundColor = readableHue(\n nlpColors[variant % nlpColors.length],\n theme.base.palette['primary-background']\n );\n const textColor = tryCatch(() => readableColor(backgroundColor));\n return css`\n border-radius: calc(${theme.base['border-radius']} / 3);\n padding: 0 calc(0.5 * ${theme.base.spacing});\n background-color: ${backgroundColor};\n color: ${textColor};\n display: inline-block;\n `;\n});\n\nStyledEmailEntity.defaultProps = defaultThemeProp;\n\nexport const StyledEntityList = styled(FieldValueList)(({ theme }) => {\n const textColor = tryCatch(() => readableColor(theme.base.palette['primary-background']));\n return css`\n ${StyledFieldName} {\n color: ${textColor};\n }\n ${StyledEmailEntity} {\n padding: 0 calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledEntityList.defaultProps = defaultThemeProp;\n\nexport const StyledForwardedContentToggle = styled(Button)`\n align-self: flex-start;\n`;\n\nexport const StyledLoadMore = styled.div(({ theme }) => {\n return css`\n margin: ${theme.base.spacing} 0;\n min-height: 2rem;\n min-width: 2rem;\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nexport const StyledContextMenuFieldSelector = styled.div<{\n selected?: boolean;\n}>(({ theme, selected }) => {\n const background = selected\n ? theme.base.colors.green.medium\n : theme.base.palette['primary-background'];\n const borderColor = selected\n ? theme.base.colors.green['extra-light']\n : theme.base.palette['primary-background'];\n return css`\n background-color: ${background};\n border: 0.0625rem solid ${borderColor};\n border-radius: 100%;\n display: inline-block;\n height: 0.625rem;\n width: 0.625rem;\n background-clip: content-box;\n padding: 0.0625rem;\n `;\n});\n\nStyledContextMenuFieldSelector.defaultProps = defaultThemeProp;\n\nexport const StyledEmailShellHeader = styled.header``;\nexport const StyledEmailConversationList = styled.ul``;\nexport const StyledEmailShell = styled.div<EmailShellProps & { singleConversation?: boolean }>(\n props => {\n const {\n theme: { base },\n singleConversation\n } = props;\n return css`\n min-width: 30rem;\n height: 100%;\n border-radius: ${base['border-radius']};\n > ${StyledEmailShellHeader} {\n padding-inline: calc(2 * ${base.spacing}) ${base.spacing};\n padding-block: ${base.spacing};\n background: ${base.palette['primary-background']};\n border-radius: ${base['border-radius']};\n\n ${singleConversation &&\n `\n border-radius: ${base['border-radius']} ${base['border-radius']} 0 0;\n border-bottom: 0.0625rem solid ${base.palette['border-line']};\n `}\n }\n > ${StyledEmailConversationList} {\n height: 100%;\n overflow-y: auto;\n list-style-type: none;\n }\n `;\n }\n);\n\nStyledEmailShell.defaultProps = defaultThemeProp;\n\nexport const StyledContextMenu = styled.div(({ theme }) => {\n return css`\n header {\n background-color: ${theme.base.palette['secondary-background']};\n }\n `;\n});\n\nStyledContextMenu.defaultProps = defaultThemeProp;\n\nexport const StyledList = styled.div(() => {\n return css`\n position: sticky;\n `;\n});\n\nStyledList.defaultProps = defaultThemeProp;\n\nexport const StyledHeader = styled.header(() => {\n return css`\n position: sticky;\n top: var(--appshell-offset);\n height: 4rem;\n padding-inline-start: 0;\n `;\n});\n\nexport const StyledEmailCaseViewHeader = styled.header(() => {\n return css`\n top: var(--appshell-offset);\n height: 4rem;\n padding-inline-start: 0;\n `;\n});\n\nexport const StyledUtilitiesContainer = styled.div<{ showExpandedUtilities: boolean }>(\n ({ showExpandedUtilities }) => {\n return css`\n ${showExpandedUtilities\n ? css`\n flex-shrink: 0;\n max-width: 23rem;\n `\n : css`\n position: sticky;\n top: calc(var(--appshell-offset));\n height: fit-content;\n `}\n `;\n }\n);\n\nexport const StyledGridContainer = styled.div<{\n showExpandedUtilities?: boolean;\n hasHeader: boolean;\n}>(({ theme, showExpandedUtilities, hasHeader }) => {\n return css`\n min-height: calc(100vh - var(--appshell-offset, 0rem));\n background-color: ${theme.base.palette['app-background']};\n ${hasHeader &&\n css`\n top: calc(var(--appshell-offset) + var(--headerOffsetHeight));\n `}\n ${!showExpandedUtilities &&\n css`\n width: auto;\n `}\n\n ${StyledList} {\n ${hasHeader\n ? css`\n top: calc(var(--appshell-offset) + var(--headerOffsetHeight));\n height: calc(100vh - var(--appshell-offset) - var(--headerOffsetHeight));\n `\n : css`\n top: calc(var(--appshell-offset));\n height: calc(100vh - var(--appshell-offset));\n `}\n }\n ${StyledUtilitiesContainer} {\n ${hasHeader &&\n css`\n top: calc(var(--appshell-offset) + 4rem);\n `}\n }\n `;\n});\n\nStyledGridContainer.defaultProps = defaultThemeProp;\n\nexport const StyledCollapsedUtilitiesToggle = styled.button(({ theme }) => {\n return css`\n color: ${theme.base.palette['foreground-color']};\n align-self: center;\n `;\n});\n\nStyledCollapsedUtilitiesToggle.defaultProps = defaultThemeProp;\n\nexport const StyledExpandedUtilitiesToggle = styled.button(({ theme }) => {\n return css`\n color: ${theme.base.palette['foreground-color']};\n align-self: flex-end;\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledExpandedUtilitiesToggle.defaultProps = defaultThemeProp;\n\nexport const StyledDrawerUtilitiesToggle = styled.button(({ theme }) => {\n return css`\n color: ${theme.base.palette['foreground-color']};\n align-self: end;\n margin-block-start: 3rem;\n `;\n});\n\nStyledDrawerUtilitiesToggle.defaultProps = defaultThemeProp;\n\nexport const StyledExpandedUtilities = styled.div<{ showExpandedUtilities: boolean }>(\n ({ showExpandedUtilities }) => {\n return css`\n width: inherit;\n ${!showExpandedUtilities &&\n css`\n display: none;\n `}\n `;\n }\n);\n\nexport const StyledEmailActions = styled.div(() => {\n return css`\n ${StyledButton} + ${StyledButton} {\n margin-inline-start: 0;\n }\n ${StyledButton} + ${StyledPopover} + ${StyledButton} {\n margin-inline-start: 0;\n }\n `;\n});\n\nexport const StyledUtilities = styled.div<{ showExpandedUtilities: boolean }>(\n ({ showExpandedUtilities, theme }) => {\n return css`\n ${showExpandedUtilities &&\n css`\n width: 25rem;\n `}\n margin-inline-end: calc(2 * ${theme.base.spacing});\n `;\n }\n);\n\nStyledUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledEmailCaseViewColumns = styled.div<{ hasHeader?: boolean }>(({ hasHeader }) => {\n return css`\n ${StyledEmptyState} {\n flex-grow: 1;\n }\n ${StyledEmailShell} {\n min-width: 0;\n }\n ${StyledUtilitiesContainer} {\n ${hasHeader &&\n css`\n top: calc(var(--appshell-offset) + 4rem);\n `}\n }\n `;\n});\n\nexport const StyledEmailCaseViewDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: calc(100vh - 3rem);\n z-index: ${theme.base['z-index'].drawer - 1};\n top: 3rem;\n `;\n});\n\nStyledEmailCaseViewDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledEmailCaseViewContainer = styled.div(({ theme }) => {\n return css`\n padding-inline: calc(2 * ${theme.base.spacing});\n `;\n});\n\nStyledEmailCaseViewContainer.defaultProps = defaultThemeProp;\n\nexport const StyledEmailManagerContainer = styled.div(({ theme }) => {\n return css`\n padding-inline: calc(2 * ${theme.base.spacing});\n ${StyledEmailCaseViewContainer} {\n padding-inline: 0;\n }\n `;\n});\n\nStyledEmailManagerContainer.defaultProps = defaultThemeProp;\n\nexport const StyledEmailCountIcon = styled(Count)(({ theme }) => {\n return css`\n position: absolute;\n inset-inline-start: calc(2.5 * ${theme.base.spacing});\n inset-block-start: calc(-0.5 * ${theme.base.spacing});\n padding-inline: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledEmailCountIcon.defaultProps = defaultThemeProp;\n\nexport const StyledEmailSummaryList = styled.ol(({ theme }) => {\n return css`\n height: 100%;\n overflow-y: auto;\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus {\n ${StyledEmailSummaryItem}[data-current='true'] {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n }\n `;\n});\nStyledEmailSummaryList.defaultProps = defaultThemeProp;\n\nexport const StyledEmailNotificationList = styled(StyledEmailSummaryList)(({ theme }) => {\n const hoverColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n return css`\n ${StyledEmailSummaryItem} {\n background-color: ${theme.components['app-shell'].nav['background-color']};\n &:hover,\n &:focus-within {\n background-color: ${hoverColor};\n }\n }\n ${StyledMessageAndDate} {\n flex-wrap: wrap;\n }\n `;\n});\n\nStyledEmailNotificationList.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Email/EmailNotificationPanel.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailNotificationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailNotificationPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,~~EAEL~~,YAAY,EAEZ,UAAU,EAKX,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,eAAe,CAAC;AAKjE,eAAO,MAAM,0BAA0B,EAAE,iBAAiB,CACxD,UAAU,CAAC,2BAA2B,EAAE,SAAS,CAAC,GAAG,YAAY,~~CAgBlE~~,CAAC;AAEF,QAAA,MAAM,sBAAsB,EAAE,iBAAiB,CAAC,2BAA2B,GAAG,YAAY,CAazF,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
1	+ {"version":3,"file":"EmailNotificationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailNotificationPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EACL,YAAY,EAEZ,UAAU,EAKX,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,eAAe,CAAC;AAKjE,eAAO,MAAM,0BAA0B,EAAE,iBAAiB,CACxD,UAAU,CAAC,2BAA2B,EAAE,SAAS,CAAC,GAAG,YAAY,CAclE,CAAC;AAEF,QAAA,MAAM,sBAAsB,EAAE,iBAAiB,CAAC,2BAA2B,GAAG,YAAY,CAazF,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/lib/components/Email/EmailNotificationPanel.js CHANGED Viewed

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Count, Icon, registerIcon, StyledAvatar, useTheme, VisuallyHiddenText } from '@pega/cosmos-react-core';
+import { Icon, registerIcon, StyledAvatar, useTheme, VisuallyHiddenText } from '@pega/cosmos-react-core';
 import * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail-solid.icon';
 import { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';
 import { StyledEmailCountIcon } from './Email.styles';
 registerIcon(mailIcon);
 export const EmailNotificationPanelIcon = ({ status, label, count, ...restProps }) => {
     const { base: { colors } } = useTheme();
-    return (_jsxs(StyledAvatar, { as: StyledAvatar, ...restProps, size: 'm', backgroundColor: colors.white, children: [_jsx(Icon, { name: 'mail-solid' }), _jsx(Count, { as: StyledEmailCountIcon, variant: 'urgent', children: count }), _jsx(VisuallyHiddenText, { children: label })] }));
+    return (_jsxs(StyledAvatar, { as: StyledAvatar, ...restProps, size: 'm', backgroundColor: colors.white, children: [_jsx(Icon, { name: 'mail-solid' }), _jsx(StyledEmailCountIcon, { variant: 'urgent', children: count }), _jsx(VisuallyHiddenText, { children: label })] }));
 };
 const EmailNotificationPanel = ({ label, onClick, count, ...restProps }) => {
     return (_jsx(NavigationListItem, { primary: label, visual: _jsx(EmailNotificationPanelIcon, { ...restProps, count: count, label: label }), onClick: onClick }));

package/lib/components/Email/EmailNotificationPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailNotificationPanel.js","sourceRoot":"","sources":["../../../src/components/Email/EmailNotificationPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,~~EACL,KAAK,~~EAEL,IAAI,EAEJ,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,QAAQ,MAAM,mEAAmE,CAAC;AAC9F,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAC;AAGpG,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,CAAC,MAAM,0BAA0B,GAEnC,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;IAC7C,MAAM,EACJ,IAAI,EAAE,EAAE,MAAM,EAAE,EACjB,GAAG,QAAQ,EAAE,CAAC;IACf,OAAO,CACL,MAAC,YAAY,IAAC,EAAE,EAAE,YAAY,KAAM,SAAS,EAAE,IAAI,EAAC,GAAG,EAAC,eAAe,EAAE,MAAM,CAAC,KAAK,aACnF,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,EAE1B,KAAC,~~KAAK~~,IAAC,~~EAAE,EAAE,oBAAoB,EAAE,~~OAAO,EAAC,QAAQ,~~YAC9C~~,KAAK,~~GACA~~,~~EAER~~,KAAC,kBAAkB,cAAE,KAAK,GAAsB,IACnC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAkE,CAAC,EAC7F,KAAK,EACL,OAAO,EACP,KAAK,EACL,GAAG,SAAS,EACb,EAAE,EAAE;IACH,OAAO,CACL,KAAC,kBAAkB,IACjB,OAAO,EAAE,KAAK,EACd,MAAM,EAAE,KAAC,0BAA0B,OAAK,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,EACjF,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport {\n ~~Count,\n~~ ForwardProps,\n Icon,\n OmitStrict,\n registerIcon,\n StyledAvatar,\n useTheme,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail-solid.icon';\nimport { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';\n\nimport type { EmailNotificationPanelProps } from './Email.types';\nimport { StyledEmailCountIcon } from './Email.styles';\n\nregisterIcon(mailIcon);\n\nexport const EmailNotificationPanelIcon: FunctionComponent<\n OmitStrict<EmailNotificationPanelProps, 'onClick'> & ForwardProps\n> = ({ status, label, count, ...restProps }) => {\n const {\n base: { colors }\n } = useTheme();\n return (\n <StyledAvatar as={StyledAvatar} {...restProps} size='m' backgroundColor={colors.white}>\n <Icon name='mail-solid' />\n\n <~~Count as={~~StyledEmailCountIcon} variant='urgent'~~>\n~~ {count}\n </~~Count~~>\n\n <VisuallyHiddenText>{label}</VisuallyHiddenText>\n </StyledAvatar>\n );\n};\n\nconst EmailNotificationPanel: FunctionComponent<EmailNotificationPanelProps & ForwardProps> = ({\n label,\n onClick,\n count,\n ...restProps\n}) => {\n return (\n <NavigationListItem\n primary={label}\n visual={<EmailNotificationPanelIcon {...restProps} count={count} label={label} />}\n onClick={onClick}\n />\n );\n};\n\nexport default EmailNotificationPanel;\n"]}
1	+ {"version":3,"file":"EmailNotificationPanel.js","sourceRoot":"","sources":["../../../src/components/Email/EmailNotificationPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAEL,IAAI,EAEJ,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,QAAQ,MAAM,mEAAmE,CAAC;AAC9F,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAC;AAGpG,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,CAAC,MAAM,0BAA0B,GAEnC,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;IAC7C,MAAM,EACJ,IAAI,EAAE,EAAE,MAAM,EAAE,EACjB,GAAG,QAAQ,EAAE,CAAC;IACf,OAAO,CACL,MAAC,YAAY,IAAC,EAAE,EAAE,YAAY,KAAM,SAAS,EAAE,IAAI,EAAC,GAAG,EAAC,eAAe,EAAE,MAAM,CAAC,KAAK,aACnF,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,EAE1B,KAAC,oBAAoB,IAAC,OAAO,EAAC,QAAQ,YAAE,KAAK,GAAwB,EAErE,KAAC,kBAAkB,cAAE,KAAK,GAAsB,IACnC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAkE,CAAC,EAC7F,KAAK,EACL,OAAO,EACP,KAAK,EACL,GAAG,SAAS,EACb,EAAE,EAAE;IACH,OAAO,CACL,KAAC,kBAAkB,IACjB,OAAO,EAAE,KAAK,EACd,MAAM,EAAE,KAAC,0BAA0B,OAAK,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,EACjF,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport {\n ForwardProps,\n Icon,\n OmitStrict,\n registerIcon,\n StyledAvatar,\n useTheme,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail-solid.icon';\nimport { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';\n\nimport type { EmailNotificationPanelProps } from './Email.types';\nimport { StyledEmailCountIcon } from './Email.styles';\n\nregisterIcon(mailIcon);\n\nexport const EmailNotificationPanelIcon: FunctionComponent<\n OmitStrict<EmailNotificationPanelProps, 'onClick'> & ForwardProps\n> = ({ status, label, count, ...restProps }) => {\n const {\n base: { colors }\n } = useTheme();\n return (\n <StyledAvatar as={StyledAvatar} {...restProps} size='m' backgroundColor={colors.white}>\n <Icon name='mail-solid' />\n\n <StyledEmailCountIcon variant='urgent'>{count}</StyledEmailCountIcon>\n\n <VisuallyHiddenText>{label}</VisuallyHiddenText>\n </StyledAvatar>\n );\n};\n\nconst EmailNotificationPanel: FunctionComponent<EmailNotificationPanelProps & ForwardProps> = ({\n label,\n onClick,\n count,\n ...restProps\n}) => {\n return (\n <NavigationListItem\n primary={label}\n visual={<EmailNotificationPanelIcon {...restProps} count={count} label={label} />}\n onClick={onClick}\n />\n );\n};\n\nexport default EmailNotificationPanel;\n"]}

package/lib/components/Feed/FeedContentHeader.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeedContentHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/FeedContentHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA6C,MAAM,OAAO,CAAC;AA8BtE,OAAO,EAAE,sBAAsB,EAAsB,MAAM,cAAc,CAAC;~~AAkB1E~~,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAsMjD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"FeedContentHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/FeedContentHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA6C,MAAM,OAAO,CAAC;AA8BtE,OAAO,EAAE,sBAAsB,EAAsB,MAAM,cAAc,CAAC;AAsB1E,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAsMjD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/Feed/FeedContentHeader.js CHANGED Viewed

@@ -23,6 +23,9 @@ const StyledFeedContentHeader = styled.div(({ theme }) => {
   `;
 });
 StyledFeedContentHeader.defaultProps = defaultThemeProp;
+const StyledName = styled(Text) `
+  display: inline-block;
+`;
 const FeedContentHeader = (props) => {
     const { variant, id, fullname, username, postTimestamp, content, avatarSrc, icon, userStatus, postType, postContext, recipients = [], recipientsCount = 0, menuItems, edited, editTimestamp, recipientsLoading, onEditSubmit, onLoadMoreRecipients, onRecipientInteraction, onUserClick, setEditMode } = props;
     const { userInfo: loggedInUser } = useContext(FeedContext);
@@ -67,7 +70,7 @@ const FeedContentHeader = (props) => {
                 onUserClick?.({ id, username }, event);
             }, children: userVisual })) : (userVisual), primary: _jsxs("div", { children: [onUserClick ? (_jsx(Button, { variant: 'text', onClick: (event) => {
                         onUserClick?.({ id, username }, event);
-                    }, children: _jsx(Text, { variant: 'h3', children: fullname }) })) : (_jsx(Text, { variant: 'h3', children: fullname })), postContext && _jsxs(Text, { variant: 'primary', children: [" ", t('feed_context', [postContext])] })] }), secondary: _jsxs(Flex, { container: { gap: 0.5, alignItems: 'center' }, children: [postType === 'private' && (_jsx(Button, { variant: 'simple', as: FeedButton, icon: true, compact: true, onClick: recipients.length
+                    }, children: _jsx(Text, { variant: 'h3', children: fullname }) })) : (_jsx(StyledName, { variant: 'h3', children: fullname })), postContext && _jsxs(Text, { variant: 'primary', children: [" ", t('feed_context', [postContext])] })] }), secondary: _jsxs(Flex, { container: { gap: 0.5, alignItems: 'center' }, children: [postType === 'private' && (_jsx(Button, { variant: 'simple', as: FeedButton, icon: true, compact: true, onClick: recipients.length
                         ? () => {
                             if (recipientsCount > 2) {
                                 recipientsModalRef.current = create(FeedModalList, {

package/lib/components/Feed/FeedContentHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FeedContentHeader.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedContentHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, MouseEvent, useContext, useEffect, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n Button,\n DateTimeDisplay,\n defaultThemeProp,\n Flex,\n Icon,\n MenuButton,\n MetaList,\n ModalMethods,\n StyledSecondary,\n SummaryItem,\n Text,\n Tooltip,\n useConfiguration,\n useElement,\n useI18n,\n useModalManager\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { parseToDate } from '@pega/cosmos-react-core/lib/components/DateTime/Input/utils';\nimport { formatDateTime } from '@pega/cosmos-react-core/lib/components/DateTime/utils';\nimport { formatListToLocaleString } from '@pega/cosmos-react-core/lib/utils';\n\nimport { FeedContext } from './Feed.context';\nimport FeedModalList from './FeedModalList';\nimport FeedButton from './FeedButton';\nimport { FeedContentHeaderProps, FeedModalListProps } from './Feed.types';\n\nconst StyledFeedContentHeader = styled.div(({ theme }) => {\n return css`\n margin-block-end: ${theme.base.spacing};\n column-gap: ${theme.base.spacing};\n\n ${StyledSecondary} {\n ${FeedButton} {\n /* Negative margin needed to align the icon with the author name on the line above. /\n margin-inline-start: calc(-0.75 ${theme.base.spacing});\n }\n }\n `;\n});\n\nStyledFeedContentHeader.defaultProps = defaultThemeProp;\n\nconst FeedContentHeader: FC<FeedContentHeaderProps> = (props: FeedContentHeaderProps) => {\n const {\n variant,\n id,\n fullname,\n username,\n postTimestamp,\n content,\n avatarSrc,\n icon,\n userStatus,\n postType,\n postContext,\n recipients = [],\n recipientsCount = 0,\n menuItems,\n edited,\n editTimestamp,\n recipientsLoading,\n onEditSubmit,\n onLoadMoreRecipients,\n onRecipientInteraction,\n onUserClick,\n setEditMode\n } = props;\n\n const { userInfo: loggedInUser } = useContext(FeedContext);\n const t = useI18n();\n const { locale } = useConfiguration();\n const { create } = useModalManager();\n\n const recipientsModalRef = useRef<ModalMethods<FeedModalListProps>>();\n const [postTimestampEl, setPostTimestampEl] = useElement<HTMLSpanElement>();\n const [editTimestampEl, setEditTimestampEl] = useElement<HTMLSpanElement>();\n\n const timestamps = [\n <>\n <DateTimeDisplay ref={setPostTimestampEl} value={postTimestamp} variant='relative' />\n {postTimestamp && (\n <Tooltip target={postTimestampEl}>\n {formatDateTime(parseToDate(postTimestamp), {\n t,\n locale,\n format: 'short',\n variant: 'datetime',\n timeZone: loggedInUser.timeZone\n })}\n </Tooltip>\n )}\n </>\n ];\n\n if (edited) {\n timestamps.push(\n <>\n <Text ref={setEditTimestampEl} variant='secondary'>\n {t('edited', [<DateTimeDisplay value={editTimestamp} variant='relative' />])}\n </Text>\n {editTimestamp && (\n <Tooltip target={editTimestampEl}>\n {formatDateTime(parseToDate(editTimestamp), {\n t,\n locale,\n format: 'short',\n variant: 'datetime',\n timeZone: loggedInUser.timeZone\n })}\n </Tooltip>\n )}\n </>\n );\n }\n\n const userVisual = (\n <Avatar\n name={fullname}\n size={variant === 'post' ? 'l' : 'm'}\n imageSrc={avatarSrc}\n icon={icon}\n status={userStatus}\n />\n );\n\n const recipientsList = recipients.map(x => x.primary);\n\n useEffect(() => {\n if (recipients.length) {\n recipientsModalRef.current?.update({\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients,\n onLoadMore: onLoadMoreRecipients,\n loading: recipientsLoading\n });\n }\n }, [recipientsCount, recipients, onLoadMoreRecipients, recipientsLoading]);\n\n return (\n <SummaryItem\n as={StyledFeedContentHeader}\n visual={\n onUserClick ? (\n <BareButton\n onClick={(event: MouseEvent) => {\n onUserClick?.({ id, username }, event);\n }}\n >\n {userVisual}\n </BareButton>\n ) : (\n userVisual\n )\n }\n primary={\n <div>\n {onUserClick ? (\n <Button\n variant='text'\n onClick={(event: MouseEvent) => {\n onUserClick?.({ id, username }, event);\n }}\n >\n <Text variant='h3'>{fullname}</Text>\n </Button>\n ) : (\n <Text variant='h3'>{fullname}</Text>\n )}\n {postContext && <Text variant='primary'> {t('feed_context', [postContext])}</Text>}\n </div>\n }\n secondary={\n <Flex container={{ gap: 0.5, alignItems: 'center' }}>\n {postType === 'private' && (\n <Button\n variant='simple'\n as={FeedButton}\n icon\n compact\n onClick={\n recipients.length\n ? () => {\n if (recipientsCount > 2) {\n recipientsModalRef.current = create(FeedModalList, {\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients,\n onLoadMore: onLoadMoreRecipients,\n loading: recipientsLoading\n });\n }\n }\n : onRecipientInteraction\n }\n onFocus={onRecipientInteraction}\n onMouseOver={onRecipientInteraction}\n aria-label={`${t('feed_private_post')} ${t(\n 'feed_recipients'\n )} ${formatListToLocaleString(recipientsList.slice(0, 2), t, locale, {\n count: recipientsCount\n })}`}\n label={`${t('feed_private_post')}:\\n${\n formatListToLocaleString(recipientsList.slice(0, 2), t, locale, {\n count: recipientsCount,\n separator: '\\n'\n }) \|\| t('feed_private_post')\n }`}\n >\n <Icon name='lock-closed-solid' />\n </Button>\n )}\n <MetaList items={timestamps} />\n </Flex>\n }\n actions={\n menuItems ? (\n <MenuButton\n text={t('feed_post_actions_menu')}\n menu={{\n items:\n onEditSubmit && typeof content === 'string' && username === loggedInUser.username\n ? [\n {\n primary: t('edit'),\n id: 'edit',\n onClick: () => setEditMode(true)\n },\n ...menuItems\n ]\n : menuItems\n }}\n icon='more'\n iconOnly\n variant='simple'\n />\n ) : undefined\n }\n />\n );\n};\n\nexport default FeedContentHeader;\n"]}
1	+ {"version":3,"file":"FeedContentHeader.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedContentHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, MouseEvent, useContext, useEffect, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n Button,\n DateTimeDisplay,\n defaultThemeProp,\n Flex,\n Icon,\n MenuButton,\n MetaList,\n ModalMethods,\n StyledSecondary,\n SummaryItem,\n Text,\n Tooltip,\n useConfiguration,\n useElement,\n useI18n,\n useModalManager\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { parseToDate } from '@pega/cosmos-react-core/lib/components/DateTime/Input/utils';\nimport { formatDateTime } from '@pega/cosmos-react-core/lib/components/DateTime/utils';\nimport { formatListToLocaleString } from '@pega/cosmos-react-core/lib/utils';\n\nimport { FeedContext } from './Feed.context';\nimport FeedModalList from './FeedModalList';\nimport FeedButton from './FeedButton';\nimport { FeedContentHeaderProps, FeedModalListProps } from './Feed.types';\n\nconst StyledFeedContentHeader = styled.div(({ theme }) => {\n return css`\n margin-block-end: ${theme.base.spacing};\n column-gap: ${theme.base.spacing};\n\n ${StyledSecondary} {\n ${FeedButton} {\n /* Negative margin needed to align the icon with the author name on the line above. /\n margin-inline-start: calc(-0.75 ${theme.base.spacing});\n }\n }\n `;\n});\n\nStyledFeedContentHeader.defaultProps = defaultThemeProp;\n\nconst StyledName = styled(Text)`\n display: inline-block;\n`;\n\nconst FeedContentHeader: FC<FeedContentHeaderProps> = (props: FeedContentHeaderProps) => {\n const {\n variant,\n id,\n fullname,\n username,\n postTimestamp,\n content,\n avatarSrc,\n icon,\n userStatus,\n postType,\n postContext,\n recipients = [],\n recipientsCount = 0,\n menuItems,\n edited,\n editTimestamp,\n recipientsLoading,\n onEditSubmit,\n onLoadMoreRecipients,\n onRecipientInteraction,\n onUserClick,\n setEditMode\n } = props;\n\n const { userInfo: loggedInUser } = useContext(FeedContext);\n const t = useI18n();\n const { locale } = useConfiguration();\n const { create } = useModalManager();\n\n const recipientsModalRef = useRef<ModalMethods<FeedModalListProps>>();\n const [postTimestampEl, setPostTimestampEl] = useElement<HTMLSpanElement>();\n const [editTimestampEl, setEditTimestampEl] = useElement<HTMLSpanElement>();\n\n const timestamps = [\n <>\n <DateTimeDisplay ref={setPostTimestampEl} value={postTimestamp} variant='relative' />\n {postTimestamp && (\n <Tooltip target={postTimestampEl}>\n {formatDateTime(parseToDate(postTimestamp), {\n t,\n locale,\n format: 'short',\n variant: 'datetime',\n timeZone: loggedInUser.timeZone\n })}\n </Tooltip>\n )}\n </>\n ];\n\n if (edited) {\n timestamps.push(\n <>\n <Text ref={setEditTimestampEl} variant='secondary'>\n {t('edited', [<DateTimeDisplay value={editTimestamp} variant='relative' />])}\n </Text>\n {editTimestamp && (\n <Tooltip target={editTimestampEl}>\n {formatDateTime(parseToDate(editTimestamp), {\n t,\n locale,\n format: 'short',\n variant: 'datetime',\n timeZone: loggedInUser.timeZone\n })}\n </Tooltip>\n )}\n </>\n );\n }\n\n const userVisual = (\n <Avatar\n name={fullname}\n size={variant === 'post' ? 'l' : 'm'}\n imageSrc={avatarSrc}\n icon={icon}\n status={userStatus}\n />\n );\n\n const recipientsList = recipients.map(x => x.primary);\n\n useEffect(() => {\n if (recipients.length) {\n recipientsModalRef.current?.update({\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients,\n onLoadMore: onLoadMoreRecipients,\n loading: recipientsLoading\n });\n }\n }, [recipientsCount, recipients, onLoadMoreRecipients, recipientsLoading]);\n\n return (\n <SummaryItem\n as={StyledFeedContentHeader}\n visual={\n onUserClick ? (\n <BareButton\n onClick={(event: MouseEvent) => {\n onUserClick?.({ id, username }, event);\n }}\n >\n {userVisual}\n </BareButton>\n ) : (\n userVisual\n )\n }\n primary={\n <div>\n {onUserClick ? (\n <Button\n variant='text'\n onClick={(event: MouseEvent) => {\n onUserClick?.({ id, username }, event);\n }}\n >\n <Text variant='h3'>{fullname}</Text>\n </Button>\n ) : (\n <StyledName variant='h3'>{fullname}</StyledName>\n )}\n {postContext && <Text variant='primary'> {t('feed_context', [postContext])}</Text>}\n </div>\n }\n secondary={\n <Flex container={{ gap: 0.5, alignItems: 'center' }}>\n {postType === 'private' && (\n <Button\n variant='simple'\n as={FeedButton}\n icon\n compact\n onClick={\n recipients.length\n ? () => {\n if (recipientsCount > 2) {\n recipientsModalRef.current = create(FeedModalList, {\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients,\n onLoadMore: onLoadMoreRecipients,\n loading: recipientsLoading\n });\n }\n }\n : onRecipientInteraction\n }\n onFocus={onRecipientInteraction}\n onMouseOver={onRecipientInteraction}\n aria-label={`${t('feed_private_post')} ${t(\n 'feed_recipients'\n )} ${formatListToLocaleString(recipientsList.slice(0, 2), t, locale, {\n count: recipientsCount\n })}`}\n label={`${t('feed_private_post')}:\\n${\n formatListToLocaleString(recipientsList.slice(0, 2), t, locale, {\n count: recipientsCount,\n separator: '\\n'\n }) \|\| t('feed_private_post')\n }`}\n >\n <Icon name='lock-closed-solid' />\n </Button>\n )}\n <MetaList items={timestamps} />\n </Flex>\n }\n actions={\n menuItems ? (\n <MenuButton\n text={t('feed_post_actions_menu')}\n menu={{\n items:\n onEditSubmit && typeof content === 'string' && username === loggedInUser.username\n ? [\n {\n primary: t('edit'),\n id: 'edit',\n onClick: () => setEditMode(true)\n },\n ...menuItems\n ]\n : menuItems\n }}\n icon='more'\n iconOnly\n variant='simple'\n />\n ) : undefined\n }\n />\n );\n};\n\nexport default FeedContentHeader;\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-social",
-  "version": "5.0.0-dev.1.0",
+  "version": "5.0.0-dev.2.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/pegasystems/cosmos-react.git",
@@ -23,9 +23,9 @@
     "build": "tsc -b"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "5.0.0-dev.1.0",
-    "@pega/cosmos-react-rte": "5.0.0-dev.1.0",
-    "@pega/cosmos-react-work": "5.0.0-dev.1.0",
+    "@pega/cosmos-react-core": "5.0.0-dev.2.0",
+    "@pega/cosmos-react-rte": "5.0.0-dev.2.0",
+    "@pega/cosmos-react-work": "5.0.0-dev.2.0",
     "@types/parse5": "^6.0.0",
     "@types/react": "^16.14.24 || ^17.0.38",
     "@types/react-dom": "^16.9.14 || ^17.0.11",
@@ -37,12 +37,12 @@
     "styled-components": "^5.2.0"
   },
   "devDependencies": {
-    "@storybook/addon-a11y": "^7.0.24",
-    "@storybook/addon-actions": "^7.0.24",
-    "@storybook/addon-storysource": "^7.0.24",
-    "@storybook/addon-toolbars": "^7.0.24",
-    "@storybook/react": "^7.0.24",
-    "@storybook/theming": "^7.0.24",
+    "@storybook/addon-a11y": "~7.0.24",
+    "@storybook/addon-actions": "~7.0.24",
+    "@storybook/addon-storysource": "~7.0.24",
+    "@storybook/addon-toolbars": "~7.0.24",
+    "@storybook/react": "~7.0.24",
+    "@storybook/theming": "~7.0.24",
     "@testing-library/react": "^12.1.3",
     "@testing-library/user-event": "^13.5.0",
     "typescript": "~5.0.2"