gradio: [Blocks] Implement other event triggers besides `click` & support event triggers across multiple components

Currently, the only event trigger we support is click.

  1. Can we add support additional event triggers? Some of these will be component specific, but something like an “on change” event would be useful for many different components. For example, in my Block below, I would like to run the function any time the input sliders change value
block = gr.Blocks()

with block:
    gr.Markdown("Let's do some kinematics! Choose the speed and angle to see the trajectory.")
    
    with gr.Row():
        speed = gr.inputs.Slider(1, 30, default=25)
        angle = gr.inputs.Slider(0, 90, default=45)
    output = gr.outputs.Image(type="plot")
    btn = gr.Button("Run")
    btn.click(plot, [speed, angle], output)

block.launch()
  1. It would be nice if I could easily assign a trigger to “if any of these two sliders change” without having to write two separate event trigger lines

  2. It would be really nice if I could just say something like “if anything changes in this Block” re-run all of the function(s). I would assume that many of our users want this functionality for their blocks. Could we have a parameter in gr.Blocks() like live=True. In other words, if you run gr.Blocks(live=True), then you have an automatically responsive Block in which if any of the input components change, all of the functions are re-run and the outputs automatically refresh.

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Reactions: 1
  • Comments: 17 (15 by maintainers)

Most upvoted comments

Updated the table and implemented all of the events on the frontend in #807.

We can use the table above as a source of truth for syncing front and backend but also for documentation. We should just keep editing it as anything changes.

  • Asubmit even would be fine, I’ll add that to Number and Textbox.
  • Yeah I missed Image, I think it would be the same as Files, etc. change would cover edits but we can add the more specific edit event too.
  • We can add all of the audio control events for Audio and Video. play/pause/stop. Audio will need edit as well (if we are adding it to Image)
  • HighlightedText is in the table, KeyValues is not, I did n’t know about that one.
  • I’ll change Chatbot from message to change.