@forgeax/app-shell 0.41.0 → 0.43.0

package/dist/react.d.ts

@@ -41,6 +41,37 @@ interface ResizeHandleProps {
     ariaLabel?: string;
     title?: string;
 }
+type PointerDragFinishReason = 'pointerup' | 'pointercancel' | 'lostpointercapture' | 'dispose' | 'error';
+interface PointerDragSessionOptions<Session> {
+    readonly element: HTMLElement;
+    readonly begin: (event: globalThis.PointerEvent) => Session | null;
+    readonly move: (session: Session, event: globalThis.PointerEvent) => void;
+    readonly end?: (session: Session, reason: PointerDragFinishReason) => void;
+    readonly preventDefault?: boolean;
+    readonly stopPropagation?: boolean;
+    readonly draggingClassName?: string;
+}
+type ThresholdPointerDragFinishReason = 'pointerup' | 'pointercancel' | 'cancel' | 'dispose' | 'error';
+interface ThresholdPointerDragSessionOptions<Session> {
+    readonly target: Window;
+    readonly pointerId: number;
+    readonly startX: number;
+    readonly startY: number;
+    readonly threshold: number;
+    readonly begin: (event: globalThis.PointerEvent) => Session | null;
+    readonly move: (session: Session, event: globalThis.PointerEvent) => void;
+    readonly end?: (session: Session, reason: ThresholdPointerDragFinishReason) => void;
+    readonly onSettled?: (reason: ThresholdPointerDragFinishReason, started: boolean) => void;
+    readonly registerCancel?: (cancel: () => void) => void | (() => void);
+}
+interface ThresholdPointerDragSession {
+    cancel(): void;
+    dispose(): void;
+}
+/** Own one post-pointerdown threshold arm and its global listener lifecycle. */
+declare function installThresholdPointerDragSession<Session>(options: ThresholdPointerDragSessionOptions<Session>): ThresholdPointerDragSession;
+/** Own one imperative pointer-capture drag session and its balanced teardown. */
+declare function installPointerDragSession<Session>(options: PointerDragSessionOptions<Session>): () => void;
 type AnchoredResizeDirection = 'subtract' | 'add';
 interface AnchoredResizeSession {
     readonly startSize: number;
@@ -202,4 +233,4 @@ interface ShellSlotProps extends HTMLAttributes<HTMLElement> {
 /** Structural shell marker that preserves the caller's semantic element. */
 declare function ShellSlot({ as, name, ...props }: ShellSlotProps): ReactElement;
 
-export { type AnchoredResizeDirection, AnchoredResizeHandle, type AnchoredResizeHandleProps, type AnchoredResizeSession, DetachedPanelBoundary, type DetachedPanelBoundaryProps, DetachedSurfaceFrame, type DetachedSurfaceFrameProps, DetachedSurfaceStatus, type DetachedSurfaceStatusProps, type DetachedSurfaceStatusTone, type DockLayoutControlBinding, type DockLayoutControlBindingOptions, DockLayoutMenu, type DockLayoutMenuPanel, type DockLayoutMenuProps, FloatingMenu, type FloatingMenuAnchor, type FloatingMenuPoint, type FloatingMenuProps, type PanelContentPadding, type PanelContentPolicy, type PanelContentScroll, type PanelContentTone, PanelEmptyState, type PanelEmptyStateProps, PanelSurface, type PanelSurfaceProps, type PersistentSizeStorage, type PersistentSizeStore, type PersistentSizeStoreOptions, type PersistentSizeUpdate, ResizeHandle, type ResizeHandleProps, ShellSlot, type ShellSlotElement, type ShellSlotProps, SlotDebugOverlay, SurfacePlaceholder, type SurfacePlaceholderProps, SurfaceRegion, type SurfaceRegionProps, applyAnchoredResizeDelta, beginAnchoredResize, createPersistentSizeStore, hashSlotHue, isSlotDebugEnabled, useDockLayoutControlBinding, useLocalSize, usePersistentSizeStore };
+export { type AnchoredResizeDirection, AnchoredResizeHandle, type AnchoredResizeHandleProps, type AnchoredResizeSession, DetachedPanelBoundary, type DetachedPanelBoundaryProps, DetachedSurfaceFrame, type DetachedSurfaceFrameProps, DetachedSurfaceStatus, type DetachedSurfaceStatusProps, type DetachedSurfaceStatusTone, type DockLayoutControlBinding, type DockLayoutControlBindingOptions, DockLayoutMenu, type DockLayoutMenuPanel, type DockLayoutMenuProps, FloatingMenu, type FloatingMenuAnchor, type FloatingMenuPoint, type FloatingMenuProps, type PanelContentPadding, type PanelContentPolicy, type PanelContentScroll, type PanelContentTone, PanelEmptyState, type PanelEmptyStateProps, PanelSurface, type PanelSurfaceProps, type PersistentSizeStorage, type PersistentSizeStore, type PersistentSizeStoreOptions, type PersistentSizeUpdate, type PointerDragFinishReason, type PointerDragSessionOptions, ResizeHandle, type ResizeHandleProps, ShellSlot, type ShellSlotElement, type ShellSlotProps, SlotDebugOverlay, SurfacePlaceholder, type SurfacePlaceholderProps, SurfaceRegion, type SurfaceRegionProps, type ThresholdPointerDragFinishReason, type ThresholdPointerDragSession, type ThresholdPointerDragSessionOptions, applyAnchoredResizeDelta, beginAnchoredResize, createPersistentSizeStore, hashSlotHue, installPointerDragSession, installThresholdPointerDragSession, isSlotDebugEnabled, useDockLayoutControlBinding, useLocalSize, usePersistentSizeStore };

package/dist/react.js

@@ -690,13 +690,13 @@ function useLocalSize(key, initial, min, max) {
   };
   return [value, setValue];
 }
-var bodyClassLeases = /* @__PURE__ */ new WeakMap();
-function acquireBodyClassLease(body, tokens) {
+var elementClassLeases = /* @__PURE__ */ new WeakMap();
+function acquireElementClassLease(element, tokens) {
   const uniqueTokens = [...new Set(tokens)];
-  let records = bodyClassLeases.get(body);
+  let records = elementClassLeases.get(element);
   if (!records) {
     records = /* @__PURE__ */ new Map();
-    bodyClassLeases.set(body, records);
+    elementClassLeases.set(element, records);
   }
   for (const token of uniqueTokens) {
     const existing = records.get(token);
@@ -704,8 +704,8 @@ function acquireBodyClassLease(body, tokens) {
       existing.count += 1;
       continue;
     }
-    const owned = !body.classList.contains(token);
-    if (owned) body.classList.add(token);
+    const owned = !element.classList.contains(token);
+    if (owned) element.classList.add(token);
     records.set(token, { count: 1, owned });
   }
   let active = true;
@@ -718,9 +718,208 @@ function acquireBodyClassLease(body, tokens) {
       record.count -= 1;
       if (record.count > 0) continue;
       records?.delete(token);
-      if (record.owned) body.classList.remove(token);
+      if (record.owned) element.classList.remove(token);
     }
-    if (records?.size === 0) bodyClassLeases.delete(body);
+    if (records?.size === 0) elementClassLeases.delete(element);
+  };
+}
+function installThresholdPointerDragSession(options) {
+  const threshold = Number.isFinite(options.threshold) ? Math.max(0, options.threshold) : 0;
+  let disposed = false;
+  let settled = false;
+  let settledReason = null;
+  let starting = false;
+  let active = null;
+  let unregisterCancel = null;
+  const removeListeners = () => {
+    options.target.removeEventListener("pointermove", onPointerMove, true);
+    options.target.removeEventListener("pointerup", onPointerFinish, true);
+    options.target.removeEventListener("pointercancel", onPointerFinish, true);
+  };
+  const releaseCancelRegistration = () => {
+    const unregister = unregisterCancel;
+    unregisterCancel = null;
+    try {
+      unregister?.();
+    } catch {
+    }
+  };
+  const settle = (reason) => {
+    if (settled) return;
+    settled = true;
+    settledReason = reason;
+    removeListeners();
+    releaseCancelRegistration();
+    const current = active;
+    active = null;
+    if (current !== null) {
+      try {
+        options.end?.(current, reason);
+      } catch {
+      }
+    }
+    try {
+      options.onSettled?.(reason, current !== null);
+    } catch {
+    }
+  };
+  function onPointerMove(event) {
+    if (settled || event.pointerId !== options.pointerId) return;
+    if (active === null) {
+      if (starting) return;
+      if (Math.hypot(event.clientX - options.startX, event.clientY - options.startY) < threshold) return;
+      starting = true;
+      let candidate;
+      try {
+        candidate = options.begin(event);
+      } catch {
+        starting = false;
+        settle("error");
+        return;
+      }
+      starting = false;
+      if (candidate === null) {
+        settle("cancel");
+        return;
+      }
+      if (settled) {
+        try {
+          options.end?.(candidate, settledReason ?? "dispose");
+        } catch {
+        }
+        return;
+      }
+      active = candidate;
+    }
+    const current = active;
+    if (current === null) return;
+    try {
+      options.move(current, event);
+    } catch {
+      settle("error");
+    }
+  }
+  function onPointerFinish(event) {
+    if (settled || event.pointerId !== options.pointerId) return;
+    settle(event.type === "pointercancel" ? "pointercancel" : "pointerup");
+  }
+  options.target.addEventListener("pointermove", onPointerMove, true);
+  options.target.addEventListener("pointerup", onPointerFinish, true);
+  options.target.addEventListener("pointercancel", onPointerFinish, true);
+  if (options.registerCancel) {
+    let registered;
+    try {
+      registered = options.registerCancel(() => settle("cancel"));
+    } catch {
+      settle("error");
+      registered = void 0;
+    }
+    if (registered) {
+      if (settled) {
+        try {
+          registered();
+        } catch {
+        }
+      } else {
+        unregisterCancel = registered;
+      }
+    }
+  }
+  return {
+    cancel: () => settle("cancel"),
+    dispose: () => {
+      if (disposed) return;
+      disposed = true;
+      settle("dispose");
+    }
+  };
+}
+function installPointerDragSession(options) {
+  const { element } = options;
+  let disposed = false;
+  let starting = false;
+  let active = null;
+  const removeSessionListeners = () => {
+    element.removeEventListener("pointermove", onPointerMove);
+    element.removeEventListener("pointerup", onPointerFinish);
+    element.removeEventListener("pointercancel", onPointerFinish);
+    element.removeEventListener("lostpointercapture", onPointerFinish);
+  };
+  const finish = (reason) => {
+    const current = active;
+    if (!current) return;
+    active = null;
+    removeSessionListeners();
+    try {
+      element.releasePointerCapture(current.pointerId);
+    } catch {
+    }
+    try {
+      current.releaseClass();
+    } catch {
+    }
+    try {
+      options.end?.(current.session, reason);
+    } catch {
+    }
+  };
+  function onPointerMove(event) {
+    const current = active;
+    if (!current || current.pointerId !== event.pointerId) return;
+    try {
+      options.move(current.session, event);
+    } catch {
+      finish("error");
+    }
+  }
+  function onPointerFinish(event) {
+    if (!active || active.pointerId !== event.pointerId) return;
+    const reason = event.type === "pointercancel" ? "pointercancel" : event.type === "lostpointercapture" ? "lostpointercapture" : "pointerup";
+    finish(reason);
+  }
+  const onPointerDown = (event) => {
+    if (disposed || active || starting) return;
+    starting = true;
+    let session;
+    try {
+      session = options.begin(event);
+    } catch {
+      starting = false;
+      return;
+    }
+    starting = false;
+    if (session === null) return;
+    if (disposed) {
+      try {
+        options.end?.(session, "dispose");
+      } catch {
+      }
+      return;
+    }
+    if (options.preventDefault) event.preventDefault();
+    if (options.stopPropagation) event.stopPropagation();
+    const classTokens = options.draggingClassName?.trim().split(/\s+/).filter(Boolean) ?? [];
+    active = {
+      pointerId: event.pointerId,
+      session,
+      releaseClass: acquireElementClassLease(element, classTokens)
+    };
+    element.addEventListener("pointermove", onPointerMove);
+    element.addEventListener("pointerup", onPointerFinish);
+    element.addEventListener("pointercancel", onPointerFinish);
+    element.addEventListener("lostpointercapture", onPointerFinish);
+    try {
+      element.setPointerCapture(event.pointerId);
+    } catch {
+      finish("error");
+    }
+  };
+  element.addEventListener("pointerdown", onPointerDown);
+  return () => {
+    if (disposed) return;
+    disposed = true;
+    element.removeEventListener("pointerdown", onPointerDown);
+    finish("dispose");
   };
 }
 function beginAnchoredResize(startSize, direction = "subtract") {
@@ -845,7 +1044,7 @@ function AnchoredResizeHandle({
     finishSession();
     const bodyClassTokens = bodyClassNameRef.current?.trim().split(/\s+/).filter(Boolean) ?? [];
     const resize = beginAnchoredResize(readSizeRef.current(), directionRef.current);
-    const releaseBodyClass = typeof document !== "undefined" && bodyClassTokens.length > 0 ? acquireBodyClassLease(document.body, bodyClassTokens) : () => {
+    const releaseBodyClass = typeof document !== "undefined" && bodyClassTokens.length > 0 ? acquireElementClassLease(document.body, bodyClassTokens) : () => {
     };
     sessionRef.current = {
       resize,
@@ -1235,6 +1434,8 @@ export {
   beginAnchoredResize,
   createPersistentSizeStore,
   hashSlotHue,
+  installPointerDragSession,
+  installThresholdPointerDragSession,
   isSlotDebugEnabled,
   useDockLayoutControlBinding,
   useLocalSize,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forgeax/app-shell",
-  "version": "0.41.0",
+  "version": "0.43.0",
   "description": "Generic Dock, Panel, Window, and Slot composition primitives",
   "license": "Apache-2.0",
   "type": "module",