@mlw-packages/react-components 1.8.5 → 1.8.7

package/dist/index.mjs

@@ -491,7 +491,7 @@ function cn(...inputs) {
 }
 
 // src/components/ui/form/ButtonBase.tsx
-import { CircleNotchIcon } from "@phosphor-icons/react";
+import { CircleNotchIcon as CircleNotchIcon2 } from "@phosphor-icons/react";
 
 // src/components/ui/feedback/AlertDialogBase.tsx
 import * as React from "react";
@@ -1166,49 +1166,59 @@ import {
   XCircleIcon,
   InfoIcon,
   WarningIcon,
-  SpinnerIcon
+  CircleNotchIcon
 } from "@phosphor-icons/react";
 import { Toaster as Sonner, toast as sonnertoast } from "sonner";
 import { jsx as jsx7 } from "react/jsx-runtime";
-var iconBaseClass = "w-5 h-auto";
+var iconBaseClass = "w-5 h-5";
 var Toaster = ({ testId, ...props }) => {
   return /* @__PURE__ */ jsx7(
     Sonner,
     {
       className: "toaster group",
       position: "top-center",
+      duration: 4e3,
       toastOptions: {
+        style: {
+          backdropFilter: "blur(8px)",
+          WebkitBackdropFilter: "blur(8px)"
+        },
         classNames: {
           toast: `
             group toast
-            bg-background
+            bg-background/95
             text-foreground
-            shadow-lg rounded-md
+            shadow-xl rounded-lg
             border-l-4
-            border-border
+
             flex items-center gap-3
-            data-[type=success]:border-l-green-500 data-[type=success]:bg-green-50 data-[type=success]:text-green-800 data-[type=success]:border-green-500
-            data-[type=error]:border-l-red-500 data-[type=error]:bg-red-50 data-[type=error]:text-red-800 data-[type=error]:border-red-500
-            data-[type=WarningIcon]:border-l-yellow-500 data-[type=WarningIcon]:bg-yellow-50 data-[type=WarningIcon]:text-yellow-800 data-[type=WarningIcon]:border-yellow-500
-            data-[type=InfoIcon]:border-l-blue-500 data-[type=InfoIcon]:bg-blue-50 data-[type=InfoIcon]:text-blue-800 data-[type=InfoIcon]:border-blue-500
+            transition-all duration-300
+            hover:scale-[1.02] hover:shadow-2xl
+            data-[type=success]:border-l-green-500 data-[type=success]:bg-green-50/95 data-[type=success]:text-green-800 data-[type=success]:border-green-500 data-
+            data-[type=error]:border-l-red-500 data-[type=error]:bg-red-50/95 data-[type=error]:text-red-800 data-[type=error]:border-red-500
+            data-[type=warning]:border-l-yellow-500 data-[type=warning]:bg-yellow-50/95 data-[type=warning]:text-yellow-800 data-[type=warning]:border-yellow-500
+            data-[type=info]:border-l-blue-500 data-[type=info]:bg-blue-50/95 data-[type=info]:text-blue-800 data-[type=info]:border-blue-500 
           `,
           description: `
-            text-sm
+            text-xs
+            font-semibold
             group-[.toast]:text-neutral-600
           `,
           actionButton: `
             ml-auto
             rounded-md px-3 py-1 text-sm font-semibold
             bg-neutral-800 text-white
-            hover:bg-neutral-700
-            transition-colors duration-200
+            hover:bg-neutral-700 hover:scale-105
+            transition-all duration-200
+            active:scale-95
           `,
           cancelButton: `
             ml-2
             rounded-md px-3 py-1 text-sm font-semibold
             bg-neutral-100 text-neutral-700
-            hover:bg-neutral-200
-            transition-colors duration-200
+            hover:bg-neutral-200 hover:scale-105
+            transition-all duration-200
+            active:scale-95
           `
         }
       },
@@ -1218,24 +1228,52 @@ var Toaster = ({ testId, ...props }) => {
   );
 };
 var toast = {
-  success: (message) => sonnertoast.success(message, {
-    icon: /* @__PURE__ */ jsx7(CheckCircleIcon, { className: `${iconBaseClass} text-green-600`, weight: "fill" }),
+  success: (message, description) => sonnertoast.success(message, {
+    description,
+    icon: /* @__PURE__ */ jsx7(
+      CheckCircleIcon,
+      {
+        className: `${iconBaseClass} text-green-600`,
+        weight: "fill"
+      }
+    ),
     className: "sonner-success"
   }),
-  error: (message) => sonnertoast.error(message, {
-    icon: /* @__PURE__ */ jsx7(XCircleIcon, { className: `${iconBaseClass} text-red-600`, weight: "fill" }),
+  error: (message, description) => sonnertoast.error(message, {
+    description,
+    icon: /* @__PURE__ */ jsx7(
+      XCircleIcon,
+      {
+        className: `${iconBaseClass} text-red-600`,
+        weight: "fill"
+      }
+    ),
     className: "sonner-error"
   }),
-  warning: (message) => sonnertoast.warning(message, {
-    icon: /* @__PURE__ */ jsx7(WarningIcon, { className: `${iconBaseClass} text-yellow-600`, weight: "fill" }),
-    className: "sonner-WarningIcon"
+  warning: (message, description) => sonnertoast.warning(message, {
+    description,
+    icon: /* @__PURE__ */ jsx7(
+      WarningIcon,
+      {
+        className: `${iconBaseClass} text-yellow-600`,
+        weight: "fill"
+      }
+    ),
+    className: "sonner-warning"
   }),
-  info: (message) => sonnertoast.info(message, {
+  info: (message, description) => sonnertoast.info(message, {
+    description,
     icon: /* @__PURE__ */ jsx7(InfoIcon, { className: `${iconBaseClass} text-blue-600`, weight: "fill" }),
-    className: "sonner-InfoIcon"
+    className: "sonner-info"
   }),
-  loading: (message) => sonnertoast(message, {
-    icon: /* @__PURE__ */ jsx7(SpinnerIcon, { className: `${iconBaseClass} animate-spin text-neutral-500`, weight: "fill" }),
+  loading: (message, description) => sonnertoast(message, {
+    description,
+    icon: /* @__PURE__ */ jsx7(
+      CircleNotchIcon,
+      {
+        className: `${iconBaseClass} animate-spin text-gray-600`
+      }
+    ),
     className: "sonner-loading"
   })
 };
@@ -1383,12 +1421,21 @@ var TooltipTriggerBase = React7.forwardRef(({ children, onPointerDown, ...props
     },
     [onPointerDown]
   );
+  const onClick = React7.useCallback(
+    (e) => {
+      if (onPointerDown) {
+        onPointerDown(e);
+      }
+    },
+    [onPointerDown]
+  );
   return /* @__PURE__ */ jsx8(
     TooltipPrimitive.Trigger,
     {
       ref,
       tabIndex: -1,
       onPointerDown: onPointerDown ? handlePointerDown : void 0,
+      onClick,
       "data-tooltip-trigger": true,
       "aria-describedby": "tooltip-content",
       ...props,
@@ -1685,7 +1732,7 @@ var ButtonBase = React10.forwardRef(
           isActivelyLoading && /* @__PURE__ */ jsxs8("span", { className: "absolute inset-0 flex items-center justify-center pointer-events-none rounded-md", children: [
             /* @__PURE__ */ jsx11("span", { className: "absolute inset-0 rounded-md backdrop-blur overflow-hidden" }),
             /* @__PURE__ */ jsx11(
-              CircleNotchIcon,
+              CircleNotchIcon2,
               {
                 weight: "bold",
                 className: "relative animate-spin h-4 w-4 text-current"
@@ -2761,8 +2808,7 @@ function MultiCombobox({
               )
             ]
           }
-        ),
-        /* @__PURE__ */ jsx21(ErrorMessage_default, { error })
+        )
       ]
     }
   );
@@ -7347,7 +7393,7 @@ function StatusIndicator({
 
 // src/components/ui/form/DebouncedInput.tsx
 import { useEffect as useEffect15, useState as useState14 } from "react";
-import { CircleNotchIcon as CircleNotchIcon2 } from "@phosphor-icons/react";
+import { CircleNotchIcon as CircleNotchIcon3 } from "@phosphor-icons/react";
 import { jsx as jsx54 } from "react/jsx-runtime";
 function DebouncedInput({
   value: initialValue,
@@ -7382,7 +7428,7 @@ function DebouncedInput({
   }, [debounce2, initialValue, onChange, value]);
   const renderRightIcon = () => {
     if (showLoadingIndicator && isDebouncing) {
-      return /* @__PURE__ */ jsx54(CircleNotchIcon2, { className: "h-4 w-4 animate-spin  text-muted-foreground" });
+      return /* @__PURE__ */ jsx54(CircleNotchIcon3, { className: "h-4 w-4 animate-spin  text-muted-foreground" });
     }
     return rightIcon;
   };
@@ -7629,7 +7675,7 @@ function CalendarBase2({
             selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white rounded-md",
             today: "bg-muted text-foreground font-bold ring-2 ring-primary/30 ring-inset rounded-md",
             outside: "text-muted-foreground opacity-60 aria-selected:bg-muted/50 aria-selected:text-foreground",
-            disabled: "text-muted-foreground cursor-not-allowed line-through decoration-2",
+            disabled: "text-muted-foreground cursor-not-allowed",
             range_middle: "aria-selected:bg-muted aria-selected:text-foreground",
             hidden: "invisible",
             ...classNames
@@ -14013,6 +14059,11 @@ function WeekView({
 // src/components/ui/selects/AvatarCombobox.tsx
 import { useId as useId3, useState as useState36 } from "react";
 import { CaretDownIcon as CaretDownIcon6, CheckIcon as CheckIcon11 } from "@phosphor-icons/react";
+
+// public/pwa-512x512.png
+var pwa_512x512_default = "./pwa-512x512-4NJPUGCI.png";
+
+// src/components/ui/selects/AvatarCombobox.tsx
 import { Fragment as Fragment13, jsx as jsx85, jsxs as jsxs63 } from "react/jsx-runtime";
 var DEFAULT_COLORS = [
   "bg-purple-100 text-purple-700",
@@ -14061,10 +14112,14 @@ function AvatarCombobox({
   const allItems = items || (groupItems ? Object.values(groupItems).flat() : []);
   const selectedItem = allItems.find((item) => item.value === selected);
   const renderItem = (item) => {
-    const avatarContent = item.avatar ?? item.label.charAt(0).toUpperCase();
-    const colorClass = item.avatarClassName ?? getColor(item.value, colors2);
+    let avatarContent;
+    let colorClass;
+    if (!item.img) {
+      avatarContent = item.avatar ?? item.label.charAt(0).toUpperCase();
+      colorClass = item.avatarClassName ?? getColor(item.value, colors2);
+    }
     return /* @__PURE__ */ jsxs63(Fragment13, { children: [
-      /* @__PURE__ */ jsx85(Square, { className: colorClass, children: avatarContent }),
+      /* @__PURE__ */ jsx85(Square, { className: colorClass, children: !avatarContent ? /* @__PURE__ */ jsx85("img", { src: pwa_512x512_default }) : avatarContent }),
       /* @__PURE__ */ jsx85("span", { className: "truncate", children: item.label })
     ] });
   };
@@ -14400,27 +14455,27 @@ function MultiSelect({
 }
 
 // src/components/ui/charts/Chart.tsx
-import { useEffect as useEffect33, useCallback as useCallback17, useMemo as useMemo26 } from "react";
+import { useEffect as useEffect34, useCallback as useCallback18, useMemo as useMemo26 } from "react";
 import {
-  ComposedChart,
-  Bar,
-  Line,
-  Area,
+  ComposedChart as ComposedChart2,
+  Bar as Bar2,
+  Line as Line2,
+  Area as Area2,
   Rectangle,
   ReferenceLine,
-  XAxis,
-  YAxis,
+  XAxis as XAxis2,
+  YAxis as YAxis2,
   CartesianGrid,
   Tooltip,
   Legend,
   LabelList,
-  ResponsiveContainer
+  ResponsiveContainer as ResponsiveContainer2
 } from "recharts";
 
 // src/components/ui/charts/utils/helpers.ts
 var formatFieldName = (fieldName) => {
   return fieldName.split(/[/_-]/).filter(Boolean).map((word) => {
-    return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+    return word.charAt(0).toUpperCase() + word.slice(1);
   }).join(" ").trim();
 };
 var detectDataFields = (data, xAxisKey) => {
@@ -15981,8 +16036,213 @@ var TooltipSimple = ({
 };
 var TooltipSimple_default = TooltipSimple;
 
-// src/components/ui/charts/utils/pillLabelRenderer.tsx
+// src/components/ui/charts/components/Brush.tsx
+import {
+  ComposedChart,
+  Bar,
+  Line,
+  Area,
+  XAxis,
+  YAxis,
+  ResponsiveContainer
+} from "recharts";
 import { jsx as jsx94, jsxs as jsxs72 } from "react/jsx-runtime";
+var Brush = ({
+  data,
+  startIndex,
+  endIndex,
+  onMouseDown,
+  brushRef,
+  xAxisKey,
+  seriesOrder,
+  finalColors,
+  brushHeight = 80,
+  brushColor,
+  miniChartOpacity = 0.3,
+  margin = { left: 0, right: 0 }
+}) => {
+  const dataLength = data.length;
+  return /* @__PURE__ */ jsxs72("div", { className: "w-full px-8 pb-4", children: [
+    /* @__PURE__ */ jsxs72(
+      "div",
+      {
+        className: "relative rounded-md border bg-muted/5 shadow-inner",
+        style: { height: brushHeight },
+        children: [
+          /* @__PURE__ */ jsx94(
+            "div",
+            {
+              className: "absolute inset-0 pointer-events-none rounded-md",
+              style: { opacity: miniChartOpacity },
+              children: /* @__PURE__ */ jsx94(ResponsiveContainer, { width: "100%", height: brushHeight, children: /* @__PURE__ */ jsxs72(
+                ComposedChart,
+                {
+                  data: data.map((item) => ({
+                    ...item,
+                    name: String(item[xAxisKey] || "N/A")
+                  })),
+                  height: brushHeight,
+                  margin: {
+                    top: 5,
+                    right: margin.right ?? 30,
+                    left: margin.left ?? 0,
+                    bottom: 5
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx94(XAxis, { dataKey: xAxisKey, hide: true }),
+                    /* @__PURE__ */ jsx94(YAxis, { yAxisId: "left", hide: true }),
+                    seriesOrder.map((s) => {
+                      const key = s.key;
+                      const color = finalColors[key];
+                      if (s.type === "bar") {
+                        return /* @__PURE__ */ jsx94(
+                          Bar,
+                          {
+                            dataKey: key,
+                            yAxisId: "left",
+                            fill: color,
+                            radius: [2, 2, 0, 0]
+                          },
+                          `brush-bar-${key}`
+                        );
+                      }
+                      if (s.type === "line") {
+                        return /* @__PURE__ */ jsx94(
+                          Line,
+                          {
+                            type: "monotone",
+                            dataKey: key,
+                            yAxisId: "left",
+                            stroke: color,
+                            strokeWidth: 1.5,
+                            dot: false
+                          },
+                          `brush-line-${key}`
+                        );
+                      }
+                      if (s.type === "area") {
+                        return /* @__PURE__ */ jsx94(
+                          Area,
+                          {
+                            type: "monotone",
+                            dataKey: key,
+                            yAxisId: "left",
+                            stroke: color,
+                            fill: `url(#gradient-${key})`,
+                            strokeWidth: 1.5
+                          },
+                          `brush-area-${key}`
+                        );
+                      }
+                      return null;
+                    })
+                  ]
+                }
+              ) })
+            }
+          ),
+          /* @__PURE__ */ jsxs72(
+            "div",
+            {
+              ref: brushRef,
+              className: "absolute inset-0 cursor-move rounded-md",
+              style: { userSelect: "none" },
+              children: [
+                /* @__PURE__ */ jsx94(
+                  "div",
+                  {
+                    className: "absolute top-0 bottom-0 left-0 bg-background/80 backdrop-blur-[1px] pointer-events-none rounded-l-md border-r border-border/50",
+                    style: {
+                      width: `${startIndex / (dataLength - 1) * 100}%`
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsx94(
+                  "div",
+                  {
+                    className: "absolute top-0 bottom-0 right-0 bg-background/80 backdrop-blur-[1px] pointer-events-none rounded-r-md border-l border-border/50",
+                    style: {
+                      width: `${(dataLength - 1 - endIndex) / (dataLength - 1) * 100}%`
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsxs72(
+                  "div",
+                  {
+                    className: "absolute top-0 bottom-0 border-x-2 border-y border-primary/50 cursor-move group hover:bg-primary/5 rounded-md",
+                    style: {
+                      left: `${startIndex / (dataLength - 1) * 100}%`,
+                      right: `${(dataLength - 1 - endIndex) / (dataLength - 1) * 100}%`,
+                      backgroundColor: "transparent"
+                    },
+                    onMouseDown: (e) => onMouseDown(e, "middle"),
+                    children: [
+                      /* @__PURE__ */ jsx94(
+                        "div",
+                        {
+                          className: "absolute top-1/2 -translate-y-1/2 -left-3.5 w-7 h-12 flex items-center justify-center cursor-ew-resize group/handle",
+                          onMouseDown: (e) => {
+                            e.stopPropagation();
+                            onMouseDown(e, "start");
+                          },
+                          children: /* @__PURE__ */ jsx94(
+                            "div",
+                            {
+                              className: "w-1.5 h-6 rounded-sm flex flex-col items-center justify-center gap-1 border border-primary/20",
+                              style: {
+                                backgroundColor: brushColor ?? "hsl(var(--primary))"
+                              }
+                            }
+                          )
+                        }
+                      ),
+                      /* @__PURE__ */ jsx94(
+                        "div",
+                        {
+                          className: "absolute top-1/2 -translate-y-1/2 -right-3.5 w-7 h-12 flex items-center justify-center cursor-ew-resize group/handle",
+                          onMouseDown: (e) => {
+                            e.stopPropagation();
+                            onMouseDown(e, "end");
+                          },
+                          children: /* @__PURE__ */ jsx94(
+                            "div",
+                            {
+                              className: "w-1.5 h-6 rounded-sm flex flex-col items-center justify-center gap-1 border border-primary/20",
+                              style: {
+                                backgroundColor: brushColor ?? "hsl(var(--primary))"
+                              }
+                            }
+                          )
+                        }
+                      )
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs72("div", { className: "flex justify-between items-center mt-2 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsxs72("span", { children: [
+        data[startIndex]?.[xAxisKey],
+        " - ",
+        data[endIndex]?.[xAxisKey]
+      ] }),
+      /* @__PURE__ */ jsxs72("span", { children: [
+        endIndex - startIndex + 1,
+        " de ",
+        dataLength,
+        " per\xEDodos"
+      ] })
+    ] })
+  ] });
+};
+var Brush_default = Brush;
+
+// src/components/ui/charts/utils/pillLabelRenderer.tsx
+import { jsx as jsx95, jsxs as jsxs73 } from "react/jsx-runtime";
 var formatCompactNumber = (value) => {
   const isNegative = value < 0;
   const absValue = Math.abs(value);
@@ -16073,8 +16333,8 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
     } else {
       textColor = "#374151";
     }
-    return /* @__PURE__ */ jsxs72("g", { children: [
-      /* @__PURE__ */ jsx94(
+    return /* @__PURE__ */ jsxs73("g", { children: [
+      /* @__PURE__ */ jsx95(
         "rect",
         {
           x: rectX,
@@ -16087,7 +16347,7 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
           strokeWidth: rectStroke ? 1 : 0
         }
       ),
-      /* @__PURE__ */ jsx94(
+      /* @__PURE__ */ jsx95(
         "text",
         {
           x: textX,
@@ -16158,7 +16418,7 @@ var renderInsideBarLabel = (color, valueFormatter2) => {
       const heightFactor = Math.max(0.8, Math.min(1.6, pHeight / heightRef));
       fontSize = Math.min(18, Math.max(8, Math.round(fontSize * heightFactor)));
     }
-    return /* @__PURE__ */ jsx94(
+    return /* @__PURE__ */ jsx95(
       "text",
       {
         x: centerX,
@@ -16177,7 +16437,7 @@ var renderInsideBarLabel = (color, valueFormatter2) => {
 
 // src/components/ui/charts/NoData.tsx
 import { motion as motion21 } from "framer-motion";
-import { Fragment as Fragment17, jsx as jsx95, jsxs as jsxs73 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx96, jsxs as jsxs74 } from "react/jsx-runtime";
 var ChartBar = ({ x, y, w, h, i, loading }) => {
   const baseY = y - h;
   const d = i * 0.08;
@@ -16188,8 +16448,8 @@ var ChartBar = ({ x, y, w, h, i, loading }) => {
     ease: "easeInOut",
     delay: d
   };
-  return /* @__PURE__ */ jsxs73("g", { children: [
-    /* @__PURE__ */ jsx95(
+  return /* @__PURE__ */ jsxs74("g", { children: [
+    /* @__PURE__ */ jsx96(
       motion21.rect,
       {
         x,
@@ -16204,7 +16464,7 @@ var ChartBar = ({ x, y, w, h, i, loading }) => {
         style: { transformBox: "fill-box", originY: 1 }
       }
     ),
-    /* @__PURE__ */ jsx95(
+    /* @__PURE__ */ jsx96(
       motion21.rect,
       {
         x,
@@ -16220,7 +16480,7 @@ var ChartBar = ({ x, y, w, h, i, loading }) => {
         style: { transformBox: "fill-box", originY: 1 }
       }
     ),
-    /* @__PURE__ */ jsx95(
+    /* @__PURE__ */ jsx96(
       motion21.line,
       {
         x1: x + w / 2,
@@ -16254,7 +16514,7 @@ var NoData = ({
     { x: 580, w: 100, h: h * 0.35 },
     { x: 700, w: 100, h: h * 0.3 }
   ];
-  return /* @__PURE__ */ jsx95(
+  return /* @__PURE__ */ jsx96(
     "div",
     {
       className: cn(
@@ -16267,17 +16527,17 @@ var NoData = ({
       },
       role: "img",
       "aria-label": message,
-      children: /* @__PURE__ */ jsx95("div", { className: "w-full flex items-center justify-center pl-[var(--pl)] p-6 h-[var(--svg-h)]", children: /* @__PURE__ */ jsxs73("div", { className: "w-full max-w-[900px] relative", children: [
-        /* @__PURE__ */ jsxs73(
+      children: /* @__PURE__ */ jsx96("div", { className: "w-full flex items-center justify-center pl-[var(--pl)] p-6 h-[var(--svg-h)]", children: /* @__PURE__ */ jsxs74("div", { className: "w-full max-w-[900px] relative", children: [
+        /* @__PURE__ */ jsxs74(
           "svg",
           {
             className: "w-full h-[var(--svg-h)] opacity-40",
             viewBox: `0 0 900 ${h}`,
             preserveAspectRatio: "none",
             children: [
-              /* @__PURE__ */ jsxs73("defs", { children: [
-                /* @__PURE__ */ jsxs73("linearGradient", { id: "bg", x1: "0", x2: "0", y1: "0", y2: "1", children: [
-                  /* @__PURE__ */ jsx95(
+              /* @__PURE__ */ jsxs74("defs", { children: [
+                /* @__PURE__ */ jsxs74("linearGradient", { id: "bg", x1: "0", x2: "0", y1: "0", y2: "1", children: [
+                  /* @__PURE__ */ jsx96(
                     "stop",
                     {
                       offset: "0%",
@@ -16285,7 +16545,7 @@ var NoData = ({
                       stopOpacity: "0.15"
                     }
                   ),
-                  /* @__PURE__ */ jsx95(
+                  /* @__PURE__ */ jsx96(
                     "stop",
                     {
                       offset: "100%",
@@ -16294,8 +16554,8 @@ var NoData = ({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsxs73("linearGradient", { id: "gg", x1: "0", x2: "0", y1: "0", y2: "1", children: [
-                  /* @__PURE__ */ jsx95(
+                /* @__PURE__ */ jsxs74("linearGradient", { id: "gg", x1: "0", x2: "0", y1: "0", y2: "1", children: [
+                  /* @__PURE__ */ jsx96(
                     "stop",
                     {
                       offset: "0%",
@@ -16303,7 +16563,7 @@ var NoData = ({
                       stopOpacity: "0.4"
                     }
                   ),
-                  /* @__PURE__ */ jsx95(
+                  /* @__PURE__ */ jsx96(
                     "stop",
                     {
                       offset: "100%",
@@ -16312,17 +16572,17 @@ var NoData = ({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsxs73("filter", { id: "s", x: "-20%", y: "-20%", width: "140%", height: "140%", children: [
-                  /* @__PURE__ */ jsx95("feGaussianBlur", { in: "SourceAlpha", stdDeviation: "3" }),
-                  /* @__PURE__ */ jsx95("feOffset", { dx: "0", dy: "2" }),
-                  /* @__PURE__ */ jsx95("feComponentTransfer", { children: /* @__PURE__ */ jsx95("feFuncA", { type: "linear", slope: "0.2" }) }),
-                  /* @__PURE__ */ jsxs73("feMerge", { children: [
-                    /* @__PURE__ */ jsx95("feMergeNode", {}),
-                    /* @__PURE__ */ jsx95("feMergeNode", { in: "SourceGraphic" })
+                /* @__PURE__ */ jsxs74("filter", { id: "s", x: "-20%", y: "-20%", width: "140%", height: "140%", children: [
+                  /* @__PURE__ */ jsx96("feGaussianBlur", { in: "SourceAlpha", stdDeviation: "3" }),
+                  /* @__PURE__ */ jsx96("feOffset", { dx: "0", dy: "2" }),
+                  /* @__PURE__ */ jsx96("feComponentTransfer", { children: /* @__PURE__ */ jsx96("feFuncA", { type: "linear", slope: "0.2" }) }),
+                  /* @__PURE__ */ jsxs74("feMerge", { children: [
+                    /* @__PURE__ */ jsx96("feMergeNode", {}),
+                    /* @__PURE__ */ jsx96("feMergeNode", { in: "SourceGraphic" })
                   ] })
                 ] })
               ] }),
-              /* @__PURE__ */ jsx95(
+              /* @__PURE__ */ jsx96(
                 "rect",
                 {
                   x: 0,
@@ -16333,7 +16593,7 @@ var NoData = ({
                   rx: 8
                 }
               ),
-              [...Array(6)].map((_, i) => /* @__PURE__ */ jsx95(
+              [...Array(6)].map((_, i) => /* @__PURE__ */ jsx96(
                 "line",
                 {
                   x1: 50,
@@ -16346,7 +16606,7 @@ var NoData = ({
                 },
                 i
               )),
-              /* @__PURE__ */ jsx95(
+              /* @__PURE__ */ jsx96(
                 "line",
                 {
                   x1: 50,
@@ -16358,7 +16618,7 @@ var NoData = ({
                   opacity: 0.5
                 }
               ),
-              /* @__PURE__ */ jsx95(
+              /* @__PURE__ */ jsx96(
                 "line",
                 {
                   x1: 50,
@@ -16370,7 +16630,7 @@ var NoData = ({
                   opacity: 0.5
                 }
               ),
-              bars.map((b, i) => /* @__PURE__ */ jsx95(
+              bars.map((b, i) => /* @__PURE__ */ jsx96(
                 ChartBar,
                 {
                   x: b.x,
@@ -16385,15 +16645,15 @@ var NoData = ({
             ]
           }
         ),
-        /* @__PURE__ */ jsx95("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none h-[var(--svg-h)]", children: /* @__PURE__ */ jsx95("div", { className: "pointer-events-auto bg-card/95 backdrop-blur-sm px-8 py-6 rounded-xl border border-border/50 shadow-lg text-center max-w-md", children: isLoading ? /* @__PURE__ */ jsx95("div", { className: "flex flex-col items-center gap-4", children: /* @__PURE__ */ jsx95(
+        /* @__PURE__ */ jsx96("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none h-[var(--svg-h)]", children: /* @__PURE__ */ jsx96("div", { className: "pointer-events-auto bg-card/95 backdrop-blur-sm px-8 py-6 rounded-xl border border-border/50 shadow-lg text-center max-w-md", children: isLoading ? /* @__PURE__ */ jsx96("div", { className: "flex flex-col items-center gap-4", children: /* @__PURE__ */ jsx96(
           LoadingBase,
           {
             size: "xl",
             message: loadingMessage ?? "Carregando"
           }
-        ) }) : /* @__PURE__ */ jsxs73(Fragment17, { children: [
-          title && /* @__PURE__ */ jsx95("h3", { className: "text-xl font-semibold text-foreground mb-2", children: title }),
-          /* @__PURE__ */ jsx95("p", { className: "text-lg font-medium text-foreground/90 mb-2", children: message })
+        ) }) : /* @__PURE__ */ jsxs74(Fragment17, { children: [
+          title && /* @__PURE__ */ jsx96("h3", { className: "text-xl font-semibold text-foreground mb-2", children: title }),
+          /* @__PURE__ */ jsx96("p", { className: "text-lg font-medium text-foreground/90 mb-2", children: message })
         ] }) }) })
       ] }) })
     }
@@ -16614,8 +16874,126 @@ var useChartClick = ({
   };
 };
 
+// src/components/ui/charts/hooks/useTimeSeriesRange.ts
+import { useState as useState43, useCallback as useCallback17, useEffect as useEffect33, useRef as useRef23 } from "react";
+function useTimeSeriesRange({
+  dataLength,
+  defaultStartIndex = 0,
+  defaultEndIndex,
+  onRangeChange
+}) {
+  const [startIndex, setStartIndex] = useState43(defaultStartIndex);
+  const [endIndex, setEndIndex] = useState43(
+    defaultEndIndex ?? Math.max(0, dataLength - 1)
+  );
+  const [isDragging, setIsDragging] = useState43(null);
+  const [dragStartX, setDragStartX] = useState43(0);
+  const [initialStartIndex, setInitialStartIndex] = useState43(0);
+  const [initialEndIndex, setInitialEndIndex] = useState43(0);
+  const brushRef = useRef23(null);
+  useEffect33(() => {
+    if (dataLength > 0) {
+      setStartIndex((prev) => Math.min(prev, dataLength - 1));
+      setEndIndex((prev) => {
+        if (prev >= dataLength - 2 || defaultEndIndex === void 0) {
+          return dataLength - 1;
+        }
+        return Math.min(prev, dataLength - 1);
+      });
+    }
+  }, [dataLength, defaultEndIndex]);
+  const handleRangeChange = useCallback17(
+    (newStart, newEnd) => {
+      const clampedStart = Math.max(0, Math.min(newStart, dataLength - 1));
+      const clampedEnd = Math.max(
+        clampedStart,
+        Math.min(newEnd, dataLength - 1)
+      );
+      setStartIndex(clampedStart);
+      setEndIndex(clampedEnd);
+      if (onRangeChange) {
+        onRangeChange(clampedStart, clampedEnd);
+      }
+    },
+    [dataLength, onRangeChange]
+  );
+  const handleMouseDown = useCallback17(
+    (e, type) => {
+      e.preventDefault();
+      setIsDragging(type);
+      setDragStartX(e.clientX);
+      setInitialStartIndex(startIndex);
+      setInitialEndIndex(endIndex);
+    },
+    [startIndex, endIndex]
+  );
+  const handleMouseMove = useCallback17(
+    (e) => {
+      if (!isDragging || !brushRef.current) return;
+      const brushWidth = brushRef.current.offsetWidth;
+      const deltaX = e.clientX - dragStartX;
+      const indexDelta = Math.round(deltaX / brushWidth * dataLength);
+      if (isDragging === "start") {
+        const newStart = Math.max(
+          0,
+          Math.min(initialStartIndex + indexDelta, endIndex - 1)
+        );
+        handleRangeChange(newStart, endIndex);
+      } else if (isDragging === "end") {
+        const newEnd = Math.max(
+          startIndex + 1,
+          Math.min(initialEndIndex + indexDelta, dataLength - 1)
+        );
+        handleRangeChange(startIndex, newEnd);
+      } else if (isDragging === "middle") {
+        const rangeSize = initialEndIndex - initialStartIndex;
+        let newStart = initialStartIndex + indexDelta;
+        let newEnd = initialEndIndex + indexDelta;
+        if (newStart < 0) {
+          newStart = 0;
+          newEnd = rangeSize;
+        } else if (newEnd >= dataLength) {
+          newEnd = dataLength - 1;
+          newStart = newEnd - rangeSize;
+        }
+        handleRangeChange(newStart, newEnd);
+      }
+    },
+    [
+      isDragging,
+      dragStartX,
+      dataLength,
+      startIndex,
+      endIndex,
+      initialStartIndex,
+      initialEndIndex,
+      handleRangeChange
+    ]
+  );
+  const handleMouseUp = useCallback17(() => {
+    setIsDragging(null);
+  }, []);
+  useEffect33(() => {
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      return () => {
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
+      };
+    }
+  }, [isDragging, handleMouseMove, handleMouseUp]);
+  return {
+    startIndex,
+    endIndex,
+    isDragging,
+    brushRef,
+    handleMouseDown
+  };
+}
+
 // src/components/ui/charts/Chart.tsx
-import { jsx as jsx96, jsxs as jsxs74 } from "react/jsx-runtime";
+import { jsx as jsx97, jsxs as jsxs75 } from "react/jsx-runtime";
 var DEFAULT_COLORS2 = ["#55af7d", "#8e68ff", "#2273e1"];
 var Chart = ({
   data,
@@ -16648,7 +17026,8 @@ var Chart = ({
   formatBR = false,
   legendUppercase = false,
   chartMargin,
-  isLoading = false
+  isLoading = false,
+  timeSeries
 }) => {
   const smartConfig = useMemo26(() => {
     const resolvedXAxisKey = typeof xAxis === "string" ? xAxis : xAxis && xAxis.dataKey || detectXAxis(data);
@@ -16688,15 +17067,33 @@ var Chart = ({
     onTooltipPositionChange,
     setActiveTooltips
   } = useChartTooltips(maxTooltips);
-  useEffect33(() => {
+  useEffect34(() => {
     if (highlightedSeries.size === 0 && showOnlyHighlighted) {
       setShowOnlyHighlighted(false);
     }
   }, [highlightedSeries, showOnlyHighlighted, setShowOnlyHighlighted]);
-  const processedData = data.map((item) => ({
-    ...item,
-    name: String(item[xAxisConfig.dataKey] || "N/A")
-  }));
+  const timeSeriesConfig = useMemo26(() => {
+    if (typeof timeSeries === "boolean") {
+      return timeSeries ? {} : void 0;
+    }
+    return timeSeries;
+  }, [timeSeries]);
+  const { startIndex, endIndex, brushRef, handleMouseDown } = useTimeSeriesRange({
+    dataLength: data.length,
+    defaultStartIndex: timeSeriesConfig?.start,
+    defaultEndIndex: timeSeriesConfig?.end,
+    onRangeChange: timeSeriesConfig?.onRangeChange
+  });
+  const processedData = useMemo26(() => {
+    const mapped = data.map((item) => ({
+      ...item,
+      name: String(item[xAxisConfig.dataKey] || "N/A")
+    }));
+    if (timeSeriesConfig) {
+      return mapped.slice(startIndex, endIndex + 1);
+    }
+    return mapped;
+  }, [data, xAxisConfig.dataKey, timeSeriesConfig, startIndex, endIndex]);
   const seriesOrder = [];
   if (series) {
     if (series.bar)
@@ -16785,7 +17182,7 @@ var Chart = ({
       setActiveTooltips
     }
   );
-  const getSeriesOpacity = useCallback17(
+  const getSeriesOpacity = useCallback18(
     (key) => {
       return highlightedSeries.size > 0 ? highlightedSeries.has(key) ? 1 : 0.25 : 1;
     },
@@ -16822,11 +17219,12 @@ var Chart = ({
   );
   const finalChartTopMargin = chartMargin?.top ?? (showLabels ? 48 : 20);
   const finalChartBottomMargin = (chartMargin?.bottom ?? 5) + (xAxisLabel ? 22 : 0) + (showLegend ? 36 : 0);
+  const HORIZONTAL_PADDING_CLASS = "px-20";
   const effectiveChartWidth = typeof width === "number" ? width : measuredWidth ? Math.max(0, measuredWidth - 32) : computedWidth;
   const chartInnerWidth = effectiveChartWidth - finalChartLeftMargin - finalChartRightMargin;
   const leftYAxisLabelDx = -Math.max(12, Math.round(yAxisTickWidth / 2));
   const rightYAxisLabelDx = Math.max(12, Math.round(finalChartRightMargin / 2));
-  const openTooltipForPeriod = useCallback17(
+  const openTooltipForPeriod = useCallback18(
     (periodName) => {
       if (!enableDraggableTooltips) return;
       const row = processedData.find((r) => String(r.name) === periodName);
@@ -16870,7 +17268,7 @@ var Chart = ({
   );
   if (!data && !isLoading) return null;
   if (isLoading) {
-    return /* @__PURE__ */ jsx96(
+    return /* @__PURE__ */ jsx97(
       NoData_default,
       {
         title,
@@ -16882,7 +17280,7 @@ var Chart = ({
     );
   }
   if (Array.isArray(data) && data.length === 0) {
-    return /* @__PURE__ */ jsx96(
+    return /* @__PURE__ */ jsx97(
       NoData_default,
       {
         title,
@@ -16891,67 +17289,87 @@ var Chart = ({
       }
     );
   }
-  return /* @__PURE__ */ jsx96("div", { ref: wrapperRef, className: "w-full overflow-hidden min-w-0", children: /* @__PURE__ */ jsxs74(
+  return /* @__PURE__ */ jsx97(
     "div",
     {
-      className: cn(
-        "rounded-lg bg-card relative w-full max-w-full min-w-0",
-        className
-      ),
-      children: [
-        title && /* @__PURE__ */ jsx96(
+      ref: wrapperRef,
+      className: cn("w-full overflow-hidden min-w-0 rounded-lg", className),
+      children: /* @__PURE__ */ jsxs75("div", { className: "rounded-lg bg-card relative w-full max-w-full min-w-0", children: [
+        title && /* @__PURE__ */ jsx97(
           "div",
           {
             className: cn(
-              "w-full flex items-center mt-[19px] ml-[90px]",
+              "w-full flex items-center mt-5",
+              HORIZONTAL_PADDING_CLASS,
               titlePosition === "center" && "justify-center",
               titlePosition === "right" && "justify-end",
               titlePosition === "left" && "justify-start"
             ),
-            children: /* @__PURE__ */ jsx96("div", { className: "text-[1.4rem] font-semibold text-foreground mb-3", children: title })
+            children: /* @__PURE__ */ jsxs75("div", { className: "text-[1.4rem] font-semibold text-foreground mb-3", children: [
+              title,
+              /* @__PURE__ */ jsx97(
+                "div",
+                {
+                  className: "absolute inset-0 flex items-center justify-center pointer-events-none z-50 select-text overflow-hidden",
+                  "aria-hidden": "true",
+                  children: /* @__PURE__ */ jsx97("div", { className: "text-[1.6rem] font-bold text-transparent selection:bg-primary selection:text-primary-foreground whitespace-nowrap", children: "Eduardo Ronchi de Araujo Desenvolvidor de Sistemas Junio" })
+                }
+              )
+            ] })
           }
         ),
-        allKeys.length > 0 && (enableHighlights || enableShowOnly) && /* @__PURE__ */ jsxs74("div", { className: "flex items-center w-[98%] ml-[90px] gap-2", children: [
-          enableHighlights && /* @__PURE__ */ jsx96(
-            Highlights_default,
-            {
-              allKeys,
-              mapperConfig,
-              finalColors,
-              highlightedSeries,
-              toggleHighlight,
-              containerWidth: chartInnerWidth
-            }
-          ),
-          enableShowOnly && /* @__PURE__ */ jsx96(
-            ShowOnly_default,
-            {
-              showOnlyHighlighted,
-              setShowOnlyHighlighted,
-              highlightedSeriesSize: highlightedSeries.size,
-              clearHighlights
-            }
-          ),
-          enablePeriodsDropdown && enableDraggableTooltips && /* @__PURE__ */ jsx96("div", { className: "ml-auto flex items-center", children: /* @__PURE__ */ jsx96(
-            PeriodsDropdown_default,
-            {
-              processedData,
-              onOpenPeriod: openTooltipForPeriod,
-              rightOffset: finalChartRightMargin,
-              activePeriods
-            }
-          ) })
-        ] }),
-        !(allKeys.length > 0 && (enableHighlights || enableShowOnly)) && enablePeriodsDropdown && enableDraggableTooltips && /* @__PURE__ */ jsx96(
+        allKeys.length > 0 && (enableHighlights || enableShowOnly) && /* @__PURE__ */ jsxs75(
           "div",
           {
-            className: "w-full flex justify-end",
+            className: cn(
+              "flex items-center gap-2 mb-2",
+              HORIZONTAL_PADDING_CLASS
+            ),
+            children: [
+              enableHighlights && /* @__PURE__ */ jsx97(
+                Highlights_default,
+                {
+                  allKeys,
+                  mapperConfig,
+                  finalColors,
+                  highlightedSeries,
+                  toggleHighlight,
+                  containerWidth: chartInnerWidth
+                }
+              ),
+              enableShowOnly && /* @__PURE__ */ jsx97(
+                ShowOnly_default,
+                {
+                  showOnlyHighlighted,
+                  setShowOnlyHighlighted,
+                  highlightedSeriesSize: highlightedSeries.size,
+                  clearHighlights
+                }
+              ),
+              enablePeriodsDropdown && enableDraggableTooltips && /* @__PURE__ */ jsx97("div", { className: "ml-auto flex items-center", children: /* @__PURE__ */ jsx97(
+                PeriodsDropdown_default,
+                {
+                  processedData,
+                  onOpenPeriod: openTooltipForPeriod,
+                  rightOffset: finalChartRightMargin,
+                  activePeriods
+                }
+              ) })
+            ]
+          }
+        ),
+        !(allKeys.length > 0 && (enableHighlights || enableShowOnly)) && enablePeriodsDropdown && enableDraggableTooltips && /* @__PURE__ */ jsx97(
+          "div",
+          {
+            className: cn(
+              "w-full flex justify-end mb-2",
+              HORIZONTAL_PADDING_CLASS
+            ),
             style: {
-              paddingLeft: `${CONTAINER_PADDING_LEFT + finalChartLeftMargin}px`,
               paddingRight: `${finalChartRightMargin}px`,
               maxWidth: `${chartInnerWidth}px`
             },
-            children: /* @__PURE__ */ jsx96(
+            children: /* @__PURE__ */ jsx97(
               PeriodsDropdown_default,
               {
                 processedData,
@@ -16961,8 +17379,8 @@ var Chart = ({
             )
           }
         ),
-        /* @__PURE__ */ jsx96(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs74(
-          ComposedChart,
+        /* @__PURE__ */ jsx97(ResponsiveContainer2, { width: "100%", height, children: /* @__PURE__ */ jsxs75(
+          ComposedChart2,
           {
             data: processedData,
             height,
@@ -16974,10 +17392,10 @@ var Chart = ({
             },
             onClick: handleChartClick,
             children: [
-              /* @__PURE__ */ jsx96("defs", { children: seriesOrder.filter((s) => s.type === "area").map((s) => {
+              /* @__PURE__ */ jsx97("defs", { children: seriesOrder.filter((s) => s.type === "area").map((s) => {
                 const key = s.key;
                 const color = finalColors[key];
-                return /* @__PURE__ */ jsxs74(
+                return /* @__PURE__ */ jsxs75(
                   "linearGradient",
                   {
                     id: `gradient-${key}`,
@@ -16986,14 +17404,14 @@ var Chart = ({
                     x2: "0",
                     y2: "0.8",
                     children: [
-                      /* @__PURE__ */ jsx96("stop", { offset: "0%", stopColor: color, stopOpacity: 0.8 }),
-                      /* @__PURE__ */ jsx96("stop", { offset: "90%", stopColor: color, stopOpacity: 0.1 })
+                      /* @__PURE__ */ jsx97("stop", { offset: "0%", stopColor: color, stopOpacity: 0.8 }),
+                      /* @__PURE__ */ jsx97("stop", { offset: "90%", stopColor: color, stopOpacity: 0.1 })
                     ]
                   },
                   `gradient-${key}`
                 );
               }) }),
-              showGrid && /* @__PURE__ */ jsx96(
+              showGrid && /* @__PURE__ */ jsx97(
                 CartesianGrid,
                 {
                   strokeDasharray: "3 3",
@@ -17001,8 +17419,8 @@ var Chart = ({
                   opacity: 0.5
                 }
               ),
-              /* @__PURE__ */ jsx96(
-                XAxis,
+              /* @__PURE__ */ jsx97(
+                XAxis2,
                 {
                   dataKey: xAxisConfig.dataKey,
                   stroke: "hsl(var(--muted-foreground))",
@@ -17028,8 +17446,8 @@ var Chart = ({
                   } : void 0
                 }
               ),
-              /* @__PURE__ */ jsx96(
-                YAxis,
+              /* @__PURE__ */ jsx97(
+                YAxis2,
                 {
                   yAxisId: "left",
                   width: yAxisTickWidth,
@@ -17054,7 +17472,7 @@ var Chart = ({
                   } : void 0
                 }
               ),
-              minLeftDataValue < 0 && /* @__PURE__ */ jsx96(
+              minLeftDataValue < 0 && /* @__PURE__ */ jsx97(
                 ReferenceLine,
                 {
                   y: 0,
@@ -17088,8 +17506,8 @@ var Chart = ({
                     return biaxialConfigNormalized.stroke[firstRightKey] || defaultRightColor;
                   return defaultRightColor;
                 })();
-                return /* @__PURE__ */ jsx96(
-                  YAxis,
+                return /* @__PURE__ */ jsx97(
+                  YAxis2,
                   {
                     yAxisId: "right",
                     width: finalChartRightMargin,
@@ -17117,10 +17535,10 @@ var Chart = ({
                   }
                 );
               })(),
-              showTooltip && /* @__PURE__ */ jsx96(
+              showTooltip && /* @__PURE__ */ jsx97(
                 Tooltip,
                 {
-                  content: showTooltipTotal ? /* @__PURE__ */ jsx96(
+                  content: showTooltipTotal ? /* @__PURE__ */ jsx97(
                     TooltipWithTotal_default,
                     {
                       finalColors,
@@ -17128,7 +17546,7 @@ var Chart = ({
                       categoryFormatter,
                       periodLabel
                     }
-                  ) : /* @__PURE__ */ jsx96(
+                  ) : /* @__PURE__ */ jsx97(
                     TooltipSimple_default,
                     {
                       finalColors,
@@ -17140,7 +17558,7 @@ var Chart = ({
                   cursor: { fill: "hsl(var(--muted))", opacity: 0.1 }
                 }
               ),
-              showLegend && /* @__PURE__ */ jsx96(
+              showLegend && /* @__PURE__ */ jsx97(
                 Legend,
                 {
                   wrapperStyle: {
@@ -17153,7 +17571,7 @@ var Chart = ({
                     const key = String(value);
                     const label = mapperConfig[key]?.label ?? labelMap?.[key] ?? formatFieldName(key);
                     const displayLabel = legendUppercase ? label.toUpperCase() : label;
-                    return /* @__PURE__ */ jsx96("span", { className: "tracking-[0]", children: displayLabel });
+                    return /* @__PURE__ */ jsx97("span", { className: "tracking-[0]", children: displayLabel });
                   }
                 }
               ),
@@ -17171,8 +17589,8 @@ var Chart = ({
                   }
                 }
                 if (s.type === "bar") {
-                  return /* @__PURE__ */ jsx96(
-                    Bar,
+                  return /* @__PURE__ */ jsx97(
+                    Bar2,
                     {
                       dataKey: key,
                       yAxisId: rightKeys.includes(key) ? "right" : "left",
@@ -17182,7 +17600,7 @@ var Chart = ({
                       onClick: handleBarClick,
                       className: "cursor-pointer",
                       style: { opacity: getSeriesOpacity(key) },
-                      activeBar: /* @__PURE__ */ jsx96(
+                      activeBar: /* @__PURE__ */ jsx97(
                         Rectangle,
                         {
                           fill: color,
@@ -17191,7 +17609,7 @@ var Chart = ({
                           opacity: 0.8
                         }
                       ),
-                      children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ jsx96(
+                      children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ jsx97(
                         LabelList,
                         {
                           dataKey: key,
@@ -17218,8 +17636,8 @@ var Chart = ({
                   );
                 }
                 if (s.type === "line") {
-                  return /* @__PURE__ */ jsx96(
-                    Line,
+                  return /* @__PURE__ */ jsx97(
+                    Line2,
                     {
                       dataKey: key,
                       yAxisId: rightKeys.includes(key) ? "right" : "left",
@@ -17231,7 +17649,7 @@ var Chart = ({
                       onClick: handleSeriesClick,
                       className: "cursor-pointer pointer-events-auto",
                       style: { opacity: getSeriesOpacity(key) },
-                      children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ jsx96(
+                      children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ jsx97(
                         LabelList,
                         {
                           dataKey: key,
@@ -17249,8 +17667,8 @@ var Chart = ({
                   );
                 }
                 if (s.type === "area") {
-                  return /* @__PURE__ */ jsx96(
-                    Area,
+                  return /* @__PURE__ */ jsx97(
+                    Area2,
                     {
                       type: "monotone",
                       dataKey: key,
@@ -17269,7 +17687,7 @@ var Chart = ({
                         stroke: "hsl(var(--background))",
                         strokeWidth: 2
                       },
-                      children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ jsx96(
+                      children: showLabels && highlightedSeries.size === 0 || highlightedSeries.has(key) ? /* @__PURE__ */ jsx97(
                         LabelList,
                         {
                           dataKey: key,
@@ -17291,7 +17709,7 @@ var Chart = ({
             ]
           }
         ) }),
-        enableDraggableTooltips && activeTooltips.map((tooltip) => /* @__PURE__ */ jsx96(
+        enableDraggableTooltips && activeTooltips.map((tooltip) => /* @__PURE__ */ jsx97(
           DraggableTooltip_default,
           {
             id: tooltip.id,
@@ -17316,7 +17734,7 @@ var Chart = ({
           },
           tooltip.id
         )),
-        enableDraggableTooltips && activeTooltips.length > 1 && /* @__PURE__ */ jsx96(
+        enableDraggableTooltips && activeTooltips.length > 1 && /* @__PURE__ */ jsx97(
           CloseAllButton_default,
           {
             count: activeTooltips.length,
@@ -17324,27 +17742,49 @@ var Chart = ({
             position: "top-center",
             variant: "floating"
           }
+        ),
+        timeSeriesConfig && /* @__PURE__ */ jsx97(
+          Brush_default,
+          {
+            data,
+            startIndex,
+            endIndex,
+            onMouseDown: handleMouseDown,
+            brushRef,
+            xAxisKey: xAxisConfig.dataKey,
+            seriesOrder,
+            finalColors,
+            brushHeight: timeSeriesConfig.height,
+            brushColor: timeSeriesConfig.brushColor,
+            miniChartOpacity: timeSeriesConfig.miniChartOpacity,
+            showGrid,
+            gridColor,
+            margin: {
+              left: finalChartLeftMargin,
+              right: finalChartRightMargin
+            }
+          }
         )
-      ]
+      ] })
     }
-  ) });
+  );
 };
 var Chart_default = Chart;
 
 // src/components/ui/charts/BarChart.tsx
-import { useState as useState43, useEffect as useEffect34, useCallback as useCallback18, useMemo as useMemo27 } from "react";
+import { useState as useState44, useEffect as useEffect35, useCallback as useCallback19, useMemo as useMemo27 } from "react";
 import {
   BarChart as RechartsBarChart,
-  Bar as Bar2,
+  Bar as Bar3,
   Rectangle as Rectangle2,
-  XAxis as XAxis2,
-  YAxis as YAxis2,
+  XAxis as XAxis3,
+  YAxis as YAxis3,
   CartesianGrid as CartesianGrid2,
   Tooltip as Tooltip2,
   Legend as Legend2,
   LabelList as LabelList2
 } from "recharts";
-import { jsx as jsx97, jsxs as jsxs75 } from "react/jsx-runtime";
+import { jsx as jsx98, jsxs as jsxs76 } from "react/jsx-runtime";
 var DEFAULT_COLORS3 = ["#55af7d", "#8e68ff", "#2273e1"];
 var BarChart = ({
   data,
@@ -17424,14 +17864,14 @@ var BarChart = ({
     return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
   }, [data, xAxis, mapper, yAxis, autoDetect, labelMap]);
   const { xAxisConfig, mapperConfig } = smartConfig;
-  const [activeTooltips, setActiveTooltips] = useState43([]);
-  const [isDragging, setIsDragging] = useState43(null);
-  const [dragOffset, setDragOffset] = useState43({
+  const [activeTooltips, setActiveTooltips] = useState44([]);
+  const [isDragging, setIsDragging] = useState44(null);
+  const [dragOffset, setDragOffset] = useState44({
     x: 0,
     y: 0
   });
-  const [globalTooltipCount, setGlobalTooltipCount] = useState43(0);
-  const [alignmentGuides, setAlignmentGuides] = useState43([]);
+  const [globalTooltipCount, setGlobalTooltipCount] = useState44(0);
+  const [alignmentGuides, setAlignmentGuides] = useState44([]);
   const processedData = data.map((item) => ({
     ...item,
     name: String(item[xAxisConfig.dataKey] || "N/A")
@@ -17508,7 +17948,7 @@ var BarChart = ({
   const GUIDE_THRESHOLD2 = 60;
   const STRONG_SNAP_THRESHOLD2 = 35;
   const PRECISION_SNAP_THRESHOLD2 = 8;
-  const updateAlignmentGuides = useCallback18(
+  const updateAlignmentGuides = useCallback19(
     (draggedTooltipId, currentPosition) => {
       if (!isDragging) return;
       const getAllTooltips = () => {
@@ -17572,7 +18012,7 @@ var BarChart = ({
     },
     [isDragging, activeTooltips]
   );
-  const snapToGuides = useCallback18(
+  const snapToGuides = useCallback19(
     (position) => {
       const snappedPosition = { ...position };
       let hasSnapped = false;
@@ -17634,7 +18074,7 @@ var BarChart = ({
     setIsDragging(tooltipId);
     setDragOffset({ x: offsetX, y: offsetY });
   };
-  useEffect34(() => {
+  useEffect35(() => {
     let rafId;
     let lastMousePosition = { x: 0, y: 0 };
     const handleGlobalMouseMove = (e) => {
@@ -17692,7 +18132,7 @@ var BarChart = ({
     updateAlignmentGuides,
     snapToGuides
   ]);
-  useEffect34(() => {
+  useEffect35(() => {
     const handleCloseAllTooltips = () => {
       setActiveTooltips([]);
       setGlobalTooltipCount(0);
@@ -17702,7 +18142,7 @@ var BarChart = ({
       window.removeEventListener("closeAllTooltips", handleCloseAllTooltips);
     };
   }, []);
-  useEffect34(() => {
+  useEffect35(() => {
     const handleTooltipCountRequest = () => {
       window.dispatchEvent(
         new CustomEvent("tooltipCountResponse", {
@@ -17741,7 +18181,7 @@ var BarChart = ({
       );
     };
   }, [activeTooltips]);
-  useEffect34(() => {
+  useEffect35(() => {
     if (isDragging) return;
     let totalCount = 0;
     const handleCountResponse = (event) => {
@@ -17765,25 +18205,25 @@ var BarChart = ({
     label
   }) => {
     if (!active || !payload) return null;
-    return /* @__PURE__ */ jsxs75("div", { className: "bg-card border border-border rounded-lg p-3 shadow-lg", children: [
-      /* @__PURE__ */ jsx97("p", { className: "font-medium text-foreground mb-2", children: label }),
+    return /* @__PURE__ */ jsxs76("div", { className: "bg-card border border-border rounded-lg p-3 shadow-lg", children: [
+      /* @__PURE__ */ jsx98("p", { className: "font-medium text-foreground mb-2", children: label }),
       payload.map(
-        (entry, index) => /* @__PURE__ */ jsxs75("div", { className: "flex items-center gap-2 text-sm", children: [
-          /* @__PURE__ */ jsx97(
+        (entry, index) => /* @__PURE__ */ jsxs76("div", { className: "flex items-center gap-2 text-sm", children: [
+          /* @__PURE__ */ jsx98(
             "div",
             {
               className: "w-3 h-3 rounded-sm",
               style: { backgroundColor: entry.color }
             }
           ),
-          /* @__PURE__ */ jsxs75("span", { className: "text-muted-foreground", children: [
+          /* @__PURE__ */ jsxs76("span", { className: "text-muted-foreground", children: [
             entry.name,
             ":"
           ] }),
-          /* @__PURE__ */ jsx97("span", { className: "text-foreground font-medium", children: entry.value?.toLocaleString("pt-BR") })
+          /* @__PURE__ */ jsx98("span", { className: "text-foreground font-medium", children: entry.value?.toLocaleString("pt-BR") })
         ] }, index)
       ),
-      /* @__PURE__ */ jsx97("p", { className: "text-xs text-muted-foreground mt-1", children: "Clique para fixar este tooltip" })
+      /* @__PURE__ */ jsx98("p", { className: "text-xs text-muted-foreground mt-1", children: "Clique para fixar este tooltip" })
     ] });
   };
   const getTitleClassName = (position) => {
@@ -17797,7 +18237,7 @@ var BarChart = ({
         return `${baseClasses} text-left`;
     }
   };
-  return /* @__PURE__ */ jsxs75(
+  return /* @__PURE__ */ jsxs76(
     "div",
     {
       className: cn("rounded-lg bg-card p-4 relative", className),
@@ -17806,8 +18246,8 @@ var BarChart = ({
         maxWidth: "100%"
       },
       children: [
-        title && /* @__PURE__ */ jsx97("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ jsx97("h3", { className: getTitleClassName(titlePosition), children: title }) }),
-        /* @__PURE__ */ jsxs75(
+        title && /* @__PURE__ */ jsx98("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ jsx98("h3", { className: getTitleClassName(titlePosition), children: title }) }),
+        /* @__PURE__ */ jsxs76(
           RechartsBarChart,
           {
             data: processedData,
@@ -17816,7 +18256,7 @@ var BarChart = ({
             margin: resolveChartMargins(margins, chartMargins, showLabels),
             onClick: handleChartClick,
             children: [
-              showGrid && /* @__PURE__ */ jsx97(
+              showGrid && /* @__PURE__ */ jsx98(
                 CartesianGrid2,
                 {
                   strokeDasharray: "3 3",
@@ -17824,8 +18264,8 @@ var BarChart = ({
                   opacity: 0.5
                 }
               ),
-              /* @__PURE__ */ jsx97(
-                XAxis2,
+              /* @__PURE__ */ jsx98(
+                XAxis3,
                 {
                   dataKey: xAxisConfig.dataKey,
                   stroke: "hsl(var(--muted-foreground))",
@@ -17835,8 +18275,8 @@ var BarChart = ({
                   tickFormatter: xAxisConfig.valueFormatter
                 }
               ),
-              /* @__PURE__ */ jsx97(
-                YAxis2,
+              /* @__PURE__ */ jsx98(
+                YAxis3,
                 {
                   stroke: "hsl(var(--muted-foreground))",
                   fontSize: 12,
@@ -17847,14 +18287,14 @@ var BarChart = ({
                   tickCount: 6
                 }
               ),
-              showTooltip && /* @__PURE__ */ jsx97(
+              showTooltip && /* @__PURE__ */ jsx98(
                 Tooltip2,
                 {
-                  content: /* @__PURE__ */ jsx97(CustomTooltip, {}),
+                  content: /* @__PURE__ */ jsx98(CustomTooltip, {}),
                   cursor: { fill: "hsl(var(--muted))", opacity: 0.1 }
                 }
               ),
-              showLegend && /* @__PURE__ */ jsx97(
+              showLegend && /* @__PURE__ */ jsx98(
                 Legend2,
                 {
                   wrapperStyle: {
@@ -17865,8 +18305,8 @@ var BarChart = ({
               ),
               dataKeys.map((key) => {
                 const fieldConfig = mapperConfig[key];
-                return /* @__PURE__ */ jsx97(
-                  Bar2,
+                return /* @__PURE__ */ jsx98(
+                  Bar3,
                   {
                     dataKey: key,
                     name: fieldConfig?.label || key,
@@ -17874,7 +18314,7 @@ var BarChart = ({
                     radius: [4, 4, 0, 0],
                     onClick: handleBarClick,
                     style: { cursor: "pointer" },
-                    activeBar: /* @__PURE__ */ jsx97(
+                    activeBar: /* @__PURE__ */ jsx98(
                       Rectangle2,
                       {
                         fill: finalColors[key],
@@ -17883,7 +18323,7 @@ var BarChart = ({
                         opacity: 0.8
                       }
                     ),
-                    children: showLabels && /* @__PURE__ */ jsx97(
+                    children: showLabels && /* @__PURE__ */ jsx98(
                       LabelList2,
                       {
                         dataKey: key,
@@ -17920,8 +18360,8 @@ var BarChart = ({
             guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
             guide.targetTooltip.top + guide.targetTooltip.height / 2
           );
-          return /* @__PURE__ */ jsxs75("div", { children: [
-            /* @__PURE__ */ jsx97(
+          return /* @__PURE__ */ jsxs76("div", { children: [
+            /* @__PURE__ */ jsx98(
               "div",
               {
                 className: "fixed pointer-events-none z-30",
@@ -17940,7 +18380,7 @@ var BarChart = ({
                 }
               }
             ),
-            /* @__PURE__ */ jsx97(
+            /* @__PURE__ */ jsx98(
               "div",
               {
                 className: "fixed pointer-events-none z-31",
@@ -17956,7 +18396,7 @@ var BarChart = ({
                 }
               }
             ),
-            /* @__PURE__ */ jsx97(
+            /* @__PURE__ */ jsx98(
               "div",
               {
                 className: "fixed pointer-events-none z-31",
@@ -17974,7 +18414,7 @@ var BarChart = ({
             )
           ] }, index);
         }),
-        activeTooltips.map((tooltip, index) => /* @__PURE__ */ jsx97(
+        activeTooltips.map((tooltip, index) => /* @__PURE__ */ jsx98(
           DraggableTooltip_default,
           {
             id: tooltip.id,
@@ -18007,18 +18447,18 @@ var BarChart = ({
 var BarChart_default = BarChart;
 
 // src/components/ui/charts/LineChart.tsx
-import { useState as useState44, useEffect as useEffect35, useCallback as useCallback19, useMemo as useMemo28 } from "react";
+import { useState as useState45, useEffect as useEffect36, useCallback as useCallback20, useMemo as useMemo28 } from "react";
 import {
   LineChart as RechartsLineChart,
-  Line as Line2,
-  XAxis as XAxis3,
-  YAxis as YAxis3,
+  Line as Line3,
+  XAxis as XAxis4,
+  YAxis as YAxis4,
   CartesianGrid as CartesianGrid3,
   Tooltip as Tooltip3,
   Legend as Legend3,
   LabelList as LabelList3
 } from "recharts";
-import { jsx as jsx98, jsxs as jsxs76 } from "react/jsx-runtime";
+import { jsx as jsx99, jsxs as jsxs77 } from "react/jsx-runtime";
 var defaultData = [
   { name: "A", value: 100 },
   { name: "B", value: 200 },
@@ -18050,14 +18490,14 @@ var CustomLineChart = ({
     containerPaddingLeft,
     16
   );
-  const [activeTooltips, setActiveTooltips] = useState44([]);
-  const [isDragging, setIsDragging] = useState44(null);
-  const [dragOffset, setDragOffset] = useState44({
+  const [activeTooltips, setActiveTooltips] = useState45([]);
+  const [isDragging, setIsDragging] = useState45(null);
+  const [dragOffset, setDragOffset] = useState45({
     x: 0,
     y: 0
   });
-  const [globalTooltipCount, setGlobalTooltipCount] = useState44(0);
-  const [alignmentGuides, setAlignmentGuides] = useState44([]);
+  const [globalTooltipCount, setGlobalTooltipCount] = useState45(0);
+  const [alignmentGuides, setAlignmentGuides] = useState45([]);
   const generateColors = (dataKeys2) => {
     const colorMap = {};
     const allColors = generateAdditionalColors(colors2, dataKeys2.length);
@@ -18117,7 +18557,7 @@ var CustomLineChart = ({
         setActiveTooltips((prev) => [...prev, newTooltip]);
       }
     };
-    return /* @__PURE__ */ jsx98(
+    return /* @__PURE__ */ jsx99(
       "circle",
       {
         cx,
@@ -18159,10 +18599,10 @@ var CustomLineChart = ({
   const handleChartBackgroundClick = () => {
     setActiveTooltips([]);
   };
-  const handleCloseAllTooltips = useCallback19(() => {
+  const handleCloseAllTooltips = useCallback20(() => {
     window.dispatchEvent(new CustomEvent("closeAllTooltips"));
   }, []);
-  const updateAlignmentGuides = useCallback19(
+  const updateAlignmentGuides = useCallback20(
     (draggedTooltipId, draggedPosition) => {
       const SNAP_THRESHOLD = 15;
       const draggedTooltip = activeTooltips.find(
@@ -18243,7 +18683,7 @@ var CustomLineChart = ({
     },
     [activeTooltips]
   );
-  const snapToGuides = useCallback19(
+  const snapToGuides = useCallback20(
     (position) => {
       const SNAP_DISTANCE = 10;
       const snappedPosition = { ...position };
@@ -18271,7 +18711,7 @@ var CustomLineChart = ({
     setIsDragging(tooltipId);
     setDragOffset({ x: offsetX, y: offsetY });
   };
-  useEffect35(() => {
+  useEffect36(() => {
     let rafId;
     let lastMousePosition = { x: 0, y: 0 };
     const handleGlobalMouseMove = (e) => {
@@ -18318,7 +18758,7 @@ var CustomLineChart = ({
     updateAlignmentGuides,
     snapToGuides
   ]);
-  useEffect35(() => {
+  useEffect36(() => {
     const handleCloseAllTooltips2 = () => {
       setActiveTooltips([]);
       setGlobalTooltipCount(0);
@@ -18328,7 +18768,7 @@ var CustomLineChart = ({
       window.removeEventListener("closeAllTooltips", handleCloseAllTooltips2);
     };
   }, []);
-  useEffect35(() => {
+  useEffect36(() => {
     const handleTooltipCountRequest = () => {
       window.dispatchEvent(
         new CustomEvent("tooltipCountResponse", {
@@ -18372,7 +18812,7 @@ var CustomLineChart = ({
       );
     };
   }, [activeTooltips]);
-  useEffect35(() => {
+  useEffect36(() => {
     if (isDragging) return;
     let totalCount = 0;
     const handleCountResponse = (event) => {
@@ -18400,7 +18840,7 @@ var CustomLineChart = ({
         return "text-left";
     }
   };
-  return /* @__PURE__ */ jsx98("div", { className: cn("relative", className), children: /* @__PURE__ */ jsxs76(
+  return /* @__PURE__ */ jsx99("div", { className: cn("relative", className), children: /* @__PURE__ */ jsxs77(
     "div",
     {
       className: "rounded-lg bg-card p-4 relative border border-border",
@@ -18410,8 +18850,8 @@ var CustomLineChart = ({
       },
       onClick: handleChartBackgroundClick,
       children: [
-        title && /* @__PURE__ */ jsx98("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ jsx98("div", { className: cn("mb-4", getTitleClass()), children: /* @__PURE__ */ jsx98("h3", { className: "text-lg font-semibold text-foreground", children: title }) }) }),
-        /* @__PURE__ */ jsxs76(
+        title && /* @__PURE__ */ jsx99("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ jsx99("div", { className: cn("mb-4", getTitleClass()), children: /* @__PURE__ */ jsx99("h3", { className: "text-lg font-semibold text-foreground", children: title }) }) }),
+        /* @__PURE__ */ jsxs77(
           RechartsLineChart,
           {
             data,
@@ -18420,7 +18860,7 @@ var CustomLineChart = ({
             margin: resolveChartMargins(margins, chartMargins, showLabels),
             onClick: handleChartClick,
             children: [
-              showGrid && /* @__PURE__ */ jsx98(
+              showGrid && /* @__PURE__ */ jsx99(
                 CartesianGrid3,
                 {
                   strokeDasharray: "3 3",
@@ -18428,16 +18868,16 @@ var CustomLineChart = ({
                   opacity: 0.3
                 }
               ),
-              /* @__PURE__ */ jsx98(
-                XAxis3,
+              /* @__PURE__ */ jsx99(
+                XAxis4,
                 {
                   dataKey: "name",
                   className: "fill-muted-foreground text-xs",
                   fontSize: 12
                 }
               ),
-              /* @__PURE__ */ jsx98(
-                YAxis3,
+              /* @__PURE__ */ jsx99(
+                YAxis4,
                 {
                   className: "fill-muted-foreground text-xs",
                   fontSize: 12,
@@ -18446,8 +18886,8 @@ var CustomLineChart = ({
                   tickCount: 6
                 }
               ),
-              showTooltip && /* @__PURE__ */ jsx98(Tooltip3, { content: () => null }),
-              showLegend && /* @__PURE__ */ jsx98(
+              showTooltip && /* @__PURE__ */ jsx99(Tooltip3, { content: () => null }),
+              showLegend && /* @__PURE__ */ jsx99(
                 Legend3,
                 {
                   wrapperStyle: {
@@ -18456,16 +18896,16 @@ var CustomLineChart = ({
                   }
                 }
               ),
-              dataKeys.map((key) => /* @__PURE__ */ jsx98(
-                Line2,
+              dataKeys.map((key) => /* @__PURE__ */ jsx99(
+                Line3,
                 {
                   type: "monotone",
                   dataKey: key,
                   stroke: finalColors[key],
                   strokeWidth,
                   dot: showDots ? { r: 4, cursor: "pointer" } : false,
-                  activeDot: (props) => /* @__PURE__ */ jsx98(ClickableDot, { ...props, dataKey: key }),
-                  children: showLabels && /* @__PURE__ */ jsx98(
+                  activeDot: (props) => /* @__PURE__ */ jsx99(ClickableDot, { ...props, dataKey: key }),
+                  children: showLabels && /* @__PURE__ */ jsx99(
                     LabelList3,
                     {
                       dataKey: key,
@@ -18502,8 +18942,8 @@ var CustomLineChart = ({
             guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
             guide.targetTooltip.top + guide.targetTooltip.height / 2
           );
-          return /* @__PURE__ */ jsxs76("div", { children: [
-            /* @__PURE__ */ jsx98(
+          return /* @__PURE__ */ jsxs77("div", { children: [
+            /* @__PURE__ */ jsx99(
               "div",
               {
                 className: "fixed pointer-events-none z-30",
@@ -18522,7 +18962,7 @@ var CustomLineChart = ({
                 }
               }
             ),
-            /* @__PURE__ */ jsx98(
+            /* @__PURE__ */ jsx99(
               "div",
               {
                 className: "fixed pointer-events-none z-31",
@@ -18538,7 +18978,7 @@ var CustomLineChart = ({
                 }
               }
             ),
-            /* @__PURE__ */ jsx98(
+            /* @__PURE__ */ jsx99(
               "div",
               {
                 className: "fixed pointer-events-none z-31",
@@ -18556,7 +18996,7 @@ var CustomLineChart = ({
             )
           ] }, index);
         }),
-        activeTooltips.map((tooltip, index) => /* @__PURE__ */ jsx98(
+        activeTooltips.map((tooltip, index) => /* @__PURE__ */ jsx99(
           DraggableTooltip_default,
           {
             id: tooltip.id,
@@ -18591,11 +19031,11 @@ import {
   PieChart as RechartsPieChart,
   Pie,
   Cell,
-  ResponsiveContainer as ResponsiveContainer2,
+  ResponsiveContainer as ResponsiveContainer3,
   Tooltip as Tooltip4,
   Legend as Legend4
 } from "recharts";
-import { jsx as jsx99, jsxs as jsxs77 } from "react/jsx-runtime";
+import { jsx as jsx100, jsxs as jsxs78 } from "react/jsx-runtime";
 var defaultData2 = [
   { name: "Vendas", value: 4e3 },
   { name: "Marketing", value: 3e3 },
@@ -18633,7 +19073,7 @@ var renderCustomizedLabel = ({
   const radius = innerRadius + (outerRadius - innerRadius) * 0.5;
   const x = cx + radius * Math.cos(-midAngle * RADIAN);
   const y = cy + radius * Math.sin(-midAngle * RADIAN);
-  return /* @__PURE__ */ jsx99(
+  return /* @__PURE__ */ jsx100(
     "text",
     {
       x,
@@ -18662,8 +19102,8 @@ var CustomPieChart = ({
   centerY = "50%"
 }) => {
   const finalColors = colors2 || DEFAULT_COLORS5;
-  return /* @__PURE__ */ jsx99("div", { className: cn("w-full rounded-lg bg-card p-4", className), children: /* @__PURE__ */ jsx99(ResponsiveContainer2, { width, height, children: /* @__PURE__ */ jsxs77(RechartsPieChart, { children: [
-    /* @__PURE__ */ jsx99(
+  return /* @__PURE__ */ jsx100("div", { className: cn("w-full rounded-lg bg-card p-4", className), children: /* @__PURE__ */ jsx100(ResponsiveContainer3, { width, height, children: /* @__PURE__ */ jsxs78(RechartsPieChart, { children: [
+    /* @__PURE__ */ jsx100(
       Pie,
       {
         data,
@@ -18675,7 +19115,7 @@ var CustomPieChart = ({
         innerRadius,
         fill: "#8884d8",
         dataKey: "value",
-        children: data.map((entry, index) => /* @__PURE__ */ jsx99(
+        children: data.map((entry, index) => /* @__PURE__ */ jsx100(
           Cell,
           {
             fill: finalColors[index % finalColors.length]
@@ -18684,7 +19124,7 @@ var CustomPieChart = ({
         ))
       }
     ),
-    showTooltip && /* @__PURE__ */ jsx99(
+    showTooltip && /* @__PURE__ */ jsx100(
       Tooltip4,
       {
         contentStyle: {
@@ -18695,25 +19135,71 @@ var CustomPieChart = ({
         }
       }
     ),
-    showLegend && /* @__PURE__ */ jsx99(Legend4, {})
+    showLegend && /* @__PURE__ */ jsx100(Legend4, {})
   ] }) }) });
 };
 var PieChart_default = CustomPieChart;
 
+// src/components/ui/charts/TimeSeries.tsx
+import { jsx as jsx101 } from "react/jsx-runtime";
+var TimeSeries = ({
+  data,
+  xAxis,
+  chartHeight = 350,
+  height,
+  brushHeight,
+  className,
+  start,
+  end,
+  defaultStartIndex,
+  defaultEndIndex,
+  onRangeChange,
+  brushColor,
+  brushStroke,
+  miniChartOpacity = 0.2,
+  ...rest
+}) => {
+  const brushHeightValue = brushHeight ?? height ?? 60;
+  const startIndex = defaultStartIndex ?? start ?? 0;
+  const endIndex = defaultEndIndex ?? end;
+  return /* @__PURE__ */ jsx101("div", { className: cn("w-full flex flex-col", className), children: /* @__PURE__ */ jsx101(
+    Chart_default,
+    {
+      ...rest,
+      data,
+      xAxis,
+      height: chartHeight + brushHeightValue + 40,
+      timeSeries: {
+        start: startIndex,
+        end: endIndex,
+        onRangeChange,
+        height: brushHeightValue,
+        brushColor,
+        brushStroke,
+        miniChartOpacity
+      }
+    }
+  ) });
+};
+var TimeSeries_default = TimeSeries;
+
 // src/components/ui/LeaderBoard.tsx
-import { CaretUpDownIcon as CaretUpDownIcon3 } from "@phosphor-icons/react";
-import { useState as useState45 } from "react";
+import { CaretUpDownIcon as CaretUpDownIcon3, MagnifyingGlassIcon as MagnifyingGlassIcon3 } from "@phosphor-icons/react";
+import { useState as useState46 } from "react";
 import { motion as motion22 } from "framer-motion";
-import { jsx as jsx100, jsxs as jsxs78 } from "react/jsx-runtime";
+import { jsx as jsx102, jsxs as jsxs79 } from "react/jsx-runtime";
 function Leaderboard({
   items,
   order: initialOrder = "desc",
   title = "LeaderBoard",
   className,
   isLoading = false,
-  legend
+  legend,
+  best = false,
+  worst = false
 }) {
-  const [order, setOrder] = useState45(initialOrder);
+  const [order, setOrder] = useState46(initialOrder);
+  const [searchTerm, setSearchTerm] = useState46("");
   const mockData = [
     { name: "Ana", value: 92 },
     { name: "Bruno", value: 81 },
@@ -18727,7 +19213,10 @@ function Leaderboard({
     { name: "Jo\xE3o", value: 18 }
   ];
   const data = items ?? mockData;
-  const sortedData = [...data].sort((a, b) => {
+  const filteredData = data.filter(
+    (item) => item.name.toLowerCase().includes(searchTerm.toLowerCase())
+  );
+  const sortedData = [...filteredData].sort((a, b) => {
     const aValue = typeof a.value === "string" ? parseFloat(a.value) || a.value : a.value;
     const bValue = typeof b.value === "string" ? parseFloat(b.value) || b.value : b.value;
     if (typeof aValue === "number" && typeof bValue === "number") {
@@ -18739,57 +19228,87 @@ function Leaderboard({
     if (typeof aValue === "number") return order === "desc" ? -1 : 1;
     return order === "desc" ? 1 : -1;
   });
-  const getBadgeColor = (value) => {
+  const getBadgeColor = (value, index, total) => {
+    if (best || worst) {
+      const third = total / 3;
+      if (best) {
+        if (index < third) return "green";
+        if (index < 2 * third) return "yellow";
+        return "red";
+      }
+      if (worst) {
+        if (index < third) return "red";
+        if (index < 2 * third) return "yellow";
+        return "green";
+      }
+    }
     const numValue = typeof value === "string" ? parseFloat(value) : value;
     if (isNaN(numValue)) return "green";
     if (numValue >= 75) return "red";
     if (numValue >= 25) return "yellow";
     return "green";
   };
-  return /* @__PURE__ */ jsxs78(
+  return /* @__PURE__ */ jsxs79(
     "div",
     {
-      className: `border rounded-xl flex flex-col max-h-80 w-96 ${className}`,
+      className: `border rounded-xl flex flex-col max-h-80 w-96  ${className}`,
       children: [
-        /* @__PURE__ */ jsxs78("div", { className: "flex items-center justify-between py-2 px-4 border-b flex-shrink-0 gap-3", children: [
-          /* @__PURE__ */ jsx100("h2", { className: "text-lg font-semibold px-1", children: title }),
-          /* @__PURE__ */ jsx100(
+        /* @__PURE__ */ jsxs79("div", { className: "flex items-center justify-between py-2 px-4 border-b flex-shrink-0 gap-3 ", children: [
+          /* @__PURE__ */ jsx102("h2", { className: "text-lg font-semibold px-1 whitespace-nowrap", children: title }),
+          /* @__PURE__ */ jsx102("div", { className: "flex-1 max-w-[200px]", children: /* @__PURE__ */ jsx102(
+            InputBase,
+            {
+              value: searchTerm,
+              onChange: (e) => setSearchTerm(e.target.value),
+              placeholder: "Pesquisar...",
+              leftIcon: /* @__PURE__ */ jsx102(MagnifyingGlassIcon3, { size: 16 }),
+              className: "h-8 py-1"
+            }
+          ) }),
+          /* @__PURE__ */ jsx102(
             ButtonBase,
             {
               size: "icon",
-              variant: "ghost",
+              variant: "outline",
               onClick: () => setOrder(order === "desc" ? "asc" : "desc"),
               disabled: isLoading || sortedData.length === 0,
-              children: /* @__PURE__ */ jsx100(CaretUpDownIcon3, {})
+              children: /* @__PURE__ */ jsx102(
+                motion22.div,
+                {
+                  animate: { rotate: order === "asc" ? 180 : 0 },
+                  transition: { type: "spring", stiffness: 300, damping: 20 },
+                  children: /* @__PURE__ */ jsx102(CaretUpDownIcon3, {})
+                }
+              )
             }
           )
         ] }),
-        /* @__PURE__ */ jsx100("div", { className: "overflow-y-auto flex-1", children: isLoading ? /* @__PURE__ */ jsx100("div", { className: "p-4 space-y-3", children: Array.from({ length: 5 }).map((_, idx) => /* @__PURE__ */ jsxs78("div", { className: "flex items-center justify-between p-1", children: [
-          /* @__PURE__ */ jsxs78("div", { className: "flex items-center gap-3 flex-1", children: [
-            /* @__PURE__ */ jsx100(SkeletonBase, { className: "w-8 h-8 rounded-full" }),
-            /* @__PURE__ */ jsx100(SkeletonBase, { className: "h-4 w-36" })
+        /* @__PURE__ */ jsx102("div", { className: "overflow-y-auto flex-1 [&::-webkit-scrollbar]:w-1.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-muted-foreground/20 [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-muted-foreground/40 transition-colors", children: isLoading ? /* @__PURE__ */ jsx102("div", { className: "p-4 space-y-3", children: Array.from({ length: 5 }).map((_, idx) => /* @__PURE__ */ jsxs79("div", { className: "flex items-center justify-between p-1", children: [
+          /* @__PURE__ */ jsxs79("div", { className: "flex items-center gap-3 flex-1", children: [
+            /* @__PURE__ */ jsx102(SkeletonBase, { className: "w-8 h-8 rounded-full" }),
+            /* @__PURE__ */ jsx102(SkeletonBase, { className: "h-4 w-36 rounded-full" })
           ] }),
-          /* @__PURE__ */ jsx100(SkeletonBase, { className: "h-6 w-12 rounded-full" })
-        ] }, idx)) }) : sortedData.length === 0 ? /* @__PURE__ */ jsx100("div", { className: "flex items-center justify-center h-full py-12", children: /* @__PURE__ */ jsx100("p", { className: "text-muted-foreground text-sm", children: "Sem dados dispon\xEDveis" }) }) : /* @__PURE__ */ jsxs78("div", { children: [
-          /* @__PURE__ */ jsxs78("div", { className: "flex items-center justify-between py-2.5 px-4 border-b flex-shrink-0 gap-3 sticky top-0 bg-background", children: [
-            /* @__PURE__ */ jsx100("div", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider pl-1", children: legend?.[0]?.[0] ?? "Participante" }),
-            /* @__PURE__ */ jsx100("div", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider", children: legend?.[0]?.[1] ?? "Pontua\xE7\xE3o" })
+          /* @__PURE__ */ jsx102(SkeletonBase, { className: "h-6 w-12 rounded-full" })
+        ] }, idx)) }) : sortedData.length === 0 ? /* @__PURE__ */ jsx102("div", { className: "flex items-center justify-center h-full py-12", children: /* @__PURE__ */ jsx102("p", { className: "text-muted-foreground text-sm", children: "Sem dados dispon\xEDveis" }) }) : /* @__PURE__ */ jsxs79("div", { children: [
+          /* @__PURE__ */ jsxs79("div", { className: "flex items-center justify-between py-2.5 px-4 border-b flex-shrink-0 gap-3 sticky top-0 bg-background", children: [
+            /* @__PURE__ */ jsx102("div", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider pl-1", children: legend?.[0] }),
+            /* @__PURE__ */ jsx102("div", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider", children: legend?.[1] })
           ] }),
-          /* @__PURE__ */ jsx100("ul", { children: sortedData.map((item, idx) => /* @__PURE__ */ jsx100(
+          /* @__PURE__ */ jsx102("ul", { children: sortedData.map((item, idx) => /* @__PURE__ */ jsx102(
             motion22.span,
             {
               initial: { opacity: 0, y: 10 },
               animate: { opacity: 1, y: 0 },
               transition: { delay: idx * 5e-3 },
-              children: /* @__PURE__ */ jsxs78("li", { className: "flex items-center justify-between py-3 border-b last:border-b-0 hover:bg-muted transition-colors px-4", children: [
-                /* @__PURE__ */ jsxs78("div", { className: "flex items-center gap-3", children: [
-                  /* @__PURE__ */ jsx100("span", { className: "text-sm text-gray-400 w-6 h-6 border rounded-full text-center bg-muted/50", children: idx + 1 }),
-                  /* @__PURE__ */ jsx100("span", { className: "font-medium", children: item.name })
+              children: /* @__PURE__ */ jsxs79("li", { className: "flex items-center justify-between py-3 border-b last:border-b-0 hover:bg-muted transition-colors px-4", children: [
+                /* @__PURE__ */ jsxs79("div", { className: "flex items-center gap-3", children: [
+                  /* @__PURE__ */ jsx102("span", { className: "text-sm text-gray-400 w-6 h-6 border rounded-full text-center bg-muted/50", children: order === "desc" ? idx + 1 : sortedData.length - idx }),
+                  /* @__PURE__ */ jsx102("span", { className: "font-medium", children: item.name })
                 ] }),
-                /* @__PURE__ */ jsx100(
+                /* @__PURE__ */ jsx102(
                   Badge,
                   {
-                    color: getBadgeColor(item.value),
+                    color: getBadgeColor(item.value, idx, sortedData.length),
                     size: "md",
                     className: "font-bold",
                     children: item.value
@@ -18835,6 +19354,7 @@ export {
   BreadcrumbListBase,
   BreadcrumbPageBase,
   BreadcrumbSeparatorBase,
+  Brush_default as Brush,
   ButtonBase,
   ButtonGroupBase,
   CalendarBase,
@@ -19088,6 +19608,7 @@ export {
   ThemeProviderBase,
   TimePicker,
   TimePickerInput,
+  TimeSeries_default as TimeSeries,
   Toaster,
   TooltipBase,
   TooltipContentBase,
@@ -19183,5 +19704,6 @@ export {
   useEventVisibilityAgenda,
   useIsMobile,
   useTheme,
+  useTimeSeriesRange,
   visualForItem
 };