@sjcrh/proteinpaint-client 2.216.0 → 2.217.0

package/dist/SC-W3M6IEDU.js

@@ -1,1344 +0,0 @@
-import {
-  PlotBase,
-  digestMessage,
-  filterRxCompInit,
-  formatHeaderText,
-  getCombinedTermFilter,
-  getGEunit,
-  getNormalRoot,
-  make_radios,
-  newSandboxDiv,
-  sortTableCallBack
-} from "./chunk-FIFNXVTS.js";
-import "./chunk-HJ6L54YS.js";
-import {
-  importPlot
-} from "./chunk-N2FCAFJH.js";
-import "./chunk-OH33WT6Q.js";
-import {
-  Menu
-} from "./chunk-CNFTQSNE.js";
-import "./chunk-EEB5VE2A.js";
-import {
-  icons
-} from "./chunk-3CIL7KH7.js";
-import "./chunk-T4XPCSLP.js";
-import {
-  dofetch3
-} from "./chunk-5MHE7AIV.js";
-import "./chunk-6WYKPBZI.js";
-import "./chunk-W5J3LTYS.js";
-import "./chunk-DBOJ3TMI.js";
-import {
-  SINGLECELL_CELLTYPE,
-  SINGLECELL_GENE_EXPRESSION,
-  TermTypeGroups
-} from "./chunk-EZFO5UYD.js";
-import {
-  copyMerge,
-  getCompInit,
-  multiInit
-} from "./chunk-HBNB5TRH.js";
-import "./chunk-PF4DSFDR.js";
-import "./chunk-4OLM3KSB.js";
-import "./chunk-6XKAOSQE.js";
-import "./chunk-TLT4YIG3.js";
-import "./chunk-5R63Q5KH.js";
-import {
-  select_default
-} from "./chunk-I6Y4O3RR.js";
-import "./chunk-Q5RDQNIT.js";
-import "./chunk-HS5PO5ZQ.js";
-
-// plots/sc/model/SCModel.ts
-var SCModel = class {
-  constructor(sc) {
-    /** whether a sample has a spatial image (with the consolidated h5ad the
-     spatial subplot needs), keyed by sID. Successful probes are cached;
-     failures return false for the current render and may be retried. */
-    this.sampleHasSpatial = {};
-    this.sc = sc;
-    this.app = sc.app;
-    this.id = sc.id;
-    this.state = sc.app.getState();
-  }
-  /********** All Single Cell SAMPLES for rendering the sample table ******** */
-  async getAllSampleData(state) {
-    const body = {
-      genome: state.vocab.genome,
-      dslabel: state.vocab.dslabel,
-      filter: getNormalRoot(state.termfilter.filter),
-      filter0: state.termfilter.filter0
-    };
-    return await dofetch3("termdb/singlecellSamples", { body, signal: this.sc.api?.getAbortSignal() });
-  }
-  //Fetches optional name for ds defined columns
-  async getColumnLabels(dsScSamples) {
-    if (!dsScSamples || !dsScSamples.sampleColumns) return;
-    const colsCopy = structuredClone(dsScSamples.sampleColumns);
-    for (const col of colsCopy) {
-      let label = col.termid;
-      try {
-        label = (await this.app.vocabApi.getterm(col.termid)).name;
-      } catch (e) {
-        if (e.message) {
-        }
-      }
-      col.label = label;
-    }
-    return colsCopy;
-  }
-  /********** Single Cell DATA for rendering plots ********
-   * This is for the plot buttons. Returns an array plots with found files or
-   * available data. */
-  async getSampleData() {
-    const body = this.getDataRequestOpts();
-    if (!body) return;
-    return await dofetch3("termdb/singlecellData", { body, signal: this.sc.api?.getAbortSignal() });
-  }
-  /** May provide active plots to the request and return plot data when
-   * checkPlotAvailability is false. When checkPlotAvailability is true,
-   * only returns which plots are available but not the actual data. */
-  getDataRequestOpts(_plots = [], checkPlotAvailability = true) {
-    const state = this.app.getState();
-    const singleCellTermdbConfig = state.termdbConfig?.queries?.singleCell;
-    if (!singleCellTermdbConfig?.data) throw new Error("No singleCell.data defined in termdbConfig.queries");
-    const config = state.plots.find((p) => p.id === this.id);
-    if (!config.settings.sc.item) return;
-    const plots = _plots?.length ? _plots : singleCellTermdbConfig.data.plots.map((p) => p.name);
-    return {
-      genome: this.state.vocab.genome,
-      dslabel: this.state.vocab.dslabel,
-      // if true, only return available plot names, but not actual plot data
-      checkPlotAvailability,
-      plots,
-      sample: {
-        eID: config.settings.sc.item.eID,
-        sID: config.settings.sc.item.sID
-      }
-    };
-  }
-  async hasSpatialImage(sID) {
-    if (!(sID in this.sampleHasSpatial)) {
-      if (!this.state.termdbConfig?.queries?.w2) return false;
-      let r;
-      try {
-        r = await dofetch3("termdb/wsiBySample", {
-          // imageType: only the spatial root is enumerated for the probe
-          body: {
-            genome: this.state.vocab.genome,
-            dslabel: this.state.vocab.dslabel,
-            sample_id: sID,
-            imageType: "spatial"
-          },
-          signal: this.sc.api?.getAbortSignal()
-        });
-      } catch (e) {
-        if (this.app.vocabApi?.isAbortError?.(e)) throw e;
-        return false;
-      }
-      if (r?.error) return false;
-      this.sampleHasSpatial[sID] = !!(r?.images || []).some((i) => i.type == "spatial" && i.spatialData);
-    }
-    return this.sampleHasSpatial[sID];
-  }
-  /** Essentially for the GDC. Maybe applied to other ds in the future. */
-  async getCategories(_plots) {
-    const body = this.getDataRequestOpts(_plots, false);
-    if (!body) return;
-    let res;
-    try {
-      res = await dofetch3("termdb/singlecellData", { body, signal: this.sc.api?.getAbortSignal() });
-    } catch (e) {
-      if (e instanceof Error) console.error(`${e.message || e}`);
-    }
-    return this.formatCategories(res);
-  }
-  formatCategories(res) {
-    const plot = structuredClone(res.plots[0]);
-    plot.cells = [...plot.noExpCells, ...plot.expCells];
-    const clusters = new Set(plot.cells.map((c) => c.category));
-    const sortedClusters = Array.from(clusters).sort((a, b) => {
-      const num1 = parseInt(a.split(" ")[1]);
-      const num2 = parseInt(b.split(" ")[1]);
-      return num1 - num2;
-    });
-    return sortedClusters;
-  }
-};
-
-// plots/sc/viewModel/SCViewModel.ts
-var SCViewModel = class {
-  constructor(app, sampleColumns) {
-    this.app = app;
-    this.state = this.app.getState();
-    this.sampleColumns = sampleColumns || [];
-    this.metaResultIds = /* @__PURE__ */ new Set();
-  }
-  processData(config, _items) {
-    const items = _items.sort((a, b) => b.isMetaResult === a.isMetaResult ? 0 : b.isMetaResult ? 1 : -1);
-    const [rows, columns, sampleColIdx] = this.getTabelData(config, items, this.sampleColumns);
-    const selectedRows = [];
-    const sID = config.settings.sc.item?.sID;
-    const i = sID ? items.findIndex((item) => item.sample === sID || item.experiments?.some((e) => e.sampleName === sID)) : -1;
-    if (i != -1) selectedRows.push(i);
-    this.tableData = {
-      rows,
-      columns,
-      selectedRows,
-      sampleColIdx
-    };
-  }
-  /** Shape the selected sample's plot data for the plot buttons view:
-   * the server's plots plus flags the view only reads (hasSpatial shows
-   * the Spatial button). */
-  formatPlotsData(sampleData, hasSpatial) {
-    return { ...sampleData, hasSpatial };
-  }
-  getTabelData(plotConfig, items, sampleColumns) {
-    const rows = [];
-    const hasExperiments = items.some((i) => i.experiments);
-    let sampleColIdx = -1;
-    let firstColLabel = plotConfig.settings.sc.columns.sample;
-    if (items[0]?.isMetaResult) firstColLabel = "";
-    const columns = [{ label: firstColLabel, sortable: true }];
-    if (hasExperiments) {
-      columns.push({ label: "Sample", sortable: true });
-      sampleColIdx = 1;
-    } else sampleColIdx = 0;
-    columns.push({ label: "Shown plots" });
-    for (const col of sampleColumns || []) {
-      columns.push({
-        label: col.label,
-        width: "14vw",
-        sortable: true
-      });
-    }
-    if (hasExperiments) columns.push({ label: "Experiment", sortable: true });
-    for (const item of items) {
-      if (item.isMetaResult) this.metaResultIds.add(item.sample);
-      if (hasExperiments)
-        for (const exp of item.experiments) {
-          const row = [{ value: item.sample, __experimentID: exp.experimentID }];
-          row.push({ value: exp.sampleName });
-          row.push({ value: "" });
-          for (const col of sampleColumns || []) {
-            row.push({ value: item[col.termid] });
-          }
-          const urlTemp = this.state.termdbConfig?.urlTemplates?.scrnaExperimentId;
-          if (urlTemp) row.push({ value: exp.experimentID, url: `${urlTemp.base}${exp.experimentID}` });
-          else row.push({ value: exp.experimentID });
-          rows.push(row);
-        }
-      else {
-        const row = item.isMetaResult ? [{ html: item.sample.replace(/_/g, " "), value: item.sample, elemId: "isMetaResult" }] : [{ value: item.sample }];
-        row.push({ value: "" });
-        for (const col of sampleColumns || []) {
-          const value = item[col.termid];
-          if (value == null && item.isMetaResult) row.push({ value: "All" });
-          else row.push({ value: item[col.termid] });
-        }
-        rows.push(row);
-      }
-    }
-    return [rows, columns, sampleColIdx];
-  }
-};
-
-// plots/sc/interactions/SCInteractions.ts
-var SCInteractions = class {
-  constructor(sc) {
-    this.app = sc.app;
-    this.id = sc.id;
-    this.model = sc.model;
-    this.viewModel = sc.viewModel;
-  }
-  /** Add the plot to the state.plots array with .parentId. Adding
-   * .parentId prevents the plot from launching in a new sandbox outside SC.
-   * Pass the .parentId to both the plotConfig and the action.
-   * this.getState() in SC.ts will find all the subplots with the parentId==this.id
-   * SC.main() initializes the subplots as components in chartsDiv */
-  async createSubplot(config) {
-    const c = Object.assign({}, config, { parentId: this.id });
-    await this.app.dispatch({
-      type: "plot_create",
-      parentId: this.id,
-      config: c
-    });
-  }
-  /** Updates the selected item in the plot settings */
-  async updateItem(item) {
-    item.isMetaResult = this.viewModel.metaResultIds.has(item.sID);
-    await this.app.dispatch({
-      type: "plot_edit",
-      id: this.id,
-      config: { settings: { sc: { item } } }
-    });
-  }
-  async getDropDownOptions(plot) {
-    return this.model.getCategories(plot);
-  }
-};
-
-// plots/sc/view/SCSampleTable.ts
-var SCSampleTable = class {
-  constructor(dom, tableData, opts = {}) {
-    this.sampleColIdx = 0;
-    this.showPlotsColumn = false;
-    this.rowMap = /* @__PURE__ */ new Map();
-    this.rows = [];
-    this.columns = [];
-    this.dom = dom;
-    this.holder = dom?.tableDiv || dom;
-    this.onRowClick = opts.onRowClick;
-    this.applyTableData(tableData);
-    this.renderStaticTable();
-  }
-  applyTableData(tableData) {
-    this.tableData = tableData;
-    this.rows = tableData.rows;
-    this.columns = tableData.columns;
-    this.sampleColIdx = tableData.sampleColIdx ?? 0;
-  }
-  renderStaticTable() {
-    this.holder.selectAll("*").remove();
-    this.parentDiv = this.holder.append("div").style("background-color", "white").style("display", "inline-block").style("max-height", "30vh").style("max-width", "90vw").classed("sjpp_show_scrollbar", true);
-    this.table = this.parentDiv.append("table").style("width", "100%");
-    this.thead = this.table.append("thead");
-    this.thead.style("position", "sticky").style("top", "0").style("background-color", "white").style("z-index", "1");
-    this.tableHeaderRow = this.thead.append("tr");
-    this.tbody = this.table.append("tbody");
-    this.renderHeader();
-    this.renderRows();
-  }
-  /** Renders into a freshly emptied header row (see renderStaticTable()), so this join
-   * never has anything to match against existing DOM -- every column enters. Still uses
-   * .data().join() over the manual loop so per-column attrs are declarative and the
-   * heterogeneous per-cell setup (label + optional sort icon) is isolated in one place. */
-  renderHeader() {
-    this.tableHeaderRow.append("td").style("width", "1vw");
-    this.tableHeaderRow.append("th").style("width", "1.5vw").style("padding", "0");
-    this.tableHeaderRow.selectAll("th.sjpp_table_header").data(this.columns).join("th").attr("class", "sjpp_table_item sjpp_table_header").style("display", (column) => column.label === "Shown plots" && !this.showPlotsColumn ? "none" : null).style("width", (column) => column.width || null).attr("title", (column) => column.tooltip || null).each((column, columnIndex, nodes) => this.renderHeaderLabel(select_default(nodes[columnIndex]), column, columnIndex));
-  }
-  renderHeaderLabel(th, column, columnIndex) {
-    const labelWrap = th.append("span").style("display", "inline-flex").style("align-items", "center");
-    labelWrap.append("span").text(column.label);
-    if (!column.sortable) return;
-    const sortDiv = labelWrap.append("div").style("display", "inline-block").style("padding-left", "6px");
-    let isAscending = false;
-    icons["updown"](sortDiv, {
-      handler: () => {
-        isAscending = !isAscending;
-        this.sortRows(sortTableCallBack(columnIndex, this.rows, isAscending));
-      }
-    });
-  }
-  /** Renders into a freshly emptied tbody (see renderStaticTable()), so this join
-   * never has anything to match against existing DOM -- every row enters. */
-  renderRows() {
-    this.rowMap.clear();
-    this.tbody.selectAll("tr.sjpp_row_wrapper").data(this.rows).join("tr").attr("class", "sjpp_row_wrapper").attr("tabindex", 0).each((row, rowIndex, nodes) => this.renderRow(select_default(nodes[rowIndex]), row, rowIndex));
-    this.renumberRows();
-  }
-  renderRow(tr, row, rowIndex) {
-    const sampleId = String(row[this.sampleColIdx]?.value ?? "");
-    if (!sampleId) return;
-    tr.append("td").attr("class", "sjpp_row_index").text(rowIndex + 1).style("text-align", "center").style("width", "1vw").style("font-size", "0.8rem");
-    tr.append("td").style("width", "1.5vw").style("padding", "0 6px").style("text-align", "center").append("input").attr("type", "radio").attr("name", "sjpp-sc-row-selection").attr("value", sampleId).attr("aria-label", `Select ${sampleId}`).property("checked", this.tableData.selectedRows.includes(rowIndex)).on("change", () => this.onRowClick?.(sampleId));
-    const entry = { sampleId, row: tr, cells: {} };
-    tr.selectAll("td.sjpp_table_item").data(row).join("td").attr("id", (cell) => cell.elemId || null).attr("class", "sjpp_table_item").attr("data-testid", (cell) => cell.dataTestId || "sjpp-table-cell-item").each((cell, colIdx, nodes) => this.renderDataCell(select_default(nodes[colIdx]), cell, colIdx, entry));
-    tr.on("click", () => this.onRowClick?.(sampleId));
-    tr.on("keydown", (event) => {
-      if (event.key === "Enter") this.onRowClick?.(sampleId);
-    });
-    this.rowMap.set(sampleId, entry);
-  }
-  /** url > html > value, matching the old renderTable() priority (client/dom/table.ts):
-   * meta-result rows set both html (display label) and value (raw sample id, used
-   * elsewhere for lookups), and html is meant to win for rendering. */
-  renderDataCell(td, cell, colIdx, entry) {
-    const isShownPlotsCol = this.columns[colIdx]?.label === "Shown plots";
-    if (isShownPlotsCol && !this.showPlotsColumn) td.style("display", "none");
-    if (colIdx === this.sampleColIdx) entry.cells.sample = td;
-    if (isShownPlotsCol) entry.cells.shownPlots = td;
-    if (cell.url)
-      td.append("a").text(cell.value || cell.value === 0 ? cell.value : cell.url).attr("href", cell.url).attr("target", "_blank").attr("rel", "noopener noreferrer").attr("aria-label", `Click to ${cell.url}`).on("click", (event) => event.stopPropagation());
-    else if (cell.html) td.html(cell.html);
-    else if ("value" in cell) td.text(cell.value).attr("aria-label", cell.value);
-  }
-  /** Patches the table in place when the incoming data describes the same
-   * set of samples/columns (e.g. a subplot state change re-triggers SC's
-   * main()/update() without the sample list itself changing). Only falls
-   * back to a full teardown+rebuild when the sample list or columns
-   * actually changed, so row identity (and scroll position) survives
-   * updates that only affect plot buttons. */
-  setTableData(tableData) {
-    const needsRebuild = !this.isSameShape(tableData);
-    this.applyTableData(tableData);
-    if (needsRebuild) this.renderStaticTable();
-    else this.syncSelectedRows(tableData);
-  }
-  /** Compares by the set of sample IDs rather than row order, since sortRows()
-   * reorders this.rows/DOM in place on user interaction. Comparing positionally
-   * would treat that as a "shape change" on the next incoming tableData and
-   * force an unnecessary rebuild that undoes the sort and resets scroll. */
-  isSameShape(tableData) {
-    if (tableData.columns.length !== this.columns.length) return false;
-    for (const [i, column] of this.columns.entries()) {
-      if (tableData.columns[i]?.label !== column.label) return false;
-    }
-    if (tableData.rows.length !== this.rows.length) return false;
-    const incomingSampleColIdx = tableData.sampleColIdx ?? this.sampleColIdx;
-    return tableData.rows.every((row) => this.rowMap.has(String(row[incomingSampleColIdx]?.value ?? "")));
-  }
-  /** selectedRows is always 0 or 1 entries (radio selection), see SCViewModel. */
-  syncSelectedRows(tableData) {
-    const sampleColIdx = tableData.sampleColIdx ?? this.sampleColIdx;
-    const selectedRowIndex = tableData.selectedRows[0];
-    const selectedId = selectedRowIndex != null ? String(tableData.rows[selectedRowIndex]?.[sampleColIdx]?.value ?? "") : "";
-    for (const [sampleId, entry] of this.rowMap) {
-      const input = entry.row.select('input[type="radio"]').node();
-      if (input) input.checked = sampleId === selectedId;
-    }
-  }
-  setShownPlotsColumnVisibility(visible) {
-    if (visible !== this.showPlotsColumn) this.toggleShownPlotsColumn(visible);
-  }
-  toggleShownPlotsColumn(visible) {
-    this.showPlotsColumn = visible;
-    const shownPlotsHeaderIndex = this.columns.findIndex((c) => c.label === "Shown plots");
-    if (shownPlotsHeaderIndex === -1) return;
-    const domColumnIndex = shownPlotsHeaderIndex + 1;
-    const headerCells = this.tableHeaderRow.selectAll("th").nodes();
-    const visibleState = visible ? "table-cell" : "none";
-    if (headerCells[domColumnIndex]) headerCells[domColumnIndex].style.display = visibleState;
-    for (const entry of this.rowMap.values()) entry.cells.shownPlots?.style("display", visibleState);
-  }
-  /**
-   * Reorders existing DOM nodes to match a sort, instead of deleting/recreating the
-   * whole table -- this intentionally keeps row identity (and any injected plot
-   * buttons) stable. The row-index text and striping were set once at creation from
-   * that row's original position, so they're now stale for any row that moved;
-   * renumberRows() recomputes both from the new DOM order, the same way the generic
-   * renderTable() derives them from visible row position (client/dom/table.ts).
-   */
-  sortRows(sortedRows) {
-    const parentNode = this.tbody.node();
-    for (const row of sortedRows) {
-      const sampleId = String(row[this.sampleColIdx]?.value ?? "");
-      const entry = this.rowMap.get(sampleId);
-      if (!entry) continue;
-      parentNode.appendChild(entry.row.node());
-    }
-    this.rows = sortedRows;
-    this.renumberRows();
-  }
-  renumberRows() {
-    this.tbody.selectAll("tr.sjpp_row_wrapper").each((_row, rowIndex, nodes) => {
-      const tr = select_default(nodes[rowIndex]);
-      tr.select("td.sjpp_row_index").text(rowIndex + 1);
-      tr.style("background-color", () => rowIndex % 2 === 1 ? "rgb(245,245,245)" : null);
-    });
-  }
-};
-
-// plots/sc/view/SampleTableRenderer.ts
-var SampleTableRenderer = class {
-  constructor(dom, interactions, tableData) {
-    this.activeSandboxes = /* @__PURE__ */ new Map();
-    /** Tracks rendered btns per sample to avoid unnecessary destroy/recreate pattern. */
-    this.rendered = /* @__PURE__ */ new Map();
-    this.table = null;
-    this.dom = dom;
-    this.interactions = interactions;
-    this.tableData = tableData;
-    this.renderSamplesTable(tableData);
-  }
-  /** Users select one item at a time to render the plot buttons
-   * to init() plots in the dashboard.*/
-  renderSamplesTable(tableData) {
-    this.tableData = tableData;
-    this.table = new SCSampleTable(this.dom.tableDiv, tableData, {
-      onRowClick: (sampleId) => {
-        const data = this.tableData;
-        const sampleColIdx = data.sampleColIdx ?? 0;
-        const rowIndex = data.rows.findIndex((row) => String(row[sampleColIdx]?.value ?? "") === sampleId);
-        if (rowIndex === -1) return;
-        const item = this.buildItemFromRow(data, rowIndex);
-        this.interactions.updateItem(item);
-        this.dom.plotsBtnsDiv.style("display", "block");
-        this.dom.selectBtn.toggle();
-      }
-    });
-    this.reapplyAllPlotButtons();
-  }
-  /** Builds an item object from a table row, mapping column labels to keys.
-   * Converts 'sample' -> 'sID' and 'experiment' -> 'eID'.
-   * Extracted out from noButtonCallback for testing.  */
-  buildItemFromRow(tableData, index) {
-    const item = {};
-    tableData.rows[index].forEach((r, idx) => {
-      if (!r.value) return;
-      let key = tableData.columns[idx].label.toLowerCase();
-      key = key === "sample" || key === "" ? "sID" : key === "experiment" ? "eID" : key;
-      item[key] = r.value;
-    });
-    if (!item.sID) throw new Error("Selected item must have sID property");
-    return item;
-  }
-  updateTable(tableData) {
-    this.tableData = tableData;
-    if (!this.table) {
-      this.renderSamplesTable(tableData);
-      return;
-    }
-    this.table.setTableData(tableData);
-    this.reapplyAllPlotButtons();
-  }
-  updatePlotBtns(activeSandboxes) {
-    this.activeSandboxes = activeSandboxes;
-    let totalPlots = 0;
-    for (const sandboxes of activeSandboxes.values()) totalPlots += sandboxes.length;
-    this.table?.setShownPlotsColumnVisibility(totalPlots >= 2);
-    this.reapplyAllPlotButtons();
-  }
-  /** Called by afterRender to re-apply buttons for all samples with subplots.
-   * Also called in updateTable when the active sandboxes (i.e. subplots) change.*/
-  reapplyAllPlotButtons() {
-    for (const sampleId of this.rendered.keys()) {
-      if (!this.activeSandboxes.has(sampleId)) {
-        this.deleteBtns(sampleId);
-      }
-    }
-    for (const sampleId of this.activeSandboxes.keys()) {
-      this.applyButtonsForSample(sampleId);
-    }
-  }
-  deleteBtns(sampleId) {
-    const cached = this.rendered.get(sampleId);
-    if (cached) {
-      cached.cell.selectAll(".sjpp-sc-table-plot-btn").remove();
-      this.rendered.delete(sampleId);
-    }
-  }
-  /** Applies buttons for a single sample. Skips DOM work if cell and plots are unchanged. */
-  applyButtonsForSample(sampleId) {
-    const sampleSandboxes = this.activeSandboxes.get(sampleId);
-    if (!sampleSandboxes || sampleSandboxes.length === 0) return;
-    if (!this.table) return;
-    const cell = this.table.rowMap.get(sampleId)?.cells?.shownPlots;
-    if (!cell) return;
-    const plotIds = sampleSandboxes.map((s) => s.plotId).join(",");
-    const cached = this.rendered.get(sampleId);
-    if (cached && cached.cell === cell && cached.plotIds === plotIds) return;
-    cell.selectAll(".sjpp-sc-table-plot-btn").remove();
-    this.rendered.set(sampleId, { cell, plotIds });
-    for (const { div, plotName } of sampleSandboxes) {
-      this.appendPlotBtn(cell, div, plotName, sampleId);
-    }
-  }
-  appendPlotBtn(cell, sandboxDiv, plotName, sampleId) {
-    const text = plotName.length > 25 ? plotName.slice(0, 12) + "..." : plotName;
-    const label = `Scroll to ${plotName}`;
-    cell.append("button").attr("class", "sjpp-sc-table-plot-btn").attr("data-testid", `sjpp-sc-table-${sampleId}-${plotName}-btn`).style("padding", "2px 5px").style("margin-left", "4px").style("font-size", "0.8em").style("border-radius", "20px").style("border", "0.5px solid black").style("cursor", "pointer").text(text).attr("aria-label", label).attr("title", label).attr("tabindex", 0).on("click", () => {
-      sandboxDiv.node().scrollIntoView({ behavior: "smooth", block: "start" });
-    });
-  }
-};
-
-// plots/sc/view/PlotButtons.ts
-var PlotButtons = class {
-  /** scctTerms and the scTermdbConfig are created on server init and will not change. */
-  constructor(interactions, holder, termdbConfig) {
-    holder.style("padding", "10px");
-    const promptDiv = holder.append("div").style("padding", "10px 0").text("Select data from");
-    this.plotBtnsDom = {
-      holder,
-      promptDiv,
-      selectPrompt: promptDiv.append("span"),
-      btnsDiv: holder.append("div"),
-      tip: new Menu({ padding: "" })
-    };
-    this.interactions = interactions;
-    this.scctTerms = termdbConfig?.termType2terms?.[TermTypeGroups.SINGLECELL_CELLTYPE];
-    this.scnvTerms = termdbConfig?.termType2terms?.[TermTypeGroups.SINGLECELL_NUMERIC_VALUE];
-    this.scTermdbConfig = termdbConfig.queries.singleCell;
-  }
-  update(settings, data) {
-    const item = settings.sc.item;
-    this.plotBtnsDom.holder.style("display", !item ? "none" : "block");
-    if (!item) return;
-    if (data != null && data.plots) this.data = data;
-    this.availablePlots = new Set(this.data?.plots?.map((p) => p.name));
-    this.settings = settings;
-    this.item = item;
-    const name = item.sID;
-    this.plotBtnsDom.selectPrompt.text(` ${name}:`);
-    this.renderChartBtns();
-  }
-  renderChartBtns() {
-    this.plotBtnsDom.btnsDiv.selectAll("*").remove();
-    const disabledPlots = this.scTermdbConfig?.scApp?.disabledPlots || [];
-    const btns = this.getChartBtnOpts().filter((b) => !disabledPlots.includes(b.chartType)).filter((b) => b.isVisible());
-    this.plotBtnsDom.btnsDiv.selectAll("button").data(btns).enter().append("button").attr("type", "button").attr("data-testid", (b) => `sjpp-sc-plot-btn-${b.label.toLowerCase().replace(/\s/g, "-")}`).style("padding", "10px 15px").style("border-radius", "20px").style("border-color", "transparent").style("background-color", "#CFE2F3").style("margin", "0 10px").style("cursor", "pointer").text((b) => b.label).on("click", async (e, plot) => {
-      if (plot.open) {
-        this.plotBtnsDom.tip.clear().showunder(e.target);
-        plot.open(plot, this);
-      } else {
-        if (!plot.getPlotConfig)
-          throw new Error(`No getPlotConfig function defined for this plot button = ${plot.label}`);
-        const config = await plot.getPlotConfig();
-        await this.interactions.createSubplot(config);
-      }
-    });
-  }
-  getChartBtnOpts() {
-    const btns = [];
-    for (const plot of this.scTermdbConfig?.data?.plots || []) {
-      if (!this.availablePlots.has(plot.name)) continue;
-      btns.push({
-        label: plot.name,
-        chartType: "sampleScatter",
-        isVisible: () => true,
-        getPlotConfig: async () => {
-          return await this.getSingleCellConfig(plot.name);
-        }
-      });
-    }
-    btns.push(
-      {
-        label: "Summary",
-        chartType: "dictionary",
-        /** Note: if only spatial image available, this plot should not show. */
-        isVisible: () => this.availablePlots.has("dictionary"),
-        getPlotConfig: () => {
-          const sample = { ...this.item, plots: Array.from(this.availablePlots) };
-          const isMeta = sample?.isMetaResult || false;
-          return {
-            chartType: "dictionary",
-            sample,
-            spawnConfig: {
-              parentId: this.interactions.id,
-              headerText: this.makeHeaderText(sample, isMeta),
-              hidePlotFilter: !isMeta,
-              sample
-            },
-            tree: {
-              usecase: {
-                target: "dictionary",
-                specialCase: {
-                  type: "singleCell",
-                  config: { sample }
-                }
-              }
-            }
-          };
-        }
-      },
-      {
-        label: "Gene expression",
-        chartType: "GeneExpInput",
-        isVisible: () => this.scTermdbConfig?.geneExpression && this.availablePlots.has(this.scTermdbConfig.geneExpression?.label || "Gene expression"),
-        getPlotConfig: () => {
-          const sample = this.item;
-          const isMeta = sample?.isMetaResult || false;
-          const headerText = this.makeHeaderText(sample, isMeta);
-          return {
-            chartType: "GeneExpInput",
-            termType: SINGLECELL_GENE_EXPRESSION,
-            headerText,
-            termProperties: { sample },
-            parentId: this.interactions.id,
-            sample,
-            spawnConfig: {
-              parentId: this.interactions.id,
-              headerText,
-              hidePlotFilter: !isMeta,
-              /** Must pass this to summary config in the event a continuous
-               * overlay is applied, launching the scatter plot. Without it,
-               * the single cell model is not used. */
-              singleCellPlot: {
-                name: [...this.availablePlots][0],
-                sample
-              }
-            }
-          };
-        }
-      },
-      {
-        label: "Differential expression",
-        chartType: "DA",
-        isVisible: () => this.scTermdbConfig?.DEgenes,
-        open: this.termDropdownMenu,
-        getPlotConfig: (value) => {
-          const isMeta = this.item?.isMetaResult || false;
-          return {
-            chartType: "differentialAnalysis",
-            termType: SINGLECELL_CELLTYPE,
-            categoryName: `${value}`,
-            headerText: `${isMeta ? "" : "Sample: "}${this.item.sID}, ${this.scTermdbConfig.DEgenes.termId} ${value}`,
-            termId: this.scTermdbConfig.DEgenes.termId,
-            sample: this.item,
-            plotName: "Differential expression"
-          };
-        }
-      },
-      {
-        label: this.scTermdbConfig?.images?.label || "Image",
-        chartType: "imagePlot",
-        isVisible: () => this.scTermdbConfig?.images && this.availablePlots.has(this.scTermdbConfig.images.label || "Image"),
-        getPlotConfig: () => {
-          const isMeta = this.item?.isMetaResult || false;
-          return {
-            chartType: "imagePlot",
-            sample: this.item,
-            imgDir: this.scTermdbConfig?.images,
-            headerText: this.makeHeaderText(this.item, isMeta),
-            settings: { imagePlot: { width: "", height: 400 } }
-          };
-        }
-      },
-      {
-        // spatial tissue viewer for samples with a spatial image (the model's
-        // wsiBySample probe sets data.hasSpatial); spawns the w2 wsi plot in
-        // fixed-sample mode, which has its own burger menu for the overlays
-        label: "Spatial",
-        chartType: "wsi",
-        isVisible: () => !!this.data?.hasSpatial,
-        getPlotConfig: () => {
-          const sample = this.item;
-          return {
-            chartType: "wsi",
-            name: `Sample: ${sample.sID} Spatial`,
-            sample,
-            plotName: "Spatial"
-          };
-        }
-      }
-    );
-    return btns;
-  }
-  makeHeaderText(sample, isMeta, plot) {
-    const caseText = sample.case ? ` Case: ${sample.case}` : "";
-    const projectText = sample?.["project id"] ? ` Project: ${sample["project id"]}` : "";
-    return `${isMeta ? "" : "Sample: "}${sample.sID}${caseText}${projectText}${plot ? ` (${plot})` : ""}`;
-  }
-  //********** Btn Menus **********/
-  async termDropdownMenu(plot, self) {
-    const _plot = Array.from(self.availablePlots)[0];
-    const options = await self.interactions.getDropDownOptions([_plot]);
-    if (!options?.length) throw new Error("No options found for this plot. Cannot open dropdown menu.");
-    self.plotBtnsDom.tip.clear();
-    const wrapper = self.plotBtnsDom.tip.d.append("div").style("padding", "10px");
-    wrapper.append("div").style("display", "block").style("width", "300px").text(`View differentially expressed genes of a ${self.scTermdbConfig.DEgenes.termId} versus rest of the cells:`);
-    const select = wrapper.append("select").style("margin", "10px 0").style("width", "auto").style("padding", "5px").on("change", async function() {
-      self.plotBtnsDom.tip.hide();
-      const value = select.node().value;
-      if (value.indexOf("Select") == 0) return;
-      const config = plot.getPlotConfig(value);
-      await self.interactions.createSubplot(config);
-    });
-    const regex = new RegExp(self.scTermdbConfig.DEgenes.termId, "gi");
-    options.unshift(`Select a ${self.scTermdbConfig.DEgenes.termId}...`);
-    for (const cluster of options) {
-      select.append("option").attr("value", cluster.replace(regex, "").trim()).text(cluster);
-    }
-  }
-  //********** Plot Config Helpers **********/
-  async getSingleCellConfig(plotName) {
-    if (!this.item) throw new Error("No item selected");
-    const plot = this.scTermdbConfig.data.plots.find((p) => p.name == plotName);
-    if (!plot) throw new Error(`No plot by name ${plotName} in data.plots.`);
-    const sample = this.item;
-    const isMeta = sample?.isMetaResult || false;
-    const config = {
-      chartType: "sampleScatter",
-      name: this.makeHeaderText(sample, isMeta, plotName),
-      sample,
-      singleCellPlot: {
-        name: plotName,
-        sample
-      }
-    };
-    if (plot.colorColumns?.[0]) {
-      const key = plot.colorColumns[0]?.type == "numeric" ? "scnv" : "scct";
-      config.colorTW = await this.makeScTW(key, sample, plot);
-    }
-    return config;
-  }
-  // Quick fix. Eventually use the handler to get the proper term from the termdbConfig
-  async makeScTW(key, item, plot) {
-    if (!key) throw new Error("Key is required for makeScTW");
-    const colorColName = plot.colorColumns[0].name;
-    const savedTerm = this[`${key}Terms`]?.find((t) => t.name == colorColName && t.plot == plot.name);
-    if (!savedTerm) {
-      const ttg = key === "scct" ? TermTypeGroups.SINGLECELL_CELLTYPE : TermTypeGroups.SINGLECELL_NUMERIC_VALUE;
-      throw new Error(`No term found for colorColumn=${colorColName} in .termType2terms.${ttg} for plot ${plot.name}`);
-    }
-    const term = Object.assign(structuredClone(savedTerm), {
-      sample: item
-    });
-    const id = await digestMessage(`${plot.name}-${item.sID}-${item.eID}`);
-    return Object.assign({ $id: id }, { term });
-  }
-};
-
-// plots/sc/view/SectionRenderer.ts
-var SectionRenderer = class {
-  constructor(sectionsDiv, groupBy) {
-    this.sections = {};
-    this.holder = sectionsDiv;
-    this.plotId2Key = /* @__PURE__ */ new Map();
-    this.groupBy = groupBy;
-  }
-  /** Send the sc with the updated state. May not be necessary long term. If not,
-   * remove and put in the constructor. */
-  async update(sc, subplots, groupBy) {
-    if (groupBy !== this.groupBy) {
-      this.groupBy = groupBy;
-      this.regroupSections(sc, subplots);
-      return;
-    }
-    const activeSubplots = new Set(subplots.map((s) => s.id));
-    for (const plotId of Array.from(this.plotId2Key.keys())) {
-      if (!activeSubplots.has(plotId)) this.removeSandbox(plotId);
-    }
-    for (const subplot of subplots) {
-      const key = this.getKey(subplot, sc);
-      if (!key) continue;
-      if (!this.sections[key]) this.initSection(key, sc);
-      if (!this.sections[key].sandboxes[subplot.id]) {
-        this.plotId2Key.set(subplot.id, key);
-        sc.subplotManager.setSectionKey(subplot.id, key);
-        await this.initSandbox(sc, subplot, key);
-      }
-    }
-    for (const key of Object.keys(this.sections)) {
-      if (Object.keys(this.sections[key].sandboxes).length === 0) {
-        this.removeSection(key, sc);
-      }
-    }
-  }
-  /** Reparent existing sandboxes into new section containers
-   * without destroying/recreating plot components. */
-  regroupSections(sc, subplots) {
-    const detached = /* @__PURE__ */ new Map();
-    for (const [plotId, key] of this.plotId2Key) {
-      const sandboxNode = this.sections[key]?.sandboxes[plotId];
-      if (sandboxNode) {
-        sandboxNode.remove();
-        detached.set(plotId, sandboxNode);
-      }
-    }
-    this.holder.selectAll("*").remove();
-    this.sections = {};
-    this.plotId2Key = /* @__PURE__ */ new Map();
-    for (const subplot of subplots) {
-      const key = this.getKey(subplot, sc);
-      if (!key) continue;
-      if (!this.sections[key]) this.initSection(key, sc);
-      this.plotId2Key.set(subplot.id, key);
-      sc.subplotManager.setSectionKey(subplot.id, key);
-      const existing = detached.get(subplot.id);
-      if (existing) {
-        this.sections[key].subplots.node().prepend(existing.node());
-        this.sections[key].sandboxes[subplot.id] = existing;
-      }
-    }
-  }
-  getKey(subplot, sc) {
-    if (this.groupBy === "none") return "none";
-    if (this.groupBy === "sample") return this.getSampleId(subplot);
-    return sc.subplotManager.getPlotName(subplot);
-  }
-  /** Extract sID from a subplot's config.
-   * Actual subplots store sample as {sID, eID} at top level or on term.term.sample. */
-  getSampleId(subplot) {
-    return subplot.sample?.sID || subplot.singleCellPlot?.sample?.sID || subplot.term?.term?.sample?.sID;
-  }
-  initSection(key, sc) {
-    const item = this.findSampleMetadata(key, sc);
-    const titleAttrText = this.groupBy == "sample" ? "this sample section" : this.groupBy == "plot" ? "this plot section" : "all plots";
-    const sectionWrapper = this.holder.insert("div", ":first-child").style("padding", "10px").attr("data-testid", `sjpp-sc-section-wrapper-${key}`);
-    sectionWrapper.append("span").attr("data-testid", `sjpp-sc-section-remove-btn-${key}`).style("margin", "0px 5px").style("cursor", "pointer").attr("title", `Remove ${titleAttrText}`).html(
-      `<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="#000" class="bi bi-x-lg" viewBox="0 0 12 12">
-                <path
-                    stroke="#000"
-                    transform="scale(0.75)"
-                    d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854Z"/>
-                </svg>`
-    ).on("click", () => {
-      this.removeSection(key, sc);
-    });
-    const titleText = this.makeSectionTitleText(key, item);
-    const titleWrapper = sectionWrapper.append("span").style("font-weight", 600).style("opacity", 0.7).text(titleText);
-    if (titleText.length) {
-      const arrow = titleWrapper.append("span").style("font-size", "0.8em").style("padding-left", "3px").attr("title", `Show/hide plots in ${titleAttrText}`).text("\u25BC");
-      titleWrapper.on("click", () => {
-        const isHidden = this.sections[key].subplots.style("display") === "none";
-        this.sections[key].subplots.style("display", isHidden ? "block" : "none");
-        arrow.text(isHidden ? "\u25BC" : "\u25B2");
-      });
-    }
-    this.sections[key] = {
-      sectionWrapper,
-      title: titleWrapper,
-      subplots: sectionWrapper.append("div").attr("data-testid", `sjpp-sc-subplots-${key}`),
-      sandboxes: {}
-    };
-  }
-  /** Look up sample metadata from the fetched items list.
-   * For experiment datasets, matches sID against experiments[].sampleName.
-   * For non-experiment datasets, matches sID against item.sample. */
-  findSampleMetadata(sampleId, sc) {
-    if (!sc.items) return void 0;
-    return sc.items.find((item) => item.sample === sampleId || item.experiments?.some((e) => e.sampleName === sampleId));
-  }
-  makeSectionTitleText(key, item) {
-    if (this.groupBy === "none") return "All plots";
-    if (this.groupBy === "plot") return key;
-    const caseText = item?.sample && item.sample !== key ? `Case: ${item.sample}` : "";
-    const isMeta = item?.isMetaResult || false;
-    const itemText = `${isMeta ? "" : "Sample: "}${key}`;
-    const projectProp = item?.case?.project?.project_id || item?.["project id"];
-    const projectText = projectProp ? `Project: ${projectProp}` : "";
-    return [itemText, caseText, projectText].filter(Boolean).join(" ");
-  }
-  async initSandbox(sc, subplot, key) {
-    const sandboxHolder = this.sections[key].subplots.insert("div", ":first-child").attr("data-testid", `sjpp-sc-sandbox-${subplot.id}`);
-    const sandboxDiv = await sc.subplotManager.initSubplotSandbox(sandboxHolder, subplot, {
-      sectionKey: key
-    });
-    this.sections[key].sandboxes[subplot.id] = sandboxDiv;
-  }
-  removeSection(key, sc) {
-    const subactions = [];
-    for (const plotId of Object.keys(this.sections[key].sandboxes || {})) {
-      this.removeSandbox(plotId, key);
-      subactions.push({
-        type: "plot_delete",
-        id: plotId,
-        parentId: sc.id
-      });
-    }
-    if (subactions.length > 0) {
-      sc.app.dispatch({
-        type: "app_refresh",
-        subactions
-      });
-    }
-    this.sections[key].sectionWrapper.remove();
-    delete this.sections[key];
-  }
-  removeSandbox(plotId, _key) {
-    const key = _key || this.plotId2Key.get(plotId);
-    if (!key) return;
-    const section = this.sections[key];
-    const sandbox = section?.sandboxes?.[plotId];
-    if (sandbox) sandbox.remove();
-    if (section?.sandboxes?.[plotId]) delete section.sandboxes[plotId];
-    this.plotId2Key.delete(plotId);
-  }
-};
-
-// plots/sc/settings/Settings.ts
-var GroupByOptions = ["sample", "plot", "none"];
-
-// plots/sc/view/SCViewRenderer.ts
-var SCViewRenderer = class {
-  constructor(sc) {
-    this.tableVisible = true;
-    this.sc = sc;
-    this.dom = sc.dom;
-    this.interactions = sc.interactions;
-    this.dom.controlsDiv.style("padding", "10px");
-  }
-  render(settings, state) {
-    this.renderSelectBtn();
-    this.renderGroupByOptions(settings);
-    this.plotBtns = new PlotButtons(this.interactions, this.dom.plotsBtnsDiv, state.termdbConfig);
-    this.sectionRenderer = new SectionRenderer(this.dom.sectionsDiv, settings.groupBy);
-  }
-  /** Renders the select btn at the top of the page that
-   * show/hides the item table and plot buttons */
-  renderSelectBtn() {
-    const btn = this.dom.controlsDiv.append("button").attr("data-testid", "sjpp-sc-item-table-select-btn").attr("title", "Show/hide sample table and plot buttons").style("border-radius", "20px").style("padding", "5px 10px").style("background-color", "transparent").text("Select sample");
-    const arrowSpan = btn.append("span").style("font-size", "0.8em").style("padding-left", "3px").text("\u25BC");
-    btn.toggle = () => {
-      this.tableVisible = !this.tableVisible;
-      arrowSpan.text(this.tableVisible ? "\u25BC" : "\u25B2");
-      this.dom.tableDiv.style("display", this.tableVisible ? "block" : "none");
-    };
-    btn.on("click", () => {
-      btn.toggle();
-    });
-    this.dom.selectBtn = btn;
-  }
-  renderGroupByOptions(settings) {
-    this.groupsWrapper = this.dom.controlsDiv.append("div").style("display", "none");
-    this.groupsWrapper.append("span").style("padding", "3px 0px 3px 20px").style("opacity", 0.7).text("Group by:");
-    const optionsDiv = this.groupsWrapper.append("span").style("display", "inline-block");
-    const options = GroupByOptions.map((option) => {
-      return {
-        label: `${option.charAt(0).toUpperCase() + option.slice(1)}`,
-        value: option,
-        checked: settings.groupBy === option
-      };
-    });
-    make_radios({
-      holder: optionsDiv,
-      styles: { display: "inline-block" },
-      options,
-      callback: async (value) => {
-        await this.sc.app.dispatch({
-          type: "plot_edit",
-          id: this.sc.id,
-          config: { settings: { sc: { ...settings, groupBy: value } } }
-        });
-      }
-    });
-  }
-  async update(settings, data, activeSubplots, tableData, subplotManager) {
-    if (!this.sampleTableRenderer) {
-      this.sampleTableRenderer = new SampleTableRenderer(this.dom, this.interactions, tableData);
-    } else {
-      this.sampleTableRenderer.updateTable(tableData);
-    }
-    this.plotBtns.update(settings, data);
-    await this.sectionRenderer.update(
-      this.sc,
-      activeSubplots.map((s) => s.subplot),
-      settings.sc.groupBy
-    );
-    const activeSandboxes = subplotManager.getSampleSandboxes();
-    this.groupsWrapper.style("display", activeSandboxes.size > 1 ? "inline-block" : "none");
-    this.sampleTableRenderer.updatePlotBtns(activeSandboxes);
-  }
-};
-
-// plots/sc/settings/defaults.ts
-function getDefaultSCAppSettings(overrides = {}, app) {
-  const defaults = {
-    sc: {
-      columns: {
-        sample: "Sample"
-      },
-      item: void 0,
-      groupBy: "sample"
-    },
-    hierCluster: {
-      unit: getGEunit(app.vocabApi),
-      yDendrogramHeight: 0,
-      clusterSamples: false
-    }
-  };
-  return Object.assign(defaults, overrides);
-}
-
-// plots/sc/subplots/DynamicSubplot.ts
-var DynamicSubplot = class _DynamicSubplot {
-  constructor(opts) {
-    this.dom = {};
-    this.type = _DynamicSubplot.type;
-    this.opts = opts;
-    this.app = opts.app;
-    this.parentId = opts?.parentId;
-  }
-  static {
-    this.type = "dynamicSubplot";
-  }
-  async init() {
-    this.opts.holder.app_div.attr("data-testid", "sjpp-sc-subplot-sandbox-" + this.opts.chartType);
-    if (this.opts.chartType == "summary") return;
-    this.dom = {
-      holder: this.opts.holder,
-      viz: this.opts.holder.body.append("div").style("position", "relative"),
-      paneTitleDiv: this.opts.holder.header.append("div").style("position", "relative"),
-      filterDiv: this.opts.holder.header.append("div").style("position", "relative"),
-      errorDiv: this.opts.holder.body.append("div").style("position", "relative")
-    };
-  }
-  getState(appState) {
-    const config = appState.plots.find((p) => p.id === this.id);
-    if (!config) {
-      throw `No plot with id='${this.id}' found. Did you set this.id before this.api = getComponentApi(this)?`;
-    }
-    return {
-      config
-    };
-  }
-  async main() {
-    if (!this.components) await this.setComponents();
-  }
-  async setComponents() {
-    const _ = await importPlot(this.opts.chartType);
-    const chartOpts = {
-      app: this.app,
-      id: this.id,
-      parentId: this.parentId
-    };
-    if (this.opts.chartType == "summary") {
-      chartOpts.holder = this.opts.holder;
-      chartOpts.hidePlotFilter = this.opts.isMetaResult;
-    } else {
-      chartOpts.holder = this.dom.viz;
-      chartOpts.header = this.dom.paneTitleDiv;
-    }
-    const promises = {
-      chart: _.componentInit(chartOpts)
-    };
-    if (!this.state.config?.hidePlotFilter && this.opts.isMetaResult && this.opts.chartType != "summary") {
-      promises.filter = filterRxCompInit({
-        app: this.app,
-        vocabApi: this.app.vocabApi,
-        parentId: this.id,
-        holder: this.dom.filterDiv,
-        hideLabel: true,
-        emptyLabel: "+Add new filter",
-        callback: (filter) => {
-          this.app.dispatch({
-            id: this.id,
-            type: "plot_edit",
-            config: { filter }
-          });
-        }
-      });
-    }
-    this.components = await multiInit(promises);
-  }
-  destroy() {
-    const appDiv = this.dom?.holder?.app_div;
-    if (appDiv) {
-      appDiv.selectAll("*").remove();
-      appDiv.remove();
-    }
-    for (const key in this.dom) {
-      delete this.dom[key];
-    }
-  }
-};
-var dynamicSubplotInit = getCompInit(DynamicSubplot);
-
-// plots/sc/subplots/SubplotManager.ts
-var SubplotManager = class {
-  constructor(sc) {
-    this.sc = sc;
-    this.scCompPlots = this.sc.components.plots;
-    this.records = /* @__PURE__ */ new Map();
-  }
-  map(subplots) {
-    const subplotIds = new Set(subplots.map((s) => s.id));
-    for (const compPlotId of Object.keys(this.scCompPlots)) {
-      if (!subplotIds.has(compPlotId)) {
-        this.removeSubplot(compPlotId);
-      }
-    }
-    for (const recordId of Array.from(this.records.keys())) {
-      if (!subplotIds.has(recordId)) this.records.delete(recordId);
-    }
-    for (const subplot of subplots) {
-      this.updateSubplotRecord(subplot);
-    }
-    return this.getActiveSubplotsFlat();
-  }
-  updateSubplotRecord(subplot) {
-    const existing = this.records.get(subplot.id);
-    const sampleId = this.getSampleId(subplot);
-    const isMeta = sampleId && this.sc.viewModel.metaResultIds.has(sampleId) || false;
-    this.records.set(subplot.id, {
-      plotId: subplot.id,
-      sampleId,
-      plotName: this.getPlotName(subplot),
-      sectionKey: existing?.sectionKey,
-      subplot,
-      sandboxDiv: existing?.sandboxDiv,
-      isMetaResult: isMeta
-    });
-  }
-  removeSubplot(subplotId) {
-    if (this.scCompPlots[subplotId]) this.scCompPlots[subplotId].destroy();
-    delete this.scCompPlots[subplotId];
-    this.records.delete(subplotId);
-  }
-  async initSubplotSandbox(sandboxHolder, subplot, initOpts = {}) {
-    const sandbox = newSandboxDiv(sandboxHolder, {
-      close: () => {
-        this.removeSubplot(subplot.id);
-        this.sc.app.dispatch({
-          type: "plot_delete",
-          id: subplot.id,
-          parentId: this.sc.id
-        });
-        if (initOpts.onClose) initOpts.onClose();
-      },
-      plotId: subplot.id
-    });
-    const subplotOpts = Object.assign({}, subplot, {
-      app: this.sc.app,
-      parentId: this.sc.id,
-      id: subplot.id,
-      holder: sandbox,
-      isMetaResult: this.records.get(subplot.id)?.isMetaResult || false
-    });
-    this.scCompPlots[subplot.id] = await dynamicSubplotInit(subplotOpts);
-    this.setSandbox(subplot.id, sandbox.app_div);
-    if (initOpts.sectionKey) this.setSectionKey(subplot.id, initOpts.sectionKey);
-    return sandbox.app_div;
-  }
-  setSandbox(plotId, sandboxDiv) {
-    const record = this.records.get(plotId);
-    if (!record) return;
-    record.sandboxDiv = sandboxDiv;
-    this.records.set(plotId, record);
-  }
-  setSectionKey(plotId, sectionKey) {
-    const record = this.records.get(plotId);
-    if (!record) return;
-    record.sectionKey = sectionKey;
-    this.records.set(plotId, record);
-  }
-  getActiveSubplotsFlat() {
-    return Array.from(this.records.values());
-  }
-  getSampleId(subplot) {
-    return subplot.sample?.sID || subplot.singleCellPlot?.sample?.sID || subplot.term?.term?.sample?.sID;
-  }
-  getPlotName(subplot) {
-    const nameOverrides = /* @__PURE__ */ new Map([
-      ["GeneExpInput", "Gene expression"],
-      ["imagePlot", subplot?.imgDir?.label || "Image"],
-      ["dictionary", "Summary"],
-      ["summary", "Summary"]
-    ]);
-    let plotName = subplot?.plotName || nameOverrides.get(subplot?.chartType) || subplot?.singleCellPlot?.name;
-    if (!plotName) {
-      if (subplot?.term?.term?.plot) plotName = subplot.term.term.plot;
-      else plotName = subplot.chartType || "Plot";
-    }
-    return plotName;
-  }
-  getSampleSandboxes(activeSubplots = this.getActiveSubplotsFlat()) {
-    const sandboxes = /* @__PURE__ */ new Map();
-    for (const active of activeSubplots) {
-      if (!active.sampleId || !active.sandboxDiv) continue;
-      if (!sandboxes.has(active.sampleId)) sandboxes.set(active.sampleId, []);
-      sandboxes.get(active.sampleId).push({ plotId: active.plotId, div: active.sandboxDiv, plotName: active.plotName });
-    }
-    return sandboxes;
-  }
-};
-
-// plots/sc/SC.ts
-var SCViewer = class _SCViewer extends PlotBase {
-  static {
-    this.type = "sc";
-  }
-  constructor(opts, api) {
-    super(opts, api);
-    this.type = _SCViewer.type;
-    this.components = {
-      plots: {}
-    };
-    const div = opts.holder.classed("sjpp-sc-main", true).append("div").style("padding", "5px").style("display", "inline-block").style("vertical-align", "top");
-    this.dom = {
-      div,
-      loading: opts.holder.append("div").attr("class", "sjpp-sc-main-loading").attr("data-testid", "sjpp-sc-main-loading").style("position", "absolute").style("top", "0").style("left", "0").style("width", "100%").style("height", "100%").style("background-color", "rgba(255, 255, 255, 0.95)").style("text-align", "center"),
-      controlsDiv: div.append("div").attr("id", "sjpp-sc-controls-btn"),
-      tableDiv: div.append("div").attr("id", "sjpp-sc-item-table"),
-      plotsBtnsDiv: div.append("div").attr("id", "sjpp-sc-plot-buttons").style("display", "none"),
-      sectionsDiv: div.append("div").attr("id", "sjpp-sc-sections")
-    };
-    if (opts.header) formatHeaderText({
-      header: opts.header,
-      chartType: "SINGLE CELL"
-    });
-  }
-  getState(appState) {
-    const config = appState.plots.find((p) => p.id === this.id);
-    if (!config) {
-      throw new Error(
-        `No plot with id='${this.id}' found. Did you set this.id before this.api = getComponentApi(this)?`
-      );
-    }
-    const termfilter = getCombinedTermFilter(appState, config.filter);
-    return {
-      config,
-      subplots: appState.plots.filter((p) => p.parentId === this.id),
-      termfilter,
-      termdbConfig: appState.termdbConfig,
-      vocab: appState.vocab
-    };
-  }
-  async init(appState) {
-    const state = this.getState(appState);
-    const dsScSamples = state.termdbConfig.queries?.singleCell?.samples;
-    this.model = new SCModel(this);
-    try {
-      this.itemColumns = await this.model.getColumnLabels(dsScSamples);
-    } catch (e) {
-      if (e instanceof Error) console.error(`${e.message || e} [SC init()]`);
-      else if (e.stack) console.log(e.stack);
-      throw new Error(e.message || e);
-    }
-    this.viewModel = new SCViewModel(this.app, this.itemColumns);
-    this.interactions = new SCInteractions(this);
-    this.subplotManager = new SubplotManager(this);
-    this.view = new SCViewRenderer(this);
-    this.view.render(state.config.settings.sc, state);
-  }
-  async main() {
-    if (!this.model) throw new Error(`Model not initialized`);
-    if (!this.viewModel) throw new Error(`ViewModel not initialized`);
-    if (!this.view) throw new Error(`View not initialized`);
-    if (!this.interactions) throw new Error(`Interactions not initialized`);
-    const state = structuredClone(this.state);
-    const config = state.config;
-    super.toggleLoadingDiv();
-    let data;
-    try {
-      const allSampleData = await this.model.getAllSampleData(state);
-      if (!allSampleData || allSampleData.error) {
-        super.toggleLoadingDiv("none");
-        super.printError(allSampleData?.error || "No samples found for this dataset");
-        return;
-      }
-      this.items = allSampleData.samples;
-      this.viewModel.processData(config, allSampleData.samples);
-      if (config.settings?.sc?.item) {
-        const sampleData = await this.model.getSampleData();
-        if (!sampleData || sampleData.error) {
-          super.toggleLoadingDiv("none");
-          super.printError(sampleData?.error || "No data found for this sample");
-          return;
-        }
-        const hasSpatial = await this.model.hasSpatialImage(config.settings.sc.item.sID);
-        data = this.viewModel.formatPlotsData(sampleData, hasSpatial);
-      }
-    } catch (e) {
-      if (e instanceof Error) console.error(`${e.message || e} [SC main()]`);
-      else if (e.stack) console.log(e.stack);
-      super.toggleLoadingDiv("none");
-      super.printError(e.message || e);
-      return;
-    }
-    const activeSubplots = this.subplotManager.map(state.subplots);
-    await this.view.update(config.settings, data, activeSubplots, this.viewModel.tableData, this.subplotManager);
-    super.toggleLoadingDiv("none");
-  }
-};
-var SCInit = getCompInit(SCViewer);
-var componentInit = SCInit;
-function getPlotConfig(opts, app) {
-  const config = {
-    chartType: "sc",
-    settings: getDefaultSCAppSettings(opts.overrides, app)
-  };
-  return copyMerge(config, opts);
-}
-export {
-  SCInit,
-  SCViewer,
-  componentInit,
-  getPlotConfig
-};
-//# sourceMappingURL=SC-W3M6IEDU.js.map