<script lang="ts">
	import BFormOption from "./BFormOption.svelte";
	import BFormParameter from "./BFormParameter.svelte";
  
  export let value: number | null;

  function toggle() {
    if (value === null) {
      value = 20;
    } else {
      value = null;
    }
  }
</script>

<BFormOption on:click={toggle} icon="temperature_half" state={(value !== null) || null}>
  {#if value != null}
    <BFormParameter type="number" label="Celsius" bind:value={value} min={10} max={32} step={1} narrower />
  {/if}
</BFormOption>