@moontra/moonui-pro 2.28.0 → 2.28.2

package/dist/index.mjs

@@ -4,7 +4,7 @@ import { twMerge } from 'tailwind-merge';
 import * as React67 from 'react';
 import React67__default, { useState, useMemo, useCallback, useRef, useEffect, forwardRef, createContext, useContext, useLayoutEffect, useDebugValue, Component } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { Loader2, Play, ExternalLink, ChevronDown, Info, AlertCircle, AlertTriangle, Check, X, MoreHorizontal, Minus, Clock, ChevronUp, Search, Mic, MicOff, Settings, RefreshCw, Zap, ChevronRight, Crown, Circle, ChevronLeft, Plus, Lock, Sparkles, ZoomOut, ZoomIn, Pause, VolumeX, Volume2, Download, Maximize2, Filter, Image as Image$1, Video, RotateCw, Minimize2, BarChart3, Menu, Bell, CheckCheck, CheckCircle, Palette, User, Settings2, LogOut, Edit3, LayoutGrid, Upload, Share2, Save, Phone, Globe, Eye, CheckCircle2, RotateCcw, Copy, Share, Trash2, CreditCard, XCircle, HelpCircle, GripVertical, Bold as Bold$1, Italic as Italic$1, Underline as Underline$1, Strikethrough, Code as Code$1, Type, Heading1, Heading2, Heading3, AlignLeft, AlignCenter, AlignRight, AlignJustify, List, ListOrdered, CheckSquare, Quote, Highlighter, Link2, Table as Table$1, Undo, Redo, Edit, Wand2, Maximize, FileText, Briefcase, MessageSquare, Heart, GraduationCap, Languages, Lightbulb, MoreVertical, TrendingUp, Activity, BellOff, Target, ArrowUpRight, ArrowDownRight, CalendarIcon, MapPin, Navigation, ArrowUp, ArrowDown, ArrowUpDown, Calendar as Calendar$1, DollarSign, Users, Map as Map$1, Music, Archive, File, FileSpreadsheet, FileJson, FileDown, ChevronsLeft, ChevronsRight, Star, Shield, Award, Gem, Flame, Repeat, Move, EyeOff, Timer, Square, Cpu, GitBranch, ArrowRight, Trash, MessageCircle, Paperclip, Printer, TrendingDown, Grip, Unlock, Github, Server, Monitor, MemoryStick, HardDrive, Network, Columns, PlusCircle, Pin, Sun, Moon, Home, Send, Tag, Flag, Trophy, GitFork, Package } from 'lucide-react';
+import { Loader2, Play, ExternalLink, ChevronDown, Info, AlertCircle, AlertTriangle, Check, X, MoreHorizontal, Minus, Clock, ChevronUp, Search, Mic, MicOff, Settings, RefreshCw, Zap, ChevronRight, Crown, Circle, ChevronLeft, Plus, Lock, Sparkles, ZoomOut, ZoomIn, Pause, VolumeX, Volume2, Download, Maximize2, Filter, Image as Image$1, Video, RotateCw, Minimize2, BarChart3, Menu, Bell, CheckCheck, CheckCircle, Palette, User, Settings2, LogOut, Edit3, LayoutGrid, Upload, Share2, Save, Phone, Globe, Eye, CheckCircle2, RotateCcw, Copy, Share, Trash2, CreditCard, XCircle, HelpCircle, GripVertical, Bold as Bold$1, Italic as Italic$1, Underline as Underline$1, Strikethrough, Code as Code$1, Type, Heading1, Heading2, Heading3, AlignLeft, AlignCenter, AlignRight, AlignJustify, List, ListOrdered, CheckSquare, Quote, Highlighter, Link2, Table as Table$1, Undo, Redo, Edit, Wand2, Maximize, FileText, Briefcase, MessageSquare, Heart, GraduationCap, Languages, Lightbulb, MoreVertical, TrendingUp, Activity, BellOff, Target, ArrowUpRight, ArrowDownRight, CalendarIcon, MapPin, Navigation, ArrowUp, ArrowDown, ArrowUpDown, Calendar as Calendar$1, DollarSign, Users, Map as Map$1, Music, Archive, File, FileSpreadsheet, FileJson, FileDown, ChevronsLeft, ChevronsRight, Star, Shield, Award, Gem, Flame, TrendingDown, Repeat, Move, EyeOff, Timer, Square, Cpu, GitBranch, ArrowRight, Trash, MessageCircle, Paperclip, Printer, Grip, Unlock, Github, Server, Monitor, MemoryStick, HardDrive, Network, Columns, PlusCircle, Pin, Sun, Moon, Home, Send, Tag, Flag, Trophy, Wifi, WifiOff, Thermometer, GitFork, Package, PoundSterling, Euro, Database, ShoppingCart } from 'lucide-react';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
@@ -78963,5 +78963,1949 @@ var MoonUIAsyncAvatarPro = React67.forwardRef(({ userId, fetchUser, ...props },
   );
 });
 MoonUIAsyncAvatarPro.displayName = "MoonUIAsyncAvatarPro";
+function WidgetBase({
+  title,
+  subtitle,
+  children,
+  variant = "default",
+  colorScheme = "blue",
+  className,
+  headerAction,
+  loading = false,
+  error = null,
+  animate: animate4 = true
+}) {
+  const colorSchemeClasses = {
+    blue: "from-blue-500/10 via-blue-400/5 to-transparent border-blue-200/20",
+    green: "from-green-500/10 via-green-400/5 to-transparent border-green-200/20",
+    purple: "from-purple-500/10 via-purple-400/5 to-transparent border-purple-200/20",
+    orange: "from-orange-500/10 via-orange-400/5 to-transparent border-orange-200/20",
+    pink: "from-pink-500/10 via-pink-400/5 to-transparent border-pink-200/20",
+    cyan: "from-cyan-500/10 via-cyan-400/5 to-transparent border-cyan-200/20",
+    neutral: "from-gray-500/10 via-gray-400/5 to-transparent border-gray-200/20"
+  };
+  const variantClasses = {
+    default: "bg-card border shadow-sm",
+    minimal: "border-0 shadow-none bg-card/50",
+    glass: "bg-background/60 backdrop-blur-md border-white/10",
+    bordered: "border-2 bg-card",
+    gradient: `bg-gradient-to-br ${colorSchemeClasses[colorScheme]} shadow-sm`,
+    colored: `bg-gradient-to-br ${colorSchemeClasses[colorScheme]} border-2 shadow-lg`
+  };
+  const content = /* @__PURE__ */ jsxs(MoonUICardPro, { className: cn(
+    variantClasses[variant],
+    "transition-all duration-200",
+    className
+  ), children: [
+    (title || subtitle || headerAction) && /* @__PURE__ */ jsxs(MoonUICardHeaderPro, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        title && /* @__PURE__ */ jsx(MoonUICardTitlePro, { className: "text-base font-semibold", children: title }),
+        subtitle && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground mt-1", children: subtitle })
+      ] }),
+      headerAction && /* @__PURE__ */ jsx("div", { className: "ml-4", children: headerAction })
+    ] }),
+    /* @__PURE__ */ jsx(MoonUICardContentPro, { className: cn(
+      title || subtitle || headerAction ? "pt-0" : "pt-6"
+    ), children: loading ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ jsxs("div", { className: "animate-pulse space-y-2", children: [
+      /* @__PURE__ */ jsx("div", { className: "h-4 bg-muted rounded w-24 mx-auto" }),
+      /* @__PURE__ */ jsx("div", { className: "h-8 bg-muted rounded w-16 mx-auto" })
+    ] }) }) : error ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center py-8 text-center", children: /* @__PURE__ */ jsxs("div", { className: "text-destructive", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: "Error" }),
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: error })
+    ] }) }) : children })
+  ] });
+  if (animate4) {
+    return /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        initial: { opacity: 0, y: 20 },
+        animate: { opacity: 1, y: 0 },
+        transition: { duration: 0.3, ease: "easeOut" },
+        children: content
+      }
+    );
+  }
+  return content;
+}
+function KPIWidget({
+  data,
+  title,
+  variant = "default",
+  orientation = "horizontal",
+  showTrend = true,
+  showTarget = true,
+  showChange = true,
+  animate: animate4 = true,
+  icon,
+  onKPIClick,
+  ...widgetProps
+}) {
+  const kpis = Array.isArray(data) ? data : [data];
+  const formatValue = (value, unit) => {
+    if (typeof value === "string")
+      return value;
+    let formattedValue;
+    if (value % 1 !== 0) {
+      formattedValue = (Math.round(value * 100) / 100).toString();
+    } else {
+      formattedValue = value.toString();
+    }
+    return unit ? `${formattedValue}${unit}` : formattedValue;
+  };
+  const getStatusColor = (status) => {
+    switch (status) {
+      case "success":
+        return "text-green-600 dark:text-green-400";
+      case "warning":
+        return "text-yellow-600 dark:text-yellow-400";
+      case "danger":
+        return "text-red-600 dark:text-red-400";
+      case "info":
+        return "text-blue-600 dark:text-blue-400";
+      default:
+        return "text-foreground";
+    }
+  };
+  const renderTrend = (trend) => {
+    if (!trend || trend.length < 2)
+      return null;
+    const max2 = Math.max(...trend);
+    const min2 = Math.min(...trend);
+    const range = max2 - min2 || 1;
+    return /* @__PURE__ */ jsx("div", { className: "flex items-end gap-0.5 h-8 w-16", children: trend.map((value, index2) => /* @__PURE__ */ jsx(
+      motion.div,
+      {
+        className: "flex-1 bg-primary/60 rounded-t-sm min-h-[2px]",
+        initial: { height: 0 },
+        animate: { height: `${Math.max((value - min2) / range * 100, 10)}%` },
+        transition: { delay: index2 * 0.05, duration: animate4 ? 0.3 : 0 }
+      },
+      index2
+    )) });
+  };
+  const renderKPI = (kpi, index2) => {
+    const progress = kpi.target ? typeof kpi.value === "number" ? kpi.value / kpi.target.value * 100 : 0 : 0;
+    return /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        className: cn(
+          "space-y-2",
+          onKPIClick && "cursor-pointer hover:bg-muted/30 p-2 -m-2 rounded-lg transition-colors"
+        ),
+        onClick: () => onKPIClick?.(kpi),
+        initial: { opacity: 0, y: 10 },
+        animate: { opacity: 1, y: 0 },
+        transition: { delay: index2 * 0.1, duration: animate4 ? 0.3 : 0 },
+        children: [
+          (variant === "default" || variant === "detailed") && /* @__PURE__ */ jsxs("div", { className: cn(
+            "flex items-center",
+            orientation === "vertical" ? "flex-col space-y-2" : "justify-between"
+          ), children: [
+            /* @__PURE__ */ jsxs("div", { className: cn(
+              "flex items-center gap-2",
+              orientation === "vertical" ? "flex-col text-center" : ""
+            ), children: [
+              kpi.icon && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: kpi.icon }),
+              /* @__PURE__ */ jsxs("div", { className: orientation === "vertical" ? "text-center" : "", children: [
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground font-medium", children: kpi.label }),
+                kpi.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground/70", children: kpi.description })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: cn(
+              "flex items-center gap-3",
+              orientation === "vertical" ? "flex-col" : ""
+            ), children: [
+              /* @__PURE__ */ jsx("div", { className: cn(
+                "text-right",
+                orientation === "vertical" ? "text-center" : ""
+              ), children: /* @__PURE__ */ jsx("p", { className: cn(
+                "text-2xl font-bold tracking-tight",
+                getStatusColor(kpi.status)
+              ), children: formatValue(kpi.value, kpi.unit) }) }),
+              showChange && kpi.change && /* @__PURE__ */ jsxs("div", { className: cn(
+                "flex items-center gap-1",
+                kpi.change.type === "increase" ? "text-green-600" : kpi.change.type === "decrease" ? "text-red-600" : "text-gray-600"
+              ), children: [
+                kpi.change.type === "increase" ? /* @__PURE__ */ jsx(TrendingUp, { className: "h-4 w-4" }) : kpi.change.type === "decrease" ? /* @__PURE__ */ jsx(TrendingDown, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Minus, { className: "h-4 w-4" }),
+                /* @__PURE__ */ jsxs("span", { className: "text-sm font-medium", children: [
+                  kpi.change.type !== "neutral" && (kpi.change.type === "increase" ? "+" : "-"),
+                  Math.abs(kpi.change.value),
+                  "%"
+                ] })
+              ] }),
+              showTrend && kpi.trend && renderTrend(kpi.trend)
+            ] })
+          ] }),
+          variant === "card" && /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: kpi.label }),
+                /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold tracking-tight", children: formatValue(kpi.value, kpi.unit) })
+              ] }),
+              icon && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0 p-3 rounded-xl bg-primary/10", children: icon })
+            ] }),
+            showChange && kpi.change && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxs(
+                MoonUIBadgePro,
+                {
+                  variant: kpi.change.type === "increase" ? "success" : kpi.change.type === "decrease" ? "destructive" : "secondary",
+                  leftIcon: kpi.change.type === "increase" ? /* @__PURE__ */ jsx(ArrowUpRight, { className: "h-3 w-3" }) : kpi.change.type === "decrease" ? /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(Minus, { className: "h-3 w-3" }),
+                  className: "text-xs",
+                  children: [
+                    kpi.change.type !== "neutral" && (kpi.change.type === "increase" ? "+" : "-"),
+                    Math.abs(kpi.change.value),
+                    "%"
+                  ]
+                }
+              ),
+              kpi.change.period && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+                "vs ",
+                kpi.change.period
+              ] })
+            ] })
+          ] }),
+          variant === "compact" && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              kpi.icon && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground text-sm", children: kpi.icon }),
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: kpi.label })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-bold", children: formatValue(kpi.value, kpi.unit) }),
+              showChange && kpi.change && /* @__PURE__ */ jsxs(
+                MoonUIBadgePro,
+                {
+                  variant: "outline",
+                  className: "text-xs",
+                  leftIcon: kpi.change.type === "increase" ? /* @__PURE__ */ jsx(ArrowUpRight, { className: "h-3 w-3" }) : kpi.change.type === "decrease" ? /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(Minus, { className: "h-3 w-3" }),
+                  children: [
+                    kpi.change.type !== "neutral" && (kpi.change.type === "increase" ? "+" : "-"),
+                    Math.abs(kpi.change.value),
+                    "%"
+                  ]
+                }
+              )
+            ] })
+          ] }),
+          variant === "detailed" && showTarget && kpi.target && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: kpi.target.label || "Target" }),
+              /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+                progress.toFixed(1),
+                "% of ",
+                formatValue(kpi.target.value, kpi.unit)
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(MoonUIProgressPro, { value: progress, className: "h-2" })
+          ] })
+        ]
+      },
+      index2
+    );
+  };
+  return /* @__PURE__ */ jsx(
+    WidgetBase,
+    {
+      title,
+      ...widgetProps,
+      children: /* @__PURE__ */ jsx("div", { className: cn(
+        "space-y-4",
+        variant === "compact" && "space-y-2"
+      ), children: kpis.map((kpi, index2) => renderKPI(kpi, index2)) })
+    }
+  );
+}
+function ChartWidget2({
+  data,
+  title,
+  type = "line",
+  variant = "default",
+  height = 300,
+  showLegend = true,
+  showGrid = true,
+  showTooltip = true,
+  showDataLabels = false,
+  animate: animate4 = true,
+  colors,
+  onDataPointClick,
+  ...widgetProps
+}) {
+  const [hoveredIndex, setHoveredIndex] = React67__default.useState(null);
+  const defaultColors2 = [
+    "#3b82f6",
+    // blue
+    "#10b981",
+    // emerald
+    "#f59e0b",
+    // amber
+    "#ef4444",
+    // red
+    "#8b5cf6",
+    // violet
+    "#ec4899"
+    // pink
+  ];
+  const chartColors = colors || defaultColors2;
+  const maxValue = React67__default.useMemo(() => {
+    if (data.values) {
+      return Math.max(...data.values);
+    }
+    if (data.series) {
+      return Math.max(...data.series.flatMap((s) => s.data.map((d) => d.value)));
+    }
+    return 100;
+  }, [data]);
+  const formatNumber2 = (value) => {
+    if (value % 1 !== 0) {
+      return (Math.round(value * 100) / 100).toString();
+    }
+    return value.toString();
+  };
+  const renderBarChart = () => {
+    const values = data.values || [];
+    const labels = data.labels || data.categories || [];
+    console.log("ChartWidget Debug:", { values, maxValue, labels });
+    return /* @__PURE__ */ jsxs("div", { className: "relative h-full", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex items-end justify-between h-full gap-2 px-4", children: values.map((value, index2) => {
+        const percentage = value / maxValue * 100;
+        const isHovered = hoveredIndex === index2;
+        console.log(`Bar ${index2}:`, { value, percentage, maxValue });
+        return /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            className: "flex-1 flex flex-col items-center justify-end gap-2",
+            onMouseEnter: () => setHoveredIndex(index2),
+            onMouseLeave: () => setHoveredIndex(null),
+            initial: { opacity: 0, y: 20 },
+            animate: { opacity: 1, y: 0 },
+            transition: { delay: index2 * 0.05 },
+            children: [
+              showDataLabels && /* @__PURE__ */ jsx(
+                motion.span,
+                {
+                  className: "text-xs font-medium",
+                  initial: { opacity: 0 },
+                  animate: { opacity: isHovered ? 1 : 0 },
+                  children: formatNumber2(value)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                motion.div,
+                {
+                  className: cn(
+                    "w-full rounded-t cursor-pointer",
+                    isHovered && "opacity-80"
+                  ),
+                  style: {
+                    backgroundColor: chartColors[index2 % chartColors.length],
+                    height: `${percentage}%`,
+                    minHeight: "4px"
+                  },
+                  initial: { scaleY: 0, transformOrigin: "bottom" },
+                  animate: { scaleY: 1 },
+                  transition: {
+                    duration: animate4 ? 0.6 : 0,
+                    delay: index2 * 0.1,
+                    ease: "easeOut"
+                  },
+                  onClick: () => onDataPointClick?.({ label: labels[index2], value })
+                }
+              ),
+              labels[index2] && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground truncate max-w-full", children: labels[index2] })
+            ]
+          },
+          index2
+        );
+      }) }),
+      showGrid && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 pointer-events-none", children: [0, 25, 50, 75, 100].map((percentage) => /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "absolute w-full border-b border-muted/20",
+          style: { bottom: `${percentage}%` },
+          children: /* @__PURE__ */ jsx("span", { className: "absolute -left-8 text-xs text-muted-foreground -translate-y-1/2", children: Math.round(percentage / 100 * maxValue) })
+        },
+        percentage
+      )) })
+    ] });
+  };
+  const renderLineChart = () => {
+    const values = data.values || [];
+    const labels = data.labels || data.categories || [];
+    if (values.length < 2)
+      return null;
+    const points = values.map((value, index2) => {
+      const x = index2 / (values.length - 1) * 100;
+      const y = 100 - value / maxValue * 100;
+      return { x, y, value, label: labels[index2] };
+    });
+    const pathData = points.map((point, index2) => `${index2 === 0 ? "M" : "L"} ${point.x} ${point.y}`).join(" ");
+    return /* @__PURE__ */ jsxs("div", { className: "relative h-full", children: [
+      /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          className: "w-full h-full",
+          viewBox: "0 0 100 100",
+          preserveAspectRatio: "none",
+          children: [
+            showGrid && /* @__PURE__ */ jsx("g", { className: "opacity-20", children: [0, 25, 50, 75, 100].map((y) => /* @__PURE__ */ jsx(
+              "line",
+              {
+                x1: "0",
+                y1: y,
+                x2: "100",
+                y2: y,
+                stroke: "currentColor",
+                strokeWidth: "0.5"
+              },
+              y
+            )) }),
+            /* @__PURE__ */ jsx(
+              motion.path,
+              {
+                d: pathData,
+                fill: "none",
+                stroke: chartColors[0],
+                strokeWidth: "2",
+                initial: { pathLength: 0 },
+                animate: { pathLength: 1 },
+                transition: { duration: animate4 ? 1 : 0 }
+              }
+            ),
+            type === "area" && /* @__PURE__ */ jsx(
+              motion.path,
+              {
+                d: `${pathData} L 100 100 L 0 100 Z`,
+                fill: `${chartColors[0]}20`,
+                initial: { opacity: 0 },
+                animate: { opacity: 1 },
+                transition: { duration: animate4 ? 0.5 : 0, delay: 0.5 }
+              }
+            ),
+            points.map((point, index2) => /* @__PURE__ */ jsx(
+              motion.circle,
+              {
+                cx: point.x,
+                cy: point.y,
+                r: "2",
+                fill: chartColors[0],
+                initial: { r: 0 },
+                animate: { r: hoveredIndex === index2 ? 3 : 2 },
+                onMouseEnter: () => setHoveredIndex(index2),
+                onMouseLeave: () => setHoveredIndex(null),
+                className: "cursor-pointer",
+                onClick: () => onDataPointClick?.(point)
+              },
+              index2
+            ))
+          ]
+        }
+      ),
+      showTooltip && hoveredIndex !== null && points[hoveredIndex] && /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "absolute bg-background border rounded px-2 py-1 text-xs pointer-events-none",
+          style: {
+            left: `${points[hoveredIndex].x}%`,
+            top: `${points[hoveredIndex].y}%`,
+            transform: "translate(-50%, -150%)"
+          },
+          children: [
+            /* @__PURE__ */ jsx("div", { className: "font-medium", children: points[hoveredIndex].label }),
+            /* @__PURE__ */ jsx("div", { children: formatNumber2(points[hoveredIndex].value) })
+          ]
+        }
+      )
+    ] });
+  };
+  const renderPieChart = () => {
+    const values = data.values || [];
+    const labels = data.labels || data.categories || [];
+    const total = values.reduce((sum, val) => sum + val, 0);
+    let currentAngle = -90;
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "relative w-48 h-48", children: [
+        /* @__PURE__ */ jsxs("svg", { className: "w-full h-full transform", viewBox: "0 0 100 100", children: [
+          values.map((value, index2) => {
+            const percentage = value / total * 100;
+            const angle = percentage / 100 * 360;
+            const startAngle = currentAngle;
+            const endAngle = currentAngle + angle;
+            const start = polarToCartesian(50, 50, 40, startAngle);
+            const end = polarToCartesian(50, 50, 40, endAngle);
+            const largeArcFlag = angle > 180 ? 1 : 0;
+            const pathData = [
+              `M 50 50`,
+              `L ${start.x} ${start.y}`,
+              `A 40 40 0 ${largeArcFlag} 1 ${end.x} ${end.y}`,
+              `Z`
+            ].join(" ");
+            currentAngle = endAngle;
+            return /* @__PURE__ */ jsx(
+              motion.path,
+              {
+                d: pathData,
+                fill: chartColors[index2 % chartColors.length],
+                initial: { scale: 0 },
+                animate: { scale: hoveredIndex === index2 ? 1.05 : 1 },
+                style: { transformOrigin: "50px 50px" },
+                transition: { duration: animate4 ? 0.3 : 0, delay: index2 * 0.05 },
+                onMouseEnter: () => setHoveredIndex(index2),
+                onMouseLeave: () => setHoveredIndex(null),
+                className: "cursor-pointer",
+                onClick: () => onDataPointClick?.({ label: labels[index2], value, percentage })
+              },
+              index2
+            );
+          }),
+          type === "donut" && /* @__PURE__ */ jsx("circle", { cx: "50", cy: "50", r: "25", fill: "var(--background)" })
+        ] }),
+        type === "donut" && /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center", children: [
+          /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold", children: total }),
+          /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: "Total" })
+        ] })
+      ] }),
+      showLegend && /* @__PURE__ */ jsx("div", { className: "space-y-2", children: values.map((value, index2) => {
+        const percentage = (value / total * 100).toFixed(1);
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "flex items-center gap-2 cursor-pointer",
+              hoveredIndex === index2 && "opacity-80"
+            ),
+            onMouseEnter: () => setHoveredIndex(index2),
+            onMouseLeave: () => setHoveredIndex(null),
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "w-3 h-3 rounded",
+                  style: { backgroundColor: chartColors[index2 % chartColors.length] }
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "text-sm", children: labels[index2] }),
+              /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground ml-auto", children: [
+                percentage,
+                "%"
+              ] })
+            ]
+          },
+          index2
+        );
+      }) })
+    ] });
+  };
+  const polarToCartesian = (centerX, centerY, radius, angleInDegrees) => {
+    const angleInRadians = angleInDegrees * Math.PI / 180;
+    return {
+      x: centerX + radius * Math.cos(angleInRadians),
+      y: centerY + radius * Math.sin(angleInRadians)
+    };
+  };
+  const renderChart = () => {
+    switch (type) {
+      case "bar":
+        return renderBarChart();
+      case "line":
+      case "area":
+        return renderLineChart();
+      case "pie":
+      case "donut":
+        return renderPieChart();
+      default:
+        return renderBarChart();
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    WidgetBase,
+    {
+      title,
+      ...widgetProps,
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+        data.total !== void 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Total" }),
+            /* @__PURE__ */ jsx("p", { className: "text-2xl font-bold", children: formatNumber2(data.total) })
+          ] }),
+          data.change && /* @__PURE__ */ jsxs("div", { className: cn(
+            "flex items-center gap-1",
+            data.change.type === "increase" ? "text-green-600" : data.change.type === "decrease" ? "text-red-600" : "text-gray-600"
+          ), children: [
+            data.change.type === "increase" ? /* @__PURE__ */ jsx(ArrowUpRight, { className: "h-4 w-4" }) : data.change.type === "decrease" ? /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-4 w-4" }) : null,
+            /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+              data.change.type !== "neutral" && (data.change.type === "increase" ? "+" : "-"),
+              Math.abs(data.change.value),
+              "%"
+            ] }),
+            data.change.period && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+              "vs ",
+              data.change.period
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: { height: `${height}px` }, children: renderChart() })
+      ] })
+    }
+  );
+}
+function GaugeWidget({
+  data,
+  title,
+  variant = "radial",
+  showValue = true,
+  showTarget = true,
+  showThresholds = true,
+  showLabels = true,
+  showTrend = true,
+  showPercentage = true,
+  size: size4 = "md",
+  animate: animate4 = true,
+  strokeWidth = 12,
+  onGaugeClick,
+  ...widgetProps
+}) {
+  const gauges = Array.isArray(data) ? data : [data];
+  const sizeConfig = {
+    sm: { width: 120, height: 120, fontSize: "text-lg", strokeWidth: 8 },
+    md: { width: 180, height: 180, fontSize: "text-2xl", strokeWidth: 12 },
+    lg: { width: 240, height: 240, fontSize: "text-3xl", strokeWidth: 16 },
+    xl: { width: 320, height: 320, fontSize: "text-4xl", strokeWidth: 20 }
+  };
+  const config = sizeConfig[size4];
+  const formatNumber2 = (value) => {
+    if (value % 1 !== 0) {
+      return (Math.round(value * 100) / 100).toString();
+    }
+    return value.toString();
+  };
+  const getPercentage = (gauge) => {
+    const min2 = gauge.min ?? 0;
+    const max2 = gauge.max ?? 100;
+    const range = max2 - min2;
+    return (gauge.value - min2) / range * 100;
+  };
+  const getColor = (gauge, percentage) => {
+    if (gauge.thresholds && gauge.thresholds.length > 0) {
+      const sortedThresholds = [...gauge.thresholds].sort((a, b) => a.value - b.value);
+      for (let i = sortedThresholds.length - 1; i >= 0; i--) {
+        if (percentage >= sortedThresholds[i].value) {
+          return sortedThresholds[i].color;
+        }
+      }
+      return sortedThresholds[0].color;
+    }
+    const statusColors = {
+      success: "#22c55e",
+      warning: "#f59e0b",
+      danger: "#ef4444",
+      info: "#3b82f6",
+      neutral: "#6b7280"
+    };
+    if (gauge.status) {
+      return statusColors[gauge.status];
+    }
+    if (percentage >= 75)
+      return "#22c55e";
+    if (percentage >= 50)
+      return "#f59e0b";
+    if (percentage >= 25)
+      return "#fb923c";
+    return "#ef4444";
+  };
+  const renderRadialGauge = (gauge, index2) => {
+    const percentage = getPercentage(gauge);
+    const radius = (config.width - config.strokeWidth) / 2;
+    const circumference = 2 * Math.PI * radius;
+    const strokeDashoffset = circumference - percentage / 100 * circumference;
+    const color = getColor(gauge, percentage);
+    const targetAngle = gauge.target ? (gauge.target - (gauge.min ?? 0)) / ((gauge.max ?? 100) - (gauge.min ?? 0)) * 360 : null;
+    return /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        className: "relative flex flex-col items-center cursor-pointer",
+        onClick: () => onGaugeClick?.(gauge),
+        whileHover: { scale: 1.02 },
+        whileTap: { scale: 0.98 },
+        children: [
+          /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              width: config.width,
+              height: config.height,
+              className: "transform -rotate-90",
+              children: [
+                /* @__PURE__ */ jsx(
+                  "circle",
+                  {
+                    cx: config.width / 2,
+                    cy: config.height / 2,
+                    r: radius,
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: config.strokeWidth,
+                    className: "text-muted/20"
+                  }
+                ),
+                showThresholds && gauge.thresholds && gauge.thresholds.map((threshold, idx) => {
+                  const thresholdAngle = (threshold.value / 100 * 360 - 90) * (Math.PI / 180);
+                  const x1 = config.width / 2 + (radius - config.strokeWidth) * Math.cos(thresholdAngle);
+                  const y1 = config.height / 2 + (radius - config.strokeWidth) * Math.sin(thresholdAngle);
+                  const x2 = config.width / 2 + (radius + config.strokeWidth) * Math.cos(thresholdAngle);
+                  const y2 = config.height / 2 + (radius + config.strokeWidth) * Math.sin(thresholdAngle);
+                  return /* @__PURE__ */ jsx(
+                    "line",
+                    {
+                      x1,
+                      y1,
+                      x2,
+                      y2,
+                      stroke: threshold.color,
+                      strokeWidth: 2,
+                      opacity: 0.5
+                    },
+                    idx
+                  );
+                }),
+                /* @__PURE__ */ jsx(
+                  motion.circle,
+                  {
+                    cx: config.width / 2,
+                    cy: config.height / 2,
+                    r: radius,
+                    fill: "none",
+                    stroke: color,
+                    strokeWidth: config.strokeWidth,
+                    strokeLinecap: "round",
+                    strokeDasharray: circumference,
+                    initial: { strokeDashoffset: circumference },
+                    animate: { strokeDashoffset },
+                    transition: { duration: animate4 ? 1 : 0, ease: "easeOut" }
+                  }
+                ),
+                showTarget && targetAngle !== null && /* @__PURE__ */ jsx("g", { transform: `rotate(${targetAngle} ${config.width / 2} ${config.height / 2})`, children: /* @__PURE__ */ jsx(
+                  "line",
+                  {
+                    x1: config.width / 2,
+                    y1: config.strokeWidth,
+                    x2: config.width / 2,
+                    y2: config.strokeWidth + 10,
+                    stroke: "currentColor",
+                    strokeWidth: 3,
+                    className: "text-primary"
+                  }
+                ) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center transform rotate-0", children: [
+            showValue && /* @__PURE__ */ jsxs(
+              motion.div,
+              {
+                className: cn(config.fontSize, "font-bold"),
+                initial: { opacity: 0, scale: 0.5 },
+                animate: { opacity: 1, scale: 1 },
+                transition: { delay: 0.3 },
+                children: [
+                  formatNumber2(gauge.value),
+                  gauge.unit && /* @__PURE__ */ jsx("span", { className: "text-sm ml-1", children: gauge.unit })
+                ]
+              }
+            ),
+            showPercentage && /* @__PURE__ */ jsxs("div", { className: "text-sm text-muted-foreground", children: [
+              formatNumber2(percentage),
+              "%"
+            ] }),
+            showLabels && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground mt-1 text-center px-2", children: gauge.label }),
+            showTrend && gauge.trend && /* @__PURE__ */ jsxs("div", { className: cn(
+              "flex items-center gap-1 mt-2",
+              gauge.trend.type === "increase" ? "text-green-600" : gauge.trend.type === "decrease" ? "text-red-600" : "text-gray-600"
+            ), children: [
+              gauge.trend.type === "increase" ? /* @__PURE__ */ jsx(TrendingUp, { className: "h-3 w-3" }) : gauge.trend.type === "decrease" ? /* @__PURE__ */ jsx(TrendingDown, { className: "h-3 w-3" }) : null,
+              /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium", children: [
+                formatNumber2(gauge.trend.value),
+                "%"
+              ] })
+            ] })
+          ] })
+        ]
+      },
+      index2
+    );
+  };
+  const renderLinearGauge = (gauge, index2) => {
+    const percentage = getPercentage(gauge);
+    const color = getColor(gauge, percentage);
+    return /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        className: "w-full space-y-2 cursor-pointer",
+        onClick: () => onGaugeClick?.(gauge),
+        whileHover: { scale: 1.01 },
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              showLabels && /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: gauge.label }),
+              gauge.status && /* @__PURE__ */ jsx(MoonUIBadgePro, { variant: "outline", className: "text-xs", children: gauge.status })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              showValue && /* @__PURE__ */ jsxs("span", { className: cn("font-bold", size4 === "sm" ? "text-base" : "text-lg"), children: [
+                formatNumber2(gauge.value),
+                gauge.unit && /* @__PURE__ */ jsx("span", { className: "text-sm ml-1 text-muted-foreground", children: gauge.unit })
+              ] }),
+              showPercentage && /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground", children: [
+                "(",
+                formatNumber2(percentage),
+                "%)"
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ jsx("div", { className: cn(
+              "w-full rounded-full bg-muted/30 overflow-hidden",
+              size4 === "sm" ? "h-2" : size4 === "md" ? "h-3" : size4 === "lg" ? "h-4" : "h-5"
+            ), children: /* @__PURE__ */ jsx(
+              motion.div,
+              {
+                className: "h-full rounded-full",
+                style: { backgroundColor: color },
+                initial: { width: 0 },
+                animate: { width: `${percentage}%` },
+                transition: { duration: animate4 ? 1 : 0, ease: "easeOut" }
+              }
+            ) }),
+            showThresholds && gauge.thresholds && gauge.thresholds.map((threshold, idx) => /* @__PURE__ */ jsx(MoonUITooltipProviderPro, { children: /* @__PURE__ */ jsxs(MoonUITooltipPro, { children: [
+              /* @__PURE__ */ jsx(MoonUITooltipTriggerPro, { asChild: true, children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "absolute top-1/2 -translate-y-1/2 w-0.5 h-full bg-background",
+                  style: { left: `${threshold.value}%` }
+                }
+              ) }),
+              /* @__PURE__ */ jsx(MoonUITooltipContentPro, { children: /* @__PURE__ */ jsx("p", { children: threshold.label || `${threshold.value}%` }) })
+            ] }) }, idx)),
+            showTarget && gauge.target && /* @__PURE__ */ jsx(MoonUITooltipProviderPro, { children: /* @__PURE__ */ jsxs(MoonUITooltipPro, { children: [
+              /* @__PURE__ */ jsx(MoonUITooltipTriggerPro, { asChild: true, children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "absolute -top-1 w-0 h-0 border-l-[6px] border-l-transparent border-r-[6px] border-r-transparent border-t-[8px] border-t-primary",
+                  style: {
+                    left: `${(gauge.target - (gauge.min ?? 0)) / ((gauge.max ?? 100) - (gauge.min ?? 0)) * 100}%`,
+                    transform: "translateX(-50%)"
+                  }
+                }
+              ) }),
+              /* @__PURE__ */ jsx(MoonUITooltipContentPro, { children: /* @__PURE__ */ jsxs("p", { children: [
+                "Target: ",
+                formatNumber2(gauge.target),
+                gauge.unit
+              ] }) })
+            ] }) })
+          ] }),
+          showLabels && /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("span", { children: gauge.min ?? 0 }),
+            /* @__PURE__ */ jsx("span", { children: gauge.max ?? 100 })
+          ] })
+        ]
+      },
+      index2
+    );
+  };
+  const renderGauge = (gauge, index2) => {
+    switch (variant) {
+      case "linear":
+      case "progress":
+        return renderLinearGauge(gauge, index2);
+      case "radial":
+      default:
+        return renderRadialGauge(gauge, index2);
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    WidgetBase,
+    {
+      title,
+      ...widgetProps,
+      children: /* @__PURE__ */ jsx("div", { className: cn(
+        "flex flex-wrap items-center justify-center",
+        variant === "linear" || variant === "progress" ? "flex-col space-y-4" : "gap-6",
+        "p-4"
+      ), children: gauges.map((gauge, index2) => renderGauge(gauge, index2)) })
+    }
+  );
+}
+function FunnelWidget({
+  data,
+  title,
+  variant = "vertical",
+  showValues = true,
+  showPercentages = true,
+  showDropoff = true,
+  showTargets = false,
+  showDuration = false,
+  showConversionRate = true,
+  animate: animate4 = true,
+  interactive = true,
+  onStageClick,
+  ...widgetProps
+}) {
+  const [hoveredStage, setHoveredStage] = React67__default.useState(null);
+  const formatNumber2 = (value) => {
+    if (value % 1 !== 0) {
+      return (Math.round(value * 100) / 100).toString();
+    }
+    return value.toString();
+  };
+  const processedStages = React67__default.useMemo(() => {
+    const maxValue = Math.max(...data.stages.map((s) => s.value));
+    return data.stages.map((stage, index2) => {
+      const percentage = stage.percentage ?? stage.value / maxValue * 100;
+      const previousValue = index2 > 0 ? data.stages[index2 - 1].value : stage.value;
+      const dropoff = stage.dropoff ?? previousValue - stage.value;
+      const dropoffPercentage = stage.dropoffPercentage ?? (previousValue > 0 ? (previousValue - stage.value) / previousValue * 100 : 0);
+      return {
+        ...stage,
+        percentage,
+        dropoff,
+        dropoffPercentage
+      };
+    });
+  }, [data.stages]);
+  const getStageColor = (stage, index2) => {
+    if (stage.color)
+      return stage.color;
+    const defaultColors2 = [
+      "#3b82f6",
+      // blue
+      "#8b5cf6",
+      // violet
+      "#ec4899",
+      // pink
+      "#f59e0b",
+      // amber
+      "#10b981",
+      // emerald
+      "#06b6d4"
+      // cyan
+    ];
+    return defaultColors2[index2 % defaultColors2.length];
+  };
+  const getStageIcon = (stage, index2) => {
+    if (stage.icon)
+      return stage.icon;
+    const defaultIcons = [
+      /* @__PURE__ */ jsx(Users, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsx(ShoppingCart, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsx(CreditCard, { className: "h-4 w-4" }),
+      /* @__PURE__ */ jsx(CheckCircle, { className: "h-4 w-4" })
+    ];
+    return defaultIcons[index2] || /* @__PURE__ */ jsx(Target, { className: "h-4 w-4" });
+  };
+  const formatValue = (value) => {
+    if (data.currency) {
+      return new Intl.NumberFormat("en-US", {
+        style: "currency",
+        currency: data.currency,
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 0
+      }).format(value);
+    }
+    if (value >= 1e6) {
+      return `${formatNumber2(value / 1e6)}M`;
+    } else if (value >= 1e3) {
+      return `${formatNumber2(value / 1e3)}K`;
+    }
+    return value.toLocaleString();
+  };
+  const renderVerticalFunnel = () => {
+    return /* @__PURE__ */ jsx("div", { className: "space-y-2", children: processedStages.map((stage, index2) => {
+      const width = `${stage.percentage}%`;
+      const color = getStageColor(stage, index2);
+      const icon = getStageIcon(stage, index2);
+      const isHovered = hoveredStage === stage.id;
+      return /* @__PURE__ */ jsx(
+        motion.div,
+        {
+          className: cn(
+            "relative group",
+            interactive && "cursor-pointer"
+          ),
+          onMouseEnter: () => setHoveredStage(stage.id),
+          onMouseLeave: () => setHoveredStage(null),
+          onClick: () => interactive && onStageClick?.(stage),
+          initial: { opacity: 0, x: -20 },
+          animate: { opacity: 1, x: 0 },
+          transition: { delay: index2 * 0.1 },
+          children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-1", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: "p-1.5 rounded",
+                      style: { backgroundColor: `${color}20` },
+                      children: /* @__PURE__ */ jsx("div", { style: { color }, children: icon })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: stage.name }),
+                  stage.description && /* @__PURE__ */ jsx(MoonUITooltipProviderPro, { children: /* @__PURE__ */ jsxs(MoonUITooltipPro, { children: [
+                    /* @__PURE__ */ jsx(MoonUITooltipTriggerPro, { children: /* @__PURE__ */ jsx(AlertCircle, { className: "h-3 w-3 text-muted-foreground" }) }),
+                    /* @__PURE__ */ jsx(MoonUITooltipContentPro, { children: /* @__PURE__ */ jsx("p", { className: "max-w-xs", children: stage.description }) })
+                  ] }) })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  showValues && /* @__PURE__ */ jsx("span", { className: "text-sm font-bold", children: formatValue(stage.value) }),
+                  showPercentages && /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "outline", className: "text-xs", children: [
+                    formatNumber2(stage.percentage),
+                    "%"
+                  ] }),
+                  showDuration && stage.duration && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: stage.duration })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                /* @__PURE__ */ jsx("div", { className: "h-8 bg-muted/30 rounded overflow-hidden", children: /* @__PURE__ */ jsx(
+                  motion.div,
+                  {
+                    className: "h-full rounded transition-all duration-300",
+                    style: {
+                      backgroundColor: color,
+                      opacity: isHovered ? 1 : 0.8
+                    },
+                    initial: { width: 0 },
+                    animate: { width },
+                    transition: { duration: animate4 ? 0.5 : 0, delay: index2 * 0.1 }
+                  }
+                ) }),
+                showTargets && stage.target && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: "absolute top-0 bottom-0 w-0.5 bg-foreground/50",
+                    style: { left: `${stage.target / Math.max(...data.stages.map((s) => s.value)) * 100}%` },
+                    children: /* @__PURE__ */ jsx("div", { className: "absolute -top-1 -left-1 w-2 h-2 rounded-full bg-foreground/50" })
+                  }
+                )
+              ] }),
+              index2 < processedStages.length - 1 && /* @__PURE__ */ jsx("div", { className: "flex justify-center mt-2 mb-1", children: /* @__PURE__ */ jsx(ArrowDown, { className: "h-4 w-4 text-muted-foreground/50" }) })
+            ] }),
+            showDropoff && index2 > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 text-xs", children: [
+              /* @__PURE__ */ jsx(ArrowDown, { className: "h-3 w-3 text-red-500" }),
+              /* @__PURE__ */ jsxs("span", { className: "text-red-500 font-medium", children: [
+                "-",
+                formatNumber2(stage.dropoffPercentage),
+                "%"
+              ] })
+            ] })
+          ] })
+        },
+        stage.id
+      );
+    }) });
+  };
+  const renderStepsFunnel = () => {
+    return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between", children: processedStages.map((stage, index2) => {
+      const color = getStageColor(stage, index2);
+      const icon = getStageIcon(stage, index2);
+      const isHovered = hoveredStage === stage.id;
+      const isLast = index2 === processedStages.length - 1;
+      return /* @__PURE__ */ jsxs(React67__default.Fragment, { children: [
+        /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            className: cn(
+              "flex flex-col items-center gap-2 flex-1",
+              interactive && "cursor-pointer"
+            ),
+            onMouseEnter: () => setHoveredStage(stage.id),
+            onMouseLeave: () => setHoveredStage(null),
+            onClick: () => interactive && onStageClick?.(stage),
+            initial: { opacity: 0, y: 20 },
+            animate: { opacity: 1, y: 0 },
+            transition: { delay: index2 * 0.1 },
+            children: [
+              /* @__PURE__ */ jsxs(
+                motion.div,
+                {
+                  className: "relative",
+                  whileHover: { scale: 1.1 },
+                  whileTap: { scale: 0.95 },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: cn(
+                          "w-16 h-16 rounded-full flex items-center justify-center",
+                          "border-2 transition-all duration-300"
+                        ),
+                        style: {
+                          borderColor: color,
+                          backgroundColor: isHovered ? `${color}20` : "transparent"
+                        },
+                        children: /* @__PURE__ */ jsx("div", { style: { color }, children: icon })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("svg", { className: "absolute inset-0 -rotate-90", width: "64", height: "64", children: /* @__PURE__ */ jsx(
+                      "circle",
+                      {
+                        cx: "32",
+                        cy: "32",
+                        r: "30",
+                        fill: "none",
+                        stroke: color,
+                        strokeWidth: "2",
+                        strokeDasharray: `${stage.percentage * 1.88} 188`,
+                        opacity: "0.3"
+                      }
+                    ) })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+                /* @__PURE__ */ jsx("div", { className: "font-medium text-sm", children: stage.name }),
+                showValues && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground mt-1", children: formatValue(stage.value) }),
+                showPercentages && /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "outline", className: "text-xs mt-1", children: [
+                  formatNumber2(stage.percentage),
+                  "%"
+                ] })
+              ] })
+            ]
+          }
+        ),
+        !isLast && /* @__PURE__ */ jsx("div", { className: "flex-shrink-0 px-2", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+          /* @__PURE__ */ jsx(ArrowRight, { className: "h-5 w-5 text-muted-foreground" }),
+          showDropoff && /* @__PURE__ */ jsxs("div", { className: "absolute -top-6 left-1/2 -translate-x-1/2 text-xs text-red-500 whitespace-nowrap", children: [
+            "-",
+            formatNumber2(processedStages[index2 + 1].dropoffPercentage),
+            "%"
+          ] })
+        ] }) })
+      ] }, stage.id);
+    }) });
+  };
+  const renderCardsFunnel = () => {
+    return /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4", children: processedStages.map((stage, index2) => {
+      const color = getStageColor(stage, index2);
+      const icon = getStageIcon(stage, index2);
+      const isHovered = hoveredStage === stage.id;
+      return /* @__PURE__ */ jsxs(
+        motion.div,
+        {
+          className: cn(
+            "relative p-4 rounded-lg border transition-all",
+            interactive && "cursor-pointer hover:shadow-lg",
+            isHovered && "border-primary"
+          ),
+          style: {
+            borderColor: isHovered ? color : void 0
+          },
+          onMouseEnter: () => setHoveredStage(stage.id),
+          onMouseLeave: () => setHoveredStage(null),
+          onClick: () => interactive && onStageClick?.(stage),
+          initial: { opacity: 0, y: 20 },
+          animate: { opacity: 1, y: 0 },
+          transition: { delay: index2 * 0.1 },
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "p-2 rounded",
+                  style: { backgroundColor: `${color}20` },
+                  children: /* @__PURE__ */ jsx("div", { style: { color }, children: icon })
+                }
+              ),
+              index2 > 0 && showDropoff && /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "destructive", className: "text-xs", children: [
+                /* @__PURE__ */ jsx(TrendingDown, { className: "h-3 w-3 mr-1" }),
+                formatNumber2(stage.dropoffPercentage),
+                "%"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+              /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: stage.name }),
+              showValues && /* @__PURE__ */ jsx("div", { className: "text-2xl font-bold", children: formatValue(stage.value) }),
+              showPercentages && /* @__PURE__ */ jsx(MoonUIProgressPro, { value: stage.percentage, className: "h-2" }),
+              stage.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: stage.description }),
+              showTargets && stage.target && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Target" }),
+                /* @__PURE__ */ jsx("span", { className: "font-medium", children: formatValue(stage.target) })
+              ] })
+            ] })
+          ]
+        },
+        stage.id
+      );
+    }) });
+  };
+  const renderFunnel = () => {
+    switch (variant) {
+      case "steps":
+        return renderStepsFunnel();
+      case "cards":
+        return renderCardsFunnel();
+      case "vertical":
+      default:
+        return renderVerticalFunnel();
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    WidgetBase,
+    {
+      title,
+      ...widgetProps,
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+        showConversionRate && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-3 bg-muted/30 rounded-lg", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Overall Conversion Rate" }),
+            /* @__PURE__ */ jsx("p", { className: "text-2xl font-bold", children: data.conversionRate ? `${formatNumber2(data.conversionRate)}%` : `${formatNumber2(processedStages[processedStages.length - 1].value / processedStages[0].value * 100)}%` })
+          ] }),
+          data.comparison && /* @__PURE__ */ jsxs("div", { className: cn(
+            "flex items-center gap-1",
+            data.comparison.type === "increase" ? "text-green-600" : "text-red-600"
+          ), children: [
+            data.comparison.type === "increase" ? /* @__PURE__ */ jsx(TrendingUp, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(TrendingDown, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+              data.comparison.type === "increase" ? "+" : "-",
+              Math.abs(data.comparison.value),
+              "%"
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+              "vs ",
+              data.comparison.period
+            ] })
+          ] })
+        ] }),
+        renderFunnel()
+      ] })
+    }
+  );
+}
+function RevenueWidget({
+  data,
+  title,
+  variant = "default",
+  showStreams = true,
+  showMetrics = true,
+  showBreakdown = true,
+  showForecast = true,
+  showTimeline = false,
+  showTopProducts = false,
+  showCustomerMetrics = false,
+  animate: animate4 = true,
+  onStreamClick,
+  onMetricClick,
+  ...widgetProps
+}) {
+  const [selectedTab, setSelectedTab] = React67__default.useState("overview");
+  const formatNumber2 = (value) => {
+    if (value % 1 !== 0) {
+      return (Math.round(value * 100) / 100).toString();
+    }
+    return value.toString();
+  };
+  const getCurrencySymbol = (currency) => {
+    switch (currency) {
+      case "EUR":
+        return "\u20AC";
+      case "GBP":
+        return "\xA3";
+      case "USD":
+      default:
+        return "$";
+    }
+  };
+  const currencySymbol = getCurrencySymbol(data.currency);
+  const getCurrencyIcon = (currency) => {
+    switch (currency) {
+      case "EUR":
+        return /* @__PURE__ */ jsx(Euro, { className: "h-5 w-5" });
+      case "GBP":
+        return /* @__PURE__ */ jsx(PoundSterling, { className: "h-5 w-5" });
+      case "USD":
+      default:
+        return /* @__PURE__ */ jsx(DollarSign, { className: "h-5 w-5" });
+    }
+  };
+  const formatCurrency = (value) => {
+    return new Intl.NumberFormat("en-US", {
+      style: "currency",
+      currency: data.currency || "USD",
+      minimumFractionDigits: 0,
+      maximumFractionDigits: 0
+    }).format(value);
+  };
+  const formatCompact = (value) => {
+    if (value >= 1e6) {
+      return `${currencySymbol}${formatNumber2(value / 1e6)}M`;
+    } else if (value >= 1e3) {
+      return `${currencySymbol}${formatNumber2(value / 1e3)}K`;
+    }
+    return `${currencySymbol}${formatNumber2(value)}`;
+  };
+  const progress = data.target ? data.total / data.target.value * 100 : 0;
+  const streamColors = [
+    "#3b82f6",
+    // blue
+    "#8b5cf6",
+    // violet
+    "#10b981",
+    // emerald
+    "#f59e0b",
+    // amber
+    "#ef4444",
+    // red
+    "#ec4899"
+    // pink
+  ];
+  const getStreamColor = (stream, index2) => {
+    if (stream.color)
+      return stream.color;
+    return streamColors[index2 % streamColors.length];
+  };
+  const renderMainRevenue = () => {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
+        /* @__PURE__ */ jsx("div", { className: "space-y-1", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("div", { className: cn(
+            "p-2 rounded-lg bg-gradient-to-br from-primary/20 to-primary/10"
+          ), children: getCurrencyIcon(data.currency) }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
+              "Total Revenue ",
+              data.period && `(${data.period})`
+            ] }),
+            /* @__PURE__ */ jsx(
+              motion.p,
+              {
+                className: "text-3xl font-bold",
+                initial: { opacity: 0, scale: 0.5 },
+                animate: { opacity: 1, scale: 1 },
+                transition: { duration: animate4 ? 0.3 : 0 },
+                children: formatCurrency(data.total)
+              }
+            )
+          ] })
+        ] }) }),
+        data.change && /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            className: cn(
+              "flex items-center gap-1",
+              data.change.type === "increase" ? "text-green-600" : data.change.type === "decrease" ? "text-red-600" : "text-gray-600"
+            ),
+            initial: { opacity: 0, x: 20 },
+            animate: { opacity: 1, x: 0 },
+            transition: { delay: 0.1 },
+            children: [
+              data.change.type === "increase" ? /* @__PURE__ */ jsx(ArrowUpRight, { className: "h-5 w-5" }) : data.change.type === "decrease" ? /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-5 w-5" }) : null,
+              /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+                /* @__PURE__ */ jsxs("p", { className: "text-lg font-bold", children: [
+                  data.change.type !== "neutral" && (data.change.type === "increase" ? "+" : "-"),
+                  Math.abs(data.change.value),
+                  "%"
+                ] }),
+                data.change.period && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+                  "vs ",
+                  data.change.period
+                ] })
+              ] })
+            ]
+          }
+        )
+      ] }),
+      data.target && /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: data.target.label || "Target" }),
+          /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+            formatNumber2(progress),
+            "% of ",
+            formatCurrency(data.target.value)
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(MoonUIProgressPro, { value: progress, className: "h-2" })
+      ] }),
+      showForecast && data.forecast && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-3 bg-muted/30 rounded-lg", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(TrendingUp, { className: "h-4 w-4 text-muted-foreground" }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: data.forecast.label || "Forecast" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+          /* @__PURE__ */ jsx("p", { className: "font-semibold", children: formatCurrency(data.forecast.value) }),
+          data.forecast.confidence && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            data.forecast.confidence,
+            "% confidence"
+          ] })
+        ] })
+      ] })
+    ] });
+  };
+  const renderStreams = () => {
+    if (!data.streams || data.streams.length === 0)
+      return null;
+    const totalStreams = data.streams.reduce((sum, stream) => sum + stream.amount, 0);
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-muted-foreground", children: "Revenue Streams" }),
+      data.streams.map((stream, index2) => {
+        const percentage = stream.percentage ?? stream.amount / totalStreams * 100;
+        const color = getStreamColor(stream, index2);
+        return /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            className: cn(
+              "space-y-2",
+              onStreamClick && "cursor-pointer hover:bg-muted/30 p-2 -m-2 rounded-lg transition-colors"
+            ),
+            onClick: () => onStreamClick?.(stream),
+            initial: { opacity: 0, x: -20 },
+            animate: { opacity: 1, x: 0 },
+            transition: { delay: index2 * 0.05 },
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(
+                    "div",
+                    {
+                      className: "w-3 h-3 rounded-full",
+                      style: { backgroundColor: color }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: stream.name }),
+                  stream.icon && /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: stream.icon })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: formatCompact(stream.amount) }),
+                  /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "outline", className: "text-xs", children: [
+                    formatNumber2(percentage),
+                    "%"
+                  ] }),
+                  stream.change && /* @__PURE__ */ jsxs("div", { className: cn(
+                    "flex items-center gap-0.5 text-xs",
+                    stream.change.type === "increase" ? "text-green-600" : stream.change.type === "decrease" ? "text-red-600" : "text-gray-600"
+                  ), children: [
+                    stream.change.type === "increase" ? /* @__PURE__ */ jsx(ArrowUpRight, { className: "h-3 w-3" }) : stream.change.type === "decrease" ? /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-3 w-3" }) : null,
+                    Math.abs(stream.change.value),
+                    "%"
+                  ] })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "relative h-2 bg-muted/30 rounded-full overflow-hidden", children: /* @__PURE__ */ jsx(
+                motion.div,
+                {
+                  className: "h-full rounded-full",
+                  style: { backgroundColor: color },
+                  initial: { width: 0 },
+                  animate: { width: `${percentage}%` },
+                  transition: { duration: animate4 ? 0.5 : 0, delay: index2 * 0.05 }
+                }
+              ) })
+            ]
+          },
+          stream.id
+        );
+      })
+    ] });
+  };
+  const renderBreakdown = () => {
+    if (!data.breakdown)
+      return null;
+    const total = data.breakdown.recurring + data.breakdown.oneTime + (data.breakdown.refunds || 0);
+    const recurringPercentage = data.breakdown.recurring / total * 100;
+    const oneTimePercentage = data.breakdown.oneTime / total * 100;
+    const refundsPercentage = data.breakdown.refunds ? data.breakdown.refunds / total * 100 : 0;
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-muted-foreground", children: "Revenue Breakdown" }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(Repeat, { className: "h-4 w-4 text-blue-600" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Recurring" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: formatCompact(data.breakdown.recurring) }),
+            /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "outline", className: "text-xs", children: [
+              formatNumber2(recurringPercentage),
+              "%"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(CreditCard, { className: "h-4 w-4 text-green-600" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", children: "One-time" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: formatCompact(data.breakdown.oneTime) }),
+            /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "outline", className: "text-xs", children: [
+              formatNumber2(oneTimePercentage),
+              "%"
+            ] })
+          ] })
+        ] }),
+        data.breakdown.refunds && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(ArrowDownRight, { className: "h-4 w-4 text-red-600" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Refunds" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-sm font-semibold text-red-600", children: [
+              "-",
+              formatCompact(Math.abs(data.breakdown.refunds))
+            ] }),
+            /* @__PURE__ */ jsxs(MoonUIBadgePro, { variant: "destructive", className: "text-xs", children: [
+              formatNumber2(refundsPercentage),
+              "%"
+            ] })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "h-3 flex rounded-full overflow-hidden", children: [
+        /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            className: "bg-blue-600",
+            initial: { width: 0 },
+            animate: { width: `${recurringPercentage}%` },
+            transition: { duration: animate4 ? 0.5 : 0 }
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            className: "bg-green-600",
+            initial: { width: 0 },
+            animate: { width: `${oneTimePercentage}%` },
+            transition: { duration: animate4 ? 0.5 : 0, delay: 0.1 }
+          }
+        ),
+        data.breakdown.refunds && /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            className: "bg-red-600",
+            initial: { width: 0 },
+            animate: { width: `${refundsPercentage}%` },
+            transition: { duration: animate4 ? 0.5 : 0, delay: 0.2 }
+          }
+        )
+      ] })
+    ] });
+  };
+  const renderContent = () => {
+    switch (variant) {
+      case "compact":
+        return /* @__PURE__ */ jsx("div", { className: "space-y-4", children: renderMainRevenue() });
+      case "detailed":
+        return /* @__PURE__ */ jsxs(Tabs, { value: selectedTab, onValueChange: setSelectedTab, children: [
+          /* @__PURE__ */ jsxs(TabsList, { className: "grid grid-cols-3 w-full", children: [
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "overview", children: "Overview" }),
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "streams", children: "Streams" }),
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "metrics", children: "Metrics" })
+          ] }),
+          /* @__PURE__ */ jsxs(TabsContent, { value: "overview", className: "space-y-4", children: [
+            renderMainRevenue(),
+            showBreakdown && renderBreakdown()
+          ] }),
+          /* @__PURE__ */ jsx(TabsContent, { value: "streams", className: "space-y-4", children: renderStreams() }),
+          /* @__PURE__ */ jsx(TabsContent, { value: "metrics", className: "space-y-4", children: /* @__PURE__ */ jsx("div", { className: "text-center py-8 text-muted-foreground", children: /* @__PURE__ */ jsx("p", { children: "Metrics coming soon" }) }) })
+        ] });
+      case "dashboard":
+        return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+            renderMainRevenue(),
+            showBreakdown && renderBreakdown()
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "space-y-4", children: showStreams && renderStreams() })
+        ] });
+      case "default":
+      default:
+        return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+          renderMainRevenue(),
+          showStreams && renderStreams(),
+          showBreakdown && renderBreakdown()
+        ] });
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    WidgetBase,
+    {
+      title,
+      ...widgetProps,
+      children: renderContent()
+    }
+  );
+}
+function ServerMonitorWidget({
+  data,
+  title,
+  variant = "default",
+  showMetrics = true,
+  showAlerts = true,
+  showServices = false,
+  showHistory = false,
+  showUptime = true,
+  updateInterval = 30,
+  animate: animate4 = true,
+  onServerClick,
+  onAlertClick,
+  ...widgetProps
+}) {
+  const servers = Array.isArray(data) ? data : [data];
+  const [selectedTab, setSelectedTab] = React67__default.useState("overview");
+  const [liveData, setLiveData] = React67__default.useState(servers);
+  const formatNumber2 = (value) => {
+    if (typeof value === "string")
+      return value;
+    if (value % 1 !== 0) {
+      return (Math.round(value * 100) / 100).toString();
+    }
+    return value.toString();
+  };
+  React67__default.useEffect(() => {
+    if (!animate4)
+      return;
+    const interval = setInterval(() => {
+      setLiveData(
+        (prevData) => prevData.map((server) => ({
+          ...server,
+          lastUpdated: /* @__PURE__ */ new Date(),
+          metrics: {
+            ...server.metrics,
+            cpu: server.metrics.cpu ? {
+              ...server.metrics.cpu,
+              value: Math.min(100, Math.max(0, server.metrics.cpu.value + (Math.random() - 0.5) * 10))
+            } : void 0,
+            memory: server.metrics.memory ? {
+              ...server.metrics.memory,
+              value: Math.min(100, Math.max(0, server.metrics.memory.value + (Math.random() - 0.5) * 5))
+            } : void 0
+          }
+        }))
+      );
+    }, updateInterval * 1e3);
+    return () => clearInterval(interval);
+  }, [updateInterval, animate4]);
+  const getServerIcon = (type) => {
+    switch (type) {
+      case "database":
+        return /* @__PURE__ */ jsx(Database, { className: "h-5 w-5" });
+      case "cache":
+        return /* @__PURE__ */ jsx(MemoryStick, { className: "h-5 w-5" });
+      case "storage":
+        return /* @__PURE__ */ jsx(HardDrive, { className: "h-5 w-5" });
+      case "compute":
+        return /* @__PURE__ */ jsx(Cpu, { className: "h-5 w-5" });
+      case "web":
+      default:
+        return /* @__PURE__ */ jsx(Server, { className: "h-5 w-5" });
+    }
+  };
+  const getMetricStatus = (metric) => {
+    if (metric.status)
+      return metric.status;
+    const value = metric.value;
+    const max2 = metric.max || 100;
+    const percentage = value / max2 * 100;
+    if (percentage >= 90)
+      return "critical";
+    if (percentage >= 75)
+      return "warning";
+    return "healthy";
+  };
+  const renderMetricBar = (metric, icon) => {
+    const value = metric.value;
+    const max2 = metric.max || 100;
+    const percentage = value / max2 * 100;
+    const status = getMetricStatus(metric);
+    const statusColors = {
+      healthy: "bg-green-600",
+      warning: "bg-yellow-600",
+      critical: "bg-red-600",
+      offline: "bg-gray-600"
+    };
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: metric.label }),
+          metric.trend && /* @__PURE__ */ jsx("div", { className: cn(
+            "text-xs",
+            metric.trend === "up" ? "text-green-600" : metric.trend === "down" ? "text-red-600" : "text-gray-600"
+          ), children: metric.trend === "up" ? /* @__PURE__ */ jsx(TrendingUp, { className: "h-3 w-3" }) : metric.trend === "down" ? /* @__PURE__ */ jsx(TrendingDown, { className: "h-3 w-3" }) : null })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs("span", { className: "text-sm font-semibold", children: [
+            formatNumber2(value),
+            metric.unit || "%"
+          ] }),
+          max2 && max2 !== 100 && /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+            "/ ",
+            formatNumber2(max2),
+            metric.unit
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx(
+          MoonUIProgressPro,
+          {
+            value: percentage,
+            className: "h-2"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            className: cn(
+              "absolute top-0 left-0 h-2 rounded-full",
+              statusColors[status]
+            ),
+            initial: { width: 0 },
+            animate: { width: `${percentage}%` },
+            transition: { duration: animate4 ? 0.5 : 0 }
+          }
+        )
+      ] }),
+      showHistory && metric.history && metric.history.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex items-end gap-0.5 h-8", children: metric.history.slice(-20).map((val, idx) => /* @__PURE__ */ jsx(
+        motion.div,
+        {
+          className: cn(
+            "flex-1 rounded-t",
+            val > 75 ? "bg-red-600/50" : val > 50 ? "bg-yellow-600/50" : "bg-green-600/50"
+          ),
+          initial: { height: 0 },
+          animate: { height: `${val / 100 * 32}px` },
+          transition: { delay: idx * 0.01 }
+        },
+        idx
+      )) })
+    ] });
+  };
+  const renderServerCard = (server) => {
+    const isOnline = server.status === "online";
+    const metrics = server.metrics;
+    return /* @__PURE__ */ jsxs(
+      MoonUICardPro,
+      {
+        className: cn(
+          "p-4 transition-all",
+          onServerClick && "cursor-pointer hover:shadow-lg",
+          !isOnline && "opacity-75"
+        ),
+        onClick: () => onServerClick?.(server),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between mb-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+              /* @__PURE__ */ jsx("div", { className: cn(
+                "p-2 rounded-lg bg-gradient-to-br from-primary/20 to-primary/10"
+              ), children: getServerIcon(server.type) }),
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsx("h4", { className: "font-semibold", children: server.name }),
+                server.location && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [
+                  /* @__PURE__ */ jsx(Globe, { className: "h-3 w-3" }),
+                  server.location
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(
+                MoonUIBadgePro,
+                {
+                  variant: isOnline ? "secondary" : "destructive",
+                  leftIcon: isOnline ? /* @__PURE__ */ jsx(CheckCircle, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(XCircle, { className: "h-3 w-3" }),
+                  children: server.status
+                }
+              ),
+              isOnline ? /* @__PURE__ */ jsx(Wifi, { className: "h-4 w-4 text-green-600" }) : /* @__PURE__ */ jsx(WifiOff, { className: "h-4 w-4 text-red-600" })
+            ] })
+          ] }),
+          showUptime && server.uptime !== void 0 && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm mb-1", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Uptime" }),
+              /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+                formatNumber2(server.uptime),
+                "%"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(MoonUIProgressPro, { value: server.uptime, className: "h-1" })
+          ] }),
+          showMetrics && /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+            metrics.cpu && renderMetricBar(metrics.cpu, /* @__PURE__ */ jsx(Cpu, { className: "h-4 w-4" })),
+            metrics.memory && renderMetricBar(metrics.memory, /* @__PURE__ */ jsx(MemoryStick, { className: "h-4 w-4" })),
+            metrics.disk && renderMetricBar(metrics.disk, /* @__PURE__ */ jsx(HardDrive, { className: "h-4 w-4" })),
+            metrics.network && renderMetricBar(metrics.network, /* @__PURE__ */ jsx(Network, { className: "h-4 w-4" })),
+            metrics.temperature && renderMetricBar(metrics.temperature, /* @__PURE__ */ jsx(Thermometer, { className: "h-4 w-4" }))
+          ] }),
+          metrics.requests || metrics.responseTime || metrics.errorRate ? /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-2 mt-4 pt-4 border-t", children: [
+            metrics.requests && /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Requests" }),
+              /* @__PURE__ */ jsxs("p", { className: "text-sm font-semibold", children: [
+                formatNumber2(metrics.requests.value),
+                "/s"
+              ] })
+            ] }),
+            metrics.responseTime && /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Response" }),
+              /* @__PURE__ */ jsxs("p", { className: "text-sm font-semibold", children: [
+                formatNumber2(metrics.responseTime.value),
+                "ms"
+              ] })
+            ] }),
+            metrics.errorRate && /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Errors" }),
+              /* @__PURE__ */ jsxs("p", { className: "text-sm font-semibold", children: [
+                formatNumber2(metrics.errorRate.value),
+                "%"
+              ] })
+            ] })
+          ] }) : null,
+          showAlerts && server.alerts && server.alerts.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-4 pt-4 border-t", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: "Recent Alerts" }),
+              /* @__PURE__ */ jsx(MoonUIBadgePro, { variant: "outline", className: "text-xs", children: server.alerts.length })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "space-y-1", children: server.alerts.slice(0, 3).map((alert) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn(
+                  "text-xs p-2 rounded flex items-start gap-2",
+                  alert.type === "error" ? "bg-red-100 dark:bg-red-900/20" : alert.type === "warning" ? "bg-yellow-100 dark:bg-yellow-900/20" : "bg-blue-100 dark:bg-blue-900/20",
+                  onAlertClick && "cursor-pointer hover:opacity-80"
+                ),
+                onClick: (e) => {
+                  e.stopPropagation();
+                  onAlertClick?.(alert);
+                },
+                children: [
+                  alert.type === "error" ? /* @__PURE__ */ jsx(XCircle, { className: "h-3 w-3 text-red-600 flex-shrink-0" }) : alert.type === "warning" ? /* @__PURE__ */ jsx(AlertTriangle, { className: "h-3 w-3 text-yellow-600 flex-shrink-0" }) : /* @__PURE__ */ jsx(AlertCircle, { className: "h-3 w-3 text-blue-600 flex-shrink-0" }),
+                  /* @__PURE__ */ jsx("span", { className: "flex-1", children: alert.message })
+                ]
+              },
+              alert.id
+            )) })
+          ] }),
+          server.lastUpdated && /* @__PURE__ */ jsxs("div", { className: "mt-4 pt-4 border-t flex items-center justify-between text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("span", { children: "Last updated" }),
+            /* @__PURE__ */ jsx("span", { children: new Date(server.lastUpdated).toLocaleTimeString() })
+          ] })
+        ]
+      }
+    );
+  };
+  const renderCompactView = () => {
+    return /* @__PURE__ */ jsx("div", { className: "space-y-2", children: liveData.map((server, index2) => /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        className: cn(
+          "flex items-center justify-between p-3 rounded-lg border",
+          onServerClick && "cursor-pointer hover:bg-muted/30 transition-colors"
+        ),
+        onClick: () => onServerClick?.(server),
+        initial: { opacity: 0, x: -20 },
+        animate: { opacity: 1, x: 0 },
+        transition: { delay: index2 * 0.05 },
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            getServerIcon(server.type),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx("span", { className: "font-medium", children: server.name }),
+                /* @__PURE__ */ jsx(
+                  MoonUIBadgePro,
+                  {
+                    variant: server.status === "online" ? "secondary" : "destructive",
+                    className: "text-xs",
+                    leftIcon: server.status === "online" ? /* @__PURE__ */ jsx(CheckCircle, { className: "h-3 w-3" }) : /* @__PURE__ */ jsx(XCircle, { className: "h-3 w-3" }),
+                    children: server.status
+                  }
+                )
+              ] }),
+              server.location && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: server.location })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+            server.metrics.cpu && /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "CPU" }),
+              /* @__PURE__ */ jsxs("p", { className: "text-sm font-semibold", children: [
+                formatNumber2(server.metrics.cpu.value),
+                "%"
+              ] })
+            ] }),
+            server.metrics.memory && /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Memory" }),
+              /* @__PURE__ */ jsxs("p", { className: "text-sm font-semibold", children: [
+                formatNumber2(server.metrics.memory.value),
+                server.metrics.memory.unit || "%"
+              ] })
+            ] }),
+            showUptime && server.uptime !== void 0 && /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Uptime" }),
+              /* @__PURE__ */ jsxs("p", { className: "text-sm font-semibold", children: [
+                formatNumber2(server.uptime),
+                "%"
+              ] })
+            ] })
+          ] })
+        ]
+      },
+      server.id
+    )) });
+  };
+  const renderContent = () => {
+    switch (variant) {
+      case "compact":
+        return renderCompactView();
+      case "grid":
+        return /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", children: liveData.map((server) => /* @__PURE__ */ jsx("div", { children: renderServerCard(server) }, server.id)) });
+      case "detailed":
+        return /* @__PURE__ */ jsxs(Tabs, { value: selectedTab, onValueChange: setSelectedTab, children: [
+          /* @__PURE__ */ jsxs(TabsList, { className: "grid grid-cols-3 w-full", children: [
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "overview", children: "Overview" }),
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "metrics", children: "Metrics" }),
+            /* @__PURE__ */ jsx(TabsTrigger, { value: "alerts", children: "Alerts" })
+          ] }),
+          liveData.map((server) => /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx(TabsContent, { value: "overview", children: renderServerCard(server) }),
+            /* @__PURE__ */ jsx(TabsContent, { value: "metrics", className: "space-y-4", children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4", children: Object.entries(server.metrics).map(([key, metric]) => {
+              if (!metric || key === "custom" || Array.isArray(metric))
+                return null;
+              return /* @__PURE__ */ jsx(MoonUICardPro, { className: "p-4", children: renderMetricBar(
+                metric,
+                key === "cpu" ? /* @__PURE__ */ jsx(Cpu, { className: "h-4 w-4" }) : key === "memory" ? /* @__PURE__ */ jsx(MemoryStick, { className: "h-4 w-4" }) : key === "disk" ? /* @__PURE__ */ jsx(HardDrive, { className: "h-4 w-4" }) : key === "network" ? /* @__PURE__ */ jsx(Network, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(Activity, { className: "h-4 w-4" })
+              ) }, key);
+            }) }) }),
+            /* @__PURE__ */ jsx(TabsContent, { value: "alerts", children: server.alerts && server.alerts.length > 0 ? /* @__PURE__ */ jsx("div", { className: "space-y-2", children: server.alerts.map((alert) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: cn(
+                  "p-3 rounded-lg flex items-start gap-3",
+                  alert.type === "error" ? "bg-red-100 dark:bg-red-900/20" : alert.type === "warning" ? "bg-yellow-100 dark:bg-yellow-900/20" : "bg-blue-100 dark:bg-blue-900/20",
+                  onAlertClick && "cursor-pointer hover:opacity-80"
+                ),
+                onClick: () => onAlertClick?.(alert),
+                children: [
+                  alert.type === "error" ? /* @__PURE__ */ jsx(XCircle, { className: "h-5 w-5 text-red-600" }) : alert.type === "warning" ? /* @__PURE__ */ jsx(AlertTriangle, { className: "h-5 w-5 text-yellow-600" }) : /* @__PURE__ */ jsx(AlertCircle, { className: "h-5 w-5 text-blue-600" }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+                    /* @__PURE__ */ jsx("p", { className: "font-medium", children: alert.message }),
+                    /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground mt-1", children: new Date(alert.timestamp).toLocaleString() })
+                  ] })
+                ]
+              },
+              alert.id
+            )) }) : /* @__PURE__ */ jsxs("div", { className: "text-center py-8 text-muted-foreground", children: [
+              /* @__PURE__ */ jsx(CheckCircle, { className: "h-12 w-12 mx-auto mb-2 opacity-50" }),
+              /* @__PURE__ */ jsx("p", { children: "No active alerts" })
+            ] }) })
+          ] }, server.id))
+        ] });
+      case "default":
+      default:
+        return /* @__PURE__ */ jsx("div", { className: "space-y-4", children: liveData.map((server) => /* @__PURE__ */ jsx("div", { children: renderServerCard(server) }, server.id)) });
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    WidgetBase,
+    {
+      title,
+      ...widgetProps,
+      children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: renderContent() })
+    }
+  );
+}
 
-export { MoonUIAccordionPro as Accordion, MoonUIAccordionContentPro as AccordionContent, MoonUIAccordionItemPro as AccordionItem, MoonUIAccordionTriggerPro as AccordionTrigger, Calendar3 as AdvancedCalendar, AdvancedChart, AdvancedForms, MoonUIAlertPro as Alert, MoonUIAlertDescriptionPro as AlertDescription, MoonUIAlertTitlePro as AlertTitle, MoonUIAspectRatioPro as AspectRatio, MoonUIAvatarPro as Avatar, MoonUIAvatarFallbackPro as AvatarFallback, MoonUIAvatarImagePro as AvatarImage, MoonUIBadgePro as Badge, MoonUIBreadcrumbPro as Breadcrumb, MoonUIBreadcrumbEllipsisPro as BreadcrumbEllipsis, MoonUIBreadcrumbItemPro as BreadcrumbItem, MoonUIBreadcrumbLinkPro as BreadcrumbLink, MoonUIBreadcrumbListPro as BreadcrumbList, MoonUIBreadcrumbPagePro as BreadcrumbPage, MoonUIBreadcrumbSeparatorPro as BreadcrumbSeparator, MoonUIButtonPro as Button, Calendar, Calendar3 as CalendarPro, MoonUICardPro as Card, MoonUICardContentPro as CardContent, MoonUICardDescriptionPro as CardDescription, MoonUICardFooterPro as CardFooter, MoonUICardHeaderPro as CardHeader, MoonUICardTitlePro as CardTitle, MoonUICheckboxPro as Checkbox, ClaudeProvider, MoonUICollapsiblePro as Collapsible, MoonUICollapsibleContentPro as CollapsibleContent, MoonUICollapsibleTriggerPro as CollapsibleTrigger, MoonUIColorPickerPro as ColorPicker, MoonUICommandPro as Command, MoonUICommandDialogPro as CommandDialog, MoonUICommandEmptyPro as CommandEmpty, MoonUICommandGroupPro as CommandGroup, MoonUICommandInputPro as CommandInput, MoonUICommandItemPro as CommandItem, MoonUICommandListPro as CommandList, MoonUICommandSeparatorPro as CommandSeparator, MoonUICommandShortcutPro as CommandShortcut, Dashboard, DataTable, MoonUIDialogPro as Dialog, MoonUIDialogClosePro as DialogClose, MoonUIDialogContentPro as DialogContent, MoonUIDialogDescriptionPro as DialogDescription, MoonUIDialogFooterPro as DialogFooter, MoonUIDialogHeaderPro as DialogHeader, MoonUIDialogTitlePro as DialogTitle, MoonUIDialogTriggerPro as DialogTrigger, DraggableList, MoonUIDropdownMenuPro as DropdownMenu, MoonUIDropdownMenuCheckboxItemPro as DropdownMenuCheckboxItem, MoonUIDropdownMenuContentPro as DropdownMenuContent, MoonUIDropdownMenuGroupPro as DropdownMenuGroup, MoonUIDropdownMenuItemPro as DropdownMenuItem, MoonUIDropdownMenuLabelPro as DropdownMenuLabel, MoonUIDropdownMenuPortalPro as DropdownMenuPortal, MoonUIDropdownMenuRadioGroupPro as DropdownMenuRadioGroup, MoonUIDropdownMenuRadioItemPro as DropdownMenuRadioItem, MoonUIDropdownMenuSeparatorPro as DropdownMenuSeparator, MoonUIDropdownMenuShortcutPro as DropdownMenuShortcut, MoonUIDropdownMenuSubPro as DropdownMenuSub, MoonUIDropdownMenuSubContentPro as DropdownMenuSubContent, MoonUIDropdownMenuSubTriggerPro as DropdownMenuSubTrigger, MoonUIDropdownMenuTriggerPro as DropdownMenuTrigger, ErrorBoundary, FloatingActionButton, FormWizard, FormWizardNavigation, FormWizardProgress, FormWizardStep, MoonUIGalleryItemPro as GalleryItem, GeminiProvider, GestureDrawer, GitHubStars, HealthCheck, HoverCard2 as HoverCard, HoverCard3D, HoverCardContent2 as HoverCardContent, HoverCardTrigger2 as HoverCardTrigger, MoonUIInputPro as Input, Kanban, LANGUAGE_COLORS, MoonUILabelPro as Label, LazyComponent, LazyImage, LazyList, LightboxContent, LightboxProvider, LightboxTrigger, MagneticButton, MoonUIMediaGalleryPro as MediaGallery, MemoryAnalytics, MemoryEfficientData, MoonUIAccordionContentPro, MoonUIAccordionItemPro, MoonUIAccordionPro, MoonUIAccordionTriggerPro, MoonUIAdvancedChartPro, MoonUIAlertDescriptionPro, MoonUIAlertPro, MoonUIAlertTitlePro, MoonUIAnimatedButtonPro, MoonUIAspectRatioPro, MoonUIAsyncAvatarPro, MoonUIAvatarFallbackPro, MoonUIAvatarGroupPro2 as MoonUIAvatarGroupPro, MoonUIAvatarImagePro, MoonUIAvatarPro2 as MoonUIAvatarPro, MoonUIBadgePro, MoonUIBreadcrumbEllipsisPro, MoonUIBreadcrumbItemPro, MoonUIBreadcrumbLinkPro, MoonUIBreadcrumbListPro, MoonUIBreadcrumbPagePro, MoonUIBreadcrumbPro, MoonUIBreadcrumbSeparatorPro, MoonUIButtonPro, MoonUICardContentPro, MoonUICardDescriptionPro, MoonUICardFooterPro, MoonUICardHeaderPro, MoonUICardPro, MoonUICardTitlePro, MoonUICheckboxPro, MoonUICollapsibleContentPro, MoonUICollapsiblePro, MoonUICollapsibleTriggerPro, MoonUIColorPickerPro, MoonUICommandDialogPro, MoonUICommandEmptyPro, MoonUICommandGroupPro, MoonUICommandInputPro, MoonUICommandItemPro, MoonUICommandListPro, MoonUICommandPro, MoonUICommandSeparatorPro, MoonUICommandShortcutPro, MoonUICreditCardInputPro, MoonUIDashboardPro, MoonUIDataTable, MoonUIDataTablePro, MoonUIDialogClosePro, MoonUIDialogContentPro, MoonUIDialogDescriptionPro, MoonUIDialogFooterPro, MoonUIDialogHeaderPro, MoonUIDialogPro, MoonUIDialogTitlePro, MoonUIDialogTriggerPro, DraggableList as MoonUIDraggableListPro, MoonUIDropdownMenuCheckboxItemPro, MoonUIDropdownMenuContentPro, MoonUIDropdownMenuGroupPro, MoonUIDropdownMenuItemPro, MoonUIDropdownMenuLabelPro, MoonUIDropdownMenuPortalPro, MoonUIDropdownMenuPro, MoonUIDropdownMenuRadioGroupPro, MoonUIDropdownMenuRadioItemPro, MoonUIDropdownMenuSeparatorPro, MoonUIDropdownMenuShortcutPro, MoonUIDropdownMenuSubContentPro, MoonUIDropdownMenuSubPro, MoonUIDropdownMenuSubTriggerPro, MoonUIDropdownMenuTriggerPro, MoonUIFileUploadPro, MoonUIFormWizardPro, MoonUIGalleryItemPro, MoonUIGestureDrawerPro, MoonUIInputPro, MoonUILabelPro, LightboxContent as MoonUILightboxContentPro, SimpleLightbox as MoonUILightboxPro, LightboxProvider as MoonUILightboxProviderPro, LightboxTrigger as MoonUILightboxTriggerPro, MoonUIMediaGalleryPro, MoonUIMemoryEfficientDataPro, MoonUINavbarPro, MoonUIPaginationContentPro, MoonUIPaginationEllipsisPro, MoonUIPaginationItemPro, MoonUIPaginationLinkPro, MoonUIPaginationNextPro, MoonUIPaginationPreviousPro, MoonUIPaginationPro, MoonUIPhoneNumberInputPro, MoonUIPhoneNumberInputSimple, MoonUIPopoverContentPro, MoonUIPopoverPro, MoonUIPopoverTriggerPro, MoonUIProgressPro, MoonUIQuizFormPro2 as MoonUIQuizFormPro, MoonUIRadioGroupContextPro, MoonUIRadioGroupItemPro, MoonUIRadioGroupPro, MoonUIRadioItemWithLabelPro, MoonUIRadioLabelPro, MoonUISelectContentPro, MoonUISelectGroupPro, MoonUISelectItemPro, MoonUISelectLabelPro, MoonUISelectPro, MoonUISelectSeparatorPro, MoonUISelectTriggerPro, MoonUISelectValuePro, MoonUISelectableVirtualListPro, MoonUISeparatorPro, MoonUISidebarPro, MoonUISkeletonPro, MoonUISliderPro, MoonUISwipeableCardPro, MoonUISwitchPro, MoonUITableBodyPro, MoonUITableCaptionPro, MoonUITableCellPro, MoonUITableFooterPro, MoonUITableHeadPro, MoonUITableHeaderPro, MoonUITablePro, MoonUITableRowPro, MoonUITabsContentPro, MoonUITabsPro as MoonUITabsEnhanced, MoonUITabsListPro, MoonUITabsPro, MoonUITabsTriggerPro, MoonUITextareaPro, MoonUITimelinePro, MoonUIToastPro, MoonUITogglePro, MoonUITooltipContentPro, MoonUITooltipPro, MoonUITooltipProviderPro, MoonUITooltipTriggerPro, MoonUIVirtualListPro, MoonUIalertVariantsPro, MoonUIaspectRatioVariantsPro, MoonUIbreadcrumbVariantsPro, collapsibleContentVariants as MoonUIcollapsibleContentVariantsPro, collapsibleTriggerVariants as MoonUIcollapsibleTriggerVariantsPro, MoonUIradioGroupItemVariantsPro, MoonUItableVariantsPro, MoonUItoggleVariantsPro, Navbar, NavigationMenu2 as NavigationMenu, NavigationMenuContent2 as NavigationMenuContent, NavigationMenuIndicator2 as NavigationMenuIndicator, NavigationMenuItem2 as NavigationMenuItem, NavigationMenuLink2 as NavigationMenuLink, NavigationMenuList2 as NavigationMenuList, NavigationMenuTrigger2 as NavigationMenuTrigger, NavigationMenuViewport2 as NavigationMenuViewport, OpenAIProvider, OptimizedImage, MoonUIPaginationPro as Pagination, MoonUIPaginationContentPro as PaginationContent, MoonUIPaginationEllipsisPro as PaginationEllipsis, MoonUIPaginationItemPro as PaginationItem, MoonUIPaginationLinkPro as PaginationLink, MoonUIPaginationNextPro as PaginationNext, MoonUIPaginationPreviousPro as PaginationPrevious, PerformanceDebugger, PerformanceMonitor, PhoneNumberInput, PinchZoom, MoonUIPopoverPro as Popover, MoonUIPopoverContentPro as PopoverContent, MoonUIPopoverTriggerPro as PopoverTrigger, MoonUIProgressPro as Progress, QuizForm, MoonUIRadioGroupPro as RadioGroup, MoonUIRadioGroupContextPro as RadioGroupContext, MoonUIRadioGroupItemPro as RadioGroupItem, MoonUIRadioItemWithLabelPro as RadioItemWithLabel, MoonUIRadioLabelPro as RadioLabel, RealTimePerformanceMonitor, RichTextEditor, ScrollArea, ScrollBar, MoonUISelectPro as Select, MoonUISelectContentPro as SelectContent, MoonUISelectGroupPro as SelectGroup, MoonUISelectItemPro as SelectItem, MoonUISelectLabelPro as SelectLabel, MoonUISelectSeparatorPro as SelectSeparator, MoonUISelectTriggerPro as SelectTrigger, MoonUISelectValuePro as SelectValue, SelectableVirtualList, MoonUISeparatorPro as Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SimpleLightbox, MoonUISkeletonPro as Skeleton, MoonUISliderPro as Slider, SpotlightCard, SwipeableCard, MoonUISwitchPro as Switch, MoonUITablePro as Table, MoonUITableBodyPro as TableBody, MoonUITableCaptionPro as TableCaption, MoonUITableCellPro as TableCell, MoonUITableFooterPro as TableFooter, MoonUITableHeadPro as TableHead, MoonUITableHeaderPro as TableHeader, MoonUITableRowPro as TableRow, Tabs, TabsContent, TabsList, TabsTrigger, MoonUITextareaPro as Textarea, Timeline, MoonUIToastPro as Toast, MoonUITogglePro as Toggle, MoonUITooltipPro as Tooltip, MoonUITooltipContentPro as TooltipContent, MoonUITooltipProviderPro as TooltipProvider, MoonUITooltipTriggerPro as TooltipTrigger, VirtualList, MoonUIalertVariantsPro as alertVariants, MoonUIaspectRatioVariantsPro as aspectRatioVariants, moonUIBadgeVariantsPro as badgeVariants, MoonUIbreadcrumbVariantsPro as breadcrumbVariants, moonUIButtonProVariants as buttonVariants, cn, collapsibleContentVariants, collapsibleTriggerVariants, commandVariantsPro, createAIProvider, galleryItemVariants, galleryVariants, getExpandableColumn, hoverCard3DVariants, moonUIAnimatedButtonProVariants, badgeVariants as moonUIAvatarBadgeVariants, avatarVariants as moonUIAvatarProVariants, statusVariants as moonUIAvatarStatusVariants, moonUIBadgeVariantsPro, moonUIButtonProVariants, gestureDrawerVariants as moonUIGestureDrawerProVariants, moonUISeparatorVariantsPro, navigationMenuTriggerStyle, countries as phoneCountries, MoonUIradioGroupItemVariantsPro as radioGroupItemVariants, moonUISeparatorVariantsPro as separatorVariants, MoonUItableVariantsPro as tableVariants, MoonUItoggleVariantsPro as toggleVariants, useAccordionAnalytics, useCollapsibleAnalytics, useExpandableRows, useFormWizard, useStreamingData, useVirtualList };
+export { MoonUIAccordionPro as Accordion, MoonUIAccordionContentPro as AccordionContent, MoonUIAccordionItemPro as AccordionItem, MoonUIAccordionTriggerPro as AccordionTrigger, Calendar3 as AdvancedCalendar, AdvancedChart, AdvancedForms, MoonUIAlertPro as Alert, MoonUIAlertDescriptionPro as AlertDescription, MoonUIAlertTitlePro as AlertTitle, MoonUIAspectRatioPro as AspectRatio, MoonUIAvatarPro as Avatar, MoonUIAvatarFallbackPro as AvatarFallback, MoonUIAvatarImagePro as AvatarImage, MoonUIBadgePro as Badge, MoonUIBreadcrumbPro as Breadcrumb, MoonUIBreadcrumbEllipsisPro as BreadcrumbEllipsis, MoonUIBreadcrumbItemPro as BreadcrumbItem, MoonUIBreadcrumbLinkPro as BreadcrumbLink, MoonUIBreadcrumbListPro as BreadcrumbList, MoonUIBreadcrumbPagePro as BreadcrumbPage, MoonUIBreadcrumbSeparatorPro as BreadcrumbSeparator, MoonUIButtonPro as Button, Calendar, Calendar3 as CalendarPro, MoonUICardPro as Card, MoonUICardContentPro as CardContent, MoonUICardDescriptionPro as CardDescription, MoonUICardFooterPro as CardFooter, MoonUICardHeaderPro as CardHeader, MoonUICardTitlePro as CardTitle, ChartWidget2 as ChartWidget, MoonUICheckboxPro as Checkbox, ClaudeProvider, MoonUICollapsiblePro as Collapsible, MoonUICollapsibleContentPro as CollapsibleContent, MoonUICollapsibleTriggerPro as CollapsibleTrigger, MoonUIColorPickerPro as ColorPicker, MoonUICommandPro as Command, MoonUICommandDialogPro as CommandDialog, MoonUICommandEmptyPro as CommandEmpty, MoonUICommandGroupPro as CommandGroup, MoonUICommandInputPro as CommandInput, MoonUICommandItemPro as CommandItem, MoonUICommandListPro as CommandList, MoonUICommandSeparatorPro as CommandSeparator, MoonUICommandShortcutPro as CommandShortcut, Dashboard, DataTable, MoonUIDialogPro as Dialog, MoonUIDialogClosePro as DialogClose, MoonUIDialogContentPro as DialogContent, MoonUIDialogDescriptionPro as DialogDescription, MoonUIDialogFooterPro as DialogFooter, MoonUIDialogHeaderPro as DialogHeader, MoonUIDialogTitlePro as DialogTitle, MoonUIDialogTriggerPro as DialogTrigger, DraggableList, MoonUIDropdownMenuPro as DropdownMenu, MoonUIDropdownMenuCheckboxItemPro as DropdownMenuCheckboxItem, MoonUIDropdownMenuContentPro as DropdownMenuContent, MoonUIDropdownMenuGroupPro as DropdownMenuGroup, MoonUIDropdownMenuItemPro as DropdownMenuItem, MoonUIDropdownMenuLabelPro as DropdownMenuLabel, MoonUIDropdownMenuPortalPro as DropdownMenuPortal, MoonUIDropdownMenuRadioGroupPro as DropdownMenuRadioGroup, MoonUIDropdownMenuRadioItemPro as DropdownMenuRadioItem, MoonUIDropdownMenuSeparatorPro as DropdownMenuSeparator, MoonUIDropdownMenuShortcutPro as DropdownMenuShortcut, MoonUIDropdownMenuSubPro as DropdownMenuSub, MoonUIDropdownMenuSubContentPro as DropdownMenuSubContent, MoonUIDropdownMenuSubTriggerPro as DropdownMenuSubTrigger, MoonUIDropdownMenuTriggerPro as DropdownMenuTrigger, ErrorBoundary, FloatingActionButton, FormWizard, FormWizardNavigation, FormWizardProgress, FormWizardStep, FunnelWidget, MoonUIGalleryItemPro as GalleryItem, GaugeWidget, GeminiProvider, GestureDrawer, GitHubStars, HealthCheck, HoverCard2 as HoverCard, HoverCard3D, HoverCardContent2 as HoverCardContent, HoverCardTrigger2 as HoverCardTrigger, MoonUIInputPro as Input, KPIWidget, Kanban, LANGUAGE_COLORS, MoonUILabelPro as Label, LazyComponent, LazyImage, LazyList, LightboxContent, LightboxProvider, LightboxTrigger, MagneticButton, MoonUIMediaGalleryPro as MediaGallery, MemoryAnalytics, MemoryEfficientData, MoonUIAccordionContentPro, MoonUIAccordionItemPro, MoonUIAccordionPro, MoonUIAccordionTriggerPro, MoonUIAdvancedChartPro, MoonUIAlertDescriptionPro, MoonUIAlertPro, MoonUIAlertTitlePro, MoonUIAnimatedButtonPro, MoonUIAspectRatioPro, MoonUIAsyncAvatarPro, MoonUIAvatarFallbackPro, MoonUIAvatarGroupPro2 as MoonUIAvatarGroupPro, MoonUIAvatarImagePro, MoonUIAvatarPro2 as MoonUIAvatarPro, MoonUIBadgePro, MoonUIBreadcrumbEllipsisPro, MoonUIBreadcrumbItemPro, MoonUIBreadcrumbLinkPro, MoonUIBreadcrumbListPro, MoonUIBreadcrumbPagePro, MoonUIBreadcrumbPro, MoonUIBreadcrumbSeparatorPro, MoonUIButtonPro, MoonUICardContentPro, MoonUICardDescriptionPro, MoonUICardFooterPro, MoonUICardHeaderPro, MoonUICardPro, MoonUICardTitlePro, MoonUICheckboxPro, MoonUICollapsibleContentPro, MoonUICollapsiblePro, MoonUICollapsibleTriggerPro, MoonUIColorPickerPro, MoonUICommandDialogPro, MoonUICommandEmptyPro, MoonUICommandGroupPro, MoonUICommandInputPro, MoonUICommandItemPro, MoonUICommandListPro, MoonUICommandPro, MoonUICommandSeparatorPro, MoonUICommandShortcutPro, MoonUICreditCardInputPro, MoonUIDashboardPro, MoonUIDataTable, MoonUIDataTablePro, MoonUIDialogClosePro, MoonUIDialogContentPro, MoonUIDialogDescriptionPro, MoonUIDialogFooterPro, MoonUIDialogHeaderPro, MoonUIDialogPro, MoonUIDialogTitlePro, MoonUIDialogTriggerPro, DraggableList as MoonUIDraggableListPro, MoonUIDropdownMenuCheckboxItemPro, MoonUIDropdownMenuContentPro, MoonUIDropdownMenuGroupPro, MoonUIDropdownMenuItemPro, MoonUIDropdownMenuLabelPro, MoonUIDropdownMenuPortalPro, MoonUIDropdownMenuPro, MoonUIDropdownMenuRadioGroupPro, MoonUIDropdownMenuRadioItemPro, MoonUIDropdownMenuSeparatorPro, MoonUIDropdownMenuShortcutPro, MoonUIDropdownMenuSubContentPro, MoonUIDropdownMenuSubPro, MoonUIDropdownMenuSubTriggerPro, MoonUIDropdownMenuTriggerPro, MoonUIFileUploadPro, MoonUIFormWizardPro, MoonUIGalleryItemPro, MoonUIGestureDrawerPro, MoonUIInputPro, MoonUILabelPro, LightboxContent as MoonUILightboxContentPro, SimpleLightbox as MoonUILightboxPro, LightboxProvider as MoonUILightboxProviderPro, LightboxTrigger as MoonUILightboxTriggerPro, MoonUIMediaGalleryPro, MoonUIMemoryEfficientDataPro, MoonUINavbarPro, MoonUIPaginationContentPro, MoonUIPaginationEllipsisPro, MoonUIPaginationItemPro, MoonUIPaginationLinkPro, MoonUIPaginationNextPro, MoonUIPaginationPreviousPro, MoonUIPaginationPro, MoonUIPhoneNumberInputPro, MoonUIPhoneNumberInputSimple, MoonUIPopoverContentPro, MoonUIPopoverPro, MoonUIPopoverTriggerPro, MoonUIProgressPro, MoonUIQuizFormPro2 as MoonUIQuizFormPro, MoonUIRadioGroupContextPro, MoonUIRadioGroupItemPro, MoonUIRadioGroupPro, MoonUIRadioItemWithLabelPro, MoonUIRadioLabelPro, MoonUISelectContentPro, MoonUISelectGroupPro, MoonUISelectItemPro, MoonUISelectLabelPro, MoonUISelectPro, MoonUISelectSeparatorPro, MoonUISelectTriggerPro, MoonUISelectValuePro, MoonUISelectableVirtualListPro, MoonUISeparatorPro, MoonUISidebarPro, MoonUISkeletonPro, MoonUISliderPro, MoonUISwipeableCardPro, MoonUISwitchPro, MoonUITableBodyPro, MoonUITableCaptionPro, MoonUITableCellPro, MoonUITableFooterPro, MoonUITableHeadPro, MoonUITableHeaderPro, MoonUITablePro, MoonUITableRowPro, MoonUITabsContentPro, MoonUITabsPro as MoonUITabsEnhanced, MoonUITabsListPro, MoonUITabsPro, MoonUITabsTriggerPro, MoonUITextareaPro, MoonUITimelinePro, MoonUIToastPro, MoonUITogglePro, MoonUITooltipContentPro, MoonUITooltipPro, MoonUITooltipProviderPro, MoonUITooltipTriggerPro, MoonUIVirtualListPro, MoonUIalertVariantsPro, MoonUIaspectRatioVariantsPro, MoonUIbreadcrumbVariantsPro, collapsibleContentVariants as MoonUIcollapsibleContentVariantsPro, collapsibleTriggerVariants as MoonUIcollapsibleTriggerVariantsPro, MoonUIradioGroupItemVariantsPro, MoonUItableVariantsPro, MoonUItoggleVariantsPro, Navbar, NavigationMenu2 as NavigationMenu, NavigationMenuContent2 as NavigationMenuContent, NavigationMenuIndicator2 as NavigationMenuIndicator, NavigationMenuItem2 as NavigationMenuItem, NavigationMenuLink2 as NavigationMenuLink, NavigationMenuList2 as NavigationMenuList, NavigationMenuTrigger2 as NavigationMenuTrigger, NavigationMenuViewport2 as NavigationMenuViewport, OpenAIProvider, OptimizedImage, MoonUIPaginationPro as Pagination, MoonUIPaginationContentPro as PaginationContent, MoonUIPaginationEllipsisPro as PaginationEllipsis, MoonUIPaginationItemPro as PaginationItem, MoonUIPaginationLinkPro as PaginationLink, MoonUIPaginationNextPro as PaginationNext, MoonUIPaginationPreviousPro as PaginationPrevious, PerformanceDebugger, PerformanceMonitor, PhoneNumberInput, PinchZoom, MoonUIPopoverPro as Popover, MoonUIPopoverContentPro as PopoverContent, MoonUIPopoverTriggerPro as PopoverTrigger, MoonUIProgressPro as Progress, QuizForm, MoonUIRadioGroupPro as RadioGroup, MoonUIRadioGroupContextPro as RadioGroupContext, MoonUIRadioGroupItemPro as RadioGroupItem, MoonUIRadioItemWithLabelPro as RadioItemWithLabel, MoonUIRadioLabelPro as RadioLabel, RealTimePerformanceMonitor, RevenueWidget, RichTextEditor, ScrollArea, ScrollBar, MoonUISelectPro as Select, MoonUISelectContentPro as SelectContent, MoonUISelectGroupPro as SelectGroup, MoonUISelectItemPro as SelectItem, MoonUISelectLabelPro as SelectLabel, MoonUISelectSeparatorPro as SelectSeparator, MoonUISelectTriggerPro as SelectTrigger, MoonUISelectValuePro as SelectValue, SelectableVirtualList, MoonUISeparatorPro as Separator, ServerMonitorWidget, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SimpleLightbox, MoonUISkeletonPro as Skeleton, MoonUISliderPro as Slider, SpotlightCard, SwipeableCard, MoonUISwitchPro as Switch, MoonUITablePro as Table, MoonUITableBodyPro as TableBody, MoonUITableCaptionPro as TableCaption, MoonUITableCellPro as TableCell, MoonUITableFooterPro as TableFooter, MoonUITableHeadPro as TableHead, MoonUITableHeaderPro as TableHeader, MoonUITableRowPro as TableRow, Tabs, TabsContent, TabsList, TabsTrigger, MoonUITextareaPro as Textarea, Timeline, MoonUIToastPro as Toast, MoonUITogglePro as Toggle, MoonUITooltipPro as Tooltip, MoonUITooltipContentPro as TooltipContent, MoonUITooltipProviderPro as TooltipProvider, MoonUITooltipTriggerPro as TooltipTrigger, VirtualList, WidgetBase, MoonUIalertVariantsPro as alertVariants, MoonUIaspectRatioVariantsPro as aspectRatioVariants, moonUIBadgeVariantsPro as badgeVariants, MoonUIbreadcrumbVariantsPro as breadcrumbVariants, moonUIButtonProVariants as buttonVariants, cn, collapsibleContentVariants, collapsibleTriggerVariants, commandVariantsPro, createAIProvider, galleryItemVariants, galleryVariants, getExpandableColumn, hoverCard3DVariants, moonUIAnimatedButtonProVariants, badgeVariants as moonUIAvatarBadgeVariants, avatarVariants as moonUIAvatarProVariants, statusVariants as moonUIAvatarStatusVariants, moonUIBadgeVariantsPro, moonUIButtonProVariants, gestureDrawerVariants as moonUIGestureDrawerProVariants, moonUISeparatorVariantsPro, navigationMenuTriggerStyle, countries as phoneCountries, MoonUIradioGroupItemVariantsPro as radioGroupItemVariants, moonUISeparatorVariantsPro as separatorVariants, MoonUItableVariantsPro as tableVariants, MoonUItoggleVariantsPro as toggleVariants, useAccordionAnalytics, useCollapsibleAnalytics, useExpandableRows, useFormWizard, useStreamingData, useVirtualList };