Skip to content
W WRNexusJS
core component

Link

Reusable link component.

@wrnexus/ui 0.2.674 props0 slots0 events

Usage

Components are auto-discovered. Use the component directly in any .wrn view:

<Link
  href="#"
  label="Link"
  external="false"
/>

Legacy mount name: data-component="Link".

Props and attributes

PropTypeRequirementDefault
hrefstringOptional"#"
labelstringOptional"Link"
externalbooleanOptionalfalse
classNamestringOptional""

Slots

This component does not declare a slot.

Events

This component does not declare a custom event.

Source contract

Installed source: components/Link.wrn

component Link {
  props {
    href = "#"
    label = "Link"
    external = false
    className = ""
  }
  view {
        <a href="{href}" target="{external ? '_blank' : ''}" rel="{external ? 'noreferrer' : ''}" class="font-medium text-violet-600 underline-offset-4 transition hover:text-violet-700 hover:underline focus-visible:rounded focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-violet-500 {className}">{label}<span data-show="external" aria-hidden="true"> ↗</span>
        </a>
    }
}