Socket
Socket
Sign inDemoInstall

react-confetti

Package Overview
Dependencies
Maintainers
1
Versions
39
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-confetti - npm Package Compare versions

Comparing version 2.6.1 to 2.7.0

dist/Circle.js
dist/Confetti.js
dist/Particle.js
dist/ParticleGenerator.js
dist/Point.js
dist/Rect.js
dist/utils.js

12

CHANGELOG.md

@@ -0,1 +1,13 @@

# [2.7.0](https://github.com/alampros/react-confetti/compare/v2.6.1...v2.7.0) (2019-03-18)
### Bug Fixes
* point to entire types dir ([3c3184c](https://github.com/alampros/react-confetti/commit/3c3184c))
### Features
* **build:** storybook ([462f682](https://github.com/alampros/react-confetti/commit/462f682))
## [2.6.1](https://github.com/alampros/react-confetti/compare/v2.6.0...v2.6.1) (2019-03-13)

@@ -2,0 +14,0 @@

1645

dist/react-confetti.js

@@ -1,901 +0,1052 @@

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react')) :
typeof define === 'function' && define.amd ? define(['react'], factory) :
(global = global || self, global.ReactConfetti = factory(global.React));
}(this, function (React) { 'use strict';
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"));
else if(typeof define === 'function' && define.amd)
define(["react"], factory);
else if(typeof exports === 'object')
exports["ReactConfetti"] = factory(require("react"));
else
root["ReactConfetti"] = factory(root["React"]);
})(typeof self !== "undefined" ? self : this, function(__WEBPACK_EXTERNAL_MODULE_react__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 0);
/******/ })
/************************************************************************/
/******/ ({
React = React && React.hasOwnProperty('default') ? React['default'] : React;
/***/ "./node_modules/tween-functions/index.js":
/*!***********************************************!*\
!*** ./node_modules/tween-functions/index.js ***!
\***********************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
"use strict";
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
// t: current time, b: beginning value, _c: final value, d: total duration
var tweenFunctions = {
linear: function(t, b, _c, d) {
var c = _c - b;
return c * t / d + b;
},
easeInQuad: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t + b;
},
easeOutQuad: function(t, b, _c, d) {
var c = _c - b;
return -c * (t /= d) * (t - 2) + b;
},
easeInOutQuad: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t + b;
} else {
return -c / 2 * ((--t) * (t - 2) - 1) + b;
}
},
easeInCubic: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t * t + b;
},
easeOutCubic: function(t, b, _c, d) {
var c = _c - b;
return c * ((t = t / d - 1) * t * t + 1) + b;
},
easeInOutCubic: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t + b;
} else {
return c / 2 * ((t -= 2) * t * t + 2) + b;
}
},
easeInQuart: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t * t * t + b;
},
easeOutQuart: function(t, b, _c, d) {
var c = _c - b;
return -c * ((t = t / d - 1) * t * t * t - 1) + b;
},
easeInOutQuart: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t * t + b;
} else {
return -c / 2 * ((t -= 2) * t * t * t - 2) + b;
}
},
easeInQuint: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t * t * t * t + b;
},
easeOutQuint: function(t, b, _c, d) {
var c = _c - b;
return c * ((t = t / d - 1) * t * t * t * t + 1) + b;
},
easeInOutQuint: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t * t * t + b;
} else {
return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
}
},
easeInSine: function(t, b, _c, d) {
var c = _c - b;
return -c * Math.cos(t / d * (Math.PI / 2)) + c + b;
},
easeOutSine: function(t, b, _c, d) {
var c = _c - b;
return c * Math.sin(t / d * (Math.PI / 2)) + b;
},
easeInOutSine: function(t, b, _c, d) {
var c = _c - b;
return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
},
easeInExpo: function(t, b, _c, d) {
var c = _c - b;
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
},
easeOutExpo: function(t, b, _c, d) {
var c = _c - b;
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
},
easeInOutExpo: function(t, b, _c, d) {
var c = _c - b;
if (t === 0) {
return b;
}
if (t === d) {
return b + c;
}
if ((t /= d / 2) < 1) {
return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
} else {
return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b;
}
},
easeInCirc: function(t, b, _c, d) {
var c = _c - b;
return -c * (Math.sqrt(1 - (t /= d) * t) - 1) + b;
},
easeOutCirc: function(t, b, _c, d) {
var c = _c - b;
return c * Math.sqrt(1 - (t = t / d - 1) * t) + b;
},
easeInOutCirc: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b;
} else {
return c / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1) + b;
}
},
easeInElastic: function(t, b, _c, d) {
var c = _c - b;
var a, p, s;
s = 1.70158;
p = 0;
a = c;
if (t === 0) {
return b;
} else if ((t /= d) === 1) {
return b + c;
}
if (!p) {
p = d * 0.3;
}
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
},
easeOutElastic: function(t, b, _c, d) {
var c = _c - b;
var a, p, s;
s = 1.70158;
p = 0;
a = c;
if (t === 0) {
return b;
} else if ((t /= d) === 1) {
return b + c;
}
if (!p) {
p = d * 0.3;
}
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
return a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b;
},
easeInOutElastic: function(t, b, _c, d) {
var c = _c - b;
var a, p, s;
s = 1.70158;
p = 0;
a = c;
if (t === 0) {
return b;
} else if ((t /= d / 2) === 2) {
return b + c;
}
if (!p) {
p = d * (0.3 * 1.5);
}
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
if (t < 1) {
return -0.5 * (a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
} else {
return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p) * 0.5 + c + b;
}
},
easeInBack: function(t, b, _c, d, s) {
var c = _c - b;
if (s === void 0) {
s = 1.70158;
}
return c * (t /= d) * t * ((s + 1) * t - s) + b;
},
easeOutBack: function(t, b, _c, d, s) {
var c = _c - b;
if (s === void 0) {
s = 1.70158;
}
return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
},
easeInOutBack: function(t, b, _c, d, s) {
var c = _c - b;
if (s === void 0) {
s = 1.70158;
}
if ((t /= d / 2) < 1) {
return c / 2 * (t * t * (((s *= 1.525) + 1) * t - s)) + b;
} else {
return c / 2 * ((t -= 2) * t * (((s *= 1.525) + 1) * t + s) + 2) + b;
}
},
easeInBounce: function(t, b, _c, d) {
var c = _c - b;
var v;
v = tweenFunctions.easeOutBounce(d - t, 0, c, d);
return c - v + b;
},
easeOutBounce: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d) < 1 / 2.75) {
return c * (7.5625 * t * t) + b;
} else if (t < 2 / 2.75) {
return c * (7.5625 * (t -= 1.5 / 2.75) * t + 0.75) + b;
} else if (t < 2.5 / 2.75) {
return c * (7.5625 * (t -= 2.25 / 2.75) * t + 0.9375) + b;
} else {
return c * (7.5625 * (t -= 2.625 / 2.75) * t + 0.984375) + b;
}
},
easeInOutBounce: function(t, b, _c, d) {
var c = _c - b;
var v;
if (t < d / 2) {
v = tweenFunctions.easeInBounce(t * 2, 0, c, d);
return v * 0.5 + b;
} else {
v = tweenFunctions.easeOutBounce(t * 2 - d, 0, c, d);
return v * 0.5 + c * 0.5 + b;
}
}
};
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
module.exports = tweenFunctions;
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
/***/ }),
function _extends() {
_extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
/***/ "./src/Confetti.ts":
/*!*************************!*\
!*** ./src/Confetti.ts ***!
\*************************/
/*! exports provided: confettiDefaults, Confetti, default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "confettiDefaults", function() { return confettiDefaults; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Confetti", function() { return Confetti; });
/* harmony import */ var tween_functions__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tween-functions */ "./node_modules/tween-functions/index.js");
/* harmony import */ var tween_functions__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(tween_functions__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ParticleGenerator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ParticleGenerator */ "./src/ParticleGenerator.ts");
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
return target;
};
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
return _extends.apply(this, arguments);
}
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _objectSpread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
if (typeof Object.getOwnPropertySymbols === 'function') {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
ownKeys.forEach(function (key) {
_defineProperty(target, key, source[key]);
});
}
return target;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
var confettiDefaults = {
width: typeof window !== 'undefined' ? window.innerWidth : 300,
height: typeof window !== 'undefined' ? window.innerHeight : 200,
numberOfPieces: 200,
friction: 0.99,
wind: 0,
gravity: 0.1,
colors: ['#f44336', '#e91e63', '#9c27b0', '#673ab7', '#3f51b5', '#2196f3', '#03a9f4', '#00bcd4', '#009688', '#4CAF50', '#8BC34A', '#CDDC39', '#FFEB3B', '#FFC107', '#FF9800', '#FF5722', '#795548'],
opacity: 1.0,
debug: false,
tweenFunction: tween_functions__WEBPACK_IMPORTED_MODULE_0___default.a.easeInOutQuad,
tweenDuration: 5000,
recycle: true,
run: true
};
var Confetti =
/*#__PURE__*/
function () {
function Confetti(_canvas, _opts) {
var _this = this;
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
_classCallCheck(this, Confetti);
_defineProperty(this, "canvas", void 0);
_defineProperty(this, "context", void 0);
_defineProperty(this, "_options", void 0);
_defineProperty(this, "generator", void 0);
_defineProperty(this, "setOptionsWithDefaults", function (opts) {
var computedConfettiDefaults = {
confettiSource: {
x: 0,
y: 0,
w: _this.canvas.width,
h: 0
}
};
_this._options = _objectSpread({}, computedConfettiDefaults, confettiDefaults, opts);
Object.assign(_this, opts.confettiSource);
});
if (superClass) _setPrototypeOf(subClass, superClass);
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
_defineProperty(this, "update", function () {
var run = _this.options.run,
canvas = _this.canvas,
context = _this.context;
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
if (run) {
context.fillStyle = 'white';
context.clearRect(0, 0, canvas.width, canvas.height);
}
return _setPrototypeOf(o, p);
}
if (_this.generator.animate()) {
requestAnimationFrame(_this.update);
} else {
_this._options.run = false;
}
});
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
this.canvas = _canvas;
var ctx = this.canvas.getContext('2d');
if (!ctx) {
throw new Error('Could not get canvas context');
}
return self;
this.context = ctx;
this.generator = new _ParticleGenerator__WEBPACK_IMPORTED_MODULE_1__["default"](this.canvas, function () {
return _this.options;
});
this.options = _opts;
this.update();
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
_createClass(Confetti, [{
key: "options",
get: function get() {
return this._options;
},
set: function set(opts) {
var lastRunState = this._options && this._options.run;
this.setOptionsWithDefaults(opts);
if (this.generator) {
Object.assign(this.generator, this.options.confettiSource);
}
if (typeof opts.run === 'boolean' && opts.run && lastRunState === false) {
this.update();
}
}
}]);
return _assertThisInitialized(self);
}
return Confetti;
}();
/* harmony default export */ __webpack_exports__["default"] = (Confetti);
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
}
/***/ }),
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread();
}
/***/ "./src/Particle.ts":
/*!*************************!*\
!*** ./src/Particle.ts ***!
\*************************/
/*! exports provided: ParticleShape, default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) {
for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ParticleShape", function() { return ParticleShape; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Particle; });
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./src/utils.ts");
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
return arr2;
}
}
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _iterableToArray(iter) {
if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter);
}
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _iterableToArrayLimit(arr, i) {
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
var ParticleShape;
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
(function (ParticleShape) {
ParticleShape[ParticleShape["Circle"] = 0] = "Circle";
ParticleShape[ParticleShape["Square"] = 1] = "Square";
ParticleShape[ParticleShape["Strip"] = 2] = "Strip";
})(ParticleShape || (ParticleShape = {}));
return _arr;
}
var RotationDirection;
function _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance");
}
(function (RotationDirection) {
RotationDirection[RotationDirection["Positive"] = 1] = "Positive";
RotationDirection[RotationDirection["Negative"] = -1] = "Negative";
})(RotationDirection || (RotationDirection = {}));
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance");
}
var Particle =
/*#__PURE__*/
function () {
function Particle(context, getOptions, x, y) {
_classCallCheck(this, Particle);
// t: current time, b: beginning value, _c: final value, d: total duration
var tweenFunctions = {
linear: function(t, b, _c, d) {
var c = _c - b;
return c * t / d + b;
},
easeInQuad: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t + b;
},
easeOutQuad: function(t, b, _c, d) {
var c = _c - b;
return -c * (t /= d) * (t - 2) + b;
},
easeInOutQuad: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t + b;
} else {
return -c / 2 * ((--t) * (t - 2) - 1) + b;
}
},
easeInCubic: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t * t + b;
},
easeOutCubic: function(t, b, _c, d) {
var c = _c - b;
return c * ((t = t / d - 1) * t * t + 1) + b;
},
easeInOutCubic: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t + b;
} else {
return c / 2 * ((t -= 2) * t * t + 2) + b;
}
},
easeInQuart: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t * t * t + b;
},
easeOutQuart: function(t, b, _c, d) {
var c = _c - b;
return -c * ((t = t / d - 1) * t * t * t - 1) + b;
},
easeInOutQuart: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t * t + b;
} else {
return -c / 2 * ((t -= 2) * t * t * t - 2) + b;
}
},
easeInQuint: function(t, b, _c, d) {
var c = _c - b;
return c * (t /= d) * t * t * t * t + b;
},
easeOutQuint: function(t, b, _c, d) {
var c = _c - b;
return c * ((t = t / d - 1) * t * t * t * t + 1) + b;
},
easeInOutQuint: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return c / 2 * t * t * t * t * t + b;
} else {
return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
}
},
easeInSine: function(t, b, _c, d) {
var c = _c - b;
return -c * Math.cos(t / d * (Math.PI / 2)) + c + b;
},
easeOutSine: function(t, b, _c, d) {
var c = _c - b;
return c * Math.sin(t / d * (Math.PI / 2)) + b;
},
easeInOutSine: function(t, b, _c, d) {
var c = _c - b;
return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
},
easeInExpo: function(t, b, _c, d) {
var c = _c - b;
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
},
easeOutExpo: function(t, b, _c, d) {
var c = _c - b;
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
},
easeInOutExpo: function(t, b, _c, d) {
var c = _c - b;
if (t === 0) {
return b;
}
if (t === d) {
return b + c;
}
if ((t /= d / 2) < 1) {
return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
} else {
return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b;
}
},
easeInCirc: function(t, b, _c, d) {
var c = _c - b;
return -c * (Math.sqrt(1 - (t /= d) * t) - 1) + b;
},
easeOutCirc: function(t, b, _c, d) {
var c = _c - b;
return c * Math.sqrt(1 - (t = t / d - 1) * t) + b;
},
easeInOutCirc: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d / 2) < 1) {
return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b;
} else {
return c / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1) + b;
}
},
easeInElastic: function(t, b, _c, d) {
var c = _c - b;
var a, p, s;
s = 1.70158;
p = 0;
a = c;
if (t === 0) {
return b;
} else if ((t /= d) === 1) {
return b + c;
}
if (!p) {
p = d * 0.3;
}
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
},
easeOutElastic: function(t, b, _c, d) {
var c = _c - b;
var a, p, s;
s = 1.70158;
p = 0;
a = c;
if (t === 0) {
return b;
} else if ((t /= d) === 1) {
return b + c;
}
if (!p) {
p = d * 0.3;
}
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
return a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b;
},
easeInOutElastic: function(t, b, _c, d) {
var c = _c - b;
var a, p, s;
s = 1.70158;
p = 0;
a = c;
if (t === 0) {
return b;
} else if ((t /= d / 2) === 2) {
return b + c;
}
if (!p) {
p = d * (0.3 * 1.5);
}
if (a < Math.abs(c)) {
a = c;
s = p / 4;
} else {
s = p / (2 * Math.PI) * Math.asin(c / a);
}
if (t < 1) {
return -0.5 * (a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
} else {
return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p) * 0.5 + c + b;
}
},
easeInBack: function(t, b, _c, d, s) {
var c = _c - b;
if (s === void 0) {
s = 1.70158;
}
return c * (t /= d) * t * ((s + 1) * t - s) + b;
},
easeOutBack: function(t, b, _c, d, s) {
var c = _c - b;
if (s === void 0) {
s = 1.70158;
}
return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
},
easeInOutBack: function(t, b, _c, d, s) {
var c = _c - b;
if (s === void 0) {
s = 1.70158;
}
if ((t /= d / 2) < 1) {
return c / 2 * (t * t * (((s *= 1.525) + 1) * t - s)) + b;
} else {
return c / 2 * ((t -= 2) * t * (((s *= 1.525) + 1) * t + s) + 2) + b;
}
},
easeInBounce: function(t, b, _c, d) {
var c = _c - b;
var v;
v = tweenFunctions.easeOutBounce(d - t, 0, c, d);
return c - v + b;
},
easeOutBounce: function(t, b, _c, d) {
var c = _c - b;
if ((t /= d) < 1 / 2.75) {
return c * (7.5625 * t * t) + b;
} else if (t < 2 / 2.75) {
return c * (7.5625 * (t -= 1.5 / 2.75) * t + 0.75) + b;
} else if (t < 2.5 / 2.75) {
return c * (7.5625 * (t -= 2.25 / 2.75) * t + 0.9375) + b;
} else {
return c * (7.5625 * (t -= 2.625 / 2.75) * t + 0.984375) + b;
}
},
easeInOutBounce: function(t, b, _c, d) {
var c = _c - b;
var v;
if (t < d / 2) {
v = tweenFunctions.easeInBounce(t * 2, 0, c, d);
return v * 0.5 + b;
} else {
v = tweenFunctions.easeOutBounce(t * 2 - d, 0, c, d);
return v * 0.5 + c * 0.5 + b;
}
}
};
_defineProperty(this, "context", void 0);
var tweenFunctions_1 = tweenFunctions;
_defineProperty(this, "radius", void 0);
function degreesToRads(degrees) {
return degrees * Math.PI / 180;
}
function randomRange(min, max) {
return min + Math.random() * (max - min);
}
function randomInt(min, max) {
return Math.floor(min + Math.random() * (max - min + 1));
}
_defineProperty(this, "x", void 0);
var ParticleShape;
_defineProperty(this, "y", void 0);
(function (ParticleShape) {
ParticleShape[ParticleShape["Circle"] = 0] = "Circle";
ParticleShape[ParticleShape["Square"] = 1] = "Square";
ParticleShape[ParticleShape["Strip"] = 2] = "Strip";
})(ParticleShape || (ParticleShape = {}));
_defineProperty(this, "w", void 0);
var RotationDirection;
_defineProperty(this, "h", void 0);
(function (RotationDirection) {
RotationDirection[RotationDirection["Positive"] = 1] = "Positive";
RotationDirection[RotationDirection["Negative"] = -1] = "Negative";
})(RotationDirection || (RotationDirection = {}));
_defineProperty(this, "vx", void 0);
var Particle =
/*#__PURE__*/
function () {
function Particle(context, getOptions, x, y) {
_classCallCheck(this, Particle);
_defineProperty(this, "vy", void 0);
_defineProperty(this, "context", void 0);
_defineProperty(this, "shape", void 0);
_defineProperty(this, "radius", void 0);
_defineProperty(this, "angle", void 0);
_defineProperty(this, "x", void 0);
_defineProperty(this, "angularSpin", void 0);
_defineProperty(this, "y", void 0);
_defineProperty(this, "color", void 0);
_defineProperty(this, "w", void 0);
_defineProperty(this, "rotateY", void 0);
_defineProperty(this, "h", void 0);
_defineProperty(this, "rotationDirection", void 0);
_defineProperty(this, "vx", void 0);
_defineProperty(this, "getOptions", void 0);
_defineProperty(this, "vy", void 0);
this.getOptions = getOptions;
_defineProperty(this, "shape", void 0);
var _this$getOptions = this.getOptions(),
colors = _this$getOptions.colors;
_defineProperty(this, "angle", void 0);
this.context = context;
this.x = x;
this.y = y;
this.w = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(5, 20);
this.h = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(5, 20);
this.radius = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(5, 10);
this.vx = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(-4, 4);
this.vy = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(-10, -0);
this.shape = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomInt"])(0, 2);
this.angle = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["degreesToRads"])(Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(0, 360));
this.angularSpin = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(-0.2, 0.2);
this.color = colors[Math.floor(Math.random() * colors.length)];
this.rotateY = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(0, 1);
this.rotationDirection = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["randomRange"])(0, 1) ? RotationDirection.Positive : RotationDirection.Negative;
}
_defineProperty(this, "angularSpin", void 0);
_createClass(Particle, [{
key: "update",
value: function update() {
var _this$getOptions2 = this.getOptions(),
gravity = _this$getOptions2.gravity,
wind = _this$getOptions2.wind,
friction = _this$getOptions2.friction,
opacity = _this$getOptions2.opacity,
drawShape = _this$getOptions2.drawShape;
_defineProperty(this, "color", void 0);
this.x += this.vx;
this.y += this.vy;
this.vy += gravity;
this.vx += wind;
this.vx *= friction;
this.vy *= friction;
_defineProperty(this, "rotateY", void 0);
if (this.rotateY >= 1 && this.rotationDirection === RotationDirection.Positive) {
this.rotationDirection = RotationDirection.Negative;
} else if (this.rotateY <= -1 && this.rotationDirection === RotationDirection.Negative) {
this.rotationDirection = RotationDirection.Positive;
}
_defineProperty(this, "rotationDirection", void 0);
var rotateDelta = 0.1 * this.rotationDirection;
this.rotateY += rotateDelta;
this.angle += this.angularSpin;
this.context.save();
this.context.translate(this.x, this.y);
this.context.rotate(this.angle);
this.context.scale(1, this.rotateY);
this.context.rotate(this.angle);
this.context.beginPath();
this.context.fillStyle = this.color;
this.context.strokeStyle = this.color;
this.context.globalAlpha = opacity;
this.context.lineCap = 'round';
this.context.lineWidth = 2;
_defineProperty(this, "getOptions", void 0);
if (drawShape && typeof drawShape === 'function') {
drawShape.call(this, this.context);
} else {
switch (this.shape) {
case ParticleShape.Circle:
{
this.context.beginPath();
this.context.arc(0, 0, this.radius, 0, 2 * Math.PI);
this.context.fill();
break;
}
this.getOptions = getOptions;
case ParticleShape.Square:
{
this.context.fillRect(-this.w / 2, -this.h / 2, this.w, this.h);
break;
}
var _this$getOptions = this.getOptions(),
colors = _this$getOptions.colors;
case ParticleShape.Strip:
{
this.context.fillRect(-this.w / 6, -this.h / 2, this.w / 3, this.h);
break;
}
}
}
this.context = context;
this.x = x;
this.y = y;
this.w = randomRange(5, 20);
this.h = randomRange(5, 20);
this.radius = randomRange(5, 10);
this.vx = randomRange(-4, 4);
this.vy = randomRange(-10, -0);
this.shape = randomInt(0, 2);
this.angle = degreesToRads(randomRange(0, 360));
this.angularSpin = randomRange(-0.2, 0.2);
this.color = colors[Math.floor(Math.random() * colors.length)];
this.rotateY = randomRange(0, 1);
this.rotationDirection = randomRange(0, 1) ? RotationDirection.Positive : RotationDirection.Negative;
this.context.closePath();
this.context.restore();
}
}]);
_createClass(Particle, [{
key: "update",
value: function update() {
var _this$getOptions2 = this.getOptions(),
gravity = _this$getOptions2.gravity,
wind = _this$getOptions2.wind,
friction = _this$getOptions2.friction,
opacity = _this$getOptions2.opacity,
drawShape = _this$getOptions2.drawShape;
return Particle;
}();
this.x += this.vx;
this.y += this.vy;
this.vy += gravity;
this.vx += wind;
this.vx *= friction;
this.vy *= friction;
if (this.rotateY >= 1 && this.rotationDirection === RotationDirection.Positive) {
this.rotationDirection = RotationDirection.Negative;
} else if (this.rotateY <= -1 && this.rotationDirection === RotationDirection.Negative) {
this.rotationDirection = RotationDirection.Positive;
}
var rotateDelta = 0.1 * this.rotationDirection;
this.rotateY += rotateDelta;
this.angle += this.angularSpin;
this.context.save();
this.context.translate(this.x, this.y);
this.context.rotate(this.angle);
this.context.scale(1, this.rotateY);
this.context.rotate(this.angle);
this.context.beginPath();
this.context.fillStyle = this.color;
this.context.strokeStyle = this.color;
this.context.globalAlpha = opacity;
this.context.lineCap = 'round';
this.context.lineWidth = 2;
/***/ }),
if (drawShape && typeof drawShape === 'function') {
drawShape.call(this, this.context);
} else {
switch (this.shape) {
case ParticleShape.Circle:
{
this.context.beginPath();
this.context.arc(0, 0, this.radius, 0, 2 * Math.PI);
this.context.fill();
break;
}
/***/ "./src/ParticleGenerator.ts":
/*!**********************************!*\
!*** ./src/ParticleGenerator.ts ***!
\**********************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
case ParticleShape.Square:
{
this.context.fillRect(-this.w / 2, -this.h / 2, this.w, this.h);
break;
}
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ParticleGenerator; });
/* harmony import */ var _Particle__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Particle */ "./src/Particle.ts");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ "./src/utils.ts");
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
case ParticleShape.Strip:
{
this.context.fillRect(-this.w / 6, -this.h / 2, this.w / 3, this.h);
break;
}
}
}
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
this.context.closePath();
this.context.restore();
}
}]);
return Particle;
}();
var ParticleGenerator = function ParticleGenerator(_canvas, getOptions) {
var _this = this;
_classCallCheck(this, ParticleGenerator);
var ParticleGenerator = function ParticleGenerator(_canvas, getOptions) {
var _this = this;
_defineProperty(this, "canvas", void 0);
_classCallCheck(this, ParticleGenerator);
_defineProperty(this, "context", void 0);
_defineProperty(this, "canvas", void 0);
_defineProperty(this, "getOptions", void 0);
_defineProperty(this, "context", void 0);
_defineProperty(this, "x", 0);
_defineProperty(this, "getOptions", void 0);
_defineProperty(this, "y", 0);
_defineProperty(this, "x", 0);
_defineProperty(this, "w", 0);
_defineProperty(this, "y", 0);
_defineProperty(this, "h", 0);
_defineProperty(this, "w", 0);
_defineProperty(this, "lastNumberOfPieces", 0);
_defineProperty(this, "h", 0);
_defineProperty(this, "tweenInitTime", Date.now());
_defineProperty(this, "lastNumberOfPieces", 0);
_defineProperty(this, "particles", []);
_defineProperty(this, "tweenInitTime", Date.now());
_defineProperty(this, "particlesGenerated", 0);
_defineProperty(this, "particles", []);
_defineProperty(this, "removeParticleAt", function (i) {
_this.particles.splice(i, 1);
});
_defineProperty(this, "particlesGenerated", 0);
_defineProperty(this, "getParticle", function () {
var newParticleX = randomRange(_this.x, _this.w + _this.x);
var newParticleY = randomRange(_this.y, _this.h + _this.y);
return new Particle(_this.context, _this.getOptions, newParticleX, newParticleY);
});
_defineProperty(this, "removeParticleAt", function (i) {
_this.particles.splice(i, 1);
});
_defineProperty(this, "animate", function () {
var canvas = _this.canvas,
context = _this.context,
particlesGenerated = _this.particlesGenerated,
lastNumberOfPieces = _this.lastNumberOfPieces;
_defineProperty(this, "getParticle", function () {
var newParticleX = Object(_utils__WEBPACK_IMPORTED_MODULE_1__["randomRange"])(_this.x, _this.w + _this.x);
var newParticleY = Object(_utils__WEBPACK_IMPORTED_MODULE_1__["randomRange"])(_this.y, _this.h + _this.y);
return new _Particle__WEBPACK_IMPORTED_MODULE_0__["default"](_this.context, _this.getOptions, newParticleX, newParticleY);
});
var _this$getOptions = _this.getOptions(),
run = _this$getOptions.run,
recycle = _this$getOptions.recycle,
numberOfPieces = _this$getOptions.numberOfPieces,
debug = _this$getOptions.debug,
tweenFunction = _this$getOptions.tweenFunction,
tweenDuration = _this$getOptions.tweenDuration;
_defineProperty(this, "animate", function () {
var canvas = _this.canvas,
context = _this.context,
particlesGenerated = _this.particlesGenerated,
lastNumberOfPieces = _this.lastNumberOfPieces;
if (!run) {
return false;
}
var _this$getOptions = _this.getOptions(),
run = _this$getOptions.run,
recycle = _this$getOptions.recycle,
numberOfPieces = _this$getOptions.numberOfPieces,
debug = _this$getOptions.debug,
tweenFunction = _this$getOptions.tweenFunction,
tweenDuration = _this$getOptions.tweenDuration;
var nP = _this.particles.length;
var activeCount = recycle ? nP : particlesGenerated;
var now = Date.now(); // Initial population
if (!run) {
return false;
}
if (activeCount < numberOfPieces) {
// Use the numberOfPieces prop as a key to reset the easing timing
if (lastNumberOfPieces !== numberOfPieces) {
_this.tweenInitTime = now;
_this.lastNumberOfPieces = numberOfPieces;
}
var nP = _this.particles.length;
var activeCount = recycle ? nP : particlesGenerated;
var now = Date.now(); // Initial population
var tweenInitTime = _this.tweenInitTime; // Add more than one piece per loop, otherwise the number of pieces would
// be limitted by the RAF framerate
if (activeCount < numberOfPieces) {
// Use the numberOfPieces prop as a key to reset the easing timing
if (lastNumberOfPieces !== numberOfPieces) {
_this.tweenInitTime = now;
_this.lastNumberOfPieces = numberOfPieces;
}
var progressTime = now - tweenInitTime > tweenDuration ? tweenDuration : Math.max(0, now - tweenInitTime);
var tweenedVal = tweenFunction(progressTime, activeCount, numberOfPieces, tweenDuration);
var numToAdd = Math.round(tweenedVal - activeCount);
var tweenInitTime = _this.tweenInitTime; // Add more than one piece per loop, otherwise the number of pieces would
// be limitted by the RAF framerate
for (var i = 0; i < numToAdd; i++) {
_this.particles.push(_this.getParticle());
}
var progressTime = now - tweenInitTime > tweenDuration ? tweenDuration : Math.max(0, now - tweenInitTime);
var tweenedVal = tweenFunction(progressTime, activeCount, numberOfPieces, tweenDuration);
var numToAdd = Math.round(tweenedVal - activeCount);
_this.particlesGenerated += numToAdd;
for (var i = 0; i < numToAdd; i++) {
_this.particles.push(_this.getParticle());
}
if (debug) {
// Draw debug text
context.font = '12px sans-serif';
context.fillStyle = '#333';
context.textAlign = 'right';
context.fillText("Particles: ".concat(nP), canvas.width - 10, canvas.height - 20);
} // Maintain the population
_this.particlesGenerated += numToAdd;
}
if (debug) {
// Draw debug text
context.font = '12px sans-serif';
context.fillStyle = '#333';
context.textAlign = 'right';
context.fillText("Particles: ".concat(nP), canvas.width - 10, canvas.height - 20);
} // Maintain the population
_this.particles.forEach(function (p, i) {
// Update each particle's position
p.update(); // Prune the off-canvas particles
if (p.y > canvas.height || p.y < -100 || p.x > canvas.width + 100 || p.x < -100) {
if (recycle && activeCount <= numberOfPieces) {
// Replace the particle with a brand new one
_this.particles[i] = _this.getParticle();
} else {
_this.removeParticleAt(i);
}
_this.particles.forEach(function (p, i) {
// Update each particle's position
p.update(); // Prune the off-canvas particles
if (p.y > canvas.height || p.y < -100 || p.x > canvas.width + 100 || p.x < -100) {
if (recycle && activeCount <= numberOfPieces) {
// Replace the particle with a brand new one
_this.particles[i] = _this.getParticle();
} else {
_this.removeParticleAt(i);
}
});
return nP > 0 || activeCount < numberOfPieces;
}
});
this.canvas = _canvas;
var ctx = this.canvas.getContext('2d');
return nP > 0 || activeCount < numberOfPieces;
});
if (!ctx) {
throw new Error('Could not get canvas context');
}
this.canvas = _canvas;
var ctx = this.canvas.getContext('2d');
this.context = ctx;
this.getOptions = getOptions;
};
if (!ctx) {
throw new Error('Could not get canvas context');
}
var confettiDefaults = {
width: typeof window !== 'undefined' ? window.innerWidth : 300,
height: typeof window !== 'undefined' ? window.innerHeight : 200,
numberOfPieces: 200,
friction: 0.99,
wind: 0,
gravity: 0.1,
colors: ['#f44336', '#e91e63', '#9c27b0', '#673ab7', '#3f51b5', '#2196f3', '#03a9f4', '#00bcd4', '#009688', '#4CAF50', '#8BC34A', '#CDDC39', '#FFEB3B', '#FFC107', '#FF9800', '#FF5722', '#795548'],
opacity: 1.0,
debug: false,
tweenFunction: tweenFunctions_1.easeInOutQuad,
tweenDuration: 5000,
recycle: true,
run: true
};
this.context = ctx;
this.getOptions = getOptions;
};
var Confetti =
/*#__PURE__*/
function () {
function Confetti(_canvas, _opts) {
var _this = this;
_classCallCheck(this, Confetti);
_defineProperty(this, "canvas", void 0);
/***/ }),
_defineProperty(this, "context", void 0);
/***/ "./src/ReactConfetti.tsx":
/*!*******************************!*\
!*** ./src/ReactConfetti.tsx ***!
\*******************************/
/*! exports provided: ReactConfetti, default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
_defineProperty(this, "_options", void 0);
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ReactConfetti", function() { return ReactConfetti; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Confetti__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Confetti */ "./src/Confetti.ts");
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
_defineProperty(this, "generator", void 0);
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
_defineProperty(this, "setOptionsWithDefaults", function (opts) {
var computedConfettiDefaults = {
confettiSource: {
x: 0,
y: 0,
w: _this.canvas.width,
h: 0
}
};
_this._options = _objectSpread({}, computedConfettiDefaults, confettiDefaults, opts);
Object.assign(_this, opts.confettiSource);
});
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
_defineProperty(this, "update", function () {
var run = _this.options.run,
canvas = _this.canvas,
context = _this.context;
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
if (run) {
context.fillStyle = 'white';
context.clearRect(0, 0, canvas.width, canvas.height);
}
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
if (_this.generator.animate()) {
requestAnimationFrame(_this.update);
} else {
_this._options.run = false;
}
});
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
this.canvas = _canvas;
var ctx = this.canvas.getContext('2d');
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
if (!ctx) {
throw new Error('Could not get canvas context');
}
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
this.context = ctx;
this.generator = new ParticleGenerator(this.canvas, function () {
return _this.options;
});
this.options = _opts;
this.update();
}
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
_createClass(Confetti, [{
key: "options",
get: function get() {
return this._options;
},
set: function set(opts) {
var lastRunState = this._options && this._options.run;
this.setOptionsWithDefaults(opts);
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
if (this.generator) {
Object.assign(this.generator, this.options.confettiSource);
}
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
if (typeof opts.run === 'boolean' && opts.run && lastRunState === false) {
this.update();
}
}
}]);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
return Confetti;
}();
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var ReactConfetti =
/*#__PURE__*/
function (_React$Component) {
_inherits(ReactConfetti, _React$Component);
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function ReactConfetti() {
var _getPrototypeOf2;
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _this;
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
_classCallCheck(this, ReactConfetti);
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(ReactConfetti)).call.apply(_getPrototypeOf2, [this].concat(args)));
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
_defineProperty(_assertThisInitialized(_this), "canvas", React.createRef());
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
_defineProperty(_assertThisInitialized(_this), "confetti", void 0);
return _this;
var ReactConfetti =
/*#__PURE__*/
function (_Component) {
_inherits(ReactConfetti, _Component);
function ReactConfetti() {
var _getPrototypeOf2;
var _this;
_classCallCheck(this, ReactConfetti);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_createClass(ReactConfetti, [{
key: "componentDidMount",
value: function componentDidMount() {
if (this.canvas.current) {
var opts = extractCanvasProps(this.props)[0];
this.confetti = new Confetti(this.canvas.current, opts);
}
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(ReactConfetti)).call.apply(_getPrototypeOf2, [this].concat(args)));
_defineProperty(_assertThisInitialized(_this), "canvas", react__WEBPACK_IMPORTED_MODULE_0___default.a.createRef());
_defineProperty(_assertThisInitialized(_this), "confetti", void 0);
return _this;
}
_createClass(ReactConfetti, [{
key: "componentDidMount",
value: function componentDidMount() {
if (this.canvas.current) {
var opts = extractCanvasProps(this.props)[0];
this.confetti = new _Confetti__WEBPACK_IMPORTED_MODULE_1__["default"](this.canvas.current, opts);
}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {
var confettiOptions = extractCanvasProps(nextProps)[0];
}
}, {
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {
var confettiOptions = extractCanvasProps(nextProps)[0];
if (this.confetti) {
this.confetti.options = confettiOptions;
}
if (this.confetti) {
this.confetti.options = confettiOptions;
}
}, {
key: "render",
value: function render() {
var _extractCanvasProps = extractCanvasProps(this.props),
_extractCanvasProps2 = _slicedToArray(_extractCanvasProps, 2),
confettiOptions = _extractCanvasProps2[0],
passedProps = _extractCanvasProps2[1];
}
}, {
key: "render",
value: function render() {
var _extractCanvasProps = extractCanvasProps(this.props),
_extractCanvasProps2 = _slicedToArray(_extractCanvasProps, 2),
confettiOptions = _extractCanvasProps2[0],
passedProps = _extractCanvasProps2[1];
var canvasStyles = _objectSpread({
zIndex: 2,
position: 'absolute',
top: 0,
left: 0,
bottom: 0,
right: 0
}, passedProps.style);
var canvasStyles = _objectSpread({
zIndex: 2,
position: 'absolute',
top: 0,
left: 0,
bottom: 0,
right: 0
}, passedProps.style);
return React.createElement("canvas", _extends({
width: confettiOptions.width,
height: confettiOptions.height,
ref: this.canvas
}, passedProps, {
style: canvasStyles
}));
}
}]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("canvas", _extends({
width: confettiOptions.width,
height: confettiOptions.height,
ref: this.canvas
}, passedProps, {
style: canvasStyles
}));
}
}]);
return ReactConfetti;
}(React.Component);
return ReactConfetti;
}(react__WEBPACK_IMPORTED_MODULE_0__["Component"]);
_defineProperty(ReactConfetti, "defaultProps", _objectSpread({}, confettiDefaults));
_defineProperty(ReactConfetti, "defaultProps", _objectSpread({}, _Confetti__WEBPACK_IMPORTED_MODULE_1__["confettiDefaults"]));
function extractCanvasProps(props) {
var confettiOptions = {};
var rest = {};
var confettiOptionKeys = [].concat(_toConsumableArray(Object.keys(confettiDefaults)), ['confettiSource', 'drawShape']);
function extractCanvasProps(props) {
var confettiOptions = {};
var rest = {};
var confettiOptionKeys = [].concat(_toConsumableArray(Object.keys(_Confetti__WEBPACK_IMPORTED_MODULE_1__["confettiDefaults"])), ['confettiSource', 'drawShape']);
for (var prop in props) {
var val = props[prop];
for (var prop in props) {
var val = props[prop];
if (confettiOptionKeys.includes(prop)) {
confettiOptions[prop] = val;
} else {
rest[prop] = val;
}
if (confettiOptionKeys.includes(prop)) {
confettiOptions[prop] = val;
} else {
rest[prop] = val;
}
return [confettiOptions, rest];
}
return ReactConfetti;
return [confettiOptions, rest];
}
}));
//# sourceMappingURL=react-confetti.js.map
/* harmony default export */ __webpack_exports__["default"] = (ReactConfetti);
/***/ }),
/***/ "./src/utils.ts":
/*!**********************!*\
!*** ./src/utils.ts ***!
\**********************/
/*! exports provided: norm, lerp, map, clamp, distance, distanceXY, circleCollision, circlePointCollision, inRange, pointInRect, rangeIntersect, rectIntersect, degreesToRads, radsToDegrees, randomRange, randomInt */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "norm", function() { return norm; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "lerp", function() { return lerp; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "map", function() { return map; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "clamp", function() { return clamp; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "distance", function() { return distance; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "distanceXY", function() { return distanceXY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "circleCollision", function() { return circleCollision; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "circlePointCollision", function() { return circlePointCollision; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "inRange", function() { return inRange; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "pointInRect", function() { return pointInRect; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "rangeIntersect", function() { return rangeIntersect; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "rectIntersect", function() { return rectIntersect; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "degreesToRads", function() { return degreesToRads; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "radsToDegrees", function() { return radsToDegrees; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "randomRange", function() { return randomRange; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "randomInt", function() { return randomInt; });
function norm(value, min, max) {
return (value - min) / (max - min);
}
function lerp(lnorm, min, max) {
return (max - min) * lnorm + min;
}
function map(value, sourceMin, sourceMax, destMin, destMax) {
return lerp(norm(value, sourceMin, sourceMax), destMin, destMax);
}
function clamp(value, min, max) {
return Math.min(Math.max(value, Math.min(min, max)), Math.max(min, max));
}
function distance(p0, p1) {
var dx = p1.x - p0.x;
var dy = p1.y - p0.y;
return Math.sqrt(dx * dx + dy * dy);
}
function distanceXY(x0, y0, x1, y1) {
var dx = x1 - x0;
var dy = y1 - y0;
return Math.sqrt(dx * dx + dy * dy);
}
function circleCollision(c0, c1) {
return distance(c0, c1) <= c0.radius + c1.radius;
}
function circlePointCollision(x, y, circle) {
return distanceXY(x, y, circle.x, circle.y) < circle.radius;
}
function inRange(value, min, max) {
return value >= Math.min(min, max) && value <= Math.max(min, max);
}
function pointInRect(p, rect) {
return inRange(p.x, rect.x, rect.x + rect.w) && inRange(p.y, rect.y, rect.y + rect.h);
}
function rangeIntersect(min0, max0, min1, max1) {
return Math.max(min0, max0) >= Math.min(min1, max1) && Math.min(min0, max0) <= Math.max(min1, max1);
}
function rectIntersect(r0, r1) {
return rangeIntersect(r0.x, r0.x + r0.w, r1.x, r1.x + r1.w) && rangeIntersect(r0.y, r0.y + r0.h, r1.y, r1.y + r1.h);
}
function degreesToRads(degrees) {
return degrees * Math.PI / 180;
}
function radsToDegrees(radians) {
return radians * 180 / Math.PI;
}
function randomRange(min, max) {
return min + Math.random() * (max - min);
}
function randomInt(min, max) {
return Math.floor(min + Math.random() * (max - min + 1));
}
/***/ }),
/***/ 0:
/*!*************************************!*\
!*** multi ./src/ReactConfetti.tsx ***!
\*************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__(/*! ./src/ReactConfetti.tsx */"./src/ReactConfetti.tsx");
/***/ }),
/***/ "react":
/*!**************************************************************************************!*\
!*** external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react"} ***!
\**************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_react__;
/***/ })
/******/ })["default"];
});
//# sourceMappingURL=react-confetti.js.map

4

dist/react-confetti.min.js

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

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):(t=t||self).ReactConfetti=e(t.React)}(this,function(c){"use strict";function u(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function e(t,e,n){return e&&i(t.prototype,e),n&&i(t,n),t}function h(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function r(){return(r=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function o(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable}))),i.forEach(function(t){h(e,t,n[t])})}return e}function f(t){return(f=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function n(t,e){return(n=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function l(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function a(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=[],i=!0,r=!1,o=void 0;try{for(var a,s=t[Symbol.iterator]();!(i=(a=s.next()).done)&&(n.push(a.value),!e||n.length!==e);i=!0);}catch(t){r=!0,o=t}finally{try{i||null==s.return||s.return()}finally{if(r)throw o}}return n}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function s(t){return function(t){if(Array.isArray(t)){for(var e=0,n=new Array(t.length);e<t.length;e++)n[e]=t[e];return n}}(t)||function(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}c=c&&c.hasOwnProperty("default")?c.default:c;var v,t,p,d,y={linear:function(t,e,n,i){return(n-e)*t/i+e},easeInQuad:function(t,e,n,i){return(n-e)*(t/=i)*t+e},easeOutQuad:function(t,e,n,i){return-(n-e)*(t/=i)*(t-2)+e},easeInOutQuad:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t+e:-r/2*(--t*(t-2)-1)+e},easeInCubic:function(t,e,n,i){return(n-e)*(t/=i)*t*t+e},easeOutCubic:function(t,e,n,i){return(n-e)*((t=t/i-1)*t*t+1)+e},easeInOutCubic:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t*t+e:r/2*((t-=2)*t*t+2)+e},easeInQuart:function(t,e,n,i){return(n-e)*(t/=i)*t*t*t+e},easeOutQuart:function(t,e,n,i){return-(n-e)*((t=t/i-1)*t*t*t-1)+e},easeInOutQuart:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t*t*t+e:-r/2*((t-=2)*t*t*t-2)+e},easeInQuint:function(t,e,n,i){return(n-e)*(t/=i)*t*t*t*t+e},easeOutQuint:function(t,e,n,i){return(n-e)*((t=t/i-1)*t*t*t*t+1)+e},easeInOutQuint:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t*t*t*t+e:r/2*((t-=2)*t*t*t*t+2)+e},easeInSine:function(t,e,n,i){var r=n-e;return-r*Math.cos(t/i*(Math.PI/2))+r+e},easeOutSine:function(t,e,n,i){return(n-e)*Math.sin(t/i*(Math.PI/2))+e},easeInOutSine:function(t,e,n,i){return-(n-e)/2*(Math.cos(Math.PI*t/i)-1)+e},easeInExpo:function(t,e,n,i){return 0==t?e:(n-e)*Math.pow(2,10*(t/i-1))+e},easeOutExpo:function(t,e,n,i){var r=n-e;return t==i?e+r:r*(1-Math.pow(2,-10*t/i))+e},easeInOutExpo:function(t,e,n,i){var r=n-e;return 0===t?e:t===i?e+r:(t/=i/2)<1?r/2*Math.pow(2,10*(t-1))+e:r/2*(2-Math.pow(2,-10*--t))+e},easeInCirc:function(t,e,n,i){return-(n-e)*(Math.sqrt(1-(t/=i)*t)-1)+e},easeOutCirc:function(t,e,n,i){return(n-e)*Math.sqrt(1-(t=t/i-1)*t)+e},easeInOutCirc:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?-r/2*(Math.sqrt(1-t*t)-1)+e:r/2*(Math.sqrt(1-(t-=2)*t)+1)+e},easeInElastic:function(t,e,n,i){var r,o,a,s=n-e;return a=1.70158,r=s,(o=0)===t?e:1==(t/=i)?e+s:(o||(o=.3*i),a=r<Math.abs(s)?(r=s,o/4):o/(2*Math.PI)*Math.asin(s/r),-r*Math.pow(2,10*(t-=1))*Math.sin((t*i-a)*(2*Math.PI)/o)+e)},easeOutElastic:function(t,e,n,i){var r,o,a,s=n-e;return a=1.70158,r=s,(o=0)===t?e:1==(t/=i)?e+s:(o||(o=.3*i),a=r<Math.abs(s)?(r=s,o/4):o/(2*Math.PI)*Math.asin(s/r),r*Math.pow(2,-10*t)*Math.sin((t*i-a)*(2*Math.PI)/o)+s+e)},easeInOutElastic:function(t,e,n,i){var r,o,a,s=n-e;return a=1.70158,r=s,(o=0)===t?e:2==(t/=i/2)?e+s:(o||(o=i*(.3*1.5)),a=r<Math.abs(s)?(r=s,o/4):o/(2*Math.PI)*Math.asin(s/r),t<1?r*Math.pow(2,10*(t-=1))*Math.sin((t*i-a)*(2*Math.PI)/o)*-.5+e:r*Math.pow(2,-10*(t-=1))*Math.sin((t*i-a)*(2*Math.PI)/o)*.5+s+e)},easeInBack:function(t,e,n,i,r){return void 0===r&&(r=1.70158),(n-e)*(t/=i)*t*((r+1)*t-r)+e},easeOutBack:function(t,e,n,i,r){return void 0===r&&(r=1.70158),(n-e)*((t=t/i-1)*t*((r+1)*t+r)+1)+e},easeInOutBack:function(t,e,n,i,r){var o=n-e;return void 0===r&&(r=1.70158),(t/=i/2)<1?o/2*(t*t*((1+(r*=1.525))*t-r))+e:o/2*((t-=2)*t*((1+(r*=1.525))*t+r)+2)+e},easeInBounce:function(t,e,n,i){var r=n-e;return r-y.easeOutBounce(i-t,0,r,i)+e},easeOutBounce:function(t,e,n,i){var r=n-e;return(t/=i)<1/2.75?r*(7.5625*t*t)+e:t<2/2.75?r*(7.5625*(t-=1.5/2.75)*t+.75)+e:t<2.5/2.75?r*(7.5625*(t-=2.25/2.75)*t+.9375)+e:r*(7.5625*(t-=2.625/2.75)*t+.984375)+e},easeInOutBounce:function(t,e,n,i){var r=n-e;return t<i/2?.5*y.easeInBounce(2*t,0,r,i)+e:.5*y.easeOutBounce(2*t-i,0,r,i)+.5*r+e}},w=y;function b(t,e){return t+Math.random()*(e-t)}(t=v||(v={}))[t.Circle=0]="Circle",t[t.Square=1]="Square",t[t.Strip=2]="Strip",(d=p||(p={}))[d.Positive=1]="Positive",d[d.Negative=-1]="Negative";var O=function(){function s(t,e,n,i){u(this,s),h(this,"context",void 0),h(this,"radius",void 0),h(this,"x",void 0),h(this,"y",void 0),h(this,"w",void 0),h(this,"h",void 0),h(this,"vx",void 0),h(this,"vy",void 0),h(this,"shape",void 0),h(this,"angle",void 0),h(this,"angularSpin",void 0),h(this,"color",void 0),h(this,"rotateY",void 0),h(this,"rotationDirection",void 0),h(this,"getOptions",void 0),this.getOptions=e;var r,o,a=this.getOptions().colors;this.context=t,this.x=n,this.y=i,this.w=b(5,20),this.h=b(5,20),this.radius=b(5,10),this.vx=b(-4,4),this.vy=b(-10,-0),this.shape=(r=0,o=2,Math.floor(r+Math.random()*(o-r+1))),this.angle=b(0,360)*Math.PI/180,this.angularSpin=b(-.2,.2),this.color=a[Math.floor(Math.random()*a.length)],this.rotateY=b(0,1),this.rotationDirection=b(0,1)?p.Positive:p.Negative}return e(s,[{key:"update",value:function(){var t=this.getOptions(),e=t.gravity,n=t.wind,i=t.friction,r=t.opacity,o=t.drawShape;this.x+=this.vx,this.y+=this.vy,this.vy+=e,this.vx+=n,this.vx*=i,this.vy*=i,1<=this.rotateY&&this.rotationDirection===p.Positive?this.rotationDirection=p.Negative:this.rotateY<=-1&&this.rotationDirection===p.Negative&&(this.rotationDirection=p.Positive);var a=.1*this.rotationDirection;if(this.rotateY+=a,this.angle+=this.angularSpin,this.context.save(),this.context.translate(this.x,this.y),this.context.rotate(this.angle),this.context.scale(1,this.rotateY),this.context.rotate(this.angle),this.context.beginPath(),this.context.fillStyle=this.color,this.context.strokeStyle=this.color,this.context.globalAlpha=r,this.context.lineCap="round",this.context.lineWidth=2,o&&"function"==typeof o)o.call(this,this.context);else switch(this.shape){case v.Circle:this.context.beginPath(),this.context.arc(0,0,this.radius,0,2*Math.PI),this.context.fill();break;case v.Square:this.context.fillRect(-this.w/2,-this.h/2,this.w,this.h);break;case v.Strip:this.context.fillRect(-this.w/6,-this.h/2,this.w/3,this.h)}this.context.closePath(),this.context.restore()}}]),s}(),g=function t(e,n){var g=this;u(this,t),h(this,"canvas",void 0),h(this,"context",void 0),h(this,"getOptions",void 0),h(this,"x",0),h(this,"y",0),h(this,"w",0),h(this,"h",0),h(this,"lastNumberOfPieces",0),h(this,"tweenInitTime",Date.now()),h(this,"particles",[]),h(this,"particlesGenerated",0),h(this,"removeParticleAt",function(t){g.particles.splice(t,1)}),h(this,"getParticle",function(){var t=b(g.x,g.w+g.x),e=b(g.y,g.h+g.y);return new O(g.context,g.getOptions,t,e)}),h(this,"animate",function(){var n=g.canvas,t=g.context,e=g.particlesGenerated,i=g.lastNumberOfPieces,r=g.getOptions(),o=r.run,a=r.recycle,s=r.numberOfPieces,c=r.debug,u=r.tweenFunction,h=r.tweenDuration;if(!o)return!1;var f=g.particles.length,l=a?f:e,v=Date.now();if(l<s){i!==s&&(g.tweenInitTime=v,g.lastNumberOfPieces=s);for(var p=g.tweenInitTime,d=u(h<v-p?h:Math.max(0,v-p),l,s,h),y=Math.round(d-l),w=0;w<y;w++)g.particles.push(g.getParticle());g.particlesGenerated+=y}return c&&(t.font="12px sans-serif",t.fillStyle="#333",t.textAlign="right",t.fillText("Particles: ".concat(f),n.width-10,n.height-20)),g.particles.forEach(function(t,e){t.update(),(t.y>n.height||t.y<-100||t.x>n.width+100||t.x<-100)&&(a&&l<=s?g.particles[e]=g.getParticle():g.removeParticleAt(e))}),0<f||l<s}),this.canvas=e;var i=this.canvas.getContext("2d");if(!i)throw new Error("Could not get canvas context");this.context=i,this.getOptions=n},x={width:"undefined"!=typeof window?window.innerWidth:300,height:"undefined"!=typeof window?window.innerHeight:200,numberOfPieces:200,friction:.99,wind:0,gravity:.1,colors:["#f44336","#e91e63","#9c27b0","#673ab7","#3f51b5","#2196f3","#03a9f4","#00bcd4","#009688","#4CAF50","#8BC34A","#CDDC39","#FFEB3B","#FFC107","#FF9800","#FF5722","#795548"],opacity:1,debug:!1,tweenFunction:w.easeInOutQuad,tweenDuration:5e3,recycle:!0,run:!0},M=function(){function r(t,e){var i=this;u(this,r),h(this,"canvas",void 0),h(this,"context",void 0),h(this,"_options",void 0),h(this,"generator",void 0),h(this,"setOptionsWithDefaults",function(t){var e={confettiSource:{x:0,y:0,w:i.canvas.width,h:0}};i._options=o({},e,x,t),Object.assign(i,t.confettiSource)}),h(this,"update",function(){var t=i.options.run,e=i.canvas,n=i.context;t&&(n.fillStyle="white",n.clearRect(0,0,e.width,e.height)),i.generator.animate()?requestAnimationFrame(i.update):i._options.run=!1}),this.canvas=t;var n=this.canvas.getContext("2d");if(!n)throw new Error("Could not get canvas context");this.context=n,this.generator=new g(this.canvas,function(){return i.options}),this.options=e,this.update()}return e(r,[{key:"options",get:function(){return this._options},set:function(t){var e=this._options&&this._options.run;this.setOptionsWithDefaults(t),this.generator&&Object.assign(this.generator,this.options.confettiSource),"boolean"==typeof t.run&&t.run&&!1===e&&this.update()}}]),r}(),P=function(t){function s(){var t,e,n,i;u(this,s);for(var r=arguments.length,o=new Array(r),a=0;a<r;a++)o[a]=arguments[a];return n=this,h(l(e=!(i=(t=f(s)).call.apply(t,[this].concat(o)))||"object"!=typeof i&&"function"!=typeof i?l(n):i),"canvas",c.createRef()),h(l(e),"confetti",void 0),e}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&n(t,e)}(s,c.Component),e(s,[{key:"componentDidMount",value:function(){if(this.canvas.current){var t=I(this.props)[0];this.confetti=new M(this.canvas.current,t)}}},{key:"componentWillReceiveProps",value:function(t){var e=I(t)[0];this.confetti&&(this.confetti.options=e)}},{key:"render",value:function(){var t=a(I(this.props),2),e=t[0],n=t[1],i=o({zIndex:2,position:"absolute",top:0,left:0,bottom:0,right:0},n.style);return c.createElement("canvas",r({width:e.width,height:e.height,ref:this.canvas},n,{style:i}))}}]),s}();function I(t){var e={},n={},i=[].concat(s(Object.keys(x)),["confettiSource","drawShape"]);for(var r in t){var o=t[r];i.includes(r)?e[r]=o:n[r]=o}return[e,n]}return h(P,"defaultProps",o({},x)),P});
//# sourceMappingURL=react-confetti.min.js.map
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react")):"function"==typeof define&&define.amd?define(["react"],e):"object"==typeof exports?exports.ReactConfetti=e(require("react")):t.ReactConfetti=e(t.React)}("undefined"!=typeof self?self:this,function(t){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(i,r,function(e){return t[e]}.bind(null,r));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=2)}([function(e,n){e.exports=t},function(t,e,n){"use strict";var i={linear:function(t,e,n,i){return(n-e)*t/i+e},easeInQuad:function(t,e,n,i){return(n-e)*(t/=i)*t+e},easeOutQuad:function(t,e,n,i){return-(n-e)*(t/=i)*(t-2)+e},easeInOutQuad:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t+e:-r/2*(--t*(t-2)-1)+e},easeInCubic:function(t,e,n,i){return(n-e)*(t/=i)*t*t+e},easeOutCubic:function(t,e,n,i){return(n-e)*((t=t/i-1)*t*t+1)+e},easeInOutCubic:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t*t+e:r/2*((t-=2)*t*t+2)+e},easeInQuart:function(t,e,n,i){return(n-e)*(t/=i)*t*t*t+e},easeOutQuart:function(t,e,n,i){return-(n-e)*((t=t/i-1)*t*t*t-1)+e},easeInOutQuart:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t*t*t+e:-r/2*((t-=2)*t*t*t-2)+e},easeInQuint:function(t,e,n,i){return(n-e)*(t/=i)*t*t*t*t+e},easeOutQuint:function(t,e,n,i){return(n-e)*((t=t/i-1)*t*t*t*t+1)+e},easeInOutQuint:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?r/2*t*t*t*t*t+e:r/2*((t-=2)*t*t*t*t+2)+e},easeInSine:function(t,e,n,i){var r=n-e;return-r*Math.cos(t/i*(Math.PI/2))+r+e},easeOutSine:function(t,e,n,i){return(n-e)*Math.sin(t/i*(Math.PI/2))+e},easeInOutSine:function(t,e,n,i){return-(n-e)/2*(Math.cos(Math.PI*t/i)-1)+e},easeInExpo:function(t,e,n,i){return 0==t?e:(n-e)*Math.pow(2,10*(t/i-1))+e},easeOutExpo:function(t,e,n,i){var r=n-e;return t==i?e+r:r*(1-Math.pow(2,-10*t/i))+e},easeInOutExpo:function(t,e,n,i){var r=n-e;return 0===t?e:t===i?e+r:(t/=i/2)<1?r/2*Math.pow(2,10*(t-1))+e:r/2*(2-Math.pow(2,-10*--t))+e},easeInCirc:function(t,e,n,i){return-(n-e)*(Math.sqrt(1-(t/=i)*t)-1)+e},easeOutCirc:function(t,e,n,i){return(n-e)*Math.sqrt(1-(t=t/i-1)*t)+e},easeInOutCirc:function(t,e,n,i){var r=n-e;return(t/=i/2)<1?-r/2*(Math.sqrt(1-t*t)-1)+e:r/2*(Math.sqrt(1-(t-=2)*t)+1)+e},easeInElastic:function(t,e,n,i){var r,o,a,s=n-e;return a=1.70158,0===t?e:1==(t/=i)?e+s:((o=0)||(o=.3*i),(r=s)<Math.abs(s)?(r=s,a=o/4):a=o/(2*Math.PI)*Math.asin(s/r),-r*Math.pow(2,10*(t-=1))*Math.sin((t*i-a)*(2*Math.PI)/o)+e)},easeOutElastic:function(t,e,n,i){var r,o,a,s=n-e;return a=1.70158,0===t?e:1==(t/=i)?e+s:((o=0)||(o=.3*i),(r=s)<Math.abs(s)?(r=s,a=o/4):a=o/(2*Math.PI)*Math.asin(s/r),r*Math.pow(2,-10*t)*Math.sin((t*i-a)*(2*Math.PI)/o)+s+e)},easeInOutElastic:function(t,e,n,i){var r,o,a,s=n-e;return a=1.70158,0===t?e:2==(t/=i/2)?e+s:((o=0)||(o=i*(.3*1.5)),(r=s)<Math.abs(s)?(r=s,a=o/4):a=o/(2*Math.PI)*Math.asin(s/r),t<1?r*Math.pow(2,10*(t-=1))*Math.sin((t*i-a)*(2*Math.PI)/o)*-.5+e:r*Math.pow(2,-10*(t-=1))*Math.sin((t*i-a)*(2*Math.PI)/o)*.5+s+e)},easeInBack:function(t,e,n,i,r){return void 0===r&&(r=1.70158),(n-e)*(t/=i)*t*((r+1)*t-r)+e},easeOutBack:function(t,e,n,i,r){return void 0===r&&(r=1.70158),(n-e)*((t=t/i-1)*t*((r+1)*t+r)+1)+e},easeInOutBack:function(t,e,n,i,r){var o=n-e;return void 0===r&&(r=1.70158),(t/=i/2)<1?o/2*(t*t*((1+(r*=1.525))*t-r))+e:o/2*((t-=2)*t*((1+(r*=1.525))*t+r)+2)+e},easeInBounce:function(t,e,n,r){var o=n-e;return o-i.easeOutBounce(r-t,0,o,r)+e},easeOutBounce:function(t,e,n,i){var r=n-e;return(t/=i)<1/2.75?r*(7.5625*t*t)+e:t<2/2.75?r*(7.5625*(t-=1.5/2.75)*t+.75)+e:t<2.5/2.75?r*(7.5625*(t-=2.25/2.75)*t+.9375)+e:r*(7.5625*(t-=2.625/2.75)*t+.984375)+e},easeInOutBounce:function(t,e,n,r){var o=n-e;return t<r/2?.5*i.easeInBounce(2*t,0,o,r)+e:.5*i.easeOutBounce(2*t-r,0,o,r)+.5*o+e}};t.exports=i},function(t,e,n){t.exports=n(3)},function(t,e,n){"use strict";n.r(e);var i,r,o=n(0),a=n.n(o),s=n(1),c=n.n(s);function u(t,e){return t+Math.random()*(e-t)}function h(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function f(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}!function(t){t[t.Circle=0]="Circle",t[t.Square=1]="Square",t[t.Strip=2]="Strip"}(i||(i={})),function(t){t[t.Positive=1]="Positive",t[t.Negative=-1]="Negative"}(r||(r={}));var l=function(){function t(e,n,i,o){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),f(this,"context",void 0),f(this,"radius",void 0),f(this,"x",void 0),f(this,"y",void 0),f(this,"w",void 0),f(this,"h",void 0),f(this,"vx",void 0),f(this,"vy",void 0),f(this,"shape",void 0),f(this,"angle",void 0),f(this,"angularSpin",void 0),f(this,"color",void 0),f(this,"rotateY",void 0),f(this,"rotationDirection",void 0),f(this,"getOptions",void 0),this.getOptions=n;var a,s,c=this.getOptions().colors;this.context=e,this.x=i,this.y=o,this.w=u(5,20),this.h=u(5,20),this.radius=u(5,10),this.vx=u(-4,4),this.vy=u(-10,-0),this.shape=(a=0,s=2,Math.floor(a+Math.random()*(s-a+1))),this.angle=u(0,360)*Math.PI/180,this.angularSpin=u(-.2,.2),this.color=c[Math.floor(Math.random()*c.length)],this.rotateY=u(0,1),this.rotationDirection=u(0,1)?r.Positive:r.Negative}var e,n,o;return e=t,(n=[{key:"update",value:function(){var t=this.getOptions(),e=t.gravity,n=t.wind,o=t.friction,a=t.opacity,s=t.drawShape;this.x+=this.vx,this.y+=this.vy,this.vy+=e,this.vx+=n,this.vx*=o,this.vy*=o,this.rotateY>=1&&this.rotationDirection===r.Positive?this.rotationDirection=r.Negative:this.rotateY<=-1&&this.rotationDirection===r.Negative&&(this.rotationDirection=r.Positive);var c=.1*this.rotationDirection;if(this.rotateY+=c,this.angle+=this.angularSpin,this.context.save(),this.context.translate(this.x,this.y),this.context.rotate(this.angle),this.context.scale(1,this.rotateY),this.context.rotate(this.angle),this.context.beginPath(),this.context.fillStyle=this.color,this.context.strokeStyle=this.color,this.context.globalAlpha=a,this.context.lineCap="round",this.context.lineWidth=2,s&&"function"==typeof s)s.call(this,this.context);else switch(this.shape){case i.Circle:this.context.beginPath(),this.context.arc(0,0,this.radius,0,2*Math.PI),this.context.fill();break;case i.Square:this.context.fillRect(-this.w/2,-this.h/2,this.w,this.h);break;case i.Strip:this.context.fillRect(-this.w/6,-this.h/2,this.w/3,this.h)}this.context.closePath(),this.context.restore()}}])&&h(e.prototype,n),o&&h(e,o),t}();function p(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}var v=function t(e,n){var i=this;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),p(this,"canvas",void 0),p(this,"context",void 0),p(this,"getOptions",void 0),p(this,"x",0),p(this,"y",0),p(this,"w",0),p(this,"h",0),p(this,"lastNumberOfPieces",0),p(this,"tweenInitTime",Date.now()),p(this,"particles",[]),p(this,"particlesGenerated",0),p(this,"removeParticleAt",function(t){i.particles.splice(t,1)}),p(this,"getParticle",function(){var t=u(i.x,i.w+i.x),e=u(i.y,i.h+i.y);return new l(i.context,i.getOptions,t,e)}),p(this,"animate",function(){var t=i.canvas,e=i.context,n=i.particlesGenerated,r=i.lastNumberOfPieces,o=i.getOptions(),a=o.run,s=o.recycle,c=o.numberOfPieces,u=o.debug,h=o.tweenFunction,f=o.tweenDuration;if(!a)return!1;var l=i.particles.length,p=s?l:n,v=Date.now();if(p<c){r!==c&&(i.tweenInitTime=v,i.lastNumberOfPieces=c);for(var y=i.tweenInitTime,d=h(v-y>f?f:Math.max(0,v-y),p,c,f),b=Math.round(d-p),g=0;g<b;g++)i.particles.push(i.getParticle());i.particlesGenerated+=b}return u&&(e.font="12px sans-serif",e.fillStyle="#333",e.textAlign="right",e.fillText("Particles: ".concat(l),t.width-10,t.height-20)),i.particles.forEach(function(e,n){e.update(),(e.y>t.height||e.y<-100||e.x>t.width+100||e.x<-100)&&(s&&p<=c?i.particles[n]=i.getParticle():i.removeParticleAt(n))}),l>0||p<c}),this.canvas=e;var r=this.canvas.getContext("2d");if(!r)throw new Error("Could not get canvas context");this.context=r,this.getOptions=n};function y(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function d(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}var b={width:"undefined"!=typeof window?window.innerWidth:300,height:"undefined"!=typeof window?window.innerHeight:200,numberOfPieces:200,friction:.99,wind:0,gravity:.1,colors:["#f44336","#e91e63","#9c27b0","#673ab7","#3f51b5","#2196f3","#03a9f4","#00bcd4","#009688","#4CAF50","#8BC34A","#CDDC39","#FFEB3B","#FFC107","#FF9800","#FF5722","#795548"],opacity:1,debug:!1,tweenFunction:c.a.easeInOutQuad,tweenDuration:5e3,recycle:!0,run:!0},g=function(){function t(e,n){var i=this;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),d(this,"canvas",void 0),d(this,"context",void 0),d(this,"_options",void 0),d(this,"generator",void 0),d(this,"setOptionsWithDefaults",function(t){var e={confettiSource:{x:0,y:0,w:i.canvas.width,h:0}};i._options=function(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable}))),i.forEach(function(e){d(t,e,n[e])})}return t}({},e,b,t),Object.assign(i,t.confettiSource)}),d(this,"update",function(){var t=i.options.run,e=i.canvas,n=i.context;t&&(n.fillStyle="white",n.clearRect(0,0,e.width,e.height)),i.generator.animate()?requestAnimationFrame(i.update):i._options.run=!1}),this.canvas=e;var r=this.canvas.getContext("2d");if(!r)throw new Error("Could not get canvas context");this.context=r,this.generator=new v(this.canvas,function(){return i.options}),this.options=n,this.update()}var e,n,i;return e=t,(n=[{key:"options",get:function(){return this._options},set:function(t){var e=this._options&&this._options.run;this.setOptionsWithDefaults(t),this.generator&&Object.assign(this.generator,this.options.confettiSource),"boolean"==typeof t.run&&t.run&&!1===e&&this.update()}}])&&y(e.prototype,n),i&&y(e,i),t}();function w(t){return(w="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function O(t){return function(t){if(Array.isArray(t)){for(var e=0,n=new Array(t.length);e<t.length;e++)n[e]=t[e];return n}}(t)||function(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance")}()}function x(){return(x=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t}).apply(this,arguments)}function m(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{},i=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(i=i.concat(Object.getOwnPropertySymbols(n).filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable}))),i.forEach(function(e){C(t,e,n[e])})}return t}function P(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=[],i=!0,r=!1,o=void 0;try{for(var a,s=t[Symbol.iterator]();!(i=(a=s.next()).done)&&(n.push(a.value),!e||n.length!==e);i=!0);}catch(t){r=!0,o=t}finally{try{i||null==s.return||s.return()}finally{if(r)throw o}}return n}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function M(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function I(t){return(I=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function S(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function j(t,e){return(j=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function C(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}n.d(e,"ReactConfetti",function(){return E});var E=function(t){function e(){var t,n,i,r;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,e);for(var o=arguments.length,s=new Array(o),c=0;c<o;c++)s[c]=arguments[c];return i=this,n=!(r=(t=I(e)).call.apply(t,[this].concat(s)))||"object"!==w(r)&&"function"!=typeof r?S(i):r,C(S(n),"canvas",a.a.createRef()),C(S(n),"confetti",void 0),n}var n,i,r;return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&j(t,e)}(e,o["Component"]),n=e,(i=[{key:"componentDidMount",value:function(){if(this.canvas.current){var t=_(this.props)[0];this.confetti=new g(this.canvas.current,t)}}},{key:"componentWillReceiveProps",value:function(t){var e=_(t)[0];this.confetti&&(this.confetti.options=e)}},{key:"render",value:function(){var t=P(_(this.props),2),e=t[0],n=t[1],i=m({zIndex:2,position:"absolute",top:0,left:0,bottom:0,right:0},n.style);return a.a.createElement("canvas",x({width:e.width,height:e.height,ref:this.canvas},n,{style:i}))}}])&&M(n.prototype,i),r&&M(n,r),e}();function _(t){var e={},n={},i=[].concat(O(Object.keys(b)),["confettiSource","drawShape"]);for(var r in t){var o=t[r];i.includes(r)?e[r]=o:n[r]=o}return[e,n]}C(E,"defaultProps",m({},b));e.default=E}]).default});
//# sourceMappingURL=react-confetti.min.js.map

66

dist/types/Confetti.d.ts
import { IRect } from './Rect';
import ParticleGenerator from './ParticleGenerator';
export interface IConfettiOptions {
/**
* Width of the component
* @default window.width
*/
width: number;
/**
* Height of the component
* @default window.height
*/
height: number;
/**
* Max number of confetti pieces to render.
* @default 200
*/
numberOfPieces: number;
/**
* Slows movement of pieces. (lower number = slower confetti)
* @default 0.99
*/
friction: number;
/**
* Blows confetti along the X axis.
* @default 0
*/
wind: number;
/**
* How fast it falls (pixels per frame)
* @default 0.1
*/
gravity: number;
/**
* Array of colors to choose from.
*/
colors: string[];
/**
* Opacity of the confetti.
* @default 1
*/
opacity: number;
/**
* If false, only numberOfPieces will be emitted and then stops. If true, when a confetto goes offscreen, a new one will be emitted.
* @default true
*/
recycle: boolean;
/**
* If false, stops the requestAnimationFrame loop.
* @default true
*/
run: boolean;
/**
* Renders some debug text on the canvas.
* @default false
*/
debug: boolean;
/**
* A Rect defining the area where the confetti will spawn.
* @default {
* x: 0,
* y: 0,
* w: canvas.width,
* h: 0
* }
*/
confettiSource: IRect;
/**
* Controls the rate at which confetti is spawned.
* @default easeInOutQuad
*/
tweenFunction: (currentTime: number, currentValue: number, targetValue: number, duration: number, s?: number) => number;
/**
* Number of milliseconds it should take to spawn numberOfPieces.
* @default 5000
*/
tweenDuration: number;
/**
* Function to draw your own confetti shapes.
*/
drawShape?: (context: CanvasRenderingContext2D) => void;
}
export declare const confettiDefaults: Pick<IConfettiOptions, Exclude<keyof IConfettiOptions, 'confettiSource'>>;
export default class Confetti {
export declare class Confetti {
constructor(canvas: HTMLCanvasElement, opts: Partial<IConfettiOptions>);

@@ -31,1 +94,2 @@ canvas: HTMLCanvasElement;

}
export default Confetti;

13

dist/types/ReactConfetti.d.ts

@@ -1,9 +0,6 @@

import React, { CanvasHTMLAttributes } from 'react';
import React, { Component, CanvasHTMLAttributes } from 'react';
import Confetti, { IConfettiOptions } from './Confetti';
interface ComponentProps extends IConfettiOptions {
[key: string]: any;
}
export declare type Props = ComponentProps & CanvasHTMLAttributes<HTMLCanvasElement>;
export default class ReactConfetti extends React.Component<Props> {
static defaultProps: {
export declare type Props = Partial<IConfettiOptions> & CanvasHTMLAttributes<HTMLCanvasElement>;
export declare class ReactConfetti extends Component<Props> {
static readonly defaultProps: {
colors: string[];

@@ -30,2 +27,2 @@ gravity: number;

}
export {};
export default ReactConfetti;

40

package.json
{
"name": "react-confetti",
"version": "2.6.1",
"version": "2.7.0",
"description": "React component to draw confetti for your party.",
"main": "dist/react-confetti.min.js",
"types": "dist/types/ReactConfetti.d.ts",
"types": "dist/types/",
"repository": {

@@ -30,5 +30,9 @@ "type": "git",

"scripts": {
"build": "tsc && rollup -c",
"build": "yarn build-types && yarn build-transpile && yarn build-bundle",
"build-types": "tsc",
"build-transpile": "babel src --out-dir dist --extensions \".ts\"",
"build-bundle": "webpack",
"build-storybook": "build-storybook",
"prebuild": "yarn clean",
"develop": "rollup -c -w",
"watch": "webpack --watch",
"test": "tsc; yarn run lint",

@@ -38,5 +42,6 @@ "clean": "git clean -xfd dist/",

"lint": "eslint . --ext .js --ext .ts --ext .tsx",
"prepare": "yarn run clean && yarn run lint && yarn run build",
"prepare": "yarn run lint && yarn run build",
"semantic-release": "semantic-release",
"commit": "git-cz"
"commit": "git-cz",
"develop": "start-storybook -p 3000"
},

@@ -51,2 +56,3 @@ "peerDependencies": {

"devDependencies": {
"@babel/cli": "^7.2.3",
"@babel/core": "^7.1.6",

@@ -64,2 +70,9 @@ "@babel/plugin-proposal-class-properties": "^7.3.4",

"@semantic-release/release-notes-generator": "^7.1.4",
"@storybook/addon-actions": "^5.0.1",
"@storybook/addon-info": "^5.0.1",
"@storybook/addon-knobs": "^5.0.1",
"@storybook/addon-links": "^5.0.1",
"@storybook/addon-storysource": "^5.0.1",
"@storybook/addons": "^5.0.1",
"@storybook/react": "^5.0.1",
"@types/react": "^16.8.6",

@@ -69,2 +82,3 @@ "@typescript-eslint/eslint-plugin": "^1.4.2",

"babel-eslint": "^10.0.1",
"babel-loader": "^8.0.5",
"commitizen": "^3.0.7",

@@ -84,13 +98,9 @@ "cz-conventional-changelog": "^2.1.0",

"react": "^16.2.0",
"react-docgen-typescript-loader": "^3.0.1",
"react-dom": "^16.2.0",
"rollup": "^1.4.0",
"rollup-plugin-babel": "^4.3.2",
"rollup-plugin-commonjs": "^9.2.1",
"rollup-plugin-node-resolve": "^4.0.1",
"rollup-plugin-uglify": "^6.0.2",
"react-use": "^5.5.6",
"semantic-release": "^15.1.7",
"stylelint": "^9.10.1",
"stylelint-config-rational-order": "^0.0.4",
"stylelint-config-standard": "^18.2.0",
"typescript": "^3.3.3333"
"typescript": "^3.3.3333",
"webpack": "^4.29.6",
"webpack-cli": "^3.2.3"
},

@@ -97,0 +107,0 @@ "config": {

dist/react-confetti.js.map

Sorry, the diff of this file is not supported yet

dist/react-confetti.min.js.map

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

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

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc