Theme

Button Variant Rename

Banner Description Prop

Getting started

Breaking changes

Style utilities

DescriptionList

OptionCardGroup

SegmentedControl

FormattedDateTime

FormattedRelativeTime

KeyboardShortcut

StatusIndicator

ConfirmationModal

Ember Floating UI

Ember prop spreading

tooltip-custom-interactive

no-banned-imports

enforce-pluma-elements

no-deprecated-apis

no-deprecated-icons

no-raw-pluma-classnames

no-raw-pluma-css-variables

require-form-control-label

prefer-managed-modals

PopoverPrimitive

Componentsv2.189.1

Iconsv1.19.0

MCPv0.8.62

Tokensv0.34.3

Timeline

Presents ordered events, milestones, or state transitions with a connected vertical rail.

Usage

import { PlumaTestHelpers } from '@customerio/pluma-components/react/test-helpers/pluma-test-helpers'

const timeline = PlumaTestHelpers.find('Timeline');

// Read across every event row.
timeline.getItemTitles();
timeline.getItemMeta();
timeline.getItemDescriptions();

// Drill into a single row (by title or index) for its detailed state.
const item = timeline.getItem('Sent email'); // or timeline.getItemAt(0)
item?.getColor();
item?.getMarkerIcon();
item?.isCurrent();

Test Helpers

`TimelineTestHelpers`

`getItem`
(
`title:string`
)
`=> TimelineItemTestHelpers | undefined`

Gets a scoped test helper for a timeline event item by title.

`getItemAt`
(
`index:number`
)
`=> TimelineItemTestHelpers | undefined`

Gets a scoped test helper for a timeline event item by zero-based index.

`getItemContents`() `=> string[]`

Gets rendered content text for timeline event items.

`getItemCount`() `=> number`

Gets the number of timeline event items.

`getItemDescriptions`() `=> string[]`

Gets supporting descriptions for timeline event items.

`getItemMeta`() `=> string[]`

Gets meta values, usually timestamps, for timeline event items.

`getItems`() `=> TimelineItemTestHelpers[]`

Gets a scoped test helper for each timeline event item.

`getItemTitles`() `=> string[]`

Gets primary titles for timeline event items.

`hasItem`
(
`title:string`
)
`=> boolean`

Checks if a timeline event item with the title exists.

On this page