mirror of
https://github.com/nikdoof/pocket-id.git
synced 2025-12-17 03:49:33 +00:00
feat: add ability to upload a profile picture (#244)
This commit is contained in:
27
frontend/src/lib/components/form/file-input.svelte
Normal file
27
frontend/src/lib/components/form/file-input.svelte
Normal file
@@ -0,0 +1,27 @@
|
||||
<script lang="ts">
|
||||
import { cn } from '$lib/utils/style';
|
||||
import type { HTMLInputAttributes } from 'svelte/elements';
|
||||
import type { VariantProps } from 'tailwind-variants';
|
||||
import type { buttonVariants } from '$lib/components/ui/button';
|
||||
|
||||
let {
|
||||
id,
|
||||
...restProps
|
||||
}: HTMLInputAttributes & {
|
||||
id: string;
|
||||
variant?: VariantProps<typeof buttonVariants>['variant'];
|
||||
} = $props();
|
||||
</script>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => document.getElementById(id)?.click()}
|
||||
class={cn(restProps.class)}
|
||||
>
|
||||
{#if restProps.children}
|
||||
{@render restProps.children()}
|
||||
{:else}
|
||||
Select File
|
||||
{/if}
|
||||
</button>
|
||||
<input {id} {...restProps} type="file" class="hidden" />
|
||||
Reference in New Issue
Block a user