feat: 引入 yuxiang-kit 课程组件源码与运行时

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/components/course-interactions/drag-drop/Draggable.tsx

@@ -0,0 +1,56 @@
+import { useDraggable } from "@dnd-kit/core";
+import { CSS } from "@dnd-kit/utilities";
+import { cn } from "@/lib/cn";
+import styles from "./DragDrop.module.css";
+import type { DraggableProps } from "./DragDrop.types";
+import { useDragDropContext } from "./DragDropContext";
+
+export function Draggable({
+	id,
+	children,
+	disabled = false,
+	data,
+	className,
+	style,
+	...props
+}: DraggableProps) {
+	const { getScaledTransform, hasOverlay } = useDragDropContext();
+	const { attributes, listeners, setNodeRef, transform, isDragging } =
+		useDraggable({
+			id,
+			data,
+			disabled,
+		});
+	const scaledTransform = getScaledTransform(transform);
+	const state = {
+		isDragging,
+		disabled,
+	};
+	const resolvedClassName =
+		typeof className === "function" ? className(state) : className;
+	const resolvedChildren =
+		typeof children === "function" ? children(state) : children;
+
+	return (
+		<div
+			ref={setNodeRef}
+			className={cn(
+				styles.draggable,
+				isDragging && styles.dragging,
+				disabled && styles.disabled,
+				resolvedClassName,
+			)}
+			style={{
+				...style,
+				transform: hasOverlay
+					? style?.transform
+					: CSS.Translate.toString(scaledTransform),
+			}}
+			{...attributes}
+			{...listeners}
+			{...props}
+		>
+			{resolvedChildren}
+		</div>
+	);
+}