diff --git a/components/link/link.tsx b/components/link/link.tsx index eef7cb3..5adcbaf 100644 --- a/components/link/link.tsx +++ b/components/link/link.tsx @@ -24,16 +24,16 @@ const defaultProps = { type NativeAttrs = Omit, keyof Props> export type LinkProps = Props & typeof defaultProps & NativeAttrs -const Link: React.FC> = React.memo(({ +const Link: React.FC> = React.memo(React.forwardRef(({ href, color, underline, pure, children, className, block, ...props -}) => { +}, ref: React.Ref) => { const theme = useTheme() const linkColor = color || block ? theme.palette.success : 'inherit' const padding = block ? theme.layout.gapQuarter : '0' const decoration = underline ? 'underline' : 'none' return ( - + {children} {!pure && } ) -}) +})) export default withDefaults(Link, defaultProps) diff --git a/pages/docs/components/link.mdx b/pages/docs/components/link.mdx index ed0232e..6099b71 100644 --- a/pages/docs/components/link.mdx +++ b/pages/docs/components/link.mdx @@ -1,5 +1,6 @@ import { Layout, Playground, Attributes } from 'lib/components' -import { Link, Text } from 'components' +import { Link, Text, Code } from 'components' +import NextLink from 'next/link' export const meta = { title: 'link', @@ -46,6 +47,16 @@ Hyperlinks between pages. The Evil Rabbit Jumped over the Fence. `} /> +With next/link} + desc="Use `Link` with NextJS without any configuration." + scope={{ Link, NextLink }} + code={` + + Docs of Button + +`} /> + Link.Props