@graview/render 0.0.0-stage → 0.1.0

package/dist/scene/frame-plan.d.ts

@@ -0,0 +1,83 @@
+import type { Placement } from "../interaction/pointer-router.js";
+import type { Matrix4 } from "../platform/matrix.js";
+import { type ConnectorStyle } from "./connectors.js";
+import { type PlaneStyle } from "./plane.js";
+/** One view drawn into the scene: a DOM subtree, and where it belongs. */
+export interface PlannedView {
+    readonly id: string;
+    /** 0 focus, 1 relations, 2 context. May be fractional mid-transition. */
+    readonly plane: number;
+    /** Layout position in canvas pixels, before the plane transform. */
+    readonly x: number;
+    readonly y: number;
+    readonly width: number;
+    readonly height: number;
+    /** Set when the view's DOM changed and its texture is stale. */
+    readonly dirty?: boolean;
+    readonly opacity?: number;
+}
+export interface PlannedConnector {
+    readonly id: string;
+    readonly kind: string;
+    readonly from: string;
+    readonly to: string;
+    readonly opacity?: number;
+}
+export interface CaptureCommand {
+    readonly viewId: string;
+    /** Why this frame needed the pixels again — useful when a budget blows. */
+    readonly reason: "first" | "live" | "changed";
+}
+export interface ViewDraw {
+    readonly viewId: string;
+    readonly transform: Matrix4;
+    readonly style: PlaneStyle;
+    /** Drawn width and height, after the plane's scale. */
+    readonly width: number;
+    readonly height: number;
+    readonly opacity: number;
+}
+export interface ConnectorDraw {
+    readonly id: string;
+    readonly kind: string;
+    readonly style: ConnectorStyle;
+    readonly x1: number;
+    readonly y1: number;
+    readonly x2: number;
+    readonly y2: number;
+    readonly opacity: number;
+}
+export interface GeometryReport {
+    readonly viewId: string;
+    readonly transform: Matrix4;
+}
+export interface FramePlan {
+    /** Views whose textures need refreshing, in draw order. */
+    readonly captures: readonly CaptureCommand[];
+    /** Back to front, so the focus plane lands on top. */
+    readonly draws: readonly ViewDraw[];
+    readonly connectors: readonly ConnectorDraw[];
+    /** What to tell the browser about where each view ended up. */
+    readonly geometry: readonly GeometryReport[];
+    /** What the pointer router needs to route a click. */
+    readonly placements: readonly Omit<Placement, "element">[];
+    /** Captures this frame. The number the budget is spent on. */
+    readonly captureCount: number;
+}
+export interface PlanOptions {
+    readonly canvasWidth: number;
+    readonly canvasHeight: number;
+    /** Frame index of the last capture per view; absent means never captured. */
+    readonly capturedAt?: Readonly<Record<string, number>>;
+    readonly connectorOverrides?: Readonly<Record<string, Partial<ConnectorStyle>>>;
+}
+/**
+ * What a frame consists of, as data — no GPU, no DOM, no browser.
+ *
+ * Separating the plan from its submission is what lets the fidelity policy,
+ * plane ordering and geometry reporting be tested in CI with no GPU present,
+ * while the executor that turns a plan into draw calls stays thin enough to
+ * verify in a real browser once.
+ */
+export declare function planFrame(views: readonly PlannedView[], connectors: readonly PlannedConnector[], options: PlanOptions): FramePlan;
+//# sourceMappingURL=frame-plan.d.ts.map

package/dist/scene/frame-plan.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"frame-plan.d.ts","sourceRoot":"","sources":["../../src/scene/frame-plan.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAkB,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAqC,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AAEhF,0EAA0E;AAC1E,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,yEAAyE;IACzE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,oEAAoE;IACpE,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,gEAAgE;IAChE,QAAQ,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,2EAA2E;IAC3E,QAAQ,CAAC,MAAM,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CAC/C;AAED,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAC;IAC3B,uDAAuD;IACvD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,cAAc,CAAC;IAC/B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,SAAS;IACxB,2DAA2D;IAC3D,QAAQ,CAAC,QAAQ,EAAE,SAAS,cAAc,EAAE,CAAC;IAC7C,sDAAsD;IACtD,QAAQ,CAAC,KAAK,EAAE,SAAS,QAAQ,EAAE,CAAC;IACpC,QAAQ,CAAC,UAAU,EAAE,SAAS,aAAa,EAAE,CAAC;IAC9C,+DAA+D;IAC/D,QAAQ,CAAC,QAAQ,EAAE,SAAS,cAAc,EAAE,CAAC;IAC7C,sDAAsD;IACtD,QAAQ,CAAC,UAAU,EAAE,SAAS,IAAI,CAAC,SAAS,EAAE,SAAS,CAAC,EAAE,CAAC;IAC3D,8DAA8D;IAC9D,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,6EAA6E;IAC7E,QAAQ,CAAC,UAAU,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IACvD,QAAQ,CAAC,kBAAkB,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;CACjF;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CACvB,KAAK,EAAE,SAAS,WAAW,EAAE,EAC7B,UAAU,EAAE,SAAS,gBAAgB,EAAE,EACvC,OAAO,EAAE,WAAW,GACnB,SAAS,CA2EX"}

package/dist/scene/frame-plan.js

@@ -0,0 +1,119 @@
+import { connectorStyle } from "./connectors.js";
+import { mixStyles, styleFor, transformFor } from "./plane.js";
+/**
+ * What a frame consists of, as data — no GPU, no DOM, no browser.
+ *
+ * Separating the plan from its submission is what lets the fidelity policy,
+ * plane ordering and geometry reporting be tested in CI with no GPU present,
+ * while the executor that turns a plan into draw calls stays thin enough to
+ * verify in a real browser once.
+ */
+export function planFrame(views, connectors, options) {
+    const capturedAt = options.capturedAt ?? {};
+    const captures = [];
+    const draws = [];
+    const geometry = [];
+    const placements = [];
+    const centres = new Map();
+    // Back to front: the deepest plane is drawn first so the focus plane lands
+    // on top of it. Sorting explicitly means callers may hand views over in any
+    // order without changing what the scene looks like.
+    const ordered = [...views].sort((a, b) => b.plane - a.plane);
+    for (const view of ordered) {
+        const style = styleAt(view.plane);
+        const reason = captureReason(view, style, capturedAt[view.id]);
+        if (reason)
+            captures.push({ viewId: view.id, reason });
+        const transform = transformFor(style, view.x, view.y, options.canvasWidth, options.canvasHeight);
+        const width = view.width * style.scale;
+        const height = view.height * style.scale;
+        draws.push({
+            viewId: view.id,
+            transform,
+            style,
+            width,
+            height,
+            opacity: view.opacity ?? 1,
+        });
+        geometry.push({ viewId: view.id, transform });
+        placements.push({
+            transform,
+            width: view.width,
+            height: view.height,
+            depth: view.plane,
+        });
+        centres.set(view.id, {
+            x: transform[12] + width / 2,
+            y: transform[13] + height / 2,
+        });
+    }
+    const connectorDraws = [];
+    for (const connector of connectors) {
+        const from = centres.get(connector.from);
+        const to = centres.get(connector.to);
+        // A connector to something off-scene is a line into nowhere.
+        if (!from || !to)
+            continue;
+        connectorDraws.push({
+            id: connector.id,
+            kind: connector.kind,
+            style: connectorStyle(connector.kind, options.connectorOverrides ?? {}),
+            x1: from.x,
+            y1: from.y,
+            x2: to.x,
+            y2: to.y,
+            opacity: connector.opacity ?? 1,
+        });
+    }
+    return {
+        captures,
+        draws,
+        connectors: connectorDraws,
+        geometry,
+        placements,
+        captureCount: captures.length,
+    };
+}
+/**
+ * The treatment for a possibly-fractional plane. Mid-transition a view is
+ * between two planes, and mixing their treatments is what makes the move read
+ * as travel rather than a cut.
+ */
+function styleAt(plane) {
+    const lower = Math.floor(plane);
+    const upper = Math.ceil(plane);
+    if (lower === upper)
+        return styleFor(plane);
+    return mixStyles(styleFor(lower), styleFor(upper), plane - lower);
+}
+/**
+ * Whether a view needs recapturing, and why. Fidelity decides, not plane
+ * index — and the split is load-bearing rather than an optimisation:
+ * capture costs ~0.016 ms per node up to about 128 live captures a frame and
+ * then falls off a cliff (see docs/platform-findings.md).
+ *
+ * - `full`    live: captured every frame, because it is being edited
+ * - `summary` cached: captured only when its DOM actually changed
+ * - `glyph`   captured once, then only when its content actually changed —
+ *             at glyph scale a cached texture is indistinguishable from a
+ *             live one, but a stale one shows last week's number for ever
+ */
+function captureReason(view, style, lastCapture) {
+    if (lastCapture === undefined)
+        return "first";
+    // Mid-transition a view's own DOM is still fading, so whatever was captured
+    // is not what it looks like. Caching that leaves an entering node stuck as
+    // the transparent frame it was first seen in — which is precisely what
+    // happened to every person raised onto plane 1.
+    if (view.opacity !== undefined && view.opacity < 1)
+        return "changed";
+    switch (style.fidelity) {
+        case "full":
+            return "live";
+        case "summary":
+            return view.dirty ? "changed" : null;
+        case "glyph":
+            return view.dirty ? "changed" : null;
+    }
+}
+//# sourceMappingURL=frame-plan.js.map

package/dist/scene/frame-plan.js.map

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

package/dist/scene/from-layout.d.ts

@@ -0,0 +1,14 @@
+import type { InterpolatedLayout, Layout } from "@graview/layout";
+import type { PlannedConnector, PlannedView } from "./frame-plan.js";
+/**
+ * Turns what layout emitted into what the renderer draws.
+ *
+ * Deliberately trivial: layout decides positions and planes, the renderer
+ * decides pixels, and this is the whole conversation between them. If this
+ * function ever starts making decisions, the two have begun to overlap.
+ */
+export declare function fromLayout(result: Layout | InterpolatedLayout, dirty?: ReadonlySet<string>): {
+    views: PlannedView[];
+    connectors: PlannedConnector[];
+};
+//# sourceMappingURL=from-layout.d.ts.map

package/dist/scene/from-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"from-layout.d.ts","sourceRoot":"","sources":["../../src/scene/from-layout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAClE,OAAO,KAAK,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAErE;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,MAAM,EAAE,MAAM,GAAG,kBAAkB,EACnC,KAAK,GAAE,WAAW,CAAC,MAAM,CAAa,GACrC;IAAE,KAAK,EAAE,WAAW,EAAE,CAAC;IAAC,UAAU,EAAE,gBAAgB,EAAE,CAAA;CAAE,CA4B1D"}

package/dist/scene/from-layout.js

@@ -0,0 +1,35 @@
+/**
+ * Turns what layout emitted into what the renderer draws.
+ *
+ * Deliberately trivial: layout decides positions and planes, the renderer
+ * decides pixels, and this is the whole conversation between them. If this
+ * function ever starts making decisions, the two have begun to overlap.
+ */
+export function fromLayout(result, dirty = new Set()) {
+    // Planes may be fractional mid-transition; the frame plan mixes the two
+    // plane styles rather than snapping, so this passes them straight through.
+    const views = result.nodes.map((node) => ({
+        id: node.id,
+        plane: node.plane,
+        x: node.x,
+        y: node.y,
+        // Whole-pixel boxes. A fractional size reallocates the texture on every
+        // frame of a transition and desynchronises it from the element the
+        // browser actually rasterises.
+        width: Math.round(node.width),
+        height: Math.round(node.height),
+        // Mid-fade counts as dirty: the pixels on screen are not the pixels this
+        // view will settle at.
+        dirty: dirty.has(node.id) || ("opacity" in node && node.opacity < 1),
+        opacity: "opacity" in node ? node.opacity : 1,
+    }));
+    const connectors = result.connectors.map((connector) => ({
+        id: connector.id,
+        kind: connector.kind,
+        from: connector.from,
+        to: connector.to,
+        opacity: "opacity" in connector ? connector.opacity : 1,
+    }));
+    return { views, connectors };
+}
+//# sourceMappingURL=from-layout.js.map

package/dist/scene/from-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"from-layout.js","sourceRoot":"","sources":["../../src/scene/from-layout.ts"],"names":[],"mappings":"AAGA;;;;;;GAMG;AACH,MAAM,UAAU,UAAU,CACxB,MAAmC,EACnC,QAA6B,IAAI,GAAG,EAAE;IAEtC,wEAAwE;IACxE,2EAA2E;IAC3E,MAAM,KAAK,GAAkB,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACvD,EAAE,EAAE,IAAI,CAAC,EAAE;QACX,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,wEAAwE;QACxE,mEAAmE;QACnE,+BAA+B;QAC/B,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;QAC7B,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;QAC/B,yEAAyE;QACzE,uBAAuB;QACvB,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,IAAI,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;QACpE,OAAO,EAAE,SAAS,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;KAC9C,CAAC,CAAC,CAAC;IAEJ,MAAM,UAAU,GAAuB,MAAM,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;QAC3E,EAAE,EAAE,SAAS,CAAC,EAAE;QAChB,IAAI,EAAE,SAAS,CAAC,IAAI;QACpB,IAAI,EAAE,SAAS,CAAC,IAAI;QACpB,EAAE,EAAE,SAAS,CAAC,EAAE;QAChB,OAAO,EAAE,SAAS,IAAI,SAAS,CAAC,CAAC,CAAE,SAAiC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;KACjF,CAAC,CAAC,CAAC;IAEJ,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC;AAC/B,CAAC"}

package/dist/scene/plane.d.ts

@@ -0,0 +1,68 @@
+import { type Matrix4 } from "../platform/matrix.js";
+/**
+ * Discrete z-planes with the camera locked to one axis. No free orbit: every
+ * view is nameable and returnable, which is what makes each stop a URL.
+ */
+export declare const PLANES: {
+    /** Live, editable DOM. Captured every frame it moves. */
+    readonly focus: 0;
+    /** The entity type you asked to see, with connectors. */
+    readonly relations: 1;
+    /** Everything else, as aggregate blocks. */
+    readonly context: 2;
+};
+export type PlaneIndex = 0 | 1 | 2;
+/**
+ * Atmospheric depth, expressed as numbers a shader can use.
+ *
+ * Every value here is affine or per-plane uniform — nothing per-element and
+ * nothing perspective — so the visual language survives whichever way the
+ * platform settles the perspective question. Blur and contrast falloff are
+ * near-free in a shader and expensive in CSS, which is what justifies the GPU
+ * pipeline at all.
+ */
+export interface PlaneStyle {
+    /** Uniform scale. Recession, without foreshortening. */
+    readonly scale: number;
+    /** Gaussian radius in texels. */
+    readonly blur: number;
+    /** 0 = full contrast, 1 = fully dissolved into the ground colour. */
+    readonly falloff: number;
+    /** Drop-shadow opacity separating this plane from the one behind it. */
+    readonly shadow: number;
+    /** Fidelity the plane asks its views for. */
+    readonly fidelity: "full" | "summary" | "glyph";
+}
+export type Scheme = "light" | "dark";
+/**
+ * Daylight recession.
+ *
+ * Not the dark numbers inverted. In daylight a distant thing loses CONTRAST
+ * and gains haze; it does not lose light, and it does not blur much — the eye
+ * reads distance from washed-out colour and a softer cast shadow. Reusing the
+ * dark blur here made receded planes look out of focus rather than far away.
+ */
+export declare const LIGHT_PLANE_STYLES: Readonly<Record<PlaneIndex, PlaneStyle>>;
+export declare const PLANE_STYLES: Readonly<Record<PlaneIndex, PlaneStyle>>;
+export declare function styleFor(plane: number, scheme?: Scheme): PlaneStyle;
+/**
+ * Interpolates between two plane styles. Every transition is animatable
+ * because both endpoints are the same small bag of numbers — the same reason
+ * any two layout states interpolate.
+ */
+export declare function mixStyles(a: PlaneStyle, b: PlaneStyle, t: number): PlaneStyle;
+/**
+ * The transform a view at `plane` gets, given where layout put it.
+ *
+ * Position is layout's, untouched. The plane contributes only treatment —
+ * scale, and through the shader blur, falloff and shadow.
+ *
+ * An earlier version scaled positions about the canvas centre as well, so a
+ * receded plane pulled inward. It looked plausible and was wrong: layout no
+ * longer knew where anything would end up, so connectors drawn from layout
+ * coordinates missed the views they connected. One owner per concern —
+ * layout owns position, the plane owns treatment — is what keeps the two
+ * halves of the picture agreeing.
+ */
+export declare function transformFor(style: PlaneStyle, x: number, y: number, _canvasWidth?: number, _canvasHeight?: number): Matrix4;
+//# sourceMappingURL=plane.d.ts.map

package/dist/scene/plane.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"plane.d.ts","sourceRoot":"","sources":["../../src/scene/plane.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAErE;;;GAGG;AACH,eAAO,MAAM,MAAM;IACjB,yDAAyD;;IAEzD,yDAAyD;;IAEzD,4CAA4C;;CAEpC,CAAC;AAEX,MAAM,MAAM,UAAU,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEnC;;;;;;;;GAQG;AACH,MAAM,WAAW,UAAU;IACzB,wDAAwD;IACxD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,iCAAiC;IACjC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,qEAAqE;IACrE,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,wEAAwE;IACxE,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,6CAA6C;IAC7C,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;CACjD;AAED,MAAM,MAAM,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;AAEtC;;;;;;;GAOG;AACH,eAAO,MAAM,kBAAkB,EAAE,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE,UAAU,CAAC,CAmBvE,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE,UAAU,CAAC,CAejE,CAAC;AAEF,wBAAgB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,GAAE,MAAe,GAAG,UAAU,CAG3E;AAED;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAU7E;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,UAAU,EACjB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,YAAY,CAAC,EAAE,MAAM,EACrB,aAAa,CAAC,EAAE,MAAM,GACrB,OAAO,CAET"}

package/dist/scene/plane.js

@@ -0,0 +1,94 @@
+import { planeTransform } from "../platform/matrix.js";
+/**
+ * Discrete z-planes with the camera locked to one axis. No free orbit: every
+ * view is nameable and returnable, which is what makes each stop a URL.
+ */
+export const PLANES = {
+    /** Live, editable DOM. Captured every frame it moves. */
+    focus: 0,
+    /** The entity type you asked to see, with connectors. */
+    relations: 1,
+    /** Everything else, as aggregate blocks. */
+    context: 2,
+};
+/**
+ * Daylight recession.
+ *
+ * Not the dark numbers inverted. In daylight a distant thing loses CONTRAST
+ * and gains haze; it does not lose light, and it does not blur much — the eye
+ * reads distance from washed-out colour and a softer cast shadow. Reusing the
+ * dark blur here made receded planes look out of focus rather than far away.
+ */
+export const LIGHT_PLANE_STYLES = {
+    0: { scale: 1, blur: 0, falloff: 0, shadow: 0.16, fidelity: "full" },
+    1: { scale: 0.95, blur: 0.3, falloff: 0.26, shadow: 0.12, fidelity: "summary" },
+    /*
+     * Depth comes from BLUR AND FALLOFF, not from shrinking.
+     *
+     * Pushing the scale to 0.6 did separate the planes and made the strip
+     * illegible — ten cards reading "P…", "REA…", "S…". A map you cannot read
+     * is not a map. The recession is carried by the atmosphere instead.
+     *
+     * 0.78 was still shrinking, and still too much: the layout allots each
+     * district a slot and the renderer drew it at 78% of it, so a name set at
+     * thirteen pixels reached the screen at ten and its kind at under eight.
+     * That is under every floor this project holds a control to, and it is a
+     * floor the reader's own text size could not lift either — the shrink
+     * came after it. The planes keep a shrink small enough to read as depth
+     * and no longer small enough to cost a word its legibility.
+     */
+    2: { scale: 0.9, blur: 0.3, falloff: 0.34, shadow: 0.07, fidelity: "glyph" },
+};
+export const PLANE_STYLES = {
+    // The focus plane is unfiltered on purpose: everything else is judged
+    // against it, so it has to be the one true reading of the data.
+    0: { scale: 1, blur: 0, falloff: 0, shadow: 0.34, fidelity: "full" },
+    // Plane 1 recedes but stays READABLE — its job is to be looked at next,
+    // not to be atmosphere. Enough separation to read as further away, little
+    // enough that a summary view can still be read.
+    1: { scale: 0.95, blur: 0.45, falloff: 0.18, shadow: 0.24, fidelity: "summary" },
+    // Plane 2 is context, not content. It should register as presence and
+    // count, and reward a glance rather than a read.
+    //
+    // Blurrier than plane 1, necessarily: recession has to be monotonic or the
+    // depth cue inverts and the furthest plane reads as the nearest. This was
+    // briefly 0.6 against plane 1's 0.7, which `frame-plan.test.ts` caught.
+    2: { scale: 0.9, blur: 0.45, falloff: 0.26, shadow: 0.14, fidelity: "glyph" },
+};
+export function styleFor(plane, scheme = "dark") {
+    const clamped = Math.max(0, Math.min(2, Math.round(plane)));
+    return (scheme === "light" ? LIGHT_PLANE_STYLES : PLANE_STYLES)[clamped];
+}
+/**
+ * Interpolates between two plane styles. Every transition is animatable
+ * because both endpoints are the same small bag of numbers — the same reason
+ * any two layout states interpolate.
+ */
+export function mixStyles(a, b, t) {
+    const clamped = Math.max(0, Math.min(1, t));
+    const lerp = (x, y) => x + (y - x) * clamped;
+    return {
+        scale: lerp(a.scale, b.scale),
+        blur: lerp(a.blur, b.blur),
+        falloff: lerp(a.falloff, b.falloff),
+        shadow: lerp(a.shadow, b.shadow),
+        fidelity: clamped < 0.5 ? a.fidelity : b.fidelity,
+    };
+}
+/**
+ * The transform a view at `plane` gets, given where layout put it.
+ *
+ * Position is layout's, untouched. The plane contributes only treatment —
+ * scale, and through the shader blur, falloff and shadow.
+ *
+ * An earlier version scaled positions about the canvas centre as well, so a
+ * receded plane pulled inward. It looked plausible and was wrong: layout no
+ * longer knew where anything would end up, so connectors drawn from layout
+ * coordinates missed the views they connected. One owner per concern —
+ * layout owns position, the plane owns treatment — is what keeps the two
+ * halves of the picture agreeing.
+ */
+export function transformFor(style, x, y, _canvasWidth, _canvasHeight) {
+    return planeTransform(style.scale, x, y);
+}
+//# sourceMappingURL=plane.js.map

package/dist/scene/plane.js.map

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

package/package.json

@@ -1,6 +1,67 @@
 {
   "name": "@graview/render",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./gpu": {
+      "types": "./dist/gpu.d.ts",
+      "default": "./dist/gpu.js"
+    }
+  },
+  "dependencies": {
+    "@graview/core": "0.1.0",
+    "@graview/layout": "0.1.0"
+  },
+  "peerDependencies": {
+    "@webgpu/types": "^0.1.60"
+  },
+  "peerDependenciesMeta": {
+    "@webgpu/types": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "zod": "^4.4.3"
+  },
+  "description": "The spatial renderer. The DOM path is what ships; the GPU capture path is EXPERIMENTAL — see README.",
+  "keywords": [
+    "graview",
+    "context-graph",
+    "typed-graph",
+    "interface",
+    "declarative",
+    "renderer",
+    "canvas",
+    "webgpu"
+  ],
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "sideEffects": false,
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/en-dash-consulting/graview.git",
+    "directory": "packages/render"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "license": "Elastic-2.0",
+  "homepage": "https://graview.dev/docs/packages/render.html",
+  "bugs": {
+    "url": "https://github.com/en-dash-consulting/graview/issues"
+  },
+  "engines": {
+    "node": ">=22"
+  },
+  "scripts": {
+    "build": "tsc -b"
+  }
 }