A11y: Replace LinkButton with Button in Value Mappings to make it accessible (#46330) (#46364)

(cherry picked from commit 4b57ffbb4f)

Co-authored-by: Joao Silva <100691367+JoaoSilvaGrafana@users.noreply.github.com>
This commit is contained in:
Grot (@grafanabot)
2022-03-09 14:29:31 +00:00
committed by GitHub
co-authored by Joao Silva
parent 77d1f996cc
commit bebe1c243e
@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useRef } from 'react';
import { GrafanaTheme2, MappingType, SpecialValueMatch, SelectableValue, ValueMappingResult } from '@grafana/data';
import { Draggable } from 'react-beautiful-dnd';
import { css } from '@emotion/css';
import { useStyles2, Icon, Select, HorizontalGroup, ColorPicker, IconButton, LinkButton, Input } from '@grafana/ui';
import { useStyles2, Icon, Select, HorizontalGroup, ColorPicker, IconButton, Input, Button } from '@grafana/ui';
export interface ValueMappingEditRowModel {
type: MappingType;
@@ -176,9 +176,9 @@ export function ValueMappingEditRow({ mapping, index, onChange, onRemove, onDupl
{!result.color && (
<ColorPicker color={'gray'} onChange={onChangeColor} enableNamedColors={true}>
{(props) => (
<LinkButton variant="primary" fill="text" onClick={props.showColorPicker} ref={props.ref} size="sm">
<Button variant="primary" fill="text" onClick={props.showColorPicker} ref={props.ref} size="sm">
Set color
</LinkButton>
</Button>
)}
</ColorPicker>
)}