@synertech/ui 0.42.0 → 0.44.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude/skills/use-synertech-ui/SKILL.md +139 -1
- package/dist/index.cjs +10 -9
- package/dist/index.d.cts +1096 -55
- package/dist/index.d.ts +1096 -55
- package/dist/index.js +10 -9
- package/dist/styles.css +55 -0
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import react__default, { ReactNode, ReactElement, ComponentPropsWithoutRef, RefObject, ChangeEvent, MouseEvent, Dispatch, SetStateAction, HTMLAttributes, TableHTMLAttributes, ThHTMLAttributes, TdHTMLAttributes } from 'react';
|
|
3
|
+
import react__default, { ReactNode, ReactElement, ComponentPropsWithoutRef, PointerEvent, KeyboardEvent, CSSProperties, RefObject, ChangeEvent, MouseEvent, Dispatch, SetStateAction, HTMLAttributes, TableHTMLAttributes, ThHTMLAttributes, TdHTMLAttributes } from 'react';
|
|
4
4
|
import { M as MarkdownEditorComponent } from './types-99-Ej5og.cjs';
|
|
5
5
|
export { a as MarkdownEditorProps } from './types-99-Ej5og.cjs';
|
|
6
6
|
|
|
@@ -123,6 +123,14 @@ type ChartSize = "sm" | "md" | "lg";
|
|
|
123
123
|
*/
|
|
124
124
|
type ChartCurve = "linear" | "monotone" | "step" | "stepAfter";
|
|
125
125
|
type ChartGridLines = "none" | "x" | "y" | "both";
|
|
126
|
+
/**
|
|
127
|
+
* Which screen axis carries the values.
|
|
128
|
+
*
|
|
129
|
+
* `vertical` is the usual case — values run up the left side, categories along
|
|
130
|
+
* the bottom. `horizontal` swaps them, which is what a bar chart does when its
|
|
131
|
+
* category names are too long to be read rotated.
|
|
132
|
+
*/
|
|
133
|
+
type ChartOrientation = "vertical" | "horizontal";
|
|
126
134
|
type ChartLegendPosition = "top" | "bottom" | "right";
|
|
127
135
|
/** How the horizontal axis maps values to pixels. */
|
|
128
136
|
type ChartScaleType = "category" | "linear" | "time";
|
|
@@ -155,6 +163,10 @@ interface ChartSeries {
|
|
|
155
163
|
*/
|
|
156
164
|
type?: "bar" | "line";
|
|
157
165
|
}
|
|
166
|
+
/** A series whose palette slot has been resolved to a colour. */
|
|
167
|
+
type ChartResolvedSeries = ChartSeries & {
|
|
168
|
+
color: string;
|
|
169
|
+
};
|
|
158
170
|
interface ChartXAxisConfig {
|
|
159
171
|
/** Field read on each datum. */
|
|
160
172
|
key: string;
|
|
@@ -243,6 +255,34 @@ interface ChartReferenceLine {
|
|
|
243
255
|
color?: string;
|
|
244
256
|
dashed?: boolean;
|
|
245
257
|
}
|
|
258
|
+
/** What every annotation carries. */
|
|
259
|
+
interface ChartAnnotationBase {
|
|
260
|
+
/** The comment itself. Without it an annotation marks a spot and says nothing. */
|
|
261
|
+
label?: string;
|
|
262
|
+
/** Any CSS colour. Defaults to a muted grey, which is what keeps it chrome. */
|
|
263
|
+
color?: string;
|
|
264
|
+
}
|
|
265
|
+
/** A single observation worth commenting, marked where it sits on the plot. */
|
|
266
|
+
interface ChartPointAnnotation extends ChartAnnotationBase {
|
|
267
|
+
type: "point";
|
|
268
|
+
x: ChartXValue;
|
|
269
|
+
/** Value the marker is pinned to, read on the chart's own value axis. */
|
|
270
|
+
y: number;
|
|
271
|
+
}
|
|
272
|
+
/** A moment: a release, a price change, the day the tracking broke. */
|
|
273
|
+
interface ChartLineAnnotation extends ChartAnnotationBase {
|
|
274
|
+
type: "line";
|
|
275
|
+
x: ChartXValue;
|
|
276
|
+
/** Solid instead of dashed — for a boundary rather than an event. */
|
|
277
|
+
dashed?: boolean;
|
|
278
|
+
}
|
|
279
|
+
/** A stretch of the category axis: a campaign, an outage, a closed quarter. */
|
|
280
|
+
interface ChartBandAnnotation extends ChartAnnotationBase {
|
|
281
|
+
type: "band";
|
|
282
|
+
from: ChartXValue;
|
|
283
|
+
to: ChartXValue;
|
|
284
|
+
}
|
|
285
|
+
type ChartAnnotation = ChartPointAnnotation | ChartLineAnnotation | ChartBandAnnotation;
|
|
246
286
|
/** An entry of the legend. */
|
|
247
287
|
interface ChartLegendItem {
|
|
248
288
|
key: string;
|
|
@@ -256,6 +296,13 @@ interface ChartLegendItem {
|
|
|
256
296
|
* series drawn as a line cannot wear the same block as the bars beside it.
|
|
257
297
|
*/
|
|
258
298
|
marker?: "line" | "rect" | "dot";
|
|
299
|
+
/**
|
|
300
|
+
* Texture slot the entry wears, when the chart draws its marks with them.
|
|
301
|
+
*
|
|
302
|
+
* The swatch has to carry both channels the plot carries, or the texture is
|
|
303
|
+
* a pattern the reader cannot map onto anything.
|
|
304
|
+
*/
|
|
305
|
+
pattern?: number;
|
|
259
306
|
}
|
|
260
307
|
/** A tick, already placed on its axis. */
|
|
261
308
|
interface ChartTick {
|
|
@@ -265,11 +312,107 @@ interface ChartTick {
|
|
|
265
312
|
offset: number;
|
|
266
313
|
label: string;
|
|
267
314
|
}
|
|
315
|
+
/**
|
|
316
|
+
* The resolved geometry of a plot, handed to whatever an application draws
|
|
317
|
+
* inside it.
|
|
318
|
+
*
|
|
319
|
+
* Coordinates are relative to the **drawing area**, not to the SVG: `0, 0` is
|
|
320
|
+
* the top-left corner of the plot, inside the axis gutters, which is the frame
|
|
321
|
+
* the chart's own marks are placed in.
|
|
322
|
+
*/
|
|
323
|
+
interface ChartPlotContext {
|
|
324
|
+
/** Size of the drawing area, and the gutters reserved around it. */
|
|
325
|
+
dimensions: ChartDimensions;
|
|
326
|
+
/** Which screen axis carries the values. */
|
|
327
|
+
orientation: ChartOrientation;
|
|
328
|
+
/**
|
|
329
|
+
* Where an x value lands along the category axis, in pixels.
|
|
330
|
+
*
|
|
331
|
+
* `null` when the axis cannot place it — a category that is not in the data,
|
|
332
|
+
* or a date outside the window. Skip the mark rather than drawing it on the
|
|
333
|
+
* edge, which is what the chart's own overlays do.
|
|
334
|
+
*/
|
|
335
|
+
xAt: (value: ChartXValue) => number | null;
|
|
336
|
+
/** Where a value lands along the value axis, in pixels. */
|
|
337
|
+
yAt: (value: number) => number;
|
|
338
|
+
/** Middle of each row's slot, in row order — where a mark is centred. */
|
|
339
|
+
categoryCenters: number[];
|
|
340
|
+
/** Width of a band. `0` where the rows are placed as points. */
|
|
341
|
+
bandwidth: number;
|
|
342
|
+
/** The x value of each row, in row order. */
|
|
343
|
+
xValues: ChartXValue[];
|
|
344
|
+
/** Rounded bounds of the value axis. */
|
|
345
|
+
domain: [number, number];
|
|
346
|
+
/** The rows the chart was given, untouched. */
|
|
347
|
+
data: readonly ChartDatum[];
|
|
348
|
+
/** The visible series, palette slots already resolved. */
|
|
349
|
+
series: readonly ChartResolvedSeries[];
|
|
350
|
+
/** The chart's own value formatter — a caption should read like its axis. */
|
|
351
|
+
formatValue: (value: number) => string;
|
|
352
|
+
/** The chart's own category formatter. */
|
|
353
|
+
formatX: (value: ChartXValue, index: number) => string;
|
|
354
|
+
}
|
|
355
|
+
/** Draws inside a chart's plot area, with the chart's own geometry. */
|
|
356
|
+
type ChartOverlayRenderer = (context: ChartPlotContext) => ReactNode;
|
|
357
|
+
/**
|
|
358
|
+
* What an application draws inside a chart.
|
|
359
|
+
*
|
|
360
|
+
* A bare function is drawn over the marks, which is what an extra label, a
|
|
361
|
+
* bracket or a custom threshold wants. The object form also reaches under
|
|
362
|
+
* them, for a region the data should sit on top of.
|
|
363
|
+
*/
|
|
364
|
+
type ChartOverlay = ChartOverlayRenderer | {
|
|
365
|
+
under?: ChartOverlayRenderer;
|
|
366
|
+
over?: ChartOverlayRenderer;
|
|
367
|
+
};
|
|
368
|
+
/**
|
|
369
|
+
* A window dragged across a chart's category axis.
|
|
370
|
+
*
|
|
371
|
+
* Both ends are inclusive, and both are given twice: as the x values a reader
|
|
372
|
+
* selected, and as the row indices they cover — filtering a dataset wants the
|
|
373
|
+
* indices, feeding a period picker wants the values.
|
|
374
|
+
*/
|
|
375
|
+
interface ChartBrushRange {
|
|
376
|
+
from: ChartXValue;
|
|
377
|
+
to: ChartXValue;
|
|
378
|
+
fromIndex: number;
|
|
379
|
+
toIndex: number;
|
|
380
|
+
}
|
|
381
|
+
/**
|
|
382
|
+
* What a panel carries besides its data.
|
|
383
|
+
*
|
|
384
|
+
* The three states are mutually exclusive and ranked: a chart that failed is
|
|
385
|
+
* not a chart that is empty, and a chart that is loading again is neither.
|
|
386
|
+
*/
|
|
387
|
+
interface ChartStatusProps {
|
|
388
|
+
/** Dims the plot while fresh data loads; a first load shows a spinner. */
|
|
389
|
+
loading?: boolean;
|
|
390
|
+
/** Replaces the "no data" message. */
|
|
391
|
+
emptyState?: ReactNode;
|
|
392
|
+
/**
|
|
393
|
+
* The data could not be loaded.
|
|
394
|
+
*
|
|
395
|
+
* Never the same thing as having none: a panel that says "no data" after a
|
|
396
|
+
* failed request states something false, and offers no way out.
|
|
397
|
+
*/
|
|
398
|
+
error?: boolean;
|
|
399
|
+
/** Replaces the whole built-in error state, message and button included. */
|
|
400
|
+
errorState?: ReactNode;
|
|
401
|
+
/** Draws the retry button in the error state, and is called when pressed. */
|
|
402
|
+
onRetry?: () => void;
|
|
403
|
+
/**
|
|
404
|
+
* Slot on the right of the caption: an export button, a range picker.
|
|
405
|
+
*
|
|
406
|
+
* A filter that frames several panels belongs in a `ChartFilterBar` above
|
|
407
|
+
* all of them; this is for what belongs to *this* panel alone.
|
|
408
|
+
*/
|
|
409
|
+
actions?: ReactNode;
|
|
410
|
+
}
|
|
268
411
|
/**
|
|
269
412
|
* Props shared by every cartesian chart of the kit. Each chart adds its own
|
|
270
413
|
* geometry on top — `curve` for lines, `stack` for areas and bars, and so on.
|
|
271
414
|
*/
|
|
272
|
-
interface CartesianChartBaseProps {
|
|
415
|
+
interface CartesianChartBaseProps extends ChartStatusProps {
|
|
273
416
|
data: ChartDatum[];
|
|
274
417
|
series: ChartSeries[];
|
|
275
418
|
x: ChartXAxisConfig;
|
|
@@ -289,8 +432,8 @@ interface CartesianChartBaseProps {
|
|
|
289
432
|
emphasis?: string;
|
|
290
433
|
title?: ReactNode;
|
|
291
434
|
description?: ReactNode;
|
|
292
|
-
|
|
293
|
-
|
|
435
|
+
/** Draws inside the plot, with the chart's own resolved geometry. */
|
|
436
|
+
overlay?: ChartOverlay;
|
|
294
437
|
onPointClick?: (event: ChartPointEvent) => void;
|
|
295
438
|
className?: string;
|
|
296
439
|
}
|
|
@@ -317,7 +460,48 @@ interface AreaChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWit
|
|
|
317
460
|
baseline?: number;
|
|
318
461
|
connectNulls?: boolean;
|
|
319
462
|
referenceLines?: ChartReferenceLine[];
|
|
463
|
+
/**
|
|
464
|
+
* What happened, drawn where it happened: a release, a campaign, an outage.
|
|
465
|
+
*
|
|
466
|
+
* The counterpart of `referenceLines`, which marks a threshold on the value
|
|
467
|
+
* axis. Bands are drawn under the areas, rules and pinned points over them.
|
|
468
|
+
*/
|
|
469
|
+
annotations?: ChartAnnotation[];
|
|
470
|
+
/**
|
|
471
|
+
* Draws each band with a texture on top of its colour.
|
|
472
|
+
*
|
|
473
|
+
* The channel a reader falls back on when the hue fails them: severe colour
|
|
474
|
+
* vision deficiency, a grayscale print, a forced-colours theme. Off by
|
|
475
|
+
* default — it is an accessibility option, not a decoration.
|
|
476
|
+
*
|
|
477
|
+
* Only the bands of a stack take one. An overlay's fill is a 12% wash, thin
|
|
478
|
+
* enough that no texture survives it, and there the identity is carried by
|
|
479
|
+
* the edge line rather than by the surface under it.
|
|
480
|
+
*/
|
|
481
|
+
patterns?: boolean;
|
|
320
482
|
legendToggle?: boolean;
|
|
483
|
+
/**
|
|
484
|
+
* Thins the drawn bands to roughly this many points per series.
|
|
485
|
+
*
|
|
486
|
+
* Runs the path through LTTB, which keeps the peaks a stride sample walks
|
|
487
|
+
* straight past. Only the paths are thinned: the geometry, the crosshair,
|
|
488
|
+
* the tooltip and the data table keep reading every row. Left unset, a
|
|
489
|
+
* series past `CHART_POINT_BUDGET` warns once in development.
|
|
490
|
+
*/
|
|
491
|
+
maxPoints?: number;
|
|
492
|
+
/**
|
|
493
|
+
* Lets a pointer drag a window across the category axis.
|
|
494
|
+
*
|
|
495
|
+
* Shift + arrows does the same from the keyboard, Escape drops it, and the
|
|
496
|
+
* window is published to the surrounding `ChartSyncProvider`.
|
|
497
|
+
*/
|
|
498
|
+
brush?: boolean;
|
|
499
|
+
/** Called when a window is set, and with `null` when one is dropped. */
|
|
500
|
+
onBrush?: (range: ChartBrushRange | null) => void;
|
|
501
|
+
/** Accessible name of the selected window. */
|
|
502
|
+
brushLabel?: string;
|
|
503
|
+
/** `false` keeps the chart out of the surrounding `ChartSyncProvider`. */
|
|
504
|
+
sync?: boolean;
|
|
321
505
|
margin?: Partial<ChartMargin>;
|
|
322
506
|
locale?: string;
|
|
323
507
|
plotLabel?: string;
|
|
@@ -333,7 +517,7 @@ interface AreaChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWit
|
|
|
333
517
|
* bands, separated by 2px of the surface colour rather than by a border drawn
|
|
334
518
|
* around each one.
|
|
335
519
|
*/
|
|
336
|
-
declare function AreaChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, onPointClick, curve, stack, baseline, connectNulls, referenceLines, legendToggle, margin, locale, plotLabel, className, ...props }: AreaChartProps): react_jsx_runtime.JSX.Element;
|
|
520
|
+
declare function AreaChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, error, errorState, onRetry, actions, onPointClick, curve, stack, baseline, connectNulls, referenceLines, annotations, overlay, patterns, legendToggle, maxPoints, brush, onBrush, brushLabel, sync, margin, locale, plotLabel, className, ...props }: AreaChartProps): react_jsx_runtime.JSX.Element;
|
|
337
521
|
|
|
338
522
|
interface AvatarProps extends ComponentPropsWithoutRef<"div"> {
|
|
339
523
|
src?: string;
|
|
@@ -362,14 +546,147 @@ declare namespace Badge {
|
|
|
362
546
|
var displayName: string;
|
|
363
547
|
}
|
|
364
548
|
|
|
549
|
+
interface LinearScale {
|
|
550
|
+
/** Maps a value to a pixel position. */
|
|
551
|
+
(value: number): number;
|
|
552
|
+
/** Maps a pixel position back to a value. */
|
|
553
|
+
invert(pixel: number): number;
|
|
554
|
+
readonly domain: readonly [number, number];
|
|
555
|
+
readonly range: readonly [number, number];
|
|
556
|
+
}
|
|
557
|
+
|
|
365
558
|
/**
|
|
366
559
|
* Which screen axis carries the values.
|
|
367
560
|
*
|
|
368
|
-
*
|
|
369
|
-
*
|
|
370
|
-
* category names are long enough to be unreadable rotated.
|
|
561
|
+
* The public spelling is `ChartOrientation`, declared beside the other types
|
|
562
|
+
* an application can see; this alias is what the engine has always called it.
|
|
371
563
|
*/
|
|
372
|
-
type CartesianOrientation =
|
|
564
|
+
type CartesianOrientation = ChartOrientation;
|
|
565
|
+
/**
|
|
566
|
+
* How a row takes its place along the category axis.
|
|
567
|
+
*
|
|
568
|
+
* `point` spaces the rows evenly with the first and last on the edges, which
|
|
569
|
+
* is what a line or an area is plotted against. `band` gives each row a slot
|
|
570
|
+
* of its own, which is what a bar needs to have a width.
|
|
571
|
+
*/
|
|
572
|
+
type CategoryPlacement = "point" | "band";
|
|
573
|
+
interface CartesianGeometryOptions {
|
|
574
|
+
/** Measured width of the plot area — never the `width` prop, which is usually unset. */
|
|
575
|
+
width: number;
|
|
576
|
+
height: number;
|
|
577
|
+
data: readonly ChartDatum[];
|
|
578
|
+
/** Describes the category axis, whichever side the orientation puts it on. */
|
|
579
|
+
x: ChartXAxisConfig;
|
|
580
|
+
/** Describes the value axis. */
|
|
581
|
+
y?: ChartYAxisConfig;
|
|
582
|
+
/**
|
|
583
|
+
* Bounds the value axis has to cover, before rounding.
|
|
584
|
+
*
|
|
585
|
+
* The caller computes them, because they are not always the extent of the
|
|
586
|
+
* raw values: a stacked chart measures its totals, not its series.
|
|
587
|
+
*/
|
|
588
|
+
bounds: [number, number] | null;
|
|
589
|
+
margin?: Partial<ChartMargin>;
|
|
590
|
+
orientation?: CartesianOrientation;
|
|
591
|
+
placement?: CategoryPlacement;
|
|
592
|
+
/** Share of a band left empty between two neighbours. */
|
|
593
|
+
bandPaddingInner?: number;
|
|
594
|
+
formatValue: (value: number) => string;
|
|
595
|
+
formatX: (value: ChartXValue, index: number) => string;
|
|
596
|
+
/** Extra room at the top, for a caption drawn above the plot. */
|
|
597
|
+
extraTop?: number;
|
|
598
|
+
/**
|
|
599
|
+
* Whether zero stays inside the domain when the axis config does not say.
|
|
600
|
+
*
|
|
601
|
+
* A bar is read for the length of its mark, so it needs its baseline; a line
|
|
602
|
+
* is read for its slope, and forcing zero flattens the change.
|
|
603
|
+
*/
|
|
604
|
+
defaultIncludeZero?: boolean;
|
|
605
|
+
}
|
|
606
|
+
interface CartesianGeometry {
|
|
607
|
+
margin: ChartMargin;
|
|
608
|
+
innerWidth: number;
|
|
609
|
+
innerHeight: number;
|
|
610
|
+
orientation: CartesianOrientation;
|
|
611
|
+
/** Maps a value to a pixel along the value axis. */
|
|
612
|
+
valueScale: LinearScale;
|
|
613
|
+
/** Rounded bounds of the value axis. */
|
|
614
|
+
domain: [number, number];
|
|
615
|
+
valueTicks: ChartTick[];
|
|
616
|
+
/** The x value of each row, in row order. */
|
|
617
|
+
xValues: ChartXValue[];
|
|
618
|
+
/** Where each row starts along the category axis. */
|
|
619
|
+
categoryPositions: number[];
|
|
620
|
+
/** Width of a band — `0` under a point placement. */
|
|
621
|
+
bandwidth: number;
|
|
622
|
+
/** Middle of a row's slot: where a tick, a line point or a hover lands. */
|
|
623
|
+
categoryCenters: number[];
|
|
624
|
+
categoryTicks: ChartTick[];
|
|
625
|
+
/** Length of the category axis in pixels. */
|
|
626
|
+
categoryLength: number;
|
|
627
|
+
/**
|
|
628
|
+
* The category axis as a continuous scale, when it is one.
|
|
629
|
+
*
|
|
630
|
+
* `null` for a list of categories, where a value that is not in the data
|
|
631
|
+
* has no position at all. It is what lets an overlay place a date the rows
|
|
632
|
+
* never carry — an annotation on the 14th of a weekly series.
|
|
633
|
+
*/
|
|
634
|
+
categoryScale: LinearScale | null;
|
|
635
|
+
}
|
|
636
|
+
/**
|
|
637
|
+
* Everything a cartesian chart needs to place a mark, computed once.
|
|
638
|
+
*
|
|
639
|
+
* A pure function on purpose: it is the part of a chart that can be wrong in a
|
|
640
|
+
* way no rendering test would catch, and it is the part every cartesian chart
|
|
641
|
+
* of the kit shares. Line, area and bar differ in the mark they draw over this,
|
|
642
|
+
* not in how they lay it out.
|
|
643
|
+
*
|
|
644
|
+
* It speaks in value and category axes rather than x and y, because a
|
|
645
|
+
* horizontal bar chart swaps which screen axis carries which.
|
|
646
|
+
*/
|
|
647
|
+
declare function buildCartesianGeometry({ width, height, data, x, y, bounds, margin, orientation, placement, bandPaddingInner, formatValue, formatX, extraTop, defaultIncludeZero, }: CartesianGeometryOptions): CartesianGeometry;
|
|
648
|
+
/**
|
|
649
|
+
* Where a raw x value lands on the category axis, in pixels.
|
|
650
|
+
*
|
|
651
|
+
* Two axes, one question. A continuous axis can place a value the data never
|
|
652
|
+
* carries, which is exactly what an annotation on an arbitrary date needs; a
|
|
653
|
+
* list of categories cannot, so a value it does not hold answers `null` and
|
|
654
|
+
* the caller skips the mark rather than drawing it on the edge.
|
|
655
|
+
*
|
|
656
|
+
* A position outside the plot answers `null` for the same reason: overlays are
|
|
657
|
+
* drawn without a clip path, and an out-of-window date would otherwise land in
|
|
658
|
+
* the axis gutter.
|
|
659
|
+
*/
|
|
660
|
+
declare function createCategoryLocator(geometry: Pick<CartesianGeometry, "categoryScale" | "xValues" | "categoryCenters" | "categoryLength">): (value: ChartXValue) => number | null;
|
|
661
|
+
/**
|
|
662
|
+
* The resolved geometry of a plot, in the shape an application can draw with.
|
|
663
|
+
*
|
|
664
|
+
* The chart already holds every one of these; this only gathers them behind
|
|
665
|
+
* one type, so that `overlay` is a contract the kit can keep rather than a
|
|
666
|
+
* bag of whatever a chart happened to have in scope.
|
|
667
|
+
*/
|
|
668
|
+
declare function createPlotContext({ geometry, width, height, data, series, formatValue, formatX, }: {
|
|
669
|
+
geometry: CartesianGeometry;
|
|
670
|
+
/** Total width of the SVG, gutters included. */
|
|
671
|
+
width: number;
|
|
672
|
+
height: number;
|
|
673
|
+
data: readonly ChartDatum[];
|
|
674
|
+
/** The visible series only — an overlay should not draw a hidden one. */
|
|
675
|
+
series: readonly ChartResolvedSeries[];
|
|
676
|
+
formatValue: (value: number) => string;
|
|
677
|
+
formatX: (value: ChartXValue, index: number) => string;
|
|
678
|
+
}): ChartPlotContext;
|
|
679
|
+
/**
|
|
680
|
+
* An overlay in its two halves, whichever form it was given in.
|
|
681
|
+
*
|
|
682
|
+
* A bare function draws over the marks, which is what a label, a bracket or a
|
|
683
|
+
* custom threshold wants. Reaching under them is the rarer case and says so by
|
|
684
|
+
* taking the object form.
|
|
685
|
+
*/
|
|
686
|
+
declare function splitOverlay(overlay: ChartOverlay | undefined): {
|
|
687
|
+
under?: ChartOverlayRenderer;
|
|
688
|
+
over?: ChartOverlayRenderer;
|
|
689
|
+
};
|
|
373
690
|
|
|
374
691
|
/**
|
|
375
692
|
* Binning, for the one chart that counts rather than reads a measure.
|
|
@@ -418,7 +735,7 @@ declare function binEdges(values: readonly number[], spec?: BinSpec): number[];
|
|
|
418
735
|
*/
|
|
419
736
|
declare function binValues(values: readonly (number | null | undefined)[], spec?: BinSpec): HistogramBin[];
|
|
420
737
|
|
|
421
|
-
/** Resets the
|
|
738
|
+
/** Resets the one-shot warnings. Test helper. */
|
|
422
739
|
declare function resetBarChartWarnings(): void;
|
|
423
740
|
type BarChartOrientation = CartesianOrientation;
|
|
424
741
|
interface BarChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWithoutRef<"figure">, keyof CartesianChartBaseProps | "children" | "title"> {
|
|
@@ -478,7 +795,42 @@ interface BarChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWith
|
|
|
478
795
|
/** Draws the value at the end of each bar, where it fits without collision. */
|
|
479
796
|
showValues?: boolean;
|
|
480
797
|
referenceLines?: ChartReferenceLine[];
|
|
798
|
+
/**
|
|
799
|
+
* What happened, drawn where it happened: a release, a campaign, an outage.
|
|
800
|
+
*
|
|
801
|
+
* Read on the category axis, so a **vertical** chart alone takes them: the
|
|
802
|
+
* horizontal one runs its categories up the side, and a moment placed there
|
|
803
|
+
* is not a moment any more. They are ignored, with a warning, when the bars
|
|
804
|
+
* are laid out horizontally.
|
|
805
|
+
*/
|
|
806
|
+
annotations?: ChartAnnotation[];
|
|
807
|
+
/**
|
|
808
|
+
* Draws each series with a texture on top of its colour.
|
|
809
|
+
*
|
|
810
|
+
* The channel a reader falls back on when the hue fails them: severe colour
|
|
811
|
+
* vision deficiency, a grayscale print, a forced-colours theme. Off by
|
|
812
|
+
* default — it is an accessibility option, not a decoration, and a textured
|
|
813
|
+
* chart nobody needs textured is just a busier chart.
|
|
814
|
+
*
|
|
815
|
+
* Ignored where the bars are painted by their own value (a lone series
|
|
816
|
+
* against a reference): the ramp measures a magnitude, and a texture can
|
|
817
|
+
* only say which series a mark belongs to.
|
|
818
|
+
*/
|
|
819
|
+
patterns?: boolean;
|
|
481
820
|
legendToggle?: boolean;
|
|
821
|
+
/**
|
|
822
|
+
* Lets a pointer drag a window across the category axis.
|
|
823
|
+
*
|
|
824
|
+
* Shift + arrows does the same from the keyboard, Escape drops it, and the
|
|
825
|
+
* window is published to the surrounding `ChartSyncProvider`.
|
|
826
|
+
*/
|
|
827
|
+
brush?: boolean;
|
|
828
|
+
/** Called when a window is set, and with `null` when one is dropped. */
|
|
829
|
+
onBrush?: (range: ChartBrushRange | null) => void;
|
|
830
|
+
/** Accessible name of the selected window. */
|
|
831
|
+
brushLabel?: string;
|
|
832
|
+
/** `false` keeps the chart out of the surrounding `ChartSyncProvider`. */
|
|
833
|
+
sync?: boolean;
|
|
482
834
|
margin?: Partial<ChartMargin>;
|
|
483
835
|
locale?: string;
|
|
484
836
|
plotLabel?: string;
|
|
@@ -494,7 +846,7 @@ interface BarChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWith
|
|
|
494
846
|
* is read for the length of its mark, and an axis starting at 40 exaggerates
|
|
495
847
|
* every difference on the chart.
|
|
496
848
|
*/
|
|
497
|
-
declare function BarChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, onPointClick, orientation, stack, diverging, bins, curve, barSize, sort, showValues, referenceLines, legendToggle, margin, locale, plotLabel, className, ...props }: BarChartProps): react_jsx_runtime.JSX.Element;
|
|
849
|
+
declare function BarChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, error, errorState, onRetry, actions, onPointClick, orientation, stack, diverging, bins, curve, barSize, sort, showValues, referenceLines, annotations, overlay, patterns, legendToggle, brush, onBrush, brushLabel, sync, margin, locale, plotLabel, className, ...props }: BarChartProps): react_jsx_runtime.JSX.Element;
|
|
498
850
|
|
|
499
851
|
type BannerVariant = "notification" | "hero" | "promotion";
|
|
500
852
|
type BannerType = "info" | "success" | "warning" | "error" | "default";
|
|
@@ -534,7 +886,7 @@ interface BreadcrumbProps extends ComponentPropsWithoutRef<"nav"> {
|
|
|
534
886
|
}
|
|
535
887
|
declare function Breadcrumb({ items, separator, size, maxItems, itemColor, activeColor, separatorColor, className, ...props }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
|
|
536
888
|
|
|
537
|
-
interface BulletChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
889
|
+
interface BulletChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
538
890
|
/** One row per measure. */
|
|
539
891
|
data: ChartDatum[];
|
|
540
892
|
/** Field holding the name of each row. */
|
|
@@ -571,8 +923,6 @@ interface BulletChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "chi
|
|
|
571
923
|
tableView?: boolean | "toggle";
|
|
572
924
|
title?: ReactNode;
|
|
573
925
|
description?: ReactNode;
|
|
574
|
-
loading?: boolean;
|
|
575
|
-
emptyState?: ReactNode;
|
|
576
926
|
locale?: string;
|
|
577
927
|
plotLabel?: string;
|
|
578
928
|
/** Header of the value column of the data table. */
|
|
@@ -609,7 +959,7 @@ interface BulletRow {
|
|
|
609
959
|
* common axis to read across rows: pass `normalize="shared"` (or a `domain`)
|
|
610
960
|
* when the rows carry the same unit, and the value axis comes back.
|
|
611
961
|
*/
|
|
612
|
-
declare function BulletChart({ data, x, value, target, ranges, domain, normalize, showValues, trackSize, rangeColors, color, height, width, size, tooltip, tableView, title, description, loading, emptyState, locale, plotLabel, valueLabel, targetLabel, format, onRowClick, className, ...props }: BulletChartProps): react_jsx_runtime.JSX.Element;
|
|
962
|
+
declare function BulletChart({ data, x, value, target, ranges, domain, normalize, showValues, trackSize, rangeColors, color, height, width, size, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, locale, plotLabel, valueLabel, targetLabel, format, onRowClick, className, ...props }: BulletChartProps): react_jsx_runtime.JSX.Element;
|
|
613
963
|
|
|
614
964
|
interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
|
|
615
965
|
label?: string;
|
|
@@ -892,7 +1242,7 @@ interface BoxPlotBox {
|
|
|
892
1242
|
mean: number | null;
|
|
893
1243
|
datum: ChartDatum;
|
|
894
1244
|
}
|
|
895
|
-
interface BoxPlotProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
1245
|
+
interface BoxPlotProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
896
1246
|
/** One row per category compared. */
|
|
897
1247
|
data: ChartDatum[];
|
|
898
1248
|
/** Field holding the name of each category. */
|
|
@@ -942,8 +1292,6 @@ interface BoxPlotProps extends Omit<ComponentPropsWithoutRef<"figure">, "childre
|
|
|
942
1292
|
tableView?: boolean | "toggle";
|
|
943
1293
|
title?: ReactNode;
|
|
944
1294
|
description?: ReactNode;
|
|
945
|
-
loading?: boolean;
|
|
946
|
-
emptyState?: ReactNode;
|
|
947
1295
|
margin?: Partial<ChartMargin>;
|
|
948
1296
|
locale?: string;
|
|
949
1297
|
plotLabel?: string;
|
|
@@ -968,7 +1316,7 @@ interface BoxPlotProps extends Omit<ComponentPropsWithoutRef<"figure">, "childre
|
|
|
968
1316
|
* with a panel each, which keeps them on a shared scale without asking the
|
|
969
1317
|
* reader to hold two colour legends at once.
|
|
970
1318
|
*/
|
|
971
|
-
declare function BoxPlot({ data, x, y, values, quantiles, whisker, orientation, boxSize, showOutliers, showMean, color, referenceLines, height, width, size, grid, tooltip, tableView, title, description, loading, emptyState, margin, locale, plotLabel, format, onBoxClick, className, ...props }: BoxPlotProps): react_jsx_runtime.JSX.Element;
|
|
1319
|
+
declare function BoxPlot({ data, x, y, values, quantiles, whisker, orientation, boxSize, showOutliers, showMean, color, referenceLines, height, width, size, grid, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, margin, locale, plotLabel, format, onBoxClick, className, ...props }: BoxPlotProps): react_jsx_runtime.JSX.Element;
|
|
972
1320
|
|
|
973
1321
|
/** One session, as the tooltip and the click handler see it. */
|
|
974
1322
|
interface Candle {
|
|
@@ -985,7 +1333,7 @@ interface Candle {
|
|
|
985
1333
|
rising: boolean;
|
|
986
1334
|
datum: ChartDatum;
|
|
987
1335
|
}
|
|
988
|
-
interface CandlestickChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
1336
|
+
interface CandlestickChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
989
1337
|
/** One row per session. */
|
|
990
1338
|
data: ChartDatum[];
|
|
991
1339
|
/** Field holding the session's label — usually a date. */
|
|
@@ -1025,8 +1373,6 @@ interface CandlestickChartProps extends Omit<ComponentPropsWithoutRef<"figure">,
|
|
|
1025
1373
|
tableView?: boolean | "toggle";
|
|
1026
1374
|
title?: ReactNode;
|
|
1027
1375
|
description?: ReactNode;
|
|
1028
|
-
loading?: boolean;
|
|
1029
|
-
emptyState?: ReactNode;
|
|
1030
1376
|
margin?: Partial<ChartMargin>;
|
|
1031
1377
|
locale?: string;
|
|
1032
1378
|
plotLabel?: string;
|
|
@@ -1057,7 +1403,7 @@ interface CandlestickChartProps extends Omit<ComponentPropsWithoutRef<"figure">,
|
|
|
1057
1403
|
* its movement; a share worth 180 dollars read from zero is a flat band at
|
|
1058
1404
|
* the top of the plot.
|
|
1059
1405
|
*/
|
|
1060
|
-
declare function CandlestickChart({ data, x, y, open, high, low, close, candleSize, fillRising, colors, referenceLines, height, width, size, grid, legend, tooltip, tableView, title, description, loading, emptyState, margin, locale, plotLabel, openLabel, highLabel, lowLabel, closeLabel, riseLabel, fallLabel, format, onCandleClick, className, ...props }: CandlestickChartProps): react_jsx_runtime.JSX.Element;
|
|
1406
|
+
declare function CandlestickChart({ data, x, y, open, high, low, close, candleSize, fillRising, colors, referenceLines, height, width, size, grid, legend, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, margin, locale, plotLabel, openLabel, highLabel, lowLabel, closeLabel, riseLabel, fallLabel, format, onCandleClick, className, ...props }: CandlestickChartProps): react_jsx_runtime.JSX.Element;
|
|
1061
1407
|
|
|
1062
1408
|
/** Geometry handed to the render prop once the container has been measured. */
|
|
1063
1409
|
interface ChartContainerRenderArgs {
|
|
@@ -1087,6 +1433,25 @@ interface ChartContainerProps extends Omit<ComponentPropsWithoutRef<"figure">, "
|
|
|
1087
1433
|
/** The chart has nothing to draw. */
|
|
1088
1434
|
empty?: boolean;
|
|
1089
1435
|
emptyState?: ReactNode;
|
|
1436
|
+
/**
|
|
1437
|
+
* The data could not be loaded.
|
|
1438
|
+
*
|
|
1439
|
+
* Deliberately separate from `empty`: "there is nothing to show" and "we
|
|
1440
|
+
* failed to fetch it" are two different statements, and a panel that says
|
|
1441
|
+
* the first after a failed request is saying something false. Only this one
|
|
1442
|
+
* offers a way out, through `onRetry`.
|
|
1443
|
+
*
|
|
1444
|
+
* A truthy `loading` wins over it, so a retry replaces the message with the
|
|
1445
|
+
* spinner rather than leaving the reader wondering whether anything happened.
|
|
1446
|
+
*/
|
|
1447
|
+
error?: boolean;
|
|
1448
|
+
/** Replaces the whole built-in error state, message and button included. */
|
|
1449
|
+
errorState?: ReactNode;
|
|
1450
|
+
/** Draws the retry button, and is called when it is pressed. */
|
|
1451
|
+
onRetry?: () => void;
|
|
1452
|
+
errorLabel?: string;
|
|
1453
|
+
errorHintLabel?: string;
|
|
1454
|
+
retryLabel?: string;
|
|
1090
1455
|
/** The data table twin, usually a `ChartTableView`. */
|
|
1091
1456
|
table?: ReactNode;
|
|
1092
1457
|
/** `true` keeps the table open, `"toggle"` puts it behind a button. */
|
|
@@ -1104,13 +1469,14 @@ interface ChartContainerProps extends Omit<ComponentPropsWithoutRef<"figure">, "
|
|
|
1104
1469
|
* The frame every chart of the kit is drawn in.
|
|
1105
1470
|
*
|
|
1106
1471
|
* It owns what is identical from one chart to the next — measured width,
|
|
1107
|
-
* caption, legend slot, loading and
|
|
1108
|
-
* so that a chart component is left with its geometry and
|
|
1472
|
+
* caption, legend slot, the loading, empty and error states, and the data
|
|
1473
|
+
* table toggle — so that a chart component is left with its geometry and
|
|
1474
|
+
* nothing else.
|
|
1109
1475
|
*
|
|
1110
1476
|
* The plot area is a render prop: a chart cannot lay itself out before the
|
|
1111
1477
|
* container has been measured.
|
|
1112
1478
|
*/
|
|
1113
|
-
declare function ChartContainer({ title, description, height, width: fixedWidth, size, legend, legendPosition, actions, loading, empty, emptyState, table, tableView, showTableLabel, hideTableLabel, noDataLabel, loadingLabel, ariaLabel, children, className, ...props }: ChartContainerProps): react_jsx_runtime.JSX.Element;
|
|
1479
|
+
declare function ChartContainer({ title, description, height, width: fixedWidth, size, legend, legendPosition, actions, loading, empty, emptyState, error, errorState, onRetry, errorLabel, errorHintLabel, retryLabel, table, tableView, showTableLabel, hideTableLabel, noDataLabel, loadingLabel, ariaLabel, children, className, ...props }: ChartContainerProps): react_jsx_runtime.JSX.Element;
|
|
1114
1480
|
|
|
1115
1481
|
type ChartAxisOrientation = "bottom" | "left";
|
|
1116
1482
|
interface ChartAxisProps extends Omit<ComponentPropsWithoutRef<"g">, "children"> {
|
|
@@ -1215,6 +1581,492 @@ interface ChartTooltipContentProps {
|
|
|
1215
1581
|
*/
|
|
1216
1582
|
declare function ChartTooltipContent({ title, points }: ChartTooltipContentProps): react_jsx_runtime.JSX.Element;
|
|
1217
1583
|
|
|
1584
|
+
interface ChartAnnotationLayerProps {
|
|
1585
|
+
annotations: readonly ChartAnnotation[];
|
|
1586
|
+
/**
|
|
1587
|
+
* Where an x value lands along the category axis, or `null` when it is not
|
|
1588
|
+
* on the plot at all — an annotation for a date outside the window is
|
|
1589
|
+
* skipped rather than drawn on the edge.
|
|
1590
|
+
*/
|
|
1591
|
+
xAt: (value: ChartXValue) => number | null;
|
|
1592
|
+
/** Where a value lands along the value axis. */
|
|
1593
|
+
yAt: (value: number) => number;
|
|
1594
|
+
/** Size of the plot area. */
|
|
1595
|
+
width: number;
|
|
1596
|
+
height: number;
|
|
1597
|
+
/**
|
|
1598
|
+
* Width of a band on the category axis, `0` on a point placement.
|
|
1599
|
+
*
|
|
1600
|
+
* A band annotation covers whole categories, so it reaches half a band past
|
|
1601
|
+
* the centres its ends resolve to — otherwise "March to May" is drawn from
|
|
1602
|
+
* the middle of March to the middle of May.
|
|
1603
|
+
*/
|
|
1604
|
+
bandwidth?: number;
|
|
1605
|
+
/**
|
|
1606
|
+
* Which half of the layer to draw.
|
|
1607
|
+
*
|
|
1608
|
+
* `under` holds the bands and goes below the marks — a region the data sits
|
|
1609
|
+
* in, not over it. `over` holds the rules and the pinned points, which are
|
|
1610
|
+
* worthless hidden behind an area. A chart renders the component twice, once
|
|
1611
|
+
* on each side of its series.
|
|
1612
|
+
*/
|
|
1613
|
+
layer?: "under" | "over";
|
|
1614
|
+
}
|
|
1615
|
+
/**
|
|
1616
|
+
* The annotation layer: what happened, drawn where it happened.
|
|
1617
|
+
*
|
|
1618
|
+
* Laid out behind the marks for the bands and over them for the lines and the
|
|
1619
|
+
* points. A band is a region the data sits in and belongs under it; a line is
|
|
1620
|
+
* a boundary and is worthless hidden behind an area.
|
|
1621
|
+
*
|
|
1622
|
+
* Everything here is chrome by default — grey, thin, dashed. An annotation
|
|
1623
|
+
* that draws the eye more strongly than the data has become the chart.
|
|
1624
|
+
*/
|
|
1625
|
+
declare function ChartAnnotationLayer({ annotations, xAt, yAt, width, height, bandwidth, layer, }: ChartAnnotationLayerProps): react_jsx_runtime.JSX.Element | null;
|
|
1626
|
+
/**
|
|
1627
|
+
* The annotations, as one sentence for the chart's accessible name.
|
|
1628
|
+
*
|
|
1629
|
+
* An SVG marked `role="img"` exposes its name and nothing inside it, so a
|
|
1630
|
+
* caption drawn on the plot is invisible to a screen reader. The comments are
|
|
1631
|
+
* half of what an annotated chart says, so they are appended to the name the
|
|
1632
|
+
* chart already carries rather than left on the picture alone.
|
|
1633
|
+
*/
|
|
1634
|
+
declare function describeAnnotations(annotations: readonly ChartAnnotation[] | undefined, prefix: string): string;
|
|
1635
|
+
|
|
1636
|
+
interface ChartBrushLayerProps {
|
|
1637
|
+
/** Where the window starts and ends along the category axis, in pixels. */
|
|
1638
|
+
from: number;
|
|
1639
|
+
to: number;
|
|
1640
|
+
/** Size of the drawing area. */
|
|
1641
|
+
width: number;
|
|
1642
|
+
height: number;
|
|
1643
|
+
/** Which screen axis the categories run along. */
|
|
1644
|
+
orientation?: ChartOrientation;
|
|
1645
|
+
/** Dashed while the pointer is still down, solid once the window is set. */
|
|
1646
|
+
live?: boolean;
|
|
1647
|
+
/** Names the region for assistive technology. */
|
|
1648
|
+
label?: string;
|
|
1649
|
+
}
|
|
1650
|
+
/**
|
|
1651
|
+
* The window a reader selected, drawn across the plot.
|
|
1652
|
+
*
|
|
1653
|
+
* Both edges are drawn as rules rather than left to the wash alone: the ends
|
|
1654
|
+
* of the window are the part a reader checks, and the boundary of a 14%
|
|
1655
|
+
* translucent band is not a line anybody can point at.
|
|
1656
|
+
*/
|
|
1657
|
+
declare function ChartBrushLayer({ from, to, width, height, orientation, live, label, }: ChartBrushLayerProps): react_jsx_runtime.JSX.Element | null;
|
|
1658
|
+
interface UseChartBrushOptions {
|
|
1659
|
+
/** `false` leaves every handler a no-op, so a chart can wire them anyway. */
|
|
1660
|
+
enabled: boolean;
|
|
1661
|
+
/**
|
|
1662
|
+
* Whether a window is currently set.
|
|
1663
|
+
*
|
|
1664
|
+
* A press that goes nowhere drops the window — otherwise a reader who has
|
|
1665
|
+
* brushed once has no way back but to brush again. Without knowing there is
|
|
1666
|
+
* one to drop, every ordinary click would fire a `null` nobody asked for.
|
|
1667
|
+
*/
|
|
1668
|
+
active: boolean;
|
|
1669
|
+
/** Middle of each row's slot along the category axis, in pixels. */
|
|
1670
|
+
centers: readonly number[];
|
|
1671
|
+
/** The x value of each row, in row order. */
|
|
1672
|
+
xValues: readonly ChartXValue[];
|
|
1673
|
+
/** Offset of the drawing area inside the SVG, on the axis the drag runs along. */
|
|
1674
|
+
offset: number;
|
|
1675
|
+
orientation: ChartOrientation;
|
|
1676
|
+
/** Called when a window is set, and with `null` when one is dropped. */
|
|
1677
|
+
onCommit: (range: ChartBrushRange | null) => void;
|
|
1678
|
+
}
|
|
1679
|
+
interface UseChartBrushResult {
|
|
1680
|
+
/** The window being dragged right now, or `null`. */
|
|
1681
|
+
dragging: ChartBrushRange | null;
|
|
1682
|
+
onPointerDown: (event: PointerEvent<SVGSVGElement>) => void;
|
|
1683
|
+
onPointerMove: (event: PointerEvent<SVGSVGElement>) => void;
|
|
1684
|
+
onPointerUp: (event: PointerEvent<SVGSVGElement>) => void;
|
|
1685
|
+
/**
|
|
1686
|
+
* Shift + arrows to extend the window, Escape to drop it.
|
|
1687
|
+
*
|
|
1688
|
+
* Never consumes the key: the chart's own handler still moves its crosshair
|
|
1689
|
+
* on the same press, which is what keeps the window's head and the focused
|
|
1690
|
+
* position in step. Keyboard parity is not optional here — a filter that can
|
|
1691
|
+
* only be set by dragging is a filter half the readers cannot reach.
|
|
1692
|
+
*/
|
|
1693
|
+
onKeyDown: (event: KeyboardEvent<SVGSVGElement>, focusedIndex: number | null) => void;
|
|
1694
|
+
/** `true` when the press that just ended was a drag, not a click. */
|
|
1695
|
+
consumedClick: () => boolean;
|
|
1696
|
+
}
|
|
1697
|
+
/**
|
|
1698
|
+
* Dragging a window across a chart's category axis.
|
|
1699
|
+
*
|
|
1700
|
+
* The gesture the whole of `ChartSyncProvider` exists for: a reader pulls a
|
|
1701
|
+
* fortnight on the line and the dashboard is read over that fortnight. It has
|
|
1702
|
+
* to live in the plot rather than in a strip of its own, because the range
|
|
1703
|
+
* being chosen is a range *of the data on screen* — a second miniature chart
|
|
1704
|
+
* under the first would be a different picture to aim at.
|
|
1705
|
+
*/
|
|
1706
|
+
declare function useChartBrush({ enabled, active, centers, xValues, offset, orientation, onCommit, }: UseChartBrushOptions): UseChartBrushResult;
|
|
1707
|
+
|
|
1708
|
+
/**
|
|
1709
|
+
* The periods a dashboard is read over, resolved to real dates.
|
|
1710
|
+
*
|
|
1711
|
+
* Pure functions on purpose: "the last 30 days" is the kind of thing that is
|
|
1712
|
+
* wrong by one day for a month before anybody notices, and it is much easier
|
|
1713
|
+
* to pin down here than through a rendered picker.
|
|
1714
|
+
*/
|
|
1715
|
+
/** The windows a filter row offers by name. */
|
|
1716
|
+
type ChartPeriodPreset = "7d" | "30d" | "90d" | "12m" | "mtd" | "qtd" | "ytd" | "custom";
|
|
1717
|
+
/** A resolved window: where it came from, and the two dates it covers. */
|
|
1718
|
+
interface ChartPeriod {
|
|
1719
|
+
/** The entry that produced it. `custom` when the dates were picked by hand. */
|
|
1720
|
+
preset: ChartPeriodPreset;
|
|
1721
|
+
from: Date;
|
|
1722
|
+
to: Date;
|
|
1723
|
+
}
|
|
1724
|
+
/** The presets a picker offers when it is not told otherwise. */
|
|
1725
|
+
declare const DEFAULT_CHART_PERIOD_PRESETS: readonly ChartPeriodPreset[];
|
|
1726
|
+
/** Midnight at the start of a day, in the reader's own time zone. */
|
|
1727
|
+
declare function startOfDay(date: Date): Date;
|
|
1728
|
+
/**
|
|
1729
|
+
* The last millisecond of a day.
|
|
1730
|
+
*
|
|
1731
|
+
* A window ending at midnight drops everything that happened during its last
|
|
1732
|
+
* day — the single most common off-by-one in a dashboard.
|
|
1733
|
+
*/
|
|
1734
|
+
declare function endOfDay(date: Date): Date;
|
|
1735
|
+
/**
|
|
1736
|
+
* Resolves a named window against a reference moment.
|
|
1737
|
+
*
|
|
1738
|
+
* "The last 7 days" counts today as one of them, which is what a reader
|
|
1739
|
+
* expects from a figure that includes what happened this morning.
|
|
1740
|
+
*/
|
|
1741
|
+
declare function resolvePeriodPreset(preset: ChartPeriodPreset, now?: Date): {
|
|
1742
|
+
from: Date;
|
|
1743
|
+
to: Date;
|
|
1744
|
+
};
|
|
1745
|
+
/** A named window, resolved into the period a chart is filtered by. */
|
|
1746
|
+
declare function createPeriod(preset: ChartPeriodPreset, now?: Date): ChartPeriod;
|
|
1747
|
+
/**
|
|
1748
|
+
* The two ends of a window as one string.
|
|
1749
|
+
*
|
|
1750
|
+
* `formatRange` is what a locale expects here — it collapses the parts the two
|
|
1751
|
+
* dates share ("1 – 15 March 2026" rather than twice the month and the year).
|
|
1752
|
+
*/
|
|
1753
|
+
declare function formatPeriodRange(from: Date, to: Date, locale?: string): string;
|
|
1754
|
+
/** `true` when two periods cover the same window, to the millisecond. */
|
|
1755
|
+
declare function samePeriod(a: ChartPeriod | undefined, b: ChartPeriod | undefined): boolean;
|
|
1756
|
+
|
|
1757
|
+
/** What every panel of a synchronised group can see and change. */
|
|
1758
|
+
interface ChartSyncContextValue {
|
|
1759
|
+
/** The position under the pointer, in whichever panel the pointer is in. */
|
|
1760
|
+
hovered: ChartXValue | null;
|
|
1761
|
+
/** The window dragged on any panel of the group. */
|
|
1762
|
+
brush: ChartBrushRange | null;
|
|
1763
|
+
/** `false` when the group was told not to share the pointer. */
|
|
1764
|
+
hoverShared: boolean;
|
|
1765
|
+
setHovered: (value: ChartXValue | null) => void;
|
|
1766
|
+
setBrush: (range: ChartBrushRange | null) => void;
|
|
1767
|
+
}
|
|
1768
|
+
/**
|
|
1769
|
+
* The group a chart belongs to, or `null` when it stands alone.
|
|
1770
|
+
*
|
|
1771
|
+
* Public because the two things a group carries — where the pointer is, and
|
|
1772
|
+
* what window is selected — are exactly what a panel that is *not* a chart
|
|
1773
|
+
* needs to stay in step: a legend, a figure beside the row, a table.
|
|
1774
|
+
*/
|
|
1775
|
+
declare function useChartSync(): ChartSyncContextValue | null;
|
|
1776
|
+
interface ChartSyncProviderProps {
|
|
1777
|
+
children: ReactNode;
|
|
1778
|
+
/**
|
|
1779
|
+
* Shares the hovered position between the panels.
|
|
1780
|
+
*
|
|
1781
|
+
* The pointer draws a crosshair in every panel and a tooltip in one: four
|
|
1782
|
+
* tooltips at once is four things to read and no answer.
|
|
1783
|
+
*/
|
|
1784
|
+
hover?: boolean;
|
|
1785
|
+
/** Controlled selection. Leave unset to let the group hold its own. */
|
|
1786
|
+
brush?: ChartBrushRange | null;
|
|
1787
|
+
/** Starting selection of an uncontrolled group. */
|
|
1788
|
+
defaultBrush?: ChartBrushRange | null;
|
|
1789
|
+
/** Called whenever a panel commits a dragged window, or clears it with `null`. */
|
|
1790
|
+
onBrushChange?: (range: ChartBrushRange | null) => void;
|
|
1791
|
+
}
|
|
1792
|
+
/**
|
|
1793
|
+
* Several charts read as one object rather than as a row of pictures.
|
|
1794
|
+
*
|
|
1795
|
+
* `ChartFilterBar` made a dashboard a **frame**: one row of filters above
|
|
1796
|
+
* panels that therefore answer the same question. This makes it an **object**:
|
|
1797
|
+
* the pointer lands on a moment in one panel and every other panel marks the
|
|
1798
|
+
* same moment, and a window dragged on one is the window all of them show.
|
|
1799
|
+
*
|
|
1800
|
+
* Nothing is drawn here. The provider holds the two pieces of state a group
|
|
1801
|
+
* shares and hands them to whichever panels are inside it; a chart opts out
|
|
1802
|
+
* with `sync={false}`.
|
|
1803
|
+
*
|
|
1804
|
+
* ```tsx
|
|
1805
|
+
* const [period, setPeriod] = useState(() => createPeriod("30d"));
|
|
1806
|
+
*
|
|
1807
|
+
* <ChartSyncProvider onBrushChange={(range) => range && setPeriod(brushToPeriod(range))}>
|
|
1808
|
+
* <ChartFilterBar>
|
|
1809
|
+
* <ChartPeriodPicker value={period} onChange={setPeriod} />
|
|
1810
|
+
* </ChartFilterBar>
|
|
1811
|
+
* <LineChart brush data={rows} … />
|
|
1812
|
+
* <BarChart data={rows} … />
|
|
1813
|
+
* </ChartSyncProvider>
|
|
1814
|
+
* ```
|
|
1815
|
+
*/
|
|
1816
|
+
declare function ChartSyncProvider({ children, hover, brush, defaultBrush, onBrushChange, }: ChartSyncProviderProps): react_jsx_runtime.JSX.Element;
|
|
1817
|
+
/**
|
|
1818
|
+
* A dragged window, as the period a filter row is set to.
|
|
1819
|
+
*
|
|
1820
|
+
* The point of brushing: a reader drags a fortnight on the line and the
|
|
1821
|
+
* dashboard is now read over that fortnight. Both ends are widened to whole
|
|
1822
|
+
* days, the way `ChartPeriodPicker` resolves its own presets — a window ending
|
|
1823
|
+
* at midnight drops its own last day.
|
|
1824
|
+
*
|
|
1825
|
+
* Answers `null` when the axis that was brushed carries no date at all. It
|
|
1826
|
+
* cannot tell a timestamp from any other number, though — a time axis stores
|
|
1827
|
+
* its values as numbers, and so does a linear one. Call it on a chart whose x
|
|
1828
|
+
* axis carries dates; on any other the window it returns is arithmetic rather
|
|
1829
|
+
* than a period.
|
|
1830
|
+
*/
|
|
1831
|
+
declare function brushToPeriod(range: ChartBrushRange): ChartPeriod | null;
|
|
1832
|
+
|
|
1833
|
+
/**
|
|
1834
|
+
* What a chart hands to a file.
|
|
1835
|
+
*
|
|
1836
|
+
* The same rows its data table draws, which is the point: `DataGrid` has
|
|
1837
|
+
* exported CSV and JSON since it shipped, and a chart holds an exact table of
|
|
1838
|
+
* its own already. Every value a reader can see is a value they can take away.
|
|
1839
|
+
*/
|
|
1840
|
+
interface ChartExportOptions {
|
|
1841
|
+
data: readonly ChartDatum[];
|
|
1842
|
+
series: readonly ChartSeries[];
|
|
1843
|
+
/** Field the rows are keyed on — the chart's x axis. */
|
|
1844
|
+
xKey: string;
|
|
1845
|
+
/** Header of the first column. Defaults to `xKey`. */
|
|
1846
|
+
xLabel?: string;
|
|
1847
|
+
/**
|
|
1848
|
+
* Formats the category of each row.
|
|
1849
|
+
*
|
|
1850
|
+
* Only the category: the measurements are written raw on purpose. A
|
|
1851
|
+
* spreadsheet is going to compute on them, and `1 234,5 €` is a string.
|
|
1852
|
+
*/
|
|
1853
|
+
formatX?: (value: ChartXValue, index: number) => string;
|
|
1854
|
+
}
|
|
1855
|
+
/** One exported row: the category, then one column per visible series. */
|
|
1856
|
+
type ChartExportRow = Record<string, string | number | null>;
|
|
1857
|
+
/** The chart's rows, in the shape a file wants: one object per row. */
|
|
1858
|
+
declare function toChartRows({ data, series, xKey, xLabel, formatX, }: ChartExportOptions): ChartExportRow[];
|
|
1859
|
+
/** The chart's data table as a CSV document. */
|
|
1860
|
+
declare function toChartCsv(options: ChartExportOptions, delimiter?: string): string;
|
|
1861
|
+
/** The chart's data table as a JSON document. */
|
|
1862
|
+
declare function toChartJson(options: ChartExportOptions): string;
|
|
1863
|
+
type ChartExportFormat = "csv" | "json";
|
|
1864
|
+
/**
|
|
1865
|
+
* Hands the chart's rows to the browser as a file.
|
|
1866
|
+
*
|
|
1867
|
+
* Does nothing outside a browser rather than throwing: a chart is rendered on
|
|
1868
|
+
* the server too, and a download is the one thing that cannot happen there.
|
|
1869
|
+
*/
|
|
1870
|
+
declare function downloadChartData(format: ChartExportFormat, options: ChartExportOptions, filename?: string): void;
|
|
1871
|
+
|
|
1872
|
+
interface ChartExportButtonProps extends ChartExportOptions {
|
|
1873
|
+
className?: string;
|
|
1874
|
+
disabled?: boolean;
|
|
1875
|
+
/** Which files to offer, in the order they are listed. */
|
|
1876
|
+
formats?: readonly ChartExportFormat[];
|
|
1877
|
+
/** Name of the downloaded file, without its extension. */
|
|
1878
|
+
filename?: string;
|
|
1879
|
+
size?: ChartSize;
|
|
1880
|
+
/** Replaces the default caption — the translated "Export". */
|
|
1881
|
+
label?: string;
|
|
1882
|
+
/**
|
|
1883
|
+
* Runs instead of the download.
|
|
1884
|
+
*
|
|
1885
|
+
* For an application that already owns its own export — a server-side
|
|
1886
|
+
* report, a file named by the current filters — and only wants the control
|
|
1887
|
+
* and the rows.
|
|
1888
|
+
*/
|
|
1889
|
+
onExport?: (format: ChartExportFormat, options: ChartExportOptions) => void;
|
|
1890
|
+
}
|
|
1891
|
+
/**
|
|
1892
|
+
* The chart's own table, as a file.
|
|
1893
|
+
*
|
|
1894
|
+
* The small gap the chart kit carried from the start: `DataGrid` exports CSV
|
|
1895
|
+
* and JSON, and a chart holds an exact table of the very same shape without
|
|
1896
|
+
* ever offering it. A reader who can see a number should be able to take it.
|
|
1897
|
+
*
|
|
1898
|
+
* A component rather than a prop on thirteen charts, because it belongs where
|
|
1899
|
+
* the other controls already are — the `actions` slot of a `ChartContainer`,
|
|
1900
|
+
* or of the `ChartFilterBar` above a whole dashboard.
|
|
1901
|
+
*
|
|
1902
|
+
* ```tsx
|
|
1903
|
+
* <LineChart
|
|
1904
|
+
* data={rows}
|
|
1905
|
+
* series={series}
|
|
1906
|
+
* x={{ key: "month" }}
|
|
1907
|
+
* actions={<ChartExportButton data={rows} series={series} xKey="month" />}
|
|
1908
|
+
* />
|
|
1909
|
+
* ```
|
|
1910
|
+
*
|
|
1911
|
+
* The measurements are written raw, not formatted: whatever opens the file is
|
|
1912
|
+
* going to compute on them.
|
|
1913
|
+
*/
|
|
1914
|
+
declare function ChartExportButton({ data, series, xKey, xLabel, formatX, formats, filename, size, label, onExport, className, disabled, }: ChartExportButtonProps): react_jsx_runtime.JSX.Element;
|
|
1915
|
+
|
|
1916
|
+
interface PathPoint {
|
|
1917
|
+
x: number;
|
|
1918
|
+
y: number;
|
|
1919
|
+
/** `false` marks a gap: the line breaks instead of crossing it. */
|
|
1920
|
+
defined?: boolean;
|
|
1921
|
+
}
|
|
1922
|
+
|
|
1923
|
+
/**
|
|
1924
|
+
* How many points per series the kit draws before it starts warning.
|
|
1925
|
+
*
|
|
1926
|
+
* The figure is a measurement, not a taste: past roughly this many points a
|
|
1927
|
+
* `d` attribute stops being a path and becomes a string the browser reparses
|
|
1928
|
+
* on every re-render, and two neighbouring points land on the same pixel
|
|
1929
|
+
* column anyway — the reader gains nothing for the cost.
|
|
1930
|
+
*
|
|
1931
|
+
* Nothing is dropped on its own when a series crosses it. A chart that quietly
|
|
1932
|
+
* drew a different shape than the one it was handed would be worse than a slow
|
|
1933
|
+
* one; the warning says what to pass instead.
|
|
1934
|
+
*/
|
|
1935
|
+
declare const CHART_POINT_BUDGET = 2000;
|
|
1936
|
+
/** Lets a test watch the warning fire more than once. */
|
|
1937
|
+
declare function resetPointBudgetWarning(): void;
|
|
1938
|
+
/** A point the decimation can reason about: a position and a measurement. */
|
|
1939
|
+
interface XY {
|
|
1940
|
+
x: number;
|
|
1941
|
+
y: number;
|
|
1942
|
+
}
|
|
1943
|
+
/**
|
|
1944
|
+
* Largest-Triangle-Three-Buckets, returning the indices it keeps.
|
|
1945
|
+
*
|
|
1946
|
+
* The classic downsampling for a line: the series is cut into as many buckets
|
|
1947
|
+
* as there is room for, and each bucket keeps the one point forming the
|
|
1948
|
+
* largest triangle with the point already kept before it and the average of
|
|
1949
|
+
* the bucket after it. Picking the largest triangle is what keeps the peaks —
|
|
1950
|
+
* a stride sample walks straight past them, which is how a decimated series
|
|
1951
|
+
* ends up flatter than the data it came from.
|
|
1952
|
+
*
|
|
1953
|
+
* Indices rather than points, so a caller can carry along whatever the point
|
|
1954
|
+
* belonged to: a row, a screen coordinate, a tooltip payload.
|
|
1955
|
+
*/
|
|
1956
|
+
declare function lttb(points: readonly XY[], threshold: number): number[];
|
|
1957
|
+
/**
|
|
1958
|
+
* An evenly spread sample, keeping the two ends.
|
|
1959
|
+
*
|
|
1960
|
+
* What an unordered cloud needs, where LTTB is the wrong tool: a scatter is
|
|
1961
|
+
* read for where its points are dense, and keeping the largest triangles would
|
|
1962
|
+
* carve out the envelope and throw the density away — a lie about the very
|
|
1963
|
+
* thing the chart is for. An even stride keeps the shape of the cloud and
|
|
1964
|
+
* thins it uniformly.
|
|
1965
|
+
*
|
|
1966
|
+
* Deterministic on purpose, rather than a random sample: the same data has to
|
|
1967
|
+
* draw the same picture on the server and in the browser.
|
|
1968
|
+
*/
|
|
1969
|
+
declare function sampleEvenly<T>(items: readonly T[], threshold: number): T[];
|
|
1970
|
+
/**
|
|
1971
|
+
* The rows a drawn path keeps, thinned to roughly `maxPoints` per series.
|
|
1972
|
+
*
|
|
1973
|
+
* Indices rather than points, because a band needs its top and its bottom
|
|
1974
|
+
* thinned on the very same rows: thin them apart and the fill between them
|
|
1975
|
+
* closes on two points that never faced each other.
|
|
1976
|
+
*
|
|
1977
|
+
* The gaps are structural and survive: a run of missing measurements is not
|
|
1978
|
+
* noise to be smoothed away, it is the series saying it has nothing there.
|
|
1979
|
+
* Each run of gaps keeps one row — enough for the path to lift the pen —
|
|
1980
|
+
* and the defined runs between them share the budget in proportion to their
|
|
1981
|
+
* length.
|
|
1982
|
+
*/
|
|
1983
|
+
declare function decimateIndices(points: readonly PathPoint[], maxPoints: number): number[];
|
|
1984
|
+
/**
|
|
1985
|
+
* A drawn path, thinned to roughly `maxPoints` points per series.
|
|
1986
|
+
*
|
|
1987
|
+
* The chart's geometry is untouched — the hover, the crosshair, the tooltip
|
|
1988
|
+
* and the data table all keep reading every row. Only the number of points the
|
|
1989
|
+
* path is *drawn from* changes, which is the part that actually costs.
|
|
1990
|
+
*/
|
|
1991
|
+
declare function decimatePath(points: readonly PathPoint[], maxPoints: number): PathPoint[];
|
|
1992
|
+
|
|
1993
|
+
/**
|
|
1994
|
+
* The colour a texture is cut through — the chart surface itself.
|
|
1995
|
+
*
|
|
1996
|
+
* Declared in `src/styles/index.css` under both theme scopes, so a stripe is
|
|
1997
|
+
* white on a white panel and gray-800 on a dark one without a component ever
|
|
1998
|
+
* asking which theme is on.
|
|
1999
|
+
*/
|
|
2000
|
+
declare const CHART_SURFACE_COLOR = "var(--color-chart-surface)";
|
|
2001
|
+
/**
|
|
2002
|
+
* The textures, in the order they are handed out.
|
|
2003
|
+
*
|
|
2004
|
+
* One per palette slot, and assigned the same way: by the series' position in
|
|
2005
|
+
* `series`, never by its rank. Hiding a series repaints nothing, and the
|
|
2006
|
+
* texture a reader learnt in the legend is still the one on the plot.
|
|
2007
|
+
*
|
|
2008
|
+
* Every hatch runs at 45° or its mirror at 135°, never horizontal and never
|
|
2009
|
+
* vertical: those two align with the gridlines and with the edges of the
|
|
2010
|
+
* marks, where they read as part of the chrome rather than as a fill. The
|
|
2011
|
+
* first slot is left solid — an untextured mark is itself a texture, and the
|
|
2012
|
+
* easiest of all to tell apart.
|
|
2013
|
+
*/
|
|
2014
|
+
declare const CHART_PATTERNS: readonly ["solid", "diagonal", "diagonal-reverse", "cross", "dots", "diagonal-wide", "diagonal-reverse-wide", "dots-wide"];
|
|
2015
|
+
type ChartPattern = (typeof CHART_PATTERNS)[number];
|
|
2016
|
+
/** The texture at `index`, wrapping around once past the last one. */
|
|
2017
|
+
declare function getPattern(index: number): ChartPattern;
|
|
2018
|
+
/**
|
|
2019
|
+
* Id of the SVG pattern a chart declared for its `index`-th series.
|
|
2020
|
+
*
|
|
2021
|
+
* The base is stripped down to id characters: `useId` returns `:r0:` on React
|
|
2022
|
+
* 18, and a fill pointing at `url(#:r0:-texture-1)` is a fragment reference
|
|
2023
|
+
* browsers are not obliged to resolve.
|
|
2024
|
+
*/
|
|
2025
|
+
declare function patternId(baseId: string, index: number): string;
|
|
2026
|
+
/**
|
|
2027
|
+
* The fill a mark wears.
|
|
2028
|
+
*
|
|
2029
|
+
* The texture when they are on and the slot has one, the flat colour
|
|
2030
|
+
* otherwise — so a chart calls this once and never branches itself.
|
|
2031
|
+
*/
|
|
2032
|
+
declare function patternFill(enabled: boolean, baseId: string, index: number, color: string): string;
|
|
2033
|
+
/** One texture to declare: the slot it belongs to, and the colour it paints. */
|
|
2034
|
+
interface ChartPatternEntry {
|
|
2035
|
+
/** Palette slot of the mark — what `patternFill` is called with. */
|
|
2036
|
+
slot: number;
|
|
2037
|
+
color: string;
|
|
2038
|
+
}
|
|
2039
|
+
interface ChartPatternDefsProps {
|
|
2040
|
+
/** Unique per chart instance — a `useId()`, so two charts never collide. */
|
|
2041
|
+
id: string;
|
|
2042
|
+
/**
|
|
2043
|
+
* The marks to declare a texture for.
|
|
2044
|
+
*
|
|
2045
|
+
* Keyed by slot rather than by position: a pie sorts its slices and a bar
|
|
2046
|
+
* chart hides some of its series, and in both the texture has to keep
|
|
2047
|
+
* following the identity it was handed out to.
|
|
2048
|
+
*/
|
|
2049
|
+
entries: readonly ChartPatternEntry[];
|
|
2050
|
+
}
|
|
2051
|
+
/**
|
|
2052
|
+
* The `<defs>` block holding one texture per series.
|
|
2053
|
+
*
|
|
2054
|
+
* A mark keeps its colour at full strength and the texture is *cut out* of it
|
|
2055
|
+
* in the surface colour, rather than painted over a washed-down fill: a
|
|
2056
|
+
* stacked band has to read as a quantity, and a fill dimmed to make room for
|
|
2057
|
+
* stripes stops doing that.
|
|
2058
|
+
*/
|
|
2059
|
+
declare function ChartPatternDefs({ id, entries }: ChartPatternDefsProps): react_jsx_runtime.JSX.Element;
|
|
2060
|
+
/**
|
|
2061
|
+
* The same texture, in CSS, for the HTML swatch of a legend.
|
|
2062
|
+
*
|
|
2063
|
+
* The legend and the plot have to carry the same two channels, or the texture
|
|
2064
|
+
* becomes noise the reader cannot map onto anything. A gradient reproduces the
|
|
2065
|
+
* SVG tile closely enough at swatch size, and it flips with the theme through
|
|
2066
|
+
* the same surface variable.
|
|
2067
|
+
*/
|
|
2068
|
+
declare function patternBackground(index: number, color: string): CSSProperties;
|
|
2069
|
+
|
|
1218
2070
|
/**
|
|
1219
2071
|
* Number of categorical slots the palette holds.
|
|
1220
2072
|
*
|
|
@@ -1258,8 +2110,14 @@ declare function getSeriesColor(index: number, override?: string): string;
|
|
|
1258
2110
|
declare function resolveSeriesColor(series: ChartSeries, index: number, emphasis?: string): string;
|
|
1259
2111
|
/** Label shown for a series — its own, or its key as a fallback. */
|
|
1260
2112
|
declare function getSeriesLabel(series: ChartSeries): string;
|
|
1261
|
-
/**
|
|
1262
|
-
|
|
2113
|
+
/**
|
|
2114
|
+
* Builds the legend entries of a series list, colours already resolved.
|
|
2115
|
+
*
|
|
2116
|
+
* `patterns` mirrors the chart's own setting: when the marks are textured the
|
|
2117
|
+
* swatches have to be too, since the texture is the channel a reader falls
|
|
2118
|
+
* back on when the hue fails them.
|
|
2119
|
+
*/
|
|
2120
|
+
declare function toLegendItems(series: ChartSeries[], emphasis?: string, patterns?: boolean): ChartLegendItem[];
|
|
1263
2121
|
/** One hue, light to dark: a continuous magnitude (a heat map). */
|
|
1264
2122
|
declare const CHART_SEQUENTIAL_COLORS: readonly ["var(--color-chart-seq-1)", "var(--color-chart-seq-2)", "var(--color-chart-seq-3)", "var(--color-chart-seq-4)", "var(--color-chart-seq-5)", "var(--color-chart-seq-6)"];
|
|
1265
2123
|
/** One hue in ordered steps: ranked bands, brackets, a funnel. */
|
|
@@ -1488,6 +2346,91 @@ declare function ChartFacets({ data, by, values, domain, includeZero, ticks, ord
|
|
|
1488
2346
|
/** Resets the one-shot panel-count warning. Test helper. */
|
|
1489
2347
|
declare function resetFacetWarnings(): void;
|
|
1490
2348
|
|
|
2349
|
+
interface ChartFilterBarProps extends Omit<ComponentPropsWithoutRef<"div">, "title"> {
|
|
2350
|
+
/** Names the row for assistive technology. Defaults to the translated "Filters". */
|
|
2351
|
+
label?: string;
|
|
2352
|
+
/** Pushed to the far end of the row: an export, a refresh, a saved view. */
|
|
2353
|
+
actions?: ReactNode;
|
|
2354
|
+
/** Keeps the row on screen while a long dashboard scrolls under it. */
|
|
2355
|
+
sticky?: boolean;
|
|
2356
|
+
/** The rule under the row, which is what makes it read as a frame. */
|
|
2357
|
+
bordered?: boolean;
|
|
2358
|
+
size?: ChartSize;
|
|
2359
|
+
children: ReactNode;
|
|
2360
|
+
}
|
|
2361
|
+
/**
|
|
2362
|
+
* The filters, in one row above everything they frame.
|
|
2363
|
+
*
|
|
2364
|
+
* Not a chart and barely a component — a rule written down as a layout. A
|
|
2365
|
+
* dashboard filtered per card is a dashboard whose numbers stop agreeing: two
|
|
2366
|
+
* panels answer two questions and nothing on screen says so. One row, above
|
|
2367
|
+
* the charts, applying to all of them, is the only arrangement where a reader
|
|
2368
|
+
* can trust that two figures are comparable.
|
|
2369
|
+
*
|
|
2370
|
+
* It composes what the library already has — `ChartPeriodPicker` for the
|
|
2371
|
+
* window, `Select` and `Dropdown` for the dimensions — rather than growing
|
|
2372
|
+
* controls of its own.
|
|
2373
|
+
*
|
|
2374
|
+
* ```tsx
|
|
2375
|
+
* <ChartFilterBar actions={<Button size="sm">Export</Button>}>
|
|
2376
|
+
* <ChartPeriodPicker value={period} onChange={setPeriod} />
|
|
2377
|
+
* <Select size="sm" options={regions} value={region} onValueChange={setRegion} />
|
|
2378
|
+
* </ChartFilterBar>
|
|
2379
|
+
* ```
|
|
2380
|
+
*/
|
|
2381
|
+
declare function ChartFilterBar({ label, actions, sticky, bordered, size, children, className, ...props }: ChartFilterBarProps): react_jsx_runtime.JSX.Element;
|
|
2382
|
+
|
|
2383
|
+
interface ChartPeriodPickerProps extends Omit<ComponentPropsWithoutRef<"button">, "value" | "defaultValue" | "onChange" | "children"> {
|
|
2384
|
+
/** Controlled window. */
|
|
2385
|
+
value?: ChartPeriod;
|
|
2386
|
+
/** Uncontrolled starting window — a resolved period, or a preset to resolve. */
|
|
2387
|
+
defaultValue?: ChartPeriod | ChartPeriodPreset;
|
|
2388
|
+
onChange?: (period: ChartPeriod) => void;
|
|
2389
|
+
/** Which windows to offer, in the order they are listed. */
|
|
2390
|
+
presets?: readonly ChartPeriodPreset[];
|
|
2391
|
+
/** Offers the calendar, for a window the presets do not cover. */
|
|
2392
|
+
custom?: boolean;
|
|
2393
|
+
/** Overrides a preset's caption, without going through the labels provider. */
|
|
2394
|
+
presetLabels?: Partial<Record<ChartPeriodPreset, string>>;
|
|
2395
|
+
/**
|
|
2396
|
+
* The moment the presets are measured from.
|
|
2397
|
+
*
|
|
2398
|
+
* Injected by a test, and by an application that freezes "today" — a report
|
|
2399
|
+
* generated at 3am must not silently change window at midnight.
|
|
2400
|
+
*/
|
|
2401
|
+
now?: Date;
|
|
2402
|
+
/** Bounds of the calendar. A dashboard usually caps it at today. */
|
|
2403
|
+
minDate?: Date;
|
|
2404
|
+
maxDate?: Date;
|
|
2405
|
+
/** Number of months shown side by side by the calendar. */
|
|
2406
|
+
numberOfMonths?: number;
|
|
2407
|
+
weekStartsOn?: CalendarWeekStart;
|
|
2408
|
+
locale?: string;
|
|
2409
|
+
size?: ChartSize;
|
|
2410
|
+
/** Which end of the trigger the panel lines up with. */
|
|
2411
|
+
align?: "start" | "end";
|
|
2412
|
+
disabled?: boolean;
|
|
2413
|
+
/** Names the control when the default "Period" is not specific enough. */
|
|
2414
|
+
label?: string;
|
|
2415
|
+
}
|
|
2416
|
+
/**
|
|
2417
|
+
* The window a dashboard is read over.
|
|
2418
|
+
*
|
|
2419
|
+
* The one filter every dashboard has, and the one the library was missing:
|
|
2420
|
+
* `Calendar` picks a date and hands it back, which is a different job. This
|
|
2421
|
+
* picks a *period*, offers the windows people actually ask for by name, and
|
|
2422
|
+
* falls back to the calendar for the rest.
|
|
2423
|
+
*
|
|
2424
|
+
* It belongs in a `ChartFilterBar` with the other filters, above the charts
|
|
2425
|
+
* and never inside one of them — a period picked per card is how two panels
|
|
2426
|
+
* end up answering two questions without saying so.
|
|
2427
|
+
*
|
|
2428
|
+
* The presets are resolved against `now` rather than against a clock read
|
|
2429
|
+
* somewhere inside: a window is data, and data a component makes up on its own
|
|
2430
|
+
* cannot be tested, frozen or shared between two charts.
|
|
2431
|
+
*/
|
|
2432
|
+
declare function ChartPeriodPicker({ value, defaultValue, onChange, presets, custom, presetLabels, now, minDate, maxDate, numberOfMonths, weekStartsOn, locale, size, align, disabled, label, className, ...props }: ChartPeriodPickerProps): react_jsx_runtime.JSX.Element;
|
|
2433
|
+
|
|
1491
2434
|
/**
|
|
1492
2435
|
* Width a chart draws at before its container has been measured.
|
|
1493
2436
|
*
|
|
@@ -1576,7 +2519,7 @@ interface DumbbellRow {
|
|
|
1576
2519
|
change: number | null;
|
|
1577
2520
|
datum: ChartDatum;
|
|
1578
2521
|
}
|
|
1579
|
-
interface DumbbellChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
2522
|
+
interface DumbbellChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
1580
2523
|
/** One row per item compared. */
|
|
1581
2524
|
data: ChartDatum[];
|
|
1582
2525
|
/** Field holding the name of each row. */
|
|
@@ -1615,8 +2558,6 @@ interface DumbbellChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "c
|
|
|
1615
2558
|
showChange?: boolean;
|
|
1616
2559
|
title?: ReactNode;
|
|
1617
2560
|
description?: ReactNode;
|
|
1618
|
-
loading?: boolean;
|
|
1619
|
-
emptyState?: ReactNode;
|
|
1620
2561
|
margin?: Partial<ChartMargin>;
|
|
1621
2562
|
locale?: string;
|
|
1622
2563
|
plotLabel?: string;
|
|
@@ -1642,7 +2583,7 @@ interface DumbbellChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "c
|
|
|
1642
2583
|
* `sort="gap"` is what turns the chart from a list into a finding: the rows
|
|
1643
2584
|
* that moved most come to the top.
|
|
1644
2585
|
*/
|
|
1645
|
-
declare function DumbbellChart({ data, x, y, series, sort, sortBy, showValues, dotSize, referenceLines, height, width, size, grid, legend, legendToggle, tooltip, tableView, showChange, title, description, loading, emptyState, margin, locale, plotLabel, changeLabel, format, onRowClick, className, ...props }: DumbbellChartProps): react_jsx_runtime.JSX.Element;
|
|
2586
|
+
declare function DumbbellChart({ data, x, y, series, sort, sortBy, showValues, dotSize, referenceLines, height, width, size, grid, legend, legendToggle, tooltip, tableView, showChange, title, description, loading, emptyState, error, errorState, onRetry, actions, margin, locale, plotLabel, changeLabel, format, onRowClick, className, ...props }: DumbbellChartProps): react_jsx_runtime.JSX.Element;
|
|
1646
2587
|
|
|
1647
2588
|
/** One stage, as the tooltip and the click handler see it. */
|
|
1648
2589
|
interface FunnelStage {
|
|
@@ -1659,7 +2600,7 @@ interface FunnelStage {
|
|
|
1659
2600
|
formattedValue: string;
|
|
1660
2601
|
datum: ChartDatum;
|
|
1661
2602
|
}
|
|
1662
|
-
interface FunnelChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
2603
|
+
interface FunnelChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
1663
2604
|
/** One row per stage, in the order they are walked. */
|
|
1664
2605
|
data: ChartDatum[];
|
|
1665
2606
|
/** Field holding the name of each stage. */
|
|
@@ -1695,8 +2636,6 @@ interface FunnelChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "chi
|
|
|
1695
2636
|
tableView?: boolean | "toggle";
|
|
1696
2637
|
title?: ReactNode;
|
|
1697
2638
|
description?: ReactNode;
|
|
1698
|
-
loading?: boolean;
|
|
1699
|
-
emptyState?: ReactNode;
|
|
1700
2639
|
locale?: string;
|
|
1701
2640
|
plotLabel?: string;
|
|
1702
2641
|
/** Header of the value column of the data table. */
|
|
@@ -1725,7 +2664,7 @@ interface FunnelChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "chi
|
|
|
1725
2664
|
* Use it for a path people walk in one direction. Stages that are not ordered
|
|
1726
2665
|
* are a `BarChart`, and a breakdown of one total is a `PieChart`.
|
|
1727
2666
|
*/
|
|
1728
|
-
declare function FunnelChart({ data, x, value, align, showConversion, showValues, stageSize, colors, height, width, size, tooltip, tableView, title, description, loading, emptyState, locale, plotLabel, valueLabel, conversionLabel, dropOffLabel, format, onStageClick, className, ...props }: FunnelChartProps): react_jsx_runtime.JSX.Element;
|
|
2667
|
+
declare function FunnelChart({ data, x, value, align, showConversion, showValues, stageSize, colors, height, width, size, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, locale, plotLabel, valueLabel, conversionLabel, dropOffLabel, format, onStageClick, className, ...props }: FunnelChartProps): react_jsx_runtime.JSX.Element;
|
|
1729
2668
|
|
|
1730
2669
|
/** One task, as the tooltip and the click handler see it. */
|
|
1731
2670
|
interface GanttTask {
|
|
@@ -1748,7 +2687,7 @@ interface GanttTask {
|
|
|
1748
2687
|
group: string | null;
|
|
1749
2688
|
datum: ChartDatum;
|
|
1750
2689
|
}
|
|
1751
|
-
interface GanttChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
2690
|
+
interface GanttChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
1752
2691
|
/** One row per task, in the order they are listed. */
|
|
1753
2692
|
data: ChartDatum[];
|
|
1754
2693
|
/** Field holding the name of each task. */
|
|
@@ -1794,8 +2733,6 @@ interface GanttChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "chil
|
|
|
1794
2733
|
tableView?: boolean | "toggle";
|
|
1795
2734
|
title?: ReactNode;
|
|
1796
2735
|
description?: ReactNode;
|
|
1797
|
-
loading?: boolean;
|
|
1798
|
-
emptyState?: ReactNode;
|
|
1799
2736
|
margin?: Partial<ChartMargin>;
|
|
1800
2737
|
locale?: string;
|
|
1801
2738
|
plotLabel?: string;
|
|
@@ -1823,7 +2760,7 @@ interface GanttChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "chil
|
|
|
1823
2760
|
* month — rather than on round numbers of milliseconds, which is what a
|
|
1824
2761
|
* decimal tick generator produces when it is pointed at a date.
|
|
1825
2762
|
*/
|
|
1826
|
-
declare function GanttChart({ data, x, start, end, id, progress, milestone, dependencies, group, domain, today, ticks, barSize, rowSize, color, height, width, size, grid, legend, tooltip, tableView, title, description, loading, emptyState, margin, locale, plotLabel, startLabel, endLabel, progressLabel, todayLabel, formatDate, onTaskClick, className, ...props }: GanttChartProps): react_jsx_runtime.JSX.Element;
|
|
2763
|
+
declare function GanttChart({ data, x, start, end, id, progress, milestone, dependencies, group, domain, today, ticks, barSize, rowSize, color, height, width, size, grid, legend, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, margin, locale, plotLabel, startLabel, endLabel, progressLabel, todayLabel, formatDate, onTaskClick, className, ...props }: GanttChartProps): react_jsx_runtime.JSX.Element;
|
|
1827
2764
|
|
|
1828
2765
|
/** What a step does to the running total. */
|
|
1829
2766
|
type WaterfallKind = "increase" | "decrease" | "total";
|
|
@@ -1844,7 +2781,7 @@ interface WaterfallStep {
|
|
|
1844
2781
|
formattedEnd: string;
|
|
1845
2782
|
datum: ChartDatum;
|
|
1846
2783
|
}
|
|
1847
|
-
interface WaterfallChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
2784
|
+
interface WaterfallChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
1848
2785
|
/** One row per step, in the order they are read. */
|
|
1849
2786
|
data: ChartDatum[];
|
|
1850
2787
|
/** Field holding the name of each step. */
|
|
@@ -1896,8 +2833,6 @@ interface WaterfallChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "
|
|
|
1896
2833
|
tableView?: boolean | "toggle";
|
|
1897
2834
|
title?: ReactNode;
|
|
1898
2835
|
description?: ReactNode;
|
|
1899
|
-
loading?: boolean;
|
|
1900
|
-
emptyState?: ReactNode;
|
|
1901
2836
|
margin?: Partial<ChartMargin>;
|
|
1902
2837
|
locale?: string;
|
|
1903
2838
|
plotLabel?: string;
|
|
@@ -1926,7 +2861,7 @@ interface WaterfallChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "
|
|
|
1926
2861
|
* The order of the rows IS the chart, so there is no `sort`: reordering the
|
|
1927
2862
|
* steps of a waterfall produces a different, and usually false, story.
|
|
1928
2863
|
*/
|
|
1929
|
-
declare function WaterfallChart({ data, x, y, value, total, start, orientation, connectors, showValues, barSize, colors, height, width, size, grid, legend, tooltip, tableView, title, description, loading, emptyState, margin, locale, plotLabel, valueLabel, totalLabel, increaseLabel, decreaseLabel, format, onStepClick, className, ...props }: WaterfallChartProps): react_jsx_runtime.JSX.Element;
|
|
2864
|
+
declare function WaterfallChart({ data, x, y, value, total, start, orientation, connectors, showValues, barSize, colors, height, width, size, grid, legend, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, margin, locale, plotLabel, valueLabel, totalLabel, increaseLabel, decreaseLabel, format, onStepClick, className, ...props }: WaterfallChartProps): react_jsx_runtime.JSX.Element;
|
|
1930
2865
|
|
|
1931
2866
|
interface CheckboxProps extends Omit<ComponentPropsWithoutRef<"input">, "size" | "onChange" | "type"> {
|
|
1932
2867
|
checked?: boolean;
|
|
@@ -2924,7 +3859,7 @@ declare namespace Label {
|
|
|
2924
3859
|
var displayName: string;
|
|
2925
3860
|
}
|
|
2926
3861
|
|
|
2927
|
-
interface HeatmapProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
3862
|
+
interface HeatmapProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
2928
3863
|
/** One row per cell: its column, its row and its value. */
|
|
2929
3864
|
data: ChartDatum[];
|
|
2930
3865
|
/** Field holding the column each cell belongs to. */
|
|
@@ -2971,8 +3906,6 @@ interface HeatmapProps extends Omit<ComponentPropsWithoutRef<"figure">, "childre
|
|
|
2971
3906
|
tableView?: boolean | "toggle";
|
|
2972
3907
|
title?: ReactNode;
|
|
2973
3908
|
description?: ReactNode;
|
|
2974
|
-
loading?: boolean;
|
|
2975
|
-
emptyState?: ReactNode;
|
|
2976
3909
|
locale?: string;
|
|
2977
3910
|
plotLabel?: string;
|
|
2978
3911
|
onCellClick?: (cell: HeatmapCell) => void;
|
|
@@ -3002,7 +3935,7 @@ interface HeatmapCell {
|
|
|
3002
3935
|
* neighbouring cells stop being tellable apart, and a fine grid is read as a
|
|
3003
3936
|
* wash anyway.
|
|
3004
3937
|
*/
|
|
3005
|
-
declare function Heatmap({ data, x, y, value, format, domain, scale, center, steps, colors, xDomain, yDomain, cellGap, cellRadius, showValues, height, width, size, legend, legendLabel, tooltip, tableView, title, description, loading, emptyState, locale, plotLabel, onCellClick, className, ...props }: HeatmapProps): react_jsx_runtime.JSX.Element;
|
|
3938
|
+
declare function Heatmap({ data, x, y, value, format, domain, scale, center, steps, colors, xDomain, yDomain, cellGap, cellRadius, showValues, height, width, size, legend, legendLabel, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, locale, plotLabel, onCellClick, className, ...props }: HeatmapProps): react_jsx_runtime.JSX.Element;
|
|
3006
3939
|
|
|
3007
3940
|
interface LineChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWithoutRef<"figure">, keyof CartesianChartBaseProps | "children" | "title"> {
|
|
3008
3941
|
curve?: ChartCurve;
|
|
@@ -3020,8 +3953,53 @@ interface LineChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWit
|
|
|
3020
3953
|
/** Draws through the gaps instead of breaking the line. */
|
|
3021
3954
|
connectNulls?: boolean;
|
|
3022
3955
|
referenceLines?: ChartReferenceLine[];
|
|
3956
|
+
/**
|
|
3957
|
+
* What happened, drawn where it happened: a release, a campaign, an outage.
|
|
3958
|
+
*
|
|
3959
|
+
* The counterpart of `referenceLines`, which marks a threshold on the value
|
|
3960
|
+
* axis. A spike nobody explained is a question rather than an answer, and
|
|
3961
|
+
* the explanation almost always sits on the time axis.
|
|
3962
|
+
*
|
|
3963
|
+
* The captions are appended to the chart's accessible name, since an SVG
|
|
3964
|
+
* exposes nothing drawn inside it.
|
|
3965
|
+
*/
|
|
3966
|
+
annotations?: ChartAnnotation[];
|
|
3023
3967
|
/** Lets the legend show and hide series. */
|
|
3024
3968
|
legendToggle?: boolean;
|
|
3969
|
+
/**
|
|
3970
|
+
* Thins the drawn path to roughly this many points per series.
|
|
3971
|
+
*
|
|
3972
|
+
* A series of fifty thousand rows builds a `d` attribute of fifty thousand
|
|
3973
|
+
* coordinates, most of which land on a pixel column another one already
|
|
3974
|
+
* covers. This runs the points through LTTB, which keeps the peaks a stride
|
|
3975
|
+
* sample walks straight past.
|
|
3976
|
+
*
|
|
3977
|
+
* Only the *path* is thinned. The geometry, the crosshair, the tooltip and
|
|
3978
|
+
* the data table keep reading every row, so no value stops being reachable —
|
|
3979
|
+
* the chart draws the same shape from fewer points, it does not hold less
|
|
3980
|
+
* data. Left unset, every point is drawn and a series past
|
|
3981
|
+
* `CHART_POINT_BUDGET` warns once in development.
|
|
3982
|
+
*/
|
|
3983
|
+
maxPoints?: number;
|
|
3984
|
+
/**
|
|
3985
|
+
* Lets a pointer drag a window across the category axis.
|
|
3986
|
+
*
|
|
3987
|
+
* Shift + arrows does the same from the keyboard, and Escape drops it. The
|
|
3988
|
+
* window is published to the surrounding `ChartSyncProvider`, which is how
|
|
3989
|
+
* one panel's selection becomes the whole dashboard's.
|
|
3990
|
+
*/
|
|
3991
|
+
brush?: boolean;
|
|
3992
|
+
/** Called when a window is set, and with `null` when one is dropped. */
|
|
3993
|
+
onBrush?: (range: ChartBrushRange | null) => void;
|
|
3994
|
+
/** Accessible name of the selected window. */
|
|
3995
|
+
brushLabel?: string;
|
|
3996
|
+
/**
|
|
3997
|
+
* `false` keeps the chart out of the surrounding `ChartSyncProvider`.
|
|
3998
|
+
*
|
|
3999
|
+
* For the panel of a dashboard that plots something else entirely, where a
|
|
4000
|
+
* shared crosshair would mark a position its axis does not carry.
|
|
4001
|
+
*/
|
|
4002
|
+
sync?: boolean;
|
|
3025
4003
|
margin?: Partial<ChartMargin>;
|
|
3026
4004
|
/** BCP 47 tag used to format the axes and the tooltip. */
|
|
3027
4005
|
locale?: string;
|
|
@@ -3038,8 +4016,12 @@ interface LineChartProps extends CartesianChartBaseProps, Omit<ComponentPropsWit
|
|
|
3038
4016
|
* There is deliberately no second value axis. Two measures on two scales
|
|
3039
4017
|
* invent a correlation the data does not carry; plot them as two charts, or
|
|
3040
4018
|
* index both to a common base.
|
|
4019
|
+
*
|
|
4020
|
+
* `overlay` is the way past everything this chart refuses to draw: it hands
|
|
4021
|
+
* the resolved geometry over and lets the application draw inside the plot
|
|
4022
|
+
* with the chart's own scales, instead of forking the component.
|
|
3041
4023
|
*/
|
|
3042
|
-
declare function LineChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, onPointClick, curve, forecastFrom, forecastLabel, markers, connectNulls, referenceLines, legendToggle, margin, locale, plotLabel, className, ...props }: LineChartProps): react_jsx_runtime.JSX.Element;
|
|
4024
|
+
declare function LineChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, error, errorState, onRetry, actions, onPointClick, curve, forecastFrom, forecastLabel, markers, connectNulls, referenceLines, annotations, overlay, legendToggle, maxPoints, brush, onBrush, brushLabel, sync, margin, locale, plotLabel, className, ...props }: LineChartProps): react_jsx_runtime.JSX.Element;
|
|
3043
4025
|
|
|
3044
4026
|
interface ModalProps {
|
|
3045
4027
|
isOpen: boolean;
|
|
@@ -3120,7 +4102,7 @@ interface PaginationProps extends Omit<ComponentPropsWithoutRef<"nav">, "onChang
|
|
|
3120
4102
|
}
|
|
3121
4103
|
declare function Pagination({ page, totalPages, onPageChange, size, variant, showFirstLast, siblings, boundaries, disabled, labels, totalItems, pageSize, pageSizeOptions, onPageSizeChange, className, ...props }: PaginationProps): react_jsx_runtime.JSX.Element;
|
|
3122
4104
|
|
|
3123
|
-
interface PieChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title"
|
|
4105
|
+
interface PieChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "children" | "title">, ChartStatusProps {
|
|
3124
4106
|
data: ChartDatum[];
|
|
3125
4107
|
/** Field holding the name of each slice. */
|
|
3126
4108
|
x: ChartXAxisConfig;
|
|
@@ -3150,8 +4132,17 @@ interface PieChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "childr
|
|
|
3150
4132
|
tableView?: boolean | "toggle";
|
|
3151
4133
|
title?: ReactNode;
|
|
3152
4134
|
description?: ReactNode;
|
|
3153
|
-
|
|
3154
|
-
|
|
4135
|
+
/**
|
|
4136
|
+
* Draws each slice with a texture on top of its colour.
|
|
4137
|
+
*
|
|
4138
|
+
* The channel a reader falls back on when the hue fails them: severe colour
|
|
4139
|
+
* vision deficiency, a grayscale print, a forced-colours theme. Off by
|
|
4140
|
+
* default — it is an accessibility option, not a decoration.
|
|
4141
|
+
*
|
|
4142
|
+
* The folded tail keeps its flat grey: it is the one slice that is not an
|
|
4143
|
+
* identity, and giving it a texture would make it look like one.
|
|
4144
|
+
*/
|
|
4145
|
+
patterns?: boolean;
|
|
3155
4146
|
locale?: string;
|
|
3156
4147
|
plotLabel?: string;
|
|
3157
4148
|
onSliceClick?: (slice: {
|
|
@@ -3170,7 +4161,7 @@ interface PieChartProps extends Omit<ComponentPropsWithoutRef<"figure">, "childr
|
|
|
3170
4161
|
* over six slices at most, which is why the tail folds into a single bucket
|
|
3171
4162
|
* rather than taking a seventh colour.
|
|
3172
4163
|
*/
|
|
3173
|
-
declare function PieChart({ data, x, value, variant, innerRadius, maxSlices, otherLabel, sort, showLabels, centerLabel, height, width, size, legend, tooltip, tableView, title, description, loading, emptyState, locale, plotLabel, onSliceClick, className, ...props }: PieChartProps): react_jsx_runtime.JSX.Element;
|
|
4164
|
+
declare function PieChart({ data, x, value, variant, innerRadius, maxSlices, otherLabel, sort, showLabels, centerLabel, patterns, height, width, size, legend, tooltip, tableView, title, description, loading, emptyState, error, errorState, onRetry, actions, locale, plotLabel, onSliceClick, className, ...props }: PieChartProps): react_jsx_runtime.JSX.Element;
|
|
3174
4165
|
|
|
3175
4166
|
type ProgressBarSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
3176
4167
|
type ProgressBarColor = "default" | "primary" | "success" | "warning" | "error" | "info";
|
|
@@ -3748,6 +4739,19 @@ interface ScatterChartProps extends Omit<CartesianChartBaseProps, "grid">, Omit<
|
|
|
3748
4739
|
};
|
|
3749
4740
|
pointRadius?: number;
|
|
3750
4741
|
legendToggle?: boolean;
|
|
4742
|
+
/**
|
|
4743
|
+
* Thins each series to roughly this many marks.
|
|
4744
|
+
*
|
|
4745
|
+
* An **even** sample, not LTTB: a cloud is read for where its points are
|
|
4746
|
+
* dense, and keeping the largest triangles would carve out the envelope and
|
|
4747
|
+
* throw that density away — a lie about the very thing the chart is for. An
|
|
4748
|
+
* even stride thins the cloud without changing its shape.
|
|
4749
|
+
*
|
|
4750
|
+
* The trend line and the data table are computed from every row, so a
|
|
4751
|
+
* thinned plot still reports what the whole dataset says. Left unset, a
|
|
4752
|
+
* series past `CHART_POINT_BUDGET` warns once in development.
|
|
4753
|
+
*/
|
|
4754
|
+
maxPoints?: number;
|
|
3751
4755
|
margin?: Partial<ChartMargin>;
|
|
3752
4756
|
locale?: string;
|
|
3753
4757
|
plotLabel?: string;
|
|
@@ -3760,7 +4764,7 @@ interface ScatterChartProps extends Omit<CartesianChartBaseProps, "grid">, Omit<
|
|
|
3760
4764
|
* three slots stay tellable apart there. Past three series, facet the chart or
|
|
3761
4765
|
* fold the tail — a fourth colour would not be distinguishable.
|
|
3762
4766
|
*/
|
|
3763
|
-
declare function ScatterChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, onPointClick, bubble, trendLine, quadrants, pointRadius, legendToggle, margin, locale, plotLabel, className, ...props }: ScatterChartProps): react_jsx_runtime.JSX.Element;
|
|
4767
|
+
declare function ScatterChart({ data, series, x, y, height, width, size, grid, legend, tooltip, tableView, emphasis, title, description, loading, emptyState, error, errorState, onRetry, actions, onPointClick, bubble, trendLine, quadrants, pointRadius, overlay, legendToggle, maxPoints, margin, locale, plotLabel, className, ...props }: ScatterChartProps): react_jsx_runtime.JSX.Element;
|
|
3764
4768
|
|
|
3765
4769
|
type SchemaFieldType = "text" | "varchar" | "char" | "int2" | "int4" | "int8" | "serial" | "bigserial" | "float4" | "float8" | "numeric" | "decimal" | "bool" | "date" | "time" | "timestamp" | "timestamptz" | "uuid" | "json" | "jsonb" | "bytea" | (string & {});
|
|
3766
4770
|
type SchemaField = {
|
|
@@ -4243,6 +5247,43 @@ interface UILabels {
|
|
|
4243
5247
|
chartProgress: string;
|
|
4244
5248
|
/** Name of the rule marking today on a schedule. */
|
|
4245
5249
|
chartToday: string;
|
|
5250
|
+
/** Word the annotation captions are announced under in a chart's name. */
|
|
5251
|
+
chartAnnotations: string;
|
|
5252
|
+
/** Accessible name of the filter row above a set of charts. */
|
|
5253
|
+
chartFilters: string;
|
|
5254
|
+
/** Accessible name of the period picker, and its caption when nothing is set. */
|
|
5255
|
+
chartPeriod: string;
|
|
5256
|
+
chartPeriodLast7Days: string;
|
|
5257
|
+
chartPeriodLast30Days: string;
|
|
5258
|
+
chartPeriodLast90Days: string;
|
|
5259
|
+
chartPeriodLast12Months: string;
|
|
5260
|
+
chartPeriodMonthToDate: string;
|
|
5261
|
+
chartPeriodQuarterToDate: string;
|
|
5262
|
+
chartPeriodYearToDate: string;
|
|
5263
|
+
/** Entry opening the calendar, for a window the presets do not cover. */
|
|
5264
|
+
chartPeriodCustom: string;
|
|
5265
|
+
/**
|
|
5266
|
+
* Shown in place of a chart whose data could not be loaded.
|
|
5267
|
+
*
|
|
5268
|
+
* Distinct from `chartNoData` on purpose: "there is nothing" and "we failed
|
|
5269
|
+
* to fetch it" are two different statements, and only the second one asks
|
|
5270
|
+
* the reader to do something about it.
|
|
5271
|
+
*/
|
|
5272
|
+
chartError: string;
|
|
5273
|
+
/** Second line of a chart's error state, under `chartError`. */
|
|
5274
|
+
chartErrorHint: string;
|
|
5275
|
+
/** Label of the button that asks a failed chart to load again. */
|
|
5276
|
+
chartRetry: string;
|
|
5277
|
+
/** Accessible name of a chart's export control. */
|
|
5278
|
+
chartExport: string;
|
|
5279
|
+
/** Entry downloading a chart's data table as a CSV file. */
|
|
5280
|
+
chartExportCsv: string;
|
|
5281
|
+
/** Entry downloading a chart's data table as a JSON file. */
|
|
5282
|
+
chartExportJson: string;
|
|
5283
|
+
/** Accessible name of the range a pointer drags across a chart's category axis. */
|
|
5284
|
+
chartBrush: string;
|
|
5285
|
+
/** Accessible name of the button dropping the dragged range. */
|
|
5286
|
+
chartClearSelection: string;
|
|
4246
5287
|
}
|
|
4247
5288
|
/** English labels, used when no provider is mounted. */
|
|
4248
5289
|
declare const defaultUILabels: UILabels;
|
|
@@ -4328,4 +5369,4 @@ declare function isFocusable(element: HTMLElement): boolean;
|
|
|
4328
5369
|
*/
|
|
4329
5370
|
declare function getFocusableElements(container: HTMLElement): HTMLElement[];
|
|
4330
5371
|
|
|
4331
|
-
export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionSize, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionVariant, AdvanceDetachable, type AdvanceDetachableProps, type AdvanceDetachableRef, type AdvanceDetachableRenderContext, type AggregateFunction, type Align, AreaChart, type AreaChartProps, Avatar, type AvatarProps, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Banner, type BannerProps, type BannerType, type BannerVariant, BarChart, type BarChartOrientation, type BarChartProps, type BinSpec, BoxPlot, type BoxPlotBox, type BoxPlotProps, type BoxPlotQuantileKeys, type BoxStats, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, BulletChart, type BulletChartProps, type BulletRow, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CHART_ALL_PAIRS_LIMIT, CHART_DIVERGING_COLORS, CHART_DIVERGING_DARK_STOPS, CHART_DIVERGING_NEUTRAL_INDEX, CHART_DOWN_COLOR, CHART_MAX_COLOR_CLASSES, CHART_MUTED_COLOR, CHART_ORDINAL_COLORS, CHART_ORDINAL_DARK_STOPS, CHART_PALETTE_SIZE, CHART_SEQUENTIAL_COLORS, CHART_SEQUENTIAL_DARK_STOPS, CHART_SERIES_COLORS, CHART_UP_COLOR, Calendar, type CalendarColor, type CalendarDateRange, type CalendarDayState, type CalendarLabels, type CalendarMode, type CalendarProps, type CalendarSize, type CalendarWeekStart, type Candle, CandlestickChart, type CandlestickChartProps, Card, CardBody, type CardBodyProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, CardImage, type CardImageProps, type CardProps, CardTitle, type CardTitleProps, type CartesianChartBaseProps, ChartAxis, type ChartAxisOrientation, type ChartAxisProps, type ChartColorScale, ChartContainer, type ChartContainerProps, type ChartContainerRenderArgs, type ChartCurve, type ChartDatum, type ChartDimensions, type ChartFacetPanel, ChartFacets, type ChartFacetsProps, ChartGrid, type ChartGridLines, type ChartGridProps, ChartLegend, type ChartLegendItem, type ChartLegendMarker, type ChartLegendPosition, type ChartLegendProps, type ChartMargin, type ChartPoint, type ChartPointEvent, type ChartReferenceLine, ChartScaleLegend, type ChartScaleLegendProps, type ChartScaleType, type ChartSeries, type ChartSize, ChartTableView, type ChartTableViewProps, type ChartTick, ChartTooltip, ChartTooltipContent, type ChartTooltipContentProps, type ChartTooltipPayload, type ChartTooltipProps, type ChartXAxisConfig, type ChartXValue, type ChartYAxisConfig, Checkbox, CheckboxGroup, CheckboxGroupItem, type CheckboxGroupItemProps, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipColor, type ChipProps, type ChipSize, type ChipVariant, CircularProgress, type CircularProgressColor, type CircularProgressProps, type CircularProgressSize, type CircularProgressThickness, type ColumnDef, DEFAULT_CHART_WIDTH, DEFAULT_FIELD_TYPES, DataGrid, type DataGridMode, type DataGridProps, type DataGridRef, type Density, Detachable, type DetachableProps, type DetachableRef, DeviceMockup, type DeviceMockupProps, type DeviceOrientation, type DeviceSize, type DeviceTheme, type DeviceType, type DialogA11yProps, type DialogInitialFocus, type DialogReturnFocus, type DivergingScaleOptions, Divider, type DividerOrientation, type DividerProps, type DividerTextAlign, type DividerVariant, Drawer, type DrawerPosition, type DrawerProps, type DrawerSize, Dropdown, DropdownCheckboxItem, type DropdownCheckboxItemProps, DropdownContent, type DropdownContentProps, type DropdownContextValue, DropdownItem, type DropdownItemProps, DropdownLabel, type DropdownLabelProps, type DropdownProps, DropdownRadioGroup, type DropdownRadioGroupProps, DropdownRadioItem, type DropdownRadioItemProps, DropdownSeparator, type DropdownSeparatorProps, DropdownSubMenu, DropdownSubMenuContent, type DropdownSubMenuContentProps, type DropdownSubMenuProps, DropdownSubMenuTrigger, type DropdownSubMenuTriggerProps, DropdownTrigger, type DropdownTriggerProps, DumbbellChart, type DumbbellChartProps, type DumbbellRow, type DumbbellSort, FOCUSABLE_SELECTOR, FileSelector, type FileSelectorProps, type FilterOperator, type FilterType, type FilterValue, Footer, FooterBottom, type FooterBottomProps, FooterColumn, type FooterColumnProps, FooterLink, type FooterLinkProps, type FooterProps, FooterSection, type FooterSectionProps, FooterSocial, FooterSocialLink, type FooterSocialLinkProps, type FooterSocialProps, FunnelChart, type FunnelChartProps, type FunnelStage, GanttChart, type GanttChartProps, type GanttTask, Header, type HeaderProps, Heatmap, type HeatmapCell, type HeatmapProps, HelpButton, type HelpButtonProps, type HistogramBin, INERT_IGNORE_ATTRIBUTE, ImageUploader, type ImageUploaderProps, Indicator, type IndicatorColor, type IndicatorPlacement, type IndicatorProps, type IndicatorSize, type IndicatorVariant, Input, type InputProps, Label, type LabelColor, type LabelProps, type LabelSize, type LabelVariant, type LabelWeight, LineChart, type LineChartProps, MarkdownEditorComponent, type MentionData, MentionInput, type MentionInputProps, type MentionInputValue, type MentionSuggestion, Modal, type ModalProps, type NavItem, type NodeRegistryEntry, NumberInput, type NumberInputProps, Pagination, type PaginationConfig, type PaginationProps, PieChart, type PieChartProps, type Position, ProgressBar, type ProgressBarColor, type ProgressBarProps, type ProgressBarSize, type ProgressBarVariant, RadioButton, type RadioButtonProps, ScatterChart, type ScatterChartProps, SchemaEditor, type SchemaEditorProps, type SchemaEditorRef, type SchemaField, type SchemaFieldEvent, type SchemaFieldType, type SchemaRelation, type SchemaRelationCardinality, type SchemaTable, type SchemaTableEvent, type SchemaValue, type SchemaViewport, Select, type SelectOption, type SelectProps, type SelectedFile, type SelectionMode, type SequentialScaleOptions, type Side, Sidebar, SidebarContent, type SidebarContentProps, SidebarFooter, type SidebarFooterProps, SidebarGroup, type SidebarGroupProps, SidebarHeader, type SidebarHeaderProps, SidebarItem, type SidebarItemProps, type SidebarPosition, type SidebarProps, SidebarSubMenu, type SidebarSubMenuProps, SidebarToggle, type SidebarToggleProps, type SidebarVariant, Skeleton, type SkeletonAnimation, type SkeletonProps, type SkeletonVariant, Slider, type SliderColor, type SliderMark, type SliderProps, type SliderSize, type SortDirection, type SortState, Sparkline, type SparklineProps, StatCard, type StatCardDelta, type StatCardDeltaDirection, type StatCardDeltaTone, StatCardGroup, type StatCardGroupProps, type StatCardProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableHeader, TableHeaderCell, type TableHeaderCellProps, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, type TabsColor, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsOrientation, type TabsProps, type TabsSize, TabsTrigger, type TabsTriggerProps, type TabsVariant, type TimeTickScale, type TimeUnit, Toast, type ToastPosition, type ToastProps, type ToastType, type ToastVariant, Tooltip, type TooltipPosition, type TooltipProps, type TooltipSize, type TooltipTrigger, type TooltipVariant, type UILabels, UILabelsProvider, type UILabelsProviderProps, type UseChartSizeOptions, type UseChartSizeResult, type UseDialogA11yOptions, type UseDialogA11yResult, type UseKeyboardNavigationOptions, type UsePositioningOptions, WaterfallChart, type WaterfallChartProps, type WaterfallKind, type WaterfallStep, WithHelpButton, type WithHelpButtonProps, Wizard, WizardActions, type WizardActionsProps, type WizardColor, WizardContent, type WizardContentProps, type WizardContextValue, type WizardDirection, WizardNext, type WizardNextProps, type WizardOrientation, WizardPanel, type WizardPanelProps, WizardPrevious, type WizardPreviousProps, type WizardProps, type WizardSize, type WizardStepChangeMeta, type WizardStepDefinition, type WizardStepStatus, WizardSteps, type WizardStepsProps, type WizardVariant, type WorkflowDirection, type WorkflowEdge, WorkflowEditor, type WorkflowEditorProps, type WorkflowEditorRef, type WorkflowNode, type WorkflowNodeAction, type WorkflowNodeActionEvent, type WorkflowNodeActionPosition, type WorkflowNodeEvent, type WorkflowPort, type WorkflowValue, type WorkflowViewport, autoLayoutTables, binEdges, binValues, boxStats, cn, createDefaultField, createDefaultTable, createDivergingScale, createSequentialScale, defaultUILabels, findOwnedLayers, formatTimeTick, frenchUILabels, generateFieldId, generateRelationId, generateSQL, generateTableId, getFocusableElements, getOrdinalColor, getSeriesColor, getSeriesLabel, hideOthers, isElementVisible, isFocusable, niceTimeTicks, quantile, quantileSorted, rampColor, registerFloatingLayer, resetBarChartWarnings, resetDumbbellWarnings, resetFacetWarnings, resolveSeriesColor, sturgesBins, toLegendItems, toTimestamp, useChartSize, useClickOutside, useDialogA11y, useDropdownContext, useFocusItem, useKeyboardNavigation, usePositioning, useSidebar, useUILabels, useWizard };
|
|
5372
|
+
export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, type AccordionSize, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionVariant, AdvanceDetachable, type AdvanceDetachableProps, type AdvanceDetachableRef, type AdvanceDetachableRenderContext, type AggregateFunction, type Align, AreaChart, type AreaChartProps, Avatar, type AvatarProps, Badge, type BadgeColor, type BadgeProps, type BadgeSize, type BadgeVariant, Banner, type BannerProps, type BannerType, type BannerVariant, BarChart, type BarChartOrientation, type BarChartProps, type BinSpec, BoxPlot, type BoxPlotBox, type BoxPlotProps, type BoxPlotQuantileKeys, type BoxStats, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, BulletChart, type BulletChartProps, type BulletRow, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, CHART_ALL_PAIRS_LIMIT, CHART_DIVERGING_COLORS, CHART_DIVERGING_DARK_STOPS, CHART_DIVERGING_NEUTRAL_INDEX, CHART_DOWN_COLOR, CHART_MAX_COLOR_CLASSES, CHART_MUTED_COLOR, CHART_ORDINAL_COLORS, CHART_ORDINAL_DARK_STOPS, CHART_PALETTE_SIZE, CHART_PATTERNS, CHART_POINT_BUDGET, CHART_SEQUENTIAL_COLORS, CHART_SEQUENTIAL_DARK_STOPS, CHART_SERIES_COLORS, CHART_SURFACE_COLOR, CHART_UP_COLOR, Calendar, type CalendarColor, type CalendarDateRange, type CalendarDayState, type CalendarLabels, type CalendarMode, type CalendarProps, type CalendarSize, type CalendarWeekStart, type Candle, CandlestickChart, type CandlestickChartProps, Card, CardBody, type CardBodyProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, CardImage, type CardImageProps, type CardProps, CardTitle, type CardTitleProps, type CartesianChartBaseProps, type CartesianGeometry, type CartesianGeometryOptions, type CartesianOrientation, type CategoryPlacement, type ChartAnnotation, type ChartAnnotationBase, ChartAnnotationLayer, type ChartAnnotationLayerProps, ChartAxis, type ChartAxisOrientation, type ChartAxisProps, type ChartBandAnnotation, ChartBrushLayer, type ChartBrushLayerProps, type ChartBrushRange, type ChartColorScale, ChartContainer, type ChartContainerProps, type ChartContainerRenderArgs, type ChartCurve, type ChartDatum, type ChartDimensions, ChartExportButton, type ChartExportButtonProps, type ChartExportFormat, type ChartExportOptions, type ChartExportRow, type ChartFacetPanel, ChartFacets, type ChartFacetsProps, ChartFilterBar, type ChartFilterBarProps, ChartGrid, type ChartGridLines, type ChartGridProps, ChartLegend, type ChartLegendItem, type ChartLegendMarker, type ChartLegendPosition, type ChartLegendProps, type ChartLineAnnotation, type ChartMargin, type ChartOrientation, type ChartOverlay, type ChartOverlayRenderer, type ChartPattern, ChartPatternDefs, type ChartPatternDefsProps, type ChartPatternEntry, type ChartPeriod, ChartPeriodPicker, type ChartPeriodPickerProps, type ChartPeriodPreset, type ChartPlotContext, type ChartPoint, type ChartPointAnnotation, type ChartPointEvent, type ChartReferenceLine, type ChartResolvedSeries, ChartScaleLegend, type ChartScaleLegendProps, type ChartScaleType, type ChartSeries, type ChartSize, type ChartStatusProps, type ChartSyncContextValue, ChartSyncProvider, type ChartSyncProviderProps, ChartTableView, type ChartTableViewProps, type ChartTick, ChartTooltip, ChartTooltipContent, type ChartTooltipContentProps, type ChartTooltipPayload, type ChartTooltipProps, type ChartXAxisConfig, type ChartXValue, type ChartYAxisConfig, Checkbox, CheckboxGroup, CheckboxGroupItem, type CheckboxGroupItemProps, type CheckboxGroupProps, type CheckboxProps, Chip, type ChipColor, type ChipProps, type ChipSize, type ChipVariant, CircularProgress, type CircularProgressColor, type CircularProgressProps, type CircularProgressSize, type CircularProgressThickness, type ColumnDef, DEFAULT_CHART_PERIOD_PRESETS, DEFAULT_CHART_WIDTH, DEFAULT_FIELD_TYPES, DataGrid, type DataGridMode, type DataGridProps, type DataGridRef, type Density, Detachable, type DetachableProps, type DetachableRef, DeviceMockup, type DeviceMockupProps, type DeviceOrientation, type DeviceSize, type DeviceTheme, type DeviceType, type DialogA11yProps, type DialogInitialFocus, type DialogReturnFocus, type DivergingScaleOptions, Divider, type DividerOrientation, type DividerProps, type DividerTextAlign, type DividerVariant, Drawer, type DrawerPosition, type DrawerProps, type DrawerSize, Dropdown, DropdownCheckboxItem, type DropdownCheckboxItemProps, DropdownContent, type DropdownContentProps, type DropdownContextValue, DropdownItem, type DropdownItemProps, DropdownLabel, type DropdownLabelProps, type DropdownProps, DropdownRadioGroup, type DropdownRadioGroupProps, DropdownRadioItem, type DropdownRadioItemProps, DropdownSeparator, type DropdownSeparatorProps, DropdownSubMenu, DropdownSubMenuContent, type DropdownSubMenuContentProps, type DropdownSubMenuProps, DropdownSubMenuTrigger, type DropdownSubMenuTriggerProps, DropdownTrigger, type DropdownTriggerProps, DumbbellChart, type DumbbellChartProps, type DumbbellRow, type DumbbellSort, FOCUSABLE_SELECTOR, FileSelector, type FileSelectorProps, type FilterOperator, type FilterType, type FilterValue, Footer, FooterBottom, type FooterBottomProps, FooterColumn, type FooterColumnProps, FooterLink, type FooterLinkProps, type FooterProps, FooterSection, type FooterSectionProps, FooterSocial, FooterSocialLink, type FooterSocialLinkProps, type FooterSocialProps, FunnelChart, type FunnelChartProps, type FunnelStage, GanttChart, type GanttChartProps, type GanttTask, Header, type HeaderProps, Heatmap, type HeatmapCell, type HeatmapProps, HelpButton, type HelpButtonProps, type HistogramBin, INERT_IGNORE_ATTRIBUTE, ImageUploader, type ImageUploaderProps, Indicator, type IndicatorColor, type IndicatorPlacement, type IndicatorProps, type IndicatorSize, type IndicatorVariant, Input, type InputProps, Label, type LabelColor, type LabelProps, type LabelSize, type LabelVariant, type LabelWeight, LineChart, type LineChartProps, MarkdownEditorComponent, type MentionData, MentionInput, type MentionInputProps, type MentionInputValue, type MentionSuggestion, Modal, type ModalProps, type NavItem, type NodeRegistryEntry, NumberInput, type NumberInputProps, Pagination, type PaginationConfig, type PaginationProps, PieChart, type PieChartProps, type Position, ProgressBar, type ProgressBarColor, type ProgressBarProps, type ProgressBarSize, type ProgressBarVariant, RadioButton, type RadioButtonProps, ScatterChart, type ScatterChartProps, SchemaEditor, type SchemaEditorProps, type SchemaEditorRef, type SchemaField, type SchemaFieldEvent, type SchemaFieldType, type SchemaRelation, type SchemaRelationCardinality, type SchemaTable, type SchemaTableEvent, type SchemaValue, type SchemaViewport, Select, type SelectOption, type SelectProps, type SelectedFile, type SelectionMode, type SequentialScaleOptions, type Side, Sidebar, SidebarContent, type SidebarContentProps, SidebarFooter, type SidebarFooterProps, SidebarGroup, type SidebarGroupProps, SidebarHeader, type SidebarHeaderProps, SidebarItem, type SidebarItemProps, type SidebarPosition, type SidebarProps, SidebarSubMenu, type SidebarSubMenuProps, SidebarToggle, type SidebarToggleProps, type SidebarVariant, Skeleton, type SkeletonAnimation, type SkeletonProps, type SkeletonVariant, Slider, type SliderColor, type SliderMark, type SliderProps, type SliderSize, type SortDirection, type SortState, Sparkline, type SparklineProps, StatCard, type StatCardDelta, type StatCardDeltaDirection, type StatCardDeltaTone, StatCardGroup, type StatCardGroupProps, type StatCardProps, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableHeader, TableHeaderCell, type TableHeaderCellProps, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, type TabsColor, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsOrientation, type TabsProps, type TabsSize, TabsTrigger, type TabsTriggerProps, type TabsVariant, type TimeTickScale, type TimeUnit, Toast, type ToastPosition, type ToastProps, type ToastType, type ToastVariant, Tooltip, type TooltipPosition, type TooltipProps, type TooltipSize, type TooltipTrigger, type TooltipVariant, type UILabels, UILabelsProvider, type UILabelsProviderProps, type UseChartBrushOptions, type UseChartBrushResult, type UseChartSizeOptions, type UseChartSizeResult, type UseDialogA11yOptions, type UseDialogA11yResult, type UseKeyboardNavigationOptions, type UsePositioningOptions, WaterfallChart, type WaterfallChartProps, type WaterfallKind, type WaterfallStep, WithHelpButton, type WithHelpButtonProps, Wizard, WizardActions, type WizardActionsProps, type WizardColor, WizardContent, type WizardContentProps, type WizardContextValue, type WizardDirection, WizardNext, type WizardNextProps, type WizardOrientation, WizardPanel, type WizardPanelProps, WizardPrevious, type WizardPreviousProps, type WizardProps, type WizardSize, type WizardStepChangeMeta, type WizardStepDefinition, type WizardStepStatus, WizardSteps, type WizardStepsProps, type WizardVariant, type WorkflowDirection, type WorkflowEdge, WorkflowEditor, type WorkflowEditorProps, type WorkflowEditorRef, type WorkflowNode, type WorkflowNodeAction, type WorkflowNodeActionEvent, type WorkflowNodeActionPosition, type WorkflowNodeEvent, type WorkflowPort, type WorkflowValue, type WorkflowViewport, autoLayoutTables, binEdges, binValues, boxStats, brushToPeriod, buildCartesianGeometry, cn, createCategoryLocator, createDefaultField, createDefaultTable, createDivergingScale, createPeriod, createPlotContext, createSequentialScale, decimateIndices, decimatePath, defaultUILabels, describeAnnotations, downloadChartData, endOfDay, findOwnedLayers, formatPeriodRange, formatTimeTick, frenchUILabels, generateFieldId, generateRelationId, generateSQL, generateTableId, getFocusableElements, getOrdinalColor, getPattern, getSeriesColor, getSeriesLabel, hideOthers, isElementVisible, isFocusable, lttb, niceTimeTicks, patternBackground, patternFill, patternId, quantile, quantileSorted, rampColor, registerFloatingLayer, resetBarChartWarnings, resetDumbbellWarnings, resetFacetWarnings, resetPointBudgetWarning, resolvePeriodPreset, resolveSeriesColor, samePeriod, sampleEvenly, splitOverlay, startOfDay, sturgesBins, toChartCsv, toChartJson, toChartRows, toLegendItems, toTimestamp, useChartBrush, useChartSize, useChartSync, useClickOutside, useDialogA11y, useDropdownContext, useFocusItem, useKeyboardNavigation, usePositioning, useSidebar, useUILabels, useWizard };
|