https://github.com/easywebapp/filecell

File Uploader element based on Web Components & WebCell v2
https://github.com/easywebapp/filecell

component element file upload web web-cell

Last synced: 10 months ago
JSON representation

File Uploader element based on Web Components & WebCell v2

• Host: GitHub
• URL: https://github.com/easywebapp/filecell
• Owner: EasyWebApp
• Created: 2022-02-04T11:05:31.000Z (about 4 years ago)
• Default Branch: master
• Last Pushed: 2022-02-22T17:11:06.000Z (about 4 years ago)
• Last Synced: 2025-04-21T23:48:47.291Z (10 months ago)
• Topics: component, element, file, upload, web, web-cell
• Language: TypeScript
• Homepage: https://web-cell.dev/FileCell/
• Size: 151 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: ReadMe.md
  • Funding: .github/FUNDING.yml

Awesome Lists containing this project

README

          
# FileCell

**File Uploader** element based on [Web Components][1] & [WebCell v2][2]

[![NPM Dependency](https://david-dm.org/EasyWebApp/FileCell.svg)][3]

[![CI & CD](https://github.com/EasyWebApp/FileCell/workflows/CI%20&%20CD/badge.svg)][4]

[![NPM](https://nodei.co/npm/file-cell.png?downloads=true&downloadRank=true&stars=true)][5]

## Example

### JSX usage

```tsx

import { documentReady, render, createCell } from 'web-cell';

import { FileCellProps, FileCell } from 'file-cell';

import { MarkdownEditor } from 'markdown-area-element';

const upload: FileCellProps['transport'] = async file => {

    const response = await fetch('/file', {

        method: 'POST',

        body: file

    });

    const { path } = await response.json();

    return { path };

};

documentReady.then(() =>

    render(

        

            default text

        

    )

);

```

### Listen Upload event

https://github.com/EasyWebApp/markdown-area-element/blob/d9930bb/source/Editor.tsx#L65-L68

### Update File URL

https://github.com/EasyWebApp/markdown-area-element/blob/d9930bb/source/Editor.tsx#L80-L85

[1]: https://www.webcomponents.org/

[2]: https://web-cell.dev/

[3]: https://david-dm.org/EasyWebApp/FileCell

[4]: https://github.com/EasyWebApp/FileCell/actions

[5]: https://nodei.co/npm/file-cell/