react-native-snow-backgroud 0.1.4 → 0.1.5

package/lib/module/snow/SnowView.js

@@ -1,6 +1,6 @@
 "use strict";
 
-import { useEffect, useRef } from "react";
+import { useEffect, useRef, useState } from "react";
 import { Dimensions, View, StyleSheet } from "react-native";
 import { Canvas, Circle } from "@shopify/react-native-skia";
 import { SnowEngine } from "./SnowEngine.js";
@@ -14,6 +14,7 @@ export function SnowView({
     height
   } = Dimensions.get("window");
   const engineRef = useRef(null);
+  const [, forceRender] = useState(0);
   if (!engineRef.current) {
     engineRef.current = new SnowEngine(count, width, height);
   }
@@ -21,6 +22,7 @@ export function SnowView({
     let raf;
     const loop = () => {
       engineRef.current?.update();
+      forceRender(v => v + 1);
       raf = requestAnimationFrame(loop);
     };
     loop();

package/lib/module/snow/SnowView.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useRef","Dimensions","View","StyleSheet","Canvas","Circle","SnowEngine","jsx","_jsx","jsxs","_jsxs","SnowView","count","children","width","height","get","engineRef","current","raf","loop","update","requestAnimationFrame","cancelAnimationFrame","snow","style","flex","absoluteFill","zIndex","pointerEvents","particles","map","p","i","cx","x","cy","y","r","size","color"],"sourceRoot":"../../../src","sources":["snow/SnowView.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAMzC,SAASC,UAAU,EAAEC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC3D,SAASC,MAAM,EAAEC,MAAM,QAAQ,4BAA4B;AAC3D,SAASC,UAAU,QAAQ,iBAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAC1C,OAAO,SAASC,QAAQA,CAAC;EAAEC,KAAK,GAAG,GAAG;EAAEC;AAAwB,CAAC,EAAE;EAEjE,MAAM;IAAEC,KAAK;IAAEC;EAAO,CAAC,GAAGd,UAAU,CAACe,GAAG,CAAC,QAAQ,CAAC;EAClD,MAAMC,SAAS,GAAGjB,MAAM,CAAoB,IAAI,CAAC;EAEjD,IAAI,CAACiB,SAAS,CAACC,OAAO,EAAE;IACtBD,SAAS,CAACC,OAAO,GAAG,IAAIZ,UAAU,CAACM,KAAK,EAAEE,KAAK,EAAEC,MAAM,CAAC;EAC1D;EAEAhB,SAAS,CAAC,MAAM;IACd,IAAIoB,GAAW;IACf,MAAMC,IAAI,GAAGA,CAAA,KAAM;MACjBH,SAAS,CAACC,OAAO,EAAEG,MAAM,CAAC,CAAC;MAC3BF,GAAG,GAAGG,qBAAqB,CAACF,IAAI,CAAC;IACnC,CAAC;IACDA,IAAI,CAAC,CAAC;IACN,OAAO,MAAMG,oBAAoB,CAACJ,GAAG,CAAC;EACxC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMK,IAAI,GAAGP,SAAS,CAACC,OAAO;EAE9B,oBACER,KAAA,CAACR,IAAI;IAACuB,KAAK,EAAE;MAAEC,IAAI,EAAE;IAAE,CAAE;IAAAb,QAAA,GACtBA,QAAQ,eACTL,IAAA,CAACJ,MAAM;MACLqB,KAAK,EAAE,CACLtB,UAAU,CAACwB,YAAY,EACvB;QAAEC,MAAM,EAAE,EAAE;QAAEC,aAAa,EAAE;MAAO,CAAC,CACrC;MAAAhB,QAAA,EAEDW,IAAI,EAAEM,SAAS,CAACC,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,kBACxBzB,IAAA,CAACH,MAAM;QAAS6B,EAAE,EAAEF,CAAC,CAACG,CAAE;QAACC,EAAE,EAAEJ,CAAC,CAACK,CAAE;QAACC,CAAC,EAAEN,CAAC,CAACO,IAAK;QAACC,KAAK,EAAC;MAAO,GAA7CP,CAA+C,CAC7D;IAAC,CACI,CAAC;EAAA,CACL,CAAC;AAEX","ignoreList":[]}
+{"version":3,"names":["useEffect","useRef","useState","Dimensions","View","StyleSheet","Canvas","Circle","SnowEngine","jsx","_jsx","jsxs","_jsxs","SnowView","count","children","width","height","get","engineRef","forceRender","current","raf","loop","update","v","requestAnimationFrame","cancelAnimationFrame","snow","style","flex","absoluteFill","zIndex","pointerEvents","particles","map","p","i","cx","x","cy","y","r","size","color"],"sourceRoot":"../../../src","sources":["snow/SnowView.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAEnD,SAASC,UAAU,EAAEC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC3D,SAASC,MAAM,EAAEC,MAAM,QAAQ,4BAA4B;AAC3D,SAASC,UAAU,QAAQ,iBAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAE1C,OAAO,SAASC,QAAQA,CAAC;EAAEC,KAAK,GAAG,GAAG;EAAEC;AAGxC,CAAC,EAAE;EACD,MAAM;IAAEC,KAAK;IAAEC;EAAO,CAAC,GAAGd,UAAU,CAACe,GAAG,CAAC,QAAQ,CAAC;EAClD,MAAMC,SAAS,GAAGlB,MAAM,CAAoB,IAAI,CAAC;EACjD,MAAM,GAAGmB,WAAW,CAAC,GAAGlB,QAAQ,CAAC,CAAC,CAAC;EAEnC,IAAI,CAACiB,SAAS,CAACE,OAAO,EAAE;IACtBF,SAAS,CAACE,OAAO,GAAG,IAAIb,UAAU,CAACM,KAAK,EAAEE,KAAK,EAAEC,MAAM,CAAC;EAC1D;EAEAjB,SAAS,CAAC,MAAM;IACd,IAAIsB,GAAW;IACf,MAAMC,IAAI,GAAGA,CAAA,KAAM;MACjBJ,SAAS,CAACE,OAAO,EAAEG,MAAM,CAAC,CAAC;MAC3BJ,WAAW,CAACK,CAAC,IAAIA,CAAC,GAAG,CAAC,CAAC;MACvBH,GAAG,GAAGI,qBAAqB,CAACH,IAAI,CAAC;IACnC,CAAC;IACDA,IAAI,CAAC,CAAC;IACN,OAAO,MAAMI,oBAAoB,CAACL,GAAG,CAAC;EACxC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMM,IAAI,GAAGT,SAAS,CAACE,OAAO;EAE9B,oBACET,KAAA,CAACR,IAAI;IAACyB,KAAK,EAAE;MAAEC,IAAI,EAAE;IAAE,CAAE;IAAAf,QAAA,GACtBA,QAAQ,eACTL,IAAA,CAACJ,MAAM;MACLuB,KAAK,EAAE,CACLxB,UAAU,CAAC0B,YAAY,EACvB;QAAEC,MAAM,EAAE,EAAE;QAAEC,aAAa,EAAE;MAAO,CAAC,CACrC;MAAAlB,QAAA,EAEDa,IAAI,EAAEM,SAAS,CAACC,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,kBACxB3B,IAAA,CAACH,MAAM;QAAS+B,EAAE,EAAEF,CAAC,CAACG,CAAE;QAACC,EAAE,EAAEJ,CAAC,CAACK,CAAE;QAACC,CAAC,EAAEN,CAAC,CAACO,IAAK;QAACC,KAAK,EAAC;MAAO,GAA7CP,CAA+C,CAC7D;IAAC,CACI,CAAC;EAAA,CACL,CAAC;AAEX","ignoreList":[]}

package/lib/typescript/src/snow/SnowView.d.ts

@@ -1,8 +1,6 @@
 import type { ReactNode } from "react";
-type SnowViewProps = {
+export declare function SnowView({ count, children }: {
     count?: number;
     children?: ReactNode;
-};
-export declare function SnowView({ count, children }: SnowViewProps): import("react/jsx-runtime").JSX.Element;
-export {};
+}): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=SnowView.d.ts.map

package/lib/typescript/src/snow/SnowView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SnowView.d.ts","sourceRoot":"","sources":["../../../../src/snow/SnowView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,KAAK,aAAa,GAAG;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAIF,wBAAgB,QAAQ,CAAC,EAAE,KAAW,EAAE,QAAQ,EAAE,EAAE,aAAa,2CAoChE"}
+{"version":3,"file":"SnowView.d.ts","sourceRoot":"","sources":["../../../../src/snow/SnowView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,wBAAgB,QAAQ,CAAC,EAAE,KAAW,EAAE,QAAQ,EAAE,EAAE;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,2CAqCA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-snow-backgroud",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "A simple snow background effect for React Native CLI using Skia.",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/snow/SnowView.tsx

@@ -1,16 +1,16 @@
-import { useEffect, useRef } from "react";
+import { useEffect, useRef, useState } from "react";
 import type { ReactNode } from "react";
-type SnowViewProps = {
-  count?: number;
-  children?: ReactNode;
-};
 import { Dimensions, View, StyleSheet } from "react-native";
 import { Canvas, Circle } from "@shopify/react-native-skia";
 import { SnowEngine } from "./SnowEngine";
-export function SnowView({ count = 100, children }: SnowViewProps) {
 
+export function SnowView({ count = 100, children }: {
+  count?: number;
+  children?: ReactNode;
+}) {
   const { width, height } = Dimensions.get("window");
   const engineRef = useRef<SnowEngine | null>(null);
+  const [, forceRender] = useState(0);
 
   if (!engineRef.current) {
     engineRef.current = new SnowEngine(count, width, height);
@@ -20,6 +20,7 @@ export function SnowView({ count = 100, children }: SnowViewProps) {
     let raf: number;
     const loop = () => {
       engineRef.current?.update();
+      forceRender(v => v + 1);
       raf = requestAnimationFrame(loop);
     };
     loop();
@@ -42,5 +43,5 @@ export function SnowView({ count = 100, children }: SnowViewProps) {
         ))}
       </Canvas>
     </View>
-  );  
+  );
 }