@bicharts/chart-host 0.6.61 → 0.6.63

package/dist/{chunk-Q6AGV652.mjs → chunk-ZTTBWP3I.mjs}

@@ -475,6 +475,170 @@ var require_papaparse_min = __commonJS({
   }
 });
 
+// src/labelContrast.ts
+function parseRGBA(c2) {
+  if (typeof c2 !== "string") return null;
+  const s2 = c2.trim();
+  const m4 = s2.match(/^rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*(?:,\s*([\d.]+)\s*)?\)$/i);
+  if (m4) return [parseFloat(m4[1]), parseFloat(m4[2]), parseFloat(m4[3]), m4[4] !== void 0 ? parseFloat(m4[4]) : 1];
+  let h4 = s2.replace(/^#/, "");
+  if (h4.length === 3) h4 = h4.split("").map((ch) => ch + ch).join("");
+  if (h4.length === 6 && /^[0-9a-fA-F]{6}$/.test(h4)) {
+    return [parseInt(h4.slice(0, 2), 16), parseInt(h4.slice(2, 4), 16), parseInt(h4.slice(4, 6), 16), 1];
+  }
+  return null;
+}
+var DARK_TEXT = "#111111";
+var LIGHT_TEXT = "#ffffff";
+var MIN_CONTRAST = 3;
+var WHITE_TEXT_BG_LUM = 0.5;
+var PILL_MIN_ALPHA = 0.05;
+var PILL_OPAQUE_ALPHA = 0.85;
+var PAGE_MATCH_TOLERANCE = 2;
+function isPillBackdropAlpha(a3) {
+  return a3 >= PILL_MIN_ALPHA && a3 < PILL_OPAQUE_ALPHA;
+}
+var PILL_MIN_COVERAGE = 0.6;
+function pillBacksGlyph(overlapArea, glyphArea) {
+  if (!(glyphArea > 0) || !isFinite(overlapArea) || overlapArea <= 0) return false;
+  return overlapArea / glyphArea >= PILL_MIN_COVERAGE;
+}
+var BACKING_MAJORITY = 0.5;
+function backingHoldsGlyph(backedArea, glyphArea) {
+  if (!(glyphArea > 0) || !isFinite(backedArea) || backedArea <= 0) return false;
+  return backedArea / glyphArea >= BACKING_MAJORITY;
+}
+function cellSuppressesNormalize(cellClass) {
+  return typeof cellClass === "string" && /(^|\s)lch-deck-panel(\s|$)/.test(cellClass);
+}
+var NAMED = {
+  white: [255, 255, 255, 1],
+  black: [0, 0, 0, 1],
+  none: [0, 0, 0, 0],
+  transparent: [0, 0, 0, 0]
+};
+function toRGBA(c2) {
+  if (typeof c2 !== "string") return null;
+  const k3 = c2.trim().toLowerCase();
+  if (k3 in NAMED) return NAMED[k3];
+  return parseRGBA(c2);
+}
+function compositeOver(fg, bg) {
+  const a3 = Math.max(0, Math.min(1, fg[3]));
+  return [
+    Math.round(fg[0] * a3 + bg[0] * (1 - a3)),
+    Math.round(fg[1] * a3 + bg[1] * (1 - a3)),
+    Math.round(fg[2] * a3 + bg[2] * (1 - a3))
+  ];
+}
+function relativeLuminance(rgb) {
+  const lin = rgb.map((v) => {
+    const s2 = v / 255;
+    return s2 <= 0.03928 ? s2 / 12.92 : Math.pow((s2 + 0.055) / 1.055, 2.4);
+  });
+  return 0.2126 * lin[0] + 0.7152 * lin[1] + 0.0722 * lin[2];
+}
+function contrastRatio(l1, l2) {
+  const hi = Math.max(l1, l2);
+  const lo = Math.min(l1, l2);
+  return (hi + 0.05) / (lo + 0.05);
+}
+function decideLabelColor(textColor, fill, fillOpacity, pageBg, minContrast = MIN_CONTRAST, normalize = false) {
+  const fillRGBA = toRGBA(fill);
+  if (!fillRGBA) return { fix: false, color: "", reason: "fill-unparsed" };
+  const pageRGBA = toRGBA(pageBg) || [255, 255, 255, 1];
+  const pageRGB = [pageRGBA[0], pageRGBA[1], pageRGBA[2]];
+  const effFill = [fillRGBA[0], fillRGBA[1], fillRGBA[2], fillRGBA[3] * clamp01(fillOpacity)];
+  const bgRGB = compositeOver(effFill, pageRGB);
+  const bgLum = relativeLuminance(bgRGB);
+  const bgIsPage = Math.abs(bgRGB[0] - pageRGB[0]) <= PAGE_MATCH_TOLERANCE && Math.abs(bgRGB[1] - pageRGB[1]) <= PAGE_MATCH_TOLERANCE && Math.abs(bgRGB[2] - pageRGB[2]) <= PAGE_MATCH_TOLERANCE;
+  const effNormalize = normalize && !bgIsPage;
+  const textRGBA = toRGBA(textColor);
+  if (!effNormalize && textRGBA) {
+    const txtRGB = compositeOver(textRGBA, bgRGB);
+    const cur = contrastRatio(relativeLuminance(txtRGB), bgLum);
+    if (cur >= minContrast) return { fix: false, color: "", reason: "ok" };
+  }
+  const darkC = contrastRatio(relativeLuminance(hexToRGB(DARK_TEXT)), bgLum);
+  const lightC = contrastRatio(relativeLuminance(hexToRGB(LIGHT_TEXT)), bgLum);
+  let useLight = bgLum <= WHITE_TEXT_BG_LUM;
+  if (useLight && lightC < minContrast && darkC >= minContrast) useLight = false;
+  if (!useLight && darkC < minContrast && lightC >= minContrast) useLight = true;
+  return useLight ? { fix: true, color: LIGHT_TEXT, reason: "fixed-light" } : { fix: true, color: DARK_TEXT, reason: "fixed-dark" };
+}
+var GLYPH_SAMPLE_N = 3;
+function glyphSampleGrid(box, n = GLYPH_SAMPLE_N) {
+  const out = [];
+  if (!box || !(box.width > 0) || !(box.height > 0) || !(n >= 1)) return out;
+  const k3 = Math.floor(n);
+  for (let i = 0; i < k3; i++) {
+    for (let j4 = 0; j4 < k3; j4++) {
+      out.push({
+        x: box.left + box.width * (i + 0.5) / k3,
+        y: box.top + box.height * (j4 + 0.5) / k3
+      });
+    }
+  }
+  return out;
+}
+var STRADDLE_COLS = 8;
+var STRADDLE_ROWS = 2;
+var STRADDLE_MIN_SHARE = 0.125;
+var STRADDLE_TARGET_CONTRAST = 4.5;
+var STRADDLE_PILL_ALPHA = 0.9;
+function straddleSampleGrid(box) {
+  const out = [];
+  if (!box || !(box.width > 0) || !(box.height > 0)) return out;
+  for (let i = 0; i < STRADDLE_COLS; i++) {
+    for (let j4 = 0; j4 < STRADDLE_ROWS; j4++) {
+      out.push({
+        x: box.left + box.width * (i + 0.5) / STRADDLE_COLS,
+        y: box.top + box.height * (j4 + 0.5) / STRADDLE_ROWS
+      });
+    }
+  }
+  return out;
+}
+function backgroundGroups(bgs, tol = 8) {
+  const groups = [];
+  for (const b4 of bgs || []) {
+    const g5 = groups.find((x3) => Math.abs(x3.rgb[0] - b4[0]) <= tol && Math.abs(x3.rgb[1] - b4[1]) <= tol && Math.abs(x3.rgb[2] - b4[2]) <= tol);
+    if (g5) g5.n++;
+    else groups.push({ rgb: [b4[0], b4[1], b4[2]], n: 1 });
+  }
+  return groups.sort((a3, b4) => b4.n - a3.n);
+}
+function straddles(bgs) {
+  if (!bgs || bgs.length < 2) return false;
+  const g5 = backgroundGroups(bgs);
+  return g5.length >= 2 && g5[1].n / bgs.length >= STRADDLE_MIN_SHARE;
+}
+function minContrastOver(textColor, bgs) {
+  const t = toRGBA(textColor);
+  if (!t || !bgs || !bgs.length) return 0;
+  let worst = Infinity;
+  for (const b4 of bgs) {
+    const tx = compositeOver(t, b4);
+    worst = Math.min(worst, contrastRatio(relativeLuminance(tx), relativeLuminance(b4)));
+  }
+  return worst;
+}
+function pickColorOver(textColor, bgs, target = STRADDLE_TARGET_CONTRAST) {
+  const cur = minContrastOver(textColor, bgs);
+  if (cur >= target) return { color: String(textColor), contrast: cur, keep: true };
+  const d2 = minContrastOver(DARK_TEXT, bgs), l2 = minContrastOver(LIGHT_TEXT, bgs);
+  const best = d2 >= l2 ? { color: DARK_TEXT, contrast: d2 } : { color: LIGHT_TEXT, contrast: l2 };
+  return best.contrast > cur ? { ...best, keep: false } : { color: String(textColor), contrast: cur, keep: true };
+}
+function clamp01(v) {
+  if (typeof v !== "number" || !isFinite(v)) return 1;
+  return Math.max(0, Math.min(1, v));
+}
+function hexToRGB(hex2) {
+  const p4 = toRGBA(hex2);
+  return [p4[0], p4[1], p4[2]];
+}
+
 // src/deltaE.ts
 function linearise(c2) {
   const v = c2 / 255;
@@ -776,6 +940,12 @@ function resolveAutoColorScale(p4) {
 }
 
 // src/defaults.ts
+function themedLand(p4) {
+  const bg = p4.geoLandColor ? null : toRGBA(p4.backgroundColor);
+  if (!bg || bg[3] < 1 || relativeLuminance([bg[0], bg[1], bg[2]]) > 0.2) return void 0;
+  const fg = toRGBA(p4.themeFg) ?? [255, 255, 255, 1];
+  return "#" + compositeOver([fg[0], fg[1], fg[2], 0.18], [bg[0], bg[1], bg[2]]).map((v) => v.toString(16).padStart(2, "0")).join("");
+}
 var clamp = (n, lo, hi) => Math.max(lo, Math.min(hi, n));
 var numberOr = (raw, dflt) => {
   const n = raw == null || raw === "" ? NaN : Number(raw);
@@ -846,7 +1016,7 @@ function resolveOptions(p4) {
     // Map fills: `raw || undefined` like the colour-scale endpoints. The no-data ->
     // land cascade is left to the chart (so the fallback chain is visible in the
     // generated code); HC substitution has already happened in the caller.
-    geoLandColor: p4.geoLandColor || void 0,
+    geoLandColor: p4.geoLandColor || themedLand(p4) || void 0,
     geoNoDataColor: p4.geoNoDataColor || void 0,
     aggregation: (p4.aggregation == null ? "" : String(p4.aggregation)) || void 0,
     // A recognised value wins, anything else falls to the default: an unknown string must
@@ -3343,170 +3513,6 @@ function fitRenderedChart(container, opts = {}) {
   return result;
 }
 
-// src/labelContrast.ts
-function parseRGBA(c2) {
-  if (typeof c2 !== "string") return null;
-  const s2 = c2.trim();
-  const m4 = s2.match(/^rgba?\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*(?:,\s*([\d.]+)\s*)?\)$/i);
-  if (m4) return [parseFloat(m4[1]), parseFloat(m4[2]), parseFloat(m4[3]), m4[4] !== void 0 ? parseFloat(m4[4]) : 1];
-  let h4 = s2.replace(/^#/, "");
-  if (h4.length === 3) h4 = h4.split("").map((ch) => ch + ch).join("");
-  if (h4.length === 6 && /^[0-9a-fA-F]{6}$/.test(h4)) {
-    return [parseInt(h4.slice(0, 2), 16), parseInt(h4.slice(2, 4), 16), parseInt(h4.slice(4, 6), 16), 1];
-  }
-  return null;
-}
-var DARK_TEXT = "#111111";
-var LIGHT_TEXT = "#ffffff";
-var MIN_CONTRAST = 3;
-var WHITE_TEXT_BG_LUM = 0.5;
-var PILL_MIN_ALPHA = 0.05;
-var PILL_OPAQUE_ALPHA = 0.85;
-var PAGE_MATCH_TOLERANCE = 2;
-function isPillBackdropAlpha(a3) {
-  return a3 >= PILL_MIN_ALPHA && a3 < PILL_OPAQUE_ALPHA;
-}
-var PILL_MIN_COVERAGE = 0.6;
-function pillBacksGlyph(overlapArea, glyphArea) {
-  if (!(glyphArea > 0) || !isFinite(overlapArea) || overlapArea <= 0) return false;
-  return overlapArea / glyphArea >= PILL_MIN_COVERAGE;
-}
-var BACKING_MAJORITY = 0.5;
-function backingHoldsGlyph(backedArea, glyphArea) {
-  if (!(glyphArea > 0) || !isFinite(backedArea) || backedArea <= 0) return false;
-  return backedArea / glyphArea >= BACKING_MAJORITY;
-}
-function cellSuppressesNormalize(cellClass) {
-  return typeof cellClass === "string" && /(^|\s)lch-deck-panel(\s|$)/.test(cellClass);
-}
-var NAMED = {
-  white: [255, 255, 255, 1],
-  black: [0, 0, 0, 1],
-  none: [0, 0, 0, 0],
-  transparent: [0, 0, 0, 0]
-};
-function toRGBA(c2) {
-  if (typeof c2 !== "string") return null;
-  const k3 = c2.trim().toLowerCase();
-  if (k3 in NAMED) return NAMED[k3];
-  return parseRGBA(c2);
-}
-function compositeOver(fg, bg) {
-  const a3 = Math.max(0, Math.min(1, fg[3]));
-  return [
-    Math.round(fg[0] * a3 + bg[0] * (1 - a3)),
-    Math.round(fg[1] * a3 + bg[1] * (1 - a3)),
-    Math.round(fg[2] * a3 + bg[2] * (1 - a3))
-  ];
-}
-function relativeLuminance(rgb) {
-  const lin = rgb.map((v) => {
-    const s2 = v / 255;
-    return s2 <= 0.03928 ? s2 / 12.92 : Math.pow((s2 + 0.055) / 1.055, 2.4);
-  });
-  return 0.2126 * lin[0] + 0.7152 * lin[1] + 0.0722 * lin[2];
-}
-function contrastRatio(l1, l2) {
-  const hi = Math.max(l1, l2);
-  const lo = Math.min(l1, l2);
-  return (hi + 0.05) / (lo + 0.05);
-}
-function decideLabelColor(textColor, fill, fillOpacity, pageBg, minContrast = MIN_CONTRAST, normalize = false) {
-  const fillRGBA = toRGBA(fill);
-  if (!fillRGBA) return { fix: false, color: "", reason: "fill-unparsed" };
-  const pageRGBA = toRGBA(pageBg) || [255, 255, 255, 1];
-  const pageRGB = [pageRGBA[0], pageRGBA[1], pageRGBA[2]];
-  const effFill = [fillRGBA[0], fillRGBA[1], fillRGBA[2], fillRGBA[3] * clamp01(fillOpacity)];
-  const bgRGB = compositeOver(effFill, pageRGB);
-  const bgLum = relativeLuminance(bgRGB);
-  const bgIsPage = Math.abs(bgRGB[0] - pageRGB[0]) <= PAGE_MATCH_TOLERANCE && Math.abs(bgRGB[1] - pageRGB[1]) <= PAGE_MATCH_TOLERANCE && Math.abs(bgRGB[2] - pageRGB[2]) <= PAGE_MATCH_TOLERANCE;
-  const effNormalize = normalize && !bgIsPage;
-  const textRGBA = toRGBA(textColor);
-  if (!effNormalize && textRGBA) {
-    const txtRGB = compositeOver(textRGBA, bgRGB);
-    const cur = contrastRatio(relativeLuminance(txtRGB), bgLum);
-    if (cur >= minContrast) return { fix: false, color: "", reason: "ok" };
-  }
-  const darkC = contrastRatio(relativeLuminance(hexToRGB(DARK_TEXT)), bgLum);
-  const lightC = contrastRatio(relativeLuminance(hexToRGB(LIGHT_TEXT)), bgLum);
-  let useLight = bgLum <= WHITE_TEXT_BG_LUM;
-  if (useLight && lightC < minContrast && darkC >= minContrast) useLight = false;
-  if (!useLight && darkC < minContrast && lightC >= minContrast) useLight = true;
-  return useLight ? { fix: true, color: LIGHT_TEXT, reason: "fixed-light" } : { fix: true, color: DARK_TEXT, reason: "fixed-dark" };
-}
-var GLYPH_SAMPLE_N = 3;
-function glyphSampleGrid(box, n = GLYPH_SAMPLE_N) {
-  const out = [];
-  if (!box || !(box.width > 0) || !(box.height > 0) || !(n >= 1)) return out;
-  const k3 = Math.floor(n);
-  for (let i = 0; i < k3; i++) {
-    for (let j4 = 0; j4 < k3; j4++) {
-      out.push({
-        x: box.left + box.width * (i + 0.5) / k3,
-        y: box.top + box.height * (j4 + 0.5) / k3
-      });
-    }
-  }
-  return out;
-}
-var STRADDLE_COLS = 8;
-var STRADDLE_ROWS = 2;
-var STRADDLE_MIN_SHARE = 0.125;
-var STRADDLE_TARGET_CONTRAST = 4.5;
-var STRADDLE_PILL_ALPHA = 0.9;
-function straddleSampleGrid(box) {
-  const out = [];
-  if (!box || !(box.width > 0) || !(box.height > 0)) return out;
-  for (let i = 0; i < STRADDLE_COLS; i++) {
-    for (let j4 = 0; j4 < STRADDLE_ROWS; j4++) {
-      out.push({
-        x: box.left + box.width * (i + 0.5) / STRADDLE_COLS,
-        y: box.top + box.height * (j4 + 0.5) / STRADDLE_ROWS
-      });
-    }
-  }
-  return out;
-}
-function backgroundGroups(bgs, tol = 8) {
-  const groups = [];
-  for (const b4 of bgs || []) {
-    const g5 = groups.find((x3) => Math.abs(x3.rgb[0] - b4[0]) <= tol && Math.abs(x3.rgb[1] - b4[1]) <= tol && Math.abs(x3.rgb[2] - b4[2]) <= tol);
-    if (g5) g5.n++;
-    else groups.push({ rgb: [b4[0], b4[1], b4[2]], n: 1 });
-  }
-  return groups.sort((a3, b4) => b4.n - a3.n);
-}
-function straddles(bgs) {
-  if (!bgs || bgs.length < 2) return false;
-  const g5 = backgroundGroups(bgs);
-  return g5.length >= 2 && g5[1].n / bgs.length >= STRADDLE_MIN_SHARE;
-}
-function minContrastOver(textColor, bgs) {
-  const t = toRGBA(textColor);
-  if (!t || !bgs || !bgs.length) return 0;
-  let worst = Infinity;
-  for (const b4 of bgs) {
-    const tx = compositeOver(t, b4);
-    worst = Math.min(worst, contrastRatio(relativeLuminance(tx), relativeLuminance(b4)));
-  }
-  return worst;
-}
-function pickColorOver(textColor, bgs, target = STRADDLE_TARGET_CONTRAST) {
-  const cur = minContrastOver(textColor, bgs);
-  if (cur >= target) return { color: String(textColor), contrast: cur, keep: true };
-  const d2 = minContrastOver(DARK_TEXT, bgs), l2 = minContrastOver(LIGHT_TEXT, bgs);
-  const best = d2 >= l2 ? { color: DARK_TEXT, contrast: d2 } : { color: LIGHT_TEXT, contrast: l2 };
-  return best.contrast > cur ? { ...best, keep: false } : { color: String(textColor), contrast: cur, keep: true };
-}
-function clamp01(v) {
-  if (typeof v !== "number" || !isFinite(v)) return 1;
-  return Math.max(0, Math.min(1, v));
-}
-function hexToRGB(hex2) {
-  const p4 = toRGBA(hex2);
-  return [p4[0], p4[1], p4[2]];
-}
-
 // src/labelContrastDom.ts
 var LABEL_CONTRAST_DONE_ATTR = "data-lch-contrast";
 var LABEL_CONTRAST_CAP = 2e3;
@@ -3830,6 +3836,47 @@ function applyLabelContrast(container, opts = {}) {
   }
 }
 
+// src/idScope.ts
+var seq = 0;
+function newIdScope() {
+  seq += 1;
+  return "h" + seq;
+}
+var URL_REF = /url\(\s*(['"]?)#([^'")\s]+)\1\s*\)/g;
+function scopeChartIds(c2, scope) {
+  const r2 = { renamed: 0, collisions: [] };
+  try {
+    const tag = "--" + scope, doc = c2.ownerDocument, map = /* @__PURE__ */ new Map();
+    const refs = [], used = /* @__PURE__ */ new Set();
+    c2.querySelectorAll("*").forEach((el) => {
+      for (const a3 of el.getAttributeNames()) {
+        const v = el.getAttribute(a3);
+        const href = (a3 === "href" || a3 === "xlink:href") && v[0] === "#";
+        if (!href && v.indexOf("url(") < 0) continue;
+        refs.push([el, a3, v]);
+        if (href) used.add(v.slice(1));
+        for (const m4 of v.matchAll(URL_REF)) used.add(m4[2]);
+      }
+    });
+    c2.querySelectorAll("[id]").forEach((el) => {
+      const id = el.id;
+      if (!used.has(id) || id.endsWith(tag)) return;
+      const q2 = id.replace(/["\\]/g, "\\$&");
+      if (doc && Array.from(doc.querySelectorAll(`[id="${q2}"],[id^="${q2}--h"]`)).some((o4) => !c2.contains(o4))) {
+        r2.collisions.push(id);
+      }
+      map.set(id, el.id = id + tag);
+      r2.renamed++;
+    });
+    for (const [el, a3, v] of refs) {
+      const nv = v[0] === "#" && map.has(v.slice(1)) ? "#" + map.get(v.slice(1)) : v.replace(URL_REF, (m4, q2, id) => map.has(id) ? `url(${q2}#${map.get(id)}${q2})` : m4);
+      if (nv !== v) el.setAttribute(a3, nv);
+    }
+  } catch {
+  }
+  return r2;
+}
+
 // src/invalidSentinel.ts
 function isInvalidSentinelError(text2) {
   if (!text2) return false;
@@ -4136,6 +4183,8 @@ function createChartHost(container, config) {
   let destroyed = false;
   let warnedGeo = false;
   let warnedBlank = false;
+  let warnedIds = false;
+  const idScope = newIdScope();
   let renderSeq = 0;
   const annotationLayer = createAnnotationLayer(container, (a3) => config.onAnnotationClick?.(a3));
   const drawAnnotations = () => annotationLayer.draw(
@@ -4307,6 +4356,20 @@ function createChartHost(container, config) {
     }
   };
   const runPostRenderPasses = () => {
+    try {
+      const r2 = scopeChartIds(container, idScope);
+      if (r2.collisions.length && !warnedIds) {
+        warnedIds = true;
+        try {
+          (win?.console ?? console)?.warn(
+            `[@bicharts/chart-host] ids shared with another chart, scoped: ${r2.collisions.slice(0, 5).join(", ")}`
+          );
+        } catch {
+        }
+      }
+      config.onIdScope?.(r2);
+    } catch {
+    }
     if (labelContrastOpts !== false) {
       try {
         const lc = labelContrastOpts === true ? {} : { ...labelContrastOpts };
@@ -4386,7 +4449,7 @@ function createChartHost(container, config) {
   const host = {
     render() {
       if (destroyed) return;
-      const seq = ++renderSeq;
+      const seq2 = ++renderSeq;
       stopAnim();
       container.innerHTML = "";
       if (!renderFn) {
@@ -4439,7 +4502,7 @@ function createChartHost(container, config) {
         };
         Promise.resolve(outcome).then(
           () => done(() => {
-            if (destroyed || seq !== renderSeq) {
+            if (destroyed || seq2 !== renderSeq) {
               resolve();
               return;
             }
@@ -4447,7 +4510,7 @@ function createChartHost(container, config) {
             resolve();
           }),
           (err) => done(() => {
-            if (destroyed || seq !== renderSeq) {
+            if (destroyed || seq2 !== renderSeq) {
               resolve();
               return;
             }
@@ -4669,6 +4732,35 @@ function createChartGroup(columns, rows, opts = {}) {
 }
 
 export {
+  DARK_TEXT,
+  LIGHT_TEXT,
+  MIN_CONTRAST,
+  WHITE_TEXT_BG_LUM,
+  PILL_MIN_ALPHA,
+  PILL_OPAQUE_ALPHA,
+  PAGE_MATCH_TOLERANCE,
+  isPillBackdropAlpha,
+  PILL_MIN_COVERAGE,
+  pillBacksGlyph,
+  BACKING_MAJORITY,
+  backingHoldsGlyph,
+  cellSuppressesNormalize,
+  toRGBA,
+  compositeOver,
+  relativeLuminance,
+  contrastRatio,
+  decideLabelColor,
+  GLYPH_SAMPLE_N,
+  glyphSampleGrid,
+  STRADDLE_COLS,
+  STRADDLE_ROWS,
+  STRADDLE_MIN_SHARE,
+  STRADDLE_TARGET_CONTRAST,
+  STRADDLE_PILL_ALPHA,
+  straddleSampleGrid,
+  straddles,
+  minContrastOver,
+  pickColorOver,
   deltaEHex,
   SAME_SHADE_DELTA_E,
   MIN_RAMP_FILLS,
@@ -4740,39 +4832,12 @@ export {
   unpinScrolledAxis,
   pinScrolledAxis,
   fitRenderedChart,
-  DARK_TEXT,
-  LIGHT_TEXT,
-  MIN_CONTRAST,
-  WHITE_TEXT_BG_LUM,
-  PILL_MIN_ALPHA,
-  PILL_OPAQUE_ALPHA,
-  PAGE_MATCH_TOLERANCE,
-  isPillBackdropAlpha,
-  PILL_MIN_COVERAGE,
-  pillBacksGlyph,
-  BACKING_MAJORITY,
-  backingHoldsGlyph,
-  cellSuppressesNormalize,
-  toRGBA,
-  compositeOver,
-  relativeLuminance,
-  contrastRatio,
-  decideLabelColor,
-  GLYPH_SAMPLE_N,
-  glyphSampleGrid,
-  STRADDLE_COLS,
-  STRADDLE_ROWS,
-  STRADDLE_MIN_SHARE,
-  STRADDLE_TARGET_CONTRAST,
-  STRADDLE_PILL_ALPHA,
-  straddleSampleGrid,
-  straddles,
-  minContrastOver,
-  pickColorOver,
   LABEL_CONTRAST_DONE_ATTR,
   LABEL_CONTRAST_CAP,
   LABEL_PILL_CLASS,
   applyLabelContrast,
+  newIdScope,
+  scopeChartIds,
   isInvalidSentinelError,
   invalidSentinelReason,
   ANNOTATION_LAYER_CLASS,

package/dist/index.mjs

@@ -91,6 +91,7 @@ import {
   measureContainerBoxes,
   minContrastOver,
   needsScroll,
+  newIdScope,
   nextSelection,
   noopViewStateProvider,
   o,
@@ -108,6 +109,7 @@ import {
   resolveAutoColorScale,
   resolveOptions,
   rowIdxsFromMark,
+  scopeChartIds,
   scrollFitFor,
   sessionViewStateProvider,
   straddleSampleGrid,
@@ -120,7 +122,7 @@ import {
   toSourceRows,
   unpinScrolledAxis,
   valuePlacementFlag
-} from "./chunk-Q6AGV652.mjs";
+} from "./chunk-ZTTBWP3I.mjs";
 import "./chunk-A2GMXZP7.mjs";
 import {
   ACTIVE_TICK_CLASS,
@@ -3008,6 +3010,7 @@ export {
   minContrastOver,
   mountProductFeedbackBox,
   needsScroll,
+  newIdScope,
   newQualifyGroupState,
   newQualifyRefusalGroupState,
   nextSelection,
@@ -3058,6 +3061,7 @@ export {
   resolveOptions,
   rowIdxsFromMark,
   sameMarker,
+  scopeChartIds,
   scrollFitFor,
   servedCorrelationProves,
   sessionViewStateProvider,

package/dist/react.mjs

@@ -22,7 +22,7 @@ import {
   loadGeo,
   syncMemberSelection,
   toSourceRows
-} from "./chunk-Q6AGV652.mjs";
+} from "./chunk-ZTTBWP3I.mjs";
 import "./chunk-A2GMXZP7.mjs";
 import "./chunk-WNGJUPEI.mjs";
 import "./chunk-GHODWOAL.mjs";

package/dist/types/host.d.ts

@@ -6,6 +6,7 @@ import { type ColourSpreadCensus } from "./colourSpread";
 import { type ValuePlacementCensus } from "./valuePlacement";
 import { type FitRenderedChartOptions, type FitRenderedChartResult } from "./fitDom";
 import { type LabelContrastOptions, type LabelContrastReport } from "./labelContrastDom";
+import { type IdScopeReport } from "./idScope";
 import { type MarkAnnotation, type AnnotationReport } from "./annotations";
 export type RenderFn = (container: HTMLElement, data: any, options: RenderOptions) => void;
 /**
@@ -166,6 +167,11 @@ export interface ChartHostConfig {
     labelContrast?: boolean | LabelContrastOptions;
     /** What the label-contrast pass did after each render - counts, so a host can log them. */
     onLabelContrast?: (report: LabelContrastReport) => void;
+    /**
+     * What the id-scoping pass did after each render: how many of the chart's ids got this host's suffix, and which
+     * of them also existed elsewhere in the page (a clash it prevented - two same-size charts naming one clip path).
+     */
+    onIdScope?: (report: IdScopeReport) => void;
     /**
      * THE CHART SAID THE DATA LACKS SOMETHING IT IS BUILT ON. Generated code has one sanctioned
      * hard stop at runtime: a column the chart needs is gone from `data.columns`, and it throws

package/dist/types/idScope.d.ts

@@ -0,0 +1,9 @@
+/** A fresh suffix for one chart host. Unique within the page for the page's lifetime. */
+export declare function newIdScope(): string;
+export interface IdScopeReport {
+    /** How many ids were given the suffix. */
+    renamed: number;
+    /** Ids that also existed outside this chart when the pass ran - each one a clash this pass prevented. */
+    collisions: string[];
+}
+export declare function scopeChartIds(c: Element, scope: string): IdScopeReport;

package/dist/types/index.d.ts

@@ -27,6 +27,7 @@ export { formatSourceDate, formatSourceDateFor, isExcelDateFormat, type SourceFo
 export { composeSummaryText } from "./summaryText";
 export { ensureCrossfilterHitTargets, type HitTargetReport } from "./hitTargets";
 export { applyLabelContrast, LABEL_CONTRAST_DONE_ATTR, LABEL_CONTRAST_CAP, LABEL_PILL_CLASS, type LabelContrastOptions, type LabelContrastReport, } from "./labelContrastDom";
+export { scopeChartIds, newIdScope, type IdScopeReport } from "./idScope";
 export { decideLabelColor, toRGBA, compositeOver, relativeLuminance, contrastRatio, isPillBackdropAlpha, pillBacksGlyph, backingHoldsGlyph, cellSuppressesNormalize, glyphSampleGrid, DARK_TEXT, LIGHT_TEXT, MIN_CONTRAST, WHITE_TEXT_BG_LUM, PILL_MIN_ALPHA, PILL_OPAQUE_ALPHA, PILL_MIN_COVERAGE, PAGE_MATCH_TOLERANCE, BACKING_MAJORITY, GLYPH_SAMPLE_N, straddles, straddleSampleGrid, minContrastOver, pickColorOver, STRADDLE_COLS, STRADDLE_ROWS, STRADDLE_MIN_SHARE, STRADDLE_TARGET_CONTRAST, STRADDLE_PILL_ALPHA, type LabelDecision, } from "./labelContrast";
 export { censusMarks, isBlankRender, blankRenderFlag, type MarkCensus, type BlankVerdictInput } from "./blankRender";
 export { isInvalidSentinelError, invalidSentinelReason } from "./invalidSentinel";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bicharts/chart-host",
-  "version": "0.6.61",
+  "version": "0.6.63",
   "description": "Run a BIC-generated D3 chart in any web host: compiles the generated render() function, applies the shared option defaults, resolves mark clicks (through tooltip overlays), owns the selection affordance, and translates row indices between cross-filtered charts. The same contract the BIC Power BI visual implements, minus Power BI. React bindings at @bicharts/chart-host/react.",
   "license": "Apache-2.0",
   "type": "module",