Support multiple plugins for same root classname about bulmajs HOT 4 CLOSED

class FileDragDrop {
    /**
     * Plugin constructor
     * @param  {Object} options The options object for this plugin
     * @return {this} The newly created plugin instance
     */
    constructor(options) {
        if(!options.element) {
            throw new Error('[BulmaJS] The file component requires an element to function.');
        }

        /**
         * The root file element.
         * @type {HTMLElement}
         */
        this.root = options.element;

        /**
         * The element to file input.
         * @type {HTMLELement}
         */
        this.input = this.root.querySelector('input');

        this.registerEvents();
    }

    /**
     * Register all the events this module needs.
     * @return {undefined}
     */
    registerEvents() {
        // add hovered class name
        this.root.addEventListener('dragover', (e) => {
            e.preventDefault();
            this.root.classList.add('is-hovered');
        });

        // remove hovered class name
        this.root.addEventListener('dragleave', (e) => {
            e.preventDefault();
            this.root.classList.remove('is-hovered');
        });

        // remove hovered class name and set dragged file
        this.root.addEventListener('drop', (e) => {
            e.preventDefault();
            this.root.classList.remove('is-hovered');
            this.input.files = e.dataTransfer.files;
        });
    }

    /**
     * Handle parsing the DOMs data attribute API.
     * @param {HTMLElement} element The root element for this plugin
     * @return {undefined}
     */
    static handleDomParsing(element) {
        new FileDragDrop({
            element: element
        });
    }

    static getRootClass() {
        return 'file';
    }
}

Bulma.registerPlugin('file-drag-drop', FileDragDrop);

export default FileDragDrop;