Skip to content

Add a collabsible details component #1802

@connor-baer

Description

@connor-baer

Visual

Screenshot 2022-10-18 at 17 36 23

From SumUp's developer portal

From SumUp's shop

Screenshot 2022-10-18 at 17 36 23

From SumUp's website

Context

A pattern has emerged at SumUp to display FAQs and similar content in collapsible sections. Essentially, this is a styled version of the <details> HTML element.

State

The component has an open and closed state. Circuit UI already exports the useCollapsible hook that abstracts this state logic.

Progressive enhancement

The component should fill the full width of its parent on all viewports. It should work without JavaScript using the default behaviour of the <details> HTML element.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions