@cocorof/graphier 1.3.3 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -4,6 +4,7 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
4
4
  import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
5
5
  import { ReactNode } from 'react';
6
6
  import { RefAttributes } from 'react';
7
+ import { RefObject } from 'react';
7
8
  import * as THREE from 'three';
8
9
 
9
10
  /** Smoothly animate camera to a new position/target using ease-out */
@@ -66,6 +67,29 @@ export declare interface GraphLink {
66
67
  [key: string]: unknown;
67
68
  }
68
69
 
70
+ export declare function GraphMinimap({ graphRef, width, height, backgroundColor, viewportColor, dotRadius, fps, padding, className, style, }: GraphMinimapProps): JSX_2.Element;
71
+
72
+ export declare interface GraphMinimapProps {
73
+ /** Ref to the NetworkGraph3D instance to mirror */
74
+ graphRef: RefObject<NetworkGraph3DRef | null>;
75
+ /** Canvas CSS width in px (default: 200) */
76
+ width?: number;
77
+ /** Canvas CSS height in px (default: 140) */
78
+ height?: number;
79
+ /** Background fill (default: transparent) */
80
+ backgroundColor?: string;
81
+ /** Viewport rectangle stroke color (default: "#94a3b8") */
82
+ viewportColor?: string;
83
+ /** Dot radius in px (default: 1.5) */
84
+ dotRadius?: number;
85
+ /** Redraw rate in frames per second (default: 15) */
86
+ fps?: number;
87
+ /** Fraction of canvas kept as padding around the graph (default: 0.08) */
88
+ padding?: number;
89
+ className?: string;
90
+ style?: CSSProperties;
91
+ }
92
+
69
93
  /**
70
94
  * Core graph data types — domain-agnostic.
71
95
  * Users provide any `type` string ("person", "server", "repo", etc.)
@@ -86,6 +110,20 @@ export declare interface GraphNode {
86
110
  [key: string]: unknown;
87
111
  }
88
112
 
113
+ /** Raw per-frame node buffers for lightweight overlays (e.g. minimap) */
114
+ export declare interface GraphSnapshot {
115
+ /** xyz triplets, one per node (live buffer — do not mutate) */
116
+ positions: Float32Array;
117
+ /** Node count */
118
+ count: number;
119
+ /** rgb triplets per node from the instanced mesh (live buffer) */
120
+ colors: Float32Array | null;
121
+ /** 1 = hidden by the visibility filter (live buffer) */
122
+ hidden: Uint8Array | null;
123
+ /** Index of the selected node, -1 if none */
124
+ selectedIndex: number;
125
+ }
126
+
89
127
  /**
90
128
  * Layout engine configuration.
91
129
  */
@@ -109,6 +147,21 @@ export declare interface LayoutConfig {
109
147
  * (default: "auto")
110
148
  */
111
149
  spreadFactor?: "auto" | number;
150
+ /**
151
+ * Layout dimensionality (default: 3).
152
+ * 2 = flat Obsidian-style plane: the simulation runs in 2D (z is locked
153
+ * to 0), the camera is locked to pan/zoom (no rotation), and dragging
154
+ * stays on the plane.
155
+ */
156
+ dimensions?: 2 | 3;
157
+ /**
158
+ * Pull nodes that share the same key toward a common centroid so
159
+ * categories form visible clusters ("type" reads node.type, "group"
160
+ * reads node.group). null/undefined = off (default).
161
+ */
162
+ clusterBy?: "type" | "group" | null;
163
+ /** Cluster attraction strength 0..1 (default: 0.05). */
164
+ clusterStrength?: number;
112
165
  }
113
166
 
114
167
  /** Layout settled callback */
@@ -164,6 +217,25 @@ export declare interface NetworkGraph3DProps {
164
217
  labelFormatter?: (node: GraphNode) => string;
165
218
  /** Custom node size accessor (overrides node.val) */
166
219
  nodeValueAccessor?: (node: GraphNode) => number;
220
+ /**
221
+ * Client-side filter: IDs of nodes to keep visible. Hidden nodes (and
222
+ * their edges/labels) vanish WITHOUT re-running the force layout —
223
+ * positions are preserved, so toggling filters never reheats the graph.
224
+ * null/undefined shows everything.
225
+ */
226
+ visibleNodeIds?: ReadonlySet<string> | string[] | null;
227
+ /**
228
+ * Client-side edge filter: return false to hide a link (e.g. by type).
229
+ * Same reheat-free mechanism as visibleNodeIds — collapsed segments,
230
+ * simulation untouched. null/undefined shows all edges.
231
+ */
232
+ linkVisibility?: ((link: GraphLink) => boolean) | null;
233
+ /** Fly the camera to a node on single-click (default: true) */
234
+ clickToFocus?: boolean;
235
+ /** Highlight a node's neighborhood on hover when nothing is selected (default: false) */
236
+ hoverHighlight?: boolean;
237
+ /** Hops highlighted around the hovered node (default: 1) */
238
+ hoverHighlightHops?: number;
167
239
  }
168
240
 
169
241
  export declare interface NetworkGraph3DRef {
@@ -201,6 +273,12 @@ export declare interface NetworkGraph3DRef {
201
273
  captureScreenshot(): string | null;
202
274
  /** Re-run force layout from current positions (useful after changing spreadFactor) */
203
275
  reheatLayout(): void;
276
+ /** Pan the camera to world (x, y), keeping the current zoom (2D-friendly) */
277
+ panTo(x: number, y: number, duration?: number): void;
278
+ /** Node position/color/visibility buffers for overlays like GraphMinimap */
279
+ getGraphSnapshot(): GraphSnapshot | null;
280
+ /** Current camera footprint on the z=0 plane (meaningful in 2D mode) */
281
+ getViewportRect(): ViewportRect | null;
204
282
  }
205
283
 
206
284
  export declare function NodeDetailPanel(props: NodeDetailPanelProps): JSX_2.Element;
@@ -237,6 +315,8 @@ export declare type NullableLinkEventHandler = (link: GraphLink | null) => void;
237
315
 
238
316
  export declare type NullableNodeEventHandler = (node: GraphNode | null) => void;
239
317
 
318
+ export declare const paper: ThemeConfig;
319
+
240
320
  /** Runtime node with layout positions (internal) */
241
321
  export declare interface PositionedNode extends GraphNode {
242
322
  x?: number;
@@ -262,6 +342,10 @@ export declare interface ResolvedTheme {
262
342
  nodeColorBright(type?: string): string;
263
343
  linkColor(type?: string): string;
264
344
  backgroundColor: string;
345
+ /** True when the background is light — flips highlight/dim direction */
346
+ isLight: boolean;
347
+ /** Whether edges should use additive blending (dark backgrounds only) */
348
+ additiveEdges: boolean;
265
349
  }
266
350
 
267
351
  export declare function resolveTheme(theme?: ThemeConfig | string): ResolvedTheme;
@@ -357,6 +441,20 @@ export declare interface ThemeConfig {
357
441
  backgroundColor?: string;
358
442
  /** Color palette for auto-assignment when type has no explicit mapping */
359
443
  palette?: string[];
444
+ /**
445
+ * Edge blend mode. "additive" glows on dark backgrounds; "normal" is
446
+ * required for light backgrounds (additive lines vanish on white).
447
+ * Default: "additive" on dark backgrounds, "normal" on light ones.
448
+ */
449
+ blending?: "additive" | "normal";
450
+ }
451
+
452
+ /** Camera frustum footprint on the z=0 plane (world units) */
453
+ export declare interface ViewportRect {
454
+ cx: number;
455
+ cy: number;
456
+ halfW: number;
457
+ halfH: number;
360
458
  }
361
459
 
362
460
  /** Compute camera position to fit all nodes in view */