w/src/lib/components/form/NumberInput.svelte
2024-12-24 05:01:19 +05:00

65 lines
1.2 KiB
Svelte

<script>
export let value = 0;
export let is_float = false;
export let min = 0;
export let max = 999999999;
export let step = "0.1";
export let is_required = true;
</script>
{#if is_float && is_required}
<input
type="number"
{min}
{max}
{step}
{value}
required
on:input={(e) => (value = parseFloat(e.target.value))}
class="w-full p-2 mx-2
border-2 border-black dark:border-none
bg-white dark:bg-black
text-black dark:text-white"
/>
{:else if is_float}
<input
type="number"
{min}
{max}
{step}
{value}
on:input={(e) => (value = parseFloat(e.target.value))}
class="w-full p-2 mx-2
border-2 border-black dark:border-none
bg-white dark:bg-black
text-black dark:text-white"
/>
{/if}
{#if !is_float && is_required}
<input
type="number"
{min}
{max}
{value}
required
on:input={(e) => (value = Number(e.target.value))}
class="w-full p-2 mx-2
border-2 border-black dark:border-none
bg-white dark:bg-black
text-black dark:text-white"
/>
{:else if !is_float}
<input
type="number"
{min}
{max}
{value}
on:input={(e) => (value = Number(e.target.value))}
class="w-full p-2 mx-2
border-2 border-black dark:border-none
bg-white dark:bg-black
text-black dark:text-white"
/>
{/if}