atomic-spinner - npm Package Compare versions

Comparing version 1.0.9 to 1.0.10

dist/index.d.ts

@@ -10,9 +10,9 @@ import * as React from 'react';
 export declare function Nucleus({ particleFillColor, particleBorderColor, particleCount, particleSize, distanceFromCenter }: NucleusProps): JSX.Element;
-export interface ElectronPathProps {
+export declare type ElectronPathProps = {
     color: string;
     width: number;
     rotationAngle: number;
-}
-export declare function ElectronPath({ color, width, rotationAngle }: ElectronPathProps): JSX.Element;
-export interface ElectronProps {
+};
+export declare const ElectronPath: ({ color, width, rotationAngle }: ElectronPathProps) => JSX.Element;
+export declare type ElectronProps = {
     rotationAngle: number;
@@ -23,5 +23,5 @@ orbitTime: number;
     colorPalette: string[];
-}
-export declare function Electron({ rotationAngle, orbitTime, spacetimeOffset, size, colorPalette }: ElectronProps): JSX.Element;
-export interface AtomicSpinnerProps {
+};
+export declare const Electron: ({ rotationAngle, orbitTime, spacetimeOffset, size, colorPalette }: ElectronProps) => JSX.Element;
+export declare type AtomicSpinnerProps = {
     atomSize?: number;
@@ -41,5 +41,4 @@ displayElectronPaths?: boolean;
     nucleusDistanceFromCenter?: number;
-}
-declare function AtomicSpinner({ atomSize, displayElectronPaths, displayNucleus, electronColorPalette, electronPathCount, electronPathColor, electronPathWidth, electronsPerPath, electronSize, nucleusParticleFillColor, nucleusParticleBorderColor, nucleusParticleCount, nucleusParticleSize, nucleusDistanceFromCenter }: AtomicSpinnerProps): JSX.Element;
-declare const _default: React.MemoExoticComponent<typeof AtomicSpinner>;
+};
+declare const _default: React.MemoExoticComponent<({ atomSize, displayElectronPaths, displayNucleus, electronColorPalette, electronPathCount, electronPathColor, electronPathWidth, electronsPerPath, electronSize, nucleusParticleFillColor, nucleusParticleBorderColor, nucleusParticleCount, nucleusParticleSize, nucleusDistanceFromCenter }: AtomicSpinnerProps) => JSX.Element>;
 export default _default;

dist/index.js

@@ -25,8 +25,7 @@ "use strict";
 exports.Nucleus = Nucleus;
-function ElectronPath({ color, width, rotationAngle }) {
+exports.ElectronPath = ({ color, width, rotationAngle }) => {
     return (React.createElement("g", { transform: `rotate(${rotationAngle} 50 50)` },
         React.createElement("use", { xlinkHref: "#electronPath", stroke: color, strokeWidth: width })));
-}
-exports.ElectronPath = ElectronPath;
-function Electron({ rotationAngle, orbitTime, spacetimeOffset, size, colorPalette }) {
+};
+exports.Electron = ({ rotationAngle, orbitTime, spacetimeOffset, size, colorPalette }) => {
     let unusedColors = [];
@@ -43,5 +42,4 @@ const getRandomElectronColor = () => {
                 React.createElement("mpath", { xlinkHref: "#electron" })))));
-}
-exports.Electron = Electron;
-function AtomicSpinner({ atomSize = 200, displayElectronPaths = true, displayNucleus = true, electronColorPalette = ['#0081C9', '#5BC0F8', '#86E5FF'], electronPathCount = 3, electronPathColor = '#707070', electronPathWidth = 0.5, electronsPerPath = 2, electronSize = 1.5, nucleusParticleFillColor = '#707070', nucleusParticleBorderColor = '#999', nucleusParticleCount = 6, nucleusParticleSize = 2.5, nucleusDistanceFromCenter = 2.5 }) {
+};
+const AtomicSpinner = ({ atomSize = 200, displayElectronPaths = true, displayNucleus = true, electronColorPalette = ['#0081C9', '#5BC0F8', '#86E5FF'], electronPathCount = 3, electronPathColor = '#707070', electronPathWidth = 0.5, electronsPerPath = 2, electronSize = 1.5, nucleusParticleFillColor = '#707070', nucleusParticleBorderColor = '#999', nucleusParticleCount = 6, nucleusParticleSize = 2.5, nucleusDistanceFromCenter = 2.5 }) => {
     const electronPaths = Array.from({ length: electronPathCount })
@@ -60,6 +58,6 @@ .map((_, i) => ({
         displayElectronPaths
-            && electronPaths.map(({ rotationAngle }) => (React.createElement(ElectronPath, { key: `electron-path-${rotationAngle}`, color: electronPathColor, width: electronPathWidth, rotationAngle: rotationAngle }))),
+            && electronPaths.map(({ rotationAngle }) => (React.createElement(exports.ElectronPath, { key: `electron-path-${rotationAngle}`, color: electronPathColor, width: electronPathWidth, rotationAngle: rotationAngle }))),
         electronPaths.map(({ electronCount, rotationAngle, electronOrbitTime }) => Array.from({ length: electronCount })
-            .map((_, i) => (React.createElement(Electron, { key: `electron-${i}`, rotationAngle: rotationAngle, orbitTime: electronOrbitTime, size: electronSize, spacetimeOffset: -electronOrbitTime + i * (electronOrbitTime / (electronCount)), colorPalette: electronColorPalette }))))));
-}
+            .map((_, i) => (React.createElement(exports.Electron, { key: `electron-${i}`, rotationAngle: rotationAngle, orbitTime: electronOrbitTime, size: electronSize, spacetimeOffset: -electronOrbitTime + i * (electronOrbitTime / (electronCount)), colorPalette: electronColorPalette }))))));
+};
 exports.default = React.memo(AtomicSpinner);

dist/index.min.js

@@ -1,1 +0,1 @@
-"use strict";var __importStar=this&&this.__importStar||function(mod){if(mod&&mod.__esModule)return mod;var result={};if(null!=mod)for(var k in mod)Object.hasOwnProperty.call(mod,k)&&(result[k]=mod[k]);return result.default=mod,result};Object.defineProperty(exports,"__esModule",{value:!0});const React=__importStar(require("react"));function Nucleus({particleFillColor,particleBorderColor,particleCount,particleSize,distanceFromCenter}){const startingAngle=2*Math.random()*Math.PI;var particles=Array.from({length:particleCount}).map((_,i)=>{var angle=startingAngle+i*(2*Math.PI/particleCount),offsetX=distanceFromCenter*Math.cos(angle),angle=distanceFromCenter*Math.sin(angle);return React.createElement("g",{key:i},React.createElement("circle",{cx:50+offsetX,cy:50+angle,r:particleSize,fill:particleFillColor,stroke:particleBorderColor,strokeWidth:.3}))});return particles.sort(({key})=>Number(key)%(particleCount/3)?1:-1),React.createElement(React.Fragment,null,particles)}function ElectronPath({color,width,rotationAngle}){return React.createElement("g",{transform:`rotate(${rotationAngle} 50 50)`},React.createElement("use",{xlinkHref:"#electronPath",stroke:color,strokeWidth:width}))}function Electron({rotationAngle,orbitTime,spacetimeOffset,size,colorPalette}){let unusedColors=[];return React.createElement("g",{transform:`rotate(${rotationAngle} 50 50)`},React.createElement("circle",{cx:"50",cy:"15",r:size,fill:(unusedColors=unusedColors.length?unusedColors:[...colorPalette]).splice(Math.floor(Math.random()*unusedColors.length),1)[0]},React.createElement("animateMotion",{dur:orbitTime+"s",repeatCount:"indefinite",begin:spacetimeOffset+"s"},React.createElement("mpath",{xlinkHref:"#electron"}))))}function AtomicSpinner({atomSize=200,displayElectronPaths=!0,displayNucleus=!0,electronColorPalette=["#0081C9","#5BC0F8","#86E5FF"],electronPathCount=3,electronPathColor="#707070",electronPathWidth=.5,electronsPerPath=2,electronSize=1.5,nucleusParticleFillColor="#707070",nucleusParticleBorderColor="#999",nucleusParticleCount=6,nucleusParticleSize=2.5,nucleusDistanceFromCenter=2.5}){var electronPaths=Array.from({length:electronPathCount}).map((_,i)=>({rotationAngle:0+i*(180/electronPathCount),electronCount:electronsPerPath,electronOrbitTime:+Math.random()+2}));return React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",width:atomSize,height:atomSize,viewBox:"0 0 100 100",preserveAspectRatio:"xMidYMid"},React.createElement("defs",null,React.createElement("path",{id:"electronPath",d:"M50 15A15 35 0 0 1 50 85A15 35 0 0 1 50 15",fill:"none"}),React.createElement("path",{id:"electron",d:"M0 0A15 35 0 0 1 0 70A15 35 0 0 1 0 0",fill:"none"})),displayNucleus&&React.createElement(Nucleus,{particleCount:nucleusParticleCount,particleSize:nucleusParticleSize,distanceFromCenter:nucleusDistanceFromCenter,particleFillColor:nucleusParticleFillColor,particleBorderColor:nucleusParticleBorderColor}),displayElectronPaths&&electronPaths.map(({rotationAngle})=>React.createElement(ElectronPath,{key:"electron-path-"+rotationAngle,color:electronPathColor,width:electronPathWidth,rotationAngle:rotationAngle})),electronPaths.map(({electronCount,rotationAngle,electronOrbitTime})=>Array.from({length:electronCount}).map((_,i)=>React.createElement(Electron,{key:"electron-"+i,rotationAngle:rotationAngle,orbitTime:electronOrbitTime,size:electronSize,spacetimeOffset:i*(electronOrbitTime/electronCount)-electronOrbitTime,colorPalette:electronColorPalette}))))}exports.Nucleus=Nucleus,exports.ElectronPath=ElectronPath,exports.Electron=Electron,exports.default=React.memo(AtomicSpinner);
+"use strict";var __importStar=this&&this.__importStar||function(mod){if(mod&&mod.__esModule)return mod;var result={};if(null!=mod)for(var k in mod)Object.hasOwnProperty.call(mod,k)&&(result[k]=mod[k]);return result.default=mod,result};Object.defineProperty(exports,"__esModule",{value:!0});const React=__importStar(require("react"));function Nucleus({particleFillColor,particleBorderColor,particleCount,particleSize,distanceFromCenter}){const startingAngle=2*Math.random()*Math.PI;var particles=Array.from({length:particleCount}).map((_,i)=>{var angle=startingAngle+i*(2*Math.PI/particleCount),offsetX=distanceFromCenter*Math.cos(angle),angle=distanceFromCenter*Math.sin(angle);return React.createElement("g",{key:i},React.createElement("circle",{cx:50+offsetX,cy:50+angle,r:particleSize,fill:particleFillColor,stroke:particleBorderColor,strokeWidth:.3}))});return particles.sort(({key})=>Number(key)%(particleCount/3)?1:-1),React.createElement(React.Fragment,null,particles)}exports.Nucleus=Nucleus,exports.ElectronPath=({color,width,rotationAngle})=>React.createElement("g",{transform:`rotate(${rotationAngle} 50 50)`},React.createElement("use",{xlinkHref:"#electronPath",stroke:color,strokeWidth:width})),exports.Electron=({rotationAngle,orbitTime,spacetimeOffset,size,colorPalette})=>{let unusedColors=[];return React.createElement("g",{transform:`rotate(${rotationAngle} 50 50)`},React.createElement("circle",{cx:"50",cy:"15",r:size,fill:(unusedColors=unusedColors.length?unusedColors:[...colorPalette]).splice(Math.floor(Math.random()*unusedColors.length),1)[0]},React.createElement("animateMotion",{dur:orbitTime+"s",repeatCount:"indefinite",begin:spacetimeOffset+"s"},React.createElement("mpath",{xlinkHref:"#electron"}))))};const AtomicSpinner=({atomSize=200,displayElectronPaths=!0,displayNucleus=!0,electronColorPalette=["#0081C9","#5BC0F8","#86E5FF"],electronPathCount=3,electronPathColor="#707070",electronPathWidth=.5,electronsPerPath=2,electronSize=1.5,nucleusParticleFillColor="#707070",nucleusParticleBorderColor="#999",nucleusParticleCount=6,nucleusParticleSize=2.5,nucleusDistanceFromCenter=2.5})=>{var electronPaths=Array.from({length:electronPathCount}).map((_,i)=>({rotationAngle:0+i*(180/electronPathCount),electronCount:electronsPerPath,electronOrbitTime:+Math.random()+2}));return React.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",width:atomSize,height:atomSize,viewBox:"0 0 100 100",preserveAspectRatio:"xMidYMid"},React.createElement("defs",null,React.createElement("path",{id:"electronPath",d:"M50 15A15 35 0 0 1 50 85A15 35 0 0 1 50 15",fill:"none"}),React.createElement("path",{id:"electron",d:"M0 0A15 35 0 0 1 0 70A15 35 0 0 1 0 0",fill:"none"})),displayNucleus&&React.createElement(Nucleus,{particleCount:nucleusParticleCount,particleSize:nucleusParticleSize,distanceFromCenter:nucleusDistanceFromCenter,particleFillColor:nucleusParticleFillColor,particleBorderColor:nucleusParticleBorderColor}),displayElectronPaths&&electronPaths.map(({rotationAngle})=>React.createElement(exports.ElectronPath,{key:"electron-path-"+rotationAngle,color:electronPathColor,width:electronPathWidth,rotationAngle:rotationAngle})),electronPaths.map(({electronCount,rotationAngle,electronOrbitTime})=>Array.from({length:electronCount}).map((_,i)=>React.createElement(exports.Electron,{key:"electron-"+i,rotationAngle:rotationAngle,orbitTime:electronOrbitTime,size:electronSize,spacetimeOffset:i*(electronOrbitTime/electronCount)-electronOrbitTime,colorPalette:electronColorPalette}))))};exports.default=React.memo(AtomicSpinner);

package.json

 {
   "name": "atomic-spinner",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "Loading spinner that looks like an atom",
@@ -16,2 +16,3 @@ "author": "David Lounsbrough",
     "minify": "uglifyjs --compress -o dist/index.min.js -- dist/index.js",
+    "publish-npm": "pnpm build && npm publish",
     "build-demo": "pnpm --prefix demo build",
@@ -18,0 +19,0 @@ "deploy-demo": "gh-pages -d demo/build"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

13392

decreased by-0.45%

Lines of code

104

decreased by-1.89%

No dependency changes