@wix/design-system
Version:
@wix/design-system
39 lines (34 loc) • 1.3 kB
TypeScript
import * as React from 'react';
export interface BarChartItem {
value: number;
label?: React.ReactNode;
labelShort?: React.ReactNode;
description?: React.ReactNode;
descriptionInfo?: React.ReactNode;
/** Callback called every time when descriptionInfo tooltip is shown*/
onDescriptionInfoShown?: () => void;
}
export interface BarChartProps {
/**
* Array of items
* * `value` - This prop is used for sorting bars. Displayed as big text on a bar, when there is no caption prop.
* * `label` - Displayed as big text on a bar.
* * `labelShort` - Is shown instead of a `label` when there is not enough space.
* * `description` - short label under the bar.
* * `descriptionInfo` - long description.
*/
items: BarChartItem[];
/** Used to calculate space for bars inside a widget. Should be specified if the actual total is different from the sum of values of all items */
total?: number;
/** Applied as data-hook HTML attribute that can be used to create driver in testing */
dataHook?: string;
/** Callback called every time when descriptionInfo tooltip is shown*/
onDescriptionInfoShown?: () => void;
}
export interface BarChartState {
width: number;
}
export default class BarChart extends React.Component<
BarChartProps,
BarChartState
> {}