Concorde UI component — Link. Link: Basic link with href attibute Doc ID: core/components/ui/link/link. Keywords: Concorde, supersoniks, core/components/ui/link/link, link, Link, UI component, sonic-link, web component. URL: https://concorde.supersoniks.org/crawl/core/components/ui/link/link.html.

Link

Href

<sonic-link href="/">Basic link with href attibute</sonic-link>

Target

<sonic-link href="/" target="_blank">Link with target attibute</sonic-link>

AutoActive

<sonic-link href="/#core/components"  class="[&[active]]:text-success">autoActive partial (default)</sonic-link>

AutoActive Strict vs partial

<div class="grid gap-3">
      <sonic-link href="/#core" autoActive="strict" class="[&[active]]:text-success">autoActive strict</sonic-link>
      <sonic-link href="/./link.html#link" autoActive="strict" class="[&[active]]:text-success">autoActive strict</sonic-link>
    </div>

AutoActive disabled

<sonic-link href="/./link.html#link" autoActive="disabled" class="[&[active]]:text-success">autoActive disabled</sonic-link>