mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 10:25:06 +03:00
* Copy the design-system app into a new one for ui-library. * Remove unneeded content. * Add supabase config. * Cleanup the css. * Add bunch of packages. * Cleanup the registry. * Regenerate the registry. * Add needed components for documenting components. * Add the pages for the components. * Fix the RegistryBlock. * Various fixes. * Add a turbo definition for ui-library. * Rename Remix to React Router. * Reorder the pages for all frameworks. * Remove the bottom pager. * Fix the pages and command menu. * Various fixes. * Minor fixes. * Add ai editor rules. * Various fixes. * Add local supabase env vars. * Try to fix a package error. * Bunch of various fixes. * Fix lint errors.
45 lines
1.5 KiB
Plaintext
45 lines
1.5 KiB
Plaintext
---
|
|
title: Dropzone (File Upload)
|
|
description: Displays a control for easier uploading of files directly to Supabase Storage
|
|
---
|
|
|
|
<ComponentPreview
|
|
name="dropzone-demo"
|
|
description="An alert with an icon, title and description. The title says 'Heads up!' and the description is 'You can add components to your app using the cli.'."
|
|
/>
|
|
|
|
## Installation
|
|
|
|
<BlockItem
|
|
name="dropzone-react"
|
|
description="Displays a control for easier uploading of files directly to Supabase Storage"
|
|
/>
|
|
|
|
## Folder structure
|
|
|
|
<RegistryBlock itemName="dropzone-react" />
|
|
|
|
## Introduction
|
|
|
|
The File Upload component is designed to allow users to upload files with specific features and restrictions. It supports drag-and-drop functionality, MIME type restrictions, image previews, and configurable limits on file size and number of files.
|
|
|
|
## Features
|
|
|
|
1. **Drag-and-Drop**. Support drag-and-drop functionality for adding files.
|
|
|
|
1. **MIME Type Restriction**. Only allow specific MIME types.
|
|
|
|
1. **Invalid File Handling**. Allow users to remove invalid files from the list. Display a tooltip with error information for invalid files.
|
|
|
|
1. **Image Previews**. Display previews for image files.
|
|
|
|
1. **Error Handling**. Show error messages if the upload fails due to network or server errors.
|
|
|
|
1. **Success Handling**. Display a success message and clear the file list upon successful upload.
|
|
|
|
1. **Configurable Limits**. Allow configuration of file size limits and the maximum number of files.
|
|
|
|
## Usage
|
|
|
|
## Examples
|