Link

The Link component is a styled version of the normal HTML anchor element. It can be easily used with the Link component from react-router or wouter.

Import

// Tree shakable import
import { Link } from '@bojagi/pablo';
// Or direct import
import { Link } from '@bojagi/pablo/Link';

Examples

Plain link

The Link component supports all props a normal <a> component would do.

Live Editor

  <Link href="https://bojagi.io" target="_blank">Go to Bojagi</Link>

Result

Loading...

Using it together with react-router

You can use margin to give images a bit of space around them

import { Link } from '@bojagi/pablo/Link';
// This can also be the Link from gatsby or next
import { Link as RouterLink } from 'react-router-dom';

const InternalLink = props => <Link {...props} as={RouterLink} />

Props

Name	Type	Default Value	Required	Description

Box props

Name	Type	Default Value	Required	Description