@graview/react 0.1.0

package/dist/connectors.d.ts

@@ -0,0 +1,176 @@
+import { type Connector } from "@graview/layout";
+import type { ActivityMark } from "./activity.js";
+import type { SceneNode } from "./scene-root.js";
+/**
+ * Where a line toward `towards` should MEET a box: on its border, not at its
+ * centre.
+ *
+ * Centre-anchored lines cross the card's own interior on the way out — the
+ * yellow dash sawing through the middle of REASONS was this — and where
+ * several relations share an endpoint they converge to a single point at the
+ * centre, which reads as a knot rather than as several roads arriving. The
+ * border is where a road meets a building.
+ */
+/**
+ * HOW A TIE RUNS between two measured drawings — a pure decision, so it is
+ * testable without a browser.
+ *
+ * Two drawings stacked in one column used to get a near-straight vertical
+ * aimed centre-to-centre — a line THROUGH every row between them, whose
+ * hit corridor then stole those rows' clicks. Boxes that share a column
+ * stitch along their common right edge, in the gutter; boxes that share a
+ * row stitch over the top. Only ends with clear air between them take the
+ * direct arc. Returns null when no honest line exists: one drawing inside
+ * another is the view's own composition, and anchors within a few pixels
+ * are one drawing restating itself.
+ */
+export declare function tieRoute(fromBox: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}, toBox: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}): {
+    from: {
+        x: number;
+        y: number;
+    };
+    to: {
+        x: number;
+        y: number;
+    };
+    control: {
+        x: number;
+        y: number;
+    };
+    mode: "stacked" | "abreast" | "direct";
+} | null;
+/** A box in stage space, anchored at its top-left. */
+export type Box = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};
+type SceneConnector = Connector & {
+    readonly opacity?: number;
+};
+/**
+ * ONE DRAWN LINE: an anchor at each end, and the real edges that run
+ * between them.
+ *
+ * Layout resolves an edge's ends to whatever is PLACED — a session inside
+ * the week resolves to the week — and bundles every edge that lands on the
+ * same pair. That is right for the layout, which cannot see inside a view.
+ * The renderer can: the week draws each session as its own span, a session
+ * card draws each drill as a chip, and any element wearing
+ * `data-graview-pick` for a member is where a line to that member should
+ * start. So a connector is unpicked here into strands, one per distinct
+ * pair of anchors, and bundled again only where the view draws nothing for
+ * the member. A strand that stands for exactly one edge is selectable.
+ */
+export interface Strand {
+    readonly key: string;
+    readonly connector: SceneConnector;
+    readonly edges: readonly {
+        readonly from: string;
+        readonly to: string;
+    }[];
+    readonly fromBox: Box;
+    readonly toBox: Box;
+    /** What each end is anchored ON: the drawn node, or a member drawn inside it. */
+    readonly fromAnchor: string;
+    readonly toAnchor: string;
+    /** Every other drawn box, so the line can dive under cards it merely crosses. */
+    readonly obstacles: readonly Box[];
+    /** Both ends are chips of the relation band: every chip of it, so the line can take the gutters. */
+    readonly band?: readonly Box[];
+    /**
+     * The cards an end is drawn INSIDE, when it lands on a member: the line
+     * is visible across them (that is what landing on a member means), but
+     * its hit stroke is not, so a line to Ravi never takes a click meant
+     * for June above him.
+     */
+    readonly hosts: readonly Box[];
+}
+/**
+ * Resolves the frame's connectors into the strands the scene will draw.
+ *
+ * Pure of React and null-safe without a DOM: headless, every strand is
+ * anchored on the layout's own boxes, which is the old behaviour exactly.
+ * From altitude nothing is unpicked — the constellation is a picture of
+ * kinds, and a line from a span inside the shrunk stamp would say nothing
+ * the road between two districts does not.
+ */
+export declare function connectorStrands(nodes: readonly SceneNode[], connectors: readonly SceneConnector[], stageEl: HTMLElement | null, overview: boolean, scheme: "light" | "dark"): Strand[];
+type Point = {
+    x: number;
+    y: number;
+};
+type Quadratic = {
+    p0: Point;
+    c: Point;
+    p1: Point;
+};
+/**
+ * THE VISIBLE RUNS of a curve: every stretch of it that lies outside the
+ * given boxes, as exact pieces of the same curve.
+ *
+ * A line used to be clipped by sitting BEHIND the cards, which was free and
+ * was also why a line anchored on a span inside the week never showed the
+ * stretch from the span to the panel's edge — it was under the panel. The
+ * lines now sit over the cards and clip themselves: out of the box they
+ * start in, into the box they end in, and under any card they cross on
+ * the way. Sampled, then each crossing refined by bisection, so a run ends
+ * on a border rather than a sample shy of it.
+ */
+export declare function clipQuadratic(q: Quadratic, boxes: readonly Box[]): Quadratic[];
+/**
+ * Connectors, drawn in SVG over the scene on BOTH renderer paths.
+ *
+ * A deliberate choice, not an omission: the GPU pipeline earns its cost on
+ * per-plane blur of captured pixels, and lines are the one thing it would be
+ * worse at. SVG strokes stay crisp at any scale, carry their edge kind into
+ * the DOM where a test or a screen reader can find it, and cost nothing to
+ * restyle. The capture inside a `layoutsubtree` canvas is not disturbed,
+ * because this sits outside it.
+ */
+export declare function Connectors({ strands, result, scheme, overview, selection, emphasis, stageRef, liveOf, onPickEdge, }: {
+    /** The lines to draw, resolved once per render by `connectorStrands`. */
+    readonly strands: readonly Strand[];
+    readonly overview: boolean;
+    /** For measuring the boxes a person can actually see. */
+    readonly stageRef: {
+        current: HTMLElement | null;
+    };
+    /** So a chosen kind's relations can stand out from the rest. */
+    readonly selection: readonly string[];
+    /** A relation the legend is asking about: its lines come forward. */
+    readonly emphasis: string | null;
+    /** Select the ONE edge a line stands for; `at` set means "and menu here". */
+    readonly onPickEdge?: (edgeId: string, at?: {
+        x: number;
+        y: number;
+    }) => void;
+    /** What just happened to this relation, if anything. */
+    liveOf?: (connector: {
+        from: string;
+        to: string;
+    }) => ActivityMark | undefined;
+    result: {
+        nodes: readonly SceneNode[];
+        width: number;
+        height: number;
+        /** Present at altitude: the roads run along this lattice. */
+        city?: {
+            readonly cell: number;
+        };
+    };
+    scheme: "light" | "dark";
+}): import("react").JSX.Element | null;
+export {};
+//# sourceMappingURL=connectors.d.ts.map

package/dist/connectors.d.ts.map

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