@bruno00o/graph 0.3.0 → 0.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/README.md +2 -2
- package/dist/db.d.ts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +1 -1
- package/dist/{mount-graph-DQLST9-_.d.ts → mount-graph-Br5IAZbP.d.ts} +2 -2
- package/dist/{mount-graph-CzVfiIte.js → mount-graph-mObhwJ3e.js} +279 -170
- package/dist/mount-graph-mObhwJ3e.js.map +1 -0
- package/dist/query.d.ts +1 -1
- package/dist/react.d.ts +2 -2
- package/dist/react.js +1 -1
- package/dist/theme.css +3 -0
- package/dist/{types-BaflHDaf.d.ts → types-DJEdpHUo.d.ts} +6 -1
- package/package.json +1 -1
- package/dist/mount-graph-CzVfiIte.js.map +0 -1
package/README.md
CHANGED
|
@@ -24,7 +24,7 @@ Framework-agnostic, typed graph visualization rendered with WebGL2.
|
|
|
24
24
|
- Declarative marks: map your fields to color, size, labels, arrows and dashes through shared scales, with types inferred from your data
|
|
25
25
|
- Live sources: pass a TanStack DB collection as is, or anything with `subscribeChanges`, and only what changed is redrawn
|
|
26
26
|
- Named states (selection, hover, focus and your own) resolved on the GPU
|
|
27
|
-
- Images and icons clipped to the node shape, corner badges, parallel edges and self loops
|
|
27
|
+
- Images and icons clipped to the node shape, corner badges, outlines, label backgrounds, parallel edges and self loops
|
|
28
28
|
- Drag, pan, zoom, multiple selection and lasso out of the box, plus keyboard navigation announced to screen readers
|
|
29
29
|
- Themed with CSS variables, light and dark
|
|
30
30
|
- A framework-agnostic core with a thin React adapter, plus TanStack DB and TanStack Query integrations
|
|
@@ -109,7 +109,7 @@ nodes(itemsCollection, { color: 'group', label: 'label' })
|
|
|
109
109
|
|
|
110
110
|
## Examples
|
|
111
111
|
|
|
112
|
-
The [`examples`](./examples) folder holds runnable examples: vanilla and React graphs, images and
|
|
112
|
+
The [`examples`](./examples) folder holds runnable examples: vanilla and React graphs, images, badges and outlines, parallel edges and loops, collaboration across tabs with TanStack DB, and neighborhood exploration with TanStack Query. Run them with `pnpm install && pnpm dev`.
|
|
113
113
|
|
|
114
114
|
## Get Involved
|
|
115
115
|
|
package/dist/db.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { i as GraphInstance } from "./mount-graph-
|
|
2
|
-
import { _ as Key, d as FieldOf, k as Point } from "./types-
|
|
1
|
+
import { i as GraphInstance } from "./mount-graph-Br5IAZbP.js";
|
|
2
|
+
import { _ as Key, d as FieldOf, k as Point } from "./types-DJEdpHUo.js";
|
|
3
3
|
import { Collection, MutationFn, Strategy } from "@tanstack/db";
|
|
4
4
|
export interface PersistPositionsOptions<T extends object, TKey extends string | number> {
|
|
5
5
|
readonly collection: Collection<T, TKey>;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { A as ResolvedInteraction, B as View, C as NodeImage, D as NumberScale, E as NodeShape, F as SourceSubscription, I as StateStyle, L as StateStyles, M as ScalesOptions, N as SelectMode, O as NumberScaleType, P as SourceChange, R as Style, S as Mark, T as NodeOptions, _ as Key, a as Channel, b as LabelOptions, c as EdgeDash, d as FieldOf, f as FreeState, g as InteractionOptions, h as GraphDefinitionOptions, i as BuiltInState, j as ResolvedTransitions, k as Point, l as EdgeMark, m as GraphDefinition, n as Badge, o as ColorScale, p as GraphData, r as BadgeCorner, s as EdgeArrow, t as Accessor, u as EdgeOptions, v as KeyChannel, w as NodeMark, x as LiveSource, y as KeyFieldOf, z as TransitionOptions } from "./types-
|
|
2
|
-
import { C as GraphTarget, S as GraphPositionEvent, T as PositionOrigin, _ as GraphEventHandler, a as GraphPositions, b as GraphFocusEvent, c as GraphStates, d as MountGraphOptions, f as ViewOptions, g as GraphDragEvent, h as ElementKeysInput, i as GraphInstance, l as GraphStore, m as ElementKeys, n as GraphElement, o as GraphSelection, p as mountGraph, r as GraphFocus, s as GraphState, t as FitOptions, u as GraphView, v as GraphEventName, w as GraphTargetEvent, x as GraphPointerEvent, y as GraphEvents } from "./mount-graph-
|
|
1
|
+
import { A as ResolvedInteraction, B as View, C as NodeImage, D as NumberScale, E as NodeShape, F as SourceSubscription, I as StateStyle, L as StateStyles, M as ScalesOptions, N as SelectMode, O as NumberScaleType, P as SourceChange, R as Style, S as Mark, T as NodeOptions, _ as Key, a as Channel, b as LabelOptions, c as EdgeDash, d as FieldOf, f as FreeState, g as InteractionOptions, h as GraphDefinitionOptions, i as BuiltInState, j as ResolvedTransitions, k as Point, l as EdgeMark, m as GraphDefinition, n as Badge, o as ColorScale, p as GraphData, r as BadgeCorner, s as EdgeArrow, t as Accessor, u as EdgeOptions, v as KeyChannel, w as NodeMark, x as LiveSource, y as KeyFieldOf, z as TransitionOptions } from "./types-DJEdpHUo.js";
|
|
2
|
+
import { C as GraphTarget, S as GraphPositionEvent, T as PositionOrigin, _ as GraphEventHandler, a as GraphPositions, b as GraphFocusEvent, c as GraphStates, d as MountGraphOptions, f as ViewOptions, g as GraphDragEvent, h as ElementKeysInput, i as GraphInstance, l as GraphStore, m as ElementKeys, n as GraphElement, o as GraphSelection, p as mountGraph, r as GraphFocus, s as GraphState, t as FitOptions, u as GraphView, v as GraphEventName, w as GraphTargetEvent, x as GraphPointerEvent, y as GraphEvents } from "./mount-graph-Br5IAZbP.js";
|
|
3
3
|
export declare function defineGraph<S extends string = never>(options: GraphDefinitionOptions<S>): GraphDefinition<S>;
|
|
4
4
|
export declare function nodes<T>(data: LiveSource<T>, options?: NodeOptions<NoInfer<T>>): NodeMark<T>;
|
|
5
5
|
export declare function nodes<T extends {
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { n as freeStateNames, r as maxFreeStates, t as mountGraph } from "./mount-graph-
|
|
1
|
+
import { n as freeStateNames, r as maxFreeStates, t as mountGraph } from "./mount-graph-mObhwJ3e.js";
|
|
2
2
|
// src/define-graph.ts
|
|
3
3
|
const defaultZoomSpeed = 1;
|
|
4
4
|
const defaultPositionTransition = 120;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { B as View, _ as Key, f as FreeState, k as Point, m as GraphDefinition } from "./types-
|
|
1
|
+
import { B as View, _ as Key, f as FreeState, k as Point, m as GraphDefinition } from "./types-DJEdpHUo.js";
|
|
2
2
|
import { ReadonlyStore } from "@tanstack/store";
|
|
3
3
|
interface Endpoints {
|
|
4
4
|
readonly source: Key;
|
|
@@ -140,4 +140,4 @@ interface GraphInstance<S extends string = string> {
|
|
|
140
140
|
}
|
|
141
141
|
declare function mountGraph<S extends string = string>(container: HTMLElement, options: MountGraphOptions<S>): GraphInstance<S>;
|
|
142
142
|
export { GraphTarget as C, GraphPositionEvent as S, PositionOrigin as T, GraphEventHandler as _, GraphPositions as a, GraphFocusEvent as b, GraphStates as c, MountGraphOptions as d, ViewOptions as f, GraphDragEvent as g, ElementKeysInput as h, GraphInstance as i, GraphStore as l, ElementKeys as m, GraphElement as n, GraphSelection as o, mountGraph as p, GraphFocus as r, GraphState as s, FitOptions as t, GraphView as u, GraphEventName as v, GraphTargetEvent as w, GraphPointerEvent as x, GraphEvents as y };
|
|
143
|
-
//# sourceMappingURL=mount-graph-
|
|
143
|
+
//# sourceMappingURL=mount-graph-Br5IAZbP.d.ts.map
|