mirror of
https://github.com/gradio-app/gradio.git
synced 2024-12-27 02:30:17 +08:00
d112e2611b
* add preprocess param to highlighted_text.py * add params * static tweaks * add interactive highlight container * highlight selection logic * allow editing label value and move shared funcs * add changeset * remove py code * wait for input render * remove redundant event listeners * accessibility enhancements and remove label logic * add keyboard navigation and interaction * merge adjacent empty elements and split input element * add interactive support for scores mode * remove merge adjacent logic and move to frontend * tweak * add changeset * format backend * tweaks * backend test tweaks * set the interactive default to None * BE tweak * unit tests and stories * be formatting * fix label errors * tweak * fix tests * fix tests * fix test --------- Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com> Co-authored-by: Abubakar Abid <abubakar@huggingface.co>
102 lines
2.0 KiB
Svelte
102 lines
2.0 KiB
Svelte
<script>
|
|
import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
|
|
import HighlightedText from "./interactive/InteractiveHighlightedText.svelte";
|
|
import { Gradio } from "../app/src/gradio_helper";
|
|
</script>
|
|
|
|
<Meta title="Components/HighlightedText" component={HighlightedText} />
|
|
|
|
<Template let:args>
|
|
<HighlightedText
|
|
value={[
|
|
["zebras", "+"],
|
|
["dogs", "-"],
|
|
["elephants", "+"],
|
|
]}
|
|
gradio={new Gradio(
|
|
0,
|
|
document.body,
|
|
"light",
|
|
"1.1.1",
|
|
"http://localhost:7860"
|
|
)}
|
|
{...args}
|
|
/>
|
|
</Template>
|
|
|
|
<Story name="Highlighted Text" />
|
|
<Story name="Highlighted Text with legend" args={{ show_legend: true }} />
|
|
<Story name="Highlighted Text with label" args={{ label: "animals" }} />
|
|
<Story
|
|
name="Highlighted Text with new lines"
|
|
args={{
|
|
value: [["zebras", "+"], ["\n"], ["dogs", "-"], ["\n"], ["elephants", "+"]],
|
|
}}
|
|
/>
|
|
<Story
|
|
name="Highlighted Text with color map"
|
|
args={{ color_map: { "+": "green", "-": "red" } }}
|
|
/>
|
|
|
|
<Story
|
|
name="Highlighted Text with combine adjacent"
|
|
args={{
|
|
value: [
|
|
["The", null],
|
|
["quick", "adjective"],
|
|
[" sneaky", "adjective"],
|
|
["fox", "subject"],
|
|
[" jumped ", "past tense verb"],
|
|
["over the", null],
|
|
["lazy dog", "object"],
|
|
],
|
|
combine_adjacent: true,
|
|
}}
|
|
/>
|
|
|
|
<Story
|
|
name="Highlighted Text without combine adjacent"
|
|
args={{
|
|
value: [
|
|
["The", null],
|
|
["quick", "adjective"],
|
|
[" sneaky", "adjective"],
|
|
["fox", "subject"],
|
|
[" jumped ", "past tense verb"],
|
|
["over the", null],
|
|
["lazy dog", "object"],
|
|
],
|
|
}}
|
|
/>
|
|
|
|
<Story
|
|
name="Highlighted Text with combine adjacent and new lines"
|
|
args={{
|
|
value: [
|
|
["The", null],
|
|
["quick", "adjective"],
|
|
[" sneaky", "adjective"],
|
|
["fox", "subject"],
|
|
["\n"],
|
|
["jumped", "past tense verb"],
|
|
["\n"],
|
|
["over the", null],
|
|
["lazy dog", "object"],
|
|
],
|
|
combine_adjacent: true,
|
|
}}
|
|
/>
|
|
|
|
<Story
|
|
name="Highlighted Text in scores mode"
|
|
args={{
|
|
value: [
|
|
["the", -1],
|
|
["quick", 1],
|
|
["fox", 0.3],
|
|
],
|
|
|
|
show_legend: true,
|
|
}}
|
|
/>
|