<p align="center">
<img src="https://raw.githubusercontent.com/snehilvj/dash-mantine-components/master/assets/logo.png" alt="logo" width=300 >
</p>
<p align="center">
<img src="https://badgen.net/pypi/license/dash-mantine-components">
<a href="https://pypi.org/project/dash-mantine-components/">
<img src="https://badgen.net/pypi/v/dash-mantine-components">
</a>
<a href="https://discord.gg/KuJkh4Pyq5">
<img src="https://img.shields.io/badge/Chat%20on-Discord-%235865f2">
</a>
<img src="https://static.pepy.tech/personalized-badge/dash-mantine-components?period=total&units=international_system&left_color=grey&right_color=brightgreen&left_text=Downloads">
</p>
Dash Mantine Components is an extensive (90+) Dash components library based on [Mantine](https://mantine.dev/) React Components Library. It makes it easier to create good quality dashboards with very well designed components out of the box.
[Documentation](https://dash-mantine-components.com)
<p align="center">
<img src="https://raw.githubusercontent.com/snehilvj/dash-mantine-components/master/assets/datepicker.gif">
</p>
### Table of contents
- [Installation](#installation)
- [Quickstart](#quickstart)
- [Sponsors](#sponsors)
- [Contributing](#contributing)
## Installation
```bash
pip install dash-mantine-components
```
## Quickstart
```python
from datetime import date
import dash
from dash import Dash, Input, Output, callback, html
from dash.exceptions import PreventUpdate
import dash_mantine_components as dmc
stylesheets = ["https://unpkg.com/@mantine/dates@7/styles.css"]
dash._dash_renderer._set_react_version('18.2.0')
app = Dash(__name__, external_stylesheets=stylesheets)
app.layout = dmc.MantineProvider(
[
dmc.DatePicker(
id="date-picker",
label="Start Date",
description="You can also provide a description",
minDate=date(2020, 8, 5),
value=None,
w=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)
```
## Sponsors
Thanks to the following people for supporting my efforts on dash-mantine-components.
1. [Ann Marie Ward](https://github.com/AnnMarieW)
2. [Arne Petter](https://github.com/apdcode)
## Contributing
1. Join our [Discord](https://discord.gg/KuJkh4Pyq5) community.
2. Install virtual environment:
```bash
python -m venv venv
source venv/bin/activate
pip install -r requirements.txt
```
3. Install npm dependencies
```bash
npm install
```
4. Add your new component in `src/lib/components`. Make sure to include it in the `src/lib/index.js` as well.
5. Build the components with the command: `npm run build`.
6. Raise a PR, including an example to reproduce the changes contributed by the PR.
Raw data
{
"_id": null,
"home_page": "https://github.com/cruldra/dongjak-dash-components",
"name": "dongjak-dash-components",
"maintainer": null,
"docs_url": null,
"requires_python": null,
"maintainer_email": null,
"keywords": null,
"author": "Snehil Vijay <snehilvj@outlook.com>",
"author_email": "snehilvj@outlook.com",
"download_url": "https://files.pythonhosted.org/packages/f6/76/d5a8189e659130c1e8c0e1f06f73ef033575f32e0638c01d25b7ad8fe6c1/dongjak_dash_components-0.14.11.tar.gz",
"platform": null,
"description": "<p align=\"center\">\r\n <img src=\"https://raw.githubusercontent.com/snehilvj/dash-mantine-components/master/assets/logo.png\" alt=\"logo\" width=300 >\r\n</p>\r\n<p align=\"center\">\r\n <img src=\"https://badgen.net/pypi/license/dash-mantine-components\">\r\n <a href=\"https://pypi.org/project/dash-mantine-components/\">\r\n <img src=\"https://badgen.net/pypi/v/dash-mantine-components\">\r\n </a>\r\n <a href=\"https://discord.gg/KuJkh4Pyq5\">\r\n <img src=\"https://img.shields.io/badge/Chat%20on-Discord-%235865f2\">\r\n </a>\r\n <img src=\"https://static.pepy.tech/personalized-badge/dash-mantine-components?period=total&units=international_system&left_color=grey&right_color=brightgreen&left_text=Downloads\">\r\n</p>\r\n\r\nDash Mantine Components is an extensive (90+) Dash components library based on [Mantine](https://mantine.dev/) React Components Library. It makes it easier to create good quality dashboards with very well designed components out of the box.\r\n\r\n[Documentation](https://dash-mantine-components.com)\r\n\r\n<p align=\"center\">\r\n <img src=\"https://raw.githubusercontent.com/snehilvj/dash-mantine-components/master/assets/datepicker.gif\">\r\n</p>\r\n\r\n### Table of contents\r\n\r\n- [Installation](#installation)\r\n- [Quickstart](#quickstart)\r\n- [Sponsors](#sponsors)\r\n- [Contributing](#contributing)\r\n\r\n## Installation\r\n\r\n```bash\r\npip install dash-mantine-components\r\n```\r\n\r\n## Quickstart\r\n\r\n```python\r\nfrom datetime import date\r\n\r\nimport dash\r\nfrom dash import Dash, Input, Output, callback, html\r\nfrom dash.exceptions import PreventUpdate\r\n\r\nimport dash_mantine_components as dmc\r\n\r\nstylesheets = [\"https://unpkg.com/@mantine/dates@7/styles.css\"]\r\ndash._dash_renderer._set_react_version('18.2.0')\r\n\r\napp = Dash(__name__, external_stylesheets=stylesheets)\r\n\r\napp.layout = dmc.MantineProvider(\r\n [\r\n dmc.DatePicker(\r\n id=\"date-picker\",\r\n label=\"Start Date\",\r\n description=\"You can also provide a description\",\r\n minDate=date(2020, 8, 5),\r\n value=None,\r\n w=200\r\n ),\r\n dmc.Space(h=10),\r\n dmc.Text(id=\"selected-date\"),\r\n ]\r\n)\r\n\r\n\r\n@callback(Output(\"selected-date\", \"children\"), Input(\"date-picker\", \"value\"))\r\ndef update_output(d):\r\n prefix = \"You have selected: \"\r\n if d:\r\n return prefix + d\r\n else:\r\n raise PreventUpdate\r\n\r\n\r\nif __name__ == \"__main__\":\r\n app.run_server(debug=True)\r\n```\r\n\r\n## Sponsors\r\n\r\nThanks to the following people for supporting my efforts on dash-mantine-components.\r\n\r\n1. [Ann Marie Ward](https://github.com/AnnMarieW)\r\n2. [Arne Petter](https://github.com/apdcode)\r\n\r\n## Contributing\r\n\r\n1. Join our [Discord](https://discord.gg/KuJkh4Pyq5) community.\r\n\r\n2. Install virtual environment:\r\n\r\n ```bash\r\n python -m venv venv\r\n source venv/bin/activate\r\n pip install -r requirements.txt\r\n ```\r\n\r\n3. Install npm dependencies\r\n\r\n ```bash\r\n npm install\r\n ```\r\n\r\n4. Add your new component in `src/lib/components`. Make sure to include it in the `src/lib/index.js` as well.\r\n\r\n5. Build the components with the command: `npm run build`.\r\n\r\n6. Raise a PR, including an example to reproduce the changes contributed by the PR.\r\n",
"bugtrack_url": null,
"license": "MIT",
"summary": "Plotly Dash Components based on Mantine",
"version": "0.14.11",
"project_urls": {
"Homepage": "https://github.com/cruldra/dongjak-dash-components"
},
"split_keywords": [],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "f676d5a8189e659130c1e8c0e1f06f73ef033575f32e0638c01d25b7ad8fe6c1",
"md5": "3375beaba27fdb4d4130105af10213e0",
"sha256": "1185ce71ac88cc5a08e25da3d9f2893eba542c7d01ea69f3c85a246b4c2ebf33"
},
"downloads": -1,
"filename": "dongjak_dash_components-0.14.11.tar.gz",
"has_sig": false,
"md5_digest": "3375beaba27fdb4d4130105af10213e0",
"packagetype": "sdist",
"python_version": "source",
"requires_python": null,
"size": 1190733,
"upload_time": "2024-08-07T15:37:12",
"upload_time_iso_8601": "2024-08-07T15:37:12.824491Z",
"url": "https://files.pythonhosted.org/packages/f6/76/d5a8189e659130c1e8c0e1f06f73ef033575f32e0638c01d25b7ad8fe6c1/dongjak_dash_components-0.14.11.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2024-08-07 15:37:12",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "cruldra",
"github_project": "dongjak-dash-components",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"requirements": [],
"lcname": "dongjak-dash-components"
}
JSON
