feat:碎片完善

src/contexts/PuzzleAnimationContext.tsx

@@ -0,0 +1,34 @@
+import { createContext, useContext, ReactNode } from "react";
+
+interface PuzzleAnimationContextType {
+  /** 触发碎片动画，传递碎片ID */
+  triggerPuzzleAnimation: (pieceId: number) => void;
+}
+
+const PuzzleAnimationContext = createContext<PuzzleAnimationContextType | null>(
+  null
+);
+
+export const PuzzleAnimationProvider = ({
+  children,
+  triggerPuzzleAnimation,
+}: {
+  children: ReactNode;
+  triggerPuzzleAnimation: (pieceId: number) => void;
+}) => {
+  return (
+    <PuzzleAnimationContext.Provider value={{ triggerPuzzleAnimation }}>
+      {children}
+    </PuzzleAnimationContext.Provider>
+  );
+};
+
+export const usePuzzleAnimation = () => {
+  const context = useContext(PuzzleAnimationContext);
+  if (!context) {
+    throw new Error(
+      "usePuzzleAnimation must be used within PuzzleAnimationProvider"
+    );
+  }
+  return context;
+};