[Feature request] riverAccordion

[nsolerieu]

Context

We often stack our river to create a product features et narrative. This leads to long pages that spread small amount of incremental information over lots of scroll and many demos. By condensing the content of multiple river into an accordion we could create a stronger condensed narrative.

Here is an example of both approach side by side:

@simmonsjenna has been exploring similar UX for the homepage section

Design suggestion

The component relies structurally on up 4 text+image internal units (with a minimum of 2, 1 being a regular river) and an active state rotation setting focus on one unit at the time. It would not be proper accordion that the extent that it would have a single active element at any time.

• Similarly to the riverStoryScroll we could combine multiple rivers
• Create a variant of the river with multiple image+content internal units
• Create a net new component

Component props:

Each props would apply equally to all units:

• Autoplay (default: true - 5s)
• Link (default: false)
• Status icon (default: true) = + or - depending on active item
• Description (default: false)
• leadingIcon (default: false)

Timing/urgency

Homepage is likely going to need a quick build with very specific styling led by brand refactoring thus will be custom built. I suggest that this should inform the definition phase in parallel.