@phase2/outline-core-link

outline-core-link

The Outline Core Link component

Properties

Property	Type	Description
linkHref	string	Link url
linkRel	LinkRelType	Link rel
linkTarget	LinkTargetType	Link target
linkText	string	Link text

Methods

Method	Type	Description
isURLExternal	(url: string): boolean	Check to see if the link is external, pass target="_blank" and rel="external" if so. Returns true if the link is external.
linkRelRender	(): string | undefined	You can override Rel manually, but if not, we'll set it to "noreferrer noopener" if the link is external. Tabnabbing vulnerability 🤯 TLDR: when a link has the attribute target="_blank", always add ref="noreferrer noopener" https://cheatsheetseries.owasp.org/cheatsheets/HTML5_Security_Cheat_Sheet.html#tabnabbing
linkTargetRender	(): string | undefined	You can override target manually, but if not, we'll set it to "_blank" if the link is external.

Slots

Name	Description
	The default slot for this element.

CSS Custom Properties

Property	Description
--outline-core-link-color	default: The default link color.
--outline-core-link-color-default	decoration: Text decoration for the default link.
--outline-core-link-color-hover	decoration: Text decoration for the link when hovering.
--outline-core-link-transition	property: The CSS transition property to use for the link.
--outline-core-link-transition-timing	function: The CSS transition timing function to use for the link.

outline-core-link

The Outline Core Link component

Properties

Property	Attribute	Type	Description
linkHref	link-href	string	Link url
linkRel	link-rel	LinkRelType	Link rel
linkTarget	link-target	LinkTargetType	Link target
linkText	link-text	string	Link text

Methods

Method	Type	Description
isURLExternal	(url: string): boolean	Check to see if the link is external, pass target="_blank" and rel="external" if so. Returns true if the link is external.
linkRelRender	(): string | undefined	You can override Rel manually, but if not, we'll set it to "noreferrer noopener" if the link is external. Tabnabbing vulnerability 🤯 TLDR: when a link has the attribute target="_blank", always add ref="noreferrer noopener" https://cheatsheetseries.owasp.org/cheatsheets/HTML5_Security_Cheat_Sheet.html#tabnabbing
linkTargetRender	(): "_blank" | "_self" | "_parent" | "_top" | undefined	You can override target manually, but if not, we'll set it to "_blank" if the link is external.

Slots

Name	Description
	The default slot for this element.

CSS Custom Properties

Property	Description
--outline-core-link-color	default: The default link color.
--outline-core-link-color-default	decoration: Text decoration for the default link.
--outline-core-link-color-hover	decoration: Text decoration for the link when hovering.
--outline-core-link-transition	property: The CSS transition property to use for the link.
--outline-core-link-transition-timing	function: The CSS transition timing function to use for the link.