React Core provides components for creating a plugin-based component.
A plugin-based component should adhere to the following principles:
A plugin shares its items (Getters, Actions, Templates) within an IoC (Inversion of Control) container and can use the ones other plugins share.
A plugin based component consists of the following child components:
The component provides the means for state storing and mutation.
The plugin based component's state is an aggregation of plugin states which keep data normalized and immutable. The state can only be changed through executing an action.
The component provides a mechanism for communication between plugins.
The plugin application order depends on plugins' defined order in the parent component. The higher it is, the earlier it is applied.
A PluginHost is an auxiliary component used as a single communication point for all plugins and adheres to the principles listed above. If a React component contains a PluginHost in the root, it is called a plugin host component.
The PluginHost component's content is called plugin root. It must contain only plugin primitives and plugin components.
Plugin primitives are React Core components that can be declared within a plugin based component or plugin. They are initialized when the plugin host is being mounted. The following plugin primitives are available:
When the plugin host has been mounted, a component tree is rendered within the PluginHost component's markup (rendering root). The rendering root contains visualization primitives and React components. Visualization primitives are React Core components that mount the rendered component tree and define relations between states and actions.
Visualization primitives:
A Plugin is an auxiliary component that stores plugin primitives or nested plugins. If a React component's root element is a plugin, this component is a plugin component.