Improvements to gr.Dataset

[abidlabs]

Some improvements to gr.Dataset, namely:

• Adds support for HTML and Markdown components within a dataset

You can test with Interface like this:

gr.Interface(lambda x:x, gr.Markdown("abc"), gr.Markdown(), examples=[["ab *de* fg"]]).launch()

Or in a standalone gr.Dataset like this:

import gradio as gr

with gr.Blocks() as demo:
        dataset = gr.Dataset(
            components=["number", "textbox", "image", "html", "markdown"],
            samples=[[5, "hello", bus, "<b>Bold</b>", "**Bold**"],
                     [15, "hi", bus, "<i>Italics</i>", "*Italics*"]]
        )
demo.launch()

• Documents the supported components in a gr.Dataset
• Adds support for gr.Dataset to be used as an output component (and corrects the documentation to mention that it can be used as an input component)
• Adds tests for gr.Dataset

Closes: #2349

On a related note, I had to update a lot of different files in the frontend to get examples to work. We should probably make this more streamlined ahead of custom components @pngwn

[github-actions]

All the demos for this PR have been deployed at https://huggingface.co/spaces/gradio-pr-deploys/pr-2437-all-demos

[freddyaboulton]

@abidlabs Thank you for the fix! I tested with cache examples and I think it's working. I think more work is required to get Dataset to work as an output component which I think we could leave for another PR to get the original bugfix in.

[freddyaboulton]

I think this may fail if any of the elements in samples is not natively json serializable. This example is failing for me because it's trying to serialize the numpy array of the image to json.

with gr.Blocks() as demo:
    with gr.Row():
        with gr.Column():
            num = gr.Number(value=2)
            textbox = gr.Textbox(value="foo")
            image = gr.Image(value="lion.jpg")
            html = gr.HTML(value="<b>Bold</b>")
            markdown = gr.Markdown(value="**Bold**")
            button = gr.Button("Populate dataset")
        with gr.Column():
            dataset = gr.Dataset(components=[num, textbox, image, html, markdown])
    button.click(lambda *args: gr.update(samples=[args]), inputs=[num, textbox, image, html, markdown],
                 outputs=dataset)
demo.launch()

Having the Dataset be a generic output component is outside the scope of the original issue so I'd be ok with tracking that in future work.

[abidlabs]

Interesting, yea this looks a little tricky. Let's see if any of our users end up using the Dataset in this way.

[aliabid94]

LGTM

[abidlabs]

Thanks all for the review!