daisyUI 3.0

src/components/ui/UITable.vue

@@ -1,12 +1,20 @@
 <script setup lang="ts">
 interface Props {
-  density?: 'compact'
+  size?: 'xs' | 'sm' | 'md' | 'lg'
 }
-const props = defineProps<Props>()
+const props = withDefaults(defineProps<Props>(), {
+  size: 'md'
+})
 
 const styleClass = computed(() => {
-  const densityClass = props.density ? 'dui-table-compact' : ''
-  return [densityClass]
+  const sizeVariants = {
+    'xs': 'dui-table-xs',
+    'sm': 'dui-table-sm',
+    'md': 'dui-table-md',
+    'lg': 'dui-table-lg',
+  }
+  const sizeClass = sizeVariants[props.size]
+  return [sizeClass]
 })
 </script>