# Link

Renders a native anchor with safe, eligible same-origin SPA navigation.

Modified clicks, downloads, external URLs, non-HTTP(S) destinations, and
non-self targets retain browser behavior. Unsafe executable schemes are
rendered as `about:blank` and their clicks are canceled. A user click handler
runs first through DOM host event chaining; `preventDefault()` prevents the
internal navigation decision.

## Signatures

```ts
export declare function Link<const Options extends object>(options: Options, ..._: Options extends LinkOptions ? [
] : [
    "Link options must satisfy LinkOptions"
]): Fx.Fx<RenderEvent, LinkError<Options>, LinkServices<Options>>;
```

```ts
export declare function Link<const Options extends object, const Host extends HostResult>(options: Options, host: Dom.HostOverride<Dom.HostProps<HTMLAnchorElement>, Renderable.Any, Host>, ..._: Options extends LinkOptions ? [
] : [
    "Link options must satisfy LinkOptions"
]): Fx.Fx<RenderEvent, LinkError<Options> | Fx.Error<Host>, LinkServices<Options> | Fx.Services<Host>>;
```



## Examples

```ts
import { html } from "@typed/template";
import { Link } from "@typed/ui/Link";

export const AccountLinks = html`<nav aria-label="Account">
    ${Link({ href: "/account/profile", content: "Edit profile" })}
    ${Link({
      href: "/account/security",
      content: "Security settings",
      replace: false,
    })}
    ${Link({
      href: "https://www.w3.org/WAI/",
      content: "Accessibility resources (opens in a new tab)",
      props: { target: "_blank", rel: "noopener" },
    })}
  </nav>`;
```