@mlw-packages/react-components 1.7.2 → 1.7.3

package/dist/index.js

@@ -543,6 +543,21 @@ __export(index_exports, {
   CommandListBase: () => CommandListBase,
   CommandSeparatorBase: () => CommandSeparatorBase,
   CommandShortcutBase: () => CommandShortcutBase,
+  ContextMenuBase: () => ContextMenuBase,
+  ContextMenuCheckboxItemBase: () => ContextMenuCheckboxItemBase,
+  ContextMenuContentBase: () => ContextMenuContentBase,
+  ContextMenuGroupBase: () => ContextMenuGroupBase,
+  ContextMenuItemBase: () => ContextMenuItemBase,
+  ContextMenuLabelBase: () => ContextMenuLabelBase,
+  ContextMenuPortalBase: () => ContextMenuPortalBase,
+  ContextMenuRadioGroupBase: () => ContextMenuRadioGroupBase,
+  ContextMenuRadioItemBase: () => ContextMenuRadioItemBase,
+  ContextMenuSeparatorBase: () => ContextMenuSeparatorBase,
+  ContextMenuShortcutBase: () => ContextMenuShortcutBase,
+  ContextMenuSubBase: () => ContextMenuSubBase,
+  ContextMenuSubContentBase: () => ContextMenuSubContentBase,
+  ContextMenuSubTriggerBase: () => ContextMenuSubTriggerBase,
+  ContextMenuTriggerBase: () => ContextMenuTriggerBase,
   CopyButton: () => CopyButton,
   DateTimePicker: () => DateTimePicker,
   DeleteButton: () => DeleteButton,
@@ -2712,30 +2727,36 @@ var DraggableTooltipComponent = ({
   onPositionChange,
   highlightedSeries,
   toggleHighlight,
-  showOnlyHighlighted
+  showOnlyHighlighted,
+  valueFormatter: valueFormatter2
 }) => {
   const visibleKeys = (0, import_react16.useMemo)(
     () => showOnlyHighlighted && highlightedSeries && highlightedSeries.size > 0 ? dataKeys.filter((k) => highlightedSeries.has(k)) : dataKeys,
     [showOnlyHighlighted, highlightedSeries, dataKeys]
   );
-  const TotalDisplay = import_react16.default.memo(
-    ({ data: data2, visibleKeys: visibleKeys2 }) => {
-      const total = (0, import_react16.useMemo)(() => {
-        const numeric = visibleKeys2.map((k) => data2[k]).filter((v) => typeof v === "number");
-        return numeric.reduce((s, v) => s + (v || 0), 0);
-      }, [data2, visibleKeys2]);
-      return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "text-sm", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "text-sm text-muted-foreground", children: "Total" }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-          "div",
-          {
-            className: `text-base font-semibold ${total < 0 ? "text-destructive" : "text-foreground"}`,
-            children: total.toLocaleString("pt-BR")
-          }
-        )
-      ] });
-    }
-  );
+  const TotalDisplay = import_react16.default.memo(({ data: data2, visibleKeys: visibleKeys2, valueFormatter: localformatter }) => {
+    const total = (0, import_react16.useMemo)(() => {
+      const numeric = visibleKeys2.map((k) => data2[k]).filter((v) => typeof v === "number");
+      return numeric.reduce((s, v) => s + (v || 0), 0);
+    }, [data2, visibleKeys2]);
+    const defaultTotalFormatted = total.toLocaleString("pt-BR");
+    const displayTotal = localformatter ? localformatter({
+      value: total,
+      formattedValue: defaultTotalFormatted,
+      dataKey: "total",
+      name: "Total"
+    }) : defaultTotalFormatted;
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "text-sm", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "text-sm text-muted-foreground", children: "Total" }),
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        "div",
+        {
+          className: `text-base font-semibold ${total < 0 ? "text-destructive" : "text-foreground"}`,
+          children: displayTotal
+        }
+      )
+    ] });
+  });
   const [localPos, setLocalPos] = (0, import_react16.useState)(position);
   const [dragging, setDragging] = (0, import_react16.useState)(false);
   const offsetRef = (0, import_react16.useRef)({ x: 0, y: 0 });
@@ -3117,7 +3138,14 @@ var DraggableTooltipComponent = ({
               /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide", children: periodLabel }),
               /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "font-bold text-lg text-foreground mt-1 truncate", children: data.name })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "text-right", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TotalDisplay, { data, visibleKeys }) })
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "text-right", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              TotalDisplay,
+              {
+                data,
+                visibleKeys,
+                valueFormatter: valueFormatter2
+              }
+            ) })
           ] }) }),
           /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "p-3 pt-2 space-y-2", children: [
             /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2", children: dataLabel }),
@@ -3133,6 +3161,13 @@ var DraggableTooltipComponent = ({
                   0
                 );
                 const val = typeof value === "number" ? value : Number(value) || 0;
+                const defaultFormatted = val.toLocaleString("pt-BR");
+                const displayValue = valueFormatter2 ? valueFormatter2({
+                  value,
+                  formattedValue: defaultFormatted,
+                  dataKey: key,
+                  name: key.charAt(0).toUpperCase() + key.slice(1)
+                }) : defaultFormatted;
                 const pct = absDenominator > 0 ? Math.abs(val) / absDenominator * 100 : 0;
                 const isDimmed = highlightedSeries && highlightedSeries.size > 0 && !highlightedSeries.has(key);
                 const isHighlighted = highlightedSeries && highlightedSeries.has(key);
@@ -3178,7 +3213,7 @@ var DraggableTooltipComponent = ({
                             "span",
                             {
                               className: `font-semibold tabular-nums ${val < 0 ? "text-destructive" : "text-foreground"}`,
-                              children: val.toLocaleString("pt-BR")
+                              children: displayValue
                             }
                           ),
                           /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-xs text-muted-foreground", children: absDenominator > 0 ? `${pct.toFixed(1)}%` : "-" })
@@ -3207,7 +3242,8 @@ var DraggableTooltipComponent = ({
                 dataKeys,
                 highlightedSeries,
                 toggleHighlight,
-                finalColors
+                finalColors,
+                valueFormatter2
               ]
             ),
             /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mt-3 pt-2 border-t", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [
@@ -3243,7 +3279,8 @@ var RechartTooltipWithTotal = ({
   label,
   finalColors = {},
   periodLabel = "Per\xEDodo",
-  totalLabel = "Total"
+  totalLabel = "Total",
+  valueFormatter: valueFormatter2
 }) => {
   if (!active || !payload || payload.length === 0) return null;
   const numeric = payload.filter(
@@ -3251,6 +3288,13 @@ var RechartTooltipWithTotal = ({
   );
   const total = numeric.reduce((sum, p) => sum + (p.value || 0), 0);
   const isTotalNegative = total < 0;
+  const defaultTotalFormatted = total.toLocaleString("pt-BR");
+  const displayTotal = valueFormatter2 ? valueFormatter2({
+    value: total,
+    formattedValue: defaultTotalFormatted,
+    dataKey: "total",
+    name: "Total"
+  }) : defaultTotalFormatted;
   const absDenominator = numeric.reduce(
     (sum, p) => sum + Math.abs(typeof p.value === "number" ? p.value : 0),
     0
@@ -3274,7 +3318,7 @@ var RechartTooltipWithTotal = ({
               "p",
               {
                 className: `text-sm font-semibold ${isTotalNegative ? "text-rose-500" : "text-foreground"}`,
-                children: total.toLocaleString("pt-BR")
+                children: displayTotal
               }
             )
           ] })
@@ -3284,6 +3328,13 @@ var RechartTooltipWithTotal = ({
           const pct = absDenominator > 0 ? Math.abs(value) / absDenominator * 100 : 0;
           const baseColor = finalColors[entry.dataKey] || entry.color || "#999";
           const isNeg = value < 0;
+          const defaultFormatted = value.toLocaleString("pt-BR");
+          const displayValue = valueFormatter2 ? valueFormatter2({
+            value: entry.value,
+            formattedValue: defaultFormatted,
+            dataKey: entry.dataKey,
+            name: entry.name
+          }) : defaultFormatted;
           return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-1", children: [
             /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center justify-between text-sm", children: [
               /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2 truncate", children: [
@@ -3302,7 +3353,7 @@ var RechartTooltipWithTotal = ({
                   "span",
                   {
                     className: `${isNeg ? "text-rose-500" : "text-foreground"} font-medium`,
-                    children: value.toLocaleString("pt-BR")
+                    children: displayValue
                   }
                 ),
                 /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-xs text-muted-foreground", children: absDenominator > 0 ? `${pct.toFixed(1)}%` : "-" })
@@ -3333,7 +3384,8 @@ var TooltipSimple = ({
   payload,
   label,
   finalColors = {},
-  periodLabel = "Per\xEDodo"
+  periodLabel = "Per\xEDodo",
+  valueFormatter: valueFormatter2
 }) => {
   if (!active || !payload || payload.length === 0) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
@@ -3351,6 +3403,13 @@ var TooltipSimple = ({
         /* @__PURE__ */ (0, import_jsx_runtime25.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";
+          const defaultFormatted = value.toLocaleString("pt-BR");
+          const displayValue = valueFormatter2 ? valueFormatter2({
+            value: entry.value,
+            formattedValue: defaultFormatted,
+            dataKey: entry.dataKey,
+            name: entry.name
+          }) : defaultFormatted;
           return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
             "div",
             {
@@ -3371,7 +3430,7 @@ var TooltipSimple = ({
                   "span",
                   {
                     className: `font-medium tabular-nums ${value < 0 ? "text-destructive" : "text-foreground"}`,
-                    children: value.toLocaleString("pt-BR")
+                    children: displayValue
                   }
                 ) })
               ]
@@ -3408,10 +3467,15 @@ var parseNumber = (v) => {
     return Number(v);
   return void 0;
 };
-var renderPillLabel = (color, variant) => {
+var renderPillLabel = (color, variant, valueFormatter2) => {
   return (props) => {
     const { x, y, value } = props;
-    const text = typeof value === "number" ? formatCompactNumber(value) : String(value ?? "");
+    const defaultFormatted = typeof value === "number" ? formatCompactNumber(value) : String(value ?? "");
+    const text = valueFormatter2 ? valueFormatter2({
+      value,
+      formattedValue: defaultFormatted,
+      ...props
+    }) : defaultFormatted;
     const paddingX = 8;
     const approxCharWidth = 7;
     const pillWidth = Math.max(
@@ -3519,6 +3583,7 @@ var Chart = ({
   showLabels = false,
   xAxis,
   labelMap,
+  valueFormatter: valueFormatter2,
   enableHighlights = false,
   enableShowOnly = false,
   enablePeriodsDropdown = false,
@@ -3536,7 +3601,7 @@ var Chart = ({
     } : {
       dataKey: resolvedXAxisKey,
       label: xAxis?.label ?? formatFieldName(resolvedXAxisKey),
-      formatter: xAxis?.formatter,
+      valueFormatter: xAxis?.valueFormatter,
       autoLabel: xAxis?.autoLabel ?? true
     };
     const detectedFields = detectDataFields(data, xAxisConfig2.dataKey);
@@ -3988,7 +4053,7 @@ var Chart = ({
                       fontSize: 12,
                       tickLine: false,
                       axisLine: false,
-                      tickFormatter: xAxisConfig.formatter
+                      tickFormatter: xAxisConfig.valueFormatter
                     }
                   ),
                   /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
@@ -4015,7 +4080,19 @@ var Chart = ({
                   showTooltip && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
                     import_recharts.Tooltip,
                     {
-                      content: showTooltipTotal ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TooltipWithTotal_default, { finalColors }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(TooltipSimple_default, { finalColors }),
+                      content: showTooltipTotal ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                        TooltipWithTotal_default,
+                        {
+                          finalColors,
+                          valueFormatter: valueFormatter2
+                        }
+                      ) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                        TooltipSimple_default,
+                        {
+                          finalColors,
+                          valueFormatter: valueFormatter2
+                        }
+                      ),
                       cursor: { fill: "hsl(var(--muted))", opacity: 0.1 }
                     }
                   ),
@@ -4061,7 +4138,11 @@ var Chart = ({
                             {
                               dataKey: key,
                               position: "top",
-                              content: pillLabelRenderer_default(color, "filled"),
+                              content: pillLabelRenderer_default(
+                                color,
+                                "filled",
+                                valueFormatter2
+                              ),
                               offset: 8
                             }
                           ) : null
@@ -4090,7 +4171,11 @@ var Chart = ({
                             {
                               dataKey: key,
                               position: "top",
-                              content: pillLabelRenderer_default(color, "filled"),
+                              content: pillLabelRenderer_default(
+                                color,
+                                "filled",
+                                valueFormatter2
+                              ),
                               offset: 14
                             }
                           ) : null
@@ -4119,7 +4204,11 @@ var Chart = ({
                             {
                               dataKey: key,
                               position: "top",
-                              content: pillLabelRenderer_default(color, "soft"),
+                              content: pillLabelRenderer_default(
+                                color,
+                                "soft",
+                                valueFormatter2
+                              ),
                               offset: 12
                             }
                           ) : null
@@ -4148,6 +4237,7 @@ var Chart = ({
                 onPositionChange: onTooltipPositionChange,
                 periodLabel: "Per\xEDodo Selecionado",
                 dataLabel: "Dados do Per\xEDodo",
+                valueFormatter: valueFormatter2,
                 globalTooltipCount: activeTooltips.length,
                 onCloseAll: () => window.dispatchEvent(new Event("closeAllTooltips")),
                 closeAllButtonPosition: "top-center",
@@ -4663,7 +4753,7 @@ var BarChart = ({
                   fontSize: 12,
                   tickLine: false,
                   axisLine: false,
-                  tickFormatter: xAxisConfig.formatter
+                  tickFormatter: xAxisConfig.valueFormatter
                 }
               ),
               /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
@@ -10984,14 +11074,226 @@ function RangePicker({
 }
 RangePicker.displayName = "RangePicker";
 
+// src/components/ui/navigation/ContextMenuBase.tsx
+var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"));
+var import_react46 = require("@phosphor-icons/react");
+var import_jsx_runtime68 = require("react/jsx-runtime");
+function ContextMenuBase(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...props });
+}
+function ContextMenuTriggerBase(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Trigger, { "data-slot": "context-menu-trigger", ...props });
+}
+function ContextMenuGroupBase(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Group, { "data-slot": "context-menu-group", ...props });
+}
+function ContextMenuPortalBase(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Portal, { "data-slot": "context-menu-portal", ...props });
+}
+function ContextMenuSubBase(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Sub, { "data-slot": "context-menu-sub", ...props });
+}
+function ContextMenuRadioGroupBase(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.RadioGroup, { "data-slot": "context-menu-radio-group", ...props });
+}
+function ContextMenuSubTriggerBase({
+  className,
+  inset,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+    ContextMenuPrimitive.SubTrigger,
+    {
+      "data-slot": "context-menu-sub-trigger",
+      "data-inset": inset,
+      className: cn(
+        "focus:outline-none",
+        "focus:bg-accent focus:text-accent-foreground",
+        "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm select-none",
+        "data-[inset]:pl-8",
+        "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react46.CaretRightIcon, { className: "ml-auto" })
+      ]
+    }
+  );
+}
+function ContextMenuSubContentBase({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    ContextMenuPrimitive.SubContent,
+    {
+      "data-slot": "context-menu-sub-content",
+      className: cn(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+        "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+        "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "z-50 min-w-[8rem] overflow-hidden rounded-md border border-border p-1 shadow-lg",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ContextMenuContentBase({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    ContextMenuPrimitive.Content,
+    {
+      "data-slot": "context-menu-content",
+      className: cn(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
+        "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2",
+        "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "z-50 max-h-[var(--radix-context-menu-content-available-height)] min-w-[8rem]",
+        "overflow-x-hidden overflow-y-auto rounded-md border border-border p-1 shadow-md",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function ContextMenuItemBase({
+  className,
+  inset,
+  variant = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    ContextMenuPrimitive.Item,
+    {
+      "data-slot": "context-menu-item",
+      "data-inset": inset,
+      "data-variant": variant,
+      className: cn(
+        "focus:outline-none",
+        "focus:bg-accent focus:text-accent-foreground",
+        "data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20",
+        "data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive",
+        "[&_svg:not([class*='text-'])]:text-muted-foreground",
+        "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm select-none",
+        "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        "data-[inset]:pl-8",
+        "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function ContextMenuCheckboxItemBase({
+  className,
+  children,
+  checked,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+    ContextMenuPrimitive.CheckboxItem,
+    {
+      "data-slot": "context-menu-checkbox-item",
+      className: cn(
+        "focus:outline-none",
+        "focus:bg-accent focus:text-accent-foreground",
+        "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm select-none",
+        "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      checked,
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react46.CheckIcon, { className: "size-4" }) }) }),
+        children
+      ]
+    }
+  );
+}
+function ContextMenuRadioItemBase({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)(
+    ContextMenuPrimitive.RadioItem,
+    {
+      "data-slot": "context-menu-radio-item",
+      className: cn(
+        "focus:outline-none",
+        "focus:bg-accent focus:text-accent-foreground",
+        "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm select-none",
+        "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime68.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_react46.CircleIcon, { className: "size-2 fill-current" }) }) }),
+        children
+      ]
+    }
+  );
+}
+function ContextMenuLabelBase({
+  className,
+  inset,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    ContextMenuPrimitive.Label,
+    {
+      "data-slot": "context-menu-label",
+      "data-inset": inset,
+      className: cn("text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8", className),
+      ...props
+    }
+  );
+}
+function ContextMenuSeparatorBase({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    ContextMenuPrimitive.Separator,
+    {
+      "data-slot": "context-menu-separator",
+      className: cn("bg-border -mx-1 my-1 h-px", className),
+      ...props
+    }
+  );
+}
+function ContextMenuShortcutBase({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
+    "span",
+    {
+      "data-slot": "context-menu-shortcut",
+      className: cn("text-muted-foreground ml-auto text-xs tracking-widest", className),
+      ...props
+    }
+  );
+}
+
 // src/hooks/use-drag.tsx
-var import_react46 = require("react");
+var import_react47 = require("react");
 var useDrag = (options = {}) => {
-  const [isDragging, setIsDragging] = (0, import_react46.useState)(null);
-  const [positions, setPositions] = (0, import_react46.useState)({});
-  const dragStartPos = (0, import_react46.useRef)(null);
-  const dragId = (0, import_react46.useRef)(null);
-  const handleMouseDown = (0, import_react46.useCallback)((id, e) => {
+  const [isDragging, setIsDragging] = (0, import_react47.useState)(null);
+  const [positions, setPositions] = (0, import_react47.useState)({});
+  const dragStartPos = (0, import_react47.useRef)(null);
+  const dragId = (0, import_react47.useRef)(null);
+  const handleMouseDown = (0, import_react47.useCallback)((id, e) => {
     e.preventDefault();
     const currentPosition = positions[id] || { top: 0, left: 0 };
     dragStartPos.current = {
@@ -11004,7 +11306,7 @@ var useDrag = (options = {}) => {
     setIsDragging(id);
     options.onDragStart?.(id);
   }, [positions, options]);
-  const handleMouseMove = (0, import_react46.useCallback)((e) => {
+  const handleMouseMove = (0, import_react47.useCallback)((e) => {
     if (!isDragging || !dragStartPos.current || !dragId.current) return;
     const deltaX = e.clientX - dragStartPos.current.x;
     const deltaY = e.clientY - dragStartPos.current.y;
@@ -11020,7 +11322,7 @@ var useDrag = (options = {}) => {
     }));
     options.onDrag?.(dragId.current, newPosition);
   }, [isDragging, options]);
-  const handleMouseUp = (0, import_react46.useCallback)(() => {
+  const handleMouseUp = (0, import_react47.useCallback)(() => {
     if (dragId.current) {
       options.onDragEnd?.(dragId.current);
     }
@@ -11028,7 +11330,7 @@ var useDrag = (options = {}) => {
     dragStartPos.current = null;
     dragId.current = null;
   }, [options]);
-  (0, import_react46.useEffect)(() => {
+  (0, import_react47.useEffect)(() => {
     if (isDragging) {
       document.addEventListener("mousemove", handleMouseMove);
       document.addEventListener("mouseup", handleMouseUp);
@@ -11040,16 +11342,16 @@ var useDrag = (options = {}) => {
       };
     }
   }, [isDragging, handleMouseMove, handleMouseUp]);
-  const setPosition = (0, import_react46.useCallback)((id, position) => {
+  const setPosition = (0, import_react47.useCallback)((id, position) => {
     setPositions((prev) => ({
       ...prev,
       [id]: position
     }));
   }, []);
-  const getPosition = (0, import_react46.useCallback)((id) => {
+  const getPosition = (0, import_react47.useCallback)((id) => {
     return positions[id] || { top: 0, left: 0 };
   }, [positions]);
-  const isElementDragging = (0, import_react46.useCallback)((id) => {
+  const isElementDragging = (0, import_react47.useCallback)((id) => {
     return isDragging === id;
   }, [isDragging]);
   return {