gradio/js/image
Hannah 73268ee2e3
Improve source selection UX (#6766)
* Add new source option styling for pasting from clipboard
Use SourceSelect in Image component

* prevent device selection cut off
tweak source selection ux

* Check for dupe sources in source selection
Set sources[0] to active_source in Image

* tweaks

* tweak

* add image interaction test

* more tests

* improve light/dark mode color contrast

* add changeset

* remove unused prop

* add no device found placeholder
change T<sources> -> T<source_types>

* style tweak

* allow pasting on click + add e2e test

* fix e2e tests

* formatting

* add timeout to e2e test

* tweak

* tweak test

* change `getByLabel` to `getByText`

* value tweak

* logic tweak

* test

* formatting

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
2023-12-19 19:24:08 +00:00
..
shared Improve source selection UX (#6766) 2023-12-19 19:24:08 +00:00
CHANGELOG.md chore: update versions (#6797) 2023-12-15 15:39:46 -08:00
Example.svelte Remove the styles from the Image/Video primitive components and Fix the container styles (#6726) 2023-12-11 23:15:02 +01:00
Image.stories.svelte Improve source selection UX (#6766) 2023-12-19 19:24:08 +00:00
Image.test.ts Version 4 development branch (#5498) 2023-10-31 04:46:02 +00:00
Index.svelte Improve source selection UX (#6766) 2023-12-19 19:24:08 +00:00
package.json chore: update versions (#6797) 2023-12-15 15:39:46 -08:00
README.md Version 4 development branch (#5498) 2023-10-31 04:46:02 +00:00

@gradio/image

<script>
	import { BaseImageUploader, BaseStaticImage, Webcam, BaseExample } from "@gradio/image";
</script>

BaseImageUploader

	export let sources: ("clipboard" | "webcam" | "upload")[] = [
		"upload",
		"clipboard",
		"webcam"
	];
	export let streaming = false;
	export let pending = false;
	export let mirror_webcam: boolean;
	export let selectable = false;
	export let root: string;
	export let i18n: I18nFormatter;

BaseStaticImage

	export let value: null | FileData;
	export let label: string | undefined = undefined;
	export let show_label: boolean;
	export let show_download_button = true;
	export let selectable = false;
	export let show_share_button = false;
	export let root: string;
	export let i18n: I18nFormatter;

Webcam

	export let streaming = false;
	export let pending = false;

	export let mode: "image" | "video" = "image";
	export let mirror_webcam: boolean;
	export let include_audio: boolean;
	export let i18n: I18nFormatter;

BaseExample

	export let value: string;
	export let samples_dir: string;
	export let type: "gallery" | "table";
	export let selected = false;