Try out all the components!
", "name": "markdown", "visible": true, "style": {} } }, { "id": 28, "type": "row", "props": { "type": "row", "visible": true, "style": { "equal_height": false, "mobile_collapse": true } } }, { "id": 29, "type": "column", "props": { "type": "column", "variant": "panel", "visible": true, "style": {} } }, { "id": 30, "type": "column", "props": { "type": "column", "variant": "default", "visible": true, "style": {} } }, { "id": 0, "type": "textbox", "props": { "lines": 1, "max_lines": 20, "value": "Lorem ipsum", "label": "Textbox", "show_label": true, "name": "textbox", "visible": true, "style": {} } }, { "id": 1, "type": "textbox", "props": { "lines": 3, "max_lines": 20, "placeholder": "Type here..", "value": "", "label": "Textbox 2", "show_label": true, "name": "textbox", "visible": true, "style": {} } }, { "id": 2, "type": "number", "props": { "value": 42.0, "label": "Number", "show_label": true, "name": "number", "visible": true, "style": {} } }, { "id": 3, "type": "slider", "props": { "minimum": 10, "maximum": 20, "step": 0.1, "value": 15, "label": "Slider: 10 - 20", "show_label": true, "name": "slider", "visible": true, "style": {} } }, { "id": 4, "type": "slider", "props": { "minimum": 0, "maximum": 20, "step": 0.04, "value": 0, "label": "Slider: step @ 0.04", "show_label": true, "name": "slider", "visible": true, "style": {} } }, { "id": 5, "type": "checkbox", "props": { "value": false, "label": "Checkbox", "show_label": true, "name": "checkbox", "visible": true, "style": {} } }, { "id": 6, "type": "checkboxgroup", "props": { "choices": [ "foo", "bar", "baz" ], "value": [ "foo", "bar" ], "label": "CheckboxGroup", "show_label": true, "name": "checkboxgroup", "visible": true, "style": {} } }, { "id": 7, "type": "radio", "props": { "choices": [ "foo", "bar", "baz" ], "value": "baz", "label": "Radio", "show_label": true, "name": "radio", "visible": true, "style": {} } }, { "id": 8, "type": "dropdown", "props": { "choices": [ "foo", "bar", "baz" ], "value": "foo", "label": "Dropdown", "show_label": true, "name": "dropdown", "visible": true, "style": {} } }, { "id": 9, "type": "image", "props": { "image_mode": "RGB", "source": "upload", "tool": "editor", "streaming": false, "label": "Image", "show_label": true, "name": "image", "visible": true, "style": {} } }, { "id": 10, "type": "image", "props": { "image_mode": "RGB", "source": "upload", "tool": "select", "streaming": false, "label": "Image w/ Cropper", "show_label": true, "name": "image", "visible": true, "style": {} } }, { "id": 11, "type": "image", "props": { "image_mode": "RGB", "source": "canvas", "tool": "editor", "streaming": false, "label": "Sketchpad", "show_label": true, "name": "image", "visible": true, "style": {} } }, { "id": 12, "type": "image", "props": { "image_mode": "RGB", "source": "webcam", "tool": "editor", "streaming": false, "label": "Webcam", "show_label": true, "name": "image", "visible": true, "style": {} } }, { "id": 13, "type": "video", "props": { "source": "upload", "label": "Video", "show_label": true, "name": "video", "visible": true, "style": {} } }, { "id": 14, "type": "audio", "props": { "source": "upload", "streaming": false, "label": "Audio", "show_label": true, "name": "audio", "visible": true, "style": {} } }, { "id": 15, "type": "audio", "props": { "source": "microphone", "streaming": false, "label": "Microphone", "show_label": true, "name": "audio", "visible": true, "style": {} } }, { "id": 31, "type": "row", "props": { "type": "row", "visible": true, "style": { "mobile_collapse": false } } }, { "id": 32, "type": "button", "props": { "value": "Clear", "variant": "secondary", "name": "button", "visible": true, "style": {} } }, { "id": 33, "type": "button", "props": { "value": "Submit", "variant": "primary", "name": "button", "visible": true, "style": {} } }, { "id": 34, "type": "column", "props": { "type": "column", "variant": "panel", "visible": true, "style": {} } }, { "id": 35, "type": "statustracker", "props": { "cover_container": true, "name": "statustracker", "visible": true, "style": {} } }, { "id": 16, "type": "textbox", "props": { "lines": 1, "max_lines": 20, "value": "", "label": "Textbox", "show_label": true, "interactive": false, "name": "textbox", "visible": true, "style": {} } }, { "id": 17, "type": "label", "props": { "label": "Label", "show_label": true, "interactive": false, "name": "label", "visible": true, "style": {} } }, { "id": 18, "type": "audio", "props": { "source": "upload", "streaming": false, "label": "Audio", "show_label": true, "interactive": false, "name": "audio", "visible": true, "style": {} } }, { "id": 19, "type": "image", "props": { "image_mode": "RGB", "source": "upload", "tool": "editor", "streaming": false, "label": "Image", "show_label": true, "interactive": false, "name": "image", "visible": true, "style": {} } }, { "id": 20, "type": "video", "props": { "source": "upload", "label": "Video", "show_label": true, "interactive": false, "name": "video", "visible": true, "style": {} } }, { "id": 21, "type": "highlightedtext", "props": { "color_map": { "punc": "pink", "test 0": "blue" }, "show_legend": false, "label": "HighlightedText", "show_label": true, "interactive": false, "name": "highlightedtext", "visible": true, "style": {} } }, { "id": 22, "type": "highlightedtext", "props": { "show_legend": true, "label": "HighlightedText", "show_label": true, "interactive": false, "name": "highlightedtext", "visible": true, "style": {} } }, { "id": 23, "type": "json", "props": { "label": "JSON", "show_label": true, "interactive": false, "name": "json", "visible": true, "style": {} } }, { "id": 24, "type": "html", "props": { "value": "", "label": "HTML", "show_label": true, "interactive": false, "name": "html", "visible": true, "style": {} } }, { "id": 36, "type": "row", "props": { "type": "row", "visible": true, "style": { "mobile_collapse": false } } }, { "id": 37, "type": "button", "props": { "value": "Flag", "variant": "secondary", "name": "button", "visible": true, "style": {} } }, { "id": 38, "type": "dataset", "props": { "components": [ "textbox", "textbox", "number", "slider", "slider", "checkbox", "checkboxgroup", "radio", "dropdown", "image", "image", "image", "image", "video", "audio", "audio" ], "headers": [ "Textbox", "Textbox 2", "Number", "Slider: 10 - 20", "Slider: step @ 0.04", "Checkbox", "CheckboxGroup", "Radio", "Dropdown", "Image", "Image w/ Cropper", "Sketchpad", "Webcam", "Video", "Audio", "Microphone" ], "samples": [ [ "the quick brown fox", "jumps over the lazy dog", 10, 12, 4, true, [ "foo", "baz" ], "baz", "bar", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/world.mp4", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cantina.wav" ], [ "the quick brown fox", "jumps over the lazy dog", 10, 12, 4, true, [ "foo", "baz" ], "baz", "bar", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/world.mp4", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cantina.wav" ], [ "the quick brown fox", "jumps over the lazy dog", 10, 12, 4, true, [ "foo", "baz" ], "baz", "bar", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cheetah1.jpg", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/world.mp4", "/Users/dawoodkhan/Desktop/Developer/gradio/demo/kitchen_sink/files/cantina.wav" ] ], "type": "index", "name": "dataset", "visible": true, "style": {} } }, { "id": 39, "type": "markdown", "props": { "value": "Learn more about Gradio
", "name": "markdown", "visible": true, "style": {} } } ], "theme": "default", "css": null, "enable_queue": false, "layout": { "id": 25, "children": [ { "id": 26 }, { "id": 27 }, { "id": 28, "children": [ { "id": 29, "children": [ { "id": 30, "children": [ { "id": 0 }, { "id": 1 }, { "id": 2 }, { "id": 3 }, { "id": 4 }, { "id": 5 }, { "id": 6 }, { "id": 7 }, { "id": 8 }, { "id": 9 }, { "id": 10 }, { "id": 11 }, { "id": 12 }, { "id": 13 }, { "id": 14 }, { "id": 15 } ] }, { "id": 31, "children": [ { "id": 32 }, { "id": 33 } ] } ] }, { "id": 34, "children": [ { "id": 35 }, { "id": 16 }, { "id": 17 }, { "id": 18 }, { "id": 19 }, { "id": 20 }, { "id": 21 }, { "id": 22 }, { "id": 23 }, { "id": 24 }, { "id": 36, "children": [ { "id": 37 } ] } ] } ] }, { "id": 38 }, { "id": 39 } ] }, "dependencies": [ { "targets": [ 33 ], "trigger": "click", "inputs": [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15 ], "outputs": [ 16, 17, 18, 19, 20, 21, 22, 23, 24 ], "backend_fn": true, "js": null, "status_tracker": 35, "queue": null, "api_name": "predict", "scroll_to_output": true, "show_progress": true, "documentation": [ [ "(str): text", "(str): text", "(float | None): numeric input", "(number): numeric input", "(number): numeric input", "(bool): boolean input", "(List[str]): list of selected choices", "(str): selected choice", "(str): selected choice", "(str): base64 url data", "(str): base64 url data", "(str): base64 url data", "(str): base64 url data", "(Dict[name: str, data: str]): JSON object with filename as 'name' property and base64 data as 'data' property", "(Dict[name: str, data: str]): JSON object with filename as 'name' property and base64 data as 'data' property", "(Dict[name: str, data: str]): JSON object with filename as 'name' property and base64 data as 'data' property" ], [ "(str | None): text", "(Dict[label: str, confidences: List[Dict[label: str, confidence: number]]]): Object with key 'label' representing primary label, and key 'confidences' representing a list of label-confidence pairs", "(str): base64 url data", "(str): base64 url data", "(str): base64 url data", "(List[Tuple[str, str | number | None]]): List of (word, category) tuples", "(List[Tuple[str, str | number | None]]): List of (word, category) tuples", "(Dict | List): JSON output", null ] ] }, { "targets": [ 32 ], "trigger": "click", "inputs": [], "outputs": [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 30 ], "backend_fn": false, "js": "() => [\"\", \"\", null, 15, 0, null, [], \"baz\", \"foo\", null, null, null, null, null, null, null, \"\", null, null, null, null, null, null, null, null, {\"variant\": null, \"visible\": true, \"__type__\": \"update\"}]\n ", "status_tracker": null, "queue": null, "api_name": null, "scroll_to_output": false, "show_progress": true }, { "targets": [ 37 ], "trigger": "click", "inputs": [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24 ], "outputs": [], "backend_fn": true, "js": null, "status_tracker": null, "queue": false, "api_name": null, "scroll_to_output": false, "show_progress": true }, { "targets": [ 38 ], "trigger": "click", "inputs": [ 38 ], "outputs": [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15 ], "backend_fn": true, "js": null, "status_tracker": null, "queue": false, "api_name": null, "scroll_to_output": false, "show_progress": true } ] }