@pega/cosmos-react-work 5.0.0-dev.9.3 → 6.0.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 (49) hide show
  1. package/SECURITY.md +11 -0
  2. package/lib/components/ArticleList/ArticleBuddy.d.ts.map +1 -1
  3. package/lib/components/ArticleList/ArticleBuddy.js +16 -4
  4. package/lib/components/ArticleList/ArticleBuddy.js.map +1 -1
  5. package/lib/components/ArticleList/ArticleFeedback.d.ts +7 -0
  6. package/lib/components/ArticleList/ArticleFeedback.d.ts.map +1 -0
  7. package/lib/components/ArticleList/ArticleFeedback.js +40 -0
  8. package/lib/components/ArticleList/ArticleFeedback.js.map +1 -0
  9. package/lib/components/ArticleList/ArticleList.d.ts.map +1 -1
  10. package/lib/components/ArticleList/ArticleList.js +3 -8
  11. package/lib/components/ArticleList/ArticleList.js.map +1 -1
  12. package/lib/components/ArticleList/ArticleList.types.d.ts +35 -5
  13. package/lib/components/ArticleList/ArticleList.types.d.ts.map +1 -1
  14. package/lib/components/ArticleList/ArticleList.types.js.map +1 -1
  15. package/lib/components/ArticleList/ArticleSummary.d.ts.map +1 -1
  16. package/lib/components/ArticleList/ArticleSummary.js +13 -8
  17. package/lib/components/ArticleList/ArticleSummary.js.map +1 -1
  18. package/lib/components/ArticleList/index.d.ts +1 -1
  19. package/lib/components/ArticleList/index.d.ts.map +1 -1
  20. package/lib/components/ArticleList/index.js.map +1 -1
  21. package/lib/components/Assignments/Assignments.d.ts.map +1 -1
  22. package/lib/components/Assignments/Assignments.js +3 -3
  23. package/lib/components/Assignments/Assignments.js.map +1 -1
  24. package/lib/components/Assignments/Assignments.styles.d.ts +0 -3
  25. package/lib/components/Assignments/Assignments.styles.d.ts.map +1 -1
  26. package/lib/components/Assignments/Assignments.styles.js +14 -13
  27. package/lib/components/Assignments/Assignments.styles.js.map +1 -1
  28. package/lib/components/CasePreview/CasePreview.d.ts.map +1 -1
  29. package/lib/components/CasePreview/CasePreview.js +9 -6
  30. package/lib/components/CasePreview/CasePreview.js.map +1 -1
  31. package/lib/components/CaseView/CaseView.styles.d.ts.map +1 -1
  32. package/lib/components/CaseView/CaseView.styles.js +11 -8
  33. package/lib/components/CaseView/CaseView.styles.js.map +1 -1
  34. package/lib/components/CaseView/UtilitySummaryItemDialog.d.ts.map +1 -1
  35. package/lib/components/CaseView/UtilitySummaryItemDialog.js +7 -3
  36. package/lib/components/CaseView/UtilitySummaryItemDialog.js.map +1 -1
  37. package/lib/components/IntelligentGuidance/IntelligentGuidance.d.ts.map +1 -1
  38. package/lib/components/IntelligentGuidance/IntelligentGuidance.js +25 -3
  39. package/lib/components/IntelligentGuidance/IntelligentGuidance.js.map +1 -1
  40. package/lib/components/SearchResults/SearchResults.js +1 -1
  41. package/lib/components/SearchResults/SearchResults.js.map +1 -1
  42. package/lib/components/Tasks/TaskList.d.ts.map +1 -1
  43. package/lib/components/Tasks/TaskList.js +11 -8
  44. package/lib/components/Tasks/TaskList.js.map +1 -1
  45. package/lib/components/Tasks/Tasks.d.ts +0 -1
  46. package/lib/components/Tasks/Tasks.d.ts.map +1 -1
  47. package/lib/components/Tasks/Tasks.js +2 -13
  48. package/lib/components/Tasks/Tasks.js.map +1 -1
  49. package/package.json +6 -5
@@ -1 +1 @@
1
- {"version":3,"file":"IntelligentGuidance.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useLayoutEffect, useRef, useState } from 'react';\nimport type { CSSProperties, FunctionComponent, KeyboardEvent, PropsWithoutRef } from 'react';\n\nimport {\n Icon,\n useI18n,\n useAfterInitialEffect,\n Text,\n Tabs,\n CardHeader,\n TabPanel,\n Flex,\n Count,\n Actions\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, SummaryListItem } from '@pega/cosmos-react-core';\n\nimport {\n StyledIntelligentGuidanceList,\n StyledIntelligentGuidance,\n StyledNew,\n StyledBorderLine\n} from './IntelligentGuidance.styles';\nimport type IntelligentGuidanceProps from './IntelligentGuidance.types';\n\nconst IntelligentGuidance: FunctionComponent<IntelligentGuidanceProps & ForwardProps> = forwardRef(\n function IntelligentGuidance(\n {\n items,\n previousItems,\n heading,\n isCollapsed,\n onExpandCollapse,\n ...restProps\n }: PropsWithoutRef<IntelligentGuidanceProps>,\n ref: IntelligentGuidanceProps['ref']\n ) {\n const t = useI18n();\n const headerRef = useRef<HTMLDivElement>(null);\n const toggleButtonRef = useRef<HTMLButtonElement>(null);\n const [currentTab, setCurrentTab] = useState('current');\n\n const listItems: SummaryListItem[] = (\n currentTab === 'current' ? items : previousItems ?? []\n ).map(item => {\n return {\n id: item.id,\n visual: <Icon name={item.icon} />,\n primary: (\n <>\n {item.label}\n {item.new && (\n <>\n <StyledNew>{t('new')}</StyledNew>\n {/* Can remove StyledBorderLine when Firefox supports :has selector. */}\n <StyledBorderLine />\n </>\n )}\n </>\n ),\n secondary: <Text variant='secondary'>{item.type}</Text>,\n contextualLabel: item.label,\n actions: item.onDismiss\n ? [\n {\n text: t('dismiss'),\n id: item.id,\n icon: 'times',\n onClick: (id, e) => {\n e.stopPropagation();\n item.onDismiss?.(id, e);\n }\n }\n ]\n : undefined,\n container: { colGap: 1 },\n role: 'button',\n tabIndex: 0,\n 'aria-label': t('continue_label_a11y', [item.label]),\n onClick: item.onClick,\n onKeyDown: (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n item.onClick(e);\n }\n }\n };\n });\n\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useLayoutEffect(() => {\n if (headerRef.current) {\n setHeaderHeight(headerRef.current?.offsetHeight || 0);\n }\n }, [headerRef.current]);\n\n // FIXME: This is a hack to get the Tooltip to reset its position when the list is toggled.\n useAfterInitialEffect(() => {\n if (toggleButtonRef.current && toggleButtonRef.current === document.activeElement) {\n toggleButtonRef.current.blur();\n setTimeout(() => {\n toggleButtonRef.current?.focus();\n }, 1000);\n }\n }, [isCollapsed]);\n\n const intelligentGuidanceList = (\n <StyledIntelligentGuidanceList items={listItems} noItemsText={t('no_recommendations')} />\n );\n\n return (\n <StyledIntelligentGuidance\n {...restProps}\n ref={ref}\n role='region'\n aria-live='polite'\n aria-relevant='all'\n isCollapsed={isCollapsed}\n hasItems={!!items.length}\n style={{ '--headerHeight': `${headerHeight}px` } as CSSProperties}\n >\n <CardHeader ref={headerRef}>\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n <Text variant='h2'>{heading}</Text>\n <Count>{items.length + (previousItems?.length ?? 0)}</Count>\n </Flex>\n <Actions\n items={[\n {\n text: t(isCollapsed ? 'expand' : 'collapse'),\n id: 'IntelligentGuidanceButton',\n icon: 'caret-down',\n 'aria-label': isCollapsed\n ? t('expand_noun', [heading])\n : t('collapse_noun', [heading]),\n onClick: onExpandCollapse,\n ref: toggleButtonRef\n }\n ]}\n />\n </CardHeader>\n {previousItems ? (\n <>\n <Tabs\n tabs={[\n {\n id: 'current',\n name: t('current'),\n count: items.filter(item => item.new).length || undefined\n },\n {\n id: 'previous',\n name: t('previous'),\n count: previousItems.filter(item => item.new).length || undefined\n }\n ]}\n currentTabId={currentTab}\n onTabClick={setCurrentTab}\n />\n <TabPanel tabId={currentTab}>{intelligentGuidanceList}</TabPanel>\n </>\n ) : (\n intelligentGuidanceList\n )}\n </StyledIntelligentGuidance>\n );\n }\n);\n\nexport default IntelligentGuidance;\n"]}
1
+ {"version":3,"file":"IntelligentGuidance.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport type { CSSProperties, FunctionComponent, KeyboardEvent, PropsWithoutRef } from 'react';\n\nimport {\n Icon,\n useI18n,\n useAfterInitialEffect,\n Text,\n Tabs,\n CardHeader,\n TabPanel,\n Flex,\n Count,\n Actions,\n useLiveLog,\n usePrevious\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, SummaryListItem } from '@pega/cosmos-react-core';\n\nimport {\n StyledIntelligentGuidanceList,\n StyledIntelligentGuidance,\n StyledNew,\n StyledBorderLine\n} from './IntelligentGuidance.styles';\nimport type IntelligentGuidanceProps from './IntelligentGuidance.types';\n\nconst IntelligentGuidance: FunctionComponent<IntelligentGuidanceProps & ForwardProps> = forwardRef(\n function IntelligentGuidance(\n {\n items,\n previousItems,\n heading,\n isCollapsed,\n onExpandCollapse,\n ...restProps\n }: PropsWithoutRef<IntelligentGuidanceProps>,\n ref: IntelligentGuidanceProps['ref']\n ) {\n const t = useI18n();\n const headerRef = useRef<HTMLDivElement>(null);\n const toggleButtonRef = useRef<HTMLButtonElement>(null);\n const [currentTab, setCurrentTab] = useState('current');\n const { announcePolite } = useLiveLog();\n const oldItems = usePrevious(items);\n const oldPreviousItems = usePrevious(previousItems);\n\n const listItems: SummaryListItem[] = (\n currentTab === 'current' ? items : previousItems ?? []\n ).map(item => {\n return {\n id: item.id,\n visual: <Icon name={item.icon} />,\n primary: (\n <>\n {item.label}\n {item.new && (\n <>\n <StyledNew>{t('new')}</StyledNew>\n {/* Can remove StyledBorderLine when Firefox supports :has selector. */}\n <StyledBorderLine />\n </>\n )}\n </>\n ),\n secondary: <Text variant='secondary'>{item.type}</Text>,\n contextualLabel: item.label,\n actions: item.onDismiss\n ? [\n {\n text: t('dismiss'),\n id: item.id,\n icon: 'times',\n onClick: (id, e) => {\n e.stopPropagation();\n item.onDismiss?.(id, e);\n }\n }\n ]\n : undefined,\n container: { colGap: 1 },\n role: 'button',\n tabIndex: 0,\n 'aria-label': t('continue_label_a11y', [item.label]),\n onClick: item.onClick,\n onKeyDown: (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n item.onClick(e);\n }\n }\n };\n });\n\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useLayoutEffect(() => {\n if (headerRef.current) {\n setHeaderHeight(headerRef.current?.offsetHeight || 0);\n }\n }, [headerRef.current]);\n\n useEffect(() => {\n announcePolite({ message: `${heading} ${items.length + (previousItems?.length ?? 0)}` });\n if (oldItems) {\n const oldItemsIds = oldItems.map(i => i.id);\n const itemsToAnnounce = items.filter(i => !oldItemsIds.includes(i.id));\n if (itemsToAnnounce.length) {\n announcePolite({ message: t('items_added_to_current_list') });\n itemsToAnnounce.forEach(i => announcePolite({ message: `${i.label} ${i.type}` }));\n }\n }\n if (oldPreviousItems) {\n const oldItemsIds = oldPreviousItems.map(i => i.id);\n const itemsToAnnounce = items.filter(i => !oldItemsIds.includes(i.id));\n if (itemsToAnnounce) {\n announcePolite({ message: t('items_added_to_previous_list') });\n itemsToAnnounce.forEach(i => announcePolite({ message: `${i.label} ${i.type}` }));\n }\n }\n }, [items, previousItems]);\n\n // FIXME: This is a hack to get the Tooltip to reset its position when the list is toggled.\n useAfterInitialEffect(() => {\n if (toggleButtonRef.current && toggleButtonRef.current === document.activeElement) {\n toggleButtonRef.current.blur();\n setTimeout(() => {\n toggleButtonRef.current?.focus();\n }, 1000);\n }\n }, [isCollapsed]);\n\n const intelligentGuidanceList = (\n <StyledIntelligentGuidanceList items={listItems} noItemsText={t('no_recommendations')} />\n );\n\n return (\n <StyledIntelligentGuidance\n {...restProps}\n ref={ref}\n role='region'\n isCollapsed={isCollapsed}\n hasItems={!!items.length}\n style={{ '--headerHeight': `${headerHeight}px` } as CSSProperties}\n >\n <CardHeader ref={headerRef}>\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n <Text variant='h2'>{heading}</Text>\n <Count>{items.length + (previousItems?.length ?? 0)}</Count>\n </Flex>\n <Actions\n items={[\n {\n text: t(isCollapsed ? 'expand' : 'collapse'),\n id: 'IntelligentGuidanceButton',\n icon: 'caret-down',\n 'aria-label': isCollapsed\n ? t('expand_noun', [heading])\n : t('collapse_noun', [heading]),\n onClick: onExpandCollapse,\n ref: toggleButtonRef\n }\n ]}\n />\n </CardHeader>\n {previousItems ? (\n <>\n <Tabs\n tabs={[\n {\n id: 'current',\n name: t('current'),\n count: items.filter(item => item.new).length || undefined\n },\n {\n id: 'previous',\n name: t('previous'),\n count: previousItems.filter(item => item.new).length || undefined\n }\n ]}\n currentTabId={currentTab}\n onTabClick={setCurrentTab}\n />\n <TabPanel tabId={currentTab}>{intelligentGuidanceList}</TabPanel>\n </>\n ) : (\n intelligentGuidanceList\n )}\n </StyledIntelligentGuidance>\n );\n }\n);\n\nexport default IntelligentGuidance;\n"]}
@@ -74,7 +74,7 @@ const SearchResults = forwardRef(function SearchResults({ results, searchInputPr
74
74
  useAfterInitialEffect(() => {
75
75
  setAccent(submittedSearchValue ? new RegExp(submittedSearchValue, 'gi') : undefined);
76
76
  }, [submittedSearchValue]);
77
- const searchTitle = (_jsx(SummaryItem, { as: StyledSearchSummaryItem, visual: _jsx(Avatar, { icon: 'search', name: 'search', shape: 'squircle', backgroundColor: primary, color: 'white' }), primary: _jsx(Text, { variant: 'h1', children: "Search" }), actions: onClearAllFilters &&
77
+ const searchTitle = (_jsx(SummaryItem, { as: StyledSearchSummaryItem, visual: _jsx(Avatar, { icon: 'search', name: 'search', shape: 'squircle', backgroundColor: primary, color: 'white' }), primary: _jsx(Text, { variant: 'h1', children: t('search') }), actions: onClearAllFilters &&
78
78
  isMedium &&
79
79
  !!activeFilters.length && (_jsx(Button, { variant: 'link', onClick: onClearAllFilters, children: t('clear_all') })) }));
80
80
  const searchInput = (_jsx(SearchInput, { ...searchInputProps, onSearchSubmit: val => {
@@ -1 +1 @@
1
- {"version":3,"file":"SearchResults.js","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResults.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useContext, useRef, useState } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ComponentProps } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport {\n Button,\n Count,\n Flex,\n Grid,\n Icon,\n registerIcon,\n Modal,\n EmptyState,\n SearchInput,\n Selectable,\n Text,\n useModalManager,\n useI18n,\n useBreakpoint,\n useAfterInitialEffect,\n SummaryItem,\n Avatar,\n useTheme,\n AppShellContext,\n Progress\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, ModalMethods } from '@pega/cosmos-react-core';\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 type {\n SearchResultsProps,\n SearchResultProps,\n FilterProps,\n ActiveFilters\n} from './SearchResults.types';\nimport SearchResult from './SearchResult';\nimport Filter from './Filter';\nimport {\n StyledModalFilterContent,\n StyledCountText,\n StyledSelectedFilters,\n StyledSearchResults,\n StyledResults,\n StyledFilters,\n StyledSearchSummaryItem\n} from './SearchResults.styles';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nconst FilterModal = (\n props: Pick<\n SearchResultsProps,\n 'count' | 'filters' | 'onFilterChange' | 'onClearFilter' | 'onClearAllFilters'\n > & {\n activeFilters: ActiveFilters[];\n }\n) => {\n const { activeFilters, count, filters, onFilterChange, onClearFilter, onClearAllFilters } = props;\n const t = useI18n();\n\n return (\n <Modal heading={t('filters')} autoWidth>\n <Grid as={StyledModalFilterContent} container={{ rowGap: 2 }}>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Text as={StyledCountText} variant='secondary'>\n {t('results_count', [count], { count })}\n </Text>\n {onClearAllFilters && !!activeFilters.length && (\n <Button variant='link' onClick={onClearAllFilters}>\n {t('clear_all')}\n </Button>\n )}\n </Flex>\n {!!activeFilters.length && (\n <Flex as={StyledSelectedFilters} container={{ gap: 1 }}>\n {activeFilters.map(filter => {\n return (\n <Selectable\n key={filter.id}\n id={filter.id}\n onRemove={() =>\n onFilterChange?.({\n name: filter.groupName,\n type: filter.type,\n value: filter.resetValue\n })\n }\n >\n {`${filter.groupName}: ${filter.name}`}\n </Selectable>\n );\n })}\n </Flex>\n )}\n <div>\n {filters.map((filter: FilterProps) => {\n return (\n <Filter\n key={filter.name}\n onFilterChange={onFilterChange}\n onClearFilter={onClearFilter}\n {...filter}\n />\n );\n })}\n </div>\n </Grid>\n </Modal>\n );\n};\n\nconst SearchResults: FunctionComponent<SearchResultsProps & ForwardProps> = forwardRef(\n function SearchResults(\n {\n results,\n searchInputProps,\n count,\n filters,\n onFilterChange,\n onClearAllFilters,\n onClearFilter,\n onShowMore,\n loading = false,\n ...restProps\n }: PropsWithoutRef<SearchResultsProps>,\n ref: SearchResultsProps['ref']\n ) {\n const t = useI18n();\n const isMedium = useBreakpoint('md');\n const { create } = useModalManager();\n const { searchContainerEl } = useContext(AppShellContext);\n const filtersMethods = useRef<ModalMethods<ComponentProps<typeof FilterModal>>>();\n const { placeholder = t('search_placeholder_default') } = searchInputProps;\n const {\n base: {\n palette: { 'brand-primary': primary }\n }\n } = useTheme();\n const [accent, setAccent] = useState<undefined | RegExp>();\n const [submittedSearchValue, setSubmittedSearchValue] = useState(searchInputProps.value);\n\n const activeFilters: ActiveFilters[] = filters.flatMap(group => {\n if (group.type === 'select') {\n return group.items.flatMap(item => {\n if (item.checked) {\n return {\n id: item.id,\n name: item.name,\n resetValue: { ...item, checked: false },\n groupName: group.name,\n type: group.type\n };\n }\n return [];\n });\n }\n return [];\n });\n\n const openFiltersModal = () => {\n filtersMethods.current = create(FilterModal, {\n activeFilters,\n count,\n filters,\n onFilterChange,\n onClearFilter,\n onClearAllFilters\n });\n };\n\n useAfterInitialEffect(() => {\n if (filtersMethods.current) {\n filtersMethods.current.update({\n activeFilters,\n count,\n filters\n });\n }\n }, [activeFilters, count, filters]);\n\n useAfterInitialEffect(() => {\n if (isMedium && filtersMethods.current) filtersMethods.current.dismiss();\n }, [isMedium]);\n\n useAfterInitialEffect(() => {\n setAccent(submittedSearchValue ? new RegExp(submittedSearchValue, 'gi') : undefined);\n }, [submittedSearchValue]);\n\n const searchTitle = (\n <SummaryItem\n as={StyledSearchSummaryItem}\n visual={\n <Avatar\n icon='search'\n name='search'\n shape='squircle'\n backgroundColor={primary}\n color='white'\n />\n }\n primary={<Text variant='h1'>Search</Text>}\n actions={\n onClearAllFilters &&\n isMedium &&\n !!activeFilters.length && (\n <Button variant='link' onClick={onClearAllFilters}>\n {t('clear_all')}\n </Button>\n )\n }\n />\n );\n const searchInput = (\n <SearchInput\n {...searchInputProps}\n onSearchSubmit={val => {\n searchInputProps.onSearchSubmit?.(val);\n setSubmittedSearchValue(val);\n }}\n placeholder={placeholder}\n />\n );\n\n return (\n <Grid\n {...restProps}\n as={StyledSearchResults}\n ref={ref}\n md={\n filters.length\n ? {\n container: {\n cols: '15rem auto'\n }\n }\n : undefined\n }\n sm={\n filters.length\n ? {\n container: {\n cols: 'auto',\n rowGap: 2\n }\n }\n : undefined\n }\n container={{\n rows: 'auto auto',\n cols: 'auto 1fr',\n areas: '\"filters results\"'\n }}\n >\n {isMedium && !!filters.length && (\n <Grid item={{ area: 'filters', alignSelf: 'start' }} as={StyledFilters}>\n {searchTitle}\n {filters.map((filter: FilterProps) => {\n return (\n <Filter\n key={filter.name}\n onFilterChange={onFilterChange}\n onClearFilter={onClearFilter}\n {...filter}\n />\n );\n })}\n </Grid>\n )}\n <Grid\n item={{ alignSelf: 'start', area: 'results' }}\n container={{\n alignItems: 'center',\n rowGap: 2,\n rows: 'auto auto 1fr',\n areas: '\"search\" \"meta\" \"items\"'\n }}\n as={StyledResults}\n >\n {loading && <Progress placement='local' />}\n {searchContainerEl && isMedium ? (\n createPortal(searchInput, searchContainerEl)\n ) : (\n <Grid item={{ area: 'search' }}>\n {!isMedium && searchTitle}\n {searchInput}\n </Grid>\n )}\n <Grid item={{ area: 'meta' }} container={{ rowGap: 1 }}>\n <Flex container={{ justify: 'between', alignItems: 'center' }}>\n {!loading && (\n <Text as={StyledCountText} variant='secondary'>\n {submittedSearchValue !== '' || results.length > 0\n ? t('results_count', [count], { count })\n : ''}\n </Text>\n )}\n {!isMedium && !!filters.length && (\n <Button variant='simple' onClick={openFiltersModal}>\n <Icon name={activeFilters.length > 0 ? 'filter-on' : 'filter'} />\n &nbsp;{t('filters')}&nbsp;\n <Count>{activeFilters.length}</Count>\n </Button>\n )}\n </Flex>\n {!!activeFilters.length && (\n <Flex as={StyledSelectedFilters} container={{ gap: 1, wrap: 'wrap' }}>\n {activeFilters.map(filter => {\n return (\n <Selectable\n key={filter.id}\n id={filter.id}\n onRemove={() =>\n onFilterChange?.({\n name: filter.groupName,\n type: filter.type,\n value: filter.resetValue\n })\n }\n >\n {`${filter.groupName}: ${filter.name}`}\n </Selectable>\n );\n })}\n </Flex>\n )}\n </Grid>\n <Grid\n item={{ area: 'items', alignSelf: results.length ? 'start' : 'stretch' }}\n container={{ rowGap: 2 }}\n >\n {!loading && (\n <>\n {results.length ? (\n results.map((result: SearchResultProps) => {\n return <SearchResult key={result.id} {...result} accent={accent} />;\n })\n ) : (\n <Grid item={{ alignSelf: 'stretch' }}>\n <EmptyState\n message={submittedSearchValue === '' ? t('empty_search') : undefined}\n />\n </Grid>\n )}\n {onShowMore && (\n <Flex container={{ justify: 'center' }}>\n <Button variant='link' onClick={onShowMore}>\n {t('show_more')}\n </Button>\n </Flex>\n )}\n </>\n )}\n </Grid>\n </Grid>\n </Grid>\n );\n }\n);\n\nexport default SearchResults;\n"]}
1
+ {"version":3,"file":"SearchResults.js","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResults.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useContext, useRef, useState } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ComponentProps } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport {\n Button,\n Count,\n Flex,\n Grid,\n Icon,\n registerIcon,\n Modal,\n EmptyState,\n SearchInput,\n Selectable,\n Text,\n useModalManager,\n useI18n,\n useBreakpoint,\n useAfterInitialEffect,\n SummaryItem,\n Avatar,\n useTheme,\n AppShellContext,\n Progress\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, ModalMethods } from '@pega/cosmos-react-core';\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 type {\n SearchResultsProps,\n SearchResultProps,\n FilterProps,\n ActiveFilters\n} from './SearchResults.types';\nimport SearchResult from './SearchResult';\nimport Filter from './Filter';\nimport {\n StyledModalFilterContent,\n StyledCountText,\n StyledSelectedFilters,\n StyledSearchResults,\n StyledResults,\n StyledFilters,\n StyledSearchSummaryItem\n} from './SearchResults.styles';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nconst FilterModal = (\n props: Pick<\n SearchResultsProps,\n 'count' | 'filters' | 'onFilterChange' | 'onClearFilter' | 'onClearAllFilters'\n > & {\n activeFilters: ActiveFilters[];\n }\n) => {\n const { activeFilters, count, filters, onFilterChange, onClearFilter, onClearAllFilters } = props;\n const t = useI18n();\n\n return (\n <Modal heading={t('filters')} autoWidth>\n <Grid as={StyledModalFilterContent} container={{ rowGap: 2 }}>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Text as={StyledCountText} variant='secondary'>\n {t('results_count', [count], { count })}\n </Text>\n {onClearAllFilters && !!activeFilters.length && (\n <Button variant='link' onClick={onClearAllFilters}>\n {t('clear_all')}\n </Button>\n )}\n </Flex>\n {!!activeFilters.length && (\n <Flex as={StyledSelectedFilters} container={{ gap: 1 }}>\n {activeFilters.map(filter => {\n return (\n <Selectable\n key={filter.id}\n id={filter.id}\n onRemove={() =>\n onFilterChange?.({\n name: filter.groupName,\n type: filter.type,\n value: filter.resetValue\n })\n }\n >\n {`${filter.groupName}: ${filter.name}`}\n </Selectable>\n );\n })}\n </Flex>\n )}\n <div>\n {filters.map((filter: FilterProps) => {\n return (\n <Filter\n key={filter.name}\n onFilterChange={onFilterChange}\n onClearFilter={onClearFilter}\n {...filter}\n />\n );\n })}\n </div>\n </Grid>\n </Modal>\n );\n};\n\nconst SearchResults: FunctionComponent<SearchResultsProps & ForwardProps> = forwardRef(\n function SearchResults(\n {\n results,\n searchInputProps,\n count,\n filters,\n onFilterChange,\n onClearAllFilters,\n onClearFilter,\n onShowMore,\n loading = false,\n ...restProps\n }: PropsWithoutRef<SearchResultsProps>,\n ref: SearchResultsProps['ref']\n ) {\n const t = useI18n();\n const isMedium = useBreakpoint('md');\n const { create } = useModalManager();\n const { searchContainerEl } = useContext(AppShellContext);\n const filtersMethods = useRef<ModalMethods<ComponentProps<typeof FilterModal>>>();\n const { placeholder = t('search_placeholder_default') } = searchInputProps;\n const {\n base: {\n palette: { 'brand-primary': primary }\n }\n } = useTheme();\n const [accent, setAccent] = useState<undefined | RegExp>();\n const [submittedSearchValue, setSubmittedSearchValue] = useState(searchInputProps.value);\n\n const activeFilters: ActiveFilters[] = filters.flatMap(group => {\n if (group.type === 'select') {\n return group.items.flatMap(item => {\n if (item.checked) {\n return {\n id: item.id,\n name: item.name,\n resetValue: { ...item, checked: false },\n groupName: group.name,\n type: group.type\n };\n }\n return [];\n });\n }\n return [];\n });\n\n const openFiltersModal = () => {\n filtersMethods.current = create(FilterModal, {\n activeFilters,\n count,\n filters,\n onFilterChange,\n onClearFilter,\n onClearAllFilters\n });\n };\n\n useAfterInitialEffect(() => {\n if (filtersMethods.current) {\n filtersMethods.current.update({\n activeFilters,\n count,\n filters\n });\n }\n }, [activeFilters, count, filters]);\n\n useAfterInitialEffect(() => {\n if (isMedium && filtersMethods.current) filtersMethods.current.dismiss();\n }, [isMedium]);\n\n useAfterInitialEffect(() => {\n setAccent(submittedSearchValue ? new RegExp(submittedSearchValue, 'gi') : undefined);\n }, [submittedSearchValue]);\n\n const searchTitle = (\n <SummaryItem\n as={StyledSearchSummaryItem}\n visual={\n <Avatar\n icon='search'\n name='search'\n shape='squircle'\n backgroundColor={primary}\n color='white'\n />\n }\n primary={<Text variant='h1'>{t('search')}</Text>}\n actions={\n onClearAllFilters &&\n isMedium &&\n !!activeFilters.length && (\n <Button variant='link' onClick={onClearAllFilters}>\n {t('clear_all')}\n </Button>\n )\n }\n />\n );\n const searchInput = (\n <SearchInput\n {...searchInputProps}\n onSearchSubmit={val => {\n searchInputProps.onSearchSubmit?.(val);\n setSubmittedSearchValue(val);\n }}\n placeholder={placeholder}\n />\n );\n\n return (\n <Grid\n {...restProps}\n as={StyledSearchResults}\n ref={ref}\n md={\n filters.length\n ? {\n container: {\n cols: '15rem auto'\n }\n }\n : undefined\n }\n sm={\n filters.length\n ? {\n container: {\n cols: 'auto',\n rowGap: 2\n }\n }\n : undefined\n }\n container={{\n rows: 'auto auto',\n cols: 'auto 1fr',\n areas: '\"filters results\"'\n }}\n >\n {isMedium && !!filters.length && (\n <Grid item={{ area: 'filters', alignSelf: 'start' }} as={StyledFilters}>\n {searchTitle}\n {filters.map((filter: FilterProps) => {\n return (\n <Filter\n key={filter.name}\n onFilterChange={onFilterChange}\n onClearFilter={onClearFilter}\n {...filter}\n />\n );\n })}\n </Grid>\n )}\n <Grid\n item={{ alignSelf: 'start', area: 'results' }}\n container={{\n alignItems: 'center',\n rowGap: 2,\n rows: 'auto auto 1fr',\n areas: '\"search\" \"meta\" \"items\"'\n }}\n as={StyledResults}\n >\n {loading && <Progress placement='local' />}\n {searchContainerEl && isMedium ? (\n createPortal(searchInput, searchContainerEl)\n ) : (\n <Grid item={{ area: 'search' }}>\n {!isMedium && searchTitle}\n {searchInput}\n </Grid>\n )}\n <Grid item={{ area: 'meta' }} container={{ rowGap: 1 }}>\n <Flex container={{ justify: 'between', alignItems: 'center' }}>\n {!loading && (\n <Text as={StyledCountText} variant='secondary'>\n {submittedSearchValue !== '' || results.length > 0\n ? t('results_count', [count], { count })\n : ''}\n </Text>\n )}\n {!isMedium && !!filters.length && (\n <Button variant='simple' onClick={openFiltersModal}>\n <Icon name={activeFilters.length > 0 ? 'filter-on' : 'filter'} />\n &nbsp;{t('filters')}&nbsp;\n <Count>{activeFilters.length}</Count>\n </Button>\n )}\n </Flex>\n {!!activeFilters.length && (\n <Flex as={StyledSelectedFilters} container={{ gap: 1, wrap: 'wrap' }}>\n {activeFilters.map(filter => {\n return (\n <Selectable\n key={filter.id}\n id={filter.id}\n onRemove={() =>\n onFilterChange?.({\n name: filter.groupName,\n type: filter.type,\n value: filter.resetValue\n })\n }\n >\n {`${filter.groupName}: ${filter.name}`}\n </Selectable>\n );\n })}\n </Flex>\n )}\n </Grid>\n <Grid\n item={{ area: 'items', alignSelf: results.length ? 'start' : 'stretch' }}\n container={{ rowGap: 2 }}\n >\n {!loading && (\n <>\n {results.length ? (\n results.map((result: SearchResultProps) => {\n return <SearchResult key={result.id} {...result} accent={accent} />;\n })\n ) : (\n <Grid item={{ alignSelf: 'stretch' }}>\n <EmptyState\n message={submittedSearchValue === '' ? t('empty_search') : undefined}\n />\n </Grid>\n )}\n {onShowMore && (\n <Flex container={{ justify: 'center' }}>\n <Button variant='link' onClick={onShowMore}>\n {t('show_more')}\n </Button>\n </Flex>\n )}\n </>\n )}\n </Grid>\n </Grid>\n </Grid>\n );\n }\n);\n\nexport default SearchResults;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"TaskList.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,SAAS,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAoB5F,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAItF,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,EAAE,EAAE,MAAM,CAAC;IACX,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wDAAwD;IACxD,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC7E,sCAAsC;IACtC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,iBAAiB,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;CAC3C;AAED,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,UAAU,YAAY;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;CAC7B;AAmBD,eAAO,MAAM,QAAQ;sCAamC,YAAY,KAAK,IAAI;;;CA4D5E,CAAC;;;;AAgEF,wBAAyD"}
1
+ {"version":3,"file":"TaskList.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,SAAS,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAoB5F,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAItF,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,EAAE,EAAE,MAAM,CAAC;IACX,8CAA8C;IAC9C,IAAI,EAAE,MAAM,CAAC;IACb,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,wDAAwD;IACxD,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC7E,sCAAsC;IACtC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,+CAA+C;IAC/C,iBAAiB,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;CAC3C;AAED,MAAM,WAAW,aAAc,SAAQ,UAAU;IAC/C,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAED,UAAU,YAAY;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;CAC7B;AAsBD,eAAO,MAAM,QAAQ;sCAamC,YAAY,KAAK,IAAI;;;CA4D5E,CAAC;;;;AAgEF,wBAAyD"}
@@ -6,12 +6,15 @@ import { SummaryItem, StyledSummaryListItem, Flex, defaultThemeProp, Button, use
6
6
  import { getTaskListTestIds, getTaskItemTestIds } from './Tasks.test-ids';
7
7
  const StyledTaskList = styled.ul(({ theme, hasFooter }) => {
8
8
  return css `
9
- ${hasFooter &&
10
- css `
11
- > li:last-child {
12
- border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
13
- }
14
- `}
9
+ > li:last-child {
10
+ ${hasFooter
11
+ ? css `
12
+ border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
13
+ `
14
+ : css `
15
+ padding-block-end: 0;
16
+ `}
17
+ }
15
18
 
16
19
  ${StyledBreadcrumbs} > ${StyledText} {
17
20
  font-weight: ${theme.base['font-weight']['semi-bold']};
@@ -34,7 +37,7 @@ export const TaskItem = withTestIds(({ testId, id, name, avatar, meta, processNa
34
37
  ] })) : (name), secondary: meta, actions: content
35
38
  ? additionalActions && _jsx(Actions, { menuAt: 1, items: additionalActions })
36
39
  : onOpen && (_jsxs(Button, { "data-testid": testIds.openTask, variant: 'primary', onClick: (e) => onOpen(id, e), children: [_jsx("span", { children: t('go') }), _jsx(VisuallyHiddenText, { children: `-${processName ?? ''} ${name}` })] })) }));
37
- return (_jsxs(Flex, { "data-testid": testIds.root, ...restProps, container: { direction: 'column', gap: 1 }, item: { grow: 1 }, as: StyledSummaryListItem, forwardedAs: 'li', children: [summary, content] }));
40
+ return (_jsxs(Flex, { "data-testid": testIds.root, ...restProps, container: { direction: 'column', gap: 2 }, item: { grow: 1 }, as: content ? undefined : StyledSummaryListItem, forwardedAs: content ? 'div' : 'li', children: [summary, content] }));
38
41
  }, getTaskItemTestIds);
39
42
  const TaskList = forwardRef(function TaskList({ testId, items, hasFooter = false }, ref) {
40
43
  const testIds = useTestIds(testId, getTaskListTestIds);
@@ -74,7 +77,7 @@ const TaskList = forwardRef(function TaskList({ testId, items, hasFooter = false
74
77
  announcements.current = [...announcements.current, announcement];
75
78
  debouncedAnnounce();
76
79
  };
77
- return (_jsx(Flex, { "data-testid": testIds.root, container: { direction: 'column' }, as: StyledTaskList, hasFooter: hasFooter, ref: ref, children: items.map((item, i) => (_createElement(TaskItem, { ...item, addAnnouncement: addAnnouncement, key: `${i + 1}` }))) }));
80
+ return (_jsx(Flex, { "data-testid": testIds.root, container: { direction: 'column' }, as: StyledTaskList, hasFooter: hasFooter, ref: ref, children: items.map(item => (_createElement(TaskItem, { ...item, addAnnouncement: addAnnouncement, key: item.id }))) }));
78
81
  });
79
82
  export default withTestIds(TaskList, getTaskListTestIds);
80
83
  //# sourceMappingURL=TaskList.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TaskList.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ReactNode, Ref, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryItem,\n StyledSummaryListItem,\n Flex,\n defaultThemeProp,\n Button,\n useI18n,\n VisuallyHiddenText,\n Breadcrumbs,\n StyledBreadcrumbs,\n StyledText,\n useTestIds,\n useLiveLog,\n debounce,\n Actions,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, TestIdProp, ActionsProps } from '@pega/cosmos-react-core';\n\nimport { getTaskListTestIds, getTaskItemTestIds } from './Tasks.test-ids';\n\nexport interface TaskItemProps extends TestIdProp {\n id: string;\n /** Name of the task displayed in the list. */\n name: string;\n /** Name of the process for the task. */\n processName?: string;\n /** Avatar element to represent the task's assignee. */\n avatar?: ReactNode;\n /** MetaList element with info related to the task. */\n meta?: ReactNode;\n /** Provide a callback to render a button for a task. */\n onOpen?: (id: TaskItemProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n /** Content for the task when open. */\n content?: ReactNode;\n /** An array of actions to add to open task. */\n additionalActions?: ActionsProps['items'];\n}\n\nexport interface TaskListProps extends TestIdProp {\n items: TaskItemProps[];\n hasFooter?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLElement>;\n}\n\ninterface Announcement {\n name: string;\n status: 'removed' | 'added';\n}\n\nconst StyledTaskList = styled.ul<{ hasFooter: boolean }>(({ theme, hasFooter }) => {\n return css`\n ${hasFooter &&\n css`\n > li:last-child {\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n }\n `}\n\n ${StyledBreadcrumbs} > ${StyledText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n `;\n});\n\nStyledTaskList.defaultProps = defaultThemeProp;\n\nexport const TaskItem = withTestIds(\n ({\n testId,\n id,\n name,\n avatar,\n meta,\n processName,\n onOpen,\n content,\n addAnnouncement,\n additionalActions,\n ...restProps\n }: TaskItemProps & { addAnnouncement?: (announcement: Announcement) => void }) => {\n const testIds = useTestIds(testId, getTaskItemTestIds);\n const t = useI18n();\n\n useEffect(() => {\n addAnnouncement?.({ name, status: 'added' });\n\n return () => {\n addAnnouncement?.({ name, status: 'removed' });\n };\n }, []);\n\n const summary = (\n <SummaryItem\n visual={avatar}\n primary={\n processName ? (\n <Breadcrumbs\n path={[\n { id: 'processName', primary: processName },\n { id: 'name', primary: name }\n ]}\n />\n ) : (\n name\n )\n }\n secondary={meta}\n actions={\n content\n ? additionalActions && <Actions menuAt={1} items={additionalActions} />\n : onOpen && (\n <Button\n data-testid={testIds.openTask}\n variant='primary'\n onClick={(e: MouseEvent<HTMLButtonElement>) => onOpen(id, e)}\n >\n <span>{t('go')}</span>\n <VisuallyHiddenText>{`-${processName ?? ''} ${name}`}</VisuallyHiddenText>\n </Button>\n )\n }\n />\n );\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n container={{ direction: 'column', gap: 1 }}\n item={{ grow: 1 }}\n as={StyledSummaryListItem}\n forwardedAs='li'\n >\n {summary}\n {content}\n </Flex>\n );\n },\n getTaskItemTestIds\n);\n\nconst TaskList: FunctionComponent<TaskListProps & ForwardProps> = forwardRef(function TaskList(\n { testId, items, hasFooter = false }: PropsWithoutRef<TaskListProps>,\n ref\n) {\n const testIds = useTestIds(testId, getTaskListTestIds);\n const t = useI18n();\n const { announcePolite } = useLiveLog();\n const announcements = useRef<Announcement[]>([]);\n const mounted = useRef(false);\n\n useEffect(() => {\n mounted.current = true;\n\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const debouncedAnnounce = debounce(() => {\n if (announcements.current.length > 0) {\n let tasksAdded = 0;\n let tasksRemoved = 0;\n announcements.current.forEach(item => {\n if (item.status === 'removed') {\n tasksRemoved += 1;\n } else {\n tasksAdded += 1;\n }\n });\n let message = tasksAdded ? t('tasks_added', [tasksAdded], { count: tasksAdded }) : '';\n if (tasksRemoved) {\n message += t('tasks_removed', [tasksRemoved], { count: tasksRemoved });\n }\n\n if (mounted.current) {\n announcePolite({ message });\n }\n\n announcements.current = [];\n }\n }, 2000);\n\n const addAnnouncement = (announcement: Announcement) => {\n announcements.current = [...announcements.current, announcement];\n debouncedAnnounce();\n };\n\n return (\n <Flex\n data-testid={testIds.root}\n container={{ direction: 'column' }}\n as={StyledTaskList}\n hasFooter={hasFooter}\n ref={ref}\n >\n {items.map((item, i) => (\n <TaskItem {...item} addAnnouncement={addAnnouncement} key={`${i + 1}`} />\n ))}\n </Flex>\n );\n});\n\nexport default withTestIds(TaskList, getTaskListTestIds);\n"]}
1
+ {"version":3,"file":"TaskList.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ReactNode, Ref, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryItem,\n StyledSummaryListItem,\n Flex,\n defaultThemeProp,\n Button,\n useI18n,\n VisuallyHiddenText,\n Breadcrumbs,\n StyledBreadcrumbs,\n StyledText,\n useTestIds,\n useLiveLog,\n debounce,\n Actions,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, TestIdProp, ActionsProps } from '@pega/cosmos-react-core';\n\nimport { getTaskListTestIds, getTaskItemTestIds } from './Tasks.test-ids';\n\nexport interface TaskItemProps extends TestIdProp {\n id: string;\n /** Name of the task displayed in the list. */\n name: string;\n /** Name of the process for the task. */\n processName?: string;\n /** Avatar element to represent the task's assignee. */\n avatar?: ReactNode;\n /** MetaList element with info related to the task. */\n meta?: ReactNode;\n /** Provide a callback to render a button for a task. */\n onOpen?: (id: TaskItemProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n /** Content for the task when open. */\n content?: ReactNode;\n /** An array of actions to add to open task. */\n additionalActions?: ActionsProps['items'];\n}\n\nexport interface TaskListProps extends TestIdProp {\n items: TaskItemProps[];\n hasFooter?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLElement>;\n}\n\ninterface Announcement {\n name: string;\n status: 'removed' | 'added';\n}\n\nconst StyledTaskList = styled.ul<{ hasFooter: boolean }>(({ theme, hasFooter }) => {\n return css`\n > li:last-child {\n ${hasFooter\n ? css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `\n : css`\n padding-block-end: 0;\n `}\n }\n\n ${StyledBreadcrumbs} > ${StyledText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n `;\n});\n\nStyledTaskList.defaultProps = defaultThemeProp;\n\nexport const TaskItem = withTestIds(\n ({\n testId,\n id,\n name,\n avatar,\n meta,\n processName,\n onOpen,\n content,\n addAnnouncement,\n additionalActions,\n ...restProps\n }: TaskItemProps & { addAnnouncement?: (announcement: Announcement) => void }) => {\n const testIds = useTestIds(testId, getTaskItemTestIds);\n const t = useI18n();\n\n useEffect(() => {\n addAnnouncement?.({ name, status: 'added' });\n\n return () => {\n addAnnouncement?.({ name, status: 'removed' });\n };\n }, []);\n\n const summary = (\n <SummaryItem\n visual={avatar}\n primary={\n processName ? (\n <Breadcrumbs\n path={[\n { id: 'processName', primary: processName },\n { id: 'name', primary: name }\n ]}\n />\n ) : (\n name\n )\n }\n secondary={meta}\n actions={\n content\n ? additionalActions && <Actions menuAt={1} items={additionalActions} />\n : onOpen && (\n <Button\n data-testid={testIds.openTask}\n variant='primary'\n onClick={(e: MouseEvent<HTMLButtonElement>) => onOpen(id, e)}\n >\n <span>{t('go')}</span>\n <VisuallyHiddenText>{`-${processName ?? ''} ${name}`}</VisuallyHiddenText>\n </Button>\n )\n }\n />\n );\n\n return (\n <Flex\n data-testid={testIds.root}\n {...restProps}\n container={{ direction: 'column', gap: 2 }}\n item={{ grow: 1 }}\n as={content ? undefined : StyledSummaryListItem}\n forwardedAs={content ? 'div' : 'li'}\n >\n {summary}\n {content}\n </Flex>\n );\n },\n getTaskItemTestIds\n);\n\nconst TaskList: FunctionComponent<TaskListProps & ForwardProps> = forwardRef(function TaskList(\n { testId, items, hasFooter = false }: PropsWithoutRef<TaskListProps>,\n ref\n) {\n const testIds = useTestIds(testId, getTaskListTestIds);\n const t = useI18n();\n const { announcePolite } = useLiveLog();\n const announcements = useRef<Announcement[]>([]);\n const mounted = useRef(false);\n\n useEffect(() => {\n mounted.current = true;\n\n return () => {\n mounted.current = false;\n };\n }, []);\n\n const debouncedAnnounce = debounce(() => {\n if (announcements.current.length > 0) {\n let tasksAdded = 0;\n let tasksRemoved = 0;\n announcements.current.forEach(item => {\n if (item.status === 'removed') {\n tasksRemoved += 1;\n } else {\n tasksAdded += 1;\n }\n });\n let message = tasksAdded ? t('tasks_added', [tasksAdded], { count: tasksAdded }) : '';\n if (tasksRemoved) {\n message += t('tasks_removed', [tasksRemoved], { count: tasksRemoved });\n }\n\n if (mounted.current) {\n announcePolite({ message });\n }\n\n announcements.current = [];\n }\n }, 2000);\n\n const addAnnouncement = (announcement: Announcement) => {\n announcements.current = [...announcements.current, announcement];\n debouncedAnnounce();\n };\n\n return (\n <Flex\n data-testid={testIds.root}\n container={{ direction: 'column' }}\n as={StyledTaskList}\n hasFooter={hasFooter}\n ref={ref}\n >\n {items.map(item => (\n <TaskItem {...item} addAnnouncement={addAnnouncement} key={item.id} />\n ))}\n </Flex>\n );\n});\n\nexport default withTestIds(TaskList, getTaskListTestIds);\n"]}
@@ -21,7 +21,6 @@ export interface TasksProps extends NoChildrenProp, TestIdProp {
21
21
  export declare const StyledTasks: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").CardProps & ForwardProps>, import("styled-components").DefaultTheme, {
22
22
  openItem?: boolean | undefined;
23
23
  }, never>;
24
- export declare const StyledTaskCardContent: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").CardContentProps & ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
25
24
  declare const _default: FC<ForwardProps & TasksProps> & {
26
25
  getTestIds: (testIdProp?: string | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["show-more-less"]>;
27
26
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Tasks.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAc,MAAM,OAAO,CAAC;AAkB5C,OAAO,KAAK,EACV,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,UAAU,EACX,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sEAAsE,CAAC;AAG9G,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,MAAM,WAAW,UAAW,SAAQ,cAAc,EAAE,UAAU;IAC5D,sDAAsD;IACtD,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,qDAAqD;IACrD,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC/B,6CAA6C;IAC7C,MAAM,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,QAAQ,CAAC,CAAC;IACpE,oCAAoC;IACpC,YAAY,CAAC,EAAE,IAAI,CAAC,iBAAiB,EAAE,OAAO,GAAG,cAAc,CAAC,CAAC;IACjE,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,MAAM,CAAC,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,gBAAgB,CAAC,CAAC;IAC5D,qJAAqJ;IACrJ,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,eAAO,MAAM,WAAW;;SAUtB,CAAC;AAIH,eAAO,MAAM,qBAAqB,wMAUjC,CAAC;;;;AAuEF,wBAAmD"}
1
+ {"version":3,"file":"Tasks.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAc,MAAM,OAAO,CAAC;AAiB5C,OAAO,KAAK,EACV,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,UAAU,EACX,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sEAAsE,CAAC;AAG9G,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,MAAM,WAAW,UAAW,SAAQ,cAAc,EAAE,UAAU;IAC5D,sDAAsD;IACtD,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,qDAAqD;IACrD,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC/B,6CAA6C;IAC7C,MAAM,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,QAAQ,CAAC,CAAC;IACpE,oCAAoC;IACpC,YAAY,CAAC,EAAE,IAAI,CAAC,iBAAiB,EAAE,OAAO,GAAG,cAAc,CAAC,CAAC;IACjE,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mCAAmC;IACnC,MAAM,CAAC,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,GAAG,gBAAgB,CAAC,CAAC;IAC5D,qJAAqJ;IACrJ,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,eAAO,MAAM,WAAW;;SAUtB,CAAC;;;;AAwEH,wBAAmD"}
@@ -1,9 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useMemo } from 'react';
3
3
  import styled, { css } from 'styled-components';
4
- import { Card, CardHeader, CardContent, CardFooter, Button, useI18n, defaultThemeProp, ListToolbar, EmptyState, useTestIds, Avatar, withTestIds, StyledCard } from '@pega/cosmos-react-core';
4
+ import { Card, CardHeader, CardContent, CardFooter, Button, useI18n, defaultThemeProp, ListToolbar, EmptyState, useTestIds, Avatar, withTestIds } from '@pega/cosmos-react-core';
5
5
  import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
6
- import { StyledCardFooter } from '@pega/cosmos-react-core/lib/components/Card/CardFooter';
7
6
  import TaskList, { TaskItem } from './TaskList';
8
7
  import { getTasksTestIds } from './Tasks.test-ids';
9
8
  export const StyledTasks = styled(Card)(({ theme, openItem }) => {
@@ -18,16 +17,6 @@ export const StyledTasks = styled(Card)(({ theme, openItem }) => {
18
17
  `;
19
18
  });
20
19
  StyledTasks.defaultProps = defaultThemeProp;
21
- export const StyledTaskCardContent = styled(CardContent)(({ theme }) => css `
22
- &:not(${StyledCard} ${StyledCard} > &) {
23
- padding-block-end: calc(${theme.base.spacing} / 2);
24
-
25
- & + ${StyledCardFooter} {
26
- padding-block-start: ${theme.base.spacing};
27
- }
28
- }
29
- `);
30
- StyledTaskCardContent.defaultProps = defaultThemeProp;
31
20
  const Tasks = (props) => {
32
21
  const { testId, items = [], name, avatar, viewSelector, count = items.length, search, onExpandToggle, ...restProps } = props;
33
22
  const testIds = useTestIds(testId, getTasksTestIds);
@@ -37,7 +26,7 @@ const Tasks = (props) => {
37
26
  const TaskItems = useMemo(() => {
38
27
  return openItem ? (_jsx(TaskItem, { ...openItem })) : (_jsx(TaskList, { items: items, hasFooter: hasFooter, testId: testIds.root }));
39
28
  }, [items, openItem]);
40
- return (_jsxs(StyledTasks, { "data-testid": testIds.root, ...restProps, openItem: !!openItem, "data-app-region": true, children: [!openItem && (_jsxs(CardHeader, { container: { justify: 'start', alignItems: 'center', gap: 1 }, children: [avatar && _jsx(Avatar, { ...avatar }), _jsx(ListToolbar, { name: name, headingTag: 'h2', viewSelector: viewSelector, count: { total: count }, search: search, item: { grow: 1 } })] })), _jsx(StyledTaskCardContent, { children: items.length > 0 ? TaskItems : _jsx(EmptyState, {}) }), hasFooter && (_jsx(CardFooter, { justify: 'center', children: _jsx(Button, { "data-testid": testIds.showMoreLess, variant: 'link', "aria-label": t(!!count && count > items.length ? 'show_more' : 'show_less', ['tasks']), onClick: (e) => {
29
+ return (_jsxs(StyledTasks, { "data-testid": testIds.root, ...restProps, openItem: !!openItem, "data-app-region": true, children: [!openItem && (_jsxs(CardHeader, { container: { justify: 'start', alignItems: 'center', gap: 1 }, children: [avatar && _jsx(Avatar, { ...avatar }), _jsx(ListToolbar, { name: name, headingTag: 'h2', viewSelector: viewSelector, count: { total: count }, search: search, item: { grow: 1 } })] })), _jsx(CardContent, { children: items.length > 0 ? TaskItems : _jsx(EmptyState, {}) }), hasFooter && (_jsx(CardFooter, { justify: 'center', children: _jsx(Button, { "data-testid": testIds.showMoreLess, variant: 'link', "aria-label": t(!!count && count > items.length ? 'show_more' : 'show_less', ['tasks']), onClick: (e) => {
41
30
  onExpandToggle?.();
42
31
  if (!!count && count <= items.length) {
43
32
  const { currentTarget } = e;
@@ -1 +1 @@
1
- {"version":3,"file":"Tasks.js","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,IAAI,EACJ,UAAU,EACV,WAAW,EACX,UAAU,EACV,MAAM,EACN,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,UAAU,EACV,MAAM,EACN,WAAW,EACX,UAAU,EACX,MAAM,yBAAyB,CAAC;AASjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAC1F,OAAO,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAG1F,OAAO,QAAQ,EAAE,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEhD,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAmBnD,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;IACtF,OAAO,QAAQ;QACb,CAAC,CAAC,GAAG,CAAA;sBACa,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG;OACpC;QACH,CAAC,CAAC,GAAG,CAAA;UACC,gBAAgB,cAAc,gBAAgB;oCACpB,KAAK,CAAC,IAAI,CAAC,OAAO;;OAE/C,CAAC;AACR,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE5C,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,WAAW,CAAC,CACtD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;YACR,UAAU,IAAI,UAAU;gCACJ,KAAK,CAAC,IAAI,CAAC,OAAO;;YAEtC,gBAAgB;+BACG,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAG9C,CACF,CAAC;AAEF,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,KAAK,GAAkC,CAAC,KAAiB,EAAE,EAAE;IACjE,MAAM,EACJ,MAAM,EACN,KAAK,GAAG,EAAE,EACV,IAAI,EACJ,MAAM,EACN,YAAY,EACZ,KAAK,GAAG,KAAK,CAAC,MAAM,EACpB,MAAM,EACN,cAAc,EACd,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;IACpD,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAClD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,cAAc,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC;IAE/D,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE;QAC7B,OAAO,QAAQ,CAAC,CAAC,CAAC,CAChB,KAAC,QAAQ,OAAK,QAAQ,GAAI,CAC3B,CAAC,CAAC,CAAC,CACF,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC,IAAI,GAAI,CACvE,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtB,OAAO,CACL,MAAC,WAAW,mBAAc,OAAO,CAAC,IAAI,KAAM,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ,sCACxE,CAAC,QAAQ,IAAI,CACZ,MAAC,UAAU,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACtE,MAAM,IAAI,KAAC,MAAM,OAAK,MAAM,GAAI,EACjC,KAAC,WAAW,IACV,IAAI,EAAE,IAAI,EACV,UAAU,EAAC,IAAI,EACf,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,EACvB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GACjB,IACS,CACd,EACD,KAAC,qBAAqB,cAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAC,UAAU,KAAG,GAAyB,EAE7F,SAAS,IAAI,CACZ,KAAC,UAAU,IAAC,OAAO,EAAC,QAAQ,YAC1B,KAAC,MAAM,mBACQ,OAAO,CAAC,YAAY,EACjC,OAAO,EAAC,MAAM,gBACF,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,CAAC,EACrF,OAAO,EAAE,CAAC,CAAgC,EAAE,EAAE;wBAC5C,cAAc,EAAE,EAAE,CAAC;wBACnB,IAAI,CAAC,CAAC,KAAK,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE;4BACpC,MAAM,EAAE,aAAa,EAAE,GAAG,CAAC,CAAC;4BAC5B,qBAAqB,CAAC,GAAG,EAAE;gCACzB,IAAI,aAAa,CAAC,qBAAqB,EAAE,CAAC,GAAG,GAAG,CAAC;oCAAE,aAAa,CAAC,cAAc,EAAE,CAAC;4BACpF,CAAC,CAAC,CAAC;yBACJ;oBACH,CAAC,YAEA,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,GACxD,GACE,CACd,IACW,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC","sourcesContent":["import { useMemo } from 'react';\nimport type { FC, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n Button,\n useI18n,\n defaultThemeProp,\n ListToolbar,\n EmptyState,\n useTestIds,\n Avatar,\n withTestIds,\n StyledCard\n} from '@pega/cosmos-react-core';\nimport type {\n AvatarProps,\n ForwardProps,\n ListToolbarProps,\n NoChildrenProp,\n SearchInputProps,\n TestIdProp\n} from '@pega/cosmos-react-core';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport { StyledCardFooter } from '@pega/cosmos-react-core/lib/components/Card/CardFooter';\nimport type { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\n\nimport TaskList, { TaskItem } from './TaskList';\nimport type { TaskItemProps } from './TaskList';\nimport { getTasksTestIds } from './Tasks.test-ids';\n\nexport interface TasksProps extends NoChildrenProp, TestIdProp {\n /** An array of TaskItemProps to generate the list. */\n items: TaskItemProps[];\n /** Heading text to render at the top of the list. */\n name: ListToolbarProps['name'];\n /** A visual to accompany the header text. */\n avatar?: Pick<AvatarProps, 'name' | 'icon' | 'imageSrc' | 'status'>;\n /** Definition of view selection. */\n viewSelector?: Pick<ViewSelectorProps, 'views' | 'onViewSelect'>;\n /** Integer representing the total count of tasks. */\n count?: number;\n /** Opt-in search configuration. */\n search?: Pick<SearchInputProps, 'value' | 'onSearchChange'>;\n /** Callback for when to show more/less button is clicked. Lists greater than 3 items will display the show toggle button in its footer if passed. */\n onExpandToggle?: () => void;\n}\n\nexport const StyledTasks = styled(Card)<{ openItem?: boolean }>(({ theme, openItem }) => {\n return openItem\n ? css`\n box-shadow: ${theme.base.shadow.low};\n `\n : css`\n ${StyledCardHeader}:not(& & > ${StyledCardHeader}) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n }\n `;\n});\n\nStyledTasks.defaultProps = defaultThemeProp;\n\nexport const StyledTaskCardContent = styled(CardContent)(\n ({ theme }) => css`\n &:not(${StyledCard} ${StyledCard} > &) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n\n & + ${StyledCardFooter} {\n padding-block-start: ${theme.base.spacing};\n }\n }\n `\n);\n\nStyledTaskCardContent.defaultProps = defaultThemeProp;\n\nconst Tasks: FC<ForwardProps & TasksProps> = (props: TasksProps) => {\n const {\n testId,\n items = [],\n name,\n avatar,\n viewSelector,\n count = items.length,\n search,\n onExpandToggle,\n ...restProps\n } = props;\n const testIds = useTestIds(testId, getTasksTestIds);\n const openItem = items.find(item => item.content);\n const t = useI18n();\n\n const hasFooter = !!(!openItem && onExpandToggle && count > 0);\n\n const TaskItems = useMemo(() => {\n return openItem ? (\n <TaskItem {...openItem} />\n ) : (\n <TaskList items={items} hasFooter={hasFooter} testId={testIds.root} />\n );\n }, [items, openItem]);\n\n return (\n <StyledTasks data-testid={testIds.root} {...restProps} openItem={!!openItem} data-app-region>\n {!openItem && (\n <CardHeader container={{ justify: 'start', alignItems: 'center', gap: 1 }}>\n {avatar && <Avatar {...avatar} />}\n <ListToolbar\n name={name}\n headingTag='h2'\n viewSelector={viewSelector}\n count={{ total: count }}\n search={search}\n item={{ grow: 1 }}\n />\n </CardHeader>\n )}\n <StyledTaskCardContent>{items.length > 0 ? TaskItems : <EmptyState />}</StyledTaskCardContent>\n\n {hasFooter && (\n <CardFooter justify='center'>\n <Button\n data-testid={testIds.showMoreLess}\n variant='link'\n aria-label={t(!!count && count > items.length ? 'show_more' : 'show_less', ['tasks'])}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n onExpandToggle?.();\n if (!!count && count <= items.length) {\n const { currentTarget } = e;\n requestAnimationFrame(() => {\n if (currentTarget.getBoundingClientRect().top < 0) currentTarget.scrollIntoView();\n });\n }\n }}\n >\n {t(!!count && count > items.length ? 'show_more' : 'show_less')}\n </Button>\n </CardFooter>\n )}\n </StyledTasks>\n );\n};\n\nexport default withTestIds(Tasks, getTasksTestIds);\n"]}
1
+ {"version":3,"file":"Tasks.js","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\nimport type { FC, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n Button,\n useI18n,\n defaultThemeProp,\n ListToolbar,\n EmptyState,\n useTestIds,\n Avatar,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport type {\n AvatarProps,\n ForwardProps,\n ListToolbarProps,\n NoChildrenProp,\n SearchInputProps,\n TestIdProp\n} from '@pega/cosmos-react-core';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport type { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\n\nimport TaskList, { TaskItem } from './TaskList';\nimport type { TaskItemProps } from './TaskList';\nimport { getTasksTestIds } from './Tasks.test-ids';\n\nexport interface TasksProps extends NoChildrenProp, TestIdProp {\n /** An array of TaskItemProps to generate the list. */\n items: TaskItemProps[];\n /** Heading text to render at the top of the list. */\n name: ListToolbarProps['name'];\n /** A visual to accompany the header text. */\n avatar?: Pick<AvatarProps, 'name' | 'icon' | 'imageSrc' | 'status'>;\n /** Definition of view selection. */\n viewSelector?: Pick<ViewSelectorProps, 'views' | 'onViewSelect'>;\n /** Integer representing the total count of tasks. */\n count?: number;\n /** Opt-in search configuration. */\n search?: Pick<SearchInputProps, 'value' | 'onSearchChange'>;\n /** Callback for when to show more/less button is clicked. Lists greater than 3 items will display the show toggle button in its footer if passed. */\n onExpandToggle?: () => void;\n}\n\nexport const StyledTasks = styled(Card)<{ openItem?: boolean }>(({ theme, openItem }) => {\n return openItem\n ? css`\n box-shadow: ${theme.base.shadow.low};\n `\n : css`\n ${StyledCardHeader}:not(& & > ${StyledCardHeader}) {\n padding-block-end: calc(${theme.base.spacing} / 2);\n }\n `;\n});\n\nStyledTasks.defaultProps = defaultThemeProp;\n\nconst Tasks: FC<ForwardProps & TasksProps> = (props: TasksProps) => {\n const {\n testId,\n items = [],\n name,\n avatar,\n viewSelector,\n count = items.length,\n search,\n onExpandToggle,\n ...restProps\n } = props;\n const testIds = useTestIds(testId, getTasksTestIds);\n const openItem = items.find(item => item.content);\n const t = useI18n();\n\n const hasFooter = !!(!openItem && onExpandToggle && count > 0);\n\n const TaskItems = useMemo(() => {\n return openItem ? (\n <TaskItem {...openItem} />\n ) : (\n <TaskList items={items} hasFooter={hasFooter} testId={testIds.root} />\n );\n }, [items, openItem]);\n\n return (\n <StyledTasks data-testid={testIds.root} {...restProps} openItem={!!openItem} data-app-region>\n {!openItem && (\n <CardHeader container={{ justify: 'start', alignItems: 'center', gap: 1 }}>\n {avatar && <Avatar {...avatar} />}\n <ListToolbar\n name={name}\n headingTag='h2'\n viewSelector={viewSelector}\n count={{ total: count }}\n search={search}\n item={{ grow: 1 }}\n />\n </CardHeader>\n )}\n\n <CardContent>{items.length > 0 ? TaskItems : <EmptyState />}</CardContent>\n\n {hasFooter && (\n <CardFooter justify='center'>\n <Button\n data-testid={testIds.showMoreLess}\n variant='link'\n aria-label={t(!!count && count > items.length ? 'show_more' : 'show_less', ['tasks'])}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n onExpandToggle?.();\n if (!!count && count <= items.length) {\n const { currentTarget } = e;\n requestAnimationFrame(() => {\n if (currentTarget.getBoundingClientRect().top < 0) currentTarget.scrollIntoView();\n });\n }\n }}\n >\n {t(!!count && count > items.length ? 'show_more' : 'show_less')}\n </Button>\n </CardFooter>\n )}\n </StyledTasks>\n );\n};\n\nexport default withTestIds(Tasks, getTasksTestIds);\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-work",
3
- "version": "5.0.0-dev.9.3",
3
+ "version": "6.0.1",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/pegasystems/cosmos-react.git",
@@ -12,13 +12,14 @@
12
12
  "main": "lib/index.js",
13
13
  "types": "lib/index.d.ts",
14
14
  "files": [
15
- "lib"
15
+ "lib",
16
+ "SECURITY.md"
16
17
  ],
17
18
  "scripts": {
18
19
  "build": "tsc -b tsconfig.build.json"
19
20
  },
20
21
  "dependencies": {
21
- "@pega/cosmos-react-core": "5.0.0-dev.9.3",
22
+ "@pega/cosmos-react-core": "6.0.1",
22
23
  "@types/react": "^17.0.62",
23
24
  "@types/react-dom": "^17.0.20",
24
25
  "@types/styled-components": "^5.1.26",
@@ -32,8 +33,8 @@
32
33
  "@storybook/react": "~7.5.3",
33
34
  "@testing-library/react": "^12.1.3",
34
35
  "@testing-library/user-event": "^14.5.1",
35
- "@types/dompurify": "^3.0.2",
36
- "dompurify": "^3.0.5",
36
+ "@types/dompurify": "^3.0.5",
37
+ "dompurify": "^3.0.7",
37
38
  "typescript": "~5.2.2"
38
39
  }
39
40
  }