From cab4441e4119f495e8174a2707fd31816a34220e Mon Sep 17 00:00:00 2001 From: Freddy Boulton <41651716+freddyaboulton@users.noreply.github.com> Date: Mon, 28 Apr 2025 12:47:13 -0400 Subject: [PATCH 01/42] Commit --- demo/dia_dialogue_demo/app.py | 108 +++++ gradio/__init__.py | 2 + gradio/components/__init__.py | 2 + gradio/components/dialogue.py | 135 ++++++ gradio/stubs/anyio.pyi | 2 +- js/dialogue/Dialogue.svelte | 499 ++++++++++++++++++++++ js/dialogue/DropdownOptions.svelte | 165 +++++++ js/dialogue/Example.svelte | 19 + js/dialogue/Index.svelte | 96 +++++ js/dialogue/main.ts | 2 + js/dialogue/package.json | 42 ++ js/dialogue/utils.ts | 4 + js/dropdown/Index.svelte | 1 + js/dropdown/shared/DropdownOptions.svelte | 12 +- package.json | 1 + pnpm-lock.yaml | 28 ++ 16 files changed, 1115 insertions(+), 3 deletions(-) create mode 100644 demo/dia_dialogue_demo/app.py create mode 100644 gradio/components/dialogue.py create mode 100644 js/dialogue/Dialogue.svelte create mode 100644 js/dialogue/DropdownOptions.svelte create mode 100644 js/dialogue/Example.svelte create mode 100644 js/dialogue/Index.svelte create mode 100644 js/dialogue/main.ts create mode 100644 js/dialogue/package.json create mode 100644 js/dialogue/utils.ts diff --git a/demo/dia_dialogue_demo/app.py b/demo/dia_dialogue_demo/app.py new file mode 100644 index 0000000000..181aae15be --- /dev/null +++ b/demo/dia_dialogue_demo/app.py @@ -0,0 +1,108 @@ +import gradio as gr +import httpx + + +emotions = [ + "(laughs)", + "(clears throat)", + "(sighs)", + "(gasps)", + "(coughs)", + "(singing)", + "(sings)", + "(mumbles)", + "(beep)", + "(groans)", + "(sniffs)", + "(claps)", + "(screams)", + "(inhales)", + "(exhales)", + "(applause)", + "(burps)", + "(humming)", + "(sneezes)", + "(chuckle)", + "(whistles)", +] +speakers = ["Speaker 1", "Speaker 2"] + +client = httpx.AsyncClient(timeout=180) +API_URL = "https://router.huggingface.co/fal-ai/fal-ai/dia-tts" + + +async def query(dialogue: str, token: gr.OAuthToken | None): + if token is None: + raise gr.Error( + "No token provided. Use Sign in with Hugging Face to get a token." + ) + headers = { + "Authorization": f"Bearer {token.token}", + } + response = await client.post(API_URL, headers=headers, json={"text": dialogue}) + url = response.json()["audio"]["url"] + print("URL: ", url) + return url + + +def formatter(speaker, text): + speaker = speaker.split(" ")[1] + return f"[S{speaker}] {text}" + + +with gr.Blocks() as demo: + with gr.Sidebar(): + login_button = gr.LoginButton() + gr.HTML( + """ +

+ Dancing Huggy Dia Dialogue Generation Model +

+

Model by Nari Labs. Powered by HF and Fal AI API.

+

Dia is a dialogue generation model that can generate realistic dialogue between two speakers. Use the dialogue component to create a conversation and then hit the submit button in the bottom right corner to see it come to life .

+ """ + ) + with gr.Row(): + with gr.Column(): + dialogue = gr.Dialogue( + speakers=speakers, emotions=emotions, formatter=formatter + ) + with gr.Column(): + with gr.Row(): + audio = gr.Audio(label="Audio") + with gr.Row(): + gr.DeepLinkButton(value="Share Audio via Link") + with gr.Row(): + gr.Examples( + examples=[ + [ + [ + { + "speaker": "Speaker 1", + "text": "Why did the chicken cross the road?", + }, + {"speaker": "Speaker 2", "text": "I don't know!"}, + { + "speaker": "Speaker 1", + "text": "to get to the other side! (laughs)", + }, + ] + ], + [ + [ + { + "speaker": "Speaker 1", + "text": "I am a little tired today (sighs).", + }, + {"speaker": "Speaker 2", "text": "Hang in there!"}, + ] + ], + ], + inputs=[dialogue], + cache_examples=False, + ) + + dialogue.submit(query, [dialogue], audio) + +if __name__ == "__main__": + demo.launch() diff --git a/gradio/__init__.py b/gradio/__init__.py index e6ab8bfbef..c5d7b1f9f1 100644 --- a/gradio/__init__.py +++ b/gradio/__init__.py @@ -31,6 +31,7 @@ Dataset, DateTime, DeepLinkButton, + Dialogue, DownloadButton, Dropdown, DuplicateButton, @@ -145,6 +146,7 @@ "Dataframe", "Dataset", "DateTime", + "Dialogue", "DeletedFileData", "DownloadButton", "DownloadData", diff --git a/gradio/components/__init__.py b/gradio/components/__init__.py index 5252175f3b..2456093686 100644 --- a/gradio/components/__init__.py +++ b/gradio/components/__init__.py @@ -21,6 +21,7 @@ from gradio.components.dataset import Dataset from gradio.components.datetime import DateTime from gradio.components.deep_link_button import DeepLinkButton +from gradio.components.dialogue import Dialogue from gradio.components.download_button import DownloadButton from gradio.components.dropdown import Dropdown from gradio.components.duplicate_button import DuplicateButton @@ -78,6 +79,7 @@ "Dataframe", "DataFrame", "Dataset", + "Dialogue", "DownloadButton", "DuplicateButton", "Fallback", diff --git a/gradio/components/dialogue.py b/gradio/components/dialogue.py new file mode 100644 index 0000000000..65e8f17c35 --- /dev/null +++ b/gradio/components/dialogue.py @@ -0,0 +1,135 @@ +from collections.abc import Callable +from typing import List + +from gradio.components.base import server +from gradio.components.textbox import Textbox +from gradio.data_classes import GradioModel, GradioRootModel +from gradio.events import Events + + +class DialogueLine(GradioModel): + speaker: str + text: str + +class DialogueModel(GradioRootModel): + root: List[DialogueLine] + +class Dialogue(Textbox): + """ + Creates a dialogue components for users to enter dialogue between speakers. + + Demos: dia_dialogue_demo + """ + + EVENTS = [ + Events.change, + Events.input, + Events.submit, + ] + + data_model = DialogueModel + def __init__(self, + value: list[dict[str, str]] | Callable | None = None, + *, + speakers: list[str] | None = None, + formatter: Callable | None = None, + emotions: list[str] | None = None, + separator: str = " ", + label: str | None = "Dialogue", + info: str | None = "Type colon (:) in the dialogue line to see the available emotion and intonation tags", + placeholder: str | None = "Enter dialogue here...", + show_label: bool | None = None, + container: bool = True, + scale: int | None = None, + min_width: int = 160, + interactive: bool | None = None, + visible: bool = True, + elem_id: str | None = None, + autofocus: bool = False, + autoscroll: bool = True, + elem_classes: list[str] | str | None = None, + render: bool = True, + key: int | str | None = None, + max_lines: int | None = None, + show_submit_button: bool = True, + show_copy_button: bool = True, + ): + """ + Parameters: + value: Value of the dialogue. It is a list of dictionaries, each containing a 'speaker' key and a 'text' key. If a function is provided, the function will be called each time the app loads to set the initial value of this component. + speakers: The different speakers allowed in the dialogue. + formatter: A function that formats the dialogue line dictionary, e.g. {"speaker": "Speaker 1", "text": "Hello, how are you?"} into a string, e.g. "Speaker 1: Hello, how are you?". + emotions: The different emotions and intonation allowed in the dialogue. Emotions are displayed in an autocomplete menu below the input textbox when the user starts typing `:`. Use the exact emotion name expected by the AI model or inference function. + separator: The separator between the different dialogue lines used to join the formatted dialogue lines into a single string. For example, a newline character or empty string. + max_lines: maximum number of lines allowed in the dialogue. + placeholder: placeholder hint to provide behind textarea. + label: the label for this component, displayed above the component if `show_label` is `True` and is also used as the header if there are a table of examples for this component. If None and used in a `gr.Interface`, the label will be the name of the parameter this component corresponds to. + show_label: if True, will display the label. If False, the copy button is hidden as well as well as the label. + container: if True, will place the component in a container - providing some extra padding around the border. + scale: relative size compared to adjacent Components. For example if Components A and B are in a Row, and A has scale=2, and B has scale=1, A will be twice as wide as B. Should be an integer. scale applies in Rows, and to top-level Components in Blocks where fill_height=True. + min_width: minimum pixel width, will wrap if not sufficient screen space to satisfy this value. If a certain scale value results in this Component being narrower than min_width, the min_width parameter will be respected first. + interactive: if True, will be rendered as an editable textbox; if False, editing will be disabled. If not provided, this is inferred based on whether the component is used as an input or output. + visible: If False, component will be hidden. + autofocus: If True, will focus on the textbox when the page loads. Use this carefully, as it can cause usability issues for sighted and non-sighted users. + elem_id: An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles. + elem_classes: An optional list of strings that are assigned as the classes of this component in the HTML DOM. Can be used for targeting CSS styles. + render: If False, component will not render be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later. + key: if assigned, will be used to assume identity across a re-render. Components that have the same key across a re-render will have their value preserved. + show_copy_button: If True, includes a copy button to copy the text in the textbox. Only applies if show_label is True. + show_submit_button: If True, includes a submit button to submit the dialogue. + autoscroll: If True, will automatically scroll to the bottom of the textbox when the value changes, unless the user scrolls up. If False, will not scroll to the bottom of the textbox when the value changes. + """ + super().__init__(value="", + label=label, info=info, placeholder=placeholder, show_label=show_label, container=container, scale=scale, min_width=min_width, interactive=interactive, visible=visible, elem_id=elem_id, autofocus=autofocus, autoscroll=autoscroll, elem_classes=elem_classes, render=render, key=key, max_lines=max_lines) + self.speakers = speakers + self.emotions = emotions or [] + self.formatter = formatter + self.separator = separator + self.show_submit_button = show_submit_button + self.show_copy_button = show_copy_button + if isinstance(value, Callable): + value = value() + self.value = self.preprocess(DialogueModel(root=value)) if value is not None else value # type: ignore + + def preprocess(self, payload: DialogueModel) -> str: + """ + This docstring is used to generate the docs for this custom component. + Parameters: + payload: the data to be preprocessed, sent from the frontend + Returns: + the data after preprocessing, sent to the user's function in the backend + """ + formatter = self.formatter + if not formatter: + formatter = self.default_formatter + return self.separator.join([formatter(line.speaker, line.text) for line in payload.root]) + + @staticmethod + def default_formatter(speaker: str, text: str) -> str: + return f"[{speaker}] {text}" + + @server + async def format(self, value: list[dict]): + """Format the dialogue in the frontend into a string that's copied to the clipboard.""" + data = DialogueModel(root=value) # type: ignore + return self.preprocess(data) + + def postprocess(self, value): + """ + This docstring is used to generate the docs for this custom component. + Parameters: + payload: the data to be postprocessed, sent from the user's function in the backend + Returns: + the data after postprocessing, sent to the frontend + """ + return value + + def as_example(self, value): + return self.preprocess(DialogueModel(root=value)) + + def example_payload(self): + return [{"speaker": "Speaker 1", "text": "Hello, how are you?"}, {"speaker": "Speaker 2", "text": "I'm fine, thank you!"}] + + def example_value(self): + return [{"speaker": "Speaker 1", "text": "Hello, how are you?"}, {"speaker": "Speaker 2", "text": "I'm fine, thank you!"}] + diff --git a/gradio/stubs/anyio.pyi b/gradio/stubs/anyio.pyi index 0a354c32ef..d83eb5143a 100644 --- a/gradio/stubs/anyio.pyi +++ b/gradio/stubs/anyio.pyi @@ -1,6 +1,6 @@ """ This module contains type hints for the anyio library. It was auto-generated so may include errors.""" -from typing import Any, Callable, Coroutine, TypeVar, overload, Optional, Union from types import TracebackType +from typing import Any, Callable, Coroutine, Optional, TypeVar, Union, overload T = TypeVar('T') T_Retval = TypeVar('T_Retval') diff --git a/js/dialogue/Dialogue.svelte b/js/dialogue/Dialogue.svelte new file mode 100644 index 0000000000..0b9e692dda --- /dev/null +++ b/js/dialogue/Dialogue.svelte @@ -0,0 +1,499 @@ + + + + + + + diff --git a/js/dialogue/DropdownOptions.svelte b/js/dialogue/DropdownOptions.svelte new file mode 100644 index 0000000000..fb53ce203a --- /dev/null +++ b/js/dialogue/DropdownOptions.svelte @@ -0,0 +1,165 @@ + + + + +
+{#if show_options && !disabled} +
    dispatch("change", e)} + on:scroll={(e) => (list_scroll_y = e.currentTarget.scrollTop)} + style:top + style:bottom + style:max-height={`calc(${max_height}px - var(--window-padding))`} + style:width={input_width + "px"} + bind:this={listElement} + role="listbox" + > + {#each filtered_indices as index} +
  • + + ✓ + + {choices[index][0]} +
    • + {/each} +
+{/if} + + diff --git a/js/dialogue/Example.svelte b/js/dialogue/Example.svelte new file mode 100644 index 0000000000..6b6a4a08c9 --- /dev/null +++ b/js/dialogue/Example.svelte @@ -0,0 +1,19 @@ + + +
+ {value} +
+ + diff --git a/js/dialogue/Index.svelte b/js/dialogue/Index.svelte new file mode 100644 index 0000000000..b999988815 --- /dev/null +++ b/js/dialogue/Index.svelte @@ -0,0 +1,96 @@ + + + + + + + + + + {#if loading_status} + gradio.dispatch("clear_status", loading_status)} + /> + {/if} + + gradio.dispatch("change", value)} + on:input={() => gradio.dispatch("input")} + on:submit={() => gradio.dispatch("submit")} + on:blur={() => gradio.dispatch("blur")} + on:select={(e) => gradio.dispatch("select", e.detail)} + on:focus={() => gradio.dispatch("focus")} + on:copy={(e) => gradio.dispatch("copy", e.detail)} + disabled={!interactive} + /> + diff --git a/js/dialogue/main.ts b/js/dialogue/main.ts new file mode 100644 index 0000000000..7bdb9b1777 --- /dev/null +++ b/js/dialogue/main.ts @@ -0,0 +1,2 @@ +import { default as Index } from "./Index.svelte"; +export default Index; \ No newline at end of file diff --git a/js/dialogue/package.json b/js/dialogue/package.json new file mode 100644 index 0000000000..8d7988777f --- /dev/null +++ b/js/dialogue/package.json @@ -0,0 +1,42 @@ +{ + "name": "@gradio/dialogue", + "version": "0.0.1", + "description": "Gradio dialogue component", + "type": "module", + "author": "Gradio", + "license": "ISC", + "private": false, + "main_changeset": true, + "exports": { + ".": { + "gradio": "./Index.svelte", + "svelte": "./dist/Index.svelte", + "types": "./dist/Index.svelte.d.ts" + }, + "./example": { + "gradio": "./Example.svelte", + "svelte": "./dist/Example.svelte", + "types": "./dist/Example.svelte.d.ts" + }, + "./package.json": "./package.json" + }, + "dependencies": { + "@gradio/atoms": "workspace:^", + "@gradio/icons": "workspace:^", + "@gradio/statustracker": "workspace:^", + "@gradio/utils": "workspace:^", + "@gradio/dropdown": "workspace:^" + }, + "devDependencies": { + "@gradio/preview": "workspace:^" + }, + "peerDependencies": { + "svelte": "^4.0.0" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/gradio-app/gradio.git", + "directory": "js/dialogue" + } +} + diff --git a/js/dialogue/utils.ts b/js/dialogue/utils.ts new file mode 100644 index 0000000000..4908866429 --- /dev/null +++ b/js/dialogue/utils.ts @@ -0,0 +1,4 @@ +export interface DialogueLine { + speaker: string; + text: string; +} diff --git a/js/dropdown/Index.svelte b/js/dropdown/Index.svelte index 76708b053d..a3f0d36673 100644 --- a/js/dropdown/Index.svelte +++ b/js/dropdown/Index.svelte @@ -1,5 +1,6 @@ diff --git a/js/dropdown/shared/DropdownOptions.svelte b/js/dropdown/shared/DropdownOptions.svelte index 93cb90bec1..fb53ce203a 100644 --- a/js/dropdown/shared/DropdownOptions.svelte +++ b/js/dropdown/shared/DropdownOptions.svelte @@ -8,6 +8,8 @@ export let selected_indices: (string | number)[] = []; export let active_index: number | null = null; export let remember_scroll = false; + export let offset_from_top = 0; + export let from_top = false; let distance_from_top: number; let distance_from_bottom: number; @@ -19,10 +21,15 @@ let innerHeight: number; let list_scroll_y = 0; + function calculate_window_distance(): void { const { top: ref_top, bottom: ref_bottom } = refElement.getBoundingClientRect(); - distance_from_top = ref_top; + if (from_top) { + distance_from_top = offset_from_top; + } else { + distance_from_top = ref_top; + } distance_from_bottom = innerHeight - ref_bottom; } @@ -66,7 +73,8 @@ input_height = rect?.height || 0; input_width = rect?.width || 0; } - if (distance_from_bottom > distance_from_top) { + if (distance_from_bottom > distance_from_top || from_top) { + console.log("distance_from_top", distance_from_top); top = `${distance_from_top}px`; max_height = distance_from_bottom; bottom = null; diff --git a/package.json b/package.json index f9e169c3fc..82d1c28d5f 100644 --- a/package.json +++ b/package.json @@ -106,6 +106,7 @@ "@gradio/colorpicker": "workspace:^", "@gradio/column": "workspace:^", "@gradio/core": "workspace:^", + "@gradio/dialogue": "workspace:^", "@gradio/dataframe": "workspace:^", "@gradio/dataset": "workspace:^", "@gradio/datetime": "workspace:^", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index e56d286b5f..d9ee766f65 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -239,6 +239,9 @@ importers: '@gradio/datetime': specifier: workspace:^ version: link:js/datetime + '@gradio/dialogue': + specifier: workspace:^ + version: link:js/dialogue '@gradio/downloadbutton': specifier: workspace:^ version: link:js/downloadbutton @@ -1312,6 +1315,31 @@ importers: specifier: workspace:^ version: link:../preview + js/dialogue: + dependencies: + '@gradio/atoms': + specifier: workspace:^ + version: link:../atoms + '@gradio/dropdown': + specifier: workspace:^ + version: link:../dropdown + '@gradio/icons': + specifier: workspace:^ + version: link:../icons + '@gradio/statustracker': + specifier: workspace:^ + version: link:../statustracker + '@gradio/utils': + specifier: workspace:^ + version: link:../utils + svelte: + specifier: ^4.0.0 + version: 4.2.15 + devDependencies: + '@gradio/preview': + specifier: workspace:^ + version: link:../preview + js/downloadbutton: dependencies: '@gradio/button': From 9d3fccfef8ca594476c6d782f02c09b246a50e7d Mon Sep 17 00:00:00 2001 From: gradio-pr-bot Date: Mon, 28 Apr 2025 16:50:59 +0000 Subject: [PATCH 02/42] add changeset --- .changeset/spotty-sides-sneeze.md | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 .changeset/spotty-sides-sneeze.md diff --git a/.changeset/spotty-sides-sneeze.md b/.changeset/spotty-sides-sneeze.md new file mode 100644 index 0000000000..6f4c09999f --- /dev/null +++ b/.changeset/spotty-sides-sneeze.md @@ -0,0 +1,7 @@ +--- +"@gradio/dialogue": minor +"@gradio/dropdown": minor +"gradio": minor +--- + +feat:Add gr.Dialogue component From a56dd562b6ab0f63fb028559341098b6e84369d2 Mon Sep 17 00:00:00 2001 From: Freddy Boulton <41651716+freddyaboulton@users.noreply.github.com> Date: Mon, 28 Apr 2025 12:51:46 -0400 Subject: [PATCH 03/42] Add code --- js/dialogue/DropdownOptions.svelte | 165 ----------------------------- 1 file changed, 165 deletions(-) delete mode 100644 js/dialogue/DropdownOptions.svelte diff --git a/js/dialogue/DropdownOptions.svelte b/js/dialogue/DropdownOptions.svelte deleted file mode 100644 index fb53ce203a..0000000000 --- a/js/dialogue/DropdownOptions.svelte +++ /dev/null @@ -1,165 +0,0 @@ - - - - -
-{#if show_options && !disabled} -
    dispatch("change", e)} - on:scroll={(e) => (list_scroll_y = e.currentTarget.scrollTop)} - style:top - style:bottom - style:max-height={`calc(${max_height}px - var(--window-padding))`} - style:width={input_width + "px"} - bind:this={listElement} - role="listbox" - > - {#each filtered_indices as index} -
  • - - ✓ - - {choices[index][0]} -
    • - {/each} -
-{/if} - - From 632535cd07f8f920466626cb0143ba49e942a701 Mon Sep 17 00:00:00 2001 From: Freddy Boulton <41651716+freddyaboulton@users.noreply.github.com> Date: Mon, 28 Apr 2025 12:54:32 -0400 Subject: [PATCH 04/42] rename --- demo/dia_dialogue_demo/run.ipynb | 1 + demo/dia_dialogue_demo/{app.py => run.py} | 0 2 files changed, 1 insertion(+) create mode 100644 demo/dia_dialogue_demo/run.ipynb rename demo/dia_dialogue_demo/{app.py => run.py} (100%) diff --git a/demo/dia_dialogue_demo/run.ipynb b/demo/dia_dialogue_demo/run.ipynb new file mode 100644 index 0000000000..a016628a25 --- /dev/null +++ b/demo/dia_dialogue_demo/run.ipynb @@ -0,0 +1 @@ +{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: dia_dialogue_demo"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["import gradio as gr\n", "import httpx\n", "\n", "\n", "emotions = [\n", " \"(laughs)\",\n", " \"(clears throat)\",\n", " \"(sighs)\",\n", " \"(gasps)\",\n", " \"(coughs)\",\n", " \"(singing)\",\n", " \"(sings)\",\n", " \"(mumbles)\",\n", " \"(beep)\",\n", " \"(groans)\",\n", " \"(sniffs)\",\n", " \"(claps)\",\n", " \"(screams)\",\n", " \"(inhales)\",\n", " \"(exhales)\",\n", " \"(applause)\",\n", " \"(burps)\",\n", " \"(humming)\",\n", " \"(sneezes)\",\n", " \"(chuckle)\",\n", " \"(whistles)\",\n", "]\n", "speakers = [\"Speaker 1\", \"Speaker 2\"]\n", "\n", "client = httpx.AsyncClient(timeout=180)\n", "API_URL = \"https://router.huggingface.co/fal-ai/fal-ai/dia-tts\"\n", "\n", "\n", "async def query(dialogue: str, token: gr.OAuthToken | None):\n", " if token is None:\n", " raise gr.Error(\n", " \"No token provided. Use Sign in with Hugging Face to get a token.\"\n", " )\n", " headers = {\n", " \"Authorization\": f\"Bearer {token.token}\",\n", " }\n", " response = await client.post(API_URL, headers=headers, json={\"text\": dialogue})\n", " url = response.json()[\"audio\"][\"url\"]\n", " print(\"URL: \", url)\n", " return url\n", "\n", "\n", "def formatter(speaker, text):\n", " speaker = speaker.split(\" \")[1]\n", " return f\"[S{speaker}] {text}\"\n", "\n", "\n", "with gr.Blocks() as demo:\n", " with gr.Sidebar():\n", " login_button = gr.LoginButton()\n", " gr.HTML(\n", " \"\"\"\n", "

\n", " \"Dancing Dia Dialogue Generation Model\n", "

\n", "

Model by Nari Labs. Powered by HF and Fal AI API.

\n", "

Dia is a dialogue generation model that can generate realistic dialogue between two speakers. Use the dialogue component to create a conversation and then hit the submit button in the bottom right corner to see it come to life .

\n", " \"\"\"\n", " )\n", " with gr.Row():\n", " with gr.Column():\n", " dialogue = gr.Dialogue(\n", " speakers=speakers, emotions=emotions, formatter=formatter\n", " )\n", " with gr.Column():\n", " with gr.Row():\n", " audio = gr.Audio(label=\"Audio\")\n", " with gr.Row():\n", " gr.DeepLinkButton(value=\"Share Audio via Link\")\n", " with gr.Row():\n", " gr.Examples(\n", " examples=[\n", " [\n", " [\n", " {\n", " \"speaker\": \"Speaker 1\",\n", " \"text\": \"Why did the chicken cross the road?\",\n", " },\n", " {\"speaker\": \"Speaker 2\", \"text\": \"I don't know!\"},\n", " {\n", " \"speaker\": \"Speaker 1\",\n", " \"text\": \"to get to the other side! (laughs)\",\n", " },\n", " ]\n", " ],\n", " [\n", " [\n", " {\n", " \"speaker\": \"Speaker 1\",\n", " \"text\": \"I am a little tired today (sighs).\",\n", " },\n", " {\"speaker\": \"Speaker 2\", \"text\": \"Hang in there!\"},\n", " ]\n", " ],\n", " ],\n", " inputs=[dialogue],\n", " cache_examples=False,\n", " )\n", "\n", " dialogue.submit(query, [dialogue], audio)\n", "\n", "if __name__ == \"__main__\":\n", " demo.launch()\n"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5} \ No newline at end of file diff --git a/demo/dia_dialogue_demo/app.py b/demo/dia_dialogue_demo/run.py similarity index 100% rename from demo/dia_dialogue_demo/app.py rename to demo/dia_dialogue_demo/run.py From d18c6bd5daae0d15cb9f12dc5df6c3af12d6922e Mon Sep 17 00:00:00 2001 From: Freddy Boulton <41651716+freddyaboulton@users.noreply.github.com> Date: Mon, 28 Apr 2025 13:24:01 -0400 Subject: [PATCH 05/42] lint --- gradio/components/dialogue.py | 58 ++++++-- js/dialogue/Dialogue.svelte | 174 ++++++++++++---------- js/dialogue/Index.svelte | 5 +- js/dialogue/main.ts | 2 +- js/dialogue/package.json | 79 +++++----- js/dialogue/utils.ts | 4 +- js/dropdown/shared/DropdownOptions.svelte | 1 - 7 files changed, 183 insertions(+), 140 deletions(-) diff --git a/gradio/components/dialogue.py b/gradio/components/dialogue.py index 65e8f17c35..05c9dedce5 100644 --- a/gradio/components/dialogue.py +++ b/gradio/components/dialogue.py @@ -1,5 +1,6 @@ +from __future__ import annotations + from collections.abc import Callable -from typing import List from gradio.components.base import server from gradio.components.textbox import Textbox @@ -11,8 +12,10 @@ class DialogueLine(GradioModel): speaker: str text: str + class DialogueModel(GradioRootModel): - root: List[DialogueLine] + root: list[DialogueLine] + class Dialogue(Textbox): """ @@ -28,7 +31,9 @@ class Dialogue(Textbox): ] data_model = DialogueModel - def __init__(self, + + def __init__( + self, value: list[dict[str, str]] | Callable | None = None, *, speakers: list[str] | None = None, @@ -36,7 +41,8 @@ def __init__(self, emotions: list[str] | None = None, separator: str = " ", label: str | None = "Dialogue", - info: str | None = "Type colon (:) in the dialogue line to see the available emotion and intonation tags", + info: str + | None = "Type colon (:) in the dialogue line to see the available emotion and intonation tags", placeholder: str | None = "Enter dialogue here...", show_label: bool | None = None, container: bool = True, @@ -53,7 +59,7 @@ def __init__(self, max_lines: int | None = None, show_submit_button: bool = True, show_copy_button: bool = True, - ): + ): """ Parameters: value: Value of the dialogue. It is a list of dictionaries, each containing a 'speaker' key and a 'text' key. If a function is provided, the function will be called each time the app loads to set the initial value of this component. @@ -79,8 +85,25 @@ def __init__(self, show_submit_button: If True, includes a submit button to submit the dialogue. autoscroll: If True, will automatically scroll to the bottom of the textbox when the value changes, unless the user scrolls up. If False, will not scroll to the bottom of the textbox when the value changes. """ - super().__init__(value="", - label=label, info=info, placeholder=placeholder, show_label=show_label, container=container, scale=scale, min_width=min_width, interactive=interactive, visible=visible, elem_id=elem_id, autofocus=autofocus, autoscroll=autoscroll, elem_classes=elem_classes, render=render, key=key, max_lines=max_lines) + super().__init__( + value="", + label=label, + info=info, + placeholder=placeholder, + show_label=show_label, + container=container, + scale=scale, + min_width=min_width, + interactive=interactive, + visible=visible, + elem_id=elem_id, + autofocus=autofocus, + autoscroll=autoscroll, + elem_classes=elem_classes, + render=render, + key=key, + max_lines=max_lines, + ) self.speakers = speakers self.emotions = emotions or [] self.formatter = formatter @@ -89,7 +112,9 @@ def __init__(self, self.show_copy_button = show_copy_button if isinstance(value, Callable): value = value() - self.value = self.preprocess(DialogueModel(root=value)) if value is not None else value # type: ignore + self.value = ( + self.preprocess(DialogueModel(root=value)) if value is not None else value + ) # type: ignore def preprocess(self, payload: DialogueModel) -> str: """ @@ -102,7 +127,9 @@ def preprocess(self, payload: DialogueModel) -> str: formatter = self.formatter if not formatter: formatter = self.default_formatter - return self.separator.join([formatter(line.speaker, line.text) for line in payload.root]) + return self.separator.join( + [formatter(line.speaker, line.text) for line in payload.root] + ) @staticmethod def default_formatter(speaker: str, text: str) -> str: @@ -111,7 +138,7 @@ def default_formatter(speaker: str, text: str) -> str: @server async def format(self, value: list[dict]): """Format the dialogue in the frontend into a string that's copied to the clipboard.""" - data = DialogueModel(root=value) # type: ignore + data = DialogueModel(root=value) # type: ignore return self.preprocess(data) def postprocess(self, value): @@ -128,8 +155,13 @@ def as_example(self, value): return self.preprocess(DialogueModel(root=value)) def example_payload(self): - return [{"speaker": "Speaker 1", "text": "Hello, how are you?"}, {"speaker": "Speaker 2", "text": "I'm fine, thank you!"}] + return [ + {"speaker": "Speaker 1", "text": "Hello, how are you?"}, + {"speaker": "Speaker 2", "text": "I'm fine, thank you!"}, + ] def example_value(self): - return [{"speaker": "Speaker 1", "text": "Hello, how are you?"}, {"speaker": "Speaker 2", "text": "I'm fine, thank you!"}] - + return [ + {"speaker": "Speaker 1", "text": "Hello, how are you?"}, + {"speaker": "Speaker 2", "text": "I'm fine, thank you!"}, + ] diff --git a/js/dialogue/Dialogue.svelte b/js/dialogue/Dialogue.svelte index 0b9e692dda..2ceaab506a 100644 --- a/js/dialogue/Dialogue.svelte +++ b/js/dialogue/Dialogue.svelte @@ -1,8 +1,5 @@ - Date: Mon, 28 Apr 2025 14:21:57 -0400 Subject: [PATCH 06/42] lint --- gradio/components/dialogue.py | 4 ++-- js/dialogue/Dialogue.svelte | 2 +- js/dialogue/Index.svelte | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/gradio/components/dialogue.py b/gradio/components/dialogue.py index 05c9dedce5..c0423edaeb 100644 --- a/gradio/components/dialogue.py +++ b/gradio/components/dialogue.py @@ -113,8 +113,8 @@ def __init__( if isinstance(value, Callable): value = value() self.value = ( - self.preprocess(DialogueModel(root=value)) if value is not None else value - ) # type: ignore + self.preprocess(DialogueModel(root=value)) if value is not None else value # type: ignore + ) def preprocess(self, payload: DialogueModel) -> str: """ diff --git a/js/dialogue/Dialogue.svelte b/js/dialogue/Dialogue.svelte index 2ceaab506a..19f6c4c68a 100644 --- a/js/dialogue/Dialogue.svelte +++ b/js/dialogue/Dialogue.svelte @@ -309,7 +309,7 @@ />
- {#if !!!max_lines || (max_lines && i < max_lines - 1)} + {#if max_lines == undefined || (max_lines && i < max_lines - 1)}