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

import { Display } from '../';
import { BasicDisplayStory } from './basic.stories.js';

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

<Title>Basic Display</Title>

<Description>
  Display de midia básico que carregar o leitor correto da midia: pdf, audio, video ou url.
</Description>

<Description>
Utiliza o media player e o leitor de pdf.
</Description>

<Preview>
  <Story name="Basic Display">
    <BasicDisplayStory />
  </Story>
</Preview>

<Subtitle>Props</Subtitle>

> O type de um challenge pode ser: 'pdf' \| 'link' \| 'video' \| 'audio'

|   Nome  |            Descrição            |   Default   |
|:-------:|:-------------------------------:|:-----------:|
| challenge | Tipo do desafio <br /> { type, source } | { } |

<Subtitle>Exemplo de arquivo de entrada</Subtitle>

```jsx
{
  type: 'pdf',
  source: 'url-do-pdf'
}
```

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

```jsx
<Display challenge={{ type: src, source: decoder[src] }} />
```