@alttiri/get-image-data - npm Package Compare versions

Comparing version 0.0.3-20241215 to 0.0.5-20241215

package.json

 {
   "name": "@alttiri/get-image-data",
-  "version": "0.0.3-20241215",
+  "version": "0.0.5-20241215",
   "description": "A simple library to get ImageData on Node.js and browsers",
@@ -5,0 +5,0 @@ "homepage": "https://github.com/AlttiRi/get-image-data",

README.md

@@ -13,7 +13,6 @@ # get-image-data
 
-  _Do not forget to install [`sharp`](https://www.npmjs.com/package/sharp) (`npm i sharp`). It's not included as a dependency._
-  ```bash
-  npm i @alttiri/get-image-data sharp
-  ```
+  _Do not forget to install [`sharp`](https://www.npmjs.com/package/sharp) (`npm i sharp`).
+  Since `sharp` is not included as a dependency (This allows you to install the version of `sharp` you need)._
 
+
 - For browsers just use [`getImageDataWithCanvas`](https://github.com/AlttiRi/get-image-data/blob/master/src/get-with-canvas.ts). 
@@ -23,1 +22,72 @@
 
+  _You can get `File` from the HTML input element, and `Blob` from `fetch` response._
+
+---
+
+### Node.js examples
+
+```bash
+npm i @alttiri/get-image-data sharp
+```
+
+#### An image path (`string`) as input:
+```ts
+import {getImageDataWithSharp as getImageData} from "@alttiri/get-image-data";
+
+const imagePath = "C:/Windows/IdentityCRL/WLive48x48.png";
+const imageData = await getImageData(imagePath);
+console.log(imageData);
+```
+
+#### Or `ArrayBufferLike`/`ArrayBufferView`:
+```ts
+import {getImageDataWithSharp as getImageData} from "@alttiri/get-image-data";
+import fs from "node:fs/promises";
+
+const imagePath = "C:/Windows/IdentityCRL/WLive48x48.png";
+const fileBuffer = await fs.readFile(imagePath);
+const imageData = await getImageData(fileBuffer);
+console.log(imageData);
+```
+
+The result:
+```
+{
+  width: 48,
+  height: 48,
+  data: Uint8ClampedArray(9216) [255, 255, 255, 0, ...],
+  colorSpace: "srgb"
+}
+```
+---
+
+### Web examples
+
+```bash
+npm i @alttiri/get-image-data
+```
+
+#### `File` from `HTMLInputElement`:
+
+```js
+import {getImageDataWithCanvas as getImageData} from "@alttiri/get-image-data";
+
+const input = document.querySelector(`input[type="file"]`);
+input.onchange = async function() {
+  const file = input.files[0];
+  const imageData = await getImageData(file);
+  console.log(imageData);
+}
+```
+
+#### `Blob` from `fetch` response:
+
+```ts
+import {getImageDataWithCanvas as getImageData} from "@alttiri/get-image-data";
+
+const imageUrl = "https://i.imgur.com/DR94LKg.jpeg";
+const resp = await fetch(imageUrl);
+const blob = await resp.blob();
+const imageData = await getImageData(blob);
+console.log(imageData);
+```

src/get-with-sharp.d.ts

 import { ImageDataLike } from "./types.js";
-export declare function getImageDataWithSharp(inputData: string | ArrayBufferLike, longPathFix?: boolean): Promise<ImageDataLike>;
+export declare function getImageDataWithSharp(inputData: string | ArrayBufferLike | ArrayBufferView, longPathFix?: boolean): Promise<ImageDataLike>;

src/get-with-sharp.js

@@ -11,2 +11,5 @@ import path from "node:path";
     }
+    else if (ArrayBuffer.isView(inputData)) {
+        inputData = inputData.buffer;
+    }
     const sharp = sharpCache;
@@ -13,0 +16,0 @@ const imageData = await sharp(inputData)

No alert changes

Improved metrics

Total package byte prevSize

7107

increased by34.45%

Lines of code

59

increased by5.36%

Number of lines in readme file

92

increased by318.18%

No dependency changes