Files
2025-08-08 10:01:03 +08:00

1.7 KiB

title, icon, badges
title icon badges
Button Link lucide:external-link
value to target
Docus https://docus.dev/api/components#buttonlink _blank
value icon to target
Source lucide:code https://github.com/ZTL-UwU/shadcn-docs-nuxt/blob/main/components/content/ButtonLink.vue _blank
value
0.6.5

Usage

::stack ::div{class="p-3 flex gap-4"} ::button-link{right-icon="lucide:arrow-up-right" to="/getting-started" target="_blank"} Get Started :: ::button-link{left-icon="lucide:github" variant="outline" to="https://github.com/ZTL-UwU/shadcn-docs-nuxt" target="_blank"} GitHub :: ::button-link{left-icon="lucide:ghost" variant="ghost" href="https://github.com/ZTL-UwU/shadcn-docs-nuxt" blank} Ghost :: ::

::button-link{right-icon="lucide:arrow-up-right" to="/getting-started" target="_blank"}
  Get Started
::
::button-link{left-icon="lucide:github" variant="outline" to="https://github.com/ZTL-UwU/shadcn-docs-nuxt" target="_blank"}
  GitHub
::
::button-link{left-icon="lucide:ghost" variant="ghost" href="https://github.com/ZTL-UwU/shadcn-docs-nuxt" blank}
  Ghost
::

::

Props

::field-group :field{name="variant" type="'default' | 'secondary' | 'link' | 'destructive' | 'outline' | 'ghost'" default-value="'default'"} :field{name="size" type="'default' | 'icon' | 'sm' | 'xs' | 'lg'" default-value="'default'"} :field{name="leftIcon" type="string"}[Icon on the left] :field{name="rightIcon" type="string"}[Icon on the right] :field{name="to" type="string"}[Link URL] :field{name="href" type="string"}[Alias to to] :field{name="target" type="Target"}[A target attribute value to apply on the link] :field{name="blank" type="boolean"}[Alias to target='_blank'] ::