TopList

OverviewProperties

TopListProps

extends, ,

Name	Type	Default	Description
data	[]		Records to display as ranked bars. Sorted by valueAccessor descending unless a custom comparator is provided. Index-keyed internally before being forwarded to the underlying chart.
height?	|	300px	Chart height. When a number is specified, it's treated as pixels, otherwise a valid CSS height string is expected.
width?	|	100%	Chart width. When a number is specified, it's treated as pixels, otherwise a valid CSS width string is expected.
colorPalette?		'categorical'	Color palette for the chart.
loading?		false	Show the loading indicator when truthy.
truncationMode?		'middle'	Truncation mode applied to bar labels.
labelAccessor			Accessor for the text rendered inside each bar.
valueAccessor			Accessor for the numerical value that determines bar width.
valueFormatter?	| <, >		Formats numerical values shown in tooltips and Y-axis tick labels.
comparator?	(a: , b: ) =>		Custom comparator function for sorting data items. When omitted, data is sorted by value in descending order.
actions?	(datapoint: ) =>		Callback that returns the series action menu for the hovered bar. Return a <ChartSeriesAction> tree (or a Promise of one for async menus).
colorPaletteMode?		'single-color'	Controls how the color palette is applied to bars. 'single-color': all bars share the same color from the palette. 'multi-color': each bar gets a sequential color from the palette.
children?			Slot children forwarded to the internal XYChart.

TopList.ColorRule

TopList.ColorRule provides a slot to apply conditional coloring to bars based on their datapoint values.

ColorRuleProps

Signature:

export declare type ColorRuleProps = { valueAccessor?: ; comparator: ; matchValue: ; } & ;