HeaderPopoverLinks

A list of links displayed in a header Popover.

This component is used internally in the #panel slot of the HeaderLinks component, it's unlikely you'll need to use it directly.

Usage

<script setup lang="ts">
const links = [{
  label: 'Features',
  to: '/pro#features',
  exactHash: true,
  icon: 'i-heroicons-beaker',
  description: 'Discover all the features of Nuxt UI Pro.'
}, {
  label: 'Pricing',
  to: '/pro#pricing',
  exactHash: true,
  icon: 'i-heroicons-shopping-cart',
  description: 'A simple pricing, for solo developers or teams.'
}, {
  label: 'Guide',
  to: '/pro/guide',
  icon: 'i-heroicons-book-open',
  description: 'Learn how to use Nuxt UI Pro in your app.'
}, {
  label: 'Components',
  to: '/pro/components',
  icon: 'i-heroicons-cube-transparent',
  description: 'Discover all the components available in Nuxt UI Pro.'
}]

</script>

<template>
  <UHeaderPopoverLinks :links="links" />
</template>

Props

ui
any
links
Link[]