Changelog

Unreleased

Edge endpoints respect handle.style offsets. When a handle's inline style map carries a left or top percentage (used to spread multiple handles along a side), SVG edges now start/end at that visual position instead of the side's centre. Previously an edge drawn from a handle positioned via style: %{"left" => "25%"} would still depart from the node's horizontal centre, leaving a visible gap between the edge line and the handle circle.

Clean JavaScript imports. package.json now points directly to source files instead of requiring a build step. Phoenix 1.8+ apps with NODE_PATH configured can import with clean paths:
```
import { LiveFlowHook, FileImportHook, setupDownloadHandler } from "live_flow"
```
Export FileImportHook and setupDownloadHandler from main entry. No longer need a separate import from hooks/utility_hooks.js.

broadcast_from instead of broadcast. PubSub messages now skip the sender process entirely, eliminating self-filtering overhead and reducing message processing by ~N per broadcast (where N = number of connected users).
Live drag broadcasting. Intermediate node positions are broadcast to remote users every 100ms during drag (via lf:drag_move), so other users see live movement instead of position jumps at drag end. Uses a lightweight DOM-only update path — no flow state change or LiveView re-render on receivers.
Smooth cursor interpolation. Remote cursors now use lerp (linear interpolation) animation at 60fps instead of jumping between positions, providing fluid cursor movement.
Reduced cursor throttle. Local cursor broadcast interval reduced from 100ms to 50ms for more responsive cursor tracking.
Server-side cursor throttle. Added Process dictionary-based throttle in the example LiveView to prevent PubSub flooding with many concurrent users.
Client-side remote edge updates. When receiving remote drag positions, edge SVG paths are recalculated client-side to stay visually connected to moving nodes.

Fix auto-layout node overlaps. ELK and tree layout now measure actual DOM node dimensions (offsetWidth/offsetHeight) before computing positions, instead of relying on server-side dimensions that may still be at default fallback values (150x50). This prevents nodes from overlapping when their rendered size exceeds the defaults.

Fully client-side drag with instant edge updates. Node positions AND edge SVG paths are now recalculated client-side during drag, eliminating all latency. Only the final position is sent to the server when the drag ends. After each LiveView DOM patch, client-side positions and viewport transforms are re-applied so nothing "jumps back" to stale server state. No changes required in your LiveView event handlers.
Viewport stability. The client-side viewport transform is re-applied after every server DOM patch, preventing zoom/pan jumps when clicking nodes or during selection changes.

Edge <g> elements now include data-source, data-target, data-source-handle, and data-target-handle attributes for client-side path recalculation during drag.

Flow diagram LiveComponent with pan, zoom, and viewport controls
Node system: drag, select, resize, custom node types (function components + LiveComponents)
Edge system: bezier, straight, step, smoothstep paths with animated edges and labels
Handle system: source/target handles with connection validation
Selection: click, shift-click, selection box (lasso)
Undo/Redo history with configurable max entries
Copy/Paste/Cut/Duplicate clipboard
JSON serialization/deserialization
Real-time collaboration via PubSub with cursor sharing
Connection validation: composable validators (no_duplicate_edges, nodes_exist, no_cycles, types_compatible, max_connections)
ELK auto-layout and tree layout algorithms
Helper lines (alignment guides) during drag
36 built-in themes (12 hand-crafted + 24 auto-generated from daisyUI palettes)
Tailwind v4 theme plugin
SVG/PNG export
Touch/mobile optimization (pinch-to-zoom, long-press selection)
Keyboard shortcuts panel
Edge label inline editing