@12-apps/ui 6.10.1 → 6.11.1

package/dist/chunk-MXVO2KXV.js

@@ -1,899 +0,0 @@
-import {
-  accentFor,
-  muiColor
-} from "./chunk-OZCEKQIX.js";
-
-// src/components/data-display/Chart/Chart.tsx
-import { Box as Box2, CircularProgress, Paper as Paper2, Typography as Typography2, useTheme as useTheme2 } from "@mui/material";
-
-// src/components/data-display/Chart/ChartComposables.tsx
-import { Box, Paper, Typography, useTheme } from "@mui/material";
-import { Legend, ResponsiveContainer, Tooltip } from "recharts";
-import { jsx, jsxs } from "react/jsx-runtime";
-var ChartTooltip = Tooltip;
-var ChartLegend = Legend;
-var ChartContainer = ({
-  height,
-  width = "100%",
-  responsive = true,
-  children,
-  "data-testid": dataTestId
-}) => {
-  if (!responsive) {
-    return /* @__PURE__ */ jsx(Box, { sx: { width, height }, "data-testid": dataTestId, children });
-  }
-  return /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, "data-testid": dataTestId, children });
-};
-var ChartTooltipContent = ({
-  active,
-  label,
-  payload,
-  valueFormatter
-}) => {
-  const theme = useTheme();
-  if (!active || !payload || payload.length === 0) return null;
-  const formatValue = (value) => {
-    if (typeof value === "number" && valueFormatter) return valueFormatter(value);
-    return value ?? "";
-  };
-  return /* @__PURE__ */ jsxs(Paper, { elevation: 4, sx: { px: 1.5, py: 1, border: `1px solid ${theme.palette.divider}` }, children: [
-    label !== void 0 && label !== "" && /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 0.5 }, children: label }),
-    payload.map((entry, index) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-      /* @__PURE__ */ jsx(
-        Box,
-        {
-          component: "span",
-          sx: { width: 10, height: 10, borderRadius: "2px", backgroundColor: entry.color, flexShrink: 0 }
-        }
-      ),
-      /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { color: "text.secondary" }, children: entry.name }),
-      /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { ml: "auto", fontWeight: 600 }, children: formatValue(entry.value) })
-    ] }, index))
-  ] });
-};
-var ChartLegendContent = ({ payload }) => {
-  if (!payload || payload.length === 0) return null;
-  return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", flexWrap: "wrap", justifyContent: "center", gap: 2, pt: 1 }, children: payload.map((entry, index) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-    /* @__PURE__ */ jsx(
-      Box,
-      {
-        component: "span",
-        sx: { width: 10, height: 10, borderRadius: "2px", backgroundColor: entry.color, flexShrink: 0 }
-      }
-    ),
-    /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { color: "text.secondary" }, children: entry.value })
-  ] }, index)) });
-};
-
-// src/components/data-display/Chart/chart-internals.ts
-import { alpha } from "@mui/material";
-var SIZE_PRESETS = {
-  xs: { height: 200, fontSize: "0.75rem", tickMargin: 10 },
-  sm: { height: 300, fontSize: "0.875rem", tickMargin: 12 },
-  md: { height: 400, fontSize: "1rem", tickMargin: 14 },
-  lg: { height: 500, fontSize: "1.125rem", tickMargin: 16 },
-  xl: { height: 600, fontSize: "1.25rem", tickMargin: 18 }
-};
-function getSizeStyles(size, height) {
-  const preset = SIZE_PRESETS[size ?? "md"] ?? SIZE_PRESETS.md;
-  return { ...preset, height: height ?? preset.height };
-}
-var NEON_PALETTE = ["#00ffff", "#ff00ff", "#ffff00", "#00ff00", "#ff0080", "#8000ff"];
-function getDefaultColors(theme, variant, colors) {
-  if (colors) return colors;
-  if (variant === "neon") return NEON_PALETTE;
-  return [
-    theme.palette.primary.main,
-    theme.palette.secondary.main,
-    theme.palette.success.main,
-    theme.palette.warning.main,
-    theme.palette.error.main,
-    theme.palette.info.main
-  ];
-}
-function effectStyles(theme, options) {
-  const accent = accentFor(theme, options.color).main;
-  const glow = options.glow ? { boxShadow: `0 0 30px ${alpha(accent, 0.4)}` } : {};
-  const pulse = options.pulse ? {
-    animation: "pulse 2s infinite",
-    "@keyframes pulse": {
-      "0%": { boxShadow: `0 0 0 0 ${alpha(accent, 0.4)}` },
-      "70%": { boxShadow: `0 0 0 20px ${alpha(accent, 0)}` },
-      "100%": { boxShadow: `0 0 0 0 ${alpha(accent, 0)}` }
-    }
-  } : {};
-  return { ...glow, ...pulse };
-}
-function variantSurface(theme, options) {
-  switch (options.variant) {
-    case "glass":
-      return {
-        backgroundColor: alpha(theme.palette.background.paper, options.glass ? 0.1 : 0.9),
-        backdropFilter: "blur(20px)",
-        border: `1px solid ${alpha(theme.palette.divider, 0.1)}`
-      };
-    case "gradient":
-      return {
-        background: options.gradient ? `linear-gradient(135deg, ${alpha(accentFor(theme, options.color).light, 0.05)}, ${alpha(accentFor(theme, options.color).dark, 0.05)})` : theme.palette.background.paper
-      };
-    case "elevated":
-      return { boxShadow: theme.shadows[4] };
-    case "minimal":
-      return { border: "none", backgroundColor: "transparent" };
-    case "neon":
-      return {
-        backgroundColor: "#000",
-        border: `1px solid ${alpha("#00ffff", 0.3)}`,
-        "& .recharts-cartesian-grid-horizontal line, & .recharts-cartesian-grid-vertical line": {
-          stroke: alpha("#00ffff", 0.1)
-        }
-      };
-    default:
-      return { backgroundColor: theme.palette.background.paper };
-  }
-}
-function getVariantStyles(theme, options) {
-  return {
-    borderRadius: theme.spacing(1),
-    transition: theme.transitions.create(["all"], {
-      duration: theme.transitions.duration.standard
-    }),
-    opacity: options.disabled ? 0.5 : 1,
-    pointerEvents: options.disabled ? "none" : "auto",
-    ...effectStyles(theme, options),
-    ...variantSurface(theme, options)
-  };
-}
-function resolveSeries(data, series, xAxisKey, palette) {
-  if (series) return series;
-  if (data.length === 0) return [];
-  return Object.keys(data[0] ?? {}).filter((key) => key !== xAxisKey).map((key, index) => ({
-    dataKey: key,
-    name: key,
-    color: palette[index % palette.length]
-  }));
-}
-function getAxisStyles(theme, variant, fontSize) {
-  const neon = variant === "neon";
-  return {
-    axisStyle: {
-      fontSize,
-      fill: neon ? "#00ffff" : theme.palette.text.secondary,
-      // Ticks are columns of digits: they have to line up between rows.
-      fontVariantNumeric: "tabular-nums"
-    },
-    gridStroke: neon ? alpha("#00ffff", 0.1) : theme.palette.divider,
-    // The neon grid is already a 10%-alpha cyan; halving it again would erase it.
-    gridOpacity: neon ? 1 : 0.5
-  };
-}
-
-// src/components/data-display/Chart/chart-renderers.tsx
-import {
-  Area,
-  AreaChart,
-  Bar,
-  BarChart,
-  CartesianGrid,
-  Cell,
-  ComposedChart,
-  Legend as Legend2,
-  Line,
-  LineChart,
-  Pie,
-  PieChart,
-  PolarAngleAxis,
-  PolarGrid,
-  PolarRadiusAxis,
-  Radar,
-  RadarChart,
-  Scatter,
-  ScatterChart,
-  Tooltip as Tooltip2,
-  XAxis,
-  YAxis
-} from "recharts";
-
-// src/components/data-display/Chart/chart-axis.ts
-var DEFAULT_MAX_CATEGORY_TICKS = 8;
-var DEFAULT_TICK_LABEL_MAX_CHARS = 12;
-var DEFAULT_BAR_RADIUS = 3;
-var DEFAULT_MAX_BAR_WIDTH = 38;
-function selectCategoryTicks(values, maxTicks) {
-  if (maxTicks < 1 || values.length <= maxTicks) return void 0;
-  if (new Set(values).size !== values.length) return void 0;
-  const step = Math.ceil(values.length / maxTicks);
-  const kept = [];
-  for (let index = values.length - 1; index >= 0; index -= step) {
-    const value = values[index];
-    if (value !== void 0) kept.push(value);
-  }
-  return kept.reverse();
-}
-function categoryValues(data, xAxisKey) {
-  const values = [];
-  for (const row of data) {
-    const value = row[xAxisKey];
-    if (value !== null && value !== void 0) values.push(value);
-  }
-  return values;
-}
-function truncateTickLabel(value, maxChars) {
-  const text = value === null || value === void 0 ? "" : String(value);
-  if (maxChars < 1 || text.length <= maxChars) return text;
-  return `${text.slice(0, maxChars - 1)}\u2026`;
-}
-function resolveAxisConfig(props, tickMargin) {
-  const maxChars = props.tickLabelMaxChars ?? DEFAULT_TICK_LABEL_MAX_CHARS;
-  return {
-    tickMargin,
-    categoryTicks: selectCategoryTicks(
-      categoryValues(props.data, props.xAxisKey ?? "name"),
-      props.maxCategoryTicks ?? DEFAULT_MAX_CATEGORY_TICKS
-    ),
-    tickFormatter: (value) => truncateTickLabel(value, maxChars)
-  };
-}
-function resolveBarGeometry(props) {
-  const radius = props.barRadius ?? DEFAULT_BAR_RADIUS;
-  return {
-    // A stacked segment rounded on its top corners tears a notch out of the
-    // segment above it, so stacks stay square.
-    radius: props.stacked ? 0 : [radius, radius, 0, 0],
-    maxBarSize: props.maxBarWidth ?? DEFAULT_MAX_BAR_WIDTH
-  };
-}
-
-// src/components/data-display/Chart/chart-context.ts
-function buildChartContext(props, theme) {
-  const sizeStyles = getSizeStyles(props.size, props.height);
-  const chartColors = getDefaultColors(theme, props.variant ?? "default", props.colors);
-  const { axisStyle, gridStroke, gridOpacity } = getAxisStyles(
-    theme,
-    props.variant ?? "default",
-    sizeStyles.fontSize
-  );
-  const handleChartClick = (payload) => {
-    const chartData = payload;
-    if (props.onClick && chartData?.activePayload?.[0]) {
-      props.onClick(chartData.activePayload[0].payload);
-    }
-  };
-  return {
-    props,
-    theme,
-    sizeStyles,
-    chartColors,
-    chartSeries: resolveSeries(props.data, props.series, props.xAxisKey ?? "name", chartColors),
-    strokeType: props.curved ?? true ? "monotone" : "linear",
-    axisStyle: { ...axisStyle, fontSize: sizeStyles.fontSize },
-    gridStroke,
-    gridOpacity,
-    axisConfig: resolveAxisConfig(props, sizeStyles.tickMargin),
-    barGeometry: resolveBarGeometry(props),
-    animationDuration: props.animate ?? true ? props.animationDuration ?? 1500 : 0,
-    commonProps: {
-      data: props.data,
-      margin: { top: 20, right: 30, left: 20, bottom: 20, ...props.margin },
-      onClick: handleChartClick
-    }
-  };
-}
-
-// src/components/data-display/Chart/chart-renderers.tsx
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function chartExtras(ctx) {
-  const { props } = ctx;
-  const nodes = [];
-  if (props.showTooltip !== false) {
-    nodes.push(
-      /* @__PURE__ */ jsx2(Tooltip2, { content: /* @__PURE__ */ jsx2(ChartTooltipContent, { valueFormatter: props.valueFormatter }) }, "tooltip")
-    );
-  }
-  if (props.showLegend !== false) {
-    nodes.push(/* @__PURE__ */ jsx2(Legend2, { content: /* @__PURE__ */ jsx2(ChartLegendContent, {}) }, "legend"));
-  }
-  return nodes;
-}
-function chartGrid(ctx) {
-  return /* @__PURE__ */ jsx2(CartesianGrid, { stroke: ctx.gridStroke, strokeOpacity: ctx.gridOpacity }, "grid");
-}
-function cartesianAxes(ctx) {
-  const { props, axisConfig } = ctx;
-  const nodes = [];
-  if (props.showCartesianGrid !== false) nodes.push(chartGrid(ctx));
-  nodes.push(
-    /* @__PURE__ */ jsx2(
-      XAxis,
-      {
-        dataKey: props.xAxisKey ?? "name",
-        style: ctx.axisStyle,
-        label: props.xAxisLabel,
-        tickMargin: axisConfig.tickMargin,
-        ticks: axisConfig.categoryTicks,
-        tickFormatter: axisConfig.tickFormatter
-      },
-      "x"
-    ),
-    /* @__PURE__ */ jsx2(
-      YAxis,
-      {
-        style: ctx.axisStyle,
-        label: props.yAxisLabel,
-        width: "auto",
-        tickMargin: axisConfig.tickMargin,
-        tickFormatter: props.valueFormatter,
-        allowDecimals: props.allowDecimalTicks !== false
-      },
-      "y"
-    )
-  );
-  return nodes;
-}
-function renderLine(ctx) {
-  return /* @__PURE__ */ jsxs2(LineChart, { ...ctx.commonProps, children: [
-    cartesianAxes(ctx),
-    chartExtras(ctx),
-    ctx.chartSeries.map((s, index) => /* @__PURE__ */ jsx2(
-      Line,
-      {
-        type: ctx.strokeType,
-        dataKey: s.dataKey,
-        name: s.name,
-        stroke: s.color ?? ctx.chartColors[index % ctx.chartColors.length],
-        strokeWidth: s.strokeWidth ?? 2,
-        dot: s.dot !== false,
-        activeDot: s.activeDot !== false ? { r: 8 } : false,
-        animationDuration: ctx.animationDuration
-      },
-      s.dataKey
-    ))
-  ] });
-}
-function renderBar(ctx) {
-  return /* @__PURE__ */ jsxs2(BarChart, { ...ctx.commonProps, children: [
-    cartesianAxes(ctx),
-    chartExtras(ctx),
-    ctx.chartSeries.map((s, index) => /* @__PURE__ */ jsx2(
-      Bar,
-      {
-        dataKey: s.dataKey,
-        name: s.name,
-        fill: s.fill ?? s.color ?? ctx.chartColors[index % ctx.chartColors.length],
-        stackId: ctx.props.stacked ? "stack" : void 0,
-        radius: ctx.barGeometry.radius,
-        maxBarSize: ctx.barGeometry.maxBarSize,
-        animationDuration: ctx.animationDuration
-      },
-      s.dataKey
-    ))
-  ] });
-}
-function renderArea(ctx) {
-  return /* @__PURE__ */ jsxs2(AreaChart, { ...ctx.commonProps, children: [
-    cartesianAxes(ctx),
-    chartExtras(ctx),
-    ctx.chartSeries.map((s, index) => /* @__PURE__ */ jsx2(
-      Area,
-      {
-        type: ctx.strokeType,
-        dataKey: s.dataKey,
-        name: s.name,
-        stroke: s.color ?? ctx.chartColors[index % ctx.chartColors.length],
-        fill: s.fill ?? s.color ?? ctx.chartColors[index % ctx.chartColors.length],
-        fillOpacity: s.fillOpacity ?? 0.6,
-        stackId: ctx.props.stacked ? "stack" : void 0,
-        animationDuration: ctx.animationDuration
-      },
-      s.dataKey
-    ))
-  ] });
-}
-function pieCenterLabel(ctx) {
-  const { centerLabel } = ctx.props;
-  const innerRadius = ctx.props.innerRadius ?? 0;
-  if (!centerLabel || innerRadius <= 0) return null;
-  const fill = ctx.props.variant === "neon" ? "#00ffff" : ctx.theme.palette.text.primary;
-  return /* @__PURE__ */ jsx2(
-    "text",
-    {
-      x: "50%",
-      y: "50%",
-      textAnchor: "middle",
-      dominantBaseline: "middle",
-      style: { fontSize: ctx.sizeStyles.fontSize, fill, fontWeight: 600 },
-      children: typeof centerLabel === "string" ? centerLabel : /* @__PURE__ */ jsxs2(Fragment, { children: [
-        /* @__PURE__ */ jsx2(
-          "tspan",
-          {
-            x: "50%",
-            dy: "-0.6em",
-            style: { fontSize: "0.875em", fontWeight: 500, fill: ctx.theme.palette.text.secondary },
-            children: centerLabel.label
-          }
-        ),
-        /* @__PURE__ */ jsx2("tspan", { x: "50%", dy: "1.4em", style: { fontSize: "1.5em", fontWeight: 700 }, children: centerLabel.value })
-      ] })
-    }
-  );
-}
-function renderPie(ctx) {
-  const { props } = ctx;
-  return /* @__PURE__ */ jsxs2(PieChart, { children: [
-    chartExtras(ctx),
-    /* @__PURE__ */ jsx2(
-      Pie,
-      {
-        data: props.data,
-        dataKey: ctx.chartSeries[0]?.dataKey ?? "value",
-        nameKey: props.xAxisKey ?? "name",
-        cx: "50%",
-        cy: "50%",
-        outerRadius: ctx.sizeStyles.height / 3,
-        innerRadius: props.innerRadius ?? 0,
-        fill: ctx.chartColors[0],
-        label: props.showValues ?? false,
-        animationDuration: ctx.animationDuration,
-        children: props.data.map((entry, index) => /* @__PURE__ */ jsx2(Cell, { fill: ctx.chartColors[index % ctx.chartColors.length] }, `cell-${index}`))
-      }
-    ),
-    pieCenterLabel(ctx)
-  ] });
-}
-function renderRadar(ctx) {
-  return /* @__PURE__ */ jsxs2(RadarChart, { ...ctx.commonProps, children: [
-    /* @__PURE__ */ jsx2(PolarGrid, { stroke: ctx.gridStroke }),
-    /* @__PURE__ */ jsx2(PolarAngleAxis, { dataKey: ctx.props.xAxisKey ?? "name", style: ctx.axisStyle }),
-    /* @__PURE__ */ jsx2(PolarRadiusAxis, { style: ctx.axisStyle }),
-    chartExtras(ctx),
-    ctx.chartSeries.map((s, index) => /* @__PURE__ */ jsx2(
-      Radar,
-      {
-        dataKey: s.dataKey,
-        name: s.name,
-        stroke: s.color ?? ctx.chartColors[index % ctx.chartColors.length],
-        fill: s.fill ?? s.color ?? ctx.chartColors[index % ctx.chartColors.length],
-        fillOpacity: s.fillOpacity ?? 0.6,
-        animationDuration: ctx.animationDuration
-      },
-      s.dataKey
-    ))
-  ] });
-}
-function renderScatter(ctx) {
-  const { props } = ctx;
-  return /* @__PURE__ */ jsxs2(ScatterChart, { ...ctx.commonProps, children: [
-    props.showCartesianGrid !== false && chartGrid(ctx),
-    /* @__PURE__ */ jsx2(
-      XAxis,
-      {
-        dataKey: props.xAxisKey ?? "name",
-        style: ctx.axisStyle,
-        label: props.xAxisLabel,
-        tickMargin: ctx.axisConfig.tickMargin
-      }
-    ),
-    /* @__PURE__ */ jsx2(
-      YAxis,
-      {
-        dataKey: ctx.chartSeries[0]?.dataKey,
-        style: ctx.axisStyle,
-        label: props.yAxisLabel,
-        tickMargin: ctx.axisConfig.tickMargin
-      }
-    ),
-    chartExtras(ctx),
-    /* @__PURE__ */ jsx2(
-      Scatter,
-      {
-        name: ctx.chartSeries[0]?.name ?? "Data",
-        data: props.data,
-        fill: ctx.chartColors[0],
-        animationDuration: ctx.animationDuration
-      }
-    )
-  ] });
-}
-function composedSeries(ctx, s, index) {
-  const color = s.color ?? ctx.chartColors[index % ctx.chartColors.length];
-  if (s.type === "bar") {
-    return /* @__PURE__ */ jsx2(
-      Bar,
-      {
-        dataKey: s.dataKey,
-        name: s.name,
-        fill: color,
-        radius: ctx.barGeometry.radius,
-        maxBarSize: ctx.barGeometry.maxBarSize,
-        animationDuration: ctx.animationDuration
-      },
-      s.dataKey
-    );
-  }
-  if (s.type === "area") {
-    return /* @__PURE__ */ jsx2(
-      Area,
-      {
-        type: ctx.strokeType,
-        dataKey: s.dataKey,
-        name: s.name,
-        stroke: color,
-        fill: color,
-        fillOpacity: 0.6,
-        animationDuration: ctx.animationDuration
-      },
-      s.dataKey
-    );
-  }
-  return /* @__PURE__ */ jsx2(
-    Line,
-    {
-      type: ctx.strokeType,
-      dataKey: s.dataKey,
-      name: s.name,
-      stroke: color,
-      animationDuration: ctx.animationDuration
-    },
-    s.dataKey
-  );
-}
-function renderComposed(ctx) {
-  return /* @__PURE__ */ jsxs2(ComposedChart, { ...ctx.commonProps, children: [
-    cartesianAxes(ctx),
-    chartExtras(ctx),
-    ctx.chartSeries.map((s, index) => composedSeries(ctx, s, index))
-  ] });
-}
-var RENDERERS = {
-  line: renderLine,
-  bar: renderBar,
-  area: renderArea,
-  pie: renderPie,
-  radar: renderRadar,
-  scatter: renderScatter,
-  composed: renderComposed
-};
-function renderChartByType(props, theme) {
-  const renderer = RENDERERS[props.type ?? "line"];
-  const ctx = buildChartContext(props, theme);
-  return renderer ? renderer(ctx) : /* @__PURE__ */ jsx2(Fragment, {});
-}
-
-// src/components/data-display/Chart/Chart.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function variantSx(theme, props) {
-  return getVariantStyles(theme, {
-    variant: props.variant ?? "default",
-    color: props.color ?? "primary",
-    glow: props.glow ?? false,
-    pulse: props.pulse ?? false,
-    glass: props.glass ?? false,
-    gradient: props.gradient ?? false,
-    disabled: props.disabled ?? false
-  });
-}
-function ChartHeader({ title, subtitle, neon, dataTestId }) {
-  if (!title && !subtitle) return null;
-  return /* @__PURE__ */ jsxs3(Box2, { sx: { mb: 2 }, "data-testid": `${dataTestId}-header`, children: [
-    title && /* @__PURE__ */ jsx3(
-      Typography2,
-      {
-        variant: "h6",
-        "data-testid": `${dataTestId}-title`,
-        sx: { color: neon ? "#00ffff" : "text.primary", fontWeight: 600 },
-        children: title
-      }
-    ),
-    subtitle && /* @__PURE__ */ jsx3(
-      Typography2,
-      {
-        variant: "body2",
-        "data-testid": `${dataTestId}-subtitle`,
-        sx: { color: neon ? "rgba(0, 255, 255, 0.7)" : "text.secondary" },
-        children: subtitle
-      }
-    )
-  ] });
-}
-var Chart = (props) => {
-  const theme = useTheme2();
-  const sizeStyles = getSizeStyles(props.size, props.height);
-  const styles = variantSx(theme, props);
-  const dataTestId = props["data-testid"] ?? "chart";
-  if (props.loading) {
-    return /* @__PURE__ */ jsx3(
-      Paper2,
-      {
-        "data-testid": `${dataTestId}-loading`,
-        sx: { ...styles, ...sizeStyles, display: "flex", justifyContent: "center", alignItems: "center" },
-        children: /* @__PURE__ */ jsx3(CircularProgress, { color: muiColor(props.color ?? "primary", "inherit"), "data-testid": `${dataTestId}-loading-spinner` })
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs3(
-    Paper2,
-    {
-      "data-testid": dataTestId,
-      className: props.className,
-      sx: { p: 2, ...styles, ...props.style },
-      onFocus: props.onFocus,
-      onBlur: props.onBlur,
-      children: [
-        /* @__PURE__ */ jsx3(
-          ChartHeader,
-          {
-            title: props.title,
-            subtitle: props.subtitle,
-            neon: props.variant === "neon",
-            dataTestId
-          }
-        ),
-        /* @__PURE__ */ jsx3(
-          ChartContainer,
-          {
-            responsive: props.responsive ?? true,
-            width: props.width ?? "100%",
-            height: props.fillHeight === true ? "100%" : sizeStyles.height,
-            "data-testid": `${dataTestId}-container`,
-            children: renderChartByType(props, theme)
-          }
-        )
-      ]
-    }
-  );
-};
-
-// src/components/data-display/Chart/SpecChart.tsx
-import { useTheme as useTheme3 } from "@mui/material";
-import React from "react";
-
-// src/components/data-display/Chart/chart-format.ts
-var formatters = {
-  brl: new Intl.NumberFormat("pt-BR", { style: "currency", currency: "BRL" }),
-  percent: new Intl.NumberFormat("pt-BR", { style: "percent", maximumFractionDigits: 1 }),
-  compact: new Intl.NumberFormat("pt-BR", { notation: "compact", maximumFractionDigits: 1 }),
-  integer: new Intl.NumberFormat("pt-BR", { maximumFractionDigits: 0 }),
-  decimal: new Intl.NumberFormat("pt-BR", { maximumFractionDigits: 2 })
-};
-function formatChartValue(value, format = "decimal") {
-  if (!Number.isFinite(value)) return "";
-  if (format === "brl") return formatters.brl.format(value / 100);
-  return formatters[format].format(value);
-}
-function chartValueFormatter(format) {
-  return (value) => formatChartValue(value, format);
-}
-
-// src/components/data-display/Chart/chart-spec-registry.ts
-var registry = /* @__PURE__ */ new Map();
-function registerChartSpecRenderer(type, renderer) {
-  registry.set(type, renderer);
-}
-function getChartSpecRenderer(type) {
-  return registry.get(type);
-}
-function getRegisteredChartSpecTypes() {
-  return [...registry.keys()];
-}
-function toChartSeries(spec, ctx) {
-  return spec.series.map((series, index) => ({
-    dataKey: series.key,
-    name: series.label ?? series.key,
-    color: ctx.resolveColor(series.color, index)
-  }));
-}
-function cartesianRenderer(chartType) {
-  return (spec, ctx) => ({
-    type: chartType,
-    series: toChartSeries(spec, ctx),
-    stacked: spec.stacked ?? false,
-    curved: spec.curved ?? true
-  });
-}
-var pieRenderer = (spec, ctx) => ({
-  type: "pie",
-  series: toChartSeries(spec, ctx),
-  // Slice colors cycle the resolved scheme; the pie renderer reads them from
-  // the `colors` prop rather than per-series colors.
-  colors: spec.series.length ? Array.from({ length: 12 }, (_, index) => ctx.resolveColor(void 0, index)) : void 0
-});
-var donutRenderer = (spec, ctx) => ({
-  ...pieRenderer(spec, ctx),
-  // Proportional to the pie's outer radius (height / 3 in the Chart renderer).
-  innerRadius: Math.round((spec.height ?? 400) / 6),
-  centerLabel: spec.centerLabel
-});
-registerChartSpecRenderer("line", cartesianRenderer("line"));
-registerChartSpecRenderer("bar", cartesianRenderer("bar"));
-registerChartSpecRenderer("area", cartesianRenderer("area"));
-registerChartSpecRenderer("pie", pieRenderer);
-registerChartSpecRenderer("donut", donutRenderer);
-
-// src/components/data-display/Chart/chart-spec.ts
-var CHART_SEMANTIC_COLORS = [
-  "primary",
-  "secondary",
-  "success",
-  "warning",
-  "danger",
-  "info"
-];
-var NUMBER_FORMATS = ["brl", "percent", "compact", "integer", "decimal"];
-var ChartSpecError = class extends Error {
-  constructor(message) {
-    super(message);
-    this.name = "ChartSpecError";
-  }
-};
-function isRecord(value) {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-function assertColor(value, where) {
-  if (value === void 0) return;
-  if (!CHART_SEMANTIC_COLORS.includes(value)) {
-    throw new ChartSpecError(
-      `${where} must be a semantic color token (${CHART_SEMANTIC_COLORS.join(", ")}), got ${JSON.stringify(value)}. Raw color values are not allowed.`
-    );
-  }
-}
-function parseAxis(value) {
-  if (!isRecord(value) || typeof value.key !== "string" || value.key.length === 0) {
-    throw new ChartSpecError('"xAxis" must be an object with a non-empty string "key" naming the row property for the category axis.');
-  }
-  if (value.label !== void 0 && typeof value.label !== "string") {
-    throw new ChartSpecError('"xAxis.label" must be a string when provided.');
-  }
-  return { key: value.key, label: value.label };
-}
-function parseSeries(value) {
-  if (!Array.isArray(value) || value.length === 0) {
-    throw new ChartSpecError('"series" must be a non-empty array of { key, label?, color? } objects.');
-  }
-  return value.map((entry, index) => {
-    if (!isRecord(entry) || typeof entry.key !== "string" || entry.key.length === 0) {
-      throw new ChartSpecError(`"series[${index}]" must be an object with a non-empty string "key" naming the row property holding its values.`);
-    }
-    assertColor(entry.color, `"series[${index}].color"`);
-    if (entry.label !== void 0 && typeof entry.label !== "string") {
-      throw new ChartSpecError(`"series[${index}].label" must be a string when provided.`);
-    }
-    return { key: entry.key, label: entry.label, color: entry.color };
-  });
-}
-function assertFieldType(spec, field, expected) {
-  const value = spec[field];
-  if (value !== void 0 && typeof value !== expected) {
-    throw new ChartSpecError(`"${field}" must be a ${expected} when provided.`);
-  }
-}
-function parseColorScheme(value) {
-  if (value === void 0) return void 0;
-  if (!Array.isArray(value) || value.length === 0) {
-    throw new ChartSpecError('"colorScheme" must be a non-empty array of semantic color tokens when provided.');
-  }
-  value.forEach((token, index) => assertColor(token, `"colorScheme[${index}]"`));
-  return value;
-}
-function parseOptionalFields(spec) {
-  for (const field of ["title", "subtitle"]) assertFieldType(spec, field, "string");
-  for (const field of ["stacked", "legend", "tooltip", "curved"]) {
-    assertFieldType(spec, field, "boolean");
-  }
-  assertFieldType(spec, "height", "number");
-  if (spec.numberFormat !== void 0 && !NUMBER_FORMATS.includes(spec.numberFormat)) {
-    throw new ChartSpecError(
-      `"numberFormat" must be one of ${NUMBER_FORMATS.join(", ")}, got ${JSON.stringify(spec.numberFormat)}.`
-    );
-  }
-  return {
-    title: spec.title,
-    subtitle: spec.subtitle,
-    stacked: spec.stacked,
-    legend: spec.legend,
-    tooltip: spec.tooltip,
-    curved: spec.curved,
-    height: spec.height,
-    numberFormat: spec.numberFormat,
-    colorScheme: parseColorScheme(spec.colorScheme)
-  };
-}
-function parseChartSpec(input) {
-  if (!isRecord(input)) {
-    throw new ChartSpecError("A chart spec must be a JSON object.");
-  }
-  const type = input.type;
-  if (typeof type !== "string" || !getChartSpecRenderer(type)) {
-    throw new ChartSpecError(
-      `"type" must be one of the registered chart types (${getRegisteredChartSpecTypes().join(", ")}), got ${JSON.stringify(type)}.`
-    );
-  }
-  const yAxis = input.yAxis;
-  if (yAxis !== void 0 && (!isRecord(yAxis) || yAxis.label !== void 0 && typeof yAxis.label !== "string")) {
-    throw new ChartSpecError('"yAxis" must be an object with an optional string "label" when provided.');
-  }
-  const centerLabel = input.centerLabel;
-  return {
-    ...parseOptionalFields(input),
-    type,
-    xAxis: parseAxis(input.xAxis),
-    yAxis,
-    series: parseSeries(input.series),
-    centerLabel
-  };
-}
-function specToChartProps(spec, data, ctx) {
-  const renderer = getChartSpecRenderer(spec.type);
-  if (!renderer) {
-    throw new ChartSpecError(
-      `Unknown chart type "${spec.type}". Registered types: ${getRegisteredChartSpecTypes().join(", ")}.`
-    );
-  }
-  return {
-    data,
-    title: spec.title,
-    subtitle: spec.subtitle,
-    xAxisKey: spec.xAxis.key,
-    xAxisLabel: spec.xAxis.label,
-    yAxisLabel: spec.yAxis?.label,
-    showLegend: spec.legend ?? true,
-    showTooltip: spec.tooltip ?? true,
-    height: spec.height,
-    valueFormatter: chartValueFormatter(spec.numberFormat),
-    // An integer metric is a COUNT: half a row does not exist, so the axis must
-    // not offer half-steps it would then round into duplicates (FUT-755).
-    allowDecimalTicks: spec.numberFormat !== "integer",
-    ...renderer(spec, ctx)
-  };
-}
-
-// src/components/data-display/Chart/SpecChart.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
-var SpecChart = ({
-  spec,
-  data,
-  size,
-  fillHeight,
-  loading,
-  className,
-  onClick,
-  "data-testid": dataTestId = "spec-chart"
-}) => {
-  const theme = useTheme3();
-  const chartProps = React.useMemo(() => {
-    const scheme = spec.colorScheme && spec.colorScheme.length > 0 ? spec.colorScheme : CHART_SEMANTIC_COLORS;
-    const resolveColor = (token, index) => accentFor(theme, token ?? scheme[index % scheme.length] ?? "primary").main;
-    return specToChartProps(spec, data, { resolveColor });
-  }, [spec, data, theme]);
-  return /* @__PURE__ */ jsx4(
-    Chart,
-    {
-      ...chartProps,
-      size,
-      fillHeight,
-      loading,
-      className,
-      onClick,
-      "data-testid": dataTestId
-    }
-  );
-};
-
-export {
-  ChartTooltip,
-  ChartLegend,
-  ChartContainer,
-  ChartTooltipContent,
-  ChartLegendContent,
-  Chart,
-  formatChartValue,
-  chartValueFormatter,
-  registerChartSpecRenderer,
-  getChartSpecRenderer,
-  getRegisteredChartSpecTypes,
-  CHART_SEMANTIC_COLORS,
-  ChartSpecError,
-  parseChartSpec,
-  specToChartProps,
-  SpecChart
-};
-//# sourceMappingURL=chunk-MXVO2KXV.js.map