Direction link

Direction links are links which communicate flow to other parts of a page or process.

import { ... } from '@ag.ds-next/react/direction-link';

Usage

Direction link components can be imported via the direction-link entrypoint in the @ag.ds-next/react package.

For example:

import { ... } from '@ag.ds-next/react/direction-link';

DirectionLink Props
Prop	Type	Description
direction	Direction	The direction of the link.
aria-label?	string	Describes the anchor element to assistive technologies.
children?	ReactNode
download?	any	Causes the browser to treat the linked URL as a download.
href?	string	The URL that the hyperlink points to.
id?	string	The ID of the hyperlink.
referrerPolicy?	HTMLAttributeReferrerPolicy	How much of the referrer to send when following the link.
rel?	string	The relationship of the linked URL as space-separated link types.
role?	AriaRole	WAI-ARIA role.
target?	HTMLAttributeAnchorTarget	Where to display the linked URL, as the name for a browsing context (a tab, window, or <iframe>).

DirectionButton Props
Prop	Type	Description
direction	Direction	The direction of the link.
aria-controls?	string	Identifies the element (or elements) whose contents or presence are controlled by the current element.
aria-describedby?	string	Identifies the element (or elements) that describes the object.
aria-expanded?	Booleanish	Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.
aria-label?	string	Describes the button element to assistive technologies.
children?	ReactNode
disabled?	boolean	When true, prevents onClick from firing.
id?	string	Defines an identifier (ID) which must be unique.
onBlur?	FocusEventHandler<HTMLButtonElement>	Function to be fired following a blur event of the button.
onClick?	MouseEventHandler<HTMLButtonElement>	Function to be fired following a click event of the button.
onFocus?	FocusEventHandler<HTMLButtonElement>	Function to be fired following a focus event of the button.
onKeyDown?	KeyboardEventHandler<HTMLButtonElement>	Function to be fired following a keydown event of the button.
role?	AriaRole	WAI-ARIA role.
tabIndex?	number	The `tabIndex` attribute of the button.
type?	"button" \| "reset" \| "submit"	The `type` attribute of the button.

You can view the full source code for this package on Github.