shadcn-vue/apps/www/src/lib/registry/default/ui/radio-group/RadioGroupItem.vue
Anton Reshetov 7727c7282c
fix: radio group indicator fill (#280)
* fix: radio group indicator fill

---------

Co-authored-by: zernonia <zernonia@gmail.com>
2024-01-17 14:28:32 +08:00

30 lines
772 B
Vue

<script setup lang="ts">
import {
RadioGroupIndicator,
RadioGroupItem,
type RadioGroupItemProps,
} from 'radix-vue'
import { Circle } from 'lucide-vue-next'
import { cn } from '@/lib/utils'
const props = defineProps<RadioGroupItemProps & { class?: string }>()
</script>
<template>
<RadioGroupItem
v-bind="props"
:class="
cn(
'aspect-square h-4 w-4 rounded-full cursor-pointer flex justify-center items-center border border-primary disabled:cursor-not-allowed disabled:opacity-50',
props.class,
)
"
>
<RadioGroupIndicator
:class="cn('flex items-center justify-center', props.class)"
>
<Circle class="w-2.5 h-2.5 text-current fill-current" />
</RadioGroupIndicator>
</RadioGroupItem>
</template>