sd-material-ui
StratoDem Analytics Dash implementation of material-ui components.
Dash wrappers around the excellent material-ui package
Installation and usage
$ pip install sd-material-uiimport dash
import dash_html_components as html
import sd_material_ui
my_app = dash.Dash()
# A Button on Paper
my_app.layout = sd_material_ui.Paper([
html.Div(children=[
html.P(id='output', children=['n_clicks value: . n_clicks_previous value: '])
]),
sd_material_ui.Button(id='input', children='Click me'),
])
# Callback for Button
@my_app.callback(
dash.dependencies.Output('output', 'children'),
[dash.dependencies.Input('input', 'n_clicks')],
[dash.dependencies.State('input', 'n_clicks_previous')])
def display_clicks_flat(n_clicks_flat: int, n_clicks_flat_prev: int):
if n_clicks_flat:
return [f'n_clicks value: {n_clicks_flat}. n_clicks_prev value: {n_clicks_flat_prev}']
else:
return ['n_clicks value: ']
if __name__ == '__main__':
my_app.run_server()Material-UI components ported to Dash
-
AutoComplete -
BottomNavigation -
Checkbox -
CircularProgress -
Dialog -
Divider -
Drawer -
DropDownMenu -
FlatButton -
FontIcon -
IconButton -
Paper -
RaisedButton -
Snackbar -
Subheader -
Toggle
Examples - Outdated, need to update with v4.0.0 examples
Dash
Go to this link to learn about Dash.
Dash help
See the dash-components-archetype repo for more information.
Contributing
To set up the development environment:
$ npm install
# Run webpack to create the Dash React bundle
$ npm run build-dist
# Set up a virtualenv
$ virtualenv venv -p python3
$ source venv/bin/activate
# Install the local Python Dash package
$ npm run install-localRunning a local server
Run usage.py in the virtual environment
$ source venv/bin/activate
$ python usage.py