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

package/ai/dist/src/components/charts/network/ChordDiagram.js

@@ -1,142 +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;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChordDiagram = ChordDiagram;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamNetworkFrame_1 = __importDefault(require("../../stream/StreamNetworkFrame"));
-const colorUtils_1 = require("../shared/colorUtils");
-const Tooltip_1 = require("../../Tooltip/Tooltip");
-const hooks_1 = require("../shared/hooks");
-const ChartError_1 = __importDefault(require("../shared/ChartError"));
-const validateChartData_1 = require("../shared/validateChartData");
-/**
- * ChordDiagram - Visualize directed relationships with circular chord layout
- *
- * Wraps StreamNetworkFrame (canvas-first) for chord relationship visualization.
- */
-function ChordDiagram(props) {
-    const { nodes, edges, width = 600, height = 600, margin = { top: 50, bottom: 50, left: 50, right: 50 }, className, title, sourceAccessor = "source", targetAccessor = "target", valueAccessor = "value", nodeIdAccessor = "id", colorBy, colorScheme = "category10", edgeColorBy = "source", padAngle = 0.01, groupWidth = 20, sortGroups, nodeLabel, showLabels = true, enableHover = true, edgeOpacity = 0.5, tooltip, frameProps = {} } = props;
-    const safeEdges = edges || [];
-    // Infer nodes from edges if not provided
-    const inferredNodes = (0, react_1.useMemo)(() => {
-        if (nodes && nodes.length > 0)
-            return nodes;
-        const nodeSet = new Set();
-        safeEdges.forEach((edge) => {
-            const sourceId = typeof sourceAccessor === "function" ? sourceAccessor(edge) : edge[sourceAccessor];
-            const targetId = typeof targetAccessor === "function" ? targetAccessor(edge) : edge[targetAccessor];
-            nodeSet.add(sourceId);
-            nodeSet.add(targetId);
-        });
-        return Array.from(nodeSet).map((id) => ({ id }));
-    }, [nodes, safeEdges, sourceAccessor, targetAccessor]);
-    const colorScale = (0, hooks_1.useColorScale)(inferredNodes, colorBy, colorScheme);
-    // Node style function — d is a RealtimeNode, user data on d.data
-    const nodeStyle = (0, react_1.useMemo)(() => {
-        return (d, i) => {
-            const baseStyle = {
-                stroke: "black",
-                strokeWidth: 1
-            };
-            if (colorBy) {
-                baseStyle.fill = (0, colorUtils_1.getColor)(d.data || d, colorBy, colorScale);
-            }
-            else {
-                const palette = Array.isArray(colorScheme) ? colorScheme : (colorUtils_1.COLOR_SCHEMES[colorScheme] || colorUtils_1.DEFAULT_COLORS);
-                const colors = Array.isArray(palette) ? palette : colorUtils_1.DEFAULT_COLORS;
-                const index = d.index ?? i ?? 0;
-                baseStyle.fill = colors[index % colors.length];
-            }
-            return baseStyle;
-        };
-    }, [colorBy, colorScale, colorScheme]);
-    // Edge style function — d is a RealtimeEdge
-    const edgeStyle = (0, react_1.useMemo)(() => {
-        return (d) => {
-            const baseStyle = {
-                stroke: "black",
-                strokeWidth: 0.5,
-                fillOpacity: edgeOpacity,
-                strokeOpacity: edgeOpacity
-            };
-            if (typeof edgeColorBy === "function") {
-                baseStyle.fill = edgeColorBy(d);
-            }
-            else if (edgeColorBy === "source") {
-                const src = typeof d.source === "object" ? d.source : null;
-                if (colorBy && src) {
-                    baseStyle.fill = (0, colorUtils_1.getColor)(src.data || src, colorBy, colorScale);
-                }
-                else if (src) {
-                    baseStyle.fill = nodeStyle(src, src.index).fill;
-                }
-            }
-            else if (edgeColorBy === "target") {
-                const tgt = typeof d.target === "object" ? d.target : null;
-                if (colorBy && tgt) {
-                    baseStyle.fill = (0, colorUtils_1.getColor)(tgt.data || tgt, colorBy, colorScale);
-                }
-                else if (tgt) {
-                    baseStyle.fill = nodeStyle(tgt, tgt.index).fill;
-                }
-            }
-            return baseStyle;
-        };
-    }, [edgeColorBy, colorBy, colorScale, nodeStyle, edgeOpacity]);
-    // Node label accessor
-    const nodeLabelFn = (0, react_1.useMemo)(() => {
-        if (!showLabels)
-            return undefined;
-        const accessor = nodeLabel || nodeIdAccessor;
-        if (typeof accessor === "function")
-            return accessor;
-        return (d) => d[accessor];
-    }, [showLabels, nodeLabel, nodeIdAccessor]);
-    // Validate
-    const error = (0, validateChartData_1.validateNetworkData)({
-        componentName: "ChordDiagram",
-        edges,
-        edgesRequired: true,
-    });
-    if (error)
-        return React.createElement(ChartError_1.default, { componentName: "ChordDiagram", message: error, width: width, height: height });
-    return (React.createElement(StreamNetworkFrame_1.default, { chartType: "chord", nodes: inferredNodes, edges: safeEdges, size: [width, height], margin: margin, nodeIDAccessor: nodeIdAccessor, sourceAccessor: sourceAccessor, targetAccessor: targetAccessor, valueAccessor: valueAccessor, padAngle: padAngle, groupWidth: groupWidth, sortGroups: sortGroups, nodeStyle: nodeStyle, edgeStyle: edgeStyle, colorBy: colorBy, colorScheme: colorScheme, edgeColorBy: edgeColorBy, edgeOpacity: edgeOpacity, nodeLabel: nodeLabelFn, showLabels: showLabels, enableHover: enableHover, tooltipContent: tooltip ? (d) => (0, Tooltip_1.normalizeTooltip)(tooltip)(d.data) : undefined, className: className, title: title, ...frameProps }));
-}
-ChordDiagram.displayName = "ChordDiagram";

package/ai/dist/src/components/charts/network/CirclePack.js

@@ -1,108 +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;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CirclePack = CirclePack;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamNetworkFrame_1 = __importDefault(require("../../stream/StreamNetworkFrame"));
-const colorUtils_1 = require("../shared/colorUtils");
-const Tooltip_1 = require("../../Tooltip/Tooltip");
-const hooks_1 = require("../shared/hooks");
-const ChartError_1 = __importDefault(require("../shared/ChartError"));
-const validateChartData_1 = require("../shared/validateChartData");
-/**
- * CirclePack - Visualize hierarchical data as nested circles.
- *
- * Wraps StreamNetworkFrame (canvas-first) for circle-pack visualization.
- */
-function CirclePack(props) {
-    const { data, width = 600, height = 600, margin = { top: 10, bottom: 10, left: 10, right: 10 }, className, title, childrenAccessor = "children", valueAccessor = "value", nodeIdAccessor = "name", colorBy, colorScheme = "category10", colorByDepth = false, showLabels = true, nodeLabel, circleOpacity = 0.7, padding: paddingProp = 4, enableHover = true, tooltip, frameProps = {} } = props;
-    const allNodes = (0, react_1.useMemo)(() => {
-        if (!data)
-            return [];
-        const nodes = [];
-        const traverse = (node) => {
-            nodes.push(node);
-            const children = typeof childrenAccessor === "function" ? childrenAccessor(node) : node[childrenAccessor];
-            if (children && Array.isArray(children))
-                children.forEach(traverse);
-        };
-        traverse(data);
-        return nodes;
-    }, [data, childrenAccessor]);
-    const colorScale = (0, react_1.useMemo)(() => {
-        if (colorByDepth)
-            return undefined;
-        if (!colorBy || typeof colorBy === "function")
-            return undefined;
-        return (0, colorUtils_1.createColorScale)(allNodes, colorBy, colorScheme);
-    }, [allNodes, colorBy, colorByDepth, colorScheme]);
-    const nodeStyleFn = (0, react_1.useMemo)(() => {
-        const DEPTH_PASTELS = ["#f0f0f0", "#b5d4ea", "#f4c2a1", "#b8dab2", "#d4b5e0", "#f9e0a2", "#a8d8d8"];
-        return (d) => {
-            const baseStyle = {
-                stroke: "currentColor",
-                strokeWidth: 1,
-                strokeOpacity: 0.3,
-                fillOpacity: circleOpacity
-            };
-            if (colorByDepth) {
-                baseStyle.fill = DEPTH_PASTELS[(d.depth || 0) % DEPTH_PASTELS.length];
-            }
-            else if (colorBy) {
-                baseStyle.fill = (0, colorUtils_1.getColor)(d.data || d, colorBy, colorScale);
-            }
-            else {
-                baseStyle.fill = hooks_1.DEFAULT_COLOR;
-            }
-            return baseStyle;
-        };
-    }, [colorBy, colorByDepth, colorScale, circleOpacity]);
-    const hierarchySumFn = (0, react_1.useMemo)(() => {
-        if (typeof valueAccessor === "function")
-            return valueAccessor;
-        return (d) => d[valueAccessor] || 1;
-    }, [valueAccessor]);
-    // Validate
-    const error = (0, validateChartData_1.validateObjectData)({ componentName: "CirclePack", data });
-    if (error)
-        return React.createElement(ChartError_1.default, { componentName: "CirclePack", message: error, width: width, height: height });
-    return (React.createElement(StreamNetworkFrame_1.default, { chartType: "circlepack", data: data, size: [width, height], margin: margin, nodeIDAccessor: nodeIdAccessor, childrenAccessor: childrenAccessor, hierarchySum: hierarchySumFn, padding: paddingProp, nodeStyle: nodeStyleFn, colorBy: colorBy, colorScheme: colorScheme, colorByDepth: colorByDepth, nodeLabel: showLabels ? (nodeLabel || nodeIdAccessor) : undefined, showLabels: showLabels, enableHover: enableHover, tooltipContent: tooltip ? (d) => (0, Tooltip_1.normalizeTooltip)(tooltip)(d.data) : undefined, className: className, title: title, ...frameProps }));
-}
-CirclePack.displayName = "CirclePack";

package/ai/dist/src/components/charts/network/ForceDirectedGraph.js

@@ -1,121 +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;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ForceDirectedGraph = ForceDirectedGraph;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamNetworkFrame_1 = __importDefault(require("../../stream/StreamNetworkFrame"));
-const colorUtils_1 = require("../shared/colorUtils");
-const legendUtils_1 = require("../shared/legendUtils");
-const Tooltip_1 = require("../../Tooltip/Tooltip");
-const hooks_1 = require("../shared/hooks");
-const ChartError_1 = __importDefault(require("../shared/ChartError"));
-const validateChartData_1 = require("../shared/validateChartData");
-/**
- * ForceDirectedGraph - Visualize network relationships with force-directed layout
- *
- * Wraps StreamNetworkFrame (canvas-first) for force-directed network visualization.
- */
-function ForceDirectedGraph(props) {
-    const { nodes, edges, width = 600, height = 600, margin: userMargin, className, title, nodeIDAccessor = "id", sourceAccessor = "source", targetAccessor = "target", nodeLabel, colorBy, colorScheme = "category10", nodeSize = 8, nodeSizeRange = [5, 20], edgeWidth = 1, edgeColor = "#999", edgeOpacity = 0.6, iterations = 300, forceStrength = 0.1, showLabels = false, enableHover = true, showLegend, tooltip, frameProps = {} } = props;
-    const safeNodes = nodes || [];
-    const safeEdges = edges || [];
-    const colorScale = (0, hooks_1.useColorScale)(safeNodes, colorBy, colorScheme);
-    // Node style function — d is a RealtimeNode, user data on d.data
-    const nodeStyle = (0, react_1.useMemo)(() => {
-        return (d) => {
-            const baseStyle = {};
-            if (colorBy) {
-                baseStyle.fill = (0, colorUtils_1.getColor)(d.data || d, colorBy, colorScale);
-            }
-            else {
-                baseStyle.fill = hooks_1.DEFAULT_COLOR;
-            }
-            if (typeof nodeSize === "number") {
-                baseStyle.r = nodeSize;
-            }
-            return baseStyle;
-        };
-    }, [colorBy, colorScale, nodeSize]);
-    // Edge style function
-    const edgeStyle = (0, react_1.useMemo)(() => {
-        return (d) => ({
-            stroke: edgeColor,
-            strokeWidth: typeof edgeWidth === "number" ? edgeWidth : typeof edgeWidth === "function" ? edgeWidth(d) : d[edgeWidth] || 1,
-            opacity: edgeOpacity
-        });
-    }, [edgeWidth, edgeColor, edgeOpacity]);
-    // Node label function
-    const nodeLabelFn = (0, react_1.useMemo)(() => {
-        if (!showLabels || !nodeLabel)
-            return undefined;
-        if (typeof nodeLabel === "function")
-            return nodeLabel;
-        return (d) => d[nodeLabel];
-    }, [showLabels, nodeLabel]);
-    // Legend
-    const shouldShowLegend = showLegend !== undefined ? showLegend : !!colorBy;
-    const legend = (0, react_1.useMemo)(() => {
-        if (!shouldShowLegend || !colorBy)
-            return undefined;
-        return (0, legendUtils_1.createLegend)({ data: safeNodes, colorBy, colorScale, getColor: colorUtils_1.getColor });
-    }, [shouldShowLegend, colorBy, safeNodes, colorScale]);
-    // Adjust margin for legend
-    const margin = (0, react_1.useMemo)(() => {
-        const defaultMargin = { top: 20, bottom: 20, left: 20, right: 20 };
-        const finalMargin = { ...defaultMargin, ...userMargin };
-        if (legend && finalMargin.right < 120) {
-            finalMargin.right = 120;
-        }
-        return finalMargin;
-    }, [userMargin, legend]);
-    // Validate
-    const error = (0, validateChartData_1.validateNetworkData)({
-        componentName: "ForceDirectedGraph",
-        nodes,
-        edges,
-        nodesRequired: true,
-        edgesRequired: true,
-        accessors: { nodeIDAccessor },
-    });
-    if (error)
-        return React.createElement(ChartError_1.default, { componentName: "ForceDirectedGraph", message: error, width: width, height: height });
-    return (React.createElement(StreamNetworkFrame_1.default, { chartType: "force", nodes: safeNodes, edges: safeEdges, size: [width, height], margin: margin, nodeIDAccessor: nodeIDAccessor, sourceAccessor: sourceAccessor, targetAccessor: targetAccessor, iterations: iterations, forceStrength: forceStrength, nodeStyle: nodeStyle, edgeStyle: edgeStyle, colorBy: colorBy, colorScheme: colorScheme, nodeSize: nodeSize, nodeSizeRange: nodeSizeRange, nodeLabel: nodeLabelFn, showLabels: showLabels, enableHover: enableHover, tooltipContent: tooltip ? (d) => (0, Tooltip_1.normalizeTooltip)(tooltip)(d.data) : undefined, legend: legend, className: className, title: title, ...frameProps }));
-}
-ForceDirectedGraph.displayName = "ForceDirectedGraph";

package/ai/dist/src/components/charts/network/SankeyDiagram.js

@@ -1,155 +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;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SankeyDiagram = SankeyDiagram;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamNetworkFrame_1 = __importDefault(require("../../stream/StreamNetworkFrame"));
-const colorUtils_1 = require("../shared/colorUtils");
-const hooks_1 = require("../shared/hooks");
-const ChartError_1 = __importDefault(require("../shared/ChartError"));
-const validateChartData_1 = require("../shared/validateChartData");
-/**
- * SankeyDiagram - Visualize flow and magnitude of movement between nodes
- *
- * Wraps StreamNetworkFrame (canvas-first) for Sankey flow visualization.
- */
-function SankeyDiagram(props) {
-    const { nodes, edges, width = 800, height = 600, margin = { top: 50, bottom: 50, left: 50, right: 50 }, className, title, sourceAccessor = "source", targetAccessor = "target", valueAccessor = "value", nodeIdAccessor = "id", colorBy, colorScheme = "category10", edgeColorBy = "source", orientation = "horizontal", nodeAlign = "justify", nodePaddingRatio = 0.05, nodeWidth = 15, nodeLabel, showLabels = true, enableHover = true, edgeOpacity = 0.5, edgeSort, tooltip, frameProps = {} } = props;
-    // Safe data defaults (hooks must always run)
-    const safeEdges = edges || [];
-    // Infer nodes from edges if not provided
-    const inferredNodes = (0, react_1.useMemo)(() => {
-        if (nodes && nodes.length > 0)
-            return nodes;
-        const nodeSet = new Set();
-        safeEdges.forEach((edge) => {
-            const sourceId = typeof sourceAccessor === "function"
-                ? sourceAccessor(edge)
-                : edge[sourceAccessor];
-            const targetId = typeof targetAccessor === "function"
-                ? targetAccessor(edge)
-                : edge[targetAccessor];
-            nodeSet.add(sourceId);
-            nodeSet.add(targetId);
-        });
-        return Array.from(nodeSet).map((id) => ({ id }));
-    }, [nodes, safeEdges, sourceAccessor, targetAccessor]);
-    // Create color scale if colorBy is specified
-    const colorScale = (0, hooks_1.useColorScale)(inferredNodes, colorBy, colorScheme);
-    // Node style function
-    // d is a RealtimeNode — user data lives on d.data
-    const nodeStyle = (0, react_1.useMemo)(() => {
-        return (d) => {
-            const baseStyle = {
-                stroke: "black",
-                strokeWidth: 1
-            };
-            if (colorBy) {
-                baseStyle.fill = (0, colorUtils_1.getColor)(d.data || d, colorBy, colorScale);
-            }
-            else {
-                baseStyle.fill = "#4d430c";
-            }
-            return baseStyle;
-        };
-    }, [colorBy, colorScale]);
-    // Edge style function
-    // d is a RealtimeEdge — d.source/d.target are RealtimeNode objects
-    const edgeStyle = (0, react_1.useMemo)(() => {
-        return (d) => {
-            const baseStyle = {
-                stroke: "none",
-                strokeWidth: 0,
-                fillOpacity: edgeOpacity
-            };
-            if (typeof edgeColorBy === "function") {
-                baseStyle.fill = edgeColorBy(d);
-            }
-            else if (edgeColorBy === "source") {
-                const src = typeof d.source === "object" ? d.source : null;
-                if (colorBy && src) {
-                    baseStyle.fill = (0, colorUtils_1.getColor)(src.data || src, colorBy, colorScale);
-                }
-                else if (src) {
-                    baseStyle.fill = nodeStyle(src).fill;
-                }
-            }
-            else if (edgeColorBy === "target") {
-                const tgt = typeof d.target === "object" ? d.target : null;
-                if (colorBy && tgt) {
-                    baseStyle.fill = (0, colorUtils_1.getColor)(tgt.data || tgt, colorBy, colorScale);
-                }
-                else if (tgt) {
-                    baseStyle.fill = nodeStyle(tgt).fill;
-                }
-            }
-            else if (edgeColorBy === "gradient") {
-                baseStyle.fill = "#999";
-                baseStyle.fillOpacity = edgeOpacity * 0.7;
-            }
-            return baseStyle;
-        };
-    }, [edgeColorBy, colorBy, colorScale, nodeStyle, edgeOpacity]);
-    // Node label accessor
-    const nodeLabelFn = (0, react_1.useMemo)(() => {
-        if (!showLabels)
-            return undefined;
-        const accessor = nodeLabel || nodeIdAccessor;
-        if (typeof accessor === "function")
-            return accessor;
-        return (d) => d[accessor];
-    }, [showLabels, nodeLabel, nodeIdAccessor]);
-    // Tooltip
-    const tooltipFn = (0, react_1.useMemo)(() => {
-        if (typeof tooltip === "function")
-            return tooltip;
-        return undefined;
-    }, [tooltip]);
-    // Validate data (after all hooks)
-    const error = (0, validateChartData_1.validateNetworkData)({
-        componentName: "SankeyDiagram",
-        edges,
-        edgesRequired: true,
-    });
-    if (error)
-        return React.createElement(ChartError_1.default, { componentName: "SankeyDiagram", message: error, width: width, height: height });
-    return (React.createElement(StreamNetworkFrame_1.default, { chartType: "sankey", nodes: inferredNodes, edges: safeEdges, size: [width, height], margin: margin, nodeIDAccessor: nodeIdAccessor, sourceAccessor: sourceAccessor, targetAccessor: targetAccessor, valueAccessor: valueAccessor, orientation: orientation, nodeAlign: nodeAlign, nodePaddingRatio: nodePaddingRatio, nodeWidth: nodeWidth, nodeStyle: nodeStyle, edgeStyle: edgeStyle, colorBy: colorBy, colorScheme: colorScheme, edgeColorBy: edgeColorBy, edgeOpacity: edgeOpacity, edgeSort: edgeSort, nodeLabel: nodeLabelFn, showLabels: showLabels, enableHover: enableHover, tooltipContent: tooltipFn ? (d) => tooltipFn(d.data) : undefined, className: className, title: title, ...frameProps }));
-}
-SankeyDiagram.displayName = "SankeyDiagram";

package/ai/dist/src/components/charts/network/TreeDiagram.js

@@ -1,110 +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;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TreeDiagram = TreeDiagram;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamNetworkFrame_1 = __importDefault(require("../../stream/StreamNetworkFrame"));
-const colorUtils_1 = require("../shared/colorUtils");
-const Tooltip_1 = require("../../Tooltip/Tooltip");
-const hooks_1 = require("../shared/hooks");
-const ChartError_1 = __importDefault(require("../shared/ChartError"));
-const validateChartData_1 = require("../shared/validateChartData");
-/**
- * TreeDiagram - Visualize hierarchical data structures
- *
- * Wraps StreamNetworkFrame (canvas-first) for hierarchical tree visualization.
- */
-function TreeDiagram(props) {
-    const { data, width = 600, height = 600, margin = { top: 50, bottom: 50, left: 50, right: 50 }, className, title, layout = "tree", orientation = "vertical", childrenAccessor = "children", valueAccessor = "value", nodeIdAccessor = "name", colorBy, colorScheme = "category10", colorByDepth = false, edgeStyle = "curve", nodeLabel, showLabels = true, nodeSize = 5, enableHover = true, tooltip, frameProps = {} } = props;
-    // Node style function
-    const allNodes = (0, react_1.useMemo)(() => {
-        if (!data)
-            return [];
-        const nodes = [];
-        const traverse = (node) => {
-            nodes.push(node);
-            const children = typeof childrenAccessor === "function" ? childrenAccessor(node) : node[childrenAccessor];
-            if (children && Array.isArray(children))
-                children.forEach(traverse);
-        };
-        traverse(data);
-        return nodes;
-    }, [data, childrenAccessor]);
-    const colorScale = (0, react_1.useMemo)(() => {
-        if (colorByDepth)
-            return (0, colorUtils_1.createColorScale)(allNodes.map((_, idx) => ({ depth: idx % 5 })), "depth", colorScheme);
-        if (!colorBy || typeof colorBy === "function")
-            return undefined;
-        return (0, colorUtils_1.createColorScale)(allNodes, colorBy, colorScheme);
-    }, [allNodes, colorBy, colorByDepth, colorScheme]);
-    // d is a RealtimeNode — user data on d.data, depth on d.depth
-    const nodeStyleFn = (0, react_1.useMemo)(() => {
-        return (d) => {
-            const baseStyle = { stroke: "black", strokeWidth: 1 };
-            if (colorByDepth) {
-                baseStyle.fill = (0, colorUtils_1.getColor)({ depth: d.depth || 0 }, "depth", colorScale);
-            }
-            else if (colorBy) {
-                baseStyle.fill = (0, colorUtils_1.getColor)(d.data || d, colorBy, colorScale);
-            }
-            else {
-                baseStyle.fill = hooks_1.DEFAULT_COLOR;
-            }
-            return baseStyle;
-        };
-    }, [colorBy, colorByDepth, colorScale]);
-    const edgeStyleFn = (0, react_1.useMemo)(() => {
-        return () => ({ stroke: "#999", strokeWidth: 1, fill: "none" });
-    }, []);
-    const hierarchySumFn = (0, react_1.useMemo)(() => {
-        if (layout === "treemap" || layout === "circlepack" || layout === "partition") {
-            if (typeof valueAccessor === "function")
-                return valueAccessor;
-            return (d) => d[valueAccessor] || 1;
-        }
-        return undefined;
-    }, [layout, valueAccessor]);
-    // Validate
-    const error = (0, validateChartData_1.validateObjectData)({ componentName: "TreeDiagram", data });
-    if (error)
-        return React.createElement(ChartError_1.default, { componentName: "TreeDiagram", message: error, width: width, height: height });
-    return (React.createElement(StreamNetworkFrame_1.default, { chartType: layout, data: data, size: [width, height], margin: margin, nodeIDAccessor: nodeIdAccessor, childrenAccessor: childrenAccessor, hierarchySum: hierarchySumFn, treeOrientation: orientation, edgeType: edgeStyle, nodeStyle: nodeStyleFn, edgeStyle: edgeStyleFn, colorBy: colorBy, colorScheme: colorScheme, colorByDepth: colorByDepth, nodeSize: nodeSize, nodeLabel: showLabels ? (nodeLabel || nodeIdAccessor) : undefined, showLabels: showLabels, enableHover: enableHover, tooltipContent: tooltip ? (d) => (0, Tooltip_1.normalizeTooltip)(tooltip)(d.data) : undefined, className: className, title: title, ...frameProps }));
-}
-TreeDiagram.displayName = "TreeDiagram";