@moontra/moonui-pro 2.0.11 → 2.0.12

package/dist/index.mjs

@@ -14,6 +14,7 @@ import { useSyncExternalStoreWithSelector } from 'use-sync-external-store/shim/w
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { cn as cn$1 } from '@moontra/moonui';
 import { ResponsiveContainer, ScatterChart, CartesianGrid, XAxis, YAxis, Tooltip as Tooltip$1, Legend, Scatter, PieChart, Pie, Cell, AreaChart, Area, ReferenceLine, Brush, BarChart, Bar, LineChart, Line, ReferenceArea } from 'recharts';
+import { DragDropContext, Droppable, Draggable } from '@hello-pangea/dnd';
 
 /**
  * @moontra/moonui-pro v2.0.9
@@ -54997,5 +54998,81 @@ function Dashboard({
     ] })
   ] });
 }
+function DraggableList({
+  items,
+  onReorder,
+  renderItem,
+  keyExtractor,
+  direction = "vertical",
+  className,
+  droppableId = "draggable-list",
+  disabled = false
+}) {
+  const handleDragEnd = (result) => {
+    if (!result.destination || disabled) {
+      return;
+    }
+    const sourceIndex = result.source.index;
+    const destinationIndex = result.destination.index;
+    if (sourceIndex === destinationIndex) {
+      return;
+    }
+    const newItems = Array.from(items);
+    const [reorderedItem] = newItems.splice(sourceIndex, 1);
+    newItems.splice(destinationIndex, 0, reorderedItem);
+    onReorder(newItems);
+  };
+  return /* @__PURE__ */ jsx(DragDropContext, { onDragEnd: handleDragEnd, children: /* @__PURE__ */ jsx(
+    Droppable,
+    {
+      droppableId,
+      direction,
+      isDropDisabled: disabled,
+      children: (provided, snapshot) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ...provided.droppableProps,
+          ref: provided.innerRef,
+          className: cn$1(
+            "space-y-2",
+            direction === "horizontal" && "flex space-y-0 space-x-2",
+            snapshot.isDraggingOver && "bg-muted/50 rounded-lg",
+            className
+          ),
+          children: [
+            items.map((item, index2) => /* @__PURE__ */ jsx(
+              Draggable,
+              {
+                draggableId: keyExtractor(item),
+                index: index2,
+                isDragDisabled: disabled,
+                children: (provided2, snapshot2) => /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    ref: provided2.innerRef,
+                    ...provided2.draggableProps,
+                    ...provided2.dragHandleProps,
+                    className: cn$1(
+                      "transition-all duration-200",
+                      snapshot2.isDragging && "rotate-2 scale-105 shadow-lg z-50",
+                      disabled && "cursor-not-allowed opacity-50"
+                    ),
+                    style: {
+                      ...provided2.draggableProps.style,
+                      transform: snapshot2.isDragging ? provided2.draggableProps.style?.transform : "none"
+                    },
+                    children: renderItem(item, index2)
+                  }
+                )
+              },
+              keyExtractor(item)
+            )),
+            provided.placeholder
+          ]
+        }
+      )
+    }
+  ) });
+}
 
-export { AdvancedChart, Calendar2 as Calendar, Dashboard, Kanban, MemoryAnalytics, MemoryEfficientData, RichTextEditor, SelectableVirtualList, SwipeableCard, Timeline, VirtualList, useStreamingData, useVirtualList };
+export { AdvancedChart, Calendar2 as Calendar, Dashboard, DraggableList, Kanban, MemoryAnalytics, MemoryEfficientData, RichTextEditor, SelectableVirtualList, SwipeableCard, Timeline, VirtualList, useStreamingData, useVirtualList };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moontra/moonui-pro",
-  "version": "2.0.11",
+  "version": "2.0.12",
   "description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
   "type": "module",
   "main": "dist/index.mjs",