feat: 增强纹理图集工具交互体验

新增 ZIP 打包导出、精灵选择高亮、点击拾取等交互功能

- 新增 JSZip 依赖，支持一键打包下载图集图片和元数据文件
- CanvasPreview 新增精灵选择功能，支持点击/多选选择，带脉冲动画高亮效果
- 新增图片缓存机制，优化重绘性能
- FileListPanel 新增选中项自动滚动到可视区域
- 优化防抖延迟和加载状态视觉效果

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

src/components/tools/atlas/FileListPanel.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useCallback, useRef, useState } from "react";
+import { useCallback, useRef, useState, useEffect } from "react";
 import { motion, AnimatePresence } from "framer-motion";
 import { 
   Folder, 
@@ -277,6 +277,19 @@ export function FileListPanel() {
     setFolderName("");
   }, [clearSprites, setFolderName]);
 
+  /**
+   * Scroll selected item into view
+   */
+  useEffect(() => {
+    if (selectedSpriteIds.length === 1) {
+      const selectedId = selectedSpriteIds[0];
+      const element = document.getElementById(`sprite-${selectedId}`);
+      if (element) {
+        element.scrollIntoView({ behavior: "smooth", block: "nearest" });
+      }
+    }
+  }, [selectedSpriteIds]);
+
   return (
     <div 
       ref={dropZoneRef}
@@ -340,6 +353,7 @@ export function FileListPanel() {
                   {sprites.map((sprite, index) => (
                     <motion.div
                       key={sprite.id}
+                      id={`sprite-${sprite.id}`}
                       initial={{ opacity: 0, x: -10 }}
                       animate={{ opacity: 1, x: 0 }}
                       exit={{ opacity: 0, x: -10 }}