Skip to content

Commit

Permalink
fix(legend): disable focus and keyboard navigation for legend in part…
Browse files Browse the repository at this point in the history
…ition ch… (opensearch-project#952)
  • Loading branch information
rshen91 authored Dec 16, 2020
1 parent ad59794 commit dfff3e2
Show file tree
Hide file tree
Showing 3 changed files with 14 additions and 3 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 8 additions & 2 deletions packages/osd-charts/src/components/legend/label.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,17 +23,19 @@ import React, { MouseEventHandler } from 'react';
interface LabelProps {
label: string;
isSeriesHidden?: boolean;
isToggleable?: boolean;
onClick?: MouseEventHandler;
}
/**
* Label component used to display text in legend item
* @internal
*/
export function Label({ label, onClick, isSeriesHidden }: LabelProps) {
export function Label({ label, isToggleable, onClick, isSeriesHidden }: LabelProps) {
const labelClassNames = classNames('echLegendItem__label', {
'echLegendItem__label--clickable': Boolean(onClick),
});
return (

return isToggleable ? (
<button
type="button"
className={labelClassNames}
Expand All @@ -45,5 +47,9 @@ export function Label({ label, onClick, isSeriesHidden }: LabelProps) {
>
{label}
</button>
) : (
<div className={labelClassNames} title={label} onClick={onClick}>
{label}
</div>
);
}
7 changes: 6 additions & 1 deletion packages/osd-charts/src/components/legend/legend_item.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,12 @@ export class LegendListItem extends Component<LegendItemProps, LegendItemState>
hasColorPicker={hasColorPicker}
onClick={this.handleColorClick(hasColorPicker)}
/>
<ItemLabel label={label} onClick={this.handleLabelClick(seriesIdentifier)} isSeriesHidden={isSeriesHidden} />
<ItemLabel
label={label}
isToggleable={item.isToggleable}
onClick={this.handleLabelClick(seriesIdentifier)}
isSeriesHidden={isSeriesHidden}
/>
{showExtra && extra && renderExtra(extra, isSeriesHidden)}
{Action && (
<div className="echLegendItem__action">
Expand Down

0 comments on commit dfff3e2

Please sign in to comment.