this repo has no description
1<script setup lang="ts">
2import type { PrimitiveProps } from 'reka-ui'
3import type { HTMLAttributes } from 'vue'
4import { cn } from '@/lib/utils'
5import { Primitive } from 'reka-ui'
6
7const props = withDefaults(defineProps<PrimitiveProps & {
8 size?: 'sm' | 'md'
9 isActive?: boolean
10 class?: HTMLAttributes['class']
11}>(), {
12 as: 'a',
13 size: 'md',
14})
15</script>
16
17<template>
18 <Primitive
19 data-slot="sidebar-menu-sub-button"
20 data-sidebar="menu-sub-button"
21 :as="as"
22 :as-child="asChild"
23 :data-size="size"
24 :data-active="isActive"
25 :class="cn(
26 'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',
27 'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',
28 size === 'sm' && 'text-xs',
29 size === 'md' && 'text-sm',
30 'group-data-[collapsible=icon]:hidden',
31 props.class,
32 )"
33 >
34 <slot />
35 </Primitive>
36</template>