diff options
author | Fabio Berger <me@fabioberger.com> | 2018-09-26 20:37:25 +0800 |
---|---|---|
committer | Fabio Berger <me@fabioberger.com> | 2018-09-26 20:37:25 +0800 |
commit | a9b4027dc49b601af26f9ab1be2d97b32d46b073 (patch) | |
tree | aa69f8cbd1cdd3962e7eac704bf687b28acf5194 /packages/website/ts/components/ui/link.tsx | |
parent | 3504e875ccd201f623fa8f54f359b67b29b13d6f (diff) | |
download | dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.tar dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.tar.gz dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.tar.bz2 dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.tar.lz dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.tar.xz dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.tar.zst dexon-0x-contracts-a9b4027dc49b601af26f9ab1be2d97b32d46b073.zip |
Create a link ui component that abstracts away interval vs. internal links
Diffstat (limited to 'packages/website/ts/components/ui/link.tsx')
-rw-r--r-- | packages/website/ts/components/ui/link.tsx | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/packages/website/ts/components/ui/link.tsx b/packages/website/ts/components/ui/link.tsx new file mode 100644 index 000000000..252199457 --- /dev/null +++ b/packages/website/ts/components/ui/link.tsx @@ -0,0 +1,42 @@ +import * as React from 'react'; +import { Link as ReactRounterLink } from 'react-router-dom'; + +export interface LinkProps { + to: string; + isExternal?: boolean; + shouldOpenInNewTab?: boolean; + style?: React.CSSProperties; + className?: string; +} + +export const Link: React.StatelessComponent<LinkProps> = ({ + style, + className, + isExternal, + to, + shouldOpenInNewTab, + children, +}) => { + if (isExternal) { + return ( + <a target={shouldOpenInNewTab && '_blank'} className={className} style={style} href={to}> + {children} + </a> + ); + } else { + return ( + <ReactRounterLink to={to} className={className} style={style}> + {children} + </ReactRounterLink> + ); + } +}; + +Link.defaultProps = { + isExternal: false, + shouldOpenInNewTab: false, + style: {}, + className: '', +}; + +Link.displayName = 'Link'; |