mirror of
https://github.com/dzeiocom/components.git
synced 2025-04-22 10:52:16 +00:00
Added HideExternal to links
Signed-off-by: Avior <florian.bouillon@delta-wings.net>
This commit is contained in:
parent
7ddce9ec85
commit
8ac899b3f0
@ -34,7 +34,7 @@ export default class Footer extends React.Component<Props> {
|
||||
)}
|
||||
{this.props.socials && (
|
||||
<ul className={css.socials}>{this.props.socials.map((l, index) => (
|
||||
<li key={l.href}><Text><Link noStyle href={l.href}>
|
||||
<li key={l.href}><Text><Link hideIcon noStyle href={l.href}>
|
||||
{typeof l.icon === 'string' ? (
|
||||
<Image width={24} height={24} src={l.icon} />
|
||||
) : (
|
||||
|
@ -7,7 +7,9 @@ export default {
|
||||
component: Component,
|
||||
argTypes: {
|
||||
href: {control: 'text', defaultValue: 'https://www.dzeio.com'},
|
||||
text: {control: 'text', defaultValue: 'Dzeio'}
|
||||
text: {control: 'text', defaultValue: 'Dzeio'},
|
||||
external: {control: 'boolean'},
|
||||
hideIcon: {control: 'boolean'}
|
||||
}
|
||||
} as Meta
|
||||
|
||||
|
@ -19,23 +19,35 @@ interface Props {
|
||||
* Override external detection system
|
||||
*/
|
||||
external?: boolean
|
||||
|
||||
/**
|
||||
* force hiding the icon
|
||||
*/
|
||||
hideIcon?: boolean
|
||||
}
|
||||
|
||||
export default class Link extends React.Component<Props> {
|
||||
|
||||
public render() {
|
||||
const external = this.props.external ?? this.props.href.startsWith('http')
|
||||
if (external) {
|
||||
const isExternal = this.props.href.startsWith('http')
|
||||
const externalProps = this.props.external ? {
|
||||
rel: 'noreferrer nofollow',
|
||||
target: '_blank'
|
||||
} : {}
|
||||
|
||||
if (isExternal) {
|
||||
// external link
|
||||
return (
|
||||
<a
|
||||
{...this.props.linkProps}
|
||||
className={buildClassName(this.props.className, [css.link, !this.props.noStyle])}
|
||||
href={this.props.href}
|
||||
rel="noreferrer nofollow"
|
||||
target="_blank"
|
||||
{...externalProps}
|
||||
>
|
||||
{this.props.children}<ExternalLink size={16} className={css.icon} />
|
||||
{this.props.children}
|
||||
{(this.props.external !== false && !this.props.hideIcon) && (
|
||||
<ExternalLink size={16} className={css.icon} />
|
||||
)}
|
||||
</a>
|
||||
)
|
||||
}
|
||||
@ -43,6 +55,7 @@ export default class Link extends React.Component<Props> {
|
||||
<NextLink href={this.props.href}>
|
||||
<a
|
||||
{...this.props.linkProps}
|
||||
{...externalProps}
|
||||
className={buildClassName(this.props.className, [css.link, !this.props.noStyle])}
|
||||
>{this.props.children}</a>
|
||||
</NextLink>
|
||||
|
Loading…
x
Reference in New Issue
Block a user