The dash-mantine-components from bo-at-pleno

dash-mantine-components's Introduction

Dash Mantine Components is an extensive (70+) Dash components library based on Mantine React Components Library. It makes it easier to create good quality dashboards with very well designed components out of the box.

Documentation

Installation
Quickstart
Sponsors
Contributing

Installation

pip install dash-mantine-components

Quickstart

from datetime import date

from dash import Dash, Input, Output, callback, html
from dash.exceptions import PreventUpdate

import dash_mantine_components as dmc

app = Dash(__name__)

app.layout = html.Div(
    [
        dmc.DatePicker(
            id="date-picker",
            label="Start Date",
            description="You can also provide a description",
            minDate=date(2020, 8, 5),
            value=None,
            style={"width": 200},
        ),
        dmc.Space(h=10),
        dmc.Text(id="selected-date"),
    ]
)


@callback(Output("selected-date", "children"), Input("date-picker", "value"))
def update_output(d):
    prefix = "You have selected: "
    if d:
        return prefix + d
    else:
        raise PreventUpdate


if __name__ == "__main__":
    app.run_server(debug=True)

Contributing

Join our Discord community.

Install virtual environment:

python -m venv venv
source venv/bin/activate
pip install -r requirements.txt

Install npm dependencies
```
npm install
```
Add your new component in src/lib/components. Make sure to include it in the src/lib/index.js as well.
Build the components with the command: npm run build.
Raise a PR, including an example to reproduce the changes contributed by the PR.

Recommend Projects