# All files / js/components Icon.vue

0% Statements 0/7
100% Branches 0/0
0% Functions 0/2
0% Lines 0/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
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37

     <script setup lang="ts">
    import { cn } from '@/lib/utils';
    import * as icons from 'lucide-vue-next';
    import { computed } from 'vue';

    interface Props {
        name: string;
        class?: string;
        size?: number | string;
        color?: string;
        strokeWidth?: number | string;
    }

    const props = withDefaults(defineProps<Props>(), {
        class: '',
        size: 16,
        strokeWidth: 2,
    });

    const className = computed(() => cn('h-4 w-4', props.class));

    const icon = computed(() => {
        const iconName = props.name.charAt(0).toUpperCase() + props.name.slice(1);
        return (icons as Record<string, any>)[iconName];
    });
    </script>

    <template>
        <component
            :is="icon"
            :class="className"
            :size="size"
            :stroke-width="strokeWidth"
            :color="color"
        />
    </template>