feat: #63 prepared library and component

package.json

@@ -15,6 +15,7 @@
     "next": "^14.1.3",
     "react": "^18",
     "react-dom": "^18",
+    "react-easy-crop": "^5.0.6",
     "react-icons": "^5.0.1",
     "react-leaflet": "^4.2.1",
     "react-multi-carousel": "^2.8.5",

src/components/common/ImageCrop/ImageCropFrame.tsx

@@ -0,0 +1,18 @@
+"use client";
+import { useState } from "react";
+import { CropperProps, Area } from "react-easy-crop";
+import Cropper from 'react-easy-crop';
+
+export function ImageCropFrame() {
+
+    const [crop, setCrop] = useState<CropperProps['crop']>({ x: 0, y: 0 });
+    const [zoom, setZoom] = useState<number>(1);
+    const [image, setImage] = useState<string | ArrayBuffer | null>(null);
+    const [croppedAreaPixels, setCroppedAreaPixels] = useState<Area>();
+    const [fileCropped, setFileCropped] = useState<File>(new File([], ""));
+
+    return (
+        <>
+        </>
+    );
+}