ImageUploader
Allows to upload and represent images.
Example
Example.svelte
<script lang="ts">
import { ImageUploader } from "saraui"
let state: File | undefined = undefined
//or you can init the state and you'll have an image placeholder
</script>
<ImageUploader bind:state
name="profilePicture"
acceptedFileExtensions=".jpg, .png, .heic, .avif"
/>
Props
color?:
"primary" | "secondary" | "accent" | "neutral" | "info" | "success" | "warning" | "error"
rounded?:
"none" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "full"
acceptedFileExtensions?:
string
isEditable?:
boolean
name?:
string
name is used to identify the file in a FormData value
state?:
File
you can use this prop to add a placeholder or bind:state to get the file when selected
icon?:
Check Icons section IconClassString | SizedIcon
width?:
Check Tailwind's default spacing scale any posible default spacing value from Tailwind