Image upload widget

This commit is contained in:
space-nuko
2023-05-08 18:08:28 -05:00
parent 5feffcfa17
commit 0f50dbae87
15 changed files with 380 additions and 48 deletions

View File

@@ -3,6 +3,7 @@
import { Block, BlockLabel, Empty } from "@gradio/atoms";
import { Gallery } from "@gradio/gallery";
import { Image } from "@gradio/icons";
import { StaticImage } from "@gradio/image";
import type { Styles } from "@gradio/utils";
import type { WidgetLayout } from "$lib/stores/layoutState";
import type { Writable } from "svelte/store";
@@ -38,7 +39,7 @@
let style: Styles = {
grid_cols: [4],
grid_rows: [4],
// object_fit: "cover",
object_fit: "cover",
}
let element: HTMLDivElement;
@@ -126,24 +127,21 @@
{#if widget && node && nodeValue && $nodeValue != null}
{#if widget.attrs.variant === "image"}
<div class="wrapper comfy-image-widget" style="height: {widget.attrs.height || 'auto'}" bind:this={element}>
<div class="wrapper comfy-image-widget" style={widget.attrs.style || ""} bind:this={element}>
<Block variant="solid" padding={false}>
{#if widget.attrs.title}
<BlockLabel
show_label={true}
Icon={Image}
label={widget.attrs.title || "Image"}
/>
{/if}
{#if $nodeValue.length > 0}
<img src={$nodeValue[$nodeValue.length-1].data}/>
<StaticImage
value={$nodeValue[$nodeValue.length-1].data}
show_label={widget.attrs.title != ""}
label={widget.attrs.title}
/>
{:else}
<Empty size="large" unpadded_box={true}><Image /></Empty>
{/if}
</Block>
</div>
{:else}
<div class="wrapper comfy-gallery-widget gradio-gallery" bind:this={element}>
<div class="wrapper comfy-gallery-widget gradio-gallery" style={widget.attrs.style || ""} bind:this={element}>
<Block variant="solid" padding={false}>
<div class="padding">
<Gallery