Anchor

Anchor component that automatically handles external links.

  • Add rel="noopener noreferrer" on absolute href
  • Add target="_blank" on absolute href

Usage

useAnchorProps

The useAnchorProps hook let you obtain accessible anchor props.

const props = useAnchorProps({ href: "https://google.com" });
// output: { target: '_blank', rel: 'noopener noreferrer', href: 'https://google.com' }

Anchor component

import { Anchor } from "swash/Anchor";

export const Example = () => {
  return <Anchor href="https://google.com">Go to Google</Anchor>;
};