mirror of
https://github.com/gradio-app/gradio.git
synced 2025-01-06 10:25:17 +08:00
a966e9f753
* format' * add changeset * add story --------- Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com> Co-authored-by: Hannah <hannahblair@users.noreply.github.com>
90 lines
2.0 KiB
Svelte
90 lines
2.0 KiB
Svelte
<script>
|
|
import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
|
|
import MultimodalTextbox from "./Index.svelte";
|
|
</script>
|
|
|
|
<Meta
|
|
title="Components/MultimodalTextbox"
|
|
component={MultimodalTextbox}
|
|
argTypes={{
|
|
label: {
|
|
control: "text",
|
|
description: "The textbox label",
|
|
name: "label"
|
|
},
|
|
show_label: {
|
|
options: [true, false],
|
|
description: "Whether to show the label",
|
|
control: { type: "boolean" },
|
|
defaultValue: true
|
|
},
|
|
text_align: {
|
|
options: ["left", "right"],
|
|
description: "Whether to align the text left or right",
|
|
control: { type: "select" },
|
|
defaultValue: "left"
|
|
},
|
|
lines: {
|
|
options: [1, 5, 10, 20],
|
|
description: "The number of lines to display in the textbox",
|
|
control: { type: "select" },
|
|
defaultValue: 1
|
|
},
|
|
max_lines: {
|
|
options: [1, 5, 10, 20],
|
|
description:
|
|
"The maximum number of lines to allow users to type in the textbox",
|
|
control: { type: "select" },
|
|
defaultValue: 1
|
|
},
|
|
rtl: {
|
|
options: [true, false],
|
|
description: "Whether to render right-to-left",
|
|
control: { type: "boolean" },
|
|
defaultValue: false
|
|
}
|
|
}}
|
|
/>
|
|
|
|
<Template let:args>
|
|
<MultimodalTextbox {...args} />
|
|
</Template>
|
|
|
|
<Story
|
|
name="MultimodalTextbox with file and label"
|
|
args={{
|
|
value: {
|
|
text: "sample text",
|
|
files: [
|
|
{
|
|
path: "https://gradio-builds.s3.amazonaws.com/demo-files/ghepardo-primo-piano.jpg",
|
|
url: "https://gradio-builds.s3.amazonaws.com/demo-files/ghepardo-primo-piano.jpg",
|
|
orig_name: "cheetah.jpg"
|
|
}
|
|
]
|
|
},
|
|
label: "My simple label",
|
|
show_label: true
|
|
}}
|
|
/>
|
|
<Story
|
|
name="MultimodalTextbox with 5 lines and max 5 lines"
|
|
args={{ lines: 5, max_lines: 5 }}
|
|
/>
|
|
<Story name="Right aligned textbox" args={{ text_align: "right" }} />
|
|
<Story name="RTL textbox" args={{ rtl: true }} />
|
|
<Story
|
|
name="Single file upload"
|
|
args={{
|
|
file_count: "single",
|
|
value: {
|
|
text: "sample text",
|
|
files: [
|
|
{
|
|
path: "https://gradio-builds.s3.amazonaws.com/demo-files/ghepardo-primo-piano.jpg"
|
|
}
|
|
]
|
|
}
|
|
}}
|
|
/>
|