npm - @tetrascience-npm/tetrascience-react-ui - Versions diffs - 0.5.0-beta.20.1 → 0.5.0-beta.21.1 - Mend

@tetrascience-npm/tetrascience-react-ui 0.5.0-beta.20.1 → 0.5.0-beta.21.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (472) hide show

package/dist/components/charts/ChromatogramChart/peakDetection.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"peakDetection.cjs","sources":["../../../../src/components/charts/ChromatogramChart/peakDetection.ts"],"sourcesContent":["/**\n * Peak detection algorithms for ChromatogramChart\n */\n\nimport type { PeakAnnotation, PeakDetectionOptions } from \"./types\";\n\n/**\n * Calculate prominence of a peak (how much it stands out from neighbors)\n */\nexport function calculateProminence(\n y: number[],\n peakIndex: number,\n searchWindow: number\n): number {\n let leftMin = y[peakIndex];\n let rightMin = y[peakIndex];\n\n for (let j = peakIndex - 1; j >= Math.max(0, peakIndex - searchWindow); j--) {\n leftMin = Math.min(leftMin, y[j]);\n }\n for (\n let j = peakIndex + 1;\n j < Math.min(y.length, peakIndex + searchWindow);\n j++\n ) {\n rightMin = Math.min(rightMin, y[j]);\n }\n\n return y[peakIndex] - Math.max(leftMin, rightMin);\n}\n\n/**\n * Find peak boundary indices by walking outward from peak\n */\nexport function findPeakBoundaries(\n y: number[],\n peakIndex: number\n): { startIndex: number; endIndex: number } {\n let startIndex = peakIndex;\n let endIndex = peakIndex;\n\n // Walk left to find start\n for (let j = peakIndex - 1; j >= 0; j--) {\n if (y[j] <= y[j + 1]) {\n startIndex = j;\n } else {\n break;\n }\n }\n\n // Walk right to find end\n for (let j = peakIndex + 1; j < y.length; j++) {\n if (y[j] <= y[j - 1]) {\n endIndex = j;\n } else {\n break;\n }\n }\n\n return { startIndex, endIndex };\n}\n\n/**\n * Calculate peak area using trapezoidal integration\n */\nexport function calculatePeakArea(\n x: number[],\n y: number[],\n startIndex: number,\n endIndex: number\n): number {\n const baselineY = Math.min(y[startIndex], y[endIndex]);\n let area = 0;\n\n for (let j = startIndex; j < endIndex; j++) {\n const h = x[j + 1] - x[j];\n const y1 = y[j] - baselineY;\n const y2 = y[j + 1] - baselineY;\n area += ((y1 + y2) * h) / 2;\n }\n\n return area;\n}\n\n/**\n * Calculate width at half maximum of a peak\n */\nexport function calculateWidthAtHalfMax(\n x: number[],\n y: number[],\n peakIndex: number,\n startIndex: number,\n endIndex: number\n): number {\n const baselineY = Math.min(y[startIndex], y[endIndex]);\n const halfMax = (y[peakIndex] + baselineY) / 2;\n let leftHalf = peakIndex;\n let rightHalf = peakIndex;\n\n for (let j = peakIndex; j >= startIndex; j--) {\n if (y[j] < halfMax) {\n leftHalf = j;\n break;\n }\n }\n for (let j = peakIndex; j <= endIndex; j++) {\n if (y[j] < halfMax) {\n rightHalf = j;\n break;\n }\n }\n\n return x[rightHalf] - x[leftHalf];\n}\n\n/**\n * Filter peaks by minimum distance, keeping more intense peaks\n */\nexport function filterPeaksByDistance(\n peaks: PeakAnnotation[],\n minDistance: number\n): PeakAnnotation[] {\n const filtered: PeakAnnotation[] = [];\n\n for (const peak of peaks) {\n const tooClose = filtered.some(\n (p) => Math.abs((p._computed?.index ?? 0) - (peak._computed?.index ?? 0)) < minDistance\n );\n if (!tooClose) {\n filtered.push(peak);\n } else if (\n filtered.length > 0 &&\n peak.y > filtered[filtered.length - 1].y\n ) {\n filtered.pop();\n filtered.push(peak);\n }\n }\n\n return filtered.sort((a, b) => a.x - b.x);\n}\n\n/**\n * Detect peaks in signal data using derivative analysis.\n *\n * Default parameters are tuned for typical HPLC chromatograms:\n * - minHeight (0.05 = 5%): Filters noise while detecting small peaks\n * - minDistance (5 points): Prevents detecting noise as multiple peaks\n * - prominence (0.02 = 2%): Ensures peaks stand out from baseline/shoulders\n */\nexport function detectPeaks(\n x: number[],\n y: number[],\n options: PeakDetectionOptions = {}\n): PeakAnnotation[] {\n const {\n minHeight = 0.05,\n minDistance = 5,\n prominence = 0.02,\n relativeThreshold = true,\n } = options;\n\n if (y.length < 3) return [];\n\n const maxY = Math.max(...y);\n const threshold = relativeThreshold ? minHeight * maxY : minHeight;\n const prominenceThreshold = relativeThreshold ? prominence * maxY : prominence;\n const searchWindow = minDistance * 3;\n\n const peaks: PeakAnnotation[] = [];\n\n // Find local maxima\n for (let i = 1; i < y.length - 1; i++) {\n const isLocalMax =\n y[i] > y[i - 1] && y[i] > y[i + 1] && y[i] >= threshold;\n if (!isLocalMax) continue;\n\n const peakProminence = calculateProminence(y, i, searchWindow);\n if (peakProminence < prominenceThreshold) continue;\n\n const { startIndex, endIndex } = findPeakBoundaries(y, i);\n const area = calculatePeakArea(x, y, startIndex, endIndex);\n const widthAtHalfMax = calculateWidthAtHalfMax(\n x,\n y,\n i,\n startIndex,\n endIndex\n );\n\n peaks.push({\n x: x[i],\n y: y[i],\n _computed: {\n area,\n index: i,\n startIndex,\n endIndex,\n widthAtHalfMax,\n },\n });\n }\n\n return filterPeaksByDistance(peaks, minDistance);\n}\n\n"],"names":["calculateProminence","y","peakIndex","searchWindow","leftMin","rightMin","j","findPeakBoundaries","startIndex","endIndex","calculatePeakArea","x","baselineY","area","h","y1","y2","calculateWidthAtHalfMax","halfMax","leftHalf","rightHalf","filterPeaksByDistance","peaks","minDistance","filtered","peak","p","a","b","detectPeaks","options","minHeight","prominence","relativeThreshold","maxY","threshold","prominenceThreshold","i","widthAtHalfMax"],"mappings":"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"}

package/dist/components/charts/ChromatogramChart/peakDetection.js ADDED Viewed

@@ -0,0 +1,89 @@
+function j(o, t, n) {
+  let i = o[t], e = o[t];
+  for (let l = t - 1; l >= Math.max(0, t - n); l--)
+    i = Math.min(i, o[l]);
+  for (let l = t + 1; l < Math.min(o.length, t + n); l++)
+    e = Math.min(e, o[l]);
+  return o[t] - Math.max(i, e);
+}
+function P(o, t) {
+  let n = t, i = t;
+  for (let e = t - 1; e >= 0 && o[e] <= o[e + 1]; e--)
+    n = e;
+  for (let e = t + 1; e < o.length && o[e] <= o[e - 1]; e++)
+    i = e;
+  return { startIndex: n, endIndex: i };
+}
+function H(o, t, n, i) {
+  const e = Math.min(t[n], t[i]);
+  let l = 0;
+  for (let s = n; s < i; s++) {
+    const a = o[s + 1] - o[s], f = t[s] - e, c = t[s + 1] - e;
+    l += (f + c) * a / 2;
+  }
+  return l;
+}
+function A(o, t, n, i, e) {
+  const l = Math.min(t[i], t[e]), s = (t[n] + l) / 2;
+  let a = n, f = n;
+  for (let c = n; c >= i; c--)
+    if (t[c] < s) {
+      a = c;
+      break;
+    }
+  for (let c = n; c <= e; c++)
+    if (t[c] < s) {
+      f = c;
+      break;
+    }
+  return o[f] - o[a];
+}
+function Y(o, t) {
+  const n = [];
+  for (const i of o)
+    n.some(
+      (l) => Math.abs((l._computed?.index ?? 0) - (i._computed?.index ?? 0)) < t
+    ) ? n.length > 0 && i.y > n[n.length - 1].y && (n.pop(), n.push(i)) : n.push(i);
+  return n.sort((i, e) => i.x - e.x);
+}
+function p(o, t, n = {}) {
+  const {
+    minHeight: i = 0.05,
+    minDistance: e = 5,
+    prominence: l = 0.02,
+    relativeThreshold: s = !0
+  } = n;
+  if (t.length < 3) return [];
+  const a = Math.max(...t), f = s ? i * a : i, c = s ? l * a : l, M = e * 3, m = [];
+  for (let r = 1; r < t.length - 1; r++) {
+    if (!(t[r] > t[r - 1] && t[r] > t[r + 1] && t[r] >= f) || j(t, r, M) < c) continue;
+    const { startIndex: h, endIndex: u } = P(t, r), g = H(o, t, h, u), b = A(
+      o,
+      t,
+      r,
+      h,
+      u
+    );
+    m.push({
+      x: o[r],
+      y: t[r],
+      _computed: {
+        area: g,
+        index: r,
+        startIndex: h,
+        endIndex: u,
+        widthAtHalfMax: b
+      }
+    });
+  }
+  return Y(m, e);
+}
+export {
+  H as calculatePeakArea,
+  j as calculateProminence,
+  A as calculateWidthAtHalfMax,
+  p as detectPeaks,
+  Y as filterPeaksByDistance,
+  P as findPeakBoundaries
+};
+//# sourceMappingURL=peakDetection.js.map

package/dist/components/charts/ChromatogramChart/peakDetection.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"peakDetection.js","sources":["../../../../src/components/charts/ChromatogramChart/peakDetection.ts"],"sourcesContent":["/**\n * Peak detection algorithms for ChromatogramChart\n */\n\nimport type { PeakAnnotation, PeakDetectionOptions } from \"./types\";\n\n/**\n * Calculate prominence of a peak (how much it stands out from neighbors)\n */\nexport function calculateProminence(\n y: number[],\n peakIndex: number,\n searchWindow: number\n): number {\n let leftMin = y[peakIndex];\n let rightMin = y[peakIndex];\n\n for (let j = peakIndex - 1; j >= Math.max(0, peakIndex - searchWindow); j--) {\n leftMin = Math.min(leftMin, y[j]);\n }\n for (\n let j = peakIndex + 1;\n j < Math.min(y.length, peakIndex + searchWindow);\n j++\n ) {\n rightMin = Math.min(rightMin, y[j]);\n }\n\n return y[peakIndex] - Math.max(leftMin, rightMin);\n}\n\n/**\n * Find peak boundary indices by walking outward from peak\n */\nexport function findPeakBoundaries(\n y: number[],\n peakIndex: number\n): { startIndex: number; endIndex: number } {\n let startIndex = peakIndex;\n let endIndex = peakIndex;\n\n // Walk left to find start\n for (let j = peakIndex - 1; j >= 0; j--) {\n if (y[j] <= y[j + 1]) {\n startIndex = j;\n } else {\n break;\n }\n }\n\n // Walk right to find end\n for (let j = peakIndex + 1; j < y.length; j++) {\n if (y[j] <= y[j - 1]) {\n endIndex = j;\n } else {\n break;\n }\n }\n\n return { startIndex, endIndex };\n}\n\n/**\n * Calculate peak area using trapezoidal integration\n */\nexport function calculatePeakArea(\n x: number[],\n y: number[],\n startIndex: number,\n endIndex: number\n): number {\n const baselineY = Math.min(y[startIndex], y[endIndex]);\n let area = 0;\n\n for (let j = startIndex; j < endIndex; j++) {\n const h = x[j + 1] - x[j];\n const y1 = y[j] - baselineY;\n const y2 = y[j + 1] - baselineY;\n area += ((y1 + y2) * h) / 2;\n }\n\n return area;\n}\n\n/**\n * Calculate width at half maximum of a peak\n */\nexport function calculateWidthAtHalfMax(\n x: number[],\n y: number[],\n peakIndex: number,\n startIndex: number,\n endIndex: number\n): number {\n const baselineY = Math.min(y[startIndex], y[endIndex]);\n const halfMax = (y[peakIndex] + baselineY) / 2;\n let leftHalf = peakIndex;\n let rightHalf = peakIndex;\n\n for (let j = peakIndex; j >= startIndex; j--) {\n if (y[j] < halfMax) {\n leftHalf = j;\n break;\n }\n }\n for (let j = peakIndex; j <= endIndex; j++) {\n if (y[j] < halfMax) {\n rightHalf = j;\n break;\n }\n }\n\n return x[rightHalf] - x[leftHalf];\n}\n\n/**\n * Filter peaks by minimum distance, keeping more intense peaks\n */\nexport function filterPeaksByDistance(\n peaks: PeakAnnotation[],\n minDistance: number\n): PeakAnnotation[] {\n const filtered: PeakAnnotation[] = [];\n\n for (const peak of peaks) {\n const tooClose = filtered.some(\n (p) => Math.abs((p._computed?.index ?? 0) - (peak._computed?.index ?? 0)) < minDistance\n );\n if (!tooClose) {\n filtered.push(peak);\n } else if (\n filtered.length > 0 &&\n peak.y > filtered[filtered.length - 1].y\n ) {\n filtered.pop();\n filtered.push(peak);\n }\n }\n\n return filtered.sort((a, b) => a.x - b.x);\n}\n\n/**\n * Detect peaks in signal data using derivative analysis.\n *\n * Default parameters are tuned for typical HPLC chromatograms:\n * - minHeight (0.05 = 5%): Filters noise while detecting small peaks\n * - minDistance (5 points): Prevents detecting noise as multiple peaks\n * - prominence (0.02 = 2%): Ensures peaks stand out from baseline/shoulders\n */\nexport function detectPeaks(\n x: number[],\n y: number[],\n options: PeakDetectionOptions = {}\n): PeakAnnotation[] {\n const {\n minHeight = 0.05,\n minDistance = 5,\n prominence = 0.02,\n relativeThreshold = true,\n } = options;\n\n if (y.length < 3) return [];\n\n const maxY = Math.max(...y);\n const threshold = relativeThreshold ? minHeight * maxY : minHeight;\n const prominenceThreshold = relativeThreshold ? prominence * maxY : prominence;\n const searchWindow = minDistance * 3;\n\n const peaks: PeakAnnotation[] = [];\n\n // Find local maxima\n for (let i = 1; i < y.length - 1; i++) {\n const isLocalMax =\n y[i] > y[i - 1] && y[i] > y[i + 1] && y[i] >= threshold;\n if (!isLocalMax) continue;\n\n const peakProminence = calculateProminence(y, i, searchWindow);\n if (peakProminence < prominenceThreshold) continue;\n\n const { startIndex, endIndex } = findPeakBoundaries(y, i);\n const area = calculatePeakArea(x, y, startIndex, endIndex);\n const widthAtHalfMax = calculateWidthAtHalfMax(\n x,\n y,\n i,\n startIndex,\n endIndex\n );\n\n peaks.push({\n x: x[i],\n y: y[i],\n _computed: {\n area,\n index: i,\n startIndex,\n endIndex,\n widthAtHalfMax,\n },\n });\n }\n\n return filterPeaksByDistance(peaks, minDistance);\n}\n\n"],"names":["calculateProminence","y","peakIndex","searchWindow","leftMin","rightMin","j","findPeakBoundaries","startIndex","endIndex","calculatePeakArea","x","baselineY","area","h","y1","y2","calculateWidthAtHalfMax","halfMax","leftHalf","rightHalf","filterPeaksByDistance","peaks","minDistance","filtered","peak","p","a","b","detectPeaks","options","minHeight","prominence","relativeThreshold","maxY","threshold","prominenceThreshold","i","widthAtHalfMax"],"mappings":"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"}

package/dist/components/charts/DotPlot/DotPlot.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("react/jsx-runtime"),z=require("plotly.js-dist"),e=require("react"),L=require("../../../hooks/use-plotly-theme.cjs"),r=require("../../../utils/colors.cjs"),P=({dataSeries:l,width:u=1e3,height:d=600,title:p="Dot Plot",xTitle:n="Columns",yTitle:s="Rows",variant:h="default",markerSize:f=8})=>{const c=e.useRef(null),t=L.usePlotlyTheme(),x=e.useMemo(()=>Array.isArray(l)?l:[l],[l]),i=e.useMemo(()=>[r.COLORS.ORANGE,r.COLORS.RED,r.COLORS.GREEN,r.COLORS.BLUE,r.COLORS.YELLOW,r.COLORS.PURPLE],[]),m=e.useMemo(()=>["circle","square","diamond","triangle-up","triangle-down","star"],[]),O=e.useMemo(()=>x.map((o,a)=>h==="default"?{...o,color:o.color\|\|i[0],symbol:"circle",size:o.size\|\|f}:{...o,color:o.color\|\|i[a%i.length],symbol:o.symbol\|\|m[a%m.length],size:o.size\|\|f}),[x,h,f,i,m]),y=t.gridColor,C=e.useMemo(()=>O.map(o=>({type:"scatter",x:o.x,y:o.y,mode:"markers",name:o.name,marker:{color:o.color,size:o.size,symbol:o.symbol,line:{color:t.paperBg,width:1}},hovertemplate:`${n}: %{x}<br>${s}: %{y}<extra>${o.name}</extra>`})),[O,n,s,t]),g=e.useMemo(()=>({tickcolor:t.tickColor,ticklen:12,tickwidth:1,ticks:"outside",tickfont:{size:16,color:t.textColor,family:"Inter, sans-serif",weight:400},linecolor:t.lineColor,linewidth:1,position:0,zeroline:!1}),[t]),R=e.useMemo(()=>({text:p,x:.5,y:.95,xanchor:"center",yanchor:"top",font:{size:32,weight:600,family:"Inter, sans-serif",color:t.textColor,lineheight:1.2,standoff:30}}),[p,t]);return e.useEffect(()=>{if(!c.current)return;const o={width:u,height:d,font:{family:"Inter, sans-serif"},title:R,margin:{l:80,r:40,b:80,t:80,pad:0},showlegend:!0,legend:{x:.5,y:-.2,xanchor:"center",yanchor:"top",orientation:"h",font:{size:13,color:t.legendColor,family:"Inter, sans-serif",weight:500,lineheight:18}},xaxis:{title:{text:n,font:{size:16,color:t.textSecondary,family:"Inter, sans-serif",weight:400},standoff:15},gridcolor:y,...g},yaxis:{title:{text:s,font:{size:16,color:t.textSecondary,family:"Inter, sans-serif",weight:400},standoff:15},gridcolor:y,...g},paper_bgcolor:t.paperBg,plot_bgcolor:t.plotBg},a={responsive:!0,displayModeBar:!1,displaylogo:!1};z.newPlot(c.current,C,o,a);const b=c.current;return()=>{b&&z.purge(b)}},[u,d,n,s,C,R,g,y,t]),w.jsx("div",{className:"dotplot-container",style:{width:u},children:w.jsx("div",{ref:c,style:{width:"100%",height:"100%",margin:"0"}})})};exports.DotPlot=P;
2	+ //# sourceMappingURL=DotPlot.cjs.map

package/dist/components/charts/DotPlot/DotPlot.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DotPlot.cjs","sources":["../../../../src/components/charts/DotPlot/DotPlot.tsx"],"sourcesContent":["import Plotly from \"plotly.js-dist\";\nimport React, { useEffect, useRef, useMemo } from \"react\";\n\nimport { usePlotlyTheme } from \"@/hooks/use-plotly-theme\";\nimport { COLORS } from \"@/utils/colors\";\n\ntype MarkerSymbol =\n | \"circle\"\n | \"square\"\n | \"diamond\"\n | \"triangle-up\"\n | \"triangle-down\"\n | \"star\";\n\ninterface DotPlotDataSeries {\n x: number[];\n y: number[];\n name: string;\n color?: string;\n symbol?: MarkerSymbol;\n size?: number;\n}\n\ntype DotPlotVariant = \"default\" | \"stacked\";\n\ntype DotPlotProps = {\n dataSeries: DotPlotDataSeries | DotPlotDataSeries[];\n width?: number;\n height?: number;\n title?: string;\n xTitle?: string;\n yTitle?: string;\n variant?: DotPlotVariant;\n markerSize?: number;\n};\n\nconst DotPlot: React.FC<DotPlotProps> = ({\n dataSeries,\n width = 1000,\n height = 600,\n title = \"Dot Plot\",\n xTitle = \"Columns\",\n yTitle = \"Rows\",\n variant = \"default\",\n markerSize = 8,\n}) => {\n const plotRef = useRef<HTMLDivElement>(null);\n const theme = usePlotlyTheme();\n const seriesArray = useMemo(\n () => (Array.isArray(dataSeries) ? dataSeries : [dataSeries]),\n [dataSeries],\n );\n\n const defaultColors = useMemo(\n () => [\n COLORS.ORANGE,\n COLORS.RED,\n COLORS.GREEN,\n COLORS.BLUE,\n COLORS.YELLOW,\n COLORS.PURPLE,\n ],\n [],\n );\n\n const defaultSymbols: MarkerSymbol[] = useMemo(\n () => [\n \"circle\",\n \"square\",\n \"diamond\",\n \"triangle-up\",\n \"triangle-down\",\n \"star\",\n ],\n [],\n );\n\n const seriesWithColors = useMemo(() => {\n return seriesArray.map((series, index) => {\n if (variant === \"default\") {\n // Default variant: all circles, use first color or series color\n return {\n ...series,\n color: series.color || defaultColors[0],\n symbol: \"circle\" as MarkerSymbol,\n size: series.size || markerSize,\n };\n } else {\n // Stacked variant: different symbols and colors for each series\n return {\n ...series,\n color: series.color || defaultColors[index % defaultColors.length],\n symbol:\n series.symbol || defaultSymbols[index % defaultSymbols.length],\n size: series.size || markerSize,\n };\n }\n });\n }, [seriesArray, variant, markerSize, defaultColors, defaultSymbols]);\n\n const gridColor = theme.gridColor;\n\n const plotData = useMemo(\n () =>\n seriesWithColors.map((series) => ({\n type: \"scatter\" as const,\n x: series.x,\n y: series.y,\n mode: \"markers\" as const,\n name: series.name,\n marker: {\n color: series.color,\n size: series.size,\n symbol: series.symbol,\n line: {\n color: theme.paperBg,\n width: 1,\n },\n },\n hovertemplate: `${xTitle}: %{x}<br>${yTitle}: %{y}<extra>${series.name}</extra>`,\n })),\n [seriesWithColors, xTitle, yTitle, theme],\n );\n\n const tickOptions = useMemo(\n () => ({\n tickcolor: theme.tickColor,\n ticklen: 12,\n tickwidth: 1,\n ticks: \"outside\" as const,\n tickfont: {\n size: 16,\n color: theme.textColor,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n linecolor: theme.lineColor,\n linewidth: 1,\n position: 0,\n zeroline: false,\n }),\n [theme],\n );\n\n const titleOptions = useMemo(\n () => ({\n text: title,\n x: 0.5,\n y: 0.95,\n xanchor: \"center\" as const,\n yanchor: \"top\" as const,\n font: {\n size: 32,\n weight: 600,\n family: \"Inter, sans-serif\",\n color: theme.textColor,\n lineheight: 1.2,\n standoff: 30,\n },\n }),\n [title, theme],\n );\n\n useEffect(() => {\n if (!plotRef.current) return;\n\n const layout = {\n width,\n height,\n font: {\n family: \"Inter, sans-serif\",\n },\n title: titleOptions,\n margin: { l: 80, r: 40, b: 80, t: 80, pad: 0 },\n showlegend: true,\n legend: {\n x: 0.5,\n y: -0.2,\n xanchor: \"center\" as const,\n yanchor: \"top\" as const,\n orientation: \"h\" as const,\n font: {\n size: 13,\n color: theme.legendColor,\n family: \"Inter, sans-serif\",\n weight: 500,\n lineheight: 18,\n },\n },\n xaxis: {\n title: {\n text: xTitle,\n font: {\n size: 16,\n color: theme.textSecondary,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n standoff: 15,\n },\n gridcolor: gridColor,\n ...tickOptions,\n },\n yaxis: {\n title: {\n text: yTitle,\n font: {\n size: 16,\n color: theme.textSecondary,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n standoff: 15,\n },\n gridcolor: gridColor,\n ...tickOptions,\n },\n paper_bgcolor: theme.paperBg,\n plot_bgcolor: theme.plotBg,\n };\n\n const config = {\n responsive: true,\n displayModeBar: false,\n displaylogo: false,\n };\n\n Plotly.newPlot(plotRef.current, plotData, layout, config);\n\n // Capture ref value for cleanup\n const plotElement = plotRef.current;\n\n return () => {\n if (plotElement) {\n Plotly.purge(plotElement);\n }\n };\n }, [width, height, xTitle, yTitle, plotData, titleOptions, tickOptions, gridColor, theme]);\n\n return (\n <div className=\"dotplot-container\" style={{ width: width }}>\n <div\n ref={plotRef}\n style={{\n width: \"100%\",\n height: \"100%\",\n margin: \"0\",\n }}\n />\n </div>\n );\n};\n\nexport { DotPlot };\nexport type { DotPlotDataSeries, DotPlotProps, DotPlotVariant, MarkerSymbol };\n"],"names":["DotPlot","dataSeries","width","height","title","xTitle","yTitle","variant","markerSize","plotRef","useRef","theme","usePlotlyTheme","seriesArray","useMemo","defaultColors","COLORS","defaultSymbols","seriesWithColors","series","index","gridColor","plotData","tickOptions","titleOptions","useEffect","layout","config","Plotly","plotElement","jsx"],"mappings":"4PAoCMA,EAAkC,CAAC,CACvC,WAAAC,EACA,MAAAC,EAAQ,IACR,OAAAC,EAAS,IACT,MAAAC,EAAQ,WACR,OAAAC,EAAS,UACT,OAAAC,EAAS,OACT,QAAAC,EAAU,UACV,WAAAC,EAAa,CACf,IAAM,CACJ,MAAMC,EAAUC,EAAAA,OAAuB,IAAI,EACrCC,EAAQC,EAAAA,eAAA,EACRC,EAAcC,EAAAA,QAClB,IAAO,MAAM,QAAQb,CAAU,EAAIA,EAAa,CAACA,CAAU,EAC3D,CAACA,CAAU,CAAA,EAGPc,EAAgBD,EAAAA,QACpB,IAAM,CACJE,EAAAA,OAAO,OACPA,EAAAA,OAAO,IACPA,EAAAA,OAAO,MACPA,EAAAA,OAAO,KACPA,EAAAA,OAAO,OACPA,SAAO,MAAA,EAET,CAAA,CAAC,EAGGC,EAAiCH,EAAAA,QACrC,IAAM,CACJ,SACA,SACA,UACA,cACA,gBACA,MAAA,EAEF,CAAA,CAAC,EAGGI,EAAmBJ,EAAAA,QAAQ,IACxBD,EAAY,IAAI,CAACM,EAAQC,IAC1Bb,IAAY,UAEP,CACL,GAAGY,EACH,MAAOA,EAAO,OAASJ,EAAc,CAAC,EACtC,OAAQ,SACR,KAAMI,EAAO,MAAQX,CAAA,EAIhB,CACL,GAAGW,EACH,MAAOA,EAAO,OAASJ,EAAcK,EAAQL,EAAc,MAAM,EACjE,OACEI,EAAO,QAAUF,EAAeG,EAAQH,EAAe,MAAM,EAC/D,KAAME,EAAO,MAAQX,CAAA,CAG1B,EACA,CAACK,EAAaN,EAASC,EAAYO,EAAeE,CAAc,CAAC,EAE9DI,EAAYV,EAAM,UAElBW,EAAWR,EAAAA,QACf,IACEI,EAAiB,IAAKC,IAAY,CAChC,KAAM,UACN,EAAGA,EAAO,EACV,EAAGA,EAAO,EACV,KAAM,UACN,KAAMA,EAAO,KACb,OAAQ,CACN,MAAOA,EAAO,MACd,KAAMA,EAAO,KACb,OAAQA,EAAO,OACf,KAAM,CACJ,MAAOR,EAAM,QACb,MAAO,CAAA,CACT,EAEF,cAAe,GAAGN,CAAM,aAAaC,CAAM,gBAAgBa,EAAO,IAAI,UAAA,EACtE,EACJ,CAACD,EAAkBb,EAAQC,EAAQK,CAAK,CAAA,EAGpCY,EAAcT,EAAAA,QAClB,KAAO,CACL,UAAWH,EAAM,UACjB,QAAS,GACT,UAAW,EACX,MAAO,UACP,SAAU,CACR,KAAM,GACN,MAAOA,EAAM,UACb,OAAQ,oBACR,OAAQ,GAAA,EAEV,UAAWA,EAAM,UACjB,UAAW,EACX,SAAU,EACV,SAAU,EAAA,GAEZ,CAACA,CAAK,CAAA,EAGFa,EAAeV,EAAAA,QACnB,KAAO,CACL,KAAMV,EACN,EAAG,GACH,EAAG,IACH,QAAS,SACT,QAAS,MACT,KAAM,CACJ,KAAM,GACN,OAAQ,IACR,OAAQ,oBACR,MAAOO,EAAM,UACb,WAAY,IACZ,SAAU,EAAA,CACZ,GAEF,CAACP,EAAOO,CAAK,CAAA,EAGfc,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAI,CAAChB,EAAQ,QAAS,OAEtB,MAAMiB,EAAS,CACb,MAAAxB,EACA,OAAAC,EACA,KAAM,CACJ,OAAQ,mBAAA,EAEV,MAAOqB,EACP,OAAQ,CAAE,EAAG,GAAI,EAAG,GAAI,EAAG,GAAI,EAAG,GAAI,IAAK,CAAA,EAC3C,WAAY,GACZ,OAAQ,CACN,EAAG,GACH,EAAG,IACH,QAAS,SACT,QAAS,MACT,YAAa,IACb,KAAM,CACJ,KAAM,GACN,MAAOb,EAAM,YACb,OAAQ,oBACR,OAAQ,IACR,WAAY,EAAA,CACd,EAEF,MAAO,CACL,MAAO,CACL,KAAMN,EACN,KAAM,CACJ,KAAM,GACN,MAAOM,EAAM,cACb,OAAQ,oBACR,OAAQ,GAAA,EAEV,SAAU,EAAA,EAEZ,UAAWU,EACX,GAAGE,CAAA,EAEL,MAAO,CACL,MAAO,CACL,KAAMjB,EACN,KAAM,CACJ,KAAM,GACN,MAAOK,EAAM,cACb,OAAQ,oBACR,OAAQ,GAAA,EAEV,SAAU,EAAA,EAEZ,UAAWU,EACX,GAAGE,CAAA,EAEL,cAAeZ,EAAM,QACrB,aAAcA,EAAM,MAAA,EAGhBgB,EAAS,CACb,WAAY,GACZ,eAAgB,GAChB,YAAa,EAAA,EAGfC,EAAO,QAAQnB,EAAQ,QAASa,EAAUI,EAAQC,CAAM,EAGxD,MAAME,EAAcpB,EAAQ,QAE5B,MAAO,IAAM,CACPoB,GACFD,EAAO,MAAMC,CAAW,CAE5B,CACF,EAAG,CAAC3B,EAAOC,EAAQE,EAAQC,EAAQgB,EAAUE,EAAcD,EAAaF,EAAWV,CAAK,CAAC,QAGtF,MAAA,CAAI,UAAU,oBAAoB,MAAO,CAAE,MAAAT,GAC1C,SAAA4B,EAAAA,IAAC,MAAA,CACC,IAAKrB,EACL,MAAO,CACL,MAAO,OACP,OAAQ,OACR,OAAQ,GAAA,CACV,CAAA,EAEJ,CAEJ"}

package/dist/components/charts/DotPlot/DotPlot.js ADDED Viewed

@@ -0,0 +1,184 @@
+import { jsx as E } from "react/jsx-runtime";
+import R from "plotly.js-dist";
+import { useRef as k, useMemo as r, useEffect as P } from "react";
+import { usePlotlyTheme as I } from "../../../hooks/use-plotly-theme.js";
+import { COLORS as e } from "../../../utils/colors.js";
+const v = ({
+  dataSeries: l,
+  width: f = 1e3,
+  height: d = 600,
+  title: u = "Dot Plot",
+  xTitle: n = "Columns",
+  yTitle: i = "Rows",
+  variant: h = "default",
+  markerSize: m = 8
+}) => {
+  const s = k(null), t = I(), x = r(
+    () => Array.isArray(l) ? l : [l],
+    [l]
+  ), c = r(
+    () => [
+      e.ORANGE,
+      e.RED,
+      e.GREEN,
+      e.BLUE,
+      e.YELLOW,
+      e.PURPLE
+    ],
+    []
+  ), p = r(
+    () => [
+      "circle",
+      "square",
+      "diamond",
+      "triangle-up",
+      "triangle-down",
+      "star"
+    ],
+    []
+  ), w = r(() => x.map((o, a) => h === "default" ? {
+    ...o,
+    color: o.color || c[0],
+    symbol: "circle",
+    size: o.size || m
+  } : {
+    ...o,
+    color: o.color || c[a % c.length],
+    symbol: o.symbol || p[a % p.length],
+    size: o.size || m
+  }), [x, h, m, c, p]), y = t.gridColor, C = r(
+    () => w.map((o) => ({
+      type: "scatter",
+      x: o.x,
+      y: o.y,
+      mode: "markers",
+      name: o.name,
+      marker: {
+        color: o.color,
+        size: o.size,
+        symbol: o.symbol,
+        line: {
+          color: t.paperBg,
+          width: 1
+        }
+      },
+      hovertemplate: `${n}: %{x}<br>${i}: %{y}<extra>${o.name}</extra>`
+    })),
+    [w, n, i, t]
+  ), g = r(
+    () => ({
+      tickcolor: t.tickColor,
+      ticklen: 12,
+      tickwidth: 1,
+      ticks: "outside",
+      tickfont: {
+        size: 16,
+        color: t.textColor,
+        family: "Inter, sans-serif",
+        weight: 400
+      },
+      linecolor: t.lineColor,
+      linewidth: 1,
+      position: 0,
+      zeroline: !1
+    }),
+    [t]
+  ), b = r(
+    () => ({
+      text: u,
+      x: 0.5,
+      y: 0.95,
+      xanchor: "center",
+      yanchor: "top",
+      font: {
+        size: 32,
+        weight: 600,
+        family: "Inter, sans-serif",
+        color: t.textColor,
+        lineheight: 1.2,
+        standoff: 30
+      }
+    }),
+    [u, t]
+  );
+  return P(() => {
+    if (!s.current) return;
+    const o = {
+      width: f,
+      height: d,
+      font: {
+        family: "Inter, sans-serif"
+      },
+      title: b,
+      margin: { l: 80, r: 40, b: 80, t: 80, pad: 0 },
+      showlegend: !0,
+      legend: {
+        x: 0.5,
+        y: -0.2,
+        xanchor: "center",
+        yanchor: "top",
+        orientation: "h",
+        font: {
+          size: 13,
+          color: t.legendColor,
+          family: "Inter, sans-serif",
+          weight: 500,
+          lineheight: 18
+        }
+      },
+      xaxis: {
+        title: {
+          text: n,
+          font: {
+            size: 16,
+            color: t.textSecondary,
+            family: "Inter, sans-serif",
+            weight: 400
+          },
+          standoff: 15
+        },
+        gridcolor: y,
+        ...g
+      },
+      yaxis: {
+        title: {
+          text: i,
+          font: {
+            size: 16,
+            color: t.textSecondary,
+            family: "Inter, sans-serif",
+            weight: 400
+          },
+          standoff: 15
+        },
+        gridcolor: y,
+        ...g
+      },
+      paper_bgcolor: t.paperBg,
+      plot_bgcolor: t.plotBg
+    }, a = {
+      responsive: !0,
+      displayModeBar: !1,
+      displaylogo: !1
+    };
+    R.newPlot(s.current, C, o, a);
+    const z = s.current;
+    return () => {
+      z && R.purge(z);
+    };
+  }, [f, d, n, i, C, b, g, y, t]), /* @__PURE__ */ E("div", { className: "dotplot-container", style: { width: f }, children: /* @__PURE__ */ E(
+    "div",
+    {
+      ref: s,
+      style: {
+        width: "100%",
+        height: "100%",
+        margin: "0"
+      }
+    }
+  ) });
+};
+export {
+  v as DotPlot
+};
+//# sourceMappingURL=DotPlot.js.map

package/dist/components/charts/DotPlot/DotPlot.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DotPlot.js","sources":["../../../../src/components/charts/DotPlot/DotPlot.tsx"],"sourcesContent":["import Plotly from \"plotly.js-dist\";\nimport React, { useEffect, useRef, useMemo } from \"react\";\n\nimport { usePlotlyTheme } from \"@/hooks/use-plotly-theme\";\nimport { COLORS } from \"@/utils/colors\";\n\ntype MarkerSymbol =\n | \"circle\"\n | \"square\"\n | \"diamond\"\n | \"triangle-up\"\n | \"triangle-down\"\n | \"star\";\n\ninterface DotPlotDataSeries {\n x: number[];\n y: number[];\n name: string;\n color?: string;\n symbol?: MarkerSymbol;\n size?: number;\n}\n\ntype DotPlotVariant = \"default\" | \"stacked\";\n\ntype DotPlotProps = {\n dataSeries: DotPlotDataSeries | DotPlotDataSeries[];\n width?: number;\n height?: number;\n title?: string;\n xTitle?: string;\n yTitle?: string;\n variant?: DotPlotVariant;\n markerSize?: number;\n};\n\nconst DotPlot: React.FC<DotPlotProps> = ({\n dataSeries,\n width = 1000,\n height = 600,\n title = \"Dot Plot\",\n xTitle = \"Columns\",\n yTitle = \"Rows\",\n variant = \"default\",\n markerSize = 8,\n}) => {\n const plotRef = useRef<HTMLDivElement>(null);\n const theme = usePlotlyTheme();\n const seriesArray = useMemo(\n () => (Array.isArray(dataSeries) ? dataSeries : [dataSeries]),\n [dataSeries],\n );\n\n const defaultColors = useMemo(\n () => [\n COLORS.ORANGE,\n COLORS.RED,\n COLORS.GREEN,\n COLORS.BLUE,\n COLORS.YELLOW,\n COLORS.PURPLE,\n ],\n [],\n );\n\n const defaultSymbols: MarkerSymbol[] = useMemo(\n () => [\n \"circle\",\n \"square\",\n \"diamond\",\n \"triangle-up\",\n \"triangle-down\",\n \"star\",\n ],\n [],\n );\n\n const seriesWithColors = useMemo(() => {\n return seriesArray.map((series, index) => {\n if (variant === \"default\") {\n // Default variant: all circles, use first color or series color\n return {\n ...series,\n color: series.color || defaultColors[0],\n symbol: \"circle\" as MarkerSymbol,\n size: series.size || markerSize,\n };\n } else {\n // Stacked variant: different symbols and colors for each series\n return {\n ...series,\n color: series.color || defaultColors[index % defaultColors.length],\n symbol:\n series.symbol || defaultSymbols[index % defaultSymbols.length],\n size: series.size || markerSize,\n };\n }\n });\n }, [seriesArray, variant, markerSize, defaultColors, defaultSymbols]);\n\n const gridColor = theme.gridColor;\n\n const plotData = useMemo(\n () =>\n seriesWithColors.map((series) => ({\n type: \"scatter\" as const,\n x: series.x,\n y: series.y,\n mode: \"markers\" as const,\n name: series.name,\n marker: {\n color: series.color,\n size: series.size,\n symbol: series.symbol,\n line: {\n color: theme.paperBg,\n width: 1,\n },\n },\n hovertemplate: `${xTitle}: %{x}<br>${yTitle}: %{y}<extra>${series.name}</extra>`,\n })),\n [seriesWithColors, xTitle, yTitle, theme],\n );\n\n const tickOptions = useMemo(\n () => ({\n tickcolor: theme.tickColor,\n ticklen: 12,\n tickwidth: 1,\n ticks: \"outside\" as const,\n tickfont: {\n size: 16,\n color: theme.textColor,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n linecolor: theme.lineColor,\n linewidth: 1,\n position: 0,\n zeroline: false,\n }),\n [theme],\n );\n\n const titleOptions = useMemo(\n () => ({\n text: title,\n x: 0.5,\n y: 0.95,\n xanchor: \"center\" as const,\n yanchor: \"top\" as const,\n font: {\n size: 32,\n weight: 600,\n family: \"Inter, sans-serif\",\n color: theme.textColor,\n lineheight: 1.2,\n standoff: 30,\n },\n }),\n [title, theme],\n );\n\n useEffect(() => {\n if (!plotRef.current) return;\n\n const layout = {\n width,\n height,\n font: {\n family: \"Inter, sans-serif\",\n },\n title: titleOptions,\n margin: { l: 80, r: 40, b: 80, t: 80, pad: 0 },\n showlegend: true,\n legend: {\n x: 0.5,\n y: -0.2,\n xanchor: \"center\" as const,\n yanchor: \"top\" as const,\n orientation: \"h\" as const,\n font: {\n size: 13,\n color: theme.legendColor,\n family: \"Inter, sans-serif\",\n weight: 500,\n lineheight: 18,\n },\n },\n xaxis: {\n title: {\n text: xTitle,\n font: {\n size: 16,\n color: theme.textSecondary,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n standoff: 15,\n },\n gridcolor: gridColor,\n ...tickOptions,\n },\n yaxis: {\n title: {\n text: yTitle,\n font: {\n size: 16,\n color: theme.textSecondary,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n standoff: 15,\n },\n gridcolor: gridColor,\n ...tickOptions,\n },\n paper_bgcolor: theme.paperBg,\n plot_bgcolor: theme.plotBg,\n };\n\n const config = {\n responsive: true,\n displayModeBar: false,\n displaylogo: false,\n };\n\n Plotly.newPlot(plotRef.current, plotData, layout, config);\n\n // Capture ref value for cleanup\n const plotElement = plotRef.current;\n\n return () => {\n if (plotElement) {\n Plotly.purge(plotElement);\n }\n };\n }, [width, height, xTitle, yTitle, plotData, titleOptions, tickOptions, gridColor, theme]);\n\n return (\n <div className=\"dotplot-container\" style={{ width: width }}>\n <div\n ref={plotRef}\n style={{\n width: \"100%\",\n height: \"100%\",\n margin: \"0\",\n }}\n />\n </div>\n );\n};\n\nexport { DotPlot };\nexport type { DotPlotDataSeries, DotPlotProps, DotPlotVariant, MarkerSymbol };\n"],"names":["DotPlot","dataSeries","width","height","title","xTitle","yTitle","variant","markerSize","plotRef","useRef","theme","usePlotlyTheme","seriesArray","useMemo","defaultColors","COLORS","defaultSymbols","seriesWithColors","series","index","gridColor","plotData","tickOptions","titleOptions","useEffect","layout","config","Plotly","plotElement","jsx"],"mappings":"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"}

package/dist/components/charts/Heatmap/Heatmap.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("react/jsx-runtime"),H=require("react"),V=require("../PlateMap/PlateMap.cjs");function $(e){if(!e\|\|e.length===0)return[];const n=Math.max(...e.map(t=>t.length));return e.map(t=>{if(t.length===n)return t;const l=[...t];for(;l.length<n;)l.push(0);return l})}const x=({data:e,xLabels:n,yLabels:t,title:l,xTitle:u,yTitle:s,colorscale:i,width:g=800,height:h=600,showScale:m=!0,precision:p=0,zmin:f,zmax:M,valueUnit:w=""})=>{const o=e?$(e):void 0,S=o?.length??t?.length??16,R=o?.[0]?.length??n?.length??24,v=H.useMemo(()=>{if(!o)return;const C="ABCDEFGHIJKLMNOPQRSTUVWXYZ",c=[];for(let r=0;r<o.length;r++)for(let a=0;a<o[r].length;a++){const D=t?.[r]?.toString()??C[r]??`R${r+1}`,P=n?.[a]?.toString()??String(a+1),j=`${D}${P}`;c.push({wellId:j,values:{Value:o[r][a]}})}return c},[o,n,t]),d=i;return q.jsx(V.PlateMap,{data:v,plateFormat:"custom",rows:S,columns:R,title:l,xTitle:u,yTitle:s,xLabels:n,yLabels:t,colorScale:d,valueMin:f,valueMax:M,showColorBar:m,width:g,height:h,layerConfigs:[{id:"Value",valueUnit:w}],precision:p})};exports.Heatmap=x;
2	+ //# sourceMappingURL=Heatmap.cjs.map

package/dist/components/charts/Heatmap/Heatmap.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Heatmap.cjs","sources":["../../../../src/components/charts/Heatmap/Heatmap.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n\nimport { PlateMap } from \"../PlateMap\";\n\nimport type { ColorScale, WellData } from \"../PlateMap\";\n\n/**\n * Props for the Heatmap component\n * @deprecated Use PlateMap component instead. Heatmap is now a wrapper around PlateMap for backward compatibility.\n */\ninterface HeatmapProps {\n /** 2D array of numeric values */\n data?: number[][];\n /** Custom x-axis labels (column labels) */\n xLabels?: string[] | number[];\n /** Custom y-axis labels (row labels) */\n yLabels?: string[] | number[];\n /** Chart title */\n title?: string;\n /** X-axis title */\n xTitle?: string;\n /** Y-axis title */\n yTitle?: string;\n /** Color scale - string name or array of [position, color] pairs */\n colorscale?: string | Array<[number, string]>;\n /** Chart width in pixels */\n width?: number;\n /** Chart height in pixels */\n height?: number;\n /** Show color scale legend */\n showScale?: boolean;\n /** Number of decimal places for values */\n precision?: number;\n /** Minimum value for color scale */\n zmin?: number;\n /** Maximum value for color scale */\n zmax?: number;\n /** Value unit suffix */\n valueUnit?: string;\n}\n\n/**\n * Heatmap component for 2D data visualization\n * @deprecated Use PlateMap component instead. This component is now a wrapper around PlateMap for backward compatibility.\n *\n * @example\n * ```tsx\n * <Heatmap\n * data={[[1, 2, 3], [4, 5, 6]]}\n * xLabels={['A', 'B', 'C']}\n * yLabels={['Row 1', 'Row 2']}\n * title=\"My Heatmap\"\n * />\n * ```\n */\n/**\n * Normalize jagged 2D array to consistent width (backward compatibility)\n */\nfunction normalizeData(data: number[][]): number[][] {\n if (!data || data.length === 0) return [];\n\n const maxLength = Math.max(...data.map((row) => row.length));\n\n return data.map((row) => {\n if (row.length === maxLength) return row;\n\n const newRow = [...row];\n while (newRow.length < maxLength) {\n newRow.push(0);\n }\n return newRow;\n });\n}\n\nconst Heatmap: React.FC<HeatmapProps> = ({\n data,\n xLabels,\n yLabels,\n title,\n xTitle,\n yTitle,\n colorscale,\n width = 800,\n height = 600,\n showScale = true,\n precision = 0,\n zmin,\n zmax,\n valueUnit = \"\",\n}) => {\n // Normalize jagged arrays to consistent width (backward compatibility)\n const normalizedData = data ? normalizeData(data) : undefined;\n\n // Determine rows and columns from normalized data or labels\n const rows = normalizedData?.length ?? (yLabels?.length ?? 16);\n const columns = normalizedData?.[0]?.length ?? (xLabels?.length ?? 24);\n\n // Convert 2D array to WellData format for PlateMap\n const wellData: WellData[] | undefined = useMemo(() => {\n if (!normalizedData) return;\n\n const defaultRows = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ\";\n const wells: WellData[] = [];\n\n for (let r = 0; r < normalizedData.length; r++) {\n for (let c = 0; c < normalizedData[r].length; c++) {\n const rowLabel = yLabels?.[r]?.toString() ?? defaultRows[r] ?? `R${r + 1}`;\n const colLabel = xLabels?.[c]?.toString() ?? String(c + 1);\n const wellId = `${rowLabel}${colLabel}`;\n wells.push({ wellId, values: { Value: normalizedData[r][c] } });\n }\n }\n return wells;\n }, [normalizedData, xLabels, yLabels]);\n\n // Pass colorscale directly - PlateMap's ColorScale type supports both string and array formats\n const plateMapColorScale: ColorScale | undefined = colorscale;\n\n return (\n <PlateMap\n data={wellData}\n plateFormat=\"custom\"\n rows={rows}\n columns={columns}\n title={title}\n xTitle={xTitle}\n yTitle={yTitle}\n xLabels={xLabels}\n yLabels={yLabels}\n colorScale={plateMapColorScale}\n valueMin={zmin}\n valueMax={zmax}\n showColorBar={showScale}\n width={width}\n height={height}\n layerConfigs={[{ id: \"Value\", valueUnit }]}\n precision={precision}\n />\n );\n};\n\nexport { Heatmap };\nexport type { HeatmapProps };\n"],"names":["normalizeData","data","maxLength","row","newRow","Heatmap","xLabels","yLabels","title","xTitle","yTitle","colorscale","width","height","showScale","precision","zmin","zmax","valueUnit","normalizedData","rows","columns","wellData","useMemo","defaultRows","wells","c","rowLabel","colLabel","wellId","plateMapColorScale","jsx","PlateMap"],"mappings":"8KA0DA,SAASA,EAAcC,EAA8B,CACnD,GAAI,CAACA,GAAQA,EAAK,SAAW,QAAU,CAAA,EAEvC,MAAMC,EAAY,KAAK,IAAI,GAAGD,EAAK,IAAKE,GAAQA,EAAI,MAAM,CAAC,EAE3D,OAAOF,EAAK,IAAKE,GAAQ,CACvB,GAAIA,EAAI,SAAWD,EAAW,OAAOC,EAErC,MAAMC,EAAS,CAAC,GAAGD,CAAG,EACtB,KAAOC,EAAO,OAASF,GACrBE,EAAO,KAAK,CAAC,EAEf,OAAOA,CACT,CAAC,CACH,CAEA,MAAMC,EAAkC,CAAC,CACvC,KAAAJ,EACA,QAAAK,EACA,QAAAC,EACA,MAAAC,EACA,OAAAC,EACA,OAAAC,EACA,WAAAC,EACA,MAAAC,EAAQ,IACR,OAAAC,EAAS,IACT,UAAAC,EAAY,GACZ,UAAAC,EAAY,EACZ,KAAAC,EACA,KAAAC,EACA,UAAAC,EAAY,EACd,IAAM,CAEJ,MAAMC,EAAiBlB,EAAOD,EAAcC,CAAI,EAAI,OAG9CmB,EAAOD,GAAgB,QAAWZ,GAAS,QAAU,GACrDc,EAAUF,IAAiB,CAAC,GAAG,QAAWb,GAAS,QAAU,GAG7DgB,EAAmCC,EAAAA,QAAQ,IAAM,CACrD,GAAI,CAACJ,EAAgB,OAErB,MAAMK,EAAc,6BACdC,EAAoB,CAAA,EAE1B,QAAS,EAAI,EAAG,EAAIN,EAAe,OAAQ,IACzC,QAASO,EAAI,EAAGA,EAAIP,EAAe,CAAC,EAAE,OAAQO,IAAK,CACjD,MAAMC,EAAWpB,IAAU,CAAC,GAAG,SAAA,GAAciB,EAAY,CAAC,GAAK,IAAI,EAAI,CAAC,GAClEI,EAAWtB,IAAUoB,CAAC,GAAG,YAAc,OAAOA,EAAI,CAAC,EACnDG,EAAS,GAAGF,CAAQ,GAAGC,CAAQ,GACrCH,EAAM,KAAK,CAAE,OAAAI,EAAQ,OAAQ,CAAE,MAAOV,EAAe,CAAC,EAAEO,CAAC,CAAA,CAAE,CAAG,CAChE,CAEF,OAAOD,CACT,EAAG,CAACN,EAAgBb,EAASC,CAAO,CAAC,EAG/BuB,EAA6CnB,EAEnD,OACEoB,EAAAA,IAACC,EAAAA,SAAA,CACC,KAAMV,EACN,YAAY,SACZ,KAAAF,EACA,QAAAC,EACA,MAAAb,EACA,OAAAC,EACA,OAAAC,EACA,QAAAJ,EACA,QAAAC,EACA,WAAYuB,EACZ,SAAUd,EACV,SAAUC,EACV,aAAcH,EACd,MAAAF,EACA,OAAAC,EACA,aAAc,CAAC,CAAE,GAAI,QAAS,UAAAK,EAAW,EACzC,UAAAH,CAAA,CAAA,CAGN"}

package/dist/components/charts/Heatmap/Heatmap.js ADDED Viewed

@@ -0,0 +1,67 @@
+import { jsx as d } from "react/jsx-runtime";
+import { useMemo as x } from "react";
+import { PlateMap as z } from "../PlateMap/PlateMap.js";
+function B(o) {
+  if (!o || o.length === 0) return [];
+  const e = Math.max(...o.map((t) => t.length));
+  return o.map((t) => {
+    if (t.length === e) return t;
+    const r = [...t];
+    for (; r.length < e; )
+      r.push(0);
+    return r;
+  });
+}
+const j = ({
+  data: o,
+  xLabels: e,
+  yLabels: t,
+  title: r,
+  xTitle: u,
+  yTitle: s,
+  colorscale: i,
+  width: m = 800,
+  height: h = 600,
+  showScale: g = !0,
+  precision: p = 0,
+  zmin: f,
+  zmax: w,
+  valueUnit: M = ""
+}) => {
+  const n = o ? B(o) : void 0, S = n?.length ?? t?.length ?? 16, C = n?.[0]?.length ?? e?.length ?? 24, v = x(() => {
+    if (!n) return;
+    const D = "ABCDEFGHIJKLMNOPQRSTUVWXYZ", c = [];
+    for (let l = 0; l < n.length; l++)
+      for (let a = 0; a < n[l].length; a++) {
+        const R = t?.[l]?.toString() ?? D[l] ?? `R${l + 1}`, V = e?.[a]?.toString() ?? String(a + 1), $ = `${R}${V}`;
+        c.push({ wellId: $, values: { Value: n[l][a] } });
+      }
+    return c;
+  }, [n, e, t]);
+  return /* @__PURE__ */ d(
+    z,
+    {
+      data: v,
+      plateFormat: "custom",
+      rows: S,
+      columns: C,
+      title: r,
+      xTitle: u,
+      yTitle: s,
+      xLabels: e,
+      yLabels: t,
+      colorScale: i,
+      valueMin: f,
+      valueMax: w,
+      showColorBar: g,
+      width: m,
+      height: h,
+      layerConfigs: [{ id: "Value", valueUnit: M }],
+      precision: p
+    }
+  );
+};
+export {
+  j as Heatmap
+};
+//# sourceMappingURL=Heatmap.js.map

package/dist/components/charts/Heatmap/Heatmap.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Heatmap.js","sources":["../../../../src/components/charts/Heatmap/Heatmap.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\n\nimport { PlateMap } from \"../PlateMap\";\n\nimport type { ColorScale, WellData } from \"../PlateMap\";\n\n/**\n * Props for the Heatmap component\n * @deprecated Use PlateMap component instead. Heatmap is now a wrapper around PlateMap for backward compatibility.\n */\ninterface HeatmapProps {\n /** 2D array of numeric values */\n data?: number[][];\n /** Custom x-axis labels (column labels) */\n xLabels?: string[] | number[];\n /** Custom y-axis labels (row labels) */\n yLabels?: string[] | number[];\n /** Chart title */\n title?: string;\n /** X-axis title */\n xTitle?: string;\n /** Y-axis title */\n yTitle?: string;\n /** Color scale - string name or array of [position, color] pairs */\n colorscale?: string | Array<[number, string]>;\n /** Chart width in pixels */\n width?: number;\n /** Chart height in pixels */\n height?: number;\n /** Show color scale legend */\n showScale?: boolean;\n /** Number of decimal places for values */\n precision?: number;\n /** Minimum value for color scale */\n zmin?: number;\n /** Maximum value for color scale */\n zmax?: number;\n /** Value unit suffix */\n valueUnit?: string;\n}\n\n/**\n * Heatmap component for 2D data visualization\n * @deprecated Use PlateMap component instead. This component is now a wrapper around PlateMap for backward compatibility.\n *\n * @example\n * ```tsx\n * <Heatmap\n * data={[[1, 2, 3], [4, 5, 6]]}\n * xLabels={['A', 'B', 'C']}\n * yLabels={['Row 1', 'Row 2']}\n * title=\"My Heatmap\"\n * />\n * ```\n */\n/**\n * Normalize jagged 2D array to consistent width (backward compatibility)\n */\nfunction normalizeData(data: number[][]): number[][] {\n if (!data || data.length === 0) return [];\n\n const maxLength = Math.max(...data.map((row) => row.length));\n\n return data.map((row) => {\n if (row.length === maxLength) return row;\n\n const newRow = [...row];\n while (newRow.length < maxLength) {\n newRow.push(0);\n }\n return newRow;\n });\n}\n\nconst Heatmap: React.FC<HeatmapProps> = ({\n data,\n xLabels,\n yLabels,\n title,\n xTitle,\n yTitle,\n colorscale,\n width = 800,\n height = 600,\n showScale = true,\n precision = 0,\n zmin,\n zmax,\n valueUnit = \"\",\n}) => {\n // Normalize jagged arrays to consistent width (backward compatibility)\n const normalizedData = data ? normalizeData(data) : undefined;\n\n // Determine rows and columns from normalized data or labels\n const rows = normalizedData?.length ?? (yLabels?.length ?? 16);\n const columns = normalizedData?.[0]?.length ?? (xLabels?.length ?? 24);\n\n // Convert 2D array to WellData format for PlateMap\n const wellData: WellData[] | undefined = useMemo(() => {\n if (!normalizedData) return;\n\n const defaultRows = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ\";\n const wells: WellData[] = [];\n\n for (let r = 0; r < normalizedData.length; r++) {\n for (let c = 0; c < normalizedData[r].length; c++) {\n const rowLabel = yLabels?.[r]?.toString() ?? defaultRows[r] ?? `R${r + 1}`;\n const colLabel = xLabels?.[c]?.toString() ?? String(c + 1);\n const wellId = `${rowLabel}${colLabel}`;\n wells.push({ wellId, values: { Value: normalizedData[r][c] } });\n }\n }\n return wells;\n }, [normalizedData, xLabels, yLabels]);\n\n // Pass colorscale directly - PlateMap's ColorScale type supports both string and array formats\n const plateMapColorScale: ColorScale | undefined = colorscale;\n\n return (\n <PlateMap\n data={wellData}\n plateFormat=\"custom\"\n rows={rows}\n columns={columns}\n title={title}\n xTitle={xTitle}\n yTitle={yTitle}\n xLabels={xLabels}\n yLabels={yLabels}\n colorScale={plateMapColorScale}\n valueMin={zmin}\n valueMax={zmax}\n showColorBar={showScale}\n width={width}\n height={height}\n layerConfigs={[{ id: \"Value\", valueUnit }]}\n precision={precision}\n />\n );\n};\n\nexport { Heatmap };\nexport type { HeatmapProps };\n"],"names":["normalizeData","data","maxLength","row","newRow","Heatmap","xLabels","yLabels","title","xTitle","yTitle","colorscale","width","height","showScale","precision","zmin","zmax","valueUnit","normalizedData","rows","columns","wellData","useMemo","defaultRows","wells","r","c","rowLabel","colLabel","wellId","jsx","PlateMap"],"mappings":";;;AA0DA,SAASA,EAAcC,GAA8B;AACnD,MAAI,CAACA,KAAQA,EAAK,WAAW,UAAU,CAAA;AAEvC,QAAMC,IAAY,KAAK,IAAI,GAAGD,EAAK,IAAI,CAACE,MAAQA,EAAI,MAAM,CAAC;AAE3D,SAAOF,EAAK,IAAI,CAACE,MAAQ;AACvB,QAAIA,EAAI,WAAWD,EAAW,QAAOC;AAErC,UAAMC,IAAS,CAAC,GAAGD,CAAG;AACtB,WAAOC,EAAO,SAASF;AACrB,MAAAE,EAAO,KAAK,CAAC;AAEf,WAAOA;AAAA,EACT,CAAC;AACH;AAEA,MAAMC,IAAkC,CAAC;AAAA,EACvC,MAAAJ;AAAA,EACA,SAAAK;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC,IAAY;AACd,MAAM;AAEJ,QAAMC,IAAiBlB,IAAOD,EAAcC,CAAI,IAAI,QAG9CmB,IAAOD,GAAgB,UAAWZ,GAAS,UAAU,IACrDc,IAAUF,IAAiB,CAAC,GAAG,UAAWb,GAAS,UAAU,IAG7DgB,IAAmCC,EAAQ,MAAM;AACrD,QAAI,CAACJ,EAAgB;AAErB,UAAMK,IAAc,8BACdC,IAAoB,CAAA;AAE1B,aAASC,IAAI,GAAGA,IAAIP,EAAe,QAAQO;AACzC,eAASC,IAAI,GAAGA,IAAIR,EAAeO,CAAC,EAAE,QAAQC,KAAK;AACjD,cAAMC,IAAWrB,IAAUmB,CAAC,GAAG,SAAA,KAAcF,EAAYE,CAAC,KAAK,IAAIA,IAAI,CAAC,IAClEG,IAAWvB,IAAUqB,CAAC,GAAG,cAAc,OAAOA,IAAI,CAAC,GACnDG,IAAS,GAAGF,CAAQ,GAAGC,CAAQ;AACrC,QAAAJ,EAAM,KAAK,EAAE,QAAAK,GAAQ,QAAQ,EAAE,OAAOX,EAAeO,CAAC,EAAEC,CAAC,EAAA,EAAE,CAAG;AAAA,MAChE;AAEF,WAAOF;AAAA,EACT,GAAG,CAACN,GAAgBb,GAASC,CAAO,CAAC;AAKrC,SACE,gBAAAwB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAMV;AAAA,MACN,aAAY;AAAA,MACZ,MAAAF;AAAA,MACA,SAAAC;AAAA,MACA,OAAAb;AAAA,MACA,QAAAC;AAAA,MACA,QAAAC;AAAA,MACA,SAAAJ;AAAA,MACA,SAAAC;AAAA,MACA,YAb+CI;AAAA,MAc/C,UAAUK;AAAA,MACV,UAAUC;AAAA,MACV,cAAcH;AAAA,MACd,OAAAF;AAAA,MACA,QAAAC;AAAA,MACA,cAAc,CAAC,EAAE,IAAI,SAAS,WAAAK,GAAW;AAAA,MACzC,WAAAH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/charts/Histogram/Histogram.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),k=require("plotly.js-dist"),d=require("react"),S=require("../../../hooks/use-plotly-theme.cjs"),p=require("../../../utils/colors.cjs");;/* empty css /const z=-.5,B=n=>n.reduce((e,u)=>e+u,0)/n.length,I=(n,a)=>{const u=n.map(r=>Math.pow(r-a,2)).reduce((r,l)=>r+l,0)/n.length;return Math.sqrt(u)},A=(n,a,e,u,r=100)=>{const l=[],x=[],f=(u-e)/(r-1);for(let s=0;s<r;s++){const o=e+sf;l.push(o);const g=zMath.pow((o-n)/a,2),C=1/(aMath.sqrt(2Math.PI))Math.exp(g);x.push(C)}return{x:l,y:x}},F=(n,a,e)=>{const u=Math.ceil((e.end-e.start)/e.size),r=Array(u).fill(0);a.forEach(s=>{if(s>=e.start&&s<=e.end){const o=Math.floor((s-e.start)/e.size);r[o]++}});const l=Math.max(...r),x=Math.max(...n),f=l/x;return n.map(s=>sf)},W=({dataSeries:n,width:a=480,height:e=480,title:u="Histogram",xTitle:r="X Axis",yTitle:l="Frequency",bargap:x=.2,showDistributionLine:f=!1})=>{const s=d.useRef(null),o=S.usePlotlyTheme(),g=d.useMemo(()=>Array.isArray(n)?n:[n],[n]),C=d.useMemo(()=>g.length>1?"stack":void 0,[g.length]),O=d.useMemo(()=>[p.COLORS.ORANGE,p.COLORS.RED,p.COLORS.BLUE,p.COLORS.GREEN,p.COLORS.PURPLE,p.COLORS.YELLOW],[]),y=d.useMemo(()=>g.map((t,h)=>{const m=typeof t.showDistributionLine>"u"?f:t.showDistributionLine;return{...t,color:t.color\|\|O[h%O.length],opacity:m?.5:t.opacity\|\|1,showDistributionLine:m,lineWidth:t.lineWidth\|\|3}}),[g,f,O]),v=o.gridColor,w=d.useMemo(()=>y.map(t=>({type:"histogram",x:t.x,name:t.name,marker:{color:t.color,line:{color:o.paperBg,width:1},opacity:t.opacity},autobinx:t.autobinx,xbins:t.xbins,hovertemplate:`${r}: %{x}<br>${l}: %{y}<extra>${t.name}</extra>`})),[y,r,l,o]),L=d.useMemo(()=>y.filter(t=>t.showDistributionLine).map(t=>{const h=B(t.x),m=I(t.x,h),M=Math.min(...t.x),c=Math.max(...t.x),b=c-M,R=M-b.1,j=c+b*.1,E=t.xbins\|\|{start:R,end:j,size:b/10},D=A(h,m,R,j,100),P=F(D.y,t.x,E);return{type:"scatter",x:D.x,y:P,mode:"lines",name:`${t.name} Distribution`,line:{color:t.color,width:t.lineWidth},hoverinfo:"none"}}),[y]),N=d.useMemo(()=>[...w,...L],[w,L]);d.useEffect(()=>{if(!s.current)return;const t={width:a,height:e,font:{family:"Inter, sans-serif"},showlegend:!1,margin:{l:90,r:40,b:80,t:40},xaxis:{title:{text:r,font:{size:16,color:o.textSecondary,family:"Inter, sans-serif",weight:400},standoff:20},gridcolor:v,tickcolor:o.tickColor,ticklen:8,tickwidth:1,ticks:"outside",linecolor:o.lineColor,linewidth:1,zeroline:!1},yaxis:{title:{text:l,font:{size:16,color:o.textSecondary,family:"Inter, sans-serif",weight:400},standoff:20},gridcolor:v,tickcolor:o.tickColor,ticklen:8,tickwidth:1,ticks:"outside",linecolor:o.lineColor,linewidth:1,zeroline:!1,rangemode:"tozero"},barmode:C,bargap:x,paper_bgcolor:o.paperBg,plot_bgcolor:o.plotBg},h={responsive:!0,displayModeBar:!1,displaylogo:!1};k.newPlot(s.current,N,t,h);const m=s.current;return()=>{m&&k.purge(m)}},[a,e,r,l,x,N,C,v,o]);const q=({series:t})=>{const h=t.map((c,b)=>i.jsx(d.Fragment,{children:i.jsxs("div",{className:"legend-item",children:[i.jsx("span",{className:"color-box",style:{background:c.color}}),c.name,b<t.length-1&&i.jsx("span",{className:"divider"})]})},c.name)),m=[],M=6;for(let c=0;c<h.length;c+=M)m.push(i.jsx("div",{className:"legend-row",children:h.slice(c,c+M)},c));return i.jsx("div",{className:"legend-container",children:m})};return i.jsx("div",{className:"histogram-container",style:{width:a},children:i.jsxs("div",{className:"chart-container",children:[u&&i.jsx("div",{className:"title-container",children:i.jsx("h2",{className:"title",children:u})}),i.jsx("div",{ref:s,style:{width:"100%",height:"100%",margin:"0"}}),i.jsx(q,{series:y})]})})};exports.Histogram=W;
2	+ //# sourceMappingURL=Histogram.cjs.map

package/dist/components/charts/Histogram/Histogram.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Histogram.cjs","sources":["../../../../src/components/charts/Histogram/Histogram.tsx"],"sourcesContent":["import Plotly from \"plotly.js-dist\";\nimport React, { useEffect, useRef, useMemo } from \"react\";\n\nimport { usePlotlyTheme } from \"@/hooks/use-plotly-theme\";\nimport { COLORS } from \"@/utils/colors\";\nimport \"./Histogram.scss\";\n\n/** Exponent coefficient for normal distribution calculation */\nconst NORMAL_DISTRIBUTION_EXPONENT_COEFF = -0.5;\n\ninterface HistogramDataSeries {\n x: number[];\n name: string;\n color?: string;\n autobinx?: boolean;\n xbins?: {\n start: number;\n end: number;\n size: number;\n };\n opacity?: number;\n showDistributionLine?: boolean;\n lineWidth?: number;\n}\n\ntype HistogramProps = {\n dataSeries: HistogramDataSeries | HistogramDataSeries[];\n width?: number;\n height?: number;\n title?: string;\n xTitle?: string;\n yTitle?: string;\n bargap?: number;\n showDistributionLine?: boolean;\n};\n\nconst calculateMean = (data: number[]): number => {\n const sum = data.reduce((acc, val) => acc + val, 0);\n return sum / data.length;\n};\n\nconst calculateStdDev = (data: number[], mean: number): number => {\n const squaredDiffs = data.map((value) => Math.pow(value - mean, 2));\n const variance =\n squaredDiffs.reduce((acc, val) => acc + val, 0) / data.length;\n return Math.sqrt(variance);\n};\n\nconst generateNormalDistributionPoints = (\n mean: number,\n stdDev: number,\n start: number,\n end: number,\n points = 100\n): { x: number[]; y: number[] } => {\n const xValues: number[] = [];\n const yValues: number[] = [];\n\n const step = (end - start) / (points - 1);\n\n for (let i = 0; i < points; i++) {\n const x = start + i * step;\n xValues.push(x);\n\n const exponent = NORMAL_DISTRIBUTION_EXPONENT_COEFF * Math.pow((x - mean) / stdDev, 2);\n const y = (1 / (stdDev * Math.sqrt(2 * Math.PI))) * Math.exp(exponent);\n yValues.push(y);\n }\n\n return { x: xValues, y: yValues };\n};\n\nconst scaleDistributionCurve = (\n yValues: number[],\n histogramData: number[],\n bins: { start: number; end: number; size: number }\n): number[] => {\n const binCount = Math.ceil((bins.end - bins.start) / bins.size);\n const binFrequencies = Array(binCount).fill(0);\n\n histogramData.forEach((value) => {\n if (value >= bins.start && value <= bins.end) {\n const binIndex = Math.floor((value - bins.start) / bins.size);\n binFrequencies[binIndex]++;\n }\n });\n\n const maxBinFrequency = Math.max(...binFrequencies);\n const maxCurveValue = Math.max(...yValues);\n\n const scaleFactor = maxBinFrequency / maxCurveValue;\n\n return yValues.map((y) => y * scaleFactor);\n};\n\nconst Histogram: React.FC<HistogramProps> = ({\n dataSeries,\n width = 480,\n height = 480,\n title = \"Histogram\",\n xTitle = \"X Axis\",\n yTitle = \"Frequency\",\n bargap = 0.2,\n showDistributionLine = false,\n}) => {\n const plotRef = useRef<HTMLDivElement>(null);\n const theme = usePlotlyTheme();\n const seriesArray = useMemo(\n () => (Array.isArray(dataSeries) ? dataSeries : [dataSeries]),\n [dataSeries],\n );\n const effectiveBarMode = useMemo<\n \"stack\" | \"group\" | \"overlay\" | \"relative\" | undefined\n >(() => (seriesArray.length > 1 ? \"stack\" : undefined), [seriesArray.length]);\n\n const defaultColors = useMemo(\n () => [\n COLORS.ORANGE,\n COLORS.RED,\n COLORS.BLUE,\n COLORS.GREEN,\n COLORS.PURPLE,\n COLORS.YELLOW,\n ],\n [],\n );\n\n const seriesWithColors = useMemo(() => {\n return seriesArray.map((series, index) => {\n const hasDistributionLine =\n typeof series.showDistributionLine === \"undefined\"\n ? showDistributionLine\n : series.showDistributionLine;\n\n return {\n ...series,\n color: series.color || defaultColors[index % defaultColors.length],\n opacity: hasDistributionLine ? 0.5 : series.opacity || 1,\n showDistributionLine: hasDistributionLine,\n lineWidth: series.lineWidth || 3,\n };\n });\n }, [seriesArray, showDistributionLine, defaultColors]);\n\n const gridColor = theme.gridColor;\n\n const histogramData = useMemo(\n () =>\n seriesWithColors.map((series) => ({\n type: \"histogram\" as const,\n x: series.x,\n name: series.name,\n marker: {\n color: series.color,\n line: {\n color: theme.paperBg,\n width: 1,\n },\n opacity: series.opacity,\n },\n autobinx: series.autobinx,\n xbins: series.xbins,\n hovertemplate: `${xTitle}: %{x}<br>${yTitle}: %{y}<extra>${series.name}</extra>`,\n })),\n [seriesWithColors, xTitle, yTitle, theme],\n );\n\n const distributionLines = useMemo(\n () =>\n seriesWithColors\n .filter((series) => series.showDistributionLine)\n .map((series) => {\n const mean = calculateMean(series.x);\n const stdDev = calculateStdDev(series.x, mean);\n\n const min = Math.min(...series.x);\n const max = Math.max(...series.x);\n const range = max - min;\n const start = min - range * 0.1;\n const end = max + range * 0.1;\n\n const bins = series.xbins || {\n start: start,\n end: end,\n size: range / 10,\n };\n\n const curvePoints = generateNormalDistributionPoints(\n mean,\n stdDev,\n start,\n end,\n 100,\n );\n\n const scaledYValues = scaleDistributionCurve(\n curvePoints.y,\n series.x,\n bins,\n );\n\n return {\n type: \"scatter\" as const,\n x: curvePoints.x,\n y: scaledYValues,\n mode: \"lines\" as const,\n name: `${series.name} Distribution`,\n line: {\n color: series.color,\n width: series.lineWidth,\n },\n hoverinfo: \"none\" as const,\n };\n }),\n [seriesWithColors],\n );\n\n const plotData = useMemo(\n () => [...histogramData, ...distributionLines],\n [histogramData, distributionLines],\n );\n\n useEffect(() => {\n if (!plotRef.current) return;\n\n const layout = {\n width,\n height,\n font: {\n family: \"Inter, sans-serif\",\n },\n showlegend: false,\n margin: { l: 90, r: 40, b: 80, t: 40 },\n xaxis: {\n title: {\n text: xTitle,\n font: {\n size: 16,\n color: theme.textSecondary,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n standoff: 20,\n },\n gridcolor: gridColor,\n tickcolor: theme.tickColor,\n ticklen: 8,\n tickwidth: 1,\n ticks: \"outside\" as const,\n linecolor: theme.lineColor,\n linewidth: 1,\n zeroline: false,\n },\n yaxis: {\n title: {\n text: yTitle,\n font: {\n size: 16,\n color: theme.textSecondary,\n family: \"Inter, sans-serif\",\n weight: 400,\n },\n standoff: 20,\n },\n gridcolor: gridColor,\n tickcolor: theme.tickColor,\n ticklen: 8,\n tickwidth: 1,\n ticks: \"outside\" as const,\n linecolor: theme.lineColor,\n linewidth: 1,\n zeroline: false,\n rangemode: \"tozero\" as const,\n },\n barmode: effectiveBarMode,\n bargap: bargap,\n paper_bgcolor: theme.paperBg,\n plot_bgcolor: theme.plotBg,\n };\n\n const config = {\n responsive: true,\n displayModeBar: false,\n displaylogo: false,\n };\n\n Plotly.newPlot(plotRef.current, plotData, layout, config);\n\n // Capture ref value for cleanup\n const plotElement = plotRef.current;\n\n return () => {\n if (plotElement) {\n Plotly.purge(plotElement);\n }\n };\n }, [width, height, xTitle, yTitle, bargap, plotData, effectiveBarMode, gridColor, theme]);\n\n const ChartLegend: React.FC<{\n series: Array<{ name: string; color: string }>;\n }> = ({ series }) => {\n const items = series.map((item, i) => (\n <React.Fragment key={item.name}>\n <div className=\"legend-item\">\n <span className=\"color-box\" style={{ background: item.color }} />\n {item.name}\n {i < series.length - 1 && <span className=\"divider\" />}\n </div>\n </React.Fragment>\n ));\n\n const rows = [];\n const rowSize = 6;\n for (let i = 0; i < items.length; i += rowSize) {\n rows.push(\n <div className=\"legend-row\" key={i}>\n {items.slice(i, i + rowSize)}\n </div>\n );\n }\n\n return <div className=\"legend-container\">{rows}</div>;\n };\n\n return (\n <div className=\"histogram-container\" style={{ width: width }}>\n <div className=\"chart-container\">\n {title && (\n <div className=\"title-container\">\n <h2 className=\"title\">{title}</h2>\n </div>\n )}\n <div\n ref={plotRef}\n style={{\n width: \"100%\",\n height: \"100%\",\n margin: \"0\",\n }}\n />\n <ChartLegend series={seriesWithColors} />\n </div>\n </div>\n );\n};\n\nexport { Histogram };\nexport type { HistogramDataSeries, HistogramProps };\n"],"names":["NORMAL_DISTRIBUTION_EXPONENT_COEFF","calculateMean","data","acc","val","calculateStdDev","mean","variance","value","generateNormalDistributionPoints","stdDev","start","end","points","xValues","yValues","step","i","x","exponent","y","scaleDistributionCurve","histogramData","bins","binCount","binFrequencies","binIndex","maxBinFrequency","maxCurveValue","scaleFactor","Histogram","dataSeries","width","height","title","xTitle","yTitle","bargap","showDistributionLine","plotRef","useRef","theme","usePlotlyTheme","seriesArray","useMemo","effectiveBarMode","defaultColors","COLORS","seriesWithColors","series","index","hasDistributionLine","gridColor","distributionLines","min","max","range","curvePoints","scaledYValues","plotData","useEffect","layout","config","Plotly","plotElement","ChartLegend","items","item","jsx","React","jsxs","rows","rowSize"],"mappings":"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"}