Link
Allows user to get our customized anchor element.
version
5.0.0-alpha.32
install
yarn add @welcome-ui/link
usage
import { Link } from '@welcome-ui/link'
About #
A link component who can get as
property to pass custom linker.
This component is a child from UniversalLink
component.
Variants #
Can be primary
by default or secondary
Disabled #
Add disabled
property
What is underlined by default? #
Link
will add an underline to text nodes, Text
components, span
tags, components with as="span"
or tagName="span"
& children with data-wui-link
prop
Security #
For a target _blank
we add rel='noopener noreferrer'
External link #
isExternal
add an <ExternalLink />
icon, and add special effect on hover.
With a Text component #
By default link is set to medium on fontWeight, you can force inherit to get the parent style.
Usage with React Router #
import { Link as RouterLink } from 'react-router-dom'<Link as={RouterLink} to="/jobs">Jobs</Link>
Properties #
Name | Type(s) | Default | Required |
---|---|---|---|
variant | "primary" "secondary" | ||
isExternal | Boolean | ||
disabled | Boolean | ||
target | string & {} "_self" "_blank" "_parent" "_top" |
Packages #
Dependencies #
Peer dependencies #
Previous
DropdownMenuNext
Pagination