<script setup>
import AisField from '@/components/field/AisField.vue'
import AisInput from '@/components/input/AisInput.vue'
import AisRadioGroup from '@/components/radio-group/AisRadioGroup.vue'
import { ref } from 'vue'

const field1 = ref('Hello World')
const sizes = ['sm', 'md', 'lg']
const selectedSize = ref('md')
</script>

<template>
  <div class="grid gap-4">
      <AisField label="Field Size">
        <AisRadioGroup v-model="selectedSize" :options="sizes" />
      </AisField>
      <AisField :size="selectedSize" label="Field 1">
        <AisInput v-model="field1"/>
      </AisField>
  </div>
</template>

