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

package/ai/dist/src/components/charts/realtime/RealtimeSwarmChart.js

@@ -1,105 +0,0 @@
-"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.RealtimeSwarmChart = void 0;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamXYFrame_1 = __importDefault(require("../../stream/StreamXYFrame"));
-const selectionUtils_1 = require("../shared/selectionUtils");
-const useSelection_1 = require("../../store/useSelection");
-/**
- * RealtimeSwarmChart - Simplified wrapper for streaming dot/swarm charts.
- *
- * Wraps StreamXYFrame with `chartType="swarm"` and `runtimeMode="streaming"`,
- * exposing dot styling as top-level props. Each data point renders as an individual
- * dot at its (time, value) coordinates.
- *
- * Supports threshold coloring via annotations to recolor dots that cross
- * value boundaries.
- *
- * @example
- * ```tsx
- * <RealtimeSwarmChart
- *   ref={ref}
- *   radius={4}
- *   opacity={0.8}
- *   categoryAccessor="sensor"
- *   colors={{ sensor1: "#007bff", sensor2: "#28a745" }}
- * />
- * ```
- */
-exports.RealtimeSwarmChart = (0, react_1.forwardRef)(function RealtimeSwarmChart(props, ref) {
-    const { size, width, height, margin, className, arrowOfTime = "right", windowMode = "sliding", windowSize = 200, data, timeAccessor, valueAccessor, timeExtent, valueExtent, extentPadding, categoryAccessor, colors, radius, fill, opacity, stroke, strokeWidth, showAxes = true, background, enableHover, tooltipContent, tooltip, onHover, annotations, svgAnnotationRules, tickFormatTime, tickFormatValue, linkedHover } = props;
-    const resolvedSize = width != null && height != null
-        ? [width, height]
-        : size || [500, 300];
-    const resolvedTooltip = tooltipContent ?? tooltip;
-    const frameRef = (0, react_1.useRef)(null);
-    // ── Linked hover hooks (always called, conditional logic inside) ──
-    const hoverConfig = (0, selectionUtils_1.normalizeLinkedHover)(linkedHover);
-    const linkedHoverHook = (0, useSelection_1.useLinkedHover)({
-        name: hoverConfig?.name || "hover",
-        fields: hoverConfig?.fields || []
-    });
-    const combinedHoverBehavior = (0, react_1.useCallback)((d) => {
-        if (onHover)
-            onHover(d);
-        if (linkedHover) {
-            linkedHoverHook.onHover(d ? (d.data || d) : null);
-        }
-    }, [onHover, linkedHover, linkedHoverHook]);
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        push: (point) => frameRef.current?.push(point),
-        pushMany: (points) => frameRef.current?.pushMany(points),
-        clear: () => frameRef.current?.clear(),
-        getData: () => frameRef.current?.getData() ?? []
-    }));
-    const swarmStyle = {};
-    if (radius != null)
-        swarmStyle.radius = radius;
-    if (fill != null)
-        swarmStyle.fill = fill;
-    if (opacity != null)
-        swarmStyle.opacity = opacity;
-    if (stroke != null)
-        swarmStyle.stroke = stroke;
-    if (strokeWidth != null)
-        swarmStyle.strokeWidth = strokeWidth;
-    return (React.createElement(StreamXYFrame_1.default, { ref: frameRef, chartType: "swarm", runtimeMode: "streaming", size: resolvedSize, margin: margin, className: className, arrowOfTime: arrowOfTime, windowMode: windowMode, windowSize: windowSize, data: data, timeAccessor: timeAccessor, valueAccessor: valueAccessor, xExtent: timeExtent, yExtent: valueExtent, extentPadding: extentPadding, categoryAccessor: categoryAccessor, barColors: colors, swarmStyle: swarmStyle, showAxes: showAxes, background: background, hoverAnnotation: enableHover, tooltipContent: resolvedTooltip, customHoverBehavior: combinedHoverBehavior, annotations: annotations, svgAnnotationRules: svgAnnotationRules, tickFormatTime: tickFormatTime, tickFormatValue: tickFormatValue }));
-});
-exports.RealtimeSwarmChart.displayName = "RealtimeSwarmChart";

package/ai/dist/src/components/charts/realtime/RealtimeWaterfallChart.js

@@ -1,106 +0,0 @@
-"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.RealtimeWaterfallChart = void 0;
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const StreamXYFrame_1 = __importDefault(require("../../stream/StreamXYFrame"));
-const selectionUtils_1 = require("../shared/selectionUtils");
-const useSelection_1 = require("../../store/useSelection");
-/**
- * RealtimeWaterfallChart - Simplified wrapper for streaming waterfall charts.
- *
- * Wraps StreamXYFrame with `chartType="waterfall"` and `runtimeMode="streaming"`,
- * exposing waterfall styling as top-level props. Visualizes cumulative deltas as
- * connected bars rising and falling from a running baseline.
- *
- * @example
- * ```tsx
- * <RealtimeWaterfallChart
- *   ref={ref}
- *   positiveColor="#28a745"
- *   negativeColor="#dc3545"
- *   connectorStroke="#999"
- *   windowSize={300}
- * />
- * ```
- */
-exports.RealtimeWaterfallChart = (0, react_1.forwardRef)(function RealtimeWaterfallChart(props, ref) {
-    const { size, width, height, margin, className, arrowOfTime = "right", windowMode = "sliding", windowSize = 200, data, timeAccessor, valueAccessor, timeExtent, valueExtent, extentPadding, positiveColor, negativeColor, connectorStroke, connectorWidth, gap, stroke, strokeWidth, showAxes = true, background, enableHover, tooltipContent, tooltip, onHover, annotations, svgAnnotationRules, tickFormatTime, tickFormatValue, linkedHover } = props;
-    const resolvedSize = width != null && height != null
-        ? [width, height]
-        : size || [500, 300];
-    const resolvedTooltip = tooltipContent ?? tooltip;
-    const frameRef = (0, react_1.useRef)(null);
-    // ── Linked hover hooks (always called, conditional logic inside) ──
-    const hoverConfig = (0, selectionUtils_1.normalizeLinkedHover)(linkedHover);
-    const linkedHoverHook = (0, useSelection_1.useLinkedHover)({
-        name: hoverConfig?.name || "hover",
-        fields: hoverConfig?.fields || []
-    });
-    const combinedHoverBehavior = (0, react_1.useCallback)((d) => {
-        if (onHover)
-            onHover(d);
-        if (linkedHover) {
-            linkedHoverHook.onHover(d ? (d.data || d) : null);
-        }
-    }, [onHover, linkedHover, linkedHoverHook]);
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        push: (point) => frameRef.current?.push(point),
-        pushMany: (points) => frameRef.current?.pushMany(points),
-        clear: () => frameRef.current?.clear(),
-        getData: () => frameRef.current?.getData() ?? []
-    }));
-    const waterfallStyle = {};
-    if (positiveColor != null)
-        waterfallStyle.positiveColor = positiveColor;
-    if (negativeColor != null)
-        waterfallStyle.negativeColor = negativeColor;
-    if (connectorStroke != null)
-        waterfallStyle.connectorStroke = connectorStroke;
-    if (connectorWidth != null)
-        waterfallStyle.connectorWidth = connectorWidth;
-    if (gap != null)
-        waterfallStyle.gap = gap;
-    if (stroke != null)
-        waterfallStyle.stroke = stroke;
-    if (strokeWidth != null)
-        waterfallStyle.strokeWidth = strokeWidth;
-    return (React.createElement(StreamXYFrame_1.default, { ref: frameRef, chartType: "waterfall", runtimeMode: "streaming", size: resolvedSize, margin: margin, className: className, arrowOfTime: arrowOfTime, windowMode: windowMode, windowSize: windowSize, data: data, timeAccessor: timeAccessor, valueAccessor: valueAccessor, xExtent: timeExtent, yExtent: valueExtent, extentPadding: extentPadding, waterfallStyle: waterfallStyle, showAxes: showAxes, background: background, hoverAnnotation: enableHover, tooltipContent: resolvedTooltip, customHoverBehavior: combinedHoverBehavior, annotations: annotations, svgAnnotationRules: svgAnnotationRules, tickFormatTime: tickFormatTime, tickFormatValue: tickFormatValue }));
-});
-exports.RealtimeWaterfallChart.displayName = "RealtimeWaterfallChart";

package/ai/dist/src/components/charts/shared/ChartError.js

@@ -1,72 +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 });
-exports.default = ChartError;
-const React = __importStar(require("react"));
-/**
- * Renders a visible, styled error state inside the chart's dimensions.
- * Shows the component name, error message, and a hint for developers.
- *
- * Designed to be obvious in development but not alarming in production —
- * uses muted colors that adapt to light/dark backgrounds.
- */
-function ChartError({ componentName, message, width, height, }) {
-    return (React.createElement("div", { role: "alert", style: {
-            width,
-            height: Math.max(height, 120),
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            border: "1px dashed rgba(128, 128, 128, 0.4)",
-            borderRadius: 8,
-            background: "rgba(128, 128, 128, 0.04)",
-            padding: 24,
-            boxSizing: "border-box",
-        } },
-        React.createElement("div", { style: { textAlign: "center", maxWidth: 400 } },
-            React.createElement("div", { style: {
-                    fontSize: 13,
-                    fontWeight: 600,
-                    color: "rgba(128, 128, 128, 0.7)",
-                    marginBottom: 6,
-                    fontFamily: "monospace",
-                } }, componentName),
-            React.createElement("div", { style: {
-                    fontSize: 14,
-                    color: "rgba(128, 128, 128, 0.9)",
-                    lineHeight: 1.5,
-                } }, message))));
-}

package/ai/dist/src/components/charts/shared/colorUtils.js

@@ -1,138 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DEFAULT_COLORS = exports.COLOR_SCHEMES = void 0;
-exports.getColor = getColor;
-exports.createColorScale = createColorScale;
-exports.getSize = getSize;
-const d3_scale_1 = require("d3-scale");
-const d3_scale_chromatic_1 = require("d3-scale-chromatic");
-/**
- * Predefined color schemes
- */
-exports.COLOR_SCHEMES = {
-    // Categorical schemes
-    category10: d3_scale_chromatic_1.schemeCategory10,
-    tableau10: d3_scale_chromatic_1.schemeTableau10,
-    set3: d3_scale_chromatic_1.schemeSet3,
-    // Sequential schemes (for continuous data)
-    blues: d3_scale_chromatic_1.interpolateBlues,
-    reds: d3_scale_chromatic_1.interpolateReds,
-    greens: d3_scale_chromatic_1.interpolateGreens,
-    oranges: d3_scale_chromatic_1.interpolateOranges,
-    purples: d3_scale_chromatic_1.interpolatePurples,
-    viridis: d3_scale_chromatic_1.interpolateViridis,
-    plasma: d3_scale_chromatic_1.interpolatePlasma
-};
-/**
- * Default colors for charts
- */
-exports.DEFAULT_COLORS = d3_scale_chromatic_1.schemeCategory10;
-/**
- * Gets a color for a data point based on the colorBy configuration
- *
- * @param dataPoint - The data point
- * @param colorBy - Field name or function to determine color
- * @param colorScale - Optional custom color scale
- * @returns Color string
- *
- * @example
- * ```ts
- * // Using a field name
- * getColor({category: 'A', value: 10}, 'category', colorScale)
- *
- * // Using a function
- * getColor({value: 10}, d => d.value > 5 ? 'red' : 'blue')
- * ```
- */
-function getColor(dataPoint, colorBy, colorScale) {
-    if (typeof colorBy === "function") {
-        return colorBy(dataPoint);
-    }
-    const colorValue = dataPoint[colorBy];
-    if (colorScale) {
-        return colorScale(colorValue);
-    }
-    // Default: return a hash-based color
-    return exports.DEFAULT_COLORS[Math.abs(hashString(String(colorValue))) % exports.DEFAULT_COLORS.length];
-}
-/**
- * Creates a color scale function from data
- *
- * @param data - Array of data points
- * @param colorBy - Field name to use for coloring
- * @param scheme - Color scheme name or custom palette
- * @returns Color scale function
- *
- * @example
- * ```ts
- * const colorScale = createColorScale(data, 'category')
- * const color = colorScale('A') // Returns color for category 'A'
- * ```
- */
-function createColorScale(data, colorBy, scheme = "category10") {
-    // Get unique values
-    const uniqueValues = Array.from(new Set(data.map(d => d[colorBy])));
-    // Check if values are numeric for sequential scale
-    const isNumeric = uniqueValues.every(v => typeof v === "number" || !isNaN(Number(v)));
-    // Handle custom color array
-    if (Array.isArray(scheme)) {
-        return (0, d3_scale_1.scaleOrdinal)()
-            .domain(uniqueValues)
-            .range(scheme)
-            .unknown("#999");
-    }
-    const colorScheme = exports.COLOR_SCHEMES[scheme] || exports.COLOR_SCHEMES.category10;
-    if (isNumeric && typeof colorScheme === "function") {
-        // Use sequential scale for numeric data
-        return (v) => colorScheme(Number(v) / Math.max(...uniqueValues.map(Number)));
-    }
-    else {
-        // Use ordinal scale for categorical data
-        const colors = Array.isArray(colorScheme) ? colorScheme : exports.DEFAULT_COLORS;
-        return (0, d3_scale_1.scaleOrdinal)()
-            .domain(uniqueValues)
-            .range(colors)
-            .unknown("#999");
-    }
-}
-/**
- * Simple string hash function for deterministic color assignment
- */
-function hashString(str) {
-    let hash = 0;
-    for (let i = 0; i < str.length; i++) {
-        const char = str.charCodeAt(i);
-        hash = (hash << 5) - hash + char;
-        hash = hash & hash; // Convert to 32bit integer
-    }
-    return Math.abs(hash);
-}
-/**
- * Generates a size function based on sizeBy configuration
- *
- * @param dataPoint - The data point
- * @param sizeBy - Field name or function to determine size
- * @param sizeRange - Min and max size range [min, max]
- * @param domain - Optional domain for scaling [minValue, maxValue]
- * @returns Size value
- */
-function getSize(dataPoint, sizeBy, sizeRange = [3, 20], domain) {
-    let value;
-    if (typeof sizeBy === "function") {
-        value = sizeBy(dataPoint);
-    }
-    else {
-        value = dataPoint[sizeBy];
-    }
-    if (!domain) {
-        return value;
-    }
-    // Scale value to size range
-    const [minDomain, maxDomain] = domain;
-    const [minSize, maxSize] = sizeRange;
-    if (maxDomain === minDomain) {
-        return (minSize + maxSize) / 2;
-    }
-    const normalized = (value - minDomain) / (maxDomain - minDomain);
-    return minSize + normalized * (maxSize - minSize);
-}

package/ai/dist/src/components/charts/shared/formatUtils.js

@@ -1,213 +0,0 @@
-"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 });
-exports.formatNumber = formatNumber;
-exports.formatDate = formatDate;
-exports.formatAxis = formatAxis;
-exports.createTooltip = createTooltip;
-exports.formatLargeNumber = formatLargeNumber;
-exports.smartTickFormat = smartTickFormat;
-exports.truncateText = truncateText;
-const React = __importStar(require("react"));
-const d3_time_format_1 = require("d3-time-format");
-const d3_format_1 = require("d3-format");
-/**
- * Format number with specified format string
- *
- * @param value - Number to format
- * @param formatString - D3 format string (e.g., ".2f", ",.0f", ".1%")
- * @returns Formatted string
- *
- * @see https://github.com/d3/d3-format#format for format string options
- */
-function formatNumber(value, formatString = ",.0f") {
-    try {
-        return (0, d3_format_1.format)(formatString)(value);
-    }
-    catch {
-        return String(value);
-    }
-}
-/**
- * Format date with specified format string
- *
- * @param value - Date to format
- * @param formatString - D3 time format string (e.g., "%Y-%m-%d", "%b %d")
- * @returns Formatted string
- *
- * @see https://github.com/d3/d3-time-format#timeFormat for format string options
- */
-function formatDate(value, formatString = "%b %d, %Y") {
-    try {
-        const date = value instanceof Date ? value : new Date(value);
-        return (0, d3_time_format_1.timeFormat)(formatString)(date);
-    }
-    catch {
-        return String(value);
-    }
-}
-/**
- * Creates a formatting function based on the type
- *
- * @param type - Type of formatting: 'number', 'date', 'percent', or 'currency'
- * @param options - Optional configuration for the formatter
- * @returns Formatting function
- *
- * @example
- * ```ts
- * const fmt = formatAxis('number', { decimals: 2 })
- * fmt(1234.567) // "1,234.57"
- *
- * const dateFmt = formatAxis('date', { format: '%b %Y' })
- * dateFmt(new Date()) // "Jan 2024"
- * ```
- */
-function formatAxis(type = "number", options) {
-    const { decimals = 0, format: customFormat, currency = "$" } = options || {};
-    switch (type) {
-        case "date":
-            return (d) => formatDate(d, customFormat || "%b %d");
-        case "percent":
-            return (d) => formatNumber(d, customFormat || `.${decimals}%`);
-        case "currency":
-            return (d) => `${currency}${formatNumber(d, customFormat || `,.${decimals}f`)}`;
-        case "number":
-        default:
-            return (d) => formatNumber(d, customFormat || `,.${decimals}f`);
-    }
-}
-/**
- * Creates a tooltip content generator
- *
- * @param fields - Array of field names to display
- * @param formatters - Optional map of field names to formatting functions
- * @param labels - Optional map of field names to display labels
- * @returns React element generator function
- *
- * @example
- * ```ts
- * const tooltip = createTooltip(
- *   ['category', 'value'],
- *   { value: d => formatNumber(d, ',.2f') },
- *   { category: 'Category', value: 'Value' }
- * )
- * ```
- */
-function createTooltip(fields, formatters, labels) {
-    return (d) => {
-        return React.createElement("div", { className: "tooltip-content", style: { padding: "8px" } }, fields.map((field) => {
-            const label = labels?.[field] || field;
-            const value = d[field];
-            const formatter = formatters?.[field];
-            const displayValue = formatter ? formatter(value) : String(value);
-            return React.createElement("div", { key: field, style: { marginBottom: "4px" } }, React.createElement("strong", null, `${label}: `), displayValue);
-        }));
-    };
-}
-/**
- * Formats large numbers with K/M/B suffixes
- *
- * @param value - Number to format
- * @param decimals - Number of decimal places
- * @returns Formatted string with suffix
- *
- * @example
- * ```ts
- * formatLargeNumber(1234) // "1.2K"
- * formatLargeNumber(1234567) // "1.2M"
- * formatLargeNumber(1234567890) // "1.2B"
- * ```
- */
-function formatLargeNumber(value, decimals = 1) {
-    if (value >= 1e9) {
-        return (value / 1e9).toFixed(decimals) + "B";
-    }
-    if (value >= 1e6) {
-        return (value / 1e6).toFixed(decimals) + "M";
-    }
-    if (value >= 1e3) {
-        return (value / 1e3).toFixed(decimals) + "K";
-    }
-    return value.toFixed(decimals);
-}
-/**
- * Smart default tick format for axis labels.
- *
- * Handles the common problems with raw number-to-string conversion:
- * - Floating-point noise (0.30000000000000004 → "0.3")
- * - Excessive precision (62.123456789 → "62.1235")
- * - Large numbers (1500000 → "1.5M")
- * - Strings/non-numbers pass through unchanged
- *
- * Used as the default axis tickFormat when no explicit format is provided.
- */
-function smartTickFormat(value) {
-    if (value == null)
-        return "";
-    if (typeof value !== "number")
-        return String(value);
-    if (!isFinite(value))
-        return String(value);
-    if (value === 0)
-        return "0";
-    // Clean floating-point noise (e.g., 0.30000000000000004 → 0.3)
-    const cleaned = parseFloat(value.toPrecision(12));
-    const abs = Math.abs(cleaned);
-    // Large numbers: compact suffixes
-    if (abs >= 1e9)
-        return `${parseFloat((cleaned / 1e9).toPrecision(3))}B`;
-    if (abs >= 1e6)
-        return `${parseFloat((cleaned / 1e6).toPrecision(3))}M`;
-    if (abs >= 1e4)
-        return `${parseFloat((cleaned / 1e3).toPrecision(3))}K`;
-    // Integers: no decimals needed
-    if (Number.isInteger(cleaned))
-        return String(cleaned);
-    // Floats: up to 6 significant digits, trailing zeros stripped
-    return String(parseFloat(cleaned.toPrecision(6)));
-}
-/**
- * Truncates text to specified length with ellipsis
- *
- * @param text - Text to truncate
- * @param maxLength - Maximum length before truncation
- * @returns Truncated text
- */
-function truncateText(text, maxLength = 20) {
-    if (text.length <= maxLength) {
-        return text;
-    }
-    return text.slice(0, maxLength - 3) + "...";
-}

package/ai/dist/src/components/charts/shared/hooks.js

@@ -1,49 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DEFAULT_COLOR = void 0;
-exports.resolveAccessor = resolveAccessor;
-exports.useColorScale = useColorScale;
-exports.useSortedData = useSortedData;
-const react_1 = require("react");
-const colorUtils_1 = require("./colorUtils");
-/**
- * Default fill color used when no colorBy is specified
- */
-exports.DEFAULT_COLOR = "#007bff";
-/**
- * Resolve an accessor (string key or function) into a function.
- * Used across chart components to normalize `valueAccessor`, `categoryAccessor`, etc.
- */
-function resolveAccessor(accessor) {
-    return typeof accessor === "function"
-        ? accessor
-        : (d) => d[accessor];
-}
-/**
- * Hook to create a color scale from data and colorBy configuration.
- * Returns undefined when colorBy is absent or is a function accessor.
- */
-function useColorScale(data, colorBy, colorScheme = "category10") {
-    return (0, react_1.useMemo)(() => {
-        if (!colorBy || typeof colorBy === "function")
-            return undefined;
-        return (0, colorUtils_1.createColorScale)(data, colorBy, colorScheme);
-    }, [data, colorBy, colorScheme]);
-}
-/**
- * Hook to sort data by a value accessor.
- * Used by BarChart and DotPlot.
- */
-function useSortedData(data, sort, valueAccessor) {
-    return (0, react_1.useMemo)(() => {
-        if (!sort)
-            return data;
-        const copy = [...data];
-        if (typeof sort === "function")
-            return copy.sort(sort);
-        const getValue = resolveAccessor(valueAccessor);
-        return sort === "asc"
-            ? copy.sort((a, b) => getValue(a) - getValue(b))
-            : copy.sort((a, b) => getValue(b) - getValue(a));
-    }, [data, sort, valueAccessor]);
-}