43 lines
1.2 KiB
Vue
43 lines
1.2 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 md:!text-xs xl:!text-sm 2xl:!text-base"
|
|
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>
|