Svelte radio group rendered within the #each block

svelte-each-radio.svelte

<script>

  /*
    This is an adapted example where radio buttons are rendered from an array.
    I removed everything related to flavours for brevity (use {selectedScoops} instead of {scoops})
    https://svelte.dev/examples/group-inputs
  */

  let scoops = [
    { value: 1, text: "one" },
    { value: 2, text: "two" },
    { value: 3, text: "three" }
  ]

  // Make first radio button checked by default
  let selectedScoops = scoops[0].value;
</script>

{#each scoops as scoop}
  <label>
    <input 
      type=radio 
      name="scoops" 
      bind:group={selectedScoops} 
      value={scoop.value} 
    >
      {scoop.text} {scoop.value === 1 ? 'scoop' : 'scoops'}
  </label>
{/each}