@runfusion/fusion 0.24.0 → 0.25.0

package/dist/plugins/fusion-plugin-dependency-graph/src/styles/drag.css

@@ -1,15 +0,0 @@
-.graph-node--draggable {
-  cursor: grab;
-  touch-action: none;
-}
-
-.graph-node--dragging {
-  z-index: 3;
-  cursor: grabbing;
-  box-shadow: var(--shadow-lg);
-  transform: scale(1.02);
-  transition:
-    transform var(--transition-fast),
-    box-shadow var(--transition-fast),
-    z-index var(--transition-fast);
-}

package/dist/plugins/fusion-plugin-dependency-graph/src/types.ts

@@ -1,21 +0,0 @@
-import type { Task } from "@fusion/core";
-
-export interface GraphPosition {
-  x: number;
-  y: number;
-}
-
-export interface GraphNode {
-  task: Task;
-  position?: GraphPosition;
-}
-
-export interface GraphEdge {
-  source: string;
-  target: string;
-}
-
-export interface GraphData {
-  nodes: GraphNode[];
-  edges: GraphEdge[];
-}

package/dist/plugins/fusion-plugin-dependency-graph/src/useGraphData.ts

@@ -1,17 +0,0 @@
-import { useMemo } from "react";
-import type { Task } from "@fusion/core";
-import type { GraphData, GraphNode } from "./types";
-
-export function useGraphData(tasks: Task[]): GraphData {
-  return useMemo(() => {
-    const nodes: GraphNode[] = tasks.map((task) => ({ task }));
-    const taskIds = new Set(tasks.map((task) => task.id));
-    const edges = tasks.flatMap((task) =>
-      (task.dependencies ?? [])
-        .filter((dependencyId) => taskIds.has(dependencyId))
-        .map((dependencyId) => ({ source: task.id, target: dependencyId })),
-    );
-
-    return { nodes, edges };
-  }, [tasks]);
-}

package/dist/plugins/fusion-plugin-dependency-graph/src/useGraphInteraction.ts

@@ -1,292 +0,0 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import type { KeyboardEvent as ReactKeyboardEvent } from "react";
-import type { LayoutOptions } from "./layout";
-import type { GraphPosition } from "./types";
-
-const MIN_ZOOM = 0.1;
-const MAX_ZOOM = 3;
-const FIT_PADDING = 40;
-const TRANSITION_TIMEOUT_MS = 200;
-
-interface PointerPoint {
-  x: number;
-  y: number;
-}
-
-interface PinchState {
-  distance: number;
-  zoom: number;
-  pan: PointerPoint;
-  midpoint: PointerPoint;
-}
-
-function clamp(value: number, min: number, max: number): number {
-  return Math.min(max, Math.max(min, value));
-}
-
-function isEditableTarget(target: EventTarget | null): boolean {
-  if (!(target instanceof HTMLElement)) return false;
-  const tagName = target.tagName.toLowerCase();
-  return target.isContentEditable || tagName === "input" || tagName === "textarea" || tagName === "select";
-}
-
-export function useGraphInteraction() {
-  const [pan, setPan] = useState<PointerPoint>({ x: 0, y: 0 });
-  const [zoom, setZoom] = useState(1);
-  const [transitioning, setTransitioning] = useState(false);
-
-  const panRef = useRef(pan);
-  const zoomRef = useRef(zoom);
-  const transitionTimerRef = useRef<number | null>(null);
-  const dragStateRef = useRef<{ start: PointerPoint; panStart: PointerPoint } | null>(null);
-  const pointersRef = useRef<Map<number, PointerPoint>>(new Map());
-  const pinchRef = useRef<PinchState | null>(null);
-
-  useEffect(() => {
-    panRef.current = pan;
-  }, [pan]);
-
-  useEffect(() => {
-    zoomRef.current = zoom;
-  }, [zoom]);
-
-  useEffect(() => () => {
-    if (transitionTimerRef.current !== null) {
-      window.clearTimeout(transitionTimerRef.current);
-    }
-  }, []);
-
-  const transform = useMemo(() => `translate(${pan.x}px, ${pan.y}px) scale(${zoom})`, [pan.x, pan.y, zoom]);
-  const zoomPercent = useMemo(() => Math.round(zoom * 100), [zoom]);
-
-  const setAnimate = useCallback((enabled: boolean) => {
-    if (!enabled) {
-      if (transitionTimerRef.current !== null) {
-        window.clearTimeout(transitionTimerRef.current);
-        transitionTimerRef.current = null;
-      }
-      setTransitioning(false);
-      return;
-    }
-
-    setTransitioning(true);
-    if (transitionTimerRef.current !== null) {
-      window.clearTimeout(transitionTimerRef.current);
-    }
-    transitionTimerRef.current = window.setTimeout(() => {
-      setTransitioning(false);
-      transitionTimerRef.current = null;
-    }, TRANSITION_TIMEOUT_MS);
-  }, []);
-
-  const clampPan = useCallback((nextPan: PointerPoint, viewportWidth: number, viewportHeight: number) => ({
-    x: clamp(nextPan.x, -viewportWidth, viewportWidth),
-    y: clamp(nextPan.y, -viewportHeight, viewportHeight),
-  }), []);
-
-  const zoomAtPoint = useCallback((
-    nextZoomRaw: number,
-    anchor: PointerPoint,
-    viewportWidth: number,
-    viewportHeight: number,
-  ) => {
-    const currentZoom = zoomRef.current;
-    const currentPan = panRef.current;
-    const nextZoom = clamp(nextZoomRaw, MIN_ZOOM, MAX_ZOOM);
-    const scaleRatio = nextZoom / currentZoom;
-
-    const nextPan = clampPan({
-      x: anchor.x - (anchor.x - currentPan.x) * scaleRatio,
-      y: anchor.y - (anchor.y - currentPan.y) * scaleRatio,
-    }, viewportWidth, viewportHeight);
-
-    setZoom(nextZoom);
-    setPan(nextPan);
-  }, [clampPan]);
-
-  const zoomByFactor = useCallback((factor: number, viewportWidth: number, viewportHeight: number, anchor?: PointerPoint) => {
-    setAnimate(false);
-    const point = anchor ?? { x: viewportWidth / 2, y: viewportHeight / 2 };
-    zoomAtPoint(zoomRef.current * factor, point, viewportWidth, viewportHeight);
-  }, [setAnimate, zoomAtPoint]);
-
-  const zoomIn = useCallback((viewportWidth?: number, viewportHeight?: number) => {
-    if (viewportWidth && viewportHeight) {
-      zoomByFactor(1.2, viewportWidth, viewportHeight);
-      return;
-    }
-    setZoom((current) => clamp(current + 0.1, MIN_ZOOM, MAX_ZOOM));
-  }, [zoomByFactor]);
-
-  const zoomOut = useCallback((viewportWidth?: number, viewportHeight?: number) => {
-    if (viewportWidth && viewportHeight) {
-      zoomByFactor(1 / 1.2, viewportWidth, viewportHeight);
-      return;
-    }
-    setZoom((current) => clamp(current - 0.1, MIN_ZOOM, MAX_ZOOM));
-  }, [zoomByFactor]);
-
-  const resetView = useCallback(() => {
-    setAnimate(true);
-    setPan({ x: 0, y: 0 });
-    setZoom(1);
-  }, [setAnimate]);
-
-  const fitToGraph = useCallback((
-    positions: Map<string, GraphPosition>,
-    viewportWidth: number,
-    viewportHeight: number,
-    layoutOptions?: LayoutOptions,
-  ) => {
-    setAnimate(true);
-    if (positions.size === 0) {
-      setPan({ x: 0, y: 0 });
-      setZoom(1);
-      return;
-    }
-
-    const nodeWidth = layoutOptions?.nodeWidth ?? 280;
-    const nodeHeight = layoutOptions?.nodeHeight ?? 100;
-
-    const entries = Array.from(positions.values());
-    const minX = Math.min(...entries.map((p) => p.x));
-    const minY = Math.min(...entries.map((p) => p.y));
-    const maxX = Math.max(...entries.map((p) => p.x + nodeWidth));
-    const maxY = Math.max(...entries.map((p) => p.y + nodeHeight));
-
-    const graphWidth = Math.max(1, maxX - minX);
-    const graphHeight = Math.max(1, maxY - minY);
-    const availableWidth = Math.max(1, viewportWidth - FIT_PADDING * 2);
-    const availableHeight = Math.max(1, viewportHeight - FIT_PADDING * 2);
-    const nextZoom = clamp(Math.min(availableWidth / graphWidth, availableHeight / graphHeight), MIN_ZOOM, MAX_ZOOM);
-
-    const panX = (viewportWidth - graphWidth * nextZoom) / 2 - minX * nextZoom;
-    const panY = (viewportHeight - graphHeight * nextZoom) / 2 - minY * nextZoom;
-
-    setZoom(nextZoom);
-    setPan(clampPan({ x: panX, y: panY }, viewportWidth, viewportHeight));
-  }, [clampPan, setAnimate]);
-
-  const onPointerDown = useCallback((pointerId: number, point: PointerPoint) => {
-    pointersRef.current.set(pointerId, point);
-    if (pointersRef.current.size === 2) {
-      const [a, b] = Array.from(pointersRef.current.values());
-      pinchRef.current = {
-        distance: Math.hypot(a.x - b.x, a.y - b.y),
-        zoom: zoomRef.current,
-        pan: panRef.current,
-        midpoint: { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 },
-      };
-      dragStateRef.current = null;
-      return;
-    }
-    dragStateRef.current = { start: point, panStart: panRef.current };
-  }, []);
-
-  const onPointerMove = useCallback((pointerId: number, point: PointerPoint, viewportWidth: number, viewportHeight: number) => {
-    if (pointersRef.current.has(pointerId)) pointersRef.current.set(pointerId, point);
-
-    if (pointersRef.current.size >= 2 && pinchRef.current) {
-      setAnimate(false);
-      const [a, b] = Array.from(pointersRef.current.values());
-      const distance = Math.hypot(a.x - b.x, a.y - b.y);
-      const factor = distance / Math.max(1, pinchRef.current.distance);
-      const midpoint = { x: (a.x + b.x) / 2, y: (a.y + b.y) / 2 };
-      const nextZoom = clamp(pinchRef.current.zoom * factor, MIN_ZOOM, MAX_ZOOM);
-      const ratio = nextZoom / pinchRef.current.zoom;
-      const nextPan = clampPan({
-        x: midpoint.x - (pinchRef.current.midpoint.x - pinchRef.current.pan.x) * ratio,
-        y: midpoint.y - (pinchRef.current.midpoint.y - pinchRef.current.pan.y) * ratio,
-      }, viewportWidth, viewportHeight);
-      setZoom(nextZoom);
-      setPan(nextPan);
-      return;
-    }
-
-    const dragState = dragStateRef.current;
-    if (!dragState) return;
-    setAnimate(false);
-    const nextPan = {
-      x: dragState.panStart.x + (point.x - dragState.start.x),
-      y: dragState.panStart.y + (point.y - dragState.start.y),
-    };
-    setPan(clampPan(nextPan, viewportWidth, viewportHeight));
-  }, [clampPan, setAnimate]);
-
-  const onPointerUp = useCallback((pointerId: number) => {
-    pointersRef.current.delete(pointerId);
-    if (pointersRef.current.size < 2) pinchRef.current = null;
-    if (pointersRef.current.size === 0) dragStateRef.current = null;
-  }, []);
-
-  const onWheelZoom = useCallback((
-    deltaY: number,
-    point: PointerPoint,
-    viewportWidth: number,
-    viewportHeight: number,
-  ) => {
-    const factor = deltaY < 0 ? 1.1 : 0.9;
-    setAnimate(false);
-    zoomAtPoint(zoomRef.current * factor, point, viewportWidth, viewportHeight);
-  }, [setAnimate, zoomAtPoint]);
-
-  const handleKeyDown = useCallback((
-    event: ReactKeyboardEvent,
-    viewportWidth: number,
-    viewportHeight: number,
-    positions: Map<string, GraphPosition>,
-    layoutOptions?: LayoutOptions,
-  ) => {
-    if (isEditableTarget(event.target)) return;
-
-    const modifier = event.metaKey || event.ctrlKey;
-    if (event.key === "Escape") {
-      event.preventDefault();
-      resetView();
-      return;
-    }
-
-    if (!modifier) return;
-
-    if (event.key === "=" || event.key === "+") {
-      event.preventDefault();
-      zoomByFactor(1.2, viewportWidth, viewportHeight);
-      return;
-    }
-
-    if (event.key === "-") {
-      event.preventDefault();
-      zoomByFactor(1 / 1.2, viewportWidth, viewportHeight);
-      return;
-    }
-
-    if (event.key === "0") {
-      event.preventDefault();
-      resetView();
-      return;
-    }
-
-    if ((event.key === "f" || event.key === "F") && event.shiftKey) {
-      event.preventDefault();
-      fitToGraph(positions, viewportWidth, viewportHeight, layoutOptions);
-    }
-  }, [fitToGraph, resetView, zoomByFactor]);
-
-  return {
-    pan,
-    zoom,
-    zoomPercent,
-    transform,
-    transitioning,
-    zoomIn,
-    zoomOut,
-    resetView,
-    fitToGraph,
-    setAnimate,
-    onPointerDown,
-    onPointerMove,
-    onPointerUp,
-    onWheelZoom,
-    handleKeyDown,
-  };
-}

package/dist/plugins/fusion-plugin-dependency-graph/src/utils/graphPositionStorage.ts

@@ -1,65 +0,0 @@
-import { getScopedItem, removeScopedItem, setScopedItem } from "@fusion/dashboard/app/utils/projectStorage";
-
-export type NodePositions = Record<string, { x: number; y: number }>;
-
-const STORAGE_KEY = "fusion-plugin-dependency-graph:positions";
-
-function isPosition(value: unknown): value is { x: number; y: number } {
-  if (!value || typeof value !== "object") return false;
-  const candidate = value as { x?: unknown; y?: unknown };
-  return typeof candidate.x === "number" && Number.isFinite(candidate.x) && typeof candidate.y === "number" && Number.isFinite(candidate.y);
-}
-
-export function loadPositions(projectId?: string): NodePositions {
-  const raw = getScopedItem(STORAGE_KEY, projectId);
-  if (!raw) return {};
-
-  try {
-    const parsed = JSON.parse(raw) as Record<string, unknown>;
-    if (!parsed || typeof parsed !== "object") return {};
-
-    const result: NodePositions = {};
-    for (const [taskId, value] of Object.entries(parsed)) {
-      if (isPosition(value)) {
-        result[taskId] = value;
-      }
-    }
-
-    return result;
-  } catch {
-    return {};
-  }
-}
-
-export function savePositions(positions: NodePositions, visibleTaskIds: Set<string>, projectId?: string): void {
-  const filtered: NodePositions = {};
-  for (const [taskId, position] of Object.entries(positions)) {
-    if (visibleTaskIds.has(taskId) && isPosition(position)) {
-      filtered[taskId] = position;
-    }
-  }
-
-  setScopedItem(STORAGE_KEY, JSON.stringify(filtered), projectId);
-}
-
-export function clearPositions(projectId?: string): void {
-  removeScopedItem(STORAGE_KEY, projectId);
-}
-
-export function mergePositions(autoLayoutPositions: NodePositions, savedPositions: NodePositions, visibleTaskIds: Set<string>): NodePositions {
-  const merged: NodePositions = {};
-
-  for (const [taskId, position] of Object.entries(autoLayoutPositions)) {
-    if (visibleTaskIds.has(taskId) && isPosition(position)) {
-      merged[taskId] = position;
-    }
-  }
-
-  for (const [taskId, position] of Object.entries(savedPositions)) {
-    if (visibleTaskIds.has(taskId) && isPosition(position)) {
-      merged[taskId] = position;
-    }
-  }
-
-  return merged;
-}