contract-front/uni_modules/lime-radio/components/l-radio-group/l-radio-group.uvue

<template>
	<view class="l-radio-group" :class="'l-radio-group--'+ direction">
		<slot />
	</view>
</template>
<script lang="uts" setup>
	import { RadioGroupProps } from './type';
	
	const emit = defineEmits(['change', 'update:modelValue'])
	const props = withDefaults(defineProps<RadioGroupProps>(), {
		allowUncheck: false,
		disabled: false,
		direction: 'horizontal'
		// size: 'medium'
	})
	const innerValue = ref<any|null>(null);
	const groupValue = computed({
		set(value: any|null) {
			innerValue.value = value
			emit('update:modelValue', value)
			emit('change', value)
		},
		get():any|null {
			return props.value ?? props.modelValue ?? props.defaultValue ?? innerValue.value
		}
	} as WritableComputedOptions<any|null>)
	
	const handleRadioChange = (val: any) => {
		if (props.allowUncheck && val == groupValue.value) {
			groupValue.value = ''
		} else {
			groupValue.value = val
		}
	}
	provide('limeRadioGroupProps', props)
	provide('limeRadioGroupValue', groupValue)
	provide('limeRadioGroupChange', handleRadioChange)
	
</script>
<style lang="scss">
	.l-radio-group {
		flex-direction: row;
	}

	.l-radio-group--vertical {
		flex-direction: column;
	}
</style>