<template>
  <RadioValue
    :options="loader.data.value"
    :modelValue="modelValue"
    @update:modelValue="emits('update:modelValue', $event)"
    :disabled="disabled"
    v-bind="$attrs"
  />
</template>

<script lang="ts" setup>
import RadioValue from './RadioValue.vue';
import { useDataLoader } from '@/components/composeabe/DataLoader';
import type { RadioIdFieldOption, RadioIdFieldProps } from './RadioIdField';

const props = defineProps<RadioIdFieldProps & {
  modelValue?: number|string,
}>();
const loader = useDataLoader<RadioIdFieldOption[]>(async () => await props.loadData(), {
  immediate: true,
});
const emits = defineEmits([
  'update:modelValue',
]);

defineExpose({
  reload() {
    loader.load();
  }
})

</script>