openedx / paragon

💎 An accessible, theme-ready design system built for learning applications and Open edX.

Home Page:https://paragon-openedx.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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

adamstankiewicz opened this issue · comments

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