@kolosal-ai/rivet 0.1.0

package/dist/registry-Dkk4ZKt-.d.ts

@@ -0,0 +1,151 @@
+import { H as HandlePosition, N as NodeId, C as Connection } from './types-B8AAJ60T.js';
+
+/**
+ * Anchor — a connectable point bound to a DOM element rendered inside a node.
+ *
+ * Rivet knows nothing about what the element means (an inline text span, an
+ * icon, a table row — that's the consumer's business); it owns the geometry:
+ * measuring the element's line boxes within the node, rendering grab dots and
+ * stray perimeter handles from those measurements, and rewriting dot handle
+ * ids to the persisted stray ids when a connection commits.
+ *
+ * Placement derives from the element's *first* and *last* client line rects —
+ * never from CSS positioning inside the inline element, which Chrome anchors
+ * to the first line box only — so a line-wrapped span places each dot where it
+ * visually belongs. All values are percentages of the node box: client rects
+ * scale together under the viewport transform, so the ratio cancels zoom.
+ */
+
+/** The four sides an anchor can expose handles on. */
+declare const ANCHOR_SIDES: readonly ["top", "right", "bottom", "left"];
+/** A measured point within a node's box, as percentages (zoom-independent). */
+type AnchorPoint = {
+    xPct: number;
+    yPct: number;
+};
+/** Where an anchor's element sits within its node box, from measured line rects. */
+type AnchorGeometry = {
+    /** Vertical center of the element's first line box, as % of the node height. */
+    firstLineYPct: number;
+    /** Vertical center of the element's last line box, as % of the node height. */
+    lastLineYPct: number;
+    /** Horizontal center of the element's bounding box, as % of the node width. */
+    centerXPct: number;
+    /**
+     * Grab dot positions: left/top on the first line box, right/bottom on the
+     * last, so a wrapped element gets each dot on the line it belongs to.
+     */
+    dots: Record<HandlePosition, AnchorPoint>;
+};
+/**
+ * Stray-handle chrome policy, chosen at registration:
+ *
+ *  - `"dynamic"` — one perimeter handle per connected side, a single
+ *    default-side handle while unconnected. The inline-text default.
+ *  - `"none"` — no stray chrome at all; the anchor connects through its grab
+ *    dots only. For anchors whose element boundary *is* the visual connection
+ *    point (an SVG shape), where a floating perimeter handle reads as clutter.
+ *    Purely visual: edges bound to stray ids still resolve at the measured
+ *    placement — the renderer derives endpoints from geometry, not chrome.
+ */
+type AnchorStrayPolicy = "dynamic" | "none";
+/**
+ * A registered anchor. `element` is `null` while detached — the consumer
+ * unmounted the display (or an editor replaced the DOM node) without
+ * unregistering, so the last-known `geometry` is retained and edges stay put
+ * (stale retention). Unregistering is the explicit removal signal.
+ */
+type AnchorRecord = {
+    nodeId: NodeId;
+    anchorId: string;
+    /** Accent color for the anchor's dots and stray handles. */
+    color?: string;
+    /** Stray chrome policy. Absent = `"dynamic"`. */
+    strays?: AnchorStrayPolicy;
+    element: Element | null;
+    /** Null until the first successful measurement. */
+    geometry: AnchorGeometry | null;
+};
+type AnchorRegistrationOptions = {
+    color?: string;
+    /** Stray-handle chrome policy for this anchor. Default `"dynamic"`. */
+    strays?: AnchorStrayPolicy;
+};
+/**
+ * Imperative registration handle for headless consumers (rich-text editors and
+ * other renderers that own their DOM). Returned by `RivetInstance.registerAnchor`.
+ */
+type AnchorRegistration = {
+    /**
+     * Re-attach the anchor after the renderer replaced its DOM node. Passing
+     * `null` detaches instead: geometry is retained and edges stay put until the
+     * element (or a replacement) is rebound or the anchor is unregistered.
+     */
+    rebind: (element: Element | null) => void;
+    /** Explicit removal — drops the anchor and the chrome rendered for it. */
+    unregister: () => void;
+};
+/** Placement policy for anchor chrome, set via the `anchorOptions` prop. */
+type AnchorOptions = {
+    /** Side an unconnected anchor shows its single stray handle on. Default `"top"`. */
+    defaultSide?: HandlePosition;
+    /**
+     * Minimum distance (in % of the side) a stray handle keeps from the side's
+     * center, where a node's own side-center handles usually sit. Default `14`.
+     */
+    centerKeepoutPct?: number;
+    /** Minimum distance (in % of the side) a stray handle keeps from the corners. Default `8`. */
+    cornerMarginPct?: number;
+    /** Grab dot diameter in px. Default `7`. */
+    dotSize?: number;
+    /** Stray handle diameter in px. Default `8`. */
+    strayHandleSize?: number;
+};
+type ResolvedAnchorOptions = Required<AnchorOptions>;
+declare const DEFAULT_ANCHOR_OPTIONS: ResolvedAnchorOptions;
+/** Build the persisted handle id for an anchor's stray handle on `side`. */
+declare function anchorHandleId(anchorId: string, side: HandlePosition): string;
+/** Parse a stray anchor handle id back into `{ anchorId, side }`, or null. */
+declare function parseAnchorHandleId(handleId: string | null | undefined): {
+    anchorId: string;
+    side: HandlePosition;
+} | null;
+/** Build the handle id for an anchor end with an auto (render-resolved) side. */
+declare function anchorAutoHandleId(anchorId: string): string;
+/** Parse an auto anchor handle id back into its `anchorId`, or null. */
+declare function parseAnchorAutoHandleId(handleId: string | null | undefined): string | null;
+/** Build the handle id for an anchor's in-content grab dot on `side`. */
+declare function anchorDotHandleId(anchorId: string, side: HandlePosition): string;
+/** Parse a grab dot handle id back into `{ anchorId, side }`, or null. */
+declare function parseAnchorDotHandleId(handleId: string | null | undefined): {
+    anchorId: string;
+    side: HandlePosition;
+} | null;
+/**
+ * Rewrite grab dot ends to the persisted stray ids — same anchor, same side —
+ * before a connection commits. Intent-preserving: the side comes from the dot
+ * the user actually grabbed or dropped on. Runs before any consumer
+ * `mapConnection`; connections not touching a dot pass through unchanged.
+ */
+declare function normalizeAnchorConnection(connection: Connection): Connection;
+/** The rect fields measurement reads — satisfied by DOMRect. */
+type AnchorRectLike = {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+};
+/**
+ * Derive an anchor's geometry from its node box (`root`), its first and last
+ * client line rects, and its bounding box. Pure — callers supply the rects.
+ */
+declare function computeAnchorGeometry(root: AnchorRectLike, first: AnchorRectLike, last: AnchorRectLike, box: AnchorRectLike): AnchorGeometry;
+/**
+ * Where an anchor's stray handle sits along `side`, as % of that side — the
+ * measured row (left/right) or column (top/bottom) nearest the anchor, nudged
+ * by {@link placeAlongSide}. Shared by the stray-handle chrome and by the edge
+ * renderer when it places an auto anchor end on a render-resolved side.
+ */
+declare function strayPlacementPct(geometry: AnchorGeometry, side: HandlePosition, options: ResolvedAnchorOptions): number;
+
+export { ANCHOR_SIDES as A, DEFAULT_ANCHOR_OPTIONS as D, type ResolvedAnchorOptions as R, type AnchorGeometry as a, type AnchorOptions as b, type AnchorPoint as c, type AnchorRecord as d, type AnchorRegistration as e, type AnchorRegistrationOptions as f, type AnchorStrayPolicy as g, anchorAutoHandleId as h, anchorDotHandleId as i, anchorHandleId as j, computeAnchorGeometry as k, parseAnchorDotHandleId as l, parseAnchorHandleId as m, normalizeAnchorConnection as n, parseAnchorAutoHandleId as p, strayPlacementPct as s };

package/dist/svg/index.d.ts

@@ -0,0 +1,127 @@
+import * as react from 'react';
+import { CSSProperties } from 'react';
+import { g as AnchorStrayPolicy } from '../registry-Dkk4ZKt-.js';
+import '../types-B8AAJ60T.js';
+
+/**
+ * The extract seam behind `<SvgArtwork>` — which elements inside a parsed
+ * artwork become connectable anchors. The default is attribute-driven and
+ * convention-free: markup opts elements in with `data-anchor`. Consumers whose
+ * artwork follows other conventions (Figma layer names serialized as `id`s, a
+ * tool-specific class scheme) swap the extractor via the `extract` prop —
+ * granularity lives here, never in core heuristics.
+ */
+/** An element inside the artwork to expose as a connectable anchor. */
+type SvgAnchorTarget = {
+    /**
+     * Identifies the anchor within its node. Persisted edge handle ids derive
+     * from it, so it must be stable across parses of the same markup.
+     */
+    anchorId: string;
+    /** The live element inside the mounted artwork the anchor binds to. */
+    element: Element;
+    /** Accent color for the anchor's grab dots. */
+    color?: string;
+};
+/**
+ * The extract seam's contract: the mounted, sanitized `<svg>` root in, the
+ * anchor targets out. Runs after `parse`, re-runs when the markup changes.
+ */
+type SvgAnchorExtractor = (root: SVGSVGElement) => SvgAnchorTarget[];
+/**
+ * The default extractor: elements carrying a `data-anchor` attribute become
+ * anchors, in document order. The attribute's value is the anchor id; an empty
+ * value falls back to the element's `id`. Elements with neither are skipped,
+ * as is anything inside `<defs>` (not rendered, so there is nothing to measure)
+ * and any id already taken (first occurrence wins). Bare `id`s alone do not
+ * opt in — ids are routinely gradient/clip plumbing, not connection points.
+ */
+declare const extractAnchors: SvgAnchorExtractor;
+
+/**
+ * The default SVG parser behind `<SvgArtwork>` — markup string in, safe live
+ * root out, `null` when the input can't be rendered.
+ *
+ * The policy is strict-and-lossy: anything with scripting or
+ * external-reference potential is dropped, never allowlisted-by-default.
+ * Fidelity for exotic markup (filters, embedded rasters, cross-document
+ * `<use>`) is regained by swapping the parser via the `parse` prop — the trust
+ * decision is explicit and lives in the app, not in flags on this default.
+ */
+/**
+ * The parse seam's contract: markup in, a safe, detached `<svg>` root out.
+ * Returning `null` refuses to render. Consumers swap in their own (DOMPurify,
+ * or a pass-through for self-authored markup) via `<SvgArtwork parse>`.
+ */
+type SvgParser = (markup: string) => SVGSVGElement | null;
+/**
+ * Parse and sanitize SVG markup. Rejects (`null`) inputs that aren't a
+ * well-formed SVG document; strips `<script>` and `<foreignObject>` subtrees,
+ * every `on*` event attribute, and any `href`/`xlink:href` that isn't a
+ * same-document fragment (`#…`) — which covers `javascript:` and external
+ * URLs alike.
+ */
+declare const parseSvg: SvgParser;
+/** An SVG document's natural size, from its attributes or `viewBox`. */
+type SvgIntrinsicSize = {
+    width: number;
+    height: number;
+};
+/**
+ * Read an SVG root's intrinsic size — the `width`/`height` attributes when
+ * they carry positive lengths, the `viewBox` extent otherwise, `null` when
+ * neither does. Consumers use it for spawn sizing (how large a pasted artwork
+ * should drop in); `<SvgArtwork>` uses it to synthesize a missing `viewBox` so
+ * the artwork scales with the node box.
+ */
+declare function readIntrinsicSize(svg: SVGSVGElement): SvgIntrinsicSize | null;
+
+type SvgArtworkProps = {
+    /** Raw SVG markup — parsed and sanitized through `parse` before mounting. */
+    markup: string;
+    /**
+     * The parse seam: markup in, safe live root out, `null` to refuse. Defaults
+     * to the built-in strict-and-lossy parser; swap in DOMPurify (or a
+     * pass-through for markup you author yourself) to trade strictness for
+     * fidelity — the trust decision is yours and explicit.
+     */
+    parse?: SvgParser;
+    /**
+     * The extract seam: which elements inside the artwork become connectable
+     * anchors. Defaults to the attribute-driven `extractAnchors` (`data-anchor`
+     * opts in). Only consulted when the artwork renders inside a rivet node;
+     * return `[]` to render display-only.
+     */
+    extract?: SvgAnchorExtractor;
+    /**
+     * Stray-handle chrome policy for the extracted anchors. Defaults to
+     * `"none"` — a shape edge-connects at its boundary through its grab dots,
+     * and a floating perimeter handle beside artwork reads as clutter. Pass
+     * `"dynamic"` for the inline-text-style perimeter chrome.
+     */
+    anchorStrays?: AnchorStrayPolicy;
+    className?: string;
+    style?: CSSProperties;
+};
+/**
+ * Renders SVG markup inside a node, filling the node box. The markup is parsed
+ * through the `parse` seam, then the root is normalized to scale with the box:
+ * `width`/`height` become `100%`, a missing `viewBox` is synthesized from the
+ * intrinsic size, and a missing `preserveAspectRatio` defaults to
+ * `"xMidYMid meet"` (a value the document already carries is respected).
+ *
+ * Inside a rivet node, elements the `extract` seam selects are registered as
+ * anchors on that node — measured, given grab-dot chrome, connectable like any
+ * `<Anchor>`. Extraction re-runs when the markup changes, diffing by anchor
+ * id: surviving ids are rebound (geometry retained, edges stay put), ids gone
+ * from the new markup are unregistered — the shape was edited away for good.
+ * Unmounting only *detaches* (stale retention), matching `<Anchor>`. Outside a
+ * node — or outside `<Rivet>` entirely — the component is display-only.
+ *
+ * The wrapper ignores pointer events so a press falls through to the node
+ * wrapper — the whole graphic stays draggable. Nothing renders when `parse`
+ * refuses the markup.
+ */
+declare function SvgArtwork({ markup, parse, extract, anchorStrays, className, style, }: SvgArtworkProps): react.JSX.Element;
+
+export { type SvgAnchorExtractor, type SvgAnchorTarget, SvgArtwork, type SvgArtworkProps, type SvgIntrinsicSize, type SvgParser, extractAnchors, parseSvg, readIntrinsicSize };

package/dist/svg/index.js

@@ -0,0 +1,126 @@
+import { RivetContext, RivetNodeContext } from '../chunk-VQYN27OK.js';
+import { useRef, useContext, useLayoutEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+// src/svg/extract.ts
+var extractAnchors = (root) => {
+  const targets = [];
+  const taken = /* @__PURE__ */ new Set();
+  for (const element of root.querySelectorAll("[data-anchor]")) {
+    if (element.closest("defs")) continue;
+    const anchorId = element.getAttribute("data-anchor")?.trim() || element.id;
+    if (!anchorId || taken.has(anchorId)) continue;
+    taken.add(anchorId);
+    targets.push({ anchorId, element });
+  }
+  return targets;
+};
+
+// src/svg/parse.ts
+var SVG_NS = "http://www.w3.org/2000/svg";
+var DENIED_ELEMENTS = "script, foreignObject";
+var parseSvg = (markup) => {
+  if (typeof DOMParser === "undefined") return null;
+  const doc = new DOMParser().parseFromString(markup, "image/svg+xml");
+  if (doc.querySelector("parsererror")) return null;
+  const root = doc.documentElement;
+  if (root.namespaceURI !== SVG_NS || root.localName !== "svg") return null;
+  const svg = root;
+  for (const el of svg.querySelectorAll(DENIED_ELEMENTS)) el.remove();
+  const strip = (el) => {
+    for (const attr of Array.from(el.attributes)) {
+      const name = attr.name.toLowerCase();
+      const isRef = name === "href" || name === "xlink:href";
+      const denied = name.startsWith("on") || isRef && !attr.value.trim().startsWith("#");
+      if (denied) el.removeAttribute(attr.name);
+    }
+  };
+  strip(svg);
+  for (const el of svg.querySelectorAll("*")) strip(el);
+  return svg;
+};
+function readIntrinsicSize(svg) {
+  const box = viewBoxNumbers(svg.getAttribute("viewBox"));
+  const width = parseLength(svg.getAttribute("width")) ?? box?.[2] ?? null;
+  const height = parseLength(svg.getAttribute("height")) ?? box?.[3] ?? null;
+  if (!width || !height || width <= 0 || height <= 0) return null;
+  return { width, height };
+}
+function viewBoxNumbers(viewBox) {
+  if (!viewBox) return null;
+  const parts = viewBox.split(/[\s,]+/).map(Number);
+  if (parts.length !== 4 || !parts.every(Number.isFinite)) return null;
+  return parts;
+}
+function parseLength(value) {
+  if (!value || value.includes("%")) return null;
+  const n = Number.parseFloat(value);
+  return Number.isFinite(n) ? n : null;
+}
+function SvgArtwork({
+  markup,
+  parse,
+  extract,
+  anchorStrays,
+  className,
+  style
+}) {
+  const ref = useRef(null);
+  const rivet = useContext(RivetContext);
+  const node = useContext(RivetNodeContext);
+  const store = rivet?.store ?? null;
+  const nodeId = node?.nodeId;
+  const wired = useRef(/* @__PURE__ */ new Set());
+  useLayoutEffect(() => {
+    const container = ref.current;
+    if (!container) return;
+    const svg = (parse ?? parseSvg)(markup);
+    if (svg) {
+      fitToBox(svg);
+      container.replaceChildren(svg);
+    } else {
+      container.replaceChildren();
+    }
+    if (!store || nodeId === void 0) return;
+    const targets = svg ? (extract ?? extractAnchors)(svg) : [];
+    const next = /* @__PURE__ */ new Set();
+    for (const target of targets) {
+      next.add(target.anchorId);
+      store.registerAnchor(nodeId, target.anchorId, target.element, {
+        color: target.color,
+        strays: anchorStrays ?? "none"
+      });
+    }
+    for (const id of wired.current) {
+      if (!next.has(id)) store.unregisterAnchor(nodeId, id);
+    }
+    wired.current = next;
+    return () => {
+      for (const id of wired.current) store.detachAnchor(nodeId, id);
+    };
+  }, [markup, parse, extract, anchorStrays, store, nodeId]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      "data-rivet-svg-artwork": "",
+      className,
+      style: { width: "100%", height: "100%", pointerEvents: "none", ...style }
+    }
+  );
+}
+function fitToBox(svg) {
+  if (!svg.getAttribute("viewBox")) {
+    const size = readIntrinsicSize(svg);
+    if (size) svg.setAttribute("viewBox", `0 0 ${size.width} ${size.height}`);
+  }
+  svg.setAttribute("width", "100%");
+  svg.setAttribute("height", "100%");
+  if (!svg.getAttribute("preserveAspectRatio"))
+    svg.setAttribute("preserveAspectRatio", "xMidYMid meet");
+  svg.style.display = "block";
+}
+
+export { SvgArtwork, extractAnchors, parseSvg, readIntrinsicSize };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/svg/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/svg/extract.ts","../../src/svg/parse.ts","../../src/svg/svg-artwork.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["/**\n * The extract seam behind `<SvgArtwork>` — which elements inside a parsed\n * artwork become connectable anchors. The default is attribute-driven and\n * convention-free: markup opts elements in with `data-anchor`. Consumers whose\n * artwork follows other conventions (Figma layer names serialized as `id`s, a\n * tool-specific class scheme) swap the extractor via the `extract` prop —\n * granularity lives here, never in core heuristics.\n */\n\n/** An element inside the artwork to expose as a connectable anchor. */\nexport type SvgAnchorTarget = {\n  /**\n   * Identifies the anchor within its node. Persisted edge handle ids derive\n   * from it, so it must be stable across parses of the same markup.\n   */\n  anchorId: string\n  /** The live element inside the mounted artwork the anchor binds to. */\n  element: Element\n  /** Accent color for the anchor's grab dots. */\n  color?: string\n}\n\n/**\n * The extract seam's contract: the mounted, sanitized `<svg>` root in, the\n * anchor targets out. Runs after `parse`, re-runs when the markup changes.\n */\nexport type SvgAnchorExtractor = (root: SVGSVGElement) => SvgAnchorTarget[]\n\n/**\n * The default extractor: elements carrying a `data-anchor` attribute become\n * anchors, in document order. The attribute's value is the anchor id; an empty\n * value falls back to the element's `id`. Elements with neither are skipped,\n * as is anything inside `<defs>` (not rendered, so there is nothing to measure)\n * and any id already taken (first occurrence wins). Bare `id`s alone do not\n * opt in — ids are routinely gradient/clip plumbing, not connection points.\n */\nexport const extractAnchors: SvgAnchorExtractor = (root) => {\n  const targets: SvgAnchorTarget[] = []\n  const taken = new Set<string>()\n  for (const element of root.querySelectorAll(\"[data-anchor]\")) {\n    if (element.closest(\"defs\")) continue\n    const anchorId = element.getAttribute(\"data-anchor\")?.trim() || element.id\n    if (!anchorId || taken.has(anchorId)) continue\n    taken.add(anchorId)\n    targets.push({ anchorId, element })\n  }\n  return targets\n}\n","/**\n * The default SVG parser behind `<SvgArtwork>` — markup string in, safe live\n * root out, `null` when the input can't be rendered.\n *\n * The policy is strict-and-lossy: anything with scripting or\n * external-reference potential is dropped, never allowlisted-by-default.\n * Fidelity for exotic markup (filters, embedded rasters, cross-document\n * `<use>`) is regained by swapping the parser via the `parse` prop — the trust\n * decision is explicit and lives in the app, not in flags on this default.\n */\n\nconst SVG_NS = \"http://www.w3.org/2000/svg\"\n\n/**\n * The parse seam's contract: markup in, a safe, detached `<svg>` root out.\n * Returning `null` refuses to render. Consumers swap in their own (DOMPurify,\n * or a pass-through for self-authored markup) via `<SvgArtwork parse>`.\n */\nexport type SvgParser = (markup: string) => SVGSVGElement | null\n\n/** Elements with scripting or arbitrary-content potential, dropped entirely. */\nconst DENIED_ELEMENTS = \"script, foreignObject\"\n\n/**\n * Parse and sanitize SVG markup. Rejects (`null`) inputs that aren't a\n * well-formed SVG document; strips `<script>` and `<foreignObject>` subtrees,\n * every `on*` event attribute, and any `href`/`xlink:href` that isn't a\n * same-document fragment (`#…`) — which covers `javascript:` and external\n * URLs alike.\n */\nexport const parseSvg: SvgParser = (markup) => {\n  if (typeof DOMParser === \"undefined\") return null\n  const doc = new DOMParser().parseFromString(markup, \"image/svg+xml\")\n  if (doc.querySelector(\"parsererror\")) return null\n  const root = doc.documentElement\n  if (root.namespaceURI !== SVG_NS || root.localName !== \"svg\") return null\n  const svg = root as unknown as SVGSVGElement\n\n  for (const el of svg.querySelectorAll(DENIED_ELEMENTS)) el.remove()\n\n  const strip = (el: Element) => {\n    for (const attr of Array.from(el.attributes)) {\n      const name = attr.name.toLowerCase()\n      const isRef = name === \"href\" || name === \"xlink:href\"\n      const denied = name.startsWith(\"on\") || (isRef && !attr.value.trim().startsWith(\"#\"))\n      if (denied) el.removeAttribute(attr.name)\n    }\n  }\n  strip(svg)\n  for (const el of svg.querySelectorAll(\"*\")) strip(el)\n\n  return svg\n}\n\n/** An SVG document's natural size, from its attributes or `viewBox`. */\nexport type SvgIntrinsicSize = { width: number; height: number }\n\n/**\n * Read an SVG root's intrinsic size — the `width`/`height` attributes when\n * they carry positive lengths, the `viewBox` extent otherwise, `null` when\n * neither does. Consumers use it for spawn sizing (how large a pasted artwork\n * should drop in); `<SvgArtwork>` uses it to synthesize a missing `viewBox` so\n * the artwork scales with the node box.\n */\nexport function readIntrinsicSize(svg: SVGSVGElement): SvgIntrinsicSize | null {\n  const box = viewBoxNumbers(svg.getAttribute(\"viewBox\"))\n  const width = parseLength(svg.getAttribute(\"width\")) ?? box?.[2] ?? null\n  const height = parseLength(svg.getAttribute(\"height\")) ?? box?.[3] ?? null\n  if (!width || !height || width <= 0 || height <= 0) return null\n  return { width, height }\n}\n\n/** Parse a `viewBox` to its four numbers, or `null` if it isn't well-formed. */\nfunction viewBoxNumbers(viewBox: string | null): [number, number, number, number] | null {\n  if (!viewBox) return null\n  const parts = viewBox.split(/[\\s,]+/).map(Number)\n  if (parts.length !== 4 || !parts.every(Number.isFinite)) return null\n  return parts as [number, number, number, number]\n}\n\n/** Parse a length attribute (`\"240\"`, `\"240px\"`) to a number, or `null`. Relative lengths (`\"100%\"`) aren't sizes. */\nfunction parseLength(value: string | null): number | null {\n  if (!value || value.includes(\"%\")) return null\n  const n = Number.parseFloat(value)\n  return Number.isFinite(n) ? n : null\n}\n","import { type CSSProperties, useContext, useLayoutEffect, useRef } from \"react\"\nimport type { AnchorStrayPolicy } from \"../anchor/registry\"\nimport { RivetContext, RivetNodeContext } from \"../context\"\nimport { extractAnchors, type SvgAnchorExtractor } from \"./extract\"\nimport { parseSvg, readIntrinsicSize, type SvgParser } from \"./parse\"\n\nexport type SvgArtworkProps = {\n  /** Raw SVG markup — parsed and sanitized through `parse` before mounting. */\n  markup: string\n  /**\n   * The parse seam: markup in, safe live root out, `null` to refuse. Defaults\n   * to the built-in strict-and-lossy parser; swap in DOMPurify (or a\n   * pass-through for markup you author yourself) to trade strictness for\n   * fidelity — the trust decision is yours and explicit.\n   */\n  parse?: SvgParser\n  /**\n   * The extract seam: which elements inside the artwork become connectable\n   * anchors. Defaults to the attribute-driven `extractAnchors` (`data-anchor`\n   * opts in). Only consulted when the artwork renders inside a rivet node;\n   * return `[]` to render display-only.\n   */\n  extract?: SvgAnchorExtractor\n  /**\n   * Stray-handle chrome policy for the extracted anchors. Defaults to\n   * `\"none\"` — a shape edge-connects at its boundary through its grab dots,\n   * and a floating perimeter handle beside artwork reads as clutter. Pass\n   * `\"dynamic\"` for the inline-text-style perimeter chrome.\n   */\n  anchorStrays?: AnchorStrayPolicy\n  className?: string\n  style?: CSSProperties\n}\n\n/**\n * Renders SVG markup inside a node, filling the node box. The markup is parsed\n * through the `parse` seam, then the root is normalized to scale with the box:\n * `width`/`height` become `100%`, a missing `viewBox` is synthesized from the\n * intrinsic size, and a missing `preserveAspectRatio` defaults to\n * `\"xMidYMid meet\"` (a value the document already carries is respected).\n *\n * Inside a rivet node, elements the `extract` seam selects are registered as\n * anchors on that node — measured, given grab-dot chrome, connectable like any\n * `<Anchor>`. Extraction re-runs when the markup changes, diffing by anchor\n * id: surviving ids are rebound (geometry retained, edges stay put), ids gone\n * from the new markup are unregistered — the shape was edited away for good.\n * Unmounting only *detaches* (stale retention), matching `<Anchor>`. Outside a\n * node — or outside `<Rivet>` entirely — the component is display-only.\n *\n * The wrapper ignores pointer events so a press falls through to the node\n * wrapper — the whole graphic stays draggable. Nothing renders when `parse`\n * refuses the markup.\n */\nexport function SvgArtwork({\n  markup,\n  parse,\n  extract,\n  anchorStrays,\n  className,\n  style,\n}: SvgArtworkProps) {\n  const ref = useRef<HTMLDivElement>(null)\n  // Read, not required: outside <Rivet> or outside a node the artwork still\n  // renders, it just exposes no anchors.\n  const rivet = useContext(RivetContext)\n  const node = useContext(RivetNodeContext)\n  const store = rivet?.store ?? null\n  const nodeId = node?.nodeId\n  /** Anchor ids currently registered from this artwork. */\n  const wired = useRef(new Set<string>())\n\n  useLayoutEffect(() => {\n    const container = ref.current\n    if (!container) return\n    const svg = (parse ?? parseSvg)(markup)\n    if (svg) {\n      fitToBox(svg)\n      container.replaceChildren(svg)\n    } else {\n      container.replaceChildren()\n    }\n\n    if (!store || nodeId === undefined) return\n    // Refused markup extracts nothing, so its anchors unregister below — the\n    // same fate as ids missing from a successful re-parse.\n    const targets = svg ? (extract ?? extractAnchors)(svg) : []\n    const next = new Set<string>()\n    for (const target of targets) {\n      next.add(target.anchorId)\n      store.registerAnchor(nodeId, target.anchorId, target.element, {\n        color: target.color,\n        strays: anchorStrays ?? \"none\",\n      })\n    }\n    for (const id of wired.current) {\n      if (!next.has(id)) store.unregisterAnchor(nodeId, id)\n    }\n    wired.current = next\n    return () => {\n      for (const id of wired.current) store.detachAnchor(nodeId, id)\n    }\n  }, [markup, parse, extract, anchorStrays, store, nodeId])\n\n  return (\n    <div\n      ref={ref}\n      data-rivet-svg-artwork=\"\"\n      className={className}\n      style={{ width: \"100%\", height: \"100%\", pointerEvents: \"none\", ...style }}\n    />\n  )\n}\n\n/** Make the root scale with its container instead of its authored size. */\nfunction fitToBox(svg: SVGSVGElement): void {\n  if (!svg.getAttribute(\"viewBox\")) {\n    const size = readIntrinsicSize(svg)\n    if (size) svg.setAttribute(\"viewBox\", `0 0 ${size.width} ${size.height}`)\n  }\n  svg.setAttribute(\"width\", \"100%\")\n  svg.setAttribute(\"height\", \"100%\")\n  if (!svg.getAttribute(\"preserveAspectRatio\"))\n    svg.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\")\n  svg.style.display = \"block\"\n}\n"]}

package/dist/swimlane/index.d.ts

@@ -0,0 +1,96 @@
+import { R as Rect, c as RivetNode, V as Vec2, S as Size, k as SwimlaneMargin, j as SwimlaneGroup } from '../types-B8AAJ60T.js';
+export { L as LaneChange, M as Swimlane, l as SwimlaneHeaderProps, m as SwimlaneLabelProps, n as SwimlaneSizeChange } from '../types-B8AAJ60T.js';
+import 'react';
+
+/** World height of a group's sticky header band. */
+declare const SWIMLANE_GROUP_HEADER_SIZE = 32;
+/** Screen width of the sticky vertical lane-label strip, in px. */
+declare const SWIMLANE_LABEL_WIDTH = 24;
+/** Floor for a lane's height when resized, in world units. */
+declare const SWIMLANE_MIN_HEIGHT = 80;
+/** A margin with every side filled in. */
+type ResolvedMargin = {
+    top: number;
+    right: number;
+    bottom: number;
+    left: number;
+};
+/** Normalize a `swimlaneMargin` prop (number shorthand or per-side) to all sides. */
+declare function resolveMargin(margin?: number | SwimlaneMargin): ResolvedMargin;
+/** A lane resolved to world-space geometry (its body, below the group header). */
+type ResolvedLane = {
+    id: string;
+    groupId: string;
+    label?: string;
+    color?: string;
+    /** World-space top edge of the lane body. */
+    top: number;
+    height: number;
+    /** World x origin and nominal width (bands render effectively infinite). */
+    x: number;
+    width: number;
+};
+/** A group resolved to world-space geometry: its header band plus its lanes. */
+type ResolvedSwimlaneGroup = {
+    id: string;
+    label?: string;
+    color?: string;
+    x: number;
+    width: number;
+    /** World top edge of the header band. */
+    top: number;
+    /** Header band height in world units. */
+    headerSize: number;
+    /** World bottom edge of the whole group (its last lane's bottom). */
+    bottom: number;
+    lanes: ResolvedLane[];
+};
+/** A resolved lane plus how much of it is currently on screen. */
+type VisibleLane = ResolvedLane & {
+    /** Area (world units²) of the lane's overlap with the viewport. */
+    visibleArea: number;
+};
+/**
+ * A snapshot of what the pane is currently showing, produced by
+ * `getViewportElements`. Read imperatively — it never subscribes to the
+ * viewport, so calling it does not re-render.
+ */
+type ViewportElements<TNodeData = unknown> = {
+    /** The world-space rect currently visible in the pane. */
+    rect: Rect;
+    /** Nodes whose world box intersects the viewport. */
+    nodes: RivetNode<TNodeData>[];
+    /** Visible lanes, largest on-screen area first. `lanes[0]` is the dominant lane. */
+    lanes: VisibleLane[];
+};
+/**
+ * Return `color` as an `rgba()` with the given alpha. Hex (`#rgb`/`#rrggbb`) is
+ * converted; any other form (already-rgba, named) is returned unchanged. Used so
+ * a solid accent color renders as a subtle tint, never an opaque wash.
+ */
+declare function withAlpha(color: string, alpha: number): string;
+/** Lay a group out: a header band at `position.y`, then its lanes stacked below. */
+declare function resolveSwimlaneGroup(group: SwimlaneGroup, headerSize?: number): ResolvedSwimlaneGroup;
+/** Resolve every group in a `swimlane` prop to world-space geometry. */
+declare function resolveSwimlanes(groups: SwimlaneGroup[], headerSize?: number): ResolvedSwimlaneGroup[];
+/** Flatten every group's lanes into a single list. */
+declare function flattenLanes(groups: ResolvedSwimlaneGroup[]): ResolvedLane[];
+/**
+ * The lane a node box `[top, top+height]` belongs to: the one it overlaps most
+ * (ties prefer `preferredLaneId`), or — with no overlap at all — the nearest by
+ * center. Returns null only when there are no lanes.
+ */
+declare function findLaneByCoverage(lanes: ResolvedLane[], top: number, height: number, preferredLaneId?: string): ResolvedLane | null;
+type LaneClampResult = {
+    position: Vec2;
+    laneId: string | null;
+};
+/**
+ * Clamp a node so its whole body sits inside one lane, honoring `margin` (and
+ * the left label strip). The target lane is chosen by {@link findLaneByCoverage}
+ * — pass `preferredLaneId` to bias toward the node's current lane. Horizontally
+ * only the left edge is bounded, since bands are effectively infinite.
+ */
+declare function clampNodeToLanes(position: Vec2, size: Size, lanes: ResolvedLane[], margin: ResolvedMargin, labelWidth: number, preferredLaneId?: string): LaneClampResult;
+
+export { type LaneClampResult, type ResolvedLane, type ResolvedMargin, type ResolvedSwimlaneGroup, SWIMLANE_GROUP_HEADER_SIZE, SWIMLANE_LABEL_WIDTH, SWIMLANE_MIN_HEIGHT, SwimlaneGroup, SwimlaneMargin, type ViewportElements, type VisibleLane, clampNodeToLanes, findLaneByCoverage, flattenLanes, resolveMargin, resolveSwimlaneGroup, resolveSwimlanes, withAlpha };

package/dist/swimlane/index.js

@@ -0,0 +1,3 @@
+export { SWIMLANE_GROUP_HEADER_SIZE, SWIMLANE_LABEL_WIDTH, SWIMLANE_MIN_HEIGHT, clampNodeToLanes, findLaneByCoverage, flattenLanes, resolveMargin, resolveSwimlaneGroup, resolveSwimlanes, withAlpha } from '../chunk-6XRQSAQT.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/swimlane/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}