@pega/cosmos-react-social 3.0.0-dev.4.2 → 3.0.0-dev.7.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 (82) hide show
  1. package/lib/components/Chat/Chat.js +1 -1
  2. package/lib/components/Chat/Chat.js.map +1 -1
  3. package/lib/components/Chat/ChatBody.js +1 -1
  4. package/lib/components/Chat/ChatBody.js.map +1 -1
  5. package/lib/components/Chat/ChatComposer.js +6 -6
  6. package/lib/components/Chat/ChatComposer.js.map +1 -1
  7. package/lib/components/Chat/ChatHeader.js +1 -1
  8. package/lib/components/Chat/ChatHeader.js.map +1 -1
  9. package/lib/components/Chat/ChatTranscript.js +3 -3
  10. package/lib/components/Chat/ChatTranscript.js.map +1 -1
  11. package/lib/components/Chat/Message.js +9 -9
  12. package/lib/components/Chat/Message.js.map +1 -1
  13. package/lib/components/Chat/MessageList.js +3 -3
  14. package/lib/components/Chat/MessageList.js.map +1 -1
  15. package/lib/components/Chat/RepeatingView.js +1 -1
  16. package/lib/components/Chat/RepeatingView.js.map +1 -1
  17. package/lib/components/Chat/SuggestedReplyPicker.js +6 -6
  18. package/lib/components/Chat/SuggestedReplyPicker.js.map +1 -1
  19. package/lib/components/Chat/SystemMessage.js +1 -1
  20. package/lib/components/Chat/SystemMessage.js.map +1 -1
  21. package/lib/components/Chat/TranscriptMessage.js +2 -2
  22. package/lib/components/Chat/TranscriptMessage.js.map +1 -1
  23. package/lib/components/Chat/TypeIndicator.js +1 -1
  24. package/lib/components/Chat/TypeIndicator.js.map +1 -1
  25. package/lib/components/Email/ContextMenuPopover.js +2 -2
  26. package/lib/components/Email/ContextMenuPopover.js.map +1 -1
  27. package/lib/components/Email/Email.js +24 -24
  28. package/lib/components/Email/Email.js.map +1 -1
  29. package/lib/components/Email/Email.types.d.ts +1 -1
  30. package/lib/components/Email/Email.types.d.ts.map +1 -1
  31. package/lib/components/Email/Email.types.js.map +1 -1
  32. package/lib/components/Email/EmailComposer.d.ts.map +1 -1
  33. package/lib/components/Email/EmailComposer.js +40 -33
  34. package/lib/components/Email/EmailComposer.js.map +1 -1
  35. package/lib/components/Email/EmailConversation.js +4 -4
  36. package/lib/components/Email/EmailConversation.js.map +1 -1
  37. package/lib/components/Email/EmailEntity.js +2 -2
  38. package/lib/components/Email/EmailEntity.js.map +1 -1
  39. package/lib/components/Email/EmailSelector.d.ts +2 -2
  40. package/lib/components/Email/EmailSelector.d.ts.map +1 -1
  41. package/lib/components/Email/EmailSelector.js +36 -28
  42. package/lib/components/Email/EmailSelector.js.map +1 -1
  43. package/lib/components/Email/EmailShell.js +4 -4
  44. package/lib/components/Email/EmailShell.js.map +1 -1
  45. package/lib/components/Email/EmailSummaryItem.js +4 -4
  46. package/lib/components/Email/EmailSummaryItem.js.map +1 -1
  47. package/lib/components/Email/EmailSummaryList.js +5 -5
  48. package/lib/components/Email/EmailSummaryList.js.map +1 -1
  49. package/lib/components/Email/EntityList.js +2 -2
  50. package/lib/components/Email/EntityList.js.map +1 -1
  51. package/lib/components/Email/index.d.ts +1 -1
  52. package/lib/components/Email/index.d.ts.map +1 -1
  53. package/lib/components/Email/index.js.map +1 -1
  54. package/lib/components/Feed/Feed.js +4 -4
  55. package/lib/components/Feed/Feed.js.map +1 -1
  56. package/lib/components/Feed/FeedAnnouncer.js +1 -1
  57. package/lib/components/Feed/FeedAnnouncer.js.map +1 -1
  58. package/lib/components/Feed/FeedAttachments.js +3 -3
  59. package/lib/components/Feed/FeedAttachments.js.map +1 -1
  60. package/lib/components/Feed/FeedContent.js +1 -1
  61. package/lib/components/Feed/FeedContent.js.map +1 -1
  62. package/lib/components/Feed/FeedLikeButton.js +4 -4
  63. package/lib/components/Feed/FeedLikeButton.js.map +1 -1
  64. package/lib/components/Feed/FeedModalList.js +1 -1
  65. package/lib/components/Feed/FeedModalList.js.map +1 -1
  66. package/lib/components/Feed/FeedNewPost.js +4 -4
  67. package/lib/components/Feed/FeedNewPost.js.map +1 -1
  68. package/lib/components/Feed/FeedNewPostTypeMenu.js +8 -8
  69. package/lib/components/Feed/FeedNewPostTypeMenu.js.map +1 -1
  70. package/lib/components/Feed/FeedPost.js +9 -9
  71. package/lib/components/Feed/FeedPost.js.map +1 -1
  72. package/lib/components/Feed/FeedReply.js +6 -6
  73. package/lib/components/Feed/FeedReply.js.map +1 -1
  74. package/lib/components/Feed/FeedReplyInput.js +4 -4
  75. package/lib/components/Feed/FeedReplyInput.js.map +1 -1
  76. package/lib/components/Feed/FeedRichText.js +1 -1
  77. package/lib/components/Feed/FeedRichText.js.map +1 -1
  78. package/lib/components/HashtagButton/HashtagButton.js +2 -2
  79. package/lib/components/HashtagButton/HashtagButton.js.map +1 -1
  80. package/lib/components/MentionButton/MentionButton.js +2 -2
  81. package/lib/components/MentionButton/MentionButton.js.map +1 -1
  82. package/package.json +5 -5
@@ -79,8 +79,8 @@ const FeedAttachments = forwardRef((props, ref) => {
79
79
  nonPreviewableFiles.push(file);
80
80
  });
81
81
  return (_jsxs(StyledAttachmentsRegion, { children: [readOnly && !!previewableFiles.length && (_jsx(Flex, { container: { direction: 'column', gap: 1 }, children: previewableFiles.map(({ lastModified, name, onPreview, thumbnail }) => {
82
- return (_jsx(StyledImagePreview, { onClick: () => onPreview?.(name), children: _jsx(Image, { alt: name, src: thumbnail }, void 0) }, lastModified));
83
- }) }, void 0)), _jsxs(Grid, { ref: ref, as: StyledFeedAttachments, container: {
82
+ return (_jsx(StyledImagePreview, { onClick: () => onPreview?.(name), children: _jsx(Image, { alt: name, src: thumbnail }) }, lastModified));
83
+ }) })), _jsxs(Grid, { ref: ref, as: StyledFeedAttachments, container: {
84
84
  cols: 'repeat(auto-fill, minmax(15rem, 1fr))',
85
85
  gap: 1
86
86
  }, children: [!readOnly &&
@@ -88,7 +88,7 @@ const FeedAttachments = forwardRef((props, ref) => {
88
88
  return _jsx(FileUploadItem, { name: name, size: size, ...restProps }, lastModified);
89
89
  }), nonPreviewableFiles.map(({ lastModified, name, size, ...restProps }) => {
90
90
  return _jsx(FileUploadItem, { name: name, size: size, ...restProps }, lastModified);
91
- })] }, void 0)] }, void 0));
91
+ })] })] }));
92
92
  });
93
93
  export default FeedAttachments;
94
94
  //# sourceMappingURL=FeedAttachments.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FeedAttachments.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedAttachments.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, forwardRef, PropsWithoutRef, Ref, useEffect, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n FileUploadItem,\n FileUploadItemProps,\n Grid,\n Image,\n defaultThemeProp,\n getKindFromMimeType,\n getMimeTypeFromFile,\n Flex,\n StyledFlex,\n usePrevious,\n useI18n\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { FeedContext } from './Feed.context';\n\nexport type AttachedFiles = FileUploadItemProps & File;\n\ninterface FeedAttachmentsProps {\n attachments?: AttachedFiles[];\n readOnly?: boolean;\n ref?: Ref<HTMLUListElement>;\n}\n\nexport const StyledFeedAttachments = styled.ul(({ theme }) => {\n return css`\n overflow-x: auto;\n\n > li {\n background-color: ${theme.base.palette['primary-background']};\n cursor: initial;\n }\n `;\n});\n\nStyledFeedAttachments.defaultProps = defaultThemeProp;\n\nexport const StyledImagePreview = styled(BareButton)(({ theme }) => {\n return css`\n line-height: 0;\n\n /* stylelint-disable declaration-block-no-duplicate-properties */\n width: -moz-fit-content;\n width: fit-content;\n\n /* stylelint-enable declaration-block-no-duplicate-properties */\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n\n & + & {\n margin: 0;\n }\n\n &:focus {\n box-shadow: ${theme.components.button['focus-shadow']};\n }\n\n img {\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n object-fit: contain;\n max-height: 32rem;\n max-width: 100%;\n }\n `;\n});\n\nStyledImagePreview.defaultProps = defaultThemeProp;\n\nexport const StyledAttachmentsRegion = styled.div(({ theme }) => {\n return css`\n margin: ${theme.base.spacing} 0;\n\n ${StyledFlex} + ${StyledFeedAttachments} {\n margin-block-start: ${theme.base.spacing};\n }\n `;\n});\n\nStyledAttachmentsRegion.defaultProps = defaultThemeProp;\n\nconst FeedAttachments: FC<FeedAttachmentsProps> = forwardRef(\n (props: PropsWithoutRef<FeedAttachmentsProps>, ref: FeedAttachmentsProps['ref']) => {\n const { attachments = [], readOnly } = props;\n const t = useI18n();\n const { announce } = useContext(FeedContext);\n const prevAttachments = usePrevious(attachments) ?? [];\n\n useEffect(() => {\n if (attachments.length !== prevAttachments?.length) {\n const difference = attachments.length - prevAttachments.length;\n const normalizedDifference = difference * (difference > 0 ? 1 : -1);\n announce(\n t(`feed_attachments_${difference > 0 ? 'added' : 'removed'}`, [normalizedDifference], {\n count: normalizedDifference\n })\n );\n }\n }, [attachments]);\n\n if (attachments.length === 0) return null;\n\n const previewableFiles: AttachedFiles[] = [];\n const nonPreviewableFiles: AttachedFiles[] = [];\n\n attachments.forEach(file => {\n const type = getKindFromMimeType(getMimeTypeFromFile(file.name) ?? '');\n\n if (type === 'image' && file.thumbnail) previewableFiles.push(file);\n else nonPreviewableFiles.push(file);\n });\n\n return (\n <StyledAttachmentsRegion>\n {readOnly && !!previewableFiles.length && (\n <Flex container={{ direction: 'column', gap: 1 }}>\n {previewableFiles.map(({ lastModified, name, onPreview, thumbnail }) => {\n return (\n <StyledImagePreview key={lastModified} onClick={() => onPreview?.(name)}>\n <Image alt={name} src={thumbnail} />\n </StyledImagePreview>\n );\n })}\n </Flex>\n )}\n <Grid\n ref={ref}\n as={StyledFeedAttachments}\n container={{\n cols: 'repeat(auto-fill, minmax(15rem, 1fr))',\n gap: 1\n }}\n >\n {!readOnly &&\n previewableFiles.map(({ lastModified, name, size, ...restProps }) => {\n return <FileUploadItem key={lastModified} name={name} size={size} {...restProps} />;\n })}\n {nonPreviewableFiles.map(({ lastModified, name, size, ...restProps }) => {\n return <FileUploadItem key={lastModified} name={name} size={size} {...restProps} />;\n })}\n </Grid>\n </StyledAttachmentsRegion>\n );\n }\n);\n\nexport default FeedAttachments;\n"]}
1
+ {"version":3,"file":"FeedAttachments.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedAttachments.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, forwardRef, PropsWithoutRef, Ref, useEffect, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n FileUploadItem,\n FileUploadItemProps,\n Grid,\n Image,\n defaultThemeProp,\n getKindFromMimeType,\n getMimeTypeFromFile,\n Flex,\n StyledFlex,\n usePrevious,\n useI18n\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { FeedContext } from './Feed.context';\n\nexport type AttachedFiles = FileUploadItemProps & File;\n\ninterface FeedAttachmentsProps {\n attachments?: AttachedFiles[];\n readOnly?: boolean;\n ref?: Ref<HTMLUListElement>;\n}\n\nexport const StyledFeedAttachments = styled.ul(({ theme }) => {\n return css`\n overflow-x: auto;\n\n > li {\n background-color: ${theme.base.palette['primary-background']};\n cursor: initial;\n }\n `;\n});\n\nStyledFeedAttachments.defaultProps = defaultThemeProp;\n\nexport const StyledImagePreview = styled(BareButton)(({ theme }) => {\n return css`\n line-height: 0;\n\n /* stylelint-disable declaration-block-no-duplicate-properties */\n width: -moz-fit-content;\n width: fit-content;\n\n /* stylelint-enable declaration-block-no-duplicate-properties */\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n\n & + & {\n margin: 0;\n }\n\n &:focus {\n box-shadow: ${theme.components.button['focus-shadow']};\n }\n\n img {\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n object-fit: contain;\n max-height: 32rem;\n max-width: 100%;\n }\n `;\n});\n\nStyledImagePreview.defaultProps = defaultThemeProp;\n\nexport const StyledAttachmentsRegion = styled.div(({ theme }) => {\n return css`\n margin: ${theme.base.spacing} 0;\n\n ${StyledFlex} + ${StyledFeedAttachments} {\n margin-block-start: ${theme.base.spacing};\n }\n `;\n});\n\nStyledAttachmentsRegion.defaultProps = defaultThemeProp;\n\nconst FeedAttachments: FC<FeedAttachmentsProps> = forwardRef(\n (props: PropsWithoutRef<FeedAttachmentsProps>, ref: FeedAttachmentsProps['ref']) => {\n const { attachments = [], readOnly } = props;\n const t = useI18n();\n const { announce } = useContext(FeedContext);\n const prevAttachments = usePrevious(attachments) ?? [];\n\n useEffect(() => {\n if (attachments.length !== prevAttachments?.length) {\n const difference = attachments.length - prevAttachments.length;\n const normalizedDifference = difference * (difference > 0 ? 1 : -1);\n announce(\n t(`feed_attachments_${difference > 0 ? 'added' : 'removed'}`, [normalizedDifference], {\n count: normalizedDifference\n })\n );\n }\n }, [attachments]);\n\n if (attachments.length === 0) return null;\n\n const previewableFiles: AttachedFiles[] = [];\n const nonPreviewableFiles: AttachedFiles[] = [];\n\n attachments.forEach(file => {\n const type = getKindFromMimeType(getMimeTypeFromFile(file.name) ?? '');\n\n if (type === 'image' && file.thumbnail) previewableFiles.push(file);\n else nonPreviewableFiles.push(file);\n });\n\n return (\n <StyledAttachmentsRegion>\n {readOnly && !!previewableFiles.length && (\n <Flex container={{ direction: 'column', gap: 1 }}>\n {previewableFiles.map(({ lastModified, name, onPreview, thumbnail }) => {\n return (\n <StyledImagePreview key={lastModified} onClick={() => onPreview?.(name)}>\n <Image alt={name} src={thumbnail} />\n </StyledImagePreview>\n );\n })}\n </Flex>\n )}\n <Grid\n ref={ref}\n as={StyledFeedAttachments}\n container={{\n cols: 'repeat(auto-fill, minmax(15rem, 1fr))',\n gap: 1\n }}\n >\n {!readOnly &&\n previewableFiles.map(({ lastModified, name, size, ...restProps }) => {\n return <FileUploadItem key={lastModified} name={name} size={size} {...restProps} />;\n })}\n {nonPreviewableFiles.map(({ lastModified, name, size, ...restProps }) => {\n return <FileUploadItem key={lastModified} name={name} size={size} {...restProps} />;\n })}\n </Grid>\n </StyledAttachmentsRegion>\n );\n }\n);\n\nexport default FeedAttachments;\n"]}
@@ -24,7 +24,7 @@ const FeedContent = forwardRef(({ children, maxContentHeight = Infinity, ...rest
24
24
  observer.disconnect();
25
25
  };
26
26
  }, [rtvRef.current, maxContentHeight]);
27
- return useMemo(() => typeof children === 'string' ? (_jsxs(Flex, { ref: ref, container: { direction: 'column', gap: 1 }, children: [_jsx(ExpandCollapse, { collapsed: collapsed, min: exceedsMaxHeight ? `${maxContentHeight}px` : 'max-content', ...restProps, children: _jsx(RichTextViewer, { ref: rtvRef, content: children, type: 'markdown', interactionRenderers: interactionRenderers, markdownMap: markdownMap }, void 0) }, void 0), exceedsMaxHeight && (_jsx(Flex, { container: { justify: 'center' }, children: _jsx(Button, { variant: 'link', onClick: () => setCollapsed(current => !current), children: collapsed ? 'Show more' : 'Show less' }, void 0) }, void 0))] }, void 0)) : (children), [
27
+ return useMemo(() => typeof children === 'string' ? (_jsxs(Flex, { ref: ref, container: { direction: 'column', gap: 1 }, children: [_jsx(ExpandCollapse, { collapsed: collapsed, min: exceedsMaxHeight ? `${maxContentHeight}px` : 'max-content', ...restProps, children: _jsx(RichTextViewer, { ref: rtvRef, content: children, type: 'markdown', interactionRenderers: interactionRenderers, markdownMap: markdownMap }) }), exceedsMaxHeight && (_jsx(Flex, { container: { justify: 'center' }, children: _jsx(Button, { variant: 'link', onClick: () => setCollapsed(current => !current), children: collapsed ? 'Show more' : 'Show less' }) }))] })) : (children), [
28
28
  children,
29
29
  collapsed,
30
30
  exceedsMaxHeight,
@@ -1 +1 @@
1
- {"version":3,"file":"FeedContent.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedContent.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n Ref,\n forwardRef,\n useState,\n useMemo,\n useRef,\n useEffect,\n PropsWithoutRef,\n ReactElement,\n useContext\n} from 'react';\n\nimport { Button, ExpandCollapse, Flex, ForwardProps } from '@pega/cosmos-react-core';\nimport { RichTextViewer } from '@pega/cosmos-react-rte';\n\nimport { FeedContext } from './Feed.context';\n\nexport interface FeedContentProps {\n children: ReactElement | string;\n /**\n * A maximum height in pixels to display post content within before prompting to expand the post.\n * @default Infinity\n */\n maxContentHeight?: number;\n ref?: Ref<HTMLDivElement>;\n}\n\nconst FeedContent: FC<FeedContentProps & ForwardProps> = forwardRef(\n (\n { children, maxContentHeight = Infinity, ...restProps }: PropsWithoutRef<FeedContentProps>,\n ref: FeedContentProps['ref']\n ) => {\n const { interactionRenderers, markdownMap } = useContext(FeedContext);\n const [collapsed, setCollapsed] = useState(true);\n const [exceedsMaxHeight, setExceedsMaxHeight] = useState(true);\n const rtvRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!rtvRef.current) return;\n\n const observer = new ResizeObserver(entries => {\n const exceedsHeight = entries.some(({ target, contentRect }) => {\n if (target !== rtvRef.current) return;\n\n return contentRect.height > maxContentHeight;\n });\n\n setExceedsMaxHeight(exceedsHeight);\n });\n\n observer.observe(rtvRef.current);\n\n return () => {\n observer.disconnect();\n };\n }, [rtvRef.current, maxContentHeight]);\n\n return useMemo(\n () =>\n typeof children === 'string' ? (\n <Flex ref={ref} container={{ direction: 'column', gap: 1 }}>\n <ExpandCollapse\n collapsed={collapsed}\n min={exceedsMaxHeight ? `${maxContentHeight}px` : 'max-content'}\n {...restProps}\n >\n <RichTextViewer\n ref={rtvRef}\n content={children}\n type='markdown'\n interactionRenderers={interactionRenderers}\n markdownMap={markdownMap}\n />\n </ExpandCollapse>\n {exceedsMaxHeight && (\n <Flex container={{ justify: 'center' }}>\n <Button variant='link' onClick={() => setCollapsed(current => !current)}>\n {collapsed ? 'Show more' : 'Show less'}\n </Button>\n </Flex>\n )}\n </Flex>\n ) : (\n children\n ),\n [\n children,\n collapsed,\n exceedsMaxHeight,\n interactionRenderers,\n markdownMap,\n maxContentHeight,\n ref,\n restProps\n ]\n );\n }\n);\n\nexport default FeedContent;\n"]}
1
+ {"version":3,"file":"FeedContent.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAGL,UAAU,EACV,QAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EAGT,UAAU,EACX,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,IAAI,EAAgB,MAAM,yBAAyB,CAAC;AACrF,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAY7C,MAAM,WAAW,GAAwC,UAAU,CACjE,CACE,EAAE,QAAQ,EAAE,gBAAgB,GAAG,QAAQ,EAAE,GAAG,SAAS,EAAqC,EAC1F,GAA4B,EAC5B,EAAE;IACF,MAAM,EAAE,oBAAoB,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACtE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC/D,MAAM,MAAM,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE5C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM,CAAC,OAAO;YAAE,OAAO;QAE5B,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;YAC5C,MAAM,aAAa,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,EAAE;gBAC7D,IAAI,MAAM,KAAK,MAAM,CAAC,OAAO;oBAAE,OAAO;gBAEtC,OAAO,WAAW,CAAC,MAAM,GAAG,gBAAgB,CAAC;YAC/C,CAAC,CAAC,CAAC;YAEH,mBAAmB,CAAC,aAAa,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QAEjC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAEvC,OAAO,OAAO,CACZ,GAAG,EAAE,CACH,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC7B,MAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACxD,KAAC,cAAc,IACb,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,gBAAgB,CAAC,CAAC,CAAC,GAAG,gBAAgB,IAAI,CAAC,CAAC,CAAC,aAAa,KAC3D,SAAS,YAEb,KAAC,cAAc,IACb,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,QAAQ,EACjB,IAAI,EAAC,UAAU,EACf,oBAAoB,EAAE,oBAAoB,EAC1C,WAAW,EAAE,WAAW,GACxB,GACa,EAChB,gBAAgB,IAAI,CACnB,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YACpC,KAAC,MAAM,IAAC,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,YACpE,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,GAC/B,GACJ,CACR,IACI,CACR,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,EACH;QACE,QAAQ;QACR,SAAS;QACT,gBAAgB;QAChB,oBAAoB;QACpB,WAAW;QACX,gBAAgB;QAChB,GAAG;QACH,SAAS;KACV,CACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import {\n FC,\n Ref,\n forwardRef,\n useState,\n useMemo,\n useRef,\n useEffect,\n PropsWithoutRef,\n ReactElement,\n useContext\n} from 'react';\n\nimport { Button, ExpandCollapse, Flex, ForwardProps } from '@pega/cosmos-react-core';\nimport { RichTextViewer } from '@pega/cosmos-react-rte';\n\nimport { FeedContext } from './Feed.context';\n\nexport interface FeedContentProps {\n children: ReactElement | string;\n /**\n * A maximum height in pixels to display post content within before prompting to expand the post.\n * @default Infinity\n */\n maxContentHeight?: number;\n ref?: Ref<HTMLDivElement>;\n}\n\nconst FeedContent: FC<FeedContentProps & ForwardProps> = forwardRef(\n (\n { children, maxContentHeight = Infinity, ...restProps }: PropsWithoutRef<FeedContentProps>,\n ref: FeedContentProps['ref']\n ) => {\n const { interactionRenderers, markdownMap } = useContext(FeedContext);\n const [collapsed, setCollapsed] = useState(true);\n const [exceedsMaxHeight, setExceedsMaxHeight] = useState(true);\n const rtvRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!rtvRef.current) return;\n\n const observer = new ResizeObserver(entries => {\n const exceedsHeight = entries.some(({ target, contentRect }) => {\n if (target !== rtvRef.current) return;\n\n return contentRect.height > maxContentHeight;\n });\n\n setExceedsMaxHeight(exceedsHeight);\n });\n\n observer.observe(rtvRef.current);\n\n return () => {\n observer.disconnect();\n };\n }, [rtvRef.current, maxContentHeight]);\n\n return useMemo(\n () =>\n typeof children === 'string' ? (\n <Flex ref={ref} container={{ direction: 'column', gap: 1 }}>\n <ExpandCollapse\n collapsed={collapsed}\n min={exceedsMaxHeight ? `${maxContentHeight}px` : 'max-content'}\n {...restProps}\n >\n <RichTextViewer\n ref={rtvRef}\n content={children}\n type='markdown'\n interactionRenderers={interactionRenderers}\n markdownMap={markdownMap}\n />\n </ExpandCollapse>\n {exceedsMaxHeight && (\n <Flex container={{ justify: 'center' }}>\n <Button variant='link' onClick={() => setCollapsed(current => !current)}>\n {collapsed ? 'Show more' : 'Show less'}\n </Button>\n </Flex>\n )}\n </Flex>\n ) : (\n children\n ),\n [\n children,\n collapsed,\n exceedsMaxHeight,\n interactionRenderers,\n markdownMap,\n maxContentHeight,\n ref,\n restProps\n ]\n );\n }\n);\n\nexport default FeedContent;\n"]}
@@ -61,8 +61,8 @@ export const FeedLikeButton = forwardRef((props, ref) => {
61
61
  const user = {
62
62
  id: loggedInUser.username,
63
63
  primary: loggedInUser.fullname,
64
- secondary: loggedInUser.meta ? _jsx(MetaList, { items: loggedInUser.meta }, void 0) : undefined,
65
- visual: (_jsx(Avatar, { size: 'l', imageSrc: loggedInUser.avatarSrc, name: loggedInUser.fullname }, void 0))
64
+ secondary: loggedInUser.meta ? _jsx(MetaList, { items: loggedInUser.meta }) : undefined,
65
+ visual: (_jsx(Avatar, { size: 'l', imageSrc: loggedInUser.avatarSrc, name: loggedInUser.fullname }))
66
66
  };
67
67
  let eventObj;
68
68
  if (props.variant === 'post') {
@@ -79,11 +79,11 @@ export const FeedLikeButton = forwardRef((props, ref) => {
79
79
  };
80
80
  props.onLikeClick(eventObj);
81
81
  }
82
- }, emphasized: liked, ref: ref, children: [_jsx(Icon, { name: liked ? 'thumbs-up-solid' : 'thumbs-up' }, void 0), showText && _jsx(Text, { children: likeLabel }, void 0), likeCount > 0 && (_jsxs(_Fragment, { children: [_jsx(InlineBareButton, { ref: setCountEl, role: likes.length ? 'button' : undefined, onClick: onLikeCountClick, onFocus: onLikeCountInteraction, onMouseOver: onLikeCountInteraction, "aria-label": likesAttributes.ariaLabel, tabIndex: 0, onKeyDown: (e) => {
82
+ }, emphasized: liked, ref: ref, children: [_jsx(Icon, { name: liked ? 'thumbs-up-solid' : 'thumbs-up' }), showText && _jsx(Text, { children: likeLabel }), likeCount > 0 && (_jsxs(_Fragment, { children: [_jsx(InlineBareButton, { ref: setCountEl, role: likes.length ? 'button' : undefined, onClick: onLikeCountClick, onFocus: onLikeCountInteraction, onMouseOver: onLikeCountInteraction, "aria-label": likesAttributes.ariaLabel, tabIndex: 0, onKeyDown: (e) => {
83
83
  if (e.key === 'Enter') {
84
84
  e.preventDefault();
85
85
  onLikeCountClick();
86
86
  }
87
- }, children: _jsx(Count, { children: likeCount }, void 0) }, void 0), _jsx(Tooltip, { target: countEl, showDelay: 'none', hideDelay: 'none', children: likesAttributes.label || t('feed_post_likes', [likeCount], { count: likeCount }) }, void 0)] }, void 0))] }, void 0));
87
+ }, children: _jsx(Count, { children: likeCount }) }), _jsx(Tooltip, { target: countEl, showDelay: 'none', hideDelay: 'none', children: likesAttributes.label || t('feed_post_likes', [likeCount], { count: likeCount }) })] }))] }));
88
88
  });
89
89
  //# sourceMappingURL=FeedLikeButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FeedLikeButton.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedLikeButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, forwardRef, Ref, useContext, useMemo, useRef, useEffect, KeyboardEvent } from 'react';\nimport styled from 'styled-components';\n\nimport {\n ForwardProps,\n OmitStrict,\n Button,\n Icon,\n Text,\n Avatar,\n MetaList,\n Count,\n Tooltip,\n ModalManagerContext,\n ModalMethods,\n useI18n,\n useConfiguration,\n useElement,\n formatListToLocaleString\n} from '@pega/cosmos-react-core';\nimport BareRoleButton from '@pega/cosmos-react-core/lib/components/Button/BareRoleButton';\n\nimport { FeedPostProps } from './FeedPost.types';\nimport { FeedContext } from './Feed.context';\nimport FeedButton from './FeedButton';\nimport FeedModalList, { FeedModalListProps } from './FeedModalList';\nimport { FeedReplyProps } from './FeedReply.types';\n\nconst InlineBareButton = styled(BareRoleButton)`\n display: inline-block;\n`;\n\ninterface BaseFeedLikeButtonProps\n extends OmitStrict<FeedPostProps['interactionInfo'], 'commentLabel' | 'interactionsEnabled'>,\n Pick<FeedPostProps, 'onLoadMoreLikes' | 'onLikeCountInteraction' | 'id' | 'likesLoading'>,\n Pick<FeedPostProps['info'], 'liked'> {\n showText?: boolean;\n}\n\ninterface PostFeedLikeButtonProps extends BaseFeedLikeButtonProps {\n variant: 'post';\n onLikeClick: FeedPostProps['onLikeClick'];\n}\n\ninterface ReplyFeedLikeButtonProps extends BaseFeedLikeButtonProps {\n variant: 'reply';\n onLikeClick: FeedReplyProps['onLikeClick'];\n}\n\nexport type FeedLikeButtonProps = PostFeedLikeButtonProps | ReplyFeedLikeButtonProps;\n\nexport const FeedLikeButton: FC<FeedLikeButtonProps & ForwardProps> = forwardRef(\n (props, ref: Ref<HTMLButtonElement>) => {\n const {\n id,\n showText,\n onLikeCountInteraction,\n likesLoading,\n onLoadMoreLikes,\n liked,\n likeLabel,\n likeCount = 0,\n likes = []\n } = props;\n const t = useI18n();\n const { locale } = useConfiguration();\n const { create } = useContext(ModalManagerContext);\n const { announce, userInfo: loggedInUser } = useContext(FeedContext);\n const [countEl, setCountEl] = useElement(null);\n const likesModalRef = useRef<ModalMethods<FeedModalListProps>>();\n\n useEffect(() => {\n likesModalRef.current?.update({\n count: likeCount,\n heading: likeLabel,\n listItems: likes,\n onLoadMore: onLoadMoreLikes,\n loading: likesLoading\n });\n }, [likeCount, likeLabel, likes, onLoadMoreLikes, likesLoading]);\n\n const likesAttributes = useMemo(() => {\n const likesList = likes.map(x => x.primary.toString());\n return {\n ariaLabel: likeCount\n ? `${t('feed_liked_by')} ${formatListToLocaleString(likesList, t, locale, {\n count: likeCount\n })}`\n : t('feed_post_likes', [likeCount], { count: likeCount }),\n label: formatListToLocaleString(likesList, t, locale, {\n count: likeCount,\n separator: '\\n'\n })\n };\n }, [likes, likeCount]);\n\n const onLikeCountClick = () => {\n if (likes.length && likeCount > 10) {\n likesModalRef.current = create(FeedModalList, {\n count: likeCount,\n heading: t('feed_likes'),\n listItems: likes,\n onLoadMore: onLoadMoreLikes,\n loading: likesLoading\n });\n } else {\n onLikeCountInteraction?.();\n }\n };\n\n useEffect(() => {\n announce(t(`feed_post_${liked ? 'liked' : 'deliked'}`));\n }, [liked]);\n\n return (\n <Button\n variant='text'\n as={FeedButton}\n onClick={() => {\n const user = {\n id: loggedInUser.username,\n primary: loggedInUser.fullname,\n secondary: loggedInUser.meta ? <MetaList items={loggedInUser.meta} /> : undefined,\n visual: (\n <Avatar size='l' imageSrc={loggedInUser.avatarSrc} name={loggedInUser.fullname} />\n )\n };\n let eventObj;\n if (props.variant === 'post') {\n eventObj = {\n postId: id,\n user\n } as const;\n props.onLikeClick(eventObj);\n } else {\n eventObj = {\n replyId: id,\n user\n } as const;\n props.onLikeClick(eventObj);\n }\n }}\n emphasized={liked}\n ref={ref}\n >\n <Icon name={liked ? 'thumbs-up-solid' : 'thumbs-up'} />\n {showText && <Text>{likeLabel}</Text>}\n {likeCount > 0 && (\n <>\n <InlineBareButton\n ref={setCountEl}\n role={likes.length ? 'button' : undefined}\n onClick={onLikeCountClick}\n onFocus={onLikeCountInteraction}\n onMouseOver={onLikeCountInteraction}\n aria-label={likesAttributes.ariaLabel}\n tabIndex={0}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n onLikeCountClick();\n }\n }}\n >\n <Count>{likeCount}</Count>\n </InlineBareButton>\n <Tooltip target={countEl} showDelay='none' hideDelay='none'>\n {likesAttributes.label || t('feed_post_likes', [likeCount], { count: likeCount })}\n </Tooltip>\n </>\n )}\n </Button>\n );\n }\n);\n"]}
1
+ {"version":3,"file":"FeedLikeButton.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedLikeButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, forwardRef, Ref, useContext, useMemo, useRef, useEffect, KeyboardEvent } from 'react';\nimport styled from 'styled-components';\n\nimport {\n ForwardProps,\n OmitStrict,\n Button,\n Icon,\n Text,\n Avatar,\n MetaList,\n Count,\n Tooltip,\n ModalManagerContext,\n ModalMethods,\n useI18n,\n useConfiguration,\n useElement,\n formatListToLocaleString\n} from '@pega/cosmos-react-core';\nimport BareRoleButton from '@pega/cosmos-react-core/lib/components/Button/BareRoleButton';\n\nimport { FeedPostProps } from './FeedPost.types';\nimport { FeedContext } from './Feed.context';\nimport FeedButton from './FeedButton';\nimport FeedModalList, { FeedModalListProps } from './FeedModalList';\nimport { FeedReplyProps } from './FeedReply.types';\n\nconst InlineBareButton = styled(BareRoleButton)`\n display: inline-block;\n`;\n\ninterface BaseFeedLikeButtonProps\n extends OmitStrict<FeedPostProps['interactionInfo'], 'commentLabel' | 'interactionsEnabled'>,\n Pick<FeedPostProps, 'onLoadMoreLikes' | 'onLikeCountInteraction' | 'id' | 'likesLoading'>,\n Pick<FeedPostProps['info'], 'liked'> {\n showText?: boolean;\n}\n\ninterface PostFeedLikeButtonProps extends BaseFeedLikeButtonProps {\n variant: 'post';\n onLikeClick: FeedPostProps['onLikeClick'];\n}\n\ninterface ReplyFeedLikeButtonProps extends BaseFeedLikeButtonProps {\n variant: 'reply';\n onLikeClick: FeedReplyProps['onLikeClick'];\n}\n\nexport type FeedLikeButtonProps = PostFeedLikeButtonProps | ReplyFeedLikeButtonProps;\n\nexport const FeedLikeButton: FC<FeedLikeButtonProps & ForwardProps> = forwardRef(\n (props, ref: Ref<HTMLButtonElement>) => {\n const {\n id,\n showText,\n onLikeCountInteraction,\n likesLoading,\n onLoadMoreLikes,\n liked,\n likeLabel,\n likeCount = 0,\n likes = []\n } = props;\n const t = useI18n();\n const { locale } = useConfiguration();\n const { create } = useContext(ModalManagerContext);\n const { announce, userInfo: loggedInUser } = useContext(FeedContext);\n const [countEl, setCountEl] = useElement(null);\n const likesModalRef = useRef<ModalMethods<FeedModalListProps>>();\n\n useEffect(() => {\n likesModalRef.current?.update({\n count: likeCount,\n heading: likeLabel,\n listItems: likes,\n onLoadMore: onLoadMoreLikes,\n loading: likesLoading\n });\n }, [likeCount, likeLabel, likes, onLoadMoreLikes, likesLoading]);\n\n const likesAttributes = useMemo(() => {\n const likesList = likes.map(x => x.primary.toString());\n return {\n ariaLabel: likeCount\n ? `${t('feed_liked_by')} ${formatListToLocaleString(likesList, t, locale, {\n count: likeCount\n })}`\n : t('feed_post_likes', [likeCount], { count: likeCount }),\n label: formatListToLocaleString(likesList, t, locale, {\n count: likeCount,\n separator: '\\n'\n })\n };\n }, [likes, likeCount]);\n\n const onLikeCountClick = () => {\n if (likes.length && likeCount > 10) {\n likesModalRef.current = create(FeedModalList, {\n count: likeCount,\n heading: t('feed_likes'),\n listItems: likes,\n onLoadMore: onLoadMoreLikes,\n loading: likesLoading\n });\n } else {\n onLikeCountInteraction?.();\n }\n };\n\n useEffect(() => {\n announce(t(`feed_post_${liked ? 'liked' : 'deliked'}`));\n }, [liked]);\n\n return (\n <Button\n variant='text'\n as={FeedButton}\n onClick={() => {\n const user = {\n id: loggedInUser.username,\n primary: loggedInUser.fullname,\n secondary: loggedInUser.meta ? <MetaList items={loggedInUser.meta} /> : undefined,\n visual: (\n <Avatar size='l' imageSrc={loggedInUser.avatarSrc} name={loggedInUser.fullname} />\n )\n };\n let eventObj;\n if (props.variant === 'post') {\n eventObj = {\n postId: id,\n user\n } as const;\n props.onLikeClick(eventObj);\n } else {\n eventObj = {\n replyId: id,\n user\n } as const;\n props.onLikeClick(eventObj);\n }\n }}\n emphasized={liked}\n ref={ref}\n >\n <Icon name={liked ? 'thumbs-up-solid' : 'thumbs-up'} />\n {showText && <Text>{likeLabel}</Text>}\n {likeCount > 0 && (\n <>\n <InlineBareButton\n ref={setCountEl}\n role={likes.length ? 'button' : undefined}\n onClick={onLikeCountClick}\n onFocus={onLikeCountInteraction}\n onMouseOver={onLikeCountInteraction}\n aria-label={likesAttributes.ariaLabel}\n tabIndex={0}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n onLikeCountClick();\n }\n }}\n >\n <Count>{likeCount}</Count>\n </InlineBareButton>\n <Tooltip target={countEl} showDelay='none' hideDelay='none'>\n {likesAttributes.label || t('feed_post_likes', [likeCount], { count: likeCount })}\n </Tooltip>\n </>\n )}\n </Button>\n );\n }\n);\n"]}
@@ -30,7 +30,7 @@ const FeedModalList = ({ loading, count, heading, listItems, onLoadMore }) => {
30
30
  useItemIntersection(listRef, listItems.length - 1, () => {
31
31
  onLoadMore?.();
32
32
  }, ':scope li');
33
- return (_jsxs(Modal, { heading: _jsxs(Flex, { container: { gap: 1 }, children: [heading, _jsx(Flex, { item: { alignSelf: 'center' }, as: Count, children: count }, void 0)] }, void 0), ref: listRef, children: [_jsx(FeedAnnouncer, { children: announcementText }, void 0), _jsx(SummaryListItems, { items: listItems }, void 0), loading && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }, void 0) }, void 0))] }, void 0));
33
+ return (_jsxs(Modal, { heading: _jsxs(Flex, { container: { gap: 1 }, children: [heading, _jsx(Flex, { item: { alignSelf: 'center' }, as: Count, children: count })] }), ref: listRef, children: [_jsx(FeedAnnouncer, { children: announcementText }), _jsx(SummaryListItems, { items: listItems }), loading && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }) }))] }));
34
34
  };
35
35
  export default FeedModalList;
36
36
  //# sourceMappingURL=FeedModalList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FeedModalList.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedModalList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAEL,gBAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,gBAAgB,EAChB,mBAAmB,EACnB,WAAW,EACX,OAAO,EACR,MAAM,yBAAyB,CAAC;AAEjC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAe5C,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9C,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAGjC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,aAAa,GAA2B,CAAC,EAC7C,OAAO,EACP,KAAK,EACL,OAAO,EACP,SAAS,EACT,UAAU,EACS,EAAE,EAAE;IACvB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC7B,MAAM,SAAS,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IACzC,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAE7D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO;YAAE,mBAAmB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE;YACb,MAAM,UAAU,GAAG,SAAS,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,CAAC;YACxD,IAAI,UAAU,GAAG,CAAC;gBAChB,mBAAmB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC,UAAU,CAAC,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC;SACjF;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,mBAAmB,CACjB,OAAO,EACP,SAAS,CAAC,MAAM,GAAG,CAAC,EACpB,GAAG,EAAE;QACH,UAAU,EAAE,EAAE,CAAC;IACjB,CAAC,EACD,WAAW,CACZ,CAAC;IAEF,OAAO,CACL,MAAC,KAAK,IACJ,OAAO,EACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,aACxB,OAAO,EACR,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,YAC3C,KAAK,WACD,YACF,EAET,GAAG,EAAE,OAAO,aAEZ,KAAC,aAAa,cAAE,gBAAgB,WAAiB,EACjD,KAAC,gBAAgB,IAAC,KAAK,EAAE,SAAS,WAAI,EACrC,OAAO,IAAI,CACV,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,YACxD,KAAC,QAAQ,IAAC,SAAS,EAAC,QAAQ,WAAG,WAC1B,CACR,YACK,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { FC, useRef, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryListItem,\n defaultThemeProp,\n Flex,\n Progress,\n Count,\n Modal,\n SummaryListItems,\n useItemIntersection,\n usePrevious,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport FeedAnnouncer from './FeedAnnouncer';\n\nexport interface FeedModalListProps {\n /** The count for the list of items. */\n count: number;\n /** The heading for the Modal. */\n heading: string;\n /** The list of MenuItems to render in the Modal. */\n listItems: SummaryListItem[];\n /** A callback that is triggered when the bottom of the Modal list is scrolled into view so that additional data may be displayed. */\n onLoadMore?: () => void;\n /** Indicates if the data is being currently loading */\n loading?: boolean;\n}\n\nconst StyledLoadMore = styled.div(({ theme }) => {\n return css`\n margin-top: ${theme.base.spacing};\n min-height: 2rem;\n min-width: 2rem;\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst FeedModalList: FC<FeedModalListProps> = ({\n loading,\n count,\n heading,\n listItems,\n onLoadMore\n}: FeedModalListProps) => {\n const t = useI18n();\n const listRef = useRef(null);\n const prevItems = usePrevious(listItems);\n const [announcementText, setAnnouncementText] = useState('');\n\n useEffect(() => {\n if (loading) setAnnouncementText(t('loading'));\n }, [loading]);\n\n useEffect(() => {\n if (prevItems) {\n const difference = listItems.length - prevItems?.length;\n if (difference > 0)\n setAnnouncementText(t('new_item_added', [difference], { count: difference }));\n }\n }, [listItems]);\n\n useItemIntersection(\n listRef,\n listItems.length - 1,\n () => {\n onLoadMore?.();\n },\n ':scope li'\n );\n\n return (\n <Modal\n heading={\n <Flex container={{ gap: 1 }}>\n {heading}\n <Flex item={{ alignSelf: 'center' }} as={Count}>\n {count}\n </Flex>\n </Flex>\n }\n ref={listRef}\n >\n <FeedAnnouncer>{announcementText}</FeedAnnouncer>\n <SummaryListItems items={listItems} />\n {loading && (\n <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n <Progress placement='inline' />\n </Flex>\n )}\n </Modal>\n );\n};\n\nexport default FeedModalList;\n"]}
1
+ {"version":3,"file":"FeedModalList.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedModalList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAEL,gBAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,gBAAgB,EAChB,mBAAmB,EACnB,WAAW,EACX,OAAO,EACR,MAAM,yBAAyB,CAAC;AAEjC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAe5C,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9C,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAGjC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,aAAa,GAA2B,CAAC,EAC7C,OAAO,EACP,KAAK,EACL,OAAO,EACP,SAAS,EACT,UAAU,EACS,EAAE,EAAE;IACvB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC7B,MAAM,SAAS,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;IACzC,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAE7D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO;YAAE,mBAAmB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE;YACb,MAAM,UAAU,GAAG,SAAS,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,CAAC;YACxD,IAAI,UAAU,GAAG,CAAC;gBAChB,mBAAmB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC,UAAU,CAAC,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC;SACjF;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,mBAAmB,CACjB,OAAO,EACP,SAAS,CAAC,MAAM,GAAG,CAAC,EACpB,GAAG,EAAE;QACH,UAAU,EAAE,EAAE,CAAC;IACjB,CAAC,EACD,WAAW,CACZ,CAAC;IAEF,OAAO,CACL,MAAC,KAAK,IACJ,OAAO,EACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,aACxB,OAAO,EACR,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,YAC3C,KAAK,GACD,IACF,EAET,GAAG,EAAE,OAAO,aAEZ,KAAC,aAAa,cAAE,gBAAgB,GAAiB,EACjD,KAAC,gBAAgB,IAAC,KAAK,EAAE,SAAS,GAAI,EACrC,OAAO,IAAI,CACV,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,YACxD,KAAC,QAAQ,IAAC,SAAS,EAAC,QAAQ,GAAG,GAC1B,CACR,IACK,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { FC, useRef, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryListItem,\n defaultThemeProp,\n Flex,\n Progress,\n Count,\n Modal,\n SummaryListItems,\n useItemIntersection,\n usePrevious,\n useI18n\n} from '@pega/cosmos-react-core';\n\nimport FeedAnnouncer from './FeedAnnouncer';\n\nexport interface FeedModalListProps {\n /** The count for the list of items. */\n count: number;\n /** The heading for the Modal. */\n heading: string;\n /** The list of MenuItems to render in the Modal. */\n listItems: SummaryListItem[];\n /** A callback that is triggered when the bottom of the Modal list is scrolled into view so that additional data may be displayed. */\n onLoadMore?: () => void;\n /** Indicates if the data is being currently loading */\n loading?: boolean;\n}\n\nconst StyledLoadMore = styled.div(({ theme }) => {\n return css`\n margin-top: ${theme.base.spacing};\n min-height: 2rem;\n min-width: 2rem;\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst FeedModalList: FC<FeedModalListProps> = ({\n loading,\n count,\n heading,\n listItems,\n onLoadMore\n}: FeedModalListProps) => {\n const t = useI18n();\n const listRef = useRef(null);\n const prevItems = usePrevious(listItems);\n const [announcementText, setAnnouncementText] = useState('');\n\n useEffect(() => {\n if (loading) setAnnouncementText(t('loading'));\n }, [loading]);\n\n useEffect(() => {\n if (prevItems) {\n const difference = listItems.length - prevItems?.length;\n if (difference > 0)\n setAnnouncementText(t('new_item_added', [difference], { count: difference }));\n }\n }, [listItems]);\n\n useItemIntersection(\n listRef,\n listItems.length - 1,\n () => {\n onLoadMore?.();\n },\n ':scope li'\n );\n\n return (\n <Modal\n heading={\n <Flex container={{ gap: 1 }}>\n {heading}\n <Flex item={{ alignSelf: 'center' }} as={Count}>\n {count}\n </Flex>\n </Flex>\n }\n ref={listRef}\n >\n <FeedAnnouncer>{announcementText}</FeedAnnouncer>\n <SummaryListItems items={listItems} />\n {loading && (\n <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n <Progress placement='inline' />\n </Flex>\n )}\n </Modal>\n );\n};\n\nexport default FeedModalList;\n"]}
@@ -87,14 +87,14 @@ const FeedNewPost = (props) => {
87
87
  setSelectedRecipients([]);
88
88
  }
89
89
  }, [postType]);
90
- return (_jsx(StyledCard, { ref: setNewPostEl, as: StyledFeedNewPost, ...restProps, children: _jsxs(CardContent, { children: [onRecipientSearch && (_jsx(FeedNewPostTypeMenu, { recipients: recipients || [], onSetPostType: setPostType, onSelectedRecipientsUpdate: setSelectedRecipients, onRecipientSearch: onRecipientSearch, reset: resetPostTypeMenu, onReset: () => setResetPostTypeMenu(false) }, void 0)), _jsxs(Flex, { container: { alignItems: 'start', gap: 1 }, children: [_jsx(Avatar, { name: fullname, size: 'l', imageSrc: avatarSrc }, void 0), _jsx(StyledTextAreaContainer, { children: _jsx(FeedRichText, { label: t('feed_new_post'), labelHidden: true, onChange: () => {
90
+ return (_jsx(StyledCard, { ref: setNewPostEl, as: StyledFeedNewPost, ...restProps, children: _jsxs(CardContent, { children: [onRecipientSearch && (_jsx(FeedNewPostTypeMenu, { recipients: recipients || [], onSetPostType: setPostType, onSelectedRecipientsUpdate: setSelectedRecipients, onRecipientSearch: onRecipientSearch, reset: resetPostTypeMenu, onReset: () => setResetPostTypeMenu(false) })), _jsxs(Flex, { container: { alignItems: 'start', gap: 1 }, children: [_jsx(Avatar, { name: fullname, size: 'l', imageSrc: avatarSrc }), _jsx(StyledTextAreaContainer, { children: _jsx(FeedRichText, { label: t('feed_new_post'), labelHidden: true, onChange: () => {
91
91
  setEmptyText(rteRef.current?.getPlainText().trim() === '');
92
- }, placeholder: textAreaPlaceholder, autoFocus: autoFocus, onSubmit: handlePost, onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false), ref: rteRef }, void 0) }, void 0), !emptyText && (_jsx(Button, { variant: 'simple', as: FeedButton, onClick: handleClear, icon: true, label: t('feed_cancel_conversation'), tabIndex: -1, children: _jsx(Icon, { name: 'times' }, void 0) }, void 0)), onFilesAdded && (_jsx(Button, { variant: 'simple', as: FeedButton, onClick: () => {
92
+ }, placeholder: textAreaPlaceholder, autoFocus: autoFocus, onSubmit: handlePost, onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false), ref: rteRef }) }), !emptyText && (_jsx(Button, { variant: 'simple', as: FeedButton, onClick: handleClear, icon: true, label: t('feed_cancel_conversation'), tabIndex: -1, children: _jsx(Icon, { name: 'times' }) })), onFilesAdded && (_jsx(Button, { variant: 'simple', as: FeedButton, onClick: () => {
93
93
  setShowSearchResults?.(false);
94
94
  attachmentEl?.click();
95
95
  }, icon: true, label: attachments.length
96
96
  ? cap(t('attachments_count', [], { count: 1 }))
97
- : t('file_upload_text_multiple'), children: _jsx(Icon, { name: 'paper-clip' }, void 0) }, void 0))] }, void 0), _jsx(HiddenFileInput, { ref: setAttachmentEl, type: 'file', multiple: true, onChange: () => {
97
+ : t('file_upload_text_multiple'), children: _jsx(Icon, { name: 'paper-clip' }) }))] }), _jsx(HiddenFileInput, { ref: setAttachmentEl, type: 'file', multiple: true, onChange: () => {
98
98
  if (attachmentEl?.files) {
99
99
  onFilesAdded?.(Array.from(attachmentEl?.files));
100
100
  }
@@ -102,7 +102,7 @@ const FeedNewPost = (props) => {
102
102
  // Must trick input to believe there is no value when activated so that the same file may be added consecutively.
103
103
  onClick: (event) => {
104
104
  event.target.value = '';
105
- } }, void 0), _jsx(FeedAttachments, { attachments: attachments }, void 0), _jsx(ExpandCollapse, { collapsed: !hasFocus && emptyText && !attachments.length, children: _jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { variant: 'primary', disabled: (emptyText && attachments.length === 0) || attachments.some(x => x.error), onClick: handlePost, children: postLabel }, void 0) }, void 0) }, void 0)] }, void 0) }, void 0));
105
+ } }), _jsx(FeedAttachments, { attachments: attachments }), _jsx(ExpandCollapse, { collapsed: !hasFocus && emptyText && !attachments.length, children: _jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { variant: 'primary', disabled: (emptyText && attachments.length === 0) || attachments.some(x => x.error), onClick: handlePost, children: postLabel }) }) })] }) }));
106
106
  };
107
107
  export default FeedNewPost;
108
108
  //# sourceMappingURL=FeedNewPost.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FeedNewPost.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedNewPost.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAkB,MAAM,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACrE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,MAAM,EACN,MAAM,EACN,WAAW,EACX,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,UAAU,EACV,aAAa,EACb,gBAAgB,EAChB,UAAU,EACV,aAAa,EAEb,OAAO,EACP,cAAc,EACd,qBAAqB,EACrB,GAAG,EACJ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAuB,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACnF,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAC1F,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AAEnG,OAAO,mBAIN,MAAM,uBAAuB,CAAC;AAC/B,OAAO,eAAkC,MAAM,mBAAmB,CAAC;AACnE,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,YAAY,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;AA8BvC,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;IACrD,OAAO,GAAG,CAAA;;;;;MAKN,oBAAoB;;;;;GAKvB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;MACN,UAAU,QAAQ,aAAa,IAAI,UAAU;;;;MAI7C,UAAU;+BACe,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE9C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,eAAe,GAAG,MAAM,CAAC,KAAK,CAAA;;CAEnC,CAAC;AAEF,MAAM,WAAW,GAAwC,CAAC,KAAuB,EAAE,EAAE;IACnF,MAAM,EACJ,EAAE,EACF,WAAW,GAAG,EAAE,EAChB,eAAe,EACf,MAAM,EACN,YAAY,EACZ,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,MAAM,GAAG,MAAM,EAAuB,CAAC;IAC7C,MAAM,EAAE,mBAAmB,EAAE,SAAS,EAAE,GAAG,eAAe,CAAC;IAC3D,MAAM,EAAE,oBAAoB,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACzD,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC;IAC3E,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;IACpD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAW,MAAM,CAAC,CAAC;IAC3D,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAsB,EAAE,CAAC,CAAC;IACtF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,UAAU,EAAoB,CAAC;IACvE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAkB,CAAC;IAE/D,aAAa,CAAC,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,GAAG,EAAE;QAC3C,IAAI,SAAS;YAAE,MAAM,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IACzC,CAAC,CAAC,CAAC;IAEH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,oBAAoB,EAAE,CAAC,KAAK,CAAC,CAAC;QAC9B,IAAI,CAAC,CAAC,SAAS,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE;YAC9E,MAAM,CAAC;gBACL,SAAS,EAAE,EAAE;gBACb,KAAK,EAAE,MAAM,CAAC,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE;gBAC3C,WAAW,EAAE,WAAW,IAAI,EAAE;gBAC9B,UAAU,EAAE,kBAAkB;gBAC9B,QAAQ;gBACR,KAAK,EAAE,GAAG,EAAE;oBACV,MAAM,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;oBACxB,oBAAoB,CAAC,IAAI,CAAC,CAAC;gBAC7B,CAAC;aACF,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,oBAAoB,EAAE,CAAC,KAAK,CAAC,CAAC;QAC9B,MAAM,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACxB,MAAM,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC1B,CAAC,CAAC;IAEF,qBAAqB,CAAC,GAAG,EAAE;QACzB,IAAI,QAAQ,KAAK,MAAM,EAAE;YACvB,MAAM,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;SACzB;QACD,IAAI,QAAQ,KAAK,SAAS,EAAE;YAC1B,qBAAqB,CAAC,EAAyB,CAAC,CAAC;SAClD;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,CACL,KAAC,UAAU,IAAC,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE,iBAAiB,KAAM,SAAS,YACjE,MAAC,WAAW,eACT,iBAAiB,IAAI,CACpB,KAAC,mBAAmB,IAClB,UAAU,EAAE,UAAU,IAAK,EAAsC,EACjE,aAAa,EAAE,WAAW,EAC1B,0BAA0B,EAAE,qBAAqB,EACjD,iBAAiB,EAAE,iBAAiB,EACpC,KAAK,EAAE,iBAAiB,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,oBAAoB,CAAC,KAAK,CAAC,WAC1C,CACH,EAED,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,KAAC,MAAM,IAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAC,GAAG,EAAC,QAAQ,EAAE,SAAS,WAAI,EAExD,KAAC,uBAAuB,cACtB,KAAC,YAAY,IACX,KAAK,EAAE,CAAC,CAAC,eAAe,CAAC,EACzB,WAAW,QACX,QAAQ,EAAE,GAAG,EAAE;oCACb,YAAY,CAAC,MAAM,CAAC,OAAO,EAAE,YAAY,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC;gCAC7D,CAAC,EACD,WAAW,EAAE,mBAAmB,EAChC,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EAChC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EAChC,GAAG,EAAE,MAAM,WACX,WACsB,EAEzB,CAAC,SAAS,IAAI,CACb,KAAC,MAAM,IACL,OAAO,EAAC,QAAQ,EAChB,EAAE,EAAE,UAAU,EACd,OAAO,EAAE,WAAW,EACpB,IAAI,QACJ,KAAK,EAAE,CAAC,CAAC,0BAA0B,CAAC,EACpC,QAAQ,EAAE,CAAC,CAAC,YAEZ,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,WAAG,WACd,CACV,EAEA,YAAY,IAAI,CACf,KAAC,MAAM,IACL,OAAO,EAAC,QAAQ,EAChB,EAAE,EAAE,UAAU,EACd,OAAO,EAAE,GAAG,EAAE;gCACZ,oBAAoB,EAAE,CAAC,KAAK,CAAC,CAAC;gCAC9B,YAAY,EAAE,KAAK,EAAE,CAAC;4BACxB,CAAC,EACD,IAAI,QACJ,KAAK,EACH,WAAW,CAAC,MAAM;gCAChB,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,mBAAmB,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;gCAC/C,CAAC,CAAC,CAAC,CAAC,2BAA2B,CAAC,YAGpC,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,WAAG,WACnB,CACV,YACI,EAEP,KAAC,eAAe,IACd,GAAG,EAAE,eAAe,EACpB,IAAI,EAAC,MAAM,EACX,QAAQ,QACR,QAAQ,EAAE,GAAG,EAAE;wBACb,IAAI,YAAY,EAAE,KAAK,EAAE;4BACvB,YAAY,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC,CAAC;yBACjD;oBACH,CAAC;oBACD,iHAAiH;oBACjH,OAAO,EAAE,CAAC,KAAiB,EAAE,EAAE;wBAC5B,KAAK,CAAC,MAA2B,CAAC,KAAK,GAAG,EAAE,CAAC;oBAChD,CAAC,WACD,EAEF,KAAC,eAAe,IAAC,WAAW,EAAE,WAAW,WAAI,EAE7C,KAAC,cAAc,IAAC,SAAS,EAAE,CAAC,QAAQ,IAAI,SAAS,IAAI,CAAC,WAAW,CAAC,MAAM,YACtE,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,YACjC,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,QAAQ,EAAE,CAAC,SAAS,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,CAAC,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,EACnF,OAAO,EAAE,UAAU,YAElB,SAAS,WACH,WACJ,WACQ,YACL,WACH,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { useState, FC, MouseEvent, useRef, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n Button,\n CardContent,\n Flex,\n Icon,\n registerIcon,\n StyledIcon,\n StyledCard,\n StyledPopover,\n defaultThemeProp,\n useElement,\n useOuterEvent,\n ForwardProps,\n useI18n,\n ExpandCollapse,\n useAfterInitialEffect,\n cap\n} from '@pega/cosmos-react-core';\nimport { RichTextEditorState, StyledRichTextEditor } from '@pega/cosmos-react-rte';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\n\nimport FeedNewPostTypeMenu, {\n PostType,\n PostTypeMenuProps,\n RecipientMenuItem\n} from './FeedNewPostTypeMenu';\nimport FeedAttachments, { AttachedFiles } from './FeedAttachments';\nimport FeedButton from './FeedButton';\nimport FeedRichText from './FeedRichText';\nimport { FeedContext } from './Feed.context';\n\nregisterIcon(timesIcon, paperClipIcon);\n\nexport interface FeedNewPostProps {\n /** A unique ID for the NewPost */\n id: string;\n /** A set of attachment files. */\n attachments?: AttachedFiles[];\n /** Information that is used to label buttons and inputs for accessibility purposes */\n interactionInfo: {\n textAreaPlaceholder: string;\n postLabel: string;\n };\n /** A callback containing a list of added files that will run whenever files are added to the post. */\n onFilesAdded?: (files: AttachedFiles[]) => void;\n /** A callback that will run when the new post button has been clicked */\n onPost: (event: {\n newPostId: string;\n value: string;\n attachments: AttachedFiles[];\n recipients: RecipientMenuItem[];\n username: string;\n clear: () => void;\n }) => void;\n autoFocus?: boolean;\n /** Array of private recipient options */\n recipients?: PostTypeMenuProps['recipients'];\n /** Handler for new search on private recipient options */\n onRecipientSearch?: (newSearch: string) => void;\n}\n\nexport const StyledTextAreaContainer = styled.div(() => {\n return css`\n margin-top: 0.625rem;\n min-height: 1rem;\n width: 100%;\n\n ${StyledRichTextEditor} {\n &:focus-within {\n box-shadow: none;\n }\n }\n `;\n});\n\nStyledTextAreaContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFeedNewPost = styled.div(({ theme }) => {\n return css`\n ${StyledIcon}:not(${StyledPopover} ${StyledIcon}) {\n font-size: 1.25rem;\n }\n\n ${FeedButton} {\n margin-top: calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledFeedNewPost.defaultProps = defaultThemeProp;\n\nconst HiddenFileInput = styled.input`\n display: none;\n`;\n\nconst FeedNewPost: FC<ForwardProps & FeedNewPostProps> = (props: FeedNewPostProps) => {\n const {\n id,\n attachments = [],\n interactionInfo,\n onPost,\n onFilesAdded,\n autoFocus,\n recipients,\n onRecipientSearch,\n ...restProps\n } = props;\n const rteRef = useRef<RichTextEditorState>();\n const { textAreaPlaceholder, postLabel } = interactionInfo;\n const { setShowSearchResults } = useContext(FeedContext);\n const { avatarSrc, fullname, username } = useContext(FeedContext).userInfo;\n const [emptyText, setEmptyText] = useState(true);\n const [hasFocus, setHasFocus] = useState(autoFocus);\n const [postType, setPostType] = useState<PostType>('post');\n const [resetPostTypeMenu, setResetPostTypeMenu] = useState(false);\n const [selectedRecipients, setSelectedRecipients] = useState<RecipientMenuItem[]>([]);\n const [attachmentEl, setAttachmentEl] = useElement<HTMLInputElement>();\n const [newPostEl, setNewPostEl] = useElement<HTMLDivElement>();\n\n useOuterEvent('mousedown', [newPostEl], () => {\n if (emptyText) rteRef.current?.clear();\n });\n\n const t = useI18n();\n\n const handlePost = () => {\n setShowSearchResults?.(false);\n if ((!emptyText || attachments.length > 0) && attachments.every(x => !x.error)) {\n onPost({\n newPostId: id,\n value: rteRef.current?.getPlainText() || '',\n attachments: attachments || [],\n recipients: selectedRecipients,\n username,\n clear: () => {\n rteRef.current?.clear();\n setResetPostTypeMenu(true);\n }\n });\n }\n };\n\n const handleClear = () => {\n setShowSearchResults?.(false);\n rteRef.current?.clear();\n rteRef.current?.focus();\n };\n\n useAfterInitialEffect(() => {\n if (postType === 'post') {\n rteRef.current?.focus();\n }\n if (postType !== 'private') {\n setSelectedRecipients([] as RecipientMenuItem[]);\n }\n }, [postType]);\n\n return (\n <StyledCard ref={setNewPostEl} as={StyledFeedNewPost} {...restProps}>\n <CardContent>\n {onRecipientSearch && (\n <FeedNewPostTypeMenu\n recipients={recipients || ([] as PostTypeMenuProps['recipients'])}\n onSetPostType={setPostType}\n onSelectedRecipientsUpdate={setSelectedRecipients}\n onRecipientSearch={onRecipientSearch}\n reset={resetPostTypeMenu}\n onReset={() => setResetPostTypeMenu(false)}\n />\n )}\n\n <Flex container={{ alignItems: 'start', gap: 1 }}>\n <Avatar name={fullname} size='l' imageSrc={avatarSrc} />\n\n <StyledTextAreaContainer>\n <FeedRichText\n label={t('feed_new_post')}\n labelHidden\n onChange={() => {\n setEmptyText(rteRef.current?.getPlainText().trim() === '');\n }}\n placeholder={textAreaPlaceholder}\n autoFocus={autoFocus}\n onSubmit={handlePost}\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n ref={rteRef}\n />\n </StyledTextAreaContainer>\n\n {!emptyText && (\n <Button\n variant='simple'\n as={FeedButton}\n onClick={handleClear}\n icon\n label={t('feed_cancel_conversation')}\n tabIndex={-1}\n >\n <Icon name='times' />\n </Button>\n )}\n\n {onFilesAdded && (\n <Button\n variant='simple'\n as={FeedButton}\n onClick={() => {\n setShowSearchResults?.(false);\n attachmentEl?.click();\n }}\n icon\n label={\n attachments.length\n ? cap(t('attachments_count', [], { count: 1 }))\n : t('file_upload_text_multiple')\n }\n >\n <Icon name='paper-clip' />\n </Button>\n )}\n </Flex>\n\n <HiddenFileInput\n ref={setAttachmentEl}\n type='file'\n multiple\n onChange={() => {\n if (attachmentEl?.files) {\n onFilesAdded?.(Array.from(attachmentEl?.files));\n }\n }}\n // Must trick input to believe there is no value when activated so that the same file may be added consecutively.\n onClick={(event: MouseEvent) => {\n (event.target as HTMLInputElement).value = '';\n }}\n />\n\n <FeedAttachments attachments={attachments} />\n\n <ExpandCollapse collapsed={!hasFocus && emptyText && !attachments.length}>\n <Flex container={{ justify: 'end' }}>\n <Button\n variant='primary'\n disabled={(emptyText && attachments.length === 0) || attachments.some(x => x.error)}\n onClick={handlePost}\n >\n {postLabel}\n </Button>\n </Flex>\n </ExpandCollapse>\n </CardContent>\n </StyledCard>\n );\n};\n\nexport default FeedNewPost;\n"]}
1
+ {"version":3,"file":"FeedNewPost.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedNewPost.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, FC, MouseEvent, useRef, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n Button,\n CardContent,\n Flex,\n Icon,\n registerIcon,\n StyledIcon,\n StyledCard,\n StyledPopover,\n defaultThemeProp,\n useElement,\n useOuterEvent,\n ForwardProps,\n useI18n,\n ExpandCollapse,\n useAfterInitialEffect,\n cap\n} from '@pega/cosmos-react-core';\nimport { RichTextEditorState, StyledRichTextEditor } from '@pega/cosmos-react-rte';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\n\nimport FeedNewPostTypeMenu, {\n PostType,\n PostTypeMenuProps,\n RecipientMenuItem\n} from './FeedNewPostTypeMenu';\nimport FeedAttachments, { AttachedFiles } from './FeedAttachments';\nimport FeedButton from './FeedButton';\nimport FeedRichText from './FeedRichText';\nimport { FeedContext } from './Feed.context';\n\nregisterIcon(timesIcon, paperClipIcon);\n\nexport interface FeedNewPostProps {\n /** A unique ID for the NewPost */\n id: string;\n /** A set of attachment files. */\n attachments?: AttachedFiles[];\n /** Information that is used to label buttons and inputs for accessibility purposes */\n interactionInfo: {\n textAreaPlaceholder: string;\n postLabel: string;\n };\n /** A callback containing a list of added files that will run whenever files are added to the post. */\n onFilesAdded?: (files: AttachedFiles[]) => void;\n /** A callback that will run when the new post button has been clicked */\n onPost: (event: {\n newPostId: string;\n value: string;\n attachments: AttachedFiles[];\n recipients: RecipientMenuItem[];\n username: string;\n clear: () => void;\n }) => void;\n autoFocus?: boolean;\n /** Array of private recipient options */\n recipients?: PostTypeMenuProps['recipients'];\n /** Handler for new search on private recipient options */\n onRecipientSearch?: (newSearch: string) => void;\n}\n\nexport const StyledTextAreaContainer = styled.div(() => {\n return css`\n margin-top: 0.625rem;\n min-height: 1rem;\n width: 100%;\n\n ${StyledRichTextEditor} {\n &:focus-within {\n box-shadow: none;\n }\n }\n `;\n});\n\nStyledTextAreaContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFeedNewPost = styled.div(({ theme }) => {\n return css`\n ${StyledIcon}:not(${StyledPopover} ${StyledIcon}) {\n font-size: 1.25rem;\n }\n\n ${FeedButton} {\n margin-top: calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledFeedNewPost.defaultProps = defaultThemeProp;\n\nconst HiddenFileInput = styled.input`\n display: none;\n`;\n\nconst FeedNewPost: FC<ForwardProps & FeedNewPostProps> = (props: FeedNewPostProps) => {\n const {\n id,\n attachments = [],\n interactionInfo,\n onPost,\n onFilesAdded,\n autoFocus,\n recipients,\n onRecipientSearch,\n ...restProps\n } = props;\n const rteRef = useRef<RichTextEditorState>();\n const { textAreaPlaceholder, postLabel } = interactionInfo;\n const { setShowSearchResults } = useContext(FeedContext);\n const { avatarSrc, fullname, username } = useContext(FeedContext).userInfo;\n const [emptyText, setEmptyText] = useState(true);\n const [hasFocus, setHasFocus] = useState(autoFocus);\n const [postType, setPostType] = useState<PostType>('post');\n const [resetPostTypeMenu, setResetPostTypeMenu] = useState(false);\n const [selectedRecipients, setSelectedRecipients] = useState<RecipientMenuItem[]>([]);\n const [attachmentEl, setAttachmentEl] = useElement<HTMLInputElement>();\n const [newPostEl, setNewPostEl] = useElement<HTMLDivElement>();\n\n useOuterEvent('mousedown', [newPostEl], () => {\n if (emptyText) rteRef.current?.clear();\n });\n\n const t = useI18n();\n\n const handlePost = () => {\n setShowSearchResults?.(false);\n if ((!emptyText || attachments.length > 0) && attachments.every(x => !x.error)) {\n onPost({\n newPostId: id,\n value: rteRef.current?.getPlainText() || '',\n attachments: attachments || [],\n recipients: selectedRecipients,\n username,\n clear: () => {\n rteRef.current?.clear();\n setResetPostTypeMenu(true);\n }\n });\n }\n };\n\n const handleClear = () => {\n setShowSearchResults?.(false);\n rteRef.current?.clear();\n rteRef.current?.focus();\n };\n\n useAfterInitialEffect(() => {\n if (postType === 'post') {\n rteRef.current?.focus();\n }\n if (postType !== 'private') {\n setSelectedRecipients([] as RecipientMenuItem[]);\n }\n }, [postType]);\n\n return (\n <StyledCard ref={setNewPostEl} as={StyledFeedNewPost} {...restProps}>\n <CardContent>\n {onRecipientSearch && (\n <FeedNewPostTypeMenu\n recipients={recipients || ([] as PostTypeMenuProps['recipients'])}\n onSetPostType={setPostType}\n onSelectedRecipientsUpdate={setSelectedRecipients}\n onRecipientSearch={onRecipientSearch}\n reset={resetPostTypeMenu}\n onReset={() => setResetPostTypeMenu(false)}\n />\n )}\n\n <Flex container={{ alignItems: 'start', gap: 1 }}>\n <Avatar name={fullname} size='l' imageSrc={avatarSrc} />\n\n <StyledTextAreaContainer>\n <FeedRichText\n label={t('feed_new_post')}\n labelHidden\n onChange={() => {\n setEmptyText(rteRef.current?.getPlainText().trim() === '');\n }}\n placeholder={textAreaPlaceholder}\n autoFocus={autoFocus}\n onSubmit={handlePost}\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n ref={rteRef}\n />\n </StyledTextAreaContainer>\n\n {!emptyText && (\n <Button\n variant='simple'\n as={FeedButton}\n onClick={handleClear}\n icon\n label={t('feed_cancel_conversation')}\n tabIndex={-1}\n >\n <Icon name='times' />\n </Button>\n )}\n\n {onFilesAdded && (\n <Button\n variant='simple'\n as={FeedButton}\n onClick={() => {\n setShowSearchResults?.(false);\n attachmentEl?.click();\n }}\n icon\n label={\n attachments.length\n ? cap(t('attachments_count', [], { count: 1 }))\n : t('file_upload_text_multiple')\n }\n >\n <Icon name='paper-clip' />\n </Button>\n )}\n </Flex>\n\n <HiddenFileInput\n ref={setAttachmentEl}\n type='file'\n multiple\n onChange={() => {\n if (attachmentEl?.files) {\n onFilesAdded?.(Array.from(attachmentEl?.files));\n }\n }}\n // Must trick input to believe there is no value when activated so that the same file may be added consecutively.\n onClick={(event: MouseEvent) => {\n (event.target as HTMLInputElement).value = '';\n }}\n />\n\n <FeedAttachments attachments={attachments} />\n\n <ExpandCollapse collapsed={!hasFocus && emptyText && !attachments.length}>\n <Flex container={{ justify: 'end' }}>\n <Button\n variant='primary'\n disabled={(emptyText && attachments.length === 0) || attachments.some(x => x.error)}\n onClick={handlePost}\n >\n {postLabel}\n </Button>\n </Flex>\n </ExpandCollapse>\n </CardContent>\n </StyledCard>\n );\n};\n\nexport default FeedNewPost;\n"]}
@@ -355,15 +355,15 @@ const FeedNewPostTypeMenu = ({ recipients, onSetPostType, onSelectedRecipientsUp
355
355
  }, [multiSelectInputRef.current, state.showTypeMenu]);
356
356
  return (_jsxs("div", { children: [_jsxs(StyledTypeMenuToggle, { ...restProps, onClick: () => {
357
357
  dispatch({ type: 'toggleTypeMenu' });
358
- }, ref: setToggleEl, variant: 'link', "aria-haspopup": 'menu', "aria-expanded": state.showTypeMenu, onBlur: onBlur, children: [_jsx("span", { ref: setTypeMenuPopoverTarget, children: typeCopy[state.postType].primary }, void 0), _jsx(Icon, { name: 'arrow-micro-down' }, void 0)] }, void 0), state.postType === 'private' && state.multiSelectItems.length > 0 && (_jsxs(_Fragment, { children: [_jsx(StyledRecipientCount, { ref: setRecipientCountEl, "aria-describedby": `recipients-popover--${menuPopoverId}`, onMouseEnter: () => {
358
+ }, ref: setToggleEl, variant: 'link', "aria-haspopup": 'menu', "aria-expanded": state.showTypeMenu, onBlur: onBlur, children: [_jsx("span", { ref: setTypeMenuPopoverTarget, children: typeCopy[state.postType].primary }), _jsx(Icon, { name: 'arrow-micro-down' })] }), state.postType === 'private' && state.multiSelectItems.length > 0 && (_jsxs(_Fragment, { children: [_jsx(StyledRecipientCount, { ref: setRecipientCountEl, "aria-describedby": `recipients-popover--${menuPopoverId}`, onMouseEnter: () => {
359
359
  if (!state.showTypeMenu)
360
360
  dispatch({ type: 'setShowCountPopover', payload: true });
361
- }, onFocus: () => dispatch({ type: 'setShowCountPopover', payload: true }), onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), children: `${state.multiSelectItems.length}` }, void 0), _jsx(Popover, { show: state.showCountPopover, target: recipientCountEl, id: `recipients-popover--${menuPopoverId}`, onMouseEnter: () => {
361
+ }, onFocus: () => dispatch({ type: 'setShowCountPopover', payload: true }), onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), children: `${state.multiSelectItems.length}` }), _jsx(Popover, { show: state.showCountPopover, target: recipientCountEl, id: `recipients-popover--${menuPopoverId}`, onMouseEnter: () => {
362
362
  if (!state.showTypeMenu)
363
363
  dispatch({ type: 'setShowCountPopover', payload: true });
364
364
  }, onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), arrow: true, children: _jsx(StyledCountBadgePopoverContent, { children: state.multiSelectItems.map((recipient) => {
365
- return (_jsx("p", { children: _jsx(Text, { variant: 'primary', children: recipient.text }, void 0) }, recipient.id));
366
- }) }, void 0) }, void 0)] }, void 0)), _jsxs(StyledPostTypePopover, { id: menuPopoverId, ref: setTypePopoverEl, target: typeMenuPopoverTarget, show: state.showTypeMenu, placement: 'bottom-start', children: [(state.postType !== 'private' || !state.viewingRecipients) && (_jsx(Menu, { items: state.typeMenuItems, focusControlEl: toggleEl || undefined, mode: 'single-select', onItemClick: selectedId => {
365
+ return (_jsx("p", { children: _jsx(Text, { variant: 'primary', children: recipient.text }) }, recipient.id));
366
+ }) }) })] })), _jsxs(StyledPostTypePopover, { id: menuPopoverId, ref: setTypePopoverEl, target: typeMenuPopoverTarget, show: state.showTypeMenu, placement: 'bottom-start', children: [(state.postType !== 'private' || !state.viewingRecipients) && (_jsx(Menu, { items: state.typeMenuItems, focusControlEl: toggleEl || undefined, mode: 'single-select', onItemClick: selectedId => {
367
367
  const postType = state.typeMenuItems.find(item => item.id === selectedId).value;
368
368
  dispatch({ type: 'setPostType', payload: postType });
369
369
  }, onItemExpand: () => {
@@ -373,15 +373,15 @@ const FeedNewPostTypeMenu = ({ recipients, onSetPostType, onSelectedRecipientsUp
373
373
  else {
374
374
  dispatch({ type: 'setPostType', payload: 'private' });
375
375
  }
376
- } }, void 0)), state.postType === 'private' && state.viewingRecipients && (_jsxs(StyledPostTypePopoverContent, { children: [_jsxs(StyledRecipientMenuHeader, { children: [_jsxs(Button, { as: StyledRecipientBackButton, variant: 'text', "aria-label": 'close submenu', onClick: () => {
376
+ } })), state.postType === 'private' && state.viewingRecipients && (_jsxs(StyledPostTypePopoverContent, { children: [_jsxs(StyledRecipientMenuHeader, { children: [_jsxs(Button, { as: StyledRecipientBackButton, variant: 'text', "aria-label": 'close submenu', onClick: () => {
377
377
  dispatch({ type: 'setViewingRecipients', payload: false });
378
- }, onBlur: onBlur, children: [_jsx(Icon, { name: 'caret-left' }, void 0), typeCopy.private.primary] }, void 0), _jsx(StyledSelectedInputContainer, { children: _jsx(MultiSelectInput, { ref: multiSelectInputRef, selected: state.multiSelectItems, onRemove: (selectedId) => {
378
+ }, onBlur: onBlur, children: [_jsx(Icon, { name: 'caret-left' }), typeCopy.private.primary] }), _jsx(StyledSelectedInputContainer, { children: _jsx(MultiSelectInput, { ref: multiSelectInputRef, selected: state.multiSelectItems, onRemove: (selectedId) => {
379
379
  dispatch({ type: 'removeRecipientViaMultiSelect', payload: selectedId });
380
380
  }, value: state.searchValue, onChange: (e) => {
381
381
  dispatch({ type: 'setSearchValue', payload: e.target.value });
382
- }, onBlur: onBlur }, void 0) }, void 0)] }, void 0), state.showRecipientMenu && (_jsx(StyledRecipientMenu, { loading: state.itemsLoading, focusControlEl: multiSelectInputRef.current, items: state.itemsLoading ? [] : state.recipientMenuItems, scrollAt: 11, mode: 'action', emptyText: 'No items', onItemClick: (selectedId) => {
382
+ }, onBlur: onBlur }) })] }), state.showRecipientMenu && (_jsx(StyledRecipientMenu, { loading: state.itemsLoading, focusControlEl: multiSelectInputRef.current, items: state.itemsLoading ? [] : state.recipientMenuItems, scrollAt: 11, mode: 'action', emptyText: 'No items', onItemClick: (selectedId) => {
383
383
  dispatch({ type: 'selectRecipientViaMenu', payload: selectedId });
384
- } }, void 0))] }, void 0))] }, void 0)] }, void 0));
384
+ } }))] }))] })] }));
385
385
  };
386
386
  export default FeedNewPostTypeMenu;
387
387
  //# sourceMappingURL=FeedNewPostTypeMenu.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FeedNewPostTypeMenu.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedNewPostTypeMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useMemo, useEffect, useCallback, useReducer, ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Text,\n StyledPrimary,\n StyledMenuItem,\n Icon,\n StyledIcon,\n useElement,\n useOuterEvent,\n Popover,\n Menu,\n Status,\n defaultThemeProp,\n createUID,\n useAfterInitialEffect,\n ForwardProps\n} from '@pega/cosmos-react-core';\nimport { StyledMenuListHeader } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\nimport MultiSelectInput from '@pega/cosmos-react-core/lib/components/ComboBox/MultiSelectInput/MultiSelectInput';\n\nexport type PostType = 'post' | 'private';\n\nexport interface RecipientOption {\n /** Pretty printed recipient name */\n primary: string;\n /** Functional identifier of unique recipient */\n value: string;\n}\n\nexport interface RecipientMenuItem {\n id: string;\n selected?: boolean;\n primary: RecipientOption['primary'];\n value: RecipientOption['value'];\n}\n\nexport interface RecipientMultiSelectData {\n id: RecipientMenuItem['id'];\n text: RecipientMenuItem['primary'];\n value: RecipientMenuItem['value'];\n}\n\nexport interface PostTypeMenuProps {\n /** Array of private recipient options */\n recipients: RecipientOption[];\n /** Post type update handler */\n onSetPostType: (postType: PostType) => void;\n /** Private post recipient list update handler */\n onSelectedRecipientsUpdate: (recipients: RecipientMenuItem[]) => void;\n /** Handler for new search on private recipient options */\n onRecipientSearch: (newSearch: string) => void;\n reset: boolean;\n onReset: () => void;\n}\n\ninterface PostTypeMenuState {\n postType: PostType;\n itemsLoading: boolean;\n showTypeMenu: boolean;\n showRecipientMenu: boolean;\n viewingRecipients: boolean;\n showCountPopover: boolean;\n searchValue: string;\n typeMenuItems: {\n id: string;\n primary: string;\n selected: boolean;\n value: PostType;\n }[];\n recipientMenuItems: RecipientMenuItem[];\n multiSelectItems: RecipientMultiSelectData[];\n}\n\nconst StyledCountBadgePopoverContent = styled.div(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n padding: ${spacing};\n\n p:not(:last-child) {\n margin-bottom: ${spacing};\n }\n `;\n});\nStyledCountBadgePopoverContent.defaultProps = defaultThemeProp;\n\nconst StyledPostTypePopoverContent = styled.div`\n width: clamp(16rem, 60vw, 40rem);\n`;\n\nconst StyledRecipientCount = styled(Status)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n border-radius: 1.25rem;\n margin: 0 0 0 calc(0.5 * ${spacing});\n `;\n});\nStyledRecipientCount.defaultProps = defaultThemeProp;\n\nconst StyledSelectedInputContainer = styled.div(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n margin: ${spacing} calc(2 * ${spacing}) calc(2 * ${spacing});\n `;\n});\nStyledSelectedInputContainer.defaultProps = defaultThemeProp;\n\nconst StyledRecipientBackButton = styled(StyledMenuListHeader)(({ theme }) => {\n const {\n base: {\n 'font-weight': { 'semi-bold': fontWeight },\n spacing\n }\n } = theme;\n\n return css`\n font-weight: ${fontWeight};\n padding: ${spacing} calc(2 * ${spacing});\n\n &:hover,\n &:focus {\n text-decoration: none;\n }\n\n && ${StyledIcon} {\n display: inline-block;\n margin-inline-end: ${spacing};\n }\n `;\n});\nStyledRecipientBackButton.defaultProps = defaultThemeProp;\n\nconst StyledRecipientMenuHeader = styled.div``;\n\nconst StyledTypeMenuToggle = styled(Button)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n margin: ${spacing} 0;\n `;\n});\nStyledTypeMenuToggle.defaultProps = defaultThemeProp;\n\nconst StyledRecipientMenu = styled(Menu)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n ${StyledMenuItem} > button {\n padding: ${spacing} calc(2 * ${spacing});\n }\n `;\n});\nStyledRecipientMenu.defaultProps = defaultThemeProp;\n\nconst StyledPostTypePopover = styled(Popover)(({ theme }) => {\n const {\n base: {\n 'font-weight': { normal: fontWeight }\n }\n } = theme;\n return css`\n ${StyledPrimary} {\n font-weight: ${fontWeight};\n }\n `;\n});\nStyledPostTypePopover.defaultProps = defaultThemeProp;\n\nconst typeCopy = {\n post: {\n primary: 'Public post'\n },\n private: {\n primary: 'Private post'\n }\n};\n\nconst createRecipientMenuItem = (\n recipient: RecipientOption,\n selectedIds?: RecipientMenuItem['id'][]\n) => {\n const checkIds = selectedIds || [];\n const id = `option_${recipient.value}`;\n\n return {\n ...recipient,\n id,\n selected: checkIds.includes(id)\n };\n};\n\nconst getTypeMenuItems = (type: PostType): PostTypeMenuState['typeMenuItems'] => {\n return [\n {\n id: '1',\n primary: typeCopy.post.primary,\n selected: type === 'post',\n value: 'post'\n },\n {\n id: '2',\n primary: typeCopy.private.primary,\n selected: type === 'private',\n value: 'private'\n }\n ];\n};\n\nconst initialState: PostTypeMenuState = {\n postType: 'post',\n itemsLoading: false,\n showTypeMenu: false,\n showRecipientMenu: false,\n viewingRecipients: false,\n showCountPopover: false,\n searchValue: '',\n typeMenuItems: getTypeMenuItems('post'),\n recipientMenuItems: [] as RecipientMenuItem[],\n multiSelectItems: [] as RecipientMultiSelectData[]\n};\n\nconst FeedNewPostTypeMenu = ({\n recipients,\n onSetPostType,\n onSelectedRecipientsUpdate,\n onRecipientSearch,\n reset,\n onReset,\n ...restProps\n}: PostTypeMenuProps & ForwardProps) => {\n const menuPopoverId = useMemo(() => createUID(), []);\n\n const multiSelectInputRef = useRef<HTMLInputElement>(null);\n const [toggleEl, setToggleEl] = useElement<HTMLButtonElement>();\n const [recipientCountEl, setRecipientCountEl] = useElement<HTMLElement>();\n const [typePopoverEl, setTypePopoverEl] = useElement<HTMLElement>(null);\n const [typeMenuPopoverTarget, setTypeMenuPopoverTarget] = useElement<HTMLButtonElement>(null);\n\n const reducer = (\n state: PostTypeMenuState,\n action: {\n type:\n | 'reset'\n | 'setPostType'\n | 'setShowTypeMenu'\n | 'setShowRecipientMenu'\n | 'setSearchValue'\n | 'setViewingRecipients'\n | 'setShowCountPopover'\n | 'setItemsLoading'\n | 'updateTypeMenuItems'\n | 'toggleTypeMenu'\n | 'removeRecipientViaMultiSelect'\n | 'selectRecipientViaMenu'\n | 'updateRecipientMenuItems'\n | 'resetUnappliedState';\n payload?: any;\n }\n ): PostTypeMenuState => {\n const type = action.type;\n const payload = action.payload;\n\n switch (type) {\n case 'reset': {\n return initialState;\n }\n case 'setPostType': {\n const postType = payload;\n const privateSelected = postType === 'private';\n\n return {\n ...state,\n postType,\n showTypeMenu: !privateSelected ? false : state.showTypeMenu,\n viewingRecipients: privateSelected ? true : state.viewingRecipients,\n multiSelectItems: initialState.multiSelectItems,\n searchValue: initialState.searchValue\n };\n }\n case 'setShowTypeMenu': {\n return {\n ...state,\n showTypeMenu: payload\n };\n }\n case 'setShowRecipientMenu': {\n return {\n ...state,\n showRecipientMenu: payload\n };\n }\n case 'setSearchValue': {\n return {\n ...state,\n searchValue: payload\n };\n }\n case 'setViewingRecipients': {\n return {\n ...state,\n viewingRecipients: payload\n };\n }\n case 'setShowCountPopover': {\n return {\n ...state,\n showCountPopover: payload\n };\n }\n case 'setItemsLoading': {\n return {\n ...state,\n itemsLoading: payload\n };\n }\n case 'updateTypeMenuItems': {\n return {\n ...state,\n typeMenuItems: getTypeMenuItems(state.postType)\n };\n }\n case 'toggleTypeMenu': {\n return {\n ...state,\n showTypeMenu: !state.showTypeMenu,\n showCountPopover: false\n };\n }\n case 'removeRecipientViaMultiSelect': {\n const selectedId = payload;\n\n const multiSelectItems = state.multiSelectItems.reduce<RecipientMultiSelectData[]>(\n (acc, recipient) => {\n if (recipient.id === selectedId) return acc;\n\n return acc.concat([recipient]);\n },\n []\n );\n\n const recipientMenuItems = state.recipientMenuItems.map(item => {\n if (item.id === selectedId) {\n return {\n ...item,\n selected: false\n };\n }\n\n return {\n ...item\n };\n });\n\n return {\n ...state,\n multiSelectItems,\n recipientMenuItems\n };\n }\n case 'selectRecipientViaMenu': {\n const selectedId = payload;\n\n if (!state.multiSelectItems.some(item => item.id === selectedId)) {\n const selectedFromMenu = state.recipientMenuItems.filter(\n item => item.id === selectedId\n )[0];\n\n const multiSelectItems = state.multiSelectItems.concat([\n {\n text: selectedFromMenu.primary,\n id: selectedFromMenu.id,\n value: selectedFromMenu.value\n }\n ]);\n\n return {\n ...state,\n multiSelectItems,\n searchValue: ''\n };\n }\n\n return {\n ...state,\n searchValue: ''\n };\n }\n case 'updateRecipientMenuItems': {\n const selectedIds = state.multiSelectItems.map(item => item.id);\n\n return {\n ...state,\n itemsLoading: false,\n recipientMenuItems: recipients.map(recipient =>\n createRecipientMenuItem(recipient, selectedIds)\n )\n };\n }\n case 'resetUnappliedState': {\n const postType =\n state.postType === 'private' && state.multiSelectItems.length === 0\n ? 'post'\n : state.postType;\n\n const searchValue = '';\n\n return {\n ...state,\n postType,\n searchValue\n };\n }\n default:\n return {\n ...state\n };\n }\n };\n const [state, dispatch] = useReducer(reducer, initialState);\n\n const onBlur = useCallback((): void => {\n setTimeout(() => {\n if (!document.activeElement?.closest(`#${menuPopoverId}`)) {\n dispatch({ type: 'setShowTypeMenu', payload: false });\n }\n }, 200);\n }, [menuPopoverId]);\n\n const handleKeydownToggle = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape' && state.showTypeMenu) dispatch({ type: 'toggleTypeMenu' });\n },\n [state.showTypeMenu]\n );\n\n useOuterEvent('mousedown', [typePopoverEl, typeMenuPopoverTarget], () => {\n dispatch({ type: 'setShowTypeMenu', payload: false });\n });\n\n useEffect(() => {\n if (reset) {\n dispatch({ type: 'reset' });\n onReset();\n }\n }, [reset]);\n\n useEffect(() => {\n dispatch({ type: 'updateRecipientMenuItems' });\n }, [recipients]);\n\n useEffect(() => {\n onSelectedRecipientsUpdate(\n state.multiSelectItems.map(item => ({\n id: item.id,\n primary: item.text,\n value: item.value\n }))\n );\n }, [state.multiSelectItems]);\n\n useEffect(() => {\n if (!state.showTypeMenu) {\n if (state.postType === 'private') {\n // Timeout to prevent flash of recipients options when closing menu.\n setTimeout(() => {\n dispatch({ type: 'setViewingRecipients', payload: true });\n }, 100);\n }\n\n setTimeout(() => {\n // Timeout to prevent flash of type menu when resetting postType on close\n dispatch({ type: 'resetUnappliedState' });\n }, 100);\n }\n }, [state.showTypeMenu]);\n\n useEffect(() => {\n if (multiSelectInputRef.current) {\n multiSelectInputRef.current?.focus();\n }\n }, [multiSelectInputRef.current]);\n\n useEffect(() => {\n if (state.postType === 'private') {\n if (!state.viewingRecipients) {\n toggleEl?.focus();\n } else {\n multiSelectInputRef.current?.focus();\n }\n }\n }, [state.viewingRecipients]);\n\n useAfterInitialEffect(() => {\n onSetPostType(state.postType);\n dispatch({ type: 'updateTypeMenuItems' });\n\n if (state.postType === 'private') {\n multiSelectInputRef.current?.focus();\n }\n }, [state.postType]);\n\n useEffect(() => {\n const interactionTimeout = setTimeout(() => {\n onRecipientSearch(state.searchValue);\n dispatch({ type: 'setItemsLoading', payload: true });\n dispatch({ type: 'setShowRecipientMenu', payload: !!state.searchValue.length });\n }, 300);\n\n return () => {\n clearTimeout(interactionTimeout);\n };\n }, [state.searchValue]);\n\n useEffect(() => {\n toggleEl?.addEventListener('keydown', handleKeydownToggle);\n\n return () => toggleEl?.removeEventListener('keydown', handleKeydownToggle);\n }, [toggleEl, state.showTypeMenu]);\n\n useEffect(() => {\n multiSelectInputRef.current?.addEventListener('keydown', handleKeydownToggle);\n\n return () => multiSelectInputRef.current?.removeEventListener('keydown', handleKeydownToggle);\n }, [multiSelectInputRef.current, state.showTypeMenu]);\n\n return (\n <div>\n <StyledTypeMenuToggle\n {...restProps}\n onClick={() => {\n dispatch({ type: 'toggleTypeMenu' });\n }}\n ref={setToggleEl}\n variant='link'\n aria-haspopup='menu'\n aria-expanded={state.showTypeMenu}\n onBlur={onBlur}\n >\n <span ref={setTypeMenuPopoverTarget}>{typeCopy[state.postType].primary}</span>\n <Icon name='arrow-micro-down' />\n </StyledTypeMenuToggle>\n\n {state.postType === 'private' && state.multiSelectItems.length > 0 && (\n <>\n <StyledRecipientCount\n ref={setRecipientCountEl}\n aria-describedby={`recipients-popover--${menuPopoverId}`}\n onMouseEnter={() => {\n if (!state.showTypeMenu) dispatch({ type: 'setShowCountPopover', payload: true });\n }}\n onFocus={() => dispatch({ type: 'setShowCountPopover', payload: true })}\n onMouseLeave={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n >{`${state.multiSelectItems.length}`}</StyledRecipientCount>\n\n <Popover\n show={state.showCountPopover}\n target={recipientCountEl}\n id={`recipients-popover--${menuPopoverId}`}\n onMouseEnter={() => {\n if (!state.showTypeMenu) dispatch({ type: 'setShowCountPopover', payload: true });\n }}\n onMouseLeave={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n arrow\n >\n <StyledCountBadgePopoverContent>\n {state.multiSelectItems.map((recipient: RecipientMultiSelectData) => {\n return (\n <p key={recipient.id}>\n <Text variant='primary'>{recipient.text}</Text>\n </p>\n );\n })}\n </StyledCountBadgePopoverContent>\n </Popover>\n </>\n )}\n\n <StyledPostTypePopover\n id={menuPopoverId}\n ref={setTypePopoverEl}\n target={typeMenuPopoverTarget}\n show={state.showTypeMenu}\n placement='bottom-start'\n >\n {(state.postType !== 'private' || !state.viewingRecipients) && (\n <Menu\n items={state.typeMenuItems}\n focusControlEl={toggleEl || undefined}\n mode='single-select'\n onItemClick={selectedId => {\n const postType = state.typeMenuItems.find(item => item.id === selectedId)!.value;\n dispatch({ type: 'setPostType', payload: postType });\n }}\n onItemExpand={() => {\n if (state.postType === 'private') {\n dispatch({ type: 'setViewingRecipients', payload: true });\n } else {\n dispatch({ type: 'setPostType', payload: 'private' });\n }\n }}\n />\n )}\n\n {state.postType === 'private' && state.viewingRecipients && (\n <StyledPostTypePopoverContent>\n <StyledRecipientMenuHeader>\n <Button\n as={StyledRecipientBackButton}\n variant='text'\n aria-label='close submenu'\n onClick={() => {\n dispatch({ type: 'setViewingRecipients', payload: false });\n }}\n onBlur={onBlur}\n >\n <Icon name='caret-left' />\n {typeCopy.private.primary}\n </Button>\n\n <StyledSelectedInputContainer>\n <MultiSelectInput\n ref={multiSelectInputRef}\n selected={state.multiSelectItems}\n onRemove={(selectedId: RecipientMultiSelectData['id']) => {\n dispatch({ type: 'removeRecipientViaMultiSelect', payload: selectedId });\n }}\n value={state.searchValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({ type: 'setSearchValue', payload: e.target.value });\n }}\n onBlur={onBlur}\n />\n </StyledSelectedInputContainer>\n </StyledRecipientMenuHeader>\n\n {state.showRecipientMenu && (\n <StyledRecipientMenu\n loading={state.itemsLoading}\n focusControlEl={multiSelectInputRef.current}\n items={state.itemsLoading ? [] : state.recipientMenuItems}\n scrollAt={11}\n mode='action'\n emptyText='No items'\n onItemClick={(selectedId: RecipientMultiSelectData['id']) => {\n dispatch({ type: 'selectRecipientViaMenu', payload: selectedId });\n }}\n />\n )}\n </StyledPostTypePopoverContent>\n )}\n </StyledPostTypePopover>\n </div>\n );\n};\n\nexport default FeedNewPostTypeMenu;\n"]}
1
+ {"version":3,"file":"FeedNewPostTypeMenu.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedNewPostTypeMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useMemo, useEffect, useCallback, useReducer, ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Text,\n StyledPrimary,\n StyledMenuItem,\n Icon,\n StyledIcon,\n useElement,\n useOuterEvent,\n Popover,\n Menu,\n Status,\n defaultThemeProp,\n createUID,\n useAfterInitialEffect,\n ForwardProps\n} from '@pega/cosmos-react-core';\nimport { StyledMenuListHeader } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\nimport MultiSelectInput from '@pega/cosmos-react-core/lib/components/ComboBox/MultiSelectInput/MultiSelectInput';\n\nexport type PostType = 'post' | 'private';\n\nexport interface RecipientOption {\n /** Pretty printed recipient name */\n primary: string;\n /** Functional identifier of unique recipient */\n value: string;\n}\n\nexport interface RecipientMenuItem {\n id: string;\n selected?: boolean;\n primary: RecipientOption['primary'];\n value: RecipientOption['value'];\n}\n\nexport interface RecipientMultiSelectData {\n id: RecipientMenuItem['id'];\n text: RecipientMenuItem['primary'];\n value: RecipientMenuItem['value'];\n}\n\nexport interface PostTypeMenuProps {\n /** Array of private recipient options */\n recipients: RecipientOption[];\n /** Post type update handler */\n onSetPostType: (postType: PostType) => void;\n /** Private post recipient list update handler */\n onSelectedRecipientsUpdate: (recipients: RecipientMenuItem[]) => void;\n /** Handler for new search on private recipient options */\n onRecipientSearch: (newSearch: string) => void;\n reset: boolean;\n onReset: () => void;\n}\n\ninterface PostTypeMenuState {\n postType: PostType;\n itemsLoading: boolean;\n showTypeMenu: boolean;\n showRecipientMenu: boolean;\n viewingRecipients: boolean;\n showCountPopover: boolean;\n searchValue: string;\n typeMenuItems: {\n id: string;\n primary: string;\n selected: boolean;\n value: PostType;\n }[];\n recipientMenuItems: RecipientMenuItem[];\n multiSelectItems: RecipientMultiSelectData[];\n}\n\nconst StyledCountBadgePopoverContent = styled.div(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n padding: ${spacing};\n\n p:not(:last-child) {\n margin-bottom: ${spacing};\n }\n `;\n});\nStyledCountBadgePopoverContent.defaultProps = defaultThemeProp;\n\nconst StyledPostTypePopoverContent = styled.div`\n width: clamp(16rem, 60vw, 40rem);\n`;\n\nconst StyledRecipientCount = styled(Status)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n border-radius: 1.25rem;\n margin: 0 0 0 calc(0.5 * ${spacing});\n `;\n});\nStyledRecipientCount.defaultProps = defaultThemeProp;\n\nconst StyledSelectedInputContainer = styled.div(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n margin: ${spacing} calc(2 * ${spacing}) calc(2 * ${spacing});\n `;\n});\nStyledSelectedInputContainer.defaultProps = defaultThemeProp;\n\nconst StyledRecipientBackButton = styled(StyledMenuListHeader)(({ theme }) => {\n const {\n base: {\n 'font-weight': { 'semi-bold': fontWeight },\n spacing\n }\n } = theme;\n\n return css`\n font-weight: ${fontWeight};\n padding: ${spacing} calc(2 * ${spacing});\n\n &:hover,\n &:focus {\n text-decoration: none;\n }\n\n && ${StyledIcon} {\n display: inline-block;\n margin-inline-end: ${spacing};\n }\n `;\n});\nStyledRecipientBackButton.defaultProps = defaultThemeProp;\n\nconst StyledRecipientMenuHeader = styled.div``;\n\nconst StyledTypeMenuToggle = styled(Button)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n margin: ${spacing} 0;\n `;\n});\nStyledTypeMenuToggle.defaultProps = defaultThemeProp;\n\nconst StyledRecipientMenu = styled(Menu)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n\n return css`\n ${StyledMenuItem} > button {\n padding: ${spacing} calc(2 * ${spacing});\n }\n `;\n});\nStyledRecipientMenu.defaultProps = defaultThemeProp;\n\nconst StyledPostTypePopover = styled(Popover)(({ theme }) => {\n const {\n base: {\n 'font-weight': { normal: fontWeight }\n }\n } = theme;\n return css`\n ${StyledPrimary} {\n font-weight: ${fontWeight};\n }\n `;\n});\nStyledPostTypePopover.defaultProps = defaultThemeProp;\n\nconst typeCopy = {\n post: {\n primary: 'Public post'\n },\n private: {\n primary: 'Private post'\n }\n};\n\nconst createRecipientMenuItem = (\n recipient: RecipientOption,\n selectedIds?: RecipientMenuItem['id'][]\n) => {\n const checkIds = selectedIds || [];\n const id = `option_${recipient.value}`;\n\n return {\n ...recipient,\n id,\n selected: checkIds.includes(id)\n };\n};\n\nconst getTypeMenuItems = (type: PostType): PostTypeMenuState['typeMenuItems'] => {\n return [\n {\n id: '1',\n primary: typeCopy.post.primary,\n selected: type === 'post',\n value: 'post'\n },\n {\n id: '2',\n primary: typeCopy.private.primary,\n selected: type === 'private',\n value: 'private'\n }\n ];\n};\n\nconst initialState: PostTypeMenuState = {\n postType: 'post',\n itemsLoading: false,\n showTypeMenu: false,\n showRecipientMenu: false,\n viewingRecipients: false,\n showCountPopover: false,\n searchValue: '',\n typeMenuItems: getTypeMenuItems('post'),\n recipientMenuItems: [] as RecipientMenuItem[],\n multiSelectItems: [] as RecipientMultiSelectData[]\n};\n\nconst FeedNewPostTypeMenu = ({\n recipients,\n onSetPostType,\n onSelectedRecipientsUpdate,\n onRecipientSearch,\n reset,\n onReset,\n ...restProps\n}: PostTypeMenuProps & ForwardProps) => {\n const menuPopoverId = useMemo(() => createUID(), []);\n\n const multiSelectInputRef = useRef<HTMLInputElement>(null);\n const [toggleEl, setToggleEl] = useElement<HTMLButtonElement>();\n const [recipientCountEl, setRecipientCountEl] = useElement<HTMLElement>();\n const [typePopoverEl, setTypePopoverEl] = useElement<HTMLElement>(null);\n const [typeMenuPopoverTarget, setTypeMenuPopoverTarget] = useElement<HTMLButtonElement>(null);\n\n const reducer = (\n state: PostTypeMenuState,\n action: {\n type:\n | 'reset'\n | 'setPostType'\n | 'setShowTypeMenu'\n | 'setShowRecipientMenu'\n | 'setSearchValue'\n | 'setViewingRecipients'\n | 'setShowCountPopover'\n | 'setItemsLoading'\n | 'updateTypeMenuItems'\n | 'toggleTypeMenu'\n | 'removeRecipientViaMultiSelect'\n | 'selectRecipientViaMenu'\n | 'updateRecipientMenuItems'\n | 'resetUnappliedState';\n payload?: any;\n }\n ): PostTypeMenuState => {\n const type = action.type;\n const payload = action.payload;\n\n switch (type) {\n case 'reset': {\n return initialState;\n }\n case 'setPostType': {\n const postType = payload;\n const privateSelected = postType === 'private';\n\n return {\n ...state,\n postType,\n showTypeMenu: !privateSelected ? false : state.showTypeMenu,\n viewingRecipients: privateSelected ? true : state.viewingRecipients,\n multiSelectItems: initialState.multiSelectItems,\n searchValue: initialState.searchValue\n };\n }\n case 'setShowTypeMenu': {\n return {\n ...state,\n showTypeMenu: payload\n };\n }\n case 'setShowRecipientMenu': {\n return {\n ...state,\n showRecipientMenu: payload\n };\n }\n case 'setSearchValue': {\n return {\n ...state,\n searchValue: payload\n };\n }\n case 'setViewingRecipients': {\n return {\n ...state,\n viewingRecipients: payload\n };\n }\n case 'setShowCountPopover': {\n return {\n ...state,\n showCountPopover: payload\n };\n }\n case 'setItemsLoading': {\n return {\n ...state,\n itemsLoading: payload\n };\n }\n case 'updateTypeMenuItems': {\n return {\n ...state,\n typeMenuItems: getTypeMenuItems(state.postType)\n };\n }\n case 'toggleTypeMenu': {\n return {\n ...state,\n showTypeMenu: !state.showTypeMenu,\n showCountPopover: false\n };\n }\n case 'removeRecipientViaMultiSelect': {\n const selectedId = payload;\n\n const multiSelectItems = state.multiSelectItems.reduce<RecipientMultiSelectData[]>(\n (acc, recipient) => {\n if (recipient.id === selectedId) return acc;\n\n return acc.concat([recipient]);\n },\n []\n );\n\n const recipientMenuItems = state.recipientMenuItems.map(item => {\n if (item.id === selectedId) {\n return {\n ...item,\n selected: false\n };\n }\n\n return {\n ...item\n };\n });\n\n return {\n ...state,\n multiSelectItems,\n recipientMenuItems\n };\n }\n case 'selectRecipientViaMenu': {\n const selectedId = payload;\n\n if (!state.multiSelectItems.some(item => item.id === selectedId)) {\n const selectedFromMenu = state.recipientMenuItems.filter(\n item => item.id === selectedId\n )[0];\n\n const multiSelectItems = state.multiSelectItems.concat([\n {\n text: selectedFromMenu.primary,\n id: selectedFromMenu.id,\n value: selectedFromMenu.value\n }\n ]);\n\n return {\n ...state,\n multiSelectItems,\n searchValue: ''\n };\n }\n\n return {\n ...state,\n searchValue: ''\n };\n }\n case 'updateRecipientMenuItems': {\n const selectedIds = state.multiSelectItems.map(item => item.id);\n\n return {\n ...state,\n itemsLoading: false,\n recipientMenuItems: recipients.map(recipient =>\n createRecipientMenuItem(recipient, selectedIds)\n )\n };\n }\n case 'resetUnappliedState': {\n const postType =\n state.postType === 'private' && state.multiSelectItems.length === 0\n ? 'post'\n : state.postType;\n\n const searchValue = '';\n\n return {\n ...state,\n postType,\n searchValue\n };\n }\n default:\n return {\n ...state\n };\n }\n };\n const [state, dispatch] = useReducer(reducer, initialState);\n\n const onBlur = useCallback((): void => {\n setTimeout(() => {\n if (!document.activeElement?.closest(`#${menuPopoverId}`)) {\n dispatch({ type: 'setShowTypeMenu', payload: false });\n }\n }, 200);\n }, [menuPopoverId]);\n\n const handleKeydownToggle = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape' && state.showTypeMenu) dispatch({ type: 'toggleTypeMenu' });\n },\n [state.showTypeMenu]\n );\n\n useOuterEvent('mousedown', [typePopoverEl, typeMenuPopoverTarget], () => {\n dispatch({ type: 'setShowTypeMenu', payload: false });\n });\n\n useEffect(() => {\n if (reset) {\n dispatch({ type: 'reset' });\n onReset();\n }\n }, [reset]);\n\n useEffect(() => {\n dispatch({ type: 'updateRecipientMenuItems' });\n }, [recipients]);\n\n useEffect(() => {\n onSelectedRecipientsUpdate(\n state.multiSelectItems.map(item => ({\n id: item.id,\n primary: item.text,\n value: item.value\n }))\n );\n }, [state.multiSelectItems]);\n\n useEffect(() => {\n if (!state.showTypeMenu) {\n if (state.postType === 'private') {\n // Timeout to prevent flash of recipients options when closing menu.\n setTimeout(() => {\n dispatch({ type: 'setViewingRecipients', payload: true });\n }, 100);\n }\n\n setTimeout(() => {\n // Timeout to prevent flash of type menu when resetting postType on close\n dispatch({ type: 'resetUnappliedState' });\n }, 100);\n }\n }, [state.showTypeMenu]);\n\n useEffect(() => {\n if (multiSelectInputRef.current) {\n multiSelectInputRef.current?.focus();\n }\n }, [multiSelectInputRef.current]);\n\n useEffect(() => {\n if (state.postType === 'private') {\n if (!state.viewingRecipients) {\n toggleEl?.focus();\n } else {\n multiSelectInputRef.current?.focus();\n }\n }\n }, [state.viewingRecipients]);\n\n useAfterInitialEffect(() => {\n onSetPostType(state.postType);\n dispatch({ type: 'updateTypeMenuItems' });\n\n if (state.postType === 'private') {\n multiSelectInputRef.current?.focus();\n }\n }, [state.postType]);\n\n useEffect(() => {\n const interactionTimeout = setTimeout(() => {\n onRecipientSearch(state.searchValue);\n dispatch({ type: 'setItemsLoading', payload: true });\n dispatch({ type: 'setShowRecipientMenu', payload: !!state.searchValue.length });\n }, 300);\n\n return () => {\n clearTimeout(interactionTimeout);\n };\n }, [state.searchValue]);\n\n useEffect(() => {\n toggleEl?.addEventListener('keydown', handleKeydownToggle);\n\n return () => toggleEl?.removeEventListener('keydown', handleKeydownToggle);\n }, [toggleEl, state.showTypeMenu]);\n\n useEffect(() => {\n multiSelectInputRef.current?.addEventListener('keydown', handleKeydownToggle);\n\n return () => multiSelectInputRef.current?.removeEventListener('keydown', handleKeydownToggle);\n }, [multiSelectInputRef.current, state.showTypeMenu]);\n\n return (\n <div>\n <StyledTypeMenuToggle\n {...restProps}\n onClick={() => {\n dispatch({ type: 'toggleTypeMenu' });\n }}\n ref={setToggleEl}\n variant='link'\n aria-haspopup='menu'\n aria-expanded={state.showTypeMenu}\n onBlur={onBlur}\n >\n <span ref={setTypeMenuPopoverTarget}>{typeCopy[state.postType].primary}</span>\n <Icon name='arrow-micro-down' />\n </StyledTypeMenuToggle>\n\n {state.postType === 'private' && state.multiSelectItems.length > 0 && (\n <>\n <StyledRecipientCount\n ref={setRecipientCountEl}\n aria-describedby={`recipients-popover--${menuPopoverId}`}\n onMouseEnter={() => {\n if (!state.showTypeMenu) dispatch({ type: 'setShowCountPopover', payload: true });\n }}\n onFocus={() => dispatch({ type: 'setShowCountPopover', payload: true })}\n onMouseLeave={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n >{`${state.multiSelectItems.length}`}</StyledRecipientCount>\n\n <Popover\n show={state.showCountPopover}\n target={recipientCountEl}\n id={`recipients-popover--${menuPopoverId}`}\n onMouseEnter={() => {\n if (!state.showTypeMenu) dispatch({ type: 'setShowCountPopover', payload: true });\n }}\n onMouseLeave={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n arrow\n >\n <StyledCountBadgePopoverContent>\n {state.multiSelectItems.map((recipient: RecipientMultiSelectData) => {\n return (\n <p key={recipient.id}>\n <Text variant='primary'>{recipient.text}</Text>\n </p>\n );\n })}\n </StyledCountBadgePopoverContent>\n </Popover>\n </>\n )}\n\n <StyledPostTypePopover\n id={menuPopoverId}\n ref={setTypePopoverEl}\n target={typeMenuPopoverTarget}\n show={state.showTypeMenu}\n placement='bottom-start'\n >\n {(state.postType !== 'private' || !state.viewingRecipients) && (\n <Menu\n items={state.typeMenuItems}\n focusControlEl={toggleEl || undefined}\n mode='single-select'\n onItemClick={selectedId => {\n const postType = state.typeMenuItems.find(item => item.id === selectedId)!.value;\n dispatch({ type: 'setPostType', payload: postType });\n }}\n onItemExpand={() => {\n if (state.postType === 'private') {\n dispatch({ type: 'setViewingRecipients', payload: true });\n } else {\n dispatch({ type: 'setPostType', payload: 'private' });\n }\n }}\n />\n )}\n\n {state.postType === 'private' && state.viewingRecipients && (\n <StyledPostTypePopoverContent>\n <StyledRecipientMenuHeader>\n <Button\n as={StyledRecipientBackButton}\n variant='text'\n aria-label='close submenu'\n onClick={() => {\n dispatch({ type: 'setViewingRecipients', payload: false });\n }}\n onBlur={onBlur}\n >\n <Icon name='caret-left' />\n {typeCopy.private.primary}\n </Button>\n\n <StyledSelectedInputContainer>\n <MultiSelectInput\n ref={multiSelectInputRef}\n selected={state.multiSelectItems}\n onRemove={(selectedId: RecipientMultiSelectData['id']) => {\n dispatch({ type: 'removeRecipientViaMultiSelect', payload: selectedId });\n }}\n value={state.searchValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n dispatch({ type: 'setSearchValue', payload: e.target.value });\n }}\n onBlur={onBlur}\n />\n </StyledSelectedInputContainer>\n </StyledRecipientMenuHeader>\n\n {state.showRecipientMenu && (\n <StyledRecipientMenu\n loading={state.itemsLoading}\n focusControlEl={multiSelectInputRef.current}\n items={state.itemsLoading ? [] : state.recipientMenuItems}\n scrollAt={11}\n mode='action'\n emptyText='No items'\n onItemClick={(selectedId: RecipientMultiSelectData['id']) => {\n dispatch({ type: 'selectRecipientViaMenu', payload: selectedId });\n }}\n />\n )}\n </StyledPostTypePopoverContent>\n )}\n </StyledPostTypePopover>\n </div>\n );\n};\n\nexport default FeedNewPostTypeMenu;\n"]}