sa2kit 1.6.30 → 1.6.32

package/dist/index.mjs

@@ -1,21 +1,23 @@
-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-EI27JKND.mjs';
+export { Dialog as AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, DialogDescription as AlertDialogDescription, DialogFooter as AlertDialogFooter, DialogHeader as AlertDialogHeader, DialogOverlay as AlertDialogOverlay, DialogPortal as AlertDialogPortal, DialogTitle as AlertDialogTitle, DialogTrigger as 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, Dialog as Sheet, DialogClose as SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, DialogOverlay as SheetOverlay, DialogPortal as SheetPortal, SheetTitle, DialogTrigger as SheetTrigger, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Timeline, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants } from './chunk-EI27JKND.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, useTaroStorage } from './chunk-UKT3PLON.mjs';
+export { useLocalStorage, useStorage } from './chunk-VVWQTO4Y.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 +154,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 +171,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 +184,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 +335,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 +347,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 +502,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 +519,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 +577,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 +643,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 +659,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 +847,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 +898,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 +1026,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 +1224,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 +1236,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 +1259,6 @@ var NavigationItemComponent = ({
   );
 };
 var NavigationItem_default = NavigationItemComponent;
-
-// src/navigation/Navigation.tsx
 var Navigation = ({
   config,
   isOpen,
@@ -1278,12 +1277,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 +1313,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 +1369,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 +1544,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 +1566,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 +1604,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 +1930,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 +1973,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 +1990,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 +2052,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 +2064,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 +2151,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 +2165,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,