## Examples

### Basic


import Example1 from './Example1.html?raw'

<LiveExample html={Example1} />

### Drag over


import Example2 from './Example2.html?raw'

<LiveExample html={Example2} />

### Horizontal


import Example3 from './Example3.html?raw'

<LiveExample html={Example3} />

### Horizontal drag over


import Example4 from './Example4.html?raw'

<LiveExample html={Example4} />

### File upload status


import Example5 from './Example5.html?raw'

<LiveExample html={Example5} />

### File upload status expanded


import Example6 from './Example6.html?raw'

<LiveExample html={Example6} />

### Horizontal file upload status expanded


import Example7 from './Example7.html?raw'

<LiveExample html={Example7} />

## Documentation

### Usage

| Class | Applied | Outcome |
| -- | -- | -- |
| `.pf-v6-c-multiple-file-upload` | `<div>` | Initiates the multiple file upload component. **Required** |
| `.pf-v6-c-multiple-file-upload__main` | `<div>` | Defines the main section. |
| `.pf-v6-c-multiple-file-upload__title` | `<div>` | Defines the title. |
| `.pf-v6-c-multiple-file-upload__title-icon` | `<div>` | Defines the title icon. |
| `.pf-v6-c-multiple-file-upload__title-text` | `<div>` | Defines the title text. |
| `.pf-v6-c-multiple-file-upload__title-text-separator` | `<div>` | Defines the title text separator. |
| `.pf-v6-c-multiple-file-upload__upload` | `<div>` | Defines the upload button. |
| `.pf-v6-c-multiple-file-upload__info` | `<div>` | Defines the info section. |
| `.pf-v6-c-multiple-file-upload__status` | `<div>` | Defines the status section. |
| `.pf-v6-c-multiple-file-upload__status-progress` | `<div>` | Defines the status toggle progress. |
| `.pf-v6-c-multiple-file-upload__status-progress-icon` | `<div>` | Defines the status toggle progress icon. |
| `.pf-v6-c-multiple-file-upload__status-progress-text` | `<div>` | Defines the status toggle progress text. |
| `.pf-v6-c-multiple-file-upload__status-list` | `<div>` | Defines the status item list. |
| `.pf-v6-c-multiple-file-upload__status-item` | `<div>` | Defines a status item. |
| `.pf-v6-c-multiple-file-upload__status-item-icon` | `<div>` | Defines the status item icon. |
| `.pf-v6-c-multiple-file-upload__status-item-main` | `<div>` | Defines the status item main progress section. |
| `.pf-v6-c-multiple-file-upload__status-item-close` | `<div>` | Defines the status item close button. |
| `.pf-v6-c-multiple-file-upload__status-item-progress` | `<div>` | Defines the status item progress description. |
| `.pf-v6-c-multiple-file-upload__status-item-progress-text` | `<div>` | Defines the status item progress description text. |
| `.pf-v6-c-multiple-file-upload__status-item-progress-size` | `<div>` | Defines the status item progress description size. |