opensource/grafana
1
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-07-29 17:02:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

UI/Button: Remove deprecated "link" variant (#49843)

Browse Source
This commit is contained in:
kay delaney
2022-05-31 09:40:03 +01:00
committed by GitHub
parent bfbe856319
commit 0012d2d81f
7 changed files with 12 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
packages/grafana-ui/src/components/Button/Button.tsx
View File

@ -10,7 +10,7 @@ import { ComponentSize } from '../../types/size';
import { getPropertiesForButtonSize } from '../Forms/commonStyles';
import { Icon } from '../Icon/Icon';
export type ButtonVariant = 'primary' | 'secondary' | 'destructive' | 'link';
export type ButtonVariant = 'primary' | 'secondary' | 'destructive';
export const allButtonVariants: ButtonVariant[] = ['primary', 'secondary', 'destructive'];
export type ButtonFill = 'solid' | 'outline' | 'text';
export const allButtonFills: ButtonFill[] = ['solid', 'outline', 'text'];
@ -53,11 +53,6 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
iconOnly: !children,
});
deprecatedPropWarning(
variant === 'link',
`${Button.displayName}: Prop variant="link" is deprecated. Please use fill="text".`
);
return (
<button className={cx(styles.button, className)} type={type} {...otherProps} ref={ref}>
{icon && <Icon name={icon} size={size} className={styles.icon} />}
@ -108,11 +103,6 @@ export const LinkButton = React.forwardRef<HTMLAnchorElement, ButtonLinkProps>(
className
);
deprecatedPropWarning(
variant === 'link',
`${LinkButton.displayName}: Prop variant="link" is deprecated. Please use fill="text".`
);
return (
<a className={linkButtonStyles} {...otherProps} tabIndex={disabled ? -1 : 0} ref={ref}>
{icon && <Icon name={icon} size={size} className={styles.icon} />}
@ -256,7 +246,7 @@ function getPropertiesForDisabled(theme: GrafanaTheme2, variant: ButtonVariant,
transition: 'none',
};
if (fill === 'text' || variant === 'link') {
if (fill === 'text') {
return {
...disabledStyles,
background: 'transparent',
@ -280,24 +270,15 @@ function getPropertiesForDisabled(theme: GrafanaTheme2, variant: ButtonVariant,
}
export function getPropertiesForVariant(theme: GrafanaTheme2, variant: ButtonVariant, fill: ButtonFill) {
const buttonVariant = variant === 'link' ? 'primary' : variant;
const buttonFill = variant === 'link' ? 'text' : fill;
switch (buttonVariant) {
switch (variant) {
case 'secondary':
return getButtonVariantStyles(theme, theme.colors.secondary, buttonFill);
return getButtonVariantStyles(theme, theme.colors.secondary, fill);
case 'destructive':
return getButtonVariantStyles(theme, theme.colors.error, buttonFill);
return getButtonVariantStyles(theme, theme.colors.error, fill);
case 'primary':
default:
return getButtonVariantStyles(theme, theme.colors.primary, buttonFill);
}
}
function deprecatedPropWarning(test: boolean, message: string) {
if (process.env.NODE_ENV === 'development' && test) {
console.warn(`@grafana/ui ${message}`);
return getButtonVariantStyles(theme, theme.colors.primary, fill);
}
}