Material UI Plugin
Adds Material UI theme Provider to BlueRain. Components of material-ui have been developed using a common interface. https://blueeast.gitbook.io/bluerain-plugin-material-ui
|
|
|
---|---|---|
Screenshots
NA
Usage
Run the following command in the plugin directoy:
yarn add @blueeast/bluerain-plugin-material-ui
Components
- AppBar Web
- AvatarWeb
- BadgeWeb
- ButtonWeb
- CardWeb
- CardHeaderWeb
- CardBodyWeb
- CardMediaWeb
- CardFooterWeb
- ChipWeb
- DividerWeb
- DropdownWeb
- DropdownItemWeb
- FormControlWeb
- FormGroupWeb
- ListWeb
- ListHeaderWeb
- ListItem Web
- ListItemAvatarWeb
- ListItemIconWeb
- ListItemRightButtonWeb
- ListItemTextWeb
- SwitchWeb
- TextInputWeb
- NotificationWeb
- StepperWeb
Hooks
This plugin provides complete flexibility to modify the material ui theme. This is done by providing various filter hooks.
material-ui.theme
This hook gives the ability to modify the plugin configurations.
Parameters:
Name | Type | Description |
---|---|---|
theme | Object | Custom Theme |
Returns:
Name | Type | Description |
---|---|---|
theme | Object | Custom Theme |
Example:
This example customizes the theme to make the AppBar color red.
import BR from '@blueeast/bluerain-os';
BR.Filters.add(
'material-ui.theme',
function CustomTheme(theme) {
return Object.assign({}, theme, {
appBar: {
color: 'red'
}
})
}
);
Demo
API
MaterialUiPlugin
Extends Plugin
Material UI Plugin
Properties
Internationalization
Components provide support for following languages:
- Urdu (ur)
- English (en)
- Arabic (ar)
- Chinese (zh)