mirror of
https://github.com/gradio-app/gradio.git
synced 2024-12-21 02:19:59 +08:00
b67115e8e6
* Create a Wasm-compatible <Image> component in @gradio/lite and use it in @gradio/image/example/Image.svelte * add changeset * Fix Image styling * Move js/wasm/svelte/Image.svelte -> js/image/static/Image.svelte * Shorten CSS class name * Create Wasm-compatible video components * add changeset * Move the Wasm-compatible `Image` from `static` to `shared` * Create Wasm-compatible audio components * Fix `resolve_wasm_src()` to return the passed `src` as-is when the URL is not HTTP or refering to remote * add changeset * Fix `resolve_wasm_src()` --------- Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
23 lines
514 B
Svelte
23 lines
514 B
Svelte
<script lang="ts">
|
|
import type { HTMLImgAttributes } from "svelte/elements";
|
|
type $$Props = HTMLImgAttributes;
|
|
|
|
import { resolve_wasm_src } from "@gradio/wasm/svelte";
|
|
|
|
export let src: HTMLImgAttributes["src"] = undefined;
|
|
</script>
|
|
|
|
{#await resolve_wasm_src(src) then resolved_src}
|
|
<!-- svelte-ignore a11y-missing-attribute -->
|
|
<img src={resolved_src} {...$$restProps} />
|
|
{:catch error}
|
|
<p style="color: red;">{error.message}</p>
|
|
{/await}
|
|
|
|
<style>
|
|
img {
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
}
|
|
</style>
|