import {
  Meta,
  Story,
  Preview,
  Title,
  Subtitle,
  Description,
  Props,
} from '@storybook/addon-docs/blocks';
import { withKnobs } from '@storybook/addon-knobs';

import { JourneyCard } from '../';
import { JourneyCardStory } from './journey.stories.js';

<Meta title='Originals/Cards' component={JourneyCard} decorators={[withKnobs]}/>

<Title>Journey Card</Title>

<Description>
  Journey Card dos aplicativos Eureca.
</Description>

<Description>
É uma extensão do componente Card.
</Description>

<Preview>
  <Story name="Journey Card">
    <JourneyCardStory />
  </Story>
</Preview>

<Subtitle>Props</Subtitle>

|   Nome  |            Descrição            |   Default   |
|:-------:|:-------------------------------:|:-----------:|
| date | Data a ser exibida no card <br /> 'object' | Date() |
| text | Texto a ser exibido no card <br /> 'string' | '' |
| title | Título a ser exibido no card <br /> 'string' | '' |
| titleColor | Cor opcional do título do card <br /> 'string' | white |
| headerColor | Cor do header do card <br /> 'string' | gray3 |

<Subtitle>Exemplo de Aplicação</Subtitle>

```jsx
<JourneyCard 
  date={new Date()}
  content='Abertura das inscrições'
  title='Online'
  headerColor='#8123B3'
>
```