@mlw-packages/react-components 1.7.12 → 1.7.14

package/dist/index.js

@@ -500,9 +500,9 @@ __export(index_exports, {
   AlertDialogTitleBase: () => AlertDialogTitleBase,
   AlertDialogTriggerBase: () => AlertDialogTriggerBase,
   AvatarBase: () => AvatarBase,
+  AvatarCombobox: () => AvatarCombobox,
   AvatarFallbackBase: () => AvatarFallbackBase,
   AvatarImageBase: () => AvatarImageBase,
-  AvatarSelect: () => AvatarSelect,
   BackButton: () => BackButton,
   Badge: () => Badge,
   BarChart: () => BarChart_default,
@@ -532,6 +532,7 @@ __export(index_exports, {
   Chart: () => Chart_default,
   CheckButton: () => CheckButton,
   CheckboxBase: () => CheckboxBase,
+  CheckboxTree: () => CheckboxTree,
   CloseAllButton: () => CloseAllButton_default,
   CloseButton: () => CloseButton,
   CodeBlock: () => CodeBlock,
@@ -1288,6 +1289,7 @@ function ComboboxBase({
   renderSelected,
   handleSelection,
   checkIsSelected,
+  disabled = false,
   keepOpen = false,
   closeAll,
   searchPlaceholder,
@@ -1302,111 +1304,124 @@ function ComboboxBase({
       className: "col-span-1 w-full",
       "data-testid": testIds.root ?? "combobox-base-root",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(PopoverBase, { open, onOpenChange: setOpen, modal: true, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            PopoverTriggerBase,
-            {
-              asChild: true,
-              className: "flex w-full justify-between dark:bg-[hsl(231,15%,19%)]",
-              children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-                ButtonBase,
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+          PopoverBase,
+          {
+            open,
+            onOpenChange: (v) => !disabled && setOpen(v),
+            modal: true,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                PopoverTriggerBase,
                 {
-                  variant: "select",
-                  size: "select",
-                  role: "combobox",
-                  "aria-expanded": open,
-                  className: cn(
-                    "flex items-center gap-2 justify-between h-auto [&>div]:line-clamp-1 [&>span]:line-clamp-1",
-                    error && "border-red-500"
-                  ),
-                  "data-testid": testIds.trigger ?? "combobox-trigger",
-                  children: [
-                    renderSelected,
-                    closeAll,
-                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                      import_framer_motion2.motion.div,
-                      {
-                        animate: { rotate: open ? 180 : 0 },
-                        transition: { duration: 0.3 },
-                        className: "flex",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react5.CaretDownIcon, { className: " flex-shrink-0" })
-                      }
-                    )
-                  ]
+                  asChild: true,
+                  className: "flex w-full justify-between dark:bg-[hsl(231,15%,19%)]",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                    ButtonBase,
+                    {
+                      variant: "select",
+                      size: "select",
+                      role: "combobox",
+                      "aria-expanded": open,
+                      "aria-disabled": disabled || void 0,
+                      disabled,
+                      className: cn(
+                        "flex items-center gap-2 justify-between h-auto [&>div]:line-clamp-1 [&>span]:line-clamp-1",
+                        error && "border-red-500"
+                      ),
+                      "data-testid": testIds.trigger ?? "combobox-trigger",
+                      children: [
+                        renderSelected,
+                        closeAll,
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                          import_framer_motion2.motion.div,
+                          {
+                            animate: { rotate: open ? 180 : 0 },
+                            transition: { duration: 0.3 },
+                            className: "flex",
+                            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react5.CaretDownIcon, { className: " flex-shrink-0" })
+                          }
+                        )
+                      ]
+                    }
+                  )
                 }
-              )
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-            PopoverContentBase,
-            {
-              className: "max-h-[--radix-popover-content-available-height] w-[--radix-popover-trigger-width] p-0 border-none",
-              "data-testid": testIds.popover ?? "combobox-popover",
-              children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-                CommandBase,
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                PopoverContentBase,
                 {
-                  className: "dark:text-white hover:bg-rsecondary",
-                  "data-testid": testIds.command ?? "combobox-command",
-                  children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                      CommandInputBase,
-                      {
-                        tabIndex: -1,
-                        placeholder: searchPlaceholder ?? "Busque uma op\xE7\xE3o...",
-                        "data-testid": testIds.search ?? "combobox-search"
-                      }
-                    ),
-                    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(CommandListBase, { "data-testid": testIds.list ?? "combobox-list", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CommandEmptyBase, { "data-testid": testIds.empty ?? "combobox-empty", children: empty }),
-                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CommandGroupBase, { "data-testid": testIds.group ?? "combobox-group", children: items.map((item) => {
-                        const isSelected = checkIsSelected(item.value);
-                        return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
-                          CommandItemBase,
+                  className: "max-h-[--radix-popover-content-available-height] w-[--radix-popover-trigger-width] p-0 border-none",
+                  "data-testid": testIds.popover ?? "combobox-popover",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                    CommandBase,
+                    {
+                      className: "dark:text-white hover:bg-rsecondary",
+                      "data-testid": testIds.command ?? "combobox-command",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                          CommandInputBase,
                           {
-                            keywords: [item.label],
-                            value: item.value,
-                            onSelect: (value) => {
-                              handleSelection(value);
-                              if (!keepOpen) setOpen(false);
-                            },
-                            "data-testid": testIds.option ?? "combobox-option",
-                            children: [
-                              item.label,
-                              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                                import_framer_motion2.motion.div,
-                                {
-                                  initial: { scale: 0 },
-                                  animate: { scale: isSelected ? 1 : 0 },
-                                  transition: {
-                                    type: "spring",
-                                    stiffness: 500,
-                                    damping: 30
-                                  },
-                                  className: "ml-auto ",
-                                  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-                                    import_react5.CheckIcon,
+                            tabIndex: -1,
+                            disabled,
+                            placeholder: searchPlaceholder ?? "Busque uma op\xE7\xE3o...",
+                            "data-testid": testIds.search ?? "combobox-search"
+                          }
+                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(CommandListBase, { "data-testid": testIds.list ?? "combobox-list", children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CommandEmptyBase, { "data-testid": testIds.empty ?? "combobox-empty", children: empty }),
+                          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CommandGroupBase, { "data-testid": testIds.group ?? "combobox-group", children: items.map((item) => {
+                            const isSelected = checkIsSelected(item.value);
+                            return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                              CommandItemBase,
+                              {
+                                keywords: [item.label],
+                                value: item.value,
+                                onSelect: (value) => {
+                                  if (disabled) return;
+                                  handleSelection(value);
+                                  if (!keepOpen) setOpen(false);
+                                },
+                                disabled,
+                                "data-testid": testIds.option ?? "combobox-option",
+                                children: [
+                                  item.label,
+                                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                                    import_framer_motion2.motion.div,
                                     {
-                                      className: cn(
-                                        "ml-auto",
-                                        isSelected ? "opacity-100" : "opacity-0"
-                                      ),
-                                      "data-testid": isSelected ? testIds.check ?? "combobox-option-check" : void 0
+                                      initial: { scale: 0 },
+                                      animate: { scale: isSelected ? 1 : 0 },
+                                      transition: {
+                                        type: "spring",
+                                        stiffness: 500,
+                                        damping: 30
+                                      },
+                                      className: "ml-auto ",
+                                      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                                        import_react5.CheckIcon,
+                                        {
+                                          className: cn(
+                                            "ml-auto",
+                                            isSelected ? "opacity-100" : "opacity-0"
+                                          ),
+                                          "data-testid": isSelected ? testIds.check ?? "combobox-option-check" : void 0
+                                        }
+                                      )
                                     }
                                   )
-                                }
-                              )
-                            ]
-                          },
-                          item.value
-                        );
-                      }) })
-                    ] })
-                  ]
+                                ]
+                              },
+                              item.value
+                            );
+                          }) })
+                        ] })
+                      ]
+                    }
+                  )
                 }
               )
-            }
-          )
-        ] }),
+            ]
+          }
+        ),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ErrorMessage_default, { error })
       ]
     }
@@ -1423,6 +1438,7 @@ function Combobox({
   placeholder,
   searchPlaceholder,
   empty,
+  disabled = false,
   label,
   labelClassname,
   testIds,
@@ -1434,11 +1450,15 @@ function Combobox({
       "span",
       {
         "data-testid": testIds?.selected ?? "combobox-selected",
-        className: cn("truncate", !selectedItem && "text-gray-500"),
+        className: cn(
+          "truncate",
+          disabled && "opacity-60 cursor-not-allowed",
+          !selectedItem && "text-gray-500"
+        ),
         children: selectedItem?.label ?? placeholder ?? "Selecione uma op\xE7\xE3o..."
       }
     );
-  }, [placeholder, selectedItem, testIds?.selected]);
+  }, [placeholder, selectedItem, testIds?.selected, disabled]);
   const checkIsSelected = (0, import_react6.useCallback)(
     (value) => selected == null ? false : selected == value,
     [selected]
@@ -1458,6 +1478,7 @@ function Combobox({
         renderSelected,
         handleSelection,
         checkIsSelected,
+        disabled,
         searchPlaceholder,
         empty,
         error,
@@ -1483,8 +1504,10 @@ function MultiCombobox({
   labelClassname,
   testIds = {},
   error,
+  disabled = false,
   keepOpen = true,
-  showClearAll = false
+  showClearAll = false,
+  empty
 }) {
   const selectedItems = items.filter((item) => selected.includes(item.value));
   const checkIsSelected = (0, import_react7.useCallback)(
@@ -1508,7 +1531,9 @@ function MultiCombobox({
       variant: "ghost",
       "data-testid": testIds.clearAll ?? "combobox-clear-all",
       size: "icon",
+      disabled,
       onClick: (e) => {
+        if (disabled) return;
         e.stopPropagation();
         onChange([]);
       },
@@ -1551,15 +1576,19 @@ function MultiCombobox({
               /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                 import_framer_motion3.motion.span,
                 {
-                  role: "button",
-                  tabIndex: 0,
+                  role: disabled ? void 0 : "button",
+                  tabIndex: disabled ? -1 : 0,
                   onClick: (e) => {
+                    if (disabled) return;
                     e.stopPropagation();
                     handleSelection(item.value);
                   },
                   whileHover: { scale: 1.1 },
                   whileTap: { scale: 0.95 },
-                  className: "cursor-pointer text-xs flex items-center justify-center hover:text-red-500 transition-colors flex-shrink-0 rounded hover:bg-red-50 ",
+                  className: cn(
+                    "text-xs flex items-center justify-center transition-colors flex-shrink-0 rounded",
+                    !disabled ? "cursor-pointer hover:text-red-500 hover:bg-red-50" : "opacity-50 pointer-events-none"
+                  ),
                   children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react8.XIcon, { size: 14 })
                 }
               )
@@ -1569,7 +1598,7 @@ function MultiCombobox({
         )) })
       }
     );
-  }, [handleSelection, placeholder, selectedItems, testIds]);
+  }, [handleSelection, placeholder, selectedItems, testIds, disabled]);
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     "div",
     {
@@ -1594,7 +1623,9 @@ function MultiCombobox({
             keepOpen,
             closeAll,
             searchPlaceholder,
-            error
+            error,
+            empty,
+            disabled
           }
         )
       ]
@@ -2199,7 +2230,7 @@ function Select({
   ] });
 }
 
-// src/components/selects/AvatarSelect.tsx
+// src/components/selects/AvatarCombobox.tsx
 var import_react15 = require("react");
 var import_react16 = require("@phosphor-icons/react");
 var import_jsx_runtime19 = require("react/jsx-runtime");
@@ -2224,14 +2255,14 @@ var Square = ({
   {
     "aria-hidden": "true",
     className: cn(
-      "flex size-5 items-center justify-center rounded bg-muted font-medium text-muted-foreground text-xs",
+      "flex h-6 w-6 flex-shrink-0 items-center justify-center rounded bg-muted font-medium text-muted-foreground leading-none overflow-hidden",
       className
     ),
     "data-square": true,
     children
   }
 );
-function AvatarSelect({
+function AvatarCombobox({
   items,
   groupItems,
   placeholder,
@@ -3518,7 +3549,9 @@ var RechartTooltipWithTotal = ({
   periodLabel = "Per\xEDodo",
   totalLabel = "Total",
   valueFormatter: valueFormatter2,
-  categoryFormatter
+  categoryFormatter,
+  yAxisMap,
+  isBiaxial = false
 }) => {
   if (!active || !payload || payload.length === 0) return null;
   const displayLabel = categoryFormatter ? categoryFormatter(String(label ?? "")) : label;
@@ -3549,6 +3582,13 @@ var RechartTooltipWithTotal = ({
     (sum, p) => sum + Math.abs(typeof p.value === "number" ? p.value : 0),
     0
   );
+  const axisDenominators = {};
+  if (isBiaxial && yAxisMap) {
+    for (const p of numeric) {
+      const axis = yAxisMap[p.dataKey] || "left";
+      axisDenominators[axis] = (axisDenominators[axis] || 0) + Math.abs(p.value || 0);
+    }
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     "div",
     {
@@ -3617,7 +3657,12 @@ var RechartTooltipWithTotal = ({
                     children: displayValue
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-xs text-muted-foreground", children: absDenominator > 0 ? `${pct.toFixed(1)}%` : "-" })
+                /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-xs text-muted-foreground", children: isBiaxial && yAxisMap ? (() => {
+                  const axis = yAxisMap[entry.dataKey] || "left";
+                  const denom = axisDenominators[axis] || 0;
+                  const p = denom > 0 ? Math.abs(value) / denom * 100 : 0;
+                  return denom > 0 ? `${p.toFixed(1)}%` : "-";
+                })() : absDenominator > 0 ? `${pct.toFixed(1)}%` : "-" })
               ] })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "w-full bg-muted rounded-full h-1 overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
@@ -3647,7 +3692,9 @@ var TooltipSimple = ({
   finalColors = {},
   periodLabel = "Per\xEDodo",
   valueFormatter: valueFormatter2,
-  categoryFormatter
+  categoryFormatter,
+  yAxisMap,
+  isBiaxial = false
 }) => {
   if (!active || !payload || payload.length === 0) return null;
   const displayLabel = categoryFormatter ? categoryFormatter(String(label ?? "")) : label;
@@ -3666,6 +3713,17 @@ var TooltipSimple = ({
         /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "divide-y divide-border rounded-md overflow-hidden", children: payload.map((entry, index) => {
           const value = typeof entry.value === "number" ? entry.value : 0;
           const color = finalColors[entry.dataKey] || entry.color || "#999";
+          let pct = 0;
+          if (isBiaxial && yAxisMap) {
+            const axis = yAxisMap[entry.dataKey] || "left";
+            const axisSum = payload.filter(
+              (p) => (yAxisMap[p.dataKey] || "left") === axis
+            ).reduce(
+              (s, p) => s + Math.abs(typeof p.value === "number" ? p.value : 0),
+              0
+            );
+            pct = axisSum > 0 ? Math.abs(value) / axisSum * 100 : 0;
+          }
           const defaultFormatted = (() => {
             try {
               if (Math.abs(value) < 1e3) {
@@ -3700,13 +3758,16 @@ var TooltipSimple = ({
                   ),
                   /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-muted-foreground truncate", children: entry.name })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "ml-3", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-                  "span",
-                  {
-                    className: `font-medium tabular-nums ${value < 0 ? "text-destructive" : "text-foreground"}`,
-                    children: displayValue
-                  }
-                ) })
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "ml-3", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex items-baseline gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                    "span",
+                    {
+                      className: `font-medium tabular-nums ${value < 0 ? "text-destructive" : "text-foreground"}`,
+                      children: displayValue
+                    }
+                  ),
+                  isBiaxial ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-xs text-muted-foreground", children: pct > 0 ? `${pct.toFixed(1)}%` : "-" }) : null
+                ] }) })
               ]
             },
             index
@@ -3771,10 +3832,13 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
     const vb = props.viewBox;
     const cxNum = parseNumber(props.cx);
     let centerX;
+    let usedBarCenter = false;
     if (typeof px === "number" && typeof pWidth === "number") {
       centerX = px + pWidth / 2;
+      usedBarCenter = true;
     } else if (typeof xNum === "number" && typeof pWidth === "number") {
       centerX = xNum + pWidth / 2;
+      usedBarCenter = true;
     } else if (typeof cxNum === "number") {
       centerX = cxNum;
     } else if (vb && typeof vb.x === "number" && typeof vb.width === "number" && typeof props.index === "number") {
@@ -3786,32 +3850,26 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
     } else {
       centerX = typeof props.index === "number" ? props.index * 40 + 24 : 0;
     }
-    if (vb && typeof vb.x === "number" && typeof vb.width === "number") {
-      const minX = vb.x + 0 + pillWidth / 22;
-      const maxX = vb.x + vb.width - 2 - pillWidth / 2;
+    if (!usedBarCenter && vb && typeof vb.x === "number" && typeof vb.width === "number") {
+      const minX = vb.x + pillWidth / 2;
+      const maxX = vb.x + vb.width - pillWidth / 2;
       centerX = Math.max(minX, Math.min(maxX, centerX));
     }
     const yNum = parseNumber(y);
     const py = parseNumber(props.y);
     const cyNum = parseNumber(props.cy);
     const centerY = yNum ?? (typeof py === "number" ? py : vb && typeof vb.y === "number" && typeof vb.height === "number" ? vb.y + vb.height / 2 : typeof cyNum === "number" ? cyNum : 0);
-    const rectX = centerX - pillWidth / 3.5;
+    const rectX = centerX - pillWidth / 2;
     const rectY = centerY - pillHeight - 6;
-    const textX = centerX - pillWidth / 3.5 + pillWidth / 2;
+    const textX = centerX;
     const textY = rectY + pillHeight / 2 + 3;
     const rectFill = variant === "filled" ? color : variant === "soft" ? `${color}20` : "#ffffff";
     const rectStroke = variant === "outline" ? `${color}CC` : void 0;
-    const numValue = parseNumber(value);
-    const isNegative = typeof numValue === "number" && numValue < 0;
     let textColor;
-    if (isNegative) {
-      textColor = "#dc2626";
+    if (variant === "filled") {
+      textColor = "#ffffff";
     } else {
-      if (variant === "filled") {
-        textColor = "#ffffff";
-      } else {
-        textColor = "#374151";
-      }
+      textColor = "#374151";
     }
     return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("g", { children: [
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
@@ -3876,7 +3934,10 @@ var Chart = ({
   showTooltipTotal = false,
   maxTooltips = 5,
   formatBR = false,
-  chartMargin
+  chartMargin,
+  yAxisMap,
+  yAxes,
+  periodLabel = "Per\xEDodo"
 }) => {
   const smartConfig = (0, import_react21.useMemo)(() => {
     const resolvedXAxisKey = typeof xAxis === "string" ? xAxis : xAxis && xAxis.dataKey || detectXAxis(data);
@@ -4007,6 +4068,70 @@ var Chart = ({
     }
     return min;
   }, [processedData, allKeys]);
+  const leftKeys = (0, import_react21.useMemo)(
+    () => !yAxisMap ? allKeys : allKeys.filter((k) => (yAxisMap?.[k] ?? "left") === "left"),
+    [allKeys, yAxisMap]
+  );
+  const rightKeys = (0, import_react21.useMemo)(
+    () => !yAxisMap ? [] : allKeys.filter((k) => (yAxisMap?.[k] ?? "left") === "right"),
+    [allKeys, yAxisMap]
+  );
+  const maxForKeys = (0, import_react21.useCallback)(
+    (keys) => {
+      let max = 0;
+      for (const row of processedData) {
+        const r = row;
+        for (const key of keys) {
+          const v = r[key];
+          if (typeof v === "number" && Number.isFinite(v) && v > max)
+            max = v;
+        }
+      }
+      return max;
+    },
+    [processedData]
+  );
+  const minForKeys = (0, import_react21.useCallback)(
+    (keys) => {
+      let min = 0;
+      for (const row of processedData) {
+        const r = row;
+        for (const key of keys) {
+          const v = r[key];
+          if (typeof v === "number" && Number.isFinite(v) && v < min)
+            min = v;
+        }
+      }
+      return min;
+    },
+    [processedData]
+  );
+  const maxLeft = (0, import_react21.useMemo)(() => maxForKeys(leftKeys), [leftKeys, maxForKeys]);
+  const minLeft = (0, import_react21.useMemo)(() => minForKeys(leftKeys), [leftKeys, minForKeys]);
+  const maxRight = (0, import_react21.useMemo)(
+    () => rightKeys.length > 0 ? maxForKeys(rightKeys) : 0,
+    [rightKeys, maxForKeys]
+  );
+  const minRight = (0, import_react21.useMemo)(
+    () => rightKeys.length > 0 ? minForKeys(rightKeys) : 0,
+    [rightKeys, minForKeys]
+  );
+  const niceMaxLeft = (0, import_react21.useMemo)(() => {
+    let padding = 0.08;
+    if (maxLeft > 1e6) padding = 0.05;
+    if (maxLeft > 1e7) padding = 0.03;
+    if (maxLeft === 0) padding = 0.12;
+    const padded = maxLeft * (1 + padding);
+    return niceCeil(padded);
+  }, [maxLeft]);
+  const niceMaxRight = (0, import_react21.useMemo)(() => {
+    let padding = 0.08;
+    if (maxRight > 1e6) padding = 0.05;
+    if (maxRight > 1e7) padding = 0.03;
+    if (maxRight === 0) padding = 0.12;
+    const padded = maxRight * (1 + padding);
+    return niceCeil(padded);
+  }, [maxRight]);
   const niceMax = (0, import_react21.useMemo)(() => {
     let padding = 0.08;
     if (maxDataValue > 1e6) padding = 0.05;
@@ -4196,8 +4321,57 @@ var Chart = ({
   const defaultChartRightMargin = 30;
   const defaultChartLeftMargin = 0;
   const containerPaddingLeft = 16;
-  const finalChartRightMargin = chartMargin?.right ?? defaultChartRightMargin;
-  const finalChartLeftMargin = chartMargin?.left ?? (yAxisLabel ? 40 : defaultChartLeftMargin);
+  const estimateTextWidth = (0, import_react21.useCallback)((text) => {
+    const s = String(text ?? "");
+    if (typeof document === "undefined")
+      return Math.min(200, s.length * 8 + 12);
+    const canvas = document.createElement("canvas");
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return Math.min(200, s.length * 8 + 12);
+    ctx.font = "12px system-ui, -apple-system, 'Segoe UI', Roboto";
+    const w = Math.ceil(ctx.measureText(s).width) + 12;
+    return Math.min(300, w);
+  }, []);
+  const leftLabelSample = (0, import_react21.useMemo)(() => {
+    if (!leftKeys || leftKeys.length === 0) return "";
+    const candidates = [maxLeft, minLeft, niceMaxLeft];
+    return String(
+      candidates.map((v) => yTickFormatter(v)).sort((a, b) => String(b).length - String(a).length)[0] ?? ""
+    );
+  }, [leftKeys, maxLeft, minLeft, niceMaxLeft, yTickFormatter]);
+  const rightLabelSample = (0, import_react21.useMemo)(() => {
+    if (!rightKeys || rightKeys.length === 0) return "";
+    const candidates = [maxRight, minRight, niceMaxRight];
+    return String(
+      candidates.map((v) => yTickFormatter(v)).sort((a, b) => String(b).length - String(a).length)[0] ?? ""
+    );
+  }, [rightKeys, maxRight, minRight, niceMaxRight, yTickFormatter]);
+  const estimatedLeftNeeded = (0, import_react21.useMemo)(() => {
+    const tickW = leftLabelSample ? estimateTextWidth(leftLabelSample) : 0;
+    const axisW = yAxisLabel ? estimateTextWidth(yAxisLabel) + 8 : 0;
+    return Math.max(
+      defaultChartLeftMargin,
+      Math.ceil(tickW + axisW + containerPaddingLeft / 2)
+    );
+  }, [leftLabelSample, yAxisLabel, estimateTextWidth]);
+  const estimatedRightNeeded = (0, import_react21.useMemo)(() => {
+    const tickW = rightLabelSample ? estimateTextWidth(rightLabelSample) : 0;
+    const axisW = yAxes?.right?.label ? estimateTextWidth(yAxes.right.label) + 8 : 0;
+    return Math.max(defaultChartRightMargin, Math.ceil(tickW + axisW / 2));
+  }, [rightLabelSample, yAxes, estimateTextWidth]);
+  const leftAxisLabelWidth = (0, import_react21.useMemo)(() => {
+    const label = yAxes?.left?.label ?? yAxisLabel;
+    return label ? estimateTextWidth(label) : 0;
+  }, [yAxes, yAxisLabel, estimateTextWidth]);
+  const rightAxisLabelWidth = (0, import_react21.useMemo)(() => {
+    const label = yAxes?.right?.label;
+    return label ? estimateTextWidth(label) : 0;
+  }, [yAxes, estimateTextWidth]);
+  const leftYAxisLabelDx = Math.ceil(leftAxisLabelWidth / 2) + 8;
+  const rightYAxisLabelDx = Math.ceil(rightAxisLabelWidth / 2) + 8;
+  const finalChartLeftMargin = chartMargin?.left ?? Math.max(estimatedLeftNeeded, yAxisLabel ? 40 : defaultChartLeftMargin);
+  const finalChartRightMarginFinal = chartMargin?.right ?? estimatedRightNeeded;
+  const finalChartRightMargin = finalChartRightMarginFinal;
   const finalChartTopMargin = chartMargin?.top ?? (showLabels ? 48 : 20);
   const baseBottom = chartMargin?.bottom ?? 5;
   const extraForXAxisLabel = xAxisLabel ? 22 : 0;
@@ -4275,8 +4449,7 @@ var Chart = ({
       ref: wrapperRef,
       style: {
         width: "100%",
-        overflowX: "hidden",
-        overflowY: "hidden",
+        overflow: "visible",
         minWidth: 0
       },
       children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
@@ -4291,7 +4464,6 @@ var Chart = ({
                 style: {
                   paddingLeft: `${containerPaddingLeft + finalChartLeftMargin}px`,
                   width: "100%",
-                  maxWidth: `${chartInnerWidth}px`,
                   display: "flex",
                   justifyContent: titlePosition === "center" ? "center" : titlePosition === "right" ? "flex-end" : "flex-start",
                   alignItems: "center",
@@ -4413,8 +4585,8 @@ var Chart = ({
                       },
                       label: xAxisLabel ? {
                         value: xAxisLabel,
-                        position: "insideBottomRight",
-                        offset: -5,
+                        position: "bottom",
+                        offset: 12,
                         style: {
                           fontSize: 12,
                           fill: "hsl(var(--muted-foreground))",
@@ -4423,7 +4595,61 @@ var Chart = ({
                       } : void 0
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                  rightKeys.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                      import_recharts.YAxis,
+                      {
+                        yAxisId: "left",
+                        stroke: yAxes?.left?.stroke || "hsl(var(--muted-foreground))",
+                        width: yAxes?.left?.width,
+                        fontSize: 12,
+                        tickLine: false,
+                        axisLine: false,
+                        tickFormatter: yTickFormatter,
+                        domain: [Math.min(minLeft, 0), niceMaxLeft],
+                        tickCount: 6,
+                        label: yAxes?.left?.label ?? yAxisLabel ? {
+                          value: yAxes?.left?.label ?? yAxisLabel,
+                          angle: -90,
+                          position: "left",
+                          dx: -leftYAxisLabelDx,
+                          style: {
+                            fontSize: 12,
+                            fill: "hsl(var(--muted-foreground))",
+                            fontWeight: 500,
+                            textAnchor: "middle"
+                          }
+                        } : void 0
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                      import_recharts.YAxis,
+                      {
+                        yAxisId: "right",
+                        orientation: "right",
+                        stroke: yAxes?.right?.stroke || "hsl(var(--muted-foreground))",
+                        width: yAxes?.right?.width,
+                        fontSize: 12,
+                        tickLine: false,
+                        axisLine: false,
+                        tickFormatter: yTickFormatter,
+                        domain: [Math.min(minRight, 0), niceMaxRight],
+                        tickCount: 6,
+                        label: yAxes?.right?.label ? {
+                          value: yAxes?.right?.label,
+                          angle: -90,
+                          position: "right",
+                          dx: rightYAxisLabelDx,
+                          style: {
+                            fontSize: 12,
+                            fill: "hsl(var(--muted-foreground))",
+                            fontWeight: 500,
+                            textAnchor: "middle"
+                          }
+                        } : void 0
+                      }
+                    )
+                  ] }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_jsx_runtime28.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                     import_recharts.YAxis,
                     {
                       stroke: "hsl(var(--muted-foreground))",
@@ -4436,7 +4662,8 @@ var Chart = ({
                       label: yAxisLabel ? {
                         value: yAxisLabel,
                         angle: -90,
-                        position: "leftTop",
+                        position: "left",
+                        dx: -leftYAxisLabelDx,
                         style: {
                           fontSize: 12,
                           fill: "hsl(var(--muted-foreground))",
@@ -4445,8 +4672,8 @@ var Chart = ({
                         }
                       } : void 0
                     }
-                  ),
-                  minDataValue < 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+                  ) }),
+                  (minDataValue < 0 || minLeft < 0 || minRight < 0) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                     import_recharts.ReferenceLine,
                     {
                       y: 0,
@@ -4461,16 +4688,22 @@ var Chart = ({
                       content: showTooltipTotal ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         TooltipWithTotal_default,
                         {
+                          periodLabel,
                           finalColors,
                           valueFormatter: finalValueFormatter,
-                          categoryFormatter
+                          categoryFormatter,
+                          yAxisMap,
+                          isBiaxial: rightKeys.length > 0
                         }
                       ) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         TooltipSimple_default,
                         {
+                          periodLabel,
                           finalColors,
                           valueFormatter: finalValueFormatter,
-                          categoryFormatter
+                          categoryFormatter,
+                          yAxisMap,
+                          isBiaxial: rightKeys.length > 0
                         }
                       ),
                       cursor: { fill: "hsl(var(--muted))", opacity: 0.1 }
@@ -4496,6 +4729,7 @@ var Chart = ({
                       return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         import_recharts.Bar,
                         {
+                          yAxisId: yAxisMap?.[key],
                           dataKey: key,
                           name: label,
                           fill: color,
@@ -4535,6 +4769,7 @@ var Chart = ({
                       return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         import_recharts.Line,
                         {
+                          yAxisId: yAxisMap?.[key],
                           dataKey: key,
                           name: label,
                           stroke: color,
@@ -4568,6 +4803,7 @@ var Chart = ({
                       return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                         import_recharts.Area,
                         {
+                          yAxisId: yAxisMap?.[key],
                           dataKey: key,
                           name: label,
                           stroke: color,
@@ -4616,7 +4852,7 @@ var Chart = ({
                 showOnlyHighlighted,
                 onClose: (id) => setActiveTooltips((prev) => prev.filter((t) => t.id !== id)),
                 onPositionChange: onTooltipPositionChange,
-                periodLabel: "Per\xEDodo Selecionado",
+                periodLabel,
                 dataLabel: "Dados do Per\xEDodo",
                 valueFormatter: finalValueFormatter,
                 categoryFormatter,
@@ -7527,44 +7763,50 @@ var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"));
 var import_react30 = require("@phosphor-icons/react");
 var import_framer_motion11 = require("framer-motion");
 var import_jsx_runtime44 = require("react/jsx-runtime");
-var CheckboxBase = React24.forwardRef(({ className, testid: dataTestId = "checkbox-base", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-  CheckboxPrimitive.Root,
-  {
-    ref,
-    className: cn(
-      "peer h-4 w-4 shrink-0 rounded-md border border-primary shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground transition-colors",
-      className
-    ),
-    "data-testid": dataTestId,
-    ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(CheckboxPrimitive.Indicator, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
-      import_framer_motion11.motion.div,
-      {
-        initial: { scale: 0, opacity: 0, rotate: -90 },
-        animate: { scale: 1, opacity: 1, rotate: 0 },
-        exit: { scale: 0, opacity: 0, rotate: 90 },
-        transition: { type: "spring", stiffness: 500, damping: 30 },
-        className: "flex items-center justify-center text-current group",
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-            import_react30.CheckIcon,
-            {
-              className: "h-4 w-4 hidden group-data-[state=checked]:block",
-              weight: "bold"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
-            import_react30.MinusIcon,
-            {
-              className: "h-4 w-4 hidden group-data-[state=indeterminate]:block",
-              weight: "bold"
-            }
-          )
-        ]
-      }
-    ) })
-  }
-));
+var CheckboxBase = React24.forwardRef(({ className, testid: dataTestId = "checkbox-base", checked: checkedProp, defaultChecked, onCheckedChange, ...props }, ref) => {
+  const isControlled = checkedProp !== void 0;
+  const [checkedState, setCheckedState] = React24.useState(
+    isControlled ? checkedProp : defaultChecked ?? false
+  );
+  React24.useEffect(() => {
+    if (isControlled) setCheckedState(checkedProp);
+  }, [checkedProp, isControlled]);
+  const handleCheckedChange = (next) => {
+    if (!isControlled) setCheckedState(next);
+    onCheckedChange?.(next);
+  };
+  const stateClass = checkedState === true || checkedState === "indeterminate" ? "bg-primary text-primary-foreground" : "";
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    CheckboxPrimitive.Root,
+    {
+      ref,
+      checked: checkedProp,
+      defaultChecked,
+      onCheckedChange: handleCheckedChange,
+      className: cn(
+        "group h-4 w-4 shrink-0 rounded-md border border-primary shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 transition-colors",
+        stateClass,
+        className
+      ),
+      "data-testid": dataTestId,
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(CheckboxPrimitive.Indicator, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+        import_framer_motion11.motion.div,
+        {
+          initial: { scale: 0, opacity: 0, rotate: -90 },
+          animate: { scale: 1, opacity: 1, rotate: 0 },
+          exit: { scale: 0, opacity: 0, rotate: 90 },
+          transition: { type: "spring", stiffness: 500, damping: 30 },
+          className: "flex items-center justify-center text-current",
+          children: [
+            checkedState === true && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react30.CheckIcon, { className: "h-4 w-4", weight: "bold" }),
+            checkedState === "indeterminate" && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react30.MinusIcon, { className: "h-4 w-4", weight: "bold" })
+          ]
+        }
+      ) })
+    }
+  );
+});
 CheckboxBase.displayName = CheckboxPrimitive.Root.displayName;
 
 // src/components/ui/form/CollapsibleBase.tsx
@@ -14481,14 +14723,164 @@ function WeekView({
   ] });
 }
 
-// src/hooks/use-drag.tsx
+// src/components/ui/form/CheckBoxThree.tsx
 var import_react69 = require("react");
+var import_framer_motion19 = require("framer-motion");
+var import_jsx_runtime83 = require("react/jsx-runtime");
+function useCheckboxTree(initialTree) {
+  const initialCheckedNodes = (0, import_react69.useMemo)(() => {
+    const checkedSet = /* @__PURE__ */ new Set();
+    const initializeCheckedNodes = (node) => {
+      if (node.defaultChecked) {
+        checkedSet.add(node.id);
+      }
+      node.children?.forEach(initializeCheckedNodes);
+    };
+    initializeCheckedNodes(initialTree);
+    return checkedSet;
+  }, [initialTree]);
+  const [checkedNodes, setCheckedNodes] = (0, import_react69.useState)(initialCheckedNodes);
+  const isChecked = (0, import_react69.useCallback)(
+    (node) => {
+      if (!node.children) {
+        return checkedNodes.has(node.id);
+      }
+      const childrenChecked = node.children.map((child) => isChecked(child));
+      if (childrenChecked.every((status) => status === true)) {
+        return true;
+      }
+      if (childrenChecked.some(
+        (status) => status === true || status === "indeterminate"
+      )) {
+        return "indeterminate";
+      }
+      return false;
+    },
+    [checkedNodes]
+  );
+  const handleCheck = (0, import_react69.useCallback)(
+    (node) => {
+      const newCheckedNodes = new Set(checkedNodes);
+      const toggleNode = (n, check) => {
+        if (check) {
+          newCheckedNodes.add(n.id);
+        } else {
+          newCheckedNodes.delete(n.id);
+        }
+        for (const child of n.children ?? []) {
+          toggleNode(child, check);
+        }
+      };
+      const currentStatus = isChecked(node);
+      const newCheck = currentStatus !== true;
+      toggleNode(node, newCheck);
+      setCheckedNodes(newCheckedNodes);
+    },
+    [checkedNodes, isChecked]
+  );
+  return { handleCheck, isChecked };
+}
+function CheckboxTree({ tree, renderNode }) {
+  const { isChecked, handleCheck } = useCheckboxTree(tree);
+  const DefaultNode = ({
+    node,
+    isChecked: status,
+    onCheckedChange,
+    children
+  }) => {
+    const [open, setOpen] = (0, import_react69.useState)(() => !!node.children && status !== false);
+    const checkboxRef = (0, import_react69.useRef)(null);
+    (0, import_react69.useEffect)(() => {
+      if (checkboxRef.current) {
+        checkboxRef.current.indeterminate = status === "indeterminate";
+      }
+      if (node.children) {
+        setOpen(status !== false);
+      }
+    }, [status, node.children]);
+    return /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "pl-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("div", { className: "flex items-center gap-2", children: [
+        node.children ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+          "button",
+          {
+            "aria-label": open ? "Fechar" : "Abrir",
+            onClick: () => setOpen((v) => !v),
+            className: "w-6 h-6 flex items-center justify-center rounded hover:bg-slate-100 dark:hover:bg-slate-800",
+            children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+              import_framer_motion19.motion.span,
+              {
+                animate: { rotate: open ? 90 : 0 },
+                transition: { duration: 0.18 },
+                className: "inline-block text-slate-500",
+                children: "\u25B6"
+              }
+            )
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "w-6 h-6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("label", { className: "flex items-center gap-2 cursor-pointer select-none", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsxs)("span", { className: "relative", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+              "input",
+              {
+                ref: checkboxRef,
+                type: "checkbox",
+                checked: status === true,
+                onChange: onCheckedChange,
+                className: "appearance-none w-5 h-5 rounded border border-slate-300 dark:border-slate-700 flex items-center justify-center bg-white dark:bg-slate-900 checked:bg-blue-600 checked:border-blue-600 focus:outline-none"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+              import_framer_motion19.motion.span,
+              {
+                initial: false,
+                animate: { scale: status === true ? 1 : 0.8, opacity: status === true ? 1 : 0 },
+                transition: { duration: 0.14 },
+                className: "pointer-events-none absolute left-0 top-0 w-5 h-5 flex items-center justify-center text-white",
+                children: status === true ? /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("svg", { width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("path", { d: "M1 5L4 8L11 1", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : null
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("span", { className: "text-sm text-slate-700 dark:text-slate-200", children: node.label })
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(import_framer_motion19.AnimatePresence, { initial: false, children: open && node.children && /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(
+        import_framer_motion19.motion.div,
+        {
+          initial: { height: 0, opacity: 0 },
+          animate: { height: "auto", opacity: 1 },
+          exit: { height: 0, opacity: 0 },
+          transition: { duration: 0.18 },
+          className: "ml-6 mt-2 overflow-hidden",
+          children: /* @__PURE__ */ (0, import_jsx_runtime83.jsx)("div", { className: "flex flex-col gap-1", children })
+        },
+        "children"
+      ) })
+    ] });
+  };
+  const renderTreeNode = (node) => {
+    const children = node.children?.map(renderTreeNode);
+    const nodePayload = {
+      children,
+      isChecked: isChecked(node),
+      node,
+      onCheckedChange: () => handleCheck(node)
+    };
+    if (renderNode) {
+      return renderNode(nodePayload);
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(DefaultNode, { ...nodePayload });
+  };
+  return renderTreeNode(tree);
+}
+
+// src/hooks/use-drag.tsx
+var import_react70 = require("react");
 var useDrag = (options = {}) => {
-  const [isDragging, setIsDragging] = (0, import_react69.useState)(null);
-  const [positions, setPositions] = (0, import_react69.useState)({});
-  const dragStartPos = (0, import_react69.useRef)(null);
-  const dragId = (0, import_react69.useRef)(null);
-  const handleMouseDown = (0, import_react69.useCallback)((id, e) => {
+  const [isDragging, setIsDragging] = (0, import_react70.useState)(null);
+  const [positions, setPositions] = (0, import_react70.useState)({});
+  const dragStartPos = (0, import_react70.useRef)(null);
+  const dragId = (0, import_react70.useRef)(null);
+  const handleMouseDown = (0, import_react70.useCallback)((id, e) => {
     e.preventDefault();
     const currentPosition = positions[id] || { top: 0, left: 0 };
     dragStartPos.current = {
@@ -14501,7 +14893,7 @@ var useDrag = (options = {}) => {
     setIsDragging(id);
     options.onDragStart?.(id);
   }, [positions, options]);
-  const handleMouseMove = (0, import_react69.useCallback)((e) => {
+  const handleMouseMove = (0, import_react70.useCallback)((e) => {
     if (!isDragging || !dragStartPos.current || !dragId.current) return;
     const deltaX = e.clientX - dragStartPos.current.x;
     const deltaY = e.clientY - dragStartPos.current.y;
@@ -14517,7 +14909,7 @@ var useDrag = (options = {}) => {
     }));
     options.onDrag?.(dragId.current, newPosition);
   }, [isDragging, options]);
-  const handleMouseUp = (0, import_react69.useCallback)(() => {
+  const handleMouseUp = (0, import_react70.useCallback)(() => {
     if (dragId.current) {
       options.onDragEnd?.(dragId.current);
     }
@@ -14525,7 +14917,7 @@ var useDrag = (options = {}) => {
     dragStartPos.current = null;
     dragId.current = null;
   }, [options]);
-  (0, import_react69.useEffect)(() => {
+  (0, import_react70.useEffect)(() => {
     if (isDragging) {
       document.addEventListener("mousemove", handleMouseMove);
       document.addEventListener("mouseup", handleMouseUp);
@@ -14537,16 +14929,16 @@ var useDrag = (options = {}) => {
       };
     }
   }, [isDragging, handleMouseMove, handleMouseUp]);
-  const setPosition = (0, import_react69.useCallback)((id, position) => {
+  const setPosition = (0, import_react70.useCallback)((id, position) => {
     setPositions((prev) => ({
       ...prev,
       [id]: position
     }));
   }, []);
-  const getPosition = (0, import_react69.useCallback)((id) => {
+  const getPosition = (0, import_react70.useCallback)((id) => {
     return positions[id] || { top: 0, left: 0 };
   }, [positions]);
-  const isElementDragging = (0, import_react69.useCallback)((id) => {
+  const isElementDragging = (0, import_react70.useCallback)((id) => {
     return isDragging === id;
   }, [isDragging]);
   return {