Link

const Preview = () => {
  const rand = useId();
  return (
    <Link href={'/no/patterns/external-links/' + rand}>Merking av lenker</Link>
  );
};

render(<Preview />)

const InText = () => {
  const rand = useId();

  return (
    <Paragraph>
      Vi bruker komponenter fra{' '}
      <Link href={'https://designsystemet.no?q=' + rand}>
        designsystemet.no
      </Link>
      .
    </Paragraph>
  );
};

render(<InText />)

const WithIcon = () => {
  return (
    <Link href='https://designsystemet.no/slack'>
      <Chat2Icon aria-hidden fontSize={24} />
      <span>Snakk med oss på Slack</span>
    </Link>
  );
};

render(<WithIcon />)

const Neutral = () => {
  const rand = useId();
  return (
    <Link href={'/no/fundamentals/privacy-policy' + rand} data-color='neutral'>
      Personvernerklæring
    </Link>
  );
};

render(<Neutral />)