@sjcrh/proteinpaint-client 2.146.4-1 → 2.147.1

package/dist/chunk-SYBOIAA5.js

@@ -1,1066 +0,0 @@
-import {
-  controlsInit,
-  renderTerm1Label,
-  term0_term2_defaultQ
-} from "./chunk-L5RO3TWT.js";
-import {
-  PlotBase
-} from "./chunk-NQ5YW2DW.js";
-import {
-  DownloadMenu,
-  axisstyle,
-  drawBoxplot,
-  fillTermWrapper,
-  filterJoin,
-  getCombinedTermFilter,
-  getFilterItemByTag,
-  getMaxLabelWidth,
-  getSamplelstFilter,
-  renderTable
-} from "./chunk-DXNHQCWO.js";
-import {
-  isNumericTerm
-} from "./chunk-L7N5BOMJ.js";
-import {
-  plotColor
-} from "./chunk-MXMPAXMS.js";
-import {
-  copyMerge,
-  getCompInit
-} from "./chunk-SU6RBYZK.js";
-import {
-  Menu
-} from "./chunk-IVJWQYGG.js";
-import {
-  axisLeft,
-  axisTop
-} from "./chunk-LOZEKOES.js";
-import {
-  format,
-  linear,
-  log
-} from "./chunk-W2IWHXLL.js";
-import {
-  decimalPlacesUntilFirstNonZero,
-  roundValueAuto
-} from "./chunk-5OHXYXLD.js";
-import {
-  rgb
-} from "./chunk-OMR2DT66.js";
-import {
-  select_default
-} from "./chunk-NDWTN4U5.js";
-
-// plots/boxplot/model/Model.ts
-var Model = class {
-  constructor(config, state, app, settings) {
-    this.config = config;
-    this.state = state;
-    this.app = app;
-    this.settings = settings;
-  }
-  async getData() {
-    const boxPlotDataArgs = this.setRequestOpts();
-    const data = await this.app.vocabApi.getBoxPlotData(boxPlotDataArgs);
-    return data;
-  }
-  setRequestOpts() {
-    const opts = {
-      tw: this.getContinousTerm(),
-      filter: this.state.termfilter.filter,
-      filter0: this.state.termfilter.filter0
-    };
-    if (this.config.term2)
-      opts.overlayTw = this.getContinousTerm() == this.config.term ? this.config.term2 : this.config.term;
-    if (this.config.term0) opts.divideTw = this.config.term0;
-    opts.orderByMedian = this.settings.orderByMedian;
-    opts.isLogScale = this.settings.isLogScale;
-    opts.removeOutliers = this.settings.removeOutliers;
-    return opts;
-  }
-  getContinousTerm() {
-    if (!this.config?.term2) return this.config.term;
-    return isNumericTerm(this.config.term.term) && this.config.term.q.mode == "continuous" ? this.config.term : this.config.term2;
-  }
-};
-
-// plots/boxplot/viewModel/LegendDataMapper.ts
-var LegendDataMapper = class {
-  constructor(config, data, plots) {
-    this.legendData = [];
-    const isTerm2 = config?.term2;
-    if (config.term.q?.descrStats) {
-      this.legendData.push({
-        label: `Descriptive Statistics${isTerm2 ? `: ${config.term.term.name}` : ""}`,
-        items: this.getDescrStatItems(config.term.q.descrStats)
-      });
-    }
-    if (isTerm2 && isTerm2.q?.descrStats) {
-      this.legendData.push({
-        label: `Descriptive Statistics: ${config.term2.term.name}`,
-        items: this.getDescrStatItems(isTerm2.q.descrStats)
-      });
-    }
-    const hiddenPlots = plots.filter((p) => p.isHidden)?.map((p) => {
-      const total = p.descrStats.total;
-      if (!total || !total.value) throw `Missing total value for ${p.key}`;
-      return { key: p.key, text: p.key, n: total.value, isHidden: true, isPlot: true };
-    }) || [];
-    if (config.term.term?.values) {
-      const term1Label = config.term2 ? config.term.term.name : "Other categories";
-      const term1Data = this.setHiddenCategoryItems(config.term, term1Label, hiddenPlots, data.uncomputableValues || []);
-      if (term1Data) this.legendData.push(term1Data);
-    }
-    if (config.term2?.term?.values) {
-      const term2Data = this.setHiddenCategoryItems(
-        config.term2,
-        config.term2.term.name,
-        hiddenPlots,
-        data.uncomputableValues || []
-      );
-      if (term2Data) this.legendData.push(term2Data);
-    }
-  }
-  getDescrStatItems(stats) {
-    return Object.values(stats).map((s) => ({
-      key: s.key,
-      text: `${s.label}: ${s.value}`,
-      isHidden: false,
-      isPlot: false
-    }));
-  }
-  setHiddenCategoryItems(tw, label, hiddenPlots, uncomputableValues) {
-    const termData = { label, items: [] };
-    if (hiddenPlots.length) {
-      for (const key of Object.keys(tw.q.hiddenValues || {})) {
-        const plot = hiddenPlots.find((p) => p.key === key);
-        if (plot) termData.items.push(plot);
-      }
-    }
-    if (uncomputableValues && uncomputableValues.length) {
-      for (const v of Object.values(tw.term.values || {})) {
-        const uncomputableItem = uncomputableValues.find((u) => u.label === v.label);
-        if (uncomputableItem) {
-          termData.items.push({
-            key: uncomputableItem.label,
-            text: `${uncomputableItem.label}, n=${uncomputableItem.value}`,
-            isHidden: true,
-            isPlot: false
-          });
-        }
-      }
-    }
-    return termData.items.length ? termData : null;
-  }
-};
-
-// plots/boxplot/viewModel/ViewModel.ts
-var ViewModel = class {
-  constructor(config, data, settings, maxLabelLgth, useDefaultSettings) {
-    /** Top padding for the svg */
-    this.topPad = 20;
-    /** Bottom padding for the svg */
-    this.bottomPad = 40;
-    /** Horizontal, or right and left padding */
-    this.horizPad = 120;
-    /** For outliers, set a radius rather than using the default. */
-    this.outRadius = 5;
-    /** Increasing padding to space out the boxplots and determine position */
-    this.incrPad = 40;
-    const numOfPlots = data.plots.filter((p) => !p.isHidden).length;
-    if (useDefaultSettings) {
-      const isLargePlotCount = numOfPlots > 20;
-      this.rowHeight = numOfPlots > 10 ? isLargePlotCount ? 20 : 35 : 50;
-      this.rowSpace = numOfPlots > 10 ? isLargePlotCount ? 10 : 12 : 15;
-    } else {
-      this.rowHeight = settings.rowHeight;
-      this.rowSpace = settings.rowSpace;
-    }
-    this.totalLabelSize = maxLabelLgth + settings.labelPad;
-    this.totalRowSize = this.rowHeight + this.rowSpace;
-    const plotDim = this.setPlotDimensions(data, config, settings);
-    this.incrPad += 30;
-    const plots = this.setPlotData(data, config, settings);
-    this.viewData = {
-      plotDim,
-      plots: plots.filter((p) => !p.isHidden),
-      legend: new LegendDataMapper(config, data, plots).legendData
-    };
-  }
-  setPlotDimensions(data, config, settings) {
-    const svg = this.setSvgDimensions(settings, data);
-    const plotDim = {
-      //Add 1 to the max is big enough so the upper line to boxplot isn't cutoff
-      //Note: ts is complaining absMax could be null. Ignore. Error in server request.
-      domain: [data.absMin, data.absMax <= 1 ? data.absMax : data.absMax + 1],
-      range: [0, settings.boxplotWidth],
-      svg,
-      chartTitle: getChartTitle(config, data.chartId),
-      title: this.setTitleDimensions(config, settings, svg.height),
-      axis: {
-        x: settings.isVertical ? this.horizPad / 2 + this.incrPad + this.topPad : this.totalLabelSize,
-        y: this.topPad + (settings.isVertical ? settings.labelPad : this.incrPad + 20),
-        values: (ticks) => {
-          if (settings.isLogScale) return this.filterTickValues(ticks);
-          return ticks;
-        },
-        format: (d) => {
-          if (settings.isLogScale) {
-            if (Number.isInteger(d)) return format(".0f")(d);
-            const dec = decimalPlacesUntilFirstNonZero(d);
-            if (dec > 1) return format(`.${dec + 1}f`)(d);
-            return format(".2f")(d);
-          }
-          return d.toString();
-        }
-      },
-      backgroundColor: settings.displayMode == "dark" ? "black" : "white",
-      textColor: settings.displayMode == "dark" ? "white" : "black"
-    };
-    return plotDim;
-  }
-  filterTickValues(ticks) {
-    const signifcantLessThanOne = ticks.filter((t) => t < 1).length / ticks.length;
-    const range = ticks[ticks.length - 1] - ticks[0];
-    const spread = range > 1e3 ? 4 : range > 100 ? 3 : 2;
-    const formattedTicks = ticks.filter((t, i) => {
-      if (t === 0 || i == ticks.length - 1 && i % spread !== 0) return t;
-      else if (t <= 1 && signifcantLessThanOne > 0.5) {
-        if (i % 5 === 0) return t;
-      } else if (i % spread === 0) return t;
-    });
-    return formattedTicks;
-  }
-  setSvgDimensions(settings, data) {
-    const plotsSpace = data.plots.filter((p) => !p.isHidden).length * this.totalRowSize + this.topPad + this.bottomPad + this.incrPad;
-    const depth = settings.boxplotWidth + this.totalLabelSize + this.horizPad / 2;
-    return {
-      width: settings.isVertical ? plotsSpace + this.horizPad : depth,
-      height: settings.isVertical ? depth : plotsSpace
-    };
-  }
-  setTitleDimensions(config, settings, height) {
-    const depth = this.totalLabelSize + settings.boxplotWidth / 2;
-    return {
-      x: settings.isVertical ? this.horizPad / 2 : depth,
-      y: settings.isVertical ? height - depth - this.horizPad / 2 : this.topPad + this.incrPad / 2,
-      text: config.term.q.mode == "continuous" ? config.term.term.name : config.term2.term.name
-    };
-  }
-  setPlotData(data, config, settings) {
-    const plots = structuredClone(data.plots);
-    for (const plot of plots) {
-      const color = config?.term2?.term?.values?.[plot.seriesId]?.color || settings.color;
-      if (!plot.color) plot.color = color;
-      if (settings.displayMode == "dark") plot.color = rgb(plot.color).brighter(0.75);
-      if (plot.isHidden) continue;
-      if (plot.boxplot.out.length) {
-        const maxOut = plot.boxplot.out.reduce(
-          (a, b) => Math.max(a.value, b.value)
-        );
-        if (maxOut && maxOut.value > data.absMax) data.absMax = maxOut.value;
-        plot.boxplot.radius = this.outRadius;
-      }
-      plot.labColor = settings.displayMode == "dark" ? "white" : "black";
-      plot.boxplot.rectFill = settings.displayMode == "dark" ? "black" : settings.displayMode == "filled" ? color : "white";
-      plot.x = settings.isVertical ? this.horizPad / 2 + this.incrPad : this.totalLabelSize;
-      plot.y = this.topPad + (settings.isVertical ? settings.boxplotWidth + settings.labelPad : this.incrPad);
-      this.incrPad += this.totalRowSize;
-    }
-    return plots;
-  }
-};
-function getChartTitle(config, chartId) {
-  if (!config.term0) return chartId;
-  return config.term0.term.values && chartId in config.term0.term.values ? config.term0.term.values[chartId].label : chartId;
-}
-
-// plots/boxplot/view/BoxPlotToolTips.ts
-var BoxPlotToolTips = class {
-  constructor(plot, g, tip, isVertical) {
-    this.tablePadding = "3px";
-    this.plot = plot;
-    this.g = g;
-    this.boxplot = plot.boxplot;
-    this.isVertical = isVertical;
-    this.tip = tip;
-    this.addLabelTooltip();
-    this.addOutliersTooltip();
-  }
-  //Add rendering preferences here to maintain styles
-  //across all tooltip instances
-  addText(text) {
-    this.tip.d.append("div").text(text);
-  }
-  addLabelTooltip() {
-    if (Object.keys(this.plot.descrStats).length < 2) return;
-    this.boxplot.labelG.on("mouseover", (event) => {
-      this.tip.clear();
-      if (this.isVertical) this.tip.show(event.clientX, event.clientY);
-      else this.tip.showunder(this.boxplot.labelG.node());
-      const table = this.tip.d.append("table").attr("class", "sja_simpletable");
-      table.append("tr").style("text-align", "center").append("td").attr("colspan", 2).style("padding", this.tablePadding).text(this.plot.key);
-      for (const stat of Object.values(this.plot.descrStats)) {
-        const row = table.append("tr");
-        row.append("td").style("padding", this.tablePadding).style("opacity", 0.5).text(stat.label);
-        row.append("td").style("padding", this.tablePadding).style("text-align", "center").text(stat.value);
-      }
-    });
-    this.boxplot.labelG.on("mouseout", () => {
-      this.tip.hide();
-    });
-  }
-  // addLineToolTips() {
-  // 	const addToolTips = (elem, text: string) => {
-  // 		const elemBBox = elem.node().getBBox()
-  // 		//Add an expanded area for the tooltip
-  // 		//Easier for user to hover over
-  // 		this.g
-  // 			.append('rect')
-  // 			.attr('x', elemBBox.x - 10)
-  // 			.attr('y', elemBBox.y - 10)
-  // 			.attr('width', elemBBox.width + 20)
-  // 			.attr('height', elemBBox.height + 20)
-  // 			.attr('fill', 'transparent')
-  // 			.style('pointer-events', 'all')
-  // 			.on('mouseover', () => {
-  // 				this.tip.clear().showunder(elem.node())
-  // 				this.addText(text)
-  // 			})
-  // 			.on('mouseout', () => {
-  // 				this.tip.hide()
-  // 			})
-  // 	}
-  // 	if (this.boxplot.linep50) {
-  // 		const median = this.plot.descrStats.find((d: any) => d.id == 'median')
-  // 		if (!median) throw `Missing median value for ${this.plot.key}`
-  // 		addToolTips(this.boxplot.linep50, `Median: ${median.value}`)
-  // 	}
-  // 	if (this.boxplot.linew1) {
-  // 		addToolTips(this.boxplot.linew1, `${this.boxplot.w1}`)
-  // 	}
-  // 	if (this.boxplot.linew2) {
-  // 		addToolTips(this.boxplot.linew2, `${this.boxplot.w2}`)
-  // 	}
-  // }
-  addOutliersTooltip() {
-    this.g.selectAll("circle").data(this.boxplot.out).each((d, i, nodes) => {
-      const circle = select_default(nodes[i]);
-      circle.on("mouseover", () => {
-        this.tip.clear().showunder(circle.node());
-        this.addText(d.value);
-      });
-      circle.on("mouseout", () => {
-        this.tip.hide();
-      });
-    });
-  }
-};
-
-// plots/boxplot/view/BoxPlotLabelMenu.ts
-var BoxPlotLabelMenu = class {
-  constructor(plot, app, interactions, tip, isVertical) {
-    const options = [
-      {
-        text: `Add filter: ${plot.key}`,
-        isVisible: () => true,
-        callback: () => interactions.addFilter(plot)
-      },
-      {
-        text: `Hide ${plot.key}`,
-        isVisible: () => true,
-        callback: () => interactions.hidePlot(plot)
-      },
-      {
-        text: `List samples`,
-        isVisible: (state) => state.termdbConfig.displaySampleIds && app.vocabApi.hasVerifiedToken(),
-        callback: async (event) => {
-          if (isVertical) tip.clear().show(event.clientX, event.clientY);
-          else tip.clear().showunder(plot.boxplot.labelG.node());
-          const rows = await interactions.listSamples(plot);
-          const tableDiv = tip.d.append("div");
-          const columns = [{ label: "Sample" }, { label: "Value" }];
-          renderTable({
-            rows,
-            columns,
-            div: tableDiv,
-            maxWidth: "30vw",
-            maxHeight: "25vh",
-            resize: true,
-            showLines: true
-          });
-        }
-      }
-    ];
-    plot.boxplot.labelG.on("click", (event) => {
-      tip.clear();
-      if (isVertical) tip.show(event.clientX, event.clientY);
-      else tip.showunder(plot.boxplot.labelG.node());
-      const state = app.getState();
-      for (const opt of options) {
-        if (!opt.isVisible(state)) continue;
-        tip.d.append("div").classed("sja_menuoption", true).text(opt.text).on("click", (event2) => {
-          tip.hide();
-          opt.callback(event2);
-        });
-      }
-      if (plot.color) {
-        tip.d.append("div").style("padding", "5px 10px").style("display", "inline-block").text("Color:").append("input").attr("type", "color").property("value", rgb(plot.color).formatHex()).on("change", (event2) => {
-          interactions.updatePlotColor(plot, event2.target.value);
-          tip.hide();
-        });
-      }
-    });
-  }
-};
-
-// plots/boxplot/view/View.ts
-var View = class {
-  constructor(data, settings, dom, app, interactions) {
-    this.app = app;
-    this.dom = dom;
-    this.interactions = interactions;
-    this.settings = settings;
-    if (!data || !data.plots.length) return;
-    const plotDim = data.plotDim;
-    dom.div.style("background-color", plotDim.backgroundColor);
-    dom.svg.transition().attr("width", plotDim.svg.width).attr("height", plotDim.svg.height).style("fill", plotDim.backgroundColor);
-    const setScaleFunc = settings.isLogScale ? log().base(10) : linear();
-    const scale = setScaleFunc.domain(plotDim.domain).range(plotDim.range);
-    this.renderTitle(plotDim, dom);
-    this.renderBoxPlots(dom, data, scale, settings);
-    this.renderAxis(plotDim, dom, scale, settings);
-  }
-  renderTitle(plotDim, dom) {
-    dom.chartTitle.text(plotDim.chartTitle);
-    const transformStr = `translate(${plotDim.title.x}, ${plotDim.title.y})${this.settings.isVertical ? `,rotate(-90)` : ""}`;
-    dom.plotTitle.attr("class", "sjpp-boxplot-title").style("font-weight", 600).attr("text-anchor", "middle").attr("transform", transformStr).attr("fill", plotDim.textColor).text(plotDim.title.text.length > 80 ? plotDim.title.text.slice(0, 80) + "..." : plotDim.title.text);
-  }
-  //Fix for the axis rendering min -> max when the plot is vertical
-  renderAxis(plotDim, dom, scale, settings) {
-    if (settings.isVertical) scale.range([scale.range()[1], scale.range()[0]]);
-    const ticks = scale.ticks();
-    const tickValues = plotDim.axis.values(ticks);
-    dom.axis.attr("class", "sjpp-boxplot-axis").attr("transform", `translate(${plotDim.axis.x}, ${plotDim.axis.y})`).transition().call(
-      this.settings.isVertical ? axisLeft(scale).tickValues(tickValues).tickFormat((d) => plotDim.axis.format(d)).tickPadding(8) : axisTop(scale).tickValues(tickValues).tickFormat((d) => plotDim.axis.format(d))
-    );
-    axisstyle({
-      axis: dom.axis,
-      showline: true,
-      fontsize: 12,
-      color: plotDim.textColor
-    });
-  }
-  renderBoxPlots(dom, data, scale, settings) {
-    for (const plot of data.plots) {
-      const g = dom.boxplots.append("g").attr("class", "sjpp-boxplot-plot").attr("padding", "5px");
-      drawBoxplot({
-        bp: plot.boxplot,
-        g,
-        color: settings.displayMode == "filled" ? "black" : plot.color,
-        scale,
-        rowheight: settings.rowHeight,
-        labpad: settings.labelPad,
-        labColor: plot.labColor
-      });
-      const transformStr = `translate(${plot.x}, ${plot.y})${settings.isVertical ? `, rotate(-90)` : ""}`;
-      g.attr("transform", transformStr);
-      if (settings.isVertical) {
-        g.select("text").attr("transform", "rotate(45)");
-      }
-      new BoxPlotToolTips(plot, g, this.dom.tip, settings.isVertical);
-      if (data.plots.length > 1) {
-        const labelMenuTip = new Menu({ padding: "" });
-        new BoxPlotLabelMenu(
-          plot,
-          this.app,
-          this.interactions,
-          labelMenuTip,
-          settings.isVertical
-        );
-      }
-    }
-  }
-};
-
-// plots/boxplot/interactions/ListSamples.ts
-var ListSamples = class {
-  constructor(app, state, id, plot, getRange = true) {
-    this.app = app;
-    this.plot = plot;
-    const plotConfig = state.plots.find((p) => p.id === id);
-    if (!plotConfig) throw "Box plot not found [ListSamples]";
-    try {
-      const min = plot.descrStats.min.value;
-      const max = plot.descrStats.max.value;
-      this.tvslst = this.getTvsLst(min, max, getRange, plotConfig.term, plotConfig.term2);
-    } catch (e) {
-      console.error(e.message || e);
-    }
-    this.term = plotConfig.term.q?.mode === "continuous" ? plotConfig.term : plotConfig.term2;
-    const filter = {
-      type: "tvslst",
-      join: "and",
-      lst: [state.termfilter.filter, this.tvslst],
-      in: true
-    };
-    this.dataOpts = {
-      terms: [this.term],
-      filter
-    };
-  }
-  async getData() {
-    return await this.app.vocabApi.getAnnotatedSampleData(this.dataOpts);
-  }
-  setRows(data) {
-    const rows = [];
-    for (const [c, k] of Object.entries(data.samples))
-      rows.push([
-        { value: data.refs.bySampleId[c].label },
-        { value: Number(roundValueAuto(k[this.term.$id].value)) }
-      ]);
-    return rows;
-  }
-  createTvsTerm(tw, tvslst) {
-    tvslst.lst.push({
-      type: "tvs",
-      tvs: {
-        term: tw.term
-      }
-    });
-  }
-  createTvsLstValues(tw, tvslst, lstIdx) {
-    this.createTvsTerm(tw, tvslst);
-    if (tw.term.type === "samplelst") {
-      const key = this.plot.seriesId;
-      const ids = tw.term.values[key].list.map((s) => s.sampleId);
-      const tvs = getSamplelstFilter(ids).lst[0];
-      tvslst.lst[lstIdx] = tvs;
-    } else tvslst.lst[lstIdx].tvs.values = [{ key: this.plot.seriesId, label: this.plot.key }];
-    if (tw.term.type === "condition") {
-      Object.assign(tvslst.lst[lstIdx].tvs, {
-        bar_by_grade: tw.q?.bar_by_grade || null,
-        value_by_max_grade: tw.q.value_by_max_grade
-      });
-    }
-  }
-  createTvsLstRanges(tw, tvslst, rangeStart, rangeStop, lstIdx) {
-    this.createTvsTerm(tw, tvslst);
-    tvslst.lst[lstIdx].tvs.ranges = [
-      {
-        //Only show integers for integer terms
-        start: tw.term.type == "integer" ? Math.round(rangeStart) : rangeStart,
-        stop: tw.term.type == "integer" ? Math.round(rangeStop) : rangeStop,
-        startinclusive: true,
-        stopinclusive: true,
-        startunbounded: false,
-        stopunbounded: false
-      }
-    ];
-  }
-  assignPlotRangeRanges() {
-    const { start, stop, startinclusive, stopinclusive, startunbounded, stopunbounded } = this.plot.overlayBins || {};
-    return [
-      {
-        start: start ?? null,
-        stop: stop ?? null,
-        startinclusive: startinclusive ?? true,
-        stopinclusive: stopinclusive ?? false,
-        startunbounded: startunbounded ?? null,
-        stopunbounded: stopunbounded ?? null
-      }
-    ];
-  }
-  isContinuousOrBinned(tw2) {
-    if (!("mode" in tw2.q)) return;
-    return tw2.q?.mode === "continuous" || ["float", "integer"].includes(tw2.term?.type) && this.plot.overlayBins != null;
-  }
-  getTvsLst(rangeStart, rangeStop, getRange = true, tw1, tw2) {
-    const tvslst = {
-      type: "tvslst",
-      in: true,
-      join: "and",
-      lst: []
-    };
-    const isTw1CategoricalOrCondition = ["categorical", "condition"].includes(tw1.term.type);
-    if (tw2) {
-      if (isTw1CategoricalOrCondition) {
-        this.createTvsLstValues(tw1, tvslst, 0);
-        if (getRange) this.createTvsLstRanges(tw2, tvslst, rangeStart, rangeStop, 1);
-      } else if (this.isContinuousOrBinned(tw2)) {
-        this.createTvsTerm(tw2, tvslst);
-        tvslst.lst[0].tvs.ranges = this.assignPlotRangeRanges();
-        if (getRange) this.createTvsLstRanges(tw1, tvslst, rangeStart, rangeStop, 1);
-      } else {
-        this.createTvsLstValues(tw2, tvslst, 0);
-        if (getRange) this.createTvsLstRanges(tw1, tvslst, rangeStart, rangeStop, 1);
-      }
-    } else {
-      if (getRange) this.createTvsLstRanges(tw1, tvslst, rangeStart, rangeStop, 0);
-    }
-    return tvslst;
-  }
-};
-
-// plots/boxplot/interactions/BoxPlotInteractions.ts
-var BoxPlotInteractions = class {
-  constructor(app, dom, id) {
-    this.app = app;
-    this.dom = dom;
-    this.id = id;
-  }
-  help() {
-    window.open("https://github.com/stjude/proteinpaint/wiki/Box-plot");
-  }
-  /** Option to add a global filter from the box plot label menu. */
-  addFilter(plot) {
-    const config = this.app.getState();
-    const sampleList = new ListSamples(this.app, config, this.id, plot, false);
-    const filterUiRoot = getFilterItemByTag(config.termfilter.filter, "filterUiRoot");
-    const filter = filterJoin([filterUiRoot, sampleList.tvslst]);
-    filter.tag = "filterUiRoot";
-    this.app.dispatch({
-      type: "filter_replace",
-      filter
-    });
-  }
-  /** Option to hide a plot from the box plot label menu. */
-  hidePlot(plot) {
-    const plotConfig = this.app.getState().plots.find((p) => p.id === this.id);
-    const config = structuredClone(plotConfig);
-    const contTerm = config.term.q.mode == "continuous" ? "term2" : "term";
-    if (!config[contTerm].q.hiddenValues) config[contTerm].q.hiddenValues = {};
-    config[contTerm].q.hiddenValues[plot.key] = 1;
-    this.app.dispatch({
-      type: "plot_edit",
-      id: this.id,
-      config
-    });
-  }
-  /** Trigger when clicking on a hidden plot in the legend */
-  unhidePlot(item) {
-    const plotConfig = this.app.getState().plots.find((p) => p.id === this.id);
-    const config = structuredClone(plotConfig);
-    const contTerm = config.term.q.mode == "continuous" ? "term2" : "term";
-    delete config[contTerm].q.hiddenValues[item.key];
-    this.app.dispatch({
-      type: "plot_edit",
-      id: this.id,
-      config
-    });
-  }
-  /** Option from box plot label to show the samples in a table within the tooltip. */
-  async listSamples(plot) {
-    const config = this.app.getState();
-    const sampleList = new ListSamples(this.app, config, this.id, plot);
-    const data = await sampleList.getData();
-    const rows = sampleList.setRows(data);
-    return rows;
-  }
-  /** Callback for color picker in plot(s) label menu */
-  updatePlotColor(plot, color) {
-    if (!plot.seriesId) return;
-    const plotConfig = this.app.getState().plots.find((p) => p.id === this.id);
-    const config = structuredClone(plotConfig);
-    config.term2.term.values[plot.seriesId].color = color;
-    this.app.dispatch({
-      type: "plot_edit",
-      id: this.id,
-      config
-    });
-  }
-  clearDom() {
-    this.dom.error.style("padding", "").text("");
-    this.dom.charts.selectAll("*").remove();
-    this.dom.legend.selectAll("*").remove();
-  }
-};
-
-// plots/boxplot/view/LegendRender.ts
-var LegendRenderer = class {
-  constructor(legendDiv, legendData, interactions, textColor) {
-    this.interactions = interactions;
-    this.textColor = textColor;
-    this.renderLegend(legendDiv, legendData);
-  }
-  renderLegend(legendDiv, legendData) {
-    legendDiv.attr("id", "sjpp-boxplot-legend");
-    for (const section of legendData) {
-      legendDiv.append("div").style("opacity", "0.5").style("color", this.textColor).text(section.label);
-      const sectionDiv = legendDiv.append("div").style("padding-left", "10px");
-      for (const item of section.items) {
-        this.addItem(item, sectionDiv);
-      }
-    }
-  }
-  addItem(item, sectionDiv) {
-    const legendItem = sectionDiv.append("div");
-    if (item.isPlot) {
-      legendItem.append("div").style("display", "inline-block").style("margin-right", "3px").style("position", "relative").style("vertical-align", "middle").html(`<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="${this.textColor}" class="bi bi-arrow-counterclockwise" viewBox="0 0 16 16" style="vertical-align: middle; display: block; margin: auto;">
-                <path stroke="#000" stroke-width="0.25" fill-rule="evenodd" d="M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2v1z"/>
-                <path d="M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466z"/>
-                </svg>`);
-    }
-    legendItem.append("div").style("display", "inline-block").style("color", this.textColor).style("text-decoration", item.isHidden ? "line-through" : "").text(item.text);
-    if (item.isPlot) {
-      legendItem.attr("aria-label", `Click to unhide plot`).on("click", () => {
-        this.interactions.unhidePlot(item);
-      });
-    }
-  }
-};
-
-// plots/boxplot/BoxPlot.ts
-var TdbBoxplot = class _TdbBoxplot extends PlotBase {
-  constructor(opts, api) {
-    super(opts);
-    this.useDefaultSettings = true;
-    this.opts = opts;
-    this.api = api;
-    this.type = _TdbBoxplot.type;
-    this.components = {
-      controls: {}
-    };
-    if (opts?.parentId) this.parentId = opts.parentId;
-    const holder = opts.holder.classed("sjpp-boxplot-main", true);
-    const controls = opts.controls ? holder : holder.append("div");
-    const div = holder.append("div");
-    const errorDiv = div.append("div").attr("class", "sjpp-boxplot-error").style("opacity", 0.75);
-    const chartsDiv = div.append("div").attr("class", "sjpp-boxplot-charts").style("display", "flex").style("flex-direction", "row").style("flex-wrap", "wrap").style("max-width", "100vw");
-    this.dom = {
-      controls,
-      div,
-      error: errorDiv,
-      charts: chartsDiv,
-      legend: div.append("div").attr("class", "sjpp-boxplot-legend").style("margin-top", "25px"),
-      tip: new Menu()
-    };
-    if (opts.header) this.dom.header = opts.header.html("Box plot");
-  }
-  static {
-    this.type = "boxplot";
-  }
-  async setControls() {
-    const inputs = [
-      {
-        type: "term",
-        configKey: "term",
-        chartType: "boxplot",
-        usecase: { target: "boxplot", detail: "term" },
-        label: renderTerm1Label,
-        vocabApi: this.app.vocabApi,
-        menuOptions: "edit"
-      },
-      {
-        type: "term",
-        configKey: "term2",
-        chartType: "boxplot",
-        usecase: { target: "boxplot", detail: "term2" },
-        title: "Overlay data",
-        label: "Overlay",
-        vocabApi: this.app.vocabApi,
-        numericEditMenuVersion: this.opts.numericEditMenuVersion || ["continuous", "discrete"],
-        defaultQ4fillTW: term0_term2_defaultQ
-      },
-      {
-        type: "term",
-        configKey: "term0",
-        chartType: "boxplot",
-        usecase: { target: "boxplot", detail: "term0" },
-        title: "Divide by data",
-        label: "Divide by",
-        vocabApi: this.app.vocabApi,
-        numericEditMenuVersion: this.opts.numericEditMenuVersion || ["continuous", "discrete"],
-        defaultQ4fillTW: term0_term2_defaultQ
-      },
-      {
-        label: "Order by",
-        title: "Order box plots by parameters",
-        type: "radio",
-        chartType: "boxplot",
-        settingsKey: "orderByMedian",
-        options: [
-          { label: "Default", value: false },
-          { label: "Median values", value: true }
-        ],
-        getDisplayStyle: () => {
-          let style = "none";
-          for (const k of Object.keys(this.data.charts)) {
-            const chart = this.data.charts[k];
-            if (chart.plots.length > 1) style = "";
-          }
-          return style;
-        }
-      },
-      {
-        label: "Scale",
-        title: "Change the axis scale",
-        type: "radio",
-        chartType: "boxplot",
-        settingsKey: "isLogScale",
-        options: [
-          { label: "Linear", value: false },
-          { label: "Log10", value: true }
-        ]
-      },
-      {
-        label: "Orientation",
-        title: "Change the orientation of the box plots",
-        type: "radio",
-        chartType: "boxplot",
-        settingsKey: "isVertical",
-        options: [
-          { label: "Vertical", value: true },
-          { label: "Horizontal", value: false }
-        ]
-      },
-      {
-        label: "Width",
-        title: "Set the width of the entire plot",
-        type: "number",
-        chartType: "boxplot",
-        settingsKey: "boxplotWidth",
-        debounceInterval: 500
-      },
-      {
-        label: "Plot height",
-        title: "Set the height of each box plot between 20 and 50",
-        type: "number",
-        chartType: "boxplot",
-        settingsKey: "rowHeight",
-        step: 1,
-        max: 50,
-        min: 20,
-        debounceInterval: 500,
-        processInput: (val) => {
-          if (this.useDefaultSettings == true) this.useDefaultSettings = false;
-          return val;
-        }
-      },
-      {
-        label: "Plot padding",
-        title: "Set the space between each box plot. Number must be between 10 and 20",
-        type: "number",
-        chartType: "boxplot",
-        settingsKey: "rowSpace",
-        step: 1,
-        max: 20,
-        min: 10,
-        debounceInterval: 500,
-        processInput: (val) => {
-          if (this.useDefaultSettings == true) this.useDefaultSettings = false;
-          return val;
-        }
-      },
-      {
-        label: "Default color",
-        type: "color",
-        chartType: "boxplot",
-        settingsKey: "color",
-        getDisplayStyle: () => {
-          let style = "";
-          for (const k of Object.keys(this.data.charts)) {
-            const chart = this.data.charts[k];
-            if (chart.plots.length > 1) style = "none";
-          }
-          return style;
-        }
-      },
-      {
-        label: "Display mode",
-        title: "Apply a dark theme to the plot",
-        type: "radio",
-        chartType: "boxplot",
-        settingsKey: "displayMode",
-        options: [
-          { label: "Default", value: "default" },
-          { label: "Filled", value: "filled" },
-          { label: "Dark mode", value: "dark" }
-        ]
-      },
-      {
-        label: "Remove outliers",
-        boxLabel: "",
-        type: "checkbox",
-        chartType: "boxplot",
-        settingsKey: "removeOutliers",
-        title: `Option to remove outliers from the analysis`
-      }
-    ];
-    this.components.controls = await controlsInit({
-      app: this.app,
-      id: this.id,
-      holder: this.dom.controls.attr("class", "pp-termdb-plot-controls").style("display", "inline-block"),
-      inputs
-    });
-    this.components.controls.on("downloadClick.boxplot", (event) => {
-      this.download(event);
-    });
-    this.components.controls.on("helpClick.boxplot", () => {
-      this.interactions.help();
-    });
-  }
-  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)?`;
-    }
-    const parentConfig = appState.plots.find((p) => p.id === this.parentId);
-    const termfilter = getCombinedTermFilter(appState, parentConfig?.filter);
-    return {
-      termfilter,
-      config: Object.assign({}, config, {
-        settings: {
-          boxplot: config.settings.boxplot
-        }
-      })
-    };
-  }
-  async init() {
-    this.dom.div.style("display", "inline-block").style("margin-left", "20px");
-    this.interactions = new BoxPlotInteractions(this.app, this.dom, this.id);
-    try {
-      await this.setControls();
-    } catch (e) {
-      console.error(new Error(e.message || e));
-    }
-  }
-  async main() {
-    try {
-      const config = structuredClone(this.state.config);
-      if (config.childType != this.type && config.chartType != this.type) return;
-      if (!this.interactions) throw "Interactions not initialized [box plot main()]";
-      const settings = config.settings.boxplot;
-      const model = new Model(config, this.state, this.app, settings);
-      const data = await model.getData();
-      config.term.q.descrStats = data.descrStats;
-      if (data.error) throw data.error;
-      if (!data.charts || !Object.keys(data.charts).length) {
-        this.interactions.clearDom();
-        this.dom.error.style("padding", "20px 20px 20px 60px").text("No visible box plot data to render");
-        return;
-      }
-      this.data = data;
-      this.dom.charts.selectAll("*").remove();
-      const labels = [];
-      const tempsvg = this.dom.charts.append("svg");
-      for (const key of Object.keys(data.charts)) {
-        const chart = data.charts[key];
-        const chartLabels = chart.plots.filter((p) => !p.isHidden).map((p) => p.boxplot.label);
-        labels.push(...chartLabels);
-      }
-      const maxLabelLgth = getMaxLabelWidth(tempsvg.append("g"), labels);
-      tempsvg.remove();
-      const legend = [];
-      for (const key of Object.keys(data.charts)) {
-        const chart = data.charts[key];
-        chart.absMin = data.absMin;
-        chart.absMax = data.absMax;
-        chart.uncomputableValues = data.uncomputableValues;
-        const viewModel = new ViewModel(config, chart, settings, maxLabelLgth, this.useDefaultSettings);
-        for (const l of viewModel.viewData.legend) {
-          if (!legend.find((x) => x.label == l.label)) legend.push(l);
-        }
-        if ((viewModel.rowSpace !== settings.rowSpace || viewModel.rowHeight !== settings.rowHeight) && this.useDefaultSettings == true) {
-          settings.rowSpace = viewModel.rowSpace;
-          settings.rowHeight = viewModel.rowHeight;
-          this.app.save({
-            type: "plot_edit",
-            id: this.id,
-            config: {
-              settings: {
-                boxplot: {
-                  rowSpace: viewModel.rowSpace,
-                  rowHeight: viewModel.rowHeight
-                }
-              }
-            }
-          });
-        }
-        const chartDiv = this.dom.charts.append("div").attr("class", "sjpp-boxplot-chartDiv").style("padding", Object.keys(data.charts).length > 1 ? "20px 20px 0px 0px" : "0px");
-        const chartSvg = chartDiv.append("svg");
-        chart.svg = chartSvg;
-        const chartTitle = chartDiv.append("div").attr("class", "pp-chart-title").style("display", config.term0 ? "block" : "none").style("text-align", "center").style("font-size", "1.1em").style("margin-bottom", "20px");
-        const chartDom = Object.assign({}, this.dom, {
-          svg: chartSvg,
-          chartTitle,
-          plotTitle: chartSvg.append("text"),
-          axis: chartSvg.append("g"),
-          boxplots: chartSvg.append("g")
-        });
-        new View(viewModel.viewData, settings, chartDom, this.app, this.interactions);
-      }
-      this.dom.legend.selectAll("*").remove();
-      const textColor = settings.displayMode == "dark" ? "white" : "black";
-      if (legend.length) new LegendRenderer(this.dom.legend, legend, this.interactions, textColor);
-    } catch (e) {
-      if (e.stack) console.log(e.stack);
-      if (e instanceof Error) console.error(e.message || e);
-      throw e;
-    }
-  }
-  getChartImages() {
-    const chartImages = [];
-    const charts = this.data.charts;
-    for (const [key, chart] of Object.entries(charts)) {
-      const svg = chart.svg;
-      const title = getChartTitle(this.state.config, key);
-      const name = `${this.state.config.term.term.name}  ${title}`;
-      chartImages.push({ name, svg, parent: svg.node() });
-    }
-    return chartImages;
-  }
-  download(event) {
-    if (!this.state) return;
-    const name2svg = this.getChartImages();
-    const dm = new DownloadMenu(name2svg, this.state.config.term.term.name);
-    dm.show(event.clientX, event.clientY);
-  }
-};
-var boxplotInit = getCompInit(TdbBoxplot);
-var componentInit = boxplotInit;
-function getDefaultBoxplotSettings(app, overrides = {}) {
-  const defaults = {
-    boxplotWidth: 550,
-    color: plotColor,
-    displayMode: "default",
-    labelPad: 10,
-    isLogScale: false,
-    isVertical: false,
-    orderByMedian: false,
-    rowHeight: 50,
-    rowSpace: 15,
-    removeOutliers: false
-  };
-  return Object.assign(defaults, overrides);
-}
-async function getPlotConfig(opts, app) {
-  if (!opts.term) throw "opts.term{} missing [boxplot getPlotConfig()]";
-  try {
-    await fillTermWrapper(opts.term, app.vocabApi);
-    if (opts.term2) await fillTermWrapper(opts.term2, app.vocabApi);
-    if (opts.term0) await fillTermWrapper(opts.term0, app.vocabApi);
-  } catch (e) {
-    console.error(new Error(`${e} [boxplot getPlotConfig()]`));
-    throw `boxplot getPlotConfig() failed`;
-  }
-  const config = {
-    id: opts.term.term.id,
-    settings: {
-      controls: {
-        term2: null,
-        term0: null
-      },
-      boxplot: getDefaultBoxplotSettings(app, opts.overrides || {})
-    }
-  };
-  return copyMerge(config, opts);
-}
-
-export {
-  boxplotInit,
-  componentInit,
-  getDefaultBoxplotSettings,
-  getPlotConfig
-};
-//# sourceMappingURL=chunk-SYBOIAA5.js.map