@pixerate/editor 0.46.0 → 0.46.1

package/dist/chart/index.cjs

@@ -335,9 +335,12 @@ function niceStep(span, count) {
 }
 var clean = (n) => Math.abs(n) < 1e-12 ? 0 : Number(n.toPrecision(12));
 function niceScale(min, max, count = 5, fixedMin = null, fixedMax = null) {
+  if (fixedMin !== null && !Number.isFinite(fixedMin)) fixedMin = null;
+  if (fixedMax !== null && !Number.isFinite(fixedMax)) fixedMax = null;
   let lo = _nullishCoalesce(fixedMin, () => ( min));
   let hi = _nullishCoalesce(fixedMax, () => ( max));
   if (!Number.isFinite(lo) || !Number.isFinite(hi)) {
+    fixedMin = fixedMax = null;
     lo = 0;
     hi = 1;
   }
@@ -347,17 +350,36 @@ function niceScale(min, max, count = 5, fixedMin = null, fixedMax = null) {
     if (fixedMin === null && lo !== 0) lo -= pad;
     if (fixedMax === null || lo === hi) hi += pad;
   }
-  const step = niceStep(hi - lo, count);
-  const niceMin = _nullishCoalesce(fixedMin, () => ( clean(Math.floor(lo / step + 1e-9) * step)));
-  const niceMax = _nullishCoalesce(fixedMax, () => ( clean(Math.ceil(hi / step - 1e-9) * step)));
+  const span = hi - lo;
+  const step = Number.isFinite(span) ? niceStep(span, count) : niceStep(hi / 2 - lo / 2, count) * 2;
+  const finiteOr = (n2, fallback) => Number.isFinite(n2) ? n2 : fallback;
+  const niceMin = _nullishCoalesce(fixedMin, () => ( finiteOr(snap(Math.floor(lo / step + 1e-9) * step, step), lo)));
+  const niceMax = _nullishCoalesce(fixedMax, () => ( finiteOr(snap(Math.ceil(hi / step - 1e-9) * step, step), hi)));
+  const firstIndex = Math.ceil(niceMin / step - 1e-9);
+  const lastIndex = Math.floor(niceMax / step + 1e-9);
+  const n = Math.min(999, Math.max(-1, lastIndex - firstIndex));
   const ticks = [];
-  const first = Math.ceil(niceMin / step - 1e-9) * step;
-  for (let t = first, i = 0; t <= niceMax + step * 1e-9 && i < 1e3; t += step, i++) ticks.push(clean(t));
+  for (let i = 0; i <= n; i++) {
+    const t = snap((firstIndex + i) * step, step);
+    if (Number.isFinite(t) && t !== ticks[ticks.length - 1]) ticks.push(t);
+  }
   return { min: niceMin, max: niceMax, step, ticks };
 }
+function snap(n, step) {
+  const c = clean(n);
+  return Math.abs(c - n) <= step * 1e-6 ? c : n;
+}
 function stepDecimals(step) {
-  if (!(step > 0) || step >= 1) return 0;
-  return Math.min(6, Math.max(0, Math.ceil(-Math.log10(step) - 1e-9)));
+  if (!(step > 0) || !Number.isFinite(step)) return 0;
+  for (let d = 0; d < 6; d++) {
+    const scaled = step * Math.pow(10, d);
+    if (Math.abs(scaled - Math.round(scaled)) < 1e-9) return d;
+  }
+  return 6;
+}
+function magnitudeDecimals(value) {
+  if (!(value > 0) || value >= 1) return 0;
+  return Math.min(6, Math.max(0, Math.ceil(-Math.log10(value) - 1e-9)));
 }
 var COMPACT = [
   { value: 1e12, suffix: "T" },
@@ -379,7 +401,7 @@ function formatChartNumber(value, format = {}, fallbackDecimals) {
   const decimalsFor = (v) => {
     if (format.decimals !== void 0) return format.decimals;
     if (fallbackDecimals !== void 0) return fallbackDecimals;
-    return Number.isInteger(v) ? 0 : Math.abs(v) < 1 ? Math.min(4, Math.max(2, stepDecimals(Math.abs(v)) + 1)) : 2;
+    return Number.isInteger(v) ? 0 : Math.abs(v) < 1 ? Math.min(4, Math.max(2, magnitudeDecimals(Math.abs(v)) + 1)) : 2;
   };
   const trim = (s) => format.decimals === void 0 && fallbackDecimals === void 0 && s.includes(".") ? s.replace(/\.?0+$/, "") : s;
   if (style === "percent") {
@@ -426,6 +448,20 @@ function sameChartSelection(a, b) {
       return true;
   }
 }
+function contrastingTextColor(fill) {
+  let rgb = null;
+  const hex = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(fill.trim());
+  if (hex) {
+    const h = hex[1].length === 3 ? [...hex[1]].map((c) => c + c).join("") : hex[1];
+    rgb = [0, 2, 4].map((i) => parseInt(h.slice(i, i + 2), 16));
+  } else {
+    const fn = /^rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)/i.exec(fill.trim());
+    if (fn) rgb = fn.slice(1, 4).map(Number);
+  }
+  if (!rgb) return "#ffffff";
+  const luminance = (0.299 * rgb[0] + 0.587 * rgb[1] + 0.114 * rgb[2]) / 255;
+  return luminance > 0.5 ? "#0f172a" : "#ffffff";
+}
 var r2 = (n) => Math.round(n * 100) / 100;
 function curvePath(points, curve, map, moveFirst = true) {
   if (!points.length) return "";
@@ -583,8 +619,11 @@ function layoutChart(spec, options) {
   const xAxis = spec.xAxis;
   const yAxis = spec.yAxis;
   const titleBand = fs * 1.3 + 6;
+  const frozen = options.valueDomain;
+  const fixedMin = frozen && Number.isFinite(frozen.min) ? frozen.min : yAxis.min;
+  const fixedMax = frozen && Number.isFinite(frozen.max) ? frozen.max : yAxis.max;
   const valueLen0 = horizontal ? area.width : area.height;
-  let scale = niceScale(lo, hi, Math.max(2, Math.min(10, Math.round(valueLen0 / 56))), yAxis.min, yAxis.max);
+  let scale = niceScale(lo, hi, Math.max(2, Math.min(10, Math.round(valueLen0 / 56))), fixedMin, fixedMax);
   const tickText = (t) => formatChartNumber(t, valueFormat, _nullishCoalesce(valueFormat.decimals, () => ( stepDecimals(scale.step))));
   const valueLabelWidth = Math.max(0, ...scale.ticks.map((t) => measure(tickText(t), fs)));
   const catLabelWidth = Math.max(0, ...spec.categories.map((c) => measure(c, fs)));
@@ -608,7 +647,7 @@ function layoutChart(spec, options) {
     width: Math.max(1, area.width - left - rightPad),
     height: Math.max(1, area.height - bottom - (horizontal ? 4 : fs / 2 + 2))
   };
-  scale = niceScale(lo, hi, Math.max(2, Math.min(10, Math.round((horizontal ? plot.width : plot.height) / 56))), yAxis.min, yAxis.max);
+  scale = niceScale(lo, hi, Math.max(2, Math.min(10, Math.round((horizontal ? plot.width : plot.height) / 56))), fixedMin, fixedMax);
   const domain = [scale.min, scale.max];
   const valueRange = horizontal ? [plot.x, plot.x + plot.width] : [plot.y + plot.height, plot.y];
   const valuePx = (v) => linearMap(Math.min(scale.max, Math.max(scale.min, v)), domain, valueRange);
@@ -718,6 +757,8 @@ function layoutChart(spec, options) {
         if (selected) outline(`bar-${s.id}-${i}-selection`, { x: rect.x - 2, y: rect.y - 2, width: rect.width + 4, height: rect.height + 4 });
         if (spec.dataLabels) {
           const v = percent ? seg[1] - seg[0] : raw;
+          const text2 = dataLabel(v);
+          if (stacked && Math.abs(b - a) < (horizontal ? measure(text2, fs - 1) + 4 : fs + 1)) return;
           const end = valuePx(seg[1]);
           const outward = (seg[1] >= seg[0] ? 1 : -1) * (horizontal ? 1 : -1);
           const [lx, ly] = map({ c: c0 + cw / 2, v: stacked ? (a + b) / 2 : end + outward * 4 });
@@ -727,11 +768,11 @@ function layoutChart(spec, options) {
             role: "data-label",
             x: lx,
             y: ly,
-            text: dataLabel(v),
+            text: text2,
             anchor: horizontal && !stacked ? outward > 0 ? "start" : "end" : "middle",
             baseline: horizontal || stacked ? "middle" : outward < 0 ? "bottom" : "top",
             size: fs - 1,
-            fill: stacked ? "#ffffff" : theme.text,
+            fill: stacked ? contrastingTextColor(color) : theme.text,
             target
           });
         }
@@ -1015,6 +1056,20 @@ function chartToSvg(spec, options) {
 }
 
 // src/chart/controller.ts
+function sameChartJson(a, b) {
+  if (a === b) return true;
+  if (typeof a !== "object" || typeof b !== "object" || a === null || b === null) return Number.isNaN(a) && Number.isNaN(b);
+  if (Array.isArray(a) !== Array.isArray(b)) return false;
+  if (Array.isArray(a)) {
+    const bb = b;
+    return a.length === bb.length && a.every((v, i) => sameChartJson(v, bb[i]));
+  }
+  const ao = a;
+  const bo = b;
+  const keys = Object.keys(ao).filter((k) => ao[k] !== void 0);
+  if (keys.length !== Object.keys(bo).filter((k) => bo[k] !== void 0).length) return false;
+  return keys.every((k) => Object.prototype.hasOwnProperty.call(bo, k) && sameChartJson(ao[k], bo[k]));
+}
 var fail = (message, issues) => ({ ok: false, message, ...issues ? { issues } : {} });
 var ChartController = (_class = class {
   
@@ -1023,13 +1078,14 @@ var ChartController = (_class = class {
   __init2() {this.issues = []}
   __init3() {this.gestureKey = null}
   __init4() {this.gestureCount = 0}
-  __init5() {this.revision = 0}
-  __init6() {this.applying = false}
+  __init5() {this.gestureStart = null}
+  __init6() {this.revision = 0}
+  __init7() {this.applying = false}
   
-  __init7() {this.listeners = /* @__PURE__ */ new Set()}
+  __init8() {this.listeners = /* @__PURE__ */ new Set()}
   
   
-  constructor(options = {}) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);_class.prototype.__init7.call(this);_class.prototype.__init8.call(this);_class.prototype.__init9.call(this);
+  constructor(options = {}) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);_class.prototype.__init7.call(this);_class.prototype.__init8.call(this);_class.prototype.__init9.call(this);_class.prototype.__init10.call(this);
     this.history = _nullishCoalesce(options.history, () => ( new (0, _chunkQKLRAA4Tcjs.HistoryManager)()));
     this.onChange = options.onChange;
     const { spec, issues } = normalizeChartSpec(_nullishCoalesce(options.spec, () => ( {})));
@@ -1050,9 +1106,9 @@ var ChartController = (_class = class {
   // State
   // -------------------------------------------------------------------------
   /** The current snapshot (stable until the next change). */
-  __init8() {this.getState = () => this.state}
+  __init9() {this.getState = () => this.state}
   /** Calls `listener` after every change. Returns an unsubscribe function. */
-  __init9() {this.subscribe = (listener) => {
+  __init10() {this.subscribe = (listener) => {
     if (!this.unsubscribeHistory) this.connect();
     this.listeners.add(listener);
     return () => {
@@ -1130,7 +1186,14 @@ var ChartController = (_class = class {
   }
   commit(label, next, select) {
     const before = this.spec;
+    const hadIssues = this.issues.length > 0;
     this.issues = [];
+    if (sameChartJson(before, next)) {
+      const reselect = select !== void 0 && !sameChartSelection(this.selection, select) && !(select === null && this.selection === null);
+      if (reselect) this.selection = select;
+      if (reselect || hadIssues) this.notify(false);
+      return;
+    }
     const command = {
       name: label,
       tag: "chart",
@@ -1486,12 +1549,16 @@ var ChartController = (_class = class {
     this.history.endGesture();
     this.gestureKey = key;
     this.gestureCount++;
+    this.gestureStart = { spec: this.spec, mark: this.history.mark() };
     this.notify(false);
   }
   endGesture() {
     if (this.gestureKey === null) return;
     this.gestureKey = null;
     this.history.endGesture();
+    const start = this.gestureStart;
+    this.gestureStart = null;
+    if (start && sameChartJson(start.spec, this.spec)) this.history.revertTo(start.mark);
     this.notify(false);
   }
   // -------------------------------------------------------------------------
@@ -1857,7 +1924,9 @@ function startChartPointDrag(controller, scene, target, start, options = {}) {
   if (startAt === void 0) return null;
   controller.beginGesture(`drag:${seriesId}:${index}`);
   let ended = false;
+  const [min, max] = scene.valueScale.domain;
   return {
+    valueDomain: { min, max },
     move(point) {
       if (ended) return;
       const at = chartValueAtPoint(scene, point);
@@ -1980,5 +2049,6 @@ function describeChartSelection(controller, selection = controller.getState().se
 
 
 
-exports.CHART_CURVES = CHART_CURVES; exports.CHART_LEGEND_POSITIONS = CHART_LEGEND_POSITIONS; exports.CHART_NUMBER_STYLES = CHART_NUMBER_STYLES; exports.CHART_ORIENTATIONS = CHART_ORIENTATIONS; exports.CHART_SERIES_TYPES = CHART_SERIES_TYPES; exports.CHART_STACKINGS = CHART_STACKINGS; exports.CHART_TYPES = CHART_TYPES; exports.CHART_TYPE_LABELS = CHART_TYPE_LABELS; exports.CSS_VARIABLE_CHART_THEME = CSS_VARIABLE_CHART_THEME; exports.ChartController = ChartController; exports.DEFAULT_CHART_PALETTE = DEFAULT_CHART_PALETTE; exports.DEFAULT_CHART_THEME = DEFAULT_CHART_THEME; exports.canDragChartPoint = canDragChartPoint; exports.chartClientToScene = chartClientToScene; exports.chartColorInputValue = chartColorInputValue; exports.chartDataFromTable = chartDataFromTable; exports.chartDataToTable = chartDataToTable; exports.chartSceneToSvg = chartSceneToSvg; exports.chartSeriesColor = chartSeriesColor; exports.chartSeriesType = chartSeriesType; exports.chartSliceColor = chartSliceColor; exports.chartTextBaseline = chartTextBaseline; exports.chartTextTransform = chartTextTransform; exports.chartToSvg = chartToSvg; exports.chartValueAtPoint = chartValueAtPoint; exports.cloneChartSeries = cloneChartSeries; exports.cloneChartSpec = cloneChartSpec; exports.createChartCommands = createChartCommands; exports.createChartController = createChartController; exports.createChartSpec = createChartSpec; exports.defaultChartAxis = defaultChartAxis; exports.describeChartSelection = describeChartSelection; exports.estimateChartTextWidth = estimateChartTextWidth; exports.formatChartNumber = formatChartNumber; exports.handleChartKey = handleChartKey; exports.isCartesianChart = isCartesianChart; exports.layoutChart = layoutChart; exports.linearMap = linearMap; exports.niceScale = niceScale; exports.niceStep = niceStep; exports.normalizeChartAxis = normalizeChartAxis; exports.normalizeChartSpec = normalizeChartSpec; exports.normalizeChartValues = normalizeChartValues; exports.parseChartValue = parseChartValue; exports.sameChartSelection = sameChartSelection; exports.snapChartValue = snapChartValue; exports.startChartPointDrag = startChartPointDrag; exports.stepDecimals = stepDecimals; exports.uniqueChartSeriesId = uniqueChartSeriesId;
+
+exports.CHART_CURVES = CHART_CURVES; exports.CHART_LEGEND_POSITIONS = CHART_LEGEND_POSITIONS; exports.CHART_NUMBER_STYLES = CHART_NUMBER_STYLES; exports.CHART_ORIENTATIONS = CHART_ORIENTATIONS; exports.CHART_SERIES_TYPES = CHART_SERIES_TYPES; exports.CHART_STACKINGS = CHART_STACKINGS; exports.CHART_TYPES = CHART_TYPES; exports.CHART_TYPE_LABELS = CHART_TYPE_LABELS; exports.CSS_VARIABLE_CHART_THEME = CSS_VARIABLE_CHART_THEME; exports.ChartController = ChartController; exports.DEFAULT_CHART_PALETTE = DEFAULT_CHART_PALETTE; exports.DEFAULT_CHART_THEME = DEFAULT_CHART_THEME; exports.canDragChartPoint = canDragChartPoint; exports.chartClientToScene = chartClientToScene; exports.chartColorInputValue = chartColorInputValue; exports.chartDataFromTable = chartDataFromTable; exports.chartDataToTable = chartDataToTable; exports.chartSceneToSvg = chartSceneToSvg; exports.chartSeriesColor = chartSeriesColor; exports.chartSeriesType = chartSeriesType; exports.chartSliceColor = chartSliceColor; exports.chartTextBaseline = chartTextBaseline; exports.chartTextTransform = chartTextTransform; exports.chartToSvg = chartToSvg; exports.chartValueAtPoint = chartValueAtPoint; exports.cloneChartSeries = cloneChartSeries; exports.cloneChartSpec = cloneChartSpec; exports.contrastingTextColor = contrastingTextColor; exports.createChartCommands = createChartCommands; exports.createChartController = createChartController; exports.createChartSpec = createChartSpec; exports.defaultChartAxis = defaultChartAxis; exports.describeChartSelection = describeChartSelection; exports.estimateChartTextWidth = estimateChartTextWidth; exports.formatChartNumber = formatChartNumber; exports.handleChartKey = handleChartKey; exports.isCartesianChart = isCartesianChart; exports.layoutChart = layoutChart; exports.linearMap = linearMap; exports.niceScale = niceScale; exports.niceStep = niceStep; exports.normalizeChartAxis = normalizeChartAxis; exports.normalizeChartSpec = normalizeChartSpec; exports.normalizeChartValues = normalizeChartValues; exports.parseChartValue = parseChartValue; exports.sameChartSelection = sameChartSelection; exports.snapChartValue = snapChartValue; exports.startChartPointDrag = startChartPointDrag; exports.stepDecimals = stepDecimals; exports.uniqueChartSeriesId = uniqueChartSeriesId;
 //# sourceMappingURL=index.cjs.map