import React from 'react';
import {storiesOf} from '@storybook/react';
import {text} from '@storybook/addon-knobs';

import Collapser from '../../Components/Collapser/src';
import {Star, COLOR, SIZE} from '../../Components/Icon/src';

export default storiesOf('Components | Collapser', module)
  .add('default', () => (
    <Collapser
      id="id-collapser-default"
      title={text('Title', 'Default collapser title')}
    >
      <div>
        Collapser content
      </div>
    </Collapser>
  ))
  .add('new feature', () => (
    <Collapser
      id="id-collapser-new-feature"
      title={text('Title', 'Collapser title')}
      isNewFeature
    >
      <div>
        <div>
          <Star color={COLOR.ERROR} size={SIZE.MEDIUM} />
        </div>
        Collapser content
      </div>
    </Collapser>
  ));