Hyperlink

Hyperlink Props API

destination
string Required
specifies the URL
children
node Required
Content of the hyperlink
className
string
Custom class names for the hyperlink
target
string
specifies where the link should open. The default behavior is _self, which means that the URL will be loaded into the same browsing context as the current one. If the target is _blank (opening a new window) rel='noopener' will be added to the anchor tag to prevent any potential reverse tabnabbing attack.
Default'_self'
onClick
func
specifies the callback function when the link is clicked
Default() => {}
externalLinkAlternativeText
isRequiredIf( PropTypes.string, props => props.target === '_blank', )
specifies the text for links with a _blank target (which loads the URL in a new browsing context).
Default'in a new tab'
externalLinkTitle
isRequiredIf( PropTypes.string, props => props.target === '_blank', )
specifies the title for links with a _blank target (which loads the URL in a new browsing context).
Default'Opens in a new tab'
variant
enum'default' | 'muted' | 'brand'
type of hyperlink
Default'default'
isInline
bool
specify the link style. By default it will be underlined.
Defaultfalse
showLaunchIcon
bool
specify if we need to show launch Icon. By default it will be visible.
Defaulttrue

Paragon Design System