28 lines
726 B
Svelte
28 lines
726 B
Svelte
<script lang="ts">
|
|
import BFormOption from "./BFormOption.svelte";
|
|
import BFormParameter from "./BFormParameter.svelte";
|
|
|
|
export let value: number | null;
|
|
|
|
function update(percentage: number) {
|
|
if (value !== null) {
|
|
value = percentage / 100;
|
|
}
|
|
}
|
|
|
|
function toggle() {
|
|
if (value === null) {
|
|
value = 0.50;
|
|
} else {
|
|
value = null;
|
|
}
|
|
}
|
|
|
|
let percentage: number
|
|
$: percentage = Math.round(Math.max(Math.min((value || 0) * 100, 100), 0));
|
|
$: update(percentage);
|
|
</script>
|
|
|
|
<BFormOption on:click={toggle} icon="cirlce_notch" state={(value !== null) || null}>
|
|
<BFormParameter type="number" label="%" bind:value={percentage} min={0} max={100} step={1} narrower />
|
|
</BFormOption> |