@floegence/floe-webapp-core 0.36.39 → 0.36.41

package/dist/components/file-browser/useFileBrowserMarqueeSelection.d.ts

@@ -19,6 +19,8 @@ export interface OverlayHostGeometry {
     scrollTop: number;
     clientLeft: number;
     clientTop: number;
+    scaleX?: number;
+    scaleY?: number;
 }
 export interface FileBrowserMarqueeSelectionOptions {
     getContainer: () => HTMLElement | null;

package/dist/components/file-browser/useFileBrowserMarqueeSelection.js

@@ -1,93 +1,99 @@
-import { createSignal as S, createMemo as b, onCleanup as w } from "solid-js";
-import { isPrimaryModKeyPressed as M } from "../../utils/keybind.js";
-const y = 4, A = "pointer-events-none absolute z-40 rounded-md floe-file-browser-marquee-overlay";
-function T(e, n, c, o) {
-  const l = Math.min(e, c), u = Math.min(n, o);
+import { createSignal as v, createMemo as w, onCleanup as M } from "solid-js";
+import { isPrimaryModKeyPressed as T } from "../../utils/keybind.js";
+const x = 4, _ = "pointer-events-none absolute z-40 rounded-md floe-file-browser-marquee-overlay";
+function y(e, t, l, r) {
+  const i = Math.min(e, l), s = Math.min(t, r);
   return {
-    left: l,
-    top: u,
-    width: Math.abs(c - e),
-    height: Math.abs(o - n)
+    left: i,
+    top: s,
+    width: Math.abs(l - e),
+    height: Math.abs(r - t)
   };
 }
-function O(e, n) {
-  return !(e.left + e.width < n.left || n.right < e.left || e.top + e.height < n.top || n.bottom < e.top);
+function H(e, t) {
+  return !(e.left + e.width < t.left || t.right < e.left || e.top + e.height < t.top || t.bottom < e.top);
 }
-function P(e) {
+function O(e) {
   return !(!(e instanceof Element) || e.closest("[data-file-browser-item-id]") || e.closest('button, input, textarea, select, a, [role="button"], [role="menuitem"]'));
 }
-function x(e) {
-  const n = e.getBoundingClientRect();
+function P(e) {
+  const t = e.getBoundingClientRect(), l = e.offsetWidth, r = e.offsetHeight;
   return {
-    left: n.left,
-    top: n.top,
+    left: t.left,
+    top: t.top,
     scrollLeft: e.scrollLeft,
     scrollTop: e.scrollTop,
     clientLeft: e.clientLeft,
-    clientTop: e.clientTop
+    clientTop: e.clientTop,
+    scaleX: l > 0 && t.width > 0 ? t.width / l : 1,
+    scaleY: r > 0 && t.height > 0 ? t.height / r : 1
   };
 }
-function C(e, n) {
+function I(e) {
+  return Number.isFinite(e) && e !== void 0 && e > 0 ? e : 1;
+}
+function B(e, t) {
+  const l = I(t.scaleX), r = I(t.scaleY);
   return {
-    left: e.left - n.left + n.scrollLeft - n.clientLeft,
-    top: e.top - n.top + n.scrollTop - n.clientTop,
-    width: e.width,
-    height: e.height
+    left: (e.left - t.left) / l + t.scrollLeft - t.clientLeft,
+    top: (e.top - t.top) / r + t.scrollTop - t.clientTop,
+    width: e.width / l,
+    height: e.height / r
   };
 }
-function D(e) {
-  const [n, c] = S(null);
-  let o = null, l = !1, u = [], a = 0, f = 0, s = !1;
-  const I = () => {
-    typeof document > "u" || (document.removeEventListener("pointermove", p, !0), document.removeEventListener("pointerup", m, !0), document.removeEventListener("pointercancel", h, !0));
-  }, d = () => {
-    I(), o = null, l = !1, u = [], a = 0, f = 0, s = !1, c(null);
-  }, L = (t) => {
-    const i = e.getVisibleItemIdsInOrder().filter((R) => {
-      const g = e.getElementForId(R);
-      return g ? O(t, g.getBoundingClientRect()) : !1;
-    }), r = l ? [...u, ...i] : i;
-    e.replaceSelection(r, {
-      anchorId: l ? void 0 : r[0] ?? null,
-      lastInteractedId: r[r.length - 1] ?? null,
-      preserveAnchor: l
+function A(e) {
+  const [t, l] = v(null);
+  let r = null, i = !1, s = [], a = 0, d = 0, u = !1;
+  const L = () => {
+    typeof document > "u" || (document.removeEventListener("pointermove", p, !0), document.removeEventListener("pointerup", h, !0), document.removeEventListener("pointercancel", m, !0));
+  }, f = () => {
+    L(), r = null, i = !1, s = [], a = 0, d = 0, u = !1, l(null);
+  }, E = (n) => {
+    const c = e.getVisibleItemIdsInOrder().filter((S) => {
+      const g = e.getElementForId(S);
+      return g ? H(n, g.getBoundingClientRect()) : !1;
+    }), o = i ? [...s, ...c] : c;
+    e.replaceSelection(o, {
+      anchorId: i ? void 0 : o[0] ?? null,
+      lastInteractedId: o[o.length - 1] ?? null,
+      preserveAnchor: i
     });
-  }, p = (t) => {
-    if (o !== t.pointerId) return;
-    const i = Math.hypot(t.clientX - a, t.clientY - f);
-    if (!s && i < y)
+  }, p = (n) => {
+    if (r !== n.pointerId) return;
+    const c = Math.hypot(n.clientX - a, n.clientY - d);
+    if (!u && c < x)
       return;
-    t.preventDefault(), s = !0;
-    const r = T(a, f, t.clientX, t.clientY);
-    c(r), L(r);
-  }, m = (t) => {
-    o === t.pointerId && (!s && !l && e.clearSelection(), d());
-  }, h = (t) => {
-    o === t.pointerId && d();
-  }, v = (t) => {
-    t.pointerType !== "mouse" || t.button !== 0 || P(t.target) && e.getContainer() && (o = t.pointerId, l = M(t), u = l ? e.getSelectedIds() : [], a = t.clientX, f = t.clientY, s = !1, typeof document < "u" && (document.addEventListener("pointermove", p, !0), document.addEventListener("pointerup", m, !0), document.addEventListener("pointercancel", h, !0)), t.preventDefault());
-  }, E = b(() => {
-    const t = n();
-    if (!t) return null;
-    const i = e.getOverlayHost?.() ?? e.getContainer();
-    if (!i) return null;
-    const r = C(t, x(i));
+    n.preventDefault(), u = !0;
+    const o = y(a, d, n.clientX, n.clientY);
+    l(o), E(o);
+  }, h = (n) => {
+    r === n.pointerId && (!u && !i && e.clearSelection(), f());
+  }, m = (n) => {
+    r === n.pointerId && f();
+  }, b = (n) => {
+    n.pointerType !== "mouse" || n.button !== 0 || O(n.target) && e.getContainer() && (r = n.pointerId, i = T(n), s = i ? e.getSelectedIds() : [], a = n.clientX, d = n.clientY, u = !1, typeof document < "u" && (document.addEventListener("pointermove", p, !0), document.addEventListener("pointerup", h, !0), document.addEventListener("pointercancel", m, !0)), n.preventDefault());
+  }, R = w(() => {
+    const n = t();
+    if (!n) return null;
+    const c = e.getOverlayHost?.() ?? e.getContainer();
+    if (!c) return null;
+    const o = B(n, P(c));
     return {
-      left: `${r.left}px`,
-      top: `${r.top}px`,
-      width: `${r.width}px`,
-      height: `${r.height}px`
+      left: `${o.left}px`,
+      top: `${o.top}px`,
+      width: `${o.width}px`,
+      height: `${o.height}px`
     };
   });
-  return w(() => {
-    d();
+  return M(() => {
+    f();
   }), {
-    overlayStyle: E,
-    onPointerDown: v
+    overlayStyle: R,
+    onPointerDown: b
   };
 }
 export {
-  A as FILE_BROWSER_MARQUEE_OVERLAY_CLASS,
-  D as createFileBrowserMarqueeSelection,
-  C as projectViewportRectToOverlayHost
+  _ as FILE_BROWSER_MARQUEE_OVERLAY_CLASS,
+  A as createFileBrowserMarqueeSelection,
+  B as projectViewportRectToOverlayHost
 };

package/dist/components/workbench/WorkbenchFilterBar.js

@@ -1,26 +1,45 @@
-import { insert as f, createComponent as d, effect as O, setAttribute as P, template as A, Portal as R, setStyleProperty as B, delegateEvents as V } from "solid-js/web";
-import { createSignal as $, onCleanup as G, createMemo as p, For as W, Show as M } from "solid-js";
-import { Motion as S } from "../../node_modules/.pnpm/solid-motionone@1.0.4_solid-js@1.9.11/node_modules/solid-motionone/dist/index.js";
-import { easing as D, duration as L } from "../../utils/animations.js";
-import { Layers as q, Plus as K } from "../icons/index.js";
-import { startHotInteraction as N } from "../../utils/hotInteraction.js";
-import { startPointerSession as U } from "../ui/pointerSession.js";
-import { WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR as H, createWorkbenchEdgeAutoPanController as z, frameFromElement as j } from "./workbenchEdgeAutoPan.js";
-var J = /* @__PURE__ */ A("<button type=button class=workbench-dock__item>"), Q = /* @__PURE__ */ A('<div class=workbench-dock data-floe-canvas-interactive=true><button type=button class=workbench-dock__item aria-label="Show all widgets"></button><span class=workbench-dock__divider aria-hidden=true>'), Z = /* @__PURE__ */ A("<div class=workbench-dock-ghost aria-hidden=true><div class=workbench-dock-ghost__halo></div><div class=workbench-dock-ghost__card><div class=workbench-dock-ghost__icon></div><div class=workbench-dock-ghost__copy><div class=workbench-dock-ghost__title></div><div class=workbench-dock-ghost__hint><span>");
-const F = 5, tt = ".workbench-dock";
-function et(t, s) {
-  const l = document.querySelector(H);
-  if (!(l instanceof HTMLElement)) return !1;
-  const c = l.getBoundingClientRect();
-  return t >= c.left && t <= c.right && s >= c.top && s <= c.bottom;
+import { insert as _, createComponent as d, effect as M, setAttribute as I, template as X, Portal as K, setStyleProperty as N, delegateEvents as U } from "solid-js/web";
+import { createSignal as R, onCleanup as q, createMemo as z, For as j, Show as x } from "solid-js";
+import { Motion as D } from "../../node_modules/.pnpm/solid-motionone@1.0.4_solid-js@1.9.11/node_modules/solid-motionone/dist/index.js";
+import { easing as L, duration as P } from "../../utils/animations.js";
+import { Layers as J, Plus as Q } from "../icons/index.js";
+import { startHotInteraction as Z } from "../../utils/hotInteraction.js";
+import { startPointerSession as tt } from "../ui/pointerSession.js";
+import { WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR as B, createWorkbenchEdgeAutoPanController as et, frameFromElement as nt } from "./workbenchEdgeAutoPan.js";
+var ot = /* @__PURE__ */ X("<button type=button class=workbench-dock__item>"), rt = /* @__PURE__ */ X('<div class=workbench-dock data-floe-canvas-interactive=true><button type=button class=workbench-dock__item aria-label="Show all widgets"></button><span class=workbench-dock__divider aria-hidden=true>'), it = /* @__PURE__ */ X("<div class=workbench-dock-ghost aria-hidden=true><div class=workbench-dock-ghost__halo></div><div class=workbench-dock-ghost__card><div class=workbench-dock-ghost__icon></div><div class=workbench-dock-ghost__copy><div class=workbench-dock-ghost__title></div><div class=workbench-dock-ghost__hint><span>");
+const H = 5, at = ".workbench-dock";
+function V() {
+  const t = document.querySelector(B);
+  return t instanceof HTMLElement ? t.getBoundingClientRect() : null;
 }
-function nt(t, s) {
+function A(t, a, r) {
+  return t >= r.left && t <= r.right && a >= r.top && a <= r.bottom;
+}
+function lt(t, a) {
+  const r = V();
+  return r ? A(t, a, r) : !1;
+}
+function st(t, a, r, u) {
+  const o = V();
+  if (!o) return !1;
+  if (A(t, a, o) || A(r, u, o))
+    return !0;
+  const n = r - t, c = u - a;
+  let v = 0, g = 1;
+  const f = (h, E) => {
+    if (h === 0) return E >= 0;
+    const m = E / h;
+    return h < 0 ? m > g ? !1 : (m > v && (v = m), !0) : m < v ? !1 : (m < g && (g = m), !0);
+  };
+  return f(-n, t - o.left) && f(n, o.right - t) && f(-c, a - o.top) && f(c, o.bottom - a);
+}
+function T(t, a) {
   if (typeof document.elementFromPoint != "function") return !1;
-  const l = document.elementFromPoint(t, s);
-  return l instanceof Element && l.closest(tt) !== null;
+  const r = document.elementFromPoint(t, a);
+  return r instanceof Element && r.closest(at) !== null;
 }
-function ot(t) {
-  const s = () => t.hoverOffset === -1 ? {
+function ct(t) {
+  const a = () => t.hoverOffset === -1 ? {
     scale: 1.26,
     y: -6,
     x: 0
@@ -36,20 +55,20 @@ function ot(t) {
     scale: 1,
     y: 0,
     x: 0
-  }, l = () => t.hoverOffset === -1, c = (i) => {
-    i.button === 0 && t.onDragBegin(i, t.type, t.label, t.icon);
+  }, r = () => t.hoverOffset === -1, u = (o) => {
+    o.button === 0 && t.onDragBegin(o, t.type, t.label, t.icon);
   };
   return (() => {
-    var i = J();
-    return i.$$pointerdown = c, i.addEventListener("pointerleave", () => t.onLeave()), i.addEventListener("pointerenter", () => t.onEnter()), f(i, d(S.span, {
+    var o = ot();
+    return o.$$pointerdown = u, o.addEventListener("pointerleave", () => t.onLeave()), o.addEventListener("pointerenter", () => t.onEnter()), _(o, d(D.span, {
       class: "workbench-dock__tile",
       get animate() {
-        return s();
+        return a();
       },
       get transition() {
         return {
-          duration: L.fast,
-          easing: D.easeOut
+          duration: P.fast,
+          easing: L.easeOut
         };
       },
       get children() {
@@ -60,54 +79,54 @@ function ot(t) {
           });
         })();
       }
-    }), null), f(i, d(S.span, {
+    }), null), _(o, d(D.span, {
       class: "workbench-dock__tooltip",
       get animate() {
         return {
-          opacity: l() ? 1 : 0,
-          y: l() ? -6 : 0
+          opacity: r() ? 1 : 0,
+          y: r() ? -6 : 0
         };
       },
       get transition() {
         return {
-          duration: L.fast,
-          easing: D.easeOut
+          duration: P.fast,
+          easing: L.easeOut
         };
       },
       get children() {
         return t.label;
       }
-    }), null), O((n) => {
-      var u = !!t.active, v = !!l(), h = !!t.isDragging, _ = `${t.label} — click to solo, drag to canvas to create`, b = t.active;
-      return u !== n.e && i.classList.toggle("is-active", n.e = u), v !== n.t && i.classList.toggle("is-hovered", n.t = v), h !== n.a && i.classList.toggle("is-source-dragging", n.a = h), _ !== n.o && P(i, "aria-label", n.o = _), b !== n.i && P(i, "aria-pressed", n.i = b), n;
+    }), null), M((n) => {
+      var c = !!t.active, v = !!r(), g = !!t.isDragging, f = `${t.label} — click to solo, drag to canvas to create`, h = t.active;
+      return c !== n.e && o.classList.toggle("is-active", n.e = c), v !== n.t && o.classList.toggle("is-hovered", n.t = v), g !== n.a && o.classList.toggle("is-source-dragging", n.a = g), f !== n.o && I(o, "aria-label", n.o = f), h !== n.i && I(o, "aria-pressed", n.i = h), n;
     }, {
       e: void 0,
       t: void 0,
       a: void 0,
       o: void 0,
       i: void 0
-    }), i;
+    }), o;
   })();
 }
-function gt(t) {
-  const [s, l] = $(null), [c, i] = $(null);
-  let n, u, v = null;
-  G(() => {
-    u?.stop(), n?.stop({
+function _t(t) {
+  const [a, r] = R(null), [u, o] = R(null);
+  let n, c, v = null;
+  q(() => {
+    c?.stop(), n?.stop({
       reason: "manual_stop",
       commit: !1
-    }), n = void 0, c()?.stopInteraction();
+    }), n = void 0, u()?.stopInteraction();
   });
-  const h = p(() => t.widgetDefinitions.every((e) => t.filters[e.type])), _ = (e) => {
-    const o = s();
-    return o === null ? 0 : o === e ? -1 : o === e + 1 ? -2 : o === e - 1 ? 1 : 0;
-  }, b = () => {
-    u?.stop(), u = void 0, v = null;
+  const g = z(() => t.widgetDefinitions.every((e) => t.filters[e.type])), f = (e) => {
+    const i = a();
+    return i === null ? 0 : i === e ? -1 : i === e + 1 ? -2 : i === e - 1 ? 1 : 0;
+  }, h = () => {
+    c?.stop(), c = void 0, v = null;
   }, E = () => {
-    !t.viewport || !t.onViewportCommit || (v = t.viewport, u?.stop(), u = z({
+    !t.viewport || !t.onViewportCommit || (v = t.viewport, c?.stop(), c = et({
       readFrame: () => {
-        const e = document.querySelector(H);
-        return e instanceof HTMLElement ? j(e) : null;
+        const e = document.querySelector(B);
+        return e instanceof HTMLElement ? nt(e) : null;
       },
       readViewport: () => v ?? t.viewport ?? null,
       commitViewport: (e) => {
@@ -115,26 +134,26 @@ function gt(t) {
       },
       onPanStart: () => t.onViewportInteractionStart?.("pan"),
       shouldPan: () => {
-        const e = c();
-        return !!(e?.moved && e.overCanvas);
+        const e = u();
+        return !!(e?.moved && e.hasEnteredCanvas && !T(e.clientX, e.clientY));
       }
     }));
-  }, y = (e) => {
-    const o = c();
-    if (!o) return;
-    const r = !o.moved;
-    if (o.stopInteraction(), b(), i(null), n = void 0, r) {
-      t.onSoloFilter(o.type);
+  }, m = (e) => {
+    const i = u();
+    if (!i) return;
+    const l = !i.moved;
+    if (i.stopInteraction(), h(), o(null), n = void 0, l) {
+      t.onSoloFilter(i.type);
       return;
     }
-    e && o.overCanvas && t.onCreateAt?.(o.type, o.clientX, o.clientY);
-  }, g = (e, o, r, C) => {
+    e && i.overCanvas && t.onCreateAt?.(i.type, i.clientX, i.clientY);
+  }, k = (e, i, l, C) => {
     e.preventDefault(), n?.stop({
       reason: "manual_stop",
       commit: !1
-    }), E(), i({
-      type: o,
-      label: r,
+    }), E(), o({
+      type: i,
+      label: l,
       icon: C,
       pointerId: e.pointerId,
       startClientX: e.clientX,
@@ -143,144 +162,146 @@ function gt(t) {
       clientY: e.clientY,
       moved: !1,
       overCanvas: !1,
-      stopInteraction: N({
+      hasEnteredCanvas: !1,
+      stopInteraction: Z({
         kind: "drag",
         cursor: "grabbing"
       })
     });
-    const m = (a) => {
-      let I = !1;
-      i((k) => {
-        if (!k || k.pointerId !== a.pointerId) return k;
-        const T = a.clientX - k.startClientX, x = a.clientY - k.startClientY, X = k.moved || Math.abs(T) > F || Math.abs(x) > F, Y = X && et(a.clientX, a.clientY) && !nt(a.clientX, a.clientY);
-        return I = Y, {
-          ...k,
-          clientX: a.clientX,
-          clientY: a.clientY,
-          moved: X,
-          overCanvas: Y
+    const w = (s) => {
+      let F = !1;
+      o((b) => {
+        if (!b || b.pointerId !== s.pointerId) return b;
+        const G = s.clientX - b.startClientX, p = s.clientY - b.startClientY, S = b.moved || Math.abs(G) > H || Math.abs(p) > H, O = T(s.clientX, s.clientY), Y = S && lt(s.clientX, s.clientY) && !O, W = S && !O && st(b.clientX, b.clientY, s.clientX, s.clientY), $ = b.hasEnteredCanvas || Y || W;
+        return F = S && $ && !O, {
+          ...b,
+          clientX: s.clientX,
+          clientY: s.clientY,
+          moved: S,
+          overCanvas: Y,
+          hasEnteredCanvas: $
         };
-      }), I && u?.updatePointer(a.clientX, a.clientY);
+      }), F && c?.updatePointer(s.clientX, s.clientY);
     };
-    n = U({
+    n = tt({
       pointerEvent: e,
       captureEl: e.currentTarget,
-      onMove: m,
+      onMove: w,
       onEnd: ({
-        commit: a
-      }) => y(a)
+        commit: s
+      }) => m(s)
     });
-  }, w = () => c()?.type ?? null;
+  }, y = () => u()?.type ?? null;
   return [(() => {
-    var e = Q(), o = e.firstChild;
-    return o.nextSibling, e.addEventListener("pointerleave", () => l(null)), o.$$click = () => t.onShowAll(), o.addEventListener("pointerleave", () => l((r) => r === 0 ? null : r)), o.addEventListener("pointerenter", () => l(0)), f(o, d(S.span, {
+    var e = rt(), i = e.firstChild;
+    return i.nextSibling, e.addEventListener("pointerleave", () => r(null)), i.$$click = () => t.onShowAll(), i.addEventListener("pointerleave", () => r((l) => l === 0 ? null : l)), i.addEventListener("pointerenter", () => r(0)), _(i, d(D.span, {
       class: "workbench-dock__tile",
       get animate() {
         return {
-          scale: s() === 0 ? 1.26 : 1,
-          y: s() === 0 ? -6 : 0,
-          x: s() === 1 ? -5 : 0
+          scale: a() === 0 ? 1.26 : 1,
+          y: a() === 0 ? -6 : 0,
+          x: a() === 1 ? -5 : 0
         };
       },
       get transition() {
         return {
-          duration: L.fast,
-          easing: D.easeOut
+          duration: P.fast,
+          easing: L.easeOut
         };
       },
       get children() {
-        return d(q, {
+        return d(J, {
           class: "workbench-dock__icon"
         });
       }
-    }), null), f(o, d(S.span, {
+    }), null), _(i, d(D.span, {
       class: "workbench-dock__tooltip",
       get animate() {
         return {
-          opacity: s() === 0 ? 1 : 0,
-          y: s() === 0 ? -6 : 0
+          opacity: a() === 0 ? 1 : 0,
+          y: a() === 0 ? -6 : 0
         };
       },
       get transition() {
         return {
-          duration: L.fast,
-          easing: D.easeOut
+          duration: P.fast,
+          easing: L.easeOut
         };
       },
       children: "Show all widgets"
-    }), null), f(e, d(W, {
+    }), null), _(e, d(j, {
       get each() {
         return t.widgetDefinitions;
       },
-      children: (r, C) => {
-        const m = () => C() + 1;
-        return d(ot, {
+      children: (l, C) => {
+        const w = () => C() + 1;
+        return d(ct, {
           get type() {
-            return r.type;
+            return l.type;
           },
           get label() {
-            return r.label;
+            return l.label;
           },
           get icon() {
-            return r.icon;
+            return l.icon;
           },
           get active() {
-            return t.filters[r.type];
+            return t.filters[l.type];
           },
           get hoverOffset() {
-            return _(m());
+            return f(w());
           },
           get isDragging() {
-            return w() === r.type;
+            return y() === l.type;
           },
-          onEnter: () => l(m()),
-          onLeave: () => l((a) => a === m() ? null : a),
-          onSolo: () => t.onSoloFilter(r.type),
-          onDragBegin: g
+          onEnter: () => r(w()),
+          onLeave: () => r((s) => s === w() ? null : s),
+          onSolo: () => t.onSoloFilter(l.type),
+          onDragBegin: k
         });
       }
-    }), null), O((r) => {
-      var C = !!h(), m = s() === 0, a = h();
-      return C !== r.e && o.classList.toggle("is-active", r.e = C), m !== r.t && o.classList.toggle("is-hovered", r.t = m), a !== r.a && P(o, "aria-pressed", r.a = a), r;
+    }), null), M((l) => {
+      var C = !!g(), w = a() === 0, s = g();
+      return C !== l.e && i.classList.toggle("is-active", l.e = C), w !== l.t && i.classList.toggle("is-hovered", l.t = w), s !== l.a && I(i, "aria-pressed", l.a = s), l;
     }, {
       e: void 0,
       t: void 0,
       a: void 0
     }), e;
-  })(), d(M, {
+  })(), d(x, {
     get when() {
-      return c()?.moved ?? !1;
+      return u()?.moved ?? !1;
     },
     get children() {
-      return d(rt, {
-        state: c
+      return d(dt, {
+        state: u
       });
     }
   })];
 }
-function rt(t) {
-  const s = () => {
+function dt(t) {
+  const a = () => {
     const n = t.state();
     return n ? `translate3d(${n.clientX + 14}px, ${n.clientY - 56}px, 0)` : "translate3d(0px, 0px, 0)";
-  }, l = () => t.state()?.overCanvas ?? !1, c = () => t.state()?.label ?? "", i = () => t.state()?.icon;
-  return d(R, {
+  }, r = () => t.state()?.overCanvas ?? !1, u = () => t.state()?.label ?? "", o = () => t.state()?.icon;
+  return d(K, {
     get children() {
-      var n = Z(), u = n.firstChild, v = u.nextSibling, h = v.firstChild, _ = h.nextSibling, b = _.firstChild, E = b.nextSibling, y = E.firstChild;
-      return f(h, d(M, {
+      var n = it(), c = n.firstChild, v = c.nextSibling, g = v.firstChild, f = g.nextSibling, h = f.firstChild, E = h.nextSibling, m = E.firstChild;
+      return _(g, d(x, {
         get when() {
-          return i();
+          return o();
         },
-        children: (g) => {
-          const w = g();
-          return d(w, {
+        children: (k) => {
+          const y = k();
+          return d(y, {
             class: "w-4 h-4"
           });
         }
-      })), f(b, c), f(E, d(K, {
+      })), _(h, u), _(E, d(Q, {
         class: "w-3 h-3"
-      }), y), f(y, () => l() ? "Drop to create" : "Drag onto canvas"), O((g) => {
-        var w = !!l(), e = s();
-        return w !== g.e && n.classList.toggle("is-over-canvas", g.e = w), e !== g.t && B(n, "transform", g.t = e), g;
+      }), m), _(m, () => r() ? "Drop to create" : "Drag onto canvas"), M((k) => {
+        var y = !!r(), e = a();
+        return y !== k.e && n.classList.toggle("is-over-canvas", k.e = y), e !== k.t && N(n, "transform", k.t = e), k;
       }, {
         e: void 0,
         t: void 0
@@ -288,7 +309,7 @@ function rt(t) {
     }
   });
 }
-V(["pointerdown", "click"]);
+U(["pointerdown", "click"]);
 export {
-  gt as WorkbenchFilterBar
+  _t as WorkbenchFilterBar
 };

package/dist/components/workbench/workbenchEdgeAutoPan.d.ts

@@ -13,6 +13,10 @@ export interface WorkbenchEdgeAutoPanVelocityOptions {
     clientX: number;
     clientY: number;
     thresholdPx?: number;
+    /**
+     * Deprecated: edge auto-pan intentionally keeps moving after the pointer leaves
+     * the frame during an active drag.
+     */
     outsideTolerancePx?: number;
     maxSpeedPxPerSecond?: number;
 }
@@ -35,6 +39,10 @@ export interface WorkbenchEdgeAutoPanControllerOptions {
     onPanStart?: () => void;
     shouldPan?: () => boolean;
     thresholdPx?: number;
+    /**
+     * Deprecated: edge auto-pan intentionally keeps moving after the pointer leaves
+     * the frame during an active drag.
+     */
     outsideTolerancePx?: number;
     activationDelayMs?: number;
     maxSpeedPxPerSecond?: number;

package/dist/components/workbench/workbenchEdgeAutoPan.js

@@ -1,34 +1,31 @@
-const N = '[data-floe-workbench-canvas-frame="true"]';
-function c(e, t) {
+const x = '[data-floe-workbench-canvas-frame="true"]';
+function u(e, t) {
   return Number.isFinite(e) && Number(e) > 0 ? Number(e) : t;
 }
-function F(e) {
-  const { frame: t, clientX: i, clientY: r, outsideTolerancePx: n } = e;
-  return i >= t.left - n && i <= t.right + n && r >= t.top - n && r <= t.bottom + n;
+function w(e) {
+  const t = Math.max(0, Math.min(1, e));
+  return t * t * (3 - 2 * t);
 }
-function P(e, t) {
-  const i = (t - Math.max(0, e)) / t, r = Math.max(0, Math.min(1, i));
-  return r * r;
+function h(e, t) {
+  if (e >= t) return 0;
+  if (e >= 0) {
+    const i = (t - e) / t * 0.78;
+    return w(i);
+  }
+  const r = Math.max(96, t), n = Math.min(1, Math.abs(e) / r);
+  return w(0.78 + n * 0.22);
 }
-function X(e) {
-  const t = c(e.thresholdPx, 36), i = Math.max(0, c(
-    e.outsideTolerancePx,
-    10
-  )), r = c(
+function p(e) {
+  const t = u(e.thresholdPx, 72), r = u(
     e.maxSpeedPxPerSecond,
-    480
+    680
   ), n = e.frame;
-  if (!Number.isFinite(n.width) || n.width <= 0 || !Number.isFinite(n.height) || n.height <= 0 || !F({
-    frame: n,
-    clientX: e.clientX,
-    clientY: e.clientY,
-    outsideTolerancePx: i
-  }))
+  if (!Number.isFinite(n.width) || n.width <= 0 || !Number.isFinite(n.height) || n.height <= 0)
     return { viewportVelocityX: 0, viewportVelocityY: 0 };
-  const l = r / 1e3, E = P(e.clientX - n.left, t), f = P(n.right - e.clientX, t), A = P(e.clientY - n.top, t), D = P(n.bottom - e.clientY, t);
+  const i = r / 1e3, l = h(e.clientX - n.left, t), s = h(n.right - e.clientX, t), A = h(e.clientY - n.top, t), D = h(n.bottom - e.clientY, t);
   return {
-    viewportVelocityX: (E - f) * l,
-    viewportVelocityY: (A - D) * l
+    viewportVelocityX: (l - s) * i,
+    viewportVelocityY: (A - D) * i
   };
 }
 function y(e) {
@@ -42,93 +39,89 @@ function y(e) {
     height: t.height
   } : null;
 }
-function L(e) {
+function X(e) {
   return typeof window > "u" || typeof window.requestAnimationFrame != "function" ? null : window.requestAnimationFrame(e);
 }
-function p(e) {
+function L(e) {
   e === null || typeof window > "u" || typeof window.cancelAnimationFrame != "function" || window.cancelAnimationFrame(e);
 }
 function b(e) {
-  let t = null, i = null, r = null, n = null, l = !1, E = !1;
-  const f = () => c(e.thresholdPx, 36), A = () => Math.max(0, c(
-    e.outsideTolerancePx,
-    10
-  )), D = () => Math.max(0, c(
+  let t = null, r = null, n = null, i = null, l = !1, s = !1;
+  const A = () => u(e.thresholdPx, 72), D = () => Math.max(0, u(
     e.activationDelayMs,
-    100
-  )), M = () => c(
+    45
+  )), F = () => u(
     e.maxSpeedPxPerSecond,
-    480
-  ), s = () => {
-    n = null, r = null;
-  }, a = () => {
-    l || i !== null || !t || (i = L(w));
-  }, w = (o) => {
-    if (i = null, l || !t) return;
+    680
+  ), E = () => {
+    i = null, n = null;
+  }, c = () => {
+    l || r !== null || !t || (r = X(T));
+  }, T = (o) => {
+    if (r = null, l || !t) return;
     if (e.shouldPan && !e.shouldPan()) {
-      s();
+      E();
       return;
     }
-    const d = e.readFrame(), u = e.readViewport();
-    if (!d || !u) {
-      s();
+    const _ = e.readFrame(), a = e.readViewport();
+    if (!_ || !a) {
+      E();
       return;
     }
-    const _ = X({
-      frame: d,
+    const m = p({
+      frame: _,
       clientX: t.clientX,
       clientY: t.clientY,
-      thresholdPx: f(),
-      outsideTolerancePx: A(),
-      maxSpeedPxPerSecond: M()
+      thresholdPx: A(),
+      maxSpeedPxPerSecond: F()
     });
-    if (_.viewportVelocityX === 0 && _.viewportVelocityY === 0) {
-      s();
+    if (m.viewportVelocityX === 0 && m.viewportVelocityY === 0) {
+      E();
       return;
     }
-    if (n === null) {
-      n = o, r = o, a();
+    if (i === null) {
+      i = o, n = o, c();
       return;
     }
-    if (o - n < D()) {
-      r = o, a();
+    if (o - i < D()) {
+      n = o, c();
       return;
     }
-    const T = Math.max(0, Math.min(48, o - (r ?? o)));
-    if (r = o, T <= 0) {
-      a();
+    const P = Math.max(0, Math.min(48, o - (n ?? o)));
+    if (n = o, P <= 0) {
+      c();
       return;
     }
-    const m = _.viewportVelocityX * T, h = _.viewportVelocityY * T;
-    if (Math.abs(m) < 0.01 && Math.abs(h) < 0.01) {
-      a();
+    const d = m.viewportVelocityX * P, f = m.viewportVelocityY * P;
+    if (Math.abs(d) < 0.01 && Math.abs(f) < 0.01) {
+      c();
       return;
     }
-    const x = Math.max(Math.abs(Number(u.scale)), 1e-3), S = {
-      ...u,
-      x: u.x + m,
-      y: u.y + h
+    const S = Math.max(Math.abs(Number(a.scale)), 1e-3), M = {
+      ...a,
+      x: a.x + d,
+      y: a.y + f
     };
-    E || (E = !0, e.onPanStart?.()), e.commitViewport(S), e.onPan?.({
-      viewportDeltaX: m,
-      viewportDeltaY: h,
-      worldDeltaX: -m / x,
-      worldDeltaY: -h / x,
-      viewport: S
-    }), a();
+    s || (s = !0, e.onPanStart?.()), e.commitViewport(M), e.onPan?.({
+      viewportDeltaX: d,
+      viewportDeltaY: f,
+      worldDeltaX: -d / S,
+      worldDeltaY: -f / S,
+      viewport: M
+    }), c();
   };
   return {
-    updatePointer: (o, d) => {
-      t = { clientX: o, clientY: d }, a();
+    updatePointer: (o, _) => {
+      t = { clientX: o, clientY: _ }, c();
     },
     stop: () => {
-      l = !0, p(i), i = null, t = null, s();
+      l = !0, L(r), r = null, t = null, E();
     }
   };
 }
 export {
-  N as WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR,
+  x as WORKBENCH_EDGE_AUTO_PAN_FRAME_SELECTOR,
   b as createWorkbenchEdgeAutoPanController,
   y as frameFromElement,
-  X as resolveWorkbenchEdgeAutoPanVelocity
+  p as resolveWorkbenchEdgeAutoPanVelocity
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@floegence/floe-webapp-core",
-  "version": "0.36.39",
+  "version": "0.36.41",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",