react-custom-mount

react-custom-mount

Mount react components using custom elements

Install

npm install --save react-custom-mount

Usage

import {
    registerCustomElement,
    registerCustomElements,
    Components
} from 'react-custom-mount'

const ComponentOne = ({ myAttribute, children }) => {
    return (
        <>
            <p>Hello {myAttribute}</p>
            {children}
        </>
    )
}

const components: Components = {
    'component-one': ComponentOne
}

document.addEventListener('DOMContentLoaded', function () {
    // Register multiple components
    registerCustomElements(componenets)

    // Or one
    registerCustomElement('component-one', ComponentOne)
})

<component-one my-attribute="hello">
    <div>
        <p>From the other side</p>
    </div>
</component-one>

License

MIT Borhaneddine GUEMIDI, Sofiane DEBBAGH