How do I make a reactive output component using Blocks?

🔒 Gradio
1

Basically I just want to replicate following code using gr.Blocks(), how do I do it?

import gradio as gr

def calculator(num1, operation, num2):
    if operation == "add":
        return num1 + num2
    elif operation == "subtract":
        return num1 - num2
    elif operation == "multiply":
        return num1 * num2
    elif operation == "divide":
        return num1 / num2

demo = gr.Interface(
    calculator,
    [
        "number",
        gr.Radio(["add", "subtract", "multiply", "divide"]),
        "number"
    ],
    "number",
    live=True,
)
demo.launch()

The code is from Reactive Interfaces

It automatically updates the output component when any of the input component changes.
AFAIK, if I want to replicate this behavior using Blocks, I’ll have to call .change() method on every input component. Is there a way to do it without calling .change() eagerly on every input?

I’m mostly looking for the ability to store the output into gr.State() lazily so that the state can be read by other events.
Let’s say the output box only updates the display once a second, then you don’t need to eagerly update the state all the time. You only need to update the state every second.