gridsmith-ui 0.30.2 → 0.31.1

package/CHANGELOG.md

@@ -1,6 +1,76 @@
 # gridsmith-ui changelog
 
-## Unreleased (0.30.2)
+## Unreleased (0.31.1)
+
+**Fixed.**
+- **A closed Collapsible is out of the Tab order.** Its content was only out of sight, so a keyboard Tabbed into fields no one could see, and focus vanished: an event form's "More options" held its Location and Description. Closed, the content is now `inert`, out of the Tab order and the accessibility tree. Focus inside it when it closes goes back to its trigger; with no trigger that takes focus (the page's own button opens it, or the trigger is plain text), to the control before it, else the nearest place the page still holds. When a form sends focus to a field in a closed section (its only error, or an error summary's link), the section opens first, and the field takes focus in view.
+- **An open Collapsible clips nothing.** It kept the height it had when it opened and hid what overflowed, so a field's outline at its edge was cut, and so was an error message that appeared once it was open. Open and settled, its height follows its content; it clips only while it moves. A Collapsible open from the start is drawn open, with no movement.
+- **A Button whose own keyboard press takes it away hands focus on.** A button drawn only in one state (a card's Reconnect, gone once the app reconnects) left focus on the page after Enter. Focus now goes where the browser's Tab would go on from where the button stood, within the page, or the dialog, it was in: the first control after that place, what's drawn there now included, else the last before it. A destructive control is no exception, as Tab reaches it: a red button belongs in a confirmation dialog, which opens with focus on its safe action. A deleted row's Delete hands focus to the next row; a row that brings its own divider, or a tip drawn with its heading, is followed the same way. Focus never goes into another layer, such as a toast's Undo or a popover. It waits 0.4 s once the button has gone, so the library's own rules go first, and the page's if it moves focus by then. It never acts once the press has gone to another page, a hash router's included. A click leaves focus where the browser puts it, and so does a disable while the press is pending (`disabled={saving}`): the handover takes neither for the button going.
+- **A handover of focus after a removal ends once you've moved on.** The library's handovers end when focus goes elsewhere or is let go on the page, at a pointer's press, or at a scroll by wheel, touch or key: a Tag's remove, an Alert's Dismiss, a bulk action bar's Clear selection, a chat's suggestions, TransferList's moves, Pagination's Previous, Next and Load more, the Button's above, and an overlay's way back to the row it was opened from. A tag removed once a server answered, after a click on plain text meanwhile, pulled focus onto the next tag.
+- **A snapping PageHeader keeps a short page where Tab took it.** On a page that scrolled only a little past the header's collapse offset, Tab to a control near the foot collapsed the header, and the page's scroll range shrank for a moment: the header opened again and took the page back to the top, with the control under the fold. The space the header gives up is held from the moment it collapses.
+- **One Tooltip on screen at a time.** A relative time's full date, shown while it had keyboard focus, stayed up while the pointer rested on an icon button, and both labels showed at once. A Tooltip that opens now closes any other Tooltip, before either is drawn.
+- **Focus put back after a calendar event's deletion stands down once focus has had a place.** After an event was deleted from its card, focus went to its day; a click on plain text a moment later let it go, and a check made a moment later took focus back to the day. The Calendar's own watch now stands down once focus leaves the page's content, and an overlay's way back to a control that has gone acts only when focus stayed on nothing for its whole wait.
+
+### Upgrade note for agents (0.31.0 → 0.31.1)
+
+`^0.31.0` covers 0.31.1, so `npm update gridsmith-ui` brings it in. Nothing in an app's code changes, and the theme's tokens need no regenerating. What to check:
+- **The Tab order.** A closed Collapsible's fields are no Tab stops. A test that Tabs through a page with a closed section counts no stop for them; open the section first to reach them.
+- **Where focus goes.** After Enter on a Button that its own press takes away, focus moves 0.4 s after the button goes, to the first control after where it stood (what's drawn there now included, a destructive one too), else the last before it, within the page or the dialog. After a Collapsible closes with focus inside it, focus is on its trigger, else the control before it. After a form sends focus to an error in a closed Collapsible, the section opens and the field has focus. A test that expected focus on the page in these cases now finds it on that control, once it waits; in a dialog with nothing left in it, or a section its page keeps closed, nothing moves.
+- **Tooltips.** One shows at a time. A test that expected a tooltip shown by focus to stay while another opened by hover finds only the second.
+
+## 0.31.0 — 16 October 2026
+
+**Added.**
+- **A chart says what it shows, in a line above the drawing.** Every chart but Sparkline draws a sentence worked out from its data, so it stays true as the data changes: what it plots and over what; for each series (three at most, the rest counted), over dates or numbers its first and last values, "up" or "down" only when every step goes that way, and its highest and lowest when it goes both ways, and over names its highest and lowest; a pie's largest and smallest shares, a funnel's carry-through, a scatter chart's ranges, a Sankey chart's largest flow; any reference, and where a forecast runs. A screen reader hears it as the drawing's description once the chart is named (its `aria-label`, or its ChartContainer's title). `description` replaces it with the page's own words; a blank one keeps it. In a ChartContainer's fixed area it's shown with the table, so the drawing keeps its height.
+- **A chart's values as a table, one switch away.** Every chart but Sparkline has a Chart / Table switch, named after its chart ("Show Revenue as"), beside its ChartContainer's title when it's the container's one chart, else above the drawing. Table shows a table of every value the chart draws, in the drawing's place, named by the chart's name or its title, with its references and where its forecast runs listed under it. A table wider or taller than its room scrolls within it, a ChartContainer's fixed area included, as a Tab stop named after its chart ("Hours by month: values"), with the inset ring. Choosing a view never marks a form around the chart as changed. Numbers written as text ("150", as an API or a CSV gives them) are read as numbers, in the table and the sentence as in the drawing: a pie, a funnel, a radial chart, a treemap and a Sankey chart draw them too, where they drew nothing or the wrong part.
+- **Reference lines and bands.** LineChart, AreaChart, BarChart and CompositeChart take `references` (the `ChartReference` type, from `gridsmith-ui/charts`): a target or a limit as a dashed line at `value`, or a band from `value` to `to`, each drawn with its name, said in the sentence and listed under the table. Names in the plot never print over each other: one that would moves clear, within the plot. Each is drawn in a halo of the card's colour, so it reads over a bar or a line, and none leaves the plot: a line's name goes to the line's other side (a line at the value axis's foot), and a band's keeps inside the plot's edge (a band at the axis's start, narrower than its name). The value axis stretches to show each one; on CompositeChart they sit on the bars' axis, or the lines' in a chart of lines alone.
+- **A forecast, marked.** The same four charts take `forecastFrom`, the first category whose values are a forecast or a period not yet over, and `forecastLabel` ("Forecast" without one; the page's own words for a period under way, "So far this month"). From there a pale hatched band, named by the label, runs to the chart's end after a dashed line where it starts; lines and areas keep their colour and mark through it, and a bar draws fainter in a dashed outline of its own colour. The table marks each forecast row ("May (Forecast)"), and the sentence says where the forecast runs ("Forecast: May to Jun").
+- **ColorPicker's swatches alone.** `swatchesOnly` draws only the swatches, with no free colour area, hue or hex field, for a colour chosen from a set palette (a label's, a tag's or a project's colour), so the colours stay in harmony. The picker is then one radio group, named by its Field's label or by `aria-label`.
+- **Named swatches.** A swatch can be `{ value, label }` (the `ColorSwatch` type), named by its label to a screen reader and in its tooltip ("Sky"); a plain value is named by itself, as before. Two swatches of one colour are warned of in development.
+- **Timeline's name.** `aria-label` names its horizontal row for the Tab stop it becomes while it scrolls sideways ("Release history"; default "Timeline"); a vertical timeline doesn't scroll and takes none.
+- **SliderRange's and FileUpload's `aria-labelledby`.** Names the control by an element on the page, where no label on screen does.
+- **CodeBlock's name.** `aria-label` names its code for the Tab stop it becomes while it scrolls sideways ("app.tsx"; default its language, "Code: tsx").
+- **A table of things with sub-things.** Table takes `getChildRows`, asked of each row with its place (`{ level, parent }`) for its own rows of the same kind, in the same columns (tasks with their subtasks), and, given it, the Table is a tree table even before any row has rows under it: a treegrid whose rows are one Tab stop, moved with a tree's keys. Up and Down move between the rows shown, Right opens a row and then goes to its first row, Left closes it or goes to the row above it, Enter and Space do what a click on the row does, and Up from the first row reaches the header's controls. A row with rows under it draws a chevron before its name, a button named for what it does ("Show 2 rows under Launch site"); each level is indented, and the Details toggle is the row's last cell. `openParents`, `defaultOpenParents` and `onOpenParentsChange` hold which rows are open, by key, apart from a row's Details. `selectedKeys` and `onSelectedKeysChange` select by key, in any table: in a tree, selecting a row selects the rows under it, a row with only some of them chosen shows a mixed box, and a row whose rows are all chosen is reported too. A sort orders each level, the pager counts the top-level rows, an address in `expandedRows` that names a row under another opens the rows above it, and on a phone the rows under a card follow it, indented, behind its own Show button. Each row needs a `rowKey` value of its own across every level. A Table without `getChildRows` is as it was.
+
+**Fixed.**
+- **A chart's series differ by more than their colour** (WCAG 1.4.1). A chart told its series, or a pie's or a radial chart's parts, apart by colour alone. Each after the first now has its own mark, shown in the legend's and the tooltip's swatches too: a line's or an area's dash (RadarChart's too), a bar's, a slice's or a radial bar's pattern, a scatter series' symbol, and in CompositeChart its bars' patterns and its lines' dashes. Past the palette's six colours, each series still has a colour and a mark of its own. A pattern's marks take the card's colour or the text's, whichever reads against the fill, soft or solid, at 3:1 or more, on a see-through card as it shows over the page, and on a forecast's fainter bars too. A line the page dashes is never drawn solid, nor the same as another line. A chart of one series draws no mark; its legend's swatch is a short line or a square. FunnelChart names its stages on the drawing, and TreemapChart each tile with room for its name; the table names every one.
+- **SankeyChart names each point.** Its points were drawn in one colour, unnamed; each is now drawn in the palette's colours, with its name beside it, on the side toward the drawing's middle. A name longer than its room, between its column and the next, is cut short with "…", and fitted again as the drawing narrows or widens: the tooltip and the table give it whole.
+- **A SankeyChart whose flows loop no longer takes the page down.** A flow back to a point it came from ran Recharts' layout without end. A flow that would close a loop isn't drawn: the loop's smallest flow gives way, so the main direction is drawn whatever order the flows come in. A development warning names it, and the sentence and the table say it isn't drawn.
+- **A ColorPicker swatch gives its own colour.** A swatch gave back its value worked out again through hue, saturation and lightness: eight of the ten default swatches gave a hex a shade off their own, and so never showed as chosen, and a swatch written as an oklch colour or a token gave `#NaNNaNNaN`. A swatch now gives its value exactly as written.
+- **ColorPicker's swatches are a radio group.** Each was a button named by its hex, with nothing to say which was chosen. They're now one group ("Swatches"), the chosen swatch checked, with one Tab stop (the chosen swatch, else the first): the arrows move and choose, round the ends, and Home and End go to the first and last.
+- **ColorPicker in a Field is named by its label.** It was named by nothing, its hint and error not read with it, so an error summary's link had nowhere to go. It's now named by the Field's label and described by its hint and error, as RadioGroup is, and a required picker says so.
+- **A disabled ColorPicker changes nothing.** Its hue and opacity sliders and its hex field still took input; they're disabled with it.
+- **ColorPicker previews a value its free area can't show,** a theme's token or an oklch colour, as itself: it showed grey, or the colour chosen before.
+- **A Dropdown the page names reads what it shows too** (WCAG 2.5.3). Named by `aria-label`, its trigger was called by that name alone, so Tabs on a phone read "Contents" over a trigger showing "Security". It now reads the name, then what it shows: "Contents, Security", "Status, Open". This names Tabs and SettingsLayout on a phone, SettingsLayout's sidebar in a narrow box, TableToolbar's filter, a collapsed SegmentedControl and RecurrencePicker's unit. Pagination's page size reads "Rows per page, 10" as before. The open list keeps the name alone. A trigger that shows nothing reads the name alone, with no comma; one that shows its name, or starts with it, reads its own words.
+- **A label on screen leads every control's name** (WCAG 2.5.3). A page's `aria-label` or `aria-labelledby` replaced it: an Input in a Field labelled "Email" read the page's "Work email", SegmentedControl read "Calendar view" over its Field's "View", and a Dropdown's own label gave way to a hidden `aria-labelledby`. Every control a Field holds now follows one rule, Input, Textarea, NumberInput, TagInput, PinInput and Toggle among them: the label on screen, the control's own or its Field's (an AddAnother row's once it shows), leads, and a page's name beside it is left out, with a development warning naming the control. With none on screen, ARIA's order: the page's `aria-labelledby`, its `aria-label`, then a Field's hidden label. RecurrencePicker's page name names its group, and a read-only Rating in a Field reads its label and value ("Quality 3 out of 5"). A Dropdown trigger that shows its name as a word, or starts with it, reads its own words.
+- **A Field keeps a control's own `aria-describedby`,** beside its hint and error; it replaced it.
+- **A Toggle in a Field is named by the Field's label;** it read "Toggle".
+- **An overlay open from the start keeps focus in a development build.** Under StrictMode, a Dialog or Drawer drawn already open, with nothing focused, gave focus to the page behind it 200 ms on. Its way back is now dropped when it opens again, and after an unmount, focus inside it counts as lost only once it has gone or is hidden.
+- **One press on an infinite list's Load more loads one page.** A press by mouse or touch scrolled the button back into view after each load, which loaded again, until every page had loaded. Only a press by keyboard, while it holds the list, brings the button back into view, once the press's rows are in.
+- **Load more's last load finds what it brought, in a page's own markup.** Plain cards sent focus to the list's first card, and a pager in a layout box of its own sent it to that empty box. Focus now goes to the first new row, else the first control the load brought, else the last control before the pager, else the last resort. What came after the list's last item goes first, so a control the load enabled above the list doesn't take focus. A press hands focus on when its own load takes the button, however the page counts its pages; a load the list starts by itself ends the press's watch, so the list loading on as the person scrolls moves no focus.
+- **A group given focus for the moment gives its tabindex back.** When a removed control left no neighbour, its group kept `tabindex="-1"` after focus left. It now comes off, as a heading's does.
+- **An infinite list loads again after its last load by keyboard.** The button went with focus on it, which a browser doesn't report as a blur, so a filter that restarted the list never loaded as it scrolled.
+- **A scroll area looks again when what decides it changes.** Under the phone menu, a clock in `<main>` made it a Tab stop that stayed once the menu closed. Areas now wait while inert, and look again when a control inside is enabled, shown or given a tabindex, or a box round them is made inert or not.
+- **The shell's `<main>` asks less of a long page.** It found and sorted every control at each change and each focus move inside it; it now stops at the first one, and looks again only as focus leaves `<main>` itself.
+- **Scroll areas are named for what they hold.** A CodeBlock is named by its `aria-label`, else its language ("Code: tsx"); a markdown table by its first two headings and how many more ("Table: Name, Email and 8 more"); a horizontal Timeline by its `aria-label`.
+- **Pagination's page size reads the size in force.** A size its options lacked (a project's 20 against 10, 25 and 50) showed and read "Select..."; it now joins the options, at its place in their order.
+
+### Upgrade note for agents (0.30.2 → 0.31.0)
+
+Upgrade `gridsmith-ui` to `^0.31.0` (an app pinned to `^0.30.0` never reaches it), then report the new version as `ui_version`: the rules and guidance that need 0.31.0 are served from then on. An app's code needs no change and its theme's stylesheet no regenerating; what to check:
+- **A chart's look.** A chart of several series marks each series after the first by a dash, a pattern or a symbol, and its legend's swatches show them (a short line, a square or a symbol where it drew dots); a forecast is a hatched band; SankeyChart's points are coloured and named; every chart but Sparkline has its sentence and its Chart / Table switch. A screenshot or snapshot test of a chart changes.
+- **Words the page drew beside a chart to say what it shows.** The chart draws its own sentence now: pass the page's words as `description`, rather than drawing both. A table of the chart's values the page drew itself, or a caption naming its target or where its forecast starts, is drawn by the chart now too: take the page's own out, and give the chart `references` and `forecastFrom`.
+- **A forecast drawn as a series of its own, dashed.** Give the chart `forecastFrom` instead, and the forecast's values in the series itself. A line the page dashes (`LineDef.dashed`) may draw in another dash, one no other line has.
+- **The Tab order.** Each chart's switch is a Tab stop, one more for a test that counts Tab presses through a page of charts. ColorPicker's swatches are one Tab stop where each was one, and a disabled picker's sliders and hex field leave the Tab order.
+- **A test that finds a chart's switch** finds it by its name, "Show <the chart's name> as".
+- **A test that finds a ColorPicker swatch as a button.** Swatches are radios: `getByRole('radio', { name: '#3b82f6' })`, or by the swatch's label. A test that expected a swatch to give a converted hex gets the swatch's own value, and a press on the swatch already chosen no longer calls `onChange`. Each swatch shows its name in a tooltip, and the chosen swatch draws a check: a screenshot of the picker changes.
+- **A test that finds a Dropdown by the name the page gave it.** It reads that name, then what it shows: `getByRole('button', { name: 'Status, Open' })`, or `/^Status, /`. Tabs' phone Dropdown is "Contents, <the tab chosen>", not 0.30.2's "Contents". Pass the name alone: a page that wrote the choice into `aria-label` has it read twice.
+- **A test that finds a scroll area by its name.** A CodeBlock's is its `aria-label`, else "Code: <language>"; a markdown table's "Table: <its first two headings> and <n> more".
+- **Any control with a label on screen, a Field's or its own (Input and Toggle included), is named by it:** remove an `aria-label` or `aria-labelledby` given beside it (a development warning names the control). A test that found it by the page's name finds it by the label. Under a hidden Field label (`hideLabel`), the page's name now wins, as ARIA orders it. A RecurrencePicker's `aria-label` or `aria-labelledby` names its group (`getByRole('group', { name })`); its choice reads "Repeat", or its Field's label.
+- **A page size outside `pageSizeOptions`** appears among them.
+- **After Load more's last load in a list of your own,** focus is on the first new item's first control.
+
+## 0.30.2 — 16 October 2026
 
 **Added.**
 - **ScrollArea's name.** `aria-label` names the area for the Tab stop it becomes while it scrolls with nothing in it to Tab to ("Release notes"; default "Scrollable content").

package/dist/charts.d.ts

@@ -2,6 +2,25 @@ import * as react from 'react';
 import { ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
+/**
+ * What a chart says besides its drawing (Sprint 25.8.9 items 4, 25, 26 and 27): its values as a table and a sentence of
+ * what it shows, each worked out from the chart's own props, so they stay true as the data changes. The sentence is a
+ * line on the page and the table one switch away, so a reader who can't see the colours, or can't see at all, gets the
+ * same as one who can (charts-6, charts-7, WCAG 1.4.1 and 1.1.1).
+ *
+ * Pure: each chart builds its own from the page's data, read by named fields, never from the copies it draws with
+ * (Sprint 25.29 item 14), so a row's own fields never reach the table's cells.
+ */
+/** A value a chart marks across its plot: a target or a limit as a line, or a band from `value` to `to`. */
+interface ChartReference {
+    /** Where the line sits, or where the band starts, on the value axis. */
+    value: number;
+    /** What it is ("Target", "Budget"): drawn beside it, and said in the sentence and under the table. */
+    label: string;
+    /** A band's other end. */
+    to?: number;
+}
+
 /**
  * Sprint 25.9, A3 — what a chart's category axis holds, and how its labels fit. No Recharts here: the charts entry and
  * the tests import it, and it never measures on its own (the measurer is handed in).
@@ -85,6 +104,21 @@ interface BarChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data (each series' highest and lowest, or its trend over dates), which it shows without one.
+     */
+    description?: string;
+    /** Targets or limits across the bars: a line at `value`, or a band from `value` to `to`, each named by its `label`. */
+    references?: ChartReference[];
+    /**
+     * The first category whose values are a forecast (its `xAxisKey` value): from there each bar draws fainter in a dashed
+     * outline of its own colour, in a pale hatched band named by `forecastLabel` ("Forecast" without one) that runs to the
+     * chart's end, after a dashed line where it starts. A period not yet over is marked the same
+     * way, with the page's own words ("So far this month").
+     */
+    forecastFrom?: string | number;
+    forecastLabel?: string;
 }
 declare const BarChart: react.ForwardRefExoticComponent<BarChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -122,6 +156,21 @@ interface LineChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data (its series' trends and highest points), which it shows without one.
+     */
+    description?: string;
+    /** Targets or limits across the plot: a line at `value`, or a band from `value` to `to`, each named by its `label`. */
+    references?: ChartReference[];
+    /**
+     * The first category whose values are a forecast (its `xAxisKey` value): from there a pale hatched band, named by
+     * `forecastLabel` ("Forecast" without one), runs to the chart's end, after a dashed line where it starts, and each line
+     * keeps its own colour and mark through it. A period not yet over is marked the same
+     * way, with the page's own words ("So far this month").
+     */
+    forecastFrom?: string | number;
+    forecastLabel?: string;
 }
 declare const LineChart: react.ForwardRefExoticComponent<LineChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -159,6 +208,21 @@ interface AreaChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data (its series' trends and highest points), which it shows without one.
+     */
+    description?: string;
+    /** Targets or limits across the plot: a line at `value`, or a band from `value` to `to`, each named by its `label`. */
+    references?: ChartReference[];
+    /**
+     * The first category whose values are a forecast (its `xAxisKey` value): from there a pale hatched band, named by
+     * `forecastLabel` ("Forecast" without one), runs to the chart's end, after a dashed line where it starts, and each area
+     * keeps its own colour and mark through it. A period not yet over is marked the same
+     * way, with the page's own words ("So far this month").
+     */
+    forecastFrom?: string | number;
+    forecastLabel?: string;
 }
 declare const AreaChart: react.ForwardRefExoticComponent<AreaChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -177,6 +241,11 @@ interface PieChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its parts (the largest and the smallest, with their shares), which it shows without one.
+     */
+    description?: string;
 }
 declare const PieChart: react.ForwardRefExoticComponent<PieChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -233,6 +302,20 @@ interface CompositeChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data, which it shows without one.
+     */
+    description?: string;
+    /** Targets or limits on the bars' axis: a line at `value`, or a band from `value` to `to`, each named by its `label`. */
+    references?: ChartReference[];
+    /**
+     * The first category whose values are a forecast (its `xAxisKey` value): from there each bar draws fainter in a dashed
+     * outline of its own colour, in a pale hatched band named by `forecastLabel` ("Forecast" without one) that runs to the
+     * chart's end, after a dashed line where it starts; the lines keep their own colour and mark through it.
+     */
+    forecastFrom?: string | number;
+    forecastLabel?: string;
 }
 declare const CompositeChart: react.ForwardRefExoticComponent<CompositeChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -264,6 +347,11 @@ interface ScatterChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its points (how many, and the range of each value), which it shows without one.
+     */
+    description?: string;
 }
 declare const ScatterChart: react.ForwardRefExoticComponent<ScatterChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -286,6 +374,11 @@ interface RadarChartProps {
     valueFormat?: ValueFormat;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data (each series' highest and lowest), which it shows without one.
+     */
+    description?: string;
 }
 declare const RadarChart: react.ForwardRefExoticComponent<RadarChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -306,6 +399,11 @@ interface RadialBarChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data, which it shows without one.
+     */
+    description?: string;
 }
 declare const RadialBarChart: react.ForwardRefExoticComponent<RadialBarChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -324,6 +422,11 @@ interface FunnelChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data, which it shows without one.
+     */
+    description?: string;
 }
 declare const FunnelChart: react.ForwardRefExoticComponent<FunnelChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -341,6 +444,11 @@ interface TreemapChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data, which it shows without one.
+     */
+    description?: string;
 }
 declare const TreemapChart: react.ForwardRefExoticComponent<TreemapChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -361,6 +469,11 @@ interface SankeyChartProps {
     animated?: boolean;
     "aria-label"?: string;
     className?: string;
+    /**
+     * What the chart shows, in the page's words: a line above the drawing, in place of the sentence the chart works out
+     * from its data, which it shows without one.
+     */
+    description?: string;
 }
 declare const SankeyChart: react.ForwardRefExoticComponent<SankeyChartProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -404,4 +517,4 @@ declare function ChartContainer({ height, title, loading, emptyState, variant, c
  */
 declare function useChartColors(count: number, soft?: boolean): string[];
 
-export { AreaChart, type AreaChartProps, type AreaDef, BarChart, type BarChartProps, type BarDef, type CategoryKind, ChartContainer, CompositeChart, type CompositeChartProps, FunnelChart, type FunnelChartProps, LineChart, type LineChartProps, type LineDef, PieChart, type PieChartProps, RadarChart, type RadarChartProps, type RadarDataKey, RadialBarChart, type RadialBarChartProps, SankeyChart, type SankeyChartProps, ScatterChart, type ScatterChartProps, type ScatterSeries, Sparkline, type SparklineProps, TreemapChart, type TreemapChartProps, type TreemapNode, type ValueFormat, categoryKind, useChartColors };
+export { AreaChart, type AreaChartProps, type AreaDef, BarChart, type BarChartProps, type BarDef, type CategoryKind, ChartContainer, type ChartReference, CompositeChart, type CompositeChartProps, FunnelChart, type FunnelChartProps, LineChart, type LineChartProps, type LineDef, PieChart, type PieChartProps, RadarChart, type RadarChartProps, type RadarDataKey, RadialBarChart, type RadialBarChartProps, SankeyChart, type SankeyChartProps, ScatterChart, type ScatterChartProps, type ScatterSeries, Sparkline, type SparklineProps, TreemapChart, type TreemapChartProps, type TreemapNode, type ValueFormat, categoryKind, useChartColors };