All files / Components TagPill.vue

100% Statements 6/6
100% Branches 4/4
100% Functions 2/2
100% Lines 6/6

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24        40x         40x 40x       3x       40x   13x      
<script setup>
import { Link } from '@inertiajs/vue3';
import { computed } from 'vue';
 
const props = defineProps({
    name: { type: String, required: true },
    filterable: { type: Boolean, default: false },
});
 
const href = computed(() =>
    props.filterable ? `/prompts?tag=${encodeURIComponent(props.name)}` : null
);
 
const pillClasses =
    'inline-flex items-center rounded-full bg-slate-100 px-2 py-0.5 text-xs font-medium text-slate-600';
</script>
 
<template>
    <span v-if="!href" :class="pillClasses">{{ name }}</span>
    <Link v-else :href="href" :class="`${pillClasses} hover:bg-slate-200`">
        {{ name }}
    </Link>
</template>