internal/dashboard/frontend/src/components/Filter/FilterPill.vue

<script setup lang="ts">
const props = defineProps<{
  label: string;
}>();
</script>
<template>
  <div class="filter-item">
    {{ label }}
  </div>
</template>

<style scoped>
@reference "src/style.css";

.filter-item {
  @apply text-primary-300 flex cursor-pointer items-center gap-2 border border-r-0 border-stone-700 bg-stone-900/70 px-2 text-xs select-none;

  &:first-of-type {
    @apply rounded-l-full border-l;
  }

  &:last-of-type {
    @apply rounded-r-full border-r;
  }
}
</style>