import React from 'react';
import { storiesOf } from '@storybook/react';
import { boolean, select, text, radios } from '@storybook/addon-knobs';
import { asyncStates, tooltipPositions } from '../../../storybook/utils';
import { RelativeInlineWrap } from '../../../storybook/components';
import { ErrorFloatGroup } from '../index';

const props = ({
  tooltipPosition = undefined,
  asyncStatus = undefined,
  asyncStatusList = undefined,
} = {}) => ({
  tooltipPosition: radios('tooltip position', tooltipPositions, tooltipPosition),
  asyncStatus: select('async status', asyncStates({ isList: false }), asyncStatus),
  asyncStatusList: select('async status list', asyncStates({ isList: true }), asyncStatusList),
});

storiesOf('Web|Error', module)
  .add('float group', () => (
    <RelativeInlineWrap>
      <ErrorFloatGroup {...props()}>boom</ErrorFloatGroup>
    </RelativeInlineWrap>
  ))
