<script setup>
import { ref } from 'vue'
import BaseRadio from '@/components/radio/BaseRadio.vue'

let options = ref(['One', 'Two', 'Three', 'Four'])
let selection = ref('Three')
</script>

<template>
  <div class="grid gap-4">
    <div class="flex gap-8 mx-4">
      <label v-for="option in options"
             class="text-lg font-semibold font-sans
                 flex gap-2.5 items-center">
        <BaseRadio v-model="selection"  :value="option" />
        <span>{{option}}</span>
      </label>
    </div>

    <div class="bg-ui-gray-50 border rounded p-4">
      Selection: {{selection}}
    </div>
  </div>
</template>

