@supernovaio/prototyping-tooling - npm Package Compare versions

Comparing version 0.9.7-alpha.1 to 0.9.7-alpha.2

dist/debug-BuKzUOMn.js

+let n = !1;
+function i(e = !0) {
+  n = e;
+}
+function l(e, ...t) {
+  if (!n) return;
+  const o = e === "client" ? "🔵" : e === "host" ? "🟡" : e === "annotation" ? "🟢" : "⚪", s = (/* @__PURE__ */ new Date()).toISOString().split("T")[1].slice(0, -1);
+  console.log(`[${s}] ${o} [${e.toUpperCase()}]`, ...t);
+}
+export {
+  l as d,
+  i as e
+};

dist/useDesignMode--DcwfmhZ.js

+import { useState as r, useEffect as S, useCallback as s } from "react";
+import { d as i } from "./debug-BuKzUOMn.js";
+function E(e) {
+  const [d, u] = r(!1), [a, l] = r(""), [b, o] = r("disconnected");
+  S(() => {
+    if (!e) {
+      i("client", "useElementSelector: No host provided");
+      return;
+    }
+    const t = e.getStatus();
+    i("client", "useElementSelector: Initial status:", t), o(t);
+    const n = e.on("connected", () => {
+      i("client", "useElementSelector: Connected"), o("connected");
+    }), c = e.on("disconnected", () => {
+      i("client", "useElementSelector: Disconnected"), o("disconnected");
+    });
+    return () => {
+      n(), c();
+    };
+  }, [e]), S(() => {
+    if (!e) return;
+    const t = e.on("xpath-selected", (c) => {
+      l(c);
+    }), n = e.on("select-mode-disabled", () => {
+      u(!1);
+    });
+    return () => {
+      t(), n();
+    };
+  }, [e]);
+  const f = s((t) => {
+    if (e)
+      try {
+        e.enableSelectMode(t), u(t);
+      } catch (n) {
+        i("client", "Failed to toggle select mode:", n);
+      }
+  }, [e]), m = s(() => {
+    l("");
+  }, []);
+  return { selectMode: d, connectionStatus: b, selectedXPath: a, enableSelectMode: f, clearXPath: m };
+}
+function M(e) {
+  const [d, u] = r(!1), [a, l] = r(null), b = s((t) => {
+    e && (e.enableDesignMode(t), u(t), t || l(null));
+  }, [e]), o = s((t, n) => {
+    e && (e.updateElementText(t, n), l((c) => c ? { ...c, text: n } : null));
+  }, [e]), f = s((t, n, c) => {
+    e && e.updateProperty(t, n, c);
+  }, [e]), m = s(() => {
+    e && (e.deselectElement(), l(null));
+  }, [e]);
+  return S(() => {
+    if (!e) return;
+    const t = e.on("element-selected", (c) => {
+      l(c);
+    }), n = e.on("design-mode-disabled", () => {
+      d && u(!1);
+    });
+    return () => {
+      t(), n();
+    };
+  }, [e, d]), { designMode: d, selectedElement: a, enableDesignMode: b, updateText: o, updateProperty: f, deselectElement: m };
+}
+export {
+  M as a,
+  E as u
+};

dist/build/index.js

@@ -8,4 +8,4 @@ import { parse as P } from "@babel/parser";
   let r = 0;
-  for (let c = 0; c < d.length; c++) {
-    const s = d.charCodeAt(c);
+  for (let f = 0; f < d.length; f++) {
+    const s = d.charCodeAt(f);
     r = (r << 5) - r + s, r = r & r;
@@ -15,6 +15,6 @@ }
 }
-function B(d = {}) {
-  const { prefix: r = "forge" } = d, c = (s, i, u) => {
-    const a = T(`${s}:${i}:${u}`);
-    return `${r}-${a}-${i}-${u}`;
+function k(d = {}) {
+  const { prefix: r = "forge" } = d, f = (s, i, u) => {
+    const o = T(`${s}:${i}:${u}`);
+    return `${r}-${o}-${i}-${u}`;
   };
@@ -26,3 +26,3 @@ return { name: "forge-id-plugin", enforce: "pre", transform(s, i) {
     try {
-      let a = function(e) {
+      let o = function(e) {
         const n = e.parent;
@@ -34,6 +34,6 @@ if (n.type === "VariableDeclarator" && n.id.type === "Identifier" && /^[A-Z]/.test(n.id.name))
           if (l) {
-            const f = l.parent;
-            if (f.type === "VariableDeclarator" && f.id.type === "Identifier" && /^[A-Z]/.test(f.id.name) || f.type === "ExportDefaultDeclaration")
+            const c = l.parent;
+            if (c.type === "VariableDeclarator" && c.id.type === "Identifier" && /^[A-Z]/.test(c.id.name) || c.type === "ExportDefaultDeclaration")
               return !0;
-            if (f.type === "CallExpression") {
+            if (c.type === "CallExpression") {
               const p = l.parentPath;
@@ -50,16 +50,16 @@ if (p) {
       };
-      const x = P(s, { sourceType: "module", plugins: ["jsx", "typescript"] }), J = /* @__PURE__ */ new Set();
-      let b = !1, o = 0;
+      const x = P(s, { sourceType: "module", plugins: ["jsx", "typescript"] }), C = /* @__PURE__ */ new Set();
+      let b = !1, a = 0;
       if (E(x, { FunctionDeclaration: { enter(e) {
-        e.node.id && /^[A-Z]/.test(e.node.id.name) && o++;
+        e.node.id && /^[A-Z]/.test(e.node.id.name) && a++;
       }, exit(e) {
-        e.node.id && /^[A-Z]/.test(e.node.id.name) && o--;
+        e.node.id && /^[A-Z]/.test(e.node.id.name) && a--;
       } }, ArrowFunctionExpression: { enter(e) {
-        a(e) && o++;
+        o(e) && a++;
       }, exit(e) {
-        a(e) && o--;
+        o(e) && a--;
       } }, FunctionExpression: { enter(e) {
-        a(e) && o++;
+        o(e) && a++;
       }, exit(e) {
-        a(e) && o--;
+        o(e) && a--;
       } }, JSXOpeningElement(e) {
@@ -70,6 +70,8 @@ if (e.node.name.type === "JSXIdentifier") {
             return;
-          if (l && o > 0) {
+          if (l && a > 0) {
             const t = e.scope.getBinding(n);
-            if (t && t.scope.path.type !== "Program")
+            if (t && t.scope.path.type !== "Program") {
+              console.log(`[Plugin] Skipping ${n} - locally-scoped dynamic component inside definition`);
               return;
+            }
           }
@@ -81,9 +83,9 @@ if (!e.node.attributes.some((t) => t.type === "JSXAttribute" && t.name.type === "JSXIdentifier" && t.name.name === "data-forge-id")) {
             if (!m) return;
-            const A = c(i, t.line, t.column), v = { type: "JSXAttribute", name: { type: "JSXIdentifier", name: "data-forge-id" }, value: { type: "StringLiteral", value: A }, loc: e.node.loc }, h = { type: "JSXAttribute", name: { type: "JSXIdentifier", name: "data-component" }, value: { type: "StringLiteral", value: n }, loc: e.node.loc }, C = { type: "JSXAttribute", name: { type: "JSXIdentifier", name: "data-source-pos" }, value: { type: "StringLiteral", value: `${u}:${t.line}:${t.column}:${m.line}:${m.column}` }, loc: e.node.loc }, X = !l && o > 0, $ = e.node.attributes.some((g) => g.type === "JSXSpreadAttribute");
-            if (X && $) {
+            const A = f(i, t.line, t.column), v = { type: "JSXAttribute", name: { type: "JSXIdentifier", name: "data-forge-id" }, value: { type: "StringLiteral", value: A }, loc: e.node.loc }, $ = { type: "JSXAttribute", name: { type: "JSXIdentifier", name: "data-component" }, value: { type: "StringLiteral", value: n }, loc: e.node.loc }, h = { type: "JSXAttribute", name: { type: "JSXIdentifier", name: "data-source-pos" }, value: { type: "StringLiteral", value: `${u}:${t.line}:${t.column}:${m.line}:${m.column}` }, loc: e.node.loc }, J = !l && a > 0, X = e.node.attributes.some((g) => g.type === "JSXSpreadAttribute");
+            if (J && X) {
               const g = e.node.attributes.findIndex((D) => D.type === "JSXSpreadAttribute");
-              e.node.attributes.splice(g, 0, v, h, C);
+              e.node.attributes.splice(g, 0, v, $, h);
             } else
-              e.node.attributes.push(v, h, C);
-            J.add(A), b = !0;
+              e.node.attributes.push(v, $, h);
+            C.add(A), b = !0;
           }
@@ -95,4 +97,4 @@ }
       }
-    } catch {
-      return null;
+    } catch (o) {
+      return o instanceof Error && console.warn(`Failed to parse ${i} for forge-id injection: ${o.message}`), null;
     }
@@ -103,3 +105,3 @@ return null;
 export {
-  B as supernovaDesignPlugin
+  k as supernovaDesignPlugin
 };

dist/client.js

@@ -1,3 +0,3 @@
-import { b as $, c as X, R as Y, d as U, Z as x, C as v, M as E, B as N, e as B, P as W, i as G, a as V, T as P } from "./constants-DHvpLY46.js";
-import { d as c } from "./debug-CLzmqn3R.js";
+import { b as $, c as X, R as Y, d as U, Z as x, C as v, M as A, B as R, e as B, P as G, i as W, a as V, T as P } from "./constants-DHvpLY46.js";
+import { d as c } from "./debug-BuKzUOMn.js";
 class j {
@@ -26,3 +26,3 @@ registry = /* @__PURE__ */ new Map();
 }
-function R(r) {
+function M(r) {
   if (r.id)
@@ -45,5 +45,5 @@ return [`*[@id="${r.id}"]`];
 }
-const u = { FunctionComponent: 0, ClassComponent: 1, IndeterminateComponent: 2, HostRoot: 3, HostPortal: 4, HostComponent: 5, HostText: 6, Fragment: 7, Mode: 8, ContextConsumer: 9, ContextProvider: 10, ForwardRef: 11, Profiler: 12, SuspenseComponent: 13, MemoComponent: 14, SimpleMemoComponent: 15, LazyComponent: 16, IncompleteClassComponent: 17, DehydratedFragment: 18, SuspenseListComponent: 19, ScopeComponent: 21, OffscreenComponent: 22, LegacyHiddenComponent: 23, CacheComponent: 24, TracingMarkerComponent: 25, HostHoistable: 26, HostSingleton: 27, IncompleteFunctionComponent: 28, Throw: 29, ViewTransitionComponent: 30, ActivityComponent: 31 }, z = /* @__PURE__ */ new Set(["Component", "PureComponent", "Fragment", "Suspense", "Profiler", "StrictMode", "Routes", "Route", "Outlet", "Root", "ErrorBoundaryHandler", "HotReload", "Hot"]), K = [/Boundary$/, /BoundaryHandler$/, /Provider$/, /Consumer$/, /^(Inner|Outer)/, /Router$/, /^Client(Page|Segment|Root)/, /^Server(Root|Component|Render)/, /^RSC/, /Context$/, /^Hot(Reload)?$/, /^(Dev|React)(Overlay|Tools|Root)/, /Overlay$/, /Handler$/, /^With[A-Z]/, /Wrapper$/, /^Root$/];
-let b = null;
-function O(r) {
+const u = { FunctionComponent: 0, ClassComponent: 1, IndeterminateComponent: 2, HostRoot: 3, HostPortal: 4, HostComponent: 5, HostText: 6, Fragment: 7, Mode: 8, ContextConsumer: 9, ContextProvider: 10, ForwardRef: 11, Profiler: 12, SuspenseComponent: 13, MemoComponent: 14, SimpleMemoComponent: 15, LazyComponent: 16, IncompleteClassComponent: 17, DehydratedFragment: 18, SuspenseListComponent: 19, ScopeComponent: 21, OffscreenComponent: 22, LegacyHiddenComponent: 23, CacheComponent: 24, TracingMarkerComponent: 25, HostHoistable: 26, HostSingleton: 27, IncompleteFunctionComponent: 28, Throw: 29, ViewTransitionComponent: 30, ActivityComponent: 31 }, K = /* @__PURE__ */ new Set(["Component", "PureComponent", "Fragment", "Suspense", "Profiler", "StrictMode", "Routes", "Route", "Outlet", "Root", "ErrorBoundaryHandler", "HotReload", "Hot"]), z = [/Boundary$/, /BoundaryHandler$/, /Provider$/, /Consumer$/, /^(Inner|Outer)/, /Router$/, /^Client(Page|Segment|Root)/, /^Server(Root|Component|Render)/, /^RSC/, /Context$/, /^Hot(Reload)?$/, /^(Dev|React)(Overlay|Tools|Root)/, /Overlay$/, /Handler$/, /^With[A-Z]/, /Wrapper$/, /^Root$/];
+let C = null;
+function T(r) {
   const e = (t) => t.some((n) => n.startsWith("__reactFiber$") || n.startsWith("__reactInternalInstance$") || n.startsWith("__reactProps$"));
@@ -53,14 +53,14 @@ return e(Object.keys(r)) || e(Object.getOwnPropertyNames(r));
 function J() {
-  if (b !== null) return b;
+  if (C !== null) return C;
   if (typeof document > "u") return !1;
-  if (document.body && O(document.body))
-    return c("client", "Detected React on document.body"), b = !0, !0;
+  if (document.body && T(document.body))
+    return c("client", "Detected React on document.body"), C = !0, !0;
   for (const e of Y) {
     const t = document.querySelector(e);
     if (t) {
-      if (O(t))
-        return c("client", "Detected React on", e), b = !0, !0;
+      if (T(t))
+        return c("client", "Detected React on", e), C = !0, !0;
       for (const n of t.children)
-        if (O(n))
-          return c("client", "Detected React on child of", e), b = !0, !0;
+        if (T(n))
+          return c("client", "Detected React on child of", e), C = !0, !0;
     }
@@ -70,12 +70,12 @@ }
     for (const e of document.body.children)
-      if (O(e))
-        return c("client", "Detected React on body child:", e.tagName), b = !0, !0;
+      if (T(e))
+        return c("client", "Detected React on body child:", e.tagName), C = !0, !0;
   }
   const r = document.querySelectorAll("*");
   for (const e of r) {
-    if (O(e))
-      return c("client", "Detected React on deep scan:", e.tagName), b = !0, !0;
+    if (T(e))
+      return c("client", "Detected React on deep scan:", e.tagName), C = !0, !0;
     if (r.length > U) break;
   }
-  return c("client", "React NOT detected on page"), b = !1, !1;
+  return c("client", "React NOT detected on page"), C = !1, !1;
 }
@@ -98,3 +98,3 @@ function q(r) {
 }
-function S(r) {
+function b(r) {
   return r ? r.displayName ? r.displayName : r.name ? r.name : null : null;
@@ -108,6 +108,6 @@ }
     if (i?.render) {
-      const s = S(i.render);
+      const s = b(i.render);
       if (s) return s;
     }
-    return i?.displayName ? i.displayName : S(t);
+    return i?.displayName ? i.displayName : b(t);
   }
@@ -117,6 +117,6 @@ if (e === u.MemoComponent || e === u.SimpleMemoComponent) {
     if (i?.type) {
-      const s = S(i.type);
+      const s = b(i.type);
       if (s) return s;
     }
-    return i?.displayName ? i.displayName : S(t);
+    return i?.displayName ? i.displayName : b(t);
   }
@@ -133,5 +133,5 @@ if (e === u.ContextProvider) {
     const i = n;
-    return i?._status === 1 && i._result ? S(i._result) : null;
+    return i?._status === 1 && i._result ? b(i._result) : null;
   }
-  return e === u.IncompleteClassComponent || e === u.IncompleteFunctionComponent || e === u.FunctionComponent || e === u.ClassComponent || e === u.IndeterminateComponent ? S(t) : null;
+  return e === u.IncompleteClassComponent || e === u.IncompleteFunctionComponent || e === u.FunctionComponent || e === u.ClassComponent || e === u.IndeterminateComponent ? b(t) : null;
 }
@@ -142,3 +142,3 @@ function Q(r) {
 function ee(r) {
-  return !(z.has(r) || K.some((e) => e.test(r)));
+  return !(K.has(r) || z.some((e) => e.test(r)));
 }
@@ -160,3 +160,3 @@ function te(r, e = $, t = X) {
 }
-let C = null;
+let O = null;
 function D(r, e, t, n = "solid") {
@@ -167,8 +167,8 @@ const o = document.createElement("div");
 function ne(r) {
-  M();
+  L();
   const e = r.getBoundingClientRect();
-  C = D(e, v.SELECT_OVERLAY_BORDER, v.SELECT_OVERLAY_BG), C.className = "forge-overlay", document.body.appendChild(C);
+  O = D(e, v.SELECT_OVERLAY_BORDER, v.SELECT_OVERLAY_BG), O.className = "forge-overlay", document.body.appendChild(O);
 }
-function M() {
-  C && (C.remove(), C = null);
+function L() {
+  O && (O.remove(), O = null);
 }
@@ -179,3 +179,3 @@ let oe = 0;
 }
-class T {
+class S {
   active = !1;
@@ -203,6 +203,6 @@ messenger;
   activate() {
-    this.active || (this.active = !0, c("annotation", "Annotation mode activated"), this.addListeners(), this.setMarkersVisible(!0), document.body.style.cursor = "crosshair");
+    this.active || (this.active = !0, c("annotation", "Annotation mode activated"), this.addListeners(), this.setMarkersVisible(!0));
   }
   deactivate() {
-    this.active && (this.active = !1, c("annotation", "Annotation mode deactivated"), this.removeHoverOverlay(), this.clearAnnotationHighlights(), this.removeDragRect(), this.removeListeners(), this.setMarkersVisible(!1), document.body.style.cursor = "");
+    this.active && (this.active = !1, c("annotation", "Annotation mode deactivated"), this.removeHoverOverlay(), this.clearAnnotationHighlights(), this.removeDragRect(), this.removeListeners(), this.setMarkersVisible(!1));
   }
@@ -252,6 +252,6 @@ selectDot(e) {
     }
-    return { xpath: I(R(e)), forgeId: t, forgeIdIndex: n };
+    return { xpath: I(M(e)), forgeId: t, forgeIdIndex: n };
   }
   elementToInfo(e) {
-    return { elementTag: e.tagName.toLowerCase(), xpath: R(e), componentName: e.getAttribute("data-component") || void 0, componentPath: this.getComponentPath(e) || void 0, forgeId: e.getAttribute("data-forge-id") || void 0, forgeIdIndex: this.resolveForgeIdIndex(e), sourcePos: e.getAttribute("data-source-pos") || void 0 };
+    return { elementTag: e.tagName.toLowerCase(), xpath: M(e), componentName: e.getAttribute("data-component") || void 0, componentPath: this.getComponentPath(e) || void 0, forgeId: e.getAttribute("data-forge-id") || void 0, forgeIdIndex: this.resolveForgeIdIndex(e), sourcePos: e.getAttribute("data-source-pos") || void 0 };
   }
@@ -268,7 +268,7 @@ resolveForgeIdIndex(e) {
     if (e.length === 0) {
-      this.messenger.send({ type: "ACCUMULATION_UPDATED", annotation: { id: this.accumulationId, dotX: 0, dotY: 0, mode: "single", elements: [], xpaths: [], elementTag: "" }, origin: E });
+      this.messenger.send({ type: "ACCUMULATION_UPDATED", annotation: { id: this.accumulationId, dotX: 0, dotY: 0, mode: "single", elements: [], xpaths: [], elementTag: "" }, origin: A });
       return;
     }
-    const n = e[e.length - 1].getBoundingClientRect(), o = n.left + n.width / 2, i = n.bottom, s = e.map((g) => this.elementToInfo(g)), a = e.map((g) => this.elementToLocator(g)), l = this.getAnchorRect(a), h = o - 2, d = i - N - 2, m = l && l.width > 0 && l.height > 0 ? { x: (h - l.left) / l.width, y: (d - l.top) / l.height } : { x: 0, y: 0 }, f = s[0];
-    this.messenger.send({ type: "ACCUMULATION_UPDATED", annotation: { id: this.accumulationId, dotX: o, dotY: i, anchorOffset: m, mode: e.length > 1 ? "multi" : "single", elements: s, xpaths: s.map((g) => I(g.xpath)), elementTag: f.elementTag, componentName: f.componentName, componentPath: f.componentPath, forgeId: f.forgeId, sourcePos: f.sourcePos }, origin: E });
+    const n = e[e.length - 1].getBoundingClientRect(), o = n.left + n.width / 2, i = n.bottom, s = e.map((g) => this.elementToInfo(g)), a = e.map((g) => this.elementToLocator(g)), l = this.getAnchorRect(a), h = o - 2, d = i - R - 2, m = l && l.width > 0 && l.height > 0 ? { x: (h - l.left) / l.width, y: (d - l.top) / l.height } : { x: 0, y: 0 }, f = s[0];
+    this.messenger.send({ type: "ACCUMULATION_UPDATED", annotation: { id: this.accumulationId, dotX: o, dotY: i, anchorOffset: m, mode: e.length > 1 ? "multi" : "single", elements: s, xpaths: s.map((g) => I(g.xpath)), elementTag: f.elementTag, componentName: f.componentName, componentPath: f.componentPath, forgeId: f.forgeId, sourcePos: f.sourcePos }, origin: A });
   }
@@ -442,3 +442,3 @@ removeDot(e) {
   createDot(e, t, n, o, i, s = []) {
-    const a = this.getAnchorRect(s), l = e - 2, h = t - N - 2, d = a && a.width > 0 && a.height > 0 ? { rx: (l - a.left) / a.width, ry: (h - a.top) / a.height } : { rx: 0, ry: 0 };
+    const a = this.getAnchorRect(s), l = e - 2, h = t - R - 2, d = a && a.width > 0 && a.height > 0 ? { rx: (l - a.left) / a.width, ry: (h - a.top) / a.height } : { rx: 0, ry: 0 };
     this.createDotAtPosition(l, h, n, o, i, s, d);
@@ -448,3 +448,3 @@ }
     const l = document.createElement("div");
-    Object.assign(l.style, { position: "fixed", left: `${e}px`, top: `${t}px`, minWidth: `${B}px`, height: `${N}px`, borderRadius: "50% 50% 50% 0", backgroundColor: "#FFFFFF", border: "1px solid #1A58D0", cursor: "pointer", zIndex: x.ANNOTATION_DOT, transition: "transform 0.15s ease", display: this.markersVisible ? "flex" : "none", alignItems: "center", justifyContent: "center", padding: "0 4px", fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif", fontSize: "11px", fontWeight: "700", color: "#1A58D0", lineHeight: "1", userSelect: "none", boxShadow: "0px 1px 3px -1px rgba(9, 18, 42, 0.06), 0px 1px 3px -3px rgba(9, 18, 42, 0.1)" }), l.textContent = String(i), l.className = "forge-annotation-dot", l.dataset.annotationId = o, l.addEventListener("mouseenter", () => {
+    Object.assign(l.style, { position: "fixed", left: `${e}px`, top: `${t}px`, minWidth: `${B}px`, height: `${R}px`, borderRadius: "50% 50% 50% 0", backgroundColor: "#FFFFFF", border: "1px solid #1A58D0", cursor: "pointer", zIndex: x.ANNOTATION_DOT, transition: "transform 0.15s ease", display: this.markersVisible ? "flex" : "none", alignItems: "center", justifyContent: "center", padding: "0 4px", fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif", fontSize: "11px", fontWeight: "700", color: "#1A58D0", lineHeight: "1", userSelect: "none", boxShadow: "0px 1px 3px -1px rgba(9, 18, 42, 0.06), 0px 1px 3px -3px rgba(9, 18, 42, 0.1)" }), l.textContent = String(i), l.className = "forge-annotation-dot", l.dataset.annotationId = o, l.addEventListener("mouseenter", () => {
       l.style.transform = "scale(1.05)", this.removeHoverOverlay();
@@ -458,3 +458,3 @@ }), l.addEventListener("mouseleave", () => {
       const m = l.getBoundingClientRect();
-      this.messenger.send({ type: "ANNOTATION_DOT_CLICKED", annotationId: o, dotX: m.left, dotY: m.bottom, origin: E });
+      this.messenger.send({ type: "ANNOTATION_DOT_CLICKED", annotationId: o, dotX: m.left, dotY: m.bottom, origin: A });
     }), document.body.appendChild(l), this.dots.set(o, { id: o, element: l, mode: n, order: i, locators: s, anchorRatio: a });
@@ -509,4 +509,4 @@ }
       if (m.has(p.getAttribute("data-forge-id") || "")) return;
-      const L = p.getBoundingClientRect();
-      L.right >= i && L.left <= a && L.bottom >= s && L.top <= l && (m.add(y), d.push(p));
+      const N = p.getBoundingClientRect();
+      N.right >= i && N.left <= a && N.bottom >= s && N.top <= l && (m.add(y), d.push(p));
     }), this.dragScopeParent) {
@@ -538,3 +538,3 @@ const f = this.findForgeIdParent(this.dragScopeParent);
       const n = e.clientX - this.dragStartX, o = e.clientY - this.dragStartY;
-      if (Math.abs(n) > T.DRAG_THRESHOLD || Math.abs(o) > T.DRAG_THRESHOLD) {
+      if (Math.abs(n) > S.DRAG_THRESHOLD || Math.abs(o) > S.DRAG_THRESHOLD) {
         this.isDragging = !0;
@@ -616,6 +616,6 @@ return;
     this.hoverSuppressed = !0, this.removeHoverOverlay();
-    const a = e.map((p) => this.elementToInfo(p)), l = a.map((p) => ({ xpath: I(p.xpath), forgeId: p.forgeId, forgeIdIndex: p.forgeIdIndex })), h = this.getAnchorRect(l), d = n - 2, m = o - N - 2, f = h && h.width > 0 && h.height > 0 ? { x: (d - h.left) / h.width, y: (m - h.top) / h.height } : { x: 0, y: 0 };
+    const a = e.map((p) => this.elementToInfo(p)), l = a.map((p) => ({ xpath: I(p.xpath), forgeId: p.forgeId, forgeIdIndex: p.forgeIdIndex })), h = this.getAnchorRect(l), d = n - 2, m = o - R - 2, f = h && h.width > 0 && h.height > 0 ? { x: (d - h.left) / h.width, y: (m - h.top) / h.height } : { x: 0, y: 0 };
     this.pendingAnnotations.set(s, { dotX: n, dotY: o, mode: t, locators: l }), this.clearDragHighlights(), this.highlightLocators(l, t === "multi");
     const g = a[0], y = { id: s, dotX: n, dotY: o, anchorOffset: f, mode: t, elements: a, xpaths: a.map((p) => I(p.xpath)), elementTag: g.elementTag, componentName: g.componentName, componentPath: g.componentPath, forgeId: g.forgeId, sourcePos: g.sourcePos };
-    c("annotation", "Annotation created (pending):", y), this.messenger.send({ type: "ANNOTATION_CREATED", annotation: y, origin: E });
+    c("annotation", "Annotation created (pending):", y), this.messenger.send({ type: "ANNOTATION_CREATED", annotation: y, origin: A });
   }
@@ -635,3 +635,2 @@ handleDocumentLeave = () => {
   callbacks;
-  selectModeShield = null;
   constructor(e, t) {
@@ -641,27 +640,9 @@ this.messenger = e, this.callbacks = t;
   enableListeners() {
-    this.attachSelectModeShieldIfNeeded(), document.addEventListener("mousemove", this.handleMouseOver, !0), document.addEventListener("click", this.handleClick, !0), document.addEventListener("mouseleave", this.handleMouseOut), document.addEventListener("scroll", this.handleScroll, !0);
+    document.addEventListener("mousemove", this.handleMouseOver, !0), document.addEventListener("click", this.handleClick, !0), document.addEventListener("mouseleave", this.handleMouseOut), document.addEventListener("scroll", this.handleScroll, !0);
   }
   disableListeners() {
-    this.removeSelectModeShield(), document.removeEventListener("mousemove", this.handleMouseOver, !0), document.removeEventListener("click", this.handleClick, !0), document.removeEventListener("mouseleave", this.handleMouseOut), document.removeEventListener("scroll", this.handleScroll, !0), this.clearHover();
+    document.removeEventListener("mousemove", this.handleMouseOver, !0), document.removeEventListener("click", this.handleClick, !0), document.removeEventListener("mouseleave", this.handleMouseOut), document.removeEventListener("scroll", this.handleScroll, !0), this.clearHover();
   }
-  attachSelectModeShieldIfNeeded() {
-    if (!this.callbacks.getSelectMode() || this.callbacks.getDesignMode() || this.selectModeShield) return;
-    const e = document.createElement("div");
-    Object.assign(e.style, { position: "fixed", top: "0", left: "0", width: "100%", height: "100%", backgroundColor: "transparent", pointerEvents: "auto", zIndex: "9998", cursor: "crosshair" }), e.className = "forge-select-mode-shield", e.addEventListener("wheel", this.handleShieldWheel, { passive: !1 }), document.body.appendChild(e), this.selectModeShield = e;
-  }
-  removeSelectModeShield() {
-    this.selectModeShield && (this.selectModeShield.removeEventListener("wheel", this.handleShieldWheel), this.selectModeShield.remove(), this.selectModeShield = null);
-  }
-  handleShieldWheel = (e) => {
-    if (!this.callbacks.getSelectMode() || this.callbacks.getDesignMode()) return;
-    e.preventDefault();
-    const t = this.resolveElementFromPoint(e.clientX, e.clientY), n = t instanceof HTMLElement ? t : null, o = n ? this.findScrollableAncestor(n, e.deltaX, e.deltaY) : null;
-    if (o) {
-      o.scrollBy({ left: e.deltaX, top: e.deltaY, behavior: "auto" });
-      return;
-    }
-    window.scrollBy({ left: e.deltaX, top: e.deltaY, behavior: "auto" });
-  };
   clearHover() {
-    M();
+    L();
   }
@@ -680,4 +661,4 @@ findTopmostElementWithSameId(e) {
   handleSelectModeClick(e) {
-    const t = I(R(e));
-    c("client", "Element clicked, XPath:", t), this.messenger.send({ type: "XPATH_REPORT", xpath: t, origin: E }), this.messenger.send({ type: "SELECT_MODE_DISABLED", origin: E });
+    const t = I(M(e));
+    c("client", "Element clicked, XPath:", t), this.messenger.send({ type: "XPATH_REPORT", xpath: t, origin: A }), this.messenger.send({ type: "SELECT_MODE_DISABLED", origin: A });
   }
@@ -695,3 +676,3 @@ handleMouseOver = (e) => {
   handleMouseOut = (e) => {
-    !this.callbacks.getSelectMode() && !this.callbacks.getDesignMode() || M();
+    !this.callbacks.getSelectMode() && !this.callbacks.getDesignMode() || L();
   };
@@ -702,3 +683,3 @@ handleClick = (e) => {
     const t = this.resolveTarget(e);
-    t && t !== document.body && t !== document.documentElement && (this.callbacks.getSelectMode() && this.callbacks.onSelectClick(t), this.callbacks.getDesignMode() && (M(), this.callbacks.onDesignClick(t)));
+    t && t !== document.body && t !== document.documentElement && (this.callbacks.getSelectMode() && this.callbacks.onSelectClick(t), this.callbacks.getDesignMode() && (L(), this.callbacks.onDesignClick(t)));
   };
@@ -712,31 +693,19 @@ resolveTarget(e) {
     for (const o of n)
-      if (!(this.selectModeShield && o === this.selectModeShield) && !o.classList.contains("forge-overlay"))
+      if (!o.classList.contains("forge-overlay"))
         return o;
     return null;
   }
-  findScrollableAncestor(e, t, n) {
-    let o = e;
-    for (; o && o !== document.body; ) {
-      if (this.canElementScroll(o, t, n)) return o;
-      o = o.parentElement;
-    }
-    return null;
-  }
-  canElementScroll(e, t, n) {
-    const o = window.getComputedStyle(e), i = (o.overflowY === "auto" || o.overflowY === "scroll" || o.overflowY === "overlay") && e.scrollHeight > e.clientHeight, s = (o.overflowX === "auto" || o.overflowX === "scroll" || o.overflowX === "overlay") && e.scrollWidth > e.clientWidth, a = i && (n < 0 && e.scrollTop > 0 || n > 0 && e.scrollTop + e.clientHeight < e.scrollHeight), l = s && (t < 0 && e.scrollLeft > 0 || t > 0 && e.scrollLeft + e.clientWidth < e.scrollWidth);
-    return a || l;
-  }
   handleScroll = () => {
-    (this.callbacks.getSelectMode() || this.callbacks.getDesignMode()) && M();
+    (this.callbacks.getSelectMode() || this.callbacks.getDesignMode()) && L();
   };
 }
-let w = null, H = null, _ = null;
+let _ = null, H = null, w = null;
 async function re() {
-  if (w && H && _) return;
+  if (_ && H && w) return;
   const [r, e, t] = await Promise.all([import("@babel/parser"), import("@babel/traverse"), import("@babel/generator")]);
-  w = r.parse;
+  _ = r.parse;
   const n = e.default;
   H = typeof n == "function" ? n : n.default;
   const o = t.default;
-  _ = typeof o == "function" ? o : o.default;
+  w = typeof o == "function" ? o : o.default;
 }
@@ -752,4 +721,4 @@ function k(r) {
   try {
-    if (await re(), !w || !H || !_) return r;
-    const i = w(r, { sourceType: "module", plugins: ["jsx", "typescript"] });
+    if (await re(), !_ || !H || !w) return r;
+    const i = _(r, { sourceType: "module", plugins: ["jsx", "typescript"] });
     let s = !1;
@@ -773,3 +742,3 @@ const a = /* @__PURE__ */ new Map();
     if (s)
-      return _(i, {}, r).code;
+      return w(i, {}, r).code;
   } catch (i) {
@@ -821,4 +790,4 @@ c("client", "Failed to parse/update AST:", i);
     this.clearSelection(), this.selectedElement = n, this.applyHighlight(n);
-    const a = n.textContent?.trim() || "", l = n.tagName.toLowerCase(), h = I(R(n)), d = this.componentRegistry.getEditableProps(s), m = this.extractPropValues(n, d);
-    c("client", "Element selected in design mode:", { forgeId: t, sourcePos: i, text: a, type: l, componentName: s, editableProps: d, propValues: m }), this.messenger.send({ type: "ELEMENT_SELECTED", forgeId: t, sourcePos: i || void 0, text: a, elementType: l, xpath: h, componentName: s, editableProps: d, propValues: m, origin: E });
+    const a = n.textContent?.trim() || "", l = n.tagName.toLowerCase(), h = I(M(n)), d = this.componentRegistry.getEditableProps(s), m = this.extractPropValues(n, d);
+    c("client", "Element selected in design mode:", { forgeId: t, sourcePos: i, text: a, type: l, componentName: s, editableProps: d, propValues: m }), this.messenger.send({ type: "ELEMENT_SELECTED", forgeId: t, sourcePos: i || void 0, text: a, elementType: l, xpath: h, componentName: s, editableProps: d, propValues: m, origin: A });
   }
@@ -850,3 +819,3 @@ updateText(e, t) {
     const h = this.selectedElement?.getAttribute("data-source-pos") ?? null, d = await ae(l, e, t, n, h);
-    d !== l ? (this.sourceCache.set(a, d), c("client", `Updated source for ${a}`), await ce(a, d) && (c("client", `Source written to disk and HMR triggered for ${a}`), this.messenger.send({ type: "SOURCE_UPDATED", forgeId: e, source: d, filePath: a, origin: E }))) : c("client", `No source changes detected for ${a}`);
+    d !== l ? (this.sourceCache.set(a, d), c("client", `Updated source for ${a}`), await ce(a, d) && (c("client", `Source written to disk and HMR triggered for ${a}`), this.messenger.send({ type: "SOURCE_UPDATED", forgeId: e, source: d, filePath: a, origin: A }))) : c("client", `No source changes detected for ${a}`);
   }
@@ -881,3 +850,4 @@ applyHighlight(e) {
 }
-class A {
+class E {
+  static ANNOTATION_CURSOR_LOCK_CLASS = "forge-annotation-cursor-lock";
   static instance = null;
@@ -894,8 +864,9 @@ messenger;
   designController;
+  annotationCursorLockStyleEl = null;
   onError;
   constructor(e) {
-    this.onError = e?.onError, c("client", "ForgeClient initialized"), this.messenger = new W(), this.componentRegistry = new j(), this.selectController = new se(this.messenger, { getSelectMode: () => this.selectMode, getDesignMode: () => this.designMode, getHoverDisabled: () => this.hoverDisabled, getSelectedDesignElement: () => this.designController.getSelectedElement(), onSelectClick: (t) => this.handleSelectClick(t), onDesignClick: (t) => this.handleDesignClick(t) }), this.designController = new he(this.messenger, this.componentRegistry, this.selectController), this.setupMessageListener(), this.sendReady(), this.setupForgeIdPropagation(), window.__forgeClient = this;
+    this.onError = e?.onError, c("client", "ForgeClient initialized"), this.messenger = new G(), this.componentRegistry = new j(), this.selectController = new se(this.messenger, { getSelectMode: () => this.selectMode, getDesignMode: () => this.designMode, getHoverDisabled: () => this.hoverDisabled, getSelectedDesignElement: () => this.designController.getSelectedElement(), onSelectClick: (t) => this.handleSelectClick(t), onDesignClick: (t) => this.handleDesignClick(t) }), this.designController = new he(this.messenger, this.componentRegistry, this.selectController), this.setupMessageListener(), this.sendReady(), this.setupForgeIdPropagation(), window.__forgeClient = this;
   }
   static getInstance(e) {
-    return A.instance || (A.instance = new A(e)), A.instance;
+    return E.instance || (E.instance = new E(e)), E.instance;
   }
@@ -906,10 +877,10 @@ enableAnnotationMode(e) {
   restoreAnnotations(e) {
-    this.annotationOverlay || (this.annotationOverlay = new T(this.messenger)), this.annotationOverlay.restoreDots(e);
+    this.annotationOverlay || (this.annotationOverlay = new S(this.messenger)), this.annotationOverlay.restoreDots(e);
   }
   setupMessageListener() {
     c("client", "Setting up message listener..."), this.messenger.onMessage((e) => {
-      if (G(e.data) || !e.data || typeof e.data != "object" || !("origin" in e.data)) return;
+      if (W(e.data) || (this.isConnectedToHost || (this.isConnectedToHost = !0, this.readyIntervalId !== null && (window.clearInterval(this.readyIntervalId), this.readyIntervalId = null, c("client", "Host connection detected, stopped CHILD_READY retries"))), console.log("Received message from host:", { isConnectedToHost: this.isConnectedToHost }), !e.data || typeof e.data != "object" || !("origin" in e.data))) return;
       const t = e.data;
       if (t.origin === V) {
-        this.isConnectedToHost || (this.isConnectedToHost = !0, this.readyIntervalId !== null && (window.clearInterval(this.readyIntervalId), this.readyIntervalId = null, c("client", "Host connection detected, stopped CHILD_READY retries"))), c("client", "Received message from host:", t);
+        c("client", "Received message from host:", t);
         try {
@@ -960,3 +931,3 @@ switch (t.type) {
             case "RESTORE_ANNOTATIONS":
-              this.annotationOverlay || (this.annotationOverlay = new T(this.messenger)), this.annotationOverlay.restoreDots(t.annotations);
+              this.annotationOverlay || (this.annotationOverlay = new S(this.messenger)), this.annotationOverlay.restoreDots(t.annotations);
               break;
@@ -974,10 +945,23 @@ case "PING":
   setSelectMode(e) {
-    this.selectMode !== e && (c("client", `Setting select mode to: ${e}`), this.selectMode = e, e ? (this.selectController.enableListeners(), document.body.style.cursor = "crosshair") : (this.selectController.disableListeners(), document.body.style.cursor = "", this.selectController.clearHover()));
+    this.selectMode !== e && (c("client", `Setting select mode to: ${e}`), this.selectMode = e, e ? this.selectController.enableListeners() : (this.selectController.disableListeners(), this.selectController.clearHover()));
   }
   setDesignMode(e) {
-    this.designMode !== e && (c("client", `Setting design mode to: ${e}`), this.designMode = e, e ? (this.selectController.enableListeners(), this.hoverDisabled = !1, document.body.style.cursor = "crosshair") : (this.selectController.disableListeners(), this.hoverDisabled = !1, document.body.style.cursor = "", this.selectController.clearHover()));
+    this.designMode !== e && (c("client", `Setting design mode to: ${e}`), this.designMode = e, e ? (this.selectController.enableListeners(), this.hoverDisabled = !1) : (this.selectController.disableListeners(), this.hoverDisabled = !1, this.selectController.clearHover()));
   }
   setAnnotationMode(e) {
-    e ? (this.annotationOverlay || (this.annotationOverlay = new T(this.messenger)), this.setSelectMode(!1), this.setDesignMode(!1), this.annotationOverlay.activate()) : this.annotationOverlay?.deactivate();
+    e ? (this.enableAnnotationCursorLock(), this.annotationOverlay || (this.annotationOverlay = new S(this.messenger)), this.setSelectMode(!1), this.setDesignMode(!1), this.annotationOverlay.activate()) : (this.annotationOverlay?.deactivate(), this.disableAnnotationCursorLock());
   }
+  enableAnnotationCursorLock() {
+    if (document.documentElement.classList.add(E.ANNOTATION_CURSOR_LOCK_CLASS), this.annotationCursorLockStyleEl) return;
+    const e = document.createElement("style");
+    e.id = "forge-annotation-cursor-lock-style", e.textContent = `
+      html.${E.ANNOTATION_CURSOR_LOCK_CLASS},
+      html.${E.ANNOTATION_CURSOR_LOCK_CLASS} * {
+        cursor: crosshair !important;
+      }
+    `, (document.head ?? document.documentElement).appendChild(e), this.annotationCursorLockStyleEl = e;
+  }
+  disableAnnotationCursorLock() {
+    document.documentElement.classList.remove(E.ANNOTATION_CURSOR_LOCK_CLASS), this.annotationCursorLockStyleEl && (this.annotationCursorLockStyleEl.remove(), this.annotationCursorLockStyleEl = null);
+  }
   handleSelectClick(e) {
@@ -991,3 +975,3 @@ this.selectController.handleSelectModeClick(e), this.setSelectMode(!1);
     c("client", "Scheduling CHILD_READY message..."), setTimeout(() => {
-      this.isConnectedToHost || (c("client", "Sending CHILD_READY message to parent"), this.messenger.send({ type: "CHILD_READY", origin: E }), this.readyIntervalId === null && (this.readyIntervalId = window.setInterval(() => {
+      this.isConnectedToHost || (c("client", "Sending CHILD_READY message to parent"), this.messenger.send({ type: "CHILD_READY", origin: A }), this.readyIntervalId === null && (this.readyIntervalId = window.setInterval(() => {
         if (this.isConnectedToHost) {
@@ -997,3 +981,3 @@ this.readyIntervalId !== null && (window.clearInterval(this.readyIntervalId), this.readyIntervalId = null);
         }
-        c("client", "Retrying CHILD_READY message to parent"), this.messenger.send({ type: "CHILD_READY", origin: E });
+        c("client", "Retrying CHILD_READY message to parent"), this.messenger.send({ type: "CHILD_READY", origin: A });
       }, P.CHILD_READY_RETRY_INTERVAL)));
@@ -1029,6 +1013,6 @@ }, P.CHILD_READY_DELAY);
 }
-A.getInstance();
+E.getInstance();
 export {
-  A as ForgeClient,
-  W as ParentMessenger
+  E as ForgeClient,
+  G as ParentMessenger
 };

dist/client/annotation/AnnotationOverlay.d.ts.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"AnnotationOverlay.d.ts","sourceRoot":"","sources":["../../../src/client/annotation/AnnotationOverlay.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAEhE,OAAO,KAAK,EAAkB,qBAAqB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAA;AA6B1G;;;GAGG;AACH,qBAAa,iBAAiB;IAC5B,OAAO,CAAC,MAAM,CAAQ;IACtB,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,YAAY,CAA8B;IAClD,OAAO,CAAC,gBAAgB,CAA8B;IACtD,OAAO,CAAC,QAAQ,CAA8B;IAC9C,OAAO,CAAC,cAAc,CAAuB;IAC7C,OAAO,CAAC,oBAAoB,CAAuB;IACnD,OAAO,CAAC,IAAI,CAA6B;IAEzC,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,UAAU,CAAI;IACtB,OAAO,CAAC,UAAU,CAAI;IACtB,OAAO,CAAC,eAAe,CAA2B;IAClD,OAAO,CAAC,eAAe,CAAQ;IAC/B,OAAO,CAAC,oBAAoB,CAAsB;IAClD,OAAO,CAAC,wBAAwB,CAAqE;IACrG,OAAO,CAAC,kBAAkB,CAA2B;IAErD,OAAO,CAAC,cAAc,CAAsB;IAC5C,OAAO,CAAC,oBAAoB,CAAoB;gBAEpC,SAAS,EAAE,eAAe;IAOtC,mFAAmF;IACnF,QAAQ,IAAI,IAAI;IAShB,0DAA0D;IAC1D,UAAU,IAAI,IAAI;IAYlB,wGAAwG;IACxG,SAAS,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI;IAQrC,4EAA4E;IAC5E,uBAAuB,IAAI,IAAI;IAW/B,6FAA6F;IAC7F,iBAAiB,CAAC,YAAY,EAAE,MAAM,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,GAAG,IAAI;IAiBxF,oFAAoF;IACpF,gBAAgB,IAAI,IAAI;IA2BxB,OAAO,CAAC,6BAA6B;IAQrC,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,mBAAmB;IAQ3B,OAAO,CAAC,sBAAsB;IAqD9B,6CAA6C;IAC7C,SAAS,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI;IASrC,oDAAoD;IACpD,aAAa,IAAI,IAAI;IAKrB,4DAA4D;IAC5D,WAAW,CAAC,WAAW,EAAE,qBAAqB,EAAE,GAAG,IAAI;IAqBvD,OAAO,CAAC,cAAc,CAAQ;IAE9B,0DAA0D;IAC1D,aAAa,IAAI,IAAI;IAIrB,+CAA+C;IAC/C,iBAAiB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI;IAQzC,2FAA2F;IAC3F,OAAO,CAAC,aAAa,CAsBpB;IAID,OAAO,CAAC,gBAAgB;IAgBxB,OAAO,CAAC,kBAAkB;IAS1B,OAAO,CAAC,sBAAsB;IAe9B,OAAO,CAAC,2BAA2B;IAOnC,OAAO,CAAC,kBAAkB;IAM1B,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,iBAAiB;IA4BzB,wFAAwF;IACxF,OAAO,CAAC,4BAA4B;IAKpC,OAAO,CAAC,yBAAyB;IAUjC,mFAAmF;IACnF,OAAO,CAAC,aAAa;IAiBrB,OAAO,CAAC,gBAAgB;IA4BxB,OAAO,CAAC,oBAAoB;IAsC5B,OAAO,CAAC,sBAAsB;IAS9B,OAAO,CAAC,YAAY;IAsBpB,OAAO,CAAC,cAAc;IAQtB,OAAO,CAAC,kBAAkB;IAW1B,OAAO,CAAC,mBAAmB;IAO3B,OAAO,CAAC,SAAS;IAUjB,OAAO,CAAC,mBAAmB;IA8D3B,yDAAyD;IACzD,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI;IAYlD,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,eAAe;IAYvB,OAAO,CAAC,0BAA0B;IAgBlC,OAAO,CAAC,iBAAiB;IASzB,OAAO,CAAC,cAAc;IA6CtB,OAAO,CAAC,eAAe,CAiCtB;IAED,OAAO,CAAC,MAAM,CAAC,cAAc,CAAI;IAEjC,OAAO,CAAC,eAAe,CAgBtB;IAED,OAAO,CAAC,aAAa,CA6CpB;IAED,OAAO,CAAC,WAAW,CAKlB;IAED,OAAO,CAAC,0BAA0B;IAKlC,OAAO,CAAC,aAAa,CAcpB;IAED,OAAO,CAAC,WAAW,CAElB;IAED,OAAO,CAAC,kBAAkB,CAA0G;IAEpI,kEAAkE;IAClE,UAAU,CAAC,YAAY,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAUrD,gFAAgF;IAChF,aAAa,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI;IAUzC,OAAO,CAAC,4BAA4B;IA8CpC,OAAO,CAAC,mBAAmB,CAE1B;IAED,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,eAAe;CASxB"}
+{"version":3,"file":"AnnotationOverlay.d.ts","sourceRoot":"","sources":["../../../src/client/annotation/AnnotationOverlay.ts"],"names":[],"mappings":"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"}

dist/client/general/ForgeClient.d.ts

@@ -11,2 +11,3 @@ import { type RestoreAnnotationData } from "../../shared/events.js";
 export declare class ForgeClient {
+    private static readonly ANNOTATION_CURSOR_LOCK_CLASS;
     private static instance;
@@ -23,2 +24,3 @@ private messenger;
     private designController;
+    private annotationCursorLockStyleEl;
     private onError?;
@@ -36,2 +38,4 @@ private constructor();
     private setAnnotationMode;
+    private enableAnnotationCursorLock;
+    private disableAnnotationCursorLock;
     private handleSelectClick;
@@ -38,0 +42,0 @@ private handleDesignClick;

dist/client/general/ForgeClient.d.ts.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"ForgeClient.d.ts","sourceRoot":"","sources":["../../../src/client/general/ForgeClient.ts"],"names":[],"mappings":"AACA,OAAO,EAA+C,KAAK,qBAAqB,EAAE,MAAM,wBAAwB,CAAA;AAOhH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA;AAEpD;;;;;;GAMG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,MAAM,CAAC,QAAQ,CAA2B;IAClD,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,eAAe,CAAsB;IAC7C,OAAO,CAAC,iBAAiB,CAAQ;IACjC,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,aAAa,CAAQ;IAC7B,OAAO,CAAC,iBAAiB,CAAmB;IAC5C,OAAO,CAAC,iBAAiB,CAAiC;IAC1D,OAAO,CAAC,gBAAgB,CAAsB;IAC9C,OAAO,CAAC,gBAAgB,CAAsB;IAC9C,OAAO,CAAC,OAAO,CAAC,CAAwB;IAExC,OAAO;IA4BP,4EAA4E;IAC5E,MAAM,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,kBAAkB,GAAG,WAAW;IAO7D,6FAA6F;IAC7F,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI;IAI5C,2FAA2F;IAC3F,kBAAkB,CAAC,WAAW,EAAE,qBAAqB,EAAE,GAAG,IAAI;IAS9D,OAAO,CAAC,oBAAoB;IAuF5B,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,aAAa;IAiBrB,OAAO,CAAC,iBAAiB;IAezB,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,iBAAiB;IAOzB,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,uBAAuB;IAkB/B,OAAO,CAAC,mBAAmB;IAO3B,OAAO,CAAC,yBAAyB;CAkBlC"}
+{"version":3,"file":"ForgeClient.d.ts","sourceRoot":"","sources":["../../../src/client/general/ForgeClient.ts"],"names":[],"mappings":"AACA,OAAO,EAA+C,KAAK,qBAAqB,EAAE,MAAM,wBAAwB,CAAA;AAOhH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA;AAEpD;;;;;;GAMG;AACH,qBAAa,WAAW;IACtB,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,4BAA4B,CAAiC;IACrF,OAAO,CAAC,MAAM,CAAC,QAAQ,CAA2B;IAClD,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,eAAe,CAAsB;IAC7C,OAAO,CAAC,iBAAiB,CAAQ;IACjC,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,UAAU,CAAQ;IAC1B,OAAO,CAAC,aAAa,CAAQ;IAC7B,OAAO,CAAC,iBAAiB,CAAmB;IAC5C,OAAO,CAAC,iBAAiB,CAAiC;IAC1D,OAAO,CAAC,gBAAgB,CAAsB;IAC9C,OAAO,CAAC,gBAAgB,CAAsB;IAC9C,OAAO,CAAC,2BAA2B,CAAgC;IACnE,OAAO,CAAC,OAAO,CAAC,CAAwB;IAExC,OAAO;IA4BP,4EAA4E;IAC5E,MAAM,CAAC,WAAW,CAAC,OAAO,CAAC,EAAE,kBAAkB,GAAG,WAAW;IAO7D,6FAA6F;IAC7F,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI;IAI5C,2FAA2F;IAC3F,kBAAkB,CAAC,WAAW,EAAE,qBAAqB,EAAE,GAAG,IAAI;IAS9D,OAAO,CAAC,oBAAoB;IA2F5B,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,aAAa;IAerB,OAAO,CAAC,iBAAiB;IAezB,OAAO,CAAC,0BAA0B;IAgBlC,OAAO,CAAC,2BAA2B;IASnC,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,iBAAiB;IAOzB,OAAO,CAAC,SAAS;IAwBjB,OAAO,CAAC,uBAAuB;IAkB/B,OAAO,CAAC,mBAAmB;IAO3B,OAAO,CAAC,yBAAyB;CAkBlC"}

dist/client/select-mode/SelectModeController.d.ts

@@ -10,3 +10,2 @@ import type { ParentMessenger } from "../../shared/messaging.js";
     private callbacks;
-    private selectModeShield;
     constructor(messenger: ParentMessenger, callbacks: SelectModeCallbacks);
@@ -17,5 +16,2 @@ /** Attaches capture-phase listeners for hover/click selection. */
     disableListeners(): void;
-    private attachSelectModeShieldIfNeeded;
-    private removeSelectModeShield;
-    private handleShieldWheel;
     /** Clears the current hover highlight. */
@@ -35,6 +31,4 @@ clearHover(): void;
     private resolveElementFromPoint;
-    private findScrollableAncestor;
-    private canElementScroll;
     private handleScroll;
 }
 //# sourceMappingURL=SelectModeController.d.ts.map

dist/client/select-mode/SelectModeController.d.ts.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"SelectModeController.d.ts","sourceRoot":"","sources":["../../../src/client/select-mode/SelectModeController.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAE9D;;;GAGG;AACH,qBAAa,oBAAoB;IAC/B,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,SAAS,CAAqB;IACtC,OAAO,CAAC,gBAAgB,CAA8B;gBAE1C,SAAS,EAAE,eAAe,EAAE,SAAS,EAAE,mBAAmB;IAKtE,kEAAkE;IAClE,eAAe,IAAI,IAAI;IAQvB,+DAA+D;IAC/D,gBAAgB,IAAI,IAAI;IASxB,OAAO,CAAC,8BAA8B;IAsBtC,OAAO,CAAC,sBAAsB;IAO9B,OAAO,CAAC,iBAAiB,CAexB;IAED,0CAA0C;IAC1C,UAAU,IAAI,IAAI;IAIlB;;;OAGG;IACH,4BAA4B,CAAC,OAAO,EAAE,WAAW,GAAG,WAAW;IAiB/D,yEAAyE;IACzE,qBAAqB,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAShD,OAAO,CAAC,eAAe,CAgBtB;IAED,OAAO,CAAC,cAAc,CAGrB;IAED,OAAO,CAAC,WAAW,CAiBlB;IAED,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,uBAAuB;IAU/B,OAAO,CAAC,sBAAsB;IAW9B,OAAO,CAAC,gBAAgB;IAqBxB,OAAO,CAAC,YAAY,CAInB;CACF"}
+{"version":3,"file":"SelectModeController.d.ts","sourceRoot":"","sources":["../../../src/client/select-mode/SelectModeController.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAE9D;;;GAGG;AACH,qBAAa,oBAAoB;IAC/B,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,SAAS,CAAqB;gBAE1B,SAAS,EAAE,eAAe,EAAE,SAAS,EAAE,mBAAmB;IAKtE,kEAAkE;IAClE,eAAe,IAAI,IAAI;IAOvB,+DAA+D;IAC/D,gBAAgB,IAAI,IAAI;IAQxB,0CAA0C;IAC1C,UAAU,IAAI,IAAI;IAIlB;;;OAGG;IACH,4BAA4B,CAAC,OAAO,EAAE,WAAW,GAAG,WAAW;IAiB/D,yEAAyE;IACzE,qBAAqB,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAShD,OAAO,CAAC,eAAe,CAgBtB;IAED,OAAO,CAAC,cAAc,CAGrB;IAED,OAAO,CAAC,WAAW,CAiBlB;IAED,OAAO,CAAC,aAAa;IAarB,OAAO,CAAC,uBAAuB;IAS/B,OAAO,CAAC,YAAY,CAInB;CACF"}

dist/host.js

 import { T as c, W as h, a as i, i as d, M as E } from "./constants-DHvpLY46.js";
-import { d as n } from "./debug-CLzmqn3R.js";
+import { d as n } from "./debug-BuKzUOMn.js";
 class u {
@@ -4,0 +4,0 @@ iframe;

dist/index.js

 import { ForgeHost as r } from "./host.js";
 import { ForgeClient as t } from "./client.js";
-import { a as S, u as m } from "./useDesignMode-VIipNUSj.js";
-import { e as p } from "./debug-CLzmqn3R.js";
+import { a as S, u as m } from "./useDesignMode--DcwfmhZ.js";
+import { e as p } from "./debug-BuKzUOMn.js";
 import { a as E, M as g } from "./constants-DHvpLY46.js";
@@ -6,0 +6,0 @@ export {

dist/react.js

@@ -1,2 +0,2 @@
-import { a as o, u as a } from "./useDesignMode-VIipNUSj.js";
+import { a as o, u as a } from "./useDesignMode--DcwfmhZ.js";
 export {
@@ -3,0 +3,0 @@ o as useDesignMode,

package.json

 {
     "name": "@supernovaio/prototyping-tooling",
-    "version": "0.9.7-alpha.1",
+    "version": "0.9.7-alpha.2",
     "description": "Prototyping Tooling — iframe communication bridge for design-to-code workflows",
@@ -5,0 +5,0 @@ "type": "module",

dist/debug-CLzmqn3R.js

-let t = !1;
-function a(e = !0) {
-  t = e;
-}
-function g(e, ...n) {
-  t && (/* @__PURE__ */ new Date()).toISOString().split("T")[1].slice(0, -1);
-}
-export {
-  g as d,
-  a as e
-};

dist/useDesignMode-VIipNUSj.js

-import { useState as r, useEffect as S, useCallback as s } from "react";
-import { d as i } from "./debug-CLzmqn3R.js";
-function E(e) {
-  const [d, u] = r(!1), [a, l] = r(""), [b, o] = r("disconnected");
-  S(() => {
-    if (!e) {
-      i("client", "useElementSelector: No host provided");
-      return;
-    }
-    const t = e.getStatus();
-    i("client", "useElementSelector: Initial status:", t), o(t);
-    const n = e.on("connected", () => {
-      i("client", "useElementSelector: Connected"), o("connected");
-    }), c = e.on("disconnected", () => {
-      i("client", "useElementSelector: Disconnected"), o("disconnected");
-    });
-    return () => {
-      n(), c();
-    };
-  }, [e]), S(() => {
-    if (!e) return;
-    const t = e.on("xpath-selected", (c) => {
-      l(c);
-    }), n = e.on("select-mode-disabled", () => {
-      u(!1);
-    });
-    return () => {
-      t(), n();
-    };
-  }, [e]);
-  const f = s((t) => {
-    if (e)
-      try {
-        e.enableSelectMode(t), u(t);
-      } catch (n) {
-        i("client", "Failed to toggle select mode:", n);
-      }
-  }, [e]), m = s(() => {
-    l("");
-  }, []);
-  return { selectMode: d, connectionStatus: b, selectedXPath: a, enableSelectMode: f, clearXPath: m };
-}
-function M(e) {
-  const [d, u] = r(!1), [a, l] = r(null), b = s((t) => {
-    e && (e.enableDesignMode(t), u(t), t || l(null));
-  }, [e]), o = s((t, n) => {
-    e && (e.updateElementText(t, n), l((c) => c ? { ...c, text: n } : null));
-  }, [e]), f = s((t, n, c) => {
-    e && e.updateProperty(t, n, c);
-  }, [e]), m = s(() => {
-    e && (e.deselectElement(), l(null));
-  }, [e]);
-  return S(() => {
-    if (!e) return;
-    const t = e.on("element-selected", (c) => {
-      l(c);
-    }), n = e.on("design-mode-disabled", () => {
-      d && u(!1);
-    });
-    return () => {
-      t(), n();
-    };
-  }, [e, d]), { designMode: d, selectedElement: a, enableDesignMode: b, updateText: o, updateProperty: f, deselectElement: m };
-}
-export {
-  M as a,
-  E as u
-};

No alert changes

Worsened metrics

Total package byte prevSize

125783

-0.78%

Lines of code

2131

-0.79%

No dependency changes