<script setup lang="ts">
import { Skeleton as ShadcnSkeleton } from '@/components/core/skeleton';
import { computed } from 'vue';
import type { UiSkeletonProps } from './types';

defineOptions({
  name: 'UiSkeleton',
});

const props = withDefaults(defineProps<UiSkeletonProps>(), {
  rounded: false,
});

const style = computed(() => ({
  width: props.width,
  height: props.height,
}));

const classes = computed(() => (props.rounded ? 'rounded-full' : ''));
</script>

<template>
  <ShadcnSkeleton :class="classes" :style="style" />
</template>
