@sjcrh/proteinpaint-client 2.207.1 → 2.208.0

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

@@ -0,0 +1,224 @@
+import {
+  agedx
+} from "./chunk-32AI7I4C.js";
+import {
+  NumericHandler
+} from "./chunk-4C7MA5Q3.js";
+import "./chunk-F4DM3WS4.js";
+import {
+  termjson
+} from "./chunk-FQYXNCZI.js";
+import {
+  sleep
+} from "./chunk-FYXIK6Y6.js";
+import {
+  require_tape
+} from "./chunk-PJYCTAMC.js";
+import {
+  TwRouter
+} from "./chunk-QJ3HYZH3.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-KV4W2ACA.js";
+import "./chunk-DMWOK4DS.js";
+import "./chunk-ELJX3QIQ.js";
+import "./chunk-5IMFPVGT.js";
+import "./chunk-EEB5VE2A.js";
+import "./chunk-6RRZRISL.js";
+import "./chunk-2KM4PRQM.js";
+import "./chunk-VMRO6DMC.js";
+import "./chunk-HKKTNIMX.js";
+import "./chunk-GMRIEUBW.js";
+import "./chunk-4EZLVENZ.js";
+import "./chunk-WINIL2KN.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-7X6NF7NI.js";
+import "./chunk-W5J3LTYS.js";
+import "./chunk-Z2ZITHT4.js";
+import "./chunk-4OLM3KSB.js";
+import "./chunk-FXQXCOII.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-5R63Q5KH.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+import "./chunk-Q5RDQNIT.js";
+import "./chunk-DQC5FFGV.js";
+import {
+  __toESM
+} from "./chunk-HS5PO5ZQ.js";
+
+// termsetting/handlers/test/NumSplineEditor.unit.spec.ts
+var import_tape = __toESM(require_tape(), 1);
+var DAY_TO_YEAR = 1 / 365.25;
+function getConvertedTerm() {
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  term.valueConversion = { fromUnit: "day", toUnit: "year", scaleFactor: DAY_TO_YEAR };
+  return term;
+}
+async function getNumericHandler(opts = {}) {
+  const term = opts.term || JSON.parse(JSON.stringify(termjson.agedx));
+  const rawTw = {
+    term,
+    q: opts.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();
+});
+(0, import_tape.default)("converted term", async (test) => {
+  const q = { mode: "spline", knots: [365.25, 1826.25, 2922, 3652.5].map((value) => ({ value })) };
+  const { editHandler, holder, destroy } = await getNumericHandler({ term: getConvertedTerm(), q });
+  await editHandler.showEditMenu(holder);
+  test.equal(
+    editHandler.dom.customKnotsInput.property("value"),
+    "1\n5\n8\n10",
+    `should fill the knots textarea in years`
+  );
+  test.equal(
+    editHandler.dom.density_div.node().nextSibling.firstChild.innerText.includes("unit of year"),
+    true,
+    `should note the unit immediately under the density plot`
+  );
+  editHandler.dom.customKnotsInput.property("value", [2, 6].join("\n"));
+  editHandler.dom.customKnotsInput.node().dispatchEvent(new Event("change", { bubbles: true }));
+  test.deepEqual(
+    editHandler.getEditedQ(false),
+    { mode: "spline", knots: [{ value: 730.5 }, { value: 2191.5 }] },
+    `should give an edited q whose knots are in days`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+//# sourceMappingURL=NumSplineEditor.unit.spec-S65AV5EK.js.map

package/dist/NumericDensity-5ES4SDWZ.js

@@ -0,0 +1,33 @@
+import {
+  NumericDensity
+} from "./chunk-F4DM3WS4.js";
+import "./chunk-QJ3HYZH3.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-KV4W2ACA.js";
+import "./chunk-DMWOK4DS.js";
+import "./chunk-ELJX3QIQ.js";
+import "./chunk-5IMFPVGT.js";
+import "./chunk-EEB5VE2A.js";
+import "./chunk-6RRZRISL.js";
+import "./chunk-2KM4PRQM.js";
+import "./chunk-VMRO6DMC.js";
+import "./chunk-HKKTNIMX.js";
+import "./chunk-GMRIEUBW.js";
+import "./chunk-4EZLVENZ.js";
+import "./chunk-WINIL2KN.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-7X6NF7NI.js";
+import "./chunk-W5J3LTYS.js";
+import "./chunk-Z2ZITHT4.js";
+import "./chunk-4OLM3KSB.js";
+import "./chunk-FXQXCOII.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-5R63Q5KH.js";
+import "./chunk-I6Y4O3RR.js";
+import "./chunk-Q5RDQNIT.js";
+import "./chunk-DQC5FFGV.js";
+import "./chunk-HS5PO5ZQ.js";
+export {
+  NumericDensity
+};
+//# sourceMappingURL=NumericDensity-5ES4SDWZ.js.map

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

@@ -0,0 +1,418 @@
+import {
+  agedx
+} from "./chunk-32AI7I4C.js";
+import {
+  NumericDensity
+} from "./chunk-F4DM3WS4.js";
+import {
+  termjson
+} from "./chunk-FQYXNCZI.js";
+import {
+  require_tape
+} from "./chunk-PJYCTAMC.js";
+import {
+  TwRouter
+} from "./chunk-QJ3HYZH3.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-KV4W2ACA.js";
+import "./chunk-DMWOK4DS.js";
+import "./chunk-ELJX3QIQ.js";
+import "./chunk-5IMFPVGT.js";
+import "./chunk-EEB5VE2A.js";
+import "./chunk-6RRZRISL.js";
+import "./chunk-2KM4PRQM.js";
+import "./chunk-VMRO6DMC.js";
+import "./chunk-HKKTNIMX.js";
+import "./chunk-GMRIEUBW.js";
+import "./chunk-4EZLVENZ.js";
+import "./chunk-WINIL2KN.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-7X6NF7NI.js";
+import "./chunk-W5J3LTYS.js";
+import "./chunk-Z2ZITHT4.js";
+import "./chunk-4OLM3KSB.js";
+import "./chunk-FXQXCOII.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-5R63Q5KH.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+import "./chunk-Q5RDQNIT.js";
+import "./chunk-DQC5FFGV.js";
+import {
+  __toESM
+} from "./chunk-HS5PO5ZQ.js";
+
+// termsetting/handlers/test/NumericDensity.unit.spec.ts
+var import_tape = __toESM(require_tape(), 1);
+async function getNumericDensity(opts = {}) {
+  const term = opts.term || JSON.parse(JSON.stringify(termjson.agedx));
+  const violinData = opts.violinData || 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 violinData;
+        }
+      }
+    }
+  });
+  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();
+    }
+  };
+}
+var DAY_TO_YEAR = 1 / 365.25;
+function getConvertedTerm(overrides = {}) {
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  term.valueConversion = { fromUnit: "day", toUnit: "year", scaleFactor: DAY_TO_YEAR };
+  return Object.assign(term, overrides);
+}
+async function dragFirstLine(density, values, xOffset = 150) {
+  let resolve;
+  const dragged = new Promise((res) => resolve = res);
+  await density.setBinLines({
+    values,
+    callback(lineData, value) {
+      resolve({ lineData, value });
+    }
+  });
+  const lines = [...density.dom.binsize_g.node().querySelectorAll("line")];
+  simulateDrag(lines[0], xOffset);
+  return dragged;
+}
+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);
+});
+(0, import_tape.default)("converted term: plot range in the user-facing unit", async (test) => {
+  test.timeoutAfter(1e3);
+  const { density, holder, destroy } = await getNumericDensity({ term: getConvertedTerm() });
+  await density.showViolin(holder);
+  test.equal(density.scaleFactor, DAY_TO_YEAR, `should take the scaleFactor from term.valueConversion`);
+  test.equal(
+    density.displayMin,
+    agedx.min * DAY_TO_YEAR,
+    `should state the plot minimum in the user-facing unit`
+  );
+  test.equal(
+    density.displayMax,
+    agedx.max * DAY_TO_YEAR,
+    `should state the plot maximum in the user-facing unit`
+  );
+  test.notEqual(
+    density.displayMax,
+    Number((agedx.max * DAY_TO_YEAR).toFixed(2)),
+    `should not round the plot maximum to the decimals an editor input shows`
+  );
+  await density.setBinLines({ values: [{ x: 2, isDraggable: true }], callback() {
+  } });
+  test.deepEqual(
+    density.xscale.domain(),
+    density.vr.axisScaleUI.domain(),
+    `should give xscale the same domain as the violin axis it overlays`
+  );
+  const v = 5;
+  test.equal(
+    density.xscale(v) + density.plot_size.xpad,
+    density.vr.axisScaleUI(v) + density.vr.shiftx,
+    `should map a value to the same x as the violin axis, allowing for the two group translations`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("converted term: a range narrower than the rounding of a displayed value", async (test) => {
+  test.timeoutAfter(1e3);
+  const violinData = { ...agedx, min: 100.5, max: 101.5 };
+  const { density, holder, destroy } = await getNumericDensity({ term: getConvertedTerm(), violinData });
+  await density.showViolin(holder);
+  test.equal(
+    Number(density.displayMin.toFixed(2)),
+    Number(density.displayMax.toFixed(2)),
+    `the test data should be a range that rounds to a single value in the user-facing unit`
+  );
+  test.notEqual(density.displayMin, density.displayMax, `should keep the two plot endpoints distinct`);
+  const { value } = await dragFirstLine(density, [{ x: 101 * DAY_TO_YEAR, isDraggable: true }]);
+  test.true(Number.isFinite(value), `should report a value for a drag within the plot`);
+  test.equal(
+    Math.round(density.xscale(density.displayMax)) - Math.round(density.xscale(density.displayMin)),
+    density.plot_size.width,
+    `should scale the range over the full width of the plot`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("dragged value is rounded for the unit it is reported in", async (test) => {
+  test.timeoutAfter(1e3);
+  const converted = await getNumericDensity({ term: getConvertedTerm() });
+  await converted.density.showViolin(converted.holder);
+  const convertedDrag = await dragFirstLine(converted.density, [{ x: 2, isDraggable: true }]);
+  test.equal(
+    Number(convertedDrag.value.toFixed(2)),
+    convertedDrag.value,
+    `should report a converted value with no more than 2 decimals`
+  );
+  test.true(
+    convertedDrag.value > 2 && convertedDrag.value > converted.density.displayMin && convertedDrag.value < converted.density.displayMax,
+    `should report a converted value that moved to the right and stayed within the plot range (got ${convertedDrag.value})`
+  );
+  if (test._ok) converted.destroy();
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  term.type = "integer";
+  const integer = await getNumericDensity({ term });
+  await integer.density.showViolin(integer.holder);
+  test.equal(integer.density.scaleFactor, 1, `should not convert a term without valueConversion`);
+  const integerDrag = await dragFirstLine(integer.density, [{ x: 100, isDraggable: true }]);
+  test.equal(
+    integerDrag.value,
+    Math.round(integerDrag.value),
+    `should report a whole number for an unconverted integer term`
+  );
+  if (test._ok) integer.destroy();
+  test.end();
+});
+(0, import_tape.default)("a dragged line stops at its neighboring line", async (test) => {
+  test.timeoutAfter(1e3);
+  const { density, holder, destroy } = await getNumericDensity();
+  await density.showViolin(holder);
+  const calls = [];
+  const values = [
+    { x: 100, isDraggable: true },
+    { x: 2e3, isDraggable: true }
+  ];
+  await density.setBinLines({
+    values,
+    callback(lineData, value) {
+      calls.push({ index: lineData.index, value });
+    }
+  });
+  const lines = [...density.dom.binsize_g.node().querySelectorAll("line")];
+  const lineX = (i) => Number(lines[i].getAttribute("x1"));
+  const neighborX = lineX(1);
+  simulateDrag(lines[0], 400);
+  test.equal(calls.length, 1, `should report the drag of a line that is dragged past its neighbor`);
+  test.true(
+    calls[0].value < values[1].x,
+    `should report a value below the neighboring boundary (got ${calls[0].value})`
+  );
+  test.true(lineX(0) < neighborX, `should stop the dragged line before the neighboring line`);
+  test.equal(lineX(1), neighborX, `should leave the neighboring line where it was`);
+  simulateDrag(lines[0], -800);
+  test.true(calls[1].value > density.displayMin, `should report a value above the plot minimum (got ${calls[1].value})`);
+  test.true(lineX(0) > Math.round(density.xscale(density.displayMin)), `should stop the dragged line inside the plot`);
+  const draggedX = lineX(0);
+  simulateDrag(lines[1], -800);
+  test.true(lineX(1) > draggedX, `should stop a line dragged to the left after its neighboring line`);
+  test.true(
+    calls[calls.length - 1].value > calls[1].value,
+    `should report a value above the neighboring boundary (got ${calls[calls.length - 1].value})`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("a boundary line drawn outside the plot is still draggable", async (test) => {
+  test.timeoutAfter(1e3);
+  const { density, holder, destroy } = await getNumericDensity();
+  await density.showViolin(holder);
+  const calls = [];
+  await density.setBinLines({
+    // agedx values run to 4710, so a boundary of 9000 is drawn past the right edge of the plot
+    values: [
+      { x: 100, isDraggable: true },
+      { x: 9e3, isDraggable: true }
+    ],
+    callback(_, value) {
+      calls.push(value);
+    }
+  });
+  const lines = [...density.dom.binsize_g.node().querySelectorAll("line")];
+  const scaledMaxX = Math.round(density.xscale(density.displayMax));
+  test.true(
+    Number(lines[1].getAttribute("x1")) > scaledMaxX,
+    `the test data should put the second line past the right edge of the plot`
+  );
+  simulateDrag(lines[1], -30);
+  test.equal(calls.length, 1, `should report a drag of a line that is drawn outside the plot`);
+  test.true(calls[0] <= density.displayMax, `should report a value within the plot range (got ${calls[0]})`);
+  test.equal(
+    Number(lines[1].getAttribute("x1")),
+    scaledMaxX - 1,
+    `should move the line to just inside the edge of the plot`
+  );
+  if (test._ok) destroy();
+  test.end();
+});
+(0, import_tape.default)("a dragged line does not report the value of its neighboring line", async (test) => {
+  test.timeoutAfter(1e3);
+  const term = JSON.parse(JSON.stringify(termjson.agedx));
+  term.type = "integer";
+  const violinData = { ...agedx, min: 0, max: 10 };
+  const { density, holder, destroy } = await getNumericDensity({ term, violinData });
+  await density.showViolin(holder);
+  const calls = [];
+  await density.setBinLines({
+    values: [
+      { x: 5, isDraggable: true },
+      { x: 6, isDraggable: true }
+    ],
+    callback(_, value) {
+      calls.push(value);
+    }
+  });
+  const lines = [...density.dom.binsize_g.node().querySelectorAll("line")];
+  simulateDrag(lines[0], 45);
+  test.deepEqual(calls, [], `should not report a drag that rounds onto the neighboring boundary`);
+  simulateDrag(lines[0], -60);
+  test.deepEqual(calls, [4], `should report a drag that rounds to a value between the neighboring boundaries`);
+  if (test._ok) destroy();
+  test.end();
+});
+//# sourceMappingURL=NumericDensity.unit.spec-J6KZSE2P.js.map