Link

Used for creating links.

Install
npm install @pluralsight/ps-design-system-link
Import
import Link from '@pluralsight/ps-design-system-link'

Examples

Links are used to embed actions or pathways to more information within a sentence.

The Link component simply styles the child element that you pass to it. You bring all your own semantics or links that support client-side routing.

import React from 'react'
import Link from '@pluralsight/ps-design-system-link'

const Comp = () => (
  <div className="example-flex-column">
    <p>
      Lorem ipsum dolor sit amet{' '}
      <Link>
        <a href="https://duckduckgo.com">basic link</a>
      </Link>{' '}
      nisi ut aliquip ex ea commodo consequat.
    </p>
    <p>
      Lorem ipsum dolor sit amet{' '}
      <Link appearance={Link.appearances.subtle}>
        <a href="https://duckduckgo.com">subtle link</a>
      </Link>{' '}
      nisi ut aliquip ex ea commodo consequat.
    </p>
  </div>
)

export default Comp

Accessibility

WCAG 2.1 AA Compliance

100% axe-core tests

Manual audit

WAI-ARIA Patterns: Link

Props

Name	Type	Description	Default
`appearance`	`default \| subtle`	visual style (from Link.appearances)	`default`