Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

starfield-react

Package Overview
Dependencies
Maintainers
1
Versions
16
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

starfield-react - npm Package Compare versions

Comparing version 3.1.0-dev-0 to 3.1.0-dev-1

5

dist/src/components/FullScreenStarField.d.ts

@@ -1,2 +0,3 @@

/// <reference types="react" />
export declare const FullScreenStarField: (props: any) => JSX.Element;
import React from 'react';
import { Props } from './StarField';
export declare const FullScreenStarField: React.FC<Props>;

1

dist/src/components/StarField.d.ts

@@ -16,2 +16,3 @@ import * as React from 'react';

className?: string;
style?: React.CSSProperties;
}

@@ -18,0 +19,0 @@ declare type ColorFunction = () => string;

@@ -1,2 +0,2 @@

var t,e=require("react"),r=(t=e)&&"object"==typeof t&&"default"in t?t.default:t;function n(t){var e=t.width,r=t.height,n=Math.round(e/2),a=Math.round(r/2),o=(e+r)/2;return{stars:i(n,a,o,e,r,t.count),width:e,height:r,x:n,y:a,z:o}}function i(t,e,r,n,i,a){for(var o=[],s=0;s<a;s++)o.push({x:Math.random()*n*2-2*t,y:Math.random()*i*2-2*e,z:Math.round(Math.random()*r),stepX:0,stepY:0});return o}function a(t,r,i){var a=i.current||n({count:r.count,height:r.height,width:r.width});if(r.count!==a.stars.length)if(a.stars.length<r.count){var o=n({count:r.count-a.stars.length,height:r.height,width:r.width});a.stars=a.stars.concat(o.stars)}else a.stars.splice(0,a.stars.length-r.count);if(r.width!==a.width||r.height!==a.height){var s=n({count:r.count,height:r.height,width:r.width});a.stars=s.stars,a.width=r.width,a.height=r.height,a.x=Math.round(r.width/2),a.y=Math.round(r.height/2),a.z=(r.width+r.height)/2}e.useEffect(function(){var e,n=t.current.getContext("2d"),i=1/a.z,o=r.speed,s=r.starRatio,h=r.starSize;n.strokeStyle="string"==typeof r.starStyle&&r.starStyle,n.lineCap=r.starShape;var u,c,d=1e3/r.fps,l=Date.now();return e=requestAnimationFrame(function t(){if(e=requestAnimationFrame(t),"number"==typeof r.fps){if(u=Date.now(),(c=u-l)<d)return;l=u-c%d}!function(t){var e=t.context,r=t.stars,n=t.width,i=t.height,a=t.z,o=t.x,s=t.y,h=t.starLineWidthRatio,u=t.speed,c=t.starRatio,d=t.starSize,l=t.strokeStyle,f=t.bgStyle,g=t.noBackground;t.clear&&(e.clearRect(0,0,n,i),g||(e.fillStyle=f,e.fillRect(0,0,n,i)));for(var p=!1,w=0;w<r.length;w++){"function"==typeof l&&(e.strokeStyle=l());var S=r[w],y=S.stepX,v=S.stepY;p=!0,S.z-=u,S.z>a&&(S.z-=a,p=!1),S.z<0&&(S.z+=a,p=!1),S.stepX=o+S.x/S.z*c,S.stepY=s+S.y/S.z*c,(p=p&&y>0&&y<n&&v>0&&v<i)&&(e.beginPath(),e.lineWidth=(1-h*S.z)*d,e.moveTo(y,v),e.lineTo(S.stepX,S.stepY),e.stroke(),e.closePath())}}(Object.assign({},{context:n,speed:o,starRatio:s,starSize:h,starLineWidthRatio:i,strokeStyle:r.starStyle,bgStyle:r.bgStyle,noBackground:r.noBackground,clear:r.clear},a))}),function(){return cancelAnimationFrame(e)}},[r])}var o=function(t){var r=t.width,i=t.height,o=t.starStyle,s=t.bgStyle,h=t.count,u=t.fps,c=t.speed,d=t.starRatio,l=t.starShape,f=t.starSize,g=t.clear,p=t.noBackground,w=function(t,e){var r={};for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&-1===e.indexOf(n)&&(r[n]=t[n]);return r}(t,["width","height","starStyle","bgStyle","count","fps","speed","starRatio","starShape","starSize","clear","noBackground"]),S=e.useRef(null);return a(S,{width:r,height:i,starStyle:o,bgStyle:s,count:h,fps:u,speed:c,starRatio:d,starShape:l,starSize:f,clear:g,noBackground:p},e.useRef(n({count:h,height:i,width:r}))),e.createElement("canvas",Object.assign({ref:S},{width:r,height:i},w))};function s(){return{innerHeight:window.innerHeight,innerWidth:window.innerWidth,outerHeight:window.outerHeight,outerWidth:window.outerWidth}}function h(){var t=e.useState(s()),r=t[0],n=t[1];function i(){n(s())}return e.useEffect(function(){return window.addEventListener("resize",i),function(){window.removeEventListener("resize",i)}},[]),r}o.defaultProps={width:300,height:300,count:3e3,speed:3,starRatio:356,starSize:1.4,starStyle:"#fff",starShape:"round",clear:!0,bgStyle:"#000",noBackground:!1};var u={position:"fixed"};exports.StarField=o,exports.FullScreenStarField=function(t){var e=h();return r.createElement(o,Object.assign({},Object.assign({},t,{style:u,width:e.innerWidth,height:e.innerHeight})))},exports.useStarField=a,exports.useWindowSize=h,exports.randomColor=function(){return"#"+Array.apply(null,new Array(6)).map(function(){return"0123456789ABCDEF"[Math.floor(16*Math.random())]}).join("")};
var t,e=require("react"),r=(t=e)&&"object"==typeof t&&"default"in t?t.default:t;function n(t){var e=t.width,r=t.height,n=Math.round(e/2),a=Math.round(r/2),o=(e+r)/2;return{stars:i(n,a,o,e,r,t.count),width:e,height:r,x:n,y:a,z:o}}function i(t,e,r,n,i,a){for(var o=[],s=0;s<a;s++)o.push({x:Math.random()*n*2-2*t,y:Math.random()*i*2-2*e,z:Math.round(Math.random()*r),stepX:0,stepY:0});return o}function a(t,r,i){var a=i.current||n({count:r.count,height:r.height,width:r.width});if(r.count!==a.stars.length)if(a.stars.length<r.count){var o=n({count:r.count-a.stars.length,height:r.height,width:r.width});a.stars=a.stars.concat(o.stars)}else a.stars.splice(0,a.stars.length-r.count);if(r.width!==a.width||r.height!==a.height){var s=n({count:r.count,height:r.height,width:r.width});a.stars=s.stars,a.width=r.width,a.height=r.height,a.x=Math.round(r.width/2),a.y=Math.round(r.height/2),a.z=(r.width+r.height)/2}e.useEffect(function(){var e,n=t.current.getContext("2d"),i=1/a.z,o=r.speed,s=r.starRatio,h=r.starSize;n.strokeStyle="string"==typeof r.starStyle&&r.starStyle,n.lineCap=r.starShape;var u,c,d=1e3/r.fps,l=Date.now();return e=requestAnimationFrame(function t(){if(e=requestAnimationFrame(t),"number"==typeof r.fps){if(u=Date.now(),(c=u-l)<d)return;l=u-c%d}!function(t){var e=t.context,r=t.stars,n=t.width,i=t.height,a=t.z,o=t.x,s=t.y,h=t.starLineWidthRatio,u=t.speed,c=t.starRatio,d=t.starSize,l=t.strokeStyle,g=t.bgStyle,f=t.noBackground;t.clear&&(e.clearRect(0,0,n,i),f||(e.fillStyle=g,e.fillRect(0,0,n,i)));for(var p=!1,w=0;w<r.length;w++){"function"==typeof l&&(e.strokeStyle=l());var S=r[w],y=S.stepX,z=S.stepY;p=!0,S.z-=u,S.z>a&&(S.z-=a,p=!1),S.z<0&&(S.z+=a,p=!1),S.stepX=o+S.x/S.z*c,S.stepY=s+S.y/S.z*c,(p=p&&y>0&&y<n&&z>0&&z<i)&&(e.beginPath(),e.lineWidth=(1-h*S.z)*d,e.moveTo(y,z),e.lineTo(S.stepX,S.stepY),e.stroke(),e.closePath())}}(Object.assign({},{context:n,speed:o,starRatio:s,starSize:h,starLineWidthRatio:i,strokeStyle:r.starStyle,bgStyle:r.bgStyle,noBackground:r.noBackground,clear:r.clear},a))}),function(){return cancelAnimationFrame(e)}},[r])}var o=function(t){var r=t.width,i=t.height,o=t.starStyle,s=t.bgStyle,h=t.count,u=t.fps,c=t.speed,d=t.starRatio,l=t.starShape,g=t.starSize,f=t.clear,p=t.noBackground,w=function(t,e){var r={};for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&-1===e.indexOf(n)&&(r[n]=t[n]);return r}(t,["width","height","starStyle","bgStyle","count","fps","speed","starRatio","starShape","starSize","clear","noBackground"]),S=e.useRef(null);return a(S,{width:r,height:i,starStyle:o,bgStyle:s,count:h,fps:u,speed:c,starRatio:d,starShape:l,starSize:g,clear:f,noBackground:p},e.useRef(n({count:h,height:i,width:r}))),e.createElement("canvas",Object.assign({ref:S},{width:r,height:i},w))};function s(){return{innerHeight:window.innerHeight,innerWidth:window.innerWidth,outerHeight:window.outerHeight,outerWidth:window.outerWidth}}function h(){var t=e.useState(s()),r=t[0],n=t[1];function i(){n(s())}return e.useEffect(function(){return window.addEventListener("resize",i),function(){window.removeEventListener("resize",i)}},[]),r}o.defaultProps={width:300,height:300,count:3e3,speed:3,starRatio:356,starSize:1.4,starStyle:"#fff",starShape:"round",clear:!0,bgStyle:"#000",noBackground:!1};var u={position:"fixed",zIndex:-1};exports.StarField=o,exports.FullScreenStarField=function(t){var e=h(),n=e.innerWidth,i=e.innerHeight;return r.createElement(o,Object.assign({},Object.assign({},t,{style:Object.assign({},u,t.style||{}),width:n,height:i})))},exports.useStarField=a,exports.useWindowSize=h,exports.randomColor=function(){return"#"+Array.apply(null,new Array(6)).map(function(){return"0123456789ABCDEF"[Math.floor(16*Math.random())]}).join("")};
//# sourceMappingURL=starfield-react.js.map

@@ -1,2 +0,2 @@

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e(t.starfieldReact={},t.react)}(this,function(t,e){var r="default"in e?e.default:e;function n(t){var e=t.width,r=t.height,n=Math.round(e/2),a=Math.round(r/2),o=(e+r)/2;return{stars:i(n,a,o,e,r,t.count),width:e,height:r,x:n,y:a,z:o}}function i(t,e,r,n,i,a){for(var o=[],s=0;s<a;s++)o.push({x:Math.random()*n*2-2*t,y:Math.random()*i*2-2*e,z:Math.round(Math.random()*r),stepX:0,stepY:0});return o}function a(t,r,i){var a=i.current||n({count:r.count,height:r.height,width:r.width});if(r.count!==a.stars.length)if(a.stars.length<r.count){var o=n({count:r.count-a.stars.length,height:r.height,width:r.width});a.stars=a.stars.concat(o.stars)}else a.stars.splice(0,a.stars.length-r.count);if(r.width!==a.width||r.height!==a.height){var s=n({count:r.count,height:r.height,width:r.width});a.stars=s.stars,a.width=r.width,a.height=r.height,a.x=Math.round(r.width/2),a.y=Math.round(r.height/2),a.z=(r.width+r.height)/2}e.useEffect(function(){var e,n=t.current.getContext("2d"),i=1/a.z,o=r.speed,s=r.starRatio,h=r.starSize;n.strokeStyle="string"==typeof r.starStyle&&r.starStyle,n.lineCap=r.starShape;var u,d,c=1e3/r.fps,l=Date.now();return e=requestAnimationFrame(function t(){if(e=requestAnimationFrame(t),"number"==typeof r.fps){if(u=Date.now(),(d=u-l)<c)return;l=u-d%c}!function(t){var e=t.context,r=t.stars,n=t.width,i=t.height,a=t.z,o=t.x,s=t.y,h=t.starLineWidthRatio,u=t.speed,d=t.starRatio,c=t.starSize,l=t.strokeStyle,f=t.bgStyle,g=t.noBackground;t.clear&&(e.clearRect(0,0,n,i),g||(e.fillStyle=f,e.fillRect(0,0,n,i)));for(var p=!1,w=0;w<r.length;w++){"function"==typeof l&&(e.strokeStyle=l());var S=r[w],y=S.stepX,v=S.stepY;p=!0,S.z-=u,S.z>a&&(S.z-=a,p=!1),S.z<0&&(S.z+=a,p=!1),S.stepX=o+S.x/S.z*d,S.stepY=s+S.y/S.z*d,(p=p&&y>0&&y<n&&v>0&&v<i)&&(e.beginPath(),e.lineWidth=(1-h*S.z)*c,e.moveTo(y,v),e.lineTo(S.stepX,S.stepY),e.stroke(),e.closePath())}}(Object.assign({},{context:n,speed:o,starRatio:s,starSize:h,starLineWidthRatio:i,strokeStyle:r.starStyle,bgStyle:r.bgStyle,noBackground:r.noBackground,clear:r.clear},a))}),function(){return cancelAnimationFrame(e)}},[r])}var o=function(t){var r=t.width,i=t.height,o=t.starStyle,s=t.bgStyle,h=t.count,u=t.fps,d=t.speed,c=t.starRatio,l=t.starShape,f=t.starSize,g=t.clear,p=t.noBackground,w=function(t,e){var r={};for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&-1===e.indexOf(n)&&(r[n]=t[n]);return r}(t,["width","height","starStyle","bgStyle","count","fps","speed","starRatio","starShape","starSize","clear","noBackground"]),S=e.useRef(null);return a(S,{width:r,height:i,starStyle:o,bgStyle:s,count:h,fps:u,speed:d,starRatio:c,starShape:l,starSize:f,clear:g,noBackground:p},e.useRef(n({count:h,height:i,width:r}))),e.createElement("canvas",Object.assign({ref:S},{width:r,height:i},w))};function s(){return{innerHeight:window.innerHeight,innerWidth:window.innerWidth,outerHeight:window.outerHeight,outerWidth:window.outerWidth}}function h(){var t=e.useState(s()),r=t[0],n=t[1];function i(){n(s())}return e.useEffect(function(){return window.addEventListener("resize",i),function(){window.removeEventListener("resize",i)}},[]),r}o.defaultProps={width:300,height:300,count:3e3,speed:3,starRatio:356,starSize:1.4,starStyle:"#fff",starShape:"round",clear:!0,bgStyle:"#000",noBackground:!1};var u={position:"fixed"};t.StarField=o,t.FullScreenStarField=function(t){var e=h();return r.createElement(o,Object.assign({},Object.assign({},t,{style:u,width:e.innerWidth,height:e.innerHeight})))},t.useStarField=a,t.useWindowSize=h,t.randomColor=function(){return"#"+Array.apply(null,new Array(6)).map(function(){return"0123456789ABCDEF"[Math.floor(16*Math.random())]}).join("")}});
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e(t.starfieldReact={},t.react)}(this,function(t,e){var n="default"in e?e.default:e;function r(t){var e=t.width,n=t.height,r=Math.round(e/2),a=Math.round(n/2),o=(e+n)/2;return{stars:i(r,a,o,e,n,t.count),width:e,height:n,x:r,y:a,z:o}}function i(t,e,n,r,i,a){for(var o=[],s=0;s<a;s++)o.push({x:Math.random()*r*2-2*t,y:Math.random()*i*2-2*e,z:Math.round(Math.random()*n),stepX:0,stepY:0});return o}function a(t,n,i){var a=i.current||r({count:n.count,height:n.height,width:n.width});if(n.count!==a.stars.length)if(a.stars.length<n.count){var o=r({count:n.count-a.stars.length,height:n.height,width:n.width});a.stars=a.stars.concat(o.stars)}else a.stars.splice(0,a.stars.length-n.count);if(n.width!==a.width||n.height!==a.height){var s=r({count:n.count,height:n.height,width:n.width});a.stars=s.stars,a.width=n.width,a.height=n.height,a.x=Math.round(n.width/2),a.y=Math.round(n.height/2),a.z=(n.width+n.height)/2}e.useEffect(function(){var e,r=t.current.getContext("2d"),i=1/a.z,o=n.speed,s=n.starRatio,h=n.starSize;r.strokeStyle="string"==typeof n.starStyle&&n.starStyle,r.lineCap=n.starShape;var u,d,c=1e3/n.fps,l=Date.now();return e=requestAnimationFrame(function t(){if(e=requestAnimationFrame(t),"number"==typeof n.fps){if(u=Date.now(),(d=u-l)<c)return;l=u-d%c}!function(t){var e=t.context,n=t.stars,r=t.width,i=t.height,a=t.z,o=t.x,s=t.y,h=t.starLineWidthRatio,u=t.speed,d=t.starRatio,c=t.starSize,l=t.strokeStyle,f=t.bgStyle,g=t.noBackground;t.clear&&(e.clearRect(0,0,r,i),g||(e.fillStyle=f,e.fillRect(0,0,r,i)));for(var p=!1,w=0;w<n.length;w++){"function"==typeof l&&(e.strokeStyle=l());var y=n[w],S=y.stepX,z=y.stepY;p=!0,y.z-=u,y.z>a&&(y.z-=a,p=!1),y.z<0&&(y.z+=a,p=!1),y.stepX=o+y.x/y.z*d,y.stepY=s+y.y/y.z*d,(p=p&&S>0&&S<r&&z>0&&z<i)&&(e.beginPath(),e.lineWidth=(1-h*y.z)*c,e.moveTo(S,z),e.lineTo(y.stepX,y.stepY),e.stroke(),e.closePath())}}(Object.assign({},{context:r,speed:o,starRatio:s,starSize:h,starLineWidthRatio:i,strokeStyle:n.starStyle,bgStyle:n.bgStyle,noBackground:n.noBackground,clear:n.clear},a))}),function(){return cancelAnimationFrame(e)}},[n])}var o=function(t){var n=t.width,i=t.height,o=t.starStyle,s=t.bgStyle,h=t.count,u=t.fps,d=t.speed,c=t.starRatio,l=t.starShape,f=t.starSize,g=t.clear,p=t.noBackground,w=function(t,e){var n={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&-1===e.indexOf(r)&&(n[r]=t[r]);return n}(t,["width","height","starStyle","bgStyle","count","fps","speed","starRatio","starShape","starSize","clear","noBackground"]),y=e.useRef(null);return a(y,{width:n,height:i,starStyle:o,bgStyle:s,count:h,fps:u,speed:d,starRatio:c,starShape:l,starSize:f,clear:g,noBackground:p},e.useRef(r({count:h,height:i,width:n}))),e.createElement("canvas",Object.assign({ref:y},{width:n,height:i},w))};function s(){return{innerHeight:window.innerHeight,innerWidth:window.innerWidth,outerHeight:window.outerHeight,outerWidth:window.outerWidth}}function h(){var t=e.useState(s()),n=t[0],r=t[1];function i(){r(s())}return e.useEffect(function(){return window.addEventListener("resize",i),function(){window.removeEventListener("resize",i)}},[]),n}o.defaultProps={width:300,height:300,count:3e3,speed:3,starRatio:356,starSize:1.4,starStyle:"#fff",starShape:"round",clear:!0,bgStyle:"#000",noBackground:!1};var u={position:"fixed",zIndex:-1};t.StarField=o,t.FullScreenStarField=function(t){var e=h(),r=e.innerWidth,i=e.innerHeight;return n.createElement(o,Object.assign({},Object.assign({},t,{style:Object.assign({},u,t.style||{}),width:r,height:i})))},t.useStarField=a,t.useWindowSize=h,t.randomColor=function(){return"#"+Array.apply(null,new Array(6)).map(function(){return"0123456789ABCDEF"[Math.floor(16*Math.random())]}).join("")}});
//# sourceMappingURL=starfield-react.umd.js.map
{
"name": "starfield-react",
"version": "3.1.0-dev-0",
"version": "3.1.0-dev-1",
"description": "A React component that draws a Starfield on a canvas dom element.",

@@ -5,0 +5,0 @@ "author": "Christopher Decoster",

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc