Update box content on element change

🔒 Gradio
1

Hi, I’m currently new to using Gradio’s Block design system and I was wondering if it was possible to update the box’s content with a new one when a radio choice has been modified. Here’s the code I currently have at the moment.

import gradio as Gradio

def run_demucs(audio, stem_type):
	return None

def update_output(stem_type, outputs: Gradio.Box):
	if stem_type == "2":
		outputs.add([
			Gradio.Audio(type="filepath", label="Vocals", interactive=False),
			Gradio.Audio(type="filepath", label="Instrumental", interactive=False)
		])
	elif stem_type == "4":
		outputs.add([
			Gradio.Audio(type="filepath", label="Vocals", interactive=False), Gradio.Audio(type="filepath", label="Bass", interactive=False),
			Gradio.Audio(type="filepath", label="Drums", interactive=False), Gradio.Audio(type="filepath", label="Other", interactive=False)
		])
	else:
		outputs.add([
			Gradio.Audio(type="filepath", label="Vocals", interactive=False), Gradio.Audio(type="filepath", label="Bass", interactive=False),
			Gradio.Audio(type="filepath", label="Drums", interactive=False), Gradio.Audio(type="filepath", label="Other", interactive=False),
			Gradio.Audio(type="filepath", label="Piano", interactive=False), Gradio.Audio(type="filepath", label="Guitar", interactive=False)
		])

with Gradio.Blocks(analytics_enabled=False, css=".generating {visibility: hidden}") as demo:
	with Gradio.Column():
		Gradio.Markdown(
			"""
			## Demucs
			Uses the 'canary bleeding-edge' version of Demucs (v4) that introduces the latest Hybrid Transformer model <br/>
			Heavily inspired from <a href="https://huggingface.co/spaces/Thafx/Demucs_v4_2s_HT">Thafx's Demucs v4 Space</a>, which is based on <a href="https://huggingface.co/spaces/akhaliq/demucs">akhaliq's PIP Demucs Space</a>
			"""
		)
		submit = Gradio.Button("Generate", variant="primary")

		with Gradio.Row():
			with Gradio.Box():
				audio = Gradio.Audio(type="numpy", label="Audio", show_label=True)
				stem_type = Gradio.Radio(["2", "4", "6"], label="Stem type", info="Want to utilize Demucs with many stems? If so—how many?")

			with Gradio.Box() as output_box:
				None

		with Gradio.Row():
			Gradio.Markdown(
				"""
				### Articles
				<a href='https://arxiv.org/abs/1911.13254' target='_blank'>Music Source Separation in the Waveform Domain</a> | <a href='https://github.com/facebookresearch/demucs' target='_blank'>Github Repo</a>
				"""
			)

	stem_type.change(update_output, inputs=[stem_type, output_box], outputs=None)
	submit.click(run_demucs, inputs=[audio, stem_type], outputs=output_box)

demo.launch(debug=True)