@tetrascience-npm/tetrascience-react-ui 0.7.0-beta.106.1 → 0.7.0-beta.108.1

package/dist/components/charts/ChromatogramChart/ChromatogramChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChromatogramChart.js","sources":["../../../../src/components/charts/ChromatogramChart/ChromatogramChart.tsx"],"sourcesContent":["import Plotly from \"plotly.js-dist\";\nimport React, { useEffect, useMemo, useRef } from \"react\";\n\nimport { seriesColor } from \"../../../utils/colors\";\nimport { useChartTooltip } from \"../ChartTooltip\";\n\nimport {\n  groupOverlappingPeaks,\n  createGroupAnnotations,\n} from \"./annotations\";\nimport { createBoundaryMarkerTraces } from \"./boundaryMarkers\";\nimport { CHROMATOGRAM_LAYOUT } from \"./constants\";\nimport {\n  validateSeriesData,\n  applyBaselineCorrection,\n  collectPeaksWithBoundaryData,\n  processUserAnnotations,\n} from \"./dataProcessing\";\nimport { detectPeaks } from \"./peakDetection\";\n\nimport type {\n  ChromatogramSeries,\n  PeakAnnotation,\n  BaselineCorrectionMethod,\n  BoundaryMarkerStyle,\n  BoundaryMarkerType,\n  PeakDetectionOptions,\n  ChromatogramChartProps,\n  PeakWithMeta,\n} from \"./types\";\n\nimport { usePlotlyTheme } from \"@/hooks/use-plotly-theme\";\n\n// Re-export types for external use\nexport type {\n  ChromatogramSeries,\n  PeakAnnotation,\n  BaselineCorrectionMethod,\n  BoundaryMarkerStyle,\n  BoundaryMarkerType,\n  PeakDetectionOptions,\n  ChromatogramChartProps,\n};\n\n\n// Stable default so the no-annotations case keeps a constant identity; an\n// inline `[]` default would change every render, re-running the plot effect\n// (and tearing down the hover tooltip) on each re-render.\nconst EMPTY_ANNOTATIONS: PeakAnnotation[] = [];\n\nconst ChromatogramChart: React.FC<ChromatogramChartProps> = ({\n  series,\n  width = 900,\n  height = 500,\n  title,\n  xAxisTitle = \"Retention Time (min)\",\n  yAxisTitle = \"Signal (mAU)\",\n  annotations = EMPTY_ANNOTATIONS,\n  xRange,\n  yRange,\n  showLegend = true,\n  showGridX = true,\n  showGridY = true,\n  showMarkers = false,\n  markerSize = 4,\n  showCrosshairs = false,\n  baselineCorrection = \"none\",\n  baselineWindowSize = 50,\n  peakDetectionOptions,\n  showPeakAreas = false,\n  boundaryMarkers = \"none\",\n  annotationOverlapThreshold = 0.4,\n  showExportButton = true,\n}) => {\n  // Derive peak detection state from options\n  const enablePeakDetection = peakDetectionOptions !== undefined;\n  const plotRef = useRef<HTMLDivElement>(null);\n  const theme = usePlotlyTheme();\n  const { bindTooltip, tooltipElement } = useChartTooltip({\n    xLabel: xAxisTitle,\n    yLabel: yAxisTitle,\n  });\n\n  // Memoize processed series with baseline correction\n  const processedSeries = useMemo(() => {\n    return series.map((s) => {\n      const validated = validateSeriesData(s.x, s.y);\n      return {\n        ...s,\n        x: validated.x,\n        y: applyBaselineCorrection(validated.y, baselineCorrection, baselineWindowSize),\n      };\n    });\n  }, [series, baselineCorrection, baselineWindowSize]);\n\n  // Process user annotations to convert startX/endX to indices and compute areas\n  const processedAnnotations = useMemo(() => {\n    if (annotations.length === 0 || processedSeries.length === 0) {\n      return annotations;\n    }\n    // Use first series data for index lookup (user annotations apply to first series)\n    const { x, y } = processedSeries[0];\n    return processUserAnnotations(annotations, x, y);\n  }, [annotations, processedSeries]);\n\n  // Memoize peak detection results\n  const allDetectedPeaks = useMemo(() => {\n    const peaks: { peaks: PeakAnnotation[]; seriesIndex: number }[] = [];\n    if (enablePeakDetection && peakDetectionOptions) {\n      processedSeries.forEach((s, index) => {\n        const detected = detectPeaks(s.x, s.y, peakDetectionOptions);\n        if (detected.length > 0) {\n          peaks.push({ peaks: detected, seriesIndex: index });\n        }\n      });\n    }\n    return peaks;\n  }, [processedSeries, enablePeakDetection, peakDetectionOptions]);\n\n  useEffect(() => {\n    const currentRef = plotRef.current;\n    if (!currentRef || series.length === 0) return;\n\n    // Build trace data with auto-assigned colors\n    const plotData: Plotly.Data[] = processedSeries.map((s, index) => {\n      const traceColor = seriesColor(index, s.color);\n\n      const trace: Plotly.Data = {\n        x: s.x,\n        y: s.y,\n        type: \"scatter\" as const,\n        mode: showMarkers ? \"lines+markers\" as const : \"lines\" as const,\n        name: s.name,\n        line: {\n          color: traceColor,\n          width: 1.5,\n        },\n        hoverinfo: \"none\" as const,\n      };\n      if (showMarkers) {\n        trace.marker = {\n          size: markerSize,\n          color: traceColor,\n        };\n      }\n      return trace;\n    });\n\n    // Add peak boundary markers if enabled\n    if (boundaryMarkers !== \"none\") {\n      const peaksWithData = collectPeaksWithBoundaryData(allDetectedPeaks, processedAnnotations, processedSeries);\n      if (peaksWithData.length > 0) {\n        const boundaryTraces = createBoundaryMarkerTraces(peaksWithData);\n        plotData.push(...boundaryTraces);\n      }\n    }\n\n    // Collect all peaks for unified staggering logic\n    const allPeaksWithMeta: PeakWithMeta[] = [];\n\n    // Add user-defined annotations (seriesIndex -1 indicates user-defined)\n    processedAnnotations.forEach((ann) => {\n      allPeaksWithMeta.push({ peak: ann, seriesIndex: -1 });\n    });\n\n    // Add auto-detected peaks if enabled\n    if (showPeakAreas && enablePeakDetection) {\n      allDetectedPeaks.forEach(({ peaks, seriesIndex }) => {\n        peaks.forEach((peak) => {\n          allPeaksWithMeta.push({ peak, seriesIndex });\n        });\n      });\n    }\n\n    // Group all overlapping peaks and create annotations with staggering\n    const groups = groupOverlappingPeaks(allPeaksWithMeta, annotationOverlapThreshold);\n    const plotlyAnnotations: Partial<Plotly.Annotations>[] = [];\n\n    for (const group of groups) {\n      plotlyAnnotations.push(...createGroupAnnotations(group));\n    }\n\n    const layout: Partial<Plotly.Layout> = {\n      title: title\n        ? {\n            text: title,\n            font: {\n              size: 20,\n              family: \"Inter, sans-serif\",\n              color: theme.textColor,\n            },\n          }\n        : undefined,\n      width,\n      height,\n      margin: {\n        l: CHROMATOGRAM_LAYOUT.MARGIN_LEFT,\n        r: CHROMATOGRAM_LAYOUT.MARGIN_RIGHT,\n        b: CHROMATOGRAM_LAYOUT.MARGIN_BOTTOM,\n        t: title ? CHROMATOGRAM_LAYOUT.MARGIN_TOP_WITH_TITLE : CHROMATOGRAM_LAYOUT.MARGIN_TOP_NO_TITLE,\n        pad: CHROMATOGRAM_LAYOUT.MARGIN_PAD,\n      },\n      paper_bgcolor: theme.paperBg,\n      plot_bgcolor: theme.plotBg,\n      font: { family: \"Inter, sans-serif\" },\n      hovermode: showCrosshairs ? \"x\" as const : \"x unified\" as const,\n      dragmode: \"zoom\" as const,\n      xaxis: {\n        title: {\n          text: xAxisTitle,\n          font: { size: 14, color: theme.textSecondary, family: \"Inter, sans-serif\" },\n          standoff: 15,\n        },\n        showgrid: showGridX,\n        gridcolor: theme.gridColor,\n        linecolor: theme.lineColor,\n        linewidth: 1,\n        range: xRange,\n        autorange: !xRange,\n        zeroline: false,\n        tickfont: { size: 12, color: theme.textColor, family: \"Inter, sans-serif\" },\n        showspikes: showCrosshairs,\n        spikemode: \"across\" as const,\n        spikesnap: \"cursor\" as const,\n        spikecolor: theme.spikeColor,\n        spikethickness: 1,\n        spikedash: \"dot\" as const,\n      },\n      yaxis: {\n        title: {\n          text: yAxisTitle,\n          font: { size: 14, color: theme.textSecondary, family: \"Inter, sans-serif\" },\n          standoff: 10,\n        },\n        showgrid: showGridY,\n        gridcolor: theme.gridColor,\n        linecolor: theme.lineColor,\n        linewidth: 1,\n        range: yRange,\n        autorange: !yRange,\n        zeroline: false,\n        tickfont: { size: 12, color: theme.textColor, family: \"Inter, sans-serif\" },\n        showspikes: showCrosshairs,\n        spikemode: \"across\" as const,\n        spikesnap: \"cursor\" as const,\n        spikecolor: theme.spikeColor,\n        spikethickness: 1,\n        spikedash: \"dot\" as const,\n      },\n      legend: {\n        x: 0.5,\n        y: -0.15,\n        xanchor: \"center\" as const,\n        yanchor: \"top\" as const,\n        orientation: \"h\" as const,\n        font: { size: 12, color: theme.textColor, family: \"Inter, sans-serif\" },\n      },\n      showlegend: showLegend && series.length > 1,\n      annotations: plotlyAnnotations,\n    };\n\n    const config: Partial<Plotly.Config> = {\n      responsive: true,\n      displayModeBar: true,\n      displaylogo: false,\n      modeBarButtonsToRemove: [\n        \"lasso2d\",\n        \"select2d\",\n        ...(showExportButton ? [] : [\"toImage\"] as Plotly.ModeBarDefaultButtons[]),\n      ] as Plotly.ModeBarDefaultButtons[],\n      ...(showExportButton && {\n        toImageButtonOptions: {\n          format: \"png\",\n          filename: \"chromatogram\",\n          width: width,\n          height: height,\n        },\n      }),\n    };\n\n    Plotly.newPlot(currentRef, plotData, layout, config);\n    bindTooltip(currentRef);\n\n    return () => {\n      if (currentRef) {\n        Plotly.purge(currentRef);\n      }\n    };\n  }, [\n    processedSeries, allDetectedPeaks, series.length, width, height, title, xAxisTitle, yAxisTitle,\n    processedAnnotations, xRange, yRange, showLegend, showGridX, showGridY, showMarkers, markerSize,\n    showCrosshairs, enablePeakDetection, peakDetectionOptions, showPeakAreas, boundaryMarkers,\n    annotationOverlapThreshold, showExportButton, theme, bindTooltip,\n  ]);\n\n  return (\n    <div className=\"chromatogram-chart-container relative\">\n      <div ref={plotRef} style={{ width: \"100%\", height: \"100%\" }} />\n      {tooltipElement}\n    </div>\n  );\n};\n\nexport { ChromatogramChart };\n\n"],"names":["EMPTY_ANNOTATIONS","ChromatogramChart","series","width","height","title","xAxisTitle","yAxisTitle","annotations","xRange","yRange","showLegend","showGridX","showGridY","showMarkers","markerSize","showCrosshairs","baselineCorrection","baselineWindowSize","peakDetectionOptions","showPeakAreas","boundaryMarkers","annotationOverlapThreshold","showExportButton","enablePeakDetection","plotRef","useRef","theme","usePlotlyTheme","bindTooltip","tooltipElement","useChartTooltip","processedSeries","useMemo","s","validated","validateSeriesData","applyBaselineCorrection","processedAnnotations","x","y","processUserAnnotations","allDetectedPeaks","peaks","index","detected","detectPeaks","useEffect","currentRef","plotData","traceColor","seriesColor","trace","peaksWithData","collectPeaksWithBoundaryData","boundaryTraces","createBoundaryMarkerTraces","allPeaksWithMeta","ann","seriesIndex","peak","groups","groupOverlappingPeaks","plotlyAnnotations","group","createGroupAnnotations","layout","CHROMATOGRAM_LAYOUT","config","Plotly","jsxs","jsx"],"mappings":"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"}
+{"version":3,"file":"ChromatogramChart.js","sources":["../../../../src/components/charts/ChromatogramChart/ChromatogramChart.tsx"],"sourcesContent":["import Plotly from \"plotly.js-dist\";\nimport React, { useEffect, useMemo, useRef } from \"react\";\n\nimport { useChartTooltip } from \"../ChartTooltip\";\n\nimport {\n  groupOverlappingPeaks,\n  createGroupAnnotations,\n  resolveSelectionAppearance,\n} from \"./annotations\";\nimport {\n  validateSeriesData,\n  applyBaselineCorrection,\n  processUserAnnotations,\n} from \"./dataProcessing\";\nimport { detectPeaks } from \"./peakDetection\";\nimport {\n  buildTraceData,\n  buildLayout,\n  buildConfig,\n  createHoverHandler,\n  createUnhoverHandler,\n} from \"./plotBuilder\";\n\nimport type {\n  ChromatogramSeries,\n  PeakAnnotation,\n  PeakSelectEvent,\n  PeakSelectionAppearance,\n  BaselineCorrectionMethod,\n  BoundaryMarkerStyle,\n  BoundaryMarkerType,\n  PeakDetectionOptions,\n  ChromatogramChartProps,\n  PeakWithMeta,\n} from \"./types\";\n\nimport { EmptyState } from \"@/components/composed/EmptyState\";\nimport { usePlotlyTheme } from \"@/hooks/use-plotly-theme\";\n\n// Re-export types for external use\nexport type {\n  ChromatogramSeries,\n  PeakAnnotation,\n  PeakSelectEvent,\n  PeakSelectionAppearance,\n  BaselineCorrectionMethod,\n  BoundaryMarkerStyle,\n  BoundaryMarkerType,\n  PeakDetectionOptions,\n  ChromatogramChartProps,\n};\n\n\n// Stable default so the no-annotations case keeps a constant identity; an\n// inline `[]` default would change every render, re-running the plot effect\n// (and tearing down the hover tooltip) on each re-render.\nconst EMPTY_ANNOTATIONS: PeakAnnotation[] = [];\n\nconst ChromatogramChart: React.FC<ChromatogramChartProps> = ({\n  series,\n  width = 900,\n  height = 500,\n  title,\n  xAxisTitle = \"Retention Time (min)\",\n  yAxisTitle = \"Signal (mAU)\",\n  annotations = EMPTY_ANNOTATIONS,\n  xRange,\n  yRange,\n  showLegend = true,\n  showGridX = true,\n  showGridY = true,\n  showMarkers = false,\n  markerSize = 4,\n  showCrosshairs = false,\n  baselineCorrection = \"none\",\n  baselineWindowSize = 50,\n  peakDetectionOptions,\n  showPeakAreas = false,\n  boundaryMarkers = \"none\",\n  annotationOverlapThreshold = 0.4,\n  showExportButton = true,\n  selectedPeakIds,\n  onPeakClick,\n  onPeakHover,\n  selectionAppearance,\n  annotationStyle = \"arrow\",\n  titleFontSize = 20,\n  titleTopMargin,\n}) => {\n  const enablePeakDetection = peakDetectionOptions !== undefined;\n  const plotRef = useRef<HTMLDivElement>(null);\n  const theme = usePlotlyTheme();\n  const { bindTooltip, tooltipElement } = useChartTooltip({\n    xLabel: xAxisTitle,\n    yLabel: yAxisTitle,\n  });\n  // Stable refs for callbacks — avoids including them in effect dep arrays\n  // (consumers often pass arrow functions that change identity every render).\n  const onPeakClickRef = useRef(onPeakClick);\n  const onPeakHoverRef = useRef(onPeakHover);\n  onPeakClickRef.current = onPeakClick;\n  onPeakHoverRef.current = onPeakHover;\n\n  // Tracks the series index whose line is currently thickened on hover.\n  const thickenedSeriesRef = useRef<number | null>(null);\n\n  // Holds the latest peak Plotly annotations so that closures in effects always\n  // read the latest selection-styled annotations.\n  const peakAnnotationsRef = useRef<Partial<Plotly.Annotations>[]>([]);\n\n  // Memoize processed series with baseline correction\n  const processedSeries = useMemo(() => {\n    return series.map((s) => {\n      const validated = validateSeriesData(s.x, s.y);\n      return {\n        ...s,\n        x: validated.x,\n        y: applyBaselineCorrection(validated.y, baselineCorrection, baselineWindowSize),\n      };\n    });\n  }, [series, baselineCorrection, baselineWindowSize]);\n\n  // Process user annotations to convert startX/endX to indices and compute areas\n  const processedAnnotations = useMemo(() => {\n    if (annotations.length === 0 || processedSeries.length === 0) {\n      return annotations;\n    }\n    const { x, y } = processedSeries[0];\n    return processUserAnnotations(annotations, x, y);\n  }, [annotations, processedSeries]);\n\n  // Memoize peak detection results\n  const allDetectedPeaks = useMemo(() => {\n    const peaks: { peaks: PeakAnnotation[]; seriesIndex: number }[] = [];\n    if (enablePeakDetection && peakDetectionOptions) {\n      processedSeries.forEach((s, index) => {\n        const detected = detectPeaks(s.x, s.y, peakDetectionOptions);\n        if (detected.length > 0) {\n          peaks.push({ peaks: detected, seriesIndex: index });\n        }\n      });\n    }\n    return peaks;\n  }, [processedSeries, enablePeakDetection, peakDetectionOptions]);\n\n  // Normalize the selection appearance into primitive fields up front so the\n  // memo below depends on stable values rather than the (possibly unstable)\n  // selectionAppearance object reference. This keeps the dependency array\n  // exhaustive-deps clean without requiring callers to memoize the prop.\n  const selectedBorderColor = selectionAppearance?.selected?.borderColor;\n  const selectedBackgroundColor = selectionAppearance?.selected?.backgroundColor;\n  const selectedBold = selectionAppearance?.selected?.bold;\n  const unselectedOpacity = selectionAppearance?.unselected?.opacity;\n  const hoverLineWidthMultiplier = selectionAppearance?.hoverLineWidthMultiplier;\n\n  // Resolve selection appearance defaults once (stable as long as the\n  // individual fields above don't change).\n  const resolvedAppearance = useMemo(\n    () =>\n      resolveSelectionAppearance({\n        selected: {\n          borderColor: selectedBorderColor,\n          backgroundColor: selectedBackgroundColor,\n          bold: selectedBold,\n        },\n        unselected: { opacity: unselectedOpacity },\n        hoverLineWidthMultiplier,\n      }),\n    [\n      selectedBorderColor,\n      selectedBackgroundColor,\n      selectedBold,\n      unselectedOpacity,\n      hoverLineWidthMultiplier,\n    ]\n  );\n\n  // All peaks that can be interacted with (clicked / hovered / selected),\n  // each with a stable ID and the metadata needed for PeakSelectEvent.\n  const allPeaksForInteraction = useMemo(() => {\n    const result: Array<{\n      peak: PeakAnnotation & { id: string };\n      seriesIndex: number;\n      seriesName: string;\n      isAutoDetected: boolean;\n    }> = [];\n\n    processedAnnotations.forEach((ann, i) => {\n      result.push({\n        peak: { ...ann, id: ann.id ?? `user-ann-${i}` },\n        seriesIndex: 0,\n        seriesName: series[0]?.name ?? \"\",\n        isAutoDetected: false,\n      });\n    });\n\n    allDetectedPeaks.forEach(({ peaks, seriesIndex }) => {\n      peaks.forEach((peak, peakIndex) => {\n        result.push({\n          peak: { ...peak, id: `peak-${seriesIndex}-${peakIndex}` },\n          seriesIndex,\n          seriesName: series[seriesIndex]?.name ?? `Series ${seriesIndex + 1}`,\n          isAutoDetected: true,\n        });\n      });\n    });\n\n    return result;\n  }, [processedAnnotations, allDetectedPeaks, series]);\n\n  // Build Plotly annotation objects for all peaks, applying selection styling.\n  // This memo re-runs when selectedPeakIds or resolvedAppearance changes so the\n  // selection effect can call Plotly.relayout with updated annotations without\n  // triggering a full chart rebuild.\n  const peakAnnotations = useMemo(() => {\n    const anySelected = (selectedPeakIds?.length ?? 0) > 0;\n    const options = {\n      selectedPeakIds: selectedPeakIds ?? [],\n      anySelected,\n      appearance: resolvedAppearance,\n      annotationStyle,\n    };\n\n    const allPeaksWithMeta: PeakWithMeta[] = [];\n\n    processedAnnotations.forEach((ann, i) => {\n      allPeaksWithMeta.push({\n        peak: { ...ann, id: ann.id ?? `user-ann-${i}` },\n        seriesIndex: -1,\n      });\n    });\n\n    if (showPeakAreas && enablePeakDetection) {\n      allDetectedPeaks.forEach(({ peaks, seriesIndex }) => {\n        peaks.forEach((peak, peakIndex) => {\n          allPeaksWithMeta.push({\n            peak: { ...peak, id: `peak-${seriesIndex}-${peakIndex}` },\n            seriesIndex,\n          });\n        });\n      });\n    }\n\n    const groups = groupOverlappingPeaks(allPeaksWithMeta, annotationOverlapThreshold);\n    const result: Partial<Plotly.Annotations>[] = [];\n    for (const group of groups) {\n      result.push(...createGroupAnnotations(group, options));\n    }\n    return result;\n  }, [\n    processedAnnotations,\n    allDetectedPeaks,\n    showPeakAreas,\n    enablePeakDetection,\n    annotationOverlapThreshold,\n    selectedPeakIds,\n    resolvedAppearance,\n    annotationStyle,\n  ]);\n\n  // Keep the ref in sync every render so that closures in effects always read\n  // the latest selection-styled annotations.\n  peakAnnotationsRef.current = peakAnnotations;\n\n  // ── Main chart effect ──────────────────────────────────────────────────────\n  // Rebuilds the full chart when structural props change (data, size, axes, …).\n  // selectedPeakIds and selectionAppearance are intentionally excluded from\n  // deps — selection changes are handled by the lightweight selection effect\n  // below via Plotly.relayout, which preserves the user's current zoom/pan.\n  useEffect(() => {\n    const currentRef = plotRef.current;\n    if (!currentRef || series.length === 0) return;\n\n    // Build trace data (line traces + boundary markers + region overlays +\n    // the invisible hit-area trace that carries peak customdata for\n    // click/hover interaction).\n    const plotData = buildTraceData({\n      processedSeries,\n      processedAnnotations,\n      allDetectedPeaks,\n      allPeaksForInteraction,\n      showMarkers,\n      markerSize,\n      xAxisTitle,\n      yAxisTitle,\n      boundaryMarkers,\n    });\n\n    const layout = buildLayout({\n      title,\n      titleFontSize,\n      titleTopMargin,\n      width,\n      height,\n      xAxisTitle,\n      yAxisTitle,\n      xRange,\n      yRange,\n      showLegend,\n      seriesCount: series.length,\n      showGridX,\n      showGridY,\n      showCrosshairs,\n      theme,\n      peakAnnotations: peakAnnotationsRef.current,\n    });\n\n    const config = buildConfig({ showExportButton, width, height });\n\n    Plotly.newPlot(currentRef, plotData, layout, config);\n    bindTooltip(currentRef);\n\n    // ── Event: peak click ──────────────────────────────────────────────────\n    (currentRef as unknown as Plotly.PlotlyHTMLElement).on(\n      \"plotly_click\",\n      (eventData: Plotly.PlotMouseEvent) => {\n        if (!onPeakClickRef.current) return;\n        const peakPoint = eventData.points.find((p) => p.customdata != null);\n        if (!peakPoint) return;\n        onPeakClickRef.current(peakPoint.customdata as unknown as PeakSelectEvent);\n      }\n    );\n\n    (currentRef as unknown as Plotly.PlotlyHTMLElement).on(\n      \"plotly_hover\",\n      createHoverHandler(currentRef, processedSeries.length, thickenedSeriesRef, onPeakHoverRef, resolvedAppearance.hoverLineWidthMultiplier)\n    );\n\n    (currentRef as unknown as Plotly.PlotlyHTMLElement).on(\n      \"plotly_unhover\",\n      createUnhoverHandler(currentRef, thickenedSeriesRef, onPeakHoverRef)\n    );\n\n    return () => {\n      thickenedSeriesRef.current = null;\n      if (currentRef) Plotly.purge(currentRef);\n    };\n  }, [\n    processedSeries, allDetectedPeaks, allPeaksForInteraction, series.length,\n    width, height, title, titleFontSize, titleTopMargin, xAxisTitle, yAxisTitle,\n    processedAnnotations, xRange, yRange, showLegend, showGridX, showGridY,\n    showMarkers, markerSize, showCrosshairs, enablePeakDetection, peakDetectionOptions,\n    showPeakAreas, boundaryMarkers, annotationOverlapThreshold, showExportButton,\n    theme, bindTooltip,\n    // resolvedAppearance included so hover multiplier stays in sync with the\n    // event handler closure without it being in a ref itself.\n    resolvedAppearance,\n  ]);\n\n  // ── Selection update effect ────────────────────────────────────────────────\n  // Runs when selectedPeakIds / selectionAppearance change (peakAnnotations\n  // recomputes). Uses Plotly.relayout so the user's zoom/pan state is preserved.\n  useEffect(() => {\n    const el = plotRef.current;\n    if (!el) return;\n    // Guard: skip if the chart hasn't been initialized by the main effect yet.\n    if (!(el as { _fullLayout?: unknown })._fullLayout) return;\n\n    Plotly.relayout(el, {\n      annotations: peakAnnotations,\n    } as unknown as Partial<Plotly.Layout>);\n  }, [peakAnnotations]);\n\n  // No data: render an explicit empty state instead of an uninitialized\n  // (blank) Plotly container, so the chart reads as \"no data yet\" rather\n  // than looking broken while data is still loading.\n  if (series.length === 0) {\n    return (\n      <div\n        className=\"chromatogram-chart-container relative flex items-center justify-center\"\n        style={{ width, height }}\n      >\n        <EmptyState\n          variant=\"no-data\"\n          title=\"No chromatogram data\"\n          description=\"There is no signal data to display yet.\"\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"chromatogram-chart-container relative\">\n      <div ref={plotRef} style={{ width: \"100%\", height: \"100%\" }} />\n      {tooltipElement}\n    </div>\n  );\n};\n\nexport { ChromatogramChart };\n"],"names":["EMPTY_ANNOTATIONS","ChromatogramChart","series","width","height","title","xAxisTitle","yAxisTitle","annotations","xRange","yRange","showLegend","showGridX","showGridY","showMarkers","markerSize","showCrosshairs","baselineCorrection","baselineWindowSize","peakDetectionOptions","showPeakAreas","boundaryMarkers","annotationOverlapThreshold","showExportButton","selectedPeakIds","onPeakClick","onPeakHover","selectionAppearance","annotationStyle","titleFontSize","titleTopMargin","enablePeakDetection","plotRef","useRef","theme","usePlotlyTheme","bindTooltip","tooltipElement","useChartTooltip","onPeakClickRef","onPeakHoverRef","thickenedSeriesRef","peakAnnotationsRef","processedSeries","useMemo","s","validated","validateSeriesData","applyBaselineCorrection","processedAnnotations","x","y","processUserAnnotations","allDetectedPeaks","peaks","index","detected","detectPeaks","selectedBorderColor","selectedBackgroundColor","selectedBold","unselectedOpacity","hoverLineWidthMultiplier","resolvedAppearance","resolveSelectionAppearance","allPeaksForInteraction","result","ann","i","seriesIndex","peak","peakIndex","peakAnnotations","anySelected","options","allPeaksWithMeta","groups","groupOverlappingPeaks","group","createGroupAnnotations","useEffect","currentRef","plotData","buildTraceData","layout","buildLayout","config","buildConfig","Plotly","eventData","peakPoint","p","createHoverHandler","createUnhoverHandler","el","jsx","EmptyState","jsxs"],"mappings":"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"}

package/dist/components/charts/ChromatogramChart/annotations.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("../../../utils/colors.cjs"),O=require("./constants.cjs"),A={default:{ax:0,ay:-35},overlap:[{ax:50,ay:-35},{ax:-60,ay:-35},{ax:70,ay:-55},{ax:-80,ay:-55},{ax:50,ay:-75},{ax:-60,ay:-75}]};function u(t,n){const e=[...t].sort((a,s)=>a.peak.x-s.peak.x),o=[];let r=[];for(const a of e){if(r.length===0){r.push(a);continue}const s=r[r.length-1];Math.abs(a.peak.x-s.peak.x)<n?r.push(a):(o.push(r),r=[a])}return r.length>0&&o.push(r),o}function c(t,n,e){const o=n===-1,r=o?O.CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_COLOR:T.seriesColor(n),a=o?O.CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_TEXT_COLOR:r,s=t.text??(t._computed?.area===void 0?"":`Area: ${t._computed.area.toFixed(2)}`),i=o&&t.ax!==void 0?t.ax:e.ax,N=o&&t.ay!==void 0?t.ay:e.ay;return{x:t.x,y:t.y,text:s,showarrow:!0,arrowhead:2,arrowsize:1,arrowwidth:1,arrowcolor:r,ax:i,ay:N,font:{size:o?O.CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_FONT_SIZE:O.CHROMATOGRAM_ANNOTATION.AUTO_ANNOTATION_FONT_SIZE,color:a,family:"Inter, sans-serif"},bgcolor:O.CHROMATOGRAM_ANNOTATION.BACKGROUND_COLOR,borderpad:2,bordercolor:o?void 0:r,borderwidth:o?0:1}}function l(t){if(t.length===1){const{peak:e,seriesIndex:o}=t[0];return[c(e,o,A.default)]}return[...t].sort((e,o)=>e.peak.y-o.peak.y).map(({peak:e,seriesIndex:o},r)=>{const a=A.overlap[r%A.overlap.length];return c(e,o,a)})}exports.ANNOTATION_SLOTS=A;exports.createGroupAnnotations=l;exports.createPeakAnnotation=c;exports.groupOverlappingPeaks=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../../../utils/colors.cjs"),d=require("./constants.cjs"),T={selected:{borderColor:"#3b82f6",backgroundColor:"#dbeafe",bold:!0},unselected:{opacity:.4},hoverLineWidthMultiplier:5/3};function I(o){if(!o)return T;const t=T;return{selected:{borderColor:o.selected?.borderColor??t.selected.borderColor,backgroundColor:o.selected?.backgroundColor??t.selected.backgroundColor,bold:o.selected?.bold??t.selected.bold},unselected:{opacity:o.unselected?.opacity??t.unselected.opacity},hoverLineWidthMultiplier:o.hoverLineWidthMultiplier??t.hoverLineWidthMultiplier}}const O={default:{ax:0,ay:-35},overlap:[{ax:50,ay:-35},{ax:-60,ay:-35},{ax:70,ay:-55},{ax:-80,ay:-55},{ax:50,ay:-75},{ax:-60,ay:-75}]};function S(o,t){const l=[...o].sort((n,c)=>n.peak.x-c.peak.x),r=[];let e=[];for(const n of l){if(e.length===0){e.push(n);continue}const c=e[e.length-1];Math.abs(n.peak.x-c.peak.x)<t?e.push(n):(r.push(e),e=[n])}return e.length>0&&r.push(e),r}function M(o,t,l,r,e,n){const c=o?e.selected.backgroundColor:d.CHROMATOGRAM_ANNOTATION.BACKGROUND_COLOR;let s;o?s=e.selected.borderColor:s=l&&!n?void 0:r;const i=o?2:l&&!n?0:1,a=t?e.unselected.opacity:void 0;return{bgcolor:c,bordercolor:s,borderwidth:i,...a===void 0?{}:{opacity:a}}}function g(o,t,l,r,e,n,c){const s=n?c.unselected.opacity:void 0;return{x:o.x,y:o.y,text:t,showarrow:!1,yshift:d.CHROMATOGRAM_ANNOTATION.INLINE_YSHIFT,yanchor:"bottom",xanchor:"center",font:{size:l,color:e?c.selected.borderColor:r,family:"Inter, sans-serif"},...s===void 0?{}:{opacity:s}}}function N(o,t,l,r={}){const{selectedPeakIds:e=[],anySelected:n=!1,appearance:c=T,annotationStyle:s="arrow"}=r,i=t===-1,a=i?d.CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_COLOR:h.CHART_COLORS[t%h.CHART_COLORS.length],A=o.color??a,f=i&&!o.color?d.CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_TEXT_COLOR:A,y=o.text??(o._computed?.area===void 0?"":`Area: ${o._computed.area.toFixed(2)}`),u=o.id!==void 0&&e.includes(o.id),b=!u&&n,C=u&&c.selected.bold?`<b>${y}</b>`:y,_=i?d.CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_FONT_SIZE:d.CHROMATOGRAM_ANNOTATION.AUTO_ANNOTATION_FONT_SIZE;if(s==="inline")return g(o,C,_,f,u,b,c);const x=i&&o.ax!==void 0?o.ax:l.ax,R=i&&o.ay!==void 0?o.ay:l.ay,v=M(u,b,i,A,c,o.color!==void 0);return{x:o.x,y:o.y,text:C,showarrow:!0,arrowhead:2,arrowsize:1,arrowwidth:1,arrowcolor:A,ax:x,ay:R,font:{size:_,color:f,family:"Inter, sans-serif"},borderpad:2,...v}}function p(o,t={}){if(o.length===1){const{peak:r,seriesIndex:e}=o[0];return[N(r,e,O.default,t)]}return[...o].sort((r,e)=>r.peak.y-e.peak.y).map(({peak:r,seriesIndex:e},n)=>{const c=O.overlap[n%O.overlap.length];return N(r,e,c,t)})}exports.ANNOTATION_SLOTS=O;exports.createGroupAnnotations=p;exports.createPeakAnnotation=N;exports.groupOverlappingPeaks=S;exports.resolveSelectionAppearance=I;
 //# sourceMappingURL=annotations.cjs.map

package/dist/components/charts/ChromatogramChart/annotations.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"annotations.cjs","sources":["../../../../src/components/charts/ChromatogramChart/annotations.ts"],"sourcesContent":["/**\n * Annotation utilities for ChromatogramChart\n */\n\nimport { seriesColor } from \"../../../utils/colors\";\n\nimport { CHROMATOGRAM_ANNOTATION } from \"./constants\";\n\nimport type { PeakAnnotation, PeakWithMeta } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n/**\n * Annotation slot positions for peak labels\n */\nexport const ANNOTATION_SLOTS = {\n  default: { ax: 0, ay: -35 },\n  overlap: [\n    { ax: 50, ay: -35 }, // Right, level 1\n    { ax: -60, ay: -35 }, // Left, level 1\n    { ax: 70, ay: -55 }, // Right, level 2\n    { ax: -80, ay: -55 }, // Left, level 2\n    { ax: 50, ay: -75 }, // Right, level 3\n    { ax: -60, ay: -75 }, // Left, level 3\n  ],\n};\n\n/**\n * Group overlapping peaks by retention time (x) proximity\n */\nexport function groupOverlappingPeaks(\n  peaksWithMeta: PeakWithMeta[],\n  overlapThreshold: number\n): PeakWithMeta[][] {\n  const sorted = [...peaksWithMeta].sort((a, b) => a.peak.x - b.peak.x);\n\n  const groups: PeakWithMeta[][] = [];\n  let currentGroup: PeakWithMeta[] = [];\n\n  for (const current of sorted) {\n    if (currentGroup.length === 0) {\n      currentGroup.push(current);\n      continue;\n    }\n\n    const lastInGroup = currentGroup[currentGroup.length - 1];\n    const timeDiff = Math.abs(current.peak.x - lastInGroup.peak.x);\n\n    if (timeDiff < overlapThreshold) {\n      currentGroup.push(current);\n    } else {\n      groups.push(currentGroup);\n      currentGroup = [current];\n    }\n  }\n\n  if (currentGroup.length > 0) {\n    groups.push(currentGroup);\n  }\n\n  return groups;\n}\n\n/**\n * Create a Plotly annotation for a peak.\n * seriesIndex of -1 indicates a user-defined annotation (uses grey/black styling).\n */\nexport function createPeakAnnotation(\n  peak: PeakAnnotation,\n  seriesIndex: number,\n  slot: { ax: number; ay: number }\n): Partial<Plotly.Annotations> {\n  const isUserDefined = seriesIndex === -1;\n  const color = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_COLOR\n    : seriesColor(seriesIndex);\n  const textColor = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_TEXT_COLOR\n    : color;\n\n  // Use provided text or auto-generate from computed area\n  const text = peak.text ?? (peak._computed?.area === undefined ? \"\" : `Area: ${peak._computed.area.toFixed(2)}`);\n\n  // For user-defined annotations, respect their ax/ay if provided\n  const ax = isUserDefined && peak.ax !== undefined ? peak.ax : slot.ax;\n  const ay = isUserDefined && peak.ay !== undefined ? peak.ay : slot.ay;\n\n  return {\n    x: peak.x,\n    y: peak.y,\n    text,\n    showarrow: true,\n    arrowhead: 2,\n    arrowsize: 1,\n    arrowwidth: 1,\n    arrowcolor: color,\n    ax,\n    ay,\n    font: {\n      size: isUserDefined\n        ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_FONT_SIZE\n        : CHROMATOGRAM_ANNOTATION.AUTO_ANNOTATION_FONT_SIZE,\n      color: textColor,\n      family: \"Inter, sans-serif\",\n    },\n    bgcolor: CHROMATOGRAM_ANNOTATION.BACKGROUND_COLOR,\n    borderpad: 2,\n    bordercolor: isUserDefined ? undefined : color,\n    borderwidth: isUserDefined ? 0 : 1,\n  };\n}\n\n/**\n * Create annotations for a group of peaks, handling overlap positioning\n */\nexport function createGroupAnnotations(\n  group: PeakWithMeta[]\n): Partial<Plotly.Annotations>[] {\n  if (group.length === 1) {\n    const { peak, seriesIndex } = group[0];\n    return [createPeakAnnotation(peak, seriesIndex, ANNOTATION_SLOTS.default)];\n  }\n\n  // Sort by intensity (y, lowest first) so lower peaks get closer annotations\n  const sortedGroup = [...group].sort((a, b) => a.peak.y - b.peak.y);\n\n  return sortedGroup.map(({ peak, seriesIndex }, slotIndex) => {\n    const slot =\n      ANNOTATION_SLOTS.overlap[slotIndex % ANNOTATION_SLOTS.overlap.length];\n    return createPeakAnnotation(peak, seriesIndex, slot);\n  });\n}\n\n"],"names":["ANNOTATION_SLOTS","groupOverlappingPeaks","peaksWithMeta","overlapThreshold","sorted","b","groups","currentGroup","current","lastInGroup","createPeakAnnotation","peak","seriesIndex","slot","isUserDefined","color","CHROMATOGRAM_ANNOTATION","seriesColor","textColor","text","ax","ay","createGroupAnnotations","group","a","slotIndex"],"mappings":"0JAcaA,EAAmB,CAC9B,QAAS,CAAE,GAAI,EAAG,GAAI,GAAA,EACtB,QAAS,CACP,CAAE,GAAI,GAAI,GAAI,GAAA,EACd,CAAE,GAAI,IAAK,GAAI,GAAA,EACf,CAAE,GAAI,GAAI,GAAI,GAAA,EACd,CAAE,GAAI,IAAK,GAAI,GAAA,EACf,CAAE,GAAI,GAAI,GAAI,GAAA,EACd,CAAE,GAAI,IAAK,GAAI,GAAA,CAAI,CAEvB,EAKO,SAASC,EACdC,EACAC,EACkB,CAClB,MAAMC,EAAS,CAAC,GAAGF,CAAa,EAAE,KAAK,CAAC,EAAGG,IAAM,EAAE,KAAK,EAAIA,EAAE,KAAK,CAAC,EAE9DC,EAA2B,CAAA,EACjC,IAAIC,EAA+B,CAAA,EAEnC,UAAWC,KAAWJ,EAAQ,CAC5B,GAAIG,EAAa,SAAW,EAAG,CAC7BA,EAAa,KAAKC,CAAO,EACzB,QACF,CAEA,MAAMC,EAAcF,EAAaA,EAAa,OAAS,CAAC,EACvC,KAAK,IAAIC,EAAQ,KAAK,EAAIC,EAAY,KAAK,CAAC,EAE9CN,EACbI,EAAa,KAAKC,CAAO,GAEzBF,EAAO,KAAKC,CAAY,EACxBA,EAAe,CAACC,CAAO,EAE3B,CAEA,OAAID,EAAa,OAAS,GACxBD,EAAO,KAAKC,CAAY,EAGnBD,CACT,CAMO,SAASI,EACdC,EACAC,EACAC,EAC6B,CAC7B,MAAMC,EAAgBF,IAAgB,GAChCG,EAAQD,EACVE,EAAAA,wBAAwB,sBACxBC,EAAAA,YAAYL,CAAW,EACrBM,EAAYJ,EACdE,EAAAA,wBAAwB,2BACxBD,EAGEI,EAAOR,EAAK,OAASA,EAAK,WAAW,OAAS,OAAY,GAAK,SAASA,EAAK,UAAU,KAAK,QAAQ,CAAC,CAAC,IAGtGS,EAAKN,GAAiBH,EAAK,KAAO,OAAYA,EAAK,GAAKE,EAAK,GAC7DQ,EAAKP,GAAiBH,EAAK,KAAO,OAAYA,EAAK,GAAKE,EAAK,GAEnE,MAAO,CACL,EAAGF,EAAK,EACR,EAAGA,EAAK,EACR,KAAAQ,EACA,UAAW,GACX,UAAW,EACX,UAAW,EACX,WAAY,EACZ,WAAYJ,EACZ,GAAAK,EACA,GAAAC,EACA,KAAM,CACJ,KAAMP,EACFE,EAAAA,wBAAwB,0BACxBA,EAAAA,wBAAwB,0BAC5B,MAAOE,EACP,OAAQ,mBAAA,EAEV,QAASF,EAAAA,wBAAwB,iBACjC,UAAW,EACX,YAAaF,EAAgB,OAAYC,EACzC,YAAaD,EAAgB,EAAI,CAAA,CAErC,CAKO,SAASQ,EACdC,EAC+B,CAC/B,GAAIA,EAAM,SAAW,EAAG,CACtB,KAAM,CAAE,KAAAZ,EAAM,YAAAC,GAAgBW,EAAM,CAAC,EACrC,MAAO,CAACb,EAAqBC,EAAMC,EAAaZ,EAAiB,OAAO,CAAC,CAC3E,CAKA,MAFoB,CAAC,GAAGuB,CAAK,EAAE,KAAK,CAACC,EAAGnB,IAAMmB,EAAE,KAAK,EAAInB,EAAE,KAAK,CAAC,EAE9C,IAAI,CAAC,CAAE,KAAAM,EAAM,YAAAC,CAAA,EAAea,IAAc,CAC3D,MAAMZ,EACJb,EAAiB,QAAQyB,EAAYzB,EAAiB,QAAQ,MAAM,EACtE,OAAOU,EAAqBC,EAAMC,EAAaC,CAAI,CACrD,CAAC,CACH"}
+{"version":3,"file":"annotations.cjs","sources":["../../../../src/components/charts/ChromatogramChart/annotations.ts"],"sourcesContent":["/**\n * Annotation utilities for ChromatogramChart\n */\n\nimport { CHART_COLORS } from \"../../../utils/colors\";\n\nimport { CHROMATOGRAM_ANNOTATION } from \"./constants\";\n\nimport type { PeakAnnotation, PeakSelectionAppearance, PeakWithMeta } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n// ── Selection appearance helpers ─────────────────────────────────────────────\n\nexport interface ResolvedSelectionAppearance {\n  selected: {\n    borderColor: string;\n    backgroundColor: string;\n    bold: boolean;\n  };\n  unselected: {\n    opacity: number;\n  };\n  hoverLineWidthMultiplier: number;\n}\n\nconst DEFAULT_RESOLVED_APPEARANCE: ResolvedSelectionAppearance = {\n  selected: {\n    borderColor: \"#3b82f6\",\n    backgroundColor: \"#dbeafe\",\n    bold: true,\n  },\n  unselected: { opacity: 0.4 },\n  hoverLineWidthMultiplier: 5 / 3,\n};\n\nexport function resolveSelectionAppearance(\n  appearance?: PeakSelectionAppearance\n): ResolvedSelectionAppearance {\n  if (!appearance) return DEFAULT_RESOLVED_APPEARANCE;\n  const d = DEFAULT_RESOLVED_APPEARANCE;\n  return {\n    selected: {\n      borderColor: appearance.selected?.borderColor ?? d.selected.borderColor,\n      backgroundColor: appearance.selected?.backgroundColor ?? d.selected.backgroundColor,\n      bold: appearance.selected?.bold ?? d.selected.bold,\n    },\n    unselected: {\n      opacity: appearance.unselected?.opacity ?? d.unselected.opacity,\n    },\n    hoverLineWidthMultiplier:\n      appearance.hoverLineWidthMultiplier ?? d.hoverLineWidthMultiplier,\n  };\n}\n\n/**\n * Annotation slot positions for peak labels\n */\nexport const ANNOTATION_SLOTS = {\n  default: { ax: 0, ay: -35 },\n  overlap: [\n    { ax: 50, ay: -35 }, // Right, level 1\n    { ax: -60, ay: -35 }, // Left, level 1\n    { ax: 70, ay: -55 }, // Right, level 2\n    { ax: -80, ay: -55 }, // Left, level 2\n    { ax: 50, ay: -75 }, // Right, level 3\n    { ax: -60, ay: -75 }, // Left, level 3\n  ],\n};\n\n/**\n * Group overlapping peaks by retention time (x) proximity\n */\nexport function groupOverlappingPeaks(\n  peaksWithMeta: PeakWithMeta[],\n  overlapThreshold: number\n): PeakWithMeta[][] {\n  const sorted = [...peaksWithMeta].sort((a, b) => a.peak.x - b.peak.x);\n\n  const groups: PeakWithMeta[][] = [];\n  let currentGroup: PeakWithMeta[] = [];\n\n  for (const current of sorted) {\n    if (currentGroup.length === 0) {\n      currentGroup.push(current);\n      continue;\n    }\n\n    const lastInGroup = currentGroup[currentGroup.length - 1];\n    const timeDiff = Math.abs(current.peak.x - lastInGroup.peak.x);\n\n    if (timeDiff < overlapThreshold) {\n      currentGroup.push(current);\n    } else {\n      groups.push(currentGroup);\n      currentGroup = [current];\n    }\n  }\n\n  if (currentGroup.length > 0) {\n    groups.push(currentGroup);\n  }\n\n  return groups;\n}\n\ninterface PeakAnnotationOptions {\n  selectedPeakIds?: string[];\n  anySelected?: boolean;\n  appearance?: ResolvedSelectionAppearance;\n  annotationStyle?: \"arrow\" | \"inline\";\n}\n\ninterface AnnotationBorderStyle {\n  bgcolor: string;\n  bordercolor: string | undefined;\n  borderwidth: number;\n  opacity?: number;\n}\n\n/** Derives border/background/opacity from selection state — extracted to keep\n *  createPeakAnnotation within the allowed cognitive complexity budget. */\nfunction resolveAnnotationBorderStyle(\n  isSelected: boolean,\n  isDimmed: boolean,\n  isUserDefined: boolean,\n  seriesColor: string,\n  appearance: ResolvedSelectionAppearance,\n  hasColorOverride: boolean\n): AnnotationBorderStyle {\n  const bgcolor = isSelected\n    ? appearance.selected.backgroundColor\n    : CHROMATOGRAM_ANNOTATION.BACKGROUND_COLOR;\n  let bordercolor: string | undefined;\n  if (isSelected) {\n    bordercolor = appearance.selected.borderColor;\n  } else {\n    bordercolor = isUserDefined && !hasColorOverride ? undefined : seriesColor;\n  }\n  const borderwidth = isSelected ? 2 : isUserDefined && !hasColorOverride ? 0 : 1;\n  const opacity = isDimmed ? appearance.unselected.opacity : undefined;\n  return { bgcolor, bordercolor, borderwidth, ...(opacity === undefined ? {} : { opacity }) };\n}\n\n/** Builds an inline-style (no-arrow) annotation that floats above the trace point. */\nfunction createInlineAnnotation(\n  peak: PeakAnnotation,\n  text: string,\n  fontSize: number,\n  textColor: string,\n  isSelected: boolean,\n  isDimmed: boolean,\n  appearance: ResolvedSelectionAppearance\n): Partial<Plotly.Annotations> {\n  const opacity = isDimmed ? appearance.unselected.opacity : undefined;\n  return {\n    x: peak.x,\n    y: peak.y,\n    text,\n    showarrow: false,\n    yshift: CHROMATOGRAM_ANNOTATION.INLINE_YSHIFT,\n    yanchor: \"bottom\" as const,\n    xanchor: \"center\" as const,\n    font: {\n      size: fontSize,\n      color: isSelected ? appearance.selected.borderColor : textColor,\n      family: \"Inter, sans-serif\",\n    },\n    ...(opacity === undefined ? {} : { opacity }),\n  };\n}\n\n/**\n * Create a Plotly annotation for a peak.\n * seriesIndex of -1 indicates a user-defined annotation (uses grey/black styling).\n */\nexport function createPeakAnnotation(\n  peak: PeakAnnotation,\n  seriesIndex: number,\n  slot: { ax: number; ay: number },\n  options: PeakAnnotationOptions = {}\n): Partial<Plotly.Annotations> {\n  const {\n    selectedPeakIds = [],\n    anySelected = false,\n    appearance = DEFAULT_RESOLVED_APPEARANCE,\n    annotationStyle = \"arrow\",\n  } = options;\n\n  const isUserDefined = seriesIndex === -1;\n  const defaultColor = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_COLOR\n    : CHART_COLORS[seriesIndex % CHART_COLORS.length];\n  const color = peak.color ?? defaultColor;\n  const textColor = isUserDefined && !peak.color\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_TEXT_COLOR\n    : color;\n\n  const rawText = peak.text ?? (peak._computed?.area === undefined ? \"\" : `Area: ${peak._computed.area.toFixed(2)}`);\n\n  const isSelected = peak.id !== undefined && selectedPeakIds.includes(peak.id);\n  const isDimmed = !isSelected && anySelected;\n\n  const text = isSelected && appearance.selected.bold ? `<b>${rawText}</b>` : rawText;\n\n  const fontSize = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_FONT_SIZE\n    : CHROMATOGRAM_ANNOTATION.AUTO_ANNOTATION_FONT_SIZE;\n\n  if (annotationStyle === \"inline\") {\n    return createInlineAnnotation(peak, text, fontSize, textColor, isSelected, isDimmed, appearance);\n  }\n\n  // For user-defined annotations, respect their ax/ay if provided\n  const ax = isUserDefined && peak.ax !== undefined ? peak.ax : slot.ax;\n  const ay = isUserDefined && peak.ay !== undefined ? peak.ay : slot.ay;\n\n  const borderStyle = resolveAnnotationBorderStyle(\n    isSelected, isDimmed, isUserDefined, color, appearance, peak.color !== undefined\n  );\n\n  return {\n    x: peak.x,\n    y: peak.y,\n    text,\n    showarrow: true,\n    arrowhead: 2,\n    arrowsize: 1,\n    arrowwidth: 1,\n    arrowcolor: color,\n    ax,\n    ay,\n    font: {\n      size: fontSize,\n      color: textColor,\n      family: \"Inter, sans-serif\",\n    },\n    borderpad: 2,\n    ...borderStyle,\n  };\n}\n\n/**\n * Create annotations for a group of peaks, handling overlap positioning\n */\nexport function createGroupAnnotations(\n  group: PeakWithMeta[],\n  options: PeakAnnotationOptions = {}\n): Partial<Plotly.Annotations>[] {\n  if (group.length === 1) {\n    const { peak, seriesIndex } = group[0];\n    return [createPeakAnnotation(peak, seriesIndex, ANNOTATION_SLOTS.default, options)];\n  }\n\n  // Sort by intensity (y, lowest first) so lower peaks get closer annotations\n  const sortedGroup = [...group].sort((a, b) => a.peak.y - b.peak.y);\n\n  return sortedGroup.map(({ peak, seriesIndex }, slotIndex) => {\n    const slot =\n      ANNOTATION_SLOTS.overlap[slotIndex % ANNOTATION_SLOTS.overlap.length];\n    return createPeakAnnotation(peak, seriesIndex, slot, options);\n  });\n}\n\n"],"names":["DEFAULT_RESOLVED_APPEARANCE","resolveSelectionAppearance","appearance","d","ANNOTATION_SLOTS","groupOverlappingPeaks","peaksWithMeta","overlapThreshold","sorted","a","b","groups","currentGroup","current","lastInGroup","resolveAnnotationBorderStyle","isSelected","isDimmed","isUserDefined","seriesColor","hasColorOverride","bgcolor","CHROMATOGRAM_ANNOTATION","bordercolor","borderwidth","opacity","createInlineAnnotation","peak","text","fontSize","textColor","createPeakAnnotation","seriesIndex","slot","options","selectedPeakIds","anySelected","annotationStyle","defaultColor","CHART_COLORS","color","rawText","ax","ay","borderStyle","createGroupAnnotations","group","slotIndex"],"mappings":"0JAyBMA,EAA2D,CAC/D,SAAU,CACR,YAAa,UACb,gBAAiB,UACjB,KAAM,EAAA,EAER,WAAY,CAAE,QAAS,EAAA,EACvB,yBAA0B,EAAI,CAChC,EAEO,SAASC,EACdC,EAC6B,CAC7B,GAAI,CAACA,EAAY,OAAOF,EACxB,MAAMG,EAAIH,EACV,MAAO,CACL,SAAU,CACR,YAAaE,EAAW,UAAU,aAAeC,EAAE,SAAS,YAC5D,gBAAiBD,EAAW,UAAU,iBAAmBC,EAAE,SAAS,gBACpE,KAAMD,EAAW,UAAU,MAAQC,EAAE,SAAS,IAAA,EAEhD,WAAY,CACV,QAASD,EAAW,YAAY,SAAWC,EAAE,WAAW,OAAA,EAE1D,yBACED,EAAW,0BAA4BC,EAAE,wBAAA,CAE/C,CAKO,MAAMC,EAAmB,CAC9B,QAAS,CAAE,GAAI,EAAG,GAAI,GAAA,EACtB,QAAS,CACP,CAAE,GAAI,GAAI,GAAI,GAAA,EACd,CAAE,GAAI,IAAK,GAAI,GAAA,EACf,CAAE,GAAI,GAAI,GAAI,GAAA,EACd,CAAE,GAAI,IAAK,GAAI,GAAA,EACf,CAAE,GAAI,GAAI,GAAI,GAAA,EACd,CAAE,GAAI,IAAK,GAAI,GAAA,CAAI,CAEvB,EAKO,SAASC,EACdC,EACAC,EACkB,CAClB,MAAMC,EAAS,CAAC,GAAGF,CAAa,EAAE,KAAK,CAACG,EAAGC,IAAMD,EAAE,KAAK,EAAIC,EAAE,KAAK,CAAC,EAE9DC,EAA2B,CAAA,EACjC,IAAIC,EAA+B,CAAA,EAEnC,UAAWC,KAAWL,EAAQ,CAC5B,GAAII,EAAa,SAAW,EAAG,CAC7BA,EAAa,KAAKC,CAAO,EACzB,QACF,CAEA,MAAMC,EAAcF,EAAaA,EAAa,OAAS,CAAC,EACvC,KAAK,IAAIC,EAAQ,KAAK,EAAIC,EAAY,KAAK,CAAC,EAE9CP,EACbK,EAAa,KAAKC,CAAO,GAEzBF,EAAO,KAAKC,CAAY,EACxBA,EAAe,CAACC,CAAO,EAE3B,CAEA,OAAID,EAAa,OAAS,GACxBD,EAAO,KAAKC,CAAY,EAGnBD,CACT,CAkBA,SAASI,EACPC,EACAC,EACAC,EACAC,EACAjB,EACAkB,EACuB,CACvB,MAAMC,EAAUL,EACZd,EAAW,SAAS,gBACpBoB,EAAAA,wBAAwB,iBAC5B,IAAIC,EACAP,EACFO,EAAcrB,EAAW,SAAS,YAElCqB,EAAcL,GAAiB,CAACE,EAAmB,OAAYD,EAEjE,MAAMK,EAAcR,EAAa,EAAIE,GAAiB,CAACE,EAAmB,EAAI,EACxEK,EAAUR,EAAWf,EAAW,WAAW,QAAU,OAC3D,MAAO,CAAE,QAAAmB,EAAS,YAAAE,EAAa,YAAAC,EAAa,GAAIC,IAAY,OAAY,CAAA,EAAK,CAAE,QAAAA,EAAQ,CACzF,CAGA,SAASC,EACPC,EACAC,EACAC,EACAC,EACAd,EACAC,EACAf,EAC6B,CAC7B,MAAMuB,EAAUR,EAAWf,EAAW,WAAW,QAAU,OAC3D,MAAO,CACL,EAAGyB,EAAK,EACR,EAAGA,EAAK,EACR,KAAAC,EACA,UAAW,GACX,OAAQN,EAAAA,wBAAwB,cAChC,QAAS,SACT,QAAS,SACT,KAAM,CACJ,KAAMO,EACN,MAAOb,EAAad,EAAW,SAAS,YAAc4B,EACtD,OAAQ,mBAAA,EAEV,GAAIL,IAAY,OAAY,CAAA,EAAK,CAAE,QAAAA,CAAA,CAAQ,CAE/C,CAMO,SAASM,EACdJ,EACAK,EACAC,EACAC,EAAiC,CAAA,EACJ,CAC7B,KAAM,CACJ,gBAAAC,EAAkB,CAAA,EAClB,YAAAC,EAAc,GACd,WAAAlC,EAAaF,EACb,gBAAAqC,EAAkB,OAAA,EAChBH,EAEEhB,EAAgBc,IAAgB,GAChCM,EAAepB,EACjBI,0BAAwB,sBACxBiB,EAAAA,aAAaP,EAAcO,EAAAA,aAAa,MAAM,EAC5CC,EAAQb,EAAK,OAASW,EACtBR,EAAYZ,GAAiB,CAACS,EAAK,MACrCL,EAAAA,wBAAwB,2BACxBkB,EAEEC,EAAUd,EAAK,OAASA,EAAK,WAAW,OAAS,OAAY,GAAK,SAASA,EAAK,UAAU,KAAK,QAAQ,CAAC,CAAC,IAEzGX,EAAaW,EAAK,KAAO,QAAaQ,EAAgB,SAASR,EAAK,EAAE,EACtEV,EAAW,CAACD,GAAcoB,EAE1BR,EAAOZ,GAAcd,EAAW,SAAS,KAAO,MAAMuC,CAAO,OAASA,EAEtEZ,EAAWX,EACbI,EAAAA,wBAAwB,0BACxBA,EAAAA,wBAAwB,0BAE5B,GAAIe,IAAoB,SACtB,OAAOX,EAAuBC,EAAMC,EAAMC,EAAUC,EAAWd,EAAYC,EAAUf,CAAU,EAIjG,MAAMwC,EAAKxB,GAAiBS,EAAK,KAAO,OAAYA,EAAK,GAAKM,EAAK,GAC7DU,EAAKzB,GAAiBS,EAAK,KAAO,OAAYA,EAAK,GAAKM,EAAK,GAE7DW,EAAc7B,EAClBC,EAAYC,EAAUC,EAAesB,EAAOtC,EAAYyB,EAAK,QAAU,MAAA,EAGzE,MAAO,CACL,EAAGA,EAAK,EACR,EAAGA,EAAK,EACR,KAAAC,EACA,UAAW,GACX,UAAW,EACX,UAAW,EACX,WAAY,EACZ,WAAYY,EACZ,GAAAE,EACA,GAAAC,EACA,KAAM,CACJ,KAAMd,EACN,MAAOC,EACP,OAAQ,mBAAA,EAEV,UAAW,EACX,GAAGc,CAAA,CAEP,CAKO,SAASC,EACdC,EACAZ,EAAiC,GACF,CAC/B,GAAIY,EAAM,SAAW,EAAG,CACtB,KAAM,CAAE,KAAAnB,EAAM,YAAAK,GAAgBc,EAAM,CAAC,EACrC,MAAO,CAACf,EAAqBJ,EAAMK,EAAa5B,EAAiB,QAAS8B,CAAO,CAAC,CACpF,CAKA,MAFoB,CAAC,GAAGY,CAAK,EAAE,KAAK,CAACrC,EAAGC,IAAMD,EAAE,KAAK,EAAIC,EAAE,KAAK,CAAC,EAE9C,IAAI,CAAC,CAAE,KAAAiB,EAAM,YAAAK,CAAA,EAAee,IAAc,CAC3D,MAAMd,EACJ7B,EAAiB,QAAQ2C,EAAY3C,EAAiB,QAAQ,MAAM,EACtE,OAAO2B,EAAqBJ,EAAMK,EAAaC,EAAMC,CAAO,CAC9D,CAAC,CACH"}

package/dist/components/charts/ChromatogramChart/annotations.js

@@ -1,6 +1,30 @@
-import { seriesColor as x } from "../../../utils/colors.js";
-import { CHROMATOGRAM_ANNOTATION as i } from "./constants.js";
-const c = {
+import { CHART_COLORS as T } from "../../../utils/colors.js";
+import { CHROMATOGRAM_ANNOTATION as d } from "./constants.js";
+const O = {
+  selected: {
+    borderColor: "#3b82f6",
+    backgroundColor: "#dbeafe",
+    bold: !0
+  },
+  unselected: { opacity: 0.4 },
+  hoverLineWidthMultiplier: 5 / 3
+};
+function p(o) {
+  if (!o) return O;
+  const t = O;
+  return {
+    selected: {
+      borderColor: o.selected?.borderColor ?? t.selected.borderColor,
+      backgroundColor: o.selected?.backgroundColor ?? t.selected.backgroundColor,
+      bold: o.selected?.bold ?? t.selected.bold
+    },
+    unselected: {
+      opacity: o.unselected?.opacity ?? t.unselected.opacity
+    },
+    hoverLineWidthMultiplier: o.hoverLineWidthMultiplier ?? t.hoverLineWidthMultiplier
+  };
+}
+const y = {
   default: { ax: 0, ay: -35 },
   overlap: [
     { ax: 50, ay: -35 },
@@ -17,57 +41,96 @@ const c = {
     // Left, level 3
   ]
 };
-function d(r, n) {
-  const e = [...r].sort((a, s) => a.peak.x - s.peak.x), o = [];
-  let t = [];
-  for (const a of e) {
-    if (t.length === 0) {
-      t.push(a);
+function w(o, t) {
+  const c = [...o].sort((n, l) => n.peak.x - l.peak.x), r = [];
+  let e = [];
+  for (const n of c) {
+    if (e.length === 0) {
+      e.push(n);
       continue;
     }
-    const s = t[t.length - 1];
-    Math.abs(a.peak.x - s.peak.x) < n ? t.push(a) : (o.push(t), t = [a]);
+    const l = e[e.length - 1];
+    Math.abs(n.peak.x - l.peak.x) < t ? e.push(n) : (r.push(e), e = [n]);
   }
-  return t.length > 0 && o.push(t), o;
+  return e.length > 0 && r.push(e), r;
+}
+function S(o, t, c, r, e, n) {
+  const l = o ? e.selected.backgroundColor : d.BACKGROUND_COLOR;
+  let s;
+  o ? s = e.selected.borderColor : s = c && !n ? void 0 : r;
+  const i = o ? 2 : c && !n ? 0 : 1, a = t ? e.unselected.opacity : void 0;
+  return { bgcolor: l, bordercolor: s, borderwidth: i, ...a === void 0 ? {} : { opacity: a } };
+}
+function m(o, t, c, r, e, n, l) {
+  const s = n ? l.unselected.opacity : void 0;
+  return {
+    x: o.x,
+    y: o.y,
+    text: t,
+    showarrow: !1,
+    yshift: d.INLINE_YSHIFT,
+    yanchor: "bottom",
+    xanchor: "center",
+    font: {
+      size: c,
+      color: e ? l.selected.borderColor : r,
+      family: "Inter, sans-serif"
+    },
+    ...s === void 0 ? {} : { opacity: s }
+  };
 }
-function u(r, n, e) {
-  const o = n === -1, t = o ? i.USER_ANNOTATION_COLOR : x(n), a = o ? i.USER_ANNOTATION_TEXT_COLOR : t, s = r.text ?? (r._computed?.area === void 0 ? "" : `Area: ${r._computed.area.toFixed(2)}`), O = o && r.ax !== void 0 ? r.ax : e.ax, l = o && r.ay !== void 0 ? r.ay : e.ay;
+function C(o, t, c, r = {}) {
+  const {
+    selectedPeakIds: e = [],
+    anySelected: n = !1,
+    appearance: l = O,
+    annotationStyle: s = "arrow"
+  } = r, i = t === -1, a = i ? d.USER_ANNOTATION_COLOR : T[t % T.length], f = o.color ?? a, b = i && !o.color ? d.USER_ANNOTATION_TEXT_COLOR : f, A = o.text ?? (o._computed?.area === void 0 ? "" : `Area: ${o._computed.area.toFixed(2)}`), u = o.id !== void 0 && e.includes(o.id), h = !u && n, x = u && l.selected.bold ? `<b>${A}</b>` : A, N = i ? d.USER_ANNOTATION_FONT_SIZE : d.AUTO_ANNOTATION_FONT_SIZE;
+  if (s === "inline")
+    return m(o, x, N, b, u, h, l);
+  const _ = i && o.ax !== void 0 ? o.ax : c.ax, v = i && o.ay !== void 0 ? o.ay : c.ay, I = S(
+    u,
+    h,
+    i,
+    f,
+    l,
+    o.color !== void 0
+  );
   return {
-    x: r.x,
-    y: r.y,
-    text: s,
+    x: o.x,
+    y: o.y,
+    text: x,
     showarrow: !0,
     arrowhead: 2,
     arrowsize: 1,
     arrowwidth: 1,
-    arrowcolor: t,
-    ax: O,
-    ay: l,
+    arrowcolor: f,
+    ax: _,
+    ay: v,
     font: {
-      size: o ? i.USER_ANNOTATION_FONT_SIZE : i.AUTO_ANNOTATION_FONT_SIZE,
-      color: a,
+      size: N,
+      color: b,
       family: "Inter, sans-serif"
     },
-    bgcolor: i.BACKGROUND_COLOR,
     borderpad: 2,
-    bordercolor: o ? void 0 : t,
-    borderwidth: o ? 0 : 1
+    ...I
   };
 }
-function p(r) {
-  if (r.length === 1) {
-    const { peak: e, seriesIndex: o } = r[0];
-    return [u(e, o, c.default)];
+function E(o, t = {}) {
+  if (o.length === 1) {
+    const { peak: r, seriesIndex: e } = o[0];
+    return [C(r, e, y.default, t)];
   }
-  return [...r].sort((e, o) => e.peak.y - o.peak.y).map(({ peak: e, seriesIndex: o }, t) => {
-    const a = c.overlap[t % c.overlap.length];
-    return u(e, o, a);
+  return [...o].sort((r, e) => r.peak.y - e.peak.y).map(({ peak: r, seriesIndex: e }, n) => {
+    const l = y.overlap[n % y.overlap.length];
+    return C(r, e, l, t);
   });
 }
 export {
-  c as ANNOTATION_SLOTS,
-  p as createGroupAnnotations,
-  u as createPeakAnnotation,
-  d as groupOverlappingPeaks
+  y as ANNOTATION_SLOTS,
+  E as createGroupAnnotations,
+  C as createPeakAnnotation,
+  w as groupOverlappingPeaks,
+  p as resolveSelectionAppearance
 };
 //# sourceMappingURL=annotations.js.map

package/dist/components/charts/ChromatogramChart/annotations.js.map

@@ -1 +1 @@
-{"version":3,"file":"annotations.js","sources":["../../../../src/components/charts/ChromatogramChart/annotations.ts"],"sourcesContent":["/**\n * Annotation utilities for ChromatogramChart\n */\n\nimport { seriesColor } from \"../../../utils/colors\";\n\nimport { CHROMATOGRAM_ANNOTATION } from \"./constants\";\n\nimport type { PeakAnnotation, PeakWithMeta } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n/**\n * Annotation slot positions for peak labels\n */\nexport const ANNOTATION_SLOTS = {\n  default: { ax: 0, ay: -35 },\n  overlap: [\n    { ax: 50, ay: -35 }, // Right, level 1\n    { ax: -60, ay: -35 }, // Left, level 1\n    { ax: 70, ay: -55 }, // Right, level 2\n    { ax: -80, ay: -55 }, // Left, level 2\n    { ax: 50, ay: -75 }, // Right, level 3\n    { ax: -60, ay: -75 }, // Left, level 3\n  ],\n};\n\n/**\n * Group overlapping peaks by retention time (x) proximity\n */\nexport function groupOverlappingPeaks(\n  peaksWithMeta: PeakWithMeta[],\n  overlapThreshold: number\n): PeakWithMeta[][] {\n  const sorted = [...peaksWithMeta].sort((a, b) => a.peak.x - b.peak.x);\n\n  const groups: PeakWithMeta[][] = [];\n  let currentGroup: PeakWithMeta[] = [];\n\n  for (const current of sorted) {\n    if (currentGroup.length === 0) {\n      currentGroup.push(current);\n      continue;\n    }\n\n    const lastInGroup = currentGroup[currentGroup.length - 1];\n    const timeDiff = Math.abs(current.peak.x - lastInGroup.peak.x);\n\n    if (timeDiff < overlapThreshold) {\n      currentGroup.push(current);\n    } else {\n      groups.push(currentGroup);\n      currentGroup = [current];\n    }\n  }\n\n  if (currentGroup.length > 0) {\n    groups.push(currentGroup);\n  }\n\n  return groups;\n}\n\n/**\n * Create a Plotly annotation for a peak.\n * seriesIndex of -1 indicates a user-defined annotation (uses grey/black styling).\n */\nexport function createPeakAnnotation(\n  peak: PeakAnnotation,\n  seriesIndex: number,\n  slot: { ax: number; ay: number }\n): Partial<Plotly.Annotations> {\n  const isUserDefined = seriesIndex === -1;\n  const color = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_COLOR\n    : seriesColor(seriesIndex);\n  const textColor = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_TEXT_COLOR\n    : color;\n\n  // Use provided text or auto-generate from computed area\n  const text = peak.text ?? (peak._computed?.area === undefined ? \"\" : `Area: ${peak._computed.area.toFixed(2)}`);\n\n  // For user-defined annotations, respect their ax/ay if provided\n  const ax = isUserDefined && peak.ax !== undefined ? peak.ax : slot.ax;\n  const ay = isUserDefined && peak.ay !== undefined ? peak.ay : slot.ay;\n\n  return {\n    x: peak.x,\n    y: peak.y,\n    text,\n    showarrow: true,\n    arrowhead: 2,\n    arrowsize: 1,\n    arrowwidth: 1,\n    arrowcolor: color,\n    ax,\n    ay,\n    font: {\n      size: isUserDefined\n        ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_FONT_SIZE\n        : CHROMATOGRAM_ANNOTATION.AUTO_ANNOTATION_FONT_SIZE,\n      color: textColor,\n      family: \"Inter, sans-serif\",\n    },\n    bgcolor: CHROMATOGRAM_ANNOTATION.BACKGROUND_COLOR,\n    borderpad: 2,\n    bordercolor: isUserDefined ? undefined : color,\n    borderwidth: isUserDefined ? 0 : 1,\n  };\n}\n\n/**\n * Create annotations for a group of peaks, handling overlap positioning\n */\nexport function createGroupAnnotations(\n  group: PeakWithMeta[]\n): Partial<Plotly.Annotations>[] {\n  if (group.length === 1) {\n    const { peak, seriesIndex } = group[0];\n    return [createPeakAnnotation(peak, seriesIndex, ANNOTATION_SLOTS.default)];\n  }\n\n  // Sort by intensity (y, lowest first) so lower peaks get closer annotations\n  const sortedGroup = [...group].sort((a, b) => a.peak.y - b.peak.y);\n\n  return sortedGroup.map(({ peak, seriesIndex }, slotIndex) => {\n    const slot =\n      ANNOTATION_SLOTS.overlap[slotIndex % ANNOTATION_SLOTS.overlap.length];\n    return createPeakAnnotation(peak, seriesIndex, slot);\n  });\n}\n\n"],"names":["ANNOTATION_SLOTS","groupOverlappingPeaks","peaksWithMeta","overlapThreshold","sorted","b","groups","currentGroup","current","lastInGroup","createPeakAnnotation","peak","seriesIndex","slot","isUserDefined","color","CHROMATOGRAM_ANNOTATION","seriesColor","textColor","text","ax","ay","createGroupAnnotations","group","a","slotIndex"],"mappings":";;AAcO,MAAMA,IAAmB;AAAA,EAC9B,SAAS,EAAE,IAAI,GAAG,IAAI,IAAA;AAAA,EACtB,SAAS;AAAA,IACP,EAAE,IAAI,IAAI,IAAI,IAAA;AAAA;AAAA,IACd,EAAE,IAAI,KAAK,IAAI,IAAA;AAAA;AAAA,IACf,EAAE,IAAI,IAAI,IAAI,IAAA;AAAA;AAAA,IACd,EAAE,IAAI,KAAK,IAAI,IAAA;AAAA;AAAA,IACf,EAAE,IAAI,IAAI,IAAI,IAAA;AAAA;AAAA,IACd,EAAE,IAAI,KAAK,IAAI,IAAA;AAAA;AAAA,EAAI;AAEvB;AAKO,SAASC,EACdC,GACAC,GACkB;AAClB,QAAMC,IAAS,CAAC,GAAGF,CAAa,EAAE,KAAK,CAAC,GAAGG,MAAM,EAAE,KAAK,IAAIA,EAAE,KAAK,CAAC,GAE9DC,IAA2B,CAAA;AACjC,MAAIC,IAA+B,CAAA;AAEnC,aAAWC,KAAWJ,GAAQ;AAC5B,QAAIG,EAAa,WAAW,GAAG;AAC7B,MAAAA,EAAa,KAAKC,CAAO;AACzB;AAAA,IACF;AAEA,UAAMC,IAAcF,EAAaA,EAAa,SAAS,CAAC;AAGxD,IAFiB,KAAK,IAAIC,EAAQ,KAAK,IAAIC,EAAY,KAAK,CAAC,IAE9CN,IACbI,EAAa,KAAKC,CAAO,KAEzBF,EAAO,KAAKC,CAAY,GACxBA,IAAe,CAACC,CAAO;AAAA,EAE3B;AAEA,SAAID,EAAa,SAAS,KACxBD,EAAO,KAAKC,CAAY,GAGnBD;AACT;AAMO,SAASI,EACdC,GACAC,GACAC,GAC6B;AAC7B,QAAMC,IAAgBF,MAAgB,IAChCG,IAAQD,IACVE,EAAwB,wBACxBC,EAAYL,CAAW,GACrBM,IAAYJ,IACdE,EAAwB,6BACxBD,GAGEI,IAAOR,EAAK,SAASA,EAAK,WAAW,SAAS,SAAY,KAAK,SAASA,EAAK,UAAU,KAAK,QAAQ,CAAC,CAAC,KAGtGS,IAAKN,KAAiBH,EAAK,OAAO,SAAYA,EAAK,KAAKE,EAAK,IAC7DQ,IAAKP,KAAiBH,EAAK,OAAO,SAAYA,EAAK,KAAKE,EAAK;AAEnE,SAAO;AAAA,IACL,GAAGF,EAAK;AAAA,IACR,GAAGA,EAAK;AAAA,IACR,MAAAQ;AAAA,IACA,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,YAAYJ;AAAA,IACZ,IAAAK;AAAA,IACA,IAAAC;AAAA,IACA,MAAM;AAAA,MACJ,MAAMP,IACFE,EAAwB,4BACxBA,EAAwB;AAAA,MAC5B,OAAOE;AAAA,MACP,QAAQ;AAAA,IAAA;AAAA,IAEV,SAASF,EAAwB;AAAA,IACjC,WAAW;AAAA,IACX,aAAaF,IAAgB,SAAYC;AAAA,IACzC,aAAaD,IAAgB,IAAI;AAAA,EAAA;AAErC;AAKO,SAASQ,EACdC,GAC+B;AAC/B,MAAIA,EAAM,WAAW,GAAG;AACtB,UAAM,EAAE,MAAAZ,GAAM,aAAAC,MAAgBW,EAAM,CAAC;AACrC,WAAO,CAACb,EAAqBC,GAAMC,GAAaZ,EAAiB,OAAO,CAAC;AAAA,EAC3E;AAKA,SAFoB,CAAC,GAAGuB,CAAK,EAAE,KAAK,CAACC,GAAGnB,MAAMmB,EAAE,KAAK,IAAInB,EAAE,KAAK,CAAC,EAE9C,IAAI,CAAC,EAAE,MAAAM,GAAM,aAAAC,EAAA,GAAea,MAAc;AAC3D,UAAMZ,IACJb,EAAiB,QAAQyB,IAAYzB,EAAiB,QAAQ,MAAM;AACtE,WAAOU,EAAqBC,GAAMC,GAAaC,CAAI;AAAA,EACrD,CAAC;AACH;"}
+{"version":3,"file":"annotations.js","sources":["../../../../src/components/charts/ChromatogramChart/annotations.ts"],"sourcesContent":["/**\n * Annotation utilities for ChromatogramChart\n */\n\nimport { CHART_COLORS } from \"../../../utils/colors\";\n\nimport { CHROMATOGRAM_ANNOTATION } from \"./constants\";\n\nimport type { PeakAnnotation, PeakSelectionAppearance, PeakWithMeta } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n// ── Selection appearance helpers ─────────────────────────────────────────────\n\nexport interface ResolvedSelectionAppearance {\n  selected: {\n    borderColor: string;\n    backgroundColor: string;\n    bold: boolean;\n  };\n  unselected: {\n    opacity: number;\n  };\n  hoverLineWidthMultiplier: number;\n}\n\nconst DEFAULT_RESOLVED_APPEARANCE: ResolvedSelectionAppearance = {\n  selected: {\n    borderColor: \"#3b82f6\",\n    backgroundColor: \"#dbeafe\",\n    bold: true,\n  },\n  unselected: { opacity: 0.4 },\n  hoverLineWidthMultiplier: 5 / 3,\n};\n\nexport function resolveSelectionAppearance(\n  appearance?: PeakSelectionAppearance\n): ResolvedSelectionAppearance {\n  if (!appearance) return DEFAULT_RESOLVED_APPEARANCE;\n  const d = DEFAULT_RESOLVED_APPEARANCE;\n  return {\n    selected: {\n      borderColor: appearance.selected?.borderColor ?? d.selected.borderColor,\n      backgroundColor: appearance.selected?.backgroundColor ?? d.selected.backgroundColor,\n      bold: appearance.selected?.bold ?? d.selected.bold,\n    },\n    unselected: {\n      opacity: appearance.unselected?.opacity ?? d.unselected.opacity,\n    },\n    hoverLineWidthMultiplier:\n      appearance.hoverLineWidthMultiplier ?? d.hoverLineWidthMultiplier,\n  };\n}\n\n/**\n * Annotation slot positions for peak labels\n */\nexport const ANNOTATION_SLOTS = {\n  default: { ax: 0, ay: -35 },\n  overlap: [\n    { ax: 50, ay: -35 }, // Right, level 1\n    { ax: -60, ay: -35 }, // Left, level 1\n    { ax: 70, ay: -55 }, // Right, level 2\n    { ax: -80, ay: -55 }, // Left, level 2\n    { ax: 50, ay: -75 }, // Right, level 3\n    { ax: -60, ay: -75 }, // Left, level 3\n  ],\n};\n\n/**\n * Group overlapping peaks by retention time (x) proximity\n */\nexport function groupOverlappingPeaks(\n  peaksWithMeta: PeakWithMeta[],\n  overlapThreshold: number\n): PeakWithMeta[][] {\n  const sorted = [...peaksWithMeta].sort((a, b) => a.peak.x - b.peak.x);\n\n  const groups: PeakWithMeta[][] = [];\n  let currentGroup: PeakWithMeta[] = [];\n\n  for (const current of sorted) {\n    if (currentGroup.length === 0) {\n      currentGroup.push(current);\n      continue;\n    }\n\n    const lastInGroup = currentGroup[currentGroup.length - 1];\n    const timeDiff = Math.abs(current.peak.x - lastInGroup.peak.x);\n\n    if (timeDiff < overlapThreshold) {\n      currentGroup.push(current);\n    } else {\n      groups.push(currentGroup);\n      currentGroup = [current];\n    }\n  }\n\n  if (currentGroup.length > 0) {\n    groups.push(currentGroup);\n  }\n\n  return groups;\n}\n\ninterface PeakAnnotationOptions {\n  selectedPeakIds?: string[];\n  anySelected?: boolean;\n  appearance?: ResolvedSelectionAppearance;\n  annotationStyle?: \"arrow\" | \"inline\";\n}\n\ninterface AnnotationBorderStyle {\n  bgcolor: string;\n  bordercolor: string | undefined;\n  borderwidth: number;\n  opacity?: number;\n}\n\n/** Derives border/background/opacity from selection state — extracted to keep\n *  createPeakAnnotation within the allowed cognitive complexity budget. */\nfunction resolveAnnotationBorderStyle(\n  isSelected: boolean,\n  isDimmed: boolean,\n  isUserDefined: boolean,\n  seriesColor: string,\n  appearance: ResolvedSelectionAppearance,\n  hasColorOverride: boolean\n): AnnotationBorderStyle {\n  const bgcolor = isSelected\n    ? appearance.selected.backgroundColor\n    : CHROMATOGRAM_ANNOTATION.BACKGROUND_COLOR;\n  let bordercolor: string | undefined;\n  if (isSelected) {\n    bordercolor = appearance.selected.borderColor;\n  } else {\n    bordercolor = isUserDefined && !hasColorOverride ? undefined : seriesColor;\n  }\n  const borderwidth = isSelected ? 2 : isUserDefined && !hasColorOverride ? 0 : 1;\n  const opacity = isDimmed ? appearance.unselected.opacity : undefined;\n  return { bgcolor, bordercolor, borderwidth, ...(opacity === undefined ? {} : { opacity }) };\n}\n\n/** Builds an inline-style (no-arrow) annotation that floats above the trace point. */\nfunction createInlineAnnotation(\n  peak: PeakAnnotation,\n  text: string,\n  fontSize: number,\n  textColor: string,\n  isSelected: boolean,\n  isDimmed: boolean,\n  appearance: ResolvedSelectionAppearance\n): Partial<Plotly.Annotations> {\n  const opacity = isDimmed ? appearance.unselected.opacity : undefined;\n  return {\n    x: peak.x,\n    y: peak.y,\n    text,\n    showarrow: false,\n    yshift: CHROMATOGRAM_ANNOTATION.INLINE_YSHIFT,\n    yanchor: \"bottom\" as const,\n    xanchor: \"center\" as const,\n    font: {\n      size: fontSize,\n      color: isSelected ? appearance.selected.borderColor : textColor,\n      family: \"Inter, sans-serif\",\n    },\n    ...(opacity === undefined ? {} : { opacity }),\n  };\n}\n\n/**\n * Create a Plotly annotation for a peak.\n * seriesIndex of -1 indicates a user-defined annotation (uses grey/black styling).\n */\nexport function createPeakAnnotation(\n  peak: PeakAnnotation,\n  seriesIndex: number,\n  slot: { ax: number; ay: number },\n  options: PeakAnnotationOptions = {}\n): Partial<Plotly.Annotations> {\n  const {\n    selectedPeakIds = [],\n    anySelected = false,\n    appearance = DEFAULT_RESOLVED_APPEARANCE,\n    annotationStyle = \"arrow\",\n  } = options;\n\n  const isUserDefined = seriesIndex === -1;\n  const defaultColor = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_COLOR\n    : CHART_COLORS[seriesIndex % CHART_COLORS.length];\n  const color = peak.color ?? defaultColor;\n  const textColor = isUserDefined && !peak.color\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_TEXT_COLOR\n    : color;\n\n  const rawText = peak.text ?? (peak._computed?.area === undefined ? \"\" : `Area: ${peak._computed.area.toFixed(2)}`);\n\n  const isSelected = peak.id !== undefined && selectedPeakIds.includes(peak.id);\n  const isDimmed = !isSelected && anySelected;\n\n  const text = isSelected && appearance.selected.bold ? `<b>${rawText}</b>` : rawText;\n\n  const fontSize = isUserDefined\n    ? CHROMATOGRAM_ANNOTATION.USER_ANNOTATION_FONT_SIZE\n    : CHROMATOGRAM_ANNOTATION.AUTO_ANNOTATION_FONT_SIZE;\n\n  if (annotationStyle === \"inline\") {\n    return createInlineAnnotation(peak, text, fontSize, textColor, isSelected, isDimmed, appearance);\n  }\n\n  // For user-defined annotations, respect their ax/ay if provided\n  const ax = isUserDefined && peak.ax !== undefined ? peak.ax : slot.ax;\n  const ay = isUserDefined && peak.ay !== undefined ? peak.ay : slot.ay;\n\n  const borderStyle = resolveAnnotationBorderStyle(\n    isSelected, isDimmed, isUserDefined, color, appearance, peak.color !== undefined\n  );\n\n  return {\n    x: peak.x,\n    y: peak.y,\n    text,\n    showarrow: true,\n    arrowhead: 2,\n    arrowsize: 1,\n    arrowwidth: 1,\n    arrowcolor: color,\n    ax,\n    ay,\n    font: {\n      size: fontSize,\n      color: textColor,\n      family: \"Inter, sans-serif\",\n    },\n    borderpad: 2,\n    ...borderStyle,\n  };\n}\n\n/**\n * Create annotations for a group of peaks, handling overlap positioning\n */\nexport function createGroupAnnotations(\n  group: PeakWithMeta[],\n  options: PeakAnnotationOptions = {}\n): Partial<Plotly.Annotations>[] {\n  if (group.length === 1) {\n    const { peak, seriesIndex } = group[0];\n    return [createPeakAnnotation(peak, seriesIndex, ANNOTATION_SLOTS.default, options)];\n  }\n\n  // Sort by intensity (y, lowest first) so lower peaks get closer annotations\n  const sortedGroup = [...group].sort((a, b) => a.peak.y - b.peak.y);\n\n  return sortedGroup.map(({ peak, seriesIndex }, slotIndex) => {\n    const slot =\n      ANNOTATION_SLOTS.overlap[slotIndex % ANNOTATION_SLOTS.overlap.length];\n    return createPeakAnnotation(peak, seriesIndex, slot, options);\n  });\n}\n\n"],"names":["DEFAULT_RESOLVED_APPEARANCE","resolveSelectionAppearance","appearance","d","ANNOTATION_SLOTS","groupOverlappingPeaks","peaksWithMeta","overlapThreshold","sorted","a","b","groups","currentGroup","current","lastInGroup","resolveAnnotationBorderStyle","isSelected","isDimmed","isUserDefined","seriesColor","hasColorOverride","bgcolor","CHROMATOGRAM_ANNOTATION","bordercolor","borderwidth","opacity","createInlineAnnotation","peak","text","fontSize","textColor","createPeakAnnotation","seriesIndex","slot","options","selectedPeakIds","anySelected","annotationStyle","defaultColor","CHART_COLORS","color","rawText","ax","ay","borderStyle","createGroupAnnotations","group","slotIndex"],"mappings":"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"}

package/dist/components/charts/ChromatogramChart/boundaryMarkers.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("../../../utils/colors.cjs"),m=-5,y=-12,c=-16;function d(o,e,t,r){return t==="none"?[]:[{x:[o],y:[e],type:"scatter",mode:"markers",marker:{symbol:t==="diamond"?"diamond":"triangle-up",size:8,color:r},showlegend:!1,hoverinfo:"skip"}]}function T(o){const e=[];for(const{peaks:t,seriesIndex:r,x:s}of o){const a=f.seriesColor(r),i=m+r*c,u=y+r*c;for(const n of t){const k=n._computed?.startIndex??0,M=n._computed?.endIndex??0,l=s[k],p=s[M],R=n.startMarker??"triangle",_=n.endMarker??"diamond";e.push(...d(l,i,R,a)),e.push(...d(p,u,_,a))}}return e}exports.createBoundaryMarkerTraces=T;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../../../utils/colors.cjs"),m=-5,A=-12,d=-16;function i(n,e,o,r){return o==="none"?[]:[{x:[n],y:[e],type:"scatter",mode:"markers",marker:{symbol:o==="diamond"?"diamond":"triangle-up",size:8,color:r},showlegend:!1,hoverinfo:"skip"}]}function O(n){const e=[];for(const{peaks:o,seriesIndex:r,x:s}of n){const u=c.CHART_COLORS[r%c.CHART_COLORS.length],R=m+r*d,k=A+r*d;for(const t of o){const l=t._computed?.startIndex??0,M=t._computed?.endIndex??0,_=s[l],p=s[M],f=t.startMarker??"triangle",T=t.endMarker??"diamond",a=t.color??u;e.push(...i(_,R,f,a)),e.push(...i(p,k,T,a))}}return e}exports.createBoundaryMarkerTraces=O;
 //# sourceMappingURL=boundaryMarkers.cjs.map

package/dist/components/charts/ChromatogramChart/boundaryMarkers.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"boundaryMarkers.cjs","sources":["../../../../src/components/charts/ChromatogramChart/boundaryMarkers.ts"],"sourcesContent":["/**\n * Boundary marker utilities for ChromatogramChart\n */\n\nimport { seriesColor } from \"../../../utils/colors\";\n\nimport type { PeakAnnotation, BoundaryMarkerType } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n/** Base Y position for start boundary markers (below the x-axis) */\nconst BOUNDARY_MARKER_START_Y = -5;\n/** Y position for end boundary markers (below start markers) */\nconst BOUNDARY_MARKER_END_Y = -12;\n/** Y offset between series to prevent overlap */\nconst BOUNDARY_MARKER_SERIES_OFFSET = -16;\n\n/**\n * Create a marker trace for a boundary point.\n * Markers are placed on the x-axis below 0, staggered by series index.\n */\nfunction createMarkerTrace(\n  xPos: number,\n  yPos: number,\n  markerType: BoundaryMarkerType,\n  color: string\n): Plotly.Data[] {\n  if (markerType === \"none\") {\n    return [];\n  }\n\n  return [\n    {\n      x: [xPos],\n      y: [yPos],\n      type: \"scatter\" as const,\n      mode: \"markers\" as const,\n      marker: {\n        symbol: markerType === \"diamond\" ? (\"diamond\" as const) : (\"triangle-up\" as const),\n        size: 8,\n        color,\n      },\n      showlegend: false,\n      hoverinfo: \"skip\" as const,\n    },\n  ];\n}\n\n/**\n * Create boundary marker traces for peaks.\n * Uses per-peak startMarker/endMarker settings with defaults:\n * - startMarker: \"triangle\" (default)\n * - endMarker: \"diamond\" (default)\n */\nexport function createBoundaryMarkerTraces(\n  allPeaks: {\n    peaks: PeakAnnotation[];\n    seriesIndex: number;\n    x: number[];\n    y: number[];\n  }[]\n): Plotly.Data[] {\n  const traces: Plotly.Data[] = [];\n\n  for (const { peaks, seriesIndex, x } of allPeaks) {\n    const color = seriesColor(seriesIndex);\n    // Separate y positions for start vs end markers to prevent overlap when peaks are adjacent\n    // Also stagger by series index to prevent overlap between different traces\n    const startMarkerY = BOUNDARY_MARKER_START_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n    const endMarkerY = BOUNDARY_MARKER_END_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n\n    for (const peak of peaks) {\n      const startIdx = peak._computed?.startIndex ?? 0;\n      const endIdx = peak._computed?.endIndex ?? 0;\n      const startX = x[startIdx];\n      const endX = x[endIdx];\n\n      // Get marker types with defaults: triangle at start, diamond at end\n      const startMarkerType = peak.startMarker ?? \"triangle\";\n      const endMarkerType = peak.endMarker ?? \"diamond\";\n\n      // Create start boundary marker (upper row, staggered by series)\n      traces.push(...createMarkerTrace(startX, startMarkerY, startMarkerType, color));\n\n      // Create end boundary marker (lower row, staggered by series)\n      traces.push(...createMarkerTrace(endX, endMarkerY, endMarkerType, color));\n    }\n  }\n\n  return traces;\n}\n\n"],"names":["BOUNDARY_MARKER_START_Y","BOUNDARY_MARKER_END_Y","BOUNDARY_MARKER_SERIES_OFFSET","createMarkerTrace","xPos","yPos","markerType","color","createBoundaryMarkerTraces","allPeaks","traces","peaks","seriesIndex","x","seriesColor","startMarkerY","endMarkerY","peak","startIdx","endIdx","startX","endX","startMarkerType","endMarkerType"],"mappings":"6HAUMA,EAA0B,GAE1BC,EAAwB,IAExBC,EAAgC,IAMtC,SAASC,EACPC,EACAC,EACAC,EACAC,EACe,CACf,OAAID,IAAe,OACV,CAAA,EAGF,CACL,CACE,EAAG,CAACF,CAAI,EACR,EAAG,CAACC,CAAI,EACR,KAAM,UACN,KAAM,UACN,OAAQ,CACN,OAAQC,IAAe,UAAa,UAAuB,cAC3D,KAAM,EACN,MAAAC,CAAA,EAEF,WAAY,GACZ,UAAW,MAAA,CACb,CAEJ,CAQO,SAASC,EACdC,EAMe,CACf,MAAMC,EAAwB,CAAA,EAE9B,SAAW,CAAE,MAAAC,EAAO,YAAAC,EAAa,EAAAC,CAAA,IAAOJ,EAAU,CAChD,MAAMF,EAAQO,EAAAA,YAAYF,CAAW,EAG/BG,EAAef,EAA0BY,EAAcV,EACvDc,EAAaf,EAAwBW,EAAcV,EAEzD,UAAWe,KAAQN,EAAO,CACxB,MAAMO,EAAWD,EAAK,WAAW,YAAc,EACzCE,EAASF,EAAK,WAAW,UAAY,EACrCG,EAASP,EAAEK,CAAQ,EACnBG,EAAOR,EAAEM,CAAM,EAGfG,EAAkBL,EAAK,aAAe,WACtCM,EAAgBN,EAAK,WAAa,UAGxCP,EAAO,KAAK,GAAGP,EAAkBiB,EAAQL,EAAcO,EAAiBf,CAAK,CAAC,EAG9EG,EAAO,KAAK,GAAGP,EAAkBkB,EAAML,EAAYO,EAAehB,CAAK,CAAC,CAC1E,CACF,CAEA,OAAOG,CACT"}
+{"version":3,"file":"boundaryMarkers.cjs","sources":["../../../../src/components/charts/ChromatogramChart/boundaryMarkers.ts"],"sourcesContent":["/**\n * Boundary marker utilities for ChromatogramChart\n */\n\nimport { CHART_COLORS } from \"../../../utils/colors\";\n\nimport type { PeakAnnotation, BoundaryMarkerType } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n/** Base Y position for start boundary markers (below the x-axis) */\nconst BOUNDARY_MARKER_START_Y = -5;\n/** Y position for end boundary markers (below start markers) */\nconst BOUNDARY_MARKER_END_Y = -12;\n/** Y offset between series to prevent overlap */\nconst BOUNDARY_MARKER_SERIES_OFFSET = -16;\n\n/**\n * Create a marker trace for a boundary point.\n * Markers are placed on the x-axis below 0, staggered by series index.\n */\nfunction createMarkerTrace(\n  xPos: number,\n  yPos: number,\n  markerType: BoundaryMarkerType,\n  color: string\n): Plotly.Data[] {\n  if (markerType === \"none\") {\n    return [];\n  }\n\n  return [\n    {\n      x: [xPos],\n      y: [yPos],\n      type: \"scatter\" as const,\n      mode: \"markers\" as const,\n      marker: {\n        symbol: markerType === \"diamond\" ? (\"diamond\" as const) : (\"triangle-up\" as const),\n        size: 8,\n        color,\n      },\n      showlegend: false,\n      hoverinfo: \"skip\" as const,\n    },\n  ];\n}\n\n/**\n * Create boundary marker traces for peaks.\n * Uses per-peak startMarker/endMarker settings with defaults:\n * - startMarker: \"triangle\" (default)\n * - endMarker: \"diamond\" (default)\n */\nexport function createBoundaryMarkerTraces(\n  allPeaks: {\n    peaks: PeakAnnotation[];\n    seriesIndex: number;\n    x: number[];\n    y: number[];\n  }[]\n): Plotly.Data[] {\n  const traces: Plotly.Data[] = [];\n\n  for (const { peaks, seriesIndex, x } of allPeaks) {\n    const seriesColor = CHART_COLORS[seriesIndex % CHART_COLORS.length];\n    // Separate y positions for start vs end markers to prevent overlap when peaks are adjacent\n    // Also stagger by series index to prevent overlap between different traces\n    const startMarkerY = BOUNDARY_MARKER_START_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n    const endMarkerY = BOUNDARY_MARKER_END_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n\n    for (const peak of peaks) {\n      const startIdx = peak._computed?.startIndex ?? 0;\n      const endIdx = peak._computed?.endIndex ?? 0;\n      const startX = x[startIdx];\n      const endX = x[endIdx];\n\n      // Get marker types with defaults: triangle at start, diamond at end\n      const startMarkerType = peak.startMarker ?? \"triangle\";\n      const endMarkerType = peak.endMarker ?? \"diamond\";\n\n      const color = peak.color ?? seriesColor;\n\n      // Create start boundary marker (upper row, staggered by series)\n      traces.push(...createMarkerTrace(startX, startMarkerY, startMarkerType, color));\n\n      // Create end boundary marker (lower row, staggered by series)\n      traces.push(...createMarkerTrace(endX, endMarkerY, endMarkerType, color));\n    }\n  }\n\n  return traces;\n}\n\n"],"names":["BOUNDARY_MARKER_START_Y","BOUNDARY_MARKER_END_Y","BOUNDARY_MARKER_SERIES_OFFSET","createMarkerTrace","xPos","yPos","markerType","color","createBoundaryMarkerTraces","allPeaks","traces","peaks","seriesIndex","x","seriesColor","CHART_COLORS","startMarkerY","endMarkerY","peak","startIdx","endIdx","startX","endX","startMarkerType","endMarkerType"],"mappings":"6HAUMA,EAA0B,GAE1BC,EAAwB,IAExBC,EAAgC,IAMtC,SAASC,EACPC,EACAC,EACAC,EACAC,EACe,CACf,OAAID,IAAe,OACV,CAAA,EAGF,CACL,CACE,EAAG,CAACF,CAAI,EACR,EAAG,CAACC,CAAI,EACR,KAAM,UACN,KAAM,UACN,OAAQ,CACN,OAAQC,IAAe,UAAa,UAAuB,cAC3D,KAAM,EACN,MAAAC,CAAA,EAEF,WAAY,GACZ,UAAW,MAAA,CACb,CAEJ,CAQO,SAASC,EACdC,EAMe,CACf,MAAMC,EAAwB,CAAA,EAE9B,SAAW,CAAE,MAAAC,EAAO,YAAAC,EAAa,EAAAC,CAAA,IAAOJ,EAAU,CAChD,MAAMK,EAAcC,EAAAA,aAAaH,EAAcG,EAAAA,aAAa,MAAM,EAG5DC,EAAehB,EAA0BY,EAAcV,EACvDe,EAAahB,EAAwBW,EAAcV,EAEzD,UAAWgB,KAAQP,EAAO,CACxB,MAAMQ,EAAWD,EAAK,WAAW,YAAc,EACzCE,EAASF,EAAK,WAAW,UAAY,EACrCG,EAASR,EAAEM,CAAQ,EACnBG,EAAOT,EAAEO,CAAM,EAGfG,EAAkBL,EAAK,aAAe,WACtCM,EAAgBN,EAAK,WAAa,UAElCX,EAAQW,EAAK,OAASJ,EAG5BJ,EAAO,KAAK,GAAGP,EAAkBkB,EAAQL,EAAcO,EAAiBhB,CAAK,CAAC,EAG9EG,EAAO,KAAK,GAAGP,EAAkBmB,EAAML,EAAYO,EAAejB,CAAK,CAAC,CAC1E,CACF,CAEA,OAAOG,CACT"}

package/dist/components/charts/ChromatogramChart/boundaryMarkers.js

@@ -1,14 +1,14 @@
-import { seriesColor as m } from "../../../utils/colors.js";
-const x = -5, l = -12, c = -16;
-function d(o, e, t, r) {
-  return t === "none" ? [] : [
+import { CHART_COLORS as c } from "../../../utils/colors.js";
+const x = -5, A = -12, d = -16;
+function i(o, e, n, r) {
+  return n === "none" ? [] : [
     {
       x: [o],
       y: [e],
       type: "scatter",
       mode: "markers",
       marker: {
-        symbol: t === "diamond" ? "diamond" : "triangle-up",
+        symbol: n === "diamond" ? "diamond" : "triangle-up",
         size: 8,
         color: r
       },
@@ -17,18 +17,18 @@ function d(o, e, t, r) {
     }
   ];
 }
-function E(o) {
+function T(o) {
   const e = [];
-  for (const { peaks: t, seriesIndex: r, x: s } of o) {
-    const a = m(r), i = x + r * c, k = l + r * c;
-    for (const n of t) {
-      const p = n._computed?.startIndex ?? 0, u = n._computed?.endIndex ?? 0, M = s[p], R = s[u], _ = n.startMarker ?? "triangle", f = n.endMarker ?? "diamond";
-      e.push(...d(M, i, _, a)), e.push(...d(R, k, f, a));
+  for (const { peaks: n, seriesIndex: r, x: s } of o) {
+    const R = c[r % c.length], k = x + r * d, p = A + r * d;
+    for (const t of n) {
+      const _ = t._computed?.startIndex ?? 0, u = t._computed?.endIndex ?? 0, M = s[_], f = s[u], m = t.startMarker ?? "triangle", l = t.endMarker ?? "diamond", a = t.color ?? R;
+      e.push(...i(M, k, m, a)), e.push(...i(f, p, l, a));
     }
   }
   return e;
 }
 export {
-  E as createBoundaryMarkerTraces
+  T as createBoundaryMarkerTraces
 };
 //# sourceMappingURL=boundaryMarkers.js.map

package/dist/components/charts/ChromatogramChart/boundaryMarkers.js.map

@@ -1 +1 @@
-{"version":3,"file":"boundaryMarkers.js","sources":["../../../../src/components/charts/ChromatogramChart/boundaryMarkers.ts"],"sourcesContent":["/**\n * Boundary marker utilities for ChromatogramChart\n */\n\nimport { seriesColor } from \"../../../utils/colors\";\n\nimport type { PeakAnnotation, BoundaryMarkerType } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n/** Base Y position for start boundary markers (below the x-axis) */\nconst BOUNDARY_MARKER_START_Y = -5;\n/** Y position for end boundary markers (below start markers) */\nconst BOUNDARY_MARKER_END_Y = -12;\n/** Y offset between series to prevent overlap */\nconst BOUNDARY_MARKER_SERIES_OFFSET = -16;\n\n/**\n * Create a marker trace for a boundary point.\n * Markers are placed on the x-axis below 0, staggered by series index.\n */\nfunction createMarkerTrace(\n  xPos: number,\n  yPos: number,\n  markerType: BoundaryMarkerType,\n  color: string\n): Plotly.Data[] {\n  if (markerType === \"none\") {\n    return [];\n  }\n\n  return [\n    {\n      x: [xPos],\n      y: [yPos],\n      type: \"scatter\" as const,\n      mode: \"markers\" as const,\n      marker: {\n        symbol: markerType === \"diamond\" ? (\"diamond\" as const) : (\"triangle-up\" as const),\n        size: 8,\n        color,\n      },\n      showlegend: false,\n      hoverinfo: \"skip\" as const,\n    },\n  ];\n}\n\n/**\n * Create boundary marker traces for peaks.\n * Uses per-peak startMarker/endMarker settings with defaults:\n * - startMarker: \"triangle\" (default)\n * - endMarker: \"diamond\" (default)\n */\nexport function createBoundaryMarkerTraces(\n  allPeaks: {\n    peaks: PeakAnnotation[];\n    seriesIndex: number;\n    x: number[];\n    y: number[];\n  }[]\n): Plotly.Data[] {\n  const traces: Plotly.Data[] = [];\n\n  for (const { peaks, seriesIndex, x } of allPeaks) {\n    const color = seriesColor(seriesIndex);\n    // Separate y positions for start vs end markers to prevent overlap when peaks are adjacent\n    // Also stagger by series index to prevent overlap between different traces\n    const startMarkerY = BOUNDARY_MARKER_START_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n    const endMarkerY = BOUNDARY_MARKER_END_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n\n    for (const peak of peaks) {\n      const startIdx = peak._computed?.startIndex ?? 0;\n      const endIdx = peak._computed?.endIndex ?? 0;\n      const startX = x[startIdx];\n      const endX = x[endIdx];\n\n      // Get marker types with defaults: triangle at start, diamond at end\n      const startMarkerType = peak.startMarker ?? \"triangle\";\n      const endMarkerType = peak.endMarker ?? \"diamond\";\n\n      // Create start boundary marker (upper row, staggered by series)\n      traces.push(...createMarkerTrace(startX, startMarkerY, startMarkerType, color));\n\n      // Create end boundary marker (lower row, staggered by series)\n      traces.push(...createMarkerTrace(endX, endMarkerY, endMarkerType, color));\n    }\n  }\n\n  return traces;\n}\n\n"],"names":["BOUNDARY_MARKER_START_Y","BOUNDARY_MARKER_END_Y","BOUNDARY_MARKER_SERIES_OFFSET","createMarkerTrace","xPos","yPos","markerType","color","createBoundaryMarkerTraces","allPeaks","traces","peaks","seriesIndex","x","seriesColor","startMarkerY","endMarkerY","peak","startIdx","endIdx","startX","endX","startMarkerType","endMarkerType"],"mappings":";AAUA,MAAMA,IAA0B,IAE1BC,IAAwB,KAExBC,IAAgC;AAMtC,SAASC,EACPC,GACAC,GACAC,GACAC,GACe;AACf,SAAID,MAAe,SACV,CAAA,IAGF;AAAA,IACL;AAAA,MACE,GAAG,CAACF,CAAI;AAAA,MACR,GAAG,CAACC,CAAI;AAAA,MACR,MAAM;AAAA,MACN,MAAM;AAAA,MACN,QAAQ;AAAA,QACN,QAAQC,MAAe,YAAa,YAAuB;AAAA,QAC3D,MAAM;AAAA,QACN,OAAAC;AAAA,MAAA;AAAA,MAEF,YAAY;AAAA,MACZ,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ;AAQO,SAASC,EACdC,GAMe;AACf,QAAMC,IAAwB,CAAA;AAE9B,aAAW,EAAE,OAAAC,GAAO,aAAAC,GAAa,GAAAC,EAAA,KAAOJ,GAAU;AAChD,UAAMF,IAAQO,EAAYF,CAAW,GAG/BG,IAAef,IAA0BY,IAAcV,GACvDc,IAAaf,IAAwBW,IAAcV;AAEzD,eAAWe,KAAQN,GAAO;AACxB,YAAMO,IAAWD,EAAK,WAAW,cAAc,GACzCE,IAASF,EAAK,WAAW,YAAY,GACrCG,IAASP,EAAEK,CAAQ,GACnBG,IAAOR,EAAEM,CAAM,GAGfG,IAAkBL,EAAK,eAAe,YACtCM,IAAgBN,EAAK,aAAa;AAGxC,MAAAP,EAAO,KAAK,GAAGP,EAAkBiB,GAAQL,GAAcO,GAAiBf,CAAK,CAAC,GAG9EG,EAAO,KAAK,GAAGP,EAAkBkB,GAAML,GAAYO,GAAehB,CAAK,CAAC;AAAA,IAC1E;AAAA,EACF;AAEA,SAAOG;AACT;"}
+{"version":3,"file":"boundaryMarkers.js","sources":["../../../../src/components/charts/ChromatogramChart/boundaryMarkers.ts"],"sourcesContent":["/**\n * Boundary marker utilities for ChromatogramChart\n */\n\nimport { CHART_COLORS } from \"../../../utils/colors\";\n\nimport type { PeakAnnotation, BoundaryMarkerType } from \"./types\";\nimport type Plotly from \"plotly.js-dist\";\n\n/** Base Y position for start boundary markers (below the x-axis) */\nconst BOUNDARY_MARKER_START_Y = -5;\n/** Y position for end boundary markers (below start markers) */\nconst BOUNDARY_MARKER_END_Y = -12;\n/** Y offset between series to prevent overlap */\nconst BOUNDARY_MARKER_SERIES_OFFSET = -16;\n\n/**\n * Create a marker trace for a boundary point.\n * Markers are placed on the x-axis below 0, staggered by series index.\n */\nfunction createMarkerTrace(\n  xPos: number,\n  yPos: number,\n  markerType: BoundaryMarkerType,\n  color: string\n): Plotly.Data[] {\n  if (markerType === \"none\") {\n    return [];\n  }\n\n  return [\n    {\n      x: [xPos],\n      y: [yPos],\n      type: \"scatter\" as const,\n      mode: \"markers\" as const,\n      marker: {\n        symbol: markerType === \"diamond\" ? (\"diamond\" as const) : (\"triangle-up\" as const),\n        size: 8,\n        color,\n      },\n      showlegend: false,\n      hoverinfo: \"skip\" as const,\n    },\n  ];\n}\n\n/**\n * Create boundary marker traces for peaks.\n * Uses per-peak startMarker/endMarker settings with defaults:\n * - startMarker: \"triangle\" (default)\n * - endMarker: \"diamond\" (default)\n */\nexport function createBoundaryMarkerTraces(\n  allPeaks: {\n    peaks: PeakAnnotation[];\n    seriesIndex: number;\n    x: number[];\n    y: number[];\n  }[]\n): Plotly.Data[] {\n  const traces: Plotly.Data[] = [];\n\n  for (const { peaks, seriesIndex, x } of allPeaks) {\n    const seriesColor = CHART_COLORS[seriesIndex % CHART_COLORS.length];\n    // Separate y positions for start vs end markers to prevent overlap when peaks are adjacent\n    // Also stagger by series index to prevent overlap between different traces\n    const startMarkerY = BOUNDARY_MARKER_START_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n    const endMarkerY = BOUNDARY_MARKER_END_Y + seriesIndex * BOUNDARY_MARKER_SERIES_OFFSET;\n\n    for (const peak of peaks) {\n      const startIdx = peak._computed?.startIndex ?? 0;\n      const endIdx = peak._computed?.endIndex ?? 0;\n      const startX = x[startIdx];\n      const endX = x[endIdx];\n\n      // Get marker types with defaults: triangle at start, diamond at end\n      const startMarkerType = peak.startMarker ?? \"triangle\";\n      const endMarkerType = peak.endMarker ?? \"diamond\";\n\n      const color = peak.color ?? seriesColor;\n\n      // Create start boundary marker (upper row, staggered by series)\n      traces.push(...createMarkerTrace(startX, startMarkerY, startMarkerType, color));\n\n      // Create end boundary marker (lower row, staggered by series)\n      traces.push(...createMarkerTrace(endX, endMarkerY, endMarkerType, color));\n    }\n  }\n\n  return traces;\n}\n\n"],"names":["BOUNDARY_MARKER_START_Y","BOUNDARY_MARKER_END_Y","BOUNDARY_MARKER_SERIES_OFFSET","createMarkerTrace","xPos","yPos","markerType","color","createBoundaryMarkerTraces","allPeaks","traces","peaks","seriesIndex","x","seriesColor","CHART_COLORS","startMarkerY","endMarkerY","peak","startIdx","endIdx","startX","endX","startMarkerType","endMarkerType"],"mappings":";AAUA,MAAMA,IAA0B,IAE1BC,IAAwB,KAExBC,IAAgC;AAMtC,SAASC,EACPC,GACAC,GACAC,GACAC,GACe;AACf,SAAID,MAAe,SACV,CAAA,IAGF;AAAA,IACL;AAAA,MACE,GAAG,CAACF,CAAI;AAAA,MACR,GAAG,CAACC,CAAI;AAAA,MACR,MAAM;AAAA,MACN,MAAM;AAAA,MACN,QAAQ;AAAA,QACN,QAAQC,MAAe,YAAa,YAAuB;AAAA,QAC3D,MAAM;AAAA,QACN,OAAAC;AAAA,MAAA;AAAA,MAEF,YAAY;AAAA,MACZ,WAAW;AAAA,IAAA;AAAA,EACb;AAEJ;AAQO,SAASC,EACdC,GAMe;AACf,QAAMC,IAAwB,CAAA;AAE9B,aAAW,EAAE,OAAAC,GAAO,aAAAC,GAAa,GAAAC,EAAA,KAAOJ,GAAU;AAChD,UAAMK,IAAcC,EAAaH,IAAcG,EAAa,MAAM,GAG5DC,IAAehB,IAA0BY,IAAcV,GACvDe,IAAahB,IAAwBW,IAAcV;AAEzD,eAAWgB,KAAQP,GAAO;AACxB,YAAMQ,IAAWD,EAAK,WAAW,cAAc,GACzCE,IAASF,EAAK,WAAW,YAAY,GACrCG,IAASR,EAAEM,CAAQ,GACnBG,IAAOT,EAAEO,CAAM,GAGfG,IAAkBL,EAAK,eAAe,YACtCM,IAAgBN,EAAK,aAAa,WAElCX,IAAQW,EAAK,SAASJ;AAG5B,MAAAJ,EAAO,KAAK,GAAGP,EAAkBkB,GAAQL,GAAcO,GAAiBhB,CAAK,CAAC,GAG9EG,EAAO,KAAK,GAAGP,EAAkBmB,GAAML,GAAYO,GAAejB,CAAK,CAAC;AAAA,IAC1E;AAAA,EACF;AAEA,SAAOG;AACT;"}

package/dist/components/charts/ChromatogramChart/constants.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O={MARGIN_LEFT:70,MARGIN_RIGHT:30,MARGIN_BOTTOM:60,MARGIN_TOP_WITH_TITLE:50,MARGIN_TOP_NO_TITLE:30,MARGIN_PAD:5},T={USER_ANNOTATION_FONT_SIZE:11,AUTO_ANNOTATION_FONT_SIZE:10,USER_ANNOTATION_COLOR:"rgba(100, 116, 139, 1)",USER_ANNOTATION_TEXT_COLOR:"rgba(26, 26, 26, 1)",BACKGROUND_COLOR:"#ffffff"};exports.CHROMATOGRAM_ANNOTATION=T;exports.CHROMATOGRAM_LAYOUT=O;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O={MARGIN_LEFT:70,MARGIN_RIGHT:30,MARGIN_BOTTOM:60,MARGIN_TOP_WITH_TITLE:50,MARGIN_TOP_NO_TITLE:30,MARGIN_PAD:5},T={USER_ANNOTATION_FONT_SIZE:11,AUTO_ANNOTATION_FONT_SIZE:10,USER_ANNOTATION_COLOR:"rgba(100, 116, 139, 1)",USER_ANNOTATION_TEXT_COLOR:"rgba(26, 26, 26, 1)",BACKGROUND_COLOR:"#ffffff",INLINE_YSHIFT:4},A={BASE_LINE_WIDTH:1.5};exports.CHROMATOGRAM_ANNOTATION=T;exports.CHROMATOGRAM_LAYOUT=O;exports.CHROMATOGRAM_TRACE=A;
 //# sourceMappingURL=constants.cjs.map

package/dist/components/charts/ChromatogramChart/constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"constants.cjs","sources":["../../../../src/components/charts/ChromatogramChart/constants.ts"],"sourcesContent":["/**\n * Constants for ChromatogramChart component\n */\n\n/**\n * Layout constants for chart margins and spacing\n */\nexport const CHROMATOGRAM_LAYOUT = {\n  /** Left margin in pixels */\n  MARGIN_LEFT: 70,\n  /** Right margin in pixels */\n  MARGIN_RIGHT: 30,\n  /** Bottom margin in pixels */\n  MARGIN_BOTTOM: 60,\n  /** Top margin with title in pixels */\n  MARGIN_TOP_WITH_TITLE: 50,\n  /** Top margin without title in pixels */\n  MARGIN_TOP_NO_TITLE: 30,\n  /** Padding around plot area */\n  MARGIN_PAD: 5,\n} as const;\n\n/**\n * Annotation constants for peak labels and markers\n */\nexport const CHROMATOGRAM_ANNOTATION = {\n  /** Default vertical offset for annotation arrows (negative = above point) */\n  DEFAULT_ARROW_OFFSET_Y: -30,\n  /** Font size for user-defined annotations */\n  USER_ANNOTATION_FONT_SIZE: 11,\n  /** Font size for auto-detected peak annotations */\n  AUTO_ANNOTATION_FONT_SIZE: 10,\n  /** Arrow color for user-defined annotations (grey 500) */\n  USER_ANNOTATION_COLOR: \"rgba(100, 116, 139, 1)\",\n  /** Text color for user-defined annotations (black 900) */\n  USER_ANNOTATION_TEXT_COLOR: \"rgba(26, 26, 26, 1)\",\n  /** Background color behind annotation text */\n  BACKGROUND_COLOR: \"#ffffff\",\n} as const;\n\n"],"names":["CHROMATOGRAM_LAYOUT","CHROMATOGRAM_ANNOTATION"],"mappings":"gFAOO,MAAMA,EAAsB,CAEjC,YAAa,GAEb,aAAc,GAEd,cAAe,GAEf,sBAAuB,GAEvB,oBAAqB,GAErB,WAAY,CACd,EAKaC,EAA0B,CAIrC,0BAA2B,GAE3B,0BAA2B,GAE3B,sBAAuB,yBAEvB,2BAA4B,sBAE5B,iBAAkB,SACpB"}
+{"version":3,"file":"constants.cjs","sources":["../../../../src/components/charts/ChromatogramChart/constants.ts"],"sourcesContent":["/**\n * Constants for ChromatogramChart component\n */\n\n/**\n * Layout constants for chart margins and spacing\n */\nexport const CHROMATOGRAM_LAYOUT = {\n  /** Left margin in pixels */\n  MARGIN_LEFT: 70,\n  /** Right margin in pixels */\n  MARGIN_RIGHT: 30,\n  /** Bottom margin in pixels */\n  MARGIN_BOTTOM: 60,\n  /** Top margin with title in pixels */\n  MARGIN_TOP_WITH_TITLE: 50,\n  /** Top margin without title in pixels */\n  MARGIN_TOP_NO_TITLE: 30,\n  /** Padding around plot area */\n  MARGIN_PAD: 5,\n} as const;\n\n/**\n * Annotation constants for peak labels and markers\n */\nexport const CHROMATOGRAM_ANNOTATION = {\n  /** Default vertical offset for annotation arrows (negative = above point) */\n  DEFAULT_ARROW_OFFSET_Y: -30,\n  /** Font size for user-defined annotations */\n  USER_ANNOTATION_FONT_SIZE: 11,\n  /** Font size for auto-detected peak annotations */\n  AUTO_ANNOTATION_FONT_SIZE: 10,\n  /** Arrow color for user-defined annotations (grey 500) */\n  USER_ANNOTATION_COLOR: \"rgba(100, 116, 139, 1)\",\n  /** Text color for user-defined annotations (black 900) */\n  USER_ANNOTATION_TEXT_COLOR: \"rgba(26, 26, 26, 1)\",\n  /** Background color behind annotation text */\n  BACKGROUND_COLOR: \"#ffffff\",\n  /** Pixel offset above the data point for inline-style annotations (no arrow) */\n  INLINE_YSHIFT: 4,\n} as const;\n\n/**\n * Trace rendering constants\n */\nexport const CHROMATOGRAM_TRACE = {\n  /** Base line width in pixels for all series traces */\n  BASE_LINE_WIDTH: 1.5,\n} as const;\n\n\n"],"names":["CHROMATOGRAM_LAYOUT","CHROMATOGRAM_ANNOTATION","CHROMATOGRAM_TRACE"],"mappings":"gFAOO,MAAMA,EAAsB,CAEjC,YAAa,GAEb,aAAc,GAEd,cAAe,GAEf,sBAAuB,GAEvB,oBAAqB,GAErB,WAAY,CACd,EAKaC,EAA0B,CAIrC,0BAA2B,GAE3B,0BAA2B,GAE3B,sBAAuB,yBAEvB,2BAA4B,sBAE5B,iBAAkB,UAElB,cAAe,CACjB,EAKaC,EAAqB,CAEhC,gBAAiB,GACnB"}

package/dist/components/charts/ChromatogramChart/constants.js

@@ -1,4 +1,4 @@
-const O = {
+const T = {
   /** Left margin in pixels */
   MARGIN_LEFT: 70,
   /** Right margin in pixels */
@@ -11,7 +11,7 @@ const O = {
   MARGIN_TOP_NO_TITLE: 30,
   /** Padding around plot area */
   MARGIN_PAD: 5
-}, T = {
+}, O = {
   /** Font size for user-defined annotations */
   USER_ANNOTATION_FONT_SIZE: 11,
   /** Font size for auto-detected peak annotations */
@@ -21,10 +21,16 @@ const O = {
   /** Text color for user-defined annotations (black 900) */
   USER_ANNOTATION_TEXT_COLOR: "rgba(26, 26, 26, 1)",
   /** Background color behind annotation text */
-  BACKGROUND_COLOR: "#ffffff"
+  BACKGROUND_COLOR: "#ffffff",
+  /** Pixel offset above the data point for inline-style annotations (no arrow) */
+  INLINE_YSHIFT: 4
+}, A = {
+  /** Base line width in pixels for all series traces */
+  BASE_LINE_WIDTH: 1.5
 };
 export {
-  T as CHROMATOGRAM_ANNOTATION,
-  O as CHROMATOGRAM_LAYOUT
+  O as CHROMATOGRAM_ANNOTATION,
+  T as CHROMATOGRAM_LAYOUT,
+  A as CHROMATOGRAM_TRACE
 };
 //# sourceMappingURL=constants.js.map

package/dist/components/charts/ChromatogramChart/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/components/charts/ChromatogramChart/constants.ts"],"sourcesContent":["/**\n * Constants for ChromatogramChart component\n */\n\n/**\n * Layout constants for chart margins and spacing\n */\nexport const CHROMATOGRAM_LAYOUT = {\n  /** Left margin in pixels */\n  MARGIN_LEFT: 70,\n  /** Right margin in pixels */\n  MARGIN_RIGHT: 30,\n  /** Bottom margin in pixels */\n  MARGIN_BOTTOM: 60,\n  /** Top margin with title in pixels */\n  MARGIN_TOP_WITH_TITLE: 50,\n  /** Top margin without title in pixels */\n  MARGIN_TOP_NO_TITLE: 30,\n  /** Padding around plot area */\n  MARGIN_PAD: 5,\n} as const;\n\n/**\n * Annotation constants for peak labels and markers\n */\nexport const CHROMATOGRAM_ANNOTATION = {\n  /** Default vertical offset for annotation arrows (negative = above point) */\n  DEFAULT_ARROW_OFFSET_Y: -30,\n  /** Font size for user-defined annotations */\n  USER_ANNOTATION_FONT_SIZE: 11,\n  /** Font size for auto-detected peak annotations */\n  AUTO_ANNOTATION_FONT_SIZE: 10,\n  /** Arrow color for user-defined annotations (grey 500) */\n  USER_ANNOTATION_COLOR: \"rgba(100, 116, 139, 1)\",\n  /** Text color for user-defined annotations (black 900) */\n  USER_ANNOTATION_TEXT_COLOR: \"rgba(26, 26, 26, 1)\",\n  /** Background color behind annotation text */\n  BACKGROUND_COLOR: \"#ffffff\",\n} as const;\n\n"],"names":["CHROMATOGRAM_LAYOUT","CHROMATOGRAM_ANNOTATION"],"mappings":"AAOO,MAAMA,IAAsB;AAAA;AAAA,EAEjC,aAAa;AAAA;AAAA,EAEb,cAAc;AAAA;AAAA,EAEd,eAAe;AAAA;AAAA,EAEf,uBAAuB;AAAA;AAAA,EAEvB,qBAAqB;AAAA;AAAA,EAErB,YAAY;AACd,GAKaC,IAA0B;AAAA;AAAA,EAIrC,2BAA2B;AAAA;AAAA,EAE3B,2BAA2B;AAAA;AAAA,EAE3B,uBAAuB;AAAA;AAAA,EAEvB,4BAA4B;AAAA;AAAA,EAE5B,kBAAkB;AACpB;"}
+{"version":3,"file":"constants.js","sources":["../../../../src/components/charts/ChromatogramChart/constants.ts"],"sourcesContent":["/**\n * Constants for ChromatogramChart component\n */\n\n/**\n * Layout constants for chart margins and spacing\n */\nexport const CHROMATOGRAM_LAYOUT = {\n  /** Left margin in pixels */\n  MARGIN_LEFT: 70,\n  /** Right margin in pixels */\n  MARGIN_RIGHT: 30,\n  /** Bottom margin in pixels */\n  MARGIN_BOTTOM: 60,\n  /** Top margin with title in pixels */\n  MARGIN_TOP_WITH_TITLE: 50,\n  /** Top margin without title in pixels */\n  MARGIN_TOP_NO_TITLE: 30,\n  /** Padding around plot area */\n  MARGIN_PAD: 5,\n} as const;\n\n/**\n * Annotation constants for peak labels and markers\n */\nexport const CHROMATOGRAM_ANNOTATION = {\n  /** Default vertical offset for annotation arrows (negative = above point) */\n  DEFAULT_ARROW_OFFSET_Y: -30,\n  /** Font size for user-defined annotations */\n  USER_ANNOTATION_FONT_SIZE: 11,\n  /** Font size for auto-detected peak annotations */\n  AUTO_ANNOTATION_FONT_SIZE: 10,\n  /** Arrow color for user-defined annotations (grey 500) */\n  USER_ANNOTATION_COLOR: \"rgba(100, 116, 139, 1)\",\n  /** Text color for user-defined annotations (black 900) */\n  USER_ANNOTATION_TEXT_COLOR: \"rgba(26, 26, 26, 1)\",\n  /** Background color behind annotation text */\n  BACKGROUND_COLOR: \"#ffffff\",\n  /** Pixel offset above the data point for inline-style annotations (no arrow) */\n  INLINE_YSHIFT: 4,\n} as const;\n\n/**\n * Trace rendering constants\n */\nexport const CHROMATOGRAM_TRACE = {\n  /** Base line width in pixels for all series traces */\n  BASE_LINE_WIDTH: 1.5,\n} as const;\n\n\n"],"names":["CHROMATOGRAM_LAYOUT","CHROMATOGRAM_ANNOTATION","CHROMATOGRAM_TRACE"],"mappings":"AAOO,MAAMA,IAAsB;AAAA;AAAA,EAEjC,aAAa;AAAA;AAAA,EAEb,cAAc;AAAA;AAAA,EAEd,eAAe;AAAA;AAAA,EAEf,uBAAuB;AAAA;AAAA,EAEvB,qBAAqB;AAAA;AAAA,EAErB,YAAY;AACd,GAKaC,IAA0B;AAAA;AAAA,EAIrC,2BAA2B;AAAA;AAAA,EAE3B,2BAA2B;AAAA;AAAA,EAE3B,uBAAuB;AAAA;AAAA,EAEvB,4BAA4B;AAAA;AAAA,EAE5B,kBAAkB;AAAA;AAAA,EAElB,eAAe;AACjB,GAKaC,IAAqB;AAAA;AAAA,EAEhC,iBAAiB;AACnB;"}

package/dist/components/charts/ChromatogramChart/dataProcessing.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./peakDetection.cjs");function c(t,o){if(t.length===0||t.length===1)return 0;let n=0,e=t.length-1;for(;n<e;){const l=Math.floor((n+e)/2);t[l]<o?n=l+1:e=l}return n>0&&Math.abs(t[n-1]-o)<Math.abs(t[n]-o)?n-1:n}function d(t,o,n){return t.map(e=>{if(e.startX!==void 0&&e.endX!==void 0){const l=c(o,e.startX),i=c(o,e.endX),a=c(o,e.x),s=e._computed?.area??u.calculatePeakArea(o,n,l,i);return{...e,_computed:{...e._computed,index:a,startIndex:l,endIndex:i,area:s}}}return e})}function h(t,o,n){const e=[];t.forEach(({peaks:i,seriesIndex:a})=>{e.push({peaks:i,seriesIndex:a,x:n[a].x,y:n[a].y})});const l=o.filter(i=>i._computed?.startIndex!==void 0&&i._computed?.endIndex!==void 0);return l.length>0&&n.length>0&&e.push({peaks:l,seriesIndex:0,x:n[0].x,y:n[0].y}),e}function f(t,o){const n=Math.min(t.length,o.length),e=t.slice(0,n),i=o.slice(0,n).map(s=>Number.isFinite(s)?s:0);return{x:e.map(s=>Number.isFinite(s)?s:0),y:i}}function p(t,o,n=50){if(o==="none"||t.length===0)return t;if(o==="linear"){if(t.length===1)return[0];const e=(t[t.length-1]-t[0])/(t.length-1);return t.map((l,i)=>l-(t[0]+e*i))}if(o==="rolling"){const e=[],l=Math.floor(n/2);for(let i=0;i<t.length;i++){const a=Math.max(0,i-l),s=Math.min(t.length,i+l+1),r=t.slice(a,s);e.push(Math.min(...r))}return t.map((i,a)=>i-e[a])}return t}exports.applyBaselineCorrection=p;exports.collectPeaksWithBoundaryData=h;exports.findClosestIndex=c;exports.processUserAnnotations=d;exports.validateSeriesData=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./peakDetection.cjs");function s(t,i){if(t.length===0||t.length===1)return 0;let n=0,e=t.length-1;for(;n<e;){const o=Math.floor((n+e)/2);t[o]<i?n=o+1:e=o}return n>0&&Math.abs(t[n-1]-i)<Math.abs(t[n]-i)?n-1:n}function d(t,i,n){return t.map(e=>{if(e.startX!==void 0&&e.endX!==void 0){const o=s(i,e.startX),l=s(i,e.endX),r=s(i,e.x),a=e._computed?.area??u.calculatePeakArea(i,n,o,l);return{...e,_computed:{...e._computed,index:r,startIndex:o,endIndex:l,area:a}}}return e})}function h(t,i,n){const e=[];t.forEach(({peaks:l,seriesIndex:r})=>{e.push({peaks:l,seriesIndex:r,x:n[r].x,y:n[r].y})});const o=i.filter(l=>l._computed?.startIndex!==void 0&&l._computed?.endIndex!==void 0);return o.length>0&&n.length>0&&e.push({peaks:o,seriesIndex:0,x:n[0].x,y:n[0].y}),e}function f(t,i){if(!i)return t;const n=[];for(const[e,o]of Object.entries(i))if(o!=null&&o!==""){const l=e.replace(/([A-Z])/g," $1").replace(/^./,r=>r.toUpperCase()).trim();n.push(`${l}: ${String(o)}`)}return n.length>0?`${t}<br>${n.join("<br>")}`:t}function p(t,i){const n=Math.min(t.length,i.length),e=t.slice(0,n),l=i.slice(0,n).map(a=>Number.isFinite(a)?a:0);return{x:e.map(a=>Number.isFinite(a)?a:0),y:l}}function g(t,i,n=50){if(i==="none"||t.length===0)return t;if(i==="linear"){if(t.length===1)return[0];const e=(t[t.length-1]-t[0])/(t.length-1);return t.map((o,l)=>o-(t[0]+e*l))}if(i==="rolling"){const e=[],o=Math.floor(n/2);for(let l=0;l<t.length;l++){const r=Math.max(0,l-o),a=Math.min(t.length,l+o+1),c=t.slice(r,a);e.push(Math.min(...c))}return t.map((l,r)=>l-e[r])}return t}exports.applyBaselineCorrection=g;exports.buildHoverExtraContent=f;exports.collectPeaksWithBoundaryData=h;exports.findClosestIndex=s;exports.processUserAnnotations=d;exports.validateSeriesData=p;
 //# sourceMappingURL=dataProcessing.cjs.map