@oyerinde/caliper 0.1.0 → 0.1.1

package/dist/index.cjs

@@ -800,6 +800,7 @@ function Portal(props) {
 function createReader() {
   let rafId = null;
   let idleId = null;
+  let taskController = null;
   let timeoutId = null;
   function detectBestStrategy() {
     if ("scheduler" in globalThis) {
@@ -821,19 +822,19 @@ function createReader() {
       scheduleWithIdle(callback, urgent);
       return;
     }
-    const controller = new TaskController({
+    taskController = new TaskController({
       priority: urgent ? "user-visible" : "background"
     });
-    controller.signal;
     Scheduler2.postTask(
       () => {
         callback();
       },
       {
-        signal: controller.signal,
+        signal: taskController?.signal,
         priority: urgent ? "user-visible" : "background"
       }
-    );
+    ).catch(() => {
+    });
   }
   function scheduleWithIdle(callback, urgent) {
     if (!("requestIdleCallback" in window)) {
@@ -892,6 +893,10 @@ function createReader() {
       cancelIdleCallback(idleId);
       idleId = null;
     }
+    if (taskController) {
+      taskController.abort();
+      taskController = null;
+    }
     if (timeoutId !== null) {
       clearTimeout(timeoutId);
       timeoutId = null;
@@ -1029,6 +1034,13 @@ 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;
@@ -1049,8 +1061,7 @@ function getElementAtPoint(x, y) {
 }
 function getTopElementAtPoint(x, y) {
   const node = document.elementFromPoint(x, y);
-  if (!node) return null;
-  if (isCaliperNode(node) || !isEligible(node)) return null;
+  if (!node || isCaliperNode(node) || !isEligible(node)) return null;
   return node;
 }
 function detectBestContext(selectedElement, cursorX, cursorY) {
@@ -1725,7 +1736,7 @@ function createCalculatorState() {
     result: null,
     isActive: false
   };
-  function calculate2() {
+  function calculate() {
     const val = state.inputValue === "" ? "0" : state.inputValue;
     const inputNum = parseFloat(val);
     if (isNaN(inputNum)) {
@@ -1786,7 +1797,7 @@ function createCalculatorState() {
         const hasResult = state.result !== null;
         const isSwitchable = state.inputValue === "" || state.inputValue === "0";
         if (hasResult || state.operation && !isSwitchable) {
-          const newBase = hasResult ? state.result : calculate2() ?? state.baseValue;
+          const newBase = hasResult ? state.result : calculate() ?? state.baseValue;
           state = {
             baseValue: newBase,
             operation: action.operation,
@@ -1841,7 +1852,7 @@ function createCalculatorState() {
         if (!state.isActive || !state.operation) {
           return state;
         }
-        const result = calculate2();
+        const result = calculate();
         state = {
           ...state,
           result
@@ -1862,7 +1873,7 @@ function createCalculatorState() {
   function getState() {
     return { ...state };
   }
-  return { getState, dispatch, calculate: calculate2 };
+  return { getState, dispatch, calculate };
 }
 function createCalculatorIntegration() {
   const calculator = createCalculatorState();
@@ -1935,6 +1946,12 @@ function createMeasurementSystem() {
       );
       if (measurement) {
         const { result, element } = measurement;
+        if (!stateMachine.isMeasuring() && !stateMachine.isArmed()) {
+          return;
+        }
+        if (stateMachine.isMeasuring() && element === previousElement && result.context === previousContext) {
+          return;
+        }
         currentResult = result;
         previousContext = result.context;
         previousElement = element;
@@ -1946,6 +1963,7 @@ function createMeasurementSystem() {
   function freeze() {
     const state = stateMachine.getState();
     if (state === "MEASURING" || state === "IDLE" || state === "ARMED") {
+      reader.cancel();
       stateMachine.transitionTo("FROZEN");
       notifyListeners();
     }
@@ -2303,8 +2321,8 @@ var DEFAULT_THEME = {
   calcBg: "rgba(30, 30, 30, 0.95)",
   calcShadow: "rgba(0, 0, 0, 0.25)",
   calcOpHighlight: "rgba(24, 160, 251, 0.3)",
-  calcText: "white",
-  text: "white",
+  calcText: "rgba(255, 255, 255, 1)",
+  text: "rgba(255, 255, 255, 1)",
   projection: "rgba(155, 81, 224, 1)",
   ruler: "rgba(24, 160, 251, 1)"
 };
@@ -2317,18 +2335,49 @@ function parseNumber(value, defaultValue) {
   const num = Number(value);
   return isFinite(num) && !isNaN(num) ? num : defaultValue;
 }
+function withOpacity(color, opacity) {
+  if (color.startsWith("#")) {
+    let hex = color.slice(1);
+    if (hex.length === 3) hex = hex.split("").map((c) => c + c).join("");
+    const r = parseInt(hex.slice(0, 2), 16);
+    const g = parseInt(hex.slice(2, 4), 16);
+    const b = parseInt(hex.slice(4, 6), 16);
+    return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+  }
+  if (color.startsWith("rgba")) {
+    return color.replace(/[\d.]+\)$/g, `${opacity})`);
+  }
+  if (color.startsWith("rgb")) {
+    return color.replace(")", `, ${opacity})`).replace("rgb", "rgba");
+  }
+  return color;
+}
 function applyTheme(theme) {
   if (!theme) return;
   const root = document.documentElement;
-  if (theme.primary) root.style.setProperty("--caliper-primary", theme.primary);
-  if (theme.secondary) root.style.setProperty("--caliper-secondary", theme.secondary);
+  if (theme.primary) {
+    root.style.setProperty("--caliper-primary", theme.primary);
+    root.style.setProperty("--caliper-primary-90", withOpacity(theme.primary, 0.9));
+    root.style.setProperty("--caliper-primary-95", withOpacity(theme.primary, 0.95));
+    root.style.setProperty("--caliper-primary-50", withOpacity(theme.primary, 0.5));
+    root.style.setProperty("--caliper-primary-05", withOpacity(theme.primary, 0.05));
+  }
+  if (theme.secondary) {
+    root.style.setProperty("--caliper-secondary", theme.secondary);
+    root.style.setProperty("--caliper-secondary-50", withOpacity(theme.secondary, 0.5));
+    root.style.setProperty("--caliper-secondary-05", withOpacity(theme.secondary, 0.05));
+  }
   if (theme.calcBg) root.style.setProperty("--caliper-calc-bg", theme.calcBg);
   if (theme.calcShadow) root.style.setProperty("--caliper-calc-shadow", theme.calcShadow);
   if (theme.calcOpHighlight)
     root.style.setProperty("--caliper-calc-op-highlight", theme.calcOpHighlight);
   if (theme.calcText) root.style.setProperty("--caliper-calc-text", theme.calcText);
   if (theme.text) root.style.setProperty("--caliper-text", theme.text);
-  if (theme.projection) root.style.setProperty("--caliper-projection", theme.projection);
+  if (theme.projection) {
+    root.style.setProperty("--caliper-projection", theme.projection);
+    root.style.setProperty("--caliper-projection-90", withOpacity(theme.projection, 0.9));
+    root.style.setProperty("--caliper-projection-light", withOpacity(theme.projection, 0.2));
+  }
   if (theme.ruler) root.style.setProperty("--caliper-ruler", theme.ruler);
 }
 function mergeCommands(userCommands) {
@@ -2363,6 +2412,19 @@ function mergeAnimation(userAnimation) {
     lerpFactor: parseNumber(userAnimation?.lerpFactor, DEFAULT_ANIMATION.lerpFactor)
   };
 }
+function mergeTheme(userTheme) {
+  return {
+    primary: userTheme?.primary ?? DEFAULT_THEME.primary,
+    secondary: userTheme?.secondary ?? DEFAULT_THEME.secondary,
+    calcBg: userTheme?.calcBg ?? DEFAULT_THEME.calcBg,
+    calcShadow: userTheme?.calcShadow ?? DEFAULT_THEME.calcShadow,
+    calcOpHighlight: userTheme?.calcOpHighlight ?? DEFAULT_THEME.calcOpHighlight,
+    calcText: userTheme?.calcText ?? DEFAULT_THEME.calcText,
+    text: userTheme?.text ?? DEFAULT_THEME.text,
+    projection: userTheme?.projection ?? DEFAULT_THEME.projection,
+    ruler: userTheme?.ruler ?? DEFAULT_THEME.ruler
+  };
+}
 function getConfig() {
   if (typeof window !== "undefined") {
     const windowConfig = window.__CALIPER_CONFIG__ ?? {};
@@ -2394,7 +2456,7 @@ function setConfig(config) {
 var CALIPER_LOGO_SVG = `data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjUwIiB2aWV3Qm94PSIwIDAgMTcyIDUwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTQ3LjIxNDQgNy42MjkzOWUtMDZIMzIuNzkyOEwyNS44MjUgNDMuMzIyNUgzNS4wNjEzTDM2LjE5NTYgMzUuMDE2M0g0NC4xMzU2TDQ1LjI2OTkgNDMuMzIyNUg1NC42NjgzTDQ3LjIxNDQgNy42MjkzOWUtMDZaTTM5LjU5ODUgOC4zMDYySDQwLjczMjhMNDQuMTM1NiAyOC4xNzU5SDM2LjE5NTZMMzkuNTk4NSA4LjMwNjJaIiBmaWxsPSIjQUMyMzIzIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNS4wMjMyOCAwTDAgNS4wNDg4NlYyOC4zMzg4TDUuMTg1MzIgMzMuMzg3NkgxNy41MDA0VjM1LjM0MkgxNS41NTZWNDYuNzQyN0gxOS4xMjA5TDI0LjMwNjIgMzUuNjY3OFYyNS44OTU4SDcuMTI5ODFWNy4zMjg5OUgxMy40NDk0VjBINS4wMjMyOFoiIGZpbGw9IiNBQzIzMjMiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik02Ni40OTc0IDcuNjI5MzllLTA2SDU3LjI2MVY0LjM5NzRINjIuNDQ2M1Y1LjIxMTczSDU3LjI2MVY2LjY3NzU0SDYwLjE3NzdWNy4zMjg5OUg1Ny4yNjFWOC45NTc2Nkg2MC4xNzc3VjkuNjA5MTNINTcuMjYxVjExLjA3NDlINjAuMTc3N1YxMS43MjY0SDU3LjI2MVYxMy4xOTIySDYyLjQ0NjNWMTMuODQzN0g1Ny4yNjFWMTUuNDcyM0g2MC4xNzc3VjE2LjEyMzhINTcuMjYxVjE3LjU4OTZINjAuMTc3N1YxOC4yNDExSDU3LjI2MVYxOS44Njk3SDYwLjE3NzdWMjAuNTIxMkg1Ny4yNjFWMjEuODI0MUg2Mi40NDYzVjIyLjYzODRINTcuMjYxVjI0LjI2NzFINjAuMTc3N1YyNC43NTU3SDU3LjI2MVYyNi4zODQ0SDYwLjE3NzdWMjcuMDM1OEg1Ny4yNjFWMjguNTAxNkg2MC4xNzc3VjI5LjE1MzFINTcuMjYxVjMwLjYxODlINjIuNDQ2M1YzMS40MzMySDU3LjI2MVYzMi44OTlINjAuMTc3N1YzMy41NTA1SDU3LjI2MVYzNS4wMTYzSDYwLjE3NzdWMzUuODMwNkg1Ny4yNjFWMzcuMjk2NEg2MC4xNzc3VjM3Ljk0NzlINTcuMjYxVjM5LjQxMzdINjIuNDQ2M1Y0MC4yMjhINTcuMjYxVjQzLjMyMjVINzcuODQwMlYzNS4wMTYzSDY2LjQ5NzRWNy42MjkzOWUtMDZaIiBmaWxsPSIjQUMyMzIzIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNzcuODQwMiAyNy42ODczSDY3LjQ2OTZMNjkuNDE0MSAzMC42MTg5TDc5Ljc4NDcgMzQuMjAyVjQzLjk3MzlDNzcuNTQzOSA0NC4zNzMgNzYuNTQzOSA0NS4yNzY5IDc2LjU0MzkgNDcuMDY4NEM3Ni41NDM5IDQ5LjE4NTcgNzcuNTc4IDQ5Ljg1MjEgNzkuNzg0NyA1MEg4Mi44NjM1VjI4LjUwMTZINzcuODQwMlYyNy42ODczWiIgZmlsbD0iI0FDMjMyMyIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTg5Ljk5MzMgNy42MjkzOWUtMDZIODAuNzU3VjQuMzk3NEg4NS43ODAzVjUuMjExNzNIODAuNzU3VjYuNjc3NTRIODMuNTExN1Y3LjMyODk5SDgwLjc1N1Y4Ljk1NzY2SDgzLjUxMTdWOS40NDYyNkg4MC43NTdWMTEuMDc0OUg4My41MTE3VjExLjcyNjRIODAuNzU3VjEzLjE5MjJIODUuNzgwM1YxMy44NDM3SDgwLjc1N1YxNS40NzIzSDgzLjUxMTdWMTYuMTIzOEg4MC43NTdWMTcuNTg5Nkg4My41MTE3VjE4LjI0MTFIODAuNzU3VjE5Ljg2OTdIODMuNTExN1YyMC41MjEySDgwLjc1N1YyMS44MjQxSDg1Ljc4MDNWMjIuNjM4NEg4MC43NTdWMjcuMDM1OEg4My44MzU4VjQzLjMyMjVIODcuMjM4NlYxMi4zNzc5SDkyLjI2MTlWOS40NDYyNkg5My4wNzIxVjEwLjA5NzdIOTkuNzE1OEM5OC45MDU2IDguNzk0NzkgOTcuMTIzMSA3LjY1NDczIDk0Ljg1NDYgNy4wMDMyN0g4OS45OTMzVjcuNjI5MzllLTA2WiIgZmlsbD0iI0FDMjMyMyIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTkyLjI2MTkgMTMuODQzN0g4OC4wNDg4VjQzLjMyMjVIOTIuMjYxOVYyOC41MDE2SDkzLjA3MjFWMjkuMzE2SDk0Ljg1NDZWMjUuNTdIOTMuMDcyMVYyNi4zODQ0SDkyLjI2MTlWMTMuODQzN1oiIGZpbGw9IiNBQzIzMjMiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik05NS42NjQ4IDYuMzUxOFY3LjYyOTM5ZS0wNkgxMTMuMDAzTDExOS42NDcgNi4zNTE4VjIxLjgyNDFMMTEzLjAwMyAyOC41MDE2SDEwNC45MDFMMTA0LjczOSA0My4zMjI1SDk1LjY2NDhWMTEuMDc0OUgxMDAuODVDMTAwLjUyNiA4LjYzMTkzIDk4LjkwNTYgNy4zMjkgOTUuNjY0OCA2LjM1MThaTTEwNC45MDEgNy45ODA0NkgxMTAuNTczVjIwLjUyMTJIMTA0LjkwMVY3Ljk4MDQ2WiIgZmlsbD0iI0FDMjMyMyIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTE0My4zMDUgNy42MjkzOWUtMDZIMTIzLjIxMlY0My4zMjI1SDE0My4zMDVWMzUuMDE2M0gxMzIuNDQ4VjI0LjQzSDE0MS42ODVWMTYuMTIzOEgxMzIuNDQ4VjcuOTgwNDZIMTQzLjMwNVY3LjYyOTM5ZS0wNloiIGZpbGw9IiNBQzIzMjMiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNDcuMTk0IDQzLjMyMjVWNy42MjkzOWUtMDZIMTY1LjE4TDE3MS41IDUuODYzMlYxNi45MzgxTDE2Ni4xNTMgMjEuODI0MUwxNzEuNSAyNS41N1Y0My4zMjI1SDE2Mi40MjZWMjUuNTdIMTU2LjI2OFY0My4zMjI1SDE0Ny4xOTRaTTE1Ni4yNjggNy45ODA0NkgxNjIuNDI2VjE3LjU4OTZIMTU2LjI2OFY3Ljk4MDQ2WiIgZmlsbD0iI0FDMjMyMyIvPgo8L3N2Zz4K`;
 async function fetchLatestVersion() {
   try {
-    const endpoint = `https://unpkg.com/@oyerinde/caliper@latest/package.json`;
+    const endpoint = `https://unpkg.com/@oyerinde/caliper@latest/dist/version.json`;
     const response = await fetch(endpoint, {
       method: "GET",
       cache: "no-store",
@@ -2467,21 +2529,13 @@ var OVERLAY_STYLES = `
 :root {
   interpolate-size: allow-keywords;
   --caliper-primary: ${DEFAULT_THEME.primary};
-  --caliper-primary-90: ${DEFAULT_THEME.primary.replace("1)", "0.9)")};
-  --caliper-primary-95: ${DEFAULT_THEME.primary.replace("1)", "0.95)")};
-  --caliper-primary-50: ${DEFAULT_THEME.primary.replace("1)", "0.5)")};
-  --caliper-primary-05: ${DEFAULT_THEME.primary.replace("1)", "0.05)")};
   --caliper-secondary: ${DEFAULT_THEME.secondary};
-  --caliper-secondary-50: ${DEFAULT_THEME.secondary.replace("1)", "0.5)")};
-  --caliper-secondary-05: ${DEFAULT_THEME.secondary.replace("1)", "0.05)")};
   --caliper-calc-bg: ${DEFAULT_THEME.calcBg};
   --caliper-calc-shadow: ${DEFAULT_THEME.calcShadow};
   --caliper-calc-op-highlight: ${DEFAULT_THEME.calcOpHighlight};
   --caliper-calc-text: ${DEFAULT_THEME.calcText};
   --caliper-text: ${DEFAULT_THEME.text};
   --caliper-projection: ${DEFAULT_THEME.projection};
-  --caliper-projection-90: ${DEFAULT_THEME.projection.replace("1)", "0.9)")};
-  --caliper-projection-light: ${DEFAULT_THEME.projection.replace("1)", "0.2)")};
   --caliper-ruler: ${DEFAULT_THEME.ruler};
 }
 
@@ -3140,7 +3194,7 @@ function BoundaryBoxes(props) {
   const liveSecondaryTarget = createMemo(() => {
     props.viewport.version;
     const res = props.result;
-    if (!(props.isAltPressed || props.isFrozen) || !res) return null;
+    if (!(props.isActivatePressed || props.isFrozen) || !res) return null;
     return getLiveGeometry(res.secondary, res.secondaryHierarchy, res.secondaryPosition, res.secondarySticky, res.secondaryWinX, res.secondaryWinY);
   });
   createEffect(on([liveSelectionTarget, liveSecondaryTarget, () => props.animation.lerpFactor, () => props.metadata.element], ([selection, secondary, factor, element]) => {
@@ -3294,7 +3348,7 @@ function SelectionLabel(props) {
         insert(_el$, () => data().width, _el$2);
         insert(_el$, () => data().height, null);
         createRenderEffect((_p$) => {
-          var _v$ = `translate3d(${data().x - props.viewport.scrollX}px, ${data().y - props.viewport.scrollY}px, 0) translate(-50%, 0)`, _v$2 = props.isAltPressed ? 0 : 1;
+          var _v$ = `translate3d(${data().x - props.viewport.scrollX}px, ${data().y - props.viewport.scrollY}px, 0) translate(-50%, 0)`, _v$2 = props.isActivatePressed ? 0 : 1;
           _v$ !== _p$.e && setStyleProperty(_el$, "transform", _p$.e = _v$);
           _v$2 !== _p$.t && setStyleProperty(_el$, "opacity", _p$.t = _v$2);
           return _p$;
@@ -3547,6 +3601,7 @@ function RulerOverlay(props) {
   const [draggingId, setDraggingId] = createSignal(null);
   const [hoveredId, setHoveredId] = createSignal(null);
   const [selectedIds, setSelectedIds] = createSignal(/* @__PURE__ */ new Set());
+  const [rulerOrigins, setRulerOrigins] = createSignal(/* @__PURE__ */ new Map());
   createEffect(() => {
     const lines = props.state().lines;
     const currentIds = selectedIds();
@@ -3560,6 +3615,45 @@ function RulerOverlay(props) {
       setSelectedIds(validIds);
     }
   });
+  createEffect(() => {
+    const lines = props.state().lines;
+    const vp = props.viewport();
+    const origins = rulerOrigins();
+    let updated = false;
+    const newOrigins = new Map(origins);
+    lines.forEach((line) => {
+      if (!newOrigins.has(line.id)) {
+        newOrigins.set(line.id, {
+          width: vp.width,
+          height: vp.height
+        });
+        updated = true;
+      }
+    });
+    const lineIds = new Set(lines.map((l) => l.id));
+    newOrigins.forEach((_, id) => {
+      if (!lineIds.has(id)) {
+        newOrigins.delete(id);
+        updated = true;
+      }
+    });
+    if (updated) {
+      setRulerOrigins(newOrigins);
+    }
+  });
+  const getProportionalPosition = (line) => {
+    const vp = props.viewport();
+    const origin = rulerOrigins().get(line.id);
+    if (!origin) {
+      return line.position;
+    }
+    const isV = line.type === "vertical";
+    const originDim = isV ? origin.width : origin.height;
+    const currentDim = isV ? vp.width : vp.height;
+    if (originDim === 0) return line.position;
+    const ratio = line.position / originDim;
+    return ratio * currentDim;
+  };
   const getSnapPoints = (isV) => {
     const points = [];
     const state = props.projectionState?.();
@@ -3643,8 +3737,17 @@ function RulerOverlay(props) {
       activeLines.forEach((line) => {
         const isLineV = line.type === "vertical";
         const max = (isLineV ? vp.width : vp.height) - 1;
-        let newPos = Math.max(0, Math.min(line.position + delta, max));
+        const currentPos = getProportionalPosition(line);
+        let newPos = Math.max(0, Math.min(currentPos + delta, max));
         newPos = applySnap(newPos, isLineV);
+        setRulerOrigins((prev) => {
+          const next = new Map(prev);
+          next.set(line.id, {
+            width: vp.width,
+            height: vp.height
+          });
+          return next;
+        });
         props.onUpdate(line.id, newPos);
       });
     }
@@ -3680,6 +3783,20 @@ function RulerOverlay(props) {
     e.stopPropagation();
     setDraggingId(id);
     target.setPointerCapture(e.pointerId);
+    const vp = props.viewport();
+    const line = props.state().lines.find((l) => l.id === id);
+    if (line) {
+      const currentPos = getProportionalPosition(line);
+      setRulerOrigins((prev) => {
+        const next = new Map(prev);
+        next.set(id, {
+          width: vp.width,
+          height: vp.height
+        });
+        return next;
+      });
+      props.onUpdate(id, currentPos);
+    }
     if (e.shiftKey) {
       setSelectedIds((prev) => {
         const next = new Set(prev);
@@ -3693,10 +3810,10 @@ function RulerOverlay(props) {
       }
     }
     const onPointerMove = (moveEvent) => {
-      const vp = props.viewport();
+      const vp2 = props.viewport();
       const isV = type === "vertical";
       let pos = isV ? moveEvent.clientX : moveEvent.clientY;
-      const max = (isV ? vp.width : vp.height) - 1;
+      const max = (isV ? vp2.width : vp2.height) - 1;
       pos = Math.max(0, Math.min(pos, max));
       pos = applySnap(pos, isV);
       props.onUpdate(id, pos);
@@ -3735,42 +3852,48 @@ function RulerOverlay(props) {
     const ids = selectedIds();
     if (ids.size < 2) return [];
     const lines = props.state().lines.filter((l) => ids.has(l.id));
-    const vLines = lines.filter((l) => l.type === "vertical").sort((a, b) => a.position - b.position);
-    const hLines = lines.filter((l) => l.type === "horizontal").sort((a, b) => a.position - b.position);
+    const vLinesWithPos = lines.filter((l) => l.type === "vertical").map((l) => ({
+      line: l,
+      pos: getProportionalPosition(l)
+    })).sort((a, b) => a.pos - b.pos);
+    const hLinesWithPos = lines.filter((l) => l.type === "horizontal").map((l) => ({
+      line: l,
+      pos: getProportionalPosition(l)
+    })).sort((a, b) => a.pos - b.pos);
     const result = [];
     const vp = props.viewport();
-    for (let i = 0; i < vLines.length - 1; i++) {
-      const l1 = vLines[i];
-      const l2 = vLines[i + 1];
-      const val = l2.position - l1.position;
+    for (let i = 0; i < vLinesWithPos.length - 1; i++) {
+      const l1 = vLinesWithPos[i];
+      const l2 = vLinesWithPos[i + 1];
+      const val = l2.pos - l1.pos;
       if (val > 0) {
         result.push({
-          x1: l1.position,
+          x1: l1.pos,
           y1: vp.height / 2 + 100,
           // Move default bridge line off center for better visibility
-          x2: l2.position,
+          x2: l2.pos,
           y2: vp.height / 2 + 100,
           value: val,
           type: "vertical",
-          labelX: l1.position + val / 2,
+          labelX: l1.pos + val / 2,
           labelY: vp.height / 2 + 85
         });
       }
     }
-    for (let i = 0; i < hLines.length - 1; i++) {
-      const l1 = hLines[i];
-      const l2 = hLines[i + 1];
-      const val = l2.position - l1.position;
+    for (let i = 0; i < hLinesWithPos.length - 1; i++) {
+      const l1 = hLinesWithPos[i];
+      const l2 = hLinesWithPos[i + 1];
+      const val = l2.pos - l1.pos;
       if (val > 0) {
         result.push({
           x1: vp.width / 2 + 100,
-          y1: l1.position,
+          y1: l1.pos,
           x2: vp.width / 2 + 100,
-          y2: l2.position,
+          y2: l2.pos,
           value: val,
           type: "horizontal",
           labelX: vp.width / 2 + 115,
-          labelY: l1.position + val / 2
+          labelY: l1.pos + val / 2
         });
       }
     }
@@ -3858,6 +3981,9 @@ function RulerOverlay(props) {
       },
       children: (line) => createComponent(RulerLineItem, {
         line,
+        get pixelPosition() {
+          return getProportionalPosition(line);
+        },
         get isDragging() {
           return draggingId() === line.id;
         },
@@ -3881,7 +4007,7 @@ function RulerOverlay(props) {
 function RulerLineItem(props) {
   const lineStyle = createMemo(() => {
     const isV = props.line.type === "vertical";
-    const pos = props.line.position;
+    const pos = props.pixelPosition;
     const isActive = props.isDragging || props.isHovered || props.isSelected;
     return {
       left: "0",
@@ -3900,7 +4026,7 @@ function RulerLineItem(props) {
     var _el$9 = _tmpl$43();
     className(_el$9, `${PREFIX}ruler-line-hit`);
     createRenderEffect((_p$) => {
-      var _v$11 = props.line.id, _v$12 = props.line.type, _v$13 = props.line.type === "vertical" ? hitSize() : "100%", _v$14 = props.line.type === "vertical" ? "100%" : hitSize(), _v$15 = `translate3d(${props.line.type === "vertical" ? props.line.position - hitOffset() : 0}px, ${props.line.type === "vertical" ? 0 : props.line.position - hitOffset()}px, 0)`, _v$16 = props.line.type === "vertical" ? "col-resize" : "row-resize";
+      var _v$11 = props.line.id, _v$12 = props.line.type, _v$13 = props.line.type === "vertical" ? hitSize() : "100%", _v$14 = props.line.type === "vertical" ? "100%" : hitSize(), _v$15 = `translate3d(${props.line.type === "vertical" ? props.pixelPosition - hitOffset() : 0}px, ${props.line.type === "vertical" ? 0 : props.pixelPosition - hitOffset()}px, 0)`, _v$16 = props.line.type === "vertical" ? "col-resize" : "row-resize";
       _v$11 !== _p$.e && setAttribute(_el$9, "data-ruler-id", _p$.e = _v$11);
       _v$12 !== _p$.t && setAttribute(_el$9, "data-ruler-type", _p$.t = _v$12);
       _v$13 !== _p$.a && setStyleProperty(_el$9, "width", _p$.a = _v$13);
@@ -3934,29 +4060,30 @@ function RulerLineItem(props) {
         e.stopPropagation();
         const isV = props.line.type === "vertical";
         const vp = props.viewport();
+        const pos = props.pixelPosition;
         props.onLineClick?.({
           type: "distance",
-          value: props.line.position,
+          value: pos,
           start: isV ? {
-            x: props.line.position,
+            x: pos,
             y: 0
           } : {
             x: 0,
-            y: props.line.position
+            y: pos
           },
           end: isV ? {
-            x: props.line.position,
+            x: pos,
             y: vp.height
           } : {
             x: vp.width,
-            y: props.line.position
+            y: pos
           }
-        }, props.line.position);
+        }, pos);
       };
       className(_el$1, `${PREFIX}label ${PREFIX}ruler-label`);
-      insert(_el$1, () => Math.round(props.line.position * 100) / 100);
+      insert(_el$1, () => Math.round(props.pixelPosition * 100) / 100);
       createRenderEffect((_p$) => {
-        var _v$17 = `translate3d(${props.line.type === "vertical" ? props.line.position + 10 : 20}px, ${props.line.type === "vertical" ? 20 : props.line.position + 10}px, 0)`, _v$18 = props.isSelected && !props.isHovered && !props.isDragging ? "0.7" : "1";
+        var _v$17 = `translate3d(${props.line.type === "vertical" ? props.pixelPosition + 10 : 20}px, ${props.line.type === "vertical" ? 20 : props.pixelPosition + 10}px, 0)`, _v$18 = props.isSelected && !props.isHovered && !props.isDragging ? "0.7" : "1";
         _v$17 !== _p$.e && setStyleProperty(_el$1, "transform", _p$.e = _v$17);
         _v$18 !== _p$.t && setStyleProperty(_el$1, "opacity", _p$.t = _v$18);
         return _p$;
@@ -3997,8 +4124,8 @@ function Overlay(props) {
     get result() {
       return props.result();
     },
-    get isAltPressed() {
-      return props.isAltPressed();
+    get isActivatePressed() {
+      return props.isActivatePressed();
     },
     get isFrozen() {
       return props.isFrozen();
@@ -4013,15 +4140,15 @@ function Overlay(props) {
     get metadata() {
       return props.selectionMetadata();
     },
-    get isAltPressed() {
-      return props.isAltPressed();
+    get isActivatePressed() {
+      return props.isActivatePressed();
     },
     get viewport() {
       return props.viewport();
     }
   }), createComponent(Show, {
     get when() {
-      return memo(() => !!(props.isAltPressed() || props.isFrozen()))() && resultData();
+      return memo(() => !!(props.isActivatePressed() || props.isFrozen()))() && resultData();
     },
     get children() {
       return createComponent(Portal, {
@@ -4208,12 +4335,34 @@ function Root(config) {
   const [rulerState, setRulerState] = createSignal({
     lines: []
   });
-  const [isAltPressed, setIsAltPressed] = createSignal(false);
+  const [isActivatePressed, setIsActivatePressed] = createSignal(false);
   const [isFrozen, setIsFrozen] = createSignal(false);
+  const ignoredElements = /* @__PURE__ */ new WeakSet();
   let viewportRafId = null;
   let resizeObserver = null;
+  let observedRoot = false;
   let observedPrimary = null;
   let observedSecondary = null;
+  const resetCalculatorUI = () => {
+    setCalculatorState(null);
+    setActiveCalculatorLine(null);
+    if (projectionState().direction !== null) {
+      setActiveInputFocus("projection");
+    }
+  };
+  const syncCalculatorUI = (state) => {
+    if (!state.isActive) {
+      resetCalculatorUI();
+      return;
+    }
+    setCalculatorState(state);
+    if (state.operation) {
+      setActiveCalculatorLine(null);
+    }
+  };
+  const isActive = createMemo(() => {
+    return !!selectionMetadata().element || !!result() || rulerState().lines.length > 0 || projectionState().direction !== null;
+  });
   const syncViewport = () => {
     setViewport((prev) => ({
       scrollX: window.scrollX,
@@ -4225,6 +4374,7 @@ function Root(config) {
     viewportRafId = null;
   };
   const scheduleUpdate = () => {
+    if (!isActive()) return;
     if (!viewportRafId) {
       viewportRafId = requestAnimationFrame(syncViewport);
     }
@@ -4242,6 +4392,8 @@ function Root(config) {
         if (system?.getState() === "FROZEN") {
           system?.unfreeze(false);
         }
+      } else {
+        setActiveInputFocus("projection");
       }
     });
     rulerSystem = createRulerSystem();
@@ -4253,8 +4405,6 @@ function Root(config) {
       setResult(system.getCurrentResult());
       setIsFrozen(system.getState() === "FROZEN");
     });
-    const currentResult = system.getCurrentResult();
-    setResult(currentResult);
     const unsubscribeUpdate = selectionSystem.onUpdate((metadata) => {
       setSelectionMetadata(metadata);
     });
@@ -4266,16 +4416,14 @@ function Root(config) {
     const performSelection = (x, y) => {
       const element = getTopElementAtPoint(x, y);
       if (element && selectionSystem) {
-        setResult(null);
-        setCalculatorState(null);
-        setActiveInputFocus("calculator");
-        if (projectionSystem) {
-          projectionSystem.clear();
-        }
         if (system) {
           system.abort();
-          system.getCalculator().close();
         }
+        if (projectionSystem) {
+          projectionSystem.clear();
+        }
+        resetCalculatorUI();
+        setActiveInputFocus("calculator");
         lastHoveredElement = null;
         selectionDelegate.cancel();
         measureDelegate.cancel();
@@ -4301,6 +4449,9 @@ function Root(config) {
       }
       return isSelectKeyDown() && !ctrlKey && !metaKey && !altKey && !shiftKey;
     };
+    const isActivateActive = (e) => {
+      return e.key === commands.activate || commands.activate === "Alt" && (e.key === "Alt" || e.key === "AltGraph");
+    };
     const handlePointerDown = (e) => {
       lastPointerPos = {
         x: e.clientX,
@@ -4340,6 +4491,9 @@ function Root(config) {
     let mouseMoveRafId = null;
     let lastHoveredElement = null;
     const selectionDelegate = createSuppressionDelegate((el) => {
+      if (selectionSystem?.getSelected() !== el) {
+        system?.abort();
+      }
       lastHoveredElement = el;
       selectionSystem?.select(el);
     });
@@ -4361,7 +4515,7 @@ function Root(config) {
       };
       setCursor(cursorPoint);
       const selectedElement = selectionSystem.getSelected();
-      const isAlt = isAltPressed();
+      const isAlt = isActivatePressed();
       const state = system?.getState();
       if (selectedElement) {
         const hoveredElement = getTopElementAtPoint(e.clientX, e.clientY);
@@ -4389,15 +4543,14 @@ function Root(config) {
       }
     };
     const handleKeyDown = (e) => {
-      if (e.key === commands.clear) {
-        setIsAltPressed(false);
-        setCalculatorState(null);
-        setActiveCalculatorLine(null);
-        if (selectionSystem) {
-          lastHoveredElement = null;
-          selectionDelegate.cancel();
-          measureDelegate.cancel();
-          selectionSystem.clear();
+      if (e.key === commands.clear && !isEditable(e.target)) {
+        if (!isActive()) return;
+        e.preventDefault();
+        e.stopImmediatePropagation();
+        setIsActivatePressed(false);
+        resetCalculatorUI();
+        if (system) {
+          system.abort();
         }
         if (projectionSystem) {
           projectionSystem.clear();
@@ -4405,18 +4558,18 @@ function Root(config) {
         if (rulerSystem) {
           rulerSystem.clear();
         }
-        if (system) {
-          system.abort();
-          const calc = system.getCalculator();
-          calc.close();
-          setResult(null);
+        if (selectionSystem) {
+          lastHoveredElement = null;
+          selectionDelegate.cancel();
+          measureDelegate.cancel();
+          selectionSystem.clear();
         }
         return;
       }
-      if (e.key === commands.select) {
+      if (e.key === commands.select && !isEditable(e.target)) {
         setIsSelectKeyDown(true);
       }
-      if (e.key.toLowerCase() === commands.ruler && e.shiftKey && rulerSystem) {
+      if (e.key.toLowerCase() === commands.ruler.toLowerCase() && e.shiftKey && rulerSystem && !isEditable(e.target)) {
         e.preventDefault();
         const vp = viewport();
         const x = Math.max(0, Math.min(cursor().x, vp.width));
@@ -4424,31 +4577,34 @@ function Root(config) {
         rulerSystem.addPair(x, y);
         return;
       }
-      const isAltKey = e.key === "Alt" || e.key === "AltGraph" || e.key === commands.activate;
-      if (isAltKey) {
-        e.preventDefault();
-        if (!isAltPressed()) {
+      if (isActivateActive(e)) {
+        if (selectionMetadata().element) {
+          e.preventDefault();
+          e.stopImmediatePropagation();
+        }
+        if (!isActivatePressed() && isActive()) {
           if (system) {
             system.abort();
-            setResult(null);
-            handleCalculatorClose();
           }
           if (projectionSystem) {
             projectionSystem.clear();
           }
+          resetCalculatorUI();
         }
-        setIsAltPressed(true);
-      } else if (e.key === commands.freeze && e.target === document.body && system) {
+        setIsActivatePressed(true);
+      } else if (e.key === commands.freeze && !isEditable(e.target) && system) {
         const state = system.getState();
         if (state === "FROZEN") {
           e.preventDefault();
-          system.unfreeze(isAltPressed());
+          e.stopImmediatePropagation();
+          system.unfreeze(isActivatePressed());
         } else if (selectionMetadata().element) {
           e.preventDefault();
+          e.stopImmediatePropagation();
           system.freeze();
         }
       } else {
-        const key = e.key.toLowerCase();
+        const key = e.key;
         const {
           calculator,
           projection
@@ -4484,7 +4640,7 @@ function Root(config) {
           [projection.right]: "right"
         };
         const dir = dirMap[key];
-        if (dir && selectionMetadata().element) {
+        if (dir && selectionMetadata().element && !isEditable(e.target)) {
           e.preventDefault();
           e.stopImmediatePropagation();
           setActiveInputFocus("projection");
@@ -4538,10 +4694,11 @@ function Root(config) {
           };
           const targetType = typeMap[key];
           if (targetType) {
-            e.preventDefault();
             const currentLines = result()?.lines || [];
             const targetLine = currentLines.find((l) => l.type === targetType);
             if (targetLine) {
+              e.preventDefault();
+              e.stopImmediatePropagation();
               const liveValue = getLiveLineValue(targetLine, result());
               handleLineClick(targetLine, liveValue);
             }
@@ -4553,26 +4710,29 @@ function Root(config) {
       if (e.key === commands.select) {
         setIsSelectKeyDown(false);
       }
-      const isAltKey = e.key === "Alt" || e.key === "AltGraph" || e.key === commands.activate;
-      if (isAltKey) {
+      if (isActivateActive(e)) {
         e.preventDefault();
-        if (isAltPressed()) {
-          setIsAltPressed(false);
-          if (system) {
+        if (isActivatePressed()) {
+          setIsActivatePressed(false);
+          if (system && isActive()) {
             system.stop();
           }
         }
       }
     };
     const handleBlur = () => {
-      if (isAltPressed()) {
-        setIsAltPressed(false);
-        if (system) {
+      if (isActivatePressed()) {
+        setIsActivatePressed(false);
+        if (system && isActive()) {
           system.stop();
-          setResult(null);
         }
       }
     };
+    const handleFocus = () => {
+      if (!isActive()) return;
+      scheduleUpdate();
+      window.focus();
+    };
     window.addEventListener("pointerdown", handlePointerDown, {
       capture: true
     });
@@ -4590,6 +4750,7 @@ function Root(config) {
       capture: true
     });
     window.addEventListener("blur", handleBlur);
+    window.addEventListener("focus", handleFocus);
     onCleanup(() => {
       window.removeEventListener("pointerdown", handlePointerDown, {
         capture: true
@@ -4608,6 +4769,7 @@ function Root(config) {
         capture: true
       });
       window.removeEventListener("blur", handleBlur);
+      window.removeEventListener("focus", handleFocus);
       if (mouseMoveRafId) {
         cancelAnimationFrame(mouseMoveRafId);
       }
@@ -4617,7 +4779,9 @@ function Root(config) {
       unsubscribeUpdate();
       unsubscribeProjection();
       unsubscribeRuler();
-      handleCleanup();
+      if (system) {
+        system.cleanup();
+      }
       if (projectionSystem) {
         projectionSystem = null;
       }
@@ -4627,8 +4791,7 @@ function Root(config) {
     });
   });
   createEffect(() => {
-    const active = !!selectionMetadata().element || !!result();
-    if (active) {
+    if (isActive()) {
       window.addEventListener("scroll", scheduleUpdate, {
         passive: true,
         capture: true
@@ -4645,8 +4808,15 @@ function Root(config) {
       });
     }
   });
-  const updateResizeObservations = (primaryEl, secondaryEl) => {
+  const updateResizeObservations = (active, primaryEl, secondaryEl) => {
     if (!resizeObserver) return;
+    if (active && !observedRoot) {
+      resizeObserver.observe(document.documentElement);
+      observedRoot = true;
+    } else if (!active && observedRoot) {
+      resizeObserver.unobserve(document.documentElement);
+      observedRoot = false;
+    }
     if (primaryEl === observedPrimary && secondaryEl === observedSecondary) {
       return;
     }
@@ -4659,10 +4829,12 @@ function Root(config) {
       observedSecondary = null;
     }
     if (primaryEl && primaryEl !== observedPrimary) {
+      ignoredElements.add(primaryEl);
       resizeObserver.observe(primaryEl);
       observedPrimary = primaryEl;
     }
     if (secondaryEl && secondaryEl !== primaryEl && secondaryEl !== observedSecondary) {
+      ignoredElements.add(secondaryEl);
       resizeObserver.observe(secondaryEl);
       observedSecondary = secondaryEl;
     }
@@ -4692,6 +4864,17 @@ function Root(config) {
       secondaryChanged = false;
     };
     resizeObserver = new ResizeObserver((entries) => {
+      if (!isActive()) return;
+      let hasActualResize = false;
+      for (const entry of entries) {
+        if (ignoredElements.has(entry.target)) {
+          ignoredElements.delete(entry.target);
+          continue;
+        }
+        hasActualResize = true;
+      }
+      if (!hasActualResize) return;
+      console.log("[Caliper] resize observed");
       for (const entry of entries) {
         if (entry.target === document.documentElement) {
           sentinelResized = true;
@@ -4718,7 +4901,6 @@ function Root(config) {
         }, remaining);
       }
     });
-    resizeObserver.observe(document.documentElement);
     onCleanup(() => {
       resizeObserver?.disconnect();
       resizeObserver = null;
@@ -4728,14 +4910,15 @@ function Root(config) {
     });
   });
   createEffect(() => {
+    const active = isActive();
     const primaryEl = selectionMetadata().element;
     const currentResult = result();
     const secondaryEl = isFrozen() ? currentResult?.secondaryElement ?? null : null;
-    if (!primaryEl && !secondaryEl) {
-      updateResizeObservations(null, null);
+    if (!active) {
+      updateResizeObservations(false, null, null);
       return;
     }
-    updateResizeObservations(primaryEl, secondaryEl);
+    updateResizeObservations(true, primaryEl, secondaryEl);
   });
   createEffect(() => {
     const calcLine = activeCalculatorLine();
@@ -4756,12 +4939,10 @@ function Root(config) {
   });
   const handleLineClick = (line, liveValue) => {
     if (system) {
-      setActiveCalculatorLine(null);
       const calc = system.getCalculator();
       calc.open(liveValue);
       setActiveInputFocus("calculator");
-      const calcState = calc.getState();
-      setCalculatorState(calcState.isActive ? calcState : null);
+      syncCalculatorUI(calc.getState());
       if ("startSync" in line) {
         setActiveCalculatorLine(line);
       }
@@ -4774,67 +4955,35 @@ function Root(config) {
       if (/^[+\-*/.]$/.test(key)) {
         setActiveInputFocus("calculator");
       }
-      const calcState = calc.getState();
-      const isActive = calcState.isActive;
-      setCalculatorState(isActive ? calcState : null);
-      if (calcState.operation) {
-        setActiveCalculatorLine(null);
-      }
-      if (!isActive && projectionState().direction !== null) {
-        setActiveInputFocus("projection");
-      }
+      syncCalculatorUI(calc.getState());
     }
   };
   const handleCalculatorBackspace = () => {
     if (system) {
       const calc = system.getCalculator();
       calc.handleBackspace();
-      const calcState = calc.getState();
-      const isActive = calcState.isActive;
-      setCalculatorState(isActive ? calcState : null);
-      if (!isActive) {
-        setActiveCalculatorLine(null);
-        if (projectionState().direction !== null) {
-          setActiveInputFocus("projection");
-        }
-      }
+      syncCalculatorUI(calc.getState());
     }
   };
   const handleCalculatorDelete = () => {
     if (system) {
       const calc = system.getCalculator();
       calc.handleDelete();
-      const calcState = calc.getState();
-      const isActive = calcState.isActive;
-      setCalculatorState(isActive ? calcState : null);
-      setActiveCalculatorLine(null);
-      if (!isActive && projectionState().direction !== null) {
-        setActiveInputFocus("projection");
-      }
+      syncCalculatorUI(calc.getState());
     }
   };
   const handleCalculatorEnter = () => {
     if (system) {
       const calc = system.getCalculator();
       calc.handleEnter();
-      const calcState = calc.getState();
-      const isActive = calcState.isActive;
-      setCalculatorState(isActive ? calcState : null);
-      setActiveCalculatorLine(null);
-      if (!isActive && projectionState().direction !== null) {
-        setActiveInputFocus("projection");
-      }
+      syncCalculatorUI(calc.getState());
     }
   };
   const handleCalculatorClose = () => {
     if (system) {
       const calc = system.getCalculator();
       calc.close();
-      setCalculatorState(null);
-      setActiveCalculatorLine(null);
-      if (projectionState().direction !== null) {
-        setActiveInputFocus("projection");
-      }
+      resetCalculatorUI();
     }
   };
   const handleRulerUpdate = (id, position) => {
@@ -4843,17 +4992,11 @@ function Root(config) {
   const handleRulerRemove = (id) => {
     rulerSystem?.removeLine(id);
   };
-  const handleCleanup = () => {
-    if (system) system.cleanup();
-    if (selectionSystem) selectionSystem.clear();
-    if (projectionSystem) projectionSystem.clear();
-    if (rulerSystem) rulerSystem.clear();
-  };
   return createComponent(Overlay, {
     result,
     cursor,
     selectionMetadata,
-    isAltPressed,
+    isActivatePressed,
     isFrozen,
     animation,
     viewport,
@@ -4944,6 +5087,7 @@ function createOverlay(config) {
   };
   const commands = mergeCommands(mergedConfig.commands);
   const animation = mergeAnimation(mergedConfig.animation);
+  const theme = mergeTheme(mergedConfig.theme);
   let cleanup = null;
   const instance = {
     mounted: false,
@@ -4953,9 +5097,7 @@ function createOverlay(config) {
         instance.mounted = true;
         return;
       }
-      if (mergedConfig.theme) {
-        applyTheme(mergedConfig.theme);
-      }
+      applyTheme(theme);
       const target = container || document.body;
       injectStyles();
       const overlayContainer = document.createElement("div");
@@ -4986,12 +5128,12 @@ function createOverlay(config) {
   return instance;
 }
 if (IS_BROWSER2) {
-  showVersionInfo("0.1.0").catch(() => {
+  showVersionInfo("0.1.1").catch(() => {
   });
 }
 
 // src/index.ts
-var VERSION = "0.1.0";
+var VERSION = "0.1.1";
 
 exports.VERSION = VERSION;
 exports.getConfig = getConfig;