@aspprev/versi-ds 0.1.0

package/dist/chunk-6MXHE5MD.js

@@ -0,0 +1,769 @@
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-2NMEKWO5.js";
+
+// src/components/chart/LazyApexChart.tsx
+import { useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function LazyApexChart(props) {
+  const [ApexChart, setApexChart] = useState(null);
+  useEffect(() => {
+    let active = true;
+    import("react-apexcharts").then(({ default: component }) => {
+      if (active) setApexChart(() => component);
+    });
+    return () => {
+      active = false;
+    };
+  }, []);
+  if (!ApexChart) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "flex min-h-40 items-center justify-center text-sm text-content-muted",
+        role: "status",
+        "aria-label": "Carregando grafico",
+        children: "Carregando grafico..."
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(ApexChart, __spreadValues({}, props));
+}
+
+// src/utils/chart-theme.ts
+var SERIES_FALLBACKS = [
+  "#0f62c1",
+  "#16d39a",
+  "#feb019",
+  "#ff4560",
+  "#775dd0",
+  "#00b8d9",
+  "#ff8f00",
+  "#26a69a",
+  "#ec407a",
+  "#7cb342",
+  "#5c6bc0",
+  "#8d6e63"
+];
+var DONUT_SERIES_FALLBACKS = [
+  "#66d288",
+  "#3182f6",
+  "#ffc25c",
+  "#7c58e8",
+  "#ff6b6b",
+  ...SERIES_FALLBACKS.slice(5)
+];
+var MUTED_SERIES_FALLBACKS = [
+  "#c5cad0",
+  "#d9dde1",
+  "#eceef0",
+  "#aeb5bd"
+];
+var readColorToken = (token, fallback) => {
+  var _a;
+  if (typeof window === "undefined") return fallback;
+  const value = window.getComputedStyle((_a = document.body) != null ? _a : document.documentElement).getPropertyValue(token).trim();
+  return value ? `rgb(${value})` : fallback;
+};
+var getChartTheme = () => ({
+  series: SERIES_FALLBACKS.map(
+    (fallback, index) => readColorToken(`--chart-${index + 1}`, fallback)
+  ),
+  donutSeries: DONUT_SERIES_FALLBACKS.map(
+    (fallback, index) => readColorToken(`--chart-donut-${index + 1}`, fallback)
+  ),
+  mutedSeries: MUTED_SERIES_FALLBACKS.map(
+    (fallback, index) => readColorToken(`--chart-muted-${index + 1}`, fallback)
+  ),
+  balance: readColorToken("--chart-balance", "#00a76f"),
+  invested: readColorToken("--chart-invested", "#1e90ff"),
+  grid: readColorToken("--chart-grid", "#e5e7eb"),
+  axis: readColorToken("--chart-axis", "#6b7280"),
+  axisBorder: readColorToken("--chart-axis-border", "#d1d5db"),
+  tooltipText: readColorToken("--chart-tooltip-text", "#111827"),
+  neutralLine: readColorToken("--chart-line-neutral", "#181818"),
+  surface: readColorToken("--surface-card", "#ffffff")
+});
+var getChartSeriesRecord = (backendColors, count = 5) => {
+  const { series } = getChartTheme();
+  const fallbackColors = Object.fromEntries(
+    Array.from({ length: count }, (_, index) => [index + 1, series[index]])
+  );
+  const isDarkSchemeActive = typeof document !== "undefined" && document.documentElement.dataset.colorScheme === "dark";
+  const highContrastActive = typeof document !== "undefined" && document.documentElement.dataset.contrast === "high";
+  return highContrastActive || isDarkSchemeActive ? fallbackColors : __spreadValues(__spreadValues({}, fallbackColors), backendColors);
+};
+
+// src/components/chart/interactive-donut-utils.ts
+function resolveInteractiveDonutColors({
+  count,
+  colors,
+  mutedColors,
+  selectedIndex
+}) {
+  if (colors.length === 0 || mutedColors.length === 0) return [];
+  return Array.from({ length: count }, (_, index) => {
+    const color = colors[index % colors.length];
+    if (selectedIndex === null || index === selectedIndex) return color;
+    return mutedColors[index % mutedColors.length];
+  });
+}
+function resolveRelativeDonutSelection({
+  currentIndex,
+  direction,
+  count
+}) {
+  if (count <= 0) return null;
+  if (currentIndex === null) return direction > 0 ? 0 : count - 1;
+  return (currentIndex + direction + count) % count;
+}
+var TOOLTIP_ENTITIES = {
+  "&": "&amp;",
+  "<": "&lt;",
+  ">": "&gt;",
+  '"': "&quot;",
+  "'": "&#039;"
+};
+function escapeDonutTooltipText(value) {
+  return String(value != null ? value : "").replace(
+    /[&<>"']/g,
+    (character) => TOOLTIP_ENTITIES[character]
+  );
+}
+
+// src/hooks/useHighContrastPreference.ts
+import { useEffect as useEffect2, useState as useState2 } from "react";
+function useHighContrastPreference() {
+  const [highContrast, setHighContrast] = useState2(false);
+  useEffect2(() => {
+    const root = document.documentElement;
+    const read = () => setHighContrast(root.dataset.contrast === "high");
+    read();
+    const observer = new MutationObserver(read);
+    observer.observe(root, {
+      attributes: true,
+      attributeFilter: ["data-contrast"]
+    });
+    return () => observer.disconnect();
+  }, []);
+  return highContrast;
+}
+
+// src/components/chart/InteractiveDonutChart.tsx
+import {
+  useEffect as useEffect3,
+  useId,
+  useMemo,
+  useRef,
+  useState as useState3
+} from "react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+function InteractiveDonutChart(_a) {
+  var _b = _a, {
+    options = {},
+    series,
+    colors,
+    mutedColors,
+    valueFormatter = (value) => new Intl.NumberFormat("pt-BR", {
+      style: "currency",
+      currency: "BRL"
+    }).format(value),
+    ariaLabel = "Gr\xE1fico de distribui\xE7\xE3o",
+    className,
+    chartClassName,
+    responsiveHeight = false,
+    highContrastOverride
+  } = _b, rest = __objRest(_b, [
+    "options",
+    "series",
+    "colors",
+    "mutedColors",
+    "valueFormatter",
+    "ariaLabel",
+    "className",
+    "chartClassName",
+    "responsiveHeight",
+    "highContrastOverride"
+  ]);
+  var _a2, _b2, _c, _d, _e, _f, _g, _h, _i;
+  const storedHighContrast = useHighContrastPreference();
+  const highContrast = highContrastOverride != null ? highContrastOverride : storedHighContrast;
+  const [selectedIndex, setSelectedIndex] = useState3(null);
+  const [legendSelectedIndex, setLegendSelectedIndex] = useState3(
+    null
+  );
+  const containerRef = useRef(null);
+  const instructionsId = useId();
+  const chartTheme = getChartTheme();
+  const baseColors = !highContrast && (colors == null ? void 0 : colors.length) ? colors : chartTheme.donutSeries;
+  const neutralColors = !highContrast && (mutedColors == null ? void 0 : mutedColors.length) ? mutedColors : chartTheme.mutedSeries;
+  const labels = useMemo(() => {
+    var _a3;
+    return (_a3 = options.labels) != null ? _a3 : [];
+  }, [options.labels]);
+  useEffect3(() => {
+    setSelectedIndex(
+      (current) => current !== null && current >= series.length ? null : current
+    );
+    setLegendSelectedIndex(
+      (current) => current !== null && current >= series.length ? null : current
+    );
+  }, [series.length]);
+  useEffect3(() => {
+    const resetOnOutsideClick = (event) => {
+      var _a3;
+      if ((_a3 = containerRef.current) == null ? void 0 : _a3.contains(event.target)) return;
+      setSelectedIndex(null);
+      setLegendSelectedIndex(null);
+    };
+    document.addEventListener("pointerdown", resetOnOutsideClick);
+    return () => document.removeEventListener("pointerdown", resetOnOutsideClick);
+  }, []);
+  const [pieCircle, setPieCircle] = useState3(null);
+  const [measuredChartHeight, setMeasuredChartHeight] = useState3(
+    null
+  );
+  useEffect3(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const measure = () => {
+      const containerRect = container.getBoundingClientRect();
+      if (responsiveHeight) {
+        const fallbackHeight = typeof rest.height === "number" ? rest.height : 0;
+        const nextHeight = Math.max(
+          fallbackHeight,
+          Math.floor(containerRect.height)
+        );
+        if (nextHeight > 0) {
+          setMeasuredChartHeight(
+            (current) => current === nextHeight ? current : nextHeight
+          );
+        }
+      }
+      const areas = container.querySelectorAll(
+        ".apexcharts-pie-area"
+      );
+      if (!areas.length) return;
+      let minX = Infinity;
+      let minY = Infinity;
+      let maxX = -Infinity;
+      let maxY = -Infinity;
+      areas.forEach((area) => {
+        const rect = area.getBoundingClientRect();
+        minX = Math.min(minX, rect.left);
+        minY = Math.min(minY, rect.top);
+        maxX = Math.max(maxX, rect.right);
+        maxY = Math.max(maxY, rect.bottom);
+      });
+      setPieCircle({
+        cx: (minX + maxX) / 2 - containerRect.left,
+        cy: (minY + maxY) / 2 - containerRect.top,
+        diameter: Math.min(maxX - minX, maxY - minY)
+      });
+    };
+    measure();
+    const resizeObserver = new ResizeObserver(measure);
+    resizeObserver.observe(container);
+    const mutationObserver = new MutationObserver(measure);
+    mutationObserver.observe(container, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      attributeFilter: ["d"]
+    });
+    return () => {
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+    };
+  }, [responsiveHeight, rest.height, series.length]);
+  const donutSizeRatio = useMemo(() => {
+    var _a3, _b3, _c2, _d2;
+    const size = (_d2 = (_c2 = (_b3 = (_a3 = options.plotOptions) == null ? void 0 : _a3.pie) == null ? void 0 : _b3.donut) == null ? void 0 : _c2.size) != null ? _d2 : "65%";
+    const parsed = parseFloat(String(size));
+    return Number.isFinite(parsed) ? parsed / 100 : 0.65;
+  }, [(_c = (_b2 = (_a2 = options.plotOptions) == null ? void 0 : _a2.pie) == null ? void 0 : _b2.donut) == null ? void 0 : _c.size]);
+  const displayColors = resolveInteractiveDonutColors({
+    count: series.length,
+    colors: baseColors,
+    mutedColors: neutralColors,
+    selectedIndex
+  });
+  const legendValue = legendSelectedIndex !== null ? {
+    label: (_d = labels[legendSelectedIndex]) != null ? _d : `Categoria ${legendSelectedIndex + 1}`,
+    value: Number((_e = series[legendSelectedIndex]) != null ? _e : 0)
+  } : null;
+  const interactiveOptions = useMemo(() => {
+    var _a3, _b3, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j, _k, _l, _m;
+    const originalSelection = (_b3 = (_a3 = options.chart) == null ? void 0 : _a3.events) == null ? void 0 : _b3.dataPointSelection;
+    const originalLegendClick = (_d2 = (_c2 = options.chart) == null ? void 0 : _c2.events) == null ? void 0 : _d2.legendClick;
+    return __spreadProps(__spreadValues({}, options), {
+      colors: displayColors,
+      fill: highContrast ? {
+        type: "pattern",
+        pattern: {
+          style: [
+            "verticalLines",
+            "horizontalLines",
+            "slantedLines",
+            "squares",
+            "circles"
+          ],
+          width: 6,
+          height: 6,
+          strokeWidth: 2
+        }
+      } : __spreadProps(__spreadValues({}, options.fill), {
+        type: (_f2 = (_e2 = options.fill) == null ? void 0 : _e2.type) != null ? _f2 : "solid",
+        opacity: (_h2 = (_g2 = options.fill) == null ? void 0 : _g2.opacity) != null ? _h2 : 1
+      }),
+      stroke: highContrast ? __spreadProps(__spreadValues({}, options.stroke), { colors: ["#ffffff"], width: 2 }) : options.stroke,
+      chart: __spreadProps(__spreadValues({}, options.chart), {
+        events: __spreadProps(__spreadValues({}, (_i2 = options.chart) == null ? void 0 : _i2.events), {
+          dataPointSelection(event, chart, config) {
+            originalSelection == null ? void 0 : originalSelection(event, chart, config);
+            const nextIndex = Number(config == null ? void 0 : config.dataPointIndex);
+            if (!Number.isInteger(nextIndex) || nextIndex < 0) return;
+            setSelectedIndex(
+              (current) => current === nextIndex ? null : nextIndex
+            );
+          },
+          legendClick(chartContext, seriesIndex, config) {
+            originalLegendClick == null ? void 0 : originalLegendClick(chartContext, seriesIndex, config);
+            if (typeof seriesIndex !== "number" || seriesIndex < 0) return;
+            setLegendSelectedIndex(
+              (current) => current === seriesIndex ? null : seriesIndex
+            );
+          }
+        })
+      }),
+      legend: __spreadProps(__spreadValues({}, options.legend), {
+        labels: __spreadProps(__spreadValues({}, (_j = options.legend) == null ? void 0 : _j.labels), {
+          colors: chartTheme.axis
+        }),
+        onItemClick: __spreadProps(__spreadValues({}, (_k = options.legend) == null ? void 0 : _k.onItemClick), {
+          toggleDataSeries: false
+        })
+      }),
+      states: __spreadProps(__spreadValues({}, options.states), {
+        hover: __spreadProps(__spreadValues({}, (_l = options.states) == null ? void 0 : _l.hover), {
+          filter: { type: "none" }
+        }),
+        active: __spreadProps(__spreadValues({}, (_m = options.states) == null ? void 0 : _m.active), {
+          allowMultipleDataPointsSelection: false,
+          filter: { type: "none" }
+        })
+      }),
+      tooltip: __spreadProps(__spreadValues({}, options.tooltip), {
+        enabled: true,
+        followCursor: true,
+        custom({ series: tooltipSeries, seriesIndex }) {
+          var _a4, _b4;
+          const value = Number((_a4 = tooltipSeries == null ? void 0 : tooltipSeries[seriesIndex]) != null ? _a4 : 0);
+          const label = escapeDonutTooltipText(
+            (_b4 = labels[seriesIndex]) != null ? _b4 : `Categoria ${seriesIndex + 1}`
+          );
+          const formattedValue = escapeDonutTooltipText(valueFormatter(value));
+          return `<div class="donut-chart-tooltip"><span class="donut-chart-tooltip-label">${label}</span><strong class="donut-chart-tooltip-value">${formattedValue}</strong></div>`;
+        }
+      })
+    });
+  }, [
+    chartTheme.axis,
+    displayColors,
+    highContrast,
+    labels,
+    options,
+    valueFormatter
+  ]);
+  const selectedLabel = selectedIndex === null ? "Nenhuma categoria selecionada" : `${(_f = labels[selectedIndex]) != null ? _f : `Categoria ${selectedIndex + 1}`}: ${valueFormatter(
+    Number((_g = series[selectedIndex]) != null ? _g : 0)
+  )}`;
+  const legendValueLabel = legendSelectedIndex === null ? "" : `Valor em destaque: ${(_h = labels[legendSelectedIndex]) != null ? _h : `Categoria ${legendSelectedIndex + 1}`}: ${valueFormatter(Number((_i = series[legendSelectedIndex]) != null ? _i : 0))}`;
+  const handleKeyDown = (event) => {
+    if (["ArrowRight", "ArrowDown", "ArrowLeft", "ArrowUp"].includes(event.key)) {
+      event.preventDefault();
+      const direction = event.key === "ArrowRight" || event.key === "ArrowDown" ? 1 : -1;
+      setSelectedIndex(
+        (current) => resolveRelativeDonutSelection({
+          currentIndex: current,
+          direction,
+          count: series.length
+        })
+      );
+    }
+    if (event.key === "Escape") {
+      setSelectedIndex(null);
+      setLegendSelectedIndex(null);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      role: "group",
+      tabIndex: 0,
+      "aria-label": ariaLabel,
+      "aria-describedby": instructionsId,
+      onKeyDown: handleKeyDown,
+      className: `chart-keyboard-focus-ring relative min-w-0 rounded-sm ${className != null ? className : ""}`.trim(),
+      children: [
+        /* @__PURE__ */ jsx2(
+          LazyApexChart,
+          __spreadProps(__spreadValues({}, rest), {
+            className: chartClassName,
+            height: responsiveHeight && measuredChartHeight ? measuredChartHeight : rest.height,
+            options: interactiveOptions,
+            series,
+            type: "donut"
+          }),
+          highContrast ? "donut-high-contrast" : "donut-standard"
+        ),
+        legendValue && pieCircle && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "aria-hidden": "true",
+            className: "pointer-events-none absolute flex flex-col items-center justify-center text-center",
+            style: {
+              left: pieCircle.cx,
+              top: pieCircle.cy,
+              width: pieCircle.diameter * donutSizeRatio * 0.94,
+              transform: "translate(-50%, -50%)"
+            },
+            children: [
+              /* @__PURE__ */ jsx2("span", { className: "w-full truncate text-xs leading-tight text-content-secondary", children: legendValue.label }),
+              /* @__PURE__ */ jsx2("span", { className: "w-full break-words text-md font-bold leading-tight text-content-primary", children: valueFormatter(legendValue.value) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx2("span", { className: "sr-only", "aria-live": "polite", children: selectedLabel }),
+        /* @__PURE__ */ jsx2("span", { className: "sr-only", "aria-live": "polite", children: legendValueLabel }),
+        /* @__PURE__ */ jsx2("span", { id: instructionsId, className: "sr-only", children: "Use as setas para navegar pelas categorias e Escape para limpar a sele\xE7\xE3o." })
+      ]
+    }
+  );
+}
+
+// src/components/chart/TimeSeriesChart.tsx
+import { useEffect as useEffect4, useRef as useRef2, useState as useState4 } from "react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function TimeSeriesChart(_a) {
+  var _b = _a, {
+    options,
+    ariaLabel,
+    className,
+    chartClassName,
+    responsiveHeight = false,
+    highContrastOverride
+  } = _b, chartProps = __objRest(_b, [
+    "options",
+    "ariaLabel",
+    "className",
+    "chartClassName",
+    "responsiveHeight",
+    "highContrastOverride"
+  ]);
+  var _a2, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
+  const storedHighContrast = useHighContrastPreference();
+  const highContrast = highContrastOverride != null ? highContrastOverride : storedHighContrast;
+  const theme = getChartTheme();
+  const containerRef = useRef2(null);
+  const [measuredHeight, setMeasuredHeight] = useState4(null);
+  const [measuredWidth, setMeasuredWidth] = useState4(null);
+  const themeKey = [
+    highContrast ? "high-contrast" : "standard",
+    theme.axis,
+    theme.axisBorder,
+    theme.grid,
+    theme.surface,
+    ...theme.series
+  ].join("|");
+  useEffect4(() => {
+    if (!responsiveHeight) {
+      setMeasuredHeight(null);
+      setMeasuredWidth(null);
+      return;
+    }
+    const container = containerRef.current;
+    if (!container || typeof ResizeObserver === "undefined") return;
+    const fallbackHeight = typeof chartProps.height === "number" ? chartProps.height : 0;
+    let frame = 0;
+    const measure = () => {
+      cancelAnimationFrame(frame);
+      frame = requestAnimationFrame(() => {
+        const bounds = container.getBoundingClientRect();
+        const nextWidth = Math.floor(bounds.width);
+        const nextHeight = Math.max(
+          fallbackHeight,
+          Math.floor(bounds.height)
+        );
+        if (nextWidth > 0) {
+          setMeasuredWidth(
+            (current) => current === nextWidth ? current : nextWidth
+          );
+        }
+        if (nextHeight > 0) {
+          setMeasuredHeight(
+            (current) => current === nextHeight ? current : nextHeight
+          );
+        }
+      });
+    };
+    measure();
+    const resizeObserver = new ResizeObserver(measure);
+    resizeObserver.observe(container);
+    return () => {
+      cancelAnimationFrame(frame);
+      resizeObserver.disconnect();
+    };
+  }, [chartProps.height, responsiveHeight]);
+  const renderedHeight = responsiveHeight && measuredHeight ? measuredHeight : chartProps.height;
+  const renderedWidth = responsiveHeight && measuredWidth ? measuredWidth : chartProps.width;
+  const xAxis = options.xaxis;
+  const xAxisCategories = Array.isArray(xAxis == null ? void 0 : xAxis.categories) ? xAxis.categories : [];
+  const availableWidth = typeof renderedWidth === "number" ? renderedWidth : 720;
+  const maxVisibleXAxisLabels = Math.max(
+    4,
+    Math.min(12, Math.floor(availableWidth / 88))
+  );
+  const xAxisLabelStep = Math.max(
+    1,
+    Math.ceil(xAxisCategories.length / maxVisibleXAxisLabels)
+  );
+  const hasDenseXAxis = xAxisCategories.length > maxVisibleXAxisLabels;
+  const xAxisCategoriesKey = JSON.stringify(xAxisCategories);
+  const responsiveXAxisFormatter = xAxisCategories.length ? (value, _timestamp, opts) => {
+    var _a3, _b3;
+    const fallbackIndex = xAxisCategories.findIndex(
+      (category) => String(category) === String(value)
+    );
+    const index = (_a3 = opts == null ? void 0 : opts.dataPointIndex) != null ? _a3 : fallbackIndex >= 0 ? fallbackIndex : 0;
+    const isLast = index === xAxisCategories.length - 1;
+    return index % xAxisLabelStep === 0 || isLast ? String((_b3 = xAxisCategories[index]) != null ? _b3 : value) : "";
+  } : (_a2 = xAxis == null ? void 0 : xAxis.labels) == null ? void 0 : _a2.formatter;
+  const renderKey = [
+    themeKey,
+    renderedWidth != null ? renderedWidth : "auto-width",
+    renderedHeight != null ? renderedHeight : "auto-height",
+    xAxisCategoriesKey
+  ].join("|");
+  const yAxis = Array.isArray(options.yaxis) ? options.yaxis.map((axis) => {
+    var _a3;
+    return __spreadProps(__spreadValues({}, axis), {
+      labels: __spreadProps(__spreadValues({}, axis.labels), {
+        show: true,
+        style: __spreadProps(__spreadValues({
+          fontSize: "11px",
+          fontWeight: 500
+        }, (_a3 = axis.labels) == null ? void 0 : _a3.style), {
+          colors: theme.axis
+        })
+      })
+    });
+  }) : __spreadProps(__spreadValues({}, options.yaxis), {
+    labels: __spreadProps(__spreadValues({}, (_b2 = options.yaxis) == null ? void 0 : _b2.labels), {
+      show: true,
+      style: __spreadProps(__spreadValues({
+        fontSize: "11px",
+        fontWeight: 500
+      }, (_d = (_c = options.yaxis) == null ? void 0 : _c.labels) == null ? void 0 : _d.style), {
+        colors: theme.axis
+      })
+    })
+  });
+  const sharedOptions = __spreadProps(__spreadValues({}, options), {
+    colors: highContrast ? [...theme.series] : options.colors,
+    chart: __spreadProps(__spreadValues({
+      toolbar: { show: false },
+      zoom: { enabled: false },
+      parentHeightOffset: 0,
+      redrawOnParentResize: true,
+      redrawOnWindowResize: true
+    }, options.chart), {
+      foreColor: theme.axis
+    }),
+    dataLabels: __spreadValues({
+      enabled: false
+    }, options.dataLabels),
+    grid: __spreadProps(__spreadValues({
+      show: true,
+      borderColor: theme.grid,
+      strokeDashArray: 0
+    }, options.grid), {
+      xaxis: {
+        lines: __spreadProps(__spreadValues({}, (_f = (_e = options.grid) == null ? void 0 : _e.xaxis) == null ? void 0 : _f.lines), {
+          show: hasDenseXAxis ? false : (_j = (_i = (_h = (_g = options.grid) == null ? void 0 : _g.xaxis) == null ? void 0 : _h.lines) == null ? void 0 : _i.show) != null ? _j : true
+        })
+      },
+      yaxis: {
+        lines: __spreadValues({ show: true }, (_l = (_k = options.grid) == null ? void 0 : _k.yaxis) == null ? void 0 : _l.lines)
+      },
+      padding: __spreadValues({
+        top: 0,
+        right: 8,
+        bottom: 8,
+        left: 8
+      }, (_m = options.grid) == null ? void 0 : _m.padding)
+    }),
+    stroke: __spreadProps(__spreadValues({
+      width: 2,
+      curve: "straight"
+    }, options.stroke), {
+      colors: highContrast ? [...theme.series] : (_n = options.stroke) == null ? void 0 : _n.colors,
+      dashArray: highContrast ? [0, 6, 2, 8, 4, 10, 1, 7, 3, 9, 5, 11] : (_p = (_o = options.stroke) == null ? void 0 : _o.dashArray) != null ? _p : 0
+    }),
+    markers: __spreadProps(__spreadValues({
+      strokeWidth: 1,
+      strokeColors: [theme.surface]
+    }, options.markers), {
+      size: highContrast ? 4 : (_r = (_q = options.markers) == null ? void 0 : _q.size) != null ? _r : 3,
+      hover: __spreadValues({ size: 4 }, (_s = options.markers) == null ? void 0 : _s.hover)
+    }),
+    annotations: highContrast ? __spreadProps(__spreadValues({}, options.annotations), {
+      xaxis: (_u = (_t = options.annotations) == null ? void 0 : _t.xaxis) == null ? void 0 : _u.map((annotation, index) => __spreadProps(__spreadValues({}, annotation), {
+        fillColor: theme.series[index % theme.series.length],
+        opacity: 0.28
+      }))
+    }) : options.annotations,
+    xaxis: __spreadProps(__spreadValues({
+      tooltip: { enabled: false },
+      axisBorder: { color: theme.axisBorder }
+    }, xAxis), {
+      tickAmount: xAxisCategories.length ? void 0 : xAxis == null ? void 0 : xAxis.tickAmount,
+      axisTicks: __spreadProps(__spreadValues({
+        color: theme.axisBorder
+      }, xAxis == null ? void 0 : xAxis.axisTicks), {
+        show: hasDenseXAxis ? false : (_w = (_v = xAxis == null ? void 0 : xAxis.axisTicks) == null ? void 0 : _v.show) != null ? _w : true
+      }),
+      labels: __spreadProps(__spreadValues({}, xAxis == null ? void 0 : xAxis.labels), {
+        show: true,
+        formatter: responsiveXAxisFormatter,
+        style: __spreadProps(__spreadValues({
+          fontSize: "11px",
+          fontWeight: 500
+        }, (_x = xAxis == null ? void 0 : xAxis.labels) == null ? void 0 : _x.style), {
+          colors: theme.axis
+        })
+      })
+    }),
+    yaxis: yAxis,
+    tooltip: __spreadValues({
+      shared: true,
+      intersect: false,
+      followCursor: true
+    }, options.tooltip),
+    legend: __spreadProps(__spreadValues({}, options.legend), {
+      labels: __spreadProps(__spreadValues({}, (_y = options.legend) == null ? void 0 : _y.labels), {
+        colors: theme.axis
+      })
+    }),
+    noData: __spreadProps(__spreadValues({
+      text: "Nenhum dado dispon\xEDvel no per\xEDodo selecionado"
+    }, options.noData), {
+      style: __spreadProps(__spreadValues({
+        fontSize: "15px"
+      }, (_z = options.noData) == null ? void 0 : _z.style), {
+        color: theme.axis
+      })
+    })
+  });
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      ref: containerRef,
+      role: "img",
+      "aria-label": ariaLabel,
+      className,
+      children: /* @__PURE__ */ jsx3(
+        LazyApexChart,
+        __spreadProps(__spreadValues({}, chartProps), {
+          className: chartClassName,
+          width: renderedWidth,
+          height: renderedHeight,
+          options: sharedOptions
+        }),
+        renderKey
+      )
+    }
+  );
+}
+
+// src/components/chart/TimeRangeSelector.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+function TimeRangeSelector({
+  options,
+  selected,
+  onSelect,
+  ariaLabel = "Per\xEDodo do gr\xE1fico",
+  className
+}) {
+  return /* @__PURE__ */ jsx4(
+    "div",
+    {
+      role: "group",
+      "aria-label": ariaLabel,
+      className: `flex min-w-0 flex-wrap justify-start gap-1.5 ${className != null ? className : ""}`.trim(),
+      children: options.map((range) => {
+        const isSelected = selected === range;
+        return /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "button",
+            "aria-pressed": isSelected,
+            onClick: () => onSelect(range),
+            className: `shrink-0 whitespace-nowrap rounded-sm border px-2.5 py-1 text-sm font-semibold transition-colors ${isSelected ? "border-selection-border bg-selection-background text-selection-content" : "border-primary-1 text-primary-1 hover:bg-primary-5"}`,
+            children: range
+          },
+          range
+        );
+      })
+    }
+  );
+}
+
+// src/components/chart/time-series-chart-utils.ts
+var TOOLTIP_ENTITIES2 = {
+  "&": "&amp;",
+  "<": "&lt;",
+  ">": "&gt;",
+  '"': "&quot;",
+  "'": "&#039;"
+};
+function escapeTimeSeriesTooltipText(value) {
+  return String(value != null ? value : "").replace(
+    /[&<>"']/g,
+    (character) => TOOLTIP_ENTITIES2[character]
+  );
+}
+var SAFE_TOOLTIP_COLOR = /^(?:#[\da-f]{3,8}|rgba?\([\d\s.,%]+\)|hsla?\([\d\s.,%]+\)|var\(--[\w-]+\)|[a-z]+)$/i;
+function normalizeTimeSeriesTooltipColor(value) {
+  const color = String(value != null ? value : "").trim();
+  return SAFE_TOOLTIP_COLOR.test(color) ? color : "currentColor";
+}
+function buildTimeSeriesTooltip({
+  reference,
+  rows
+}) {
+  const content = rows.map(({ label, value, color }) => {
+    const marker = color ? `<span class="time-series-chart-tooltip-marker" style="background-color:${normalizeTimeSeriesTooltipColor(color)}"></span>` : "";
+    return `<div class="time-series-chart-tooltip-row"><span class="time-series-chart-tooltip-name">${marker}${escapeTimeSeriesTooltipText(label)}</span><strong>${escapeTimeSeriesTooltipText(value)}</strong></div>`;
+  }).join("");
+  return `<div class="time-series-chart-tooltip"><div class="time-series-chart-tooltip-reference">${escapeTimeSeriesTooltipText(reference)}</div>${content}</div>`;
+}
+
+export {
+  LazyApexChart,
+  getChartTheme,
+  getChartSeriesRecord,
+  resolveInteractiveDonutColors,
+  resolveRelativeDonutSelection,
+  escapeDonutTooltipText,
+  InteractiveDonutChart,
+  TimeSeriesChart,
+  TimeRangeSelector,
+  escapeTimeSeriesTooltipText,
+  normalizeTimeSeriesTooltipColor,
+  buildTimeSeriesTooltip
+};
+//# sourceMappingURL=chunk-6MXHE5MD.js.map