@floegence/floe-webapp-core 0.36.45 → 0.36.48

package/dist/components/workbench/WorkbenchWidget.js

@@ -1,48 +1,48 @@
-import { spread as $t, mergeProps as ge, insert as g, createComponent as m, memo as he, effect as fe, style as pe, template as It, use as me, delegateEvents as _e } from "solid-js/web";
-import { createMemo as h, createSignal as C, onCleanup as kt, untrack as k, createEffect as yt } from "solid-js";
-import { startHotInteraction as be } from "../../utils/hotInteraction.js";
-import { X as Pt, Minus as xt, Maximize as Tt, GripVertical as ve } from "../icons/index.js";
-import { CANVAS_WHEEL_INTERACTIVE_ATTR as Se, WORKBENCH_WIDGET_SHELL_ATTR as $e, resolveWorkbenchWidgetLocalTypingTarget as ke, resolveWorkbenchWidgetTextSelectionTarget as ye, shouldActivateWorkbenchWidgetLocalTarget as Pe } from "../ui/localInteractionSurface.js";
-import { startPointerSession as Wt } from "../ui/pointerSession.js";
-import { createWorkbenchWidgetSurfaceMetrics as xe, resolveWorkbenchProjectedSurfaceScaleBehavior as Te } from "./workbenchHelpers.js";
-import { createWorkbenchEdgeAutoPanController as We, WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR as Ie, frameFromElement as Me } from "./workbenchEdgeAutoPan.js";
-import { resolveWorkbenchInteractionAdapter as Ce } from "./workbenchInteractionAdapter.js";
+import { spread as yt, mergeProps as fe, insert as h, createComponent as m, memo as pe, effect as me, style as _e, template as Ct, use as be, delegateEvents as ve } from "solid-js/web";
+import { createMemo as w, createSignal as C, onCleanup as Pt, untrack as $, createEffect as xt } from "solid-js";
+import { startHotInteraction as Se } from "../../utils/hotInteraction.js";
+import { X as Mt, Minus as Tt, Maximize as Wt, GripVertical as ke } from "../icons/index.js";
+import { CANVAS_WHEEL_INTERACTIVE_ATTR as $e, WORKBENCH_WIDGET_SHELL_ATTR as ye, resolveWorkbenchWidgetLocalTypingTarget as Pe, resolveWorkbenchWidgetTextSelectionTarget as xe, shouldActivateWorkbenchWidgetLocalTarget as Me } from "../ui/localInteractionSurface.js";
+import { startPointerSession as It } from "../ui/pointerSession.js";
+import { createWorkbenchWidgetSurfaceMetrics as Te, resolveWorkbenchProjectedSurfaceScaleBehavior as We } from "./workbenchHelpers.js";
+import { createWorkbenchEdgeAutoPanController as Ie, WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR as Ce, frameFromElement as Ee } from "./workbenchEdgeAutoPan.js";
+import { resolveWorkbenchInteractionAdapter as Re } from "./workbenchInteractionAdapter.js";
 import { createOwnerSafePropAccessor as a } from "./workbenchOwnerSafeAccessors.js";
-var Ee = /* @__PURE__ */ It('<article class=workbench-widget><div class=workbench-widget__surface><header class=workbench-widget__header><span class=workbench-widget__traffic role=group aria-label="Window controls"><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--close"aria-label="Close widget"title="Close widget"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--min"aria-label="Minimize widget to overview"title="Minimize widget to overview"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--max"aria-label="Zoom widget to fit viewport"title="Zoom widget to fit viewport"data-floe-canvas-interactive=true></button></span><span class=workbench-widget__badge aria-hidden=true></span><button type=button class=workbench-widget__drag aria-label="Drag widget"data-floe-canvas-interactive=true></button><div class=workbench-widget__title-area><span class=workbench-widget__title-dot aria-hidden=true></span><span class=workbench-widget__title></span></div><span class=workbench-widget__window-controls role=group aria-label="Window controls"><button type=button class="workbench-widget__window-control workbench-widget__window-control--min"aria-label="Minimize widget to overview"title="Minimize widget to overview"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__window-control workbench-widget__window-control--max"aria-label="Zoom widget to fit viewport"title="Zoom widget to fit viewport"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__window-control workbench-widget__window-control--close"aria-label="Remove widget"title="Remove widget"data-floe-canvas-interactive=true></button></span></header><div class=workbench-widget__body data-floe-canvas-interactive=true>'), Re = /* @__PURE__ */ It('<div class=workbench-widget__resize aria-label="Resize widget"data-floe-canvas-interactive=true><svg class=workbench-widget__resize-glyph viewBox="0 0 12 12"aria-hidden=true><path d="M12 0 L0 12"></path><path d="M12 4 L4 12"></path><path d="M12 8 L8 12">');
-const Le = 220, Ae = 160, ze = 160;
-function Ne(r) {
-  const H = a(() => r.definition), f = a(() => r.widgetId), nt = a(() => r.widgetTitle), it = a(() => r.widgetType), E = a(() => r.itemSnapshot), Mt = a(() => r.renderLayer), Ct = a(() => r.optimisticFront), Et = a(() => r.topRenderLayer), Rt = a(() => r.viewport), V = a(() => r.onSelect), Lt = a(() => r.onContextMenu), rt = a(() => r.onStartOptimisticFront), at = a(() => r.onCommitFront), At = a(() => r.onCommitMove), zt = a(() => r.onCommitResize), Xt = a(() => r.onViewportCommit), Yt = a(() => r.onViewportInteractionStart), Dt = a(() => r.onRequestOverview), Ft = a(() => r.onRequestFit), jt = a(() => r.onRequestDelete), Ot = a(() => r.onLayoutInteractionStart), Ht = a(() => r.onLayoutInteractionEnd), w = h(() => Ce(r.interactionAdapter)), q = a(() => r.selected), v = a(() => r.locked), B = a(() => r.filtered), b = a(() => r.layoutMode ?? "canvas_scaled"), Vt = a(() => r.projectedViewport), qt = a(() => r.surfaceReady ?? !0), ct = a(() => ({
-    x: r.x,
-    y: r.y
-  })), lt = a(() => ({
-    width: r.width,
-    height: r.height
-  })), N = a(() => Math.max(r.viewportScale, 1e-3)), [y, R] = C(null), [L, G] = C(null), [Bt, Nt] = C(), [Z, K] = C(!1), [st, A] = C({
+var Le = /* @__PURE__ */ Ct('<article class=workbench-widget><div class=workbench-widget__surface><header class=workbench-widget__header><span class=workbench-widget__traffic role=group aria-label="Window controls"><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--close"aria-label="Close widget"title="Close widget"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--min"aria-label="Minimize widget to overview"title="Minimize widget to overview"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--max"aria-label="Zoom widget to fit viewport"title="Zoom widget to fit viewport"data-floe-canvas-interactive=true></button></span><span class=workbench-widget__badge aria-hidden=true></span><button type=button class=workbench-widget__drag aria-label="Drag widget"data-floe-canvas-interactive=true></button><div class=workbench-widget__title-area><span class=workbench-widget__title-dot aria-hidden=true></span><span class=workbench-widget__title></span></div><span class=workbench-widget__window-controls role=group aria-label="Window controls"><button type=button class="workbench-widget__window-control workbench-widget__window-control--min"aria-label="Minimize widget to overview"title="Minimize widget to overview"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__window-control workbench-widget__window-control--max"aria-label="Zoom widget to fit viewport"title="Zoom widget to fit viewport"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__window-control workbench-widget__window-control--close"aria-label="Remove widget"title="Remove widget"data-floe-canvas-interactive=true></button></span></header><div class=workbench-widget__body data-floe-canvas-interactive=true>'), Ae = /* @__PURE__ */ Ct('<div class=workbench-widget__resize aria-label="Resize widget"data-floe-canvas-interactive=true><svg class=workbench-widget__resize-glyph viewBox="0 0 12 12"aria-hidden=true><path d="M12 0 L0 12"></path><path d="M12 4 L4 12"></path><path d="M12 8 L8 12">');
+const ze = 220, Xe = 160, Ye = 160;
+function Ze(i) {
+  const H = a(() => i.definition), f = a(() => i.widgetId), nt = a(() => i.widgetTitle), it = a(() => i.widgetType), E = a(() => i.itemSnapshot), Et = a(() => i.renderLayer), Rt = a(() => i.optimisticFront), rt = a(() => i.motion ?? null), Lt = a(() => i.topRenderLayer), At = a(() => i.viewport), V = a(() => i.onSelect), zt = a(() => i.onContextMenu), at = a(() => i.onStartOptimisticFront), ct = a(() => i.onCommitFront), Xt = a(() => i.onCommitMove), Yt = a(() => i.onCommitResize), Dt = a(() => i.onViewportCommit), Ft = a(() => i.onViewportInteractionStart), jt = a(() => i.onRequestOverview), Ot = a(() => i.onRequestFit), Ht = a(() => i.onRequestDelete), Vt = a(() => i.onLayoutInteractionStart), qt = a(() => i.onLayoutInteractionEnd), g = w(() => Re(i.interactionAdapter)), q = a(() => i.selected), v = a(() => i.locked), B = a(() => i.filtered), b = a(() => i.layoutMode ?? "canvas_scaled"), Bt = a(() => i.projectedViewport), Nt = a(() => i.surfaceReady ?? !0), lt = a(() => ({
+    x: i.x,
+    y: i.y
+  })), st = a(() => ({
+    width: i.width,
+    height: i.height
+  })), N = a(() => Math.max(i.viewportScale, 1e-3)), [y, R] = C(null), [L, G] = C(null), [Gt, Zt] = C(), [Z, K] = C(!1), [dt, A] = C({
     enabled: !1,
     scale: 1
   });
-  let P, x, T, z = null, Gt = 0, Zt = 0, S = null, W;
-  const I = /* @__PURE__ */ new Map();
+  let P, x, M, z = null, Kt = 0, Ut = 0, S = null, T;
+  const W = /* @__PURE__ */ new Map();
   let u;
   const X = () => {
-    typeof window > "u" || W === void 0 || (window.clearTimeout(W), W = void 0);
-  }, dt = (t, e) => {
-    const n = be({
+    typeof window > "u" || T === void 0 || (window.clearTimeout(T), T = void 0);
+  }, ut = (t, e) => {
+    const n = Se({
       kind: t,
       cursor: e
     });
     let o = !1;
-    return k(() => Ot()?.()), () => {
-      o || (o = !0, n(), k(() => Ht()?.()));
+    return $(() => Vt()?.()), () => {
+      o || (o = !0, n(), $(() => qt()?.()));
     };
-  }, ut = () => {
-    T?.stop(), T = void 0, z = null;
-  }, Kt = () => {
-    const t = Rt(), e = Xt(), n = Yt();
-    !t || !e || (z = t, T?.stop(), T = We({
+  }, wt = () => {
+    M?.stop(), M = void 0, z = null;
+  }, Jt = () => {
+    const t = At(), e = Dt(), n = Ft();
+    !t || !e || (z = t, M?.stop(), M = Ie({
       readFrame: () => {
-        const o = u?.closest(Ie);
-        return o instanceof HTMLElement ? Me(o) : null;
+        const o = u?.closest(Ce);
+        return o instanceof HTMLElement ? Ee(o) : null;
       },
       readViewport: () => z ?? t,
       commitViewport: (o) => {
@@ -50,78 +50,78 @@ function Ne(r) {
       },
       onPanStart: () => n?.("pan"),
       onPan: (o) => {
-        R((i) => i && {
-          ...i,
-          autoPanWorldX: i.autoPanWorldX + o.worldDeltaX,
-          autoPanWorldY: i.autoPanWorldY + o.worldDeltaY,
-          worldX: i.worldX + o.worldDeltaX,
-          worldY: i.worldY + o.worldDeltaY,
+        R((r) => r && {
+          ...r,
+          autoPanWorldX: r.autoPanWorldX + o.worldDeltaX,
+          autoPanWorldY: r.autoPanWorldY + o.worldDeltaY,
+          worldX: r.worldX + o.worldDeltaX,
+          worldY: r.worldY + o.worldDeltaY,
           moved: !0
         });
       },
       shouldPan: () => y() !== null
     }));
   };
-  kt(() => {
-    ut(), P?.stop({
+  Pt(() => {
+    wt(), P?.stop({
       reason: "manual_stop",
       commit: !1
     }), P = void 0, x?.stop({
       reason: "manual_stop",
       commit: !1
-    }), x = void 0, k(y)?.stopInteraction(), k(L)?.stopInteraction(), X();
+    }), x = void 0, $(y)?.stopInteraction(), $(L)?.stopInteraction(), X();
   });
   const Y = () => {
     K(!1);
     const t = f();
-    V()(t), at()(t);
+    V()(t), ct()(t);
   }, U = () => {
     K(!1);
-  }, M = h(() => q() || Z()), Ut = (t, e, n) => {
+  }, I = w(() => q() || Z()), Qt = (t, e, n) => {
     const o = {
-      token: ++Zt,
+      token: ++Ut,
       wasSelected: e,
       ownership: n
     };
-    I.set(t, o), !e && n === "widget_local" && K(!0), queueMicrotask(() => {
-      I.get(t)?.token === o.token && I.delete(t);
+    W.set(t, o), !e && n === "widget_local" && K(!0), queueMicrotask(() => {
+      W.get(t)?.token === o.token && W.delete(t);
     });
-  }, Jt = (t) => {
-    const e = I.get(t) ?? null;
-    return e && I.delete(t), e;
+  }, te = (t) => {
+    const e = W.get(t) ?? null;
+    return e && W.delete(t), e;
   };
-  yt(() => {
+  xt(() => {
     const t = u;
     if (!t) return;
-    const e = (i) => {
-      i.button === 0 && Ut(i.pointerId, M(), D(i.target));
-    }, n = (i) => {
-      i.button === 0 && Z() && D(i.target) === "widget_local" && Y();
+    const e = (r) => {
+      r.button === 0 && Qt(r.pointerId, I(), D(r.target));
+    }, n = (r) => {
+      r.button === 0 && Z() && D(r.target) === "widget_local" && Y();
     }, o = () => {
       setTimeout(() => {
         q() || U();
       }, 0);
     };
-    t.addEventListener("pointerdown", e, !0), t.addEventListener("click", n, !0), t.addEventListener("pointerup", o), t.addEventListener("pointercancel", U), kt(() => {
+    t.addEventListener("pointerdown", e, !0), t.addEventListener("click", n, !0), t.addEventListener("pointerup", o), t.addEventListener("pointercancel", U), Pt(() => {
       t.removeEventListener("pointerdown", e, !0), t.removeEventListener("click", n, !0), t.removeEventListener("pointerup", o), t.removeEventListener("pointercancel", U);
     });
   });
-  const J = () => y() !== null, Q = () => L() !== null, Qt = h(() => B() || v() ? "cold" : M() ? "hot" : "warm"), D = (t) => w().resolveWidgetEventOwnership({
+  const J = () => y() !== null, Q = () => L() !== null, ee = w(() => B() || v() ? "cold" : I() ? "hot" : "warm"), D = (t) => g().resolveWidgetEventOwnership({
     target: t,
     widgetRoot: u ?? null,
-    interactiveSelector: w().interactiveSelector,
-    panSurfaceSelector: w().panSurfaceSelector
-  }), te = () => {
+    interactiveSelector: g().interactiveSelector,
+    panSurfaceSelector: g().panSurfaceSelector
+  }), oe = () => {
     Y(), u?.focus({
       preventScroll: !0
     });
-  }, wt = (t) => {
-    Nt((e) => ({
+  }, gt = (t) => {
+    Zt((e) => ({
       seq: (e?.seq ?? 0) + 1,
       source: "local_pointer",
       pointerType: t
     }));
-  }, ee = (t) => {
+  }, ne = (t) => {
     if (!(!u || !t.isConnected || !u.contains(t)))
       try {
         t.focus({
@@ -130,9 +130,9 @@ function Ne(r) {
       } catch {
         t.focus();
       }
-  }, oe = (t, e) => {
+  }, ie = (t, e) => {
     S = {
-      token: ++Gt,
+      token: ++Kt,
       pointerId: t,
       target: e,
       timestamp: Date.now()
@@ -140,7 +140,7 @@ function Ne(r) {
     const n = S;
     queueMicrotask(() => {
       const o = () => {
-        !n || S?.token !== n.token || (ee(n.target), S = null);
+        !n || S?.token !== n.token || (ne(n.target), S = null);
       };
       if (typeof requestAnimationFrame == "function") {
         requestAnimationFrame(() => o());
@@ -148,23 +148,23 @@ function Ne(r) {
       }
       o();
     });
-  }, ne = (t) => {
+  }, re = (t) => {
     if (t.button !== 0 || v()) return;
-    const e = Jt(t.pointerId), n = e?.wasSelected ?? q(), o = e?.ownership ?? D(t.target), i = o === "widget_local" ? ke({
+    const e = te(t.pointerId), n = e?.wasSelected ?? q(), o = e?.ownership ?? D(t.target), r = o === "widget_local" ? Pe({
       target: t.target,
       widgetRoot: u ?? null,
-      interactiveSelector: w().interactiveSelector,
-      panSurfaceSelector: w().panSurfaceSelector
-    }) : null, s = o === "widget_local" ? ye({
+      interactiveSelector: g().interactiveSelector,
+      panSurfaceSelector: g().panSurfaceSelector
+    }) : null, s = o === "widget_local" ? xe({
       target: t.target,
       widgetRoot: u ?? null,
-      interactiveSelector: w().interactiveSelector,
-      panSurfaceSelector: w().panSurfaceSelector
-    }) : null, c = o === "widget_local" && !i && !s && Pe({
+      interactiveSelector: g().interactiveSelector,
+      panSurfaceSelector: g().panSurfaceSelector
+    }) : null, c = o === "widget_local" && !r && !s && Me({
       target: t.target,
       widgetRoot: u ?? null,
-      interactiveSelector: w().interactiveSelector,
-      panSurfaceSelector: w().panSurfaceSelector
+      interactiveSelector: g().interactiveSelector,
+      panSurfaceSelector: g().panSurfaceSelector
     });
     if (o === "widget_shell") {
       Y(), u?.focus({
@@ -173,8 +173,8 @@ function Ne(r) {
       return;
     }
     if (o === "widget_local") {
-      if (i) {
-        n || oe(t.pointerId, i);
+      if (r) {
+        n || ie(t.pointerId, r);
         return;
       }
       if (s) {
@@ -183,41 +183,41 @@ function Ne(r) {
       }
       if (c) {
         if (S = null, n) {
-          wt(t.pointerType || void 0);
+          gt(t.pointerType || void 0);
           return;
         }
-        Y(), wt(t.pointerType || void 0);
+        Y(), gt(t.pointerType || void 0);
       }
     }
-  }, F = h(() => {
+  }, F = w(() => {
     const t = y();
     return t ? {
       x: t.worldX,
       y: t.worldY
-    } : ct();
-  }), p = h(() => {
+    } : lt();
+  }), p = w(() => {
     const t = L();
     return t ? {
       width: t.width,
       height: t.height
-    } : lt();
-  }), tt = h(() => {
-    const t = Vt();
+    } : st();
+  }), tt = w(() => {
+    const t = Bt();
     if (!(b() !== "projected_surface" || !t))
-      return xe({
+      return Te({
         widgetId: f(),
         worldX: F().x,
         worldY: F().y,
         worldWidth: p().width,
         worldHeight: p().height,
         viewport: t(),
-        ready: qt()
+        ready: Nt()
       });
-  }), et = h(() => tt()?.rect.viewportScale ?? N()), gt = h(() => b() === "projected_surface" && Te(H()) === "settle_sharp_zoom"), ht = h(() => b() === "projected_surface" && gt() && st().enabled && st().scale > 1.001), ie = h(() => {
+  }), et = w(() => tt()?.rect.viewportScale ?? N()), ht = w(() => b() === "projected_surface" && We(H()) === "settle_sharp_zoom"), ft = w(() => b() === "projected_surface" && ht() && dt().enabled && dt().scale > 1.001), ae = w(() => {
     if (b() !== "projected_surface")
       return;
     const t = et();
-    return ht() ? {
+    return ft() ? {
       width: `${p().width}px`,
       height: `${p().height}px`,
       zoom: `${t}`
@@ -226,24 +226,24 @@ function Ne(r) {
       height: "100%",
       zoom: "1"
     };
-  }), re = h(() => {
+  }), ce = w(() => {
     const t = E()().z_index, e = Number.isFinite(t) ? Math.max(1, Math.min(99, Math.round(t))) : 1;
     return String(e).padStart(2, "0");
-  }), ft = (t) => {
-    t.preventDefault(), t.stopPropagation(), Dt()(E()());
-  }, pt = (t) => {
-    t.preventDefault(), t.stopPropagation(), Ft()(E()());
+  }), pt = (t) => {
+    t.preventDefault(), t.stopPropagation(), jt()(E()());
   }, mt = (t) => {
-    t.preventDefault(), t.stopPropagation(), jt()(f());
-  }, ae = h(() => {
+    t.preventDefault(), t.stopPropagation(), Ot()(E()());
+  }, _t = (t) => {
+    t.preventDefault(), t.stopPropagation(), Ht()(f());
+  }, le = w(() => {
     const t = {
-      "z-index": J() || Q() || Ct() ? `${Et() + 1}` : `${Mt()}`
+      "z-index": J() || Q() || Rt() ? `${Lt() + 1}` : `${Et()}`
     };
     if (b() === "projected_surface") {
-      const e = tt()?.rect, n = et(), o = ht(), i = o ? e?.screenWidth ?? p().width * n : p().width, s = o ? e?.screenHeight ?? p().height * n : p().height;
+      const e = tt()?.rect, n = et(), o = ft(), r = o ? e?.screenWidth ?? p().width * n : p().width, s = o ? e?.screenHeight ?? p().height * n : p().height;
       return {
         ...t,
-        width: `${i}px`,
+        width: `${r}px`,
         height: `${s}px`,
         transform: o ? `translate(${e?.screenX ?? 0}px, ${e?.screenY ?? 0}px)` : `translate(${e?.screenX ?? 0}px, ${e?.screenY ?? 0}px) scale(${n})`,
         zoom: "1"
@@ -255,9 +255,9 @@ function Ne(r) {
       height: `${p().height}px`,
       transform: `translate(${F().x}px, ${F().y}px)`
     };
-  });
-  yt(() => {
-    if (!gt()) {
+  }), bt = w(() => rt()?.phase === "enter");
+  xt(() => {
+    if (!ht()) {
       X(), A({
         enabled: !1,
         scale: 1
@@ -279,15 +279,15 @@ function Ne(r) {
       return;
     X();
     const e = t;
-    W = window.setTimeout(() => {
-      W = void 0, A((n) => Math.abs(n.scale - e) < 1e-3 ? {
+    T = window.setTimeout(() => {
+      T = void 0, A((n) => Math.abs(n.scale - e) < 1e-3 ? {
         enabled: !0,
         scale: e
       } : n);
-    }, ze);
+    }, Ye);
   });
-  const ce = (t) => {
-    const e = k(y);
+  const se = (t) => {
+    const e = $(y);
     if (!e) return;
     const n = {
       x: e.worldX,
@@ -295,9 +295,9 @@ function Ne(r) {
     }, o = {
       x: e.startWorldX,
       y: e.startWorldY
-    }, i = t && (Math.abs(n.x - o.x) > 1 || Math.abs(n.y - o.y) > 1), s = f();
-    at()(s), i && At()(s, n), e.stopInteraction(), ut(), R(null), P = void 0;
-  }, _t = (t) => {
+    }, r = t && (Math.abs(n.x - o.x) > 1 || Math.abs(n.y - o.y) > 1), s = f();
+    ct()(s), r && Xt()(s, n), e.stopInteraction(), wt(), R(null), P = void 0;
+  }, vt = (t) => {
     if (t.button !== 0 || v()) return;
     t.preventDefault(), t.stopPropagation(), P?.stop({
       reason: "manual_stop",
@@ -306,57 +306,57 @@ function Ne(r) {
     const e = f();
     V()(e), u?.focus({
       preventScroll: !0
-    }), rt()(e);
-    const n = dt("drag", "grabbing"), o = N(), i = ct();
+    }), at()(e);
+    const n = ut("drag", "grabbing"), o = N(), r = lt();
     R({
       pointerId: t.pointerId,
       startClientX: t.clientX,
       startClientY: t.clientY,
-      startWorldX: i.x,
-      startWorldY: i.y,
-      worldX: i.x,
-      worldY: i.y,
+      startWorldX: r.x,
+      startWorldY: r.y,
+      worldX: r.x,
+      worldY: r.y,
       autoPanWorldX: 0,
       autoPanWorldY: 0,
       moved: !1,
       scale: o,
       stopInteraction: n
-    }), Kt();
+    }), Jt();
     const s = (c) => {
-      T?.updatePointer(c.clientX, c.clientY), R((d) => {
+      M?.updatePointer(c.clientX, c.clientY), R((d) => {
         if (!d || d.pointerId !== c.pointerId) return d;
-        const _ = d.startWorldX + (c.clientX - d.startClientX) / d.scale + d.autoPanWorldX, $ = d.startWorldY + (c.clientY - d.startClientY) / d.scale + d.autoPanWorldY;
+        const _ = d.startWorldX + (c.clientX - d.startClientX) / d.scale + d.autoPanWorldX, k = d.startWorldY + (c.clientY - d.startClientY) / d.scale + d.autoPanWorldY;
         return {
           ...d,
           worldX: _,
-          worldY: $,
-          moved: d.moved || Math.abs(_ - d.startWorldX) > 2 || Math.abs($ - d.startWorldY) > 2
+          worldY: k,
+          moved: d.moved || Math.abs(_ - d.startWorldX) > 2 || Math.abs(k - d.startWorldY) > 2
         };
       });
     };
-    P = Wt({
+    P = It({
       pointerEvent: t,
       captureEl: t.currentTarget,
       onMove: s,
       onEnd: ({
         commit: c
-      }) => ce(c)
+      }) => se(c)
     });
-  }, le = (t) => {
-    const e = k(L);
+  }, de = (t) => {
+    const e = $(L);
     if (!e) return;
     const n = {
       width: e.width,
       height: e.height
     }, o = Math.abs(e.width - e.startWidth) > 1 || Math.abs(e.height - e.startHeight) > 1;
-    t && o && zt()(f(), n), e.stopInteraction(), G(null), x = void 0;
-  }, se = (t) => {
+    t && o && Yt()(f(), n), e.stopInteraction(), G(null), x = void 0;
+  }, ue = (t) => {
     if (t.button !== 0 || v()) return;
     t.preventDefault(), t.stopPropagation(), x?.stop({
       reason: "manual_stop",
       commit: !1
-    }), rt()(f());
-    const e = dt("resize", "nwse-resize"), n = N(), o = lt();
+    }), at()(f());
+    const e = ut("resize", "nwse-resize"), n = N(), o = st();
     G({
       pointerId: t.pointerId,
       startClientX: t.clientX,
@@ -368,10 +368,10 @@ function Ne(r) {
       scale: n,
       stopInteraction: e
     });
-    const i = (s) => {
+    const r = (s) => {
       G((c) => {
         if (!c || c.pointerId !== s.pointerId) return c;
-        const d = Math.max(Le, c.startWidth + (s.clientX - c.startClientX) / c.scale), _ = Math.max(Ae, c.startHeight + (s.clientY - c.startClientY) / c.scale);
+        const d = Math.max(ze, c.startWidth + (s.clientX - c.startClientX) / c.scale), _ = Math.max(Xe, c.startHeight + (s.clientY - c.startClientY) / c.scale);
         return {
           ...c,
           width: d,
@@ -379,87 +379,91 @@ function Ne(r) {
         };
       });
     };
-    x = Wt({
+    x = It({
       pointerEvent: t,
       captureEl: t.currentTarget,
-      onMove: i,
+      onMove: r,
       onEnd: ({
         commit: s
-      }) => le(s)
+      }) => de(s)
     });
   };
   return (() => {
-    var t = Ee(), e = t.firstChild, n = e.firstChild, o = n.firstChild, i = o.firstChild, s = i.nextSibling, c = s.nextSibling, d = o.nextSibling, _ = d.nextSibling, $ = _.nextSibling, de = $.firstChild, bt = de.nextSibling, ue = $.nextSibling, j = ue.firstChild, O = j.nextSibling, ot = O.nextSibling, we = n.nextSibling, vt = u;
-    return typeof vt == "function" ? me(vt, t) : u = t, $t(t, ge({
+    var t = Le(), e = t.firstChild, n = e.firstChild, o = n.firstChild, r = o.firstChild, s = r.nextSibling, c = s.nextSibling, d = o.nextSibling, _ = d.nextSibling, k = _.nextSibling, we = k.firstChild, St = we.nextSibling, ge = k.nextSibling, j = ge.firstChild, O = j.nextSibling, ot = O.nextSibling, he = n.nextSibling, kt = u;
+    return typeof kt == "function" ? be(kt, t) : u = t, yt(t, fe({
       get classList() {
         return {
-          "is-selected": M(),
+          "is-selected": I(),
           "is-dragging": J(),
           "is-resizing": Q(),
           "is-filtered-out": B(),
           "is-projected-surface": b() === "projected_surface",
-          "is-locked": v()
+          "is-locked": v(),
+          "is-entering": bt()
         };
       }
     }, () => ({
-      [w().dialogSurfaceHostAttr]: "true"
+      [g().dialogSurfaceHostAttr]: "true"
     }), {
       get "data-floe-workbench-widget-id"() {
         return f();
       }
     }, () => ({
-      [w().widgetRootAttr]: "true"
+      [g().widgetRootAttr]: "true"
     }), () => ({
-      [w().widgetIdAttr]: f()
+      [g().widgetIdAttr]: f()
     }), {
       get "data-workbench-widget-type"() {
         return it();
       },
       get "data-floe-workbench-render-mode"() {
         return b();
+      },
+      get "data-workbench-widget-motion"() {
+        return bt() ? "enter" : void 0;
       }
     }, () => ({
-      [Se]: M() ? "true" : void 0
+      [$e]: I() ? "true" : void 0
     }), {
       tabIndex: 0,
-      onPointerDown: ne,
+      onPointerDown: re,
       onFocus: () => {
         Z() || V()(f());
       },
       onContextMenu: (l) => {
-        D(l.target) === "widget_shell" && (l.preventDefault(), l.stopPropagation(), Lt()(l, E()()));
+        D(l.target) === "widget_shell" && (l.preventDefault(), l.stopPropagation(), zt()(l, E()()));
       },
       get style() {
-        return ae();
+        return le();
       }
-    }), !1, !0), n.$$pointerdown = _t, $t(n, {
-      [$e]: "true"
-    }, !1, !0), i.$$click = mt, i.$$pointerdown = (l) => l.stopPropagation(), g(i, m(Pt, {
+    }), !1, !0), n.$$pointerdown = vt, yt(n, {
+      [ye]: "true"
+    }, !1, !0), r.$$click = _t, r.$$pointerdown = (l) => l.stopPropagation(), h(r, m(Mt, {
       class: "workbench-widget__traffic-icon",
       "aria-hidden": "true"
-    })), s.$$click = ft, s.$$pointerdown = (l) => l.stopPropagation(), g(s, m(xt, {
+    })), s.$$click = pt, s.$$pointerdown = (l) => l.stopPropagation(), h(s, m(Tt, {
       class: "workbench-widget__traffic-icon",
       "aria-hidden": "true"
-    })), c.$$click = pt, c.$$pointerdown = (l) => l.stopPropagation(), g(c, m(Tt, {
+    })), c.$$click = mt, c.$$pointerdown = (l) => l.stopPropagation(), h(c, m(Wt, {
       class: "workbench-widget__traffic-icon",
       "aria-hidden": "true"
-    })), g(d, re), _.$$pointerdown = _t, g(_, m(ve, {
+    })), h(d, ce), _.$$pointerdown = vt, h(_, m(ke, {
       class: "w-3.5 h-3.5"
-    })), g($, () => {
+    })), h(k, () => {
       const l = H().icon;
       return m(l, {
         class: "w-3.5 h-3.5"
       });
-    }, bt), g(bt, nt), j.$$click = ft, j.$$pointerdown = (l) => l.stopPropagation(), g(j, m(xt, {
+    }, St), h(St, nt), j.$$click = pt, j.$$pointerdown = (l) => l.stopPropagation(), h(j, m(Tt, {
       class: "workbench-widget__window-control-icon",
       "aria-hidden": "true"
-    })), O.$$click = pt, O.$$pointerdown = (l) => l.stopPropagation(), g(O, m(Tt, {
+    })), O.$$click = mt, O.$$pointerdown = (l) => l.stopPropagation(), h(O, m(Wt, {
       class: "workbench-widget__window-control-icon",
       "aria-hidden": "true"
-    })), ot.$$click = mt, ot.$$pointerdown = (l) => l.stopPropagation(), g(ot, m(Pt, {
+    })), ot.$$click = _t, ot.$$pointerdown = (l) => l.stopPropagation(), h(ot, m(Mt, {
       class: "workbench-widget__window-control-icon",
       "aria-hidden": "true"
-    })), g(we, () => {
+    })), h(he, () => {
       const l = H().body;
       return m(l, {
         get widgetId() {
@@ -473,29 +477,32 @@ function Ne(r) {
         },
         surfaceMetrics: tt,
         get activation() {
-          return Bt();
+          return Gt();
         },
         get lifecycle() {
-          return Qt();
+          return ee();
+        },
+        get motion() {
+          return rt();
         },
         get selected() {
-          return M();
+          return I();
         },
         get filtered() {
           return B();
         },
-        requestActivate: te
+        requestActivate: oe
       });
-    }), g(e, (() => {
-      var l = he(() => !!v());
+    }), h(e, (() => {
+      var l = pe(() => !!v());
       return () => l() ? null : (() => {
-        var St = Re();
-        return St.$$pointerdown = se, St;
+        var $t = Ae();
+        return $t.$$pointerdown = ue, $t;
       })();
-    })(), null), fe((l) => pe(e, ie(), l)), t;
+    })(), null), me((l) => _e(e, ae(), l)), t;
   })();
 }
-_e(["pointerdown", "click"]);
+ve(["pointerdown", "click"]);
 export {
-  Ne as WorkbenchWidget
+  Ze as WorkbenchWidget
 };