Py.Cafe

amward/

dmc-PR-471

Month Picker Debounce

DocsPricing
  • app.py
  • requirements.txt
app.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
from datetime import date
from typing import Tuple

from dash import Dash, Input, Output, _dash_renderer, callback, html

import dash_mantine_components as dmc

_dash_renderer._set_react_version("18.2.0")

app = Dash(__name__, external_stylesheets=dmc.styles.ALL)

app.layout = dmc.MantineProvider(
    [
        html.H1(children="My beautiful app", style={"textAlign": "center"}),
        dmc.Container([
            dmc.Stack(
                [
                    dmc.MonthPickerInput(
                        id="month-range", type="range", debounce=True, clearable=True
                    ),
                    dmc.Text(id="show-range"),
                ],
            ),
            # demo of issue #463.  This should be full width
            dmc.Group(dmc.MonthPickerInput(style={"flexGrow":1}))
        ]),
    ]
)


@callback(
    Output("show-range", "children"),
    Input("month-range", "value"),
    prevent_initial_call=True,
)
def month_range_changed(month_range: Tuple[date, date]):
    if month_range is not None:
        return f"Between {month_range[0]} and {month_range[1]}"


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