blurhash-base64 - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

dist/index.d.ts

@@ -1,6 +0,21 @@
-export interface IOptions {
-    hash: string;
-    height?: number;
-    width?: number;
-}
+/**
+ * Convert Blurhash to Base64
+ *
+ * @param {string} hash - Pass the hash
+ * @returns {string} base64/dataURL
+ * @example
+ * ```js
+ * import { blurhashToBase64 } from "blurhash-base64";
+ *
+ * const base64 = blurhashToBase64("U25EI7[k0]1D=*RzA8XA9WBEj]^BS%be,^$O");
+ * console.log(base64)
+ * ```
+ * -------
+ * Others:
+ *
+ * ✨ URL to Blurhash - https://www.npmjs.com/package/blurhash-from-url
+ *
+ * ✨ Generate Blurhash in CLI: https://www.npmjs.com/package/blurhash-cli
+ *
+ */
 export declare function blurhashToBase64(hash: string): string;

dist/index.esm.js

@@ -1,1 +0,1 @@
-import{decode as r}from"blurhash";function t(t){if(!t)return;const n=function(r,t,n){const o=[...r].map((r=>String.fromCharCode(r))).join(""),e=function(r,t,n){const o=String.fromCharCode(120,1),e=[],f=String.fromCharCode(137,80,78,71,13,10,26,10),i=String.fromCharCode(0);let C,a,u;for(C=0;C<256;C++){for(a=C,u=0;u<8;u++)1&a?a=3988292384^a>>>1:a>>>=1;e[C]=a}function h(r){const t=65535;let n,o,e="";for(let f=0;f<r.length;f+=t)n=r.length-f,o="",n<=t?o=String.fromCharCode(1):(n=t,o=String.fromCharCode(0)),e+=o+String.fromCharCode(255&n,(65280&n)>>>8),e+=String.fromCharCode(255&~n,(65280&~n)>>>8),e+=r.substring(f,f+n);return e}function g(r){let t=65521,n=1,o=0;for(let e=0;e<r.length;e++)n=(n+r.charCodeAt(e))%t,o=(o+n)%t;return o<<16|n}function c(r,t){let n,o=r;for(let r=0;r<t.length;r++)n=t.charCodeAt(r),o=e[255&(o^n)]^o>>>8;return o}function d(r){return 4294967295^c(4294967295,r)}function l(r){return String.fromCharCode((4278190080&r)>>>24,(16711680&r)>>>16,(65280&r)>>>8,255&r)}function m(r,t,n){const o=d(t+n);return l(r)+t+n+l(o)}function s(r,t){return m(13,"IHDR",l(r)+l(t)+String.fromCharCode(8)+String.fromCharCode(6)+String.fromCharCode(0)+String.fromCharCode(0)+String.fromCharCode(0))}const S=m(0,"IEND",""),A=s(r,t);let b,p="";for(let t=0;t<n.length;t+=4*r){if(b=i,Array.isArray(n))for(let o=0;o<4*r;o++)b+=String.fromCharCode(255&n[t+o]);else b+=n.substr(t,4*r);p+=b}const y=o+h(p)+l(g(p)),D=m(y.length,"IDAT",y),I=f+A+D+S;return I}(t,n,o),f="undefined"!=typeof Buffer?Buffer.from(function(r){const t=new Uint8Array(r.length);for(let n=0;n<r.length;n++)t[n]=r.charCodeAt(n);return t}(e)).toString("base64"):btoa(e);return"data:image/png;base64,"+f}(r(t,32,32),32,32);return n}export{t as blurhashToBase64};
+import{decode as r}from"blurhash";function t(t){if(!t)return;const n=function(r,t,n){const o=[...r].map((r=>String.fromCharCode(r))).join(""),e=function(r,t,n){const o=String.fromCharCode(120,1),e=[],f=String.fromCharCode(137,80,78,71,13,10,26,10),i=String.fromCharCode(0);let C,a,u;for(C=0;C<256;C++){for(a=C,u=0;u<8;u++)1&a?a=3988292384^a>>>1:a>>>=1;e[C]=a}function h(r){const t=65535;let n,o,e="";for(let f=0;f<r.length;f+=t)n=r.length-f,o="",n<=t?o=String.fromCharCode(1):(n=t,o=String.fromCharCode(0)),e+=o+String.fromCharCode(255&n,(65280&n)>>>8),e+=String.fromCharCode(255&~n,(65280&~n)>>>8),e+=r.substring(f,f+n);return e}function g(r){let t=65521,n=1,o=0;for(let e=0;e<r.length;e++)n=(n+r.charCodeAt(e))%t,o=(o+n)%t;return o<<16|n}function c(r,t){let n,o=r;for(let r=0;r<t.length;r++)n=t.charCodeAt(r),o=e[255&(o^n)]^o>>>8;return o}function d(r){return 4294967295^c(4294967295,r)}function l(r){return String.fromCharCode((4278190080&r)>>>24,(16711680&r)>>>16,(65280&r)>>>8,255&r)}function m(r,t,n){const o=d(t+n);return l(r)+t+n+l(o)}function s(r,t){return m(13,"IHDR",l(r)+l(t)+String.fromCharCode(8)+String.fromCharCode(6)+String.fromCharCode(0)+String.fromCharCode(0)+String.fromCharCode(0))}const S=m(0,"IEND",""),A=s(r,t);let b,p="";for(let t=0;t<n.length;t+=4*r){if(b=i,Array.isArray(n))for(let o=0;o<4*r;o++)b+=String.fromCharCode(255&n[t+o]);else b+=n.substr(t,4*r);p+=b}const y=o+h(p)+l(g(p)),D=m(y.length,"IDAT",y),I=f+A+D+S;return I}(t,n,o);return"data:image/png;base64,"+("undefined"!=typeof Buffer?Buffer.from(function(r){const t=new Uint8Array(r.length);for(let n=0;n<r.length;n++)t[n]=r.charCodeAt(n);return t}(e)).toString("base64"):btoa(e))}(r(t,32,32),32,32);return n}export{t as blurhashToBase64};

dist/index.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("blurhash");exports.blurhashToBase64=function(t){if(!t)return;return function(r,t,e){const n=[...r].map((r=>String.fromCharCode(r))).join(""),o=function(r,t,e){const n=String.fromCharCode(120,1),o=[],f=String.fromCharCode(137,80,78,71,13,10,26,10),i=String.fromCharCode(0);let u,a,C;for(u=0;u<256;u++){for(a=u,C=0;C<8;C++)1&a?a=3988292384^a>>>1:a>>>=1;o[u]=a}function h(r){const t=65535;let e,n,o="";for(let f=0;f<r.length;f+=t)e=r.length-f,n="",e<=t?n=String.fromCharCode(1):(e=t,n=String.fromCharCode(0)),o+=n+String.fromCharCode(255&e,(65280&e)>>>8),o+=String.fromCharCode(255&~e,(65280&~e)>>>8),o+=r.substring(f,f+e);return o}function g(r){let t=65521,e=1,n=0;for(let o=0;o<r.length;o++)e=(e+r.charCodeAt(o))%t,n=(n+e)%t;return n<<16|e}function d(r,t){let e,n=r;for(let r=0;r<t.length;r++)e=t.charCodeAt(r),n=o[255&(n^e)]^n>>>8;return n}function c(r){return 4294967295^d(4294967295,r)}function l(r){return String.fromCharCode((4278190080&r)>>>24,(16711680&r)>>>16,(65280&r)>>>8,255&r)}function s(r,t,e){const n=c(t+e);return l(r)+t+e+l(n)}function m(r,t){return s(13,"IHDR",l(r)+l(t)+String.fromCharCode(8)+String.fromCharCode(6)+String.fromCharCode(0)+String.fromCharCode(0)+String.fromCharCode(0))}const S=s(0,"IEND",""),b=m(r,t);let A,p="";for(let t=0;t<e.length;t+=4*r){if(A=i,Array.isArray(e))for(let n=0;n<4*r;n++)A+=String.fromCharCode(255&e[t+n]);else A+=e.substr(t,4*r);p+=A}const y=n+h(p)+l(g(p)),B=s(y.length,"IDAT",y),D=f+b+B+S;return D}(t,e,n),f="undefined"!=typeof Buffer?Buffer.from(function(r){const t=new Uint8Array(r.length);for(let e=0;e<r.length;e++)t[e]=r.charCodeAt(e);return t}(o)).toString("base64"):btoa(o);return"data:image/png;base64,"+f}(r.decode(t,32,32),32,32)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("blurhash");exports.blurhashToBase64=function(t){if(!t)return;return function(r,t,e){const n=[...r].map((r=>String.fromCharCode(r))).join(""),o=function(r,t,e){const n=String.fromCharCode(120,1),o=[],f=String.fromCharCode(137,80,78,71,13,10,26,10),i=String.fromCharCode(0);let u,a,C;for(u=0;u<256;u++){for(a=u,C=0;C<8;C++)1&a?a=3988292384^a>>>1:a>>>=1;o[u]=a}function h(r){const t=65535;let e,n,o="";for(let f=0;f<r.length;f+=t)e=r.length-f,n="",e<=t?n=String.fromCharCode(1):(e=t,n=String.fromCharCode(0)),o+=n+String.fromCharCode(255&e,(65280&e)>>>8),o+=String.fromCharCode(255&~e,(65280&~e)>>>8),o+=r.substring(f,f+e);return o}function g(r){let t=65521,e=1,n=0;for(let o=0;o<r.length;o++)e=(e+r.charCodeAt(o))%t,n=(n+e)%t;return n<<16|e}function d(r,t){let e,n=r;for(let r=0;r<t.length;r++)e=t.charCodeAt(r),n=o[255&(n^e)]^n>>>8;return n}function c(r){return 4294967295^d(4294967295,r)}function l(r){return String.fromCharCode((4278190080&r)>>>24,(16711680&r)>>>16,(65280&r)>>>8,255&r)}function s(r,t,e){const n=c(t+e);return l(r)+t+e+l(n)}function m(r,t){return s(13,"IHDR",l(r)+l(t)+String.fromCharCode(8)+String.fromCharCode(6)+String.fromCharCode(0)+String.fromCharCode(0)+String.fromCharCode(0))}const S=s(0,"IEND",""),b=m(r,t);let A,p="";for(let t=0;t<e.length;t+=4*r){if(A=i,Array.isArray(e))for(let n=0;n<4*r;n++)A+=String.fromCharCode(255&e[t+n]);else A+=e.substr(t,4*r);p+=A}const y=n+h(p)+l(g(p)),B=s(y.length,"IDAT",y),D=f+b+B+S;return D}(t,e,n);return"data:image/png;base64,"+("undefined"!=typeof Buffer?Buffer.from(function(r){const t=new Uint8Array(r.length);for(let e=0;e<r.length;e++)t[e]=r.charCodeAt(e);return t}(o)).toString("base64"):btoa(o))}(r.decode(t,32,32),32,32)};

package.json

 {
   "name": "blurhash-base64",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Utility to convert blurhash to base64",
@@ -17,15 +17,2 @@ "main": "dist/index.js",
   },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/mcnaveen/blurhash-base64.git"
-  },
-  "keywords": [
-    "blurhash"
-  ],
-  "author": "mcnaveen <[e-mail]>",
-  "license": "ISC",
-  "bugs": {
-    "url": "https://github.com/mcnaveen/blurhash-base64/issues"
-  },
-  "homepage": "https://github.com/mcnaveen/blurhash-base64#readme",
   "dependencies": {
@@ -46,2 +33,20 @@ "blurhash": "^2.0.5"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/mcnaveen/blurhash-base64.git"
+  },
+  "author": "mcnaveen <[e-mail]>",
+  "homepage": "https://github.com/mcnaveen/blurhash-base64#readme",
+  "bugs": {
+    "url": "https://github.com/mcnaveen/blurhash-base64/issues"
+  },
+  "license": "MIT",
+  "keywords": [
+    "blurhash",
+    "plaiceholder",
+    "optimization",
+    "next/image",
+    "next-image",
+    "blurhash-to-base64"
+  ],
   "gacp": {
@@ -48,0 +53,0 @@ "add": false,

README.md

@@ -0,1 +1,67 @@
+# Blurhash to Base64
+
+:unicorn: Turn blurhash to dataURL on the go.
+
 ![Test](https://github.com/mcnaveen/blurhash-base64/workflows/Test/badge.svg)
+![Downloads this Week](https://img.shields.io/npm/dw/blurhash-base64)
+![Bundle Size](https://img.shields.io/bundlephobia/min/blurhash-base64)
+![Version](https://img.shields.io/npm/v/blurhash-base64)
+
+![Blurhash to DataURL](./image/cover.png)
+
+### :package: Requirements
+
+- Node.js 16X LTS or Higher 📦
+
+### :sparkles: Installation
+
+- Install the NPM Package with the below command:
+
+```bash
+#npm
+npm install -g blurhash-base64
+
+#yarn
+yarn global add blurhash-base64
+
+#pnpm
+pnpm add blurhash-base64
+```
+
+### :bulb: Usage Example for next/image component
+
+- Import `blurhashToBase64` in your project
+- Set the `placeholder` prop to `blur`
+- And pass the blurhash to `blurDataURL` prop surrounded by `blurhashToBase64` (See below example)
+
+```javascript
+import Image from "next/image";
+import { blurhashToBase64 } from "blurhash-base64"; // Import blurhashToBase64
+
+export default function Home() {
+  return (
+    <div>
+      <Image
+        src="https://picsum.photos/200/300"
+        width={200}
+        height={300}
+        placeholder="blur"
+        blurDataURL={blurhashToBase64("UNFFyr-4VXtm%~Z~VXpJpdngnMtl_Ns7VrXA")}
+      />
+    </div>
+  );
+}
+```
+
+### :ballot_box_with_check: Demo
+
+![Blurhash to DataURL](./image/demo.gif)
+
+### :six_pointed_star: Credits
+
+- Blurhash is Generated with [blurhash-from-url](https://www.github.com/mcnaveen/blurhash-from-url) - A library to generate the blurhash from the given URL.
+- [Blurhash CLI](https://github.com/mcnaveen/blurhash-cli) - Generate Blurhash in CLI
+
+#### :green_heart: Message
+
+I hope you find this useful. If you have any questions, please create an issue.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7113

increased by44.49%

Lines of code

35

increased by75%

Number of lines in readme file

68

increased by3300%

No dependency changes