@chihebnabil/custom-upload-element

Customized built-in elements is="custom-uploader"

Usage

With npm

Install the package using npm or yarn

npm i @chihebnabil/custom-upload-element
# or
yarn add @chihebnabil/custom-upload-element

Then import it in your script

import '@chihebnabil/custom-upload-element';

With unpkg.com

<script
  type="module"
  src="//unpkg.com/@chihebnabil/custom-upload-element"
></script>

Then use the custom element in your html using is="custom-uploader.

   <custom-uploader
            accept="image/*"
            name="listing_cover_images[]"
            label="Please Drop your file here"
            multiple="true"
    >
    </custom-uploader>

HTML Structure

This component doesn't use shadow dom so you can customize the style using CSS and overwrite the style already included inside this custom element.