@oyerinde/caliper 0.1.2 → 0.1.4

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 All notable changes to this project will be documented in this file.
 
+## [0.1.4] - 2026-01-16
+
+### Fixed
+
+- Fixed selection triggering underlying element click events (buttons, links, etc.).
+
+### Removed
+
+- Removed double-click to remove rulers (use Delete/Backspace instead).
+
+## [0.1.3] - 2026-01-13
+
+### Improved
+
+- Shortcuts now function while editable elements are focused.
+
 ## [0.1.2] - 2026-01-13
 
 ### Fixed

package/dist/index.cjs

@@ -1034,13 +1034,6 @@ function hasSize(element) {
   const rect = element.getBoundingClientRect();
   return rect.width > 0 && rect.height > 0;
 }
-function isEditable(element) {
-  if (!element || !(element instanceof HTMLElement)) {
-    return false;
-  }
-  const tagName = element.tagName;
-  return tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT" || element.isContentEditable;
-}
 function isEligible(element) {
   if (element.closest("[data-caliper-ignore]")) {
     return false;
@@ -2158,7 +2151,7 @@ function createProjectionSystem() {
   };
   const listeners = /* @__PURE__ */ new Set();
   const notify = () => {
-    listeners.forEach((l) => l({ ...state }));
+    listeners.forEach((listener) => listener({ ...state }));
   };
   return {
     getState: () => ({ ...state }),
@@ -2217,7 +2210,7 @@ function createRulerSystem() {
   };
   const listeners = /* @__PURE__ */ new Set();
   const notify = () => {
-    listeners.forEach((l) => l({ lines: [...state.lines] }));
+    listeners.forEach((listener) => listener({ lines: [...state.lines] }));
   };
   return {
     getState: () => ({ lines: [...state.lines] }),
@@ -2238,14 +2231,14 @@ function createRulerSystem() {
       return vLine.id;
     },
     updateLine: (id, position) => {
-      const index = state.lines.findIndex((l) => l.id === id);
+      const index = state.lines.findIndex((line) => line.id === id);
       if (index !== -1 && state.lines[index]) {
         state.lines[index] = { ...state.lines[index], position };
         notify();
       }
     },
     removeLine: (id) => {
-      state.lines = state.lines.filter((l) => l.id !== id);
+      state.lines = state.lines.filter((line) => line.id !== id);
       notify();
     },
     clear: () => {
@@ -3607,7 +3600,7 @@ function RulerOverlay(props) {
     const currentIds = selectedIds();
     const validIds = /* @__PURE__ */ new Set();
     currentIds.forEach((id) => {
-      if (lines.find((l) => l.id === id)) {
+      if (lines.find((line) => line.id === id)) {
         validIds.add(id);
       }
     });
@@ -3630,7 +3623,7 @@ function RulerOverlay(props) {
         updated = true;
       }
     });
-    const lineIds = new Set(lines.map((l) => l.id));
+    const lineIds = new Set(lines.map((line) => line.id));
     newOrigins.forEach((_, id) => {
       if (!lineIds.has(id)) {
         newOrigins.delete(id);
@@ -3715,7 +3708,7 @@ function RulerOverlay(props) {
       return;
     }
     const lines = props.state().lines;
-    const activeLines = lines.filter((l) => activeIds.has(l.id));
+    const activeLines = lines.filter((line) => activeIds.has(line.id));
     if (activeLines.length === 0) return;
     let step = 1;
     if (e.shiftKey) step = 10;
@@ -3784,7 +3777,7 @@ function RulerOverlay(props) {
     setDraggingId(id);
     target.setPointerCapture(e.pointerId);
     const vp = props.viewport();
-    const line = props.state().lines.find((l) => l.id === id);
+    const line = props.state().lines.find((line2) => line2.id === id);
     if (line) {
       const currentPos = getProportionalPosition(line);
       setRulerOrigins((prev) => {
@@ -3827,18 +3820,6 @@ function RulerOverlay(props) {
     window.addEventListener("pointermove", onPointerMove);
     window.addEventListener("pointerup", onPointerUp);
   };
-  const handleDoubleClick = (e) => {
-    const target = e.target;
-    const id = target.getAttribute("data-ruler-id");
-    if (id) {
-      props.onRemove(id);
-      setSelectedIds((prev) => {
-        const next = new Set(prev);
-        next.delete(id);
-        return next;
-      });
-    }
-  };
   const handlePointerOver = (e) => {
     const target = e.target;
     const id = target.getAttribute("data-ruler-id");
@@ -3851,14 +3832,14 @@ function RulerOverlay(props) {
   const bridges = createMemo(() => {
     const ids = selectedIds();
     if (ids.size < 2) return [];
-    const lines = props.state().lines.filter((l) => ids.has(l.id));
-    const vLinesWithPos = lines.filter((l) => l.type === "vertical").map((l) => ({
-      line: l,
-      pos: getProportionalPosition(l)
+    const lines = props.state().lines.filter((line) => ids.has(line.id));
+    const vLinesWithPos = lines.filter((line) => line.type === "vertical").map((line) => ({
+      line,
+      pos: getProportionalPosition(line)
     })).sort((a, b) => a.pos - b.pos);
-    const hLinesWithPos = lines.filter((l) => l.type === "horizontal").map((l) => ({
-      line: l,
-      pos: getProportionalPosition(l)
+    const hLinesWithPos = lines.filter((line) => line.type === "horizontal").map((line) => ({
+      line,
+      pos: getProportionalPosition(line)
     })).sort((a, b) => a.pos - b.pos);
     const result = [];
     const vp = props.viewport();
@@ -3918,7 +3899,6 @@ function RulerOverlay(props) {
     var _el$ = _tmpl$10(), _el$2 = _el$.firstChild;
     _el$.$$pointerout = handlePointerOut;
     _el$.$$pointerover = handlePointerOver;
-    _el$.$$dblclick = handleDoubleClick;
     _el$.$$pointerdown = handlePointerDown;
     className(_el$, `${PREFIX}ruler-layer`);
     setAttribute(_el$2, "class", `${PREFIX}viewport-fixed`);
@@ -4095,7 +4075,7 @@ function RulerLineItem(props) {
     }
   })];
 }
-delegateEvents(["pointerdown", "dblclick", "pointerover", "pointerout", "click"]);
+delegateEvents(["pointerdown", "pointerover", "pointerout", "click"]);
 var _tmpl$11 = /* @__PURE__ */ template(`<div>`);
 function Overlay(props) {
   const resultData = createMemo(() => {
@@ -4459,6 +4439,7 @@ function Root(config) {
       };
       if (isCommandActive(e)) {
         e.preventDefault();
+        e.stopImmediatePropagation();
         if (selectionTimeoutId) window.clearTimeout(selectionTimeoutId);
         selectionTimeoutId = window.setTimeout(() => {
           performSelection(lastPointerPos.x, lastPointerPos.y);
@@ -4468,6 +4449,12 @@ function Root(config) {
         if (selectionTimeoutId) window.clearTimeout(selectionTimeoutId);
       }
     };
+    const handleClick = (e) => {
+      if (isCommandActive(e)) {
+        e.preventDefault();
+        e.stopImmediatePropagation();
+      }
+    };
     const handlePointerUp = (e) => {
       if (selectionTimeoutId) {
         window.clearTimeout(selectionTimeoutId);
@@ -4543,7 +4530,7 @@ function Root(config) {
       }
     };
     const handleKeyDown = (e) => {
-      if (e.key === commands.clear && !isEditable(e.target)) {
+      if (e.key === commands.clear) {
         if (!isActive()) return;
         e.preventDefault();
         e.stopImmediatePropagation();
@@ -4566,10 +4553,10 @@ function Root(config) {
         }
         return;
       }
-      if (e.key === commands.select && !isEditable(e.target)) {
+      if (e.key === commands.select) {
         setIsSelectKeyDown(true);
       }
-      if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem && !isEditable(e.target)) {
+      if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem) {
         e.preventDefault();
         const vp = viewport();
         const x = Math.max(0, Math.min(cursor().x, vp.width));
@@ -4592,7 +4579,7 @@ function Root(config) {
           resetCalculatorUI();
         }
         setIsActivatePressed(true);
-      } else if (e.key === commands.freeze && !isEditable(e.target) && system) {
+      } else if (e.key === commands.freeze && system) {
         const state = system.getState();
         if (state === "FROZEN") {
           e.preventDefault();
@@ -4640,7 +4627,7 @@ function Root(config) {
           [projection.right]: "right"
         };
         const dir = dirMap[key];
-        if (dir && selectionMetadata().element && !isEditable(e.target)) {
+        if (dir && selectionMetadata().element) {
           e.preventDefault();
           e.stopImmediatePropagation();
           setActiveInputFocus("projection");
@@ -4695,7 +4682,7 @@ function Root(config) {
           const targetType = typeMap[key];
           if (targetType) {
             const currentLines = result()?.lines || [];
-            const targetLine = currentLines.find((l) => l.type === targetType);
+            const targetLine = currentLines.find((line) => line.type === targetType);
             if (targetLine) {
               e.preventDefault();
               e.stopImmediatePropagation();
@@ -4739,6 +4726,9 @@ function Root(config) {
     window.addEventListener("pointerup", handlePointerUp, {
       capture: true
     });
+    window.addEventListener("click", handleClick, {
+      capture: true
+    });
     window.addEventListener("mousemove", handleMouseMove);
     window.addEventListener("keydown", handleKeyDown, {
       capture: true
@@ -4758,6 +4748,9 @@ function Root(config) {
       window.removeEventListener("pointerup", handlePointerUp, {
         capture: true
       });
+      window.removeEventListener("click", handleClick, {
+        capture: true
+      });
       window.removeEventListener("mousemove", handleMouseMove);
       window.removeEventListener("keydown", handleKeyDown, {
         capture: true
@@ -4926,7 +4919,7 @@ function Root(config) {
       const state = untrack(() => calculatorState());
       if (state?.isActive) {
         viewport().version;
-        const matchingLine = currentResult.lines.find((l) => l.type === calcLine.type);
+        const matchingLine = currentResult.lines.find((line) => line.type === calcLine.type);
         if (matchingLine) {
           const liveValue = getLiveLineValue(matchingLine, currentResult);
           const calc = system.getCalculator();
@@ -5127,12 +5120,12 @@ function createOverlay(config) {
   return instance;
 }
 if (IS_BROWSER2) {
-  showVersionInfo("0.1.2").catch(() => {
+  showVersionInfo("0.1.4").catch(() => {
   });
 }
 
 // src/index.ts
-var VERSION = "0.1.2";
+var VERSION = "0.1.4";
 
 exports.VERSION = VERSION;
 exports.getConfig = getConfig;

package/dist/index.d.ts

@@ -1,18 +1,2 @@
-export { OverlayInstance, createOverlay as init } from '@caliper/overlay';
-export { OverlayConfig, getConfig, setConfig } from '@caliper/core';
 
-/**
- * @oyerinde/caliper
- *
- * Browser-based measurement tool overlay.
- * This package bundles all dependencies for easy consumption.
- *
- * Usage:
- * 1. Script tag (Auto-mount): <script src="@oyerinde/caliper/dist/index.global.js"></script>
- * 2. ESM import (Manual): import { init } from "@oyerinde/caliper"
- * 3. Initialize: const caliper = init(); caliper.mount();
- */
-
-declare const VERSION: string;
-
-export { VERSION };
+export {  }

package/dist/index.global.js

@@ -1035,13 +1035,6 @@
     const rect = element.getBoundingClientRect();
     return rect.width > 0 && rect.height > 0;
   }
-  function isEditable(element) {
-    if (!element || !(element instanceof HTMLElement)) {
-      return false;
-    }
-    const tagName = element.tagName;
-    return tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT" || element.isContentEditable;
-  }
   function isEligible(element) {
     if (element.closest("[data-caliper-ignore]")) {
       return false;
@@ -2159,7 +2152,7 @@
     };
     const listeners = /* @__PURE__ */ new Set();
     const notify = () => {
-      listeners.forEach((l) => l({ ...state }));
+      listeners.forEach((listener) => listener({ ...state }));
     };
     return {
       getState: () => ({ ...state }),
@@ -2218,7 +2211,7 @@
     };
     const listeners = /* @__PURE__ */ new Set();
     const notify = () => {
-      listeners.forEach((l) => l({ lines: [...state.lines] }));
+      listeners.forEach((listener) => listener({ lines: [...state.lines] }));
     };
     return {
       getState: () => ({ lines: [...state.lines] }),
@@ -2239,14 +2232,14 @@
         return vLine.id;
       },
       updateLine: (id, position) => {
-        const index = state.lines.findIndex((l) => l.id === id);
+        const index = state.lines.findIndex((line) => line.id === id);
         if (index !== -1 && state.lines[index]) {
           state.lines[index] = { ...state.lines[index], position };
           notify();
         }
       },
       removeLine: (id) => {
-        state.lines = state.lines.filter((l) => l.id !== id);
+        state.lines = state.lines.filter((line) => line.id !== id);
         notify();
       },
       clear: () => {
@@ -3603,7 +3596,7 @@
       const currentIds = selectedIds();
       const validIds = /* @__PURE__ */ new Set();
       currentIds.forEach((id) => {
-        if (lines.find((l) => l.id === id)) {
+        if (lines.find((line) => line.id === id)) {
           validIds.add(id);
         }
       });
@@ -3626,7 +3619,7 @@
           updated = true;
         }
       });
-      const lineIds = new Set(lines.map((l) => l.id));
+      const lineIds = new Set(lines.map((line) => line.id));
       newOrigins.forEach((_, id) => {
         if (!lineIds.has(id)) {
           newOrigins.delete(id);
@@ -3711,7 +3704,7 @@
         return;
       }
       const lines = props.state().lines;
-      const activeLines = lines.filter((l) => activeIds.has(l.id));
+      const activeLines = lines.filter((line) => activeIds.has(line.id));
       if (activeLines.length === 0) return;
       let step = 1;
       if (e.shiftKey) step = 10;
@@ -3780,7 +3773,7 @@
       setDraggingId(id);
       target.setPointerCapture(e.pointerId);
       const vp = props.viewport();
-      const line = props.state().lines.find((l) => l.id === id);
+      const line = props.state().lines.find((line2) => line2.id === id);
       if (line) {
         const currentPos = getProportionalPosition(line);
         setRulerOrigins((prev) => {
@@ -3823,18 +3816,6 @@
       window.addEventListener("pointermove", onPointerMove);
       window.addEventListener("pointerup", onPointerUp);
     };
-    const handleDoubleClick = (e) => {
-      const target = e.target;
-      const id = target.getAttribute("data-ruler-id");
-      if (id) {
-        props.onRemove(id);
-        setSelectedIds((prev) => {
-          const next = new Set(prev);
-          next.delete(id);
-          return next;
-        });
-      }
-    };
     const handlePointerOver = (e) => {
       const target = e.target;
       const id = target.getAttribute("data-ruler-id");
@@ -3847,14 +3828,14 @@
     const bridges = createMemo(() => {
       const ids = selectedIds();
       if (ids.size < 2) return [];
-      const lines = props.state().lines.filter((l) => ids.has(l.id));
-      const vLinesWithPos = lines.filter((l) => l.type === "vertical").map((l) => ({
-        line: l,
-        pos: getProportionalPosition(l)
+      const lines = props.state().lines.filter((line) => ids.has(line.id));
+      const vLinesWithPos = lines.filter((line) => line.type === "vertical").map((line) => ({
+        line,
+        pos: getProportionalPosition(line)
       })).sort((a, b) => a.pos - b.pos);
-      const hLinesWithPos = lines.filter((l) => l.type === "horizontal").map((l) => ({
-        line: l,
-        pos: getProportionalPosition(l)
+      const hLinesWithPos = lines.filter((line) => line.type === "horizontal").map((line) => ({
+        line,
+        pos: getProportionalPosition(line)
       })).sort((a, b) => a.pos - b.pos);
       const result = [];
       const vp = props.viewport();
@@ -3914,7 +3895,6 @@
       var _el$ = _tmpl$10(), _el$2 = _el$.firstChild;
       _el$.$$pointerout = handlePointerOut;
       _el$.$$pointerover = handlePointerOver;
-      _el$.$$dblclick = handleDoubleClick;
       _el$.$$pointerdown = handlePointerDown;
       className(_el$, `${PREFIX}ruler-layer`);
       setAttribute(_el$2, "class", `${PREFIX}viewport-fixed`);
@@ -4091,7 +4071,7 @@
       }
     })];
   }
-  delegateEvents(["pointerdown", "dblclick", "pointerover", "pointerout", "click"]);
+  delegateEvents(["pointerdown", "pointerover", "pointerout", "click"]);
   var _tmpl$11 = /* @__PURE__ */ template(`<div>`);
   function Overlay(props) {
     const resultData = createMemo(() => {
@@ -4455,6 +4435,7 @@
         };
         if (isCommandActive(e)) {
           e.preventDefault();
+          e.stopImmediatePropagation();
           if (selectionTimeoutId) window.clearTimeout(selectionTimeoutId);
           selectionTimeoutId = window.setTimeout(() => {
             performSelection(lastPointerPos.x, lastPointerPos.y);
@@ -4464,6 +4445,12 @@
           if (selectionTimeoutId) window.clearTimeout(selectionTimeoutId);
         }
       };
+      const handleClick = (e) => {
+        if (isCommandActive(e)) {
+          e.preventDefault();
+          e.stopImmediatePropagation();
+        }
+      };
       const handlePointerUp = (e) => {
         if (selectionTimeoutId) {
           window.clearTimeout(selectionTimeoutId);
@@ -4539,7 +4526,7 @@
         }
       };
       const handleKeyDown = (e) => {
-        if (e.key === commands.clear && !isEditable(e.target)) {
+        if (e.key === commands.clear) {
           if (!isActive()) return;
           e.preventDefault();
           e.stopImmediatePropagation();
@@ -4562,10 +4549,10 @@
           }
           return;
         }
-        if (e.key === commands.select && !isEditable(e.target)) {
+        if (e.key === commands.select) {
           setIsSelectKeyDown(true);
         }
-        if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem && !isEditable(e.target)) {
+        if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem) {
           e.preventDefault();
           const vp = viewport();
           const x = Math.max(0, Math.min(cursor().x, vp.width));
@@ -4588,7 +4575,7 @@
             resetCalculatorUI();
           }
           setIsActivatePressed(true);
-        } else if (e.key === commands.freeze && !isEditable(e.target) && system) {
+        } else if (e.key === commands.freeze && system) {
           const state = system.getState();
           if (state === "FROZEN") {
             e.preventDefault();
@@ -4636,7 +4623,7 @@
             [projection.right]: "right"
           };
           const dir = dirMap[key];
-          if (dir && selectionMetadata().element && !isEditable(e.target)) {
+          if (dir && selectionMetadata().element) {
             e.preventDefault();
             e.stopImmediatePropagation();
             setActiveInputFocus("projection");
@@ -4691,7 +4678,7 @@
             const targetType = typeMap[key];
             if (targetType) {
               const currentLines = result()?.lines || [];
-              const targetLine = currentLines.find((l) => l.type === targetType);
+              const targetLine = currentLines.find((line) => line.type === targetType);
               if (targetLine) {
                 e.preventDefault();
                 e.stopImmediatePropagation();
@@ -4735,6 +4722,9 @@
       window.addEventListener("pointerup", handlePointerUp, {
         capture: true
       });
+      window.addEventListener("click", handleClick, {
+        capture: true
+      });
       window.addEventListener("mousemove", handleMouseMove);
       window.addEventListener("keydown", handleKeyDown, {
         capture: true
@@ -4754,6 +4744,9 @@
         window.removeEventListener("pointerup", handlePointerUp, {
           capture: true
         });
+        window.removeEventListener("click", handleClick, {
+          capture: true
+        });
         window.removeEventListener("mousemove", handleMouseMove);
         window.removeEventListener("keydown", handleKeyDown, {
           capture: true
@@ -4922,7 +4915,7 @@
         const state = untrack(() => calculatorState());
         if (state?.isActive) {
           viewport().version;
-          const matchingLine = currentResult.lines.find((l) => l.type === calcLine.type);
+          const matchingLine = currentResult.lines.find((line) => line.type === calcLine.type);
           if (matchingLine) {
             const liveValue = getLiveLineValue(matchingLine, currentResult);
             const calc = system.getCalculator();
@@ -5123,7 +5116,7 @@
     return instance;
   }
   if (IS_BROWSER2) {
-    showVersionInfo("0.1.2").catch(() => {
+    showVersionInfo("0.1.4").catch(() => {
     });
   }
 

package/dist/index.js

@@ -1032,13 +1032,6 @@ function hasSize(element) {
   const rect = element.getBoundingClientRect();
   return rect.width > 0 && rect.height > 0;
 }
-function isEditable(element) {
-  if (!element || !(element instanceof HTMLElement)) {
-    return false;
-  }
-  const tagName = element.tagName;
-  return tagName === "INPUT" || tagName === "TEXTAREA" || tagName === "SELECT" || element.isContentEditable;
-}
 function isEligible(element) {
   if (element.closest("[data-caliper-ignore]")) {
     return false;
@@ -2156,7 +2149,7 @@ function createProjectionSystem() {
   };
   const listeners = /* @__PURE__ */ new Set();
   const notify = () => {
-    listeners.forEach((l) => l({ ...state }));
+    listeners.forEach((listener) => listener({ ...state }));
   };
   return {
     getState: () => ({ ...state }),
@@ -2215,7 +2208,7 @@ function createRulerSystem() {
   };
   const listeners = /* @__PURE__ */ new Set();
   const notify = () => {
-    listeners.forEach((l) => l({ lines: [...state.lines] }));
+    listeners.forEach((listener) => listener({ lines: [...state.lines] }));
   };
   return {
     getState: () => ({ lines: [...state.lines] }),
@@ -2236,14 +2229,14 @@ function createRulerSystem() {
       return vLine.id;
     },
     updateLine: (id, position) => {
-      const index = state.lines.findIndex((l) => l.id === id);
+      const index = state.lines.findIndex((line) => line.id === id);
       if (index !== -1 && state.lines[index]) {
         state.lines[index] = { ...state.lines[index], position };
         notify();
       }
     },
     removeLine: (id) => {
-      state.lines = state.lines.filter((l) => l.id !== id);
+      state.lines = state.lines.filter((line) => line.id !== id);
       notify();
     },
     clear: () => {
@@ -3605,7 +3598,7 @@ function RulerOverlay(props) {
     const currentIds = selectedIds();
     const validIds = /* @__PURE__ */ new Set();
     currentIds.forEach((id) => {
-      if (lines.find((l) => l.id === id)) {
+      if (lines.find((line) => line.id === id)) {
         validIds.add(id);
       }
     });
@@ -3628,7 +3621,7 @@ function RulerOverlay(props) {
         updated = true;
       }
     });
-    const lineIds = new Set(lines.map((l) => l.id));
+    const lineIds = new Set(lines.map((line) => line.id));
     newOrigins.forEach((_, id) => {
       if (!lineIds.has(id)) {
         newOrigins.delete(id);
@@ -3713,7 +3706,7 @@ function RulerOverlay(props) {
       return;
     }
     const lines = props.state().lines;
-    const activeLines = lines.filter((l) => activeIds.has(l.id));
+    const activeLines = lines.filter((line) => activeIds.has(line.id));
     if (activeLines.length === 0) return;
     let step = 1;
     if (e.shiftKey) step = 10;
@@ -3782,7 +3775,7 @@ function RulerOverlay(props) {
     setDraggingId(id);
     target.setPointerCapture(e.pointerId);
     const vp = props.viewport();
-    const line = props.state().lines.find((l) => l.id === id);
+    const line = props.state().lines.find((line2) => line2.id === id);
     if (line) {
       const currentPos = getProportionalPosition(line);
       setRulerOrigins((prev) => {
@@ -3825,18 +3818,6 @@ function RulerOverlay(props) {
     window.addEventListener("pointermove", onPointerMove);
     window.addEventListener("pointerup", onPointerUp);
   };
-  const handleDoubleClick = (e) => {
-    const target = e.target;
-    const id = target.getAttribute("data-ruler-id");
-    if (id) {
-      props.onRemove(id);
-      setSelectedIds((prev) => {
-        const next = new Set(prev);
-        next.delete(id);
-        return next;
-      });
-    }
-  };
   const handlePointerOver = (e) => {
     const target = e.target;
     const id = target.getAttribute("data-ruler-id");
@@ -3849,14 +3830,14 @@ function RulerOverlay(props) {
   const bridges = createMemo(() => {
     const ids = selectedIds();
     if (ids.size < 2) return [];
-    const lines = props.state().lines.filter((l) => ids.has(l.id));
-    const vLinesWithPos = lines.filter((l) => l.type === "vertical").map((l) => ({
-      line: l,
-      pos: getProportionalPosition(l)
+    const lines = props.state().lines.filter((line) => ids.has(line.id));
+    const vLinesWithPos = lines.filter((line) => line.type === "vertical").map((line) => ({
+      line,
+      pos: getProportionalPosition(line)
     })).sort((a, b) => a.pos - b.pos);
-    const hLinesWithPos = lines.filter((l) => l.type === "horizontal").map((l) => ({
-      line: l,
-      pos: getProportionalPosition(l)
+    const hLinesWithPos = lines.filter((line) => line.type === "horizontal").map((line) => ({
+      line,
+      pos: getProportionalPosition(line)
     })).sort((a, b) => a.pos - b.pos);
     const result = [];
     const vp = props.viewport();
@@ -3916,7 +3897,6 @@ function RulerOverlay(props) {
     var _el$ = _tmpl$10(), _el$2 = _el$.firstChild;
     _el$.$$pointerout = handlePointerOut;
     _el$.$$pointerover = handlePointerOver;
-    _el$.$$dblclick = handleDoubleClick;
     _el$.$$pointerdown = handlePointerDown;
     className(_el$, `${PREFIX}ruler-layer`);
     setAttribute(_el$2, "class", `${PREFIX}viewport-fixed`);
@@ -4093,7 +4073,7 @@ function RulerLineItem(props) {
     }
   })];
 }
-delegateEvents(["pointerdown", "dblclick", "pointerover", "pointerout", "click"]);
+delegateEvents(["pointerdown", "pointerover", "pointerout", "click"]);
 var _tmpl$11 = /* @__PURE__ */ template(`<div>`);
 function Overlay(props) {
   const resultData = createMemo(() => {
@@ -4457,6 +4437,7 @@ function Root(config) {
       };
       if (isCommandActive(e)) {
         e.preventDefault();
+        e.stopImmediatePropagation();
         if (selectionTimeoutId) window.clearTimeout(selectionTimeoutId);
         selectionTimeoutId = window.setTimeout(() => {
           performSelection(lastPointerPos.x, lastPointerPos.y);
@@ -4466,6 +4447,12 @@ function Root(config) {
         if (selectionTimeoutId) window.clearTimeout(selectionTimeoutId);
       }
     };
+    const handleClick = (e) => {
+      if (isCommandActive(e)) {
+        e.preventDefault();
+        e.stopImmediatePropagation();
+      }
+    };
     const handlePointerUp = (e) => {
       if (selectionTimeoutId) {
         window.clearTimeout(selectionTimeoutId);
@@ -4541,7 +4528,7 @@ function Root(config) {
       }
     };
     const handleKeyDown = (e) => {
-      if (e.key === commands.clear && !isEditable(e.target)) {
+      if (e.key === commands.clear) {
         if (!isActive()) return;
         e.preventDefault();
         e.stopImmediatePropagation();
@@ -4564,10 +4551,10 @@ function Root(config) {
         }
         return;
       }
-      if (e.key === commands.select && !isEditable(e.target)) {
+      if (e.key === commands.select) {
         setIsSelectKeyDown(true);
       }
-      if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem && !isEditable(e.target)) {
+      if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem) {
         e.preventDefault();
         const vp = viewport();
         const x = Math.max(0, Math.min(cursor().x, vp.width));
@@ -4590,7 +4577,7 @@ function Root(config) {
           resetCalculatorUI();
         }
         setIsActivatePressed(true);
-      } else if (e.key === commands.freeze && !isEditable(e.target) && system) {
+      } else if (e.key === commands.freeze && system) {
         const state = system.getState();
         if (state === "FROZEN") {
           e.preventDefault();
@@ -4638,7 +4625,7 @@ function Root(config) {
           [projection.right]: "right"
         };
         const dir = dirMap[key];
-        if (dir && selectionMetadata().element && !isEditable(e.target)) {
+        if (dir && selectionMetadata().element) {
           e.preventDefault();
           e.stopImmediatePropagation();
           setActiveInputFocus("projection");
@@ -4693,7 +4680,7 @@ function Root(config) {
           const targetType = typeMap[key];
           if (targetType) {
             const currentLines = result()?.lines || [];
-            const targetLine = currentLines.find((l) => l.type === targetType);
+            const targetLine = currentLines.find((line) => line.type === targetType);
             if (targetLine) {
               e.preventDefault();
               e.stopImmediatePropagation();
@@ -4737,6 +4724,9 @@ function Root(config) {
     window.addEventListener("pointerup", handlePointerUp, {
       capture: true
     });
+    window.addEventListener("click", handleClick, {
+      capture: true
+    });
     window.addEventListener("mousemove", handleMouseMove);
     window.addEventListener("keydown", handleKeyDown, {
       capture: true
@@ -4756,6 +4746,9 @@ function Root(config) {
       window.removeEventListener("pointerup", handlePointerUp, {
         capture: true
       });
+      window.removeEventListener("click", handleClick, {
+        capture: true
+      });
       window.removeEventListener("mousemove", handleMouseMove);
       window.removeEventListener("keydown", handleKeyDown, {
         capture: true
@@ -4924,7 +4917,7 @@ function Root(config) {
       const state = untrack(() => calculatorState());
       if (state?.isActive) {
         viewport().version;
-        const matchingLine = currentResult.lines.find((l) => l.type === calcLine.type);
+        const matchingLine = currentResult.lines.find((line) => line.type === calcLine.type);
         if (matchingLine) {
           const liveValue = getLiveLineValue(matchingLine, currentResult);
           const calc = system.getCalculator();
@@ -5125,11 +5118,11 @@ function createOverlay(config) {
   return instance;
 }
 if (IS_BROWSER2) {
-  showVersionInfo("0.1.2").catch(() => {
+  showVersionInfo("0.1.4").catch(() => {
   });
 }
 
 // src/index.ts
-var VERSION = "0.1.2";
+var VERSION = "0.1.4";
 
 export { VERSION, getConfig, createOverlay as init, setConfig };

package/dist/version.json

@@ -1,4 +1,4 @@
 {
-  "version": "0.1.2",
-  "timestamp": "2026-01-13T21:26:04.784Z"
+  "version": "0.1.4",
+  "timestamp": "2026-01-16T21:21:40.318Z"
 }

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@oyerinde/caliper",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "High-precision browser measurements, projections, and layout auditing",
   "type": "module",
-  "main": "dist/index.js",
+  "main": "dist/index.cjs",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "author": "Daniel Oyerinde <oyerinde.daniel@yahoo.com> (https://danieloyerinde.com)",
@@ -84,10 +84,10 @@
     "solid-js": "^1.9.10",
     "tsup": "^8.5.1",
     "typescript": "5.9.3",
-    "@caliper/core": "0.0.0",
-    "@repo/typescript-config": "0.0.0",
     "@caliper/overlay": "0.0.0",
-    "@repo/eslint-config": "0.0.0"
+    "@caliper/core": "0.0.0",
+    "@repo/eslint-config": "0.0.0",
+    "@repo/typescript-config": "0.0.0"
   },
   "scripts": {
     "prebuild": "node scripts/write-version.mjs",