@bicharts/chart-host 0.6.107 → 0.6.109

package/dist/{chunk-BWR35DEK.mjs → chunk-JQ7FFCOE.mjs}

@@ -4,11 +4,11 @@ import {
   claimParkedLasso,
   installLasso,
   lassoEffect
-} from "./chunk-IE426WU6.mjs";
+} from "./chunk-4DOKJ3R3.mjs";
 import {
   censusHitBands,
   ensureCrossfilterHitTargets
-} from "./chunk-CPLWAW3Z.mjs";
+} from "./chunk-GQLEU3VC.mjs";
 import {
   clearPress,
   clearSelectionGlyphs,
@@ -25,14 +25,14 @@ import {
   selectionRuleOf,
   trackPress,
   validRowSet
-} from "./chunk-P2DLK7WZ.mjs";
+} from "./chunk-3ER4C7TG.mjs";
 import {
   clipWindowOf,
   fitRenderedChart,
   rememberScroll,
   takeScroll,
   unpinScrolledAxis
-} from "./chunk-IE7TM6DX.mjs";
+} from "./chunk-TN5JRULV.mjs";
 import {
   geoFromCache
 } from "./chunk-5WTQN5DL.mjs";
@@ -43,7 +43,7 @@ import {
   Rr,
   Yn,
   tt
-} from "./chunk-SYUJ4TPX.mjs";
+} from "./chunk-TH577JHI.mjs";
 import {
   ACTIVE_TICK_CLASS,
   ANIM_LOOP_DELAY_DEFAULT,
@@ -61,6 +61,7 @@ import {
   COLOR_SCALE_SELF_CLAMP_PCT_MIN,
   CONTAINER_SLOT_ANIM_STOP,
   CONTAINER_SLOT_CLICKED_MARKS,
+  CONTAINER_SLOT_HOST_SELECTION,
   CONTAINER_SLOT_INITIAL_XF_MARK,
   CONTAINER_SLOT_UI_STATE,
   CONTAINER_SLOT_XF_CLEAR,
@@ -74,6 +75,7 @@ import {
   HOST_CONTRACT_VERSION,
   LEGEND_MARK_CLASS,
   LIFT_SELECTED_CLASS,
+  MARKS_INERT_CLASS,
   MARK_CLASS,
   MARK_SELECTED_CLASS,
   MAX_MAP_POINTS_DEFAULT,
@@ -86,7 +88,7 @@ import {
   XFILTER_REFRESH_EVENT,
   chartOwnsTimeline,
   periodTickSuppressesFeedback
-} from "./chunk-7XRQUFVH.mjs";
+} from "./chunk-USZSHKIB.mjs";
 
 // src/labelContrast.ts
 function parseRGBA(c) {
@@ -1057,6 +1059,18 @@ function themedLand(p) {
   const fg = toRGBA(p.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("");
 }
+function cleanHostSelection(v) {
+  if (!v || typeof v !== "object" || !Array.isArray(v.rows)) return void 0;
+  const raw = v.rows;
+  const rows = Array.from(new Set(raw.filter((n2) => typeof n2 === "number" && Number.isInteger(n2) && n2 >= 0))).sort((a, b) => a - b);
+  const h = Number(v.hidden);
+  const out = { rows, hidden: Number.isFinite(h) && h > 0 ? Math.floor(h) : 0 };
+  const n = v.narrowed;
+  if (n && typeof n === "object" && Number.isInteger(n.published) && Number.isInteger(n.kept) && n.kept >= 0 && n.kept < n.published) {
+    out.narrowed = { published: n.published, kept: n.kept };
+  }
+  return out;
+}
 var clamp = (n, lo, hi) => Math.max(lo, Math.min(hi, n));
 var numberOr = (raw, dflt) => {
   const n = raw == null || raw === "" ? NaN : Number(raw);
@@ -1089,6 +1103,8 @@ function resolveOptions(p) {
     dataComplete: p.dataComplete,
     rowsWithheld: p.rowsWithheld,
     rowsFilteredOut: p.rowsFilteredOut,
+    // A host FACT about its selection (contract 1.21.0), cleaned, never invented: absent stays absent.
+    hostSelection: cleanHostSelection(p.hostSelection),
     // Host services (contract 1.18.0): a FUNCTION or nothing, so a junk value never reaches a chart as something
     // it would try to call. Passed through untouched otherwise: the host owns what opening or copying means.
     openUrl: typeof p.openUrl === "function" ? p.openUrl : void 0,
@@ -1144,6 +1160,8 @@ function resolveOptions(p) {
     })(),
     // A host FACT from the generate answer, true only for a literal true: silence never suppresses anything.
     suppressSelectionGlyph: p.suppressSelectionGlyph === true ? true : void 0,
+    // A host FACT (1.22.0): the chart works from the keyboard. True only for a literal true, like the one above.
+    keyboardMarks: p.keyboardMarks === true ? true : void 0,
     onSelect: p.onSelect,
     // Control gestures (1.10.0). Passed straight through like onSelect: the host owns what a gesture MEANS,
     // and a host that supplies nothing leaves every control behaving exactly as before.
@@ -2307,7 +2325,7 @@ var DOT = 8;
 var RING = 1.5;
 var DOT_HALF = DOT / 2 + RING;
 var DOT_IN = 8;
-function createAnnotationLayer(container, onClick) {
+function createAnnotationLayer(container, onClick, opts) {
   let list = [];
   let report = { shown: 0, notShown: 0 };
   let last = null;
@@ -2431,7 +2449,7 @@ function createAnnotationLayer(container, onClick) {
       const after = own.filter((t) => t.b.l >= run.r && t.b.b > run.t && t.b.t < run.b).map((t) => t.b.l);
       return { r: Math.min(run.r, seen), y: (run.t + run.b) / 2, next: after.length ? Math.min(...after) : v.r };
     };
-    const clear = (v, len, mark) => {
+    const clear = (v, len, mark, whole = v) => {
       const hw = Math.max(16, len * 6 + 8) / 2, hh = 8, g = 2;
       const cx = (v.l + v.r) / 2, cy = (v.t + v.b) / 2;
       const at = (x, y) => ({ l: x - hw, t: y - hh, r: x + hw, b: y + hh });
@@ -2444,6 +2462,7 @@ function createAnnotationLayer(container, onClick) {
       const tries = [];
       const add = (x, y, px = x, py = y) => tries.push({ x: clampX(x, hw), y: clampY(y, hh), px, py });
       const label = rowLabel(v, mark);
+      if (!label && whole !== v && rowLabel(whole, mark)) return null;
       if (label) {
         const x = label.r + g + hw;
         if (x + hw <= label.next - g || label.next >= v.r) add(x, label.y, Math.min(x, v.r - 1), label.y);
@@ -2508,7 +2527,7 @@ function createAnnotationLayer(container, onClick) {
         }
       }
       const dot = wantsDot(bestMark ?? hits2.values().next().value ?? null);
-      const pt = !best ? null : dot ? dotSpot(best, bestWhole) : clear(best, (a.label ?? "\u2022").length, bestMark);
+      const pt = !best ? null : dot ? dotSpot(best, bestWhole) : clear(best, (a.label ?? "\u2022").length, bestMark, bestWhole ?? best);
       if (laidOut && !pt) continue;
       shown++;
       const badge = doc.createElement("div");
@@ -2549,6 +2568,15 @@ function createAnnotationLayer(container, onClick) {
         e.stopPropagation();
         onClick?.(a);
       });
+      if (opts?.keyboard?.()) {
+        badge.setAttribute("tabindex", "0");
+        badge.addEventListener("keydown", (e) => {
+          if (e.key !== "Enter" && e.key !== " " && e.key !== "Spacebar") return;
+          e.preventDefault();
+          e.stopPropagation();
+          onClick?.(a);
+        });
+      }
       layer.appendChild(badge);
     }
     report = { shown, notShown: list.length - shown };
@@ -2575,6 +2603,222 @@ function createAnnotationLayer(container, onClick) {
   };
 }
 
+// src/focusKeep.ts
+function signatureOf(el) {
+  const a = (n) => el.getAttribute(n) ?? "";
+  const cls = Array.from(el.classList ?? []).filter((c) => !/^lch-|^bic-/.test(c)).sort().join(" ");
+  return [el.localName, a("type"), cls, a("name"), a("placeholder"), a("aria-label"), a("role")].join("|");
+}
+function alike(container, sig) {
+  const tag = sig.split("|", 1)[0];
+  if (!tag) return [];
+  return Array.from(container.querySelectorAll(tag)).filter((e) => signatureOf(e) === sig);
+}
+function rememberFocus(container) {
+  try {
+    const active = container.ownerDocument?.activeElement;
+    if (!active || active === container || !container.contains(active)) return null;
+    const sig = signatureOf(active);
+    const nth = alike(container, sig).indexOf(active);
+    const t = active;
+    let start = null, end = null, dir = null;
+    try {
+      if (typeof t.selectionStart === "number") {
+        start = t.selectionStart;
+        end = t.selectionEnd;
+        dir = t.selectionDirection ?? null;
+      }
+    } catch {
+    }
+    return { sig, nth: Math.max(0, nth), start, end, dir };
+  } catch {
+    return null;
+  }
+}
+function restoreFocus(container, memory) {
+  if (!memory) return false;
+  try {
+    const active = container.ownerDocument?.activeElement;
+    if (active && active !== container && container.contains(active)) return false;
+    const list = alike(container, memory.sig);
+    const el = list[memory.nth] ?? (list.length === 1 ? list[0] : null);
+    if (!el || typeof el.focus !== "function") return false;
+    el.focus({ preventScroll: true });
+    const t = el;
+    if (memory.start != null && typeof t.setSelectionRange === "function") {
+      const len = typeof t.value === "string" ? t.value.length : 0;
+      try {
+        t.setSelectionRange(Math.min(memory.start, len), Math.min(memory.end ?? memory.start, len), memory.dir ?? void 0);
+      } catch {
+      }
+    }
+    return container.ownerDocument?.activeElement === el;
+  } catch {
+    return false;
+  }
+}
+
+// src/keyboardMarks.ts
+var KEYBOARD_STAMP = "// bic:keyboard-marks";
+var STAMP_RE = /^[ \t]*\/\/[ \t]*bic:keyboard-marks\b/;
+var STAMP_HEAD_LINES = 12;
+function codeHasKeyboardStamp(code) {
+  if (typeof code !== "string" || !code) return false;
+  let start = 0;
+  for (let n = 0; n < STAMP_HEAD_LINES && start <= code.length; n++) {
+    const end = code.indexOf("\n", start);
+    const line = code.slice(start, end < 0 ? code.length : end);
+    if (STAMP_RE.test(line)) return true;
+    if (end < 0) break;
+    start = end + 1;
+  }
+  return false;
+}
+var KEYBOARD_CLASS = "lch-keyboard";
+var WIRED_ATTR = "data-lch-kb";
+function rowNameOf(columns, row, culture) {
+  if (!row) return null;
+  const parts = [];
+  (columns || []).forEach((c, i) => {
+    const name = typeof c === "string" ? c : c?.name;
+    const v = row[i];
+    if (parts.length >= 4 || v == null || v === "" || typeof name === "string" && name.startsWith("__")) return;
+    parts.push(typeof v === "number" ? v.toLocaleString(culture || void 0, { maximumFractionDigits: 2 }) : String(v));
+  });
+  return parts.length ? parts.join(", ") : null;
+}
+var isClearChord = (e) => !!e.ctrlKey && !!e.shiftKey && (e.key === "C" || e.key === "c");
+var NATIVE = /* @__PURE__ */ new Set(["input", "select", "textarea", "button", "a"]);
+var isNative = (el) => NATIVE.has((el.localName || "").toLowerCase()) || el.isContentEditable === true;
+function installKeyboard(env) {
+  const { container } = env;
+  let rovingKey = null;
+  let destroyed = false;
+  const marksNow = () => {
+    if (env.inert()) return [];
+    return Array.from(container.querySelectorAll(env.markSelector)).filter((m) => !m.closest(env.skipSelector) && (m.getAttribute("data-row-idx") ?? "") !== "");
+  };
+  const wired = (el) => el.hasAttribute(WIRED_ATTR);
+  const wire = (el, tabindex, role) => {
+    if (el.hasAttribute("tabindex") && !wired(el)) return false;
+    el.setAttribute(WIRED_ATTR, "");
+    el.setAttribute("tabindex", tabindex);
+    if (!el.hasAttribute("role")) el.setAttribute("role", role);
+    return true;
+  };
+  const setRoving = (list, to) => {
+    for (const m of list) if (wired(m)) m.setAttribute("tabindex", m === to ? "0" : "-1");
+    rovingKey = env.keyOf(to);
+  };
+  const refresh = () => {
+    if (destroyed) return;
+    try {
+      container.classList?.add(KEYBOARD_CLASS);
+      const list = marksNow();
+      for (const m of list) {
+        if (!wire(m, "-1", "button")) continue;
+        m.setAttribute("aria-pressed", env.isSelected(m) ? "true" : "false");
+        if (!m.hasAttribute("aria-label") && !m.querySelector(":scope > title")) {
+          const name = env.labelOf(m);
+          if (name) m.setAttribute("aria-label", name);
+        }
+      }
+      if (!list.length) {
+        for (const m of Array.from(container.querySelectorAll(`[${WIRED_ATTR}]`)))
+          if (m.matches(env.markSelector)) {
+            m.removeAttribute("tabindex");
+            m.removeAttribute(WIRED_ATTR);
+          }
+      }
+      const own = list.filter(wired);
+      if (own.length) {
+        const keep = own.find((m) => env.keyOf(m) === rovingKey) ?? own.find((m) => env.isSelected(m)) ?? own[0];
+        setRoving(own, keep);
+      }
+      for (const c of Array.from(container.querySelectorAll(env.pressSelector))) {
+        if (isNative(c)) continue;
+        wire(c, "0", "button");
+      }
+    } catch {
+    }
+  };
+  const onKey = (e) => {
+    if (destroyed || e.defaultPrevented) return;
+    const t = e.target;
+    if (!t || !container.contains(t)) return;
+    const k = e.key;
+    if (isClearChord(e)) {
+      e.preventDefault();
+      env.clear();
+      return;
+    }
+    const press = t.closest?.(env.pressSelector);
+    if (press && wired(press) && container.contains(press)) {
+      if (k === "Enter" || k === " " || k === "Spacebar") {
+        e.preventDefault();
+        const ME = container.ownerDocument.defaultView?.MouseEvent ?? MouseEvent;
+        press.dispatchEvent(new ME("click", { bubbles: true, cancelable: true }));
+      } else if (k === "Escape" && env.escapeClears !== false) env.clear();
+      return;
+    }
+    const mark = t.closest?.(env.markSelector);
+    if (!mark || !wired(mark) || !container.contains(mark)) return;
+    const list = marksNow().filter(wired);
+    const at = list.indexOf(mark);
+    const go = (i) => {
+      const to = list[Math.max(0, Math.min(list.length - 1, i))];
+      if (!to) return;
+      setRoving(list, to);
+      try {
+        to.focus({ preventScroll: false });
+      } catch {
+      }
+    };
+    switch (k) {
+      case "ArrowRight":
+      case "ArrowDown":
+        e.preventDefault();
+        go(at + 1);
+        break;
+      case "ArrowLeft":
+      case "ArrowUp":
+        e.preventDefault();
+        go(at - 1);
+        break;
+      case "Home":
+        e.preventDefault();
+        go(0);
+        break;
+      case "End":
+        e.preventDefault();
+        go(list.length - 1);
+        break;
+      case "Enter":
+      case " ":
+      case "Spacebar":
+        e.preventDefault();
+        rovingKey = env.keyOf(mark);
+        env.select(mark, { ctrl: !!(e.ctrlKey || e.metaKey), shift: !!e.shiftKey });
+        break;
+      case "Escape":
+        if (env.escapeClears !== false) env.clear();
+        break;
+    }
+  };
+  container.addEventListener("keydown", onKey);
+  return {
+    refresh,
+    destroy() {
+      destroyed = true;
+      container.removeEventListener("keydown", onKey);
+      try {
+        container.classList?.remove(KEYBOARD_CLASS);
+      } catch {
+      }
+    }
+  };
+}
+
 // src/host.ts
 function sessionViewStateProvider(container) {
   const holder = container;
@@ -2723,6 +2967,9 @@ function createChartHost(container, config) {
     }
   }
   let lassoClaimed = false;
+  let ownBag = null;
+  const seedKey = (s) => s && typeof s === "object" ? JSON.stringify(s) : void 0;
+  let lastSeed = seedKey(raw.uiState);
   if (typeof raw.setUiState !== "function") {
     const provider = config.viewState ?? sessionViewStateProvider(container);
     let bag;
@@ -2736,6 +2983,7 @@ function createChartHost(container, config) {
     if (raw.uiState && typeof raw.uiState === "object" && Object.keys(bag).length === 0)
       Object.assign(bag, raw.uiState);
     raw.uiState = bag;
+    ownBag = { bag, provider };
     raw.setUiState = (s) => {
       if (!s || typeof s !== "object") return;
       try {
@@ -2744,6 +2992,26 @@ function createChartHost(container, config) {
       }
     };
   }
+  const takeSeed = (partial) => {
+    if (typeof partial.setUiState === "function") {
+      ownBag = null;
+      return partial;
+    }
+    if (!ownBag || !("uiState" in partial)) return partial;
+    const { uiState: seed, ...rest } = partial;
+    const key = seedKey(seed);
+    if (key !== void 0 && key !== lastSeed) {
+      lastSeed = key;
+      const { bag, provider } = ownBag;
+      for (const k of Object.keys(bag)) delete bag[k];
+      Object.assign(bag, seed);
+      try {
+        provider.save({ ...bag });
+      } catch {
+      }
+    }
+    return rest;
+  };
   const resolveForHost = (input) => {
     const out = resolveOptions(input);
     return out.allowTooltips == null ? { ...out, allowTooltips: true } : out;
@@ -2758,7 +3026,9 @@ function createChartHost(container, config) {
   let warnedLassoNoFilter = false;
   const idScope = newIdScope();
   let renderSeq = 0;
-  const annotationLayer = createAnnotationLayer(container, (a) => config.onAnnotationClick?.(a));
+  const keyboardOn = codeHasKeyboardStamp(config.code);
+  let keyboard = null;
+  const annotationLayer = createAnnotationLayer(container, (a) => config.onAnnotationClick?.(a), { keyboard: () => keyboardOn });
   const drawAnnotations = () => annotationLayer.draw(
     { columns: data.columns, rows: data.rows },
     {
@@ -2802,6 +3072,21 @@ function createChartHost(container, config) {
     }
   };
   const subs = /* @__PURE__ */ new Set();
+  let hiddenHeld = 0;
+  let factFresh = true;
+  const selectionFact = () => {
+    const n = Array.isArray(data?.rows) ? data.rows.length : 0;
+    const rows = Array.from(new Set((current ?? []).filter((r) => Number.isInteger(r) && r >= 0 && r < n))).sort((a, b) => a - b);
+    return { rows, hidden: hiddenHeld };
+  };
+  const tellSelection = () => {
+    const slot = container[CONTAINER_SLOT_HOST_SELECTION];
+    if (typeof slot !== "function") return;
+    try {
+      slot(selectionFact());
+    } catch {
+    }
+  };
   const ensureAffordanceStyles = () => {
     try {
       if (!doc || doc.getElementById("bic-chart-host-affordances")) return;
@@ -2827,7 +3112,18 @@ function createChartHost(container, config) {
    anomaly badge, a highlight stroke) and must keep dimming with its datum. */
 .${HOST_CONTAINER_CLASS} .${MARK_CLASS} { cursor: pointer; transition: opacity 120ms ease-in-out, filter 100ms ease-in-out; }
 .${HOST_CONTAINER_CLASS} .${MARK_CLASS}:not([${ROW_IDX_ATTR}=""]):hover { filter: brightness(1.1) drop-shadow(0 0 1.5px rgba(0,0,0,0.5)) !important; }
-.${HOST_CONTAINER_CLASS}:has(.${MARK_CLASS}:not([${ROW_IDX_ATTR}=""]):hover) .${MARK_CLASS}:not(:hover):not([${ROW_IDX_ATTR}=""]) { opacity: 0.55; }
+.${HOST_CONTAINER_CLASS}:not(.${MARKS_INERT_CLASS}):has(.${MARK_CLASS}:not([${ROW_IDX_ATTR}=""]):hover) .${MARK_CLASS}:not(:hover):not([${ROW_IDX_ATTR}=""]) { opacity: 0.55; }
+/* A MARK THAT SELECTS NOTHING DOESN'T LOOK CLICKABLE: no pointer, over the inline cursor generated code
+   sets on its marks, and no dimming of the others on hover (the rule above). A control the chart draws keeps its own. */
+.${HOST_CONTAINER_CLASS}.${MARKS_INERT_CLASS} .${MARK_CLASS} { cursor: default !important; }
+/* THE KEYBOARD'S FOCUS: a ring on the mark, control or badge that holds keyboard focus, in the colour the
+   chart's text is drawn in, so it reads in either theme. A pointer's focus shows none. */
+.${HOST_CONTAINER_CLASS}.${KEYBOARD_CLASS} [${WIRED_ATTR}]:focus:not(:focus-visible) { outline: none; }
+.${HOST_CONTAINER_CLASS}.${KEYBOARD_CLASS} [${WIRED_ATTR}]:focus-visible,
+.${HOST_CONTAINER_CLASS} .bic-annotation:focus-visible { outline: 2px solid var(--lch-focus-ring, currentColor) !important; outline-offset: 2px; }
+/* A dimmed mark that takes keyboard focus is drawn at full strength while it has it, ring included: the dim would
+   otherwise fade the ring with the mark. */
+.${HOST_CONTAINER_CLASS}.${KEYBOARD_CLASS}.${SELECTION_ACTIVE_CLASS} .${MARK_CLASS}[${WIRED_ATTR}]:focus-visible:not(.${MARK_SELECTED_CLASS}) { opacity: 1 !important; }
 .${HOST_CONTAINER_CLASS}.${SELECTION_ACTIVE_CLASS} .${MARK_CLASS}:not(.${MARK_SELECTED_CLASS}):not([${ROW_IDX_ATTR}=""]) {
     opacity: var(${DIM_OPACITY_VAR}, ${DIM_OPACITY_DEFAULT}) !important;
 }
@@ -2860,9 +3156,18 @@ function createChartHost(container, config) {
     } catch {
     }
   };
+  const marksInert = () => {
+    if (typeof config.marksSelect !== "function") return false;
+    try {
+      return config.marksSelect() === false;
+    } catch {
+      return false;
+    }
+  };
   const paintSelection = () => {
     if (destroyed) return;
     try {
+      container.classList?.[marksInert() ? "add" : "remove"](MARKS_INERT_CLASS);
       const sel = current;
       const active = !!sel && sel.length > 0;
       const dim = active && !selectionIsPeriod;
@@ -3120,22 +3425,25 @@ function createChartHost(container, config) {
       }
     }
   };
-  const notify = (rowIdxs, source, tick, fromChart = false, publish = true) => {
+  const notify = (rowIdxs, source, tick, fromChart = false, publish = true, meta) => {
     if (destroyed) return;
     current = rowIdxs;
     selectionFromChart = rowIdxs.length > 0 && fromChart;
     selectionPublished = publish;
     activeTickEl = rowIdxs.length ? tick ?? null : null;
     selectionIsPeriod = rowIdxs.length > 0 && periodTickSuppressesFeedback(!!tick, chartOwnsTimeline(container));
+    if (!rowIdxs.length && !meta?.keepHidden) hiddenHeld = 0;
+    factFresh = true;
     paintSelection();
     paintGlyphLayer();
-    if (!publish) return;
-    for (const cb of subs) {
+    keyboard?.refresh();
+    if (publish) for (const cb of subs) {
       try {
-        cb(rowIdxs, source);
+        cb(rowIdxs, source, meta);
       } catch {
       }
     }
+    tellSelection();
   };
   const selectFromLasso = (rows) => {
     if (lassoEffect(resolved.lasso) === "highlight") {
@@ -3164,8 +3472,9 @@ function createChartHost(container, config) {
     const d = e?.detail || {};
     xfAt = Date.now();
     if (d.clear) notify([], d.source || "chart", void 0, false, selectionPublished || !(current && current.length));
+    else if (marksInert()) return;
     else if (d.mark) notify(parseRowIdxs(d.mark.getAttribute?.(ROW_IDX_ATTR)), d.source || "chart", d.mark, true);
-    else if (Array.isArray(d.rows)) notify(validRowSet(d.rows), d.source || "chart", null, true);
+    else if (Array.isArray(d.rows)) notify(validRowSet(d.rows), d.source || "chart", null, true, true, d.keepHidden === true ? { keepHidden: true } : void 0);
   };
   const resolver = createMarkResolver({
     root: container,
@@ -3199,6 +3508,9 @@ function createChartHost(container, config) {
     const wasDrag = clickWasDrag(container, e);
     clearPress(container);
     if (wasDrag) return;
+    const inert = marksInert();
+    container.classList?.[inert ? "add" : "remove"](MARKS_INERT_CLASS);
+    if (inert) return;
     if (Date.now() - xfAt < XF_ECHO_MS) return;
     if (isInsideControl(e?.target, container)) return;
     let el = resolver.findMark(e?.target, clickSel, e);
@@ -3226,6 +3538,27 @@ function createChartHost(container, config) {
   container.addEventListener(XFILTER_REFRESH_EVENT, onXf);
   const untrackPress = trackPress(container);
   container.addEventListener("click", onClick);
+  if (keyboardOn) {
+    const nameOfRow = (m) => {
+      const r = parseRowIdxs(m.getAttribute(ROW_IDX_ATTR))[0];
+      return rowNameOf(data.columns || [], r == null ? null : data.rows?.[r], resolved.cultureCode);
+    };
+    keyboard = installKeyboard({
+      container,
+      markSelector: clickSel,
+      pressSelector: `.${CONTROL_CLASS}`,
+      skipSelector: `.${ANNOTATION_LAYER_CLASS}, .${GLYPH_LAYER_CLASS}, .${LASSO_OUTLINE_CLASS}`,
+      inert: marksInert,
+      select: (m, mods) => {
+        const ME = win?.MouseEvent ?? MouseEvent;
+        m.dispatchEvent(new ME("click", { bubbles: true, cancelable: true, ctrlKey: mods.ctrl, shiftKey: mods.shift }));
+      },
+      clear: clearFromGesture,
+      isSelected: (m) => !!m.classList?.contains(MARK_SELECTED_CLASS),
+      labelOf: nameOfRow,
+      keyOf: (m) => m.getAttribute(ROW_IDX_ATTR) ?? ""
+    });
+  }
   container.classList?.add(HOST_CONTAINER_CLASS);
   ensureAffordanceStyles();
   const fitOpts = config.fit ?? true;
@@ -3373,6 +3706,15 @@ function createChartHost(container, config) {
     } catch {
     }
     paintGlyphLayer();
+    installLassoHere();
+    keyboard?.refresh();
+    const fw = focusWas;
+    focusWas = null;
+    restoreFocus(container, fw);
+    selfRedraw?.takeRecords();
+    watchSelfRedraw();
+  };
+  function installLassoHere() {
     try {
       lasso = installLasso({
         container,
@@ -3383,7 +3725,38 @@ function createChartHost(container, config) {
       });
     } catch {
     }
+  }
+  let selfRedraw = null;
+  let focusWas = null;
+  let notesHeld = (config.annotations ?? []).length > 0;
+  const takesMarks = (n) => n.nodeType === 1 && (!!n.classList?.contains(MARK_CLASS) || !!n.querySelector?.(`.${MARK_CLASS}`));
+  const lassoLost = () => !!lasso?.surface && !lasso.surface.isConnected;
+  const repaintAfterChart = () => {
+    if (destroyed) return;
+    try {
+      ensureCrossfilterHitTargets(container, doc);
+    } catch {
+    }
+    paintSelection();
+    try {
+      drawAnnotations();
+    } catch {
+    }
+    paintGlyphLayer(false);
+    if (lassoLost()) installLassoHere();
+    keyboard?.refresh();
+    selfRedraw?.takeRecords();
   };
+  function watchSelfRedraw() {
+    const MO = win?.MutationObserver;
+    if (selfRedraw || !MO || destroyed) return;
+    selfRedraw = new MO((records) => {
+      if (destroyed || !records.some((r) => Array.from(r.removedNodes).some(takesMarks))) return;
+      if (!(current && current.length) && !notesHeld && !lassoLost()) return;
+      repaintAfterChart();
+    });
+    selfRedraw.observe(container, { childList: true, subtree: true });
+  }
   const renderFailure = (err) => {
     const message = String(err?.message ?? err ?? "");
     if (config.onInvalidSentinel && isInvalidSentinelError(message)) {
@@ -3403,7 +3776,9 @@ function createChartHost(container, config) {
       disposeLasso();
       flushZoom();
       if (hasRendered && keepScroll) rememberScroll(container, scrollKey());
+      focusWas = rememberFocus(container);
       container.innerHTML = "";
+      selfRedraw?.takeRecords();
       hasRendered = true;
       if (!renderFn) {
         if (!config.code) throw new Error("createChartHost: provide code or renderFn");
@@ -3429,6 +3804,7 @@ function createChartHost(container, config) {
       if (resolved.dateCellsAreUtcDays === void 0 && data.dateCellsAreUtcDays) resolved = { ...resolved, dateCellsAreUtcDays: true };
       if (resolved.suppressSelectionGlyph === void 0 && data.meta?.suppressSelectionGlyph === true)
         resolved = { ...resolved, suppressSelectionGlyph: true };
+      if (keyboardOn) resolved = { ...resolved, keyboardMarks: true };
       let outcome;
       zoomCap = null;
       if (zoomMemory && config.code && !config.renderFn) {
@@ -3443,6 +3819,7 @@ function createChartHost(container, config) {
           zoomCap = null;
         }
       }
+      if (raw.hostSelection == null) resolved.hostSelection = factFresh ? selectionFact() : void 0;
       try {
         try {
           outcome = renderFn(container, { columns: data.columns, rows: data.rows }, resolved);
@@ -3503,13 +3880,14 @@ function createChartHost(container, config) {
     // callback) must not clear, stop or annotate the chart that is on screen now.
     setOptions(partial) {
       if (destroyed) return;
-      raw = { ...raw, ...partial };
+      raw = { ...raw, ...takeSeed(partial ?? {}) };
       resolved = resolveForHost(raw);
       host.render();
     },
     setData(next) {
       if (destroyed) return;
       data = next;
+      factFresh = false;
       host.render();
     },
     get options() {
@@ -3517,6 +3895,7 @@ function createChartHost(container, config) {
     },
     setAnnotations(list) {
       if (destroyed) return;
+      notesHeld = (list ?? []).length > 0;
       annotationLayer.set(list);
       try {
         drawAnnotations();
@@ -3555,6 +3934,15 @@ function createChartHost(container, config) {
         if (lasso && lasso.rows().length && !sameRowSet(rows, lasso.rows())) lasso.clear({ publish: false, source: "host" });
         notify(rows, "host");
       },
+      setHidden(count) {
+        if (destroyed) return;
+        const n = Number(count);
+        const next = Number.isFinite(n) && n > 0 ? Math.floor(n) : 0;
+        if (next === hiddenHeld && factFresh) return;
+        hiddenHeld = next;
+        factFresh = true;
+        tellSelection();
+      },
       get current() {
         return current;
       }
@@ -3569,6 +3957,12 @@ function createChartHost(container, config) {
       if (destroyed) return;
       destroyed = true;
       stopAnim();
+      if (selfRedraw) {
+        selfRedraw.disconnect();
+        selfRedraw = null;
+      }
+      keyboard?.destroy();
+      keyboard = null;
       container.removeEventListener(XFILTER_REFRESH_EVENT, onXf);
       container.removeEventListener("click", onClick);
       untrackPress();
@@ -3792,6 +4186,7 @@ export {
   exportFormatsFor,
   exportTableService,
   browserSaveFile,
+  cleanHostSelection,
   resolveOptions,
   buildRenderPayload,
   stripJsComments,
@@ -3814,6 +4209,14 @@ export {
   invalidSentinelReason,
   ANNOTATION_LAYER_CLASS,
   ANNOTATION_CLASS,
+  rememberFocus,
+  restoreFocus,
+  KEYBOARD_STAMP,
+  codeHasKeyboardStamp,
+  KEYBOARD_CLASS,
+  WIRED_ATTR,
+  rowNameOf,
+  installKeyboard,
   sessionViewStateProvider,
   noopViewStateProvider,
   assembleD3,