@sjcrh/proteinpaint-client 2.187.0 → 2.188.1

package/dist/brainImaging-YQ443NOL.js

@@ -0,0 +1,422 @@
+import {
+  controlsInit,
+  renderTable,
+  svgLegend,
+  term0_term2_defaultQ
+} from "./chunk-2XPDA6NL.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-GHWHLSUX.js";
+import {
+  Menu
+} from "./chunk-HYOEWQ5P.js";
+import "./chunk-HBW42TDT.js";
+import "./chunk-G6O3URDN.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-KWM6B3NL.js";
+import "./chunk-UCLS2SVB.js";
+import "./chunk-AY4UBGLC.js";
+import "./chunk-2P6Z7JFC.js";
+import {
+  dofetch3
+} from "./chunk-MYWJQRTD.js";
+import {
+  copyMerge,
+  getCompInit
+} from "./chunk-MVTCBVSX.js";
+import "./chunk-B43MTEYB.js";
+import "./chunk-2T7VYQLY.js";
+import "./chunk-FDK4UJMN.js";
+import "./chunk-X7GDCYND.js";
+import "./chunk-SJC2C77V.js";
+import "./chunk-C3SYSMNE.js";
+import "./chunk-KSGA62R2.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-TOU7EVFQ.js";
+import {
+  linear
+} from "./chunk-OAWQ6LOO.js";
+import "./chunk-NMBIT4IK.js";
+import "./chunk-KYBIQBXE.js";
+import "./chunk-I6Y4O3RR.js";
+import {
+  rgb
+} from "./chunk-OMR2DT66.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-HFNDKYVF.js";
+
+// plots/brainImaging.js
+var BrainImaging = class _BrainImaging {
+  static type = "brainImaging";
+  constructor(opts) {
+    this.opts = opts;
+    this.type = _BrainImaging.type;
+    setInteractivity(this);
+  }
+  async init(appState) {
+    const state = this.getState(appState);
+    const holder = this.opts.holder;
+    if (this.opts.header)
+      this.opts.header.style("padding-left", "7px").style("color", "rgb(85, 85, 85)").html(`Brain Imaging: ${state.config.queryKey}/${state.config.selectedSampleFileNames.join(" ")}`);
+    const controlsHolder = holder.append("div").style("display", "inline-block").style("vertical-align", "top");
+    const rightDiv = holder.append("div").style("display", "inline-block").style("vertical-align", "top");
+    const headerHolder = rightDiv.append("div").style("display", "inline-block").style("vertical-align", "top").style("padding", "10px");
+    const contentHolder = rightDiv.append("div").style("vertical-align", "top");
+    const table = contentHolder.append("table").style("border-collapse", "collapse");
+    const headerTr = table.append("tr");
+    const contentTr = table.append("tr").style("background-color", "black");
+    const tdL = contentTr.append("td");
+    const tdF = contentTr.append("td");
+    const tdT = contentTr.append("td");
+    const legendHolder = contentHolder.append("svg").style("width", "100%").on("mouseup", this.legendLabelMouseup);
+    const legendMenu = new Menu({ padding: "0px" });
+    this.dom = {
+      headerHolder,
+      contentHolder,
+      headerTr,
+      tdL,
+      tdF,
+      tdT,
+      legendHolder,
+      legendMenu
+    };
+    this.addSliders(state.config.settings.brainImaging);
+    const configInputsOptions = this.getConfigInputsOptions(state);
+    this.components = {
+      controls: await controlsInit({
+        app: this.app,
+        id: this.id,
+        holder: controlsHolder,
+        inputs: configInputsOptions
+      })
+    };
+    this.components.controls.on("downloadClick.brainImaging", () => {
+      const urls = [];
+      for (const key in this.imagesData)
+        for (const category in this.imagesData[key].dataUrls) {
+          const dataUrl = this.imagesData[key].dataUrls[category].url;
+          urls.push(dataUrl);
+        }
+      this.downloadImage(urls);
+    });
+    this.legendRenderer = svgLegend({ holder: this.dom.legendHolder });
+  }
+  addSliders(settings) {
+    const tr = this.dom.headerTr;
+    let td = tr.append("td");
+    td.append("label").attr("for", "saggital").text("Sagittal:");
+    this.dom.saggitalSlider = td.append("input").attr("id", "saggital").attr("type", "range").attr("min", 0).attr("max", 192).attr("value", settings.brainImageL).on("change", (e) => {
+      this.editBrainImage("brainImageL", e.target.value);
+    });
+    this.dom.saggitalInput = td.append("input").attr("type", "number").attr("min", 0).attr("max", 192).attr("value", settings.brainImageL).on("change", (e) => {
+      this.editBrainImage("brainImageL", e.target.value);
+    }).style("vertical-align", "top");
+    td = tr.append("td");
+    td.append("label").attr("for", "coronal").text("Coronal:");
+    this.dom.coronalSlider = td.append("input").attr("type", "range").attr("min", 0).attr("max", 228).attr("value", settings.brainImageF).on("change", (e) => {
+      this.editBrainImage("brainImageF", e.target.value);
+    });
+    this.dom.coronalInput = td.append("input").attr("type", "number").attr("min", 0).attr("max", 192).attr("value", settings.brainImageF).on("change", (e) => {
+      this.editBrainImage("brainImageF", e.target.value);
+    }).style("vertical-align", "top");
+    td = tr.append("td");
+    td.append("label").attr("for", "axial").text("Axial:");
+    this.dom.axialSlider = td.append("input").attr("id", "axial").attr("type", "range").attr("min", 0).attr("max", 192).attr("value", settings.brainImageT).on("change", (e) => {
+      this.editBrainImage("brainImageT", e.target.value);
+    });
+    this.dom.axialInput = td.append("input").attr("type", "number").attr("min", 0).attr("max", 192).attr("value", settings.brainImageT).on("change", (e) => {
+      this.editBrainImage("brainImageT", e.target.value);
+    });
+  }
+  editBrainImage(key, value) {
+    if (!value) return;
+    const settings = { [key]: Number(value) };
+    this.app.dispatch({ type: "plot_edit", id: this.id, config: { settings: { brainImaging: settings } } });
+  }
+  downloadImage(dataUrls) {
+    for (const dataUrl of dataUrls) {
+      const downloadImgName = "brainImaging";
+      const a = document.createElement("a");
+      document.body.appendChild(a);
+      a.addEventListener(
+        "click",
+        () => {
+          a.download = downloadImgName + ".png";
+          a.href = dataUrl;
+          document.body.removeChild(a);
+        },
+        false
+      );
+      a.click();
+    }
+  }
+  getConfigInputsOptions(state) {
+    if (state.config.selectedSampleFileNames.length == 1) return [];
+    const mandatoryConfigInputOptions = [
+      {
+        label: "Divide by",
+        type: "term",
+        chartType: "brainImaging",
+        configKey: "divideByTW",
+        title: "Categories to divide by",
+        usecase: { target: "brainImaging", detail: "term0" },
+        vocabApi: this.app.vocabApi,
+        numericEditMenuVersion: ["discrete"],
+        defaultQ4fillTW: term0_term2_defaultQ
+      },
+      {
+        label: "Color by",
+        type: "term",
+        chartType: "brainImaging",
+        configKey: "overlayTW",
+        title: "Categories to color the samples",
+        usecase: { target: "brainImaging", detail: "term2" },
+        vocabApi: this.app.vocabApi,
+        numericEditMenuVersion: ["discrete"],
+        defaultQ4fillTW: term0_term2_defaultQ
+      }
+    ];
+    return mandatoryConfigInputOptions;
+  }
+  getState(appState) {
+    const config = appState.plots.find((p) => p.id === this.id);
+    return {
+      config,
+      dslabel: appState.vocab.dslabel,
+      genome: appState.vocab.genome,
+      RefNIdata: appState.termdbConfig.queries.NIdata[config.queryKey]
+    };
+  }
+  async main() {
+    this.config = structuredClone(this.state.config);
+    this.settings = this.state.config.settings.brainImaging;
+    this.dom.saggitalSlider.property("value", this.settings.brainImageL);
+    this.dom.saggitalInput.property("value", this.settings.brainImageL);
+    this.dom.coronalSlider.property("value", this.settings.brainImageF);
+    this.dom.coronalInput.property("value", this.settings.brainImageF);
+    this.dom.axialSlider.property("value", this.settings.brainImageT);
+    this.dom.axialInput.property("value", this.settings.brainImageT);
+    const data = await Promise.all([
+      this.requestImage("l", this.settings.brainImageL),
+      this.requestImage("f", this.settings.brainImageF),
+      this.requestImage("t", this.settings.brainImageT)
+    ]);
+    this.imagesData = {
+      brainImageL: { dataUrls: {}, td: this.dom.tdL, data: data[0] },
+      brainImageF: { dataUrls: {}, td: this.dom.tdF, data: data[1] },
+      brainImageT: { dataUrls: {}, td: this.dom.tdT, data: data[2] }
+    };
+    for (const img of Object.values(this.imagesData)) this.renderImages(img);
+    this.renderLegend();
+  }
+  async requestImage(key, value) {
+    const body = {
+      genome: this.state.genome,
+      dslabel: this.state.dslabel,
+      refKey: this.state.config.queryKey,
+      [key]: value,
+      selectedSampleFileNames: this.state.config.selectedSampleFileNames,
+      divideByTW: this.state.config.divideByTW,
+      overlayTW: this.state.config.overlayTW,
+      legendFilter: this.state.config.legendFilter
+    };
+    return await dofetch3("brainImaging", { body });
+  }
+  renderImages({ data, td, dataUrls }) {
+    this.legendValues = data.legend;
+    if (data.error) throw data.error;
+    for (const [termV, result] of Object.entries(data.brainImage)) {
+      dataUrls[termV] = result;
+    }
+    td.selectAll("*").remove();
+    for (const [termV, result] of Object.entries(dataUrls)) {
+      if (this.state.config.divideByTW)
+        td.append("div").attr("class", "pp-chart-title").style("text-align", "center").text(`${termV} (n=${result.catNum})`).style("font-weight", "600").style("color", "white").style("font-size", "24px").style("margin-bottom", "5px").style("margin-top", "5px").style("display", "block");
+      td.append("div").append("img").attr("src", result.url);
+    }
+  }
+  renderLegend() {
+    const legendItems = [];
+    for (const [label, v] of Object.entries(this.legendValues)) {
+      const scale = linear(["white", v.color], [0, v.maxLength]).clamp(true);
+      legendItems.push({
+        text: label == "default" ? "Combined Intensity" : label,
+        width: 100,
+        scale,
+        colors: ["white", v.color],
+        domain: [0, v.maxLength],
+        key: label,
+        crossedOut: v.crossedOut
+      });
+    }
+    this.legendItems = legendItems;
+    const legendRendererData = [
+      {
+        items: legendItems
+      }
+    ];
+    this.legendRenderer(legendRendererData, {
+      settings: {
+        fontsize: 16,
+        iconh: 14,
+        iconw: 14,
+        dimensions: {
+          xOffset: 0
+        }
+      }
+    });
+  }
+};
+function makeChartBtnMenu(holder, chartsInstance) {
+  chartsInstance.dom.tip.clear();
+  const menuDiv = holder.append("div");
+  if (chartsInstance.state.termdbConfig.queries.NIdata) {
+    for (const [refKey, ref] of Object.entries(chartsInstance.state.termdbConfig.queries.NIdata)) {
+      const refDiv = menuDiv.append("div");
+      const refOption = refDiv.append("div").attr("class", "sja_menuoption sja_sharp_border").text(refKey).on("click", async () => {
+        refOption.attr("class", "sja_menuoption_not_interactive");
+        refOption.on("click", null);
+        const body = {
+          genome: chartsInstance.opts.vocab.genome,
+          dslabel: chartsInstance.opts.vocab.dslabel,
+          refKey,
+          samplesOnly: true
+        };
+        const result = await dofetch3("brainImagingSamples", { body });
+        const samples = result.samples;
+        const [rows, columns] = await getTableData(chartsInstance, samples, chartsInstance.state, refKey);
+        const applybt = {
+          text: "APPLY",
+          class: "sjpp_apply_btn sja_filter_tag_btn",
+          callback: (indexes) => {
+            chartsInstance.dom.tip.hide();
+            const selectedSampleFileNames = indexes.map((i) => samples[i].sample + ".nii");
+            const config = {
+              chartType: "brainImaging",
+              queryKey: refKey,
+              settings: {
+                brainImaging: {
+                  brainImageL: ref.parameters.l,
+                  brainImageF: ref.parameters.f,
+                  brainImageT: ref.parameters.t
+                }
+              },
+              selectedSampleFileNames
+            };
+            chartsInstance.app.dispatch({
+              type: "plot_create",
+              config
+            });
+          }
+        };
+        renderTable({
+          rows,
+          columns,
+          resize: true,
+          singleMode: false,
+          div: refDiv.append("div"),
+          maxHeight: "40vh",
+          buttons: [applybt]
+        });
+      });
+    }
+  }
+}
+var brainImaging = getCompInit(BrainImaging);
+var componentInit = brainImaging;
+async function getPlotConfig(opts) {
+  const settings = {
+    brainImaging: { brainImageL: 76, brainImageF: 116, brainImageT: 80 }
+  };
+  const config = { chartType: "brainImaging", settings, hidePlotFilter: true };
+  return copyMerge(config, opts);
+}
+async function getTableData(self, samples, state, refKey) {
+  const rows = [];
+  for (const sample of samples) {
+    const row = [{ value: sample.sample }];
+    for (const c of state.termdbConfig.queries.NIdata[refKey].sampleColumns || []) {
+      row.push({ value: sample[c.termid] });
+    }
+    rows.push(row);
+  }
+  const columns = [{ label: "Sample" }];
+  for (const c of state.termdbConfig.queries.NIdata[refKey].sampleColumns || []) {
+    columns.push({
+      label: (await self.app.vocabApi.getterm(c.termid)).name
+    });
+  }
+  return [rows, columns];
+}
+function setInteractivity(self) {
+  self.legendLabelMouseup = (event) => {
+    const targetData = event.target.__data__;
+    if (!targetData || targetData.key == "default") return;
+    const legendMenu = self.dom.legendMenu.clear();
+    const legendMenuDiv = legendMenu.d.append("div");
+    const legendFilter = self.state.config.legendFilter ? [...self.state.config.legendFilter] : [];
+    const legendFilterIndex = legendFilter.indexOf(targetData.key);
+    if (legendFilterIndex !== -1 || legendFilter.length + 1 !== self.legendItems.length) {
+      legendMenuDiv.append("div").attr("class", "sja_menuoption sja_sharp_border").text(legendFilterIndex == -1 ? "Hide" : "Show").on("click", () => {
+        legendMenu.hide();
+        if (legendFilterIndex == -1) legendFilter.push(targetData.key);
+        else legendFilter.splice(legendFilterIndex, 1);
+        self.app.dispatch({
+          type: "plot_edit",
+          id: self.id,
+          config: { legendFilter }
+        });
+      });
+    }
+    legendMenuDiv.append("div").attr("class", "sja_menuoption sja_sharp_border").text("Show only").on("click", () => {
+      legendMenu.hide();
+      const legendFilter2 = [];
+      for (const legendCat of self.legendItems) {
+        if (legendCat.key !== targetData.key) legendFilter2.push(legendCat.key);
+      }
+      self.app.dispatch({
+        type: "plot_edit",
+        id: self.id,
+        config: { legendFilter: legendFilter2 }
+      });
+    });
+    legendMenuDiv.append("div").attr("class", "sja_menuoption sja_sharp_border").text("Show all").on("click", () => {
+      legendMenu.hide();
+      self.app.dispatch({
+        type: "plot_edit",
+        id: self.id,
+        config: { legendFilter: [] }
+      });
+    });
+    if (self.state.config.overlayTW.term.type != "geneVariant") {
+      let color = self.state.config.overlayTW?.term?.values?.[targetData.key]?.color || "red";
+      color = rgb(color).formatHex();
+      legendMenuDiv.append("div").attr("class", "sja_sharp_border").style("padding", "0px 10px").text("Color:").append("input").attr("type", "color").attr("value", color).on("change", (e) => {
+        self.changeColor(targetData.key, e.target.value);
+      });
+    }
+    legendMenu.showunder(event.target);
+  };
+  self.changeColor = async function(key, color) {
+    const tw = self.config.overlayTW;
+    if (!(tw.term.type == "geneVariant" && tw.q.type == "values") && tw.term.values[key])
+      tw.term.values[key].color = color;
+    else {
+      if (!tw.term.values) tw.term.values = {};
+      if (!tw.term.values[key]) tw.term.values[key] = {};
+      tw.term.values[key].color = color;
+    }
+    await self.app.dispatch({
+      type: "plot_edit",
+      id: self.id,
+      config: { overlayTW: tw }
+    });
+  };
+}
+export {
+  brainImaging,
+  componentInit,
+  getPlotConfig,
+  makeChartBtnMenu
+};
+//# sourceMappingURL=brainImaging-YQ443NOL.js.map

package/dist/chunk-26WXJBSR.js

@@ -0,0 +1,228 @@
+import {
+  appInit
+} from "./chunk-I24KPIDD.js";
+import {
+  getDefaultViolinSettings
+} from "./chunk-XD4TBJK2.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+
+// plots/regression.inputs.values.table.js
+var row_hover_bgcolor = "#fff6dc";
+var InputValuesTable = class {
+  constructor(opts) {
+    this.opts = opts;
+    this.input = opts.input;
+    setRenderers(this);
+    this.setDOM(opts.holder);
+  }
+  main() {
+    try {
+      const term = this.input.term;
+      if (!term || !this.input.termStatus) {
+        this.dom.holder.style("display", "none");
+        this.dom.loading_div.style("display", "none");
+        return;
+      } else if (term) {
+        this.dom.holder.style("display", "block");
+        this.dom.loading_div.style("display", "block");
+        this.updateValueCount();
+        this.dom.loading_div.style("display", "none");
+        this.render();
+        return;
+      }
+    } catch (e) {
+      this.dom.loading_div.style("display", "none");
+      throw e;
+    }
+  }
+  updateValueCount() {
+    const i = this.input;
+    try {
+      if (i.pill && i.pill.validateQ) {
+        i.pill.validateQ({
+          term: i.term.term,
+          q: i.term.q,
+          sampleCounts: i.termStatus.sampleCounts
+        });
+      }
+    } catch (e) {
+      i.term.error = e;
+    }
+  }
+};
+function setRenderers(self) {
+  self.setDOM = (holder) => {
+    self.dom = {
+      holder: holder.style("margin", "10px").style("font-size", ".8em").style("text-align", "left").style("color", "#999"),
+      loading_div: holder.append("div").text("Loading..").style("display", "none"),
+      top_info_div: holder.append("div").style("padding-bottom", "5px"),
+      violin_div: holder.append("div").style("color", "black").style("padding-top", "5px"),
+      table_div: holder.append("table").style("margin", "5px 0px 15px 0px").style("border-collapse", "collapse").style("color", "black"),
+      bottom_info_div: holder.append("div"),
+      excluded_div: holder.append("table").style("display", "none").style("margin", "5px 10px").style("border-collapse", "collapse")
+    };
+  };
+  self.render = async () => {
+    const input = self.input;
+    renderTopInfo(input);
+    await renderValuesTable(input);
+    renderBottomInfo(input);
+    renderExcludedValues(input);
+  };
+  function renderTopInfo(input) {
+    if (input.termStatus.topInfoStatus?.length) {
+      self.dom.top_info_div.style("display", "block").html(input.termStatus.topInfoStatus.join("<br>"));
+    } else {
+      self.dom.top_info_div.style("display", "none");
+    }
+  }
+  async function renderValuesTable(input) {
+    if (input.term.q.mode == "continuous" || input.term.q.mode == "spline") {
+      self.dom.violin_div.style("display", "block");
+      self.dom.table_div.style("display", "none");
+      if (self.plotAppApi) {
+        const action = {
+          type: "app_refresh",
+          state: {
+            termfilter: {
+              filter: self.input.parent.parent.filter
+            }
+          },
+          subactions: [
+            {
+              type: "plot_edit",
+              id: self.violinApi.id,
+              config: {
+                term: input.term
+              }
+            }
+          ]
+        };
+        self.plotAppApi.dispatch(action);
+      } else {
+        const opts = {
+          holder: self.dom.violin_div,
+          vocabApi: self.input.parent.app.vocabApi,
+          state: {
+            vocab: {
+              genome: self.input.parent.app.vocabApi.genome,
+              dslabel: self.input.parent.app.vocabApi.dslabel
+            },
+            termfilter: {
+              filter: self.input.parent.parent.filter
+            },
+            plots: [
+              {
+                chartType: "violin",
+                term: input.term,
+                settings: {
+                  violin: getDefaultViolinSettings(null, {
+                    svgw: 350,
+                    axisHeight: 25,
+                    rightMargin: 10,
+                    datasymbol: "rug",
+                    radius: 8,
+                    plotThickness: 80
+                  })
+                }
+              }
+            ]
+          },
+          // global options for plotAppApi
+          // opts.violin will apply to all violin plots within the plotApp
+          // rx will pass options by component type, which are not tracked in state
+          // examples are callbacks, event listeners, etc
+          violin: {
+            mode: "minimal"
+          }
+        };
+        self.plotAppApi = await appInit(opts);
+        const plotId = self.plotAppApi.getState().plots[0].id;
+        self.violinApi = self.plotAppApi.getComponents(`plots.${plotId}`);
+      }
+    } else {
+      self.dom.violin_div.style("display", "none");
+      const data = input.termStatus.sampleCounts;
+      if (!data || !data.length) {
+        self.dom.table_div.style("display", "none");
+        return;
+      }
+      self.dom.table_div.style("display", "block");
+      const l = self.input.orderedLabels;
+      const sortFxn = l && l.length ? (a, b) => l.indexOf(a.label) - l.indexOf(b.label) : (a, b) => b.samplecount - a.samplecount;
+      const tr_data = data.sort(sortFxn);
+      const maxCount = Math.max(...tr_data.map((v) => v.samplecount), 0);
+      tr_data.forEach((v) => v.bar_width_frac = Number((1 - (maxCount - v.samplecount) / maxCount).toFixed(4)));
+      self.dom.table_div.selectAll("tr").remove();
+      const trs = self.dom.table_div.selectAll("tr").data(tr_data, (b) => b.key);
+      trs.enter().append("tr").each(trEnter);
+    }
+  }
+  function renderBottomInfo(input) {
+    if (input.termStatus.bottomSummaryStatus) {
+      self.dom.bottom_info_div.style("display", "block").html(input.termStatus.bottomSummaryStatus);
+    } else {
+      self.dom.bottom_info_div.style("display", "none");
+    }
+  }
+  function renderExcludedValues(input) {
+    const data = input.termStatus.excludeCounts;
+    if (!data || !data.length) {
+      self.dom.excluded_div.style("display", "none");
+      return;
+    }
+    self.dom.excluded_div.style("display", "block").selectAll("tr").remove();
+    const trs = self.dom.excluded_div.selectAll("tr").data(data, (b) => b.key);
+    trs.enter().append("tr").each(trEnter);
+    self.dom.excluded_div.selectAll("td").style("color", "#999");
+  }
+  function trEnter(item) {
+    const tr = select_default(this);
+    const input = this.parentNode.__data__;
+    const t = input.term;
+    const maxBarWidth = 150;
+    tr.style("text-align", "left").style("cursor", input.termStatus.allowToSelectRefGrp ? "pointer" : "default");
+    const tdSpacing = "1px 10px 1px 0px";
+    tr.append("td").style("padding", tdSpacing).style("text-align", "left").style("color", "black").text(item.samplecount !== void 0 ? "n=" + item.samplecount : "");
+    tr.append("td").style("padding", tdSpacing).style("text-align", "left").style("color", "black").text(item.label);
+    const bar_td = tr.append("td").style("padding", tdSpacing);
+    const barWidth = maxBarWidth * item.bar_width_frac;
+    bar_td.append("div").style("margin", tdSpacing).style("width", barWidth + "px").style("height", "15px").style("background-color", "#ddd");
+    addTrBehavior({ input, item, tr, rendered: false });
+  }
+  function addTrBehavior({ input, item, tr, rendered }) {
+    if (!item.bar_width_frac) return;
+    const t = input.term;
+    const hover_flag = input.termStatus.allowToSelectRefGrp;
+    let ref_text;
+    if (rendered) {
+      tr.style("background", "white");
+      ref_text = select_default(tr.node().lastChild).select("div").style("display", item.key === t.refGrp && hover_flag ? "inline-block" : "none").style("border", item.key === t.refGrp && hover_flag ? "1px solid #bbb" : "");
+    } else if (input.term.q.mode != "cutoff") {
+      const reference_td = tr.append("td").style("padding", "1px 5px").style("text-align", "left");
+      ref_text = reference_td.append("div").style("display", item.key === t.refGrp && hover_flag ? "inline-block" : "none").style("padding", "2px 10px").style("border", item.key === t.refGrp && hover_flag ? "1px solid #bbb" : "").style("border-radius", "10px").style("color", "#999").style("font-size", ".7em").text("REFERENCE");
+      if (hover_flag) {
+        tr.on("mouseover", () => {
+          if (t.refGrp !== item.key) {
+            tr.style("background", row_hover_bgcolor);
+            ref_text.style("display", "inline-block").style("border", "").text("Set as reference");
+          } else tr.style("background", "white");
+        }).on("mouseout", () => {
+          tr.style("background", "white");
+          if (t.refGrp !== item.key) ref_text.style("display", "none");
+        }).on("click", () => {
+          t.refGrp = item.key;
+          ref_text.style("border", "1px solid #bbb").text("REFERENCE");
+          self.opts.callback(t);
+        });
+      }
+    }
+  }
+}
+
+export {
+  InputValuesTable
+};
+//# sourceMappingURL=chunk-26WXJBSR.js.map