@pushwoosh/kit-charts 0.0.1

package/core/model/build-model.js

@@ -0,0 +1,556 @@
+import { colorAt, DEFAULT_COLORS, DEFAULT_SURFACE_COLOR } from './palette';
+import { normalizePoints } from '../data/points';
+import { applyValueFormat, formatTime } from '../format/time';
+import { measureLegend } from '../layout/legend-layout';
+import { measureText, textHeight } from '../layout/measure-text';
+import { AXIS_GUTTER_PADDING, AXIS_LABEL_GAP, AXIS_TITLE_GAP, MARKER_REACH, VALUE_LABEL_HEADROOM, X_AXIS_LABEL_DROP } from '../layout/metrics';
+import { computeSlots } from '../layout/point-width';
+import { layoutTitles } from '../layout/title-layout';
+import { resolveAxes, resolveSeries, isSeriesVisible } from '../options/normalize';
+import { createBandScale } from '../scale/band';
+import { createColorScale } from '../scale/color';
+import { createLinearScale } from '../scale/linear';
+import { createTimeScale, defaultTimeFormat } from '../scale/time';
+import { computeStacks } from '../stack/stack';
+/** Key for a switched-off series, or for one of its points. */
+export const hiddenKey = (seriesIndex, pointIndex) => pointIndex === undefined ? `${seriesIndex}` : `${seriesIndex}:${pointIndex}`;
+const DEFAULT_SPACING = [10, 10, 15, 10];
+const isBand = scale => scale.kind === 'band';
+const isContinuous = scale => scale.kind === 'linear' || scale.kind === 'time';
+function tickLabel(value, axis, timePattern, index, count, kind, numberFormat) {
+  var _axis$labels, _axis$labels2;
+  const formatter = (_axis$labels = axis.labels) === null || _axis$labels === void 0 ? void 0 : _axis$labels.formatter;
+  if (formatter) {
+    const node = formatter({
+      value,
+      index,
+      isFirst: index === 0,
+      isLast: index === count - 1,
+      axis: {
+        kind: kind,
+        min: undefined,
+        max: undefined
+      }
+    });
+    if (typeof node === 'string' || typeof node === 'number') {
+      return String(node);
+    }
+    return '';
+  }
+  if ((_axis$labels2 = axis.labels) !== null && _axis$labels2 !== void 0 && _axis$labels2.format) {
+    return applyValueFormat(axis.labels.format, value);
+  }
+  if (typeof value === 'number') {
+    return timePattern ? formatTime(timePattern, value) : numberFormat(value);
+  }
+  return String(value);
+}
+function collectCategories(axis, series, numeric = false) {
+  var _axis$categories;
+  if ((_axis$categories = axis.categories) !== null && _axis$categories !== void 0 && _axis$categories.length) {
+    return [...axis.categories];
+  }
+  const seen = [];
+  series.forEach(({
+    points
+  }) => {
+    points.forEach(point => {
+      if (typeof point.x !== 'string' && !numeric) {
+        return;
+      }
+      const label = String(point.x);
+      if (!seen.includes(label)) {
+        seen.push(label);
+      }
+    });
+  });
+  return seen;
+}
+const emptyExtent = () => ({
+  min: Infinity,
+  max: -Infinity
+});
+const grow = (extent, value) => {
+  if (value === null || !Number.isFinite(value)) {
+    return;
+  }
+  extent.min = Math.min(extent.min, value);
+  extent.max = Math.max(extent.max, value);
+};
+const settled = (extent, fallback) => Number.isFinite(extent.min) && Number.isFinite(extent.max) ? [extent.min, extent.max] : fallback;
+function buildXScale(axis, kind, extent, categories, range, hint) {
+  if (kind === 'band') {
+    return createBandScale({
+      domain: categories,
+      range,
+      reversed: axis.reversed === true
+    });
+  }
+  const [min, max] = settled(extent, kind === 'time' ? [0, 1] : [0, 1]);
+  const domain = [axis.min ?? min, axis.max ?? max];
+  if (kind === 'time') {
+    return createTimeScale({
+      domain,
+      range,
+      tickHint: hint,
+      tickUnit: typeof axis.tickInterval === 'string' ? axis.tickInterval : undefined
+    });
+  }
+  return createLinearScale({
+    domain,
+    range,
+    tickHint: hint,
+    allowDecimals: axis.allowDecimals
+  });
+}
+function buildYScale(axis, extent, range, hint, linked) {
+  var _axis$categories2;
+  if ((_axis$categories2 = axis.categories) !== null && _axis$categories2 !== void 0 && _axis$categories2.length) {
+    return createBandScale({
+      domain: [...axis.categories],
+      range: (linked === null || linked === void 0 ? void 0 : linked.kind) === 'band' ? linked.range() : range,
+      paddingInner: 0,
+      paddingOuter: 0,
+      // A y axis counts up from the bottom; `reversed` puts the first row on top.
+      reversed: axis.reversed !== true
+    });
+  }
+  if (linked) {
+    return linked;
+  }
+  const [min, max] = settled(extent, [0, 1]);
+  return createLinearScale({
+    domain: [axis.min ?? min, axis.max ?? max],
+    range,
+    // Only the end the caller left open may be rounded outwards; an explicit
+    // `min: 0` must not cost the other end its headroom for data labels.
+    nice: {
+      min: axis.min === undefined,
+      max: axis.max === undefined
+    },
+    tickHint: hint,
+    allowDecimals: axis.allowDecimals
+  });
+}
+function buildColorScale(options, extent, colors) {
+  var _axis$stops;
+  const axis = options.colorAxis;
+  if (!axis) {
+    return undefined;
+  }
+  const [min, max] = settled(extent, [0, 1]);
+  const stops = (_axis$stops = axis.stops) !== null && _axis$stops !== void 0 && _axis$stops.length ? axis.stops : [[0, DEFAULT_SURFACE_COLOR], [1, colorAt(colors, 0)]];
+  return createColorScale({
+    domain: [axis.min ?? min, axis.max ?? max],
+    stops
+  });
+}
+const EXPLICIT_ANCHOR = {
+  left: 'start',
+  center: 'middle',
+  right: 'end'
+};
+function tickAnchor(label, position, axis, bounds) {
+  var _axis$labels3, _axis$labels4;
+  const explicit = ((_axis$labels3 = axis.labels) === null || _axis$labels3 === void 0 ? void 0 : _axis$labels3.align) && EXPLICIT_ANCHOR[axis.labels.align];
+  if (explicit) {
+    return explicit;
+  }
+  if (!bounds || !label) {
+    return 'middle';
+  }
+  const half = measureText(label, (_axis$labels4 = axis.labels) === null || _axis$labels4 === void 0 ? void 0 : _axis$labels4.style) / 2;
+  if (position - half < bounds[0]) {
+    return 'start';
+  }
+  if (position + half > bounds[1]) {
+    return 'end';
+  }
+  return 'middle';
+}
+/**
+ * Blanks the label of any tick whose text would run into the last one kept.
+ * Highcharts hides the text and leaves the tick, which is what keeps a dense
+ * axis readable instead of turning it into a smear.
+ */
+function dropOverlapping(ticks, axis, along) {
+  var _axis$labels5, _axis$labels6;
+  if (((_axis$labels5 = axis.labels) === null || _axis$labels5 === void 0 ? void 0 : _axis$labels5.allowOverlap) === true || ticks.length < 2) {
+    return ticks;
+  }
+  const style = (_axis$labels6 = axis.labels) === null || _axis$labels6 === void 0 ? void 0 : _axis$labels6.style;
+  // A y axis counts upwards, so its tick positions descend. Comparing distance
+  // rather than order keeps one rule for both directions.
+  let kept = null;
+  return ticks.map(tick => {
+    if (!tick.label) {
+      return tick;
+    }
+    const half = (along === 'x' ? measureText(tick.label, style) : textHeight(style)) / 2;
+    if (kept && Math.abs(tick.position - kept.position) < half + kept.half + AXIS_LABEL_GAP) {
+      return {
+        ...tick,
+        label: ''
+      };
+    }
+    kept = {
+      position: tick.position,
+      half
+    };
+    return tick;
+  });
+}
+function axisTicks(axis, scale, hint, timePattern, along, numberFormat, bounds) {
+  var _axis$tickPositions;
+  let values;
+  if ((_axis$tickPositions = axis.tickPositions) !== null && _axis$tickPositions !== void 0 && _axis$tickPositions.length) {
+    values = [...axis.tickPositions];
+  } else if (isBand(scale)) {
+    values = scale.ticks();
+  } else if (typeof axis.tickInterval === 'number' && isContinuous(scale)) {
+    const [min, max] = scale.domain();
+    values = [];
+    for (let v = Math.ceil(min / axis.tickInterval) * axis.tickInterval; v <= max && values.length < 1000; v += axis.tickInterval) {
+      values.push(v);
+    }
+  } else {
+    values = isContinuous(scale) ? scale.ticks(hint) : [];
+  }
+  const offset = isBand(scale) ? scale.bandwidth() / 2 : 0;
+  const built = values.map((value, index) => {
+    var _axis$labels7, _axis$labels7$hint;
+    const position = (isBand(scale) ? scale.map(String(value)) : scale.map(Number(value))) + offset;
+    const label = tickLabel(value, axis, timePattern, index, values.length, scale.kind, numberFormat);
+    return {
+      value,
+      position,
+      label,
+      anchor: tickAnchor(label, position, axis, bounds),
+      hint: (_axis$labels7 = axis.labels) === null || _axis$labels7 === void 0 || (_axis$labels7$hint = _axis$labels7.hint) === null || _axis$labels7$hint === void 0 ? void 0 : _axis$labels7$hint.call(_axis$labels7, {
+        value,
+        index,
+        isFirst: index === 0,
+        isLast: index === values.length - 1,
+        axis: {
+          kind: scale.kind,
+          min: undefined,
+          max: undefined
+        }
+      })
+    };
+  });
+  return dropOverlapping(built, axis, along);
+}
+function halfStepPadding(series) {
+  const xs = new Set();
+  series.forEach(({
+    renderer,
+    points
+  }) => {
+    if (renderer.scales.x !== 'band') {
+      return;
+    }
+    points.forEach(point => {
+      if (typeof point.x === 'number' && Number.isFinite(point.x)) {
+        xs.add(point.x);
+      }
+    });
+  });
+  if (xs.size < 2) {
+    return 0;
+  }
+  const sorted = [...xs].sort((left, right) => left - right);
+  let step = Infinity;
+  for (let i = 1; i < sorted.length; i += 1) {
+    step = Math.min(step, sorted[i] - sorted[i - 1]);
+  }
+  return Number.isFinite(step) ? step / 2 : 0;
+}
+export function buildChartModel({
+  options,
+  size,
+  renderers,
+  hidden
+}) {
+  var _options$colors, _xAxisOptions$categor, _resolved$, _options$chart, _xAxisOptions$labels, _xAxisOptions$labels2, _xAxisOptions$labels3, _xAxisOptions$labels4, _options$legend, _options$legend2, _yAxes$, _yAxes$2, _yAxes$3, _yAxes$4, _options$legend3, _options$chart2, _options$chart3, _options$chart4, _options$chart5;
+  const colors = (_options$colors = options.colors) !== null && _options$colors !== void 0 && _options$colors.length ? options.colors : DEFAULT_COLORS;
+  const numberFormat = options.numberFormat ?? String;
+  const {
+    xAxes,
+    yAxes
+  } = resolveAxes(options);
+  const xAxisOptions = xAxes[0] ?? {};
+  const all = [];
+  resolveSeries(options).forEach((series, index) => {
+    const renderer = renderers.get(series.type);
+    if (!renderer) {
+      return;
+    }
+    all.push({
+      options: series,
+      renderer,
+      index,
+      color: series.color ?? colorAt(colors, index),
+      points: normalizePoints(series.data, series.name ?? `series ${index}`),
+      hiddenPoints: new Set(normalizePoints(series.data, series.name ?? `series ${index}`).filter(point => hidden === null || hidden === void 0 ? void 0 : hidden.has(hiddenKey(index, point.index))).map(point => point.index)),
+      hidden: !isSeriesVisible(series) || ((hidden === null || hidden === void 0 ? void 0 : hidden.has(hiddenKey(index))) ?? false)
+    });
+  });
+  // Everything that shapes the chart — domains, stacks, column slots — comes from
+  // the series on show; a hidden one only keeps its place in the legend.
+  const shown = all.filter(series => !series.hidden);
+  // With nothing left on show the axes would collapse to their fallback range and
+  // the series being switched off would jump there before it finished fading, so
+  // the chart holds the shape it had until something is switched back on.
+  const resolved = shown.length ? shown : all;
+  const explicitCategories = Boolean((_xAxisOptions$categor = xAxisOptions.categories) === null || _xAxisOptions$categor === void 0 ? void 0 : _xAxisOptions$categor.length);
+  const axisless = resolved.length > 0 && resolved.every(({
+    renderer
+  }) => renderer.scales.x === 'none');
+  const labelled = collectCategories(xAxisOptions, resolved);
+  const rendererXKind = (_resolved$ = resolved[0]) === null || _resolved$ === void 0 ? void 0 : _resolved$.renderer.scales.x;
+  const xKind = (() => {
+    if (xAxisOptions.type === 'datetime') {
+      return 'time';
+    }
+    if (xAxisOptions.type === 'category' || labelled.length > 0) {
+      return 'band';
+    }
+    return rendererXKind === 'band' ? 'band' : 'linear';
+  })();
+  const categories = xKind === 'band' && !labelled.length ? collectCategories(xAxisOptions, resolved, true) : labelled;
+  const stacks = computeStacks(resolved);
+  if (xKind === 'band') {
+    resolved.forEach(({
+      points
+    }) => {
+      points.forEach(point => {
+        if (typeof point.x === 'string') {
+          point.band = point.x;
+          return;
+        }
+        if (!explicitCategories) {
+          point.band = String(point.x);
+          return;
+        }
+        point.band = categories[Number(point.x)] ?? categories[point.index] ?? String(point.x);
+      });
+    });
+    resolved.forEach(({
+      points
+    }) => {
+      points.forEach(point => {
+        if (point.band !== undefined && !categories.includes(point.band)) {
+          categories.push(point.band);
+        }
+      });
+    });
+  }
+  const xExtent = emptyExtent();
+  const colorExtent = emptyExtent();
+  const yExtents = yAxes.map(() => emptyExtent());
+  resolved.forEach(({
+    points,
+    options: series,
+    index,
+    hiddenPoints
+  }) => {
+    const yIndex = Math.min(series.yAxis ?? 0, yExtents.length - 1);
+    const stacked = stacks.get(index);
+    points.forEach((point, pointIndex) => {
+      if (hiddenPoints.has(point.index)) {
+        return;
+      }
+      if (typeof point.x === 'number') {
+        grow(xExtent, point.x);
+      }
+      grow(colorExtent, point.value);
+      const cumulative = stacked === null || stacked === void 0 ? void 0 : stacked[pointIndex];
+      if (cumulative) {
+        grow(yExtents[yIndex], cumulative.from);
+        grow(yExtents[yIndex], cumulative.to);
+      } else {
+        grow(yExtents[yIndex], point.y);
+      }
+    });
+  });
+  const seeded = {
+    x: {
+      ...xExtent
+    },
+    y: yExtents.map(extent => ({
+      ...extent
+    })),
+    color: {
+      ...colorExtent
+    },
+    categories
+  };
+  const acc = resolved.reduce((current, {
+    renderer,
+    options: series
+  }) => renderer.extendDomain(series, current), seeded);
+  const bandOnContinuous = xKind !== 'band' && resolved.some(({
+    renderer
+  }) => renderer.scales.x === 'band');
+  const pad = bandOnContinuous ? halfStepPadding(resolved) : 0;
+  const xDomain = pad > 0 ? {
+    min: acc.x.min - pad,
+    max: acc.x.max + pad
+  } : acc.x;
+  const yDomains = acc.y;
+  const spacing = ((_options$chart = options.chart) === null || _options$chart === void 0 ? void 0 : _options$chart.spacing) ?? DEFAULT_SPACING;
+  const [spaceTop, spaceRight, spaceBottom, spaceLeft] = spacing;
+  const labelsOnTop = xAxisOptions.opposite === true;
+  const labelStyle = (_xAxisOptions$labels = xAxisOptions.labels) === null || _xAxisOptions$labels === void 0 ? void 0 : _xAxisOptions$labels.style;
+  // A tick label is drawn a tick's length plus a fixed drop away from the axis
+  // line, and `labels.y` pushes it further still. Reserving only its text height
+  // leaves it hanging over the chart edge, where the svg clips it.
+  const xLabelPush = labelsOnTop ? Math.max(0, -(((_xAxisOptions$labels2 = xAxisOptions.labels) === null || _xAxisOptions$labels2 === void 0 ? void 0 : _xAxisOptions$labels2.y) ?? 0)) : Math.max(0, ((_xAxisOptions$labels3 = xAxisOptions.labels) === null || _xAxisOptions$labels3 === void 0 ? void 0 : _xAxisOptions$labels3.y) ?? 0);
+  const xLabelHeight = axisless || ((_xAxisOptions$labels4 = xAxisOptions.labels) === null || _xAxisOptions$labels4 === void 0 ? void 0 : _xAxisOptions$labels4.enabled) === false ? 0 : textHeight(labelStyle) + (xAxisOptions.tickLength ?? 0) + (labelsOnTop ? AXIS_LABEL_GAP : X_AXIS_LABEL_DROP) + xLabelPush;
+  const legendEnabled = ((_options$legend = options.legend) === null || _options$legend === void 0 ? void 0 : _options$legend.enabled) !== false;
+  const legend = legendEnabled ? all.flatMap(({
+    renderer,
+    options: series,
+    index,
+    hidden: off
+  }) => {
+    const items = renderer.legendItems(series, index, colors);
+    return items.map((item, ordinal) => ({
+      ...item,
+      color: item.color || colorAt(colors, items.length > 1 ? ordinal : index),
+      visible: !off && !(hidden !== null && hidden !== void 0 && hidden.has(hiddenKey(index, item.pointIndex)))
+    }));
+  }) : [];
+  const legendMetrics = measureLegend(legend, options.legend);
+  const legendHeight = legendMetrics.height;
+  const legendAtTop = (((_options$legend2 = options.legend) === null || _options$legend2 === void 0 ? void 0 : _options$legend2.verticalAlign) ?? 'bottom') === 'top';
+  const titles = layoutTitles(options, size, spacing);
+  const titleHeight = titles.height;
+  const yLabelsShown = !axisless && ((_yAxes$ = yAxes[0]) === null || _yAxes$ === void 0 ? void 0 : _yAxes$.visible) !== false && ((_yAxes$2 = yAxes[0]) === null || _yAxes$2 === void 0 || (_yAxes$2 = _yAxes$2.labels) === null || _yAxes$2 === void 0 ? void 0 : _yAxes$2.enabled) !== false;
+  const markerReach = resolved.some(({
+    options: series
+  }) => {
+    var _series$marker;
+    return ((_series$marker = series.marker) === null || _series$marker === void 0 ? void 0 : _series$marker.enabled) !== false;
+  }) ? MARKER_REACH : 0;
+  // The topmost tick label is centred on the plot's top edge, so half of it hangs
+  // above the plot: without this the highest grid line and its label sit on the
+  // chart border.
+  const topOverflow = Math.max(yLabelsShown ? Math.ceil(textHeight((_yAxes$3 = yAxes[0]) === null || _yAxes$3 === void 0 || (_yAxes$3 = _yAxes$3.labels) === null || _yAxes$3 === void 0 ? void 0 : _yAxes$3.style) / 2) : 0, axisless ? 0 : markerReach);
+  // Point and stack labels are drawn above the shape they belong to, so the plot
+  // has to end below the chart edge — otherwise the topmost value sits on the
+  // border, or gets pushed inside the shape to avoid being cut off.
+  const outsideLabels = axisless ? undefined : resolved.find(({
+    options: series,
+    renderer
+  }) => {
+    var _series$dataLabels;
+    return ((_series$dataLabels = series.dataLabels) === null || _series$dataLabels === void 0 ? void 0 : _series$dataLabels.enabled) && !series.stacking && renderer.scales.y === 'linear';
+  });
+  const stackLabels = yAxes.find(axis => {
+    var _axis$stackLabels;
+    return (_axis$stackLabels = axis.stackLabels) === null || _axis$stackLabels === void 0 ? void 0 : _axis$stackLabels.enabled;
+  });
+  const labelHeadroom = (() => {
+    if (outsideLabels) {
+      var _outsideLabels$option;
+      return textHeight((_outsideLabels$option = outsideLabels.options.dataLabels) === null || _outsideLabels$option === void 0 ? void 0 : _outsideLabels$option.style) + VALUE_LABEL_HEADROOM;
+    }
+    if (stackLabels && !axisless) {
+      var _stackLabels$stackLab;
+      return textHeight((_stackLabels$stackLab = stackLabels.stackLabels) === null || _stackLabels$stackLab === void 0 ? void 0 : _stackLabels$stackLab.style) + VALUE_LABEL_HEADROOM;
+    }
+    return 0;
+  })();
+  const marginTop = spaceTop + titleHeight + (legendAtTop ? legendHeight : 0) + (labelsOnTop ? xLabelHeight : 0) + Math.max(labelHeadroom, topOverflow);
+  const marginBottom = spaceBottom + (labelsOnTop ? 0 : xLabelHeight) + (legendAtTop ? 0 : legendHeight);
+  const measureGutter = estimate => {
+    var _axis$labels8, _axis$categories3, _axis$title;
+    const axis = yAxes[0] ?? {};
+    if (((_axis$labels8 = axis.labels) === null || _axis$labels8 === void 0 ? void 0 : _axis$labels8.enabled) === false) {
+      return estimate;
+    }
+    const labels = (_axis$categories3 = axis.categories) !== null && _axis$categories3 !== void 0 && _axis$categories3.length ? [...axis.categories] : axisTicks(axis, createLinearScale({
+      domain: (() => {
+        const [min, max] = settled(yDomains[0] ?? emptyExtent(), [0, 1]);
+        return [axis.min ?? min, axis.max ?? max];
+      })(),
+      range: [size.height - marginBottom, marginTop],
+      nice: true,
+      tickHint: axis.tickAmount ?? 5,
+      allowDecimals: axis.allowDecimals
+    }), axis.tickAmount ?? 5, undefined, 'y', numberFormat).map(tick => tick.label);
+    const widest = labels.reduce((widest_, label) => {
+      var _axis$labels9;
+      return Math.max(widest_, measureText(label, (_axis$labels9 = axis.labels) === null || _axis$labels9 === void 0 ? void 0 : _axis$labels9.style));
+    }, 0);
+    const title = (_axis$title = axis.title) !== null && _axis$title !== void 0 && _axis$title.text && (axis.title.rotation ?? -90) !== 0 ? textHeight(axis.title.style) + AXIS_TITLE_GAP : 0;
+    return Math.ceil(widest) + AXIS_GUTTER_PADDING + title;
+  };
+  const gutter = axisless || ((_yAxes$4 = yAxes[0]) === null || _yAxes$4 === void 0 ? void 0 : _yAxes$4.visible) === false ? 0 : measureGutter(32);
+  const legendAlign = ((_options$legend3 = options.legend) === null || _options$legend3 === void 0 ? void 0 : _options$legend3.align) ?? 'left';
+  const legendBesideLeft = legendMetrics.beside && legendAlign === 'left';
+  // Highcharts margins replace the computed edge distance rather than adding to it.
+  const left = ((_options$chart2 = options.chart) === null || _options$chart2 === void 0 ? void 0 : _options$chart2.marginLeft) ?? spaceLeft + gutter + (legendBesideLeft ? legendMetrics.width : 0);
+  const right = ((_options$chart3 = options.chart) === null || _options$chart3 === void 0 ? void 0 : _options$chart3.marginRight) ?? spaceRight + (legendMetrics.beside && !legendBesideLeft ? legendMetrics.width : 0);
+  const top = ((_options$chart4 = options.chart) === null || _options$chart4 === void 0 ? void 0 : _options$chart4.marginTop) ?? marginTop;
+  const bottom = ((_options$chart5 = options.chart) === null || _options$chart5 === void 0 ? void 0 : _options$chart5.marginBottom) ?? marginBottom;
+  const plot = {
+    x: left,
+    y: top,
+    width: Math.max(0, size.width - left - right),
+    height: Math.max(0, size.height - top - bottom)
+  };
+  if (plot.width <= 0 || plot.height <= 0) {
+    return null;
+  }
+  const xHint = xAxisOptions.tickPixelInterval ? Math.max(2, Math.round(plot.width / xAxisOptions.tickPixelInterval)) : Math.max(2, Math.min(8, Math.round(plot.width / 90)));
+  const xScale = buildXScale(xAxisOptions, xKind, xDomain, categories, [plot.x, plot.x + plot.width], xHint);
+  const timePattern = xKind === 'time' && isContinuous(xScale) ? defaultTimeFormat(...xScale.domain()) : undefined;
+  const slots = computeSlots({
+    series: resolved.filter(({
+      renderer
+    }) => renderer.scales.x === 'band'),
+    scale: xScale,
+    plotWidth: plot.width,
+    stacks
+  });
+  const yAxisModels = yAxes.reduce((built, axis, index) => {
+    var _axis$categories4;
+    const hint = axis.tickAmount ?? 5;
+    const target = axis.linkedTo === undefined ? undefined : built[axis.linkedTo];
+    const range = (_axis$categories4 = axis.categories) !== null && _axis$categories4 !== void 0 && _axis$categories4.length ? [plot.y, plot.y + plot.height] : [plot.y + plot.height, plot.y];
+    const scale = buildYScale(axis, yDomains[index] ?? emptyExtent(), range, hint, target === null || target === void 0 ? void 0 : target.scale);
+    built.push({
+      id: `y${index}`,
+      options: axis,
+      scale,
+      ticks: axisTicks(axis, scale, hint, undefined, 'y', numberFormat)
+    });
+    return built;
+  }, []);
+  const colorScale = buildColorScale(options, acc.color, colors);
+  return {
+    numberFormat,
+    spacing,
+    plot,
+    axisless,
+    xAxis: {
+      id: 'x0',
+      options: xAxisOptions,
+      scale: xScale,
+      ticks: axisTicks(xAxisOptions, xScale, xHint, timePattern, 'x', numberFormat, [plot.x, plot.x + plot.width])
+    },
+    yAxes: yAxisModels,
+    titles: titles.entries,
+    colorScale,
+    series: all,
+    legend,
+    colors,
+    categories,
+    stacks,
+    slots
+  };
+}
+export { isBand, isContinuous };

package/core/model/palette.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Series palette, in the order series are drawn. These are the design system's
+ * service and brand colours rather than a set invented here, so a chart matches
+ * the product it sits in. The order alternates hue family — blue, orange, green,
+ * purple — so that neighbouring series stay apart from each other.
+ */
+export declare const DEFAULT_COLORS: readonly string[];
+export declare const DEFAULT_GRID_COLOR: string;
+export declare const DEFAULT_AXIS_COLOR: string;
+export declare const DEFAULT_TEXT_COLOR: string;
+export declare const DEFAULT_MUTED_TEXT_COLOR: string;
+export declare const DEFAULT_SURFACE_COLOR: string;
+export declare const DEFAULT_TOOLTIP_SURFACE_COLOR: string;
+export declare const DEFAULT_TOOLTIP_TEXT_COLOR: string;
+export declare const colorAt: (colors: readonly string[], index: number) => string;

package/core/model/palette.js

@@ -0,0 +1,17 @@
+import { Color } from '@pushwoosh/kit-constants';
+/**
+ * Series palette, in the order series are drawn. These are the design system's
+ * service and brand colours rather than a set invented here, so a chart matches
+ * the product it sits in. The order alternates hue family — blue, orange, green,
+ * purple — so that neighbouring series stay apart from each other.
+ */
+export const DEFAULT_COLORS = [Color.PRIMARY, Color.WARNING, Color.SUCCESS, Color.EXCEPTIONAL, Color.BRIGHT, Color.DANGER, Color.BRAND_GREEN, Color.SOFT, Color.BRAND_BLUE, Color.BRAND_BLACK];
+export const DEFAULT_GRID_COLOR = Color.DIVIDER;
+export const DEFAULT_AXIS_COLOR = Color.FORM;
+export const DEFAULT_TEXT_COLOR = Color.MAIN;
+export const DEFAULT_MUTED_TEXT_COLOR = Color.LOCKED;
+export const DEFAULT_SURFACE_COLOR = Color.CLEAR;
+// Chart tooltips follow the product hint style: dark bubble, light text.
+export const DEFAULT_TOOLTIP_SURFACE_COLOR = Color.BRAND_BLACK;
+export const DEFAULT_TOOLTIP_TEXT_COLOR = Color.CLEAR;
+export const colorAt = (colors, index) => colors[index % colors.length] ?? DEFAULT_COLORS[index % DEFAULT_COLORS.length];

package/core/options/normalize.d.ts

@@ -0,0 +1,8 @@
+import { type AxisOptions, type ChartOptions, type SeriesOptionsBase } from '../types/options';
+export declare const toAxisArray: (axis: AxisOptions | readonly AxisOptions[] | undefined) => AxisOptions[];
+export declare function resolveSeries(options: ChartOptions): SeriesOptionsBase[];
+export declare function resolveAxes(options: ChartOptions): {
+    xAxes: AxisOptions[];
+    yAxes: AxisOptions[];
+};
+export declare const isSeriesVisible: (series: SeriesOptionsBase) => boolean;

package/core/options/normalize.js

@@ -0,0 +1,44 @@
+function merge(...layers) {
+  const result = {};
+  layers.forEach(layer => {
+    if (!layer) {
+      return;
+    }
+    Object.entries(layer).forEach(([key, value]) => {
+      if (value === undefined) {
+        return;
+      }
+      const existing = result[key];
+      const bothPlain = isPlainObject(existing) && isPlainObject(value);
+      result[key] = bothPlain ? merge(existing, value) : value;
+    });
+  });
+  return result;
+}
+const isPlainObject = value => typeof value === 'object' && value !== null && !Array.isArray(value);
+export const toAxisArray = axis => {
+  if (!axis) {
+    return [{}];
+  }
+  return Array.isArray(axis) ? [...axis] : [axis];
+};
+export function resolveSeries(options) {
+  var _options$chart;
+  const defaultType = ((_options$chart = options.chart) === null || _options$chart === void 0 ? void 0 : _options$chart.type) ?? 'line';
+  const plotOptions = options.plotOptions ?? {};
+  return (options.series ?? []).map(series => {
+    const type = series.type ?? defaultType;
+    return merge({
+      type
+    }, plotOptions.series, plotOptions[type], series, {
+      type
+    });
+  });
+}
+export function resolveAxes(options) {
+  return {
+    xAxes: toAxisArray(options.xAxis),
+    yAxes: toAxisArray(options.yAxis)
+  };
+}
+export const isSeriesVisible = series => series.visible !== false;

package/core/registry/registry.d.ts

@@ -0,0 +1,5 @@
+import { type AnySeriesRenderer } from '../types/renderer';
+export declare function registerSeries(...renderers: AnySeriesRenderer[]): void;
+export declare function clearSeriesRegistry(): void;
+export declare function resolveRenderers(local?: readonly AnySeriesRenderer[]): ReadonlyMap<string, AnySeriesRenderer>;
+export declare function getRenderer(renderers: ReadonlyMap<string, AnySeriesRenderer>, type: string): AnySeriesRenderer | undefined;

package/core/registry/registry.js

@@ -0,0 +1,32 @@
+const globalRegistry = new Map();
+const isDev = process.env.NODE_ENV !== 'production';
+export function registerSeries(...renderers) {
+  renderers.forEach(renderer => {
+    const existing = globalRegistry.get(renderer.type);
+    if (existing === renderer) {
+      return;
+    }
+    if (existing && isDev) {
+      throw new Error(`[kit-charts] Two different renderers registered for series type "${renderer.type}".`);
+    }
+    globalRegistry.set(renderer.type, renderer);
+  });
+}
+export function clearSeriesRegistry() {
+  globalRegistry.clear();
+}
+export function resolveRenderers(local) {
+  if (!(local !== null && local !== void 0 && local.length)) {
+    return globalRegistry;
+  }
+  const resolved = new Map(globalRegistry);
+  local.forEach(renderer => resolved.set(renderer.type, renderer));
+  return resolved;
+}
+export function getRenderer(renderers, type) {
+  const renderer = renderers.get(type);
+  if (!renderer && isDev) {
+    console.error(`[kit-charts] No renderer for series type "${type}". ` + `Import it and call registerSeries: ` + `import { ${type} } from '@pushwoosh/kit-charts/series/${type}'.`);
+  }
+  return renderer;
+}