Spaces:
Running
Modal defaults to shown when changing tab
Hi @aliabid94 , great job on this new component! 🤗
I'm having an issue when using it in a tabbed interface. In particular, if I declare the modal under the scope of a gr.Tab container and I set the modal to visible=False by default, the modal is shown as soon as the tab is re-focused. This can easily be solved by declaring the modal outside of the scope of any tab, but it's good to be aware that there is an issue there!
Minimal code producing the undesired behavior:
import gradio as gr
from gradio_modal import Modal
with gr.Blocks() as demo:
with gr.Tab("Tab 1"):
show_btn = gr.Button("Show Modal")
with Modal(visible=False) as modal:
gr.Markdown("Hello world!")
with gr.Tab("Tab 2"):
gr.Markdown("This is tab 2")
show_btn.click(lambda: Modal(visible=True), None, modal)
demo.launch()
Fixed moving the modal outside of tab scope:
import gradio as gr
from gradio_modal import Modal
with gr.Blocks() as demo:
with gr.Tab("Tab 1"):
show_btn = gr.Button("Show Modal")
with gr.Tab("Tab 2"):
gr.Markdown("This is tab 2")
with Modal(visible=False) as modal:
gr.Markdown("Hello world!")
show_btn.click(lambda: Modal(visible=True), None, modal)
demo.launch()
Another similar issue: if I just click on examples everything is ok, but if I open the modal and then click on gr.Examples to infill some textboxes, the modal gets reopened:
import gradio as gr
from gradio_modal import Modal
with gr.Blocks() as demo:
with gr.Tab("Tab 1"):
text_1 = gr.Textbox(label="Input 1")
text_2 = gr.Textbox(label="Input 2")
show_btn = gr.Button("Show Modal")
gr.Examples(
[["Text 1", "Text 2"], ["Text 3", "Text 4"]],
inputs=[text_1, text_2],
)
with gr.Tab("Tab 2"):
gr.Markdown("This is tab 2")
with Modal(visible=False) as modal:
gr.Markdown("Hello world!")
show_btn.click(lambda: Modal(visible=True), None, modal)
demo.launch()
I did not find a straightforward fix for this one! ccing also @freddyaboulton @pngwn @abidlabs in case this could be pointing to a bigger issue!
Looking into this!
Hi @aliabid94 , sorry for the late reply. Sadly even with 0.0.2 the example case I provided above appears to trigger the modal upon example clicking. Please let me know if you think this is fixable!