@bruno00o/graph 0.0.0-stage → 0.1.0

package/dist/query.d.ts

@@ -0,0 +1,30 @@
+import { _ as Key, x as LiveSource } from "./types-D6b86Rt1.js";
+import { ReadonlyStore } from "@tanstack/store";
+import { DefaultError, QueryClient, QueryKey, QueryObserverOptions } from "@tanstack/query-core";
+export interface ExplorationData<TNode, TEdge> {
+  readonly nodes: readonly TNode[];
+  readonly edges: readonly TEdge[];
+}
+export interface ExplorationOptions<TNode, TEdge, TQueryFnData = ExplorationData<TNode, TEdge>, TError = DefaultError, TQueryKey extends QueryKey = QueryKey> {
+  readonly roots: Iterable<Key>;
+  readonly neighbors: (key: Key) => QueryObserverOptions<TQueryFnData, TError, ExplorationData<TNode, TEdge>, TQueryFnData, TQueryKey>;
+  readonly nodeKey?: (node: TNode) => Key;
+  readonly edgeKey?: (edge: TEdge) => Key;
+}
+export interface ExplorationState {
+  readonly expanded: readonly Key[];
+  readonly loading: readonly Key[];
+  readonly errors: ReadonlyMap<Key, unknown>;
+}
+export interface Exploration<TNode, TEdge> {
+  readonly nodes: LiveSource<TNode>;
+  readonly edges: LiveSource<TEdge>;
+  readonly store: ReadonlyStore<ExplorationState>;
+  expand(key: Key): void;
+  collapse(key: Key): void;
+  toggle(key: Key): void;
+  reset(): void;
+  destroy(): void;
+}
+export declare function createExploration<TNode, TEdge, TQueryFnData = ExplorationData<TNode, TEdge>, TError = DefaultError, TQueryKey extends QueryKey = QueryKey>(client: QueryClient, options: ExplorationOptions<TNode, TEdge, TQueryFnData, TError, TQueryKey>): Exploration<TNode, TEdge>;
+//# sourceMappingURL=query.d.ts.map

package/dist/query.js

@@ -0,0 +1,182 @@
+import { createStore } from "@tanstack/store";
+import { QueryObserver } from "@tanstack/query-core";
+// src/query/index.ts
+var ElementSource = class {
+	values = /* @__PURE__ */ new Map();
+	holders = /* @__PURE__ */ new Map();
+	#listeners = /* @__PURE__ */ new Set();
+	#onActive;
+	constructor(onActive) {
+		this.#onActive = onActive;
+	}
+	subscribeChanges(callback, options) {
+		this.#listeners.add(callback);
+		if (options?.includeInitialState && this.values.size > 0) callback([...this.values].map(([key, value]) => ({
+			type: "insert",
+			key,
+			value
+		})));
+		this.#onActive(1);
+		let active = true;
+		return { unsubscribe: () => {
+			if (!active) return;
+			active = false;
+			this.#listeners.delete(callback);
+			this.#onActive(-1);
+		} };
+	}
+	hold(owner, items, changes) {
+		for (const [key, value] of items) {
+			let holders = this.holders.get(key);
+			if (!holders) {
+				holders = /* @__PURE__ */ new Set();
+				this.holders.set(key, holders);
+			}
+			holders.add(owner);
+			const previous = this.values.get(key);
+			if (previous === value) continue;
+			this.values.set(key, value);
+			changes.push({
+				type: previous === void 0 ? "insert" : "update",
+				key,
+				value
+			});
+		}
+	}
+	release(owner, keys, pinned, changes) {
+		for (const key of keys) {
+			const holders = this.holders.get(key);
+			if (!holders?.delete(owner) || holders.size > 0 || pinned.has(key)) continue;
+			this.holders.delete(key);
+			const value = this.values.get(key);
+			this.values.delete(key);
+			if (value !== void 0) changes.push({
+				type: "delete",
+				key,
+				value
+			});
+		}
+	}
+	emit(changes) {
+		if (changes.length === 0) return;
+		for (const listener of [...this.#listeners]) listener(changes);
+	}
+};
+function defaultKey(item) {
+	return item.id;
+}
+function createExploration(client, options) {
+	const nodeKey = options.nodeKey ?? defaultKey;
+	const edgeKey = options.edgeKey ?? defaultKey;
+	const roots = new Set(options.roots);
+	const expansions = /* @__PURE__ */ new Map();
+	let subscribers = 0;
+	let destroyed = false;
+	const onActive = (delta) => {
+		const before = subscribers;
+		subscribers += delta;
+		if (before === 0 && subscribers > 0) for (const key of expansions.keys()) start(key);
+		if (before > 0 && subscribers === 0) for (const expansion of expansions.values()) halt(expansion);
+	};
+	const nodes = new ElementSource(onActive);
+	const edges = new ElementSource(onActive);
+	const store = createStore({
+		expanded: [],
+		loading: [],
+		errors: /* @__PURE__ */ new Map()
+	});
+	const readonlyStore = createStore(() => store.state);
+	function publish() {
+		const loading = [];
+		const errors = /* @__PURE__ */ new Map();
+		for (const [key, expansion] of expansions) {
+			const result = expansion.observer.getCurrentResult();
+			if (result.isFetching) loading.push(key);
+			if (result.error) errors.set(key, result.error);
+		}
+		store.setState(() => ({
+			expanded: [...expansions.keys()],
+			loading,
+			errors
+		}));
+	}
+	function apply(key, data) {
+		const expansion = expansions.get(key);
+		if (!expansion || !data) return;
+		const nodeItems = /* @__PURE__ */ new Map();
+		for (const node of data.nodes) nodeItems.set(nodeKey(node), node);
+		const edgeItems = /* @__PURE__ */ new Map();
+		for (const edge of data.edges) edgeItems.set(edgeKey(edge), edge);
+		const nodeChanges = [];
+		const edgeChanges = [];
+		nodes.hold(key, nodeItems, nodeChanges);
+		edges.hold(key, edgeItems, edgeChanges);
+		nodes.holders.get(key)?.add(key);
+		edges.release(key, [...expansion.edges].filter((edge) => !edgeItems.has(edge)), /* @__PURE__ */ new Set(), edgeChanges);
+		nodes.release(key, [...expansion.nodes].filter((node) => node !== key && !nodeItems.has(node)), roots, nodeChanges);
+		expansion.nodes = /* @__PURE__ */ new Set([...nodeItems.keys(), key]);
+		expansion.edges = new Set(edgeItems.keys());
+		nodes.emit(nodeChanges);
+		edges.emit(edgeChanges);
+	}
+	function start(key) {
+		const expansion = expansions.get(key);
+		if (!expansion || expansion.stop || destroyed) return;
+		const { observer } = expansion;
+		expansion.stop = observer.subscribe((result) => {
+			apply(key, result.data);
+			publish();
+		});
+		apply(key, observer.getCurrentResult().data);
+		publish();
+	}
+	function halt(expansion) {
+		expansion.stop?.();
+		expansion.stop = null;
+	}
+	function expand(key) {
+		if (destroyed || expansions.has(key)) return;
+		const observer = new QueryObserver(client, options.neighbors(key));
+		expansions.set(key, {
+			observer,
+			stop: null,
+			nodes: /* @__PURE__ */ new Set([key]),
+			edges: /* @__PURE__ */ new Set()
+		});
+		if (subscribers > 0) start(key);
+		else publish();
+	}
+	function collapse(key) {
+		const expansion = expansions.get(key);
+		if (!expansion) return;
+		halt(expansion);
+		expansions.delete(key);
+		const nodeChanges = [];
+		const edgeChanges = [];
+		edges.release(key, expansion.edges, /* @__PURE__ */ new Set(), edgeChanges);
+		nodes.release(key, expansion.nodes, roots, nodeChanges);
+		edges.emit(edgeChanges);
+		nodes.emit(nodeChanges);
+		publish();
+	}
+	for (const root of roots) expand(root);
+	return {
+		nodes,
+		edges,
+		store: readonlyStore,
+		expand,
+		collapse,
+		toggle: (key) => expansions.has(key) ? collapse(key) : expand(key),
+		reset() {
+			for (const key of [...expansions.keys()]) if (!roots.has(key)) collapse(key);
+			for (const root of roots) expand(root);
+		},
+		destroy() {
+			for (const expansion of expansions.values()) halt(expansion);
+			destroyed = true;
+		}
+	};
+}
+export { createExploration };
+
+//# sourceMappingURL=query.js.map

package/dist/query.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"query.js","names":[],"sources":["../src/query/index.ts"],"sourcesContent":["import {\n  type DefaultError,\n  type QueryClient,\n  type QueryKey,\n  QueryObserver,\n  type QueryObserverOptions,\n} from '@tanstack/query-core'\nimport { createStore, type ReadonlyStore } from '@tanstack/store'\nimport type { Key, LiveSource, SourceChange, SourceSubscription } from '../types'\n\nexport interface ExplorationData<TNode, TEdge> {\n  readonly nodes: readonly TNode[]\n  readonly edges: readonly TEdge[]\n}\n\nexport interface ExplorationOptions<\n  TNode,\n  TEdge,\n  TQueryFnData = ExplorationData<TNode, TEdge>,\n  TError = DefaultError,\n  TQueryKey extends QueryKey = QueryKey,\n> {\n  readonly roots: Iterable<Key>\n  readonly neighbors: (\n    key: Key,\n  ) => QueryObserverOptions<\n    TQueryFnData,\n    TError,\n    ExplorationData<TNode, TEdge>,\n    TQueryFnData,\n    TQueryKey\n  >\n  readonly nodeKey?: (node: TNode) => Key\n  readonly edgeKey?: (edge: TEdge) => Key\n}\n\nexport interface ExplorationState {\n  readonly expanded: readonly Key[]\n  readonly loading: readonly Key[]\n  readonly errors: ReadonlyMap<Key, unknown>\n}\n\nexport interface Exploration<TNode, TEdge> {\n  readonly nodes: LiveSource<TNode>\n  readonly edges: LiveSource<TEdge>\n  readonly store: ReadonlyStore<ExplorationState>\n  expand(key: Key): void\n  collapse(key: Key): void\n  toggle(key: Key): void\n  reset(): void\n  destroy(): void\n}\n\ntype Listener<T> = (changes: ReadonlyArray<SourceChange<T>>) => void\n\nclass ElementSource<T> implements LiveSource<T> {\n  readonly values = new Map<Key, T>()\n  readonly holders = new Map<Key, Set<Key>>()\n  readonly #listeners = new Set<Listener<T>>()\n  readonly #onActive: (delta: number) => void\n\n  constructor(onActive: (delta: number) => void) {\n    this.#onActive = onActive\n  }\n\n  subscribeChanges(\n    callback: Listener<T>,\n    options?: { includeInitialState?: boolean },\n  ): SourceSubscription {\n    this.#listeners.add(callback)\n    if (options?.includeInitialState && this.values.size > 0) {\n      callback([...this.values].map(([key, value]) => ({ type: 'insert', key, value })))\n    }\n    this.#onActive(1)\n    let active = true\n    return {\n      unsubscribe: () => {\n        if (!active) return\n        active = false\n        this.#listeners.delete(callback)\n        this.#onActive(-1)\n      },\n    }\n  }\n\n  hold(owner: Key, items: ReadonlyMap<Key, T>, changes: SourceChange<T>[]): void {\n    for (const [key, value] of items) {\n      let holders = this.holders.get(key)\n      if (!holders) {\n        holders = new Set()\n        this.holders.set(key, holders)\n      }\n      holders.add(owner)\n      const previous = this.values.get(key)\n      if (previous === value) continue\n      this.values.set(key, value)\n      changes.push({ type: previous === undefined ? 'insert' : 'update', key, value })\n    }\n  }\n\n  release(owner: Key, keys: Iterable<Key>, pinned: ReadonlySet<Key>, changes: SourceChange<T>[]) {\n    for (const key of keys) {\n      const holders = this.holders.get(key)\n      if (!holders?.delete(owner) || holders.size > 0 || pinned.has(key)) continue\n      this.holders.delete(key)\n      const value = this.values.get(key)\n      this.values.delete(key)\n      if (value !== undefined) changes.push({ type: 'delete', key, value })\n    }\n  }\n\n  emit(changes: ReadonlyArray<SourceChange<T>>): void {\n    if (changes.length === 0) return\n    for (const listener of [...this.#listeners]) listener(changes)\n  }\n}\n\nfunction defaultKey(item: unknown): Key {\n  return (item as { readonly id: Key }).id\n}\n\nexport function createExploration<\n  TNode,\n  TEdge,\n  TQueryFnData = ExplorationData<TNode, TEdge>,\n  TError = DefaultError,\n  TQueryKey extends QueryKey = QueryKey,\n>(\n  client: QueryClient,\n  options: ExplorationOptions<TNode, TEdge, TQueryFnData, TError, TQueryKey>,\n): Exploration<TNode, TEdge> {\n  type Observer = QueryObserver<\n    TQueryFnData,\n    TError,\n    ExplorationData<TNode, TEdge>,\n    TQueryFnData,\n    TQueryKey\n  >\n  interface Expansion {\n    readonly observer: Observer\n    stop: (() => void) | null\n    nodes: Set<Key>\n    edges: Set<Key>\n  }\n  const nodeKey = options.nodeKey ?? defaultKey\n  const edgeKey = options.edgeKey ?? defaultKey\n  const roots = new Set(options.roots)\n  const expansions = new Map<Key, Expansion>()\n  let subscribers = 0\n  let destroyed = false\n\n  const onActive = (delta: number) => {\n    const before = subscribers\n    subscribers += delta\n    if (before === 0 && subscribers > 0) for (const key of expansions.keys()) start(key)\n    if (before > 0 && subscribers === 0)\n      for (const expansion of expansions.values()) halt(expansion)\n  }\n  const nodes = new ElementSource<TNode>(onActive)\n  const edges = new ElementSource<TEdge>(onActive)\n\n  const store = createStore<ExplorationState>({ expanded: [], loading: [], errors: new Map() })\n  const readonlyStore: ReadonlyStore<ExplorationState> = createStore(() => store.state)\n\n  function publish(): void {\n    const loading: Key[] = []\n    const errors = new Map<Key, unknown>()\n    for (const [key, expansion] of expansions) {\n      const result = expansion.observer.getCurrentResult()\n      if (result.isFetching) loading.push(key)\n      if (result.error) errors.set(key, result.error)\n    }\n    store.setState(() => ({ expanded: [...expansions.keys()], loading, errors }))\n  }\n\n  function apply(key: Key, data: ExplorationData<TNode, TEdge> | undefined): void {\n    const expansion = expansions.get(key)\n    if (!expansion || !data) return\n    const nodeItems = new Map<Key, TNode>()\n    for (const node of data.nodes) nodeItems.set(nodeKey(node), node)\n    const edgeItems = new Map<Key, TEdge>()\n    for (const edge of data.edges) edgeItems.set(edgeKey(edge), edge)\n    const nodeChanges: SourceChange<TNode>[] = []\n    const edgeChanges: SourceChange<TEdge>[] = []\n    nodes.hold(key, nodeItems, nodeChanges)\n    edges.hold(key, edgeItems, edgeChanges)\n    nodes.holders.get(key)?.add(key)\n    edges.release(\n      key,\n      [...expansion.edges].filter((edge) => !edgeItems.has(edge)),\n      new Set(),\n      edgeChanges,\n    )\n    nodes.release(\n      key,\n      [...expansion.nodes].filter((node) => node !== key && !nodeItems.has(node)),\n      roots,\n      nodeChanges,\n    )\n    expansion.nodes = new Set([...nodeItems.keys(), key])\n    expansion.edges = new Set(edgeItems.keys())\n    nodes.emit(nodeChanges)\n    edges.emit(edgeChanges)\n  }\n\n  function start(key: Key): void {\n    const expansion = expansions.get(key)\n    if (!expansion || expansion.stop || destroyed) return\n    const { observer } = expansion\n    expansion.stop = observer.subscribe((result) => {\n      apply(key, result.data)\n      publish()\n    })\n    apply(key, observer.getCurrentResult().data)\n    publish()\n  }\n\n  function halt(expansion: Expansion): void {\n    expansion.stop?.()\n    expansion.stop = null\n  }\n\n  function expand(key: Key): void {\n    if (destroyed || expansions.has(key)) return\n    const observer = new QueryObserver(client, options.neighbors(key))\n    expansions.set(key, { observer, stop: null, nodes: new Set([key]), edges: new Set() })\n    if (subscribers > 0) start(key)\n    else publish()\n  }\n\n  function collapse(key: Key): void {\n    const expansion = expansions.get(key)\n    if (!expansion) return\n    halt(expansion)\n    expansions.delete(key)\n    const nodeChanges: SourceChange<TNode>[] = []\n    const edgeChanges: SourceChange<TEdge>[] = []\n    edges.release(key, expansion.edges, new Set(), edgeChanges)\n    nodes.release(key, expansion.nodes, roots, nodeChanges)\n    edges.emit(edgeChanges)\n    nodes.emit(nodeChanges)\n    publish()\n  }\n\n  for (const root of roots) expand(root)\n\n  return {\n    nodes,\n    edges,\n    store: readonlyStore,\n    expand,\n    collapse,\n    toggle: (key) => (expansions.has(key) ? collapse(key) : expand(key)),\n    reset() {\n      for (const key of [...expansions.keys()]) if (!roots.has(key)) collapse(key)\n      for (const root of roots) expand(root)\n    },\n    destroy() {\n      for (const expansion of expansions.values()) halt(expansion)\n      destroyed = true\n    },\n  }\n}\n"],"mappings":"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"}

package/dist/react.d.ts

@@ -0,0 +1,35 @@
+import { _ as GraphEventName, c as GraphStore, g as GraphEventHandler, m as ElementKeysInput, o as GraphState, r as GraphInstance } from "./mount-graph-B88WGOQu.js";
+import { m as GraphDefinition, z as View } from "./types-D6b86Rt1.js";
+import { CSSProperties, JSX, ReactNode, Ref } from "react";
+export interface GraphEventProps {
+  readonly onClick?: GraphEventHandler<"click">;
+  readonly onDoubleClick?: GraphEventHandler<"doubleclick">;
+  readonly onContextMenu?: GraphEventHandler<"contextmenu">;
+  readonly onPointerEnter?: GraphEventHandler<"pointerenter">;
+  readonly onPointerLeave?: GraphEventHandler<"pointerleave">;
+  readonly onDragStart?: GraphEventHandler<"dragstart">;
+  readonly onDrag?: GraphEventHandler<"drag">;
+  readonly onDragEnd?: GraphEventHandler<"dragend">;
+  readonly onPositionChange?: GraphEventHandler<"positionchange">;
+  readonly onSelectionChange?: GraphEventHandler<"selectionchange">;
+  readonly onViewChange?: GraphEventHandler<"viewchange">;
+}
+export interface GraphProps<S extends string = string> extends GraphEventProps {
+  readonly definition: GraphDefinition<S>;
+  readonly ariaLabel: string;
+  readonly initialView?: View;
+  readonly selection?: ElementKeysInput;
+  readonly className?: string;
+  readonly style?: CSSProperties;
+  readonly ref?: Ref<GraphInstance<S> | null>;
+  readonly children?: ReactNode;
+}
+export declare function Graph<S extends string = string>(props: GraphProps<S>): JSX.Element;
+export declare function useGraph(): GraphInstance;
+export interface UseGraphStateOptions<T> {
+  readonly compare?: (a: T, b: T) => boolean;
+}
+export declare function useGraphState<T>(selector: (state: GraphState) => T, options?: UseGraphStateOptions<T>): T;
+export declare function useGraphEvent<K extends GraphEventName>(name: K, handler: GraphEventHandler<K>): void;
+export type { GraphInstance, GraphState, GraphStore };
+//# sourceMappingURL=react.d.ts.map

package/dist/react.js

@@ -0,0 +1,132 @@
+import { t as mountGraph } from "./mount-graph-BHwq3LOr.js";
+import { createContext, useCallback, useContext, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/react/index.tsx
+const eventProps = {
+	click: "onClick",
+	doubleclick: "onDoubleClick",
+	contextmenu: "onContextMenu",
+	pointerenter: "onPointerEnter",
+	pointerleave: "onPointerLeave",
+	dragstart: "onDragStart",
+	drag: "onDrag",
+	dragend: "onDragEnd",
+	positionchange: "onPositionChange",
+	selectionchange: "onSelectionChange",
+	viewchange: "onViewChange"
+};
+const GraphContext = createContext(null);
+const fill = {
+	position: "absolute",
+	inset: 0
+};
+function useLatest(value) {
+	const latest = useRef(value);
+	useLayoutEffect(() => {
+		latest.current = value;
+	});
+	return latest;
+}
+function Graph(props) {
+	const { definition, ariaLabel, selection, className, style, ref, children } = props;
+	const host = useRef(null);
+	const [graph, setGraph] = useState(null);
+	const latest = useLatest(props);
+	useLayoutEffect(() => {
+		const element = host.current;
+		if (!element) return;
+		const initial = latest.current;
+		const instance = mountGraph(element, {
+			definition: initial.definition,
+			ariaLabel: initial.ariaLabel,
+			...initial.initialView ? { initialView: initial.initialView } : {},
+			...initial.selection !== void 0 ? {
+				selection: initial.selection,
+				onSelectionChange: (next) => latest.current.onSelectionChange?.(next)
+			} : {}
+		});
+		setGraph(instance);
+		return () => {
+			instance.destroy();
+			setGraph(null);
+		};
+	}, [latest]);
+	useLayoutEffect(() => {
+		graph?.update({
+			definition,
+			ariaLabel,
+			...selection !== void 0 ? { selection } : {}
+		});
+	}, [
+		graph,
+		definition,
+		ariaLabel,
+		selection
+	]);
+	useEffect(() => {
+		if (!graph) return;
+		const stops = Object.keys(eventProps).map((name) => graph.on(name, (event) => {
+			if (name === "selectionchange" && latest.current.selection !== void 0) return;
+			const handler = latest.current[eventProps[name]];
+			handler?.(event);
+		}));
+		return () => {
+			for (const stop of stops) stop();
+		};
+	}, [graph, latest]);
+	useImperativeHandle(ref, () => graph, [graph]);
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		style: {
+			position: "relative",
+			...style
+		},
+		children: [/* @__PURE__ */ jsx("div", {
+			ref: host,
+			style: fill
+		}), graph ? /* @__PURE__ */ jsx(GraphContext, {
+			value: graph,
+			children
+		}) : null]
+	});
+}
+function useGraph() {
+	const graph = useContext(GraphContext);
+	if (!graph) throw new Error("useGraph: call it inside <Graph>");
+	return graph;
+}
+function useGraphState(selector, options = {}) {
+	const compare = options.compare ?? Object.is;
+	const graph = useGraph();
+	const cache = useRef(null);
+	const subscribe = useCallback((notify) => {
+		const subscription = graph.store.subscribe(() => notify());
+		return () => subscription.unsubscribe();
+	}, [graph]);
+	const snapshot = () => {
+		const state = graph.store.get();
+		const cached = cache.current;
+		if (cached && cached.state === state && cached.selector === selector) return cached.value;
+		const value = selector(state);
+		const kept = cached && compare(cached.value, value) ? cached.value : value;
+		cache.current = {
+			state,
+			selector,
+			value: kept
+		};
+		return kept;
+	};
+	return useSyncExternalStore(subscribe, snapshot, snapshot);
+}
+function useGraphEvent(name, handler) {
+	const graph = useGraph();
+	const latest = useLatest(handler);
+	useEffect(() => graph.on(name, (event) => latest.current(event)), [
+		graph,
+		name,
+		latest
+	]);
+}
+export { Graph, useGraph, useGraphEvent, useGraphState };
+
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.js","names":[],"sources":["../src/react/index.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  createContext,\n  type JSX,\n  type ReactNode,\n  type Ref,\n  useCallback,\n  useContext,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useRef,\n  useState,\n  useSyncExternalStore,\n} from 'react'\nimport type {\n  ElementKeysInput,\n  GraphEventHandler,\n  GraphEventName,\n  GraphEvents,\n} from '../host/events'\nimport {\n  type GraphInstance,\n  type GraphState,\n  type GraphStore,\n  mountGraph,\n} from '../host/mount-graph'\nimport type { GraphDefinition, View } from '../types'\n\nexport interface GraphEventProps {\n  readonly onClick?: GraphEventHandler<'click'>\n  readonly onDoubleClick?: GraphEventHandler<'doubleclick'>\n  readonly onContextMenu?: GraphEventHandler<'contextmenu'>\n  readonly onPointerEnter?: GraphEventHandler<'pointerenter'>\n  readonly onPointerLeave?: GraphEventHandler<'pointerleave'>\n  readonly onDragStart?: GraphEventHandler<'dragstart'>\n  readonly onDrag?: GraphEventHandler<'drag'>\n  readonly onDragEnd?: GraphEventHandler<'dragend'>\n  readonly onPositionChange?: GraphEventHandler<'positionchange'>\n  readonly onSelectionChange?: GraphEventHandler<'selectionchange'>\n  readonly onViewChange?: GraphEventHandler<'viewchange'>\n}\n\nconst eventProps: Readonly<Record<GraphEventName, keyof GraphEventProps>> = {\n  click: 'onClick',\n  doubleclick: 'onDoubleClick',\n  contextmenu: 'onContextMenu',\n  pointerenter: 'onPointerEnter',\n  pointerleave: 'onPointerLeave',\n  dragstart: 'onDragStart',\n  drag: 'onDrag',\n  dragend: 'onDragEnd',\n  positionchange: 'onPositionChange',\n  selectionchange: 'onSelectionChange',\n  viewchange: 'onViewChange',\n}\n\nexport interface GraphProps<S extends string = string> extends GraphEventProps {\n  readonly definition: GraphDefinition<S>\n  readonly ariaLabel: string\n  readonly initialView?: View\n  readonly selection?: ElementKeysInput\n  readonly className?: string\n  readonly style?: CSSProperties\n  readonly ref?: Ref<GraphInstance<S> | null>\n  readonly children?: ReactNode\n}\n\nconst GraphContext = createContext<GraphInstance | null>(null)\n\nconst fill: CSSProperties = { position: 'absolute', inset: 0 }\n\nfunction useLatest<T>(value: T): { readonly current: T } {\n  const latest = useRef(value)\n  useLayoutEffect(() => {\n    latest.current = value\n  })\n  return latest\n}\n\nexport function Graph<S extends string = string>(props: GraphProps<S>): JSX.Element {\n  const { definition, ariaLabel, selection, className, style, ref, children } = props\n  const host = useRef<HTMLDivElement>(null)\n  const [graph, setGraph] = useState<GraphInstance<S> | null>(null)\n  const latest = useLatest(props)\n\n  useLayoutEffect(() => {\n    const element = host.current\n    if (!element) return\n    const initial = latest.current\n    const instance = mountGraph(element, {\n      definition: initial.definition,\n      ariaLabel: initial.ariaLabel,\n      ...(initial.initialView ? { initialView: initial.initialView } : {}),\n      ...(initial.selection !== undefined\n        ? {\n            selection: initial.selection,\n            onSelectionChange: (next) => latest.current.onSelectionChange?.(next),\n          }\n        : {}),\n    })\n    setGraph(instance)\n    return () => {\n      instance.destroy()\n      setGraph(null)\n    }\n  }, [latest])\n\n  useLayoutEffect(() => {\n    graph?.update({ definition, ariaLabel, ...(selection !== undefined ? { selection } : {}) })\n  }, [graph, definition, ariaLabel, selection])\n\n  useEffect(() => {\n    if (!graph) return\n    const stops = (Object.keys(eventProps) as GraphEventName[]).map((name) =>\n      graph.on(name, (event) => {\n        if (name === 'selectionchange' && latest.current.selection !== undefined) return\n        const handler = latest.current[eventProps[name]] as ((event: unknown) => void) | undefined\n        handler?.(event)\n      }),\n    )\n    return () => {\n      for (const stop of stops) stop()\n    }\n  }, [graph, latest])\n\n  useImperativeHandle<GraphInstance<S> | null, GraphInstance<S> | null>(ref, () => graph, [graph])\n\n  return (\n    <div className={className} style={{ position: 'relative', ...style }}>\n      <div ref={host} style={fill} />\n      {graph ? <GraphContext value={graph}>{children}</GraphContext> : null}\n    </div>\n  )\n}\n\nexport function useGraph(): GraphInstance {\n  const graph = useContext(GraphContext)\n  if (!graph) throw new Error('useGraph: call it inside <Graph>')\n  return graph\n}\n\ninterface Selected<T> {\n  readonly state: GraphState\n  readonly selector: (state: GraphState) => T\n  readonly value: T\n}\n\nexport interface UseGraphStateOptions<T> {\n  readonly compare?: (a: T, b: T) => boolean\n}\n\nexport function useGraphState<T>(\n  selector: (state: GraphState) => T,\n  options: UseGraphStateOptions<T> = {},\n): T {\n  const compare = options.compare ?? Object.is\n  const graph = useGraph()\n  const cache = useRef<Selected<T> | null>(null)\n  const subscribe = useCallback(\n    (notify: () => void) => {\n      const subscription = graph.store.subscribe(() => notify())\n      return () => subscription.unsubscribe()\n    },\n    [graph],\n  )\n  const snapshot = (): T => {\n    const state = graph.store.get()\n    const cached = cache.current\n    if (cached && cached.state === state && cached.selector === selector) return cached.value\n    const value = selector(state)\n    const kept = cached && compare(cached.value, value) ? cached.value : value\n    cache.current = { state, selector, value: kept }\n    return kept\n  }\n  return useSyncExternalStore(subscribe, snapshot, snapshot)\n}\n\nexport function useGraphEvent<K extends GraphEventName>(\n  name: K,\n  handler: GraphEventHandler<K>,\n): void {\n  const graph = useGraph()\n  const latest = useLatest(handler)\n  useEffect(\n    () => graph.on(name, (event: GraphEvents[K]) => latest.current(event)),\n    [graph, name, latest],\n  )\n}\n\nexport type { GraphInstance, GraphState, GraphStore }\n"],"mappings":"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"}

package/dist/theme.css

@@ -0,0 +1,90 @@
+:root {
+  --graph-paper: #f7f7f4;
+  --graph-paper-raised: #ffffff;
+  --graph-grid: #c4e0dd;
+  --graph-ink: #191d22;
+  --graph-ink-muted: #5b6167;
+  --graph-node: #474e55;
+  --graph-edge: #7f858c;
+  --graph-group-fill: #e7efee;
+  --graph-group-line: #6e8d8b;
+  --graph-accent: #c93700;
+  --graph-on-accent: #ffffff;
+  --graph-focus-ring: #c93700;
+  --graph-halo: #c9370047;
+  --graph-label-halo: #f7f7f4;
+  --graph-node-ring: #f7f7f4;
+  --graph-badge-fill: #191d22;
+  --graph-badge-ink: #f7f7f4;
+  --graph-cat-1: #2769b7;
+  --graph-cat-2: #a47c13;
+  --graph-cat-3: #12867c;
+  --graph-cat-4: #9b357f;
+  --graph-cat-5: #4189ad;
+  --graph-cat-6: #448335;
+  --graph-cat-7: #5d4099;
+  --graph-cat-8: #745338;
+  --graph-font: "Atkinson Hyperlegible Next", system-ui, sans-serif;
+  color-scheme: light;
+}
+
+.dark,
+[data-theme="dark"] {
+  --graph-paper: #0f1113;
+  --graph-paper-raised: #171a1d;
+  --graph-grid: #1e3233;
+  --graph-ink: #efeeeb;
+  --graph-ink-muted: #a6abb1;
+  --graph-node: #b7bfc7;
+  --graph-edge: #6f757b;
+  --graph-group-fill: #131b1c;
+  --graph-group-line: #5d7b7b;
+  --graph-accent: #fa8054;
+  --graph-on-accent: #0f1113;
+  --graph-focus-ring: #fa8054;
+  --graph-halo: #fa805447;
+  --graph-label-halo: #0f1113;
+  --graph-node-ring: #0f1113;
+  --graph-badge-fill: #efeeeb;
+  --graph-badge-ink: #0f1113;
+  --graph-cat-1: #6fa7ee;
+  --graph-cat-2: #e7bf57;
+  --graph-cat-3: #5cc6b9;
+  --graph-cat-4: #e17eb9;
+  --graph-cat-5: #9cd3f1;
+  --graph-cat-6: #81ce70;
+  --graph-cat-7: #9e87e0;
+  --graph-cat-8: #aa8b74;
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not(.light):not([data-theme="light"]) {
+    --graph-paper: #0f1113;
+    --graph-paper-raised: #171a1d;
+    --graph-grid: #1e3233;
+    --graph-ink: #efeeeb;
+    --graph-ink-muted: #a6abb1;
+    --graph-node: #b7bfc7;
+    --graph-edge: #6f757b;
+    --graph-group-fill: #131b1c;
+    --graph-group-line: #5d7b7b;
+    --graph-accent: #fa8054;
+    --graph-on-accent: #0f1113;
+    --graph-focus-ring: #fa8054;
+    --graph-halo: #fa805447;
+    --graph-label-halo: #0f1113;
+    --graph-node-ring: #0f1113;
+    --graph-badge-fill: #efeeeb;
+    --graph-badge-ink: #0f1113;
+    --graph-cat-1: #6fa7ee;
+    --graph-cat-2: #e7bf57;
+    --graph-cat-3: #5cc6b9;
+    --graph-cat-4: #e17eb9;
+    --graph-cat-5: #9cd3f1;
+    --graph-cat-6: #81ce70;
+    --graph-cat-7: #9e87e0;
+    --graph-cat-8: #aa8b74;
+    color-scheme: dark;
+  }
+}

package/dist/types-D6b86Rt1.d.ts

@@ -0,0 +1,156 @@
+type Key = string | number;
+interface Point {
+  readonly x: number;
+  readonly y: number;
+}
+interface View {
+  readonly x: number;
+  readonly y: number;
+  readonly zoom: number;
+}
+type Accessor<T, V> = (datum: T) => V;
+type FieldOf<T, V> = { [K in keyof T]-?: T[K] extends V | null | undefined ? K : never; }[keyof T] & string;
+type KeyFieldOf<T> = { [K in keyof T]-?: T[K] extends Key ? (Partial<Pick<T, K>> extends Pick<T, K> ? never : K) : never; }[keyof T] & string;
+type Channel<T, V> = FieldOf<T, V> | Accessor<T, V | null | undefined>;
+type KeyChannel<T> = KeyFieldOf<T> | Accessor<T, Key>;
+type Style<T, V> = V | Accessor<T, V>;
+interface SourceChange<T> {
+  readonly type: "insert" | "update" | "delete";
+  readonly key: Key;
+  readonly value: T;
+}
+interface SourceSubscription {
+  unsubscribe(): void;
+}
+interface LiveSource<T> {
+  subscribeChanges(callback: (changes: ReadonlyArray<SourceChange<T>>) => void, options?: {
+    includeInitialState?: boolean;
+  }): SourceSubscription;
+}
+type GraphData<T> = Iterable<T> | LiveSource<T>;
+type NodeShape = "circle" | "square" | "diamond";
+type EdgeDash = "solid" | "dashed" | "dotted";
+type EdgeArrow = "none" | "source" | "target" | "both";
+type BadgeCorner = "topLeft" | "topRight" | "bottomLeft" | "bottomRight";
+interface Badge {
+  readonly text?: string;
+}
+interface LabelOptions<T> {
+  readonly text: Channel<T, string>;
+  readonly secondary?: Channel<T, string>;
+}
+interface NodeOptions<T> {
+  readonly key?: KeyChannel<T>;
+  readonly color?: Channel<T, string | number | boolean>;
+  readonly size?: Channel<T, number>;
+  readonly label?: Channel<T, string> | LabelOptions<T>;
+  readonly x?: Channel<T, number>;
+  readonly y?: Channel<T, number>;
+  readonly shape?: Style<T, NodeShape>;
+  readonly fill?: Style<T, string>;
+  readonly stroke?: Style<T, string>;
+  readonly strokeWidth?: Style<T, number>;
+  readonly opacity?: Style<T, number>;
+  readonly image?: Style<T, string | null>;
+  readonly badges?: Readonly<Partial<Record<BadgeCorner, Accessor<T, Badge | null | undefined>>>>;
+  readonly units?: "world" | "screen";
+}
+interface EdgeOptions<T> {
+  readonly key?: KeyChannel<T>;
+  readonly source: KeyChannel<T>;
+  readonly target: KeyChannel<T>;
+  readonly color?: Channel<T, string | number | boolean>;
+  readonly width?: Channel<T, number>;
+  readonly label?: Channel<T, string>;
+  readonly dash?: Style<T, EdgeDash>;
+  readonly arrow?: Style<T, EdgeArrow>;
+  readonly stroke?: Style<T, string>;
+  readonly opacity?: Style<T, number>;
+}
+interface Mark {
+  readonly type: "nodes" | "edges";
+}
+interface NodeMark<T> extends Mark {
+  readonly type: "nodes";
+  readonly data: GraphData<T>;
+  readonly options: NodeOptions<T>;
+}
+interface EdgeMark<T> extends Mark {
+  readonly type: "edges";
+  readonly data: GraphData<T>;
+  readonly options: EdgeOptions<T>;
+}
+type ColorScale = ((value: unknown) => string) | {
+  readonly type?: "categorical";
+  readonly domain?: readonly unknown[];
+  readonly range?: readonly string[];
+} | {
+  readonly type: "sequential";
+  readonly domain?: readonly [number, number];
+  readonly range?: readonly string[];
+};
+type NumberScaleType = "linear" | "sqrt";
+type NumberScale = ((value: number) => number) | {
+  readonly type?: NumberScaleType;
+  readonly domain?: readonly [number, number];
+  readonly range?: readonly [number, number];
+};
+interface ScalesOptions {
+  readonly color?: ColorScale;
+  readonly size?: NumberScale;
+  readonly width?: NumberScale;
+}
+interface StateStyle {
+  readonly opacity?: number;
+  readonly fill?: string;
+  readonly stroke?: string;
+  readonly strokeWidth?: number;
+  readonly halo?: boolean;
+  readonly label?: boolean;
+}
+type SelectMode = "single" | "multiple" | false;
+interface InteractionOptions {
+  readonly pan?: boolean;
+  readonly zoom?: boolean | {
+    readonly speed?: number;
+  };
+  readonly select?: SelectMode;
+  readonly drag?: boolean;
+  readonly lasso?: boolean;
+  readonly keyboard?: boolean;
+}
+interface ResolvedInteraction {
+  readonly pan: boolean;
+  readonly zoom: false | {
+    readonly speed: number;
+  };
+  readonly select: SelectMode;
+  readonly drag: boolean;
+  readonly lasso: boolean;
+  readonly keyboard: boolean;
+}
+interface TransitionOptions {
+  readonly positions?: number;
+}
+interface ResolvedTransitions {
+  readonly positions: number;
+}
+type BuiltInState = "selected" | "hovered" | "focused";
+type FreeState<S extends string> = Exclude<S, BuiltInState>;
+type StateStyles<S extends string> = { readonly [K in S]: StateStyle; };
+interface GraphDefinitionOptions<S extends string = string> {
+  readonly marks: readonly Mark[];
+  readonly scales?: ScalesOptions;
+  readonly states?: StateStyles<S>;
+  readonly interaction?: InteractionOptions;
+  readonly transitions?: TransitionOptions;
+}
+interface GraphDefinition<S extends string = string> {
+  readonly marks: readonly Mark[];
+  readonly scales: ScalesOptions;
+  readonly states: StateStyles<S>;
+  readonly interaction: ResolvedInteraction;
+  readonly transitions: ResolvedTransitions;
+}
+export { ResolvedTransitions as A, NodeMark as C, NumberScaleType as D, NumberScale as E, StateStyle as F, StateStyles as I, Style as L, SelectMode as M, SourceChange as N, Point as O, SourceSubscription as P, TransitionOptions as R, Mark as S, NodeShape as T, Key as _, Channel as a, LabelOptions as b, EdgeDash as c, FieldOf as d, FreeState as f, InteractionOptions as g, GraphDefinitionOptions as h, BuiltInState as i, ScalesOptions as j, ResolvedInteraction as k, EdgeMark as l, GraphDefinition as m, Badge as n, ColorScale as o, GraphData as p, BadgeCorner as r, EdgeArrow as s, Accessor as t, EdgeOptions as u, KeyChannel as v, NodeOptions as w, LiveSource as x, KeyFieldOf as y, View as z };
+//# sourceMappingURL=types-D6b86Rt1.d.ts.map