Sparklines

Use a small native chart in a table, card or inline trend summary. The standalone factory reuses the same line, area and column geometry, scales, inspection and export owners as Charts and Pivot. Give the container an explicit CSS height.

import { createSparklineChart } from '@revolist/charts/sparkline';

const chart = await createSparklineChart({
  container,
  data: [3, 7, null, -2, 9, 4],
  plotType: 'area',
  interpolation: 'monotoneX',
  color: '#2563eb',
  showTooltip: true,
  showHighlight: true,
  presentation: { title: 'Weekly revenue trend' },
  axes: { y: { min: -10, max: 10 } },
});
await chart.setData([4, 8, null, -1, 10, 5]);
// Use the normal lifecycle, selection, CSV, downloads and subscriptions.
const csv = chart.getCSV();
chart.destroy();

Factory options

createSparklineChart and createSparklineDataset are exported from the package root and @revolist/charts/sparkline. The subpath loads only its three plot families. SparklineChartOptions and SparklineChartRef describe the factory.

Field	Default	Contract
data	Required	Readonly array of finite numbers or null. Nulls keep their positions and normal path gaps. Empty/all-null arrays are accepted. Invalid values reject; they are never filtered or coerced.
x	0, 1, 2, …	Same-length readonly array of string, finite number, boolean or null. Choose axes.x.scale for category/time/numeric interpretation. Duplicate X values keep separate index-based source IDs. Numeric X applies to line/area, with existing column scale restrictions retained.
plotType	'line'	'line', 'area' or 'bar'. Bar uses the native vertical groupedColumn chart.
interpolation	Native linear	Existing ChartInterpolation policy for line/area. Rejected on bar.
color	Theme palette	Saved seriesOverrides.value.color; shared color validation applies.
showTooltip	false	Enable the shared semantic tooltip. rendererOptions.tooltip customizes it when enabled. An explicit tooltip: false still disables it.
showHighlight	false	Enable transient line/area source-point glyphs. Authored regular markers are separate. Rejected when true on bar.

Other ordinary ChartOptions remain available: axes and fixed Y domains, callbacks, theme, renderer styling, limits, presentation and per-series settings. The source series ID is value. Regular line/area markers default to false; seriesOverrides.value.markers can change that. Convenience interpolation/color fields take precedence over their corresponding series override. The factory sets sparkline: true and the highlight-disable policy from showHighlight. Dataset/model/row mapping/data source/custom renderer/chartType are excluded from this array-based facade; use ordinary createChart for those authoring flows.

setData(data, x?) validates and updates atomically, preserving settings and index-based identities. Omitting X restores integer indexes. Ordinary chart.update remains available for chart settings or canonical datasets. createSparklineDataset(data, x?) builds the same canonical single-series snapshot for createChart, Pivot or server rendering without mounting a chart.

Shared compact mode

For an existing Charts or Pivot model, set chartOptions.sparkline: true. Default is false. It is supported on line, smoothLine, steppedLine, area, steppedArea, stackedArea, normalizedArea and groupedColumn. Unsupported chart types reject this option. Pivot exposes Customize → Chart appearance → Sparkline through the ordinary chart-option controls; localize its label and help with chartOptions.labels.sparkline and chartOptions.descriptions.sparkline. Normal appearance UI policies apply.

Compact mode uses the host’s actual dimensions, rounded to SVG pixels with a 1px minimum. An unmeasurable host uses the renderer’s existing default size until it is measured. The plot has a maximum 4px inset, reduced on very small hosts. It hides headings, axes/ticks/grid, legend, data labels, category-group bands, automatic category scrollbars, navigation/navigator/brush controls, range selector, annotation editor and sampling explanation furniture. All loaded categories fit in the current configured viewport; bars do not acquire an automatic four-item scroll window. Source limits and explicit path sampling remain active. Compact mode does not change the semantics of noninteractive internal previews.

Axis bounds/scales/reversal and saved viewport still determine the plot. Source values/IDs, null policies, stacks, curves, selection, raw tooltips, keyboard inspection, references and static annotations retain their shared contracts. The saved title still names the accessible chart even though it is not painted. The shared SVG description, raw source summary and keyboard inspection instructions remain available through aria-describedby. Renderer callbacks receive canonical authored settings and raw data. The mode neither serializes runtime callbacks nor rewrites the dataset.

Authored titles, legend, data labels, navigation and editable annotation settings remain in the model. Set sparkline: false to restore ordinary layout and its 320×240 minimum viewBox. Compact is not a rendering backend or a dense-data performance guarantee; use existing limits/sampling deliberately.

Persistence and export

The mode is persisted with the ordinary native chart model and works in Pivot, SVG server rendering and hydration. Restore with createChart({ container, model: savedModel }) or the Pivot model API; the factory itself accepts source arrays, not saved models. Runtime tooltip/style/callback settings must be supplied again when restoring. Model restoration returns the ordinary ChartRef; rebuild source arrays with createSparklineDataset for later dataset updates.

SVG downloads retain compact geometry. CSV retains raw loaded observations, including gaps, under the usual data-scope policy. PNG/PDF use the existing encoders and export size limits. Always destroy the ref when its host unmounts.

The MUI sparkline reference describes the upstream compact line/area/bar use cases. This API follows the framework-neutral Charts contracts; it does not add React-specific slots or MUI domain-limit aliases.