@eureca/eureca-ui/src/components/Cards/stories/submit-solution.stories.mdx

UI component library of Eureca's user and admin apps

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

import { Box } from '@material-ui/core';
import { Flex } from '../../Flex';

import { SubmitSolutionCard } from '../';
import { SubmitSolutionStory } from './submit-solution.stories.js';

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

<Title>SubmitSolutionCard</Title>

<Description>
  Submit Solution Card dos aplicativos Eureca.
</Description>

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

<Preview>
  <Story name="Submit Solution Card">
    <SubmitSolutionStory />
  </Story>
</Preview>

<Subtitle>Props</Subtitle>

|   Nome  |            Descrição            |   Default   |
|:-------:|:-------------------------------:|:-----------:|
| type | Tipos do card <br /> 'pdf' \| 'audio' \| 'video' | 'pdf' |
| title | Título do card <br /> 'string' | '' |
| icon | Ícone do card <br /> 'object' | null |
| onChange | Função disparada ao se executar uma ação no card <br /> 'func' | () => { } |

<Subtitle>Variações</Subtitle>

> PDF, áudio e vídeo.

<Preview>
  <Flex>
    <SubmitSolutionCard
      type='pdf'
      onChange={() => {}}
    />
    <Box mt={16}>
      <SubmitSolutionCard
        type='audio'
        onChange={() => {}}
      />
    </Box>
    <Box mt={16}>
      <SubmitSolutionCard
        type='video'
        onChange={() => {}}
      />
    </Box>
  </Flex>
</Preview>


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

```jsx
<SubmitSolutionCard
  type='pdf'
  title='Arquivo / PDF'
  icon=<FiPaperclip />
  onChange={handleChange}
/>
```