@carto/ps-react-ui 4.4.2 → 4.4.3

package/src/widgets/histogram/types.ts

@@ -1,11 +1,11 @@
-import type { EchartWidgetData, EchartWidgetState } from '../echart'
+import type { EchartWidgetState } from '../echart'
 import type {
   EchartWidgetOptionProps,
   EchartWidgetProps,
 } from '../echart/types'
 import type { ConfigProps } from '../loader'
 
-export type HistogramWidgetData = EchartWidgetData
+export type HistogramWidgetData = number[][]
 
 export type HistogramWidgetState = EchartWidgetState
 
@@ -14,4 +14,10 @@ export type HistogramWidgetConfig = EchartWidgetProps & {
 }
 
 export type HistogramConfig = ConfigProps &
-  EchartWidgetOptionProps<HistogramWidgetData>
+  Pick<
+    EchartWidgetOptionProps<unknown>,
+    'theme' | 'formatter' | 'labelFormatter'
+  > & {
+    data?: number[][]
+    ticks: number[]
+  }

package/src/widgets/pie/config.ts

@@ -29,6 +29,7 @@ export function pieConfig(props: PieConfig): PieWidgetConfig {
     type: 'pie',
     option: mergeEchartWidgetConfig(getCommonOptions(props), getOption(props)),
     formatter: props.formatter,
+    labelFormatter: props.labelFormatter,
   }
 }
 
@@ -36,6 +37,7 @@ function getOption({
   data = [],
   theme,
   formatter,
+  labelFormatter,
 }: PieConfig): EchartOptionsProps {
   const multiSeries = (data?.length ?? 0) > 1
 
@@ -44,7 +46,7 @@ function getOption({
     let niceMax = 1
 
     return {
-      legend: buildLegendConfig(true),
+      legend: buildLegendConfig({ hasLegend: true, labelFormatter }),
       grid: {
         ...buildGridConfig(true, theme),
         right: parseInt(theme.spacing(4)),
@@ -97,6 +99,10 @@ function getOption({
         },
         axisLabel: {
           padding: [parseInt(theme.spacing(0.5)), 0, 0, 0],
+          ...(labelFormatter && {
+            formatter: (value: string | number) =>
+              String(labelFormatter(value)),
+          }),
         },
       },
       tooltip: {
@@ -113,7 +119,9 @@ function getOption({
 
           const marker = typeof item.marker === 'string' ? item.marker : ''
           const seriesName = item.seriesName ? `${item.seriesName}: ` : ''
-          const name = item.name ?? ''
+          const name = labelFormatter
+            ? String(labelFormatter(item.name ?? ''))
+            : (item.name ?? '')
 
           return { name, seriesName, marker, value: formattedValue }
         }),
@@ -132,7 +140,7 @@ function getOption({
   const hasLegend = true
 
   return {
-    legend: buildLegendConfig(hasLegend),
+    legend: buildLegendConfig({ hasLegend, labelFormatter }),
     grid: {
       ...buildGridConfig(hasLegend, theme),
       left: 0,
@@ -164,7 +172,9 @@ function getOption({
 
         const marker = typeof item.marker === 'string' ? item.marker : ''
         const seriesName = item.seriesName ? `${item.seriesName}: ` : ''
-        const name = item.name ?? ''
+        const name = labelFormatter
+          ? String(labelFormatter(item.name ?? ''))
+          : (item.name ?? '')
 
         return {
           name: seriesName,
@@ -203,7 +213,9 @@ function getOption({
               ? formatter(value)
               : (value ?? '')
 
-          const nameFormatted = name
+          const nameFormatted = labelFormatter
+            ? String(labelFormatter(name ?? ''))
+            : (name ?? '')
 
           return `{c|${formattedValue}}\n\n{b|${nameFormatted}}`
         },

package/src/widgets/scatterplot/config.ts

@@ -14,6 +14,7 @@ import {
   createTooltipFormatter,
   createChartDownloadConfig,
   applyYAxisFormatter,
+  applyXAxisFormatter,
 } from '../utils/chart-config'
 
 export const scatterplotDownloadConfig =
@@ -32,6 +33,7 @@ export function scatterplotConfig(
     type: 'scatterplot',
     option: mergeEchartWidgetConfig(getCommonOptions(props), getOption(props)),
     formatter: props.formatter,
+    labelFormatter: props.labelFormatter,
   }
 }
 
@@ -39,6 +41,7 @@ function getOption({
   data = [],
   theme,
   formatter,
+  labelFormatter,
 }: ScatterplotConfig): EchartOptionsProps {
   const hasLegend = data.length > 1
 
@@ -94,12 +97,12 @@ function getOption({
   }
 
   return {
-    legend: buildLegendConfig(hasLegend),
+    legend: buildLegendConfig({ hasLegend, labelFormatter }),
     grid: {
       ...(!hasLegend && { bottom: parseInt(theme.spacing(1)) }),
       ...(hasLegend && { bottom: parseInt(theme.spacing(10)) }),
     },
-    xAxis,
+    xAxis: applyXAxisFormatter(xAxis, labelFormatter),
     yAxis: applyYAxisFormatter(yAxis, formatter),
     tooltip: {
       trigger: 'item',
@@ -114,7 +117,9 @@ function getOption({
             ? formatter(_value)
             : (_value ?? '')
         const marker = typeof item.marker === 'string' ? item.marker : ''
-        const name = item.seriesName ?? ''
+        const name = labelFormatter
+          ? String(labelFormatter(item.seriesName ?? ''))
+          : (item.seriesName ?? '')
 
         return { name, seriesName: '', marker, value: formattedValue }
       }),

package/src/widgets/stores/types.ts

@@ -31,6 +31,8 @@ export interface WidgetsStoreProps {
   registeredTools?: ToolRegistration[]
   /** Formatter function for widget values */
   formatter?: (value: number) => string
+  /** Formatter function for widget label/category values */
+  labelFormatter?: (value: string | number) => string | number
   /** Locale for number formatting (e.g., 'en-US', 'es-ES', 'fr-FR') */
   locale?: string
 }

package/src/widgets/timeseries/config.ts

@@ -15,6 +15,7 @@ import {
   createTooltipFormatter,
   createChartDownloadConfig,
   applyYAxisFormatter,
+  applyXAxisFormatter,
 } from '../utils/chart-config'
 
 export const timeseriesDownloadConfig =
@@ -33,6 +34,7 @@ export function timeseriesConfig(
     type: 'timeseries',
     option: mergeEchartWidgetConfig(getCommonOptions(props), getOption(props)),
     formatter: props.formatter,
+    labelFormatter: props.labelFormatter,
   }
 }
 
@@ -40,6 +42,7 @@ function getOption({
   data = [],
   theme,
   formatter,
+  labelFormatter,
 }: TimeseriesConfig): EchartOptionsProps {
   const hasLegend = (data?.length ?? 0) > 1
 
@@ -73,7 +76,7 @@ function getOption({
   }
 
   return {
-    legend: buildLegendConfig(hasLegend),
+    legend: buildLegendConfig({ hasLegend, labelFormatter }),
     grid: {
       ...buildGridConfig(hasLegend, theme),
       outerBounds: {
@@ -82,18 +85,21 @@ function getOption({
         top: parseInt(theme.spacing(2)),
       },
     },
-    xAxis: {
-      type: 'category',
-      axisTick: {
-        alignWithLabel: true,
+    xAxis: applyXAxisFormatter(
+      {
+        type: 'category',
+        axisTick: {
+          alignWithLabel: true,
+        },
+        axisLabel: {
+          show: true,
+          showMaxLabel: true,
+          showMinLabel: true,
+          rotate: 45,
+        },
       },
-      axisLabel: {
-        show: true,
-        showMaxLabel: true,
-        showMinLabel: true,
-        rotate: 45,
-      },
-    },
+      labelFormatter,
+    ),
     yAxis: applyYAxisFormatter(yAxis, formatter),
     tooltip: {
       formatter: createTooltipFormatter((item) => {
@@ -108,7 +114,9 @@ function getOption({
 
         const marker = typeof item.marker === 'string' ? item.marker : ''
         const seriesName = item.seriesName ? `${item.seriesName}: ` : ''
-        const name = item.name ?? ''
+        const name = labelFormatter
+          ? String(labelFormatter(item.name ?? ''))
+          : (item.name ?? '')
 
         return { name, seriesName, marker, value: formattedValue }
       }),

package/src/widgets/utils/chart-config/index.ts

@@ -2,7 +2,7 @@
  * Shared utilities for chart widget configuration
  */
 
-export { defaultFormatter } from '../formatter'
+export { defaultFormatter, defaultLabelFormatter } from '../formatter'
 
 export { createChartWidgetConfig } from './config-factory'
 export type {

package/src/widgets/utils/chart-config/option-builders.ts

@@ -26,10 +26,18 @@ export function niceNum(value: number): number {
 /**
  * Builds standard legend configuration for chart widgets
  *
- * @param hasLegend - Whether to show the legend
+ * @param params - Legend configuration parameters
+ * @param params.hasLegend - Whether to show the legend
+ * @param params.labelFormatter - Optional formatter for legend item names
  * @returns Legend configuration object
  */
-export function buildLegendConfig(hasLegend: boolean): LegendComponentOption {
+export function buildLegendConfig({
+  hasLegend,
+  labelFormatter,
+}: {
+  hasLegend: boolean
+  labelFormatter?: (value: string | number) => string | number
+}): LegendComponentOption {
   return {
     show: hasLegend,
     icon: 'circle' as const,
@@ -37,6 +45,9 @@ export function buildLegendConfig(hasLegend: boolean): LegendComponentOption {
     bottom: 0,
     orient: 'horizontal',
     type: 'scroll',
+    ...(labelFormatter && {
+      formatter: (name: string) => String(labelFormatter(name)),
+    }),
   }
 }
 
@@ -101,25 +112,24 @@ export function createAxisLabelFormatter(
 }
 
 /**
- * Applies formatter to xAxis configuration
- * Only applies to single axis objects (not arrays) with type 'value'
+ * Applies labelFormatter to xAxis configuration
+ * Applies to any xAxis regardless of axis type (category, value, etc.)
  *
  * @param xAxis - Existing xAxis configuration
- * @param formatter - Optional formatter function from widget config
- * @returns Updated xAxis configuration or undefined if no changes needed
+ * @param labelFormatter - Optional labelFormatter function from widget config
+ * @returns Updated xAxis configuration
  */
 export function applyXAxisFormatter(
   xAxis: unknown,
-  formatter?: (value: number) => string,
+  formatter?: (value: string | number) => string | number,
 ) {
-  let axisFormatter = createAxisLabelFormatter(formatter)
-
   const xAxisIsObject = xAxis && !Array.isArray(xAxis)
   const xAxisTyped = xAxis as { type?: string; axisLabel?: unknown }
 
-  if (!xAxisIsObject || xAxisTyped.type !== 'value') {
-    axisFormatter = undefined
-  }
+  const axisFormatter =
+    formatter && xAxisIsObject
+      ? (value: string | number) => String(formatter(value))
+      : undefined
 
   return {
     ...xAxisTyped,

package/src/widgets/utils/formatter.ts

@@ -1 +1,2 @@
-export const defaultFormatter = (value: number) => value.toString()
+export const defaultFormatter = (value: number) => String(value)
+export const defaultLabelFormatter = (value: string | number) => value

package/src/widgets/utils/index.ts

@@ -1,5 +1,5 @@
 // Formatter
-export { defaultFormatter } from './formatter'
+export { defaultFormatter, defaultLabelFormatter } from './formatter'
 
 // Chart configuration
 export { createChartWidgetConfig } from './chart-config'

package/dist/formatter-B1Xh8XDH.js

@@ -1,5 +0,0 @@
-const o = (t) => t.toString();
-export {
-  o as d
-};
-//# sourceMappingURL=formatter-B1Xh8XDH.js.map

package/dist/formatter-B1Xh8XDH.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"formatter-B1Xh8XDH.js","sources":["../src/widgets/utils/formatter.ts"],"sourcesContent":["export const defaultFormatter = (value: number) => value.toString()\n"],"names":["defaultFormatter","value","toString"],"mappings":"AAAO,MAAMA,IAAmBA,CAACC,MAAkBA,EAAMC,SAAAA;"}

package/dist/styles-C_8vOEep.js

@@ -1,167 +0,0 @@
-import "react/jsx-runtime";
-import "react/compiler-runtime";
-import "@mui/material";
-import "./widget-store-CzDt8oSK.js";
-import "@mui/icons-material";
-import "zustand/shallow";
-import "react";
-import "react-markdown";
-import { d as p, a as f } from "./exports-Cr43OCul.js";
-import "./lasso-tool-BYbxrJ-7.js";
-import "./cjs-D4KH3azB.js";
-import "@dnd-kit/core";
-import "@dnd-kit/sortable";
-import "@dnd-kit/utilities";
-function I(t) {
-  const e = [];
-  if (t.length > 0 && (t[0]?.length ?? 0) > 0) {
-    const o = t?.[0]?.[0] ?? {}, i = Object.keys(o);
-    e.push(i);
-  }
-  return t.forEach((o) => {
-    o.forEach((i) => {
-      const r = Object.values(i).map((n) => String(n));
-      e.push(r);
-    });
-  }), e;
-}
-function z(t) {
-  const e = [];
-  return e.push(["x", "y"]), t.forEach((o) => {
-    o.forEach((i) => {
-      e.push([String(i[0]), String(i[1])]);
-    });
-  }), e;
-}
-function O(t) {
-  if (t === 0) return 0;
-  const e = Math.abs(t), o = Math.pow(10, Math.floor(Math.log10(e))), i = Math.ceil(e / o) * o;
-  return t < 0 ? -i : i;
-}
-function V(t) {
-  return {
-    show: t,
-    icon: "circle",
-    left: 0,
-    bottom: 0,
-    orient: "horizontal",
-    type: "scroll"
-  };
-}
-function D(t, e) {
-  return {
-    ...!t && {
-      bottom: parseInt(e.spacing(3))
-    },
-    ...t && {
-      bottom: parseInt(e.spacing(7))
-    }
-  };
-}
-function E(t) {
-  return function(e, o, i, r, n) {
-    const c = {
-      top: parseInt(t.spacing(0.5))
-    };
-    return n.contentSize[0] < n.viewSize[0] - e[0] ? c.left = e[0] : c.right = n.viewSize[0] - e[0], c;
-  };
-}
-function m(t) {
-  if (t)
-    return (e) => t(e);
-}
-function k(t, e) {
-  let o = m(e);
-  const i = t && !Array.isArray(t), r = t;
-  return (!i || r.type !== "value") && (o = void 0), {
-    ...r,
-    axisLabel: {
-      ...typeof r.axisLabel == "object" && r.axisLabel ? r.axisLabel : {},
-      formatter: o
-    }
-  };
-}
-function _(t, e) {
-  let o = m(e);
-  const i = t && !Array.isArray(t), r = t;
-  return (!i || r.type !== "value") && (o = void 0), {
-    ...r,
-    axisLabel: {
-      ...typeof r.axisLabel == "object" && r.axisLabel ? r.axisLabel : {},
-      formatter: o
-    }
-  };
-}
-function G(t) {
-  return (e) => {
-    const o = Array.isArray(e) ? e : [e], i = (a, s) => `<div style="margin: 0px 0 0;line-height:1;">${a ? `<div style="font-size:11px;color:#FFFFFF;font-weight:400;line-height:1; margin-bottom: 10px">${a}</div>` : ""}<div style="margin: 0;line-height:1;">${s}</div><div style="clear:both"></div></div>`, r = o.map((a) => {
-      const {
-        name: s,
-        seriesName: l,
-        marker: g,
-        value: d
-      } = t(a, o);
-      return {
-        name: s,
-        seriesName: l,
-        marker: g,
-        value: d
-      };
-    }), n = r[0]?.name ?? "", u = n || o.length > 1 ? "margin: 10px 0 0;line-height:1;" : "margin: 0;line-height:1;", h = r.map(({
-      seriesName: a,
-      marker: s,
-      value: l
-    }) => `<div style="${u}"><div style="margin: 0px 0 0;line-height:1;">${s}${a ? `<span style="font-size:11px;color:#FFFFFF;font-weight:400;margin-left:2px;margin-right:10px">${a}</span>` : ""}<span style="float:right;margin-left:10px;font-size:11px;color:#FFFFFF;font-weight:900">${l}</span></div></div>`);
-    return i(n, h.join(""));
-  };
-}
-function N(t) {
-  return function({
-    refUI: e
-  }) {
-    return [{
-      ...p,
-      modifier: () => p.modifier(e)
-    }, {
-      ...f,
-      modifier: async (o) => {
-        const i = t(o);
-        return f.modifier(i);
-      }
-    }];
-  };
-}
-const P = {
-  graph: {
-    /**
-     * Common container style for chart widget skeletons
-     */
-    container: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "space-between",
-      flexDirection: "column",
-      gap: ({
-        spacing: t
-      }) => t(1),
-      height: ({
-        spacing: t
-      }) => t(38)
-    }
-  }
-};
-export {
-  k as a,
-  _ as b,
-  P as c,
-  D as d,
-  V as e,
-  m as f,
-  N as g,
-  G as h,
-  E as i,
-  I as j,
-  O as n,
-  z as s
-};
-//# sourceMappingURL=styles-C_8vOEep.js.map

package/dist/styles-C_8vOEep.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles-C_8vOEep.js","sources":["../src/widgets/utils/chart-config/csv-modifiers.ts","../src/widgets/utils/chart-config/option-builders.ts","../src/widgets/utils/chart-config/download-config.ts","../src/widgets/utils/skeleton/styles.ts"],"sourcesContent":["/**\n * Shared CSV export modifiers for chart widgets\n */\n\n/**\n * Flattens object array data into CSV-ready rows.\n * Used by bar, pie, histogram, and timeseries widgets.\n *\n * @param data - Array of series, where each series is an array of data objects\n * @returns CSV rows with headers and values\n */\nexport function flattenObjectArrayToCSV<T extends Record<string, unknown>>(\n  data: T[][],\n): string[][] {\n  const rows: string[][] = []\n\n  // Add headers from first data point if available\n  if (data.length > 0 && (data[0]?.length ?? 0) > 0) {\n    const firstDataPoint = data?.[0]?.[0] ?? {}\n    const headers = Object.keys(firstDataPoint)\n    rows.push(headers)\n  }\n\n  // Add data rows from all series\n  data.forEach((series) => {\n    series.forEach((dataPoint) => {\n      const values = Object.values(dataPoint).map((v) => String(v))\n      rows.push(values)\n    })\n  })\n\n  return rows\n}\n\n/**\n * Creates CSV rows for scatterplot data.\n * Scatterplot uses array format [x, y] instead of objects.\n *\n * @param data - Array of series, where each series is an array of [x, y] tuples\n * @returns CSV rows with ['x', 'y'] headers\n */\nexport function scatterplotDataToCSV(data: number[][][]): string[][] {\n  const rows: string[][] = []\n\n  // Add headers\n  rows.push(['x', 'y'])\n\n  // Add data rows from all series\n  data.forEach((series) => {\n    series.forEach((dataPoint) => {\n      rows.push([String(dataPoint[0]), String(dataPoint[1])])\n    })\n  })\n\n  return rows\n}\n","import type { Theme } from '@mui/material'\nimport type { LegendComponentOption } from 'echarts'\nimport type {\n  CallbackDataParams,\n  TopLevelFormatterParams,\n} from 'echarts/types/dist/shared'\n\n/**\n * Shared EChart configuration builders for chart widgets\n */\n\n/**\n * Rounds a value up to the nearest \"nice\" number.\n * A nice number is a multiple of 10^floor(log10(value)).\n *\n * Examples: 547 → 600, 200 → 200, 1200 → 2000, 18 → 20, 5 → 5, -547 → -500\n */\nexport function niceNum(value: number): number {\n  if (value === 0) return 0\n  const absValue = Math.abs(value)\n  const base = Math.pow(10, Math.floor(Math.log10(absValue)))\n  const rounded = Math.ceil(absValue / base) * base\n  return value < 0 ? -rounded : rounded\n}\n\n/**\n * Builds standard legend configuration for chart widgets\n *\n * @param hasLegend - Whether to show the legend\n * @returns Legend configuration object\n */\nexport function buildLegendConfig(hasLegend: boolean): LegendComponentOption {\n  return {\n    show: hasLegend,\n    icon: 'circle' as const,\n    left: 0,\n    bottom: 0,\n    orient: 'horizontal',\n    type: 'scroll',\n  }\n}\n\n/**\n * Builds standard grid configuration with legend-aware spacing\n *\n * @param hasLegend - Whether the chart has a legend\n * @param theme - MUI theme for spacing\n * @param additionalConfig - Additional grid configuration to merge\n * @returns Grid configuration object\n */\nexport function buildGridConfig(hasLegend: boolean, theme: Theme) {\n  return {\n    ...(!hasLegend && { bottom: parseInt(theme.spacing(3)) }),\n    ...(hasLegend && { bottom: parseInt(theme.spacing(7)) }),\n  }\n}\n\n/**\n * Creates a tooltip position calculator that handles overflow\n * Used by bar, histogram, and scatterplot widgets\n *\n * @param theme - MUI theme for spacing\n * @returns Tooltip position function\n */\nexport function createTooltipPositioner(theme: Theme) {\n  return function (\n    point: [number, number],\n    _params: unknown,\n    _dom: unknown,\n    _rect: unknown,\n    size: { contentSize: [number, number]; viewSize: [number, number] },\n  ) {\n    const position = { top: parseInt(theme.spacing(0.5)) } as Record<\n      string,\n      number\n    >\n\n    // Position tooltip left or right based on available space\n    if (size.contentSize[0] < size.viewSize[0] - point[0]) {\n      position.left = point[0]\n    } else {\n      position.right = size.viewSize[0] - point[0]\n    }\n\n    return position\n  }\n}\n\n/**\n * Creates an axis label formatter for ECharts\n * Used to format numeric axis labels with a widget formatter\n *\n * @param formatter - Optional formatter function from widget config\n * @returns Axis label formatter function or undefined\n */\nexport function createAxisLabelFormatter(\n  formatter?: (value: number) => string,\n) {\n  if (!formatter) return undefined\n  return (value: number) => formatter(value)\n}\n\n/**\n * Applies formatter to xAxis configuration\n * Only applies to single axis objects (not arrays) with type 'value'\n *\n * @param xAxis - Existing xAxis configuration\n * @param formatter - Optional formatter function from widget config\n * @returns Updated xAxis configuration or undefined if no changes needed\n */\nexport function applyXAxisFormatter(\n  xAxis: unknown,\n  formatter?: (value: number) => string,\n) {\n  let axisFormatter = createAxisLabelFormatter(formatter)\n\n  const xAxisIsObject = xAxis && !Array.isArray(xAxis)\n  const xAxisTyped = xAxis as { type?: string; axisLabel?: unknown }\n\n  if (!xAxisIsObject || xAxisTyped.type !== 'value') {\n    axisFormatter = undefined\n  }\n\n  return {\n    ...xAxisTyped,\n    axisLabel: {\n      ...(typeof xAxisTyped.axisLabel === 'object' && xAxisTyped.axisLabel\n        ? xAxisTyped.axisLabel\n        : {}),\n      formatter: axisFormatter,\n    },\n  }\n}\n\n/**\n * Applies formatter to yAxis configuration\n * Only applies to single axis objects (not arrays) with type 'value'\n *\n * @param yAxis - Existing yAxis configuration\n * @param formatter - Optional formatter function from widget config\n * @returns Updated yAxis configuration or undefined if no changes needed\n */\nexport function applyYAxisFormatter(\n  yAxis: unknown,\n  formatter?: (value: number) => string,\n) {\n  let axisFormatter = createAxisLabelFormatter(formatter)\n\n  const yAxisIsObject = yAxis && !Array.isArray(yAxis)\n  const yAxisTyped = yAxis as { type?: string; axisLabel?: unknown }\n\n  if (!yAxisIsObject || yAxisTyped.type !== 'value') {\n    axisFormatter = undefined\n  }\n\n  return {\n    ...yAxisTyped,\n    axisLabel: {\n      ...(typeof yAxisTyped.axisLabel === 'object' && yAxisTyped.axisLabel\n        ? yAxisTyped.axisLabel\n        : {}),\n      formatter: axisFormatter,\n    },\n  }\n}\n\n/**\n * Creates a tooltip formatter for ECharts\n * Formats numeric values in tooltip using widget formatter\n * Handles both axis trigger (array) and item trigger (object) modes\n *\n * @param formatter - Optional formatter function from widget config\n * @returns Tooltip formatter function or undefined\n */\nexport function createTooltipFormatter(\n  callback: (\n    item: CallbackDataParams,\n    items: CallbackDataParams[],\n  ) => {\n    name: string\n    seriesName: string\n    marker: string\n    value: string | number\n  },\n) {\n  return (params: TopLevelFormatterParams) => {\n    // Handle both array (axis trigger) and object (item trigger)\n    const items = Array.isArray(params) ? params : [params]\n\n    const tooltip = (name: string, callback: string) =>\n      `<div style=\"margin: 0px 0 0;line-height:1;\">${name ? `<div style=\"font-size:11px;color:#FFFFFF;font-weight:400;line-height:1; margin-bottom: 10px\">${name}</div>` : ''}<div style=\"margin: 0;line-height:1;\">${callback}</div><div style=\"clear:both\"></div></div>`\n\n    const values = items.map((item) => {\n      const { name, seriesName, marker, value } = callback(item, items)\n      return {\n        name,\n        seriesName,\n        marker,\n        value,\n      }\n    })\n\n    const name = values[0]?.name ?? ''\n    // Show margin if name exists or there are multiple items\n    const showMargin = name || items.length > 1\n    const marginStyle = showMargin\n      ? 'margin: 10px 0 0;line-height:1;'\n      : 'margin: 0;line-height:1;'\n\n    const formattedValues = values.map(\n      ({ seriesName, marker, value }) =>\n        `<div style=\"${marginStyle}\"><div style=\"margin: 0px 0 0;line-height:1;\">${marker}${seriesName ? `<span style=\"font-size:11px;color:#FFFFFF;font-weight:400;margin-left:2px;margin-right:10px\">${seriesName}</span>` : ''}<span style=\"float:right;margin-left:10px;font-size:11px;color:#FFFFFF;font-weight:900\">${value}</span></div></div>`,\n    )\n\n    return tooltip(name, formattedValues.join(''))\n  }\n}\n","import { downloadToCSV, downloadToPNG, type DownloadItem } from '../../actions'\nimport type { ConfigProps } from '../../loader/types'\n\nexport function createChartDownloadConfig<TData>(\n  csvModifier: (data: TData) => string[][],\n) {\n  return function ({ refUI }: ConfigProps): DownloadItem<TData>[] {\n    return [\n      {\n        ...downloadToPNG,\n        modifier: () => downloadToPNG.modifier(refUI),\n      },\n      {\n        ...downloadToCSV,\n        modifier: async (data) => {\n          const rows = csvModifier(data)\n          return downloadToCSV.modifier(rows)\n        },\n      },\n    ]\n  }\n}\n","import type { Theme } from '@mui/material'\n\n/**\n * Base skeleton styles shared across all chart widgets\n */\nexport const baseSkeletonStyles = {\n  graph: {\n    /**\n     * Common container style for chart widget skeletons\n     */\n    container: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      flexDirection: 'column',\n      gap: ({ spacing }: Theme) => spacing(1),\n      height: ({ spacing }: Theme) => spacing(38),\n    },\n  },\n} as const\n"],"names":["flattenObjectArrayToCSV","data","rows","length","firstDataPoint","headers","Object","keys","push","forEach","series","dataPoint","values","map","v","String","scatterplotDataToCSV","niceNum","value","absValue","Math","abs","base","pow","floor","log10","rounded","ceil","buildLegendConfig","hasLegend","show","icon","left","bottom","orient","type","buildGridConfig","theme","parseInt","spacing","createTooltipPositioner","point","_params","_dom","_rect","size","position","top","contentSize","viewSize","right","createAxisLabelFormatter","formatter","applyXAxisFormatter","xAxis","axisFormatter","xAxisIsObject","Array","isArray","xAxisTyped","undefined","axisLabel","applyYAxisFormatter","yAxis","yAxisIsObject","yAxisTyped","createTooltipFormatter","callback","params","items","tooltip","name","item","seriesName","marker","marginStyle","formattedValues","join","createChartDownloadConfig","csvModifier","refUI","downloadToPNG","modifier","downloadToCSV","baseSkeletonStyles","graph","container","display","alignItems","justifyContent","flexDirection","gap","height"],"mappings":"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"}