<script setup lang="ts">
import { computed } from "vue";
import { cn } from "../../lib/cn";

const props = withDefaults(defineProps<{ variant?: "default" | "secondary" | "warning" }>(), {
  variant: "default"
});

const classes = computed(() => cn("ui-badge", `ui-badge--${props.variant}`));
</script>

<template>
  <span :class="classes"><slot /></span>
</template>
