atomic-spinner - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

dist/index.js

@@ -1,48 +0,53 @@
-import * as React from 'react';
-var defaultColors = ['red', 'green', 'blue'];
-var unusedColors = [];
-var getRandomElectronPathOrbitTime = function () { return 2 + Math.random() * 1; };
-var getNextRandomColor = function () {
+"use strict";
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const defaultColors = ['red', 'green', 'blue'];
+let unusedColors = [];
+const getRandomElectronPathOrbitTime = () => 2 + Math.random() * 1;
+const getNextRandomColor = () => {
     if (!unusedColors.length) {
-        unusedColors = defaultColors.slice();
+        unusedColors = [...defaultColors];
     }
     return unusedColors.splice(Math.floor(Math.random() * (unusedColors.length)), 1)[0];
 };
-export function Nucleus(_a) {
-    var particleFillColor = _a.particleFillColor, particleBorderColor = _a.particleBorderColor, particleCount = _a.particleCount, particleSize = _a.particleSize, distanceFromCenter = _a.distanceFromCenter;
-    var startingAngle = Math.random() * 2 * Math.PI;
-    var particles = Array.from({ length: particleCount })
-        .map(function (_, i) {
-        var angle = startingAngle + i * ((2 * Math.PI) / particleCount);
-        var offsetX = distanceFromCenter * Math.cos(angle);
-        var offsetY = distanceFromCenter * Math.sin(angle);
+function Nucleus({ particleFillColor, particleBorderColor, particleCount, particleSize, distanceFromCenter }) {
+    const startingAngle = Math.random() * 2 * Math.PI;
+    const particles = Array.from({ length: particleCount })
+        .map((_, i) => {
+        const angle = startingAngle + i * ((2 * Math.PI) / particleCount);
+        const offsetX = distanceFromCenter * Math.cos(angle);
+        const offsetY = distanceFromCenter * Math.sin(angle);
         return (React.createElement("g", { key: i },
             React.createElement("circle", { cx: 50 + offsetX, cy: 50 + offsetY, r: particleSize, fill: particleFillColor, stroke: particleBorderColor, strokeWidth: 0.3 })));
     });
-    particles.sort(function (_a) {
-        var key = _a.key;
-        return (Number(key) % (particleCount / 3) ? 1 : -1);
-    });
+    particles.sort(({ key }) => (Number(key) % (particleCount / 3) ? 1 : -1));
     return React.createElement(React.Fragment, null, particles);
 }
-export function ElectronPath(_a) {
-    var color = _a.color, width = _a.width, rotationAngle = _a.rotationAngle;
-    return (React.createElement("g", { transform: "rotate(" + rotationAngle + " 50 50)" },
+exports.Nucleus = Nucleus;
+function ElectronPath({ color, width, rotationAngle }) {
+    return (React.createElement("g", { transform: `rotate(${rotationAngle} 50 50)` },
         React.createElement("use", { xlinkHref: "#electronPath", stroke: color, strokeWidth: width })));
 }
-export function Electron(_a) {
-    var rotationAngle = _a.rotationAngle, orbitTime = _a.orbitTime, spacetimeOffset = _a.spacetimeOffset, size = _a.size;
-    return (React.createElement("g", { transform: "rotate(" + rotationAngle + " 50 50)" },
+exports.ElectronPath = ElectronPath;
+function Electron({ rotationAngle, orbitTime, spacetimeOffset, size }) {
+    return (React.createElement("g", { transform: `rotate(${rotationAngle} 50 50)` },
         React.createElement("circle", { cx: "50", cy: "15", r: size, fill: getNextRandomColor() },
-            React.createElement("animateMotion", { dur: orbitTime + "s", repeatCount: "indefinite", begin: spacetimeOffset + "s" },
+            React.createElement("animateMotion", { dur: `${orbitTime}s`, repeatCount: "indefinite", begin: `${spacetimeOffset}s` },
                 React.createElement("mpath", { xlinkHref: "#electron" })))));
 }
-function LoadingAtom(_a) {
-    var _b = _a.atomSize, atomSize = _b === void 0 ? 200 : _b, _c = _a.displayElectronPaths, displayElectronPaths = _c === void 0 ? true : _c, _d = _a.displayNucleus, displayNucleus = _d === void 0 ? true : _d, _e = _a.electronPathCount, electronPathCount = _e === void 0 ? 3 : _e, _f = _a.electronPathColor, electronPathColor = _f === void 0 ? '#707070' : _f, _g = _a.electronPathWidth, electronPathWidth = _g === void 0 ? 0.5 : _g, _h = _a.electronsPerPath, electronsPerPath = _h === void 0 ? 2 : _h, _j = _a.electronSize, electronSize = _j === void 0 ? 1.5 : _j, _k = _a.nucleusParticleFillColor, nucleusParticleFillColor = _k === void 0 ? '#707070' : _k, _l = _a.nucleusParticleBorderColor, nucleusParticleBorderColor = _l === void 0 ? '#999' : _l, _m = _a.nucleusParticleCount, nucleusParticleCount = _m === void 0 ? 6 : _m, _o = _a.nucleusParticleSize, nucleusParticleSize = _o === void 0 ? 2.5 : _o, _p = _a.nucleusDistanceFromCenter, nucleusDistanceFromCenter = _p === void 0 ? 2.5 : _p;
-    var electronPaths = Array.from({ length: electronPathCount })
-        .map(function (_, i) { return ({
+exports.Electron = Electron;
+function AtomicSpinner({ atomSize = 200, displayElectronPaths = true, displayNucleus = true, 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 })
+        .map((_, i) => ({
         rotationAngle: 0 + i * (180 / electronPathCount),
         electronCount: electronsPerPath,
         electronOrbitTime: getRandomElectronPathOrbitTime()
-    }); });
+    }));
     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" },
@@ -55,13 +60,6 @@ React.createElement("defs", null,
         displayElectronPaths
-            && electronPaths.map(function (_a) {
-                var rotationAngle = _a.rotationAngle;
-                return (React.createElement(ElectronPath, { key: "electron-path-" + rotationAngle, color: electronPathColor, width: electronPathWidth, rotationAngle: rotationAngle }));
-            }),
-        electronPaths.map(function (_a) {
-            var electronCount = _a.electronCount, rotationAngle = _a.rotationAngle, electronOrbitTime = _a.electronOrbitTime;
-            return Array.from({ length: electronCount })
-                .map(function (_, i) { return (React.createElement(Electron, { key: "electron-" + i, rotationAngle: rotationAngle, orbitTime: electronOrbitTime, size: electronSize, spacetimeOffset: -electronOrbitTime + i * (electronOrbitTime / (electronCount)) })); });
-        })));
+            && 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: -electronOrbitTime + i * (electronOrbitTime / (electronCount)) }))))));
 }
-export default React.memo(LoadingAtom);
-//# sourceMappingURL=index.js.map
+exports.default = React.memo(AtomicSpinner);

package.json

 {
   "name": "atomic-spinner",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Loading spinner that looks like an atom",
@@ -31,15 +31,14 @@ "author": "David Lounsbrough",
   "peerDependencies": {
-    "react": "^16.8.0",
-    "react-dom": "^16.8.0"
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
   },
   "devDependencies": {
-    "@types/react": "^16.3.13",
-    "@types/react-dom": "^16.0.5",
+    "@types/react": "^18.0.26",
+    "@types/react-dom": "^18.0.10",
     "babel-core": "^6.26.3",
     "babel-runtime": "^6.26.0",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
-    "tslib": "^2.4.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "typescript": "^2.9.2"
   }
 }

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

Improved metrics

Dev dependency count

7

decreased by-12.5%

Worsened metrics

Total package byte prevSize

6678

decreased by-48.82%

Number of package files

4

decreased by-33.33%

Lines of code

65

decreased by-40.37%

No dependency changes