@pega/cosmos-react-social 4.0.0-dev.5.1 → 4.0.0-dev.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/lib/components/Email/EmailSummaryItem.js +1 -1
  2. package/lib/components/Email/EmailSummaryItem.js.map +1 -1
  3. package/lib/components/Email/EmailSummaryList.d.ts.map +1 -1
  4. package/lib/components/Email/EmailSummaryList.js +1 -1
  5. package/lib/components/Email/EmailSummaryList.js.map +1 -1
  6. package/package.json +4 -4
package/lib/components/Email/EmailSummaryItem.js CHANGED
@@ -96,7 +96,7 @@ const EmailSummaryItem = forwardRef(({ id, activeParticipants, sentiment, messag
96
96
  }
97
97
  return participants;
98
98
  }, [activeParticipants]);
99
- return (_jsxs(BareButton, { as: StyledEmailSummaryItem, ref: ref, ...restProps, id: id, onClick: () => onSelect(id), "aria-selected": active, "aria-label": `${emailParticipants}, ${message} ${timeStamp} ${topic} ${sentiment?.variant} ${t('priority')} ${urgency}`, tabIndex: -1, children: [_jsxs(StyledParticipants, { unreadEmailCount: unreadEmailCount, container: { justify: 'between', alignItems: 'center' }, children: [_jsx(Text, { variant: 'h4', children: emailParticipants }), typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (_jsx(Count, { variant: 'default', children: unreadEmailCount }))] }), _jsxs(Flex, { container: {
99
+ return (_jsxs(BareButton, { as: StyledEmailSummaryItem, ref: ref, ...restProps, id: id, onClick: () => onSelect(id), "aria-selected": active, "aria-label": `${emailParticipants}, ${message} ${timeStamp} ${topic} ${sentiment?.variant} ${t('priority')} ${urgency}`, tabIndex: -1, children: [_jsxs(StyledParticipants, { unreadEmailCount: unreadEmailCount, container: { justify: 'between', alignItems: 'center' }, children: [_jsx(Text, { variant: 'h4', children: emailParticipants }), typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (_jsx(Count, { children: unreadEmailCount }))] }), _jsxs(Flex, { container: {
100
100
  justify: 'between'
101
101
  }, as: StyledMessageAndDate, children: [_jsx(StyledMessage, { unreadEmailCount: unreadEmailCount, children: message }), _jsx(DateTimeDisplay, { value: timeStamp, variant: 'date', format: 'short' })] }), _jsx(MetaList, { items: items }), (undelivered || drafts) && (_jsxs(Flex, { container: {
102
102
  justify: 'start',
package/lib/components/Email/EmailSummaryItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"EmailSummaryItem.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, ReactNode, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport {\n defaultThemeProp,\n ForwardProps,\n Text,\n Flex,\n Count,\n Sentiment,\n MetaList,\n DateTimeDisplay,\n Status,\n tryCatch,\n useI18n\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\n\nimport { EmailSummaryItemProps } from './Email.types';\n\nconst StyledMessage = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n margin-inline-end: ${theme.base.spacing};\n ${unreadEmailCount !== undefined &&\n unreadEmailCount > 0 &&\n css`\n color: ${theme.base.palette.interactive};\n `}\n `;\n});\n\nconst StyledMessageAndDate = styled.div`\n white-space: nowrap;\n`;\n\nconst StyledParticipants = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n return css`\n ${unreadEmailCount !== undefined &&\n unreadEmailCount > 0 &&\n css`\n position: relative;\n &::before {\n content: '';\n position: absolute;\n inset-inline: calc(-1.5 * ${theme.base.spacing});\n inset-block-start: calc(0.8 * ${theme.base.spacing});\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: ${theme.base.palette.interactive};\n }\n `}\n `;\n});\ninterface StyledEmailSummaryItemProps extends EmailSummaryItemProps {\n isEmailItemActive: boolean;\n}\n\nconst StyledStatuses = styled.div``;\n\nexport const StyledEmailSummaryItem = styled.button<StyledEmailSummaryItemProps>(({ theme }) => {\n const hoverColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n return css`\n width: 100%;\n color: ${theme.base.palette['foreground-color']};\n background-color: ${theme.base.palette['primary-background']};\n padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n ${StyledMetaList}, ${StyledMessageAndDate}, ${StyledStatuses} {\n margin-block-start: ${theme.base.spacing};\n }\n & + & {\n margin-inline-start: 0;\n }\n\n &[aria-selected='true'],\n &[data-current='true'] {\n background-color: ${theme.base.palette['secondary-background']};\n }\n\n &:hover,\n &:focus-within {\n background-color: ${hoverColor};\n }\n &:not(:last-child) {\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n `;\n});\n\nStyledEmailSummaryItem.defaultProps = defaultThemeProp;\nStyledParticipants.defaultProps = defaultThemeProp;\nStyledMessage.defaultProps = defaultThemeProp;\n\nconst EmailSummaryItem: FunctionComponent<EmailSummaryItemProps & ForwardProps> = forwardRef(\n (\n {\n id,\n activeParticipants,\n sentiment,\n message,\n timeStamp,\n topic,\n urgency,\n active = false,\n onSelect,\n unreadEmailCount,\n drafts,\n undelivered,\n ...restProps\n },\n ref: EmailSummaryItemProps['ref']\n ) => {\n const t = useI18n();\n const items = useMemo(() => {\n const itemList: ReactNode[] = [];\n\n if (typeof topic === 'string' && topic.length > 0) {\n itemList.push(\n <Status variant='info' key='info'>\n {topic}\n </Status>\n );\n }\n\n if (sentiment) {\n itemList.push(<Sentiment variant={sentiment.variant} labelHidden />);\n }\n\n if (typeof urgency === 'number') {\n itemList.push(<Text variant='secondary'>{`${t('priority')} ${urgency}`}</Text>);\n }\n\n return itemList;\n }, [sentiment, topic, urgency]);\n\n const emailParticipants = useMemo(() => {\n let participants = '';\n if (activeParticipants.length > 0) {\n participants =\n activeParticipants.length === 1\n ? activeParticipants[0].fullName\n : activeParticipants.map(participant => `${participant.shortName}`).join(', ');\n }\n return participants;\n }, [activeParticipants]);\n\n return (\n <BareButton\n as={StyledEmailSummaryItem}\n ref={ref}\n {...restProps}\n id={id}\n onClick={() => onSelect(id)}\n aria-selected={active}\n aria-label={`${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n sentiment?.variant\n } ${t('priority')} ${urgency}`}\n tabIndex={-1}\n >\n <StyledParticipants\n unreadEmailCount={unreadEmailCount}\n container={{ justify: 'between', alignItems: 'center' }}\n >\n <Text variant='h4'>{emailParticipants}</Text>\n {typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (\n <Count variant='default'>{unreadEmailCount}</Count>\n )}\n </StyledParticipants>\n <Flex\n container={{\n justify: 'between'\n }}\n as={StyledMessageAndDate}\n >\n <StyledMessage unreadEmailCount={unreadEmailCount}>{message}</StyledMessage>\n <DateTimeDisplay value={timeStamp} variant='date' format='short' />\n </Flex>\n <MetaList items={items} />\n {(undelivered || drafts) && (\n <Flex\n container={{\n justify: 'start',\n gap: 1\n }}\n as={StyledStatuses}\n >\n {undelivered && <Status variant='urgent'>{t('undelivered')}</Status>}\n {/* Passing count as infinity so that translation engine select correct form of draft,\n with [](second argument) as empty so that count is not shown */}\n {drafts && <Status variant='pending'>{t('draft', [], { count: Infinity })}</Status>}\n </Flex>\n )}\n </BareButton>\n );\n }\n);\n\nexport default EmailSummaryItem;\n"]}
1
+ {"version":3,"file":"EmailSummaryItem.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, ReactNode, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport {\n defaultThemeProp,\n ForwardProps,\n Text,\n Flex,\n Count,\n Sentiment,\n MetaList,\n DateTimeDisplay,\n Status,\n tryCatch,\n useI18n\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\n\nimport { EmailSummaryItemProps } from './Email.types';\n\nconst StyledMessage = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n margin-inline-end: ${theme.base.spacing};\n ${unreadEmailCount !== undefined &&\n unreadEmailCount > 0 &&\n css`\n color: ${theme.base.palette.interactive};\n `}\n `;\n});\n\nconst StyledMessageAndDate = styled.div`\n white-space: nowrap;\n`;\n\nconst StyledParticipants = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n return css`\n ${unreadEmailCount !== undefined &&\n unreadEmailCount > 0 &&\n css`\n position: relative;\n &::before {\n content: '';\n position: absolute;\n inset-inline: calc(-1.5 * ${theme.base.spacing});\n inset-block-start: calc(0.8 * ${theme.base.spacing});\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: ${theme.base.palette.interactive};\n }\n `}\n `;\n});\ninterface StyledEmailSummaryItemProps extends EmailSummaryItemProps {\n isEmailItemActive: boolean;\n}\n\nconst StyledStatuses = styled.div``;\n\nexport const StyledEmailSummaryItem = styled.button<StyledEmailSummaryItemProps>(({ theme }) => {\n const hoverColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n return css`\n width: 100%;\n color: ${theme.base.palette['foreground-color']};\n background-color: ${theme.base.palette['primary-background']};\n padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n ${StyledMetaList}, ${StyledMessageAndDate}, ${StyledStatuses} {\n margin-block-start: ${theme.base.spacing};\n }\n & + & {\n margin-inline-start: 0;\n }\n\n &[aria-selected='true'],\n &[data-current='true'] {\n background-color: ${theme.base.palette['secondary-background']};\n }\n\n &:hover,\n &:focus-within {\n background-color: ${hoverColor};\n }\n &:not(:last-child) {\n border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n `;\n});\n\nStyledEmailSummaryItem.defaultProps = defaultThemeProp;\nStyledParticipants.defaultProps = defaultThemeProp;\nStyledMessage.defaultProps = defaultThemeProp;\n\nconst EmailSummaryItem: FunctionComponent<EmailSummaryItemProps & ForwardProps> = forwardRef(\n (\n {\n id,\n activeParticipants,\n sentiment,\n message,\n timeStamp,\n topic,\n urgency,\n active = false,\n onSelect,\n unreadEmailCount,\n drafts,\n undelivered,\n ...restProps\n },\n ref: EmailSummaryItemProps['ref']\n ) => {\n const t = useI18n();\n const items = useMemo(() => {\n const itemList: ReactNode[] = [];\n\n if (typeof topic === 'string' && topic.length > 0) {\n itemList.push(\n <Status variant='info' key='info'>\n {topic}\n </Status>\n );\n }\n\n if (sentiment) {\n itemList.push(<Sentiment variant={sentiment.variant} labelHidden />);\n }\n\n if (typeof urgency === 'number') {\n itemList.push(<Text variant='secondary'>{`${t('priority')} ${urgency}`}</Text>);\n }\n\n return itemList;\n }, [sentiment, topic, urgency]);\n\n const emailParticipants = useMemo(() => {\n let participants = '';\n if (activeParticipants.length > 0) {\n participants =\n activeParticipants.length === 1\n ? activeParticipants[0].fullName\n : activeParticipants.map(participant => `${participant.shortName}`).join(', ');\n }\n return participants;\n }, [activeParticipants]);\n\n return (\n <BareButton\n as={StyledEmailSummaryItem}\n ref={ref}\n {...restProps}\n id={id}\n onClick={() => onSelect(id)}\n aria-selected={active}\n aria-label={`${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n sentiment?.variant\n } ${t('priority')} ${urgency}`}\n tabIndex={-1}\n >\n <StyledParticipants\n unreadEmailCount={unreadEmailCount}\n container={{ justify: 'between', alignItems: 'center' }}\n >\n <Text variant='h4'>{emailParticipants}</Text>\n {typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (\n <Count>{unreadEmailCount}</Count>\n )}\n </StyledParticipants>\n <Flex\n container={{\n justify: 'between'\n }}\n as={StyledMessageAndDate}\n >\n <StyledMessage unreadEmailCount={unreadEmailCount}>{message}</StyledMessage>\n <DateTimeDisplay value={timeStamp} variant='date' format='short' />\n </Flex>\n <MetaList items={items} />\n {(undelivered || drafts) && (\n <Flex\n container={{\n justify: 'start',\n gap: 1\n }}\n as={StyledStatuses}\n >\n {undelivered && <Status variant='urgent'>{t('undelivered')}</Status>}\n {/* Passing count as infinity so that translation engine select correct form of draft,\n with [](second argument) as empty so that count is not shown */}\n {drafts && <Status variant='pending'>{t('draft', [], { count: Infinity })}</Status>}\n </Flex>\n )}\n </BareButton>\n );\n }\n);\n\nexport default EmailSummaryItem;\n"]}
package/lib/components/Email/EmailSummaryList.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"EmailSummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,iBAAiB,EAElB,MAAM,OAAO,CAAC;AAGf,OAAO,EAKL,YAAY,EAgBb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAyB,qBAAqB,EAAE,MAAM,eAAe,CAAC;AA+D7E,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA8I7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1
+ {"version":3,"file":"EmailSummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,iBAAiB,EAElB,MAAM,OAAO,CAAC;AAGf,OAAO,EAKL,YAAY,EAgBb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAyB,qBAAqB,EAAE,MAAM,eAAe,CAAC;AA+D7E,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA6I7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
package/lib/components/Email/EmailSummaryList.js CHANGED
@@ -100,7 +100,7 @@ const EmailSummaryList = forwardRef(({ loading = false, onLoadMore, categories,
100
100
  onItemClick: onCategoryClick
101
101
  } }) }), typeof unreadEmailCount === 'number' && (_jsx(Count, { "aria-label": t('unread_email_count', [unreadEmailCount], {
102
102
  count: unreadEmailCount
103
- }), variant: 'default', children: unreadEmailCount })), filters && (_jsx(StyledFilterButton, { variant: 'simple', label: t('email_filters'), icon: true, children: _jsx(Icon, { name: 'filter' }) }))] }) }), items.length > 0 ? (_jsxs(StyledEmailSummaryList, { role: 'tablist', tabIndex: -1, ref: tablistRef, children: [_jsx(VisuallyHiddenText, { "aria-live": 'polite', children: announcement }), items.map((emailItem, i) => {
103
+ }), children: unreadEmailCount })), filters && (_jsx(StyledFilterButton, { variant: 'simple', label: t('email_filters'), icon: true, children: _jsx(Icon, { name: 'filter' }) }))] }) }), items.length > 0 ? (_jsxs(StyledEmailSummaryList, { role: 'tablist', tabIndex: -1, ref: tablistRef, children: [_jsx(VisuallyHiddenText, { "aria-live": 'polite', children: announcement }), items.map((emailItem, i) => {
104
104
  const { id, ...emailItemProps } = emailItem;
105
105
  return (_jsx(EmailSummaryItem, { ref: tabRefs[i], id: id, role: 'tab', ...emailItemProps, onSelect: (selectedItemId) => {
106
106
  onItemClick(selectedItemId);
package/lib/components/Email/EmailSummaryList.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"EmailSummaryList.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createRef,\n useMemo,\n useState,\n useEffect,\n forwardRef,\n FunctionComponent,\n useCallback\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Count,\n defaultThemeProp,\n Flex,\n ForwardProps,\n Icon,\n registerIcon,\n MenuButton,\n useConsolidatedRef,\n useI18n,\n menuHelpers,\n Progress,\n useItemIntersection,\n usePrevious,\n VisuallyHiddenText,\n EmptyState,\n calculateFontSize,\n StyledText,\n useArrows,\n debounce\n} from '@pega/cosmos-react-core';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\n\nimport { EmailSummaryItemProps, EmailSummaryListProps } from './Email.types';\nimport EmailSummaryItem, { StyledEmailSummaryItem } from './EmailSummaryItem';\nimport { StyledLoadMore } from './Email.styles';\n\nregisterIcon(filterIcon);\n\nconst StyledEmailSummaryListContainer = styled(Flex)(({ theme }) => {\n return css`\n height: 100%;\n background-color: ${theme.base.palette['primary-background']};\n `;\n});\nStyledEmailSummaryListContainer.defaultProps = defaultThemeProp;\n\nconst StyledEmailSummaryListHeader = styled.div(({ theme }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing}) calc(2 * ${theme.base.spacing}) ${theme.base.spacing};\n `;\n});\nStyledEmailSummaryListHeader.defaultProps = defaultThemeProp;\n\nconst StyledActionWrapper = styled(Flex)(({ theme }) => {\n return css`\n padding-block-start: ${theme.base.spacing};\n `;\n});\nStyledActionWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFilterButton = styled(Button)`\n margin-inline-start: auto;\n`;\n\nconst StyledEmailSummaryList = styled.div(({ theme }) => {\n return css`\n height: 100%;\n overflow-y: auto;\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus {\n ${StyledEmailSummaryItem}[data-current='true'] {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n }\n `;\n});\nStyledEmailSummaryList.defaultProps = defaultThemeProp;\n\nconst StyledWorklist = styled(MenuButton)(({ theme }) => {\n const { 'font-size': fontSize, 'font-scale': fontScale } = theme.base;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n return css`\n ${StyledText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSizes.m};\n }\n `;\n});\n\nStyledWorklist.defaultProps = defaultThemeProp;\n\nconst EmailSummaryList: FunctionComponent<EmailSummaryListProps & ForwardProps> = forwardRef(\n (\n {\n loading = false,\n onLoadMore,\n categories,\n onCategoryClick,\n items,\n unreadEmailCount,\n filters,\n onFilterChange,\n onItemClick,\n emptyMessage,\n currentItemId,\n ...restProps\n },\n ref: EmailSummaryListProps['ref']\n ) => {\n const t = useI18n();\n const tablistRef = useConsolidatedRef(ref);\n const tabRefs = items.map(() => createRef<HTMLButtonElement>());\n const prevEmail = usePrevious(items);\n const [announcement, setAnnouncement] = useState('');\n\n useArrows(\n tablistRef,\n {\n cycle: true,\n selector: 'button[role=\"tab\"]',\n dir: 'up-down',\n allowTabFocus: true\n },\n [items]\n );\n\n const buttonText = useMemo(() => {\n return (\n menuHelpers.getSelected(categories)[0]?.primary ??\n menuHelpers.flatten(categories)[0].primary\n );\n }, [categories]);\n\n const handleLoadMore = useCallback(\n debounce(() => {\n if (!loading) {\n onLoadMore?.();\n }\n }, 200),\n [loading]\n );\n\n useItemIntersection(\n tablistRef,\n items.length - 1,\n handleLoadMore,\n ':scope > button[role=\"tab\"]'\n );\n\n useEffect(() => {\n if (loading) setAnnouncement(t('loading_email'));\n }, [loading]);\n\n useEffect(() => {\n if (prevEmail) {\n const difference = items.length - prevEmail.length;\n if (difference) setAnnouncement(t('new_emails_count', [difference], { count: difference }));\n }\n }, [items]);\n\n useEffect(() => {\n if (tabRefs.length > 0 && currentItemId) {\n tabRefs[items.findIndex(item => item.id === currentItemId)]?.current?.focus();\n }\n }, [currentItemId]);\n\n return (\n <StyledEmailSummaryListContainer container={{ direction: 'column' }} {...restProps}>\n <StyledEmailSummaryListHeader>\n <StyledActionWrapper\n container={{ justify: 'space-between', alignItems: 'center', gap: 0.5 }}\n >\n <Flex item={{ shrink: 1 }}>\n <StyledWorklist\n text={buttonText}\n variant='text'\n popover={{ portal: true }}\n menu={{\n mode: 'single-select',\n items: categories,\n onItemClick: onCategoryClick\n }}\n />\n </Flex>\n {typeof unreadEmailCount === 'number' && (\n <Count\n aria-label={t('unread_email_count', [unreadEmailCount], {\n count: unreadEmailCount\n })}\n variant='default'\n >\n {unreadEmailCount}\n </Count>\n )}\n {filters && (\n <StyledFilterButton variant='simple' label={t('email_filters')} icon>\n <Icon name='filter' />\n </StyledFilterButton>\n )}\n </StyledActionWrapper>\n </StyledEmailSummaryListHeader>\n\n {items.length > 0 ? (\n <StyledEmailSummaryList role='tablist' tabIndex={-1} ref={tablistRef}>\n <VisuallyHiddenText aria-live='polite'>{announcement}</VisuallyHiddenText>\n {items.map((emailItem, i) => {\n const { id, ...emailItemProps } = emailItem;\n return (\n <EmailSummaryItem\n ref={tabRefs[i]}\n id={id}\n key={id}\n role='tab'\n {...emailItemProps}\n onSelect={(selectedItemId: EmailSummaryItemProps['id']) => {\n onItemClick(selectedItemId);\n }}\n active={currentItemId === id}\n />\n );\n })}\n {loading && (\n <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n <Progress placement='inline' />\n </Flex>\n )}\n </StyledEmailSummaryList>\n ) : (\n <EmptyState message={emptyMessage} />\n )}\n </StyledEmailSummaryListContainer>\n );\n }\n);\n\nexport default EmailSummaryList;\n"]}
1
+ {"version":3,"file":"EmailSummaryList.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createRef,\n useMemo,\n useState,\n useEffect,\n forwardRef,\n FunctionComponent,\n useCallback\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Count,\n defaultThemeProp,\n Flex,\n ForwardProps,\n Icon,\n registerIcon,\n MenuButton,\n useConsolidatedRef,\n useI18n,\n menuHelpers,\n Progress,\n useItemIntersection,\n usePrevious,\n VisuallyHiddenText,\n EmptyState,\n calculateFontSize,\n StyledText,\n useArrows,\n debounce\n} from '@pega/cosmos-react-core';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\n\nimport { EmailSummaryItemProps, EmailSummaryListProps } from './Email.types';\nimport EmailSummaryItem, { StyledEmailSummaryItem } from './EmailSummaryItem';\nimport { StyledLoadMore } from './Email.styles';\n\nregisterIcon(filterIcon);\n\nconst StyledEmailSummaryListContainer = styled(Flex)(({ theme }) => {\n return css`\n height: 100%;\n background-color: ${theme.base.palette['primary-background']};\n `;\n});\nStyledEmailSummaryListContainer.defaultProps = defaultThemeProp;\n\nconst StyledEmailSummaryListHeader = styled.div(({ theme }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing}) calc(2 * ${theme.base.spacing}) ${theme.base.spacing};\n `;\n});\nStyledEmailSummaryListHeader.defaultProps = defaultThemeProp;\n\nconst StyledActionWrapper = styled(Flex)(({ theme }) => {\n return css`\n padding-block-start: ${theme.base.spacing};\n `;\n});\nStyledActionWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFilterButton = styled(Button)`\n margin-inline-start: auto;\n`;\n\nconst StyledEmailSummaryList = styled.div(({ theme }) => {\n return css`\n height: 100%;\n overflow-y: auto;\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus {\n ${StyledEmailSummaryItem}[data-current='true'] {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n }\n `;\n});\nStyledEmailSummaryList.defaultProps = defaultThemeProp;\n\nconst StyledWorklist = styled(MenuButton)(({ theme }) => {\n const { 'font-size': fontSize, 'font-scale': fontScale } = theme.base;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n return css`\n ${StyledText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSizes.m};\n }\n `;\n});\n\nStyledWorklist.defaultProps = defaultThemeProp;\n\nconst EmailSummaryList: FunctionComponent<EmailSummaryListProps & ForwardProps> = forwardRef(\n (\n {\n loading = false,\n onLoadMore,\n categories,\n onCategoryClick,\n items,\n unreadEmailCount,\n filters,\n onFilterChange,\n onItemClick,\n emptyMessage,\n currentItemId,\n ...restProps\n },\n ref: EmailSummaryListProps['ref']\n ) => {\n const t = useI18n();\n const tablistRef = useConsolidatedRef(ref);\n const tabRefs = items.map(() => createRef<HTMLButtonElement>());\n const prevEmail = usePrevious(items);\n const [announcement, setAnnouncement] = useState('');\n\n useArrows(\n tablistRef,\n {\n cycle: true,\n selector: 'button[role=\"tab\"]',\n dir: 'up-down',\n allowTabFocus: true\n },\n [items]\n );\n\n const buttonText = useMemo(() => {\n return (\n menuHelpers.getSelected(categories)[0]?.primary ??\n menuHelpers.flatten(categories)[0].primary\n );\n }, [categories]);\n\n const handleLoadMore = useCallback(\n debounce(() => {\n if (!loading) {\n onLoadMore?.();\n }\n }, 200),\n [loading]\n );\n\n useItemIntersection(\n tablistRef,\n items.length - 1,\n handleLoadMore,\n ':scope > button[role=\"tab\"]'\n );\n\n useEffect(() => {\n if (loading) setAnnouncement(t('loading_email'));\n }, [loading]);\n\n useEffect(() => {\n if (prevEmail) {\n const difference = items.length - prevEmail.length;\n if (difference) setAnnouncement(t('new_emails_count', [difference], { count: difference }));\n }\n }, [items]);\n\n useEffect(() => {\n if (tabRefs.length > 0 && currentItemId) {\n tabRefs[items.findIndex(item => item.id === currentItemId)]?.current?.focus();\n }\n }, [currentItemId]);\n\n return (\n <StyledEmailSummaryListContainer container={{ direction: 'column' }} {...restProps}>\n <StyledEmailSummaryListHeader>\n <StyledActionWrapper\n container={{ justify: 'space-between', alignItems: 'center', gap: 0.5 }}\n >\n <Flex item={{ shrink: 1 }}>\n <StyledWorklist\n text={buttonText}\n variant='text'\n popover={{ portal: true }}\n menu={{\n mode: 'single-select',\n items: categories,\n onItemClick: onCategoryClick\n }}\n />\n </Flex>\n {typeof unreadEmailCount === 'number' && (\n <Count\n aria-label={t('unread_email_count', [unreadEmailCount], {\n count: unreadEmailCount\n })}\n >\n {unreadEmailCount}\n </Count>\n )}\n {filters && (\n <StyledFilterButton variant='simple' label={t('email_filters')} icon>\n <Icon name='filter' />\n </StyledFilterButton>\n )}\n </StyledActionWrapper>\n </StyledEmailSummaryListHeader>\n\n {items.length > 0 ? (\n <StyledEmailSummaryList role='tablist' tabIndex={-1} ref={tablistRef}>\n <VisuallyHiddenText aria-live='polite'>{announcement}</VisuallyHiddenText>\n {items.map((emailItem, i) => {\n const { id, ...emailItemProps } = emailItem;\n return (\n <EmailSummaryItem\n ref={tabRefs[i]}\n id={id}\n key={id}\n role='tab'\n {...emailItemProps}\n onSelect={(selectedItemId: EmailSummaryItemProps['id']) => {\n onItemClick(selectedItemId);\n }}\n active={currentItemId === id}\n />\n );\n })}\n {loading && (\n <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n <Progress placement='inline' />\n </Flex>\n )}\n </StyledEmailSummaryList>\n ) : (\n <EmptyState message={emptyMessage} />\n )}\n </StyledEmailSummaryListContainer>\n );\n }\n);\n\nexport default EmailSummaryList;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-social",
3
- "version": "4.0.0-dev.5.1",
3
+ "version": "4.0.0-dev.6.1",
4
4
  "author": "Pegasystems",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "repository": {
@@ -23,9 +23,9 @@
23
23
  "build": "tsc -b"
24
24
  },
25
25
  "dependencies": {
26
- "@pega/cosmos-react-core": "4.0.0-dev.5.1",
27
- "@pega/cosmos-react-rte": "4.0.0-dev.5.1",
28
- "@pega/cosmos-react-work": "4.0.0-dev.5.1",
26
+ "@pega/cosmos-react-core": "4.0.0-dev.6.1",
27
+ "@pega/cosmos-react-rte": "4.0.0-dev.6.1",
28
+ "@pega/cosmos-react-work": "4.0.0-dev.6.1",
29
29
  "@types/parse5": "^6.0.0",
30
30
  "@types/react": "^16.14.24 || ^17.0.38",
31
31
  "@types/react-dom": "^16.9.14 || ^17.0.11",