sa2kit 1.6.29 → 1.6.31

package/dist/index.mjs

@@ -1,21 +1,22 @@
-import { Dialog, DialogContent, Avatar, AvatarImage, AvatarFallback, Button, Timeline, CollisionBalls, FilterButtonGroup, BackButton, Grid, Badge } from './chunk-LFG6FPM5.mjs';
-export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, AvatarFallback, AvatarImage, BackButton, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CollisionBalls, ConfirmModal, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FilterButtonGroup, GenericOrderManager, Grid, Input, Label, Modal, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, ScrollArea, ScrollBar, SearchBox, SearchResultHint, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Timeline, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants } from './chunk-LFG6FPM5.mjs';
-import './chunk-6MQUBPKB.mjs';
-import './chunk-QAT2RWAO.mjs';
-import './chunk-ESRCX5TQ.mjs';
-import './chunk-6YKMCPQI.mjs';
+import { Dialog, DialogContent, Avatar, AvatarImage, AvatarFallback, Button, Timeline, CollisionBalls, FilterButtonGroup, BackButton, Grid, Badge } from './chunk-KIP2CERU.mjs';
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, Avatar, AvatarFallback, AvatarImage, BackButton, Badge, Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CollisionBalls, ConfirmModal, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, FilterButtonGroup, GenericOrderManager, Grid, Input, Label, Modal, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, ScrollArea, ScrollBar, SearchBox, SearchResultHint, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Timeline, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants } from './chunk-KIP2CERU.mjs';
+import './chunk-LJ4CCSSY.mjs';
+import './chunk-Z36R3P62.mjs';
+import './chunk-52TN2QSS.mjs';
+import './chunk-KZKIH4AS.mjs';
 import { useAuth } from './chunk-KW5JH6V6.mjs';
-import './chunk-OCR5DS4C.mjs';
+import './chunk-PE5EAHZK.mjs';
 import './chunk-AIKEVVDR.mjs';
-import { cn } from './chunk-3BGPZN4X.mjs';
-export { arrayUtils, cn, debugUtils, errorUtils, fileUtils, formatTime, japaneseUtils, stringUtils, validators } from './chunk-3BGPZN4X.mjs';
-export { useAsyncStorage, useElectronStorage, useLocalStorage, useStorage, useTaroStorage } from './chunk-T5OZHYVM.mjs';
-import './chunk-OLHGZXN3.mjs';
-export { ConsoleLoggerAdapter, LogLevel, Logger, createLogger, logger } from './chunk-KQGP6BTS.mjs';
+import { cn } from './chunk-3NHAT7D4.mjs';
+export { arrayUtils, cn, debugUtils, errorUtils, fileUtils, formatTime, japaneseUtils, stringUtils, validators } from './chunk-3NHAT7D4.mjs';
+export { useAsyncStorage, useElectronStorage, useLocalStorage, useStorage, useTaroStorage } from './chunk-TVROG2Q4.mjs';
+import './chunk-WEEXCPSE.mjs';
+export { ConsoleLoggerAdapter, LogLevel, Logger, createLogger, logger } from './chunk-3DXPQ4YV.mjs';
 import './chunk-BJTO5JO5.mjs';
 import React12, { useState, useRef, useCallback, useEffect } from 'react';
 import { createWorker } from 'tesseract.js';
 import { Upload, X, Loader2, FileText, Eraser, Download, MessageSquare, Send, Bot, User, Shield, AlertTriangle, FlaskConical, LogOut, Meh, Frown, Smile } from 'lucide-react';
+import { clsx } from 'clsx';
 import Link from 'next/link';
 import { createPortal } from 'react-dom';
 import { useSensors, useSensor, PointerSensor, TouchSensor, KeyboardSensor, DndContext, closestCenter } from '@dnd-kit/core';
@@ -152,7 +153,7 @@ var OCRScanner = ({
   return /* @__PURE__ */ React12.createElement(
     "div",
     {
-      className: `p-6 border-2 border-dashed rounded-xl transition-all ${isProcessing ? "border-blue-400 bg-blue-50/10" : "border-gray-200 hover:border-blue-400"} ${className}`,
+      className: clsx("p-6 border-2 border-dashed rounded-xl transition-all", isProcessing ? "border-blue-400 bg-blue-50/10" : "border-gray-200 hover:border-blue-400", className),
       onDragOver: handleDragOver,
       onDrop: handleDrop
     },
@@ -169,7 +170,7 @@ var OCRScanner = ({
       {
         src: imagePreview,
         alt: "Preview",
-        className: `max-h-64 mx-auto object-contain transition-opacity ${isProcessing ? "opacity-50" : "opacity-100"}`
+        className: clsx("max-h-64 mx-auto object-contain transition-opacity", isProcessing ? "opacity-50" : "opacity-100")
       }
     ), !isProcessing && /* @__PURE__ */ React12.createElement(
       "button",
@@ -182,9 +183,9 @@ var OCRScanner = ({
       "div",
       {
         className: "bg-blue-500 h-full transition-all duration-300",
-        style: { width: `${progress * 100}%` }
+        style: { width: progress * 100 + "%" }
       }
-    )), /* @__PURE__ */ React12.createElement("p", { className: "text-xs font-medium text-blue-600 mt-2" }, status === "initializing" ? "\u6B63\u5728\u52A0\u8F7D\u5F15\u64CE..." : `\u8BC6\u522B\u4E2D ${Math.round(progress * 100)}%`))), result && !isProcessing && /* @__PURE__ */ React12.createElement("div", { className: "bg-gray-50 p-4 rounded-lg border border-gray-100 animate-in fade-in slide-in-from-bottom-2" }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-2 mb-2 text-gray-600 font-medium" }, /* @__PURE__ */ React12.createElement(FileText, { size: 18 }), /* @__PURE__ */ React12.createElement("span", null, "\u8BC6\u522B\u7ED3\u679C (\u7F6E\u4FE1\u5EA6: ", Math.round(result.confidence), "%)")), /* @__PURE__ */ React12.createElement("pre", { className: "text-sm text-gray-800 whitespace-pre-wrap font-sans" }, result.text)), error && /* @__PURE__ */ React12.createElement("div", { className: "p-3 bg-red-50 text-red-600 text-sm rounded-lg border border-red-100" }, "\u8BC6\u522B\u5931\u8D25: ", error.message)),
+    )), /* @__PURE__ */ React12.createElement("p", { className: "text-xs font-medium text-blue-600 mt-2" }, status === "initializing" ? "\u6B63\u5728\u52A0\u8F7D\u5F15\u64CE..." : "\u8BC6\u522B\u4E2D " + Math.round(progress * 100) + "%"))), result && !isProcessing && /* @__PURE__ */ React12.createElement("div", { className: "bg-gray-50 p-4 rounded-lg border border-gray-100 animate-in fade-in slide-in-from-bottom-2" }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-2 mb-2 text-gray-600 font-medium" }, /* @__PURE__ */ React12.createElement(FileText, { size: 18 }), /* @__PURE__ */ React12.createElement("span", null, "\u8BC6\u522B\u7ED3\u679C (\u7F6E\u4FE1\u5EA6: ", Math.round(result.confidence), "%)")), /* @__PURE__ */ React12.createElement("pre", { className: "text-sm text-gray-800 whitespace-pre-wrap font-sans" }, result.text)), error && /* @__PURE__ */ React12.createElement("div", { className: "p-3 bg-red-50 text-red-600 text-sm rounded-lg border border-red-100" }, "\u8BC6\u522B\u5931\u8D25: ", error.message)),
     /* @__PURE__ */ React12.createElement(
       "input",
       {
@@ -333,7 +334,7 @@ var BackgroundRemover = ({
     a.download = "removed_background.png";
     a.click();
   };
-  return /* @__PURE__ */ React12.createElement("div", { className: `p-6 border-2 border-dashed rounded-xl transition-all ${isProcessing ? "border-purple-400 bg-purple-50/10" : "border-gray-200 hover:border-purple-400"} ${className}` }, !imagePreview ? /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement("div", { className: clsx("p-6 border-2 border-dashed rounded-xl transition-all", isProcessing ? "border-purple-400 bg-purple-50/10" : "border-gray-200 hover:border-purple-400", className) }, !imagePreview ? /* @__PURE__ */ React12.createElement(
     "div",
     {
       className: "flex flex-col items-center justify-center cursor-pointer space-y-4",
@@ -345,7 +346,7 @@ var BackgroundRemover = ({
     "div",
     {
       className: "bg-purple-500 h-full transition-all duration-300",
-      style: { width: `${progress * 100}%` }
+      style: { width: progress * 100 + "%" }
     }
   )), /* @__PURE__ */ React12.createElement("p", { className: "text-[10px] mt-2 font-mono uppercase" }, status.replace(/-/g, " "))) : /* @__PURE__ */ React12.createElement("span", { className: "text-sm italic" }, "\u7B49\u5F85\u5904\u7406..."))))), /* @__PURE__ */ React12.createElement("div", { className: "flex justify-between items-center pt-2" }, !isProcessing && /* @__PURE__ */ React12.createElement(
     "button",
@@ -500,7 +501,7 @@ var SentimentAnalyzer = ({
         return "bg-yellow-50 border-yellow-200 text-yellow-700";
     }
   };
-  return /* @__PURE__ */ React12.createElement("div", { className: `p-6 border rounded-xl bg-white dark:bg-gray-800 shadow-sm ${className}` }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-2 mb-4 text-gray-700 dark:text-gray-300 font-medium" }, /* @__PURE__ */ React12.createElement(MessageSquare, { size: 20 }), /* @__PURE__ */ React12.createElement("span", null, "\u6587\u672C\u60C5\u611F\u5206\u6790")), /* @__PURE__ */ React12.createElement("div", { className: "relative" }, /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement("div", { className: clsx("p-6 border rounded-xl bg-white dark:bg-gray-800 shadow-sm", className) }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-center gap-2 mb-4 text-gray-700 dark:text-gray-300 font-medium" }, /* @__PURE__ */ React12.createElement(MessageSquare, { size: 20 }), /* @__PURE__ */ React12.createElement("span", null, "\u6587\u672C\u60C5\u611F\u5206\u6790")), /* @__PURE__ */ React12.createElement("div", { className: "relative" }, /* @__PURE__ */ React12.createElement(
     "textarea",
     {
       value: text,
@@ -517,7 +518,7 @@ var SentimentAnalyzer = ({
       className: "absolute bottom-3 right-3 p-2 bg-blue-600 hover:bg-blue-700 disabled:bg-gray-400 text-white rounded-md transition-colors shadow-sm"
     },
     isProcessing ? /* @__PURE__ */ React12.createElement(Loader2, { className: "animate-spin", size: 18 }) : /* @__PURE__ */ React12.createElement(Send, { size: 18 })
-  )), isProcessing && /* @__PURE__ */ React12.createElement("div", { className: "mt-4 flex items-center gap-2 text-sm text-blue-600 animate-pulse" }, /* @__PURE__ */ React12.createElement(Loader2, { size: 14, className: "animate-spin" }), /* @__PURE__ */ React12.createElement("span", null, "\u6B63\u5728\u5206\u6790 (\u9996\u6B21\u8FD0\u884C\u5C06\u52A0\u8F7D\u6A21\u578B\u8D44\u6E90)...")), result && !isProcessing && /* @__PURE__ */ React12.createElement("div", { className: `mt-4 p-4 border rounded-lg flex items-center gap-4 animate-in fade-in slide-in-from-top-2 ${getSentimentColor()}` }, /* @__PURE__ */ React12.createElement("div", { className: "p-2 bg-white rounded-full shadow-sm" }, getSentimentIcon()), /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("p", { className: "font-bold text-lg capitalize" }, result.sentiment), /* @__PURE__ */ React12.createElement("p", { className: "text-sm opacity-80" }, "\u7F6E\u4FE1\u5EA6: ", (result.score * 100).toFixed(1), "% (", result.label, ")"))), error && /* @__PURE__ */ React12.createElement("div", { className: "mt-4 p-3 bg-red-50 text-red-600 text-sm rounded-lg border border-red-100" }, "\u5206\u6790\u5931\u8D25: ", error.message));
+  )), isProcessing && /* @__PURE__ */ React12.createElement("div", { className: "mt-4 flex items-center gap-2 text-sm text-blue-600 animate-pulse" }, /* @__PURE__ */ React12.createElement(Loader2, { size: 14, className: "animate-spin" }), /* @__PURE__ */ React12.createElement("span", null, "\u6B63\u5728\u5206\u6790 (\u9996\u6B21\u8FD0\u884C\u5C06\u52A0\u8F7D\u6A21\u578B\u8D44\u6E90)...")), result && !isProcessing && /* @__PURE__ */ React12.createElement("div", { className: clsx("mt-4 p-4 border rounded-lg flex items-center gap-4 animate-in fade-in slide-in-from-top-2", getSentimentColor()) }, /* @__PURE__ */ React12.createElement("div", { className: "p-2 bg-white rounded-full shadow-sm" }, getSentimentIcon()), /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("p", { className: "font-bold text-lg capitalize" }, result.sentiment), /* @__PURE__ */ React12.createElement("p", { className: "text-sm opacity-80" }, "\u7F6E\u4FE1\u5EA6: ", (result.score * 100).toFixed(1), "% (", result.label, ")"))), error && /* @__PURE__ */ React12.createElement("div", { className: "mt-4 p-3 bg-red-50 text-red-600 text-sm rounded-lg border border-red-100" }, "\u5206\u6790\u5931\u8D25: ", error.message));
 };
 var useTextGeneration = (options = {}) => {
   const [state, setState] = useState({
@@ -575,7 +576,7 @@ var useTextGeneration = (options = {}) => {
         pipelineRef.current = await pipeline("text2text-generation", modelName, {
           progress_callback: (info) => {
             if (info.status === "progress") {
-              setState((prev) => ({ ...prev, status: `loading model: ${Math.round(info.progress)}%` }));
+              setState((prev) => ({ ...prev, status: "loading model: " + Math.round(info.progress) + "%" }));
             }
           }
         });
@@ -641,8 +642,8 @@ var SmartAssistant = ({ className = "" }) => {
       return;
     }
     const prompt = `\u5BF9\u8BDD\u3002
-\u4EBA\u8BF4\uFF1A\u201C${userMessage}\u201D
-AI\u56DE\u5E94\uFF1A\u201C`;
+\u4EBA\u8BF4\uFF1A"${userMessage}"
+AI\u56DE\u5E94\uFF1A"`;
     try {
       const response = await generate(prompt);
       let modelOutput = response.replace(/^AI回应：|^AI:|^Assistant:|^回答:|^答:|^Answer:/i, "").replace(/[. ]*Positive[. ]*|[. ]*Negative[. ]*|[. ]*Neutral[. ]*/gi, "").replace(/^["'“]|["'”]$/g, "").trim();
@@ -657,7 +658,7 @@ AI\u56DE\u5E94\uFF1A\u201C`;
       setChatHistory((prev) => [...prev, { role: "assistant", content: "\uFF08\u672C\u5730\u6A21\u578B\u601D\u8003\u8FC7\u5EA6\uFF0C\u6682\u65F6\u4F11\u606F\u4E2D...\uFF09" }]);
     }
   };
-  return /* @__PURE__ */ React12.createElement("div", { className: `flex flex-col h-[500px] bg-white dark:bg-gray-800 rounded-xl shadow-inner border border-gray-100 dark:border-gray-700 overflow-hidden ${className}` }, /* @__PURE__ */ React12.createElement("div", { ref: scrollRef, className: "flex-1 overflow-y-auto p-4 space-y-4 bg-gray-50/50 dark:bg-gray-900/50" }, chatHistory.length === 0 && /* @__PURE__ */ React12.createElement("div", { className: "h-full flex flex-col items-center justify-center text-gray-400 space-y-2" }, /* @__PURE__ */ React12.createElement(Bot, { size: 48, className: "opacity-20" }), /* @__PURE__ */ React12.createElement("p", { className: "text-sm italic text-center px-8 text-gray-400 font-sans" }, "\u4F60\u597D\uFF01\u6211\u662F 100% \u672C\u5730\u8FD0\u884C\u7684 AI\u3002", /* @__PURE__ */ React12.createElement("br", null), "\u4F60\u53EF\u4EE5\u548C\u6211\u804A\u804A\u5929\uFF0C\u6211\u4F1A\u5C1D\u8BD5\u7406\u89E3\u4F60\u7684\u610F\u601D\u3002")), chatHistory.map((msg, i) => /* @__PURE__ */ React12.createElement("div", { key: i, className: `flex ${msg.role === "user" ? "justify-end" : "justify-start"} animate-in fade-in slide-in-from-bottom-2` }, /* @__PURE__ */ React12.createElement("div", { className: `flex gap-3 max-w-[85%] ${msg.role === "user" ? "flex-row-reverse" : ""}` }, /* @__PURE__ */ React12.createElement("div", { className: `p-2 rounded-lg h-fit ${msg.role === "user" ? "bg-blue-100 text-blue-600" : "bg-white dark:bg-gray-700 shadow-sm border border-gray-100 dark:border-gray-600 text-gray-400"}` }, msg.role === "user" ? /* @__PURE__ */ React12.createElement(User, { size: 18 }) : /* @__PURE__ */ React12.createElement(Bot, { size: 18 })), /* @__PURE__ */ React12.createElement("div", { className: `p-3 rounded-2xl shadow-sm text-sm ${msg.role === "user" ? "bg-blue-600 text-white rounded-tr-none" : "bg-white dark:bg-gray-700 text-gray-800 dark:text-gray-200 rounded-tl-none border border-gray-100 dark:border-gray-600 leading-relaxed"}` }, msg.content)))), isGenerating && /* @__PURE__ */ React12.createElement("div", { className: "flex justify-start" }, /* @__PURE__ */ React12.createElement("div", { className: "flex gap-3 items-center bg-white dark:bg-gray-700 p-3 rounded-2xl rounded-tl-none border border-gray-100 dark:border-gray-600" }, /* @__PURE__ */ React12.createElement(Loader2, { className: "animate-spin text-blue-500", size: 16 }), /* @__PURE__ */ React12.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React12.createElement("span", { className: "text-xs text-gray-500 font-medium" }, "\u601D\u8003\u4E2D..."), /* @__PURE__ */ React12.createElement("span", { className: "text-[10px] text-blue-400 font-mono tracking-tighter" }, genStatus))))), /* @__PURE__ */ React12.createElement("div", { className: "p-4 bg-white dark:bg-gray-800 border-t border-gray-100 dark:border-gray-700" }, /* @__PURE__ */ React12.createElement("div", { className: "relative flex items-center gap-2" }, /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement("div", { className: clsx("flex flex-col h-[500px] bg-white dark:bg-gray-800 rounded-xl shadow-inner border border-gray-100 dark:border-gray-700 overflow-hidden", className) }, /* @__PURE__ */ React12.createElement("div", { ref: scrollRef, className: "flex-1 overflow-y-auto p-4 space-y-4 bg-gray-50/50 dark:bg-gray-900/50" }, chatHistory.length === 0 && /* @__PURE__ */ React12.createElement("div", { className: "h-full flex flex-col items-center justify-center text-gray-400 space-y-2" }, /* @__PURE__ */ React12.createElement(Bot, { size: 48, className: "opacity-20" }), /* @__PURE__ */ React12.createElement("p", { className: "text-sm italic text-center px-8 text-gray-400 font-sans" }, "\u4F60\u597D\uFF01\u6211\u662F 100% \u672C\u5730\u8FD0\u884C\u7684 AI\u3002", /* @__PURE__ */ React12.createElement("br", null), "\u4F60\u53EF\u4EE5\u548C\u6211\u804A\u804A\u5929\uFF0C\u6211\u4F1A\u5C1D\u8BD5\u7406\u89E3\u4F60\u7684\u610F\u601D\u3002")), chatHistory.map((msg, i) => /* @__PURE__ */ React12.createElement("div", { key: i, className: clsx("flex", msg.role === "user" ? "justify-end" : "justify-start", "animate-in fade-in slide-in-from-bottom-2") }, /* @__PURE__ */ React12.createElement("div", { className: clsx("flex gap-3 max-w-[85%]", msg.role === "user" ? "flex-row-reverse" : "") }, /* @__PURE__ */ React12.createElement("div", { className: clsx("p-2 rounded-lg h-fit", msg.role === "user" ? "bg-blue-100 text-blue-600" : "bg-white dark:bg-gray-700 shadow-sm border border-gray-100 dark:border-gray-600 text-gray-400") }, msg.role === "user" ? /* @__PURE__ */ React12.createElement(User, { size: 18 }) : /* @__PURE__ */ React12.createElement(Bot, { size: 18 })), /* @__PURE__ */ React12.createElement("div", { className: clsx("p-3 rounded-2xl shadow-sm text-sm", msg.role === "user" ? "bg-blue-600 text-white rounded-tr-none" : "bg-white dark:bg-gray-700 text-gray-800 dark:text-gray-200 rounded-tl-none border border-gray-100 dark:border-gray-600 leading-relaxed") }, msg.content)))), isGenerating && /* @__PURE__ */ React12.createElement("div", { className: "flex justify-start" }, /* @__PURE__ */ React12.createElement("div", { className: "flex gap-3 items-center bg-white dark:bg-gray-700 p-3 rounded-2xl rounded-tl-none border border-gray-100 dark:border-gray-600" }, /* @__PURE__ */ React12.createElement(Loader2, { className: "animate-spin text-blue-500", size: 16 }), /* @__PURE__ */ React12.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React12.createElement("span", { className: "text-xs text-gray-500 font-medium" }, "\u601D\u8003\u4E2D..."), /* @__PURE__ */ React12.createElement("span", { className: "text-[10px] text-blue-400 font-mono tracking-tighter" }, genStatus))))), /* @__PURE__ */ React12.createElement("div", { className: "p-4 bg-white dark:bg-gray-800 border-t border-gray-100 dark:border-gray-700" }, /* @__PURE__ */ React12.createElement("div", { className: "relative flex items-center gap-2" }, /* @__PURE__ */ React12.createElement(
     "input",
     {
       type: "text",
@@ -845,9 +846,9 @@ var ProfileButton = ({
   const closeModal = () => setIsModalOpen(false);
   const handleContactClick = (type, value) => {
     if (type === "\u90AE\u7BB1") {
-      window.open(`mailto:${value}`);
+      window.open("mailto:" + value);
     } else if (type === "\u7535\u8BDD") {
-      window.open(`tel:${value}`);
+      window.open("tel:" + value);
     }
   };
   return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement(
@@ -896,9 +897,9 @@ var AutoOpenModal = ({
   };
   const handleContactClick = (type, value) => {
     if (type === "\u90AE\u7BB1") {
-      window.open(`mailto:${value}`);
+      window.open("mailto:" + value);
     } else if (type === "\u7535\u8BDD") {
-      window.open(`tel:${value}`);
+      window.open("tel:" + value);
     }
   };
   return /* @__PURE__ */ React12.createElement(
@@ -1024,8 +1025,7 @@ var Contact = () => {
     {
       type: "submit",
       disabled: isSubmitting,
-      className: `inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white 
-                  ${isSubmitting ? "bg-blue-400 cursor-not-allowed" : "bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"}`
+      className: clsx("inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white", isSubmitting ? "bg-blue-400 cursor-not-allowed" : "bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500")
     },
     isSubmitting ? "\u53D1\u9001\u4E2D..." : "\u53D1\u9001\u6D88\u606F"
   )), submitStatus === "success" && /* @__PURE__ */ React12.createElement("div", { className: "rounded-md bg-green-50 p-4" }, /* @__PURE__ */ React12.createElement("div", { className: "flex" }, /* @__PURE__ */ React12.createElement("div", { className: "flex-shrink-0" }, /* @__PURE__ */ React12.createElement("svg", { className: "h-5 w-5 text-green-400", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }))), /* @__PURE__ */ React12.createElement("div", { className: "ml-3" }, /* @__PURE__ */ React12.createElement("p", { className: "text-sm font-medium text-green-800" }, "\u6D88\u606F\u5DF2\u6210\u529F\u53D1\u9001\uFF01")))), submitStatus === "error" && /* @__PURE__ */ React12.createElement("div", { className: "rounded-md bg-red-50 p-4" }, /* @__PURE__ */ React12.createElement("div", { className: "flex" }, /* @__PURE__ */ React12.createElement("div", { className: "flex-shrink-0" }, /* @__PURE__ */ React12.createElement("svg", { className: "h-5 w-5 text-red-400", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }))), /* @__PURE__ */ React12.createElement("div", { className: "ml-3" }, /* @__PURE__ */ React12.createElement("p", { className: "text-sm font-medium text-red-800" }, "\u53D1\u9001\u5931\u8D25\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5")))))), /* @__PURE__ */ React12.createElement("div", { className: "mt-12 grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3" }, /* @__PURE__ */ React12.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6 text-center" }, /* @__PURE__ */ React12.createElement("div", { className: "text-blue-600 mb-4" }, /* @__PURE__ */ React12.createElement("svg", { className: "h-8 w-8 mx-auto", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" }))), /* @__PURE__ */ React12.createElement("h3", { className: "text-lg font-medium text-gray-900" }, "\u90AE\u7BB1"), /* @__PURE__ */ React12.createElement("p", { className: "mt-2 text-gray-600" }, "your.email@example.com")), /* @__PURE__ */ React12.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6 text-center" }, /* @__PURE__ */ React12.createElement("div", { className: "text-blue-600 mb-4" }, /* @__PURE__ */ React12.createElement("svg", { className: "h-8 w-8 mx-auto", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" }))), /* @__PURE__ */ React12.createElement("h3", { className: "text-lg font-medium text-gray-900" }, "\u7535\u8BDD"), /* @__PURE__ */ React12.createElement("p", { className: "mt-2 text-gray-600" }, "+86 123 4567 8900")), /* @__PURE__ */ React12.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6 text-center" }, /* @__PURE__ */ React12.createElement("div", { className: "text-blue-600 mb-4" }, /* @__PURE__ */ React12.createElement("svg", { className: "h-8 w-8 mx-auto", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" }), /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M15 11a3 3 0 11-6 0 3 3 0 016 0z" }))), /* @__PURE__ */ React12.createElement("h3", { className: "text-lg font-medium text-gray-900" }, "\u5730\u5740"), /* @__PURE__ */ React12.createElement("p", { className: "mt-2 text-gray-600" }, "\u4E2D\u56FD\uFF0C\u5317\u4EAC")))));
@@ -1223,7 +1223,7 @@ var NavigationItemComponent = ({
     `;
     const directionClasses = direction === "vertical" ? "px-4 py-3 w-full justify-start" : "px-3 py-2 justify-center";
     const stateClasses = isActive ? "bg-blue-500 text-white shadow-lg" : item.isExternal ? "text-gray-700 hover:bg-purple-50 hover:text-purple-600 border border-purple-200" : "text-gray-700 hover:bg-blue-50 hover:text-blue-600";
-    return `${baseClasses} ${directionClasses} ${stateClasses}`;
+    return baseClasses + " " + directionClasses + " " + stateClasses;
   };
   return /* @__PURE__ */ React12.createElement(
     "a",
@@ -1235,7 +1235,7 @@ var NavigationItemComponent = ({
       className: getItemClasses()
     },
     item.icon && /* @__PURE__ */ React12.createElement("span", { className: "flex-shrink-0" }, item.icon),
-    /* @__PURE__ */ React12.createElement("span", { className: `font-medium ${direction === "vertical" ? "text-sm" : "text-xs"}` }, item.label),
+    /* @__PURE__ */ React12.createElement("span", { className: clsx("font-medium", direction === "vertical" ? "text-sm" : "text-xs") }, item.label),
     item.isExternal && /* @__PURE__ */ React12.createElement(
       "svg",
       {
@@ -1258,8 +1258,6 @@ var NavigationItemComponent = ({
   );
 };
 var NavigationItem_default = NavigationItemComponent;
-
-// src/navigation/Navigation.tsx
 var Navigation = ({
   config,
   isOpen,
@@ -1278,12 +1276,12 @@ var Navigation = ({
     `;
     if (direction === "vertical") {
       const verticalClasses = "h-screen w-64 flex flex-col";
-      const positionClasses = position === "left" ? `left-0 top-0 ${isOpen ? "translate-x-0" : "-translate-x-full"}` : `right-0 top-0 ${isOpen ? "translate-x-0" : "translate-x-full"}`;
-      return `${baseClasses} ${verticalClasses} ${positionClasses}`;
+      const positionClasses = position === "left" ? "left-0 top-0 " + (isOpen ? "translate-x-0" : "-translate-x-full") : "right-0 top-0 " + (isOpen ? "translate-x-0" : "translate-x-full");
+      return baseClasses + " " + verticalClasses + " " + positionClasses;
     } else {
       const horizontalClasses = "w-full h-16 flex items-center";
-      const positionClasses = position === "top" ? `top-0 left-0 right-0 ${isOpen ? "translate-y-0" : "-translate-y-full"}` : `bottom-0 left-0 right-0 ${isOpen ? "translate-y-0" : "translate-y-full"}`;
-      return `${baseClasses} ${horizontalClasses} ${positionClasses}`;
+      const positionClasses = position === "top" ? "top-0 left-0 right-0 " + (isOpen ? "translate-y-0" : "-translate-y-full") : "bottom-0 left-0 right-0 " + (isOpen ? "translate-y-0" : "translate-y-full");
+      return baseClasses + " " + horizontalClasses + " " + positionClasses;
     }
   };
   const getContentClasses = () => {
@@ -1314,7 +1312,7 @@ var Navigation = ({
     onItemClick?.(item);
   };
   if (!isOpen) return null;
-  return /* @__PURE__ */ React12.createElement("nav", { className: `${getContainerClasses()} ${className}` }, /* @__PURE__ */ React12.createElement("div", { className: getContentClasses() }, logo && /* @__PURE__ */ React12.createElement("div", { className: "flex items-center justify-center mb-4" }, /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement("nav", { className: clsx(getContainerClasses(), className) }, /* @__PURE__ */ React12.createElement("div", { className: getContentClasses() }, logo && /* @__PURE__ */ React12.createElement("div", { className: "flex items-center justify-center mb-4" }, /* @__PURE__ */ React12.createElement(
     "img",
     {
       src: logo.src,
@@ -1370,44 +1368,36 @@ var NavigationToggle = ({
     "button",
     {
       onClick,
-      className: `
-        fixed ${getPositionClasses()} z-[100]
-        p-3 rounded-xl
-        bg-white/90 backdrop-blur-md
-        shadow-lg hover:shadow-xl
-        border border-gray-200/50
-        transition-all duration-300 ease-in-out
-        hover:scale-105 active:scale-95
-        focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50
-      `,
+      className: clsx(
+        "fixed",
+        getPositionClasses(),
+        "z-[100] p-3 rounded-xl bg-white/90 backdrop-blur-md shadow-lg hover:shadow-xl border border-gray-200/50 transition-all duration-300 ease-in-out hover:scale-105 active:scale-95 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
+      ),
       "aria-label": isOpen ? "\u5173\u95ED\u5BFC\u822A\u680F" : "\u6253\u5F00\u5BFC\u822A\u680F"
     },
     /* @__PURE__ */ React12.createElement("div", { className: "w-5 h-5 flex flex-col justify-center items-center" }, /* @__PURE__ */ React12.createElement(
       "span",
       {
-        className: `
-            block w-5 h-0.5 bg-gray-600 rounded-full
-            transform transition-all duration-300 ease-in-out
-            ${isOpen ? "rotate-45 translate-y-0.5" : ""}
-          `
+        className: clsx(
+          "block w-5 h-0.5 bg-gray-600 rounded-full transform transition-all duration-300 ease-in-out",
+          isOpen ? "rotate-45 translate-y-0.5" : ""
+        )
       }
     ), /* @__PURE__ */ React12.createElement(
       "span",
       {
-        className: `
-            block w-5 h-0.5 bg-gray-600 rounded-full
-            transform transition-all duration-300 ease-in-out mt-1
-            ${isOpen ? "opacity-0 scale-0" : "opacity-100 scale-100"}
-          `
+        className: clsx(
+          "block w-5 h-0.5 bg-gray-600 rounded-full transform transition-all duration-300 ease-in-out mt-1",
+          isOpen ? "opacity-0 scale-0" : "opacity-100 scale-100"
+        )
       }
     ), /* @__PURE__ */ React12.createElement(
       "span",
       {
-        className: `
-            block w-5 h-0.5 bg-gray-600 rounded-full
-            transform transition-all duration-300 ease-in-out mt-1
-            ${isOpen ? "-rotate-45 -translate-y-2.5" : ""}
-          `
+        className: clsx(
+          "block w-5 h-0.5 bg-gray-600 rounded-full transform transition-all duration-300 ease-in-out mt-1",
+          isOpen ? "-rotate-45 -translate-y-2.5" : ""
+        )
       }
     ))
   );
@@ -1553,26 +1543,20 @@ var FloatingMenu = ({
       "div",
       {
         ref: containerRef,
-        className: `fixed select-none box-border ${className}`,
+        className: clsx("fixed select-none box-border", className),
         style: {
-          left: `${position.x}px`,
-          top: `${position.y}px`,
+          left: position.x + "px",
+          top: position.y + "px",
           zIndex
         }
       },
       /* @__PURE__ */ React12.createElement(
         "div",
         {
-          className: `
-          flex items-center justify-center 
-          w-12 h-12 md:w-12 md:h-12 
-          bg-white rounded-full 
-          shadow-md hover:shadow-lg 
-          cursor-grab active:cursor-grabbing 
-          transition-all duration-200 
-          hover:scale-105 active:scale-95
-          ${triggerClassName}
-        `,
+          className: clsx(
+            "flex items-center justify-center w-12 h-12 md:w-12 md:h-12 bg-white rounded-full shadow-md hover:shadow-lg cursor-grab active:cursor-grabbing transition-all duration-200 hover:scale-105 active:scale-95",
+            triggerClassName
+          ),
           onMouseDown: handleMouseDown,
           onClick: toggleMenu
         },
@@ -1581,16 +1565,12 @@ var FloatingMenu = ({
       isMenuOpen && /* @__PURE__ */ React12.createElement(
         "div",
         {
-          className: `
-            absolute top-0
-            bg-white rounded-lg shadow-xl 
-            p-3 min-w-[200px] md:min-w-[200px] max-w-[300px]
-            z-[1000] 
-            transition-all duration-200
-            ${isMenuOpen ? "opacity-100 scale-100" : "opacity-0 scale-95"}
-            ${menuDirection === "left" ? "right-[calc(100%+10px)]" : "left-[calc(100%+10px)]"}
-            ${menuClassName}
-          `,
+          className: clsx(
+            "absolute top-0 bg-white rounded-lg shadow-xl p-3 min-w-[200px] md:min-w-[200px] max-w-[300px] z-[1000] transition-all duration-200",
+            isMenuOpen ? "opacity-100 scale-100" : "opacity-0 scale-95",
+            menuDirection === "left" ? "right-[calc(100%+10px)]" : "left-[calc(100%+10px)]",
+            menuClassName
+          ),
           onClick: (e) => e.stopPropagation(),
           onMouseDown: (e) => e.stopPropagation(),
           onMouseUp: (e) => e.stopPropagation(),
@@ -1623,7 +1603,7 @@ var FloatingMenuExample = () => {
     { id: 5, label: "\u9000\u51FA", icon: "\u{1F6AA}" }
   ];
   const handleMenuItemClick = (id) => {
-    console.log(`\u70B9\u51FB\u4E86\u83DC\u5355\u9879: ${id}`);
+    console.log("\u70B9\u51FB\u4E86\u83DC\u5355\u9879: " + id);
   };
   return /* @__PURE__ */ React12.createElement("div", { className: "w-full h-screen bg-gray-100 relative p-8" }, /* @__PURE__ */ React12.createElement("div", { className: "max-w-2xl mx-auto bg-white rounded-2xl shadow-sm p-8 mt-12" }, /* @__PURE__ */ React12.createElement("h1", { className: "text-3xl font-bold mb-4 text-gray-900" }, "\u60AC\u6D6E\u83DC\u5355\u793A\u4F8B"), /* @__PURE__ */ React12.createElement("p", { className: "text-gray-600 leading-relaxed mb-6" }, "\u8FD9\u662F\u4E00\u4E2A\u53EF\u62D6\u62FD\u7684\u60AC\u6D6E\u83DC\u5355\u7EC4\u4EF6\u793A\u4F8B\u3002\u4F60\u53EF\u4EE5\u5C1D\u8BD5\u62D6\u52A8\u4E0B\u65B9\u7684 ", /* @__PURE__ */ React12.createElement("span", { className: "font-bold text-blue-600" }, "\u84DD\u8272\u6309\u94AE"), " \u5230\u5904\u79FB\u52A8\u3002"), /* @__PURE__ */ React12.createElement("div", { className: "bg-blue-50 border-l-4 border-blue-500 p-4 mb-6" }, /* @__PURE__ */ React12.createElement("p", { className: "text-sm text-blue-700" }, /* @__PURE__ */ React12.createElement("strong", null, "\u667A\u80FD\u5B9A\u4F4D\uFF1A"), " \u83DC\u5355\u4F1A\u6839\u636E\u6309\u94AE\u5728\u5C4F\u5E55\u4E0A\u7684\u4F4D\u7F6E\u81EA\u52A8\u8C03\u6574\u5F39\u51FA\u65B9\u5411\uFF08\u5411\u5DE6\u6216\u5411\u53F3\uFF09\u3002"))), /* @__PURE__ */ React12.createElement(
     FloatingMenu_default,
@@ -1949,7 +1929,7 @@ function ExperimentItemGrid({
   return /* @__PURE__ */ React12.createElement(ExperimentGrid, { items: experiments, ...props });
 }
 var EmptyState = ({ searchQuery, onClearSearch, className }) => {
-  return /* @__PURE__ */ React12.createElement("div", { className: `text-center py-12 ${className}` }, /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement("div", { className: clsx("text-center py-12", className) }, /* @__PURE__ */ React12.createElement(
     "svg",
     {
       className: "mx-auto h-12 w-12 text-gray-400",
@@ -1992,7 +1972,7 @@ var SortControl = ({
     "button",
     {
       key: option.value,
-      className: `px-3 py-1.5 text-sm rounded-full transition-colors ${sortBy === option.value ? "bg-blue-100 text-blue-700 font-medium" : "bg-gray-100 text-gray-600 hover:bg-gray-200"}`,
+      className: clsx("px-3 py-1.5 text-sm rounded-full transition-colors", sortBy === option.value ? "bg-blue-100 text-blue-700 font-medium" : "bg-gray-100 text-gray-600 hover:bg-gray-200"),
       onClick: () => onSortByChange(option.value)
     },
     option.label
@@ -2009,14 +1989,14 @@ var SortModeToggle = ({ sortMode, onSortModeChange }) => {
   return /* @__PURE__ */ React12.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-3 bg-white p-4 rounded-lg shadow-sm border border-gray-100" }, /* @__PURE__ */ React12.createElement("span", { className: "text-sm font-medium text-gray-700" }, "\u6392\u5E8F\u6A21\u5F0F\uFF1A"), /* @__PURE__ */ React12.createElement("div", { className: "flex w-full sm:w-auto p-1 bg-gray-100 rounded-lg" }, /* @__PURE__ */ React12.createElement(
     "button",
     {
-      className: `flex-1 sm:flex-initial px-3 py-1.5 text-sm rounded-md transition-colors ${sortMode === "auto" ? "bg-white text-blue-700 font-medium shadow-sm" : "text-gray-600 hover:bg-gray-200"}`,
+      className: clsx("flex-1 sm:flex-initial px-3 py-1.5 text-sm rounded-md transition-colors", sortMode === "auto" ? "bg-white text-blue-700 font-medium shadow-sm" : "text-gray-600 hover:bg-gray-200"),
       onClick: () => onSortModeChange("auto")
     },
     /* @__PURE__ */ React12.createElement("div", { className: "flex items-center justify-center sm:justify-start space-x-1" }, /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M3 4h13M3 8h9m-9 4h9m5-4v12m0 0l-4-4m4 4l4-4" })), /* @__PURE__ */ React12.createElement("span", null, "\u81EA\u52A8\u6392\u5E8F"))
   ), /* @__PURE__ */ React12.createElement(
     "button",
     {
-      className: `flex-1 sm:flex-initial px-3 py-1.5 text-sm rounded-md transition-colors ${sortMode === "manual" ? "bg-white text-blue-700 font-medium shadow-sm" : "text-gray-600 hover:bg-gray-200"}`,
+      className: clsx("flex-1 sm:flex-initial px-3 py-1.5 text-sm rounded-md transition-colors", sortMode === "manual" ? "bg-white text-blue-700 font-medium shadow-sm" : "text-gray-600 hover:bg-gray-200"),
       onClick: () => onSortModeChange("manual")
     },
     /* @__PURE__ */ React12.createElement("div", { className: "flex items-center justify-center sm:justify-start space-x-1" }, /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 11.5V14m0-2.5v-6a1.5 1.5 0 113 0m-3 6a1.5 1.5 0 00-3 0v2a7.5 7.5 0 0015 0v-5a1.5 1.5 0 013 0m-6-3V11m0-5.5v-1a1.5 1.5 0 013 0v1m0 0V11m0-5.5a1.5 1.5 0 013 0v3m0 0V11" })), /* @__PURE__ */ React12.createElement("span", null, "\u624B\u52A8\u6392\u5E8F"))
@@ -2071,11 +2051,10 @@ var SortableExperimentItem = ({
           onMoveUp?.();
         },
         disabled: isFirst,
-        className: `w-8 h-8 rounded-full flex items-center justify-center shadow-md
-                     ${isFirst ? "bg-gray-200 cursor-not-allowed" : "bg-white/80 hover:bg-white active:bg-gray-100"}`,
+        className: clsx("w-8 h-8 rounded-full flex items-center justify-center shadow-md", isFirst ? "bg-gray-200 cursor-not-allowed" : "bg-white/80 hover:bg-white active:bg-gray-100"),
         "aria-label": "\u5411\u4E0A\u79FB\u52A8"
       },
-      /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: `h-5 w-5 ${isFirst ? "text-gray-400" : "text-gray-500"}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 15l7-7 7 7" }))
+      /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: clsx("h-5 w-5", isFirst ? "text-gray-400" : "text-gray-500"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M5 15l7-7 7 7" }))
     ), /* @__PURE__ */ React12.createElement(
       "button",
       {
@@ -2084,13 +2063,12 @@ var SortableExperimentItem = ({
           onMoveDown?.();
         },
         disabled: isLast,
-        className: `w-8 h-8 rounded-full flex items-center justify-center shadow-md
-                     ${isLast ? "bg-gray-200 cursor-not-allowed" : "bg-white/80 hover:bg-white active:bg-gray-100"}`,
+        className: clsx("w-8 h-8 rounded-full flex items-center justify-center shadow-md", isLast ? "bg-gray-200 cursor-not-allowed" : "bg-white/80 hover:bg-white active:bg-gray-100"),
         "aria-label": "\u5411\u4E0B\u79FB\u52A8"
       },
-      /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: `h-5 w-5 ${isLast ? "text-gray-400" : "text-gray-500"}`, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
+      /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: clsx("h-5 w-5", isLast ? "text-gray-400" : "text-gray-500"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
     )),
-    /* @__PURE__ */ React12.createElement("div", { className: `transition-all ${isDragging ? "scale-105 shadow-xl" : ""}` }, /* @__PURE__ */ React12.createElement(
+    /* @__PURE__ */ React12.createElement("div", { className: clsx("transition-all", isDragging ? "scale-105 shadow-xl" : "") }, /* @__PURE__ */ React12.createElement(
       ExperimentCard,
       {
         href: item.path,
@@ -2172,7 +2150,7 @@ var DraggableExperimentGrid = ({
   React12.useEffect(() => {
     setItems(initialItems);
   }, [initialItems]);
-  return /* @__PURE__ */ React12.createElement("div", { className: `relative ${className}` }, /* @__PURE__ */ React12.createElement("div", { className: "mb-4 px-4 py-3 bg-blue-50 text-blue-700 rounded-lg border border-blue-200 text-sm" }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-start sm:items-center" }, /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5 mr-2 flex-shrink-0 mt-0.5 sm:mt-0", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" })), /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("p", { className: "mb-1" }, "\u62D6\u62FD\u5361\u7247\u53EF\u4EE5\u81EA\u5B9A\u4E49\u6392\u5E8F\u3002\u70B9\u51FB\u5361\u7247\u53EF\u4EE5\u8BBF\u95EE\u5BF9\u5E94\u7684\u5B9E\u9A8C\u9879\u76EE\u3002"), /* @__PURE__ */ React12.createElement("p", { className: "text-xs text-blue-600 sm:hidden" }, "\u70B9\u51FB\u5361\u7247\u53F3\u4E0A\u89D2\u7684\u4E0A\u4E0B\u7BAD\u5934\u6309\u94AE\u8C03\u6574\u987A\u5E8F"), /* @__PURE__ */ React12.createElement("p", { className: "text-xs text-blue-600 hidden sm:block" }, "\u957F\u6309\u5361\u7247\u53F3\u4E0A\u89D2\u7684\u62D6\u52A8\u56FE\u6807\u8FDB\u884C\u6392\u5E8F")))), /* @__PURE__ */ React12.createElement(
+  return /* @__PURE__ */ React12.createElement("div", { className: clsx("relative", className) }, /* @__PURE__ */ React12.createElement("div", { className: "mb-4 px-4 py-3 bg-blue-50 text-blue-700 rounded-lg border border-blue-200 text-sm" }, /* @__PURE__ */ React12.createElement("div", { className: "flex items-start sm:items-center" }, /* @__PURE__ */ React12.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-5 w-5 mr-2 flex-shrink-0 mt-0.5 sm:mt-0", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React12.createElement("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" })), /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("p", { className: "mb-1" }, "\u62D6\u62FD\u5361\u7247\u53EF\u4EE5\u81EA\u5B9A\u4E49\u6392\u5E8F\u3002\u70B9\u51FB\u5361\u7247\u53EF\u4EE5\u8BBF\u95EE\u5BF9\u5E94\u7684\u5B9E\u9A8C\u9879\u76EE\u3002"), /* @__PURE__ */ React12.createElement("p", { className: "text-xs text-blue-600 sm:hidden" }, "\u70B9\u51FB\u5361\u7247\u53F3\u4E0A\u89D2\u7684\u4E0A\u4E0B\u7BAD\u5934\u6309\u94AE\u8C03\u6574\u987A\u5E8F"), /* @__PURE__ */ React12.createElement("p", { className: "text-xs text-blue-600 hidden sm:block" }, "\u957F\u6309\u5361\u7247\u53F3\u4E0A\u89D2\u7684\u62D6\u52A8\u56FE\u6807\u8FDB\u884C\u6392\u5E8F")))), /* @__PURE__ */ React12.createElement(
     DndContext,
     {
       sensors,
@@ -2186,10 +2164,7 @@ var DraggableExperimentGrid = ({
         items: items.map((item) => item.id),
         strategy: rectSortingStrategy
       },
-      /* @__PURE__ */ React12.createElement("div", { className: `
-            grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 md:gap-6
-            ${isDragging ? "cursor-grabbing" : ""}
-          ` }, items.map((item, index) => /* @__PURE__ */ React12.createElement(
+      /* @__PURE__ */ React12.createElement("div", { className: clsx("grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 md:gap-6", isDragging ? "cursor-grabbing" : "") }, items.map((item, index) => /* @__PURE__ */ React12.createElement(
         SortableExperimentItem,
         {
           key: item.id,