## Feature Examples

### Structure
- description: File upload consists of two labels: \`mainLabel\` for action text and \`subLabel\` for a description.
- example:
```jsx
<FilePicker
  mainLabel="Main Action Label"
  subLabel="Supportive label or description"
/>;
```

### Supported formats
- description: Define file types that could be uploaded with the \`supportedFormats\` prop. Separate formats with a comma.
- example:
```jsx
<FilePicker supportedFormats=".png, .pdf" />;
```

### Max size
- description: Define the maximum file size for an upload with the \`maxSize\` prop.
- example:
```jsx
<FilePicker maxSize={8000000} subLabel="No file chosen (Max size 8MB)" />;
```

### Error message
- description: Describe an error status by using the \`errorMessage\` prop. Messages will only be revealed when the \`error\` status is \`true\`.
- example:
```jsx
<FilePicker
  supportedFormats=".png, .pdf"
  error
  errorMessage="Failed to upload. File is too large."
/>;
```

### Header
- description: Add text or any other component in an area above the component using the \`header\` prop.
- example:
```jsx
<FilePicker
  header={
    <StorybookComponents.Placeholder>Header</StorybookComponents.Placeholder>
  }
/>;
```