@santi020k/lumen-core 3.0.0 → 4.0.0

package/dist/charts.js

@@ -1,3 +1,4 @@
+export { createLumenChartActivationController, createLumenChartDatumActivation, createLumenHeatmapDatumActivation, createLumenRangeDatumActivation, parseLumenChartDatumActivation } from './chart-activation.js';
 export const lumenChartTones = [
     'series-1',
     'series-2',
@@ -25,11 +26,18 @@ const formatDefaultLumenChartSummary = (summary, formatValue) => {
         `Values range from ${formatValue(summary.minimum ?? 0)} to ${formatValue(summary.maximum ?? 0)}.${missing}`;
 };
 export const lumenChartLabels = Object.freeze({
+    count: 'Count',
+    density: 'Frequency density',
+    end: 'End',
+    invalidData: 'Chart data is invalid. Check the supplied values.',
+    start: 'Start',
     category: 'Category',
     chartData: 'Chart data',
     chartLegend: 'Chart legend',
     column: 'Column',
     empty: 'No chart data available.',
+    exploreData: 'Explore chart data',
+    formatDatumAction: (context) => `Open details: ${context}`,
     formatHeatmapSummary: (count) => count === 0 ?
         'No chart data available.' :
         `${count} available heatmap ${count === 1 ? 'cell' : 'cells'}.`,
@@ -88,9 +96,9 @@ export const getLumenChartDomain = (values, includeZero = true) => {
         max = Math.max(0, max);
     }
     if (min === max) {
-        const offset = Math.abs(min || 1) * 0.1;
-        min -= offset;
-        max += offset;
+        const offset = Math.max(Number.MIN_VALUE, Math.abs(min || 1) * 0.1);
+        min = Math.max(-Number.MAX_VALUE, min - offset);
+        max = Math.min(Number.MAX_VALUE, max + offset);
     }
     return { max, min };
 };
@@ -103,9 +111,12 @@ const resolveLumenChartDomain = (values, requested, includeZero) => {
 };
 export const scaleLumenChartValue = (value, domain, rangeStart, rangeEnd) => {
     const domainSize = domain.max - domain.min;
-    if (!Number.isFinite(value) || domainSize === 0)
+    if (!Number.isFinite(value) || !Number.isFinite(domain.min) || !Number.isFinite(domain.max) || domainSize === 0)
         return rangeStart;
-    const ratio = (value - domain.min) / domainSize;
+    // A valid domain can span opposite finite extremes whose difference overflows.
+    const ratio = Number.isFinite(domainSize) ?
+        (value - domain.min) / domainSize :
+        (value / 2 - domain.min / 2) / (domain.max / 2 - domain.min / 2);
     return rangeStart + ratio * (rangeEnd - rangeStart);
 };
 export const getLumenChartTicks = (domain, count = 5) => {
@@ -134,6 +145,148 @@ export const getLumenChartTicks = (domain, count = 5) => {
         return ticks;
     return [domain.min, domain.max];
 };
+const chartAxisLabelCharacterWidth = 7;
+const chartAxisLabelNarrowCharacterWidth = 4;
+const chartAxisLabelWideCharacterWidth = 11;
+const chartAxisLabelGap = 16;
+const maximumChartAxisPadding = 240;
+const chartAxisLabelNarrowCharacters = new Set([
+    ' ', '.', ',', ':', ';', '!', '|', '\'', 'i', 'j', 'l', 'I'
+]);
+const chartAxisLabelWideCharacters = new Set(['M', 'W', '@', '%', '&', '#']);
+const chartAxisCombiningCodePointRanges = [
+    [0x0300, 0x036F],
+    [0x1AB0, 0x1AFF],
+    [0x1DC0, 0x1DFF],
+    [0x20D0, 0x20FF],
+    [0xFE00, 0xFE0F],
+    [0xFE20, 0xFE2F],
+    [0x1F3FB, 0x1F3FF]
+];
+const chartAxisWideCodePointRanges = [
+    [0x1100, 0x115F],
+    [0x2329, 0x232A],
+    [0x2E80, 0xA4CF],
+    [0xAC00, 0xD7A3],
+    [0xF900, 0xFAFF],
+    [0xFE10, 0xFE19],
+    [0xFE30, 0xFE6F],
+    [0xFF00, 0xFF60],
+    [0xFFE0, 0xFFE6],
+    [0x1F300, 0x1FAFF],
+    [0x20000, 0x3FFFD]
+];
+const isLumenChartCodePointInRanges = (codePoint, ranges) => ranges.some(([start, end]) => codePoint >= start && codePoint <= end);
+const isLumenChartCombiningCodePoint = (codePoint) => (codePoint === 0x200D ||
+    isLumenChartCodePointInRanges(codePoint, chartAxisCombiningCodePointRanges));
+const isLumenChartWideCodePoint = (codePoint) => (isLumenChartCodePointInRanges(codePoint, chartAxisWideCodePointRanges));
+const getLumenChartAxisCharacterWidth = (character) => {
+    const codePoint = character.codePointAt(0) ?? 0;
+    if (isLumenChartCombiningCodePoint(codePoint))
+        return 0;
+    if (isLumenChartWideCodePoint(codePoint))
+        return chartAxisLabelWideCharacterWidth;
+    if (chartAxisLabelWideCharacters.has(character))
+        return 10;
+    if (chartAxisLabelNarrowCharacters.has(character))
+        return chartAxisLabelNarrowCharacterWidth;
+    return chartAxisLabelCharacterWidth;
+};
+const estimateLumenChartAxisLabelWidth = (label) => {
+    let width = 0;
+    for (const character of label) {
+        width += getLumenChartAxisCharacterWidth(character);
+    }
+    return Math.max(label.length * chartAxisLabelCharacterWidth, width);
+};
+/**
+ * Reserves enough SVG space for formatted value-axis labels when text measurement is unavailable
+ * during server rendering. The estimate targets Lumen's 0.6875rem chart label style and stays
+ * bounded so unusually verbose formatters cannot consume the complete plot.
+ */
+export const getLumenChartAxisPadding = (labels, minimum = 44) => {
+    const safeMinimum = Math.max(0, minimum);
+    const widestLabelWidth = labels.reduce((widest, label) => Math.max(widest, estimateLumenChartAxisLabelWidth(label)), 0);
+    const estimated = widestLabelWidth + chartAxisLabelGap;
+    return Math.min(maximumChartAxisPadding, Math.max(safeMinimum, estimated));
+};
+const fitLumenChartLabel = (label, maximumWidth) => {
+    if (estimateLumenChartAxisLabelWidth(label) <= maximumWidth)
+        return label;
+    const suffix = '…';
+    let result = '';
+    let width = estimateLumenChartAxisLabelWidth(suffix);
+    for (const character of label) {
+        width += Math.max(chartAxisLabelCharacterWidth, getLumenChartAxisCharacterWidth(character));
+        if (width > maximumWidth)
+            break;
+        result += character;
+    }
+    return result + suffix;
+};
+const getLumenChartTickAnchor = (index, count) => {
+    if (count === 1)
+        return 'middle';
+    if (index === 0)
+        return 'start';
+    return index === count - 1 ? 'end' : 'middle';
+};
+const selectLumenChartCategoryTicks = (candidates, gap) => {
+    const first = candidates[0];
+    const last = candidates.at(-1);
+    if (!first || !last)
+        return [];
+    if (candidates.length === 1)
+        return [first];
+    const lastStart = last.position - estimateLumenChartAxisLabelWidth(last.label);
+    const ticks = [first];
+    let previousEnd = first.position + estimateLumenChartAxisLabelWidth(first.label);
+    for (const candidate of candidates.slice(1, -1)) {
+        const halfWidth = estimateLumenChartAxisLabelWidth(candidate.label) / 2;
+        const labelStart = candidate.position - halfWidth;
+        const labelEnd = candidate.position + halfWidth;
+        if (labelStart < previousEnd + gap || labelEnd + gap > lastStart)
+            continue;
+        ticks.push(candidate);
+        previousEnd = labelEnd;
+    }
+    if (lastStart >= previousEnd + gap)
+        ticks.push(last);
+    return ticks;
+};
+const resolveLumenChartTickPositions = (count, end, positions, start) => {
+    const validPositions = positions?.length === count && positions.every((position, index) => (Number.isFinite(position) && position >= start && position <= end && position >= (positions[index - 1] ?? start)));
+    if (validPositions)
+        return positions;
+    return Array.from({ length: count }, (_, index) => (start + (count === 1 ? 0.5 : index / (count - 1)) * (end - start)));
+};
+/** Selects readable axis labels without changing or downsampling the underlying chart data. */
+export const getLumenChartCategoryTicks = (labels, { end, minimumGap = 16, positions, start }) => {
+    if (labels.length === 0 || !Number.isFinite(start) || !Number.isFinite(end) || end < start)
+        return [];
+    const gap = Number.isFinite(minimumGap) ? Math.max(0, minimumGap) : 16;
+    const resolvedPositions = resolveLumenChartTickPositions(labels.length, end, positions, start);
+    const span = (resolvedPositions.at(-1) ?? end) - (resolvedPositions[0] ?? start);
+    const maximumWidth = Math.max(0, labels.length === 1 ? end - start : (span - gap) / 2);
+    const candidates = labels.map((label, index) => ({
+        index,
+        label: fitLumenChartLabel(label, maximumWidth),
+        position: resolvedPositions[index] ?? start,
+        textAnchor: getLumenChartTickAnchor(index, labels.length)
+    }));
+    return selectLumenChartCategoryTicks(candidates, gap);
+};
+/** Axis labels prefer xLabel; detail labels prefer an explicitly supplied full formatter. */
+export const getLumenChartCategoryLabel = (series, category, formatCategory, context = 'axis') => {
+    if (context === 'detail' && formatCategory)
+        return formatCategory(category);
+    for (const item of series) {
+        const label = item.data.find(datum => datum.x === category)?.xLabel;
+        if (label !== undefined)
+            return label;
+    }
+    return formatCategory?.(category) ?? String(category);
+};
 export const resolveLumenChartTone = (tone, index = 0) => tone ?? lumenChartTones[index % 8] ?? 'series-1';
 export const getLumenChartToneClassName = (tone, index = 0) => lumenChartToneClassNames[resolveLumenChartTone(tone, index)];
 export const getLumenPieChartVariantClassName = (variant) => lumenPieChartVariantClassNames[variant];
@@ -237,6 +390,8 @@ export const getLumenChartNumericX = (value, scale) => {
     if (typeof value === 'number')
         return Number.isFinite(value) ? value : null;
     if (scale === 'linear') {
+        if (!value.trim())
+            return null;
         const numeric = Number(value);
         return Number.isFinite(numeric) ? numeric : null;
     }
@@ -250,24 +405,24 @@ const getLumenChartXDomain = (data, scale, requested) => {
         min: requested?.min ?? calculated.min
     };
 };
-const getLumenLineXCoordinate = (datum, index, dataLength, padding, drawableWidth, xScale, xDomain) => {
+const getLumenLineXCoordinate = (datum, index, dataLength, paddingLeft, drawableWidth, xScale, xDomain) => {
     if (xScale === 'categorical') {
         const denominator = Math.max(1, dataLength - 1);
-        return padding + (dataLength === 1 ? 0.5 : index / denominator) * drawableWidth;
+        return paddingLeft + (dataLength === 1 ? 0.5 : index / denominator) * drawableWidth;
     }
     const numericX = getLumenChartNumericX(datum.x, xScale);
     if (numericX === null || xDomain === undefined)
         return null;
-    return scaleLumenChartValue(numericX, xDomain, padding, padding + drawableWidth);
+    return scaleLumenChartValue(numericX, xDomain, paddingLeft, paddingLeft + drawableWidth);
 };
 const isAvailableLumenChartY = (value) => value !== null && Number.isFinite(value);
-const splitGeometrySegments = (data, domain, width, height, padding, xScale, xDomain) => {
-    const drawableWidth = Math.max(0, width - padding * 2);
-    const drawableHeight = Math.max(0, height - padding * 2);
+const splitGeometrySegments = (data, domain, width, height, paddingBottom, paddingLeft, paddingRight, paddingTop, xScale, xDomain) => {
+    const drawableWidth = Math.max(0, width - paddingLeft - paddingRight);
+    const drawableHeight = Math.max(0, height - paddingTop - paddingBottom);
     const segments = [];
     let current = [];
     for (const [index, datum] of data.entries()) {
-        const xCoordinate = getLumenLineXCoordinate(datum, index, data.length, padding, drawableWidth, xScale, xDomain);
+        const xCoordinate = getLumenLineXCoordinate(datum, index, data.length, paddingLeft, drawableWidth, xScale, xDomain);
         if (!isAvailableLumenChartY(datum.y) || xCoordinate === null) {
             if (current.length > 0)
                 segments.push(current);
@@ -277,7 +432,7 @@ const splitGeometrySegments = (data, domain, width, height, padding, xScale, xDo
         current.push({
             ...datum,
             xCoordinate,
-            yCoordinate: scaleLumenChartValue(datum.y, domain, padding + drawableHeight, padding)
+            yCoordinate: scaleLumenChartValue(datum.y, domain, paddingTop + drawableHeight, paddingTop)
         });
     }
     if (current.length > 0)
@@ -303,8 +458,13 @@ const lumenLineAreaPath = (points, baseline) => {
         'Z'
     ].join(' ');
 };
+const resolveLumenLinePadding = (value, fallback) => value ?? fallback;
 export const createLumenLineGeometry = (data, options = {}) => {
-    const { domain: requestedDomain, height = defaultChartSize, includeZero = false, padding = defaultChartPadding, width = defaultChartSize, xDomain: requestedXDomain, xScale = 'categorical' } = options;
+    const { domain: requestedDomain, height = defaultChartSize, includeZero = false, padding = defaultChartPadding, paddingBottom: requestedPaddingBottom, paddingLeft: requestedPaddingLeft, paddingRight: requestedPaddingRight, paddingTop: requestedPaddingTop, width = defaultChartSize, xDomain: requestedXDomain, xScale = 'categorical' } = options;
+    const paddingBottom = resolveLumenLinePadding(requestedPaddingBottom, padding);
+    const paddingLeft = resolveLumenLinePadding(requestedPaddingLeft, padding);
+    const paddingRight = resolveLumenLinePadding(requestedPaddingRight, padding);
+    const paddingTop = resolveLumenLinePadding(requestedPaddingTop, padding);
     const domainValues = xScale === 'categorical' ?
         data.map(datum => datum.y) :
         data
@@ -312,8 +472,8 @@ export const createLumenLineGeometry = (data, options = {}) => {
             .map(datum => datum.y);
     const domain = resolveLumenChartDomain(domainValues, requestedDomain, includeZero);
     const xDomain = xScale === 'categorical' ? undefined : getLumenChartXDomain(data, xScale, requestedXDomain);
-    const segments = splitGeometrySegments(data, domain, width, height, padding, xScale, xDomain);
-    const baseline = scaleLumenChartValue(Math.max(domain.min, Math.min(domain.max, 0)), domain, height - padding, padding);
+    const segments = splitGeometrySegments(data, domain, width, height, paddingBottom, paddingLeft, paddingRight, paddingTop, xScale, xDomain);
+    const baseline = scaleLumenChartValue(Math.max(domain.min, Math.min(domain.max, 0)), domain, height - paddingBottom, paddingTop);
     return {
         areaPaths: segments
             .map(points => lumenLineAreaPath(points, baseline))
@@ -384,7 +544,7 @@ export const createLumenBarGeometry = (series, options = {}) => {
     const layout = options.layout ?? 'grouped';
     const categories = getLumenChartCategories(series);
     const indexedSeries = series.map(indexLumenChartSeries);
-    const values = series.flatMap(item => item.data.map(datum => datum.y));
+    const values = indexedSeries.flatMap(item => [...item.values()].map(datum => datum.y));
     const calculatedDomain = layout === 'stacked' ?
         getStackedDomain(series, categories) :
         getLumenChartDomain(values);
@@ -395,11 +555,16 @@ export const createLumenBarGeometry = (series, options = {}) => {
     const margin = orientation === 'horizontal' ?
         {
             bottom: 24,
-            left: Math.max(64, Math.min(240, options.categoryWidth ?? 112)),
+            left: Math.max(64, Math.min(240, options.categoryWidth ?? getLumenChartAxisPadding(categories.map(category => getLumenChartCategoryLabel(series, category, options.formatCategory)), 112))),
             right: 20,
             top: 16
         } :
-        { bottom: 52, left: 52, right: 16, top: 16 };
+        {
+            bottom: 52,
+            left: getLumenChartAxisPadding(getLumenChartTicks(domain).map(tick => (options.formatValue ?? String)(tick)), 52),
+            right: 16,
+            top: 16
+        };
     const plotWidth = Math.max(1, width - margin.left - margin.right);
     const plotHeight = Math.max(1, height - margin.top - margin.bottom);
     const categorySize = (orientation === 'horizontal' ? plotHeight : plotWidth) /
@@ -417,9 +582,7 @@ export const createLumenBarGeometry = (series, options = {}) => {
         let negativeOffset = 0;
         categoryPositions.push({
             category,
-            label: series
-                .flatMap(item => item.data)
-                .find(datum => datum.x === category)?.xLabel ?? category,
+            label: getLumenChartCategoryLabel(series, category, options.formatCategory),
             x: orientation === 'horizontal' ?
                 margin.left - 8 :
                 categoryStart + usableCategorySize / 2,
@@ -487,6 +650,7 @@ export const createLumenBarGeometry = (series, options = {}) => {
         categories: categoryPositions,
         domain,
         height,
+        margin,
         marks,
         width
     };
@@ -552,8 +716,18 @@ const validateLumenChartDatumNumbers = (datum, context) => {
     }
 };
 const validateLumenChartDatumX = (datum, context) => {
-    if (context.xScale === 'categorical')
+    if (context.xScale === 'categorical') {
+        const key = lumenChartCategoryKey(datum.x);
+        if (context.categories.has(key)) {
+            context.issues.push({
+                code: 'duplicate-category',
+                message: 'Category x values must be unique within a series. Use xLabel for repeated display labels.',
+                path: `${context.path}.x`
+            });
+        }
+        context.categories.add(key);
         return context.previousX;
+    }
     const numericX = getLumenChartNumericX(datum.x, context.xScale);
     if (numericX === null) {
         context.issues.push({
@@ -591,9 +765,11 @@ export const validateLumenChartSeries = (series, xScale = 'categorical') => {
         }
         seriesIds.add(item.id);
         const datumIds = new Set();
+        const categories = new Set();
         let previousX = Number.NEGATIVE_INFINITY;
         for (const [datumIndex, datum] of item.data.entries()) {
             previousX = validateLumenChartDatum(datum, {
+                categories,
                 datumIds,
                 issues,
                 path: `${seriesPath}.data[${datumIndex}]`,
@@ -653,6 +829,68 @@ export const appendLumenChartDatum = (series, datum, maximumPoints = 500) => {
         data: data.slice(Math.max(0, data.length - safeMaximum))
     };
 };
+const getLumenScatterNumericX = (value, scale) => {
+    const numeric = getLumenChartNumericX(value, scale === 'log' ? 'linear' : scale);
+    return scale === 'log' && numeric !== null && numeric <= 0 ? null : numeric;
+};
+const validScatterDomain = (domain, scale) => {
+    const finite = Number.isFinite(domain.min) && Number.isFinite(domain.max);
+    return finite && domain.max > domain.min && (scale !== 'log' || domain.min > 0);
+};
+const getLumenScatterXDomain = (data, scale, requested) => {
+    const values = data.map(datum => getLumenScatterNumericX(datum.x, scale));
+    const calculated = scale === 'log' && !values.some(value => value !== null) ?
+        { min: 1, max: 10 } :
+        getLumenChartDomain(values, false);
+    const domain = { min: requested?.min ?? calculated.min, max: requested?.max ?? calculated.max };
+    if (!validScatterDomain(domain, scale))
+        throw new RangeError('Scatter x domain must be finite, ordered, and positive for log scales');
+    return domain;
+};
+export const scaleLumenScatterX = (value, domain, rangeStart, rangeEnd, scale = 'linear') => {
+    if (scale !== 'log')
+        return scaleLumenChartValue(value, domain, rangeStart, rangeEnd);
+    if (value <= 0 || !Number.isFinite(value))
+        return Number.NaN;
+    return scaleLumenChartValue(Math.log10(value), { min: Math.log10(domain.min), max: Math.log10(domain.max) }, rangeStart, rangeEnd);
+};
+export const getLumenScatterXTicks = (domain, scale) => scale === 'log' ?
+    getLumenChartTicks({ min: Math.log10(domain.min), max: Math.log10(domain.max) }).map(value => 10 ** value) :
+    getLumenChartTicks(domain);
+const scatterReferenceCoordinate = (value, fallback, project) => {
+    if (value === undefined)
+        return fallback;
+    return project(value);
+};
+const isLumenScatterReference = (value) => {
+    if (typeof value !== 'object' || value === null || !('id' in value) || !('label' in value))
+        return false;
+    if (typeof value.id !== 'string' || typeof value.label !== 'string')
+        return false;
+    return ['x', 'y', 'xEnd', 'yEnd'].every(key => {
+        const coordinate = Reflect.get(value, key);
+        return coordinate === undefined || (typeof coordinate === 'number' && Number.isFinite(coordinate));
+    });
+};
+export const createLumenScatterReferences = (references, geometry, scale = 'linear', padding = 44) => {
+    const result = [];
+    if (!Array.isArray(references))
+        return result;
+    const x = (value) => scaleLumenScatterX(value, geometry.xDomain, padding, geometry.width - padding, scale);
+    const y = (value) => scaleLumenChartValue(value, geometry.domain, geometry.height - padding, padding);
+    for (const reference of references) {
+        if (!isLumenScatterReference(reference))
+            continue;
+        const region = reference.xEnd !== undefined && reference.yEnd !== undefined;
+        const x1 = scatterReferenceCoordinate(reference.x, padding, x);
+        const y1 = scatterReferenceCoordinate(reference.y, padding, y);
+        const x2 = scatterReferenceCoordinate(reference.xEnd, reference.x === undefined ? geometry.width - padding : x1, x);
+        const y2 = scatterReferenceCoordinate(reference.yEnd, reference.y === undefined ? geometry.height - padding : y1, y);
+        if ([x1, x2, y1, y2].every(Number.isFinite))
+            result.push({ ...reference, x1, x2, y1, y2, region });
+    }
+    return result;
+};
 const resolveLumenScatterGeometryOptions = (options) => ({
     height: options.height ?? 320,
     maximumRadius: options.maximumRadius ?? 18,
@@ -664,7 +902,7 @@ const resolveLumenScatterGeometryOptions = (options) => ({
     xScale: options.xScale ?? 'linear'
 });
 const createLumenScatterPoint = (datum, context) => {
-    const numericX = getLumenChartNumericX(datum.x, context.xScale);
+    const numericX = getLumenScatterNumericX(datum.x, context.xScale);
     if (numericX === null || !isAvailableLumenChartY(datum.y))
         return null;
     const radius = datum.size === null || datum.size === undefined || !Number.isFinite(datum.size) || datum.size < 0 ?
@@ -676,20 +914,52 @@ const createLumenScatterPoint = (datum, context) => {
         seriesId: context.series.id,
         seriesLabel: context.series.label,
         tone: resolveLumenChartTone(datum.tone ?? context.series.tone, context.seriesIndex),
-        xCoordinate: scaleLumenChartValue(numericX, context.xDomain, context.padding, context.width - context.padding),
+        xCoordinate: scaleLumenScatterX(numericX, context.xDomain, context.padding, context.width - context.padding, context.xScale),
         yCoordinate: scaleLumenChartValue(datum.y, context.domain, context.height - context.padding, context.padding)
     };
 };
+const finiteLumenScatterBound = (value, fallback, scale) => (Number.isFinite(value) && (scale !== 'log' || value > 0) ? value : fallback);
+// Automatic extents leave room for the complete bubble, including its stroke.
+// Explicit bounds remain exact so consumers can intentionally crop a viewport.
+const padLumenScatterDomain = (domain, values, requested, extent, radius, scale = 'linear') => {
+    if (values.length === 0 || extent <= 0)
+        return domain;
+    const project = (value) => scale === 'log' ? Math.log10(value) : value;
+    const fromScale = (value) => scale === 'log' ? 10 ** value : value;
+    const min = project(domain.min);
+    const max = project(domain.max);
+    const inset = Math.min(radius + 2, extent / 4);
+    const extra = (max - min) * inset / (extent - 2 * inset);
+    const projected = values.map(project);
+    const bounds = projected.reduce((result, value) => ({
+        min: Math.min(result.min, value), max: Math.max(result.max, value)
+    }), { min: Number.POSITIVE_INFINITY, max: Number.NEGATIVE_INFINITY });
+    const paddedMin = fromScale(Math.min(min, bounds.min - extra));
+    const paddedMax = fromScale(Math.max(max, bounds.max + extra));
+    return {
+        min: requested?.min ?? finiteLumenScatterBound(paddedMin, domain.min, scale),
+        max: requested?.max ?? finiteLumenScatterBound(paddedMax, domain.max, scale)
+    };
+};
 export const createLumenScatterGeometry = (series, options = {}) => {
     const { height, maximumRadius: requestedMaximumRadius, minimumRadius: requestedMinimumRadius, padding, requestedDomain, requestedXDomain, width, xScale } = resolveLumenScatterGeometryOptions(options);
     const data = series.flatMap(item => item.data);
-    const projectedData = data.filter(datum => (getLumenChartNumericX(datum.x, xScale) !== null && isAvailableLumenChartY(datum.y)));
-    const domain = resolveLumenChartDomain(projectedData.map(datum => datum.y), requestedDomain, false);
-    const xDomain = getLumenChartXDomain(projectedData, xScale, requestedXDomain);
+    const projectedData = data.filter(datum => (getLumenScatterNumericX(datum.x, xScale) !== null && isAvailableLumenChartY(datum.y)));
+    const calculatedDomain = resolveLumenChartDomain(projectedData.map(datum => datum.y), requestedDomain, false);
+    if (!validScatterDomain(calculatedDomain, 'linear')) {
+        throw new RangeError('Scatter y domain must be finite and increasing');
+    }
+    const calculatedXDomain = getLumenScatterXDomain(projectedData, xScale, requestedXDomain);
     const sizes = projectedData.map(datum => (datum.size !== undefined && datum.size !== null && datum.size >= 0 ? datum.size : null));
     const sizeDomain = getLumenChartDomain(sizes, false);
     const minimumRadius = Math.max(1, requestedMinimumRadius);
     const maximumRadius = Math.max(minimumRadius, requestedMaximumRadius);
+    const yValues = projectedData.flatMap(datum => datum.y === null ? [] : [datum.y]);
+    const domain = padLumenScatterDomain(calculatedDomain, yValues, requestedDomain, height - padding * 2, maximumRadius);
+    const xDomain = padLumenScatterDomain(calculatedXDomain, projectedData.flatMap(datum => {
+        const value = getLumenScatterNumericX(datum.x, xScale);
+        return value === null ? [] : [value];
+    }), requestedXDomain, width - padding * 2, maximumRadius, xScale);
     const points = [];
     for (const [seriesIndex, item] of series.entries()) {
         for (const datum of item.data) {
@@ -718,6 +988,33 @@ const uniqueLumenChartCategories = (values) => {
         categories.set(lumenChartCategoryKey(value), value);
     return [...categories.values()];
 };
+const isHeatmapRecord = (value) => {
+    if (Array.isArray(value))
+        return false;
+    return typeof value === 'object' && value !== null;
+};
+const isHeatmapCoordinate = (value) => typeof value === 'string' || (typeof value === 'number' && Number.isFinite(value));
+const isOptionalHeatmapLabel = (value) => value === undefined || typeof value === 'string';
+const isHeatmapTone = (value) => {
+    if (value === undefined)
+        return true;
+    return lumenChartTones.some(tone => tone === value);
+};
+const isHeatmapDatum = (datum) => {
+    if (!isHeatmapRecord(datum))
+        return false;
+    return isHeatmapCoordinate(datum.x) && isHeatmapCoordinate(datum.y) &&
+        // Non-finite measurements are missing cells; coordinates still require finite numbers.
+        (datum.value === null || typeof datum.value === 'number') &&
+        [datum.id, datum.label, datum.xLabel, datum.yLabel].every(isOptionalHeatmapLabel) && isHeatmapTone(datum.tone);
+};
+/** Reject the whole decoded collection before adapters read or format cell fields. */
+export const normalizeLumenHeatmapData = (data) => {
+    if (!Array.isArray(data))
+        return [];
+    const rows = Array.from(data);
+    return rows.every(isHeatmapDatum) ? rows : [];
+};
 const createLumenHeatmapCell = (datum, context) => {
     const xIndex = context.xIndexes.get(lumenChartCategoryKey(datum.x));
     const yIndex = context.yIndexes.get(lumenChartCategoryKey(datum.y));
@@ -734,7 +1031,8 @@ const createLumenHeatmapCell = (datum, context) => {
         yCoordinate: yIndex * context.cellHeight
     };
 };
-export const createLumenHeatmapGeometry = (data, width = 640, height = 320) => {
+export const createLumenHeatmapGeometry = (rawData, width = 640, height = 320) => {
+    const data = normalizeLumenHeatmapData(rawData);
     const xCategories = uniqueLumenChartCategories(data.map(datum => datum.x));
     const yCategories = uniqueLumenChartCategories(data.map(datum => datum.y));
     const domain = getLumenChartDomain(data.map(datum => datum.value), false);
@@ -803,3 +1101,4 @@ export const createLumenRangeGeometry = (data, options = {}) => {
         points: segments.flat()
     };
 };
+export * from './extended-charts.js';

package/dist/code.js

@@ -320,7 +320,7 @@ const getMarkupTokenKind = (value, source, start) => {
         return 'symbol';
     const openingTagIndex = source.lastIndexOf('<', start);
     const closingTagIndex = source.lastIndexOf('>', start);
-    if (openingTagIndex < closingTagIndex)
+    if (openingTagIndex <= closingTagIndex)
         return undefined;
     const beforeValue = source
         .slice(openingTagIndex + 1, start)

package/dist/combobox.d.ts

@@ -0,0 +1,7 @@
+export interface LumenComboboxController {
+    close: () => void;
+    destroy: () => void;
+}
+/** Editable combobox. */
+export declare const createLumenComboboxController: (root: HTMLElement) => LumenComboboxController;
+//# sourceMappingURL=combobox.d.ts.map

package/dist/combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../src/combobox.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAyBD,yBAAyB;AACzB,eAAO,MAAM,6BAA6B,GAAI,MAAM,WAAW,KAAG,uBAwTjE,CAAA"}