react-native-snow-backgroud 0.1.1 → 0.1.2

package/lib/module/snow/SnowView.js

@@ -1,12 +1,13 @@
 "use strict";
 
 import { useEffect, useRef } from "react";
-import { Dimensions } from "react-native";
+import { Dimensions, View, StyleSheet } from "react-native";
 import { Canvas, Circle } from "@shopify/react-native-skia";
 import { SnowEngine } from "./SnowEngine.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function SnowView({
-  count = 100
+  count = 100,
+  children
 }) {
   const {
     width,
@@ -26,16 +27,17 @@ export function SnowView({
     return () => cancelAnimationFrame(raf);
   }, []);
   const snow = engineRef.current;
-  return /*#__PURE__*/_jsx(Canvas, {
-    style: {
-      flex: 1
-    },
-    children: snow?.particles.map((p, i) => /*#__PURE__*/_jsx(Circle, {
-      cx: p.x,
-      cy: p.y,
-      r: p.size,
-      color: "white"
-    }, i))
+  return /*#__PURE__*/_jsxs(View, {
+    style: StyleSheet.absoluteFill,
+    children: [/*#__PURE__*/_jsx(Canvas, {
+      style: StyleSheet.absoluteFill,
+      children: snow?.particles.map((p, i) => /*#__PURE__*/_jsx(Circle, {
+        cx: p.x,
+        cy: p.y,
+        r: p.size,
+        color: "white"
+      }, i))
+    }), children]
   });
 }
 //# sourceMappingURL=SnowView.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useRef","Dimensions","Canvas","Circle","SnowEngine","jsx","_jsx","SnowView","count","width","height","get","engineRef","current","raf","loop","update","requestAnimationFrame","cancelAnimationFrame","snow","style","flex","children","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;AACzC,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,MAAM,EAAEC,MAAM,QAAQ,4BAA4B;AAC3D,SAASC,UAAU,QAAQ,iBAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE1C,OAAO,SAASC,QAAQA,CAAC;EAAEC,KAAK,GAAG;AAAwB,CAAC,EAAE;EAC5D,MAAM;IAAEC,KAAK;IAAEC;EAAO,CAAC,GAAGT,UAAU,CAACU,GAAG,CAAC,QAAQ,CAAC;EAClD,MAAMC,SAAS,GAAGZ,MAAM,CAAoB,IAAI,CAAC;EAEjD,IAAI,CAACY,SAAS,CAACC,OAAO,EAAE;IACtBD,SAAS,CAACC,OAAO,GAAG,IAAIT,UAAU,CAACI,KAAK,EAAEC,KAAK,EAAEC,MAAM,CAAC;EAC1D;EAEAX,SAAS,CAAC,MAAM;IACd,IAAIe,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,oBACEP,IAAA,CAACJ,MAAM;IAACkB,KAAK,EAAE;MAAEC,IAAI,EAAE;IAAE,CAAE;IAAAC,QAAA,EACxBH,IAAI,EAAEI,SAAS,CAACC,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,kBACxBpB,IAAA,CAACH,MAAM;MAASwB,EAAE,EAAEF,CAAC,CAACG,CAAE;MAACC,EAAE,EAAEJ,CAAC,CAACK,CAAE;MAACC,CAAC,EAAEN,CAAC,CAACO,IAAK;MAACC,KAAK,EAAC;IAAO,GAA7CP,CAA+C,CAC7D;EAAC,CACI,CAAC;AAEb","ignoreList":[]}
+{"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","absoluteFill","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,EAAEtB,UAAU,CAACuB,YAAa;IAAAb,QAAA,gBACnCL,IAAA,CAACJ,MAAM;MAACqB,KAAK,EAAEtB,UAAU,CAACuB,YAAa;MAAAb,QAAA,EACpCW,IAAI,EAAEG,SAAS,CAACC,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,kBACxBtB,IAAA,CAACH,MAAM;QAAS0B,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,EAERjB,QAAQ;EAAA,CACL,CAAC;AAEX","ignoreList":[]}

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

@@ -1,4 +1,8 @@
-export declare function SnowView({ count }: {
+import type { ReactNode } from "react";
+type SnowViewProps = {
     count?: number;
-}): import("react/jsx-runtime").JSX.Element;
+    children?: ReactNode;
+};
+export declare function SnowView({ count, children }: SnowViewProps): import("react/jsx-runtime").JSX.Element;
+export {};
 //# 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":"AAKA,wBAAgB,QAAQ,CAAC,EAAE,KAAW,EAAE,EAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,2CA2B3D"}
+{"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,2CAgChE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-snow-backgroud",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "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,9 +1,14 @@
 import { useEffect, useRef } from "react";
-import { Dimensions } from "react-native";
+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 }: { count?: number }) {
   const { width, height } = Dimensions.get("window");
   const engineRef = useRef<SnowEngine | null>(null);
 
@@ -24,10 +29,14 @@ export function SnowView({ count = 100 }: { count?: number }) {
   const snow = engineRef.current;
 
   return (
-    <Canvas style={{ flex: 1 }}>
-      {snow?.particles.map((p, i) => (
-        <Circle key={i} cx={p.x} cy={p.y} r={p.size} color="white" />
-      ))}
-    </Canvas>
-  );
+    <View style={StyleSheet.absoluteFill}>
+      <Canvas style={StyleSheet.absoluteFill}>
+        {snow?.particles.map((p, i) => (
+          <Circle key={i} cx={p.x} cy={p.y} r={p.size} color="white" />
+        ))}
+      </Canvas>
+  
+      {children}
+    </View>
+  );  
 }