@uswds/web-components/dist/components/usa-link.js

> [!CAUTION] > Work on the next version of the Design System is happening in this repo. The code in this repository is not yet ready for production use.

var l = Object.defineProperty;
var h = (t, e, s) => e in t ? l(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
var o = (t, e, s) => h(t, typeof e != "symbol" ? e + "" : e, s);
import { css as a, LitElement as n, html as r } from "lit";
const c = a`
  :host {
    a {
      color: var(--theme-link-color, #005ea2);
      text-decoration: underline;
    }
    a:visited {
      color: var(--theme-link-visited-color, #54278f);
    }

    a:hover {
      color: var(--theme-link-hover-color, #1a4480);
    }

    a:active {
      color: var(--theme-link-active-color, #162e51);
    }

    a:focus {
      /* @include focus-outline; */
      outline: var(--theme-focus-width, 0.25rem) var(--theme-focus-style, solid)
        var(--theme-focus-color, #2491ff);
      outline-offset: var(--theme-focus-offset, 0);
    }
  }
`;
class i extends n {
  hasLinkChild() {
    const e = this.querySelector("a");
    if (!e) return !1;
    this.href = e.href, this.slottedChildren = e, this.shadowRoot.appendChild(this.slottedChildren);
  }
  constructor() {
    super();
  }
  templateWithChildren() {
    return r`<a class="usa-link" href="${this.href}"
      >${this.slottedChildren}</a
    >`;
  }
  templateWithSlots() {
    return r`<a class="usa-link" href="${this.href}"><slot></slot></a>`;
  }
  render() {
    return this.hasLinkChild() ? this.templateWithChildren() : this.templateWithSlots();
  }
}
o(i, "styles", [c]), o(i, "properties", {
  href: {}
});
window.customElements.define("usa-link", i);
export {
  i as UsaLink
};