41 lines
864 B
TypeScript
41 lines
864 B
TypeScript
import { useField } from 'vee-validate'
|
|
import { computed, ref, toRef } from 'vue'
|
|
import type { ComponentInternalInstance } from 'vue'
|
|
|
|
interface Props {
|
|
id: string
|
|
value: string | number
|
|
label?: string
|
|
disabled?: boolean
|
|
modelValue?: string | number
|
|
required?: boolean
|
|
}
|
|
|
|
export default (props: Props, slots: ComponentInternalInstance['slots']) => {
|
|
const { checked, handleChange } = useField(
|
|
toRef(props, 'id'),
|
|
computed(() => ({
|
|
required: props.required,
|
|
})),
|
|
{
|
|
type: 'radio',
|
|
initialValue: props.modelValue,
|
|
checkedValue: props.value,
|
|
syncVModel: true,
|
|
},
|
|
)
|
|
|
|
const focused = ref(false)
|
|
|
|
const active = computed(() => !props.disabled)
|
|
const hasLabel = computed(() => !!props.label || slots.default)
|
|
|
|
return {
|
|
focused,
|
|
active,
|
|
checked,
|
|
hasLabel,
|
|
handleChange,
|
|
}
|
|
}
|