Skip to content

Nonstandard Atom Window Text Input Element Unfocusable #766

@andre996

Description

@andre996

Describe the bug
When creating a modal that contains a dash-bio window, the input box inside of the Nonstandard Atom doesn't focus.

To Reproduce
Steps to reproduce the behavior:
Click the X on the left toolbar and try to insert the text

import dash_bootstrap_components as dbc
import dash_bio as dashbio
import dash_design_kit as ddk

app = Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = html.Div(
    [
        dbc.Button("Open modal", id="open", n_clicks=0),
        dbc.Modal(
            [
                dbc.ModalHeader(dbc.ModalTitle("Header")),
                dbc.ModalBody(dashbio.Jsme()),
                dbc.ModalFooter(
                    dbc.Button(
                        "Close", id="close", className="ms-auto", n_clicks=0
                    )
                ),
            ],
            id="modal",
            is_open=False,
        ),
    ]
)


@app.callback(
    Output("modal", "is_open"),
    [Input("open", "n_clicks"), Input("close", "n_clicks")],
    [State("modal", "is_open")],
)
def toggle_modal(n1, n2, is_open):
    if n1 or n2:
        return not is_open
    return is_open
if __name__ == '__main__':
    app.run()

Screenshots
Issue

Python version: [e.g., 3.7.2]
3.9.0

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions