@falkordb/canvas 0.0.3 → 0.0.7

package/dist/canvas-types.d.ts

@@ -0,0 +1,81 @@
+import { NodeObject } from "force-graph";
+export interface ForceGraphConfig {
+    width?: number;
+    height?: number;
+    backgroundColor?: string;
+    foregroundColor?: string;
+    displayTextPriority?: TextPriority[];
+    onNodeClick?: (node: GraphNode, event: MouseEvent) => void;
+    onLinkClick?: (link: GraphLink, event: MouseEvent) => void;
+    onNodeRightClick?: (node: GraphNode, event: MouseEvent) => void;
+    onLinkRightClick?: (link: GraphLink, event: MouseEvent) => void;
+    onNodeHover?: (node: GraphNode | null) => void;
+    onLinkHover?: (link: GraphLink | null) => void;
+    onBackgroundClick?: (event: MouseEvent) => void;
+    onBackgroundRightClick?: (event: MouseEvent) => void;
+    onZoom?: (transform: Transform) => void;
+    onEngineStop?: () => void;
+    onLoadingChange?: (loading: boolean) => void;
+    cooldownTicks?: number | undefined;
+    cooldownTime?: number;
+    isLinkSelected?: (link: GraphLink) => boolean;
+    isNodeSelected?: (node: GraphNode) => boolean;
+    isLoading?: boolean;
+}
+export type GraphNode = NodeObject & {
+    id: number;
+    labels: string[];
+    color: string;
+    visible: boolean;
+    displayName: [string, string];
+    data: {
+        [key: string]: any;
+    };
+    x?: number;
+    y?: number;
+    vx?: number;
+    vy?: number;
+    fx?: number;
+    fy?: number;
+};
+export type GraphLink = {
+    id: number;
+    relationship: string;
+    color: string;
+    source: GraphNode;
+    target: GraphNode;
+    visible: boolean;
+    curve: number;
+    data: {
+        [key: string]: any;
+    };
+};
+export interface GraphData {
+    nodes: GraphNode[];
+    links: GraphLink[];
+}
+export type Node = Omit<GraphNode, "x" | "y" | "vx" | "vy" | "fx" | "fy" | "displayName">;
+export type Link = Omit<GraphLink, "curve" | "source" | "target"> & {
+    source: number;
+    target: number;
+};
+export interface Data {
+    nodes: Node[];
+    links: Link[];
+}
+export type TextPriority = {
+    name: string;
+    ignore: boolean;
+};
+export type ViewportState = {
+    zoom: number;
+    centerX: number;
+    centerY: number;
+} | undefined;
+export type Transform = {
+    k: number;
+    x: number;
+    y: number;
+};
+export type ForceGraphInstance = import("force-graph").default<GraphNode, GraphLink> | undefined;
+//# sourceMappingURL=canvas-types.d.ts.map

package/dist/canvas-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-types.d.ts","sourceRoot":"","sources":["../src/canvas-types.ts"],"names":[],"mappings":"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"}

package/dist/canvas-types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=canvas-types.js.map

package/dist/canvas-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-types.js","sourceRoot":"","sources":["../src/canvas-types.ts"],"names":[],"mappings":""}

package/dist/canvas-utils.d.ts

@@ -0,0 +1,18 @@
+import { Data, GraphData, Node, TextPriority } from "./canvas-types.js";
+/**
+ * Converts Data format to GraphData format
+ * Adds runtime properties (x, y, vx, vy, fx, fy, displayName, curve)
+ */
+export declare function dataToGraphData(data: Data): GraphData;
+/**
+ * Converts GraphData format to Data format
+ * Removes runtime properties (x, y, vx, vy, fx, fy, displayName, curve)
+ */
+export declare function graphDataToData(graphData: GraphData): Data;
+export declare const getNodeDisplayText: (node: Node, displayTextPriority: TextPriority[]) => string;
+export declare const getNodeDisplayKey: (node: Node, displayTextPriority: TextPriority[]) => string;
+/**
+ * Wraps text into two lines with ellipsis handling for circular nodes
+ */
+export declare const wrapTextForCircularNode: (ctx: CanvasRenderingContext2D, text: string, maxRadius: number) => [string, string];
+//# sourceMappingURL=canvas-utils.d.ts.map

package/dist/canvas-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-utils.d.ts","sourceRoot":"","sources":["../src/canvas-utils.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,SAAS,EACT,IAAI,EAIJ,YAAY,EACb,MAAM,mBAAmB,CAAC;AAE3B;;;GAGG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,CA+BrD;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAC,SAAS,EAAE,SAAS,GAAG,IAAI,CAkB1D;AAED,eAAO,MAAM,kBAAkB,GAC7B,MAAM,IAAI,EACV,qBAAqB,YAAY,EAAE,WA+BpC,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAC5B,MAAM,IAAI,EACV,qBAAqB,YAAY,EAAE,WA+BpC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,uBAAuB,GAClC,KAAK,wBAAwB,EAC7B,MAAM,MAAM,EACZ,WAAW,MAAM,KAChB,CAAC,MAAM,EAAE,MAAM,CAoDjB,CAAC"}

package/dist/canvas-utils.js

@@ -0,0 +1,143 @@
+/**
+ * Converts Data format to GraphData format
+ * Adds runtime properties (x, y, vx, vy, fx, fy, displayName, curve)
+ */
+export function dataToGraphData(data) {
+    const nodes = data.nodes.map((node) => ({
+        ...node,
+        displayName: ["", ""],
+        x: undefined,
+        y: undefined,
+        vx: undefined,
+        vy: undefined,
+        fx: undefined,
+        fy: undefined,
+    }));
+    // Create a Map for O(1) node lookups by id
+    const nodeMap = new Map();
+    nodes.forEach((node) => {
+        nodeMap.set(node.id, node);
+    });
+    const links = data.links.map((link) => {
+        const sourceNode = nodeMap.get(link.source);
+        const targetNode = nodeMap.get(link.target);
+        return {
+            ...link,
+            source: sourceNode,
+            target: targetNode,
+            curve: 0,
+        };
+    });
+    return { nodes, links };
+}
+/**
+ * Converts GraphData format to Data format
+ * Removes runtime properties (x, y, vx, vy, fx, fy, displayName, curve)
+ */
+export function graphDataToData(graphData) {
+    const nodes = graphData.nodes.map((node) => {
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        const { x, y, vx, vy, fx, fy, displayName, ...rest } = node;
+        return rest;
+    });
+    const links = graphData.links.map((link) => {
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        const { curve, source, target, ...rest } = link;
+        return {
+            ...rest,
+            source: source.id,
+            target: target.id,
+        };
+    });
+    return { nodes, links };
+}
+export const getNodeDisplayText = (node, displayTextPriority) => {
+    const { data: nodeData } = node;
+    const displayText = displayTextPriority.find(({ name, ignore }) => {
+        const key = ignore
+            ? Object.keys(nodeData).find((k) => k.toLowerCase() === name.toLowerCase())
+            : name;
+        return (key &&
+            nodeData[key] &&
+            typeof nodeData[key] === "string" &&
+            nodeData[key].trim().length > 0);
+    });
+    if (displayText) {
+        const key = displayText.ignore
+            ? Object.keys(nodeData).find((k) => k.toLowerCase() === displayText.name.toLowerCase())
+            : displayText.name;
+        if (key) {
+            return String(nodeData[key]);
+        }
+    }
+    return String(node.id);
+};
+export const getNodeDisplayKey = (node, displayTextPriority) => {
+    const { data: nodeData } = node;
+    const displayText = displayTextPriority.find(({ name, ignore }) => {
+        const key = ignore
+            ? Object.keys(nodeData).find((k) => k.toLowerCase() === name.toLowerCase())
+            : name;
+        return (key &&
+            nodeData[key] &&
+            typeof nodeData[key] === "string" &&
+            nodeData[key].trim().length > 0);
+    });
+    if (displayText) {
+        const key = displayText.ignore
+            ? Object.keys(nodeData).find((k) => k.toLowerCase() === displayText.name.toLowerCase())
+            : displayText.name;
+        if (key) {
+            return key;
+        }
+    }
+    return String(node.id);
+};
+/**
+ * Wraps text into two lines with ellipsis handling for circular nodes
+ */
+export const wrapTextForCircularNode = (ctx, text, maxRadius) => {
+    const ellipsis = "...";
+    const ellipsisWidth = ctx.measureText(ellipsis).width;
+    const halfTextHeight = 1.125;
+    const availableRadius = Math.sqrt(Math.max(0, maxRadius * maxRadius - halfTextHeight * halfTextHeight));
+    const lineWidth = availableRadius * 2;
+    const words = text.split(/\s+/);
+    let line1 = "";
+    let line2 = "";
+    for (let i = 0; i < words.length; i += 1) {
+        const word = words[i];
+        const testLine = line1 ? `${line1} ${word}` : word;
+        const testWidth = ctx.measureText(testLine).width;
+        if (testWidth <= lineWidth) {
+            line1 = testLine;
+        }
+        else if (!line1) {
+            let partialWord = word;
+            while (partialWord.length > 0 &&
+                ctx.measureText(partialWord).width > lineWidth) {
+                partialWord = partialWord.slice(0, -1);
+            }
+            line1 = partialWord;
+            const remainingWords = [
+                word.slice(partialWord.length),
+                ...words.slice(i + 1),
+            ];
+            line2 = remainingWords.join(" ");
+            break;
+        }
+        else {
+            line2 = words.slice(i).join(" ");
+            break;
+        }
+    }
+    if (line2 && ctx.measureText(line2).width > lineWidth) {
+        while (line2.length > 0 &&
+            ctx.measureText(line2).width + ellipsisWidth > lineWidth) {
+            line2 = line2.slice(0, -1);
+        }
+        line2 += ellipsis;
+    }
+    return [line1, line2 || ""];
+};
+//# sourceMappingURL=canvas-utils.js.map

package/dist/canvas-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-utils.js","sourceRoot":"","sources":["../src/canvas-utils.ts"],"names":[],"mappings":"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"}

package/dist/canvas.d.ts

@@ -0,0 +1,45 @@
+import { Data, ForceGraphInstance, GraphData, GraphNode, ForceGraphConfig, ViewportState } from "./canvas-types.js";
+declare class FalkorDBCanvas extends HTMLElement {
+    private graph;
+    private container;
+    private loadingOverlay;
+    private data;
+    private config;
+    private nodeDegreeMap;
+    private relationshipsTextCache;
+    private viewport;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    setConfig(config: Partial<ForceGraphConfig>): void;
+    setWidth(width: number): void;
+    setHeight(height: number): void;
+    setBackgroundColor(color: string): void;
+    setForegroundColor(color: string): void;
+    setIsLoading(isLoading: boolean): void;
+    setCooldownTicks(ticks: number | undefined): void;
+    setDisplayTextPriority(priority: ForceGraphConfig['displayTextPriority']): void;
+    getData(): Data;
+    setData(data: Data): void;
+    getViewport(): ViewportState;
+    setViewport(viewport: ViewportState): void;
+    getGraphData(): GraphData;
+    setGraphData(data: GraphData): void;
+    getGraph(): ForceGraphInstance | undefined;
+    getZoom(): number;
+    zoom(zoomLevel: number): ForceGraphInstance | undefined;
+    zoomToFit(paddingMultiplier?: number, filter?: (node: GraphNode) => boolean): void;
+    private triggerRender;
+    private calculateNodeDegree;
+    private createLoadingOverlay;
+    private render;
+    private initGraph;
+    private setupForces;
+    private drawNode;
+    private drawLink;
+    private updateLoadingState;
+    private handleEngineStop;
+    private updateEventHandlers;
+}
+export default FalkorDBCanvas;
+//# sourceMappingURL=canvas.d.ts.map

package/dist/canvas.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas.d.ts","sourceRoot":"","sources":["../src/canvas.ts"],"names":[],"mappings":"AAIA,OAAO,EACL,IAAI,EACJ,kBAAkB,EAClB,SAAS,EAET,SAAS,EACT,gBAAgB,EAChB,aAAa,EAEd,MAAM,mBAAmB,CAAC;AA6C3B,cAAM,cAAe,SAAQ,WAAW;IACtC,OAAO,CAAC,KAAK,CAAqB;IAElC,OAAO,CAAC,SAAS,CAA+B;IAEhD,OAAO,CAAC,cAAc,CAA+B;IAErD,OAAO,CAAC,IAAI,CAAuC;IAEnD,OAAO,CAAC,MAAM,CAAwB;IAEtC,OAAO,CAAC,aAAa,CAAkC;IAEvD,OAAO,CAAC,sBAAsB,CAQhB;IAEd,OAAO,CAAC,QAAQ,CAAgB;;IAOhC,iBAAiB;IAIjB,oBAAoB;IAOpB,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,gBAAgB,CAAC;IAW3C,QAAQ,CAAC,KAAK,EAAE,MAAM;IAQtB,SAAS,CAAC,MAAM,EAAE,MAAM;IAQxB,kBAAkB,CAAC,KAAK,EAAE,MAAM;IAWhC,kBAAkB,CAAC,KAAK,EAAE,MAAM;IAMhC,YAAY,CAAC,SAAS,EAAE,OAAO;IAM/B,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS;IAQ1C,sBAAsB,CAAC,QAAQ,EAAE,gBAAgB,CAAC,qBAAqB,CAAC;IAKxE,OAAO,IAAI,IAAI;IAKf,OAAO,CAAC,IAAI,EAAE,IAAI;IAwBlB,WAAW,IAAI,aAAa;IAa5B,WAAW,CAAC,QAAQ,EAAE,aAAa;IAInC,YAAY,IAAI,SAAS;IAIzB,YAAY,CAAC,IAAI,EAAE,SAAS;IAuB5B,QAAQ,IAAI,kBAAkB,GAAG,SAAS;IAInC,OAAO,IAAI,MAAM;IAIjB,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,kBAAkB,GAAG,SAAS;IAMvD,SAAS,CAAC,iBAAiB,SAAI,EAAE,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO;IAiB7E,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,mBAAmB;IAqB3B,OAAO,CAAC,oBAAoB;IAmE5B,OAAO,CAAC,MAAM;IAqBd,OAAO,CAAC,SAAS;IAmGjB,OAAO,CAAC,WAAW;IA2EnB,OAAO,CAAC,QAAQ;IA+ChB,OAAO,CAAC,QAAQ;IAqGhB,OAAO,CAAC,kBAAkB;IAU1B,OAAO,CAAC,gBAAgB;IAuBxB,OAAO,CAAC,mBAAmB;CA8D5B;AAOD,eAAe,cAAc,CAAC"}

package/dist/canvas.js

@@ -0,0 +1,653 @@
+/* eslint-disable no-param-reassign */
+import ForceGraph from "force-graph";
+import * as d3 from "d3";
+import { dataToGraphData, getNodeDisplayText, graphDataToData, wrapTextForCircularNode, } from "./canvas-utils.js";
+const NODE_SIZE = 6;
+const PADDING = 2;
+// Force constants
+const LINK_DISTANCE = 50;
+const MAX_LINK_DISTANCE = 80;
+const LINK_STRENGTH = 0.5;
+const MIN_LINK_STRENGTH = 0.3;
+const COLLISION_STRENGTH = 1.35;
+const CHARGE_STRENGTH = -5;
+const CENTER_STRENGTH = 0.4;
+const COLLISION_BASE_RADIUS = NODE_SIZE * 2;
+const HIGH_DEGREE_PADDING = 1.25;
+const DEGREE_STRENGTH_DECAY = 15;
+const CROWDING_THRESHOLD = 20;
+// Create styles for the web component
+function createStyles() {
+    const style = document.createElement("style");
+    style.textContent = `
+    :host {
+      display: block;
+      width: 100%;
+      height: 100%;
+    }
+    @keyframes pulse {
+      0%, 100% {
+        opacity: 1;
+      }
+      50% {
+        opacity: 0.5;
+      }
+    }
+  `;
+    return style;
+}
+class FalkorDBCanvas extends HTMLElement {
+    constructor() {
+        super();
+        this.container = null;
+        this.loadingOverlay = null;
+        this.data = { nodes: [], links: [] };
+        this.config = {};
+        this.nodeDegreeMap = new Map();
+        this.relationshipsTextCache = new Map();
+        this.attachShadow({ mode: "open" });
+    }
+    connectedCallback() {
+        this.render();
+    }
+    disconnectedCallback() {
+        if (this.graph) {
+            // eslint-disable-next-line no-underscore-dangle
+            this.graph._destructor();
+        }
+    }
+    setConfig(config) {
+        Object.assign(this.config, config);
+        // Update event handlers if they were provided
+        if (config.onNodeClick || config.onLinkClick || config.onNodeRightClick || config.onLinkRightClick ||
+            config.onNodeHover || config.onLinkHover || config.onBackgroundClick || config.onBackgroundRightClick || config.onZoom ||
+            config.onEngineStop || config.isNodeSelected || config.isLinkSelected) {
+            this.updateEventHandlers();
+        }
+    }
+    setWidth(width) {
+        if (this.config.width === width)
+            return;
+        this.config.width = width;
+        if (this.graph) {
+            this.graph.width(width);
+        }
+    }
+    setHeight(height) {
+        if (this.config.height === height)
+            return;
+        this.config.height = height;
+        if (this.graph) {
+            this.graph.height(height);
+        }
+    }
+    setBackgroundColor(color) {
+        if (this.config.backgroundColor === color)
+            return;
+        this.config.backgroundColor = color;
+        if (this.graph) {
+            this.graph.backgroundColor(color);
+        }
+        if (this.loadingOverlay) {
+            this.loadingOverlay.style.background = color;
+        }
+    }
+    setForegroundColor(color) {
+        if (this.config.foregroundColor === color)
+            return;
+        this.config.foregroundColor = color;
+        this.triggerRender();
+    }
+    setIsLoading(isLoading) {
+        if (this.config.isLoading === isLoading)
+            return;
+        this.config.isLoading = isLoading;
+        this.updateLoadingState();
+    }
+    setCooldownTicks(ticks) {
+        if (this.config.cooldownTicks === ticks)
+            return;
+        this.config.cooldownTicks = ticks;
+        if (this.graph) {
+            this.graph.cooldownTicks(ticks ?? Infinity);
+        }
+    }
+    setDisplayTextPriority(priority) {
+        this.config.displayTextPriority = priority;
+        this.triggerRender();
+    }
+    getData() {
+        return graphDataToData(this.data);
+    }
+    setData(data) {
+        this.data = dataToGraphData(data);
+        this.config.cooldownTicks = this.data.nodes.length > 0 ? undefined : 0;
+        this.config.isLoading = this.data.nodes.length > 0;
+        this.config.onLoadingChange?.(this.config.isLoading);
+        // Initialize graph if it hasn't been initialized yet
+        if (!this.graph && this.container) {
+            this.initGraph();
+        }
+        if (!this.graph)
+            return;
+        this.calculateNodeDegree();
+        // Update graph data and properties
+        this.graph
+            .graphData(this.data)
+            .cooldownTicks(this.config.cooldownTicks ?? Infinity);
+        this.updateLoadingState();
+        this.setupForces();
+    }
+    getViewport() {
+        if (!this.graph)
+            return undefined;
+        const { x: centerX, y: centerY } = this.graph.centerAt();
+        const zoom = this.graph.zoom();
+        return {
+            zoom,
+            centerX,
+            centerY,
+        };
+    }
+    setViewport(viewport) {
+        this.viewport = viewport;
+    }
+    getGraphData() {
+        return this.data;
+    }
+    setGraphData(data) {
+        this.data = data;
+        this.config.cooldownTicks = 0;
+        this.config.isLoading = false;
+        if (!this.graph)
+            return;
+        this.calculateNodeDegree();
+        this.graph
+            .graphData(this.data)
+            .cooldownTicks(this.config.cooldownTicks ?? Infinity);
+        if (this.viewport) {
+            this.graph.zoom(this.viewport.zoom, 0);
+            this.graph.centerAt(this.viewport.centerX, this.viewport.centerY, 0);
+            this.viewport = undefined;
+        }
+        this.updateLoadingState();
+        this.setupForces();
+    }
+    getGraph() {
+        return this.graph;
+    }
+    getZoom() {
+        return this.graph?.zoom() || 0;
+    }
+    zoom(zoomLevel) {
+        if (!this.graph)
+            return;
+        return this.graph.zoom(zoomLevel);
+    }
+    zoomToFit(paddingMultiplier = 1, filter) {
+        if (!this.graph || !this.shadowRoot)
+            return;
+        // Get canvas from shadow DOM
+        const canvas = this.shadowRoot.querySelector("canvas");
+        if (!canvas)
+            return;
+        const rect = canvas.getBoundingClientRect();
+        // Calculate padding as 10% of the smallest canvas dimension
+        const minDimension = Math.min(rect.width, rect.height);
+        const padding = minDimension * 0.1;
+        // Use the force-graph's built-in zoomToFit method
+        this.graph.zoomToFit(500, padding * paddingMultiplier, filter);
+    }
+    triggerRender() {
+        if (!this.graph || this.graph.cooldownTicks() !== 0)
+            return;
+        // If simulation is stopped (0), trigger one tick to re-render
+        this.graph.cooldownTicks(1);
+    }
+    calculateNodeDegree() {
+        this.nodeDegreeMap.clear();
+        const { nodes, links } = this.data;
+        nodes.forEach((node) => this.nodeDegreeMap.set(node.id, 0));
+        links.forEach((link) => {
+            const sourceId = link.source.id;
+            const targetId = link.target.id;
+            this.nodeDegreeMap.set(sourceId, (this.nodeDegreeMap.get(sourceId) || 0) + 1);
+            this.nodeDegreeMap.set(targetId, (this.nodeDegreeMap.get(targetId) || 0) + 1);
+        });
+    }
+    createLoadingOverlay() {
+        const overlay = document.createElement("div");
+        overlay.style.cssText = `
+      position: absolute;
+      inset: 0;
+      display: none;
+      align-items: center;
+      justify-content: center;
+      background: ${this.config.backgroundColor || "#FFFFFF"};
+      z-index: 10;
+    `;
+        // Create skeleton loading structure (matching Spinning component pattern)
+        const skeletonContainer = document.createElement("div");
+        skeletonContainer.style.cssText = `
+      display: flex;
+      align-items: center;
+      gap: 1rem;
+    `;
+        // Create circular skeleton (matching h-12 w-12 rounded-full)
+        const circle = document.createElement("div");
+        circle.style.cssText = `
+      height: 3rem;
+      width: 3rem;
+      border-radius: 9999px;
+      background-color: #CCCCCC;
+      animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+    `;
+        // Create lines container (matching space-y-2)
+        const linesContainer = document.createElement("div");
+        linesContainer.style.cssText = `
+      display: flex;
+      flex-direction: column;
+      gap: 0.5rem;
+    `;
+        // Create first line (matching h-4 w-[250px])
+        const line1 = document.createElement("div");
+        line1.style.cssText = `
+      height: 1rem;
+      width: 250px;
+      border-radius: 0.375rem;
+      background-color: #CCCCCC;
+      animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+    `;
+        // Create second line (matching h-4 w-[200px])
+        const line2 = document.createElement("div");
+        line2.style.cssText = `
+      height: 1rem;
+      width: 200px;
+      border-radius: 0.375rem;
+      background-color: #CCCCCC;
+      animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+    `;
+        linesContainer.appendChild(line1);
+        linesContainer.appendChild(line2);
+        skeletonContainer.appendChild(circle);
+        skeletonContainer.appendChild(linesContainer);
+        overlay.appendChild(skeletonContainer);
+        return overlay;
+    }
+    render() {
+        if (!this.shadowRoot)
+            return;
+        // Create container
+        this.container = document.createElement("div");
+        this.container.style.width = "100%";
+        this.container.style.height = "100%";
+        this.container.style.position = "relative";
+        // Create loading overlay
+        this.loadingOverlay = this.createLoadingOverlay();
+        // Add styles using standalone function
+        const style = createStyles();
+        this.shadowRoot.appendChild(style);
+        this.shadowRoot.appendChild(this.container);
+        this.initGraph();
+        this.container.appendChild(this.loadingOverlay);
+    }
+    initGraph() {
+        if (!this.container)
+            return;
+        this.calculateNodeDegree();
+        // Initialize force-graph
+        // Cast to any for the factory call pattern, result is properly typed as ForceGraphInstance
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        this.graph = ForceGraph()(this.container)
+            .width(this.config.width || 800)
+            .height(this.config.height || 600)
+            .backgroundColor(this.config.backgroundColor || "#FFFFFF")
+            .graphData(this.data)
+            .nodeRelSize(NODE_SIZE)
+            .nodeCanvasObjectMode(() => "after")
+            .linkCanvasObjectMode(() => "after")
+            .nodeLabel((node) => getNodeDisplayText(node, this.config.displayTextPriority || []))
+            .linkLabel((link) => link.relationship)
+            .linkDirectionalArrowRelPos(1)
+            .linkDirectionalArrowLength((link) => {
+            if (link.source === link.target)
+                return 0;
+            return this.config.isLinkSelected?.(link) ? 4 : 2;
+        })
+            .linkDirectionalArrowColor((link) => link.color)
+            .linkWidth((link) => this.config.isLinkSelected?.(link) ? 2 : 1)
+            .linkCurvature("curve")
+            .linkVisibility("visible")
+            .nodeVisibility("visible")
+            .cooldownTicks(this.config.cooldownTicks ?? Infinity) // undefined = infinite
+            .cooldownTime(this.config.cooldownTime ?? 1000)
+            .enableNodeDrag(true)
+            .enableZoomInteraction(true)
+            .enablePanInteraction(true)
+            .onNodeClick((node, event) => {
+            if (this.config.onNodeClick) {
+                this.config.onNodeClick(node, event);
+            }
+        })
+            .onLinkClick((link, event) => {
+            if (this.config.onLinkClick) {
+                this.config.onLinkClick(link, event);
+            }
+        })
+            .onNodeRightClick((node, event) => {
+            if (this.config.onNodeRightClick) {
+                this.config.onNodeRightClick(node, event);
+            }
+        })
+            .onLinkRightClick((link, event) => {
+            if (this.config.onLinkRightClick) {
+                this.config.onLinkRightClick(link, event);
+            }
+        })
+            .onNodeHover((node) => {
+            if (this.config.onNodeHover) {
+                this.config.onNodeHover(node);
+            }
+        })
+            .onLinkHover((link) => {
+            if (this.config.onLinkHover) {
+                this.config.onLinkHover(link);
+            }
+        })
+            .onBackgroundClick((event) => {
+            if (this.config.onBackgroundClick) {
+                this.config.onBackgroundClick(event);
+            }
+        })
+            .onBackgroundRightClick((event) => {
+            if (this.config.onBackgroundRightClick) {
+                this.config.onBackgroundRightClick(event);
+            }
+        })
+            .onZoom((transform) => {
+            if (this.config.onZoom) {
+                this.config.onZoom(transform);
+            }
+        })
+            .onEngineStop(() => {
+            this.handleEngineStop();
+            if (this.config.onEngineStop) {
+                this.config.onEngineStop();
+            }
+        })
+            .nodeCanvasObject((node, ctx) => {
+            this.drawNode(node, ctx);
+        })
+            .linkCanvasObject((link, ctx) => {
+            this.drawLink(link, ctx);
+        });
+        // Setup forces
+        this.setupForces();
+    }
+    setupForces() {
+        const linkForce = this.graph?.d3Force("link");
+        if (!linkForce)
+            return;
+        if (!this.graph)
+            return;
+        // Link force with dynamic distance and strength
+        linkForce
+            .distance((link) => {
+            const sourceId = link.source.id;
+            const targetId = link.target.id;
+            const sourceDegree = this.nodeDegreeMap.get(sourceId) || 0;
+            const targetDegree = this.nodeDegreeMap.get(targetId) || 0;
+            const maxDegree = Math.max(sourceDegree, targetDegree);
+            if (maxDegree >= CROWDING_THRESHOLD) {
+                const extraDistance = Math.min(MAX_LINK_DISTANCE - LINK_DISTANCE, (maxDegree - CROWDING_THRESHOLD) * 1.5);
+                return LINK_DISTANCE + extraDistance;
+            }
+            return LINK_DISTANCE;
+        })
+            .strength((link) => {
+            const sourceId = link.source.id;
+            const targetId = link.target.id;
+            const sourceDegree = this.nodeDegreeMap.get(sourceId) || 0;
+            const targetDegree = this.nodeDegreeMap.get(targetId) || 0;
+            const maxDegree = Math.max(sourceDegree, targetDegree);
+            if (maxDegree <= DEGREE_STRENGTH_DECAY) {
+                return LINK_STRENGTH;
+            }
+            const strengthReduction = Math.max(0, (maxDegree - DEGREE_STRENGTH_DECAY) / DEGREE_STRENGTH_DECAY);
+            const scaledStrength = MIN_LINK_STRENGTH +
+                (LINK_STRENGTH - MIN_LINK_STRENGTH) * Math.exp(-strengthReduction);
+            return Math.max(MIN_LINK_STRENGTH, scaledStrength);
+        });
+        // Collision force
+        this.graph.d3Force("collision", d3
+            .forceCollide((node) => {
+            const degree = this.nodeDegreeMap.get(node.id) || 0;
+            return (COLLISION_BASE_RADIUS + Math.sqrt(degree) * HIGH_DEGREE_PADDING);
+        })
+            .strength(COLLISION_STRENGTH)
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            .iterations(2));
+        // Center force
+        const centerForce = this.graph.d3Force("center");
+        if (centerForce) {
+            centerForce.strength(CENTER_STRENGTH);
+        }
+        // Charge force
+        const chargeForce = this.graph.d3Force("charge");
+        if (chargeForce) {
+            chargeForce.strength(CHARGE_STRENGTH).distanceMax(300);
+        }
+    }
+    drawNode(node, ctx) {
+        if (!node.x || !node.y) {
+            node.x = 0;
+            node.y = 0;
+        }
+        ctx.lineWidth = this.config.isNodeSelected?.(node) ? 1.5 : 0.5;
+        ctx.strokeStyle = this.config.foregroundColor || "#1A1A1A";
+        ctx.beginPath();
+        ctx.arc(node.x, node.y, NODE_SIZE, 0, 2 * Math.PI, false);
+        ctx.fillStyle = node.color;
+        ctx.fill();
+        ctx.stroke();
+        // Draw text
+        ctx.fillStyle = "black";
+        ctx.textAlign = "center";
+        ctx.textBaseline = "middle";
+        ctx.font = "400 2px SofiaSans";
+        let [line1, line2] = node.displayName || ["", ""];
+        if (!line1 && !line2) {
+            const text = getNodeDisplayText(node, this.config.displayTextPriority || []);
+            const textRadius = NODE_SIZE - PADDING / 2;
+            [line1, line2] = wrapTextForCircularNode(ctx, text, textRadius);
+            node.displayName = [line1, line2];
+        }
+        const textMetrics = ctx.measureText(line1);
+        const textHeight = textMetrics.actualBoundingBoxAscent +
+            textMetrics.actualBoundingBoxDescent;
+        const halfTextHeight = (textHeight / 2) * 1.5;
+        if (line1) {
+            ctx.fillText(line1, node.x, line2 ? node.y - halfTextHeight : node.y);
+        }
+        if (line2) {
+            ctx.fillText(line2, node.x, node.y + halfTextHeight);
+        }
+    }
+    drawLink(link, ctx) {
+        const start = link.source;
+        const end = link.target;
+        if (!start.x || !start.y || !end.x || !end.y) {
+            start.x = 0;
+            start.y = 0;
+            end.x = 0;
+            end.y = 0;
+        }
+        let textX;
+        let textY;
+        let angle;
+        if (start.id === end.id) {
+            const radius = NODE_SIZE * (link.curve || 0) * 6.2;
+            const angleOffset = -Math.PI / 4;
+            textX = start.x + radius * Math.cos(angleOffset);
+            textY = start.y + radius * Math.sin(angleOffset);
+            angle = -angleOffset;
+        }
+        else {
+            const dx = end.x - start.x;
+            const dy = end.y - start.y;
+            const distance = Math.sqrt(dx * dx + dy * dy);
+            const perpX = dy / distance;
+            const perpY = -dx / distance;
+            const curvature = link.curve || 0;
+            const controlX = (start.x + end.x) / 2 + perpX * curvature * distance * 1.0;
+            const controlY = (start.y + end.y) / 2 + perpY * curvature * distance * 1.0;
+            const t = 0.5;
+            const oneMinusT = 1 - t;
+            textX =
+                oneMinusT * oneMinusT * start.x +
+                    2 * oneMinusT * t * controlX +
+                    t * t * end.x;
+            textY =
+                oneMinusT * oneMinusT * start.y +
+                    2 * oneMinusT * t * controlY +
+                    t * t * end.y;
+            const tangentX = 2 * oneMinusT * (controlX - start.x) + 2 * t * (end.x - controlX);
+            const tangentY = 2 * oneMinusT * (controlY - start.y) + 2 * t * (end.y - controlY);
+            angle = Math.atan2(tangentY, tangentX);
+            if (angle > Math.PI / 2)
+                angle = -(Math.PI - angle);
+            if (angle < -Math.PI / 2)
+                angle = -(-Math.PI - angle);
+        }
+        ctx.font = "400 2px SofiaSans";
+        ctx.textAlign = "center";
+        ctx.textBaseline = "middle";
+        let cached = this.relationshipsTextCache.get(link.relationship);
+        if (!cached) {
+            const { width, actualBoundingBoxAscent, actualBoundingBoxDescent } = ctx.measureText(link.relationship);
+            cached = {
+                textWidth: width,
+                textHeight: actualBoundingBoxAscent + actualBoundingBoxDescent,
+                textAscent: actualBoundingBoxAscent,
+                textDescent: actualBoundingBoxDescent,
+            };
+            this.relationshipsTextCache.set(link.relationship, cached);
+        }
+        const { textWidth, textHeight, textAscent, textDescent } = cached;
+        ctx.save();
+        ctx.translate(textX, textY);
+        ctx.rotate(angle);
+        // Draw background
+        ctx.fillStyle = this.config.backgroundColor || "#FFFFFF";
+        const backgroundHeight = textHeight * 0.7;
+        // Move background up to align with text that appears at top of bg
+        // Use the actual text metrics to calculate proper vertical offset
+        const bgOffsetY = -(textAscent - textDescent) - 0.18;
+        ctx.fillRect(-textWidth / 2, -backgroundHeight / 2 + bgOffsetY, textWidth, backgroundHeight);
+        // Draw text
+        ctx.fillStyle = this.config.foregroundColor || "#1A1A1A";
+        ctx.textBaseline = "middle";
+        ctx.fillText(link.relationship, 0, 0);
+        ctx.restore();
+    }
+    updateLoadingState() {
+        if (!this.loadingOverlay)
+            return;
+        if (this.config.isLoading) {
+            this.loadingOverlay.style.display = "flex";
+        }
+        else {
+            this.loadingOverlay.style.display = "none";
+        }
+    }
+    handleEngineStop() {
+        if (!this.graph)
+            return;
+        // If already stopped, don't do anything
+        if (this.config.cooldownTicks === 0)
+            return;
+        // Zoom to fit using the same logic as handleZoomToFit from utils
+        const nodeCount = this.data.nodes.length;
+        const paddingMultiplier = nodeCount < 2 ? 4 : 1;
+        this.zoomToFit(paddingMultiplier);
+        // Stop the force simulation after centering (like it was in ForceGraph.tsx)
+        setTimeout(() => {
+            if (!this.graph)
+                return;
+            // Stop loading
+            this.config.isLoading = false;
+            this.config.onLoadingChange?.(this.config.isLoading);
+            this.updateLoadingState();
+            this.config.cooldownTicks = 0;
+            this.graph.cooldownTicks(0);
+        }, 1000);
+    }
+    updateEventHandlers() {
+        if (!this.graph)
+            return;
+        this.graph
+            .onNodeClick((node, event) => {
+            if (this.config.onNodeClick) {
+                this.config.onNodeClick(node, event);
+            }
+        })
+            .onLinkClick((link, event) => {
+            if (this.config.onLinkClick) {
+                this.config.onLinkClick(link, event);
+            }
+        })
+            .onNodeRightClick((node, event) => {
+            if (this.config.onNodeRightClick) {
+                this.config.onNodeRightClick(node, event);
+            }
+        })
+            .onLinkRightClick((link, event) => {
+            if (this.config.onLinkRightClick) {
+                this.config.onLinkRightClick(link, event);
+            }
+        })
+            .onNodeHover((node) => {
+            if (this.config.onNodeHover) {
+                this.config.onNodeHover(node);
+            }
+        })
+            .onLinkHover((link) => {
+            if (this.config.onLinkHover) {
+                this.config.onLinkHover(link);
+            }
+        })
+            .onBackgroundClick((event) => {
+            if (this.config.onBackgroundClick) {
+                this.config.onBackgroundClick(event);
+            }
+        })
+            .onBackgroundRightClick((event) => {
+            if (this.config.onBackgroundRightClick) {
+                this.config.onBackgroundRightClick(event);
+            }
+        })
+            .onZoom((transform) => {
+            if (this.config.onZoom) {
+                this.config.onZoom(transform);
+            }
+        })
+            .onEngineStop(() => {
+            this.handleEngineStop();
+            if (this.config.onEngineStop) {
+                this.config.onEngineStop();
+            }
+        })
+            .nodeCanvasObject((node, ctx) => {
+            this.drawNode(node, ctx);
+        })
+            .linkCanvasObject((link, ctx) => {
+            this.drawLink(link, ctx);
+        });
+    }
+}
+// Define the custom element
+if (typeof window !== "undefined" && !customElements.get("falkordb-canvas")) {
+    customElements.define("falkordb-canvas", FalkorDBCanvas);
+}
+export default FalkorDBCanvas;
+//# sourceMappingURL=canvas.js.map

package/dist/canvas.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas.js","sourceRoot":"","sources":["../src/canvas.ts"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+import FalkorDBCanvas from "./canvas";
+import type React from "react";
+declare global {
+    interface HTMLElementTagNameMap {
+        "falkordb-canvas": FalkorDBCanvas;
+    }
+    namespace JSX {
+        interface IntrinsicElements {
+            "falkordb-canvas": React.DetailedHTMLProps<React.HTMLAttributes<FalkorDBCanvas>, FalkorDBCanvas>;
+        }
+    }
+}
+export { FalkorDBCanvas as default, FalkorDBCanvas };
+export type { ForceGraphConfig, GraphNode, GraphLink, GraphData, Node, Link, Data, TextPriority, ViewportState, ForceGraphInstance, } from "./canvas-types";
+export { dataToGraphData, graphDataToData, getNodeDisplayText, getNodeDisplayKey, wrapTextForCircularNode, } from "./canvas-utils";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,UAAU,CAAC;AACtC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,cAAc,CAAC;KACnC;IAED,UAAU,GAAG,CAAC;QACZ,UAAU,iBAAiB;YACzB,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,CACxC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc,CACf,CAAC;SACH;KACF;CACF;AAGD,OAAO,EAAE,cAAc,IAAI,OAAO,EAAE,cAAc,EAAE,CAAC;AAGrD,YAAY,EACV,gBAAgB,EAChB,SAAS,EACT,SAAS,EACT,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,aAAa,EACb,kBAAkB,GACnB,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACL,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,GACxB,MAAM,gBAAgB,CAAC"}

package/dist/index.js

@@ -0,0 +1,6 @@
+import FalkorDBCanvas from "./canvas";
+// Main canvas class
+export { FalkorDBCanvas as default, FalkorDBCanvas };
+// Utils
+export { dataToGraphData, graphDataToData, getNodeDisplayText, getNodeDisplayKey, wrapTextForCircularNode, } from "./canvas-utils";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,UAAU,CAAC;AAkBtC,oBAAoB;AACpB,OAAO,EAAE,cAAc,IAAI,OAAO,EAAE,cAAc,EAAE,CAAC;AAgBrD,QAAQ;AACR,OAAO,EACL,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,uBAAuB,GACxB,MAAM,gBAAgB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@falkordb/canvas",
-  "version": "0.0.3",
+  "version": "0.0.7",
   "description": "A standalone web component for visualizing FalkorDB graphs using force-directed layouts",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -25,6 +25,14 @@
     "clean": "rm -rf dist",
     "lint": "eslint ."
   },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/FalkorDB/falkordb-canvas"
+  },
+  "bugs": {
+    "url": "https://github.com/FalkorDB/falkordb-canvas/issues"
+  },
+  "homepage": "https://github.com/FalkorDB/falkordb-canvas",
   "keywords": [
     "falkordb",
     "graph",
@@ -36,12 +44,12 @@
   "author": "FalkorDB",
   "license": "MIT",
   "dependencies": {
-    "@types/react": "^19.2.7",
     "d3": "^7.9.0",
     "force-graph": "^1.44.4",
     "react": "^19.2.3"
   },
   "devDependencies": {
+    "@types/react": "^19.2.7",
     "@types/d3": "^7.4.3",
     "@typescript-eslint/eslint-plugin": "^8.18.2",
     "@typescript-eslint/parser": "^8.18.2",

package/src/{falkordb-canvas-types.ts → canvas-types.ts}

@@ -13,6 +13,8 @@ export interface ForceGraphConfig {
   onNodeHover?: (node: GraphNode | null) => void;
   onLinkHover?: (link: GraphLink | null) => void;
   onBackgroundClick?: (event: MouseEvent) => void;
+  onBackgroundRightClick?: (event: MouseEvent) => void;
+  onZoom?: (transform: Transform) => void;
   onEngineStop?: () => void;
   onLoadingChange?: (loading: boolean) => void;
   cooldownTicks?: number | undefined;
@@ -85,6 +87,8 @@ export type ViewportState = {
   centerY: number;
 } | undefined;
 
+export type Transform = { k: number, x: number, y: number };
+
 // Force graph instance type from force-graph library
 // The instance is created by calling ForceGraph as a function with a container element
 export type ForceGraphInstance = import("force-graph").default<GraphNode, GraphLink> | undefined;

package/src/{falkordb-canvas-utils.ts → canvas-utils.ts}

@@ -6,7 +6,7 @@ import {
   GraphNode,
   GraphLink,
   TextPriority,
-} from "./falkordb-canvas-types.js";
+} from "./canvas-types.js";
 
 /**
  * Converts Data format to GraphData format

package/src/{falkordb-canvas.ts → canvas.ts}

@@ -10,13 +10,14 @@ import {
   GraphNode,
   ForceGraphConfig,
   ViewportState,
-} from "./falkordb-canvas-types.js";
+  Transform,
+} from "./canvas-types.js";
 import {
   dataToGraphData,
   getNodeDisplayText,
   graphDataToData,
   wrapTextForCircularNode,
-} from "./falkordb-canvas-utils.js";
+} from "./canvas-utils.js";
 
 const NODE_SIZE = 6;
 const PADDING = 2;
@@ -100,8 +101,8 @@ class FalkorDBCanvas extends HTMLElement {
     Object.assign(this.config, config);
 
     // Update event handlers if they were provided
-    if (config.onNodeClick || config.onNodeRightClick || config.onLinkRightClick ||
-      config.onNodeHover || config.onLinkHover || config.onBackgroundClick ||
+    if (config.onNodeClick || config.onLinkClick || config.onNodeRightClick || config.onLinkRightClick ||
+      config.onNodeHover || config.onLinkHover || config.onBackgroundClick || config.onBackgroundRightClick || config.onZoom ||
       config.onEngineStop || config.isNodeSelected || config.isLinkSelected) {
       this.updateEventHandlers();
     }
@@ -451,6 +452,16 @@ class FalkorDBCanvas extends HTMLElement {
           this.config.onBackgroundClick(event);
         }
       })
+      .onBackgroundRightClick((event: MouseEvent) => {
+        if (this.config.onBackgroundRightClick) {
+          this.config.onBackgroundRightClick(event);
+        }
+      })
+      .onZoom((transform: Transform) => {
+        if (this.config.onZoom) {
+          this.config.onZoom(transform);
+        }
+      })
       .onEngineStop(() => {
         this.handleEngineStop();
         if (this.config.onEngineStop) {
@@ -763,6 +774,16 @@ class FalkorDBCanvas extends HTMLElement {
           this.config.onBackgroundClick(event);
         }
       })
+      .onBackgroundRightClick((event: MouseEvent) => {
+        if (this.config.onBackgroundRightClick) {
+          this.config.onBackgroundRightClick(event);
+        }
+      })
+      .onZoom((transform: Transform) => {
+        if (this.config.onZoom) {
+          this.config.onZoom(transform);
+        }
+      })
       .onEngineStop(() => {
         this.handleEngineStop();
         if (this.config.onEngineStop) {

package/src/index.ts

@@ -1,4 +1,4 @@
-import FalkorDBCanvas from "./falkordb-canvas.js";
+import FalkorDBCanvas from "./canvas";
 import type React from "react";
 
 declare global {
@@ -31,7 +31,7 @@ export type {
   TextPriority,
   ViewportState,
   ForceGraphInstance,
-} from "./falkordb-canvas-types.js";
+} from "./canvas-types";
 
 // Utils
 export {
@@ -40,4 +40,4 @@ export {
   getNodeDisplayText,
   getNodeDisplayKey,
   wrapTextForCircularNode,
-} from "./falkordb-canvas-utils.js";
+} from "./canvas-utils";