@zvk/graphs 0.1.1 → 0.1.3

package/dist/svg.js

@@ -1,50 +1,265 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useId } from "react";
 import { getEdgeAccessibleLabel } from "./diagnostics.js";
-import { nodeCenter } from "./layout/index.js";
+import { deriveGraphEdgeLabelAnchor, deriveGraphGroupBounds, getGraphBounds, nodeCenter } from "./layout/index.js";
 function pathForPoints(points) {
     if (points.length === 0 || !points[0]) {
         return "";
     }
     return points.slice(1).reduce((path, point) => `${path} L ${point.x} ${point.y}`, `M ${points[0].x} ${points[0].y}`);
 }
-function graphBounds(graph) {
-    const padding = 24;
-    const maxX = graph.nodes.reduce((value, node) => Math.max(value, node.position.x + node.size.width), 0);
-    const maxY = graph.nodes.reduce((value, node) => Math.max(value, node.position.y + node.size.height), 0);
-    const width = Math.max(1, maxX + padding * 2);
-    const height = Math.max(1, maxY + padding * 2);
-    return {
-        width,
-        height,
-        viewBox: `${-padding} ${-padding} ${width} ${height}`
-    };
-}
 function nodeSelected(selectedNodeIds, nodeId) {
     return selectedNodeIds?.includes(nodeId) ?? false;
 }
 function edgeSelected(selectedEdgeIds, edgeId) {
     return selectedEdgeIds?.includes(edgeId) ?? false;
 }
+function summaryValue(value) {
+    if (typeof value === "string") {
+        return value.trim().length > 0 ? value : undefined;
+    }
+    if (typeof value === "number" || typeof value === "boolean") {
+        return String(value);
+    }
+    return undefined;
+}
+function metadataValue(value) {
+    if (value === null) {
+        return "None";
+    }
+    return summaryValue(value);
+}
+function metadataRows(metadata, visibility) {
+    return (metadata ?? []).filter((item) => {
+        if (metadataValue(item.value) === undefined) {
+            return false;
+        }
+        return visibility === undefined ? true : item.visibility === visibility;
+    });
+}
+function nodeAccessibleLabel(node) {
+    const label = node.accessibility?.label;
+    return label && label.trim().length > 0 ? label : node.label;
+}
+function nodeAccessibleDescription(node) {
+    return node.accessibility?.description ?? node.ariaDescription ?? node.summary;
+}
+function edgeAccessibleDescription(edge, graph) {
+    return edge.accessibility?.description ?? edgeDescription(edge, graph);
+}
+function groupAccessibleLabel(group) {
+    const label = group.accessibility?.label;
+    return label && label.trim().length > 0 ? label : group.label;
+}
+function groupAccessibleDescription(group) {
+    return group.accessibility?.description ?? group.summary;
+}
+function normalizeNodeShape(node) {
+    return node.presentation?.shape ?? "rounded";
+}
+function nodeLabelLines(node) {
+    const lines = node.labelLines?.filter((line) => line.trim().length > 0);
+    return lines && lines.length > 0 ? lines : [node.label];
+}
+function defaultStatusGlyph(status) {
+    if (!status) {
+        return undefined;
+    }
+    if (status === "success") {
+        return "OK";
+    }
+    if (status === "warning" || status === "danger" || status === "destructive") {
+        return "!";
+    }
+    if (status === "info") {
+        return "i";
+    }
+    if (status === "active") {
+        return "*";
+    }
+    if (status === "disabled") {
+        return "-";
+    }
+    return status.slice(0, 1).toUpperCase();
+}
+function nodeGlyph(node) {
+    return node.presentation?.glyph ?? node.presentation?.statusGlyph ?? defaultStatusGlyph(node.status);
+}
+function nodeBadge(node) {
+    return node.presentation?.badge ?? node.presentation?.statusLabel;
+}
+function NodeShape({ node, shape }) {
+    if (shape === "circle") {
+        return (_jsx("ellipse", { className: "zvk-graphs__node-shape", cx: node.size.width / 2, cy: node.size.height / 2, rx: node.size.width / 2, ry: node.size.height / 2 }));
+    }
+    if (shape === "diamond") {
+        const points = [
+            `${node.size.width / 2},0`,
+            `${node.size.width},${node.size.height / 2}`,
+            `${node.size.width / 2},${node.size.height}`,
+            `0,${node.size.height / 2}`
+        ].join(" ");
+        return _jsx("polygon", { className: "zvk-graphs__node-shape", points: points });
+    }
+    const rx = shape === "rect" ? 0 : shape === "pill" ? node.size.height / 2 : 8;
+    return _jsx("rect", { className: "zvk-graphs__node-shape", width: node.size.width, height: node.size.height, rx: rx });
+}
+function NodeLabel({ node }) {
+    const lines = nodeLabelLines(node);
+    const lineHeight = 14;
+    const firstY = node.size.height / 2 - ((lines.length - 1) * lineHeight) / 2;
+    return (_jsx("text", { className: "zvk-graphs__node-label", x: node.size.width / 2, children: lines.map((line, index) => (_jsx("tspan", { x: node.size.width / 2, y: firstY + index * lineHeight, children: line }, `${node.id}-label-${index}`))) }));
+}
+function NodeSummaryMetadata({ node }) {
+    const rows = metadataRows(node.metadata, "summary");
+    if (rows.length === 0) {
+        return null;
+    }
+    const lineHeight = 11;
+    const startY = node.size.height - 8 - (rows.length - 1) * lineHeight;
+    return (_jsx("g", { className: "zvk-graphs__node-metadata", "aria-hidden": "true", children: rows.map((item, index) => (_jsxs("text", { className: "zvk-graphs__node-metadata-item", "data-tone": item.tone, x: node.size.width / 2, y: startY + index * lineHeight, children: [item.label, ": ", metadataValue(item.value)] }, item.key))) }));
+}
+function edgeDescription(edge, graph) {
+    const source = graph.nodes.find((node) => node.id === edge.source)?.label ?? edge.source;
+    const target = graph.nodes.find((node) => node.id === edge.target)?.label ?? edge.target;
+    const details = [
+        `Source: ${source}`,
+        `Target: ${target}`,
+        edge.status ? `Status: ${edge.status}` : undefined,
+        edge.summary ?? summaryValue(edge.data)
+    ].filter(Boolean);
+    return details.join(". ");
+}
+function DetailRow({ label, value }) {
+    if (!value) {
+        return null;
+    }
+    return (_jsxs(_Fragment, { children: [_jsx("dt", { children: label }), _jsx("dd", { children: value })] }));
+}
+function MetadataFallbackRows({ metadata }) {
+    const rows = metadataRows(metadata);
+    if (rows.length === 0) {
+        return null;
+    }
+    return (_jsx(_Fragment, { children: rows.map((item) => (_jsx(DetailRow, { label: item.label, value: metadataValue(item.value) }, item.key))) }));
+}
+function GroupFallbackDetails({ group, memberLabels }) {
+    const description = groupAccessibleDescription(group);
+    const hasMetadata = metadataRows(group.metadata).length > 0;
+    const hasDetails = group.summary ||
+        group.accessibility?.label ||
+        description ||
+        group.tone ||
+        group.status ||
+        hasMetadata ||
+        memberLabels.length > 0;
+    if (!hasDetails) {
+        return null;
+    }
+    return (_jsxs("dl", { className: "zvk-graphs__fallback-details", children: [_jsx(DetailRow, { label: "Summary", value: group.summary }), _jsx(DetailRow, { label: "Accessible label", value: group.accessibility?.label }), _jsx(DetailRow, { label: "Description", value: description }), _jsx(DetailRow, { label: "Tone", value: group.tone }), _jsx(DetailRow, { label: "Status", value: group.status }), _jsx(MetadataFallbackRows, { metadata: group.metadata }), _jsx(DetailRow, { label: "Members", value: memberLabels.length > 0 ? memberLabels.join(", ") : undefined })] }));
+}
+function NodeFallbackDetails({ node, groupLabel }) {
+    const dataSummary = summaryValue(node.data);
+    const accessibilityDescription = nodeAccessibleDescription(node);
+    const badge = nodeBadge(node);
+    const glyph = nodeGlyph(node);
+    const hasMetadata = metadataRows(node.metadata).length > 0;
+    const hasDetails = node.summary ||
+        node.accessibility?.label ||
+        accessibilityDescription ||
+        node.kind ||
+        node.groupId ||
+        node.status ||
+        node.presentation?.statusLabel ||
+        badge ||
+        glyph ||
+        hasMetadata ||
+        dataSummary;
+    if (!hasDetails) {
+        return null;
+    }
+    return (_jsxs("dl", { className: "zvk-graphs__fallback-details", children: [_jsx(DetailRow, { label: "Summary", value: node.summary }), _jsx(DetailRow, { label: "Accessible label", value: node.accessibility?.label }), _jsx(DetailRow, { label: "Description", value: accessibilityDescription }), _jsx(DetailRow, { label: "Kind", value: node.kind }), _jsx(DetailRow, { label: "Group", value: groupLabel ?? node.groupId }), _jsx(DetailRow, { label: "Status", value: node.status }), _jsx(DetailRow, { label: "Status label", value: node.presentation?.statusLabel }), _jsx(DetailRow, { label: "Badge", value: badge }), _jsx(DetailRow, { label: "Glyph", value: glyph }), _jsx(MetadataFallbackRows, { metadata: node.metadata }), _jsx(DetailRow, { label: "Data", value: dataSummary })] }));
+}
+function EdgeFallbackDetails({ edge, graph }) {
+    const dataSummary = summaryValue(edge.data);
+    const source = graph.nodes.find((node) => node.id === edge.source)?.label ?? edge.source;
+    const target = graph.nodes.find((node) => node.id === edge.target)?.label ?? edge.target;
+    return (_jsxs("dl", { className: "zvk-graphs__fallback-details", children: [_jsx(DetailRow, { label: "Source", value: source }), _jsx(DetailRow, { label: "Target", value: target }), _jsx(DetailRow, { label: "Kind", value: edge.kind }), _jsx(DetailRow, { label: "Route", value: edge.routeKind }), _jsx(DetailRow, { label: "Accessible label", value: edge.accessibility?.label }), _jsx(DetailRow, { label: "Description", value: edge.accessibility?.description }), _jsx(DetailRow, { label: "Status", value: edge.status }), _jsx(DetailRow, { label: "Summary", value: edge.summary }), _jsx(MetadataFallbackRows, { metadata: edge.metadata }), _jsx(DetailRow, { label: "Data", value: dataSummary })] }));
+}
 export function GraphSvg({ graph, titleId, descriptionId, selectedNodeIds, selectedEdgeIds, renderNode, svgProps }) {
-    const bounds = graphBounds(graph);
+    const bounds = getGraphBounds(graph);
     const markerId = `${titleId}-arrow`;
     const hasDirectedEdges = graph.edges.some((edge) => edge.directed !== false);
-    return (_jsxs("svg", { ...svgProps, className: ["zvk-graphs__svg", svgProps?.className].filter(Boolean).join(" "), role: "img", "aria-labelledby": titleId, "aria-describedby": descriptionId, viewBox: bounds.viewBox, width: svgProps?.width ?? bounds.width, height: svgProps?.height ?? bounds.height, children: [_jsx("title", { id: titleId, children: graph.title }), _jsx("desc", { id: descriptionId, children: graph.description ?? `${graph.nodes.length} nodes and ${graph.edges.length} edges.` }), hasDirectedEdges ? (_jsx("defs", { children: _jsx("marker", { id: markerId, viewBox: "0 0 10 10", refX: "9", refY: "5", markerWidth: "7", markerHeight: "7", orient: "auto", children: _jsx("path", { className: "zvk-graphs__marker", d: "M 0 0 L 10 5 L 0 10 z" }) }) })) : null, _jsx("g", { className: "zvk-graphs__edges", children: graph.edges.map((edge) => {
+    const groupBounds = deriveGraphGroupBounds(graph);
+    const groupById = new Map((graph.groups ?? []).map((group) => [group.id, group]));
+    return (_jsxs("svg", { ...svgProps, className: ["zvk-graphs__svg", svgProps?.className].filter(Boolean).join(" "), role: "img", "aria-labelledby": titleId, "aria-describedby": descriptionId, viewBox: bounds.viewBox, width: svgProps?.width ?? bounds.width, height: svgProps?.height ?? bounds.height, children: [_jsx("title", { id: titleId, children: graph.title }), _jsx("desc", { id: descriptionId, children: graph.description ?? `${graph.nodes.length} nodes and ${graph.edges.length} edges.` }), hasDirectedEdges ? (_jsx("defs", { children: _jsx("marker", { id: markerId, viewBox: "0 0 10 10", refX: "9", refY: "5", markerWidth: "7", markerHeight: "7", orient: "auto", children: _jsx("path", { className: "zvk-graphs__marker", d: "M 0 0 L 10 5 L 0 10 z" }) }) })) : null, _jsx("g", { className: "zvk-graphs__groups", children: groupBounds.map((boundsEntry) => {
+                    const group = groupById.get(boundsEntry.groupId);
+                    if (!group) {
+                        return null;
+                    }
+                    const description = groupAccessibleDescription(group);
+                    return (_jsxs("g", { className: "zvk-graphs__group", "data-group-id": group.id, "data-tone": group.tone, "data-status": group.status, children: [_jsx("title", { children: groupAccessibleLabel(group) }), description ? _jsx("desc", { children: description }) : null, _jsx("rect", { className: "zvk-graphs__group-shape", x: boundsEntry.position.x, y: boundsEntry.position.y, width: boundsEntry.size.width, height: boundsEntry.size.height, rx: "12" }), _jsx("text", { className: "zvk-graphs__group-label", x: boundsEntry.position.x + 12, y: boundsEntry.position.y + 18, children: group.label })] }, group.id));
+                }) }), _jsx("g", { className: "zvk-graphs__edges", children: graph.edges.map((edge) => {
                     const selected = edgeSelected(selectedEdgeIds, edge.id);
                     const d = pathForPoints(edge.points);
-                    return (_jsxs("g", { className: "zvk-graphs__edge-group", "data-edge-id": edge.id, "data-status": edge.status, "data-selected": selected ? "true" : undefined, children: [_jsx("path", { className: "zvk-graphs__edge", d: d, markerEnd: edge.directed === false ? undefined : `url(#${markerId})` }), edge.label && edge.labelPosition ? (_jsx("text", { className: "zvk-graphs__edge-label", x: edge.labelPosition.x, y: edge.labelPosition.y - 6, children: edge.label })) : null] }, edge.id));
+                    const labelAnchor = deriveGraphEdgeLabelAnchor(edge);
+                    return (_jsxs("g", { className: "zvk-graphs__edge-group", "data-edge-id": edge.id, "data-edge-kind": edge.kind, "data-edge-label-anchor": labelAnchor?.anchor, "data-edge-label-side": labelAnchor?.side, "data-edge-route-kind": edge.routeKind, "data-status": edge.status, "data-selected": selected ? "true" : undefined, children: [_jsx("title", { children: getEdgeAccessibleLabel(edge, graph) }), _jsx("desc", { children: edgeAccessibleDescription(edge, graph) }), _jsx("path", { className: "zvk-graphs__edge", d: d, markerEnd: edge.directed === false ? undefined : `url(#${markerId})` }), edge.label && labelAnchor ? (_jsxs(_Fragment, { children: [_jsx("rect", { className: "zvk-graphs__edge-label-bg", x: labelAnchor.bounds.x, y: labelAnchor.bounds.y, width: labelAnchor.bounds.width, height: labelAnchor.bounds.height, rx: "4", "aria-hidden": "true" }), _jsx("text", { className: "zvk-graphs__edge-label", textAnchor: labelAnchor.anchor, x: labelAnchor.textPosition.x, y: labelAnchor.textPosition.y, children: edge.label })] })) : null] }, edge.id));
                 }) }), _jsx("g", { className: "zvk-graphs__nodes", children: graph.nodes.map((node) => {
                     const selected = nodeSelected(selectedNodeIds, node.id);
                     const center = nodeCenter(node);
-                    return (_jsxs("g", { className: "zvk-graphs__node", "data-node-id": node.id, "data-kind": node.kind, "data-status": node.status, "data-selected": selected ? "true" : undefined, transform: `translate(${node.position.x} ${node.position.y})`, children: [renderNode ? (renderNode({ node, selected, focused: false })) : (_jsxs(_Fragment, { children: [_jsx("rect", { className: "zvk-graphs__node-shape", width: node.size.width, height: node.size.height, rx: "8" }), _jsx("text", { className: "zvk-graphs__node-label", x: node.size.width / 2, y: node.size.height / 2, children: node.label }), _jsx("title", { children: node.ariaDescription ?? node.label })] })), selected ? (_jsx("rect", { className: "zvk-graphs__node-selection", x: "-4", y: "-4", width: node.size.width + 8, height: node.size.height + 8, rx: "10", "aria-hidden": "true" })) : null, _jsx("circle", { className: "zvk-graphs__node-anchor", cx: center.x - node.position.x, cy: center.y - node.position.y, r: "0" })] }, node.id));
+                    const shape = normalizeNodeShape(node);
+                    const badge = nodeBadge(node);
+                    const glyph = nodeGlyph(node);
+                    const description = nodeAccessibleDescription(node);
+                    return (_jsxs("g", { className: "zvk-graphs__node", "data-node-id": node.id, "data-kind": node.kind, "data-node-shape": shape, "data-density": node.presentation?.density, "data-tone": node.presentation?.tone, "data-status": node.status, "data-selected": selected ? "true" : undefined, transform: `translate(${node.position.x} ${node.position.y})`, children: [_jsx("title", { children: nodeAccessibleLabel(node) }), description ? _jsx("desc", { children: description }) : null, selected ? (_jsx("rect", { className: "zvk-graphs__node-selection", x: "-4", y: "-4", width: node.size.width + 8, height: node.size.height + 8, rx: "10", "aria-hidden": "true" })) : null, renderNode ? (renderNode({ node, selected, focused: false })) : (_jsxs(_Fragment, { children: [_jsx(NodeShape, { node: node, shape: shape }), glyph ? (_jsx("text", { className: "zvk-graphs__node-glyph", x: "8", y: "14", "aria-hidden": "true", children: glyph })) : null, badge ? (_jsx("text", { className: "zvk-graphs__node-badge", x: node.size.width - 8, y: "14", "aria-hidden": "true", children: badge })) : null, _jsx(NodeLabel, { node: node }), _jsx(NodeSummaryMetadata, { node: node })] })), _jsx("circle", { className: "zvk-graphs__node-anchor", cx: center.x - node.position.x, cy: center.y - node.position.y, r: "0" })] }, node.id));
                 }) })] }));
 }
 export function GraphFallbackList({ graph }) {
-    return (_jsxs("div", { className: "zvk-graphs__fallback", children: [_jsx("h3", { children: "Nodes" }), _jsx("ul", { children: graph.nodes.map((node) => (_jsxs("li", { children: [node.label, node.status ? ` (${node.status})` : ""] }, node.id))) }), _jsx("h3", { children: "Edges" }), _jsx("ul", { children: graph.edges.map((edge) => (_jsx("li", { children: getEdgeAccessibleLabel(edge, graph) }, edge.id))) })] }));
+    const groups = graph.groups ?? [];
+    const groupLabelById = new Map(groups.map((group) => [group.id, group.label]));
+    return (_jsxs("div", { className: "zvk-graphs__fallback", children: [groups.length > 0 ? (_jsxs(_Fragment, { children: [_jsx("h3", { children: "Groups" }), _jsx("ul", { children: groups.map((group) => {
+                            const memberLabels = graph.nodes.filter((node) => node.groupId === group.id).map((node) => node.label);
+                            return (_jsxs("li", { children: [group.label, group.status ? ` (${group.status})` : "", _jsx(GroupFallbackDetails, { group: group, memberLabels: memberLabels })] }, group.id));
+                        }) })] })) : null, _jsx("h3", { children: "Nodes" }), _jsx("ul", { children: graph.nodes.map((node) => {
+                    const groupLabel = node.groupId ? groupLabelById.get(node.groupId) : undefined;
+                    return (_jsxs("li", { children: [node.label, node.status ? ` (${node.status})` : "", _jsx(NodeFallbackDetails, { node: node, ...(groupLabel !== undefined ? { groupLabel } : {}) })] }, node.id));
+                }) }), _jsx("h3", { children: "Edges" }), _jsx("ul", { children: graph.edges.map((edge) => (_jsxs("li", { children: [getEdgeAccessibleLabel(edge, graph), _jsx(EdgeFallbackDetails, { edge: edge, graph: graph })] }, edge.id))) })] }));
 }
 export function GraphFallbackTree({ graph }) {
-    return _jsx(GraphFallbackList, { graph: graph });
+    const childIdsByNodeId = new Map();
+    const parentCountByNodeId = new Map();
+    const nodeById = new Map(graph.nodes.map((node) => [node.id, node]));
+    const groupLabelById = new Map((graph.groups ?? []).map((group) => [group.id, group.label]));
+    for (const node of graph.nodes) {
+        childIdsByNodeId.set(node.id, []);
+        parentCountByNodeId.set(node.id, 0);
+    }
+    for (const edge of graph.edges) {
+        if (!nodeById.has(edge.source) || !nodeById.has(edge.target)) {
+            continue;
+        }
+        childIdsByNodeId.get(edge.source)?.push(edge.target);
+        parentCountByNodeId.set(edge.target, (parentCountByNodeId.get(edge.target) ?? 0) + 1);
+    }
+    const roots = graph.nodes.filter((node) => parentCountByNodeId.get(node.id) === 0);
+    if (roots.length !== 1) {
+        return _jsx(GraphFallbackList, { graph: graph });
+    }
+    const root = roots[0];
+    if (!root) {
+        return _jsx(GraphFallbackList, { graph: graph });
+    }
+    function renderNode(node, visited) {
+        const nextVisited = new Set(visited);
+        nextVisited.add(node.id);
+        const groupLabel = node.groupId ? groupLabelById.get(node.groupId) : undefined;
+        const children = (childIdsByNodeId.get(node.id) ?? [])
+            .filter((childId) => !nextVisited.has(childId))
+            .map((childId) => nodeById.get(childId))
+            .filter((child) => child !== undefined);
+        return (_jsxs("li", { children: [node.label, node.status ? ` (${node.status})` : "", _jsx(NodeFallbackDetails, { node: node, ...(groupLabel !== undefined ? { groupLabel } : {}) }), children.length > 0 ? _jsx("ul", { children: children.map((child) => renderNode(child, nextVisited)) }) : null] }, node.id));
+    }
+    return (_jsxs("div", { className: "zvk-graphs__fallback zvk-graphs__fallback-tree", children: [_jsx("h3", { children: "Tree" }), _jsx("ul", { children: renderNode(root, new Set()) })] }));
 }
 export function GraphFigure({ graph, selectedNodeIds, selectedEdgeIds, renderNode, fallbackMode = "list" }) {
     const id = useId();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zvk/graphs",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Accessible SVG-first node and edge graph utilities, deterministic layouts, and static React renderers for ZVK applications.",
   "private": false,
   "type": "module",
@@ -25,27 +25,38 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
     },
     "./model": {
       "types": "./dist/model.d.ts",
-      "import": "./dist/model.js"
+      "import": "./dist/model.js",
+      "default": "./dist/model.js"
     },
     "./diagnostics": {
       "types": "./dist/diagnostics.d.ts",
-      "import": "./dist/diagnostics.js"
+      "import": "./dist/diagnostics.js",
+      "default": "./dist/diagnostics.js"
     },
     "./algorithms": {
       "types": "./dist/algorithms.d.ts",
-      "import": "./dist/algorithms.js"
+      "import": "./dist/algorithms.js",
+      "default": "./dist/algorithms.js"
+    },
+    "./serialization": {
+      "types": "./dist/serialization.d.ts",
+      "import": "./dist/serialization.js",
+      "default": "./dist/serialization.js"
     },
     "./layout": {
       "types": "./dist/layout/index.d.ts",
-      "import": "./dist/layout/index.js"
+      "import": "./dist/layout/index.js",
+      "default": "./dist/layout/index.js"
     },
     "./svg": {
       "types": "./dist/svg.d.ts",
-      "import": "./dist/svg.js"
+      "import": "./dist/svg.js",
+      "default": "./dist/svg.js"
     },
     "./styles.css": "./dist/styles.css",
     "./package.json": "./package.json"
@@ -59,11 +70,15 @@
     "test": "vitest run",
     "test:ssr": "vitest run tests/ssr --environment node",
     "test:exports": "vitest run tests/exports --environment node",
+    "test:docs-examples": "bun run build && vitest run tests/docs-examples --environment node",
     "test:types": "tsd",
     "validate:exports": "bun run scripts/validate-exports.mjs",
+    "validate:source-policy": "bun run scripts/validate-source-policy.mjs",
+    "verify:style-contract": "bun run scripts/verify-style-contract.mjs",
     "tarball:inspect": "bun run scripts/check-tarball.mjs",
     "pack:dry": "bun pm pack --dry-run",
-    "preflight": "bun run build && bun run typecheck && bun run test && bun run test:ssr && bun run test:types && bun run test:exports && bun run validate:exports && bun run tarball:inspect && bun run pack:dry"
+    "preflight": "bun run build && bun run typecheck && bun run test && bun run test:ssr && bun run test:types && bun run test:exports && bun run validate:exports && bun run validate:source-policy && bun run verify:style-contract && bun run tarball:inspect && bun run pack:dry",
+    "preflight:ci": "bun run build && bun run typecheck && bun run test && bun run test:ssr && bun run test:types && bun run test:exports && bun run validate:exports && bun run validate:source-policy && bun run verify:style-contract && bun run tarball:inspect && bun run pack:dry"
   },
   "dependencies": {},
   "peerDependencies": {