import React from 'react';
import { storiesOf } from '@storybook/react'; // eslint-disable-line import/no-extraneous-dependencies
import withReadme from 'storybook-readme/with-readme'; // eslint-disable-line import/no-extraneous-dependencies
import Readme from './readme.md';

import Accordion from './Accordion';

storiesOf('Accordion', module)
  .addDecorator(withReadme(Readme))
  .add('with defaults', () => (
    <Accordion label="Hello">
      Content
    </Accordion>
  ));

@@ -472,10 +472,985 @@
 on%3E%0A  ))
+%0A  .add('open', () =%3E (%0A    %3CAccordion open%3E%0A      Content%0A    %3C/Accordion%3E%0A  ))%0A  .add('id and contentId', () =%3E (%0A    %3CAccordion contentId='pTag'%3E%0A      %3Cp id='pTag'%3E%0A        Content%0A      %3C/p%3E%0A    %3C/Accordion%3E%0A  ))%0A  .add('displayWhenOpen', () =%3E (%0A    %3CAccordion displayWhenOpen=%7B%3Cp%3EAdd item%3C/p%3E%7D%3E%0A      Content%0A    %3C/Accordion%3E%0A  ))%0A  .add('displayWhenClosed', () =%3E (%0A    %3CAccordion open=%7Bfalse%7D displayWhenClosed=%7B%3Cp%3ESome items%3C/p%3E%7D%3E%0A      Content%0A    %3C/Accordion%3E%0A  ))%0A  .add('separator', () =%3E (%0A    %3CAccordion separator=%7Bfalse%7D%3E%0A      Separator set to false.%0A    %3C/Accordion%3E%0A  ))%0A  .add('toggleKeyHandlers', () =%3E %7B%0A    const handlers = %7B%0A      'delete': function() %7Balert('delete');%7D%0A    %7D;%0A    return (%0A      %3CAccordion toggleKeyHandlers=%7Bhandlers%7D%3E%0A        content%0A      %3C/Accordion%3E%0A    )%0A  %7D)%0A  .add('header', () =%3E %7B%0A    const header = (props) =%3E (%3Cp%3Econtent%3C/p%3E);%0A    return (%0A      %3CAccordion header=%7Bheader%7D%3E%0A        Content%0A      %3C/Accordion%3E%0A    );%0A  %7D)
 ;%0A

Create stories for the Accordion component