README

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

🌏 Web	🖥 Electron	📱 React Native
✔️	✔️	✖️

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

• pluginName string "MaterialUiPlugin"

• slug string "material-ui"

Internationalization

Components provide support for following languages:

• Urdu (ur)

• English (en)

• Arabic (ar)

• Chinese (zh)