[paragon-openedx.netlify.app] Hyperlink should be compatible with React Router Link

[adamstankiewicz]

Improvements

Hyperlink is currently always a wrapper around the standard HTML anchor tag (i.e., <a>). As a result, it is not currently possible to use the Hyperlink component with a React Router Link for internal page routes within React applications.

Given this, consumers implementing links to internal page routes typically rely on Link directly, accepting a tradeoff that the Hyperlink component's built-in color and link variants are not applicable to the internal route link.

To mitigate this, Hyperlink should be extended to support an as prop similar to other components throughout the Paragon component library. This addition would allow consumers to render <Hyperlink as={Link} ... /> and still have consistently styled links even when the link used React routing for an internal page route.

Tasks

Beta Give feedback

1. Ensure Hyperlink accepts an as prop such that consumers can rely on React Router's Link component, i.e. <Hyperlink as={Link} destination="..." />.