Files
simrsx-fe/app/components/layout/SidebarNavLink.vue
2025-09-22 13:53:40 +07:00

43 lines
1.1 KiB
Vue

<script setup lang="ts">
import type { SidebarMenuButtonVariants } from '~/components/pub/ui/sidebar'
import { useSidebar } from '~/components/pub/ui/sidebar'
withDefaults(
defineProps<{
item: any
size?: SidebarMenuButtonVariants['size']
}>(),
{
size: 'default',
},
)
const { setOpenMobile } = useSidebar()
</script>
<template>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton as-child :tooltip="item.title" :size="size" class="">
<NuxtLink
:to="item.link"
class="group flex items-center gap-3 rounded-lg px-2 py-4 text-sm transition-all duration-200"
active-class="bg-primary text-white"
@click="setOpenMobile(false)"
>
<Icon :name="item.icon || ''" mode="svg" />
<span class="mx-1">{{ item.title }}</span>
<span
v-if="item.new"
class="bg-#adfa1d rounded-md px-1.5 py-0.5 text-xs leading-none text-black no-underline group-hover:no-underline"
>
New
</span>
</NuxtLink>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</template>
<style scoped></style>