Structure #

Modules are single Web Component that must always extend the window.casthub.module Component, or a subset of it.

With this comes some useful methods to help in working with the Shadow DOM and other aspects of Module Development.

HTML #

Modules can supply a Template HTML File that will be injected and available to the Module at run-time. You can read the Documentation here.

Otherwise, you are free to add and remove Elements from the top-level container as you see fit, for example:

module.exports = extends window.casthub.module {

    /**
     * Initialise the new Module.
     */
    constructor() {
        super();

        // Create a new Element.
        this.$newElement = document.createElement('div');
        this.$newElement.classList.add('hello-world');

        // And add it to the Module Container.
        this.addEl(this.$newElement);
    }

};

CSS #

There are many ways of customising your Module's CSS - they are all covered in our CSS Documentation.