only render largestLabel stuff if largestLabel is passed in

This commit is contained in:
Sean Yesmunt 2020-04-17 16:33:02 -04:00
parent 88dbcf1e2e
commit adfc46e81a

View file

@ -94,7 +94,10 @@ const Button = forwardRef<any, {}>((props: Props, ref: any) => {
<span className="button__content"> <span className="button__content">
{icon && <Icon icon={icon} iconColor={iconColor} size={iconSize} />} {icon && <Icon icon={icon} iconColor={iconColor} size={iconSize} />}
{label && ( {!largestLabel && label && <span className="button__label">{label}</span>}
{/* largestLabel is used when a single button has two different labels based on hover state */}
{largestLabel && (
<div className="button__label" style={{ position: 'relative' }}> <div className="button__label" style={{ position: 'relative' }}>
<div <div
style={{ style={{
@ -156,7 +159,7 @@ const Button = forwardRef<any, {}>((props: Props, ref: any) => {
return ( return (
<NavLink <NavLink
exact exact
onClick={(e) => { onClick={e => {
e.stopPropagation(); e.stopPropagation();
}} }}
to={`/$/${PAGES.AUTH}?redirect=${pathname}`} to={`/$/${PAGES.AUTH}?redirect=${pathname}`}
@ -176,7 +179,7 @@ const Button = forwardRef<any, {}>((props: Props, ref: any) => {
to={path} to={path}
title={title} title={title}
disabled={disabled} disabled={disabled}
onClick={(e) => { onClick={e => {
e.stopPropagation(); e.stopPropagation();
if (onClick) { if (onClick) {
onClick(); onClick();
@ -194,7 +197,7 @@ const Button = forwardRef<any, {}>((props: Props, ref: any) => {
title={title} title={title}
aria-label={description || label || title} aria-label={description || label || title}
className={combinedClassName} className={combinedClassName}
onClick={(e) => { onClick={e => {
if (onClick) { if (onClick) {
e.stopPropagation(); e.stopPropagation();
onClick(e); onClick(e);