refactor(image): JSDoc Annotations Update (#54)

## Summary

- Updated JSDoc annotations across various functions and components
within the image library.

<!-- Please summarize your changes. -->

<!-- Please link to any applicable information (forum posts, bug
reports, etc.). -->

AS-IS
<img width="733" alt="스크린샷 2023-09-26 오후 5 04 20"
src="https://github.com/fepack/image/assets/77133565/38a28e59-bca4-4c51-b92c-592e59b525c0">

TO-BE
<img width="575" alt="스크린샷 2023-09-26 오후 5 14 21"
src="https://github.com/fepack/image/assets/77133565/46d3481f-d2a3-4603-8c72-2b5becca3a1d">



## Checks

<!-- For completed items, change [ ] to [x]. -->

<!-- If you leave this checklist empty, your PR will very likely be
closed. -->

Please check the following:

- [x] I have written documents and tests, if needed.

.changeset/red-llamas-protect.md

@@ -0,0 +1,5 @@
+---
+"@fepack/image": patch
+---
+
+refactor(image): JSDoc Annotations Update

packages/image/package.json

@@ -6,6 +6,7 @@
     "fepack",
     "image"
   ],
+  "homepage": "https://image.fepack.org",
   "repository": {
     "type": "git",
     "url": "https://github.com/fepack/image.git",
@@ -32,6 +33,7 @@
     "./package.json": "./package.json"
   },
   "main": "dist/index.cjs",
+  "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
     "dist",

packages/image/src/detect.ts

@@ -40,8 +40,7 @@ const FILE_TYPE_KEYS = Object.keys(
 /**
  * Inspects the first few bytes of a buffer to determine if
  * it matches a known file signature.
- *
- * @param {Buffer} buffer - The buffer containing the file's first few bytes.
+ * @param buffer - The buffer containing the file's first few bytes.
  * @returns The detected MIME type or null if no known signature is matched.
  */
 export const detect = (buffer: Buffer) => {

packages/image/src/extractRGBAs.ts

@@ -1,17 +1,16 @@
 type RGBA = readonly [number, number, number, number];
 type ExtractRGBAsOptions = { quality: number };
 const initialOptions: ExtractRGBAsOptions = { quality: 100 };
+
 /**
  * Filters and extracts relevant pixels from image data based on quality setting.
+ * @param image - The image data.
+ * @param [options] - The options to define the quality of extraction.
+ * @throws Will throw an error if quality is not between 1 and 100.
+ * @returns An array of RGBA values.
  */
 export const extractRGBAs = (
-  /**
-   * The image pixel data.
-   */
   image: HTMLImageElement,
-  /**
-   * Quality setting for filtering pixels. Higher values mean more pixels are processed. Range: [1, 100]
-   */
   options = initialOptions,
 ) => {
   if (options.quality < 1 || options.quality > 100) {
@@ -36,13 +35,11 @@ export const extractRGBAs = (
 
 /**
  * Extracts pixel data from an image.
+ * @param image - The image element.
+ * @throws Will throw an error if canvasRenderingContext2D is not supported.
+ * @returns The pixel data of the image.
  */
-const extractUint8ClampedArray = (
-  /**
-   * The image element
-   */
-  image: HTMLImageElement,
-) => {
+const extractUint8ClampedArray = (image: HTMLImageElement) => {
   const canvas = document.createElement("canvas");
   const canvasRenderingContext2D = canvas.getContext("2d");
   if (!canvasRenderingContext2D) {

packages/image/src/load.ts

@@ -1,5 +1,8 @@
 /**
- * Loads an image from the given source URL and returns a Promise that resolves to the loaded image.
+ * Loads an image from the given source URL.
+ * @param src - The source URL of the image to load.
+ * @returns A Promise that resolves to the loaded image.
+ * @throws Will reject the promise if the image fails to load.
  */
 export const load = (src: HTMLImageElement["src"]) =>
   new Promise<HTMLImageElement>((resolve, reject) => {