Accordion

An accordion allows the user to show and hide sections of related content on a screen.

Examples

Accordion can be used in both controlled and uncontrolled form.

Example 1: Accordion with default variant

RD

Rob Dunn

Subtitle



BnP 2021 - Establish an early decision and delivery cadence within BnP team

Due 30 Sep, 2022

50%

RD

Rob Dunn

Subtitle



BnP 2021 - Establish an early decision and delivery cadence within BnP team

Due 30 Sep, 2022

50%

RD

Rob Dunn

Subtitle



BnP 2021 - Establish an early decision and delivery cadence within BnP team

Due 30 Sep, 2022

50%

Example 2: Variant card

RD

Rob Dunn

Subtitle



BnP 2021 - Establish an early decision and delivery cadence within BnP team

Due 30 Sep, 2022

50%

RD

Rob Dunn

Subtitle



BnP 2021 - Establish an early decision and delivery cadence within BnP team

Due 30 Sep, 2022

50%

RD

Rob Dunn

Subtitle



BnP 2021 - Establish an early decision and delivery cadence within BnP team

Due 30 Sep, 2022

50%

Props

Accordion Props

	Prop	Required	Default	Type
	items	required		{ header: string | ReactElement<any, string | JSXElementConstructor<any>>; content: ReactElement<any, string | JSXElementConstructor<any>>; key: K; style?: StyleProp<...>; testID?: string; }[]
	activeItemKey			Key
	onItemPress			(key: K) => void
	style			StyleProp<ViewStyle>
	testID			string
	variant		default	"default" | "card"