@modera/react-js-plugin v0.1.0

@modera/react-js-plugin

A plugin system for ReactJS

Plugin structure

(function (window) {
    window.AppPluginRegistry = window.AppPluginRegistry || {};
    window.AppPluginRegistry['PLUGIN-NAME'] = {
        initialize: function (plugin, pluginManager) {
            plugin.state = plugin.has(pluginManager.owner) ? 'active' : 'hibernated';
        },
        contributions: {
            'react-app': {
                menu: {
                    renderMenuItem(key) {
                        return (
                            <li key={key}>Settings</li>
                        );
                    },
                },
            },
        },
    };

})(window || {});

Usage

import createPluginManager from '@modera/react-js-plugin';

const pluginManager = createPluginManager('react-app', window?.AppPluginRegistry);

export default function Menu() {
    const menuItems = pluginManager.collect('react-app.menu.renderMenuItem')
        .map((fn, index) => fn(index))
    ;

    return (
        <ul>
            <li>Profile<li>
            {menuItems}
        </ul>
    );
}