Plugins are components that implement particular Grid features. They should be defined within the Grid component.
Plugins can be divided into four groups:
Note that the plugins are composable and can be nested into each other.
Refer to the Reference to see the complete plugin list.
The Grid's UI plugins use special components to render the UI. You can implement your component suite or use a predefined one:
The Grid plugins adhere to the data piping principle. That is, plugins process Grid data in the same order they are defined in the Grid.
Plugins implementing an interface should be linked before plugins that use it. For example, a data processing plugin is based on some state and should follow the appropriate state plugin. Some visualization plugins extend the
Table's functionality and should follow it in the code.
NOTE: Refer to the plugin's reference for information on its dependencies.
The data processing plugins' order is also important because they process data in the same order they appear. For example, if
IntegratedSelection, the 'Select All' checkbox selects only the current page's rows and swapping them around allows you to select rows on all pages. See this rule in action in the following demo:
Plugin component to wrap multiple plugins into a single component:
const DataTypeProviders = () => ( <Plugin> <CurrencyTypeProvider /> <DateTypeProvider /> <BooleanTypeProvider /> </Plugin> ); ... <Grid> <DataTypeProviders /> </Grid>