@sjcrh/proteinpaint-client 2.181.0 → 2.183.0

package/dist/NumSplineEditor-KE4UPODZ.js

@@ -0,0 +1,190 @@
+import {
+  keyupEnter
+} from "./chunk-OXJ2TWDO.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-V6DLLX4N.js";
+import "./chunk-7RN3L2BX.js";
+import "./chunk-A6TQGNDQ.js";
+import "./chunk-HYZG6OPC.js";
+import "./chunk-FN5XPUPH.js";
+import {
+  HandlerBase
+} from "./chunk-LSEFWW72.js";
+import "./chunk-5EF5U7MX.js";
+import "./chunk-2K5DSRBJ.js";
+import "./chunk-UCLS2SVB.js";
+import "./chunk-MVTCBVSX.js";
+import "./chunk-SEQLC4AD.js";
+import "./chunk-L4QG7XZE.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-KQMEJUWI.js";
+import "./chunk-UJU3Q7QJ.js";
+import "./chunk-WGL6FIUE.js";
+import "./chunk-6ITDJ5UR.js";
+import "./chunk-XYFDBYOY.js";
+import "./chunk-TV74I3Y5.js";
+import "./chunk-IH7ILDJS.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-TOU7EVFQ.js";
+import "./chunk-OAWQ6LOO.js";
+import "./chunk-SEEYV6P2.js";
+import "./chunk-NDWTN4U5.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-HFNDKYVF.js";
+
+// termsetting/handlers/NumSplineEditor.ts
+var NumSplineEditor = class extends HandlerBase {
+  constructor(opts, handler) {
+    super(opts);
+    this.dom = {};
+    this.default_knots_count = 4;
+    this.opts = opts;
+    this.handler = handler;
+    this.tw = handler.tw;
+  }
+  async getDefaultQ() {
+    const tw = this.termsetting.tw;
+    if (tw.q.mode == "spline") {
+      return JSON.parse(JSON.stringify(tw.q));
+    }
+    return await this.getKnots(this.default_knots_count);
+  }
+  async getKnots(knot_count) {
+    const middle_knot_count = knot_count - 2;
+    const t = this.tw.term;
+    const knots = [];
+    const percentile_lst = [5];
+    const second_knot_perc = (90 / (middle_knot_count + 1)).toFixed(0);
+    for (let i = 1; i < middle_knot_count + 1; i++) {
+      percentile_lst.push(i * second_knot_perc);
+    }
+    percentile_lst.push(95);
+    const values = await this.getPercentile2Value(percentile_lst);
+    for (const val of values) {
+      knots.push({ value: val.toFixed(t.type == "integer" ? 0 : 2) });
+    }
+    return {
+      mode: "spline",
+      knots
+    };
+  }
+  async getPercentile2Value(percentile_lst) {
+    const vocabApi = this.termsetting.vocabApi;
+    const data = await vocabApi.getPercentile(this.tw.term, percentile_lst, vocabApi.state?.termfilter);
+    if (data.error || !data.values.length || !data.values.every((v) => Number.isFinite(v)))
+      throw "cannot get median value: " + (data.error || "no data");
+    const perc_values = [...new Set(data.values)];
+    return perc_values;
+  }
+  async showEditMenu(div) {
+    if (this.dom.density_div) {
+      if (this.handler.dom.editDiv?.node().contains(this.dom.density_div.node())) {
+        await this.handler.density.showViolin(this.dom.density_div, this.getBoundaryOpts());
+        return;
+      } else {
+        this.dom.density_div.remove();
+        delete this.dom.density_div;
+      }
+    }
+    this.q = await this.getDefaultQ();
+    this.dom.density_div = div.append("div");
+    await this.handler.density.showViolin(this.dom.density_div);
+    await this.handler.density.setBinLines(this.getBoundaryOpts());
+    this.dom.knots_div = div.append("div").style("padding", "5px");
+    this.renderCustomSplineInputs();
+    this.renderAutoSplineInputs();
+  }
+  getBoundaryOpts() {
+    return {
+      values: this.q.knots.map((k) => {
+        return {
+          //this.q.lst[0].map(bin => ({ x: bin.startunbounded ? bin.stop : bin.start, isDraggable: true })),
+          x: k.value,
+          isDraggable: true
+        };
+      }),
+      callback: (d, value) => {
+        this.q.knots[d.index].value = value;
+        this.dom.customKnotsInput.property("value", this.q.knots.map((k) => k.value).join("\n"));
+      }
+    };
+  }
+  /******************* Functions for Custom Spline knots *******************/
+  renderCustomSplineInputs() {
+    this.dom.custom_knots_div = this.dom.knots_div.append("div");
+    this.dom.custom_knots_div.append("div").style("display", "inline-block").style("vertical-align", "top").style("padding", "3px 15px").style("font-weight", "normal").style("color", "rgb(136, 136, 136)").html("Knots");
+    this.dom.customKnotsInput = this.dom.custom_knots_div.append("div").style("display", "inline-block").style("padding", "3px 15px").style("padding-left", "5px").append("textarea").style("height", "100px").style("width", "100px").text(this.q.knots.map((d) => d.value).join("\n")).on("change", () => {
+      this.q.knots = this.processKnotsInputs();
+      this.handler.density.setBinLines(this.getBoundaryOpts());
+    }).on("keyup", async (event) => {
+      if (!keyupEnter(event) && event.key != 8) return;
+      this.q.knots = this.processKnotsInputs();
+      this.handler.density.setBinLines(this.getBoundaryOpts());
+    });
+    this.dom.custom_knots_div.append("div").style("display", "inline-block").style("vertical-align", "top").style("font-size", ".7em").style("padding", "3px 15px").style("padding-left", "5px").style("color", "rgb(136, 136, 136)").html(`Enter knot values, one knot per line.</br> 
+				Adjust knot by dragging on the vertical line.</br>
+			 	Or autocompute knots from below.`);
+  }
+  // apply custom knots if changed from density plot to textarea
+  updateCustomSplineInputs() {
+    this.dom.customKnotsInput.property("value", this.q.knots.map((d) => d.value).join("\n"));
+  }
+  // apply custom knots to this.q.knots
+  processKnotsInputs() {
+    const data = this.dom.customKnotsInput.property("value").split("\n").filter((d) => d != "").map((d) => +d).sort((a, b) => a - b).map((d) => {
+      const knot = {
+        value: +d
+      };
+      return knot;
+    });
+    return data;
+  }
+  /******************* Functions for Auto Spline knots *******************/
+  renderAutoSplineInputs() {
+    const div = this.dom.knots_div;
+    const knot_count = 4;
+    const default_knot_count = knot_count;
+    this.dom.knot_select_div = div.append("div");
+    this.dom.knot_select_div.append("div").style("display", "inline-block").style("margin-left", "15px").style("color", "rgb(136, 136, 136)").html("Autocompute");
+    const knot_ct_select = this.dom.knot_select_div.append("select").attr("data-testid", "num-spline-editor-num-knots").style("margin-left", "10px").style("margin-bottom", "7px");
+    for (let i = default_knot_count - 1; i < default_knot_count + 5; i++) {
+      knot_ct_select.append("option").attr("value", i).html(i);
+    }
+    knot_ct_select.node().value = this.q.knots?.length || this.default_knots_count;
+    this.dom.knot_select_div.append("div").style("display", "inline-block").style("margin-left", "10px").style("color", "rgb(136, 136, 136)").html("knots");
+    this.dom.knot_select_div.append("button").style("margin", "15px").html("Compute").on("click", async () => {
+      const desired_knots_ct = Number.parseInt(knot_ct_select.node().value);
+      let requested_knots_ct = Number.parseInt(knot_ct_select.node().value);
+      while (this.q.knots.length != desired_knots_ct) {
+        await this.getKnots(requested_knots_ct);
+        requested_knots_ct = requested_knots_ct + 1;
+      }
+      this.updateCustomSplineInputs();
+    });
+    this.dom.knot_select_div.append("div").style("display", "inline-block").style("font-size", ".7em").style("padding", "3px 15px").style("padding-left", "5px").style("color", "rgb(136, 136, 136)").html("Will overwrite existing values.");
+  }
+  getEditedQ(destroyDom = true) {
+    const knots = this.processKnotsInputs();
+    if (destroyDom) {
+      for (const name of Object.keys(this.dom)) {
+        this.dom[name].remove();
+        delete this.dom[name];
+      }
+    }
+    return {
+      mode: "spline",
+      knots
+    };
+  }
+  async undoEdits() {
+    this.q = await this.getDefaultQ();
+    this.dom.knots_div.selectAll("*").remove();
+    await this.handler.density.setBinLines(this.getBoundaryOpts());
+    this.renderCustomSplineInputs();
+    this.renderAutoSplineInputs();
+  }
+};
+export {
+  NumSplineEditor
+};
+//# sourceMappingURL=NumSplineEditor-KE4UPODZ.js.map

package/dist/NumSplineEditor-KE4UPODZ.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../termsetting/handlers/NumSplineEditor.ts"],
+  "sourcesContent": ["import { keyupEnter } from '#src/client'\nimport type { NumSpline } from '#tw'\nimport type { NumericHandler } from './NumericHandler.ts'\nimport type { BoundaryOpts, LineData } from './NumericDensity.ts'\nimport type { SplineNumericQ, Handler } from '#types'\nimport { HandlerBase } from '../HandlerBase.ts'\n\nexport class NumSplineEditor extends HandlerBase implements Handler {\n\ttw: NumSpline\n\tq!: SplineNumericQ\n\thandler: NumericHandler\n\t//termsetting: TermSetting\n\topts: any\n\tdom: {\n\t\t[elemName: string]: any\n\t} = {}\n\n\tdefault_knots_count: number = 4\n\n\tconstructor(opts, handler) {\n\t\tsuper(opts)\n\t\tthis.opts = opts\n\t\tthis.handler = handler\n\t\tthis.tw = handler.tw\n\t}\n\n\tasync getDefaultQ() {\n\t\t//const q00 = tw.q\n\t\t// TODO *** validate this.q ***//\n\t\tconst tw = this.termsetting.tw as NumSpline\n\t\tif (tw.q.mode == 'spline') {\n\t\t\treturn JSON.parse(JSON.stringify(tw.q))\n\t\t}\n\t\t// create default knots when menu renderes for first time\n\t\treturn await this.getKnots(this.default_knots_count)\n\t\t//*** validate this.q ***//\n\t}\n\n\tasync getKnots(knot_count: any) {\n\t\t// qnery knots from backend\n\t\t// knots are calcualted by node backend, 1st knot at 5 percentile,\n\t\t// last knot at 95, and inbetween knots at equidistance\n\t\tconst middle_knot_count = knot_count - 2\n\t\tconst t = this.tw.term\n\t\tconst knots: { value: number }[] = []\n\t\tconst percentile_lst = [5]\n\t\tconst second_knot_perc: any = (90 / (middle_knot_count + 1)).toFixed(0)\n\t\tfor (let i = 1; i < middle_knot_count + 1; i++) {\n\t\t\tpercentile_lst.push(i * second_knot_perc)\n\t\t}\n\t\tpercentile_lst.push(95)\n\t\tconst values: any = await this.getPercentile2Value(percentile_lst)\n\t\tfor (const val of values) {\n\t\t\tknots.push({ value: val.toFixed(t.type == 'integer' ? 0 : 2) })\n\t\t}\n\n\t\treturn {\n\t\t\tmode: 'spline',\n\t\t\tknots\n\t\t}\n\t}\n\n\tasync getPercentile2Value(percentile_lst: any) {\n\t\tconst vocabApi = this.termsetting.vocabApi\n\t\tconst data = await vocabApi.getPercentile(this.tw.term, percentile_lst, vocabApi.state?.termfilter)\n\t\tif (data.error || !data.values.length || !data.values.every(v => Number.isFinite(v)))\n\t\t\tthrow 'cannot get median value: ' + (data.error || 'no data')\n\t\tconst perc_values = [...new Set(data.values)]\n\t\treturn perc_values\n\t}\n\n\tasync showEditMenu(div) {\n\t\tif (this.dom.density_div) {\n\t\t\tif (this.handler.dom.editDiv?.node().contains(this.dom.density_div.node())) {\n\t\t\t\tawait this.handler.density.showViolin(this.dom.density_div, this.getBoundaryOpts())\n\t\t\t\treturn\n\t\t\t} else {\n\t\t\t\tthis.dom.density_div.remove()\n\t\t\t\tdelete this.dom.density_div\n\t\t\t}\n\t\t}\n\t\tthis.q = await this.getDefaultQ()\n\t\tthis.dom.density_div = div.append('div')\n\t\tawait this.handler.density.showViolin(this.dom.density_div)\n\t\tawait this.handler.density.setBinLines(this.getBoundaryOpts())\n\t\tthis.dom.knots_div = div.append('div').style('padding', '5px')\n\t\tthis.renderCustomSplineInputs()\n\t\tthis.renderAutoSplineInputs()\n\t}\n\n\tgetBoundaryOpts(): BoundaryOpts {\n\t\treturn {\n\t\t\tvalues: this.q.knots.map(k => {\n\t\t\t\treturn {\n\t\t\t\t\t//this.q.lst[0].map(bin => ({ x: bin.startunbounded ? bin.stop : bin.start, isDraggable: true })),\n\t\t\t\t\tx: k.value,\n\t\t\t\t\tisDraggable: true\n\t\t\t\t}\n\t\t\t}),\n\t\t\tcallback: (d: LineData, value) => {\n\t\t\t\tthis.q.knots[d.index].value = value\n\t\t\t\tthis.dom.customKnotsInput.property('value', this.q.knots.map(k => k.value).join('\\n'))\n\t\t\t\t//this.renderCustomSplineInputs()\n\t\t\t\t//this.renderAutoSplineInputs()\n\t\t\t}\n\t\t}\n\t}\n\n\t/******************* Functions for Custom Spline knots *******************/\n\trenderCustomSplineInputs() {\n\t\tthis.dom.custom_knots_div = this.dom.knots_div.append('div')\n\n\t\tthis.dom.custom_knots_div\n\t\t\t.append('div')\n\t\t\t.style('display', 'inline-block')\n\t\t\t.style('vertical-align', 'top')\n\t\t\t.style('padding', '3px 15px')\n\t\t\t.style('font-weight', 'normal')\n\t\t\t.style('color', 'rgb(136, 136, 136)')\n\t\t\t.html('Knots')\n\n\t\tthis.dom.customKnotsInput = this.dom.custom_knots_div\n\t\t\t.append('div')\n\t\t\t.style('display', 'inline-block')\n\t\t\t.style('padding', '3px 15px')\n\t\t\t.style('padding-left', '5px')\n\t\t\t.append('textarea')\n\t\t\t.style('height', '100px')\n\t\t\t.style('width', '100px')\n\t\t\t.text(this.q.knots.map((d: any) => d.value).join('\\n'))\n\t\t\t.on('change', () => {\n\t\t\t\tthis.q.knots = this.processKnotsInputs()\n\t\t\t\tthis.handler.density.setBinLines(this.getBoundaryOpts())\n\t\t\t})\n\t\t\t.on('keyup', async (event: any) => {\n\t\t\t\t// enter or backspace/delete\n\t\t\t\t// i don't think backspace works\n\t\t\t\tif (!keyupEnter(event) && event.key != 8) return\n\t\t\t\tthis.q.knots = this.processKnotsInputs()\n\t\t\t\tthis.handler.density.setBinLines(this.getBoundaryOpts())\n\t\t\t})\n\n\t\tthis.dom.custom_knots_div\n\t\t\t.append('div')\n\t\t\t.style('display', 'inline-block')\n\t\t\t.style('vertical-align', 'top')\n\t\t\t.style('font-size', '.7em')\n\t\t\t.style('padding', '3px 15px')\n\t\t\t.style('padding-left', '5px')\n\t\t\t.style('color', 'rgb(136, 136, 136)').html(`Enter knot values, one knot per line.</br> \n\t\t\t\tAdjust knot by dragging on the vertical line.</br>\n\t\t\t \tOr autocompute knots from below.`)\n\t}\n\n\t// apply custom knots if changed from density plot to textarea\n\tupdateCustomSplineInputs() {\n\t\tthis.dom.customKnotsInput.property('value', this.q.knots.map((d: any) => d.value).join('\\n'))\n\t}\n\n\t// apply custom knots to this.q.knots\n\tprocessKnotsInputs() {\n\t\tconst data = this.dom.customKnotsInput\n\t\t\t.property('value')\n\t\t\t.split('\\n')\n\t\t\t.filter((d: any) => d != '')\n\t\t\t.map((d: any) => +d)\n\t\t\t.sort((a: any, b: any) => a - b)\n\t\t\t.map((d: any) => {\n\t\t\t\tconst knot = {\n\t\t\t\t\tvalue: +d\n\t\t\t\t}\n\t\t\t\treturn knot\n\t\t\t})\n\t\treturn data\n\t}\n\n\t/******************* Functions for Auto Spline knots *******************/\n\trenderAutoSplineInputs() {\n\t\tconst div = this.dom.knots_div\n\t\tconst knot_count = 4\n\t\tconst default_knot_count = knot_count\n\t\tthis.dom.knot_select_div = div.append('div')\n\n\t\tthis.dom.knot_select_div\n\t\t\t.append('div')\n\t\t\t.style('display', 'inline-block')\n\t\t\t.style('margin-left', '15px')\n\t\t\t.style('color', 'rgb(136, 136, 136)')\n\t\t\t.html('Autocompute')\n\n\t\tconst knot_ct_select = this.dom.knot_select_div\n\t\t\t.append('select')\n\t\t\t.attr('data-testid', 'num-spline-editor-num-knots')\n\t\t\t.style('margin-left', '10px')\n\t\t\t.style('margin-bottom', '7px')\n\n\t\tfor (let i = default_knot_count - 1; i < default_knot_count + 5; i++) {\n\t\t\tknot_ct_select.append('option').attr('value', i).html(i)\n\t\t}\n\n\t\tknot_ct_select.node().value = this.q.knots?.length || this.default_knots_count\n\n\t\tthis.dom.knot_select_div\n\t\t\t.append('div')\n\t\t\t.style('display', 'inline-block')\n\t\t\t.style('margin-left', '10px')\n\t\t\t.style('color', 'rgb(136, 136, 136)')\n\t\t\t.html('knots')\n\n\t\tthis.dom.knot_select_div\n\t\t\t.append('button')\n\t\t\t.style('margin', '15px')\n\t\t\t// .property('disabled', knot_count == knot_ct_select.node().value)\n\t\t\t.html('Compute')\n\t\t\t.on('click', async () => {\n\t\t\t\tconst desired_knots_ct = Number.parseInt(knot_ct_select.node().value)\n\t\t\t\tlet requested_knots_ct = Number.parseInt(knot_ct_select.node().value)\n\t\t\t\t// request knots util desired_knots are available\n\t\t\t\twhile (this.q.knots.length != desired_knots_ct) {\n\t\t\t\t\tawait this.getKnots(requested_knots_ct)\n\t\t\t\t\trequested_knots_ct = requested_knots_ct + 1\n\t\t\t\t}\n\t\t\t\tthis.updateCustomSplineInputs()\n\t\t\t})\n\n\t\tthis.dom.knot_select_div\n\t\t\t.append('div')\n\t\t\t.style('display', 'inline-block')\n\t\t\t.style('font-size', '.7em')\n\t\t\t.style('padding', '3px 15px')\n\t\t\t.style('padding-left', '5px')\n\t\t\t.style('color', 'rgb(136, 136, 136)')\n\t\t\t.html('Will overwrite existing values.')\n\t}\n\n\tgetEditedQ(destroyDom: boolean = true): SplineNumericQ {\n\t\tconst knots = this.processKnotsInputs()\n\t\tif (destroyDom) {\n\t\t\tfor (const name of Object.keys(this.dom)) {\n\t\t\t\tthis.dom[name].remove()\n\t\t\t\tdelete this.dom[name]\n\t\t\t}\n\t\t}\n\t\treturn {\n\t\t\tmode: 'spline',\n\t\t\tknots\n\t\t}\n\t}\n\n\tasync undoEdits() {\n\t\tthis.q = await this.getDefaultQ()\n\t\tthis.dom.knots_div.selectAll('*').remove()\n\t\tawait this.handler.density.setBinLines(this.getBoundaryOpts())\n\t\tthis.renderCustomSplineInputs()\n\t\tthis.renderAutoSplineInputs()\n\t}\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/NumSplineEditor.unit.spec-YQOOZA7S.js

@@ -0,0 +1,197 @@
+import {
+  sleep
+} from "./chunk-ZIBWLDQI.js";
+import {
+  agedx
+} from "./chunk-32AI7I4C.js";
+import {
+  termjson
+} from "./chunk-HUA2EFQO.js";
+import {
+  require_tape
+} from "./chunk-QWOE5YTB.js";
+import {
+  NumericHandler
+} from "./chunk-S7T7OZC7.js";
+import "./chunk-5HCB4HNL.js";
+import {
+  TwRouter
+} from "./chunk-OXJ2TWDO.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-V6DLLX4N.js";
+import "./chunk-7RN3L2BX.js";
+import "./chunk-A6TQGNDQ.js";
+import "./chunk-HYZG6OPC.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-5EF5U7MX.js";
+import "./chunk-2K5DSRBJ.js";
+import "./chunk-UCLS2SVB.js";
+import "./chunk-MVTCBVSX.js";
+import "./chunk-SEQLC4AD.js";
+import "./chunk-L4QG7XZE.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-KQMEJUWI.js";
+import "./chunk-UJU3Q7QJ.js";
+import "./chunk-WGL6FIUE.js";
+import "./chunk-6ITDJ5UR.js";
+import "./chunk-XYFDBYOY.js";
+import "./chunk-TV74I3Y5.js";
+import "./chunk-IH7ILDJS.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-TOU7EVFQ.js";
+import "./chunk-OAWQ6LOO.js";
+import "./chunk-SEEYV6P2.js";
+import {
+  select_default
+} from "./chunk-NDWTN4U5.js";
+import "./chunk-OMR2DT66.js";
+import {
+  __toESM
+} from "./chunk-HFNDKYVF.js";
+
+// termsetting/handlers/test/NumSplineEditor.unit.spec.ts
+var import_tape = __toESM(require_tape(), 1);
+async function getNumericHandler(opts = {}) {
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  const rawTw = {
+    term,
+    q: {
+      mode: "spline",
+      //[{value: 0.04}, {value: 3.13}, {value: 8.16}, {value: 17.87}]
+      knots: [{ value: 10 }, { value: 100 }, { value: 500 }, { value: 1e3 }]
+    }
+  };
+  let handler = {};
+  const vocabApi = {
+    state: {
+      termfilter: { filter: { type: "tvslst", in: "", lst: [] } }
+    },
+    getViolinBox() {
+      return agedx;
+    },
+    getPercentile() {
+      return {
+        values: [0.03537315665, 3.13072460515, 8.164619357749999, 17.8726813385]
+      };
+    }
+  };
+  const tw = await TwRouter.initRaw(rawTw, { vocabApi });
+  handler = new NumericHandler({
+    termsetting: {
+      tw,
+      term: rawTw.term,
+      q: rawTw.q,
+      opts: {
+        numericEditMenuVersion: ["spline"],
+        usecase: opts.usecase
+      },
+      api: {
+        runCallback() {
+        }
+      },
+      dom: {
+        tip: {
+          hide() {
+          }
+        }
+      },
+      vocabApi
+    }
+  });
+  const holder = select_default("body").append("div").style("position", "relative").style("width", "fit-content").style("margin", "20px").style("padding", "5px").style("border", "1px solid #000");
+  handler.dom.editDiv = holder;
+  await handler.setEditHandler(handler.tabs[0]);
+  return {
+    rawTw,
+    tw,
+    handler,
+    editHandler: handler.editHandler,
+    holder,
+    destroy: () => {
+      if ("destroy" in handler.editHandler) handler.editHandler.destroy();
+      if (typeof handler.destroy == "function") handler.destroy();
+      holder.remove();
+    }
+  };
+}
+(0, import_tape.default)("\n", (test) => {
+  test.comment("-***- NumBinaryEditor.unit.spec -***-");
+  test.end();
+});
+(0, import_tape.default)("handler methods", async (test) => {
+  const { editHandler, destroy } = await getNumericHandler();
+  test.deepEqual(editHandler.getPillStatus(), { text: "cubic spline" }, "should give the expected status");
+  editHandler.termsetting.tw.q = { mode: "discrete" };
+  test.deepEqual(
+    await editHandler.getDefaultQ(),
+    { mode: "spline", knots: [{ value: "0.04" }, { value: "3.13" }, { value: "8.16" }, { value: "17.87" }] },
+    "should give the expected defaultQ"
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("initial rendered UI", async (test) => {
+  const { editHandler, holder, destroy } = await getNumericHandler();
+  await editHandler.showEditMenu(holder);
+  test.equal(editHandler.dom?.density_div.selectAll("svg").size(), 1, `should render a density plot svg`);
+  const lines = [...editHandler.handler.density.dom.binsize_g.node().querySelectorAll("line")];
+  test.equal(lines.length, 4, `should render 4 draggable lines in the density plot`);
+  test.deepEqual(
+    lines.map((l) => l.getAttribute("x1")),
+    ["11", "21", "63", "116"],
+    `should render the draggable lines in the expected x-positions`
+  );
+  test.equal(
+    editHandler.dom.customKnotsInput.property("value"),
+    "10\n100\n500\n1000",
+    "should display line-separated values in the knots inputs"
+  );
+  test.equal(editHandler.dom.knot_select_div.selectAll("select").size(), 1, `should render an auto-compute dropdown`);
+  test.equal(
+    editHandler.dom.knot_select_div.select("select").property("value"),
+    "4",
+    `should default to 4 knots for auto-compute`
+  );
+  const density_div = editHandler.dom.density_div.node();
+  await editHandler.showEditMenu(holder);
+  test.equal(
+    density_div,
+    editHandler.dom.density_div.node(),
+    `should not re-render the menu when the holder has not changed`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("knots interactivity", async (test) => {
+  const { editHandler, holder, destroy } = await getNumericHandler();
+  await editHandler.showEditMenu(holder);
+  const newKnots = [10, 200, 600, 3e3];
+  editHandler.dom.customKnotsInput.property("value", newKnots.join("\n"));
+  editHandler.dom.customKnotsInput.node().dispatchEvent(new Event("change", { bubbles: true }));
+  const lines = [...editHandler.handler.density.dom.binsize_g.node().querySelectorAll("line")];
+  test.deepEqual(
+    lines.map((l) => l.getAttribute("x1")),
+    ["11", "31", "74", "328"],
+    `should re-render the draggable lines in the updated x-positions`
+  );
+  test.deepEqual(
+    editHandler.getEditedQ(false),
+    { mode: "spline", knots: newKnots.map((value) => ({ value })) },
+    `should give the expected edited q object`
+  );
+  editHandler.undoEdits();
+  await sleep(0);
+  {
+    const lines2 = [...editHandler.handler.density.dom.binsize_g.node().querySelectorAll("line")];
+    test.equal(lines2.length, 4, `should render 4 draggable lines in the density plot`);
+    test.deepEqual(
+      lines2.map((l) => l.getAttribute("x1")),
+      ["11", "21", "63", "116"],
+      `should render the draggable lines in the expected x-positions`
+    );
+  }
+  if (test._ok) destroy();
+  test.end();
+});
+//# sourceMappingURL=NumSplineEditor.unit.spec-YQOOZA7S.js.map

package/dist/NumericDensity-RL42P4QC.js

@@ -0,0 +1,36 @@
+import {
+  NumericDensity
+} from "./chunk-5HCB4HNL.js";
+import "./chunk-OXJ2TWDO.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-V6DLLX4N.js";
+import "./chunk-7RN3L2BX.js";
+import "./chunk-A6TQGNDQ.js";
+import "./chunk-HYZG6OPC.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-5EF5U7MX.js";
+import "./chunk-2K5DSRBJ.js";
+import "./chunk-UCLS2SVB.js";
+import "./chunk-MVTCBVSX.js";
+import "./chunk-SEQLC4AD.js";
+import "./chunk-L4QG7XZE.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-KQMEJUWI.js";
+import "./chunk-UJU3Q7QJ.js";
+import "./chunk-WGL6FIUE.js";
+import "./chunk-6ITDJ5UR.js";
+import "./chunk-XYFDBYOY.js";
+import "./chunk-TV74I3Y5.js";
+import "./chunk-IH7ILDJS.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-TOU7EVFQ.js";
+import "./chunk-OAWQ6LOO.js";
+import "./chunk-SEEYV6P2.js";
+import "./chunk-NDWTN4U5.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-HFNDKYVF.js";
+export {
+  NumericDensity
+};
+//# sourceMappingURL=NumericDensity-RL42P4QC.js.map

package/dist/NumericDensity.unit.spec-Y6RMTYC7.js

@@ -0,0 +1,219 @@
+import {
+  agedx
+} from "./chunk-32AI7I4C.js";
+import {
+  termjson
+} from "./chunk-HUA2EFQO.js";
+import {
+  require_tape
+} from "./chunk-QWOE5YTB.js";
+import {
+  NumericDensity
+} from "./chunk-5HCB4HNL.js";
+import {
+  TwRouter
+} from "./chunk-OXJ2TWDO.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-V6DLLX4N.js";
+import "./chunk-7RN3L2BX.js";
+import "./chunk-A6TQGNDQ.js";
+import "./chunk-HYZG6OPC.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-5EF5U7MX.js";
+import "./chunk-2K5DSRBJ.js";
+import "./chunk-UCLS2SVB.js";
+import "./chunk-MVTCBVSX.js";
+import "./chunk-SEQLC4AD.js";
+import "./chunk-L4QG7XZE.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-KQMEJUWI.js";
+import "./chunk-UJU3Q7QJ.js";
+import "./chunk-WGL6FIUE.js";
+import "./chunk-6ITDJ5UR.js";
+import "./chunk-XYFDBYOY.js";
+import "./chunk-TV74I3Y5.js";
+import "./chunk-IH7ILDJS.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-TOU7EVFQ.js";
+import "./chunk-OAWQ6LOO.js";
+import "./chunk-SEEYV6P2.js";
+import {
+  select_default
+} from "./chunk-NDWTN4U5.js";
+import "./chunk-OMR2DT66.js";
+import {
+  __toESM
+} from "./chunk-HFNDKYVF.js";
+
+// termsetting/handlers/test/NumericDensity.unit.spec.ts
+var import_tape = __toESM(require_tape(), 1);
+async function getNumericDensity(opts = {}) {
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  const rawTw = {
+    term,
+    q: {
+      mode: "continuous"
+    }
+  };
+  const tw = await TwRouter.initRaw(rawTw);
+  const density = new NumericDensity({
+    termsetting: {
+      tw,
+      term: rawTw.term,
+      q: rawTw.q,
+      opts: {
+        // numericEditMenuVersion: ['continuous', 'discrete', 'binary', 'spline'],
+        // usecase: opts.usecase
+        ...opts
+      },
+      api: {
+        runCallback() {
+        }
+      },
+      dom: {
+        tip: {
+          hide() {
+          }
+        }
+      },
+      vocabApi: {
+        getViolinBox() {
+          return agedx;
+        }
+      }
+    }
+  });
+  const holder = select_default("body").append("div").style("position", "fixed").style("top", 500).style("left", 500).style("width", "fit-content").style("margin", "20px").style("padding", "5px").style("border", "1px solid #000");
+  return {
+    rawTw,
+    tw,
+    holder,
+    density,
+    destroy: () => {
+      density.destroy();
+      holder.remove();
+    }
+  };
+}
+function simulateDrag(elem, xOffset) {
+  const box = elem.getBoundingClientRect();
+  const draggedX = box.x + xOffset;
+  elem.dispatchEvent(
+    new MouseEvent("mousedown", {
+      bubbles: true,
+      cancelable: true,
+      clientX: box.x,
+      clientY: box.y,
+      view: window
+    })
+  );
+  elem.dispatchEvent(
+    new MouseEvent("mouseup", {
+      bubbles: true,
+      cancelable: true,
+      clientX: draggedX,
+      clientY: 150,
+      view: window
+    })
+  );
+}
+(0, import_tape.default)("violin as density plot", async (test) => {
+  const { density, holder, destroy } = await getNumericDensity();
+  await density.showViolin(holder);
+  test.equal(holder.selectAll("svg").size(), 1, `should render a density plot svg`);
+  test.equal(holder.selectAll("svg image").size(), 1, `should render an image inside the svg`);
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("1 draggable line without lastVisibleLine", async (test) => {
+  test.timeoutAfter(20);
+  test.plan(4);
+  const { density, holder, destroy } = await getNumericDensity();
+  await density.showViolin(holder);
+  let hasTestedCallback = false;
+  const values = [
+    { x: 100, isDraggable: true, movesWithLineIndex: -1 },
+    { x: 1e3, movesWithLineIndex: 0 },
+    { x: 3e3, movesWithLineIndex: 0 }
+  ];
+  density.setBinLines({
+    values,
+    callback(lineData, value) {
+      if (hasTestedCallback === true) return;
+      hasTestedCallback = true;
+      const comparableKeys = Object.keys(values[0]);
+      test.deepEqual(
+        Object.fromEntries(Object.entries(lineData).filter((kv) => comparableKeys.includes(kv[0]))),
+        values[0],
+        `should provide a copy of the draggable line data as the first argument to callback`
+      );
+      test.true((value - 1516.62) / value < 0.01, `should provide the value as the second argument to callback`);
+      test.deepEqual(
+        lines.filter((l) => l.style.display !== "none").map((l, i) => Math.abs(Math.floor(Number(l.getAttribute("x1")) - x1b4drag[i] - xOffset)) < 2),
+        // check that the difference between expected and actual x values is less than a few pixels
+        [true, true, true],
+        `should also move non-draggable lines in the expected x-positions of the density plot`
+      );
+      if (test._ok) destroy();
+      test.end();
+    }
+  });
+  const lines = [...density.dom.binsize_g.node().querySelectorAll("line")];
+  const x1b4drag = [21, 116, 328];
+  test.deepEqual(
+    lines.filter((l) => l.style.display !== "none").map((l) => Number(l.getAttribute("x1"))),
+    x1b4drag,
+    `should render 3 visible lines in the expected x-positions of the density plot`
+  );
+  const xOffset = 150;
+  simulateDrag(lines[0], xOffset);
+});
+(0, import_tape.default)("1 draggable line with lastVisibleLine", async (test) => {
+  test.timeoutAfter(20);
+  test.plan(4);
+  const { density, holder, destroy } = await getNumericDensity();
+  await density.showViolin(holder);
+  let hasTestedCallback = false;
+  const values = [
+    { x: 100, isDraggable: true, movesWithLineIndex: -1 },
+    { x: 500, movesWithLineIndex: 0 },
+    { x: 1e3, movesWithLineIndex: 0 },
+    { x: 2e3, isDraggable: true, isLastVisibleLine: true }
+  ];
+  density.setBinLines({
+    values,
+    callback(lineData, value) {
+      if (hasTestedCallback === true) return;
+      hasTestedCallback = true;
+      const comparableKeys = Object.keys(values[0]);
+      test.deepEqual(
+        Object.fromEntries(Object.entries(lineData).filter((kv) => comparableKeys.includes(kv[0]))),
+        values[0],
+        `should provide a copy of the draggable line data as the first argument to callback`
+      );
+      test.true((value - 1516.62) / value < 0.01, `should provide the value as the second argument to callback`);
+      const expectedXDiff = [0, 0, 44];
+      test.deepEqual(
+        lines.filter((l) => l.style.display !== "none").map(
+          (l, i) => Math.abs(Math.floor(Number(l.getAttribute("x1")) - x1b4drag[i] - xOffset) + expectedXDiff[i]) < 2
+        ),
+        // check that the difference between expected and actual x values is less than a few pixels
+        [true, true, true],
+        `should also move non-draggable lines in the expected x-positions of the density plot`
+      );
+      if (test._ok) destroy();
+      test.end();
+    }
+  });
+  const lines = [...density.dom.binsize_g.node().querySelectorAll("line")];
+  const x1b4drag = [21, 63, 116, 222];
+  test.deepEqual(
+    lines.filter((l) => l.style.display !== "none").map((l) => Number(l.getAttribute("x1"))),
+    x1b4drag,
+    `should render 3 visible lines in the expected x-positions of the density plot`
+  );
+  const xOffset = 150;
+  simulateDrag(lines[0], xOffset);
+});
+//# sourceMappingURL=NumericDensity.unit.spec-Y6RMTYC7.js.map