Is it possible to trigger a dash callback based on whether an Input field has been focused?

Question

As the title suggests I'd like to fire a dash callback upon focusing, i.e. clicking on a dcc.Input field.

AFAIK one can only trigger one upon the Input field losing focus via the n_blur property. I already checked for the existence of a n_clicked property as the one that exists for buttons, which, however, didn't lead anywhere.

Answer 1

It's kind of a hacky workaround, but a html.Div does have an n_clicks property. So what you could do is surround your input with a div and make that div have roughly the same dimensions that your input has so that a click on the input would trigger the surrounding div's n_click, but a click outside the input wouldn't.

MWE

from dash import dash, html, dcc
from dash.dependencies import Input, Output

app = dash.Dash(__name__)
app.layout = html.Div(
    id="input-container",
    children=[
        dcc.Input(id="input", type="number"),
        dcc.Store(id='throwaway-result-store')
    ],
    style={"width": "fit-content"}
)


@app.callback(
    Output("throwaway-result-store", "data"),
    Input("input-container", "n_clicks"),
)
def handle_focus(n_clicks):
    print(f"number of times input clicked {n_clicks}")
    return n_clicks


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

You could handle blur with the n_blur property on the input as you've mentioned.