@loidolt/theme-charts 0.7.0

package/dist/core/describe.d.ts

@@ -0,0 +1,27 @@
+import { type FormatOptions } from './format.js';
+import type { CategoryData, SliceDatum } from './types.js';
+/** `rises`, `falls` or `holds steady`, comparing the first and last values. */
+export declare function describeTrend(values: Array<number | null>): string;
+/** The highest and lowest value and where each falls. */
+export declare function extremes(values: Array<number | null>, labels: string[]): {
+    high: {
+        label: string;
+        value: number;
+    };
+    low: {
+        label: string;
+        value: number;
+    };
+} | null;
+declare const list: (items: string[]) => string;
+/** "3 series over 12 categories. Revenue rises, peaking at 40 in Dec; …" */
+export declare function describeCategories(data: CategoryData, { kind, format }?: {
+    kind?: string;
+    format?: FormatOptions;
+}): string;
+/** "Pie of 5 slices totalling 120. Largest: A 40 (33%), B 30 (25%) and C 20 (17%)." */
+export declare function describeSlices(data: SliceDatum[], { kind, format }?: {
+    kind?: string;
+    format?: FormatOptions;
+}): string;
+export { list as joinList };

package/dist/core/describe.js

@@ -0,0 +1,69 @@
+import { formatNumber } from './format.js';
+/*
+ * Plain-language summaries for a chart's accessible description. They say what a sighted
+ * reader takes in at a glance — the trend, the extremes, the biggest share — and leave the
+ * detail to the data table. Pass your own `description` to a chart to replace them.
+ */
+const finite = (values) => values.filter((value) => value != null && Number.isFinite(value));
+/** `rises`, `falls` or `holds steady`, comparing the first and last values. */
+export function describeTrend(values) {
+    const present = finite(values);
+    if (present.length < 2)
+        return 'holds steady';
+    const [first, last] = [present[0], present[present.length - 1]];
+    const scale = Math.max(Math.abs(first), Math.abs(last), 1e-9);
+    if (Math.abs(last - first) / scale < 0.02)
+        return 'holds steady';
+    return last > first ? 'rises' : 'falls';
+}
+/** The highest and lowest value and where each falls. */
+export function extremes(values, labels) {
+    let high = null;
+    let low = null;
+    values.forEach((value, index) => {
+        if (value == null || !Number.isFinite(value))
+            return;
+        const label = labels[index] ?? String(index + 1);
+        if (!high || value > high.value)
+            high = { label, value };
+        if (!low || value < low.value)
+            low = { label, value };
+    });
+    return high && low ? { high, low } : null;
+}
+const list = (items) => items.length <= 1
+    ? (items[0] ?? '')
+    : `${items.slice(0, -1).join(', ')} and ${items[items.length - 1]}`;
+/** "3 series over 12 categories. Revenue rises, peaking at 40 in Dec; …" */
+export function describeCategories(data, { kind = 'chart', format } = {}) {
+    const { categories, series } = data;
+    if (!series.length || !categories.length)
+        return `Empty ${kind}.`;
+    const parts = series.slice(0, 4).map((one) => {
+        const range = extremes(one.data, categories);
+        if (!range)
+            return `${one.name} has no values`;
+        const high = `${formatNumber(range.high.value, format)} in ${range.high.label}`;
+        const low = `${formatNumber(range.low.value, format)} in ${range.low.label}`;
+        return `${one.name} ${describeTrend(one.data)}, from a low of ${low} to a high of ${high}`;
+    });
+    const more = series.length > 4 ? ` ${series.length - 4} more series in the data table.` : '';
+    const span = `${categories[0]} to ${categories[categories.length - 1]}`;
+    const count = `${series.length} series`;
+    return `${kind[0].toUpperCase()}${kind.slice(1)} of ${count} over ${categories.length} categories, ${span}. ${parts.join('; ')}.${more}`;
+}
+/** "Pie of 5 slices totalling 120. Largest: A 40 (33%), B 30 (25%) and C 20 (17%)." */
+export function describeSlices(data, { kind = 'chart', format } = {}) {
+    if (!data.length)
+        return `Empty ${kind}.`;
+    const total = data.reduce((sum, slice) => sum + slice.value, 0);
+    const top = [...data]
+        .sort((a, b) => b.value - a.value)
+        .slice(0, 3)
+        .map((slice) => {
+        const share = total ? Math.round((slice.value / total) * 100) : 0;
+        return `${slice.name} ${formatNumber(slice.value, format)} (${share}%)`;
+    });
+    return `${kind[0].toUpperCase()}${kind.slice(1)} of ${data.length} ${data.length === 1 ? 'part' : 'parts'} totalling ${formatNumber(total, format)}. Largest: ${list(top)}.`;
+}
+export { list as joinList };

package/dist/core/format.d.ts

@@ -0,0 +1,15 @@
+export interface FormatOptions extends Intl.NumberFormatOptions {
+    locale?: string | string[];
+}
+/** `1234.5` → `1,234.5`. Non-finite values format as an empty string. */
+export declare function formatNumber(value: number | null | undefined, options?: FormatOptions): string;
+/** `12500` → `12.5K`, in the locale's own compact notation. */
+export declare function formatCompact(value: number | null | undefined, options?: FormatOptions): string;
+/** `0.256` → `25.6%`. The value is a fraction, as `Intl` expects. */
+export declare function formatPercent(value: number | null | undefined, options?: FormatOptions): string;
+/** `1234` with `USD` → `$1,234.00`. */
+export declare function formatCurrency(value: number | null | undefined, currency: string, options?: FormatOptions): string;
+/** A date or timestamp in the locale's medium date style. Invalid dates format as `''`. */
+export declare function formatDate(value: Date | number | string, { locale, ...options }?: Intl.DateTimeFormatOptions & {
+    locale?: string | string[];
+}): string;

package/dist/core/format.js

@@ -0,0 +1,39 @@
+/*
+ * Number and date formatting for axes, tooltips and descriptions. Every formatter takes a
+ * `locale`: leaving it out uses the runtime default, which differs between the server and the
+ * browser — pass one explicitly when a chart is server-rendered.
+ */
+const cache = new Map();
+function numberFormat({ locale, ...options } = {}) {
+    const key = JSON.stringify([locale ?? null, options]);
+    let format = cache.get(key);
+    if (!format) {
+        format = new Intl.NumberFormat(locale, options);
+        cache.set(key, format);
+    }
+    return format;
+}
+/** `1234.5` → `1,234.5`. Non-finite values format as an empty string. */
+export function formatNumber(value, options) {
+    return value == null || !Number.isFinite(value) ? '' : numberFormat(options).format(value);
+}
+/** `12500` → `12.5K`, in the locale's own compact notation. */
+export function formatCompact(value, options) {
+    return formatNumber(value, { notation: 'compact', maximumFractionDigits: 1, ...options });
+}
+/** `0.256` → `25.6%`. The value is a fraction, as `Intl` expects. */
+export function formatPercent(value, options) {
+    return formatNumber(value, { style: 'percent', maximumFractionDigits: 1, ...options });
+}
+/** `1234` with `USD` → `$1,234.00`. */
+export function formatCurrency(value, currency, options) {
+    return formatNumber(value, { style: 'currency', currency, ...options });
+}
+/** A date or timestamp in the locale's medium date style. Invalid dates format as `''`. */
+export function formatDate(value, { locale, ...options } = {}) {
+    const date = value instanceof Date ? value : new Date(value);
+    if (Number.isNaN(date.getTime()))
+        return '';
+    const settings = Object.keys(options).length ? options : { dateStyle: 'medium' };
+    return new Intl.DateTimeFormat(locale, settings).format(date);
+}

package/dist/core/index.d.ts

@@ -0,0 +1,11 @@
+export * from './types.js';
+export * from './format.js';
+export { applyTheme, axisStyle, chartFont, inkOn, seriesColor, tooltipCss, withDefaults, } from './theme.js';
+export type { ThemeOptions } from './theme.js';
+export { describeCategories, describeSlices, describeTrend, extremes } from './describe.js';
+export { buildBarOption, buildLineOption, categoryTable, describeBar, describeLine, } from './builders/category.js';
+export type { BarOptions, LineOptions } from './builders/category.js';
+export { buildFunnelOption, buildPieOption, describeFunnel, describePie, sliceTable, } from './builders/slices.js';
+export type { FunnelOptions, PieOptions } from './builders/slices.js';
+export { buildCandlestickOption, buildGaugeOption, buildHeatmapOption, buildRadarOption, buildSankeyOption, buildScatterOption, buildTreemapOption, candlestickTable, describeCandlestick, describeGauge, describeHeatmap, describeRadar, describeSankey, describeScatter, describeTreemap, gaugeTable, heatmapTable, linearFit, nodeValue, radarTable, sankeyTable, scatterTable, treemapTable, } from './builders/more.js';
+export type { CandlestickOptions, GaugeData, GaugeOptions, HeatmapOptions, RadarOptions, SankeyOptions, ScatterOptions, TreemapOptions, } from './builders/more.js';

package/dist/core/index.js

@@ -0,0 +1,12 @@
+/*
+ * Everything here is plain TypeScript with no Svelte and no ECharts import, so it runs anywhere:
+ * the server, a worker, a test. Build an option here and hand it to `<Chart>`, or to ECharts
+ * directly.
+ */
+export * from './types.js';
+export * from './format.js';
+export { applyTheme, axisStyle, chartFont, inkOn, seriesColor, tooltipCss, withDefaults, } from './theme.js';
+export { describeCategories, describeSlices, describeTrend, extremes } from './describe.js';
+export { buildBarOption, buildLineOption, categoryTable, describeBar, describeLine, } from './builders/category.js';
+export { buildFunnelOption, buildPieOption, describeFunnel, describePie, sliceTable, } from './builders/slices.js';
+export { buildCandlestickOption, buildGaugeOption, buildHeatmapOption, buildRadarOption, buildSankeyOption, buildScatterOption, buildTreemapOption, candlestickTable, describeCandlestick, describeGauge, describeHeatmap, describeRadar, describeSankey, describeScatter, describeTreemap, gaugeTable, heatmapTable, linearFit, nodeValue, radarTable, sankeyTable, scatterTable, treemapTable, } from './builders/more.js';

package/dist/core/theme.d.ts

@@ -0,0 +1,30 @@
+import type { ChartColors, ChartOption } from './types.js';
+type Plain = Record<string, unknown>;
+/** Fills in what `target` leaves unset from `defaults`, recursively. Never overwrites a value. */
+export declare function withDefaults<T extends Plain>(target: T, defaults: Plain): T;
+/** Inline styles that dress an ECharts tooltip as a loidolt popover. */
+export declare const tooltipCss: string;
+/** Text in charts uses the utility face, as every other label in the system does. */
+export declare const chartFont: "\"Archivo\", \"Helvetica Neue\", sans-serif";
+/** Axis styling from the theme: hairline axes, soft gridlines, muted labels. */
+export declare function axisStyle(colors: ChartColors): Plain;
+export interface ThemeOptions {
+    /** Turn transitions off, e.g. for `prefers-reduced-motion`. */
+    animation?: boolean;
+    /** Patterns on fills, so series stay apart without colour (WCAG 1.4.1). */
+    decal?: boolean;
+}
+/**
+ * Themes an option: the categorical palette, text in the utility face, axes, legend and tooltip —
+ * everything the option leaves unset. Anything the option sets itself wins, so a caller can
+ * override a single colour without restating the theme.
+ */
+export declare function applyTheme(option: ChartOption, colors?: ChartColors, { animation, decal }?: ThemeOptions): ChartOption;
+/** The palette colour for the `index`th series, wrapping round after eight. */
+export declare const seriesColor: (colors: ChartColors, index: number) => string;
+/**
+ * Whichever of the theme's text or surface colour reads better on `fill` — for labels printed on
+ * a slice or a funnel stage. Falls back to the text colour when any of them is not hex.
+ */
+export declare function inkOn(fill: string, colors: ChartColors): string;
+export {};

package/dist/core/theme.js

@@ -0,0 +1,137 @@
+import { chartColors, getContrastTextColor, typography } from '@loidolt/theme-tokens';
+const isPlain = (value) => typeof value === 'object' && value !== null && !Array.isArray(value);
+/** Fills in what `target` leaves unset from `defaults`, recursively. Never overwrites a value. */
+export function withDefaults(target, defaults) {
+    const out = { ...target };
+    for (const [key, fallback] of Object.entries(defaults)) {
+        const own = out[key];
+        if (own === undefined)
+            out[key] = fallback;
+        else if (isPlain(own) && isPlain(fallback))
+            out[key] = withDefaults(own, fallback);
+    }
+    return out;
+}
+/** Applies `defaults` to one component, or to each when the option holds a list of them. */
+const eachComponent = (value, defaults) => Array.isArray(value)
+    ? value.map((item) => (isPlain(item) ? withDefaults(item, defaults) : item))
+    : isPlain(value)
+        ? withDefaults(value, defaults)
+        : value;
+/** Inline styles that dress an ECharts tooltip as a loidolt popover. */
+export const tooltipCss = [
+    'border-radius: 0',
+    'border-color: var(--loidolt-border-strong)',
+    'background-color: var(--loidolt-surface)',
+    'color: var(--loidolt-text)',
+    'box-shadow: var(--loidolt-shadow-popover)',
+    'font-family: var(--loidolt-font-utility)',
+].join('; ');
+/** Text in charts uses the utility face, as every other label in the system does. */
+export const chartFont = typography.utility;
+/** Axis styling from the theme: hairline axes, soft gridlines, muted labels. */
+export function axisStyle(colors) {
+    return {
+        axisLine: { lineStyle: { color: colors.axis } },
+        axisTick: { lineStyle: { color: colors.axis } },
+        axisLabel: { color: colors.muted, fontFamily: chartFont, fontSize: 11 },
+        splitLine: { lineStyle: { color: colors.grid } },
+        nameTextStyle: { color: colors.muted, fontFamily: chartFont },
+    };
+}
+/**
+ * Themes an option: the categorical palette, text in the utility face, axes, legend and tooltip —
+ * everything the option leaves unset. Anything the option sets itself wins, so a caller can
+ * override a single colour without restating the theme.
+ */
+export function applyTheme(option, colors = chartColors(), { animation = true, decal = false } = {}) {
+    const axis = axisStyle(colors);
+    const themed = withDefaults(option, {
+        color: colors.categorical,
+        backgroundColor: 'transparent',
+        textStyle: { color: colors.text, fontFamily: chartFont, fontSize: 12 },
+        animation,
+        // Descriptions are supplied by the component, so ECharts' generated label stays off; its
+        // decal patterns are the part of `aria` worth having.
+        aria: { enabled: decal, label: { enabled: false }, decal: { show: decal } },
+    });
+    if (!animation)
+        themed.animation = false;
+    for (const key of ['xAxis', 'yAxis', 'singleAxis']) {
+        if (key in themed)
+            themed[key] = eachComponent(themed[key], axis);
+    }
+    if ('radar' in themed) {
+        themed.radar = eachComponent(themed.radar, {
+            axisName: { color: colors.muted, fontFamily: chartFont },
+            axisLine: { lineStyle: { color: colors.grid } },
+            splitLine: { lineStyle: { color: colors.grid } },
+            splitArea: { show: false },
+        });
+    }
+    if ('legend' in themed) {
+        themed.legend = eachComponent(themed.legend, {
+            textStyle: { color: colors.text, fontFamily: chartFont },
+            inactiveColor: colors.grid,
+            icon: 'rect',
+            itemWidth: 12,
+            itemHeight: 12,
+        });
+    }
+    if ('tooltip' in themed) {
+        themed.tooltip = eachComponent(themed.tooltip, {
+            className: 'ldt-chart-tooltip',
+            backgroundColor: colors.surface,
+            borderColor: colors.text,
+            borderWidth: 1,
+            padding: [7, 10],
+            // The tooltip is DOM, so it can wear a popover's tokens directly; these come after the
+            // inline styles ECharts writes, and follow the theme without a repaint.
+            extraCssText: tooltipCss,
+            textStyle: { color: colors.text, fontFamily: chartFont },
+            axisPointer: { lineStyle: { color: colors.axis }, crossStyle: { color: colors.axis } },
+        });
+    }
+    if ('visualMap' in themed) {
+        themed.visualMap = eachComponent(themed.visualMap, {
+            inRange: { color: colors.sequential },
+            textStyle: { color: colors.muted, fontFamily: chartFont },
+        });
+    }
+    if ('dataZoom' in themed) {
+        themed.dataZoom = eachComponent(themed.dataZoom, {
+            backgroundColor: 'transparent',
+            borderColor: colors.axis,
+            fillerColor: `${colors.accent.slice(0, 7)}29`,
+            textStyle: { color: colors.muted, fontFamily: chartFont },
+            dataBackground: { lineStyle: { color: colors.axis }, areaStyle: { color: colors.grid } },
+            selectedDataBackground: {
+                lineStyle: { color: colors.accent },
+                areaStyle: { color: colors.accent, opacity: 0.2 },
+            },
+            handleStyle: { color: colors.surface, borderColor: colors.text },
+            moveHandleStyle: { color: colors.axis, opacity: 1 },
+            emphasis: {
+                handleStyle: { borderColor: colors.accent },
+                moveHandleStyle: { color: colors.accent },
+            },
+        });
+    }
+    return themed;
+}
+/** The palette colour for the `index`th series, wrapping round after eight. */
+export const seriesColor = (colors, index) => colors.categorical[index % colors.categorical.length];
+/**
+ * Whichever of the theme's text or surface colour reads better on `fill` — for labels printed on
+ * a slice or a funnel stage. Falls back to the text colour when any of them is not hex.
+ */
+export function inkOn(fill, colors) {
+    const hex = /^#[0-9a-f]{6}/i;
+    if (![fill, colors.text, colors.surface].every((value) => hex.test(value)))
+        return colors.text;
+    // `getContrastTextColor` just picks the better of two inks; which is "dark" does not matter.
+    return getContrastTextColor(fill.slice(0, 7), {
+        dark: colors.text.slice(0, 7),
+        light: colors.surface.slice(0, 7),
+    });
+}

package/dist/core/types.d.ts

@@ -0,0 +1,98 @@
+import type { ChartColors } from '@loidolt/theme-tokens';
+export type { ChartColors };
+/**
+ * An ECharts option object. Kept structural rather than tied to ECharts' own `EChartsOption`, so
+ * the pure builders in `/core` stay importable without the chart library installed.
+ */
+export type ChartOption = Record<string, unknown>;
+/** An option, or a function that builds one from the resolved theme colours. */
+export type ChartOptionSource = ChartOption | ((colors: ChartColors) => ChartOption);
+/** A cell in a chart's data-table alternative. */
+export type ChartCell = string | number | null;
+/** The data behind a chart as a table — its non-visual alternative. */
+export interface ChartTable {
+    /** Column headings; the first usually names the category or row. */
+    columns: string[];
+    rows: ChartCell[][];
+}
+/** One named series over shared categories (line, bar, area). */
+export interface CategorySeries {
+    name: string;
+    /** One value per category; `null` leaves a gap. */
+    data: Array<number | null>;
+    /** Overrides the palette colour for this series. */
+    color?: string;
+}
+export interface CategoryData {
+    categories: string[];
+    series: CategorySeries[];
+}
+/** One slice of a part-to-whole chart (pie, donut, funnel). */
+export interface SliceDatum {
+    name: string;
+    value: number;
+    color?: string;
+}
+export interface ScatterSeries {
+    name: string;
+    /** `[x, y]` points. */
+    data: Array<[number, number]>;
+    color?: string;
+}
+export interface RadarData {
+    /** The spokes. `max` defaults to the largest value on that spoke. */
+    indicators: Array<{
+        name: string;
+        max?: number;
+        min?: number;
+    }>;
+    series: Array<{
+        name: string;
+        values: number[];
+        color?: string;
+    }>;
+}
+export interface HeatmapData {
+    x: string[];
+    y: string[];
+    /** `[xIndex, yIndex, value]` cells; missing cells stay empty. */
+    values: Array<[number, number, number | null]>;
+}
+export interface TreeNode {
+    name: string;
+    /** Leaf size. A branch without one is the sum of its children. */
+    value?: number;
+    children?: TreeNode[];
+    color?: string;
+}
+export interface CandlestickDatum {
+    /** Category label, usually a date. */
+    date: string;
+    open: number;
+    close: number;
+    low: number;
+    high: number;
+    volume?: number;
+}
+export interface SankeyData {
+    nodes: Array<{
+        name: string;
+        color?: string;
+    }>;
+    links: Array<{
+        source: string;
+        target: string;
+        value: number;
+    }>;
+}
+/** What a click or keyboard activation on a data point reports. */
+export interface ChartItemEvent {
+    /** `series`, `legend`, … as ECharts reports it. */
+    componentType: string;
+    seriesName?: string;
+    seriesIndex?: number;
+    /** The category, slice or node name. */
+    name: string;
+    dataIndex?: number;
+    value: unknown;
+}

package/dist/core/types.js

@@ -0,0 +1 @@
+export {};

package/dist/core/validate.d.ts

@@ -0,0 +1,4 @@
+import type { CategoryData } from './types.js';
+/** Throws a `RangeError` naming the builder, so a bad dataset fails where it is built. */
+export declare function invariant(condition: unknown, builder: string, message: string): asserts condition;
+export declare function checkCategories(data: CategoryData, builder: string): void;

package/dist/core/validate.js

@@ -0,0 +1,10 @@
+/** Throws a `RangeError` naming the builder, so a bad dataset fails where it is built. */
+export function invariant(condition, builder, message) {
+    if (!condition)
+        throw new RangeError(`${builder}: ${message}`);
+}
+export function checkCategories(data, builder) {
+    for (const series of data.series) {
+        invariant(series.data.length === data.categories.length, builder, `series "${series.name}" has ${series.data.length} values for ${data.categories.length} categories`);
+    }
+}

package/dist/echarts/all.d.ts

@@ -0,0 +1,3 @@
+import { BarChart } from 'echarts/charts';
+declare const _default: (typeof BarChart)[];
+export default _default;

package/dist/echarts/all.js

@@ -0,0 +1,23 @@
+/*
+ * Every chart type and component the wrappers use, for the generic `<Chart>` whose option can
+ * hold anything. Pass narrower `extensions` to `<Chart>` to ship less.
+ */
+import { BarChart, CandlestickChart, FunnelChart, GaugeChart, HeatmapChart, LineChart, PieChart, RadarChart, SankeyChart, ScatterChart, TreemapChart, } from 'echarts/charts';
+import { DataZoomComponent, MarkLineComponent, RadarComponent, VisualMapComponent, } from 'echarts/components';
+export default [
+    BarChart,
+    CandlestickChart,
+    FunnelChart,
+    GaugeChart,
+    HeatmapChart,
+    LineChart,
+    PieChart,
+    RadarChart,
+    SankeyChart,
+    ScatterChart,
+    TreemapChart,
+    DataZoomComponent,
+    MarkLineComponent,
+    RadarComponent,
+    VisualMapComponent,
+];

package/dist/echarts/bar.d.ts

@@ -0,0 +1,3 @@
+import { BarChart } from 'echarts/charts';
+declare const _default: (typeof BarChart)[];
+export default _default;

package/dist/echarts/bar.js

@@ -0,0 +1,2 @@
+import { BarChart } from 'echarts/charts';
+export default [BarChart];

package/dist/echarts/base.d.ts

@@ -0,0 +1,3 @@
+import { AriaComponent } from 'echarts/components';
+declare const _default: (typeof AriaComponent)[];
+export default _default;

package/dist/echarts/base.js

@@ -0,0 +1,13 @@
+/* The components and renderers every chart shares. */
+import { AriaComponent, DatasetComponent, GridComponent, LegendComponent, TitleComponent, TooltipComponent, } from 'echarts/components';
+import { CanvasRenderer, SVGRenderer } from 'echarts/renderers';
+export default [
+    AriaComponent,
+    DatasetComponent,
+    GridComponent,
+    LegendComponent,
+    TitleComponent,
+    TooltipComponent,
+    CanvasRenderer,
+    SVGRenderer,
+];

package/dist/echarts/candlestick.d.ts

@@ -0,0 +1,3 @@
+import { BarChart } from 'echarts/charts';
+declare const _default: (typeof BarChart)[];
+export default _default;

package/dist/echarts/candlestick.js

@@ -0,0 +1,3 @@
+import { BarChart, CandlestickChart } from 'echarts/charts';
+import { AxisPointerComponent, DataZoomComponent } from 'echarts/components';
+export default [CandlestickChart, BarChart, DataZoomComponent, AxisPointerComponent];

package/dist/echarts/funnel.d.ts

@@ -0,0 +1,3 @@
+import { FunnelChart } from 'echarts/charts';
+declare const _default: (typeof FunnelChart)[];
+export default _default;

package/dist/echarts/funnel.js

@@ -0,0 +1,2 @@
+import { FunnelChart } from 'echarts/charts';
+export default [FunnelChart];

package/dist/echarts/gauge.d.ts

@@ -0,0 +1,3 @@
+import { GaugeChart } from 'echarts/charts';
+declare const _default: (typeof GaugeChart)[];
+export default _default;

package/dist/echarts/gauge.js

@@ -0,0 +1,2 @@
+import { GaugeChart } from 'echarts/charts';
+export default [GaugeChart];

package/dist/echarts/heatmap.d.ts

@@ -0,0 +1,3 @@
+import { HeatmapChart } from 'echarts/charts';
+declare const _default: (typeof HeatmapChart)[];
+export default _default;

package/dist/echarts/heatmap.js

@@ -0,0 +1,3 @@
+import { HeatmapChart } from 'echarts/charts';
+import { VisualMapComponent } from 'echarts/components';
+export default [HeatmapChart, VisualMapComponent];

package/dist/echarts/line.d.ts

@@ -0,0 +1,3 @@
+import { LineChart } from 'echarts/charts';
+declare const _default: (typeof LineChart)[];
+export default _default;

package/dist/echarts/line.js

@@ -0,0 +1,2 @@
+import { LineChart } from 'echarts/charts';
+export default [LineChart];

package/dist/echarts/pie.d.ts

@@ -0,0 +1,3 @@
+import { PieChart } from 'echarts/charts';
+declare const _default: (typeof PieChart)[];
+export default _default;

package/dist/echarts/pie.js

@@ -0,0 +1,2 @@
+import { PieChart } from 'echarts/charts';
+export default [PieChart];

package/dist/echarts/radar.d.ts

@@ -0,0 +1,3 @@
+import { RadarChart } from 'echarts/charts';
+declare const _default: (typeof RadarChart)[];
+export default _default;

package/dist/echarts/radar.js

@@ -0,0 +1,3 @@
+import { RadarChart } from 'echarts/charts';
+import { RadarComponent } from 'echarts/components';
+export default [RadarChart, RadarComponent];

package/dist/echarts/sankey.d.ts

@@ -0,0 +1,3 @@
+import { SankeyChart } from 'echarts/charts';
+declare const _default: (typeof SankeyChart)[];
+export default _default;

package/dist/echarts/sankey.js

@@ -0,0 +1,2 @@
+import { SankeyChart } from 'echarts/charts';
+export default [SankeyChart];

package/dist/echarts/scatter.d.ts

@@ -0,0 +1,3 @@
+import { LineChart } from 'echarts/charts';
+declare const _default: (typeof LineChart)[];
+export default _default;

package/dist/echarts/scatter.js

@@ -0,0 +1,2 @@
+import { LineChart, ScatterChart } from 'echarts/charts';
+export default [ScatterChart, LineChart];

package/dist/echarts/treemap.d.ts

@@ -0,0 +1,3 @@
+import { TreemapChart } from 'echarts/charts';
+declare const _default: (typeof TreemapChart)[];
+export default _default;

package/dist/echarts/treemap.js

@@ -0,0 +1,2 @@
+import { TreemapChart } from 'echarts/charts';
+export default [TreemapChart];

package/dist/echarts.d.ts

@@ -0,0 +1,22 @@
+/** The slice of an ECharts instance the components use. */
+export interface EChartsInstance {
+    setOption(option: Record<string, unknown>, options?: Record<string, unknown>): void;
+    on(event: string, handler: (params: Record<string, unknown>) => void): void;
+    off(event: string, handler?: (params: Record<string, unknown>) => void): void;
+    resize(options?: Record<string, unknown>): void;
+    dispatchAction(action: Record<string, unknown>): void;
+    dispose(): void;
+    isDisposed(): boolean;
+}
+/** The slice of `echarts/core` the components use. */
+export interface EChartsCore {
+    init(element: HTMLElement, theme?: string | object | null, options?: Record<string, unknown>): EChartsInstance;
+    use(extensions: unknown[]): void;
+}
+export type EChartsLoader = () => Promise<EChartsCore> | EChartsCore;
+/** Replaces how `echarts/core` is loaded. `null` restores the default dynamic import. */
+export declare function setEChartsLoader(loader: EChartsLoader | null): void;
+/** Loads the ECharts core once. Resolves `null` rather than rejecting when it cannot. */
+export declare function loadECharts(): Promise<EChartsCore | null>;
+/** Chart extensions: resolves to the ECharts modules one chart type needs. */
+export type ChartExtensions = () => Promise<unknown[]>;