BarChart

Bar and stacked-bar chart. HTML/CSS (no chart dependency), themed by the chart tokens, light and dark.

import { BarChart } from 'achery-ui'

// Rows, an ordered series, each bar linking to the list it counts
<BarChart
  label="Entities by status"
  orientation="horizontal"
  scale="ordinal"
  series={['Stub', 'Draft', 'Complete']}
  data={[
    { label: 'NPCs', values: [12, 9, 4], href: '/w/npc?status=stub' },
    { label: 'Locations', values: [3, 8, 14], href: '/w/location' },
  ]}
/>

// Columns over time, one series
<BarChart label="Hours per day" series={['Hours']} data={days} formatValue={(v) => `${v}h`} />

Prop	Type	Default	Notes
label	string	—	Required. Names the chart for assistive technology and captions its table
data	BarChartDatum[]	—	{ label, values: number[], href?, onSelect? } — one value per series (missing, negative or not a number count as 0, everywhere); href makes the bar a link, onSelect a button
series	string[]	—	In a fixed order — colours follow it, so keep it stable as filters change. ≥ 2 stack, with a legend
scale	'categorical' | 'ordinal'	'categorical'	Categorical for identity (≤ 6 series); ordinal for ordered series, one hue light→dark (≤ 5)
orientation	'vertical' | 'horizontal'	'vertical'	Columns with a value axis, or rows with labels at the left
height	number	180	Plot height (vertical)
showValues	boolean	horizontal: true, vertical: false	Each bar's total at its tip
formatValue	(v: number) => string	formatCompact	1,284 · 12.9K · 4.2M

• Bars are at most 24px thick, from one baseline, with a 4px rounded end; stacked segments are separated by a 2px gap.
• The axis tops out at a clean number. Ticks are whole when every value is, and fractional ticks show their own precision (0.25, not 0.3).
• Column labels are thinned to fit the measured width, never cropped.
• Hovering or focusing a bar shows every series' value.
• A visually hidden table carries the same numbers.
• More series than the palette holds throws: fold the rest into "Other".

formatCompact(n, decimals = 1) is exported too: 1,284 · 12.9K · 4.2M, rounding before it picks a unit (999,999 → 1M).