semiotic 3.0.0-beta.2 → 3.0.0-beta.4

package/ai/dist/src/components/stream/StreamXYFrame.js

@@ -1,590 +0,0 @@
-"use client";
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const d3_brush_1 = require("d3-brush");
-const d3_selection_1 = require("d3-selection");
-const DataSourceAdapter_1 = require("./DataSourceAdapter");
-const PipelineStore_1 = require("./PipelineStore");
-const CanvasHitTester_1 = require("./CanvasHitTester");
-const SVGOverlay_1 = require("./SVGOverlay");
-// Canvas renderers
-const lineCanvasRenderer_1 = require("./renderers/lineCanvasRenderer");
-const areaCanvasRenderer_1 = require("./renderers/areaCanvasRenderer");
-const pointCanvasRenderer_1 = require("./renderers/pointCanvasRenderer");
-const barCanvasRenderer_1 = require("./renderers/barCanvasRenderer");
-const swarmCanvasRenderer_1 = require("./renderers/swarmCanvasRenderer");
-const waterfallCanvasRenderer_1 = require("./renderers/waterfallCanvasRenderer");
-const heatmapCanvasRenderer_1 = require("./renderers/heatmapCanvasRenderer");
-const candlestickCanvasRenderer_1 = require("./renderers/candlestickCanvasRenderer");
-// ── Renderer dispatch ──────────────────────────────────────────────────
-const RENDERERS = {
-    line: [areaCanvasRenderer_1.areaCanvasRenderer, lineCanvasRenderer_1.lineCanvasRenderer],
-    area: [areaCanvasRenderer_1.areaCanvasRenderer],
-    stackedarea: [areaCanvasRenderer_1.areaCanvasRenderer],
-    scatter: [pointCanvasRenderer_1.pointCanvasRenderer],
-    bubble: [pointCanvasRenderer_1.pointCanvasRenderer],
-    heatmap: [heatmapCanvasRenderer_1.heatmapCanvasRenderer],
-    bar: [barCanvasRenderer_1.barCanvasRenderer],
-    swarm: [swarmCanvasRenderer_1.swarmCanvasRenderer],
-    waterfall: [waterfallCanvasRenderer_1.waterfallCanvasRenderer],
-    candlestick: [candlestickCanvasRenderer_1.candlestickCanvasRenderer]
-};
-// ── Defaults ───────────────────────────────────────────────────────────
-const DEFAULT_MARGIN = { top: 20, right: 20, bottom: 30, left: 40 };
-const LIGHT_THEME = {
-    axisStroke: "#ccc",
-    tickText: "#666",
-    crosshair: "rgba(0, 0, 0, 0.25)",
-    hoverFill: "rgba(255, 255, 255, 0.3)",
-    hoverStroke: "rgba(0, 0, 0, 0.4)",
-    pointRing: "white"
-};
-function resolveThemeColors(el) {
-    if (!el)
-        return LIGHT_THEME;
-    const style = getComputedStyle(el);
-    const textSecondary = style.getPropertyValue("--text-secondary").trim();
-    const textPrimary = style.getPropertyValue("--text-primary").trim();
-    const surface3 = style.getPropertyValue("--surface-3").trim();
-    const surface0 = style.getPropertyValue("--surface-0").trim();
-    if (!textSecondary && !textPrimary)
-        return LIGHT_THEME;
-    return {
-        axisStroke: surface3 || LIGHT_THEME.axisStroke,
-        tickText: textSecondary || LIGHT_THEME.tickText,
-        crosshair: textSecondary ? `${textSecondary}66` : LIGHT_THEME.crosshair,
-        hoverFill: surface0 ? `${surface0}4D` : LIGHT_THEME.hoverFill,
-        hoverStroke: textSecondary ? `${textSecondary}99` : LIGHT_THEME.hoverStroke,
-        pointRing: surface0 || LIGHT_THEME.pointRing
-    };
-}
-// ── Tooltip ────────────────────────────────────────────────────────────
-const defaultTooltipStyle = {
-    background: "rgba(0, 0, 0, 0.85)",
-    color: "white",
-    padding: "6px 10px",
-    borderRadius: 4,
-    fontSize: 12,
-    lineHeight: 1.5,
-    boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
-    pointerEvents: "none",
-    whiteSpace: "nowrap"
-};
-function DefaultTooltip({ hover }) {
-    const fmtValue = (v) => Number.isInteger(v) ? String(v) : v.toFixed(2);
-    return (React.createElement("div", { className: "semiotic-tooltip", style: defaultTooltipStyle },
-        React.createElement("div", { style: { fontWeight: 600, marginBottom: 2 } }, fmtValue(hover.value)),
-        React.createElement("div", { style: { opacity: 0.7, fontSize: 11 } }, fmtValue(hover.time))));
-}
-// ── Crosshair drawing ──────────────────────────────────────────────────
-function drawCrosshair(ctx, hover, width, height, config, pointColor, theme) {
-    const showCrosshair = config.crosshair !== false;
-    if (!showCrosshair)
-        return;
-    ctx.save();
-    const crossStyle = typeof config.crosshair === "object" ? config.crosshair : {};
-    ctx.strokeStyle = crossStyle.stroke || theme.crosshair;
-    ctx.lineWidth = crossStyle.strokeWidth || 1;
-    if (crossStyle.strokeDasharray) {
-        ctx.setLineDash(crossStyle.strokeDasharray.split(/[\s,]+/).map(Number));
-    }
-    else {
-        ctx.setLineDash([4, 4]);
-    }
-    ctx.beginPath();
-    ctx.moveTo(hover.x, 0);
-    ctx.lineTo(hover.x, height);
-    ctx.stroke();
-    ctx.beginPath();
-    ctx.moveTo(0, hover.y);
-    ctx.lineTo(width, hover.y);
-    ctx.stroke();
-    ctx.restore();
-    // Point indicator
-    ctx.beginPath();
-    ctx.arc(hover.x, hover.y, 4, 0, Math.PI * 2);
-    ctx.fillStyle = pointColor;
-    ctx.fill();
-    ctx.strokeStyle = theme.pointRing;
-    ctx.lineWidth = 2;
-    ctx.stroke();
-}
-function BrushOverlay({ width, height, totalWidth, totalHeight, margin, dimension, scales, onBrush }) {
-    const svgRef = (0, react_1.useRef)(null);
-    const brushRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        if (!svgRef.current)
-            return;
-        const g = (0, d3_selection_1.select)(svgRef.current).select(".brush-g");
-        const brushFn = dimension === "x"
-            ? (0, d3_brush_1.brushX)()
-            : dimension === "y"
-                ? (0, d3_brush_1.brushY)()
-                : (0, d3_brush_1.brush)();
-        brushFn.extent([[0, 0], [width, height]]);
-        brushFn.on("brush end", (event) => {
-            if (!scales)
-                return;
-            if (!event.selection) {
-                onBrush(null);
-                return;
-            }
-            let xRange;
-            let yRange;
-            if (dimension === "x") {
-                const [px0, px1] = event.selection;
-                xRange = [scales.x.invert(px0), scales.x.invert(px1)];
-                yRange = [scales.y.invert(height), scales.y.invert(0)];
-            }
-            else if (dimension === "y") {
-                const [py0, py1] = event.selection;
-                xRange = [scales.x.invert(0), scales.x.invert(width)];
-                yRange = [scales.y.invert(py1), scales.y.invert(py0)];
-            }
-            else {
-                const [[px0, py0], [px1, py1]] = event.selection;
-                xRange = [scales.x.invert(px0), scales.x.invert(px1)];
-                yRange = [scales.y.invert(py1), scales.y.invert(py0)];
-            }
-            onBrush({ x: xRange, y: yRange });
-        });
-        g.call(brushFn);
-        brushRef.current = brushFn;
-        // Style the brush selection rectangle
-        g.select(".selection")
-            .attr("fill", "steelblue")
-            .attr("fill-opacity", 0.15)
-            .attr("stroke", "steelblue")
-            .attr("stroke-width", 1);
-        return () => {
-            brushFn.on("brush end", null);
-            brushRef.current = null;
-        };
-    }, [width, height, dimension, scales, onBrush]);
-    return (React.createElement("svg", { ref: svgRef, width: totalWidth, height: totalHeight, style: {
-            position: "absolute",
-            top: 0,
-            left: 0,
-            // Allow pointer events only on the brush overlay itself
-            pointerEvents: "all"
-        } },
-        React.createElement("g", { className: "brush-g", transform: `translate(${margin.left},${margin.top})` })));
-}
-// ── StreamXYFrame ──────────────────────────────────────────────────────
-const StreamXYFrame = (0, react_1.forwardRef)(function StreamXYFrame(props, ref) {
-    const { chartType, runtimeMode, data, xAccessor, yAccessor, colorAccessor, sizeAccessor, groupAccessor, lineDataAccessor, curve, normalize, binSize, valueAccessor, arrowOfTime = "right", windowMode = "sliding", windowSize = 200, timeAccessor, xExtent, yExtent, extentPadding = 0.1, sizeRange, size = [500, 300], margin: marginProp, className, background, lineStyle, pointStyle, areaStyle, barStyle, waterfallStyle, swarmStyle, barColors, colorScheme, boundsAccessor, boundsStyle, openAccessor, highAccessor, lowAccessor, closeAccessor, candlestickStyle, showAxes = true, xLabel, yLabel, xFormat, yFormat, tickFormatTime, tickFormatValue, hoverAnnotation, tooltipContent, customHoverBehavior, enableHover, annotations, svgAnnotationRules, showGrid, legend, backgroundGraphics, foregroundGraphics, title, categoryAccessor, brush, onBrush, decay, pulse, transition, staleness, heatmapAggregation, heatmapXBins, heatmapYBins, marginalGraphics } = props;
-    const margin = { ...DEFAULT_MARGIN, ...marginProp };
-    // Auto-expand margins to at least 60px when marginals are configured
-    if (marginalGraphics) {
-        const MIN_MARGINAL = 60;
-        if (marginalGraphics.top && margin.top < MIN_MARGINAL)
-            margin.top = MIN_MARGINAL;
-        if (marginalGraphics.bottom && margin.bottom < MIN_MARGINAL)
-            margin.bottom = MIN_MARGINAL;
-        if (marginalGraphics.left && margin.left < MIN_MARGINAL)
-            margin.left = MIN_MARGINAL;
-        if (marginalGraphics.right && margin.right < MIN_MARGINAL)
-            margin.right = MIN_MARGINAL;
-    }
-    const adjustedWidth = size[0] - margin.left - margin.right;
-    const adjustedHeight = size[1] - margin.top - margin.bottom;
-    // Determine effective hover annotation config
-    const effectiveHoverAnnotation = hoverAnnotation ?? enableHover;
-    // ── Refs ─────────────────────────────────────────────────────────────
-    const canvasRef = (0, react_1.useRef)(null);
-    const rafRef = (0, react_1.useRef)(0);
-    const dirtyRef = (0, react_1.useRef)(false);
-    const [annotationFrame, setAnnotationFrame] = (0, react_1.useState)(0);
-    // Scales state: updated after each scene computation so SVGOverlay re-renders
-    const [currentScales, setCurrentScales] = (0, react_1.useState)(null);
-    // Hover state: ref for canvas (sync), React state for tooltip (async)
-    const hoverRef = (0, react_1.useRef)(null);
-    const [hoverPoint, setHoverPoint] = (0, react_1.useState)(null);
-    // Staleness state
-    const [isStale, setIsStale] = (0, react_1.useState)(false);
-    // Marginal data values
-    const [marginalXValues, setMarginalXValues] = (0, react_1.useState)([]);
-    const [marginalYValues, setMarginalYValues] = (0, react_1.useState)([]);
-    // Render function ref (always-fresh closure)
-    const renderFnRef = (0, react_1.useRef)(() => { });
-    // ── Pipeline ─────────────────────────────────────────────────────────
-    const isStreaming = runtimeMode === "streaming" || ["bar", "swarm", "waterfall"].includes(chartType);
-    const pipelineConfig = (0, react_1.useMemo)(() => ({
-        chartType,
-        runtimeMode: isStreaming ? "streaming" : "bounded",
-        windowSize,
-        windowMode,
-        arrowOfTime: isStreaming ? arrowOfTime : "right",
-        extentPadding,
-        xAccessor: isStreaming ? undefined : xAccessor,
-        yAccessor: isStreaming ? undefined : yAccessor,
-        timeAccessor: isStreaming ? timeAccessor : undefined,
-        valueAccessor,
-        colorAccessor,
-        sizeAccessor,
-        groupAccessor,
-        categoryAccessor,
-        lineDataAccessor,
-        xExtent,
-        yExtent,
-        sizeRange,
-        binSize,
-        normalize,
-        boundsAccessor,
-        boundsStyle,
-        openAccessor,
-        highAccessor,
-        lowAccessor,
-        closeAccessor,
-        candlestickStyle,
-        lineStyle,
-        pointStyle,
-        areaStyle,
-        swarmStyle,
-        colorScheme,
-        barColors,
-        annotations,
-        decay,
-        pulse,
-        transition,
-        staleness,
-        heatmapAggregation,
-        heatmapXBins,
-        heatmapYBins
-    }), [
-        chartType, windowSize, windowMode, arrowOfTime, extentPadding,
-        xAccessor, yAccessor, timeAccessor, valueAccessor,
-        colorAccessor, sizeAccessor, groupAccessor, categoryAccessor,
-        lineDataAccessor, xExtent, yExtent, sizeRange, binSize, normalize,
-        boundsAccessor, boundsStyle,
-        openAccessor, highAccessor, lowAccessor, closeAccessor, candlestickStyle,
-        lineStyle, pointStyle, areaStyle, swarmStyle, colorScheme, barColors, annotations,
-        decay, pulse, transition, staleness,
-        heatmapAggregation, heatmapXBins, heatmapYBins,
-        isStreaming
-    ]);
-    const storeRef = (0, react_1.useRef)(null);
-    if (!storeRef.current) {
-        storeRef.current = new PipelineStore_1.PipelineStore(pipelineConfig);
-    }
-    // ── Stable scheduleRender ────────────────────────────────────────────
-    const scheduleRender = (0, react_1.useCallback)(() => {
-        if (rafRef.current)
-            return;
-        rafRef.current = requestAnimationFrame(() => renderFnRef.current());
-    }, []);
-    // Update config when it changes — also schedule re-render since style
-    // callbacks (pointStyle, areaStyle, etc.) may have changed.
-    (0, react_1.useEffect)(() => {
-        storeRef.current?.updateConfig(pipelineConfig);
-        dirtyRef.current = true;
-        scheduleRender();
-    }, [pipelineConfig, scheduleRender]);
-    // ── DataSourceAdapter ────────────────────────────────────────────────
-    const adapterRef = (0, react_1.useRef)(null);
-    if (!adapterRef.current) {
-        adapterRef.current = new DataSourceAdapter_1.DataSourceAdapter((changeset) => {
-            const store = storeRef.current;
-            if (!store)
-                return;
-            const needsRender = store.ingest(changeset);
-            if (needsRender) {
-                dirtyRef.current = true;
-                scheduleRender();
-            }
-        });
-    }
-    // ── Push API (ref handle) ────────────────────────────────────────────
-    const pushPoint = (0, react_1.useCallback)((datum) => {
-        adapterRef.current?.push(datum);
-    }, []);
-    const pushManyPoints = (0, react_1.useCallback)((data) => {
-        adapterRef.current?.pushMany(data);
-    }, []);
-    const clearAll = (0, react_1.useCallback)(() => {
-        adapterRef.current?.clear();
-        storeRef.current?.clear();
-        dirtyRef.current = true;
-        scheduleRender();
-    }, [scheduleRender]);
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        push: pushPoint,
-        pushMany: pushManyPoints,
-        clear: clearAll,
-        getData: () => storeRef.current?.getData() ?? [],
-        getScales: () => storeRef.current?.scales ?? null,
-        getExtents: () => storeRef.current?.getExtents() ?? null
-    }), [pushPoint, pushManyPoints, clearAll]);
-    // ── Controlled data prop ─────────────────────────────────────────────
-    (0, react_1.useEffect)(() => {
-        if (!data)
-            return;
-        adapterRef.current?.setBoundedData(data);
-    }, [data]);
-    // ── Hover handlers ───────────────────────────────────────────────────
-    const hoverHandlerRef = (0, react_1.useRef)(() => { });
-    const hoverLeaveRef = (0, react_1.useRef)(() => { });
-    hoverHandlerRef.current = (e) => {
-        if (!effectiveHoverAnnotation)
-            return;
-        const canvas = canvasRef.current;
-        if (!canvas)
-            return;
-        const rect = canvas.getBoundingClientRect();
-        const chartX = e.clientX - rect.left - margin.left;
-        const chartY = e.clientY - rect.top - margin.top;
-        if (chartX < 0 || chartX > adjustedWidth || chartY < 0 || chartY > adjustedHeight) {
-            if (hoverRef.current) {
-                hoverRef.current = null;
-                setHoverPoint(null);
-                if (customHoverBehavior)
-                    customHoverBehavior(null);
-                scheduleRender();
-            }
-            return;
-        }
-        const store = storeRef.current;
-        if (!store || store.scene.length === 0)
-            return;
-        // Hit test against scene graph
-        const hit = (0, CanvasHitTester_1.findNearestNode)(store.scene, chartX, chartY);
-        if (!hit) {
-            if (hoverRef.current) {
-                hoverRef.current = null;
-                setHoverPoint(null);
-                if (customHoverBehavior)
-                    customHoverBehavior(null);
-                scheduleRender();
-            }
-            return;
-        }
-        const hover = {
-            data: hit.datum,
-            time: hit.x,
-            value: hit.y,
-            x: hit.x,
-            y: hit.y
-        };
-        hoverRef.current = hover;
-        setHoverPoint(hover);
-        if (customHoverBehavior)
-            customHoverBehavior(hover);
-        scheduleRender();
-    };
-    hoverLeaveRef.current = () => {
-        if (hoverRef.current) {
-            hoverRef.current = null;
-            setHoverPoint(null);
-            if (customHoverBehavior)
-                customHoverBehavior(null);
-            scheduleRender();
-        }
-    };
-    const onMouseMove = (0, react_1.useCallback)((e) => hoverHandlerRef.current(e), []);
-    const onMouseLeave = (0, react_1.useCallback)(() => hoverLeaveRef.current(), []);
-    // ── Render function ──────────────────────────────────────────────────
-    renderFnRef.current = () => {
-        rafRef.current = 0;
-        const canvas = canvasRef.current;
-        if (!canvas)
-            return;
-        const ctx = canvas.getContext("2d");
-        if (!ctx)
-            return;
-        const store = storeRef.current;
-        if (!store)
-            return;
-        const now = typeof performance !== "undefined" ? performance.now() : Date.now();
-        // Advance transition animation (before scene rebuild)
-        const isTransitioning = store.advanceTransition(now);
-        // Compute scene graph (scales + scene nodes) — skip if mid-transition
-        if (!isTransitioning) {
-            store.computeScene({ width: adjustedWidth, height: adjustedHeight });
-        }
-        // DPR setup
-        const dpr = typeof window !== "undefined" ? window.devicePixelRatio || 1 : 1;
-        canvas.width = size[0] * dpr;
-        canvas.height = size[1] * dpr;
-        canvas.style.width = `${size[0]}px`;
-        canvas.style.height = `${size[1]}px`;
-        ctx.scale(dpr, dpr);
-        ctx.translate(margin.left, margin.top);
-        ctx.clearRect(-margin.left, -margin.top, size[0], size[1]);
-        const theme = resolveThemeColors(canvas);
-        // Staleness dimming
-        const staleThreshold = staleness?.threshold ?? 5000;
-        const currentlyStale = staleness && store.lastIngestTime > 0 &&
-            (now - store.lastIngestTime) > staleThreshold;
-        if (currentlyStale) {
-            ctx.globalAlpha = staleness?.dimOpacity ?? 0.5;
-        }
-        // Background
-        if (background) {
-            ctx.fillStyle = background;
-            ctx.fillRect(0, 0, adjustedWidth, adjustedHeight);
-        }
-        // Render data marks via canvas renderers
-        const renderers = RENDERERS[chartType];
-        if (renderers && store.scales) {
-            for (const renderer of renderers) {
-                renderer(ctx, store.scene, store.scales, { width: adjustedWidth, height: adjustedHeight });
-            }
-        }
-        // Reset alpha after staleness dimming
-        if (currentlyStale) {
-            ctx.globalAlpha = 1;
-        }
-        // Draw crosshair on hover
-        if (effectiveHoverAnnotation && hoverRef.current && store.scales) {
-            const config = typeof effectiveHoverAnnotation === "object" ? effectiveHoverAnnotation : {};
-            drawCrosshair(ctx, hoverRef.current, adjustedWidth, adjustedHeight, config, "#007bff", theme);
-        }
-        const wasDirty = dirtyRef.current;
-        dirtyRef.current = false;
-        // Push scales into React state so SVGOverlay renders axes/grid
-        if (wasDirty && store.scales) {
-            setCurrentScales(store.scales);
-            // Extract x/y values for marginal graphics
-            if (marginalGraphics) {
-                const rawData = store.getData();
-                const getX = typeof xAccessor === "function"
-                    ? xAccessor
-                    : (d) => d[xAccessor || "x"];
-                const getY = typeof yAccessor === "function"
-                    ? yAccessor
-                    : (d) => d[yAccessor || "y"];
-                setMarginalXValues(rawData.map(d => getX(d)).filter((v) => typeof v === "number" && isFinite(v)));
-                setMarginalYValues(rawData.map(d => getY(d)).filter((v) => typeof v === "number" && isFinite(v)));
-            }
-        }
-        // Trigger React re-render for SVG annotations
-        if (wasDirty && annotations && annotations.length > 0 && svgAnnotationRules) {
-            setAnnotationFrame(f => f + 1);
-        }
-        // Update staleness React state for badge
-        if (staleness?.showBadge) {
-            setIsStale(!!currentlyStale);
-        }
-        // Schedule next frame for continuous rendering (pulse/transitions)
-        if (isTransitioning || store.hasActivePulses) {
-            rafRef.current = requestAnimationFrame(() => renderFnRef.current());
-        }
-    };
-    // ── Lifecycle ────────────────────────────────────────────────────────
-    (0, react_1.useEffect)(() => {
-        scheduleRender();
-        return () => {
-            if (rafRef.current)
-                cancelAnimationFrame(rafRef.current);
-        };
-    }, [scheduleRender]);
-    // Re-render when visual props change
-    (0, react_1.useEffect)(() => {
-        dirtyRef.current = true;
-        scheduleRender();
-    }, [chartType, adjustedWidth, adjustedHeight, showAxes, background, lineStyle, scheduleRender]);
-    // Staleness check timer
-    (0, react_1.useEffect)(() => {
-        if (!staleness)
-            return;
-        const interval = setInterval(() => {
-            const store = storeRef.current;
-            if (!store || store.lastIngestTime === 0)
-                return;
-            const now = typeof performance !== "undefined" ? performance.now() : Date.now();
-            const threshold = staleness.threshold ?? 5000;
-            const stale = (now - store.lastIngestTime) > threshold;
-            if (stale !== isStale) {
-                setIsStale(stale);
-                dirtyRef.current = true;
-                scheduleRender();
-            }
-        }, 1000);
-        return () => clearInterval(interval);
-    }, [staleness, isStale, scheduleRender]);
-    // ── Tooltip positioning ──────────────────────────────────────────────
-    const tooltipRendered = effectiveHoverAnnotation && hoverPoint
-        ? (tooltipContent ? tooltipContent(hoverPoint) : React.createElement(DefaultTooltip, { hover: hoverPoint }))
-        : null;
-    const tooltipElement = tooltipRendered ? (React.createElement("div", { className: "stream-frame-tooltip", style: {
-            position: "absolute",
-            left: margin.left + hoverPoint.x,
-            top: margin.top + hoverPoint.y,
-            transform: `translate(${hoverPoint.x > adjustedWidth * 0.7 ? "calc(-100% - 12px)" : "12px"}, ${hoverPoint.y < adjustedHeight * 0.3 ? "4px" : "calc(-100% - 4px)"})`,
-            pointerEvents: "none",
-            zIndex: 1
-        } }, tooltipRendered)) : null;
-    // ── Render ───────────────────────────────────────────────────────────
-    return (React.createElement("div", { className: `stream-xy-frame${className ? ` ${className}` : ""}`, style: {
-            position: "relative",
-            width: size[0],
-            height: size[1]
-        }, onMouseMove: effectiveHoverAnnotation ? onMouseMove : undefined, onMouseLeave: effectiveHoverAnnotation ? onMouseLeave : undefined },
-        backgroundGraphics && (React.createElement("svg", { style: {
-                position: "absolute",
-                left: 0,
-                top: 0,
-                width: size[0],
-                height: size[1],
-                pointerEvents: "none"
-            } }, backgroundGraphics)),
-        React.createElement("canvas", { ref: canvasRef, style: {
-                position: "absolute",
-                left: 0,
-                top: 0
-            } }),
-        React.createElement(SVGOverlay_1.SVGOverlay, { width: adjustedWidth, height: adjustedHeight, totalWidth: size[0], totalHeight: size[1], margin: margin, scales: currentScales, showAxes: showAxes, xLabel: xLabel, yLabel: yLabel, xFormat: xFormat || tickFormatTime, yFormat: yFormat || tickFormatValue, showGrid: showGrid, title: title, legend: legend, foregroundGraphics: foregroundGraphics, marginalGraphics: marginalGraphics, xValues: marginalXValues, yValues: marginalYValues, annotations: annotations, svgAnnotationRules: svgAnnotationRules, annotationFrame: annotationFrame }),
-        (brush || onBrush) && (React.createElement(BrushOverlay, { width: adjustedWidth, height: adjustedHeight, totalWidth: size[0], totalHeight: size[1], margin: margin, dimension: brush?.dimension ?? "xy", scales: currentScales, onBrush: onBrush ?? (() => { }) })),
-        staleness?.showBadge && (React.createElement("div", { className: "stream-staleness-badge", style: {
-                position: "absolute",
-                ...(staleness.badgePosition === "top-left" ? { top: 4, left: 4 } :
-                    staleness.badgePosition === "bottom-left" ? { bottom: 4, left: 4 } :
-                        staleness.badgePosition === "bottom-right" ? { bottom: 4, right: 4 } :
-                            { top: 4, right: 4 }),
-                padding: "2px 8px",
-                borderRadius: 4,
-                fontSize: 11,
-                fontWeight: 600,
-                pointerEvents: "none",
-                background: isStale ? "#dc3545" : "#28a745",
-                color: "white"
-            } }, isStale ? "STALE" : "LIVE")),
-        tooltipElement));
-});
-StreamXYFrame.displayName = "StreamXYFrame";
-exports.default = StreamXYFrame;

package/ai/dist/src/components/stream/accessorUtils.js

@@ -1,20 +0,0 @@
-"use strict";
-// ── Accessor resolution ────────────────────────────────────────────────
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.resolveAccessor = resolveAccessor;
-exports.resolveStringAccessor = resolveStringAccessor;
-function resolveAccessor(accessor, fallback) {
-    if (typeof accessor === "function")
-        return (d) => +accessor(d);
-    const key = accessor || fallback;
-    return (d) => +d[key];
-}
-function resolveStringAccessor(accessor, fallback) {
-    if (typeof accessor === "function")
-        return accessor;
-    if (accessor)
-        return (d) => String(d[accessor]);
-    if (fallback)
-        return (d) => String(d[fallback]);
-    return undefined;
-}

package/ai/dist/src/components/stream/index.js

@@ -1,32 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.heatmapCanvasRenderer = exports.waterfallCanvasRenderer = exports.swarmCanvasRenderer = exports.barCanvasRenderer = exports.pointCanvasRenderer = exports.areaCanvasRenderer = exports.lineCanvasRenderer = exports.findNearestIndex = exports.findNearestNode = exports.PipelineStore = exports.DataSourceAdapter = exports.SVGOverlay = exports.StreamXYFrame = void 0;
-var StreamXYFrame_1 = require("./StreamXYFrame");
-Object.defineProperty(exports, "StreamXYFrame", { enumerable: true, get: function () { return __importDefault(StreamXYFrame_1).default; } });
-var SVGOverlay_1 = require("./SVGOverlay");
-Object.defineProperty(exports, "SVGOverlay", { enumerable: true, get: function () { return SVGOverlay_1.SVGOverlay; } });
-var DataSourceAdapter_1 = require("./DataSourceAdapter");
-Object.defineProperty(exports, "DataSourceAdapter", { enumerable: true, get: function () { return DataSourceAdapter_1.DataSourceAdapter; } });
-var PipelineStore_1 = require("./PipelineStore");
-Object.defineProperty(exports, "PipelineStore", { enumerable: true, get: function () { return PipelineStore_1.PipelineStore; } });
-var CanvasHitTester_1 = require("./CanvasHitTester");
-Object.defineProperty(exports, "findNearestNode", { enumerable: true, get: function () { return CanvasHitTester_1.findNearestNode; } });
-Object.defineProperty(exports, "findNearestIndex", { enumerable: true, get: function () { return CanvasHitTester_1.findNearestIndex; } });
-// Renderers
-var lineCanvasRenderer_1 = require("./renderers/lineCanvasRenderer");
-Object.defineProperty(exports, "lineCanvasRenderer", { enumerable: true, get: function () { return lineCanvasRenderer_1.lineCanvasRenderer; } });
-var areaCanvasRenderer_1 = require("./renderers/areaCanvasRenderer");
-Object.defineProperty(exports, "areaCanvasRenderer", { enumerable: true, get: function () { return areaCanvasRenderer_1.areaCanvasRenderer; } });
-var pointCanvasRenderer_1 = require("./renderers/pointCanvasRenderer");
-Object.defineProperty(exports, "pointCanvasRenderer", { enumerable: true, get: function () { return pointCanvasRenderer_1.pointCanvasRenderer; } });
-var barCanvasRenderer_1 = require("./renderers/barCanvasRenderer");
-Object.defineProperty(exports, "barCanvasRenderer", { enumerable: true, get: function () { return barCanvasRenderer_1.barCanvasRenderer; } });
-var swarmCanvasRenderer_1 = require("./renderers/swarmCanvasRenderer");
-Object.defineProperty(exports, "swarmCanvasRenderer", { enumerable: true, get: function () { return swarmCanvasRenderer_1.swarmCanvasRenderer; } });
-var waterfallCanvasRenderer_1 = require("./renderers/waterfallCanvasRenderer");
-Object.defineProperty(exports, "waterfallCanvasRenderer", { enumerable: true, get: function () { return waterfallCanvasRenderer_1.waterfallCanvasRenderer; } });
-var heatmapCanvasRenderer_1 = require("./renderers/heatmapCanvasRenderer");
-Object.defineProperty(exports, "heatmapCanvasRenderer", { enumerable: true, get: function () { return heatmapCanvasRenderer_1.heatmapCanvasRenderer; } });