# All files / js/components/ui/sidebar SidebarMenuButton.vue

0% Statements 0/10
0% Branches 0/6
0% Functions 0/5
0% Lines 0/10

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
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50

     <script setup lang="ts">
    import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
    import { type Component, computed } from 'vue'
    import SidebarMenuButtonChild, { type SidebarMenuButtonProps } from './SidebarMenuButtonChild.vue'
    import { useSidebar } from './utils'

    defineOptions({
      inheritAttrs: false,
    })

    const props = withDefaults(defineProps<SidebarMenuButtonProps & {
      tooltip?: string | Component
    }>(), {
      as: 'button',
      variant: 'default',
      size: 'default',
    })

    const { isMobile, state } = useSidebar()

    const delegatedProps = computed(() => {
      const { tooltip, ...delegated } = props
      return delegated
    })
    </script>

    <template>
      <SidebarMenuButtonChild v-if="!tooltip" v-bind="{ ...delegatedProps, ...$attrs }">
        <slot />
      </SidebarMenuButtonChild>

      <Tooltip v-else>
        <TooltipTrigger as-child>
          <SidebarMenuButtonChild v-bind="{ ...delegatedProps, ...$attrs }">
            <slot />
          </SidebarMenuButtonChild>
        </TooltipTrigger>
        <TooltipContent
          side="right"
          align="center"
          :hidden="state !== 'collapsed' || isMobile"
        >
          <template v-if="typeof tooltip === 'string'">
            {{ tooltip }}
          </template>
          <component :is="tooltip" v-else />
        </TooltipContent>
      </Tooltip>
    </template>