// @flow
import React from 'react';
import { action } from '@storybook/addon-actions';
import { storiesOf } from '@storybook/react';
import { NextButton } from './index';
import { Box } from '../../../primitives';
import { withDocs } from '../../../../.storybook/with-docs';
import docs from './NEXT_BUTTON.mkd';

const logSubmit = e => {
  action('NEXT')();
  e.preventDefault();
};

storiesOf('Core/Actions/NextButton', module)
  .add(
    'normal',
    withDocs(docs)(() => (
      <Box colorName="background">
        <form onSubmit={logSubmit}>
          <NextButton>Press Enter</NextButton>
        </form>
      </Box>
    )),
  )
  .add(
    'disabled',
    withDocs(docs)(() => (
      <Box colorName="background">
        <form onSubmit={logSubmit}>
          <NextButton disabled>Press Enter</NextButton>
        </form>
      </Box>
    )),
  );
