@pega/cosmos-react-social 2.0.0-dev.18.0 → 2.0.0-dev.20.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.
- package/lib/components/Chat/Chat.js +4 -4
- package/lib/components/Chat/Chat.js.map +1 -1
- package/lib/components/Chat/ChatBody.js +2 -2
- package/lib/components/Chat/ChatBody.js.map +1 -1
- package/lib/components/Chat/ChatComposer.js +12 -12
- package/lib/components/Chat/ChatComposer.js.map +1 -1
- package/lib/components/Chat/ChatHeader.js +3 -3
- package/lib/components/Chat/ChatHeader.js.map +1 -1
- package/lib/components/Chat/ChatTranscript.js +5 -5
- package/lib/components/Chat/ChatTranscript.js.map +1 -1
- package/lib/components/Chat/Message.js +13 -13
- package/lib/components/Chat/Message.js.map +1 -1
- package/lib/components/Chat/MessageList.js +7 -7
- package/lib/components/Chat/MessageList.js.map +1 -1
- package/lib/components/Chat/RepeatingView.js +5 -5
- package/lib/components/Chat/RepeatingView.js.map +1 -1
- package/lib/components/Chat/SuggestedReplyPicker.js +9 -9
- package/lib/components/Chat/SuggestedReplyPicker.js.map +1 -1
- package/lib/components/Chat/SystemMessage.js +2 -2
- package/lib/components/Chat/SystemMessage.js.map +1 -1
- package/lib/components/Chat/TranscriptMessage.js +3 -3
- package/lib/components/Chat/TranscriptMessage.js.map +1 -1
- package/lib/components/Chat/TypeIndicator.js +1 -1
- package/lib/components/Chat/TypeIndicator.js.map +1 -1
- package/lib/components/Email/Email.js +23 -23
- package/lib/components/Email/Email.js.map +1 -1
- package/lib/components/Email/Email.types.d.ts +26 -31
- package/lib/components/Email/Email.types.d.ts.map +1 -1
- package/lib/components/Email/Email.types.js.map +1 -1
- package/lib/components/Email/EmailComposer.d.ts +4 -4
- package/lib/components/Email/EmailComposer.d.ts.map +1 -1
- package/lib/components/Email/EmailComposer.js +132 -120
- package/lib/components/Email/EmailComposer.js.map +1 -1
- package/lib/components/Email/EmailConversation.js +5 -5
- package/lib/components/Email/EmailConversation.js.map +1 -1
- package/lib/components/Email/EmailEntity.d.ts.map +1 -1
- package/lib/components/Email/EmailEntity.js +10 -2
- package/lib/components/Email/EmailEntity.js.map +1 -1
- package/lib/components/Email/EmailSelector.d.ts +14 -0
- package/lib/components/Email/EmailSelector.d.ts.map +1 -0
- package/lib/components/Email/EmailSelector.js +62 -0
- package/lib/components/Email/EmailSelector.js.map +1 -0
- package/lib/components/Email/EmailShell.js +9 -9
- package/lib/components/Email/EmailShell.js.map +1 -1
- package/lib/components/Email/EmailSummaryItem.js +4 -4
- package/lib/components/Email/EmailSummaryItem.js.map +1 -1
- package/lib/components/Email/EmailSummaryList.js +7 -7
- package/lib/components/Email/EmailSummaryList.js.map +1 -1
- package/lib/components/Feed/Feed.js +5 -5
- package/lib/components/Feed/Feed.js.map +1 -1
- package/lib/components/Feed/FeedAttachments.js +4 -4
- package/lib/components/Feed/FeedAttachments.js.map +1 -1
- package/lib/components/Feed/FeedContent.js +1 -1
- package/lib/components/Feed/FeedContent.js.map +1 -1
- package/lib/components/Feed/FeedModalList.js +1 -1
- package/lib/components/Feed/FeedModalList.js.map +1 -1
- package/lib/components/Feed/FeedNewPost.js +4 -4
- package/lib/components/Feed/FeedNewPost.js.map +1 -1
- package/lib/components/Feed/FeedNewPostTypeMenu.js +9 -9
- package/lib/components/Feed/FeedNewPostTypeMenu.js.map +1 -1
- package/lib/components/Feed/FeedPost.d.ts.map +1 -1
- package/lib/components/Feed/FeedPost.js +26 -16
- package/lib/components/Feed/FeedPost.js.map +1 -1
- package/lib/components/Feed/FeedReply.d.ts.map +1 -1
- package/lib/components/Feed/FeedReply.js +18 -12
- package/lib/components/Feed/FeedReply.js.map +1 -1
- package/lib/components/Feed/FeedReplyInput.js +5 -5
- package/lib/components/Feed/FeedReplyInput.js.map +1 -1
- package/lib/components/Feed/FeedRichText.js +2 -2
- package/lib/components/Feed/FeedRichText.js.map +1 -1
- package/lib/components/HashtagButton/HashtagButton.js +1 -1
- package/lib/components/HashtagButton/HashtagButton.js.map +1 -1
- package/lib/components/MentionButton/MentionButton.d.ts.map +1 -1
- package/lib/components/MentionButton/MentionButton.js +1 -1
- package/lib/components/MentionButton/MentionButton.js.map +1 -1
- package/package.json +5 -5
- package/lib/components/Feed/utils.d.ts +0 -3
- package/lib/components/Feed/utils.d.ts.map +0 -1
- package/lib/components/Feed/utils.js +0 -19
- package/lib/components/Feed/utils.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Feed.js","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent, ReactNode, FC, useState, useRef, useEffect } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n defaultThemeProp,\n Flex,\n ForwardProps,\n Grid,\n Icon,\n registerIcon,\n Popover,\n Switch,\n Text,\n Progress,\n StyledProgressRing\n} from '@pega/cosmos-react-core';\nimport { useArrows, useElement, useI18n, useOuterEvent } from '@pega/cosmos-react-core/lib/hooks';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\nimport * as filterOnIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter-on.icon';\n\nimport { FeedContext, FeedContextValue } from './Feed.context';\nimport { StyledFeedNewPost } from './FeedNewPost';\nimport { StyledFeedPost } from './FeedPost';\nimport FeedButton from './FeedButton';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nexport interface Filter {\n /** Sets DOM id for the control and associates label element via 'for' attribute. */\n id: string;\n /** Pass a string or a fragment with an Icon and string for the filter label. */\n label: ReactNode;\n /**\n * Disables the filter.\n * @default false\n */\n disabled?: boolean;\n /**\n * Sets on prop via onFilterChange.\n * @default false\n */\n on?: boolean;\n}\nexport interface FeedProps {\n children: ReactNode;\n /** Title for the feed. */\n title?: string;\n /** Information related to the user of the Feed. */\n userInfo: FeedContextValue['userInfo'];\n /** A set of search types that can be used to determine which data set to conduct a mention search on. */\n searchTypes?: FeedContextValue['searchTypes'];\n /** A callback that runs when a decorator search has been run inside of the feed. */\n onDecoratorSearch?: FeedContextValue['onSearch'];\n /** Results that will be shown in a Popover for a mention or tag search. */\n searchResults?: FeedContextValue['searchResults'];\n /** A callback that is triggered when a mention is clicked. The callback sends back the id, text, and type of the mention. The callback should return a function component. */\n onMentionClick?: FeedContextValue['onMentionClick'];\n /** A callback that is triggered when a hashtag is clicked. The callback sends back the test of the tag. */\n onTagClick?: FeedContextValue['onTagClick'];\n /** A list of configuration objects used to render custom components within Feed posts and replies based off of a given regex pattern. */\n interactionRenderers?: FeedContextValue['interactionRenderers'];\n /** A mapping for various element types to render custom components for within posts. */\n markdownMap?: FeedContextValue['markdownMap'];\n /** A set of filters to apply to the Feed. */\n filters?: Filter[];\n /** A callback that runs when the filter is toggled. */\n onFilterChange?: (filterId: string, on: boolean) => void;\n /** A callback that is triggered when the bottom of the Feed is scrolled into view so that additional posts may be displayed. */\n onLoadMore?: () => void;\n}\n\nconst StyledFeed = styled.div(props => {\n return css`\n ${StyledFeedNewPost}:not(:last-child), ${StyledFeedPost}:not(:last-child) {\n margin-bottom: calc(2 * ${props.theme.base.spacing});\n }\n `;\n});\n\nStyledFeed.defaultProps = defaultThemeProp;\n\nconst StyledHeading = styled.div(props => {\n return css`\n margin: ${props.theme.base.spacing} 0;\n `;\n});\n\nStyledHeading.defaultProps = defaultThemeProp;\n\nconst StyledFilterMenu = styled.div(props => {\n return css`\n padding: calc(2 * ${props.theme.base.spacing});\n\n fieldset {\n border: none;\n }\n `;\n});\n\nStyledFilterMenu.defaultProps = defaultThemeProp;\n\nconst StyledFilterList = styled.ul`\n list-style-type: none;\n min-width: 10rem;\n`;\n\nStyledFilterList.defaultProps = defaultThemeProp;\n\nconst StyledLoadMore = styled.div<{ visible: boolean }>(({ theme, visible }) => {\n return css`\n ${visible &&\n css`\n margin-top: calc(2 * ${theme.base.spacing});\n `}\n\n ${StyledProgressRing} {\n min-height: 0;\n min-width: 0;\n\n ${visible &&\n css`\n min-height: 2rem;\n min-width: 2rem;\n `}\n }\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst Feed: FC<ForwardProps & FeedProps> = (props: ForwardProps & FeedProps) => {\n const {\n variant,\n children,\n userInfo,\n className,\n title,\n searchTypes,\n onDecoratorSearch,\n searchResults = [],\n onMentionClick,\n onTagClick,\n mentionContent,\n interactionRenderers = [],\n markdownMap,\n filters,\n onFilterChange,\n onLoadMore,\n ...restProps\n } = props;\n\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>();\n const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n const [loadMoreEl, setLoadMoreEl] = useElement<HTMLDivElement>();\n const [mountPopover, setMountPopover] = useState(false);\n const [feedOverflows, setFeedOverflows] = useState(false);\n const [showSearchResults, setShowSearchResults] = useState(false);\n const feedOverflowsRef = useRef(false);\n\n const filterRef = useRef(null);\n useArrows(filterRef);\n\n useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n setMountPopover(false);\n });\n\n const onKeydown = ({ key }: KeyboardEvent) => {\n if (key === 'Escape') setMountPopover(false);\n };\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n useEffect(() => {\n if (loadMoreEl) {\n const intersectionObserver = new IntersectionObserver(entries => {\n if (!entries[0].isIntersecting) {\n setFeedOverflows(true);\n feedOverflowsRef.current = true;\n } else if (entries[0].isIntersecting && feedOverflowsRef.current) {\n onLoadMore?.();\n }\n });\n\n intersectionObserver.observe(loadMoreEl);\n\n return () => {\n intersectionObserver.disconnect();\n };\n }\n }, [loadMoreEl, feedOverflowsRef.current]);\n\n const t = useI18n();\n\n return (\n <FeedContext.Provider\n value={{\n searchTypes,\n onSearch: e => {\n if (onDecoratorSearch) onDecoratorSearch(e);\n },\n searchResults,\n showSearchResults,\n setShowSearchResults,\n onMentionClick,\n onTagClick,\n interactionRenderers,\n markdownMap,\n userInfo\n }}\n >\n <StyledFeed {...restProps}>\n {(title || (filters && !!filters.length)) && (\n <Flex container={{ justify: 'between', alignItems: 'center' }} as={StyledHeading}>\n {title ? <Text variant='h2'>{title}</Text> : <div />}\n {filters && (\n <Button\n as={FeedButton}\n ref={setButtonEl}\n variant='simple'\n icon\n onClick={() => setMountPopover(curr => !curr)}\n label={`${title || ''} ${t('filters')}`}\n emphasized\n >\n <Icon\n name={\n filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)\n ? 'filter-on'\n : 'filter'\n }\n />\n </Button>\n )}\n </Flex>\n )}\n <Popover\n show={!!filters && mountPopover}\n ref={setPopoverEl}\n target={buttonEl}\n as={StyledFilterMenu}\n >\n <Flex container={{ direction: 'column', gap: 2 }} as='fieldset'>\n <Text variant='h3' as='legend'>\n {t('filters')}\n </Text>\n <Grid container={{ gap: 1 }} as={StyledFilterList} ref={filterRef}>\n {filters?.map(filter => {\n return (\n <li key={filter.id}>\n <Switch\n {...filter}\n onChange={(event: ChangeEvent<HTMLInputElement>) =>\n onFilterChange?.(event.target.id, event.target.checked)\n }\n />\n </li>\n );\n })}\n </Grid>\n </Flex>\n </Popover>\n\n <div>{children}</div>\n\n {onLoadMore && (\n <Flex\n ref={setLoadMoreEl}\n as={StyledLoadMore}\n visible={feedOverflows}\n container={{ justify: 'center' }}\n >\n <Progress placement='inline' />\n </Flex>\n )}\n </StyledFeed>\n </FeedContext.Provider>\n );\n};\n\nexport default Feed;\n"]}
|
|
1
|
+
{"version":3,"file":"Feed.js","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ChangeEvent, ReactNode, FC, useState, useRef, useEffect } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n defaultThemeProp,\n Flex,\n ForwardProps,\n Grid,\n Icon,\n registerIcon,\n Popover,\n Switch,\n Text,\n Progress,\n StyledProgressRing\n} from '@pega/cosmos-react-core';\nimport { useArrows, useElement, useI18n, useOuterEvent } from '@pega/cosmos-react-core/lib/hooks';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\nimport * as filterOnIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter-on.icon';\n\nimport { FeedContext, FeedContextValue } from './Feed.context';\nimport { StyledFeedNewPost } from './FeedNewPost';\nimport { StyledFeedPost } from './FeedPost';\nimport FeedButton from './FeedButton';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nexport interface Filter {\n /** Sets DOM id for the control and associates label element via 'for' attribute. */\n id: string;\n /** Pass a string or a fragment with an Icon and string for the filter label. */\n label: ReactNode;\n /**\n * Disables the filter.\n * @default false\n */\n disabled?: boolean;\n /**\n * Sets on prop via onFilterChange.\n * @default false\n */\n on?: boolean;\n}\nexport interface FeedProps {\n children: ReactNode;\n /** Title for the feed. */\n title?: string;\n /** Information related to the user of the Feed. */\n userInfo: FeedContextValue['userInfo'];\n /** A set of search types that can be used to determine which data set to conduct a mention search on. */\n searchTypes?: FeedContextValue['searchTypes'];\n /** A callback that runs when a decorator search has been run inside of the feed. */\n onDecoratorSearch?: FeedContextValue['onSearch'];\n /** Results that will be shown in a Popover for a mention or tag search. */\n searchResults?: FeedContextValue['searchResults'];\n /** A callback that is triggered when a mention is clicked. The callback sends back the id, text, and type of the mention. The callback should return a function component. */\n onMentionClick?: FeedContextValue['onMentionClick'];\n /** A callback that is triggered when a hashtag is clicked. The callback sends back the test of the tag. */\n onTagClick?: FeedContextValue['onTagClick'];\n /** A list of configuration objects used to render custom components within Feed posts and replies based off of a given regex pattern. */\n interactionRenderers?: FeedContextValue['interactionRenderers'];\n /** A mapping for various element types to render custom components for within posts. */\n markdownMap?: FeedContextValue['markdownMap'];\n /** A set of filters to apply to the Feed. */\n filters?: Filter[];\n /** A callback that runs when the filter is toggled. */\n onFilterChange?: (filterId: string, on: boolean) => void;\n /** A callback that is triggered when the bottom of the Feed is scrolled into view so that additional posts may be displayed. */\n onLoadMore?: () => void;\n}\n\nconst StyledFeed = styled.div(props => {\n return css`\n ${StyledFeedNewPost}:not(:last-child), ${StyledFeedPost}:not(:last-child) {\n margin-bottom: calc(2 * ${props.theme.base.spacing});\n }\n `;\n});\n\nStyledFeed.defaultProps = defaultThemeProp;\n\nconst StyledHeading = styled.div(props => {\n return css`\n margin: ${props.theme.base.spacing} 0;\n `;\n});\n\nStyledHeading.defaultProps = defaultThemeProp;\n\nconst StyledFilterMenu = styled.div(props => {\n return css`\n padding: calc(2 * ${props.theme.base.spacing});\n\n fieldset {\n border: none;\n }\n `;\n});\n\nStyledFilterMenu.defaultProps = defaultThemeProp;\n\nconst StyledFilterList = styled.ul`\n list-style-type: none;\n min-width: 10rem;\n`;\n\nStyledFilterList.defaultProps = defaultThemeProp;\n\nconst StyledLoadMore = styled.div<{ visible: boolean }>(({ theme, visible }) => {\n return css`\n ${visible &&\n css`\n margin-top: calc(2 * ${theme.base.spacing});\n `}\n\n ${StyledProgressRing} {\n min-height: 0;\n min-width: 0;\n\n ${visible &&\n css`\n min-height: 2rem;\n min-width: 2rem;\n `}\n }\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst Feed: FC<ForwardProps & FeedProps> = (props: ForwardProps & FeedProps) => {\n const {\n variant,\n children,\n userInfo,\n className,\n title,\n searchTypes,\n onDecoratorSearch,\n searchResults = [],\n onMentionClick,\n onTagClick,\n mentionContent,\n interactionRenderers = [],\n markdownMap,\n filters,\n onFilterChange,\n onLoadMore,\n ...restProps\n } = props;\n\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>();\n const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n const [loadMoreEl, setLoadMoreEl] = useElement<HTMLDivElement>();\n const [mountPopover, setMountPopover] = useState(false);\n const [feedOverflows, setFeedOverflows] = useState(false);\n const [showSearchResults, setShowSearchResults] = useState(false);\n const feedOverflowsRef = useRef(false);\n\n const filterRef = useRef(null);\n useArrows(filterRef);\n\n useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n setMountPopover(false);\n });\n\n const onKeydown = ({ key }: KeyboardEvent) => {\n if (key === 'Escape') setMountPopover(false);\n };\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n useEffect(() => {\n if (loadMoreEl) {\n const intersectionObserver = new IntersectionObserver(entries => {\n if (!entries[0].isIntersecting) {\n setFeedOverflows(true);\n feedOverflowsRef.current = true;\n } else if (entries[0].isIntersecting && feedOverflowsRef.current) {\n onLoadMore?.();\n }\n });\n\n intersectionObserver.observe(loadMoreEl);\n\n return () => {\n intersectionObserver.disconnect();\n };\n }\n }, [loadMoreEl, feedOverflowsRef.current]);\n\n const t = useI18n();\n\n return (\n <FeedContext.Provider\n value={{\n searchTypes,\n onSearch: e => {\n if (onDecoratorSearch) onDecoratorSearch(e);\n },\n searchResults,\n showSearchResults,\n setShowSearchResults,\n onMentionClick,\n onTagClick,\n interactionRenderers,\n markdownMap,\n userInfo\n }}\n >\n <StyledFeed {...restProps}>\n {(title || (filters && !!filters.length)) && (\n <Flex container={{ justify: 'between', alignItems: 'center' }} as={StyledHeading}>\n {title ? <Text variant='h2'>{title}</Text> : <div />}\n {filters && (\n <Button\n as={FeedButton}\n ref={setButtonEl}\n variant='simple'\n icon\n onClick={() => setMountPopover(curr => !curr)}\n label={`${title || ''} ${t('filters')}`}\n emphasized\n >\n <Icon\n name={\n filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)\n ? 'filter-on'\n : 'filter'\n }\n />\n </Button>\n )}\n </Flex>\n )}\n <Popover\n show={!!filters && mountPopover}\n ref={setPopoverEl}\n target={buttonEl}\n as={StyledFilterMenu}\n >\n <Flex container={{ direction: 'column', gap: 2 }} as='fieldset'>\n <Text variant='h3' as='legend'>\n {t('filters')}\n </Text>\n <Grid container={{ gap: 1 }} as={StyledFilterList} ref={filterRef}>\n {filters?.map(filter => {\n return (\n <li key={filter.id}>\n <Switch\n {...filter}\n onChange={(event: ChangeEvent<HTMLInputElement>) =>\n onFilterChange?.(event.target.id, event.target.checked)\n }\n />\n </li>\n );\n })}\n </Grid>\n </Flex>\n </Popover>\n\n <div>{children}</div>\n\n {onLoadMore && (\n <Flex\n ref={setLoadMoreEl}\n as={StyledLoadMore}\n visible={feedOverflows}\n container={{ justify: 'center' }}\n >\n <Progress placement='inline' />\n </Flex>\n )}\n </StyledFeed>\n </FeedContext.Provider>\n );\n};\n\nexport default Feed;\n"]}
|
|
@@ -17,13 +17,13 @@ export const StyledFeedAttachments = styled.ul(props => {
|
|
|
17
17
|
StyledFeedAttachments.defaultProps = defaultThemeProp;
|
|
18
18
|
const FeedAttachments = forwardRef((props, ref) => {
|
|
19
19
|
const { attachments } = props;
|
|
20
|
-
return attachments && !!attachments.length ? (_jsx(Grid,
|
|
20
|
+
return attachments && !!attachments.length ? (_jsx(Grid, { ref: ref, as: StyledFeedAttachments, container: {
|
|
21
21
|
cols: 'repeat(auto-fill, minmax(15rem, 1fr))',
|
|
22
22
|
gap: 1
|
|
23
|
-
}
|
|
23
|
+
}, children: Array.from(attachments).map(file => {
|
|
24
24
|
const { name, ...restProps } = file;
|
|
25
|
-
return _jsx(FileUploadItem,
|
|
26
|
-
}) }
|
|
25
|
+
return _jsx(FileUploadItem, { name: name, ...restProps }, file.lastModified);
|
|
26
|
+
}) }, void 0)) : null;
|
|
27
27
|
});
|
|
28
28
|
export default FeedAttachments;
|
|
29
29
|
//# sourceMappingURL=FeedAttachments.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedAttachments.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedAttachments.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAwB,MAAM,OAAO,CAAC;AAC7D,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,cAAc,EAEd,IAAI,EACJ,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AASjC,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE;IACrD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAExB,OAAO,GAAG,CAAA;cACE,KAAK,CAAC,IAAI,CAAC,OAAO;;;;0BAIN,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;;GAG/D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,eAAe,GAA6B,UAAU,CAC1D,CAAC,KAA4C,EAAE,GAAgC,EAAE,EAAE;IACjF,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAE9B,OAAO,WAAW,IAAI,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAC3C,KAAC,IAAI,
|
|
1
|
+
{"version":3,"file":"FeedAttachments.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedAttachments.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAwB,MAAM,OAAO,CAAC;AAC7D,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,cAAc,EAEd,IAAI,EACJ,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AASjC,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE;IACrD,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAExB,OAAO,GAAG,CAAA;cACE,KAAK,CAAC,IAAI,CAAC,OAAO;;;;0BAIN,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;;GAG/D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,eAAe,GAA6B,UAAU,CAC1D,CAAC,KAA4C,EAAE,GAAgC,EAAE,EAAE;IACjF,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAE9B,OAAO,WAAW,IAAI,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAC3C,KAAC,IAAI,IACH,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,qBAAqB,EACzB,SAAS,EAAE;YACT,IAAI,EAAE,uCAAuC;YAC7C,GAAG,EAAE,CAAC;SACP,YAEA,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAClC,MAAM,EAAE,IAAI,EAAE,GAAG,SAAS,EAAE,GAAG,IAAI,CAAC;YACpC,OAAO,KAAC,cAAc,IAAyB,IAAI,EAAE,IAAI,KAAM,SAAS,IAA5C,IAAI,CAAC,YAAY,CAA+B,CAAC;QAC/E,CAAC,CAAC,WACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CACF,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n FileUploadItem,\n FileUploadItemProps,\n Grid,\n defaultThemeProp\n} from '@pega/cosmos-react-core';\n\nexport type AttachedFiles = FileUploadItemProps & File;\n\ninterface FeedAttachmentsProps {\n attachments?: AttachedFiles[];\n ref?: Ref<HTMLUListElement>;\n}\n\nexport const StyledFeedAttachments = styled.ul(props => {\n const { theme } = props;\n\n return css`\n margin: ${theme.base.spacing} 0;\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\nconst FeedAttachments: FC<FeedAttachmentsProps> = forwardRef(\n (props: PropsWithoutRef<FeedAttachmentsProps>, ref: FeedAttachmentsProps['ref']) => {\n const { attachments } = props;\n\n return attachments && !!attachments.length ? (\n <Grid\n ref={ref}\n as={StyledFeedAttachments}\n container={{\n cols: 'repeat(auto-fill, minmax(15rem, 1fr))',\n gap: 1\n }}\n >\n {Array.from(attachments).map(file => {\n const { name, ...restProps } = file;\n return <FileUploadItem key={file.lastModified} name={name} {...restProps} />;\n })}\n </Grid>\n ) : null;\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,
|
|
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), [
|
|
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":";AAAA,OAAO,EAGL,UAAU,EACV,QAAQ,EACR,OAAO,EACP,MAAM,EACN,eAAe,EAGf,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,eAAe,CAAC,GAAG,EAAE;QACnB,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,
|
|
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 useLayoutEffect,\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 useLayoutEffect(() => {\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"]}
|
|
@@ -43,7 +43,7 @@ const FeedModalList = ({ count, heading, listItems, onLoadMore }) => {
|
|
|
43
43
|
};
|
|
44
44
|
}
|
|
45
45
|
}, [loadMoreEl, listOverflowsRef.current]);
|
|
46
|
-
return (_jsxs(Modal,
|
|
46
|
+
return (_jsxs(Modal, { heading: _jsxs(Flex, { container: { gap: 1 }, children: [heading, _jsx(Flex, { item: { alignSelf: 'center' }, as: Count, children: count }, void 0)] }, void 0), children: [_jsx(SummaryListItems, { items: listItems }, void 0), onLoadMore && (_jsx(Flex, { ref: setLoadMoreEl, as: StyledLoadMore, visible: listOverflows, container: { justify: 'center' }, children: _jsx(Progress, { placement: 'inline' }, void 0) }, void 0))] }, void 0));
|
|
47
47
|
};
|
|
48
48
|
export default FeedModalList;
|
|
49
49
|
//# sourceMappingURL=FeedModalList.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedModalList.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedModalList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,SAAS,EAAE,MAAM,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,UAAU,EACV,kBAAkB,EAClB,KAAK,EACL,KAAK,EACL,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAajC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAuB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IAC7E,OAAO,GAAG,CAAA;MACN,OAAO;QACT,GAAG,CAAA;6BACsB,KAAK,CAAC,IAAI,CAAC,OAAO;KAC1C;;MAEC,kBAAkB;;;;QAIhB,OAAO;QACT,GAAG,CAAA;;;OAGF;;GAEJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,aAAa,GAA2B,CAAC,EAC7C,KAAK,EACL,OAAO,EACP,SAAS,EACT,UAAU,EACS,EAAE,EAAE;IACvB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAkB,CAAC;IACjE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAEvC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,EAAE;YACd,MAAM,oBAAoB,GAAG,IAAI,oBAAoB,CAAC,OAAO,CAAC,EAAE;gBAC9D,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,cAAc,EAAE;oBAC9B,gBAAgB,CAAC,IAAI,CAAC,CAAC;oBACvB,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAC;iBACjC;qBAAM,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,cAAc,IAAI,gBAAgB,CAAC,OAAO,EAAE;oBAChE,UAAU,EAAE,EAAE,CAAC;iBAChB;YACH,CAAC,CAAC,CAAC;YAEH,oBAAoB,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;YAEzC,OAAO,GAAG,EAAE;gBACV,oBAAoB,CAAC,UAAU,EAAE,CAAC;YACpC,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3C,OAAO,CACL,MAAC,KAAK,
|
|
1
|
+
{"version":3,"file":"FeedModalList.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedModalList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,SAAS,EAAE,MAAM,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,UAAU,EACV,kBAAkB,EAClB,KAAK,EACL,KAAK,EACL,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAajC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAuB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IAC7E,OAAO,GAAG,CAAA;MACN,OAAO;QACT,GAAG,CAAA;6BACsB,KAAK,CAAC,IAAI,CAAC,OAAO;KAC1C;;MAEC,kBAAkB;;;;QAIhB,OAAO;QACT,GAAG,CAAA;;;OAGF;;GAEJ,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,aAAa,GAA2B,CAAC,EAC7C,KAAK,EACL,OAAO,EACP,SAAS,EACT,UAAU,EACS,EAAE,EAAE;IACvB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAkB,CAAC;IACjE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1D,MAAM,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAEvC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,EAAE;YACd,MAAM,oBAAoB,GAAG,IAAI,oBAAoB,CAAC,OAAO,CAAC,EAAE;gBAC9D,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,cAAc,EAAE;oBAC9B,gBAAgB,CAAC,IAAI,CAAC,CAAC;oBACvB,gBAAgB,CAAC,OAAO,GAAG,IAAI,CAAC;iBACjC;qBAAM,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,cAAc,IAAI,gBAAgB,CAAC,OAAO,EAAE;oBAChE,UAAU,EAAE,EAAE,CAAC;iBAChB;YACH,CAAC,CAAC,CAAC;YAEH,oBAAoB,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;YAEzC,OAAO,GAAG,EAAE;gBACV,oBAAoB,CAAC,UAAU,EAAE,CAAC;YACpC,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC;IAE3C,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,aAGT,KAAC,gBAAgB,IAAC,KAAK,EAAE,SAAS,WAAI,EAErC,UAAU,IAAI,CACb,KAAC,IAAI,IACH,GAAG,EAAE,aAAa,EAClB,EAAE,EAAE,cAAc,EAClB,OAAO,EAAE,aAAa,EACtB,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YAEhC,KAAC,QAAQ,IAAC,SAAS,EAAC,QAAQ,WAAG,WAC1B,CACR,YACK,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { FC, useEffect, useRef, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryListItem,\n defaultThemeProp,\n Flex,\n Progress,\n useElement,\n StyledProgressRing,\n Count,\n Modal,\n SummaryListItems\n} from '@pega/cosmos-react-core';\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}\n\nconst StyledLoadMore = styled.div<{ visible: boolean }>(({ theme, visible }) => {\n return css`\n ${visible &&\n css`\n margin-top: calc(2 * ${theme.base.spacing});\n `}\n\n ${StyledProgressRing} {\n min-height: 0;\n min-width: 0;\n\n ${visible &&\n css`\n min-height: 2rem;\n min-width: 2rem;\n `}\n }\n `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst FeedModalList: FC<FeedModalListProps> = ({\n count,\n heading,\n listItems,\n onLoadMore\n}: FeedModalListProps) => {\n const [loadMoreEl, setLoadMoreEl] = useElement<HTMLDivElement>();\n const [listOverflows, setListOverflows] = useState(false);\n const listOverflowsRef = useRef(false);\n\n useEffect(() => {\n if (loadMoreEl) {\n const intersectionObserver = new IntersectionObserver(entries => {\n if (!entries[0].isIntersecting) {\n setListOverflows(true);\n listOverflowsRef.current = true;\n } else if (entries[0].isIntersecting && listOverflowsRef.current) {\n onLoadMore?.();\n }\n });\n\n intersectionObserver.observe(loadMoreEl);\n\n return () => {\n intersectionObserver.disconnect();\n };\n }\n }, [loadMoreEl, listOverflowsRef.current]);\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 >\n <SummaryListItems items={listItems} />\n\n {onLoadMore && (\n <Flex\n ref={setLoadMoreEl}\n as={StyledLoadMore}\n visible={listOverflows}\n container={{ justify: 'center' }}\n >\n <Progress placement='inline' />\n </Flex>\n )}\n </Modal>\n );\n};\n\nexport default FeedModalList;\n"]}
|
|
@@ -88,13 +88,13 @@ const FeedNewPost = (props) => {
|
|
|
88
88
|
setSelectedRecipients([]);
|
|
89
89
|
}
|
|
90
90
|
}, [postType]);
|
|
91
|
-
return (_jsx(StyledCard,
|
|
91
|
+
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(StyledTextAreaOverflow, { ref: textAreaRef, children: _jsx(FeedRichText, { label: t('feed_new_post'), labelHidden: true, onChange: () => {
|
|
92
92
|
setEmptyText(rteRef.current?.getPlainText().trim() === '');
|
|
93
93
|
resizeTextArea();
|
|
94
|
-
}, placeholder: textAreaPlaceholder, autoFocus: autoFocus, onSubmit: handlePost, onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false), ref: rteRef }, void 0) }
|
|
94
|
+
}, 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'), children: _jsx(Icon, { name: 'times' }, void 0) }, void 0)), onFilesAdded && (_jsx(Button, { variant: 'simple', as: FeedButton, onClick: () => {
|
|
95
95
|
setShowSearchResults?.(false);
|
|
96
96
|
attachmentEl?.click();
|
|
97
|
-
}, icon: true, label: t('attachment')
|
|
97
|
+
}, icon: true, label: t('attachment'), children: _jsx(Icon, { name: 'paper-clip' }, void 0) }, void 0))] }, void 0), _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,
|
|
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));
|
|
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":"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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 useAutoResize,\n useElement,\n useOuterEvent,\n ForwardProps,\n useI18n,\n ExpandCollapse,\n useAfterInitialEffect\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 StyledTextAreaOverflow = styled.div(({ theme }) => {\n return css`\n overflow-y: hidden;\n margin-top: ${theme.base.spacing};\n min-height: 1rem;\n width: 100%;\n\n ${StyledRichTextEditor} {\n &:focus-within {\n box-shadow: none;\n }\n }\n `;\n});\n\nStyledTextAreaOverflow.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 const [textAreaRef, resizeTextArea] = useAutoResize<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 };\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 <StyledTextAreaOverflow ref={textAreaRef}>\n <FeedRichText\n label={t('feed_new_post')}\n labelHidden\n onChange={() => {\n setEmptyText(rteRef.current?.getPlainText().trim() === '');\n resizeTextArea();\n }}\n placeholder={textAreaPlaceholder}\n autoFocus={autoFocus}\n onSubmit={handlePost}\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n ref={rteRef}\n />\n </StyledTextAreaOverflow>\n\n {!emptyText && (\n <Button\n variant='simple'\n as={FeedButton}\n onClick={handleClear}\n icon\n label={t('feed_cancel_conversation')}\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={t('attachment')}\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 useAutoResize,\n useElement,\n useOuterEvent,\n ForwardProps,\n useI18n,\n ExpandCollapse,\n useAfterInitialEffect\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 StyledTextAreaOverflow = styled.div(({ theme }) => {\n return css`\n overflow-y: hidden;\n margin-top: ${theme.base.spacing};\n min-height: 1rem;\n width: 100%;\n\n ${StyledRichTextEditor} {\n &:focus-within {\n box-shadow: none;\n }\n }\n `;\n});\n\nStyledTextAreaOverflow.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 const [textAreaRef, resizeTextArea] = useAutoResize<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 };\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 <StyledTextAreaOverflow ref={textAreaRef}>\n <FeedRichText\n label={t('feed_new_post')}\n labelHidden\n onChange={() => {\n setEmptyText(rteRef.current?.getPlainText().trim() === '');\n resizeTextArea();\n }}\n placeholder={textAreaPlaceholder}\n autoFocus={autoFocus}\n onSubmit={handlePost}\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n ref={rteRef}\n />\n </StyledTextAreaOverflow>\n\n {!emptyText && (\n <Button\n variant='simple'\n as={FeedButton}\n onClick={handleClear}\n icon\n label={t('feed_cancel_conversation')}\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={t('attachment')}\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"]}
|
|
@@ -357,17 +357,17 @@ const FeedNewPostTypeMenu = ({ recipients, onSetPostType, onSelectedRecipientsUp
|
|
|
357
357
|
multiSelectInputRef.current?.addEventListener('keydown', handleKeydownToggle);
|
|
358
358
|
return () => multiSelectInputRef.current?.removeEventListener('keydown', handleKeydownToggle);
|
|
359
359
|
}, [multiSelectInputRef.current, state.showTypeMenu]);
|
|
360
|
-
return (_jsxs("div", { children: [_jsxs(StyledTypeMenuToggle,
|
|
360
|
+
return (_jsxs("div", { children: [_jsxs(StyledTypeMenuToggle, { onClick: () => {
|
|
361
361
|
dispatch({ type: 'toggleTypeMenu' });
|
|
362
|
-
}, ref: setToggleEl, variant: 'link', "aria-haspopup": 'menu', "aria-expanded": state.showTypeMenu
|
|
362
|
+
}, ref: setToggleEl, variant: 'link', "aria-haspopup": 'menu', "aria-expanded": state.showTypeMenu, 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', onMouseEnter: () => {
|
|
363
363
|
if (!state.showTypeMenu)
|
|
364
364
|
dispatch({ type: 'setShowCountPopover', payload: true });
|
|
365
|
-
}, onFocus: () => dispatch({ type: 'setShowCountPopover', payload: true }), onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), onBlur: () => dispatch({ type: 'setShowCountPopover', payload: false })
|
|
365
|
+
}, onFocus: () => dispatch({ type: 'setShowCountPopover', payload: true }), onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), onBlur: () => dispatch({ type: 'setShowCountPopover', payload: false }), children: `${state.multiSelectItems.length}` }, void 0), _jsx(Popover, { show: state.showCountPopover, target: recipientCountEl, id: 'recipients-popover', onMouseEnter: () => {
|
|
366
366
|
if (!state.showTypeMenu)
|
|
367
367
|
dispatch({ type: 'setShowCountPopover', payload: true });
|
|
368
|
-
}, onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), arrow: true
|
|
369
|
-
return (_jsx("p", { children: _jsx(Text,
|
|
370
|
-
}) }, void 0) }
|
|
368
|
+
}, onMouseLeave: () => dispatch({ type: 'setShowCountPopover', payload: false }), arrow: true, children: _jsx(StyledPopoverContent, { children: state.multiSelectItems.map((recipient) => {
|
|
369
|
+
return (_jsx("p", { children: _jsx(Text, { variant: 'primary', children: recipient.text }, void 0) }, recipient.id));
|
|
370
|
+
}) }, 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 => {
|
|
371
371
|
const postType = state.typeMenuItems.find(item => item.id === selectedId).value;
|
|
372
372
|
dispatch({ type: 'setPostType', payload: postType });
|
|
373
373
|
}, onItemExpand: () => {
|
|
@@ -377,15 +377,15 @@ const FeedNewPostTypeMenu = ({ recipients, onSetPostType, onSelectedRecipientsUp
|
|
|
377
377
|
else {
|
|
378
378
|
dispatch({ type: 'setPostType', payload: 'private' });
|
|
379
379
|
}
|
|
380
|
-
}, onBlur: onBlur }, void 0)), state.postType === 'private' && state.viewingRecipients && (_jsxs(_Fragment, { children: [_jsxs(StyledRecipientMenuHeader, { children: [_jsxs(Button,
|
|
380
|
+
}, onBlur: onBlur }, void 0)), state.postType === 'private' && state.viewingRecipients && (_jsxs(_Fragment, { children: [_jsxs(StyledRecipientMenuHeader, { children: [_jsxs(Button, { as: StyledRecipientBackButton, variant: 'text', "aria-label": 'close submenu', onClick: () => {
|
|
381
381
|
dispatch({ type: 'setViewingRecipients', payload: false });
|
|
382
|
-
}, onBlur: onBlur
|
|
382
|
+
}, onBlur: onBlur, children: [_jsx(Icon, { name: 'caret-left' }, void 0), typeCopy.private.primary] }, void 0), _jsx(StyledSelectedInputContainer, { children: _jsx(StyledMultiSelect, { ref: multiSelectInputRef, selected: state.multiSelectItems, onRemove: (selectedId) => {
|
|
383
383
|
dispatch({ type: 'removeRecipientViaMultiSelect', payload: selectedId });
|
|
384
384
|
}, value: state.searchValue, onChange: (e) => {
|
|
385
385
|
dispatch({ type: 'setSearchValue', payload: e.target.value });
|
|
386
386
|
} }, 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) => {
|
|
387
387
|
dispatch({ type: 'selectRecipientViaMenu', payload: selectedId });
|
|
388
|
-
}, onBlur: onBlur }, void 0))] }, void 0))] }
|
|
388
|
+
}, onBlur: onBlur }, void 0))] }, void 0))] }, void 0)] }, void 0));
|
|
389
389
|
};
|
|
390
390
|
export default FeedNewPostTypeMenu;
|
|
391
391
|
//# sourceMappingURL=FeedNewPostTypeMenu.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedNewPostTypeMenu.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedNewPostTypeMenu.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAe,MAAM,OAAO,CAAC;AACzF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,MAAM,EACN,IAAI,EACJ,aAAa,EACb,cAAc,EACd,IAAI,EACJ,UAAU,EACV,UAAU,EACV,aAAa,EACb,OAAO,EACP,IAAI,EACJ,MAAM,EACN,gBAAgB,EAChB,SAAS,EACT,qBAAqB,EACtB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,yDAAyD,CAAC;AAC/F,OAAO,gBAAgB,MAAM,mFAAmF,CAAC;AAuDjH,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACpD,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;eACG,OAAO;;;uBAGC,OAAO;;GAE3B,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;;+BAEmB,OAAO;GACnC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,iBAAiB,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC,GAAG,EAAE;IACtD,OAAO,GAAG,CAAA;;;;GAIT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,4BAA4B,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC5D,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;cACE,OAAO,aAAa,OAAO,cAAc,OAAO;GAC3D,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,4BAA4B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7D,MAAM,yBAAyB,GAAG,MAAM,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,MAAM,EACJ,IAAI,EAAE,EACJ,aAAa,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,EAC1C,OAAO,EACR,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;mBACO,UAAU;eACd,OAAO,aAAa,OAAO;;;;;;;SAOjC,UAAU;;2BAEQ,OAAO;;GAE/B,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE1D,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAE/C,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;cACE,OAAO;GAClB,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,mBAAmB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACrD,MAAM,EACJ,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;MACN,cAAc;iBACH,OAAO,aAAa,OAAO;;GAEzC,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,qBAAqB,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1D,MAAM,EACJ,IAAI,EAAE,EACJ,aAAa,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,EACtC,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;MACN,aAAa;qBACE,UAAU;;GAE5B,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,QAAQ,GAAG;IACf,IAAI,EAAE;QACJ,OAAO,EAAE,aAAa;KACvB;IACD,OAAO,EAAE;QACP,OAAO,EAAE,cAAc;KACxB;CACF,CAAC;AAEF,MAAM,uBAAuB,GAAG,CAC9B,SAA0B,EAC1B,WAAuC,EACvC,EAAE;IACF,MAAM,QAAQ,GAAG,WAAW,IAAI,EAAE,CAAC;IACnC,MAAM,EAAE,GAAG,UAAU,SAAS,CAAC,KAAK,EAAE,CAAC;IAEvC,OAAO;QACL,GAAG,SAAS;QACZ,EAAE;QACF,QAAQ,EAAE,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;KAChC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,IAAc,EAAsC,EAAE;IAC9E,OAAO;QACL;YACE,EAAE,EAAE,GAAG;YACP,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,OAAO;YAC9B,QAAQ,EAAE,IAAI,KAAK,MAAM;YACzB,KAAK,EAAE,MAAM;SACd;QACD;YACE,EAAE,EAAE,GAAG;YACP,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,OAAO;YACjC,QAAQ,EAAE,IAAI,KAAK,SAAS;YAC5B,KAAK,EAAE,SAAS;SACjB;KACF,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAsB;IACtC,QAAQ,EAAE,MAAM;IAChB,YAAY,EAAE,KAAK;IACnB,YAAY,EAAE,KAAK;IACnB,iBAAiB,EAAE,KAAK;IACxB,iBAAiB,EAAE,KAAK;IACxB,gBAAgB,EAAE,KAAK;IACvB,WAAW,EAAE,EAAE;IACf,aAAa,EAAE,gBAAgB,CAAC,MAAM,CAAC;IACvC,kBAAkB,EAAE,EAAyB;IAC7C,gBAAgB,EAAE,EAAgC;CACnD,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,EAC3B,UAAU,EACV,aAAa,EACb,0BAA0B,EAC1B,iBAAiB,EACjB,KAAK,EACL,OAAO,EACW,EAAE,EAAE;IACtB,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,EAAE,EAAE,CAAC,CAAC;IAErD,MAAM,mBAAmB,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC3D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,UAAU,EAAqB,CAAC;IAChE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,UAAU,EAAe,CAAC;IAC1E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,UAAU,CAAc,IAAI,CAAC,CAAC;IACxE,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,UAAU,CAAoB,IAAI,CAAC,CAAC;IAE9F,MAAM,OAAO,GAAG,CACd,KAAwB,EACxB,MAiBC,EACkB,EAAE;QACrB,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC;QACzB,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;QAE/B,QAAQ,IAAI,EAAE;YACZ,KAAK,OAAO,CAAC,CAAC;gBACZ,OAAO,YAAY,CAAC;aACrB;YACD,KAAK,aAAa,CAAC,CAAC;gBAClB,MAAM,QAAQ,GAAG,OAAO,CAAC;gBACzB,MAAM,eAAe,GAAG,QAAQ,KAAK,SAAS,CAAC;gBAE/C,OAAO;oBACL,GAAG,KAAK;oBACR,QAAQ;oBACR,YAAY,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,YAAY;oBAC3D,iBAAiB,EAAE,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,iBAAiB;oBACnE,gBAAgB,EAAE,YAAY,CAAC,gBAAgB;oBAC/C,WAAW,EAAE,YAAY,CAAC,WAAW;iBACtC,CAAC;aACH;YACD,KAAK,iBAAiB,CAAC,CAAC;gBACtB,OAAO;oBACL,GAAG,KAAK;oBACR,YAAY,EAAE,OAAO;iBACtB,CAAC;aACH;YACD,KAAK,sBAAsB,CAAC,CAAC;gBAC3B,OAAO;oBACL,GAAG,KAAK;oBACR,iBAAiB,EAAE,OAAO;iBAC3B,CAAC;aACH;YACD,KAAK,gBAAgB,CAAC,CAAC;gBACrB,OAAO;oBACL,GAAG,KAAK;oBACR,WAAW,EAAE,OAAO;iBACrB,CAAC;aACH;YACD,KAAK,sBAAsB,CAAC,CAAC;gBAC3B,OAAO;oBACL,GAAG,KAAK;oBACR,iBAAiB,EAAE,OAAO;iBAC3B,CAAC;aACH;YACD,KAAK,qBAAqB,CAAC,CAAC;gBAC1B,OAAO;oBACL,GAAG,KAAK;oBACR,gBAAgB,EAAE,OAAO;iBAC1B,CAAC;aACH;YACD,KAAK,iBAAiB,CAAC,CAAC;gBACtB,OAAO;oBACL,GAAG,KAAK;oBACR,YAAY,EAAE,OAAO;iBACtB,CAAC;aACH;YACD,KAAK,qBAAqB,CAAC,CAAC;gBAC1B,OAAO;oBACL,GAAG,KAAK;oBACR,aAAa,EAAE,gBAAgB,CAAC,KAAK,CAAC,QAAQ,CAAC;iBAChD,CAAC;aACH;YACD,KAAK,gBAAgB,CAAC,CAAC;gBACrB,OAAO;oBACL,GAAG,KAAK;oBACR,YAAY,EAAE,CAAC,KAAK,CAAC,YAAY;oBACjC,gBAAgB,EAAE,KAAK;iBACxB,CAAC;aACH;YACD,KAAK,+BAA+B,CAAC,CAAC;gBACpC,MAAM,UAAU,GAAG,OAAO,CAAC;gBAE3B,MAAM,gBAAgB,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CACpD,CAAC,GAAG,EAAE,SAAS,EAAE,EAAE;oBACjB,IAAI,SAAS,CAAC,EAAE,KAAK,UAAU;wBAAE,OAAO,GAAG,CAAC;oBAE5C,OAAO,GAAG,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;gBACjC,CAAC,EACD,EAAE,CACH,CAAC;gBAEF,MAAM,kBAAkB,GAAG,KAAK,CAAC,kBAAkB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBAC7D,IAAI,IAAI,CAAC,EAAE,KAAK,UAAU,EAAE;wBAC1B,OAAO;4BACL,GAAG,IAAI;4BACP,QAAQ,EAAE,KAAK;yBAChB,CAAC;qBACH;oBAED,OAAO;wBACL,GAAG,IAAI;qBACR,CAAC;gBACJ,CAAC,CAAC,CAAC;gBAEH,OAAO;oBACL,GAAG,KAAK;oBACR,gBAAgB;oBAChB,kBAAkB;iBACnB,CAAC;aACH;YACD,KAAK,wBAAwB,CAAC,CAAC;gBAC7B,MAAM,UAAU,GAAG,OAAO,CAAC;gBAE3B,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,UAAU,CAAC,EAAE;oBAChE,MAAM,gBAAgB,GAAG,KAAK,CAAC,kBAAkB,CAAC,MAAM,CACtD,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,UAAU,CAC/B,CAAC,CAAC,CAAC,CAAC;oBAEL,MAAM,gBAAgB,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC;wBACrD;4BACE,IAAI,EAAE,gBAAgB,CAAC,OAAO;4BAC9B,EAAE,EAAE,gBAAgB,CAAC,EAAE;4BACvB,KAAK,EAAE,gBAAgB,CAAC,KAAK;yBAC9B;qBACF,CAAC,CAAC;oBAEH,OAAO;wBACL,GAAG,KAAK;wBACR,gBAAgB;wBAChB,WAAW,EAAE,EAAE;qBAChB,CAAC;iBACH;gBAED,OAAO;oBACL,GAAG,KAAK;oBACR,WAAW,EAAE,EAAE;iBAChB,CAAC;aACH;YACD,KAAK,0BAA0B,CAAC,CAAC;gBAC/B,MAAM,WAAW,GAAG,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gBAEhE,OAAO;oBACL,GAAG,KAAK;oBACR,YAAY,EAAE,KAAK;oBACnB,kBAAkB,EAAE,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAC7C,uBAAuB,CAAC,SAAS,EAAE,WAAW,CAAC,CAChD;iBACF,CAAC;aACH;YACD,KAAK,qBAAqB,CAAC,CAAC;gBAC1B,MAAM,QAAQ,GACZ,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,KAAK,CAAC,gBAAgB,CAAC,MAAM,KAAK,CAAC;oBACjE,CAAC,CAAC,MAAM;oBACR,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC;gBAErB,MAAM,WAAW,GAAG,EAAE,CAAC;gBAEvB,OAAO;oBACL,GAAG,KAAK;oBACR,QAAQ;oBACR,WAAW;iBACZ,CAAC;aACH;YACD;gBACE,OAAO;oBACL,GAAG,KAAK;iBACT,CAAC;SACL;IACH,CAAC,CAAC;IACF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;IAE5D,MAAM,MAAM,GAAG,WAAW,CAAC,GAAS,EAAE;QACpC,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC,IAAI,aAAa,EAAE,CAAC,EAAE;gBACzD,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;aACvD;QACH,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,mBAAmB,GAAG,WAAW,CACrC,CAAC,CAAgB,EAAE,EAAE;QACnB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,YAAY;YAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,gBAAgB,EAAE,CAAC,CAAC;IACrF,CAAC,EACD,CAAC,KAAK,CAAC,YAAY,CAAC,CACrB,CAAC;IAEF,aAAa,CAAC,WAAW,EAAE,CAAC,aAAa,EAAE,qBAAqB,CAAC,EAAE,GAAG,EAAE;QACtE,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IACxD,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,EAAE;YACT,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;YAC5B,OAAO,EAAE,CAAC;SACX;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,EAAE,IAAI,EAAE,0BAA0B,EAAE,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,SAAS,CAAC,GAAG,EAAE;QACb,0BAA0B,CACxB,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAClC,EAAE,EAAE,IAAI,CAAC,EAAE;YACX,OAAO,EAAE,IAAI,CAAC,IAAI;YAClB,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC,CACJ,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAE7B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE;YACvB,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE;gBAChC,oEAAoE;gBACpE,UAAU,CAAC,GAAG,EAAE;oBACd,QAAQ,CAAC,EAAE,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;gBAC5D,CAAC,EAAE,GAAG,CAAC,CAAC;aACT;YAED,UAAU,CAAC,GAAG,EAAE;gBACd,yEAAyE;gBACzE,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,CAAC,CAAC;YAC5C,CAAC,EAAE,GAAG,CAAC,CAAC;SACT;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,mBAAmB,CAAC,OAAO,EAAE;YAC/B,mBAAmB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;SACtC;IACH,CAAC,EAAE,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC;IAElC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE;YAChC,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE;gBAC5B,QAAQ,EAAE,KAAK,EAAE,CAAC;aACnB;iBAAM;gBACL,mBAAmB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;aACtC;SACF;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAE9B,qBAAqB,CAAC,GAAG,EAAE;QACzB,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC9B,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,CAAC,CAAC;QAE1C,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE;YAChC,mBAAmB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;SACtC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAErB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,kBAAkB,GAAG,UAAU,CAAC,GAAG,EAAE;YACzC,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;YACrC,QAAQ,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YACrD,QAAQ,CAAC,EAAE,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC,CAAC;QAClF,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,kBAAkB,CAAC,CAAC;QACnC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC;IAExB,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,EAAE,gBAAgB,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAC;QAE3D,OAAO,GAAG,EAAE,CAAC,QAAQ,EAAE,mBAAmB,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAC;IAC7E,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnC,SAAS,CAAC,GAAG,EAAE;QACb,mBAAmB,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAC;QAE9E,OAAO,GAAG,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,mBAAmB,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAC;IAChG,CAAC,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC;IAEtD,OAAO,CACL,0BACE,MAAC,oBAAoB,kBACnB,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,EAAE,IAAI,EAAE,gBAAgB,EAAE,CAAC,CAAC;gBACvC,CAAC,EACD,GAAG,EAAE,WAAW,EAChB,OAAO,EAAC,MAAM,mBACA,MAAM,mBACL,KAAK,CAAC,YAAY,iBAEjC,6BAAM,GAAG,EAAE,wBAAwB,gBAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,OAAO,YAAQ,EAC9E,KAAC,IAAI,IAAC,IAAI,EAAC,kBAAkB,WAAG,aACX,EAEtB,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,KAAK,CAAC,gBAAgB,CAAC,MAAM,GAAG,CAAC,IAAI,CACpE,8BACE,KAAC,oBAAoB,kBACnB,GAAG,EAAE,mBAAmB,sBACP,oBAAoB,EACrC,YAAY,EAAE,GAAG,EAAE;4BACjB,IAAI,CAAC,KAAK,CAAC,YAAY;gCAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;wBACpF,CAAC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EACvE,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAC7E,MAAM,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,gBACvE,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE,YAAwB,EAE5D,KAAC,OAAO,kBACN,IAAI,EAAE,KAAK,CAAC,gBAAgB,EAC5B,MAAM,EAAE,gBAAgB,EACxB,EAAE,EAAC,oBAAoB,EACvB,YAAY,EAAE,GAAG,EAAE;4BACjB,IAAI,CAAC,KAAK,CAAC,YAAY;gCAAE,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;wBACpF,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,qBAAqB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAC7E,KAAK,sBAEL,KAAC,oBAAoB,cAClB,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,SAAmC,EAAE,EAAE;gCAClE,OAAO,CACL,sBACE,KAAC,IAAI,kBAAC,OAAO,EAAC,SAAS,gBAAE,SAAS,CAAC,IAAI,YAAQ,IADzC,SAAS,CAAC,EAAE,CAEhB,CACL,CAAC;4BACJ,CAAC,CAAC,WACmB,YACf,YACT,CACJ,EAED,MAAC,qBAAqB,kBACpB,EAAE,EAAE,aAAa,EACjB,GAAG,EAAE,gBAAgB,EACrB,MAAM,EAAE,qBAAqB,EAC7B,IAAI,EAAE,KAAK,CAAC,YAAY,EACxB,SAAS,EAAC,cAAc,iBAEvB,CAAC,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAC7D,KAAC,IAAI,IACH,KAAK,EAAE,KAAK,CAAC,aAAa,EAC1B,cAAc,EAAE,QAAQ,IAAI,SAAS,EACrC,IAAI,EAAC,eAAe,EACpB,WAAW,EAAE,UAAU,CAAC,EAAE;4BACxB,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,UAAU,CAAE,CAAC,KAAK,CAAC;4BACjF,QAAQ,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC;wBACvD,CAAC,EACD,YAAY,EAAE,GAAG,EAAE;4BACjB,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,EAAE;gCAChC,QAAQ,CAAC,EAAE,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;6BAC3D;iCAAM;gCACL,QAAQ,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC;6BACvD;wBACH,CAAC,EACD,MAAM,EAAE,MAAM,WACd,CACH,EAEA,KAAK,CAAC,QAAQ,KAAK,SAAS,IAAI,KAAK,CAAC,iBAAiB,IAAI,CAC1D,8BACE,MAAC,yBAAyB,eACxB,MAAC,MAAM,kBACL,EAAE,EAAE,yBAAyB,EAC7B,OAAO,EAAC,MAAM,gBACH,eAAe,EAC1B,OAAO,EAAE,GAAG,EAAE;4CACZ,QAAQ,CAAC,EAAE,IAAI,EAAE,sBAAsB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;wCAC7D,CAAC,EACD,MAAM,EAAE,MAAM,iBAEd,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,WAAG,EACzB,QAAQ,CAAC,OAAO,CAAC,OAAO,aAClB,EAET,KAAC,4BAA4B,cAC3B,KAAC,iBAAiB,IAChB,GAAG,EAAE,mBAAmB,EACxB,QAAQ,EAAE,KAAK,CAAC,gBAAgB,EAChC,QAAQ,EAAE,CAAC,UAA0C,EAAE,EAAE;gDACvD,QAAQ,CAAC,EAAE,IAAI,EAAE,+BAA+B,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC;4CAC3E,CAAC,EACD,KAAK,EAAE,KAAK,CAAC,WAAW,EACxB,QAAQ,EAAE,CAAC,CAAgC,EAAE,EAAE;gDAC7C,QAAQ,CAAC,EAAE,IAAI,EAAE,gBAAgB,EAAE,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;4CAChE,CAAC,WACD,WAC2B,YACL,EAE3B,KAAK,CAAC,iBAAiB,IAAI,CAC1B,KAAC,mBAAmB,IAClB,OAAO,EAAE,KAAK,CAAC,YAAY,EAC3B,cAAc,EAAE,mBAAmB,CAAC,OAAO,EAC3C,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,kBAAkB,EACzD,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,UAAU,EACpB,WAAW,EAAE,CAAC,UAA0C,EAAE,EAAE;oCAC1D,QAAQ,CAAC,EAAE,IAAI,EAAE,wBAAwB,EAAE,OAAO,EAAE,UAAU,EAAE,CAAC,CAAC;gCACpE,CAAC,EACD,MAAM,EAAE,MAAM,WACd,CACH,YACA,CACJ,aACqB,YACpB,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC","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} 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 StyledPopoverContent = 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});\nStyledPopoverContent.defaultProps = defaultThemeProp;\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 StyledMultiSelect = styled(MultiSelectInput)(() => {\n return css`\n width: 60vw;\n min-width: 16rem;\n max-width: 40rem;\n `;\n});\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}: PostTypeMenuProps) => {\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 onClick={() => {\n dispatch({ type: 'toggleTypeMenu' });\n }}\n ref={setToggleEl}\n variant='link'\n aria-haspopup='menu'\n aria-expanded={state.showTypeMenu}\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'\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 onBlur={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n >{`${state.multiSelectItems.length}`}</StyledRecipientCount>\n\n <Popover\n show={state.showCountPopover}\n target={recipientCountEl}\n id='recipients-popover'\n onMouseEnter={() => {\n if (!state.showTypeMenu) dispatch({ type: 'setShowCountPopover', payload: true });\n }}\n onMouseLeave={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n arrow\n >\n <StyledPopoverContent>\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 </StyledPopoverContent>\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 onBlur={onBlur}\n />\n )}\n\n {state.postType === 'private' && state.viewingRecipients && (\n <>\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 <StyledMultiSelect\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 />\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 onBlur={onBlur}\n />\n )}\n </>\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} 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 StyledPopoverContent = 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});\nStyledPopoverContent.defaultProps = defaultThemeProp;\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 StyledMultiSelect = styled(MultiSelectInput)(() => {\n return css`\n width: 60vw;\n min-width: 16rem;\n max-width: 40rem;\n `;\n});\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}: PostTypeMenuProps) => {\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 onClick={() => {\n dispatch({ type: 'toggleTypeMenu' });\n }}\n ref={setToggleEl}\n variant='link'\n aria-haspopup='menu'\n aria-expanded={state.showTypeMenu}\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'\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 onBlur={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n >{`${state.multiSelectItems.length}`}</StyledRecipientCount>\n\n <Popover\n show={state.showCountPopover}\n target={recipientCountEl}\n id='recipients-popover'\n onMouseEnter={() => {\n if (!state.showTypeMenu) dispatch({ type: 'setShowCountPopover', payload: true });\n }}\n onMouseLeave={() => dispatch({ type: 'setShowCountPopover', payload: false })}\n arrow\n >\n <StyledPopoverContent>\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 </StyledPopoverContent>\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 onBlur={onBlur}\n />\n )}\n\n {state.postType === 'private' && state.viewingRecipients && (\n <>\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 <StyledMultiSelect\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 />\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 onBlur={onBlur}\n />\n )}\n </>\n )}\n </StyledPostTypePopover>\n </div>\n );\n};\n\nexport default FeedNewPostTypeMenu;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedPost.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/FeedPost.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EACF,YAAY,EAIZ,UAAU,EAIX,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,WAAW,EAaX,YAAY,EAKZ,aAAa,EAIb,eAAe,EAIhB,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"FeedPost.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/FeedPost.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EACF,YAAY,EAIZ,UAAU,EAIX,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,WAAW,EAaX,YAAY,EAKZ,aAAa,EAIb,eAAe,EAIhB,MAAM,yBAAyB,CAAC;AAQjC,OAAwB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAoB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAuB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAOvE,MAAM,WAAW,aAAa;IAC5B,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,yEAAyE;IACzE,IAAI,EAAE;QACJ,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;QACjB,WAAW,EAAE,MAAM,CAAC;QACpB,OAAO,EAAE,YAAY,GAAG,MAAM,CAAC;QAC/B,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;QAChC,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;QAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,WAAW,CAAC,EAAE,aAAa,EAAE,CAAC;QAC9B,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,WAAW,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;QACpC,UAAU,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;KACpC,CAAC;IACF,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;IACxD,gDAAgD;IAChD,eAAe,EAAE;QACf,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;QAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,YAAY,EAAE,MAAM,CAAC;QACrB;;WAEG;QACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;KAC/B,CAAC;IACF,0EAA0E;IAC1E,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnD,qEAAqE;IACrE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnD,kEAAkE;IAClE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACrD,+DAA+D;IAC/D,WAAW,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,eAAe,CAAA;KAAE,KAAK,IAAI,CAAC;IACxE,wFAAwF;IACxF,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,2HAA2H;IAC3H,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,oGAAoG;IACpG,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,6IAA6I;IAC7I,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,8EAA8E;IAC9E,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,EAAE,UAAU,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7F,6DAA6D;IAC7D,SAAS,CAAC,EAAE,aAAa,EAAE,CAAC;IAC5B,sGAAsG;IACtG,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAClE;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,8FAA8F;IAC9F,UAAU,EAAE,IAAI,CAAC,mBAAmB,EAAE,UAAU,GAAG,aAAa,GAAG,cAAc,CAAC,GAAG;QACnF,YAAY,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAC;QAClD,WAAW,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAC;KACjD,CAAC;IACF,iDAAiD;IACjD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,2DAA2D;IAC3D,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,oCAAoC;IACpC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gEAAgE;IAChE,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACxD,gEAAgE;IAChE,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACxD,2CAA2C;IAC3C,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAYD,eAAO,MAAM,cAAc,yGAM1B,CAAC;AAIF,eAAO,MAAM,cAAc,yGAM1B,CAAC;AAIF,eAAO,MAAM,aAAa,yGAKzB,CAAC;AAIF,eAAO,MAAM,gBAAgB,yGAI5B,CAAC;AAYF,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,YAAY,GAAG,aAAa,CAka9C,CAAC;AAIF,eAAe,QAAQ,CAAC"}
|