How to use the bpk-component-accordion.withSingleItemAccordionState function in bpk-component-accordion

To help you get started, we’ve selected a few bpk-component-accordion examples, based on popular ways it is used in public projects.

github Skyscanner / backpack / packages / bpk-docs / src / pages / AccordionsPage / AccordionsPage.js View on Github external
import BpkCheckbox from 'bpk-component-checkbox';
import accordionsReadme from 'bpk-component-accordion/README.md';
import {
  BpkAccordion,
  BpkAccordionItem,
  withSingleItemAccordionState,
  withAccordionItemState,
} from 'bpk-component-accordion';
import { spacingSm } from 'bpk-tokens/tokens/base.es6';

import DocsPageBuilder from '../../components/DocsPageBuilder';
import DocsPageWrapper from '../../components/DocsPageWrapper';
import Paragraph from '../../components/Paragraph';
import IntroBlurb from '../../components/IntroBlurb';

const SingleItemAccordion = withSingleItemAccordionState(BpkAccordion);
const StatefulAccordionItem = withAccordionItemState(BpkAccordionItem);

const CheckboxWrapper = props => (
  <div style={{ padding: `${spacingSm} 0` }} {...props} />
);

const StopsContent = () => (
  <form>
    <CheckboxWrapper>
      <BpkCheckbox name="direct" label="Direct" onChange={() => null} checked />
    </CheckboxWrapper>
    <CheckboxWrapper>
      <BpkCheckbox name="1-stop" label="1 stop" onChange={() => null} checked />
    </CheckboxWrapper>
    <CheckboxWrapper>
      <BpkCheckbox

bpk-component-accordion

Backpack accordion component.

Apache-2.0
Latest version published 6 days ago

Package Health Score

85 / 100
Full package analysis

Similar packages