matrix-rain-webgpu 1.0.0-beta.1 → 1.0.0

package/README.md

@@ -1,5 +1,7 @@
 # matrix-rain-webgpu
 
+[![npm](https://img.shields.io/npm/v/matrix-rain-webgpu)](https://www.npmjs.com/package/matrix-rain-webgpu)
+[![CI](https://github.com/chicio/matrix-rain-webgpu/actions/workflows/ci.yml/badge.svg)](https://github.com/chicio/matrix-rain-webgpu/actions/workflows/ci.yml)
 [![Deploy](https://github.com/chicio/matrix-rain-webgpu/actions/workflows/deploy.yml/badge.svg)](https://github.com/chicio/matrix-rain-webgpu/actions/workflows/deploy.yml)
 
 > A Matrix-style "digital rain" background effect for React, rendered on the GPU with WebGPU via [TypeGPU](https://docs.swmansion.com/TypeGPU/). GPU-driven simulation, signed-distance-field glyphs, depth parallax, bloom, and a CRT post-process.
@@ -79,4 +81,4 @@ npm --prefix docs run dev
 
 ## Author
 
-Built by [Fabrizio Duroni](https://www.fabrizioduroni.it). If you enjoy it, a visit to the site is the best way to support the work. Also don't foget to star this repository :star:
+Built by [Fabrizio Duroni](https://www.fabrizioduroni.it). If you enjoy it, a visit to the site is the best way to support the work. Also don't forget :star: to star this repository :star:.

package/dist/index.js

@@ -3060,6 +3060,17 @@ function X(i) {
 	c.current = i;
 	let [l, u] = r(0), d = n(0), f = n(null), p = n(!1);
 	t(() => {
+		let e = () => {
+			if (document.visibilityState !== "visible") return;
+			let e = c.current.ctxRef.current;
+			e && e.configure({
+				device: a.device,
+				format: navigator.gpu.getPreferredCanvasFormat(),
+				alphaMode: "premultiplied"
+			});
+		};
+		return document.addEventListener("visibilitychange", e), () => document.removeEventListener("visibilitychange", e);
+	}, [a]), t(() => {
 		let e = !1;
 		return x().then((t) => {
 			e || (f.current = t);
@@ -3194,11 +3205,7 @@ function de(e) {
 		r,
 		i,
 		a
-	]), t(() => {
-		n.status === "resolved" && n.value.device.lost.then((e) => {
-			console.warn("[matrix-rain] GPUDevice lost:", e.reason, e.message);
-		});
-	}, [n]), r === "resolved" ? /* @__PURE__ */ p(fe, { ...e }) : null;
+	]), r === "resolved" ? /* @__PURE__ */ p(fe, { ...e }) : null;
 }
 function fe(e) {
 	let { ref: t, ctxRef: n } = i({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "matrix-rain-webgpu",
-  "version": "1.0.0-beta.1",
+  "version": "1.0.0",
   "description": "WebGPU/TypeGPU Matrix-rain background effect for React.",
   "keywords": [
     "background-effect",