@sjcrh/proteinpaint-client 2.218.1-0 → 2.219.0

package/dist/genefusion.ui-W7K2DACF.js

@@ -0,0 +1,299 @@
+import {
+  makeBtn,
+  makeGenomeDropDown,
+  makeResetBtn,
+  makeTextAreaInput
+} from "./chunk-5EBRF6Z7.js";
+import {
+  Tabs,
+  appear,
+  sayerror
+} from "./chunk-FKQ47IUT.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-BTLVIRHK.js";
+import "./chunk-CNFTQSNE.js";
+import "./chunk-5IITQWZW.js";
+import "./chunk-TVJOSRCH.js";
+import "./chunk-3CIL7KH7.js";
+import "./chunk-T4XPCSLP.js";
+import "./chunk-ZVHBJALS.js";
+import "./chunk-W5J3LTYS.js";
+import "./chunk-VQJFP7XL.js";
+import "./chunk-YSCTMTVV.js";
+import "./chunk-GCGSIMMC.js";
+import "./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";
+
+// src/genefusion/genefusion.ui.js
+function init_geneFusionUI(holder, genomes) {
+  const wrapper = holder.append("div").style("margin", "20px 20px 20px 40px").style(
+    "font-family",
+    "'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif"
+  ).style("place-items", "center left").style("overflow", "hidden").classed("sjpp-app-ui", true);
+  const obj = {};
+  makeFusionInput(wrapper, obj);
+  const dropdown_div = wrapper.append("div").style("display", "flex").style("align-items", "center").style("margin", "10px");
+  genomeSelection(dropdown_div, genomes, obj);
+  makePositionDropDown(dropdown_div, obj);
+  const controlBtns_div = wrapper.append("div").style("display", "flex").style("align-items", "center").style("margin", "40px 0px 40px 130px");
+  makeSubmit(controlBtns_div, obj, holder, genomes);
+  makeResetBtn(controlBtns_div, obj, ".genefusion_input").style("margin", "0px 10px");
+  makeInfoSection(wrapper);
+  return obj;
+}
+function makeFusionInput(div, obj) {
+  const fusionInput = makeTextAreaInput({
+    div,
+    cols: 70,
+    // Increased to accommodate longer isoform format example
+    placeholder: "Example:\nPAX5,chr9,37002646,-::JAK2,chr9,5081726,+\nOr:\nPAX5,chr9,37002646,-,NM_016734::JAK2,chr9,5081726,+,NM_004972"
+  }).style("border", "1px solid rgb(138, 177, 212)").style("margin", "0px 0px 0px 20px").classed("genefusion_input", true).on("keyup", async () => {
+    obj.data = fusionInput.property("value").trim();
+  });
+}
+async function genomeSelection(div, genomes, obj) {
+  const genome_div = div.append("div").style("margin-left", "40px");
+  const g = makeGenomeDropDown(genome_div, genomes).style("border", "1px solid rgb(138, 177, 212)");
+  obj.genome = g.node();
+}
+async function makePositionDropDown(div, obj) {
+  const dropdown_div = div.append("div");
+  const positionSelect = dropdown_div.append("select").style("border-radius", "5px").style("padding", "5px 10px").style("margin", "1px 10px 1px 10px");
+  positionSelect.append("option").text("Codon position").property("value", "codon");
+  positionSelect.append("option").text("RNA position").property("value", "rna");
+  positionSelect.append("option").text("Genomic position").property("value", "genomic").attr("selected", true);
+  obj.posType = positionSelect.node();
+}
+function makeSubmit(div, obj, holder) {
+  const submit = makeBtn({
+    div,
+    text: "Submit"
+  });
+  const errorMessage_div = div.append("div");
+  submit.style("display", "block").on("click", () => {
+    if (!obj.data || obj.data === void 0) {
+      const sayerrorDiv = errorMessage_div.append("div").style("display", "inline-block").style("max-width", "20vw");
+      sayerror(sayerrorDiv, "Please provide data");
+      setTimeout(() => sayerrorDiv.remove(), 3e3);
+    } else {
+      select_default(".sjpp-app-ui").remove();
+      const runpp_arg = {
+        /** Do not use window.location.origin. See comment: line 180, renderContent(), client/appdrawer/adSandbox.js*/
+        host: sessionStorage.getItem("hostURL"),
+        nobox: true,
+        noheader: true,
+        parseurl: false,
+        genome: obj.genome.options[obj.genome.selectedIndex].text
+      };
+      makeSubmitResult(obj, holder, runpp_arg);
+    }
+  });
+}
+function makeInfoSection(div) {
+  div.append("div").style("margin", "10px").style("opacity", "0.65").html(`Limited to two-gene fusion products.<br>
+		One product per line.<br>
+		<br>
+		<strong>Format 1 (Basic):</strong> Each line has eight fields, four fields for each gene. For each gene join the following fields separated by a comma:
+		<ol><li>Gene symbol</li>
+		<li>Chromosome</li>
+		<li>Position, 1-based coordinate</li>
+		<li>Strand</li>
+		</ol>
+		<strong>Format 2 (With RefSeq isoforms):</strong> Each line has ten fields, five fields for each gene. For each gene join the following fields separated by a comma:
+		<ol><li>Gene symbol</li>
+		<li>Chromosome</li>
+		<li>Position, 1-based coordinate</li>
+		<li>Strand</li>
+		<li>RefSeq isoform (e.g., NM_001754)</li>
+		</ol>
+		Separate the two genes by a double colon (::). <br><br>
+		Examples: <br>
+		<p style="margin-left: 10px">
+		<strong>Format 1:</strong><br>
+		PAX5,chr9,37002646,-::JAK2,chr9,5081726,+<br>
+		ZCCHC7,chr9,37257786,-::PAX5,chr9,37024824,-<br>
+		BCR,chr22,23524427,+::ABL1,chr9,133729449,+<br><br>
+		<strong>Format 2:</strong><br>
+		RUNX1,chr21,36206706,-,NM_001754::MECOM,chr3,169099311,-,NM_004991<br>
+		PAX5,chr9,37002646,-,NM_016734::JAK2,chr9,5081726,+,NM_004972<p>`);
+}
+function validatePosition(position, geneName) {
+  if (!/^\d+$/.test(position)) {
+    throw new Error(`Invalid fusion format: position for ${geneName} must be a positive integer`);
+  }
+  const pos = Number(position);
+  if (pos <= 0) {
+    throw new Error(`Invalid fusion format: position for ${geneName} must be greater than 0 (1-based coordinates)`);
+  }
+}
+function parseFusionLine(line) {
+  const parts = line.trim().split("::");
+  if (parts.length !== 2) {
+    throw new Error('Invalid fusion format: must contain exactly two genes separated by "::"');
+  }
+  const gene1 = parts[0].split(",").map((s) => s.trim());
+  const gene2 = parts[1].split(",").map((s) => s.trim());
+  if (gene1.length !== 4 && gene1.length !== 5 || gene2.length !== 4 && gene2.length !== 5) {
+    throw new Error(
+      `Invalid fusion format: each gene must have 4 or 5 fields. Found gene1: ${gene1.length} fields, gene2: ${gene2.length} fields`
+    );
+  }
+  for (let i = 0; i < 4; i++) {
+    if (!gene1[i] || !gene2[i]) {
+      throw new Error("Invalid fusion format: gene symbol, chromosome, position, and strand are required");
+    }
+  }
+  validatePosition(gene1[2], gene1[0]);
+  validatePosition(gene2[2], gene2[0]);
+  if (!/^[+-]$/.test(gene1[3]) || !/^[+-]$/.test(gene2[3])) {
+    throw new Error('Invalid fusion format: strand must be "+" or "-"');
+  }
+  return [gene1, gene2];
+}
+function createFusionVariant(gene1, gene2) {
+  const variant = {
+    gene1: gene1[0],
+    chr1: gene1[1],
+    pos1: parseInt(gene1[2]) - 1,
+    strand1: gene1[3],
+    gene2: gene2[0],
+    chr2: gene2[1],
+    pos2: parseInt(gene2[2]) - 1,
+    strand2: gene2[3],
+    dt: 2,
+    class: "Fuserna"
+  };
+  const addIsoformIfPresent = (gene, fieldName) => {
+    if (gene.length > 4 && gene[4]?.trim()) {
+      variant[fieldName] = gene[4].trim();
+    }
+  };
+  addIsoformIfPresent(gene1, "isoform1");
+  addIsoformIfPresent(gene2, "isoform2");
+  return variant;
+}
+function makeSubmitResult(obj, div, runpp_arg) {
+  const lines = obj.data.split(/[\r\n]/).filter((line) => line.trim().length > 0);
+  if (lines.length === 1) {
+    try {
+      const [gene1, gene2] = parseFusionLine(lines[0]);
+      return makeFusionTabs(div, runpp_arg, gene1, gene2);
+    } catch (error) {
+      const errorDiv = div.append("div").style("color", "red").style("margin", "20px");
+      sayerror(errorDiv, `Error parsing fusion: ${error.message}`);
+      return;
+    }
+  }
+  const fusionSelect = div.append("div").append("select").style("border-radius", "5px").style("padding", "5px 10px").style("margin", "1px 10px 1px 10px");
+  fusionSelect.append("option").text(`Select Fusion (${lines.length})`);
+  const tabsDiv = div.append("div").style("margin", "20px");
+  const fusionsMap = /* @__PURE__ */ new Map();
+  for (const data of lines) {
+    try {
+      const [gene1, gene2] = parseFusionLine(data);
+      fusionsMap.set(`${gene1[0]}-${gene2[0]}`, [gene1, gene2]);
+    } catch (error) {
+      console.warn(`Skipping invalid fusion line: ${data}. Error: ${error.message}`);
+    }
+  }
+  if (fusionsMap.size === 0) {
+    const errorDiv = div.append("div").style("color", "red").style("margin", "20px");
+    sayerror(errorDiv, "No valid fusion lines found. Please check the format.");
+    return;
+  }
+  for (const fusion of fusionsMap) {
+    fusionSelect.append("option").property("value", fusion[0]).text(fusion[0]);
+  }
+  fusionSelect.on("change", () => {
+    tabsDiv.selectAll("*").remove();
+    const geneArrays = fusionsMap.get(fusionSelect.property("value"));
+    makeFusionTabs(tabsDiv, runpp_arg, geneArrays[0], geneArrays[1]);
+  });
+}
+function makeFusionTabs(div, runpp_arg, gene1, gene2) {
+  const tabs = [
+    // {
+    // ************ Keep for later, will introduce gene fusion view once data format settled *************
+    // 	label: 'Fusion',
+    // 	callback: async div => {
+    // 		if (!tabs[0].rendered) {
+    // 			appear(div)
+    // 			const text = `${gene1[0]}, ${gene1[1]},${gene1[2]},${gene2[0]},${gene2[1]},${gene2[2]}`
+    // 			const runpp_arg = {
+    // 				holder: div
+    // 					.append('div')
+    // 					.style('margin', '20px')
+    // 					.node(),
+    // 				host: window.location.origin,
+    // 				nobox: true,
+    // 				noheader: true,
+    // 				parseurl: false,
+    // 				genome,
+    // 				genefusion: {
+    // 					text,
+    // 					positionType: posType
+    // 					}
+    // 				}
+    // 			console.log(runpp_arg)
+    // 			runproteinpaint(Object.assign(runpp_arg))
+    // 			tabs[0].rendered = true
+    // 		}
+    // 	}
+    // },
+    {
+      label: gene1[0],
+      callback: async (event, tab) => {
+        appear(tab.contentHolder);
+        const variant = createFusionVariant(gene1, gene2);
+        const fusion_arg = {
+          holder: tab.contentHolder.append("div").style("margin", "20px").node(),
+          gene: gene1[0],
+          tracks: [
+            {
+              type: "mds3",
+              name: gene1[0],
+              custom_variants: [variant]
+            }
+          ]
+        };
+        runproteinpaint(Object.assign(runpp_arg, fusion_arg));
+        delete tab.callback;
+      }
+    },
+    {
+      label: gene2[0],
+      callback: async (event, tab) => {
+        appear(tab.contentHolder);
+        const variant = createFusionVariant(gene1, gene2);
+        const fusion_arg = {
+          holder: tab.contentHolder.append("div").style("margin", "20px").node(),
+          gene: gene2[0],
+          tracks: [
+            {
+              type: "mds3",
+              name: gene2[0],
+              custom_variants: [variant]
+            }
+          ]
+        };
+        runproteinpaint(Object.assign(runpp_arg, fusion_arg));
+        delete tab.callback;
+      }
+    }
+  ];
+  new Tabs({ holder: div, tabs }).main();
+}
+export {
+  init_geneFusionUI,
+  parseFusionLine
+};
+//# sourceMappingURL=genefusion.ui-W7K2DACF.js.map

package/dist/geneset-VHT6QTQ6.js

@@ -0,0 +1,199 @@
+import {
+  GeneSetEditUIwithTabs,
+  fillTermWrapper
+} from "./chunk-FKQ47IUT.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-BTLVIRHK.js";
+import "./chunk-CNFTQSNE.js";
+import "./chunk-5IITQWZW.js";
+import "./chunk-TVJOSRCH.js";
+import "./chunk-3CIL7KH7.js";
+import "./chunk-T4XPCSLP.js";
+import {
+  dofetch3
+} from "./chunk-ZVHBJALS.js";
+import "./chunk-W5J3LTYS.js";
+import "./chunk-VQJFP7XL.js";
+import "./chunk-YSCTMTVV.js";
+import "./chunk-GCGSIMMC.js";
+import {
+  copyMerge,
+  getCompInit
+} 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 "./chunk-I6Y4O3RR.js";
+import "./chunk-Q5RDQNIT.js";
+import "./chunk-HS5PO5ZQ.js";
+
+// plots/geneset.js
+var GenesetComp = class _GenesetComp {
+  static type = "geneset";
+  // type: 'geneset'
+  // dom: {
+  // 	[domKey: string]: any // usually a d3-selection
+  // }
+  // opts: {
+  // 	holder: any
+  // 	genes: string[]
+  // 	mode: 'geneVariant' | 'geneExpression'
+  // 	callback: CallbackArg
+  // 	reactsTo?: (action: any) => boolean
+  // 	showWaitMessage?: (waitDiv: any) => void
+  // }
+  constructor(opts) {
+    this.type = _GenesetComp.type;
+    this.dom = {
+      holder: opts.holder.style("position", "relative").style("min-height", "300px").style("margin", "0px 20px").style("max-width", "1000px"),
+      body: opts.holder.append("div"),
+      loadingOverlay: opts.holder.append("div").attr("class", "sjpp-spinner").style("display", "none").style("position", "absolute").style("background-color", "#fff").style("z-index", 10).style("opacity", "0.5")
+      //.style('width', '100%')
+      //.style('height', '100%')
+    };
+  }
+  init() {
+    if (this.opts.reactsTo) this.reactsTo = this.opts.reactsTo;
+  }
+  getState(appState) {
+    const config = appState.plots.find((p) => p.id === this.id);
+    return {
+      vocab: appState.vocab,
+      filter0: appState.termfilter.filter0,
+      config
+    };
+  }
+  async main() {
+    this.dom.body.selectAll("*").remove();
+    this.dom.loadingOverlay.style("display", "");
+    this.noWait().catch(console.warn);
+  }
+  async noWait() {
+    const abortCtrl = new AbortController();
+    try {
+      const [genes, stale] = await this.api.detectStale(() => this.getGenes({ signal: abortCtrl.signal }), {
+        abortCtrl
+      });
+      if (stale) return;
+      if (!genes?.length) this.render();
+      else this.opts.callback(this.api, genes);
+    } catch (e) {
+      if (e == "stale sequenceId" || e.name == "AbortError") return;
+      if (e?.code === "CACHE_BUSY" && this.opts.showWaitMessage) {
+        if (window.confirm(e.message || String(e))) this.main();
+        return;
+      }
+      if (this.opts.showWaitMessage) {
+        this.dom.body.style("margin", "20px").html(e);
+      }
+      throw e;
+    }
+  }
+  async getGenes({ signal }) {
+    const genes = this.opts.genes;
+    const settings = this.state.config.settings;
+    if (this.opts.genes) {
+      if (!Array.isArray(this.opts.genes) || this.opts.genes.length == 0) throw ".genes[] is not non-empty array";
+      return await this.getTwLst(this.opts.genes);
+    }
+    if (this.opts.showEditUI) {
+      return [];
+    }
+    let waitDiv;
+    if (this.opts.showWaitMessage) {
+      waitDiv = this.dom.body.append("div").style("margin", "20px");
+      this.opts.showWaitMessage(waitDiv);
+    }
+    let data;
+    if (this.opts.mode == "geneVariant") {
+      const body = {
+        genome: this.state.vocab.genome,
+        dslabel: this.state.vocab.dslabel
+      };
+      if (settings.maxGenes) body.maxGenes = settings.maxGenes;
+      if (settings.geneFilter) body.geneFilter = settings.geneFilter;
+      if (this.state.filter0) body.filter0 = this.state.filter0;
+      data = await dofetch3("termdb/topMutatedGenes", { body, signal });
+    } else if (this.opts.mode == "geneExpression") {
+      const body = {
+        genome: this.state.vocab.genome,
+        dslabel: this.state.vocab.dslabel,
+        maxGenes: settings.maxGenes
+      };
+      if (this.state.filter0) body.filter0 = this.state.filter0;
+      data = await dofetch3("termdb/topVariablyExpressedGenes", { body, signal });
+    } else {
+      throw "unknown opts.mode [geneset.js]";
+    }
+    if (!data) throw "invalid server response";
+    if (data.error) {
+      if (data.status === 429) throw Object.assign(new Error(data.error), { code: "CACHE_BUSY" });
+      throw data.error;
+    }
+    if (!data.genes) return [];
+    waitDiv.remove();
+    this.dom.loadingOverlay?.style("display", "none");
+    return await this.getTwLst(data.genes);
+  }
+  async getTwLst(genes) {
+    return await Promise.all(
+      // do tempfix of "data.genes.slice(0,3).map" for faster testing
+      genes.map(
+        async (i) => typeof i == "string" ? await fillTermWrapper({ term: { gene: i, type: this.opts.mode } }, this.app.vocabApi) : await fillTermWrapper({ term: { gene: i.gene || i.name, type: this.opts.mode } }, this.app.vocabApi)
+      )
+    );
+  }
+  async render() {
+    if (!this.dom?.holder) return;
+    const settings = this.state.config.settings;
+    this.dom.body.append("p").html(
+      `Define a gene set to launch <span style='text-transform: capitalize'>${this.state.config.toolName.toLowerCase()}</span>.`
+    );
+    new GeneSetEditUIwithTabs(
+      {
+        holder: this.dom.body.append("div"),
+        genome: this.opts.genome,
+        mode: this.opts.mode,
+        vocabApi: this.app.vocabApi,
+        //  await vocabInit({ state: { genome: gdcGenome, dslabel: gdcDslabel } }),
+        maxNumGenes: settings.maxGenes,
+        callback: async (result) => {
+          const twlst = await Promise.all(
+            result.geneList.map(async (i) => {
+              return fillTermWrapper({ term: { gene: i.gene || i.name || i, type: this.opts.mode } }, this.app.vocabApi);
+            })
+          );
+          this.opts.callback(this.api, twlst);
+        }
+      }
+      /*as GeneSetEditArg*/
+    );
+    this.dom.loadingOverlay?.style("display", "none");
+  }
+  destroy() {
+    this.dom.holder.selectAll("*").remove();
+    this.dom.holder.remove();
+    for (const key in this.dom) {
+      delete this.dom[key];
+    }
+  }
+};
+var genesetInit = getCompInit(GenesetComp);
+var componentInit = genesetInit;
+async function getPlotConfig(opts = {}, app) {
+  const config = copyMerge(
+    {
+      chartType: "geneset"
+    },
+    opts
+  );
+  return config;
+}
+export {
+  componentInit,
+  genesetInit,
+  getPlotConfig
+};
+//# sourceMappingURL=geneset-VHT6QTQ6.js.map