@sjcrh/proteinpaint-client 2.191.4 → 2.193.0

package/dist/NumDiscreteEditor.unit.spec-B5T42Z5S.js

@@ -0,0 +1,202 @@
+import {
+  agedx
+} from "./chunk-32AI7I4C.js";
+import {
+  NumericHandler
+} from "./chunk-55MOHL3P.js";
+import "./chunk-MNIBZTQE.js";
+import {
+  termjson
+} from "./chunk-DHPLHIVP.js";
+import {
+  require_tape
+} from "./chunk-QWOE5YTB.js";
+import {
+  TwRouter
+} from "./chunk-L7VDSIM7.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-UXDVUCXU.js";
+import "./chunk-HYOEWQ5P.js";
+import "./chunk-HBW42TDT.js";
+import "./chunk-LQJMCE7G.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-IIT367QZ.js";
+import "./chunk-RZGEKL77.js";
+import "./chunk-KM4JBR26.js";
+import "./chunk-COYULNJF.js";
+import "./chunk-6G4YOMWW.js";
+import "./chunk-7IYJZZQI.js";
+import "./chunk-M3J4MINX.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-I73KUUYG.js";
+import "./chunk-IVXCWCKS.js";
+import "./chunk-7KRS7L4U.js";
+import "./chunk-BKPDYW5T.js";
+import "./chunk-JNITUVXP.js";
+import "./chunk-TJYRBEBK.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-VQZ2Z5YU.js";
+import "./chunk-SOTB4FRE.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-KYBIQBXE.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-DQC5FFGV.js";
+import {
+  __toESM
+} from "./chunk-HFNDKYVF.js";
+
+// termsetting/handlers/test/NumDiscreteEditor.unit.spec.ts
+var import_tape = __toESM(require_tape(), 1);
+async function getNumericHandler(opts = {}) {
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  if (term.bins.default.type == "regular-bin") term.bins.default.bin_size = 500;
+  const rawTw = {
+    term,
+    q: term.bins.default
+  };
+  let handler = {};
+  const vocabApi = {
+    state: {
+      termfilter: { filter: { type: "tvslst", in: "", lst: [] } }
+    },
+    getViolinBox() {
+      return agedx;
+    }
+  };
+  const tw = await TwRouter.initRaw(rawTw, { vocabApi });
+  handler = new NumericHandler({
+    termsetting: {
+      tw,
+      term: rawTw.term,
+      q: rawTw.q,
+      opts: {
+        numericEditMenuVersion: ["discrete"],
+        usecase: opts.usecase
+      },
+      api: {
+        runCallback() {
+        }
+      },
+      dom: {
+        tip: {
+          hide() {
+          }
+        }
+      },
+      vocabApi
+    }
+  });
+  handler.density_data = { min: agedx.min, max: agedx.max };
+  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("-***- NumDiscreteEditor.unit.spec -***-");
+  test.end();
+});
+(0, import_tape.default)("handler methods", async (test) => {
+  const { editHandler, destroy } = await getNumericHandler();
+  editHandler.setDefaultBoundaryInclusion();
+  test.equal(editHandler.boundaryInclusion, "stopinclusive", "should set the expected default boundaryInclusion");
+  editHandler.termsetting.tw.q = {
+    mode: "discrete",
+    type: "custom-bin",
+    lst: [
+      { start: 0, stop: 5, startinclusive: true },
+      { start: 5, stop: 10, startinclusive: true }
+    ]
+  };
+  editHandler.setDefaultBoundaryInclusion();
+  test.equal(
+    editHandler.boundaryInclusion,
+    "startinclusive",
+    "should set the expected default boundaryInclusion for custom-bin"
+  );
+  editHandler.termsetting.tw.q = { mode: "continuous" };
+  editHandler.setDefaultBoundaryInclusion();
+  test.equal(
+    editHandler.boundaryInclusion,
+    "stopinclusive",
+    `should set the expected default boundaryInclusion when q.mode != 'discrete'`
+  );
+  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`);
+  test.equal(
+    editHandler.dom.boundaryInclusionDiv.selectAll("option").size(),
+    2,
+    `should render a boundary inclusion dropdown with 2 options`
+  );
+  test.equal(
+    editHandler.dom.boundaryInclusionDiv.select("select").property("value"),
+    "stopinclusive",
+    `should default to startinclusive boundary inclusion input value`
+  );
+  test.deepEqual(
+    [...editHandler.dom.binsDiv.node().querySelectorAll(`button[data-testid='sja_toggle_button']`)].map(
+      (b) => b.firstChild.innerText
+    ),
+    ["Same bin size", "Varying bin sizes"],
+    `should render 2 toggle buttons, one each for regular-bin and custom-bin menu`
+  );
+  const boundaryInclusionDiv = editHandler.dom.boundaryInclusionDiv.node();
+  await editHandler.showEditMenu(holder);
+  test.equal(
+    boundaryInclusionDiv,
+    editHandler.dom.boundaryInclusionDiv.node(),
+    `should not re-render the menu when the holder has not changed`
+  );
+  editHandler.dom.boundaryInput.property("value", "startinclusive");
+  editHandler.dom.boundaryInput.node().dispatchEvent(new Event("change", { bubbles: true }));
+  test.deepEqual(
+    editHandler.getEditedQ(false),
+    {
+      mode: "discrete",
+      type: "regular-bin",
+      startinclusive: true,
+      stopinclusive: false,
+      bin_size: 500,
+      first_bin: { startunbounded: true, stop: 2 },
+      rounding: ".0f"
+    },
+    `should give the expected edited tw.q object`
+  );
+  await editHandler.undoEdits();
+  test.deepEqual(
+    editHandler.getEditedQ(false),
+    {
+      mode: "discrete",
+      type: "regular-bin",
+      startinclusive: false,
+      stopinclusive: true,
+      bin_size: 500,
+      first_bin: { startunbounded: true, stop: 2 },
+      rounding: ".0f"
+    },
+    `should give the expected edited tw.q object`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+//# sourceMappingURL=NumDiscreteEditor.unit.spec-B5T42Z5S.js.map

package/dist/NumRegularBinEditor-AING4HZ5.js

@@ -0,0 +1,38 @@
+import {
+  NumRegularBinEditor
+} from "./chunk-CLN7ANNL.js";
+import "./chunk-L7VDSIM7.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-UXDVUCXU.js";
+import "./chunk-HYOEWQ5P.js";
+import "./chunk-HBW42TDT.js";
+import "./chunk-LQJMCE7G.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-IIT367QZ.js";
+import "./chunk-RZGEKL77.js";
+import "./chunk-KM4JBR26.js";
+import "./chunk-COYULNJF.js";
+import "./chunk-6G4YOMWW.js";
+import "./chunk-7IYJZZQI.js";
+import "./chunk-M3J4MINX.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-I73KUUYG.js";
+import "./chunk-IVXCWCKS.js";
+import "./chunk-7KRS7L4U.js";
+import "./chunk-BKPDYW5T.js";
+import "./chunk-JNITUVXP.js";
+import "./chunk-TJYRBEBK.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-VQZ2Z5YU.js";
+import "./chunk-SOTB4FRE.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-KYBIQBXE.js";
+import "./chunk-I6Y4O3RR.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-HFNDKYVF.js";
+export {
+  NumRegularBinEditor
+};
+//# sourceMappingURL=NumRegularBinEditor-AING4HZ5.js.map

package/dist/NumRegularBinEditor.unit.spec-UKSVZH2S.js

@@ -0,0 +1,227 @@
+import {
+  agedx
+} from "./chunk-32AI7I4C.js";
+import {
+  NumericHandler
+} from "./chunk-55MOHL3P.js";
+import "./chunk-MNIBZTQE.js";
+import {
+  termjson
+} from "./chunk-DHPLHIVP.js";
+import {
+  require_tape
+} from "./chunk-QWOE5YTB.js";
+import {
+  TwRouter
+} from "./chunk-L7VDSIM7.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-UXDVUCXU.js";
+import "./chunk-HYOEWQ5P.js";
+import "./chunk-HBW42TDT.js";
+import "./chunk-LQJMCE7G.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-IIT367QZ.js";
+import "./chunk-RZGEKL77.js";
+import "./chunk-KM4JBR26.js";
+import "./chunk-COYULNJF.js";
+import "./chunk-6G4YOMWW.js";
+import "./chunk-7IYJZZQI.js";
+import "./chunk-M3J4MINX.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-I73KUUYG.js";
+import "./chunk-IVXCWCKS.js";
+import "./chunk-7KRS7L4U.js";
+import "./chunk-BKPDYW5T.js";
+import "./chunk-JNITUVXP.js";
+import "./chunk-TJYRBEBK.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-VQZ2Z5YU.js";
+import "./chunk-SOTB4FRE.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-KYBIQBXE.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-DQC5FFGV.js";
+import {
+  __toESM
+} from "./chunk-HFNDKYVF.js";
+
+// termsetting/handlers/test/NumRegularBinEditor.unit.spec.ts
+var import_tape = __toESM(require_tape(), 1);
+async function getNumericHandler(opts = {}) {
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  if (term.bins.default.type == "regular-bin") term.bins.default.bin_size = 500;
+  const rawTw = {
+    term,
+    q: term.bins.default
+  };
+  let handler = {};
+  const vocabApi = {
+    state: {
+      termfilter: { filter: { type: "tvslst", in: "", lst: [] } }
+    },
+    getViolinBox() {
+      return agedx;
+    }
+  };
+  const tw = await TwRouter.initRaw(rawTw, { vocabApi });
+  handler = new NumericHandler({
+    termsetting: {
+      tw,
+      term: rawTw.term,
+      q: rawTw.q,
+      opts: {
+        numericEditMenuVersion: ["discrete"],
+        usecase: opts.usecase
+      },
+      api: {
+        runCallback() {
+        }
+      },
+      dom: {
+        tip: {
+          hide() {
+          }
+        }
+      },
+      vocabApi
+    }
+  });
+  handler.density_data = { min: agedx.min, max: agedx.max };
+  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]);
+  const binsEditor = handler.editHandler.editorsByType["regular-bin"];
+  return {
+    rawTw,
+    tw,
+    handler,
+    editHandler: handler.editHandler,
+    binsEditor,
+    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("-***- NumRegularBinEditor.unit.spec -***-");
+  test.end();
+});
+(0, import_tape.default)("handler methods", async (test) => {
+  const { binsEditor, destroy } = await getNumericHandler();
+  test.deepEqual(
+    binsEditor.getDefaultQ(),
+    {
+      type: "regular-bin",
+      label_offset: 1,
+      bin_size: 500,
+      first_bin: { startunbounded: true, stop: 2 },
+      isAtomic: true,
+      mode: "discrete",
+      hiddenValues: {}
+    },
+    `should give the expected default tw.q object`
+  );
+  binsEditor.tw.q = { mode: "continuous" };
+  test.deepEqual(
+    binsEditor.getDefaultQ(),
+    {
+      type: "regular-bin",
+      label_offset: 1,
+      bin_size: 500,
+      first_bin: { startunbounded: true, stop: 2 },
+      isAtomic: true,
+      mode: "discrete",
+      hiddenValues: {}
+    },
+    `should give the expected default tw.q object if the mode is not discrete`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("initial rendered UI", async (test) => {
+  const { editHandler, binsEditor, holder, destroy } = await getNumericHandler();
+  await editHandler.showEditMenu(holder);
+  test.equal(binsEditor.dom.binsTable.selectAll("tr").size(), 3, `should render a boundary inputs table with 3 rows`);
+  const numberInputs = binsEditor.dom.binsTable.node().querySelectorAll(`input[type='number']`);
+  test.equal(
+    numberInputs.length,
+    3,
+    `should render 3 number inputs for bin size, first bin stop, and optional last bin start`
+  );
+  test.equal(
+    numberInputs[2].parentNode?.style.display,
+    "none",
+    `should hide the input for last bin start, if not specified in q`
+  );
+  const radios = binsEditor.dom.binsTable.node().querySelectorAll(`input[type='radio']`);
+  test.equal(radios.length, 2, `should render 2 radio inputs for optional last bin`);
+  test.equal(radios[0].checked, true, `should checked the automatic last bin start radio`);
+  test.equal(radios[1].checked, false, `should not check the fixed last bin start radio`);
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("edit interactivity", async (test) => {
+  const { editHandler, binsEditor, holder, destroy } = await getNumericHandler();
+  await editHandler.showEditMenu(holder);
+  binsEditor.dom.bin_size_input.property("value", 300);
+  binsEditor.dom.bin_size_input.node().dispatchEvent(new Event("change", { bubbles: true }));
+  binsEditor.dom.first_stop_input.property("value", 100);
+  binsEditor.dom.first_stop_input.node().dispatchEvent(new Event("change", { bubbles: true }));
+  binsEditor.dom.fixed_radio.property("checked", true);
+  binsEditor.dom.fixed_radio.node().dispatchEvent(new Event("input", { bubbles: true }));
+  binsEditor.dom.last_start_input.property("value", 1e3);
+  binsEditor.dom.last_start_input.node().dispatchEvent(new Event("change", { bubbles: true }));
+  test.equal(
+    binsEditor.dom.last_start_input.style("display"),
+    "inline-block",
+    `should display the last start input when fixed stop option is selected`
+  );
+  test.deepEqual(
+    editHandler.getEditedQ(false),
+    {
+      mode: "discrete",
+      type: "regular-bin",
+      startinclusive: false,
+      stopinclusive: true,
+      bin_size: 300,
+      first_bin: { startunbounded: true, stop: 100 },
+      rounding: ".0f",
+      last_bin: { start: 1e3, stopunbounded: true }
+    },
+    `should give the expected edited tw.q object`
+  );
+  {
+    const lines = [...editHandler.handler.density.dom.binsize_g.node().querySelectorAll("line")];
+    test.deepEqual(
+      lines.filter((l) => l.style.display !== "none").map((l) => l.getAttribute("x1")),
+      ["21", "52", "84", "116"],
+      `should render 4 lines in the expected x-positions of the density plot`
+    );
+  }
+  const binsTable = binsEditor.dom.binsTable.node();
+  await binsEditor.render(editHandler.dom.binsDiv.node().firstChild);
+  test.equal(
+    binsTable,
+    binsEditor.dom.binsTable.node(),
+    `should not re-render the menu when the holder has not changed`
+  );
+  await editHandler.undoEdits();
+  {
+    const lines = [...editHandler.handler.density.dom.binsize_g.node().querySelectorAll("line")];
+    test.deepEqual(
+      lines.map((l) => l.getAttribute("x1")),
+      ["10", "63", "116", "169", "223", "276", "329", "382", "435", "488"],
+      `should render a draggable line in the expected x-position`
+    );
+  }
+  if (test._ok) destroy();
+  test.end();
+});
+//# sourceMappingURL=NumRegularBinEditor.unit.spec-UKSVZH2S.js.map

package/dist/NumSplineEditor-54KNKHJX.js

@@ -0,0 +1,198 @@
+import {
+  keyupEnter
+} from "./chunk-L7VDSIM7.js";
+import "./chunk-HJ6L54YS.js";
+import {
+  HandlerBase
+} from "./chunk-LSEFWW72.js";
+import "./chunk-UXDVUCXU.js";
+import "./chunk-HYOEWQ5P.js";
+import "./chunk-HBW42TDT.js";
+import "./chunk-LQJMCE7G.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-IIT367QZ.js";
+import "./chunk-RZGEKL77.js";
+import "./chunk-KM4JBR26.js";
+import "./chunk-COYULNJF.js";
+import "./chunk-6G4YOMWW.js";
+import "./chunk-7IYJZZQI.js";
+import "./chunk-M3J4MINX.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-I73KUUYG.js";
+import "./chunk-IVXCWCKS.js";
+import "./chunk-7KRS7L4U.js";
+import "./chunk-BKPDYW5T.js";
+import "./chunk-JNITUVXP.js";
+import "./chunk-TJYRBEBK.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-VQZ2Z5YU.js";
+import "./chunk-SOTB4FRE.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-KYBIQBXE.js";
+import "./chunk-I6Y4O3RR.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-DQC5FFGV.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) {
+    this.tw = this.handler.tw;
+    this.q = await this.getDefaultQ();
+    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.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").text("Compute").on("click", async () => {
+      this.dom.knots_div.style("pointer-events", "none").style("opacity", 0.5);
+      const desired_knots_ct = Number.parseInt(knot_ct_select.node().value);
+      let requested_knots_ct = desired_knots_ct;
+      while (this.q.knots.length != desired_knots_ct) {
+        if (requested_knots_ct > 99) break;
+        const result = await this.getKnots(requested_knots_ct);
+        this.q.knots = result.knots;
+        requested_knots_ct = requested_knots_ct + 1;
+      }
+      this.dom.knots_div.style("pointer-events", "auto").style("opacity", 1);
+      this.updateCustomSplineInputs();
+      this.handler.density.setBinLines(this.getBoundaryOpts());
+    });
+    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-54KNKHJX.js.map