Storybook stories for the `FileUpload` UI component, showcasing drag-and-drop file upload variants including label, multi-file, image-only, interactive state management, and disabled states. ## Key Components | Story | Description | |-------|-------------| | `Default` | Basic dropzone with no additional configuration | | `WithLabel` | Dropzone with a field label (`Attachments`) | | `Multiple` | Multi-file upload with custom label and description | | `ImagesOnly` | Restricted to `image/*` MIME types | | `Interactive` | Stateful render with live file count display | | `Disabled` | Non-interactive disabled dropzone | ## Usage Example ```typescript // Basic usage console.log(files)} /> // Multi-file with label handleFiles(files)} /> // Images only handleImages(files)} /> // Controlled (stateful) const [files, setFiles] = useState([]); setFiles(f as File[] || [])} multiple fieldLabel="Upload Files" /> ``` ## Notes - All stories are wrapped in a `500px` container via a shared decorator for consistent layout. - The `Interactive` story demonstrates controlled usage with `useState`, reflecting selected file count below the dropzone. - `accept` prop follows standard MIME type syntax (e.g. `"image/*"`). - `autodocs` tag enables automatic Storybook documentation generation.