next-blurhash-previews 0.0.3-beta53 → 0.0.3-beta54

package/components/ImageWithPreview.tsx

@@ -1,10 +1,5 @@
-//import { decode } from "blurhash/dist/esm";
-
 type blurhash = { w: number; h: number; blurhash: string };
 
-//declare function __blurhashDecode(blurhash: string, width: number, height: any);
-//(window as any).__blurhashDecode = decode;
-
 class ImageWithPreview extends HTMLElement {
   sd: ShadowRoot;
   mo?: MutationObserver;
@@ -37,7 +32,7 @@ class ImageWithPreview extends HTMLElement {
         this.#imgEl.addEventListener("load", this.#imgLoad);
       }
 
-      return true;
+      return 1;
     }
   };
 
@@ -54,9 +49,7 @@ class ImageWithPreview extends HTMLElement {
   }
 
   #imgLoad = () => {
-    setTimeout(() => {
-      this.sd.innerHTML = `<slot name="image"></slot>`;
-    }, 19000);
+    this.sd.innerHTML = `<slot name="image"></slot>`;
   };
 
   attributeChangedCallback(name) {
@@ -96,12 +89,4 @@ function updateBlurHashPreview(canvasEl: HTMLCanvasElement, preview: blurhash) {
       offscreen,
     ]);
   }
-
-  return;
-  // @ts-ignore
-  const pixels = decode(blurhash, width, height);
-  const ctx = canvasEl.getContext("2d")!;
-  const imageData = ctx.createImageData(width, height);
-  imageData.data.set(pixels);
-  ctx.putImageData(imageData, 0, 0);
 }

package/imagePreviewBootstrap.js

@@ -4,7 +4,7 @@ export const imagePreviewBootstrap = createElement(
   Fragment,
   {},
   createElement("script", {
-    dangerouslySetInnerHTML: { __html: `(() => { "use strict";class a extends HTMLElement{sd;mo;static observedAttributes=["preview"];#s=!1;get#e(){return this.querySelector("img")}get#t(){return this.querySelector("canvas")}constructor(){super(),this.sd=this.attachShadow({mode:"open"}),this.sd.innerHTML='<slot name="preview"></slot>'}#i=()=>{if(this.#e&&this.#t)return this.mo?.disconnect(),this.#e.complete?this.#r():(this.#h(),this.#e.addEventListener("load",this.#r)),!0};connectedCallback(){this.#s=!0,this.#i()||(this.mo=new MutationObserver(this.#i),this.mo.observe(this,{subtree:!0,childList:!0,attributes:!1}))}#r=()=>{setTimeout(()=>{this.sd.innerHTML='<slot name="image"></slot>'},19e3)};attributeChangedCallback(e){this.#t&&e==="preview"&&this.#h()}#h(){if(!this.#s||!this.getAttribute("preview"))return;const e=JSON.parse(this.getAttribute("preview"));c(this.#t,e)}}customElements.get("blurhash-image")||customElements.define("blurhash-image",a);function c(t,e){const{w:s,h:i,blurhash:h}=e;t.width=s,t.height=i;{const n=new Blob([document.querySelector("#next-blurhash-worker-script").textContent],{type:"text/javascript"}),o=new Worker(window.URL.createObjectURL(n)),r=t.transferControlToOffscreen();o.postMessage({canvas:r,width:s,height:i,blurhash:h},[r])}} })();` },
+    dangerouslySetInnerHTML: { __html: `(() => { "use strict";class a extends HTMLElement{sd;mo;static observedAttributes=["preview"];#s=!1;get#e(){return this.querySelector("img")}get#t(){return this.querySelector("canvas")}constructor(){super(),this.sd=this.attachShadow({mode:"open"}),this.sd.innerHTML='<slot name="preview"></slot>'}#i=()=>{if(this.#e&&this.#t)return this.mo?.disconnect(),this.#e.complete?this.#r():(this.#h(),this.#e.addEventListener("load",this.#r)),1};connectedCallback(){this.#s=!0,this.#i()||(this.mo=new MutationObserver(this.#i),this.mo.observe(this,{subtree:!0,childList:!0,attributes:!1}))}#r=()=>{this.sd.innerHTML='<slot name="image"></slot>'};attributeChangedCallback(e){this.#t&&e==="preview"&&this.#h()}#h(){if(!this.#s||!this.getAttribute("preview"))return;const e=JSON.parse(this.getAttribute("preview"));c(this.#t,e)}}customElements.get("blurhash-image")||customElements.define("blurhash-image",a);function c(t,e){const{w:s,h:i,blurhash:h}=e;t.width=s,t.height=i;{const n=new Blob([document.querySelector("#next-blurhash-worker-script").textContent],{type:"text/javascript"}),o=new Worker(window.URL.createObjectURL(n)),r=t.transferControlToOffscreen();o.postMessage({canvas:r,width:s,height:i,blurhash:h},[r])}} })();` },
   }),
   createElement("script", {
     id: "next-blurhash-worker-script",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-blurhash-previews",
-  "version": "0.0.3-beta53",
+  "version": "0.0.3-beta54",
   "description": "",
   "main": "index.js",
   "module": "index.js",