https://github.com/svar-widgets/uploader

A Svelte UI component for easy and intuitive file uploading
https://github.com/svar-widgets/uploader

file-upload file-uploader svelte svelte-component sveltejs upload uploader

Last synced: 3 months ago
JSON representation

A Svelte UI component for easy and intuitive file uploading

• Host: GitHub
• URL: https://github.com/svar-widgets/uploader
• Owner: svar-widgets
• License: mit
• Created: 2024-10-04T17:18:59.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2024-10-15T18:27:34.000Z (3 months ago)
• Last Synced: 2024-10-17T03:21:23.037Z (3 months ago)
• Topics: file-upload, file-uploader, svelte, svelte-component, sveltejs, upload, uploader
• Language: Svelte
• Homepage:
• Size: 103 KB
• Stars: 13
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: readme.md
  • License: license.txt

Awesome Lists containing this project

README

        


	

# SVAR Svelte File Uploader


[![npm](https://img.shields.io/npm/v/wx-svelte-uploader.svg)](https://www.npmjs.com/package/wx-svelte-uploader)

[![License](https://img.shields.io/github/license/svar-widgets/uploader)](https://github.com/svar-widgets/uploader/blob/main/license.txt)

[![npm downloads](https://img.shields.io/npm/dm/wx-svelte-uploader.svg)](https://www.npmjs.com/package/wx-svelte-uploader)

[Demos](https://docs.svar.dev/svelte/core/samples-uploader)



A Svelte UI component for easy and intuitive file uploading, allowing users to drag and drop files or select them from their device.

### How to Use

To use the widget, simply import the package and include the component in your Svelte file:

```svelte

	import { Uploader, UploaderList } from "wx-svelte-uploader";

	let data = [];

	const uploadURL = "http://localhost:3000/data";

	function handleUpload(ev) {

		console.log(ev.detail);

	}

```

### How to Modify

Typically, you don't need to modify the code. However, if you wish to do so, follow these steps:

1. Run `yarn` to install dependencies. Note that this project is a monorepo using `yarn` workspaces, so npm will not work

2. Start the project in development mode with `yarn start`

### Run Tests

To run the test:

1. Start the test examples with:

    ```sh

    yarn start:tests

    ```

2. In a separate console, run the end-to-end tests with:

    ```sh

    yarn test:cypress

    ```