33 lines
864 B
Svelte
33 lines
864 B
Svelte
<script lang="ts">
|
|
import Exclamation from '$lib/icons/Exclamation.svelte';
|
|
|
|
let { label = '', error = null, value, name, id, type = 'text'} = $props();
|
|
</script>
|
|
|
|
<div>
|
|
<label for={name} class="block text-sm font-medium leading-6 text-gray-900"
|
|
><span class="flex"
|
|
>{#if error}
|
|
<span class="inline-block mr-1"><Exclamation /></span>
|
|
{/if}
|
|
{label}</span
|
|
></label
|
|
>
|
|
<div class="mt-2">
|
|
<div
|
|
class="flex rounded-md shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-inset focus-within:ring-indigo-600"
|
|
>
|
|
<input
|
|
class="block flex-1 border-0 bg-transparent py-1.5 pl-1 text-gray-900 placeholder:text-gray-400 focus:ring-0 text-sm leading-6"
|
|
bind:value
|
|
{type}
|
|
{name}
|
|
{id}
|
|
/>
|
|
</div>
|
|
</div>
|
|
{#if error}
|
|
<p class="block text-sm leading-6 text-red-900 mt-2">{error}</p>
|
|
{/if}
|
|
</div>
|