@paprika/progress-accordion NPM | npm.io

4.0.1 • Published 1 year ago

Install

Weekly downloads

160

License

MIT

Repository

Last release

1 year ago

@paprika/progress-accordion

Description

The ProgressAccordion component is a progress bar in a collapsible accordion format.

Installation

yarn add @paprika/progress-accordion

or with npm:

npm install @paprika/progress-accordion

Props

ProgressAccordion

Prop	Type	required	default	Description
a11yText	string	false	null	A11y text for assistive technologies to descibe the semantic list.
activeIndex	number	false	0
activeStatus	node	false	null	Optional status text to be displayed with the active list item.
children	node	false	null	List items (must be of type <ProgressAccordion.Item>.

Usage

import ProgressAccordion from "@paprika/progress-accordion";

<ProgressAccordion activeIndex={1} activeStatus="5 days idle" a11yText="Responses">
  <ProgressAccordion.Item label="Zero">
    <ProgressAccordion.Responses>
      <ProgressAccordion.Responses.Item heading="Who is on first?">
        <p>Yes.</p>
      </ProgressAccordion.Responses.Item>
      <ProgressAccordion.Responses.Item heading="What?">
        <p>Is on second.</p>
      </ProgressAccordion.Responses.Item>
    </ProgressAccordion.Responses>
  </ProgressAccordion.Item>
  <ProgressAccordion.Item label="One" />
  <ProgressAccordion.Item label="Two" />
</ProgressAccordion>;

Item

label
children

More detail about these props

Responses

children

More detail about this prop

Responses.Item

heading
children

More detail about this prop

Links

@babel/runtime-corejs2 @paprika/collapsible @paprika/icon @paprika/stylers @paprika/tokens prop-types

@infinitebrahmanuniverse/nolb-_pap @everything-registry/sub-chunk-704

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago

6 years ago