npm - @pega/cosmos-react-work - Versions diffs - 2.0.0-dev.2.0 → 2.0.0-dev.21.1 - Mend

@pega/cosmos-react-work 2.0.0-dev.2.0 → 2.0.0-dev.21.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 (180) hide show

package/lib/components/Tags/Tags.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Tags.js","sourceRoot":"","sources":["../../../src/components/Tags/Tags.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ChangeEvent,\n ClipboardEvent,\n KeyboardEvent,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useContext,\n useMemo,\n useState,\n useEffect,\n useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n defaultThemeProp,\n BaseProps,\n ForwardProps,\n Modal,\n ModalManagerContext,\n Tag,\n Button,\n ModalMethods,\n useI18n,\n Count,\n Flex,\n Text,\n CardHeader,\n Card,\n Actions,\n Icon,\n registerIcon,\n CardContent,\n Progress,\n EmptyState,\n ErrorState,\n Popover,\n Menu,\n MenuProps,\n useConsolidatedRef,\n CardFooter,\n Banner,\n ErrorStateProps\n} from '@pega/cosmos-react-core';\nimport * as tagIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/tag.icon';\nimport { StyledTag } from '@pega/cosmos-react-core/lib/components/Badges/Tag';\nimport { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';\nimport MultiSelectInput from '@pega/cosmos-react-core/lib/components/ComboBox/MultiSelectInput/MultiSelectInput';\nimport { StyledCardFooter } from '@pega/cosmos-react-core/lib/components/Card/CardFooter';\n\nregisterIcon(tagIcon);\n\nexport interface SelectedTag {\n text: string;\n newTag?: boolean;\n}\n\nexport interface TagsProps extends BaseProps {\n /** A list of tags. */\n tags: string[];\n /**\n * A list of available tags to add from.\n * @default []\n * */\n availableTags?: string[];\n /** If true, a loading indicator will render in place of the tags list. */\n loading?: boolean;\n /** If defined, an error message will render in the component and actions will be disabled. */\n error?: boolean | string | ErrorStateProps;\n /** Callback triggered when a search query is changed in the Edit tags modal. */\n onSearch?: (filterValue: string) => void;\n /** Callback triggered when a tag is clicked. */\n onTagClick?: (tag: string) => void;\n /** Callback triggered when modified tags are submitted from the modal. */\n onEditTags?: (tags: SelectedTag[]) => Promise<void>;\n /** Ref for the Tags card. */\n ref?: Ref<HTMLElement>;\n}\n\ninterface EditTagModalProps {\n tags: TagsProps['tags'];\n availableTags: TagsProps['availableTags'];\n onSearch?: TagsProps['onSearch'];\n onEditTags: NonNullable<TagsProps['onEditTags']>;\n}\n\nexport const StyledTags = styled.article<{ isLoading?: boolean; viewAll?: boolean }>(\n ({ isLoading, theme, viewAll }) => {\n return css`\n ${StyledCardContent} {\n max-height: ${viewAll ? 'fit-content' : '10rem'};\n overflow-y: hidden;\n }\n\n ${StyledCardFooter} {\n margin-block-start: ${theme.base.spacing};\n }\n\n ${StyledTag} {\n cursor: pointer;\n }\n\n ${isLoading &&\n css`\n & > ${StyledCardContent} {\n height: 4rem;\n }\n `}\n `;\n }\n);\n\nStyledTags.defaultProps = defaultThemeProp;\n\nconst StyledMenuPopover = styled.div`\n width: 40ch;\n`;\n\nconst StyledBanner = styled(Banner)(({ theme }) => {\n return css`\n padding-block-end: calc(2 * ${theme.base.spacing});\n `;\n});\n\nStyledBanner.defaultProps = defaultThemeProp;\n\nconst EditTagModal = ({ tags, availableTags = [], onSearch, onEditTags }: EditTagModalProps) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n const inputRef = useRef<HTMLInputElement>(null);\n const [filterValue, setFilterValue] = useState('');\n const [editError, setEditError] = useState('');\n const [selected, setSelected] = useState<SelectedTag[]>([]);\n const [items, setItems] = useState<MenuProps['items']>([]);\n const t = useI18n();\n\n useEffect(() => {\n setSelected(\n tags.map(tag => {\n return { text: tag };\n })\n );\n }, [tags]);\n\n useEffect(() => {\n const menuItems = availableTags\n .filter(tag => !selected.some(x => x.text === tag))\n .map(tag => {\n return { id: tag, primary: tag };\n });\n\n if (\n filterValue &&\n !menuItems.some(x => x.id === filterValue) &&\n !selected.some(x => x.text === filterValue)\n ) {\n menuItems.push({\n id: `custom:${filterValue}`,\n primary: t('use_input_value', [filterValue])\n });\n }\n\n setItems(menuItems);\n }, [availableTags, filterValue, selected]);\n\n const setInputValue = (value: string) => {\n setEditError('');\n setFilterValue(value);\n onSearch?.(value);\n };\n\n const addTag = (tag: string) => {\n if (tag && !selected.find(x => x.text === tag)) {\n if (items.find(x => x.id === tag)) {\n setSelected(curr => [...curr, { text: tag }]);\n } else {\n setSelected(curr => [...curr, { text: tag, newTag: true }]);\n }\n setInputValue('');\n }\n };\n\n const handlePaste = (e: ClipboardEvent<HTMLInputElement>) => {\n const potentialTags = e.clipboardData.getData('Text').split(' ');\n\n potentialTags.forEach(potentialTag => {\n addTag(potentialTag);\n });\n };\n\n const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.key === ' ') {\n addTag(filterValue);\n }\n };\n\n return (\n <Modal\n heading={t('edit_tags')}\n actions={\n <>\n <Button onClick={dismiss}>{t('cancel')}</Button>\n <Button\n variant='primary'\n onClick={() => {\n onEditTags(selected)\n .then(dismiss)\n .catch((error: unknown) => {\n if (error instanceof Error) {\n setEditError(error.message || t('unknown_error'));\n } else {\n setEditError(t('unknown_error'));\n }\n });\n }}\n >\n {t('submit')}\n </Button>\n </>\n }\n >\n {editError && (\n <StyledBanner\n id='edit-tags-error'\n variant='urgent'\n messages={[editError]}\n onDismiss={() => {\n setEditError('');\n }}\n />\n )}\n <MultiSelectInput\n ref={inputRef}\n selected={selected.map(({ text }) => {\n return { id: text, text };\n })}\n value={filterValue}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setInputValue(e.target.value.trim());\n }}\n onRemove={(id: string, index: number) => {\n if (selected[index].text === id) {\n const updatedSelected = [...selected];\n updatedSelected.splice(index, 1);\n setSelected(updatedSelected);\n setEditError('');\n }\n }}\n onBlur={() => {\n setInputValue('');\n }}\n onPaste={handlePaste}\n onKeyDown={handleKeyDown}\n autoFocus\n />\n <Popover\n as={StyledMenuPopover}\n show={!!filterValue && !!items?.length}\n target={inputRef.current}\n placement='bottom-start'\n modifiers={[\n {\n name: 'flip',\n enabled: true,\n options: {\n fallbackPlacements: ['top-start']\n }\n },\n {\n name: 'preventOverflow',\n enabled: true\n },\n {\n name: 'hide',\n enabled: false\n }\n ]}\n onMouseDown={(e: MouseEvent) => e.preventDefault()}\n >\n <Menu\n role='listbox'\n mode='action'\n items={items}\n focusControlEl={inputRef.current || undefined}\n onItemClick={id => {\n if (id.includes('custom:')) {\n const tagValue = id.replace('custom:', '');\n if (!selected.some(x => x.text === tagValue)) {\n setSelected(curr => [...curr, { text: tagValue, newTag: true }]);\n }\n } else {\n setSelected(curr => [...curr, { text: id }]);\n }\n setInputValue('');\n }}\n arrowNavigationUnsupported\n />\n </Popover>\n </Modal>\n );\n};\n\nconst Tags: FunctionComponent<TagsProps & ForwardProps> = forwardRef(\n (\n {\n tags,\n availableTags,\n loading,\n error,\n onSearch,\n onTagClick,\n onEditTags,\n ...restProps\n }: PropsWithoutRef<TagsProps>,\n ref: TagsProps['ref']\n ) => {\n const { create: createModal } = useContext(ModalManagerContext);\n const editModalMethods = useRef<ModalMethods<EditTagModalProps>>();\n const containerRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const consolidatedRef = useConsolidatedRef(containerRef, ref);\n const [footer, setFooter] = useState(false);\n const [viewAll, setViewAll] = useState(false);\n const t = useI18n();\n\n useEffect(() => {\n if (containerRef.current && contentRef.current) {\n if (\n contentRef.current.getBoundingClientRect().bottom >\n containerRef.current.getBoundingClientRect().bottom\n ) {\n setFooter(true);\n } else {\n setFooter(false);\n }\n }\n }, [containerRef.current, contentRef.current, tags]);\n\n useEffect(() => {\n if (!onEditTags) {\n editModalMethods.current?.dismiss();\n } else {\n editModalMethods.current?.update({\n tags,\n availableTags,\n onSearch,\n onEditTags\n });\n }\n }, [availableTags, tags, onSearch, onEditTags]);\n\n const openEditModal = () => {\n if (!onEditTags) return;\n\n editModalMethods.current = createModal(EditTagModal, {\n tags,\n availableTags,\n onSearch,\n onEditTags\n });\n };\n\n const content = useMemo(() => {\n if (loading) {\n return <Progress placement='local' />;\n }\n\n if (error) {\n if (typeof error === 'boolean') return <ErrorState />;\n if (typeof error === 'string') return <ErrorState message={error} />;\n return <ErrorState {...error} />;\n }\n\n return tags.length > 0 ? (\n <Flex ref={contentRef} container={{ gap: 1, wrap: 'wrap' }}>\n {tags.map(tag => {\n return (\n <Tag key={tag} onClick={() => onTagClick?.(tag)}>\n {tag}\n </Tag>\n );\n })}\n </Flex>\n ) : (\n <EmptyState />\n );\n }, [loading, error, tags]);\n\n return (\n <Card\n ref={consolidatedRef}\n {...restProps}\n as={StyledTags}\n viewAll={viewAll}\n isLoading={loading}\n >\n <CardHeader>\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n <Icon name='tag' />\n <Text variant='h2'>{t('tags')}</Text>\n <Count>{tags.length}</Count>\n </Flex>\n <Actions\n items={\n onEditTags\n ? [\n {\n id: 'editTags',\n text: t('edit_tags'),\n icon: 'pencil',\n onClick: openEditModal,\n disabled: !!error\n }\n ]\n : []\n }\n />\n </CardHeader>\n <CardContent>{content}</CardContent>\n {footer && (\n <CardFooter justify='center'>\n <Button variant='link' onClick={() => setViewAll(curr => !curr)}>\n {viewAll ? t('view_less') : t('view_all')}\n </Button>\n </CardFooter>\n )}\n </Card>\n );\n }\n);\n\nexport default Tags;\n"]}

package/lib/components/Tags/index.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export { default } from './Tags';
+export { TagsProps } from './Tags';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/Tags/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tags/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC"}

package/lib/components/Tags/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export { default } from './Tags';
2	+ //# sourceMappingURL=index.js.map

package/lib/components/Tags/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tags/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC","sourcesContent":["export { default } from './Tags';\nexport { TagsProps } from './Tags';\n"]}

package/lib/components/Tasks/TaskList.d.ts ADDED Viewed

@@ -0,0 +1,25 @@
+import { FunctionComponent, ReactNode, Ref } from 'react';
+import { ForwardProps } from '@pega/cosmos-react-core';
+export interface TaskItemProps {
+    /** Name of the task displayed in the list. */
+    name: NonNullable<ReactNode>;
+    /** Avatar element to represent the task's assignee. */
+    avatar?: ReactNode;
+    /** MetaList element with info related to the task. */
+    meta?: ReactNode;
+    /** Region for task level actions such as opening or dismissing. */
+    actions?: ReactNode;
+    /** Content for the task when open. */
+    content?: ReactNode;
+    [key: string]: unknown;
+}
+export interface TaskListProps {
+    items: TaskItemProps[];
+    hasFooter?: boolean;
+    /** Ref for the wrapping element. */
+    ref?: Ref<HTMLElement>;
+}
+export declare const TaskItem: ({ name, avatar, meta, actions, content, ...restProps }: TaskItemProps) => JSX.Element;
+declare const TaskList: FunctionComponent<TaskListProps & ForwardProps>;
+export default TaskList;
+//# sourceMappingURL=TaskList.d.ts.map

package/lib/components/Tasks/TaskList.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TaskList.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAmB,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGvF,OAAO,EACL,YAAY,EAKb,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,aAAa;IAC5B,8CAA8C;IAC9C,IAAI,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IAC7B,uDAAuD;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mEAAmE;IACnE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sCAAsC;IACtC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB;AAeD,eAAO,MAAM,QAAQ,2DAA4D,aAAa,gBA2B7F,CAAC;AAEF,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAU7D,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/Tasks/TaskList.js ADDED Viewed

@@ -0,0 +1,25 @@
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import styled, { css } from 'styled-components';
+import { SummaryItem, StyledSummaryListItem, Flex, defaultThemeProp } from '@pega/cosmos-react-core';
+const StyledTaskList = styled.ul(({ theme, hasFooter }) => {
+    return css `
+    ${hasFooter &&
+        css `
+      > li:last-child {
+        border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
+      }
+    `}
+  `;
+});
+StyledTaskList.defaultProps = defaultThemeProp;
+export const TaskItem = ({ name, avatar, meta, actions, content, ...restProps }) => {
+    const summary = (_jsx(SummaryItem, { visual: avatar, primary: name, secondary: meta, actions: content ? null : actions }, void 0));
+    return (_jsx(Flex, { container: { direction: 'column', gap: 2 }, item: { grow: 1 }, as: StyledSummaryListItem, forwardedAs: 'li', ...restProps, children: content ? (_jsxs(_Fragment, { children: [summary, content] }, void 0)) : (summary) }, void 0));
+};
+const TaskList = forwardRef(({ items, hasFooter = false }, ref) => {
+    return (_jsx(Flex, { container: { direction: 'column' }, as: StyledTaskList, hasFooter: hasFooter, ref: ref, children: items.map((item, i) => (_createElement(TaskItem, { ...item, key: `${i + 1}` }))) }, void 0));
+});
+export default TaskList;
+//# sourceMappingURL=TaskList.js.map

package/lib/components/Tasks/TaskList.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"TaskList.js","sourceRoot":"","sources":["../../../src/components/Tasks/TaskList.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAsD,MAAM,OAAO,CAAC;AACvF,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAEL,WAAW,EACX,qBAAqB,EACrB,IAAI,EACJ,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAuBjC,MAAM,cAAc,GAAG,MAAM,CAAC,EAAE,CAAyB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IAChF,OAAO,GAAG,CAAA;MACN,SAAS;QACX,GAAG,CAAA;;yCAEkC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;KAErE;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,SAAS,EAAiB,EAAE,EAAE;IAChG,MAAM,OAAO,GAAG,CACd,KAAC,WAAW,IACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,WACjC,CACH,CAAC;IACF,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC1C,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAE,qBAAqB,EACzB,WAAW,EAAC,IAAI,KACZ,SAAS,YAEZ,OAAO,CAAC,CAAC,CAAC,CACT,8BACG,OAAO,EACP,OAAO,YACP,CACJ,CAAC,CAAC,CAAC,CACF,OAAO,CACR,WACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAoD,UAAU,CAC1E,CAAC,EAAE,KAAK,EAAE,SAAS,GAAG,KAAK,EAAkC,EAAE,GAAG,EAAE,EAAE;IACpE,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,YACzF,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,eAAC,QAAQ,OAAK,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,GAAI,CACxC,CAAC,WACG,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, ReactNode, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n ForwardProps,\n SummaryItem,\n StyledSummaryListItem,\n Flex,\n defaultThemeProp\n} from '@pega/cosmos-react-core';\n\nexport interface TaskItemProps {\n /** Name of the task displayed in the list. */\n name: NonNullable<ReactNode>;\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 /** Region for task level actions such as opening or dismissing. */\n actions?: ReactNode;\n /** Content for the task when open. */\n content?: ReactNode;\n [key: string]: unknown;\n}\n\nexport interface TaskListProps {\n items: TaskItemProps[];\n hasFooter?: boolean;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLElement>;\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});\n\nStyledTaskList.defaultProps = defaultThemeProp;\n\nexport const TaskItem = ({ name, avatar, meta, actions, content, ...restProps }: TaskItemProps) => {\n const summary = (\n <SummaryItem\n visual={avatar}\n primary={name}\n secondary={meta}\n actions={content ? null : actions}\n />\n );\n return (\n <Flex\n container={{ direction: 'column', gap: 2 }}\n item={{ grow: 1 }}\n as={StyledSummaryListItem}\n forwardedAs='li'\n {...restProps}\n >\n {content ? (\n <>\n {summary}\n {content}\n </>\n ) : (\n summary\n )}\n </Flex>\n );\n};\n\nconst TaskList: FunctionComponent<TaskListProps & ForwardProps> = forwardRef(\n ({ items, hasFooter = false }: PropsWithoutRef<TaskListProps>, ref) => {\n return (\n <Flex container={{ direction: 'column' }} as={StyledTaskList} hasFooter={hasFooter} ref={ref}>\n {items.map((item, i) => (\n <TaskItem {...item} key={`${i + 1}`} />\n ))}\n </Flex>\n );\n }\n);\n\nexport default TaskList;\n"]}

package/lib/components/Tasks/Tasks.d.ts CHANGED Viewed

@@ -1,18 +1,6 @@
 import { ReactNode, FC, ReactElement } from 'react';
 import { ForwardProps } from '@pega/cosmos-react-core';
-export interface TaskItemProps {
-    /** Name of the task displayed in the list. */
-    name: ReactNode;
-    /** Avatar element to represent the task's assignee. */
-    avatar?: ReactNode;
-    /** MetaList element with info related to the task. */
-    meta?: ReactNode;
-    /** Region for task level actions such as opening or dismissing. */
-    actions?: ReactNode;
-    /** Content for the task when open. */
-    content?: ReactNode;
-    [key: string]: unknown;
-}
+import { TaskItemProps } from './TaskList';
 export interface TasksProps {
     /** An array of TaskItemProps to generate the list.  */
     items: TaskItemProps[];
@@ -27,7 +15,7 @@ export interface TasksProps {
     /** Integer representing the total count of tasks. */
     count?: number | null;
     /** Callback for when to show more/less button is clicked. Lists greater than 3 items will display the show toggle button in its footer. */
-    onExpandToggle?(): void;
+    onExpandToggle?: () => void;
 }
 declare const Tasks: FC<ForwardProps & TasksProps>;
 export default Tasks;

package/lib/components/Tasks/Tasks.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tasks.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"AAAA,~~OAAc~~,EAAE,SAAS,EAAE,EAAE,EAAE,YAAY,EAAuB,MAAM,OAAO,CAAC;~~AAGhF~~,OAAO,EAWL,YAAY,~~EAGb~~,MAAM,yBAAyB,CAAC;AAEjC,~~MAAM~~,~~WAAW~~,aAAa~~;IAC5B~~,~~8CAA8C;IAC9C,IAAI,~~EAAE,~~SAAS,CAAC;IAChB,uDAAuD;IACvD,~~MAAM,~~CAAC~~,~~EAAE,SAAS,~~CAAC;~~IACnB~~,~~sDAAsD;IACtD,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mEAAmE;IACnE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,sCAAsC;IACtC,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,CAAC,GAAG,EAAE,~~MAAM,~~GAAG,OAAO,CAAC;CACxB;AACD,MAAM,~~WAAW,UAAU;IACzB,uDAAuD;IACvD,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,gDAAgD;IAChD,gBAAgB,EAAE,SAAS,CAAC;IAC5B,qDAAqD;IACrD,UAAU,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,4DAA4D;IAC5D,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,2IAA2I;IAC3I,cAAc,CAAC,~~IAAI~~,IAAI,CAAC;~~CACzB~~;~~AAoDD~~,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,YAAY,GAAG,UAAU,~~CAyExC~~,CAAC;AAEF,eAAe,KAAK,CAAC"}
1	+ {"version":3,"file":"Tasks.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,YAAY,EAAuB,MAAM,OAAO,CAAC;AAGzE,OAAO,EAWL,YAAY,EACb,MAAM,yBAAyB,CAAC;AAEjC,OAAiB,EAAY,aAAa,EAAE,MAAM,YAAY,CAAC;AAE/D,MAAM,WAAW,UAAU;IACzB,uDAAuD;IACvD,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,gDAAgD;IAChD,gBAAgB,EAAE,SAAS,CAAC;IAC5B,qDAAqD;IACrD,UAAU,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,4DAA4D;IAC5D,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,qDAAqD;IACrD,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,2IAA2I;IAC3I,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAUD,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,YAAY,GAAG,UAAU,CA6DxC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/components/Tasks/Tasks.js CHANGED Viewed

@@ -1,12 +1,8 @@
-import React, { useMemo } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
 import styled, { css } from 'styled-components';
-import { Card, CardHeader, CardContent, CardFooter, Flex, Text, SummaryItem, Count, Button, useI18n, defaultThemeProp, StyledListItem } from '@pega/cosmos-react-core';
-const TaskItem = ({ name, avatar, meta, actions, content, ...restProps }) => {
-    const summary = (React.createElement(SummaryItem, { visual: avatar, primary: name, secondary: meta, actions: content ? null : actions }));
-    return (React.createElement(Flex, { container: { direction: 'column', itemGap: 2 }, item: { grow: 1 }, as: StyledListItem, forwardedAs: 'li', ...restProps }, content ? (React.createElement(React.Fragment, null,
-        summary,
-        content)) : (summary)));
-};
+import { Card, CardHeader, CardContent, CardFooter, Flex, Text, SummaryItem, Count, Button, useI18n } from '@pega/cosmos-react-core';
+import TaskList, { TaskItem } from './TaskList';
 const StyledTasks = styled(Card)(({ theme, openItem }) => {
     return openItem
         ? css `
@@ -14,44 +10,26 @@ const StyledTasks = styled(Card)(({ theme, openItem }) => {
       `
         : null;
 });
-const StyledTaskList = styled.ul(({ theme, hasFooter }) => {
-    return css `
-    ${hasFooter &&
-        css `
-      > li:last-child {
-        border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
-      }
-    `}
-  `;
-});
-StyledTaskList.defaultProps = defaultThemeProp;
 const Tasks = (props) => {
     const { items = [], headerText, headerVisual, headerSecondary, count, onExpandToggle, emptyPlaceholder, ...restProps } = props;
     const openItem = items.find(item => item.content);
     const t = useI18n();
-    const TaskItems = useMemo(() => {
-        return openItem ? (React.createElement(TaskItem, { ...openItem })) : (items.map((item, i) => React.createElement(TaskItem, { ...item, key: `${i + 1}` })));
-    }, [items, openItem]);
     const hasFooter = useMemo(() => {
         return !openItem && typeof count === 'number' && count > 3;
     }, [openItem, count]);
-    return (React.createElement(StyledTasks, { ...restProps, openItem: !!openItem },
-        !openItem && (React.createElement(CardHeader, null,
-            React.createElement(SummaryItem, { visual: headerVisual, primary: React.createElement(Flex, { container: { alignItems: 'center', itemGap: 1 } },
-                    React.createElement(Text, { variant: 'h2' }, headerText),
-                    React.createElement(Count, null, count !== null && count !== void 0 ? count : null)), secondary: headerSecondary }))),
-        React.createElement(CardContent, null, items.length > 0 ? (React.createElement(Flex, { container: { direction: 'column' }, as: StyledTaskList, hasFooter: hasFooter }, TaskItems)) : (emptyPlaceholder)),
-        hasFooter && (React.createElement(CardFooter, { justify: 'center' },
-            React.createElement(Button, { variant: 'link', "aria-label": t(!!count && count > items.length ? 'show_more' : 'show_less', 'tasks'), onClick: (e) => {
-                    onExpandToggle === null || onExpandToggle === void 0 ? void 0 : onExpandToggle();
-                    if (!!count && count <= items.length) {
-                        const { currentTarget } = e;
-                        requestAnimationFrame(() => {
-                            if (currentTarget.getBoundingClientRect().top < 0)
-                                currentTarget.scrollIntoView();
-                        });
-                    }
-                } }, t(!!count && count > items.length ? 'show_more' : 'show_less'))))));
+    const TaskItems = useMemo(() => {
+        return openItem ? _jsx(TaskItem, { ...openItem }, void 0) : _jsx(TaskList, { items: items, hasFooter: hasFooter }, void 0);
+    }, [items, openItem]);
+    return (_jsxs(StyledTasks, { ...restProps, openItem: !!openItem, children: [!openItem && (_jsx(CardHeader, { children: _jsx(SummaryItem, { visual: headerVisual, primary: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Text, { variant: 'h2', children: headerText }, void 0), _jsx(Count, { children: count ?? null }, void 0)] }, void 0), secondary: headerSecondary }, void 0) }, void 0)), _jsx(CardContent, { children: items.length > 0 ? TaskItems : emptyPlaceholder }, void 0), hasFooter && (_jsx(CardFooter, { justify: 'center', children: _jsx(Button, { variant: 'link', "aria-label": t(!!count && count > items.length ? 'show_more' : 'show_less', ['tasks']), onClick: (e) => {
+                        onExpandToggle?.();
+                        if (!!count && count <= items.length) {
+                            const { currentTarget } = e;
+                            requestAnimationFrame(() => {
+                                if (currentTarget.getBoundingClientRect().top < 0)
+                                    currentTarget.scrollIntoView();
+                            });
+                        }
+                    }, children: t(!!count && count > items.length ? 'show_more' : 'show_less') }, void 0) }, void 0))] }, void 0));
 };
 export default Tasks;
 //# sourceMappingURL=Tasks.js.map

package/lib/components/Tasks/Tasks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tasks.js","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"AAAA,OAAO,~~KAAK,EAAE,~~EAA+B,OAAO,EAAc,MAAM,OAAO,CAAC;~~AAChF~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,IAAI,EACJ,UAAU,EACV,WAAW,EACX,UAAU,EACV,IAAI,EACJ,IAAI,EACJ,WAAW,EACX,KAAK,EACL,MAAM,EACN,OAAO,~~EAEP~~,~~gBAAgB,EAChB,cAAc,EACf,~~MAAM,yBAAyB,CAAC;~~AAgCjC~~,~~MAAM~~,QAAQ,~~GAAG,CAAC,~~EAAE,~~IAAI,~~EAAE,~~MAAM~~,~~EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,SAAS,~~EAAiB,~~EAAE,EAAE;IACzF,~~MAAM,~~OAAO~~,~~GAAG,CACd,oBAAC,WAAW,IACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,OAAO,~~CAAC~~,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,GACjC,CACH,CAAC~~;~~IACF~~,OAAO,CACL,oBAAC,IAAI,IACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EAAE,EAC9C,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAE,cAAc,EAClB,WAAW,EAAC,IAAI,KACZ,SAAS,IAEZ,OAAO,CAAC,CAAC,CAAC,CACT;QACG,OAAO;QACP,OAAO,CACP,CACJ,CAAC,CAAC,CAAC,CACF,OAAO,CACR,CACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC/E,OAAO,QAAQ;QACb,CAAC,CAAC,GAAG,CAAA;sBACa,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG;OACpC;QACH,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC,CAAC;AAEH,MAAM,~~cAAc,GAAG,MAAM,CAAC,EAAE,CAAyB,CAAC,EAAE,~~KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IAChF,OAAO,GAAG,CAAA;MACN,SAAS;QACX,GAAG,CAAA;;yCAEkC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;KAErE;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,KAAK,GAAkC,CAAC,KAAiB,EAAE,EAAE;IACjE,MAAM,EACJ,KAAK,GAAG,EAAE,EACV,UAAU,EACV,YAAY,EACZ,eAAe,EACf,KAAK,EACL,cAAc,EACd,gBAAgB,EAChB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,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,OAAO,CAAC,GAAG,EAAE;QAC7B,OAAO,~~QAAQ,~~CAAC,~~CAAC~~,~~CAAC~~,~~CAChB~~,~~oBAAC~~,~~QAAQ~~,~~OAAK,~~QAAQ,~~GAAI~~,~~CAC3B,CAAC,CAAC,CAAC,CACF,~~KAAK,~~CAAC,~~GAAG,CAAC,CAAC,~~IAAI~~,EAAE,CAAC,~~EAAE~~,EAAE,CAAC,~~oBAAC~~,~~QAAQ~~,~~OAAK~~,~~IAAI~~,~~EAAE,~~GAAG,~~EAAE~~,~~GAAG,~~CAAC,GAAG,~~CAAC,~~EAAE,~~GAAI~~,CAAC,~~CAChE,~~CAAC~~;IACJ~~,CAAC,~~EAAE~~,~~CAAC~~,~~KAAK~~,~~EAAE,~~QAAQ,~~CAAC~~,CAAC,CAAC~~;IAEtB~~,~~MAAM,SAAS,GAAG,OAAO,~~CAAC,~~GAAG~~,~~EAAE;QAC7B,OAAO,CAAC,~~QAAQ,~~IAAI~~,~~OAAO,~~KAAK,KAAK,~~QAAQ~~,~~IAAI~~,~~KAAK~~,~~GAAG~~,~~CAAC~~,CAAC;~~IAC7D~~,CAAC,EAAE,CAAC,~~QAAQ~~,EAAE,~~KAAK~~,CAAC,CAAC,CAAC;IAEtB,OAAO,CACL,~~oBAAC~~,WAAW,OAAK,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC,QAAQ~~;QAC7C~~,CAAC,QAAQ,IAAI,CACZ,~~oBAAC~~,UAAU~~;YACT~~,~~oBAAC~~,WAAW,IACV,MAAM,EAAE,YAAY,EACpB,OAAO,EACL,~~oBAAC~~,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,~~OAAO~~,EAAE,CAAC,EAAE~~;oBACnD~~,~~oBAAC~~,IAAI,IAAC,OAAO,EAAC,IAAI,~~IAAE~~,UAAU,~~CAAQ;oBACtC~~,~~oBAAC~~,~~KAAK~~,~~QAAE,~~KAAK,~~aAAL~~,KAAK,~~cAAL~~,~~KAAK,GAAI,~~IAAI,~~CAAS~~,~~CACzB~~,EAET,SAAS,EAAE,eAAe,~~GAC1B~~,~~CACS~~,CACd~~;QACD~~,~~oBAAC~~,WAAW,~~QACT~~,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,~~CAClB,oBAAC,IAAI,IAAC,~~SAAS,~~EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,IAC/E,SAAS,CACL,CACR,~~CAAC,CAAC,CAAC,~~CACF,~~gBAAgB,~~CACjB~~,~~CACW;QAEb~~,SAAS,IAAI,CACZ,~~oBAAC~~,UAAU,IAAC,OAAO,EAAC,QAAQ;YAC1B,~~oBAAC~~,MAAM,IACL,OAAO,EAAC,MAAM,gBACF,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,EAAE,OAAO,CAAC,~~EACnF~~,OAAO,EAAE,CAAC,CAAgC,EAAE,EAAE;~~oBAC5C~~,cAAc,~~aAAd~~,~~cAAc~~,~~uBAAd,cAAc,EAAI,~~CAAC;~~oBACnB~~,IAAI,CAAC,CAAC,KAAK,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE;~~wBACpC~~,MAAM,EAAE,aAAa,EAAE,GAAG,CAAC,CAAC;~~wBAC5B~~,qBAAqB,CAAC,GAAG,EAAE;~~4BACzB~~,IAAI,aAAa,CAAC,qBAAqB,EAAE,CAAC,GAAG,GAAG,CAAC;~~gCAAE~~,aAAa,CAAC,cAAc,EAAE,CAAC;~~wBACpF~~,CAAC,CAAC,CAAC;~~qBACJ~~;~~gBACH~~,CAAC,~~IAEA~~,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,~~CACxD~~,~~CACE~~,CACd,~~CACW~~,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import ~~React,~~ { ReactNode, FC, ReactElement, useMemo, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n Flex,\n Text,\n SummaryItem,\n Count,\n Button,\n useI18n,\n ForwardProps~~,\n defaultThemeProp,\n StyledListItem~~\n} from '@pega/cosmos-react-core';\n\~~nexport~~ ~~interface~~ ~~TaskItemProps~~ {\n /** ~~Name~~ of ~~the~~ ~~task~~ ~~displayed in the list. /\n name: ReactNode;\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 /* Region for task level actions such as opening or dismissing. /\n actions?: ReactNode;\n /* Content for the task when open. /\n content?: ReactNode;\n [key: string]: unknown;\n}\nexport interface TasksProps {\n /* An array of TaskItemProps to generate the list. /\n items: TaskItemProps[];\n /* Content to render when the list is empty. /\n emptyPlaceholder: ReactNode;\n /* Heading text to render at the top of the list. /\n headerText: string;\n /* A visual element i.e. (Avatar \| Icon) to accompany the header text. /\n headerVisual?: ReactElement;\n /* A region for supplemental task list info or controls. /\n headerSecondary?: ReactNode;\n /* Integer representing the total count of tasks. /\n count?: number \| null;\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. */\n onExpandToggle~~?():~~ ~~void;\n}\n\nconst TaskItem =~~ (~~{ name, avatar, meta, actions, content, ...restProps }: TaskItemProps~~) => ~~{\n const summary = (\n <SummaryItem\n visual={avatar}\n primary={name}\n secondary={meta}\n actions={content ? null : actions}\n />\n )~~;\n ~~return (\n <Flex\n container={{ direction: 'column', itemGap: 2~~ }}\n ~~item={{ grow: 1 }}~~\n as={StyledListItem}\n forwardedAs='li'\n {...restProps}\n >\n {content ? (\n <>\n {summary}\n {content}\n </>\n ) : (\n summary\n )}\n </Flex>\n );\n};\n\nconst StyledTasks = styled(Card)<{ openItem?: boolean }>(({ theme, openItem }) => {\n return openItem\n ? css`\n box-shadow: ${theme.base.shadow.low};\n `\n : null;\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});\n\nStyledTaskList.defaultProps = defaultThemeProp;\n\nconst Tasks: FC<ForwardProps & TasksProps> = (props: TasksProps) => {\n const {\n items = [],\n headerText,\n headerVisual,\n headerSecondary,\n count,\n onExpandToggle,\n emptyPlaceholder,\n ...restProps\n } = props;\n const openItem = items.find(item => item.content);\n const t = useI18n();\n\n const ~~TaskItems~~ = useMemo(() => {\n return openItem ? ~~(\n <TaskItem~~ ~~{...openItem}~~ ~~/>\n )~~ : ~~(\n items.map((item,~~ i) => ~~<TaskItem {...item} key={`${i + 1}`} />)\n )~~;\n }, [~~items~~, ~~openItem~~]);\n\n const ~~hasFooter~~ = useMemo(() => {\n return !openItem && ~~typeof~~ ~~count~~ ~~===~~ ~~'number'~~ && ~~count~~ > ~~3;\~~n }, [~~openItem~~, ~~count~~]);\n\n return (\n <StyledTasks {...restProps} openItem={!!openItem}>\n {!openItem && (\n <CardHeader>\n <SummaryItem\n visual={headerVisual}\n primary={\n <Flex container={{ alignItems: 'center', ~~itemGap~~: 1 }}>\n <Text variant='h2'>{headerText}</Text>\n <Count>{count ?? null}</Count>\n </Flex>\n }\n secondary={headerSecondary}\n />\n </CardHeader>\n )}\n <CardContent~~>\n~~ {items.length > 0 ? ~~(\n <Flex container={{ direction: 'column' }} as={StyledTaskList} hasFooter={hasFooter}>\n {~~TaskItems~~}\n </Flex>\n )~~ : ~~(\n~~ emptyPlaceholder~~\n )~~}\n </CardContent>\n\n {hasFooter && (\n <CardFooter justify='center'>\n <Button\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 Tasks;\n"]}
1	+ {"version":3,"file":"Tasks.js","sourceRoot":"","sources":["../../../src/components/Tasks/Tasks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { ReactNode, FC, ReactElement, useMemo, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Card,\n CardHeader,\n CardContent,\n CardFooter,\n Flex,\n Text,\n SummaryItem,\n Count,\n Button,\n useI18n,\n ForwardProps\n} from '@pega/cosmos-react-core';\n\nimport TaskList, { TaskItem, TaskItemProps } from './TaskList';\n\nexport interface TasksProps {\n /** An array of TaskItemProps to generate the list. /\n items: TaskItemProps[];\n /* Content to render when the list is empty. /\n emptyPlaceholder: ReactNode;\n /* Heading text to render at the top of the list. /\n headerText: string;\n /* A visual element i.e. (Avatar \| Icon) to accompany the header text. /\n headerVisual?: ReactElement;\n /* A region for supplemental task list info or controls. /\n headerSecondary?: ReactNode;\n /* Integer representing the total count of tasks. /\n count?: number \| null;\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. */\n onExpandToggle?: () => void;\n}\n\nconst StyledTasks = styled(Card)<{ openItem?: boolean }>(({ theme, openItem }) => {\n return openItem\n ? css`\n box-shadow: ${theme.base.shadow.low};\n `\n : null;\n});\n\nconst Tasks: FC<ForwardProps & TasksProps> = (props: TasksProps) => {\n const {\n items = [],\n headerText,\n headerVisual,\n headerSecondary,\n count,\n onExpandToggle,\n emptyPlaceholder,\n ...restProps\n } = props;\n const openItem = items.find(item => item.content);\n const t = useI18n();\n\n const hasFooter = useMemo(() => {\n return !openItem && typeof count === 'number' && count > 3;\n }, [openItem, count]);\n\n const TaskItems = useMemo(() => {\n return openItem ? <TaskItem {...openItem} /> : <TaskList items={items} hasFooter={hasFooter} />;\n }, [items, openItem]);\n\n return (\n <StyledTasks {...restProps} openItem={!!openItem}>\n {!openItem && (\n <CardHeader>\n <SummaryItem\n visual={headerVisual}\n primary={\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n <Text variant='h2'>{headerText}</Text>\n <Count>{count ?? null}</Count>\n </Flex>\n }\n secondary={headerSecondary}\n />\n </CardHeader>\n )}\n <CardContent>{items.length > 0 ? TaskItems : emptyPlaceholder}</CardContent>\n\n {hasFooter && (\n <CardFooter justify='center'>\n <Button\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 Tasks;\n"]}

package/lib/components/Tasks/index.d.ts CHANGED Viewed

@@ -1,3 +1,6 @@
 export { default } from './Tasks';
 export { TasksProps } from './Tasks';
+export { default as TaskList } from './TaskList';
+export { TaskListProps } from './TaskList';
+export { TaskItemProps } from './TaskList';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Tasks/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tasks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC"}

package/lib/components/Tasks/index.js CHANGED Viewed

@@ -1,2 +1,3 @@
 export { default } from './Tasks';
+export { default as TaskList } from './TaskList';
 //# sourceMappingURL=index.js.map

package/lib/components/Tasks/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tasks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { default } from './Tasks';\nexport { TasksProps } from './Tasks';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tasks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAElC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC","sourcesContent":["export { default } from './Tasks';\nexport { TasksProps } from './Tasks';\nexport { default as TaskList } from './TaskList';\nexport { TaskListProps } from './TaskList';\nexport { TaskItemProps } from './TaskList';\n"]}

package/lib/components/Timeline/Timeline.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.tsx"],"names":[],"mappings":"AAAA,~~OAAc~~,~~EAGZ~~,iBAAiB,EAIlB,MAAM,OAAO,CAAC;AAEf,OAAO,~~EAAmB~~,YAAY,~~EAAQ~~,MAAM,yBAAyB,CAAC;~~AAG9E~~,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;AAIlD,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,~~CAuD7D~~,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1	+ {"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAIlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGvD,OAAO,KAAK,aAAa,MAAM,kBAAkB,CAAC;AAIlD,QAAA,MAAM,QAAQ,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAkD7D,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/Timeline/Timeline.js CHANGED Viewed

@@ -1,34 +1,18 @@
-import React, { forwardRef, Fragment, useEffect, useState } from 'react';
-import { DateTimeDisplay, Grid } from '@pega/cosmos-react-core';
-import { isFutureDate, isSameDate, sortByDate } from './utils';
-import { StyledBulletWrapper, StyledDate, StyledGrid } from './Timeline.styles';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, Fragment, useEffect, useState } from 'react';
+import { isSameGroup, sortByDate } from './utils';
+import { StyledDate, StyledTimelineTable } from './Timeline.styles';
 import TimelineItem from './TimelineItem';
-const Timeline = forwardRef(({ activity, currentTime }, ref) => {
-    const [sortedData, setSortedData] = useState(() => sortByDate(activity));
+const Timeline = forwardRef(({ activity, currentTime, sortOrder = 'descending', groupBy = 'date', ...restProps }, ref) => {
+    const [sortedData, setSortedData] = useState(() => sortByDate(activity, sortOrder));
     useEffect(() => {
-        setSortedData(sortByDate(activity));
-    }, [activity]);
-    return (React.createElement(StyledGrid, { container: {
-            cols: 'auto 1fr',
-            colGap: 1,
-            alignContent: 'evenly',
-            alignItems: 'center'
-        }, sm: { container: { cols: 'auto auto  1fr' } }, ref: ref }, sortedData &&
-        sortedData.map((item, index) => {
-            var _a, _b, _c;
-            const isPrevFuture = isFutureDate((_a = sortedData[index - 1]) === null || _a === void 0 ? void 0 : _a.date, currentTime);
-            const isNextFuture = isFutureDate((_b = sortedData[index]) === null || _b === void 0 ? void 0 : _b.date, currentTime);
-            let dateHeader = null;
-            if (!isSameDate((_c = sortedData[index - 1]) === null || _c === void 0 ? void 0 : _c.date, item.date)) {
-                dateHeader = (React.createElement(React.Fragment, null,
-                    index !== 0 && (React.createElement(StyledBulletWrapper, { item: { colStart: '1', colEnd: '1' }, sm: { item: { colStart: '2', colEnd: '2' } }, isPrevFuture: isPrevFuture, isNextFuture: isPrevFuture })),
-                    React.createElement(Grid, { item: { colStart: '2', colEnd: '-1' }, sm: { item: { colStart: '3', colEnd: '-1' } }, as: StyledDate },
-                        React.createElement(DateTimeDisplay, { variant: 'date', value: item.date }))));
-            }
-            return (React.createElement(Fragment, { key: item.id },
-                dateHeader,
-                React.createElement(TimelineItem, { item: item, isPrevFuture: isPrevFuture, isNextFuture: isNextFuture })));
-        })));
+        setSortedData(sortByDate(activity, sortOrder));
+    }, [activity, sortOrder]);
+    return (_jsx(StyledTimelineTable, { ref: ref, ...restProps, children: _jsx("tbody", { children: sortedData.map((item, index) => {
+                const isFirstItemInGroup = !isSameGroup(sortedData[index - 1]?.date, item.date, groupBy);
+                const isLastItemInGroup = !isSameGroup(sortedData[index + 1]?.date, item.date, groupBy);
+                return (_jsxs(Fragment, { children: [isFirstItemInGroup && groupBy !== 'none' && (_jsx("tr", { children: _jsx("td", { colSpan: 3, children: _jsx(StyledDate, { variant: groupBy, format: 'long', value: item.date }, void 0) }, void 0) }, void 0)), _jsx(TimelineItem, { item: item, timeFormat: groupBy === 'date' ? 'time' : 'datetime', prevItemDate: isFirstItemInGroup ? undefined : sortedData[index - 1].date, nextItemDate: isLastItemInGroup ? undefined : sortedData[index + 1].date, currentTime: currentTime }, void 0)] }, item.id));
+            }) }, void 0) }, void 0));
 });
 export default Timeline;
 //# sourceMappingURL=Timeline.js.map

package/lib/components/Timeline/Timeline.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Timeline.js","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,~~KAAK~~,~~EAAE,EACZ,~~UAAU,EACV,QAAQ,EAGR,SAAS,EACT,QAAQ,EACT,MAAM,OAAO,CAAC;~~AAEf~~,OAAO,EAAE,~~eAAe~~,~~EAAgB,IAAI,~~EAAE,~~MAAM,yBAAyB,CAAC;AAE9E,OAAO,EAAE,YAAY,EAAE,~~UAAU,EAAE,~~UAAU,EAAE,~~MAAM,SAAS,CAAC;~~AAE/D~~,OAAO,EAAE,~~mBAAmB,EAAE,~~UAAU,EAAE,~~UAAU~~,EAAE,MAAM,mBAAmB,CAAC;~~AAChF~~,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,MAAM,QAAQ,GAAoD,UAAU,CAC1E,~~CAAC~~,~~EAAE~~,QAAQ,~~EAAE~~,WAAW,~~EAAkC~~,~~EAAE~~,GAAyB,~~EAAE~~,EAAE;~~IACvF~~,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;~~IAEzE~~,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC;~~IACtC~~,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;~~IAEf~~,OAAO,CACL,~~oBAAC~~,~~UAAU~~,~~IACT~~,~~SAAS~~,EAAE~~;YACT~~,~~IAAI~~,~~EAAE~~,~~UAAU;YAChB,MAAM,EAAE,CAAC;YACT,YAAY,EAAE,QAAQ;YACtB,UAAU,EAAE,QAAQ;SACrB,EACD,EAAE,EAAE,EAAE,~~SAAS,~~EAAE~~,~~EAAE~~,~~IAAI,EAAE,gBAAgB,EAAE,EAAE,EAC7C,GAAG,EAAE,GAAG,IAEP,~~UAAU~~;QACT~~,~~UAAU,~~CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE~~;;YAC7B~~,MAAM,~~YAAY~~,GAAG,~~YAAY,~~CAAC,~~MAAA~~,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,~~0CAAE~~,IAAI,~~EAAE~~,~~WAAW~~,CAAC,~~CAAC;YAC5E,MAAM,YAAY,GAAG,YAAY,CAAC,MAAA,UAAU,CAAC,KAAK,CAAC,0CAAE,~~IAAI,~~EAAE~~,~~WAAW~~,~~CAAC~~,CAAC;~~YACxE~~,~~IAAI~~,~~UAAU~~,GAAG,~~IAAI,~~CAAC~~;YACtB~~,~~IAAI~~,CAAC,UAAU,CAAC,~~MAAA,UAAU,CAAC,~~KAAK,GAAG,CAAC,CAAC,~~0CAAE~~,IAAI,EAAE,IAAI,CAAC,IAAI,~~CAAC,~~EAAE~~;gBACvD~~,~~UAAU~~,~~GAAG~~,~~CACX~~;~~oBACG~~,~~KAAK~~,~~KAAK~~,~~CAAC~~,~~IAAI~~,~~CACd~~,~~oBAAC~~,~~mBAAmB,IAClB,~~IAAI,~~EAAE~~,~~EAAE~~,~~QAAQ~~,~~EAAE~~,~~GAAG~~,~~EAAE~~,~~MAAM~~,~~EAAE~~,~~GAAG,~~EAAE,~~EACpC~~,~~EAAE~~,~~EAAE~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,EAAE,~~QAAQ~~,EAAE,~~GAAG~~,~~EAAE~~,MAAM,~~EAAE~~,~~GAAG~~,EAAE,~~EAAE~~,~~EAC5C~~,~~YAAY~~,~~EAAE~~,~~YAAY~~,~~EAC1B~~,~~YAAY~~,~~EAAE~~,YAAY,~~GAC1B~~,~~CACH;oBACD,oBAAC,~~IAAI,~~IACH~~,IAAI,~~EAAE~~,~~EAAE~~,~~QAAQ,~~EAAE,~~GAAG~~,~~EAAE~~,MAAM,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~EACrC~~,~~EAAE~~,~~EAAE~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~EAAE~~,~~QAAQ,~~EAAE,~~GAAG~~,~~EAAE~~,~~MAAM~~,~~EAAE~~,~~IAAI~~,~~EAAE~~,~~EAAE~~,~~EAC7C~~,~~EAAE~~,~~EAAE~~,~~UAAU;wBAEd~~,~~oBAAC~~,~~eAAe~~,~~IAAC~~,~~OAAO~~,~~EAAC~~,~~MAAM~~,~~EAAC~~,~~KAAK,~~EAAE,~~IAAI~~,CAAC,~~IAAI~~,~~GAAI~~,~~CAC/C~~,~~CACN~~,~~CACJ~~,CAAC~~;aACH;YACD~~,~~OAAO~~,~~CACL~~,~~oBAAC~~,~~QAAQ,IAAC,~~GAAG,~~EAAE~~,~~IAAI~~,CAAC,~~EAAE;gBACnB,UAAU;gBACX,oBAAC,YAAY,IAAC,~~IAAI,~~EAAE~~,~~IAAI~~,EAAE,~~YAAY~~,~~EAAE~~,~~YAAY~~,~~EAAE~~,~~YAAY~~,EAAE,~~YAAY~~,~~GAAI,CAC3E,~~CACZ,CAAC;~~QACJ~~,CAAC,CAAC,~~CACO~~,~~CACd~~,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import ~~React,~~ {\n forwardRef,\n Fragment,\n FunctionComponent,\n PropsWithoutRef,\n useEffect,\n useState\n} from 'react';\n\nimport { ~~DateTimeDisplay,~~ ForwardProps, ~~Grid~~ } from '@pega/cosmos-react-core';\n\nimport { ~~isFutureDate~~, ~~isSameDate,~~ sortByDate } from './utils';\nimport type TimelineProps from './Timeline.types';\nimport { ~~StyledBulletWrapper,~~ StyledDate, ~~StyledGrid~~ } from './Timeline.styles';\nimport TimelineItem from './TimelineItem';\n\nconst Timeline: FunctionComponent<TimelineProps & ForwardProps> = forwardRef(\n ({ activity, currentTime }: PropsWithoutRef<TimelineProps>, ref: TimelineProps['ref']) => {\n const [sortedData, setSortedData] = useState(() => sortByDate(activity));\n\n useEffect(() => {\n setSortedData(sortByDate(activity));\n }, [activity]);\n\n return (\n <~~StyledGrid\n container={{\n cols:~~ ~~'auto 1fr',\n colGap: 1,\n alignContent: 'evenly',\n alignItems: 'center'\n }}\n sm~~={~~{ container: { cols: 'auto auto 1fr'~~ } ~~}}\n ref=~~{~~ref~~}\n >\n ~~{sortedData &&\~~n sortedData.map((item, index) => {\n const ~~isPrevFuture~~ = ~~isFutureDate~~(sortedData[index - 1]?.date~~, currentTime);\~~n ~~const isNextFuture = isFutureDate(sortedData[index]?.date, currentTime~~);\n ~~let~~ ~~dateHeader~~ = ~~null;\n if (~~!~~isSameDate~~(sortedData[index - 1]?.date, item.date)) {\n ~~dateHeader~~ = (\n ~~<>\n~~ {~~index~~ !== 0 && (\n <~~StyledBulletWrapper\n item~~={~~{ colStart: '1', colEnd: '1'~~ }}\n sm={{ ~~item: { colStart:~~ '2', ~~colEnd: '2' } }}\n isPrevFuture~~={~~isPrevFuture~~}\n ~~isNextFuture={isPrevFuture}\n~~ ~~/>\~~n )}\n <~~Grid~~\n item={{ ~~colStart:~~ '2', ~~colEnd~~: '-1' }}\n sm={{ ~~item:~~ { ~~colStart~~: ~~'3',~~ ~~colEnd:~~ '-1' } }}\n as={~~StyledDate}\n >\n <DateTimeDisplay~~ ~~variant='date'~~ ~~value={item~~.date} ~~/>\~~n ~~</Grid>\n </>\n );\n }\n return (\n <Fragment key~~={~~item.id~~}~~>\n {dateHeader}~~\n ~~<TimelineItem item={item} isPrevFuture={isPrevFuture} isNextFuture={isNextFuture}~~ />\n </Fragment>\n );\n })}\n </~~StyledGrid~~>\n );\n }\n);\n\nexport default Timeline;\n"]}
1	+ {"version":3,"file":"Timeline.js","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,QAAQ,EAGR,SAAS,EACT,QAAQ,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAElD,OAAO,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,MAAM,QAAQ,GAAoD,UAAU,CAC1E,CACE,EACE,QAAQ,EACR,WAAW,EACX,SAAS,GAAG,YAAY,EACxB,OAAO,GAAG,MAAM,EAChB,GAAG,SAAS,EACmB,EACjC,GAAyB,EACzB,EAAE;IACF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IAEpF,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,UAAU,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IAE1B,OAAO,CACL,KAAC,mBAAmB,IAAC,GAAG,EAAE,GAAG,KAAM,SAAS,YAC1C,0BACG,UAAU,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAC9B,MAAM,kBAAkB,GAAG,CAAC,WAAW,CACrC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,EAAE,IAAI,EAC3B,IAAI,CAAC,IAAI,EACT,OAAO,CACR,CAAC;gBACF,MAAM,iBAAiB,GAAG,CAAC,WAAW,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;gBACxF,OAAO,CACL,MAAC,QAAQ,eACN,kBAAkB,IAAI,OAAO,KAAK,MAAM,IAAI,CAC3C,uBACE,aAAI,OAAO,EAAE,CAAC,YACZ,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,IAAI,WAAI,WAC7D,WACF,CACN,EACD,KAAC,YAAY,IACX,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,EACpD,YAAY,EAAE,kBAAkB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,IAAI,EACzE,YAAY,EAAE,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,IAAI,EACxE,WAAW,EAAE,WAAW,WACxB,KAdW,IAAI,CAAC,EAAE,CAeX,CACZ,CAAC;YACJ,CAAC,CAAC,WACI,WACY,CACvB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import {\n forwardRef,\n Fragment,\n FunctionComponent,\n PropsWithoutRef,\n useEffect,\n useState\n} from 'react';\n\nimport { ForwardProps } from '@pega/cosmos-react-core';\n\nimport { isSameGroup, sortByDate } from './utils';\nimport type TimelineProps from './Timeline.types';\nimport { StyledDate, StyledTimelineTable } from './Timeline.styles';\nimport TimelineItem from './TimelineItem';\n\nconst Timeline: FunctionComponent<TimelineProps & ForwardProps> = forwardRef(\n (\n {\n activity,\n currentTime,\n sortOrder = 'descending',\n groupBy = 'date',\n ...restProps\n }: PropsWithoutRef<TimelineProps>,\n ref: TimelineProps['ref']\n ) => {\n const [sortedData, setSortedData] = useState(() => sortByDate(activity, sortOrder));\n\n useEffect(() => {\n setSortedData(sortByDate(activity, sortOrder));\n }, [activity, sortOrder]);\n\n return (\n <StyledTimelineTable ref={ref} {...restProps}>\n <tbody>\n {sortedData.map((item, index) => {\n const isFirstItemInGroup = !isSameGroup(\n sortedData[index - 1]?.date,\n item.date,\n groupBy\n );\n const isLastItemInGroup = !isSameGroup(sortedData[index + 1]?.date, item.date, groupBy);\n return (\n <Fragment key={item.id}>\n {isFirstItemInGroup && groupBy !== 'none' && (\n <tr>\n <td colSpan={3}>\n <StyledDate variant={groupBy} format='long' value={item.date} />\n </td>\n </tr>\n )}\n <TimelineItem\n item={item}\n timeFormat={groupBy === 'date' ? 'time' : 'datetime'}\n prevItemDate={isFirstItemInGroup ? undefined : sortedData[index - 1].date}\n nextItemDate={isLastItemInGroup ? undefined : sortedData[index + 1].date}\n currentTime={currentTime}\n />\n </Fragment>\n );\n })}\n </tbody>\n </StyledTimelineTable>\n );\n }\n);\n\nexport default Timeline;\n"]}

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

@@ -1,17 +1,21 @@
 export declare const StyledCard: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").CardProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledCardContent: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").CardContentProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCardHeader: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").GridProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledToggleButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {
     collapsed: boolean;
 }, never>;
+export declare const StyledCardHeader: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").GridProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledTimelineIcon: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").FlexProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 interface StyledBulletWrapperProps {
+    hasPrev: boolean;
+    hasNext: boolean;
     isPrevFuture: boolean;
     isNextFuture: boolean;
+    hasIcon: boolean;
 }
-export declare const StyledBulletWrapper: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").GridProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, StyledBulletWrapperProps, never>;
-export declare const StyledGrid: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").GridProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledDate: import("styled-components").StyledComponent<"header", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledTime: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, Omit<import("@pega/cosmos-react-core").TextProps, "variant"> & Required<Pick<import("@pega/cosmos-react-core").TextProps, "variant">>, never>;
+export declare const StyledBulletWrapper: import("styled-components").StyledComponent<"td", import("styled-components").DefaultTheme, StyledBulletWrapperProps, never>;
+export declare const StyledTimelineTable: import("styled-components").StyledComponent<"table", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledDate: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").DateTimeDisplayProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledTimeWrapper: import("styled-components").StyledComponent<"td", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledTime: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").DateTimeDisplayProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export {};
 //# sourceMappingURL=Timeline.styles.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Timeline.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.styles.ts"],"names":[],"mappings":"~~AAcA~~,eAAO,MAAM,UAAU,~~mOAQrB~~,CAAC;AAIH,eAAO,MAAM,iBAAiB,0OAU5B,CAAC;AAIH,eAAO,MAAM,~~gBAAgB~~,~~mOAG5B~~,CAAC;~~AAEF~~,eAAO,MAAM,~~kBAAkB;eAA+B~~,~~OAAO;SAOnE~~,CAAC;~~AAMH~~,eAAO,MAAM,kBAAkB,~~mOAQ7B~~,CAAC;AAIH,UAAU,wBAAwB;IAChC,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,OAAO,CAAC;~~CACvB~~;AAED,eAAO,MAAM,mBAAmB,~~yPAqC~~/B,CAAC;AAIF,eAAO,MAAM,~~UAAU~~,~~mOAWrB~~,CAAC;AAIH,eAAO,MAAM,UAAU,~~4GAkBtB~~,CAAC;AAIF,eAAO,MAAM,UAAU,~~6OAIrB~~,CAAC"}
1	+ {"version":3,"file":"Timeline.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/Timeline.styles.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,UAAU,mOASrB,CAAC;AAIH,eAAO,MAAM,iBAAiB,0OAU5B,CAAC;AAIH,eAAO,MAAM,kBAAkB;eAA+B,OAAO;SAOnE,CAAC;AAIH,eAAO,MAAM,gBAAgB,mOAM5B,CAAC;AAIF,eAAO,MAAM,kBAAkB,mOAU7B,CAAC;AAIH,UAAU,wBAAwB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,mBAAmB,8HA4D/B,CAAC;AAIF,eAAO,MAAM,mBAAmB,2GA+B9B,CAAC;AAIH,eAAO,MAAM,UAAU,8OAetB,CAAC;AAIF,eAAO,MAAM,iBAAiB,wGAQ5B,CAAC;AAIH,eAAO,MAAM,UAAU,8OAKrB,CAAC"}