react-canvas-confetti - npm Package Compare versions

Comparing version 2.0.6 to 2.0.7

dist/conductor/photons/index.d.ts

+import Conductor from "../index";
+declare class PhotonsConductor extends Conductor {
+    private tickCount;
+    private get params();
+    tickAnimation: () => void;
+}
+export default PhotonsConductor;

dist/conductor/photons/index.js

+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var index_1 = __importDefault(require("../index"));
+var randomInRange_1 = __importDefault(require("../../helpers/randomInRange"));
+var colors = [
+    "#f94144",
+    "f3722c",
+    "f8961e",
+    "f9c74f",
+    "90be6d",
+    "43aa8b",
+    "577590",
+];
+var config = [
+    {
+        origin: function () { return ({ x: (0, randomInRange_1.default)(0, 1), y: -0.1 }); },
+        angle: function () { return (0, randomInRange_1.default)(0, -180); },
+    },
+    {
+        origin: function () { return ({ x: (0, randomInRange_1.default)(0, 1), y: 1.1 }); },
+        angle: function () { return (0, randomInRange_1.default)(0, 180); },
+    },
+    {
+        origin: function () { return ({ x: -0.1, y: (0, randomInRange_1.default)(0, 1) }); },
+        angle: function () { return (0, randomInRange_1.default)(-90, 90); },
+    },
+    {
+        origin: function () { return ({ x: 1.1, y: (0, randomInRange_1.default)(0, 1) }); },
+        angle: function () { return (0, randomInRange_1.default)(90, 270); },
+    },
+];
+var PhotonsConductor = (function (_super) {
+    __extends(PhotonsConductor, _super);
+    function PhotonsConductor() {
+        var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
+        _this.tickCount = 0;
+        _this.tickAnimation = function () {
+            var colorIndex = Number((0, randomInRange_1.default)(0, colors.length - 1).toFixed());
+            var _a = _this.params, angle = _a.angle, origin = _a.origin;
+            _this.confetti(_this.decorateOptions({
+                particleCount: 1,
+                angle: angle(),
+                spread: 0,
+                gravity: 0,
+                ticks: 600,
+                decay: 1,
+                startVelocity: 7,
+                flat: true,
+                origin: origin(),
+                shapes: ["circle"],
+                scalar: (0, randomInRange_1.default)(0.2, 6),
+                colors: [colors[colorIndex]],
+            }));
+        };
+        return _this;
+    }
+    Object.defineProperty(PhotonsConductor.prototype, "params", {
+        get: function () {
+            return config[this.tickCount++ % config.length];
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return PhotonsConductor;
+}(index_1.default));
+exports.default = PhotonsConductor;

dist/presets/photons/index.d.ts

+import React from "react";
+import { TPresetInstanceProps } from "../../types";
+declare function Photons(props: TPresetInstanceProps): React.JSX.Element;
+export default Photons;

dist/presets/photons/index.js

+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var index_1 = __importDefault(require("../index"));
+var photons_1 = __importDefault(require("../../conductor/photons"));
+function Photons(props) {
+    return react_1.default.createElement(index_1.default, __assign({ Conductor: photons_1.default }, props));
+}
+exports.default = Photons;

src/conductor/photons/index.ts

+import Conductor from "../index";
+import randomInRange from "../../helpers/randomInRange";
+
+const colors = [
+  "#f94144",
+  "f3722c",
+  "f8961e",
+  "f9c74f",
+  "90be6d",
+  "43aa8b",
+  "577590",
+];
+
+const config = [
+  {
+    origin: () => ({ x: randomInRange(0, 1), y: -0.1 }),
+    angle: () => randomInRange(0, -180),
+  },
+  {
+    origin: () => ({ x: randomInRange(0, 1), y: 1.1 }),
+    angle: () => randomInRange(0, 180),
+  },
+  {
+    origin: () => ({ x: -0.1, y: randomInRange(0, 1) }),
+    angle: () => randomInRange(-90, 90),
+  },
+  {
+    origin: () => ({ x: 1.1, y: randomInRange(0, 1) }),
+    angle: () => randomInRange(90, 270),
+  },
+];
+
+class PhotonsConductor extends Conductor {
+  private tickCount: number = 0;
+
+  private get params() {
+    // eslint-disable-next-line no-plusplus
+    return config[this.tickCount++ % config.length];
+  }
+
+  tickAnimation = () => {
+    const colorIndex = Number(randomInRange(0, colors.length - 1).toFixed());
+    const { angle, origin } = this.params!;
+
+    this.confetti(
+      this.decorateOptions({
+        particleCount: 1,
+        angle: angle(),
+        spread: 0,
+        gravity: 0,
+        ticks: 600,
+        decay: 1,
+        startVelocity: 7,
+        // @ts-ignore
+        flat: true,
+        origin: origin(),
+        shapes: ["circle"],
+        scalar: randomInRange(0.2, 6),
+        colors: [colors[colorIndex]!],
+      }),
+    );
+  };
+}
+
+export default PhotonsConductor;

src/presets/photons/index.tsx

+import React from "react";
+import { TPresetInstanceProps } from "../../types";
+import Preset from "../index";
+import PhotonsConductor from "../../conductor/photons";
+
+function Photons(props: TPresetInstanceProps) {
+  return <Preset Conductor={PhotonsConductor} {...props} />;
+}
+export default Photons;

dist/conductor/vortex/index.js

@@ -56,3 +56,3 @@ "use strict";
                 spread: 120,
-                ticks: 30,
+                ticks: 60,
                 gravity: 0,
@@ -59,0 +59,0 @@ decay: 0.94,

package.json

 {
   "name": "react-canvas-confetti",
-  "version": "2.0.6",
+  "version": "2.0.7",
   "description": "React component for canvas-confetti library",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -120,2 +120,4 @@ # [react-canvas-confetti](https://ulitcos.github.io/react-canvas-confetti/)
 
+[Photons Preset](https://codepen.io/ulitcos/pen/xxeZJjG)
+
 [Manual Control](https://codepen.io/ulitcos/pen/eYXXewp)
@@ -122,0 +124,0 @@

src/conductor/vortex/index.ts

@@ -17,3 +17,3 @@ import Conductor from "../index";
         spread: 120,
-        ticks: 30,
+        ticks: 60,
         gravity: 0,
@@ -20,0 +20,0 @@ decay: 0.94,

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

75450

10.62%

Number of package files

66

10%

Lines of code

1806

13.09%

Number of lines in readme file

129

1.57%

Number of medium supply chain risk alerts

0

-100%

No dependency changes