#Anchor (Text Link)

<Example>
  <Anchor href="/uilib/components/anchor">Default Style</Anchor>
</Example>
<Example>
  <Anchor href="/uilib/components/anchor" className="dnb-anchor--hover">
    Hover Style
  </Anchor>
</Example>
<Example>
  <Anchor href="/uilib/components/anchor" className="dnb-anchor--active">
    Active Style
  </Anchor>
</Example>
<Example>
  <Anchor href="/uilib/components/anchor" className="dnb-anchor--focus">
    Focus Style
  </Anchor>
</Example>

<ContrastExample>
  <Anchor
    href="/uilib/components/anchor"
    className="dnb-anchor--contrast"
  >
    Contrast Style
  </Anchor>
</ContrastExample>
<Example>
  <Anchor
    href="/uilib/components/anchor"
    className="dnb-anchor--no-underline"
  >
    No underline
  </Anchor>
</Example>
<Example>
  <Anchor
    target="_blank"
    href="/uilib/components/anchor"
    className="dnb-anchor--no-icon"
  >
    Blank target without launch icon
  </Anchor>
</Example>
<Example>
  <Anchor
    href="/uilib/components/anchor"
    className="dnb-anchor--no-hover"
  >
    No hover
  </Anchor>
</Example>
<Example>
  <Anchor
    href="/uilib/components/anchor"
    className="dnb-anchor--no-radius"
  >
    No border-radius
  </Anchor>
</Example>
<Example>
  <Anchor
    href="/uilib/components/anchor"
    className="dnb-anchor--no-animation"
  >
    No animation
  </Anchor>
</Example>
<Example>
  <Anchor
    href="/uilib/components/anchor"
    className="dnb-anchor--no-style"
  >
    Reset anchor style
  </Anchor>
</Example>
<Example>
  <button className="dnb-anchor">I'm a Button!</button>
</Example>
<Example>
  <Anchor href="/uilib/components/anchor">
    Newline <br />
    Newline
  </Anchor>
</Example>
<Example>
  <Anchor skeleton href="/uilib/components/anchor">
    Skeleton
  </Anchor>
</Example>

<Example>
  <Anchor
    href="/uilib/components/anchor"
    icon="chevron_right"
    iconPosition="right"
  >
    Anchor with Icon right
  </Anchor>
</Example>
<Example>
  <Anchor href="/uilib/components/anchor" icon="question">
    Anchor with Icon left
  </Anchor>
</Example>
<Example>
  <Anchor
    href="/uilib/components/anchor"
    icon={<IconPrimary icon="question" />}
  >
    Anchor with Icon left using a html/react element
  </Anchor>
</Example>
<Example>
  <P>
    text
    {' '}
    <Anchor
      href="/uilib/components/anchor"
      icon="bell"
      iconPosition="right"
      className="dnb-anchor--inline"
    >
      Inside a Paragraph
    </Anchor>
    {' '}
    text
  </P>
</Example>

<Example>
  <Anchor target="_blank" href="/uilib/components/anchor">
    Blank target with https
  </Anchor>
</Example>
<Example>
  <Anchor
    target="_blank"
    href="/uilib/components/anchor"
    icon="arrow_right"
    iconPosition="right"
  >
    Blank target with different launch icon
  </Anchor>
</Example>

<Example>
  <Anchor target="_blank" href="mailto:john.doe@email.com">
    Send a mail to: john.doe@email.com
  </Anchor>
</Example>
<Example>
  <Anchor target="_blank" href="tel:12345678">
    Make a phone call to: 12345678
  </Anchor>
</Example>
<Example>
  <Anchor target="_blank" href="sms:12345678">
    Send an SMS to: 12345678
  </Anchor>
</Example>

<Example>
  <H2>
    <Anchor
      href="/uilib/components/anchor"
      icon="bell"
      iconPosition="right"
    >
      Inside Headings
    </Anchor>{' '}
    H2
  </H2>
</Example>
<Example>
  <H2>
    <Anchor target="_blank" href="/uilib/components/anchor">
      Blank target in headings
    </Anchor>{' '}
    H2
  </H2>
</Example>

<Section spacing>
  <Anchor className="dnb-anchor--no-underline" href="https://dnb.no/">
    Anchor in Section without underline
  </Anchor>
</Section>