Bugfix: Updating storybook example to pass theme property to BarGuage (#98804)

* Updating storybook example and making sure BarGauage has theme setup.

* removed unneccessary theme.

* Reverted change updated example.
pull/98868/head
Marcus Andersson 6 months ago committed by GitHub
parent 01aeb56646
commit 5282b7ca8c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 39
      packages/grafana-ui/src/components/BarGauge/BarGauge.mdx

@ -14,34 +14,35 @@ import { VizOrientation, ThresholdsMode, Field, FieldType, getDisplayProcessor }
const field: Partial<Field> = {
type: FieldType.number,
config: {
min: minValue,
max: maxValue,
min: 0,
max: 100,
thresholds: {
mode: ThresholdsMode.Absolute,
steps: [
{ value: -Infinity, color: 'green' },
{ value: threshold1Value, color: threshold1Color },
{ value: threshold2Value, color: threshold2Color },
{ value: 20, color: 'blue' },
{ value: 90, color: 'red' },
],
},
},
};
field.display = getDisplayProcessor({ field });
const value = {
text: value.toString(),
title: title,
numeric: value,
};
<BarGauge
value={70}
field={field.config}
display={field.display}
value={value}
orientation={VizOrientation.Vertical}
displayMode={BarGaugeDisplayMode.Basic}
/>;
field.display = getDisplayProcessor({ theme, field });
return (
<BarGauge
theme={theme}
field={field.config}
display={field.display}
value={{
text: '70',
title: 'Title of data point',
numeric: 70,
}}
orientation={VizOrientation.Vertical}
displayMode={BarGaugeDisplayMode.Basic}
/>
);
```
<ArgTypes of={BarGauge} />

Loading…
Cancel
Save