@principal-ai/principal-view-react 0.14.14 → 0.14.16

package/dist/components/SequenceDiagramRenderer.d.ts

@@ -0,0 +1,61 @@
+/**
+ * Sequence Diagram Renderer
+ *
+ * Renders events in swimlane-based sequence diagram layout.
+ * Uses namespaces to determine swimlanes and event order for vertical positioning.
+ */
+import React from 'react';
+import { type NodeTypes, type EdgeTypes } from '@xyflow/react';
+import '@xyflow/react/dist/style.css';
+import { type SequenceEvent, type SequenceEdge, type UseSequenceLayoutOptions } from '../hooks/useSequenceLayout';
+/**
+ * Props for SequenceDiagramRenderer
+ */
+export interface SequenceDiagramRendererProps {
+    /** Events to display in the diagram */
+    events: SequenceEvent[];
+    /** Edges connecting events */
+    edges: SequenceEdge[];
+    /** Layout options */
+    layoutOptions?: UseSequenceLayoutOptions;
+    /** Optional custom node types */
+    nodeTypes?: NodeTypes;
+    /** Optional custom edge types */
+    edgeTypes?: EdgeTypes;
+    /** Callback when a namespace collapse state is toggled */
+    onToggleCollapse?: (namespace: string) => void;
+    /** Callback when a node is clicked */
+    onNodeClick?: (nodeId: string, event: React.MouseEvent) => void;
+    /** Optional class name */
+    className?: string;
+    /** Optional width */
+    width?: number | string;
+    /** Optional height */
+    height?: number | string;
+    /** Whether to show controls */
+    showControls?: boolean;
+    /** Whether to show background grid */
+    showBackground?: boolean;
+}
+/**
+ * Sequence Diagram Renderer
+ *
+ * Renders events as a sequence diagram with swimlanes based on namespaces.
+ *
+ * @example
+ * ```tsx
+ * <SequenceDiagramRenderer
+ *   events={[
+ *     { id: '1', name: 'auth.validation.started' },
+ *     { id: '2', name: 'auth.validation.completed' },
+ *     { id: '3', name: 'database.query.executed' },
+ *   ]}
+ *   edges={[
+ *     { id: 'e1', fromEvent: '1', toEvent: '2' },
+ *     { id: 'e2', fromEvent: '2', toEvent: '3' },
+ *   ]}
+ * />
+ * ```
+ */
+export declare function SequenceDiagramRenderer(props: SequenceDiagramRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SequenceDiagramRenderer.d.ts.map

package/dist/components/SequenceDiagramRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SequenceDiagramRenderer.d.ts","sourceRoot":"","sources":["../../src/components/SequenceDiagramRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAaL,KAAK,SAAS,EACd,KAAK,SAAS,EAGf,MAAM,eAAe,CAAC;AACvB,OAAO,8BAA8B,CAAC;AACtC,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,wBAAwB,EAE9B,MAAM,4BAA4B,CAAC;AAqOpC;;GAEG;AACH,MAAM,WAAW,4BAA4B;IAC3C,uCAAuC;IACvC,MAAM,EAAE,aAAa,EAAE,CAAC;IAExB,8BAA8B;IAC9B,KAAK,EAAE,YAAY,EAAE,CAAC;IAEtB,qBAAqB;IACrB,aAAa,CAAC,EAAE,wBAAwB,CAAC;IAEzC,iCAAiC;IACjC,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,iCAAiC;IACjC,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAE/C,sCAAsC;IACtC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAEhE,0BAA0B;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,qBAAqB;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAExB,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzB,+BAA+B;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,sCAAsC;IACtC,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAwHD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,4BAA4B,2CAiB1E"}

package/dist/components/SequenceDiagramRenderer.js

@@ -0,0 +1,184 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Sequence Diagram Renderer
+ *
+ * Renders events in swimlane-based sequence diagram layout.
+ * Uses namespaces to determine swimlanes and event order for vertical positioning.
+ */
+import { useCallback, useMemo } from 'react';
+import { ReactFlow, Background, BackgroundVariant, Controls, ReactFlowProvider, Panel, useViewport, Handle, Position, BaseEdge, EdgeLabelRenderer, getBezierPath, } from '@xyflow/react';
+import '@xyflow/react/dist/style.css';
+import { useSequenceLayout, } from '../hooks/useSequenceLayout';
+/**
+ * Minimal marker node for arrow-centric sequence diagrams
+ */
+function SequenceMarkerNode({ data }) {
+    return (_jsxs("div", { style: {
+            width: '100%',
+            height: '100%',
+            backgroundColor: 'var(--sequence-marker-bg, #6495ED)',
+            borderRadius: '50%',
+            border: '2px solid var(--sequence-marker-border, #4169E1)',
+            boxShadow: '0 1px 3px rgba(0,0,0,0.2)',
+        }, title: data.fullName, children: [_jsx(Handle, { type: "target", position: Position.Top, style: { visibility: 'hidden' } }), _jsx(Handle, { type: "source", position: Position.Bottom, style: { visibility: 'hidden' } })] }));
+}
+/**
+ * Sequence arrow edge with label
+ */
+function SequenceArrowEdge({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, label, data, }) {
+    // Use a straight line for same-lane, bezier for cross-lane
+    const isSameLane = !data?.crossesLanes;
+    const [edgePath, labelX, labelY] = getBezierPath({
+        sourceX,
+        sourceY,
+        sourcePosition,
+        targetX,
+        targetY,
+        targetPosition,
+        curvature: isSameLane ? 0.5 : 0.25,
+    });
+    return (_jsxs(_Fragment, { children: [_jsx(BaseEdge, { id: id, path: edgePath, style: {
+                    stroke: 'var(--sequence-arrow-color, #4169E1)',
+                    strokeWidth: 2,
+                }, markerEnd: "url(#sequence-arrow)" }), label && (_jsx(EdgeLabelRenderer, { children: _jsx("div", { style: {
+                        position: 'absolute',
+                        transform: `translate(-50%, -50%) translate(${labelX}px,${labelY}px)`,
+                        background: 'var(--sequence-label-bg, rgba(255, 255, 255, 0.95))',
+                        padding: '2px 8px',
+                        borderRadius: 4,
+                        fontSize: 12,
+                        fontWeight: 500,
+                        color: 'var(--sequence-label-text, #333)',
+                        border: '1px solid var(--sequence-label-border, #ddd)',
+                        pointerEvents: 'all',
+                        whiteSpace: 'nowrap',
+                    }, className: "nodrag nopan", children: label }) }))] }));
+}
+/**
+ * Default node types including sequence marker
+ */
+const defaultSequenceNodeTypes = {
+    sequenceMarker: SequenceMarkerNode,
+};
+/**
+ * Default edge types including sequence arrow
+ */
+const defaultSequenceEdgeTypes = {
+    sequenceArrow: SequenceArrowEdge,
+};
+/**
+ * Swimlane layer that renders behind nodes and transforms with viewport
+ */
+function SwimlaneLayer({ swimlanes, laneWidth, headerHeight, totalHeight, onToggleCollapse, }) {
+    const { x, y, zoom } = useViewport();
+    // Calculate the visible area height (use a large value to ensure lanes extend)
+    const extendedHeight = Math.max(totalHeight, 2000);
+    return (_jsxs("div", { style: {
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            transformOrigin: '0 0',
+            transform: `translate(${x}px, ${y}px) scale(${zoom})`,
+            pointerEvents: 'none',
+            zIndex: -1,
+        }, children: [swimlanes.map((lane, index) => {
+                const isEven = index % 2 === 0;
+                return (_jsx("div", { style: {
+                        position: 'absolute',
+                        left: lane.x - laneWidth / 2,
+                        top: 0,
+                        width: laneWidth,
+                        height: extendedHeight,
+                        backgroundColor: isEven
+                            ? 'var(--sequence-lane-even, rgba(100, 149, 237, 0.08))'
+                            : 'var(--sequence-lane-odd, rgba(100, 149, 237, 0.03))',
+                        borderRight: '1px solid var(--sequence-lane-border, rgba(100, 149, 237, 0.2))',
+                    } }, `bg-${lane.namespace}`));
+            }), swimlanes.map((lane) => {
+                const hasChildren = lane.children.length > 0;
+                return (_jsxs("div", { style: {
+                        position: 'absolute',
+                        left: lane.x - laneWidth / 2,
+                        top: 0,
+                        width: laneWidth,
+                        height: headerHeight,
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        backgroundColor: 'var(--sequence-header-bg, rgba(100, 149, 237, 0.15))',
+                        borderBottom: '2px solid var(--sequence-header-border, rgba(100, 149, 237, 0.4))',
+                        fontWeight: 600,
+                        fontSize: 13,
+                        color: 'var(--sequence-header-text, #333)',
+                        pointerEvents: 'auto',
+                        cursor: hasChildren ? 'pointer' : 'default',
+                        userSelect: 'none',
+                    }, onClick: () => hasChildren && onToggleCollapse?.(lane.namespace), children: [hasChildren && (_jsx("span", { style: { marginRight: 6, fontSize: 10 }, children: lane.isCollapsed ? '▶' : '▼' })), _jsx("span", { children: lane.label }), lane.eventIds.length > 1 && (_jsxs("span", { style: { marginLeft: 6, fontSize: 11, opacity: 0.6 }, children: ["(", lane.eventIds.length, ")"] }))] }, `header-${lane.namespace}`));
+            }), swimlanes.map((lane) => (_jsx("div", { style: {
+                    position: 'absolute',
+                    left: lane.x,
+                    top: headerHeight,
+                    width: 2,
+                    height: extendedHeight - headerHeight,
+                    backgroundColor: 'var(--sequence-lifeline, rgba(100, 149, 237, 0.3))',
+                    transform: 'translateX(-1px)',
+                } }, `lifeline-${lane.namespace}`)))] }));
+}
+/**
+ * Inner component that uses React Flow hooks
+ */
+function SequenceDiagramInner({ events, edges: sequenceEdges, layoutOptions = {}, nodeTypes: customNodeTypes, edgeTypes: customEdgeTypes, onToggleCollapse, onNodeClick, showControls = true, showBackground = false, // Default to false since swimlanes provide visual structure
+ }) {
+    // Extract layout params
+    const { laneWidth = 200, headerHeight = 60, arrowCentric = false } = layoutOptions;
+    // Merge custom node/edge types with sequence defaults
+    const nodeTypes = useMemo(() => ({ ...defaultSequenceNodeTypes, ...customNodeTypes }), [customNodeTypes]);
+    const edgeTypes = useMemo(() => ({ ...defaultSequenceEdgeTypes, ...customEdgeTypes }), [customEdgeTypes]);
+    // Compute layout (pass arrowCentric through layoutOptions)
+    const { nodes, edges, swimlanes, totalHeight } = useSequenceLayout(events, sequenceEdges, { ...layoutOptions, arrowCentric });
+    // Handle node click
+    const handleNodeClick = useCallback((_event, node) => {
+        onNodeClick?.(node.id, _event);
+    }, [onNodeClick]);
+    return (_jsxs(ReactFlow, { nodes: nodes, edges: edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, onNodeClick: handleNodeClick, fitView: true, fitViewOptions: {
+            padding: 0.2,
+            minZoom: 0.5,
+            maxZoom: 1.5,
+        }, minZoom: 0.1, maxZoom: 2, nodesDraggable: false, nodesConnectable: false, elementsSelectable: true, panOnScroll: true, zoomOnScroll: true, children: [_jsx("svg", { style: { position: 'absolute', width: 0, height: 0 }, children: _jsx("defs", { children: _jsx("marker", { id: "sequence-arrow", viewBox: "0 0 10 10", refX: "8", refY: "5", markerWidth: "6", markerHeight: "6", orient: "auto-start-reverse", children: _jsx("path", { d: "M 0 0 L 10 5 L 0 10 z", fill: "var(--sequence-arrow-color, #4169E1)" }) }) }) }), showBackground && (_jsx(Background, { variant: BackgroundVariant.Dots, gap: 16, size: 1 })), showControls && _jsx(Controls, {}), _jsx(SwimlaneLayer, { swimlanes: swimlanes, laneWidth: laneWidth, headerHeight: headerHeight, totalHeight: totalHeight, onToggleCollapse: onToggleCollapse }), swimlanes.some((s) => s.children.length > 0) && (_jsx(Panel, { position: "top-right", children: _jsx("div", { style: {
+                        background: 'var(--sequence-panel-bg, rgba(255, 255, 255, 0.95))',
+                        border: '1px solid var(--sequence-panel-border, #ddd)',
+                        borderRadius: 4,
+                        padding: '6px 10px',
+                        fontSize: 11,
+                        color: '#666',
+                    }, children: "Click lane headers to expand/collapse" }) }))] }));
+}
+/**
+ * Sequence Diagram Renderer
+ *
+ * Renders events as a sequence diagram with swimlanes based on namespaces.
+ *
+ * @example
+ * ```tsx
+ * <SequenceDiagramRenderer
+ *   events={[
+ *     { id: '1', name: 'auth.validation.started' },
+ *     { id: '2', name: 'auth.validation.completed' },
+ *     { id: '3', name: 'database.query.executed' },
+ *   ]}
+ *   edges={[
+ *     { id: 'e1', fromEvent: '1', toEvent: '2' },
+ *     { id: 'e2', fromEvent: '2', toEvent: '3' },
+ *   ]}
+ * />
+ * ```
+ */
+export function SequenceDiagramRenderer(props) {
+    const { className, width = '100%', height = 600 } = props;
+    return (_jsx("div", { className: className, style: {
+            width,
+            height,
+            position: 'relative',
+        }, children: _jsx(ReactFlowProvider, { children: _jsx(SequenceDiagramInner, { ...props }) }) }));
+}
+//# sourceMappingURL=SequenceDiagramRenderer.js.map

package/dist/components/SequenceDiagramRenderer.js.map

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

package/dist/components/dashboard/DashboardRenderer.d.ts

@@ -0,0 +1,9 @@
+/**
+ * DashboardRenderer
+ *
+ * Main component for rendering a dashboard from a DashboardDefinition.
+ * Takes a dashboard definition JSON and a data provider, renders all metrics.
+ */
+import type { DashboardRendererProps } from './types';
+export declare function DashboardRenderer({ dashboard, dataProvider, timeRange: controlledTimeRange, onTimeRangeChange, refreshInterval: controlledRefreshInterval, onRefreshIntervalChange, timeRangeConfig, onMetricClick, onSourceClick, }: DashboardRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DashboardRenderer.d.ts.map

package/dist/components/dashboard/DashboardRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/DashboardRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,sBAAsB,EAA4D,MAAM,SAAS,CAAC;AAkChH,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,YAAY,EACZ,SAAS,EAAE,mBAAmB,EAC9B,iBAAiB,EACjB,eAAe,EAAE,yBAAyB,EAC1C,uBAAuB,EACvB,eAAe,EACf,aAAa,EACb,aAAa,GACd,EAAE,sBAAsB,2CAuQxB"}

package/dist/components/dashboard/DashboardRenderer.js

@@ -0,0 +1,179 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * DashboardRenderer
+ *
+ * Main component for rendering a dashboard from a DashboardDefinition.
+ * Takes a dashboard definition JSON and a data provider, renders all metrics.
+ */
+import { useMemo, useState, useEffect } from 'react';
+import { useTheme } from '@principal-ade/industry-theme';
+import { MetricPanel } from './MetricPanel';
+import { MockDataProvider } from './MockDataProvider';
+import { TimeRangeSelector } from './components';
+function useBreakpoint(breakpoints) {
+    const mobileBreak = breakpoints?.mobile ?? 768;
+    const tabletBreak = breakpoints?.tablet ?? 1024;
+    const [breakpoint, setBreakpoint] = useState(() => {
+        if (typeof window === 'undefined')
+            return 'desktop';
+        const width = window.innerWidth;
+        if (width < mobileBreak)
+            return 'mobile';
+        if (width < tabletBreak)
+            return 'tablet';
+        return 'desktop';
+    });
+    useEffect(() => {
+        const handleResize = () => {
+            const width = window.innerWidth;
+            if (width < mobileBreak)
+                setBreakpoint('mobile');
+            else if (width < tabletBreak)
+                setBreakpoint('tablet');
+            else
+                setBreakpoint('desktop');
+        };
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, [mobileBreak, tabletBreak]);
+    return breakpoint;
+}
+export function DashboardRenderer({ dashboard, dataProvider, timeRange: controlledTimeRange, onTimeRangeChange, refreshInterval: controlledRefreshInterval, onRefreshIntervalChange, timeRangeConfig, onMetricClick, onSourceClick, }) {
+    const { theme } = useTheme();
+    const breakpoint = useBreakpoint(dashboard.layout.breakpoints);
+    // Internal state for uncontrolled time range
+    const [internalTimeRange, setInternalTimeRange] = useState({
+        preset: timeRangeConfig?.defaultRange ?? 'last_1h',
+    });
+    const [internalRefreshInterval, setInternalRefreshInterval] = useState(timeRangeConfig?.defaultRefresh ?? 'off');
+    // Use controlled or internal state
+    const timeRange = controlledTimeRange ?? internalTimeRange;
+    const refreshInterval = controlledRefreshInterval ?? internalRefreshInterval;
+    const handleTimeRangeChange = (range) => {
+        if (onTimeRangeChange) {
+            onTimeRangeChange(range);
+        }
+        else {
+            setInternalTimeRange(range);
+        }
+    };
+    const handleRefreshIntervalChange = (interval) => {
+        if (onRefreshIntervalChange) {
+            onRefreshIntervalChange(interval);
+        }
+        else {
+            setInternalRefreshInterval(interval);
+        }
+    };
+    // Grid configuration
+    const gridColumns = dashboard.layout.columns ?? 12;
+    const gridGap = dashboard.layout.gap ?? 16;
+    // Use provided data provider or create a mock one
+    const data = useMemo(() => {
+        const provider = dataProvider || new MockDataProvider(dashboard);
+        return provider.getAll();
+    }, [dashboard, dataProvider]);
+    // Build a map of metric ID → metric definition for quick lookup
+    const metricsMap = useMemo(() => {
+        const map = new Map();
+        for (const metric of dashboard.metrics) {
+            map.set(metric.id, metric);
+        }
+        return map;
+    }, [dashboard.metrics]);
+    const handleSourceClick = (source) => {
+        if (onSourceClick) {
+            onSourceClick(source);
+        }
+        else {
+            // Default behavior: log to console
+            console.log('Source clicked:', source);
+        }
+    };
+    // Get span for current breakpoint
+    const getSpan = (placement, totalPanels) => {
+        // Mobile defaults to full width
+        if (breakpoint === 'mobile') {
+            return placement.spanMobile ?? gridColumns;
+        }
+        // Tablet uses spanTablet or falls back to span
+        if (breakpoint === 'tablet') {
+            return placement.spanTablet ?? placement.span ?? Math.floor(gridColumns / Math.min(totalPanels, 2));
+        }
+        // Desktop uses spanDesktop or span or auto-calculate
+        return placement.spanDesktop ?? placement.span ?? Math.floor(gridColumns / Math.min(totalPanels, 3));
+    };
+    return (_jsxs("div", { style: {
+            backgroundColor: theme.colors.background,
+            color: theme.colors.text,
+            padding: theme.space?.[4] || 24,
+            minHeight: '100%',
+            fontFamily: theme.fonts.body,
+        }, children: [_jsxs("div", { style: { marginBottom: theme.space?.[4] || 24 }, children: [_jsxs("div", { style: {
+                            display: 'flex',
+                            justifyContent: 'space-between',
+                            alignItems: 'flex-start',
+                            gap: theme.space?.[3] || 16,
+                            flexWrap: 'wrap',
+                        }, children: [_jsx("h1", { style: {
+                                    fontSize: theme.fontSizes[4],
+                                    fontWeight: theme.fontWeights.semibold,
+                                    fontFamily: theme.fonts.heading,
+                                    margin: 0,
+                                    color: theme.colors.text,
+                                }, children: dashboard.name }), _jsx(TimeRangeSelector, { timeRange: timeRange, onTimeRangeChange: handleTimeRangeChange, refreshInterval: refreshInterval, onRefreshIntervalChange: handleRefreshIntervalChange, config: timeRangeConfig })] }), dashboard.description && (_jsx("p", { style: {
+                            fontSize: theme.fontSizes[1],
+                            color: theme.colors.textSecondary,
+                            margin: 0,
+                            marginTop: theme.space?.[2] || 8,
+                            marginBottom: theme.space?.[3] || 12,
+                            lineHeight: theme.lineHeights.body,
+                        }, children: dashboard.description })), dashboard.externalLinks && Object.keys(dashboard.externalLinks).length > 0 && (_jsx("div", { style: { display: 'flex', gap: theme.space?.[3] || 12 }, children: Object.entries(dashboard.externalLinks).map(([name, url]) => (url && (_jsxs("a", { href: url, target: "_blank", rel: "noopener noreferrer", style: {
+                                fontSize: theme.fontSizes[0],
+                                color: theme.colors.primary || theme.colors.accent,
+                                textDecoration: 'none',
+                                display: 'flex',
+                                alignItems: 'center',
+                                gap: 4,
+                            }, children: [_jsxs("svg", { width: 12, height: 12, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [_jsx("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }), _jsx("polyline", { points: "15 3 21 3 21 9" }), _jsx("line", { x1: "10", y1: "14", x2: "21", y2: "3" })] }), name] }, name)))) }))] }), _jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: theme.space?.[4] || 24 }, children: dashboard.layout.rows.map((row, rowIndex) => (_jsxs("div", { children: [row.title && (_jsx("h2", { style: {
+                                fontSize: theme.fontSizes[2],
+                                fontWeight: theme.fontWeights.medium,
+                                fontFamily: theme.fonts.heading,
+                                margin: 0,
+                                marginBottom: theme.space?.[3] || 12,
+                                color: theme.colors.text,
+                                paddingBottom: theme.space?.[2] || 8,
+                                borderBottom: `1px solid ${theme.colors.border}`,
+                            }, children: row.title })), _jsx("div", { style: {
+                                display: 'grid',
+                                gridTemplateColumns: `repeat(${gridColumns}, 1fr)`,
+                                gap: gridGap,
+                            }, children: row.panels.map((panel) => {
+                                const span = getSpan(panel, row.panels.length);
+                                const metric = metricsMap.get(panel.id);
+                                const panelStyle = {
+                                    gridColumn: `span ${span}`,
+                                    minHeight: panel.minHeight,
+                                    height: panel.height === 'auto' ? 'auto' : panel.height,
+                                };
+                                if (!metric) {
+                                    return (_jsxs("div", { style: {
+                                            ...panelStyle,
+                                            backgroundColor: theme.colors.surface || theme.colors.background,
+                                            border: `1px solid ${theme.colors.error}`,
+                                            borderRadius: theme.radii?.[2] || 8,
+                                            padding: theme.space?.[3] || 16,
+                                            color: theme.colors.error,
+                                            fontSize: theme.fontSizes[1],
+                                        }, children: ["Metric not found: ", panel.id] }, panel.id));
+                                }
+                                return (_jsx("div", { style: panelStyle, children: _jsx(MetricPanel, { metric: metric, data: data[panel.id] || { error: 'No data' }, onMetricClick: onMetricClick, onSourceClick: handleSourceClick }) }, panel.id));
+                            }) })] }, rowIndex))) }), dashboard.owner && (_jsxs("div", { style: {
+                    marginTop: theme.space?.[5] || 32,
+                    paddingTop: theme.space?.[3] || 16,
+                    borderTop: `1px solid ${theme.colors.border}`,
+                    fontSize: theme.fontSizes[0],
+                    color: theme.colors.textSecondary,
+                }, children: ["Owner: ", dashboard.owner] }))] }));
+}
+//# sourceMappingURL=DashboardRenderer.js.map

package/dist/components/dashboard/DashboardRenderer.js.map

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

package/dist/components/dashboard/MetricPanel.d.ts

@@ -0,0 +1,9 @@
+/**
+ * MetricPanel
+ *
+ * Wrapper component that determines which visualization to render
+ * based on the metric definition and data.
+ */
+import type { MetricPanelProps } from './types';
+export declare function MetricPanel({ metric, data, onMetricClick, onSourceClick, }: MetricPanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MetricPanel.d.ts.map

package/dist/components/dashboard/MetricPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetricPanel.d.ts","sourceRoot":"","sources":["../../../src/components/dashboard/MetricPanel.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EACV,gBAAgB,EAIjB,MAAM,SAAS,CAAC;AAGjB,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,IAAI,EACJ,aAAa,EACb,aAAa,GACd,EAAE,gBAAgB,2CAwFlB"}

package/dist/components/dashboard/MetricPanel.js

@@ -0,0 +1,103 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTheme } from '@principal-ade/industry-theme';
+import { MetricCard, LineChart, BarChart, SourceLink } from './components';
+export function MetricPanel({ metric, data, onMetricClick, onSourceClick, }) {
+    const { theme } = useTheme();
+    // Determine which component to use
+    const componentType = getComponentType(metric, data);
+    // Render loading state
+    if (data.loading) {
+        return (_jsx("div", { style: {
+                backgroundColor: theme.colors.surface || theme.colors.background,
+                border: `1px solid ${theme.colors.border}`,
+                borderRadius: theme.radii?.[2] || 8,
+                padding: theme.space?.[3] || 16,
+                minHeight: 100,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                fontFamily: theme.fonts.body,
+            }, children: _jsx("span", { style: { color: theme.colors.textSecondary, fontSize: theme.fontSizes[1] }, children: "Loading..." }) }));
+    }
+    // Render error state
+    if (data.error) {
+        return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: [_jsxs("div", { style: {
+                        backgroundColor: theme.colors.surface || theme.colors.background,
+                        border: `1px solid ${theme.colors.error}`,
+                        borderRadius: theme.radii?.[2] || 8,
+                        padding: theme.space?.[3] || 16,
+                        fontFamily: theme.fonts.body,
+                    }, children: [_jsx("div", { style: {
+                                color: theme.colors.error,
+                                marginBottom: theme.space?.[2] || 8,
+                                fontSize: theme.fontSizes[1],
+                                fontWeight: theme.fontWeights.medium,
+                            }, children: metric.name }), _jsx("div", { style: { color: theme.colors.textSecondary, fontSize: theme.fontSizes[0] }, children: data.error })] }), metric.sources && metric.sources.length > 0 && onSourceClick && (_jsx("div", { style: { display: 'flex', gap: 8, flexWrap: 'wrap' }, children: metric.sources.map((source, i) => (_jsx(SourceLink, { source: source, onClick: onSourceClick }, i))) }))] }));
+    }
+    const handleClick = () => {
+        onMetricClick?.(metric.id);
+    };
+    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: [renderComponent(componentType, metric, data, handleClick), metric.sources && metric.sources.length > 0 && onSourceClick && (_jsx("div", { style: { display: 'flex', gap: 8, flexWrap: 'wrap' }, children: metric.sources.map((source, i) => (_jsx(SourceLink, { source: source, onClick: onSourceClick }, i))) }))] }));
+}
+/**
+ * Determine which component to render based on metric definition and data
+ */
+function getComponentType(metric, data) {
+    // Explicit display hint takes precedence
+    if (metric.display?.component) {
+        return metric.display.component;
+    }
+    const { type, query } = metric;
+    // Time series data → chart
+    if (data.series && data.series.length > 0) {
+        if (query.groupBy && query.groupBy.length > 0) {
+            return 'StackedBarChart';
+        }
+        return 'LineChart';
+    }
+    // Histogram data
+    if (data.histogram) {
+        return 'Histogram';
+    }
+    // Counter with time grouping → line/bar chart (but no series data yet)
+    if (type === 'counter' && query.timeGroup) {
+        return query.groupBy?.length ? 'BarChart' : 'LineChart';
+    }
+    // Gauge (percentage) → gauge or metric card
+    if (type === 'gauge') {
+        return metric.thresholds ? 'GaugeChart' : 'MetricCard';
+    }
+    // Default to metric card
+    return 'MetricCard';
+}
+/**
+ * Render the appropriate component
+ */
+function renderComponent(componentType, metric, data, onClick) {
+    switch (componentType) {
+        case 'MetricCard':
+        case 'GaugeChart': // Use MetricCard for now, can add GaugeChart later
+            return (_jsx(MetricCard, { title: metric.name, value: data.current ?? 0, unit: metric.unit, description: metric.description, trend: data.trend, changePercent: data.changePercent, showTrend: metric.display?.showTrend ?? true, showSparkline: metric.display?.showSparkline, sparklineData: data.series, thresholds: metric.thresholds, size: metric.display?.size || 'medium', onClick: onClick }));
+        case 'LineChart':
+            return (_jsx(LineChart, { title: metric.name, data: data.series || [], xKey: "date", yKey: "value", unit: metric.unit, onClick: onClick }));
+        case 'BarChart':
+        case 'StackedBarChart':
+            // Extract series keys from data
+            const series = data.series && data.series.length > 0
+                ? Object.keys(data.series[0]).filter(k => k !== 'date')
+                : metric.query.groupBy || [];
+            return (_jsx(BarChart, { title: metric.name, data: data.series || [], xKey: "date", series: series, stacked: componentType === 'StackedBarChart', unit: metric.unit, onClick: onClick }));
+        case 'Histogram':
+            // TODO: Implement Histogram component
+            return (_jsx(MetricCard, { title: metric.name, value: "Histogram (TODO)", description: metric.description, onClick: onClick }));
+        case 'PieChart':
+            // TODO: Implement PieChart component
+            return (_jsx(MetricCard, { title: metric.name, value: "PieChart (TODO)", description: metric.description, onClick: onClick }));
+        case 'DataTable':
+            // TODO: Implement DataTable component
+            return (_jsx(MetricCard, { title: metric.name, value: "DataTable (TODO)", description: metric.description, onClick: onClick }));
+        default:
+            return (_jsx(MetricCard, { title: metric.name, value: data.current ?? 0, unit: metric.unit, onClick: onClick }));
+    }
+}
+//# sourceMappingURL=MetricPanel.js.map

package/dist/components/dashboard/MetricPanel.js.map

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

package/dist/components/dashboard/MockDataProvider.d.ts

@@ -0,0 +1,30 @@
+/**
+ * MockDataProvider
+ *
+ * Provides mock data for dashboard metrics during prototyping.
+ * Can use inline _mockData from the dashboard definition or generate realistic data.
+ */
+import type { DashboardDefinition, MetricData, DataProvider } from './types';
+export declare class MockDataProvider implements DataProvider {
+    private data;
+    constructor(dashboard: DashboardDefinition);
+    get(metricId: string): MetricData;
+    getAll(): Record<string, MetricData>;
+    private resolveData;
+    private transformMockData;
+    private generateData;
+    private generateTimeSeries;
+    private generateGaugeData;
+    private generateCounterData;
+    private generateHistogramData;
+    private getPointCount;
+    private getBaseValue;
+    private generateDates;
+    private getWeekNumber;
+    private getGroupValues;
+}
+/**
+ * Create a mock data provider from a dashboard definition
+ */
+export declare function createMockDataProvider(dashboard: DashboardDefinition): DataProvider;
+//# sourceMappingURL=MockDataProvider.d.ts.map