gradio/js/image/Image.stories.svelte
pngwn 1419538ea7
Refactor component directories (#5074)
* asd

* changes

* fix everything

* cleanup

* add changeset

* fix casing

* lockfile

* fix casing

* fix ci, enable linting

* fix test

* add changeset

* add changeset

* delete changeset

* fix dirs

* fix casing

* fix notebooks

* fix casing

* fix casing

* fix casing

* fix casing

* fix casing

* fix casing

* fix casing

* fix casing

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
2023-08-03 23:01:18 +01:00

51 lines
1.1 KiB
Svelte

<script>
import { Meta, Template, Story } from "@storybook/addon-svelte-csf";
import StaticImage from "./static";
</script>
<Meta
title="Components/Image"
component={Image}
argTypes={{
value: {
control: "text",
description: "The image URL or file to display",
name: "value",
value: "https://i.ibb.co/6BgKdSj/groot.jpg"
},
show_download_button: {
options: [true, false],
description: "If false, the download button will not be visible",
control: { type: "boolean" },
defaultValue: true
}
}}
/>
<Template let:args>
<div
class="image-container"
style="width: 300px; position: relative;border-radius: var(--radius-lg);overflow: hidden;"
>
<StaticImage {...args} />
</div>
</Template>
<Story
name="Static Image with label and download button"
args={{
value: "https://i.ibb.co/6BgKdSj/groot.jpg",
show_label: true,
show_download_button: true
}}
/>
<Story
name="Static Image with no label or download button"
args={{
value: "https://i.ibb.co/6BgKdSj/groot.jpg",
show_label: false,
show_download_button: false
}}
/>