fix: scroll form error into view on product create failure
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
c132bc836f
commit
2b73dc63ac
1 changed files with 9 additions and 1 deletions
|
|
@ -5,6 +5,14 @@
|
|||
import ProductForm from '$lib/components/ProductForm.svelte';
|
||||
|
||||
let { form }: { form: ActionData } = $props();
|
||||
|
||||
let errorEl: HTMLDivElement | undefined = $state();
|
||||
|
||||
$effect(() => {
|
||||
if (form?.error && errorEl) {
|
||||
errorEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<svelte:head><title>New Product — innercontext</title></svelte:head>
|
||||
|
|
@ -16,7 +24,7 @@
|
|||
</div>
|
||||
|
||||
{#if form?.error}
|
||||
<div class="rounded-md bg-destructive/10 px-4 py-3 text-sm text-destructive">
|
||||
<div bind:this={errorEl} class="rounded-md bg-destructive/10 px-4 py-3 text-sm text-destructive">
|
||||
{form.error}
|
||||
</div>
|
||||
{/if}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue