@sjcrh/proteinpaint-client 2.224.0 → 2.224.1

package/dist/chunk-L2H4W3UM.js

@@ -0,0 +1,237 @@
+import {
+  DataPointInteractions,
+  axisstyle,
+  createLollipopFromGene,
+  drawHoverShapes,
+  showResultsTable,
+  table2col,
+  to_svg
+} from "./chunk-3YQYWX4M.js";
+import {
+  Menu
+} from "./chunk-CNFTQSNE.js";
+import {
+  icons
+} from "./chunk-3CIL7KH7.js";
+import {
+  axisLeft
+} from "./chunk-WJLRU5OF.js";
+import {
+  linear
+} from "./chunk-4OLM3KSB.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+
+// plots/manhattan/manhattan.ts
+var manhattanLayoutDefaults = {
+  plotWidth: 1e3,
+  plotHeight: 400,
+  pngDotRadius: 2,
+  yAxisX: 70,
+  yAxisY: 40,
+  yAxisSpace: 20,
+  xAxisLabelPad: 30,
+  yAxisPad: 5,
+  axisColor: "#545454",
+  showYAxisLine: true,
+  fontSize: 12,
+  showLegend: true,
+  legendItemWidth: 80,
+  legendDotRadius: 3,
+  legendRightOffset: 15,
+  legendTextOffset: 12,
+  legendVerticalOffset: 4,
+  legendFontSize: 12,
+  showInteractiveDots: true,
+  interactiveDotRadius: 2,
+  interactiveDotStrokeWidth: 1,
+  showDownload: true,
+  interactiveDotsCap: 5e3,
+  maxTooltipGenes: 5
+};
+function plotManhattan(div, data, settings, app, custom = {}) {
+  const handle = { points: [], highlight: () => {
+  } };
+  settings = {
+    ...settings
+  };
+  let interactivePoints = data.plotData.points;
+  if (data.plotData.points.length > settings.interactiveDotsCap) {
+    interactivePoints = data.plotData.points.sort((a, b) => Math.abs(b.y) - Math.abs(a.y)).slice(0, settings.interactiveDotsCap);
+  }
+  const signed = data.plotData.y_min < 0;
+  div.style("position", "relative");
+  const geneTip = new Menu({ padding: "" });
+  const svg = div.append("svg").attr("data-testid", "sjpp-manhattan").attr("width", settings.plotWidth + 2 * settings.pngDotRadius + settings.yAxisX + settings.yAxisSpace).attr("height", settings.plotHeight + 2 * settings.pngDotRadius + settings.yAxisY * 4);
+  const yPlot = linear().domain([data.plotData.y_min, data.plotData.y_max]).range([settings.plotHeight + 2 * settings.pngDotRadius, 0]);
+  const yPad = data.plotData.y_pad ?? settings.pngDotRadius;
+  const yAxisLow = signed ? data.plotData.y_min + yPad : 0;
+  const yAxisScale = linear().domain([yAxisLow, data.plotData.y_max - yPad]).range([yPlot(yAxisLow), yPlot(data.plotData.y_max - yPad)]);
+  const axisG = svg.append("g").attr("transform", `translate(${settings.yAxisX + settings.yAxisSpace - settings.yAxisPad},${settings.yAxisY})`);
+  axisG.call(
+    axisLeft(yAxisScale).tickSizeOuter(0)
+    // removes top/bottom cap lines for clean look
+  );
+  axisstyle({
+    axis: axisG,
+    color: settings.axisColor,
+    fontsize: settings.fontSize + 2,
+    showline: settings.showYAxisLine
+  });
+  svg.append("text").attr("x", -((settings.plotHeight + 2 * settings.pngDotRadius) / 2) - settings.yAxisY).attr("y", settings.yAxisX / 2).attr("transform", "rotate(-90)").attr("text-anchor", "middle").attr("font-size", `${settings.fontSize + 4}px`).attr("fill", "black").text((custom.yAxisLabel ?? "-log\u2081\u2080(q-value)") + (data.plotData.has_capped_points ? " [capped]" : ""));
+  svg.append("image").attr("transform", `translate(${settings.yAxisX + settings.yAxisSpace},${settings.yAxisY})`).attr("width", settings.plotWidth + 2 * settings.pngDotRadius).attr("height", settings.plotHeight + 2 * settings.pngDotRadius).attr("href", `data:image/png;base64,${data.pngImg || data.png}`);
+  const xScale = linear().domain([-data.plotData.x_buffer, data.plotData.total_genome_length + data.plotData.x_buffer]).range([0, settings.plotWidth + 2 * settings.pngDotRadius]);
+  if (settings.showInteractiveDots && data.plotData.points && data.plotData.points.length > 0) {
+    const hoverLayer = svg.append("g").attr("transform", `translate(${settings.yAxisX + settings.yAxisSpace},${settings.yAxisY})`).style("pointer-events", "none");
+    const cover = select_default(svg.node().parentNode).append("div").style("position", "absolute").style("left", `${settings.yAxisX + settings.yAxisSpace}px`).style("top", `${settings.yAxisY}px`).style("width", `${settings.plotWidth + 2 * settings.pngDotRadius}px`).style("height", `${settings.plotHeight + 2 * settings.pngDotRadius}px`).style("pointer-events", "all");
+    const circlePath = (r) => `M${r},0 A${r},${r} 0 1,1 ${-r},0 A${r},${r} 0 1,1 ${r},0 Z`;
+    const linkedLayer = svg.append("g").attr("transform", `translate(${settings.yAxisX + settings.yAxisSpace},${settings.yAxisY})`).style("pointer-events", "none");
+    handle.points = interactivePoints;
+    handle.highlight = (dots) => drawHoverShapes(
+      linkedLayer,
+      dots.map((d) => ({
+        path: circlePath(settings.pngDotRadius + 2),
+        transform: `translate(${d.pixel_x},${d.pixel_y})`,
+        stroke: "black",
+        strokeWidth: 2
+      }))
+    );
+    const grin2Hover = (d, container) => {
+      const table = table2col({ holder: container.append("div"), margin: "10px" });
+      table.addRow("Gene", d.gene);
+      table.addRow("Position", `${d.chrom}:${d.start}-${d.end}`);
+      const [t1, t2] = table.addRow();
+      t1.text("Type");
+      t2.html(`<span style="color:${d.color}">\u25CF</span> ${d.type.charAt(0).toUpperCase() + d.type.slice(1)}`);
+      table.addRow("Q-value", d.q_value.toPrecision(3));
+      table.addRow("Subject count", d.nsubj);
+    };
+    const grin2Table = (dots) => ({
+      columns: [
+        { label: "Gene" },
+        { label: "Position" },
+        { label: "Type" },
+        { label: "Q-value", sortable: true },
+        { label: "Subject count", sortable: true }
+      ],
+      rows: dots.map((d) => [
+        { value: d.gene },
+        { value: `${d.chrom}:${d.start}-${d.end}` },
+        {
+          html: `<span style="color:${d.color}">\u25CF</span> ${d.type.charAt(0).toUpperCase() + d.type.slice(1)}`
+        },
+        { value: d.q_value.toPrecision(3) },
+        { value: d.nsubj }
+      ])
+    });
+    const interactions = new DataPointInteractions({
+      cover,
+      hoverLayer,
+      hoverTip: geneTip,
+      points: interactivePoints,
+      getX: (d) => d.pixel_x,
+      getY: (d) => d.pixel_y,
+      hitRadius: settings.pngDotRadius + 3,
+      toHoverSpec: (d) => ({
+        path: circlePath(settings.pngDotRadius),
+        transform: `translate(${d.pixel_x},${d.pixel_y})`,
+        fill: "none",
+        stroke: "black",
+        strokeWidth: settings.interactiveDotStrokeWidth
+      }),
+      maxTooltipRows: settings.maxTooltipGenes,
+      onHover: custom.onHover,
+      itemNoun: custom.itemNoun ?? "gene",
+      renderSingleHoverTooltip: custom.renderSingleHoverTooltip ?? grin2Hover,
+      buildMultiHitTableData: custom.buildMultiHitTableData ?? grin2Table,
+      // A caller with actions gets the module's standard click flow: an action menu for one
+      // dot, a pick-a-row menu for several. Without one, GRIN2's behaviour below.
+      ...custom.getActions ? {
+        getActions: custom.getActions,
+        renderSingleHitInfo: custom.renderSingleHitInfo ?? custom.renderSingleHoverTooltip,
+        getRowKey: custom.getRowKey
+      } : {
+        // Manhattan single-click goes straight to a lollipop launch — no menu.
+        // Release hover-suppression immediately so the cursor's next move re-engages.
+        onSingleClick: (d, _event, ctx) => {
+          ctx.dismiss();
+          if (app && d.gene) createLollipopFromGene(d.gene, app);
+        },
+        // Manhattan multi-click shows showResultsTable directly with `app + clickMenu`
+        // so the table renders inline Matrix/Lollipop buttons. Reuses the module's
+        // clickMenu so its onHide cleanup (clear flag, clear hover) fires on dismiss.
+        // Content is built BEFORE show2 so Menu can measure the populated rect for
+        // its right-edge clamp — otherwise the wide table is placed at cursor+offsetX
+        // and extends off the right edge of the viewport.
+        onMultiClick: (dots, event, ctx) => {
+          if (!app) {
+            ctx.dismiss();
+            return;
+          }
+          ctx.clickMenu.clear();
+          const holder = ctx.clickMenu.d.append("div").style("margin", "10px");
+          showResultsTable({ tableDiv: holder, hits: dots, app, clickMenu: ctx.clickMenu });
+          ctx.clickMenu.show2(event.clientX, event.clientY);
+        }
+      }
+    });
+    interactions.attach();
+  }
+  if (data.plotData.chrom_data) {
+    const chromLabelY = settings.plotHeight + 2 * settings.pngDotRadius + settings.yAxisY + 10;
+    Object.entries(data.plotData.chrom_data).forEach(([chrom, chromData]) => {
+      const chromLabel = chrom.replace("chr", "");
+      if (chromLabel === "M") return;
+      const centerPos = settings.yAxisX + settings.yAxisSpace + xScale(chromData.center);
+      svg.append("text").attr("x", centerPos).attr("y", chromLabelY).attr("text-anchor", "middle").attr("font-size", `${settings.fontSize + 2}px`).text(chromLabel);
+    });
+  }
+  svg.append("text").attr("x", settings.yAxisX + settings.yAxisSpace + (settings.plotWidth + 2 * settings.pngDotRadius) / 2).attr("y", settings.plotHeight + 2 * settings.pngDotRadius + settings.yAxisY + settings.xAxisLabelPad).attr("text-anchor", "middle").attr("font-size", `${settings.fontSize + 4}px`).attr("fill", "black").text("Chromosomes");
+  const title = svg.append("text").attr("x", settings.yAxisX + settings.yAxisSpace).attr("y", settings.yAxisY / 2).attr("font-weight", "bold").attr("font-size", `${settings.fontSize + 2}px`).text(custom.title ?? "Manhattan Plot");
+  const titleWidth = title.node().getBBox?.().width || 100;
+  if (settings.showDownload) {
+    const downloadDiv = div.append("div").style("position", "absolute").style("top", "5px").style("left", `${settings.yAxisX + settings.yAxisSpace + titleWidth + 8}px`);
+    icons["download"](downloadDiv, {
+      width: 16,
+      height: 16,
+      title: "Download Manhattan plot",
+      handler: () => {
+        const svgNode = svg.node();
+        const clone = svgNode.cloneNode(true);
+        const bbox = svgNode.getBBox();
+        clone.setAttribute("width", bbox.width.toString());
+        clone.setAttribute("height", bbox.height.toString());
+        clone.setAttribute("viewBox", `${bbox.x} ${bbox.y} ${bbox.width} ${bbox.height}`);
+        to_svg(clone, `manhattan_plot_${(/* @__PURE__ */ new Date()).toISOString().replace(/[:.]/g, "-").slice(0, -5)}`, {
+          apply_dom_styles: true
+        });
+      }
+    });
+  }
+  const mutationTypes = [...new Set(data.plotData.points.map((p) => p.type).filter(Boolean))];
+  const legendData = custom.legend?.map((l) => ({ type: l.label, color: l.color, hollow: l.hollow })) ?? mutationTypes.map((type) => {
+    const point = data.plotData.points.find((p) => p.type === type);
+    return {
+      type: String(type).charAt(0).toUpperCase() + String(type).slice(1),
+      color: point?.color
+    };
+  });
+  if (settings.showLegend && legendData.length > 0) {
+    const legendY = settings.yAxisY / 2;
+    const totalWidth = legendData.length * settings.legendItemWidth;
+    const legendX = settings.yAxisX + settings.yAxisSpace + (settings.plotWidth + 2 * settings.pngDotRadius) - totalWidth - settings.legendRightOffset;
+    legendData.forEach((item, i) => {
+      const x = legendX + i * settings.legendItemWidth;
+      svg.append("circle").attr("cx", x + 8).attr("cy", legendY).attr("r", settings.legendDotRadius).attr("fill", item.hollow ? "none" : item.color).attr("stroke", item.hollow ? item.color : "none");
+      svg.append("text").attr("x", x + 8 + settings.legendTextOffset).attr("y", legendY + settings.legendVerticalOffset).attr("font-size", `${settings.legendFontSize + 2}px`).text(item.type);
+    });
+  }
+  return handle;
+}
+
+export {
+  manhattanLayoutDefaults,
+  plotManhattan
+};
+//# sourceMappingURL=chunk-L2H4W3UM.js.map

package/dist/chunk-LXS2GSF4.js

@@ -0,0 +1,240 @@
+import {
+  make_radios
+} from "./chunk-3YQYWX4M.js";
+import {
+  initBinConfig
+} from "./chunk-KBTFT76L.js";
+import {
+  toStoredUnit,
+  toUserUnit
+} from "./chunk-W5J3LTYS.js";
+import {
+  format
+} from "./chunk-4OLM3KSB.js";
+
+// termsetting/handlers/NumRegularBinEditor.ts
+var NumRegularBinEditor = class {
+  constructor(editHandler) {
+    this.dom = {};
+    this.editHandler = editHandler;
+    this.opts = editHandler.opts;
+    this.tw = editHandler.tw;
+    this.termsetting = editHandler.termsetting;
+  }
+  /* q holds bin boundaries in the unit the term's values are stored in, while the <input>s and the
+  density plot show them in the term's user-facing unit. toDisplay()/toStored() cross that boundary;
+  both are identity functions unless the term declares valueConversion{} */
+  toDisplay(v) {
+    return toUserUnit(v, this.tw.term);
+  }
+  toStored(v) {
+    return toStoredUnit(v, this.tw.term);
+  }
+  render(div) {
+    this.tw = this.editHandler.tw;
+    const isRemounting = !!this.dom.binsTable && this.editHandler.dom.binsDiv?.node().contains(this.dom.binsTable.node());
+    if (!isRemounting) this.q = this.getDefaultQ();
+    this.editHandler.handler.density.setBinLines(this.getBoundaryOpts());
+    if (isRemounting) return;
+    if (this.dom.binsTable) {
+      this.dom.binsTable.remove();
+      delete this.dom.binsTable;
+    }
+    const binsTable = div.append("table");
+    this.dom.binsTable = binsTable;
+    this.renderBinSizeInput(binsTable.append("tr"));
+    this.renderFirstBinInput(binsTable.append("tr"));
+    this.renderLastBinInputs(binsTable.append("tr"));
+  }
+  getDefaultQ() {
+    if (this.tw.q.type == "regular-bin") return JSON.parse(JSON.stringify(this.tw.q));
+    const t = this.tw.term;
+    const defaultQ = this.termsetting.opts.use_bins_less && t.bins?.less || t.bins?.default;
+    if (defaultQ) return JSON.parse(JSON.stringify(defaultQ));
+    const binConfig = initBinConfig(this.editHandler.handler.density_data);
+    return typeof binConfig == "string" ? JSON.parse(binConfig) : binConfig;
+  }
+  renderBinSizeInput(tr) {
+    const handler = this.editHandler.handler;
+    tr.append("td").style("margin", "5px").style("opacity", 0.5).text("Bin Size");
+    const { min, max } = handler.density_data;
+    const q = this.q;
+    const origBinSize = this.toDisplay(q.bin_size);
+    this.dom.bin_size_input = tr.append("td").append("input").attr("type", "number").attr(
+      "value",
+      handler.density.scaleFactor == 1 && "rounding" in q ? format(q.rounding || ".0f")(q.bin_size) : origBinSize
+    ).attr("data-testid", "sjpp-num-reg-bin-editor-size").style("margin-left", "15px").style("width", "100px").style("color", () => q.bin_size > Math.abs(max - min) ? "red" : "").on("change", (event) => {
+      const newValue = this.toStored(Number(event.target.value));
+      if (newValue <= 0) {
+        window.alert("Please enter non-negative bin size.");
+        event.target.value = origBinSize;
+        return;
+      }
+      if ((max - min) / newValue > 100) {
+        window.alert("Bin size too small. Try setting a bigger value.");
+        event.target.value = origBinSize;
+        return;
+      }
+      q.bin_size = newValue;
+      this.dom.bin_size_input.style(
+        "color",
+        q.bin_size > max - min ? "red" : this.toDisplay(newValue) != origBinSize ? "green" : ""
+      );
+      handler.density.setBinLines(this.getBoundaryOpts());
+    });
+  }
+  renderFirstBinInput(tr) {
+    const handler = this.editHandler.handler;
+    const q = this.q;
+    if (!q.first_bin) throw "missing q.first_bin";
+    tr.append("td").style("margin", "5px").style("opacity", 0.5).text("First Bin Stop");
+    const { min, max } = handler.density_data;
+    const origValue = this.toDisplay(q.first_bin.stop);
+    this.dom.first_stop_input = tr.append("td").append("input").attr("type", "number").property("value", origValue).style("width", "100px").style("margin-left", "15px").on("change", (event) => {
+      const newValue = this.toStored(Number(event.target.value));
+      if (Number(event.target.value) < this.toDisplay(min) || Number(event.target.value) > this.toDisplay(max)) {
+        window.alert("First bin stop value out of bound.");
+        event.target.value = origValue;
+        return;
+      }
+      this.q.first_bin.stop = newValue;
+      handler.density.setBinLines(this.getBoundaryOpts());
+    });
+    tr.append("td").append("div").style("font-size", ".6em").style("opacity", 0.5).style("display", handler.density.no_density_data ? "none" : "block").text("Indicated by left-most red line. Drag to change.");
+  }
+  renderLastBinInputs(tr) {
+    const handler = this.editHandler.handler;
+    const q = this.q;
+    const isAuto = !q.last_bin || !Number.isFinite(q.last_bin.start);
+    tr.append("td").style("padding-top", "4px").style("opacity", 0.5).style("vertical-align", "top").text("Last Bin Start");
+    const td1 = tr.append("td").style("padding-left", "15px").style("vertical-align", "top");
+    const radio_div = td1.append("div");
+    const radios = make_radios({
+      holder: radio_div,
+      options: [
+        { label: "Automatic", value: "auto", checked: isAuto },
+        { label: "Fixed", value: "fixed", checked: !isAuto }
+      ],
+      callback: (v) => {
+        if (v == "auto") {
+          delete q.last_bin;
+          edit_div.style("display", "none");
+          handler.density.setBinLines(this.getBoundaryOpts());
+          return;
+        }
+        edit_div.style("display", "inline-block");
+        if (this.dom.last_start_input.property("value") == "") {
+          this.dom.last_start_input.property(
+            "value",
+            this.toDisplay(this.tw.q.last_bin?.start || handler.density_data.max)
+          );
+        }
+        this.setLastBinStart();
+      }
+    });
+    this.dom.fixed_radio = radios.inputs.filter((_, i) => i === 1);
+    const edit_div = tr.append("td").append("div").style("display", isAuto ? "none" : "inline-block");
+    this.dom.last_start_input = edit_div.append("input").attr("type", "number").property("value", Number.isFinite(q.last_bin?.start) ? this.toDisplay(q.last_bin.start) : "").style("width", "100px").on("change", () => this.setLastBinStart());
+    edit_div.append("div").style("font-size", ".6em").style("opacity", 0.5).style("display", handler.density.no_density_data ? "none" : "block").text("Indicated by right-most red line. Drag to change.");
+  }
+  setLastBinStart() {
+    const q = this.q;
+    const { max } = this.editHandler.handler.density_data;
+    const strInput = this.dom.last_start_input.property("value");
+    if (strInput === "") return;
+    const inputValue = this.toStored(Number(strInput));
+    if (q.first_bin && Number(strInput) <= this.toDisplay(q.first_bin.stop)) {
+      window.alert("Last bin start cannot be smaller than first bin stop.");
+      this.dom.last_start_input.property("value", this.toDisplay(max));
+      return;
+    }
+    if (Number(strInput) > this.toDisplay(max)) {
+      window.alert("Last bin start value out of bound.");
+      this.dom.last_start_input.property("value", this.toDisplay(max));
+      return;
+    }
+    if (q.last_bin) q.last_bin.start = inputValue;
+    else
+      q.last_bin = {
+        start: inputValue,
+        stopunbounded: true,
+        stopinclusive: false
+      };
+    this.editHandler.handler.density.setBinLines(this.getBoundaryOpts());
+  }
+  getBoundaryOpts() {
+    const { min, max } = this.editHandler.handler.density_data;
+    const binLinesStop = this.q.last_bin?.start ?? max + Math.abs(this.q.first_bin.stop) - Math.min(min, 0);
+    const boundaryValues = [];
+    for (let i = this.q.first_bin.stop; i <= binLinesStop; i = i + this.q.bin_size) {
+      if (this.q.last_bin?.start === i) break;
+      if (i > binLinesStop) boundaryValues[boundaryValues.length - 1].isLastVisibleLine = true;
+      const isDraggable = i === this.q.first_bin.stop || i === this.q.bin_size - 1;
+      boundaryValues.push({ x: this.toDisplay(i), isDraggable, movesWithLineIndex: !isDraggable ? 0 : -1 });
+    }
+    if (this.q.last_bin) {
+      boundaryValues.push({
+        x: this.toDisplay(this.q.last_bin.start),
+        isDraggable: true,
+        isLastVisibleLine: true,
+        movesWithLineIndex: -1
+      });
+    }
+    return {
+      values: boundaryValues,
+      // the dragged value arrives in display units, matching what the <input>s show
+      callback: (d, value) => {
+        if (d.index === 0) {
+          this.dom.first_stop_input.property("value", value);
+          this.q.first_bin.stop = this.toStored(value);
+        } else {
+          this.dom.last_start_input.property("value", value);
+          if (this.q.last_bin) this.q.last_bin.start = this.toStored(value);
+        }
+      }
+    };
+  }
+  getEditedQ(destroyDom = true) {
+    const bin_size = this.dom.bin_size_input.property("value");
+    const config = {
+      mode: "discrete",
+      type: "regular-bin",
+      startinclusive: this.editHandler.boundaryInclusion == "startinclusive",
+      stopinclusive: this.editHandler.boundaryInclusion == "stopinclusive",
+      bin_size: this.toStored(Number(bin_size)),
+      first_bin: {
+        startunbounded: true,
+        stop: this.toStored(Number(this.dom.first_stop_input.property("value")))
+      },
+      /* rounding formats the stored bin size, so it cannot be derived from the decimals of a
+      converted input. a converted term labels its bins through valueConversion instead */
+      rounding: this.editHandler.handler.density.scaleFactor != 1 ? ".0f" : bin_size.includes(".") && !bin_size.endsWith(".") ? `.${bin_size.split(".")[1].length}f` : ".0f"
+    };
+    if (this.dom.fixed_radio.property("checked")) {
+      config.last_bin = {
+        start: this.toStored(Number(this.dom.last_start_input.property("value"))),
+        stopunbounded: true
+      };
+    }
+    if (destroyDom) {
+      for (const name of Object.keys(this.dom)) {
+        this.dom[name].remove();
+        delete this.dom[name];
+      }
+    }
+    return config;
+  }
+  undoEdits() {
+    this.q = this.getDefaultQ();
+    this.dom.binsTable.selectAll("*").remove();
+    this.renderBinSizeInput(this.dom.binsTable.append("tr"));
+    this.renderFirstBinInput(this.dom.binsTable.append("tr"));
+    this.renderLastBinInputs(this.dom.binsTable.append("tr"));
+    this.editHandler.handler.density.setBinLines(this.getBoundaryOpts());
+  }
+};
+
+export {
+  NumRegularBinEditor
+};
+//# sourceMappingURL=chunk-LXS2GSF4.js.map

package/dist/chunk-MG5U4JYY.js

@@ -0,0 +1,102 @@
+import {
+  addGeneSearchbox,
+  first_genetrack_tolist,
+  getDNAMethUnit,
+  sayerror
+} from "./chunk-3YQYWX4M.js";
+import {
+  Menu
+} from "./chunk-CNFTQSNE.js";
+import {
+  DNA_METHYLATION
+} from "./chunk-WJLRU5OF.js";
+
+// termdb/handlers/dnaMethylation.ts
+var SearchHandler = class {
+  init(opts) {
+    this.opts = opts;
+    this.callback = opts.callback;
+    this.app = opts.app;
+    const holder = opts.holder.append("div").style("margin", "10px 0px");
+    this.dom = {};
+    this.dom.errDiv = holder.append("div").style("margin", "5px 0px").style("display", "none");
+    this.dom.geneSearchDiv = holder.append("div");
+    this.dom.blockDiv = holder.append("div").style("display", "none").style("margin", "15px 4px");
+    const geneSearch = addGeneSearchbox({
+      tip: new Menu({ padding: "0px" }),
+      genome: opts.genomeObj,
+      row: this.dom.geneSearchDiv,
+      callback: async () => {
+        try {
+          this.dom.errDiv.style("display", "none");
+          await this.handleGeneSearch(geneSearch);
+        } catch (e) {
+          this.dom.errDiv.style("display", "block");
+          sayerror(this.dom.errDiv, "Error: " + (e.message || e));
+          if (e.stack) console.log(e.stack);
+        }
+      }
+    });
+  }
+  async handleGeneSearch(geneSearch) {
+    if (geneSearch.geneSymbol) {
+      const { chr, start, stop } = geneSearch;
+      if (!chr || !Number.isInteger(start) || !Number.isInteger(stop))
+        throw new Error("unable to retrieve gene coordinate");
+      this.dom.blockDiv.selectAll("*").remove();
+      this.dom.blockDiv.style("display", "block");
+      this.dom.blockDiv.append("div").style("opacity", 0.6).text("Navigate genome browser to desired region");
+      const arg = {
+        holder: this.dom.blockDiv,
+        genome: this.opts.genomeObj,
+        // genome obj
+        chr,
+        start,
+        stop,
+        tklst: [],
+        nobox: true,
+        width: 500,
+        hidegenelegend: true,
+        debugmode: this.opts.debug
+      };
+      first_genetrack_tolist(this.opts.genomeObj, arg.tklst);
+      const _ = await import("./block-IS3WJCNW.js");
+      this.blockInstance = new _.Block(arg);
+      this.dom.submitBtn = this.dom.blockDiv.append("div").attr("data-testid", "sjpp-dnaMethylation-submitDiv").style("margin", "10px 0px").append("button").style("border", "none").style("border-radius", "20px").style("padding", "10px 15px").text("Submit Region").on("click", async () => {
+        const { chr: chr2, start: start2, stop: stop2 } = this.blockInstance.rglst[0];
+        const term = this.makeTerm({ chr: chr2, start: start2, stop: stop2 });
+        await this.callback(term);
+      });
+    } else if (geneSearch.chr && Number.isInteger(geneSearch.start) && Number.isInteger(geneSearch.stop)) {
+      const { chr } = geneSearch;
+      let { start, stop } = geneSearch;
+      if (geneSearch.actualposition?.len <= 1) {
+        start = geneSearch.actualposition.position;
+        stop = start + 1;
+      }
+      const term = this.makeTerm({ chr, start, stop });
+      await this.callback(term);
+    } else {
+      throw new Error("invalid gene search input");
+    }
+  }
+  makeTerm(opts) {
+    const { chr, start, stop } = opts;
+    if (!chr || !Number.isInteger(start) || !Number.isInteger(stop)) throw new Error("invalid coordinate");
+    const unit = getDNAMethUnit("region", this.app.vocabApi);
+    const term = {
+      chr,
+      start,
+      stop,
+      type: DNA_METHYLATION,
+      unit,
+      genomicFeatureType: "region"
+    };
+    return term;
+  }
+};
+
+export {
+  SearchHandler
+};
+//# sourceMappingURL=chunk-MG5U4JYY.js.map