@pega/lists-react 9.0.0-build.21.9 → 9.0.0-build.22.1

package/lib/Core/Views/Timeline/Timeline.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.types.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/Timeline.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactElement, ReactNode, Ref } from 'react';\n\nimport type {\n  BaseProps,\n  DateTimeDisplayProps,\n  FieldValueListProps,\n  IconProps,\n  NoChildrenProp,\n  StatusProps\n} from '@pega/cosmos-react-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nexport interface ActivityObject {\n  /** Unique id for activity */\n  id: string;\n  /** Date as ISO8601 string, timestamp or native Date object. */\n  date: string | number | Date;\n  /**\n   * Controls date time variant. Set to 'time' when groupBy is 'date'.\n   * @default datetime\n   */\n  dateVariant?: DateTimeDisplayProps['variant'];\n  /** Header region for rendering text and links. */\n  title: ReactNode;\n  /** Name of the icon (to be selected from default Pega icon set) */\n  icon?: IconProps['name'];\n  /**\n   * Default visually expanded state for the activity item.\n   * @default false\n   */\n  defaultExpanded?: boolean;\n  /** Represents the current status of activity */\n  status?: StatusProps;\n  /** The set of field values to render in the list. */\n  content?: FieldValueListProps['fields'] | ReactElement;\n}\n\nexport default interface TimelineProps extends BaseProps, NoChildrenProp {\n  /** List of activity */\n  activities: { header: ReactNode; activity: ActivityObject[] }[];\n  /** Current time as Date */\n  currentTime: Date;\n  /** Grouping configuration */\n  groupBy?: Group;\n  /**\n   * Show a Progress indicator at the end of a list where newly loaded items will be appended.\n   * @default false\n   */\n  loading?: boolean;\n  /** Callback to fetch more activity items */\n  loadMore?: () => void;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLTableElement>;\n}\n"]}
+{"version":3,"file":"Timeline.types.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/Timeline.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactElement, ReactNode, Ref } from 'react';\n\nimport type {\n  BaseProps,\n  DateTimeDisplayProps,\n  FieldValueListProps,\n  IconProps,\n  NoChildrenProp,\n  StatusProps\n} from '@pega/cosmos-react-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nexport interface ActivityObject {\n  /** Unique id for activity */\n  id: string;\n  /** Date as ISO8601 string, timestamp or native Date object. */\n  date: string | number | Date;\n  /**\n   * Controls date time variant. Set to 'time' when groupBy is 'date'.\n   * @default datetime\n   */\n  dateVariant?: DateTimeDisplayProps['variant'];\n  /** Header region for rendering text and links. */\n  title: ReactNode;\n  /** Name of the icon (to be selected from default Pega icon set) */\n  icon?: IconProps['name'];\n  /**\n   * Default visually expanded state for the activity item.\n   * @default false\n   */\n  defaultExpanded?: boolean;\n  /** Represents the current status of activity */\n  status?: StatusProps;\n  /** The set of field values to render in the list. */\n  content?: FieldValueListProps['fields'] | ReactElement;\n}\n\nexport default interface TimelineProps extends BaseProps, NoChildrenProp {\n  /** List of activity */\n  activities: { header: ReactNode; activity: ActivityObject[] }[];\n  /** Current time as Date */\n  currentTime: Date;\n  /** Grouping configuration */\n  groupBy?: Group;\n  /**\n   * Whether groups are expanded by default.\n   * Only applies when `groupBy` is provided.\n   * @default true\n   */\n  defaultGroupsExpanded?: boolean;\n  /**\n   * Show a Progress indicator at the end of a list where newly loaded items will be appended.\n   * @default false\n   */\n  loading?: boolean;\n  /** Callback to fetch more activity items */\n  loadMore?: () => void;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLTableElement>;\n}\n"]}

package/lib/Core/Views/Timeline/TimelineGroup.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from 'react';
+import type { Group } from 'pega-repeating-structures-core/types/State.types';
+import type { ActivityObject } from './Timeline.types';
+interface TimelineGroupProps {
+    header: ReactNode;
+    activity: ActivityObject[];
+    groupBy: Group | undefined;
+    currentTime: Date;
+    defaultExpanded: boolean;
+}
+declare const TimelineGroup: ({ header, activity, groupBy, currentTime, defaultExpanded }: TimelineGroupProps) => import("react/jsx-runtime").JSX.Element;
+export default TimelineGroup;
+//# sourceMappingURL=TimelineGroup.d.ts.map

package/lib/Core/Views/Timeline/TimelineGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimelineGroup.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Timeline/TimelineGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,kDAAkD,CAAC;AAE9E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AASvD,UAAU,kBAAkB;IAC1B,MAAM,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,cAAc,EAAE,CAAC;IAC3B,OAAO,EAAE,KAAK,GAAG,SAAS,CAAC;IAC3B,WAAW,EAAE,IAAI,CAAC;IAClB,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,QAAA,MAAM,aAAa,GAAI,6DAMpB,kBAAkB,4CA8CpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/Core/Views/Timeline/TimelineGroup.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId, useState } from 'react';
+import { ExpandCollapse, ExpandCollapseButton, Grid, Text, useI18n } from '@pega/cosmos-react-core';
+import { StyledGroupContentList, StyledGroupHeader, StyledTimelineGroup, timelineItemsGridProps } from './Timeline.styles';
+import TimelineItem from './TimelineItem';
+const TimelineGroup = ({ header, activity, groupBy, currentTime, defaultExpanded }) => {
+    const [expanded, setExpanded] = useState(defaultExpanded);
+    const headerId = useId();
+    const contentId = useId();
+    const t = useI18n();
+    const toggleLabel = expanded ? t('collapse') : t('expand');
+    return (_jsxs(StyledTimelineGroup, { "data-timeline-group": true, children: [_jsxs(StyledGroupHeader, { children: [_jsx(ExpandCollapseButton, { expanded: expanded, onToggle: () => setExpanded(prev => !prev), iconOnly: true, compact: true, "aria-label": toggleLabel, "aria-describedby": headerId, "aria-controls": contentId }), _jsx(Text, { variant: 'h3', id: headerId, children: header })] }), _jsx(ExpandCollapse, { collapsed: !expanded, dimension: 'height', as: 'section', children: _jsx("div", { id: contentId, role: 'region', "aria-labelledby": headerId, children: _jsx(Grid, { ...timelineItemsGridProps, as: StyledGroupContentList, children: activity.map((item, index) => (_jsx(TimelineItem, { item: {
+                                ...item,
+                                ...(groupBy?.dateFunction === 'DAYS' &&
+                                    (!item.dateVariant || item.dateVariant === 'datetime') && {
+                                    dateVariant: 'time'
+                                })
+                            }, prevItemDate: activity[index - 1]?.date, nextItemDate: activity[index + 1]?.date, currentTime: currentTime }, item.id))) }) }) })] }));
+};
+export default TimelineGroup;
+//# sourceMappingURL=TimelineGroup.js.map

package/lib/Core/Views/Timeline/TimelineGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimelineGroup.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/TimelineGroup.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAExC,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAIpG,OAAO,EACL,sBAAsB,EACtB,iBAAiB,EACjB,mBAAmB,EACnB,sBAAsB,EACvB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAU1C,MAAM,aAAa,GAAG,CAAC,EACrB,MAAM,EACN,QAAQ,EACR,OAAO,EACP,WAAW,EACX,eAAe,EACI,EAAE,EAAE;IACvB,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;IAC1D,MAAM,QAAQ,GAAG,KAAK,EAAE,CAAC;IACzB,MAAM,SAAS,GAAG,KAAK,EAAE,CAAC;IAC1B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,WAAW,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IAE3D,OAAO,CACL,MAAC,mBAAmB,4CAClB,MAAC,iBAAiB,eAChB,KAAC,oBAAoB,IACnB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,EAC1C,QAAQ,QACR,OAAO,sBACK,WAAW,sBACL,QAAQ,mBACX,SAAS,GACxB,EACF,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,EAAC,EAAE,EAAE,QAAQ,YAC5B,MAAM,GACF,IACW,EACpB,KAAC,cAAc,IAAC,SAAS,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAC,QAAQ,EAAC,EAAE,EAAC,SAAS,YACnE,cAAK,EAAE,EAAE,SAAS,EAAE,IAAI,EAAC,QAAQ,qBAAkB,QAAQ,YACzD,KAAC,IAAI,OAAK,sBAAsB,EAAE,EAAE,EAAE,sBAAsB,YACzD,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7B,KAAC,YAAY,IAEX,IAAI,EAAE;gCACJ,GAAG,IAAI;gCACP,GAAG,CAAC,OAAO,EAAE,YAAY,KAAK,MAAM;oCAClC,CAAC,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,WAAW,KAAK,UAAU,CAAC,IAAI;oCACxD,WAAW,EAAE,MAAM;iCACpB,CAAC;6BACL,EACD,YAAY,EAAE,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC,EAAE,IAAI,EACvC,YAAY,EAAE,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC,EAAE,IAAI,EACvC,WAAW,EAAE,WAAW,IAVnB,IAAI,CAAC,EAAE,CAWZ,CACH,CAAC,GACG,GACH,GACS,IACG,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import type { ReactNode } from 'react';\nimport { useId, useState } from 'react';\n\nimport { ExpandCollapse, ExpandCollapseButton, Grid, Text, useI18n } from '@pega/cosmos-react-core';\nimport type { Group } from 'pega-repeating-structures-core/types/State.types';\n\nimport type { ActivityObject } from './Timeline.types';\nimport {\n  StyledGroupContentList,\n  StyledGroupHeader,\n  StyledTimelineGroup,\n  timelineItemsGridProps\n} from './Timeline.styles';\nimport TimelineItem from './TimelineItem';\n\ninterface TimelineGroupProps {\n  header: ReactNode;\n  activity: ActivityObject[];\n  groupBy: Group | undefined;\n  currentTime: Date;\n  defaultExpanded: boolean;\n}\n\nconst TimelineGroup = ({\n  header,\n  activity,\n  groupBy,\n  currentTime,\n  defaultExpanded\n}: TimelineGroupProps) => {\n  const [expanded, setExpanded] = useState(defaultExpanded);\n  const headerId = useId();\n  const contentId = useId();\n  const t = useI18n();\n  const toggleLabel = expanded ? t('collapse') : t('expand');\n\n  return (\n    <StyledTimelineGroup data-timeline-group>\n      <StyledGroupHeader>\n        <ExpandCollapseButton\n          expanded={expanded}\n          onToggle={() => setExpanded(prev => !prev)}\n          iconOnly\n          compact\n          aria-label={toggleLabel}\n          aria-describedby={headerId}\n          aria-controls={contentId}\n        />\n        <Text variant='h3' id={headerId}>\n          {header}\n        </Text>\n      </StyledGroupHeader>\n      <ExpandCollapse collapsed={!expanded} dimension='height' as='section'>\n        <div id={contentId} role='region' aria-labelledby={headerId}>\n          <Grid {...timelineItemsGridProps} as={StyledGroupContentList}>\n            {activity.map((item, index) => (\n              <TimelineItem\n                key={item.id}\n                item={{\n                  ...item,\n                  ...(groupBy?.dateFunction === 'DAYS' &&\n                    (!item.dateVariant || item.dateVariant === 'datetime') && {\n                      dateVariant: 'time'\n                    })\n                }}\n                prevItemDate={activity[index - 1]?.date}\n                nextItemDate={activity[index + 1]?.date}\n                currentTime={currentTime}\n              />\n            ))}\n          </Grid>\n        </div>\n      </ExpandCollapse>\n    </StyledTimelineGroup>\n  );\n};\n\nexport default TimelineGroup;\n"]}

package/lib/Core/Views/Timeline/TimelineItem.d.ts

@@ -1,5 +1,3 @@
-import type { FunctionComponent } from 'react';
-import type { ForwardProps } from '@pega/cosmos-react-core';
 import type { ActivityObject } from './Timeline.types';
 interface TimelineItemProps {
     item: ActivityObject;
@@ -7,6 +5,6 @@ interface TimelineItemProps {
     nextItemDate: ActivityObject['date'] | undefined;
     currentTime: Date;
 }
-declare const TimelineItem: FunctionComponent<TimelineItemProps & ForwardProps>;
+declare const TimelineItem: ({ item: { date, dateVariant, title, icon, defaultExpanded, status, content }, prevItemDate, nextItemDate, currentTime }: TimelineItemProps) => import("react/jsx-runtime").JSX.Element;
 export default TimelineItem;
 //# sourceMappingURL=TimelineItem.d.ts.map

package/lib/Core/Views/Timeline/TimelineItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineItem.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Timeline/TimelineItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAgB,MAAM,OAAO,CAAC;AAG7D,OAAO,KAAK,EAA2B,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAsBrF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGvD,UAAU,iBAAiB;IACzB,IAAI,EAAE,cAAc,CAAC;IACrB,YAAY,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjD,YAAY,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjD,WAAW,EAAE,IAAI,CAAC;CACnB;AAgBD,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CAgHrE,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"TimelineItem.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Timeline/TimelineItem.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGvD,UAAU,iBAAiB;IACzB,IAAI,EAAE,cAAc,CAAC;IACrB,YAAY,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjD,YAAY,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjD,WAAW,EAAE,IAAI,CAAC;CACnB;AAgBD,QAAA,MAAM,YAAY,GAAI,yHAKnB,iBAAiB,4CA2GnB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/Core/Views/Timeline/TimelineItem.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useState } from 'react';
-import { Card, ExpandCollapse, FieldValueItem, Grid, Icon, Status, useBreakpoint, isValidElement } from '@pega/cosmos-react-core';
-import { StyledBulletWrapper, StyledCardContent, StyledCardHeader, StyledTime, StyledTimelineIcon, StyledTimelineListItem, StyledTitle, StyledToggleButton } from './Timeline.styles';
+import { Card, ExpandCollapse, ExpandCollapseButton, FieldValueItem, Grid, Icon, Status, useBreakpoint, useUID, isValidElement } from '@pega/cosmos-react-core';
+import { StyledBulletWrapper, StyledCardContent, StyledCardHeader, StyledTime, StyledTimelineIcon, StyledTimelineListItem, StyledTitle } from './Timeline.styles';
 import { isFutureDate } from './utils';
 const shouldRenderContent = (content) => {
     if (!content) {
@@ -13,24 +13,25 @@ const shouldRenderContent = (content) => {
     return true;
 };
 const TimelineItem = ({ item: { date, dateVariant = 'datetime', title, icon, defaultExpanded = false, status, content }, prevItemDate, nextItemDate, currentTime }) => {
+    const timeId = useUID();
     const [expanded, setExpanded] = useState(defaultExpanded);
     const isSmallOrAbove = useBreakpoint('sm');
     const contentListRef = useRef(null);
     const isSMContentWidthOrAbove = useBreakpoint('sm', {
         breakpointRef: contentListRef
     });
-    return (_jsxs(StyledTimelineListItem, { children: [isSmallOrAbove && _jsx(StyledTime, { variant: dateVariant, value: date, format: 'short' }), _jsx(StyledBulletWrapper, { hasIcon: !!icon, hasPrev: !!prevItemDate, hasNext: !!nextItemDate, isPrevFuture: isFutureDate(prevItemDate, currentTime), isNextFuture: isFutureDate(nextItemDate, currentTime), children: _jsx(StyledTimelineIcon, { container: { inline: true, alignItems: 'center', justify: 'center' }, children: icon && _jsx(Icon, { name: icon }) }) }), _jsxs("div", { children: [_jsx("div", { children: _jsx(Card, { children: _jsxs(StyledCardHeader, { container: {
+    return (_jsxs(StyledTimelineListItem, { children: [isSmallOrAbove && (_jsx(StyledTime, { id: timeId, variant: dateVariant, value: date, format: 'short' })), _jsx(StyledBulletWrapper, { hasIcon: !!icon, hasPrev: !!prevItemDate, hasNext: !!nextItemDate, isPrevFuture: isFutureDate(prevItemDate, currentTime), isNextFuture: isFutureDate(nextItemDate, currentTime), children: _jsx(StyledTimelineIcon, { container: { inline: true, alignItems: 'center', justify: 'center' }, children: icon && _jsx(Icon, { name: icon }) }) }), _jsxs("div", { children: [_jsx("div", { children: _jsx(Card, { children: _jsxs(StyledCardHeader, { container: {
                                     cols: 'auto 1fr',
                                     alignContent: 'evenly',
                                     alignItems: 'center',
                                     gap: 0.5
-                                }, sm: { container: { cols: 'auto 1fr auto' } }, children: [shouldRenderContent(content) && (_jsx(StyledToggleButton, { icon: true, variant: 'simple', onClick: () => {
+                                }, sm: { container: { cols: 'auto 1fr auto' } }, children: [shouldRenderContent(content) && (_jsx(ExpandCollapseButton, { expanded: expanded, onToggle: () => {
                                             setExpanded(cur => !cur);
-                                        }, collapsed: !expanded, "aria-expanded": expanded, compact: true, children: _jsx(Icon, { name: 'caret-down' }) })), _jsxs(Grid, { item: { colStart: '2', colEnd: '2' }, container: { rowGap: 0.25 }, children: [_jsx(StyledTitle, { children: title }), !isSmallOrAbove && (_jsxs(Grid, { container: {
+                                        }, iconOnly: true, compact: true, "aria-labelledby": timeId })), _jsxs(Grid, { item: { colStart: '2', colEnd: '2' }, container: { rowGap: 0.25 }, children: [_jsx(StyledTitle, { children: title }), !isSmallOrAbove && (_jsxs(Grid, { container: {
                                                     cols: '1fr auto',
                                                     alignContent: 'evenly',
                                                     alignItems: 'center'
-                                                }, children: [_jsx(StyledTime, { variant: 'time', value: date, format: 'short' }), status && _jsx(Status, { variant: status.variant, children: status.children })] }))] }), isSmallOrAbove && status && (_jsx(Grid, { sm: { item: { colStart: '3', colEnd: '3' } }, children: _jsx(Status, { variant: status.variant, children: status.children }) }))] }) }) }), shouldRenderContent(content) && (_jsx(ExpandCollapse, { dimension: 'height', collapsed: !expanded, children: _jsx(StyledCardContent, { children: isValidElement(content) ? (content) : (_jsx(Grid, { container: {
+                                                }, children: [_jsx(StyledTime, { id: timeId, variant: 'time', value: date, format: 'short' }), status && _jsx(Status, { variant: status.variant, children: status.children })] }))] }), isSmallOrAbove && status && (_jsx(Grid, { sm: { item: { colStart: '3', colEnd: '3' } }, children: _jsx(Status, { variant: status.variant, children: status.children }) }))] }) }) }), shouldRenderContent(content) && (_jsx(ExpandCollapse, { dimension: 'height', collapsed: !expanded, children: _jsx(StyledCardContent, { children: isValidElement(content) ? (content) : (_jsx(Grid, { container: {
                                     gap: 1,
                                     cols: isSMContentWidthOrAbove
                                         ? `repeat(${content.length > 1 ? '2' : '1'}, minmax(16ch, auto) minmax(25%, 1fr))`

package/lib/Core/Views/Timeline/TimelineItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineItem.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/TimelineItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FunctionComponent, ReactElement } from 'react';\nimport { useRef, useState } from 'react';\n\nimport type { FieldValueListItemProps, ForwardProps } from '@pega/cosmos-react-core';\nimport {\n  Card,\n  ExpandCollapse,\n  FieldValueItem,\n  Grid,\n  Icon,\n  Status,\n  useBreakpoint,\n  isValidElement\n} from '@pega/cosmos-react-core';\n\nimport {\n  StyledBulletWrapper,\n  StyledCardContent,\n  StyledCardHeader,\n  StyledTime,\n  StyledTimelineIcon,\n  StyledTimelineListItem,\n  StyledTitle,\n  StyledToggleButton\n} from './Timeline.styles';\nimport type { ActivityObject } from './Timeline.types';\nimport { isFutureDate } from './utils';\n\ninterface TimelineItemProps {\n  item: ActivityObject;\n  prevItemDate: ActivityObject['date'] | undefined;\n  nextItemDate: ActivityObject['date'] | undefined;\n  currentTime: Date;\n}\n\nconst shouldRenderContent = (\n  content: ActivityObject['content']\n): content is [FieldValueListItemProps, ...FieldValueListItemProps[]] | ReactElement => {\n  if (!content) {\n    return false;\n  }\n\n  if (Array.isArray(content)) {\n    return content.length > 0;\n  }\n\n  return true;\n};\n\nconst TimelineItem: FunctionComponent<TimelineItemProps & ForwardProps> = ({\n  item: { date, dateVariant = 'datetime', title, icon, defaultExpanded = false, status, content },\n  prevItemDate,\n  nextItemDate,\n  currentTime\n}: TimelineItemProps & ForwardProps) => {\n  const [expanded, setExpanded] = useState(defaultExpanded);\n  const isSmallOrAbove = useBreakpoint('sm');\n\n  const contentListRef = useRef<HTMLDivElement>(null);\n  const isSMContentWidthOrAbove = useBreakpoint('sm', {\n    breakpointRef: contentListRef\n  });\n\n  return (\n    <StyledTimelineListItem>\n      {isSmallOrAbove && <StyledTime variant={dateVariant} value={date} format='short' />}\n      <StyledBulletWrapper\n        hasIcon={!!icon}\n        hasPrev={!!prevItemDate}\n        hasNext={!!nextItemDate}\n        isPrevFuture={isFutureDate(prevItemDate, currentTime)}\n        isNextFuture={isFutureDate(nextItemDate, currentTime)}\n      >\n        <StyledTimelineIcon container={{ inline: true, alignItems: 'center', justify: 'center' }}>\n          {icon && <Icon name={icon} />}\n        </StyledTimelineIcon>\n      </StyledBulletWrapper>\n      <div>\n        <div>\n          <Card>\n            <StyledCardHeader\n              container={{\n                cols: 'auto 1fr',\n                alignContent: 'evenly',\n                alignItems: 'center',\n                gap: 0.5\n              }}\n              sm={{ container: { cols: 'auto 1fr auto' } }}\n            >\n              {shouldRenderContent(content) && (\n                <StyledToggleButton\n                  icon\n                  variant='simple'\n                  onClick={() => {\n                    setExpanded(cur => !cur);\n                  }}\n                  collapsed={!expanded}\n                  aria-expanded={expanded}\n                  compact\n                >\n                  <Icon name='caret-down' />\n                </StyledToggleButton>\n              )}\n              <Grid item={{ colStart: '2', colEnd: '2' }} container={{ rowGap: 0.25 }}>\n                <StyledTitle>{title}</StyledTitle>\n                {!isSmallOrAbove && (\n                  <Grid\n                    container={{\n                      cols: '1fr auto',\n                      alignContent: 'evenly',\n                      alignItems: 'center'\n                    }}\n                  >\n                    <StyledTime variant='time' value={date} format='short' />\n                    {status && <Status variant={status.variant}>{status.children}</Status>}\n                  </Grid>\n                )}\n              </Grid>\n              {isSmallOrAbove && status && (\n                <Grid sm={{ item: { colStart: '3', colEnd: '3' } }}>\n                  <Status variant={status.variant}>{status.children}</Status>\n                </Grid>\n              )}\n            </StyledCardHeader>\n          </Card>\n        </div>\n        {shouldRenderContent(content) && (\n          <ExpandCollapse dimension='height' collapsed={!expanded}>\n            <StyledCardContent>\n              {isValidElement(content) ? (\n                content\n              ) : (\n                <Grid\n                  container={{\n                    gap: 1,\n                    cols: isSMContentWidthOrAbove\n                      ? `repeat(${\n                          content.length > 1 ? '2' : '1'\n                        }, minmax(16ch, auto) minmax(25%, 1fr))`\n                      : 'minmax(0, 1fr)'\n                  }}\n                  ref={contentListRef}\n                >\n                  {content.map(({ id, name, value, variant }) => {\n                    return (\n                      <FieldValueItem\n                        name={name}\n                        value={value}\n                        variant={isSmallOrAbove ? variant : 'stacked'}\n                        key={id ?? name}\n                      />\n                    );\n                  })}\n                </Grid>\n              )}\n            </StyledCardContent>\n          </ExpandCollapse>\n        )}\n      </div>\n    </StyledTimelineListItem>\n  );\n};\n\nexport default TimelineItem;\n"]}
+{"version":3,"file":"TimelineItem.js","sourceRoot":"","sources":["../../../../Core/Views/Timeline/TimelineItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { ReactElement } from 'react';\nimport { useRef, useState } from 'react';\n\nimport type { FieldValueListItemProps } from '@pega/cosmos-react-core';\nimport {\n  Card,\n  ExpandCollapse,\n  ExpandCollapseButton,\n  FieldValueItem,\n  Grid,\n  Icon,\n  Status,\n  useBreakpoint,\n  useUID,\n  isValidElement\n} from '@pega/cosmos-react-core';\n\nimport {\n  StyledBulletWrapper,\n  StyledCardContent,\n  StyledCardHeader,\n  StyledTime,\n  StyledTimelineIcon,\n  StyledTimelineListItem,\n  StyledTitle\n} from './Timeline.styles';\nimport type { ActivityObject } from './Timeline.types';\nimport { isFutureDate } from './utils';\n\ninterface TimelineItemProps {\n  item: ActivityObject;\n  prevItemDate: ActivityObject['date'] | undefined;\n  nextItemDate: ActivityObject['date'] | undefined;\n  currentTime: Date;\n}\n\nconst shouldRenderContent = (\n  content: ActivityObject['content']\n): content is [FieldValueListItemProps, ...FieldValueListItemProps[]] | ReactElement => {\n  if (!content) {\n    return false;\n  }\n\n  if (Array.isArray(content)) {\n    return content.length > 0;\n  }\n\n  return true;\n};\n\nconst TimelineItem = ({\n  item: { date, dateVariant = 'datetime', title, icon, defaultExpanded = false, status, content },\n  prevItemDate,\n  nextItemDate,\n  currentTime\n}: TimelineItemProps) => {\n  const timeId = useUID();\n  const [expanded, setExpanded] = useState(defaultExpanded);\n  const isSmallOrAbove = useBreakpoint('sm');\n\n  const contentListRef = useRef<HTMLDivElement>(null);\n  const isSMContentWidthOrAbove = useBreakpoint('sm', {\n    breakpointRef: contentListRef\n  });\n\n  return (\n    <StyledTimelineListItem>\n      {isSmallOrAbove && (\n        <StyledTime id={timeId} variant={dateVariant} value={date} format='short' />\n      )}\n      <StyledBulletWrapper\n        hasIcon={!!icon}\n        hasPrev={!!prevItemDate}\n        hasNext={!!nextItemDate}\n        isPrevFuture={isFutureDate(prevItemDate, currentTime)}\n        isNextFuture={isFutureDate(nextItemDate, currentTime)}\n      >\n        <StyledTimelineIcon container={{ inline: true, alignItems: 'center', justify: 'center' }}>\n          {icon && <Icon name={icon} />}\n        </StyledTimelineIcon>\n      </StyledBulletWrapper>\n      <div>\n        <div>\n          <Card>\n            <StyledCardHeader\n              container={{\n                cols: 'auto 1fr',\n                alignContent: 'evenly',\n                alignItems: 'center',\n                gap: 0.5\n              }}\n              sm={{ container: { cols: 'auto 1fr auto' } }}\n            >\n              {shouldRenderContent(content) && (\n                <ExpandCollapseButton\n                  expanded={expanded}\n                  onToggle={() => {\n                    setExpanded(cur => !cur);\n                  }}\n                  iconOnly\n                  compact\n                  aria-labelledby={timeId}\n                />\n              )}\n              <Grid item={{ colStart: '2', colEnd: '2' }} container={{ rowGap: 0.25 }}>\n                <StyledTitle>{title}</StyledTitle>\n                {!isSmallOrAbove && (\n                  <Grid\n                    container={{\n                      cols: '1fr auto',\n                      alignContent: 'evenly',\n                      alignItems: 'center'\n                    }}\n                  >\n                    <StyledTime id={timeId} variant='time' value={date} format='short' />\n                    {status && <Status variant={status.variant}>{status.children}</Status>}\n                  </Grid>\n                )}\n              </Grid>\n              {isSmallOrAbove && status && (\n                <Grid sm={{ item: { colStart: '3', colEnd: '3' } }}>\n                  <Status variant={status.variant}>{status.children}</Status>\n                </Grid>\n              )}\n            </StyledCardHeader>\n          </Card>\n        </div>\n        {shouldRenderContent(content) && (\n          <ExpandCollapse dimension='height' collapsed={!expanded}>\n            <StyledCardContent>\n              {isValidElement(content) ? (\n                content\n              ) : (\n                <Grid\n                  container={{\n                    gap: 1,\n                    cols: isSMContentWidthOrAbove\n                      ? `repeat(${\n                          content.length > 1 ? '2' : '1'\n                        }, minmax(16ch, auto) minmax(25%, 1fr))`\n                      : 'minmax(0, 1fr)'\n                  }}\n                  ref={contentListRef}\n                >\n                  {content.map(({ id, name, value, variant }) => {\n                    return (\n                      <FieldValueItem\n                        name={name}\n                        value={value}\n                        variant={isSmallOrAbove ? variant : 'stacked'}\n                        key={id ?? name}\n                      />\n                    );\n                  })}\n                </Grid>\n              )}\n            </StyledCardContent>\n          </ExpandCollapse>\n        )}\n      </div>\n    </StyledTimelineListItem>\n  );\n};\n\nexport default TimelineItem;\n"]}

package/lib/index.d.ts

@@ -1,5 +1,5 @@
 export { default as RepeatingStructures } from './Core/Components/RSWrapper/index';
-export { convertMetaIntoState, UPDATE_DEBUG_INFO, TOGGLE_DISABLE_SELECTION, TOGGLE_REQUIRED, NOTIFY_DATA_REFRESH, USER_CONFIRMATION_ACTION, SET_IN_EXTERNAL_STATE, UPDATE_SELECTED_ROWS } from 'pega-repeating-structures-core';
+export { convertMetaIntoState, UPDATE_DEBUG_INFO, TOGGLE_DISABLE_SELECTION, TOGGLE_REQUIRED, NOTIFY_DATA_REFRESH, USER_CONFIRMATION_ACTION, SET_IN_EXTERNAL_STATE, UPDATE_SELECTED_ROWS, SET_WARNING_MESSAGES } from 'pega-repeating-structures-core';
 export { EXTERNAL_FILTERS, FOCUSABLE_SELECTORS, ACTIONABLE_SELECTORS } from './Core/constants';
 export type { RSTypes } from './types';
 export type { RepeatingStructuresProps } from './types/RepeatingStructuresBoot.types';

package/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAGnF,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,wBAAwB,EACxB,eAAe,EACf,mBAAmB,EACnB,wBAAwB,EACxB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,gCAAgC,CAAC;AAGxC,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAE/F,YAAY,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AACvC,YAAY,EAAE,wBAAwB,EAAE,MAAM,uCAAuC,CAAC;AAEtF,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAGnF,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,wBAAwB,EACxB,eAAe,EACf,mBAAmB,EACnB,wBAAwB,EACxB,qBAAqB,EACrB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,gCAAgC,CAAC;AAGxC,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAE/F,YAAY,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AACvC,YAAY,EAAE,wBAAwB,EAAE,MAAM,uCAAuC,CAAC;AAEtF,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC"}

package/lib/index.js

@@ -1,6 +1,6 @@
 export { default as RepeatingStructures } from './Core/Components/RSWrapper/index';
 // FIXME: revisit these imports
-export { convertMetaIntoState, UPDATE_DEBUG_INFO, TOGGLE_DISABLE_SELECTION, TOGGLE_REQUIRED, NOTIFY_DATA_REFRESH, USER_CONFIRMATION_ACTION, SET_IN_EXTERNAL_STATE, UPDATE_SELECTED_ROWS } from 'pega-repeating-structures-core';
+export { convertMetaIntoState, UPDATE_DEBUG_INFO, TOGGLE_DISABLE_SELECTION, TOGGLE_REQUIRED, NOTIFY_DATA_REFRESH, USER_CONFIRMATION_ACTION, SET_IN_EXTERNAL_STATE, UPDATE_SELECTED_ROWS, SET_WARNING_MESSAGES } from 'pega-repeating-structures-core';
 // Dispatch Action constants that is used by consumer in order to send particular actions to Repeating structures
 export { EXTERNAL_FILTERS, FOCUSABLE_SELECTORS, ACTIONABLE_SELECTORS } from './Core/constants';
 export { ROW_DENSITY } from 'pega-repeating-structures-core';

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAEnF,+BAA+B;AAC/B,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,wBAAwB,EACxB,eAAe,EACf,mBAAmB,EACnB,wBAAwB,EACxB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,gCAAgC,CAAC;AAExC,iHAAiH;AACjH,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAK/F,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC","sourcesContent":["export { default as RepeatingStructures } from './Core/Components/RSWrapper/index';\n\n// FIXME: revisit these imports\nexport {\n  convertMetaIntoState,\n  UPDATE_DEBUG_INFO,\n  TOGGLE_DISABLE_SELECTION,\n  TOGGLE_REQUIRED,\n  NOTIFY_DATA_REFRESH,\n  USER_CONFIRMATION_ACTION,\n  SET_IN_EXTERNAL_STATE,\n  UPDATE_SELECTED_ROWS\n} from 'pega-repeating-structures-core';\n\n// Dispatch Action constants that is used by consumer in order to send particular actions to Repeating structures\nexport { EXTERNAL_FILTERS, FOCUSABLE_SELECTORS, ACTIONABLE_SELECTORS } from './Core/constants';\n\nexport type { RSTypes } from './types';\nexport type { RepeatingStructuresProps } from './types/RepeatingStructuresBoot.types';\n\nexport { ROW_DENSITY } from 'pega-repeating-structures-core';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAEnF,+BAA+B;AAC/B,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,wBAAwB,EACxB,eAAe,EACf,mBAAmB,EACnB,wBAAwB,EACxB,qBAAqB,EACrB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,gCAAgC,CAAC;AAExC,iHAAiH;AACjH,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAK/F,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC","sourcesContent":["export { default as RepeatingStructures } from './Core/Components/RSWrapper/index';\n\n// FIXME: revisit these imports\nexport {\n  convertMetaIntoState,\n  UPDATE_DEBUG_INFO,\n  TOGGLE_DISABLE_SELECTION,\n  TOGGLE_REQUIRED,\n  NOTIFY_DATA_REFRESH,\n  USER_CONFIRMATION_ACTION,\n  SET_IN_EXTERNAL_STATE,\n  UPDATE_SELECTED_ROWS,\n  SET_WARNING_MESSAGES\n} from 'pega-repeating-structures-core';\n\n// Dispatch Action constants that is used by consumer in order to send particular actions to Repeating structures\nexport { EXTERNAL_FILTERS, FOCUSABLE_SELECTORS, ACTIONABLE_SELECTORS } from './Core/constants';\n\nexport type { RSTypes } from './types';\nexport type { RepeatingStructuresProps } from './types/RepeatingStructuresBoot.types';\n\nexport { ROW_DENSITY } from 'pega-repeating-structures-core';\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/lists-react",
-  "version": "9.0.0-build.21.9",
+  "version": "9.0.0-build.22.1",
   "description": "Repeating view structures such as Table, Gallery(Repeating layouts), Kanban etc.",
   "license": "SEE LICENSE IN LICENSE",
   "author": "Pegasystems",
@@ -14,9 +14,9 @@
     "build": "tsc -b tsconfig.build.json"
   },
   "dependencies": {
-    "@pega/cosmos-react-condition-builder": "9.0.0-build.21.9",
-    "@pega/cosmos-react-core": "9.0.0-build.21.9",
-    "@pega/cosmos-react-rte": "9.0.0-build.21.9",
+    "@pega/cosmos-react-condition-builder": "9.0.0-build.22.1",
+    "@pega/cosmos-react-core": "9.0.0-build.22.1",
+    "@pega/cosmos-react-rte": "9.0.0-build.22.1",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^17.0.62 || ^18.3.3",
     "@types/react-dom": "^17.0.20 || ^18.3.0",
@@ -24,8 +24,8 @@
     "dayjs": "^1.11.13",
     "fast-deep-equal": "^3.1.3",
     "lodash-es": "^4.17.23",
-    "pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.21.9",
-    "pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.21.9",
+    "pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.22.1",
+    "pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.22.1",
     "polished": "^4.1.0",
     "prop-types": "^15.8.1",
     "react": "^17.0.0 || ^18.0.0",
@@ -44,7 +44,7 @@
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.6.1",
     "jest-axe": "^8.0.0",
-    "srs-utils": "9.0.0-build.21.9",
+    "srs-utils": "9.0.0-build.22.1",
     "typescript": "~5.9.3"
   }
 }