import * as React from 'react';
import { storiesOf } from '@storybook/react';
import styled from 'styled-components';

import { Tabs } from '../src';


storiesOf('Tabs', module)
  .add('Default', () => (
    <Tabs headers={['HTML', 'CSS', 'React', 'Angular']}>
      <Tabs.Panel fromHeader='HTML'>
        <h1>HTML</h1>
      </Tabs.Panel>
      <Tabs.Panel fromHeader='CSS'>
        <h1>CSS</h1>
      </Tabs.Panel>
      <Tabs.Panel fromHeader='React'>
        <h1>REACT</h1>
      </Tabs.Panel>
      <Tabs.Panel fromHeader='Angular'>
        <h1>Angular</h1>
      </Tabs.Panel>
    </Tabs>
  ));