Clear DatePickerSingle from callback?

[EBoisseauSierra]

➥ Is it possible to clear the date from a dcc.DatePickerSingle via a callback?

---

Background
Say I have a date picker, and a button. I want to clear the selected date when I click on the button. (Ok, this looks a lot like a clearable=True DatePickerSingle, but my real case is of course a bit more complex).

Problem
I have tried to return either '' (an empty string) or None in the callback, but neither seems to work: each time, the select date disappear, but I get an "Invalid date" placeholder and the calendar dialog doesn't appear anymore.

MWE

# import external modules
import dash
import dash_core_components as dcc
import dash_html_components as html
import pytz

# import external functions
from datetime import datetime, timedelta
from dateutil.parser import parse
from dash.dependencies import Input, Output, State

def serve_layout():

    return html.Main(
        [
            dcc.DatePickerSingle(
                id='datepicker',
            # layout settings
                first_day_of_week=1,
                display_format='DD/MM/YY',
                placeholder='Start date',
            # date defaults
                date=datetime.now(),
            # date limits
                min_date_allowed=datetime(2018, 1, 1),
                # today
                max_date_allowed=datetime.now(),
                initial_visible_month=datetime(
                    datetime.now().year,
                    datetime.now().month,
                    1
                ),
            ),
            html.Button(
                'Clear date',
                id='button'
            )
        ],
    )

app = dash.Dash(
    __name__,
)

# re-compute the layout everytime the page is refreshed — cf. https://dash.plot.ly/live-updates
app.layout = serve_layout

@app.callback(
    Output('datepicker', 'date'),
    [
        Input('button', 'n_clicks'),
    ],
    [
        State('datepicker', 'date'),
    ]
)
def clear_date(n_clicks, current_selected_date):
    ''' clears the date when button is clicked'''

    if (n_clicks is not None) and (n_clicks > 0):
        # =============================== neither of both following lines work 
        # return ''
        return None
    else:
        return current_selected_date


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

[Marc-Andre-Rivet]

@EBoisseauSierra Thanks for reporting this. You are doing the right thing by setting the value to None but the dcc.DatePickerSingle and the dcc.DatePickerRange are not handling the None (or null) case correctly -- causing the Invalid Date.