@wow-two-beta/ui 0.0.60 → 0.0.61

package/dist/{chunk-2N3N3IE2.js → chunk-GDJMPYPU.js}

@@ -1,8 +1,8 @@
-import { Kbd, addDays, MONTHS_LONG, startOfDay, WEEKDAYS_SHORT, isToday, addMonths, isSameDay } from './chunk-XDATW7NF.js';
+import { Kbd, addDays, MONTHS_LONG, startOfDay, WEEKDAYS_SHORT, isToday, addMonths, isSameDay } from './chunk-3SWPYYRQ.js';
 import { Inline } from './chunk-4XWLEKH2.js';
 import { useClipboard, useControlled, useReducedMotion, useEscape } from './chunk-V267IMBH.js';
 import { Icon } from './chunk-MVMDDGW7.js';
-import { tv, CssExtensions, surfaceVariants, dataAttr, composeEventHandlers, Tones } from './chunk-JYGC5SRP.js';
+import { tv, CssExtensions, surfaceVariants, dataAttr, composeEventHandlers, Tones } from './chunk-DX7FYAKY.js';
 import { Slot, RovingFocusGroup, useRovingFocusItem, Portal, AnchoredPositioner } from './chunk-TTSJZEL7.js';
 import { useId as useId$1 } from './chunk-LGTGZ3RW.js';
 import { cn, composeRefs } from './chunk-X2MYOHOB.js';
@@ -5848,7 +5848,129 @@ var PricingCard = forwardRef(
   )
 );
 PricingCard.displayName = "PricingCard";
+var SortableContext = createContext(null);
+var ItemContext = createContext(null);
+var useSortableRoot = () => {
+  const ctx = useContext(SortableContext);
+  if (!ctx) throw new Error("Sortable.Item must be rendered inside <Sortable>.");
+  return ctx;
+};
+var useSortableItem = () => {
+  const ctx = useContext(ItemContext);
+  if (!ctx) throw new Error("Sortable.Handle must be rendered inside <Sortable.Item>.");
+  return ctx;
+};
+var SortableRoot = forwardRef(
+  ({ onReorder, className, children, ...props }, ref) => {
+    const [dragIndex, setDragIndex] = useState(null);
+    const [overIndex, setOverIndex] = useState(null);
+    const dragRef = useRef(null);
+    const overRef = useRef(null);
+    const begin = useCallback((index) => {
+      dragRef.current = index;
+      setDragIndex(index);
+    }, []);
+    const hover = useCallback((index) => {
+      overRef.current = index;
+      setOverIndex(index);
+    }, []);
+    const end = useCallback(() => {
+      const from = dragRef.current;
+      const to = overRef.current;
+      if (from !== null && to !== null && from !== to) onReorder(from, to);
+      dragRef.current = null;
+      overRef.current = null;
+      setDragIndex(null);
+      setOverIndex(null);
+    }, [onReorder]);
+    const move = useCallback(
+      (from, to) => {
+        if (from !== to && to >= 0) onReorder(from, to);
+      },
+      [onReorder]
+    );
+    return /* @__PURE__ */ jsx(SortableContext.Provider, { value: { dragIndex, overIndex, begin, hover, end, move }, children: /* @__PURE__ */ jsx("div", { ref, className: cn("flex flex-col", className), ...props, children }) });
+  }
+);
+SortableRoot.displayName = "Sortable";
+var SortableItem = forwardRef(
+  ({ index, className, children, ...props }, ref) => {
+    const { dragIndex, overIndex, begin, hover, end } = useSortableRoot();
+    const [armed, setArmed] = useState(false);
+    const isDragging = dragIndex === index;
+    const isOver = overIndex === index && dragIndex !== null && dragIndex !== index;
+    return /* @__PURE__ */ jsx(ItemContext.Provider, { value: { index, arm: () => setArmed(true), disarm: () => setArmed(false) }, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        draggable: armed,
+        onDragStart: (e) => {
+          e.dataTransfer.effectAllowed = "move";
+          begin(index);
+        },
+        onDragEnter: () => hover(index),
+        onDragOver: (e) => {
+          if (dragIndex !== null) e.preventDefault();
+        },
+        onDrop: (e) => {
+          e.preventDefault();
+          end();
+          setArmed(false);
+        },
+        onDragEnd: () => {
+          end();
+          setArmed(false);
+        },
+        "data-dragging": isDragging || void 0,
+        "data-over": isOver || void 0,
+        className: cn("transition-opacity", isDragging && "opacity-50", className),
+        ...props,
+        children
+      }
+    ) });
+  }
+);
+SortableItem.displayName = "Sortable.Item";
+var SortableHandle = forwardRef(
+  ({ className, onKeyDown, children, ...props }, ref) => {
+    const { index, arm, disarm } = useSortableItem();
+    const { move } = useSortableRoot();
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref,
+        type: "button",
+        "aria-label": "Drag to reorder",
+        "aria-roledescription": "sortable item handle",
+        onPointerDown: arm,
+        onPointerUp: disarm,
+        onBlur: disarm,
+        onKeyDown: (e) => {
+          if (e.key === "ArrowUp") {
+            e.preventDefault();
+            move(index, index - 1);
+          } else if (e.key === "ArrowDown") {
+            e.preventDefault();
+            move(index, index + 1);
+          }
+          onKeyDown?.(e);
+        },
+        className: cn(
+          "inline-flex cursor-grab touch-none items-center justify-center text-subtle-foreground transition-colors hover:text-muted-foreground active:cursor-grabbing",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+SortableHandle.displayName = "Sortable.Handle";
+var Sortable = Object.assign(SortableRoot, {
+  Item: SortableItem,
+  Handle: SortableHandle
+});
 
-export { Accordion2 as Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityFeed, ActivityItem, AnimatedNumber, AnnotationMarker, AudioPlayer, AudioWaveform, Avatar, AvatarGroup, Badge, BadgeOverlay, Card, Carousel, CarouselDot, CarouselDots, CarouselNext, CarouselPrev, CarouselSlide, CarouselSlides, CarouselViewport, ChatBubble, Code, Collapsible, CollapsibleContent, CollapsibleTrigger, Comment, CommentThread, Confetti, CountBadge, CountUp, DataGrid, DataTable, DaySeparator, DescriptionList, DiffViewer, EmptyState, EventCalendar, Eyebrow, FeatureCard, Gantt, GradientText, Heading, HeatmapCalendar, Highlight, Image, InfoRow, KeyboardShortcut, List, ListItem, Mark, Marquee, MessageList, MetaInline, MetricChip, NodeEditor, NotificationDot, PDFViewer, PricingCard, Quote, ReactionBar, ScheduleView, ScrollReveal, SectionHeader, Separator, Snippet, Sparkline, Stat, Status, StepCard, SwipeActions, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeaderCell, TableRow, Tabs, TabsList, TabsPanel, TabsTab, Text, ThreadView, Tilt, Timeline, TimelineDescription, TimelineItem, TimelineTitle, Tooltip, Tree, TreeGroup, TreeItem, Typewriter, VideoPlayer, avatarVariants, badgeVariants, codeVariants, headingVariants, textVariants };
-//# sourceMappingURL=chunk-2N3N3IE2.js.map
-//# sourceMappingURL=chunk-2N3N3IE2.js.map
+export { Accordion2 as Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityFeed, ActivityItem, AnimatedNumber, AnnotationMarker, AudioPlayer, AudioWaveform, Avatar, AvatarGroup, Badge, BadgeOverlay, Card, Carousel, CarouselDot, CarouselDots, CarouselNext, CarouselPrev, CarouselSlide, CarouselSlides, CarouselViewport, ChatBubble, Code, Collapsible, CollapsibleContent, CollapsibleTrigger, Comment, CommentThread, Confetti, CountBadge, CountUp, DataGrid, DataTable, DaySeparator, DescriptionList, DiffViewer, EmptyState, EventCalendar, Eyebrow, FeatureCard, Gantt, GradientText, Heading, HeatmapCalendar, Highlight, Image, InfoRow, KeyboardShortcut, List, ListItem, Mark, Marquee, MessageList, MetaInline, MetricChip, NodeEditor, NotificationDot, PDFViewer, PricingCard, Quote, ReactionBar, ScheduleView, ScrollReveal, SectionHeader, Separator, Snippet, Sortable, Sparkline, Stat, Status, StepCard, SwipeActions, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeaderCell, TableRow, Tabs, TabsList, TabsPanel, TabsTab, Text, ThreadView, Tilt, Timeline, TimelineDescription, TimelineItem, TimelineTitle, Tooltip, Tree, TreeGroup, TreeItem, Typewriter, VideoPlayer, avatarVariants, badgeVariants, codeVariants, headingVariants, textVariants };
+//# sourceMappingURL=chunk-GDJMPYPU.js.map
+//# sourceMappingURL=chunk-GDJMPYPU.js.map