@rm-graph/core 0.1.0

package/dist/index.mjs

@@ -0,0 +1,1600 @@
+import { ThemeManager, __require } from './chunk-Q2ZHY445.mjs';
+export { ThemeManager, darkTheme, getThemeManager, lightTheme, midnightTheme, modernTheme } from './chunk-Q2ZHY445.mjs';
+import { SciChartSurface, NumericAxis, EAutoRange, NumberRange, RolloverModifier, ZoomPanModifier, MouseWheelZoomModifier, XyDataSeries, FastLineRenderableSeries, EllipsePointMarker, SweepAnimation, FastColumnRenderableSeries, WaveAnimation, GradientParams, Point, FastMountainRenderableSeries, UniformHeatmapDataSeries, UniformHeatmapRenderableSeries, HeatmapColorMap, SciChart3DSurface, NumericAxis3D, MouseWheelZoomModifier3D, OrbitModifier3D, CameraController, Vector3, UniformGridDataSeries3D, GradientColorPalette, SurfaceMeshRenderableSeries3D, EDrawMeshAs, XyzDataSeries3D, ColumnRenderableSeries3D, PointLineRenderableSeries3D, TooltipModifier3D, SciChartJSDarkTheme, SciChartJSLightTheme } from 'scichart';
+export { SciChartSurface } from 'scichart';
+
+// src/utils/helpers.ts
+function generateId(prefix = "chart") {
+  return `${prefix}-${Math.random().toString(36).substring(2, 11)}`;
+}
+function parseSize(value, fallback) {
+  if (value === void 0) return fallback;
+  if (typeof value === "number") return value;
+  if (value.endsWith("%")) {
+    return fallback;
+  }
+  const parsed = parseInt(value, 10);
+  return isNaN(parsed) ? fallback : parsed;
+}
+function normalizeDataPoints(data) {
+  if (data.length === 0) return [];
+  if (typeof data[0] === "object" && "x" in data[0]) {
+    return data;
+  }
+  return data.map((y, index) => ({
+    x: index,
+    y
+  }));
+}
+function extractXValues(data) {
+  return data.map((point) => {
+    if (typeof point.x === "number") return point.x;
+    if (point.x instanceof Date) return point.x.getTime();
+    return 0;
+  });
+}
+function extractYValues(data) {
+  return data.map((point) => point.y);
+}
+function deepMerge(target, source) {
+  const result = { ...target };
+  for (const key in source) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
+      const sourceValue = source[key];
+      const targetValue = target[key];
+      if (sourceValue !== null && typeof sourceValue === "object" && !Array.isArray(sourceValue) && targetValue !== null && typeof targetValue === "object" && !Array.isArray(targetValue)) {
+        result[key] = deepMerge(
+          targetValue,
+          sourceValue
+        );
+      } else if (sourceValue !== void 0) {
+        result[key] = sourceValue;
+      }
+    }
+  }
+  return result;
+}
+function debounce(fn, delay) {
+  let timeoutId = null;
+  return (...args) => {
+    if (timeoutId) {
+      clearTimeout(timeoutId);
+    }
+    timeoutId = setTimeout(() => {
+      fn(...args);
+      timeoutId = null;
+    }, delay);
+  };
+}
+function throttle(fn, limit) {
+  let inThrottle = false;
+  return (...args) => {
+    if (!inThrottle) {
+      fn(...args);
+      inThrottle = true;
+      setTimeout(() => {
+        inThrottle = false;
+      }, limit);
+    }
+  };
+}
+function calculateDataRange(series) {
+  let xMin = Infinity;
+  let xMax = -Infinity;
+  let yMin = Infinity;
+  let yMax = -Infinity;
+  for (const s of series) {
+    const normalized = normalizeDataPoints(s.data);
+    for (const point of normalized) {
+      const x = typeof point.x === "number" ? point.x : 0;
+      xMin = Math.min(xMin, x);
+      xMax = Math.max(xMax, x);
+      yMin = Math.min(yMin, point.y);
+      yMax = Math.max(yMax, point.y);
+    }
+  }
+  return {
+    xMin: xMin === Infinity ? 0 : xMin,
+    xMax: xMax === -Infinity ? 100 : xMax,
+    yMin: yMin === Infinity ? 0 : yMin,
+    yMax: yMax === -Infinity ? 100 : yMax
+  };
+}
+function formatNumber(value, precision = 2) {
+  if (Math.abs(value) >= 1e9) {
+    return (value / 1e9).toFixed(precision) + "B";
+  }
+  if (Math.abs(value) >= 1e6) {
+    return (value / 1e6).toFixed(precision) + "M";
+  }
+  if (Math.abs(value) >= 1e3) {
+    return (value / 1e3).toFixed(precision) + "K";
+  }
+  return value.toFixed(precision);
+}
+function clamp(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function lerp(start, end, t) {
+  return start + (end - start) * clamp(t, 0, 1);
+}
+function hexToRgba(hex, alpha = 1) {
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  if (!result) return hex;
+  const r = parseInt(result[1], 16);
+  const g = parseInt(result[2], 16);
+  const b = parseInt(result[3], 16);
+  return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+}
+
+// src/charts/BaseChart.ts
+var BaseChart = class {
+  constructor(config) {
+    this.container = null;
+    this.surface = null;
+    this.isInitialized = false;
+    this.isDestroyed = false;
+    // Event handlers
+    this.eventHandlers = /* @__PURE__ */ new Map();
+    // Resize observer
+    this.resizeObserver = null;
+    this.id = config.id ?? generateId("chart");
+    this.config = config;
+    this.theme = ThemeManager.getInstance().resolveTheme(config.theme);
+    this.debouncedResize = debounce(() => this.handleResize(), 100);
+  }
+  /**
+   * Initialize the chart in the given container
+   */
+  async init(container) {
+    if (this.isDestroyed) {
+      throw new Error("Cannot initialize a destroyed chart");
+    }
+    if (typeof container === "string") {
+      const el = document.getElementById(container);
+      if (!el) {
+        throw new Error(`Container element "${container}" not found`);
+      }
+      this.container = el;
+    } else {
+      this.container = container;
+    }
+    this.setupContainer();
+    this.configureSciChartDefaults();
+    await this.createSurface();
+    this.setupResizeObserver();
+    this.isInitialized = true;
+    this.emit("rendered", { chartId: this.id, renderTime: performance.now() });
+  }
+  /**
+   * Setup container element
+   */
+  setupContainer() {
+    if (!this.container) return;
+    const { width, height } = this.config;
+    if (width) {
+      this.container.style.width = typeof width === "number" ? `${width}px` : width;
+    }
+    if (height) {
+      this.container.style.height = typeof height === "number" ? `${height}px` : height;
+    }
+    const computedStyle = window.getComputedStyle(this.container);
+    if (computedStyle.position === "static") {
+      this.container.style.position = "relative";
+    }
+  }
+  /**
+   * Configure SciChart library defaults
+   */
+  configureSciChartDefaults() {
+  }
+  /**
+   * Update chart options
+   */
+  setOptions(options) {
+    this.config = { ...this.config, ...options };
+    if (options.theme) {
+      this.theme = ThemeManager.getInstance().resolveTheme(options.theme);
+      this.applyTheme();
+    }
+    this.update();
+  }
+  /**
+   * Apply current theme to the chart
+   */
+  applyTheme() {
+    if (!this.surface) return;
+    this.surface.background = this.theme.backgroundColor ?? "#ffffff";
+  }
+  /**
+   * Set up resize observer for responsive charts
+   */
+  setupResizeObserver() {
+    if (!this.container || typeof ResizeObserver === "undefined") return;
+    this.resizeObserver = new ResizeObserver(() => {
+      this.debouncedResize();
+    });
+    this.resizeObserver.observe(this.container);
+  }
+  /**
+   * Handle container resize
+   */
+  handleResize() {
+    if (!this.surface || !this.container) return;
+    const { width, height } = this.container.getBoundingClientRect();
+  }
+  /**
+   * Manually resize the chart
+   */
+  resize(width, height) {
+    if (!this.container) return;
+    if (width !== void 0) {
+      this.container.style.width = `${width}px`;
+    }
+    if (height !== void 0) {
+      this.container.style.height = `${height}px`;
+    }
+    this.handleResize();
+  }
+  /**
+   * Export chart as image
+   */
+  async exportImage(format = "png") {
+    if (!this.surface) {
+      throw new Error("Chart not initialized");
+    }
+    const canvas = this.container?.querySelector("canvas");
+    if (!canvas) {
+      throw new Error("Canvas not found");
+    }
+    const mimeType = format === "jpeg" ? "image/jpeg" : "image/png";
+    return canvas.toDataURL(mimeType);
+  }
+  /**
+   * Add event listener
+   */
+  on(event, handler) {
+    if (!this.eventHandlers.has(event)) {
+      this.eventHandlers.set(event, /* @__PURE__ */ new Set());
+    }
+    this.eventHandlers.get(event).add(handler);
+  }
+  /**
+   * Remove event listener
+   */
+  off(event, handler) {
+    const handlers = this.eventHandlers.get(event);
+    if (handlers) {
+      handlers.delete(handler);
+    }
+  }
+  /**
+   * Emit an event
+   */
+  emit(event, data) {
+    const handlers = this.eventHandlers.get(event);
+    if (handlers) {
+      handlers.forEach((handler) => handler(data));
+    }
+  }
+  /**
+   * Destroy the chart and clean up resources
+   */
+  destroy() {
+    if (this.isDestroyed) return;
+    if (this.resizeObserver) {
+      this.resizeObserver.disconnect();
+      this.resizeObserver = null;
+    }
+    this.eventHandlers.clear();
+    if (this.surface) {
+      this.surface.delete();
+      this.surface = null;
+    }
+    if (this.container) {
+      this.container.innerHTML = "";
+    }
+    this.isDestroyed = true;
+    this.isInitialized = false;
+  }
+  /**
+   * Get current configuration
+   */
+  getConfig() {
+    return { ...this.config };
+  }
+  /**
+   * Get current theme
+   */
+  getTheme() {
+    return { ...this.theme };
+  }
+  /**
+   * Check if chart is initialized
+   */
+  isReady() {
+    return this.isInitialized && !this.isDestroyed;
+  }
+};
+function getSciChartTheme(themeName) {
+  switch (themeName) {
+    case "light":
+      return new SciChartJSLightTheme();
+    case "dark":
+    case "modern":
+    case "midnight":
+    default:
+      return new SciChartJSDarkTheme();
+  }
+}
+var LineChart = class extends BaseChart {
+  constructor(config) {
+    super(config);
+    this.dataSeries = /* @__PURE__ */ new Map();
+    this.renderableSeries = [];
+    this.wasmContext = null;
+  }
+  /**
+   * Create the SciChart surface for line chart
+   */
+  async createSurface() {
+    if (!this.container) {
+      throw new Error("Container not set");
+    }
+    const sciChartTheme = getSciChartTheme(this.config.theme);
+    if (!this.container.id) {
+      this.container.id = this.id;
+    }
+    const { sciChartSurface, wasmContext } = await SciChartSurface.create(
+      this.container,
+      {
+        theme: sciChartTheme
+      }
+    );
+    this.surface = sciChartSurface;
+    this.wasmContext = wasmContext;
+    const xAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.xAxis?.title,
+      drawMajorGridLines: this.config.xAxis?.gridLines?.show ?? true,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      majorGridLineStyle: {
+        color: this.theme.axis?.gridLineColor ?? "#e9ecef",
+        strokeThickness: 1
+      },
+      axisBorder: {
+        color: this.theme.axis?.lineColor ?? "#dee2e6"
+      },
+      autoRange: EAutoRange.Always
+    });
+    const yAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.yAxis?.title,
+      drawMajorGridLines: this.config.yAxis?.gridLines?.show ?? true,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      majorGridLineStyle: {
+        color: this.theme.axis?.gridLineColor ?? "#e9ecef",
+        strokeThickness: 1
+      },
+      axisBorder: {
+        color: this.theme.axis?.lineColor ?? "#dee2e6"
+      },
+      autoRange: EAutoRange.Always
+    });
+    if (this.config.xAxis?.min !== void 0 && this.config.xAxis?.max !== void 0) {
+      xAxis.visibleRange = new NumberRange(this.config.xAxis.min, this.config.xAxis.max);
+      xAxis.autoRange = EAutoRange.Never;
+    }
+    if (this.config.yAxis?.min !== void 0 && this.config.yAxis?.max !== void 0) {
+      yAxis.visibleRange = new NumberRange(this.config.yAxis.min, this.config.yAxis.max);
+      yAxis.autoRange = EAutoRange.Never;
+    }
+    sciChartSurface.xAxes.add(xAxis);
+    sciChartSurface.yAxes.add(yAxis);
+    if (this.config.tooltip?.enabled !== false) {
+      sciChartSurface.chartModifiers.add(
+        new RolloverModifier({
+          showTooltip: true,
+          showAxisLabel: true
+        })
+      );
+    }
+    sciChartSurface.chartModifiers.add(new ZoomPanModifier());
+    sciChartSurface.chartModifiers.add(new MouseWheelZoomModifier());
+    this.addSeries(this.config.series);
+  }
+  /**
+   * Add series to the chart
+   */
+  addSeries(seriesConfigs) {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    const colorPalette = this.theme.colorPalette ?? [];
+    seriesConfigs.forEach((seriesConfig, index) => {
+      const data = normalizeDataPoints(seriesConfig.data);
+      const xValues = extractXValues(data);
+      const yValues = extractYValues(data);
+      const dataSeries = new XyDataSeries(wasmContext, {
+        xValues,
+        yValues,
+        dataSeriesName: seriesConfig.name
+      });
+      this.dataSeries.set(seriesConfig.name, dataSeries);
+      const color = seriesConfig.color ?? colorPalette[index % colorPalette.length] ?? "#6366f1";
+      const lineSeries = new FastLineRenderableSeries(wasmContext);
+      lineSeries.dataSeries = dataSeries;
+      lineSeries.stroke = color;
+      lineSeries.strokeThickness = this.config.lineWidth ?? 2;
+      if (this.config.showPoints) {
+        lineSeries.pointMarker = new EllipsePointMarker(wasmContext, {
+          width: this.config.pointSize ?? 8,
+          height: this.config.pointSize ?? 8,
+          fill: color,
+          stroke: color,
+          strokeThickness: 0
+        });
+      }
+      if (this.config.animation !== false) {
+        lineSeries.animation = new SweepAnimation({
+          duration: typeof this.config.animation === "object" ? this.config.animation.duration ?? 500 : 500
+        });
+      }
+      this.renderableSeries.push(lineSeries);
+      this.surface.renderableSeries.add(lineSeries);
+    });
+  }
+  /**
+   * Set new data for the chart
+   */
+  setData(data) {
+    if (!this.surface) {
+      this.config.series = data;
+      return;
+    }
+    this.clearSeries();
+    this.config.series = data;
+    this.addSeries(data);
+  }
+  /**
+   * Update specific series data
+   */
+  updateSeriesData(seriesName, data) {
+    const dataSeries = this.dataSeries.get(seriesName);
+    if (!dataSeries) {
+      console.warn(`Series "${seriesName}" not found`);
+      return;
+    }
+    const normalized = normalizeDataPoints(data);
+    const xValues = extractXValues(normalized);
+    const yValues = extractYValues(normalized);
+    dataSeries.clear();
+    dataSeries.appendRange(xValues, yValues);
+  }
+  /**
+   * Append data to a series
+   */
+  appendData(seriesName, data) {
+    const dataSeries = this.dataSeries.get(seriesName);
+    if (!dataSeries) {
+      console.warn(`Series "${seriesName}" not found`);
+      return;
+    }
+    const points = Array.isArray(data) ? data : [data];
+    const normalized = normalizeDataPoints(points);
+    const xValues = extractXValues(normalized);
+    const yValues = extractYValues(normalized);
+    dataSeries.appendRange(xValues, yValues);
+  }
+  /**
+   * Clear all series
+   */
+  clearSeries() {
+    if (!this.surface) return;
+    this.renderableSeries.forEach((series) => {
+      this.surface.renderableSeries.remove(series);
+      series.delete();
+    });
+    this.renderableSeries = [];
+    this.dataSeries.forEach((ds) => ds.delete());
+    this.dataSeries.clear();
+  }
+  /**
+   * Update chart
+   */
+  update() {
+    if (!this.surface) return;
+    this.applyTheme();
+    this.surface.invalidateElement();
+  }
+  /**
+   * Apply theme to line chart
+   */
+  applyTheme() {
+    super.applyTheme();
+    if (!this.surface) return;
+    const colorPalette = this.theme.colorPalette ?? [];
+    this.renderableSeries.forEach((series, index) => {
+      const originalColor = this.config.series[index]?.color;
+      if (!originalColor) {
+        series.stroke = colorPalette[index % colorPalette.length];
+      }
+    });
+  }
+  /**
+   * Destroy and clean up
+   */
+  destroy() {
+    this.clearSeries();
+    super.destroy();
+  }
+};
+async function createLineChart(container, config) {
+  const chart = new LineChart(config);
+  await chart.init(container);
+  return chart;
+}
+function getSciChartTheme2(themeName) {
+  switch (themeName) {
+    case "light":
+      return new SciChartJSLightTheme();
+    case "dark":
+    case "modern":
+    case "midnight":
+    default:
+      return new SciChartJSDarkTheme();
+  }
+}
+var BarChart = class extends BaseChart {
+  constructor(config) {
+    super(config);
+    this.dataSeries = /* @__PURE__ */ new Map();
+    this.renderableSeries = [];
+    this.wasmContext = null;
+  }
+  /**
+   * Create the SciChart surface for bar chart
+   */
+  async createSurface() {
+    if (!this.container) {
+      throw new Error("Container not set");
+    }
+    const sciChartTheme = getSciChartTheme2(this.config.theme);
+    if (!this.container.id) {
+      this.container.id = this.id;
+    }
+    const { sciChartSurface, wasmContext } = await SciChartSurface.create(
+      this.container,
+      {
+        theme: sciChartTheme
+      }
+    );
+    this.surface = sciChartSurface;
+    this.wasmContext = wasmContext;
+    const xAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.xAxis?.title,
+      drawMajorGridLines: this.config.xAxis?.gridLines?.show ?? false,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      autoRange: EAutoRange.Always
+    });
+    const yAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.yAxis?.title,
+      drawMajorGridLines: this.config.yAxis?.gridLines?.show ?? true,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      autoRange: EAutoRange.Always,
+      growBy: new NumberRange(0, 0.1)
+      // Add 10% padding at top
+    });
+    if (this.config.xAxis?.min !== void 0 && this.config.xAxis?.max !== void 0) {
+      xAxis.visibleRange = new NumberRange(this.config.xAxis.min, this.config.xAxis.max);
+      xAxis.autoRange = EAutoRange.Never;
+    }
+    if (this.config.yAxis?.min !== void 0 && this.config.yAxis?.max !== void 0) {
+      yAxis.visibleRange = new NumberRange(this.config.yAxis.min, this.config.yAxis.max);
+      yAxis.autoRange = EAutoRange.Never;
+    }
+    sciChartSurface.xAxes.add(xAxis);
+    sciChartSurface.yAxes.add(yAxis);
+    if (this.config.tooltip?.enabled !== false) {
+      sciChartSurface.chartModifiers.add(
+        new RolloverModifier({
+          showTooltip: true,
+          showAxisLabel: true
+        })
+      );
+    }
+    sciChartSurface.chartModifiers.add(new ZoomPanModifier());
+    this.addSeries(this.config.series);
+  }
+  /**
+   * Add series to the chart
+   */
+  addSeries(seriesConfigs) {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    const colorPalette = this.theme.colorPalette ?? [];
+    const seriesCount = seriesConfigs.length;
+    const dataPointWidth = this.config.barWidth ?? 0.7;
+    seriesConfigs.forEach((seriesConfig, index) => {
+      const data = normalizeDataPoints(seriesConfig.data);
+      let xValues = extractXValues(data);
+      if (!this.config.stacked && seriesCount > 1) {
+        const offset = (index - (seriesCount - 1) / 2) * (dataPointWidth / seriesCount);
+        xValues = xValues.map((x) => x + offset);
+      }
+      const yValues = extractYValues(data);
+      const dataSeries = new XyDataSeries(wasmContext, {
+        xValues,
+        yValues,
+        dataSeriesName: seriesConfig.name
+      });
+      this.dataSeries.set(seriesConfig.name, dataSeries);
+      const color = seriesConfig.color ?? colorPalette[index % colorPalette.length] ?? "#6366f1";
+      const columnSeries = new FastColumnRenderableSeries(wasmContext);
+      columnSeries.dataSeries = dataSeries;
+      columnSeries.fill = color;
+      columnSeries.stroke = color;
+      columnSeries.strokeThickness = 0;
+      columnSeries.dataPointWidth = this.config.stacked ? dataPointWidth : dataPointWidth / seriesCount;
+      columnSeries.cornerRadius = this.config.borderRadius ?? 0;
+      if (this.config.animation !== false) {
+        columnSeries.animation = new WaveAnimation({
+          duration: typeof this.config.animation === "object" ? this.config.animation.duration ?? 500 : 500
+        });
+      }
+      columnSeries.fillLinearGradient = new GradientParams(
+        new Point(0, 0),
+        new Point(0, 1),
+        [
+          { color, offset: 0 },
+          { color: hexToRgba(color, 0.7), offset: 1 }
+        ]
+      );
+      this.renderableSeries.push(columnSeries);
+      this.surface.renderableSeries.add(columnSeries);
+    });
+  }
+  /**
+   * Set new data for the chart
+   */
+  setData(data) {
+    if (!this.surface) {
+      this.config.series = data;
+      return;
+    }
+    this.clearSeries();
+    this.config.series = data;
+    this.addSeries(data);
+  }
+  /**
+   * Update specific series data
+   */
+  updateSeriesData(seriesName, data) {
+    const dataSeries = this.dataSeries.get(seriesName);
+    if (!dataSeries) {
+      console.warn(`Series "${seriesName}" not found`);
+      return;
+    }
+    const normalized = normalizeDataPoints(data);
+    const xValues = extractXValues(normalized);
+    const yValues = extractYValues(normalized);
+    dataSeries.clear();
+    dataSeries.appendRange(xValues, yValues);
+  }
+  /**
+   * Clear all series
+   */
+  clearSeries() {
+    if (!this.surface) return;
+    this.renderableSeries.forEach((series) => {
+      this.surface.renderableSeries.remove(series);
+      series.delete();
+    });
+    this.renderableSeries = [];
+    this.dataSeries.forEach((ds) => ds.delete());
+    this.dataSeries.clear();
+  }
+  /**
+   * Update chart
+   */
+  update() {
+    if (!this.surface) return;
+    this.applyTheme();
+    this.surface.invalidateElement();
+  }
+  /**
+   * Destroy and clean up
+   */
+  destroy() {
+    this.clearSeries();
+    super.destroy();
+  }
+};
+async function createBarChart(container, config) {
+  const chart = new BarChart(config);
+  await chart.init(container);
+  return chart;
+}
+function getSciChartTheme3(themeName) {
+  switch (themeName) {
+    case "light":
+      return new SciChartJSLightTheme();
+    case "dark":
+    case "modern":
+    case "midnight":
+    default:
+      return new SciChartJSDarkTheme();
+  }
+}
+var AreaChart = class extends BaseChart {
+  constructor(config) {
+    super(config);
+    this.dataSeries = /* @__PURE__ */ new Map();
+    this.renderableSeries = [];
+    this.wasmContext = null;
+  }
+  /**
+   * Create the SciChart surface for area chart
+   */
+  async createSurface() {
+    if (!this.container) {
+      throw new Error("Container not set");
+    }
+    const sciChartTheme = getSciChartTheme3(this.config.theme);
+    if (!this.container.id) {
+      this.container.id = this.id;
+    }
+    const { sciChartSurface, wasmContext } = await SciChartSurface.create(
+      this.container,
+      {
+        theme: sciChartTheme
+      }
+    );
+    this.surface = sciChartSurface;
+    this.wasmContext = wasmContext;
+    const xAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.xAxis?.title,
+      drawMajorGridLines: this.config.xAxis?.gridLines?.show ?? true,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      autoRange: EAutoRange.Always
+    });
+    const yAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.yAxis?.title,
+      drawMajorGridLines: this.config.yAxis?.gridLines?.show ?? true,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      autoRange: EAutoRange.Always,
+      growBy: new NumberRange(0, 0.1)
+    });
+    if (this.config.xAxis?.min !== void 0 && this.config.xAxis?.max !== void 0) {
+      xAxis.visibleRange = new NumberRange(this.config.xAxis.min, this.config.xAxis.max);
+      xAxis.autoRange = EAutoRange.Never;
+    }
+    if (this.config.yAxis?.min !== void 0 && this.config.yAxis?.max !== void 0) {
+      yAxis.visibleRange = new NumberRange(this.config.yAxis.min, this.config.yAxis.max);
+      yAxis.autoRange = EAutoRange.Never;
+    }
+    sciChartSurface.xAxes.add(xAxis);
+    sciChartSurface.yAxes.add(yAxis);
+    if (this.config.tooltip?.enabled !== false) {
+      sciChartSurface.chartModifiers.add(
+        new RolloverModifier({
+          showTooltip: true,
+          showAxisLabel: true
+        })
+      );
+    }
+    sciChartSurface.chartModifiers.add(new ZoomPanModifier());
+    sciChartSurface.chartModifiers.add(new MouseWheelZoomModifier());
+    this.addSeries(this.config.series);
+  }
+  /**
+   * Add series to the chart
+   */
+  addSeries(seriesConfigs) {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    const colorPalette = this.theme.colorPalette ?? [];
+    const fillOpacity = this.config.fillOpacity ?? 0.5;
+    seriesConfigs.forEach((seriesConfig, index) => {
+      const data = normalizeDataPoints(seriesConfig.data);
+      const xValues = extractXValues(data);
+      const yValues = extractYValues(data);
+      const dataSeries = new XyDataSeries(wasmContext, {
+        xValues,
+        yValues,
+        dataSeriesName: seriesConfig.name
+      });
+      this.dataSeries.set(seriesConfig.name, dataSeries);
+      const color = seriesConfig.color ?? colorPalette[index % colorPalette.length] ?? "#6366f1";
+      const areaSeries = new FastMountainRenderableSeries(wasmContext, {
+        dataSeries,
+        stroke: color,
+        strokeThickness: this.config.lineWidth ?? 2,
+        fill: hexToRgba(color, fillOpacity),
+        ...this.config.animation !== false && {
+          animation: new SweepAnimation({
+            duration: typeof this.config.animation === "object" ? this.config.animation.duration ?? 500 : 500
+          })
+        }
+      });
+      areaSeries.fillLinearGradient = new GradientParams(
+        new Point(0, 0),
+        new Point(0, 1),
+        [
+          { color: hexToRgba(color, fillOpacity), offset: 0 },
+          { color: hexToRgba(color, 0.05), offset: 1 }
+        ]
+      );
+      this.renderableSeries.push(areaSeries);
+      this.surface.renderableSeries.add(areaSeries);
+    });
+  }
+  /**
+   * Set new data for the chart
+   */
+  setData(data) {
+    if (!this.surface) {
+      this.config.series = data;
+      return;
+    }
+    this.clearSeries();
+    this.config.series = data;
+    this.addSeries(data);
+  }
+  /**
+   * Update specific series data
+   */
+  updateSeriesData(seriesName, data) {
+    const dataSeries = this.dataSeries.get(seriesName);
+    if (!dataSeries) {
+      console.warn(`Series "${seriesName}" not found`);
+      return;
+    }
+    const normalized = normalizeDataPoints(data);
+    const xValues = extractXValues(normalized);
+    const yValues = extractYValues(normalized);
+    dataSeries.clear();
+    dataSeries.appendRange(xValues, yValues);
+  }
+  /**
+   * Clear all series
+   */
+  clearSeries() {
+    if (!this.surface) return;
+    this.renderableSeries.forEach((series) => {
+      this.surface.renderableSeries.remove(series);
+      series.delete();
+    });
+    this.renderableSeries = [];
+    this.dataSeries.forEach((ds) => ds.delete());
+    this.dataSeries.clear();
+  }
+  /**
+   * Update chart
+   */
+  update() {
+    if (!this.surface) return;
+    this.applyTheme();
+    this.surface.invalidateElement();
+  }
+  /**
+   * Destroy and clean up
+   */
+  destroy() {
+    this.clearSeries();
+    super.destroy();
+  }
+};
+async function createAreaChart(container, config) {
+  const chart = new AreaChart(config);
+  await chart.init(container);
+  return chart;
+}
+function getSciChartTheme4(themeName) {
+  switch (themeName) {
+    case "light":
+      return new SciChartJSLightTheme();
+    case "dark":
+    case "modern":
+    case "midnight":
+    default:
+      return new SciChartJSDarkTheme();
+  }
+}
+var defaultColorStops = [
+  { offset: 0, color: "#000080" },
+  // Dark blue
+  { offset: 0.2, color: "#0000ff" },
+  // Blue
+  { offset: 0.4, color: "#00ffff" },
+  // Cyan
+  { offset: 0.6, color: "#00ff00" },
+  // Green
+  { offset: 0.8, color: "#ffff00" },
+  // Yellow
+  { offset: 1, color: "#ff0000" }
+  // Red
+];
+var HeatmapChart = class extends BaseChart {
+  constructor(config) {
+    super(config);
+    this.heatmapDataSeries = null;
+    this.heatmapSeries = null;
+    this.wasmContext = null;
+  }
+  /**
+   * Create the SciChart surface for heatmap chart
+   */
+  async createSurface() {
+    if (!this.container) {
+      throw new Error("Container not set");
+    }
+    const sciChartTheme = getSciChartTheme4(this.config.theme);
+    if (!this.container.id) {
+      this.container.id = this.id;
+    }
+    const { sciChartSurface, wasmContext } = await SciChartSurface.create(
+      this.container,
+      {
+        theme: sciChartTheme
+      }
+    );
+    this.surface = sciChartSurface;
+    this.wasmContext = wasmContext;
+    const xAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.xAxis?.title,
+      drawMajorGridLines: this.config.xAxis?.gridLines?.show ?? false,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      autoRange: EAutoRange.Always
+    });
+    const yAxis = new NumericAxis(wasmContext, {
+      axisTitle: this.config.yAxis?.title,
+      drawMajorGridLines: this.config.yAxis?.gridLines?.show ?? false,
+      drawMinorGridLines: false,
+      axisTitleStyle: {
+        fontSize: 14,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.titleColor
+      },
+      labelStyle: {
+        fontSize: 12,
+        fontFamily: this.theme.fontFamily,
+        color: this.theme.axis?.labelColor
+      },
+      autoRange: EAutoRange.Always
+    });
+    if (this.config.xAxis?.min !== void 0 && this.config.xAxis?.max !== void 0) {
+      xAxis.visibleRange = new NumberRange(this.config.xAxis.min, this.config.xAxis.max);
+      xAxis.autoRange = EAutoRange.Never;
+    }
+    if (this.config.yAxis?.min !== void 0 && this.config.yAxis?.max !== void 0) {
+      yAxis.visibleRange = new NumberRange(this.config.yAxis.min, this.config.yAxis.max);
+      yAxis.autoRange = EAutoRange.Never;
+    }
+    sciChartSurface.xAxes.add(xAxis);
+    sciChartSurface.yAxes.add(yAxis);
+    if (this.config.tooltip?.enabled !== false) {
+      sciChartSurface.chartModifiers.add(
+        new RolloverModifier({
+          showTooltip: true,
+          showAxisLabel: true
+        })
+      );
+    }
+    sciChartSurface.chartModifiers.add(new ZoomPanModifier());
+    sciChartSurface.chartModifiers.add(new MouseWheelZoomModifier());
+    this.addHeatmapData(this.config.zValues);
+  }
+  /**
+   * Add heatmap data to the chart
+   */
+  addHeatmapData(zValues) {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    let min = this.config.colorMin;
+    let max = this.config.colorMax;
+    if (min === void 0 || max === void 0) {
+      const flatValues = zValues.flat();
+      min = min ?? Math.min(...flatValues);
+      max = max ?? Math.max(...flatValues);
+    }
+    this.heatmapDataSeries = new UniformHeatmapDataSeries(wasmContext, {
+      zValues,
+      xStart: this.config.xStart ?? 0,
+      xStep: this.config.xStep ?? 1,
+      yStart: this.config.yStart ?? 0,
+      yStep: this.config.yStep ?? 1
+    });
+    const colorStops = this.config.colorStops ?? defaultColorStops;
+    this.heatmapSeries = new UniformHeatmapRenderableSeries(wasmContext, {
+      dataSeries: this.heatmapDataSeries,
+      colorMap: new HeatmapColorMap({
+        minimum: min,
+        maximum: max,
+        gradientStops: colorStops
+      })
+    });
+    this.surface.renderableSeries.add(this.heatmapSeries);
+  }
+  /**
+   * Set new data for the chart (for heatmap, this updates zValues)
+   */
+  setData(_data) {
+    console.warn("HeatmapChart.setData() - use setZValues() for updating heatmap data");
+  }
+  /**
+   * Set new z-values for the heatmap
+   */
+  setZValues(zValues) {
+    if (!this.surface) {
+      this.config.zValues = zValues;
+      return;
+    }
+    this.clearHeatmap();
+    this.config.zValues = zValues;
+    this.addHeatmapData(zValues);
+  }
+  /**
+   * Update specific cell values
+   */
+  updateCell(x, y, value) {
+    if (this.heatmapDataSeries) {
+      this.heatmapDataSeries.setZValue(x, y, value);
+    }
+  }
+  /**
+   * Clear heatmap data
+   */
+  clearHeatmap() {
+    if (!this.surface) return;
+    if (this.heatmapSeries) {
+      this.surface.renderableSeries.remove(this.heatmapSeries);
+      this.heatmapSeries.delete();
+      this.heatmapSeries = null;
+    }
+    if (this.heatmapDataSeries) {
+      this.heatmapDataSeries.delete();
+      this.heatmapDataSeries = null;
+    }
+  }
+  /**
+   * Update chart
+   */
+  update() {
+    if (!this.surface) return;
+    this.applyTheme();
+    this.surface.invalidateElement();
+  }
+  /**
+   * Destroy and clean up
+   */
+  destroy() {
+    this.clearHeatmap();
+    super.destroy();
+  }
+};
+async function createHeatmapChart(container, config) {
+  const chart = new HeatmapChart(config);
+  await chart.init(container);
+  return chart;
+}
+var defaultColorStops2 = [
+  { offset: 0, color: "#1e3a8a" },
+  // Dark blue
+  { offset: 0.25, color: "#3b82f6" },
+  // Blue
+  { offset: 0.5, color: "#22c55e" },
+  // Green
+  { offset: 0.75, color: "#eab308" },
+  // Yellow
+  { offset: 1, color: "#ef4444" }
+  // Red
+];
+var Surface3DChart = class {
+  constructor(config) {
+    this.container = null;
+    this.surface = null;
+    this.wasmContext = null;
+    this.dataSeries = null;
+    this.meshSeries = null;
+    this.isDestroyed = false;
+    this.id = config.id ?? generateId("chart3d");
+    this.config = config;
+  }
+  /**
+   * Initialize the chart in the given container
+   */
+  async init(container) {
+    if (this.isDestroyed) {
+      throw new Error("Cannot initialize a destroyed chart");
+    }
+    if (typeof container === "string") {
+      const el = document.getElementById(container);
+      if (!el) {
+        throw new Error(`Container element "${container}" not found`);
+      }
+      this.container = el;
+    } else {
+      this.container = container;
+    }
+    if (!this.container.id) {
+      this.container.id = this.id;
+    }
+    await this.createSurface();
+  }
+  /**
+   * Create the SciChart 3D surface
+   */
+  async createSurface() {
+    if (!this.container) {
+      throw new Error("Container not set");
+    }
+    const { sciChart3DSurface, wasmContext } = await SciChart3DSurface.create(
+      this.container.id
+    );
+    this.surface = sciChart3DSurface;
+    this.wasmContext = wasmContext;
+    sciChart3DSurface.xAxis = new NumericAxis3D(wasmContext, {
+      axisTitle: "X"
+    });
+    sciChart3DSurface.yAxis = new NumericAxis3D(wasmContext, {
+      axisTitle: "Y"
+    });
+    sciChart3DSurface.zAxis = new NumericAxis3D(wasmContext, {
+      axisTitle: "Z"
+    });
+    sciChart3DSurface.chartModifiers.add(new MouseWheelZoomModifier3D());
+    sciChart3DSurface.chartModifiers.add(new OrbitModifier3D());
+    const cameraPos = this.config.cameraPosition ?? { x: 300, y: 300, z: 300 };
+    sciChart3DSurface.camera = new CameraController(wasmContext, {
+      position: new Vector3(cameraPos.x, cameraPos.y, cameraPos.z),
+      target: new Vector3(0, 0, 0)
+    });
+    this.addSurfaceData(this.config.yValues);
+  }
+  /**
+   * Add surface data to the chart
+   */
+  addSurfaceData(yValues) {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    const zSize = yValues.length;
+    const xSize = yValues[0]?.length ?? 0;
+    let min = Infinity;
+    let max = -Infinity;
+    for (let z = 0; z < zSize; z++) {
+      for (let x = 0; x < xSize; x++) {
+        const y = yValues[z][x];
+        min = Math.min(min, y);
+        max = Math.max(max, y);
+      }
+    }
+    this.dataSeries = new UniformGridDataSeries3D(wasmContext, {
+      yValues,
+      xStep: this.config.xStep ?? 1,
+      zStep: this.config.zStep ?? 1
+    });
+    const colorStops = this.config.colorStops ?? defaultColorStops2;
+    const colorPalette = new GradientColorPalette(wasmContext, {
+      gradientStops: colorStops
+    });
+    this.meshSeries = new SurfaceMeshRenderableSeries3D(wasmContext, {
+      dataSeries: this.dataSeries,
+      minimum: this.config.colorMin ?? min,
+      maximum: this.config.colorMax ?? max,
+      opacity: this.config.opacity ?? 1,
+      cellHardnessFactor: 0,
+      // Smooth interpolation between cells
+      stroke: "transparent",
+      // No wireframe stroke
+      strokeThickness: 0,
+      contourStroke: "transparent",
+      // No contour lines
+      contourStrokeThickness: 0,
+      drawSkirt: true,
+      // Draw skirt for solid appearance
+      drawMeshAs: EDrawMeshAs.SOLID_MESH,
+      // Solid filled surface
+      lightingFactor: 0.8,
+      meshColorPalette: colorPalette,
+      shininess: 10
+    });
+    this.surface.renderableSeries.add(this.meshSeries);
+  }
+  /**
+   * Set new Y values for the surface
+   */
+  setYValues(yValues) {
+    if (!this.surface) {
+      this.config.yValues = yValues;
+      return;
+    }
+    this.clearSurface();
+    this.config.yValues = yValues;
+    this.addSurfaceData(yValues);
+  }
+  /**
+   * Set new data (alias for setYValues for consistency)
+   */
+  setData(_data) {
+    console.warn("Surface3DChart.setData() - use setYValues() for updating surface data");
+  }
+  /**
+   * Update chart options
+   */
+  setOptions(options) {
+    this.config = { ...this.config, ...options };
+    if (options.cameraPosition && this.surface && this.wasmContext) {
+      const pos = options.cameraPosition;
+      this.surface.camera = new CameraController(this.wasmContext, {
+        position: new Vector3(pos.x, pos.y, pos.z),
+        target: new Vector3(0, 0, 0)
+      });
+    }
+  }
+  /**
+   * Clear surface data
+   */
+  clearSurface() {
+    if (!this.surface) return;
+    if (this.meshSeries) {
+      this.surface.renderableSeries.remove(this.meshSeries);
+      this.meshSeries.delete();
+      this.meshSeries = null;
+    }
+    if (this.dataSeries) {
+      this.dataSeries.delete();
+      this.dataSeries = null;
+    }
+  }
+  /**
+   * Destroy and clean up
+   */
+  destroy() {
+    if (this.isDestroyed) return;
+    this.clearSurface();
+    if (this.surface) {
+      this.surface.delete();
+      this.surface = null;
+    }
+    this.isDestroyed = true;
+  }
+  /**
+   * Get current configuration
+   */
+  getConfig() {
+    return { ...this.config };
+  }
+  /**
+   * Check if chart is ready (initialized and not destroyed)
+   */
+  isReady() {
+    return this.surface !== null && !this.isDestroyed;
+  }
+};
+async function createSurface3DChart(container, config) {
+  const chart = new Surface3DChart(config);
+  await chart.init(container);
+  return chart;
+}
+var Column3DChart = class {
+  constructor(config) {
+    this.container = null;
+    this.surface = null;
+    this.wasmContext = null;
+    this.dataSeries = null;
+    this.columnSeries = null;
+    this.isDestroyed = false;
+    this.id = config.id ?? generateId("column3d");
+    this.config = config;
+  }
+  /**
+   * Initialize the chart in the given container
+   */
+  async init(container) {
+    if (this.isDestroyed) {
+      throw new Error("Cannot initialize a destroyed chart");
+    }
+    if (typeof container === "string") {
+      const el = document.getElementById(container);
+      if (!el) {
+        throw new Error(`Container element "${container}" not found`);
+      }
+      this.container = el;
+    } else {
+      this.container = container;
+    }
+    if (!this.container.id) {
+      this.container.id = this.id;
+    }
+    await this.createSurface();
+  }
+  /**
+   * Create the SciChart 3D surface
+   */
+  async createSurface() {
+    if (!this.container) {
+      throw new Error("Container not set");
+    }
+    const { sciChart3DSurface, wasmContext } = await SciChart3DSurface.create(
+      this.container.id,
+      {
+        isZYPlaneVisible: false
+      }
+    );
+    this.surface = sciChart3DSurface;
+    this.wasmContext = wasmContext;
+    const cameraPos = this.config.cameraPosition ?? { x: -250, y: 450, z: 280 };
+    const cameraTarget = this.config.cameraTarget ?? { x: 0, y: 0, z: 0 };
+    sciChart3DSurface.camera = new CameraController(wasmContext, {
+      position: new Vector3(cameraPos.x, cameraPos.y, cameraPos.z),
+      target: new Vector3(cameraTarget.x, cameraTarget.y, cameraTarget.z)
+    });
+    sciChart3DSurface.chartModifiers.add(
+      new OrbitModifier3D(),
+      new MouseWheelZoomModifier3D()
+    );
+    const xRange = this.config.xRange ?? { min: 0, max: 360 };
+    const yRange = this.config.yRange ?? { min: 0, max: 5e3 };
+    const zRange = this.config.zRange ?? { min: 0, max: 50 };
+    const baseAxisOptions = {
+      drawMinorGridLines: false,
+      majorGridLineStyle: { color: "#7e7e7e" },
+      planeBorderThickness: 3
+    };
+    sciChart3DSurface.xAxis = new NumericAxis3D(wasmContext, {
+      ...baseAxisOptions,
+      axisTitle: this.config.xAxisTitle ?? "Phase Angle (\xB0)",
+      autoTicks: false,
+      visibleRange: new NumberRange(xRange.min, xRange.max),
+      majorDelta: 45,
+      minorDelta: 15,
+      flippedCoordinates: true,
+      axisBandsFill: "#d2d2d2"
+    });
+    sciChart3DSurface.yAxis = new NumericAxis3D(wasmContext, {
+      ...baseAxisOptions,
+      axisTitle: this.config.yAxisTitle ?? "Amplitude (mVp)",
+      visibleRange: new NumberRange(yRange.min, yRange.max),
+      axisBandsFill: "#b1b1b1"
+    });
+    sciChart3DSurface.zAxis = new NumericAxis3D(wasmContext, {
+      ...baseAxisOptions,
+      axisTitle: this.config.zAxisTitle ?? "Cycle",
+      majorDelta: 10,
+      minorDelta: 5,
+      visibleRange: new NumberRange(zRange.min, zRange.max),
+      axisBandsFill: "#d0d0d0",
+      labelPrecision: 0
+    });
+    this.addColumnData(this.config.data);
+    if (this.config.showSineWave !== false) {
+      this.addSineWave();
+    }
+    this.addTooltip();
+  }
+  /**
+   * Add column data to the chart
+   */
+  addColumnData(data) {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    this.dataSeries = new XyzDataSeries3D(wasmContext);
+    data.forEach(([x, y, z]) => {
+      this.dataSeries.append(x, y, z);
+    });
+    this.columnSeries = new ColumnRenderableSeries3D(wasmContext, {
+      dataSeries: this.dataSeries,
+      fill: this.config.barFill ?? "#52aaf2",
+      stroke: this.config.barStroke ?? "#52aaf2",
+      opacity: this.config.barOpacity ?? 0.95,
+      dataPointWidthX: this.config.barWidthX ?? 8,
+      dataPointWidthZ: this.config.barWidthZ ?? 8
+    });
+    this.surface.renderableSeries.add(this.columnSeries);
+  }
+  /**
+   * Add sine wave reference line on back plane
+   */
+  addSineWave() {
+    if (!this.surface || !this.wasmContext) return;
+    const wasmContext = this.wasmContext;
+    const sineData = new XyzDataSeries3D(wasmContext);
+    const backPlaneZ = 0;
+    const center = this.config.sineWaveCenter ?? 2e3;
+    const amplitude = this.config.sineWaveAmplitude ?? 2e3;
+    for (let deg = 0; deg <= 360; deg += 5) {
+      const rad = deg * Math.PI / 180;
+      const y = center + amplitude * Math.sin(rad);
+      sineData.append(deg, y, backPlaneZ);
+    }
+    const sineSeries = new PointLineRenderableSeries3D(wasmContext, {
+      dataSeries: sineData,
+      stroke: "black",
+      strokeThickness: 3,
+      opacity: 1
+    });
+    this.surface.renderableSeries.add(sineSeries);
+  }
+  /**
+   * Add tooltip modifier
+   */
+  addTooltip() {
+    if (!this.surface) return;
+    const xTitle = this.config.xAxisTitle ?? "Phase Angle";
+    const yTitle = this.config.yAxisTitle ?? "Amplitude";
+    const zTitle = this.config.zAxisTitle ?? "Cycle";
+    const tooltipModifier = new TooltipModifier3D({
+      tooltipDataTemplate: (seriesInfo) => {
+        const valuesWithLabels = [];
+        if (seriesInfo && seriesInfo.isHit) {
+          valuesWithLabels.push(`${xTitle}: ${seriesInfo.xValue}`);
+          valuesWithLabels.push(`${yTitle}: ${seriesInfo.yValue}`);
+          valuesWithLabels.push(`${zTitle}: ${seriesInfo.zValue}`);
+        }
+        return valuesWithLabels;
+      }
+    });
+    this.surface.chartModifiers.add(tooltipModifier);
+  }
+  /**
+   * Set new data for the chart
+   */
+  setData(data) {
+    if (!this.dataSeries) {
+      this.config.data = data;
+      return;
+    }
+    this.dataSeries.clear();
+    data.forEach(([x, y, z]) => {
+      this.dataSeries.append(x, y, z);
+    });
+    if (this.surface) {
+      this.surface.invalidateElement();
+    }
+  }
+  /**
+   * Update camera position
+   */
+  setCameraPosition(position, target) {
+    if (!this.surface || !this.wasmContext) return;
+    this.surface.camera.position = new Vector3(position.x, position.y, position.z);
+    if (target) {
+      this.surface.camera.target = new Vector3(target.x, target.y, target.z);
+    }
+    this.surface.invalidateElement();
+  }
+  /**
+   * Update chart options
+   */
+  setOptions(options) {
+    this.config = { ...this.config, ...options };
+    if (options.cameraPosition && this.surface && this.wasmContext) {
+      const pos = options.cameraPosition;
+      const target = options.cameraTarget ?? { x: 0, y: 0, z: 0 };
+      this.setCameraPosition(pos, target);
+    }
+    if (options.barFill || options.barStroke || options.barOpacity) {
+      if (this.columnSeries) {
+        if (options.barFill) this.columnSeries.fill = options.barFill;
+        if (options.barStroke) this.columnSeries.stroke = options.barStroke;
+        if (options.barOpacity !== void 0) this.columnSeries.opacity = options.barOpacity;
+      }
+    }
+  }
+  /**
+   * Get the SciChart surface for advanced operations
+   */
+  getSurface() {
+    return this.surface;
+  }
+  /**
+   * Destroy and clean up
+   */
+  destroy() {
+    if (this.isDestroyed) return;
+    if (this.surface) {
+      this.surface.delete();
+      this.surface = null;
+    }
+    this.isDestroyed = true;
+  }
+  /**
+   * Get current configuration
+   */
+  getConfig() {
+    return { ...this.config };
+  }
+  /**
+   * Check if chart is ready (initialized and not destroyed)
+   */
+  isReady() {
+    return this.surface !== null && !this.isDestroyed;
+  }
+};
+async function createColumn3DChart(container, config) {
+  const chart = new Column3DChart(config);
+  await chart.init(container);
+  return chart;
+}
+var VERSION = "0.1.0";
+function configureSciChart(options) {
+  if (options.wasmUrl || options.dataUrl) {
+    const { SciChartSurface: SciChartSurface6 } = __require("scichart");
+    SciChartSurface6.configure({
+      wasmUrl: options.wasmUrl,
+      dataUrl: options.dataUrl
+    });
+  }
+}
+
+export { AreaChart, BarChart, BaseChart, Column3DChart, HeatmapChart, LineChart, Surface3DChart, VERSION, calculateDataRange, clamp, configureSciChart, createAreaChart, createBarChart, createColumn3DChart, createHeatmapChart, createLineChart, createSurface3DChart, debounce, deepMerge, extractXValues, extractYValues, formatNumber, generateId, hexToRgba, lerp, normalizeDataPoints, parseSize, throttle };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map