@sjcrh/proteinpaint-client 2.210.0 → 2.210.1

package/dist/chunk-PUSSP76H.js

@@ -0,0 +1,70 @@
+import {
+  junctionCustomTermSource
+} from "./chunk-Q3PAXUCU.js";
+import {
+  mayRenderFractionSelection
+} from "./chunk-CSAS3PVJ.js";
+
+// termdb/handlers/junction.ts
+var SearchHandler = class {
+  async init(opts) {
+    if (!opts?.holder) throw new Error("opts.holder is required");
+    if (typeof opts.callback != "function") throw new Error("opts.callback is required");
+    const entries = getJunctionCustomTerms(opts.app.vocabApi.state?.customTerms);
+    render(opts, entries);
+  }
+};
+function getJunctionCustomTerms(customTerms) {
+  if (!Array.isArray(customTerms)) return [];
+  return customTerms.filter((term) => term?.source === junctionCustomTermSource && term.tw?.term);
+}
+function render(opts, entries) {
+  const holder = opts.holder;
+  holder.selectAll("*").remove();
+  const div = holder.append("div").style("padding", "10px 0px");
+  if (!entries.length) {
+    div.append("div").text("Junctions selected from genome browser will be shown here.");
+    return;
+  }
+  const listDiv = div.append("div");
+  const fractionDiv = div.append("div");
+  for (const entry of entries) {
+    if (entry.eventlabel) renderJunctionEvent(listDiv, fractionDiv, entry, opts);
+    else renderJunction(listDiv, entry, opts);
+  }
+  listDiv.append("div").style("font-size", ".7em").style("margin-top", "10px").style("opacity", 0.7).text("Select additional junctions from genome browser.");
+}
+function renderJunction(holder, entry, opts) {
+  const choice = holder.append("div");
+  choice.append("div").attr("class", "ts_pill sja_filter_tag_btn sja_tree_click_term").style("display", "inline-block").style("border-radius", "6px").style("margin", "1px 0").text(entry.tw.term.name).on("click", () => opts.callback(entry.tw.term));
+  addDeleteButton(choice, entry, opts);
+}
+function renderJunctionEvent(holder, fractionDiv, entry, opts) {
+  const eventHolder = holder.append("div");
+  const pillRow = eventHolder.append("div");
+  pillRow.append("div").attr("class", "ts_pill sja_filter_tag_btn sja_tree_click_term").style("display", "inline-block").style("border-radius", "6px").style("margin", "1px 0").text(entry.eventlabel).on("click", () => selectJunctionEvent(holder, fractionDiv, entry, opts));
+  addDeleteButton(pillRow, entry, opts);
+  eventHolder.append("div").style("margin-left", "10px").style("font-size", ".7em").selectAll("div").data(entry.tw.term.termlst, (term) => term.id).enter().append("div").text((term) => term.name);
+}
+function selectJunctionEvent(listDiv, fractionDiv, entry, opts) {
+  const isStaged = mayRenderFractionSelection({
+    term: entry.tw.term,
+    selectionMode: opts.termCollectionSelectionMode,
+    listDiv,
+    fractionDiv,
+    callback: (tw) => opts.callback(tw)
+  });
+  if (!isStaged) opts.callback(entry.tw.term);
+}
+function addDeleteButton(holder, entry, opts) {
+  holder.append("button").attr("data-testid", "sjpp-junction-delete").style("margin-left", "4px").attr("aria-label", `Delete ${entry.name}`).text("\xD7").on("click", async () => {
+    await opts.app.vocabApi.deleteCustomTermById(entry.id);
+    render(opts, getJunctionCustomTerms(opts.app.vocabApi.state?.customTerms));
+  });
+}
+
+export {
+  SearchHandler,
+  getJunctionCustomTerms
+};
+//# sourceMappingURL=chunk-PUSSP76H.js.map

package/dist/chunk-Q3PAXUCU.js

@@ -0,0 +1,54 @@
+import {
+  getColors
+} from "./chunk-UYKJOBRO.js";
+
+// termdb/handlers/junction.customTerm.ts
+var junctionCustomTermSource = "junction";
+function makeJunctionCustomTerm(junctions, eventlabel) {
+  if (!junctions.length) throw new Error("junctions[] is empty");
+  if (!eventlabel) {
+    const term = junctions[0];
+    return {
+      id: `junction:${term.id}`,
+      name: term.name,
+      source: junctionCustomTermSource,
+      tw: {
+        term,
+        q: { mode: "continuous" }
+      }
+    };
+  }
+  const termlst = [...new Map(junctions.map((term) => [term.id, term])).values()];
+  const colorScale = getColors(termlst.length);
+  const termIds = termlst.map((term) => term.id);
+  return {
+    id: `junction-event:${eventlabel}`,
+    name: eventlabel,
+    source: junctionCustomTermSource,
+    eventlabel,
+    tw: {
+      term: {
+        type: "termCollection",
+        isCustom: true,
+        memberType: "numeric",
+        name: eventlabel,
+        termIds,
+        termlst,
+        propsByTermId: Object.fromEntries(termlst.map((term) => [term.id, { color: colorScale(term.id) }])),
+        isleaf: true
+      },
+      q: {
+        mode: "continuous",
+        type: "values",
+        lst: termIds,
+        numerators: termIds
+      }
+    }
+  };
+}
+
+export {
+  junctionCustomTermSource,
+  makeJunctionCustomTerm
+};
+//# sourceMappingURL=chunk-Q3PAXUCU.js.map

package/dist/chunk-QWBKN2IC.js

@@ -0,0 +1,80 @@
+import {
+  addGeneSearchbox,
+  getGEunit,
+  getSampleTypeLabelByTerms,
+  getSelectedSampleTypes,
+  getSelectedSampleTypesByTerms,
+  renderSampleTypeSelect,
+  renderSampleTypesByTermsSelect,
+  table2col
+} from "./chunk-CSAS3PVJ.js";
+import {
+  Menu
+} from "./chunk-ELJX3QIQ.js";
+import {
+  TermTypes
+} from "./chunk-UYKJOBRO.js";
+
+// termdb/handlers/geneExpression.ts
+var SearchHandler = class {
+  init(opts) {
+    this.callback = opts.callback;
+    this.app = opts.app;
+    this.dom = {};
+    const holder = opts.holder.append("div").style("padding", "10px 0px");
+    this.dom.sampleTypeDiv = holder.append("div");
+    this.mayRenderSampleTypeSelect();
+    const geneSearch = addGeneSearchbox({
+      tip: new Menu({ padding: "0px" }),
+      genome: opts.genomeObj,
+      row: holder,
+      searchOnly: "gene",
+      callback: () => this.selectGene(geneSearch)
+    });
+    holder.select(".sja_genesearchinput").style("margin", "0px");
+  }
+  mayRenderSampleTypeSelect() {
+    this.dom.sampleTypeDiv.selectAll("*").remove();
+    this.querySampleTypes = this.app.vocabApi.termdbConfig?.queries.geneExpression.sampleTypes;
+    this.querySampleTypesByTerms = this.app.vocabApi.termdbConfig?.queries.geneExpression.sampleTypesByTerms;
+    if (Array.isArray(this.querySampleTypes) && this.querySampleTypes.length >= 2 || this.querySampleTypesByTerms) {
+      const table = table2col({ holder: this.dom.sampleTypeDiv, margin: "0px 0px 15px 0px" });
+      const [td1, td2] = table.addRow();
+      td1.text("Sample Type");
+      td2.style("padding-left", "10px");
+      if (this.querySampleTypesByTerms) {
+        this.sampleTypeSelect = renderSampleTypesByTermsSelect(
+          td2,
+          this.querySampleTypesByTerms,
+          this.app.vocabApi.termdbConfig
+        );
+      } else {
+        this.sampleTypeSelect = renderSampleTypeSelect(td2, this.querySampleTypes, this.app.vocabApi.termdbConfig);
+      }
+    }
+  }
+  async selectGene(geneSearch) {
+    const gene = geneSearch?.geneSymbol;
+    if (!gene) throw new Error("No gene selected");
+    const sampleTypes = this.querySampleTypesByTerms ? getSelectedSampleTypesByTerms(this.sampleTypeSelect, this.querySampleTypesByTerms) : getSelectedSampleTypes(this.sampleTypeSelect) || this.querySampleTypes;
+    if (this.sampleTypeSelect && !sampleTypes?.length) {
+      return;
+    }
+    const unit = getGEunit(this.app.vocabApi);
+    const name = `${gene} ${unit}`;
+    const term = { gene, name, type: TermTypes.GENE_EXPRESSION, sampleTypes };
+    if (this.querySampleTypesByTerms) {
+      const sampleTypeLabel = getSampleTypeLabelByTerms(this.sampleTypeSelect);
+      if (sampleTypeLabel) {
+        term.sampleTypeLabel = sampleTypeLabel;
+        term.name += ` (${sampleTypeLabel})`;
+      }
+    }
+    this.callback(term);
+  }
+};
+
+export {
+  SearchHandler
+};
+//# sourceMappingURL=chunk-QWBKN2IC.js.map

package/dist/chunk-R4E7BXC6.js

@@ -0,0 +1,49 @@
+import {
+  runproteinpaint
+} from "./chunk-3QL3U6FU.js";
+
+// test/front.helpers.js
+var serverData = /* @__PURE__ */ Object.create(null);
+function getRunPp(appname = "", defaultArgs = {}, _host = "http://localhost:3000") {
+  const host = window.testHost || _host;
+  const arg = {
+    host: window.testHost || _host,
+    noheader: 1,
+    nobox: true,
+    debug: 1,
+    norecover: true
+  };
+  if (appname == "mass" || appname == "termdb") {
+    defaultArgs.debounceInterval = 0;
+  }
+  if (appname) arg[appname] = defaultArgs;
+  else copyMerge(arg, defaultArgs);
+  const argStr = JSON.stringify(arg);
+  return function runpp(overrides = {}) {
+    const argCopy = JSON.parse(argStr);
+    if (appname) copyMerge(argCopy[appname], overrides);
+    else copyMerge(argCopy, overrides);
+    if (appname && defaultArgs.fetchOpts) {
+      argCopy[appname].fetchOpts = defaultArgs.fetchOpts;
+    }
+    return runproteinpaint(Object.assign(argCopy, { serverData }));
+  };
+}
+function copyMerge(base, ...args) {
+  const target = typeof base == "string" ? JSON.parse(base) : base;
+  for (const arg of args) {
+    if (arg) {
+      const source = typeof base == "string" ? JSON.parse(JSON.stringify(arg)) : arg;
+      for (const key in source) {
+        if (!target[key] || Array.isArray(target[key]) || typeof target[key] !== "object") target[key] = source[key];
+        else copyMerge(target[key], source[key]);
+      }
+    }
+  }
+  return target;
+}
+
+export {
+  getRunPp
+};
+//# sourceMappingURL=chunk-R4E7BXC6.js.map

package/dist/chunk-SDYFM3UL.js

@@ -0,0 +1,274 @@
+import {
+  termType2label
+} from "./chunk-4Y5W26UF.js";
+import {
+  TermTypes
+} from "./chunk-UYKJOBRO.js";
+import {
+  __export
+} from "./chunk-HS5PO5ZQ.js";
+
+// plots/matrix/hierCluster.renderers.js
+var hierCluster_renderers_exports = {};
+__export(hierCluster_renderers_exports, {
+  maySetSandboxHeader: () => maySetSandboxHeader,
+  plotDendrogramHclust: () => plotDendrogramHclust,
+  renderImage: () => renderImage
+});
+function maySetSandboxHeader(appState) {
+  if (!this.dom.header) return;
+  const dataType = this.config.dataType;
+  const headerText = this.config?.headerText ? `${this.config.headerText} ` : "";
+  let title;
+  if (this.config.preBuiltPlotTitle) {
+    title = this.config.preBuiltPlotTitle;
+  } else if (this.config.appName) {
+    title = `${headerText}${this.config.appName} Clustering`;
+  } else if (dataType == TermTypes.PROTEOME_ABUNDANCE) {
+    title = this.config.assayCohortTitle ? `Protein Abundance Clustering (${this.config.assayCohortTitle})` : "Protein Abundance Clustering";
+  } else {
+    title = `${headerText}${termType2label(dataType)} Clustering`;
+  }
+  this.dom.header.text(title);
+}
+function plotDendrogramHclust(plotOnly) {
+  const d = this.dimensions;
+  const s = this.config.settings.matrix;
+  const xOffset = d.seriesXoffset;
+  const pxr = window.devicePixelRatio <= 1 ? 1 : window.devicePixelRatio;
+  const obj = this.hierClusterData.clustering;
+  const row = obj.row;
+  const col = obj.col;
+  const rowHeight = this.settings.matrix.clusterRowh, { xDendrogramHeight, yDendrogramHeight } = this.settings.hierCluster, colWidth = this.dimensions.dx;
+  if (plotOnly !== "left") {
+    if (!this.settings.hierCluster.clusterSamples) {
+      this.dom.topDendrogram.selectAll("*").remove();
+    } else {
+      const height2px = getHclustHeightScalefactor(col.height, yDendrogramHeight);
+      const height = yDendrogramHeight + 1e-7;
+      const width = Math.min(colWidth * col.inputOrder.length, s.imgWMax);
+      if (width <= 0 || height <= 0) {
+        console.warn(
+          "Skipping top dendrogram render: invalid dimensions.",
+          "This may indicate a zoom feedback loop issue.",
+          {
+            width,
+            height,
+            colWidth,
+            sampleCount: col.inputOrder.length,
+            yDendrogramHeight
+          }
+        );
+        this.dom.topDendrogram.selectAll("*").remove();
+        return;
+      }
+      const canvas = new OffscreenCanvas(width * pxr, height * pxr);
+      const ctx = canvas.getContext("2d");
+      ctx.scale(pxr, pxr);
+      ctx.translate(-d.xMin, 0);
+      ctx.imageSmoothingEnabled = false;
+      ctx.imageSmoothingQuality = "high";
+      ctx.strokeStyle = "black";
+      const mergedClusters = /* @__PURE__ */ new Map();
+      for (const [clusterid0, pair] of col.merge.entries()) {
+        const clusterid = clusterid0 + 1;
+        const children = [];
+        const childrenClusters = [];
+        let x1, x2, y1, y2;
+        if (pair.n1 < 0) {
+          const [name, columnNumber] = getLeafNumber(pair.n1, col.inputOrder, col.order);
+          x1 = colWidth * (columnNumber + 0.5);
+          y1 = yDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n1)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n1);
+          x1 = c.x;
+          y1 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n1);
+        }
+        if (pair.n2 < 0) {
+          const [name, columnNumber] = getLeafNumber(pair.n2, col.inputOrder, col.order);
+          x2 = colWidth * (columnNumber + 0.5);
+          y2 = yDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n2)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n2);
+          x2 = c.x;
+          y2 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n2);
+        }
+        const clusterY = yDendrogramHeight - col.height[clusterid0].height * height2px;
+        const highlight = this.clickedClusterIds?.includes(clusterid);
+        ctx.strokeStyle = highlight ? "red" : "black";
+        ctx.beginPath();
+        ctx.moveTo(x1, y1);
+        ctx.lineTo(x1, clusterY);
+        ctx.lineTo(x2, clusterY);
+        ctx.lineTo(x2, y2);
+        ctx.stroke();
+        ctx.closePath();
+        mergedClusters.set(clusterid, {
+          x: (x1 + x2) / 2,
+          y: clusterY,
+          children,
+          childrenClusters,
+          clusterPosition: {
+            x1,
+            x2,
+            y1,
+            y2,
+            clusterY
+          }
+        });
+      }
+      this.renderImage(
+        this.api,
+        this.dom.topDendrogram,
+        canvas,
+        width,
+        height,
+        xDendrogramHeight + 0.5 * colWidth + d.xMin,
+        s.margin.top + s.scrollHeight
+      );
+      col.mergedClusters = mergedClusters;
+    }
+  }
+  if (plotOnly !== "top") {
+    if (!this.settings.hierCluster.clusterRows) {
+      this.dom.leftDendrogram.selectAll("*").remove();
+    } else {
+      const height2px = getHclustHeightScalefactor(row.height, xDendrogramHeight);
+      const width = xDendrogramHeight + 1e-7;
+      const height = rowHeight * row.inputOrder.length;
+      const canvasWidthPx = Number.isFinite(width) && Number.isFinite(pxr) ? Math.max(0, Math.floor(width * pxr)) : 0;
+      const canvasHeightPx = Number.isFinite(height) && Number.isFinite(pxr) ? Math.max(0, Math.floor(height * pxr)) : 0;
+      if (!Number.isFinite(width) || !Number.isFinite(height) || !Number.isFinite(pxr) || width <= 0 || height <= 0 || pxr <= 0 || canvasWidthPx < 1 || canvasHeightPx < 1) {
+        console.warn(
+          "Skipping left dendrogram render: invalid dimensions.",
+          "This may indicate a zoom feedback loop issue.",
+          {
+            width,
+            height,
+            pxr,
+            canvasWidthPx,
+            canvasHeightPx,
+            rowHeight,
+            termCount: row.inputOrder.length,
+            xDendrogramHeight
+          }
+        );
+        this.dom.leftDendrogram.selectAll("*").remove();
+        return;
+      }
+      const canvas = new OffscreenCanvas(canvasWidthPx, canvasHeightPx);
+      const ctx = canvas.getContext("2d");
+      ctx.scale(pxr, pxr);
+      ctx.imageSmoothingEnabled = false;
+      ctx.imageSmoothingQuality = "high";
+      ctx.strokeStyle = "black";
+      const mergedClusters = /* @__PURE__ */ new Map();
+      for (const [clusterid0, pair] of row.merge.entries()) {
+        const clusterid = clusterid0 + 1;
+        const children = [];
+        const childrenClusters = [];
+        let x1, x2, y1, y2;
+        if (pair.n1 < 0) {
+          const [name, rowNumber] = getLeafNumber(pair.n1, row.inputOrder, row.order);
+          y1 = rowHeight * (rowNumber + 0.5);
+          x1 = xDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n1)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n1);
+          x1 = c.x;
+          y1 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n1);
+        }
+        if (pair.n2 < 0) {
+          const [name, rowNumber] = getLeafNumber(pair.n2, row.inputOrder, row.order);
+          y2 = rowHeight * (rowNumber + 0.5);
+          x2 = xDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n2)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n2);
+          x2 = c.x;
+          y2 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n2);
+        }
+        const clusterX = xDendrogramHeight - row.height[clusterid0].height * height2px;
+        const highlight = this.clickedLeftClusterIds?.includes(clusterid);
+        ctx.strokeStyle = highlight ? "red" : "black";
+        ctx.beginPath();
+        ctx.moveTo(x1, y1);
+        ctx.lineTo(clusterX, y1);
+        ctx.lineTo(clusterX, y2);
+        ctx.lineTo(x2, y2);
+        ctx.stroke();
+        ctx.closePath();
+        mergedClusters.set(clusterid, {
+          x: clusterX,
+          y: (y1 + y2) / 2,
+          children,
+          childrenClusters,
+          clusterPosition: {
+            x1,
+            x2,
+            y1,
+            y2,
+            clusterX
+          }
+        });
+      }
+      const t = this.termOrder.find((t2) => t2.grp.type == "hierCluster" || t2.grp.name == this.hcTermGroup.name);
+      const y = (
+        // t.labelOffset is commented out because it is already handled in adjustSvgDimensions
+        t.grpIndex * s.rowgspace + t.prevGrpTotalIndex * s.rowh + t.totalHtAdjustments + s.margin.top + s.scrollHeight + // left dendrogram image must be lower than the top dendrogram image height
+        yDendrogramHeight
+      );
+      this.renderImage(this.api, this.dom.leftDendrogram, canvas, width, height, 0, y);
+      row.mergedClusters = mergedClusters;
+    }
+  }
+}
+async function renderImage(componentApi, g, canvas, width, height, x, y) {
+  const sequenceId = componentApi.getSequenceId();
+  const reader = new FileReader();
+  reader.addEventListener(
+    "load",
+    () => {
+      if (componentApi.isStaleSequenceId(sequenceId)) return;
+      g.selectAll("*").remove();
+      g.append("image").attr("x", x + 0.033).attr("y", y + 0.033).attr("xlink:href", reader.result).attr("width", width).attr("height", height);
+    },
+    false
+  );
+  const blob = await canvas.convertToBlob({ quality: 1 });
+  reader.readAsDataURL(blob);
+}
+function getHclustHeightScalefactor(lst, ph) {
+  let max = lst[0].height;
+  for (const h of lst) max = Math.max(max, h.height);
+  return ph / max;
+}
+function getLeafNumber(minus, inputOrder, order) {
+  const name = inputOrder[-minus - 1];
+  if (!name) throw "minus not in inputOrder";
+  const i = order.findIndex((j) => j.name == name);
+  if (i == -1) throw "name not found in hc$order";
+  return [name, i];
+}
+
+export {
+  maySetSandboxHeader,
+  plotDendrogramHclust,
+  renderImage,
+  hierCluster_renderers_exports
+};
+//# sourceMappingURL=chunk-SDYFM3UL.js.map