<script setup>
import {ref} from 'vue'
import AisCheckboxGroup
  from '@/components/checkbox-group/AisCheckboxGroup.vue'

const options = ref([
  { label: 'John', value: 'john-lennon', icon: 'person', disabled: false },
  { label: 'Paul', value: 'paul-mccartney', icon: 'person', disabled: false },
  { label: 'George', value: 'george-harrison', icon: 'person', disabled: false },
  { label: 'Ringo', value: 'ringo-starr', icon: 'person', disabled: false },
  { label: 'Pete', value: 'pete-best', icon: 'person', disabled: true },
])
const selections = ref([])
</script>

<template>
  <div class="grid gap-4">
    <AisCheckboxGroup
        class="px-4"
        :options="options"
        v-model="selections"
        labelKey="label"
    />
    <div class="p-4 bg-ui-gray-50 border rounded">
      Selection: {{ selections }}
    </div>
  </div>
</template>
